@koobiq/components 20.2.0 → 20.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/accordion/_accordion-theme.scss +5 -1
- package/accordion/accordion-tokens.scss +2 -0
- package/accordion/accordion-trigger.scss +6 -0
- package/accordion/accordion.scss +21 -0
- package/accordion/index.d.ts +55 -8
- package/actions-panel/index.d.ts +25 -13
- package/app-switcher/app-switcher-dropdown-app.scss +7 -5
- package/app-switcher/app-switcher-dropdown-site.scss +6 -4
- package/app-switcher/index.d.ts +41 -4
- package/app-switcher/kbq-app-switcher-list-item.scss +6 -8
- package/autocomplete/index.d.ts +24 -9
- package/breadcrumbs/index.d.ts +1 -1
- package/button/index.d.ts +2 -2
- package/button-toggle/button-toggle-tokens.scss +2 -0
- package/button-toggle/button-toggle.scss +9 -0
- package/button-toggle/index.d.ts +5 -0
- package/checkbox/index.d.ts +33 -29
- package/clamped-text/index.d.ts +1 -1
- package/code-block/index.d.ts +24 -19
- package/content-panel/index.d.ts +1 -1
- package/core/index.d.ts +1125 -199
- package/core/option/_action-container-mixins.scss +28 -0
- package/core/option/_option-theme.scss +24 -0
- package/core/option/action.scss +7 -0
- package/core/styles/_koobiq-theme.scss +2 -0
- package/core/styles/_tokens.scss +1 -0
- package/core/styles/common/_connected-overlay.scss +6 -3
- package/core/styles/common/_select.scss +12 -0
- package/core/styles/common/_tokens.scss +0 -9
- package/core/styles/theming/_index.scss +0 -1
- package/core/styles/theming/_theming.scss +34 -5
- package/datepicker/index.d.ts +46 -15
- package/dl/dl.scss +26 -0
- package/dl/index.d.ts +8 -1
- package/dropdown/_dropdown-theme.scss +28 -2
- package/dropdown/dropdown-item.scss +13 -0
- package/dropdown/dropdown.scss +7 -1
- package/dropdown/index.d.ts +264 -17
- package/dynamic-translation/index.d.ts +1 -1
- package/fesm2022/koobiq-components-accordion.mjs +106 -46
- package/fesm2022/koobiq-components-accordion.mjs.map +1 -1
- package/fesm2022/koobiq-components-actions-panel.mjs +57 -46
- package/fesm2022/koobiq-components-actions-panel.mjs.map +1 -1
- package/fesm2022/koobiq-components-alert.mjs +16 -16
- package/fesm2022/koobiq-components-app-switcher.mjs +233 -38
- package/fesm2022/koobiq-components-app-switcher.mjs.map +1 -1
- package/fesm2022/koobiq-components-autocomplete.mjs +54 -31
- package/fesm2022/koobiq-components-autocomplete.mjs.map +1 -1
- package/fesm2022/koobiq-components-badge.mjs +13 -13
- package/fesm2022/koobiq-components-breadcrumbs.mjs +25 -25
- package/fesm2022/koobiq-components-breadcrumbs.mjs.map +1 -1
- package/fesm2022/koobiq-components-button-toggle.mjs +17 -12
- package/fesm2022/koobiq-components-button-toggle.mjs.map +1 -1
- package/fesm2022/koobiq-components-button.mjs +25 -25
- package/fesm2022/koobiq-components-checkbox.mjs +69 -92
- package/fesm2022/koobiq-components-checkbox.mjs.map +1 -1
- package/fesm2022/koobiq-components-clamped-text.mjs +13 -13
- package/fesm2022/koobiq-components-code-block.mjs +56 -69
- package/fesm2022/koobiq-components-code-block.mjs.map +1 -1
- package/fesm2022/koobiq-components-content-panel.mjs +29 -29
- package/fesm2022/koobiq-components-core.mjs +2445 -789
- package/fesm2022/koobiq-components-core.mjs.map +1 -1
- package/fesm2022/koobiq-components-datepicker.mjs +160 -121
- package/fesm2022/koobiq-components-datepicker.mjs.map +1 -1
- package/fesm2022/koobiq-components-divider.mjs +7 -7
- package/fesm2022/koobiq-components-dl.mjs +23 -15
- package/fesm2022/koobiq-components-dl.mjs.map +1 -1
- package/fesm2022/koobiq-components-dropdown.mjs +754 -155
- package/fesm2022/koobiq-components-dropdown.mjs.map +1 -1
- package/fesm2022/koobiq-components-dynamic-translation.mjs +13 -13
- package/fesm2022/koobiq-components-ellipsis-center.mjs +7 -7
- package/fesm2022/koobiq-components-empty-state.mjs +19 -19
- package/fesm2022/koobiq-components-file-upload.mjs +74 -42
- package/fesm2022/koobiq-components-file-upload.mjs.map +1 -1
- package/fesm2022/koobiq-components-filter-bar.mjs +605 -192
- package/fesm2022/koobiq-components-filter-bar.mjs.map +1 -1
- package/fesm2022/koobiq-components-flag.mjs +7 -7
- package/fesm2022/koobiq-components-form-field.mjs +346 -158
- package/fesm2022/koobiq-components-form-field.mjs.map +1 -1
- package/fesm2022/koobiq-components-icon.mjs +39 -21
- package/fesm2022/koobiq-components-icon.mjs.map +1 -1
- package/fesm2022/koobiq-components-inline-edit.mjs +172 -27
- package/fesm2022/koobiq-components-inline-edit.mjs.map +1 -1
- package/fesm2022/koobiq-components-input.mjs +41 -24
- package/fesm2022/koobiq-components-input.mjs.map +1 -1
- package/fesm2022/koobiq-components-link.mjs +8 -8
- package/fesm2022/koobiq-components-list.mjs +657 -143
- package/fesm2022/koobiq-components-list.mjs.map +1 -1
- package/fesm2022/koobiq-components-loader-overlay.mjs +16 -16
- package/fesm2022/koobiq-components-markdown.mjs +14 -11
- package/fesm2022/koobiq-components-markdown.mjs.map +1 -1
- package/fesm2022/koobiq-components-modal.mjs +59 -35
- package/fesm2022/koobiq-components-modal.mjs.map +1 -1
- package/fesm2022/koobiq-components-navbar.mjs +69 -54
- package/fesm2022/koobiq-components-navbar.mjs.map +1 -1
- package/fesm2022/koobiq-components-notification-center.mjs +23 -22
- package/fesm2022/koobiq-components-notification-center.mjs.map +1 -1
- package/fesm2022/koobiq-components-overflow-items.mjs +16 -17
- package/fesm2022/koobiq-components-overflow-items.mjs.map +1 -1
- package/fesm2022/koobiq-components-popover.mjs +26 -21
- package/fesm2022/koobiq-components-popover.mjs.map +1 -1
- package/fesm2022/koobiq-components-progress-bar.mjs +13 -13
- package/fesm2022/koobiq-components-progress-spinner.mjs +13 -13
- package/fesm2022/koobiq-components-radio.mjs +10 -10
- package/fesm2022/koobiq-components-resizer.mjs +33 -14
- package/fesm2022/koobiq-components-resizer.mjs.map +1 -1
- package/fesm2022/koobiq-components-scrollbar.mjs +10 -10
- package/fesm2022/koobiq-components-search-expandable.mjs +7 -7
- package/fesm2022/koobiq-components-search-expandable.mjs.map +1 -1
- package/fesm2022/koobiq-components-select.mjs +419 -106
- package/fesm2022/koobiq-components-select.mjs.map +1 -1
- package/fesm2022/koobiq-components-sidebar.mjs +14 -14
- package/fesm2022/koobiq-components-sidepanel.mjs +26 -26
- package/fesm2022/koobiq-components-skeleton.mjs +10 -10
- package/fesm2022/koobiq-components-split-button.mjs +7 -7
- package/fesm2022/koobiq-components-splitter.mjs +17 -17
- package/fesm2022/koobiq-components-table.mjs +15 -13
- package/fesm2022/koobiq-components-table.mjs.map +1 -1
- package/fesm2022/koobiq-components-tabs.mjs +54 -54
- package/fesm2022/koobiq-components-tabs.mjs.map +1 -1
- package/fesm2022/koobiq-components-tags.mjs +283 -122
- package/fesm2022/koobiq-components-tags.mjs.map +1 -1
- package/fesm2022/koobiq-components-textarea.mjs +13 -8
- package/fesm2022/koobiq-components-textarea.mjs.map +1 -1
- package/fesm2022/koobiq-components-time-range.mjs +29 -24
- package/fesm2022/koobiq-components-time-range.mjs.map +1 -1
- package/fesm2022/koobiq-components-timepicker.mjs +58 -26
- package/fesm2022/koobiq-components-timepicker.mjs.map +1 -1
- package/fesm2022/koobiq-components-timezone.mjs +76 -39
- package/fesm2022/koobiq-components-timezone.mjs.map +1 -1
- package/fesm2022/koobiq-components-title.mjs +7 -7
- package/fesm2022/koobiq-components-toast.mjs +51 -26
- package/fesm2022/koobiq-components-toast.mjs.map +1 -1
- package/fesm2022/koobiq-components-toggle.mjs +72 -64
- package/fesm2022/koobiq-components-toggle.mjs.map +1 -1
- package/fesm2022/koobiq-components-tooltip.mjs +115 -36
- package/fesm2022/koobiq-components-tooltip.mjs.map +1 -1
- package/fesm2022/koobiq-components-top-bar.mjs +13 -13
- package/fesm2022/koobiq-components-tree-select.mjs +189 -55
- package/fesm2022/koobiq-components-tree-select.mjs.map +1 -1
- package/fesm2022/koobiq-components-tree.mjs +302 -81
- package/fesm2022/koobiq-components-tree.mjs.map +1 -1
- package/fesm2022/koobiq-components-username.mjs +27 -27
- package/file-upload/index.d.ts +25 -6
- package/file-upload/multiple-file-upload.component.scss +14 -0
- package/filter-bar/_filter-bar-theme.scss +0 -6
- package/filter-bar/index.d.ts +222 -9
- package/filter-bar/pipes/pipe-multi-tree-select.scss +0 -6
- package/filter-bar/pipes/pipe-multiselect.scss +0 -6
- package/filter-bar/pipes/pipe-tree-select.scss +0 -6
- package/form-field/_form-field-theme.scss +76 -20
- package/form-field/fieldset.scss +10 -0
- package/form-field/form-field-tokens.scss +15 -1
- package/form-field/form-field.scss +15 -19
- package/form-field/index.d.ts +147 -65
- package/icon/index.d.ts +31 -6
- package/inline-edit/index.d.ts +57 -4
- package/inline-edit/inline-edit.scss +10 -0
- package/input/index.d.ts +17 -2
- package/list/_list-theme.scss +42 -10
- package/list/index.d.ts +326 -79
- package/list/list-tokens.scss +43 -8
- package/list/list.scss +186 -12
- package/markdown/index.d.ts +1 -1
- package/modal/index.d.ts +21 -4
- package/modal/modal-tokens.scss +1 -1
- package/navbar/index.d.ts +16 -1
- package/navbar/navbar-brand.scss +6 -0
- package/navbar/vertical-navbar.scss +6 -0
- package/notification-center/notification-item.scss +6 -0
- package/package.json +3 -6
- package/popover/index.d.ts +2 -2
- package/prebuilt-themes/dark-theme.css +1 -1
- package/prebuilt-themes/light-theme.css +1 -1
- package/prebuilt-themes/theme.css +1 -1
- package/resizer/index.d.ts +12 -0
- package/schematics/migrations/deprecated-icons/README.md +29 -4
- package/schematics/migrations/deprecated-icons/data.js +7 -0
- package/schematics/migrations/deprecated-icons/index.js +62 -35
- package/schematics/migrations/new-icons-pack/README.md +37 -2
- package/schematics/migrations/new-icons-pack/data.js +8 -0
- package/schematics/migrations/new-icons-pack/index.js +144 -53
- package/schematics/ng-add/index.js +3 -3
- package/schematics/utils/angular-parsing.js +30 -12
- package/schematics/utils/ast.js +31 -0
- package/schematics/utils/icon-migration.js +530 -0
- package/schematics/utils/typescript.js +44 -0
- package/scrollbar/index.d.ts +1 -1
- package/select/index.d.ts +163 -18
- package/select/select-tokens.scss +0 -1
- package/select/select.scss +0 -2
- package/splitter/index.d.ts +1 -1
- package/table/_table-theme.scss +4 -0
- package/table/index.d.ts +2 -1
- package/table/table.scss +8 -0
- package/tags/index.d.ts +128 -29
- package/textarea/index.d.ts +5 -0
- package/time-range/index.d.ts +1 -1
- package/timepicker/index.d.ts +4 -0
- package/timezone/index.d.ts +9 -5
- package/toast/index.d.ts +26 -3
- package/toggle/index.d.ts +34 -14
- package/tooltip/index.d.ts +54 -11
- package/tree/_tree-theme.scss +25 -5
- package/tree/index.d.ts +71 -3
- package/tree/tree-option.scss +2 -8
- package/tree-select/_tree-select-theme.scss +22 -0
- package/tree-select/index.d.ts +83 -16
- package/core/styles/_tokens.kbq.import.scss +0 -4
- package/core/styles/theming/_components-theming.scss +0 -1927
- package/filter-bar/pipes/pipe-select.scss +0 -5
- package/overflow-items/overflow-items.scss +0 -20
|
@@ -3,7 +3,7 @@ import { DOCUMENT } from '@angular/common';
|
|
|
3
3
|
import * as i0 from '@angular/core';
|
|
4
4
|
import { input, Directive, inject, NgZone, ElementRef, Renderer2, ChangeDetectorRef, output, contentChild, afterNextRender, Input, ViewEncapsulation, ChangeDetectionStrategy, Component, NgModule } from '@angular/core';
|
|
5
5
|
import { isControl, isInput, isLeftBracket, isRightBracket } from '@koobiq/components/core';
|
|
6
|
-
import { trigger, state,
|
|
6
|
+
import { trigger, state, style, transition, animate } from '@angular/animations';
|
|
7
7
|
|
|
8
8
|
var KbqSidebarAnimationState;
|
|
9
9
|
(function (KbqSidebarAnimationState) {
|
|
@@ -38,10 +38,10 @@ class KbqSidebarOpened {
|
|
|
38
38
|
this.width = input(undefined, ...(ngDevMode ? [{ debugName: "width" }] : []));
|
|
39
39
|
this.maxWidth = input(undefined, ...(ngDevMode ? [{ debugName: "maxWidth" }] : []));
|
|
40
40
|
}
|
|
41
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
42
|
-
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.
|
|
41
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqSidebarOpened, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
42
|
+
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.30", type: KbqSidebarOpened, isStandalone: true, selector: "[kbq-sidebar-opened]", inputs: { minWidth: { classPropertyName: "minWidth", publicName: "minWidth", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, maxWidth: { classPropertyName: "maxWidth", publicName: "maxWidth", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "kbq-sidebar-opened" }, exportAs: ["kbqSidebarOpened"], ngImport: i0 }); }
|
|
43
43
|
}
|
|
44
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
44
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqSidebarOpened, decorators: [{
|
|
45
45
|
type: Directive,
|
|
46
46
|
args: [{
|
|
47
47
|
selector: '[kbq-sidebar-opened]',
|
|
@@ -55,10 +55,10 @@ class KbqSidebarClosed {
|
|
|
55
55
|
constructor() {
|
|
56
56
|
this.width = input(undefined, ...(ngDevMode ? [{ debugName: "width" }] : []));
|
|
57
57
|
}
|
|
58
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
59
|
-
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.
|
|
58
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqSidebarClosed, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
59
|
+
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.30", type: KbqSidebarClosed, isStandalone: true, selector: "[kbq-sidebar-closed]", inputs: { width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "kbq-sidebar-closed" }, exportAs: ["kbqSidebarClosed"], ngImport: i0 }); }
|
|
60
60
|
}
|
|
61
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
61
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqSidebarClosed, decorators: [{
|
|
62
62
|
type: Directive,
|
|
63
63
|
args: [{
|
|
64
64
|
selector: '[kbq-sidebar-closed]',
|
|
@@ -180,10 +180,10 @@ class KbqSidebar {
|
|
|
180
180
|
return;
|
|
181
181
|
this.params.openedStateWidth = `${this.elementRef.nativeElement.offsetWidth}px`;
|
|
182
182
|
}
|
|
183
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
184
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.
|
|
183
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqSidebar, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
184
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.30", type: KbqSidebar, isStandalone: true, selector: "kbq-sidebar", inputs: { opened: { classPropertyName: "opened", publicName: "opened", isSignal: false, isRequired: false, transformFunction: null }, position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { stateChanged: "stateChanged" }, host: { listeners: { "@state.start": "onAnimationStart()", "@state.done": "onAnimationDone()" }, properties: { "@state": "{\n value: animationState,\n params: params\n }" }, classAttribute: "kbq-sidebar" }, queries: [{ propertyName: "openedContent", first: true, predicate: KbqSidebarOpened, descendants: true, isSignal: true }, { propertyName: "closedContent", first: true, predicate: KbqSidebarClosed, descendants: true, isSignal: true }], exportAs: ["kbqSidebar"], ngImport: i0, template: "@if (internalState) {\n <ng-content select=\"[kbq-sidebar-opened]\" />\n} @else {\n <ng-content select=\"[kbq-sidebar-closed]\" />\n}\n", styles: [".kbq-sidebar{display:inline-block;height:100%;overflow:hidden}.kbq-sidebar-opened,.kbq-sidebar-closed{height:100%}\n"], animations: [kbqSidebarAnimations.sidebarState], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
185
185
|
}
|
|
186
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
186
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqSidebar, decorators: [{
|
|
187
187
|
type: Component,
|
|
188
188
|
args: [{ selector: 'kbq-sidebar', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
|
|
189
189
|
class: 'kbq-sidebar',
|
|
@@ -199,13 +199,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
|
|
|
199
199
|
}], position: [{ type: i0.Input, args: [{ isSignal: true, alias: "position", required: false }] }], stateChanged: [{ type: i0.Output, args: ["stateChanged"] }], openedContent: [{ type: i0.ContentChild, args: [i0.forwardRef(() => KbqSidebarOpened), { isSignal: true }] }], closedContent: [{ type: i0.ContentChild, args: [i0.forwardRef(() => KbqSidebarClosed), { isSignal: true }] }] } });
|
|
200
200
|
|
|
201
201
|
class KbqSidebarModule {
|
|
202
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
203
|
-
/** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.
|
|
202
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqSidebarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
203
|
+
/** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.30", ngImport: i0, type: KbqSidebarModule, imports: [KbqSidebarClosed, KbqSidebarOpened, KbqSidebar], exports: [KbqSidebarClosed,
|
|
204
204
|
KbqSidebarOpened,
|
|
205
205
|
KbqSidebar] }); }
|
|
206
|
-
/** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.
|
|
206
|
+
/** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqSidebarModule }); }
|
|
207
207
|
}
|
|
208
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
208
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqSidebarModule, decorators: [{
|
|
209
209
|
type: NgModule,
|
|
210
210
|
args: [{
|
|
211
211
|
imports: [KbqSidebarClosed, KbqSidebarOpened, KbqSidebar],
|
|
@@ -3,7 +3,7 @@ import { InjectionToken, inject, ElementRef, ChangeDetectorRef, viewChild, Event
|
|
|
3
3
|
import { CdkTrapFocus, A11yModule, ConfigurableFocusTrapFactory, FocusTrapFactory } from '@angular/cdk/a11y';
|
|
4
4
|
import { BasePortalOutlet, CdkPortalOutlet, TemplatePortal, ComponentPortal, PortalModule } from '@angular/cdk/portal';
|
|
5
5
|
import { Subject, merge } from 'rxjs';
|
|
6
|
-
import { trigger, state,
|
|
6
|
+
import { trigger, state, style, transition, animate } from '@angular/animations';
|
|
7
7
|
import * as i3 from '@koobiq/components/core';
|
|
8
8
|
import { KbqAnimationDurations, KbqAnimationCurves, ESCAPE, isHtmlElement, KbqOverflowShadowContainer } from '@koobiq/components/core';
|
|
9
9
|
import * as i1 from '@koobiq/components/button';
|
|
@@ -202,10 +202,10 @@ class KbqSidepanelContainerComponent extends BasePortalOutlet {
|
|
|
202
202
|
throw Error('Attempting to attach sidepanel content after content is already attached');
|
|
203
203
|
}
|
|
204
204
|
}
|
|
205
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
206
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: KbqSidepanelContainerComponent, isStandalone: true, selector: "kbq-sidepanel-container", host: { listeners: { "@state.start": "onAnimation($event)", "@state.done": "onAnimation($event)" }, properties: { "class": "size", "class.kbq-sidepanel_nested": "withIndent", "attr.id": "id", "attr.tabindex": "-1", "@state": "{\n value: animationState,\n params: animationTransform\n }" }, classAttribute: "kbq-sidepanel-container kbq-sidepanel-container_shadowed" }, viewQueries: [{ propertyName: "portalOutlet", first: true, predicate: CdkPortalOutlet, descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"kbq-sidepanel-wrapper\">\n @if (withIndent) {\n <div class=\"kbq-sidepanel-indent\" (click)=\"indentClickEmitter.next($event)\"></div>\n }\n\n <div class=\"kbq-sidepanel-content\" [cdkTrapFocus]=\"trapFocus\" [cdkTrapFocusAutoCapture]=\"trapFocusAutoCapture\">\n <ng-template cdkPortalOutlet />\n </div>\n</div>\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-sidepanel-container{outline:none;display:flex;flex:1;position:fixed;min-height:0}.kbq-sidepanel-container .flex{min-height:0}.kbq-sidepanel-container.kbq-sidepanel-container_left,.kbq-sidepanel-container.kbq-sidepanel-container_right{height:100%;top:0;max-width:100%}.kbq-sidepanel-container.kbq-sidepanel-container_left.kbq-sidepanel_small,.kbq-sidepanel-container.kbq-sidepanel-container_right.kbq-sidepanel_small{width:var(--kbq-sidepanel-size-small-width);max-width:var(--kbq-sidepanel-size-small-width)}.kbq-sidepanel-container.kbq-sidepanel-container_left.kbq-sidepanel_medium,.kbq-sidepanel-container.kbq-sidepanel-container_right.kbq-sidepanel_medium{width:var(--kbq-sidepanel-size-medium-width);max-width:var(--kbq-sidepanel-size-medium-width)}.kbq-sidepanel-container.kbq-sidepanel-container_left.kbq-sidepanel_large,.kbq-sidepanel-container.kbq-sidepanel-container_right.kbq-sidepanel_large{width:var(--kbq-sidepanel-size-large-width)}.kbq-sidepanel-container.kbq-sidepanel-container_left .kbq-sidepanel-indent,.kbq-sidepanel-container.kbq-sidepanel-container_right .kbq-sidepanel-indent{width:var(--kbq-sidepanel-size-panel-lower-offset);height:100%}.kbq-sidepanel-container.kbq-sidepanel-container_top,.kbq-sidepanel-container.kbq-sidepanel-container_bottom{flex-direction:column;height:33%;min-height:400px;width:calc(100% - 2 * var(--kbq-sidepanel-size-panel-viewport-margin));left:0}.kbq-sidepanel-container.kbq-sidepanel-container_top .kbq-sidepanel-indent,.kbq-sidepanel-container.kbq-sidepanel-container_bottom .kbq-sidepanel-indent{height:var(--kbq-sidepanel-size-panel-lower-offset);width:100%}.kbq-sidepanel-container_right{right:0;transform:translate(100%)}.kbq-sidepanel-container_right .kbq-sidepanel-wrapper{flex-direction:row}.kbq-sidepanel-container_right .kbq-sidepanel-content{margin-top:var(--kbq-sidepanel-size-panel-viewport-margin);margin-right:var(--kbq-sidepanel-size-panel-viewport-margin);margin-bottom:var(--kbq-sidepanel-size-panel-viewport-margin)}.kbq-sidepanel-container_right{transform-origin:center left}.kbq-sidepanel-container_left{left:0;transform:translate(-100%)}.kbq-sidepanel-container_left .kbq-sidepanel-wrapper{flex-direction:row-reverse}.kbq-sidepanel-container_left .kbq-sidepanel-content{margin-top:var(--kbq-sidepanel-size-panel-viewport-margin);margin-bottom:var(--kbq-sidepanel-size-panel-viewport-margin);margin-left:var(--kbq-sidepanel-size-panel-viewport-margin)}.kbq-sidepanel-container_left{transform-origin:center right}.kbq-sidepanel-container_top{top:0;transform:translateY(-100%)}.kbq-sidepanel-container_top .kbq-sidepanel-wrapper{flex-direction:column-reverse}.kbq-sidepanel-container_top .kbq-sidepanel-content{margin-top:var(--kbq-sidepanel-size-panel-viewport-margin);margin-right:var(--kbq-sidepanel-size-panel-viewport-margin);margin-left:var(--kbq-sidepanel-size-panel-viewport-margin)}.kbq-sidepanel-container_top{transform-origin:center bottom}.kbq-sidepanel-container_bottom{bottom:0;transform:translateY(100%)}.kbq-sidepanel-container_bottom .kbq-sidepanel-wrapper{flex-direction:column}.kbq-sidepanel-container_bottom .kbq-sidepanel-content{margin-right:var(--kbq-sidepanel-size-panel-viewport-margin);margin-bottom:var(--kbq-sidepanel-size-panel-viewport-margin);margin-left:var(--kbq-sidepanel-size-panel-viewport-margin)}.kbq-sidepanel-container_bottom{transform-origin:center top}.kbq-sidepanel-wrapper{display:flex;flex:1;min-height:0;width:100%;position:relative}.kbq-sidepanel-indent{display:flex;flex:0 0 auto;cursor:pointer;position:absolute}.kbq-sidepanel-container_top .kbq-sidepanel-indent{bottom:calc(-1 * var(--kbq-sidepanel-size-panel-lower-offset))}.kbq-sidepanel-container_right .kbq-sidepanel-indent{left:calc(-1 * var(--kbq-sidepanel-size-panel-lower-offset))}.kbq-sidepanel-container_bottom .kbq-sidepanel-indent{top:calc(-1 * var(--kbq-sidepanel-size-panel-lower-offset))}.kbq-sidepanel-container_left .kbq-sidepanel-indent{right:calc(-1 * var(--kbq-sidepanel-size-panel-lower-offset))}.kbq-sidepanel-content{display:flex;flex-direction:column;flex:1;min-height:0;min-width:0;width:100%;border-radius:var(--kbq-size-border-radius)}.kbq-sidepanel-header{display:flex;align-items:baseline;justify-content:space-between;flex-flow:row nowrap;flex:0 0 auto;transition:box-shadow .1s ease-in-out;padding:var(--kbq-sidepanel-size-header-padding-vertical) var(--kbq-sidepanel-size-header-padding-right) var(--kbq-sidepanel-size-header-padding-vertical) var(--kbq-sidepanel-size-header-padding-left)}.kbq-sidepanel-header .kbq-sidepanel-close{margin-left:var(--kbq-sidepanel-size-close-button-margin-left)}.kbq-sidepanel-header.kbq-sidepanel-header_truncate-text{align-items:center}.kbq-sidepanel-header.kbq-sidepanel-header_truncate-text .kbq-sidepanel-title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kbq-sidepanel-title{flex:1}.kbq-sidepanel-body{overflow-y:auto;display:flex;flex:1;flex-direction:column;min-height:0;padding:var(--kbq-sidepanel-size-content-padding-top) var(--kbq-sidepanel-size-content-padding-horizontal) var(--kbq-sidepanel-size-content-padding-bottom)}.kbq-sidepanel-footer{display:flex;align-items:center;justify-content:space-between;flex-flow:row nowrap;flex:0 0 auto;transition:box-shadow .1s ease-in-out;padding:var(--kbq-sidepanel-size-footer-padding-top) var(--kbq-sidepanel-size-footer-padding-horizontal) var(--kbq-sidepanel-size-footer-padding-bottom)}.kbq-sidepanel-footer .kbq-sidepanel-actions{display:flex;align-items:center;flex-direction:row;flex:1}.kbq-sidepanel-footer .kbq-sidepanel-actions[align=left]{justify-content:start}.kbq-sidepanel-footer .kbq-sidepanel-actions[align=right]{justify-content:flex-end}.kbq-sidepanel-footer .kbq-sidepanel-actions{gap:var(--kbq-sidepanel-size-footer-content-gap-horizontal)}.kbq-sidepanel-title{color:var(--kbq-sidepanel-header-text-color)}.kbq-sidepanel-content{background-color:var(--kbq-sidepanel-container-background);color:var(--kbq-sidepanel-content-text-color)}.kbq-sidepanel-container_shadowed .kbq-sidepanel-content{box-shadow:var(--kbq-sidepanel-container-shadow)}.kbq-overlay-dark-backdrop{background:var(--kbq-background-overlay)!important}.kbq-sidepanel-title{font-size:var(--kbq-typography-title-font-size);font-style:var(--kbq-typography-title-font-style);font-weight:var(--kbq-typography-title-font-weight);line-height:var(--kbq-typography-title-line-height);font-family:var(--kbq-typography-title-font-family);text-transform:var(--kbq-typography-title-text-transform);font-feature-settings:var(--kbq-typography-title-font-feature-settings);letter-spacing:var(--kbq-typography-title-letter-spacing)}.kbq-sidepanel-container,.kbq-sidepanel-footer{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)}\n", ".kbq-sidepanel-container{--kbq-sidepanel-size-small-width: 400px;--kbq-sidepanel-size-medium-width: 640px;--kbq-sidepanel-size-large-width: 960px;--kbq-sidepanel-size-header-padding-vertical: var(--kbq-size-l);--kbq-sidepanel-size-header-padding-left: var(--kbq-size-xxl);--kbq-sidepanel-size-header-padding-right: var(--kbq-size-l);--kbq-sidepanel-size-close-button-margin-left: var(--kbq-size-s);--kbq-sidepanel-size-content-padding-horizontal: var(--kbq-size-xxl);--kbq-sidepanel-size-content-padding-bottom: var(--kbq-size-xxl);--kbq-sidepanel-size-panel-viewport-margin: var(--kbq-size-s);--kbq-sidepanel-size-panel-lower-offset: var(--kbq-size-l);--kbq-sidepanel-size-content-padding-top: 1px;--kbq-sidepanel-size-footer-padding-top: var(--kbq-size-xl);--kbq-sidepanel-size-footer-padding-bottom: var(--kbq-size-xl);--kbq-sidepanel-size-footer-padding-horizontal: var(--kbq-size-xxl);--kbq-sidepanel-size-footer-content-gap-horizontal: var(--kbq-size-l);--kbq-sidepanel-overlay-background: var(--kbq-background-overlay);--kbq-sidepanel-container-background: var(--kbq-background-card);--kbq-sidepanel-container-shadow: var(--kbq-shadow-popup);--kbq-sidepanel-header-text-color: var(--kbq-foreground-contrast);--kbq-sidepanel-content-text-color: var(--kbq-foreground-contrast)}\n"], dependencies: [{ kind: "directive", type: CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }, { kind: "directive", type: CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }], animations: [kbqSidepanelAnimations.sidepanelState], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
205
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqSidepanelContainerComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
206
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.30", type: KbqSidepanelContainerComponent, isStandalone: true, selector: "kbq-sidepanel-container", host: { listeners: { "@state.start": "onAnimation($event)", "@state.done": "onAnimation($event)" }, properties: { "class": "size", "class.kbq-sidepanel_nested": "withIndent", "attr.id": "id", "attr.tabindex": "-1", "@state": "{\n value: animationState,\n params: animationTransform\n }" }, classAttribute: "kbq-sidepanel-container kbq-sidepanel-container_shadowed" }, viewQueries: [{ propertyName: "portalOutlet", first: true, predicate: CdkPortalOutlet, descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"kbq-sidepanel-wrapper\">\n @if (withIndent) {\n <div class=\"kbq-sidepanel-indent\" (click)=\"indentClickEmitter.next($event)\"></div>\n }\n\n <div class=\"kbq-sidepanel-content\" [cdkTrapFocus]=\"trapFocus\" [cdkTrapFocusAutoCapture]=\"trapFocusAutoCapture\">\n <ng-template cdkPortalOutlet />\n </div>\n</div>\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-sidepanel-container{outline:none;display:flex;flex:1;position:fixed;min-height:0}.kbq-sidepanel-container .flex{min-height:0}.kbq-sidepanel-container.kbq-sidepanel-container_left,.kbq-sidepanel-container.kbq-sidepanel-container_right{height:100%;top:0;max-width:100%}.kbq-sidepanel-container.kbq-sidepanel-container_left.kbq-sidepanel_small,.kbq-sidepanel-container.kbq-sidepanel-container_right.kbq-sidepanel_small{width:var(--kbq-sidepanel-size-small-width);max-width:var(--kbq-sidepanel-size-small-width)}.kbq-sidepanel-container.kbq-sidepanel-container_left.kbq-sidepanel_medium,.kbq-sidepanel-container.kbq-sidepanel-container_right.kbq-sidepanel_medium{width:var(--kbq-sidepanel-size-medium-width);max-width:var(--kbq-sidepanel-size-medium-width)}.kbq-sidepanel-container.kbq-sidepanel-container_left.kbq-sidepanel_large,.kbq-sidepanel-container.kbq-sidepanel-container_right.kbq-sidepanel_large{width:var(--kbq-sidepanel-size-large-width)}.kbq-sidepanel-container.kbq-sidepanel-container_left .kbq-sidepanel-indent,.kbq-sidepanel-container.kbq-sidepanel-container_right .kbq-sidepanel-indent{width:var(--kbq-sidepanel-size-panel-lower-offset);height:100%}.kbq-sidepanel-container.kbq-sidepanel-container_top,.kbq-sidepanel-container.kbq-sidepanel-container_bottom{flex-direction:column;height:33%;min-height:400px;width:calc(100% - 2 * var(--kbq-sidepanel-size-panel-viewport-margin));left:0}.kbq-sidepanel-container.kbq-sidepanel-container_top .kbq-sidepanel-indent,.kbq-sidepanel-container.kbq-sidepanel-container_bottom .kbq-sidepanel-indent{height:var(--kbq-sidepanel-size-panel-lower-offset);width:100%}.kbq-sidepanel-container_right{right:0;transform:translate(100%)}.kbq-sidepanel-container_right .kbq-sidepanel-wrapper{flex-direction:row}.kbq-sidepanel-container_right .kbq-sidepanel-content{margin-top:var(--kbq-sidepanel-size-panel-viewport-margin);margin-right:var(--kbq-sidepanel-size-panel-viewport-margin);margin-bottom:var(--kbq-sidepanel-size-panel-viewport-margin)}.kbq-sidepanel-container_right{transform-origin:center left}.kbq-sidepanel-container_left{left:0;transform:translate(-100%)}.kbq-sidepanel-container_left .kbq-sidepanel-wrapper{flex-direction:row-reverse}.kbq-sidepanel-container_left .kbq-sidepanel-content{margin-top:var(--kbq-sidepanel-size-panel-viewport-margin);margin-bottom:var(--kbq-sidepanel-size-panel-viewport-margin);margin-left:var(--kbq-sidepanel-size-panel-viewport-margin)}.kbq-sidepanel-container_left{transform-origin:center right}.kbq-sidepanel-container_top{top:0;transform:translateY(-100%)}.kbq-sidepanel-container_top .kbq-sidepanel-wrapper{flex-direction:column-reverse}.kbq-sidepanel-container_top .kbq-sidepanel-content{margin-top:var(--kbq-sidepanel-size-panel-viewport-margin);margin-right:var(--kbq-sidepanel-size-panel-viewport-margin);margin-left:var(--kbq-sidepanel-size-panel-viewport-margin)}.kbq-sidepanel-container_top{transform-origin:center bottom}.kbq-sidepanel-container_bottom{bottom:0;transform:translateY(100%)}.kbq-sidepanel-container_bottom .kbq-sidepanel-wrapper{flex-direction:column}.kbq-sidepanel-container_bottom .kbq-sidepanel-content{margin-right:var(--kbq-sidepanel-size-panel-viewport-margin);margin-bottom:var(--kbq-sidepanel-size-panel-viewport-margin);margin-left:var(--kbq-sidepanel-size-panel-viewport-margin)}.kbq-sidepanel-container_bottom{transform-origin:center top}.kbq-sidepanel-wrapper{display:flex;flex:1;min-height:0;width:100%;position:relative}.kbq-sidepanel-indent{display:flex;flex:0 0 auto;cursor:pointer;position:absolute}.kbq-sidepanel-container_top .kbq-sidepanel-indent{bottom:calc(-1 * var(--kbq-sidepanel-size-panel-lower-offset))}.kbq-sidepanel-container_right .kbq-sidepanel-indent{left:calc(-1 * var(--kbq-sidepanel-size-panel-lower-offset))}.kbq-sidepanel-container_bottom .kbq-sidepanel-indent{top:calc(-1 * var(--kbq-sidepanel-size-panel-lower-offset))}.kbq-sidepanel-container_left .kbq-sidepanel-indent{right:calc(-1 * var(--kbq-sidepanel-size-panel-lower-offset))}.kbq-sidepanel-content{display:flex;flex-direction:column;flex:1;min-height:0;min-width:0;width:100%;border-radius:var(--kbq-size-border-radius)}.kbq-sidepanel-header{display:flex;align-items:baseline;justify-content:space-between;flex-flow:row nowrap;flex:0 0 auto;transition:box-shadow .1s ease-in-out;padding:var(--kbq-sidepanel-size-header-padding-vertical) var(--kbq-sidepanel-size-header-padding-right) var(--kbq-sidepanel-size-header-padding-vertical) var(--kbq-sidepanel-size-header-padding-left)}.kbq-sidepanel-header .kbq-sidepanel-close{margin-left:var(--kbq-sidepanel-size-close-button-margin-left)}.kbq-sidepanel-header.kbq-sidepanel-header_truncate-text{align-items:center}.kbq-sidepanel-header.kbq-sidepanel-header_truncate-text .kbq-sidepanel-title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kbq-sidepanel-title{flex:1}.kbq-sidepanel-body{overflow-y:auto;display:flex;flex:1;flex-direction:column;min-height:0;padding:var(--kbq-sidepanel-size-content-padding-top) var(--kbq-sidepanel-size-content-padding-horizontal) var(--kbq-sidepanel-size-content-padding-bottom)}.kbq-sidepanel-footer{display:flex;align-items:center;justify-content:space-between;flex-flow:row nowrap;flex:0 0 auto;transition:box-shadow .1s ease-in-out;padding:var(--kbq-sidepanel-size-footer-padding-top) var(--kbq-sidepanel-size-footer-padding-horizontal) var(--kbq-sidepanel-size-footer-padding-bottom)}.kbq-sidepanel-footer .kbq-sidepanel-actions{display:flex;align-items:center;flex-direction:row;flex:1}.kbq-sidepanel-footer .kbq-sidepanel-actions[align=left]{justify-content:start}.kbq-sidepanel-footer .kbq-sidepanel-actions[align=right]{justify-content:flex-end}.kbq-sidepanel-footer .kbq-sidepanel-actions{gap:var(--kbq-sidepanel-size-footer-content-gap-horizontal)}.kbq-sidepanel-title{color:var(--kbq-sidepanel-header-text-color)}.kbq-sidepanel-content{background-color:var(--kbq-sidepanel-container-background);color:var(--kbq-sidepanel-content-text-color)}.kbq-sidepanel-container_shadowed .kbq-sidepanel-content{box-shadow:var(--kbq-sidepanel-container-shadow)}.kbq-overlay-dark-backdrop{background:var(--kbq-background-overlay)!important}.kbq-sidepanel-title{font-size:var(--kbq-typography-title-font-size);font-style:var(--kbq-typography-title-font-style);font-weight:var(--kbq-typography-title-font-weight);line-height:var(--kbq-typography-title-line-height);font-family:var(--kbq-typography-title-font-family);text-transform:var(--kbq-typography-title-text-transform);font-feature-settings:var(--kbq-typography-title-font-feature-settings);letter-spacing:var(--kbq-typography-title-letter-spacing)}.kbq-sidepanel-container,.kbq-sidepanel-footer{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)}\n", ".kbq-sidepanel-container{--kbq-sidepanel-size-small-width: 400px;--kbq-sidepanel-size-medium-width: 640px;--kbq-sidepanel-size-large-width: 960px;--kbq-sidepanel-size-header-padding-vertical: var(--kbq-size-l);--kbq-sidepanel-size-header-padding-left: var(--kbq-size-xxl);--kbq-sidepanel-size-header-padding-right: var(--kbq-size-l);--kbq-sidepanel-size-close-button-margin-left: var(--kbq-size-s);--kbq-sidepanel-size-content-padding-horizontal: var(--kbq-size-xxl);--kbq-sidepanel-size-content-padding-bottom: var(--kbq-size-xxl);--kbq-sidepanel-size-panel-viewport-margin: var(--kbq-size-s);--kbq-sidepanel-size-panel-lower-offset: var(--kbq-size-l);--kbq-sidepanel-size-content-padding-top: 1px;--kbq-sidepanel-size-footer-padding-top: var(--kbq-size-xl);--kbq-sidepanel-size-footer-padding-bottom: var(--kbq-size-xl);--kbq-sidepanel-size-footer-padding-horizontal: var(--kbq-size-xxl);--kbq-sidepanel-size-footer-content-gap-horizontal: var(--kbq-size-l);--kbq-sidepanel-overlay-background: var(--kbq-background-overlay);--kbq-sidepanel-container-background: var(--kbq-background-card);--kbq-sidepanel-container-shadow: var(--kbq-shadow-popup);--kbq-sidepanel-header-text-color: var(--kbq-foreground-contrast);--kbq-sidepanel-content-text-color: var(--kbq-foreground-contrast)}\n"], dependencies: [{ kind: "directive", type: CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }, { kind: "directive", type: CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }], animations: [kbqSidepanelAnimations.sidepanelState], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
207
207
|
}
|
|
208
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
208
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqSidepanelContainerComponent, decorators: [{
|
|
209
209
|
type: Component,
|
|
210
210
|
args: [{ selector: 'kbq-sidepanel-container', imports: [
|
|
211
211
|
CdkPortalOutlet,
|
|
@@ -469,10 +469,10 @@ class KbqSidepanelService {
|
|
|
469
469
|
openedSidepanelsWithSamePosition[openedSidepanelsWithSamePosition.length - 3]
|
|
470
470
|
];
|
|
471
471
|
}
|
|
472
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
473
|
-
/** @nocollapse */ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.
|
|
472
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqSidepanelService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
473
|
+
/** @nocollapse */ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqSidepanelService }); }
|
|
474
474
|
}
|
|
475
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
475
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqSidepanelService, decorators: [{
|
|
476
476
|
type: Injectable
|
|
477
477
|
}] });
|
|
478
478
|
|
|
@@ -505,10 +505,10 @@ class KbqSidepanelClose {
|
|
|
505
505
|
this.sidepanelResult = proxiedChange.currentValue;
|
|
506
506
|
}
|
|
507
507
|
}
|
|
508
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
509
|
-
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.
|
|
508
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqSidepanelClose, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
509
|
+
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.30", type: KbqSidepanelClose, isStandalone: true, selector: "button[kbq-sidepanel-close], button[kbqSidepanelClose]", inputs: { sidepanelResult: { classPropertyName: "sidepanelResult", publicName: "kbq-sidepanel-close", isSignal: false, isRequired: false, transformFunction: null }, kbqSidepanelClose: { classPropertyName: "kbqSidepanelClose", publicName: "kbqSidepanelClose", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "click": "sidepanelRef.close(sidepanelResult)" }, classAttribute: "kbq-sidepanel-close" }, usesOnChanges: true, ngImport: i0 }); }
|
|
510
510
|
}
|
|
511
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
511
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqSidepanelClose, decorators: [{
|
|
512
512
|
type: Directive,
|
|
513
513
|
args: [{
|
|
514
514
|
selector: 'button[kbq-sidepanel-close], button[kbqSidepanelClose]',
|
|
@@ -533,8 +533,8 @@ class KbqSidepanelHeader {
|
|
|
533
533
|
/** @docs-private */
|
|
534
534
|
this.sidepanelRef = inject(KbqSidepanelRef);
|
|
535
535
|
}
|
|
536
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
537
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.
|
|
536
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqSidepanelHeader, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
537
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.30", type: KbqSidepanelHeader, isStandalone: true, selector: "kbq-sidepanel-header", inputs: { closeable: { classPropertyName: "closeable", publicName: "closeable", isSignal: true, isRequired: false, transformFunction: null }, truncateText: { classPropertyName: "truncateText", publicName: "truncateText", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.kbq-sidepanel-header_truncate-text": "truncateText()", "style.box-shadow": "sidepanelRef.bodyOverflow().top ? \"var(--kbq-shadow-overflow-normal-bottom)\" : null" }, classAttribute: "kbq-sidepanel-header" }, ngImport: i0, template: `
|
|
538
538
|
<div class="kbq-sidepanel-title" kbq-title>
|
|
539
539
|
<ng-content />
|
|
540
540
|
</div>
|
|
@@ -546,7 +546,7 @@ class KbqSidepanelHeader {
|
|
|
546
546
|
}
|
|
547
547
|
`, isInline: true, dependencies: [{ kind: "ngmodule", type: KbqButtonModule }, { kind: "component", type: i1.KbqButton, selector: "[kbq-button]", inputs: ["kbqStyle", "disabled", "tabIndex"] }, { kind: "directive", type: i1.KbqButtonCssStyler, selector: "[kbq-button]" }, { kind: "directive", type: KbqSidepanelClose, selector: "button[kbq-sidepanel-close], button[kbqSidepanelClose]", inputs: ["kbq-sidepanel-close", "kbqSidepanelClose"] }, { kind: "ngmodule", type: KbqIconModule }, { kind: "component", type: i2.KbqIcon, selector: "[kbq-icon]", inputs: ["small", "autoColor", "kbq-icon"] }, { kind: "directive", type: KbqTitleDirective, selector: "[kbq-title]", inputs: ["kbq-title"], exportAs: ["kbqTitle"] }] }); }
|
|
548
548
|
}
|
|
549
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
549
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqSidepanelHeader, decorators: [{
|
|
550
550
|
type: Component,
|
|
551
551
|
args: [{
|
|
552
552
|
selector: 'kbq-sidepanel-header',
|
|
@@ -583,10 +583,10 @@ class KbqSidepanelBody {
|
|
|
583
583
|
this.overflowContainer = inject(KbqOverflowShadowContainer);
|
|
584
584
|
effect(() => this.sidepanelRef.bodyOverflow.set(this.overflowContainer.overflow()));
|
|
585
585
|
}
|
|
586
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
587
|
-
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.
|
|
586
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqSidepanelBody, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
587
|
+
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.30", type: KbqSidepanelBody, isStandalone: true, selector: "kbq-sidepanel-body, [kbq-sidepanel-body], kbqSidepanelBody", host: { classAttribute: "kbq-sidepanel-body kbq-scrollbar" }, hostDirectives: [{ directive: i3.KbqOverflowShadowContainer }], ngImport: i0 }); }
|
|
588
588
|
}
|
|
589
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
589
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqSidepanelBody, decorators: [{
|
|
590
590
|
type: Directive,
|
|
591
591
|
args: [{
|
|
592
592
|
selector: 'kbq-sidepanel-body, [kbq-sidepanel-body], kbqSidepanelBody',
|
|
@@ -604,10 +604,10 @@ class KbqSidepanelFooter {
|
|
|
604
604
|
/** @docs-private */
|
|
605
605
|
this.sidepanelRef = inject(KbqSidepanelRef);
|
|
606
606
|
}
|
|
607
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
608
|
-
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.
|
|
607
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqSidepanelFooter, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
608
|
+
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.30", type: KbqSidepanelFooter, isStandalone: true, selector: "kbq-sidepanel-footer, [kbq-sidepanel-footer], kbqSidepanelFooter", host: { properties: { "style.box-shadow": "sidepanelRef.bodyOverflow().bottom ? \"var(--kbq-shadow-overflow-normal-top)\" : null" }, classAttribute: "kbq-sidepanel-footer" }, ngImport: i0 }); }
|
|
609
609
|
}
|
|
610
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
610
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqSidepanelFooter, decorators: [{
|
|
611
611
|
type: Directive,
|
|
612
612
|
args: [{
|
|
613
613
|
selector: 'kbq-sidepanel-footer, [kbq-sidepanel-footer], kbqSidepanelFooter',
|
|
@@ -621,10 +621,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
|
|
|
621
621
|
* Actions block of a sidepanel footer.
|
|
622
622
|
*/
|
|
623
623
|
class KbqSidepanelActions {
|
|
624
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
625
|
-
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.
|
|
624
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqSidepanelActions, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
625
|
+
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.30", type: KbqSidepanelActions, isStandalone: true, selector: "kbq-sidepanel-actions, [kbq-sidepanel-actions], kbqSidepanelActions", host: { classAttribute: "kbq-sidepanel-actions" }, ngImport: i0 }); }
|
|
626
626
|
}
|
|
627
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
627
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqSidepanelActions, decorators: [{
|
|
628
628
|
type: Directive,
|
|
629
629
|
args: [{
|
|
630
630
|
selector: 'kbq-sidepanel-actions, [kbq-sidepanel-actions], kbqSidepanelActions',
|
|
@@ -647,8 +647,8 @@ function getClosestSidepanel(element, openSidepanels) {
|
|
|
647
647
|
}
|
|
648
648
|
|
|
649
649
|
class KbqSidepanelModule {
|
|
650
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
651
|
-
/** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.
|
|
650
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqSidepanelModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
651
|
+
/** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.30", ngImport: i0, type: KbqSidepanelModule, imports: [OverlayModule,
|
|
652
652
|
PortalModule,
|
|
653
653
|
KbqButtonModule,
|
|
654
654
|
KbqIconModule,
|
|
@@ -665,7 +665,7 @@ class KbqSidepanelModule {
|
|
|
665
665
|
KbqSidepanelBody,
|
|
666
666
|
KbqSidepanelFooter,
|
|
667
667
|
KbqSidepanelActions] }); }
|
|
668
|
-
/** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.
|
|
668
|
+
/** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqSidepanelModule, providers: [
|
|
669
669
|
KbqSidepanelService,
|
|
670
670
|
{ provide: FocusTrapFactory, useClass: ConfigurableFocusTrapFactory }
|
|
671
671
|
], imports: [OverlayModule,
|
|
@@ -676,7 +676,7 @@ class KbqSidepanelModule {
|
|
|
676
676
|
A11yModule,
|
|
677
677
|
KbqSidepanelHeader] }); }
|
|
678
678
|
}
|
|
679
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
679
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqSidepanelModule, decorators: [{
|
|
680
680
|
type: NgModule,
|
|
681
681
|
args: [{
|
|
682
682
|
imports: [
|
|
@@ -11,10 +11,10 @@ let count = 0;
|
|
|
11
11
|
* Component used to load the `.kbq-skeleton` styles.
|
|
12
12
|
*/
|
|
13
13
|
class SkeletonStyleLoader {
|
|
14
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
15
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.
|
|
14
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: SkeletonStyleLoader, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
15
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.30", type: SkeletonStyleLoader, isStandalone: true, selector: "skeleton-style-loader", ngImport: i0, template: '', isInline: true, styles: ["@keyframes wave{0%{transform:translate(calc(var(--kbq-skeleton-wave-width) * -1))}to{transform:translate(100vw)}}.kbq-skeleton:not(.kbq-skeleton_disabled){--kbq-skeleton-min-height: var(--kbq-size-l);--kbq-skeleton-animation-duration: 1.2s;--kbq-skeleton-animation-delay: 0ms;--kbq-skeleton-border-radius: var(--kbq-size-xxs);--kbq-skeleton-wave-width: 100px;--kbq-skeleton-z-index: 1}.kbq-skeleton:not(.kbq-skeleton_disabled):is(kbq-skeleton){display:flex;min-height:var(--kbq-skeleton-min-height);border-radius:var(--kbq-skeleton-border-radius)}.kbq-skeleton:not(.kbq-skeleton_disabled){position:relative;overflow:hidden;clip-path:inset(0);-webkit-user-select:none;user-select:none;pointer-events:none;border-color:transparent;outline-color:transparent}.kbq-skeleton:not(.kbq-skeleton_disabled):before{content:\"\";position:absolute;inset:0;background-color:var(--kbq-skeleton-background);z-index:var(--kbq-skeleton-z-index)}.kbq-skeleton:not(.kbq-skeleton_disabled):after{content:\"\";position:fixed;inset-block:0;left:calc(var(--kbq-skeleton-wave-width) * -1);width:var(--kbq-skeleton-wave-width);z-index:var(--kbq-skeleton-z-index);background:linear-gradient(90deg,var(--kbq-skeleton-animation-wave-start) 0%,var(--kbq-skeleton-animation-wave-center) 50%,var(--kbq-skeleton-animation-wave-end) 100%);animation:wave var(--kbq-skeleton-animation-duration) ease-in var(--kbq-skeleton-animation-delay) infinite}@media(prefers-reduced-motion:reduce){.kbq-skeleton:not(.kbq-skeleton_disabled):after{animation:none}}\n"], encapsulation: i0.ViewEncapsulation.None }); }
|
|
16
16
|
}
|
|
17
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
17
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: SkeletonStyleLoader, decorators: [{
|
|
18
18
|
type: Component,
|
|
19
19
|
args: [{ selector: 'skeleton-style-loader', template: '', encapsulation: ViewEncapsulation.None, styles: ["@keyframes wave{0%{transform:translate(calc(var(--kbq-skeleton-wave-width) * -1))}to{transform:translate(100vw)}}.kbq-skeleton:not(.kbq-skeleton_disabled){--kbq-skeleton-min-height: var(--kbq-size-l);--kbq-skeleton-animation-duration: 1.2s;--kbq-skeleton-animation-delay: 0ms;--kbq-skeleton-border-radius: var(--kbq-size-xxs);--kbq-skeleton-wave-width: 100px;--kbq-skeleton-z-index: 1}.kbq-skeleton:not(.kbq-skeleton_disabled):is(kbq-skeleton){display:flex;min-height:var(--kbq-skeleton-min-height);border-radius:var(--kbq-skeleton-border-radius)}.kbq-skeleton:not(.kbq-skeleton_disabled){position:relative;overflow:hidden;clip-path:inset(0);-webkit-user-select:none;user-select:none;pointer-events:none;border-color:transparent;outline-color:transparent}.kbq-skeleton:not(.kbq-skeleton_disabled):before{content:\"\";position:absolute;inset:0;background-color:var(--kbq-skeleton-background);z-index:var(--kbq-skeleton-z-index)}.kbq-skeleton:not(.kbq-skeleton_disabled):after{content:\"\";position:fixed;inset-block:0;left:calc(var(--kbq-skeleton-wave-width) * -1);width:var(--kbq-skeleton-wave-width);z-index:var(--kbq-skeleton-z-index);background:linear-gradient(90deg,var(--kbq-skeleton-animation-wave-start) 0%,var(--kbq-skeleton-animation-wave-center) 50%,var(--kbq-skeleton-animation-wave-end) 100%);animation:wave var(--kbq-skeleton-animation-duration) ease-in var(--kbq-skeleton-animation-delay) infinite}@media(prefers-reduced-motion:reduce){.kbq-skeleton:not(.kbq-skeleton_disabled):after{animation:none}}\n"] }]
|
|
20
20
|
}] });
|
|
@@ -49,10 +49,10 @@ class KbqSkeleton {
|
|
|
49
49
|
const delay = -(elapsed % durationMs);
|
|
50
50
|
this.element.style.setProperty('--kbq-skeleton-animation-delay', `${delay}ms`);
|
|
51
51
|
}
|
|
52
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
53
|
-
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.
|
|
52
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqSkeleton, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
53
|
+
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.30", type: KbqSkeleton, isStandalone: true, selector: "kbq-skeleton, [kbqSkeleton]", inputs: { enabled: { classPropertyName: "enabled", publicName: "kbqSkeleton", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.kbq-skeleton_disabled": "!enabled()" }, classAttribute: "kbq-skeleton" }, exportAs: ["kbqSkeleton"], ngImport: i0 }); }
|
|
54
54
|
}
|
|
55
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
55
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqSkeleton, decorators: [{
|
|
56
56
|
type: Directive,
|
|
57
57
|
args: [{
|
|
58
58
|
selector: 'kbq-skeleton, [kbqSkeleton]',
|
|
@@ -66,11 +66,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
|
|
|
66
66
|
|
|
67
67
|
const COMPONENTS = [KbqSkeleton];
|
|
68
68
|
class KbqSkeletonModule {
|
|
69
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
70
|
-
/** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.
|
|
71
|
-
/** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.
|
|
69
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqSkeletonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
70
|
+
/** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.30", ngImport: i0, type: KbqSkeletonModule, imports: [KbqSkeleton], exports: [KbqSkeleton] }); }
|
|
71
|
+
/** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqSkeletonModule }); }
|
|
72
72
|
}
|
|
73
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
73
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqSkeletonModule, decorators: [{
|
|
74
74
|
type: NgModule,
|
|
75
75
|
args: [{
|
|
76
76
|
imports: COMPONENTS,
|
|
@@ -100,14 +100,14 @@ class KbqSplitButton extends KbqColorDirective {
|
|
|
100
100
|
return;
|
|
101
101
|
this.buttons?.forEach((button) => (button.disabled = state));
|
|
102
102
|
}
|
|
103
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
104
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "20.3.
|
|
103
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqSplitButton, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
104
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "20.3.30", type: KbqSplitButton, isStandalone: true, selector: "kbq-split-button, [kbq-split-button]", inputs: { panelAutoWidth: { classPropertyName: "panelAutoWidth", publicName: "panelAutoWidth", isSignal: true, isRequired: false, transformFunction: null }, kbqStyle: { classPropertyName: "kbqStyle", publicName: "kbqStyle", isSignal: false, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: false, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: booleanAttribute } }, host: { properties: { "class": "kbqStyle", "class.kbq-split-button_styles-for-nested": "buttons.length > 1", "class.kbq-split-button_first-disabled": "firstDisabled", "class.kbq-split-button_second-disabled": "secondDisabled" }, classAttribute: "kbq-split-button" }, queries: [{ propertyName: "dropdownTrigger", first: true, predicate: KbqDropdownTrigger, descendants: true, isSignal: true }, { propertyName: "buttons", predicate: KbqButton }], usesInheritance: true, ngImport: i0, template: `
|
|
105
105
|
<ng-content select="[kbq-button]" />
|
|
106
106
|
|
|
107
107
|
<ng-content select="[kbq-button]" />
|
|
108
108
|
`, isInline: true, styles: [".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-split-button{display:flex;flex-direction:row;min-width:0;border-radius:var(--kbq-size-border-radius)}.kbq-split-button.kbq-split-button_styles-for-nested .kbq-split-button_first.kbq-button{padding-right:10px}.kbq-split-button.kbq-split-button_styles-for-nested .kbq-split-button_first{min-width:0;border-right:none;border-top-right-radius:unset;border-bottom-right-radius:unset}.kbq-split-button.kbq-split-button_styles-for-nested .kbq-split-button_first .kbq-button-wrapper{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kbq-split-button.kbq-split-button_styles-for-nested .kbq-split-button_second{border-left:none;border-top-left-radius:unset;border-bottom-left-radius:unset}.kbq-split-button.kbq-split-button_styles-for-nested .kbq-split-button_second:before{display:block;content:\"\";position:absolute;left:0;top:calc(var(--kbq-size-s) - var(--kbq-button-size-border-width));width:1px;height:var(--kbq-size-l)}.kbq-split-button.kbq-split-button_styles-for-nested .kbq-split-button_first:not(.kbq-disabled):is(:hover,.kbq-hover,.cdk-keyboard-focused,.kbq-active)+.kbq-split-button_second:before{display:none}.kbq-split-button.kbq-split-button_styles-for-nested .kbq-split-button_second:not(.kbq-disabled):is(:hover,.kbq-hover,.cdk-keyboard-focused,.kbq-active):before{display:none}.kbq-split-button.kbq-split-button_styles-for-nested .kbq-button-icon+.kbq-button-icon{padding-left:var(--kbq-size-xxs);padding-right:var(--kbq-size-xxs)}.kbq-split-button:hover:has(.kbq-button_transparent){background:var(--kbq-states-background-transparent-hover)}.kbq-split-button .kbq-split-button_item.kbq-contrast.kbq-button_filled:before{background:var(--kbq-line-on-contrast-fade, var(--kbq-foreground-on-contrast))}.kbq-split-button .kbq-split-button_item.kbq-contrast.kbq-button_transparent:before,.kbq-split-button .kbq-split-button_item.kbq-contrast-fade.kbq-button_outline:before,.kbq-split-button .kbq-split-button_item.kbq-contrast-fade.kbq-button_filled:before{background:var(--kbq-line-contrast-fade)}.kbq-split-button .kbq-split-button_item.kbq-theme-fade.kbq-button_outline:before,.kbq-split-button .kbq-split-button_item.kbq-theme.kbq-button_transparent:before{background:var(--kbq-line-theme-fade)}.kbq-split-button .kbq-split-button_item.kbq-split-button_first.cdk-keyboard-focused{z-index:1;box-shadow:inset -1px 0 0 0 var(--kbq-states-line-focus-theme)}.kbq-split-button .kbq-split-button_item.kbq-split-button_second.cdk-keyboard-focused{box-shadow:inset 1px 0 0 0 var(--kbq-states-line-focus-theme)}.kbq-split-button .kbq-button_outline:has(+.kbq-button_outline){border-right:none}.kbq-split-button .kbq-button_outline:has(+.kbq-button_outline)+.kbq-button_outline{border-left:none}.kbq-split-button.kbq-split-button_first-disabled.kbq-contrast-fade.kbq-button_filled .kbq-split-button_item,.kbq-split-button.kbq-split-button_first-disabled.kbq-contrast.kbq-button_filled .kbq-split-button_item{background:var(--kbq-states-background-disabled)}.kbq-split-button.kbq-split-button_first-disabled.kbq-contrast-fade.kbq-button_filled .kbq-split-button_second:not(.kbq-disabled):hover,.kbq-split-button.kbq-split-button_first-disabled.kbq-contrast.kbq-button_filled .kbq-split-button_second:not(.kbq-disabled):hover{background:var(--kbq-states-background-contrast-fade-hover)}.kbq-split-button.kbq-split-button_first-disabled.kbq-contrast-fade.kbq-button_filled .kbq-split-button_second:not(.kbq-disabled):active,.kbq-split-button.kbq-split-button_first-disabled.kbq-contrast.kbq-button_filled .kbq-split-button_second:not(.kbq-disabled):active{background:var(--kbq-states-background-contrast-fade-active)}.kbq-split-button.kbq-split-button_first-disabled.kbq-contrast-fade.kbq-button_filled .kbq-split-button_second:not(.kbq-disabled) .kbq-icon.kbq-empty,.kbq-split-button.kbq-split-button_first-disabled.kbq-contrast.kbq-button_filled .kbq-split-button_second:not(.kbq-disabled) .kbq-icon.kbq-empty{color:var(--kbq-icon-contrast)}.kbq-split-button.kbq-split-button_first-disabled.kbq-contrast-fade.kbq-button_filled .kbq-split-button_second:not(.kbq-disabled):before,.kbq-split-button.kbq-split-button_first-disabled.kbq-contrast.kbq-button_filled .kbq-split-button_second:not(.kbq-disabled):before{background:var(--kbq-line-contrast-fade)}.kbq-split-button.kbq-split-button_first-disabled.kbq-theme-fade.kbq-button_outline .kbq-split-button_item{border-color:var(--kbq-button-outline-theme-fade-on-states-disabled-border)}.kbq-split-button.kbq-split-button_second-disabled:not(.kbq-split-button_first-disabled).kbq-contrast.kbq-button_filled .kbq-split-button_second{background:var(--kbq-button-filled-contrast-fade-off-background)}.kbq-split-button.kbq-split-button_second-disabled:not(.kbq-split-button_first-disabled).kbq-contrast-fade.kbq-button_filled .kbq-split-button_first{background:var(--kbq-states-background-disabled)}.kbq-split-button.kbq-split-button_second-disabled:not(.kbq-split-button_first-disabled).kbq-theme-fade.kbq-button_outline .kbq-split-button_item{border-color:var(--kbq-button-outline-theme-fade-on-states-disabled-border)}.kbq-split-button.kbq-split-button_second-disabled:not(.kbq-split-button_first-disabled).kbq-theme.kbq-button_transparent .kbq-split-button_second:before{background:var(--kbq-states-line-disabled)}.kbq-split-button.kbq-split-button_second-disabled:not(.kbq-split-button_first-disabled) .kbq-split-button_second:before{background:var(--kbq-states-line-disabled)}.kbq-split-button.kbq-split-button_first-disabled.kbq-split-button_second-disabled .kbq-split-button_second:before{background:var(--kbq-line-contrast-fade)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
109
109
|
}
|
|
110
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
110
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqSplitButton, decorators: [{
|
|
111
111
|
type: Component,
|
|
112
112
|
args: [{ selector: 'kbq-split-button, [kbq-split-button]', template: `
|
|
113
113
|
<ng-content select="[kbq-button]" />
|
|
@@ -133,11 +133,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
|
|
|
133
133
|
}] } });
|
|
134
134
|
|
|
135
135
|
class KbqSplitButtonModule {
|
|
136
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
137
|
-
/** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.
|
|
138
|
-
/** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.
|
|
136
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqSplitButtonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
137
|
+
/** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.30", ngImport: i0, type: KbqSplitButtonModule, imports: [KbqSplitButton], exports: [KbqSplitButton] }); }
|
|
138
|
+
/** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqSplitButtonModule }); }
|
|
139
139
|
}
|
|
140
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
140
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqSplitButtonModule, decorators: [{
|
|
141
141
|
type: NgModule,
|
|
142
142
|
args: [{
|
|
143
143
|
imports: [
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { coerceNumberProperty, coerceCssPixelValue, coerceBooleanProperty } from '@angular/cdk/coercion';
|
|
2
2
|
import { Platform } from '@angular/cdk/platform';
|
|
3
3
|
import * as i0 from '@angular/core';
|
|
4
|
-
import { inject, ElementRef, Renderer2, Input, Directive, ChangeDetectorRef, NgZone, output, viewChildren, viewChild,
|
|
4
|
+
import { inject, ElementRef, Renderer2, Input, Directive, ChangeDetectorRef, NgZone, output, viewChildren, viewChild, ContentChildren, forwardRef, ViewEncapsulation, ChangeDetectionStrategy, Component, NgModule } from '@angular/core';
|
|
5
5
|
import { KBQ_WINDOW } from '@koobiq/components/core';
|
|
6
6
|
import { Subscription } from 'rxjs';
|
|
7
7
|
import { KbqIconModule } from '@koobiq/components/icon';
|
|
@@ -66,10 +66,10 @@ class KbqGutterDirective {
|
|
|
66
66
|
setStyle(property, value) {
|
|
67
67
|
this.renderer.setStyle(this.elementRef.nativeElement, property, value);
|
|
68
68
|
}
|
|
69
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
70
|
-
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.
|
|
69
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqGutterDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
70
|
+
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.30", type: KbqGutterDirective, isStandalone: true, selector: "kbq-gutter", inputs: { direction: "direction", order: "order", size: "size" }, host: { listeners: { "mousedown": "dragged = true" }, properties: { "class.kbq-gutter_vertical": "isVertical", "class.kbq-gutter_dragged": "dragged" }, classAttribute: "kbq-gutter" }, ngImport: i0 }); }
|
|
71
71
|
}
|
|
72
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
72
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqGutterDirective, decorators: [{
|
|
73
73
|
type: Directive,
|
|
74
74
|
args: [{
|
|
75
75
|
selector: 'kbq-gutter',
|
|
@@ -142,10 +142,10 @@ class KbqGutterGhostDirective {
|
|
|
142
142
|
setStyle(property, value) {
|
|
143
143
|
this.renderer.setStyle(this.elementRef.nativeElement, property, value);
|
|
144
144
|
}
|
|
145
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
146
|
-
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.
|
|
145
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqGutterGhostDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
146
|
+
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.30", type: KbqGutterGhostDirective, isStandalone: true, selector: "kbq-gutter-ghost", inputs: { visible: "visible", x: "x", y: "y", direction: "direction", size: "size" }, host: { properties: { "class.kbq-gutter-ghost_vertical": "isVertical", "class.kbq-gutter-ghost_visible": "visible" }, classAttribute: "kbq-gutter-ghost" }, ngImport: i0 }); }
|
|
147
147
|
}
|
|
148
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
148
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqGutterGhostDirective, decorators: [{
|
|
149
149
|
type: Directive,
|
|
150
150
|
args: [{
|
|
151
151
|
selector: 'kbq-gutter-ghost',
|
|
@@ -398,10 +398,10 @@ class KbqSplitterComponent {
|
|
|
398
398
|
setStyle(property, value) {
|
|
399
399
|
this.renderer.setStyle(this.elementRef.nativeElement, property, value);
|
|
400
400
|
}
|
|
401
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
402
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.
|
|
401
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqSplitterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
402
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.30", type: KbqSplitterComponent, isStandalone: true, selector: "kbq-splitter", inputs: { hideGutters: "hideGutters", direction: "direction", disabled: "disabled", useGhost: "useGhost", gutterSize: "gutterSize" }, outputs: { gutterPositionChange: "gutterPositionChange" }, host: { classAttribute: "kbq-splitter" }, queries: [{ propertyName: "areaRefs", predicate: i0.forwardRef(() => KbqSplitterAreaDirective) }], viewQueries: [{ propertyName: "gutters", predicate: KbqGutterDirective, descendants: true, isSignal: true }, { propertyName: "ghost", first: true, predicate: KbqGutterGhostDirective, descendants: true, isSignal: true }], exportAs: ["kbqSplitter"], ngImport: i0, template: "<ng-content />\n\n@for (area of areas; track area) {\n @if (!$last) {\n <kbq-gutter\n [attr.disabled]=\"disabled || null\"\n [direction]=\"direction\"\n [order]=\"$index * 2 + 1\"\n [size]=\"gutterSize\"\n [style.display]=\"hideGutters ? 'none' : 'flex'\"\n (mousedown)=\"onMouseDown($event, $index, $index + 1)\"\n />\n }\n}\n\n@if (useGhost) {\n <kbq-gutter-ghost />\n}\n", styles: [".kbq-splitter{display:flex;position:relative;flex-wrap:nowrap;align-items:stretch;overflow:hidden}.kbq-splitter .kbq-splitter-area{overflow:hidden}.kbq-splitter .kbq-splitter-area_resizing{pointer-events:none}.kbq-gutter{display:flex;flex-grow:0;flex-shrink:0;justify-content:center;align-items:center;overflow:hidden}.kbq-gutter.kbq-gutter_vertical>.kbq-icon{transform:rotate(90deg)}.kbq-gutter-ghost{position:absolute;z-index:999;display:none;overflow:hidden}.kbq-gutter-ghost.kbq-gutter-ghost_vertical>.kbq-icon{transform:rotate(90deg)}.kbq-gutter-ghost.kbq-gutter-ghost_visible{display:block}.kbq-gutter{cursor:col-resize}.kbq-gutter:hover,.kbq-gutter.kbq-gutter_dragged{background-color:var(--kbq-states-background-transparent-hover)}.kbq-gutter.kbq-gutter_vertical{cursor:row-resize}.kbq-gutter[disabled]{background-color:var(--kbq-states-background-disabled);cursor:default}.kbq-gutter-ghost{background:var(--kbq-states-background-transparent-active)}\n"], dependencies: [{ kind: "directive", type: KbqGutterDirective, selector: "kbq-gutter", inputs: ["direction", "order", "size"] }, { kind: "directive", type: KbqGutterGhostDirective, selector: "kbq-gutter-ghost", inputs: ["visible", "x", "y", "direction", "size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
403
403
|
}
|
|
404
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
404
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqSplitterComponent, decorators: [{
|
|
405
405
|
type: Component,
|
|
406
406
|
args: [{ selector: 'kbq-splitter', imports: [KbqGutterDirective, KbqGutterGhostDirective], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
|
|
407
407
|
class: 'kbq-splitter'
|
|
@@ -496,10 +496,10 @@ class KbqSplitterAreaDirective {
|
|
|
496
496
|
removeStyle(style) {
|
|
497
497
|
this.renderer.removeStyle(this.elementRef.nativeElement, style);
|
|
498
498
|
}
|
|
499
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
500
|
-
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.
|
|
499
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqSplitterAreaDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
500
|
+
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.30", type: KbqSplitterAreaDirective, isStandalone: true, selector: "[kbq-splitter-area]", outputs: { sizeChange: "sizeChange" }, host: { properties: { "class.kbq-splitter-area_resizing": "isResizing()" }, classAttribute: "kbq-splitter-area" }, ngImport: i0 }); }
|
|
501
501
|
}
|
|
502
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
502
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqSplitterAreaDirective, decorators: [{
|
|
503
503
|
type: Directive,
|
|
504
504
|
args: [{
|
|
505
505
|
selector: '[kbq-splitter-area]',
|
|
@@ -511,17 +511,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
|
|
|
511
511
|
}], propDecorators: { sizeChange: [{ type: i0.Output, args: ["sizeChange"] }] } });
|
|
512
512
|
|
|
513
513
|
class KbqSplitterModule {
|
|
514
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
515
|
-
/** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.
|
|
514
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqSplitterModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
515
|
+
/** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.30", ngImport: i0, type: KbqSplitterModule, imports: [KbqIconModule,
|
|
516
516
|
KbqGutterDirective,
|
|
517
517
|
KbqGutterGhostDirective,
|
|
518
518
|
KbqSplitterAreaDirective,
|
|
519
519
|
KbqSplitterComponent], exports: [KbqGutterDirective,
|
|
520
520
|
KbqSplitterAreaDirective,
|
|
521
521
|
KbqSplitterComponent] }); }
|
|
522
|
-
/** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.
|
|
522
|
+
/** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqSplitterModule, imports: [KbqIconModule] }); }
|
|
523
523
|
}
|
|
524
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
524
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqSplitterModule, decorators: [{
|
|
525
525
|
type: NgModule,
|
|
526
526
|
args: [{
|
|
527
527
|
imports: [
|