@pepperi-addons/ngx-lib 0.4.1-cards-list-scroll.32 → 0.4.1

package/esm2020/draggable-items/draggable-items.component.mjs

@@ -1,102 +1,102 @@
-import { Component, EventEmitter, Input, Output } from '@angular/core';
-import { FormControl } from '@angular/forms';
-import { Subject } from 'rxjs';
-import { map, startWith, takeUntil } from 'rxjs/operators';
-import * as i0 from "@angular/core";
-import * as i1 from "@angular/common";
-import * as i2 from "@pepperi-addons/ngx-lib/search";
-import * as i3 from "@angular/cdk/drag-drop";
-import * as i4 from "./draggable-item/draggable-item.component";
-export class DraggableItemsComponent {
-    constructor() {
-        this.containerId = 'draggable-container';
-        this.showSearch = false;
-        this.title = '';
-        this.titleType = 'regular';
-        this.titleSizeType = 'xl';
-        this.itemPlaceholderType = 'none';
-        this.dropAreaIds = [];
-        this._items = [];
-        this.itemDragStarted = new EventEmitter();
-        this.itemDragEnded = new EventEmitter();
-        this.searchControl = new FormControl();
-        this.numberItemsToShowSearch = 5;
-        //
-        this._destroyed = new Subject();
-    }
-    set items(value) {
-        this._items = value;
-        if (this.items?.length > 0) {
-            this.searchControl.enable();
-        }
-        else {
-            this.searchControl.disable();
-        }
-    }
-    get items() {
-        return this._items;
-    }
-    filterItems(value) {
-        const filterValue = value.toLowerCase();
-        return this.items.filter((opt) => opt.title &&
-            opt.title.toLowerCase().includes(filterValue.toLowerCase()));
-    }
-    changeCursorOnDragStart() {
-        document.body.classList.add('inheritCursors');
-        document.body.style.cursor = 'grabbing';
-    }
-    changeCursorOnDragEnd() {
-        document.body.classList.remove('inheritCursors');
-        document.body.style.cursor = 'unset';
-    }
-    getDestroyer() {
-        return takeUntil(this._destroyed);
-    }
-    ngOnInit() {
-        // If there is no item disable the search.
-        if (this.items.length === 0) {
-            this.searchControl.disable();
-        }
-        // Filter the draggableItems by the search control.
-        this.filteredItems$ = this.searchControl.valueChanges.pipe(this.getDestroyer(), startWith(''), map((option) => typeof option === 'string' ? option : option && option.value), map((value) => (value ? this.filterItems(value) : this.items)));
-    }
-    ngOnDestroy() {
-        this._destroyed.next();
-        this._destroyed.complete();
-    }
-    onDragStart(event) {
-        this.changeCursorOnDragStart();
-        this.itemDragStarted.emit(event);
-    }
-    onDragEnd(event) {
-        this.changeCursorOnDragEnd();
-        this.itemDragEnded.emit(event);
-    }
-}
-DraggableItemsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: DraggableItemsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-DraggableItemsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: DraggableItemsComponent, selector: "pep-draggable-items", inputs: { containerId: "containerId", showSearch: "showSearch", title: "title", titleType: "titleType", titleSizeType: "titleSizeType", itemPlaceholderType: "itemPlaceholderType", dropAreaIds: "dropAreaIds", items: "items" }, outputs: { itemDragStarted: "itemDragStarted", itemDragEnded: "itemDragEnded" }, ngImport: i0, template: "<div [id]=\"containerId\" class=\"pep-draggable-items-container\" cdkDropList [cdkDropListData]=\"filteredItems$ | async\"\r\n    cdkDropListSortingDisabled [cdkDropListConnectedTo]=\"dropAreaIds\">\r\n\r\n    <div *ngIf=\"titleType !== 'none'\" class=\"title-container\"\r\n        [ngClass]=\"{ 'pep-border-bottom': titleType === 'with-bottom-border'}\">\r\n        <label class=\"title body-{{ titleSizeType }} bold ellipsis \" >{{title}}</label>\r\n        <pep-search *ngIf=\"showSearch && items?.length > numberItemsToShowSearch\" class=\"search-button\" sizeType=\"sm\" shrink=\"always\"\r\n            [searchControl]=\"searchControl\" triggerOn=\"keydown\"></pep-search>\r\n    </div>\r\n\r\n    <div class=\"draggable-items-overflow\">\r\n        <div class=\"draggable-items-wrapper\">\r\n            <pep-draggable-item *ngFor=\"let item of filteredItems$ | async; let i=index;\" class=\"draggble-item\"\r\n                [title]=\"item.title\" [data]=\"item.data\" [disabled]=\"item.disabled\" cdkDrag [cdkDragData]=\"item.data\"\r\n                [cdkDragDisabled]=\"item.disabled\" (cdkDragStarted)=\"onDragStart($event)\" (cdkDragEnded)=\"onDragEnd($event)\">\r\n        \r\n                <ng-container *ngIf=\"itemPlaceholderType !== 'regular'\">\r\n                    <div class=\"placeholder-item {{itemPlaceholderType}}\" *cdkDragPlaceholder></div>\r\n                </ng-container>\r\n            </pep-draggable-item>\r\n        </div>\r\n    </div>\r\n</div>", styles: [".pep-draggable-items-container{display:grid;grid-template-rows:auto 1fr;height:100%;overflow:hidden;padding-inline-end:var(--pep-spacing-xs, .25rem)}.draggable-items-overflow{overflow:auto;padding:var(--pep-spacing-lg, 1rem) 0}.draggable-items-wrapper{display:flex;flex-direction:column;gap:var(--pep-spacing-sm, .5rem)}.draggable-items-wrapper .draggble-item{cursor:grab}.draggable-items-wrapper .draggble-item.cdk-drag-disabled{cursor:not-allowed}.title-container{height:var(--pep-top-bar-field-height, 2.5rem);display:flex;gap:var(--pep-spacing-sm, .5rem);flex-flow:row;justify-content:space-between}.title-container .title{align-self:center}.title-container .search-button{display:flex;align-self:center}.placeholder-item{height:2.5rem;border-radius:var(--pep-border-radius-md, .25rem);width:100%}\n", ".placeholder-item.none{opacity:0}.placeholder-item.weak{background:hsla(var(--pep-color-weak-h, 0),var(--pep-color-weak-s, 0%),var(--pep-color-weak-l, 10%),.12)}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.PepSearchComponent, selector: "pep-search", inputs: ["triggerOn", "autoCompleteTop", "autoCompleteValues", "shrink", "value", "searchControl", "useAsWebComponent", "sizeType"], outputs: ["search", "autocompleteChange", "stateChange"] }, { kind: "directive", type: i3.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i3.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i3.CdkDragPlaceholder, selector: "ng-template[cdkDragPlaceholder]", inputs: ["data"] }, { kind: "component", type: i4.DraggableItemComponent, selector: "pep-draggable-item", inputs: ["title", "data", "disabled"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: DraggableItemsComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'pep-draggable-items', template: "<div [id]=\"containerId\" class=\"pep-draggable-items-container\" cdkDropList [cdkDropListData]=\"filteredItems$ | async\"\r\n    cdkDropListSortingDisabled [cdkDropListConnectedTo]=\"dropAreaIds\">\r\n\r\n    <div *ngIf=\"titleType !== 'none'\" class=\"title-container\"\r\n        [ngClass]=\"{ 'pep-border-bottom': titleType === 'with-bottom-border'}\">\r\n        <label class=\"title body-{{ titleSizeType }} bold ellipsis \" >{{title}}</label>\r\n        <pep-search *ngIf=\"showSearch && items?.length > numberItemsToShowSearch\" class=\"search-button\" sizeType=\"sm\" shrink=\"always\"\r\n            [searchControl]=\"searchControl\" triggerOn=\"keydown\"></pep-search>\r\n    </div>\r\n\r\n    <div class=\"draggable-items-overflow\">\r\n        <div class=\"draggable-items-wrapper\">\r\n            <pep-draggable-item *ngFor=\"let item of filteredItems$ | async; let i=index;\" class=\"draggble-item\"\r\n                [title]=\"item.title\" [data]=\"item.data\" [disabled]=\"item.disabled\" cdkDrag [cdkDragData]=\"item.data\"\r\n                [cdkDragDisabled]=\"item.disabled\" (cdkDragStarted)=\"onDragStart($event)\" (cdkDragEnded)=\"onDragEnd($event)\">\r\n        \r\n                <ng-container *ngIf=\"itemPlaceholderType !== 'regular'\">\r\n                    <div class=\"placeholder-item {{itemPlaceholderType}}\" *cdkDragPlaceholder></div>\r\n                </ng-container>\r\n            </pep-draggable-item>\r\n        </div>\r\n    </div>\r\n</div>", styles: [".pep-draggable-items-container{display:grid;grid-template-rows:auto 1fr;height:100%;overflow:hidden;padding-inline-end:var(--pep-spacing-xs, .25rem)}.draggable-items-overflow{overflow:auto;padding:var(--pep-spacing-lg, 1rem) 0}.draggable-items-wrapper{display:flex;flex-direction:column;gap:var(--pep-spacing-sm, .5rem)}.draggable-items-wrapper .draggble-item{cursor:grab}.draggable-items-wrapper .draggble-item.cdk-drag-disabled{cursor:not-allowed}.title-container{height:var(--pep-top-bar-field-height, 2.5rem);display:flex;gap:var(--pep-spacing-sm, .5rem);flex-flow:row;justify-content:space-between}.title-container .title{align-self:center}.title-container .search-button{display:flex;align-self:center}.placeholder-item{height:2.5rem;border-radius:var(--pep-border-radius-md, .25rem);width:100%}\n", ".placeholder-item.none{opacity:0}.placeholder-item.weak{background:hsla(var(--pep-color-weak-h, 0),var(--pep-color-weak-s, 0%),var(--pep-color-weak-l, 10%),.12)}\n"] }]
-        }], ctorParameters: function () { return []; }, propDecorators: { containerId: [{
-                type: Input
-            }], showSearch: [{
-                type: Input
-            }], title: [{
-                type: Input
-            }], titleType: [{
-                type: Input
-            }], titleSizeType: [{
-                type: Input
-            }], itemPlaceholderType: [{
-                type: Input
-            }], dropAreaIds: [{
-                type: Input
-            }], items: [{
-                type: Input
-            }], itemDragStarted: [{
-                type: Output
-            }], itemDragEnded: [{
-                type: Output
-            }] } });
+import { Component, EventEmitter, Input, Output } from '@angular/core';
+import { FormControl } from '@angular/forms';
+import { Subject } from 'rxjs';
+import { map, startWith, takeUntil } from 'rxjs/operators';
+import * as i0 from "@angular/core";
+import * as i1 from "@angular/common";
+import * as i2 from "@pepperi-addons/ngx-lib/search";
+import * as i3 from "@angular/cdk/drag-drop";
+import * as i4 from "./draggable-item/draggable-item.component";
+export class DraggableItemsComponent {
+    constructor() {
+        this.containerId = 'draggable-container';
+        this.showSearch = false;
+        this.title = '';
+        this.titleType = 'regular';
+        this.titleSizeType = 'xl';
+        this.itemPlaceholderType = 'none';
+        this.dropAreaIds = [];
+        this._items = [];
+        this.itemDragStarted = new EventEmitter();
+        this.itemDragEnded = new EventEmitter();
+        this.searchControl = new FormControl();
+        this.numberItemsToShowSearch = 5;
+        //
+        this._destroyed = new Subject();
+    }
+    set items(value) {
+        this._items = value;
+        if (this.items?.length > 0) {
+            this.searchControl.enable();
+        }
+        else {
+            this.searchControl.disable();
+        }
+    }
+    get items() {
+        return this._items;
+    }
+    filterItems(value) {
+        const filterValue = value.toLowerCase();
+        return this.items.filter((opt) => opt.title &&
+            opt.title.toLowerCase().includes(filterValue.toLowerCase()));
+    }
+    changeCursorOnDragStart() {
+        document.body.classList.add('inheritCursors');
+        document.body.style.cursor = 'grabbing';
+    }
+    changeCursorOnDragEnd() {
+        document.body.classList.remove('inheritCursors');
+        document.body.style.cursor = 'unset';
+    }
+    getDestroyer() {
+        return takeUntil(this._destroyed);
+    }
+    ngOnInit() {
+        // If there is no item disable the search.
+        if (this.items.length === 0) {
+            this.searchControl.disable();
+        }
+        // Filter the draggableItems by the search control.
+        this.filteredItems$ = this.searchControl.valueChanges.pipe(this.getDestroyer(), startWith(''), map((option) => typeof option === 'string' ? option : option && option.value), map((value) => (value ? this.filterItems(value) : this.items)));
+    }
+    ngOnDestroy() {
+        this._destroyed.next();
+        this._destroyed.complete();
+    }
+    onDragStart(event) {
+        this.changeCursorOnDragStart();
+        this.itemDragStarted.emit(event);
+    }
+    onDragEnd(event) {
+        this.changeCursorOnDragEnd();
+        this.itemDragEnded.emit(event);
+    }
+}
+DraggableItemsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: DraggableItemsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+DraggableItemsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: DraggableItemsComponent, selector: "pep-draggable-items", inputs: { containerId: "containerId", showSearch: "showSearch", title: "title", titleType: "titleType", titleSizeType: "titleSizeType", itemPlaceholderType: "itemPlaceholderType", dropAreaIds: "dropAreaIds", items: "items" }, outputs: { itemDragStarted: "itemDragStarted", itemDragEnded: "itemDragEnded" }, ngImport: i0, template: "<div [id]=\"containerId\" class=\"pep-draggable-items-container\" cdkDropList [cdkDropListData]=\"filteredItems$ | async\"\r\n    cdkDropListSortingDisabled [cdkDropListConnectedTo]=\"dropAreaIds\">\r\n\r\n    <div *ngIf=\"titleType !== 'none'\" class=\"title-container\"\r\n        [ngClass]=\"{ 'pep-border-bottom': titleType === 'with-bottom-border'}\">\r\n        <label class=\"title body-{{ titleSizeType }} bold ellipsis \" >{{title}}</label>\r\n        <pep-search *ngIf=\"showSearch && items?.length > numberItemsToShowSearch\" class=\"search-button\" sizeType=\"sm\" shrink=\"always\"\r\n            [searchControl]=\"searchControl\" triggerOn=\"keydown\"></pep-search>\r\n    </div>\r\n\r\n    <div class=\"draggable-items-overflow\">\r\n        <div class=\"draggable-items-wrapper\">\r\n            <pep-draggable-item *ngFor=\"let item of filteredItems$ | async; let i=index;\" class=\"draggble-item\"\r\n                [title]=\"item.title\" [data]=\"item.data\" [disabled]=\"item.disabled\" cdkDrag [cdkDragData]=\"item.data\"\r\n                [cdkDragDisabled]=\"item.disabled\" (cdkDragStarted)=\"onDragStart($event)\" (cdkDragEnded)=\"onDragEnd($event)\">\r\n        \r\n                <ng-container *ngIf=\"itemPlaceholderType !== 'regular'\">\r\n                    <div class=\"placeholder-item {{itemPlaceholderType}}\" *cdkDragPlaceholder></div>\r\n                </ng-container>\r\n            </pep-draggable-item>\r\n        </div>\r\n    </div>\r\n</div>", styles: [".pep-draggable-items-container{display:grid;grid-template-rows:auto 1fr;height:100%;overflow:hidden;padding-inline-end:var(--pep-spacing-xs, .25rem)}.draggable-items-overflow{overflow:auto;padding:var(--pep-spacing-lg, 1rem) 0}.draggable-items-wrapper{display:flex;flex-direction:column;gap:var(--pep-spacing-sm, .5rem)}.draggable-items-wrapper .draggble-item{cursor:grab}.draggable-items-wrapper .draggble-item.cdk-drag-disabled{cursor:not-allowed}.title-container{height:var(--pep-top-bar-field-height, 2.5rem);display:flex;gap:var(--pep-spacing-sm, .5rem);flex-flow:row;justify-content:space-between}.title-container .title{align-self:center}.title-container .search-button{display:flex;align-self:center}.placeholder-item{height:2.5rem;border-radius:var(--pep-border-radius-md, .25rem);width:100%}\n", ".placeholder-item.none{opacity:0}.placeholder-item.weak{background:hsla(var(--pep-color-weak-h, 0),var(--pep-color-weak-s, 0%),var(--pep-color-weak-l, 10%),.12)}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.PepSearchComponent, selector: "pep-search", inputs: ["triggerOn", "autoCompleteTop", "autoCompleteValues", "shrink", "value", "searchControl", "useAsWebComponent", "sizeType"], outputs: ["search", "autocompleteChange", "stateChange"] }, { kind: "directive", type: i3.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i3.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i3.CdkDragPlaceholder, selector: "ng-template[cdkDragPlaceholder]", inputs: ["data"] }, { kind: "component", type: i4.DraggableItemComponent, selector: "pep-draggable-item", inputs: ["title", "data", "disabled"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: DraggableItemsComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'pep-draggable-items', template: "<div [id]=\"containerId\" class=\"pep-draggable-items-container\" cdkDropList [cdkDropListData]=\"filteredItems$ | async\"\r\n    cdkDropListSortingDisabled [cdkDropListConnectedTo]=\"dropAreaIds\">\r\n\r\n    <div *ngIf=\"titleType !== 'none'\" class=\"title-container\"\r\n        [ngClass]=\"{ 'pep-border-bottom': titleType === 'with-bottom-border'}\">\r\n        <label class=\"title body-{{ titleSizeType }} bold ellipsis \" >{{title}}</label>\r\n        <pep-search *ngIf=\"showSearch && items?.length > numberItemsToShowSearch\" class=\"search-button\" sizeType=\"sm\" shrink=\"always\"\r\n            [searchControl]=\"searchControl\" triggerOn=\"keydown\"></pep-search>\r\n    </div>\r\n\r\n    <div class=\"draggable-items-overflow\">\r\n        <div class=\"draggable-items-wrapper\">\r\n            <pep-draggable-item *ngFor=\"let item of filteredItems$ | async; let i=index;\" class=\"draggble-item\"\r\n                [title]=\"item.title\" [data]=\"item.data\" [disabled]=\"item.disabled\" cdkDrag [cdkDragData]=\"item.data\"\r\n                [cdkDragDisabled]=\"item.disabled\" (cdkDragStarted)=\"onDragStart($event)\" (cdkDragEnded)=\"onDragEnd($event)\">\r\n        \r\n                <ng-container *ngIf=\"itemPlaceholderType !== 'regular'\">\r\n                    <div class=\"placeholder-item {{itemPlaceholderType}}\" *cdkDragPlaceholder></div>\r\n                </ng-container>\r\n            </pep-draggable-item>\r\n        </div>\r\n    </div>\r\n</div>", styles: [".pep-draggable-items-container{display:grid;grid-template-rows:auto 1fr;height:100%;overflow:hidden;padding-inline-end:var(--pep-spacing-xs, .25rem)}.draggable-items-overflow{overflow:auto;padding:var(--pep-spacing-lg, 1rem) 0}.draggable-items-wrapper{display:flex;flex-direction:column;gap:var(--pep-spacing-sm, .5rem)}.draggable-items-wrapper .draggble-item{cursor:grab}.draggable-items-wrapper .draggble-item.cdk-drag-disabled{cursor:not-allowed}.title-container{height:var(--pep-top-bar-field-height, 2.5rem);display:flex;gap:var(--pep-spacing-sm, .5rem);flex-flow:row;justify-content:space-between}.title-container .title{align-self:center}.title-container .search-button{display:flex;align-self:center}.placeholder-item{height:2.5rem;border-radius:var(--pep-border-radius-md, .25rem);width:100%}\n", ".placeholder-item.none{opacity:0}.placeholder-item.weak{background:hsla(var(--pep-color-weak-h, 0),var(--pep-color-weak-s, 0%),var(--pep-color-weak-l, 10%),.12)}\n"] }]
+        }], ctorParameters: function () { return []; }, propDecorators: { containerId: [{
+                type: Input
+            }], showSearch: [{
+                type: Input
+            }], title: [{
+                type: Input
+            }], titleType: [{
+                type: Input
+            }], titleSizeType: [{
+                type: Input
+            }], itemPlaceholderType: [{
+                type: Input
+            }], dropAreaIds: [{
+                type: Input
+            }], items: [{
+                type: Input
+            }], itemDragStarted: [{
+                type: Output
+            }], itemDragEnded: [{
+                type: Output
+            }] } });
 //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZHJhZ2dhYmxlLWl0ZW1zLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3Byb2plY3RzL25neC1saWIvZHJhZ2dhYmxlLWl0ZW1zL2RyYWdnYWJsZS1pdGVtcy5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi9wcm9qZWN0cy9uZ3gtbGliL2RyYWdnYWJsZS1pdGVtcy9kcmFnZ2FibGUtaXRlbXMuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQ0EsT0FBTyxFQUFFLFNBQVMsRUFBRSxZQUFZLEVBQWUsS0FBSyxFQUFxQixNQUFNLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDdkcsT0FBTyxFQUFFLFdBQVcsRUFBRSxNQUFNLGdCQUFnQixDQUFDO0FBQzdDLE9BQU8sRUFBYyxPQUFPLEVBQUUsTUFBTSxNQUFNLENBQUM7QUFDM0MsT0FBTyxFQUFFLEdBQUcsRUFBRSxTQUFTLEVBQUUsU0FBUyxFQUFFLE1BQU0sZ0JBQWdCLENBQUM7Ozs7OztBQVEzRCxNQUFNLE9BQU8sdUJBQXVCO0lBa0NoQztRQWpDUyxnQkFBVyxHQUFHLHFCQUFxQixDQUFDO1FBQ3BDLGVBQVUsR0FBRyxLQUFLLENBQUM7UUFDbkIsVUFBSyxHQUFHLEVBQUUsQ0FBQztRQUNYLGNBQVMsR0FBK0IsU0FBUyxDQUFDO1FBQ2xELGtCQUFhLEdBQWdCLElBQUksQ0FBQztRQUVsQyx3QkFBbUIsR0FBb0MsTUFBTSxDQUFDO1FBRTlELGdCQUFXLEdBQUcsRUFBRSxDQUFDO1FBRWxCLFdBQU0sR0FBNkIsRUFBRSxDQUFDO1FBZXBDLG9CQUFlLEdBQWtELElBQUksWUFBWSxFQUFtQyxDQUFDO1FBQ3JILGtCQUFhLEdBQWdELElBQUksWUFBWSxFQUFpQyxDQUFDO1FBR3pILGtCQUFhLEdBQUcsSUFBSSxXQUFXLEVBQUUsQ0FBQztRQUNsQyw0QkFBdUIsR0FBRyxDQUFDLENBQUM7UUFJeEIsRUFBRTtRQUNGLElBQUksQ0FBQyxVQUFVLEdBQUcsSUFBSSxPQUFPLEVBQUUsQ0FBQztJQUNwQyxDQUFDO0lBekJELElBQ0ksS0FBSyxDQUFDLEtBQStCO1FBQ3JDLElBQUksQ0FBQyxNQUFNLEdBQUcsS0FBSyxDQUFDO1FBRXBCLElBQUksSUFBSSxDQUFDLEtBQUssRUFBRSxNQUFNLEdBQUcsQ0FBQyxFQUFFO1lBQ3hCLElBQUksQ0FBQyxhQUFhLENBQUMsTUFBTSxFQUFFLENBQUM7U0FDL0I7YUFBTTtZQUNILElBQUksQ0FBQyxhQUFhLENBQUMsT0FBTyxFQUFFLENBQUM7U0FDaEM7SUFDTCxDQUFDO0lBQ0QsSUFBSSxLQUFLO1FBQ0wsT0FBTyxJQUFJLENBQUMsTUFBTSxDQUFDO0lBQ3ZCLENBQUM7SUFlTyxXQUFXLENBQUMsS0FBYTtRQUM3QixNQUFNLFdBQVcsR0FBRyxLQUFLLENBQUMsV0FBVyxFQUFFLENBQUM7UUFDeEMsT0FBTyxJQUFJLENBQUMsS0FBSyxDQUFDLE1BQU0sQ0FDcEIsQ0FBQyxHQUFHLEVBQUUsRUFBRSxDQUNKLEdBQUcsQ0FBQyxLQUFLO1lBQ1QsR0FBRyxDQUFDLEtBQUssQ0FBQyxXQUFXLEVBQUUsQ0FBQyxRQUFRLENBQUMsV0FBVyxDQUFDLFdBQVcsRUFBRSxDQUFDLENBQ2xFLENBQUM7SUFDTixDQUFDO0lBRU8sdUJBQXVCO1FBQzNCLFFBQVEsQ0FBQyxJQUFJLENBQUMsU0FBUyxDQUFDLEdBQUcsQ0FBQyxnQkFBZ0IsQ0FBQyxDQUFDO1FBQzlDLFFBQVEsQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLE1BQU0sR0FBRyxVQUFVLENBQUM7SUFDNUMsQ0FBQztJQUVPLHFCQUFxQjtRQUN6QixRQUFRLENBQUMsSUFBSSxDQUFDLFNBQVMsQ0FBQyxNQUFNLENBQUMsZ0JBQWdCLENBQUMsQ0FBQztRQUNqRCxRQUFRLENBQUMsSUFBSSxDQUFDLEtBQUssQ0FBQyxNQUFNLEdBQUcsT0FBTyxDQUFDO0lBQ3pDLENBQUM7SUFFUyxZQUFZO1FBQ2xCLE9BQU8sU0FBUyxDQUFDLElBQUksQ0FBQyxVQUFVLENBQUMsQ0FBQztJQUN0QyxDQUFDO0lBRUQsUUFBUTtRQUNKLDBDQUEwQztRQUMxQyxJQUFJLElBQUksQ0FBQyxLQUFLLENBQUMsTUFBTSxLQUFLLENBQUMsRUFBRTtZQUN6QixJQUFJLENBQUMsYUFBYSxDQUFDLE9BQU8sRUFBRSxDQUFDO1NBQ2hDO1FBRUQsbURBQW1EO1FBQ25ELElBQUksQ0FBQyxjQUFjLEdBQUcsSUFBSSxDQUFDLGFBQWEsQ0FBQyxZQUFZLENBQUMsSUFBSSxDQUN0RCxJQUFJLENBQUMsWUFBWSxFQUFFLEVBQ25CLFNBQVMsQ0FBTSxFQUFFLENBQUMsRUFDbEIsR0FBRyxDQUFDLENBQUMsTUFBTSxFQUFFLEVBQUUsQ0FDWCxPQUFPLE1BQU0sS0FBSyxRQUFRLENBQUMsQ0FBQyxDQUFDLE1BQU0sQ0FBQyxDQUFDLENBQUMsTUFBTSxJQUFJLE1BQU0sQ0FBQyxLQUFLLENBQy9ELEVBQ0QsR0FBRyxDQUFDLENBQUMsS0FBSyxFQUFFLEVBQUUsQ0FBQyxDQUFDLEtBQUssQ0FBQyxDQUFDLENBQUMsSUFBSSxDQUFDLFdBQVcsQ0FBQyxLQUFLLENBQUMsQ0FBQyxDQUFDLENBQUMsSUFBSSxDQUFDLEtBQUssQ0FBQyxDQUFDLENBQ2pFLENBQUM7SUFDTixDQUFDO0lBRUQsV0FBVztRQUNQLElBQUksQ0FBQyxVQUFVLENBQUMsSUFBSSxFQUFFLENBQUM7UUFDdkIsSUFBSSxDQUFDLFVBQVUsQ0FBQyxRQUFRLEVBQUUsQ0FBQztJQUMvQixDQUFDO0lBRUQsV0FBVyxDQUFDLEtBQW1CO1FBQzNCLElBQUksQ0FBQyx1QkFBdUIsRUFBRSxDQUFDO1FBQy9CLElBQUksQ0FBQyxlQUFlLENBQUMsSUFBSSxDQUFDLEtBQUssQ0FBQyxDQUFDO0lBQ3JDLENBQUM7SUFFRCxTQUFTLENBQUMsS0FBaUI7UUFDdkIsSUFBSSxDQUFDLHFCQUFxQixFQUFFLENBQUM7UUFDN0IsSUFBSSxDQUFDLGFBQWEsQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLENBQUM7SUFDbkMsQ0FBQzs7b0hBNUZRLHVCQUF1Qjt3R0FBdkIsdUJBQXVCLDhXQ1pwQyxpOUNBc0JNOzJGRFZPLHVCQUF1QjtrQkFMbkMsU0FBUzsrQkFDSSxxQkFBcUI7MEVBS3RCLFdBQVc7c0JBQW5CLEtBQUs7Z0JBQ0csVUFBVTtzQkFBbEIsS0FBSztnQkFDRyxLQUFLO3NCQUFiLEtBQUs7Z0JBQ0csU0FBUztzQkFBakIsS0FBSztnQkFDRyxhQUFhO3NCQUFyQixLQUFLO2dCQUVHLG1CQUFtQjtzQkFBM0IsS0FBSztnQkFFRyxXQUFXO3NCQUFuQixLQUFLO2dCQUlGLEtBQUs7c0JBRFIsS0FBSztnQkFjSSxlQUFlO3NCQUF4QixNQUFNO2dCQUNHLGFBQWE7c0JBQXRCLE1BQU0iLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDZGtEcmFnRW5kLCBDZGtEcmFnU3RhcnQgfSBmcm9tICdAYW5ndWxhci9jZGsvZHJhZy1kcm9wJztcbmltcG9ydCB7IENvbXBvbmVudCwgRXZlbnRFbWl0dGVyLCBIb3N0QmluZGluZywgSW5wdXQsIE9uRGVzdHJveSwgT25Jbml0LCBPdXRwdXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IEZvcm1Db250cm9sIH0gZnJvbSAnQGFuZ3VsYXIvZm9ybXMnO1xuaW1wb3J0IHsgT2JzZXJ2YWJsZSwgU3ViamVjdCB9IGZyb20gJ3J4anMnO1xuaW1wb3J0IHsgbWFwLCBzdGFydFdpdGgsIHRha2VVbnRpbCB9IGZyb20gJ3J4anMvb3BlcmF0b3JzJztcbmltcG9ydCB7IElQZXBEcmFnZ2FibGVJdGVtLCBQZXBEcmFnZ2FibGVJdGVtUGxhY2Vob2xkZXJUeXBlLCBQZXBEcmFnZ2FibGVJdGVtc1RpdGxlVHlwZSB9IGZyb20gJy4vZHJhZ2dhYmxlLWl0ZW1zLm1vZGVsJztcbmltcG9ydCB7IFBlcFNpemVUeXBlIH0gZnJvbSAnQHBlcHBlcmktYWRkb25zL25neC1saWInO1xuQENvbXBvbmVudCh7XG4gICAgc2VsZWN0b3I6ICdwZXAtZHJhZ2dhYmxlLWl0ZW1zJyxcbiAgICB0ZW1wbGF0ZVVybDogJy4vZHJhZ2dhYmxlLWl0ZW1zLmNvbXBvbmVudC5odG1sJyxcbiAgICBzdHlsZVVybHM6IFsnLi9kcmFnZ2FibGUtaXRlbXMuY29tcG9uZW50LnNjc3MnLCAnLi9kcmFnZ2FibGUtaXRlbXMuY29tcG9uZW50LnRoZW1lLnNjc3MnXVxufSlcbmV4cG9ydCBjbGFzcyBEcmFnZ2FibGVJdGVtc0NvbXBvbmVudCBpbXBsZW1lbnRzIE9uSW5pdCwgT25EZXN0cm95IHtcbiAgICBASW5wdXQoKSBjb250YWluZXJJZCA9ICdkcmFnZ2FibGUtY29udGFpbmVyJztcbiAgICBASW5wdXQoKSBzaG93U2VhcmNoID0gZmFsc2U7XG4gICAgQElucHV0KCkgdGl0bGUgPSAnJztcbiAgICBASW5wdXQoKSB0aXRsZVR5cGU6IFBlcERyYWdnYWJsZUl0ZW1zVGl0bGVUeXBlID0gJ3JlZ3VsYXInO1xuICAgIEBJbnB1dCgpIHRpdGxlU2l6ZVR5cGU6IFBlcFNpemVUeXBlID0gJ3hsJztcblxuICAgIEBJbnB1dCgpIGl0ZW1QbGFjZWhvbGRlclR5cGU6IFBlcERyYWdnYWJsZUl0ZW1QbGFjZWhvbGRlclR5cGUgPSAnbm9uZSc7XG5cbiAgICBASW5wdXQoKSBkcm9wQXJlYUlkcyA9IFtdO1xuXG4gICAgcHJpdmF0ZSBfaXRlbXM6IEFycmF5PElQZXBEcmFnZ2FibGVJdGVtPiA9IFtdO1xuICAgIEBJbnB1dCgpXG4gICAgc2V0IGl0ZW1zKHZhbHVlOiBBcnJheTxJUGVwRHJhZ2dhYmxlSXRlbT4pIHtcbiAgICAgICAgdGhpcy5faXRlbXMgPSB2YWx1ZTtcblxuICAgICAgICBpZiAodGhpcy5pdGVtcz8ubGVuZ3RoID4gMCkge1xuICAgICAgICAgICAgdGhpcy5zZWFyY2hDb250cm9sLmVuYWJsZSgpO1xuICAgICAgICB9IGVsc2Uge1xuICAgICAgICAgICAgdGhpcy5zZWFyY2hDb250cm9sLmRpc2FibGUoKTtcbiAgICAgICAgfVxuICAgIH1cbiAgICBnZXQgaXRlbXMoKTogQXJyYXk8SVBlcERyYWdnYWJsZUl0ZW0+IHtcbiAgICAgICAgcmV0dXJuIHRoaXMuX2l0ZW1zO1xuICAgIH1cblxuICAgIEBPdXRwdXQoKSBpdGVtRHJhZ1N0YXJ0ZWQ6IEV2ZW50RW1pdHRlcjxDZGtEcmFnU3RhcnQ8SVBlcERyYWdnYWJsZUl0ZW0+PiA9IG5ldyBFdmVudEVtaXR0ZXI8Q2RrRHJhZ1N0YXJ0PElQZXBEcmFnZ2FibGVJdGVtPj4oKTtcbiAgICBAT3V0cHV0KCkgaXRlbURyYWdFbmRlZDogRXZlbnRFbWl0dGVyPENka0RyYWdFbmQ8SVBlcERyYWdnYWJsZUl0ZW0+PiA9IG5ldyBFdmVudEVtaXR0ZXI8Q2RrRHJhZ0VuZDxJUGVwRHJhZ2dhYmxlSXRlbT4+KCk7XG5cbiAgICBmaWx0ZXJlZEl0ZW1zJDogT2JzZXJ2YWJsZTxhbnk+O1xuICAgIHNlYXJjaENvbnRyb2wgPSBuZXcgRm9ybUNvbnRyb2woKTtcbiAgICBudW1iZXJJdGVtc1RvU2hvd1NlYXJjaCA9IDU7XG4gICAgcHJpdmF0ZSByZWFkb25seSBfZGVzdHJveWVkOiBTdWJqZWN0PHZvaWQ+O1xuXG4gICAgY29uc3RydWN0b3IoKSB7XG4gICAgICAgIC8vXG4gICAgICAgIHRoaXMuX2Rlc3Ryb3llZCA9IG5ldyBTdWJqZWN0KCk7XG4gICAgfVxuXG4gICAgcHJpdmF0ZSBmaWx0ZXJJdGVtcyh2YWx1ZTogc3RyaW5nKTogYW55W10ge1xuICAgICAgICBjb25zdCBmaWx0ZXJWYWx1ZSA9IHZhbHVlLnRvTG93ZXJDYXNlKCk7XG4gICAgICAgIHJldHVybiB0aGlzLml0ZW1zLmZpbHRlcihcbiAgICAgICAgICAgIChvcHQpID0+XG4gICAgICAgICAgICAgICAgb3B0LnRpdGxlICYmXG4gICAgICAgICAgICAgICAgb3B0LnRpdGxlLnRvTG93ZXJDYXNlKCkuaW5jbHVkZXMoZmlsdGVyVmFsdWUudG9Mb3dlckNhc2UoKSlcbiAgICAgICAgKTtcbiAgICB9XG5cbiAgICBwcml2YXRlIGNoYW5nZUN1cnNvck9uRHJhZ1N0YXJ0KCkge1xuICAgICAgICBkb2N1bWVudC5ib2R5LmNsYXNzTGlzdC5hZGQoJ2luaGVyaXRDdXJzb3JzJyk7XG4gICAgICAgIGRvY3VtZW50LmJvZHkuc3R5bGUuY3Vyc29yID0gJ2dyYWJiaW5nJztcbiAgICB9XG5cbiAgICBwcml2YXRlIGNoYW5nZUN1cnNvck9uRHJhZ0VuZCgpIHtcbiAgICAgICAgZG9jdW1lbnQuYm9keS5jbGFzc0xpc3QucmVtb3ZlKCdpbmhlcml0Q3Vyc29ycycpO1xuICAgICAgICBkb2N1bWVudC5ib2R5LnN0eWxlLmN1cnNvciA9ICd1bnNldCc7XG4gICAgfVxuXG4gICAgcHJvdGVjdGVkIGdldERlc3Ryb3llcigpIHtcbiAgICAgICAgcmV0dXJuIHRha2VVbnRpbCh0aGlzLl9kZXN0cm95ZWQpO1xuICAgIH1cblxuICAgIG5nT25Jbml0KCk6IHZvaWQge1xuICAgICAgICAvLyBJZiB0aGVyZSBpcyBubyBpdGVtIGRpc2FibGUgdGhlIHNlYXJjaC5cbiAgICAgICAgaWYgKHRoaXMuaXRlbXMubGVuZ3RoID09PSAwKSB7XG4gICAgICAgICAgICB0aGlzLnNlYXJjaENvbnRyb2wuZGlzYWJsZSgpO1xuICAgICAgICB9XG5cbiAgICAgICAgLy8gRmlsdGVyIHRoZSBkcmFnZ2FibGVJdGVtcyBieSB0aGUgc2VhcmNoIGNvbnRyb2wuXG4gICAgICAgIHRoaXMuZmlsdGVyZWRJdGVtcyQgPSB0aGlzLnNlYXJjaENvbnRyb2wudmFsdWVDaGFuZ2VzLnBpcGUoXG4gICAgICAgICAgICB0aGlzLmdldERlc3Ryb3llcigpLFxuICAgICAgICAgICAgc3RhcnRXaXRoPGFueT4oJycpLFxuICAgICAgICAgICAgbWFwKChvcHRpb24pID0+XG4gICAgICAgICAgICAgICAgdHlwZW9mIG9wdGlvbiA9PT0gJ3N0cmluZycgPyBvcHRpb24gOiBvcHRpb24gJiYgb3B0aW9uLnZhbHVlXG4gICAgICAgICAgICApLFxuICAgICAgICAgICAgbWFwKCh2YWx1ZSkgPT4gKHZhbHVlID8gdGhpcy5maWx0ZXJJdGVtcyh2YWx1ZSkgOiB0aGlzLml0ZW1zKSlcbiAgICAgICAgKTtcbiAgICB9XG5cbiAgICBuZ09uRGVzdHJveSgpOiB2b2lkIHtcbiAgICAgICAgdGhpcy5fZGVzdHJveWVkLm5leHQoKTtcbiAgICAgICAgdGhpcy5fZGVzdHJveWVkLmNvbXBsZXRlKCk7XG4gICAgfVxuXG4gICAgb25EcmFnU3RhcnQoZXZlbnQ6IENka0RyYWdTdGFydCkge1xuICAgICAgICB0aGlzLmNoYW5nZUN1cnNvck9uRHJhZ1N0YXJ0KCk7XG4gICAgICAgIHRoaXMuaXRlbURyYWdTdGFydGVkLmVtaXQoZXZlbnQpO1xuICAgIH1cblxuICAgIG9uRHJhZ0VuZChldmVudDogQ2RrRHJhZ0VuZCkge1xuICAgICAgICB0aGlzLmNoYW5nZUN1cnNvck9uRHJhZ0VuZCgpO1xuICAgICAgICB0aGlzLml0ZW1EcmFnRW5kZWQuZW1pdChldmVudCk7XG4gICAgfVxufVxuIiwiPGRpdiBbaWRdPVwiY29udGFpbmVySWRcIiBjbGFzcz1cInBlcC1kcmFnZ2FibGUtaXRlbXMtY29udGFpbmVyXCIgY2RrRHJvcExpc3QgW2Nka0Ryb3BMaXN0RGF0YV09XCJmaWx0ZXJlZEl0ZW1zJCB8IGFzeW5jXCJcclxuICAgIGNka0Ryb3BMaXN0U29ydGluZ0Rpc2FibGVkIFtjZGtEcm9wTGlzdENvbm5lY3RlZFRvXT1cImRyb3BBcmVhSWRzXCI+XHJcblxyXG4gICAgPGRpdiAqbmdJZj1cInRpdGxlVHlwZSAhPT0gJ25vbmUnXCIgY2xhc3M9XCJ0aXRsZS1jb250YWluZXJcIlxyXG4gICAgICAgIFtuZ0NsYXNzXT1cInsgJ3BlcC1ib3JkZXItYm90dG9tJzogdGl0bGVUeXBlID09PSAnd2l0aC1ib3R0b20tYm9yZGVyJ31cIj5cclxuICAgICAgICA8bGFiZWwgY2xhc3M9XCJ0aXRsZSBib2R5LXt7IHRpdGxlU2l6ZVR5cGUgfX0gYm9sZCBlbGxpcHNpcyBcIiA+e3t0aXRsZX19PC9sYWJlbD5cclxuICAgICAgICA8cGVwLXNlYXJjaCAqbmdJZj1cInNob3dTZWFyY2ggJiYgaXRlbXM/Lmxlbmd0aCA+IG51bWJlckl0ZW1zVG9TaG93U2VhcmNoXCIgY2xhc3M9XCJzZWFyY2gtYnV0dG9uXCIgc2l6ZVR5cGU9XCJzbVwiIHNocmluaz1cImFsd2F5c1wiXHJcbiAgICAgICAgICAgIFtzZWFyY2hDb250cm9sXT1cInNlYXJjaENvbnRyb2xcIiB0cmlnZ2VyT249XCJrZXlkb3duXCI+PC9wZXAtc2VhcmNoPlxyXG4gICAgPC9kaXY+XHJcblxyXG4gICAgPGRpdiBjbGFzcz1cImRyYWdnYWJsZS1pdGVtcy1vdmVyZmxvd1wiPlxyXG4gICAgICAgIDxkaXYgY2xhc3M9XCJkcmFnZ2FibGUtaXRlbXMtd3JhcHBlclwiPlxyXG4gICAgICAgICAgICA8cGVwLWRyYWdnYWJsZS1pdGVtICpuZ0Zvcj1cImxldCBpdGVtIG9mIGZpbHRlcmVkSXRlbXMkIHwgYXN5bmM7IGxldCBpPWluZGV4O1wiIGNsYXNzPVwiZHJhZ2dibGUtaXRlbVwiXHJcbiAgICAgICAgICAgICAgICBbdGl0bGVdPVwiaXRlbS50aXRsZVwiIFtkYXRhXT1cIml0ZW0uZGF0YVwiIFtkaXNhYmxlZF09XCJpdGVtLmRpc2FibGVkXCIgY2RrRHJhZyBbY2RrRHJhZ0RhdGFdPVwiaXRlbS5kYXRhXCJcclxuICAgICAgICAgICAgICAgIFtjZGtEcmFnRGlzYWJsZWRdPVwiaXRlbS5kaXNhYmxlZFwiIChjZGtEcmFnU3RhcnRlZCk9XCJvbkRyYWdTdGFydCgkZXZlbnQpXCIgKGNka0RyYWdFbmRlZCk9XCJvbkRyYWdFbmQoJGV2ZW50KVwiPlxyXG4gICAgICAgIFxyXG4gICAgICAgICAgICAgICAgPG5nLWNvbnRhaW5lciAqbmdJZj1cIml0ZW1QbGFjZWhvbGRlclR5cGUgIT09ICdyZWd1bGFyJ1wiPlxyXG4gICAgICAgICAgICAgICAgICAgIDxkaXYgY2xhc3M9XCJwbGFjZWhvbGRlci1pdGVtIHt7aXRlbVBsYWNlaG9sZGVyVHlwZX19XCIgKmNka0RyYWdQbGFjZWhvbGRlcj48L2Rpdj5cclxuICAgICAgICAgICAgICAgIDwvbmctY29udGFpbmVyPlxyXG4gICAgICAgICAgICA8L3BlcC1kcmFnZ2FibGUtaXRlbT5cclxuICAgICAgICA8L2Rpdj5cclxuICAgIDwvZGl2PlxyXG48L2Rpdj4iXX0=

