coer-elements 0.0.34 → 0.0.36

package/components/lib/coer-list/coer-list.component.d.ts

@@ -3,26 +3,32 @@ import * as i0 from "@angular/core";
 export declare class CoerList<T> {
     dataSource: import("@angular/core").InputSignal<T[]>;
     propDisplay: import("@angular/core").InputSignal<string>;
-    showDeleteButton: import("@angular/core").InputSignal<boolean>;
-    showGoButton: import("@angular/core").InputSignal<boolean>;
+    showDeleteButton: import("@angular/core").InputSignal<boolean | ((item: T, index: number) => boolean)>;
+    showGoButton: import("@angular/core").InputSignal<boolean | ((item: T, index: number) => boolean)>;
     isLoading: import("@angular/core").InputSignal<boolean>;
     isDraggable: import("@angular/core").InputSignal<boolean>;
+    template: import("@angular/core").InputSignal<((item: T, index: number) => string) | null>;
     onDrop: import("@angular/core").OutputEmitterRef<T>;
     onSort: import("@angular/core").OutputEmitterRef<T[]>;
     onClick: import("@angular/core").OutputEmitterRef<T>;
     onDoubleClick: import("@angular/core").OutputEmitterRef<T>;
     onClickDelete: import("@angular/core").OutputEmitterRef<T>;
     onClickGo: import("@angular/core").OutputEmitterRef<T>;
-    protected _dataSource: import("@angular/core").Signal<any[]>;
+    protected _dataSource: import("@angular/core").Signal<T[]>;
     protected _isDraggable: import("@angular/core").Signal<boolean>;
-    protected _showDeleteButton: import("@angular/core").Signal<boolean>;
-    protected _showGoButton: import("@angular/core").Signal<boolean>;
+    protected _hasTemplate: import("@angular/core").Signal<boolean>;
     /** */
     protected GetDisplay: (item: any) => string;
     /** */
     protected GetIndexRow: (item: any) => number;
     /** */
+    protected GetTemplate(item: any): string;
+    /** */
+    protected _showDeleteButton: (item: any) => boolean;
+    /** */
+    protected _showGoButton: (item: any) => boolean;
+    /** */
     protected Drop(event: CdkDragDrop<T[]>): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<CoerList<any>, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<CoerList<any>, "coer-list", never, { "dataSource": { "alias": "dataSource"; "required": false; "isSignal": true; }; "propDisplay": { "alias": "propDisplay"; "required": false; "isSignal": true; }; "showDeleteButton": { "alias": "showDeleteButton"; "required": false; "isSignal": true; }; "showGoButton": { "alias": "showGoButton"; "required": false; "isSignal": true; }; "isLoading": { "alias": "isLoading"; "required": false; "isSignal": true; }; "isDraggable": { "alias": "isDraggable"; "required": false; "isSignal": true; }; }, { "onDrop": "onDrop"; "onSort": "onSort"; "onClick": "onClick"; "onDoubleClick": "onDoubleClick"; "onClickDelete": "onClickDelete"; "onClickGo": "onClickGo"; }, never, never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CoerList<any>, "coer-list", never, { "dataSource": { "alias": "dataSource"; "required": false; "isSignal": true; }; "propDisplay": { "alias": "propDisplay"; "required": false; "isSignal": true; }; "showDeleteButton": { "alias": "showDeleteButton"; "required": false; "isSignal": true; }; "showGoButton": { "alias": "showGoButton"; "required": false; "isSignal": true; }; "isLoading": { "alias": "isLoading"; "required": false; "isSignal": true; }; "isDraggable": { "alias": "isDraggable"; "required": false; "isSignal": true; }; "template": { "alias": "template"; "required": false; "isSignal": true; }; }, { "onDrop": "onDrop"; "onSort": "onSort"; "onClick": "onClick"; "onDoubleClick": "onDoubleClick"; "onClickDelete": "onClickDelete"; "onClickGo": "onClickGo"; }, never, never, false, never>;
 }

package/esm2022/components/lib/coer-list/coer-list.component.mjs

@@ -4,6 +4,7 @@ import * as i0 from "@angular/core";
 import * as i1 from "@angular/common";
 import * as i2 from "@angular/cdk/drag-drop";
 import * as i3 from "../coer-button/coer-button.component";
