@koobiq/components 20.4.2 → 21.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/accordion/accordion-trigger.scss +3 -10
- package/accordion/accordion.scss +4 -6
- package/actions-panel/actions-panel-container.scss +45 -1
- package/alert/alert.component.scss +3 -2
- package/app-switcher/_app-switcher-theme.scss +0 -4
- package/app-switcher/app-switcher-dropdown-app.scss +3 -2
- package/app-switcher/app-switcher-dropdown-site.scss +2 -1
- package/app-switcher/{kbq-app-switcher-list-item.scss → app-switcher-list-item.scss} +18 -4
- package/app-switcher/app-switcher-tokens.scss +15 -0
- package/app-switcher/app-switcher.scss +14 -4
- package/autocomplete/autocomplete.scss +7 -6
- package/badge/badge.component.scss +5 -8
- package/breadcrumbs/breadcrumbs.scss +25 -10
- package/button/_button-base.scss +30 -7
- package/button/_button-theme.scss +16 -0
- package/button/button-group.scss +7 -0
- package/button/button-tokens.scss +0 -2
- package/button/button.scss +34 -2
- package/button-toggle/_button-toggle-theme.scss +7 -2
- package/button-toggle/button-toggle.scss +65 -15
- package/checkbox/_checkbox-theme.scss +4 -3
- package/checkbox/checkbox.scss +3 -6
- package/clamped-text/clamped-text.scss +6 -2
- package/code-block/code-block-tokens.scss +0 -224
- package/code-block/code-block.scss +20 -9
- package/content-panel/content-panel-aside.scss +3 -2
- package/content-panel/content-panel-container.scss +37 -0
- package/content-panel/content-panel.scss +4 -3
- package/core/highlight/_highlight-theme.scss +3 -1
- package/core/option/action-container.scss +2 -2
- package/core/option/action.scss +2 -1
- package/core/option/option.scss +2 -1
- package/core/pop-up/_pop-up.scss +0 -37
- package/core/selection/pseudo-checkbox/pseudo-checkbox.scss +5 -10
- package/core/styles/_core.scss +3 -0
- package/core/styles/_koobiq-theme.scss +5 -6
- package/core/styles/common/_animation.scss +44 -16
- package/core/styles/common/_groups-mixins.scss +21 -19
- package/core/styles/common/_groups.scss +4 -32
- package/core/styles/common/_index.scss +0 -2
- package/core/styles/common/_link.scss +117 -0
- package/core/styles/common/_list.scss +0 -26
- package/core/styles/common/_overlay.scss +8 -10
- package/core/styles/common/_rtl.scss +0 -14
- package/core/styles/common/_select.scss +33 -15
- package/core/styles/common/_squircle.scss +63 -0
- package/core/styles/common/_tokens.scss +0 -11
- package/core/styles/common/_vendor-prefixes.scss +0 -20
- package/core/styles/functions/_timing.scss +0 -22
- package/core/styles/theming/_scrollbar-theme.scss +6 -1
- package/core/styles/theming/_theming.scss +13 -65
- package/core/styles/typography/_index.scss +0 -1
- package/core/styles/typography/_typography.scss +0 -143
- package/core/styles/visual/_body.scss +1 -6
- package/core/styles/visual/_layout.scss +0 -12
- package/datepicker/calendar-body.scss +3 -1
- package/datepicker/calendar-header.scss +0 -1
- package/datepicker/datepicker-content.scss +33 -1
- package/datepicker/datepicker-toggle.scss +0 -38
- package/dl/dl-tokens.scss +10 -0
- package/dl/dl.scss +113 -13
- package/dropdown/_dropdown-theme.scss +4 -16
- package/dropdown/dropdown-item.scss +4 -10
- package/dropdown/dropdown.scss +2 -1
- package/empty-state/_empty-state-theme.scss +10 -4
- package/empty-state/empty-state-tokens.scss +4 -4
- package/empty-state/empty-state.scss +4 -0
- package/fesm2022/koobiq-components-accordion.mjs +347 -229
- package/fesm2022/koobiq-components-accordion.mjs.map +1 -1
- package/fesm2022/koobiq-components-actions-panel.mjs +302 -187
- package/fesm2022/koobiq-components-actions-panel.mjs.map +1 -1
- package/fesm2022/koobiq-components-alert.mjs +39 -39
- package/fesm2022/koobiq-components-alert.mjs.map +1 -1
- package/fesm2022/koobiq-components-app-switcher.mjs +677 -367
- package/fesm2022/koobiq-components-app-switcher.mjs.map +1 -1
- package/fesm2022/koobiq-components-autocomplete.mjs +620 -253
- package/fesm2022/koobiq-components-autocomplete.mjs.map +1 -1
- package/fesm2022/koobiq-components-badge.mjs +46 -48
- package/fesm2022/koobiq-components-badge.mjs.map +1 -1
- package/fesm2022/koobiq-components-breadcrumbs.mjs +221 -169
- package/fesm2022/koobiq-components-breadcrumbs.mjs.map +1 -1
- package/fesm2022/koobiq-components-button-toggle.mjs +565 -196
- package/fesm2022/koobiq-components-button-toggle.mjs.map +1 -1
- package/fesm2022/koobiq-components-button.mjs +332 -116
- package/fesm2022/koobiq-components-button.mjs.map +1 -1
- package/fesm2022/koobiq-components-checkbox.mjs +172 -132
- package/fesm2022/koobiq-components-checkbox.mjs.map +1 -1
- package/fesm2022/koobiq-components-clamped-text.mjs +165 -158
- package/fesm2022/koobiq-components-clamped-text.mjs.map +1 -1
- package/fesm2022/koobiq-components-code-block.mjs +791 -609
- package/fesm2022/koobiq-components-code-block.mjs.map +1 -1
- package/fesm2022/koobiq-components-content-panel.mjs +260 -143
- package/fesm2022/koobiq-components-content-panel.mjs.map +1 -1
- package/fesm2022/koobiq-components-core.mjs +4342 -1595
- package/fesm2022/koobiq-components-core.mjs.map +1 -1
- package/fesm2022/koobiq-components-datepicker.mjs +1713 -1606
- package/fesm2022/koobiq-components-datepicker.mjs.map +1 -1
- package/fesm2022/koobiq-components-divider.mjs +73 -36
- package/fesm2022/koobiq-components-divider.mjs.map +1 -1
- package/fesm2022/koobiq-components-dl.mjs +447 -89
- package/fesm2022/koobiq-components-dl.mjs.map +1 -1
- package/fesm2022/koobiq-components-dropdown.mjs +703 -599
- package/fesm2022/koobiq-components-dropdown.mjs.map +1 -1
- package/fesm2022/koobiq-components-dynamic-translation.mjs +20 -20
- package/fesm2022/koobiq-components-dynamic-translation.mjs.map +1 -1
- package/fesm2022/koobiq-components-ellipsis-center.mjs +46 -31
- package/fesm2022/koobiq-components-ellipsis-center.mjs.map +1 -1
- package/fesm2022/koobiq-components-empty-state.mjs +116 -60
- package/fesm2022/koobiq-components-empty-state.mjs.map +1 -1
- package/fesm2022/koobiq-components-file-upload.mjs +550 -290
- package/fesm2022/koobiq-components-file-upload.mjs.map +1 -1
- package/fesm2022/koobiq-components-filter-bar.mjs +2871 -2595
- package/fesm2022/koobiq-components-filter-bar.mjs.map +1 -1
- package/fesm2022/koobiq-components-flag.mjs +79 -24
- package/fesm2022/koobiq-components-flag.mjs.map +1 -1
- package/fesm2022/koobiq-components-form-field.mjs +389 -525
- package/fesm2022/koobiq-components-form-field.mjs.map +1 -1
- package/fesm2022/koobiq-components-icon.mjs +400 -149
- package/fesm2022/koobiq-components-icon.mjs.map +1 -1
- package/fesm2022/koobiq-components-inline-edit.mjs +429 -212
- package/fesm2022/koobiq-components-inline-edit.mjs.map +1 -1
- package/fesm2022/koobiq-components-input.mjs +601 -459
- package/fesm2022/koobiq-components-input.mjs.map +1 -1
- package/fesm2022/koobiq-components-link-deprecated.mjs +196 -0
- package/fesm2022/koobiq-components-link-deprecated.mjs.map +1 -0
- package/fesm2022/koobiq-components-link.mjs +328 -125
- package/fesm2022/koobiq-components-link.mjs.map +1 -1
- package/fesm2022/koobiq-components-list.mjs +583 -433
- package/fesm2022/koobiq-components-list.mjs.map +1 -1
- package/fesm2022/koobiq-components-loader-overlay.mjs +167 -68
- package/fesm2022/koobiq-components-loader-overlay.mjs.map +1 -1
- package/fesm2022/koobiq-components-markdown.mjs +55 -78
- package/fesm2022/koobiq-components-markdown.mjs.map +1 -1
- package/fesm2022/koobiq-components-modal.mjs +853 -475
- package/fesm2022/koobiq-components-modal.mjs.map +1 -1
- package/fesm2022/koobiq-components-navbar.mjs +895 -556
- package/fesm2022/koobiq-components-navbar.mjs.map +1 -1
- package/fesm2022/koobiq-components-notification-center.mjs +680 -310
- package/fesm2022/koobiq-components-notification-center.mjs.map +1 -1
- package/fesm2022/koobiq-components-overflow-items.mjs +46 -64
- package/fesm2022/koobiq-components-overflow-items.mjs.map +1 -1
- package/fesm2022/koobiq-components-popover.mjs +684 -285
- package/fesm2022/koobiq-components-popover.mjs.map +1 -1
- package/fesm2022/koobiq-components-progress-bar.mjs +87 -33
- package/fesm2022/koobiq-components-progress-bar.mjs.map +1 -1
- package/fesm2022/koobiq-components-progress-spinner.mjs +52 -43
- package/fesm2022/koobiq-components-progress-spinner.mjs.map +1 -1
- package/fesm2022/koobiq-components-radio.mjs +450 -231
- package/fesm2022/koobiq-components-radio.mjs.map +1 -1
- package/fesm2022/koobiq-components-resizer.mjs +127 -21
- package/fesm2022/koobiq-components-resizer.mjs.map +1 -1
- package/fesm2022/koobiq-components-scrollbar-deprecated.mjs +299 -0
- package/fesm2022/koobiq-components-scrollbar-deprecated.mjs.map +1 -0
- package/fesm2022/koobiq-components-scrollbar.mjs +745 -222
- package/fesm2022/koobiq-components-scrollbar.mjs.map +1 -1
- package/fesm2022/koobiq-components-search-expandable.mjs +288 -126
- package/fesm2022/koobiq-components-search-expandable.mjs.map +1 -1
- package/fesm2022/koobiq-components-select.mjs +883 -693
- package/fesm2022/koobiq-components-select.mjs.map +1 -1
- package/fesm2022/koobiq-components-sidebar.mjs +207 -88
- package/fesm2022/koobiq-components-sidebar.mjs.map +1 -1
- package/fesm2022/koobiq-components-sidepanel.mjs +689 -296
- package/fesm2022/koobiq-components-sidepanel.mjs.map +1 -1
- package/fesm2022/koobiq-components-skeleton.mjs +815 -41
- package/fesm2022/koobiq-components-skeleton.mjs.map +1 -1
- package/fesm2022/koobiq-components-split-button.mjs +109 -88
- package/fesm2022/koobiq-components-split-button.mjs.map +1 -1
- package/fesm2022/koobiq-components-splitter-deprecated.mjs +591 -0
- package/fesm2022/koobiq-components-splitter-deprecated.mjs.map +1 -0
- package/fesm2022/koobiq-components-splitter.mjs +890 -501
- package/fesm2022/koobiq-components-splitter.mjs.map +1 -1
- package/fesm2022/koobiq-components-table.mjs +63 -49
- package/fesm2022/koobiq-components-table.mjs.map +1 -1
- package/fesm2022/koobiq-components-tabs.mjs +1062 -603
- package/fesm2022/koobiq-components-tabs.mjs.map +1 -1
- package/fesm2022/koobiq-components-tags.mjs +886 -733
- package/fesm2022/koobiq-components-tags.mjs.map +1 -1
- package/fesm2022/koobiq-components-textarea.mjs +213 -185
- package/fesm2022/koobiq-components-textarea.mjs.map +1 -1
- package/fesm2022/koobiq-components-time-range.mjs +299 -147
- package/fesm2022/koobiq-components-time-range.mjs.map +1 -1
- package/fesm2022/koobiq-components-timepicker.mjs +233 -245
- package/fesm2022/koobiq-components-timepicker.mjs.map +1 -1
- package/fesm2022/koobiq-components-timezone.mjs +344 -142
- package/fesm2022/koobiq-components-timezone.mjs.map +1 -1
- package/fesm2022/koobiq-components-title.mjs +229 -145
- package/fesm2022/koobiq-components-title.mjs.map +1 -1
- package/fesm2022/koobiq-components-toast.mjs +463 -143
- package/fesm2022/koobiq-components-toast.mjs.map +1 -1
- package/fesm2022/koobiq-components-toggle.mjs +177 -130
- package/fesm2022/koobiq-components-toggle.mjs.map +1 -1
- package/fesm2022/koobiq-components-tooltip.mjs +657 -214
- package/fesm2022/koobiq-components-tooltip.mjs.map +1 -1
- package/fesm2022/koobiq-components-top-bar.mjs +61 -32
- package/fesm2022/koobiq-components-top-bar.mjs.map +1 -1
- package/fesm2022/koobiq-components-tree-select.mjs +734 -488
- package/fesm2022/koobiq-components-tree-select.mjs.map +1 -1
- package/fesm2022/koobiq-components-tree.mjs +1700 -617
- package/fesm2022/koobiq-components-tree.mjs.map +1 -1
- package/fesm2022/koobiq-components-username.mjs +290 -135
- package/fesm2022/koobiq-components-username.mjs.map +1 -1
- package/file-upload/dropzone.scss +31 -3
- package/file-upload/file-upload-tokens.scss +2 -22
- package/file-upload/file-upload.scss +6 -0
- package/file-upload/multiple-file-upload.component.scss +14 -12
- package/file-upload/single-file-upload.component.scss +3 -2
- package/filter-bar/filters.scss +7 -0
- package/filter-bar/pipes/base-pipe.scss +3 -3
- package/filter-bar/pipes/pipe-date.scss +8 -1
- package/flag/flag-tokens.scss +22 -0
- package/flag/flag.scss +34 -21
- package/form-field/{_fiedset-theme.scss → _fieldset-theme.scss} +1 -5
- package/form-field/_form-field-theme.scss +4 -9
- package/form-field/cleaner.scss +3 -1
- package/form-field/fieldset.scss +3 -4
- package/form-field/form-field.scss +26 -21
- package/form-field/password-toggle.scss +3 -1
- package/icon/_icon-button-theme.scss +7 -0
- package/icon/_icon-theme.scss +10 -7
- package/icon/icon-button.scss +0 -2
- package/icon/icon-tokens.scss +12 -9
- package/inline-edit/inline-edit.scss +40 -54
- package/input/input.scss +4 -0
- package/link/{_link-theme.scss → deprecated/_link-theme.scss} +11 -6
- package/link/deprecated/link-tokens.scss +27 -0
- package/link/link-tokens.scss +6 -25
- package/link/link.scss +137 -0
- package/list/list.scss +3 -2
- package/loader-overlay/_loader-overlay-theme.scss +19 -10
- package/loader-overlay/loader-overlay-tokens.scss +0 -2
- package/loader-overlay/loader-overlay.scss +7 -1
- package/markdown/_markdown-theme.scss +16 -0
- package/markdown/markdown-tokens.scss +5 -0
- package/markdown/markdown.scss +2 -1
- package/modal/_modal-animation.scss +23 -14
- package/modal/modal-tokens.scss +2 -1
- package/modal/modal.scss +35 -31
- package/navbar/_navbar-item_horizontal.scss +8 -6
- package/navbar/_navbar-item_vertical.scss +18 -6
- package/navbar/_navbar-theme.scss +9 -1
- package/navbar/navbar-brand.scss +8 -6
- package/navbar/navbar-divider.scss +1 -1
- package/navbar/navbar-item.scss +8 -9
- package/navbar/navbar-toggle.scss +3 -3
- package/navbar/navbar-tokens.scss +14 -0
- package/navbar/navbar.scss +1 -2
- package/navbar/vertical-navbar.scss +2 -2
- package/notification-center/_notification-center-theme.scss +11 -6
- package/notification-center/notification-center-tokens.scss +33 -0
- package/notification-center/notification-center.scss +58 -20
- package/notification-center/notification-item.scss +15 -6
- package/package.json +112 -81
- package/popover/popover-tokens.scss +0 -2
- package/popover/popover.scss +41 -19
- package/prebuilt-themes/theme.css +1 -1
- package/progress-bar/_progress-bar-theme.scss +20 -3
- package/progress-bar/progress-bar-tokens.scss +3 -0
- package/progress-bar/progress-bar.scss +36 -8
- package/progress-spinner/progress-spinner.scss +4 -3
- package/radio/_radio-theme.scss +21 -4
- package/radio/radio-tokens.scss +7 -3
- package/radio/radio.scss +55 -8
- package/schematics/collection.json +415 -18
- package/schematics/migrations/accordion-state-saving-default/README.md +60 -0
- package/schematics/migrations/accordion-state-saving-default/data.cjs +75 -0
- package/schematics/migrations/accordion-state-saving-default/index.cjs +61 -0
- package/schematics/migrations/accordion-state-saving-default/schema.json +15 -0
- package/schematics/migrations/actions-panel-overlay-container/README.md +35 -0
- package/schematics/migrations/actions-panel-overlay-container/data.cjs +47 -0
- package/schematics/migrations/actions-panel-overlay-container/index.cjs +55 -0
- package/schematics/migrations/actions-panel-overlay-container/schema.json +15 -0
- package/schematics/migrations/alert-signals/README.md +13 -7
- package/schematics/migrations/alert-signals/{data.js → data.cjs} +3 -0
- package/schematics/migrations/alert-signals/index.cjs +221 -0
- package/schematics/migrations/angular-animations-removal/README.md +46 -0
- package/schematics/migrations/angular-animations-removal/data.cjs +150 -0
- package/schematics/migrations/angular-animations-removal/index.cjs +21 -0
- package/schematics/migrations/angular-animations-removal/schema.json +15 -0
- package/schematics/migrations/app-switcher-signals/README.md +88 -0
- package/schematics/migrations/app-switcher-signals/data.cjs +136 -0
- package/schematics/migrations/app-switcher-signals/index.cjs +366 -0
- package/schematics/migrations/app-switcher-signals/schema.json +20 -0
- package/schematics/migrations/autocomplete-panel-width-auto/README.md +2 -2
- package/schematics/migrations/autocomplete-panel-width-auto/{index.js → index.cjs} +6 -5
- package/schematics/migrations/autocomplete-signals/README.md +92 -0
- package/schematics/migrations/autocomplete-signals/data.cjs +149 -0
- package/schematics/migrations/autocomplete-signals/index.cjs +707 -0
- package/schematics/migrations/autocomplete-signals/schema.json +20 -0
- package/schematics/migrations/badge-signals/README.md +77 -0
- package/schematics/migrations/badge-signals/data.cjs +109 -0
- package/schematics/migrations/badge-signals/index.cjs +694 -0
- package/schematics/migrations/badge-signals/schema.json +20 -0
- package/schematics/migrations/button-state-and-styles/README.md +129 -0
- package/schematics/migrations/button-state-and-styles/data.cjs +136 -0
- package/schematics/migrations/button-state-and-styles/index.cjs +221 -0
- package/schematics/migrations/button-state-and-styles/schema.json +20 -0
- package/schematics/migrations/button-supported-colors/README.md +73 -0
- package/schematics/migrations/button-supported-colors/data.cjs +106 -0
- package/schematics/migrations/button-supported-colors/index.cjs +261 -0
- package/schematics/migrations/button-supported-colors/schema.json +20 -0
- package/schematics/migrations/button-toggle-signals-and-aria/README.md +137 -0
- package/schematics/migrations/button-toggle-signals-and-aria/data.cjs +200 -0
- package/schematics/migrations/button-toggle-signals-and-aria/index.cjs +497 -0
- package/schematics/migrations/button-toggle-signals-and-aria/schema.json +20 -0
- package/schematics/migrations/button-truncation/README.md +110 -0
- package/schematics/migrations/button-truncation/data.cjs +88 -0
- package/schematics/migrations/button-truncation/index.cjs +270 -0
- package/schematics/migrations/button-truncation/schema.json +20 -0
- package/schematics/migrations/checkbox-signals/README.md +76 -0
- package/schematics/migrations/checkbox-signals/data.cjs +114 -0
- package/schematics/migrations/checkbox-signals/index.cjs +635 -0
- package/schematics/migrations/checkbox-signals/schema.json +20 -0
- package/schematics/migrations/clamped-text-disclosure/README.md +62 -0
- package/schematics/migrations/clamped-text-disclosure/data.cjs +101 -0
- package/schematics/migrations/clamped-text-disclosure/index.cjs +60 -0
- package/schematics/migrations/clamped-text-disclosure/schema.json +15 -0
- package/schematics/migrations/code-block-highlight-js-core/README.md +53 -0
- package/schematics/migrations/code-block-highlight-js-core/data.cjs +64 -0
- package/schematics/migrations/code-block-highlight-js-core/index.cjs +319 -0
- package/schematics/migrations/code-block-highlight-js-core/schema.json +20 -0
- package/schematics/migrations/code-block-signals/README.md +84 -0
- package/schematics/migrations/code-block-signals/data.cjs +121 -0
- package/schematics/migrations/code-block-signals/index.cjs +701 -0
- package/schematics/migrations/code-block-signals/schema.json +20 -0
- package/schematics/migrations/color-signals/README.md +46 -0
- package/schematics/migrations/color-signals/data.cjs +131 -0
- package/schematics/migrations/color-signals/index.cjs +20 -0
- package/schematics/migrations/color-signals/schema.json +20 -0
- package/schematics/migrations/core-mixins-removal/README.md +20 -0
- package/schematics/migrations/core-mixins-removal/data.cjs +27 -0
- package/schematics/migrations/core-mixins-removal/index.cjs +18 -0
- package/schematics/migrations/core-mixins-removal/schema.json +15 -0
- package/schematics/migrations/css-selectors/README.md +2 -2
- package/schematics/migrations/css-selectors/{index.js → index.cjs} +4 -3
- package/schematics/migrations/datepicker-signals/README.md +24 -0
- package/schematics/migrations/datepicker-signals/data.cjs +49 -0
- package/schematics/migrations/datepicker-signals/index.cjs +18 -0
- package/schematics/migrations/datepicker-signals/schema.json +15 -0
- package/schematics/migrations/deprecated-icons/README.md +2 -2
- package/schematics/migrations/deprecated-icons/{index.js → index.cjs} +8 -7
- package/schematics/migrations/design-tokens-v4/README.md +75 -0
- package/schematics/migrations/design-tokens-v4/index.cjs +60 -0
- package/schematics/migrations/design-tokens-v4/schema.json +15 -0
- package/schematics/migrations/divider-signals-and-aria/README.md +47 -0
- package/schematics/migrations/divider-signals-and-aria/data.cjs +62 -0
- package/schematics/migrations/divider-signals-and-aria/index.cjs +212 -0
- package/schematics/migrations/divider-signals-and-aria/schema.json +15 -0
- package/schematics/migrations/dl-attribute-coercion/README.md +59 -0
- package/schematics/migrations/dl-attribute-coercion/data.cjs +85 -0
- package/schematics/migrations/dl-attribute-coercion/index.cjs +162 -0
- package/schematics/migrations/dl-attribute-coercion/schema.json +15 -0
- package/schematics/migrations/dl-standalone-names/README.md +49 -0
- package/schematics/migrations/dl-standalone-names/data.cjs +44 -0
- package/schematics/migrations/dl-standalone-names/index.cjs +322 -0
- package/schematics/migrations/dl-standalone-names/schema.json +20 -0
- package/schematics/migrations/dropdown-demote-overlay/README.md +137 -0
- package/schematics/migrations/dropdown-demote-overlay/data.cjs +84 -0
- package/schematics/migrations/dropdown-demote-overlay/index.cjs +289 -0
- package/schematics/migrations/dropdown-demote-overlay/schema.json +20 -0
- package/schematics/migrations/dropdown-signals/README.md +83 -0
- package/schematics/migrations/dropdown-signals/data.cjs +152 -0
- package/schematics/migrations/dropdown-signals/index.cjs +20 -0
- package/schematics/migrations/dropdown-signals/schema.json +20 -0
- package/schematics/migrations/empty-state-error-color/README.md +84 -0
- package/schematics/migrations/empty-state-error-color/data.cjs +85 -0
- package/schematics/migrations/empty-state-error-color/index.cjs +72 -0
- package/schematics/migrations/empty-state-error-color/schema.json +15 -0
- package/schematics/migrations/empty-state-size-attr/README.md +2 -2
- package/schematics/migrations/empty-state-size-attr/{index.js → index.cjs} +6 -5
- package/schematics/migrations/file-upload-cva-and-primitives/README.md +70 -0
- package/schematics/migrations/file-upload-cva-and-primitives/data.cjs +97 -0
- package/schematics/migrations/file-upload-cva-and-primitives/index.cjs +61 -0
- package/schematics/migrations/file-upload-cva-and-primitives/schema.json +15 -0
- package/schematics/migrations/file-upload-deprecated-outputs/README.md +90 -0
- package/schematics/migrations/file-upload-deprecated-outputs/data.cjs +20 -0
- package/schematics/migrations/file-upload-deprecated-outputs/index.cjs +71 -0
- package/schematics/migrations/file-upload-deprecated-outputs/schema.json +20 -0
- package/schematics/migrations/filter-bar-rename-action/README.md +183 -0
- package/schematics/migrations/filter-bar-rename-action/data.cjs +151 -0
- package/schematics/migrations/filter-bar-rename-action/index.cjs +178 -0
- package/schematics/migrations/filter-bar-rename-action/schema.json +20 -0
- package/schematics/migrations/filter-bar-signals/README.md +27 -16
- package/schematics/migrations/filter-bar-signals/{data.js → data.cjs} +1 -2
- package/schematics/migrations/filter-bar-signals/index.cjs +225 -0
- package/schematics/migrations/filter-bar-state-saving-default/README.md +53 -0
- package/schematics/migrations/filter-bar-state-saving-default/data.cjs +87 -0
- package/schematics/migrations/filter-bar-state-saving-default/index.cjs +62 -0
- package/schematics/migrations/filter-bar-state-saving-default/schema.json +15 -0
- package/schematics/migrations/flag-inner-html/README.md +67 -0
- package/schematics/migrations/flag-inner-html/data.cjs +58 -0
- package/schematics/migrations/flag-inner-html/index.cjs +62 -0
- package/schematics/migrations/flag-inner-html/schema.json +15 -0
- package/schematics/migrations/form-field-signals/README.md +125 -0
- package/schematics/migrations/form-field-signals/data.cjs +288 -0
- package/schematics/migrations/form-field-signals/index.cjs +383 -0
- package/schematics/migrations/form-field-signals/schema.json +20 -0
- package/schematics/migrations/icon-semantics-and-api/README.md +65 -0
- package/schematics/migrations/icon-semantics-and-api/data.cjs +97 -0
- package/schematics/migrations/icon-semantics-and-api/index.cjs +65 -0
- package/schematics/migrations/icon-semantics-and-api/schema.json +15 -0
- package/schematics/migrations/icons-replacement/README.md +5 -5
- package/schematics/migrations/icons-replacement/{index.js → index.cjs} +4 -3
- package/schematics/migrations/inline-edit-a11y-and-types/README.md +82 -0
- package/schematics/migrations/inline-edit-a11y-and-types/data.cjs +117 -0
- package/schematics/migrations/inline-edit-a11y-and-types/index.cjs +98 -0
- package/schematics/migrations/inline-edit-a11y-and-types/schema.json +20 -0
- package/schematics/migrations/input-number-surface/README.md +140 -0
- package/schematics/migrations/input-number-surface/data.cjs +135 -0
- package/schematics/migrations/input-number-surface/index.cjs +293 -0
- package/schematics/migrations/input-number-surface/schema.json +20 -0
- package/schematics/migrations/input-signals/README.md +20 -0
- package/schematics/migrations/input-signals/data.cjs +30 -0
- package/schematics/migrations/input-signals/index.cjs +18 -0
- package/schematics/migrations/input-signals/schema.json +15 -0
- package/schematics/migrations/link-deprecated-path/README.md +144 -0
- package/schematics/migrations/link-deprecated-path/index.cjs +20 -0
- package/schematics/migrations/link-deprecated-path/schema.json +20 -0
- package/schematics/migrations/link-signals/README.md +71 -0
- package/schematics/migrations/link-signals/data.cjs +116 -0
- package/schematics/migrations/link-signals/index.cjs +416 -0
- package/schematics/migrations/link-signals/schema.json +20 -0
- package/schematics/migrations/list-signals/README.md +22 -0
- package/schematics/migrations/list-signals/data.cjs +35 -0
- package/schematics/migrations/list-signals/index.cjs +18 -0
- package/schematics/migrations/list-signals/schema.json +15 -0
- package/schematics/migrations/list-tree-multiple-input/README.md +105 -0
- package/schematics/migrations/list-tree-multiple-input/data.cjs +74 -0
- package/schematics/migrations/list-tree-multiple-input/index.cjs +222 -0
- package/schematics/migrations/list-tree-multiple-input/schema.json +20 -0
- package/schematics/migrations/loader-overlay-signals/README.md +62 -0
- package/schematics/migrations/loader-overlay-signals/data.cjs +101 -0
- package/schematics/migrations/loader-overlay-signals/index.cjs +698 -0
- package/schematics/migrations/loader-overlay-signals/schema.json +20 -0
- package/schematics/migrations/loader-overlay-size-attr/README.md +2 -2
- package/schematics/migrations/loader-overlay-size-attr/{index.js → index.cjs} +6 -5
- package/schematics/migrations/locale-configuration-providers/README.md +163 -0
- package/schematics/migrations/locale-configuration-providers/data.cjs +257 -0
- package/schematics/migrations/locale-configuration-providers/index.cjs +295 -0
- package/schematics/migrations/locale-configuration-providers/schema.json +20 -0
- package/schematics/migrations/mandatory-peer-dependencies/README.md +70 -0
- package/schematics/migrations/mandatory-peer-dependencies/index.cjs +43 -0
- package/schematics/migrations/mandatory-peer-dependencies/schema.json +15 -0
- package/schematics/migrations/markdown-signals/README.md +58 -0
- package/schematics/migrations/markdown-signals/data.cjs +79 -0
- package/schematics/migrations/markdown-signals/index.cjs +640 -0
- package/schematics/migrations/markdown-signals/schema.json +20 -0
- package/schematics/migrations/modal-dialog-semantics/README.md +106 -0
- package/schematics/migrations/modal-dialog-semantics/data.cjs +110 -0
- package/schematics/migrations/modal-dialog-semantics/index.cjs +59 -0
- package/schematics/migrations/modal-dialog-semantics/schema.json +15 -0
- package/schematics/migrations/modal-signals/README.md +88 -0
- package/schematics/migrations/modal-signals/data.cjs +132 -0
- package/schematics/migrations/modal-signals/index.cjs +20 -0
- package/schematics/migrations/modal-signals/schema.json +20 -0
- package/schematics/migrations/navbar-signals-and-aria/README.md +111 -0
- package/schematics/migrations/navbar-signals-and-aria/data.cjs +198 -0
- package/schematics/migrations/navbar-signals-and-aria/index.cjs +569 -0
- package/schematics/migrations/navbar-signals-and-aria/schema.json +20 -0
- package/schematics/migrations/new-icons-pack/README.md +10 -10
- package/schematics/migrations/new-icons-pack/{index.js → index.cjs} +8 -7
- package/schematics/migrations/notification-center-signals/README.md +67 -0
- package/schematics/migrations/notification-center-signals/data.cjs +66 -0
- package/schematics/migrations/notification-center-signals/index.cjs +62 -0
- package/schematics/migrations/notification-center-signals/schema.json +15 -0
- package/schematics/migrations/option-signals/README.md +37 -0
- package/schematics/migrations/option-signals/data.cjs +86 -0
- package/schematics/migrations/option-signals/index.cjs +20 -0
- package/schematics/migrations/option-signals/schema.json +20 -0
- package/schematics/migrations/popover-leave-delay/README.md +51 -0
- package/schematics/migrations/popover-leave-delay/data.cjs +61 -0
- package/schematics/migrations/popover-leave-delay/index.cjs +55 -0
- package/schematics/migrations/popover-leave-delay/schema.json +15 -0
- package/schematics/migrations/progress-bar-percentage-and-aria/README.md +54 -0
- package/schematics/migrations/progress-bar-percentage-and-aria/data.cjs +76 -0
- package/schematics/migrations/progress-bar-percentage-and-aria/index.cjs +59 -0
- package/schematics/migrations/progress-bar-percentage-and-aria/schema.json +15 -0
- package/schematics/migrations/progress-spinner-signals/README.md +72 -0
- package/schematics/migrations/progress-spinner-signals/data.cjs +83 -0
- package/schematics/migrations/progress-spinner-signals/index.cjs +695 -0
- package/schematics/migrations/progress-spinner-signals/schema.json +20 -0
- package/schematics/migrations/query-list-signals/README.md +32 -0
- package/schematics/migrations/query-list-signals/data.cjs +70 -0
- package/schematics/migrations/query-list-signals/index.cjs +18 -0
- package/schematics/migrations/query-list-signals/schema.json +15 -0
- package/schematics/migrations/radio-signals-and-aria/README.md +82 -0
- package/schematics/migrations/radio-signals-and-aria/data.cjs +163 -0
- package/schematics/migrations/radio-signals-and-aria/index.cjs +40 -0
- package/schematics/migrations/radio-signals-and-aria/schema.json +20 -0
- package/schematics/migrations/read-state-dwell-handlers/README.md +125 -0
- package/schematics/migrations/read-state-dwell-handlers/data.cjs +45 -0
- package/schematics/migrations/read-state-dwell-handlers/index.cjs +216 -0
- package/schematics/migrations/read-state-dwell-handlers/schema.json +20 -0
- package/schematics/migrations/scrollbar-deprecated-path/README.md +128 -0
- package/schematics/migrations/scrollbar-deprecated-path/index.cjs +21 -0
- package/schematics/migrations/scrollbar-deprecated-path/schema.json +20 -0
- package/schematics/migrations/select-signal-inputs/README.md +61 -0
- package/schematics/migrations/select-signal-inputs/data.cjs +99 -0
- package/schematics/migrations/select-signal-inputs/index.cjs +58 -0
- package/schematics/migrations/select-signal-inputs/schema.json +15 -0
- package/schematics/migrations/sidepanel-non-modal-behavior/README.md +57 -0
- package/schematics/migrations/sidepanel-non-modal-behavior/data.cjs +111 -0
- package/schematics/migrations/sidepanel-non-modal-behavior/index.cjs +58 -0
- package/schematics/migrations/sidepanel-non-modal-behavior/schema.json +15 -0
- package/schematics/migrations/signal-inputs-subclasses/README.md +28 -0
- package/schematics/migrations/signal-inputs-subclasses/data.cjs +69 -0
- package/schematics/migrations/signal-inputs-subclasses/index.cjs +18 -0
- package/schematics/migrations/signal-inputs-subclasses/schema.json +15 -0
- package/schematics/migrations/split-button-optional-disabled/README.md +47 -0
- package/schematics/migrations/split-button-optional-disabled/data.cjs +53 -0
- package/schematics/migrations/split-button-optional-disabled/index.cjs +58 -0
- package/schematics/migrations/split-button-optional-disabled/schema.json +15 -0
- package/schematics/migrations/splitter-deprecated-path/README.md +136 -0
- package/schematics/migrations/splitter-deprecated-path/index.cjs +21 -0
- package/schematics/migrations/splitter-deprecated-path/schema.json +20 -0
- package/schematics/migrations/state-saving-default/README.md +67 -0
- package/schematics/migrations/state-saving-default/data.cjs +88 -0
- package/schematics/migrations/state-saving-default/index.cjs +63 -0
- package/schematics/migrations/state-saving-default/schema.json +15 -0
- package/schematics/migrations/table-cell-content/README.md +55 -0
- package/schematics/migrations/table-cell-content/data.cjs +66 -0
- package/schematics/migrations/table-cell-content/index.cjs +67 -0
- package/schematics/migrations/table-cell-content/schema.json +15 -0
- package/schematics/migrations/tabs-signals-and-aria/README.md +93 -0
- package/schematics/migrations/tabs-signals-and-aria/data.cjs +139 -0
- package/schematics/migrations/tabs-signals-and-aria/index.cjs +66 -0
- package/schematics/migrations/tabs-signals-and-aria/schema.json +15 -0
- package/schematics/migrations/tag-list-cleaner/README.md +58 -0
- package/schematics/migrations/tag-list-cleaner/data.cjs +42 -0
- package/schematics/migrations/tag-list-cleaner/index.cjs +197 -0
- package/schematics/migrations/tag-list-cleaner/schema.json +20 -0
- package/schematics/migrations/tag-slots/README.md +41 -0
- package/schematics/migrations/tag-slots/index.cjs +191 -0
- package/schematics/migrations/tag-slots/schema.json +20 -0
- package/schematics/migrations/tags-signals/README.md +85 -0
- package/schematics/migrations/tags-signals/data.cjs +103 -0
- package/schematics/migrations/tags-signals/index.cjs +674 -0
- package/schematics/migrations/tags-signals/schema.json +20 -0
- package/schematics/migrations/textarea-signals/README.md +72 -0
- package/schematics/migrations/textarea-signals/data.cjs +121 -0
- package/schematics/migrations/textarea-signals/index.cjs +380 -0
- package/schematics/migrations/textarea-signals/schema.json +20 -0
- package/schematics/migrations/time-range-title-for/README.md +164 -0
- package/schematics/migrations/time-range-title-for/data.cjs +139 -0
- package/schematics/migrations/time-range-title-for/index.cjs +164 -0
- package/schematics/migrations/time-range-title-for/schema.json +20 -0
- package/schematics/migrations/timepicker-signals/README.md +78 -0
- package/schematics/migrations/timepicker-signals/data.cjs +82 -0
- package/schematics/migrations/timepicker-signals/index.cjs +710 -0
- package/schematics/migrations/timepicker-signals/schema.json +20 -0
- package/schematics/migrations/timezone-grouping-utils/README.md +73 -0
- package/schematics/migrations/timezone-grouping-utils/data.cjs +101 -0
- package/schematics/migrations/timezone-grouping-utils/index.cjs +65 -0
- package/schematics/migrations/timezone-grouping-utils/schema.json +15 -0
- package/schematics/migrations/title-encapsulation/README.md +49 -0
- package/schematics/migrations/title-encapsulation/data.cjs +69 -0
- package/schematics/migrations/title-encapsulation/index.cjs +58 -0
- package/schematics/migrations/title-encapsulation/schema.json +15 -0
- package/schematics/migrations/toast-stack-and-defaults/README.md +102 -0
- package/schematics/migrations/toast-stack-and-defaults/data.cjs +79 -0
- package/schematics/migrations/toast-stack-and-defaults/index.cjs +54 -0
- package/schematics/migrations/toast-stack-and-defaults/schema.json +15 -0
- package/schematics/migrations/tooltip-pointer-events-and-types/README.md +53 -0
- package/schematics/migrations/tooltip-pointer-events-and-types/data.cjs +89 -0
- package/schematics/migrations/tooltip-pointer-events-and-types/index.cjs +61 -0
- package/schematics/migrations/tooltip-pointer-events-and-types/schema.json +15 -0
- package/schematics/migrations/top-bar-container-selectors/README.md +111 -0
- package/schematics/migrations/top-bar-container-selectors/data.cjs +56 -0
- package/schematics/migrations/top-bar-container-selectors/index.cjs +85 -0
- package/schematics/migrations/top-bar-container-selectors/schema.json +20 -0
- package/schematics/migrations/tree-select-signals/README.md +61 -0
- package/schematics/migrations/tree-select-signals/data.cjs +106 -0
- package/schematics/migrations/tree-select-signals/index.cjs +59 -0
- package/schematics/migrations/tree-select-signals/schema.json +15 -0
- package/schematics/migrations/tree-signals/README.md +82 -0
- package/schematics/migrations/tree-signals/data.cjs +123 -0
- package/schematics/migrations/tree-signals/index.cjs +55 -0
- package/schematics/migrations/tree-signals/schema.json +15 -0
- package/schematics/migrations/tree-state-saving-default/README.md +66 -0
- package/schematics/migrations/tree-state-saving-default/data.cjs +78 -0
- package/schematics/migrations/tree-state-saving-default/index.cjs +61 -0
- package/schematics/migrations/tree-state-saving-default/schema.json +15 -0
- package/schematics/migrations/username-pipe-injection/README.md +59 -0
- package/schematics/migrations/username-pipe-injection/data.cjs +78 -0
- package/schematics/migrations/username-pipe-injection/index.cjs +59 -0
- package/schematics/migrations/username-pipe-injection/schema.json +15 -0
- package/schematics/migrations/v20-upgrade/README.md +36 -16
- package/schematics/migrations/v20-upgrade/{data.js → data.cjs} +124 -77
- package/schematics/migrations/v20-upgrade/index.cjs +19 -0
- package/schematics/migrations/v21-upgrade/README.md +271 -0
- package/schematics/migrations/v21-upgrade/data.cjs +1371 -0
- package/schematics/migrations/v21-upgrade/index.cjs +95 -0
- package/schematics/migrations/v21-upgrade/schema.json +20 -0
- package/schematics/migrations/zoneless-change-detection/README.md +30 -0
- package/schematics/migrations/zoneless-change-detection/data.cjs +29 -0
- package/schematics/migrations/zoneless-change-detection/index.cjs +21 -0
- package/schematics/migrations/zoneless-change-detection/schema.json +15 -0
- package/schematics/migrations.json +401 -6
- package/schematics/ng-add/index.cjs +266 -0
- package/schematics/ng-add/schema.json +15 -0
- package/schematics/utils/{angular-parsing.js → angular-parsing.cjs} +2 -2
- package/schematics/utils/deprecated-path-migration.cjs +62 -0
- package/schematics/utils/html-config.cjs +148 -0
- package/schematics/utils/{icon-migration.js → icon-migration.cjs} +2 -2
- package/schematics/utils/list-item-pattern.cjs +16 -0
- package/schematics/utils/{package-config.js → package-config.cjs} +3 -32
- package/schematics/utils/project-files.cjs +25 -0
- package/schematics/utils/replacement-driver.cjs +337 -0
- package/schematics/utils/safe-rule.cjs +23 -0
- package/schematics/utils/signal-members-migration.cjs +779 -0
- package/schematics/utils/tag-patterns.cjs +21 -0
- package/schematics/utils/template-ref-access.cjs +155 -0
- package/schematics/utils/{typescript.js → typescript.cjs} +1 -1
- package/schematics/utils/warn-only-migration.cjs +52 -0
- package/schematics/utils/workspace-styles.cjs +123 -0
- package/scrollbar/{_scrollbar-component-theme.scss → deprecated/_scrollbar-component-theme.scss} +1 -1
- package/scrollbar/{scrollbar.component.scss → deprecated/scrollbar.component.scss} +1 -1
- package/scrollbar/native-scrollbar.scss +68 -0
- package/scrollbar/scrollbar-tokens.scss +13 -22
- package/scrollbar/scrollbar-track.scss +94 -0
- package/scrollbar/scrollbar-viewport.scss +33 -0
- package/scrollbar/scrollbar.scss +24 -0
- package/search-expandable/search-expandable-tokens.scss +4 -0
- package/search-expandable/search-expandable.scss +4 -2
- package/select/_select-theme.scss +3 -16
- package/select/select.scss +0 -6
- package/sidebar/sidebar.scss +20 -0
- package/sidepanel/_sidepanel-theme.scss +1 -1
- package/sidepanel/sidepanel-tokens.scss +7 -1
- package/sidepanel/sidepanel.scss +41 -5
- package/skeleton/skeleton-presets.scss +350 -0
- package/skeleton/skeleton-tokens.scss +127 -0
- package/skeleton/skeleton.scss +53 -45
- package/split-button/_split-button-theme.scss +4 -4
- package/split-button/split-button.scss +2 -6
- package/splitter/{_splitter-theme.scss → deprecated/_splitter-theme.scss} +1 -1
- package/splitter/deprecated/splitter.scss +51 -0
- package/splitter/splitter-tokens.scss +19 -0
- package/splitter/splitter.scss +148 -28
- package/table/_table-theme.scss +13 -12
- package/table/table-tokens.scss +8 -0
- package/table/table.scss +47 -22
- package/tabs/_tabs-common.scss +14 -14
- package/tabs/_tabs-theme.scss +4 -5
- package/tabs/tab-body.scss +49 -1
- package/tabs/tab-header.scss +2 -1
- package/tags/tag-list.scss +4 -0
- package/tags/tag.scss +19 -1
- package/time-range/time-range.scss +9 -0
- package/timezone/timezone-option.component.scss +4 -7
- package/timezone/timezone-select.component.scss +3 -0
- package/toast/_toast-theme.scss +1 -4
- package/toast/toast-container.component.scss +19 -13
- package/toast/toast-tokens.scss +12 -6
- package/toast/toast.component.scss +42 -19
- package/toggle/_toggle-theme.scss +4 -10
- package/toggle/toggle.scss +67 -26
- package/tooltip/_tooltip-theme.scss +7 -1
- package/tooltip/tooltip-tokens.scss +1 -2
- package/tooltip/tooltip.scss +55 -9
- package/top-bar/top-bar-tokens.scss +13 -2
- package/top-bar/top-bar.scss +24 -19
- package/tree/_tree-theme.scss +0 -1
- package/tree/toggle.scss +5 -9
- package/tree/tree-option.scss +2 -4
- package/tree/tree-tokens.scss +2 -1
- package/tree/tree.scss +3 -5
- package/tree-select/_tree-select-theme.scss +4 -15
- package/tree-select/tree-select-tokens.scss +16 -0
- package/tree-select/tree-select.scss +0 -6
- package/{accordion/index.d.ts → types/koobiq-components-accordion.d.ts} +102 -84
- package/{actions-panel/index.d.ts → types/koobiq-components-actions-panel.d.ts} +44 -59
- package/{alert/index.d.ts → types/koobiq-components-alert.d.ts} +8 -3
- package/types/koobiq-components-app-switcher.d.ts +406 -0
- package/types/koobiq-components-autocomplete.d.ts +443 -0
- package/{badge/index.d.ts → types/koobiq-components-badge.d.ts} +25 -20
- package/{breadcrumbs/index.d.ts → types/koobiq-components-breadcrumbs.d.ts} +97 -46
- package/types/koobiq-components-button-toggle.d.ts +340 -0
- package/types/koobiq-components-button.d.ts +296 -0
- package/types/koobiq-components-checkbox.d.ts +172 -0
- package/types/koobiq-components-clamped-text.d.ts +184 -0
- package/{code-block/index.d.ts → types/koobiq-components-code-block.d.ts} +150 -88
- package/{content-panel/index.d.ts → types/koobiq-components-content-panel.d.ts} +81 -25
- package/{core/index.d.ts → types/koobiq-components-core.d.ts} +2827 -865
- package/{datepicker/index.d.ts → types/koobiq-components-datepicker.d.ts} +161 -116
- package/types/koobiq-components-divider.d.ts +43 -0
- package/types/koobiq-components-dl.d.ts +235 -0
- package/{dropdown/index.d.ts → types/koobiq-components-dropdown.d.ts} +245 -239
- package/types/koobiq-components-ellipsis-center.d.ts +85 -0
- package/types/koobiq-components-empty-state.d.ts +106 -0
- package/{file-upload/index.d.ts → types/koobiq-components-file-upload.d.ts} +214 -107
- package/{filter-bar/index.d.ts → types/koobiq-components-filter-bar.d.ts} +410 -495
- package/types/koobiq-components-flag.d.ts +68 -0
- package/{form-field/index.d.ts → types/koobiq-components-form-field.d.ts} +167 -191
- package/types/koobiq-components-icon.d.ts +333 -0
- package/{inline-edit/index.d.ts → types/koobiq-components-inline-edit.d.ts} +109 -46
- package/types/koobiq-components-input.d.ts +477 -0
- package/types/koobiq-components-link-deprecated.d.ts +101 -0
- package/types/koobiq-components-link.d.ts +176 -0
- package/{list/index.d.ts → types/koobiq-components-list.d.ts} +162 -99
- package/types/koobiq-components-loader-overlay.d.ts +101 -0
- package/{markdown/index.d.ts → types/koobiq-components-markdown.d.ts} +16 -24
- package/types/koobiq-components-modal.d.ts +666 -0
- package/types/koobiq-components-navbar.d.ts +569 -0
- package/types/koobiq-components-notification-center.d.ts +500 -0
- package/{overflow-items/index.d.ts → types/koobiq-components-overflow-items.d.ts} +8 -22
- package/types/koobiq-components-popover.d.ts +468 -0
- package/types/koobiq-components-progress-bar.d.ts +67 -0
- package/{progress-spinner/index.d.ts → types/koobiq-components-progress-spinner.d.ts} +33 -10
- package/types/koobiq-components-radio.d.ts +294 -0
- package/{resizer/index.d.ts → types/koobiq-components-resizer.d.ts} +37 -2
- package/{scrollbar/index.d.ts → types/koobiq-components-scrollbar-deprecated.d.ts} +18 -1
- package/types/koobiq-components-scrollbar.d.ts +154 -0
- package/types/koobiq-components-search-expandable.d.ts +164 -0
- package/{select/index.d.ts → types/koobiq-components-select.d.ts} +360 -167
- package/types/koobiq-components-sidebar.d.ts +152 -0
- package/types/koobiq-components-sidepanel.d.ts +436 -0
- package/types/koobiq-components-skeleton.d.ts +234 -0
- package/types/koobiq-components-split-button.d.ts +65 -0
- package/{splitter/index.d.ts → types/koobiq-components-splitter-deprecated.d.ts} +44 -1
- package/types/koobiq-components-splitter.d.ts +406 -0
- package/types/koobiq-components-table.d.ts +44 -0
- package/types/koobiq-components-tabs.d.ts +888 -0
- package/{tags/index.d.ts → types/koobiq-components-tags.d.ts} +249 -133
- package/types/koobiq-components-textarea.d.ts +178 -0
- package/{time-range/index.d.ts → types/koobiq-components-time-range.d.ts} +135 -62
- package/types/koobiq-components-timepicker.d.ts +223 -0
- package/types/koobiq-components-timezone.d.ts +266 -0
- package/types/koobiq-components-title.d.ts +184 -0
- package/types/koobiq-components-toast.d.ts +289 -0
- package/types/koobiq-components-toggle.d.ts +121 -0
- package/types/koobiq-components-tooltip.d.ts +610 -0
- package/types/koobiq-components-top-bar.d.ts +61 -0
- package/types/koobiq-components-tree-select.d.ts +670 -0
- package/types/koobiq-components-tree.d.ts +1339 -0
- package/types/koobiq-components-username.d.ts +340 -0
- package/username/_username-theme.scss +35 -0
- package/username/username.scss +10 -34
- package/app-switcher/index.d.ts +0 -276
- package/autocomplete/index.d.ts +0 -286
- package/button/index.d.ts +0 -153
- package/button-toggle/index.d.ts +0 -162
- package/checkbox/index.d.ts +0 -163
- package/clamped-text/index.d.ts +0 -146
- package/core/styles/_tokens.scss +0 -7
- package/core/styles/common/_clearfix.scss +0 -13
- package/core/styles/common/_popup.scss +0 -6
- package/core/styles/functions/_index.scss +0 -3
- package/core/styles/functions/_number.scss +0 -60
- package/core/styles/functions/_string.scss +0 -18
- package/core/styles/theming/scrollbar-tokens.scss +0 -25
- package/core/styles/typography/_typography-utils.scss +0 -84
- package/divider/index.d.ts +0 -20
- package/dl/index.d.ts +0 -45
- package/ellipsis-center/index.d.ts +0 -71
- package/empty-state/index.d.ts +0 -45
- package/flag/index.d.ts +0 -44
- package/icon/index.d.ts +0 -200
- package/input/index.d.ts +0 -354
- package/link/index.d.ts +0 -56
- package/loader-overlay/index.d.ts +0 -57
- package/modal/index.d.ts +0 -339
- package/navbar/index.d.ts +0 -372
- package/notification-center/index.d.ts +0 -323
- package/popover/index.d.ts +0 -182
- package/prebuilt-themes/dark-theme.css +0 -1
- package/prebuilt-themes/light-theme.css +0 -1
- package/progress-bar/index.d.ts +0 -31
- package/radio/index.d.ts +0 -203
- package/schematics/migrations/alert-signals/index.js +0 -353
- package/schematics/migrations/filter-bar-signals/index.js +0 -319
- package/schematics/migrations/v20-upgrade/index.js +0 -225
- package/schematics/ng-add/index.js +0 -39
- package/search-expandable/index.d.ts +0 -101
- package/sidebar/index.d.ts +0 -94
- package/sidepanel/index.d.ts +0 -272
- package/skeleton/index.d.ts +0 -26
- package/split-button/index.d.ts +0 -46
- package/table/index.d.ts +0 -25
- package/tabs/index.d.ts +0 -677
- package/textarea/index.d.ts +0 -138
- package/timepicker/index.d.ts +0 -197
- package/timezone/index.d.ts +0 -125
- package/title/index.d.ts +0 -139
- package/toast/index.d.ts +0 -178
- package/toggle/index.d.ts +0 -104
- package/tooltip/index.d.ts +0 -335
- package/top-bar/index.d.ts +0 -33
- package/tree/index.d.ts +0 -802
- package/tree-select/index.d.ts +0 -475
- package/username/index.d.ts +0 -194
- /package/schematics/migrations/css-selectors/{data.js → data.cjs} +0 -0
- /package/schematics/migrations/deprecated-icons/{data.js → data.cjs} +0 -0
- /package/schematics/migrations/icons-replacement/{data.js → data.cjs} +0 -0
- /package/schematics/migrations/new-icons-pack/{data.js → data.cjs} +0 -0
- /package/schematics/utils/{ast.js → ast.cjs} +0 -0
- /package/schematics/utils/{messages.js → messages.cjs} +0 -0
- /package/{dynamic-translation/index.d.ts → types/koobiq-components-dynamic-translation.d.ts} +0 -0
- /package/{index.d.ts → types/koobiq-components.d.ts} +0 -0
|
@@ -1,28 +1,38 @@
|
|
|
1
1
|
import * as i1 from '@angular/cdk/a11y';
|
|
2
|
-
import { CdkTrapFocus, FocusMonitor } from '@angular/cdk/a11y';
|
|
2
|
+
import { CdkTrapFocus, FocusMonitor, CdkMonitorFocus } from '@angular/cdk/a11y';
|
|
3
3
|
import { Overlay } from '@angular/cdk/overlay';
|
|
4
4
|
import { ComponentPortal } from '@angular/cdk/portal';
|
|
5
|
-
import { NgTemplateOutlet, isPlatformBrowser
|
|
5
|
+
import { NgTemplateOutlet, isPlatformBrowser } from '@angular/common';
|
|
6
6
|
import * as i0 from '@angular/core';
|
|
7
|
-
import { inject, model, output, Directive, signal, NgZone, DestroyRef, input, booleanAttribute, viewChild, computed, ChangeDetectionStrategy, Component,
|
|
8
|
-
import { takeUntilDestroyed
|
|
9
|
-
import
|
|
7
|
+
import { InjectionToken, inject, model, output, Directive, signal, NgZone, DestroyRef, input, booleanAttribute, viewChild, computed, ChangeDetectionStrategy, Component, untracked, Injector, Injectable, ViewContainerRef, TemplateRef, ViewEncapsulation, ChangeDetectorRef, Renderer2, ElementRef, effect, contentChild, contentChildren, viewChildren, PLATFORM_ID, afterNextRender, NgModule } from '@angular/core';
|
|
8
|
+
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
|
|
9
|
+
import * as i1$1 from '@koobiq/components/core';
|
|
10
|
+
import { ruRULocaleData, kbqLocaleConfigurationOverrideProvider, kbqInjectNativeElement, isHtmlElementOrNull, KBQ_WINDOW, kbqAnimationsDisabled, KbqLocaleOverridesDirective, kbqInjectA11yLocaleConfiguration, ErrorStateMatcher, KbqDataSizePipe } from '@koobiq/components/core';
|
|
10
11
|
import { KbqEmptyState, KbqEmptyStateIcon, KbqEmptyStateTitle, KbqEmptyStateText } from '@koobiq/components/empty-state';
|
|
11
12
|
import { KbqIcon, KbqIconButton, KbqIconModule } from '@koobiq/components/icon';
|
|
12
|
-
import { fromEvent, filter, Subject, takeUntil, of, BehaviorSubject } from 'rxjs';
|
|
13
|
+
import { fromEvent, filter, Subject, takeUntil, combineLatest, of, BehaviorSubject } from 'rxjs';
|
|
13
14
|
import { Platform } from '@angular/cdk/platform';
|
|
14
15
|
import { NgControl, NgForm, FormGroupDirective, FormsModule, ReactiveFormsModule } from '@angular/forms';
|
|
15
16
|
import { KbqButtonModule } from '@koobiq/components/button';
|
|
16
17
|
import { KbqEllipsisCenterDirective, KbqEllipsisCenterModule } from '@koobiq/components/ellipsis-center';
|
|
17
18
|
import { KbqHint, KbqFormFieldModule } from '@koobiq/components/form-field';
|
|
18
|
-
import { KbqLink
|
|
19
|
-
import * as
|
|
19
|
+
import { KbqLink } from '@koobiq/components/link';
|
|
20
|
+
import * as i3 from '@koobiq/components/list';
|
|
20
21
|
import { KbqListModule } from '@koobiq/components/list';
|
|
21
|
-
import * as
|
|
22
|
+
import * as i4 from '@koobiq/components/progress-spinner';
|
|
22
23
|
import { KbqProgressSpinnerModule, KbqProgressSpinner } from '@koobiq/components/progress-spinner';
|
|
23
24
|
import { KbqToolTipModule } from '@koobiq/components/tooltip';
|
|
25
|
+
import { KbqScrollbar } from '@koobiq/components/scrollbar';
|
|
24
26
|
import { distinctUntilChanged } from 'rxjs/operators';
|
|
25
27
|
|
|
28
|
+
/** Localization configuration provider for the labels the file upload components render themselves. */
|
|
29
|
+
const KBQ_FILE_UPLOAD_LOCALE_CONFIGURATION = new InjectionToken('KbqFileUploadLocaleConfiguration', { factory: () => ruRULocaleData.fileUpload });
|
|
30
|
+
/**
|
|
31
|
+
* Utility provider of {@link KBQ_FILE_UPLOAD_LOCALE_CONFIGURATION}. Only the labels you pass are overridden;
|
|
32
|
+
* the rest keep following the active locale.
|
|
33
|
+
*/
|
|
34
|
+
const kbqFileUploadLocaleConfigurationProvider = (configuration) => kbqLocaleConfigurationOverrideProvider('fileUpload', configuration);
|
|
35
|
+
|
|
26
36
|
const isFolderCanBeDragged = () => 'webkitGetAsEntry' in DataTransferItem.prototype;
|
|
27
37
|
const entryIsDirectory = (entry) => !!entry && entry.isDirectory;
|
|
28
38
|
const entryIsFile = (entry) => !!entry && entry.isFile;
|
|
@@ -34,7 +44,7 @@ class KbqDrop {
|
|
|
34
44
|
* Controls whether drag-and-drop functionality is enabled.
|
|
35
45
|
* When true, all drag events are filtered out and ignored.
|
|
36
46
|
*/
|
|
37
|
-
this.disabled = model(false, ...(ngDevMode ? [{ debugName: "disabled" }] : []));
|
|
47
|
+
this.disabled = model(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
|
|
38
48
|
/** Emits an event when file items were dropped. */
|
|
39
49
|
this.filesDropped = output();
|
|
40
50
|
}
|
|
@@ -55,17 +65,17 @@ class KbqDrop {
|
|
|
55
65
|
.then((entries) => this.filesDropped.emit(entries));
|
|
56
66
|
}
|
|
57
67
|
}
|
|
58
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
59
|
-
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "
|
|
68
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KbqDrop, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
69
|
+
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.25", type: KbqDrop, isStandalone: true, inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { disabled: "disabledChange", filesDropped: "filesDropped" }, ngImport: i0 }); }
|
|
60
70
|
}
|
|
61
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
71
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KbqDrop, decorators: [{
|
|
62
72
|
type: Directive
|
|
63
73
|
}], propDecorators: { disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }, { type: i0.Output, args: ["disabledChange"] }], filesDropped: [{ type: i0.Output, args: ["filesDropped"] }] } });
|
|
64
74
|
class KbqFileDropDirective extends KbqDrop {
|
|
65
75
|
constructor() {
|
|
66
76
|
super();
|
|
67
77
|
/** Flag that controls css-class modifications on drag events. */
|
|
68
|
-
this.dragover = signal(false, ...(ngDevMode ? [{ debugName: "dragover" }] : []));
|
|
78
|
+
this.dragover = signal(false, ...(ngDevMode ? [{ debugName: "dragover" }] : /* istanbul ignore next */ []));
|
|
69
79
|
this.ngZone = inject(NgZone);
|
|
70
80
|
this.nativeElement = kbqInjectNativeElement();
|
|
71
81
|
this.destroyRef = inject(DestroyRef);
|
|
@@ -114,10 +124,10 @@ class KbqFileDropDirective extends KbqDrop {
|
|
|
114
124
|
});
|
|
115
125
|
});
|
|
116
126
|
}
|
|
117
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
118
|
-
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
127
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KbqFileDropDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
128
|
+
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.25", type: KbqFileDropDirective, isStandalone: true, selector: "[kbqFileDrop]", host: { properties: { "class.kbq-file-drop_dragover": "dragover()" }, classAttribute: "kbq-file-drop" }, exportAs: ["kbqFileDrop"], usesInheritance: true, ngImport: i0 }); }
|
|
119
129
|
}
|
|
120
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
130
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KbqFileDropDirective, decorators: [{
|
|
121
131
|
type: Directive,
|
|
122
132
|
args: [{
|
|
123
133
|
selector: '[kbqFileDrop]',
|
|
@@ -159,22 +169,22 @@ const unwrapDirectory = async (item) => {
|
|
|
159
169
|
class KbqFileUploadContext {
|
|
160
170
|
constructor() {
|
|
161
171
|
/** id for file input */
|
|
162
|
-
this.id = input(null, ...(ngDevMode ? [{ debugName: "id" }] : []));
|
|
172
|
+
this.id = input(null, ...(ngDevMode ? [{ debugName: "id" }] : /* istanbul ignore next */ []));
|
|
163
173
|
/** Whether file input selectable or not */
|
|
164
|
-
this.disabled = model(null, ...(ngDevMode ? [{ debugName: "disabled" }] : []));
|
|
174
|
+
this.disabled = model(null, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
|
|
165
175
|
/** Selection mode for file input */
|
|
166
|
-
this.multiple = input(null, ...(ngDevMode ?
|
|
176
|
+
this.multiple = input(null, { ...(ngDevMode ? { debugName: "multiple" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
|
|
167
177
|
/** File type specifiers */
|
|
168
|
-
this.accept = input(null, ...(ngDevMode ? [{ debugName: "accept" }] : []));
|
|
178
|
+
this.accept = input(null, ...(ngDevMode ? [{ debugName: "accept" }] : /* istanbul ignore next */ []));
|
|
169
179
|
/**
|
|
170
180
|
* Reflects webkitdirectory attribute, which indicates that elements can only select directories instead of files.
|
|
171
181
|
*/
|
|
172
|
-
this.onlyDirectory = input(null, ...(ngDevMode ? [{ debugName: "onlyDirectory" }] : []));
|
|
182
|
+
this.onlyDirectory = input(null, ...(ngDevMode ? [{ debugName: "onlyDirectory" }] : /* istanbul ignore next */ []));
|
|
173
183
|
}
|
|
174
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
175
|
-
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "
|
|
184
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KbqFileUploadContext, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
185
|
+
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.25", type: KbqFileUploadContext, isStandalone: true, selector: "[kbqFileUploadContext]", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, accept: { classPropertyName: "accept", publicName: "accept", isSignal: true, isRequired: false, transformFunction: null }, onlyDirectory: { classPropertyName: "onlyDirectory", publicName: "onlyDirectory", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { disabled: "disabledChange" }, exportAs: ["kbqFileUploadContext"], ngImport: i0 }); }
|
|
176
186
|
}
|
|
177
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
187
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KbqFileUploadContext, decorators: [{
|
|
178
188
|
type: Directive,
|
|
179
189
|
args: [{
|
|
180
190
|
selector: '[kbqFileUploadContext]',
|
|
@@ -188,44 +198,50 @@ class KbqFileLoader {
|
|
|
188
198
|
constructor() {
|
|
189
199
|
this.fileUploadContext = inject(KbqFileUploadContext, { optional: true });
|
|
190
200
|
/** Whether file input selectable or not */
|
|
191
|
-
this.disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : []));
|
|
201
|
+
this.disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
|
|
192
202
|
/** Selection mode for file input */
|
|
193
|
-
this.multiple = input(null, ...(ngDevMode ? [{ debugName: "multiple" }] : []));
|
|
203
|
+
this.multiple = input(null, ...(ngDevMode ? [{ debugName: "multiple" }] : /* istanbul ignore next */ []));
|
|
194
204
|
/** File type specifiers */
|
|
195
|
-
this.accept = input(null, ...(ngDevMode ? [{ debugName: "accept" }] : []));
|
|
205
|
+
this.accept = input(null, ...(ngDevMode ? [{ debugName: "accept" }] : /* istanbul ignore next */ []));
|
|
196
206
|
/** id for file input */
|
|
197
|
-
this.for = input(null, ...(ngDevMode ? [{ debugName: "for" }] : []));
|
|
207
|
+
this.for = input(null, ...(ngDevMode ? [{ debugName: "for" }] : /* istanbul ignore next */ []));
|
|
198
208
|
/**
|
|
199
209
|
* Reflects webkitdirectory attribute,
|
|
200
210
|
* which indicates that elements can only select directories instead of files.
|
|
201
|
-
*
|
|
211
|
+
* See [`HTMLInputElement: webkitdirectory property`](https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/webkitdirectory).
|
|
202
212
|
*/
|
|
203
|
-
this.onlyDirectory = input(null, ...(ngDevMode ? [{ debugName: "onlyDirectory" }] : []));
|
|
213
|
+
this.onlyDirectory = input(null, ...(ngDevMode ? [{ debugName: "onlyDirectory" }] : /* istanbul ignore next */ []));
|
|
214
|
+
/** Ids of the elements describing the file input, written to its `aria-describedby`. */
|
|
215
|
+
this.describedBy = input(null, ...(ngDevMode ? [{ debugName: "describedBy" }] : /* istanbul ignore next */ []));
|
|
216
|
+
/** Whether the file input holds a value the form rejects, reported through `aria-invalid`. */
|
|
217
|
+
this.invalid = input(false, { ...(ngDevMode ? { debugName: "invalid" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
|
|
204
218
|
/** Event fires when file selected in file-picker. */
|
|
205
219
|
this.fileChange = output();
|
|
206
220
|
/** Underlying file input element */
|
|
207
221
|
this.input = viewChild.required('input');
|
|
208
222
|
/** @docs-private */
|
|
209
|
-
this.innerDisabled = computed(() => this.fileUploadContext?.disabled() ?? this.disabled(), ...(ngDevMode ? [{ debugName: "innerDisabled" }] : []));
|
|
223
|
+
this.innerDisabled = computed(() => this.fileUploadContext?.disabled() ?? this.disabled(), ...(ngDevMode ? [{ debugName: "innerDisabled" }] : /* istanbul ignore next */ []));
|
|
210
224
|
/** @docs-private */
|
|
211
|
-
this.innerMultiple = computed(() => this.fileUploadContext?.multiple() ?? this.multiple(), ...(ngDevMode ? [{ debugName: "innerMultiple" }] : []));
|
|
225
|
+
this.innerMultiple = computed(() => this.fileUploadContext?.multiple() ?? this.multiple(), ...(ngDevMode ? [{ debugName: "innerMultiple" }] : /* istanbul ignore next */ []));
|
|
212
226
|
/** @docs-private */
|
|
213
|
-
this.innerAccept = computed(() => this.fileUploadContext?.accept() ?? this.accept(), ...(ngDevMode ? [{ debugName: "innerAccept" }] : []));
|
|
227
|
+
this.innerAccept = computed(() => this.fileUploadContext?.accept() ?? this.accept(), ...(ngDevMode ? [{ debugName: "innerAccept" }] : /* istanbul ignore next */ []));
|
|
214
228
|
/** @docs-private */
|
|
215
|
-
this.innerFor = computed(() => this.fileUploadContext?.id() ?? this.for(), ...(ngDevMode ? [{ debugName: "innerFor" }] : []));
|
|
229
|
+
this.innerFor = computed(() => this.fileUploadContext?.id() ?? this.for(), ...(ngDevMode ? [{ debugName: "innerFor" }] : /* istanbul ignore next */ []));
|
|
216
230
|
/** @docs-private */
|
|
217
|
-
this.innerOnlyDirectory = computed(() => this.fileUploadContext?.onlyDirectory() ?? this.onlyDirectory(), ...(ngDevMode ? [{ debugName: "innerOnlyDirectory" }] : []));
|
|
231
|
+
this.innerOnlyDirectory = computed(() => this.fileUploadContext?.onlyDirectory() ?? this.onlyDirectory(), ...(ngDevMode ? [{ debugName: "innerOnlyDirectory" }] : /* istanbul ignore next */ []));
|
|
218
232
|
}
|
|
219
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
220
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "
|
|
233
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KbqFileLoader, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
234
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.2.25", type: KbqFileLoader, isStandalone: true, selector: "[kbqFileLoader]", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, accept: { classPropertyName: "accept", publicName: "accept", isSignal: true, isRequired: false, transformFunction: null }, for: { classPropertyName: "for", publicName: "for", isSignal: true, isRequired: false, transformFunction: null }, onlyDirectory: { classPropertyName: "onlyDirectory", publicName: "onlyDirectory", isSignal: true, isRequired: false, transformFunction: null }, describedBy: { classPropertyName: "describedBy", publicName: "describedBy", isSignal: true, isRequired: false, transformFunction: null }, invalid: { classPropertyName: "invalid", publicName: "invalid", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { fileChange: "fileChange" }, host: { classAttribute: "kbq-file-loader" }, viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true, isSignal: true }], exportAs: ["kbqFileLoader"], ngImport: i0, template: `
|
|
221
235
|
<ng-content />
|
|
222
236
|
<input
|
|
223
237
|
#input
|
|
224
238
|
tabindex="0"
|
|
225
239
|
type="file"
|
|
226
240
|
class="cdk-visually-hidden"
|
|
227
|
-
[attr.
|
|
228
|
-
[attr.
|
|
241
|
+
[attr.aria-describedby]="describedBy()"
|
|
242
|
+
[attr.aria-invalid]="invalid() || null"
|
|
243
|
+
[attr.multiple]="innerMultiple() || null"
|
|
244
|
+
[attr.webkitdirectory]="innerOnlyDirectory() || null"
|
|
229
245
|
[accept]="innerAccept()"
|
|
230
246
|
[disabled]="innerDisabled()"
|
|
231
247
|
[id]="innerFor()"
|
|
@@ -233,7 +249,7 @@ class KbqFileLoader {
|
|
|
233
249
|
/>
|
|
234
250
|
`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
235
251
|
}
|
|
236
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
252
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KbqFileLoader, decorators: [{
|
|
237
253
|
type: Component,
|
|
238
254
|
args: [{
|
|
239
255
|
selector: '[kbqFileLoader]',
|
|
@@ -244,8 +260,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.30", ngImpo
|
|
|
244
260
|
tabindex="0"
|
|
245
261
|
type="file"
|
|
246
262
|
class="cdk-visually-hidden"
|
|
247
|
-
[attr.
|
|
248
|
-
[attr.
|
|
263
|
+
[attr.aria-describedby]="describedBy()"
|
|
264
|
+
[attr.aria-invalid]="invalid() || null"
|
|
265
|
+
[attr.multiple]="innerMultiple() || null"
|
|
266
|
+
[attr.webkitdirectory]="innerOnlyDirectory() || null"
|
|
249
267
|
[accept]="innerAccept()"
|
|
250
268
|
[disabled]="innerDisabled()"
|
|
251
269
|
[id]="innerFor()"
|
|
@@ -258,14 +276,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.30", ngImpo
|
|
|
258
276
|
},
|
|
259
277
|
exportAs: 'kbqFileLoader'
|
|
260
278
|
}]
|
|
261
|
-
}], propDecorators: { disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], multiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiple", required: false }] }], accept: [{ type: i0.Input, args: [{ isSignal: true, alias: "accept", required: false }] }], for: [{ type: i0.Input, args: [{ isSignal: true, alias: "for", required: false }] }], onlyDirectory: [{ type: i0.Input, args: [{ isSignal: true, alias: "onlyDirectory", required: false }] }], fileChange: [{ type: i0.Output, args: ["fileChange"] }], input: [{ type: i0.ViewChild, args: ['input', { isSignal: true }] }] } });
|
|
279
|
+
}], propDecorators: { disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], multiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiple", required: false }] }], accept: [{ type: i0.Input, args: [{ isSignal: true, alias: "accept", required: false }] }], for: [{ type: i0.Input, args: [{ isSignal: true, alias: "for", required: false }] }], onlyDirectory: [{ type: i0.Input, args: [{ isSignal: true, alias: "onlyDirectory", required: false }] }], describedBy: [{ type: i0.Input, args: [{ isSignal: true, alias: "describedBy", required: false }] }], invalid: [{ type: i0.Input, args: [{ isSignal: true, alias: "invalid", required: false }] }], fileChange: [{ type: i0.Output, args: ["fileChange"] }], input: [{ type: i0.ViewChild, args: ['input', { isSignal: true }] }] } });
|
|
262
280
|
/**
|
|
263
281
|
* Responsible for list update (add/remove)
|
|
264
282
|
*/
|
|
265
283
|
class KbqFileList {
|
|
266
284
|
constructor() {
|
|
267
285
|
/** Current list of items. */
|
|
268
|
-
this.list = model([], ...(ngDevMode ? [{ debugName: "list" }] : []));
|
|
286
|
+
this.list = model([], ...(ngDevMode ? [{ debugName: "list" }] : /* istanbul ignore next */ []));
|
|
269
287
|
/**
|
|
270
288
|
* Emits an event containing a tuple of file and file's index when removed from the file list.
|
|
271
289
|
* Useful when handle removed files, skipping filtering file list.
|
|
@@ -289,20 +307,23 @@ class KbqFileList {
|
|
|
289
307
|
this.update(() => items);
|
|
290
308
|
this.itemsAdded.emit(items);
|
|
291
309
|
}
|
|
292
|
-
/** Removes
|
|
310
|
+
/** Removes the first occurrence of the specified item. Returns removed items and emits event. */
|
|
293
311
|
remove(item) {
|
|
294
|
-
|
|
295
|
-
|
|
296
|
-
|
|
297
|
-
|
|
298
|
-
removed.push(currentItem);
|
|
299
|
-
}
|
|
300
|
-
return !isRemoved;
|
|
301
|
-
}));
|
|
302
|
-
return removed;
|
|
312
|
+
// Untracked, as in `removeAt()`: called from a consumer's `effect()`, the list read here would make the effect
|
|
313
|
+
// run again on every change it makes — and remove the next item.
|
|
314
|
+
const index = untracked(this.list).indexOf(item);
|
|
315
|
+
return index === -1 ? [] : this.removeAt(index);
|
|
303
316
|
}
|
|
304
|
-
/**
|
|
317
|
+
/**
|
|
318
|
+
* Removes item at specified index. Returns removed items and emits event.
|
|
319
|
+
* An index outside the list removes nothing, emits nothing and leaves the list untouched.
|
|
320
|
+
*/
|
|
305
321
|
removeAt(index) {
|
|
322
|
+
// `splice` silently does nothing for an index past either end. Without this guard the list
|
|
323
|
+
// was still rewritten with a fresh array — waking every `list()` consumer for a no-op — and
|
|
324
|
+
// `itemRemoved` fired carrying `undefined` in a tuple typed `[T, number]`.
|
|
325
|
+
if (index < 0 || index >= untracked(this.list).length)
|
|
326
|
+
return [];
|
|
306
327
|
const removed = [];
|
|
307
328
|
this.update((current) => {
|
|
308
329
|
const copy = [...current];
|
|
@@ -315,10 +336,10 @@ class KbqFileList {
|
|
|
315
336
|
update(fn) {
|
|
316
337
|
this.list.update(fn);
|
|
317
338
|
}
|
|
318
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
319
|
-
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "
|
|
339
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KbqFileList, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
340
|
+
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.25", type: KbqFileList, isStandalone: true, selector: "[kbqFileList]", inputs: { list: { classPropertyName: "list", publicName: "list", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { list: "listChange", itemRemoved: "itemRemoved", itemsAdded: "itemsAdded" }, host: { classAttribute: "kbq-file-list" }, exportAs: ["kbqFileList"], ngImport: i0 }); }
|
|
320
341
|
}
|
|
321
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
342
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KbqFileList, decorators: [{
|
|
322
343
|
type: Directive,
|
|
323
344
|
args: [{
|
|
324
345
|
selector: '[kbqFileList]',
|
|
@@ -333,7 +354,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.30", ngImpo
|
|
|
333
354
|
const KBQ_DROPZONE_DATA = new InjectionToken('KbqDropzoneData');
|
|
334
355
|
/**
|
|
335
356
|
* Determines if a mouse event occurred outside the viewport boundaries.
|
|
336
|
-
*
|
|
357
|
+
*
|
|
358
|
+
* @internal
|
|
337
359
|
*/
|
|
338
360
|
const isOutsideViewport = ({ event, innerWidth, innerHeight, xAxisMinThreshold, yAxisMinThreshold }) => {
|
|
339
361
|
return (event.clientX <= xAxisMinThreshold ||
|
|
@@ -353,15 +375,24 @@ class KbqFullScreenDropzoneService extends KbqDrop {
|
|
|
353
375
|
this.window = inject(KBQ_WINDOW);
|
|
354
376
|
this.injector = inject(Injector);
|
|
355
377
|
this.ngZone = inject(NgZone);
|
|
378
|
+
this.animationsDisabled = kbqAnimationsDisabled();
|
|
356
379
|
}
|
|
357
380
|
ngOnDestroy() {
|
|
381
|
+
// The service is provided per component, and the listeners live on `document.body`: without
|
|
382
|
+
// this they would outlive the component and keep calling `open()` against a disposed view.
|
|
383
|
+
this.dropAbort.next();
|
|
384
|
+
this.dropAbort.complete();
|
|
358
385
|
this.close();
|
|
359
386
|
}
|
|
360
387
|
/**
|
|
361
388
|
* Initializes drag-and-drop event listeners on the document body.
|
|
389
|
+
*
|
|
362
390
|
* @param config - Dropzone configuration
|
|
363
391
|
*/
|
|
364
392
|
init(config) {
|
|
393
|
+
// Idempotent: re-initializing with a new configuration replaces the listeners instead of
|
|
394
|
+
// stacking a second set, which would emit `filesDropped` twice for one physical drop.
|
|
395
|
+
this.stop();
|
|
365
396
|
this.ngZone.runOutsideAngular(() => {
|
|
366
397
|
fromEvent(this.window.document.body, 'dragenter')
|
|
367
398
|
.pipe(filter(() => !this.disabled()), takeUntil(this.dropAbort))
|
|
@@ -392,6 +423,7 @@ class KbqFullScreenDropzoneService extends KbqDrop {
|
|
|
392
423
|
}
|
|
393
424
|
/**
|
|
394
425
|
* Opens the dropzone overlay.
|
|
426
|
+
*
|
|
395
427
|
* @param config - Dropzone configuration
|
|
396
428
|
*/
|
|
397
429
|
open(config) {
|
|
@@ -421,13 +453,20 @@ class KbqFullScreenDropzoneService extends KbqDrop {
|
|
|
421
453
|
createOverlay() {
|
|
422
454
|
return this.overlay.create({
|
|
423
455
|
hasBackdrop: false,
|
|
424
|
-
panelClass: [
|
|
456
|
+
panelClass: [
|
|
457
|
+
'kbq-dropzone-overlay',
|
|
458
|
+
'kbq-fullscreen-dropzone',
|
|
459
|
+
...(this.animationsDisabled ? ['kbq-animations-disabled'] : [])
|
|
460
|
+
],
|
|
425
461
|
width: '100%',
|
|
426
462
|
height: '100%',
|
|
427
463
|
positionStrategy: this.overlay.position().global().centerHorizontally().centerVertically()
|
|
428
464
|
});
|
|
429
465
|
}
|
|
430
|
-
/**
|
|
466
|
+
/**
|
|
467
|
+
* Closes the overlay once the drag leaves the page. Safari reports a drag event with no `relatedTarget`
|
|
468
|
+
* ([WebKit bug 66547](https://bugs.webkit.org/show_bug.cgi?id=66547)), so there the pointer position decides.
|
|
469
|
+
*/
|
|
431
470
|
onDragLeave(event) {
|
|
432
471
|
if (!isHtmlElementOrNull(event.currentTarget) || !isHtmlElementOrNull(event.relatedTarget))
|
|
433
472
|
return;
|
|
@@ -446,10 +485,10 @@ class KbqFullScreenDropzoneService extends KbqDrop {
|
|
|
446
485
|
event.stopPropagation();
|
|
447
486
|
this.close();
|
|
448
487
|
}
|
|
449
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
450
|
-
/** @nocollapse */ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
488
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KbqFullScreenDropzoneService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
489
|
+
/** @nocollapse */ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KbqFullScreenDropzoneService, providedIn: 'root' }); }
|
|
451
490
|
}
|
|
452
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
491
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KbqFullScreenDropzoneService, decorators: [{
|
|
453
492
|
type: Injectable,
|
|
454
493
|
args: [{
|
|
455
494
|
providedIn: 'root'
|
|
@@ -465,15 +504,14 @@ class KbqLocalDropzone extends KbqDrop {
|
|
|
465
504
|
constructor() {
|
|
466
505
|
super();
|
|
467
506
|
/** File upload component to connect dropped files to */
|
|
468
|
-
this.connectedTo = input(undefined, ...(ngDevMode ?
|
|
469
|
-
alias: 'kbqConnectedTo'
|
|
470
|
-
}]));
|
|
507
|
+
this.connectedTo = input(undefined, { ...(ngDevMode ? { debugName: "connectedTo" } : /* istanbul ignore next */ {}), alias: 'kbqConnectedTo' });
|
|
471
508
|
this.elementRef = kbqInjectNativeElement();
|
|
472
509
|
this.overlay = inject(Overlay);
|
|
473
510
|
this.viewContainerRef = inject(ViewContainerRef);
|
|
474
511
|
this.injector = inject(Injector);
|
|
475
512
|
this.ngZone = inject(NgZone);
|
|
476
513
|
this.destroyRef = inject(DestroyRef);
|
|
514
|
+
this.animationsDisabled = kbqAnimationsDisabled();
|
|
477
515
|
this.filesDropped.subscribe((files) => this.connectedTo()?.onFileDropped(files));
|
|
478
516
|
fromEvent(this.elementRef, 'dragenter')
|
|
479
517
|
.pipe(takeUntilDestroyed())
|
|
@@ -482,6 +520,7 @@ class KbqLocalDropzone extends KbqDrop {
|
|
|
482
520
|
event.stopPropagation();
|
|
483
521
|
this.open();
|
|
484
522
|
});
|
|
523
|
+
this.destroyRef.onDestroy(() => this.close());
|
|
485
524
|
}
|
|
486
525
|
/** Opens the dropzone overlay positioned over the host element. */
|
|
487
526
|
open(config) {
|
|
@@ -514,19 +553,24 @@ class KbqLocalDropzone extends KbqDrop {
|
|
|
514
553
|
*/
|
|
515
554
|
init() {
|
|
516
555
|
this.ngZone.runOutsideAngular(() => {
|
|
517
|
-
|
|
556
|
+
const overlayRef = this.overlayRef;
|
|
557
|
+
if (!overlayRef)
|
|
518
558
|
return;
|
|
519
|
-
|
|
520
|
-
|
|
559
|
+
// Scoped to the overlay rather than to the directive: `open()` runs on every drag-in, so
|
|
560
|
+
// a directive-scoped stream would strand three more subscriptions on a disposed element
|
|
561
|
+
// per drag-in/drag-out cycle.
|
|
562
|
+
const detached = overlayRef.detachments();
|
|
563
|
+
fromEvent(overlayRef.overlayElement, 'dragover')
|
|
564
|
+
.pipe(filter(() => !this.disabled()), takeUntil(detached))
|
|
521
565
|
.subscribe((event) => {
|
|
522
566
|
event.preventDefault();
|
|
523
567
|
event.stopPropagation();
|
|
524
568
|
});
|
|
525
|
-
fromEvent(
|
|
526
|
-
.pipe(filter(() => !this.disabled()),
|
|
569
|
+
fromEvent(overlayRef.overlayElement, 'dragleave')
|
|
570
|
+
.pipe(filter(() => !this.disabled()), takeUntil(detached))
|
|
527
571
|
.subscribe((event) => this.onDragLeave(event));
|
|
528
|
-
fromEvent(
|
|
529
|
-
.pipe(filter(() => !this.disabled()),
|
|
572
|
+
fromEvent(overlayRef.overlayElement, 'drop')
|
|
573
|
+
.pipe(filter(() => !this.disabled()), takeUntil(detached))
|
|
530
574
|
.subscribe((event) => this.onDrop(event));
|
|
531
575
|
});
|
|
532
576
|
}
|
|
@@ -534,7 +578,11 @@ class KbqLocalDropzone extends KbqDrop {
|
|
|
534
578
|
createOverlay() {
|
|
535
579
|
return this.overlay.create({
|
|
536
580
|
hasBackdrop: false,
|
|
537
|
-
panelClass: [
|
|
581
|
+
panelClass: [
|
|
582
|
+
'kbq-dropzone-overlay',
|
|
583
|
+
'kbq-local-dropzone',
|
|
584
|
+
...(this.animationsDisabled ? ['kbq-animations-disabled'] : [])
|
|
585
|
+
],
|
|
538
586
|
width: this.elementRef.offsetWidth,
|
|
539
587
|
height: this.elementRef.offsetHeight,
|
|
540
588
|
positionStrategy: this.overlay
|
|
@@ -565,10 +613,10 @@ class KbqLocalDropzone extends KbqDrop {
|
|
|
565
613
|
event.stopPropagation();
|
|
566
614
|
this.close();
|
|
567
615
|
}
|
|
568
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
569
|
-
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "
|
|
616
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KbqLocalDropzone, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
617
|
+
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.25", type: KbqLocalDropzone, isStandalone: true, selector: "[kbqLocalDropzone]", inputs: { connectedTo: { classPropertyName: "connectedTo", publicName: "kbqConnectedTo", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "kbq-local-dropzone__trigger" }, exportAs: ["kbqLocalDropzone"], usesInheritance: true, ngImport: i0 }); }
|
|
570
618
|
}
|
|
571
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
619
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KbqLocalDropzone, decorators: [{
|
|
572
620
|
type: Directive,
|
|
573
621
|
args: [{
|
|
574
622
|
selector: '[kbqLocalDropzone]',
|
|
@@ -579,19 +627,23 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.30", ngImpo
|
|
|
579
627
|
/** Component that displays an empty state for file upload areas. */
|
|
580
628
|
class KbqFileUploadEmptyState extends KbqEmptyState {
|
|
581
629
|
constructor() {
|
|
582
|
-
super();
|
|
630
|
+
super(...arguments);
|
|
583
631
|
/** Title text to display below the upload icon */
|
|
584
|
-
this.title = input(...(ngDevMode ? [undefined, { debugName: "title" }] : []));
|
|
632
|
+
this.title = input(...(ngDevMode ? [undefined, { debugName: "title" }] : /* istanbul ignore next */ []));
|
|
585
633
|
/** Caption text or template to display below the title */
|
|
586
|
-
this.caption = input(...(ngDevMode ? [undefined, { debugName: "caption" }] : []));
|
|
587
|
-
|
|
634
|
+
this.caption = input(...(ngDevMode ? [undefined, { debugName: "caption" }] : /* istanbul ignore next */ []));
|
|
635
|
+
/**
|
|
636
|
+
* Same input as `KbqEmptyState.size`, redeclared only to default to `big` instead of `normal`.
|
|
637
|
+
* It used to be a `super()`-time assignment, which an `input()` cannot take.
|
|
638
|
+
*/
|
|
639
|
+
this.size = input('big', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
|
|
588
640
|
}
|
|
589
641
|
/** @docs-private */
|
|
590
642
|
isTemplateRef(value) {
|
|
591
643
|
return value instanceof TemplateRef;
|
|
592
644
|
}
|
|
593
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
594
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
645
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KbqFileUploadEmptyState, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
646
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.25", type: KbqFileUploadEmptyState, isStandalone: true, selector: "kbq-file-upload-empty-state", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, caption: { classPropertyName: "caption", publicName: "caption", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "kbq-multiple-file-upload__empty-state" }, usesInheritance: true, ngImport: i0, template: `
|
|
595
647
|
<i
|
|
596
648
|
class="kbq-multiple-file-upload__empty-state-upload-icon"
|
|
597
649
|
kbq-empty-state-icon
|
|
@@ -609,9 +661,9 @@ class KbqFileUploadEmptyState extends KbqEmptyState {
|
|
|
609
661
|
}
|
|
610
662
|
</div>
|
|
611
663
|
}
|
|
612
|
-
`, isInline: true, styles: [".kbq-dropzone-overlay{--kbq-dropzone-padding: var(--kbq-size-s);--kbq-dropzone-overlay-background: var(--kbq-background-overlay-theme);--kbq-dropzone-component-background: var(--kbq-background-overlay-theme);--kbq-dropzone-border-color: var(--kbq-line-theme-fade);padding:var(--kbq-dropzone-padding);background-color:var(--kbq-dropzone-overlay-background);opacity:0;transition:opacity .1s ease-in-out}.kbq-dropzone-overlay.kbq-dropzone-overlay__attached{opacity:1}.kbq-dropzone-overlay .kbq-dropzone-content{display:flex;width:100%;align-items:center;justify-content:center;border-radius:var(--kbq-size-border-radius);border:var(--kbq-size-border-width) dashed var(--kbq-dropzone-border-color);background-color:var(--kbq-dropzone-component-background);outline:none}.kbq-fullscreen-dropzone{--kbq-dropzone-component-background: transparent}.kbq-local-dropzone{--kbq-dropzone-overlay-background: transparent}.kbq-local-dropzone .kbq-empty-state.kbq-multiple-file-upload__empty-state{--kbq-empty-state-size-compact-padding-top: 0;--kbq-empty-state-size-compact-padding-horizontal: 0;--kbq-empty-state-size-compact-padding-bottom: 0;--kbq-empty-state-size-normal-padding-top: 0;--kbq-empty-state-size-normal-padding-horizontal: 0;--kbq-empty-state-size-normal-padding-bottom: 0;--kbq-empty-state-size-big-padding-top: 0;--kbq-empty-state-size-big-padding-horizontal: 0;--kbq-empty-state-size-big-padding-bottom: 0}.kbq-empty-state.kbq-multiple-file-upload__empty-state{--kbq-empty-state-size-normal-image-margin-bottom: var(--kbq-size-m);--kbq-empty-state-size-normal-title-margin-bottom: var(--kbq-size-xs)}\n", ".kbq-empty-state{display:flex;flex-direction:column;align-items:center;flex:1}.kbq-empty-state.kbq-empty-state_compact{padding:var(--kbq-empty-state-size-compact-padding-top) var(--kbq-empty-state-size-compact-padding-horizontal) var(--kbq-empty-state-size-compact-padding-bottom)}.kbq-empty-state.kbq-empty-state_compact .kbq-empty-state-icon{margin-bottom:var(--kbq-empty-state-size-compact-image-margin-bottom)}.kbq-empty-state.kbq-empty-state_compact .kbq-empty-state-text{max-width:var(--kbq-empty-state-size-compact-max-width)}.kbq-empty-state.kbq-empty-state_compact .kbq-empty-state-title{max-width:var(--kbq-empty-state-size-compact-max-width);margin-bottom:var(--kbq-empty-state-size-compact-title-margin-bottom)}.kbq-empty-state.kbq-empty-state_compact .kbq-empty-state-actions{max-width:var(--kbq-empty-state-size-compact-max-width);margin-top:var(--kbq-empty-state-size-compact-actions-margin-top)}.kbq-empty-state.kbq-empty-state_compact.kbq-empty-state_align-center.kbq-empty-state_has-icon{margin-bottom:var(--kbq-empty-state-size-compact-image-addon-height)}.kbq-empty-state.kbq-empty-state_normal{padding:var(--kbq-empty-state-size-normal-padding-top) var(--kbq-empty-state-size-normal-padding-horizontal) var(--kbq-empty-state-size-normal-padding-bottom)}.kbq-empty-state.kbq-empty-state_normal .kbq-empty-state-icon{margin-bottom:var(--kbq-empty-state-size-normal-image-margin-bottom)}.kbq-empty-state.kbq-empty-state_normal .kbq-empty-state-text{max-width:var(--kbq-empty-state-size-normal-max-width)}.kbq-empty-state.kbq-empty-state_normal .kbq-empty-state-title{max-width:var(--kbq-empty-state-size-normal-max-width);margin-bottom:var(--kbq-empty-state-size-normal-title-margin-bottom)}.kbq-empty-state.kbq-empty-state_normal .kbq-empty-state-actions{max-width:var(--kbq-empty-state-size-normal-max-width);margin-top:var(--kbq-empty-state-size-normal-actions-margin-top)}.kbq-empty-state.kbq-empty-state_normal.kbq-empty-state_align-center.kbq-empty-state_has-icon{margin-bottom:var(--kbq-empty-state-size-normal-image-addon-height)}.kbq-empty-state.kbq-empty-state_big{padding:var(--kbq-empty-state-size-big-padding-top) var(--kbq-empty-state-size-big-padding-horizontal) var(--kbq-empty-state-size-big-padding-bottom)}.kbq-empty-state.kbq-empty-state_big .kbq-empty-state-icon{margin-bottom:var(--kbq-empty-state-size-big-image-margin-bottom)}.kbq-empty-state.kbq-empty-state_big .kbq-empty-state-text{max-width:var(--kbq-empty-state-size-big-max-width)}.kbq-empty-state.kbq-empty-state_big .kbq-empty-state-title{max-width:var(--kbq-empty-state-size-big-max-width);margin-bottom:var(--kbq-empty-state-size-big-title-margin-bottom)}.kbq-empty-state.kbq-empty-state_big .kbq-empty-state-actions{max-width:var(--kbq-empty-state-size-big-max-width);margin-top:var(--kbq-empty-state-size-big-actions-margin-top)}.kbq-empty-state.kbq-empty-state_big.kbq-empty-state_align-center.kbq-empty-state_has-icon{margin-bottom:var(--kbq-empty-state-size-big-image-addon-height)}.kbq-empty-state.kbq-empty-state_align-center{justify-content:center}.kbq-empty-state.kbq-empty-state_align-top{justify-content:flex-start}.kbq-empty-state_normal-color .kbq-empty-state-title{color:var(--kbq-empty-state-title)}.kbq-empty-state_normal-color .kbq-empty-state-text{color:var(--kbq-empty-state-color)}.kbq-empty-state_error-color .kbq-empty-state-title{color:var(--kbq-empty-state-error-title)}.kbq-empty-state_error-color .kbq-empty-state-text{color:var(--kbq-empty-state-error-color)}.kbq-empty-state-title,.kbq-empty-state-text{text-align:center}.kbq-empty-state_compact .kbq-empty-state-title{font-size:var(--kbq-typography-text-normal-font-size);font-style:var(--kbq-typography-text-normal-font-style);font-weight:var(--kbq-typography-text-normal-font-weight);line-height:var(--kbq-typography-text-normal-line-height);font-family:var(--kbq-typography-text-normal-font-family);text-transform:var(--kbq-typography-text-normal-text-transform);font-feature-settings:var(--kbq-typography-text-normal-font-feature-settings);letter-spacing:var(--kbq-typography-text-normal-letter-spacing)}.kbq-empty-state_compact .kbq-empty-state-text{font-size:var(--kbq-typography-text-compact-font-size);font-style:var(--kbq-typography-text-compact-font-style);font-weight:var(--kbq-typography-text-compact-font-weight);line-height:var(--kbq-typography-text-compact-line-height);font-family:var(--kbq-typography-text-compact-font-family);text-transform:var(--kbq-typography-text-compact-text-transform);font-feature-settings:var(--kbq-typography-text-compact-font-feature-settings);letter-spacing:var(--kbq-typography-text-compact-letter-spacing)}.kbq-empty-state_normal .kbq-empty-state-title{font-size:var(--kbq-typography-subheading-font-size);font-style:var(--kbq-typography-subheading-font-style);font-weight:var(--kbq-typography-subheading-font-weight);line-height:var(--kbq-typography-subheading-line-height);font-family:var(--kbq-typography-subheading-font-family);text-transform:var(--kbq-typography-subheading-text-transform);font-feature-settings:var(--kbq-typography-subheading-font-feature-settings);letter-spacing:var(--kbq-typography-subheading-letter-spacing)}.kbq-empty-state_normal .kbq-empty-state-text{font-size:var(--kbq-typography-text-normal-font-size);font-style:var(--kbq-typography-text-normal-font-style);font-weight:var(--kbq-typography-text-normal-font-weight);line-height:var(--kbq-typography-text-normal-line-height);font-family:var(--kbq-typography-text-normal-font-family);text-transform:var(--kbq-typography-text-normal-text-transform);font-feature-settings:var(--kbq-typography-text-normal-font-feature-settings);letter-spacing:var(--kbq-typography-text-normal-letter-spacing)}.kbq-empty-state_big .kbq-empty-state-title{font-size:var(--kbq-typography-headline-font-size);font-style:var(--kbq-typography-headline-font-style);font-weight:var(--kbq-typography-headline-font-weight);line-height:var(--kbq-typography-headline-line-height);font-family:var(--kbq-typography-headline-font-family);text-transform:var(--kbq-typography-headline-text-transform);font-feature-settings:var(--kbq-typography-headline-font-feature-settings);letter-spacing:var(--kbq-typography-headline-letter-spacing)}.kbq-empty-state_big .kbq-empty-state-text{font-size:var(--kbq-typography-text-big-font-size);font-style:var(--kbq-typography-text-big-font-style);font-weight:var(--kbq-typography-text-big-font-weight);line-height:var(--kbq-typography-text-big-line-height);font-family:var(--kbq-typography-text-big-font-family);text-transform:var(--kbq-typography-text-big-text-transform);font-feature-settings:var(--kbq-typography-text-big-font-feature-settings);letter-spacing:var(--kbq-typography-text-big-letter-spacing)}\n"], dependencies: [{ kind: "directive", type: KbqEmptyStateIcon, selector: "[kbq-empty-state-icon]" }, { kind: "directive", type: KbqEmptyStateTitle, selector: "[kbq-empty-state-title]" }, { kind: "directive", type: KbqEmptyStateText, selector: "[kbq-empty-state-text]" }, { kind: "component", type: KbqIcon, selector: "[kbq-icon]", inputs: ["small", "autoColor", "kbq-icon"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
664
|
+
`, isInline: true, styles: ["@charset \"UTF-8\";.kbq-dropzone-overlay{--kbq-dropzone-padding: var(--kbq-size-s);--kbq-dropzone-overlay-background: color-mix( in srgb, var(--kbq-background-overlay-base-theme) calc(var(--kbq-opacity-overlay) * 100%), transparent );--kbq-dropzone-component-background: color-mix( in srgb, var(--kbq-background-overlay-base-theme) calc(var(--kbq-opacity-overlay) * 100%), transparent );--kbq-dropzone-border-color: var(--kbq-line-theme-fade);padding:var(--kbq-dropzone-padding);background-color:var(--kbq-dropzone-overlay-background);opacity:0;transition:opacity .1s ease-in-out}.kbq-dropzone-overlay.kbq-animations-disabled{animation:none;transition:none}@media(prefers-reduced-motion:reduce){.kbq-dropzone-overlay{animation:none;transition:none}}.kbq-dropzone-overlay.kbq-dropzone-overlay__attached{opacity:1}.kbq-dropzone-overlay .kbq-dropzone-content{display:flex;width:100%;align-items:center;justify-content:center;border-radius:var(--kbq-size-border-radius)}@supports (corner-shape: squircle){.kbq-dropzone-overlay .kbq-dropzone-content{corner-shape:squircle;border-radius:clamp(var(--kbq-size-border-radius) * 1.85,var(--kbq-size-border-radius) * 2.3 - 3.6px,var(--kbq-size-border-radius) * 2)}}.kbq-dropzone-overlay .kbq-dropzone-content{border:var(--kbq-size-border-width) dashed var(--kbq-dropzone-border-color);background-color:var(--kbq-dropzone-component-background);outline:none}.kbq-fullscreen-dropzone{--kbq-dropzone-component-background: transparent}.kbq-local-dropzone{--kbq-dropzone-overlay-background: transparent}.kbq-local-dropzone .kbq-empty-state.kbq-multiple-file-upload__empty-state{--kbq-empty-state-size-compact-padding-top: 0;--kbq-empty-state-size-compact-padding-horizontal: 0;--kbq-empty-state-size-compact-padding-bottom: 0;--kbq-empty-state-size-normal-padding-top: 0;--kbq-empty-state-size-normal-padding-horizontal: 0;--kbq-empty-state-size-normal-padding-bottom: 0;--kbq-empty-state-size-big-padding-top: 0;--kbq-empty-state-size-big-padding-horizontal: 0;--kbq-empty-state-size-big-padding-bottom: 0}.kbq-empty-state.kbq-multiple-file-upload__empty-state{--kbq-empty-state-size-normal-image-margin-bottom: var(--kbq-size-m);--kbq-empty-state-size-normal-title-margin-bottom: var(--kbq-size-xs)}.kbq-dropzone-content .kbq-empty-state.kbq-multiple-file-upload__empty-state{--kbq-empty-state-text-color: var(--kbq-foreground-contrast)}\n", ":where(.kbq-empty-state){--kbq-empty-state-size-big-max-width: 480px;--kbq-empty-state-size-big-padding-horizontal: var(--kbq-size-6xl);--kbq-empty-state-size-big-padding-top: var(--kbq-size-5xl);--kbq-empty-state-size-big-padding-bottom: var(--kbq-size-5xl);--kbq-empty-state-size-big-actions-margin-top: var(--kbq-size-xl);--kbq-empty-state-size-big-image-margin-bottom: var(--kbq-size-3xl);--kbq-empty-state-size-big-image-addon-height: var(--kbq-size-6xl);--kbq-empty-state-size-big-title-margin-bottom: var(--kbq-size-l);--kbq-empty-state-size-normal-max-width: 320px;--kbq-empty-state-size-normal-padding-horizontal: var(--kbq-size-3xl);--kbq-empty-state-size-normal-padding-top: var(--kbq-size-3xl);--kbq-empty-state-size-normal-padding-bottom: var(--kbq-size-3xl);--kbq-empty-state-size-normal-actions-margin-top: var(--kbq-size-s);--kbq-empty-state-size-normal-image-margin-bottom: var(--kbq-size-xl);--kbq-empty-state-size-normal-image-addon-height: var(--kbq-size-xxl);--kbq-empty-state-size-normal-title-margin-bottom: var(--kbq-size-xxs);--kbq-empty-state-size-compact-max-width: 320px;--kbq-empty-state-size-compact-padding-horizontal: var(--kbq-size-3xl);--kbq-empty-state-size-compact-padding-top: var(--kbq-size-3xl);--kbq-empty-state-size-compact-padding-bottom: var(--kbq-size-3xl);--kbq-empty-state-size-compact-actions-margin-top: var(--kbq-size-s);--kbq-empty-state-size-compact-image-margin-bottom: var(--kbq-size-m);--kbq-empty-state-size-compact-image-addon-height: 0;--kbq-empty-state-size-compact-title-margin-bottom: var(--kbq-size-xxs);--kbq-empty-state-title-color: var(--kbq-foreground-contrast);--kbq-empty-state-text-color: var(--kbq-foreground-contrast-secondary);--kbq-empty-state-error-title-color: var(--kbq-foreground-error);--kbq-empty-state-error-text-color: var(--kbq-foreground-error)}.kbq-empty-state{display:flex;flex-direction:column;align-items:center;flex:1}.kbq-empty-state.kbq-empty-state_compact{padding:var(--kbq-empty-state-size-compact-padding-top) var(--kbq-empty-state-size-compact-padding-horizontal) var(--kbq-empty-state-size-compact-padding-bottom)}.kbq-empty-state.kbq-empty-state_compact .kbq-empty-state-icon{margin-bottom:var(--kbq-empty-state-size-compact-image-margin-bottom)}.kbq-empty-state.kbq-empty-state_compact .kbq-empty-state-text{max-width:var(--kbq-empty-state-size-compact-max-width)}.kbq-empty-state.kbq-empty-state_compact .kbq-empty-state-title{max-width:var(--kbq-empty-state-size-compact-max-width);margin-bottom:var(--kbq-empty-state-size-compact-title-margin-bottom)}.kbq-empty-state.kbq-empty-state_compact .kbq-empty-state-actions{max-width:var(--kbq-empty-state-size-compact-max-width);margin-top:var(--kbq-empty-state-size-compact-actions-margin-top)}.kbq-empty-state.kbq-empty-state_compact.kbq-empty-state_align-center.kbq-empty-state_has-icon{margin-bottom:var(--kbq-empty-state-size-compact-image-addon-height)}.kbq-empty-state.kbq-empty-state_normal{padding:var(--kbq-empty-state-size-normal-padding-top) var(--kbq-empty-state-size-normal-padding-horizontal) var(--kbq-empty-state-size-normal-padding-bottom)}.kbq-empty-state.kbq-empty-state_normal .kbq-empty-state-icon{margin-bottom:var(--kbq-empty-state-size-normal-image-margin-bottom)}.kbq-empty-state.kbq-empty-state_normal .kbq-empty-state-text{max-width:var(--kbq-empty-state-size-normal-max-width)}.kbq-empty-state.kbq-empty-state_normal .kbq-empty-state-title{max-width:var(--kbq-empty-state-size-normal-max-width);margin-bottom:var(--kbq-empty-state-size-normal-title-margin-bottom)}.kbq-empty-state.kbq-empty-state_normal .kbq-empty-state-actions{max-width:var(--kbq-empty-state-size-normal-max-width);margin-top:var(--kbq-empty-state-size-normal-actions-margin-top)}.kbq-empty-state.kbq-empty-state_normal.kbq-empty-state_align-center.kbq-empty-state_has-icon{margin-bottom:var(--kbq-empty-state-size-normal-image-addon-height)}.kbq-empty-state.kbq-empty-state_big{padding:var(--kbq-empty-state-size-big-padding-top) var(--kbq-empty-state-size-big-padding-horizontal) var(--kbq-empty-state-size-big-padding-bottom)}.kbq-empty-state.kbq-empty-state_big .kbq-empty-state-icon{margin-bottom:var(--kbq-empty-state-size-big-image-margin-bottom)}.kbq-empty-state.kbq-empty-state_big .kbq-empty-state-text{max-width:var(--kbq-empty-state-size-big-max-width)}.kbq-empty-state.kbq-empty-state_big .kbq-empty-state-title{max-width:var(--kbq-empty-state-size-big-max-width);margin-bottom:var(--kbq-empty-state-size-big-title-margin-bottom)}.kbq-empty-state.kbq-empty-state_big .kbq-empty-state-actions{max-width:var(--kbq-empty-state-size-big-max-width);margin-top:var(--kbq-empty-state-size-big-actions-margin-top)}.kbq-empty-state.kbq-empty-state_big.kbq-empty-state_align-center.kbq-empty-state_has-icon{margin-bottom:var(--kbq-empty-state-size-big-image-addon-height)}.kbq-empty-state.kbq-empty-state_align-center{justify-content:center}.kbq-empty-state.kbq-empty-state_align-top{justify-content:flex-start}.kbq-empty-state_normal-color .kbq-empty-state-title{color:var(--kbq-empty-state-title-color)}.kbq-empty-state_normal-color .kbq-empty-state-text{color:var(--kbq-empty-state-text-color)}.kbq-empty-state_error-color .kbq-empty-state-title{color:var(--kbq-empty-state-error-title-color)}.kbq-empty-state_error-color .kbq-empty-state-text{color:var(--kbq-empty-state-error-text-color)}.kbq-empty-state-title,.kbq-empty-state-text{text-align:center}.kbq-empty-state-title{margin:0}.kbq-empty-state_compact .kbq-empty-state-title{font-size:var(--kbq-typography-text-normal-font-size);font-style:var(--kbq-typography-text-normal-font-style);font-weight:var(--kbq-typography-text-normal-font-weight);line-height:var(--kbq-typography-text-normal-line-height);font-family:var(--kbq-typography-text-normal-font-family);text-transform:var(--kbq-typography-text-normal-text-transform);font-feature-settings:var(--kbq-typography-text-normal-font-feature-settings);letter-spacing:var(--kbq-typography-text-normal-letter-spacing)}.kbq-empty-state_compact .kbq-empty-state-text{font-size:var(--kbq-typography-text-compact-font-size);font-style:var(--kbq-typography-text-compact-font-style);font-weight:var(--kbq-typography-text-compact-font-weight);line-height:var(--kbq-typography-text-compact-line-height);font-family:var(--kbq-typography-text-compact-font-family);text-transform:var(--kbq-typography-text-compact-text-transform);font-feature-settings:var(--kbq-typography-text-compact-font-feature-settings);letter-spacing:var(--kbq-typography-text-compact-letter-spacing)}.kbq-empty-state_normal .kbq-empty-state-title{font-size:var(--kbq-typography-subheading-font-size);font-style:var(--kbq-typography-subheading-font-style);font-weight:var(--kbq-typography-subheading-font-weight);line-height:var(--kbq-typography-subheading-line-height);font-family:var(--kbq-typography-subheading-font-family);text-transform:var(--kbq-typography-subheading-text-transform);font-feature-settings:var(--kbq-typography-subheading-font-feature-settings);letter-spacing:var(--kbq-typography-subheading-letter-spacing)}.kbq-empty-state_normal .kbq-empty-state-text{font-size:var(--kbq-typography-text-normal-font-size);font-style:var(--kbq-typography-text-normal-font-style);font-weight:var(--kbq-typography-text-normal-font-weight);line-height:var(--kbq-typography-text-normal-line-height);font-family:var(--kbq-typography-text-normal-font-family);text-transform:var(--kbq-typography-text-normal-text-transform);font-feature-settings:var(--kbq-typography-text-normal-font-feature-settings);letter-spacing:var(--kbq-typography-text-normal-letter-spacing)}.kbq-empty-state_big .kbq-empty-state-title{font-size:var(--kbq-typography-headline-font-size);font-style:var(--kbq-typography-headline-font-style);font-weight:var(--kbq-typography-headline-font-weight);line-height:var(--kbq-typography-headline-line-height);font-family:var(--kbq-typography-headline-font-family);text-transform:var(--kbq-typography-headline-text-transform);font-feature-settings:var(--kbq-typography-headline-font-feature-settings);letter-spacing:var(--kbq-typography-headline-letter-spacing)}.kbq-empty-state_big .kbq-empty-state-text{font-size:var(--kbq-typography-text-big-font-size);font-style:var(--kbq-typography-text-big-font-style);font-weight:var(--kbq-typography-text-big-font-weight);line-height:var(--kbq-typography-text-big-line-height);font-family:var(--kbq-typography-text-big-font-family);text-transform:var(--kbq-typography-text-big-text-transform);font-feature-settings:var(--kbq-typography-text-big-font-feature-settings);letter-spacing:var(--kbq-typography-text-big-letter-spacing)}\n"], dependencies: [{ kind: "directive", type: KbqEmptyStateIcon, selector: "[kbq-empty-state-icon]" }, { kind: "directive", type: KbqEmptyStateTitle, selector: "[kbq-empty-state-title]" }, { kind: "directive", type: KbqEmptyStateText, selector: "[kbq-empty-state-text]" }, { kind: "component", type: KbqIcon, selector: "[kbq-icon]", inputs: ["aria-hidden", "iconSize", "autoColor", "kbq-icon"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
613
665
|
}
|
|
614
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
666
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KbqFileUploadEmptyState, decorators: [{
|
|
615
667
|
type: Component,
|
|
616
668
|
args: [{ selector: 'kbq-file-upload-empty-state', imports: [
|
|
617
669
|
KbqEmptyStateIcon,
|
|
@@ -639,34 +691,28 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.30", ngImpo
|
|
|
639
691
|
}
|
|
640
692
|
`, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
|
|
641
693
|
class: 'kbq-multiple-file-upload__empty-state'
|
|
642
|
-
}, styles: [".kbq-dropzone-overlay{--kbq-dropzone-padding: var(--kbq-size-s);--kbq-dropzone-overlay-background: var(--kbq-background-overlay-theme);--kbq-dropzone-component-background: var(--kbq-background-overlay-theme);--kbq-dropzone-border-color: var(--kbq-line-theme-fade);padding:var(--kbq-dropzone-padding);background-color:var(--kbq-dropzone-overlay-background);opacity:0;transition:opacity .1s ease-in-out}.kbq-dropzone-overlay.kbq-dropzone-overlay__attached{opacity:1}.kbq-dropzone-overlay .kbq-dropzone-content{display:flex;width:100%;align-items:center;justify-content:center;border-radius:var(--kbq-size-border-radius);border:var(--kbq-size-border-width) dashed var(--kbq-dropzone-border-color);background-color:var(--kbq-dropzone-component-background);outline:none}.kbq-fullscreen-dropzone{--kbq-dropzone-component-background: transparent}.kbq-local-dropzone{--kbq-dropzone-overlay-background: transparent}.kbq-local-dropzone .kbq-empty-state.kbq-multiple-file-upload__empty-state{--kbq-empty-state-size-compact-padding-top: 0;--kbq-empty-state-size-compact-padding-horizontal: 0;--kbq-empty-state-size-compact-padding-bottom: 0;--kbq-empty-state-size-normal-padding-top: 0;--kbq-empty-state-size-normal-padding-horizontal: 0;--kbq-empty-state-size-normal-padding-bottom: 0;--kbq-empty-state-size-big-padding-top: 0;--kbq-empty-state-size-big-padding-horizontal: 0;--kbq-empty-state-size-big-padding-bottom: 0}.kbq-empty-state.kbq-multiple-file-upload__empty-state{--kbq-empty-state-size-normal-image-margin-bottom: var(--kbq-size-m);--kbq-empty-state-size-normal-title-margin-bottom: var(--kbq-size-xs)}\n", ".kbq-empty-state{display:flex;flex-direction:column;align-items:center;flex:1}.kbq-empty-state.kbq-empty-state_compact{padding:var(--kbq-empty-state-size-compact-padding-top) var(--kbq-empty-state-size-compact-padding-horizontal) var(--kbq-empty-state-size-compact-padding-bottom)}.kbq-empty-state.kbq-empty-state_compact .kbq-empty-state-icon{margin-bottom:var(--kbq-empty-state-size-compact-image-margin-bottom)}.kbq-empty-state.kbq-empty-state_compact .kbq-empty-state-text{max-width:var(--kbq-empty-state-size-compact-max-width)}.kbq-empty-state.kbq-empty-state_compact .kbq-empty-state-title{max-width:var(--kbq-empty-state-size-compact-max-width);margin-bottom:var(--kbq-empty-state-size-compact-title-margin-bottom)}.kbq-empty-state.kbq-empty-state_compact .kbq-empty-state-actions{max-width:var(--kbq-empty-state-size-compact-max-width);margin-top:var(--kbq-empty-state-size-compact-actions-margin-top)}.kbq-empty-state.kbq-empty-state_compact.kbq-empty-state_align-center.kbq-empty-state_has-icon{margin-bottom:var(--kbq-empty-state-size-compact-image-addon-height)}.kbq-empty-state.kbq-empty-state_normal{padding:var(--kbq-empty-state-size-normal-padding-top) var(--kbq-empty-state-size-normal-padding-horizontal) var(--kbq-empty-state-size-normal-padding-bottom)}.kbq-empty-state.kbq-empty-state_normal .kbq-empty-state-icon{margin-bottom:var(--kbq-empty-state-size-normal-image-margin-bottom)}.kbq-empty-state.kbq-empty-state_normal .kbq-empty-state-text{max-width:var(--kbq-empty-state-size-normal-max-width)}.kbq-empty-state.kbq-empty-state_normal .kbq-empty-state-title{max-width:var(--kbq-empty-state-size-normal-max-width);margin-bottom:var(--kbq-empty-state-size-normal-title-margin-bottom)}.kbq-empty-state.kbq-empty-state_normal .kbq-empty-state-actions{max-width:var(--kbq-empty-state-size-normal-max-width);margin-top:var(--kbq-empty-state-size-normal-actions-margin-top)}.kbq-empty-state.kbq-empty-state_normal.kbq-empty-state_align-center.kbq-empty-state_has-icon{margin-bottom:var(--kbq-empty-state-size-normal-image-addon-height)}.kbq-empty-state.kbq-empty-state_big{padding:var(--kbq-empty-state-size-big-padding-top) var(--kbq-empty-state-size-big-padding-horizontal) var(--kbq-empty-state-size-big-padding-bottom)}.kbq-empty-state.kbq-empty-state_big .kbq-empty-state-icon{margin-bottom:var(--kbq-empty-state-size-big-image-margin-bottom)}.kbq-empty-state.kbq-empty-state_big .kbq-empty-state-text{max-width:var(--kbq-empty-state-size-big-max-width)}.kbq-empty-state.kbq-empty-state_big .kbq-empty-state-title{max-width:var(--kbq-empty-state-size-big-max-width);margin-bottom:var(--kbq-empty-state-size-big-title-margin-bottom)}.kbq-empty-state.kbq-empty-state_big .kbq-empty-state-actions{max-width:var(--kbq-empty-state-size-big-max-width);margin-top:var(--kbq-empty-state-size-big-actions-margin-top)}.kbq-empty-state.kbq-empty-state_big.kbq-empty-state_align-center.kbq-empty-state_has-icon{margin-bottom:var(--kbq-empty-state-size-big-image-addon-height)}.kbq-empty-state.kbq-empty-state_align-center{justify-content:center}.kbq-empty-state.kbq-empty-state_align-top{justify-content:flex-start}.kbq-empty-state_normal-color .kbq-empty-state-title{color:var(--kbq-empty-state-title)}.kbq-empty-state_normal-color .kbq-empty-state-text{color:var(--kbq-empty-state-color)}.kbq-empty-state_error-color .kbq-empty-state-title{color:var(--kbq-empty-state-error-title)}.kbq-empty-state_error-color .kbq-empty-state-text{color:var(--kbq-empty-state-error-color)}.kbq-empty-state-title,.kbq-empty-state-text{text-align:center}.kbq-empty-state_compact .kbq-empty-state-title{font-size:var(--kbq-typography-text-normal-font-size);font-style:var(--kbq-typography-text-normal-font-style);font-weight:var(--kbq-typography-text-normal-font-weight);line-height:var(--kbq-typography-text-normal-line-height);font-family:var(--kbq-typography-text-normal-font-family);text-transform:var(--kbq-typography-text-normal-text-transform);font-feature-settings:var(--kbq-typography-text-normal-font-feature-settings);letter-spacing:var(--kbq-typography-text-normal-letter-spacing)}.kbq-empty-state_compact .kbq-empty-state-text{font-size:var(--kbq-typography-text-compact-font-size);font-style:var(--kbq-typography-text-compact-font-style);font-weight:var(--kbq-typography-text-compact-font-weight);line-height:var(--kbq-typography-text-compact-line-height);font-family:var(--kbq-typography-text-compact-font-family);text-transform:var(--kbq-typography-text-compact-text-transform);font-feature-settings:var(--kbq-typography-text-compact-font-feature-settings);letter-spacing:var(--kbq-typography-text-compact-letter-spacing)}.kbq-empty-state_normal .kbq-empty-state-title{font-size:var(--kbq-typography-subheading-font-size);font-style:var(--kbq-typography-subheading-font-style);font-weight:var(--kbq-typography-subheading-font-weight);line-height:var(--kbq-typography-subheading-line-height);font-family:var(--kbq-typography-subheading-font-family);text-transform:var(--kbq-typography-subheading-text-transform);font-feature-settings:var(--kbq-typography-subheading-font-feature-settings);letter-spacing:var(--kbq-typography-subheading-letter-spacing)}.kbq-empty-state_normal .kbq-empty-state-text{font-size:var(--kbq-typography-text-normal-font-size);font-style:var(--kbq-typography-text-normal-font-style);font-weight:var(--kbq-typography-text-normal-font-weight);line-height:var(--kbq-typography-text-normal-line-height);font-family:var(--kbq-typography-text-normal-font-family);text-transform:var(--kbq-typography-text-normal-text-transform);font-feature-settings:var(--kbq-typography-text-normal-font-feature-settings);letter-spacing:var(--kbq-typography-text-normal-letter-spacing)}.kbq-empty-state_big .kbq-empty-state-title{font-size:var(--kbq-typography-headline-font-size);font-style:var(--kbq-typography-headline-font-style);font-weight:var(--kbq-typography-headline-font-weight);line-height:var(--kbq-typography-headline-line-height);font-family:var(--kbq-typography-headline-font-family);text-transform:var(--kbq-typography-headline-text-transform);font-feature-settings:var(--kbq-typography-headline-font-feature-settings);letter-spacing:var(--kbq-typography-headline-letter-spacing)}.kbq-empty-state_big .kbq-empty-state-text{font-size:var(--kbq-typography-text-big-font-size);font-style:var(--kbq-typography-text-big-font-style);font-weight:var(--kbq-typography-text-big-font-weight);line-height:var(--kbq-typography-text-big-line-height);font-family:var(--kbq-typography-text-big-font-family);text-transform:var(--kbq-typography-text-big-text-transform);font-feature-settings:var(--kbq-typography-text-big-font-feature-settings);letter-spacing:var(--kbq-typography-text-big-letter-spacing)}\n"] }]
|
|
643
|
-
}],
|
|
694
|
+
}, styles: ["@charset \"UTF-8\";.kbq-dropzone-overlay{--kbq-dropzone-padding: var(--kbq-size-s);--kbq-dropzone-overlay-background: color-mix( in srgb, var(--kbq-background-overlay-base-theme) calc(var(--kbq-opacity-overlay) * 100%), transparent );--kbq-dropzone-component-background: color-mix( in srgb, var(--kbq-background-overlay-base-theme) calc(var(--kbq-opacity-overlay) * 100%), transparent );--kbq-dropzone-border-color: var(--kbq-line-theme-fade);padding:var(--kbq-dropzone-padding);background-color:var(--kbq-dropzone-overlay-background);opacity:0;transition:opacity .1s ease-in-out}.kbq-dropzone-overlay.kbq-animations-disabled{animation:none;transition:none}@media(prefers-reduced-motion:reduce){.kbq-dropzone-overlay{animation:none;transition:none}}.kbq-dropzone-overlay.kbq-dropzone-overlay__attached{opacity:1}.kbq-dropzone-overlay .kbq-dropzone-content{display:flex;width:100%;align-items:center;justify-content:center;border-radius:var(--kbq-size-border-radius)}@supports (corner-shape: squircle){.kbq-dropzone-overlay .kbq-dropzone-content{corner-shape:squircle;border-radius:clamp(var(--kbq-size-border-radius) * 1.85,var(--kbq-size-border-radius) * 2.3 - 3.6px,var(--kbq-size-border-radius) * 2)}}.kbq-dropzone-overlay .kbq-dropzone-content{border:var(--kbq-size-border-width) dashed var(--kbq-dropzone-border-color);background-color:var(--kbq-dropzone-component-background);outline:none}.kbq-fullscreen-dropzone{--kbq-dropzone-component-background: transparent}.kbq-local-dropzone{--kbq-dropzone-overlay-background: transparent}.kbq-local-dropzone .kbq-empty-state.kbq-multiple-file-upload__empty-state{--kbq-empty-state-size-compact-padding-top: 0;--kbq-empty-state-size-compact-padding-horizontal: 0;--kbq-empty-state-size-compact-padding-bottom: 0;--kbq-empty-state-size-normal-padding-top: 0;--kbq-empty-state-size-normal-padding-horizontal: 0;--kbq-empty-state-size-normal-padding-bottom: 0;--kbq-empty-state-size-big-padding-top: 0;--kbq-empty-state-size-big-padding-horizontal: 0;--kbq-empty-state-size-big-padding-bottom: 0}.kbq-empty-state.kbq-multiple-file-upload__empty-state{--kbq-empty-state-size-normal-image-margin-bottom: var(--kbq-size-m);--kbq-empty-state-size-normal-title-margin-bottom: var(--kbq-size-xs)}.kbq-dropzone-content .kbq-empty-state.kbq-multiple-file-upload__empty-state{--kbq-empty-state-text-color: var(--kbq-foreground-contrast)}\n", ":where(.kbq-empty-state){--kbq-empty-state-size-big-max-width: 480px;--kbq-empty-state-size-big-padding-horizontal: var(--kbq-size-6xl);--kbq-empty-state-size-big-padding-top: var(--kbq-size-5xl);--kbq-empty-state-size-big-padding-bottom: var(--kbq-size-5xl);--kbq-empty-state-size-big-actions-margin-top: var(--kbq-size-xl);--kbq-empty-state-size-big-image-margin-bottom: var(--kbq-size-3xl);--kbq-empty-state-size-big-image-addon-height: var(--kbq-size-6xl);--kbq-empty-state-size-big-title-margin-bottom: var(--kbq-size-l);--kbq-empty-state-size-normal-max-width: 320px;--kbq-empty-state-size-normal-padding-horizontal: var(--kbq-size-3xl);--kbq-empty-state-size-normal-padding-top: var(--kbq-size-3xl);--kbq-empty-state-size-normal-padding-bottom: var(--kbq-size-3xl);--kbq-empty-state-size-normal-actions-margin-top: var(--kbq-size-s);--kbq-empty-state-size-normal-image-margin-bottom: var(--kbq-size-xl);--kbq-empty-state-size-normal-image-addon-height: var(--kbq-size-xxl);--kbq-empty-state-size-normal-title-margin-bottom: var(--kbq-size-xxs);--kbq-empty-state-size-compact-max-width: 320px;--kbq-empty-state-size-compact-padding-horizontal: var(--kbq-size-3xl);--kbq-empty-state-size-compact-padding-top: var(--kbq-size-3xl);--kbq-empty-state-size-compact-padding-bottom: var(--kbq-size-3xl);--kbq-empty-state-size-compact-actions-margin-top: var(--kbq-size-s);--kbq-empty-state-size-compact-image-margin-bottom: var(--kbq-size-m);--kbq-empty-state-size-compact-image-addon-height: 0;--kbq-empty-state-size-compact-title-margin-bottom: var(--kbq-size-xxs);--kbq-empty-state-title-color: var(--kbq-foreground-contrast);--kbq-empty-state-text-color: var(--kbq-foreground-contrast-secondary);--kbq-empty-state-error-title-color: var(--kbq-foreground-error);--kbq-empty-state-error-text-color: var(--kbq-foreground-error)}.kbq-empty-state{display:flex;flex-direction:column;align-items:center;flex:1}.kbq-empty-state.kbq-empty-state_compact{padding:var(--kbq-empty-state-size-compact-padding-top) var(--kbq-empty-state-size-compact-padding-horizontal) var(--kbq-empty-state-size-compact-padding-bottom)}.kbq-empty-state.kbq-empty-state_compact .kbq-empty-state-icon{margin-bottom:var(--kbq-empty-state-size-compact-image-margin-bottom)}.kbq-empty-state.kbq-empty-state_compact .kbq-empty-state-text{max-width:var(--kbq-empty-state-size-compact-max-width)}.kbq-empty-state.kbq-empty-state_compact .kbq-empty-state-title{max-width:var(--kbq-empty-state-size-compact-max-width);margin-bottom:var(--kbq-empty-state-size-compact-title-margin-bottom)}.kbq-empty-state.kbq-empty-state_compact .kbq-empty-state-actions{max-width:var(--kbq-empty-state-size-compact-max-width);margin-top:var(--kbq-empty-state-size-compact-actions-margin-top)}.kbq-empty-state.kbq-empty-state_compact.kbq-empty-state_align-center.kbq-empty-state_has-icon{margin-bottom:var(--kbq-empty-state-size-compact-image-addon-height)}.kbq-empty-state.kbq-empty-state_normal{padding:var(--kbq-empty-state-size-normal-padding-top) var(--kbq-empty-state-size-normal-padding-horizontal) var(--kbq-empty-state-size-normal-padding-bottom)}.kbq-empty-state.kbq-empty-state_normal .kbq-empty-state-icon{margin-bottom:var(--kbq-empty-state-size-normal-image-margin-bottom)}.kbq-empty-state.kbq-empty-state_normal .kbq-empty-state-text{max-width:var(--kbq-empty-state-size-normal-max-width)}.kbq-empty-state.kbq-empty-state_normal .kbq-empty-state-title{max-width:var(--kbq-empty-state-size-normal-max-width);margin-bottom:var(--kbq-empty-state-size-normal-title-margin-bottom)}.kbq-empty-state.kbq-empty-state_normal .kbq-empty-state-actions{max-width:var(--kbq-empty-state-size-normal-max-width);margin-top:var(--kbq-empty-state-size-normal-actions-margin-top)}.kbq-empty-state.kbq-empty-state_normal.kbq-empty-state_align-center.kbq-empty-state_has-icon{margin-bottom:var(--kbq-empty-state-size-normal-image-addon-height)}.kbq-empty-state.kbq-empty-state_big{padding:var(--kbq-empty-state-size-big-padding-top) var(--kbq-empty-state-size-big-padding-horizontal) var(--kbq-empty-state-size-big-padding-bottom)}.kbq-empty-state.kbq-empty-state_big .kbq-empty-state-icon{margin-bottom:var(--kbq-empty-state-size-big-image-margin-bottom)}.kbq-empty-state.kbq-empty-state_big .kbq-empty-state-text{max-width:var(--kbq-empty-state-size-big-max-width)}.kbq-empty-state.kbq-empty-state_big .kbq-empty-state-title{max-width:var(--kbq-empty-state-size-big-max-width);margin-bottom:var(--kbq-empty-state-size-big-title-margin-bottom)}.kbq-empty-state.kbq-empty-state_big .kbq-empty-state-actions{max-width:var(--kbq-empty-state-size-big-max-width);margin-top:var(--kbq-empty-state-size-big-actions-margin-top)}.kbq-empty-state.kbq-empty-state_big.kbq-empty-state_align-center.kbq-empty-state_has-icon{margin-bottom:var(--kbq-empty-state-size-big-image-addon-height)}.kbq-empty-state.kbq-empty-state_align-center{justify-content:center}.kbq-empty-state.kbq-empty-state_align-top{justify-content:flex-start}.kbq-empty-state_normal-color .kbq-empty-state-title{color:var(--kbq-empty-state-title-color)}.kbq-empty-state_normal-color .kbq-empty-state-text{color:var(--kbq-empty-state-text-color)}.kbq-empty-state_error-color .kbq-empty-state-title{color:var(--kbq-empty-state-error-title-color)}.kbq-empty-state_error-color .kbq-empty-state-text{color:var(--kbq-empty-state-error-text-color)}.kbq-empty-state-title,.kbq-empty-state-text{text-align:center}.kbq-empty-state-title{margin:0}.kbq-empty-state_compact .kbq-empty-state-title{font-size:var(--kbq-typography-text-normal-font-size);font-style:var(--kbq-typography-text-normal-font-style);font-weight:var(--kbq-typography-text-normal-font-weight);line-height:var(--kbq-typography-text-normal-line-height);font-family:var(--kbq-typography-text-normal-font-family);text-transform:var(--kbq-typography-text-normal-text-transform);font-feature-settings:var(--kbq-typography-text-normal-font-feature-settings);letter-spacing:var(--kbq-typography-text-normal-letter-spacing)}.kbq-empty-state_compact .kbq-empty-state-text{font-size:var(--kbq-typography-text-compact-font-size);font-style:var(--kbq-typography-text-compact-font-style);font-weight:var(--kbq-typography-text-compact-font-weight);line-height:var(--kbq-typography-text-compact-line-height);font-family:var(--kbq-typography-text-compact-font-family);text-transform:var(--kbq-typography-text-compact-text-transform);font-feature-settings:var(--kbq-typography-text-compact-font-feature-settings);letter-spacing:var(--kbq-typography-text-compact-letter-spacing)}.kbq-empty-state_normal .kbq-empty-state-title{font-size:var(--kbq-typography-subheading-font-size);font-style:var(--kbq-typography-subheading-font-style);font-weight:var(--kbq-typography-subheading-font-weight);line-height:var(--kbq-typography-subheading-line-height);font-family:var(--kbq-typography-subheading-font-family);text-transform:var(--kbq-typography-subheading-text-transform);font-feature-settings:var(--kbq-typography-subheading-font-feature-settings);letter-spacing:var(--kbq-typography-subheading-letter-spacing)}.kbq-empty-state_normal .kbq-empty-state-text{font-size:var(--kbq-typography-text-normal-font-size);font-style:var(--kbq-typography-text-normal-font-style);font-weight:var(--kbq-typography-text-normal-font-weight);line-height:var(--kbq-typography-text-normal-line-height);font-family:var(--kbq-typography-text-normal-font-family);text-transform:var(--kbq-typography-text-normal-text-transform);font-feature-settings:var(--kbq-typography-text-normal-font-feature-settings);letter-spacing:var(--kbq-typography-text-normal-letter-spacing)}.kbq-empty-state_big .kbq-empty-state-title{font-size:var(--kbq-typography-headline-font-size);font-style:var(--kbq-typography-headline-font-style);font-weight:var(--kbq-typography-headline-font-weight);line-height:var(--kbq-typography-headline-line-height);font-family:var(--kbq-typography-headline-font-family);text-transform:var(--kbq-typography-headline-text-transform);font-feature-settings:var(--kbq-typography-headline-font-feature-settings);letter-spacing:var(--kbq-typography-headline-letter-spacing)}.kbq-empty-state_big .kbq-empty-state-text{font-size:var(--kbq-typography-text-big-font-size);font-style:var(--kbq-typography-text-big-font-style);font-weight:var(--kbq-typography-text-big-font-weight);line-height:var(--kbq-typography-text-big-line-height);font-family:var(--kbq-typography-text-big-font-family);text-transform:var(--kbq-typography-text-big-text-transform);font-feature-settings:var(--kbq-typography-text-big-font-feature-settings);letter-spacing:var(--kbq-typography-text-big-letter-spacing)}\n"] }]
|
|
695
|
+
}], propDecorators: { title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], caption: [{ type: i0.Input, args: [{ isSignal: true, alias: "caption", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }] } });
|
|
644
696
|
class KbqDropzoneContent {
|
|
645
697
|
constructor() {
|
|
646
|
-
/** @docs-private */
|
|
647
|
-
this.localeService = inject(KBQ_LOCALE_SERVICE, { optional: true });
|
|
648
698
|
/** @docs-private */
|
|
649
699
|
this.config = inject(KBQ_DROPZONE_DATA, { optional: true });
|
|
650
700
|
this.trapFocus = inject(CdkTrapFocus, { host: true });
|
|
651
|
-
this.
|
|
701
|
+
this.localeConfiguration = inject(KbqLocaleOverridesDirective, { self: true }).read('fileUpload', KBQ_FILE_UPLOAD_LOCALE_CONFIGURATION);
|
|
652
702
|
/** @docs-private */
|
|
653
|
-
this.title = computed(() => {
|
|
654
|
-
return this.localeService && this.localeId()
|
|
655
|
-
? this.localeService.getParams('fileUpload').multiple.title
|
|
656
|
-
: ruRULocaleData.fileUpload.multiple.title;
|
|
657
|
-
}, ...(ngDevMode ? [{ debugName: "title" }] : []));
|
|
703
|
+
this.title = computed(() => this.localeConfiguration().multiple.title, ...(ngDevMode ? [{ debugName: "title" }] : /* istanbul ignore next */ []));
|
|
658
704
|
this.trapFocus.autoCapture = this.config?.autoCapture ?? true;
|
|
659
705
|
}
|
|
660
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
661
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
706
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KbqDropzoneContent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
707
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.25", type: KbqDropzoneContent, isStandalone: true, selector: "kbq-dropzone-content", host: { properties: { "attr.tabindex": "0" }, classAttribute: "kbq-dropzone-content" }, hostDirectives: [{ directive: i1.CdkTrapFocus }, { directive: i1$1.KbqLocaleOverridesDirective }], ngImport: i0, template: `
|
|
662
708
|
<kbq-file-upload-empty-state
|
|
663
709
|
[size]="config?.size ?? 'normal'"
|
|
664
710
|
[title]="config?.title ?? title()"
|
|
665
711
|
[caption]="config?.caption ?? ''"
|
|
666
712
|
/>
|
|
667
|
-
`, isInline: true, styles: ["
|
|
713
|
+
`, isInline: true, styles: ["@charset \"UTF-8\";.kbq-dropzone-overlay{--kbq-dropzone-padding: var(--kbq-size-s);--kbq-dropzone-overlay-background: color-mix( in srgb, var(--kbq-background-overlay-base-theme) calc(var(--kbq-opacity-overlay) * 100%), transparent );--kbq-dropzone-component-background: color-mix( in srgb, var(--kbq-background-overlay-base-theme) calc(var(--kbq-opacity-overlay) * 100%), transparent );--kbq-dropzone-border-color: var(--kbq-line-theme-fade);padding:var(--kbq-dropzone-padding);background-color:var(--kbq-dropzone-overlay-background);opacity:0;transition:opacity .1s ease-in-out}.kbq-dropzone-overlay.kbq-animations-disabled{animation:none;transition:none}@media(prefers-reduced-motion:reduce){.kbq-dropzone-overlay{animation:none;transition:none}}.kbq-dropzone-overlay.kbq-dropzone-overlay__attached{opacity:1}.kbq-dropzone-overlay .kbq-dropzone-content{display:flex;width:100%;align-items:center;justify-content:center;border-radius:var(--kbq-size-border-radius)}@supports (corner-shape: squircle){.kbq-dropzone-overlay .kbq-dropzone-content{corner-shape:squircle;border-radius:clamp(var(--kbq-size-border-radius) * 1.85,var(--kbq-size-border-radius) * 2.3 - 3.6px,var(--kbq-size-border-radius) * 2)}}.kbq-dropzone-overlay .kbq-dropzone-content{border:var(--kbq-size-border-width) dashed var(--kbq-dropzone-border-color);background-color:var(--kbq-dropzone-component-background);outline:none}.kbq-fullscreen-dropzone{--kbq-dropzone-component-background: transparent}.kbq-local-dropzone{--kbq-dropzone-overlay-background: transparent}.kbq-local-dropzone .kbq-empty-state.kbq-multiple-file-upload__empty-state{--kbq-empty-state-size-compact-padding-top: 0;--kbq-empty-state-size-compact-padding-horizontal: 0;--kbq-empty-state-size-compact-padding-bottom: 0;--kbq-empty-state-size-normal-padding-top: 0;--kbq-empty-state-size-normal-padding-horizontal: 0;--kbq-empty-state-size-normal-padding-bottom: 0;--kbq-empty-state-size-big-padding-top: 0;--kbq-empty-state-size-big-padding-horizontal: 0;--kbq-empty-state-size-big-padding-bottom: 0}.kbq-empty-state.kbq-multiple-file-upload__empty-state{--kbq-empty-state-size-normal-image-margin-bottom: var(--kbq-size-m);--kbq-empty-state-size-normal-title-margin-bottom: var(--kbq-size-xs)}.kbq-dropzone-content .kbq-empty-state.kbq-multiple-file-upload__empty-state{--kbq-empty-state-text-color: var(--kbq-foreground-contrast)}\n"], dependencies: [{ kind: "component", type: KbqFileUploadEmptyState, selector: "kbq-file-upload-empty-state", inputs: ["title", "caption", "size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
668
714
|
}
|
|
669
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
715
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KbqDropzoneContent, decorators: [{
|
|
670
716
|
type: Component,
|
|
671
717
|
args: [{ selector: 'kbq-dropzone-content', imports: [KbqFileUploadEmptyState], template: `
|
|
672
718
|
<kbq-file-upload-empty-state
|
|
@@ -677,7 +723,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.30", ngImpo
|
|
|
677
723
|
`, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
|
|
678
724
|
class: 'kbq-dropzone-content',
|
|
679
725
|
'[attr.tabindex]': '0'
|
|
680
|
-
}, hostDirectives: [CdkTrapFocus], styles: ["
|
|
726
|
+
}, hostDirectives: [CdkTrapFocus, KbqLocaleOverridesDirective], styles: ["@charset \"UTF-8\";.kbq-dropzone-overlay{--kbq-dropzone-padding: var(--kbq-size-s);--kbq-dropzone-overlay-background: color-mix( in srgb, var(--kbq-background-overlay-base-theme) calc(var(--kbq-opacity-overlay) * 100%), transparent );--kbq-dropzone-component-background: color-mix( in srgb, var(--kbq-background-overlay-base-theme) calc(var(--kbq-opacity-overlay) * 100%), transparent );--kbq-dropzone-border-color: var(--kbq-line-theme-fade);padding:var(--kbq-dropzone-padding);background-color:var(--kbq-dropzone-overlay-background);opacity:0;transition:opacity .1s ease-in-out}.kbq-dropzone-overlay.kbq-animations-disabled{animation:none;transition:none}@media(prefers-reduced-motion:reduce){.kbq-dropzone-overlay{animation:none;transition:none}}.kbq-dropzone-overlay.kbq-dropzone-overlay__attached{opacity:1}.kbq-dropzone-overlay .kbq-dropzone-content{display:flex;width:100%;align-items:center;justify-content:center;border-radius:var(--kbq-size-border-radius)}@supports (corner-shape: squircle){.kbq-dropzone-overlay .kbq-dropzone-content{corner-shape:squircle;border-radius:clamp(var(--kbq-size-border-radius) * 1.85,var(--kbq-size-border-radius) * 2.3 - 3.6px,var(--kbq-size-border-radius) * 2)}}.kbq-dropzone-overlay .kbq-dropzone-content{border:var(--kbq-size-border-width) dashed var(--kbq-dropzone-border-color);background-color:var(--kbq-dropzone-component-background);outline:none}.kbq-fullscreen-dropzone{--kbq-dropzone-component-background: transparent}.kbq-local-dropzone{--kbq-dropzone-overlay-background: transparent}.kbq-local-dropzone .kbq-empty-state.kbq-multiple-file-upload__empty-state{--kbq-empty-state-size-compact-padding-top: 0;--kbq-empty-state-size-compact-padding-horizontal: 0;--kbq-empty-state-size-compact-padding-bottom: 0;--kbq-empty-state-size-normal-padding-top: 0;--kbq-empty-state-size-normal-padding-horizontal: 0;--kbq-empty-state-size-normal-padding-bottom: 0;--kbq-empty-state-size-big-padding-top: 0;--kbq-empty-state-size-big-padding-horizontal: 0;--kbq-empty-state-size-big-padding-bottom: 0}.kbq-empty-state.kbq-multiple-file-upload__empty-state{--kbq-empty-state-size-normal-image-margin-bottom: var(--kbq-size-m);--kbq-empty-state-size-normal-title-margin-bottom: var(--kbq-size-xs)}.kbq-dropzone-content .kbq-empty-state.kbq-multiple-file-upload__empty-state{--kbq-empty-state-text-color: var(--kbq-foreground-contrast)}\n"] }]
|
|
681
727
|
}], ctorParameters: () => [] });
|
|
682
728
|
|
|
683
729
|
/** Upload modes enum. */
|
|
@@ -695,17 +741,22 @@ var KbqFileUploadAddStrategy;
|
|
|
695
741
|
/** Discards the previous selection, mirroring native `<input multiple>` behavior. */
|
|
696
742
|
KbqFileUploadAddStrategy["Replace"] = "replace";
|
|
697
743
|
})(KbqFileUploadAddStrategy || (KbqFileUploadAddStrategy = {}));
|
|
698
|
-
/* Object for labels customization inside file upload component */
|
|
699
|
-
const KBQ_FILE_UPLOAD_CONFIGURATION = new InjectionToken('KbqFileUploadConfiguration');
|
|
700
744
|
/** @docs-private */
|
|
701
745
|
class KbqFileUploadBase {
|
|
746
|
+
/** @docs-private */
|
|
747
|
+
get disabled() {
|
|
748
|
+
return this.fileUploadContext.disabled() ?? false;
|
|
749
|
+
}
|
|
702
750
|
constructor() {
|
|
703
|
-
/**
|
|
704
|
-
*
|
|
751
|
+
/**
|
|
752
|
+
* Tracks whether the component is in an error state based on the control, parent form,
|
|
753
|
+
* and `errorStateMatcher`, triggering visual updates and state changes if needed.
|
|
754
|
+
*/
|
|
705
755
|
this.errorState = false;
|
|
706
756
|
/**
|
|
707
757
|
* Emits whenever the component state changes and should cause the parent
|
|
708
758
|
* form-field to update. Implemented as part of `KbqFormFieldControl`.
|
|
759
|
+
*
|
|
709
760
|
* @docs-private
|
|
710
761
|
*/
|
|
711
762
|
this.stateChanges = new Subject();
|
|
@@ -719,8 +770,12 @@ class KbqFileUploadBase {
|
|
|
719
770
|
this.renderer = inject(Renderer2);
|
|
720
771
|
/** @docs-private */
|
|
721
772
|
this.destroyRef = inject(DestroyRef);
|
|
722
|
-
/**
|
|
723
|
-
this.
|
|
773
|
+
/** Localized labels of both upload flavours, following the active locale. */
|
|
774
|
+
this.localeConfiguration = inject(KbqLocaleOverridesDirective, {
|
|
775
|
+
self: true
|
|
776
|
+
}).read('fileUpload', KBQ_FILE_UPLOAD_LOCALE_CONFIGURATION);
|
|
777
|
+
/** Accessible names of the icon-only controls the component renders itself. @docs-private */
|
|
778
|
+
this.a11yNames = kbqInjectA11yLocaleConfiguration();
|
|
724
779
|
/** @docs-private */
|
|
725
780
|
this.ngControl = inject(NgControl, { optional: true, self: true });
|
|
726
781
|
/** @docs-private */
|
|
@@ -733,13 +788,61 @@ class KbqFileUploadBase {
|
|
|
733
788
|
this.elementRef = inject(ElementRef);
|
|
734
789
|
/** @docs-private */
|
|
735
790
|
this.dropzoneService = inject(KbqFullScreenDropzoneService);
|
|
791
|
+
/** Text of the live region that announces changes of the file list. @docs-private */
|
|
792
|
+
this.announcement = signal('', ...(ngDevMode ? [{ debugName: "announcement" }] : /* istanbul ignore next */ []));
|
|
793
|
+
/** Replaced once per list change; an emission sets only the status signal of its item. */
|
|
794
|
+
this.itemStatuses = signal(new Map(), ...(ngDevMode ? [{ debugName: "itemStatuses" }] : /* istanbul ignore next */ []));
|
|
795
|
+
const trackers = new Map();
|
|
796
|
+
// The items belong to the application, which drives their subjects: the view renders what they emit.
|
|
797
|
+
effect(() => {
|
|
798
|
+
const items = new Set(this.fileList.list());
|
|
799
|
+
for (const [item, tracker] of trackers) {
|
|
800
|
+
// An item whose subjects were replaced is followed anew.
|
|
801
|
+
if (!items.has(item) || tracker.loading !== item.loading || tracker.progress !== item.progress) {
|
|
802
|
+
tracker.subscription.unsubscribe();
|
|
803
|
+
trackers.delete(item);
|
|
804
|
+
}
|
|
805
|
+
}
|
|
806
|
+
for (const item of items) {
|
|
807
|
+
if (trackers.has(item))
|
|
808
|
+
continue;
|
|
809
|
+
const status = signal({ loading: false, progress: 0 }, ...(ngDevMode ? [{ debugName: "status" }] : /* istanbul ignore next */ []));
|
|
810
|
+
const subscription = combineLatest([item.loading ?? of(false), item.progress ?? of(0)]).subscribe(([loading, progress]) => status.set({ loading, progress }));
|
|
811
|
+
trackers.set(item, { loading: item.loading, progress: item.progress, status, subscription });
|
|
812
|
+
}
|
|
813
|
+
this.itemStatuses.set(new Map(trackers));
|
|
814
|
+
});
|
|
815
|
+
this.destroyRef.onDestroy(() => trackers.forEach(({ subscription }) => subscription.unsubscribe()));
|
|
816
|
+
}
|
|
817
|
+
/** Whether the item's `loading` subject last emitted `true`. @docs-private */
|
|
818
|
+
isLoading(item) {
|
|
819
|
+
return !!this.itemStatuses().get(item)?.status().loading;
|
|
820
|
+
}
|
|
821
|
+
/** What the item's `progress` subject last emitted, `0` until it does. @docs-private */
|
|
822
|
+
uploadProgress(item) {
|
|
823
|
+
return this.itemStatuses().get(item)?.status().progress || 0;
|
|
736
824
|
}
|
|
737
825
|
/** @docs-private */
|
|
738
|
-
|
|
739
|
-
|
|
826
|
+
setFileList(items) {
|
|
827
|
+
this.fileList.list.set(items);
|
|
828
|
+
this.cdr.markForCheck();
|
|
829
|
+
}
|
|
830
|
+
/**
|
|
831
|
+
* Pushes one message into the live region. Cleared first: a live region speaks on a content
|
|
832
|
+
* change, so removing two identically named files in a row would otherwise stay silent.
|
|
833
|
+
*
|
|
834
|
+
* @docs-private
|
|
835
|
+
*/
|
|
836
|
+
announce(...messages) {
|
|
837
|
+
const message = messages.filter(Boolean).join('. ');
|
|
838
|
+
this.announcement.set('');
|
|
839
|
+
setTimeout(() => this.announcement.set(message));
|
|
840
|
+
}
|
|
841
|
+
/** @docs-private */
|
|
842
|
+
withFileName(template, fileName) {
|
|
843
|
+
return template.replace('{{ fileName }}', fileName);
|
|
740
844
|
}
|
|
741
|
-
/**
|
|
742
|
-
* @docs-private */
|
|
845
|
+
/** @docs-private */
|
|
743
846
|
updateErrorState() {
|
|
744
847
|
const oldState = this.errorState;
|
|
745
848
|
const parent = this.parentFormGroup || this.parentForm;
|
|
@@ -751,24 +854,26 @@ class KbqFileUploadBase {
|
|
|
751
854
|
this.stateChanges.next();
|
|
752
855
|
}
|
|
753
856
|
}
|
|
754
|
-
/** Merges base configuration with locale-specific overrides. */
|
|
755
|
-
buildConfig(config) {
|
|
756
|
-
const localeConfig = this.localeConfig();
|
|
757
|
-
return { ...config, ...localeConfig };
|
|
758
|
-
}
|
|
759
857
|
}
|
|
760
858
|
|
|
761
859
|
let nextMultipleFileUploadUniqueId = 0;
|
|
762
860
|
const KBQ_MULTIPLE_FILE_UPLOAD_DEFAULT_CONFIGURATION = ruRULocaleData.fileUpload.multiple;
|
|
763
861
|
class KbqMultipleFileUploadComponent extends KbqFileUploadBase {
|
|
862
|
+
/**
|
|
863
|
+
* The selected files.
|
|
864
|
+
*
|
|
865
|
+
* Writing it is the model→view direction, same as `writeValue()`: it fills the list and tells
|
|
866
|
+
* nobody. `cvaOnChange` and `(filesChange)` belong to the paths a user drives — see
|
|
867
|
+
* `onFileAdded()` and `deleteFile()` — so a `[files]` binding cannot make the form look edited.
|
|
868
|
+
*/
|
|
869
|
+
// An accessor, not a `model()`: the store is `KbqFileList.list`, a model on the host directive that the template
|
|
870
|
+
// iterates and that `addArray()`, `replace()` and `removeAt()` mutate. A `model()` here would be a second store to
|
|
871
|
+
// keep in sync with that one.
|
|
764
872
|
get files() {
|
|
765
873
|
return this.fileList.list();
|
|
766
874
|
}
|
|
767
|
-
// TODO: Skipped for migration because:
|
|
768
|
-
// Accessor inputs cannot be migrated as they are too complex.
|
|
769
875
|
set files(currentFileList) {
|
|
770
|
-
this.
|
|
771
|
-
this.cvaOnChange(this.files);
|
|
876
|
+
this.setFileList(currentFileList);
|
|
772
877
|
}
|
|
773
878
|
/** @docs-private */
|
|
774
879
|
get input() {
|
|
@@ -785,6 +890,7 @@ class KbqMultipleFileUploadComponent extends KbqFileUploadBase {
|
|
|
785
890
|
/**
|
|
786
891
|
* Indicates an invalid state based on `errorState`,
|
|
787
892
|
* applying a CSS class in HTML for visual feedback.
|
|
893
|
+
*
|
|
788
894
|
* @docs-private
|
|
789
895
|
*/
|
|
790
896
|
get invalid() {
|
|
@@ -792,45 +898,48 @@ class KbqMultipleFileUploadComponent extends KbqFileUploadBase {
|
|
|
792
898
|
}
|
|
793
899
|
/** @docs-private */
|
|
794
900
|
get captionTextWhenSelected() {
|
|
795
|
-
return this.
|
|
901
|
+
return this.localeConfiguration().multiple.captionTextWhenSelected.split('{{ browseLink }}')[0];
|
|
902
|
+
}
|
|
903
|
+
ngOnChanges(changes) {
|
|
904
|
+
// A bound input is handed to its member; unbound, it leaves what code wrote.
|
|
905
|
+
// A bound `undefined` falls back to the default matcher and clears the files.
|
|
906
|
+
if (changes['errorStateMatcherInput']) {
|
|
907
|
+
this.errorStateMatcher = this.errorStateMatcherInput() ?? this.defaultErrorStateMatcher;
|
|
908
|
+
}
|
|
909
|
+
if (changes['filesInput'])
|
|
910
|
+
this.files = this.filesInput() ?? [];
|
|
796
911
|
}
|
|
797
912
|
constructor() {
|
|
798
913
|
super();
|
|
799
914
|
/**
|
|
800
915
|
* A value responsible for progress spinner type.
|
|
801
|
-
* Loading logic depends on selected mode
|
|
802
|
-
|
|
916
|
+
* Loading logic depends on selected mode
|
|
917
|
+
*/
|
|
918
|
+
this.progressMode = input('determinate', ...(ngDevMode ? [{ debugName: "progressMode" }] : /* istanbul ignore next */ []));
|
|
803
919
|
/** Array of file type specifiers */
|
|
804
|
-
this.accept = input(...(ngDevMode ? [undefined, { debugName: "accept" }] : []));
|
|
805
|
-
this.size = input('default', ...(ngDevMode ? [{ debugName: "size" }] : []));
|
|
920
|
+
this.accept = input(...(ngDevMode ? [undefined, { debugName: "accept" }] : /* istanbul ignore next */ []));
|
|
921
|
+
this.size = input('default', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
|
|
806
922
|
/**
|
|
807
923
|
* custom ID for the file input element.
|
|
808
924
|
*/
|
|
809
|
-
this.inputId = input(`kbq-multiple-file-upload-${nextMultipleFileUploadUniqueId++}`, ...(ngDevMode ? [{ debugName: "inputId" }] : []));
|
|
925
|
+
this.inputId = input(`kbq-multiple-file-upload-${nextMultipleFileUploadUniqueId++}`, ...(ngDevMode ? [{ debugName: "inputId" }] : /* istanbul ignore next */ []));
|
|
810
926
|
/**
|
|
811
|
-
* Determines which kind of items the upload component can accept.
|
|
812
|
-
* @default mixed
|
|
927
|
+
* Determines which kind of items the upload component can accept. Defaults to `'file'`.
|
|
813
928
|
*/
|
|
814
|
-
this.allowed = input(KbqFileUploadAllowedType.File, ...(ngDevMode ? [{ debugName: "allowed" }] : []));
|
|
929
|
+
this.allowed = input(KbqFileUploadAllowedType.File, ...(ngDevMode ? [{ debugName: "allowed" }] : /* istanbul ignore next */ []));
|
|
815
930
|
/**
|
|
816
931
|
* Controls whether to display fullscreen dropzone.
|
|
817
932
|
* Provide configuration object to enable, or undefined to disable.
|
|
818
933
|
*/
|
|
819
|
-
this.fullScreenDropZone = input(...(ngDevMode ? [undefined, { debugName: "fullScreenDropZone" }] : []));
|
|
934
|
+
this.fullScreenDropZone = input(...(ngDevMode ? [undefined, { debugName: "fullScreenDropZone" }] : /* istanbul ignore next */ []));
|
|
820
935
|
/**
|
|
821
936
|
* Controls how newly selected/dropped files are merged into the existing list.
|
|
822
937
|
* `concat` accumulates files across interactions, skipping files that duplicate ones already present.
|
|
823
|
-
* `replace` discards the previous selection, mirroring native input file multiple behavior.
|
|
824
|
-
* @default concat
|
|
938
|
+
* `replace` discards the previous selection, mirroring native input file multiple behavior. Defaults to `'concat'`.
|
|
825
939
|
*/
|
|
826
|
-
this.addStrategy = input(KbqFileUploadAddStrategy.Concat, ...(ngDevMode ? [{ debugName: "addStrategy" }] : []));
|
|
827
|
-
/** Optional configuration to override default labels with localized text.*/
|
|
828
|
-
this.localeConfig = input(...(ngDevMode ? [undefined, { debugName: "localeConfig" }] : []));
|
|
940
|
+
this.addStrategy = input(KbqFileUploadAddStrategy.Concat, ...(ngDevMode ? [{ debugName: "addStrategy" }] : /* istanbul ignore next */ []));
|
|
829
941
|
/** Emits an event containing an updated file list. */
|
|
830
942
|
this.filesChange = output();
|
|
831
|
-
/** @deprecated Use `filesChange` instead.
|
|
832
|
-
* Will be removed in next major release (#DS-5229) */
|
|
833
|
-
this.fileQueueChanged = output();
|
|
834
943
|
/**
|
|
835
944
|
* Emits an event containing a chunk of files added to the file list.
|
|
836
945
|
* Useful when handling added files, skipping filtering file list.
|
|
@@ -841,26 +950,32 @@ class KbqMultipleFileUploadComponent extends KbqFileUploadBase {
|
|
|
841
950
|
* Useful when handle removed files, skipping filtering file list.
|
|
842
951
|
*/
|
|
843
952
|
this.fileRemoved = output();
|
|
953
|
+
/**
|
|
954
|
+
* Emits the files a selection or a drop discarded — with the default `concat` strategy, the ones
|
|
955
|
+
* that duplicate a file already in the list. `accept` is not part of this: it only filters the OS
|
|
956
|
+
* dialog.
|
|
957
|
+
*/
|
|
958
|
+
this.rejected = output();
|
|
844
959
|
/** File Icon Template */
|
|
845
|
-
this.customFileIcon = contentChild('kbqFileIcon', ...(ngDevMode ?
|
|
846
|
-
this.fileLoader = viewChild(KbqFileLoader, ...(ngDevMode ? [{ debugName: "fileLoader" }] : []));
|
|
847
|
-
/**
|
|
848
|
-
this.
|
|
960
|
+
this.customFileIcon = contentChild('kbqFileIcon', { ...(ngDevMode ? { debugName: "customFileIcon" } : /* istanbul ignore next */ {}), read: TemplateRef });
|
|
961
|
+
this.fileLoader = viewChild(KbqFileLoader, ...(ngDevMode ? [{ debugName: "fileLoader" }] : /* istanbul ignore next */ []));
|
|
962
|
+
/** The list's scroll viewport. Absent until there is at least one file to list. */
|
|
963
|
+
this.listViewport = viewChild(KbqScrollbar, ...(ngDevMode ? [{ debugName: "listViewport" }] : /* istanbul ignore next */ []));
|
|
964
|
+
/** File count the scrollbar was last revealed for — see the effect in the constructor. */
|
|
965
|
+
this.announcedFileCount = 0;
|
|
849
966
|
/** @docs-private */
|
|
850
|
-
this.
|
|
967
|
+
this.hint = contentChildren(KbqHint, ...(ngDevMode ? [{ debugName: "hint" }] : /* istanbul ignore next */ []));
|
|
851
968
|
/** @docs-private */
|
|
852
|
-
this.
|
|
853
|
-
|
|
854
|
-
|
|
855
|
-
|
|
856
|
-
|
|
857
|
-
|
|
858
|
-
|
|
859
|
-
return { ...baseLocaleConfig, ...localeConfig };
|
|
860
|
-
}, ...(ngDevMode ? [{ debugName: "resolvedLocaleConfig" }] : []));
|
|
969
|
+
this.describedBy = computed(() => this.hint()
|
|
970
|
+
.map((hint) => hint.id())
|
|
971
|
+
.join(' ') || null, ...(ngDevMode ? [{ debugName: "describedBy" }] : /* istanbul ignore next */ []));
|
|
972
|
+
/** Remove controls of the rendered rows, used to keep focus in the list after a deletion. */
|
|
973
|
+
// `read` is load-bearing: `kbq-icon-button` is a component, so a bare `#fileAction` reference
|
|
974
|
+
// would resolve to its instance rather than to the element.
|
|
975
|
+
this.fileActions = viewChildren('fileAction', { ...(ngDevMode ? { debugName: "fileActions" } : /* istanbul ignore next */ {}), read: ElementRef });
|
|
861
976
|
/** @docs-private */
|
|
862
977
|
this.captionContext = computed(() => {
|
|
863
|
-
const config = this.
|
|
978
|
+
const config = this.localeConfiguration().multiple;
|
|
864
979
|
switch (this.allowed()) {
|
|
865
980
|
case KbqFileUploadAllowedType.Mixed: {
|
|
866
981
|
const [before, after] = config.captionTextWithFolder.split('{{ browseLink }}');
|
|
@@ -883,27 +998,53 @@ class KbqMultipleFileUploadComponent extends KbqFileUploadBase {
|
|
|
883
998
|
return { captionText: before, browseLink: config.browseLink };
|
|
884
999
|
}
|
|
885
1000
|
}
|
|
886
|
-
}, ...(ngDevMode ? [{ debugName: "captionContext" }] : []));
|
|
887
|
-
/**
|
|
1001
|
+
}, ...(ngDevMode ? [{ debugName: "captionContext" }] : /* istanbul ignore next */ []));
|
|
1002
|
+
/**
|
|
1003
|
+
* cvaOnChange function registered via registerOnChange (ControlValueAccessor).
|
|
1004
|
+
*
|
|
888
1005
|
* @docs-private
|
|
889
1006
|
*/
|
|
890
1007
|
this.cvaOnChange = (_) => { };
|
|
891
|
-
/**
|
|
892
|
-
*
|
|
1008
|
+
/**
|
|
1009
|
+
* onTouch function registered via registerOnTouch (ControlValueAccessor).
|
|
1010
|
+
*
|
|
1011
|
+
* @docs-private
|
|
1012
|
+
*/
|
|
893
1013
|
this.onTouched = () => { };
|
|
894
|
-
/** @docs-private */
|
|
895
|
-
this.configuration = inject(KBQ_FILE_UPLOAD_CONFIGURATION, {
|
|
896
|
-
optional: true
|
|
897
|
-
});
|
|
898
|
-
this.localeId = toSignal(this.localeService?.changes.asObservable() ?? of(KBQ_DEFAULT_LOCALE_ID));
|
|
899
1014
|
this.focusMonitor = inject(FocusMonitor);
|
|
900
1015
|
this.platformId = inject(PLATFORM_ID);
|
|
1016
|
+
/** @docs-private */
|
|
1017
|
+
this.errorStateMatcherInput = input(undefined, { ...(ngDevMode ? { debugName: "errorStateMatcherInput" } : /* istanbul ignore next */ {}), alias: 'errorStateMatcher' });
|
|
1018
|
+
/** @docs-private */
|
|
1019
|
+
this.filesInput = input(undefined, { ...(ngDevMode ? { debugName: "filesInput" } : /* istanbul ignore next */ {}), alias: 'files' });
|
|
901
1020
|
if (this.ngControl) {
|
|
902
1021
|
// Note: we provide the value accessor through here, instead of
|
|
903
1022
|
// the `providers` to avoid running into a circular import.
|
|
904
1023
|
this.ngControl.valueAccessor = this;
|
|
905
1024
|
}
|
|
906
1025
|
this.dropzoneService.filesDropped.subscribe((files) => this.onFileDropped(files));
|
|
1026
|
+
// Briefly reveals the scrollbar whenever the list arrives or grows, so whether the list scrolls
|
|
1027
|
+
// is answered on sight rather than only once the pointer enters it. Both signals are read: the
|
|
1028
|
+
// viewport appears a tick after the first file does, and a later file can push a list that fitted
|
|
1029
|
+
// past its height cap.
|
|
1030
|
+
//
|
|
1031
|
+
// Gated on growth, not on any write: `list` is re-set wholesale by the `files` setter and by
|
|
1032
|
+
// `writeValue`, so an unguarded effect would re-announce scrollability while the user is deleting
|
|
1033
|
+
// rows, and would fire on every change-detection pass for a consumer binding `[files]` to an
|
|
1034
|
+
// expression that returns a fresh array.
|
|
1035
|
+
effect(() => {
|
|
1036
|
+
const count = this.fileList.list().length;
|
|
1037
|
+
const viewport = this.listViewport();
|
|
1038
|
+
if (!viewport) {
|
|
1039
|
+
// The list is gone; nothing has been announced for the next one that appears.
|
|
1040
|
+
this.announcedFileCount = 0;
|
|
1041
|
+
return;
|
|
1042
|
+
}
|
|
1043
|
+
if (count > this.announcedFileCount) {
|
|
1044
|
+
viewport.flashScrollIndicators();
|
|
1045
|
+
}
|
|
1046
|
+
this.announcedFileCount = count;
|
|
1047
|
+
});
|
|
907
1048
|
effect(() => {
|
|
908
1049
|
const fullScreenDropZone = this.fullScreenDropZone();
|
|
909
1050
|
if (fullScreenDropZone) {
|
|
@@ -926,29 +1067,47 @@ class KbqMultipleFileUploadComponent extends KbqFileUploadBase {
|
|
|
926
1067
|
ngAfterViewInit() {
|
|
927
1068
|
this.stateChanges.pipe(takeUntilDestroyed(this.destroyRef)).subscribe(() => this.cdr.markForCheck());
|
|
928
1069
|
}
|
|
929
|
-
/**
|
|
930
|
-
*
|
|
1070
|
+
/**
|
|
1071
|
+
* Implemented as part of ControlValueAccessor.
|
|
1072
|
+
*
|
|
1073
|
+
* @docs-private
|
|
1074
|
+
*/
|
|
931
1075
|
writeValue(files) {
|
|
1076
|
+
// Writes the list directly instead of going through the `files` setter: that setter is the
|
|
1077
|
+
// view→model half of the CVA, so routing Angular's model→view callback through it would mark
|
|
1078
|
+
// the control dirty and re-emit `valueChanges` on every programmatic value — including the
|
|
1079
|
+
// `setValue` that `reset()` runs after `markAsPristine()`. `(filesChange)` is not emitted here
|
|
1080
|
+
// either: it reports a user action, not a value the form pushed in.
|
|
932
1081
|
// @TODO: remove FileList from arguments since it redundant. It resolves SSR (#DS-4414)
|
|
933
|
-
if (!isPlatformBrowser(this.platformId))
|
|
1082
|
+
if (!isPlatformBrowser(this.platformId)) {
|
|
1083
|
+
// `FileList` is not a global on the server, so only a plain item list can be written there —
|
|
1084
|
+
// which is enough for a pre-populated form to render (#DS-4414).
|
|
1085
|
+
this.setFileList(Array.isArray(files) ? files : []);
|
|
934
1086
|
return;
|
|
935
|
-
|
|
936
|
-
this.
|
|
937
|
-
this.fileQueueChanged.emit(this.files);
|
|
1087
|
+
}
|
|
1088
|
+
this.setFileList(files instanceof FileList || !files ? this.mapToFileItem(files) : files);
|
|
938
1089
|
}
|
|
939
|
-
/**
|
|
940
|
-
*
|
|
1090
|
+
/**
|
|
1091
|
+
* Implemented as part of ControlValueAccessor.
|
|
1092
|
+
*
|
|
1093
|
+
* @docs-private
|
|
1094
|
+
*/
|
|
941
1095
|
registerOnChange(fn) {
|
|
942
1096
|
this.cvaOnChange = fn;
|
|
943
1097
|
}
|
|
944
|
-
/**
|
|
945
|
-
*
|
|
1098
|
+
/**
|
|
1099
|
+
* Implemented as part of ControlValueAccessor.
|
|
1100
|
+
*
|
|
1101
|
+
* @docs-private
|
|
1102
|
+
*/
|
|
946
1103
|
registerOnTouched(fn) {
|
|
947
1104
|
this.onTouched = fn;
|
|
948
1105
|
}
|
|
949
1106
|
/**
|
|
950
1107
|
* Sets the disabled state of the control. Implemented as a part of ControlValueAccessor.
|
|
1108
|
+
*
|
|
951
1109
|
* @param isDisabled Whether the control should be disabled.
|
|
1110
|
+
*
|
|
952
1111
|
* @docs-private
|
|
953
1112
|
*/
|
|
954
1113
|
setDisabledState(isDisabled) {
|
|
@@ -973,24 +1132,50 @@ class KbqMultipleFileUploadComponent extends KbqFileUploadBase {
|
|
|
973
1132
|
}
|
|
974
1133
|
/** @docs-private */
|
|
975
1134
|
deleteFile(index, event, origin) {
|
|
1135
|
+
// Untracked: called from a consumer's `effect()`, the state read on the way — the list, `disabled` — would make
|
|
1136
|
+
// the effect run again on every change it makes, and remove the next file.
|
|
1137
|
+
untracked(() => this.removeFile(index, event, origin));
|
|
1138
|
+
}
|
|
1139
|
+
/** Body of `deleteFile()`. */
|
|
1140
|
+
removeFile(index, event, origin) {
|
|
976
1141
|
if (this.disabled)
|
|
977
1142
|
return;
|
|
978
1143
|
event?.stopPropagation();
|
|
979
1144
|
const removedFile = this.fileList.removeAt(index)[0];
|
|
1145
|
+
// An index outside the list removes nothing, so there is no new value to report.
|
|
1146
|
+
if (!removedFile)
|
|
1147
|
+
return;
|
|
980
1148
|
this.cvaOnChange(this.files);
|
|
981
1149
|
this.fileRemoved.emit([removedFile, index]);
|
|
982
1150
|
this.filesChange.emit(this.files);
|
|
983
|
-
this.fileQueueChanged.emit(this.files);
|
|
984
1151
|
this.onTouched();
|
|
985
|
-
if (
|
|
986
|
-
|
|
987
|
-
const input = this.input?.nativeElement;
|
|
988
|
-
if (input) {
|
|
989
|
-
this.focusMonitor.focusVia(input, origin ?? 'keyboard');
|
|
990
|
-
}
|
|
991
|
-
});
|
|
992
|
-
return;
|
|
1152
|
+
if (removedFile) {
|
|
1153
|
+
this.announce(this.withFileName(this.localeConfiguration().a11y.fileRemoved, removedFile.file.name));
|
|
993
1154
|
}
|
|
1155
|
+
const remaining = this.files.length;
|
|
1156
|
+
// Deleting a row destroys the element that held focus, which would otherwise drop to `<body>`
|
|
1157
|
+
// and restart the next Tab from the top of the document (WCAG 2.4.3).
|
|
1158
|
+
setTimeout(() => {
|
|
1159
|
+
const target = remaining === 0
|
|
1160
|
+
? this.input?.nativeElement
|
|
1161
|
+
: this.fileActions()[Math.min(index, remaining - 1)]?.nativeElement;
|
|
1162
|
+
if (target) {
|
|
1163
|
+
this.focusMonitor.focusVia(target, origin ?? 'keyboard');
|
|
1164
|
+
}
|
|
1165
|
+
});
|
|
1166
|
+
}
|
|
1167
|
+
/**
|
|
1168
|
+
* Marks the control touched once focus leaves the whole uploader, so the default
|
|
1169
|
+
* `ErrorStateMatcher` shows a `required` error to a user who tabbed through without attaching
|
|
1170
|
+
* anything. Moving between the browse link and a remove control stays inside and does not count.
|
|
1171
|
+
*
|
|
1172
|
+
* @docs-private
|
|
1173
|
+
*/
|
|
1174
|
+
onFocusOut({ relatedTarget }) {
|
|
1175
|
+
if (this.elementRef.nativeElement.contains(relatedTarget))
|
|
1176
|
+
return;
|
|
1177
|
+
this.onTouched();
|
|
1178
|
+
this.stateChanges.next();
|
|
994
1179
|
}
|
|
995
1180
|
mapToFileItem(files) {
|
|
996
1181
|
if (!files) {
|
|
@@ -1002,19 +1187,34 @@ class KbqMultipleFileUploadComponent extends KbqFileUploadBase {
|
|
|
1002
1187
|
progress: new BehaviorSubject(0)
|
|
1003
1188
|
}));
|
|
1004
1189
|
}
|
|
1005
|
-
onFileAdded(
|
|
1006
|
-
|
|
1007
|
-
|
|
1190
|
+
onFileAdded(selected) {
|
|
1191
|
+
// An interaction can hand over nothing: an empty directory unwraps to zero files. Under the
|
|
1192
|
+
// `replace` strategy that used to reach `fileList.replace([])` and wipe a list the user had
|
|
1193
|
+
// already built. The drop still counts as an interaction, so the control is marked touched.
|
|
1194
|
+
if (!selected.length) {
|
|
1195
|
+
this.onTouched();
|
|
1196
|
+
return;
|
|
1197
|
+
}
|
|
1198
|
+
const replace = this.addStrategy() === KbqFileUploadAddStrategy.Replace;
|
|
1199
|
+
const accepted = replace ? selected : selected.filter(({ file }) => !this.isDuplicate(file, this.files));
|
|
1200
|
+
if (replace) {
|
|
1201
|
+
this.fileList.replace(accepted);
|
|
1008
1202
|
}
|
|
1009
1203
|
else {
|
|
1010
|
-
|
|
1011
|
-
this.fileList.addArray(filesToAdd);
|
|
1204
|
+
this.fileList.addArray(accepted);
|
|
1012
1205
|
}
|
|
1013
1206
|
this.cvaOnChange(this.files);
|
|
1014
|
-
this.filesAdded.emit(
|
|
1207
|
+
this.filesAdded.emit(accepted);
|
|
1015
1208
|
this.filesChange.emit(this.files);
|
|
1016
|
-
this.fileQueueChanged.emit(this.files);
|
|
1017
1209
|
this.onTouched();
|
|
1210
|
+
const discarded = selected.filter((item) => !accepted.includes(item));
|
|
1211
|
+
if (discarded.length) {
|
|
1212
|
+
this.rejected.emit(discarded.map(({ file }) => file));
|
|
1213
|
+
}
|
|
1214
|
+
if (accepted.length || discarded.length) {
|
|
1215
|
+
const config = this.localeConfiguration().a11y;
|
|
1216
|
+
this.announce(accepted.map(({ file }) => this.withFileName(config.fileAdded, file.name)).join('. '), discarded.length ? config.filesNotAdded : '');
|
|
1217
|
+
}
|
|
1018
1218
|
}
|
|
1019
1219
|
isDuplicate(candidate, existing) {
|
|
1020
1220
|
return existing.some(({ file }) => file.name === candidate.name &&
|
|
@@ -1022,13 +1222,13 @@ class KbqMultipleFileUploadComponent extends KbqFileUploadBase {
|
|
|
1022
1222
|
file.lastModified === candidate.lastModified &&
|
|
1023
1223
|
file.type === candidate.type);
|
|
1024
1224
|
}
|
|
1025
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1026
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.30", type: KbqMultipleFileUploadComponent, isStandalone: true, selector: "kbq-multiple-file-upload,kbq-file-upload[multiple]", inputs: { progressMode: { classPropertyName: "progressMode", publicName: "progressMode", isSignal: true, isRequired: false, transformFunction: null }, accept: { classPropertyName: "accept", publicName: "accept", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: false, transformFunction: null }, errorStateMatcher: { classPropertyName: "errorStateMatcher", publicName: "errorStateMatcher", isSignal: false, isRequired: false, transformFunction: null }, files: { classPropertyName: "files", publicName: "files", isSignal: false, isRequired: false, transformFunction: null }, allowed: { classPropertyName: "allowed", publicName: "allowed", isSignal: true, isRequired: false, transformFunction: null }, fullScreenDropZone: { classPropertyName: "fullScreenDropZone", publicName: "fullScreenDropZone", isSignal: true, isRequired: false, transformFunction: null }, addStrategy: { classPropertyName: "addStrategy", publicName: "addStrategy", isSignal: true, isRequired: false, transformFunction: null }, localeConfig: { classPropertyName: "localeConfig", publicName: "localeConfig", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { filesChange: "filesChange", fileQueueChanged: "fileQueueChanged", filesAdded: "filesAdded", fileRemoved: "fileRemoved" }, host: { classAttribute: "kbq-multiple-file-upload" }, providers: [KbqFullScreenDropzoneService], queries: [{ propertyName: "customFileIcon", first: true, predicate: ["kbqFileIcon"], descendants: true, read: TemplateRef, isSignal: true }, { propertyName: "hint", predicate: KbqHint, isSignal: true }], viewQueries: [{ propertyName: "fileLoader", first: true, predicate: KbqFileLoader, descendants: true, isSignal: true }], usesInheritance: true, hostDirectives: [{ directive: KbqFileUploadContext, inputs: ["id", "id", "disabled", "disabled"] }, { directive: KbqFileList, outputs: ["itemsAdded", "itemsAdded", "itemRemoved", "itemRemoved"] }], ngImport: i0, template: "<div\n kbqFileDrop\n class=\"kbq-file-upload\"\n [class.kbq-disabled]=\"disabled\"\n [class.kbq-error]=\"invalid\"\n [class.kbq-selected]=\"files.length\"\n [class.kbq-file-upload_default]=\"size() === 'default'\"\n [class.kbq-file-upload_compact]=\"size() === 'compact'\"\n [disabled]=\"!!fullScreenDropZone()\"\n (filesDropped)=\"onFileDropped($event)\"\n>\n @let localeData = resolvedLocaleConfig();\n @if (!files.length) {\n @if (size() === 'default') {\n <kbq-file-upload-empty-state [size]=\"'normal'\" [title]=\"localeData.title\" [caption]=\"captionText\" />\n } @else {\n <div class=\"kbq-file-dropzone\">\n <i kbq-icon=\"kbq-arrow-up-from-bracket_16\" class=\"kbq-file-upload__dropzone-icon\"></i>\n <span class=\"kbq-file-upload__dropzone-caption\">\n <ng-container *ngTemplateOutlet=\"captionText\" />\n </span>\n </div>\n }\n } @else {\n <div class=\"kbq-file-upload__wrapper\">\n <kbq-list class=\"kbq-file-upload__list kbq-scrollbar\" role=\"list\">\n @for (file of files; track file) {\n <kbq-list-item\n role=\"listitem\"\n class=\"kbq-file-upload__item\"\n [class.kbq-disabled]=\"disabled\"\n (keydown.backspace)=\"deleteFile($index)\"\n (keydown.delete)=\"deleteFile($index)\"\n >\n <div class=\"kbq-file-upload__row\" [class.kbq-error]=\"file.hasError\">\n <div class=\"kbq-file-upload__file kbq-file-upload__grid-cell\">\n @if ({ loading: file.loading | async, progress: file.progress | async }; as asyncData) {\n @if (!asyncData.loading) {\n <ng-container\n [ngTemplateOutlet]=\"$any(customFileIcon())\"\n [ngTemplateOutletContext]=\"{ $implicit: file }\"\n />\n } @else {\n <kbq-progress-spinner\n class=\"kbq-file-upload-name-cell__icon\"\n [mode]=\"progressMode()\"\n [value]=\"asyncData.progress || 0\"\n />\n }\n }\n <span\n class=\"kbq-file-item__text\"\n [minVisibleLength]=\"10\"\n [kbqTooltipDisabled]=\"disabled\"\n [kbqEllipsisCenter]=\"file.file.name\"\n ></span>\n </div>\n <div class=\"kbq-file-upload__size kbq-file-upload__grid-cell\">\n {{ file.file.size | kbqDataSize }}\n </div>\n <i\n kbq-icon-button=\"kbq-circle-xmark_16\"\n class=\"kbq-file-upload__action kbq-file-upload__grid-cell\"\n [color]=\"file.hasError ? 'error' : 'contrast-fade'\"\n [disabled]=\"disabled\"\n (click)=\"deleteFile($index, $event, 'program')\"\n ></i>\n </div>\n </kbq-list-item>\n }\n </kbq-list>\n <div class=\"kbq-file-upload__list-footer kbq-file-dropzone\">\n <i kbq-icon=\"kbq-arrow-up-from-bracket_16\" class=\"kbq-file-upload__dropzone-icon\"></i>\n <span class=\"kbq-file-upload__dropzone-caption\">\n <ng-container *ngTemplateOutlet=\"captionText\" />\n </span>\n </div>\n </div>\n }\n</div>\n\n@if (hasHint) {\n <div class=\"kbq-file-upload__hint\">\n <ng-content select=\"kbq-hint\" />\n </div>\n}\n\n<ng-template #captionText>\n @let context = captionContext();\n @if (files.length) {\n {{ captionTextWhenSelected }}\n } @else if (context.captionText) {\n {{ context.captionText }}\n }\n @if (context.browseLink) {\n <label\n kbq-link\n pseudo\n kbqFileLoader\n [onlyDirectory]=\"null\"\n [accept]=\"acceptedFiles\"\n [disabled]=\"disabled\"\n [for]=\"fileUploadContext.id() || inputId()\"\n [tabIndex]=\"-1\"\n [multiple]=\"true\"\n (fileChange)=\"onFileSelectedViaClick($event)\"\n >\n {{ context.browseLink }}\n </label>\n }\n @if (context.captionTextSeparator) {\n {{ context.captionTextSeparator }}\n }\n @if (context.browseLinkFolder) {\n <label\n kbq-link\n pseudo\n kbqFileLoader\n [onlyDirectory]=\"true\"\n [disabled]=\"disabled\"\n [tabIndex]=\"-1\"\n (fileChange)=\"onFileSelectedViaClick($event)\"\n >\n {{ context.browseLinkFolder }}\n </label>\n }\n</ng-template>\n", styles: [".kbq-form-field{--kbq-form-field-label-margin-bottom: var(--kbq-size-xs);position:relative;display:inline-block;width:100%}.kbq-form-field.kbq-form-field_horizontal{display:flex;flex-direction:row;align-items:flex-start}.kbq-form-field.kbq-form-field_horizontal .kbq-form-field__label{--kbq-form-field-label-margin-bottom: 0;padding:var(--kbq-size-xs) var(--kbq-size-l) 0 0}.kbq-form-field .kbq-form-field__content{flex:1}.kbq-form-field .kbq-form-field__label{box-sizing:border-box;display:flex;margin-bottom:var(--kbq-form-field-label-margin-bottom)}.kbq-form-field.kbq-form-field-type-select .kbq-form-field__suffix{margin-right:0}.kbq-form-field .kbq-form-field__container{box-sizing:border-box;display:flex;justify-content:space-between;align-items:center;border-width:var(--kbq-form-field-size-border-width);border-style:solid;border-color:transparent;border-radius:var(--kbq-form-field-size-border-radius);padding-left:var(--kbq-form-field-size-container-left-padding);padding-right:var(--kbq-form-field-size-container-right-padding)}.kbq-form-field .kbq-form-field__container:has(.kbq-textarea){--kbq-form-field-size-container-left-padding: 0;--kbq-form-field-size-container-right-padding: 0}.kbq-form-field .kbq-form-field:not(.kbq-form-field-type-textarea){height:var(--kbq-form-field-size-height)}.kbq-form-field .kbq-form-field__infix{box-sizing:border-box;width:100%;flex-grow:1;padding-left:var(--kbq-form-field-size-infix-left-padding)}.kbq-form-field .kbq-form-field__infix:has(.kbq-select_multiple,.kbq-select_multiline):not(:has(.kbq-select__trigger_empty)),.kbq-form-field .kbq-form-field__infix:has(.kbq-tag-list),.kbq-form-field .kbq-form-field__infix:has(.kbq-textarea){padding-left:0;max-width:100%}.kbq-form-field .kbq-form-field__infix:has(.kbq-select_multiple,.kbq-select_multiline):has(kbq-select-trigger,[kbq-select-trigger]){padding-left:var(--kbq-form-field-size-infix-left-padding)}.kbq-form-field .kbq-form-field__infix .kbq-input,.kbq-form-field .kbq-form-field__infix .kbq-tag-input{padding-right:var(--kbq-form-field-size-infix-right-padding)}.kbq-form-field,.kbq-form-field .kbq-textarea{border-radius:var(--kbq-form-field-size-border-radius)}.kbq-form-field:hover{z-index:1}.kbq-form-field.cdk-focused,.kbq-form-field.kbq-focused{z-index:3}.kbq-form-field.kbq-form-field_without-borders .kbq-form-field__container,.kbq-form-field.kbq-form-field_no-borders .kbq-form-field__container{border-color:transparent!important;box-shadow:none!important}.kbq-form-field.kbq-form-field_in-overlay .kbq-form-field__container{background-color:var(--kbq-background-card)!important}.kbq-form-field+.kbq-password-hint{margin-top:var(--kbq-size-m)}.kbq-form-field .kbq-form-field__prefix,.kbq-form-field .kbq-form-field__suffix{display:flex;justify-content:center;align-items:center}.kbq-form-field .kbq-form-field__prefix .kbq-prefix,.kbq-form-field .kbq-form-field__prefix .kbq-suffix,.kbq-form-field .kbq-form-field__suffix .kbq-prefix,.kbq-form-field .kbq-form-field__suffix .kbq-suffix{min-width:var(--kbq-form-field-size-addon-width);text-align:center}.kbq-form-field .kbq-form-field__prefix+.kbq-form-field__infix{padding-left:0}.kbq-form-field .kbq-form-field__hint{display:flex;flex-direction:column;gap:var(--kbq-form-field-hint-size-gap);margin-top:var(--kbq-form-field-hint-size-margin-top)}.kbq-form-field .kbq-form-field__hint:has(.kbq-reactive-password-hint,.kbq-password-hint){--kbq-form-field-hint-size-gap: var(--kbq-size-s)}.kbq-form-field .kbq-form-field__hint:has(:is(.kbq-reactive-password-hint,.kbq-password-hint):first-child){--kbq-form-field-hint-size-margin-top: var(--kbq-size-m)}.kbq-form-field .kbq-form-field__container{border-color:var(--kbq-form-field-default-border-color);background-color:var(--kbq-form-field-default-background)}.kbq-form-field .kbq-input,.kbq-form-field .kbq-tag-input,.kbq-form-field .kbq-textarea{--kbq-form-field-resolved-text: var(--kbq-form-field-default-text);color:var(--kbq-form-field-resolved-text)}.kbq-form-field .kbq-input::placeholder,.kbq-form-field .kbq-tag-input::placeholder,.kbq-form-field .kbq-textarea::placeholder{color:var(--kbq-form-field-default-placeholder)}.kbq-form-field .kbq-input::-ms-input-placeholder,.kbq-form-field .kbq-tag-input::-ms-input-placeholder,.kbq-form-field .kbq-textarea::-ms-input-placeholder{color:var(--kbq-form-field-default-placeholder)}.kbq-form-field .kbq-input::-webkit-input-placeholder,.kbq-form-field .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field .kbq-textarea::-webkit-input-placeholder{color:var(--kbq-form-field-default-placeholder)}.kbq-form-field .kbq-input:is(:autofill,:-webkit-autofill),.kbq-form-field .kbq-tag-input:is(:autofill,:-webkit-autofill),.kbq-form-field .kbq-textarea:is(:autofill,:-webkit-autofill){transition-property:background-color;transition-duration:600000s;-webkit-text-fill-color:var(--kbq-form-field-resolved-text, var(--kbq-form-field-default-text));caret-color:var(--kbq-form-field-resolved-text, var(--kbq-form-field-default-text))}.kbq-form-field.kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field_has-validate-directive.ng-invalid .kbq-form-field__container{border-color:var(--kbq-form-field-states-error-border-color);background-color:var(--kbq-form-field-states-error-background)}.kbq-form-field.kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field_has-validate-directive.ng-invalid .kbq-input,.kbq-form-field.kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input,.kbq-form-field.kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea{--kbq-form-field-resolved-text: var(--kbq-form-field-states-error-text);color:var(--kbq-form-field-resolved-text)}.kbq-form-field.kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field_has-validate-directive.ng-invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::placeholder{color:var(--kbq-form-field-states-error-placeholder)}.kbq-form-field.kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-ms-input-placeholder{color:var(--kbq-form-field-states-error-placeholder)}.kbq-form-field.kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-webkit-input-placeholder{color:var(--kbq-form-field-states-error-placeholder)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container{border-color:var(--kbq-form-field-states-focused-border-color);background-color:var(--kbq-form-field-states-focused-background)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea{--kbq-form-field-resolved-text: var(--kbq-form-field-states-focused-text);color:var(--kbq-form-field-resolved-text)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder{color:var(--kbq-form-field-states-focused-placeholder)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder{color:var(--kbq-form-field-states-focused-placeholder)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder{color:var(--kbq-form-field-states-focused-placeholder)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container{box-shadow:inset 0 0 .1px var(--kbq-form-field-size-focus-outline-width) var(--kbq-form-field-states-focused-focus-outline)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-form-field__container{border-color:var(--kbq-form-field-states-error-border-color);background-color:var(--kbq-form-field-states-error-background)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea{--kbq-form-field-resolved-text: var(--kbq-form-field-states-error-text);color:var(--kbq-form-field-resolved-text)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::placeholder{color:var(--kbq-form-field-states-error-placeholder)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-ms-input-placeholder{color:var(--kbq-form-field-states-error-placeholder)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-webkit-input-placeholder{color:var(--kbq-form-field-states-error-placeholder)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid.cdk-focused .kbq-form-field__container{box-shadow:inset 0 0 .1px var(--kbq-form-field-size-focus-outline-width) var(--kbq-form-field-states-error-focused-focus-outline)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-icon.kbq-empty{color:var(--kbq-form-field-states-error-text);-webkit-text-fill-color:var(--kbq-form-field-states-error-text)}.kbq-form-field .kbq-form-field__label{color:var(--kbq-form-field-label-color)}.kbq-form-field .kbq-form-field__container:has(:is(.kbq-input,.kbq-tag-input,.kbq-textarea):is(:autofill,:-webkit-autofill)){background-image:linear-gradient(var(--kbq-form-field-states-autofill-background),var(--kbq-form-field-states-autofill-background))}.kbq-form-field.kbq-disabled .kbq-form-field__container{border-color:var(--kbq-form-field-states-disabled-border-color);background-color:var(--kbq-form-field-states-disabled-background)}.kbq-form-field.kbq-disabled .kbq-input,.kbq-form-field.kbq-disabled .kbq-tag-input,.kbq-form-field.kbq-disabled .kbq-textarea{--kbq-form-field-resolved-text: var(--kbq-form-field-states-disabled-text);color:var(--kbq-form-field-resolved-text)}.kbq-form-field.kbq-disabled .kbq-input::placeholder,.kbq-form-field.kbq-disabled .kbq-tag-input::placeholder,.kbq-form-field.kbq-disabled .kbq-textarea::placeholder{color:var(--kbq-form-field-states-disabled-placeholder)}.kbq-form-field.kbq-disabled .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-disabled .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-disabled .kbq-textarea::-ms-input-placeholder{color:var(--kbq-form-field-states-disabled-placeholder)}.kbq-form-field.kbq-disabled .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-disabled .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-disabled .kbq-textarea::-webkit-input-placeholder{color:var(--kbq-form-field-states-disabled-placeholder)}.kbq-form-field.kbq-disabled .kbq-icon.kbq-empty{color:var(--kbq-form-field-states-disabled-text);-webkit-text-fill-color:var(--kbq-form-field-states-disabled-text)}.kbq-form-field .kbq-form-field__prefix .kbq-icon.kbq-empty,.kbq-form-field .kbq-form-field__suffix .kbq-icon.kbq-empty{color:var(--kbq-icon-contrast-fade)}.kbq-form-field .kbq-form-field__hint>.kbq-hint:not(.kbq-password-hint,.kbq-contrast-fade,.kbq-success,.kbq-warning,.kbq-error){color:var(--kbq-form-field-hint-text)}.kbq-form-field{font-size:var(--kbq-typography-text-normal-font-size);font-style:var(--kbq-typography-text-normal-font-style);font-weight:var(--kbq-typography-text-normal-font-weight);line-height:var(--kbq-typography-text-normal-line-height);font-family:var(--kbq-typography-text-normal-font-family);text-transform:var(--kbq-typography-text-normal-text-transform);font-feature-settings:var(--kbq-typography-text-normal-font-feature-settings);letter-spacing:var(--kbq-typography-text-normal-letter-spacing)}.kbq-form-field .kbq-form-field__hint>.kbq-hint:not(.kbq-password-hint,.kbq-reactive-password-hint,.kbq-contrast-fade,.kbq-success,.kbq-warning) .kbq-hint__text{font-size:var(--kbq-typography-text-compact-font-size);font-style:var(--kbq-typography-text-compact-font-style);font-weight:var(--kbq-typography-text-compact-font-weight);line-height:var(--kbq-typography-text-compact-line-height);font-family:var(--kbq-typography-text-compact-font-family);text-transform:var(--kbq-typography-text-compact-text-transform);font-feature-settings:var(--kbq-typography-text-compact-font-feature-settings);letter-spacing:var(--kbq-typography-text-compact-letter-spacing)}.kbq-file-upload{box-sizing:border-box;display:flex;align-items:center;position:relative}.kbq-file-upload .kbq-file-item{display:flex;align-items:center}.kbq-file-upload .kbq-file-dropzone{display:flex;align-items:baseline;gap:var(--dropzone-gap, var(--kbq-file-upload-size-dropzone-content-gap-horizontal))}.kbq-file-upload__hint{display:flex;flex-direction:column;gap:var(--kbq-form-field-hint-size-gap);margin-top:var(--kbq-form-field-hint-size-margin-top)}.kbq-file-upload__hint:has(.kbq-reactive-password-hint,.kbq-password-hint){--kbq-form-field-hint-size-gap: var(--kbq-size-s)}.kbq-file-upload__hint:has(:is(.kbq-reactive-password-hint,.kbq-password-hint):first-child){--kbq-form-field-hint-size-margin-top: var(--kbq-size-m)}:where(.kbq-file-upload__hint .kbq-hint){color:var(--kbq-foreground-contrast-secondary)}.kbq-file-upload{font-size:var(--kbq-typography-text-normal-font-size);font-style:var(--kbq-typography-text-normal-font-style);font-weight:var(--kbq-typography-text-normal-font-weight);line-height:var(--kbq-typography-text-normal-line-height);font-family:var(--kbq-typography-text-normal-font-family);text-transform:var(--kbq-typography-text-normal-text-transform);font-feature-settings:var(--kbq-typography-text-normal-font-feature-settings);letter-spacing:var(--kbq-typography-text-normal-letter-spacing)}.kbq-file-upload__hint .kbq-hint .kbq-hint__text{font-size:var(--kbq-typography-text-compact-font-size);font-style:var(--kbq-typography-text-compact-font-style);font-weight:var(--kbq-typography-text-compact-font-weight);line-height:var(--kbq-typography-text-compact-line-height);font-family:var(--kbq-typography-text-compact-font-family);text-transform:var(--kbq-typography-text-compact-text-transform);font-feature-settings:var(--kbq-typography-text-compact-font-feature-settings);letter-spacing:var(--kbq-typography-text-compact-letter-spacing)}\n", ":where(.kbq-file-upload){--kbq-file-upload-size-dropzone-content-gap-horizontal: var(--kbq-size-s);--kbq-form-field-hint-text: var(--kbq-foreground-contrast-secondary)}:where(.kbq-single-file-upload){--kbq-form-field-hint-size-margin-top: var(--kbq-size-xs);--kbq-form-field-hint-size-gap: var(--kbq-size-xxs);--kbq-file-upload-size-single-container-border-radius: var(--kbq-size-s);--kbq-file-upload-size-single-container-border-width: 1px;--kbq-file-upload-size-single-container-content-gap-horizontal: var(--kbq-size-s);--kbq-file-upload-size-single-container-padding-vertical: var(--kbq-size-m);--kbq-file-upload-size-single-container-padding-horizontal: var(--kbq-size-l);--kbq-file-upload-size-single-text-block-padding-vertical: var(--kbq-size-3xs);--kbq-file-upload-size-single-text-block-content-gap-horizontal: var(--kbq-size-xxs);--kbq-file-upload-single-min-height: 44px;--kbq-file-upload-single-default-container-border: var(--kbq-line-contrast-fade);--kbq-file-upload-single-default-container-background: var(--kbq-background-bg);--kbq-file-upload-single-default-dropzone-icon-color: var(--kbq-icon-contrast-fade);--kbq-file-upload-single-default-left-icon-color: var(--kbq-icon-contrast-fade);--kbq-file-upload-single-default-text-block-color: var(--kbq-foreground-contrast);--kbq-file-upload-single-default-file-size-text-color: var(--kbq-foreground-contrast-secondary);--kbq-file-upload-single-states-on-drag-container-border: var(--kbq-line-theme-fade);--kbq-file-upload-single-states-on-drag-container-background: var(--kbq-background-theme-fade);--kbq-file-upload-single-states-on-drag-dropzone-icon-color: var(--kbq-icon-contrast-fade);--kbq-file-upload-single-states-on-drag-left-icon-color: var(--kbq-icon-contrast-fade);--kbq-file-upload-single-states-on-drag-text-block-color: var(--kbq-foreground-contrast);--kbq-file-upload-single-states-error-container-border: var(--kbq-line-error);--kbq-file-upload-single-states-error-container-background: var(--kbq-background-error-less);--kbq-file-upload-single-states-error-dropzone-icon-color: var(--kbq-icon-error);--kbq-file-upload-single-states-error-left-icon-color: var(--kbq-icon-error);--kbq-file-upload-single-states-error-text-block-color: var(--kbq-foreground-error);--kbq-file-upload-single-states-error-file-size-text-color: var(--kbq-foreground-error);--kbq-file-upload-single-states-disabled-container-border: var(--kbq-states-line-disabled);--kbq-file-upload-single-states-disabled-container-background: var(--kbq-states-background-disabled);--kbq-file-upload-single-states-disabled-dropzone-icon-color: var(--kbq-states-icon-disabled);--kbq-file-upload-single-states-disabled-left-icon-color: var(--kbq-states-icon-disabled);--kbq-file-upload-single-states-disabled-text-block-color: var(--kbq-states-foreground-disabled);--kbq-file-upload-single-states-disabled-file-size-text-color: var(--kbq-states-foreground-disabled);--kbq-file-upload-single-states-focused-focus-outline-color: var(--kbq-states-line-focus-theme)}:where(.kbq-multiple-file-upload){--kbq-form-field-hint-size-margin-top: var(--kbq-size-xs);--kbq-form-field-hint-size-gap: var(--kbq-size-xxs);--kbq-file-upload-size-multiple-min-height: 120px;--kbq-file-upload-size-multiple-max-height: unset;--kbq-file-upload-size-multiple-big-container-min-height: 192px;--kbq-file-upload-size-multiple-big-container-min-width: 320px;--kbq-file-upload-size-multiple-big-container-border-radius: var(--kbq-size-s);--kbq-file-upload-size-multiple-big-container-border-width: 1px;--kbq-file-upload-size-multiple-big-container-content-gap-horizontal: var(--kbq-size-m);--kbq-file-upload-size-multiple-big-container-padding-vertical: var(--kbq-size-xxl);--kbq-file-upload-size-multiple-big-container-padding-horizontal: var(--kbq-size-xxl);--kbq-file-upload-size-multiple-big-dropzone-content-gap-horizontal: var(--kbq-size-s);--kbq-file-upload-size-multiple-big-text-block-content-gap-vertical: 0px;--kbq-file-upload-size-multiple-big-text-block-content-gap-horizontal: var(--kbq-size-xxs);--kbq-file-upload-size-multiple-big-grid-cell-padding-horizontal: var(--kbq-size-s);--kbq-file-upload-size-multiple-big-grid-cell-padding-vertical: var(--kbq-size-s);--kbq-file-upload-size-multiple-big-grid-cell-content-gap-horizontal: var(--kbq-size-s);--kbq-file-upload-size-multiple-big-grid-cell-file-size-width: var(--kbq-size-7xl);--kbq-file-upload-multiple-default-container-border: var(--kbq-line-contrast-fade);--kbq-file-upload-multiple-default-container-background: var(--kbq-background-bg);--kbq-file-upload-multiple-default-upload-icon-color: var(--kbq-icon-contrast);--kbq-file-upload-multiple-default-dropzone-icon-color: var(--kbq-icon-contrast-fade);--kbq-file-upload-multiple-default-left-icon-color: var(--kbq-icon-contrast-fade);--kbq-file-upload-multiple-default-text-block-color: var(--kbq-foreground-contrast);--kbq-file-upload-multiple-default-grid-divider-color: var(--kbq-line-contrast-less);--kbq-file-upload-multiple-default-file-size-text-color: var(--kbq-foreground-contrast-secondary);--kbq-file-upload-multiple-states-on-drag-container-border: var(--kbq-line-theme-fade);--kbq-file-upload-multiple-states-on-drag-container-background: var(--kbq-background-theme-fade);--kbq-file-upload-multiple-states-on-drag-upload-icon-color: var(--kbq-icon-contrast);--kbq-file-upload-multiple-states-on-drag-dropzone-icon-color: var(--kbq-icon-contrast-fade);--kbq-file-upload-multiple-states-on-drag-left-icon-color: var(--kbq-icon-contrast-fade);--kbq-file-upload-multiple-states-on-drag-text-block-color: var(--kbq-foreground-contrast);--kbq-file-upload-multiple-states-on-drag-grid-divider-color: var(--kbq-line-contrast-less);--kbq-file-upload-multiple-states-error-container-border: var(--kbq-line-error);--kbq-file-upload-multiple-states-error-container-background: var(--kbq-background-error-less);--kbq-file-upload-multiple-states-error-upload-icon-color: var(--kbq-icon-error);--kbq-file-upload-multiple-states-error-dropzone-icon-color: var(--kbq-icon-error);--kbq-file-upload-multiple-states-error-left-icon-color: var(--kbq-icon-error);--kbq-file-upload-multiple-states-error-icon-button-color: var(--kbq-icon-error);--kbq-file-upload-multiple-states-error-text-block-color: var(--kbq-foreground-error);--kbq-file-upload-multiple-states-disabled-container-border: var(--kbq-states-line-disabled);--kbq-file-upload-multiple-states-disabled-container-background: var(--kbq-states-background-disabled);--kbq-file-upload-multiple-states-disabled-upload-icon-color: var(--kbq-states-icon-disabled);--kbq-file-upload-multiple-states-disabled-dropzone-icon-color: var(--kbq-states-icon-disabled);--kbq-file-upload-multiple-states-disabled-left-icon-color: var(--kbq-states-icon-disabled);--kbq-file-upload-multiple-states-disabled-text-block-color: var(--kbq-states-foreground-disabled);--kbq-file-upload-multiple-states-disabled-grid-divider-color: var(--kbq-states-line-disabled);--kbq-file-upload-multiple-states-focused-focus-outline-color: var(--kbq-states-line-focus-theme)}:where(.kbq-file-upload.kbq-file-upload_compact){--kbq-file-upload-multiple-compact-container-content-gap-horizontal: var(--kbq-size-s);--kbq-file-upload-multiple-compact-text-block-padding-vertical: var(--kbq-size-3xs);--kbq-file-upload-multiple-compact-container-padding-vertical: 11px;--kbq-file-upload-multiple-compact-container-padding-horizontal: 15px}\n", ".kbq-multiple-file-upload .kbq-file-upload{border-radius:var(--kbq-file-upload-size-multiple-big-container-border-radius);border-width:var(--kbq-file-upload-size-multiple-big-container-border-width);border-style:dashed}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-selected).kbq-file-upload_default{justify-content:center;min-height:var(--kbq-file-upload-size-multiple-big-container-min-height);min-width:var(--kbq-file-upload-size-multiple-big-container-min-width)}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-selected).kbq-file-upload_default .kbq-multiple-file-upload__empty-state{--kbq-empty-state-size-normal-padding-top: 0;--kbq-empty-state-size-normal-padding-bottom: 0;--kbq-empty-state-size-normal-image-addon-height: 4px;--kbq-empty-state-size-normal-padding-horizontal: 23px}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-selected).kbq-file-upload_compact{padding:var(--kbq-file-upload-multiple-compact-container-padding-vertical) var(--kbq-file-upload-multiple-compact-container-padding-horizontal)}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__dropzone-icon>svg{vertical-align:bottom}.kbq-multiple-file-upload .kbq-file-upload .kbq-multiple-file-upload__empty-state{--kbq-empty-state-size-normal-image-margin-bottom: var(--kbq-size-m);--kbq-empty-state-size-normal-title-margin-bottom: var(--kbq-size-xs)}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__list{box-sizing:content-box;min-height:var(--kbq-file-upload-size-multiple-min-height);max-height:var(--kbq-file-upload-size-multiple-max-height);overflow-y:auto;padding-top:calc(var(--kbq-size-xxs) - var(--kbq-size-border-width));padding-bottom:var(--kbq-size-xxl)}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__row{display:flex;align-items:center;flex:1;min-width:0}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__row .kbq-file-upload__grid-cell{padding:0 var(--kbq-file-upload-size-multiple-big-grid-cell-padding-horizontal)}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__row .kbq-file-upload__file{display:flex;align-items:center;flex-grow:1;gap:var(--kbq-file-upload-size-multiple-big-grid-cell-content-gap-horizontal);padding-left:var(--kbq-size-m);min-width:0}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__row .kbq-file-upload__file .kbq-file-item__text{flex:1 1 auto}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__row .kbq-file-upload__size{box-sizing:content-box;width:var(--kbq-file-upload-size-multiple-big-grid-cell-file-size-width);min-width:var(--kbq-file-upload-size-multiple-big-grid-cell-file-size-width);max-width:var(--kbq-file-upload-size-multiple-big-grid-cell-file-size-width);flex:none;text-align:left}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__row .kbq-file-upload__action{padding:var(--kbq-size-m)}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__list-footer{margin:-1px;padding:var(--kbq-size-m) var(--kbq-size-l);border-top-width:var(--kbq-file-upload-size-multiple-big-container-border-width);border-top-style:dashed}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__wrapper{width:100%;height:100%}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__item{border-radius:0;border:0;padding:0 calc(var(--kbq-size-xxs) - var(--kbq-size-border-width))}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__item .kbq-file-upload__row{border-radius:var(--kbq-size-xs)}.kbq-multiple-file-upload .kbq-file-upload{background-color:var(--kbq-file-upload-multiple-default-container-background);border-color:var(--kbq-file-upload-multiple-default-container-border)!important}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled,.kbq-error) .kbq-file-upload__dropzone-icon{color:var(--kbq-file-upload-multiple-default-dropzone-icon-color)}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled,.kbq-error) .kbq-multiple-file-upload__empty-state{--kbq-empty-state-title: var(--kbq-file-upload-multiple-default-text-block-color);--kbq-empty-state-color: var(--kbq-file-upload-multiple-default-text-block-color)}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled,.kbq-error) .kbq-multiple-file-upload__empty-state-upload-icon{color:var(--kbq-file-upload-multiple-default-upload-icon-color)}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled,.kbq-error) .kbq-file-upload__dropzone-caption{color:var(--kbq-file-upload-multiple-default-text-block-color)}.kbq-multiple-file-upload .kbq-file-upload.kbq-file-drop_dragover{background-color:var(--kbq-file-upload-multiple-states-on-drag-container-background);border-color:var(--kbq-file-upload-multiple-states-on-drag-container-border)!important}.kbq-multiple-file-upload .kbq-file-upload.kbq-file-drop_dragover .kbq-file-upload__dropzone-icon{color:var(--kbq-file-upload-multiple-states-on-drag-dropzone-icon-color)}.kbq-multiple-file-upload .kbq-file-upload.kbq-file-drop_dragover .kbq-file-upload__list-footer{border-top-color:var(--kbq-file-upload-multiple-states-on-drag-container-border)}.kbq-multiple-file-upload .kbq-file-upload.kbq-file-drop_dragover .kbq-multiple-file-upload__empty-state-upload-icon{color:var(--kbq-file-upload-multiple-states-on-drag-upload-icon-color)}.kbq-multiple-file-upload .kbq-file-upload.kbq-disabled{background-color:var(--kbq-file-upload-multiple-states-disabled-container-background);border-color:var(--kbq-file-upload-multiple-states-disabled-container-border)!important}.kbq-multiple-file-upload .kbq-file-upload.kbq-disabled .kbq-file-upload__dropzone-icon{color:var(--kbq-file-upload-multiple-states-disabled-dropzone-icon-color)}.kbq-multiple-file-upload .kbq-file-upload.kbq-disabled .kbq-file-upload__list-footer{border-top-color:var(--kbq-file-upload-multiple-states-disabled-container-border)}.kbq-multiple-file-upload .kbq-file-upload.kbq-disabled .kbq-multiple-file-upload__empty-state-upload-icon{color:var(--kbq-file-upload-multiple-states-disabled-upload-icon-color)}.kbq-multiple-file-upload .kbq-file-upload.kbq-disabled .kbq-multiple-file-upload__empty-state{--kbq-empty-state-title: var(--kbq-file-upload-multiple-states-disabled-text-block-color);--kbq-empty-state-color: var(--kbq-file-upload-multiple-states-disabled-text-block-color)}.kbq-multiple-file-upload .kbq-file-upload.kbq-disabled .kbq-file-upload__dropzone-caption{color:var(--kbq-file-upload-multiple-states-disabled-text-block-color)}.kbq-multiple-file-upload .kbq-file-upload.kbq-disabled .kbq-file-upload__item .kbq-file-upload__file .kbq-icon.kbq-empty{color:var(--kbq-file-upload-multiple-states-disabled-left-icon-color)}.kbq-multiple-file-upload .kbq-file-upload.kbq-disabled .kbq-file-upload__item .kbq-file-item__text,.kbq-multiple-file-upload .kbq-file-upload.kbq-disabled .kbq-file-upload__item .kbq-file-upload__size{color:var(--kbq-file-upload-multiple-states-disabled-text-block-color)}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled).kbq-error{background-color:var(--kbq-file-upload-multiple-states-error-container-background);border-color:var(--kbq-file-upload-multiple-states-error-container-border)!important}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled).kbq-error .kbq-file-upload__dropzone-icon{color:var(--kbq-file-upload-multiple-states-error-dropzone-icon-color)}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled).kbq-error .kbq-multiple-file-upload__empty-state-upload-icon{color:var(--kbq-file-upload-multiple-states-error-upload-icon-color)}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled).kbq-error .kbq-file-upload__dropzone-caption{color:var(--kbq-file-upload-multiple-states-error-text-block-color)}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled).kbq-error .kbq-multiple-file-upload__empty-state{--kbq-file-upload-multiple-states-error-text-block-color: var( --kbq-file-upload-multiple-default-text-block-color );--kbq-empty-state-title: var(--kbq-file-upload-multiple-states-error-text-block-color);--kbq-empty-state-color: var(--kbq-file-upload-multiple-states-error-text-block-color)}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled).kbq-error .kbq-file-upload__list-footer{border-top-color:var(--kbq-file-upload-multiple-states-error-container-border)}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled) .kbq-file-upload__item:has(.kbq-file-upload__row.kbq-error):hover .kbq-file-upload__row,.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled) .kbq-file-upload__item:has(.kbq-file-upload__row.kbq-error).kbq-hovered .kbq-file-upload__row{background-color:var(--kbq-states-background-error-less-hover)}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled) .kbq-file-upload__item:has(.kbq-file-upload__row.kbq-error) .kbq-file-item__text,.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled) .kbq-file-upload__item:has(.kbq-file-upload__row.kbq-error) .kbq-file-upload__size{color:var(--kbq-file-upload-multiple-states-error-text-block-color)}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled) .kbq-file-upload__item:has(.kbq-file-upload__row.kbq-error) .kbq-file-upload__file .kbq-icon.kbq-empty{color:var(--kbq-file-upload-multiple-states-error-left-icon-color)}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled) .kbq-file-upload__item:has(.kbq-file-upload__row.kbq-error) .kbq-file-upload__action.kbq-icon.kbq-empty{color:var(--kbq-file-upload-multiple-states-error-icon-button-color)}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled) .kbq-file-upload__item:not(:has(.kbq-file-upload__row.kbq-error)):hover .kbq-file-upload__row,.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled) .kbq-file-upload__item:not(:has(.kbq-file-upload__row.kbq-error)).kbq-hovered .kbq-file-upload__row{--kbq-option-background: var(--kbq-list-states-hover-container-background);background:var(--kbq-list-states-hover-container-background)}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled) .kbq-file-upload__item:not(:has(.kbq-file-upload__row.kbq-error)).kbq-disabled .kbq-file-upload__row{--kbq-option-background: var(--kbq-list-states-disabled-container-background);background:var(--kbq-list-states-disabled-container-background)}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__list-footer{border-top-color:var(--kbq-file-upload-multiple-default-container-border)}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__item .kbq-file-upload__file .kbq-icon.kbq-empty{color:var(--kbq-file-upload-multiple-default-left-icon-color)}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__item .kbq-file-upload__size{color:var(--kbq-file-upload-multiple-default-file-size-text-color)}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: KbqFileDropDirective, selector: "[kbqFileDrop]", exportAs: ["kbqFileDrop"] }, { kind: "component", type: KbqIconButton, selector: "[kbq-icon-button]", inputs: ["size", "small", "kbq-icon-button", "tabindex", "disabled"] }, { kind: "component", type: KbqIcon, selector: "[kbq-icon]", inputs: ["small", "autoColor", "kbq-icon"] }, { kind: "directive", type: KbqLink, selector: "[kbq-link]", inputs: ["disabled", "tabIndex", "pseudo", "noUnderline", "big", "compact", "multiline", "useVisited", "print"], exportAs: ["kbqLink"] }, { kind: "ngmodule", type: KbqListModule }, { kind: "component", type: i2.KbqList, selector: "kbq-list" }, { kind: "component", type: i2.KbqListItem, selector: "kbq-list-item, a[kbq-list-item]" }, { kind: "ngmodule", type: KbqProgressSpinnerModule }, { kind: "component", type: i3.KbqProgressSpinner, selector: "kbq-progress-spinner", inputs: ["id", "value", "mode", "size"] }, { kind: "directive", type: KbqEllipsisCenterDirective, selector: "[kbqEllipsisCenter]", inputs: ["kbqEllipsisCenter", "minVisibleLength", "charWidth", "debounceInterval"] }, { kind: "component", type: KbqFileLoader, selector: "[kbqFileLoader]", inputs: ["disabled", "multiple", "accept", "for", "onlyDirectory"], outputs: ["fileChange"], exportAs: ["kbqFileLoader"] }, { kind: "component", type: KbqFileUploadEmptyState, selector: "kbq-file-upload-empty-state", inputs: ["title", "caption"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: KbqDataSizePipe, name: "kbqDataSize" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
1225
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KbqMultipleFileUploadComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1226
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.25", type: KbqMultipleFileUploadComponent, isStandalone: true, selector: "kbq-multiple-file-upload,kbq-file-upload[multiple]", inputs: { progressMode: { classPropertyName: "progressMode", publicName: "progressMode", isSignal: true, isRequired: false, transformFunction: null }, accept: { classPropertyName: "accept", publicName: "accept", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: false, transformFunction: null }, allowed: { classPropertyName: "allowed", publicName: "allowed", isSignal: true, isRequired: false, transformFunction: null }, fullScreenDropZone: { classPropertyName: "fullScreenDropZone", publicName: "fullScreenDropZone", isSignal: true, isRequired: false, transformFunction: null }, addStrategy: { classPropertyName: "addStrategy", publicName: "addStrategy", isSignal: true, isRequired: false, transformFunction: null }, errorStateMatcherInput: { classPropertyName: "errorStateMatcherInput", publicName: "errorStateMatcher", isSignal: true, isRequired: false, transformFunction: null }, filesInput: { classPropertyName: "filesInput", publicName: "files", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { filesChange: "filesChange", filesAdded: "filesAdded", fileRemoved: "fileRemoved", rejected: "rejected" }, host: { listeners: { "focusout": "onFocusOut($event)" }, classAttribute: "kbq-multiple-file-upload" }, providers: [KbqFullScreenDropzoneService], queries: [{ propertyName: "customFileIcon", first: true, predicate: ["kbqFileIcon"], descendants: true, read: TemplateRef, isSignal: true }, { propertyName: "hint", predicate: KbqHint, isSignal: true }], viewQueries: [{ propertyName: "fileLoader", first: true, predicate: KbqFileLoader, descendants: true, isSignal: true }, { propertyName: "listViewport", first: true, predicate: KbqScrollbar, descendants: true, isSignal: true }, { propertyName: "fileActions", predicate: ["fileAction"], descendants: true, read: ElementRef, isSignal: true }], usesInheritance: true, usesOnChanges: true, hostDirectives: [{ directive: i1$1.KbqLocaleOverridesDirective, inputs: ["kbqLocaleOverrides", "localeOverrides"] }, { directive: KbqFileUploadContext, inputs: ["id", "id", "disabled", "disabled"] }, { directive: KbqFileList, outputs: ["itemsAdded", "itemsAdded", "itemRemoved", "itemRemoved"] }], ngImport: i0, template: "<div\n kbqFileDrop\n class=\"kbq-file-upload\"\n [class.kbq-disabled]=\"disabled\"\n [class.kbq-error]=\"invalid\"\n [class.kbq-selected]=\"files.length\"\n [class.kbq-file-upload_default]=\"size() === 'default'\"\n [class.kbq-file-upload_compact]=\"size() === 'compact'\"\n [disabled]=\"!!fullScreenDropZone()\"\n (filesDropped)=\"onFileDropped($event)\"\n>\n @let localeData = localeConfiguration().multiple;\n @if (!files.length) {\n @if (size() === 'default') {\n <kbq-file-upload-empty-state [size]=\"'normal'\" [title]=\"localeData.title\" [caption]=\"captionText\" />\n } @else {\n <div class=\"kbq-file-dropzone\">\n <i kbq-icon=\"kbq-arrow-up-from-bracket_16\" class=\"kbq-file-upload__dropzone-icon\"></i>\n <span class=\"kbq-file-upload__dropzone-caption\">\n <ng-container *ngTemplateOutlet=\"captionText\" />\n </span>\n </div>\n }\n } @else {\n <div class=\"kbq-file-upload__wrapper\">\n <kbq-scrollbar class=\"kbq-file-upload__list-viewport\">\n <kbq-list class=\"kbq-file-upload__list\" role=\"list\">\n @for (file of files; track file) {\n <kbq-list-item\n role=\"listitem\"\n class=\"kbq-file-upload__item\"\n [class.kbq-disabled]=\"disabled\"\n [attr.aria-invalid]=\"file.hasError || null\"\n (keydown.backspace)=\"deleteFile($index)\"\n (keydown.delete)=\"deleteFile($index)\"\n >\n <div class=\"kbq-file-upload__row\" [class.kbq-error]=\"file.hasError\">\n <div class=\"kbq-file-upload__file kbq-file-upload__grid-cell\">\n @if (!isLoading(file)) {\n <ng-container\n [ngTemplateOutlet]=\"$any(customFileIcon())\"\n [ngTemplateOutletContext]=\"{ $implicit: file }\"\n />\n } @else {\n <kbq-progress-spinner\n class=\"kbq-file-upload-name-cell__icon\"\n [mode]=\"progressMode()\"\n [value]=\"uploadProgress(file)\"\n />\n }\n <span\n class=\"kbq-file-item__text\"\n [minVisibleLength]=\"10\"\n [kbqEllipsisCenter]=\"file.file.name\"\n ></span>\n </div>\n <div class=\"kbq-file-upload__size kbq-file-upload__grid-cell\">\n {{ file.file.size | kbqDataSize }}\n </div>\n <i\n #fileAction\n kbq-icon-button=\"kbq-circle-xmark_16\"\n class=\"kbq-file-upload__action kbq-file-upload__grid-cell\"\n [attr.aria-label]=\"`${a11yNames().remove} ${file.file.name}`\"\n [color]=\"file.hasError ? 'error' : 'contrast-fade'\"\n [disabled]=\"disabled\"\n (click)=\"deleteFile($index, $event, 'program')\"\n (keydown.enter)=\"deleteFile($index, $event, 'program')\"\n (keydown.space)=\"$event.preventDefault(); deleteFile($index, $event, 'program')\"\n ></i>\n </div>\n </kbq-list-item>\n }\n </kbq-list>\n </kbq-scrollbar>\n <div class=\"kbq-file-upload__list-footer kbq-file-dropzone\">\n <i kbq-icon=\"kbq-arrow-up-from-bracket_16\" class=\"kbq-file-upload__dropzone-icon\"></i>\n <span class=\"kbq-file-upload__dropzone-caption\">\n <ng-container *ngTemplateOutlet=\"captionText\" />\n </span>\n </div>\n </div>\n }\n</div>\n\n@if (hasHint) {\n <div class=\"kbq-file-upload__hint\">\n <ng-content select=\"kbq-hint\" />\n </div>\n}\n\n<!-- Announces additions and removals: nothing else in the component reaches assistive tech (WCAG 4.1.3). -->\n<div class=\"cdk-visually-hidden\" role=\"status\" aria-live=\"polite\" aria-atomic=\"true\">{{ announcement() }}</div>\n\n<ng-template #captionText>\n @let context = captionContext();\n @if (files.length) {\n {{ captionTextWhenSelected }}\n } @else if (context.captionText) {\n {{ context.captionText }}\n }\n @if (context.browseLink) {\n <label\n kbqFileLoader\n cdkMonitorSubtreeFocus\n [onlyDirectory]=\"null\"\n [accept]=\"acceptedFiles\"\n [disabled]=\"disabled\"\n [describedBy]=\"describedBy()\"\n [invalid]=\"invalid\"\n [for]=\"fileUploadContext.id() || inputId()\"\n [multiple]=\"true\"\n (fileChange)=\"onFileSelectedViaClick($event)\"\n >\n <span class=\"kbq-file-upload__browse-link\" kbqLink size=\"normal\" [disabled]=\"disabled\" [tabIndex]=\"-1\">\n {{ context.browseLink }}\n </span>\n </label>\n }\n @if (context.captionTextSeparator) {\n {{ context.captionTextSeparator }}\n }\n @if (context.browseLinkFolder) {\n <label\n kbqFileLoader\n cdkMonitorSubtreeFocus\n [onlyDirectory]=\"true\"\n [disabled]=\"disabled\"\n [describedBy]=\"describedBy()\"\n [invalid]=\"invalid\"\n (fileChange)=\"onFileSelectedViaClick($event)\"\n >\n <span class=\"kbq-file-upload__browse-link\" kbqLink size=\"normal\" [disabled]=\"disabled\" [tabIndex]=\"-1\">\n {{ context.browseLinkFolder }}\n </span>\n </label>\n }\n</ng-template>\n", styles: [".kbq-form-field{--kbq-form-field-label-margin-bottom: var(--kbq-size-xs);position:relative;display:inline-block;width:100%}.kbq-form-field.kbq-form-field_horizontal{display:flex;flex-direction:row;align-items:flex-start}.kbq-form-field.kbq-form-field_horizontal .kbq-form-field__label{--kbq-form-field-label-margin-bottom: 0;padding:var(--kbq-size-xs) var(--kbq-size-l) 0 0}.kbq-form-field .kbq-form-field__content{flex:1}.kbq-form-field .kbq-form-field__label{box-sizing:border-box;display:flex;margin-bottom:var(--kbq-form-field-label-margin-bottom)}.kbq-form-field.kbq-form-field-type-select .kbq-form-field__suffix{margin-right:0}.kbq-form-field .kbq-form-field__container{box-sizing:border-box;display:flex;justify-content:space-between;align-items:center;border-width:var(--kbq-form-field-size-border-width);border-style:solid;border-color:transparent;border-radius:var(--kbq-form-field-size-border-radius)}@supports (corner-shape: squircle){.kbq-form-field .kbq-form-field__container{corner-shape:squircle;border-radius:clamp(var(--kbq-form-field-size-border-radius) * 1.85,var(--kbq-form-field-size-border-radius) * 2.3 - 3.6px,var(--kbq-form-field-size-border-radius) * 2)}}.kbq-form-field .kbq-form-field__container{padding-left:var(--kbq-form-field-size-container-left-padding);padding-right:var(--kbq-form-field-size-container-right-padding)}.kbq-form-field .kbq-form-field__container:has(.kbq-textarea){--kbq-form-field-size-container-left-padding: 0;--kbq-form-field-size-container-right-padding: 0}.kbq-form-field .kbq-form-field__infix{box-sizing:border-box;width:100%;flex-grow:1;padding-left:var(--kbq-form-field-size-infix-left-padding)}.kbq-form-field .kbq-form-field__infix:has(.kbq-select_multiple,.kbq-select_multiline):not(:has(.kbq-select__trigger_empty)),.kbq-form-field .kbq-form-field__infix:has(.kbq-tag-list),.kbq-form-field .kbq-form-field__infix:has(.kbq-textarea){padding-left:0;max-width:100%}.kbq-form-field .kbq-form-field__infix:has(.kbq-select_multiple,.kbq-select_multiline):has(kbq-select-trigger,[kbq-select-trigger]){padding-left:var(--kbq-form-field-size-infix-left-padding)}.kbq-form-field .kbq-form-field__infix .kbq-input,.kbq-form-field .kbq-form-field__infix .kbq-tag-input{padding-right:var(--kbq-form-field-size-infix-right-padding)}.kbq-form-field,.kbq-form-field .kbq-textarea{border-radius:var(--kbq-form-field-size-border-radius)}@supports (corner-shape: squircle){.kbq-form-field,.kbq-form-field .kbq-textarea{corner-shape:squircle;border-radius:clamp(var(--kbq-form-field-size-border-radius) * 1.85,var(--kbq-form-field-size-border-radius) * 2.3 - 3.6px,var(--kbq-form-field-size-border-radius) * 2)}}.kbq-form-field:hover{z-index:1}.kbq-form-field.cdk-focused,.kbq-form-field.kbq-focused{z-index:3}.kbq-form-field.kbq-form-field_without-borders,.kbq-form-field.kbq-form-field_no-borders{--kbq-form-field-default-border-color: transparent;--kbq-form-field-states-focused-border-color: transparent;--kbq-form-field-states-error-border-color: transparent;--kbq-form-field-states-disabled-border-color: transparent;--kbq-form-field-states-focused-focus-outline: transparent;--kbq-form-field-states-error-focused-focus-outline: transparent}.kbq-form-field.kbq-form-field_in-overlay{--kbq-form-field-default-background: var(--kbq-background-card);--kbq-form-field-states-focused-background: var(--kbq-background-card);--kbq-form-field-states-error-background: var(--kbq-background-card);--kbq-form-field-states-disabled-background: var(--kbq-background-card)}.kbq-form-field .kbq-form-field__prefix,.kbq-form-field .kbq-form-field__suffix{display:flex;justify-content:center;align-items:center}.kbq-form-field .kbq-form-field__prefix .kbq-prefix,.kbq-form-field .kbq-form-field__prefix .kbq-suffix,.kbq-form-field .kbq-form-field__suffix .kbq-prefix,.kbq-form-field .kbq-form-field__suffix .kbq-suffix{min-width:var(--kbq-form-field-size-addon-width);text-align:center}.kbq-form-field .kbq-form-field__prefix+.kbq-form-field__infix{padding-left:0}.kbq-form-field .kbq-form-field__hint{display:flex;flex-direction:column;gap:var(--kbq-form-field-hint-size-gap);margin-top:var(--kbq-form-field-hint-size-margin-top)}.kbq-form-field .kbq-form-field__hint:has(.kbq-reactive-password-hint){--kbq-form-field-hint-size-gap: var(--kbq-size-s)}.kbq-form-field .kbq-form-field__hint:has(.kbq-reactive-password-hint:first-child){--kbq-form-field-hint-size-margin-top: var(--kbq-size-m)}.kbq-form-field .kbq-form-field__container{border-color:var(--kbq-form-field-default-border-color);background-color:var(--kbq-form-field-default-background)}.kbq-form-field .kbq-input,.kbq-form-field .kbq-tag-input,.kbq-form-field .kbq-textarea{--kbq-form-field-resolved-text: var(--kbq-form-field-default-text);color:var(--kbq-form-field-resolved-text)}.kbq-form-field .kbq-input::placeholder,.kbq-form-field .kbq-tag-input::placeholder,.kbq-form-field .kbq-textarea::placeholder{color:var(--kbq-form-field-default-placeholder)}.kbq-form-field .kbq-input::-ms-input-placeholder,.kbq-form-field .kbq-tag-input::-ms-input-placeholder,.kbq-form-field .kbq-textarea::-ms-input-placeholder{color:var(--kbq-form-field-default-placeholder)}.kbq-form-field .kbq-input::-webkit-input-placeholder,.kbq-form-field .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field .kbq-textarea::-webkit-input-placeholder{color:var(--kbq-form-field-default-placeholder)}.kbq-form-field .kbq-input:is(:autofill,:-webkit-autofill),.kbq-form-field .kbq-tag-input:is(:autofill,:-webkit-autofill),.kbq-form-field .kbq-textarea:is(:autofill,:-webkit-autofill){transition-property:background-color;transition-duration:600000s;-webkit-text-fill-color:var(--kbq-form-field-resolved-text, var(--kbq-form-field-default-text));caret-color:var(--kbq-form-field-resolved-text, var(--kbq-form-field-default-text))}.kbq-form-field.kbq-form-field_invalid .kbq-form-field__container{border-color:var(--kbq-form-field-states-error-border-color);background-color:var(--kbq-form-field-states-error-background)}.kbq-form-field.kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field_invalid .kbq-textarea{--kbq-form-field-resolved-text: var(--kbq-form-field-states-error-text);color:var(--kbq-form-field-resolved-text)}.kbq-form-field.kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field_invalid .kbq-textarea::placeholder{color:var(--kbq-form-field-states-error-placeholder)}.kbq-form-field.kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder{color:var(--kbq-form-field-states-error-placeholder)}.kbq-form-field.kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder{color:var(--kbq-form-field-states-error-placeholder)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container{border-color:var(--kbq-form-field-states-focused-border-color);background-color:var(--kbq-form-field-states-focused-background)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea{--kbq-form-field-resolved-text: var(--kbq-form-field-states-focused-text);color:var(--kbq-form-field-resolved-text)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder{color:var(--kbq-form-field-states-focused-placeholder)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder{color:var(--kbq-form-field-states-focused-placeholder)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder{color:var(--kbq-form-field-states-focused-placeholder)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container{box-shadow:inset 0 0 .1px var(--kbq-form-field-size-focus-outline-width) var(--kbq-form-field-states-focused-focus-outline)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container{border-color:var(--kbq-form-field-states-error-border-color);background-color:var(--kbq-form-field-states-error-background)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea{--kbq-form-field-resolved-text: var(--kbq-form-field-states-error-text);color:var(--kbq-form-field-resolved-text)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder{color:var(--kbq-form-field-states-error-placeholder)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder{color:var(--kbq-form-field-states-error-placeholder)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder{color:var(--kbq-form-field-states-error-placeholder)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container{box-shadow:inset 0 0 .1px var(--kbq-form-field-size-focus-outline-width) var(--kbq-form-field-states-error-focused-focus-outline)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty{color:var(--kbq-form-field-states-error-text);-webkit-text-fill-color:var(--kbq-form-field-states-error-text)}.kbq-form-field .kbq-form-field__label{color:var(--kbq-form-field-label-color)}.kbq-form-field .kbq-form-field__container:has(:is(.kbq-input,.kbq-tag-input,.kbq-textarea):is(:autofill,:-webkit-autofill)){background-image:linear-gradient(var(--kbq-form-field-states-autofill-background),var(--kbq-form-field-states-autofill-background))}.kbq-form-field.kbq-disabled .kbq-form-field__container{border-color:var(--kbq-form-field-states-disabled-border-color);background-color:var(--kbq-form-field-states-disabled-background)}.kbq-form-field.kbq-disabled .kbq-input,.kbq-form-field.kbq-disabled .kbq-tag-input,.kbq-form-field.kbq-disabled .kbq-textarea{--kbq-form-field-resolved-text: var(--kbq-form-field-states-disabled-text);color:var(--kbq-form-field-resolved-text)}.kbq-form-field.kbq-disabled .kbq-input::placeholder,.kbq-form-field.kbq-disabled .kbq-tag-input::placeholder,.kbq-form-field.kbq-disabled .kbq-textarea::placeholder{color:var(--kbq-form-field-states-disabled-placeholder)}.kbq-form-field.kbq-disabled .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-disabled .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-disabled .kbq-textarea::-ms-input-placeholder{color:var(--kbq-form-field-states-disabled-placeholder)}.kbq-form-field.kbq-disabled .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-disabled .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-disabled .kbq-textarea::-webkit-input-placeholder{color:var(--kbq-form-field-states-disabled-placeholder)}.kbq-form-field.kbq-disabled .kbq-icon.kbq-empty{color:var(--kbq-form-field-states-disabled-text);-webkit-text-fill-color:var(--kbq-form-field-states-disabled-text)}.kbq-form-field .kbq-form-field__prefix .kbq-icon.kbq-empty,.kbq-form-field .kbq-form-field__suffix .kbq-icon.kbq-empty{color:var(--kbq-icon-contrast-fade)}.kbq-form-field .kbq-form-field__hint>.kbq-hint:not(.kbq-contrast-fade,.kbq-success,.kbq-warning,.kbq-error){color:var(--kbq-form-field-hint-text)}.kbq-form-field{font-size:var(--kbq-typography-text-normal-font-size);font-style:var(--kbq-typography-text-normal-font-style);font-weight:var(--kbq-typography-text-normal-font-weight);line-height:var(--kbq-typography-text-normal-line-height);font-family:var(--kbq-typography-text-normal-font-family);text-transform:var(--kbq-typography-text-normal-text-transform);font-feature-settings:var(--kbq-typography-text-normal-font-feature-settings);letter-spacing:var(--kbq-typography-text-normal-letter-spacing)}.kbq-form-field .kbq-form-field__hint>.kbq-hint:not(.kbq-reactive-password-hint,.kbq-contrast-fade,.kbq-success,.kbq-warning) .kbq-hint__text{font-size:var(--kbq-typography-text-compact-font-size);font-style:var(--kbq-typography-text-compact-font-style);font-weight:var(--kbq-typography-text-compact-font-weight);line-height:var(--kbq-typography-text-compact-line-height);font-family:var(--kbq-typography-text-compact-font-family);text-transform:var(--kbq-typography-text-compact-text-transform);font-feature-settings:var(--kbq-typography-text-compact-font-feature-settings);letter-spacing:var(--kbq-typography-text-compact-letter-spacing)}.kbq-file-upload{box-sizing:border-box;display:flex;align-items:center;position:relative}.kbq-file-upload .kbq-file-item{display:flex;align-items:center}.kbq-file-upload .kbq-file-dropzone{display:flex;align-items:baseline;gap:var(--dropzone-gap, var(--kbq-file-upload-size-dropzone-content-gap-horizontal))}.kbq-file-loader.cdk-keyboard-focused>.kbq-file-upload__browse-link{outline-style:solid;outline-width:var(--kbq-link-size-state-focused-outline-width);outline-color:var(--kbq-link-state-focused-outline)}.kbq-file-upload__hint{display:flex;flex-direction:column;gap:var(--kbq-form-field-hint-size-gap);margin-top:var(--kbq-form-field-hint-size-margin-top)}.kbq-file-upload__hint:has(.kbq-reactive-password-hint){--kbq-form-field-hint-size-gap: var(--kbq-size-s)}.kbq-file-upload__hint:has(.kbq-reactive-password-hint:first-child){--kbq-form-field-hint-size-margin-top: var(--kbq-size-m)}:where(.kbq-file-upload__hint .kbq-hint){color:var(--kbq-foreground-contrast-secondary)}.kbq-file-upload{font-size:var(--kbq-typography-text-normal-font-size);font-style:var(--kbq-typography-text-normal-font-style);font-weight:var(--kbq-typography-text-normal-font-weight);line-height:var(--kbq-typography-text-normal-line-height);font-family:var(--kbq-typography-text-normal-font-family);text-transform:var(--kbq-typography-text-normal-text-transform);font-feature-settings:var(--kbq-typography-text-normal-font-feature-settings);letter-spacing:var(--kbq-typography-text-normal-letter-spacing)}.kbq-file-upload__hint .kbq-hint .kbq-hint__text{font-size:var(--kbq-typography-text-compact-font-size);font-style:var(--kbq-typography-text-compact-font-style);font-weight:var(--kbq-typography-text-compact-font-weight);line-height:var(--kbq-typography-text-compact-line-height);font-family:var(--kbq-typography-text-compact-font-family);text-transform:var(--kbq-typography-text-compact-text-transform);font-feature-settings:var(--kbq-typography-text-compact-font-feature-settings);letter-spacing:var(--kbq-typography-text-compact-letter-spacing)}\n", ":where(.kbq-file-upload){--kbq-file-upload-size-dropzone-content-gap-horizontal: var(--kbq-size-s);--kbq-form-field-hint-text: var(--kbq-foreground-contrast-secondary)}:where(.kbq-single-file-upload){--kbq-form-field-hint-size-margin-top: var(--kbq-size-xs);--kbq-form-field-hint-size-gap: var(--kbq-size-xxs);--kbq-file-upload-size-single-container-border-radius: var(--kbq-size-s);--kbq-file-upload-size-single-container-border-width: 1px;--kbq-file-upload-size-single-container-content-gap-horizontal: var(--kbq-size-s);--kbq-file-upload-size-single-container-padding-vertical: var(--kbq-size-m);--kbq-file-upload-size-single-container-padding-horizontal: var(--kbq-size-l);--kbq-file-upload-single-min-height: 44px;--kbq-file-upload-size-single-action-padding: 13px;--kbq-file-upload-single-default-container-border: var(--kbq-line-contrast-fade);--kbq-file-upload-single-default-container-background: var(--kbq-background-bg);--kbq-file-upload-single-default-dropzone-icon-color: var(--kbq-icon-contrast-fade);--kbq-file-upload-single-default-left-icon-color: var(--kbq-icon-contrast-fade);--kbq-file-upload-single-default-file-size-text-color: var(--kbq-foreground-contrast-secondary);--kbq-file-upload-single-states-on-drag-container-border: var(--kbq-line-theme-fade);--kbq-file-upload-single-states-on-drag-container-background: var(--kbq-background-theme-fade);--kbq-file-upload-single-states-error-container-border: var(--kbq-line-error);--kbq-file-upload-single-states-error-container-background: var(--kbq-background-error-less);--kbq-file-upload-single-states-error-dropzone-icon-color: var(--kbq-icon-error);--kbq-file-upload-single-states-error-left-icon-color: var(--kbq-icon-error);--kbq-file-upload-single-states-error-text-block-color: var(--kbq-foreground-error);--kbq-file-upload-single-states-error-file-size-text-color: var(--kbq-foreground-error);--kbq-file-upload-single-states-disabled-container-border: var(--kbq-states-line-disabled);--kbq-file-upload-single-states-disabled-container-background: var(--kbq-states-background-disabled);--kbq-file-upload-single-states-disabled-dropzone-icon-color: var(--kbq-states-icon-disabled);--kbq-file-upload-single-states-disabled-left-icon-color: var(--kbq-states-icon-disabled);--kbq-file-upload-single-states-disabled-text-block-color: var(--kbq-states-foreground-disabled);--kbq-file-upload-single-states-disabled-file-size-text-color: var(--kbq-states-foreground-disabled)}:where(.kbq-multiple-file-upload){--kbq-form-field-hint-size-margin-top: var(--kbq-size-xs);--kbq-form-field-hint-size-gap: var(--kbq-size-xxs);--kbq-file-upload-size-multiple-min-height: 120px;--kbq-file-upload-size-multiple-max-height: unset;--kbq-file-upload-size-multiple-big-container-min-height: 192px;--kbq-file-upload-size-multiple-big-container-min-width: 320px;--kbq-file-upload-size-multiple-big-container-border-radius: var(--kbq-size-s);--kbq-file-upload-size-multiple-big-container-border-width: 1px;--kbq-file-upload-size-multiple-big-grid-cell-padding-horizontal: var(--kbq-size-s);--kbq-file-upload-size-multiple-big-grid-cell-content-gap-horizontal: var(--kbq-size-s);--kbq-file-upload-size-multiple-big-grid-cell-file-size-width: var(--kbq-size-7xl);--kbq-file-upload-multiple-default-container-border: var(--kbq-line-contrast-fade);--kbq-file-upload-multiple-default-container-background: var(--kbq-background-bg);--kbq-file-upload-multiple-default-upload-icon-color: var(--kbq-icon-contrast);--kbq-file-upload-multiple-default-dropzone-icon-color: var(--kbq-icon-contrast-fade);--kbq-file-upload-multiple-default-left-icon-color: var(--kbq-icon-contrast-fade);--kbq-file-upload-multiple-default-text-block-color: var(--kbq-foreground-contrast);--kbq-file-upload-multiple-default-file-size-text-color: var(--kbq-foreground-contrast-secondary);--kbq-file-upload-multiple-states-on-drag-container-border: var(--kbq-line-theme-fade);--kbq-file-upload-multiple-states-on-drag-container-background: var(--kbq-background-theme-fade);--kbq-file-upload-multiple-states-on-drag-upload-icon-color: var(--kbq-icon-contrast);--kbq-file-upload-multiple-states-on-drag-dropzone-icon-color: var(--kbq-icon-contrast-fade);--kbq-file-upload-multiple-states-error-container-border: var(--kbq-line-error);--kbq-file-upload-multiple-states-error-container-background: var(--kbq-background-error-less);--kbq-file-upload-multiple-states-error-upload-icon-color: var(--kbq-icon-error);--kbq-file-upload-multiple-states-error-dropzone-icon-color: var(--kbq-icon-error);--kbq-file-upload-multiple-states-error-left-icon-color: var(--kbq-icon-error);--kbq-file-upload-multiple-states-error-icon-button-color: var(--kbq-icon-error);--kbq-file-upload-multiple-states-error-text-block-color: var(--kbq-foreground-error);--kbq-file-upload-multiple-states-disabled-container-border: var(--kbq-states-line-disabled);--kbq-file-upload-multiple-states-disabled-container-background: var(--kbq-states-background-disabled);--kbq-file-upload-multiple-states-disabled-upload-icon-color: var(--kbq-states-icon-disabled);--kbq-file-upload-multiple-states-disabled-dropzone-icon-color: var(--kbq-states-icon-disabled);--kbq-file-upload-multiple-states-disabled-left-icon-color: var(--kbq-states-icon-disabled);--kbq-file-upload-multiple-states-disabled-text-block-color: var(--kbq-states-foreground-disabled)}:where(.kbq-file-upload.kbq-file-upload_compact){--kbq-file-upload-multiple-compact-container-padding-vertical: 11px;--kbq-file-upload-multiple-compact-container-padding-horizontal: 15px}\n", ".kbq-multiple-file-upload .kbq-file-upload{border-radius:var(--kbq-file-upload-size-multiple-big-container-border-radius)}@supports (corner-shape: squircle){.kbq-multiple-file-upload .kbq-file-upload{corner-shape:squircle;border-radius:clamp(var(--kbq-file-upload-size-multiple-big-container-border-radius) * 1.85,var(--kbq-file-upload-size-multiple-big-container-border-radius) * 2.3 - 3.6px,var(--kbq-file-upload-size-multiple-big-container-border-radius) * 2)}}.kbq-multiple-file-upload .kbq-file-upload{border-width:var(--kbq-file-upload-size-multiple-big-container-border-width);border-style:dashed}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-selected).kbq-file-upload_default{justify-content:center;min-height:var(--kbq-file-upload-size-multiple-big-container-min-height);min-width:var(--kbq-file-upload-size-multiple-big-container-min-width)}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-selected).kbq-file-upload_default .kbq-multiple-file-upload__empty-state{--kbq-empty-state-size-normal-padding-top: 0;--kbq-empty-state-size-normal-padding-bottom: 0;--kbq-empty-state-size-normal-image-addon-height: 4px;--kbq-empty-state-size-normal-padding-horizontal: 23px}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-selected).kbq-file-upload_compact{padding:var(--kbq-file-upload-multiple-compact-container-padding-vertical) var(--kbq-file-upload-multiple-compact-container-padding-horizontal)}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__dropzone-icon>svg{vertical-align:bottom}.kbq-multiple-file-upload .kbq-file-upload .kbq-multiple-file-upload__empty-state{--kbq-empty-state-size-normal-image-margin-bottom: var(--kbq-size-m);--kbq-empty-state-size-normal-title-margin-bottom: var(--kbq-size-xs)}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__list-viewport{box-sizing:content-box;min-height:var(--kbq-file-upload-size-multiple-min-height);max-height:var(--kbq-file-upload-size-multiple-max-height);padding-top:calc(var(--kbq-size-xxs) - var(--kbq-size-border-width));padding-bottom:var(--kbq-size-xxl)}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__row{display:flex;align-items:center;flex:1;min-width:0}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__row .kbq-file-upload__grid-cell{padding:0 var(--kbq-file-upload-size-multiple-big-grid-cell-padding-horizontal)}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__row .kbq-file-upload__file{display:flex;align-items:center;flex-grow:1;gap:var(--kbq-file-upload-size-multiple-big-grid-cell-content-gap-horizontal);padding-left:var(--kbq-size-m);min-width:0}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__row .kbq-file-upload__file .kbq-file-item__text{flex:1 1 auto}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__row .kbq-file-upload__size{box-sizing:content-box;width:var(--kbq-file-upload-size-multiple-big-grid-cell-file-size-width);min-width:var(--kbq-file-upload-size-multiple-big-grid-cell-file-size-width);max-width:var(--kbq-file-upload-size-multiple-big-grid-cell-file-size-width);flex:none;text-align:left}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__row .kbq-file-upload__action{padding:var(--kbq-size-m)}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__list-footer{margin:-1px;padding:var(--kbq-size-m) var(--kbq-size-l);border-top-width:var(--kbq-file-upload-size-multiple-big-container-border-width);border-top-style:dashed}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__wrapper{width:100%;height:100%}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__item{border-radius:0;border:0;padding:0 calc(var(--kbq-size-xxs) - var(--kbq-size-border-width))}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__item .kbq-file-upload__row{border-radius:var(--kbq-size-xs)}@supports (corner-shape: squircle){.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__item .kbq-file-upload__row{corner-shape:squircle;border-radius:clamp(var(--kbq-size-xs) * 1.85,var(--kbq-size-xs) * 2.3 - 3.6px,var(--kbq-size-xs) * 2)}}.kbq-multiple-file-upload .kbq-file-upload{background-color:var(--kbq-file-upload-multiple-default-container-background);border-color:var(--kbq-file-upload-multiple-default-container-border)!important}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled,.kbq-error) .kbq-file-upload__dropzone-icon{color:var(--kbq-file-upload-multiple-default-dropzone-icon-color)}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled,.kbq-error) .kbq-multiple-file-upload__empty-state{--kbq-empty-state-title-color: var(--kbq-file-upload-multiple-default-text-block-color);--kbq-empty-state-text-color: var(--kbq-file-upload-multiple-default-text-block-color)}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled,.kbq-error) .kbq-multiple-file-upload__empty-state-upload-icon{color:var(--kbq-file-upload-multiple-default-upload-icon-color)}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled,.kbq-error) .kbq-file-upload__dropzone-caption{color:var(--kbq-file-upload-multiple-default-text-block-color)}.kbq-multiple-file-upload .kbq-file-upload.kbq-file-drop_dragover{background-color:var(--kbq-file-upload-multiple-states-on-drag-container-background);border-color:var(--kbq-file-upload-multiple-states-on-drag-container-border)!important}.kbq-multiple-file-upload .kbq-file-upload.kbq-file-drop_dragover .kbq-file-upload__dropzone-icon{color:var(--kbq-file-upload-multiple-states-on-drag-dropzone-icon-color)}.kbq-multiple-file-upload .kbq-file-upload.kbq-file-drop_dragover .kbq-file-upload__list-footer{border-top-color:var(--kbq-file-upload-multiple-states-on-drag-container-border)}.kbq-multiple-file-upload .kbq-file-upload.kbq-file-drop_dragover .kbq-multiple-file-upload__empty-state-upload-icon{color:var(--kbq-file-upload-multiple-states-on-drag-upload-icon-color)}.kbq-multiple-file-upload .kbq-file-upload.kbq-disabled{background-color:var(--kbq-file-upload-multiple-states-disabled-container-background);border-color:var(--kbq-file-upload-multiple-states-disabled-container-border)!important}.kbq-multiple-file-upload .kbq-file-upload.kbq-disabled .kbq-file-upload__dropzone-icon{color:var(--kbq-file-upload-multiple-states-disabled-dropzone-icon-color)}.kbq-multiple-file-upload .kbq-file-upload.kbq-disabled .kbq-file-upload__list-footer{border-top-color:var(--kbq-file-upload-multiple-states-disabled-container-border)}.kbq-multiple-file-upload .kbq-file-upload.kbq-disabled .kbq-multiple-file-upload__empty-state-upload-icon{color:var(--kbq-file-upload-multiple-states-disabled-upload-icon-color)}.kbq-multiple-file-upload .kbq-file-upload.kbq-disabled .kbq-multiple-file-upload__empty-state{--kbq-empty-state-title-color: var(--kbq-file-upload-multiple-states-disabled-text-block-color);--kbq-empty-state-text-color: var(--kbq-file-upload-multiple-states-disabled-text-block-color)}.kbq-multiple-file-upload .kbq-file-upload.kbq-disabled .kbq-file-upload__dropzone-caption{color:var(--kbq-file-upload-multiple-states-disabled-text-block-color)}.kbq-multiple-file-upload .kbq-file-upload.kbq-disabled .kbq-file-upload__item .kbq-file-upload__file .kbq-icon.kbq-empty{color:var(--kbq-file-upload-multiple-states-disabled-left-icon-color)}.kbq-multiple-file-upload .kbq-file-upload.kbq-disabled .kbq-file-upload__item .kbq-file-item__text,.kbq-multiple-file-upload .kbq-file-upload.kbq-disabled .kbq-file-upload__item .kbq-file-upload__size{color:var(--kbq-file-upload-multiple-states-disabled-text-block-color)}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled).kbq-error{background-color:var(--kbq-file-upload-multiple-states-error-container-background);border-color:var(--kbq-file-upload-multiple-states-error-container-border)!important}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled).kbq-error .kbq-file-upload__dropzone-icon{color:var(--kbq-file-upload-multiple-states-error-dropzone-icon-color)}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled).kbq-error .kbq-multiple-file-upload__empty-state-upload-icon{color:var(--kbq-file-upload-multiple-states-error-upload-icon-color)}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled).kbq-error .kbq-file-upload__dropzone-caption{color:var(--kbq-file-upload-multiple-states-error-text-block-color)}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled).kbq-error .kbq-multiple-file-upload__empty-state{--kbq-file-upload-multiple-states-error-text-block-color: var( --kbq-file-upload-multiple-default-text-block-color );--kbq-empty-state-title-color: var(--kbq-file-upload-multiple-states-error-text-block-color);--kbq-empty-state-text-color: var(--kbq-file-upload-multiple-states-error-text-block-color)}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled).kbq-error .kbq-file-upload__list-footer{border-top-color:var(--kbq-file-upload-multiple-states-error-container-border)}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled) .kbq-file-upload__item:has(.kbq-file-upload__row.kbq-error):hover .kbq-file-upload__row,.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled) .kbq-file-upload__item:has(.kbq-file-upload__row.kbq-error).kbq-hovered .kbq-file-upload__row{background-color:var(--kbq-states-background-error-less-hover)}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled) .kbq-file-upload__item:has(.kbq-file-upload__row.kbq-error) .kbq-file-item__text,.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled) .kbq-file-upload__item:has(.kbq-file-upload__row.kbq-error) .kbq-file-upload__size{color:var(--kbq-file-upload-multiple-states-error-text-block-color)}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled) .kbq-file-upload__item:has(.kbq-file-upload__row.kbq-error) .kbq-file-upload__file .kbq-icon.kbq-empty{color:var(--kbq-file-upload-multiple-states-error-left-icon-color)}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled) .kbq-file-upload__item:has(.kbq-file-upload__row.kbq-error) .kbq-file-upload__action.kbq-icon.kbq-empty{color:var(--kbq-file-upload-multiple-states-error-icon-button-color)}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled) .kbq-file-upload__item:not(:has(.kbq-file-upload__row.kbq-error)):hover .kbq-file-upload__row,.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled) .kbq-file-upload__item:not(:has(.kbq-file-upload__row.kbq-error)).kbq-hovered .kbq-file-upload__row{--kbq-option-background: var(--kbq-list-states-hover-container-background);background:var(--kbq-list-states-hover-container-background)}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled) .kbq-file-upload__item:not(:has(.kbq-file-upload__row.kbq-error)).kbq-disabled .kbq-file-upload__row{--kbq-option-background: var(--kbq-list-states-disabled-container-background);background:var(--kbq-list-states-disabled-container-background)}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__list-footer{border-top-color:var(--kbq-file-upload-multiple-default-container-border)}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__item .kbq-file-upload__file .kbq-icon.kbq-empty{color:var(--kbq-file-upload-multiple-default-left-icon-color)}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__item .kbq-file-upload__size{color:var(--kbq-file-upload-multiple-default-file-size-text-color)}\n"], dependencies: [{ kind: "directive", type: CdkMonitorFocus, selector: "[cdkMonitorElementFocus], [cdkMonitorSubtreeFocus]", outputs: ["cdkFocusChange"], exportAs: ["cdkMonitorFocus"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: KbqFileDropDirective, selector: "[kbqFileDrop]", exportAs: ["kbqFileDrop"] }, { kind: "component", type: KbqIconButton, selector: "[kbq-icon-button]", inputs: ["size", "kbq-icon-button", "tabindex", "disabled"] }, { kind: "component", type: KbqIcon, selector: "[kbq-icon]", inputs: ["aria-hidden", "iconSize", "autoColor", "kbq-icon"] }, { kind: "component", type: KbqLink, selector: "[kbqLink]", inputs: ["disabled", "tabIndex", "pseudo", "external", "underline", "size", "useVisited", "print"], exportAs: ["kbqLink"] }, { kind: "ngmodule", type: KbqListModule }, { kind: "component", type: i3.KbqList, selector: "kbq-list" }, { kind: "component", type: i3.KbqListItem, selector: "kbq-list-item, a[kbq-list-item]" }, { kind: "ngmodule", type: KbqProgressSpinnerModule }, { kind: "component", type: i4.KbqProgressSpinner, selector: "kbq-progress-spinner", inputs: ["id", "value", "mode", "size"] }, { kind: "component", type: KbqScrollbar, selector: "kbq-scrollbar", inputs: ["kbqScrollbarMode", "kbqScrollbarHideDelay"], exportAs: ["kbqScrollbar"] }, { kind: "directive", type: KbqEllipsisCenterDirective, selector: "[kbqEllipsisCenter]", inputs: ["ignoreTooltipPointerEvents", "minVisibleLength", "charWidth", "debounceInterval", "kbqEllipsisCenter"] }, { kind: "component", type: KbqFileLoader, selector: "[kbqFileLoader]", inputs: ["disabled", "multiple", "accept", "for", "onlyDirectory", "describedBy", "invalid"], outputs: ["fileChange"], exportAs: ["kbqFileLoader"] }, { kind: "component", type: KbqFileUploadEmptyState, selector: "kbq-file-upload-empty-state", inputs: ["title", "caption", "size"] }, { kind: "pipe", type: KbqDataSizePipe, name: "kbqDataSize" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
1027
1227
|
}
|
|
1028
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1228
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KbqMultipleFileUploadComponent, decorators: [{
|
|
1029
1229
|
type: Component,
|
|
1030
1230
|
args: [{ selector: 'kbq-multiple-file-upload,kbq-file-upload[multiple]', imports: [
|
|
1031
|
-
|
|
1231
|
+
CdkMonitorFocus,
|
|
1032
1232
|
NgTemplateOutlet,
|
|
1033
1233
|
KbqFileDropDirective,
|
|
1034
1234
|
KbqIconButton,
|
|
@@ -1037,37 +1237,42 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.30", ngImpo
|
|
|
1037
1237
|
KbqListModule,
|
|
1038
1238
|
KbqDataSizePipe,
|
|
1039
1239
|
KbqProgressSpinnerModule,
|
|
1240
|
+
KbqScrollbar,
|
|
1040
1241
|
KbqEllipsisCenterDirective,
|
|
1041
1242
|
KbqFileLoader,
|
|
1042
1243
|
KbqFileUploadEmptyState
|
|
1043
1244
|
], providers: [KbqFullScreenDropzoneService], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
|
|
1044
|
-
class: 'kbq-multiple-file-upload'
|
|
1245
|
+
class: 'kbq-multiple-file-upload',
|
|
1246
|
+
'(focusout)': 'onFocusOut($event)'
|
|
1045
1247
|
}, hostDirectives: [
|
|
1248
|
+
{ directive: KbqLocaleOverridesDirective, inputs: ['kbqLocaleOverrides: localeOverrides'] },
|
|
1046
1249
|
{
|
|
1047
1250
|
directive: KbqFileUploadContext,
|
|
1048
1251
|
inputs: ['id', 'disabled']
|
|
1049
1252
|
},
|
|
1050
1253
|
{ directive: KbqFileList, outputs: ['itemsAdded', 'itemRemoved'] }
|
|
1051
|
-
], template: "<div\n kbqFileDrop\n class=\"kbq-file-upload\"\n [class.kbq-disabled]=\"disabled\"\n [class.kbq-error]=\"invalid\"\n [class.kbq-selected]=\"files.length\"\n [class.kbq-file-upload_default]=\"size() === 'default'\"\n [class.kbq-file-upload_compact]=\"size() === 'compact'\"\n [disabled]=\"!!fullScreenDropZone()\"\n (filesDropped)=\"onFileDropped($event)\"\n>\n @let localeData = resolvedLocaleConfig();\n @if (!files.length) {\n @if (size() === 'default') {\n <kbq-file-upload-empty-state [size]=\"'normal'\" [title]=\"localeData.title\" [caption]=\"captionText\" />\n } @else {\n <div class=\"kbq-file-dropzone\">\n <i kbq-icon=\"kbq-arrow-up-from-bracket_16\" class=\"kbq-file-upload__dropzone-icon\"></i>\n <span class=\"kbq-file-upload__dropzone-caption\">\n <ng-container *ngTemplateOutlet=\"captionText\" />\n </span>\n </div>\n }\n } @else {\n <div class=\"kbq-file-upload__wrapper\">\n <kbq-list class=\"kbq-file-upload__list kbq-scrollbar\" role=\"list\">\n @for (file of files; track file) {\n <kbq-list-item\n role=\"listitem\"\n class=\"kbq-file-upload__item\"\n [class.kbq-disabled]=\"disabled\"\n (keydown.backspace)=\"deleteFile($index)\"\n (keydown.delete)=\"deleteFile($index)\"\n >\n <div class=\"kbq-file-upload__row\" [class.kbq-error]=\"file.hasError\">\n <div class=\"kbq-file-upload__file kbq-file-upload__grid-cell\">\n @if ({ loading: file.loading | async, progress: file.progress | async }; as asyncData) {\n @if (!asyncData.loading) {\n <ng-container\n [ngTemplateOutlet]=\"$any(customFileIcon())\"\n [ngTemplateOutletContext]=\"{ $implicit: file }\"\n />\n } @else {\n <kbq-progress-spinner\n class=\"kbq-file-upload-name-cell__icon\"\n [mode]=\"progressMode()\"\n [value]=\"asyncData.progress || 0\"\n />\n }\n }\n <span\n class=\"kbq-file-item__text\"\n [minVisibleLength]=\"10\"\n [kbqTooltipDisabled]=\"disabled\"\n [kbqEllipsisCenter]=\"file.file.name\"\n ></span>\n </div>\n <div class=\"kbq-file-upload__size kbq-file-upload__grid-cell\">\n {{ file.file.size | kbqDataSize }}\n </div>\n <i\n kbq-icon-button=\"kbq-circle-xmark_16\"\n class=\"kbq-file-upload__action kbq-file-upload__grid-cell\"\n [color]=\"file.hasError ? 'error' : 'contrast-fade'\"\n [disabled]=\"disabled\"\n (click)=\"deleteFile($index, $event, 'program')\"\n ></i>\n </div>\n </kbq-list-item>\n }\n </kbq-list>\n <div class=\"kbq-file-upload__list-footer kbq-file-dropzone\">\n <i kbq-icon=\"kbq-arrow-up-from-bracket_16\" class=\"kbq-file-upload__dropzone-icon\"></i>\n <span class=\"kbq-file-upload__dropzone-caption\">\n <ng-container *ngTemplateOutlet=\"captionText\" />\n </span>\n </div>\n </div>\n }\n</div>\n\n@if (hasHint) {\n <div class=\"kbq-file-upload__hint\">\n <ng-content select=\"kbq-hint\" />\n </div>\n}\n\n<ng-template #captionText>\n @let context = captionContext();\n @if (files.length) {\n {{ captionTextWhenSelected }}\n } @else if (context.captionText) {\n {{ context.captionText }}\n }\n @if (context.browseLink) {\n <label\n kbq-link\n pseudo\n kbqFileLoader\n [onlyDirectory]=\"null\"\n [accept]=\"acceptedFiles\"\n [disabled]=\"disabled\"\n [for]=\"fileUploadContext.id() || inputId()\"\n [tabIndex]=\"-1\"\n [multiple]=\"true\"\n (fileChange)=\"onFileSelectedViaClick($event)\"\n >\n {{ context.browseLink }}\n </label>\n }\n @if (context.captionTextSeparator) {\n {{ context.captionTextSeparator }}\n }\n @if (context.browseLinkFolder) {\n <label\n kbq-link\n pseudo\n kbqFileLoader\n [onlyDirectory]=\"true\"\n [disabled]=\"disabled\"\n [tabIndex]=\"-1\"\n (fileChange)=\"onFileSelectedViaClick($event)\"\n >\n {{ context.browseLinkFolder }}\n </label>\n }\n</ng-template>\n", styles: [".kbq-form-field{--kbq-form-field-label-margin-bottom: var(--kbq-size-xs);position:relative;display:inline-block;width:100%}.kbq-form-field.kbq-form-field_horizontal{display:flex;flex-direction:row;align-items:flex-start}.kbq-form-field.kbq-form-field_horizontal .kbq-form-field__label{--kbq-form-field-label-margin-bottom: 0;padding:var(--kbq-size-xs) var(--kbq-size-l) 0 0}.kbq-form-field .kbq-form-field__content{flex:1}.kbq-form-field .kbq-form-field__label{box-sizing:border-box;display:flex;margin-bottom:var(--kbq-form-field-label-margin-bottom)}.kbq-form-field.kbq-form-field-type-select .kbq-form-field__suffix{margin-right:0}.kbq-form-field .kbq-form-field__container{box-sizing:border-box;display:flex;justify-content:space-between;align-items:center;border-width:var(--kbq-form-field-size-border-width);border-style:solid;border-color:transparent;border-radius:var(--kbq-form-field-size-border-radius);padding-left:var(--kbq-form-field-size-container-left-padding);padding-right:var(--kbq-form-field-size-container-right-padding)}.kbq-form-field .kbq-form-field__container:has(.kbq-textarea){--kbq-form-field-size-container-left-padding: 0;--kbq-form-field-size-container-right-padding: 0}.kbq-form-field .kbq-form-field:not(.kbq-form-field-type-textarea){height:var(--kbq-form-field-size-height)}.kbq-form-field .kbq-form-field__infix{box-sizing:border-box;width:100%;flex-grow:1;padding-left:var(--kbq-form-field-size-infix-left-padding)}.kbq-form-field .kbq-form-field__infix:has(.kbq-select_multiple,.kbq-select_multiline):not(:has(.kbq-select__trigger_empty)),.kbq-form-field .kbq-form-field__infix:has(.kbq-tag-list),.kbq-form-field .kbq-form-field__infix:has(.kbq-textarea){padding-left:0;max-width:100%}.kbq-form-field .kbq-form-field__infix:has(.kbq-select_multiple,.kbq-select_multiline):has(kbq-select-trigger,[kbq-select-trigger]){padding-left:var(--kbq-form-field-size-infix-left-padding)}.kbq-form-field .kbq-form-field__infix .kbq-input,.kbq-form-field .kbq-form-field__infix .kbq-tag-input{padding-right:var(--kbq-form-field-size-infix-right-padding)}.kbq-form-field,.kbq-form-field .kbq-textarea{border-radius:var(--kbq-form-field-size-border-radius)}.kbq-form-field:hover{z-index:1}.kbq-form-field.cdk-focused,.kbq-form-field.kbq-focused{z-index:3}.kbq-form-field.kbq-form-field_without-borders .kbq-form-field__container,.kbq-form-field.kbq-form-field_no-borders .kbq-form-field__container{border-color:transparent!important;box-shadow:none!important}.kbq-form-field.kbq-form-field_in-overlay .kbq-form-field__container{background-color:var(--kbq-background-card)!important}.kbq-form-field+.kbq-password-hint{margin-top:var(--kbq-size-m)}.kbq-form-field .kbq-form-field__prefix,.kbq-form-field .kbq-form-field__suffix{display:flex;justify-content:center;align-items:center}.kbq-form-field .kbq-form-field__prefix .kbq-prefix,.kbq-form-field .kbq-form-field__prefix .kbq-suffix,.kbq-form-field .kbq-form-field__suffix .kbq-prefix,.kbq-form-field .kbq-form-field__suffix .kbq-suffix{min-width:var(--kbq-form-field-size-addon-width);text-align:center}.kbq-form-field .kbq-form-field__prefix+.kbq-form-field__infix{padding-left:0}.kbq-form-field .kbq-form-field__hint{display:flex;flex-direction:column;gap:var(--kbq-form-field-hint-size-gap);margin-top:var(--kbq-form-field-hint-size-margin-top)}.kbq-form-field .kbq-form-field__hint:has(.kbq-reactive-password-hint,.kbq-password-hint){--kbq-form-field-hint-size-gap: var(--kbq-size-s)}.kbq-form-field .kbq-form-field__hint:has(:is(.kbq-reactive-password-hint,.kbq-password-hint):first-child){--kbq-form-field-hint-size-margin-top: var(--kbq-size-m)}.kbq-form-field .kbq-form-field__container{border-color:var(--kbq-form-field-default-border-color);background-color:var(--kbq-form-field-default-background)}.kbq-form-field .kbq-input,.kbq-form-field .kbq-tag-input,.kbq-form-field .kbq-textarea{--kbq-form-field-resolved-text: var(--kbq-form-field-default-text);color:var(--kbq-form-field-resolved-text)}.kbq-form-field .kbq-input::placeholder,.kbq-form-field .kbq-tag-input::placeholder,.kbq-form-field .kbq-textarea::placeholder{color:var(--kbq-form-field-default-placeholder)}.kbq-form-field .kbq-input::-ms-input-placeholder,.kbq-form-field .kbq-tag-input::-ms-input-placeholder,.kbq-form-field .kbq-textarea::-ms-input-placeholder{color:var(--kbq-form-field-default-placeholder)}.kbq-form-field .kbq-input::-webkit-input-placeholder,.kbq-form-field .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field .kbq-textarea::-webkit-input-placeholder{color:var(--kbq-form-field-default-placeholder)}.kbq-form-field .kbq-input:is(:autofill,:-webkit-autofill),.kbq-form-field .kbq-tag-input:is(:autofill,:-webkit-autofill),.kbq-form-field .kbq-textarea:is(:autofill,:-webkit-autofill){transition-property:background-color;transition-duration:600000s;-webkit-text-fill-color:var(--kbq-form-field-resolved-text, var(--kbq-form-field-default-text));caret-color:var(--kbq-form-field-resolved-text, var(--kbq-form-field-default-text))}.kbq-form-field.kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field_has-validate-directive.ng-invalid .kbq-form-field__container{border-color:var(--kbq-form-field-states-error-border-color);background-color:var(--kbq-form-field-states-error-background)}.kbq-form-field.kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field_has-validate-directive.ng-invalid .kbq-input,.kbq-form-field.kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input,.kbq-form-field.kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea{--kbq-form-field-resolved-text: var(--kbq-form-field-states-error-text);color:var(--kbq-form-field-resolved-text)}.kbq-form-field.kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field_has-validate-directive.ng-invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::placeholder{color:var(--kbq-form-field-states-error-placeholder)}.kbq-form-field.kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-ms-input-placeholder{color:var(--kbq-form-field-states-error-placeholder)}.kbq-form-field.kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-webkit-input-placeholder{color:var(--kbq-form-field-states-error-placeholder)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container{border-color:var(--kbq-form-field-states-focused-border-color);background-color:var(--kbq-form-field-states-focused-background)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea{--kbq-form-field-resolved-text: var(--kbq-form-field-states-focused-text);color:var(--kbq-form-field-resolved-text)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder{color:var(--kbq-form-field-states-focused-placeholder)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder{color:var(--kbq-form-field-states-focused-placeholder)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder{color:var(--kbq-form-field-states-focused-placeholder)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container{box-shadow:inset 0 0 .1px var(--kbq-form-field-size-focus-outline-width) var(--kbq-form-field-states-focused-focus-outline)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-form-field__container{border-color:var(--kbq-form-field-states-error-border-color);background-color:var(--kbq-form-field-states-error-background)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea{--kbq-form-field-resolved-text: var(--kbq-form-field-states-error-text);color:var(--kbq-form-field-resolved-text)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::placeholder{color:var(--kbq-form-field-states-error-placeholder)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-ms-input-placeholder{color:var(--kbq-form-field-states-error-placeholder)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-webkit-input-placeholder{color:var(--kbq-form-field-states-error-placeholder)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid.cdk-focused .kbq-form-field__container{box-shadow:inset 0 0 .1px var(--kbq-form-field-size-focus-outline-width) var(--kbq-form-field-states-error-focused-focus-outline)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-icon.kbq-empty{color:var(--kbq-form-field-states-error-text);-webkit-text-fill-color:var(--kbq-form-field-states-error-text)}.kbq-form-field .kbq-form-field__label{color:var(--kbq-form-field-label-color)}.kbq-form-field .kbq-form-field__container:has(:is(.kbq-input,.kbq-tag-input,.kbq-textarea):is(:autofill,:-webkit-autofill)){background-image:linear-gradient(var(--kbq-form-field-states-autofill-background),var(--kbq-form-field-states-autofill-background))}.kbq-form-field.kbq-disabled .kbq-form-field__container{border-color:var(--kbq-form-field-states-disabled-border-color);background-color:var(--kbq-form-field-states-disabled-background)}.kbq-form-field.kbq-disabled .kbq-input,.kbq-form-field.kbq-disabled .kbq-tag-input,.kbq-form-field.kbq-disabled .kbq-textarea{--kbq-form-field-resolved-text: var(--kbq-form-field-states-disabled-text);color:var(--kbq-form-field-resolved-text)}.kbq-form-field.kbq-disabled .kbq-input::placeholder,.kbq-form-field.kbq-disabled .kbq-tag-input::placeholder,.kbq-form-field.kbq-disabled .kbq-textarea::placeholder{color:var(--kbq-form-field-states-disabled-placeholder)}.kbq-form-field.kbq-disabled .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-disabled .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-disabled .kbq-textarea::-ms-input-placeholder{color:var(--kbq-form-field-states-disabled-placeholder)}.kbq-form-field.kbq-disabled .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-disabled .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-disabled .kbq-textarea::-webkit-input-placeholder{color:var(--kbq-form-field-states-disabled-placeholder)}.kbq-form-field.kbq-disabled .kbq-icon.kbq-empty{color:var(--kbq-form-field-states-disabled-text);-webkit-text-fill-color:var(--kbq-form-field-states-disabled-text)}.kbq-form-field .kbq-form-field__prefix .kbq-icon.kbq-empty,.kbq-form-field .kbq-form-field__suffix .kbq-icon.kbq-empty{color:var(--kbq-icon-contrast-fade)}.kbq-form-field .kbq-form-field__hint>.kbq-hint:not(.kbq-password-hint,.kbq-contrast-fade,.kbq-success,.kbq-warning,.kbq-error){color:var(--kbq-form-field-hint-text)}.kbq-form-field{font-size:var(--kbq-typography-text-normal-font-size);font-style:var(--kbq-typography-text-normal-font-style);font-weight:var(--kbq-typography-text-normal-font-weight);line-height:var(--kbq-typography-text-normal-line-height);font-family:var(--kbq-typography-text-normal-font-family);text-transform:var(--kbq-typography-text-normal-text-transform);font-feature-settings:var(--kbq-typography-text-normal-font-feature-settings);letter-spacing:var(--kbq-typography-text-normal-letter-spacing)}.kbq-form-field .kbq-form-field__hint>.kbq-hint:not(.kbq-password-hint,.kbq-reactive-password-hint,.kbq-contrast-fade,.kbq-success,.kbq-warning) .kbq-hint__text{font-size:var(--kbq-typography-text-compact-font-size);font-style:var(--kbq-typography-text-compact-font-style);font-weight:var(--kbq-typography-text-compact-font-weight);line-height:var(--kbq-typography-text-compact-line-height);font-family:var(--kbq-typography-text-compact-font-family);text-transform:var(--kbq-typography-text-compact-text-transform);font-feature-settings:var(--kbq-typography-text-compact-font-feature-settings);letter-spacing:var(--kbq-typography-text-compact-letter-spacing)}.kbq-file-upload{box-sizing:border-box;display:flex;align-items:center;position:relative}.kbq-file-upload .kbq-file-item{display:flex;align-items:center}.kbq-file-upload .kbq-file-dropzone{display:flex;align-items:baseline;gap:var(--dropzone-gap, var(--kbq-file-upload-size-dropzone-content-gap-horizontal))}.kbq-file-upload__hint{display:flex;flex-direction:column;gap:var(--kbq-form-field-hint-size-gap);margin-top:var(--kbq-form-field-hint-size-margin-top)}.kbq-file-upload__hint:has(.kbq-reactive-password-hint,.kbq-password-hint){--kbq-form-field-hint-size-gap: var(--kbq-size-s)}.kbq-file-upload__hint:has(:is(.kbq-reactive-password-hint,.kbq-password-hint):first-child){--kbq-form-field-hint-size-margin-top: var(--kbq-size-m)}:where(.kbq-file-upload__hint .kbq-hint){color:var(--kbq-foreground-contrast-secondary)}.kbq-file-upload{font-size:var(--kbq-typography-text-normal-font-size);font-style:var(--kbq-typography-text-normal-font-style);font-weight:var(--kbq-typography-text-normal-font-weight);line-height:var(--kbq-typography-text-normal-line-height);font-family:var(--kbq-typography-text-normal-font-family);text-transform:var(--kbq-typography-text-normal-text-transform);font-feature-settings:var(--kbq-typography-text-normal-font-feature-settings);letter-spacing:var(--kbq-typography-text-normal-letter-spacing)}.kbq-file-upload__hint .kbq-hint .kbq-hint__text{font-size:var(--kbq-typography-text-compact-font-size);font-style:var(--kbq-typography-text-compact-font-style);font-weight:var(--kbq-typography-text-compact-font-weight);line-height:var(--kbq-typography-text-compact-line-height);font-family:var(--kbq-typography-text-compact-font-family);text-transform:var(--kbq-typography-text-compact-text-transform);font-feature-settings:var(--kbq-typography-text-compact-font-feature-settings);letter-spacing:var(--kbq-typography-text-compact-letter-spacing)}\n", ":where(.kbq-file-upload){--kbq-file-upload-size-dropzone-content-gap-horizontal: var(--kbq-size-s);--kbq-form-field-hint-text: var(--kbq-foreground-contrast-secondary)}:where(.kbq-single-file-upload){--kbq-form-field-hint-size-margin-top: var(--kbq-size-xs);--kbq-form-field-hint-size-gap: var(--kbq-size-xxs);--kbq-file-upload-size-single-container-border-radius: var(--kbq-size-s);--kbq-file-upload-size-single-container-border-width: 1px;--kbq-file-upload-size-single-container-content-gap-horizontal: var(--kbq-size-s);--kbq-file-upload-size-single-container-padding-vertical: var(--kbq-size-m);--kbq-file-upload-size-single-container-padding-horizontal: var(--kbq-size-l);--kbq-file-upload-size-single-text-block-padding-vertical: var(--kbq-size-3xs);--kbq-file-upload-size-single-text-block-content-gap-horizontal: var(--kbq-size-xxs);--kbq-file-upload-single-min-height: 44px;--kbq-file-upload-single-default-container-border: var(--kbq-line-contrast-fade);--kbq-file-upload-single-default-container-background: var(--kbq-background-bg);--kbq-file-upload-single-default-dropzone-icon-color: var(--kbq-icon-contrast-fade);--kbq-file-upload-single-default-left-icon-color: var(--kbq-icon-contrast-fade);--kbq-file-upload-single-default-text-block-color: var(--kbq-foreground-contrast);--kbq-file-upload-single-default-file-size-text-color: var(--kbq-foreground-contrast-secondary);--kbq-file-upload-single-states-on-drag-container-border: var(--kbq-line-theme-fade);--kbq-file-upload-single-states-on-drag-container-background: var(--kbq-background-theme-fade);--kbq-file-upload-single-states-on-drag-dropzone-icon-color: var(--kbq-icon-contrast-fade);--kbq-file-upload-single-states-on-drag-left-icon-color: var(--kbq-icon-contrast-fade);--kbq-file-upload-single-states-on-drag-text-block-color: var(--kbq-foreground-contrast);--kbq-file-upload-single-states-error-container-border: var(--kbq-line-error);--kbq-file-upload-single-states-error-container-background: var(--kbq-background-error-less);--kbq-file-upload-single-states-error-dropzone-icon-color: var(--kbq-icon-error);--kbq-file-upload-single-states-error-left-icon-color: var(--kbq-icon-error);--kbq-file-upload-single-states-error-text-block-color: var(--kbq-foreground-error);--kbq-file-upload-single-states-error-file-size-text-color: var(--kbq-foreground-error);--kbq-file-upload-single-states-disabled-container-border: var(--kbq-states-line-disabled);--kbq-file-upload-single-states-disabled-container-background: var(--kbq-states-background-disabled);--kbq-file-upload-single-states-disabled-dropzone-icon-color: var(--kbq-states-icon-disabled);--kbq-file-upload-single-states-disabled-left-icon-color: var(--kbq-states-icon-disabled);--kbq-file-upload-single-states-disabled-text-block-color: var(--kbq-states-foreground-disabled);--kbq-file-upload-single-states-disabled-file-size-text-color: var(--kbq-states-foreground-disabled);--kbq-file-upload-single-states-focused-focus-outline-color: var(--kbq-states-line-focus-theme)}:where(.kbq-multiple-file-upload){--kbq-form-field-hint-size-margin-top: var(--kbq-size-xs);--kbq-form-field-hint-size-gap: var(--kbq-size-xxs);--kbq-file-upload-size-multiple-min-height: 120px;--kbq-file-upload-size-multiple-max-height: unset;--kbq-file-upload-size-multiple-big-container-min-height: 192px;--kbq-file-upload-size-multiple-big-container-min-width: 320px;--kbq-file-upload-size-multiple-big-container-border-radius: var(--kbq-size-s);--kbq-file-upload-size-multiple-big-container-border-width: 1px;--kbq-file-upload-size-multiple-big-container-content-gap-horizontal: var(--kbq-size-m);--kbq-file-upload-size-multiple-big-container-padding-vertical: var(--kbq-size-xxl);--kbq-file-upload-size-multiple-big-container-padding-horizontal: var(--kbq-size-xxl);--kbq-file-upload-size-multiple-big-dropzone-content-gap-horizontal: var(--kbq-size-s);--kbq-file-upload-size-multiple-big-text-block-content-gap-vertical: 0px;--kbq-file-upload-size-multiple-big-text-block-content-gap-horizontal: var(--kbq-size-xxs);--kbq-file-upload-size-multiple-big-grid-cell-padding-horizontal: var(--kbq-size-s);--kbq-file-upload-size-multiple-big-grid-cell-padding-vertical: var(--kbq-size-s);--kbq-file-upload-size-multiple-big-grid-cell-content-gap-horizontal: var(--kbq-size-s);--kbq-file-upload-size-multiple-big-grid-cell-file-size-width: var(--kbq-size-7xl);--kbq-file-upload-multiple-default-container-border: var(--kbq-line-contrast-fade);--kbq-file-upload-multiple-default-container-background: var(--kbq-background-bg);--kbq-file-upload-multiple-default-upload-icon-color: var(--kbq-icon-contrast);--kbq-file-upload-multiple-default-dropzone-icon-color: var(--kbq-icon-contrast-fade);--kbq-file-upload-multiple-default-left-icon-color: var(--kbq-icon-contrast-fade);--kbq-file-upload-multiple-default-text-block-color: var(--kbq-foreground-contrast);--kbq-file-upload-multiple-default-grid-divider-color: var(--kbq-line-contrast-less);--kbq-file-upload-multiple-default-file-size-text-color: var(--kbq-foreground-contrast-secondary);--kbq-file-upload-multiple-states-on-drag-container-border: var(--kbq-line-theme-fade);--kbq-file-upload-multiple-states-on-drag-container-background: var(--kbq-background-theme-fade);--kbq-file-upload-multiple-states-on-drag-upload-icon-color: var(--kbq-icon-contrast);--kbq-file-upload-multiple-states-on-drag-dropzone-icon-color: var(--kbq-icon-contrast-fade);--kbq-file-upload-multiple-states-on-drag-left-icon-color: var(--kbq-icon-contrast-fade);--kbq-file-upload-multiple-states-on-drag-text-block-color: var(--kbq-foreground-contrast);--kbq-file-upload-multiple-states-on-drag-grid-divider-color: var(--kbq-line-contrast-less);--kbq-file-upload-multiple-states-error-container-border: var(--kbq-line-error);--kbq-file-upload-multiple-states-error-container-background: var(--kbq-background-error-less);--kbq-file-upload-multiple-states-error-upload-icon-color: var(--kbq-icon-error);--kbq-file-upload-multiple-states-error-dropzone-icon-color: var(--kbq-icon-error);--kbq-file-upload-multiple-states-error-left-icon-color: var(--kbq-icon-error);--kbq-file-upload-multiple-states-error-icon-button-color: var(--kbq-icon-error);--kbq-file-upload-multiple-states-error-text-block-color: var(--kbq-foreground-error);--kbq-file-upload-multiple-states-disabled-container-border: var(--kbq-states-line-disabled);--kbq-file-upload-multiple-states-disabled-container-background: var(--kbq-states-background-disabled);--kbq-file-upload-multiple-states-disabled-upload-icon-color: var(--kbq-states-icon-disabled);--kbq-file-upload-multiple-states-disabled-dropzone-icon-color: var(--kbq-states-icon-disabled);--kbq-file-upload-multiple-states-disabled-left-icon-color: var(--kbq-states-icon-disabled);--kbq-file-upload-multiple-states-disabled-text-block-color: var(--kbq-states-foreground-disabled);--kbq-file-upload-multiple-states-disabled-grid-divider-color: var(--kbq-states-line-disabled);--kbq-file-upload-multiple-states-focused-focus-outline-color: var(--kbq-states-line-focus-theme)}:where(.kbq-file-upload.kbq-file-upload_compact){--kbq-file-upload-multiple-compact-container-content-gap-horizontal: var(--kbq-size-s);--kbq-file-upload-multiple-compact-text-block-padding-vertical: var(--kbq-size-3xs);--kbq-file-upload-multiple-compact-container-padding-vertical: 11px;--kbq-file-upload-multiple-compact-container-padding-horizontal: 15px}\n", ".kbq-multiple-file-upload .kbq-file-upload{border-radius:var(--kbq-file-upload-size-multiple-big-container-border-radius);border-width:var(--kbq-file-upload-size-multiple-big-container-border-width);border-style:dashed}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-selected).kbq-file-upload_default{justify-content:center;min-height:var(--kbq-file-upload-size-multiple-big-container-min-height);min-width:var(--kbq-file-upload-size-multiple-big-container-min-width)}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-selected).kbq-file-upload_default .kbq-multiple-file-upload__empty-state{--kbq-empty-state-size-normal-padding-top: 0;--kbq-empty-state-size-normal-padding-bottom: 0;--kbq-empty-state-size-normal-image-addon-height: 4px;--kbq-empty-state-size-normal-padding-horizontal: 23px}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-selected).kbq-file-upload_compact{padding:var(--kbq-file-upload-multiple-compact-container-padding-vertical) var(--kbq-file-upload-multiple-compact-container-padding-horizontal)}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__dropzone-icon>svg{vertical-align:bottom}.kbq-multiple-file-upload .kbq-file-upload .kbq-multiple-file-upload__empty-state{--kbq-empty-state-size-normal-image-margin-bottom: var(--kbq-size-m);--kbq-empty-state-size-normal-title-margin-bottom: var(--kbq-size-xs)}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__list{box-sizing:content-box;min-height:var(--kbq-file-upload-size-multiple-min-height);max-height:var(--kbq-file-upload-size-multiple-max-height);overflow-y:auto;padding-top:calc(var(--kbq-size-xxs) - var(--kbq-size-border-width));padding-bottom:var(--kbq-size-xxl)}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__row{display:flex;align-items:center;flex:1;min-width:0}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__row .kbq-file-upload__grid-cell{padding:0 var(--kbq-file-upload-size-multiple-big-grid-cell-padding-horizontal)}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__row .kbq-file-upload__file{display:flex;align-items:center;flex-grow:1;gap:var(--kbq-file-upload-size-multiple-big-grid-cell-content-gap-horizontal);padding-left:var(--kbq-size-m);min-width:0}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__row .kbq-file-upload__file .kbq-file-item__text{flex:1 1 auto}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__row .kbq-file-upload__size{box-sizing:content-box;width:var(--kbq-file-upload-size-multiple-big-grid-cell-file-size-width);min-width:var(--kbq-file-upload-size-multiple-big-grid-cell-file-size-width);max-width:var(--kbq-file-upload-size-multiple-big-grid-cell-file-size-width);flex:none;text-align:left}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__row .kbq-file-upload__action{padding:var(--kbq-size-m)}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__list-footer{margin:-1px;padding:var(--kbq-size-m) var(--kbq-size-l);border-top-width:var(--kbq-file-upload-size-multiple-big-container-border-width);border-top-style:dashed}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__wrapper{width:100%;height:100%}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__item{border-radius:0;border:0;padding:0 calc(var(--kbq-size-xxs) - var(--kbq-size-border-width))}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__item .kbq-file-upload__row{border-radius:var(--kbq-size-xs)}.kbq-multiple-file-upload .kbq-file-upload{background-color:var(--kbq-file-upload-multiple-default-container-background);border-color:var(--kbq-file-upload-multiple-default-container-border)!important}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled,.kbq-error) .kbq-file-upload__dropzone-icon{color:var(--kbq-file-upload-multiple-default-dropzone-icon-color)}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled,.kbq-error) .kbq-multiple-file-upload__empty-state{--kbq-empty-state-title: var(--kbq-file-upload-multiple-default-text-block-color);--kbq-empty-state-color: var(--kbq-file-upload-multiple-default-text-block-color)}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled,.kbq-error) .kbq-multiple-file-upload__empty-state-upload-icon{color:var(--kbq-file-upload-multiple-default-upload-icon-color)}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled,.kbq-error) .kbq-file-upload__dropzone-caption{color:var(--kbq-file-upload-multiple-default-text-block-color)}.kbq-multiple-file-upload .kbq-file-upload.kbq-file-drop_dragover{background-color:var(--kbq-file-upload-multiple-states-on-drag-container-background);border-color:var(--kbq-file-upload-multiple-states-on-drag-container-border)!important}.kbq-multiple-file-upload .kbq-file-upload.kbq-file-drop_dragover .kbq-file-upload__dropzone-icon{color:var(--kbq-file-upload-multiple-states-on-drag-dropzone-icon-color)}.kbq-multiple-file-upload .kbq-file-upload.kbq-file-drop_dragover .kbq-file-upload__list-footer{border-top-color:var(--kbq-file-upload-multiple-states-on-drag-container-border)}.kbq-multiple-file-upload .kbq-file-upload.kbq-file-drop_dragover .kbq-multiple-file-upload__empty-state-upload-icon{color:var(--kbq-file-upload-multiple-states-on-drag-upload-icon-color)}.kbq-multiple-file-upload .kbq-file-upload.kbq-disabled{background-color:var(--kbq-file-upload-multiple-states-disabled-container-background);border-color:var(--kbq-file-upload-multiple-states-disabled-container-border)!important}.kbq-multiple-file-upload .kbq-file-upload.kbq-disabled .kbq-file-upload__dropzone-icon{color:var(--kbq-file-upload-multiple-states-disabled-dropzone-icon-color)}.kbq-multiple-file-upload .kbq-file-upload.kbq-disabled .kbq-file-upload__list-footer{border-top-color:var(--kbq-file-upload-multiple-states-disabled-container-border)}.kbq-multiple-file-upload .kbq-file-upload.kbq-disabled .kbq-multiple-file-upload__empty-state-upload-icon{color:var(--kbq-file-upload-multiple-states-disabled-upload-icon-color)}.kbq-multiple-file-upload .kbq-file-upload.kbq-disabled .kbq-multiple-file-upload__empty-state{--kbq-empty-state-title: var(--kbq-file-upload-multiple-states-disabled-text-block-color);--kbq-empty-state-color: var(--kbq-file-upload-multiple-states-disabled-text-block-color)}.kbq-multiple-file-upload .kbq-file-upload.kbq-disabled .kbq-file-upload__dropzone-caption{color:var(--kbq-file-upload-multiple-states-disabled-text-block-color)}.kbq-multiple-file-upload .kbq-file-upload.kbq-disabled .kbq-file-upload__item .kbq-file-upload__file .kbq-icon.kbq-empty{color:var(--kbq-file-upload-multiple-states-disabled-left-icon-color)}.kbq-multiple-file-upload .kbq-file-upload.kbq-disabled .kbq-file-upload__item .kbq-file-item__text,.kbq-multiple-file-upload .kbq-file-upload.kbq-disabled .kbq-file-upload__item .kbq-file-upload__size{color:var(--kbq-file-upload-multiple-states-disabled-text-block-color)}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled).kbq-error{background-color:var(--kbq-file-upload-multiple-states-error-container-background);border-color:var(--kbq-file-upload-multiple-states-error-container-border)!important}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled).kbq-error .kbq-file-upload__dropzone-icon{color:var(--kbq-file-upload-multiple-states-error-dropzone-icon-color)}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled).kbq-error .kbq-multiple-file-upload__empty-state-upload-icon{color:var(--kbq-file-upload-multiple-states-error-upload-icon-color)}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled).kbq-error .kbq-file-upload__dropzone-caption{color:var(--kbq-file-upload-multiple-states-error-text-block-color)}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled).kbq-error .kbq-multiple-file-upload__empty-state{--kbq-file-upload-multiple-states-error-text-block-color: var( --kbq-file-upload-multiple-default-text-block-color );--kbq-empty-state-title: var(--kbq-file-upload-multiple-states-error-text-block-color);--kbq-empty-state-color: var(--kbq-file-upload-multiple-states-error-text-block-color)}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled).kbq-error .kbq-file-upload__list-footer{border-top-color:var(--kbq-file-upload-multiple-states-error-container-border)}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled) .kbq-file-upload__item:has(.kbq-file-upload__row.kbq-error):hover .kbq-file-upload__row,.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled) .kbq-file-upload__item:has(.kbq-file-upload__row.kbq-error).kbq-hovered .kbq-file-upload__row{background-color:var(--kbq-states-background-error-less-hover)}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled) .kbq-file-upload__item:has(.kbq-file-upload__row.kbq-error) .kbq-file-item__text,.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled) .kbq-file-upload__item:has(.kbq-file-upload__row.kbq-error) .kbq-file-upload__size{color:var(--kbq-file-upload-multiple-states-error-text-block-color)}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled) .kbq-file-upload__item:has(.kbq-file-upload__row.kbq-error) .kbq-file-upload__file .kbq-icon.kbq-empty{color:var(--kbq-file-upload-multiple-states-error-left-icon-color)}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled) .kbq-file-upload__item:has(.kbq-file-upload__row.kbq-error) .kbq-file-upload__action.kbq-icon.kbq-empty{color:var(--kbq-file-upload-multiple-states-error-icon-button-color)}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled) .kbq-file-upload__item:not(:has(.kbq-file-upload__row.kbq-error)):hover .kbq-file-upload__row,.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled) .kbq-file-upload__item:not(:has(.kbq-file-upload__row.kbq-error)).kbq-hovered .kbq-file-upload__row{--kbq-option-background: var(--kbq-list-states-hover-container-background);background:var(--kbq-list-states-hover-container-background)}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled) .kbq-file-upload__item:not(:has(.kbq-file-upload__row.kbq-error)).kbq-disabled .kbq-file-upload__row{--kbq-option-background: var(--kbq-list-states-disabled-container-background);background:var(--kbq-list-states-disabled-container-background)}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__list-footer{border-top-color:var(--kbq-file-upload-multiple-default-container-border)}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__item .kbq-file-upload__file .kbq-icon.kbq-empty{color:var(--kbq-file-upload-multiple-default-left-icon-color)}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__item .kbq-file-upload__size{color:var(--kbq-file-upload-multiple-default-file-size-text-color)}\n"] }]
|
|
1052
|
-
}], ctorParameters: () => [], propDecorators: { progressMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "progressMode", required: false }] }], accept: [{ type: i0.Input, args: [{ isSignal: true, alias: "accept", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: false }] }], errorStateMatcher: [{
|
|
1053
|
-
type: Input
|
|
1054
|
-
}], files: [{
|
|
1055
|
-
type: Input
|
|
1056
|
-
}], allowed: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowed", required: false }] }], fullScreenDropZone: [{ type: i0.Input, args: [{ isSignal: true, alias: "fullScreenDropZone", required: false }] }], addStrategy: [{ type: i0.Input, args: [{ isSignal: true, alias: "addStrategy", required: false }] }], localeConfig: [{ type: i0.Input, args: [{ isSignal: true, alias: "localeConfig", required: false }] }], filesChange: [{ type: i0.Output, args: ["filesChange"] }], fileQueueChanged: [{ type: i0.Output, args: ["fileQueueChanged"] }], filesAdded: [{ type: i0.Output, args: ["filesAdded"] }], fileRemoved: [{ type: i0.Output, args: ["fileRemoved"] }], customFileIcon: [{ type: i0.ContentChild, args: ['kbqFileIcon', { ...{ read: TemplateRef }, isSignal: true }] }], fileLoader: [{ type: i0.ViewChild, args: [i0.forwardRef(() => KbqFileLoader), { isSignal: true }] }], hint: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => KbqHint), { isSignal: true }] }] } });
|
|
1254
|
+
], template: "<div\n kbqFileDrop\n class=\"kbq-file-upload\"\n [class.kbq-disabled]=\"disabled\"\n [class.kbq-error]=\"invalid\"\n [class.kbq-selected]=\"files.length\"\n [class.kbq-file-upload_default]=\"size() === 'default'\"\n [class.kbq-file-upload_compact]=\"size() === 'compact'\"\n [disabled]=\"!!fullScreenDropZone()\"\n (filesDropped)=\"onFileDropped($event)\"\n>\n @let localeData = localeConfiguration().multiple;\n @if (!files.length) {\n @if (size() === 'default') {\n <kbq-file-upload-empty-state [size]=\"'normal'\" [title]=\"localeData.title\" [caption]=\"captionText\" />\n } @else {\n <div class=\"kbq-file-dropzone\">\n <i kbq-icon=\"kbq-arrow-up-from-bracket_16\" class=\"kbq-file-upload__dropzone-icon\"></i>\n <span class=\"kbq-file-upload__dropzone-caption\">\n <ng-container *ngTemplateOutlet=\"captionText\" />\n </span>\n </div>\n }\n } @else {\n <div class=\"kbq-file-upload__wrapper\">\n <kbq-scrollbar class=\"kbq-file-upload__list-viewport\">\n <kbq-list class=\"kbq-file-upload__list\" role=\"list\">\n @for (file of files; track file) {\n <kbq-list-item\n role=\"listitem\"\n class=\"kbq-file-upload__item\"\n [class.kbq-disabled]=\"disabled\"\n [attr.aria-invalid]=\"file.hasError || null\"\n (keydown.backspace)=\"deleteFile($index)\"\n (keydown.delete)=\"deleteFile($index)\"\n >\n <div class=\"kbq-file-upload__row\" [class.kbq-error]=\"file.hasError\">\n <div class=\"kbq-file-upload__file kbq-file-upload__grid-cell\">\n @if (!isLoading(file)) {\n <ng-container\n [ngTemplateOutlet]=\"$any(customFileIcon())\"\n [ngTemplateOutletContext]=\"{ $implicit: file }\"\n />\n } @else {\n <kbq-progress-spinner\n class=\"kbq-file-upload-name-cell__icon\"\n [mode]=\"progressMode()\"\n [value]=\"uploadProgress(file)\"\n />\n }\n <span\n class=\"kbq-file-item__text\"\n [minVisibleLength]=\"10\"\n [kbqEllipsisCenter]=\"file.file.name\"\n ></span>\n </div>\n <div class=\"kbq-file-upload__size kbq-file-upload__grid-cell\">\n {{ file.file.size | kbqDataSize }}\n </div>\n <i\n #fileAction\n kbq-icon-button=\"kbq-circle-xmark_16\"\n class=\"kbq-file-upload__action kbq-file-upload__grid-cell\"\n [attr.aria-label]=\"`${a11yNames().remove} ${file.file.name}`\"\n [color]=\"file.hasError ? 'error' : 'contrast-fade'\"\n [disabled]=\"disabled\"\n (click)=\"deleteFile($index, $event, 'program')\"\n (keydown.enter)=\"deleteFile($index, $event, 'program')\"\n (keydown.space)=\"$event.preventDefault(); deleteFile($index, $event, 'program')\"\n ></i>\n </div>\n </kbq-list-item>\n }\n </kbq-list>\n </kbq-scrollbar>\n <div class=\"kbq-file-upload__list-footer kbq-file-dropzone\">\n <i kbq-icon=\"kbq-arrow-up-from-bracket_16\" class=\"kbq-file-upload__dropzone-icon\"></i>\n <span class=\"kbq-file-upload__dropzone-caption\">\n <ng-container *ngTemplateOutlet=\"captionText\" />\n </span>\n </div>\n </div>\n }\n</div>\n\n@if (hasHint) {\n <div class=\"kbq-file-upload__hint\">\n <ng-content select=\"kbq-hint\" />\n </div>\n}\n\n<!-- Announces additions and removals: nothing else in the component reaches assistive tech (WCAG 4.1.3). -->\n<div class=\"cdk-visually-hidden\" role=\"status\" aria-live=\"polite\" aria-atomic=\"true\">{{ announcement() }}</div>\n\n<ng-template #captionText>\n @let context = captionContext();\n @if (files.length) {\n {{ captionTextWhenSelected }}\n } @else if (context.captionText) {\n {{ context.captionText }}\n }\n @if (context.browseLink) {\n <label\n kbqFileLoader\n cdkMonitorSubtreeFocus\n [onlyDirectory]=\"null\"\n [accept]=\"acceptedFiles\"\n [disabled]=\"disabled\"\n [describedBy]=\"describedBy()\"\n [invalid]=\"invalid\"\n [for]=\"fileUploadContext.id() || inputId()\"\n [multiple]=\"true\"\n (fileChange)=\"onFileSelectedViaClick($event)\"\n >\n <span class=\"kbq-file-upload__browse-link\" kbqLink size=\"normal\" [disabled]=\"disabled\" [tabIndex]=\"-1\">\n {{ context.browseLink }}\n </span>\n </label>\n }\n @if (context.captionTextSeparator) {\n {{ context.captionTextSeparator }}\n }\n @if (context.browseLinkFolder) {\n <label\n kbqFileLoader\n cdkMonitorSubtreeFocus\n [onlyDirectory]=\"true\"\n [disabled]=\"disabled\"\n [describedBy]=\"describedBy()\"\n [invalid]=\"invalid\"\n (fileChange)=\"onFileSelectedViaClick($event)\"\n >\n <span class=\"kbq-file-upload__browse-link\" kbqLink size=\"normal\" [disabled]=\"disabled\" [tabIndex]=\"-1\">\n {{ context.browseLinkFolder }}\n </span>\n </label>\n }\n</ng-template>\n", styles: [".kbq-form-field{--kbq-form-field-label-margin-bottom: var(--kbq-size-xs);position:relative;display:inline-block;width:100%}.kbq-form-field.kbq-form-field_horizontal{display:flex;flex-direction:row;align-items:flex-start}.kbq-form-field.kbq-form-field_horizontal .kbq-form-field__label{--kbq-form-field-label-margin-bottom: 0;padding:var(--kbq-size-xs) var(--kbq-size-l) 0 0}.kbq-form-field .kbq-form-field__content{flex:1}.kbq-form-field .kbq-form-field__label{box-sizing:border-box;display:flex;margin-bottom:var(--kbq-form-field-label-margin-bottom)}.kbq-form-field.kbq-form-field-type-select .kbq-form-field__suffix{margin-right:0}.kbq-form-field .kbq-form-field__container{box-sizing:border-box;display:flex;justify-content:space-between;align-items:center;border-width:var(--kbq-form-field-size-border-width);border-style:solid;border-color:transparent;border-radius:var(--kbq-form-field-size-border-radius)}@supports (corner-shape: squircle){.kbq-form-field .kbq-form-field__container{corner-shape:squircle;border-radius:clamp(var(--kbq-form-field-size-border-radius) * 1.85,var(--kbq-form-field-size-border-radius) * 2.3 - 3.6px,var(--kbq-form-field-size-border-radius) * 2)}}.kbq-form-field .kbq-form-field__container{padding-left:var(--kbq-form-field-size-container-left-padding);padding-right:var(--kbq-form-field-size-container-right-padding)}.kbq-form-field .kbq-form-field__container:has(.kbq-textarea){--kbq-form-field-size-container-left-padding: 0;--kbq-form-field-size-container-right-padding: 0}.kbq-form-field .kbq-form-field__infix{box-sizing:border-box;width:100%;flex-grow:1;padding-left:var(--kbq-form-field-size-infix-left-padding)}.kbq-form-field .kbq-form-field__infix:has(.kbq-select_multiple,.kbq-select_multiline):not(:has(.kbq-select__trigger_empty)),.kbq-form-field .kbq-form-field__infix:has(.kbq-tag-list),.kbq-form-field .kbq-form-field__infix:has(.kbq-textarea){padding-left:0;max-width:100%}.kbq-form-field .kbq-form-field__infix:has(.kbq-select_multiple,.kbq-select_multiline):has(kbq-select-trigger,[kbq-select-trigger]){padding-left:var(--kbq-form-field-size-infix-left-padding)}.kbq-form-field .kbq-form-field__infix .kbq-input,.kbq-form-field .kbq-form-field__infix .kbq-tag-input{padding-right:var(--kbq-form-field-size-infix-right-padding)}.kbq-form-field,.kbq-form-field .kbq-textarea{border-radius:var(--kbq-form-field-size-border-radius)}@supports (corner-shape: squircle){.kbq-form-field,.kbq-form-field .kbq-textarea{corner-shape:squircle;border-radius:clamp(var(--kbq-form-field-size-border-radius) * 1.85,var(--kbq-form-field-size-border-radius) * 2.3 - 3.6px,var(--kbq-form-field-size-border-radius) * 2)}}.kbq-form-field:hover{z-index:1}.kbq-form-field.cdk-focused,.kbq-form-field.kbq-focused{z-index:3}.kbq-form-field.kbq-form-field_without-borders,.kbq-form-field.kbq-form-field_no-borders{--kbq-form-field-default-border-color: transparent;--kbq-form-field-states-focused-border-color: transparent;--kbq-form-field-states-error-border-color: transparent;--kbq-form-field-states-disabled-border-color: transparent;--kbq-form-field-states-focused-focus-outline: transparent;--kbq-form-field-states-error-focused-focus-outline: transparent}.kbq-form-field.kbq-form-field_in-overlay{--kbq-form-field-default-background: var(--kbq-background-card);--kbq-form-field-states-focused-background: var(--kbq-background-card);--kbq-form-field-states-error-background: var(--kbq-background-card);--kbq-form-field-states-disabled-background: var(--kbq-background-card)}.kbq-form-field .kbq-form-field__prefix,.kbq-form-field .kbq-form-field__suffix{display:flex;justify-content:center;align-items:center}.kbq-form-field .kbq-form-field__prefix .kbq-prefix,.kbq-form-field .kbq-form-field__prefix .kbq-suffix,.kbq-form-field .kbq-form-field__suffix .kbq-prefix,.kbq-form-field .kbq-form-field__suffix .kbq-suffix{min-width:var(--kbq-form-field-size-addon-width);text-align:center}.kbq-form-field .kbq-form-field__prefix+.kbq-form-field__infix{padding-left:0}.kbq-form-field .kbq-form-field__hint{display:flex;flex-direction:column;gap:var(--kbq-form-field-hint-size-gap);margin-top:var(--kbq-form-field-hint-size-margin-top)}.kbq-form-field .kbq-form-field__hint:has(.kbq-reactive-password-hint){--kbq-form-field-hint-size-gap: var(--kbq-size-s)}.kbq-form-field .kbq-form-field__hint:has(.kbq-reactive-password-hint:first-child){--kbq-form-field-hint-size-margin-top: var(--kbq-size-m)}.kbq-form-field .kbq-form-field__container{border-color:var(--kbq-form-field-default-border-color);background-color:var(--kbq-form-field-default-background)}.kbq-form-field .kbq-input,.kbq-form-field .kbq-tag-input,.kbq-form-field .kbq-textarea{--kbq-form-field-resolved-text: var(--kbq-form-field-default-text);color:var(--kbq-form-field-resolved-text)}.kbq-form-field .kbq-input::placeholder,.kbq-form-field .kbq-tag-input::placeholder,.kbq-form-field .kbq-textarea::placeholder{color:var(--kbq-form-field-default-placeholder)}.kbq-form-field .kbq-input::-ms-input-placeholder,.kbq-form-field .kbq-tag-input::-ms-input-placeholder,.kbq-form-field .kbq-textarea::-ms-input-placeholder{color:var(--kbq-form-field-default-placeholder)}.kbq-form-field .kbq-input::-webkit-input-placeholder,.kbq-form-field .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field .kbq-textarea::-webkit-input-placeholder{color:var(--kbq-form-field-default-placeholder)}.kbq-form-field .kbq-input:is(:autofill,:-webkit-autofill),.kbq-form-field .kbq-tag-input:is(:autofill,:-webkit-autofill),.kbq-form-field .kbq-textarea:is(:autofill,:-webkit-autofill){transition-property:background-color;transition-duration:600000s;-webkit-text-fill-color:var(--kbq-form-field-resolved-text, var(--kbq-form-field-default-text));caret-color:var(--kbq-form-field-resolved-text, var(--kbq-form-field-default-text))}.kbq-form-field.kbq-form-field_invalid .kbq-form-field__container{border-color:var(--kbq-form-field-states-error-border-color);background-color:var(--kbq-form-field-states-error-background)}.kbq-form-field.kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field_invalid .kbq-textarea{--kbq-form-field-resolved-text: var(--kbq-form-field-states-error-text);color:var(--kbq-form-field-resolved-text)}.kbq-form-field.kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field_invalid .kbq-textarea::placeholder{color:var(--kbq-form-field-states-error-placeholder)}.kbq-form-field.kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder{color:var(--kbq-form-field-states-error-placeholder)}.kbq-form-field.kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder{color:var(--kbq-form-field-states-error-placeholder)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container{border-color:var(--kbq-form-field-states-focused-border-color);background-color:var(--kbq-form-field-states-focused-background)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea{--kbq-form-field-resolved-text: var(--kbq-form-field-states-focused-text);color:var(--kbq-form-field-resolved-text)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder{color:var(--kbq-form-field-states-focused-placeholder)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder{color:var(--kbq-form-field-states-focused-placeholder)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder{color:var(--kbq-form-field-states-focused-placeholder)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container{box-shadow:inset 0 0 .1px var(--kbq-form-field-size-focus-outline-width) var(--kbq-form-field-states-focused-focus-outline)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container{border-color:var(--kbq-form-field-states-error-border-color);background-color:var(--kbq-form-field-states-error-background)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea{--kbq-form-field-resolved-text: var(--kbq-form-field-states-error-text);color:var(--kbq-form-field-resolved-text)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder{color:var(--kbq-form-field-states-error-placeholder)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder{color:var(--kbq-form-field-states-error-placeholder)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder{color:var(--kbq-form-field-states-error-placeholder)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container{box-shadow:inset 0 0 .1px var(--kbq-form-field-size-focus-outline-width) var(--kbq-form-field-states-error-focused-focus-outline)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty{color:var(--kbq-form-field-states-error-text);-webkit-text-fill-color:var(--kbq-form-field-states-error-text)}.kbq-form-field .kbq-form-field__label{color:var(--kbq-form-field-label-color)}.kbq-form-field .kbq-form-field__container:has(:is(.kbq-input,.kbq-tag-input,.kbq-textarea):is(:autofill,:-webkit-autofill)){background-image:linear-gradient(var(--kbq-form-field-states-autofill-background),var(--kbq-form-field-states-autofill-background))}.kbq-form-field.kbq-disabled .kbq-form-field__container{border-color:var(--kbq-form-field-states-disabled-border-color);background-color:var(--kbq-form-field-states-disabled-background)}.kbq-form-field.kbq-disabled .kbq-input,.kbq-form-field.kbq-disabled .kbq-tag-input,.kbq-form-field.kbq-disabled .kbq-textarea{--kbq-form-field-resolved-text: var(--kbq-form-field-states-disabled-text);color:var(--kbq-form-field-resolved-text)}.kbq-form-field.kbq-disabled .kbq-input::placeholder,.kbq-form-field.kbq-disabled .kbq-tag-input::placeholder,.kbq-form-field.kbq-disabled .kbq-textarea::placeholder{color:var(--kbq-form-field-states-disabled-placeholder)}.kbq-form-field.kbq-disabled .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-disabled .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-disabled .kbq-textarea::-ms-input-placeholder{color:var(--kbq-form-field-states-disabled-placeholder)}.kbq-form-field.kbq-disabled .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-disabled .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-disabled .kbq-textarea::-webkit-input-placeholder{color:var(--kbq-form-field-states-disabled-placeholder)}.kbq-form-field.kbq-disabled .kbq-icon.kbq-empty{color:var(--kbq-form-field-states-disabled-text);-webkit-text-fill-color:var(--kbq-form-field-states-disabled-text)}.kbq-form-field .kbq-form-field__prefix .kbq-icon.kbq-empty,.kbq-form-field .kbq-form-field__suffix .kbq-icon.kbq-empty{color:var(--kbq-icon-contrast-fade)}.kbq-form-field .kbq-form-field__hint>.kbq-hint:not(.kbq-contrast-fade,.kbq-success,.kbq-warning,.kbq-error){color:var(--kbq-form-field-hint-text)}.kbq-form-field{font-size:var(--kbq-typography-text-normal-font-size);font-style:var(--kbq-typography-text-normal-font-style);font-weight:var(--kbq-typography-text-normal-font-weight);line-height:var(--kbq-typography-text-normal-line-height);font-family:var(--kbq-typography-text-normal-font-family);text-transform:var(--kbq-typography-text-normal-text-transform);font-feature-settings:var(--kbq-typography-text-normal-font-feature-settings);letter-spacing:var(--kbq-typography-text-normal-letter-spacing)}.kbq-form-field .kbq-form-field__hint>.kbq-hint:not(.kbq-reactive-password-hint,.kbq-contrast-fade,.kbq-success,.kbq-warning) .kbq-hint__text{font-size:var(--kbq-typography-text-compact-font-size);font-style:var(--kbq-typography-text-compact-font-style);font-weight:var(--kbq-typography-text-compact-font-weight);line-height:var(--kbq-typography-text-compact-line-height);font-family:var(--kbq-typography-text-compact-font-family);text-transform:var(--kbq-typography-text-compact-text-transform);font-feature-settings:var(--kbq-typography-text-compact-font-feature-settings);letter-spacing:var(--kbq-typography-text-compact-letter-spacing)}.kbq-file-upload{box-sizing:border-box;display:flex;align-items:center;position:relative}.kbq-file-upload .kbq-file-item{display:flex;align-items:center}.kbq-file-upload .kbq-file-dropzone{display:flex;align-items:baseline;gap:var(--dropzone-gap, var(--kbq-file-upload-size-dropzone-content-gap-horizontal))}.kbq-file-loader.cdk-keyboard-focused>.kbq-file-upload__browse-link{outline-style:solid;outline-width:var(--kbq-link-size-state-focused-outline-width);outline-color:var(--kbq-link-state-focused-outline)}.kbq-file-upload__hint{display:flex;flex-direction:column;gap:var(--kbq-form-field-hint-size-gap);margin-top:var(--kbq-form-field-hint-size-margin-top)}.kbq-file-upload__hint:has(.kbq-reactive-password-hint){--kbq-form-field-hint-size-gap: var(--kbq-size-s)}.kbq-file-upload__hint:has(.kbq-reactive-password-hint:first-child){--kbq-form-field-hint-size-margin-top: var(--kbq-size-m)}:where(.kbq-file-upload__hint .kbq-hint){color:var(--kbq-foreground-contrast-secondary)}.kbq-file-upload{font-size:var(--kbq-typography-text-normal-font-size);font-style:var(--kbq-typography-text-normal-font-style);font-weight:var(--kbq-typography-text-normal-font-weight);line-height:var(--kbq-typography-text-normal-line-height);font-family:var(--kbq-typography-text-normal-font-family);text-transform:var(--kbq-typography-text-normal-text-transform);font-feature-settings:var(--kbq-typography-text-normal-font-feature-settings);letter-spacing:var(--kbq-typography-text-normal-letter-spacing)}.kbq-file-upload__hint .kbq-hint .kbq-hint__text{font-size:var(--kbq-typography-text-compact-font-size);font-style:var(--kbq-typography-text-compact-font-style);font-weight:var(--kbq-typography-text-compact-font-weight);line-height:var(--kbq-typography-text-compact-line-height);font-family:var(--kbq-typography-text-compact-font-family);text-transform:var(--kbq-typography-text-compact-text-transform);font-feature-settings:var(--kbq-typography-text-compact-font-feature-settings);letter-spacing:var(--kbq-typography-text-compact-letter-spacing)}\n", ":where(.kbq-file-upload){--kbq-file-upload-size-dropzone-content-gap-horizontal: var(--kbq-size-s);--kbq-form-field-hint-text: var(--kbq-foreground-contrast-secondary)}:where(.kbq-single-file-upload){--kbq-form-field-hint-size-margin-top: var(--kbq-size-xs);--kbq-form-field-hint-size-gap: var(--kbq-size-xxs);--kbq-file-upload-size-single-container-border-radius: var(--kbq-size-s);--kbq-file-upload-size-single-container-border-width: 1px;--kbq-file-upload-size-single-container-content-gap-horizontal: var(--kbq-size-s);--kbq-file-upload-size-single-container-padding-vertical: var(--kbq-size-m);--kbq-file-upload-size-single-container-padding-horizontal: var(--kbq-size-l);--kbq-file-upload-single-min-height: 44px;--kbq-file-upload-size-single-action-padding: 13px;--kbq-file-upload-single-default-container-border: var(--kbq-line-contrast-fade);--kbq-file-upload-single-default-container-background: var(--kbq-background-bg);--kbq-file-upload-single-default-dropzone-icon-color: var(--kbq-icon-contrast-fade);--kbq-file-upload-single-default-left-icon-color: var(--kbq-icon-contrast-fade);--kbq-file-upload-single-default-file-size-text-color: var(--kbq-foreground-contrast-secondary);--kbq-file-upload-single-states-on-drag-container-border: var(--kbq-line-theme-fade);--kbq-file-upload-single-states-on-drag-container-background: var(--kbq-background-theme-fade);--kbq-file-upload-single-states-error-container-border: var(--kbq-line-error);--kbq-file-upload-single-states-error-container-background: var(--kbq-background-error-less);--kbq-file-upload-single-states-error-dropzone-icon-color: var(--kbq-icon-error);--kbq-file-upload-single-states-error-left-icon-color: var(--kbq-icon-error);--kbq-file-upload-single-states-error-text-block-color: var(--kbq-foreground-error);--kbq-file-upload-single-states-error-file-size-text-color: var(--kbq-foreground-error);--kbq-file-upload-single-states-disabled-container-border: var(--kbq-states-line-disabled);--kbq-file-upload-single-states-disabled-container-background: var(--kbq-states-background-disabled);--kbq-file-upload-single-states-disabled-dropzone-icon-color: var(--kbq-states-icon-disabled);--kbq-file-upload-single-states-disabled-left-icon-color: var(--kbq-states-icon-disabled);--kbq-file-upload-single-states-disabled-text-block-color: var(--kbq-states-foreground-disabled);--kbq-file-upload-single-states-disabled-file-size-text-color: var(--kbq-states-foreground-disabled)}:where(.kbq-multiple-file-upload){--kbq-form-field-hint-size-margin-top: var(--kbq-size-xs);--kbq-form-field-hint-size-gap: var(--kbq-size-xxs);--kbq-file-upload-size-multiple-min-height: 120px;--kbq-file-upload-size-multiple-max-height: unset;--kbq-file-upload-size-multiple-big-container-min-height: 192px;--kbq-file-upload-size-multiple-big-container-min-width: 320px;--kbq-file-upload-size-multiple-big-container-border-radius: var(--kbq-size-s);--kbq-file-upload-size-multiple-big-container-border-width: 1px;--kbq-file-upload-size-multiple-big-grid-cell-padding-horizontal: var(--kbq-size-s);--kbq-file-upload-size-multiple-big-grid-cell-content-gap-horizontal: var(--kbq-size-s);--kbq-file-upload-size-multiple-big-grid-cell-file-size-width: var(--kbq-size-7xl);--kbq-file-upload-multiple-default-container-border: var(--kbq-line-contrast-fade);--kbq-file-upload-multiple-default-container-background: var(--kbq-background-bg);--kbq-file-upload-multiple-default-upload-icon-color: var(--kbq-icon-contrast);--kbq-file-upload-multiple-default-dropzone-icon-color: var(--kbq-icon-contrast-fade);--kbq-file-upload-multiple-default-left-icon-color: var(--kbq-icon-contrast-fade);--kbq-file-upload-multiple-default-text-block-color: var(--kbq-foreground-contrast);--kbq-file-upload-multiple-default-file-size-text-color: var(--kbq-foreground-contrast-secondary);--kbq-file-upload-multiple-states-on-drag-container-border: var(--kbq-line-theme-fade);--kbq-file-upload-multiple-states-on-drag-container-background: var(--kbq-background-theme-fade);--kbq-file-upload-multiple-states-on-drag-upload-icon-color: var(--kbq-icon-contrast);--kbq-file-upload-multiple-states-on-drag-dropzone-icon-color: var(--kbq-icon-contrast-fade);--kbq-file-upload-multiple-states-error-container-border: var(--kbq-line-error);--kbq-file-upload-multiple-states-error-container-background: var(--kbq-background-error-less);--kbq-file-upload-multiple-states-error-upload-icon-color: var(--kbq-icon-error);--kbq-file-upload-multiple-states-error-dropzone-icon-color: var(--kbq-icon-error);--kbq-file-upload-multiple-states-error-left-icon-color: var(--kbq-icon-error);--kbq-file-upload-multiple-states-error-icon-button-color: var(--kbq-icon-error);--kbq-file-upload-multiple-states-error-text-block-color: var(--kbq-foreground-error);--kbq-file-upload-multiple-states-disabled-container-border: var(--kbq-states-line-disabled);--kbq-file-upload-multiple-states-disabled-container-background: var(--kbq-states-background-disabled);--kbq-file-upload-multiple-states-disabled-upload-icon-color: var(--kbq-states-icon-disabled);--kbq-file-upload-multiple-states-disabled-dropzone-icon-color: var(--kbq-states-icon-disabled);--kbq-file-upload-multiple-states-disabled-left-icon-color: var(--kbq-states-icon-disabled);--kbq-file-upload-multiple-states-disabled-text-block-color: var(--kbq-states-foreground-disabled)}:where(.kbq-file-upload.kbq-file-upload_compact){--kbq-file-upload-multiple-compact-container-padding-vertical: 11px;--kbq-file-upload-multiple-compact-container-padding-horizontal: 15px}\n", ".kbq-multiple-file-upload .kbq-file-upload{border-radius:var(--kbq-file-upload-size-multiple-big-container-border-radius)}@supports (corner-shape: squircle){.kbq-multiple-file-upload .kbq-file-upload{corner-shape:squircle;border-radius:clamp(var(--kbq-file-upload-size-multiple-big-container-border-radius) * 1.85,var(--kbq-file-upload-size-multiple-big-container-border-radius) * 2.3 - 3.6px,var(--kbq-file-upload-size-multiple-big-container-border-radius) * 2)}}.kbq-multiple-file-upload .kbq-file-upload{border-width:var(--kbq-file-upload-size-multiple-big-container-border-width);border-style:dashed}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-selected).kbq-file-upload_default{justify-content:center;min-height:var(--kbq-file-upload-size-multiple-big-container-min-height);min-width:var(--kbq-file-upload-size-multiple-big-container-min-width)}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-selected).kbq-file-upload_default .kbq-multiple-file-upload__empty-state{--kbq-empty-state-size-normal-padding-top: 0;--kbq-empty-state-size-normal-padding-bottom: 0;--kbq-empty-state-size-normal-image-addon-height: 4px;--kbq-empty-state-size-normal-padding-horizontal: 23px}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-selected).kbq-file-upload_compact{padding:var(--kbq-file-upload-multiple-compact-container-padding-vertical) var(--kbq-file-upload-multiple-compact-container-padding-horizontal)}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__dropzone-icon>svg{vertical-align:bottom}.kbq-multiple-file-upload .kbq-file-upload .kbq-multiple-file-upload__empty-state{--kbq-empty-state-size-normal-image-margin-bottom: var(--kbq-size-m);--kbq-empty-state-size-normal-title-margin-bottom: var(--kbq-size-xs)}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__list-viewport{box-sizing:content-box;min-height:var(--kbq-file-upload-size-multiple-min-height);max-height:var(--kbq-file-upload-size-multiple-max-height);padding-top:calc(var(--kbq-size-xxs) - var(--kbq-size-border-width));padding-bottom:var(--kbq-size-xxl)}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__row{display:flex;align-items:center;flex:1;min-width:0}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__row .kbq-file-upload__grid-cell{padding:0 var(--kbq-file-upload-size-multiple-big-grid-cell-padding-horizontal)}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__row .kbq-file-upload__file{display:flex;align-items:center;flex-grow:1;gap:var(--kbq-file-upload-size-multiple-big-grid-cell-content-gap-horizontal);padding-left:var(--kbq-size-m);min-width:0}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__row .kbq-file-upload__file .kbq-file-item__text{flex:1 1 auto}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__row .kbq-file-upload__size{box-sizing:content-box;width:var(--kbq-file-upload-size-multiple-big-grid-cell-file-size-width);min-width:var(--kbq-file-upload-size-multiple-big-grid-cell-file-size-width);max-width:var(--kbq-file-upload-size-multiple-big-grid-cell-file-size-width);flex:none;text-align:left}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__row .kbq-file-upload__action{padding:var(--kbq-size-m)}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__list-footer{margin:-1px;padding:var(--kbq-size-m) var(--kbq-size-l);border-top-width:var(--kbq-file-upload-size-multiple-big-container-border-width);border-top-style:dashed}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__wrapper{width:100%;height:100%}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__item{border-radius:0;border:0;padding:0 calc(var(--kbq-size-xxs) - var(--kbq-size-border-width))}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__item .kbq-file-upload__row{border-radius:var(--kbq-size-xs)}@supports (corner-shape: squircle){.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__item .kbq-file-upload__row{corner-shape:squircle;border-radius:clamp(var(--kbq-size-xs) * 1.85,var(--kbq-size-xs) * 2.3 - 3.6px,var(--kbq-size-xs) * 2)}}.kbq-multiple-file-upload .kbq-file-upload{background-color:var(--kbq-file-upload-multiple-default-container-background);border-color:var(--kbq-file-upload-multiple-default-container-border)!important}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled,.kbq-error) .kbq-file-upload__dropzone-icon{color:var(--kbq-file-upload-multiple-default-dropzone-icon-color)}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled,.kbq-error) .kbq-multiple-file-upload__empty-state{--kbq-empty-state-title-color: var(--kbq-file-upload-multiple-default-text-block-color);--kbq-empty-state-text-color: var(--kbq-file-upload-multiple-default-text-block-color)}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled,.kbq-error) .kbq-multiple-file-upload__empty-state-upload-icon{color:var(--kbq-file-upload-multiple-default-upload-icon-color)}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled,.kbq-error) .kbq-file-upload__dropzone-caption{color:var(--kbq-file-upload-multiple-default-text-block-color)}.kbq-multiple-file-upload .kbq-file-upload.kbq-file-drop_dragover{background-color:var(--kbq-file-upload-multiple-states-on-drag-container-background);border-color:var(--kbq-file-upload-multiple-states-on-drag-container-border)!important}.kbq-multiple-file-upload .kbq-file-upload.kbq-file-drop_dragover .kbq-file-upload__dropzone-icon{color:var(--kbq-file-upload-multiple-states-on-drag-dropzone-icon-color)}.kbq-multiple-file-upload .kbq-file-upload.kbq-file-drop_dragover .kbq-file-upload__list-footer{border-top-color:var(--kbq-file-upload-multiple-states-on-drag-container-border)}.kbq-multiple-file-upload .kbq-file-upload.kbq-file-drop_dragover .kbq-multiple-file-upload__empty-state-upload-icon{color:var(--kbq-file-upload-multiple-states-on-drag-upload-icon-color)}.kbq-multiple-file-upload .kbq-file-upload.kbq-disabled{background-color:var(--kbq-file-upload-multiple-states-disabled-container-background);border-color:var(--kbq-file-upload-multiple-states-disabled-container-border)!important}.kbq-multiple-file-upload .kbq-file-upload.kbq-disabled .kbq-file-upload__dropzone-icon{color:var(--kbq-file-upload-multiple-states-disabled-dropzone-icon-color)}.kbq-multiple-file-upload .kbq-file-upload.kbq-disabled .kbq-file-upload__list-footer{border-top-color:var(--kbq-file-upload-multiple-states-disabled-container-border)}.kbq-multiple-file-upload .kbq-file-upload.kbq-disabled .kbq-multiple-file-upload__empty-state-upload-icon{color:var(--kbq-file-upload-multiple-states-disabled-upload-icon-color)}.kbq-multiple-file-upload .kbq-file-upload.kbq-disabled .kbq-multiple-file-upload__empty-state{--kbq-empty-state-title-color: var(--kbq-file-upload-multiple-states-disabled-text-block-color);--kbq-empty-state-text-color: var(--kbq-file-upload-multiple-states-disabled-text-block-color)}.kbq-multiple-file-upload .kbq-file-upload.kbq-disabled .kbq-file-upload__dropzone-caption{color:var(--kbq-file-upload-multiple-states-disabled-text-block-color)}.kbq-multiple-file-upload .kbq-file-upload.kbq-disabled .kbq-file-upload__item .kbq-file-upload__file .kbq-icon.kbq-empty{color:var(--kbq-file-upload-multiple-states-disabled-left-icon-color)}.kbq-multiple-file-upload .kbq-file-upload.kbq-disabled .kbq-file-upload__item .kbq-file-item__text,.kbq-multiple-file-upload .kbq-file-upload.kbq-disabled .kbq-file-upload__item .kbq-file-upload__size{color:var(--kbq-file-upload-multiple-states-disabled-text-block-color)}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled).kbq-error{background-color:var(--kbq-file-upload-multiple-states-error-container-background);border-color:var(--kbq-file-upload-multiple-states-error-container-border)!important}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled).kbq-error .kbq-file-upload__dropzone-icon{color:var(--kbq-file-upload-multiple-states-error-dropzone-icon-color)}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled).kbq-error .kbq-multiple-file-upload__empty-state-upload-icon{color:var(--kbq-file-upload-multiple-states-error-upload-icon-color)}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled).kbq-error .kbq-file-upload__dropzone-caption{color:var(--kbq-file-upload-multiple-states-error-text-block-color)}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled).kbq-error .kbq-multiple-file-upload__empty-state{--kbq-file-upload-multiple-states-error-text-block-color: var( --kbq-file-upload-multiple-default-text-block-color );--kbq-empty-state-title-color: var(--kbq-file-upload-multiple-states-error-text-block-color);--kbq-empty-state-text-color: var(--kbq-file-upload-multiple-states-error-text-block-color)}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled).kbq-error .kbq-file-upload__list-footer{border-top-color:var(--kbq-file-upload-multiple-states-error-container-border)}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled) .kbq-file-upload__item:has(.kbq-file-upload__row.kbq-error):hover .kbq-file-upload__row,.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled) .kbq-file-upload__item:has(.kbq-file-upload__row.kbq-error).kbq-hovered .kbq-file-upload__row{background-color:var(--kbq-states-background-error-less-hover)}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled) .kbq-file-upload__item:has(.kbq-file-upload__row.kbq-error) .kbq-file-item__text,.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled) .kbq-file-upload__item:has(.kbq-file-upload__row.kbq-error) .kbq-file-upload__size{color:var(--kbq-file-upload-multiple-states-error-text-block-color)}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled) .kbq-file-upload__item:has(.kbq-file-upload__row.kbq-error) .kbq-file-upload__file .kbq-icon.kbq-empty{color:var(--kbq-file-upload-multiple-states-error-left-icon-color)}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled) .kbq-file-upload__item:has(.kbq-file-upload__row.kbq-error) .kbq-file-upload__action.kbq-icon.kbq-empty{color:var(--kbq-file-upload-multiple-states-error-icon-button-color)}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled) .kbq-file-upload__item:not(:has(.kbq-file-upload__row.kbq-error)):hover .kbq-file-upload__row,.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled) .kbq-file-upload__item:not(:has(.kbq-file-upload__row.kbq-error)).kbq-hovered .kbq-file-upload__row{--kbq-option-background: var(--kbq-list-states-hover-container-background);background:var(--kbq-list-states-hover-container-background)}.kbq-multiple-file-upload .kbq-file-upload:not(.kbq-disabled) .kbq-file-upload__item:not(:has(.kbq-file-upload__row.kbq-error)).kbq-disabled .kbq-file-upload__row{--kbq-option-background: var(--kbq-list-states-disabled-container-background);background:var(--kbq-list-states-disabled-container-background)}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__list-footer{border-top-color:var(--kbq-file-upload-multiple-default-container-border)}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__item .kbq-file-upload__file .kbq-icon.kbq-empty{color:var(--kbq-file-upload-multiple-default-left-icon-color)}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__item .kbq-file-upload__size{color:var(--kbq-file-upload-multiple-default-file-size-text-color)}\n"] }]
|
|
1255
|
+
}], ctorParameters: () => [], propDecorators: { progressMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "progressMode", required: false }] }], accept: [{ type: i0.Input, args: [{ isSignal: true, alias: "accept", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: false }] }], allowed: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowed", required: false }] }], fullScreenDropZone: [{ type: i0.Input, args: [{ isSignal: true, alias: "fullScreenDropZone", required: false }] }], addStrategy: [{ type: i0.Input, args: [{ isSignal: true, alias: "addStrategy", required: false }] }], filesChange: [{ type: i0.Output, args: ["filesChange"] }], filesAdded: [{ type: i0.Output, args: ["filesAdded"] }], fileRemoved: [{ type: i0.Output, args: ["fileRemoved"] }], rejected: [{ type: i0.Output, args: ["rejected"] }], customFileIcon: [{ type: i0.ContentChild, args: ['kbqFileIcon', { ...{ read: TemplateRef }, isSignal: true }] }], fileLoader: [{ type: i0.ViewChild, args: [i0.forwardRef(() => KbqFileLoader), { isSignal: true }] }], listViewport: [{ type: i0.ViewChild, args: [i0.forwardRef(() => KbqScrollbar), { isSignal: true }] }], hint: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => KbqHint), { isSignal: true }] }], fileActions: [{ type: i0.ViewChildren, args: ['fileAction', { ...{ read: ElementRef }, isSignal: true }] }], errorStateMatcherInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "errorStateMatcher", required: false }] }], filesInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "files", required: false }] }] } });
|
|
1057
1256
|
|
|
1058
1257
|
let nextSingleFileUploadUniqueId = 0;
|
|
1059
1258
|
const KBQ_SINGLE_FILE_UPLOAD_DEFAULT_CONFIGURATION = ruRULocaleData.fileUpload.single;
|
|
1060
1259
|
class KbqSingleFileUploadComponent extends KbqFileUploadBase {
|
|
1061
|
-
|
|
1062
|
-
|
|
1260
|
+
/**
|
|
1261
|
+
* The selected file, or `null`.
|
|
1262
|
+
*
|
|
1263
|
+
* Writing it is the model→view direction, same as `writeValue()`: it fills the list and tells
|
|
1264
|
+
* nobody. `cvaOnChange` and `(fileChange)` belong to the paths a user drives — see `addFile()`
|
|
1265
|
+
* and `deleteItem()` — so a `[file]` binding cannot make the form look edited.
|
|
1266
|
+
*/
|
|
1267
|
+
// An accessor, not a `model()`: the store is `KbqFileList.list`, a model on the host directive that the template
|
|
1268
|
+
// reads and that `remove()`, `removeAt()` and `replace()` mutate. A `model()` here would be a second store to keep
|
|
1269
|
+
// in sync with that one.
|
|
1063
1270
|
get file() {
|
|
1064
1271
|
const files = this.fileList.list();
|
|
1065
1272
|
return files.length === 0 ? null : files[0];
|
|
1066
1273
|
}
|
|
1067
1274
|
set file(currentFile) {
|
|
1068
|
-
this.
|
|
1069
|
-
this.cvaOnChange(currentFile);
|
|
1070
|
-
this.cdr.markForCheck();
|
|
1275
|
+
this.setFileList(currentFile === null ? [] : [currentFile]);
|
|
1071
1276
|
}
|
|
1072
1277
|
/** @docs-private */
|
|
1073
1278
|
get input() {
|
|
@@ -1084,61 +1289,74 @@ class KbqSingleFileUploadComponent extends KbqFileUploadBase {
|
|
|
1084
1289
|
/**
|
|
1085
1290
|
* Indicates an invalid state based on file errors or `errorState`,
|
|
1086
1291
|
* applying a CSS class in HTML for visual feedback.
|
|
1292
|
+
*
|
|
1087
1293
|
* @docs-private
|
|
1088
1294
|
*/
|
|
1089
1295
|
get invalid() {
|
|
1090
1296
|
return !!this.file?.hasError || this.errorState;
|
|
1091
1297
|
}
|
|
1298
|
+
ngOnChanges(changes) {
|
|
1299
|
+
// A bound input is handed to its member; unbound, it leaves what code wrote.
|
|
1300
|
+
// A bound `undefined` falls back to the default matcher and clears the file.
|
|
1301
|
+
if (changes['errorStateMatcherInput']) {
|
|
1302
|
+
this.errorStateMatcher = this.errorStateMatcherInput() ?? this.defaultErrorStateMatcher;
|
|
1303
|
+
}
|
|
1304
|
+
if (changes['fileInput'])
|
|
1305
|
+
this.file = this.fileInput() ?? null;
|
|
1306
|
+
}
|
|
1092
1307
|
constructor() {
|
|
1093
1308
|
super();
|
|
1094
1309
|
/**
|
|
1095
1310
|
* A value responsible for progress spinner type.
|
|
1096
|
-
* Loading logic depends on selected mode
|
|
1097
|
-
|
|
1311
|
+
* Loading logic depends on selected mode
|
|
1312
|
+
*/
|
|
1313
|
+
this.progressMode = input('determinate', ...(ngDevMode ? [{ debugName: "progressMode" }] : /* istanbul ignore next */ []));
|
|
1098
1314
|
/** Array of file type specifiers */
|
|
1099
|
-
this.accept = input(...(ngDevMode ? [undefined, { debugName: "accept" }] : []));
|
|
1100
|
-
this.inputId = input(`kbq-single-file-upload-${nextSingleFileUploadUniqueId++}`, ...(ngDevMode ? [{ debugName: "inputId" }] : []));
|
|
1315
|
+
this.accept = input(...(ngDevMode ? [undefined, { debugName: "accept" }] : /* istanbul ignore next */ []));
|
|
1316
|
+
this.inputId = input(`kbq-single-file-upload-${nextSingleFileUploadUniqueId++}`, ...(ngDevMode ? [{ debugName: "inputId" }] : /* istanbul ignore next */ []));
|
|
1101
1317
|
/**
|
|
1102
|
-
* Controls whether to display the file size information.
|
|
1103
|
-
* @default true
|
|
1318
|
+
* Controls whether to display the file size information. Defaults to `true`.
|
|
1104
1319
|
*/
|
|
1105
|
-
this.showFileSize = input(true, ...(ngDevMode ?
|
|
1320
|
+
this.showFileSize = input(true, { ...(ngDevMode ? { debugName: "showFileSize" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
|
|
1106
1321
|
/**
|
|
1107
|
-
* Determines which kind of items the upload component can accept.
|
|
1108
|
-
* @default mixed
|
|
1322
|
+
* Determines which kind of items the upload component can accept. Defaults to `'file'`.
|
|
1109
1323
|
*/
|
|
1110
|
-
this.allowed = input(KbqFileUploadAllowedType.File, ...(ngDevMode ? [{ debugName: "allowed" }] : []));
|
|
1324
|
+
this.allowed = input(KbqFileUploadAllowedType.File, ...(ngDevMode ? [{ debugName: "allowed" }] : /* istanbul ignore next */ []));
|
|
1111
1325
|
/**
|
|
1112
1326
|
* Controls whether to display fullscreen dropzone.
|
|
1113
1327
|
* Provide configuration object to enable, or undefined to disable.
|
|
1114
1328
|
*/
|
|
1115
|
-
this.fullScreenDropZone = input(...(ngDevMode ? [undefined, { debugName: "fullScreenDropZone" }] : []));
|
|
1116
|
-
/** Optional configuration to override default labels with localized text.*/
|
|
1117
|
-
this.localeConfig = input(...(ngDevMode ? [undefined, { debugName: "localeConfig" }] : []));
|
|
1329
|
+
this.fullScreenDropZone = input(...(ngDevMode ? [undefined, { debugName: "fullScreenDropZone" }] : /* istanbul ignore next */ []));
|
|
1118
1330
|
/** Emits an event containing an updated file. */
|
|
1119
1331
|
this.fileChange = output();
|
|
1120
|
-
/**
|
|
1121
|
-
*
|
|
1122
|
-
|
|
1332
|
+
/**
|
|
1333
|
+
* Emits the files a selection or a drop discarded: everything past the first one, since the
|
|
1334
|
+
* component holds a single file. `accept` is not part of this — it only filters the OS dialog.
|
|
1335
|
+
*/
|
|
1336
|
+
this.rejected = output();
|
|
1123
1337
|
/** @docs-private */
|
|
1124
1338
|
this.fileLoader = viewChild.required(KbqFileLoader);
|
|
1125
1339
|
/** @docs-private */
|
|
1126
|
-
this.hint = contentChildren(KbqHint, ...(ngDevMode ? [{ debugName: "hint" }] : []));
|
|
1127
|
-
/**
|
|
1340
|
+
this.hint = contentChildren(KbqHint, ...(ngDevMode ? [{ debugName: "hint" }] : /* istanbul ignore next */ []));
|
|
1341
|
+
/** @docs-private */
|
|
1342
|
+
this.describedBy = computed(() => this.hint()
|
|
1343
|
+
.map((hint) => hint.id())
|
|
1344
|
+
.join(' ') || null, ...(ngDevMode ? [{ debugName: "describedBy" }] : /* istanbul ignore next */ []));
|
|
1345
|
+
/**
|
|
1346
|
+
* cvaOnChange function registered via registerOnChange (ControlValueAccessor).
|
|
1347
|
+
*
|
|
1128
1348
|
* @docs-private
|
|
1129
1349
|
*/
|
|
1130
1350
|
this.cvaOnChange = (_) => { };
|
|
1131
|
-
/**
|
|
1351
|
+
/**
|
|
1352
|
+
* onTouch function registered via registerOnTouch (ControlValueAccessor).
|
|
1353
|
+
*
|
|
1132
1354
|
* @docs-private
|
|
1133
1355
|
*/
|
|
1134
1356
|
this.onTouched = () => { };
|
|
1135
1357
|
/** @docs-private */
|
|
1136
|
-
this.configuration = inject(KBQ_FILE_UPLOAD_CONFIGURATION, {
|
|
1137
|
-
optional: true
|
|
1138
|
-
});
|
|
1139
|
-
/** @docs-private */
|
|
1140
1358
|
this.captionContext = computed(() => {
|
|
1141
|
-
const config = this.
|
|
1359
|
+
const config = this.localeConfiguration().single;
|
|
1142
1360
|
switch (this.allowed()) {
|
|
1143
1361
|
case KbqFileUploadAllowedType.Mixed: {
|
|
1144
1362
|
const [before, after] = config.captionTextWithFolder.split('{{ browseLink }}');
|
|
@@ -1160,27 +1378,23 @@ class KbqSingleFileUploadComponent extends KbqFileUploadBase {
|
|
|
1160
1378
|
return { captionText: before, browseLink: config.browseLink };
|
|
1161
1379
|
}
|
|
1162
1380
|
}
|
|
1163
|
-
}, ...(ngDevMode ? [{ debugName: "captionContext" }] : []));
|
|
1164
|
-
this.localeId = toSignal(this.localeService?.changes.asObservable() ?? of(KBQ_DEFAULT_LOCALE_ID));
|
|
1165
|
-
/** @docs-private */
|
|
1166
|
-
this.resolvedLocaleConfig = computed(() => {
|
|
1167
|
-
const localeId = this.localeId();
|
|
1168
|
-
const localeConfig = this.localeConfig();
|
|
1169
|
-
const defaultLocaleConfig = this.localeService && localeId
|
|
1170
|
-
? this.localeService.getParams('fileUpload').single
|
|
1171
|
-
: KBQ_SINGLE_FILE_UPLOAD_DEFAULT_CONFIGURATION;
|
|
1172
|
-
const baseLocaleConfig = this.configuration || defaultLocaleConfig;
|
|
1173
|
-
return { ...baseLocaleConfig, ...localeConfig };
|
|
1174
|
-
}, ...(ngDevMode ? [{ debugName: "resolvedLocaleConfig" }] : []));
|
|
1381
|
+
}, ...(ngDevMode ? [{ debugName: "captionContext" }] : /* istanbul ignore next */ []));
|
|
1175
1382
|
this.focusMonitor = inject(FocusMonitor);
|
|
1383
|
+
this.injector = inject(Injector);
|
|
1176
1384
|
this.platformId = inject(PLATFORM_ID);
|
|
1385
|
+
/** @docs-private */
|
|
1386
|
+
this.errorStateMatcherInput = input(undefined, { ...(ngDevMode ? { debugName: "errorStateMatcherInput" } : /* istanbul ignore next */ {}), alias: 'errorStateMatcher' });
|
|
1387
|
+
/** @docs-private */
|
|
1388
|
+
this.fileInput = input(undefined, { ...(ngDevMode ? { debugName: "fileInput" } : /* istanbul ignore next */ {}), alias: 'file' });
|
|
1177
1389
|
if (this.ngControl) {
|
|
1178
1390
|
// Note: we provide the value accessor through here, instead of
|
|
1179
1391
|
// the `providers` to avoid running into a circular import.
|
|
1180
1392
|
this.ngControl.valueAccessor = this;
|
|
1181
1393
|
}
|
|
1394
|
+
// Opened once, next to the effect rather than inside it: an effect re-run must not add a
|
|
1395
|
+
// second listener to the same stream, or one physical drop adds the file twice.
|
|
1396
|
+
this.dropzoneService.filesDropped.subscribe((files) => this.onFileDropped(files));
|
|
1182
1397
|
effect(() => {
|
|
1183
|
-
this.dropzoneService.filesDropped.subscribe((files) => this.onFileDropped(files));
|
|
1184
1398
|
const fullScreenDropZone = this.fullScreenDropZone();
|
|
1185
1399
|
if (fullScreenDropZone) {
|
|
1186
1400
|
const config = fullScreenDropZone === true ? {} : fullScreenDropZone;
|
|
@@ -1212,29 +1426,47 @@ class KbqSingleFileUploadComponent extends KbqFileUploadBase {
|
|
|
1212
1426
|
});
|
|
1213
1427
|
this.stateChanges.pipe(takeUntilDestroyed(this.destroyRef)).subscribe(() => this.cdr.markForCheck());
|
|
1214
1428
|
}
|
|
1215
|
-
/**
|
|
1216
|
-
*
|
|
1429
|
+
/**
|
|
1430
|
+
* Implemented as part of ControlValueAccessor.
|
|
1431
|
+
*
|
|
1432
|
+
* @docs-private
|
|
1433
|
+
*/
|
|
1217
1434
|
writeValue(file) {
|
|
1435
|
+
// Writes the list directly instead of going through the `file` setter: that setter is the
|
|
1436
|
+
// view→model half of the CVA, so routing Angular's model→view callback through it would mark
|
|
1437
|
+
// the control dirty and re-emit `valueChanges` on every programmatic value — including the
|
|
1438
|
+
// `setValue` that `reset()` runs after `markAsPristine()`. `(fileChange)` is not emitted here
|
|
1439
|
+
// either: it reports a user action, not a value the form pushed in.
|
|
1218
1440
|
// @TODO: remove File from arguments since it redundant. It resolves SSR (#DS-4414)
|
|
1219
|
-
if (!isPlatformBrowser(this.platformId))
|
|
1441
|
+
if (!isPlatformBrowser(this.platformId)) {
|
|
1442
|
+
// Only a plain item can be mapped without the browser `File` API, and that is enough for a
|
|
1443
|
+
// pre-populated form to render (#DS-4414).
|
|
1444
|
+
this.setFileList(file && 'file' in file ? [file] : []);
|
|
1220
1445
|
return;
|
|
1221
|
-
|
|
1222
|
-
this.
|
|
1223
|
-
this.fileQueueChange.emit(this.file);
|
|
1446
|
+
}
|
|
1447
|
+
this.setFileList(file ? [file instanceof File ? this.mapToFileItem(file) : file] : []);
|
|
1224
1448
|
}
|
|
1225
|
-
/**
|
|
1226
|
-
*
|
|
1449
|
+
/**
|
|
1450
|
+
* Implemented as part of ControlValueAccessor.
|
|
1451
|
+
*
|
|
1452
|
+
* @docs-private
|
|
1453
|
+
*/
|
|
1227
1454
|
registerOnChange(fn) {
|
|
1228
1455
|
this.cvaOnChange = fn;
|
|
1229
1456
|
}
|
|
1230
|
-
/**
|
|
1231
|
-
*
|
|
1457
|
+
/**
|
|
1458
|
+
* Implemented as part of ControlValueAccessor.
|
|
1459
|
+
*
|
|
1460
|
+
* @docs-private
|
|
1461
|
+
*/
|
|
1232
1462
|
registerOnTouched(fn) {
|
|
1233
1463
|
this.onTouched = fn;
|
|
1234
1464
|
}
|
|
1235
1465
|
/**
|
|
1236
1466
|
* Sets the disabled state of the control. Implemented as a part of ControlValueAccessor.
|
|
1467
|
+
*
|
|
1237
1468
|
* @param isDisabled Whether the control should be disabled.
|
|
1469
|
+
*
|
|
1238
1470
|
* @docs-private
|
|
1239
1471
|
*/
|
|
1240
1472
|
setDisabledState(isDisabled) {
|
|
@@ -1245,11 +1477,9 @@ class KbqSingleFileUploadComponent extends KbqFileUploadBase {
|
|
|
1245
1477
|
onFileSelectedViaClick({ target }) {
|
|
1246
1478
|
if (this.disabled)
|
|
1247
1479
|
return;
|
|
1248
|
-
const
|
|
1249
|
-
if (
|
|
1250
|
-
this.
|
|
1251
|
-
this.fileChange.emit(this.file);
|
|
1252
|
-
this.fileQueueChange.emit(this.file);
|
|
1480
|
+
const selected = target instanceof HTMLInputElement ? Array.from(target.files ?? []) : [];
|
|
1481
|
+
if (selected.length) {
|
|
1482
|
+
this.addFile(selected);
|
|
1253
1483
|
}
|
|
1254
1484
|
this.onTouched();
|
|
1255
1485
|
// allows the same file selection every time user clicks on the control.
|
|
@@ -1260,32 +1490,63 @@ class KbqSingleFileUploadComponent extends KbqFileUploadBase {
|
|
|
1260
1490
|
if (this.disabled)
|
|
1261
1491
|
return;
|
|
1262
1492
|
if (files?.length) {
|
|
1263
|
-
this.
|
|
1264
|
-
this.fileChange.emit(this.file);
|
|
1265
|
-
this.fileQueueChange.emit(this.file);
|
|
1493
|
+
this.addFile(files);
|
|
1266
1494
|
}
|
|
1267
1495
|
// mark as touched after file drop even if file wasn't correct
|
|
1268
1496
|
this.onTouched();
|
|
1269
1497
|
}
|
|
1270
1498
|
/** @docs-private */
|
|
1271
1499
|
deleteItem(event, origin) {
|
|
1500
|
+
// Untracked: called from a consumer's `effect()`, the state read on the way — the file, `disabled` — would make
|
|
1501
|
+
// the effect run again whenever a file is added, and remove it.
|
|
1502
|
+
untracked(() => this.removeFile(event, origin));
|
|
1503
|
+
}
|
|
1504
|
+
/** Body of `deleteItem()`. */
|
|
1505
|
+
removeFile(event, origin) {
|
|
1272
1506
|
if (this.disabled)
|
|
1273
1507
|
return;
|
|
1274
1508
|
event?.stopPropagation();
|
|
1509
|
+
const removed = this.file;
|
|
1275
1510
|
this.file = null;
|
|
1511
|
+
this.cvaOnChange(null);
|
|
1276
1512
|
this.fileChange.emit(this.file);
|
|
1277
|
-
this.fileQueueChange.emit(this.file);
|
|
1278
1513
|
// mark as touched after file drop even if file wasn't correct
|
|
1279
1514
|
this.onTouched();
|
|
1280
|
-
if (
|
|
1281
|
-
|
|
1282
|
-
|
|
1283
|
-
|
|
1284
|
-
|
|
1285
|
-
|
|
1286
|
-
|
|
1515
|
+
if (removed) {
|
|
1516
|
+
this.announce(this.withFileName(this.localeConfiguration().a11y.fileRemoved, removed.file.name));
|
|
1517
|
+
}
|
|
1518
|
+
// The input to focus is rendered in place of the file.
|
|
1519
|
+
afterNextRender(() => {
|
|
1520
|
+
const input = this.input?.nativeElement;
|
|
1521
|
+
if (input) {
|
|
1522
|
+
this.focusMonitor.focusVia(input, origin ?? 'keyboard');
|
|
1523
|
+
}
|
|
1524
|
+
}, { injector: this.injector });
|
|
1525
|
+
}
|
|
1526
|
+
/**
|
|
1527
|
+
* Marks the control touched once focus leaves the whole uploader, so the default
|
|
1528
|
+
* `ErrorStateMatcher` shows a `required` error to a user who tabbed through without attaching
|
|
1529
|
+
* anything. Moving between the browse link and the remove control stays inside and does not count.
|
|
1530
|
+
*
|
|
1531
|
+
* @docs-private
|
|
1532
|
+
*/
|
|
1533
|
+
onFocusOut({ relatedTarget }) {
|
|
1534
|
+
if (this.elementRef.nativeElement.contains(relatedTarget))
|
|
1287
1535
|
return;
|
|
1536
|
+
this.onTouched();
|
|
1537
|
+
this.stateChanges.next();
|
|
1538
|
+
}
|
|
1539
|
+
/** Keeps the first file — the component holds one — and reports the rest as rejected. */
|
|
1540
|
+
addFile(files) {
|
|
1541
|
+
this.file = this.mapToFileItem(files[0]);
|
|
1542
|
+
this.cvaOnChange(this.file);
|
|
1543
|
+
this.fileChange.emit(this.file);
|
|
1544
|
+
const config = this.localeConfiguration().a11y;
|
|
1545
|
+
const discarded = files.slice(1);
|
|
1546
|
+
if (discarded.length) {
|
|
1547
|
+
this.rejected.emit(discarded);
|
|
1288
1548
|
}
|
|
1549
|
+
this.announce(this.withFileName(config.fileAdded, files[0].name), discarded.length ? config.filesNotAdded : '');
|
|
1289
1550
|
}
|
|
1290
1551
|
mapToFileItem(file) {
|
|
1291
1552
|
return {
|
|
@@ -1294,13 +1555,13 @@ class KbqSingleFileUploadComponent extends KbqFileUploadBase {
|
|
|
1294
1555
|
loading: new BehaviorSubject(false)
|
|
1295
1556
|
};
|
|
1296
1557
|
}
|
|
1297
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1298
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.30", type: KbqSingleFileUploadComponent, isStandalone: true, selector: "kbq-single-file-upload,kbq-file-upload:not([multiple])", inputs: { progressMode: { classPropertyName: "progressMode", publicName: "progressMode", isSignal: true, isRequired: false, transformFunction: null }, accept: { classPropertyName: "accept", publicName: "accept", isSignal: true, isRequired: false, transformFunction: null }, inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: false, transformFunction: null }, errorStateMatcher: { classPropertyName: "errorStateMatcher", publicName: "errorStateMatcher", isSignal: false, isRequired: false, transformFunction: null }, file: { classPropertyName: "file", publicName: "file", isSignal: false, isRequired: false, transformFunction: null }, showFileSize: { classPropertyName: "showFileSize", publicName: "showFileSize", isSignal: true, isRequired: false, transformFunction: null }, allowed: { classPropertyName: "allowed", publicName: "allowed", isSignal: true, isRequired: false, transformFunction: null }, fullScreenDropZone: { classPropertyName: "fullScreenDropZone", publicName: "fullScreenDropZone", isSignal: true, isRequired: false, transformFunction: null }, localeConfig: { classPropertyName: "localeConfig", publicName: "localeConfig", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { fileChange: "fileChange", fileQueueChange: "fileQueueChange" }, host: { properties: { "class.kbq-single-file-upload_selected": "!!file" }, classAttribute: "kbq-single-file-upload" }, providers: [KbqFullScreenDropzoneService], queries: [{ propertyName: "hint", predicate: KbqHint, isSignal: true }], viewQueries: [{ propertyName: "fileLoader", first: true, predicate: KbqFileLoader, descendants: true, isSignal: true }], usesInheritance: true, hostDirectives: [{ directive: KbqFileUploadContext, inputs: ["id", "id", "disabled", "disabled", "multiple", "multiple"] }, { directive: KbqFileList }], ngImport: i0, template: "<div\n kbqFileDrop\n class=\"kbq-file-upload\"\n [class.kbq-disabled]=\"disabled\"\n [class.kbq-error]=\"invalid\"\n [disabled]=\"!!fullScreenDropZone()\"\n (filesDropped)=\"onFileDropped($event)\"\n>\n @if (!file) {\n <div class=\"kbq-file-dropzone\">\n <i kbq-icon=\"kbq-arrow-up-from-bracket_16\" class=\"kbq-file-upload__dropzone-icon\"></i>\n <span class=\"kbq-file-upload__dropzone-caption\">\n <ng-container *ngTemplateOutlet=\"captionText; context: captionContext()\" />\n </span>\n </div>\n } @else {\n @if (file) {\n <div class=\"kbq-file-item\">\n <div class=\"kbq-file-item__text-wrapper\">\n @if ({ loading: file.loading | async, progress: file.progress | async }; as asyncData) {\n @if (!asyncData.loading) {\n <ng-content select=\"[kbq-icon]\" />\n } @else {\n <kbq-progress-spinner [mode]=\"progressMode()\" [value]=\"asyncData.progress || 0\" />\n }\n }\n <div class=\"kbq-file-item__text\" [kbqEllipsisCenter]=\"file.file.name\" [minVisibleLength]=\"10\"></div>\n </div>\n @if (showFileSize()) {\n <div class=\"kbq-file-item__size\">\n {{ file.file.size | kbqDataSize }}\n </div>\n }\n </div>\n <i\n kbq-icon-button=\"kbq-circle-xmark_16\"\n class=\"kbq-file-upload__action\"\n [color]=\"invalid ? 'error' : 'contrast-fade'\"\n [disabled]=\"disabled\"\n (click)=\"deleteItem($event, 'program')\"\n (keydown.backspace)=\"deleteItem()\"\n (keydown.delete)=\"deleteItem()\"\n ></i>\n }\n }\n</div>\n\n@if (hasHint) {\n <div class=\"kbq-file-upload__hint\">\n <ng-content select=\"kbq-hint\" />\n </div>\n}\n\n<ng-template\n #captionText\n let-captionText=\"captionText\"\n let-browseLink=\"browseLink\"\n let-captionTextSeparator=\"captionTextSeparator\"\n let-browseLinkFolder=\"browseLinkFolder\"\n>\n @if (captionText) {\n {{ captionText }}\n }\n @if (browseLink) {\n <label\n kbq-link\n pseudo\n kbqFileLoader\n [onlyDirectory]=\"null\"\n [accept]=\"acceptedFiles\"\n [disabled]=\"disabled\"\n [for]=\"fileUploadContext.id() || inputId()\"\n [tabIndex]=\"-1\"\n [multiple]=\"true\"\n (fileChange)=\"onFileSelectedViaClick($event)\"\n >\n {{ browseLink }}\n </label>\n }\n @if (captionTextSeparator) {\n {{ captionTextSeparator }}\n }\n @if (browseLinkFolder) {\n <label\n kbq-link\n pseudo\n kbqFileLoader\n [onlyDirectory]=\"true\"\n [disabled]=\"disabled\"\n [tabIndex]=\"-1\"\n (fileChange)=\"onFileSelectedViaClick($event)\"\n >\n {{ browseLinkFolder }}\n </label>\n }\n</ng-template>\n", styles: [".kbq-form-field{--kbq-form-field-label-margin-bottom: var(--kbq-size-xs);position:relative;display:inline-block;width:100%}.kbq-form-field.kbq-form-field_horizontal{display:flex;flex-direction:row;align-items:flex-start}.kbq-form-field.kbq-form-field_horizontal .kbq-form-field__label{--kbq-form-field-label-margin-bottom: 0;padding:var(--kbq-size-xs) var(--kbq-size-l) 0 0}.kbq-form-field .kbq-form-field__content{flex:1}.kbq-form-field .kbq-form-field__label{box-sizing:border-box;display:flex;margin-bottom:var(--kbq-form-field-label-margin-bottom)}.kbq-form-field.kbq-form-field-type-select .kbq-form-field__suffix{margin-right:0}.kbq-form-field .kbq-form-field__container{box-sizing:border-box;display:flex;justify-content:space-between;align-items:center;border-width:var(--kbq-form-field-size-border-width);border-style:solid;border-color:transparent;border-radius:var(--kbq-form-field-size-border-radius);padding-left:var(--kbq-form-field-size-container-left-padding);padding-right:var(--kbq-form-field-size-container-right-padding)}.kbq-form-field .kbq-form-field__container:has(.kbq-textarea){--kbq-form-field-size-container-left-padding: 0;--kbq-form-field-size-container-right-padding: 0}.kbq-form-field .kbq-form-field:not(.kbq-form-field-type-textarea){height:var(--kbq-form-field-size-height)}.kbq-form-field .kbq-form-field__infix{box-sizing:border-box;width:100%;flex-grow:1;padding-left:var(--kbq-form-field-size-infix-left-padding)}.kbq-form-field .kbq-form-field__infix:has(.kbq-select_multiple,.kbq-select_multiline):not(:has(.kbq-select__trigger_empty)),.kbq-form-field .kbq-form-field__infix:has(.kbq-tag-list),.kbq-form-field .kbq-form-field__infix:has(.kbq-textarea){padding-left:0;max-width:100%}.kbq-form-field .kbq-form-field__infix:has(.kbq-select_multiple,.kbq-select_multiline):has(kbq-select-trigger,[kbq-select-trigger]){padding-left:var(--kbq-form-field-size-infix-left-padding)}.kbq-form-field .kbq-form-field__infix .kbq-input,.kbq-form-field .kbq-form-field__infix .kbq-tag-input{padding-right:var(--kbq-form-field-size-infix-right-padding)}.kbq-form-field,.kbq-form-field .kbq-textarea{border-radius:var(--kbq-form-field-size-border-radius)}.kbq-form-field:hover{z-index:1}.kbq-form-field.cdk-focused,.kbq-form-field.kbq-focused{z-index:3}.kbq-form-field.kbq-form-field_without-borders .kbq-form-field__container,.kbq-form-field.kbq-form-field_no-borders .kbq-form-field__container{border-color:transparent!important;box-shadow:none!important}.kbq-form-field.kbq-form-field_in-overlay .kbq-form-field__container{background-color:var(--kbq-background-card)!important}.kbq-form-field+.kbq-password-hint{margin-top:var(--kbq-size-m)}.kbq-form-field .kbq-form-field__prefix,.kbq-form-field .kbq-form-field__suffix{display:flex;justify-content:center;align-items:center}.kbq-form-field .kbq-form-field__prefix .kbq-prefix,.kbq-form-field .kbq-form-field__prefix .kbq-suffix,.kbq-form-field .kbq-form-field__suffix .kbq-prefix,.kbq-form-field .kbq-form-field__suffix .kbq-suffix{min-width:var(--kbq-form-field-size-addon-width);text-align:center}.kbq-form-field .kbq-form-field__prefix+.kbq-form-field__infix{padding-left:0}.kbq-form-field .kbq-form-field__hint{display:flex;flex-direction:column;gap:var(--kbq-form-field-hint-size-gap);margin-top:var(--kbq-form-field-hint-size-margin-top)}.kbq-form-field .kbq-form-field__hint:has(.kbq-reactive-password-hint,.kbq-password-hint){--kbq-form-field-hint-size-gap: var(--kbq-size-s)}.kbq-form-field .kbq-form-field__hint:has(:is(.kbq-reactive-password-hint,.kbq-password-hint):first-child){--kbq-form-field-hint-size-margin-top: var(--kbq-size-m)}.kbq-form-field .kbq-form-field__container{border-color:var(--kbq-form-field-default-border-color);background-color:var(--kbq-form-field-default-background)}.kbq-form-field .kbq-input,.kbq-form-field .kbq-tag-input,.kbq-form-field .kbq-textarea{--kbq-form-field-resolved-text: var(--kbq-form-field-default-text);color:var(--kbq-form-field-resolved-text)}.kbq-form-field .kbq-input::placeholder,.kbq-form-field .kbq-tag-input::placeholder,.kbq-form-field .kbq-textarea::placeholder{color:var(--kbq-form-field-default-placeholder)}.kbq-form-field .kbq-input::-ms-input-placeholder,.kbq-form-field .kbq-tag-input::-ms-input-placeholder,.kbq-form-field .kbq-textarea::-ms-input-placeholder{color:var(--kbq-form-field-default-placeholder)}.kbq-form-field .kbq-input::-webkit-input-placeholder,.kbq-form-field .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field .kbq-textarea::-webkit-input-placeholder{color:var(--kbq-form-field-default-placeholder)}.kbq-form-field .kbq-input:is(:autofill,:-webkit-autofill),.kbq-form-field .kbq-tag-input:is(:autofill,:-webkit-autofill),.kbq-form-field .kbq-textarea:is(:autofill,:-webkit-autofill){transition-property:background-color;transition-duration:600000s;-webkit-text-fill-color:var(--kbq-form-field-resolved-text, var(--kbq-form-field-default-text));caret-color:var(--kbq-form-field-resolved-text, var(--kbq-form-field-default-text))}.kbq-form-field.kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field_has-validate-directive.ng-invalid .kbq-form-field__container{border-color:var(--kbq-form-field-states-error-border-color);background-color:var(--kbq-form-field-states-error-background)}.kbq-form-field.kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field_has-validate-directive.ng-invalid .kbq-input,.kbq-form-field.kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input,.kbq-form-field.kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea{--kbq-form-field-resolved-text: var(--kbq-form-field-states-error-text);color:var(--kbq-form-field-resolved-text)}.kbq-form-field.kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field_has-validate-directive.ng-invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::placeholder{color:var(--kbq-form-field-states-error-placeholder)}.kbq-form-field.kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-ms-input-placeholder{color:var(--kbq-form-field-states-error-placeholder)}.kbq-form-field.kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-webkit-input-placeholder{color:var(--kbq-form-field-states-error-placeholder)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container{border-color:var(--kbq-form-field-states-focused-border-color);background-color:var(--kbq-form-field-states-focused-background)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea{--kbq-form-field-resolved-text: var(--kbq-form-field-states-focused-text);color:var(--kbq-form-field-resolved-text)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder{color:var(--kbq-form-field-states-focused-placeholder)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder{color:var(--kbq-form-field-states-focused-placeholder)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder{color:var(--kbq-form-field-states-focused-placeholder)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container{box-shadow:inset 0 0 .1px var(--kbq-form-field-size-focus-outline-width) var(--kbq-form-field-states-focused-focus-outline)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-form-field__container{border-color:var(--kbq-form-field-states-error-border-color);background-color:var(--kbq-form-field-states-error-background)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea{--kbq-form-field-resolved-text: var(--kbq-form-field-states-error-text);color:var(--kbq-form-field-resolved-text)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::placeholder{color:var(--kbq-form-field-states-error-placeholder)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-ms-input-placeholder{color:var(--kbq-form-field-states-error-placeholder)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-webkit-input-placeholder{color:var(--kbq-form-field-states-error-placeholder)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid.cdk-focused .kbq-form-field__container{box-shadow:inset 0 0 .1px var(--kbq-form-field-size-focus-outline-width) var(--kbq-form-field-states-error-focused-focus-outline)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-icon.kbq-empty{color:var(--kbq-form-field-states-error-text);-webkit-text-fill-color:var(--kbq-form-field-states-error-text)}.kbq-form-field .kbq-form-field__label{color:var(--kbq-form-field-label-color)}.kbq-form-field .kbq-form-field__container:has(:is(.kbq-input,.kbq-tag-input,.kbq-textarea):is(:autofill,:-webkit-autofill)){background-image:linear-gradient(var(--kbq-form-field-states-autofill-background),var(--kbq-form-field-states-autofill-background))}.kbq-form-field.kbq-disabled .kbq-form-field__container{border-color:var(--kbq-form-field-states-disabled-border-color);background-color:var(--kbq-form-field-states-disabled-background)}.kbq-form-field.kbq-disabled .kbq-input,.kbq-form-field.kbq-disabled .kbq-tag-input,.kbq-form-field.kbq-disabled .kbq-textarea{--kbq-form-field-resolved-text: var(--kbq-form-field-states-disabled-text);color:var(--kbq-form-field-resolved-text)}.kbq-form-field.kbq-disabled .kbq-input::placeholder,.kbq-form-field.kbq-disabled .kbq-tag-input::placeholder,.kbq-form-field.kbq-disabled .kbq-textarea::placeholder{color:var(--kbq-form-field-states-disabled-placeholder)}.kbq-form-field.kbq-disabled .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-disabled .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-disabled .kbq-textarea::-ms-input-placeholder{color:var(--kbq-form-field-states-disabled-placeholder)}.kbq-form-field.kbq-disabled .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-disabled .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-disabled .kbq-textarea::-webkit-input-placeholder{color:var(--kbq-form-field-states-disabled-placeholder)}.kbq-form-field.kbq-disabled .kbq-icon.kbq-empty{color:var(--kbq-form-field-states-disabled-text);-webkit-text-fill-color:var(--kbq-form-field-states-disabled-text)}.kbq-form-field .kbq-form-field__prefix .kbq-icon.kbq-empty,.kbq-form-field .kbq-form-field__suffix .kbq-icon.kbq-empty{color:var(--kbq-icon-contrast-fade)}.kbq-form-field .kbq-form-field__hint>.kbq-hint:not(.kbq-password-hint,.kbq-contrast-fade,.kbq-success,.kbq-warning,.kbq-error){color:var(--kbq-form-field-hint-text)}.kbq-form-field{font-size:var(--kbq-typography-text-normal-font-size);font-style:var(--kbq-typography-text-normal-font-style);font-weight:var(--kbq-typography-text-normal-font-weight);line-height:var(--kbq-typography-text-normal-line-height);font-family:var(--kbq-typography-text-normal-font-family);text-transform:var(--kbq-typography-text-normal-text-transform);font-feature-settings:var(--kbq-typography-text-normal-font-feature-settings);letter-spacing:var(--kbq-typography-text-normal-letter-spacing)}.kbq-form-field .kbq-form-field__hint>.kbq-hint:not(.kbq-password-hint,.kbq-reactive-password-hint,.kbq-contrast-fade,.kbq-success,.kbq-warning) .kbq-hint__text{font-size:var(--kbq-typography-text-compact-font-size);font-style:var(--kbq-typography-text-compact-font-style);font-weight:var(--kbq-typography-text-compact-font-weight);line-height:var(--kbq-typography-text-compact-line-height);font-family:var(--kbq-typography-text-compact-font-family);text-transform:var(--kbq-typography-text-compact-text-transform);font-feature-settings:var(--kbq-typography-text-compact-font-feature-settings);letter-spacing:var(--kbq-typography-text-compact-letter-spacing)}.kbq-file-upload{box-sizing:border-box;display:flex;align-items:center;position:relative}.kbq-file-upload .kbq-file-item{display:flex;align-items:center}.kbq-file-upload .kbq-file-dropzone{display:flex;align-items:baseline;gap:var(--dropzone-gap, var(--kbq-file-upload-size-dropzone-content-gap-horizontal))}.kbq-file-upload__hint{display:flex;flex-direction:column;gap:var(--kbq-form-field-hint-size-gap);margin-top:var(--kbq-form-field-hint-size-margin-top)}.kbq-file-upload__hint:has(.kbq-reactive-password-hint,.kbq-password-hint){--kbq-form-field-hint-size-gap: var(--kbq-size-s)}.kbq-file-upload__hint:has(:is(.kbq-reactive-password-hint,.kbq-password-hint):first-child){--kbq-form-field-hint-size-margin-top: var(--kbq-size-m)}:where(.kbq-file-upload__hint .kbq-hint){color:var(--kbq-foreground-contrast-secondary)}.kbq-file-upload{font-size:var(--kbq-typography-text-normal-font-size);font-style:var(--kbq-typography-text-normal-font-style);font-weight:var(--kbq-typography-text-normal-font-weight);line-height:var(--kbq-typography-text-normal-line-height);font-family:var(--kbq-typography-text-normal-font-family);text-transform:var(--kbq-typography-text-normal-text-transform);font-feature-settings:var(--kbq-typography-text-normal-font-feature-settings);letter-spacing:var(--kbq-typography-text-normal-letter-spacing)}.kbq-file-upload__hint .kbq-hint .kbq-hint__text{font-size:var(--kbq-typography-text-compact-font-size);font-style:var(--kbq-typography-text-compact-font-style);font-weight:var(--kbq-typography-text-compact-font-weight);line-height:var(--kbq-typography-text-compact-line-height);font-family:var(--kbq-typography-text-compact-font-family);text-transform:var(--kbq-typography-text-compact-text-transform);font-feature-settings:var(--kbq-typography-text-compact-font-feature-settings);letter-spacing:var(--kbq-typography-text-compact-letter-spacing)}\n", ":where(.kbq-file-upload){--kbq-file-upload-size-dropzone-content-gap-horizontal: var(--kbq-size-s);--kbq-form-field-hint-text: var(--kbq-foreground-contrast-secondary)}:where(.kbq-single-file-upload){--kbq-form-field-hint-size-margin-top: var(--kbq-size-xs);--kbq-form-field-hint-size-gap: var(--kbq-size-xxs);--kbq-file-upload-size-single-container-border-radius: var(--kbq-size-s);--kbq-file-upload-size-single-container-border-width: 1px;--kbq-file-upload-size-single-container-content-gap-horizontal: var(--kbq-size-s);--kbq-file-upload-size-single-container-padding-vertical: var(--kbq-size-m);--kbq-file-upload-size-single-container-padding-horizontal: var(--kbq-size-l);--kbq-file-upload-size-single-text-block-padding-vertical: var(--kbq-size-3xs);--kbq-file-upload-size-single-text-block-content-gap-horizontal: var(--kbq-size-xxs);--kbq-file-upload-single-min-height: 44px;--kbq-file-upload-single-default-container-border: var(--kbq-line-contrast-fade);--kbq-file-upload-single-default-container-background: var(--kbq-background-bg);--kbq-file-upload-single-default-dropzone-icon-color: var(--kbq-icon-contrast-fade);--kbq-file-upload-single-default-left-icon-color: var(--kbq-icon-contrast-fade);--kbq-file-upload-single-default-text-block-color: var(--kbq-foreground-contrast);--kbq-file-upload-single-default-file-size-text-color: var(--kbq-foreground-contrast-secondary);--kbq-file-upload-single-states-on-drag-container-border: var(--kbq-line-theme-fade);--kbq-file-upload-single-states-on-drag-container-background: var(--kbq-background-theme-fade);--kbq-file-upload-single-states-on-drag-dropzone-icon-color: var(--kbq-icon-contrast-fade);--kbq-file-upload-single-states-on-drag-left-icon-color: var(--kbq-icon-contrast-fade);--kbq-file-upload-single-states-on-drag-text-block-color: var(--kbq-foreground-contrast);--kbq-file-upload-single-states-error-container-border: var(--kbq-line-error);--kbq-file-upload-single-states-error-container-background: var(--kbq-background-error-less);--kbq-file-upload-single-states-error-dropzone-icon-color: var(--kbq-icon-error);--kbq-file-upload-single-states-error-left-icon-color: var(--kbq-icon-error);--kbq-file-upload-single-states-error-text-block-color: var(--kbq-foreground-error);--kbq-file-upload-single-states-error-file-size-text-color: var(--kbq-foreground-error);--kbq-file-upload-single-states-disabled-container-border: var(--kbq-states-line-disabled);--kbq-file-upload-single-states-disabled-container-background: var(--kbq-states-background-disabled);--kbq-file-upload-single-states-disabled-dropzone-icon-color: var(--kbq-states-icon-disabled);--kbq-file-upload-single-states-disabled-left-icon-color: var(--kbq-states-icon-disabled);--kbq-file-upload-single-states-disabled-text-block-color: var(--kbq-states-foreground-disabled);--kbq-file-upload-single-states-disabled-file-size-text-color: var(--kbq-states-foreground-disabled);--kbq-file-upload-single-states-focused-focus-outline-color: var(--kbq-states-line-focus-theme)}:where(.kbq-multiple-file-upload){--kbq-form-field-hint-size-margin-top: var(--kbq-size-xs);--kbq-form-field-hint-size-gap: var(--kbq-size-xxs);--kbq-file-upload-size-multiple-min-height: 120px;--kbq-file-upload-size-multiple-max-height: unset;--kbq-file-upload-size-multiple-big-container-min-height: 192px;--kbq-file-upload-size-multiple-big-container-min-width: 320px;--kbq-file-upload-size-multiple-big-container-border-radius: var(--kbq-size-s);--kbq-file-upload-size-multiple-big-container-border-width: 1px;--kbq-file-upload-size-multiple-big-container-content-gap-horizontal: var(--kbq-size-m);--kbq-file-upload-size-multiple-big-container-padding-vertical: var(--kbq-size-xxl);--kbq-file-upload-size-multiple-big-container-padding-horizontal: var(--kbq-size-xxl);--kbq-file-upload-size-multiple-big-dropzone-content-gap-horizontal: var(--kbq-size-s);--kbq-file-upload-size-multiple-big-text-block-content-gap-vertical: 0px;--kbq-file-upload-size-multiple-big-text-block-content-gap-horizontal: var(--kbq-size-xxs);--kbq-file-upload-size-multiple-big-grid-cell-padding-horizontal: var(--kbq-size-s);--kbq-file-upload-size-multiple-big-grid-cell-padding-vertical: var(--kbq-size-s);--kbq-file-upload-size-multiple-big-grid-cell-content-gap-horizontal: var(--kbq-size-s);--kbq-file-upload-size-multiple-big-grid-cell-file-size-width: var(--kbq-size-7xl);--kbq-file-upload-multiple-default-container-border: var(--kbq-line-contrast-fade);--kbq-file-upload-multiple-default-container-background: var(--kbq-background-bg);--kbq-file-upload-multiple-default-upload-icon-color: var(--kbq-icon-contrast);--kbq-file-upload-multiple-default-dropzone-icon-color: var(--kbq-icon-contrast-fade);--kbq-file-upload-multiple-default-left-icon-color: var(--kbq-icon-contrast-fade);--kbq-file-upload-multiple-default-text-block-color: var(--kbq-foreground-contrast);--kbq-file-upload-multiple-default-grid-divider-color: var(--kbq-line-contrast-less);--kbq-file-upload-multiple-default-file-size-text-color: var(--kbq-foreground-contrast-secondary);--kbq-file-upload-multiple-states-on-drag-container-border: var(--kbq-line-theme-fade);--kbq-file-upload-multiple-states-on-drag-container-background: var(--kbq-background-theme-fade);--kbq-file-upload-multiple-states-on-drag-upload-icon-color: var(--kbq-icon-contrast);--kbq-file-upload-multiple-states-on-drag-dropzone-icon-color: var(--kbq-icon-contrast-fade);--kbq-file-upload-multiple-states-on-drag-left-icon-color: var(--kbq-icon-contrast-fade);--kbq-file-upload-multiple-states-on-drag-text-block-color: var(--kbq-foreground-contrast);--kbq-file-upload-multiple-states-on-drag-grid-divider-color: var(--kbq-line-contrast-less);--kbq-file-upload-multiple-states-error-container-border: var(--kbq-line-error);--kbq-file-upload-multiple-states-error-container-background: var(--kbq-background-error-less);--kbq-file-upload-multiple-states-error-upload-icon-color: var(--kbq-icon-error);--kbq-file-upload-multiple-states-error-dropzone-icon-color: var(--kbq-icon-error);--kbq-file-upload-multiple-states-error-left-icon-color: var(--kbq-icon-error);--kbq-file-upload-multiple-states-error-icon-button-color: var(--kbq-icon-error);--kbq-file-upload-multiple-states-error-text-block-color: var(--kbq-foreground-error);--kbq-file-upload-multiple-states-disabled-container-border: var(--kbq-states-line-disabled);--kbq-file-upload-multiple-states-disabled-container-background: var(--kbq-states-background-disabled);--kbq-file-upload-multiple-states-disabled-upload-icon-color: var(--kbq-states-icon-disabled);--kbq-file-upload-multiple-states-disabled-dropzone-icon-color: var(--kbq-states-icon-disabled);--kbq-file-upload-multiple-states-disabled-left-icon-color: var(--kbq-states-icon-disabled);--kbq-file-upload-multiple-states-disabled-text-block-color: var(--kbq-states-foreground-disabled);--kbq-file-upload-multiple-states-disabled-grid-divider-color: var(--kbq-states-line-disabled);--kbq-file-upload-multiple-states-focused-focus-outline-color: var(--kbq-states-line-focus-theme)}:where(.kbq-file-upload.kbq-file-upload_compact){--kbq-file-upload-multiple-compact-container-content-gap-horizontal: var(--kbq-size-s);--kbq-file-upload-multiple-compact-text-block-padding-vertical: var(--kbq-size-3xs);--kbq-file-upload-multiple-compact-container-padding-vertical: 11px;--kbq-file-upload-multiple-compact-container-padding-horizontal: 15px}\n", ".kbq-single-file-upload .kbq-file-upload__dropzone-icon>svg{vertical-align:bottom}.kbq-single-file-upload.kbq-single-file-upload_selected .kbq-file-upload .kbq-file-item{padding:calc(var(--kbq-file-upload-size-single-container-padding-vertical) - var(--kbq-file-upload-size-single-container-border-width)) calc(var(--kbq-file-upload-size-single-container-padding-horizontal) - var(--kbq-file-upload-size-single-container-border-width));padding-right:0}.kbq-single-file-upload:not(.kbq-single-file-upload_selected) .kbq-file-upload{padding:calc(var(--kbq-file-upload-size-single-container-padding-vertical) - var(--kbq-file-upload-size-single-container-border-width)) calc(var(--kbq-file-upload-size-single-container-padding-horizontal) - var(--kbq-file-upload-size-single-container-border-width))}.kbq-single-file-upload .kbq-file-upload{min-height:var(--kbq-file-upload-single-min-height);border-radius:var(--kbq-file-upload-size-single-container-border-radius);border-width:var(--kbq-file-upload-size-single-container-border-width);border-style:dashed}.kbq-single-file-upload .kbq-file-upload .kbq-file-item{width:100%;min-width:0}.kbq-single-file-upload .kbq-file-upload .kbq-file-item .kbq-file-item__text-wrapper{display:flex;align-items:center;width:100%;min-width:0;gap:var(--kbq-file-upload-size-single-container-content-gap-horizontal)}.kbq-single-file-upload .kbq-file-upload .kbq-file-item .kbq-file-item__text-wrapper .kbq-file-item__text{flex:1 1 auto}.kbq-single-file-upload .kbq-file-upload .kbq-file-item .kbq-file-item__size{padding:0 var(--kbq-size-s)}.kbq-single-file-upload .kbq-file-upload .kbq-file-upload__action{padding:13px}.kbq-single-file-upload .kbq-file-upload{background-color:var(--kbq-file-upload-single-default-container-background);border-color:var(--kbq-file-upload-single-default-container-border)!important}.kbq-single-file-upload .kbq-file-upload:not(.kbq-disabled,.kbq-error) .kbq-file-upload__dropzone-icon{color:var(--kbq-file-upload-single-default-dropzone-icon-color)}.kbq-single-file-upload .kbq-file-upload:not(.kbq-disabled,.kbq-error) .kbq-file-item__text-wrapper .kbq-icon.kbq-empty{color:var(--kbq-file-upload-single-default-left-icon-color)}.kbq-single-file-upload .kbq-file-upload:not(.kbq-disabled,.kbq-error) .kbq-file-item__size{color:var(--kbq-file-upload-single-default-file-size-text-color)}.kbq-single-file-upload .kbq-file-upload.kbq-file-drop_dragover{background-color:var(--kbq-file-upload-single-states-on-drag-container-background);border-color:var(--kbq-file-upload-single-states-on-drag-container-border)!important}.kbq-single-file-upload .kbq-file-upload.kbq-error:not(.kbq-disabled):not(.kbq-file-drop_dragover){background-color:var(--kbq-file-upload-single-states-error-container-background);border-color:var(--kbq-file-upload-single-states-error-container-border)!important}.kbq-single-file-upload .kbq-file-upload.kbq-error:not(.kbq-disabled) .kbq-file-upload__dropzone-icon{color:var(--kbq-file-upload-single-states-error-dropzone-icon-color)}.kbq-single-file-upload .kbq-file-upload.kbq-error:not(.kbq-disabled) .kbq-file-item__text-wrapper .kbq-icon.kbq-empty{color:var(--kbq-file-upload-single-states-error-left-icon-color)}.kbq-single-file-upload .kbq-file-upload.kbq-error:not(.kbq-disabled) .kbq-file-item__text,.kbq-single-file-upload .kbq-file-upload.kbq-error:not(.kbq-disabled) .kbq-file-upload__dropzone-caption:not(.kbq-link){color:var(--kbq-file-upload-single-states-error-text-block-color)}.kbq-single-file-upload .kbq-file-upload.kbq-error:not(.kbq-disabled) .kbq-file-item__size{color:var(--kbq-file-upload-single-states-error-file-size-text-color)}.kbq-single-file-upload .kbq-file-upload.kbq-disabled{background-color:var(--kbq-file-upload-single-states-disabled-container-background);border-color:var(--kbq-file-upload-single-states-disabled-container-border)!important}.kbq-single-file-upload .kbq-file-upload.kbq-disabled .kbq-file-upload__dropzone-icon{color:var(--kbq-file-upload-single-states-disabled-dropzone-icon-color)}.kbq-single-file-upload .kbq-file-upload.kbq-disabled .kbq-file-item__text-wrapper .kbq-icon.kbq-empty{color:var(--kbq-file-upload-single-states-disabled-left-icon-color)}.kbq-single-file-upload .kbq-file-upload.kbq-disabled .kbq-file-upload__dropzone-caption,.kbq-single-file-upload .kbq-file-upload.kbq-disabled .kbq-file-item__text{color:var(--kbq-file-upload-single-states-disabled-text-block-color)}.kbq-single-file-upload .kbq-file-upload.kbq-disabled .kbq-file-item__size{color:var(--kbq-file-upload-single-states-disabled-file-size-text-color)}\n"], dependencies: [{ kind: "directive", type: KbqFileDropDirective, selector: "[kbqFileDrop]", exportAs: ["kbqFileDrop"] }, { kind: "directive", type: KbqLink, selector: "[kbq-link]", inputs: ["disabled", "tabIndex", "pseudo", "noUnderline", "big", "compact", "multiline", "useVisited", "print"], exportAs: ["kbqLink"] }, { kind: "component", type: KbqIcon, selector: "[kbq-icon]", inputs: ["small", "autoColor", "kbq-icon"] }, { kind: "component", type: KbqIconButton, selector: "[kbq-icon-button]", inputs: ["size", "small", "kbq-icon-button", "tabindex", "disabled"] }, { kind: "component", type: KbqProgressSpinner, selector: "kbq-progress-spinner", inputs: ["id", "value", "mode", "size"] }, { kind: "directive", type: KbqEllipsisCenterDirective, selector: "[kbqEllipsisCenter]", inputs: ["kbqEllipsisCenter", "minVisibleLength", "charWidth", "debounceInterval"] }, { kind: "component", type: KbqFileLoader, selector: "[kbqFileLoader]", inputs: ["disabled", "multiple", "accept", "for", "onlyDirectory"], outputs: ["fileChange"], exportAs: ["kbqFileLoader"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: KbqDataSizePipe, name: "kbqDataSize" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
1558
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KbqSingleFileUploadComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1559
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.25", type: KbqSingleFileUploadComponent, isStandalone: true, selector: "kbq-single-file-upload,kbq-file-upload:not([multiple])", inputs: { progressMode: { classPropertyName: "progressMode", publicName: "progressMode", isSignal: true, isRequired: false, transformFunction: null }, accept: { classPropertyName: "accept", publicName: "accept", isSignal: true, isRequired: false, transformFunction: null }, inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: false, transformFunction: null }, showFileSize: { classPropertyName: "showFileSize", publicName: "showFileSize", isSignal: true, isRequired: false, transformFunction: null }, allowed: { classPropertyName: "allowed", publicName: "allowed", isSignal: true, isRequired: false, transformFunction: null }, fullScreenDropZone: { classPropertyName: "fullScreenDropZone", publicName: "fullScreenDropZone", isSignal: true, isRequired: false, transformFunction: null }, errorStateMatcherInput: { classPropertyName: "errorStateMatcherInput", publicName: "errorStateMatcher", isSignal: true, isRequired: false, transformFunction: null }, fileInput: { classPropertyName: "fileInput", publicName: "file", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { fileChange: "fileChange", rejected: "rejected" }, host: { listeners: { "focusout": "onFocusOut($event)" }, properties: { "class.kbq-single-file-upload_selected": "!!file" }, classAttribute: "kbq-single-file-upload" }, providers: [KbqFullScreenDropzoneService], queries: [{ propertyName: "hint", predicate: KbqHint, isSignal: true }], viewQueries: [{ propertyName: "fileLoader", first: true, predicate: KbqFileLoader, descendants: true, isSignal: true }], usesInheritance: true, usesOnChanges: true, hostDirectives: [{ directive: i1$1.KbqLocaleOverridesDirective, inputs: ["kbqLocaleOverrides", "localeOverrides"] }, { directive: KbqFileUploadContext, inputs: ["id", "id", "disabled", "disabled"] }, { directive: KbqFileList }], ngImport: i0, template: "<div\n kbqFileDrop\n class=\"kbq-file-upload\"\n [class.kbq-disabled]=\"disabled\"\n [class.kbq-error]=\"invalid\"\n [disabled]=\"!!fullScreenDropZone()\"\n (filesDropped)=\"onFileDropped($event)\"\n>\n @if (!file) {\n <div class=\"kbq-file-dropzone\">\n <i kbq-icon=\"kbq-arrow-up-from-bracket_16\" class=\"kbq-file-upload__dropzone-icon\"></i>\n <span class=\"kbq-file-upload__dropzone-caption\">\n <ng-container *ngTemplateOutlet=\"captionText; context: captionContext()\" />\n </span>\n </div>\n } @else {\n @if (file) {\n <div class=\"kbq-file-item\">\n <div class=\"kbq-file-item__text-wrapper\">\n @if (!isLoading(file)) {\n <ng-content select=\"[kbq-icon]\" />\n } @else {\n <kbq-progress-spinner [mode]=\"progressMode()\" [value]=\"uploadProgress(file)\" />\n }\n <div class=\"kbq-file-item__text\" [kbqEllipsisCenter]=\"file.file.name\" [minVisibleLength]=\"10\"></div>\n </div>\n @if (showFileSize()) {\n <div class=\"kbq-file-item__size\">\n {{ file.file.size | kbqDataSize }}\n </div>\n }\n </div>\n <i\n kbq-icon-button=\"kbq-circle-xmark_16\"\n class=\"kbq-file-upload__action\"\n [attr.aria-label]=\"a11yNames().remove\"\n [color]=\"invalid ? 'error' : 'contrast-fade'\"\n [disabled]=\"disabled\"\n (click)=\"deleteItem($event, 'program')\"\n (keydown.enter)=\"deleteItem($event, 'program')\"\n (keydown.space)=\"$event.preventDefault(); deleteItem($event, 'program')\"\n (keydown.backspace)=\"deleteItem()\"\n (keydown.delete)=\"deleteItem()\"\n ></i>\n }\n }\n</div>\n\n@if (hasHint) {\n <div class=\"kbq-file-upload__hint\">\n <ng-content select=\"kbq-hint\" />\n </div>\n}\n\n<!-- Announces additions and removals: nothing else in the component reaches assistive tech (WCAG 4.1.3). -->\n<div class=\"cdk-visually-hidden\" role=\"status\" aria-live=\"polite\" aria-atomic=\"true\">{{ announcement() }}</div>\n\n<ng-template\n #captionText\n let-captionText=\"captionText\"\n let-browseLink=\"browseLink\"\n let-captionTextSeparator=\"captionTextSeparator\"\n let-browseLinkFolder=\"browseLinkFolder\"\n>\n @if (captionText) {\n {{ captionText }}\n }\n @if (browseLink) {\n <label\n kbqFileLoader\n cdkMonitorSubtreeFocus\n [onlyDirectory]=\"null\"\n [accept]=\"acceptedFiles\"\n [disabled]=\"disabled\"\n [describedBy]=\"describedBy()\"\n [invalid]=\"invalid\"\n [for]=\"fileUploadContext.id() || inputId()\"\n (fileChange)=\"onFileSelectedViaClick($event)\"\n >\n <span class=\"kbq-file-upload__browse-link\" kbqLink size=\"normal\" [disabled]=\"disabled\" [tabIndex]=\"-1\">\n {{ browseLink }}\n </span>\n </label>\n }\n @if (captionTextSeparator) {\n {{ captionTextSeparator }}\n }\n @if (browseLinkFolder) {\n <label\n kbqFileLoader\n cdkMonitorSubtreeFocus\n [onlyDirectory]=\"true\"\n [disabled]=\"disabled\"\n [describedBy]=\"describedBy()\"\n [invalid]=\"invalid\"\n (fileChange)=\"onFileSelectedViaClick($event)\"\n >\n <span class=\"kbq-file-upload__browse-link\" kbqLink size=\"normal\" [disabled]=\"disabled\" [tabIndex]=\"-1\">\n {{ browseLinkFolder }}\n </span>\n </label>\n }\n</ng-template>\n", styles: [".kbq-form-field{--kbq-form-field-label-margin-bottom: var(--kbq-size-xs);position:relative;display:inline-block;width:100%}.kbq-form-field.kbq-form-field_horizontal{display:flex;flex-direction:row;align-items:flex-start}.kbq-form-field.kbq-form-field_horizontal .kbq-form-field__label{--kbq-form-field-label-margin-bottom: 0;padding:var(--kbq-size-xs) var(--kbq-size-l) 0 0}.kbq-form-field .kbq-form-field__content{flex:1}.kbq-form-field .kbq-form-field__label{box-sizing:border-box;display:flex;margin-bottom:var(--kbq-form-field-label-margin-bottom)}.kbq-form-field.kbq-form-field-type-select .kbq-form-field__suffix{margin-right:0}.kbq-form-field .kbq-form-field__container{box-sizing:border-box;display:flex;justify-content:space-between;align-items:center;border-width:var(--kbq-form-field-size-border-width);border-style:solid;border-color:transparent;border-radius:var(--kbq-form-field-size-border-radius)}@supports (corner-shape: squircle){.kbq-form-field .kbq-form-field__container{corner-shape:squircle;border-radius:clamp(var(--kbq-form-field-size-border-radius) * 1.85,var(--kbq-form-field-size-border-radius) * 2.3 - 3.6px,var(--kbq-form-field-size-border-radius) * 2)}}.kbq-form-field .kbq-form-field__container{padding-left:var(--kbq-form-field-size-container-left-padding);padding-right:var(--kbq-form-field-size-container-right-padding)}.kbq-form-field .kbq-form-field__container:has(.kbq-textarea){--kbq-form-field-size-container-left-padding: 0;--kbq-form-field-size-container-right-padding: 0}.kbq-form-field .kbq-form-field__infix{box-sizing:border-box;width:100%;flex-grow:1;padding-left:var(--kbq-form-field-size-infix-left-padding)}.kbq-form-field .kbq-form-field__infix:has(.kbq-select_multiple,.kbq-select_multiline):not(:has(.kbq-select__trigger_empty)),.kbq-form-field .kbq-form-field__infix:has(.kbq-tag-list),.kbq-form-field .kbq-form-field__infix:has(.kbq-textarea){padding-left:0;max-width:100%}.kbq-form-field .kbq-form-field__infix:has(.kbq-select_multiple,.kbq-select_multiline):has(kbq-select-trigger,[kbq-select-trigger]){padding-left:var(--kbq-form-field-size-infix-left-padding)}.kbq-form-field .kbq-form-field__infix .kbq-input,.kbq-form-field .kbq-form-field__infix .kbq-tag-input{padding-right:var(--kbq-form-field-size-infix-right-padding)}.kbq-form-field,.kbq-form-field .kbq-textarea{border-radius:var(--kbq-form-field-size-border-radius)}@supports (corner-shape: squircle){.kbq-form-field,.kbq-form-field .kbq-textarea{corner-shape:squircle;border-radius:clamp(var(--kbq-form-field-size-border-radius) * 1.85,var(--kbq-form-field-size-border-radius) * 2.3 - 3.6px,var(--kbq-form-field-size-border-radius) * 2)}}.kbq-form-field:hover{z-index:1}.kbq-form-field.cdk-focused,.kbq-form-field.kbq-focused{z-index:3}.kbq-form-field.kbq-form-field_without-borders,.kbq-form-field.kbq-form-field_no-borders{--kbq-form-field-default-border-color: transparent;--kbq-form-field-states-focused-border-color: transparent;--kbq-form-field-states-error-border-color: transparent;--kbq-form-field-states-disabled-border-color: transparent;--kbq-form-field-states-focused-focus-outline: transparent;--kbq-form-field-states-error-focused-focus-outline: transparent}.kbq-form-field.kbq-form-field_in-overlay{--kbq-form-field-default-background: var(--kbq-background-card);--kbq-form-field-states-focused-background: var(--kbq-background-card);--kbq-form-field-states-error-background: var(--kbq-background-card);--kbq-form-field-states-disabled-background: var(--kbq-background-card)}.kbq-form-field .kbq-form-field__prefix,.kbq-form-field .kbq-form-field__suffix{display:flex;justify-content:center;align-items:center}.kbq-form-field .kbq-form-field__prefix .kbq-prefix,.kbq-form-field .kbq-form-field__prefix .kbq-suffix,.kbq-form-field .kbq-form-field__suffix .kbq-prefix,.kbq-form-field .kbq-form-field__suffix .kbq-suffix{min-width:var(--kbq-form-field-size-addon-width);text-align:center}.kbq-form-field .kbq-form-field__prefix+.kbq-form-field__infix{padding-left:0}.kbq-form-field .kbq-form-field__hint{display:flex;flex-direction:column;gap:var(--kbq-form-field-hint-size-gap);margin-top:var(--kbq-form-field-hint-size-margin-top)}.kbq-form-field .kbq-form-field__hint:has(.kbq-reactive-password-hint){--kbq-form-field-hint-size-gap: var(--kbq-size-s)}.kbq-form-field .kbq-form-field__hint:has(.kbq-reactive-password-hint:first-child){--kbq-form-field-hint-size-margin-top: var(--kbq-size-m)}.kbq-form-field .kbq-form-field__container{border-color:var(--kbq-form-field-default-border-color);background-color:var(--kbq-form-field-default-background)}.kbq-form-field .kbq-input,.kbq-form-field .kbq-tag-input,.kbq-form-field .kbq-textarea{--kbq-form-field-resolved-text: var(--kbq-form-field-default-text);color:var(--kbq-form-field-resolved-text)}.kbq-form-field .kbq-input::placeholder,.kbq-form-field .kbq-tag-input::placeholder,.kbq-form-field .kbq-textarea::placeholder{color:var(--kbq-form-field-default-placeholder)}.kbq-form-field .kbq-input::-ms-input-placeholder,.kbq-form-field .kbq-tag-input::-ms-input-placeholder,.kbq-form-field .kbq-textarea::-ms-input-placeholder{color:var(--kbq-form-field-default-placeholder)}.kbq-form-field .kbq-input::-webkit-input-placeholder,.kbq-form-field .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field .kbq-textarea::-webkit-input-placeholder{color:var(--kbq-form-field-default-placeholder)}.kbq-form-field .kbq-input:is(:autofill,:-webkit-autofill),.kbq-form-field .kbq-tag-input:is(:autofill,:-webkit-autofill),.kbq-form-field .kbq-textarea:is(:autofill,:-webkit-autofill){transition-property:background-color;transition-duration:600000s;-webkit-text-fill-color:var(--kbq-form-field-resolved-text, var(--kbq-form-field-default-text));caret-color:var(--kbq-form-field-resolved-text, var(--kbq-form-field-default-text))}.kbq-form-field.kbq-form-field_invalid .kbq-form-field__container{border-color:var(--kbq-form-field-states-error-border-color);background-color:var(--kbq-form-field-states-error-background)}.kbq-form-field.kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field_invalid .kbq-textarea{--kbq-form-field-resolved-text: var(--kbq-form-field-states-error-text);color:var(--kbq-form-field-resolved-text)}.kbq-form-field.kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field_invalid .kbq-textarea::placeholder{color:var(--kbq-form-field-states-error-placeholder)}.kbq-form-field.kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder{color:var(--kbq-form-field-states-error-placeholder)}.kbq-form-field.kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder{color:var(--kbq-form-field-states-error-placeholder)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container{border-color:var(--kbq-form-field-states-focused-border-color);background-color:var(--kbq-form-field-states-focused-background)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea{--kbq-form-field-resolved-text: var(--kbq-form-field-states-focused-text);color:var(--kbq-form-field-resolved-text)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder{color:var(--kbq-form-field-states-focused-placeholder)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder{color:var(--kbq-form-field-states-focused-placeholder)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder{color:var(--kbq-form-field-states-focused-placeholder)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container{box-shadow:inset 0 0 .1px var(--kbq-form-field-size-focus-outline-width) var(--kbq-form-field-states-focused-focus-outline)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container{border-color:var(--kbq-form-field-states-error-border-color);background-color:var(--kbq-form-field-states-error-background)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea{--kbq-form-field-resolved-text: var(--kbq-form-field-states-error-text);color:var(--kbq-form-field-resolved-text)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder{color:var(--kbq-form-field-states-error-placeholder)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder{color:var(--kbq-form-field-states-error-placeholder)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder{color:var(--kbq-form-field-states-error-placeholder)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container{box-shadow:inset 0 0 .1px var(--kbq-form-field-size-focus-outline-width) var(--kbq-form-field-states-error-focused-focus-outline)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty{color:var(--kbq-form-field-states-error-text);-webkit-text-fill-color:var(--kbq-form-field-states-error-text)}.kbq-form-field .kbq-form-field__label{color:var(--kbq-form-field-label-color)}.kbq-form-field .kbq-form-field__container:has(:is(.kbq-input,.kbq-tag-input,.kbq-textarea):is(:autofill,:-webkit-autofill)){background-image:linear-gradient(var(--kbq-form-field-states-autofill-background),var(--kbq-form-field-states-autofill-background))}.kbq-form-field.kbq-disabled .kbq-form-field__container{border-color:var(--kbq-form-field-states-disabled-border-color);background-color:var(--kbq-form-field-states-disabled-background)}.kbq-form-field.kbq-disabled .kbq-input,.kbq-form-field.kbq-disabled .kbq-tag-input,.kbq-form-field.kbq-disabled .kbq-textarea{--kbq-form-field-resolved-text: var(--kbq-form-field-states-disabled-text);color:var(--kbq-form-field-resolved-text)}.kbq-form-field.kbq-disabled .kbq-input::placeholder,.kbq-form-field.kbq-disabled .kbq-tag-input::placeholder,.kbq-form-field.kbq-disabled .kbq-textarea::placeholder{color:var(--kbq-form-field-states-disabled-placeholder)}.kbq-form-field.kbq-disabled .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-disabled .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-disabled .kbq-textarea::-ms-input-placeholder{color:var(--kbq-form-field-states-disabled-placeholder)}.kbq-form-field.kbq-disabled .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-disabled .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-disabled .kbq-textarea::-webkit-input-placeholder{color:var(--kbq-form-field-states-disabled-placeholder)}.kbq-form-field.kbq-disabled .kbq-icon.kbq-empty{color:var(--kbq-form-field-states-disabled-text);-webkit-text-fill-color:var(--kbq-form-field-states-disabled-text)}.kbq-form-field .kbq-form-field__prefix .kbq-icon.kbq-empty,.kbq-form-field .kbq-form-field__suffix .kbq-icon.kbq-empty{color:var(--kbq-icon-contrast-fade)}.kbq-form-field .kbq-form-field__hint>.kbq-hint:not(.kbq-contrast-fade,.kbq-success,.kbq-warning,.kbq-error){color:var(--kbq-form-field-hint-text)}.kbq-form-field{font-size:var(--kbq-typography-text-normal-font-size);font-style:var(--kbq-typography-text-normal-font-style);font-weight:var(--kbq-typography-text-normal-font-weight);line-height:var(--kbq-typography-text-normal-line-height);font-family:var(--kbq-typography-text-normal-font-family);text-transform:var(--kbq-typography-text-normal-text-transform);font-feature-settings:var(--kbq-typography-text-normal-font-feature-settings);letter-spacing:var(--kbq-typography-text-normal-letter-spacing)}.kbq-form-field .kbq-form-field__hint>.kbq-hint:not(.kbq-reactive-password-hint,.kbq-contrast-fade,.kbq-success,.kbq-warning) .kbq-hint__text{font-size:var(--kbq-typography-text-compact-font-size);font-style:var(--kbq-typography-text-compact-font-style);font-weight:var(--kbq-typography-text-compact-font-weight);line-height:var(--kbq-typography-text-compact-line-height);font-family:var(--kbq-typography-text-compact-font-family);text-transform:var(--kbq-typography-text-compact-text-transform);font-feature-settings:var(--kbq-typography-text-compact-font-feature-settings);letter-spacing:var(--kbq-typography-text-compact-letter-spacing)}.kbq-file-upload{box-sizing:border-box;display:flex;align-items:center;position:relative}.kbq-file-upload .kbq-file-item{display:flex;align-items:center}.kbq-file-upload .kbq-file-dropzone{display:flex;align-items:baseline;gap:var(--dropzone-gap, var(--kbq-file-upload-size-dropzone-content-gap-horizontal))}.kbq-file-loader.cdk-keyboard-focused>.kbq-file-upload__browse-link{outline-style:solid;outline-width:var(--kbq-link-size-state-focused-outline-width);outline-color:var(--kbq-link-state-focused-outline)}.kbq-file-upload__hint{display:flex;flex-direction:column;gap:var(--kbq-form-field-hint-size-gap);margin-top:var(--kbq-form-field-hint-size-margin-top)}.kbq-file-upload__hint:has(.kbq-reactive-password-hint){--kbq-form-field-hint-size-gap: var(--kbq-size-s)}.kbq-file-upload__hint:has(.kbq-reactive-password-hint:first-child){--kbq-form-field-hint-size-margin-top: var(--kbq-size-m)}:where(.kbq-file-upload__hint .kbq-hint){color:var(--kbq-foreground-contrast-secondary)}.kbq-file-upload{font-size:var(--kbq-typography-text-normal-font-size);font-style:var(--kbq-typography-text-normal-font-style);font-weight:var(--kbq-typography-text-normal-font-weight);line-height:var(--kbq-typography-text-normal-line-height);font-family:var(--kbq-typography-text-normal-font-family);text-transform:var(--kbq-typography-text-normal-text-transform);font-feature-settings:var(--kbq-typography-text-normal-font-feature-settings);letter-spacing:var(--kbq-typography-text-normal-letter-spacing)}.kbq-file-upload__hint .kbq-hint .kbq-hint__text{font-size:var(--kbq-typography-text-compact-font-size);font-style:var(--kbq-typography-text-compact-font-style);font-weight:var(--kbq-typography-text-compact-font-weight);line-height:var(--kbq-typography-text-compact-line-height);font-family:var(--kbq-typography-text-compact-font-family);text-transform:var(--kbq-typography-text-compact-text-transform);font-feature-settings:var(--kbq-typography-text-compact-font-feature-settings);letter-spacing:var(--kbq-typography-text-compact-letter-spacing)}\n", ":where(.kbq-file-upload){--kbq-file-upload-size-dropzone-content-gap-horizontal: var(--kbq-size-s);--kbq-form-field-hint-text: var(--kbq-foreground-contrast-secondary)}:where(.kbq-single-file-upload){--kbq-form-field-hint-size-margin-top: var(--kbq-size-xs);--kbq-form-field-hint-size-gap: var(--kbq-size-xxs);--kbq-file-upload-size-single-container-border-radius: var(--kbq-size-s);--kbq-file-upload-size-single-container-border-width: 1px;--kbq-file-upload-size-single-container-content-gap-horizontal: var(--kbq-size-s);--kbq-file-upload-size-single-container-padding-vertical: var(--kbq-size-m);--kbq-file-upload-size-single-container-padding-horizontal: var(--kbq-size-l);--kbq-file-upload-single-min-height: 44px;--kbq-file-upload-size-single-action-padding: 13px;--kbq-file-upload-single-default-container-border: var(--kbq-line-contrast-fade);--kbq-file-upload-single-default-container-background: var(--kbq-background-bg);--kbq-file-upload-single-default-dropzone-icon-color: var(--kbq-icon-contrast-fade);--kbq-file-upload-single-default-left-icon-color: var(--kbq-icon-contrast-fade);--kbq-file-upload-single-default-file-size-text-color: var(--kbq-foreground-contrast-secondary);--kbq-file-upload-single-states-on-drag-container-border: var(--kbq-line-theme-fade);--kbq-file-upload-single-states-on-drag-container-background: var(--kbq-background-theme-fade);--kbq-file-upload-single-states-error-container-border: var(--kbq-line-error);--kbq-file-upload-single-states-error-container-background: var(--kbq-background-error-less);--kbq-file-upload-single-states-error-dropzone-icon-color: var(--kbq-icon-error);--kbq-file-upload-single-states-error-left-icon-color: var(--kbq-icon-error);--kbq-file-upload-single-states-error-text-block-color: var(--kbq-foreground-error);--kbq-file-upload-single-states-error-file-size-text-color: var(--kbq-foreground-error);--kbq-file-upload-single-states-disabled-container-border: var(--kbq-states-line-disabled);--kbq-file-upload-single-states-disabled-container-background: var(--kbq-states-background-disabled);--kbq-file-upload-single-states-disabled-dropzone-icon-color: var(--kbq-states-icon-disabled);--kbq-file-upload-single-states-disabled-left-icon-color: var(--kbq-states-icon-disabled);--kbq-file-upload-single-states-disabled-text-block-color: var(--kbq-states-foreground-disabled);--kbq-file-upload-single-states-disabled-file-size-text-color: var(--kbq-states-foreground-disabled)}:where(.kbq-multiple-file-upload){--kbq-form-field-hint-size-margin-top: var(--kbq-size-xs);--kbq-form-field-hint-size-gap: var(--kbq-size-xxs);--kbq-file-upload-size-multiple-min-height: 120px;--kbq-file-upload-size-multiple-max-height: unset;--kbq-file-upload-size-multiple-big-container-min-height: 192px;--kbq-file-upload-size-multiple-big-container-min-width: 320px;--kbq-file-upload-size-multiple-big-container-border-radius: var(--kbq-size-s);--kbq-file-upload-size-multiple-big-container-border-width: 1px;--kbq-file-upload-size-multiple-big-grid-cell-padding-horizontal: var(--kbq-size-s);--kbq-file-upload-size-multiple-big-grid-cell-content-gap-horizontal: var(--kbq-size-s);--kbq-file-upload-size-multiple-big-grid-cell-file-size-width: var(--kbq-size-7xl);--kbq-file-upload-multiple-default-container-border: var(--kbq-line-contrast-fade);--kbq-file-upload-multiple-default-container-background: var(--kbq-background-bg);--kbq-file-upload-multiple-default-upload-icon-color: var(--kbq-icon-contrast);--kbq-file-upload-multiple-default-dropzone-icon-color: var(--kbq-icon-contrast-fade);--kbq-file-upload-multiple-default-left-icon-color: var(--kbq-icon-contrast-fade);--kbq-file-upload-multiple-default-text-block-color: var(--kbq-foreground-contrast);--kbq-file-upload-multiple-default-file-size-text-color: var(--kbq-foreground-contrast-secondary);--kbq-file-upload-multiple-states-on-drag-container-border: var(--kbq-line-theme-fade);--kbq-file-upload-multiple-states-on-drag-container-background: var(--kbq-background-theme-fade);--kbq-file-upload-multiple-states-on-drag-upload-icon-color: var(--kbq-icon-contrast);--kbq-file-upload-multiple-states-on-drag-dropzone-icon-color: var(--kbq-icon-contrast-fade);--kbq-file-upload-multiple-states-error-container-border: var(--kbq-line-error);--kbq-file-upload-multiple-states-error-container-background: var(--kbq-background-error-less);--kbq-file-upload-multiple-states-error-upload-icon-color: var(--kbq-icon-error);--kbq-file-upload-multiple-states-error-dropzone-icon-color: var(--kbq-icon-error);--kbq-file-upload-multiple-states-error-left-icon-color: var(--kbq-icon-error);--kbq-file-upload-multiple-states-error-icon-button-color: var(--kbq-icon-error);--kbq-file-upload-multiple-states-error-text-block-color: var(--kbq-foreground-error);--kbq-file-upload-multiple-states-disabled-container-border: var(--kbq-states-line-disabled);--kbq-file-upload-multiple-states-disabled-container-background: var(--kbq-states-background-disabled);--kbq-file-upload-multiple-states-disabled-upload-icon-color: var(--kbq-states-icon-disabled);--kbq-file-upload-multiple-states-disabled-dropzone-icon-color: var(--kbq-states-icon-disabled);--kbq-file-upload-multiple-states-disabled-left-icon-color: var(--kbq-states-icon-disabled);--kbq-file-upload-multiple-states-disabled-text-block-color: var(--kbq-states-foreground-disabled)}:where(.kbq-file-upload.kbq-file-upload_compact){--kbq-file-upload-multiple-compact-container-padding-vertical: 11px;--kbq-file-upload-multiple-compact-container-padding-horizontal: 15px}\n", ".kbq-single-file-upload .kbq-file-upload__dropzone-icon>svg{vertical-align:bottom}.kbq-single-file-upload.kbq-single-file-upload_selected .kbq-file-upload .kbq-file-item{padding:calc(var(--kbq-file-upload-size-single-container-padding-vertical) - var(--kbq-file-upload-size-single-container-border-width)) calc(var(--kbq-file-upload-size-single-container-padding-horizontal) - var(--kbq-file-upload-size-single-container-border-width));padding-right:0}.kbq-single-file-upload:not(.kbq-single-file-upload_selected) .kbq-file-upload{padding:calc(var(--kbq-file-upload-size-single-container-padding-vertical) - var(--kbq-file-upload-size-single-container-border-width)) calc(var(--kbq-file-upload-size-single-container-padding-horizontal) - var(--kbq-file-upload-size-single-container-border-width))}.kbq-single-file-upload .kbq-file-upload{min-height:var(--kbq-file-upload-single-min-height);border-radius:var(--kbq-file-upload-size-single-container-border-radius)}@supports (corner-shape: squircle){.kbq-single-file-upload .kbq-file-upload{corner-shape:squircle;border-radius:clamp(var(--kbq-file-upload-size-single-container-border-radius) * 1.85,var(--kbq-file-upload-size-single-container-border-radius) * 2.3 - 3.6px,var(--kbq-file-upload-size-single-container-border-radius) * 2)}}.kbq-single-file-upload .kbq-file-upload{border-width:var(--kbq-file-upload-size-single-container-border-width);border-style:dashed}.kbq-single-file-upload .kbq-file-upload .kbq-file-item{width:100%;min-width:0}.kbq-single-file-upload .kbq-file-upload .kbq-file-item .kbq-file-item__text-wrapper{display:flex;align-items:center;width:100%;min-width:0;gap:var(--kbq-file-upload-size-single-container-content-gap-horizontal)}.kbq-single-file-upload .kbq-file-upload .kbq-file-item .kbq-file-item__text-wrapper .kbq-file-item__text{flex:1 1 auto}.kbq-single-file-upload .kbq-file-upload .kbq-file-item .kbq-file-item__size{padding:0 var(--kbq-size-s)}.kbq-single-file-upload .kbq-file-upload .kbq-file-upload__action{padding:var(--kbq-file-upload-size-single-action-padding)}.kbq-single-file-upload .kbq-file-upload{background-color:var(--kbq-file-upload-single-default-container-background);border-color:var(--kbq-file-upload-single-default-container-border)!important}.kbq-single-file-upload .kbq-file-upload:not(.kbq-disabled,.kbq-error) .kbq-file-upload__dropzone-icon{color:var(--kbq-file-upload-single-default-dropzone-icon-color)}.kbq-single-file-upload .kbq-file-upload:not(.kbq-disabled,.kbq-error) .kbq-file-item__text-wrapper .kbq-icon.kbq-empty{color:var(--kbq-file-upload-single-default-left-icon-color)}.kbq-single-file-upload .kbq-file-upload:not(.kbq-disabled,.kbq-error) .kbq-file-item__size{color:var(--kbq-file-upload-single-default-file-size-text-color)}.kbq-single-file-upload .kbq-file-upload.kbq-file-drop_dragover{background-color:var(--kbq-file-upload-single-states-on-drag-container-background);border-color:var(--kbq-file-upload-single-states-on-drag-container-border)!important}.kbq-single-file-upload .kbq-file-upload.kbq-error:not(.kbq-disabled):not(.kbq-file-drop_dragover){background-color:var(--kbq-file-upload-single-states-error-container-background);border-color:var(--kbq-file-upload-single-states-error-container-border)!important}.kbq-single-file-upload .kbq-file-upload.kbq-error:not(.kbq-disabled) .kbq-file-upload__dropzone-icon{color:var(--kbq-file-upload-single-states-error-dropzone-icon-color)}.kbq-single-file-upload .kbq-file-upload.kbq-error:not(.kbq-disabled) .kbq-file-item__text-wrapper .kbq-icon.kbq-empty{color:var(--kbq-file-upload-single-states-error-left-icon-color)}.kbq-single-file-upload .kbq-file-upload.kbq-error:not(.kbq-disabled) .kbq-file-item__text,.kbq-single-file-upload .kbq-file-upload.kbq-error:not(.kbq-disabled) .kbq-file-upload__dropzone-caption:not(.kbq-link){color:var(--kbq-file-upload-single-states-error-text-block-color)}.kbq-single-file-upload .kbq-file-upload.kbq-error:not(.kbq-disabled) .kbq-file-item__size{color:var(--kbq-file-upload-single-states-error-file-size-text-color)}.kbq-single-file-upload .kbq-file-upload.kbq-disabled{background-color:var(--kbq-file-upload-single-states-disabled-container-background);border-color:var(--kbq-file-upload-single-states-disabled-container-border)!important}.kbq-single-file-upload .kbq-file-upload.kbq-disabled .kbq-file-upload__dropzone-icon{color:var(--kbq-file-upload-single-states-disabled-dropzone-icon-color)}.kbq-single-file-upload .kbq-file-upload.kbq-disabled .kbq-file-item__text-wrapper .kbq-icon.kbq-empty{color:var(--kbq-file-upload-single-states-disabled-left-icon-color)}.kbq-single-file-upload .kbq-file-upload.kbq-disabled .kbq-file-upload__dropzone-caption,.kbq-single-file-upload .kbq-file-upload.kbq-disabled .kbq-file-item__text{color:var(--kbq-file-upload-single-states-disabled-text-block-color)}.kbq-single-file-upload .kbq-file-upload.kbq-disabled .kbq-file-item__size{color:var(--kbq-file-upload-single-states-disabled-file-size-text-color)}\n"], dependencies: [{ kind: "directive", type: CdkMonitorFocus, selector: "[cdkMonitorElementFocus], [cdkMonitorSubtreeFocus]", outputs: ["cdkFocusChange"], exportAs: ["cdkMonitorFocus"] }, { kind: "directive", type: KbqFileDropDirective, selector: "[kbqFileDrop]", exportAs: ["kbqFileDrop"] }, { kind: "component", type: KbqLink, selector: "[kbqLink]", inputs: ["disabled", "tabIndex", "pseudo", "external", "underline", "size", "useVisited", "print"], exportAs: ["kbqLink"] }, { kind: "component", type: KbqIcon, selector: "[kbq-icon]", inputs: ["aria-hidden", "iconSize", "autoColor", "kbq-icon"] }, { kind: "component", type: KbqIconButton, selector: "[kbq-icon-button]", inputs: ["size", "kbq-icon-button", "tabindex", "disabled"] }, { kind: "component", type: KbqProgressSpinner, selector: "kbq-progress-spinner", inputs: ["id", "value", "mode", "size"] }, { kind: "directive", type: KbqEllipsisCenterDirective, selector: "[kbqEllipsisCenter]", inputs: ["ignoreTooltipPointerEvents", "minVisibleLength", "charWidth", "debounceInterval", "kbqEllipsisCenter"] }, { kind: "component", type: KbqFileLoader, selector: "[kbqFileLoader]", inputs: ["disabled", "multiple", "accept", "for", "onlyDirectory", "describedBy", "invalid"], outputs: ["fileChange"], exportAs: ["kbqFileLoader"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: KbqDataSizePipe, name: "kbqDataSize" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
1299
1560
|
}
|
|
1300
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1561
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KbqSingleFileUploadComponent, decorators: [{
|
|
1301
1562
|
type: Component,
|
|
1302
1563
|
args: [{ selector: 'kbq-single-file-upload,kbq-file-upload:not([multiple])', imports: [
|
|
1303
|
-
|
|
1564
|
+
CdkMonitorFocus,
|
|
1304
1565
|
KbqFileDropDirective,
|
|
1305
1566
|
KbqLink,
|
|
1306
1567
|
KbqIcon,
|
|
@@ -1312,23 +1573,24 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.30", ngImpo
|
|
|
1312
1573
|
NgTemplateOutlet
|
|
1313
1574
|
], providers: [KbqFullScreenDropzoneService], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
|
|
1314
1575
|
class: 'kbq-single-file-upload',
|
|
1315
|
-
'[class.kbq-single-file-upload_selected]': '!!file'
|
|
1576
|
+
'[class.kbq-single-file-upload_selected]': '!!file',
|
|
1577
|
+
'(focusout)': 'onFocusOut($event)'
|
|
1316
1578
|
}, hostDirectives: [
|
|
1579
|
+
{ directive: KbqLocaleOverridesDirective, inputs: ['kbqLocaleOverrides: localeOverrides'] },
|
|
1317
1580
|
{
|
|
1581
|
+
// `multiple` is deliberately not passed through: this component holds one file, and
|
|
1582
|
+
// forwarding it put the hidden input back into multi-select, so the system dialog offered
|
|
1583
|
+
// a selection the component then threw away.
|
|
1318
1584
|
directive: KbqFileUploadContext,
|
|
1319
|
-
inputs: ['id', 'disabled'
|
|
1585
|
+
inputs: ['id', 'disabled']
|
|
1320
1586
|
},
|
|
1321
1587
|
{ directive: KbqFileList }
|
|
1322
|
-
], template: "<div\n kbqFileDrop\n class=\"kbq-file-upload\"\n [class.kbq-disabled]=\"disabled\"\n [class.kbq-error]=\"invalid\"\n [disabled]=\"!!fullScreenDropZone()\"\n (filesDropped)=\"onFileDropped($event)\"\n>\n @if (!file) {\n <div class=\"kbq-file-dropzone\">\n <i kbq-icon=\"kbq-arrow-up-from-bracket_16\" class=\"kbq-file-upload__dropzone-icon\"></i>\n <span class=\"kbq-file-upload__dropzone-caption\">\n <ng-container *ngTemplateOutlet=\"captionText; context: captionContext()\" />\n </span>\n </div>\n } @else {\n @if (file) {\n <div class=\"kbq-file-item\">\n <div class=\"kbq-file-item__text-wrapper\">\n @if ({ loading: file.loading | async, progress: file.progress | async }; as asyncData) {\n @if (!asyncData.loading) {\n <ng-content select=\"[kbq-icon]\" />\n } @else {\n <kbq-progress-spinner [mode]=\"progressMode()\" [value]=\"asyncData.progress || 0\" />\n }\n }\n <div class=\"kbq-file-item__text\" [kbqEllipsisCenter]=\"file.file.name\" [minVisibleLength]=\"10\"></div>\n </div>\n @if (showFileSize()) {\n <div class=\"kbq-file-item__size\">\n {{ file.file.size | kbqDataSize }}\n </div>\n }\n </div>\n <i\n kbq-icon-button=\"kbq-circle-xmark_16\"\n class=\"kbq-file-upload__action\"\n [color]=\"invalid ? 'error' : 'contrast-fade'\"\n [disabled]=\"disabled\"\n (click)=\"deleteItem($event, 'program')\"\n (keydown.backspace)=\"deleteItem()\"\n (keydown.delete)=\"deleteItem()\"\n ></i>\n }\n }\n</div>\n\n@if (hasHint) {\n <div class=\"kbq-file-upload__hint\">\n <ng-content select=\"kbq-hint\" />\n </div>\n}\n\n<ng-template\n #captionText\n let-captionText=\"captionText\"\n let-browseLink=\"browseLink\"\n let-captionTextSeparator=\"captionTextSeparator\"\n let-browseLinkFolder=\"browseLinkFolder\"\n>\n @if (captionText) {\n {{ captionText }}\n }\n @if (browseLink) {\n <label\n kbq-link\n pseudo\n kbqFileLoader\n [onlyDirectory]=\"null\"\n [accept]=\"acceptedFiles\"\n [disabled]=\"disabled\"\n [for]=\"fileUploadContext.id() || inputId()\"\n [tabIndex]=\"-1\"\n [multiple]=\"true\"\n (fileChange)=\"onFileSelectedViaClick($event)\"\n >\n {{ browseLink }}\n </label>\n }\n @if (captionTextSeparator) {\n {{ captionTextSeparator }}\n }\n @if (browseLinkFolder) {\n <label\n kbq-link\n pseudo\n kbqFileLoader\n [onlyDirectory]=\"true\"\n [disabled]=\"disabled\"\n [tabIndex]=\"-1\"\n (fileChange)=\"onFileSelectedViaClick($event)\"\n >\n {{ browseLinkFolder }}\n </label>\n }\n</ng-template>\n", styles: [".kbq-form-field{--kbq-form-field-label-margin-bottom: var(--kbq-size-xs);position:relative;display:inline-block;width:100%}.kbq-form-field.kbq-form-field_horizontal{display:flex;flex-direction:row;align-items:flex-start}.kbq-form-field.kbq-form-field_horizontal .kbq-form-field__label{--kbq-form-field-label-margin-bottom: 0;padding:var(--kbq-size-xs) var(--kbq-size-l) 0 0}.kbq-form-field .kbq-form-field__content{flex:1}.kbq-form-field .kbq-form-field__label{box-sizing:border-box;display:flex;margin-bottom:var(--kbq-form-field-label-margin-bottom)}.kbq-form-field.kbq-form-field-type-select .kbq-form-field__suffix{margin-right:0}.kbq-form-field .kbq-form-field__container{box-sizing:border-box;display:flex;justify-content:space-between;align-items:center;border-width:var(--kbq-form-field-size-border-width);border-style:solid;border-color:transparent;border-radius:var(--kbq-form-field-size-border-radius);padding-left:var(--kbq-form-field-size-container-left-padding);padding-right:var(--kbq-form-field-size-container-right-padding)}.kbq-form-field .kbq-form-field__container:has(.kbq-textarea){--kbq-form-field-size-container-left-padding: 0;--kbq-form-field-size-container-right-padding: 0}.kbq-form-field .kbq-form-field:not(.kbq-form-field-type-textarea){height:var(--kbq-form-field-size-height)}.kbq-form-field .kbq-form-field__infix{box-sizing:border-box;width:100%;flex-grow:1;padding-left:var(--kbq-form-field-size-infix-left-padding)}.kbq-form-field .kbq-form-field__infix:has(.kbq-select_multiple,.kbq-select_multiline):not(:has(.kbq-select__trigger_empty)),.kbq-form-field .kbq-form-field__infix:has(.kbq-tag-list),.kbq-form-field .kbq-form-field__infix:has(.kbq-textarea){padding-left:0;max-width:100%}.kbq-form-field .kbq-form-field__infix:has(.kbq-select_multiple,.kbq-select_multiline):has(kbq-select-trigger,[kbq-select-trigger]){padding-left:var(--kbq-form-field-size-infix-left-padding)}.kbq-form-field .kbq-form-field__infix .kbq-input,.kbq-form-field .kbq-form-field__infix .kbq-tag-input{padding-right:var(--kbq-form-field-size-infix-right-padding)}.kbq-form-field,.kbq-form-field .kbq-textarea{border-radius:var(--kbq-form-field-size-border-radius)}.kbq-form-field:hover{z-index:1}.kbq-form-field.cdk-focused,.kbq-form-field.kbq-focused{z-index:3}.kbq-form-field.kbq-form-field_without-borders .kbq-form-field__container,.kbq-form-field.kbq-form-field_no-borders .kbq-form-field__container{border-color:transparent!important;box-shadow:none!important}.kbq-form-field.kbq-form-field_in-overlay .kbq-form-field__container{background-color:var(--kbq-background-card)!important}.kbq-form-field+.kbq-password-hint{margin-top:var(--kbq-size-m)}.kbq-form-field .kbq-form-field__prefix,.kbq-form-field .kbq-form-field__suffix{display:flex;justify-content:center;align-items:center}.kbq-form-field .kbq-form-field__prefix .kbq-prefix,.kbq-form-field .kbq-form-field__prefix .kbq-suffix,.kbq-form-field .kbq-form-field__suffix .kbq-prefix,.kbq-form-field .kbq-form-field__suffix .kbq-suffix{min-width:var(--kbq-form-field-size-addon-width);text-align:center}.kbq-form-field .kbq-form-field__prefix+.kbq-form-field__infix{padding-left:0}.kbq-form-field .kbq-form-field__hint{display:flex;flex-direction:column;gap:var(--kbq-form-field-hint-size-gap);margin-top:var(--kbq-form-field-hint-size-margin-top)}.kbq-form-field .kbq-form-field__hint:has(.kbq-reactive-password-hint,.kbq-password-hint){--kbq-form-field-hint-size-gap: var(--kbq-size-s)}.kbq-form-field .kbq-form-field__hint:has(:is(.kbq-reactive-password-hint,.kbq-password-hint):first-child){--kbq-form-field-hint-size-margin-top: var(--kbq-size-m)}.kbq-form-field .kbq-form-field__container{border-color:var(--kbq-form-field-default-border-color);background-color:var(--kbq-form-field-default-background)}.kbq-form-field .kbq-input,.kbq-form-field .kbq-tag-input,.kbq-form-field .kbq-textarea{--kbq-form-field-resolved-text: var(--kbq-form-field-default-text);color:var(--kbq-form-field-resolved-text)}.kbq-form-field .kbq-input::placeholder,.kbq-form-field .kbq-tag-input::placeholder,.kbq-form-field .kbq-textarea::placeholder{color:var(--kbq-form-field-default-placeholder)}.kbq-form-field .kbq-input::-ms-input-placeholder,.kbq-form-field .kbq-tag-input::-ms-input-placeholder,.kbq-form-field .kbq-textarea::-ms-input-placeholder{color:var(--kbq-form-field-default-placeholder)}.kbq-form-field .kbq-input::-webkit-input-placeholder,.kbq-form-field .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field .kbq-textarea::-webkit-input-placeholder{color:var(--kbq-form-field-default-placeholder)}.kbq-form-field .kbq-input:is(:autofill,:-webkit-autofill),.kbq-form-field .kbq-tag-input:is(:autofill,:-webkit-autofill),.kbq-form-field .kbq-textarea:is(:autofill,:-webkit-autofill){transition-property:background-color;transition-duration:600000s;-webkit-text-fill-color:var(--kbq-form-field-resolved-text, var(--kbq-form-field-default-text));caret-color:var(--kbq-form-field-resolved-text, var(--kbq-form-field-default-text))}.kbq-form-field.kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field_has-validate-directive.ng-invalid .kbq-form-field__container{border-color:var(--kbq-form-field-states-error-border-color);background-color:var(--kbq-form-field-states-error-background)}.kbq-form-field.kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field_has-validate-directive.ng-invalid .kbq-input,.kbq-form-field.kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input,.kbq-form-field.kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea{--kbq-form-field-resolved-text: var(--kbq-form-field-states-error-text);color:var(--kbq-form-field-resolved-text)}.kbq-form-field.kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field_has-validate-directive.ng-invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::placeholder{color:var(--kbq-form-field-states-error-placeholder)}.kbq-form-field.kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-ms-input-placeholder{color:var(--kbq-form-field-states-error-placeholder)}.kbq-form-field.kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-webkit-input-placeholder{color:var(--kbq-form-field-states-error-placeholder)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container{border-color:var(--kbq-form-field-states-focused-border-color);background-color:var(--kbq-form-field-states-focused-background)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea{--kbq-form-field-resolved-text: var(--kbq-form-field-states-focused-text);color:var(--kbq-form-field-resolved-text)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder{color:var(--kbq-form-field-states-focused-placeholder)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder{color:var(--kbq-form-field-states-focused-placeholder)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder{color:var(--kbq-form-field-states-focused-placeholder)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container{box-shadow:inset 0 0 .1px var(--kbq-form-field-size-focus-outline-width) var(--kbq-form-field-states-focused-focus-outline)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-form-field__container{border-color:var(--kbq-form-field-states-error-border-color);background-color:var(--kbq-form-field-states-error-background)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea{--kbq-form-field-resolved-text: var(--kbq-form-field-states-error-text);color:var(--kbq-form-field-resolved-text)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::placeholder{color:var(--kbq-form-field-states-error-placeholder)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-ms-input-placeholder{color:var(--kbq-form-field-states-error-placeholder)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-textarea::-webkit-input-placeholder{color:var(--kbq-form-field-states-error-placeholder)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid.cdk-focused .kbq-form-field__container{box-shadow:inset 0 0 .1px var(--kbq-form-field-size-focus-outline-width) var(--kbq-form-field-states-error-focused-focus-outline)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_has-validate-directive.ng-invalid .kbq-icon.kbq-empty{color:var(--kbq-form-field-states-error-text);-webkit-text-fill-color:var(--kbq-form-field-states-error-text)}.kbq-form-field .kbq-form-field__label{color:var(--kbq-form-field-label-color)}.kbq-form-field .kbq-form-field__container:has(:is(.kbq-input,.kbq-tag-input,.kbq-textarea):is(:autofill,:-webkit-autofill)){background-image:linear-gradient(var(--kbq-form-field-states-autofill-background),var(--kbq-form-field-states-autofill-background))}.kbq-form-field.kbq-disabled .kbq-form-field__container{border-color:var(--kbq-form-field-states-disabled-border-color);background-color:var(--kbq-form-field-states-disabled-background)}.kbq-form-field.kbq-disabled .kbq-input,.kbq-form-field.kbq-disabled .kbq-tag-input,.kbq-form-field.kbq-disabled .kbq-textarea{--kbq-form-field-resolved-text: var(--kbq-form-field-states-disabled-text);color:var(--kbq-form-field-resolved-text)}.kbq-form-field.kbq-disabled .kbq-input::placeholder,.kbq-form-field.kbq-disabled .kbq-tag-input::placeholder,.kbq-form-field.kbq-disabled .kbq-textarea::placeholder{color:var(--kbq-form-field-states-disabled-placeholder)}.kbq-form-field.kbq-disabled .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-disabled .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-disabled .kbq-textarea::-ms-input-placeholder{color:var(--kbq-form-field-states-disabled-placeholder)}.kbq-form-field.kbq-disabled .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-disabled .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-disabled .kbq-textarea::-webkit-input-placeholder{color:var(--kbq-form-field-states-disabled-placeholder)}.kbq-form-field.kbq-disabled .kbq-icon.kbq-empty{color:var(--kbq-form-field-states-disabled-text);-webkit-text-fill-color:var(--kbq-form-field-states-disabled-text)}.kbq-form-field .kbq-form-field__prefix .kbq-icon.kbq-empty,.kbq-form-field .kbq-form-field__suffix .kbq-icon.kbq-empty{color:var(--kbq-icon-contrast-fade)}.kbq-form-field .kbq-form-field__hint>.kbq-hint:not(.kbq-password-hint,.kbq-contrast-fade,.kbq-success,.kbq-warning,.kbq-error){color:var(--kbq-form-field-hint-text)}.kbq-form-field{font-size:var(--kbq-typography-text-normal-font-size);font-style:var(--kbq-typography-text-normal-font-style);font-weight:var(--kbq-typography-text-normal-font-weight);line-height:var(--kbq-typography-text-normal-line-height);font-family:var(--kbq-typography-text-normal-font-family);text-transform:var(--kbq-typography-text-normal-text-transform);font-feature-settings:var(--kbq-typography-text-normal-font-feature-settings);letter-spacing:var(--kbq-typography-text-normal-letter-spacing)}.kbq-form-field .kbq-form-field__hint>.kbq-hint:not(.kbq-password-hint,.kbq-reactive-password-hint,.kbq-contrast-fade,.kbq-success,.kbq-warning) .kbq-hint__text{font-size:var(--kbq-typography-text-compact-font-size);font-style:var(--kbq-typography-text-compact-font-style);font-weight:var(--kbq-typography-text-compact-font-weight);line-height:var(--kbq-typography-text-compact-line-height);font-family:var(--kbq-typography-text-compact-font-family);text-transform:var(--kbq-typography-text-compact-text-transform);font-feature-settings:var(--kbq-typography-text-compact-font-feature-settings);letter-spacing:var(--kbq-typography-text-compact-letter-spacing)}.kbq-file-upload{box-sizing:border-box;display:flex;align-items:center;position:relative}.kbq-file-upload .kbq-file-item{display:flex;align-items:center}.kbq-file-upload .kbq-file-dropzone{display:flex;align-items:baseline;gap:var(--dropzone-gap, var(--kbq-file-upload-size-dropzone-content-gap-horizontal))}.kbq-file-upload__hint{display:flex;flex-direction:column;gap:var(--kbq-form-field-hint-size-gap);margin-top:var(--kbq-form-field-hint-size-margin-top)}.kbq-file-upload__hint:has(.kbq-reactive-password-hint,.kbq-password-hint){--kbq-form-field-hint-size-gap: var(--kbq-size-s)}.kbq-file-upload__hint:has(:is(.kbq-reactive-password-hint,.kbq-password-hint):first-child){--kbq-form-field-hint-size-margin-top: var(--kbq-size-m)}:where(.kbq-file-upload__hint .kbq-hint){color:var(--kbq-foreground-contrast-secondary)}.kbq-file-upload{font-size:var(--kbq-typography-text-normal-font-size);font-style:var(--kbq-typography-text-normal-font-style);font-weight:var(--kbq-typography-text-normal-font-weight);line-height:var(--kbq-typography-text-normal-line-height);font-family:var(--kbq-typography-text-normal-font-family);text-transform:var(--kbq-typography-text-normal-text-transform);font-feature-settings:var(--kbq-typography-text-normal-font-feature-settings);letter-spacing:var(--kbq-typography-text-normal-letter-spacing)}.kbq-file-upload__hint .kbq-hint .kbq-hint__text{font-size:var(--kbq-typography-text-compact-font-size);font-style:var(--kbq-typography-text-compact-font-style);font-weight:var(--kbq-typography-text-compact-font-weight);line-height:var(--kbq-typography-text-compact-line-height);font-family:var(--kbq-typography-text-compact-font-family);text-transform:var(--kbq-typography-text-compact-text-transform);font-feature-settings:var(--kbq-typography-text-compact-font-feature-settings);letter-spacing:var(--kbq-typography-text-compact-letter-spacing)}\n", ":where(.kbq-file-upload){--kbq-file-upload-size-dropzone-content-gap-horizontal: var(--kbq-size-s);--kbq-form-field-hint-text: var(--kbq-foreground-contrast-secondary)}:where(.kbq-single-file-upload){--kbq-form-field-hint-size-margin-top: var(--kbq-size-xs);--kbq-form-field-hint-size-gap: var(--kbq-size-xxs);--kbq-file-upload-size-single-container-border-radius: var(--kbq-size-s);--kbq-file-upload-size-single-container-border-width: 1px;--kbq-file-upload-size-single-container-content-gap-horizontal: var(--kbq-size-s);--kbq-file-upload-size-single-container-padding-vertical: var(--kbq-size-m);--kbq-file-upload-size-single-container-padding-horizontal: var(--kbq-size-l);--kbq-file-upload-size-single-text-block-padding-vertical: var(--kbq-size-3xs);--kbq-file-upload-size-single-text-block-content-gap-horizontal: var(--kbq-size-xxs);--kbq-file-upload-single-min-height: 44px;--kbq-file-upload-single-default-container-border: var(--kbq-line-contrast-fade);--kbq-file-upload-single-default-container-background: var(--kbq-background-bg);--kbq-file-upload-single-default-dropzone-icon-color: var(--kbq-icon-contrast-fade);--kbq-file-upload-single-default-left-icon-color: var(--kbq-icon-contrast-fade);--kbq-file-upload-single-default-text-block-color: var(--kbq-foreground-contrast);--kbq-file-upload-single-default-file-size-text-color: var(--kbq-foreground-contrast-secondary);--kbq-file-upload-single-states-on-drag-container-border: var(--kbq-line-theme-fade);--kbq-file-upload-single-states-on-drag-container-background: var(--kbq-background-theme-fade);--kbq-file-upload-single-states-on-drag-dropzone-icon-color: var(--kbq-icon-contrast-fade);--kbq-file-upload-single-states-on-drag-left-icon-color: var(--kbq-icon-contrast-fade);--kbq-file-upload-single-states-on-drag-text-block-color: var(--kbq-foreground-contrast);--kbq-file-upload-single-states-error-container-border: var(--kbq-line-error);--kbq-file-upload-single-states-error-container-background: var(--kbq-background-error-less);--kbq-file-upload-single-states-error-dropzone-icon-color: var(--kbq-icon-error);--kbq-file-upload-single-states-error-left-icon-color: var(--kbq-icon-error);--kbq-file-upload-single-states-error-text-block-color: var(--kbq-foreground-error);--kbq-file-upload-single-states-error-file-size-text-color: var(--kbq-foreground-error);--kbq-file-upload-single-states-disabled-container-border: var(--kbq-states-line-disabled);--kbq-file-upload-single-states-disabled-container-background: var(--kbq-states-background-disabled);--kbq-file-upload-single-states-disabled-dropzone-icon-color: var(--kbq-states-icon-disabled);--kbq-file-upload-single-states-disabled-left-icon-color: var(--kbq-states-icon-disabled);--kbq-file-upload-single-states-disabled-text-block-color: var(--kbq-states-foreground-disabled);--kbq-file-upload-single-states-disabled-file-size-text-color: var(--kbq-states-foreground-disabled);--kbq-file-upload-single-states-focused-focus-outline-color: var(--kbq-states-line-focus-theme)}:where(.kbq-multiple-file-upload){--kbq-form-field-hint-size-margin-top: var(--kbq-size-xs);--kbq-form-field-hint-size-gap: var(--kbq-size-xxs);--kbq-file-upload-size-multiple-min-height: 120px;--kbq-file-upload-size-multiple-max-height: unset;--kbq-file-upload-size-multiple-big-container-min-height: 192px;--kbq-file-upload-size-multiple-big-container-min-width: 320px;--kbq-file-upload-size-multiple-big-container-border-radius: var(--kbq-size-s);--kbq-file-upload-size-multiple-big-container-border-width: 1px;--kbq-file-upload-size-multiple-big-container-content-gap-horizontal: var(--kbq-size-m);--kbq-file-upload-size-multiple-big-container-padding-vertical: var(--kbq-size-xxl);--kbq-file-upload-size-multiple-big-container-padding-horizontal: var(--kbq-size-xxl);--kbq-file-upload-size-multiple-big-dropzone-content-gap-horizontal: var(--kbq-size-s);--kbq-file-upload-size-multiple-big-text-block-content-gap-vertical: 0px;--kbq-file-upload-size-multiple-big-text-block-content-gap-horizontal: var(--kbq-size-xxs);--kbq-file-upload-size-multiple-big-grid-cell-padding-horizontal: var(--kbq-size-s);--kbq-file-upload-size-multiple-big-grid-cell-padding-vertical: var(--kbq-size-s);--kbq-file-upload-size-multiple-big-grid-cell-content-gap-horizontal: var(--kbq-size-s);--kbq-file-upload-size-multiple-big-grid-cell-file-size-width: var(--kbq-size-7xl);--kbq-file-upload-multiple-default-container-border: var(--kbq-line-contrast-fade);--kbq-file-upload-multiple-default-container-background: var(--kbq-background-bg);--kbq-file-upload-multiple-default-upload-icon-color: var(--kbq-icon-contrast);--kbq-file-upload-multiple-default-dropzone-icon-color: var(--kbq-icon-contrast-fade);--kbq-file-upload-multiple-default-left-icon-color: var(--kbq-icon-contrast-fade);--kbq-file-upload-multiple-default-text-block-color: var(--kbq-foreground-contrast);--kbq-file-upload-multiple-default-grid-divider-color: var(--kbq-line-contrast-less);--kbq-file-upload-multiple-default-file-size-text-color: var(--kbq-foreground-contrast-secondary);--kbq-file-upload-multiple-states-on-drag-container-border: var(--kbq-line-theme-fade);--kbq-file-upload-multiple-states-on-drag-container-background: var(--kbq-background-theme-fade);--kbq-file-upload-multiple-states-on-drag-upload-icon-color: var(--kbq-icon-contrast);--kbq-file-upload-multiple-states-on-drag-dropzone-icon-color: var(--kbq-icon-contrast-fade);--kbq-file-upload-multiple-states-on-drag-left-icon-color: var(--kbq-icon-contrast-fade);--kbq-file-upload-multiple-states-on-drag-text-block-color: var(--kbq-foreground-contrast);--kbq-file-upload-multiple-states-on-drag-grid-divider-color: var(--kbq-line-contrast-less);--kbq-file-upload-multiple-states-error-container-border: var(--kbq-line-error);--kbq-file-upload-multiple-states-error-container-background: var(--kbq-background-error-less);--kbq-file-upload-multiple-states-error-upload-icon-color: var(--kbq-icon-error);--kbq-file-upload-multiple-states-error-dropzone-icon-color: var(--kbq-icon-error);--kbq-file-upload-multiple-states-error-left-icon-color: var(--kbq-icon-error);--kbq-file-upload-multiple-states-error-icon-button-color: var(--kbq-icon-error);--kbq-file-upload-multiple-states-error-text-block-color: var(--kbq-foreground-error);--kbq-file-upload-multiple-states-disabled-container-border: var(--kbq-states-line-disabled);--kbq-file-upload-multiple-states-disabled-container-background: var(--kbq-states-background-disabled);--kbq-file-upload-multiple-states-disabled-upload-icon-color: var(--kbq-states-icon-disabled);--kbq-file-upload-multiple-states-disabled-dropzone-icon-color: var(--kbq-states-icon-disabled);--kbq-file-upload-multiple-states-disabled-left-icon-color: var(--kbq-states-icon-disabled);--kbq-file-upload-multiple-states-disabled-text-block-color: var(--kbq-states-foreground-disabled);--kbq-file-upload-multiple-states-disabled-grid-divider-color: var(--kbq-states-line-disabled);--kbq-file-upload-multiple-states-focused-focus-outline-color: var(--kbq-states-line-focus-theme)}:where(.kbq-file-upload.kbq-file-upload_compact){--kbq-file-upload-multiple-compact-container-content-gap-horizontal: var(--kbq-size-s);--kbq-file-upload-multiple-compact-text-block-padding-vertical: var(--kbq-size-3xs);--kbq-file-upload-multiple-compact-container-padding-vertical: 11px;--kbq-file-upload-multiple-compact-container-padding-horizontal: 15px}\n", ".kbq-single-file-upload .kbq-file-upload__dropzone-icon>svg{vertical-align:bottom}.kbq-single-file-upload.kbq-single-file-upload_selected .kbq-file-upload .kbq-file-item{padding:calc(var(--kbq-file-upload-size-single-container-padding-vertical) - var(--kbq-file-upload-size-single-container-border-width)) calc(var(--kbq-file-upload-size-single-container-padding-horizontal) - var(--kbq-file-upload-size-single-container-border-width));padding-right:0}.kbq-single-file-upload:not(.kbq-single-file-upload_selected) .kbq-file-upload{padding:calc(var(--kbq-file-upload-size-single-container-padding-vertical) - var(--kbq-file-upload-size-single-container-border-width)) calc(var(--kbq-file-upload-size-single-container-padding-horizontal) - var(--kbq-file-upload-size-single-container-border-width))}.kbq-single-file-upload .kbq-file-upload{min-height:var(--kbq-file-upload-single-min-height);border-radius:var(--kbq-file-upload-size-single-container-border-radius);border-width:var(--kbq-file-upload-size-single-container-border-width);border-style:dashed}.kbq-single-file-upload .kbq-file-upload .kbq-file-item{width:100%;min-width:0}.kbq-single-file-upload .kbq-file-upload .kbq-file-item .kbq-file-item__text-wrapper{display:flex;align-items:center;width:100%;min-width:0;gap:var(--kbq-file-upload-size-single-container-content-gap-horizontal)}.kbq-single-file-upload .kbq-file-upload .kbq-file-item .kbq-file-item__text-wrapper .kbq-file-item__text{flex:1 1 auto}.kbq-single-file-upload .kbq-file-upload .kbq-file-item .kbq-file-item__size{padding:0 var(--kbq-size-s)}.kbq-single-file-upload .kbq-file-upload .kbq-file-upload__action{padding:13px}.kbq-single-file-upload .kbq-file-upload{background-color:var(--kbq-file-upload-single-default-container-background);border-color:var(--kbq-file-upload-single-default-container-border)!important}.kbq-single-file-upload .kbq-file-upload:not(.kbq-disabled,.kbq-error) .kbq-file-upload__dropzone-icon{color:var(--kbq-file-upload-single-default-dropzone-icon-color)}.kbq-single-file-upload .kbq-file-upload:not(.kbq-disabled,.kbq-error) .kbq-file-item__text-wrapper .kbq-icon.kbq-empty{color:var(--kbq-file-upload-single-default-left-icon-color)}.kbq-single-file-upload .kbq-file-upload:not(.kbq-disabled,.kbq-error) .kbq-file-item__size{color:var(--kbq-file-upload-single-default-file-size-text-color)}.kbq-single-file-upload .kbq-file-upload.kbq-file-drop_dragover{background-color:var(--kbq-file-upload-single-states-on-drag-container-background);border-color:var(--kbq-file-upload-single-states-on-drag-container-border)!important}.kbq-single-file-upload .kbq-file-upload.kbq-error:not(.kbq-disabled):not(.kbq-file-drop_dragover){background-color:var(--kbq-file-upload-single-states-error-container-background);border-color:var(--kbq-file-upload-single-states-error-container-border)!important}.kbq-single-file-upload .kbq-file-upload.kbq-error:not(.kbq-disabled) .kbq-file-upload__dropzone-icon{color:var(--kbq-file-upload-single-states-error-dropzone-icon-color)}.kbq-single-file-upload .kbq-file-upload.kbq-error:not(.kbq-disabled) .kbq-file-item__text-wrapper .kbq-icon.kbq-empty{color:var(--kbq-file-upload-single-states-error-left-icon-color)}.kbq-single-file-upload .kbq-file-upload.kbq-error:not(.kbq-disabled) .kbq-file-item__text,.kbq-single-file-upload .kbq-file-upload.kbq-error:not(.kbq-disabled) .kbq-file-upload__dropzone-caption:not(.kbq-link){color:var(--kbq-file-upload-single-states-error-text-block-color)}.kbq-single-file-upload .kbq-file-upload.kbq-error:not(.kbq-disabled) .kbq-file-item__size{color:var(--kbq-file-upload-single-states-error-file-size-text-color)}.kbq-single-file-upload .kbq-file-upload.kbq-disabled{background-color:var(--kbq-file-upload-single-states-disabled-container-background);border-color:var(--kbq-file-upload-single-states-disabled-container-border)!important}.kbq-single-file-upload .kbq-file-upload.kbq-disabled .kbq-file-upload__dropzone-icon{color:var(--kbq-file-upload-single-states-disabled-dropzone-icon-color)}.kbq-single-file-upload .kbq-file-upload.kbq-disabled .kbq-file-item__text-wrapper .kbq-icon.kbq-empty{color:var(--kbq-file-upload-single-states-disabled-left-icon-color)}.kbq-single-file-upload .kbq-file-upload.kbq-disabled .kbq-file-upload__dropzone-caption,.kbq-single-file-upload .kbq-file-upload.kbq-disabled .kbq-file-item__text{color:var(--kbq-file-upload-single-states-disabled-text-block-color)}.kbq-single-file-upload .kbq-file-upload.kbq-disabled .kbq-file-item__size{color:var(--kbq-file-upload-single-states-disabled-file-size-text-color)}\n"] }]
|
|
1323
|
-
}], ctorParameters: () => [], propDecorators: { progressMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "progressMode", required: false }] }], accept: [{ type: i0.Input, args: [{ isSignal: true, alias: "accept", required: false }] }], inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: false }] }], errorStateMatcher: [{
|
|
1324
|
-
type: Input
|
|
1325
|
-
}], file: [{
|
|
1326
|
-
type: Input
|
|
1327
|
-
}], showFileSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "showFileSize", required: false }] }], allowed: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowed", required: false }] }], fullScreenDropZone: [{ type: i0.Input, args: [{ isSignal: true, alias: "fullScreenDropZone", required: false }] }], localeConfig: [{ type: i0.Input, args: [{ isSignal: true, alias: "localeConfig", required: false }] }], fileChange: [{ type: i0.Output, args: ["fileChange"] }], fileQueueChange: [{ type: i0.Output, args: ["fileQueueChange"] }], fileLoader: [{ type: i0.ViewChild, args: [i0.forwardRef(() => KbqFileLoader), { isSignal: true }] }], hint: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => KbqHint), { isSignal: true }] }] } });
|
|
1588
|
+
], template: "<div\n kbqFileDrop\n class=\"kbq-file-upload\"\n [class.kbq-disabled]=\"disabled\"\n [class.kbq-error]=\"invalid\"\n [disabled]=\"!!fullScreenDropZone()\"\n (filesDropped)=\"onFileDropped($event)\"\n>\n @if (!file) {\n <div class=\"kbq-file-dropzone\">\n <i kbq-icon=\"kbq-arrow-up-from-bracket_16\" class=\"kbq-file-upload__dropzone-icon\"></i>\n <span class=\"kbq-file-upload__dropzone-caption\">\n <ng-container *ngTemplateOutlet=\"captionText; context: captionContext()\" />\n </span>\n </div>\n } @else {\n @if (file) {\n <div class=\"kbq-file-item\">\n <div class=\"kbq-file-item__text-wrapper\">\n @if (!isLoading(file)) {\n <ng-content select=\"[kbq-icon]\" />\n } @else {\n <kbq-progress-spinner [mode]=\"progressMode()\" [value]=\"uploadProgress(file)\" />\n }\n <div class=\"kbq-file-item__text\" [kbqEllipsisCenter]=\"file.file.name\" [minVisibleLength]=\"10\"></div>\n </div>\n @if (showFileSize()) {\n <div class=\"kbq-file-item__size\">\n {{ file.file.size | kbqDataSize }}\n </div>\n }\n </div>\n <i\n kbq-icon-button=\"kbq-circle-xmark_16\"\n class=\"kbq-file-upload__action\"\n [attr.aria-label]=\"a11yNames().remove\"\n [color]=\"invalid ? 'error' : 'contrast-fade'\"\n [disabled]=\"disabled\"\n (click)=\"deleteItem($event, 'program')\"\n (keydown.enter)=\"deleteItem($event, 'program')\"\n (keydown.space)=\"$event.preventDefault(); deleteItem($event, 'program')\"\n (keydown.backspace)=\"deleteItem()\"\n (keydown.delete)=\"deleteItem()\"\n ></i>\n }\n }\n</div>\n\n@if (hasHint) {\n <div class=\"kbq-file-upload__hint\">\n <ng-content select=\"kbq-hint\" />\n </div>\n}\n\n<!-- Announces additions and removals: nothing else in the component reaches assistive tech (WCAG 4.1.3). -->\n<div class=\"cdk-visually-hidden\" role=\"status\" aria-live=\"polite\" aria-atomic=\"true\">{{ announcement() }}</div>\n\n<ng-template\n #captionText\n let-captionText=\"captionText\"\n let-browseLink=\"browseLink\"\n let-captionTextSeparator=\"captionTextSeparator\"\n let-browseLinkFolder=\"browseLinkFolder\"\n>\n @if (captionText) {\n {{ captionText }}\n }\n @if (browseLink) {\n <label\n kbqFileLoader\n cdkMonitorSubtreeFocus\n [onlyDirectory]=\"null\"\n [accept]=\"acceptedFiles\"\n [disabled]=\"disabled\"\n [describedBy]=\"describedBy()\"\n [invalid]=\"invalid\"\n [for]=\"fileUploadContext.id() || inputId()\"\n (fileChange)=\"onFileSelectedViaClick($event)\"\n >\n <span class=\"kbq-file-upload__browse-link\" kbqLink size=\"normal\" [disabled]=\"disabled\" [tabIndex]=\"-1\">\n {{ browseLink }}\n </span>\n </label>\n }\n @if (captionTextSeparator) {\n {{ captionTextSeparator }}\n }\n @if (browseLinkFolder) {\n <label\n kbqFileLoader\n cdkMonitorSubtreeFocus\n [onlyDirectory]=\"true\"\n [disabled]=\"disabled\"\n [describedBy]=\"describedBy()\"\n [invalid]=\"invalid\"\n (fileChange)=\"onFileSelectedViaClick($event)\"\n >\n <span class=\"kbq-file-upload__browse-link\" kbqLink size=\"normal\" [disabled]=\"disabled\" [tabIndex]=\"-1\">\n {{ browseLinkFolder }}\n </span>\n </label>\n }\n</ng-template>\n", styles: [".kbq-form-field{--kbq-form-field-label-margin-bottom: var(--kbq-size-xs);position:relative;display:inline-block;width:100%}.kbq-form-field.kbq-form-field_horizontal{display:flex;flex-direction:row;align-items:flex-start}.kbq-form-field.kbq-form-field_horizontal .kbq-form-field__label{--kbq-form-field-label-margin-bottom: 0;padding:var(--kbq-size-xs) var(--kbq-size-l) 0 0}.kbq-form-field .kbq-form-field__content{flex:1}.kbq-form-field .kbq-form-field__label{box-sizing:border-box;display:flex;margin-bottom:var(--kbq-form-field-label-margin-bottom)}.kbq-form-field.kbq-form-field-type-select .kbq-form-field__suffix{margin-right:0}.kbq-form-field .kbq-form-field__container{box-sizing:border-box;display:flex;justify-content:space-between;align-items:center;border-width:var(--kbq-form-field-size-border-width);border-style:solid;border-color:transparent;border-radius:var(--kbq-form-field-size-border-radius)}@supports (corner-shape: squircle){.kbq-form-field .kbq-form-field__container{corner-shape:squircle;border-radius:clamp(var(--kbq-form-field-size-border-radius) * 1.85,var(--kbq-form-field-size-border-radius) * 2.3 - 3.6px,var(--kbq-form-field-size-border-radius) * 2)}}.kbq-form-field .kbq-form-field__container{padding-left:var(--kbq-form-field-size-container-left-padding);padding-right:var(--kbq-form-field-size-container-right-padding)}.kbq-form-field .kbq-form-field__container:has(.kbq-textarea){--kbq-form-field-size-container-left-padding: 0;--kbq-form-field-size-container-right-padding: 0}.kbq-form-field .kbq-form-field__infix{box-sizing:border-box;width:100%;flex-grow:1;padding-left:var(--kbq-form-field-size-infix-left-padding)}.kbq-form-field .kbq-form-field__infix:has(.kbq-select_multiple,.kbq-select_multiline):not(:has(.kbq-select__trigger_empty)),.kbq-form-field .kbq-form-field__infix:has(.kbq-tag-list),.kbq-form-field .kbq-form-field__infix:has(.kbq-textarea){padding-left:0;max-width:100%}.kbq-form-field .kbq-form-field__infix:has(.kbq-select_multiple,.kbq-select_multiline):has(kbq-select-trigger,[kbq-select-trigger]){padding-left:var(--kbq-form-field-size-infix-left-padding)}.kbq-form-field .kbq-form-field__infix .kbq-input,.kbq-form-field .kbq-form-field__infix .kbq-tag-input{padding-right:var(--kbq-form-field-size-infix-right-padding)}.kbq-form-field,.kbq-form-field .kbq-textarea{border-radius:var(--kbq-form-field-size-border-radius)}@supports (corner-shape: squircle){.kbq-form-field,.kbq-form-field .kbq-textarea{corner-shape:squircle;border-radius:clamp(var(--kbq-form-field-size-border-radius) * 1.85,var(--kbq-form-field-size-border-radius) * 2.3 - 3.6px,var(--kbq-form-field-size-border-radius) * 2)}}.kbq-form-field:hover{z-index:1}.kbq-form-field.cdk-focused,.kbq-form-field.kbq-focused{z-index:3}.kbq-form-field.kbq-form-field_without-borders,.kbq-form-field.kbq-form-field_no-borders{--kbq-form-field-default-border-color: transparent;--kbq-form-field-states-focused-border-color: transparent;--kbq-form-field-states-error-border-color: transparent;--kbq-form-field-states-disabled-border-color: transparent;--kbq-form-field-states-focused-focus-outline: transparent;--kbq-form-field-states-error-focused-focus-outline: transparent}.kbq-form-field.kbq-form-field_in-overlay{--kbq-form-field-default-background: var(--kbq-background-card);--kbq-form-field-states-focused-background: var(--kbq-background-card);--kbq-form-field-states-error-background: var(--kbq-background-card);--kbq-form-field-states-disabled-background: var(--kbq-background-card)}.kbq-form-field .kbq-form-field__prefix,.kbq-form-field .kbq-form-field__suffix{display:flex;justify-content:center;align-items:center}.kbq-form-field .kbq-form-field__prefix .kbq-prefix,.kbq-form-field .kbq-form-field__prefix .kbq-suffix,.kbq-form-field .kbq-form-field__suffix .kbq-prefix,.kbq-form-field .kbq-form-field__suffix .kbq-suffix{min-width:var(--kbq-form-field-size-addon-width);text-align:center}.kbq-form-field .kbq-form-field__prefix+.kbq-form-field__infix{padding-left:0}.kbq-form-field .kbq-form-field__hint{display:flex;flex-direction:column;gap:var(--kbq-form-field-hint-size-gap);margin-top:var(--kbq-form-field-hint-size-margin-top)}.kbq-form-field .kbq-form-field__hint:has(.kbq-reactive-password-hint){--kbq-form-field-hint-size-gap: var(--kbq-size-s)}.kbq-form-field .kbq-form-field__hint:has(.kbq-reactive-password-hint:first-child){--kbq-form-field-hint-size-margin-top: var(--kbq-size-m)}.kbq-form-field .kbq-form-field__container{border-color:var(--kbq-form-field-default-border-color);background-color:var(--kbq-form-field-default-background)}.kbq-form-field .kbq-input,.kbq-form-field .kbq-tag-input,.kbq-form-field .kbq-textarea{--kbq-form-field-resolved-text: var(--kbq-form-field-default-text);color:var(--kbq-form-field-resolved-text)}.kbq-form-field .kbq-input::placeholder,.kbq-form-field .kbq-tag-input::placeholder,.kbq-form-field .kbq-textarea::placeholder{color:var(--kbq-form-field-default-placeholder)}.kbq-form-field .kbq-input::-ms-input-placeholder,.kbq-form-field .kbq-tag-input::-ms-input-placeholder,.kbq-form-field .kbq-textarea::-ms-input-placeholder{color:var(--kbq-form-field-default-placeholder)}.kbq-form-field .kbq-input::-webkit-input-placeholder,.kbq-form-field .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field .kbq-textarea::-webkit-input-placeholder{color:var(--kbq-form-field-default-placeholder)}.kbq-form-field .kbq-input:is(:autofill,:-webkit-autofill),.kbq-form-field .kbq-tag-input:is(:autofill,:-webkit-autofill),.kbq-form-field .kbq-textarea:is(:autofill,:-webkit-autofill){transition-property:background-color;transition-duration:600000s;-webkit-text-fill-color:var(--kbq-form-field-resolved-text, var(--kbq-form-field-default-text));caret-color:var(--kbq-form-field-resolved-text, var(--kbq-form-field-default-text))}.kbq-form-field.kbq-form-field_invalid .kbq-form-field__container{border-color:var(--kbq-form-field-states-error-border-color);background-color:var(--kbq-form-field-states-error-background)}.kbq-form-field.kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field_invalid .kbq-textarea{--kbq-form-field-resolved-text: var(--kbq-form-field-states-error-text);color:var(--kbq-form-field-resolved-text)}.kbq-form-field.kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field_invalid .kbq-textarea::placeholder{color:var(--kbq-form-field-states-error-placeholder)}.kbq-form-field.kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder{color:var(--kbq-form-field-states-error-placeholder)}.kbq-form-field.kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder{color:var(--kbq-form-field-states-error-placeholder)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container{border-color:var(--kbq-form-field-states-focused-border-color);background-color:var(--kbq-form-field-states-focused-background)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea{--kbq-form-field-resolved-text: var(--kbq-form-field-states-focused-text);color:var(--kbq-form-field-resolved-text)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::placeholder{color:var(--kbq-form-field-states-focused-placeholder)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-ms-input-placeholder{color:var(--kbq-form-field-states-focused-placeholder)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-textarea::-webkit-input-placeholder{color:var(--kbq-form-field-states-focused-placeholder)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).cdk-focused .kbq-form-field__container{box-shadow:inset 0 0 .1px var(--kbq-form-field-size-focus-outline-width) var(--kbq-form-field-states-focused-focus-outline)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-form-field__container{border-color:var(--kbq-form-field-states-error-border-color);background-color:var(--kbq-form-field-states-error-background)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea{--kbq-form-field-resolved-text: var(--kbq-form-field-states-error-text);color:var(--kbq-form-field-resolved-text)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::placeholder{color:var(--kbq-form-field-states-error-placeholder)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-ms-input-placeholder{color:var(--kbq-form-field-states-error-placeholder)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-textarea::-webkit-input-placeholder{color:var(--kbq-form-field-states-error-placeholder)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid.cdk-focused .kbq-form-field__container{box-shadow:inset 0 0 .1px var(--kbq-form-field-size-focus-outline-width) var(--kbq-form-field-states-error-focused-focus-outline)}.kbq-form-field.kbq-form-field-type-input:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-input-number:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-textarea:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-timepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-datepicker:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-input-password:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-tag-list:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty,.kbq-form-field.kbq-form-field-type-select:not(:has(.cdk-keyboard-focused,.kbq-focused)).kbq-form-field_invalid .kbq-icon.kbq-empty{color:var(--kbq-form-field-states-error-text);-webkit-text-fill-color:var(--kbq-form-field-states-error-text)}.kbq-form-field .kbq-form-field__label{color:var(--kbq-form-field-label-color)}.kbq-form-field .kbq-form-field__container:has(:is(.kbq-input,.kbq-tag-input,.kbq-textarea):is(:autofill,:-webkit-autofill)){background-image:linear-gradient(var(--kbq-form-field-states-autofill-background),var(--kbq-form-field-states-autofill-background))}.kbq-form-field.kbq-disabled .kbq-form-field__container{border-color:var(--kbq-form-field-states-disabled-border-color);background-color:var(--kbq-form-field-states-disabled-background)}.kbq-form-field.kbq-disabled .kbq-input,.kbq-form-field.kbq-disabled .kbq-tag-input,.kbq-form-field.kbq-disabled .kbq-textarea{--kbq-form-field-resolved-text: var(--kbq-form-field-states-disabled-text);color:var(--kbq-form-field-resolved-text)}.kbq-form-field.kbq-disabled .kbq-input::placeholder,.kbq-form-field.kbq-disabled .kbq-tag-input::placeholder,.kbq-form-field.kbq-disabled .kbq-textarea::placeholder{color:var(--kbq-form-field-states-disabled-placeholder)}.kbq-form-field.kbq-disabled .kbq-input::-ms-input-placeholder,.kbq-form-field.kbq-disabled .kbq-tag-input::-ms-input-placeholder,.kbq-form-field.kbq-disabled .kbq-textarea::-ms-input-placeholder{color:var(--kbq-form-field-states-disabled-placeholder)}.kbq-form-field.kbq-disabled .kbq-input::-webkit-input-placeholder,.kbq-form-field.kbq-disabled .kbq-tag-input::-webkit-input-placeholder,.kbq-form-field.kbq-disabled .kbq-textarea::-webkit-input-placeholder{color:var(--kbq-form-field-states-disabled-placeholder)}.kbq-form-field.kbq-disabled .kbq-icon.kbq-empty{color:var(--kbq-form-field-states-disabled-text);-webkit-text-fill-color:var(--kbq-form-field-states-disabled-text)}.kbq-form-field .kbq-form-field__prefix .kbq-icon.kbq-empty,.kbq-form-field .kbq-form-field__suffix .kbq-icon.kbq-empty{color:var(--kbq-icon-contrast-fade)}.kbq-form-field .kbq-form-field__hint>.kbq-hint:not(.kbq-contrast-fade,.kbq-success,.kbq-warning,.kbq-error){color:var(--kbq-form-field-hint-text)}.kbq-form-field{font-size:var(--kbq-typography-text-normal-font-size);font-style:var(--kbq-typography-text-normal-font-style);font-weight:var(--kbq-typography-text-normal-font-weight);line-height:var(--kbq-typography-text-normal-line-height);font-family:var(--kbq-typography-text-normal-font-family);text-transform:var(--kbq-typography-text-normal-text-transform);font-feature-settings:var(--kbq-typography-text-normal-font-feature-settings);letter-spacing:var(--kbq-typography-text-normal-letter-spacing)}.kbq-form-field .kbq-form-field__hint>.kbq-hint:not(.kbq-reactive-password-hint,.kbq-contrast-fade,.kbq-success,.kbq-warning) .kbq-hint__text{font-size:var(--kbq-typography-text-compact-font-size);font-style:var(--kbq-typography-text-compact-font-style);font-weight:var(--kbq-typography-text-compact-font-weight);line-height:var(--kbq-typography-text-compact-line-height);font-family:var(--kbq-typography-text-compact-font-family);text-transform:var(--kbq-typography-text-compact-text-transform);font-feature-settings:var(--kbq-typography-text-compact-font-feature-settings);letter-spacing:var(--kbq-typography-text-compact-letter-spacing)}.kbq-file-upload{box-sizing:border-box;display:flex;align-items:center;position:relative}.kbq-file-upload .kbq-file-item{display:flex;align-items:center}.kbq-file-upload .kbq-file-dropzone{display:flex;align-items:baseline;gap:var(--dropzone-gap, var(--kbq-file-upload-size-dropzone-content-gap-horizontal))}.kbq-file-loader.cdk-keyboard-focused>.kbq-file-upload__browse-link{outline-style:solid;outline-width:var(--kbq-link-size-state-focused-outline-width);outline-color:var(--kbq-link-state-focused-outline)}.kbq-file-upload__hint{display:flex;flex-direction:column;gap:var(--kbq-form-field-hint-size-gap);margin-top:var(--kbq-form-field-hint-size-margin-top)}.kbq-file-upload__hint:has(.kbq-reactive-password-hint){--kbq-form-field-hint-size-gap: var(--kbq-size-s)}.kbq-file-upload__hint:has(.kbq-reactive-password-hint:first-child){--kbq-form-field-hint-size-margin-top: var(--kbq-size-m)}:where(.kbq-file-upload__hint .kbq-hint){color:var(--kbq-foreground-contrast-secondary)}.kbq-file-upload{font-size:var(--kbq-typography-text-normal-font-size);font-style:var(--kbq-typography-text-normal-font-style);font-weight:var(--kbq-typography-text-normal-font-weight);line-height:var(--kbq-typography-text-normal-line-height);font-family:var(--kbq-typography-text-normal-font-family);text-transform:var(--kbq-typography-text-normal-text-transform);font-feature-settings:var(--kbq-typography-text-normal-font-feature-settings);letter-spacing:var(--kbq-typography-text-normal-letter-spacing)}.kbq-file-upload__hint .kbq-hint .kbq-hint__text{font-size:var(--kbq-typography-text-compact-font-size);font-style:var(--kbq-typography-text-compact-font-style);font-weight:var(--kbq-typography-text-compact-font-weight);line-height:var(--kbq-typography-text-compact-line-height);font-family:var(--kbq-typography-text-compact-font-family);text-transform:var(--kbq-typography-text-compact-text-transform);font-feature-settings:var(--kbq-typography-text-compact-font-feature-settings);letter-spacing:var(--kbq-typography-text-compact-letter-spacing)}\n", ":where(.kbq-file-upload){--kbq-file-upload-size-dropzone-content-gap-horizontal: var(--kbq-size-s);--kbq-form-field-hint-text: var(--kbq-foreground-contrast-secondary)}:where(.kbq-single-file-upload){--kbq-form-field-hint-size-margin-top: var(--kbq-size-xs);--kbq-form-field-hint-size-gap: var(--kbq-size-xxs);--kbq-file-upload-size-single-container-border-radius: var(--kbq-size-s);--kbq-file-upload-size-single-container-border-width: 1px;--kbq-file-upload-size-single-container-content-gap-horizontal: var(--kbq-size-s);--kbq-file-upload-size-single-container-padding-vertical: var(--kbq-size-m);--kbq-file-upload-size-single-container-padding-horizontal: var(--kbq-size-l);--kbq-file-upload-single-min-height: 44px;--kbq-file-upload-size-single-action-padding: 13px;--kbq-file-upload-single-default-container-border: var(--kbq-line-contrast-fade);--kbq-file-upload-single-default-container-background: var(--kbq-background-bg);--kbq-file-upload-single-default-dropzone-icon-color: var(--kbq-icon-contrast-fade);--kbq-file-upload-single-default-left-icon-color: var(--kbq-icon-contrast-fade);--kbq-file-upload-single-default-file-size-text-color: var(--kbq-foreground-contrast-secondary);--kbq-file-upload-single-states-on-drag-container-border: var(--kbq-line-theme-fade);--kbq-file-upload-single-states-on-drag-container-background: var(--kbq-background-theme-fade);--kbq-file-upload-single-states-error-container-border: var(--kbq-line-error);--kbq-file-upload-single-states-error-container-background: var(--kbq-background-error-less);--kbq-file-upload-single-states-error-dropzone-icon-color: var(--kbq-icon-error);--kbq-file-upload-single-states-error-left-icon-color: var(--kbq-icon-error);--kbq-file-upload-single-states-error-text-block-color: var(--kbq-foreground-error);--kbq-file-upload-single-states-error-file-size-text-color: var(--kbq-foreground-error);--kbq-file-upload-single-states-disabled-container-border: var(--kbq-states-line-disabled);--kbq-file-upload-single-states-disabled-container-background: var(--kbq-states-background-disabled);--kbq-file-upload-single-states-disabled-dropzone-icon-color: var(--kbq-states-icon-disabled);--kbq-file-upload-single-states-disabled-left-icon-color: var(--kbq-states-icon-disabled);--kbq-file-upload-single-states-disabled-text-block-color: var(--kbq-states-foreground-disabled);--kbq-file-upload-single-states-disabled-file-size-text-color: var(--kbq-states-foreground-disabled)}:where(.kbq-multiple-file-upload){--kbq-form-field-hint-size-margin-top: var(--kbq-size-xs);--kbq-form-field-hint-size-gap: var(--kbq-size-xxs);--kbq-file-upload-size-multiple-min-height: 120px;--kbq-file-upload-size-multiple-max-height: unset;--kbq-file-upload-size-multiple-big-container-min-height: 192px;--kbq-file-upload-size-multiple-big-container-min-width: 320px;--kbq-file-upload-size-multiple-big-container-border-radius: var(--kbq-size-s);--kbq-file-upload-size-multiple-big-container-border-width: 1px;--kbq-file-upload-size-multiple-big-grid-cell-padding-horizontal: var(--kbq-size-s);--kbq-file-upload-size-multiple-big-grid-cell-content-gap-horizontal: var(--kbq-size-s);--kbq-file-upload-size-multiple-big-grid-cell-file-size-width: var(--kbq-size-7xl);--kbq-file-upload-multiple-default-container-border: var(--kbq-line-contrast-fade);--kbq-file-upload-multiple-default-container-background: var(--kbq-background-bg);--kbq-file-upload-multiple-default-upload-icon-color: var(--kbq-icon-contrast);--kbq-file-upload-multiple-default-dropzone-icon-color: var(--kbq-icon-contrast-fade);--kbq-file-upload-multiple-default-left-icon-color: var(--kbq-icon-contrast-fade);--kbq-file-upload-multiple-default-text-block-color: var(--kbq-foreground-contrast);--kbq-file-upload-multiple-default-file-size-text-color: var(--kbq-foreground-contrast-secondary);--kbq-file-upload-multiple-states-on-drag-container-border: var(--kbq-line-theme-fade);--kbq-file-upload-multiple-states-on-drag-container-background: var(--kbq-background-theme-fade);--kbq-file-upload-multiple-states-on-drag-upload-icon-color: var(--kbq-icon-contrast);--kbq-file-upload-multiple-states-on-drag-dropzone-icon-color: var(--kbq-icon-contrast-fade);--kbq-file-upload-multiple-states-error-container-border: var(--kbq-line-error);--kbq-file-upload-multiple-states-error-container-background: var(--kbq-background-error-less);--kbq-file-upload-multiple-states-error-upload-icon-color: var(--kbq-icon-error);--kbq-file-upload-multiple-states-error-dropzone-icon-color: var(--kbq-icon-error);--kbq-file-upload-multiple-states-error-left-icon-color: var(--kbq-icon-error);--kbq-file-upload-multiple-states-error-icon-button-color: var(--kbq-icon-error);--kbq-file-upload-multiple-states-error-text-block-color: var(--kbq-foreground-error);--kbq-file-upload-multiple-states-disabled-container-border: var(--kbq-states-line-disabled);--kbq-file-upload-multiple-states-disabled-container-background: var(--kbq-states-background-disabled);--kbq-file-upload-multiple-states-disabled-upload-icon-color: var(--kbq-states-icon-disabled);--kbq-file-upload-multiple-states-disabled-dropzone-icon-color: var(--kbq-states-icon-disabled);--kbq-file-upload-multiple-states-disabled-left-icon-color: var(--kbq-states-icon-disabled);--kbq-file-upload-multiple-states-disabled-text-block-color: var(--kbq-states-foreground-disabled)}:where(.kbq-file-upload.kbq-file-upload_compact){--kbq-file-upload-multiple-compact-container-padding-vertical: 11px;--kbq-file-upload-multiple-compact-container-padding-horizontal: 15px}\n", ".kbq-single-file-upload .kbq-file-upload__dropzone-icon>svg{vertical-align:bottom}.kbq-single-file-upload.kbq-single-file-upload_selected .kbq-file-upload .kbq-file-item{padding:calc(var(--kbq-file-upload-size-single-container-padding-vertical) - var(--kbq-file-upload-size-single-container-border-width)) calc(var(--kbq-file-upload-size-single-container-padding-horizontal) - var(--kbq-file-upload-size-single-container-border-width));padding-right:0}.kbq-single-file-upload:not(.kbq-single-file-upload_selected) .kbq-file-upload{padding:calc(var(--kbq-file-upload-size-single-container-padding-vertical) - var(--kbq-file-upload-size-single-container-border-width)) calc(var(--kbq-file-upload-size-single-container-padding-horizontal) - var(--kbq-file-upload-size-single-container-border-width))}.kbq-single-file-upload .kbq-file-upload{min-height:var(--kbq-file-upload-single-min-height);border-radius:var(--kbq-file-upload-size-single-container-border-radius)}@supports (corner-shape: squircle){.kbq-single-file-upload .kbq-file-upload{corner-shape:squircle;border-radius:clamp(var(--kbq-file-upload-size-single-container-border-radius) * 1.85,var(--kbq-file-upload-size-single-container-border-radius) * 2.3 - 3.6px,var(--kbq-file-upload-size-single-container-border-radius) * 2)}}.kbq-single-file-upload .kbq-file-upload{border-width:var(--kbq-file-upload-size-single-container-border-width);border-style:dashed}.kbq-single-file-upload .kbq-file-upload .kbq-file-item{width:100%;min-width:0}.kbq-single-file-upload .kbq-file-upload .kbq-file-item .kbq-file-item__text-wrapper{display:flex;align-items:center;width:100%;min-width:0;gap:var(--kbq-file-upload-size-single-container-content-gap-horizontal)}.kbq-single-file-upload .kbq-file-upload .kbq-file-item .kbq-file-item__text-wrapper .kbq-file-item__text{flex:1 1 auto}.kbq-single-file-upload .kbq-file-upload .kbq-file-item .kbq-file-item__size{padding:0 var(--kbq-size-s)}.kbq-single-file-upload .kbq-file-upload .kbq-file-upload__action{padding:var(--kbq-file-upload-size-single-action-padding)}.kbq-single-file-upload .kbq-file-upload{background-color:var(--kbq-file-upload-single-default-container-background);border-color:var(--kbq-file-upload-single-default-container-border)!important}.kbq-single-file-upload .kbq-file-upload:not(.kbq-disabled,.kbq-error) .kbq-file-upload__dropzone-icon{color:var(--kbq-file-upload-single-default-dropzone-icon-color)}.kbq-single-file-upload .kbq-file-upload:not(.kbq-disabled,.kbq-error) .kbq-file-item__text-wrapper .kbq-icon.kbq-empty{color:var(--kbq-file-upload-single-default-left-icon-color)}.kbq-single-file-upload .kbq-file-upload:not(.kbq-disabled,.kbq-error) .kbq-file-item__size{color:var(--kbq-file-upload-single-default-file-size-text-color)}.kbq-single-file-upload .kbq-file-upload.kbq-file-drop_dragover{background-color:var(--kbq-file-upload-single-states-on-drag-container-background);border-color:var(--kbq-file-upload-single-states-on-drag-container-border)!important}.kbq-single-file-upload .kbq-file-upload.kbq-error:not(.kbq-disabled):not(.kbq-file-drop_dragover){background-color:var(--kbq-file-upload-single-states-error-container-background);border-color:var(--kbq-file-upload-single-states-error-container-border)!important}.kbq-single-file-upload .kbq-file-upload.kbq-error:not(.kbq-disabled) .kbq-file-upload__dropzone-icon{color:var(--kbq-file-upload-single-states-error-dropzone-icon-color)}.kbq-single-file-upload .kbq-file-upload.kbq-error:not(.kbq-disabled) .kbq-file-item__text-wrapper .kbq-icon.kbq-empty{color:var(--kbq-file-upload-single-states-error-left-icon-color)}.kbq-single-file-upload .kbq-file-upload.kbq-error:not(.kbq-disabled) .kbq-file-item__text,.kbq-single-file-upload .kbq-file-upload.kbq-error:not(.kbq-disabled) .kbq-file-upload__dropzone-caption:not(.kbq-link){color:var(--kbq-file-upload-single-states-error-text-block-color)}.kbq-single-file-upload .kbq-file-upload.kbq-error:not(.kbq-disabled) .kbq-file-item__size{color:var(--kbq-file-upload-single-states-error-file-size-text-color)}.kbq-single-file-upload .kbq-file-upload.kbq-disabled{background-color:var(--kbq-file-upload-single-states-disabled-container-background);border-color:var(--kbq-file-upload-single-states-disabled-container-border)!important}.kbq-single-file-upload .kbq-file-upload.kbq-disabled .kbq-file-upload__dropzone-icon{color:var(--kbq-file-upload-single-states-disabled-dropzone-icon-color)}.kbq-single-file-upload .kbq-file-upload.kbq-disabled .kbq-file-item__text-wrapper .kbq-icon.kbq-empty{color:var(--kbq-file-upload-single-states-disabled-left-icon-color)}.kbq-single-file-upload .kbq-file-upload.kbq-disabled .kbq-file-upload__dropzone-caption,.kbq-single-file-upload .kbq-file-upload.kbq-disabled .kbq-file-item__text{color:var(--kbq-file-upload-single-states-disabled-text-block-color)}.kbq-single-file-upload .kbq-file-upload.kbq-disabled .kbq-file-item__size{color:var(--kbq-file-upload-single-states-disabled-file-size-text-color)}\n"] }]
|
|
1589
|
+
}], ctorParameters: () => [], propDecorators: { progressMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "progressMode", required: false }] }], accept: [{ type: i0.Input, args: [{ isSignal: true, alias: "accept", required: false }] }], inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: false }] }], showFileSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "showFileSize", required: false }] }], allowed: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowed", required: false }] }], fullScreenDropZone: [{ type: i0.Input, args: [{ isSignal: true, alias: "fullScreenDropZone", required: false }] }], fileChange: [{ type: i0.Output, args: ["fileChange"] }], rejected: [{ type: i0.Output, args: ["rejected"] }], fileLoader: [{ type: i0.ViewChild, args: [i0.forwardRef(() => KbqFileLoader), { isSignal: true }] }], hint: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => KbqHint), { isSignal: true }] }], errorStateMatcherInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "errorStateMatcher", required: false }] }], fileInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "file", required: false }] }] } });
|
|
1328
1590
|
|
|
1329
1591
|
class KbqFileUploadModule {
|
|
1330
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1331
|
-
/** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
|
|
1592
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KbqFileUploadModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
1593
|
+
/** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.25", ngImport: i0, type: KbqFileUploadModule, imports: [FormsModule,
|
|
1332
1594
|
ReactiveFormsModule,
|
|
1333
1595
|
KbqToolTipModule,
|
|
1334
1596
|
KbqProgressSpinnerModule,
|
|
@@ -1338,15 +1600,14 @@ class KbqFileUploadModule {
|
|
|
1338
1600
|
KbqFormFieldModule,
|
|
1339
1601
|
KbqEllipsisCenterModule,
|
|
1340
1602
|
KbqDataSizePipe,
|
|
1341
|
-
|
|
1342
|
-
AsyncPipe,
|
|
1603
|
+
KbqLink,
|
|
1343
1604
|
NgTemplateOutlet,
|
|
1344
1605
|
KbqFileDropDirective,
|
|
1345
1606
|
KbqSingleFileUploadComponent,
|
|
1346
1607
|
KbqMultipleFileUploadComponent], exports: [KbqSingleFileUploadComponent,
|
|
1347
1608
|
KbqMultipleFileUploadComponent,
|
|
1348
1609
|
KbqFileDropDirective] }); }
|
|
1349
|
-
/** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
|
|
1610
|
+
/** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KbqFileUploadModule, imports: [FormsModule,
|
|
1350
1611
|
ReactiveFormsModule,
|
|
1351
1612
|
KbqToolTipModule,
|
|
1352
1613
|
KbqProgressSpinnerModule,
|
|
@@ -1355,11 +1616,11 @@ class KbqFileUploadModule {
|
|
|
1355
1616
|
KbqListModule,
|
|
1356
1617
|
KbqFormFieldModule,
|
|
1357
1618
|
KbqEllipsisCenterModule,
|
|
1358
|
-
|
|
1619
|
+
KbqLink,
|
|
1359
1620
|
KbqSingleFileUploadComponent,
|
|
1360
1621
|
KbqMultipleFileUploadComponent] }); }
|
|
1361
1622
|
}
|
|
1362
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1623
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KbqFileUploadModule, decorators: [{
|
|
1363
1624
|
type: NgModule,
|
|
1364
1625
|
args: [{
|
|
1365
1626
|
imports: [
|
|
@@ -1373,8 +1634,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.30", ngImpo
|
|
|
1373
1634
|
KbqFormFieldModule,
|
|
1374
1635
|
KbqEllipsisCenterModule,
|
|
1375
1636
|
KbqDataSizePipe,
|
|
1376
|
-
|
|
1377
|
-
AsyncPipe,
|
|
1637
|
+
KbqLink,
|
|
1378
1638
|
NgTemplateOutlet,
|
|
1379
1639
|
KbqFileDropDirective,
|
|
1380
1640
|
KbqSingleFileUploadComponent,
|
|
@@ -1392,5 +1652,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.30", ngImpo
|
|
|
1392
1652
|
* Generated bundle index. Do not edit.
|
|
1393
1653
|
*/
|
|
1394
1654
|
|
|
1395
|
-
export { KBQ_DROPZONE_DATA,
|
|
1655
|
+
export { KBQ_DROPZONE_DATA, KBQ_FILE_UPLOAD_LOCALE_CONFIGURATION, KBQ_MULTIPLE_FILE_UPLOAD_DEFAULT_CONFIGURATION, KBQ_SINGLE_FILE_UPLOAD_DEFAULT_CONFIGURATION, KbqDrop, KbqDropzoneContent, KbqFileDropDirective, KbqFileList, KbqFileLoader, KbqFileUploadAddStrategy, KbqFileUploadAllowedType, KbqFileUploadBase, KbqFileUploadContext, KbqFileUploadEmptyState, KbqFileUploadModule, KbqFullScreenDropzoneService, KbqLocalDropzone, KbqMultipleFileUploadComponent, KbqSingleFileUploadComponent, isOutsideViewport, kbqFileUploadLocaleConfigurationProvider };
|
|
1396
1656
|
//# sourceMappingURL=koobiq-components-file-upload.mjs.map
|