package/esm2020/draggable-items/draggable-items.model.mjs

@@ -1,2 +1,2 @@
-export {};
+export {};
 //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZHJhZ2dhYmxlLWl0ZW1zLm1vZGVsLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vcHJvamVjdHMvbmd4LWxpYi9kcmFnZ2FibGUtaXRlbXMvZHJhZ2dhYmxlLWl0ZW1zLm1vZGVsLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiIiLCJzb3VyY2VzQ29udGVudCI6WyJleHBvcnQgdHlwZSBQZXBEcmFnZ2FibGVJdGVtc1RpdGxlVHlwZSA9ICdub25lJyB8ICdyZWd1bGFyJyB8ICd3aXRoLWJvdHRvbS1ib3JkZXInO1xyXG5cclxuZXhwb3J0IHR5cGUgUGVwRHJhZ2dhYmxlSXRlbVBsYWNlaG9sZGVyVHlwZSA9ICdub25lJyB8ICdyZWd1bGFyJyB8ICd3ZWFrJztcclxuXHJcbmV4cG9ydCBpbnRlcmZhY2UgSVBlcERyYWdnYWJsZUl0ZW0ge1xyXG4gICAgdGl0bGU6IHN0cmluZztcclxuICAgIGRhdGE6IElQZXBEcmFnZ2FibGVJdGVtRGF0YVxyXG4gICAgZGlzYWJsZWQ/OiBib29sZWFuO1xyXG59XHJcblxyXG5leHBvcnQgaW50ZXJmYWNlIElQZXBEcmFnZ2FibGVJdGVtRGF0YSB7XHJcbiAgICBrZXk6IHN0cmluZztcclxuICAgIFtrZXk6IHN0cmluZ106IGFueTtcclxufSJdfQ==