+import * as i4 from "coer-elements/pipes";
 export class CoerList {
     constructor() {
         //Inputs
@@ -13,6 +14,7 @@ export class CoerList {
         this.showGoButton = input(false);
         this.isLoading = input(false);
         this.isDraggable = input(false);
+        this.template = input(null);
         //Outputs
         this.onDrop = output();
         this.onSort = output();
@@ -31,12 +33,8 @@ export class CoerList {
             return this.isDraggable() && !this.isLoading();
         });
         //computed
-        this._showDeleteButton = computed(() => {
-            return this.showDeleteButton() && !this.isLoading();
-        });
-        //computed
-        this._showGoButton = computed(() => {
-            return this.showGoButton() && !this.isLoading();
+        this._hasTemplate = computed(() => {
+            return typeof this.template() == 'function';
         });
         /** */
         this.GetDisplay = (item) => {
@@ -46,6 +44,24 @@ export class CoerList {
         this.GetIndexRow = (item) => {
             return item['index'];
         };
+        /** */
+        this._showDeleteButton = (item) => {
+            const showButton = this.showDeleteButton();
+            return (typeof showButton === 'boolean')
+                ? showButton && !this.isLoading()
+                : showButton(item, item.index) === true && !this.isLoading();
+        };
+        /** */
+        this._showGoButton = (item) => {
+            const showButton = this.showGoButton();
+            return (typeof showButton === 'boolean')
+                ? showButton && !this.isLoading()
+                : showButton(item, item.index) === true && !this.isLoading();
+        };
+    }
+    /** */
+    GetTemplate(item) {
+        return this.template()(item, item.index);
     }
     /** */
     Drop(event) {
@@ -58,10 +74,10 @@ export class CoerList {
         this.onDrop.emit(item);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CoerList, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: CoerList, selector: "coer-list", inputs: { dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: true, isRequired: false, transformFunction: null }, propDisplay: { classPropertyName: "propDisplay", publicName: "propDisplay", isSignal: true, isRequired: false, transformFunction: null }, showDeleteButton: { classPropertyName: "showDeleteButton", publicName: "showDeleteButton", isSignal: true, isRequired: false, transformFunction: null }, showGoButton: { classPropertyName: "showGoButton", publicName: "showGoButton", isSignal: true, isRequired: false, transformFunction: null }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: false, transformFunction: null }, isDraggable: { classPropertyName: "isDraggable", publicName: "isDraggable", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onDrop: "onDrop", onSort: "onSort", onClick: "onClick", onDoubleClick: "onDoubleClick", onClickDelete: "onClickDelete", onClickGo: "onClickGo" }, ngImport: i0, template: "<div class=\"coer-list\">\r\n  <ul cdkDropList (cdkDropListDropped)=\"Drop($event)\" class=\"list-group coer-list\">\r\n    @for (item of _dataSource(); track GetIndexRow(item)) {\r\n      <li cdkDrag \r\n        class=\"list-group-item coer-list-box\" \r\n        cdkDragBoundary=\"ul.coer-list\"\r\n        (click)=\"onClick.emit(item)\" \r\n        (dblclick)=\"onDoubleClick.emit(item)\">\r\n\r\n        <div *cdkDragPlaceholder class=\"coer-list-placeholder cursor-grabbing\"></div>\r\n        <div class=\"coer-list-content\"> \r\n          <span> {{ GetDisplay(item) }} </span> \r\n          \r\n          @if(true) {\r\n            <div>\r\n              @if(_showDeleteButton()) {\r\n                <coer-button\r\n                  type=\"icon-no-border\"\r\n                  color=\"secondary\"\r\n                  icon=\"delete\"      \r\n                  (onClick)=\"onClickDelete.emit(item)\"\r\n                ></coer-button>\r\n              } \r\n\r\n              @if(_showGoButton()) {\r\n                <coer-button\r\n                  type=\"icon-no-border\"\r\n                  color=\"secondary\"\r\n                  icon=\"go\"   \r\n                  marginLeft=\"5px\"   \r\n                  (onClick)=\"onClickGo.emit(item)\"\r\n                ></coer-button>\r\n              } \r\n               \r\n              <i cdkDragHandle [ngClass]=\"{ \r\n                'fa-solid fa-grip-vertical text-secondary ps-2': true,\r\n                'cursor-grab': true, \r\n                'cursor-grabbing': false, \r\n                'd-none': !_isDraggable()\r\n                }\"\r\n              ></i>               \r\n            </div>\r\n          }\r\n        </div>  \r\n      </li> \r\n    } \r\n  </ul>\r\n</div>", styles: ["div.coer-list ul.coer-list{width:100%;border:solid 1px #ccc;display:block;background:#fff;border-radius:4px;overflow:hidden}div.coer-list li.coer-list-box{padding:10px;border-bottom:solid 1px #ccc;color:#000000de;display:flex;flex-direction:row;align-items:center;justify-content:space-between;box-sizing:border-box;background:#fff;font-size:14px}div.coer-list li.coer-list-box div.coer-list-content{width:100%;display:flex;align-items:center;justify-content:space-between}div.coer-list .cdk-drag-preview{box-sizing:border-box;border-radius:4px;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}div.coer-list .cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}div.coer-list .coer-list-box:last-child{border:none}div.coer-list .coer-list.cdk-drop-list-dragging .coer-list-box:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}div.coer-list div.coer-list-placeholder{background:#ccc;border:dotted 3px #999;min-height:40px;transition:transform .25s cubic-bezier(0,0,.2,1)}div.coer-list div.cdk-drag-placeholder,div.coer-list ul.cdk-drop-list-dragging,div.coer-list ul.cdk-drop-list-dragging *{cursor:grabbing}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.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: i2.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "directive", type: i2.CdkDragPlaceholder, selector: "ng-template[cdkDragPlaceholder]", inputs: ["data"] }, { kind: "directive", type: i2.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: "component", type: i3.CoerButton, selector: "coer-button", inputs: ["id", "color", "type", "icon", "iconPosition", "animation", "isLoading", "isDisabled", "isInvisible", "width", "minWidth", "height", "minHeight", "marginTop", "marginRight", "marginBottom", "marginLeft", "path", "tooltipPosition", "tooltip"], outputs: ["onClick"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: CoerList, selector: "coer-list", inputs: { dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: true, isRequired: false, transformFunction: null }, propDisplay: { classPropertyName: "propDisplay", publicName: "propDisplay", isSignal: true, isRequired: false, transformFunction: null }, showDeleteButton: { classPropertyName: "showDeleteButton", publicName: "showDeleteButton", isSignal: true, isRequired: false, transformFunction: null }, showGoButton: { classPropertyName: "showGoButton", publicName: "showGoButton", isSignal: true, isRequired: false, transformFunction: null }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: false, transformFunction: null }, isDraggable: { classPropertyName: "isDraggable", publicName: "isDraggable", isSignal: true, isRequired: false, transformFunction: null }, template: { classPropertyName: "template", publicName: "template", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onDrop: "onDrop", onSort: "onSort", onClick: "onClick", onDoubleClick: "onDoubleClick", onClickDelete: "onClickDelete", onClickGo: "onClickGo" }, ngImport: i0, template: "<div class=\"coer-list\">\r\n  <ul cdkDropList (cdkDropListDropped)=\"Drop($event)\" class=\"list-group coer-list\">\r\n    @for (item of _dataSource(); track GetIndexRow(item)) {\r\n      <li cdkDrag \r\n        class=\"list-group-item coer-list-box\" \r\n        cdkDragBoundary=\"ul.coer-list\"\r\n        (click)=\"onClick.emit(item)\" \r\n        (dblclick)=\"onDoubleClick.emit(item)\">\r\n\r\n        <div *cdkDragPlaceholder class=\"coer-list-placeholder cursor-grabbing\"></div>\r\n        <div class=\"coer-list-content\"> \r\n          @if(_hasTemplate()) {\r\n            <div [innerHTML]=\"GetTemplate(item) | html\" class=\"template\"></div>\r\n          }\r\n\r\n          @else {\r\n            <div> {{ GetDisplay(item) }} </div> \r\n          }\r\n           \r\n          @if(true) {\r\n            <div>\r\n              @if(_showDeleteButton(item)) {\r\n                <coer-button\r\n                  type=\"icon-no-border\"\r\n                  color=\"secondary\"\r\n                  icon=\"delete\"      \r\n                  (onClick)=\"onClickDelete.emit(item)\"\r\n                ></coer-button>\r\n              } \r\n\r\n              @if(_showGoButton(item)) {\r\n                <coer-button\r\n                  type=\"icon-no-border\"\r\n                  color=\"secondary\"\r\n                  icon=\"go\"   \r\n                  marginLeft=\"5px\"   \r\n                  (onClick)=\"onClickGo.emit(item)\"\r\n                ></coer-button>\r\n              } \r\n               \r\n              <i cdkDragHandle [ngClass]=\"{ \r\n                'fa-solid fa-grip-vertical text-secondary ps-2': true,\r\n                'cursor-grab': true, \r\n                'cursor-grabbing': false, \r\n                'd-none': !_isDraggable()\r\n                }\"\r\n              ></i>               \r\n            </div>\r\n          }\r\n        </div>  \r\n      </li> \r\n    } \r\n  </ul>\r\n</div>", styles: ["div.coer-list ul.coer-list{width:100%;border:solid 1px #ccc;display:block;background:#fff;border-radius:4px;overflow:hidden}div.coer-list li.coer-list-box{padding:10px;border-bottom:solid 1px #ccc;color:#000000de;display:flex;flex-direction:row;align-items:center;justify-content:space-between;box-sizing:border-box;background:#fff;font-size:14px}div.coer-list li.coer-list-box div.coer-list-content{width:100%;display:flex;align-items:center;justify-content:space-between}div.coer-list .cdk-drag-preview{box-sizing:border-box;border-radius:4px;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}div.coer-list .cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}div.coer-list .coer-list-box:last-child{border:none}div.coer-list .coer-list.cdk-drop-list-dragging .coer-list-box:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}div.coer-list div.coer-list-placeholder{background:#ccc;border:dotted 3px #999;min-height:40px;transition:transform .25s cubic-bezier(0,0,.2,1)}div.coer-list div.cdk-drag-placeholder,div.coer-list ul.cdk-drop-list-dragging,div.coer-list ul.cdk-drop-list-dragging *{cursor:grabbing}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.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: i2.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "directive", type: i2.CdkDragPlaceholder, selector: "ng-template[cdkDragPlaceholder]", inputs: ["data"] }, { kind: "directive", type: i2.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: "component", type: i3.CoerButton, selector: "coer-button", inputs: ["id", "color", "type", "icon", "iconPosition", "animation", "isLoading", "isDisabled", "isInvisible", "width", "minWidth", "height", "minHeight", "marginTop", "marginRight", "marginBottom", "marginLeft", "path", "tooltipPosition", "tooltip"], outputs: ["onClick"] }, { kind: "pipe", type: i4.HtmlPipe, name: "html" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CoerList, decorators: [{
             type: Component,
-            args: [{ selector: 'coer-list', template: "<div class=\"coer-list\">\r\n  <ul cdkDropList (cdkDropListDropped)=\"Drop($event)\" class=\"list-group coer-list\">\r\n    @for (item of _dataSource(); track GetIndexRow(item)) {\r\n      <li cdkDrag \r\n        class=\"list-group-item coer-list-box\" \r\n        cdkDragBoundary=\"ul.coer-list\"\r\n        (click)=\"onClick.emit(item)\" \r\n        (dblclick)=\"onDoubleClick.emit(item)\">\r\n\r\n        <div *cdkDragPlaceholder class=\"coer-list-placeholder cursor-grabbing\"></div>\r\n        <div class=\"coer-list-content\"> \r\n          <span> {{ GetDisplay(item) }} </span> \r\n          \r\n          @if(true) {\r\n            <div>\r\n              @if(_showDeleteButton()) {\r\n                <coer-button\r\n                  type=\"icon-no-border\"\r\n                  color=\"secondary\"\r\n                  icon=\"delete\"      \r\n                  (onClick)=\"onClickDelete.emit(item)\"\r\n                ></coer-button>\r\n              } \r\n\r\n              @if(_showGoButton()) {\r\n                <coer-button\r\n                  type=\"icon-no-border\"\r\n                  color=\"secondary\"\r\n                  icon=\"go\"   \r\n                  marginLeft=\"5px\"   \r\n                  (onClick)=\"onClickGo.emit(item)\"\r\n                ></coer-button>\r\n              } \r\n               \r\n              <i cdkDragHandle [ngClass]=\"{ \r\n                'fa-solid fa-grip-vertical text-secondary ps-2': true,\r\n                'cursor-grab': true, \r\n                'cursor-grabbing': false, \r\n                'd-none': !_isDraggable()\r\n                }\"\r\n              ></i>               \r\n            </div>\r\n          }\r\n        </div>  \r\n      </li> \r\n    } \r\n  </ul>\r\n</div>", styles: ["div.coer-list ul.coer-list{width:100%;border:solid 1px #ccc;display:block;background:#fff;border-radius:4px;overflow:hidden}div.coer-list li.coer-list-box{padding:10px;border-bottom:solid 1px #ccc;color:#000000de;display:flex;flex-direction:row;align-items:center;justify-content:space-between;box-sizing:border-box;background:#fff;font-size:14px}div.coer-list li.coer-list-box div.coer-list-content{width:100%;display:flex;align-items:center;justify-content:space-between}div.coer-list .cdk-drag-preview{box-sizing:border-box;border-radius:4px;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}div.coer-list .cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}div.coer-list .coer-list-box:last-child{border:none}div.coer-list .coer-list.cdk-drop-list-dragging .coer-list-box:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}div.coer-list div.coer-list-placeholder{background:#ccc;border:dotted 3px #999;min-height:40px;transition:transform .25s cubic-bezier(0,0,.2,1)}div.coer-list div.cdk-drag-placeholder,div.coer-list ul.cdk-drop-list-dragging,div.coer-list ul.cdk-drop-list-dragging *{cursor:grabbing}\n"] }]
+            args: [{ selector: 'coer-list', template: "<div class=\"coer-list\">\r\n  <ul cdkDropList (cdkDropListDropped)=\"Drop($event)\" class=\"list-group coer-list\">\r\n    @for (item of _dataSource(); track GetIndexRow(item)) {\r\n      <li cdkDrag \r\n        class=\"list-group-item coer-list-box\" \r\n        cdkDragBoundary=\"ul.coer-list\"\r\n        (click)=\"onClick.emit(item)\" \r\n        (dblclick)=\"onDoubleClick.emit(item)\">\r\n\r\n        <div *cdkDragPlaceholder class=\"coer-list-placeholder cursor-grabbing\"></div>\r\n        <div class=\"coer-list-content\"> \r\n          @if(_hasTemplate()) {\r\n            <div [innerHTML]=\"GetTemplate(item) | html\" class=\"template\"></div>\r\n          }\r\n\r\n          @else {\r\n            <div> {{ GetDisplay(item) }} </div> \r\n          }\r\n           \r\n          @if(true) {\r\n            <div>\r\n              @if(_showDeleteButton(item)) {\r\n                <coer-button\r\n                  type=\"icon-no-border\"\r\n                  color=\"secondary\"\r\n                  icon=\"delete\"      \r\n                  (onClick)=\"onClickDelete.emit(item)\"\r\n                ></coer-button>\r\n              } \r\n\r\n              @if(_showGoButton(item)) {\r\n                <coer-button\r\n                  type=\"icon-no-border\"\r\n                  color=\"secondary\"\r\n                  icon=\"go\"   \r\n                  marginLeft=\"5px\"   \r\n                  (onClick)=\"onClickGo.emit(item)\"\r\n                ></coer-button>\r\n              } \r\n               \r\n              <i cdkDragHandle [ngClass]=\"{ \r\n                'fa-solid fa-grip-vertical text-secondary ps-2': true,\r\n                'cursor-grab': true, \r\n                'cursor-grabbing': false, \r\n                'd-none': !_isDraggable()\r\n                }\"\r\n              ></i>               \r\n            </div>\r\n          }\r\n        </div>  \r\n      </li> \r\n    } \r\n  </ul>\r\n</div>", styles: ["div.coer-list ul.coer-list{width:100%;border:solid 1px #ccc;display:block;background:#fff;border-radius:4px;overflow:hidden}div.coer-list li.coer-list-box{padding:10px;border-bottom:solid 1px #ccc;color:#000000de;display:flex;flex-direction:row;align-items:center;justify-content:space-between;box-sizing:border-box;background:#fff;font-size:14px}div.coer-list li.coer-list-box div.coer-list-content{width:100%;display:flex;align-items:center;justify-content:space-between}div.coer-list .cdk-drag-preview{box-sizing:border-box;border-radius:4px;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}div.coer-list .cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}div.coer-list .coer-list-box:last-child{border:none}div.coer-list .coer-list.cdk-drop-list-dragging .coer-list-box:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}div.coer-list div.coer-list-placeholder{background:#ccc;border:dotted 3px #999;min-height:40px;transition:transform .25s cubic-bezier(0,0,.2,1)}div.coer-list div.cdk-drag-placeholder,div.coer-list ul.cdk-drop-list-dragging,div.coer-list ul.cdk-drop-list-dragging *{cursor:grabbing}\n"] }]
         }] });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY29lci1saXN0LmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2NvZXItZWxlbWVudHMvY29tcG9uZW50cy9saWIvY29lci1saXN0L2NvZXItbGlzdC5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9jb2VyLWVsZW1lbnRzL2NvbXBvbmVudHMvbGliL2NvZXItbGlzdC9jb2VyLWxpc3QuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQ0EsT0FBTyxFQUFpQixTQUFTLEVBQUUsUUFBUSxFQUFFLEtBQUssRUFBRSxNQUFNLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDbEYsT0FBTyxFQUFFLEtBQUssRUFBRSxNQUFNLHFCQUFxQixDQUFDOzs7OztBQU81QyxNQUFNLE9BQU8sUUFBUTtJQUxyQjtRQU9JLFFBQVE7UUFDRCxlQUFVLEdBQUcsS0FBSyxDQUFNLEVBQUUsQ0FBQyxDQUFDO1FBQzVCLGdCQUFXLEdBQUcsS0FBSyxDQUFTLE1BQU0sQ0FBQyxDQUFDO1FBQ3BDLHFCQUFnQixHQUFHLEtBQUssQ0FBVSxLQUFLLENBQUMsQ0FBQztRQUN6QyxpQkFBWSxHQUFHLEtBQUssQ0FBVSxLQUFLLENBQUMsQ0FBQztRQUNyQyxjQUFTLEdBQUcsS0FBSyxDQUFVLEtBQUssQ0FBQyxDQUFDO1FBQ2xDLGdCQUFXLEdBQUcsS0FBSyxDQUFVLEtBQUssQ0FBQyxDQUFDO1FBRTNDLFNBQVM7UUFDRixXQUFNLEdBQUcsTUFBTSxFQUFLLENBQUM7UUFDckIsV0FBTSxHQUFHLE1BQU0sRUFBTyxDQUFDO1FBQ3ZCLFlBQU8sR0FBRyxNQUFNLEVBQUssQ0FBQztRQUN0QixrQkFBYSxHQUFHLE1BQU0sRUFBSyxDQUFDO1FBQzVCLGtCQUFhLEdBQUcsTUFBTSxFQUFLLENBQUM7UUFDNUIsY0FBUyxHQUFHLE1BQU0sRUFBSyxDQUFDO1FBRS9CLFVBQVU7UUFDQSxnQkFBVyxHQUFHLFFBQVEsQ0FBQyxHQUFHLEVBQUU7WUFDbEMsSUFBSSxLQUFLLEdBQUcsQ0FBQyxDQUFDO1lBQ2QsT0FBTyxLQUFLLENBQUMsY0FBYyxDQUFDLElBQUksQ0FBQyxVQUFVLEVBQUUsQ0FBQztpQkFDekMsR0FBRyxDQUFDLENBQUMsSUFBUyxFQUFFLEVBQUUsQ0FBQyxNQUFNLENBQUMsTUFBTSxDQUFDLElBQUksRUFBRSxFQUFFLEtBQUssRUFBRSxLQUFLLEVBQUUsRUFBRSxDQUFDLENBQUMsQ0FBQztRQUNyRSxDQUFDLENBQUMsQ0FBQztRQUdILFVBQVU7UUFDQSxpQkFBWSxHQUFHLFFBQVEsQ0FBQyxHQUFHLEVBQUU7WUFDbkMsT0FBTyxJQUFJLENBQUMsV0FBVyxFQUFFLElBQUksQ0FBQyxJQUFJLENBQUMsU0FBUyxFQUFFLENBQUM7UUFDbkQsQ0FBQyxDQUFDLENBQUM7UUFHSCxVQUFVO1FBQ0Esc0JBQWlCLEdBQUcsUUFBUSxDQUFDLEdBQUcsRUFBRTtZQUN4QyxPQUFPLElBQUksQ0FBQyxnQkFBZ0IsRUFBRSxJQUFJLENBQUMsSUFBSSxDQUFDLFNBQVMsRUFBRSxDQUFDO1FBQ3hELENBQUMsQ0FBQyxDQUFDO1FBR0gsVUFBVTtRQUNBLGtCQUFhLEdBQUcsUUFBUSxDQUFDLEdBQUcsRUFBRTtZQUNwQyxPQUFPLElBQUksQ0FBQyxZQUFZLEVBQUUsSUFBSSxDQUFDLElBQUksQ0FBQyxTQUFTLEVBQUUsQ0FBQztRQUNwRCxDQUFDLENBQUMsQ0FBQztRQUdILE1BQU07UUFDSSxlQUFVLEdBQUcsQ0FBQyxJQUFTLEVBQVUsRUFBRTtZQUN6QyxPQUFPLEtBQUssQ0FBQyxTQUFTLENBQUMsSUFBSSxDQUFDLENBQUMsQ0FBQyxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsV0FBVyxFQUFFLENBQUMsQ0FBQyxDQUFDLENBQUMsRUFBRSxDQUFDO1FBQ2pFLENBQUMsQ0FBQTtRQUdELE1BQU07UUFDSSxnQkFBVyxHQUFHLENBQUMsSUFBUyxFQUFVLEVBQUU7WUFDMUMsT0FBTyxJQUFJLENBQUMsT0FBTyxDQUFDLENBQUM7UUFDekIsQ0FBQyxDQUFBO0tBYUo7SUFWRyxNQUFNO0lBQ0ksSUFBSSxDQUFDLEtBQXVCO1FBQ2xDLE1BQU0sRUFBRSxhQUFhLEVBQUUsWUFBWSxFQUFFLEdBQUcsS0FBSyxDQUFDO1FBQzlDLElBQUksVUFBVSxHQUFHLEtBQUssQ0FBQyxjQUFjLENBQUMsSUFBSSxDQUFDLFVBQVUsRUFBRSxDQUFDLENBQUM7UUFDekQsTUFBTSxJQUFJLEdBQUcsS0FBSyxDQUFDLGNBQWMsQ0FBQyxVQUFVLENBQUMsYUFBYSxDQUFDLENBQUMsQ0FBQztRQUM3RCxVQUFVLENBQUMsTUFBTSxDQUFDLGFBQWEsRUFBRSxDQUFDLENBQUMsQ0FBQztRQUNwQyxVQUFVLENBQUMsTUFBTSxDQUFDLFlBQVksRUFBRSxDQUFDLEVBQUUsSUFBSSxDQUFDLENBQUM7UUFDekMsSUFBSSxDQUFDLE1BQU0sQ0FBQyxJQUFJLENBQUMsVUFBVSxDQUFDLENBQUM7UUFDN0IsSUFBSSxDQUFDLE1BQU0sQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLENBQUM7SUFDM0IsQ0FBQzsrR0FqRVEsUUFBUTttR0FBUixRQUFRLCtoQ0NUckIsOHREQStDTTs7NEZEdENPLFFBQVE7a0JBTHBCLFNBQVM7K0JBQ0ksV0FBVyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENka0RyYWdEcm9wIH0gZnJvbSAnQGFuZ3VsYXIvY2RrL2RyYWctZHJvcCc7XHJcbmltcG9ydCB7IEFmdGVyVmlld0luaXQsIENvbXBvbmVudCwgY29tcHV0ZWQsIGlucHV0LCBvdXRwdXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJzsgXHJcbmltcG9ydCB7IFRvb2xzIH0gZnJvbSAnY29lci1lbGVtZW50cy90b29scyc7XHJcblxyXG5AQ29tcG9uZW50KHtcclxuICAgIHNlbGVjdG9yOiAnY29lci1saXN0JyxcclxuICAgIHRlbXBsYXRlVXJsOiAnLi9jb2VyLWxpc3QuY29tcG9uZW50Lmh0bWwnLFxyXG4gICAgc3R5bGVVcmw6ICcuL2NvZXItbGlzdC5jb21wb25lbnQuc2NzcycsXHJcbn0pXHJcbmV4cG9ydCBjbGFzcyBDb2VyTGlzdDxUPiB7IFxyXG5cclxuICAgIC8vSW5wdXRzXHJcbiAgICBwdWJsaWMgZGF0YVNvdXJjZSA9IGlucHV0PFRbXT4oW10pO1xyXG4gICAgcHVibGljIHByb3BEaXNwbGF5ID0gaW5wdXQ8c3RyaW5nPignbmFtZScpO1xyXG4gICAgcHVibGljIHNob3dEZWxldGVCdXR0b24gPSBpbnB1dDxib29sZWFuPihmYWxzZSk7XHJcbiAgICBwdWJsaWMgc2hvd0dvQnV0dG9uID0gaW5wdXQ8Ym9vbGVhbj4oZmFsc2UpO1xyXG4gICAgcHVibGljIGlzTG9hZGluZyA9IGlucHV0PGJvb2xlYW4+KGZhbHNlKTtcclxuICAgIHB1YmxpYyBpc0RyYWdnYWJsZSA9IGlucHV0PGJvb2xlYW4+KGZhbHNlKTtcclxuXHJcbiAgICAvL091dHB1dHNcclxuICAgIHB1YmxpYyBvbkRyb3AgPSBvdXRwdXQ8VD4oKTsgXHJcbiAgICBwdWJsaWMgb25Tb3J0ID0gb3V0cHV0PFRbXT4oKTsgXHJcbiAgICBwdWJsaWMgb25DbGljayA9IG91dHB1dDxUPigpO1xyXG4gICAgcHVibGljIG9uRG91YmxlQ2xpY2sgPSBvdXRwdXQ8VD4oKTtcclxuICAgIHB1YmxpYyBvbkNsaWNrRGVsZXRlID0gb3V0cHV0PFQ+KCk7XHJcbiAgICBwdWJsaWMgb25DbGlja0dvID0gb3V0cHV0PFQ+KCk7XHJcblxyXG4gICAgLy9jb21wdXRlZFxyXG4gICAgcHJvdGVjdGVkIF9kYXRhU291cmNlID0gY29tcHV0ZWQoKCkgPT4ge1xyXG4gICAgICAgIGxldCBpbmRleCA9IDA7ICAgICAgICBcclxuICAgICAgICByZXR1cm4gVG9vbHMuQnJlYWtSZWZlcmVuY2UodGhpcy5kYXRhU291cmNlKCkpXHJcbiAgICAgICAgICAgIC5tYXAoKGl0ZW06IGFueSkgPT4gT2JqZWN0LmFzc2lnbihpdGVtLCB7IGluZGV4OiBpbmRleCsrIH0pKTtcclxuICAgIH0pO1xyXG5cclxuXHJcbiAgICAvL2NvbXB1dGVkXHJcbiAgICBwcm90ZWN0ZWQgX2lzRHJhZ2dhYmxlID0gY29tcHV0ZWQoKCkgPT4ge1xyXG4gICAgICAgIHJldHVybiB0aGlzLmlzRHJhZ2dhYmxlKCkgJiYgIXRoaXMuaXNMb2FkaW5nKCk7XHJcbiAgICB9KTtcclxuXHJcblxyXG4gICAgLy9jb21wdXRlZFxyXG4gICAgcHJvdGVjdGVkIF9zaG93RGVsZXRlQnV0dG9uID0gY29tcHV0ZWQoKCkgPT4ge1xyXG4gICAgICAgIHJldHVybiB0aGlzLnNob3dEZWxldGVCdXR0b24oKSAmJiAhdGhpcy5pc0xvYWRpbmcoKTtcclxuICAgIH0pO1xyXG5cclxuXHJcbiAgICAvL2NvbXB1dGVkXHJcbiAgICBwcm90ZWN0ZWQgX3Nob3dHb0J1dHRvbiA9IGNvbXB1dGVkKCgpID0+IHtcclxuICAgICAgICByZXR1cm4gdGhpcy5zaG93R29CdXR0b24oKSAmJiAhdGhpcy5pc0xvYWRpbmcoKTtcclxuICAgIH0pO1xyXG5cclxuXHJcbiAgICAvKiogKi9cclxuICAgIHByb3RlY3RlZCBHZXREaXNwbGF5ID0gKGl0ZW06IGFueSk6IHN0cmluZyA9PiB7XHJcbiAgICAgICAgcmV0dXJuIFRvb2xzLklzTm90TnVsbChpdGVtKSA/IGl0ZW1bdGhpcy5wcm9wRGlzcGxheSgpXSA6ICcnO1xyXG4gICAgfVxyXG5cclxuXHJcbiAgICAvKiogKi9cclxuICAgIHByb3RlY3RlZCBHZXRJbmRleFJvdyA9IChpdGVtOiBhbnkpOiBudW1iZXIgPT4ge1xyXG4gICAgICAgIHJldHVybiBpdGVtWydpbmRleCddO1xyXG4gICAgfVxyXG5cclxuXHJcbiAgICAvKiogKi9cclxuICAgIHByb3RlY3RlZCBEcm9wKGV2ZW50OiBDZGtEcmFnRHJvcDxUW10+KTogdm9pZCB7XHJcbiAgICAgICAgY29uc3QgeyBwcmV2aW91c0luZGV4LCBjdXJyZW50SW5kZXggfSA9IGV2ZW50OyAgICAgICAgXHJcbiAgICAgICAgbGV0IGRhdGFTb3VyY2UgPSBUb29scy5CcmVha1JlZmVyZW5jZSh0aGlzLmRhdGFTb3VyY2UoKSk7XHJcbiAgICAgICAgY29uc3QgaXRlbSA9IFRvb2xzLkJyZWFrUmVmZXJlbmNlKGRhdGFTb3VyY2VbcHJldmlvdXNJbmRleF0pO1xyXG4gICAgICAgIGRhdGFTb3VyY2Uuc3BsaWNlKHByZXZpb3VzSW5kZXgsIDEpO1xyXG4gICAgICAgIGRhdGFTb3VyY2Uuc3BsaWNlKGN1cnJlbnRJbmRleCwgMCwgaXRlbSk7IFxyXG4gICAgICAgIHRoaXMub25Tb3J0LmVtaXQoZGF0YVNvdXJjZSk7XHJcbiAgICAgICAgdGhpcy5vbkRyb3AuZW1pdChpdGVtKTtcclxuICAgIH1cclxufSIsIjxkaXYgY2xhc3M9XCJjb2VyLWxpc3RcIj5cclxuICA8dWwgY2RrRHJvcExpc3QgKGNka0Ryb3BMaXN0RHJvcHBlZCk9XCJEcm9wKCRldmVudClcIiBjbGFzcz1cImxpc3QtZ3JvdXAgY29lci1saXN0XCI+XHJcbiAgICBAZm9yIChpdGVtIG9mIF9kYXRhU291cmNlKCk7IHRyYWNrIEdldEluZGV4Um93KGl0ZW0pKSB7XHJcbiAgICAgIDxsaSBjZGtEcmFnIFxyXG4gICAgICAgIGNsYXNzPVwibGlzdC1ncm91cC1pdGVtIGNvZXItbGlzdC1ib3hcIiBcclxuICAgICAgICBjZGtEcmFnQm91bmRhcnk9XCJ1bC5jb2VyLWxpc3RcIlxyXG4gICAgICAgIChjbGljayk9XCJvbkNsaWNrLmVtaXQoaXRlbSlcIiBcclxuICAgICAgICAoZGJsY2xpY2spPVwib25Eb3VibGVDbGljay5lbWl0KGl0ZW0pXCI+XHJcblxyXG4gICAgICAgIDxkaXYgKmNka0RyYWdQbGFjZWhvbGRlciBjbGFzcz1cImNvZXItbGlzdC1wbGFjZWhvbGRlciBjdXJzb3ItZ3JhYmJpbmdcIj48L2Rpdj5cclxuICAgICAgICA8ZGl2IGNsYXNzPVwiY29lci1saXN0LWNvbnRlbnRcIj4gXHJcbiAgICAgICAgICA8c3Bhbj4ge3sgR2V0RGlzcGxheShpdGVtKSB9fSA8L3NwYW4+IFxyXG4gICAgICAgICAgXHJcbiAgICAgICAgICBAaWYodHJ1ZSkge1xyXG4gICAgICAgICAgICA8ZGl2PlxyXG4gICAgICAgICAgICAgIEBpZihfc2hvd0RlbGV0ZUJ1dHRvbigpKSB7XHJcbiAgICAgICAgICAgICAgICA8Y29lci1idXR0b25cclxuICAgICAgICAgICAgICAgICAgdHlwZT1cImljb24tbm8tYm9yZGVyXCJcclxuICAgICAgICAgICAgICAgICAgY29sb3I9XCJzZWNvbmRhcnlcIlxyXG4gICAgICAgICAgICAgICAgICBpY29uPVwiZGVsZXRlXCIgICAgICBcclxuICAgICAgICAgICAgICAgICAgKG9uQ2xpY2spPVwib25DbGlja0RlbGV0ZS5lbWl0KGl0ZW0pXCJcclxuICAgICAgICAgICAgICAgID48L2NvZXItYnV0dG9uPlxyXG4gICAgICAgICAgICAgIH0gXHJcblxyXG4gICAgICAgICAgICAgIEBpZihfc2hvd0dvQnV0dG9uKCkpIHtcclxuICAgICAgICAgICAgICAgIDxjb2VyLWJ1dHRvblxyXG4gICAgICAgICAgICAgICAgICB0eXBlPVwiaWNvbi1uby1ib3JkZXJcIlxyXG4gICAgICAgICAgICAgICAgICBjb2xvcj1cInNlY29uZGFyeVwiXHJcbiAgICAgICAgICAgICAgICAgIGljb249XCJnb1wiICAgXHJcbiAgICAgICAgICAgICAgICAgIG1hcmdpbkxlZnQ9XCI1cHhcIiAgIFxyXG4gICAgICAgICAgICAgICAgICAob25DbGljayk9XCJvbkNsaWNrR28uZW1pdChpdGVtKVwiXHJcbiAgICAgICAgICAgICAgICA+PC9jb2VyLWJ1dHRvbj5cclxuICAgICAgICAgICAgICB9IFxyXG4gICAgICAgICAgICAgICBcclxuICAgICAgICAgICAgICA8aSBjZGtEcmFnSGFuZGxlIFtuZ0NsYXNzXT1cInsgXHJcbiAgICAgICAgICAgICAgICAnZmEtc29saWQgZmEtZ3JpcC12ZXJ0aWNhbCB0ZXh0LXNlY29uZGFyeSBwcy0yJzogdHJ1ZSxcclxuICAgICAgICAgICAgICAgICdjdXJzb3ItZ3JhYic6IHRydWUsIFxyXG4gICAgICAgICAgICAgICAgJ2N1cnNvci1ncmFiYmluZyc6IGZhbHNlLCBcclxuICAgICAgICAgICAgICAgICdkLW5vbmUnOiAhX2lzRHJhZ2dhYmxlKClcclxuICAgICAgICAgICAgICAgIH1cIlxyXG4gICAgICAgICAgICAgID48L2k+ICAgICAgICAgICAgICAgXHJcbiAgICAgICAgICAgIDwvZGl2PlxyXG4gICAgICAgICAgfVxyXG4gICAgICAgIDwvZGl2PiAgXHJcbiAgICAgIDwvbGk+IFxyXG4gICAgfSBcclxuICA8L3VsPlxyXG48L2Rpdj4iXX0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY29lci1saXN0LmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2NvZXItZWxlbWVudHMvY29tcG9uZW50cy9saWIvY29lci1saXN0L2NvZXItbGlzdC5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9jb2VyLWVsZW1lbnRzL2NvbXBvbmVudHMvbGliL2NvZXItbGlzdC9jb2VyLWxpc3QuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQ0EsT0FBTyxFQUFpQixTQUFTLEVBQUUsUUFBUSxFQUFFLEtBQUssRUFBRSxNQUFNLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDbEYsT0FBTyxFQUFFLEtBQUssRUFBRSxNQUFNLHFCQUFxQixDQUFDOzs7Ozs7QUFPNUMsTUFBTSxPQUFPLFFBQVE7SUFMckI7UUFPSSxRQUFRO1FBQ0QsZUFBVSxHQUFHLEtBQUssQ0FBTSxFQUFFLENBQUMsQ0FBQztRQUM1QixnQkFBVyxHQUFHLEtBQUssQ0FBUyxNQUFNLENBQUMsQ0FBQztRQUNwQyxxQkFBZ0IsR0FBRyxLQUFLLENBQWtELEtBQUssQ0FBQyxDQUFDO1FBQ2pGLGlCQUFZLEdBQUcsS0FBSyxDQUFrRCxLQUFLLENBQUMsQ0FBQztRQUM3RSxjQUFTLEdBQUcsS0FBSyxDQUFVLEtBQUssQ0FBQyxDQUFDO1FBQ2xDLGdCQUFXLEdBQUcsS0FBSyxDQUFVLEtBQUssQ0FBQyxDQUFDO1FBQ3BDLGFBQVEsR0FBRyxLQUFLLENBQThDLElBQUksQ0FBQyxDQUFDO1FBRTNFLFNBQVM7UUFDRixXQUFNLEdBQUcsTUFBTSxFQUFLLENBQUM7UUFDckIsV0FBTSxHQUFHLE1BQU0sRUFBTyxDQUFDO1FBQ3ZCLFlBQU8sR0FBRyxNQUFNLEVBQUssQ0FBQztRQUN0QixrQkFBYSxHQUFHLE1BQU0sRUFBSyxDQUFDO1FBQzVCLGtCQUFhLEdBQUcsTUFBTSxFQUFLLENBQUM7UUFDNUIsY0FBUyxHQUFHLE1BQU0sRUFBSyxDQUFDO1FBRS9CLFVBQVU7UUFDQSxnQkFBVyxHQUFHLFFBQVEsQ0FBTSxHQUFHLEVBQUU7WUFDdkMsSUFBSSxLQUFLLEdBQUcsQ0FBQyxDQUFDO1lBQ2QsT0FBTyxLQUFLLENBQUMsY0FBYyxDQUFDLElBQUksQ0FBQyxVQUFVLEVBQUUsQ0FBQztpQkFDekMsR0FBRyxDQUFDLENBQUMsSUFBUyxFQUFFLEVBQUUsQ0FBQyxNQUFNLENBQUMsTUFBTSxDQUFDLElBQUksRUFBRSxFQUFFLEtBQUssRUFBRSxLQUFLLEVBQUUsRUFBRSxDQUFDLENBQUMsQ0FBQztRQUNyRSxDQUFDLENBQUMsQ0FBQztRQUdILFVBQVU7UUFDQSxpQkFBWSxHQUFHLFFBQVEsQ0FBVSxHQUFHLEVBQUU7WUFDNUMsT0FBTyxJQUFJLENBQUMsV0FBVyxFQUFFLElBQUksQ0FBQyxJQUFJLENBQUMsU0FBUyxFQUFFLENBQUM7UUFDbkQsQ0FBQyxDQUFDLENBQUM7UUFHSCxVQUFVO1FBQ0EsaUJBQVksR0FBRyxRQUFRLENBQVUsR0FBRyxFQUFFO1lBQzVDLE9BQU8sT0FBTyxJQUFJLENBQUMsUUFBUSxFQUFFLElBQUksVUFBVSxDQUFDO1FBQ2hELENBQUMsQ0FBQyxDQUFDO1FBRUgsTUFBTTtRQUNJLGVBQVUsR0FBRyxDQUFDLElBQVMsRUFBVSxFQUFFO1lBQ3pDLE9BQU8sS0FBSyxDQUFDLFNBQVMsQ0FBQyxJQUFJLENBQUMsQ0FBQyxDQUFDLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxXQUFXLEVBQUUsQ0FBQyxDQUFDLENBQUMsQ0FBQyxFQUFFLENBQUM7UUFDakUsQ0FBQyxDQUFBO1FBR0QsTUFBTTtRQUNJLGdCQUFXLEdBQUcsQ0FBQyxJQUFTLEVBQVUsRUFBRTtZQUMxQyxPQUFPLElBQUksQ0FBQyxPQUFPLENBQUMsQ0FBQztRQUN6QixDQUFDLENBQUE7UUFTRCxNQUFNO1FBQ0ksc0JBQWlCLEdBQUcsQ0FBQyxJQUFTLEVBQVcsRUFBRTtZQUNqRCxNQUFNLFVBQVUsR0FBRyxJQUFJLENBQUMsZ0JBQWdCLEVBQVMsQ0FBQztZQUNsRCxPQUFPLENBQUMsT0FBTyxVQUFVLEtBQUssU0FBUyxDQUFDO2dCQUNwQyxDQUFDLENBQUMsVUFBVSxJQUFJLENBQUMsSUFBSSxDQUFDLFNBQVMsRUFBRTtnQkFDakMsQ0FBQyxDQUFDLFVBQVUsQ0FBQyxJQUFJLEVBQUUsSUFBSSxDQUFDLEtBQUssQ0FBQyxLQUFLLElBQUksSUFBSSxDQUFDLElBQUksQ0FBQyxTQUFTLEVBQUUsQ0FBQztRQUNyRSxDQUFDLENBQUE7UUFHRCxNQUFNO1FBQ0ksa0JBQWEsR0FBRyxDQUFDLElBQVMsRUFBVyxFQUFFO1lBQzdDLE1BQU0sVUFBVSxHQUFHLElBQUksQ0FBQyxZQUFZLEVBQVMsQ0FBQztZQUM5QyxPQUFPLENBQUMsT0FBTyxVQUFVLEtBQUssU0FBUyxDQUFDO2dCQUNwQyxDQUFDLENBQUMsVUFBVSxJQUFJLENBQUMsSUFBSSxDQUFDLFNBQVMsRUFBRTtnQkFDakMsQ0FBQyxDQUFDLFVBQVUsQ0FBQyxJQUFJLEVBQUUsSUFBSSxDQUFDLEtBQUssQ0FBQyxLQUFLLElBQUksSUFBSSxDQUFDLElBQUksQ0FBQyxTQUFTLEVBQUUsQ0FBQztRQUNyRSxDQUFDLENBQUE7S0FhSjtJQWxDRyxNQUFNO0lBQ0ksV0FBVyxDQUFDLElBQVM7UUFDM0IsT0FBTyxJQUFJLENBQUMsUUFBUSxFQUFHLENBQUMsSUFBSSxFQUFFLElBQUksQ0FBQyxLQUFLLENBQUMsQ0FBQztJQUM5QyxDQUFDO0lBcUJELE1BQU07SUFDSSxJQUFJLENBQUMsS0FBdUI7UUFDbEMsTUFBTSxFQUFFLGFBQWEsRUFBRSxZQUFZLEVBQUUsR0FBRyxLQUFLLENBQUM7UUFDOUMsSUFBSSxVQUFVLEdBQUcsS0FBSyxDQUFDLGNBQWMsQ0FBQyxJQUFJLENBQUMsVUFBVSxFQUFFLENBQUMsQ0FBQztRQUN6RCxNQUFNLElBQUksR0FBRyxLQUFLLENBQUMsY0FBYyxDQUFDLFVBQVUsQ0FBQyxhQUFhLENBQUMsQ0FBQyxDQUFDO1FBQzdELFVBQVUsQ0FBQyxNQUFNLENBQUMsYUFBYSxFQUFFLENBQUMsQ0FBQyxDQUFDO1FBQ3BDLFVBQVUsQ0FBQyxNQUFNLENBQUMsWUFBWSxFQUFFLENBQUMsRUFBRSxJQUFJLENBQUMsQ0FBQztRQUN6QyxJQUFJLENBQUMsTUFBTSxDQUFDLElBQUksQ0FBQyxVQUFVLENBQUMsQ0FBQztRQUM3QixJQUFJLENBQUMsTUFBTSxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsQ0FBQztJQUMzQixDQUFDOytHQW5GUSxRQUFRO21HQUFSLFFBQVEsZ3FDQ1RyQix3NURBcURNOzs0RkQ1Q08sUUFBUTtrQkFMcEIsU0FBUzsrQkFDSSxXQUFXIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ2RrRHJhZ0Ryb3AgfSBmcm9tICdAYW5ndWxhci9jZGsvZHJhZy1kcm9wJztcclxuaW1wb3J0IHsgQWZ0ZXJWaWV3SW5pdCwgQ29tcG9uZW50LCBjb21wdXRlZCwgaW5wdXQsIG91dHB1dCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnOyBcclxuaW1wb3J0IHsgVG9vbHMgfSBmcm9tICdjb2VyLWVsZW1lbnRzL3Rvb2xzJztcclxuXHJcbkBDb21wb25lbnQoe1xyXG4gICAgc2VsZWN0b3I6ICdjb2VyLWxpc3QnLFxyXG4gICAgdGVtcGxhdGVVcmw6ICcuL2NvZXItbGlzdC5jb21wb25lbnQuaHRtbCcsXHJcbiAgICBzdHlsZVVybDogJy4vY29lci1saXN0LmNvbXBvbmVudC5zY3NzJyxcclxufSlcclxuZXhwb3J0IGNsYXNzIENvZXJMaXN0PFQ+IHsgXHJcblxyXG4gICAgLy9JbnB1dHNcclxuICAgIHB1YmxpYyBkYXRhU291cmNlID0gaW5wdXQ8VFtdPihbXSk7XHJcbiAgICBwdWJsaWMgcHJvcERpc3BsYXkgPSBpbnB1dDxzdHJpbmc+KCduYW1lJyk7XHJcbiAgICBwdWJsaWMgc2hvd0RlbGV0ZUJ1dHRvbiA9IGlucHV0PCgoaXRlbTogVCwgaW5kZXg6IG51bWJlcikgPT4gYm9vbGVhbikgfCBib29sZWFuPihmYWxzZSk7XHJcbiAgICBwdWJsaWMgc2hvd0dvQnV0dG9uID0gaW5wdXQ8KChpdGVtOiBULCBpbmRleDogbnVtYmVyKSA9PiBib29sZWFuKSB8IGJvb2xlYW4+KGZhbHNlKTtcclxuICAgIHB1YmxpYyBpc0xvYWRpbmcgPSBpbnB1dDxib29sZWFuPihmYWxzZSk7XHJcbiAgICBwdWJsaWMgaXNEcmFnZ2FibGUgPSBpbnB1dDxib29sZWFuPihmYWxzZSk7XHJcbiAgICBwdWJsaWMgdGVtcGxhdGUgPSBpbnB1dDwoKGl0ZW06IFQsIGluZGV4OiBudW1iZXIpID0+IHN0cmluZykgfCBudWxsPihudWxsKTtcclxuXHJcbiAgICAvL091dHB1dHNcclxuICAgIHB1YmxpYyBvbkRyb3AgPSBvdXRwdXQ8VD4oKTsgXHJcbiAgICBwdWJsaWMgb25Tb3J0ID0gb3V0cHV0PFRbXT4oKTsgXHJcbiAgICBwdWJsaWMgb25DbGljayA9IG91dHB1dDxUPigpO1xyXG4gICAgcHVibGljIG9uRG91YmxlQ2xpY2sgPSBvdXRwdXQ8VD4oKTtcclxuICAgIHB1YmxpYyBvbkNsaWNrRGVsZXRlID0gb3V0cHV0PFQ+KCk7XHJcbiAgICBwdWJsaWMgb25DbGlja0dvID0gb3V0cHV0PFQ+KCk7XHJcblxyXG4gICAgLy9jb21wdXRlZFxyXG4gICAgcHJvdGVjdGVkIF9kYXRhU291cmNlID0gY29tcHV0ZWQ8VFtdPigoKSA9PiB7XHJcbiAgICAgICAgbGV0IGluZGV4ID0gMDsgICAgICAgIFxyXG4gICAgICAgIHJldHVybiBUb29scy5CcmVha1JlZmVyZW5jZSh0aGlzLmRhdGFTb3VyY2UoKSlcclxuICAgICAgICAgICAgLm1hcCgoaXRlbTogYW55KSA9PiBPYmplY3QuYXNzaWduKGl0ZW0sIHsgaW5kZXg6IGluZGV4KysgfSkpO1xyXG4gICAgfSk7XHJcblxyXG5cclxuICAgIC8vY29tcHV0ZWRcclxuICAgIHByb3RlY3RlZCBfaXNEcmFnZ2FibGUgPSBjb21wdXRlZDxib29sZWFuPigoKSA9PiB7XHJcbiAgICAgICAgcmV0dXJuIHRoaXMuaXNEcmFnZ2FibGUoKSAmJiAhdGhpcy5pc0xvYWRpbmcoKTtcclxuICAgIH0pOyAgXHJcblxyXG5cclxuICAgIC8vY29tcHV0ZWRcclxuICAgIHByb3RlY3RlZCBfaGFzVGVtcGxhdGUgPSBjb21wdXRlZDxib29sZWFuPigoKSA9PiB7ICAgICAgICAgICAgICAgIFxyXG4gICAgICAgIHJldHVybiB0eXBlb2YgdGhpcy50ZW1wbGF0ZSgpID09ICdmdW5jdGlvbic7XHJcbiAgICB9KTtcclxuXHJcbiAgICAvKiogKi9cclxuICAgIHByb3RlY3RlZCBHZXREaXNwbGF5ID0gKGl0ZW06IGFueSk6IHN0cmluZyA9PiB7XHJcbiAgICAgICAgcmV0dXJuIFRvb2xzLklzTm90TnVsbChpdGVtKSA/IGl0ZW1bdGhpcy5wcm9wRGlzcGxheSgpXSA6ICcnO1xyXG4gICAgfVxyXG5cclxuXHJcbiAgICAvKiogKi9cclxuICAgIHByb3RlY3RlZCBHZXRJbmRleFJvdyA9IChpdGVtOiBhbnkpOiBudW1iZXIgPT4ge1xyXG4gICAgICAgIHJldHVybiBpdGVtWydpbmRleCddO1xyXG4gICAgfVxyXG5cclxuXHJcbiAgICAvKiogKi9cclxuICAgIHByb3RlY3RlZCBHZXRUZW1wbGF0ZShpdGVtOiBhbnkpOiBzdHJpbmcgeyAgXHJcbiAgICAgICAgcmV0dXJuIHRoaXMudGVtcGxhdGUoKSEoaXRlbSwgaXRlbS5pbmRleCk7XHJcbiAgICB9XHJcblxyXG5cclxuICAgIC8qKiAqL1xyXG4gICAgcHJvdGVjdGVkIF9zaG93RGVsZXRlQnV0dG9uID0gKGl0ZW06IGFueSk6IGJvb2xlYW4gPT4geyBcclxuICAgICAgICBjb25zdCBzaG93QnV0dG9uID0gdGhpcy5zaG93RGVsZXRlQnV0dG9uKCkgYXMgYW55OyAgICAgICAgXHJcbiAgICAgICAgcmV0dXJuICh0eXBlb2Ygc2hvd0J1dHRvbiA9PT0gJ2Jvb2xlYW4nKVxyXG4gICAgICAgICAgICA/IHNob3dCdXR0b24gJiYgIXRoaXMuaXNMb2FkaW5nKClcclxuICAgICAgICAgICAgOiBzaG93QnV0dG9uKGl0ZW0sIGl0ZW0uaW5kZXgpID09PSB0cnVlICYmICF0aGlzLmlzTG9hZGluZygpOyBcclxuICAgIH1cclxuXHJcblxyXG4gICAgLyoqICovXHJcbiAgICBwcm90ZWN0ZWQgX3Nob3dHb0J1dHRvbiA9IChpdGVtOiBhbnkpOiBib29sZWFuID0+IHsgXHJcbiAgICAgICAgY29uc3Qgc2hvd0J1dHRvbiA9IHRoaXMuc2hvd0dvQnV0dG9uKCkgYXMgYW55OyAgICAgICAgXHJcbiAgICAgICAgcmV0dXJuICh0eXBlb2Ygc2hvd0J1dHRvbiA9PT0gJ2Jvb2xlYW4nKVxyXG4gICAgICAgICAgICA/IHNob3dCdXR0b24gJiYgIXRoaXMuaXNMb2FkaW5nKClcclxuICAgICAgICAgICAgOiBzaG93QnV0dG9uKGl0ZW0sIGl0ZW0uaW5kZXgpID09PSB0cnVlICYmICF0aGlzLmlzTG9hZGluZygpOyBcclxuICAgIH1cclxuXHJcblxyXG4gICAgLyoqICovXHJcbiAgICBwcm90ZWN0ZWQgRHJvcChldmVudDogQ2RrRHJhZ0Ryb3A8VFtdPik6IHZvaWQge1xyXG4gICAgICAgIGNvbnN0IHsgcHJldmlvdXNJbmRleCwgY3VycmVudEluZGV4IH0gPSBldmVudDsgICAgICAgIFxyXG4gICAgICAgIGxldCBkYXRhU291cmNlID0gVG9vbHMuQnJlYWtSZWZlcmVuY2UodGhpcy5kYXRhU291cmNlKCkpO1xyXG4gICAgICAgIGNvbnN0IGl0ZW0gPSBUb29scy5CcmVha1JlZmVyZW5jZShkYXRhU291cmNlW3ByZXZpb3VzSW5kZXhdKTtcclxuICAgICAgICBkYXRhU291cmNlLnNwbGljZShwcmV2aW91c0luZGV4LCAxKTtcclxuICAgICAgICBkYXRhU291cmNlLnNwbGljZShjdXJyZW50SW5kZXgsIDAsIGl0ZW0pOyBcclxuICAgICAgICB0aGlzLm9uU29ydC5lbWl0KGRhdGFTb3VyY2UpO1xyXG4gICAgICAgIHRoaXMub25Ecm9wLmVtaXQoaXRlbSk7XHJcbiAgICB9XHJcbn0iLCI8ZGl2IGNsYXNzPVwiY29lci1saXN0XCI+XHJcbiAgPHVsIGNka0Ryb3BMaXN0IChjZGtEcm9wTGlzdERyb3BwZWQpPVwiRHJvcCgkZXZlbnQpXCIgY2xhc3M9XCJsaXN0LWdyb3VwIGNvZXItbGlzdFwiPlxyXG4gICAgQGZvciAoaXRlbSBvZiBfZGF0YVNvdXJjZSgpOyB0cmFjayBHZXRJbmRleFJvdyhpdGVtKSkge1xyXG4gICAgICA8bGkgY2RrRHJhZyBcclxuICAgICAgICBjbGFzcz1cImxpc3QtZ3JvdXAtaXRlbSBjb2VyLWxpc3QtYm94XCIgXHJcbiAgICAgICAgY2RrRHJhZ0JvdW5kYXJ5PVwidWwuY29lci1saXN0XCJcclxuICAgICAgICAoY2xpY2spPVwib25DbGljay5lbWl0KGl0ZW0pXCIgXHJcbiAgICAgICAgKGRibGNsaWNrKT1cIm9uRG91YmxlQ2xpY2suZW1pdChpdGVtKVwiPlxyXG5cclxuICAgICAgICA8ZGl2ICpjZGtEcmFnUGxhY2Vob2xkZXIgY2xhc3M9XCJjb2VyLWxpc3QtcGxhY2Vob2xkZXIgY3Vyc29yLWdyYWJiaW5nXCI+PC9kaXY+XHJcbiAgICAgICAgPGRpdiBjbGFzcz1cImNvZXItbGlzdC1jb250ZW50XCI+IFxyXG4gICAgICAgICAgQGlmKF9oYXNUZW1wbGF0ZSgpKSB7XHJcbiAgICAgICAgICAgIDxkaXYgW2lubmVySFRNTF09XCJHZXRUZW1wbGF0ZShpdGVtKSB8IGh0bWxcIiBjbGFzcz1cInRlbXBsYXRlXCI+PC9kaXY+XHJcbiAgICAgICAgICB9XHJcblxyXG4gICAgICAgICAgQGVsc2Uge1xyXG4gICAgICAgICAgICA8ZGl2PiB7eyBHZXREaXNwbGF5KGl0ZW0pIH19IDwvZGl2PiBcclxuICAgICAgICAgIH1cclxuICAgICAgICAgICBcclxuICAgICAgICAgIEBpZih0cnVlKSB7XHJcbiAgICAgICAgICAgIDxkaXY+XHJcbiAgICAgICAgICAgICAgQGlmKF9zaG93RGVsZXRlQnV0dG9uKGl0ZW0pKSB7XHJcbiAgICAgICAgICAgICAgICA8Y29lci1idXR0b25cclxuICAgICAgICAgICAgICAgICAgdHlwZT1cImljb24tbm8tYm9yZGVyXCJcclxuICAgICAgICAgICAgICAgICAgY29sb3I9XCJzZWNvbmRhcnlcIlxyXG4gICAgICAgICAgICAgICAgICBpY29uPVwiZGVsZXRlXCIgICAgICBcclxuICAgICAgICAgICAgICAgICAgKG9uQ2xpY2spPVwib25DbGlja0RlbGV0ZS5lbWl0KGl0ZW0pXCJcclxuICAgICAgICAgICAgICAgID48L2NvZXItYnV0dG9uPlxyXG4gICAgICAgICAgICAgIH0gXHJcblxyXG4gICAgICAgICAgICAgIEBpZihfc2hvd0dvQnV0dG9uKGl0ZW0pKSB7XHJcbiAgICAgICAgICAgICAgICA8Y29lci1idXR0b25cclxuICAgICAgICAgICAgICAgICAgdHlwZT1cImljb24tbm8tYm9yZGVyXCJcclxuICAgICAgICAgICAgICAgICAgY29sb3I9XCJzZWNvbmRhcnlcIlxyXG4gICAgICAgICAgICAgICAgICBpY29uPVwiZ29cIiAgIFxyXG4gICAgICAgICAgICAgICAgICBtYXJnaW5MZWZ0PVwiNXB4XCIgICBcclxuICAgICAgICAgICAgICAgICAgKG9uQ2xpY2spPVwib25DbGlja0dvLmVtaXQoaXRlbSlcIlxyXG4gICAgICAgICAgICAgICAgPjwvY29lci1idXR0b24+XHJcbiAgICAgICAgICAgICAgfSBcclxuICAgICAgICAgICAgICAgXHJcbiAgICAgICAgICAgICAgPGkgY2RrRHJhZ0hhbmRsZSBbbmdDbGFzc109XCJ7IFxyXG4gICAgICAgICAgICAgICAgJ2ZhLXNvbGlkIGZhLWdyaXAtdmVydGljYWwgdGV4dC1zZWNvbmRhcnkgcHMtMic6IHRydWUsXHJcbiAgICAgICAgICAgICAgICAnY3Vyc29yLWdyYWInOiB0cnVlLCBcclxuICAgICAgICAgICAgICAgICdjdXJzb3ItZ3JhYmJpbmcnOiBmYWxzZSwgXHJcbiAgICAgICAgICAgICAgICAnZC1ub25lJzogIV9pc0RyYWdnYWJsZSgpXHJcbiAgICAgICAgICAgICAgICB9XCJcclxuICAgICAgICAgICAgICA+PC9pPiAgICAgICAgICAgICAgIFxyXG4gICAgICAgICAgICA8L2Rpdj5cclxuICAgICAgICAgIH1cclxuICAgICAgICA8L2Rpdj4gIFxyXG4gICAgICA8L2xpPiBcclxuICAgIH0gXHJcbiAgPC91bD5cclxuPC9kaXY+Il19

package/esm2022/interfaces/lib/coer-menu/menu.interface.mjs

@@ -1,2 +1,2 @@
 export {};
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibWVudS5pbnRlcmZhY2UuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9jb2VyLWVsZW1lbnRzL2ludGVyZmFjZXMvbGliL2NvZXItbWVudS9tZW51LmludGVyZmFjZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiIiwic291cmNlc0NvbnRlbnQiOlsiZXhwb3J0IGludGVyZmFjZSBJTWVudSB7XHJcbiAgICBsYWJlbDogc3RyaW5nO1xyXG4gICAgaWNvbj86IHN0cmluZztcclxuICAgIHBhdGg/OiBzdHJpbmc7XHJcbiAgICBpdGVtcz86IElNZW51W107XHJcbn0iXX0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibWVudS5pbnRlcmZhY2UuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9jb2VyLWVsZW1lbnRzL2ludGVyZmFjZXMvbGliL2NvZXItbWVudS9tZW51LmludGVyZmFjZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiIiwic291cmNlc0NvbnRlbnQiOlsiZXhwb3J0IGludGVyZmFjZSBJTWVudSB7XHJcbiAgICBpZD86IG51bWJlcjtcclxuICAgIGxhYmVsOiBzdHJpbmc7XHJcbiAgICBpY29uPzogc3RyaW5nO1xyXG4gICAgcGF0aD86IHN0cmluZztcclxuICAgIHNlY3VlbmNlPzogbnVtYmVyO1xyXG4gICAgaXRlbXM/OiBJTWVudVtdO1xyXG59Il19

package/fesm2022/coer-elements-components.mjs

@@ -2362,6 +2362,7 @@ class CoerList {
         this.showGoButton = input(false);
         this.isLoading = input(false);
         this.isDraggable = input(false);
+        this.template = input(null);
         //Outputs
         this.onDrop = output();
         this.onSort = output();
@@ -2380,12 +2381,8 @@ class CoerList {
             return this.isDraggable() && !this.isLoading();
         });
         //computed
-        this._showDeleteButton = computed(() => {
-            return this.showDeleteButton() && !this.isLoading();
-        });
-        //computed
-        this._showGoButton = computed(() => {
-            return this.showGoButton() && !this.isLoading();
+        this._hasTemplate = computed(() => {
+            return typeof this.template() == 'function';
         });
         /** */
         this.GetDisplay = (item) => {
@@ -2395,6 +2392,24 @@ class CoerList {
         this.GetIndexRow = (item) => {
             return item['index'];
         };
+        /** */
+        this._showDeleteButton = (item) => {
+            const showButton = this.showDeleteButton();
+            return (typeof showButton === 'boolean')
+                ? showButton && !this.isLoading()
+                : showButton(item, item.index) === true && !this.isLoading();
+        };
+        /** */
+        this._showGoButton = (item) => {
+            const showButton = this.showGoButton();
+            return (typeof showButton === 'boolean')
+                ? showButton && !this.isLoading()
+                : showButton(item, item.index) === true && !this.isLoading();
+        };
+    }
+    /** */
+    GetTemplate(item) {
+        return this.template()(item, item.index);
     }
     /** */
     Drop(event) {
@@ -2407,11 +2422,11 @@ class CoerList {
         this.onDrop.emit(item);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CoerList, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: CoerList, selector: "coer-list", inputs: { dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: true, isRequired: false, transformFunction: null }, propDisplay: { classPropertyName: "propDisplay", publicName: "propDisplay", isSignal: true, isRequired: false, transformFunction: null }, showDeleteButton: { classPropertyName: "showDeleteButton", publicName: "showDeleteButton", isSignal: true, isRequired: false, transformFunction: null }, showGoButton: { classPropertyName: "showGoButton", publicName: "showGoButton", isSignal: true, isRequired: false, transformFunction: null }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: false, transformFunction: null }, isDraggable: { classPropertyName: "isDraggable", publicName: "isDraggable", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onDrop: "onDrop", onSort: "onSort", onClick: "onClick", onDoubleClick: "onDoubleClick", onClickDelete: "onClickDelete", onClickGo: "onClickGo" }, ngImport: i0, template: "<div class=\"coer-list\">\r\n  <ul cdkDropList (cdkDropListDropped)=\"Drop($event)\" class=\"list-group coer-list\">\r\n    @for (item of _dataSource(); track GetIndexRow(item)) {\r\n      <li cdkDrag \r\n        class=\"list-group-item coer-list-box\" \r\n        cdkDragBoundary=\"ul.coer-list\"\r\n        (click)=\"onClick.emit(item)\" \r\n        (dblclick)=\"onDoubleClick.emit(item)\">\r\n\r\n        <div *cdkDragPlaceholder class=\"coer-list-placeholder cursor-grabbing\"></div>\r\n        <div class=\"coer-list-content\"> \r\n          <span> {{ GetDisplay(item) }} </span> \r\n          \r\n          @if(true) {\r\n            <div>\r\n              @if(_showDeleteButton()) {\r\n                <coer-button\r\n                  type=\"icon-no-border\"\r\n                  color=\"secondary\"\r\n                  icon=\"delete\"      \r\n                  (onClick)=\"onClickDelete.emit(item)\"\r\n                ></coer-button>\r\n              } \r\n\r\n              @if(_showGoButton()) {\r\n                <coer-button\r\n                  type=\"icon-no-border\"\r\n                  color=\"secondary\"\r\n                  icon=\"go\"   \r\n                  marginLeft=\"5px\"   \r\n                  (onClick)=\"onClickGo.emit(item)\"\r\n                ></coer-button>\r\n              } \r\n               \r\n              <i cdkDragHandle [ngClass]=\"{ \r\n                'fa-solid fa-grip-vertical text-secondary ps-2': true,\r\n                'cursor-grab': true, \r\n                'cursor-grabbing': false, \r\n                'd-none': !_isDraggable()\r\n                }\"\r\n              ></i>               \r\n            </div>\r\n          }\r\n        </div>  \r\n      </li> \r\n    } \r\n  </ul>\r\n</div>", styles: ["div.coer-list ul.coer-list{width:100%;border:solid 1px #ccc;display:block;background:#fff;border-radius:4px;overflow:hidden}div.coer-list li.coer-list-box{padding:10px;border-bottom:solid 1px #ccc;color:#000000de;display:flex;flex-direction:row;align-items:center;justify-content:space-between;box-sizing:border-box;background:#fff;font-size:14px}div.coer-list li.coer-list-box div.coer-list-content{width:100%;display:flex;align-items:center;justify-content:space-between}div.coer-list .cdk-drag-preview{box-sizing:border-box;border-radius:4px;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}div.coer-list .cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}div.coer-list .coer-list-box:last-child{border:none}div.coer-list .coer-list.cdk-drop-list-dragging .coer-list-box:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}div.coer-list div.coer-list-placeholder{background:#ccc;border:dotted 3px #999;min-height:40px;transition:transform .25s cubic-bezier(0,0,.2,1)}div.coer-list div.cdk-drag-placeholder,div.coer-list ul.cdk-drop-list-dragging,div.coer-list ul.cdk-drop-list-dragging *{cursor:grabbing}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$5.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: i2$5.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "directive", type: i2$5.CdkDragPlaceholder, selector: "ng-template[cdkDragPlaceholder]", inputs: ["data"] }, { kind: "directive", type: i2$5.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: "component", type: CoerButton, selector: "coer-button", inputs: ["id", "color", "type", "icon", "iconPosition", "animation", "isLoading", "isDisabled", "isInvisible", "width", "minWidth", "height", "minHeight", "marginTop", "marginRight", "marginBottom", "marginLeft", "path", "tooltipPosition", "tooltip"], outputs: ["onClick"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: CoerList, selector: "coer-list", inputs: { dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: true, isRequired: false, transformFunction: null }, propDisplay: { classPropertyName: "propDisplay", publicName: "propDisplay", isSignal: true, isRequired: false, transformFunction: null }, showDeleteButton: { classPropertyName: "showDeleteButton", publicName: "showDeleteButton", isSignal: true, isRequired: false, transformFunction: null }, showGoButton: { classPropertyName: "showGoButton", publicName: "showGoButton", isSignal: true, isRequired: false, transformFunction: null }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: false, transformFunction: null }, isDraggable: { classPropertyName: "isDraggable", publicName: "isDraggable", isSignal: true, isRequired: false, transformFunction: null }, template: { classPropertyName: "template", publicName: "template", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onDrop: "onDrop", onSort: "onSort", onClick: "onClick", onDoubleClick: "onDoubleClick", onClickDelete: "onClickDelete", onClickGo: "onClickGo" }, ngImport: i0, template: "<div class=\"coer-list\">\r\n  <ul cdkDropList (cdkDropListDropped)=\"Drop($event)\" class=\"list-group coer-list\">\r\n    @for (item of _dataSource(); track GetIndexRow(item)) {\r\n      <li cdkDrag \r\n        class=\"list-group-item coer-list-box\" \r\n        cdkDragBoundary=\"ul.coer-list\"\r\n        (click)=\"onClick.emit(item)\" \r\n        (dblclick)=\"onDoubleClick.emit(item)\">\r\n\r\n        <div *cdkDragPlaceholder class=\"coer-list-placeholder cursor-grabbing\"></div>\r\n        <div class=\"coer-list-content\"> \r\n          @if(_hasTemplate()) {\r\n            <div [innerHTML]=\"GetTemplate(item) | html\" class=\"template\"></div>\r\n          }\r\n\r\n          @else {\r\n            <div> {{ GetDisplay(item) }} </div> \r\n          }\r\n           \r\n          @if(true) {\r\n            <div>\r\n              @if(_showDeleteButton(item)) {\r\n                <coer-button\r\n                  type=\"icon-no-border\"\r\n                  color=\"secondary\"\r\n                  icon=\"delete\"      \r\n                  (onClick)=\"onClickDelete.emit(item)\"\r\n                ></coer-button>\r\n              } \r\n\r\n              @if(_showGoButton(item)) {\r\n                <coer-button\r\n                  type=\"icon-no-border\"\r\n                  color=\"secondary\"\r\n                  icon=\"go\"   \r\n                  marginLeft=\"5px\"   \r\n                  (onClick)=\"onClickGo.emit(item)\"\r\n                ></coer-button>\r\n              } \r\n               \r\n              <i cdkDragHandle [ngClass]=\"{ \r\n                'fa-solid fa-grip-vertical text-secondary ps-2': true,\r\n                'cursor-grab': true, \r\n                'cursor-grabbing': false, \r\n                'd-none': !_isDraggable()\r\n                }\"\r\n              ></i>               \r\n            </div>\r\n          }\r\n        </div>  \r\n      </li> \r\n    } \r\n  </ul>\r\n</div>", styles: ["div.coer-list ul.coer-list{width:100%;border:solid 1px #ccc;display:block;background:#fff;border-radius:4px;overflow:hidden}div.coer-list li.coer-list-box{padding:10px;border-bottom:solid 1px #ccc;color:#000000de;display:flex;flex-direction:row;align-items:center;justify-content:space-between;box-sizing:border-box;background:#fff;font-size:14px}div.coer-list li.coer-list-box div.coer-list-content{width:100%;display:flex;align-items:center;justify-content:space-between}div.coer-list .cdk-drag-preview{box-sizing:border-box;border-radius:4px;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}div.coer-list .cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}div.coer-list .coer-list-box:last-child{border:none}div.coer-list .coer-list.cdk-drop-list-dragging .coer-list-box:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}div.coer-list div.coer-list-placeholder{background:#ccc;border:dotted 3px #999;min-height:40px;transition:transform .25s cubic-bezier(0,0,.2,1)}div.coer-list div.cdk-drag-placeholder,div.coer-list ul.cdk-drop-list-dragging,div.coer-list ul.cdk-drop-list-dragging *{cursor:grabbing}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$5.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: i2$5.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "directive", type: i2$5.CdkDragPlaceholder, selector: "ng-template[cdkDragPlaceholder]", inputs: ["data"] }, { kind: "directive", type: i2$5.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: "component", type: CoerButton, selector: "coer-button", inputs: ["id", "color", "type", "icon", "iconPosition", "animation", "isLoading", "isDisabled", "isInvisible", "width", "minWidth", "height", "minHeight", "marginTop", "marginRight", "marginBottom", "marginLeft", "path", "tooltipPosition", "tooltip"], outputs: ["onClick"] }, { kind: "pipe", type: i9.HtmlPipe, name: "html" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CoerList, decorators: [{
             type: Component,
-            args: [{ selector: 'coer-list', template: "<div class=\"coer-list\">\r\n  <ul cdkDropList (cdkDropListDropped)=\"Drop($event)\" class=\"list-group coer-list\">\r\n    @for (item of _dataSource(); track GetIndexRow(item)) {\r\n      <li cdkDrag \r\n        class=\"list-group-item coer-list-box\" \r\n        cdkDragBoundary=\"ul.coer-list\"\r\n        (click)=\"onClick.emit(item)\" \r\n        (dblclick)=\"onDoubleClick.emit(item)\">\r\n\r\n        <div *cdkDragPlaceholder class=\"coer-list-placeholder cursor-grabbing\"></div>\r\n        <div class=\"coer-list-content\"> \r\n          <span> {{ GetDisplay(item) }} </span> \r\n          \r\n          @if(true) {\r\n            <div>\r\n              @if(_showDeleteButton()) {\r\n                <coer-button\r\n                  type=\"icon-no-border\"\r\n                  color=\"secondary\"\r\n                  icon=\"delete\"      \r\n                  (onClick)=\"onClickDelete.emit(item)\"\r\n                ></coer-button>\r\n              } \r\n\r\n              @if(_showGoButton()) {\r\n                <coer-button\r\n                  type=\"icon-no-border\"\r\n                  color=\"secondary\"\r\n                  icon=\"go\"   \r\n                  marginLeft=\"5px\"   \r\n                  (onClick)=\"onClickGo.emit(item)\"\r\n                ></coer-button>\r\n              } \r\n               \r\n              <i cdkDragHandle [ngClass]=\"{ \r\n                'fa-solid fa-grip-vertical text-secondary ps-2': true,\r\n                'cursor-grab': true, \r\n                'cursor-grabbing': false, \r\n                'd-none': !_isDraggable()\r\n                }\"\r\n              ></i>               \r\n            </div>\r\n          }\r\n        </div>  \r\n      </li> \r\n    } \r\n  </ul>\r\n</div>", styles: ["div.coer-list ul.coer-list{width:100%;border:solid 1px #ccc;display:block;background:#fff;border-radius:4px;overflow:hidden}div.coer-list li.coer-list-box{padding:10px;border-bottom:solid 1px #ccc;color:#000000de;display:flex;flex-direction:row;align-items:center;justify-content:space-between;box-sizing:border-box;background:#fff;font-size:14px}div.coer-list li.coer-list-box div.coer-list-content{width:100%;display:flex;align-items:center;justify-content:space-between}div.coer-list .cdk-drag-preview{box-sizing:border-box;border-radius:4px;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}div.coer-list .cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}div.coer-list .coer-list-box:last-child{border:none}div.coer-list .coer-list.cdk-drop-list-dragging .coer-list-box:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}div.coer-list div.coer-list-placeholder{background:#ccc;border:dotted 3px #999;min-height:40px;transition:transform .25s cubic-bezier(0,0,.2,1)}div.coer-list div.cdk-drag-placeholder,div.coer-list ul.cdk-drop-list-dragging,div.coer-list ul.cdk-drop-list-dragging *{cursor:grabbing}\n"] }]
+            args: [{ selector: 'coer-list', template: "<div class=\"coer-list\">\r\n  <ul cdkDropList (cdkDropListDropped)=\"Drop($event)\" class=\"list-group coer-list\">\r\n    @for (item of _dataSource(); track GetIndexRow(item)) {\r\n      <li cdkDrag \r\n        class=\"list-group-item coer-list-box\" \r\n        cdkDragBoundary=\"ul.coer-list\"\r\n        (click)=\"onClick.emit(item)\" \r\n        (dblclick)=\"onDoubleClick.emit(item)\">\r\n\r\n        <div *cdkDragPlaceholder class=\"coer-list-placeholder cursor-grabbing\"></div>\r\n        <div class=\"coer-list-content\"> \r\n          @if(_hasTemplate()) {\r\n            <div [innerHTML]=\"GetTemplate(item) | html\" class=\"template\"></div>\r\n          }\r\n\r\n          @else {\r\n            <div> {{ GetDisplay(item) }} </div> \r\n          }\r\n           \r\n          @if(true) {\r\n            <div>\r\n              @if(_showDeleteButton(item)) {\r\n                <coer-button\r\n                  type=\"icon-no-border\"\r\n                  color=\"secondary\"\r\n                  icon=\"delete\"      \r\n                  (onClick)=\"onClickDelete.emit(item)\"\r\n                ></coer-button>\r\n              } \r\n\r\n              @if(_showGoButton(item)) {\r\n                <coer-button\r\n                  type=\"icon-no-border\"\r\n                  color=\"secondary\"\r\n                  icon=\"go\"   \r\n                  marginLeft=\"5px\"   \r\n                  (onClick)=\"onClickGo.emit(item)\"\r\n                ></coer-button>\r\n              } \r\n               \r\n              <i cdkDragHandle [ngClass]=\"{ \r\n                'fa-solid fa-grip-vertical text-secondary ps-2': true,\r\n                'cursor-grab': true, \r\n                'cursor-grabbing': false, \r\n                'd-none': !_isDraggable()\r\n                }\"\r\n              ></i>               \r\n            </div>\r\n          }\r\n        </div>  \r\n      </li> \r\n    } \r\n  </ul>\r\n</div>", styles: ["div.coer-list ul.coer-list{width:100%;border:solid 1px #ccc;display:block;background:#fff;border-radius:4px;overflow:hidden}div.coer-list li.coer-list-box{padding:10px;border-bottom:solid 1px #ccc;color:#000000de;display:flex;flex-direction:row;align-items:center;justify-content:space-between;box-sizing:border-box;background:#fff;font-size:14px}div.coer-list li.coer-list-box div.coer-list-content{width:100%;display:flex;align-items:center;justify-content:space-between}div.coer-list .cdk-drag-preview{box-sizing:border-box;border-radius:4px;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}div.coer-list .cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}div.coer-list .coer-list-box:last-child{border:none}div.coer-list .coer-list.cdk-drop-list-dragging .coer-list-box:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}div.coer-list div.coer-list-placeholder{background:#ccc;border:dotted 3px #999;min-height:40px;transition:transform .25s cubic-bezier(0,0,.2,1)}div.coer-list div.cdk-drag-placeholder,div.coer-list ul.cdk-drop-list-dragging,div.coer-list ul.cdk-drop-list-dragging *{cursor:grabbing}\n"] }]
         }] });
 
 class CoerMenuOption {