@koobiq/components 16.0.0-beta.8 → 16.0.0-beta.9

package/core/styles/typography/_typography.scss

@@ -8,6 +8,7 @@
     $typography: map.get(map.get($tokens, koobiq), typography);
 
     $config: (
+        //legacy will be deleted
         display-1:              map.get($typography, display-1),
         display-2:              map.get($typography, display-2),
         display-3:              map.get($typography, display-3),
@@ -30,11 +31,46 @@
         caption-mono-strong:    map.get($typography, caption-mono-strong),
         caption-tabular:        map.get($typography, caption-tabular),
 
-        small-text:             map.get($typography, small-text),
+        //small-text:             map.get($typography, small-text),
         extra-small-text:       map.get($typography, extra-small-text),
         extra-small-text-caps:  map.get($typography, extra-small-text-caps),
         extra-small-text-mono:  map.get($typography, extra-small-text-mono),
-        extra-small-text-strong:  map.get($typography, extra-small-text-strong)
+        extra-small-text-strong:  map.get($typography, extra-small-text-strong),
+
+        //new
+        display-big:             map.get($typography, display-big),
+        display-normal:          map.get($typography, display-normal),
+        display-compact:         map.get($typography, display-compact),
+        text-big:                map.get($typography, text-big),
+        text-big-strong:         map.get($typography, text-big-strong),
+        text-normal:             map.get($typography, text-normal),
+        text-normal-strong:      map.get($typography, text-normal-strong),
+        text-compact:            map.get($typography, text-compact),
+        text-compact-strong:     map.get($typography, text-compact-strong),
+        caps-big:                map.get($typography, caps-big),
+        caps-big-strong:         map.get($typography, caps-big-strong),
+        caps-normal:             map.get($typography, caps-normal),
+        caps-normal-strong:      map.get($typography, caps-normal-strong),
+        caps-compact:            map.get($typography, caps-compact),
+        caps-compact-strong:     map.get($typography, caps-compact-strong),
+        mono-big:                map.get($typography, mono-big),
+        mono-big-strong:         map.get($typography, mono-big-strong),
+        mono-normal:             map.get($typography, mono-normal),
+        mono-normal-strong:      map.get($typography, mono-normal-strong),
+        mono-compact:            map.get($typography, mono-compact),
+        mono-compact-strong:     map.get($typography, mono-compact-strong),
+        tabular-big:             map.get($typography, tabular-big),
+        tabular-big-strong:      map.get($typography, tabular-big-strong),
+        tabular-normal:          map.get($typography, tabular-normal),
+        tabular-normal-strong:   map.get($typography, tabular-normal-strong),
+        tabular-compact:         map.get($typography, tabular-compact),
+        tabular-compact-strong:  map.get($typography, tabular-compact-strong),
+        italic-big:              map.get($typography, italic-big),
+        italic-big-strong:       map.get($typography, italic-big-strong),
+        italic-normal:           map.get($typography, italic-normal),
+        italic-normal-strong:    map.get($typography, italic-normal-strong),
+        italic-compact:          map.get($typography, italic-compact),
+        italic-compact-strong:   map.get($typography, italic-compact-strong)
     );
 
     @each $key, $level in $config {
@@ -80,6 +116,7 @@
 
 
 @mixin kbq-base-typography($config) {
+    //legacy will be deleted
     .kbq-display-1 {
         @include kbq-typography-level-to-styles($config, display-1);
     }
@@ -152,13 +189,146 @@
         @include kbq-typography-level-to-styles($config, caption-mono-strong);
     }
 
-    .kbq-small-text {
-        @include kbq-typography-level-to-styles($config, small-text);
-    }
+    //.kbq-small-text {
+    //    @include kbq-typography-level-to-styles($config, small-text);
+    //}
 
     .kbq-extra-small-text {
         @include kbq-typography-level-to-styles($config, extra-small-text);
     }
+
+    // new
+    .kbq-display-big {
+        @include kbq-typography-level-to-styles($config, display-big);
+    }
+
+    .kbq-display-normal {
+        @include kbq-typography-level-to-styles($config, display-normal);
+    }
+
+    .kbq-display-compact {
+        @include kbq-typography-level-to-styles($config, display-compact);
+    }
+
+    .kbq-text-big {
+        @include kbq-typography-level-to-styles($config, text-big);
+    }
+
+    .kbq-text-big-strong {
+        @include kbq-typography-level-to-styles($config, text-big-strong);
+    }
+
+    .kbq-text-normal {
+        @include kbq-typography-level-to-styles($config, text-normal);
+    }
+
+    .kbq-text-normal-strong {
+        @include kbq-typography-level-to-styles($config, text-normal-strong);
+    }
+
+    .kbq-text-compact {
+        @include kbq-typography-level-to-styles($config, text-compact);
+    }
+
+    .kbq-text-compact-strong {
+        @include kbq-typography-level-to-styles($config, text-compact-strong);
+    }
+
+    .kbq-caps-big {
+        @include kbq-typography-level-to-styles($config, caps-big);
+    }
+
+    .kbq-caps-big-strong {
+        @include kbq-typography-level-to-styles($config, caps-big-strong);
+    }
+
+    .kbq-caps-normal {
+        @include kbq-typography-level-to-styles($config, caps-normal);
+    }
+
+    .kbq-caps-normal-strong {
+        @include kbq-typography-level-to-styles($config, caps-normal-strong);
+    }
+
+    .kbq-caps-compact {
+        @include kbq-typography-level-to-styles($config, caps-compact);
+    }
+
+    .kbq-caps-compact-strong {
+        @include kbq-typography-level-to-styles($config, caps-compact-strong);
+    }
+
+    .kbq-mono-big {
+        @include kbq-typography-level-to-styles($config, mono-big);
+    }
+
+    .kbq-mono-big-strong {
+        @include kbq-typography-level-to-styles($config, mono-big-strong);
+    }
+
+    .kbq-mono-normal {
+        @include kbq-typography-level-to-styles($config, mono-normal);
+    }
+
+    .kbq-mono-normal-strong {
+        @include kbq-typography-level-to-styles($config, mono-normal-strong);
+    }
+
+    .kbq-mono-compact {
+        @include kbq-typography-level-to-styles($config, mono-compact);
+    }
+
+    .kbq-mono-compact-strong {
+        @include kbq-typography-level-to-styles($config, mono-compact-strong);
+    }
+
+    .kbq-tabular-big {
+        @include kbq-typography-level-to-styles($config, tabular-big);
+    }
+
+    .kbq-tabular-big-strong {
+        @include kbq-typography-level-to-styles($config, tabular-big-strong);
+    }
+
+    .kbq-tabular-normal {
+        @include kbq-typography-level-to-styles($config, tabular-normal);
+    }
+
+    .kbq-tabular-normal-strong {
+        @include kbq-typography-level-to-styles($config, tabular-normal-strong);
+    }
+
+    .kbq-tabular-compact {
+        @include kbq-typography-level-to-styles($config, tabular-compact);
+    }
+
+    .kbq-tabular-compact-strong {
+        @include kbq-typography-level-to-styles($config, tabular-compact-strong);
+    }
+
+    .kbq-italic-big {
+        @include kbq-typography-level-to-styles($config, italic-big);
+    }
+
+    .kbq-italic-big-strong {
+        @include kbq-typography-level-to-styles($config, italic-big-strong);
+    }
+
+    .kbq-italic-normal {
+        @include kbq-typography-level-to-styles($config, italic-normal);
+    }
+
+    .kbq-italic-normal-strong {
+        @include kbq-typography-level-to-styles($config, italic-normal-strong);
+    }
+
+    .kbq-italic-compact {
+        @include kbq-typography-level-to-styles($config, italic-compact);
+    }
+
+    .kbq-italic-compact-strong {
+        @include kbq-typography-level-to-styles($config, italic-compact-strong);
+    }
 }
 
 @mixin kbq-markdown-base-typography($config) {

package/esm2022/badge/badge.component.mjs

@@ -1,5 +1,5 @@
-import { ChangeDetectionStrategy, Component, ContentChild, Directive, Input, ViewEncapsulation } from '@angular/core';
-import { KbqIconItem } from '@koobiq/components/icon';
+import { ChangeDetectionStrategy, ChangeDetectorRef, Component, ContentChild, ContentChildren, Directive, ElementRef, forwardRef, Input, QueryList, Renderer2, SkipSelf, ViewEncapsulation } from '@angular/core';
+import { KbqIcon, KbqIconItem } from '@koobiq/components/icon';
 import * as i0 from "@angular/core";
 export var KbqBadgeColors;
 (function (KbqBadgeColors) {
@@ -25,6 +25,66 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImpor
                     }
                 }]
         }] });