package/esm2020/draggable-items/draggable-items.module.mjs

@@ -1,60 +1,60 @@
-import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { ReactiveFormsModule } from '@angular/forms';
-import { PepNgxLibModule } from '@pepperi-addons/ngx-lib';
-import { PepButtonModule } from '@pepperi-addons/ngx-lib/button';
-import { PepSearchModule } from '@pepperi-addons/ngx-lib/search';
-import { DragDropModule } from '@angular/cdk/drag-drop';
-import { DraggableItemsComponent } from './draggable-items.component';
-import { DraggableItemComponent } from './draggable-item/draggable-item.component';
-import { PepIconModule, pepIconSystemMove, } from '@pepperi-addons/ngx-lib/icon';
-import * as i0 from "@angular/core";
-import * as i1 from "@pepperi-addons/ngx-lib/icon";
-export class PepDraggableItemsModule {
-    constructor(pepIconRegistry) {
-        this.pepIconRegistry = pepIconRegistry;
-        this.pepIconRegistry.registerIcons([
-            pepIconSystemMove,
-        ]);
-    }
-}
-PepDraggableItemsModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepDraggableItemsModule, deps: [{ token: i1.PepIconRegistry }], target: i0.ɵɵFactoryTarget.NgModule });
-PepDraggableItemsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.0.2", ngImport: i0, type: PepDraggableItemsModule, declarations: [DraggableItemsComponent,
-        DraggableItemComponent], imports: [CommonModule,
-        ReactiveFormsModule,
-        PepNgxLibModule,
-        PepButtonModule,
-        PepIconModule,
-        PepSearchModule,
-        DragDropModule], exports: [DraggableItemsComponent,
-        DraggableItemComponent] });
-PepDraggableItemsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepDraggableItemsModule, imports: [CommonModule,
-        ReactiveFormsModule,
-        PepNgxLibModule,
-        PepButtonModule,
-        PepIconModule,
-        PepSearchModule,
-        DragDropModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepDraggableItemsModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [
-                        DraggableItemsComponent,
-                        DraggableItemComponent
-                    ],
-                    imports: [
-                        CommonModule,
-                        ReactiveFormsModule,
-                        PepNgxLibModule,
-                        PepButtonModule,
-                        PepIconModule,
-                        PepSearchModule,
-                        DragDropModule
-                    ],
-                    exports: [
-                        DraggableItemsComponent,
-                        DraggableItemComponent
-                    ],
-                }]
-        }], ctorParameters: function () { return [{ type: i1.PepIconRegistry }]; } });
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { ReactiveFormsModule } from '@angular/forms';
+import { PepNgxLibModule } from '@pepperi-addons/ngx-lib';
+import { PepButtonModule } from '@pepperi-addons/ngx-lib/button';
+import { PepSearchModule } from '@pepperi-addons/ngx-lib/search';
+import { DragDropModule } from '@angular/cdk/drag-drop';
+import { DraggableItemsComponent } from './draggable-items.component';
+import { DraggableItemComponent } from './draggable-item/draggable-item.component';
+import { PepIconModule, pepIconSystemMove, } from '@pepperi-addons/ngx-lib/icon';
+import * as i0 from "@angular/core";
+import * as i1 from "@pepperi-addons/ngx-lib/icon";
+export class PepDraggableItemsModule {
+    constructor(pepIconRegistry) {
+        this.pepIconRegistry = pepIconRegistry;
+        this.pepIconRegistry.registerIcons([
+            pepIconSystemMove,
+        ]);
+    }
+}
+PepDraggableItemsModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepDraggableItemsModule, deps: [{ token: i1.PepIconRegistry }], target: i0.ɵɵFactoryTarget.NgModule });
+PepDraggableItemsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.0.2", ngImport: i0, type: PepDraggableItemsModule, declarations: [DraggableItemsComponent,
+        DraggableItemComponent], imports: [CommonModule,
+        ReactiveFormsModule,
+        PepNgxLibModule,
+        PepButtonModule,
+        PepIconModule,
+        PepSearchModule,
+        DragDropModule], exports: [DraggableItemsComponent,
+        DraggableItemComponent] });
+PepDraggableItemsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepDraggableItemsModule, imports: [CommonModule,
+        ReactiveFormsModule,
+        PepNgxLibModule,
+        PepButtonModule,
+        PepIconModule,
+        PepSearchModule,
+        DragDropModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepDraggableItemsModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [
+                        DraggableItemsComponent,
+                        DraggableItemComponent
+                    ],
+                    imports: [
+                        CommonModule,
+                        ReactiveFormsModule,
+                        PepNgxLibModule,
+                        PepButtonModule,
+                        PepIconModule,
+                        PepSearchModule,
+                        DragDropModule
+                    ],
+                    exports: [
+                        DraggableItemsComponent,
+                        DraggableItemComponent
+                    ],
+                }]
+        }], ctorParameters: function () { return [{ type: i1.PepIconRegistry }]; } });
 //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZHJhZ2dhYmxlLWl0ZW1zLm1vZHVsZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3Byb2plY3RzL25neC1saWIvZHJhZ2dhYmxlLWl0ZW1zL2RyYWdnYWJsZS1pdGVtcy5tb2R1bGUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFFBQVEsRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUN6QyxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0saUJBQWlCLENBQUM7QUFDL0MsT0FBTyxFQUFFLG1CQUFtQixFQUFFLE1BQU0sZ0JBQWdCLENBQUM7QUFFckQsT0FBTyxFQUFFLGVBQWUsRUFBRSxNQUFNLHlCQUF5QixDQUFDO0FBQzFELE9BQU8sRUFBRSxlQUFlLEVBQUUsTUFBTSxnQ0FBZ0MsQ0FBQztBQUNqRSxPQUFPLEVBQUUsZUFBZSxFQUFFLE1BQU0sZ0NBQWdDLENBQUM7QUFFakUsT0FBTyxFQUFFLGNBQWMsRUFBRSxNQUFNLHdCQUF3QixDQUFDO0FBRXhELE9BQU8sRUFBRSx1QkFBdUIsRUFBRSxNQUFNLDZCQUE2QixDQUFDO0FBQ3RFLE9BQU8sRUFBRSxzQkFBc0IsRUFBRSxNQUFNLDJDQUEyQyxDQUFDO0FBQ25GLE9BQU8sRUFDSCxhQUFhLEVBRWIsaUJBQWlCLEdBQ3BCLE1BQU0sOEJBQThCLENBQUM7OztBQXFCdEMsTUFBTSxPQUFPLHVCQUF1QjtJQUNoQyxZQUFvQixlQUFnQztRQUFoQyxvQkFBZSxHQUFmLGVBQWUsQ0FBaUI7UUFDaEQsSUFBSSxDQUFDLGVBQWUsQ0FBQyxhQUFhLENBQUM7WUFDL0IsaUJBQWlCO1NBQ3BCLENBQUMsQ0FBQztJQUNQLENBQUM7O29IQUxRLHVCQUF1QjtxSEFBdkIsdUJBQXVCLGlCQWpCNUIsdUJBQXVCO1FBQ3ZCLHNCQUFzQixhQUd0QixZQUFZO1FBQ1osbUJBQW1CO1FBQ25CLGVBQWU7UUFDZixlQUFlO1FBQ2YsYUFBYTtRQUNiLGVBQWU7UUFDZixjQUFjLGFBR2QsdUJBQXVCO1FBQ3ZCLHNCQUFzQjtxSEFHakIsdUJBQXVCLFlBYjVCLFlBQVk7UUFDWixtQkFBbUI7UUFDbkIsZUFBZTtRQUNmLGVBQWU7UUFDZixhQUFhO1FBQ2IsZUFBZTtRQUNmLGNBQWM7MkZBT1QsdUJBQXVCO2tCQW5CbkMsUUFBUTttQkFBQztvQkFDTixZQUFZLEVBQUU7d0JBQ1YsdUJBQXVCO3dCQUN2QixzQkFBc0I7cUJBQ3pCO29CQUNELE9BQU8sRUFBRTt3QkFDTCxZQUFZO3dCQUNaLG1CQUFtQjt3QkFDbkIsZUFBZTt3QkFDZixlQUFlO3dCQUNmLGFBQWE7d0JBQ2IsZUFBZTt3QkFDZixjQUFjO3FCQUNqQjtvQkFDRCxPQUFPLEVBQUU7d0JBQ0wsdUJBQXVCO3dCQUN2QixzQkFBc0I7cUJBQ3pCO2lCQUNKIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgTmdNb2R1bGUgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IENvbW1vbk1vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvbW1vbic7XG5pbXBvcnQgeyBSZWFjdGl2ZUZvcm1zTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvZm9ybXMnO1xuXG5pbXBvcnQgeyBQZXBOZ3hMaWJNb2R1bGUgfSBmcm9tICdAcGVwcGVyaS1hZGRvbnMvbmd4LWxpYic7XG5pbXBvcnQgeyBQZXBCdXR0b25Nb2R1bGUgfSBmcm9tICdAcGVwcGVyaS1hZGRvbnMvbmd4LWxpYi9idXR0b24nO1xuaW1wb3J0IHsgUGVwU2VhcmNoTW9kdWxlIH0gZnJvbSAnQHBlcHBlcmktYWRkb25zL25neC1saWIvc2VhcmNoJztcblxuaW1wb3J0IHsgRHJhZ0Ryb3BNb2R1bGUgfSBmcm9tICdAYW5ndWxhci9jZGsvZHJhZy1kcm9wJztcblxuaW1wb3J0IHsgRHJhZ2dhYmxlSXRlbXNDb21wb25lbnQgfSBmcm9tICcuL2RyYWdnYWJsZS1pdGVtcy5jb21wb25lbnQnO1xuaW1wb3J0IHsgRHJhZ2dhYmxlSXRlbUNvbXBvbmVudCB9IGZyb20gJy4vZHJhZ2dhYmxlLWl0ZW0vZHJhZ2dhYmxlLWl0ZW0uY29tcG9uZW50JztcbmltcG9ydCB7XG4gICAgUGVwSWNvbk1vZHVsZSxcbiAgICBQZXBJY29uUmVnaXN0cnksXG4gICAgcGVwSWNvblN5c3RlbU1vdmUsXG59IGZyb20gJ0BwZXBwZXJpLWFkZG9ucy9uZ3gtbGliL2ljb24nO1xuXG5ATmdNb2R1bGUoe1xuICAgIGRlY2xhcmF0aW9uczogW1xuICAgICAgICBEcmFnZ2FibGVJdGVtc0NvbXBvbmVudCxcbiAgICAgICAgRHJhZ2dhYmxlSXRlbUNvbXBvbmVudFxuICAgIF0sXG4gICAgaW1wb3J0czogW1xuICAgICAgICBDb21tb25Nb2R1bGUsXG4gICAgICAgIFJlYWN0aXZlRm9ybXNNb2R1bGUsXG4gICAgICAgIFBlcE5neExpYk1vZHVsZSxcbiAgICAgICAgUGVwQnV0dG9uTW9kdWxlLFxuICAgICAgICBQZXBJY29uTW9kdWxlLFxuICAgICAgICBQZXBTZWFyY2hNb2R1bGUsXG4gICAgICAgIERyYWdEcm9wTW9kdWxlXG4gICAgXSxcbiAgICBleHBvcnRzOiBbXG4gICAgICAgIERyYWdnYWJsZUl0ZW1zQ29tcG9uZW50LFxuICAgICAgICBEcmFnZ2FibGVJdGVtQ29tcG9uZW50XG4gICAgXSxcbn0pXG5leHBvcnQgY2xhc3MgUGVwRHJhZ2dhYmxlSXRlbXNNb2R1bGUge1xuICAgIGNvbnN0cnVjdG9yKHByaXZhdGUgcGVwSWNvblJlZ2lzdHJ5OiBQZXBJY29uUmVnaXN0cnkpIHtcbiAgICAgICAgdGhpcy5wZXBJY29uUmVnaXN0cnkucmVnaXN0ZXJJY29ucyhbXG4gICAgICAgICAgICBwZXBJY29uU3lzdGVtTW92ZSxcbiAgICAgICAgXSk7XG4gICAgfVxufVxuIl19

