@koobiq/components 19.8.3 → 20.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/accordion/accordion-trigger.component.scss +0 -18
- package/accordion/accordion.component.scss +9 -2
- package/accordion/index.d.ts +238 -1
- package/actions-panel/index.d.ts +304 -5
- package/alert/_alert-theme.scss +0 -4
- package/alert/alert-tokens.scss +4 -4
- package/alert/index.d.ts +54 -1
- package/app-switcher/app-switcher-dropdown-app.scss +2 -0
- package/app-switcher/index.d.ts +239 -1
- package/autocomplete/index.d.ts +265 -1
- package/badge/index.d.ts +57 -1
- package/breadcrumbs/breadcrumbs.scss +4 -0
- package/breadcrumbs/index.d.ts +244 -1
- package/button/button-group.scss +42 -2
- package/button/index.d.ts +153 -1
- package/button-toggle/button-toggle.scss +23 -0
- package/button-toggle/index.d.ts +157 -1
- package/checkbox/checkbox.scss +5 -4
- package/checkbox/index.d.ts +159 -1
- package/clamped-text/index.d.ts +145 -4
- package/code-block/_code-block-theme.scss +0 -6
- package/code-block/code-block-tokens.scss +0 -2
- package/code-block/index.d.ts +383 -1
- package/content-panel/content-panel.scss +0 -8
- package/content-panel/index.d.ts +158 -2
- package/core/highlight/_highlight-theme.scss +9 -0
- package/core/index.d.ts +4794 -1
- package/core/styles/_koobiq-theme.scss +1 -0
- package/core/styles/common/_animation.scss +4 -0
- package/core/styles/common/_overlay.scss +3 -4
- package/core/styles/theming/_components-theming.scss +1 -63
- package/core/styles/theming/_scrollbar-theme.scss +4 -0
- package/datepicker/_datepicker-theme.scss +1 -1
- package/datepicker/datepicker-toggle.scss +3 -3
- package/datepicker/index.d.ts +699 -1
- package/divider/index.d.ts +20 -1
- package/dl/index.d.ts +38 -1
- package/dropdown/dropdown.scss +2 -2
- package/dropdown/index.d.ts +473 -1
- package/dynamic-translation/index.d.ts +81 -2
- package/ellipsis-center/index.d.ts +38 -1
- package/empty-state/index.d.ts +45 -1
- package/fesm2022/koobiq-components-accordion.mjs +104 -115
- package/fesm2022/koobiq-components-accordion.mjs.map +1 -1
- package/fesm2022/koobiq-components-actions-panel.mjs +16 -16
- package/fesm2022/koobiq-components-actions-panel.mjs.map +1 -1
- package/fesm2022/koobiq-components-alert.mjs +35 -49
- package/fesm2022/koobiq-components-alert.mjs.map +1 -1
- package/fesm2022/koobiq-components-app-switcher.mjs +82 -87
- package/fesm2022/koobiq-components-app-switcher.mjs.map +1 -1
- package/fesm2022/koobiq-components-autocomplete.mjs +294 -304
- package/fesm2022/koobiq-components-autocomplete.mjs.map +1 -1
- package/fesm2022/koobiq-components-badge.mjs +35 -42
- package/fesm2022/koobiq-components-badge.mjs.map +1 -1
- package/fesm2022/koobiq-components-breadcrumbs.mjs +79 -101
- package/fesm2022/koobiq-components-breadcrumbs.mjs.map +1 -1
- package/fesm2022/koobiq-components-button-toggle.mjs +92 -88
- package/fesm2022/koobiq-components-button-toggle.mjs.map +1 -1
- package/fesm2022/koobiq-components-button.mjs +56 -51
- package/fesm2022/koobiq-components-button.mjs.map +1 -1
- package/fesm2022/koobiq-components-checkbox.mjs +50 -52
- package/fesm2022/koobiq-components-checkbox.mjs.map +1 -1
- package/fesm2022/koobiq-components-clamped-text.mjs +46 -49
- package/fesm2022/koobiq-components-clamped-text.mjs.map +1 -1
- package/fesm2022/koobiq-components-code-block.mjs +115 -136
- package/fesm2022/koobiq-components-code-block.mjs.map +1 -1
- package/fesm2022/koobiq-components-content-panel.mjs +90 -107
- package/fesm2022/koobiq-components-content-panel.mjs.map +1 -1
- package/fesm2022/koobiq-components-core.mjs +2048 -703
- package/fesm2022/koobiq-components-core.mjs.map +1 -1
- package/fesm2022/koobiq-components-datepicker.mjs +285 -349
- package/fesm2022/koobiq-components-datepicker.mjs.map +1 -1
- package/fesm2022/koobiq-components-divider.mjs +14 -25
- package/fesm2022/koobiq-components-divider.mjs.map +1 -1
- package/fesm2022/koobiq-components-dl.mjs +30 -31
- package/fesm2022/koobiq-components-dl.mjs.map +1 -1
- package/fesm2022/koobiq-components-dropdown.mjs +159 -160
- package/fesm2022/koobiq-components-dropdown.mjs.map +1 -1
- package/fesm2022/koobiq-components-dynamic-translation.mjs +23 -23
- package/fesm2022/koobiq-components-dynamic-translation.mjs.map +1 -1
- package/fesm2022/koobiq-components-ellipsis-center.mjs +16 -21
- package/fesm2022/koobiq-components-ellipsis-center.mjs.map +1 -1
- package/fesm2022/koobiq-components-empty-state.mjs +35 -39
- package/fesm2022/koobiq-components-empty-state.mjs.map +1 -1
- package/fesm2022/koobiq-components-file-upload.mjs +160 -248
- package/fesm2022/koobiq-components-file-upload.mjs.map +1 -1
- package/fesm2022/koobiq-components-filter-bar.mjs +1160 -1184
- package/fesm2022/koobiq-components-filter-bar.mjs.map +1 -1
- package/fesm2022/koobiq-components-flag.mjs +66 -0
- package/fesm2022/koobiq-components-flag.mjs.map +1 -0
- package/fesm2022/koobiq-components-form-field.mjs +211 -430
- package/fesm2022/koobiq-components-form-field.mjs.map +1 -1
- package/fesm2022/koobiq-components-icon.mjs +42 -43
- package/fesm2022/koobiq-components-icon.mjs.map +1 -1
- package/fesm2022/koobiq-components-inline-edit.mjs +85 -61
- package/fesm2022/koobiq-components-inline-edit.mjs.map +1 -1
- package/fesm2022/koobiq-components-input.mjs +116 -155
- package/fesm2022/koobiq-components-input.mjs.map +1 -1
- package/fesm2022/koobiq-components-link.mjs +38 -53
- package/fesm2022/koobiq-components-link.mjs.map +1 -1
- package/fesm2022/koobiq-components-list.mjs +138 -128
- package/fesm2022/koobiq-components-list.mjs.map +1 -1
- package/fesm2022/koobiq-components-loader-overlay.mjs +38 -45
- package/fesm2022/koobiq-components-loader-overlay.mjs.map +1 -1
- package/fesm2022/koobiq-components-markdown.mjs +31 -35
- package/fesm2022/koobiq-components-markdown.mjs.map +1 -1
- package/fesm2022/koobiq-components-modal.mjs +174 -164
- package/fesm2022/koobiq-components-modal.mjs.map +1 -1
- package/fesm2022/koobiq-components-navbar.mjs +164 -169
- package/fesm2022/koobiq-components-navbar.mjs.map +1 -1
- package/fesm2022/koobiq-components-notification-center.mjs +80 -59
- package/fesm2022/koobiq-components-notification-center.mjs.map +1 -1
- package/fesm2022/koobiq-components-overflow-items.mjs +40 -36
- package/fesm2022/koobiq-components-overflow-items.mjs.map +1 -1
- package/fesm2022/koobiq-components-popover.mjs +94 -85
- package/fesm2022/koobiq-components-popover.mjs.map +1 -1
- package/fesm2022/koobiq-components-progress-bar.mjs +24 -30
- package/fesm2022/koobiq-components-progress-bar.mjs.map +1 -1
- package/fesm2022/koobiq-components-progress-spinner.mjs +25 -32
- package/fesm2022/koobiq-components-progress-spinner.mjs.map +1 -1
- package/fesm2022/koobiq-components-radio.mjs +95 -85
- package/fesm2022/koobiq-components-radio.mjs.map +1 -1
- package/fesm2022/koobiq-components-resizer.mjs +17 -17
- package/fesm2022/koobiq-components-resizer.mjs.map +1 -1
- package/fesm2022/koobiq-components-scrollbar.mjs +69 -60
- package/fesm2022/koobiq-components-scrollbar.mjs.map +1 -1
- package/fesm2022/koobiq-components-search-expandable.mjs +44 -35
- package/fesm2022/koobiq-components-search-expandable.mjs.map +1 -1
- package/fesm2022/koobiq-components-select.mjs +279 -244
- package/fesm2022/koobiq-components-select.mjs.map +1 -1
- package/fesm2022/koobiq-components-sidebar.mjs +63 -55
- package/fesm2022/koobiq-components-sidebar.mjs.map +1 -1
- package/fesm2022/koobiq-components-sidepanel.mjs +88 -128
- package/fesm2022/koobiq-components-sidepanel.mjs.map +1 -1
- package/fesm2022/koobiq-components-skeleton.mjs +13 -13
- package/fesm2022/koobiq-components-skeleton.mjs.map +1 -1
- package/fesm2022/koobiq-components-split-button.mjs +29 -22
- package/fesm2022/koobiq-components-split-button.mjs.map +1 -1
- package/fesm2022/koobiq-components-splitter.mjs +114 -96
- package/fesm2022/koobiq-components-splitter.mjs.map +1 -1
- package/fesm2022/koobiq-components-table.mjs +23 -23
- package/fesm2022/koobiq-components-table.mjs.map +1 -1
- package/fesm2022/koobiq-components-tabs.mjs +260 -275
- package/fesm2022/koobiq-components-tabs.mjs.map +1 -1
- package/fesm2022/koobiq-components-tags.mjs +179 -267
- package/fesm2022/koobiq-components-tags.mjs.map +1 -1
- package/fesm2022/koobiq-components-textarea.mjs +42 -68
- package/fesm2022/koobiq-components-textarea.mjs.map +1 -1
- package/fesm2022/koobiq-components-time-range.mjs +65 -66
- package/fesm2022/koobiq-components-time-range.mjs.map +1 -1
- package/fesm2022/koobiq-components-timepicker.mjs +46 -38
- package/fesm2022/koobiq-components-timepicker.mjs.map +1 -1
- package/fesm2022/koobiq-components-timezone.mjs +58 -58
- package/fesm2022/koobiq-components-timezone.mjs.map +1 -1
- package/fesm2022/koobiq-components-title.mjs +150 -39
- package/fesm2022/koobiq-components-title.mjs.map +1 -1
- package/fesm2022/koobiq-components-toast.mjs +54 -69
- package/fesm2022/koobiq-components-toast.mjs.map +1 -1
- package/fesm2022/koobiq-components-toggle.mjs +51 -63
- package/fesm2022/koobiq-components-toggle.mjs.map +1 -1
- package/fesm2022/koobiq-components-tooltip.mjs +141 -121
- package/fesm2022/koobiq-components-tooltip.mjs.map +1 -1
- package/fesm2022/koobiq-components-top-bar.mjs +22 -25
- package/fesm2022/koobiq-components-top-bar.mjs.map +1 -1
- package/fesm2022/koobiq-components-tree-select.mjs +264 -231
- package/fesm2022/koobiq-components-tree-select.mjs.map +1 -1
- package/fesm2022/koobiq-components-tree.mjs +273 -239
- package/fesm2022/koobiq-components-tree.mjs.map +1 -1
- package/fesm2022/koobiq-components-username.mjs +62 -49
- package/fesm2022/koobiq-components-username.mjs.map +1 -1
- package/file-upload/file-upload-tokens.scss +1 -0
- package/file-upload/index.d.ts +577 -1
- package/filter-bar/_filter-bar-theme.scss +86 -0
- package/filter-bar/filter-bar-tokens.scss +6 -0
- package/filter-bar/filter-bar.scss +10 -4
- package/filter-bar/filter-refresher.scss +1 -1
- package/filter-bar/filters.scss +23 -19
- package/filter-bar/index.d.ts +1165 -1
- package/filter-bar/pipes/base-pipe.scss +14 -35
- package/filter-bar/pipes/pipe-date.scss +20 -14
- package/filter-bar/pipes/pipe-multi-tree-select.scss +5 -3
- package/filter-bar/pipes/pipe-multiselect.scss +5 -3
- package/filter-bar/pipes/pipe-readonly.scss +4 -13
- package/filter-bar/pipes/pipe-select.scss +3 -1
- package/filter-bar/pipes/pipe-tree-select.scss +3 -1
- package/flag/flag.scss +53 -0
- package/flag/index.d.ts +44 -0
- package/form-field/index.d.ts +569 -1
- package/icon/index.d.ts +162 -1
- package/index.d.ts +2 -1
- package/inline-edit/index.d.ts +176 -2
- package/inline-edit/inline-edit.scss +7 -7
- package/input/index.d.ts +339 -1
- package/link/index.d.ts +56 -1
- package/link/link-tokens.scss +2 -2
- package/list/index.d.ts +229 -1
- package/loader-overlay/index.d.ts +57 -1
- package/loader-overlay/loader-overlay-tokens.scss +1 -1
- package/markdown/index.d.ts +68 -1
- package/modal/_modal-animation.scss +6 -6
- package/modal/_modal-theme.scss +3 -6
- package/modal/index.d.ts +313 -1
- package/modal/modal.scss +15 -0
- package/navbar/index.d.ts +305 -1
- package/navbar/navbar.scss +1 -2
- package/notification-center/index.d.ts +322 -1
- package/notification-center/notification-center.scss +14 -9
- package/notification-center/notification-item.scss +2 -1
- package/overflow-items/index.d.ts +162 -2
- package/package.json +13 -17
- package/popover/index.d.ts +182 -1
- package/popover/popover.scss +8 -12
- package/prebuilt-themes/dark-theme.css +1 -1
- package/prebuilt-themes/light-theme.css +1 -1
- package/prebuilt-themes/theme.css +1 -1
- package/progress-bar/index.d.ts +31 -1
- package/progress-bar/progress-bar.scss +4 -0
- package/progress-spinner/index.d.ts +37 -1
- package/progress-spinner/progress-spinner.scss +5 -1
- package/radio/index.d.ts +203 -1
- package/radio/radio.scss +18 -4
- package/resizer/index.d.ts +85 -2
- package/schematics/collection.json +10 -0
- package/schematics/migrations/css-selectors/index.js +1 -1
- package/schematics/migrations/deprecated-icons/index.js +1 -1
- package/schematics/migrations/filter-bar-signals/README.md +66 -0
- package/schematics/migrations/filter-bar-signals/data.js +72 -0
- package/schematics/migrations/filter-bar-signals/index.js +316 -0
- package/schematics/migrations/filter-bar-signals/schema.json +20 -0
- package/schematics/migrations/new-icons-pack/index.js +1 -1
- package/schematics/migrations/v20-upgrade/README.md +72 -0
- package/schematics/migrations/v20-upgrade/data.js +274 -0
- package/schematics/migrations/v20-upgrade/index.js +222 -0
- package/schematics/migrations/v20-upgrade/schema.json +20 -0
- package/schematics/migrations.json +15 -0
- package/schematics/ng-add/index.js +3 -4
- package/scrollbar/index.d.ts +136 -1
- package/search-expandable/index.d.ts +98 -1
- package/select/index.d.ts +701 -1
- package/sidebar/index.d.ts +93 -1
- package/sidepanel/index.d.ts +263 -1
- package/sidepanel/sidepanel.scss +0 -8
- package/skeleton/index.d.ts +26 -2
- package/skeleton/skeleton.scss +4 -0
- package/split-button/_split-button-theme.scss +2 -2
- package/split-button/index.d.ts +46 -1
- package/splitter/_splitter-theme.scss +2 -2
- package/splitter/index.d.ts +142 -1
- package/table/_table-theme.scss +4 -0
- package/table/index.d.ts +24 -1
- package/tabs/index.d.ts +647 -1
- package/tabs/tab-header.scss +1 -0
- package/tabs/tabs-tokens.scss +1 -1
- package/tags/index.d.ts +706 -1
- package/textarea/index.d.ts +133 -1
- package/time-range/index.d.ts +310 -7
- package/time-range/time-range.scss +0 -8
- package/timepicker/index.d.ts +193 -1
- package/timepicker/timepicker.scss +2 -2
- package/timezone/index.d.ts +123 -1
- package/title/index.d.ts +131 -1
- package/toast/index.d.ts +164 -1
- package/toggle/index.d.ts +84 -1
- package/tooltip/index.d.ts +211 -1
- package/top-bar/index.d.ts +33 -1
- package/top-bar/top-bar.scss +1 -2
- package/tree/_tree-theme.scss +2 -7
- package/tree/index.d.ts +733 -1
- package/tree/toggle.scss +5 -0
- package/tree/tree-option.scss +20 -11
- package/tree-select/_tree-select-theme.scss +1 -1
- package/tree-select/index.d.ts +384 -1
- package/username/index.d.ts +194 -5
- package/accordion/accordion-content.d.ts +0 -6
- package/accordion/accordion-content.directive.d.ts +0 -27
- package/accordion/accordion-header.d.ts +0 -6
- package/accordion/accordion-header.directive.d.ts +0 -7
- package/accordion/accordion-item.d.ts +0 -77
- package/accordion/accordion-trigger.component.d.ts +0 -24
- package/accordion/accordion-trigger.directive.d.ts +0 -21
- package/accordion/accordion.component.d.ts +0 -79
- package/accordion/accordion.module.d.ts +0 -12
- package/accordion/public-api.d.ts +0 -9
- package/actions-panel/actions-panel-config.d.ts +0 -82
- package/actions-panel/actions-panel-container.d.ts +0 -90
- package/actions-panel/actions-panel-ref.d.ts +0 -44
- package/actions-panel/actions-panel.d.ts +0 -85
- package/actions-panel/module.d.ts +0 -7
- package/alert/alert.component.d.ts +0 -43
- package/alert/alert.module.d.ts +0 -9
- package/alert/public-api.d.ts +0 -2
- package/app-switcher/app-switcher-animations.d.ts +0 -5
- package/app-switcher/app-switcher-dropdown-app.d.ts +0 -11
- package/app-switcher/app-switcher-dropdown-site.d.ts +0 -9
- package/app-switcher/app-switcher.d.ts +0 -198
- package/app-switcher/app-switcher.module.d.ts +0 -10
- package/app-switcher/kbq-app-switcher-list-item.d.ts +0 -16
- package/app-switcher/public-api.d.ts +0 -6
- package/autocomplete/autocomplete-origin.directive.d.ts +0 -12
- package/autocomplete/autocomplete-trigger.directive.d.ts +0 -169
- package/autocomplete/autocomplete.component.d.ts +0 -88
- package/autocomplete/autocomplete.module.d.ts +0 -12
- package/autocomplete/public-api.d.ts +0 -4
- package/badge/badge.component.d.ts +0 -46
- package/badge/badge.module.d.ts +0 -9
- package/badge/public-api.d.ts +0 -2
- package/breadcrumbs/breadcrumbs.d.ts +0 -121
- package/breadcrumbs/breadcrumbs.module.d.ts +0 -7
- package/breadcrumbs/breadcrumbs.types.d.ts +0 -22
- package/breadcrumbs/public-api.d.ts +0 -5
- package/breadcrumbs/roving-focus-group.directive.d.ts +0 -50
- package/breadcrumbs/roving-focus-item.directive.d.ts +0 -50
- package/breadcrumbs/utils.d.ts +0 -19
- package/button/button-group.d.ts +0 -45
- package/button/button-slots.d.ts +0 -11
- package/button/button.component.d.ts +0 -74
- package/button/button.dropdown-trigger.directive.d.ts +0 -14
- package/button/button.module.d.ts +0 -13
- package/button/public-api.d.ts +0 -5
- package/button-toggle/button-toggle.component.d.ts +0 -146
- package/button-toggle/button-toggle.module.d.ts +0 -9
- package/button-toggle/public-api.d.ts +0 -2
- package/checkbox/checkbox-config.d.ts +0 -13
- package/checkbox/checkbox-module.d.ts +0 -9
- package/checkbox/checkbox-required-validator.d.ts +0 -13
- package/checkbox/checkbox.d.ts +0 -128
- package/checkbox/public-api.d.ts +0 -4
- package/clamped-text/clamped-list.d.ts +0 -41
- package/clamped-text/clamped-text.d.ts +0 -65
- package/clamped-text/constants.d.ts +0 -34
- package/clamped-text/module.d.ts +0 -8
- package/code-block/code-block-highlight.d.ts +0 -98
- package/code-block/code-block.d.ts +0 -259
- package/code-block/code-block.module.d.ts +0 -7
- package/code-block/public-api.d.ts +0 -4
- package/code-block/types.d.ts +0 -36
- package/content-panel/content-panel.d.ts +0 -149
- package/content-panel/module.d.ts +0 -7
- package/core/animation/animation.d.ts +0 -37
- package/core/animation/fade-animations.d.ts +0 -2
- package/core/animation/index.d.ts +0 -3
- package/core/animation/select-animations.d.ts +0 -12
- package/core/common-behaviors/checkbox.d.ts +0 -5
- package/core/common-behaviors/clipboard.d.ts +0 -12
- package/core/common-behaviors/color.d.ts +0 -50
- package/core/common-behaviors/common-module.d.ts +0 -38
- package/core/common-behaviors/constructor.d.ts +0 -9
- package/core/common-behaviors/disabled.d.ts +0 -8
- package/core/common-behaviors/error-state.d.ts +0 -46
- package/core/common-behaviors/flex.d.ts +0 -4
- package/core/common-behaviors/hover.d.ts +0 -15
- package/core/common-behaviors/index.d.ts +0 -14
- package/core/common-behaviors/orientation.d.ts +0 -4
- package/core/common-behaviors/read-state.d.ts +0 -12
- package/core/common-behaviors/size.d.ts +0 -4
- package/core/common-behaviors/tabindex.d.ts +0 -8
- package/core/datetime/date-adapter.d.ts +0 -12
- package/core/datetime/date-formats.d.ts +0 -4
- package/core/datetime/index.d.ts +0 -2
- package/core/error/error-state-matcher.d.ts +0 -39
- package/core/form-field/field-sizing-content.d.ts +0 -21
- package/core/form-field/form-field-ref.d.ts +0 -28
- package/core/form-field/index.d.ts +0 -2
- package/core/formatters/date/formatter.d.ts +0 -11
- package/core/formatters/date/formatter.pipe.d.ts +0 -139
- package/core/formatters/filesize/config.d.ts +0 -66
- package/core/formatters/filesize/formatter.d.ts +0 -17
- package/core/formatters/filesize/index.d.ts +0 -3
- package/core/formatters/filesize/size.d.ts +0 -52
- package/core/formatters/index.d.ts +0 -13
- package/core/formatters/number/formatter.d.ts +0 -101
- package/core/forms/forms-module.d.ts +0 -7
- package/core/forms/forms.directive.d.ts +0 -22
- package/core/forms/index.d.ts +0 -3
- package/core/forms/validators.d.ts +0 -120
- package/core/highlight/highlight.pipe.d.ts +0 -10
- package/core/highlight/index.d.ts +0 -9
- package/core/line/line.d.ts +0 -23
- package/core/locales/en-US.d.ts +0 -176
- package/core/locales/es-LA.d.ts +0 -175
- package/core/locales/formatters.d.ts +0 -190
- package/core/locales/index.d.ts +0 -9
- package/core/locales/locale-service.d.ts +0 -1117
- package/core/locales/locale-service.module.d.ts +0 -6
- package/core/locales/pt-BR.d.ts +0 -175
- package/core/locales/ru-RU.d.ts +0 -176
- package/core/locales/tk-TM.d.ts +0 -176
- package/core/locales/types.d.ts +0 -77
- package/core/navbar/index.d.ts +0 -1
- package/core/navbar/rectangle-item.d.ts +0 -14
- package/core/option/action-container.d.ts +0 -5
- package/core/option/action.d.ts +0 -38
- package/core/option/index.d.ts +0 -5
- package/core/option/optgroup.d.ts +0 -16
- package/core/option/option-module.d.ts +0 -10
- package/core/option/option.d.ts +0 -170
- package/core/overlay/overlay-position-map.d.ts +0 -40
- package/core/pop-up/constants.d.ts +0 -56
- package/core/pop-up/focus-trap-strategy.d.ts +0 -5
- package/core/pop-up/index.d.ts +0 -5
- package/core/pop-up/pop-up-styles.d.ts +0 -2
- package/core/pop-up/pop-up-trigger.d.ts +0 -104
- package/core/pop-up/pop-up.d.ts +0 -57
- package/core/public-api.d.ts +0 -23
- package/core/select/common.d.ts +0 -59
- package/core/select/constants.d.ts +0 -22
- package/core/select/errors.d.ts +0 -19
- package/core/select/events.d.ts +0 -1
- package/core/select/index.d.ts +0 -4
- package/core/selection/constants.d.ts +0 -4
- package/core/selection/index.d.ts +0 -3
- package/core/selection/pseudo-checkbox/pseudo-checkbox.d.ts +0 -23
- package/core/selection/pseudo-checkbox/pseudo-checkbox.module.d.ts +0 -8
- package/core/services/measure-scrollbar.service.d.ts +0 -11
- package/core/services/theme.service.d.ts +0 -41
- package/core/title/index.d.ts +0 -1
- package/core/title/title-text-ref.d.ts +0 -6
- package/core/tokens/index.d.ts +0 -1
- package/core/tokens/window.d.ts +0 -5
- package/core/utils/dom.d.ts +0 -4
- package/core/utils/index.d.ts +0 -2
- package/core/utils/public-api.d.ts +0 -1
- package/core/utils/utils.d.ts +0 -25
- package/core/validation/index.d.ts +0 -1
- package/core/validation/validation.d.ts +0 -29
- package/core/version.d.ts +0 -2
- package/datepicker/calendar-body.component.d.ts +0 -55
- package/datepicker/calendar-header.component.d.ts +0 -51
- package/datepicker/calendar.component.d.ts +0 -89
- package/datepicker/datepicker-animations.d.ts +0 -9
- package/datepicker/datepicker-errors.d.ts +0 -2
- package/datepicker/datepicker-input.directive.d.ts +0 -221
- package/datepicker/datepicker-intl.d.ts +0 -32
- package/datepicker/datepicker-module.d.ts +0 -21
- package/datepicker/datepicker-toggle.component.d.ts +0 -57
- package/datepicker/datepicker.component.d.ts +0 -148
- package/datepicker/month-view.component.d.ts +0 -73
- package/datepicker/public-api.d.ts +0 -10
- package/divider/divider.component.d.ts +0 -18
- package/divider/divider.module.d.ts +0 -8
- package/divider/public-api.d.ts +0 -2
- package/dl/dl.component.d.ts +0 -26
- package/dl/dl.module.d.ts +0 -9
- package/dl/public-api.d.ts +0 -2
- package/dropdown/dropdown-animations.d.ts +0 -11
- package/dropdown/dropdown-content.directive.d.ts +0 -32
- package/dropdown/dropdown-errors.d.ts +0 -17
- package/dropdown/dropdown-item.component.d.ts +0 -52
- package/dropdown/dropdown-trigger.directive.d.ts +0 -167
- package/dropdown/dropdown.component.d.ts +0 -134
- package/dropdown/dropdown.module.d.ts +0 -13
- package/dropdown/dropdown.types.d.ts +0 -67
- package/dropdown/public-api.d.ts +0 -8
- package/dynamic-translation/dynamic-translation.d.ts +0 -72
- package/dynamic-translation/module.d.ts +0 -7
- package/ellipsis-center/ellipsis-center.directive.d.ts +0 -36
- package/ellipsis-center/public-api.d.ts +0 -1
- package/empty-state/empty-state.component.d.ts +0 -36
- package/empty-state/empty-state.module.d.ts +0 -9
- package/empty-state/public-api.d.ts +0 -2
- package/fesm2022/koobiq-components-navbar-ic.mjs +0 -863
- package/fesm2022/koobiq-components-navbar-ic.mjs.map +0 -1
- package/fesm2022/koobiq-components-risk-level.mjs +0 -75
- package/fesm2022/koobiq-components-risk-level.mjs.map +0 -1
- package/file-upload/dropzone.d.ts +0 -147
- package/file-upload/file-upload.d.ts +0 -102
- package/file-upload/file-upload.module.d.ts +0 -20
- package/file-upload/multiple-file-upload.component.d.ts +0 -138
- package/file-upload/primitives/file-drop.d.ts +0 -35
- package/file-upload/primitives/file-picker.d.ts +0 -82
- package/file-upload/primitives/index.d.ts +0 -2
- package/file-upload/public-api.d.ts +0 -7
- package/file-upload/single-file-upload.component.d.ts +0 -118
- package/filter-bar/filter-bar-button.d.ts +0 -14
- package/filter-bar/filter-bar.d.ts +0 -81
- package/filter-bar/filter-bar.module.d.ts +0 -17
- package/filter-bar/filter-bar.types.d.ts +0 -143
- package/filter-bar/filter-refresher.d.ts +0 -5
- package/filter-bar/filter-reset.d.ts +0 -15
- package/filter-bar/filter-search.d.ts +0 -54
- package/filter-bar/filter-search.scss +0 -12
- package/filter-bar/filters.d.ts +0 -122
- package/filter-bar/pipe-add.d.ts +0 -28
- package/filter-bar/pipe.directive.d.ts +0 -13
- package/filter-bar/pipes/base-pipe.d.ts +0 -74
- package/filter-bar/pipes/pipe-button.d.ts +0 -21
- package/filter-bar/pipes/pipe-date.d.ts +0 -65
- package/filter-bar/pipes/pipe-datetime.d.ts +0 -66
- package/filter-bar/pipes/pipe-multi-select.d.ts +0 -56
- package/filter-bar/pipes/pipe-multi-tree-select.d.ts +0 -67
- package/filter-bar/pipes/pipe-readonly.d.ts +0 -7
- package/filter-bar/pipes/pipe-select.d.ts +0 -30
- package/filter-bar/pipes/pipe-state.d.ts +0 -21
- package/filter-bar/pipes/pipe-text.d.ts +0 -26
- package/filter-bar/pipes/pipe-title.d.ts +0 -27
- package/filter-bar/pipes/pipe-tree-select.d.ts +0 -42
- package/filter-bar/public-api.d.ts +0 -21
- package/form-field/cleaner.d.ts +0 -11
- package/form-field/error.d.ts +0 -8
- package/form-field/fieldset.d.ts +0 -27
- package/form-field/form-field-control.d.ts +0 -40
- package/form-field/form-field.d.ts +0 -298
- package/form-field/form-field.module.d.ts +0 -19
- package/form-field/hint.d.ts +0 -15
- package/form-field/label.d.ts +0 -6
- package/form-field/password-hint.d.ts +0 -53
- package/form-field/password-toggle.d.ts +0 -56
- package/form-field/prefix.d.ts +0 -6
- package/form-field/public-api.d.ts +0 -15
- package/form-field/reactive-password-hint.d.ts +0 -20
- package/form-field/stepper.d.ts +0 -59
- package/form-field/suffix.d.ts +0 -6
- package/form-field/validate.directive.d.ts +0 -53
- package/icon/icon-button.component.d.ts +0 -28
- package/icon/icon-item.component.d.ts +0 -11
- package/icon/icon-registry-providers.d.ts +0 -34
- package/icon/icon-registry.d.ts +0 -50
- package/icon/icon.component.d.ts +0 -33
- package/icon/icon.module.d.ts +0 -9
- package/icon/public-api.d.ts +0 -6
- package/inline-edit/inline-edit.d.ts +0 -161
- package/inline-edit/module.d.ts +0 -7
- package/input/input-errors.d.ts +0 -1
- package/input/input-number-validators.d.ts +0 -35
- package/input/input-number.d.ts +0 -96
- package/input/input-password.d.ts +0 -99
- package/input/input-value-accessor.d.ts +0 -4
- package/input/input.d.ts +0 -109
- package/input/input.module.d.ts +0 -14
- package/input/public-api.d.ts +0 -6
- package/link/link.component.d.ts +0 -53
- package/link/link.module.d.ts +0 -8
- package/link/public-api.d.ts +0 -2
- package/list/list-selection.component.d.ts +0 -196
- package/list/list.component.d.ts +0 -18
- package/list/list.module.d.ts +0 -11
- package/list/public-api.d.ts +0 -3
- package/loader-overlay/loader-overlay.component.d.ts +0 -47
- package/loader-overlay/loader-overlay.module.d.ts +0 -10
- package/loader-overlay/public-api.d.ts +0 -2
- package/markdown/markdown.component.d.ts +0 -31
- package/markdown/markdown.module.d.ts +0 -7
- package/markdown/markdown.service.d.ts +0 -19
- package/markdown/markdown.values.d.ts +0 -10
- package/markdown/public-api.d.ts +0 -4
- package/modal/css-unit.pipe.d.ts +0 -7
- package/modal/modal-control.service.d.ts +0 -20
- package/modal/modal-ref.class.d.ts +0 -37
- package/modal/modal-util.d.ts +0 -15
- package/modal/modal.component.d.ts +0 -141
- package/modal/modal.directive.d.ts +0 -20
- package/modal/modal.module.d.ts +0 -15
- package/modal/modal.service.d.ts +0 -42
- package/modal/modal.type.d.ts +0 -72
- package/modal/public-api.d.ts +0 -6
- package/navbar/navbar-brand.component.d.ts +0 -41
- package/navbar/navbar-item.component.d.ts +0 -131
- package/navbar/navbar-toggle.component.d.ts +0 -23
- package/navbar/navbar.component.d.ts +0 -68
- package/navbar/navbar.module.d.ts +0 -15
- package/navbar/public-api.d.ts +0 -6
- package/navbar/vertical-navbar.component.d.ts +0 -47
- package/navbar-ic/_navbar-ic-theme.scss +0 -81
- package/navbar-ic/index.d.ts +0 -1
- package/navbar-ic/navbar-ic-divider.scss +0 -7
- package/navbar-ic/navbar-ic-header.d.ts +0 -22
- package/navbar-ic/navbar-ic-header.scss +0 -49
- package/navbar-ic/navbar-ic-item.d.ts +0 -144
- package/navbar-ic/navbar-ic-item.scss +0 -92
- package/navbar-ic/navbar-ic-tokens.scss +0 -22
- package/navbar-ic/navbar-ic.animation.d.ts +0 -3
- package/navbar-ic/navbar-ic.d.ts +0 -118
- package/navbar-ic/navbar-ic.module.d.ts +0 -14
- package/navbar-ic/navbar-ic.scss +0 -32
- package/navbar-ic/public-api.d.ts +0 -4
- package/notification-center/notification-center-animations.d.ts +0 -5
- package/notification-center/notification-center.d.ts +0 -184
- package/notification-center/notification-center.module.d.ts +0 -7
- package/notification-center/notification-center.service.d.ts +0 -115
- package/notification-center/notification-item.d.ts +0 -27
- package/notification-center/public-api.d.ts +0 -4
- package/overflow-items/module.d.ts +0 -7
- package/overflow-items/overflow-items.d.ts +0 -152
- package/popover/popover-animations.d.ts +0 -4
- package/popover/popover-confirm.component.d.ts +0 -28
- package/popover/popover.component.d.ts +0 -139
- package/popover/popover.module.d.ts +0 -14
- package/popover/public-api.d.ts +0 -4
- package/progress-bar/progress-bar.component.d.ts +0 -20
- package/progress-bar/progress-bar.module.d.ts +0 -8
- package/progress-bar/public-api.d.ts +0 -2
- package/progress-spinner/progress-spinner.component.d.ts +0 -26
- package/progress-spinner/progress-spinner.module.d.ts +0 -9
- package/progress-spinner/public-api.d.ts +0 -2
- package/public-api.d.ts +0 -1
- package/radio/public-api.d.ts +0 -2
- package/radio/radio.component.d.ts +0 -200
- package/radio/radio.module.d.ts +0 -8
- package/resizer/module.d.ts +0 -7
- package/resizer/resizer.d.ts +0 -75
- package/risk-level/_risk-level-theme.scss +0 -74
- package/risk-level/index.d.ts +0 -1
- package/risk-level/public-api.d.ts +0 -2
- package/risk-level/risk-level-tokens.scss +0 -33
- package/risk-level/risk-level.component.d.ts +0 -21
- package/risk-level/risk-level.component.scss +0 -22
- package/risk-level/risk-level.module.d.ts +0 -12
- package/scrollbar/public-api.d.ts +0 -4
- package/scrollbar/scrollbar.component.d.ts +0 -37
- package/scrollbar/scrollbar.directive.d.ts +0 -29
- package/scrollbar/scrollbar.module.d.ts +0 -8
- package/scrollbar/scrollbar.types.d.ts +0 -33
- package/search-expandable/public-api.d.ts +0 -2
- package/search-expandable/search-expandable.d.ts +0 -89
- package/search-expandable/search-expandable.module.d.ts +0 -7
- package/select/public-api.d.ts +0 -4
- package/select/select-common.d.ts +0 -30
- package/select/select-option.directive.d.ts +0 -21
- package/select/select.component.d.ts +0 -627
- package/select/select.module.d.ts +0 -17
- package/sidebar/public-api.d.ts +0 -2
- package/sidebar/sidebar-animations.d.ts +0 -8
- package/sidebar/sidebar.component.d.ts +0 -80
- package/sidebar/sidebar.module.d.ts +0 -8
- package/sidepanel/public-api.d.ts +0 -6
- package/sidepanel/sidepanel-animations.d.ts +0 -20
- package/sidepanel/sidepanel-config.d.ts +0 -43
- package/sidepanel/sidepanel-container.component.d.ts +0 -67
- package/sidepanel/sidepanel-directives.d.ts +0 -61
- package/sidepanel/sidepanel-ref.d.ts +0 -36
- package/sidepanel/sidepanel.module.d.ts +0 -14
- package/sidepanel/sidepanel.service.d.ts +0 -58
- package/skeleton/module.d.ts +0 -7
- package/skeleton/skeleton.d.ts +0 -17
- package/split-button/public-api.d.ts +0 -2
- package/split-button/split-button.d.ts +0 -37
- package/split-button/split-button.module.d.ts +0 -7
- package/splitter/public-api.d.ts +0 -2
- package/splitter/splitter.component.d.ts +0 -136
- package/splitter/splitter.module.d.ts +0 -8
- package/table/public-api.d.ts +0 -2
- package/table/table.component.d.ts +0 -12
- package/table/table.module.d.ts +0 -9
- package/tabs/paginated-tab-header.d.ts +0 -182
- package/tabs/public-api.d.ts +0 -10
- package/tabs/tab-body.component.d.ts +0 -95
- package/tabs/tab-content.directive.d.ts +0 -9
- package/tabs/tab-group.component.d.ts +0 -137
- package/tabs/tab-header.component.d.ts +0 -34
- package/tabs/tab-label-wrapper.directive.d.ts +0 -29
- package/tabs/tab-label.directive.d.ts +0 -11
- package/tabs/tab-nav-bar.d.ts +0 -91
- package/tabs/tab.component.d.ts +0 -70
- package/tabs/tabs-animations.d.ts +0 -4
- package/tabs/tabs.module.d.ts +0 -20
- package/tags/public-api.d.ts +0 -5
- package/tags/tag-default-options.d.ts +0 -13
- package/tags/tag-input.d.ts +0 -110
- package/tags/tag-list.component.d.ts +0 -373
- package/tags/tag-text-control.d.ts +0 -10
- package/tags/tag.component.d.ts +0 -272
- package/tags/tag.module.d.ts +0 -10
- package/textarea/public-api.d.ts +0 -2
- package/textarea/textarea.component.d.ts +0 -123
- package/textarea/textarea.module.d.ts +0 -10
- package/time-range/constants.d.ts +0 -19
- package/time-range/module.d.ts +0 -10
- package/time-range/time-range-editor.d.ts +0 -65
- package/time-range/time-range-title-as-form-field.d.ts +0 -41
- package/time-range/time-range-title.d.ts +0 -18
- package/time-range/time-range.d.ts +0 -78
- package/time-range/time-range.service.d.ts +0 -25
- package/time-range/types.d.ts +0 -69
- package/timepicker/public-api.d.ts +0 -3
- package/timepicker/timepicker.constants.d.ts +0 -22
- package/timepicker/timepicker.directive.d.ts +0 -159
- package/timepicker/timepicker.module.d.ts +0 -11
- package/timezone/cities-by-filter.pipe.d.ts +0 -7
- package/timezone/public-api.d.ts +0 -6
- package/timezone/timezone-option.component.d.ts +0 -15
- package/timezone/timezone-option.directive.d.ts +0 -22
- package/timezone/timezone-select.component.d.ts +0 -16
- package/timezone/timezone.models.d.ts +0 -16
- package/timezone/timezone.module.d.ts +0 -20
- package/timezone/timezone.utils.d.ts +0 -22
- package/timezone/utc-offset.pipe.d.ts +0 -9
- package/title/public-api.d.ts +0 -2
- package/title/title.directive.d.ts +0 -33
- package/title/title.module.d.ts +0 -8
- package/toast/public-api.d.ts +0 -5
- package/toast/toast-animations.d.ts +0 -5
- package/toast/toast-container.component.d.ts +0 -19
- package/toast/toast.component.d.ts +0 -41
- package/toast/toast.module.d.ts +0 -8
- package/toast/toast.service.d.ts +0 -61
- package/toast/toast.type.d.ts +0 -44
- package/toggle/public-api.d.ts +0 -2
- package/toggle/toggle.component.d.ts +0 -77
- package/toggle/toggle.module.d.ts +0 -8
- package/tooltip/public-api.d.ts +0 -2
- package/tooltip/tooltip.animations.d.ts +0 -8
- package/tooltip/tooltip.component.d.ts +0 -156
- package/tooltip/tooltip.module.d.ts +0 -7
- package/top-bar/module.d.ts +0 -7
- package/top-bar/public-api.d.ts +0 -2
- package/top-bar/top-bar.d.ts +0 -25
- package/tree/control/base-tree-control.d.ts +0 -40
- package/tree/control/flat-tree-control.d.ts +0 -55
- package/tree/control/flat-tree-control.filters.d.ts +0 -27
- package/tree/control/nested-tree-control.d.ts +0 -19
- package/tree/control/tree-control.d.ts +0 -44
- package/tree/data-source/flat-data-source.d.ts +0 -80
- package/tree/data-source/nested-data-source.d.ts +0 -15
- package/tree/node.d.ts +0 -34
- package/tree/outlet.d.ts +0 -9
- package/tree/padding.directive.d.ts +0 -45
- package/tree/public-api.d.ts +0 -16
- package/tree/toggle.d.ts +0 -28
- package/tree/tree-base.d.ts +0 -96
- package/tree/tree-errors.d.ts +0 -25
- package/tree/tree-option.component.d.ts +0 -89
- package/tree/tree-selection.component.d.ts +0 -156
- package/tree/tree.d.ts +0 -6
- package/tree/tree.module.d.ts +0 -16
- package/tree-select/public-api.d.ts +0 -2
- package/tree-select/tree-select.component.d.ts +0 -360
- package/tree-select/tree-select.module.d.ts +0 -15
- package/username/constants.d.ts +0 -15
- package/username/module.d.ts +0 -8
- package/username/types.d.ts +0 -62
- package/username/username.d.ts +0 -68
- package/username/username.pipe.d.ts +0 -23
|
@@ -1,22 +1,19 @@
|
|
|
1
1
|
import { SelectionModel, DataSource } from '@angular/cdk/collections';
|
|
2
2
|
import { BehaviorSubject, merge, Observable, of, Subject, asyncScheduler } from 'rxjs';
|
|
3
|
-
import
|
|
4
|
-
import { escapeRegExp, KbqPseudoCheckbox, KbqActionContainer, KbqOptionActionComponent, KBQ_TITLE_TEXT_REF, KBQ_OPTION_ACTION_PARENT, MultipleMode, KBQ_FORM_FIELD_REF, getKbqSelectNonArrayValueError, KbqPseudoCheckboxModule } from '@koobiq/components/core';
|
|
3
|
+
import { escapeRegExp, KbqPseudoCheckbox, KbqOptionActionComponent, TAB, hasModifierKey, KbqActionContainer, KBQ_TITLE_TEXT_REF, KBQ_OPTION_ACTION_PARENT, MultipleMode, KBQ_FORM_FIELD_REF, FocusKeyManager, SPACE, LEFT_ARROW, RIGHT_ARROW, isVerticalMovement, isSelectAll, isCopy, DOWN_ARROW, UP_ARROW, ENTER, HOME, END, PAGE_UP, PAGE_DOWN, toggleSelectAll, getKbqSelectNonArrayValueError, KbqPseudoCheckboxModule } from '@koobiq/components/core';
|
|
5
4
|
import { take, map, delay } from 'rxjs/operators';
|
|
6
5
|
import * as i0 from '@angular/core';
|
|
7
|
-
import {
|
|
8
|
-
import
|
|
6
|
+
import { inject, TemplateRef, input, Directive, ViewContainerRef, ChangeDetectorRef, IterableDiffers, DestroyRef, Input, ContentChildren, ViewChild, ElementRef, booleanAttribute, ViewEncapsulation, ChangeDetectionStrategy, Component, InjectionToken, NgZone, contentChild, output, EventEmitter, ContentChild, Renderer2, forwardRef, HostAttributeToken, QueryList, Output, NgModule } from '@angular/core';
|
|
7
|
+
import { Directionality } from '@angular/cdk/bidi';
|
|
9
8
|
import { coerceBooleanProperty, coerceNumberProperty } from '@angular/cdk/coercion';
|
|
10
9
|
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
|
|
11
|
-
import { TAB, hasModifierKey, SPACE, LEFT_ARROW, RIGHT_ARROW, isVerticalMovement, isSelectAll, isCopy, DOWN_ARROW, UP_ARROW, ENTER, HOME, END, PAGE_UP, PAGE_DOWN } from '@koobiq/cdk/keycodes';
|
|
12
10
|
import { KbqDropdownTrigger } from '@koobiq/components/dropdown';
|
|
13
11
|
import { KbqTooltipTrigger } from '@koobiq/components/tooltip';
|
|
14
12
|
import { KbqIcon, KbqIconModule } from '@koobiq/components/icon';
|
|
15
13
|
import { FocusMonitor } from '@angular/cdk/a11y';
|
|
16
|
-
import
|
|
14
|
+
import { Clipboard } from '@angular/cdk/clipboard';
|
|
15
|
+
import { Platform } from '@angular/cdk/platform';
|
|
17
16
|
import { NG_VALUE_ACCESSOR } from '@angular/forms';
|
|
18
|
-
import { FocusKeyManager } from '@koobiq/cdk/a11y';
|
|
19
|
-
import * as i1 from 'rxjs/internal/scheduler/AsyncScheduler';
|
|
20
17
|
import { AsyncScheduler } from 'rxjs/internal/scheduler/AsyncScheduler';
|
|
21
18
|
|
|
22
19
|
/** Base tree control. It has basic toggle/expand/collapse operations on a single data node. */
|
|
@@ -54,9 +51,12 @@ class BaseTreeControl {
|
|
|
54
51
|
}
|
|
55
52
|
/** Toggles a subtree rooted at `node` recursively. */
|
|
56
53
|
toggleDescendants(dataNode) {
|
|
57
|
-
this.expansionModel.isSelected(dataNode)
|
|
58
|
-
|
|
59
|
-
|
|
54
|
+
if (this.expansionModel.isSelected(dataNode)) {
|
|
55
|
+
this.collapseDescendants(dataNode);
|
|
56
|
+
}
|
|
57
|
+
else {
|
|
58
|
+
this.expandDescendants(dataNode);
|
|
59
|
+
}
|
|
60
60
|
}
|
|
61
61
|
/** Collapse all dataNodes in the tree. */
|
|
62
62
|
collapseAll() {
|
|
@@ -203,7 +203,7 @@ class FlatTreeControl extends BaseTreeControl {
|
|
|
203
203
|
}
|
|
204
204
|
}
|
|
205
205
|
hasValue(value) {
|
|
206
|
-
return this.dataNodes
|
|
206
|
+
return this.dataNodes?.find((node) => this.compareValues(this.getValue(node), value));
|
|
207
207
|
}
|
|
208
208
|
filterNodes(value = null) {
|
|
209
209
|
this.saveExpansionState();
|
|
@@ -462,38 +462,35 @@ class KbqTreeNodeOutletContext {
|
|
|
462
462
|
* Captures the node's template and a when predicate that describes when this node should be used.
|
|
463
463
|
*/
|
|
464
464
|
class KbqTreeNodeDef {
|
|
465
|
-
|
|
466
|
-
|
|
467
|
-
this.
|
|
465
|
+
constructor() {
|
|
466
|
+
this.template = inject(TemplateRef);
|
|
467
|
+
this.data = input(undefined, ...(ngDevMode ? [{ debugName: "data", alias: 'kbqTreeNode' }] : [{ alias: 'kbqTreeNode' }]));
|
|
468
468
|
}
|
|
469
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
470
|
-
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "
|
|
469
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: KbqTreeNodeDef, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
470
|
+
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.25", type: KbqTreeNodeDef, isStandalone: true, selector: "[kbqTreeNodeDef]", inputs: { when: { classPropertyName: "when", publicName: "kbqTreeNodeDefWhen", isSignal: false, isRequired: false, transformFunction: null }, data: { classPropertyName: "data", publicName: "kbqTreeNode", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 }); }
|
|
471
471
|
}
|
|
472
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
472
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: KbqTreeNodeDef, decorators: [{
|
|
473
473
|
type: Directive,
|
|
474
474
|
args: [{
|
|
475
475
|
selector: '[kbqTreeNodeDef]',
|
|
476
476
|
inputs: ['when: kbqTreeNodeDefWhen']
|
|
477
477
|
}]
|
|
478
|
-
}],
|
|
479
|
-
type: Input,
|
|
480
|
-
args: ['kbqTreeNode']
|
|
481
|
-
}] } });
|
|
478
|
+
}], propDecorators: { data: [{ type: i0.Input, args: [{ isSignal: true, alias: "kbqTreeNode", required: false }] }] } });
|
|
482
479
|
|
|
483
480
|
class KbqTreeNodeOutlet {
|
|
484
|
-
constructor(
|
|
485
|
-
this.viewContainer =
|
|
486
|
-
this.changeDetectorRef =
|
|
481
|
+
constructor() {
|
|
482
|
+
this.viewContainer = inject(ViewContainerRef);
|
|
483
|
+
this.changeDetectorRef = inject(ChangeDetectorRef);
|
|
487
484
|
}
|
|
488
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
489
|
-
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
485
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: KbqTreeNodeOutlet, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
486
|
+
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.25", type: KbqTreeNodeOutlet, isStandalone: true, selector: "[kbqTreeNodeOutlet]", ngImport: i0 }); }
|
|
490
487
|
}
|
|
491
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
488
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: KbqTreeNodeOutlet, decorators: [{
|
|
492
489
|
type: Directive,
|
|
493
490
|
args: [{
|
|
494
491
|
selector: '[kbqTreeNodeOutlet]'
|
|
495
492
|
}]
|
|
496
|
-
}]
|
|
493
|
+
}] });
|
|
497
494
|
|
|
498
495
|
/**
|
|
499
496
|
* Returns an error to be thrown when there is no usable data.
|
|
@@ -532,11 +529,34 @@ function getTreeControlFunctionsMissingError() {
|
|
|
532
529
|
}
|
|
533
530
|
|
|
534
531
|
class KbqTreeBase {
|
|
532
|
+
constructor() {
|
|
533
|
+
this.differs = inject(IterableDiffers);
|
|
534
|
+
this.changeDetectorRef = inject(ChangeDetectorRef);
|
|
535
|
+
/**
|
|
536
|
+
* Tracking function that will be used to check the differences in data changes. Used similarly
|
|
537
|
+
* to `ngFor` `trackBy` function. Optimize node operations by identifying a node based on its data
|
|
538
|
+
* relative to the function to know if a node should be added/removed/moved.
|
|
539
|
+
* Accepts a function that takes two parameters, `index` and `item`.
|
|
540
|
+
*/
|
|
541
|
+
this.trackBy = input(undefined, ...(ngDevMode ? [{ debugName: "trackBy" }] : []));
|
|
542
|
+
// TODO(tinayuangao): Setup a listener for scrolling, emit the calculated view to viewChange.
|
|
543
|
+
// Remove the MAX_VALUE in viewChange
|
|
544
|
+
/**
|
|
545
|
+
* Stream containing the latest information on what rows are being displayed on screen.
|
|
546
|
+
* Can be used by the data source to as a heuristic of what data should be provided.
|
|
547
|
+
*/
|
|
548
|
+
this.viewChange = new BehaviorSubject({ start: 0, end: Number.MAX_VALUE });
|
|
549
|
+
/** Level of nodes */
|
|
550
|
+
this.levels = new Map();
|
|
551
|
+
this.destroyRef = inject(DestroyRef);
|
|
552
|
+
}
|
|
535
553
|
/**
|
|
536
554
|
* Provides a stream containing the latest data array to render. Influenced by the tree's
|
|
537
555
|
* stream of view window (what dataNodes are currently on screen).
|
|
538
556
|
* Data source can be an observable of data array, or a data array to render.
|
|
539
557
|
*/
|
|
558
|
+
// TODO: Skipped for migration because:
|
|
559
|
+
// Accessor inputs cannot be migrated as they are too complex.
|
|
540
560
|
get dataSource() {
|
|
541
561
|
return this._dataSource;
|
|
542
562
|
}
|
|
@@ -545,22 +565,8 @@ class KbqTreeBase {
|
|
|
545
565
|
this.switchDataSource(dataSource);
|
|
546
566
|
}
|
|
547
567
|
}
|
|
548
|
-
constructor(differs, changeDetectorRef) {
|
|
549
|
-
this.differs = differs;
|
|
550
|
-
this.changeDetectorRef = changeDetectorRef;
|
|
551
|
-
// TODO(tinayuangao): Setup a listener for scrolling, emit the calculated view to viewChange.
|
|
552
|
-
// Remove the MAX_VALUE in viewChange
|
|
553
|
-
/**
|
|
554
|
-
* Stream containing the latest information on what rows are being displayed on screen.
|
|
555
|
-
* Can be used by the data source to as a heuristic of what data should be provided.
|
|
556
|
-
*/
|
|
557
|
-
this.viewChange = new BehaviorSubject({ start: 0, end: Number.MAX_VALUE });
|
|
558
|
-
/** Level of nodes */
|
|
559
|
-
this.levels = new Map();
|
|
560
|
-
this.destroyRef = inject(DestroyRef);
|
|
561
|
-
}
|
|
562
568
|
ngOnInit() {
|
|
563
|
-
this.dataDiffer = this.differs.find([]).create(this.trackBy);
|
|
569
|
+
this.dataDiffer = this.differs.find([]).create(this.trackBy());
|
|
564
570
|
if (!this.treeControl) {
|
|
565
571
|
throw getTreeControlMissingError();
|
|
566
572
|
}
|
|
@@ -632,8 +638,9 @@ class KbqTreeBase {
|
|
|
632
638
|
const context = new KbqTreeNodeOutletContext(nodeData);
|
|
633
639
|
// If the tree is flat tree, then use the `getLevel` function in flat tree control
|
|
634
640
|
// Otherwise, use the level of parent node.
|
|
635
|
-
|
|
636
|
-
|
|
641
|
+
const treeControl = this.treeControl;
|
|
642
|
+
if (treeControl.getLevel) {
|
|
643
|
+
context.level = treeControl.getLevel(nodeData);
|
|
637
644
|
}
|
|
638
645
|
else if (typeof parentData !== 'undefined' && this.levels.has(parentData)) {
|
|
639
646
|
context.level = this.levels.get(parentData) + 1;
|
|
@@ -697,16 +704,14 @@ class KbqTreeBase {
|
|
|
697
704
|
this.observeRenderChanges();
|
|
698
705
|
}
|
|
699
706
|
}
|
|
700
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
701
|
-
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "
|
|
707
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: KbqTreeBase, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
708
|
+
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.25", type: KbqTreeBase, isStandalone: true, inputs: { treeControl: { classPropertyName: "treeControl", publicName: "treeControl", isSignal: false, isRequired: false, transformFunction: null }, trackBy: { classPropertyName: "trackBy", publicName: "trackBy", isSignal: true, isRequired: false, transformFunction: null }, dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: false, isRequired: false, transformFunction: null } }, queries: [{ propertyName: "nodeDefs", predicate: KbqTreeNodeDef }], viewQueries: [{ propertyName: "nodeOutlet", first: true, predicate: KbqTreeNodeOutlet, descendants: true, static: true }], ngImport: i0 }); }
|
|
702
709
|
}
|
|
703
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
710
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: KbqTreeBase, decorators: [{
|
|
704
711
|
type: Directive
|
|
705
|
-
}],
|
|
706
|
-
type: Input
|
|
707
|
-
}], trackBy: [{
|
|
712
|
+
}], propDecorators: { treeControl: [{
|
|
708
713
|
type: Input
|
|
709
|
-
}], nodeOutlet: [{
|
|
714
|
+
}], trackBy: [{ type: i0.Input, args: [{ isSignal: true, alias: "trackBy", required: false }] }], nodeOutlet: [{
|
|
710
715
|
type: ViewChild,
|
|
711
716
|
args: [KbqTreeNodeOutlet, { static: true }]
|
|
712
717
|
}], nodeDefs: [{
|
|
@@ -731,11 +736,12 @@ class KbqTreeNode {
|
|
|
731
736
|
return this.tree.treeControl.isExpanded(this.data);
|
|
732
737
|
}
|
|
733
738
|
get level() {
|
|
734
|
-
|
|
739
|
+
const treeControl = this.tree.treeControl;
|
|
740
|
+
return treeControl.getLevel ? treeControl.getLevel(this._data) : 0;
|
|
735
741
|
}
|
|
736
|
-
constructor(
|
|
737
|
-
this.elementRef =
|
|
738
|
-
this.tree =
|
|
742
|
+
constructor() {
|
|
743
|
+
this.elementRef = inject(ElementRef);
|
|
744
|
+
this.tree = inject(KbqTreeBase);
|
|
739
745
|
this.destroyed = new Subject();
|
|
740
746
|
KbqTreeNode.mostRecentTreeNode = this;
|
|
741
747
|
}
|
|
@@ -746,28 +752,29 @@ class KbqTreeNode {
|
|
|
746
752
|
focus() {
|
|
747
753
|
this.elementRef.nativeElement.focus();
|
|
748
754
|
}
|
|
749
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
750
|
-
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
755
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: KbqTreeNode, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
756
|
+
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.25", type: KbqTreeNode, isStandalone: true, selector: "kbq-tree-node", exportAs: ["kbqTreeNode"], ngImport: i0 }); }
|
|
751
757
|
}
|
|
752
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
758
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: KbqTreeNode, decorators: [{
|
|
753
759
|
type: Directive,
|
|
754
760
|
args: [{
|
|
755
761
|
selector: 'kbq-tree-node',
|
|
756
762
|
exportAs: 'kbqTreeNode'
|
|
757
763
|
}]
|
|
758
|
-
}], ctorParameters: () => [
|
|
759
|
-
type: Inject,
|
|
760
|
-
args: [forwardRef(() => KbqTreeBase)]
|
|
761
|
-
}] }] });
|
|
764
|
+
}], ctorParameters: () => [] });
|
|
762
765
|
|
|
763
766
|
/** @docs-private */
|
|
764
767
|
class KbqTreeNodeToggleBaseDirective {
|
|
768
|
+
// TODO: Skipped for migration because:
|
|
769
|
+
// Accessor inputs cannot be migrated as they are too complex.
|
|
765
770
|
get recursive() {
|
|
766
771
|
return this._recursive;
|
|
767
772
|
}
|
|
768
773
|
set recursive(value) {
|
|
769
774
|
this._recursive = coerceBooleanProperty(value);
|
|
770
775
|
}
|
|
776
|
+
// TODO: Skipped for migration because:
|
|
777
|
+
// Accessor inputs cannot be migrated as they are too complex.
|
|
771
778
|
get disabled() {
|
|
772
779
|
return this._disabled;
|
|
773
780
|
}
|
|
@@ -777,32 +784,33 @@ class KbqTreeNodeToggleBaseDirective {
|
|
|
777
784
|
}
|
|
778
785
|
}
|
|
779
786
|
get iconState() {
|
|
780
|
-
return this.tree.treeControl.isExpanded(this.node);
|
|
787
|
+
return this.tree.treeControl.isExpanded(this.node());
|
|
781
788
|
}
|
|
782
|
-
constructor(
|
|
783
|
-
this.tree =
|
|
784
|
-
this.treeNode =
|
|
789
|
+
constructor() {
|
|
790
|
+
this.tree = inject(KbqTreeBase);
|
|
791
|
+
this.treeNode = inject(KbqTreeNode);
|
|
792
|
+
this.node = input(undefined, ...(ngDevMode ? [{ debugName: "node" }] : []));
|
|
785
793
|
this._recursive = false;
|
|
786
794
|
this._disabled = false;
|
|
787
795
|
this.tree.treeControl.filterValue.subscribe((value) => (this.disabled = !!value?.length));
|
|
788
796
|
}
|
|
789
797
|
toggle(event) {
|
|
790
|
-
if (this.disabled)
|
|
798
|
+
if (this.disabled)
|
|
791
799
|
return;
|
|
800
|
+
if (this.recursive) {
|
|
801
|
+
this.tree.treeControl.toggleDescendants(this.treeNode.data);
|
|
802
|
+
}
|
|
803
|
+
else {
|
|
804
|
+
this.tree.treeControl.toggle(this.treeNode.data);
|
|
792
805
|
}
|
|
793
|
-
this.recursive
|
|
794
|
-
? this.tree.treeControl.toggleDescendants(this.treeNode.data)
|
|
795
|
-
: this.tree.treeControl.toggle(this.treeNode.data);
|
|
796
806
|
event.stopPropagation();
|
|
797
807
|
}
|
|
798
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
799
|
-
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "
|
|
808
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: KbqTreeNodeToggleBaseDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
809
|
+
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.25", type: KbqTreeNodeToggleBaseDirective, isStandalone: true, inputs: { node: { classPropertyName: "node", publicName: "node", isSignal: true, isRequired: false, transformFunction: null }, recursive: { classPropertyName: "recursive", publicName: "kbqTreeNodeToggleRecursive", isSignal: false, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: booleanAttribute } }, ngImport: i0 }); }
|
|
800
810
|
}
|
|
801
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
811
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: KbqTreeNodeToggleBaseDirective, decorators: [{
|
|
802
812
|
type: Directive
|
|
803
|
-
}], ctorParameters: () => [
|
|
804
|
-
type: Input
|
|
805
|
-
}], recursive: [{
|
|
813
|
+
}], ctorParameters: () => [], propDecorators: { node: [{ type: i0.Input, args: [{ isSignal: true, alias: "node", required: false }] }], recursive: [{
|
|
806
814
|
type: Input,
|
|
807
815
|
args: ['kbqTreeNodeToggleRecursive']
|
|
808
816
|
}], disabled: [{
|
|
@@ -810,41 +818,39 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.21", ngImpo
|
|
|
810
818
|
args: [{ transform: booleanAttribute }]
|
|
811
819
|
}] } });
|
|
812
820
|
class KbqTreeNodeToggleComponent extends KbqTreeNodeToggleBaseDirective {
|
|
813
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
814
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
821
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: KbqTreeNodeToggleComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
822
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.25", type: KbqTreeNodeToggleComponent, isStandalone: true, selector: "kbq-tree-node-toggle", host: { listeners: { "click": "toggle($event)" }, properties: { "class.kbq-expanded": "iconState", "attr.disabled": "disabled || null" }, classAttribute: "kbq-tree-node-toggle" }, exportAs: ["kbqTreeNodeToggle"], usesInheritance: true, ngImport: i0, template: `
|
|
815
823
|
<ng-content>
|
|
816
|
-
<i kbq-icon="kbq-chevron-down-s_16"></i>
|
|
824
|
+
<i kbq-icon="kbq-chevron-down-s_16" [color]="'contrast-fade'"></i>
|
|
817
825
|
</ng-content>
|
|
818
|
-
`, isInline: true, styles: [".kbq-tree-node-toggle{display:flex;align-items:center;justify-content:center;flex-shrink:0;height:100%;padding-left:var(--kbq-tree-size-toggle-padding);padding-right:var(--kbq-tree-size-toggle-padding);cursor:pointer}.kbq-tree-node-toggle .kbq-icon{transform:rotate(-90deg)}.kbq-tree-node-toggle.kbq-expanded .kbq-icon{transform:rotate(0)}.kbq-tree-node-toggle[disabled]{cursor:default}.kbq-tree-selection:focus{outline:none}.kbq-tree-option{--kbq-option-background: var(--kbq-tree-default-container-background);background:var(--kbq-tree-default-container-background)}.kbq-tree-option .kbq-option-text{color:var(--kbq-tree-default-text-color)}.kbq-tree-option .kbq-tree-node-toggle .kbq-icon.kbq-empty,.kbq-tree-option .kbq-icon.kbq-empty.kbq-tree-node-toggle{color:var(--kbq-tree-default-tree-toggle-color)}.kbq-tree-option .kbq-option-action .kbq-icon.kbq-empty{color:var(--kbq-tree-default-action-button-color)}.kbq-tree-option .kbq-option-caption{color:var(--kbq-tree-default-caption-color)}.kbq-tree-option:not(.kbq-disabled):hover,.kbq-tree-option:not(.kbq-disabled).kbq-hovered,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused{--kbq-option-background: var(--kbq-tree-states-hover-container-background);background:var(--kbq-tree-states-hover-container-background)}.kbq-tree-option:not(.kbq-disabled):hover .kbq-option-text,.kbq-tree-option:not(.kbq-disabled).kbq-hovered .kbq-option-text,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused .kbq-option-text{color:var(--kbq-tree-states-hover-text-color)}.kbq-tree-option:not(.kbq-disabled):hover .kbq-tree-node-toggle .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled):hover .kbq-icon.kbq-empty.kbq-tree-node-toggle,.kbq-tree-option:not(.kbq-disabled).kbq-hovered .kbq-tree-node-toggle .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-hovered .kbq-icon.kbq-empty.kbq-tree-node-toggle,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused .kbq-tree-node-toggle .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused .kbq-icon.kbq-empty.kbq-tree-node-toggle{color:var(--kbq-tree-states-hover-tree-toggle-color)}.kbq-tree-option:not(.kbq-disabled):hover .kbq-option-action .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-hovered .kbq-option-action .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused .kbq-option-action .kbq-icon.kbq-empty{color:var(--kbq-tree-states-hover-action-button-color)}.kbq-tree-option:not(.kbq-disabled):hover .kbq-option-caption,.kbq-tree-option:not(.kbq-disabled).kbq-hovered .kbq-option-caption,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused .kbq-option-caption{color:var(--kbq-tree-states-hover-caption-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected{--kbq-option-background: var(--kbq-tree-states-selected-container-background);background:var(--kbq-tree-states-selected-container-background)}.kbq-tree-option:not(.kbq-disabled).kbq-selected .kbq-option-text{color:var(--kbq-tree-states-selected-text-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected .kbq-tree-node-toggle .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-selected .kbq-icon.kbq-empty.kbq-tree-node-toggle{color:var(--kbq-tree-states-selected-tree-toggle-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected .kbq-option-action .kbq-icon.kbq-empty{color:var(--kbq-tree-states-selected-action-button-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected .kbq-option-caption{color:var(--kbq-tree-states-selected-caption-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected:hover,.kbq-tree-option:not(.kbq-disabled).kbq-selected.kbq-hovered{--kbq-option-background: var(--kbq-tree-states-selected-hover-container-background);background:var(--kbq-tree-states-selected-hover-container-background)}.kbq-tree-option:not(.kbq-disabled).kbq-selected:hover .kbq-option-text,.kbq-tree-option:not(.kbq-disabled).kbq-selected.kbq-hovered .kbq-option-text{color:var(--kbq-tree-states-selected-hover-text-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected:hover .kbq-tree-node-toggle .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-selected:hover .kbq-icon.kbq-empty.kbq-tree-node-toggle,.kbq-tree-option:not(.kbq-disabled).kbq-selected.kbq-hovered .kbq-tree-node-toggle .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-selected.kbq-hovered .kbq-icon.kbq-empty.kbq-tree-node-toggle{color:var(--kbq-tree-states-selected-hover-tree-toggle-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected:hover .kbq-option-action .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-selected.kbq-hovered .kbq-option-action .kbq-icon.kbq-empty{color:var(--kbq-tree-states-selected-hover-action-button-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected:hover .kbq-option-caption,.kbq-tree-option:not(.kbq-disabled).kbq-selected.kbq-hovered .kbq-option-caption{color:var(--kbq-tree-states-selected-hover-caption-color)}.kbq-tree-option:not(.kbq-disabled).kbq-checked:not(.kbq-selected),.kbq-tree-option:not(.kbq-disabled).kbq-tree-option_multiple.kbq-selected{--kbq-option-background: var(--kbq-tree-multiple-states-selected-container-background);background:var(--kbq-tree-multiple-states-selected-container-background)}.kbq-tree-option:not(.kbq-disabled).kbq-checked:not(.kbq-selected):hover,.kbq-tree-option:not(.kbq-disabled).kbq-checked:not(.kbq-selected).kbq-hovered,.kbq-tree-option:not(.kbq-disabled).kbq-tree-option_multiple.kbq-selected:hover,.kbq-tree-option:not(.kbq-disabled).kbq-tree-option_multiple.kbq-selected.kbq-hovered{--kbq-option-background: var(--kbq-tree-multiple-states-selected-hover-container-background);background:var(--kbq-tree-multiple-states-selected-hover-container-background)}.kbq-tree-option.kbq-disabled{--kbq-option-background: var(--kbq-tree-states-disabled-container-background);background:var(--kbq-tree-states-disabled-container-background)}.kbq-tree-option.kbq-disabled .kbq-option-text{color:var(--kbq-tree-states-disabled-text-color)}.kbq-tree-option.kbq-disabled .kbq-tree-node-toggle .kbq-icon.kbq-empty,.kbq-tree-option.kbq-disabled .kbq-icon.kbq-empty.kbq-tree-node-toggle{color:var(--kbq-tree-states-disabled-tree-toggle-color)}.kbq-tree-option.kbq-disabled .kbq-option-action .kbq-icon.kbq-empty{color:var(--kbq-tree-states-disabled-action-button-color)}.kbq-tree-option.kbq-disabled .kbq-option-caption{color:var(--kbq-tree-states-disabled-caption-color)}.kbq-tree-option.kbq-disabled .kbq-icon.kbq-empty{color:var(--kbq-states-icon-disabled)}.cdk-keyboard-focused .kbq-tree-option.kbq-focused:not(.kbq-action-button-focused){border-color:var(--kbq-tree-states-focused-focus-outline-color)}.cdk-keyboard-focused .kbq-tree-option.kbq-focused:not(.kbq-action-button-focused) .kbq-action-container{display:flex}.kbq-tree-option{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-tree-option-caption{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", ".kbq-tree,.kbq-tree-selection{--kbq-tree-size-indent-level: var(--kbq-size-xxl);--kbq-tree-size-container-padding-right: var(--kbq-size-s);--kbq-tree-size-container-padding-vertical: var(--kbq-size-xxs);--kbq-tree-size-container-content-gap-horizontal: var(--kbq-size-s);--kbq-tree-size-container-content-gap-vertical: 0px;--kbq-tree-size-container-focus-outline-width: var(--kbq-size-3xs);--kbq-tree-size-text-padding-vertical: var(--kbq-size-3xs);--kbq-tree-option-border-radius: var(--kbq-size-border-radius);--kbq-tree-default-container-background: transparent;--kbq-tree-default-text-color: var(--kbq-foreground-contrast);--kbq-tree-default-icon-color: var(--kbq-icon-contrast);--kbq-tree-default-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-default-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-default-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-hover-container-background: var(--kbq-states-background-transparent-hover);--kbq-tree-states-active-container-background: var(--kbq-states-background-transparent-active);--kbq-tree-states-hover-text-color: var(--kbq-foreground-contrast);--kbq-tree-states-hover-icon-color: var(--kbq-icon-contrast);--kbq-tree-states-hover-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-hover-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-hover-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-focused-focus-outline-color: var(--kbq-states-line-focus-theme);--kbq-tree-states-selected-container-background: var(--kbq-background-theme-less);--kbq-tree-multiple-states-selected-container-background: var(--kbq-background-contrast-less);--kbq-tree-states-selected-text-color: var(--kbq-foreground-contrast);--kbq-tree-states-selected-icon-color: var(--kbq-icon-contrast);--kbq-tree-states-selected-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-selected-hover-container-background: var(--kbq-states-background-theme-less-hover);--kbq-tree-states-selected-active-container-background: var(--kbq-states-background-theme-less-active);--kbq-tree-multiple-states-selected-hover-container-background: var(--kbq-states-background-contrast-less-hover);--kbq-tree-multiple-states-selected-active-container-background: var(--kbq-states-background-contrast-less-active);--kbq-tree-states-selected-hover-text-color: var(--kbq-foreground-contrast);--kbq-tree-states-selected-hover-icon-color: var(--kbq-icon-contrast);--kbq-tree-states-selected-hover-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-hover-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-hover-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-disabled-container-background: transparent;--kbq-tree-states-disabled-text-color: var(--kbq-states-foreground-disabled);--kbq-tree-states-disabled-icon-color: var(--kbq-states-icon-disabled);--kbq-tree-states-disabled-tree-toggle-color: var(--kbq-states-icon-disabled);--kbq-tree-states-disabled-action-button-color: var(--kbq-states-icon-disabled);--kbq-tree-states-disabled-caption-color: var(--kbq-states-foreground-disabled)}\n"], dependencies: [{ kind: "component", type: KbqIcon, selector: "[kbq-icon]", inputs: ["small", "autoColor", "kbq-icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
826
|
+
`, isInline: true, styles: [".kbq-tree-node-toggle{display:flex;align-items:center;justify-content:center;flex-shrink:0;height:100%;padding-left:var(--kbq-tree-size-toggle-padding);padding-right:var(--kbq-tree-size-toggle-padding);cursor:pointer}.kbq-tree-node-toggle .kbq-icon{transform:rotate(-90deg)}.kbq-tree-node-toggle.kbq-expanded .kbq-icon{transform:rotate(0)}.kbq-tree-node-toggle[disabled]{cursor:default}.kbq-tree-node-toggle[disabled] .kbq-icon{color:var(--kbq-tree-states-disabled-tree-toggle-color)}.kbq-tree-selection:focus{outline:none}.kbq-tree-option{--kbq-option-background: var(--kbq-tree-default-container-background);background:var(--kbq-tree-default-container-background)}.kbq-tree-option .kbq-option-text{color:var(--kbq-tree-default-text-color)}.kbq-tree-option .kbq-option-action .kbq-icon.kbq-empty{color:var(--kbq-tree-default-action-button-color)}.kbq-tree-option .kbq-option-caption{color:var(--kbq-tree-default-caption-color)}.kbq-tree-option:not(.kbq-disabled):hover,.kbq-tree-option:not(.kbq-disabled).kbq-hovered,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused{--kbq-option-background: var(--kbq-tree-states-hover-container-background);background:var(--kbq-tree-states-hover-container-background)}.kbq-tree-option:not(.kbq-disabled):hover .kbq-option-text,.kbq-tree-option:not(.kbq-disabled).kbq-hovered .kbq-option-text,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused .kbq-option-text{color:var(--kbq-tree-states-hover-text-color)}.kbq-tree-option:not(.kbq-disabled):hover .kbq-option-action .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-hovered .kbq-option-action .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused .kbq-option-action .kbq-icon.kbq-empty{color:var(--kbq-tree-states-hover-action-button-color)}.kbq-tree-option:not(.kbq-disabled):hover .kbq-option-caption,.kbq-tree-option:not(.kbq-disabled).kbq-hovered .kbq-option-caption,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused .kbq-option-caption{color:var(--kbq-tree-states-hover-caption-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected{--kbq-option-background: var(--kbq-tree-states-selected-container-background);background:var(--kbq-tree-states-selected-container-background)}.kbq-tree-option:not(.kbq-disabled).kbq-selected .kbq-option-text{color:var(--kbq-tree-states-selected-text-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected .kbq-option-action .kbq-icon.kbq-empty{color:var(--kbq-tree-states-selected-action-button-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected .kbq-option-caption{color:var(--kbq-tree-states-selected-caption-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected:hover,.kbq-tree-option:not(.kbq-disabled).kbq-selected.kbq-hovered{--kbq-option-background: var(--kbq-tree-states-selected-hover-container-background);background:var(--kbq-tree-states-selected-hover-container-background)}.kbq-tree-option:not(.kbq-disabled).kbq-selected:hover .kbq-option-text,.kbq-tree-option:not(.kbq-disabled).kbq-selected.kbq-hovered .kbq-option-text{color:var(--kbq-tree-states-selected-hover-text-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected:hover .kbq-option-action .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-selected.kbq-hovered .kbq-option-action .kbq-icon.kbq-empty{color:var(--kbq-tree-states-selected-hover-action-button-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected:hover .kbq-option-caption,.kbq-tree-option:not(.kbq-disabled).kbq-selected.kbq-hovered .kbq-option-caption{color:var(--kbq-tree-states-selected-hover-caption-color)}.kbq-tree-option:not(.kbq-disabled).kbq-checked:not(.kbq-selected),.kbq-tree-option:not(.kbq-disabled).kbq-tree-option_multiple.kbq-selected{--kbq-option-background: var(--kbq-tree-multiple-states-selected-container-background);background:var(--kbq-tree-multiple-states-selected-container-background)}.kbq-tree-option:not(.kbq-disabled).kbq-checked:not(.kbq-selected):hover,.kbq-tree-option:not(.kbq-disabled).kbq-checked:not(.kbq-selected).kbq-hovered,.kbq-tree-option:not(.kbq-disabled).kbq-tree-option_multiple.kbq-selected:hover,.kbq-tree-option:not(.kbq-disabled).kbq-tree-option_multiple.kbq-selected.kbq-hovered{--kbq-option-background: var(--kbq-tree-multiple-states-selected-hover-container-background);background:var(--kbq-tree-multiple-states-selected-hover-container-background)}.kbq-tree-option.kbq-disabled{--kbq-option-background: var(--kbq-tree-states-disabled-container-background);background:var(--kbq-tree-states-disabled-container-background)}.kbq-tree-option.kbq-disabled .kbq-option-text{color:var(--kbq-tree-states-disabled-text-color)}.kbq-tree-option.kbq-disabled .kbq-option-action .kbq-icon.kbq-empty{color:var(--kbq-tree-states-disabled-action-button-color)}.kbq-tree-option.kbq-disabled .kbq-option-caption{color:var(--kbq-tree-states-disabled-caption-color)}.kbq-tree-option.kbq-disabled .kbq-icon.kbq-empty:not(.kbq-tree-node-toggle .kbq-icon){color:var(--kbq-states-icon-disabled)}.cdk-keyboard-focused .kbq-tree-option.kbq-focused:not(.kbq-action-button-focused){border-color:var(--kbq-tree-states-focused-focus-outline-color)}.cdk-keyboard-focused .kbq-tree-option.kbq-focused:not(.kbq-action-button-focused) .kbq-action-container{display:flex}.kbq-tree-option{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-option-caption{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", ".kbq-tree,.kbq-tree-selection{--kbq-tree-size-indent-level: var(--kbq-size-xxl);--kbq-tree-size-container-padding-right: var(--kbq-size-s);--kbq-tree-size-container-padding-vertical: var(--kbq-size-xxs);--kbq-tree-size-container-content-gap-horizontal: var(--kbq-size-s);--kbq-tree-size-container-content-gap-vertical: 0px;--kbq-tree-size-container-focus-outline-width: var(--kbq-size-3xs);--kbq-tree-size-text-padding-vertical: var(--kbq-size-3xs);--kbq-tree-option-border-radius: var(--kbq-size-border-radius);--kbq-tree-default-container-background: transparent;--kbq-tree-default-text-color: var(--kbq-foreground-contrast);--kbq-tree-default-icon-color: var(--kbq-icon-contrast);--kbq-tree-default-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-default-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-default-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-hover-container-background: var(--kbq-states-background-transparent-hover);--kbq-tree-states-active-container-background: var(--kbq-states-background-transparent-active);--kbq-tree-states-hover-text-color: var(--kbq-foreground-contrast);--kbq-tree-states-hover-icon-color: var(--kbq-icon-contrast);--kbq-tree-states-hover-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-hover-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-hover-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-focused-focus-outline-color: var(--kbq-states-line-focus-theme);--kbq-tree-states-selected-container-background: var(--kbq-background-theme-less);--kbq-tree-multiple-states-selected-container-background: var(--kbq-background-contrast-less);--kbq-tree-states-selected-text-color: var(--kbq-foreground-contrast);--kbq-tree-states-selected-icon-color: var(--kbq-icon-contrast);--kbq-tree-states-selected-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-selected-hover-container-background: var(--kbq-states-background-theme-less-hover);--kbq-tree-states-selected-active-container-background: var(--kbq-states-background-theme-less-active);--kbq-tree-multiple-states-selected-hover-container-background: var(--kbq-states-background-contrast-less-hover);--kbq-tree-multiple-states-selected-active-container-background: var(--kbq-states-background-contrast-less-active);--kbq-tree-states-selected-hover-text-color: var(--kbq-foreground-contrast);--kbq-tree-states-selected-hover-icon-color: var(--kbq-icon-contrast);--kbq-tree-states-selected-hover-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-hover-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-hover-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-disabled-container-background: transparent;--kbq-tree-states-disabled-text-color: var(--kbq-states-foreground-disabled);--kbq-tree-states-disabled-icon-color: var(--kbq-states-icon-disabled);--kbq-tree-states-disabled-tree-toggle-color: var(--kbq-states-icon-disabled);--kbq-tree-states-disabled-action-button-color: var(--kbq-states-icon-disabled);--kbq-tree-states-disabled-caption-color: var(--kbq-states-foreground-disabled)}\n"], dependencies: [{ kind: "component", type: KbqIcon, selector: "[kbq-icon]", inputs: ["small", "autoColor", "kbq-icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
819
827
|
}
|
|
820
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
828
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: KbqTreeNodeToggleComponent, decorators: [{
|
|
821
829
|
type: Component,
|
|
822
|
-
args: [{ selector: 'kbq-tree-node-toggle', imports: [
|
|
823
|
-
KbqIcon
|
|
824
|
-
], template: `
|
|
830
|
+
args: [{ selector: 'kbq-tree-node-toggle', imports: [KbqIcon], template: `
|
|
825
831
|
<ng-content>
|
|
826
|
-
<i kbq-icon="kbq-chevron-down-s_16"></i>
|
|
832
|
+
<i kbq-icon="kbq-chevron-down-s_16" [color]="'contrast-fade'"></i>
|
|
827
833
|
</ng-content>
|
|
828
|
-
`,
|
|
834
|
+
`, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
|
|
829
835
|
class: 'kbq-tree-node-toggle',
|
|
830
836
|
'[class.kbq-expanded]': 'iconState',
|
|
831
837
|
'[attr.disabled]': 'disabled || null',
|
|
832
838
|
'(click)': 'toggle($event)'
|
|
833
|
-
}, styles: [".kbq-tree-node-toggle{display:flex;align-items:center;justify-content:center;flex-shrink:0;height:100%;padding-left:var(--kbq-tree-size-toggle-padding);padding-right:var(--kbq-tree-size-toggle-padding);cursor:pointer}.kbq-tree-node-toggle .kbq-icon{transform:rotate(-90deg)}.kbq-tree-node-toggle.kbq-expanded .kbq-icon{transform:rotate(0)}.kbq-tree-node-toggle[disabled]{cursor:default}.kbq-tree-selection:focus{outline:none}.kbq-tree-option{--kbq-option-background: var(--kbq-tree-default-container-background);background:var(--kbq-tree-default-container-background)}.kbq-tree-option .kbq-option-text{color:var(--kbq-tree-default-text-color)}.kbq-tree-option .kbq-tree-node-toggle .kbq-icon.kbq-empty,.kbq-tree-option .kbq-icon.kbq-empty.kbq-tree-node-toggle{color:var(--kbq-tree-default-tree-toggle-color)}.kbq-tree-option .kbq-option-action .kbq-icon.kbq-empty{color:var(--kbq-tree-default-action-button-color)}.kbq-tree-option .kbq-option-caption{color:var(--kbq-tree-default-caption-color)}.kbq-tree-option:not(.kbq-disabled):hover,.kbq-tree-option:not(.kbq-disabled).kbq-hovered,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused{--kbq-option-background: var(--kbq-tree-states-hover-container-background);background:var(--kbq-tree-states-hover-container-background)}.kbq-tree-option:not(.kbq-disabled):hover .kbq-option-text,.kbq-tree-option:not(.kbq-disabled).kbq-hovered .kbq-option-text,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused .kbq-option-text{color:var(--kbq-tree-states-hover-text-color)}.kbq-tree-option:not(.kbq-disabled):hover .kbq-tree-node-toggle .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled):hover .kbq-icon.kbq-empty.kbq-tree-node-toggle,.kbq-tree-option:not(.kbq-disabled).kbq-hovered .kbq-tree-node-toggle .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-hovered .kbq-icon.kbq-empty.kbq-tree-node-toggle,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused .kbq-tree-node-toggle .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused .kbq-icon.kbq-empty.kbq-tree-node-toggle{color:var(--kbq-tree-states-hover-tree-toggle-color)}.kbq-tree-option:not(.kbq-disabled):hover .kbq-option-action .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-hovered .kbq-option-action .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused .kbq-option-action .kbq-icon.kbq-empty{color:var(--kbq-tree-states-hover-action-button-color)}.kbq-tree-option:not(.kbq-disabled):hover .kbq-option-caption,.kbq-tree-option:not(.kbq-disabled).kbq-hovered .kbq-option-caption,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused .kbq-option-caption{color:var(--kbq-tree-states-hover-caption-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected{--kbq-option-background: var(--kbq-tree-states-selected-container-background);background:var(--kbq-tree-states-selected-container-background)}.kbq-tree-option:not(.kbq-disabled).kbq-selected .kbq-option-text{color:var(--kbq-tree-states-selected-text-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected .kbq-tree-node-toggle .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-selected .kbq-icon.kbq-empty.kbq-tree-node-toggle{color:var(--kbq-tree-states-selected-tree-toggle-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected .kbq-option-action .kbq-icon.kbq-empty{color:var(--kbq-tree-states-selected-action-button-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected .kbq-option-caption{color:var(--kbq-tree-states-selected-caption-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected:hover,.kbq-tree-option:not(.kbq-disabled).kbq-selected.kbq-hovered{--kbq-option-background: var(--kbq-tree-states-selected-hover-container-background);background:var(--kbq-tree-states-selected-hover-container-background)}.kbq-tree-option:not(.kbq-disabled).kbq-selected:hover .kbq-option-text,.kbq-tree-option:not(.kbq-disabled).kbq-selected.kbq-hovered .kbq-option-text{color:var(--kbq-tree-states-selected-hover-text-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected:hover .kbq-tree-node-toggle .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-selected:hover .kbq-icon.kbq-empty.kbq-tree-node-toggle,.kbq-tree-option:not(.kbq-disabled).kbq-selected.kbq-hovered .kbq-tree-node-toggle .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-selected.kbq-hovered .kbq-icon.kbq-empty.kbq-tree-node-toggle{color:var(--kbq-tree-states-selected-hover-tree-toggle-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected:hover .kbq-option-action .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-selected.kbq-hovered .kbq-option-action .kbq-icon.kbq-empty{color:var(--kbq-tree-states-selected-hover-action-button-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected:hover .kbq-option-caption,.kbq-tree-option:not(.kbq-disabled).kbq-selected.kbq-hovered .kbq-option-caption{color:var(--kbq-tree-states-selected-hover-caption-color)}.kbq-tree-option:not(.kbq-disabled).kbq-checked:not(.kbq-selected),.kbq-tree-option:not(.kbq-disabled).kbq-tree-option_multiple.kbq-selected{--kbq-option-background: var(--kbq-tree-multiple-states-selected-container-background);background:var(--kbq-tree-multiple-states-selected-container-background)}.kbq-tree-option:not(.kbq-disabled).kbq-checked:not(.kbq-selected):hover,.kbq-tree-option:not(.kbq-disabled).kbq-checked:not(.kbq-selected).kbq-hovered,.kbq-tree-option:not(.kbq-disabled).kbq-tree-option_multiple.kbq-selected:hover,.kbq-tree-option:not(.kbq-disabled).kbq-tree-option_multiple.kbq-selected.kbq-hovered{--kbq-option-background: var(--kbq-tree-multiple-states-selected-hover-container-background);background:var(--kbq-tree-multiple-states-selected-hover-container-background)}.kbq-tree-option.kbq-disabled{--kbq-option-background: var(--kbq-tree-states-disabled-container-background);background:var(--kbq-tree-states-disabled-container-background)}.kbq-tree-option.kbq-disabled .kbq-option-text{color:var(--kbq-tree-states-disabled-text-color)}.kbq-tree-option.kbq-disabled .kbq-tree-node-toggle .kbq-icon.kbq-empty,.kbq-tree-option.kbq-disabled .kbq-icon.kbq-empty.kbq-tree-node-toggle{color:var(--kbq-tree-states-disabled-tree-toggle-color)}.kbq-tree-option.kbq-disabled .kbq-option-action .kbq-icon.kbq-empty{color:var(--kbq-tree-states-disabled-action-button-color)}.kbq-tree-option.kbq-disabled .kbq-option-caption{color:var(--kbq-tree-states-disabled-caption-color)}.kbq-tree-option.kbq-disabled .kbq-icon.kbq-empty{color:var(--kbq-states-icon-disabled)}.cdk-keyboard-focused .kbq-tree-option.kbq-focused:not(.kbq-action-button-focused){border-color:var(--kbq-tree-states-focused-focus-outline-color)}.cdk-keyboard-focused .kbq-tree-option.kbq-focused:not(.kbq-action-button-focused) .kbq-action-container{display:flex}.kbq-tree-option{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-tree-option-caption{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", ".kbq-tree,.kbq-tree-selection{--kbq-tree-size-indent-level: var(--kbq-size-xxl);--kbq-tree-size-container-padding-right: var(--kbq-size-s);--kbq-tree-size-container-padding-vertical: var(--kbq-size-xxs);--kbq-tree-size-container-content-gap-horizontal: var(--kbq-size-s);--kbq-tree-size-container-content-gap-vertical: 0px;--kbq-tree-size-container-focus-outline-width: var(--kbq-size-3xs);--kbq-tree-size-text-padding-vertical: var(--kbq-size-3xs);--kbq-tree-option-border-radius: var(--kbq-size-border-radius);--kbq-tree-default-container-background: transparent;--kbq-tree-default-text-color: var(--kbq-foreground-contrast);--kbq-tree-default-icon-color: var(--kbq-icon-contrast);--kbq-tree-default-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-default-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-default-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-hover-container-background: var(--kbq-states-background-transparent-hover);--kbq-tree-states-active-container-background: var(--kbq-states-background-transparent-active);--kbq-tree-states-hover-text-color: var(--kbq-foreground-contrast);--kbq-tree-states-hover-icon-color: var(--kbq-icon-contrast);--kbq-tree-states-hover-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-hover-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-hover-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-focused-focus-outline-color: var(--kbq-states-line-focus-theme);--kbq-tree-states-selected-container-background: var(--kbq-background-theme-less);--kbq-tree-multiple-states-selected-container-background: var(--kbq-background-contrast-less);--kbq-tree-states-selected-text-color: var(--kbq-foreground-contrast);--kbq-tree-states-selected-icon-color: var(--kbq-icon-contrast);--kbq-tree-states-selected-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-selected-hover-container-background: var(--kbq-states-background-theme-less-hover);--kbq-tree-states-selected-active-container-background: var(--kbq-states-background-theme-less-active);--kbq-tree-multiple-states-selected-hover-container-background: var(--kbq-states-background-contrast-less-hover);--kbq-tree-multiple-states-selected-active-container-background: var(--kbq-states-background-contrast-less-active);--kbq-tree-states-selected-hover-text-color: var(--kbq-foreground-contrast);--kbq-tree-states-selected-hover-icon-color: var(--kbq-icon-contrast);--kbq-tree-states-selected-hover-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-hover-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-hover-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-disabled-container-background: transparent;--kbq-tree-states-disabled-text-color: var(--kbq-states-foreground-disabled);--kbq-tree-states-disabled-icon-color: var(--kbq-states-icon-disabled);--kbq-tree-states-disabled-tree-toggle-color: var(--kbq-states-icon-disabled);--kbq-tree-states-disabled-action-button-color: var(--kbq-states-icon-disabled);--kbq-tree-states-disabled-caption-color: var(--kbq-states-foreground-disabled)}\n"] }]
|
|
839
|
+
}, exportAs: 'kbqTreeNodeToggle', styles: [".kbq-tree-node-toggle{display:flex;align-items:center;justify-content:center;flex-shrink:0;height:100%;padding-left:var(--kbq-tree-size-toggle-padding);padding-right:var(--kbq-tree-size-toggle-padding);cursor:pointer}.kbq-tree-node-toggle .kbq-icon{transform:rotate(-90deg)}.kbq-tree-node-toggle.kbq-expanded .kbq-icon{transform:rotate(0)}.kbq-tree-node-toggle[disabled]{cursor:default}.kbq-tree-node-toggle[disabled] .kbq-icon{color:var(--kbq-tree-states-disabled-tree-toggle-color)}.kbq-tree-selection:focus{outline:none}.kbq-tree-option{--kbq-option-background: var(--kbq-tree-default-container-background);background:var(--kbq-tree-default-container-background)}.kbq-tree-option .kbq-option-text{color:var(--kbq-tree-default-text-color)}.kbq-tree-option .kbq-option-action .kbq-icon.kbq-empty{color:var(--kbq-tree-default-action-button-color)}.kbq-tree-option .kbq-option-caption{color:var(--kbq-tree-default-caption-color)}.kbq-tree-option:not(.kbq-disabled):hover,.kbq-tree-option:not(.kbq-disabled).kbq-hovered,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused{--kbq-option-background: var(--kbq-tree-states-hover-container-background);background:var(--kbq-tree-states-hover-container-background)}.kbq-tree-option:not(.kbq-disabled):hover .kbq-option-text,.kbq-tree-option:not(.kbq-disabled).kbq-hovered .kbq-option-text,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused .kbq-option-text{color:var(--kbq-tree-states-hover-text-color)}.kbq-tree-option:not(.kbq-disabled):hover .kbq-option-action .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-hovered .kbq-option-action .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused .kbq-option-action .kbq-icon.kbq-empty{color:var(--kbq-tree-states-hover-action-button-color)}.kbq-tree-option:not(.kbq-disabled):hover .kbq-option-caption,.kbq-tree-option:not(.kbq-disabled).kbq-hovered .kbq-option-caption,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused .kbq-option-caption{color:var(--kbq-tree-states-hover-caption-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected{--kbq-option-background: var(--kbq-tree-states-selected-container-background);background:var(--kbq-tree-states-selected-container-background)}.kbq-tree-option:not(.kbq-disabled).kbq-selected .kbq-option-text{color:var(--kbq-tree-states-selected-text-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected .kbq-option-action .kbq-icon.kbq-empty{color:var(--kbq-tree-states-selected-action-button-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected .kbq-option-caption{color:var(--kbq-tree-states-selected-caption-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected:hover,.kbq-tree-option:not(.kbq-disabled).kbq-selected.kbq-hovered{--kbq-option-background: var(--kbq-tree-states-selected-hover-container-background);background:var(--kbq-tree-states-selected-hover-container-background)}.kbq-tree-option:not(.kbq-disabled).kbq-selected:hover .kbq-option-text,.kbq-tree-option:not(.kbq-disabled).kbq-selected.kbq-hovered .kbq-option-text{color:var(--kbq-tree-states-selected-hover-text-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected:hover .kbq-option-action .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-selected.kbq-hovered .kbq-option-action .kbq-icon.kbq-empty{color:var(--kbq-tree-states-selected-hover-action-button-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected:hover .kbq-option-caption,.kbq-tree-option:not(.kbq-disabled).kbq-selected.kbq-hovered .kbq-option-caption{color:var(--kbq-tree-states-selected-hover-caption-color)}.kbq-tree-option:not(.kbq-disabled).kbq-checked:not(.kbq-selected),.kbq-tree-option:not(.kbq-disabled).kbq-tree-option_multiple.kbq-selected{--kbq-option-background: var(--kbq-tree-multiple-states-selected-container-background);background:var(--kbq-tree-multiple-states-selected-container-background)}.kbq-tree-option:not(.kbq-disabled).kbq-checked:not(.kbq-selected):hover,.kbq-tree-option:not(.kbq-disabled).kbq-checked:not(.kbq-selected).kbq-hovered,.kbq-tree-option:not(.kbq-disabled).kbq-tree-option_multiple.kbq-selected:hover,.kbq-tree-option:not(.kbq-disabled).kbq-tree-option_multiple.kbq-selected.kbq-hovered{--kbq-option-background: var(--kbq-tree-multiple-states-selected-hover-container-background);background:var(--kbq-tree-multiple-states-selected-hover-container-background)}.kbq-tree-option.kbq-disabled{--kbq-option-background: var(--kbq-tree-states-disabled-container-background);background:var(--kbq-tree-states-disabled-container-background)}.kbq-tree-option.kbq-disabled .kbq-option-text{color:var(--kbq-tree-states-disabled-text-color)}.kbq-tree-option.kbq-disabled .kbq-option-action .kbq-icon.kbq-empty{color:var(--kbq-tree-states-disabled-action-button-color)}.kbq-tree-option.kbq-disabled .kbq-option-caption{color:var(--kbq-tree-states-disabled-caption-color)}.kbq-tree-option.kbq-disabled .kbq-icon.kbq-empty:not(.kbq-tree-node-toggle .kbq-icon){color:var(--kbq-states-icon-disabled)}.cdk-keyboard-focused .kbq-tree-option.kbq-focused:not(.kbq-action-button-focused){border-color:var(--kbq-tree-states-focused-focus-outline-color)}.cdk-keyboard-focused .kbq-tree-option.kbq-focused:not(.kbq-action-button-focused) .kbq-action-container{display:flex}.kbq-tree-option{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-option-caption{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", ".kbq-tree,.kbq-tree-selection{--kbq-tree-size-indent-level: var(--kbq-size-xxl);--kbq-tree-size-container-padding-right: var(--kbq-size-s);--kbq-tree-size-container-padding-vertical: var(--kbq-size-xxs);--kbq-tree-size-container-content-gap-horizontal: var(--kbq-size-s);--kbq-tree-size-container-content-gap-vertical: 0px;--kbq-tree-size-container-focus-outline-width: var(--kbq-size-3xs);--kbq-tree-size-text-padding-vertical: var(--kbq-size-3xs);--kbq-tree-option-border-radius: var(--kbq-size-border-radius);--kbq-tree-default-container-background: transparent;--kbq-tree-default-text-color: var(--kbq-foreground-contrast);--kbq-tree-default-icon-color: var(--kbq-icon-contrast);--kbq-tree-default-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-default-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-default-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-hover-container-background: var(--kbq-states-background-transparent-hover);--kbq-tree-states-active-container-background: var(--kbq-states-background-transparent-active);--kbq-tree-states-hover-text-color: var(--kbq-foreground-contrast);--kbq-tree-states-hover-icon-color: var(--kbq-icon-contrast);--kbq-tree-states-hover-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-hover-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-hover-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-focused-focus-outline-color: var(--kbq-states-line-focus-theme);--kbq-tree-states-selected-container-background: var(--kbq-background-theme-less);--kbq-tree-multiple-states-selected-container-background: var(--kbq-background-contrast-less);--kbq-tree-states-selected-text-color: var(--kbq-foreground-contrast);--kbq-tree-states-selected-icon-color: var(--kbq-icon-contrast);--kbq-tree-states-selected-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-selected-hover-container-background: var(--kbq-states-background-theme-less-hover);--kbq-tree-states-selected-active-container-background: var(--kbq-states-background-theme-less-active);--kbq-tree-multiple-states-selected-hover-container-background: var(--kbq-states-background-contrast-less-hover);--kbq-tree-multiple-states-selected-active-container-background: var(--kbq-states-background-contrast-less-active);--kbq-tree-states-selected-hover-text-color: var(--kbq-foreground-contrast);--kbq-tree-states-selected-hover-icon-color: var(--kbq-icon-contrast);--kbq-tree-states-selected-hover-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-hover-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-hover-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-disabled-container-background: transparent;--kbq-tree-states-disabled-text-color: var(--kbq-states-foreground-disabled);--kbq-tree-states-disabled-icon-color: var(--kbq-states-icon-disabled);--kbq-tree-states-disabled-tree-toggle-color: var(--kbq-states-icon-disabled);--kbq-tree-states-disabled-action-button-color: var(--kbq-states-icon-disabled);--kbq-tree-states-disabled-caption-color: var(--kbq-states-foreground-disabled)}\n"] }]
|
|
834
840
|
}] });
|
|
835
841
|
class KbqTreeNodeToggleDirective extends KbqTreeNodeToggleBaseDirective {
|
|
836
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
837
|
-
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
842
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: KbqTreeNodeToggleDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
|
|
843
|
+
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.25", type: KbqTreeNodeToggleDirective, isStandalone: true, selector: "[kbq-tree-node-toggle], [kbqTreeNodeToggle]", host: { listeners: { "click": "toggle($event)" }, properties: { "attr.disabled": "disabled || null" } }, exportAs: ["kbqTreeNodeToggle"], usesInheritance: true, ngImport: i0 }); }
|
|
838
844
|
}
|
|
839
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
845
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: KbqTreeNodeToggleDirective, decorators: [{
|
|
840
846
|
type: Directive,
|
|
841
847
|
args: [{
|
|
842
848
|
selector: '[kbq-tree-node-toggle], [kbqTreeNodeToggle]',
|
|
843
|
-
exportAs: 'kbqTreeNodeToggle',
|
|
844
849
|
host: {
|
|
845
850
|
'[attr.disabled]': 'disabled || null',
|
|
846
851
|
'(click)': 'toggle($event)'
|
|
847
|
-
}
|
|
852
|
+
},
|
|
853
|
+
exportAs: 'kbqTreeNodeToggle'
|
|
848
854
|
}]
|
|
849
855
|
}] });
|
|
850
856
|
|
|
@@ -865,7 +871,7 @@ class KbqTreeOptionChange {
|
|
|
865
871
|
let uniqueIdCounter = 0;
|
|
866
872
|
class KbqTreeOption extends KbqTreeNode {
|
|
867
873
|
get externalPseudoCheckbox() {
|
|
868
|
-
return !!this.pseudoCheckbox;
|
|
874
|
+
return !!this.pseudoCheckbox();
|
|
869
875
|
}
|
|
870
876
|
get value() {
|
|
871
877
|
return this._value;
|
|
@@ -873,6 +879,8 @@ class KbqTreeOption extends KbqTreeNode {
|
|
|
873
879
|
set value(value) {
|
|
874
880
|
this._value = value;
|
|
875
881
|
}
|
|
882
|
+
// TODO: Skipped for migration because:
|
|
883
|
+
// Accessor inputs cannot be migrated as they are too complex.
|
|
876
884
|
get disabled() {
|
|
877
885
|
return this._disabled || this.tree.disabled || this.tree.treeControl.isDisabled(this.data);
|
|
878
886
|
}
|
|
@@ -882,6 +890,8 @@ class KbqTreeOption extends KbqTreeNode {
|
|
|
882
890
|
this._disabled = newValue;
|
|
883
891
|
}
|
|
884
892
|
}
|
|
893
|
+
// TODO: Skipped for migration because:
|
|
894
|
+
// Accessor inputs cannot be migrated as they are too complex.
|
|
885
895
|
get showCheckbox() {
|
|
886
896
|
return this._showCheckbox !== undefined ? this._showCheckbox : this.tree.showCheckbox;
|
|
887
897
|
}
|
|
@@ -908,29 +918,39 @@ class KbqTreeOption extends KbqTreeNode {
|
|
|
908
918
|
return !this.toggleElement?.disabled && this.tree.treeControl.isExpandable(this.data);
|
|
909
919
|
}
|
|
910
920
|
get toggleElement() {
|
|
911
|
-
return this.toggleElementComponent || this.toggleElementDirective;
|
|
921
|
+
return this.toggleElementComponent() || this.toggleElementDirective();
|
|
912
922
|
}
|
|
913
923
|
get isToggleInDefaultPlace() {
|
|
914
|
-
return !!(this.toggleElementDirective || this.toggleElementComponent);
|
|
924
|
+
return !!(this.toggleElementDirective() || this.toggleElementComponent());
|
|
915
925
|
}
|
|
916
|
-
constructor(
|
|
917
|
-
|
|
918
|
-
|
|
919
|
-
this.
|
|
920
|
-
this.
|
|
926
|
+
constructor() {
|
|
927
|
+
const tree = inject(KBQ_TREE_OPTION_PARENT_COMPONENT);
|
|
928
|
+
super();
|
|
929
|
+
this.changeDetectorRef = inject(ChangeDetectorRef);
|
|
930
|
+
this.ngZone = inject(NgZone);
|
|
921
931
|
this.onFocus = new Subject();
|
|
922
932
|
this.onBlur = new Subject();
|
|
923
933
|
this.preventBlur = false;
|
|
924
|
-
this.
|
|
934
|
+
this.toggleElementDirective = contentChild(KbqTreeNodeToggleDirective, ...(ngDevMode ? [{ debugName: "toggleElementDirective" }] : []));
|
|
935
|
+
this.toggleElementComponent = contentChild(KbqTreeNodeToggleComponent, ...(ngDevMode ? [{ debugName: "toggleElementComponent" }] : []));
|
|
936
|
+
this.pseudoCheckbox = contentChild(KbqPseudoCheckbox, ...(ngDevMode ? [{ debugName: "pseudoCheckbox" }] : []));
|
|
937
|
+
this.actionButton = contentChild(KbqOptionActionComponent, ...(ngDevMode ? [{ debugName: "actionButton" }] : []));
|
|
938
|
+
this.checkboxThirdState = input(false, ...(ngDevMode ? [{ debugName: "checkboxThirdState" }] : []));
|
|
925
939
|
this._disabled = false;
|
|
926
|
-
|
|
927
|
-
|
|
940
|
+
/**
|
|
941
|
+
* Whether the option can be selected by user interaction (click, keyboard, select all).
|
|
942
|
+
* A non-selectable option remains focusable, navigable and expandable.
|
|
943
|
+
* Programmatic selection (`setSelected`, `select`, value accessor) is not affected.
|
|
944
|
+
* Options that are not rendered (e.g. collapsed) are not checked by "select all".
|
|
945
|
+
*/
|
|
946
|
+
this.selectable = input(true, ...(ngDevMode ? [{ debugName: "selectable", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
|
|
947
|
+
this.onSelectionChange = output();
|
|
928
948
|
this.userInteraction = new EventEmitter();
|
|
929
949
|
this._selected = false;
|
|
930
950
|
this._id = `kbq-tree-option-${uniqueIdCounter++}`;
|
|
931
951
|
this.hasFocus = false;
|
|
932
952
|
this.updateCheckboxState = () => {
|
|
933
|
-
if (this.checkboxThirdState && this.isExpandable) {
|
|
953
|
+
if (this.checkboxThirdState() && this.isExpandable) {
|
|
934
954
|
if (this.descendantsAllSelected()) {
|
|
935
955
|
this.checkboxState = 'checked';
|
|
936
956
|
}
|
|
@@ -946,6 +966,7 @@ class KbqTreeOption extends KbqTreeNode {
|
|
|
946
966
|
}
|
|
947
967
|
this.updateParentsCheckboxState(this.data);
|
|
948
968
|
};
|
|
969
|
+
this.tree = tree;
|
|
949
970
|
}
|
|
950
971
|
ngAfterContentInit() {
|
|
951
972
|
Promise.resolve().then(this.updateCheckboxState);
|
|
@@ -985,7 +1006,7 @@ class KbqTreeOption extends KbqTreeNode {
|
|
|
985
1006
|
this.markForCheck();
|
|
986
1007
|
}
|
|
987
1008
|
focus(focusOrigin) {
|
|
988
|
-
if (focusOrigin === 'program' || this.disabled || this.actionButton?.hasFocus)
|
|
1009
|
+
if (focusOrigin === 'program' || this.disabled || this.actionButton()?.hasFocus)
|
|
989
1010
|
return;
|
|
990
1011
|
this.elementRef.nativeElement.focus({ preventScroll: focusOrigin === 'mouse' });
|
|
991
1012
|
if (!this.hasFocus) {
|
|
@@ -1009,7 +1030,7 @@ class KbqTreeOption extends KbqTreeNode {
|
|
|
1009
1030
|
.pipe(take(1))
|
|
1010
1031
|
.subscribe(() => {
|
|
1011
1032
|
this.ngZone.run(() => {
|
|
1012
|
-
if (this.actionButton?.hasFocus || this.tree.optionShouldHoldFocusOnBlur) {
|
|
1033
|
+
if (this.actionButton()?.hasFocus || this.tree.optionShouldHoldFocusOnBlur) {
|
|
1013
1034
|
return;
|
|
1014
1035
|
}
|
|
1015
1036
|
this.hasFocus = false;
|
|
@@ -1019,11 +1040,7 @@ class KbqTreeOption extends KbqTreeNode {
|
|
|
1019
1040
|
}
|
|
1020
1041
|
/** @docs-private */
|
|
1021
1042
|
getHeight() {
|
|
1022
|
-
|
|
1023
|
-
// For SSR compatibility
|
|
1024
|
-
if (typeof element.getClientRects !== 'function')
|
|
1025
|
-
return 0;
|
|
1026
|
-
return element.getClientRects()[0]?.height ?? 0;
|
|
1043
|
+
return this.elementRef.nativeElement.getClientRects()[0]?.height ?? 0;
|
|
1027
1044
|
}
|
|
1028
1045
|
select(setFocus = true) {
|
|
1029
1046
|
if (this._selected) {
|
|
@@ -1047,16 +1064,17 @@ class KbqTreeOption extends KbqTreeNode {
|
|
|
1047
1064
|
this.emitSelectionChangeEvent();
|
|
1048
1065
|
}
|
|
1049
1066
|
onKeydown($event) {
|
|
1050
|
-
|
|
1067
|
+
const actionButton = this.actionButton();
|
|
1068
|
+
if (!actionButton) {
|
|
1051
1069
|
return;
|
|
1052
1070
|
}
|
|
1053
|
-
if ($event.keyCode === TAB && !$event.shiftKey && !
|
|
1054
|
-
|
|
1071
|
+
if ($event.keyCode === TAB && !$event.shiftKey && !actionButton.hasFocus) {
|
|
1072
|
+
actionButton.focus();
|
|
1055
1073
|
$event.preventDefault();
|
|
1056
1074
|
}
|
|
1057
1075
|
}
|
|
1058
1076
|
selectViaInteraction($event) {
|
|
1059
|
-
if (this.disabled || !this.selectable) {
|
|
1077
|
+
if (this.disabled || !this.selectable()) {
|
|
1060
1078
|
return;
|
|
1061
1079
|
}
|
|
1062
1080
|
this.markForCheck();
|
|
@@ -1084,25 +1102,29 @@ class KbqTreeOption extends KbqTreeNode {
|
|
|
1084
1102
|
return;
|
|
1085
1103
|
this.focus('mouse');
|
|
1086
1104
|
}
|
|
1087
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1088
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
1105
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: KbqTreeOption, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1106
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: KbqTreeOption, isStandalone: true, selector: "kbq-tree-option", inputs: { checkboxThirdState: { classPropertyName: "checkboxThirdState", publicName: "checkboxThirdState", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: null }, selectable: { classPropertyName: "selectable", publicName: "selectable", isSignal: true, isRequired: false, transformFunction: null }, showCheckbox: { classPropertyName: "showCheckbox", publicName: "showCheckbox", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { onSelectionChange: "onSelectionChange" }, host: { listeners: { "focusin": "focus()", "mouseenter": "onMouseenter()", "blur": "blur()", "click": "selectViaInteraction($event)", "keydown": "onKeydown($event)" }, properties: { "class.kbq-tree-option_multiple": "tree.multiple", "class.kbq-selected": "selected", "class.kbq-focused": "hasFocus", "class.kbq-disabled": "disabled", "class.kbq-action-button-focused": "actionButton()?.active", "attr.id": "id", "attr.tabindex": "-1", "attr.disabled": "disabled || null" }, classAttribute: "kbq-tree-option" }, providers: [
|
|
1089
1107
|
{ provide: KbqTreeNode, useExisting: KbqTreeOption },
|
|
1090
1108
|
{ provide: KBQ_TITLE_TEXT_REF, useExisting: KbqTreeOption },
|
|
1091
1109
|
{ provide: KBQ_OPTION_ACTION_PARENT, useExisting: KbqTreeOption }
|
|
1092
|
-
], queries: [{ propertyName: "toggleElementDirective", first: true, predicate: KbqTreeNodeToggleDirective, descendants: true }, { propertyName: "toggleElementComponent", first: true, predicate: KbqTreeNodeToggleComponent, descendants: true }, { propertyName: "pseudoCheckbox", first: true, predicate: KbqPseudoCheckbox, descendants: true }, { propertyName: "actionButton", first: true, predicate: KbqOptionActionComponent, descendants: true }, { propertyName: "tooltipTrigger", first: true, predicate: KbqTooltipTrigger, descendants: true }, { propertyName: "dropdownTrigger", first: true, predicate: KbqDropdownTrigger, descendants: true }], viewQueries: [{ propertyName: "parentTextElement", first: true, predicate: ["kbqTitleContainer"], descendants: true }], exportAs: ["kbqTreeOption"], usesInheritance: true, ngImport: i0, template: "<ng-content select=\"kbq-tree-node-toggle, [kbq-tree-node-toggle], [kbqTreeNodeToggle]\" />\n\n@if (externalPseudoCheckbox) {\n <ng-content select=\"kbq-pseudo-checkbox\" />\n} @else if (showCheckbox) {\n <kbq-pseudo-checkbox [disabled]=\"disabled\" [state]=\"checkboxState\" />\n}\n\n<ng-content select=\"kbq-checkbox\" />\n\n<ng-content select=\"[kbq-icon]\" />\n\n<ng-content select=\"kbq-progress-spinner\" />\n\n<span #kbqTitleContainer class=\"kbq-option-text\">\n <ng-content />\n</span>\n\n@if (actionButton) {\n <kbq-action-container>\n <ng-content select=\"kbq-option-action\" />\n </kbq-action-container>\n}\n", styles: ["@keyframes kbq-progress{0%{background-position:0 0}to{background-position:64px 0}}.kbq-progress{position:relative}.kbq-progress:after{content:\"\";position:absolute;border-radius:inherit;inset:0;background:linear-gradient(135deg,#0000000a 12px,#ffffff1a 12px 22px,#0000000a 22px 34px,#ffffff1a 34px) repeat;background-size:32px 32px;animation:kbq-progress 1s linear infinite}.kbq-group{display:flex;flex-direction:row}.kbq-group_justified>.kbq-group-item{width:100%}.kbq-group .kbq-group-item+.kbq-group-item{margin-left:calc(-1 * var(--kbq-size-border-width))}.kbq-group>.kbq-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-top-right-radius:0}.kbq-group>.kbq-group-item:last-child:not(:first-child){border-bottom-left-radius:0;border-top-left-radius:0}.kbq-group>.kbq-group-item:not(:first-child):not(:last-child){border-radius:0}.kbq-group>.kbq-group-item:first-child:not(:last-child) .kbq-form-field__container{border-bottom-right-radius:0;border-top-right-radius:0}.kbq-group>.kbq-group-item:last-child:not(:first-child) .kbq-form-field__container{border-bottom-left-radius:0;border-top-left-radius:0}.kbq-group>.kbq-group-item:not(:first-child):not(:last-child) .kbq-form-field__container{border-radius:0}.kbq-vertical-group{display:flex;flex-direction:column}.kbq-vertical-group>.kbq-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-bottom-left-radius:0;border-top-right-radius:var(--kbq-size-border-radius)}.kbq-vertical-group>.kbq-group-item:last-child:not(:first-child){border-top-right-radius:0;border-top-left-radius:0;border-bottom-left-radius:var(--kbq-size-border-radius)}.kbq-vertical-group>.kbq-group-item:not(:first-child):not(:last-child){border-radius:0}.kbq-vertical-group .kbq-group-item+.kbq-group-item{margin-top:calc(-1 * var(--kbq-size-border-width))}.kbq-vertical-group>.kbq-group-item:first-child:not(:last-child) .kbq-form-field__container{border-bottom-right-radius:0;border-bottom-left-radius:0}.kbq-vertical-group>.kbq-group-item:last-child:not(:first-child) .kbq-form-field__container{border-top-right-radius:0;border-top-left-radius:0}.kbq-vertical-group>.kbq-group-item:not(:first-child):not(:last-child) .kbq-form-field__container{border-radius:0}.kbq-truncate-line{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kbq-no-select{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.kbq-tree-option{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;position:relative;box-sizing:border-box;display:flex;align-items:center;min-height:32px;overflow-wrap:break-word;border-width:var(--kbq-tree-size-container-focus-outline-width);border-style:solid;border-color:transparent;border-radius:var(--kbq-tree-option-border-radius);padding-top:calc(var(--kbq-tree-size-container-padding-vertical) - var(--kbq-tree-size-container-focus-outline-width));padding-right:calc(var(--kbq-tree-size-container-padding-right) - var(--kbq-tree-size-container-focus-outline-width));padding-bottom:calc(var(--kbq-tree-size-container-padding-vertical) - var(--kbq-tree-size-container-focus-outline-width));gap:var(--kbq-tree-size-container-content-gap-horizontal)}.kbq-tree-option>*[kbqtreenodetoggle],.kbq-tree-option>.kbq-tree-node-toggle,.kbq-tree-option>.kbq-pseudo-checkbox{margin-top:var(--kbq-size-3xs);align-self:flex-start}.kbq-tree-option .kbq-option-text>*{margin:0;padding:0;font-weight:400;font-size:inherit}.kbq-tree-option .kbq-option-text{display:flex;flex-direction:column;width:100%;box-sizing:content-box;overflow:hidden}.kbq-tree-option .kbq-option-text:empty{display:none}.kbq-tree-option .kbq-option-text{display:inline-block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-top:var(--kbq-list-size-text-padding-vertical, 0);padding-bottom:var(--kbq-list-size-text-padding-vertical, 0)}.kbq-tree-option:focus{outline:none}.kbq-tree-option.kbq-disabled .kbq-icon{cursor:default}.kbq-tree-option:not(.kbq-disabled){cursor:pointer}.kbq-tree-option:not(.kbq-disabled):hover .kbq-action-container,.kbq-tree-option:not(.kbq-disabled).kbq-hovered .kbq-action-container,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused .kbq-action-container{display:flex}.kbq-tree-option:is(.kbq-checked,.kbq-selected,.kbq-focused):has(+:is(.kbq-checked,.kbq-selected,.kbq-focused)){border-bottom-left-radius:0;border-bottom-right-radius:0}.kbq-tree-option:is(.kbq-checked,.kbq-selected,.kbq-focused)+:is(.kbq-checked,.kbq-selected,.kbq-focused){border-top-left-radius:0;border-top-right-radius:0}\n", ".kbq-tree,.kbq-tree-selection{--kbq-tree-size-indent-level: var(--kbq-size-xxl);--kbq-tree-size-container-padding-right: var(--kbq-size-s);--kbq-tree-size-container-padding-vertical: var(--kbq-size-xxs);--kbq-tree-size-container-content-gap-horizontal: var(--kbq-size-s);--kbq-tree-size-container-content-gap-vertical: 0px;--kbq-tree-size-container-focus-outline-width: var(--kbq-size-3xs);--kbq-tree-size-text-padding-vertical: var(--kbq-size-3xs);--kbq-tree-option-border-radius: var(--kbq-size-border-radius);--kbq-tree-default-container-background: transparent;--kbq-tree-default-text-color: var(--kbq-foreground-contrast);--kbq-tree-default-icon-color: var(--kbq-icon-contrast);--kbq-tree-default-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-default-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-default-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-hover-container-background: var(--kbq-states-background-transparent-hover);--kbq-tree-states-active-container-background: var(--kbq-states-background-transparent-active);--kbq-tree-states-hover-text-color: var(--kbq-foreground-contrast);--kbq-tree-states-hover-icon-color: var(--kbq-icon-contrast);--kbq-tree-states-hover-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-hover-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-hover-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-focused-focus-outline-color: var(--kbq-states-line-focus-theme);--kbq-tree-states-selected-container-background: var(--kbq-background-theme-less);--kbq-tree-multiple-states-selected-container-background: var(--kbq-background-contrast-less);--kbq-tree-states-selected-text-color: var(--kbq-foreground-contrast);--kbq-tree-states-selected-icon-color: var(--kbq-icon-contrast);--kbq-tree-states-selected-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-selected-hover-container-background: var(--kbq-states-background-theme-less-hover);--kbq-tree-states-selected-active-container-background: var(--kbq-states-background-theme-less-active);--kbq-tree-multiple-states-selected-hover-container-background: var(--kbq-states-background-contrast-less-hover);--kbq-tree-multiple-states-selected-active-container-background: var(--kbq-states-background-contrast-less-active);--kbq-tree-states-selected-hover-text-color: var(--kbq-foreground-contrast);--kbq-tree-states-selected-hover-icon-color: var(--kbq-icon-contrast);--kbq-tree-states-selected-hover-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-hover-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-hover-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-disabled-container-background: transparent;--kbq-tree-states-disabled-text-color: var(--kbq-states-foreground-disabled);--kbq-tree-states-disabled-icon-color: var(--kbq-states-icon-disabled);--kbq-tree-states-disabled-tree-toggle-color: var(--kbq-states-icon-disabled);--kbq-tree-states-disabled-action-button-color: var(--kbq-states-icon-disabled);--kbq-tree-states-disabled-caption-color: var(--kbq-states-foreground-disabled)}\n"], dependencies: [{ kind: "component", type: KbqPseudoCheckbox, selector: "kbq-pseudo-checkbox", inputs: ["big", "state", "disabled"] }, { kind: "component", type: KbqActionContainer, selector: "kbq-action-container", exportAs: ["kbqActionContainer"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
1110
|
+
], queries: [{ propertyName: "toggleElementDirective", first: true, predicate: KbqTreeNodeToggleDirective, descendants: true, isSignal: true }, { propertyName: "toggleElementComponent", first: true, predicate: KbqTreeNodeToggleComponent, descendants: true, isSignal: true }, { propertyName: "pseudoCheckbox", first: true, predicate: KbqPseudoCheckbox, descendants: true, isSignal: true }, { propertyName: "actionButton", first: true, predicate: KbqOptionActionComponent, descendants: true, isSignal: true }, { propertyName: "tooltipTrigger", first: true, predicate: KbqTooltipTrigger, descendants: true }, { propertyName: "dropdownTrigger", first: true, predicate: KbqDropdownTrigger, descendants: true }], viewQueries: [{ propertyName: "parentTextElement", first: true, predicate: ["kbqTitleContainer"], descendants: true }], exportAs: ["kbqTreeOption"], usesInheritance: true, ngImport: i0, template: "<ng-content select=\"kbq-tree-node-toggle, [kbq-tree-node-toggle], [kbqTreeNodeToggle]\" />\n\n@if (externalPseudoCheckbox) {\n <ng-content select=\"kbq-pseudo-checkbox\" />\n} @else if (showCheckbox) {\n <kbq-pseudo-checkbox [disabled]=\"disabled\" [state]=\"checkboxState\" />\n}\n\n<ng-content select=\"kbq-checkbox\" />\n\n<ng-content select=\"[kbq-icon]\" />\n\n<ng-content select=\"kbq-progress-spinner\" />\n\n<span #kbqTitleContainer class=\"kbq-option-text\">\n <ng-content />\n</span>\n\n@if (actionButton()) {\n <kbq-action-container>\n <ng-content select=\"kbq-option-action\" />\n </kbq-action-container>\n}\n", styles: ["@keyframes kbq-progress{0%{background-position:0 0}to{background-position:64px 0}}.kbq-progress{position:relative}.kbq-progress:after{content:\"\";position:absolute;border-radius:inherit;inset:0;background:linear-gradient(135deg,#0000000a 12px,#ffffff1a 12px 22px,#0000000a 22px 34px,#ffffff1a 34px) repeat;background-size:32px 32px;animation:kbq-progress 1s linear infinite}@media(prefers-reduced-motion:reduce){.kbq-progress:after{animation:none}}.kbq-group{display:flex;flex-direction:row}.kbq-group_justified>.kbq-group-item{width:100%}.kbq-group .kbq-group-item+.kbq-group-item{margin-left:calc(-1 * var(--kbq-size-border-width))}.kbq-group>.kbq-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-top-right-radius:0}.kbq-group>.kbq-group-item:last-child:not(:first-child){border-bottom-left-radius:0;border-top-left-radius:0}.kbq-group>.kbq-group-item:not(:first-child):not(:last-child){border-radius:0}.kbq-group>.kbq-group-item:first-child:not(:last-child) .kbq-form-field__container{border-bottom-right-radius:0;border-top-right-radius:0}.kbq-group>.kbq-group-item:last-child:not(:first-child) .kbq-form-field__container{border-bottom-left-radius:0;border-top-left-radius:0}.kbq-group>.kbq-group-item:not(:first-child):not(:last-child) .kbq-form-field__container{border-radius:0}.kbq-vertical-group{display:flex;flex-direction:column}.kbq-vertical-group>.kbq-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-bottom-left-radius:0;border-top-right-radius:var(--kbq-size-border-radius)}.kbq-vertical-group>.kbq-group-item:last-child:not(:first-child){border-top-right-radius:0;border-top-left-radius:0;border-bottom-left-radius:var(--kbq-size-border-radius)}.kbq-vertical-group>.kbq-group-item:not(:first-child):not(:last-child){border-radius:0}.kbq-vertical-group .kbq-group-item+.kbq-group-item{margin-top:calc(-1 * var(--kbq-size-border-width))}.kbq-vertical-group>.kbq-group-item:first-child:not(:last-child) .kbq-form-field__container{border-bottom-right-radius:0;border-bottom-left-radius:0}.kbq-vertical-group>.kbq-group-item:last-child:not(:first-child) .kbq-form-field__container{border-top-right-radius:0;border-top-left-radius:0}.kbq-vertical-group>.kbq-group-item:not(:first-child):not(:last-child) .kbq-form-field__container{border-radius:0}.kbq-truncate-line{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kbq-no-select{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.kbq-tree-option{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;position:relative;box-sizing:border-box;display:flex;align-items:center;min-height:32px;overflow-wrap:break-word;border-width:var(--kbq-tree-size-container-focus-outline-width);border-style:solid;border-color:transparent;border-radius:var(--kbq-tree-option-border-radius);padding-top:calc(var(--kbq-tree-size-container-padding-vertical) - var(--kbq-tree-size-container-focus-outline-width));padding-right:calc(var(--kbq-tree-size-container-padding-right) - var(--kbq-tree-size-container-focus-outline-width));padding-bottom:calc(var(--kbq-tree-size-container-padding-vertical) - var(--kbq-tree-size-container-focus-outline-width));gap:var(--kbq-tree-size-container-content-gap-horizontal)}.kbq-tree-option .kbq-option-text>*{margin:0;padding:0;font-weight:400;font-size:inherit}.kbq-tree-option .kbq-option-text{display:flex;flex-direction:column;width:100%;box-sizing:content-box;overflow:hidden}.kbq-tree-option .kbq-option-text:empty{display:none}.kbq-tree-option .kbq-option-text{display:inline-block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-top:var(--kbq-list-size-text-padding-vertical, 0);padding-bottom:var(--kbq-list-size-text-padding-vertical, 0)}.kbq-tree-option:has(.kbq-option-caption)>[kbq-tree-node-toggle],.kbq-tree-option:has(.kbq-option-caption)>[kbqTreeNodeToggle],.kbq-tree-option:has(.kbq-option-caption)>.kbq-tree-node-toggle,.kbq-tree-option:has(.kbq-option-caption)>.kbq-pseudo-checkbox,.kbq-tree-option:has(.kbq-option-caption)>kbq-checkbox,.kbq-tree-option:has(.kbq-option-caption)>[kbq-icon],.kbq-tree-option:has(.kbq-option-caption)>kbq-progress-spinner{align-self:flex-start;margin-top:var(--kbq-size-3xs)}.kbq-tree-option:has(.kbq-option-caption)>.kbq-tree-node-toggle{height:var(--kbq-typography-text-normal-line-height);margin-top:0}.kbq-tree-option:focus{outline:none}.kbq-tree-option:not(.kbq-disabled){cursor:pointer}.kbq-tree-option:not(.kbq-disabled):hover .kbq-action-container,.kbq-tree-option:not(.kbq-disabled).kbq-hovered .kbq-action-container,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused .kbq-action-container{display:flex}.kbq-tree-option:is(.kbq-checked,.kbq-selected,.kbq-focused):has(+:is(.kbq-checked,.kbq-selected,.kbq-focused)){border-bottom-left-radius:0;border-bottom-right-radius:0}.kbq-tree-option:is(.kbq-checked,.kbq-selected,.kbq-focused)+:is(.kbq-checked,.kbq-selected,.kbq-focused){border-top-left-radius:0;border-top-right-radius:0}\n", ".kbq-tree,.kbq-tree-selection{--kbq-tree-size-indent-level: var(--kbq-size-xxl);--kbq-tree-size-container-padding-right: var(--kbq-size-s);--kbq-tree-size-container-padding-vertical: var(--kbq-size-xxs);--kbq-tree-size-container-content-gap-horizontal: var(--kbq-size-s);--kbq-tree-size-container-content-gap-vertical: 0px;--kbq-tree-size-container-focus-outline-width: var(--kbq-size-3xs);--kbq-tree-size-text-padding-vertical: var(--kbq-size-3xs);--kbq-tree-option-border-radius: var(--kbq-size-border-radius);--kbq-tree-default-container-background: transparent;--kbq-tree-default-text-color: var(--kbq-foreground-contrast);--kbq-tree-default-icon-color: var(--kbq-icon-contrast);--kbq-tree-default-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-default-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-default-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-hover-container-background: var(--kbq-states-background-transparent-hover);--kbq-tree-states-active-container-background: var(--kbq-states-background-transparent-active);--kbq-tree-states-hover-text-color: var(--kbq-foreground-contrast);--kbq-tree-states-hover-icon-color: var(--kbq-icon-contrast);--kbq-tree-states-hover-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-hover-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-hover-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-focused-focus-outline-color: var(--kbq-states-line-focus-theme);--kbq-tree-states-selected-container-background: var(--kbq-background-theme-less);--kbq-tree-multiple-states-selected-container-background: var(--kbq-background-contrast-less);--kbq-tree-states-selected-text-color: var(--kbq-foreground-contrast);--kbq-tree-states-selected-icon-color: var(--kbq-icon-contrast);--kbq-tree-states-selected-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-selected-hover-container-background: var(--kbq-states-background-theme-less-hover);--kbq-tree-states-selected-active-container-background: var(--kbq-states-background-theme-less-active);--kbq-tree-multiple-states-selected-hover-container-background: var(--kbq-states-background-contrast-less-hover);--kbq-tree-multiple-states-selected-active-container-background: var(--kbq-states-background-contrast-less-active);--kbq-tree-states-selected-hover-text-color: var(--kbq-foreground-contrast);--kbq-tree-states-selected-hover-icon-color: var(--kbq-icon-contrast);--kbq-tree-states-selected-hover-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-hover-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-hover-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-disabled-container-background: transparent;--kbq-tree-states-disabled-text-color: var(--kbq-states-foreground-disabled);--kbq-tree-states-disabled-icon-color: var(--kbq-states-icon-disabled);--kbq-tree-states-disabled-tree-toggle-color: var(--kbq-states-icon-disabled);--kbq-tree-states-disabled-action-button-color: var(--kbq-states-icon-disabled);--kbq-tree-states-disabled-caption-color: var(--kbq-states-foreground-disabled)}\n"], dependencies: [{ kind: "component", type: KbqPseudoCheckbox, selector: "kbq-pseudo-checkbox", inputs: ["big", "state", "disabled"] }, { kind: "component", type: KbqActionContainer, selector: "kbq-action-container", exportAs: ["kbqActionContainer"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
1093
1111
|
}
|
|
1094
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1112
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: KbqTreeOption, decorators: [{
|
|
1095
1113
|
type: Component,
|
|
1096
1114
|
args: [{ selector: 'kbq-tree-option', imports: [
|
|
1097
1115
|
KbqPseudoCheckbox,
|
|
1098
1116
|
KbqActionContainer
|
|
1099
|
-
],
|
|
1117
|
+
], providers: [
|
|
1118
|
+
{ provide: KbqTreeNode, useExisting: KbqTreeOption },
|
|
1119
|
+
{ provide: KBQ_TITLE_TEXT_REF, useExisting: KbqTreeOption },
|
|
1120
|
+
{ provide: KBQ_OPTION_ACTION_PARENT, useExisting: KbqTreeOption }
|
|
1121
|
+
], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
|
|
1100
1122
|
class: 'kbq-tree-option',
|
|
1101
1123
|
'[class.kbq-tree-option_multiple]': 'tree.multiple',
|
|
1102
1124
|
'[class.kbq-selected]': 'selected',
|
|
1103
1125
|
'[class.kbq-focused]': 'hasFocus',
|
|
1104
1126
|
'[class.kbq-disabled]': 'disabled',
|
|
1105
|
-
'[class.kbq-action-button-focused]': 'actionButton?.active',
|
|
1127
|
+
'[class.kbq-action-button-focused]': 'actionButton()?.active',
|
|
1106
1128
|
'[attr.id]': 'id',
|
|
1107
1129
|
'[attr.tabindex]': '-1',
|
|
1108
1130
|
'[attr.disabled]': 'disabled || null',
|
|
@@ -1111,47 +1133,21 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.21", ngImpo
|
|
|
1111
1133
|
'(blur)': 'blur()',
|
|
1112
1134
|
'(click)': 'selectViaInteraction($event)',
|
|
1113
1135
|
'(keydown)': 'onKeydown($event)'
|
|
1114
|
-
},
|
|
1115
|
-
|
|
1116
|
-
{ provide: KBQ_TITLE_TEXT_REF, useExisting: KbqTreeOption },
|
|
1117
|
-
{ provide: KBQ_OPTION_ACTION_PARENT, useExisting: KbqTreeOption }
|
|
1118
|
-
], template: "<ng-content select=\"kbq-tree-node-toggle, [kbq-tree-node-toggle], [kbqTreeNodeToggle]\" />\n\n@if (externalPseudoCheckbox) {\n <ng-content select=\"kbq-pseudo-checkbox\" />\n} @else if (showCheckbox) {\n <kbq-pseudo-checkbox [disabled]=\"disabled\" [state]=\"checkboxState\" />\n}\n\n<ng-content select=\"kbq-checkbox\" />\n\n<ng-content select=\"[kbq-icon]\" />\n\n<ng-content select=\"kbq-progress-spinner\" />\n\n<span #kbqTitleContainer class=\"kbq-option-text\">\n <ng-content />\n</span>\n\n@if (actionButton) {\n <kbq-action-container>\n <ng-content select=\"kbq-option-action\" />\n </kbq-action-container>\n}\n", styles: ["@keyframes kbq-progress{0%{background-position:0 0}to{background-position:64px 0}}.kbq-progress{position:relative}.kbq-progress:after{content:\"\";position:absolute;border-radius:inherit;inset:0;background:linear-gradient(135deg,#0000000a 12px,#ffffff1a 12px 22px,#0000000a 22px 34px,#ffffff1a 34px) repeat;background-size:32px 32px;animation:kbq-progress 1s linear infinite}.kbq-group{display:flex;flex-direction:row}.kbq-group_justified>.kbq-group-item{width:100%}.kbq-group .kbq-group-item+.kbq-group-item{margin-left:calc(-1 * var(--kbq-size-border-width))}.kbq-group>.kbq-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-top-right-radius:0}.kbq-group>.kbq-group-item:last-child:not(:first-child){border-bottom-left-radius:0;border-top-left-radius:0}.kbq-group>.kbq-group-item:not(:first-child):not(:last-child){border-radius:0}.kbq-group>.kbq-group-item:first-child:not(:last-child) .kbq-form-field__container{border-bottom-right-radius:0;border-top-right-radius:0}.kbq-group>.kbq-group-item:last-child:not(:first-child) .kbq-form-field__container{border-bottom-left-radius:0;border-top-left-radius:0}.kbq-group>.kbq-group-item:not(:first-child):not(:last-child) .kbq-form-field__container{border-radius:0}.kbq-vertical-group{display:flex;flex-direction:column}.kbq-vertical-group>.kbq-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-bottom-left-radius:0;border-top-right-radius:var(--kbq-size-border-radius)}.kbq-vertical-group>.kbq-group-item:last-child:not(:first-child){border-top-right-radius:0;border-top-left-radius:0;border-bottom-left-radius:var(--kbq-size-border-radius)}.kbq-vertical-group>.kbq-group-item:not(:first-child):not(:last-child){border-radius:0}.kbq-vertical-group .kbq-group-item+.kbq-group-item{margin-top:calc(-1 * var(--kbq-size-border-width))}.kbq-vertical-group>.kbq-group-item:first-child:not(:last-child) .kbq-form-field__container{border-bottom-right-radius:0;border-bottom-left-radius:0}.kbq-vertical-group>.kbq-group-item:last-child:not(:first-child) .kbq-form-field__container{border-top-right-radius:0;border-top-left-radius:0}.kbq-vertical-group>.kbq-group-item:not(:first-child):not(:last-child) .kbq-form-field__container{border-radius:0}.kbq-truncate-line{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kbq-no-select{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.kbq-tree-option{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;position:relative;box-sizing:border-box;display:flex;align-items:center;min-height:32px;overflow-wrap:break-word;border-width:var(--kbq-tree-size-container-focus-outline-width);border-style:solid;border-color:transparent;border-radius:var(--kbq-tree-option-border-radius);padding-top:calc(var(--kbq-tree-size-container-padding-vertical) - var(--kbq-tree-size-container-focus-outline-width));padding-right:calc(var(--kbq-tree-size-container-padding-right) - var(--kbq-tree-size-container-focus-outline-width));padding-bottom:calc(var(--kbq-tree-size-container-padding-vertical) - var(--kbq-tree-size-container-focus-outline-width));gap:var(--kbq-tree-size-container-content-gap-horizontal)}.kbq-tree-option>*[kbqtreenodetoggle],.kbq-tree-option>.kbq-tree-node-toggle,.kbq-tree-option>.kbq-pseudo-checkbox{margin-top:var(--kbq-size-3xs);align-self:flex-start}.kbq-tree-option .kbq-option-text>*{margin:0;padding:0;font-weight:400;font-size:inherit}.kbq-tree-option .kbq-option-text{display:flex;flex-direction:column;width:100%;box-sizing:content-box;overflow:hidden}.kbq-tree-option .kbq-option-text:empty{display:none}.kbq-tree-option .kbq-option-text{display:inline-block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-top:var(--kbq-list-size-text-padding-vertical, 0);padding-bottom:var(--kbq-list-size-text-padding-vertical, 0)}.kbq-tree-option:focus{outline:none}.kbq-tree-option.kbq-disabled .kbq-icon{cursor:default}.kbq-tree-option:not(.kbq-disabled){cursor:pointer}.kbq-tree-option:not(.kbq-disabled):hover .kbq-action-container,.kbq-tree-option:not(.kbq-disabled).kbq-hovered .kbq-action-container,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused .kbq-action-container{display:flex}.kbq-tree-option:is(.kbq-checked,.kbq-selected,.kbq-focused):has(+:is(.kbq-checked,.kbq-selected,.kbq-focused)){border-bottom-left-radius:0;border-bottom-right-radius:0}.kbq-tree-option:is(.kbq-checked,.kbq-selected,.kbq-focused)+:is(.kbq-checked,.kbq-selected,.kbq-focused){border-top-left-radius:0;border-top-right-radius:0}\n", ".kbq-tree,.kbq-tree-selection{--kbq-tree-size-indent-level: var(--kbq-size-xxl);--kbq-tree-size-container-padding-right: var(--kbq-size-s);--kbq-tree-size-container-padding-vertical: var(--kbq-size-xxs);--kbq-tree-size-container-content-gap-horizontal: var(--kbq-size-s);--kbq-tree-size-container-content-gap-vertical: 0px;--kbq-tree-size-container-focus-outline-width: var(--kbq-size-3xs);--kbq-tree-size-text-padding-vertical: var(--kbq-size-3xs);--kbq-tree-option-border-radius: var(--kbq-size-border-radius);--kbq-tree-default-container-background: transparent;--kbq-tree-default-text-color: var(--kbq-foreground-contrast);--kbq-tree-default-icon-color: var(--kbq-icon-contrast);--kbq-tree-default-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-default-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-default-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-hover-container-background: var(--kbq-states-background-transparent-hover);--kbq-tree-states-active-container-background: var(--kbq-states-background-transparent-active);--kbq-tree-states-hover-text-color: var(--kbq-foreground-contrast);--kbq-tree-states-hover-icon-color: var(--kbq-icon-contrast);--kbq-tree-states-hover-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-hover-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-hover-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-focused-focus-outline-color: var(--kbq-states-line-focus-theme);--kbq-tree-states-selected-container-background: var(--kbq-background-theme-less);--kbq-tree-multiple-states-selected-container-background: var(--kbq-background-contrast-less);--kbq-tree-states-selected-text-color: var(--kbq-foreground-contrast);--kbq-tree-states-selected-icon-color: var(--kbq-icon-contrast);--kbq-tree-states-selected-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-selected-hover-container-background: var(--kbq-states-background-theme-less-hover);--kbq-tree-states-selected-active-container-background: var(--kbq-states-background-theme-less-active);--kbq-tree-multiple-states-selected-hover-container-background: var(--kbq-states-background-contrast-less-hover);--kbq-tree-multiple-states-selected-active-container-background: var(--kbq-states-background-contrast-less-active);--kbq-tree-states-selected-hover-text-color: var(--kbq-foreground-contrast);--kbq-tree-states-selected-hover-icon-color: var(--kbq-icon-contrast);--kbq-tree-states-selected-hover-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-hover-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-hover-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-disabled-container-background: transparent;--kbq-tree-states-disabled-text-color: var(--kbq-states-foreground-disabled);--kbq-tree-states-disabled-icon-color: var(--kbq-states-icon-disabled);--kbq-tree-states-disabled-tree-toggle-color: var(--kbq-states-icon-disabled);--kbq-tree-states-disabled-action-button-color: var(--kbq-states-icon-disabled);--kbq-tree-states-disabled-caption-color: var(--kbq-states-foreground-disabled)}\n"] }]
|
|
1119
|
-
}], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i0.NgZone }, { type: undefined, decorators: [{
|
|
1120
|
-
type: Inject,
|
|
1121
|
-
args: [KBQ_TREE_OPTION_PARENT_COMPONENT]
|
|
1122
|
-
}] }], propDecorators: { parentTextElement: [{
|
|
1136
|
+
}, exportAs: 'kbqTreeOption', template: "<ng-content select=\"kbq-tree-node-toggle, [kbq-tree-node-toggle], [kbqTreeNodeToggle]\" />\n\n@if (externalPseudoCheckbox) {\n <ng-content select=\"kbq-pseudo-checkbox\" />\n} @else if (showCheckbox) {\n <kbq-pseudo-checkbox [disabled]=\"disabled\" [state]=\"checkboxState\" />\n}\n\n<ng-content select=\"kbq-checkbox\" />\n\n<ng-content select=\"[kbq-icon]\" />\n\n<ng-content select=\"kbq-progress-spinner\" />\n\n<span #kbqTitleContainer class=\"kbq-option-text\">\n <ng-content />\n</span>\n\n@if (actionButton()) {\n <kbq-action-container>\n <ng-content select=\"kbq-option-action\" />\n </kbq-action-container>\n}\n", styles: ["@keyframes kbq-progress{0%{background-position:0 0}to{background-position:64px 0}}.kbq-progress{position:relative}.kbq-progress:after{content:\"\";position:absolute;border-radius:inherit;inset:0;background:linear-gradient(135deg,#0000000a 12px,#ffffff1a 12px 22px,#0000000a 22px 34px,#ffffff1a 34px) repeat;background-size:32px 32px;animation:kbq-progress 1s linear infinite}@media(prefers-reduced-motion:reduce){.kbq-progress:after{animation:none}}.kbq-group{display:flex;flex-direction:row}.kbq-group_justified>.kbq-group-item{width:100%}.kbq-group .kbq-group-item+.kbq-group-item{margin-left:calc(-1 * var(--kbq-size-border-width))}.kbq-group>.kbq-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-top-right-radius:0}.kbq-group>.kbq-group-item:last-child:not(:first-child){border-bottom-left-radius:0;border-top-left-radius:0}.kbq-group>.kbq-group-item:not(:first-child):not(:last-child){border-radius:0}.kbq-group>.kbq-group-item:first-child:not(:last-child) .kbq-form-field__container{border-bottom-right-radius:0;border-top-right-radius:0}.kbq-group>.kbq-group-item:last-child:not(:first-child) .kbq-form-field__container{border-bottom-left-radius:0;border-top-left-radius:0}.kbq-group>.kbq-group-item:not(:first-child):not(:last-child) .kbq-form-field__container{border-radius:0}.kbq-vertical-group{display:flex;flex-direction:column}.kbq-vertical-group>.kbq-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-bottom-left-radius:0;border-top-right-radius:var(--kbq-size-border-radius)}.kbq-vertical-group>.kbq-group-item:last-child:not(:first-child){border-top-right-radius:0;border-top-left-radius:0;border-bottom-left-radius:var(--kbq-size-border-radius)}.kbq-vertical-group>.kbq-group-item:not(:first-child):not(:last-child){border-radius:0}.kbq-vertical-group .kbq-group-item+.kbq-group-item{margin-top:calc(-1 * var(--kbq-size-border-width))}.kbq-vertical-group>.kbq-group-item:first-child:not(:last-child) .kbq-form-field__container{border-bottom-right-radius:0;border-bottom-left-radius:0}.kbq-vertical-group>.kbq-group-item:last-child:not(:first-child) .kbq-form-field__container{border-top-right-radius:0;border-top-left-radius:0}.kbq-vertical-group>.kbq-group-item:not(:first-child):not(:last-child) .kbq-form-field__container{border-radius:0}.kbq-truncate-line{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kbq-no-select{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.kbq-tree-option{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;position:relative;box-sizing:border-box;display:flex;align-items:center;min-height:32px;overflow-wrap:break-word;border-width:var(--kbq-tree-size-container-focus-outline-width);border-style:solid;border-color:transparent;border-radius:var(--kbq-tree-option-border-radius);padding-top:calc(var(--kbq-tree-size-container-padding-vertical) - var(--kbq-tree-size-container-focus-outline-width));padding-right:calc(var(--kbq-tree-size-container-padding-right) - var(--kbq-tree-size-container-focus-outline-width));padding-bottom:calc(var(--kbq-tree-size-container-padding-vertical) - var(--kbq-tree-size-container-focus-outline-width));gap:var(--kbq-tree-size-container-content-gap-horizontal)}.kbq-tree-option .kbq-option-text>*{margin:0;padding:0;font-weight:400;font-size:inherit}.kbq-tree-option .kbq-option-text{display:flex;flex-direction:column;width:100%;box-sizing:content-box;overflow:hidden}.kbq-tree-option .kbq-option-text:empty{display:none}.kbq-tree-option .kbq-option-text{display:inline-block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-top:var(--kbq-list-size-text-padding-vertical, 0);padding-bottom:var(--kbq-list-size-text-padding-vertical, 0)}.kbq-tree-option:has(.kbq-option-caption)>[kbq-tree-node-toggle],.kbq-tree-option:has(.kbq-option-caption)>[kbqTreeNodeToggle],.kbq-tree-option:has(.kbq-option-caption)>.kbq-tree-node-toggle,.kbq-tree-option:has(.kbq-option-caption)>.kbq-pseudo-checkbox,.kbq-tree-option:has(.kbq-option-caption)>kbq-checkbox,.kbq-tree-option:has(.kbq-option-caption)>[kbq-icon],.kbq-tree-option:has(.kbq-option-caption)>kbq-progress-spinner{align-self:flex-start;margin-top:var(--kbq-size-3xs)}.kbq-tree-option:has(.kbq-option-caption)>.kbq-tree-node-toggle{height:var(--kbq-typography-text-normal-line-height);margin-top:0}.kbq-tree-option:focus{outline:none}.kbq-tree-option:not(.kbq-disabled){cursor:pointer}.kbq-tree-option:not(.kbq-disabled):hover .kbq-action-container,.kbq-tree-option:not(.kbq-disabled).kbq-hovered .kbq-action-container,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused .kbq-action-container{display:flex}.kbq-tree-option:is(.kbq-checked,.kbq-selected,.kbq-focused):has(+:is(.kbq-checked,.kbq-selected,.kbq-focused)){border-bottom-left-radius:0;border-bottom-right-radius:0}.kbq-tree-option:is(.kbq-checked,.kbq-selected,.kbq-focused)+:is(.kbq-checked,.kbq-selected,.kbq-focused){border-top-left-radius:0;border-top-right-radius:0}\n", ".kbq-tree,.kbq-tree-selection{--kbq-tree-size-indent-level: var(--kbq-size-xxl);--kbq-tree-size-container-padding-right: var(--kbq-size-s);--kbq-tree-size-container-padding-vertical: var(--kbq-size-xxs);--kbq-tree-size-container-content-gap-horizontal: var(--kbq-size-s);--kbq-tree-size-container-content-gap-vertical: 0px;--kbq-tree-size-container-focus-outline-width: var(--kbq-size-3xs);--kbq-tree-size-text-padding-vertical: var(--kbq-size-3xs);--kbq-tree-option-border-radius: var(--kbq-size-border-radius);--kbq-tree-default-container-background: transparent;--kbq-tree-default-text-color: var(--kbq-foreground-contrast);--kbq-tree-default-icon-color: var(--kbq-icon-contrast);--kbq-tree-default-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-default-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-default-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-hover-container-background: var(--kbq-states-background-transparent-hover);--kbq-tree-states-active-container-background: var(--kbq-states-background-transparent-active);--kbq-tree-states-hover-text-color: var(--kbq-foreground-contrast);--kbq-tree-states-hover-icon-color: var(--kbq-icon-contrast);--kbq-tree-states-hover-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-hover-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-hover-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-focused-focus-outline-color: var(--kbq-states-line-focus-theme);--kbq-tree-states-selected-container-background: var(--kbq-background-theme-less);--kbq-tree-multiple-states-selected-container-background: var(--kbq-background-contrast-less);--kbq-tree-states-selected-text-color: var(--kbq-foreground-contrast);--kbq-tree-states-selected-icon-color: var(--kbq-icon-contrast);--kbq-tree-states-selected-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-selected-hover-container-background: var(--kbq-states-background-theme-less-hover);--kbq-tree-states-selected-active-container-background: var(--kbq-states-background-theme-less-active);--kbq-tree-multiple-states-selected-hover-container-background: var(--kbq-states-background-contrast-less-hover);--kbq-tree-multiple-states-selected-active-container-background: var(--kbq-states-background-contrast-less-active);--kbq-tree-states-selected-hover-text-color: var(--kbq-foreground-contrast);--kbq-tree-states-selected-hover-icon-color: var(--kbq-icon-contrast);--kbq-tree-states-selected-hover-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-hover-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-hover-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-disabled-container-background: transparent;--kbq-tree-states-disabled-text-color: var(--kbq-states-foreground-disabled);--kbq-tree-states-disabled-icon-color: var(--kbq-states-icon-disabled);--kbq-tree-states-disabled-tree-toggle-color: var(--kbq-states-icon-disabled);--kbq-tree-states-disabled-action-button-color: var(--kbq-states-icon-disabled);--kbq-tree-states-disabled-caption-color: var(--kbq-states-foreground-disabled)}\n"] }]
|
|
1137
|
+
}], ctorParameters: () => [], propDecorators: { parentTextElement: [{
|
|
1123
1138
|
type: ViewChild,
|
|
1124
1139
|
args: ['kbqTitleContainer']
|
|
1125
|
-
}], toggleElementDirective: [{
|
|
1126
|
-
type: ContentChild,
|
|
1127
|
-
args: [KbqTreeNodeToggleDirective]
|
|
1128
|
-
}], toggleElementComponent: [{
|
|
1129
|
-
type: ContentChild,
|
|
1130
|
-
args: [KbqTreeNodeToggleComponent]
|
|
1131
|
-
}], pseudoCheckbox: [{
|
|
1132
|
-
type: ContentChild,
|
|
1133
|
-
args: [KbqPseudoCheckbox]
|
|
1134
|
-
}], actionButton: [{
|
|
1135
|
-
type: ContentChild,
|
|
1136
|
-
args: [KbqOptionActionComponent]
|
|
1137
|
-
}], tooltipTrigger: [{
|
|
1140
|
+
}], toggleElementDirective: [{ type: i0.ContentChild, args: [i0.forwardRef(() => KbqTreeNodeToggleDirective), { isSignal: true }] }], toggleElementComponent: [{ type: i0.ContentChild, args: [i0.forwardRef(() => KbqTreeNodeToggleComponent), { isSignal: true }] }], pseudoCheckbox: [{ type: i0.ContentChild, args: [i0.forwardRef(() => KbqPseudoCheckbox), { isSignal: true }] }], actionButton: [{ type: i0.ContentChild, args: [i0.forwardRef(() => KbqOptionActionComponent), { isSignal: true }] }], tooltipTrigger: [{
|
|
1138
1141
|
type: ContentChild,
|
|
1139
1142
|
args: [KbqTooltipTrigger]
|
|
1140
1143
|
}], dropdownTrigger: [{
|
|
1141
1144
|
type: ContentChild,
|
|
1142
1145
|
args: [KbqDropdownTrigger]
|
|
1143
|
-
}], checkboxThirdState: [{
|
|
1146
|
+
}], checkboxThirdState: [{ type: i0.Input, args: [{ isSignal: true, alias: "checkboxThirdState", required: false }] }], disabled: [{
|
|
1144
1147
|
type: Input
|
|
1145
|
-
}],
|
|
1146
|
-
type: Input
|
|
1147
|
-
}], selectable: [{
|
|
1148
|
-
type: Input,
|
|
1149
|
-
args: [{ transform: booleanAttribute }]
|
|
1150
|
-
}], showCheckbox: [{
|
|
1148
|
+
}], selectable: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectable", required: false }] }], showCheckbox: [{
|
|
1151
1149
|
type: Input
|
|
1152
|
-
}], onSelectionChange: [{
|
|
1153
|
-
type: Output
|
|
1154
|
-
}] } });
|
|
1150
|
+
}], onSelectionChange: [{ type: i0.Output, args: ["onSelectionChange"] }] } });
|
|
1155
1151
|
|
|
1156
1152
|
/** Regex used to split a string on its CSS units. */
|
|
1157
1153
|
const cssUnitPattern = /([A-Za-z%]+)$/;
|
|
@@ -1162,6 +1158,8 @@ class KbqTreeNodePadding {
|
|
|
1162
1158
|
set level(value) {
|
|
1163
1159
|
this.setLevelInput(value);
|
|
1164
1160
|
}
|
|
1161
|
+
// TODO: Skipped for migration because:
|
|
1162
|
+
// Accessor inputs cannot be migrated as they are too complex.
|
|
1165
1163
|
get indent() {
|
|
1166
1164
|
return this._indent;
|
|
1167
1165
|
}
|
|
@@ -1175,13 +1173,13 @@ class KbqTreeNodePadding {
|
|
|
1175
1173
|
const border = 2;
|
|
1176
1174
|
return (this.withIcon ? 0 : this.iconWidth) + this._indent - border;
|
|
1177
1175
|
}
|
|
1178
|
-
constructor(
|
|
1179
|
-
this.treeNode =
|
|
1180
|
-
this.tree =
|
|
1181
|
-
this.renderer =
|
|
1182
|
-
this.element =
|
|
1183
|
-
this.option =
|
|
1184
|
-
this.dir =
|
|
1176
|
+
constructor() {
|
|
1177
|
+
this.treeNode = inject(KbqTreeNode);
|
|
1178
|
+
this.tree = inject(KbqTreeBase);
|
|
1179
|
+
this.renderer = inject(Renderer2);
|
|
1180
|
+
this.element = inject(ElementRef);
|
|
1181
|
+
this.option = inject(KbqTreeOption);
|
|
1182
|
+
this.dir = inject(Directionality, { optional: true });
|
|
1185
1183
|
this._indent = 12;
|
|
1186
1184
|
/** CSS units used for the indentation value. */
|
|
1187
1185
|
this.indentUnits = 'px';
|
|
@@ -1193,9 +1191,8 @@ class KbqTreeNodePadding {
|
|
|
1193
1191
|
this.setPadding();
|
|
1194
1192
|
}
|
|
1195
1193
|
paddingIndent() {
|
|
1196
|
-
const
|
|
1197
|
-
|
|
1198
|
-
: 0;
|
|
1194
|
+
const treeControl = this.tree.treeControl;
|
|
1195
|
+
const nodeLevel = this.treeNode.data && treeControl.getLevel ? treeControl.getLevel(this.treeNode.data) : 0;
|
|
1199
1196
|
const level = this.level || nodeLevel;
|
|
1200
1197
|
return level > 0 ? `${level * this._indent + this.leftPadding}px` : `${this.leftPaddingForFirstLevel}px`;
|
|
1201
1198
|
}
|
|
@@ -1235,37 +1232,35 @@ class KbqTreeNodePadding {
|
|
|
1235
1232
|
const paddingProp = this.dir?.value === 'rtl' ? 'paddingRight' : 'paddingLeft';
|
|
1236
1233
|
this.renderer.setStyle(this.element.nativeElement, paddingProp, padding);
|
|
1237
1234
|
}
|
|
1238
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1239
|
-
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
1235
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: KbqTreeNodePadding, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
1236
|
+
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.25", type: KbqTreeNodePadding, isStandalone: true, selector: "[kbqTreeNodePadding]", inputs: { indent: ["kbqTreeNodePaddingIndent", "indent"] }, exportAs: ["kbqTreeNodePadding"], ngImport: i0 }); }
|
|
1240
1237
|
}
|
|
1241
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1238
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: KbqTreeNodePadding, decorators: [{
|
|
1242
1239
|
type: Directive,
|
|
1243
1240
|
args: [{
|
|
1244
1241
|
selector: '[kbqTreeNodePadding]',
|
|
1245
1242
|
exportAs: 'kbqTreeNodePadding'
|
|
1246
1243
|
}]
|
|
1247
|
-
}], ctorParameters: () => [
|
|
1248
|
-
type: Optional
|
|
1249
|
-
}] }], propDecorators: { indent: [{
|
|
1244
|
+
}], ctorParameters: () => [], propDecorators: { indent: [{
|
|
1250
1245
|
type: Input,
|
|
1251
1246
|
args: ['kbqTreeNodePaddingIndent']
|
|
1252
1247
|
}] } });
|
|
1253
1248
|
|
|
1254
1249
|
class KbqTree extends KbqTreeBase {
|
|
1255
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1256
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
1250
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: KbqTree, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
1251
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.25", type: KbqTree, isStandalone: true, selector: "kbq-tree", host: { classAttribute: "kbq-tree" }, exportAs: ["kbqTree"], usesInheritance: true, ngImport: i0, template: `
|
|
1257
1252
|
<ng-container kbqTreeNodeOutlet />
|
|
1258
|
-
`, isInline: true, styles: [".kbq-tree{display:block}.kbq-tree-selection:focus{outline:none}.kbq-tree-option{--kbq-option-background: var(--kbq-tree-default-container-background);background:var(--kbq-tree-default-container-background)}.kbq-tree-option .kbq-option-text{color:var(--kbq-tree-default-text-color)}.kbq-tree-option .kbq-tree-node-toggle .kbq-icon.kbq-empty,.kbq-tree-option .kbq-icon.kbq-empty.kbq-tree-node-toggle{color:var(--kbq-tree-default-tree-toggle-color)}.kbq-tree-option .kbq-option-action .kbq-icon.kbq-empty{color:var(--kbq-tree-default-action-button-color)}.kbq-tree-option .kbq-option-caption{color:var(--kbq-tree-default-caption-color)}.kbq-tree-option:not(.kbq-disabled):hover,.kbq-tree-option:not(.kbq-disabled).kbq-hovered,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused{--kbq-option-background: var(--kbq-tree-states-hover-container-background);background:var(--kbq-tree-states-hover-container-background)}.kbq-tree-option:not(.kbq-disabled):hover .kbq-option-text,.kbq-tree-option:not(.kbq-disabled).kbq-hovered .kbq-option-text,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused .kbq-option-text{color:var(--kbq-tree-states-hover-text-color)}.kbq-tree-option:not(.kbq-disabled):hover .kbq-tree-node-toggle .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled):hover .kbq-icon.kbq-empty.kbq-tree-node-toggle,.kbq-tree-option:not(.kbq-disabled).kbq-hovered .kbq-tree-node-toggle .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-hovered .kbq-icon.kbq-empty.kbq-tree-node-toggle,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused .kbq-tree-node-toggle .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused .kbq-icon.kbq-empty.kbq-tree-node-toggle{color:var(--kbq-tree-states-hover-tree-toggle-color)}.kbq-tree-option:not(.kbq-disabled):hover .kbq-option-action .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-hovered .kbq-option-action .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused .kbq-option-action .kbq-icon.kbq-empty{color:var(--kbq-tree-states-hover-action-button-color)}.kbq-tree-option:not(.kbq-disabled):hover .kbq-option-caption,.kbq-tree-option:not(.kbq-disabled).kbq-hovered .kbq-option-caption,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused .kbq-option-caption{color:var(--kbq-tree-states-hover-caption-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected{--kbq-option-background: var(--kbq-tree-states-selected-container-background);background:var(--kbq-tree-states-selected-container-background)}.kbq-tree-option:not(.kbq-disabled).kbq-selected .kbq-option-text{color:var(--kbq-tree-states-selected-text-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected .kbq-tree-node-toggle .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-selected .kbq-icon.kbq-empty.kbq-tree-node-toggle{color:var(--kbq-tree-states-selected-tree-toggle-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected .kbq-option-action .kbq-icon.kbq-empty{color:var(--kbq-tree-states-selected-action-button-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected .kbq-option-caption{color:var(--kbq-tree-states-selected-caption-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected:hover,.kbq-tree-option:not(.kbq-disabled).kbq-selected.kbq-hovered{--kbq-option-background: var(--kbq-tree-states-selected-hover-container-background);background:var(--kbq-tree-states-selected-hover-container-background)}.kbq-tree-option:not(.kbq-disabled).kbq-selected:hover .kbq-option-text,.kbq-tree-option:not(.kbq-disabled).kbq-selected.kbq-hovered .kbq-option-text{color:var(--kbq-tree-states-selected-hover-text-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected:hover .kbq-tree-node-toggle .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-selected:hover .kbq-icon.kbq-empty.kbq-tree-node-toggle,.kbq-tree-option:not(.kbq-disabled).kbq-selected.kbq-hovered .kbq-tree-node-toggle .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-selected.kbq-hovered .kbq-icon.kbq-empty.kbq-tree-node-toggle{color:var(--kbq-tree-states-selected-hover-tree-toggle-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected:hover .kbq-option-action .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-selected.kbq-hovered .kbq-option-action .kbq-icon.kbq-empty{color:var(--kbq-tree-states-selected-hover-action-button-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected:hover .kbq-option-caption,.kbq-tree-option:not(.kbq-disabled).kbq-selected.kbq-hovered .kbq-option-caption{color:var(--kbq-tree-states-selected-hover-caption-color)}.kbq-tree-option:not(.kbq-disabled).kbq-checked:not(.kbq-selected),.kbq-tree-option:not(.kbq-disabled).kbq-tree-option_multiple.kbq-selected{--kbq-option-background: var(--kbq-tree-multiple-states-selected-container-background);background:var(--kbq-tree-multiple-states-selected-container-background)}.kbq-tree-option:not(.kbq-disabled).kbq-checked:not(.kbq-selected):hover,.kbq-tree-option:not(.kbq-disabled).kbq-checked:not(.kbq-selected).kbq-hovered,.kbq-tree-option:not(.kbq-disabled).kbq-tree-option_multiple.kbq-selected:hover,.kbq-tree-option:not(.kbq-disabled).kbq-tree-option_multiple.kbq-selected.kbq-hovered{--kbq-option-background: var(--kbq-tree-multiple-states-selected-hover-container-background);background:var(--kbq-tree-multiple-states-selected-hover-container-background)}.kbq-tree-option.kbq-disabled{--kbq-option-background: var(--kbq-tree-states-disabled-container-background);background:var(--kbq-tree-states-disabled-container-background)}.kbq-tree-option.kbq-disabled .kbq-option-text{color:var(--kbq-tree-states-disabled-text-color)}.kbq-tree-option.kbq-disabled .kbq-tree-node-toggle .kbq-icon.kbq-empty,.kbq-tree-option.kbq-disabled .kbq-icon.kbq-empty.kbq-tree-node-toggle{color:var(--kbq-tree-states-disabled-tree-toggle-color)}.kbq-tree-option.kbq-disabled .kbq-option-action .kbq-icon.kbq-empty{color:var(--kbq-tree-states-disabled-action-button-color)}.kbq-tree-option.kbq-disabled .kbq-option-caption{color:var(--kbq-tree-states-disabled-caption-color)}.kbq-tree-option.kbq-disabled .kbq-icon.kbq-empty{color:var(--kbq-states-icon-disabled)}.cdk-keyboard-focused .kbq-tree-option.kbq-focused:not(.kbq-action-button-focused){border-color:var(--kbq-tree-states-focused-focus-outline-color)}.cdk-keyboard-focused .kbq-tree-option.kbq-focused:not(.kbq-action-button-focused) .kbq-action-container{display:flex}.kbq-tree-option{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-tree-option-caption{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", ".kbq-tree,.kbq-tree-selection{--kbq-tree-size-indent-level: var(--kbq-size-xxl);--kbq-tree-size-container-padding-right: var(--kbq-size-s);--kbq-tree-size-container-padding-vertical: var(--kbq-size-xxs);--kbq-tree-size-container-content-gap-horizontal: var(--kbq-size-s);--kbq-tree-size-container-content-gap-vertical: 0px;--kbq-tree-size-container-focus-outline-width: var(--kbq-size-3xs);--kbq-tree-size-text-padding-vertical: var(--kbq-size-3xs);--kbq-tree-option-border-radius: var(--kbq-size-border-radius);--kbq-tree-default-container-background: transparent;--kbq-tree-default-text-color: var(--kbq-foreground-contrast);--kbq-tree-default-icon-color: var(--kbq-icon-contrast);--kbq-tree-default-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-default-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-default-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-hover-container-background: var(--kbq-states-background-transparent-hover);--kbq-tree-states-active-container-background: var(--kbq-states-background-transparent-active);--kbq-tree-states-hover-text-color: var(--kbq-foreground-contrast);--kbq-tree-states-hover-icon-color: var(--kbq-icon-contrast);--kbq-tree-states-hover-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-hover-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-hover-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-focused-focus-outline-color: var(--kbq-states-line-focus-theme);--kbq-tree-states-selected-container-background: var(--kbq-background-theme-less);--kbq-tree-multiple-states-selected-container-background: var(--kbq-background-contrast-less);--kbq-tree-states-selected-text-color: var(--kbq-foreground-contrast);--kbq-tree-states-selected-icon-color: var(--kbq-icon-contrast);--kbq-tree-states-selected-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-selected-hover-container-background: var(--kbq-states-background-theme-less-hover);--kbq-tree-states-selected-active-container-background: var(--kbq-states-background-theme-less-active);--kbq-tree-multiple-states-selected-hover-container-background: var(--kbq-states-background-contrast-less-hover);--kbq-tree-multiple-states-selected-active-container-background: var(--kbq-states-background-contrast-less-active);--kbq-tree-states-selected-hover-text-color: var(--kbq-foreground-contrast);--kbq-tree-states-selected-hover-icon-color: var(--kbq-icon-contrast);--kbq-tree-states-selected-hover-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-hover-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-hover-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-disabled-container-background: transparent;--kbq-tree-states-disabled-text-color: var(--kbq-states-foreground-disabled);--kbq-tree-states-disabled-icon-color: var(--kbq-states-icon-disabled);--kbq-tree-states-disabled-tree-toggle-color: var(--kbq-states-icon-disabled);--kbq-tree-states-disabled-action-button-color: var(--kbq-states-icon-disabled);--kbq-tree-states-disabled-caption-color: var(--kbq-states-foreground-disabled)}\n"], dependencies: [{ kind: "directive", type: KbqTreeNodeOutlet, selector: "[kbqTreeNodeOutlet]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
1253
|
+
`, isInline: true, styles: [".kbq-tree{display:block}.kbq-tree-selection:focus{outline:none}.kbq-tree-option{--kbq-option-background: var(--kbq-tree-default-container-background);background:var(--kbq-tree-default-container-background)}.kbq-tree-option .kbq-option-text{color:var(--kbq-tree-default-text-color)}.kbq-tree-option .kbq-option-action .kbq-icon.kbq-empty{color:var(--kbq-tree-default-action-button-color)}.kbq-tree-option .kbq-option-caption{color:var(--kbq-tree-default-caption-color)}.kbq-tree-option:not(.kbq-disabled):hover,.kbq-tree-option:not(.kbq-disabled).kbq-hovered,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused{--kbq-option-background: var(--kbq-tree-states-hover-container-background);background:var(--kbq-tree-states-hover-container-background)}.kbq-tree-option:not(.kbq-disabled):hover .kbq-option-text,.kbq-tree-option:not(.kbq-disabled).kbq-hovered .kbq-option-text,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused .kbq-option-text{color:var(--kbq-tree-states-hover-text-color)}.kbq-tree-option:not(.kbq-disabled):hover .kbq-option-action .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-hovered .kbq-option-action .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused .kbq-option-action .kbq-icon.kbq-empty{color:var(--kbq-tree-states-hover-action-button-color)}.kbq-tree-option:not(.kbq-disabled):hover .kbq-option-caption,.kbq-tree-option:not(.kbq-disabled).kbq-hovered .kbq-option-caption,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused .kbq-option-caption{color:var(--kbq-tree-states-hover-caption-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected{--kbq-option-background: var(--kbq-tree-states-selected-container-background);background:var(--kbq-tree-states-selected-container-background)}.kbq-tree-option:not(.kbq-disabled).kbq-selected .kbq-option-text{color:var(--kbq-tree-states-selected-text-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected .kbq-option-action .kbq-icon.kbq-empty{color:var(--kbq-tree-states-selected-action-button-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected .kbq-option-caption{color:var(--kbq-tree-states-selected-caption-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected:hover,.kbq-tree-option:not(.kbq-disabled).kbq-selected.kbq-hovered{--kbq-option-background: var(--kbq-tree-states-selected-hover-container-background);background:var(--kbq-tree-states-selected-hover-container-background)}.kbq-tree-option:not(.kbq-disabled).kbq-selected:hover .kbq-option-text,.kbq-tree-option:not(.kbq-disabled).kbq-selected.kbq-hovered .kbq-option-text{color:var(--kbq-tree-states-selected-hover-text-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected:hover .kbq-option-action .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-selected.kbq-hovered .kbq-option-action .kbq-icon.kbq-empty{color:var(--kbq-tree-states-selected-hover-action-button-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected:hover .kbq-option-caption,.kbq-tree-option:not(.kbq-disabled).kbq-selected.kbq-hovered .kbq-option-caption{color:var(--kbq-tree-states-selected-hover-caption-color)}.kbq-tree-option:not(.kbq-disabled).kbq-checked:not(.kbq-selected),.kbq-tree-option:not(.kbq-disabled).kbq-tree-option_multiple.kbq-selected{--kbq-option-background: var(--kbq-tree-multiple-states-selected-container-background);background:var(--kbq-tree-multiple-states-selected-container-background)}.kbq-tree-option:not(.kbq-disabled).kbq-checked:not(.kbq-selected):hover,.kbq-tree-option:not(.kbq-disabled).kbq-checked:not(.kbq-selected).kbq-hovered,.kbq-tree-option:not(.kbq-disabled).kbq-tree-option_multiple.kbq-selected:hover,.kbq-tree-option:not(.kbq-disabled).kbq-tree-option_multiple.kbq-selected.kbq-hovered{--kbq-option-background: var(--kbq-tree-multiple-states-selected-hover-container-background);background:var(--kbq-tree-multiple-states-selected-hover-container-background)}.kbq-tree-option.kbq-disabled{--kbq-option-background: var(--kbq-tree-states-disabled-container-background);background:var(--kbq-tree-states-disabled-container-background)}.kbq-tree-option.kbq-disabled .kbq-option-text{color:var(--kbq-tree-states-disabled-text-color)}.kbq-tree-option.kbq-disabled .kbq-option-action .kbq-icon.kbq-empty{color:var(--kbq-tree-states-disabled-action-button-color)}.kbq-tree-option.kbq-disabled .kbq-option-caption{color:var(--kbq-tree-states-disabled-caption-color)}.kbq-tree-option.kbq-disabled .kbq-icon.kbq-empty:not(.kbq-tree-node-toggle .kbq-icon){color:var(--kbq-states-icon-disabled)}.cdk-keyboard-focused .kbq-tree-option.kbq-focused:not(.kbq-action-button-focused){border-color:var(--kbq-tree-states-focused-focus-outline-color)}.cdk-keyboard-focused .kbq-tree-option.kbq-focused:not(.kbq-action-button-focused) .kbq-action-container{display:flex}.kbq-tree-option{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-option-caption{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", ".kbq-tree,.kbq-tree-selection{--kbq-tree-size-indent-level: var(--kbq-size-xxl);--kbq-tree-size-container-padding-right: var(--kbq-size-s);--kbq-tree-size-container-padding-vertical: var(--kbq-size-xxs);--kbq-tree-size-container-content-gap-horizontal: var(--kbq-size-s);--kbq-tree-size-container-content-gap-vertical: 0px;--kbq-tree-size-container-focus-outline-width: var(--kbq-size-3xs);--kbq-tree-size-text-padding-vertical: var(--kbq-size-3xs);--kbq-tree-option-border-radius: var(--kbq-size-border-radius);--kbq-tree-default-container-background: transparent;--kbq-tree-default-text-color: var(--kbq-foreground-contrast);--kbq-tree-default-icon-color: var(--kbq-icon-contrast);--kbq-tree-default-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-default-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-default-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-hover-container-background: var(--kbq-states-background-transparent-hover);--kbq-tree-states-active-container-background: var(--kbq-states-background-transparent-active);--kbq-tree-states-hover-text-color: var(--kbq-foreground-contrast);--kbq-tree-states-hover-icon-color: var(--kbq-icon-contrast);--kbq-tree-states-hover-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-hover-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-hover-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-focused-focus-outline-color: var(--kbq-states-line-focus-theme);--kbq-tree-states-selected-container-background: var(--kbq-background-theme-less);--kbq-tree-multiple-states-selected-container-background: var(--kbq-background-contrast-less);--kbq-tree-states-selected-text-color: var(--kbq-foreground-contrast);--kbq-tree-states-selected-icon-color: var(--kbq-icon-contrast);--kbq-tree-states-selected-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-selected-hover-container-background: var(--kbq-states-background-theme-less-hover);--kbq-tree-states-selected-active-container-background: var(--kbq-states-background-theme-less-active);--kbq-tree-multiple-states-selected-hover-container-background: var(--kbq-states-background-contrast-less-hover);--kbq-tree-multiple-states-selected-active-container-background: var(--kbq-states-background-contrast-less-active);--kbq-tree-states-selected-hover-text-color: var(--kbq-foreground-contrast);--kbq-tree-states-selected-hover-icon-color: var(--kbq-icon-contrast);--kbq-tree-states-selected-hover-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-hover-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-hover-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-disabled-container-background: transparent;--kbq-tree-states-disabled-text-color: var(--kbq-states-foreground-disabled);--kbq-tree-states-disabled-icon-color: var(--kbq-states-icon-disabled);--kbq-tree-states-disabled-tree-toggle-color: var(--kbq-states-icon-disabled);--kbq-tree-states-disabled-action-button-color: var(--kbq-states-icon-disabled);--kbq-tree-states-disabled-caption-color: var(--kbq-states-foreground-disabled)}\n"], dependencies: [{ kind: "directive", type: KbqTreeNodeOutlet, selector: "[kbqTreeNodeOutlet]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
1259
1254
|
}
|
|
1260
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1255
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: KbqTree, decorators: [{
|
|
1261
1256
|
type: Component,
|
|
1262
1257
|
args: [{ selector: 'kbq-tree', imports: [
|
|
1263
1258
|
KbqTreeNodeOutlet
|
|
1264
1259
|
], template: `
|
|
1265
1260
|
<ng-container kbqTreeNodeOutlet />
|
|
1266
|
-
`,
|
|
1261
|
+
`, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
|
|
1267
1262
|
class: 'kbq-tree'
|
|
1268
|
-
}, styles: [".kbq-tree{display:block}.kbq-tree-selection:focus{outline:none}.kbq-tree-option{--kbq-option-background: var(--kbq-tree-default-container-background);background:var(--kbq-tree-default-container-background)}.kbq-tree-option .kbq-option-text{color:var(--kbq-tree-default-text-color)}.kbq-tree-option .kbq-tree-node-toggle .kbq-icon.kbq-empty,.kbq-tree-option .kbq-icon.kbq-empty.kbq-tree-node-toggle{color:var(--kbq-tree-default-tree-toggle-color)}.kbq-tree-option .kbq-option-action .kbq-icon.kbq-empty{color:var(--kbq-tree-default-action-button-color)}.kbq-tree-option .kbq-option-caption{color:var(--kbq-tree-default-caption-color)}.kbq-tree-option:not(.kbq-disabled):hover,.kbq-tree-option:not(.kbq-disabled).kbq-hovered,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused{--kbq-option-background: var(--kbq-tree-states-hover-container-background);background:var(--kbq-tree-states-hover-container-background)}.kbq-tree-option:not(.kbq-disabled):hover .kbq-option-text,.kbq-tree-option:not(.kbq-disabled).kbq-hovered .kbq-option-text,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused .kbq-option-text{color:var(--kbq-tree-states-hover-text-color)}.kbq-tree-option:not(.kbq-disabled):hover .kbq-tree-node-toggle .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled):hover .kbq-icon.kbq-empty.kbq-tree-node-toggle,.kbq-tree-option:not(.kbq-disabled).kbq-hovered .kbq-tree-node-toggle .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-hovered .kbq-icon.kbq-empty.kbq-tree-node-toggle,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused .kbq-tree-node-toggle .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused .kbq-icon.kbq-empty.kbq-tree-node-toggle{color:var(--kbq-tree-states-hover-tree-toggle-color)}.kbq-tree-option:not(.kbq-disabled):hover .kbq-option-action .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-hovered .kbq-option-action .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused .kbq-option-action .kbq-icon.kbq-empty{color:var(--kbq-tree-states-hover-action-button-color)}.kbq-tree-option:not(.kbq-disabled):hover .kbq-option-caption,.kbq-tree-option:not(.kbq-disabled).kbq-hovered .kbq-option-caption,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused .kbq-option-caption{color:var(--kbq-tree-states-hover-caption-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected{--kbq-option-background: var(--kbq-tree-states-selected-container-background);background:var(--kbq-tree-states-selected-container-background)}.kbq-tree-option:not(.kbq-disabled).kbq-selected .kbq-option-text{color:var(--kbq-tree-states-selected-text-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected .kbq-tree-node-toggle .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-selected .kbq-icon.kbq-empty.kbq-tree-node-toggle{color:var(--kbq-tree-states-selected-tree-toggle-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected .kbq-option-action .kbq-icon.kbq-empty{color:var(--kbq-tree-states-selected-action-button-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected .kbq-option-caption{color:var(--kbq-tree-states-selected-caption-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected:hover,.kbq-tree-option:not(.kbq-disabled).kbq-selected.kbq-hovered{--kbq-option-background: var(--kbq-tree-states-selected-hover-container-background);background:var(--kbq-tree-states-selected-hover-container-background)}.kbq-tree-option:not(.kbq-disabled).kbq-selected:hover .kbq-option-text,.kbq-tree-option:not(.kbq-disabled).kbq-selected.kbq-hovered .kbq-option-text{color:var(--kbq-tree-states-selected-hover-text-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected:hover .kbq-tree-node-toggle .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-selected:hover .kbq-icon.kbq-empty.kbq-tree-node-toggle,.kbq-tree-option:not(.kbq-disabled).kbq-selected.kbq-hovered .kbq-tree-node-toggle .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-selected.kbq-hovered .kbq-icon.kbq-empty.kbq-tree-node-toggle{color:var(--kbq-tree-states-selected-hover-tree-toggle-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected:hover .kbq-option-action .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-selected.kbq-hovered .kbq-option-action .kbq-icon.kbq-empty{color:var(--kbq-tree-states-selected-hover-action-button-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected:hover .kbq-option-caption,.kbq-tree-option:not(.kbq-disabled).kbq-selected.kbq-hovered .kbq-option-caption{color:var(--kbq-tree-states-selected-hover-caption-color)}.kbq-tree-option:not(.kbq-disabled).kbq-checked:not(.kbq-selected),.kbq-tree-option:not(.kbq-disabled).kbq-tree-option_multiple.kbq-selected{--kbq-option-background: var(--kbq-tree-multiple-states-selected-container-background);background:var(--kbq-tree-multiple-states-selected-container-background)}.kbq-tree-option:not(.kbq-disabled).kbq-checked:not(.kbq-selected):hover,.kbq-tree-option:not(.kbq-disabled).kbq-checked:not(.kbq-selected).kbq-hovered,.kbq-tree-option:not(.kbq-disabled).kbq-tree-option_multiple.kbq-selected:hover,.kbq-tree-option:not(.kbq-disabled).kbq-tree-option_multiple.kbq-selected.kbq-hovered{--kbq-option-background: var(--kbq-tree-multiple-states-selected-hover-container-background);background:var(--kbq-tree-multiple-states-selected-hover-container-background)}.kbq-tree-option.kbq-disabled{--kbq-option-background: var(--kbq-tree-states-disabled-container-background);background:var(--kbq-tree-states-disabled-container-background)}.kbq-tree-option.kbq-disabled .kbq-option-text{color:var(--kbq-tree-states-disabled-text-color)}.kbq-tree-option.kbq-disabled .kbq-tree-node-toggle .kbq-icon.kbq-empty,.kbq-tree-option.kbq-disabled .kbq-icon.kbq-empty.kbq-tree-node-toggle{color:var(--kbq-tree-states-disabled-tree-toggle-color)}.kbq-tree-option.kbq-disabled .kbq-option-action .kbq-icon.kbq-empty{color:var(--kbq-tree-states-disabled-action-button-color)}.kbq-tree-option.kbq-disabled .kbq-option-caption{color:var(--kbq-tree-states-disabled-caption-color)}.kbq-tree-option.kbq-disabled .kbq-icon.kbq-empty{color:var(--kbq-states-icon-disabled)}.cdk-keyboard-focused .kbq-tree-option.kbq-focused:not(.kbq-action-button-focused){border-color:var(--kbq-tree-states-focused-focus-outline-color)}.cdk-keyboard-focused .kbq-tree-option.kbq-focused:not(.kbq-action-button-focused) .kbq-action-container{display:flex}.kbq-tree-option{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-tree-option-caption{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", ".kbq-tree,.kbq-tree-selection{--kbq-tree-size-indent-level: var(--kbq-size-xxl);--kbq-tree-size-container-padding-right: var(--kbq-size-s);--kbq-tree-size-container-padding-vertical: var(--kbq-size-xxs);--kbq-tree-size-container-content-gap-horizontal: var(--kbq-size-s);--kbq-tree-size-container-content-gap-vertical: 0px;--kbq-tree-size-container-focus-outline-width: var(--kbq-size-3xs);--kbq-tree-size-text-padding-vertical: var(--kbq-size-3xs);--kbq-tree-option-border-radius: var(--kbq-size-border-radius);--kbq-tree-default-container-background: transparent;--kbq-tree-default-text-color: var(--kbq-foreground-contrast);--kbq-tree-default-icon-color: var(--kbq-icon-contrast);--kbq-tree-default-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-default-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-default-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-hover-container-background: var(--kbq-states-background-transparent-hover);--kbq-tree-states-active-container-background: var(--kbq-states-background-transparent-active);--kbq-tree-states-hover-text-color: var(--kbq-foreground-contrast);--kbq-tree-states-hover-icon-color: var(--kbq-icon-contrast);--kbq-tree-states-hover-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-hover-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-hover-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-focused-focus-outline-color: var(--kbq-states-line-focus-theme);--kbq-tree-states-selected-container-background: var(--kbq-background-theme-less);--kbq-tree-multiple-states-selected-container-background: var(--kbq-background-contrast-less);--kbq-tree-states-selected-text-color: var(--kbq-foreground-contrast);--kbq-tree-states-selected-icon-color: var(--kbq-icon-contrast);--kbq-tree-states-selected-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-selected-hover-container-background: var(--kbq-states-background-theme-less-hover);--kbq-tree-states-selected-active-container-background: var(--kbq-states-background-theme-less-active);--kbq-tree-multiple-states-selected-hover-container-background: var(--kbq-states-background-contrast-less-hover);--kbq-tree-multiple-states-selected-active-container-background: var(--kbq-states-background-contrast-less-active);--kbq-tree-states-selected-hover-text-color: var(--kbq-foreground-contrast);--kbq-tree-states-selected-hover-icon-color: var(--kbq-icon-contrast);--kbq-tree-states-selected-hover-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-hover-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-hover-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-disabled-container-background: transparent;--kbq-tree-states-disabled-text-color: var(--kbq-states-foreground-disabled);--kbq-tree-states-disabled-icon-color: var(--kbq-states-icon-disabled);--kbq-tree-states-disabled-tree-toggle-color: var(--kbq-states-icon-disabled);--kbq-tree-states-disabled-action-button-color: var(--kbq-states-icon-disabled);--kbq-tree-states-disabled-caption-color: var(--kbq-states-foreground-disabled)}\n"] }]
|
|
1263
|
+
}, exportAs: 'kbqTree', styles: [".kbq-tree{display:block}.kbq-tree-selection:focus{outline:none}.kbq-tree-option{--kbq-option-background: var(--kbq-tree-default-container-background);background:var(--kbq-tree-default-container-background)}.kbq-tree-option .kbq-option-text{color:var(--kbq-tree-default-text-color)}.kbq-tree-option .kbq-option-action .kbq-icon.kbq-empty{color:var(--kbq-tree-default-action-button-color)}.kbq-tree-option .kbq-option-caption{color:var(--kbq-tree-default-caption-color)}.kbq-tree-option:not(.kbq-disabled):hover,.kbq-tree-option:not(.kbq-disabled).kbq-hovered,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused{--kbq-option-background: var(--kbq-tree-states-hover-container-background);background:var(--kbq-tree-states-hover-container-background)}.kbq-tree-option:not(.kbq-disabled):hover .kbq-option-text,.kbq-tree-option:not(.kbq-disabled).kbq-hovered .kbq-option-text,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused .kbq-option-text{color:var(--kbq-tree-states-hover-text-color)}.kbq-tree-option:not(.kbq-disabled):hover .kbq-option-action .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-hovered .kbq-option-action .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused .kbq-option-action .kbq-icon.kbq-empty{color:var(--kbq-tree-states-hover-action-button-color)}.kbq-tree-option:not(.kbq-disabled):hover .kbq-option-caption,.kbq-tree-option:not(.kbq-disabled).kbq-hovered .kbq-option-caption,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused .kbq-option-caption{color:var(--kbq-tree-states-hover-caption-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected{--kbq-option-background: var(--kbq-tree-states-selected-container-background);background:var(--kbq-tree-states-selected-container-background)}.kbq-tree-option:not(.kbq-disabled).kbq-selected .kbq-option-text{color:var(--kbq-tree-states-selected-text-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected .kbq-option-action .kbq-icon.kbq-empty{color:var(--kbq-tree-states-selected-action-button-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected .kbq-option-caption{color:var(--kbq-tree-states-selected-caption-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected:hover,.kbq-tree-option:not(.kbq-disabled).kbq-selected.kbq-hovered{--kbq-option-background: var(--kbq-tree-states-selected-hover-container-background);background:var(--kbq-tree-states-selected-hover-container-background)}.kbq-tree-option:not(.kbq-disabled).kbq-selected:hover .kbq-option-text,.kbq-tree-option:not(.kbq-disabled).kbq-selected.kbq-hovered .kbq-option-text{color:var(--kbq-tree-states-selected-hover-text-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected:hover .kbq-option-action .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-selected.kbq-hovered .kbq-option-action .kbq-icon.kbq-empty{color:var(--kbq-tree-states-selected-hover-action-button-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected:hover .kbq-option-caption,.kbq-tree-option:not(.kbq-disabled).kbq-selected.kbq-hovered .kbq-option-caption{color:var(--kbq-tree-states-selected-hover-caption-color)}.kbq-tree-option:not(.kbq-disabled).kbq-checked:not(.kbq-selected),.kbq-tree-option:not(.kbq-disabled).kbq-tree-option_multiple.kbq-selected{--kbq-option-background: var(--kbq-tree-multiple-states-selected-container-background);background:var(--kbq-tree-multiple-states-selected-container-background)}.kbq-tree-option:not(.kbq-disabled).kbq-checked:not(.kbq-selected):hover,.kbq-tree-option:not(.kbq-disabled).kbq-checked:not(.kbq-selected).kbq-hovered,.kbq-tree-option:not(.kbq-disabled).kbq-tree-option_multiple.kbq-selected:hover,.kbq-tree-option:not(.kbq-disabled).kbq-tree-option_multiple.kbq-selected.kbq-hovered{--kbq-option-background: var(--kbq-tree-multiple-states-selected-hover-container-background);background:var(--kbq-tree-multiple-states-selected-hover-container-background)}.kbq-tree-option.kbq-disabled{--kbq-option-background: var(--kbq-tree-states-disabled-container-background);background:var(--kbq-tree-states-disabled-container-background)}.kbq-tree-option.kbq-disabled .kbq-option-text{color:var(--kbq-tree-states-disabled-text-color)}.kbq-tree-option.kbq-disabled .kbq-option-action .kbq-icon.kbq-empty{color:var(--kbq-tree-states-disabled-action-button-color)}.kbq-tree-option.kbq-disabled .kbq-option-caption{color:var(--kbq-tree-states-disabled-caption-color)}.kbq-tree-option.kbq-disabled .kbq-icon.kbq-empty:not(.kbq-tree-node-toggle .kbq-icon){color:var(--kbq-states-icon-disabled)}.cdk-keyboard-focused .kbq-tree-option.kbq-focused:not(.kbq-action-button-focused){border-color:var(--kbq-tree-states-focused-focus-outline-color)}.cdk-keyboard-focused .kbq-tree-option.kbq-focused:not(.kbq-action-button-focused) .kbq-action-container{display:flex}.kbq-tree-option{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-option-caption{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", ".kbq-tree,.kbq-tree-selection{--kbq-tree-size-indent-level: var(--kbq-size-xxl);--kbq-tree-size-container-padding-right: var(--kbq-size-s);--kbq-tree-size-container-padding-vertical: var(--kbq-size-xxs);--kbq-tree-size-container-content-gap-horizontal: var(--kbq-size-s);--kbq-tree-size-container-content-gap-vertical: 0px;--kbq-tree-size-container-focus-outline-width: var(--kbq-size-3xs);--kbq-tree-size-text-padding-vertical: var(--kbq-size-3xs);--kbq-tree-option-border-radius: var(--kbq-size-border-radius);--kbq-tree-default-container-background: transparent;--kbq-tree-default-text-color: var(--kbq-foreground-contrast);--kbq-tree-default-icon-color: var(--kbq-icon-contrast);--kbq-tree-default-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-default-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-default-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-hover-container-background: var(--kbq-states-background-transparent-hover);--kbq-tree-states-active-container-background: var(--kbq-states-background-transparent-active);--kbq-tree-states-hover-text-color: var(--kbq-foreground-contrast);--kbq-tree-states-hover-icon-color: var(--kbq-icon-contrast);--kbq-tree-states-hover-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-hover-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-hover-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-focused-focus-outline-color: var(--kbq-states-line-focus-theme);--kbq-tree-states-selected-container-background: var(--kbq-background-theme-less);--kbq-tree-multiple-states-selected-container-background: var(--kbq-background-contrast-less);--kbq-tree-states-selected-text-color: var(--kbq-foreground-contrast);--kbq-tree-states-selected-icon-color: var(--kbq-icon-contrast);--kbq-tree-states-selected-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-selected-hover-container-background: var(--kbq-states-background-theme-less-hover);--kbq-tree-states-selected-active-container-background: var(--kbq-states-background-theme-less-active);--kbq-tree-multiple-states-selected-hover-container-background: var(--kbq-states-background-contrast-less-hover);--kbq-tree-multiple-states-selected-active-container-background: var(--kbq-states-background-contrast-less-active);--kbq-tree-states-selected-hover-text-color: var(--kbq-foreground-contrast);--kbq-tree-states-selected-hover-icon-color: var(--kbq-icon-contrast);--kbq-tree-states-selected-hover-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-hover-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-hover-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-disabled-container-background: transparent;--kbq-tree-states-disabled-text-color: var(--kbq-states-foreground-disabled);--kbq-tree-states-disabled-icon-color: var(--kbq-states-icon-disabled);--kbq-tree-states-disabled-tree-toggle-color: var(--kbq-states-icon-disabled);--kbq-tree-states-disabled-action-button-color: var(--kbq-states-icon-disabled);--kbq-tree-states-disabled-caption-color: var(--kbq-states-foreground-disabled)}\n"] }]
|
|
1269
1264
|
}] });
|
|
1270
1265
|
|
|
1271
1266
|
const KBQ_SELECTION_TREE_VALUE_ACCESSOR = {
|
|
@@ -1308,6 +1303,8 @@ class KbqTreeSelectionChange {
|
|
|
1308
1303
|
}
|
|
1309
1304
|
}
|
|
1310
1305
|
class KbqTreeSelection extends KbqTreeBase {
|
|
1306
|
+
// TODO: Skipped for migration because:
|
|
1307
|
+
// Accessor inputs cannot be migrated as they are too complex.
|
|
1311
1308
|
get autoSelect() {
|
|
1312
1309
|
return this._autoSelect;
|
|
1313
1310
|
}
|
|
@@ -1323,12 +1320,16 @@ class KbqTreeSelection extends KbqTreeBase {
|
|
|
1323
1320
|
get multiple() {
|
|
1324
1321
|
return !!this.multipleMode;
|
|
1325
1322
|
}
|
|
1323
|
+
// TODO: Skipped for migration because:
|
|
1324
|
+
// Accessor inputs cannot be migrated as they are too complex.
|
|
1326
1325
|
get noUnselectLast() {
|
|
1327
1326
|
return this._noUnselectLast;
|
|
1328
1327
|
}
|
|
1329
1328
|
set noUnselectLast(value) {
|
|
1330
1329
|
this._noUnselectLast = coerceBooleanProperty(value);
|
|
1331
1330
|
}
|
|
1331
|
+
// TODO: Skipped for migration because:
|
|
1332
|
+
// Accessor inputs cannot be migrated as they are too complex.
|
|
1332
1333
|
get disabled() {
|
|
1333
1334
|
return this._disabled;
|
|
1334
1335
|
}
|
|
@@ -1339,6 +1340,8 @@ class KbqTreeSelection extends KbqTreeBase {
|
|
|
1339
1340
|
this.markOptionsForCheck();
|
|
1340
1341
|
}
|
|
1341
1342
|
}
|
|
1343
|
+
// TODO: Skipped for migration because:
|
|
1344
|
+
// Accessor inputs cannot be migrated as they are too complex.
|
|
1342
1345
|
get tabIndex() {
|
|
1343
1346
|
return this.disabled ? -1 : this._tabIndex;
|
|
1344
1347
|
}
|
|
@@ -1352,13 +1355,20 @@ class KbqTreeSelection extends KbqTreeBase {
|
|
|
1352
1355
|
get isEmpty() {
|
|
1353
1356
|
return this.sortedNodes.length === 0;
|
|
1354
1357
|
}
|
|
1355
|
-
constructor(
|
|
1356
|
-
|
|
1357
|
-
|
|
1358
|
-
this.
|
|
1359
|
-
this.
|
|
1358
|
+
constructor() {
|
|
1359
|
+
const multiple = inject(new HostAttributeToken('multiple'), { optional: true });
|
|
1360
|
+
super();
|
|
1361
|
+
this.elementRef = inject(ElementRef);
|
|
1362
|
+
this.scheduler = inject(AsyncScheduler);
|
|
1363
|
+
this.clipboard = inject(Clipboard, { optional: true });
|
|
1364
|
+
this.platform = inject(Platform);
|
|
1360
1365
|
this.focusMonitor = inject(FocusMonitor);
|
|
1361
|
-
/**
|
|
1366
|
+
/**
|
|
1367
|
+
* Whether this tree-selection is rendered inside a select panel (enables option
|
|
1368
|
+
* hover-to-focus). Defaults to detecting a wrapping `KbqFormField`, and is forced to `true`
|
|
1369
|
+
* by the host `KbqTreeSelect` so hover works even when the tree-select has no form-field
|
|
1370
|
+
* wrapper (e.g. the filter-bar pipes render the tree-select bare).
|
|
1371
|
+
*/
|
|
1362
1372
|
this.inSelect = !!inject(KBQ_FORM_FIELD_REF, { optional: true, host: true });
|
|
1363
1373
|
this.renderedOptions = new QueryList();
|
|
1364
1374
|
this.resetFocusedItemOnBlur = true;
|
|
@@ -1366,14 +1376,16 @@ class KbqTreeSelection extends KbqTreeBase {
|
|
|
1366
1376
|
this.userTabIndex = null;
|
|
1367
1377
|
// this parameter used when select has a search field
|
|
1368
1378
|
this.optionShouldHoldFocusOnBlur = false;
|
|
1369
|
-
this.navigationChange =
|
|
1379
|
+
this.navigationChange = output();
|
|
1370
1380
|
this.selectionChange = new EventEmitter();
|
|
1371
|
-
this.onSelectAll =
|
|
1381
|
+
this.onSelectAll = output();
|
|
1372
1382
|
this.onCopy = new EventEmitter();
|
|
1373
1383
|
this.sortedNodes = [];
|
|
1374
1384
|
this.lastSyncedDataNodes = null;
|
|
1375
1385
|
this._autoSelect = true;
|
|
1376
1386
|
this._noUnselectLast = true;
|
|
1387
|
+
/** When `true`, a repeated Ctrl/Cmd+A deselects all options. Off by default (Ctrl+A only selects). */
|
|
1388
|
+
this.selectAllToggle = input(false, ...(ngDevMode ? [{ debugName: "selectAllToggle", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
|
|
1377
1389
|
this._disabled = false;
|
|
1378
1390
|
this._tabIndex = 0;
|
|
1379
1391
|
/** `View -> model callback called when value changes` */
|
|
@@ -1405,7 +1417,9 @@ class KbqTreeSelection extends KbqTreeBase {
|
|
|
1405
1417
|
this.selectionModel = new SelectionModel(this.multiple);
|
|
1406
1418
|
}
|
|
1407
1419
|
ngAfterContentInit() {
|
|
1408
|
-
this.
|
|
1420
|
+
if (this.platform.isBrowser) {
|
|
1421
|
+
this.unorderedOptions.changes.subscribe(this.updateRenderedOptions);
|
|
1422
|
+
}
|
|
1409
1423
|
this.keyManager = new FocusKeyManager(this.renderedOptions)
|
|
1410
1424
|
.withVerticalOrientation(true)
|
|
1411
1425
|
.withHorizontalOrientation(null);
|
|
@@ -1479,8 +1493,7 @@ class KbqTreeSelection extends KbqTreeBase {
|
|
|
1479
1493
|
event.preventDefault();
|
|
1480
1494
|
}
|
|
1481
1495
|
if (this.multiple && isSelectAll(event)) {
|
|
1482
|
-
this.
|
|
1483
|
-
event.preventDefault();
|
|
1496
|
+
this.selectAllHandler(event, this);
|
|
1484
1497
|
return;
|
|
1485
1498
|
}
|
|
1486
1499
|
else if (isCopy(event)) {
|
|
@@ -1543,13 +1556,16 @@ class KbqTreeSelection extends KbqTreeBase {
|
|
|
1543
1556
|
return;
|
|
1544
1557
|
}
|
|
1545
1558
|
}
|
|
1546
|
-
else if (this.autoSelect) {
|
|
1559
|
+
else if (this.autoSelect && option.selectable()) {
|
|
1547
1560
|
this.selectionModel.clear();
|
|
1548
1561
|
this.selectionModel.toggle(option.data);
|
|
1549
1562
|
this.emitChangeEvent(option);
|
|
1550
1563
|
}
|
|
1551
1564
|
}
|
|
1552
1565
|
setSelectedOptionsByClick(option, shiftKey, ctrlKey) {
|
|
1566
|
+
if (option.disabled || !option.selectable()) {
|
|
1567
|
+
return;
|
|
1568
|
+
}
|
|
1553
1569
|
if (!shiftKey && !ctrlKey) {
|
|
1554
1570
|
this.keyManager.setActiveItem(option);
|
|
1555
1571
|
}
|
|
@@ -1578,7 +1594,9 @@ class KbqTreeSelection extends KbqTreeBase {
|
|
|
1578
1594
|
let toIndex = (this.keyManager.previousActiveItemIndex = this.keyManager.activeItemIndex);
|
|
1579
1595
|
const selectedOptionState = options[fromIndex]?.selected;
|
|
1580
1596
|
if (toIndex === fromIndex || fromIndex === -1) {
|
|
1581
|
-
options[toIndex]
|
|
1597
|
+
if (options[toIndex]?.selectable()) {
|
|
1598
|
+
options[toIndex].toggle();
|
|
1599
|
+
}
|
|
1582
1600
|
return;
|
|
1583
1601
|
}
|
|
1584
1602
|
if (fromIndex > toIndex) {
|
|
@@ -1586,7 +1604,7 @@ class KbqTreeSelection extends KbqTreeBase {
|
|
|
1586
1604
|
}
|
|
1587
1605
|
options
|
|
1588
1606
|
.slice(fromIndex, toIndex + 1)
|
|
1589
|
-
.filter((item) => !item.disabled)
|
|
1607
|
+
.filter((item) => !item.disabled && item.selectable())
|
|
1590
1608
|
.forEach((renderedOption) => {
|
|
1591
1609
|
if (!selectedOptionState && this.noUnselectLast && this.selectionModel.selected.length === 1) {
|
|
1592
1610
|
return;
|
|
@@ -1599,7 +1617,7 @@ class KbqTreeSelection extends KbqTreeBase {
|
|
|
1599
1617
|
}
|
|
1600
1618
|
toggleFocusedOption() {
|
|
1601
1619
|
const focusedOption = this.keyManager.activeItem;
|
|
1602
|
-
if (!focusedOption?.selectable)
|
|
1620
|
+
if (!focusedOption?.selectable())
|
|
1603
1621
|
return;
|
|
1604
1622
|
if (focusedOption && (!focusedOption.selected || this.canDeselectLast(focusedOption))) {
|
|
1605
1623
|
this.selectionModel.toggle(focusedOption.data);
|
|
@@ -1617,19 +1635,46 @@ class KbqTreeSelection extends KbqTreeBase {
|
|
|
1617
1635
|
emitChangeEvent(option) {
|
|
1618
1636
|
this.selectionChange.emit(new KbqTreeSelectionChange(this, option, [option]));
|
|
1619
1637
|
}
|
|
1620
|
-
|
|
1621
|
-
|
|
1622
|
-
|
|
1623
|
-
|
|
1624
|
-
|
|
1625
|
-
|
|
1626
|
-
|
|
1627
|
-
|
|
1628
|
-
|
|
1629
|
-
|
|
1630
|
-
|
|
1638
|
+
/**
|
|
1639
|
+
* Function for handling the combination Ctrl + A (select all). By default, the internal handler is used,
|
|
1640
|
+
* which toggles the selection of all non-disabled, selectable options.
|
|
1641
|
+
*/
|
|
1642
|
+
get selectAllHandler() {
|
|
1643
|
+
return this._selectAllHandler;
|
|
1644
|
+
}
|
|
1645
|
+
set selectAllHandler(fn) {
|
|
1646
|
+
if (typeof fn !== 'function') {
|
|
1647
|
+
throw Error('`selectAllHandler` must be a function.');
|
|
1648
|
+
}
|
|
1649
|
+
this._selectAllHandler = fn;
|
|
1650
|
+
}
|
|
1651
|
+
_selectAllHandler(event, tree) {
|
|
1652
|
+
event.preventDefault();
|
|
1653
|
+
tree.selectAllOptions();
|
|
1654
|
+
}
|
|
1655
|
+
selectAllOptions(allowDeselect = this.selectAllToggle()) {
|
|
1656
|
+
const nonSelectableDataNodes = this.renderedOptions
|
|
1657
|
+
.filter((option) => option.disabled || !option.selectable())
|
|
1658
|
+
.map((option) => option.data);
|
|
1659
|
+
// Selection is applied at the data-node level (incl. collapsed/non-rendered nodes),
|
|
1660
|
+
// while the emitted events carry the selectable rendered options.
|
|
1661
|
+
const dataNodes = this.treeControl.dataNodes.filter((node) => !this.treeControl.isDisabled(node) && !nonSelectableDataNodes.includes(node));
|
|
1662
|
+
const selectableOptions = this.renderedOptions.filter((option) => !option.disabled && option.selectable());
|
|
1663
|
+
// `toggleSelectAll` returns the data nodes whose selection actually flipped — the source of
|
|
1664
|
+
// truth, unlike the cached `option.selected` which lags until change detection.
|
|
1665
|
+
const changed = toggleSelectAll({
|
|
1666
|
+
items: dataNodes,
|
|
1667
|
+
isSelectable: () => true,
|
|
1668
|
+
isSelected: (node) => this.selectionModel.isSelected(node),
|
|
1669
|
+
setSelected: (node, selected) => selected ? this.selectionModel.select(node) : this.selectionModel.deselect(node)
|
|
1670
|
+
}, { allowDeselect });
|
|
1671
|
+
const changedData = new Set(changed);
|
|
1672
|
+
const changedOptions = selectableOptions.filter((option) => changedData.has(option.data));
|
|
1673
|
+
// Skip `selectionChange` on a no-op (e.g. Ctrl+A while everything is already selected and
|
|
1674
|
+
// `allowDeselect` is off) so `KbqTreeSelectionChange.option` is never `undefined`.
|
|
1675
|
+
if (changedOptions.length > 0) {
|
|
1676
|
+
this.selectionChange.emit(new KbqTreeSelectionChange(this, changedOptions[0], changedOptions));
|
|
1631
1677
|
}
|
|
1632
|
-
this.selectionChange.emit(new KbqTreeSelectionChange(this, changedOptions[0], changedOptions));
|
|
1633
1678
|
this.onSelectAll.emit(new KbqTreeSelectAllEvent(this, selectableOptions));
|
|
1634
1679
|
}
|
|
1635
1680
|
copyActiveOption(event) {
|
|
@@ -1660,7 +1705,7 @@ class KbqTreeSelection extends KbqTreeBase {
|
|
|
1660
1705
|
registerOnChange(fn) {
|
|
1661
1706
|
this.onChange = fn;
|
|
1662
1707
|
}
|
|
1663
|
-
// eslint-disable-next-line @typescript-eslint/
|
|
1708
|
+
// eslint-disable-next-line @typescript-eslint/no-empty-object-type
|
|
1664
1709
|
registerOnTouched(fn) {
|
|
1665
1710
|
this.onTouched = fn;
|
|
1666
1711
|
}
|
|
@@ -1731,11 +1776,7 @@ class KbqTreeSelection extends KbqTreeBase {
|
|
|
1731
1776
|
this.clipboard?.copy(this.keyManager.activeItem.value);
|
|
1732
1777
|
}
|
|
1733
1778
|
getHeight() {
|
|
1734
|
-
|
|
1735
|
-
// For SSR compatibility
|
|
1736
|
-
if (typeof element.getClientRects !== 'function')
|
|
1737
|
-
return 0;
|
|
1738
|
-
return element.getClientRects()[0]?.height ?? 0;
|
|
1779
|
+
return this.elementRef.nativeElement.getClientRects()[0]?.height ?? 0;
|
|
1739
1780
|
}
|
|
1740
1781
|
updateTabIndex() {
|
|
1741
1782
|
this._tabIndex = this.renderedOptions.length === 0 ? -1 : 0;
|
|
@@ -1808,18 +1849,22 @@ class KbqTreeSelection extends KbqTreeBase {
|
|
|
1808
1849
|
}
|
|
1809
1850
|
return $event.relatedTarget.classList.contains('kbq-tree-option');
|
|
1810
1851
|
}
|
|
1811
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1812
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
1852
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: KbqTreeSelection, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1853
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.25", type: KbqTreeSelection, isStandalone: true, selector: "kbq-tree-selection", inputs: { treeControl: { classPropertyName: "treeControl", publicName: "treeControl", isSignal: false, isRequired: false, transformFunction: null }, autoSelect: { classPropertyName: "autoSelect", publicName: "autoSelect", isSignal: false, isRequired: false, transformFunction: null }, noUnselectLast: { classPropertyName: "noUnselectLast", publicName: "noUnselectLast", isSignal: false, isRequired: false, transformFunction: null }, selectAllToggle: { classPropertyName: "selectAllToggle", publicName: "selectAllToggle", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: null }, tabIndex: { classPropertyName: "tabIndex", publicName: "tabIndex", isSignal: false, isRequired: false, transformFunction: null }, selectAllHandler: { classPropertyName: "selectAllHandler", publicName: "selectAllHandler", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { navigationChange: "navigationChange", selectionChange: "selectionChange", onSelectAll: "onSelectAll", onCopy: "onCopy" }, host: { listeners: { "blur": "blur()", "focus": "focus($event)", "keydown": "onKeyDown($event)", "window:resize": "updateScrollSize()" }, properties: { "attr.tabindex": "tabIndex", "attr.disabled": "disabled || null" }, classAttribute: "kbq-tree-selection" }, providers: [
|
|
1813
1854
|
KBQ_SELECTION_TREE_VALUE_ACCESSOR,
|
|
1814
1855
|
{ provide: KBQ_TREE_OPTION_PARENT_COMPONENT, useExisting: KbqTreeSelection },
|
|
1815
1856
|
{ provide: KbqTreeBase, useExisting: KbqTreeSelection }
|
|
1816
|
-
], queries: [{ propertyName: "unorderedOptions", predicate: KbqTreeOption }], viewQueries: [{ propertyName: "nodeOutlet", first: true, predicate: KbqTreeNodeOutlet, descendants: true, static: true }], exportAs: ["kbqTreeSelection"], usesInheritance: true, ngImport: i0, template: '<ng-container kbqTreeNodeOutlet />', isInline: true, styles: [".kbq-tree-selection{display:block}.kbq-tree-selection:focus{outline:none}.kbq-tree-option{--kbq-option-background: var(--kbq-tree-default-container-background);background:var(--kbq-tree-default-container-background)}.kbq-tree-option .kbq-option-text{color:var(--kbq-tree-default-text-color)}.kbq-tree-option .kbq-tree-node-toggle .kbq-icon.kbq-empty,.kbq-tree-option .kbq-icon.kbq-empty.kbq-tree-node-toggle{color:var(--kbq-tree-default-tree-toggle-color)}.kbq-tree-option .kbq-option-action .kbq-icon.kbq-empty{color:var(--kbq-tree-default-action-button-color)}.kbq-tree-option .kbq-option-caption{color:var(--kbq-tree-default-caption-color)}.kbq-tree-option:not(.kbq-disabled):hover,.kbq-tree-option:not(.kbq-disabled).kbq-hovered,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused{--kbq-option-background: var(--kbq-tree-states-hover-container-background);background:var(--kbq-tree-states-hover-container-background)}.kbq-tree-option:not(.kbq-disabled):hover .kbq-option-text,.kbq-tree-option:not(.kbq-disabled).kbq-hovered .kbq-option-text,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused .kbq-option-text{color:var(--kbq-tree-states-hover-text-color)}.kbq-tree-option:not(.kbq-disabled):hover .kbq-tree-node-toggle .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled):hover .kbq-icon.kbq-empty.kbq-tree-node-toggle,.kbq-tree-option:not(.kbq-disabled).kbq-hovered .kbq-tree-node-toggle .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-hovered .kbq-icon.kbq-empty.kbq-tree-node-toggle,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused .kbq-tree-node-toggle .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused .kbq-icon.kbq-empty.kbq-tree-node-toggle{color:var(--kbq-tree-states-hover-tree-toggle-color)}.kbq-tree-option:not(.kbq-disabled):hover .kbq-option-action .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-hovered .kbq-option-action .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused .kbq-option-action .kbq-icon.kbq-empty{color:var(--kbq-tree-states-hover-action-button-color)}.kbq-tree-option:not(.kbq-disabled):hover .kbq-option-caption,.kbq-tree-option:not(.kbq-disabled).kbq-hovered .kbq-option-caption,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused .kbq-option-caption{color:var(--kbq-tree-states-hover-caption-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected{--kbq-option-background: var(--kbq-tree-states-selected-container-background);background:var(--kbq-tree-states-selected-container-background)}.kbq-tree-option:not(.kbq-disabled).kbq-selected .kbq-option-text{color:var(--kbq-tree-states-selected-text-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected .kbq-tree-node-toggle .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-selected .kbq-icon.kbq-empty.kbq-tree-node-toggle{color:var(--kbq-tree-states-selected-tree-toggle-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected .kbq-option-action .kbq-icon.kbq-empty{color:var(--kbq-tree-states-selected-action-button-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected .kbq-option-caption{color:var(--kbq-tree-states-selected-caption-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected:hover,.kbq-tree-option:not(.kbq-disabled).kbq-selected.kbq-hovered{--kbq-option-background: var(--kbq-tree-states-selected-hover-container-background);background:var(--kbq-tree-states-selected-hover-container-background)}.kbq-tree-option:not(.kbq-disabled).kbq-selected:hover .kbq-option-text,.kbq-tree-option:not(.kbq-disabled).kbq-selected.kbq-hovered .kbq-option-text{color:var(--kbq-tree-states-selected-hover-text-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected:hover .kbq-tree-node-toggle .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-selected:hover .kbq-icon.kbq-empty.kbq-tree-node-toggle,.kbq-tree-option:not(.kbq-disabled).kbq-selected.kbq-hovered .kbq-tree-node-toggle .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-selected.kbq-hovered .kbq-icon.kbq-empty.kbq-tree-node-toggle{color:var(--kbq-tree-states-selected-hover-tree-toggle-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected:hover .kbq-option-action .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-selected.kbq-hovered .kbq-option-action .kbq-icon.kbq-empty{color:var(--kbq-tree-states-selected-hover-action-button-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected:hover .kbq-option-caption,.kbq-tree-option:not(.kbq-disabled).kbq-selected.kbq-hovered .kbq-option-caption{color:var(--kbq-tree-states-selected-hover-caption-color)}.kbq-tree-option:not(.kbq-disabled).kbq-checked:not(.kbq-selected),.kbq-tree-option:not(.kbq-disabled).kbq-tree-option_multiple.kbq-selected{--kbq-option-background: var(--kbq-tree-multiple-states-selected-container-background);background:var(--kbq-tree-multiple-states-selected-container-background)}.kbq-tree-option:not(.kbq-disabled).kbq-checked:not(.kbq-selected):hover,.kbq-tree-option:not(.kbq-disabled).kbq-checked:not(.kbq-selected).kbq-hovered,.kbq-tree-option:not(.kbq-disabled).kbq-tree-option_multiple.kbq-selected:hover,.kbq-tree-option:not(.kbq-disabled).kbq-tree-option_multiple.kbq-selected.kbq-hovered{--kbq-option-background: var(--kbq-tree-multiple-states-selected-hover-container-background);background:var(--kbq-tree-multiple-states-selected-hover-container-background)}.kbq-tree-option.kbq-disabled{--kbq-option-background: var(--kbq-tree-states-disabled-container-background);background:var(--kbq-tree-states-disabled-container-background)}.kbq-tree-option.kbq-disabled .kbq-option-text{color:var(--kbq-tree-states-disabled-text-color)}.kbq-tree-option.kbq-disabled .kbq-tree-node-toggle .kbq-icon.kbq-empty,.kbq-tree-option.kbq-disabled .kbq-icon.kbq-empty.kbq-tree-node-toggle{color:var(--kbq-tree-states-disabled-tree-toggle-color)}.kbq-tree-option.kbq-disabled .kbq-option-action .kbq-icon.kbq-empty{color:var(--kbq-tree-states-disabled-action-button-color)}.kbq-tree-option.kbq-disabled .kbq-option-caption{color:var(--kbq-tree-states-disabled-caption-color)}.kbq-tree-option.kbq-disabled .kbq-icon.kbq-empty{color:var(--kbq-states-icon-disabled)}.cdk-keyboard-focused .kbq-tree-option.kbq-focused:not(.kbq-action-button-focused){border-color:var(--kbq-tree-states-focused-focus-outline-color)}.cdk-keyboard-focused .kbq-tree-option.kbq-focused:not(.kbq-action-button-focused) .kbq-action-container{display:flex}.kbq-tree-option{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-tree-option-caption{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", ".kbq-tree,.kbq-tree-selection{--kbq-tree-size-indent-level: var(--kbq-size-xxl);--kbq-tree-size-container-padding-right: var(--kbq-size-s);--kbq-tree-size-container-padding-vertical: var(--kbq-size-xxs);--kbq-tree-size-container-content-gap-horizontal: var(--kbq-size-s);--kbq-tree-size-container-content-gap-vertical: 0px;--kbq-tree-size-container-focus-outline-width: var(--kbq-size-3xs);--kbq-tree-size-text-padding-vertical: var(--kbq-size-3xs);--kbq-tree-option-border-radius: var(--kbq-size-border-radius);--kbq-tree-default-container-background: transparent;--kbq-tree-default-text-color: var(--kbq-foreground-contrast);--kbq-tree-default-icon-color: var(--kbq-icon-contrast);--kbq-tree-default-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-default-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-default-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-hover-container-background: var(--kbq-states-background-transparent-hover);--kbq-tree-states-active-container-background: var(--kbq-states-background-transparent-active);--kbq-tree-states-hover-text-color: var(--kbq-foreground-contrast);--kbq-tree-states-hover-icon-color: var(--kbq-icon-contrast);--kbq-tree-states-hover-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-hover-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-hover-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-focused-focus-outline-color: var(--kbq-states-line-focus-theme);--kbq-tree-states-selected-container-background: var(--kbq-background-theme-less);--kbq-tree-multiple-states-selected-container-background: var(--kbq-background-contrast-less);--kbq-tree-states-selected-text-color: var(--kbq-foreground-contrast);--kbq-tree-states-selected-icon-color: var(--kbq-icon-contrast);--kbq-tree-states-selected-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-selected-hover-container-background: var(--kbq-states-background-theme-less-hover);--kbq-tree-states-selected-active-container-background: var(--kbq-states-background-theme-less-active);--kbq-tree-multiple-states-selected-hover-container-background: var(--kbq-states-background-contrast-less-hover);--kbq-tree-multiple-states-selected-active-container-background: var(--kbq-states-background-contrast-less-active);--kbq-tree-states-selected-hover-text-color: var(--kbq-foreground-contrast);--kbq-tree-states-selected-hover-icon-color: var(--kbq-icon-contrast);--kbq-tree-states-selected-hover-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-hover-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-hover-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-disabled-container-background: transparent;--kbq-tree-states-disabled-text-color: var(--kbq-states-foreground-disabled);--kbq-tree-states-disabled-icon-color: var(--kbq-states-icon-disabled);--kbq-tree-states-disabled-tree-toggle-color: var(--kbq-states-icon-disabled);--kbq-tree-states-disabled-action-button-color: var(--kbq-states-icon-disabled);--kbq-tree-states-disabled-caption-color: var(--kbq-states-foreground-disabled)}\n"], dependencies: [{ kind: "directive", type: KbqTreeNodeOutlet, selector: "[kbqTreeNodeOutlet]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
1857
|
+
], queries: [{ propertyName: "unorderedOptions", predicate: KbqTreeOption }], viewQueries: [{ propertyName: "nodeOutlet", first: true, predicate: KbqTreeNodeOutlet, descendants: true, static: true }], exportAs: ["kbqTreeSelection"], usesInheritance: true, ngImport: i0, template: '<ng-container kbqTreeNodeOutlet />', isInline: true, styles: [".kbq-tree-selection{display:block}.kbq-tree-selection:focus{outline:none}.kbq-tree-option{--kbq-option-background: var(--kbq-tree-default-container-background);background:var(--kbq-tree-default-container-background)}.kbq-tree-option .kbq-option-text{color:var(--kbq-tree-default-text-color)}.kbq-tree-option .kbq-option-action .kbq-icon.kbq-empty{color:var(--kbq-tree-default-action-button-color)}.kbq-tree-option .kbq-option-caption{color:var(--kbq-tree-default-caption-color)}.kbq-tree-option:not(.kbq-disabled):hover,.kbq-tree-option:not(.kbq-disabled).kbq-hovered,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused{--kbq-option-background: var(--kbq-tree-states-hover-container-background);background:var(--kbq-tree-states-hover-container-background)}.kbq-tree-option:not(.kbq-disabled):hover .kbq-option-text,.kbq-tree-option:not(.kbq-disabled).kbq-hovered .kbq-option-text,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused .kbq-option-text{color:var(--kbq-tree-states-hover-text-color)}.kbq-tree-option:not(.kbq-disabled):hover .kbq-option-action .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-hovered .kbq-option-action .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused .kbq-option-action .kbq-icon.kbq-empty{color:var(--kbq-tree-states-hover-action-button-color)}.kbq-tree-option:not(.kbq-disabled):hover .kbq-option-caption,.kbq-tree-option:not(.kbq-disabled).kbq-hovered .kbq-option-caption,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused .kbq-option-caption{color:var(--kbq-tree-states-hover-caption-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected{--kbq-option-background: var(--kbq-tree-states-selected-container-background);background:var(--kbq-tree-states-selected-container-background)}.kbq-tree-option:not(.kbq-disabled).kbq-selected .kbq-option-text{color:var(--kbq-tree-states-selected-text-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected .kbq-option-action .kbq-icon.kbq-empty{color:var(--kbq-tree-states-selected-action-button-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected .kbq-option-caption{color:var(--kbq-tree-states-selected-caption-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected:hover,.kbq-tree-option:not(.kbq-disabled).kbq-selected.kbq-hovered{--kbq-option-background: var(--kbq-tree-states-selected-hover-container-background);background:var(--kbq-tree-states-selected-hover-container-background)}.kbq-tree-option:not(.kbq-disabled).kbq-selected:hover .kbq-option-text,.kbq-tree-option:not(.kbq-disabled).kbq-selected.kbq-hovered .kbq-option-text{color:var(--kbq-tree-states-selected-hover-text-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected:hover .kbq-option-action .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-selected.kbq-hovered .kbq-option-action .kbq-icon.kbq-empty{color:var(--kbq-tree-states-selected-hover-action-button-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected:hover .kbq-option-caption,.kbq-tree-option:not(.kbq-disabled).kbq-selected.kbq-hovered .kbq-option-caption{color:var(--kbq-tree-states-selected-hover-caption-color)}.kbq-tree-option:not(.kbq-disabled).kbq-checked:not(.kbq-selected),.kbq-tree-option:not(.kbq-disabled).kbq-tree-option_multiple.kbq-selected{--kbq-option-background: var(--kbq-tree-multiple-states-selected-container-background);background:var(--kbq-tree-multiple-states-selected-container-background)}.kbq-tree-option:not(.kbq-disabled).kbq-checked:not(.kbq-selected):hover,.kbq-tree-option:not(.kbq-disabled).kbq-checked:not(.kbq-selected).kbq-hovered,.kbq-tree-option:not(.kbq-disabled).kbq-tree-option_multiple.kbq-selected:hover,.kbq-tree-option:not(.kbq-disabled).kbq-tree-option_multiple.kbq-selected.kbq-hovered{--kbq-option-background: var(--kbq-tree-multiple-states-selected-hover-container-background);background:var(--kbq-tree-multiple-states-selected-hover-container-background)}.kbq-tree-option.kbq-disabled{--kbq-option-background: var(--kbq-tree-states-disabled-container-background);background:var(--kbq-tree-states-disabled-container-background)}.kbq-tree-option.kbq-disabled .kbq-option-text{color:var(--kbq-tree-states-disabled-text-color)}.kbq-tree-option.kbq-disabled .kbq-option-action .kbq-icon.kbq-empty{color:var(--kbq-tree-states-disabled-action-button-color)}.kbq-tree-option.kbq-disabled .kbq-option-caption{color:var(--kbq-tree-states-disabled-caption-color)}.kbq-tree-option.kbq-disabled .kbq-icon.kbq-empty:not(.kbq-tree-node-toggle .kbq-icon){color:var(--kbq-states-icon-disabled)}.cdk-keyboard-focused .kbq-tree-option.kbq-focused:not(.kbq-action-button-focused){border-color:var(--kbq-tree-states-focused-focus-outline-color)}.cdk-keyboard-focused .kbq-tree-option.kbq-focused:not(.kbq-action-button-focused) .kbq-action-container{display:flex}.kbq-tree-option{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-option-caption{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", ".kbq-tree,.kbq-tree-selection{--kbq-tree-size-indent-level: var(--kbq-size-xxl);--kbq-tree-size-container-padding-right: var(--kbq-size-s);--kbq-tree-size-container-padding-vertical: var(--kbq-size-xxs);--kbq-tree-size-container-content-gap-horizontal: var(--kbq-size-s);--kbq-tree-size-container-content-gap-vertical: 0px;--kbq-tree-size-container-focus-outline-width: var(--kbq-size-3xs);--kbq-tree-size-text-padding-vertical: var(--kbq-size-3xs);--kbq-tree-option-border-radius: var(--kbq-size-border-radius);--kbq-tree-default-container-background: transparent;--kbq-tree-default-text-color: var(--kbq-foreground-contrast);--kbq-tree-default-icon-color: var(--kbq-icon-contrast);--kbq-tree-default-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-default-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-default-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-hover-container-background: var(--kbq-states-background-transparent-hover);--kbq-tree-states-active-container-background: var(--kbq-states-background-transparent-active);--kbq-tree-states-hover-text-color: var(--kbq-foreground-contrast);--kbq-tree-states-hover-icon-color: var(--kbq-icon-contrast);--kbq-tree-states-hover-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-hover-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-hover-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-focused-focus-outline-color: var(--kbq-states-line-focus-theme);--kbq-tree-states-selected-container-background: var(--kbq-background-theme-less);--kbq-tree-multiple-states-selected-container-background: var(--kbq-background-contrast-less);--kbq-tree-states-selected-text-color: var(--kbq-foreground-contrast);--kbq-tree-states-selected-icon-color: var(--kbq-icon-contrast);--kbq-tree-states-selected-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-selected-hover-container-background: var(--kbq-states-background-theme-less-hover);--kbq-tree-states-selected-active-container-background: var(--kbq-states-background-theme-less-active);--kbq-tree-multiple-states-selected-hover-container-background: var(--kbq-states-background-contrast-less-hover);--kbq-tree-multiple-states-selected-active-container-background: var(--kbq-states-background-contrast-less-active);--kbq-tree-states-selected-hover-text-color: var(--kbq-foreground-contrast);--kbq-tree-states-selected-hover-icon-color: var(--kbq-icon-contrast);--kbq-tree-states-selected-hover-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-hover-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-hover-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-disabled-container-background: transparent;--kbq-tree-states-disabled-text-color: var(--kbq-states-foreground-disabled);--kbq-tree-states-disabled-icon-color: var(--kbq-states-icon-disabled);--kbq-tree-states-disabled-tree-toggle-color: var(--kbq-states-icon-disabled);--kbq-tree-states-disabled-action-button-color: var(--kbq-states-icon-disabled);--kbq-tree-states-disabled-caption-color: var(--kbq-states-foreground-disabled)}\n"], dependencies: [{ kind: "directive", type: KbqTreeNodeOutlet, selector: "[kbqTreeNodeOutlet]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
1817
1858
|
}
|
|
1818
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1859
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: KbqTreeSelection, decorators: [{
|
|
1819
1860
|
type: Component,
|
|
1820
1861
|
args: [{ selector: 'kbq-tree-selection', imports: [
|
|
1821
1862
|
KbqTreeNodeOutlet
|
|
1822
|
-
], template: '<ng-container kbqTreeNodeOutlet />',
|
|
1863
|
+
], template: '<ng-container kbqTreeNodeOutlet />', providers: [
|
|
1864
|
+
KBQ_SELECTION_TREE_VALUE_ACCESSOR,
|
|
1865
|
+
{ provide: KBQ_TREE_OPTION_PARENT_COMPONENT, useExisting: KbqTreeSelection },
|
|
1866
|
+
{ provide: KbqTreeBase, useExisting: KbqTreeSelection }
|
|
1867
|
+
], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
|
|
1823
1868
|
class: 'kbq-tree-selection',
|
|
1824
1869
|
'[attr.tabindex]': 'tabIndex',
|
|
1825
1870
|
'[attr.disabled]': 'disabled || null',
|
|
@@ -1827,17 +1872,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.21", ngImpo
|
|
|
1827
1872
|
'(focus)': 'focus($event)',
|
|
1828
1873
|
'(keydown)': 'onKeyDown($event)',
|
|
1829
1874
|
'(window:resize)': 'updateScrollSize()'
|
|
1830
|
-
},
|
|
1831
|
-
|
|
1832
|
-
{ provide: KBQ_TREE_OPTION_PARENT_COMPONENT, useExisting: KbqTreeSelection },
|
|
1833
|
-
{ provide: KbqTreeBase, useExisting: KbqTreeSelection }
|
|
1834
|
-
], styles: [".kbq-tree-selection{display:block}.kbq-tree-selection:focus{outline:none}.kbq-tree-option{--kbq-option-background: var(--kbq-tree-default-container-background);background:var(--kbq-tree-default-container-background)}.kbq-tree-option .kbq-option-text{color:var(--kbq-tree-default-text-color)}.kbq-tree-option .kbq-tree-node-toggle .kbq-icon.kbq-empty,.kbq-tree-option .kbq-icon.kbq-empty.kbq-tree-node-toggle{color:var(--kbq-tree-default-tree-toggle-color)}.kbq-tree-option .kbq-option-action .kbq-icon.kbq-empty{color:var(--kbq-tree-default-action-button-color)}.kbq-tree-option .kbq-option-caption{color:var(--kbq-tree-default-caption-color)}.kbq-tree-option:not(.kbq-disabled):hover,.kbq-tree-option:not(.kbq-disabled).kbq-hovered,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused{--kbq-option-background: var(--kbq-tree-states-hover-container-background);background:var(--kbq-tree-states-hover-container-background)}.kbq-tree-option:not(.kbq-disabled):hover .kbq-option-text,.kbq-tree-option:not(.kbq-disabled).kbq-hovered .kbq-option-text,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused .kbq-option-text{color:var(--kbq-tree-states-hover-text-color)}.kbq-tree-option:not(.kbq-disabled):hover .kbq-tree-node-toggle .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled):hover .kbq-icon.kbq-empty.kbq-tree-node-toggle,.kbq-tree-option:not(.kbq-disabled).kbq-hovered .kbq-tree-node-toggle .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-hovered .kbq-icon.kbq-empty.kbq-tree-node-toggle,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused .kbq-tree-node-toggle .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused .kbq-icon.kbq-empty.kbq-tree-node-toggle{color:var(--kbq-tree-states-hover-tree-toggle-color)}.kbq-tree-option:not(.kbq-disabled):hover .kbq-option-action .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-hovered .kbq-option-action .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused .kbq-option-action .kbq-icon.kbq-empty{color:var(--kbq-tree-states-hover-action-button-color)}.kbq-tree-option:not(.kbq-disabled):hover .kbq-option-caption,.kbq-tree-option:not(.kbq-disabled).kbq-hovered .kbq-option-caption,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused .kbq-option-caption{color:var(--kbq-tree-states-hover-caption-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected{--kbq-option-background: var(--kbq-tree-states-selected-container-background);background:var(--kbq-tree-states-selected-container-background)}.kbq-tree-option:not(.kbq-disabled).kbq-selected .kbq-option-text{color:var(--kbq-tree-states-selected-text-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected .kbq-tree-node-toggle .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-selected .kbq-icon.kbq-empty.kbq-tree-node-toggle{color:var(--kbq-tree-states-selected-tree-toggle-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected .kbq-option-action .kbq-icon.kbq-empty{color:var(--kbq-tree-states-selected-action-button-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected .kbq-option-caption{color:var(--kbq-tree-states-selected-caption-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected:hover,.kbq-tree-option:not(.kbq-disabled).kbq-selected.kbq-hovered{--kbq-option-background: var(--kbq-tree-states-selected-hover-container-background);background:var(--kbq-tree-states-selected-hover-container-background)}.kbq-tree-option:not(.kbq-disabled).kbq-selected:hover .kbq-option-text,.kbq-tree-option:not(.kbq-disabled).kbq-selected.kbq-hovered .kbq-option-text{color:var(--kbq-tree-states-selected-hover-text-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected:hover .kbq-tree-node-toggle .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-selected:hover .kbq-icon.kbq-empty.kbq-tree-node-toggle,.kbq-tree-option:not(.kbq-disabled).kbq-selected.kbq-hovered .kbq-tree-node-toggle .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-selected.kbq-hovered .kbq-icon.kbq-empty.kbq-tree-node-toggle{color:var(--kbq-tree-states-selected-hover-tree-toggle-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected:hover .kbq-option-action .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-selected.kbq-hovered .kbq-option-action .kbq-icon.kbq-empty{color:var(--kbq-tree-states-selected-hover-action-button-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected:hover .kbq-option-caption,.kbq-tree-option:not(.kbq-disabled).kbq-selected.kbq-hovered .kbq-option-caption{color:var(--kbq-tree-states-selected-hover-caption-color)}.kbq-tree-option:not(.kbq-disabled).kbq-checked:not(.kbq-selected),.kbq-tree-option:not(.kbq-disabled).kbq-tree-option_multiple.kbq-selected{--kbq-option-background: var(--kbq-tree-multiple-states-selected-container-background);background:var(--kbq-tree-multiple-states-selected-container-background)}.kbq-tree-option:not(.kbq-disabled).kbq-checked:not(.kbq-selected):hover,.kbq-tree-option:not(.kbq-disabled).kbq-checked:not(.kbq-selected).kbq-hovered,.kbq-tree-option:not(.kbq-disabled).kbq-tree-option_multiple.kbq-selected:hover,.kbq-tree-option:not(.kbq-disabled).kbq-tree-option_multiple.kbq-selected.kbq-hovered{--kbq-option-background: var(--kbq-tree-multiple-states-selected-hover-container-background);background:var(--kbq-tree-multiple-states-selected-hover-container-background)}.kbq-tree-option.kbq-disabled{--kbq-option-background: var(--kbq-tree-states-disabled-container-background);background:var(--kbq-tree-states-disabled-container-background)}.kbq-tree-option.kbq-disabled .kbq-option-text{color:var(--kbq-tree-states-disabled-text-color)}.kbq-tree-option.kbq-disabled .kbq-tree-node-toggle .kbq-icon.kbq-empty,.kbq-tree-option.kbq-disabled .kbq-icon.kbq-empty.kbq-tree-node-toggle{color:var(--kbq-tree-states-disabled-tree-toggle-color)}.kbq-tree-option.kbq-disabled .kbq-option-action .kbq-icon.kbq-empty{color:var(--kbq-tree-states-disabled-action-button-color)}.kbq-tree-option.kbq-disabled .kbq-option-caption{color:var(--kbq-tree-states-disabled-caption-color)}.kbq-tree-option.kbq-disabled .kbq-icon.kbq-empty{color:var(--kbq-states-icon-disabled)}.cdk-keyboard-focused .kbq-tree-option.kbq-focused:not(.kbq-action-button-focused){border-color:var(--kbq-tree-states-focused-focus-outline-color)}.cdk-keyboard-focused .kbq-tree-option.kbq-focused:not(.kbq-action-button-focused) .kbq-action-container{display:flex}.kbq-tree-option{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-tree-option-caption{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", ".kbq-tree,.kbq-tree-selection{--kbq-tree-size-indent-level: var(--kbq-size-xxl);--kbq-tree-size-container-padding-right: var(--kbq-size-s);--kbq-tree-size-container-padding-vertical: var(--kbq-size-xxs);--kbq-tree-size-container-content-gap-horizontal: var(--kbq-size-s);--kbq-tree-size-container-content-gap-vertical: 0px;--kbq-tree-size-container-focus-outline-width: var(--kbq-size-3xs);--kbq-tree-size-text-padding-vertical: var(--kbq-size-3xs);--kbq-tree-option-border-radius: var(--kbq-size-border-radius);--kbq-tree-default-container-background: transparent;--kbq-tree-default-text-color: var(--kbq-foreground-contrast);--kbq-tree-default-icon-color: var(--kbq-icon-contrast);--kbq-tree-default-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-default-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-default-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-hover-container-background: var(--kbq-states-background-transparent-hover);--kbq-tree-states-active-container-background: var(--kbq-states-background-transparent-active);--kbq-tree-states-hover-text-color: var(--kbq-foreground-contrast);--kbq-tree-states-hover-icon-color: var(--kbq-icon-contrast);--kbq-tree-states-hover-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-hover-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-hover-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-focused-focus-outline-color: var(--kbq-states-line-focus-theme);--kbq-tree-states-selected-container-background: var(--kbq-background-theme-less);--kbq-tree-multiple-states-selected-container-background: var(--kbq-background-contrast-less);--kbq-tree-states-selected-text-color: var(--kbq-foreground-contrast);--kbq-tree-states-selected-icon-color: var(--kbq-icon-contrast);--kbq-tree-states-selected-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-selected-hover-container-background: var(--kbq-states-background-theme-less-hover);--kbq-tree-states-selected-active-container-background: var(--kbq-states-background-theme-less-active);--kbq-tree-multiple-states-selected-hover-container-background: var(--kbq-states-background-contrast-less-hover);--kbq-tree-multiple-states-selected-active-container-background: var(--kbq-states-background-contrast-less-active);--kbq-tree-states-selected-hover-text-color: var(--kbq-foreground-contrast);--kbq-tree-states-selected-hover-icon-color: var(--kbq-icon-contrast);--kbq-tree-states-selected-hover-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-hover-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-hover-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-disabled-container-background: transparent;--kbq-tree-states-disabled-text-color: var(--kbq-states-foreground-disabled);--kbq-tree-states-disabled-icon-color: var(--kbq-states-icon-disabled);--kbq-tree-states-disabled-tree-toggle-color: var(--kbq-states-icon-disabled);--kbq-tree-states-disabled-action-button-color: var(--kbq-states-icon-disabled);--kbq-tree-states-disabled-caption-color: var(--kbq-states-foreground-disabled)}\n"] }]
|
|
1835
|
-
}], ctorParameters: () => [{ type: i0.ElementRef }, { type: i1.AsyncScheduler }, { type: i0.IterableDiffers }, { type: i0.ChangeDetectorRef }, { type: i3$1.MultipleMode, decorators: [{
|
|
1836
|
-
type: Attribute,
|
|
1837
|
-
args: ['multiple']
|
|
1838
|
-
}] }, { type: i2.Clipboard, decorators: [{
|
|
1839
|
-
type: Optional
|
|
1840
|
-
}] }], propDecorators: { nodeOutlet: [{
|
|
1875
|
+
}, exportAs: 'kbqTreeSelection', styles: [".kbq-tree-selection{display:block}.kbq-tree-selection:focus{outline:none}.kbq-tree-option{--kbq-option-background: var(--kbq-tree-default-container-background);background:var(--kbq-tree-default-container-background)}.kbq-tree-option .kbq-option-text{color:var(--kbq-tree-default-text-color)}.kbq-tree-option .kbq-option-action .kbq-icon.kbq-empty{color:var(--kbq-tree-default-action-button-color)}.kbq-tree-option .kbq-option-caption{color:var(--kbq-tree-default-caption-color)}.kbq-tree-option:not(.kbq-disabled):hover,.kbq-tree-option:not(.kbq-disabled).kbq-hovered,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused{--kbq-option-background: var(--kbq-tree-states-hover-container-background);background:var(--kbq-tree-states-hover-container-background)}.kbq-tree-option:not(.kbq-disabled):hover .kbq-option-text,.kbq-tree-option:not(.kbq-disabled).kbq-hovered .kbq-option-text,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused .kbq-option-text{color:var(--kbq-tree-states-hover-text-color)}.kbq-tree-option:not(.kbq-disabled):hover .kbq-option-action .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-hovered .kbq-option-action .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused .kbq-option-action .kbq-icon.kbq-empty{color:var(--kbq-tree-states-hover-action-button-color)}.kbq-tree-option:not(.kbq-disabled):hover .kbq-option-caption,.kbq-tree-option:not(.kbq-disabled).kbq-hovered .kbq-option-caption,.kbq-tree-option:not(.kbq-disabled).kbq-action-button-focused .kbq-option-caption{color:var(--kbq-tree-states-hover-caption-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected{--kbq-option-background: var(--kbq-tree-states-selected-container-background);background:var(--kbq-tree-states-selected-container-background)}.kbq-tree-option:not(.kbq-disabled).kbq-selected .kbq-option-text{color:var(--kbq-tree-states-selected-text-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected .kbq-option-action .kbq-icon.kbq-empty{color:var(--kbq-tree-states-selected-action-button-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected .kbq-option-caption{color:var(--kbq-tree-states-selected-caption-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected:hover,.kbq-tree-option:not(.kbq-disabled).kbq-selected.kbq-hovered{--kbq-option-background: var(--kbq-tree-states-selected-hover-container-background);background:var(--kbq-tree-states-selected-hover-container-background)}.kbq-tree-option:not(.kbq-disabled).kbq-selected:hover .kbq-option-text,.kbq-tree-option:not(.kbq-disabled).kbq-selected.kbq-hovered .kbq-option-text{color:var(--kbq-tree-states-selected-hover-text-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected:hover .kbq-option-action .kbq-icon.kbq-empty,.kbq-tree-option:not(.kbq-disabled).kbq-selected.kbq-hovered .kbq-option-action .kbq-icon.kbq-empty{color:var(--kbq-tree-states-selected-hover-action-button-color)}.kbq-tree-option:not(.kbq-disabled).kbq-selected:hover .kbq-option-caption,.kbq-tree-option:not(.kbq-disabled).kbq-selected.kbq-hovered .kbq-option-caption{color:var(--kbq-tree-states-selected-hover-caption-color)}.kbq-tree-option:not(.kbq-disabled).kbq-checked:not(.kbq-selected),.kbq-tree-option:not(.kbq-disabled).kbq-tree-option_multiple.kbq-selected{--kbq-option-background: var(--kbq-tree-multiple-states-selected-container-background);background:var(--kbq-tree-multiple-states-selected-container-background)}.kbq-tree-option:not(.kbq-disabled).kbq-checked:not(.kbq-selected):hover,.kbq-tree-option:not(.kbq-disabled).kbq-checked:not(.kbq-selected).kbq-hovered,.kbq-tree-option:not(.kbq-disabled).kbq-tree-option_multiple.kbq-selected:hover,.kbq-tree-option:not(.kbq-disabled).kbq-tree-option_multiple.kbq-selected.kbq-hovered{--kbq-option-background: var(--kbq-tree-multiple-states-selected-hover-container-background);background:var(--kbq-tree-multiple-states-selected-hover-container-background)}.kbq-tree-option.kbq-disabled{--kbq-option-background: var(--kbq-tree-states-disabled-container-background);background:var(--kbq-tree-states-disabled-container-background)}.kbq-tree-option.kbq-disabled .kbq-option-text{color:var(--kbq-tree-states-disabled-text-color)}.kbq-tree-option.kbq-disabled .kbq-option-action .kbq-icon.kbq-empty{color:var(--kbq-tree-states-disabled-action-button-color)}.kbq-tree-option.kbq-disabled .kbq-option-caption{color:var(--kbq-tree-states-disabled-caption-color)}.kbq-tree-option.kbq-disabled .kbq-icon.kbq-empty:not(.kbq-tree-node-toggle .kbq-icon){color:var(--kbq-states-icon-disabled)}.cdk-keyboard-focused .kbq-tree-option.kbq-focused:not(.kbq-action-button-focused){border-color:var(--kbq-tree-states-focused-focus-outline-color)}.cdk-keyboard-focused .kbq-tree-option.kbq-focused:not(.kbq-action-button-focused) .kbq-action-container{display:flex}.kbq-tree-option{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-option-caption{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", ".kbq-tree,.kbq-tree-selection{--kbq-tree-size-indent-level: var(--kbq-size-xxl);--kbq-tree-size-container-padding-right: var(--kbq-size-s);--kbq-tree-size-container-padding-vertical: var(--kbq-size-xxs);--kbq-tree-size-container-content-gap-horizontal: var(--kbq-size-s);--kbq-tree-size-container-content-gap-vertical: 0px;--kbq-tree-size-container-focus-outline-width: var(--kbq-size-3xs);--kbq-tree-size-text-padding-vertical: var(--kbq-size-3xs);--kbq-tree-option-border-radius: var(--kbq-size-border-radius);--kbq-tree-default-container-background: transparent;--kbq-tree-default-text-color: var(--kbq-foreground-contrast);--kbq-tree-default-icon-color: var(--kbq-icon-contrast);--kbq-tree-default-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-default-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-default-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-hover-container-background: var(--kbq-states-background-transparent-hover);--kbq-tree-states-active-container-background: var(--kbq-states-background-transparent-active);--kbq-tree-states-hover-text-color: var(--kbq-foreground-contrast);--kbq-tree-states-hover-icon-color: var(--kbq-icon-contrast);--kbq-tree-states-hover-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-hover-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-hover-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-focused-focus-outline-color: var(--kbq-states-line-focus-theme);--kbq-tree-states-selected-container-background: var(--kbq-background-theme-less);--kbq-tree-multiple-states-selected-container-background: var(--kbq-background-contrast-less);--kbq-tree-states-selected-text-color: var(--kbq-foreground-contrast);--kbq-tree-states-selected-icon-color: var(--kbq-icon-contrast);--kbq-tree-states-selected-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-selected-hover-container-background: var(--kbq-states-background-theme-less-hover);--kbq-tree-states-selected-active-container-background: var(--kbq-states-background-theme-less-active);--kbq-tree-multiple-states-selected-hover-container-background: var(--kbq-states-background-contrast-less-hover);--kbq-tree-multiple-states-selected-active-container-background: var(--kbq-states-background-contrast-less-active);--kbq-tree-states-selected-hover-text-color: var(--kbq-foreground-contrast);--kbq-tree-states-selected-hover-icon-color: var(--kbq-icon-contrast);--kbq-tree-states-selected-hover-tree-toggle-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-hover-action-button-color: var(--kbq-icon-contrast-fade);--kbq-tree-states-selected-hover-caption-color: var(--kbq-foreground-contrast-secondary);--kbq-tree-states-disabled-container-background: transparent;--kbq-tree-states-disabled-text-color: var(--kbq-states-foreground-disabled);--kbq-tree-states-disabled-icon-color: var(--kbq-states-icon-disabled);--kbq-tree-states-disabled-tree-toggle-color: var(--kbq-states-icon-disabled);--kbq-tree-states-disabled-action-button-color: var(--kbq-states-icon-disabled);--kbq-tree-states-disabled-caption-color: var(--kbq-states-foreground-disabled)}\n"] }]
|
|
1876
|
+
}], ctorParameters: () => [], propDecorators: { nodeOutlet: [{
|
|
1841
1877
|
type: ViewChild,
|
|
1842
1878
|
args: [KbqTreeNodeOutlet, { static: true }]
|
|
1843
1879
|
}], unorderedOptions: [{
|
|
@@ -1845,22 +1881,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.21", ngImpo
|
|
|
1845
1881
|
args: [KbqTreeOption]
|
|
1846
1882
|
}], treeControl: [{
|
|
1847
1883
|
type: Input
|
|
1848
|
-
}], navigationChange: [{
|
|
1849
|
-
type: Output
|
|
1850
|
-
}], selectionChange: [{
|
|
1851
|
-
type: Output
|
|
1852
|
-
}], onSelectAll: [{
|
|
1884
|
+
}], navigationChange: [{ type: i0.Output, args: ["navigationChange"] }], selectionChange: [{
|
|
1853
1885
|
type: Output
|
|
1854
|
-
}], onCopy: [{
|
|
1886
|
+
}], onSelectAll: [{ type: i0.Output, args: ["onSelectAll"] }], onCopy: [{
|
|
1855
1887
|
type: Output
|
|
1856
1888
|
}], autoSelect: [{
|
|
1857
1889
|
type: Input
|
|
1858
1890
|
}], noUnselectLast: [{
|
|
1859
1891
|
type: Input
|
|
1860
|
-
}], disabled: [{
|
|
1892
|
+
}], selectAllToggle: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectAllToggle", required: false }] }], disabled: [{
|
|
1861
1893
|
type: Input
|
|
1862
1894
|
}], tabIndex: [{
|
|
1863
1895
|
type: Input
|
|
1896
|
+
}], selectAllHandler: [{
|
|
1897
|
+
type: Input
|
|
1864
1898
|
}] } });
|
|
1865
1899
|
|
|
1866
1900
|
const KBQ_TREE_DIRECTIVES = [
|
|
@@ -1875,8 +1909,8 @@ const KBQ_TREE_DIRECTIVES = [
|
|
|
1875
1909
|
KbqTreeNodeToggleDirective
|
|
1876
1910
|
];
|
|
1877
1911
|
class KbqTreeModule {
|
|
1878
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1879
|
-
/** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
|
|
1912
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: KbqTreeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
1913
|
+
/** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.25", ngImport: i0, type: KbqTreeModule, imports: [KbqPseudoCheckboxModule,
|
|
1880
1914
|
KbqIconModule,
|
|
1881
1915
|
KbqActionContainer, KbqTreeNodeOutlet,
|
|
1882
1916
|
KbqTreeNodeDef,
|
|
@@ -1895,12 +1929,12 @@ class KbqTreeModule {
|
|
|
1895
1929
|
KbqTreeOption,
|
|
1896
1930
|
KbqTreeNodeToggleComponent,
|
|
1897
1931
|
KbqTreeNodeToggleDirective] }); }
|
|
1898
|
-
/** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
|
|
1932
|
+
/** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: KbqTreeModule, providers: [{ provide: AsyncScheduler, useValue: asyncScheduler }], imports: [KbqPseudoCheckboxModule,
|
|
1899
1933
|
KbqIconModule,
|
|
1900
1934
|
KbqActionContainer, KbqTreeOption,
|
|
1901
1935
|
KbqTreeNodeToggleComponent] }); }
|
|
1902
1936
|
}
|
|
1903
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1937
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: KbqTreeModule, decorators: [{
|
|
1904
1938
|
type: NgModule,
|
|
1905
1939
|
args: [{
|
|
1906
1940
|
imports: [
|
|
@@ -1909,8 +1943,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.21", ngImpo
|
|
|
1909
1943
|
KbqActionContainer,
|
|
1910
1944
|
...KBQ_TREE_DIRECTIVES
|
|
1911
1945
|
],
|
|
1912
|
-
|
|
1913
|
-
|
|
1946
|
+
providers: [{ provide: AsyncScheduler, useValue: asyncScheduler }],
|
|
1947
|
+
exports: KBQ_TREE_DIRECTIVES
|
|
1914
1948
|
}]
|
|
1915
1949
|
}] });
|
|
1916
1950
|
|