+export const getNodesWithoutComments = (nodes) => {
+    const COMMENT_NODE = 8;
+    return Array.from(nodes).filter((node) => node.nodeType !== COMMENT_NODE);
+};
+export const leftIconClassName = 'kbq-icon_left';
+export const rightIconClassName = 'kbq-icon_right';
+export const badgeLeftIconClassName = 'kbq-badge-icon_left';
+export const badgeRightIconClassName = 'kbq-badge-icon_right';
+export class KbqBadgeCssStyler {
+    constructor(elementRef, renderer, cdr) {
+        this.renderer = renderer;
+        this.cdr = cdr;
+        this.isIconButton = false;
+        this.nativeElement = elementRef.nativeElement;
+    }
+    ngAfterContentInit() {
+        this.updateClassModifierForIcons();
+    }
+    updateClassModifierForIcons() {
+        this.renderer.removeClass(this.nativeElement, badgeLeftIconClassName);
+        this.renderer.removeClass(this.nativeElement, badgeRightIconClassName);
+        const twoIcons = 2;
+        const filteredNodesWithoutComments = getNodesWithoutComments(this.nativeElement.childNodes);
+        const currentIsIconButtonValue = !!this.icons.length &&
+            this.icons.length === filteredNodesWithoutComments.length && this.icons.length <= twoIcons;
+        if (currentIsIconButtonValue !== this.isIconButton) {
+            this.isIconButton = currentIsIconButtonValue;
+            this.cdr.detectChanges();
+        }
+        if (this.icons.length && filteredNodesWithoutComments.length > 1) {
+            this.icons.map((item) => item.getHostElement())
+                .forEach((iconHostElement) => {
+                this.renderer.removeClass(iconHostElement, leftIconClassName);
+                this.renderer.removeClass(iconHostElement, rightIconClassName);
+                const iconIndex = filteredNodesWithoutComments.findIndex((node) => node === iconHostElement);
+                if (iconIndex === 0) {
+                    this.renderer.addClass(iconHostElement, leftIconClassName);
+                    this.renderer.addClass(this.nativeElement, badgeLeftIconClassName);
+                }
+                if (iconIndex === filteredNodesWithoutComments.length - 1) {
+                    this.renderer.addClass(iconHostElement, rightIconClassName);
+                    this.renderer.addClass(this.nativeElement, badgeRightIconClassName);
+                }
+            });
+        }
+    }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: KbqBadgeCssStyler, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i0.ChangeDetectorRef, skipSelf: true }], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.1.5", type: KbqBadgeCssStyler, selector: "kbq-badge", queries: [{ propertyName: "icons", predicate: i0.forwardRef(function () { return KbqIcon; }) }], ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: KbqBadgeCssStyler, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'kbq-badge'
+                }]
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i0.ChangeDetectorRef, decorators: [{
+                    type: SkipSelf
+                }] }]; }, propDecorators: { icons: [{
+                type: ContentChildren,
+                args: [(forwardRef(() => KbqIcon))]
+            }] } });
 export class KbqBadge {
     constructor() {
         this.compact = false;
@@ -38,7 +98,7 @@ export class KbqBadge {
         this._badgeColor = value || KbqBadgeColors.FadeContrast;
     }
     /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: KbqBadge, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.5", type: KbqBadge, selector: "kbq-badge", inputs: { compact: "compact", outline: "outline", badgeColor: "badgeColor" }, host: { properties: { "class.kbq-badge_compact": "compact", "class.kbq-badge-filled": "!outline", "class.kbq-badge-outline": "outline", "class": "badgeColor" }, classAttribute: "kbq-badge" }, queries: [{ propertyName: "iconItem", first: true, predicate: KbqIconItem, descendants: true }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: [".kbq-badge{display:inline-flex;flex-direction:row;justify-content:flex-start;align-items:center;text-align:center;white-space:nowrap;border-style:solid;box-sizing:border-box;padding:var(--kbq-badge-size-normal-vertical-padding, 4px) var(--kbq-badge-size-normal-horizontal-padding, 8px);border-width:var(--kbq-badge-size-normal-border-width, 1px);border-radius:var(--kbq-badge-size-normal-border-radius, 4px)}.kbq-badge .kbq-badge-caption{padding-left:var(--kbq-badge-size-normal-content-padding, 4px)}.kbq-badge.kbq-badge_compact{padding:var(--kbq-badge-size-compact-vertical-padding, 0) var(--kbq-badge-size-compact-horizontal-padding, 4px);border-width:var(--kbq-badge-size-compact-border-width, 1px);border-radius:var(--kbq-badge-size-compact-border-radius, 4px)}.kbq-badge.kbq-badge_compact .kbq-badge-caption{padding-left:var(--kbq-badge-size-compact-content-padding, 2px)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.5", type: KbqBadge, selector: "kbq-badge", inputs: { compact: "compact", outline: "outline", badgeColor: "badgeColor" }, host: { properties: { "class.kbq-badge_compact": "compact", "class.kbq-badge-filled": "!outline", "class.kbq-badge-outline": "outline", "class": "badgeColor" }, classAttribute: "kbq-badge" }, queries: [{ propertyName: "iconItem", first: true, predicate: KbqIconItem, descendants: true }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: [".kbq-badge{display:inline-flex;flex-direction:row;justify-content:flex-start;align-items:center;text-align:center;white-space:nowrap;border-style:solid;box-sizing:border-box;padding:var(--kbq-badge-size-normal-vertical-padding, 4px) var(--kbq-badge-size-normal-horizontal-padding, 8px);border-width:var(--kbq-badge-size-normal-border-width, 1px);border-radius:var(--kbq-badge-size-normal-border-radius, 4px)}.kbq-badge .kbq-badge-caption{padding-left:var(--kbq-badge-size-normal-content-padding, 4px)}.kbq-badge .kbq-icon_left{margin-right:var(--kbq-badge-size-normal-icon-left-margin-right, 4px)}.kbq-badge .kbq-icon_right{margin-left:var(--kbq-badge-size-normal-icon-right-margin-left, 4px)}.kbq-badge.kbq-badge_compact{padding:var(--kbq-badge-size-compact-vertical-padding, 0) var(--kbq-badge-size-compact-horizontal-padding, 4px);border-width:var(--kbq-badge-size-compact-border-width, 1px);border-radius:var(--kbq-badge-size-compact-border-radius, 4px)}.kbq-badge.kbq-badge_compact .kbq-badge-caption{padding-left:var(--kbq-badge-size-compact-content-padding, 2px)}.kbq-badge.kbq-badge_compact .kbq-icon_left{margin-right:var(--kbq-badge-size-compact-icon-left-margin-right, 2px)}.kbq-badge.kbq-badge_compact .kbq-icon_right{margin-left:var(--kbq-badge-size-compact-icon-right-margin-left, 2px)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: KbqBadge, decorators: [{
             type: Component,
@@ -48,7 +108,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImpor
                         '[class.kbq-badge-filled]': '!outline',
                         '[class.kbq-badge-outline]': 'outline',
                         '[class]': 'badgeColor'
-                    }, styles: [".kbq-badge{display:inline-flex;flex-direction:row;justify-content:flex-start;align-items:center;text-align:center;white-space:nowrap;border-style:solid;box-sizing:border-box;padding:var(--kbq-badge-size-normal-vertical-padding, 4px) var(--kbq-badge-size-normal-horizontal-padding, 8px);border-width:var(--kbq-badge-size-normal-border-width, 1px);border-radius:var(--kbq-badge-size-normal-border-radius, 4px)}.kbq-badge .kbq-badge-caption{padding-left:var(--kbq-badge-size-normal-content-padding, 4px)}.kbq-badge.kbq-badge_compact{padding:var(--kbq-badge-size-compact-vertical-padding, 0) var(--kbq-badge-size-compact-horizontal-padding, 4px);border-width:var(--kbq-badge-size-compact-border-width, 1px);border-radius:var(--kbq-badge-size-compact-border-radius, 4px)}.kbq-badge.kbq-badge_compact .kbq-badge-caption{padding-left:var(--kbq-badge-size-compact-content-padding, 2px)}\n"] }]
+                    }, styles: [".kbq-badge{display:inline-flex;flex-direction:row;justify-content:flex-start;align-items:center;text-align:center;white-space:nowrap;border-style:solid;box-sizing:border-box;padding:var(--kbq-badge-size-normal-vertical-padding, 4px) var(--kbq-badge-size-normal-horizontal-padding, 8px);border-width:var(--kbq-badge-size-normal-border-width, 1px);border-radius:var(--kbq-badge-size-normal-border-radius, 4px)}.kbq-badge .kbq-badge-caption{padding-left:var(--kbq-badge-size-normal-content-padding, 4px)}.kbq-badge .kbq-icon_left{margin-right:var(--kbq-badge-size-normal-icon-left-margin-right, 4px)}.kbq-badge .kbq-icon_right{margin-left:var(--kbq-badge-size-normal-icon-right-margin-left, 4px)}.kbq-badge.kbq-badge_compact{padding:var(--kbq-badge-size-compact-vertical-padding, 0) var(--kbq-badge-size-compact-horizontal-padding, 4px);border-width:var(--kbq-badge-size-compact-border-width, 1px);border-radius:var(--kbq-badge-size-compact-border-radius, 4px)}.kbq-badge.kbq-badge_compact .kbq-badge-caption{padding-left:var(--kbq-badge-size-compact-content-padding, 2px)}.kbq-badge.kbq-badge_compact .kbq-icon_left{margin-right:var(--kbq-badge-size-compact-icon-left-margin-right, 2px)}.kbq-badge.kbq-badge_compact .kbq-icon_right{margin-left:var(--kbq-badge-size-compact-icon-right-margin-left, 2px)}\n"] }]
         }], propDecorators: { iconItem: [{
                 type: ContentChild,
                 args: [KbqIconItem]
@@ -59,4 +119,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImpor
             }], badgeColor: [{
                 type: Input
             }] } });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYmFkZ2UuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vcGFja2FnZXMvY29tcG9uZW50cy9iYWRnZS9iYWRnZS5jb21wb25lbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUNILHVCQUF1QixFQUN2QixTQUFTLEVBQ1QsWUFBWSxFQUNaLFNBQVMsRUFDVCxLQUFLLEVBQ0wsaUJBQWlCLEVBQ3BCLE1BQU0sZUFBZSxDQUFDO0FBQ3ZCLE9BQU8sRUFBRSxXQUFXLEVBQUUsTUFBTSx5QkFBeUIsQ0FBQzs7QUFHdEQsTUFBTSxDQUFOLElBQVksY0FVWDtBQVZELFdBQVksY0FBYztJQUN0QixnREFBOEIsQ0FBQTtJQUM5QiwwQ0FBd0IsQ0FBQTtJQUN4Qiw4Q0FBNEIsQ0FBQTtJQUM1Qiw4Q0FBNEIsQ0FBQTtJQUM1QiwwQ0FBd0IsQ0FBQTtJQUV4QixxQ0FBbUIsQ0FBQTtJQUNuQixxQ0FBbUIsQ0FBQTtJQUNuQixpQ0FBZSxDQUFBO0FBQ25CLENBQUMsRUFWVyxjQUFjLEtBQWQsY0FBYyxRQVV6QjtBQVFELE1BQU0sT0FBTyxlQUFlO2lJQUFmLGVBQWU7cUhBQWYsZUFBZTs7MkZBQWYsZUFBZTtrQkFOM0IsU0FBUzttQkFBQztvQkFDUCxRQUFRLEVBQUUscUJBQXFCO29CQUMvQixJQUFJLEVBQUU7d0JBQ0YsS0FBSyxFQUFFLG1CQUFtQjtxQkFDN0I7aUJBQ0o7O0FBa0JELE1BQU0sT0FBTyxRQUFRO0lBZHJCO1FBaUJhLFlBQU8sR0FBWSxLQUFLLENBQUM7UUFDekIsWUFBTyxHQUFZLEtBQUssQ0FBQztRQVcxQixnQkFBVyxHQUE0QixjQUFjLENBQUMsWUFBWSxDQUFDO0tBQzlFO0lBVkcsSUFDSSxVQUFVO1FBQ1YsT0FBTyxhQUFhLElBQUksQ0FBQyxXQUFXLEVBQUUsQ0FBQztJQUMzQyxDQUFDO0lBRUQsSUFBSSxVQUFVLENBQUMsS0FBOEI7UUFDekMsSUFBSSxDQUFDLFdBQVcsR0FBRyxLQUFLLElBQUksY0FBYyxDQUFDLFlBQVksQ0FBQztJQUM1RCxDQUFDO2lJQWJRLFFBQVE7cUhBQVIsUUFBUSxxV0FDSCxXQUFXLGdEQWJmLDJCQUEyQjs7MkZBWTVCLFFBQVE7a0JBZHBCLFNBQVM7K0JBQ0ksV0FBVyxZQUNYLDJCQUEyQixtQkFFcEIsdUJBQXVCLENBQUMsTUFBTSxpQkFDaEMsaUJBQWlCLENBQUMsSUFBSSxRQUMvQjt3QkFDRixLQUFLLEVBQUUsV0FBVzt3QkFDbEIsMkJBQTJCLEVBQUUsU0FBUzt3QkFDdEMsMEJBQTBCLEVBQUUsVUFBVTt3QkFDdEMsMkJBQTJCLEVBQUUsU0FBUzt3QkFDdEMsU0FBUyxFQUFFLFlBQVk7cUJBQzFCOzhCQUcwQixRQUFRO3NCQUFsQyxZQUFZO3VCQUFDLFdBQVc7Z0JBRWhCLE9BQU87c0JBQWYsS0FBSztnQkFDRyxPQUFPO3NCQUFmLEtBQUs7Z0JBR0YsVUFBVTtzQkFEYixLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtcbiAgICBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSxcbiAgICBDb21wb25lbnQsXG4gICAgQ29udGVudENoaWxkLFxuICAgIERpcmVjdGl2ZSxcbiAgICBJbnB1dCxcbiAgICBWaWV3RW5jYXBzdWxhdGlvblxufSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IEticUljb25JdGVtIH0gZnJvbSAnQGtvb2JpcS9jb21wb25lbnRzL2ljb24nO1xuXG5cbmV4cG9ydCBlbnVtIEticUJhZGdlQ29sb3JzIHtcbiAgICBGYWRlQ29udHJhc3QgPSAnZmFkZS1jb250cmFzdCcsXG4gICAgRmFkZVRoZW1lID0gJ2ZhZGUtdGhlbWUnLFxuICAgIEZhZGVTdWNjZXNzID0gJ2ZhZGUtc3VjY2VzcycsXG4gICAgRmFkZVdhcm5pbmcgPSAnZmFkZS13YXJuaW5nJyxcbiAgICBGYWRlRXJyb3IgPSAnZmFkZS1lcnJvcicsXG5cbiAgICBTdWNjZXNzID0gJ3N1Y2Nlc3MnLFxuICAgIFdhcm5pbmcgPSAnd2FybmluZycsXG4gICAgRXJyb3IgPSAnZXJyb3InXG59XG5cbkBEaXJlY3RpdmUoe1xuICAgIHNlbGVjdG9yOiAnW2ticS1iYWRnZS1jYXB0aW9uXScsXG4gICAgaG9zdDoge1xuICAgICAgICBjbGFzczogJ2ticS1iYWRnZS1jYXB0aW9uJ1xuICAgIH1cbn0pXG5leHBvcnQgY2xhc3MgS2JxQmFkZ2VDYXB0aW9uIHt9XG5cblxuQENvbXBvbmVudCh7XG4gICAgc2VsZWN0b3I6ICdrYnEtYmFkZ2UnLFxuICAgIHRlbXBsYXRlOiAnPG5nLWNvbnRlbnQ+PC9uZy1jb250ZW50PicsXG4gICAgc3R5bGVVcmxzOiBbJ2JhZGdlLmNvbXBvbmVudC5zY3NzJ10sXG4gICAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXG4gICAgZW5jYXBzdWxhdGlvbjogVmlld0VuY2Fwc3VsYXRpb24uTm9uZSxcbiAgICBob3N0OiB7XG4gICAgICAgIGNsYXNzOiAna2JxLWJhZGdlJyxcbiAgICAgICAgJ1tjbGFzcy5rYnEtYmFkZ2VfY29tcGFjdF0nOiAnY29tcGFjdCcsXG4gICAgICAgICdbY2xhc3Mua2JxLWJhZGdlLWZpbGxlZF0nOiAnIW91dGxpbmUnLFxuICAgICAgICAnW2NsYXNzLmticS1iYWRnZS1vdXRsaW5lXSc6ICdvdXRsaW5lJyxcbiAgICAgICAgJ1tjbGFzc10nOiAnYmFkZ2VDb2xvcidcbiAgICB9XG59KVxuZXhwb3J0IGNsYXNzIEticUJhZGdlIHtcbiAgICBAQ29udGVudENoaWxkKEticUljb25JdGVtKSBpY29uSXRlbTogS2JxSWNvbkl0ZW07XG5cbiAgICBASW5wdXQoKSBjb21wYWN0OiBib29sZWFuID0gZmFsc2U7XG4gICAgQElucHV0KCkgb3V0bGluZTogYm9vbGVhbiA9IGZhbHNlO1xuXG4gICAgQElucHV0KClcbiAgICBnZXQgYmFkZ2VDb2xvcigpOiBzdHJpbmcge1xuICAgICAgICByZXR1cm4gYGticS1iYWRnZV8ke3RoaXMuX2JhZGdlQ29sb3J9YDtcbiAgICB9XG5cbiAgICBzZXQgYmFkZ2VDb2xvcih2YWx1ZTogc3RyaW5nIHwgS2JxQmFkZ2VDb2xvcnMpIHtcbiAgICAgICAgdGhpcy5fYmFkZ2VDb2xvciA9IHZhbHVlIHx8IEticUJhZGdlQ29sb3JzLkZhZGVDb250cmFzdDtcbiAgICB9XG5cbiAgICBwcml2YXRlIF9iYWRnZUNvbG9yOiBzdHJpbmcgfCBLYnFCYWRnZUNvbG9ycyA9IEticUJhZGdlQ29sb3JzLkZhZGVDb250cmFzdDtcbn1cbiJdfQ==
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYmFkZ2UuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vcGFja2FnZXMvY29tcG9uZW50cy9iYWRnZS9iYWRnZS5jb21wb25lbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUVILHVCQUF1QixFQUN2QixpQkFBaUIsRUFDakIsU0FBUyxFQUNULFlBQVksRUFDWixlQUFlLEVBQ2YsU0FBUyxFQUNULFVBQVUsRUFDVixVQUFVLEVBQ1YsS0FBSyxFQUNMLFNBQVMsRUFDVCxTQUFTLEVBQ1QsUUFBUSxFQUNSLGlCQUFpQixFQUNwQixNQUFNLGVBQWUsQ0FBQztBQUN2QixPQUFPLEVBQUUsT0FBTyxFQUFFLFdBQVcsRUFBRSxNQUFNLHlCQUF5QixDQUFDOztBQUcvRCxNQUFNLENBQU4sSUFBWSxjQVVYO0FBVkQsV0FBWSxjQUFjO0lBQ3RCLGdEQUE4QixDQUFBO0lBQzlCLDBDQUF3QixDQUFBO0lBQ3hCLDhDQUE0QixDQUFBO0lBQzVCLDhDQUE0QixDQUFBO0lBQzVCLDBDQUF3QixDQUFBO0lBRXhCLHFDQUFtQixDQUFBO0lBQ25CLHFDQUFtQixDQUFBO0lBQ25CLGlDQUFlLENBQUE7QUFDbkIsQ0FBQyxFQVZXLGNBQWMsS0FBZCxjQUFjLFFBVXpCO0FBUUQsTUFBTSxPQUFPLGVBQWU7aUlBQWYsZUFBZTtxSEFBZixlQUFlOzsyRkFBZixlQUFlO2tCQU4zQixTQUFTO21CQUFDO29CQUNQLFFBQVEsRUFBRSxxQkFBcUI7b0JBQy9CLElBQUksRUFBRTt3QkFDRixLQUFLLEVBQUUsbUJBQW1CO3FCQUM3QjtpQkFDSjs7QUFJRCxNQUFNLENBQUMsTUFBTSx1QkFBdUIsR0FBRyxDQUFDLEtBQWUsRUFBVSxFQUFFO0lBQy9ELE1BQU0sWUFBWSxHQUFHLENBQUMsQ0FBQztJQUV2QixPQUFPLEtBQUssQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLENBQUMsTUFBTSxDQUFDLENBQUMsSUFBSSxFQUFFLEVBQUUsQ0FBQyxJQUFJLENBQUMsUUFBUSxLQUFLLFlBQVksQ0FBQyxDQUFDO0FBQzlFLENBQUMsQ0FBQztBQUVGLE1BQU0sQ0FBQyxNQUFNLGlCQUFpQixHQUFHLGVBQWUsQ0FBQztBQUNqRCxNQUFNLENBQUMsTUFBTSxrQkFBa0IsR0FBRyxnQkFBZ0IsQ0FBQztBQUVuRCxNQUFNLENBQUMsTUFBTSxzQkFBc0IsR0FBRyxxQkFBcUIsQ0FBQztBQUM1RCxNQUFNLENBQUMsTUFBTSx1QkFBdUIsR0FBRyxzQkFBc0IsQ0FBQztBQU05RCxNQUFNLE9BQU8saUJBQWlCO0lBTzFCLFlBQ0ksVUFBc0IsRUFDZCxRQUFtQixFQUNQLEdBQXNCO1FBRGxDLGFBQVEsR0FBUixRQUFRLENBQVc7UUFDUCxRQUFHLEdBQUgsR0FBRyxDQUFtQjtRQUw5QyxpQkFBWSxHQUFZLEtBQUssQ0FBQztRQU8xQixJQUFJLENBQUMsYUFBYSxHQUFHLFVBQVUsQ0FBQyxhQUFhLENBQUM7SUFDbEQsQ0FBQztJQUVELGtCQUFrQjtRQUNkLElBQUksQ0FBQywyQkFBMkIsRUFBRSxDQUFDO0lBQ3ZDLENBQUM7SUFFRCwyQkFBMkI7UUFDdkIsSUFBSSxDQUFDLFFBQVEsQ0FBQyxXQUFXLENBQUMsSUFBSSxDQUFDLGFBQWEsRUFBRSxzQkFBc0IsQ0FBQyxDQUFDO1FBQ3RFLElBQUksQ0FBQyxRQUFRLENBQUMsV0FBVyxDQUFDLElBQUksQ0FBQyxhQUFhLEVBQUUsdUJBQXVCLENBQUMsQ0FBQztRQUV2RSxNQUFNLFFBQVEsR0FBRyxDQUFDLENBQUM7UUFDbkIsTUFBTSw0QkFBNEIsR0FBRyx1QkFBdUIsQ0FDeEQsSUFBSSxDQUFDLGFBQWEsQ0FBQyxVQUFzQixDQUM1QyxDQUFDO1FBRUYsTUFBTSx3QkFBd0IsR0FBRyxDQUFDLENBQUMsSUFBSSxDQUFDLEtBQUssQ0FBQyxNQUFNO1lBQ2hELElBQUksQ0FBQyxLQUFLLENBQUMsTUFBTSxLQUFLLDRCQUE0QixDQUFDLE1BQU0sSUFBSSxJQUFJLENBQUMsS0FBSyxDQUFDLE1BQU0sSUFBSSxRQUFRLENBQUM7UUFFL0YsSUFBSSx3QkFBd0IsS0FBSyxJQUFJLENBQUMsWUFBWSxFQUFFO1lBQ2hELElBQUksQ0FBQyxZQUFZLEdBQUcsd0JBQXdCLENBQUM7WUFDN0MsSUFBSSxDQUFDLEdBQUcsQ0FBQyxhQUFhLEVBQUUsQ0FBQztTQUM1QjtRQUVELElBQUksSUFBSSxDQUFDLEtBQUssQ0FBQyxNQUFNLElBQUksNEJBQTRCLENBQUMsTUFBTSxHQUFHLENBQUMsRUFBRTtZQUM5RCxJQUFJLENBQUMsS0FBSyxDQUFDLEdBQUcsQ0FBQyxDQUFDLElBQUksRUFBRSxFQUFFLENBQUMsSUFBSSxDQUFDLGNBQWMsRUFBRSxDQUFDO2lCQUMxQyxPQUFPLENBQUMsQ0FBQyxlQUFlLEVBQUUsRUFBRTtnQkFDekIsSUFBSSxDQUFDLFFBQVEsQ0FBQyxXQUFXLENBQUMsZUFBZSxFQUFFLGlCQUFpQixDQUFDLENBQUM7Z0JBQzlELElBQUksQ0FBQyxRQUFRLENBQUMsV0FBVyxDQUFDLGVBQWUsRUFBRSxrQkFBa0IsQ0FBQyxDQUFDO2dCQUUvRCxNQUFNLFNBQVMsR0FBRyw0QkFBNEIsQ0FBQyxTQUFTLENBQ3BELENBQUMsSUFBSSxFQUFFLEVBQUUsQ0FBQyxJQUFJLEtBQUssZUFBZSxDQUNyQyxDQUFDO2dCQUVGLElBQUksU0FBUyxLQUFLLENBQUMsRUFBRTtvQkFDakIsSUFBSSxDQUFDLFFBQVEsQ0FBQyxRQUFRLENBQUMsZUFBZSxFQUFFLGlCQUFpQixDQUFDLENBQUM7b0JBQzNELElBQUksQ0FBQyxRQUFRLENBQUMsUUFBUSxDQUFDLElBQUksQ0FBQyxhQUFhLEVBQUUsc0JBQXNCLENBQUMsQ0FBQztpQkFDdEU7Z0JBRUQsSUFBSSxTQUFTLEtBQUssNEJBQTRCLENBQUMsTUFBTSxHQUFHLENBQUMsRUFBRTtvQkFDdkQsSUFBSSxDQUFDLFFBQVEsQ0FBQyxRQUFRLENBQUMsZUFBZSxFQUFFLGtCQUFrQixDQUFDLENBQUM7b0JBQzVELElBQUksQ0FBQyxRQUFRLENBQUMsUUFBUSxDQUFDLElBQUksQ0FBQyxhQUFhLEVBQUUsdUJBQXVCLENBQUMsQ0FBQztpQkFDdkU7WUFDTCxDQUFDLENBQUMsQ0FBQztTQUNWO0lBRUwsQ0FBQztpSUExRFEsaUJBQWlCO3FIQUFqQixpQkFBaUIsMEdBQ1MsT0FBTzs7MkZBRGpDLGlCQUFpQjtrQkFIN0IsU0FBUzttQkFBQztvQkFDUCxRQUFRLEVBQUUsV0FBVztpQkFDeEI7OzBCQVdRLFFBQVE7NENBVGlDLEtBQUs7c0JBQWxELGVBQWU7dUJBQUMsQ0FBQyxVQUFVLENBQUMsR0FBRyxFQUFFLENBQUMsT0FBTyxDQUFDLENBQUM7O0FBMkVoRCxNQUFNLE9BQU8sUUFBUTtJQWRyQjtRQWlCYSxZQUFPLEdBQVksS0FBSyxDQUFDO1FBQ3pCLFlBQU8sR0FBWSxLQUFLLENBQUM7UUFXMUIsZ0JBQVcsR0FBNEIsY0FBYyxDQUFDLFlBQVksQ0FBQztLQUM5RTtJQVZHLElBQ0ksVUFBVTtRQUNWLE9BQU8sYUFBYSxJQUFJLENBQUMsV0FBVyxFQUFFLENBQUM7SUFDM0MsQ0FBQztJQUVELElBQUksVUFBVSxDQUFDLEtBQThCO1FBQ3pDLElBQUksQ0FBQyxXQUFXLEdBQUcsS0FBSyxJQUFJLGNBQWMsQ0FBQyxZQUFZLENBQUM7SUFDNUQsQ0FBQztpSUFiUSxRQUFRO3FIQUFSLFFBQVEscVdBQ0gsV0FBVyxnREFiZiwyQkFBMkI7OzJGQVk1QixRQUFRO2tCQWRwQixTQUFTOytCQUNJLFdBQVcsWUFDWCwyQkFBMkIsbUJBRXBCLHVCQUF1QixDQUFDLE1BQU0saUJBQ2hDLGlCQUFpQixDQUFDLElBQUksUUFDL0I7d0JBQ0YsS0FBSyxFQUFFLFdBQVc7d0JBQ2xCLDJCQUEyQixFQUFFLFNBQVM7d0JBQ3RDLDBCQUEwQixFQUFFLFVBQVU7d0JBQ3RDLDJCQUEyQixFQUFFLFNBQVM7d0JBQ3RDLFNBQVMsRUFBRSxZQUFZO3FCQUMxQjs4QkFHMEIsUUFBUTtzQkFBbEMsWUFBWTt1QkFBQyxXQUFXO2dCQUVoQixPQUFPO3NCQUFmLEtBQUs7Z0JBQ0csT0FBTztzQkFBZixLQUFLO2dCQUdGLFVBQVU7c0JBRGIsS0FBSyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7XG4gICAgQWZ0ZXJDb250ZW50SW5pdCxcbiAgICBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSxcbiAgICBDaGFuZ2VEZXRlY3RvclJlZixcbiAgICBDb21wb25lbnQsXG4gICAgQ29udGVudENoaWxkLFxuICAgIENvbnRlbnRDaGlsZHJlbixcbiAgICBEaXJlY3RpdmUsXG4gICAgRWxlbWVudFJlZixcbiAgICBmb3J3YXJkUmVmLFxuICAgIElucHV0LFxuICAgIFF1ZXJ5TGlzdCxcbiAgICBSZW5kZXJlcjIsXG4gICAgU2tpcFNlbGYsXG4gICAgVmlld0VuY2Fwc3VsYXRpb25cbn0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBLYnFJY29uLCBLYnFJY29uSXRlbSB9IGZyb20gJ0Brb29iaXEvY29tcG9uZW50cy9pY29uJztcblxuXG5leHBvcnQgZW51bSBLYnFCYWRnZUNvbG9ycyB7XG4gICAgRmFkZUNvbnRyYXN0ID0gJ2ZhZGUtY29udHJhc3QnLFxuICAgIEZhZGVUaGVtZSA9ICdmYWRlLXRoZW1lJyxcbiAgICBGYWRlU3VjY2VzcyA9ICdmYWRlLXN1Y2Nlc3MnLFxuICAgIEZhZGVXYXJuaW5nID0gJ2ZhZGUtd2FybmluZycsXG4gICAgRmFkZUVycm9yID0gJ2ZhZGUtZXJyb3InLFxuXG4gICAgU3VjY2VzcyA9ICdzdWNjZXNzJyxcbiAgICBXYXJuaW5nID0gJ3dhcm5pbmcnLFxuICAgIEVycm9yID0gJ2Vycm9yJ1xufVxuXG5ARGlyZWN0aXZlKHtcbiAgICBzZWxlY3RvcjogJ1trYnEtYmFkZ2UtY2FwdGlvbl0nLFxuICAgIGhvc3Q6IHtcbiAgICAgICAgY2xhc3M6ICdrYnEtYmFkZ2UtY2FwdGlvbidcbiAgICB9XG59KVxuZXhwb3J0IGNsYXNzIEticUJhZGdlQ2FwdGlvbiB7fVxuXG5cbmV4cG9ydCBjb25zdCBnZXROb2Rlc1dpdGhvdXRDb21tZW50cyA9IChub2RlczogTm9kZUxpc3QpOiBOb2RlW10gPT4ge1xuICAgIGNvbnN0IENPTU1FTlRfTk9ERSA9IDg7XG5cbiAgICByZXR1cm4gQXJyYXkuZnJvbShub2RlcykuZmlsdGVyKChub2RlKSA9PiBub2RlLm5vZGVUeXBlICE9PSBDT01NRU5UX05PREUpO1xufTtcblxuZXhwb3J0IGNvbnN0IGxlZnRJY29uQ2xhc3NOYW1lID0gJ2ticS1pY29uX2xlZnQnO1xuZXhwb3J0IGNvbnN0IHJpZ2h0SWNvbkNsYXNzTmFtZSA9ICdrYnEtaWNvbl9yaWdodCc7XG5cbmV4cG9ydCBjb25zdCBiYWRnZUxlZnRJY29uQ2xhc3NOYW1lID0gJ2ticS1iYWRnZS1pY29uX2xlZnQnO1xuZXhwb3J0IGNvbnN0IGJhZGdlUmlnaHRJY29uQ2xhc3NOYW1lID0gJ2ticS1iYWRnZS1pY29uX3JpZ2h0JztcblxuXG5ARGlyZWN0aXZlKHtcbiAgICBzZWxlY3RvcjogJ2ticS1iYWRnZSdcbn0pXG5leHBvcnQgY2xhc3MgS2JxQmFkZ2VDc3NTdHlsZXIgaW1wbGVtZW50cyBBZnRlckNvbnRlbnRJbml0IHtcbiAgICBAQ29udGVudENoaWxkcmVuKChmb3J3YXJkUmVmKCgpID0+IEticUljb24pKSkgaWNvbnM6IFF1ZXJ5TGlzdDxLYnFJY29uPjtcblxuICAgIG5hdGl2ZUVsZW1lbnQ6IEhUTUxFbGVtZW50O1xuXG4gICAgaXNJY29uQnV0dG9uOiBib29sZWFuID0gZmFsc2U7XG5cbiAgICBjb25zdHJ1Y3RvcihcbiAgICAgICAgZWxlbWVudFJlZjogRWxlbWVudFJlZixcbiAgICAgICAgcHJpdmF0ZSByZW5kZXJlcjogUmVuZGVyZXIyLFxuICAgICAgICBAU2tpcFNlbGYoKSBwcml2YXRlIGNkcjogQ2hhbmdlRGV0ZWN0b3JSZWZcbiAgICApIHtcbiAgICAgICAgdGhpcy5uYXRpdmVFbGVtZW50ID0gZWxlbWVudFJlZi5uYXRpdmVFbGVtZW50O1xuICAgIH1cblxuICAgIG5nQWZ0ZXJDb250ZW50SW5pdCgpIHtcbiAgICAgICAgdGhpcy51cGRhdGVDbGFzc01vZGlmaWVyRm9ySWNvbnMoKTtcbiAgICB9XG5cbiAgICB1cGRhdGVDbGFzc01vZGlmaWVyRm9ySWNvbnMoKSB7XG4gICAgICAgIHRoaXMucmVuZGVyZXIucmVtb3ZlQ2xhc3ModGhpcy5uYXRpdmVFbGVtZW50LCBiYWRnZUxlZnRJY29uQ2xhc3NOYW1lKTtcbiAgICAgICAgdGhpcy5yZW5kZXJlci5yZW1vdmVDbGFzcyh0aGlzLm5hdGl2ZUVsZW1lbnQsIGJhZGdlUmlnaHRJY29uQ2xhc3NOYW1lKTtcblxuICAgICAgICBjb25zdCB0d29JY29ucyA9IDI7XG4gICAgICAgIGNvbnN0IGZpbHRlcmVkTm9kZXNXaXRob3V0Q29tbWVudHMgPSBnZXROb2Rlc1dpdGhvdXRDb21tZW50cyhcbiAgICAgICAgICAgIHRoaXMubmF0aXZlRWxlbWVudC5jaGlsZE5vZGVzIGFzIE5vZGVMaXN0XG4gICAgICAgICk7XG5cbiAgICAgICAgY29uc3QgY3VycmVudElzSWNvbkJ1dHRvblZhbHVlID0gISF0aGlzLmljb25zLmxlbmd0aCAmJlxuICAgICAgICAgICAgdGhpcy5pY29ucy5sZW5ndGggPT09IGZpbHRlcmVkTm9kZXNXaXRob3V0Q29tbWVudHMubGVuZ3RoICYmIHRoaXMuaWNvbnMubGVuZ3RoIDw9IHR3b0ljb25zO1xuXG4gICAgICAgIGlmIChjdXJyZW50SXNJY29uQnV0dG9uVmFsdWUgIT09IHRoaXMuaXNJY29uQnV0dG9uKSB7XG4gICAgICAgICAgICB0aGlzLmlzSWNvbkJ1dHRvbiA9IGN1cnJlbnRJc0ljb25CdXR0b25WYWx1ZTtcbiAgICAgICAgICAgIHRoaXMuY2RyLmRldGVjdENoYW5nZXMoKTtcbiAgICAgICAgfVxuXG4gICAgICAgIGlmICh0aGlzLmljb25zLmxlbmd0aCAmJiBmaWx0ZXJlZE5vZGVzV2l0aG91dENvbW1lbnRzLmxlbmd0aCA+IDEpIHtcbiAgICAgICAgICAgIHRoaXMuaWNvbnMubWFwKChpdGVtKSA9PiBpdGVtLmdldEhvc3RFbGVtZW50KCkpXG4gICAgICAgICAgICAgICAgLmZvckVhY2goKGljb25Ib3N0RWxlbWVudCkgPT4ge1xuICAgICAgICAgICAgICAgICAgICB0aGlzLnJlbmRlcmVyLnJlbW92ZUNsYXNzKGljb25Ib3N0RWxlbWVudCwgbGVmdEljb25DbGFzc05hbWUpO1xuICAgICAgICAgICAgICAgICAgICB0aGlzLnJlbmRlcmVyLnJlbW92ZUNsYXNzKGljb25Ib3N0RWxlbWVudCwgcmlnaHRJY29uQ2xhc3NOYW1lKTtcblxuICAgICAgICAgICAgICAgICAgICBjb25zdCBpY29uSW5kZXggPSBmaWx0ZXJlZE5vZGVzV2l0aG91dENvbW1lbnRzLmZpbmRJbmRleChcbiAgICAgICAgICAgICAgICAgICAgICAgIChub2RlKSA9PiBub2RlID09PSBpY29uSG9zdEVsZW1lbnRcbiAgICAgICAgICAgICAgICAgICAgKTtcblxuICAgICAgICAgICAgICAgICAgICBpZiAoaWNvbkluZGV4ID09PSAwKSB7XG4gICAgICAgICAgICAgICAgICAgICAgICB0aGlzLnJlbmRlcmVyLmFkZENsYXNzKGljb25Ib3N0RWxlbWVudCwgbGVmdEljb25DbGFzc05hbWUpO1xuICAgICAgICAgICAgICAgICAgICAgICAgdGhpcy5yZW5kZXJlci5hZGRDbGFzcyh0aGlzLm5hdGl2ZUVsZW1lbnQsIGJhZGdlTGVmdEljb25DbGFzc05hbWUpO1xuICAgICAgICAgICAgICAgICAgICB9XG5cbiAgICAgICAgICAgICAgICAgICAgaWYgKGljb25JbmRleCA9PT0gZmlsdGVyZWROb2Rlc1dpdGhvdXRDb21tZW50cy5sZW5ndGggLSAxKSB7XG4gICAgICAgICAgICAgICAgICAgICAgICB0aGlzLnJlbmRlcmVyLmFkZENsYXNzKGljb25Ib3N0RWxlbWVudCwgcmlnaHRJY29uQ2xhc3NOYW1lKTtcbiAgICAgICAgICAgICAgICAgICAgICAgIHRoaXMucmVuZGVyZXIuYWRkQ2xhc3ModGhpcy5uYXRpdmVFbGVtZW50LCBiYWRnZVJpZ2h0SWNvbkNsYXNzTmFtZSk7XG4gICAgICAgICAgICAgICAgICAgIH1cbiAgICAgICAgICAgICAgICB9KTtcbiAgICAgICAgfVxuXG4gICAgfVxufVxuXG5cbkBDb21wb25lbnQoe1xuICAgIHNlbGVjdG9yOiAna2JxLWJhZGdlJyxcbiAgICB0ZW1wbGF0ZTogJzxuZy1jb250ZW50PjwvbmctY29udGVudD4nLFxuICAgIHN0eWxlVXJsczogWydiYWRnZS5jb21wb25lbnQuc2NzcyddLFxuICAgIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxuICAgIGVuY2Fwc3VsYXRpb246IFZpZXdFbmNhcHN1bGF0aW9uLk5vbmUsXG4gICAgaG9zdDoge1xuICAgICAgICBjbGFzczogJ2ticS1iYWRnZScsXG4gICAgICAgICdbY2xhc3Mua2JxLWJhZGdlX2NvbXBhY3RdJzogJ2NvbXBhY3QnLFxuICAgICAgICAnW2NsYXNzLmticS1iYWRnZS1maWxsZWRdJzogJyFvdXRsaW5lJyxcbiAgICAgICAgJ1tjbGFzcy5rYnEtYmFkZ2Utb3V0bGluZV0nOiAnb3V0bGluZScsXG4gICAgICAgICdbY2xhc3NdJzogJ2JhZGdlQ29sb3InXG4gICAgfVxufSlcbmV4cG9ydCBjbGFzcyBLYnFCYWRnZSB7XG4gICAgQENvbnRlbnRDaGlsZChLYnFJY29uSXRlbSkgaWNvbkl0ZW06IEticUljb25JdGVtO1xuXG4gICAgQElucHV0KCkgY29tcGFjdDogYm9vbGVhbiA9IGZhbHNlO1xuICAgIEBJbnB1dCgpIG91dGxpbmU6IGJvb2xlYW4gPSBmYWxzZTtcblxuICAgIEBJbnB1dCgpXG4gICAgZ2V0IGJhZGdlQ29sb3IoKTogc3RyaW5nIHtcbiAgICAgICAgcmV0dXJuIGBrYnEtYmFkZ2VfJHt0aGlzLl9iYWRnZUNvbG9yfWA7XG4gICAgfVxuXG4gICAgc2V0IGJhZGdlQ29sb3IodmFsdWU6IHN0cmluZyB8IEticUJhZGdlQ29sb3JzKSB7XG4gICAgICAgIHRoaXMuX2JhZGdlQ29sb3IgPSB2YWx1ZSB8fCBLYnFCYWRnZUNvbG9ycy5GYWRlQ29udHJhc3Q7XG4gICAgfVxuXG4gICAgcHJpdmF0ZSBfYmFkZ2VDb2xvcjogc3RyaW5nIHwgS2JxQmFkZ2VDb2xvcnMgPSBLYnFCYWRnZUNvbG9ycy5GYWRlQ29udHJhc3Q7XG59XG4iXX0=