package/esm2020/draggable-items/pepperi-addons-ngx-lib-draggable-items.mjs

@@ -1,5 +1,5 @@
-/**
- * Generated bundle index. Do not edit.
- */
-export * from './public-api';
+/**
+ * Generated bundle index. Do not edit.
+ */
+export * from './public-api';
 //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicGVwcGVyaS1hZGRvbnMtbmd4LWxpYi1kcmFnZ2FibGUtaXRlbXMuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9wcm9qZWN0cy9uZ3gtbGliL2RyYWdnYWJsZS1pdGVtcy9wZXBwZXJpLWFkZG9ucy1uZ3gtbGliLWRyYWdnYWJsZS1pdGVtcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTs7R0FFRztBQUVILGNBQWMsY0FBYyxDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBHZW5lcmF0ZWQgYnVuZGxlIGluZGV4LiBEbyBub3QgZWRpdC5cbiAqL1xuXG5leHBvcnQgKiBmcm9tICcuL3B1YmxpYy1hcGknO1xuIl19

package/esm2020/draggable-items/public-api.mjs

@@ -1,8 +1,8 @@
-/*
- * Public API Surface of ngx-lib/draggable-items
- */
-export * from './draggable-item/draggable-item.component';
-export * from './draggable-items.module';
-export * from './draggable-items.model';
-export * from './draggable-items.component';
+/*
+ * Public API Surface of ngx-lib/draggable-items
+ */
+export * from './draggable-item/draggable-item.component';
+export * from './draggable-items.module';
+export * from './draggable-items.model';
+export * from './draggable-items.component';
 //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHVibGljLWFwaS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3Byb2plY3RzL25neC1saWIvZHJhZ2dhYmxlLWl0ZW1zL3B1YmxpYy1hcGkudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUE7O0dBRUc7QUFDSCxjQUFjLDJDQUEyQyxDQUFDO0FBRTFELGNBQWMsMEJBQTBCLENBQUM7QUFDekMsY0FBYyx5QkFBeUIsQ0FBQztBQUN4QyxjQUFjLDZCQUE2QixDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiLypcbiAqIFB1YmxpYyBBUEkgU3VyZmFjZSBvZiBuZ3gtbGliL2RyYWdnYWJsZS1pdGVtc1xuICovXG5leHBvcnQgKiBmcm9tICcuL2RyYWdnYWJsZS1pdGVtL2RyYWdnYWJsZS1pdGVtLmNvbXBvbmVudCc7XG5cbmV4cG9ydCAqIGZyb20gJy4vZHJhZ2dhYmxlLWl0ZW1zLm1vZHVsZSc7XG5leHBvcnQgKiBmcm9tICcuL2RyYWdnYWJsZS1pdGVtcy5tb2RlbCc7XG5leHBvcnQgKiBmcm9tICcuL2RyYWdnYWJsZS1pdGVtcy5jb21wb25lbnQnO1xuIl19

package/esm2020/field-title/field-title.component.mjs

@@ -1,45 +1,45 @@
-import { Component, Input } from '@angular/core';
-import { DEFAULT_HORIZONTAL_ALIGNMENT, } from '@pepperi-addons/ngx-lib';
-import * as i0 from "@angular/core";
-import * as i1 from "@angular/common";
-import * as i2 from "@angular/material/icon";
-import * as i3 from "@angular/material/form-field";
-import * as i4 from "@pepperi-addons/ngx-lib/icon";
-export class PepFieldTitleComponent {
-    constructor() {
-        this.label = '';
-        this.mandatory = false;
-        this.disabled = false;
-        this.maxFieldCharacters = 0;
-        this.hint = '';
-        this.xAlignment = DEFAULT_HORIZONTAL_ALIGNMENT;
-        this.showTitle = true;
-        this.inputLength = 0;
-        this.fontBodyType = 'xs';
-    }
-}
-PepFieldTitleComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepFieldTitleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-PepFieldTitleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: PepFieldTitleComponent, selector: "pep-field-title", inputs: { label: "label", mandatory: "mandatory", disabled: "disabled", maxFieldCharacters: "maxFieldCharacters", hint: "hint", xAlignment: "xAlignment", showTitle: "showTitle", inputLength: "inputLength", fontBodyType: "fontBodyType" }, ngImport: i0, template: "<div class=\"mat-form-title\" [ngClass]=\"{disable: disabled}\" [ngStyle]=\"{'text-align': xAlignment }\">\n    <ng-container *ngIf=\"xAlignment == 'right' then rightTemplate else leftTemplate\">\n    </ng-container>\n    <ng-template #rightTemplate>\n        <ng-container *ngTemplateOutlet=\"hintTemplate\"></ng-container>\n        <ng-container *ngTemplateOutlet=\"titleTemplate\"></ng-container>\n        <ng-container *ngTemplateOutlet=\"requiredTemplate\"></ng-container>\n    </ng-template>\n    <ng-template #leftTemplate>\n        <ng-container *ngTemplateOutlet=\"requiredTemplate\"></ng-container>\n        <ng-container *ngTemplateOutlet=\"titleTemplate\"></ng-container>\n        <ng-container *ngTemplateOutlet=\"hintTemplate\"></ng-container>\n    </ng-template>\n\n    <ng-template #requiredTemplate>\n        <mat-icon *ngIf=\"mandatory\" class=\"pep-spacing-element\">\n            <pep-icon name=\"system_must\"></pep-icon>\n        </mat-icon>\n        <!-- For the grid template () -->\n        <span *ngIf=\"!mandatory\"></span>\n    </ng-template>\n    <ng-template #titleTemplate>\n        <mat-label *ngIf=\"showTitle\" [title]=\"label\" class=\"body-{{fontBodyType}}\">\n            {{ label }}\n        </mat-label>\n        <!-- For the grid template () -->\n        <span *ngIf=\"!showTitle\"></span>\n    </ng-template>\n    <ng-template #hintTemplate>\n        <span class=\"body-{{fontBodyType}} color-dimmed\">\n            <ng-container *ngIf=\"hint?.length > 0 then hintTextTemplate else maxCharactersTemplate\"></ng-container>\n            <ng-template #hintTextTemplate>\n                &nbsp;{{ hint }}\n            </ng-template>\n            <ng-template #maxCharactersTemplate>\n                <ng-container *ngIf=\"maxFieldCharacters > 0\">\n                    &nbsp;{{ inputLength || 0 }}/{{ maxFieldCharacters }}\n                </ng-container>\n            </ng-template>\n        </span>\n    </ng-template>\n</div>", styles: [":host{display:grid;width:inherit}.mat-form-title ::ng-deep .mat-icon{height:100%!important}\n", ""], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "component", type: i4.PepIconComponent, selector: "pep-icon", inputs: ["spin", "name", "fill"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepFieldTitleComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'pep-field-title', template: "<div class=\"mat-form-title\" [ngClass]=\"{disable: disabled}\" [ngStyle]=\"{'text-align': xAlignment }\">\n    <ng-container *ngIf=\"xAlignment == 'right' then rightTemplate else leftTemplate\">\n    </ng-container>\n    <ng-template #rightTemplate>\n        <ng-container *ngTemplateOutlet=\"hintTemplate\"></ng-container>\n        <ng-container *ngTemplateOutlet=\"titleTemplate\"></ng-container>\n        <ng-container *ngTemplateOutlet=\"requiredTemplate\"></ng-container>\n    </ng-template>\n    <ng-template #leftTemplate>\n        <ng-container *ngTemplateOutlet=\"requiredTemplate\"></ng-container>\n        <ng-container *ngTemplateOutlet=\"titleTemplate\"></ng-container>\n        <ng-container *ngTemplateOutlet=\"hintTemplate\"></ng-container>\n    </ng-template>\n\n    <ng-template #requiredTemplate>\n        <mat-icon *ngIf=\"mandatory\" class=\"pep-spacing-element\">\n            <pep-icon name=\"system_must\"></pep-icon>\n        </mat-icon>\n        <!-- For the grid template () -->\n        <span *ngIf=\"!mandatory\"></span>\n    </ng-template>\n    <ng-template #titleTemplate>\n        <mat-label *ngIf=\"showTitle\" [title]=\"label\" class=\"body-{{fontBodyType}}\">\n            {{ label }}\n        </mat-label>\n        <!-- For the grid template () -->\n        <span *ngIf=\"!showTitle\"></span>\n    </ng-template>\n    <ng-template #hintTemplate>\n        <span class=\"body-{{fontBodyType}} color-dimmed\">\n            <ng-container *ngIf=\"hint?.length > 0 then hintTextTemplate else maxCharactersTemplate\"></ng-container>\n            <ng-template #hintTextTemplate>\n                &nbsp;{{ hint }}\n            </ng-template>\n            <ng-template #maxCharactersTemplate>\n                <ng-container *ngIf=\"maxFieldCharacters > 0\">\n                    &nbsp;{{ inputLength || 0 }}/{{ maxFieldCharacters }}\n                </ng-container>\n            </ng-template>\n        </span>\n    </ng-template>\n</div>", styles: [":host{display:grid;width:inherit}.mat-form-title ::ng-deep .mat-icon{height:100%!important}\n"] }]
-        }], propDecorators: { label: [{
-                type: Input
-            }], mandatory: [{
-                type: Input
-            }], disabled: [{
-                type: Input
-            }], maxFieldCharacters: [{
-                type: Input
-            }], hint: [{
-                type: Input
-            }], xAlignment: [{
-                type: Input
-            }], showTitle: [{
-                type: Input
-            }], inputLength: [{
-                type: Input
-            }], fontBodyType: [{
-                type: Input
-            }] } });
+import { Component, Input } from '@angular/core';
+import { DEFAULT_HORIZONTAL_ALIGNMENT, } from '@pepperi-addons/ngx-lib';
+import * as i0 from "@angular/core";
+import * as i1 from "@angular/common";
+import * as i2 from "@angular/material/icon";
+import * as i3 from "@angular/material/form-field";
+import * as i4 from "@pepperi-addons/ngx-lib/icon";
+export class PepFieldTitleComponent {
+    constructor() {
+        this.label = '';
+        this.mandatory = false;
+        this.disabled = false;
+        this.maxFieldCharacters = 0;
+        this.hint = '';
+        this.xAlignment = DEFAULT_HORIZONTAL_ALIGNMENT;
+        this.showTitle = true;
+        this.inputLength = 0;
+        this.fontBodyType = 'xs';
+    }
+}
+PepFieldTitleComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepFieldTitleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+PepFieldTitleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: PepFieldTitleComponent, selector: "pep-field-title", inputs: { label: "label", mandatory: "mandatory", disabled: "disabled", maxFieldCharacters: "maxFieldCharacters", hint: "hint", xAlignment: "xAlignment", showTitle: "showTitle", inputLength: "inputLength", fontBodyType: "fontBodyType" }, ngImport: i0, template: "<div class=\"mat-form-title\" [ngClass]=\"{disable: disabled}\" [ngStyle]=\"{'text-align': xAlignment }\">\n    <ng-container *ngIf=\"xAlignment == 'right' then rightTemplate else leftTemplate\">\n    </ng-container>\n    <ng-template #rightTemplate>\n        <ng-container *ngTemplateOutlet=\"hintTemplate\"></ng-container>\n        <ng-container *ngTemplateOutlet=\"titleTemplate\"></ng-container>\n        <ng-container *ngTemplateOutlet=\"requiredTemplate\"></ng-container>\n    </ng-template>\n    <ng-template #leftTemplate>\n        <ng-container *ngTemplateOutlet=\"requiredTemplate\"></ng-container>\n        <ng-container *ngTemplateOutlet=\"titleTemplate\"></ng-container>\n        <ng-container *ngTemplateOutlet=\"hintTemplate\"></ng-container>\n    </ng-template>\n\n    <ng-template #requiredTemplate>\n        <mat-icon *ngIf=\"mandatory\" class=\"pep-spacing-element\">\n            <pep-icon name=\"system_must\"></pep-icon>\n        </mat-icon>\n        <!-- For the grid template () -->\n        <span *ngIf=\"!mandatory\"></span>\n    </ng-template>\n    <ng-template #titleTemplate>\n        <mat-label *ngIf=\"showTitle\" [title]=\"label\" class=\"body-{{fontBodyType}}\">\n            {{ label }}\n        </mat-label>\n        <!-- For the grid template () -->\n        <span *ngIf=\"!showTitle\"></span>\n    </ng-template>\n    <ng-template #hintTemplate>\n        <span class=\"body-{{fontBodyType}} color-dimmed\">\n            <ng-container *ngIf=\"hint?.length > 0 then hintTextTemplate else maxCharactersTemplate\"></ng-container>\n            <ng-template #hintTextTemplate>\n                &nbsp;{{ hint }}\n            </ng-template>\n            <ng-template #maxCharactersTemplate>\n                <ng-container *ngIf=\"maxFieldCharacters > 0\">\n                    &nbsp;{{ inputLength || 0 }}/{{ maxFieldCharacters }}\n                </ng-container>\n            </ng-template>\n        </span>\n    </ng-template>\n</div>", styles: [":host{display:grid;width:inherit}.mat-form-title ::ng-deep .mat-icon{height:100%!important}\n", ""], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "component", type: i4.PepIconComponent, selector: "pep-icon", inputs: ["spin", "name", "fill"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepFieldTitleComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'pep-field-title', template: "<div class=\"mat-form-title\" [ngClass]=\"{disable: disabled}\" [ngStyle]=\"{'text-align': xAlignment }\">\n    <ng-container *ngIf=\"xAlignment == 'right' then rightTemplate else leftTemplate\">\n    </ng-container>\n    <ng-template #rightTemplate>\n        <ng-container *ngTemplateOutlet=\"hintTemplate\"></ng-container>\n        <ng-container *ngTemplateOutlet=\"titleTemplate\"></ng-container>\n        <ng-container *ngTemplateOutlet=\"requiredTemplate\"></ng-container>\n    </ng-template>\n    <ng-template #leftTemplate>\n        <ng-container *ngTemplateOutlet=\"requiredTemplate\"></ng-container>\n        <ng-container *ngTemplateOutlet=\"titleTemplate\"></ng-container>\n        <ng-container *ngTemplateOutlet=\"hintTemplate\"></ng-container>\n    </ng-template>\n\n    <ng-template #requiredTemplate>\n        <mat-icon *ngIf=\"mandatory\" class=\"pep-spacing-element\">\n            <pep-icon name=\"system_must\"></pep-icon>\n        </mat-icon>\n        <!-- For the grid template () -->\n        <span *ngIf=\"!mandatory\"></span>\n    </ng-template>\n    <ng-template #titleTemplate>\n        <mat-label *ngIf=\"showTitle\" [title]=\"label\" class=\"body-{{fontBodyType}}\">\n            {{ label }}\n        </mat-label>\n        <!-- For the grid template () -->\n        <span *ngIf=\"!showTitle\"></span>\n    </ng-template>\n    <ng-template #hintTemplate>\n        <span class=\"body-{{fontBodyType}} color-dimmed\">\n            <ng-container *ngIf=\"hint?.length > 0 then hintTextTemplate else maxCharactersTemplate\"></ng-container>\n            <ng-template #hintTextTemplate>\n                &nbsp;{{ hint }}\n            </ng-template>\n            <ng-template #maxCharactersTemplate>\n                <ng-container *ngIf=\"maxFieldCharacters > 0\">\n                    &nbsp;{{ inputLength || 0 }}/{{ maxFieldCharacters }}\n                </ng-container>\n            </ng-template>\n        </span>\n    </ng-template>\n</div>", styles: [":host{display:grid;width:inherit}.mat-form-title ::ng-deep .mat-icon{height:100%!important}\n"] }]
+        }], propDecorators: { label: [{
+                type: Input
+            }], mandatory: [{
+                type: Input
+            }], disabled: [{
+                type: Input
+            }], maxFieldCharacters: [{
+                type: Input
+            }], hint: [{
+                type: Input
+            }], xAlignment: [{
+                type: Input
+            }], showTitle: [{
+                type: Input
+            }], inputLength: [{
+                type: Input
+            }], fontBodyType: [{
+                type: Input
+            }] } });
 //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZmllbGQtdGl0bGUuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vcHJvamVjdHMvbmd4LWxpYi9maWVsZC10aXRsZS9maWVsZC10aXRsZS5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi9wcm9qZWN0cy9uZ3gtbGliL2ZpZWxkLXRpdGxlL2ZpZWxkLXRpdGxlLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQ2pELE9BQU8sRUFFSCw0QkFBNEIsR0FDL0IsTUFBTSx5QkFBeUIsQ0FBQzs7Ozs7O0FBT2pDLE1BQU0sT0FBTyxzQkFBc0I7SUFMbkM7UUFNYSxVQUFLLEdBQUcsRUFBRSxDQUFDO1FBQ1gsY0FBUyxHQUFHLEtBQUssQ0FBQztRQUNsQixhQUFRLEdBQUcsS0FBSyxDQUFDO1FBQ2pCLHVCQUFrQixHQUFHLENBQUMsQ0FBQztRQUN2QixTQUFJLEdBQUcsRUFBRSxDQUFDO1FBQ1YsZUFBVSxHQUEyQiw0QkFBNEIsQ0FBQztRQUVsRSxjQUFTLEdBQUcsSUFBSSxDQUFDO1FBQ2pCLGdCQUFXLEdBQUcsQ0FBQyxDQUFDO1FBQ2hCLGlCQUFZLEdBQXFELElBQUksQ0FBQztLQUVsRjs7bUhBWlksc0JBQXNCO3VHQUF0QixzQkFBc0IscVNDWG5DLCs2REF5Q007MkZEOUJPLHNCQUFzQjtrQkFMbEMsU0FBUzsrQkFDSSxpQkFBaUI7OEJBS2xCLEtBQUs7c0JBQWIsS0FBSztnQkFDRyxTQUFTO3NCQUFqQixLQUFLO2dCQUNHLFFBQVE7c0JBQWhCLEtBQUs7Z0JBQ0csa0JBQWtCO3NCQUExQixLQUFLO2dCQUNHLElBQUk7c0JBQVosS0FBSztnQkFDRyxVQUFVO3NCQUFsQixLQUFLO2dCQUVHLFNBQVM7c0JBQWpCLEtBQUs7Z0JBQ0csV0FBVztzQkFBbkIsS0FBSztnQkFDRyxZQUFZO3NCQUFwQixLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBJbnB1dCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHtcbiAgICBQZXBIb3Jpem9udGFsQWxpZ25tZW50LFxuICAgIERFRkFVTFRfSE9SSVpPTlRBTF9BTElHTk1FTlQsXG59IGZyb20gJ0BwZXBwZXJpLWFkZG9ucy9uZ3gtbGliJztcblxuQENvbXBvbmVudCh7XG4gICAgc2VsZWN0b3I6ICdwZXAtZmllbGQtdGl0bGUnLFxuICAgIHRlbXBsYXRlVXJsOiAnLi9maWVsZC10aXRsZS5jb21wb25lbnQuaHRtbCcsXG4gICAgc3R5bGVVcmxzOiBbJy4vZmllbGQtdGl0bGUuY29tcG9uZW50LnNjc3MnLCAnLi9maWVsZC10aXRsZS5jb21wb25lbnQudGhlbWUuc2NzcyddLFxufSlcbmV4cG9ydCBjbGFzcyBQZXBGaWVsZFRpdGxlQ29tcG9uZW50IHtcbiAgICBASW5wdXQoKSBsYWJlbCA9ICcnO1xuICAgIEBJbnB1dCgpIG1hbmRhdG9yeSA9IGZhbHNlO1xuICAgIEBJbnB1dCgpIGRpc2FibGVkID0gZmFsc2U7XG4gICAgQElucHV0KCkgbWF4RmllbGRDaGFyYWN0ZXJzID0gMDtcbiAgICBASW5wdXQoKSBoaW50ID0gJyc7XG4gICAgQElucHV0KCkgeEFsaWdubWVudDogUGVwSG9yaXpvbnRhbEFsaWdubWVudCA9IERFRkFVTFRfSE9SSVpPTlRBTF9BTElHTk1FTlQ7XG5cbiAgICBASW5wdXQoKSBzaG93VGl0bGUgPSB0cnVlO1xuICAgIEBJbnB1dCgpIGlucHV0TGVuZ3RoID0gMDtcbiAgICBASW5wdXQoKSBmb250Qm9keVR5cGU6ICcyeHMnIHwgJ3hzJyB8ICdzbScgfCAnbWQnIHwgJ2xnJyB8ICd4bCcgfCAnMnhsJyA9ICd4cyc7XG5cbn1cbiIsIjxkaXYgY2xhc3M9XCJtYXQtZm9ybS10aXRsZVwiIFtuZ0NsYXNzXT1cIntkaXNhYmxlOiBkaXNhYmxlZH1cIiBbbmdTdHlsZV09XCJ7J3RleHQtYWxpZ24nOiB4QWxpZ25tZW50IH1cIj5cbiAgICA8bmctY29udGFpbmVyICpuZ0lmPVwieEFsaWdubWVudCA9PSAncmlnaHQnIHRoZW4gcmlnaHRUZW1wbGF0ZSBlbHNlIGxlZnRUZW1wbGF0ZVwiPlxuICAgIDwvbmctY29udGFpbmVyPlxuICAgIDxuZy10ZW1wbGF0ZSAjcmlnaHRUZW1wbGF0ZT5cbiAgICAgICAgPG5nLWNvbnRhaW5lciAqbmdUZW1wbGF0ZU91dGxldD1cImhpbnRUZW1wbGF0ZVwiPjwvbmctY29udGFpbmVyPlxuICAgICAgICA8bmctY29udGFpbmVyICpuZ1RlbXBsYXRlT3V0bGV0PVwidGl0bGVUZW1wbGF0ZVwiPjwvbmctY29udGFpbmVyPlxuICAgICAgICA8bmctY29udGFpbmVyICpuZ1RlbXBsYXRlT3V0bGV0PVwicmVxdWlyZWRUZW1wbGF0ZVwiPjwvbmctY29udGFpbmVyPlxuICAgIDwvbmctdGVtcGxhdGU+XG4gICAgPG5nLXRlbXBsYXRlICNsZWZ0VGVtcGxhdGU+XG4gICAgICAgIDxuZy1jb250YWluZXIgKm5nVGVtcGxhdGVPdXRsZXQ9XCJyZXF1aXJlZFRlbXBsYXRlXCI+PC9uZy1jb250YWluZXI+XG4gICAgICAgIDxuZy1jb250YWluZXIgKm5nVGVtcGxhdGVPdXRsZXQ9XCJ0aXRsZVRlbXBsYXRlXCI+PC9uZy1jb250YWluZXI+XG4gICAgICAgIDxuZy1jb250YWluZXIgKm5nVGVtcGxhdGVPdXRsZXQ9XCJoaW50VGVtcGxhdGVcIj48L25nLWNvbnRhaW5lcj5cbiAgICA8L25nLXRlbXBsYXRlPlxuXG4gICAgPG5nLXRlbXBsYXRlICNyZXF1aXJlZFRlbXBsYXRlPlxuICAgICAgICA8bWF0LWljb24gKm5nSWY9XCJtYW5kYXRvcnlcIiBjbGFzcz1cInBlcC1zcGFjaW5nLWVsZW1lbnRcIj5cbiAgICAgICAgICAgIDxwZXAtaWNvbiBuYW1lPVwic3lzdGVtX211c3RcIj48L3BlcC1pY29uPlxuICAgICAgICA8L21hdC1pY29uPlxuICAgICAgICA8IS0tIEZvciB0aGUgZ3JpZCB0ZW1wbGF0ZSAoKSAtLT5cbiAgICAgICAgPHNwYW4gKm5nSWY9XCIhbWFuZGF0b3J5XCI+PC9zcGFuPlxuICAgIDwvbmctdGVtcGxhdGU+XG4gICAgPG5nLXRlbXBsYXRlICN0aXRsZVRlbXBsYXRlPlxuICAgICAgICA8bWF0LWxhYmVsICpuZ0lmPVwic2hvd1RpdGxlXCIgW3RpdGxlXT1cImxhYmVsXCIgY2xhc3M9XCJib2R5LXt7Zm9udEJvZHlUeXBlfX1cIj5cbiAgICAgICAgICAgIHt7IGxhYmVsIH19XG4gICAgICAgIDwvbWF0LWxhYmVsPlxuICAgICAgICA8IS0tIEZvciB0aGUgZ3JpZCB0ZW1wbGF0ZSAoKSAtLT5cbiAgICAgICAgPHNwYW4gKm5nSWY9XCIhc2hvd1RpdGxlXCI+PC9zcGFuPlxuICAgIDwvbmctdGVtcGxhdGU+XG4gICAgPG5nLXRlbXBsYXRlICNoaW50VGVtcGxhdGU+XG4gICAgICAgIDxzcGFuIGNsYXNzPVwiYm9keS17e2ZvbnRCb2R5VHlwZX19IGNvbG9yLWRpbW1lZFwiPlxuICAgICAgICAgICAgPG5nLWNvbnRhaW5lciAqbmdJZj1cImhpbnQ/Lmxlbmd0aCA+IDAgdGhlbiBoaW50VGV4dFRlbXBsYXRlIGVsc2UgbWF4Q2hhcmFjdGVyc1RlbXBsYXRlXCI+PC9uZy1jb250YWluZXI+XG4gICAgICAgICAgICA8bmctdGVtcGxhdGUgI2hpbnRUZXh0VGVtcGxhdGU+XG4gICAgICAgICAgICAgICAgJm5ic3A7e3sgaGludCB9fVxuICAgICAgICAgICAgPC9uZy10ZW1wbGF0ZT5cbiAgICAgICAgICAgIDxuZy10ZW1wbGF0ZSAjbWF4Q2hhcmFjdGVyc1RlbXBsYXRlPlxuICAgICAgICAgICAgICAgIDxuZy1jb250YWluZXIgKm5nSWY9XCJtYXhGaWVsZENoYXJhY3RlcnMgPiAwXCI+XG4gICAgICAgICAgICAgICAgICAgICZuYnNwO3t7IGlucHV0TGVuZ3RoIHx8IDAgfX0ve3sgbWF4RmllbGRDaGFyYWN0ZXJzIH19XG4gICAgICAgICAgICAgICAgPC9uZy1jb250YWluZXI+XG4gICAgICAgICAgICA8L25nLXRlbXBsYXRlPlxuICAgICAgICA8L3NwYW4+XG4gICAgPC9uZy10ZW1wbGF0ZT5cbjwvZGl2PiJdfQ==