package/esm2022/badge/badge.module.mjs

@@ -2,15 +2,17 @@ import { A11yModule } from '@angular/cdk/a11y';
 import { PlatformModule } from '@angular/cdk/platform';
 import { CommonModule } from '@angular/common';
 import { NgModule } from '@angular/core';
-import { KbqBadge, KbqBadgeCaption } from './badge.component';
+import { KbqBadge, KbqBadgeCaption, KbqBadgeCssStyler } from './badge.component';
 import * as i0 from "@angular/core";
 export class KbqBadgeModule {
     /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: KbqBadgeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
     /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.5", ngImport: i0, type: KbqBadgeModule, declarations: [KbqBadge,
-            KbqBadgeCaption], imports: [CommonModule,
+            KbqBadgeCaption,
+            KbqBadgeCssStyler], imports: [CommonModule,
             A11yModule,
             PlatformModule], exports: [KbqBadge,
-            KbqBadgeCaption] }); }
+            KbqBadgeCaption,
+            KbqBadgeCssStyler] }); }
     /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: KbqBadgeModule, imports: [CommonModule,
             A11yModule,
             PlatformModule] }); }
@@ -25,12 +27,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImpor
                     ],
                     declarations: [
                         KbqBadge,
-                        KbqBadgeCaption
+                        KbqBadgeCaption,
+                        KbqBadgeCssStyler
                     ],
                     exports: [
                         KbqBadge,
-                        KbqBadgeCaption
+                        KbqBadgeCaption,
+                        KbqBadgeCssStyler
                     ]
                 }]
         }] });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYmFkZ2UubW9kdWxlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vcGFja2FnZXMvY29tcG9uZW50cy9iYWRnZS9iYWRnZS5tb2R1bGUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFVBQVUsRUFBRSxNQUFNLG1CQUFtQixDQUFDO0FBQy9DLE9BQU8sRUFBRSxjQUFjLEVBQUUsTUFBTSx1QkFBdUIsQ0FBQztBQUN2RCxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0saUJBQWlCLENBQUM7QUFDL0MsT0FBTyxFQUFFLFFBQVEsRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUV6QyxPQUFPLEVBQUUsUUFBUSxFQUFFLGVBQWUsRUFBRSxNQUFNLG1CQUFtQixDQUFDOztBQWtCOUQsTUFBTSxPQUFPLGNBQWM7aUlBQWQsY0FBYztrSUFBZCxjQUFjLGlCQVJuQixRQUFRO1lBQ1IsZUFBZSxhQU5mLFlBQVk7WUFDWixVQUFVO1lBQ1YsY0FBYyxhQU9kLFFBQVE7WUFDUixlQUFlO2tJQUdWLGNBQWMsWUFibkIsWUFBWTtZQUNaLFVBQVU7WUFDVixjQUFjOzsyRkFXVCxjQUFjO2tCQWYxQixRQUFRO21CQUFDO29CQUNOLE9BQU8sRUFBRTt3QkFDTCxZQUFZO3dCQUNaLFVBQVU7d0JBQ1YsY0FBYztxQkFDakI7b0JBQ0QsWUFBWSxFQUFFO3dCQUNWLFFBQVE7d0JBQ1IsZUFBZTtxQkFDbEI7b0JBQ0QsT0FBTyxFQUFFO3dCQUNMLFFBQVE7d0JBQ1IsZUFBZTtxQkFDbEI7aUJBQ0oiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBBMTF5TW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvY2RrL2ExMXknO1xuaW1wb3J0IHsgUGxhdGZvcm1Nb2R1bGUgfSBmcm9tICdAYW5ndWxhci9jZGsvcGxhdGZvcm0nO1xuaW1wb3J0IHsgQ29tbW9uTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvY29tbW9uJztcbmltcG9ydCB7IE5nTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbmltcG9ydCB7IEticUJhZGdlLCBLYnFCYWRnZUNhcHRpb24gfSBmcm9tICcuL2JhZGdlLmNvbXBvbmVudCc7XG5cblxuQE5nTW9kdWxlKHtcbiAgICBpbXBvcnRzOiBbXG4gICAgICAgIENvbW1vbk1vZHVsZSxcbiAgICAgICAgQTExeU1vZHVsZSxcbiAgICAgICAgUGxhdGZvcm1Nb2R1bGVcbiAgICBdLFxuICAgIGRlY2xhcmF0aW9uczogW1xuICAgICAgICBLYnFCYWRnZSxcbiAgICAgICAgS2JxQmFkZ2VDYXB0aW9uXG4gICAgXSxcbiAgICBleHBvcnRzOiBbXG4gICAgICAgIEticUJhZGdlLFxuICAgICAgICBLYnFCYWRnZUNhcHRpb25cbiAgICBdXG59KVxuZXhwb3J0IGNsYXNzIEticUJhZGdlTW9kdWxlIHt9XG4iXX0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYmFkZ2UubW9kdWxlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vcGFja2FnZXMvY29tcG9uZW50cy9iYWRnZS9iYWRnZS5tb2R1bGUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFVBQVUsRUFBRSxNQUFNLG1CQUFtQixDQUFDO0FBQy9DLE9BQU8sRUFBRSxjQUFjLEVBQUUsTUFBTSx1QkFBdUIsQ0FBQztBQUN2RCxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0saUJBQWlCLENBQUM7QUFDL0MsT0FBTyxFQUFFLFFBQVEsRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUV6QyxPQUFPLEVBQ0gsUUFBUSxFQUNSLGVBQWUsRUFDZixpQkFBaUIsRUFDcEIsTUFBTSxtQkFBbUIsQ0FBQzs7QUFvQjNCLE1BQU0sT0FBTyxjQUFjO2lJQUFkLGNBQWM7a0lBQWQsY0FBYyxpQkFWbkIsUUFBUTtZQUNSLGVBQWU7WUFDZixpQkFBaUIsYUFQakIsWUFBWTtZQUNaLFVBQVU7WUFDVixjQUFjLGFBUWQsUUFBUTtZQUNSLGVBQWU7WUFDZixpQkFBaUI7a0lBR1osY0FBYyxZQWZuQixZQUFZO1lBQ1osVUFBVTtZQUNWLGNBQWM7OzJGQWFULGNBQWM7a0JBakIxQixRQUFRO21CQUFDO29CQUNOLE9BQU8sRUFBRTt3QkFDTCxZQUFZO3dCQUNaLFVBQVU7d0JBQ1YsY0FBYztxQkFDakI7b0JBQ0QsWUFBWSxFQUFFO3dCQUNWLFFBQVE7d0JBQ1IsZUFBZTt3QkFDZixpQkFBaUI7cUJBQ3BCO29CQUNELE9BQU8sRUFBRTt3QkFDTCxRQUFRO3dCQUNSLGVBQWU7d0JBQ2YsaUJBQWlCO3FCQUNwQjtpQkFDSiIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IEExMXlNb2R1bGUgfSBmcm9tICdAYW5ndWxhci9jZGsvYTExeSc7XG5pbXBvcnQgeyBQbGF0Zm9ybU1vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2Nkay9wbGF0Zm9ybSc7XG5pbXBvcnQgeyBDb21tb25Nb2R1bGUgfSBmcm9tICdAYW5ndWxhci9jb21tb24nO1xuaW1wb3J0IHsgTmdNb2R1bGUgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcblxuaW1wb3J0IHtcbiAgICBLYnFCYWRnZSxcbiAgICBLYnFCYWRnZUNhcHRpb24sXG4gICAgS2JxQmFkZ2VDc3NTdHlsZXJcbn0gZnJvbSAnLi9iYWRnZS5jb21wb25lbnQnO1xuXG5cbkBOZ01vZHVsZSh7XG4gICAgaW1wb3J0czogW1xuICAgICAgICBDb21tb25Nb2R1bGUsXG4gICAgICAgIEExMXlNb2R1bGUsXG4gICAgICAgIFBsYXRmb3JtTW9kdWxlXG4gICAgXSxcbiAgICBkZWNsYXJhdGlvbnM6IFtcbiAgICAgICAgS2JxQmFkZ2UsXG4gICAgICAgIEticUJhZGdlQ2FwdGlvbixcbiAgICAgICAgS2JxQmFkZ2VDc3NTdHlsZXJcbiAgICBdLFxuICAgIGV4cG9ydHM6IFtcbiAgICAgICAgS2JxQmFkZ2UsXG4gICAgICAgIEticUJhZGdlQ2FwdGlvbixcbiAgICAgICAgS2JxQmFkZ2VDc3NTdHlsZXJcbiAgICBdXG59KVxuZXhwb3J0IGNsYXNzIEticUJhZGdlTW9kdWxlIHt9XG4iXX0=

package/esm2022/core/version.mjs

@@ -1,3 +1,3 @@
 import { Version } from '@angular/core';
-export const VERSION = new Version('16.0.0-beta.8+sha-d3be23f');
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidmVyc2lvbi5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3BhY2thZ2VzL2NvbXBvbmVudHMvY29yZS92ZXJzaW9uLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxPQUFPLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFHeEMsTUFBTSxDQUFDLE1BQU0sT0FBTyxHQUFHLElBQUksT0FBTyxDQUFDLDJCQUEyQixDQUFDLENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBWZXJzaW9uIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cblxuZXhwb3J0IGNvbnN0IFZFUlNJT04gPSBuZXcgVmVyc2lvbignMTYuMC4wLWJldGEuOCtzaGEtZDNiZTIzZicpO1xuIl19
+export const VERSION = new Version('16.0.0-beta.8+sha-d1a32007');
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidmVyc2lvbi5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3BhY2thZ2VzL2NvbXBvbmVudHMvY29yZS92ZXJzaW9uLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxPQUFPLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFHeEMsTUFBTSxDQUFDLE1BQU0sT0FBTyxHQUFHLElBQUksT0FBTyxDQUFDLDRCQUE0QixDQUFDLENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBWZXJzaW9uIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cblxuZXhwb3J0IGNvbnN0IFZFUlNJT04gPSBuZXcgVmVyc2lvbignMTYuMC4wLWJldGEuOCtzaGEtZDFhMzIwMDcnKTtcbiJdfQ==

package/esm2022/file-upload/multiple-file-upload.component.mjs

@@ -127,7 +127,7 @@ export class KbqMultipleFileUploadComponent {
         return this.acceptedFiles !== '*/*' && this.acceptedFiles.length > 0 ? this.acceptedFiles.includes(fileExt) : true;
     }
     /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: KbqMultipleFileUploadComponent, deps: [{ token: i1.FocusMonitor }, { token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }, { token: KBQ_FILE_UPLOAD_CONFIGURATION, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.5", type: KbqMultipleFileUploadComponent, selector: "kbq-multiple-file-upload", inputs: { accept: "accept", disabled: "disabled", errors: "errors", files: "files", size: "size", inputId: "inputId", customValidation: "customValidation" }, outputs: { fileQueueChanged: "fileQueueChanged" }, host: { classAttribute: "kbq-multiple-file-upload" }, queries: [{ propertyName: "customFileIcon", first: true, predicate: ["kbqFileIcon"], descendants: true, read: TemplateRef }], viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], ngImport: i0, template: "<div class=\"kbq-file-upload\"\n     kbqFileDrop\n     [class.kbq-disabled]=\"disabled\"\n     [class.selected]=\"files && files.length\"\n     [ngClass]=\"size\"\n     (filesDropped)=\"onFileDropped($event)\">\n\n    <ng-container *ngIf=\"!files.length; else fileOutput\">\n        <div class=\"dropzone\">\n            <ng-container  *ngIf=\"size === 'default' else compactCaption\">\n                <i kbq-icon=\"mc-upload-to-cloud_32\"></i>\n                <div class=\"dropzone__text\">\n                    <span class=\"multiple__header\">{{ config.title }}</span>\n                    <div>\n                        <span class=\"multiple__caption\">\n                            {{ config.captionText }}\n                            <label class=\"kbq-link\"\n                                   [class.kbq-focused]=\"hasFocus\"\n                                   [for]=\"inputId\">\n                            {{ config.browseLink }}\n                        </label>\n                        </span>\n                    </div>\n                </div>\n            </ng-container>\n        </div>\n    </ng-container>\n\n    <input #input\n           type=\"file\"\n           class=\"cdk-visually-hidden\"\n           multiple\n           [id]=\"inputId\"\n           [accept]=\"acceptedFiles\"\n           [disabled]=\"disabled\"\n           (change)=\"onFileSelectedViaClick($event)\">\n</div>\n\n<div class=\"kbq-file-upload__info-section\">\n    <kbq-hint class=\"kbq-file-upload__hint\">\n        <ng-content select=\"[hint]\"></ng-content>\n    </kbq-hint>\n\n    <ng-container *ngIf=\"hasErrors\">\n        <kbq-hint class=\"kbq-file-upload__hint kbq-error\"\n                 *ngFor=\"let error of errors\">\n                {{ error }}\n        </kbq-hint>\n    </ng-container>\n</div>\n\n<ng-template #fileOutput>\n    <div class=\"file-upload__dropzone\">\n        <div class=\"kbq-file-upload__grid\">\n            <div class=\"kbq-file-multiple-uploaded__header\">\n                <div class=\"kbq-file-multiple-uploaded__header-inner\">\n                    <div [class]=\"'kbq-file-upload__' + column.cssClass\" *ngFor=\"let column of columnDefs\">\n                        {{ column.header }}\n                    </div>\n                </div>\n            </div>\n\n            <kbq-list-selection [autoSelect]=\"false\" [disabled]=\"disabled\">\n                <kbq-list-option\n                    class=\"multiple__uploaded-item\"\n                    [value]=\"file.file.name\"\n                    (keydown.delete)=\"deleteFile(index)\"\n                    (keydown.backspace)=\"deleteFile(index)\"\n                    *ngFor=\"let file of files; let index = index;\">\n                    <div class=\"kbq-file-upload__row\" [class.error]=\"file.hasError\">\n                        <div class=\"kbq-file-upload__file\">\n                            <ng-container *ngIf=\"{ loading: file.loading | async, progress: file.progress | async } as asyncData\">\n                                <ng-container *ngIf=\"!asyncData.loading\"\n                                              [ngTemplateOutlet]=\"$any(customFileIcon)\"\n                                              [ngTemplateOutletContext]=\"{ $implicit: file }\">\n                                </ng-container>\n\n                                <kbq-progress-spinner\n                                    class=\"pt-nat-file-upload-name-cell__icon\"\n                                    [value]=\"asyncData.progress || 0\"\n                                    *ngIf=\"asyncData.loading\"\n                                ></kbq-progress-spinner>\n                            </ng-container>\n\n                            <span class=\"file-item__text\" [mcEllipsisCenter]=\"file.file.name\" [minVisibleLength]=\"10\"></span>\n                        </div>\n                        <div class=\"kbq-file-upload__size\">\n                            {{ file.file.size | mcDataSize }}\n                        </div>\n                        <div class=\"kbq-file-upload__action\">\n                            <i kbq-icon-button=\"mc-close-circle_16\" (click)=\"deleteFile(index, $event)\"></i>\n                        </div>\n                    </div>\n                </kbq-list-option>\n            </kbq-list-selection>\n        </div>\n\n        <div class=\"btn-upload\">\n            <div class=\"dropzone\">\n                <i kbq-icon=\"mc-upload-to-cloud_24\"></i>\n                <span class=\"dropzone__text multiple__caption\">\n                    {{ config.captionTextWhenSelected }}\n                    <label class=\"kbq-link\"\n                           [class.kbq-focused]=\"hasFocus\"\n                           [for]=\"inputId\">\n                        {{ config.browseLink }}\n                    </label>\n                </span>\n            </div>\n        </div>\n    </div>\n</ng-template>\n\n<ng-template #compactCaption>\n    <i kbq-icon=\"mc-upload-to-cloud_24\"></i>\n    <span class=\"dropzone__text multiple__caption\">\n        {{ config.captionText }}\n        <label class=\"kbq-link\"\n               [class.kbq-focused]=\"hasFocus\"\n               [for]=\"inputId\">\n        {{ config.browseLink }}\n    </label>\n    </span>\n</ng-template>\n", styles: ["@keyframes kbq-progress{0%{background-position:0 0}to{background-position:29px 0}}.kbq-progress{position:relative}.kbq-progress:after{content:\"\";position:absolute;border-radius:inherit;inset:0;background:linear-gradient(135deg,rgba(0,0,0,.04) 10px,rgba(255,255,255,.04) 10px,rgba(255,255,255,.04) 20px,rgba(0,0,0,.04) 20px,rgba(0,0,0,.04) 30px,rgba(255,255,255,.04) 31px) repeat;background-size:32px 32px;animation:kbq-progress 1s linear infinite}.kbq-group{display:flex;flex-direction:row}.kbq-group .kbq-group_justified>.kbq-group-item{width:100%}.kbq-group .kbq-group-item+.kbq-group-item{margin-left:calc(-1 * var(--kbq-button-size-border-width, 2px))}.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: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){border-bottom-left-radius:0;border-top-left-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){border-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-button-size-border-radius, 8px)}.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){border-top-right-radius:0;border-top-left-radius:0;border-bottom-left-radius:var(--kbq-button-size-border-radius, 8px)}.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){border-radius:0}.kbq-vertical-group>.kbq-group-item:not(:first-child):not(:last-child)>.kbq-form-field__container{border-radius:0}.kbq-vertical-group .kbq-group-item+.kbq-group-item{margin-top:calc(-1 * var(--kbq-button-size-border-width, 2px))}.kbq-no-select{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.kbq-file-upload{box-sizing:border-box;display:flex;align-items:center;position:relative}.kbq-file-upload .dropzone,.kbq-file-upload .file-item{display:flex;align-items:center}.kbq-file-upload .kbq-ellipsis-center{position:relative;display:flex}.kbq-file-upload .kbq-ellipsis-center .data-text-start{flex:0 1 auto;overflow:hidden;text-overflow:ellipsis;white-space:pre}.kbq-file-upload .kbq-ellipsis-center .data-text-end{flex:1 0 auto;overflow:hidden;white-space:pre}\n", "@keyframes kbq-progress{0%{background-position:0 0}to{background-position:29px 0}}.kbq-progress{position:relative}.kbq-progress:after{content:\"\";position:absolute;border-radius:inherit;inset:0;background:linear-gradient(135deg,rgba(0,0,0,.04) 10px,rgba(255,255,255,.04) 10px,rgba(255,255,255,.04) 20px,rgba(0,0,0,.04) 20px,rgba(0,0,0,.04) 30px,rgba(255,255,255,.04) 31px) repeat;background-size:32px 32px;animation:kbq-progress 1s linear infinite}.kbq-group{display:flex;flex-direction:row}.kbq-group .kbq-group_justified>.kbq-group-item{width:100%}.kbq-group .kbq-group-item+.kbq-group-item{margin-left:calc(-1 * var(--kbq-button-size-border-width, 2px))}.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: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){border-bottom-left-radius:0;border-top-left-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){border-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-button-size-border-radius, 8px)}.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){border-top-right-radius:0;border-top-left-radius:0;border-bottom-left-radius:var(--kbq-button-size-border-radius, 8px)}.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){border-radius:0}.kbq-vertical-group>.kbq-group-item:not(:first-child):not(:last-child)>.kbq-form-field__container{border-radius:0}.kbq-vertical-group .kbq-group-item+.kbq-group-item{margin-top:calc(-1 * var(--kbq-button-size-border-width, 2px))}.kbq-no-select{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.kbq-multiple-file-upload .kbq-file-upload{border-radius:var(--kbq-file-upload-size-multiple-big-container-border-radius, 8px);border-width:var(--kbq-file-upload-size-multiple-big-container-border-width, 1px);border-style:dashed}.kbq-multiple-file-upload .kbq-file-upload.default:not(.selected){justify-content:center;padding:var(--kbq-file-upload-size-multiple-big-container-padding-vertical, 24px) var(--kbq-file-upload-size-multiple-big-container-padding-vertical, 24px);min-height:var(--kbq-file-upload-size-multiple-big-container-min-height, 160px);min-width:var(--kbq-file-upload-size-multiple-big-container-min-width, 320px)}.kbq-multiple-file-upload .kbq-file-upload.default:not(.selected) .dropzone{gap:var(--kbq-file-upload-size-multiple-big-container-content-gap-horizontal, 12px)}.kbq-multiple-file-upload .kbq-file-upload.default:not(.selected) .dropzone__text .multiple__caption{padding-top:var(--kbq-file-upload-size-multiple-big-text-block-content-gap-vertical, 4px);gap:var(--kbq-file-upload-size-multiple-big-text-block-content-gap-horizontal, 4px)}.kbq-multiple-file-upload .kbq-file-upload.compact:not(.selected){padding:var(--kbq-file-upload-size-single-container-padding-vertical, 12px) var(--kbq-file-upload-size-single-container-padding-horizontal, 12px)}.kbq-multiple-file-upload .kbq-file-upload.compact:not(.selected) .dropzone{gap:var(--kbq-file-upload-size-single-container-content-gap-horizontal, 8px)}.kbq-multiple-file-upload .kbq-file-upload.compact:not(.selected) .dropzone .dropzone__text.multiple__caption{padding-top:var(--kbq-file-upload-size-single-text-block-padding-vertical, 4px);padding-bottom:var(--kbq-file-upload-size-single-text-block-padding-vertical, 4px);gap:var(--kbq-file-upload-size-single-text-block-content-gap-horizontal, 4px)}.kbq-multiple-file-upload .kbq-file-upload .kbq-list-option.multiple__uploaded-item{padding:0}.kbq-multiple-file-upload .kbq-file-upload .kbq-list-option.multiple__uploaded-item .kbq-list-text{padding:calc(var(--kbq-file-upload-size-multiple-big-grid-cell-padding-vertical, 8px) - var(--kbq-list-size-container-focus-outline-width, 2px)) calc(var(--kbq-file-upload-size-multiple-big-grid-cell-padding-horizontal, 8px) - var(--kbq-list-size-container-focus-outline-width, 2px))}.kbq-multiple-file-upload .kbq-file-upload .kbq-list-option.multiple__uploaded-item .kbq-icon{margin-right:0}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__grid{min-height:144px}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-multiple-uploaded__header-inner,.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__row{display:flex;align-items:center}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-multiple-uploaded__header-inner .kbq-file-upload__file,.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__row .kbq-file-upload__file{width:65%;max-width:65%;gap:var(--kbq-file-upload-size-multiple-big-grid-cell-content-gap-horizontal, 4px)}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-multiple-uploaded__header-inner .kbq-file-upload__size,.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__row .kbq-file-upload__size{width:64px;min-width:64px;text-align:left;flex-grow:1}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__row .kbq-file-upload__file{display:flex;align-items:center}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__row .kbq-file-upload__file .file-item__text{margin-left:0;width:90%}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-multiple-uploaded__header{border-bottom-width:1px;border-bottom-style:solid}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-multiple-uploaded__header .kbq-file-multiple-uploaded__header-inner{padding:calc(var(--kbq-file-upload-size-multiple-big-grid-cell-padding-vertical, 8px) + 3px) calc(var(--kbq-file-upload-size-multiple-big-grid-cell-padding-horizontal, 8px) + 3px)}.kbq-multiple-file-upload .kbq-file-upload .btn-upload{padding:calc(var(--kbq-file-upload-size-single-container-padding-vertical, 12px) - 1px) calc(var(--kbq-file-upload-size-single-container-padding-horizontal, 12px) - 1px);border-top-left-radius:var(--kbq-file-upload-size-single-container-border-radius, 8px);border-top-right-radius:var(--kbq-file-upload-size-single-container-border-radius, 8px);border-top-width:var(--kbq-file-upload-size-single-container-border-width, 1px);border-top-style:dashed}.kbq-multiple-file-upload .kbq-file-upload .btn-upload .dropzone{gap:var(--kbq-file-upload-size-single-container-content-gap-horizontal, 8px)}.kbq-multiple-file-upload .kbq-file-upload .btn-upload .dropzone .dropzone__text.multiple__caption{padding-top:var(--kbq-file-upload-size-single-text-block-padding-vertical, 4px);padding-bottom:var(--kbq-file-upload-size-single-text-block-padding-vertical, 4px);gap:var(--kbq-file-upload-size-single-text-block-content-gap-horizontal, 4px)}.kbq-multiple-file-upload .kbq-file-upload .file-upload__dropzone{width:100%;height:100%}.kbq-hint{display:block}.kbq-file-upload__hint{margin-top:var(--kbq-form-field-hint-size-margin-top, 4px)}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i3.KbqProgressSpinner, selector: "kbq-progress-spinner", inputs: ["color", "id", "value", "mode", "size"] }, { kind: "component", type: i4.KbqIcon, selector: "[kbq-icon]", inputs: ["color", "small", "autoColor"] }, { kind: "component", type: i4.KbqIconButton, selector: "[kbq-icon-button]", inputs: ["color", "small", "tabindex", "disabled"] }, { kind: "component", type: i5.KbqListSelection, selector: "kbq-list-selection", inputs: ["disabled", "autoSelect", "noUnselectLast", "horizontal", "tabIndex", "compareWith"], outputs: ["onSelectAll", "onCopy", "selectionChange"], exportAs: ["kbqListSelection"] }, { kind: "component", type: i5.KbqListOption, selector: "kbq-list-option", inputs: ["checkboxPosition", "value", "disabled", "showCheckbox", "selected"], exportAs: ["kbqListOption"] }, { kind: "component", type: i6.KbqHint, selector: "kbq-hint", inputs: ["color", "id", "fillTextOff"], exportAs: ["kbqHint"] }, { kind: "directive", type: i7.KbqEllipsisCenterDirective, selector: "[mcEllipsisCenter]", inputs: ["mcEllipsisCenter", "minVisibleLength"] }, { kind: "directive", type: i8.KbqFileDropDirective, selector: "[kbqFileDrop]", outputs: ["filesDropped"], exportAs: ["kbqFileDrop"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i9.KbqDataSizePipe, name: "mcDataSize" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.5", type: KbqMultipleFileUploadComponent, selector: "kbq-multiple-file-upload", inputs: { accept: "accept", disabled: "disabled", errors: "errors", files: "files", size: "size", inputId: "inputId", customValidation: "customValidation" }, outputs: { fileQueueChanged: "fileQueueChanged" }, host: { classAttribute: "kbq-multiple-file-upload" }, queries: [{ propertyName: "customFileIcon", first: true, predicate: ["kbqFileIcon"], descendants: true, read: TemplateRef }], viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], ngImport: i0, template: "<div class=\"kbq-file-upload\"\n     kbqFileDrop\n     [class.kbq-disabled]=\"disabled\"\n     [class.selected]=\"files && files.length\"\n     [ngClass]=\"size\"\n     (filesDropped)=\"onFileDropped($event)\">\n\n    <ng-container *ngIf=\"!files.length; else fileOutput\">\n        <div class=\"dropzone\">\n            <ng-container  *ngIf=\"size === 'default' else compactCaption\">\n                <i kbq-icon=\"mc-upload-to-cloud_32\"></i>\n                <div class=\"dropzone__text\">\n                    <span class=\"multiple__header\">{{ config.title }}</span>\n                    <div>\n                        <span class=\"multiple__caption\">\n                            {{ config.captionText }}\n                            <label class=\"kbq-link\"\n                                   [class.kbq-focused]=\"hasFocus\"\n                                   [for]=\"inputId\">\n                            {{ config.browseLink }}\n                        </label>\n                        </span>\n                    </div>\n                </div>\n            </ng-container>\n        </div>\n    </ng-container>\n\n    <input #input\n           type=\"file\"\n           class=\"cdk-visually-hidden\"\n           multiple\n           [id]=\"inputId\"\n           [accept]=\"acceptedFiles\"\n           [disabled]=\"disabled\"\n           (change)=\"onFileSelectedViaClick($event)\">\n</div>\n\n<div class=\"kbq-file-upload__info-section\">\n    <kbq-hint class=\"kbq-file-upload__hint\">\n        <ng-content select=\"[hint]\"></ng-content>\n    </kbq-hint>\n\n    <ng-container *ngIf=\"hasErrors\">\n        <kbq-hint class=\"kbq-file-upload__hint kbq-error\"\n                 *ngFor=\"let error of errors\">\n                {{ error }}\n        </kbq-hint>\n    </ng-container>\n</div>\n\n<ng-template #fileOutput>\n    <div class=\"file-upload__dropzone\">\n        <div class=\"kbq-file-upload__grid\">\n            <div class=\"kbq-file-multiple-uploaded__header\">\n                <div class=\"kbq-file-multiple-uploaded__header-inner\">\n                    <div [class]=\"'kbq-file-upload__' + column.cssClass\" *ngFor=\"let column of columnDefs\">\n                        {{ column.header }}\n                    </div>\n                </div>\n            </div>\n\n            <kbq-list-selection [autoSelect]=\"false\" [disabled]=\"disabled\">\n                <kbq-list-option\n                    class=\"multiple__uploaded-item\"\n                    [value]=\"file.file.name\"\n                    (keydown.delete)=\"deleteFile(index)\"\n                    (keydown.backspace)=\"deleteFile(index)\"\n                    *ngFor=\"let file of files; let index = index;\">\n                    <div class=\"kbq-file-upload__row\" [class.error]=\"file.hasError\">\n                        <div class=\"kbq-file-upload__file\">\n                            <ng-container *ngIf=\"{ loading: file.loading | async, progress: file.progress | async } as asyncData\">\n                                <ng-container *ngIf=\"!asyncData.loading\"\n                                              [ngTemplateOutlet]=\"$any(customFileIcon)\"\n                                              [ngTemplateOutletContext]=\"{ $implicit: file }\">\n                                </ng-container>\n\n                                <kbq-progress-spinner\n                                    class=\"pt-nat-file-upload-name-cell__icon\"\n                                    [value]=\"asyncData.progress || 0\"\n                                    *ngIf=\"asyncData.loading\"\n                                ></kbq-progress-spinner>\n                            </ng-container>\n\n                            <span class=\"file-item__text\" [mcEllipsisCenter]=\"file.file.name\" [minVisibleLength]=\"10\"></span>\n                        </div>\n                        <div class=\"kbq-file-upload__size\">\n                            {{ file.file.size | mcDataSize }}\n                        </div>\n                        <div class=\"kbq-file-upload__action\">\n                            <i kbq-icon-button=\"mc-close-circle_16\" (click)=\"deleteFile(index, $event)\"></i>\n                        </div>\n                    </div>\n                </kbq-list-option>\n            </kbq-list-selection>\n        </div>\n\n        <div class=\"btn-upload\">\n            <div class=\"dropzone\">\n                <i kbq-icon=\"mc-upload-to-cloud_24\"></i>\n                <span class=\"dropzone__text multiple__caption\">\n                    {{ config.captionTextWhenSelected }}\n                    <label class=\"kbq-link\"\n                           [class.kbq-focused]=\"hasFocus\"\n                           [for]=\"inputId\">\n                        {{ config.browseLink }}\n                    </label>\n                </span>\n            </div>\n        </div>\n    </div>\n</ng-template>\n\n<ng-template #compactCaption>\n    <i kbq-icon=\"mc-upload-to-cloud_24\"></i>\n    <span class=\"dropzone__text multiple__caption\">\n        {{ config.captionText }}\n        <label class=\"kbq-link\"\n               [class.kbq-focused]=\"hasFocus\"\n               [for]=\"inputId\">\n        {{ config.browseLink }}\n    </label>\n    </span>\n</ng-template>\n", styles: ["@keyframes kbq-progress{0%{background-position:0 0}to{background-position:29px 0}}.kbq-progress{position:relative}.kbq-progress:after{content:\"\";position:absolute;border-radius:inherit;inset:0;background:linear-gradient(135deg,rgba(0,0,0,.04) 10px,rgba(255,255,255,.04) 10px,rgba(255,255,255,.04) 20px,rgba(0,0,0,.04) 20px,rgba(0,0,0,.04) 30px,rgba(255,255,255,.04) 31px) repeat;background-size:32px 32px;animation:kbq-progress 1s linear infinite}.kbq-group{display:flex;flex-direction:row}.kbq-group .kbq-group_justified>.kbq-group-item{width:100%}.kbq-group .kbq-group-item+.kbq-group-item{margin-left:calc(-1 * var(--kbq-button-size-border-width, 2px))}.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: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){border-bottom-left-radius:0;border-top-left-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){border-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-button-size-border-radius, 8px)}.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){border-top-right-radius:0;border-top-left-radius:0;border-bottom-left-radius:var(--kbq-button-size-border-radius, 8px)}.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){border-radius:0}.kbq-vertical-group>.kbq-group-item:not(:first-child):not(:last-child)>.kbq-form-field__container{border-radius:0}.kbq-vertical-group .kbq-group-item+.kbq-group-item{margin-top:calc(-1 * var(--kbq-button-size-border-width, 2px))}.kbq-no-select{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.kbq-file-upload{box-sizing:border-box;display:flex;align-items:center;position:relative}.kbq-file-upload .dropzone,.kbq-file-upload .file-item{display:flex;align-items:center}.kbq-file-upload .kbq-ellipsis-center{position:relative;display:flex}.kbq-file-upload .kbq-ellipsis-center .data-text-start{flex:0 1 auto;overflow:hidden;text-overflow:ellipsis;white-space:pre}.kbq-file-upload .kbq-ellipsis-center .data-text-end{flex:1 0 auto;overflow:hidden;white-space:pre}\n", "@keyframes kbq-progress{0%{background-position:0 0}to{background-position:29px 0}}.kbq-progress{position:relative}.kbq-progress:after{content:\"\";position:absolute;border-radius:inherit;inset:0;background:linear-gradient(135deg,rgba(0,0,0,.04) 10px,rgba(255,255,255,.04) 10px,rgba(255,255,255,.04) 20px,rgba(0,0,0,.04) 20px,rgba(0,0,0,.04) 30px,rgba(255,255,255,.04) 31px) repeat;background-size:32px 32px;animation:kbq-progress 1s linear infinite}.kbq-group{display:flex;flex-direction:row}.kbq-group .kbq-group_justified>.kbq-group-item{width:100%}.kbq-group .kbq-group-item+.kbq-group-item{margin-left:calc(-1 * var(--kbq-button-size-border-width, 2px))}.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: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){border-bottom-left-radius:0;border-top-left-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){border-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-button-size-border-radius, 8px)}.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){border-top-right-radius:0;border-top-left-radius:0;border-bottom-left-radius:var(--kbq-button-size-border-radius, 8px)}.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){border-radius:0}.kbq-vertical-group>.kbq-group-item:not(:first-child):not(:last-child)>.kbq-form-field__container{border-radius:0}.kbq-vertical-group .kbq-group-item+.kbq-group-item{margin-top:calc(-1 * var(--kbq-button-size-border-width, 2px))}.kbq-no-select{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.kbq-multiple-file-upload .kbq-file-upload{border-radius:var(--kbq-file-upload-size-multiple-big-container-border-radius, 8px);border-width:var(--kbq-file-upload-size-multiple-big-container-border-width, 1px);border-style:dashed}.kbq-multiple-file-upload .kbq-file-upload.default:not(.selected){justify-content:center;padding:var(--kbq-file-upload-size-multiple-big-container-padding-vertical, 24px) var(--kbq-file-upload-size-multiple-big-container-padding-vertical, 24px);min-height:var(--kbq-file-upload-size-multiple-big-container-min-height, 160px);min-width:var(--kbq-file-upload-size-multiple-big-container-min-width, 320px)}.kbq-multiple-file-upload .kbq-file-upload.default:not(.selected) .dropzone{gap:var(--kbq-file-upload-size-multiple-big-container-content-gap-horizontal, 12px)}.kbq-multiple-file-upload .kbq-file-upload.default:not(.selected) .dropzone__text .multiple__caption{padding-top:var(--kbq-file-upload-size-multiple-big-text-block-content-gap-vertical, 4px);gap:var(--kbq-file-upload-size-multiple-big-text-block-content-gap-horizontal, 4px)}.kbq-multiple-file-upload .kbq-file-upload.compact:not(.selected){padding:var(--kbq-file-upload-size-single-container-padding-vertical, 12px) var(--kbq-file-upload-size-single-container-padding-horizontal, 12px)}.kbq-multiple-file-upload .kbq-file-upload.compact:not(.selected) .dropzone{gap:var(--kbq-file-upload-size-single-container-content-gap-horizontal, 8px)}.kbq-multiple-file-upload .kbq-file-upload.compact:not(.selected) .dropzone .dropzone__text.multiple__caption{padding-top:var(--kbq-file-upload-size-single-text-block-padding-vertical, 4px);padding-bottom:var(--kbq-file-upload-size-single-text-block-padding-vertical, 4px);gap:var(--kbq-file-upload-size-single-text-block-content-gap-horizontal, 4px)}.kbq-multiple-file-upload .kbq-file-upload .kbq-list-option.multiple__uploaded-item{padding:0}.kbq-multiple-file-upload .kbq-file-upload .kbq-list-option.multiple__uploaded-item .kbq-list-text{padding:calc(var(--kbq-file-upload-size-multiple-big-grid-cell-padding-vertical, 8px) - var(--kbq-list-size-container-focus-outline-width, 2px)) calc(var(--kbq-file-upload-size-multiple-big-grid-cell-padding-horizontal, 8px) - var(--kbq-list-size-container-focus-outline-width, 2px))}.kbq-multiple-file-upload .kbq-file-upload .kbq-list-option.multiple__uploaded-item .kbq-icon{margin-right:0}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__grid{min-height:144px}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-multiple-uploaded__header-inner,.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__row{display:flex;align-items:center}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-multiple-uploaded__header-inner .kbq-file-upload__file,.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__row .kbq-file-upload__file{width:65%;max-width:65%;gap:var(--kbq-file-upload-size-multiple-big-grid-cell-content-gap-horizontal, 4px)}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-multiple-uploaded__header-inner .kbq-file-upload__size,.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__row .kbq-file-upload__size{width:64px;min-width:64px;text-align:left;flex-grow:1}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__row .kbq-file-upload__file{display:flex;align-items:center}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-upload__row .kbq-file-upload__file .file-item__text{margin-left:0;width:90%}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-multiple-uploaded__header{border-bottom-width:1px;border-bottom-style:solid}.kbq-multiple-file-upload .kbq-file-upload .kbq-file-multiple-uploaded__header .kbq-file-multiple-uploaded__header-inner{padding:calc(var(--kbq-file-upload-size-multiple-big-grid-cell-padding-vertical, 8px) + 3px) calc(var(--kbq-file-upload-size-multiple-big-grid-cell-padding-horizontal, 8px) + 3px)}.kbq-multiple-file-upload .kbq-file-upload .btn-upload{padding:calc(var(--kbq-file-upload-size-single-container-padding-vertical, 12px) - 1px) calc(var(--kbq-file-upload-size-single-container-padding-horizontal, 12px) - 1px);border-top-left-radius:var(--kbq-file-upload-size-single-container-border-radius, 8px);border-top-right-radius:var(--kbq-file-upload-size-single-container-border-radius, 8px);border-top-width:var(--kbq-file-upload-size-single-container-border-width, 1px);border-top-style:dashed}.kbq-multiple-file-upload .kbq-file-upload .btn-upload .dropzone{gap:var(--kbq-file-upload-size-single-container-content-gap-horizontal, 8px)}.kbq-multiple-file-upload .kbq-file-upload .btn-upload .dropzone .dropzone__text.multiple__caption{padding-top:var(--kbq-file-upload-size-single-text-block-padding-vertical, 4px);padding-bottom:var(--kbq-file-upload-size-single-text-block-padding-vertical, 4px);gap:var(--kbq-file-upload-size-single-text-block-content-gap-horizontal, 4px)}.kbq-multiple-file-upload .kbq-file-upload .file-upload__dropzone{width:100%;height:100%}.kbq-hint{display:block}.kbq-file-upload__hint{margin-top:var(--kbq-form-field-hint-size-margin-top, 4px)}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i3.KbqProgressSpinner, selector: "kbq-progress-spinner", inputs: ["color", "id", "value", "mode", "size"] }, { kind: "component", type: i4.KbqIcon, selector: "[kbq-icon]", inputs: ["color", "small", "autoColor"] }, { kind: "component", type: i4.KbqIconButton, selector: "[kbq-icon-button]", inputs: ["color", "small", "tabindex", "disabled"] }, { kind: "component", type: i5.KbqListSelection, selector: "kbq-list-selection", inputs: ["disabled", "autoSelect", "noUnselectLast", "horizontal", "tabIndex", "compareWith"], outputs: ["onSelectAll", "onCopy", "selectionChange"], exportAs: ["kbqListSelection"] }, { kind: "component", type: i5.KbqListOption, selector: "kbq-list-option", inputs: ["checkboxPosition", "value", "disabled", "showCheckbox", "selected"], exportAs: ["kbqListOption"] }, { kind: "component", type: i6.KbqHint, selector: "kbq-hint", inputs: ["color", "id", "fillTextOff", "compact"], exportAs: ["kbqHint"] }, { kind: "directive", type: i7.KbqEllipsisCenterDirective, selector: "[mcEllipsisCenter]", inputs: ["mcEllipsisCenter", "minVisibleLength"] }, { kind: "directive", type: i8.KbqFileDropDirective, selector: "[kbqFileDrop]", outputs: ["filesDropped"], exportAs: ["kbqFileDrop"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i9.KbqDataSizePipe, name: "mcDataSize" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: KbqMultipleFileUploadComponent, decorators: [{
             type: Component,

package/esm2022/file-upload/single-file-upload.component.mjs

@@ -100,7 +100,7 @@ export class KbqSingleFileUploadComponent {
         return this.acceptedFiles !== '*/*' && this.acceptedFiles.length > 0 ? this.acceptedFiles.includes(fileExt) : true;
     }
     /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: KbqSingleFileUploadComponent, deps: [{ token: i1.FocusMonitor }, { token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }, { token: KBQ_FILE_UPLOAD_CONFIGURATION, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.5", type: KbqSingleFileUploadComponent, selector: "kbq-single-file-upload", inputs: { accept: "accept", disabled: "disabled", errors: "errors", files: "files", inputId: "inputId", customValidation: "customValidation" }, outputs: { fileQueueChanged: "fileQueueChanged" }, host: { classAttribute: "kbq-single-file-upload" }, viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], ngImport: i0, template: "<div class=\"kbq-file-upload\"\n     kbqFileDrop\n     [class.kbq-disabled]=\"disabled\"\n     [class.kbq-error]=\"errors && errors.length\"\n     (filesDropped)=\"onFileDropped($event)\">\n        <div class=\"dropzone\" *ngIf=\"!files.length; else fileOutput\">\n            <i kbq-icon=\"mc-upload-to-cloud_24\"></i>\n            <span class=\"dropzone__text\">\n                {{ config.captionText }}\n                <label class=\"kbq-link\"\n                       [class.kbq-focused]=\"hasFocus\"\n                       [for]=\"inputId\">\n                {{ config.browseLink }}\n                </label>\n            </span>\n        </div>\n    <input #input\n           type=\"file\"\n           class=\"cdk-visually-hidden\"\n           [id]=\"inputId\"\n           [accept]=\"acceptedFiles\"\n           [disabled]=\"disabled\"\n           (change)=\"onFileSelectedViaClick($event)\">\n</div>\n<kbq-hint class=\"kbq-file-upload__hint\">\n    <ng-content select=\"[hint]\"></ng-content>\n</kbq-hint>\n<ng-container *ngIf=\"errors && errors.length\">\n    <kbq-hint class=\"kbq-file-upload__hint kbq-error\" *ngFor=\"let error of errors\">{{ error }}</kbq-hint>\n</ng-container>\n\n\n<ng-template #fileOutput>\n    <div class=\"file-item\" *ngIf=\"files && files.length\">\n        <div class=\"file-item__text-wrapper\">\n            <ng-container *ngIf=\"{ loading: files[0].loading | async, progress: files[0].progress | async} as asyncData\">\n                <ng-container *ngIf=\"!asyncData.loading\">\n                    <ng-content select=\"[kbq-icon]\"></ng-content>\n                </ng-container>\n\n                <kbq-progress-spinner\n                    [value]=\"asyncData.progress || 0\"\n                    *ngIf=\"asyncData.loading\"\n                ></kbq-progress-spinner>\n            </ng-container>\n\n            <div class=\"file-item__text\" [mcEllipsisCenter]=\"files[0].file.name\" [minVisibleLength]=\"10\"></div>\n        </div>\n        <i kbq-icon-button=\"mc-close-circle_16\"\n           [color]=\"'contrast'\"\n           [disabled]=\"disabled\"\n           (keydown.delete)=\"deleteItem()\"\n           (keydown.backspace)=\"deleteItem()\"\n           (click)=\"deleteItem($event)\">\n        </i>\n    </div>\n</ng-template>\n", styles: ["@keyframes kbq-progress{0%{background-position:0 0}to{background-position:29px 0}}.kbq-progress{position:relative}.kbq-progress:after{content:\"\";position:absolute;border-radius:inherit;inset:0;background:linear-gradient(135deg,rgba(0,0,0,.04) 10px,rgba(255,255,255,.04) 10px,rgba(255,255,255,.04) 20px,rgba(0,0,0,.04) 20px,rgba(0,0,0,.04) 30px,rgba(255,255,255,.04) 31px) repeat;background-size:32px 32px;animation:kbq-progress 1s linear infinite}.kbq-group{display:flex;flex-direction:row}.kbq-group .kbq-group_justified>.kbq-group-item{width:100%}.kbq-group .kbq-group-item+.kbq-group-item{margin-left:calc(-1 * var(--kbq-button-size-border-width, 2px))}.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: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){border-bottom-left-radius:0;border-top-left-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){border-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-button-size-border-radius, 8px)}.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){border-top-right-radius:0;border-top-left-radius:0;border-bottom-left-radius:var(--kbq-button-size-border-radius, 8px)}.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){border-radius:0}.kbq-vertical-group>.kbq-group-item:not(:first-child):not(:last-child)>.kbq-form-field__container{border-radius:0}.kbq-vertical-group .kbq-group-item+.kbq-group-item{margin-top:calc(-1 * var(--kbq-button-size-border-width, 2px))}.kbq-no-select{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.kbq-file-upload{box-sizing:border-box;display:flex;align-items:center;position:relative}.kbq-file-upload .dropzone,.kbq-file-upload .file-item{display:flex;align-items:center}.kbq-file-upload .kbq-ellipsis-center{position:relative;display:flex}.kbq-file-upload .kbq-ellipsis-center .data-text-start{flex:0 1 auto;overflow:hidden;text-overflow:ellipsis;white-space:pre}.kbq-file-upload .kbq-ellipsis-center .data-text-end{flex:1 0 auto;overflow:hidden;white-space:pre}\n", "@keyframes kbq-progress{0%{background-position:0 0}to{background-position:29px 0}}.kbq-progress{position:relative}.kbq-progress:after{content:\"\";position:absolute;border-radius:inherit;inset:0;background:linear-gradient(135deg,rgba(0,0,0,.04) 10px,rgba(255,255,255,.04) 10px,rgba(255,255,255,.04) 20px,rgba(0,0,0,.04) 20px,rgba(0,0,0,.04) 30px,rgba(255,255,255,.04) 31px) repeat;background-size:32px 32px;animation:kbq-progress 1s linear infinite}.kbq-group{display:flex;flex-direction:row}.kbq-group .kbq-group_justified>.kbq-group-item{width:100%}.kbq-group .kbq-group-item+.kbq-group-item{margin-left:calc(-1 * var(--kbq-button-size-border-width, 2px))}.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: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){border-bottom-left-radius:0;border-top-left-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){border-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-button-size-border-radius, 8px)}.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){border-top-right-radius:0;border-top-left-radius:0;border-bottom-left-radius:var(--kbq-button-size-border-radius, 8px)}.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){border-radius:0}.kbq-vertical-group>.kbq-group-item:not(:first-child):not(:last-child)>.kbq-form-field__container{border-radius:0}.kbq-vertical-group .kbq-group-item+.kbq-group-item{margin-top:calc(-1 * var(--kbq-button-size-border-width, 2px))}.kbq-no-select{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.kbq-single-file-upload .kbq-file-upload{padding:calc(var(--kbq-file-upload-size-single-container-padding-vertical, 12px) - 1px) calc(var(--kbq-file-upload-size-single-container-padding-horizontal, 12px) - 1px);border-radius:var(--kbq-file-upload-size-single-container-border-radius, 8px);border-width:var(--kbq-file-upload-size-single-container-border-width, 1px);border-style:dashed}.kbq-single-file-upload .kbq-file-upload .dropzone__text{padding-top:var(--kbq-file-upload-size-single-text-block-padding-vertical, 4px);padding-bottom:var(--kbq-file-upload-size-single-text-block-padding-vertical, 4px);gap:var(--kbq-file-upload-size-single-text-block-content-gap-horizontal, 4px)}.kbq-single-file-upload .kbq-file-upload .dropzone{gap:var(--kbq-file-upload-size-single-container-content-gap-horizontal, 8px)}.kbq-single-file-upload .kbq-file-upload .file-item{width:100%}.kbq-single-file-upload .kbq-file-upload .file-item .file-item__text-wrapper{display:flex;align-items:center;width:100%;gap:var(--kbq-file-upload-size-single-container-content-gap-horizontal, 8px)}.kbq-single-file-upload .kbq-file-upload .file-item .file-item__text-wrapper .file-item__text{width:120px;flex-grow:1}.kbq-hint{display:block}.kbq-file-upload__hint{margin-top:var(--kbq-form-field-hint-size-margin-top, 4px)}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.KbqProgressSpinner, selector: "kbq-progress-spinner", inputs: ["color", "id", "value", "mode", "size"] }, { kind: "component", type: i4.KbqIcon, selector: "[kbq-icon]", inputs: ["color", "small", "autoColor"] }, { kind: "component", type: i4.KbqIconButton, selector: "[kbq-icon-button]", inputs: ["color", "small", "tabindex", "disabled"] }, { kind: "component", type: i5.KbqHint, selector: "kbq-hint", inputs: ["color", "id", "fillTextOff"], exportAs: ["kbqHint"] }, { kind: "directive", type: i6.KbqEllipsisCenterDirective, selector: "[mcEllipsisCenter]", inputs: ["mcEllipsisCenter", "minVisibleLength"] }, { kind: "directive", type: i7.KbqFileDropDirective, selector: "[kbqFileDrop]", outputs: ["filesDropped"], exportAs: ["kbqFileDrop"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.5", type: KbqSingleFileUploadComponent, selector: "kbq-single-file-upload", inputs: { accept: "accept", disabled: "disabled", errors: "errors", files: "files", inputId: "inputId", customValidation: "customValidation" }, outputs: { fileQueueChanged: "fileQueueChanged" }, host: { classAttribute: "kbq-single-file-upload" }, viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], ngImport: i0, template: "<div class=\"kbq-file-upload\"\n     kbqFileDrop\n     [class.kbq-disabled]=\"disabled\"\n     [class.kbq-error]=\"errors && errors.length\"\n     (filesDropped)=\"onFileDropped($event)\">\n        <div class=\"dropzone\" *ngIf=\"!files.length; else fileOutput\">\n            <i kbq-icon=\"mc-upload-to-cloud_24\"></i>\n            <span class=\"dropzone__text\">\n                {{ config.captionText }}\n                <label class=\"kbq-link\"\n                       [class.kbq-focused]=\"hasFocus\"\n                       [for]=\"inputId\">\n                {{ config.browseLink }}\n                </label>\n            </span>\n        </div>\n    <input #input\n           type=\"file\"\n           class=\"cdk-visually-hidden\"\n           [id]=\"inputId\"\n           [accept]=\"acceptedFiles\"\n           [disabled]=\"disabled\"\n           (change)=\"onFileSelectedViaClick($event)\">\n</div>\n<kbq-hint class=\"kbq-file-upload__hint\">\n    <ng-content select=\"[hint]\"></ng-content>\n</kbq-hint>\n<ng-container *ngIf=\"errors && errors.length\">\n    <kbq-hint class=\"kbq-file-upload__hint kbq-error\" *ngFor=\"let error of errors\">{{ error }}</kbq-hint>\n</ng-container>\n\n\n<ng-template #fileOutput>\n    <div class=\"file-item\" *ngIf=\"files && files.length\">\n        <div class=\"file-item__text-wrapper\">\n            <ng-container *ngIf=\"{ loading: files[0].loading | async, progress: files[0].progress | async} as asyncData\">\n                <ng-container *ngIf=\"!asyncData.loading\">\n                    <ng-content select=\"[kbq-icon]\"></ng-content>\n                </ng-container>\n\n                <kbq-progress-spinner\n                    [value]=\"asyncData.progress || 0\"\n                    *ngIf=\"asyncData.loading\"\n                ></kbq-progress-spinner>\n            </ng-container>\n\n            <div class=\"file-item__text\" [mcEllipsisCenter]=\"files[0].file.name\" [minVisibleLength]=\"10\"></div>\n        </div>\n        <i kbq-icon-button=\"mc-close-circle_16\"\n           [color]=\"'contrast'\"\n           [disabled]=\"disabled\"\n           (keydown.delete)=\"deleteItem()\"\n           (keydown.backspace)=\"deleteItem()\"\n           (click)=\"deleteItem($event)\">\n        </i>\n    </div>\n</ng-template>\n", styles: ["@keyframes kbq-progress{0%{background-position:0 0}to{background-position:29px 0}}.kbq-progress{position:relative}.kbq-progress:after{content:\"\";position:absolute;border-radius:inherit;inset:0;background:linear-gradient(135deg,rgba(0,0,0,.04) 10px,rgba(255,255,255,.04) 10px,rgba(255,255,255,.04) 20px,rgba(0,0,0,.04) 20px,rgba(0,0,0,.04) 30px,rgba(255,255,255,.04) 31px) repeat;background-size:32px 32px;animation:kbq-progress 1s linear infinite}.kbq-group{display:flex;flex-direction:row}.kbq-group .kbq-group_justified>.kbq-group-item{width:100%}.kbq-group .kbq-group-item+.kbq-group-item{margin-left:calc(-1 * var(--kbq-button-size-border-width, 2px))}.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: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){border-bottom-left-radius:0;border-top-left-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){border-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-button-size-border-radius, 8px)}.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){border-top-right-radius:0;border-top-left-radius:0;border-bottom-left-radius:var(--kbq-button-size-border-radius, 8px)}.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){border-radius:0}.kbq-vertical-group>.kbq-group-item:not(:first-child):not(:last-child)>.kbq-form-field__container{border-radius:0}.kbq-vertical-group .kbq-group-item+.kbq-group-item{margin-top:calc(-1 * var(--kbq-button-size-border-width, 2px))}.kbq-no-select{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.kbq-file-upload{box-sizing:border-box;display:flex;align-items:center;position:relative}.kbq-file-upload .dropzone,.kbq-file-upload .file-item{display:flex;align-items:center}.kbq-file-upload .kbq-ellipsis-center{position:relative;display:flex}.kbq-file-upload .kbq-ellipsis-center .data-text-start{flex:0 1 auto;overflow:hidden;text-overflow:ellipsis;white-space:pre}.kbq-file-upload .kbq-ellipsis-center .data-text-end{flex:1 0 auto;overflow:hidden;white-space:pre}\n", "@keyframes kbq-progress{0%{background-position:0 0}to{background-position:29px 0}}.kbq-progress{position:relative}.kbq-progress:after{content:\"\";position:absolute;border-radius:inherit;inset:0;background:linear-gradient(135deg,rgba(0,0,0,.04) 10px,rgba(255,255,255,.04) 10px,rgba(255,255,255,.04) 20px,rgba(0,0,0,.04) 20px,rgba(0,0,0,.04) 30px,rgba(255,255,255,.04) 31px) repeat;background-size:32px 32px;animation:kbq-progress 1s linear infinite}.kbq-group{display:flex;flex-direction:row}.kbq-group .kbq-group_justified>.kbq-group-item{width:100%}.kbq-group .kbq-group-item+.kbq-group-item{margin-left:calc(-1 * var(--kbq-button-size-border-width, 2px))}.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: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){border-bottom-left-radius:0;border-top-left-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){border-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-button-size-border-radius, 8px)}.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){border-top-right-radius:0;border-top-left-radius:0;border-bottom-left-radius:var(--kbq-button-size-border-radius, 8px)}.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){border-radius:0}.kbq-vertical-group>.kbq-group-item:not(:first-child):not(:last-child)>.kbq-form-field__container{border-radius:0}.kbq-vertical-group .kbq-group-item+.kbq-group-item{margin-top:calc(-1 * var(--kbq-button-size-border-width, 2px))}.kbq-no-select{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.kbq-single-file-upload .kbq-file-upload{padding:calc(var(--kbq-file-upload-size-single-container-padding-vertical, 12px) - 1px) calc(var(--kbq-file-upload-size-single-container-padding-horizontal, 12px) - 1px);border-radius:var(--kbq-file-upload-size-single-container-border-radius, 8px);border-width:var(--kbq-file-upload-size-single-container-border-width, 1px);border-style:dashed}.kbq-single-file-upload .kbq-file-upload .dropzone__text{padding-top:var(--kbq-file-upload-size-single-text-block-padding-vertical, 4px);padding-bottom:var(--kbq-file-upload-size-single-text-block-padding-vertical, 4px);gap:var(--kbq-file-upload-size-single-text-block-content-gap-horizontal, 4px)}.kbq-single-file-upload .kbq-file-upload .dropzone{gap:var(--kbq-file-upload-size-single-container-content-gap-horizontal, 8px)}.kbq-single-file-upload .kbq-file-upload .file-item{width:100%}.kbq-single-file-upload .kbq-file-upload .file-item .file-item__text-wrapper{display:flex;align-items:center;width:100%;gap:var(--kbq-file-upload-size-single-container-content-gap-horizontal, 8px)}.kbq-single-file-upload .kbq-file-upload .file-item .file-item__text-wrapper .file-item__text{width:120px;flex-grow:1}.kbq-hint{display:block}.kbq-file-upload__hint{margin-top:var(--kbq-form-field-hint-size-margin-top, 4px)}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.KbqProgressSpinner, selector: "kbq-progress-spinner", inputs: ["color", "id", "value", "mode", "size"] }, { kind: "component", type: i4.KbqIcon, selector: "[kbq-icon]", inputs: ["color", "small", "autoColor"] }, { kind: "component", type: i4.KbqIconButton, selector: "[kbq-icon-button]", inputs: ["color", "small", "tabindex", "disabled"] }, { kind: "component", type: i5.KbqHint, selector: "kbq-hint", inputs: ["color", "id", "fillTextOff", "compact"], exportAs: ["kbqHint"] }, { kind: "directive", type: i6.KbqEllipsisCenterDirective, selector: "[mcEllipsisCenter]", inputs: ["mcEllipsisCenter", "minVisibleLength"] }, { kind: "directive", type: i7.KbqFileDropDirective, selector: "[kbqFileDrop]", outputs: ["filesDropped"], exportAs: ["kbqFileDrop"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: KbqSingleFileUploadComponent, decorators: [{
             type: Component,