verben-ng-ui 0.1.1 → 0.1.3

package/esm2022/lib/components/data-view/data-view.component.mjs

@@ -59,7 +59,6 @@ export class DataViewComponent {
     }
     onSearch(event) {
         this.searchValue = event.target.value;
-        console.log({ key: this.searchKey, value: event.target.value });
         this.onSearchChange.emit({ key: this.searchKey, value: this.searchValue });
     }
     onClearSearch() {
@@ -129,11 +128,11 @@ export class DataViewComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.5", ngImport: i0, type: DataViewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.5", type: DataViewComponent, selector: "verben-data-view", inputs: { buttonClass: "buttonClass", iconClass: "iconClass", activeIconClass: "activeIconClass", columnCustomClass: "columnCustomClass", filterCustomClass: "filterCustomClass", sortCustomClass: "sortCustomClass", exportCustomClass: "exportCustomClass", selectCustomClass: "selectCustomClass", zIndex: "zIndex", createCustomClass: "createCustomClass", tableIcon: "tableIcon", cardIcon: "cardIcon", cardClass: "cardClass", tableClass: "tableClass", searchKey: "searchKey", searchValue: "searchValue", viewState: "viewState", searchTemplate: "searchTemplate", columnTemplate: "columnTemplate", filterTemplate: "filterTemplate", sortTemplate: "sortTemplate", exportTemplate: "exportTemplate", createTemplate: "createTemplate", selectedColumnCount: "selectedColumnCount", selectedSortCount: "selectedSortCount", selectedFilterTableCount: "selectedFilterTableCount", inputWidth: "inputWidth", showColumnChild: "showColumnChild", showSortChild: "showSortChild", showFilterChild: "showFilterChild", showExportChild: "showExportChild", create: "create", showSelected: "showSelected", isTableView: "isTableView" }, outputs: { viewChange: "viewChange", stateChange: "stateChange", onSearchChange: "onSearchChange" }, ngImport: i0, template: "<div\n  class=\"toolbar flex gap justify-between items-center\"\n  [style.margin]=\"'0px 35px'\"\n>\n  <div class=\"flex items-center gap\">\n    <div *ngIf=\"viewState.isToggle\" class=\"toggle-button-container\">\n      <button type=\"button\" (click)=\"toggleView()\" [ngClass]=\"buttonClass\">\n        <verben-svg\n          [icon]=\"tableIcon\"\n          [class.active]=\"!isTableView\"\n          [ngClass]=\"!isTableView ? activeIconClass : iconClass\"\n        ></verben-svg>\n        <verben-svg\n          [icon]=\"cardIcon\"\n          [class.active]=\"isTableView\"\n          [ngClass]=\"isTableView ? activeIconClass : iconClass\"\n          [width]=\"25\"\n\n          [height]=\"25\"\n        ></verben-svg>\n      </button>\n    </div>\n    <!-- Search Input -->\n    <div\n      [style.width]=\"inputWidth\"\n      class=\"search-input\"\n      *ngIf=\"viewState.isSearch\"\n    >\n      <verbena-input\n        [type]=\"'text'\"\n        [placeHolder]=\"'Search...'\"\n        (input)=\"onSearch($event)\"\n         [bgColor]=\"'transparent'\"\n        [border]=\"'0'\"\n        [value]=\"searchValue\"\n      />\n      <verben-svg\n      *ngIf=\"searchValue.length>0\"\n          [icon]=\"'close'\"\n          [width]=\"15\"\n          (click)=\"onClearSearch()\"\n          class=\"close-icon-class\"\n          [height]=\"15\"\n        ></verben-svg>\n    </div>\n  </div>\n\n  <div class=\"flex items-center relative gap\" [style.margin-left]=\"'10px'\">\n    <!-- Column Section -->\n    <ng-container\n      [appOutSideClick]=\"showColumnChild\"\n      (outSideClick)=\"showColumnChild = false\"\n      *ngIf=\"viewState.isColumn && isTableView\"\n    >\n      <ng-container *ngIf=\"columnTemplate; else defaultColumn\"></ng-container>\n      <ng-template #defaultColumn>\n        <span\n          [ngClass]=\"[\n            'flex gap text-xs items-center pd rounded cursor-pointer',\n            columnCustomClass ? columnCustomClass : ''\n          ]\"\n          [style.background-color]=\"'#D9D9D940'\"\n          (click)=\"toggleChildView('column')\"\n        >\n          <verben-svg [width]=\"15\" [icon]=\"'column'\"></verben-svg>\n          <span\n            >Columns <sup>({{ selectedColumnCount }})</sup></span\n          >\n        </span>\n        <div [style.z-index]=\"zIndex\" class=\"data-view-element\">\n          <ng-content\n            *ngIf=\"showColumnChild\"\n            select=\"[column-content]\"\n          ></ng-content>\n        </div>\n      </ng-template>\n    </ng-container>\n\n    <!-- Filter Section -->\n    <ng-container\n      [appOutSideClick]=\"showFilterChild\"\n      (outSideClick)=\"showFilterChild = false\"\n      *ngIf=\"viewState.isFilter\"\n    >\n      <ng-container *ngIf=\"filterTemplate; else defaultFilter\"></ng-container>\n      <ng-template #defaultFilter>\n        <span\n        [ngClass]=\"[\n        'flex gap text-xs items-center pd rounded cursor-pointer',\n        filterCustomClass ? filterCustomClass : ''\n      ]\"\n          [style.background-color]=\"'#D9D9D940'\"\n          (click)=\"toggleChildView('filter')\"\n        >\n          <verben-svg [width]=\"15\" [icon]=\"'filter'\"></verben-svg>\n          <span\n            >Filter <sup>({{ selectedFilterTableCount }})</sup></span\n          >\n        </span>\n        <div [style.z-index]=\"zIndex\" class=\"data-view-element\">\n          <ng-content\n            *ngIf=\"showFilterChild\"\n            select=\"[filter-content]\"\n          ></ng-content>\n        </div>\n      </ng-template>\n    </ng-container>\n\n    <!-- Sort Section -->\n    <ng-container\n      [appOutSideClick]=\"showSortChild\"\n      (outSideClick)=\"showSortChild = false\"\n      *ngIf=\"viewState.isSort\"\n    >\n      <ng-container *ngIf=\"sortTemplate; else defaultSort\"></ng-container>\n      <ng-template #defaultSort>\n        <span\n        [ngClass]=\"[\n        'flex gap text-xs items-center pd rounded cursor-pointer',\n      sortCustomClass ? sortCustomClass : ''\n      ]\"\n          [style.background-color]=\"'#D9D9D940'\"\n          (click)=\"toggleChildView('sort')\"\n        >\n          <verben-svg [width]=\"15\" [icon]=\"'sort'\"></verben-svg>\n          <span\n            >Sort <sup>({{ selectedSortCount }})</sup></span\n          >\n        </span>\n        <div [style.z-index]=\"zIndex\" class=\"data-view-element\">\n          <ng-content\n            *ngIf=\"showSortChild\"\n            select=\"[sort-content]\"\n          ></ng-content>\n        </div>\n      </ng-template>\n    </ng-container>\n\n    <!-- Export Section -->\n    <ng-container\n      [appOutSideClick]=\"showExportChild\"\n      (outSideClick)=\"showExportChild = false\"\n      *ngIf=\"viewState.isExport\"\n    >\n      <ng-container *ngIf=\"exportTemplate; else defaultExport\"></ng-container>\n      <ng-template #defaultExport>\n        <span\n        [ngClass]=\"[\n        'flex gap text-xs items-center pd rounded cursor-pointer',\n        exportCustomClass ? exportCustomClass : ''\n      ]\"\n          [style.background-color]=\"'#D9D9D940'\"\n          (click)=\"toggleChildView('export')\"\n        >\n          <verben-svg [width]=\"15\" [icon]=\"'export'\"></verben-svg>\n          Export\n        </span>\n        <div [style.z-index]=\"zIndex\" class=\"data-view-element\">\n          <ng-content\n            *ngIf=\"showExportChild\"\n            select=\"[export-content]\"\n          ></ng-content>\n        </div>\n      </ng-template>\n    </ng-container>\n\n    <!-- Select Section -->\n    <div *ngIf=\"viewState.isSelect\">\n      <span\n      [ngClass]=\"[\n      'flex gap text-xs items-center pd rounded cursor-pointer',\n      selectCustomClass ? selectCustomClass : ''\n    ]\"\n        [style.background-color]=\"'#D9D9D940'\"\n        (click)=\"toggleChildView('select')\"\n      >\n        <verben-svg [width]=\"15\" [icon]=\"'select'\"></verben-svg>\n        <span>Select</span>\n        <verben-svg [width]=\"6\" [icon]=\"'chevron-down'\"></verben-svg>\n      </span>\n    </div>\n\n    <!-- Create Button -->\n     \n    <div   [appOutSideClick]=\"create\"\n    (outSideClick)=\"create = false\" *ngIf=\"viewState.isCreate\">\n      <verbena-button\n        class=\"text-sm font-semibold\"\n        [bgColor]=\"'#FFE681'\"\n        [buttonClass]=\"createCustomClass\"\n        [pd]=\"'6px'\"\n        [borderRadius]=\"'4px'\"\n        [textColor]=\"'#000'\"\n        [svg]=\"'add'\"\n        [svgPosition]=\"'right'\"\n        [text]=\"'Create New'\"\n        (click)=\"toggleChildView('create')\"\n      >\n      </verbena-button>\n      <ng-container *ngIf=\"createTemplate; else defaultCreate\"></ng-container>\n      <ng-template #defaultCreate>\n      \n        <div [style.z-index]=\"zIndex\" class=\"data-view-element\">\n          <ng-content\n            *ngIf=\"create\"\n            select=\"[create-content]\"\n          ></ng-content>\n        </div>\n      </ng-template>\n    </div>\n  </div>\n</div>\n\n<!-- Grid and List View Handling -->\n<div *ngIf=\"isTableView; else listViewTemplate\">\n  <div [class]=\"tableClass\">\n    <ng-content select=\"[table-content]\"></ng-content>\n  </div>\n</div>\n<ng-template #listViewTemplate>\n  <div [class]=\"cardClass\">\n    <ng-content select=\"[card-content]\"></ng-content>\n  </div>\n</ng-template>\n", styles: [".toggle-button-container button{display:flex;justify-content:space-between;align-content:center;border:none;background-color:transparent;cursor:pointer;border:1px solid gray;padding:0;border-radius:6px;overflow:hidden;height:35px}.toggle-button-container verben-svg{transition:background-color .5s ease;padding:6px;position:relative}.toggle-button-container verben-svg.active{background-color:#d3d3d3}.flex{display:flex}.justify-between{justify-content:space-between}.items-center{align-items:center}.font-semibold{font-weight:600}.font-normal{font-weight:400}.text-sm{font-size:14px}.text-xs{font-size:12px}.gap{gap:7px}.pd{padding:5px 8px}.rounded-sm{border-radius:10px}.cursor-pointer{cursor:pointer}.search-input{position:relative;background-color:#f9f9f9;border-radius:10px}sup{color:#3479e9;font-weight:500}.data-view-element{position:absolute;top:80px;left:0}.relative{position:relative}.z-10{z-index:100000000000}.close-icon-class{position:absolute;right:10px;cursor:pointer;top:13px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.SvgComponent, selector: "verben-svg", inputs: ["icon", "width", "height", "fill", "stroke", "size"] }, { kind: "component", type: i3.VerbenaInputComponent, selector: "verbena-input", inputs: ["label", "placeHolder", "required", "svgPosition", "minLength", "maxLength", "type", "bgColor", "border", "borderRadius", "textColor", "value", "labelPosition", "labelColor", "disable", "min", "max", "showBorder", "showErrorMessage", "errorMessageColor", "errorBorderColor", "errorPosition", "svg", "svgWidth", "svgHeight", "svgColor", "capitalization", "inputContainerClass", "inputFieldClass", "inputWrapperClass", "customErrorMessages"], outputs: ["valueChange"] }, { kind: "component", type: i4.VerbenaButtonComponent, selector: "verbena-button", inputs: ["text", "icon", "svgPosition", "bgColor", "textColor", "border", "borderRadius", "pd", "width", "height", "fontSize", "fontWeight", "disable", "styleType", "svg", "svgWidth", "svgHeight", "svgColor", "buttonClass", "buttonTextClass"] }, { kind: "directive", type: i5.OutSideClickDirective, selector: "[appOutSideClick]", inputs: ["appOutSideClick"], outputs: ["outSideClick"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.5", type: DataViewComponent, selector: "verben-data-view", inputs: { buttonClass: "buttonClass", iconClass: "iconClass", activeIconClass: "activeIconClass", columnCustomClass: "columnCustomClass", filterCustomClass: "filterCustomClass", sortCustomClass: "sortCustomClass", exportCustomClass: "exportCustomClass", selectCustomClass: "selectCustomClass", zIndex: "zIndex", createCustomClass: "createCustomClass", tableIcon: "tableIcon", cardIcon: "cardIcon", cardClass: "cardClass", tableClass: "tableClass", searchKey: "searchKey", searchValue: "searchValue", viewState: "viewState", searchTemplate: "searchTemplate", columnTemplate: "columnTemplate", filterTemplate: "filterTemplate", sortTemplate: "sortTemplate", exportTemplate: "exportTemplate", createTemplate: "createTemplate", selectedColumnCount: "selectedColumnCount", selectedSortCount: "selectedSortCount", selectedFilterTableCount: "selectedFilterTableCount", inputWidth: "inputWidth", showColumnChild: "showColumnChild", showSortChild: "showSortChild", showFilterChild: "showFilterChild", showExportChild: "showExportChild", create: "create", showSelected: "showSelected", isTableView: "isTableView" }, outputs: { viewChange: "viewChange", stateChange: "stateChange", onSearchChange: "onSearchChange" }, ngImport: i0, template: "<div\n  class=\"toolbar flex gap justify-between items-center\"\n>\n  <div class=\"flex items-center gap\">\n    <div *ngIf=\"viewState.isToggle\" class=\"toggle-button-container\">\n      <button type=\"button\" (click)=\"toggleView()\" [ngClass]=\"buttonClass\">\n        <verben-svg\n          [icon]=\"tableIcon\"\n          [class.active]=\"!isTableView\"\n          [ngClass]=\"!isTableView ? activeIconClass : iconClass\"\n        ></verben-svg>\n        <verben-svg\n          [icon]=\"cardIcon\"\n          [class.active]=\"isTableView\"\n          [ngClass]=\"isTableView ? activeIconClass : iconClass\"\n          [width]=\"25\"\n\n          [height]=\"25\"\n        ></verben-svg>\n      </button>\n    </div>\n    <!-- Search Input -->\n    <div\n      [style.width]=\"inputWidth\"\n      class=\"search-input\"\n      *ngIf=\"viewState.isSearch\"\n    >\n      <verbena-input\n        [type]=\"'text'\"\n        [placeHolder]=\"'Search...'\"\n        (input)=\"onSearch($event)\"\n         [bgColor]=\"'transparent'\"\n        [border]=\"'0'\"\n        [value]=\"searchValue\"\n      />\n      <verben-svg\n      *ngIf=\"searchValue.length>0\"\n          [icon]=\"'close'\"\n          [width]=\"15\"\n          (click)=\"onClearSearch()\"\n          class=\"close-icon-class\"\n          [height]=\"15\"\n        ></verben-svg>\n    </div>\n  </div>\n\n  <div class=\"flex items-center relative gap\" [style.margin-left]=\"'10px'\">\n    <!-- Column Section -->\n    <ng-container\n      [appOutSideClick]=\"showColumnChild\"\n      (outSideClick)=\"showColumnChild = false\"\n      *ngIf=\"viewState.isColumn && isTableView\"\n    >\n      <ng-container *ngIf=\"columnTemplate; else defaultColumn\"></ng-container>\n      <ng-template #defaultColumn>\n        <span\n          [ngClass]=\"[\n            'flex gap text-xs items-center pd rounded cursor-pointer',\n            columnCustomClass ? columnCustomClass : ''\n          ]\"\n          [style.background-color]=\"'#D9D9D940'\"\n          (click)=\"toggleChildView('column')\"\n        >\n          <verben-svg [width]=\"15\" [icon]=\"'column'\"></verben-svg>\n          <span\n            >Columns <sup>({{ selectedColumnCount }})</sup></span\n          >\n        </span>\n        <div [style.z-index]=\"zIndex\" class=\"data-view-element\">\n          <ng-content\n            *ngIf=\"showColumnChild\"\n            select=\"[column-content]\"\n          ></ng-content>\n        </div>\n      </ng-template>\n    </ng-container>\n\n    <!-- Filter Section -->\n    <ng-container\n      [appOutSideClick]=\"showFilterChild\"\n      (outSideClick)=\"showFilterChild = false\"\n      *ngIf=\"viewState.isFilter\"\n    >\n      <ng-container *ngIf=\"filterTemplate; else defaultFilter\"></ng-container>\n      <ng-template #defaultFilter>\n        <span\n        [ngClass]=\"[\n        'flex gap text-xs items-center pd rounded cursor-pointer',\n        filterCustomClass ? filterCustomClass : ''\n      ]\"\n          [style.background-color]=\"'#D9D9D940'\"\n          (click)=\"toggleChildView('filter')\"\n        >\n          <verben-svg [width]=\"15\" [icon]=\"'filter'\"></verben-svg>\n          <span\n            >Filter <sup>({{ selectedFilterTableCount }})</sup></span\n          >\n        </span>\n        <div [style.z-index]=\"zIndex\" class=\"data-view-element\">\n          <ng-content\n            *ngIf=\"showFilterChild\"\n            select=\"[filter-content]\"\n          ></ng-content>\n        </div>\n      </ng-template>\n    </ng-container>\n\n    <!-- Sort Section -->\n    <ng-container\n      [appOutSideClick]=\"showSortChild\"\n      (outSideClick)=\"showSortChild = false\"\n      *ngIf=\"viewState.isSort\"\n    >\n      <ng-container *ngIf=\"sortTemplate; else defaultSort\"></ng-container>\n      <ng-template #defaultSort>\n        <span\n        [ngClass]=\"[\n        'flex gap text-xs items-center pd rounded cursor-pointer',\n      sortCustomClass ? sortCustomClass : ''\n      ]\"\n          [style.background-color]=\"'#D9D9D940'\"\n          (click)=\"toggleChildView('sort')\"\n        >\n          <verben-svg [width]=\"15\" [icon]=\"'sort'\"></verben-svg>\n          <span\n            >Sort <sup>({{ selectedSortCount }})</sup></span\n          >\n        </span>\n        <div [style.z-index]=\"zIndex\" class=\"data-view-element\">\n          <ng-content\n            *ngIf=\"showSortChild\"\n            select=\"[sort-content]\"\n          ></ng-content>\n        </div>\n      </ng-template>\n    </ng-container>\n\n    <!-- Export Section -->\n    <ng-container\n      [appOutSideClick]=\"showExportChild\"\n      (outSideClick)=\"showExportChild = false\"\n      *ngIf=\"viewState.isExport\"\n    >\n      <ng-container *ngIf=\"exportTemplate; else defaultExport\"></ng-container>\n      <ng-template #defaultExport>\n        <span\n        [ngClass]=\"[\n        'flex gap text-xs items-center pd rounded cursor-pointer',\n        exportCustomClass ? exportCustomClass : ''\n      ]\"\n          [style.background-color]=\"'#D9D9D940'\"\n          (click)=\"toggleChildView('export')\"\n        >\n          <verben-svg [width]=\"15\" [icon]=\"'export'\"></verben-svg>\n          Export\n        </span>\n        <div [style.z-index]=\"zIndex\" class=\"data-view-element\">\n          <ng-content\n            *ngIf=\"showExportChild\"\n            select=\"[export-content]\"\n          ></ng-content>\n        </div>\n      </ng-template>\n    </ng-container>\n\n    <!-- Select Section -->\n    <div *ngIf=\"viewState.isSelect\">\n      <span\n      [ngClass]=\"[\n      'flex gap text-xs items-center pd rounded cursor-pointer',\n      selectCustomClass ? selectCustomClass : ''\n    ]\"\n        [style.background-color]=\"'#D9D9D940'\"\n        (click)=\"toggleChildView('select')\"\n      >\n        <verben-svg [width]=\"15\" [icon]=\"'select'\"></verben-svg>\n        <span>Select</span>\n        <verben-svg [width]=\"6\" [icon]=\"'chevron-down'\"></verben-svg>\n      </span>\n    </div>\n\n    <!-- Create Button -->\n     \n    <div   [appOutSideClick]=\"create\"\n    (outSideClick)=\"create = false\" *ngIf=\"viewState.isCreate\">\n      <verbena-button\n        class=\"text-sm font-semibold\"\n        [bgColor]=\"'#FFE681'\"\n        [buttonClass]=\"createCustomClass\"\n        [pd]=\"'6px'\"\n        [borderRadius]=\"'4px'\"\n        [textColor]=\"'#000'\"\n        [svg]=\"'add'\"\n        [svgPosition]=\"'right'\"\n        [text]=\"'Create New'\"\n        (click)=\"toggleChildView('create')\"\n      >\n      </verbena-button>\n      <ng-container *ngIf=\"createTemplate; else defaultCreate\"></ng-container>\n      <ng-template #defaultCreate>\n      \n        <div [style.z-index]=\"zIndex\" class=\"data-view-element\">\n          <ng-content\n            *ngIf=\"create\"\n            select=\"[create-content]\"\n          ></ng-content>\n        </div>\n      </ng-template>\n    </div>\n  </div>\n</div>\n\n<!-- Grid and List View Handling -->\n<div *ngIf=\"isTableView; else listViewTemplate\">\n  <div [class]=\"tableClass\">\n    <ng-content select=\"[table-content]\"></ng-content>\n  </div>\n</div>\n<ng-template #listViewTemplate>\n  <div [class]=\"cardClass\">\n    <ng-content select=\"[card-content]\"></ng-content>\n  </div>\n</ng-template>\n", styles: [".toggle-button-container button{display:flex;justify-content:space-between;align-content:center;border:none;background-color:transparent;cursor:pointer;border:1px solid gray;padding:0;border-radius:6px;overflow:hidden;height:35px}.toggle-button-container verben-svg{transition:background-color .5s ease;padding:6px;position:relative}.toggle-button-container verben-svg.active{background-color:#d3d3d3}.flex{display:flex}.justify-between{justify-content:space-between}.items-center{align-items:center}.font-semibold{font-weight:600}.font-normal{font-weight:400}.text-sm{font-size:14px}.text-xs{font-size:12px}.gap{gap:7px}.pd{padding:5px 8px}.rounded-sm{border-radius:10px}.cursor-pointer{cursor:pointer}.search-input{position:relative;background-color:#f9f9f9;border-radius:10px}sup{color:#3479e9;font-weight:500}.data-view-element{position:absolute;top:80px;left:0}.relative{position:relative}.z-10{z-index:100000000000}.close-icon-class{position:absolute;right:10px;cursor:pointer;top:13px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.SvgComponent, selector: "verben-svg", inputs: ["icon", "width", "height", "fill", "stroke", "size"] }, { kind: "component", type: i3.VerbenaInputComponent, selector: "verbena-input", inputs: ["label", "placeHolder", "required", "svgPosition", "minLength", "maxLength", "type", "bgColor", "border", "borderRadius", "textColor", "value", "labelPosition", "labelColor", "disable", "min", "max", "showBorder", "showErrorMessage", "errorMessageColor", "errorBorderColor", "errorPosition", "svg", "svgWidth", "svgHeight", "svgColor", "capitalization", "inputContainerClass", "inputFieldClass", "inputWrapperClass", "customErrorMessages"], outputs: ["valueChange"] }, { kind: "component", type: i4.VerbenaButtonComponent, selector: "verbena-button", inputs: ["text", "icon", "svgPosition", "bgColor", "textColor", "border", "borderRadius", "pd", "width", "height", "fontSize", "fontWeight", "disable", "styleType", "svg", "svgWidth", "svgHeight", "svgColor", "buttonClass", "buttonTextClass"] }, { kind: "directive", type: i5.OutSideClickDirective, selector: "[appOutSideClick]", inputs: ["appOutSideClick"], outputs: ["outSideClick"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.5", ngImport: i0, type: DataViewComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'verben-data-view', template: "<div\n  class=\"toolbar flex gap justify-between items-center\"\n  [style.margin]=\"'0px 35px'\"\n>\n  <div class=\"flex items-center gap\">\n    <div *ngIf=\"viewState.isToggle\" class=\"toggle-button-container\">\n      <button type=\"button\" (click)=\"toggleView()\" [ngClass]=\"buttonClass\">\n        <verben-svg\n          [icon]=\"tableIcon\"\n          [class.active]=\"!isTableView\"\n          [ngClass]=\"!isTableView ? activeIconClass : iconClass\"\n        ></verben-svg>\n        <verben-svg\n          [icon]=\"cardIcon\"\n          [class.active]=\"isTableView\"\n          [ngClass]=\"isTableView ? activeIconClass : iconClass\"\n          [width]=\"25\"\n\n          [height]=\"25\"\n        ></verben-svg>\n      </button>\n    </div>\n    <!-- Search Input -->\n    <div\n      [style.width]=\"inputWidth\"\n      class=\"search-input\"\n      *ngIf=\"viewState.isSearch\"\n    >\n      <verbena-input\n        [type]=\"'text'\"\n        [placeHolder]=\"'Search...'\"\n        (input)=\"onSearch($event)\"\n         [bgColor]=\"'transparent'\"\n        [border]=\"'0'\"\n        [value]=\"searchValue\"\n      />\n      <verben-svg\n      *ngIf=\"searchValue.length>0\"\n          [icon]=\"'close'\"\n          [width]=\"15\"\n          (click)=\"onClearSearch()\"\n          class=\"close-icon-class\"\n          [height]=\"15\"\n        ></verben-svg>\n    </div>\n  </div>\n\n  <div class=\"flex items-center relative gap\" [style.margin-left]=\"'10px'\">\n    <!-- Column Section -->\n    <ng-container\n      [appOutSideClick]=\"showColumnChild\"\n      (outSideClick)=\"showColumnChild = false\"\n      *ngIf=\"viewState.isColumn && isTableView\"\n    >\n      <ng-container *ngIf=\"columnTemplate; else defaultColumn\"></ng-container>\n      <ng-template #defaultColumn>\n        <span\n          [ngClass]=\"[\n            'flex gap text-xs items-center pd rounded cursor-pointer',\n            columnCustomClass ? columnCustomClass : ''\n          ]\"\n          [style.background-color]=\"'#D9D9D940'\"\n          (click)=\"toggleChildView('column')\"\n        >\n          <verben-svg [width]=\"15\" [icon]=\"'column'\"></verben-svg>\n          <span\n            >Columns <sup>({{ selectedColumnCount }})</sup></span\n          >\n        </span>\n        <div [style.z-index]=\"zIndex\" class=\"data-view-element\">\n          <ng-content\n            *ngIf=\"showColumnChild\"\n            select=\"[column-content]\"\n          ></ng-content>\n        </div>\n      </ng-template>\n    </ng-container>\n\n    <!-- Filter Section -->\n    <ng-container\n      [appOutSideClick]=\"showFilterChild\"\n      (outSideClick)=\"showFilterChild = false\"\n      *ngIf=\"viewState.isFilter\"\n    >\n      <ng-container *ngIf=\"filterTemplate; else defaultFilter\"></ng-container>\n      <ng-template #defaultFilter>\n        <span\n        [ngClass]=\"[\n        'flex gap text-xs items-center pd rounded cursor-pointer',\n        filterCustomClass ? filterCustomClass : ''\n      ]\"\n          [style.background-color]=\"'#D9D9D940'\"\n          (click)=\"toggleChildView('filter')\"\n        >\n          <verben-svg [width]=\"15\" [icon]=\"'filter'\"></verben-svg>\n          <span\n            >Filter <sup>({{ selectedFilterTableCount }})</sup></span\n          >\n        </span>\n        <div [style.z-index]=\"zIndex\" class=\"data-view-element\">\n          <ng-content\n            *ngIf=\"showFilterChild\"\n            select=\"[filter-content]\"\n          ></ng-content>\n        </div>\n      </ng-template>\n    </ng-container>\n\n    <!-- Sort Section -->\n    <ng-container\n      [appOutSideClick]=\"showSortChild\"\n      (outSideClick)=\"showSortChild = false\"\n      *ngIf=\"viewState.isSort\"\n    >\n      <ng-container *ngIf=\"sortTemplate; else defaultSort\"></ng-container>\n      <ng-template #defaultSort>\n        <span\n        [ngClass]=\"[\n        'flex gap text-xs items-center pd rounded cursor-pointer',\n      sortCustomClass ? sortCustomClass : ''\n      ]\"\n          [style.background-color]=\"'#D9D9D940'\"\n          (click)=\"toggleChildView('sort')\"\n        >\n          <verben-svg [width]=\"15\" [icon]=\"'sort'\"></verben-svg>\n          <span\n            >Sort <sup>({{ selectedSortCount }})</sup></span\n          >\n        </span>\n        <div [style.z-index]=\"zIndex\" class=\"data-view-element\">\n          <ng-content\n            *ngIf=\"showSortChild\"\n            select=\"[sort-content]\"\n          ></ng-content>\n        </div>\n      </ng-template>\n    </ng-container>\n\n    <!-- Export Section -->\n    <ng-container\n      [appOutSideClick]=\"showExportChild\"\n      (outSideClick)=\"showExportChild = false\"\n      *ngIf=\"viewState.isExport\"\n    >\n      <ng-container *ngIf=\"exportTemplate; else defaultExport\"></ng-container>\n      <ng-template #defaultExport>\n        <span\n        [ngClass]=\"[\n        'flex gap text-xs items-center pd rounded cursor-pointer',\n        exportCustomClass ? exportCustomClass : ''\n      ]\"\n          [style.background-color]=\"'#D9D9D940'\"\n          (click)=\"toggleChildView('export')\"\n        >\n          <verben-svg [width]=\"15\" [icon]=\"'export'\"></verben-svg>\n          Export\n        </span>\n        <div [style.z-index]=\"zIndex\" class=\"data-view-element\">\n          <ng-content\n            *ngIf=\"showExportChild\"\n            select=\"[export-content]\"\n          ></ng-content>\n        </div>\n      </ng-template>\n    </ng-container>\n\n    <!-- Select Section -->\n    <div *ngIf=\"viewState.isSelect\">\n      <span\n      [ngClass]=\"[\n      'flex gap text-xs items-center pd rounded cursor-pointer',\n      selectCustomClass ? selectCustomClass : ''\n    ]\"\n        [style.background-color]=\"'#D9D9D940'\"\n        (click)=\"toggleChildView('select')\"\n      >\n        <verben-svg [width]=\"15\" [icon]=\"'select'\"></verben-svg>\n        <span>Select</span>\n        <verben-svg [width]=\"6\" [icon]=\"'chevron-down'\"></verben-svg>\n      </span>\n    </div>\n\n    <!-- Create Button -->\n     \n    <div   [appOutSideClick]=\"create\"\n    (outSideClick)=\"create = false\" *ngIf=\"viewState.isCreate\">\n      <verbena-button\n        class=\"text-sm font-semibold\"\n        [bgColor]=\"'#FFE681'\"\n        [buttonClass]=\"createCustomClass\"\n        [pd]=\"'6px'\"\n        [borderRadius]=\"'4px'\"\n        [textColor]=\"'#000'\"\n        [svg]=\"'add'\"\n        [svgPosition]=\"'right'\"\n        [text]=\"'Create New'\"\n        (click)=\"toggleChildView('create')\"\n      >\n      </verbena-button>\n      <ng-container *ngIf=\"createTemplate; else defaultCreate\"></ng-container>\n      <ng-template #defaultCreate>\n      \n        <div [style.z-index]=\"zIndex\" class=\"data-view-element\">\n          <ng-content\n            *ngIf=\"create\"\n            select=\"[create-content]\"\n          ></ng-content>\n        </div>\n      </ng-template>\n    </div>\n  </div>\n</div>\n\n<!-- Grid and List View Handling -->\n<div *ngIf=\"isTableView; else listViewTemplate\">\n  <div [class]=\"tableClass\">\n    <ng-content select=\"[table-content]\"></ng-content>\n  </div>\n</div>\n<ng-template #listViewTemplate>\n  <div [class]=\"cardClass\">\n    <ng-content select=\"[card-content]\"></ng-content>\n  </div>\n</ng-template>\n", styles: [".toggle-button-container button{display:flex;justify-content:space-between;align-content:center;border:none;background-color:transparent;cursor:pointer;border:1px solid gray;padding:0;border-radius:6px;overflow:hidden;height:35px}.toggle-button-container verben-svg{transition:background-color .5s ease;padding:6px;position:relative}.toggle-button-container verben-svg.active{background-color:#d3d3d3}.flex{display:flex}.justify-between{justify-content:space-between}.items-center{align-items:center}.font-semibold{font-weight:600}.font-normal{font-weight:400}.text-sm{font-size:14px}.text-xs{font-size:12px}.gap{gap:7px}.pd{padding:5px 8px}.rounded-sm{border-radius:10px}.cursor-pointer{cursor:pointer}.search-input{position:relative;background-color:#f9f9f9;border-radius:10px}sup{color:#3479e9;font-weight:500}.data-view-element{position:absolute;top:80px;left:0}.relative{position:relative}.z-10{z-index:100000000000}.close-icon-class{position:absolute;right:10px;cursor:pointer;top:13px}\n"] }]
+            args: [{ selector: 'verben-data-view', template: "<div\n  class=\"toolbar flex gap justify-between items-center\"\n>\n  <div class=\"flex items-center gap\">\n    <div *ngIf=\"viewState.isToggle\" class=\"toggle-button-container\">\n      <button type=\"button\" (click)=\"toggleView()\" [ngClass]=\"buttonClass\">\n        <verben-svg\n          [icon]=\"tableIcon\"\n          [class.active]=\"!isTableView\"\n          [ngClass]=\"!isTableView ? activeIconClass : iconClass\"\n        ></verben-svg>\n        <verben-svg\n          [icon]=\"cardIcon\"\n          [class.active]=\"isTableView\"\n          [ngClass]=\"isTableView ? activeIconClass : iconClass\"\n          [width]=\"25\"\n\n          [height]=\"25\"\n        ></verben-svg>\n      </button>\n    </div>\n    <!-- Search Input -->\n    <div\n      [style.width]=\"inputWidth\"\n      class=\"search-input\"\n      *ngIf=\"viewState.isSearch\"\n    >\n      <verbena-input\n        [type]=\"'text'\"\n        [placeHolder]=\"'Search...'\"\n        (input)=\"onSearch($event)\"\n         [bgColor]=\"'transparent'\"\n        [border]=\"'0'\"\n        [value]=\"searchValue\"\n      />\n      <verben-svg\n      *ngIf=\"searchValue.length>0\"\n          [icon]=\"'close'\"\n          [width]=\"15\"\n          (click)=\"onClearSearch()\"\n          class=\"close-icon-class\"\n          [height]=\"15\"\n        ></verben-svg>\n    </div>\n  </div>\n\n  <div class=\"flex items-center relative gap\" [style.margin-left]=\"'10px'\">\n    <!-- Column Section -->\n    <ng-container\n      [appOutSideClick]=\"showColumnChild\"\n      (outSideClick)=\"showColumnChild = false\"\n      *ngIf=\"viewState.isColumn && isTableView\"\n    >\n      <ng-container *ngIf=\"columnTemplate; else defaultColumn\"></ng-container>\n      <ng-template #defaultColumn>\n        <span\n          [ngClass]=\"[\n            'flex gap text-xs items-center pd rounded cursor-pointer',\n            columnCustomClass ? columnCustomClass : ''\n          ]\"\n          [style.background-color]=\"'#D9D9D940'\"\n          (click)=\"toggleChildView('column')\"\n        >\n          <verben-svg [width]=\"15\" [icon]=\"'column'\"></verben-svg>\n          <span\n            >Columns <sup>({{ selectedColumnCount }})</sup></span\n          >\n        </span>\n        <div [style.z-index]=\"zIndex\" class=\"data-view-element\">\n          <ng-content\n            *ngIf=\"showColumnChild\"\n            select=\"[column-content]\"\n          ></ng-content>\n        </div>\n      </ng-template>\n    </ng-container>\n\n    <!-- Filter Section -->\n    <ng-container\n      [appOutSideClick]=\"showFilterChild\"\n      (outSideClick)=\"showFilterChild = false\"\n      *ngIf=\"viewState.isFilter\"\n    >\n      <ng-container *ngIf=\"filterTemplate; else defaultFilter\"></ng-container>\n      <ng-template #defaultFilter>\n        <span\n        [ngClass]=\"[\n        'flex gap text-xs items-center pd rounded cursor-pointer',\n        filterCustomClass ? filterCustomClass : ''\n      ]\"\n          [style.background-color]=\"'#D9D9D940'\"\n          (click)=\"toggleChildView('filter')\"\n        >\n          <verben-svg [width]=\"15\" [icon]=\"'filter'\"></verben-svg>\n          <span\n            >Filter <sup>({{ selectedFilterTableCount }})</sup></span\n          >\n        </span>\n        <div [style.z-index]=\"zIndex\" class=\"data-view-element\">\n          <ng-content\n            *ngIf=\"showFilterChild\"\n            select=\"[filter-content]\"\n          ></ng-content>\n        </div>\n      </ng-template>\n    </ng-container>\n\n    <!-- Sort Section -->\n    <ng-container\n      [appOutSideClick]=\"showSortChild\"\n      (outSideClick)=\"showSortChild = false\"\n      *ngIf=\"viewState.isSort\"\n    >\n      <ng-container *ngIf=\"sortTemplate; else defaultSort\"></ng-container>\n      <ng-template #defaultSort>\n        <span\n        [ngClass]=\"[\n        'flex gap text-xs items-center pd rounded cursor-pointer',\n      sortCustomClass ? sortCustomClass : ''\n      ]\"\n          [style.background-color]=\"'#D9D9D940'\"\n          (click)=\"toggleChildView('sort')\"\n        >\n          <verben-svg [width]=\"15\" [icon]=\"'sort'\"></verben-svg>\n          <span\n            >Sort <sup>({{ selectedSortCount }})</sup></span\n          >\n        </span>\n        <div [style.z-index]=\"zIndex\" class=\"data-view-element\">\n          <ng-content\n            *ngIf=\"showSortChild\"\n            select=\"[sort-content]\"\n          ></ng-content>\n        </div>\n      </ng-template>\n    </ng-container>\n\n    <!-- Export Section -->\n    <ng-container\n      [appOutSideClick]=\"showExportChild\"\n      (outSideClick)=\"showExportChild = false\"\n      *ngIf=\"viewState.isExport\"\n    >\n      <ng-container *ngIf=\"exportTemplate; else defaultExport\"></ng-container>\n      <ng-template #defaultExport>\n        <span\n        [ngClass]=\"[\n        'flex gap text-xs items-center pd rounded cursor-pointer',\n        exportCustomClass ? exportCustomClass : ''\n      ]\"\n          [style.background-color]=\"'#D9D9D940'\"\n          (click)=\"toggleChildView('export')\"\n        >\n          <verben-svg [width]=\"15\" [icon]=\"'export'\"></verben-svg>\n          Export\n        </span>\n        <div [style.z-index]=\"zIndex\" class=\"data-view-element\">\n          <ng-content\n            *ngIf=\"showExportChild\"\n            select=\"[export-content]\"\n          ></ng-content>\n        </div>\n      </ng-template>\n    </ng-container>\n\n    <!-- Select Section -->\n    <div *ngIf=\"viewState.isSelect\">\n      <span\n      [ngClass]=\"[\n      'flex gap text-xs items-center pd rounded cursor-pointer',\n      selectCustomClass ? selectCustomClass : ''\n    ]\"\n        [style.background-color]=\"'#D9D9D940'\"\n        (click)=\"toggleChildView('select')\"\n      >\n        <verben-svg [width]=\"15\" [icon]=\"'select'\"></verben-svg>\n        <span>Select</span>\n        <verben-svg [width]=\"6\" [icon]=\"'chevron-down'\"></verben-svg>\n      </span>\n    </div>\n\n    <!-- Create Button -->\n     \n    <div   [appOutSideClick]=\"create\"\n    (outSideClick)=\"create = false\" *ngIf=\"viewState.isCreate\">\n      <verbena-button\n        class=\"text-sm font-semibold\"\n        [bgColor]=\"'#FFE681'\"\n        [buttonClass]=\"createCustomClass\"\n        [pd]=\"'6px'\"\n        [borderRadius]=\"'4px'\"\n        [textColor]=\"'#000'\"\n        [svg]=\"'add'\"\n        [svgPosition]=\"'right'\"\n        [text]=\"'Create New'\"\n        (click)=\"toggleChildView('create')\"\n      >\n      </verbena-button>\n      <ng-container *ngIf=\"createTemplate; else defaultCreate\"></ng-container>\n      <ng-template #defaultCreate>\n      \n        <div [style.z-index]=\"zIndex\" class=\"data-view-element\">\n          <ng-content\n            *ngIf=\"create\"\n            select=\"[create-content]\"\n          ></ng-content>\n        </div>\n      </ng-template>\n    </div>\n  </div>\n</div>\n\n<!-- Grid and List View Handling -->\n<div *ngIf=\"isTableView; else listViewTemplate\">\n  <div [class]=\"tableClass\">\n    <ng-content select=\"[table-content]\"></ng-content>\n  </div>\n</div>\n<ng-template #listViewTemplate>\n  <div [class]=\"cardClass\">\n    <ng-content select=\"[card-content]\"></ng-content>\n  </div>\n</ng-template>\n", styles: [".toggle-button-container button{display:flex;justify-content:space-between;align-content:center;border:none;background-color:transparent;cursor:pointer;border:1px solid gray;padding:0;border-radius:6px;overflow:hidden;height:35px}.toggle-button-container verben-svg{transition:background-color .5s ease;padding:6px;position:relative}.toggle-button-container verben-svg.active{background-color:#d3d3d3}.flex{display:flex}.justify-between{justify-content:space-between}.items-center{align-items:center}.font-semibold{font-weight:600}.font-normal{font-weight:400}.text-sm{font-size:14px}.text-xs{font-size:12px}.gap{gap:7px}.pd{padding:5px 8px}.rounded-sm{border-radius:10px}.cursor-pointer{cursor:pointer}.search-input{position:relative;background-color:#f9f9f9;border-radius:10px}sup{color:#3479e9;font-weight:500}.data-view-element{position:absolute;top:80px;left:0}.relative{position:relative}.z-10{z-index:100000000000}.close-icon-class{position:absolute;right:10px;cursor:pointer;top:13px}\n"] }]
         }], propDecorators: { buttonClass: [{
                 type: Input
             }], iconClass: [{
@@ -209,4 +208,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.5", ngImpor
             }], onSearchChange: [{
                 type: Output
             }] } });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGF0YS12aWV3LmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL3ZlcmJlbi1uZy11aS9zcmMvbGliL2NvbXBvbmVudHMvZGF0YS12aWV3L2RhdGEtdmlldy5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy92ZXJiZW4tbmctdWkvc3JjL2xpYi9jb21wb25lbnRzL2RhdGEtdmlldy9kYXRhLXZpZXcuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUNMLFNBQVMsRUFDVCxZQUFZLEVBQ1osS0FBSyxFQUVMLE1BQU0sR0FDUCxNQUFNLGVBQWUsQ0FBQzs7Ozs7OztBQWtCdkIsTUFBTSxPQUFPLGlCQUFpQjtJQUNuQixXQUFXLENBQVU7SUFDckIsU0FBUyxDQUFVO0lBQ25CLGVBQWUsR0FBVSxFQUFFLENBQUE7SUFDM0IsaUJBQWlCLEdBQVMsRUFBRSxDQUFBO0lBQzVCLGlCQUFpQixHQUFTLEVBQUUsQ0FBQTtJQUM1QixlQUFlLEdBQVMsRUFBRSxDQUFBO0lBQzFCLGlCQUFpQixHQUFTLEVBQUUsQ0FBQTtJQUM1QixpQkFBaUIsR0FBUyxFQUFFLENBQUE7SUFDNUIsTUFBTSxHQUFTLENBQUMsQ0FBQTtJQUNoQixpQkFBaUIsR0FBUSxFQUFFLENBQUE7SUFDM0IsU0FBUyxHQUFXLFFBQVEsQ0FBQztJQUM3QixRQUFRLEdBQVcsV0FBVyxDQUFDO0lBQy9CLFNBQVMsR0FBVyxFQUFFLENBQUM7SUFDdkIsVUFBVSxHQUFXLEVBQUUsQ0FBQztJQUN4QixTQUFTLEdBQVEsUUFBUSxDQUFDO0lBQzFCLFdBQVcsR0FBUSxFQUFFLENBQUM7SUFDdEIsU0FBUyxHQUFjO1FBQzlCLFFBQVEsRUFBRSxJQUFJO1FBQ2QsUUFBUSxFQUFFLElBQUk7UUFDZCxRQUFRLEVBQUUsSUFBSTtRQUNkLE1BQU0sRUFBRSxJQUFJO1FBQ1osUUFBUSxF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QXZCLEtBQUs7Z0JBQ0csZUFBZTtzQkFBdkIsS0FBSztnQkFDRyxNQUFNO3NCQUFkLEtBQUs7Z0JBQ0csWUFBWTtzQkFBcEIsS0FBSztnQkFDRyxXQUFXO3NCQUFuQixLQUFLO2dCQUNJLFVBQVU7c0JBQW5CLE1BQU07Z0JBQ0csV0FBVztzQkFBcEIsTUFBTTtnQkFDRyxjQUFjO3NCQUF2QixNQUFNIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtcbiAgQ29tcG9uZW50LFxuICBFdmVudEVtaXR0ZXIsXG4gIElucHV0LFxuICBPbkluaXQsXG4gIE91dHB1dCxcbn0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbmludGVyZmFjZSBWaWV3U3RhdGUge1xuICBpc1NlYXJjaD86IGJvb2xlYW47XG4gIGlzQ29sdW1uPzogYm9vbGVhbjtcbiAgaXNGaWx0ZXI/OiBib29sZWFuO1xuICBpc1NvcnQ/OiBib29sZWFuO1xuICBpc0V4cG9ydD86IGJvb2xlYW47XG4gIGlzU2VsZWN0PzogYm9vbGVhbjtcbiAgaXNDcmVhdGU/OmJvb2xlYW5cbiAgaXNUb2dnbGU/OmJvb2xlYW5cbn1cblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAndmVyYmVuLWRhdGEtdmlldycsXG4gIHRlbXBsYXRlVXJsOiAnLi9kYXRhLXZpZXcuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybHM6IFsnLi9kYXRhLXZpZXcuY29tcG9uZW50LmNzcyddLFxufSlcbmV4cG9ydCBjbGFzcyBEYXRhVmlld0NvbXBvbmVudCBpbXBsZW1lbnRzIE9uSW5pdCB7XG4gIEBJbnB1dCgpIGJ1dHRvbkNsYXNzPzogc3RyaW5nO1xuICBASW5wdXQoKSBpY29uQ2xhc3M/OiBzdHJpbmc7XG4gIEBJbnB1dCgpIGFjdGl2ZUljb25DbGFzcz86IHN0cmluZz1cIlwiXG4gIEBJbnB1dCgpIGNvbHVtbkN1c3RvbUNsYXNzPzpzdHJpbmc9JydcbiAgQElucHV0KCkgZmlsdGVyQ3VzdG9tQ2xhc3M/OnN0cmluZz0nJ1xuICBASW5wdXQoKSBzb3J0Q3VzdG9tQ2xhc3M/OnN0cmluZz0nJ1xuICBASW5wdXQoKSBleHBvcnRDdXN0b21DbGFzcz86c3RyaW5nPScnXG4gIEBJbnB1dCgpIHNlbGVjdEN1c3RvbUNsYXNzPzpzdHJpbmc9JydcbiAgQElucHV0KCkgekluZGV4PzpudW1iZXI9NVxuICBASW5wdXQoKSBjcmVhdGVDdXN0b21DbGFzczpzdHJpbmc9JydcbiAgQElucHV0KCkgdGFibGVJY29uOiBzdHJpbmcgPSAnZ3JpZC0zJztcbiAgQElucHV0KCkgY2FyZEljb246IHN0cmluZyA9ICdsaXN0LXZpZXcnO1xuICBASW5wdXQoKSBjYXJkQ2xhc3M6IHN0cmluZyA9ICcnO1xuICBASW5wdXQoKSB0YWJsZUNsYXNzOiBzdHJpbmcgPSAnJztcbiAgQElucHV0KCkgc2VhcmNoS2V5OnN0cmluZz0nc2VhcmNoJztcbiAgQElucHV0KCkgc2VhcmNoVmFsdWU6c3RyaW5nPScnO1xuICBASW5wdXQoKSB2aWV3U3RhdGU6IFZpZXdTdGF0ZSA9IHtcbiAgICBpc1NlYXJjaDogdHJ1ZSxcbiAgICBpc0NvbHVtbjogdHJ1ZSxcbiAgICBpc0ZpbHRlcjogdHJ1ZSxcbiAgICBpc1NvcnQ6IHRydWUsXG4gICAgaXNFeHBvcnQ6IHRydWUsXG4gICAgaXNTZWxlY3Q6IHRydWUsXG4gICAgaXNDcmVhdGU6dHJ1ZSxcbiAgICBpc1RvZ2dsZTp0cnVlXG4gIH07XG5cbiAgQElucHV0KCkgc2VhcmNoVGVtcGxhdGU/OiBOb2RlO1xuICBASW5wdXQoKSBjb2x1bW5UZW1wbGF0ZT86IE5vZGU7XG4gIEBJbnB1dCgpIGZpbHRlclRlbXBsYXRlPzogTm9kZTtcbiAgQElucHV0KCkgc29ydFRlbXBsYXRlPzogTm9kZTtcbiAgQElucHV0KCkgZXhwb3J0VGVtcGxhdGU/OiBOb2RlO1xuICBASW5wdXQoKSBjcmVhdGVUZW1wbGF0ZT86IE5vZGU7XG4gIEBJbnB1dCgpIHNlbGVjdGVkQ29sdW1uQ291bnQ/OiBudW1iZXIgPSAwO1xuICBASW5wdXQoKSBzZWxlY3RlZFNvcnRDb3VudDogbnVtYmVyID0gMDtcbiAgQElucHV0KCkgc2VsZWN0ZWRGaWx0ZXJUYWJsZUNvdW50OiBudW1iZXIgPSAwO1xuICBASW5wdXQoKSBpbnB1dFdpZHRoOiBzdHJpbmc9XCIzNTBweFwiO1xuICBASW5wdXQoKXNob3dDb2x1bW5DaGlsZDogYm9vbGVhbiA9IGZhbHNlO1xuICBASW5wdXQoKSBzaG93U29ydENoaWxkOiBib29sZWFuID0gZmFsc2U7XG4gIEBJbnB1dCgpIHNob3dGaWx0ZXJDaGlsZDogYm9vbGVhbiA9IGZhbHNlO1xuICBASW5wdXQoKSBzaG93RXhwb3J0Q2hpbGQ6IGJvb2xlYW4gPSBmYWxzZTtcbiAgQElucHV0KCkgY3JlYXRlOiBib29sZWFuID0gZmFsc2U7XG4gIEBJbnB1dCgpIHNob3dTZWxlY3RlZDogYm9vbGVhbiA9IGZhbHNlO1xuICBASW5wdXQoKSBpc1RhYmxlVmlldzogYm9vbGVhbiA9IGZhbHNlO1xuICBAT3V0cHV0KCkgdmlld0NoYW5nZSA9IG5ldyBFdmVudEVtaXR0ZXI8Ym9vbGVhbj4oKTtcbiAgQE91dHB1dCgpIHN0YXRlQ2hhbmdlID0gbmV3IEV2ZW50RW1pdHRlcjx7IGtleTogc3RyaW5nOyB2YWx1ZTogYm9vbGVhbiB9PigpO1xuICBAT3V0cHV0KCkgb25TZWFyY2hDaGFuZ2U9bmV3IEV2ZW50RW1pdHRlcjx7IGtleTogc3RyaW5nOyB2YWx1ZTogc3RyaW5nIH0+KClcbiAgbmdPbkluaXQoKTogdm9pZCB7fVxuXG4gIHRvZ2dsZVZpZXcoKTogdm9pZCB7XG4gICAgdGhpcy5pc1RhYmxlVmlldyA9ICF0aGlzLmlzVGFibGVWaWV3O1xuICAgIHRoaXMudmlld0NoYW5nZS5lbWl0KHRoaXMuaXNUYWJsZVZpZXcpO1xuICB9XG5cbiAgb25TZWFyY2goZXZlbnQ6YW55KTogdm9pZCB7XG4gICAgdGhpcy5zZWFyY2hWYWx1ZT1ldmVudC50YXJnZXQudmFsdWVcbiAgICBjb25zb2xlLmxvZyh7a2V5OnRoaXMuc2VhcmNoS2V5LCB2YWx1ZTpldmVudC50YXJnZXQudmFsdWV9KTtcbiAgICB0aGlzLm9uU2VhcmNoQ2hhbmdlLmVtaXQoe2tleTp0aGlzLnNlYXJjaEtleSwgdmFsdWU6dGhpcy5zZWFyY2hWYWx1ZX0pO1xuICB9XG4gIFxub25DbGVhclNlYXJjaCgpe1xuIHRoaXMuc2VhcmNoVmFsdWU9XCJcIlxufVxuICB0b2dnbGVDaGlsZFZpZXcodmlld1R5cGU6IHN0cmluZyk6IHZvaWQge1xuICAgIHN3aXRjaCAodmlld1R5cGUpIHtcbiAgICAgIGNhc2UgJ2NvbHVtbic6XG4gICAgICAgIHRoaXMuc2hvd0NvbHVtbkNoaWxkID0gIXRoaXMuc2hvd0NvbHVtbkNoaWxkO1xuICAgICAgICB0aGlzLnJlc2V0Q2hpbGRWaWV3c0V4Y2VwdCgnY29sdW1uJyk7XG4gICAgICAgIGJyZWFrO1xuICAgICAgY2FzZSAnZmlsdGVyJzpcbiAgICAgICAgdGhpcy5zaG93RmlsdGVyQ2hpbGQgPSAhdGhpcy5zaG93RmlsdGVyQ2hpbGQ7XG4gICAgICAgIHRoaXMucmVzZXRDaGlsZFZpZXdzRXhjZXB0KCdmaWx0ZXInKTtcbiAgICAgICAgYnJlYWs7XG4gICAgICBjYXNlICdzb3J0JzpcbiAgICAgICAgdGhpcy5zaG93U29ydENoaWxkID0gIXRoaXMuc2hvd1NvcnRDaGlsZDtcbiAgICAgICAgdGhpcy5yZXNldENoaWxkVmlld3NFeGNlcHQoJ3NvcnQnKTtcbiAgICAgICAgYnJlYWs7XG4gICAgICBjYXNlICdzZWxlY3QnOlxuICAgICAgICB0aGlzLnNob3dTZWxlY3RlZCA9ICF0aGlzLnNob3dTZWxlY3RlZDtcbiAgICAgICAgdGhpcy5yZXNldENoaWxkVmlld3NFeGNlcHQoJ3NlbGVjdCcpO1xuICAgICAgICBicmVhaztcbiAgICAgIGNhc2UgJ2V4cG9ydCc6XG4gICAgICAgIHRoaXMuc2hvd0V4cG9ydENoaWxkID0gIXRoaXMuc2hvd0V4cG9ydENoaWxkO1xuICAgICAgICB0aGlzLnJlc2V0Q2hpbGRWaWV3c0V4Y2VwdCgnZXhwb3J0Jyk7XG4gICAgICAgIGJyZWFrO1xuICAgICAgICBjYXNlICdjcmVhdGUnOlxuICAgICAgICAgIHRoaXMuY3JlYXRlID0gIXRoaXMuY3JlYXRlO1xuICAgICAgICAgIHRoaXMucmVzZXRDaGlsZFZpZXdzRXhjZXB0KCdjcmVhdGUnKTtcbiAgICAgICAgICBicmVhaztcbiAgICB9XG4gICAgdGhpcy5zdGF0ZUNoYW5nZS5lbWl0KHsga2V5OiB2aWV3VHlwZSwgdmFsdWU6IHRoaXMuZ2V0Q2hpbGRWaWV3U3RhdGUodmlld1R5cGUpIH0pO1xuICB9XG5cbiAgLy8gUmVzZXQgb3RoZXIgY2hpbGQgdmlld3Mgd2hlbiBvbmUgaXMgdG9nZ2xlZFxuICByZXNldENoaWxkVmlld3NFeGNlcHQodmlld1R5cGU6IHN0cmluZyk6IHZvaWQge1xuICAgIGlmICh2aWV3VHlwZSAhPT0gJ2NvbHVtbicpIHRoaXMuc2hvd0NvbHVtbkNoaWxkID0gZmFsc2U7XG4gICAgaWYgKHZpZXdUeXBlICE9PSAnZmlsdGVyJykgdGhpcy5zaG93RmlsdGVyQ2hpbGQgPSBmYWxzZTtcbiAgICBpZiAodmlld1R5cGUgIT09ICdzb3J0JykgdGhpcy5zaG93U29ydENoaWxkID0gZmFsc2U7XG4gICAgaWYgKHZpZXdUeXBlICE9PSAnc2VsZWN0JykgdGhpcy5zaG93U2VsZWN0ZWQgPSBmYWxzZTtcbiAgICBpZiAodmlld1R5cGUgIT09ICdleHBvcnQnKSB0aGlzLnNob3dFeHBvcnRDaGlsZCA9IGZhbHNlO1xuICAgIGlmICh2aWV3VHlwZSAhPT0gJ2NyZWF0ZScpIHRoaXMuY3JlYXRlID0gZmFsc2U7XG4gIH1cblxuICAvLyBIZWxwZXIgbWV0aG9kIHRvIGdldCB0aGUgc3RhdGUgb2YgYSBzcGVjaWZpYyBjaGlsZCB2aWV3XG4gIGdldENoaWxkVmlld1N0YXRlKHZpZXdUeXBlOiBzdHJpbmcpOiBib29sZWFuIHtcbiAgICBzd2l0Y2ggKHZpZXdUeXBlKSB7XG4gICAgICBjYXNlICdjb2x1bW4nOlxuICAgICAgICByZXR1cm4gdGhpcy5zaG93Q29sdW1uQ2hpbGQ7XG4gICAgICBjYXNlICdmaWx0ZXInOlxuICAgICAgICByZXR1cm4gdGhpcy5zaG93RmlsdGVyQ2hpbGQ7XG4gICAgICBjYXNlICdzb3J0JzpcbiAgICAgICAgcmV0dXJuIHRoaXMuc2hvd1NvcnRDaGlsZDtcbiAgICAgIGNhc2UgJ3NlbGVjdCc6XG4gICAgICAgIHJldHVybiB0aGlzLnNob3dTZWxlY3RlZDtcbiAgICAgIGNhc2UgJ2V4cG9ydCc6XG4gICAgICAgIHJldHVybiB0aGlzLnNob3dFeHBvcnRDaGlsZDtcbiAgICAgICAgY2FzZSAnY3JlYXRlJzpcbiAgICAgICAgcmV0dXJuIHRoaXMuY3JlYXRlO1xuICAgICAgZGVmYXVsdDpcbiAgICAgICAgcmV0dXJuIGZhbHNlO1xuICAgIH1cbiAgfVxufVxuIiwiPGRpdlxuICBjbGFzcz1cInRvb2xiYXIgZmxleCBnYXAganVzdGlmeS1iZXR3ZWVuIGl0ZW1zLWNlbnRlclwiXG4gIFtzdHlsZS5tYXJnaW5dPVwiJzBweCAzNXB4J1wiXG4+XG4gIDxkaXYgY2xhc3M9XCJmbGV4IGl0ZW1zLWNlbnRlciBnYXBcIj5cbiAgICA8ZGl2ICpuZ0lmPVwidmlld1N0YXRlLmlzVG9nZ2xlXCIgY2xhc3M9XCJ0b2dnbGUtYnV0dG9uLWNvbnRhaW5lclwiPlxuICAgICAgPGJ1dHRvbiB0eXBlPVwiYnV0dG9uXCIgKGNsaWNrKT1cInRvZ2dsZVZpZXcoKVwiIFtuZ0NsYXNzXT1cImJ1dHRvbkNsYXNzXCI+XG4gICAgICAgIDx2ZXJiZW4tc3ZnXG4gICAgICAgICAgW2ljb25dPVwidGFibGVJY29uXCJcbiAgICAgICAgICBbY2xhc3MuYWN0aXZlXT1cIiFpc1RhYmxlVmlld1wiXG4gICAgICAgICAgW25nQ2xhc3NdPVwiIWlzVGFibGVWaWV3ID8gYWN0aXZlSWNvbkNsYXNzIDogaWNvbkNsYXNzXCJcbiAgICAgICAgPjwvdmVyYmVuLXN2Zz5cbiAgICAgICAgPHZlcmJlbi1zdmdcbiAgICAgICAgICBbaWNvbl09XCJjYXJkSWNvblwiXG4gICAgICAgICAgW2NsYXNzLmFjdGl2ZV09XCJpc1RhYmxlVmlld1wiXG4gICAgICAgICAgW25nQ2xhc3NdPVwiaXNUYWJsZVZpZXcgPyBhY3RpdmVJY29uQ2xhc3MgOiBpY29uQ2xhc3NcIlxuICAgICAgICAgIFt3aWR0aF09XCIyNVwiXG5cbiAgICAgICAgICBbaGVpZ2h0XT1cIjI1XCJcbiAgICAgICAgPjwvdmVyYmVuLXN2Zz5cbiAgICAgIDwvYnV0dG9uPlxuICAgIDwvZGl2PlxuICAgIDwhLS0gU2VhcmNoIElucHV0IC0tPlxuICAgIDxkaXZcbiAgICAgIFtzdHlsZS53aWR0aF09XCJpbnB1dFdpZHRoXCJcbiAgICAgIGNsYXNzPVwic2VhcmNoLWlucHV0XCJcbiAgICAgICpuZ0lmPVwidmlld1N0YXRlLmlzU2VhcmNoXCJcbiAgICA+XG4gICAgICA8dmVyYmVuYS1pbnB1dFxuICAgICAgICBbdHlwZV09XCIndGV4dCdcIlxuICAgICAgICBbcGxhY2VIb2xkZXJdPVwiJ1NlYXJjaC4uLidcIlxuICAgICAgICAoaW5wdXQpPVwib25TZWFyY2goJGV2ZW50KVwiXG4gICAgICAgICBbYmdDb2xvcl09XCIndHJhbnNwYXJlbnQnXCJcbiAgICAgICAgW2JvcmRlcl09XCInMCdcIlxuICAgICAgICBbdmFsdWVdPVwic2VhcmNoVmFsdWVcIlxuICAgICAgLz5cbiAgICAgIDx2ZXJiZW4tc3ZnXG4gICAgICAqbmdJZj1cInNlYXJjaFZhbHVlLmxlbmd0aD4wXCJcbiAgICAgICAgICBbaWNvbl09XCInY2xvc2UnXCJcbiAgICAgICAgICBbd2lkdGhdPVwiMTVcIlxuICAgICAgICAgIChjbGljayk9XCJvbkNsZWFyU2VhcmNoKClcIlxuICAgICAgICAgIGNsYXNzPVwiY2xvc2UtaWNvbi1jbGFzc1wiXG4gICAgICAgICAgW2hlaWdodF09XCIxNVwiXG4gICAgICAgID48L3ZlcmJlbi1zdmc+XG4gICAgPC9kaXY+XG4gIDwvZGl2PlxuXG4gIDxkaXYgY2xhc3M9XCJmbGV4IGl0ZW1zLWNlbnRlciByZWxhdGl2ZSBnYXBcIiBbc3R5bGUubWFyZ2luLWxlZnRdPVwiJzEwcHgnXCI+XG4gICAgPCEtLSBDb2x1bW4gU2VjdGlvbiAtLT5cbiAgICA8bmctY29udGFpbmVyXG4gICAgICBbYXBwT3V0U2lkZUNsaWNrXT1cInNob3dDb2x1bW5DaGlsZFwiXG4gICAgICAob3V0U2lkZUNsaWNrKT1cInNob3dDb2x1bW5DaGlsZCA9IGZhbHNlXCJcbiAgICAgICpuZ0lmPVwidmlld1N0YXRlLmlzQ29sdW1uICYmIGlzVGFibGVWaWV3XCJcbiAgICA+XG4gICAgICA8bmctY29udGFpbmVyICpuZ0lmPVwiY29sdW1uVGVtcGxhdGU7IGVsc2UgZGVmYXVsdENvbHVtblwiPjwvbmctY29udGFpbmVyPlxuICAgICAgPG5nLXRlbXBsYXRlICNkZWZhdWx0Q29sdW1uPlxuICAgICAgICA8c3BhblxuICAgICAgICAgIFtuZ0NsYXNzXT1cIltcbiAgICAgICAgICAgICdmbGV4IGdhcCB0ZXh0LXhzIGl0ZW1zLWNlbnRlciBwZCByb3VuZGVkIGN1cnNvci1wb2ludGVyJyxcbiAgICAgICAgICAgIGNvbHVtbkN1c3RvbUNsYXNzID8gY29sdW1uQ3VzdG9tQ2xhc3MgOiAnJ1xuICAgICAgICAgIF1cIlxuICAgICAgICAgIFtzdHlsZS5iYWNrZ3JvdW5kLWNvbG9yXT1cIicjRDlEOUQ5NDAnXCJcbiAgICAgICAgICAoY2xpY2spPVwidG9nZ2xlQ2hpbGRWaWV3KCdjb2x1bW4nKVwiXG4gICAgICAgID5cbiAgICAgICAgICA8dmVyYmVuLXN2ZyBbd2lkdGhdPVwiMTVcIiBbaWNvbl09XCInY29sdW1uJ1wiPjwvdmVyYmVuLXN2Zz5cbiAgICAgICAgICA8c3BhblxuICAgICAgICAgICAgPkNvbHVtbnMgPHN1cD4oe3sgc2VsZWN0ZWRDb2x1bW5Db3VudCB9fSk8L3N1cD48L3NwYW5cbiAgICAgICAgICA+XG4gICAgICAgIDwvc3Bhbj5cbiAgICAgICAgPGRpdiBbc3R5bGUuei1pbmRleF09XCJ6SW5kZXhcIiBjbGFzcz1cImRhdGEtdmlldy1lbGVtZW50XCI+XG4gICAgICAgICAgPG5nLWNvbnRlbnRcbiAgICAgICAgICAgICpuZ0lmPVwic2hvd0NvbHVtbkNoaWxkXCJcbiAgICAgICAgICAgIHNlbGVjdD1cIltjb2x1bW4tY29udGVudF1cIlxuICAgICAgICAgID48L25nLWNvbnRlbnQ+XG4gICAgICAgIDwvZGl2PlxuICAgICAgPC9uZy10ZW1wbGF0ZT5cbiAgICA8L25nLWNvbnRhaW5lcj5cblxuICAgIDwhLS0gRmlsdGVyIFNlY3Rpb24gLS0+XG4gICAgPG5nLWNvbnRhaW5lclxuICAgICAgW2FwcE91dFNpZGVDbGlja109XCJzaG93RmlsdGVyQ2hpbGRcIlxuICAgICAgKG91dFNpZGVDbGljayk9XCJzaG93RmlsdGVyQ2hpbGQgPSBmYWxzZVwiXG4gICAgICAqbmdJZj1cInZpZXdTdGF0ZS5pc0ZpbHRlclwiXG4gICAgPlxuICAgICAgPG5nLWNvbnRhaW5lciAqbmdJZj1cImZpbHRlclRlbXBsYXRlOyBlbHNlIGRlZmF1bHRGaWx0ZXJcIj48L25nLWNvbnRhaW5lcj5cbiAgICAgIDxuZy10ZW1wbGF0ZSAjZGVmYXVsdEZpbHRlcj5cbiAgICAgICAgPHNwYW5cbiAgICAgICAgW25nQ2xhc3NdPVwiW1xuICAgICAgICAnZmxleCBnYXAgdGV4dC14cyBpdGVtcy1jZW50ZXIgcGQgcm91bmRlZCBjdXJzb3ItcG9pbnRlcicsXG4gICAgICAgIGZpbHRlckN1c3RvbUNsYXNzID8gZmlsdGVyQ3VzdG9tQ2xhc3MgOiAnJ1xuICAgICAgXVwiXG4gICAgICAgICAgW3N0eWxlLmJhY2tncm91bmQtY29sb3JdPVwiJyNEOUQ5RDk0MCdcIlxuICAgICAgICAgIChjbGljayk9XCJ0b2dnbGVDaGlsZFZpZXcoJ2ZpbHRlcicpXCJcbiAgICAgICAgPlxuICAgICAgICAgIDx2ZXJiZW4tc3ZnIFt3aWR0aF09XCIxNVwiIFtpY29uXT1cIidmaWx0ZXInXCI+PC92ZXJiZW4tc3ZnPlxuICAgICAgICAgIDxzcGFuXG4gICAgICAgICAgICA+RmlsdGVyIDxzdXA+KHt7IHNlbGVjdGVkRmlsdGVyVGFibGVDb3VudCB9fSk8L3N1cD48L3NwYW5cbiAgICAgICAgICA+XG4gICAgICAgIDwvc3Bhbj5cbiAgICAgICAgPGRpdiBbc3R5bGUuei1pbmRleF09XCJ6SW5kZXhcIiBjbGFzcz1cImRhdGEtdmlldy1lbGVtZW50XCI+XG4gICAgICAgICAgPG5nLWNvbnRlbnRcbiAgICAgICAgICAgICpuZ0lmPVwic2hvd0ZpbHRlckNoaWxkXCJcbiAgICAgICAgICAgIHNlbGVjdD1cIltmaWx0ZXItY29udGVudF1cIlxuICAgICAgICAgID48L25nLWNvbnRlbnQ+XG4gICAgICAgIDwvZGl2PlxuICAgICAgPC9uZy10ZW1wbGF0ZT5cbiAgICA8L25nLWNvbnRhaW5lcj5cblxuICAgIDwhLS0gU29ydCBTZWN0aW9uIC0tPlxuICAgIDxuZy1jb250YWluZXJcbiAgICAgIFthcHBPdXRTaWRlQ2xpY2tdPVwic2hvd1NvcnRDaGlsZFwiXG4gICAgICAob3V0U2lkZUNsaWNrKT1cInNob3dTb3J0Q2hpbGQgPSBmYWxzZVwiXG4gICAgICAqbmdJZj1cInZpZXdTdGF0ZS5pc1NvcnRcIlxuICAgID5cbiAgICAgIDxuZy1jb250YWluZXIgKm5nSWY9XCJzb3J0VGVtcGxhdGU7IGVsc2UgZGVmYXVsdFNvcnRcIj48L25nLWNvbnRhaW5lcj5cbiAgICAgIDxuZy10ZW1wbGF0ZSAjZGVmYXVsdFNvcnQ+XG4gICAgICAgIDxzcGFuXG4gICAgICAgIFtuZ0NsYXNzXT1cIltcbiAgICAgICAgJ2ZsZXggZ2FwIHRleHQteHMgaXRlbXMtY2VudGVyIHBkIHJvdW5kZWQgY3Vyc29yLXBvaW50ZXInLFxuICAgICAgc29ydEN1c3RvbUNsYXNzID8gc29ydEN1c3RvbUNsYXNzIDogJydcbiAgICAgIF1cIlxuICAgICAgICAgIFtzdHlsZS5iYWNrZ3JvdW5kLWNvbG9yXT1cIicjRDlEOUQ5NDAnXCJcbiAgICAgICAgICAoY2xpY2spPVwidG9nZ2xlQ2hpbGRWaWV3KCdzb3J0JylcIlxuICAgICAgICA+XG4gICAgICAgICAgPHZlcmJlbi1zdmcgW3dpZHRoXT1cIjE1XCIgW2ljb25dPVwiJ3NvcnQnXCI+PC92ZXJiZW4tc3ZnPlxuICAgICAgICAgIDxzcGFuXG4gICAgICAgICAgICA+U29ydCA8c3VwPih7eyBzZWxlY3RlZFNvcnRDb3VudCB9fSk8L3N1cD48L3NwYW5cbiAgICAgICAgICA+XG4gICAgICAgIDwvc3Bhbj5cbiAgICAgICAgPGRpdiBbc3R5bGUuei1pbmRleF09XCJ6SW5kZXhcIiBjbGFzcz1cImRhdGEtdmlldy1lbGVtZW50XCI+XG4gICAgICAgICAgPG5nLWNvbnRlbnRcbiAgICAgICAgICAgICpuZ0lmPVwic2hvd1NvcnRDaGlsZFwiXG4gICAgICAgICAgICBzZWxlY3Q9XCJbc29ydC1jb250ZW50XVwiXG4gICAgICAgICAgPjwvbmctY29udGVudD5cbiAgICAgICAgPC9kaXY+XG4gICAgICA8L25nLXRlbXBsYXRlPlxuICAgIDwvbmctY29udGFpbmVyPlxuXG4gICAgPCEtLSBFeHBvcnQgU2VjdGlvbiAtLT5cbiAgICA8bmctY29udGFpbmVyXG4gICAgICBbYXBwT3V0U2lkZUNsaWNrXT1cInNob3dFeHBvcnRDaGlsZFwiXG4gICAgICAob3V0U2lkZUNsaWNrKT1cInNob3dFeHBvcnRDaGlsZCA9IGZhbHNlXCJcbiAgICAgICpuZ0lmPVwidmlld1N0YXRlLmlzRXhwb3J0XCJcbiAgICA+XG4gICAgICA8bmctY29udGFpbmVyICpuZ0lmPVwiZXhwb3J0VGVtcGxhdGU7IGVsc2UgZGVmYXVsdEV4cG9ydFwiPjwvbmctY29udGFpbmVyPlxuICAgICAgPG5nLXRlbXBsYXRlICNkZWZhdWx0RXhwb3J0PlxuICAgICAgICA8c3BhblxuICAgICAgICBbbmdDbGFzc109XCJbXG4gICAgICAgICdmbGV4IGdhcCB0ZXh0LXhzIGl0ZW1zLWNlbnRlciBwZCByb3VuZGVkIGN1cnNvci1wb2ludGVyJyxcbiAgICAgICAgZXhwb3J0Q3VzdG9tQ2xhc3MgPyBleHBvcnRDdXN0b21DbGFzcyA6ICcnXG4gICAgICBdXCJcbiAgICAgICAgICBbc3R5bGUuYmFja2dyb3VuZC1jb2xvcl09XCInI0Q5RDlEOTQwJ1wiXG4gICAgICAgICAgKGNsaWNrKT1cInRvZ2dsZUNoaWxkVmlldygnZXhwb3J0JylcIlxuICAgICAgICA+XG4gICAgICAgICAgPHZlcmJlbi1zdmcgW3dpZHRoXT1cIjE1XCIgW2ljb25dPVwiJ2V4cG9ydCdcIj48L3ZlcmJlbi1zdmc+XG4gICAgICAgICAgRXhwb3J0XG4gICAgICAgIDwvc3Bhbj5cbiAgICAgICAgPGRpdiBbc3R5bGUuei1pbmRleF09XCJ6SW5kZXhcIiBjbGFzcz1cImRhdGEtdmlldy1lbGVtZW50XCI+XG4gICAgICAgICAgPG5nLWNvbnRlbnRcbiAgICAgICAgICAgICpuZ0lmPVwic2hvd0V4cG9ydENoaWxkXCJcbiAgICAgICAgICAgIHNlbGVjdD1cIltleHBvcnQtY29udGVudF1cIlxuICAgICAgICAgID48L25nLWNvbnRlbnQ+XG4gICAgICAgIDwvZGl2PlxuICAgICAgPC9uZy10ZW1wbGF0ZT5cbiAgICA8L25nLWNvbnRhaW5lcj5cblxuICAgIDwhLS0gU2VsZWN0IFNlY3Rpb24gLS0+XG4gICAgPGRpdiAqbmdJZj1cInZpZXdTdGF0ZS5pc1NlbGVjdFwiPlxuICAgICAgPHNwYW5cbiAgICAgIFtuZ0NsYXNzXT1cIltcbiAgICAgICdmbGV4IGdhcCB0ZXh0LXhzIGl0ZW1zLWNlbnRlciBwZCByb3VuZGVkIGN1cnNvci1wb2ludGVyJyxcbiAgICAgIHNlbGVjdEN1c3RvbUNsYXNzID8gc2VsZWN0Q3VzdG9tQ2xhc3MgOiAnJ1xuICAgIF1cIlxuICAgICAgICBbc3R5bGUuYmFja2dyb3VuZC1jb2xvcl09XCInI0Q5RDlEOTQwJ1wiXG4gICAgICAgIChjbGljayk9XCJ0b2dnbGVDaGlsZFZpZXcoJ3NlbGVjdCcpXCJcbiAgICAgID5cbiAgICAgICAgPHZlcmJlbi1zdmcgW3dpZHRoXT1cIjE1XCIgW2ljb25dPVwiJ3NlbGVjdCdcIj48L3ZlcmJlbi1zdmc+XG4gICAgICAgIDxzcGFuPlNlbGVjdDwvc3Bhbj5cbiAgICAgICAgPHZlcmJlbi1zdmcgW3dpZHRoXT1cIjZcIiBbaWNvbl09XCInY2hldnJvbi1kb3duJ1wiPjwvdmVyYmVuLXN2Zz5cbiAgICAgIDwvc3Bhbj5cbiAgICA8L2Rpdj5cblxuICAgIDwhLS0gQ3JlYXRlIEJ1dHRvbiAtLT5cbiAgICAgXG4gICAgPGRpdiAgIFthcHBPdXRTaWRlQ2xpY2tdPVwiY3JlYXRlXCJcbiAgICAob3V0U2lkZUNsaWNrKT1cImNyZWF0ZSA9IGZhbHNlXCIgKm5nSWY9XCJ2aWV3U3RhdGUuaXNDcmVhdGVcIj5cbiAgICAgIDx2ZXJiZW5hLWJ1dHRvblxuICAgICAgICBjbGFzcz1cInRleHQtc20gZm9udC1zZW1pYm9sZFwiXG4gICAgICAgIFtiZ0NvbG9yXT1cIicjRkZFNjgxJ1wiXG4gICAgICAgIFtidXR0b25DbGFzc109XCJjcmVhdGVDdXN0b21DbGFzc1wiXG4gICAgICAgIFtwZF09XCInNnB4J1wiXG4gICAgICAgIFtib3JkZXJSYWRpdXNdPVwiJzRweCdcIlxuICAgICAgICBbdGV4dENvbG9yXT1cIicjMDAwJ1wiXG4gICAgICAgIFtzdmddPVwiJ2FkZCdcIlxuICAgICAgICBbc3ZnUG9zaXRpb25dPVwiJ3JpZ2h0J1wiXG4gICAgICAgIFt0ZXh0XT1cIidDcmVhdGUgTmV3J1wiXG4gICAgICAgIChjbGljayk9XCJ0b2dnbGVDaGlsZFZpZXcoJ2NyZWF0ZScpXCJcbiAgICAgID5cbiAgICAgIDwvdmVyYmVuYS1idXR0b24+XG4gICAgICA8bmctY29udGFpbmVyICpuZ0lmPVwiY3JlYXRlVGVtcGxhdGU7IGVsc2UgZGVmYXVsdENyZWF0ZVwiPjwvbmctY29udGFpbmVyPlxuICAgICAgPG5nLXRlbXBsYXRlICNkZWZhdWx0Q3JlYXRlPlxuICAgICAgXG4gICAgICAgIDxkaXYgW3N0eWxlLnotaW5kZXhdPVwiekluZGV4XCIgY2xhc3M9XCJkYXRhLXZpZXctZWxlbWVudFwiPlxuICAgICAgICAgIDxuZy1jb250ZW50XG4gICAgICAgICAgICAqbmdJZj1cImNyZWF0ZVwiXG4gICAgICAgICAgICBzZWxlY3Q9XCJbY3JlYXRlLWNvbnRlbnRdXCJcbiAgICAgICAgICA+PC9uZy1jb250ZW50PlxuICAgICAgICA8L2Rpdj5cbiAgICAgIDwvbmctdGVtcGxhdGU+XG4gICAgPC9kaXY+XG4gIDwvZGl2PlxuPC9kaXY+XG5cbjwhLS0gR3JpZCBhbmQgTGlzdCBWaWV3IEhhbmRsaW5nIC0tPlxuPGRpdiAqbmdJZj1cImlzVGFibGVWaWV3OyBlbHNlIGxpc3RWaWV3VGVtcGxhdGVcIj5cbiAgPGRpdiBbY2xhc3NdPVwidGFibGVDbGFzc1wiPlxuICAgIDxuZy1jb250ZW50IHNlbGVjdD1cIlt0YWJsZS1jb250ZW50XVwiPjwvbmctY29udGVudD5cbiAgPC9kaXY+XG48L2Rpdj5cbjxuZy10ZW1wbGF0ZSAjbGlzdFZpZXdUZW1wbGF0ZT5cbiAgPGRpdiBbY2xhc3NdPVwiY2FyZENsYXNzXCI+XG4gICAgPG5nLWNvbnRlbnQgc2VsZWN0PVwiW2NhcmQtY29udGVudF1cIj48L25nLWNvbnRlbnQ+XG4gIDwvZGl2PlxuPC9uZy10ZW1wbGF0ZT5cbiJdfQ==
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGF0YS12aWV3LmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL3ZlcmJlbi1uZy11aS9zcmMvbGliL2NvbXBvbmVudHMvZGF0YS12aWV3L2RhdGEtdmlldy5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy92ZXJiZW4tbmctdWkvc3JjL2xpYi9jb21wb25lbnRzL2RhdGEtdmlldy9kYXRhLXZpZXcuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUNMLFNBQVMsRUFDVCxZQUFZLEVBQ1osS0FBSyxFQUVMLE1BQU0sR0FDUCxNQUFNLGVBQWUsQ0FBQzs7Ozs7OztBQWtCdkIsTUFBTSxPQUFPLGlCQUFpQjtJQUNuQixXQUFXLENBQVU7SUFDckIsU0FBUyxDQUFVO0lBQ25CLGVBQWUsR0FBVSxFQUFFLENBQUE7SUFDM0IsaUJBQWlCLEdBQVMsRUFBRSxDQUFBO0lBQzVCLGlCQUFpQixHQUFTLEVBQUUsQ0FBQTtJQUM1QixlQUFlLEdBQVMsRUFBRSxDQUFBO0lBQzFCLGlCQUFpQixHQUFTLEVBQUUsQ0FBQTtJQUM1QixpQkFBaUIsR0FBUyxFQUFFLENBQUE7SUFDNUIsTUFBTSxHQUFTLENBQUMsQ0FBQTtJQUNoQixpQkFBaUIsR0FBUSxFQUFFLENBQUE7SUFDM0IsU0FBUyxHQUFXLFFBQVEsQ0FBQztJQUM3QixRQUFRLEdBQVcsV0FBVyxDQUFDO0lBQy9CLFNBQVMsR0FBVyxFQUFFLENBQUM7SUFDdkIsVUFBVSxHQUFXLEVBQUUsQ0FBQztJQUN4QixTQUFTLEdBQVEsUUFBUSxDQUFDO0lBQzFCLFdBQVcsR0FBUSxFQUFFLENBQUM7SUFDdEIsU0FBUyxHQUFjO1FBQzlCLFFBQVEsRUFBRSxJQUFJO1FBQ2QsUUFBUSxFQUFFLElBQUk7UUFDZCxRQUFRLEVBQUUsSUFBSTtRQUNkLE1BQU0sRUFBRSxJQUFJO1FBQ1osUUFBUSxF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c0JBQW5CLE1BQU07Z0JBQ0csV0FBVztzQkFBcEIsTUFBTTtnQkFDRyxjQUFjO3NCQUF2QixNQUFNIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtcbiAgQ29tcG9uZW50LFxuICBFdmVudEVtaXR0ZXIsXG4gIElucHV0LFxuICBPbkluaXQsXG4gIE91dHB1dCxcbn0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbmludGVyZmFjZSBWaWV3U3RhdGUge1xuICBpc1NlYXJjaD86IGJvb2xlYW47XG4gIGlzQ29sdW1uPzogYm9vbGVhbjtcbiAgaXNGaWx0ZXI/OiBib29sZWFuO1xuICBpc1NvcnQ/OiBib29sZWFuO1xuICBpc0V4cG9ydD86IGJvb2xlYW47XG4gIGlzU2VsZWN0PzogYm9vbGVhbjtcbiAgaXNDcmVhdGU/OmJvb2xlYW5cbiAgaXNUb2dnbGU/OmJvb2xlYW5cbn1cblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAndmVyYmVuLWRhdGEtdmlldycsXG4gIHRlbXBsYXRlVXJsOiAnLi9kYXRhLXZpZXcuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybHM6IFsnLi9kYXRhLXZpZXcuY29tcG9uZW50LmNzcyddLFxufSlcbmV4cG9ydCBjbGFzcyBEYXRhVmlld0NvbXBvbmVudCBpbXBsZW1lbnRzIE9uSW5pdCB7XG4gIEBJbnB1dCgpIGJ1dHRvbkNsYXNzPzogc3RyaW5nO1xuICBASW5wdXQoKSBpY29uQ2xhc3M/OiBzdHJpbmc7XG4gIEBJbnB1dCgpIGFjdGl2ZUljb25DbGFzcz86IHN0cmluZz1cIlwiXG4gIEBJbnB1dCgpIGNvbHVtbkN1c3RvbUNsYXNzPzpzdHJpbmc9JydcbiAgQElucHV0KCkgZmlsdGVyQ3VzdG9tQ2xhc3M/OnN0cmluZz0nJ1xuICBASW5wdXQoKSBzb3J0Q3VzdG9tQ2xhc3M/OnN0cmluZz0nJ1xuICBASW5wdXQoKSBleHBvcnRDdXN0b21DbGFzcz86c3RyaW5nPScnXG4gIEBJbnB1dCgpIHNlbGVjdEN1c3RvbUNsYXNzPzpzdHJpbmc9JydcbiAgQElucHV0KCkgekluZGV4PzpudW1iZXI9NVxuICBASW5wdXQoKSBjcmVhdGVDdXN0b21DbGFzczpzdHJpbmc9JydcbiAgQElucHV0KCkgdGFibGVJY29uOiBzdHJpbmcgPSAnZ3JpZC0zJztcbiAgQElucHV0KCkgY2FyZEljb246IHN0cmluZyA9ICdsaXN0LXZpZXcnO1xuICBASW5wdXQoKSBjYXJkQ2xhc3M6IHN0cmluZyA9ICcnO1xuICBASW5wdXQoKSB0YWJsZUNsYXNzOiBzdHJpbmcgPSAnJztcbiAgQElucHV0KCkgc2VhcmNoS2V5OnN0cmluZz0nc2VhcmNoJztcbiAgQElucHV0KCkgc2VhcmNoVmFsdWU6c3RyaW5nPScnO1xuICBASW5wdXQoKSB2aWV3U3RhdGU6IFZpZXdTdGF0ZSA9IHtcbiAgICBpc1NlYXJjaDogdHJ1ZSxcbiAgICBpc0NvbHVtbjogdHJ1ZSxcbiAgICBpc0ZpbHRlcjogdHJ1ZSxcbiAgICBpc1NvcnQ6IHRydWUsXG4gICAgaXNFeHBvcnQ6IHRydWUsXG4gICAgaXNTZWxlY3Q6IHRydWUsXG4gICAgaXNDcmVhdGU6dHJ1ZSxcbiAgICBpc1RvZ2dsZTp0cnVlXG4gIH07XG5cbiAgQElucHV0KCkgc2VhcmNoVGVtcGxhdGU/OiBOb2RlO1xuICBASW5wdXQoKSBjb2x1bW5UZW1wbGF0ZT86IE5vZGU7XG4gIEBJbnB1dCgpIGZpbHRlclRlbXBsYXRlPzogTm9kZTtcbiAgQElucHV0KCkgc29ydFRlbXBsYXRlPzogTm9kZTtcbiAgQElucHV0KCkgZXhwb3J0VGVtcGxhdGU/OiBOb2RlO1xuICBASW5wdXQoKSBjcmVhdGVUZW1wbGF0ZT86IE5vZGU7XG4gIEBJbnB1dCgpIHNlbGVjdGVkQ29sdW1uQ291bnQ/OiBudW1iZXIgPSAwO1xuICBASW5wdXQoKSBzZWxlY3RlZFNvcnRDb3VudDogbnVtYmVyID0gMDtcbiAgQElucHV0KCkgc2VsZWN0ZWRGaWx0ZXJUYWJsZUNvdW50OiBudW1iZXIgPSAwO1xuICBASW5wdXQoKSBpbnB1dFdpZHRoOiBzdHJpbmc9XCIzNTBweFwiO1xuICBASW5wdXQoKXNob3dDb2x1bW5DaGlsZDogYm9vbGVhbiA9IGZhbHNlO1xuICBASW5wdXQoKSBzaG93U29ydENoaWxkOiBib29sZWFuID0gZmFsc2U7XG4gIEBJbnB1dCgpIHNob3dGaWx0ZXJDaGlsZDogYm9vbGVhbiA9IGZhbHNlO1xuICBASW5wdXQoKSBzaG93RXhwb3J0Q2hpbGQ6IGJvb2xlYW4gPSBmYWxzZTtcbiAgQElucHV0KCkgY3JlYXRlOiBib29sZWFuID0gZmFsc2U7XG4gIEBJbnB1dCgpIHNob3dTZWxlY3RlZDogYm9vbGVhbiA9IGZhbHNlO1xuICBASW5wdXQoKSBpc1RhYmxlVmlldzogYm9vbGVhbiA9IGZhbHNlO1xuICBAT3V0cHV0KCkgdmlld0NoYW5nZSA9IG5ldyBFdmVudEVtaXR0ZXI8Ym9vbGVhbj4oKTtcbiAgQE91dHB1dCgpIHN0YXRlQ2hhbmdlID0gbmV3IEV2ZW50RW1pdHRlcjx7IGtleTogc3RyaW5nOyB2YWx1ZTogYm9vbGVhbiB9PigpO1xuICBAT3V0cHV0KCkgb25TZWFyY2hDaGFuZ2U9bmV3IEV2ZW50RW1pdHRlcjx7IGtleTogc3RyaW5nOyB2YWx1ZTogc3RyaW5nIH0+KClcbiAgbmdPbkluaXQoKTogdm9pZCB7fVxuXG4gIHRvZ2dsZVZpZXcoKTogdm9pZCB7XG4gICAgdGhpcy5pc1RhYmxlVmlldyA9ICF0aGlzLmlzVGFibGVWaWV3O1xuICAgIHRoaXMudmlld0NoYW5nZS5lbWl0KHRoaXMuaXNUYWJsZVZpZXcpO1xuICB9XG5cbiAgb25TZWFyY2goZXZlbnQ6YW55KTogdm9pZCB7XG4gICAgdGhpcy5zZWFyY2hWYWx1ZT1ldmVudC50YXJnZXQudmFsdWVcbiAgICB0aGlzLm9uU2VhcmNoQ2hhbmdlLmVtaXQoe2tleTp0aGlzLnNlYXJjaEtleSwgdmFsdWU6dGhpcy5zZWFyY2hWYWx1ZX0pO1xuICB9XG4gIFxub25DbGVhclNlYXJjaCgpe1xuIHRoaXMuc2VhcmNoVmFsdWU9XCJcIlxufVxuICB0b2dnbGVDaGlsZFZpZXcodmlld1R5cGU6IHN0cmluZyk6IHZvaWQge1xuICAgIHN3aXRjaCAodmlld1R5cGUpIHtcbiAgICAgIGNhc2UgJ2NvbHVtbic6XG4gICAgICAgIHRoaXMuc2hvd0NvbHVtbkNoaWxkID0gIXRoaXMuc2hvd0NvbHVtbkNoaWxkO1xuICAgICAgICB0aGlzLnJlc2V0Q2hpbGRWaWV3c0V4Y2VwdCgnY29sdW1uJyk7XG4gICAgICAgIGJyZWFrO1xuICAgICAgY2FzZSAnZmlsdGVyJzpcbiAgICAgICAgdGhpcy5zaG93RmlsdGVyQ2hpbGQgPSAhdGhpcy5zaG93RmlsdGVyQ2hpbGQ7XG4gICAgICAgIHRoaXMucmVzZXRDaGlsZFZpZXdzRXhjZXB0KCdmaWx0ZXInKTtcbiAgICAgICAgYnJlYWs7XG4gICAgICBjYXNlICdzb3J0JzpcbiAgICAgICAgdGhpcy5zaG93U29ydENoaWxkID0gIXRoaXMuc2hvd1NvcnRDaGlsZDtcbiAgICAgICAgdGhpcy5yZXNldENoaWxkVmlld3NFeGNlcHQoJ3NvcnQnKTtcbiAgICAgICAgYnJlYWs7XG4gICAgICBjYXNlICdzZWxlY3QnOlxuICAgICAgICB0aGlzLnNob3dTZWxlY3RlZCA9ICF0aGlzLnNob3dTZWxlY3RlZDtcbiAgICAgICAgdGhpcy5yZXNldENoaWxkVmlld3NFeGNlcHQoJ3NlbGVjdCcpO1xuICAgICAgICBicmVhaztcbiAgICAgIGNhc2UgJ2V4cG9ydCc6XG4gICAgICAgIHRoaXMuc2hvd0V4cG9ydENoaWxkID0gIXRoaXMuc2hvd0V4cG9ydENoaWxkO1xuICAgICAgICB0aGlzLnJlc2V0Q2hpbGRWaWV3c0V4Y2VwdCgnZXhwb3J0Jyk7XG4gICAgICAgIGJyZWFrO1xuICAgICAgICBjYXNlICdjcmVhdGUnOlxuICAgICAgICAgIHRoaXMuY3JlYXRlID0gIXRoaXMuY3JlYXRlO1xuICAgICAgICAgIHRoaXMucmVzZXRDaGlsZFZpZXdzRXhjZXB0KCdjcmVhdGUnKTtcbiAgICAgICAgICBicmVhaztcbiAgICB9XG4gICAgdGhpcy5zdGF0ZUNoYW5nZS5lbWl0KHsga2V5OiB2aWV3VHlwZSwgdmFsdWU6IHRoaXMuZ2V0Q2hpbGRWaWV3U3RhdGUodmlld1R5cGUpIH0pO1xuICB9XG5cbiAgLy8gUmVzZXQgb3RoZXIgY2hpbGQgdmlld3Mgd2hlbiBvbmUgaXMgdG9nZ2xlZFxuICByZXNldENoaWxkVmlld3NFeGNlcHQodmlld1R5cGU6IHN0cmluZyk6IHZvaWQge1xuICAgIGlmICh2aWV3VHlwZSAhPT0gJ2NvbHVtbicpIHRoaXMuc2hvd0NvbHVtbkNoaWxkID0gZmFsc2U7XG4gICAgaWYgKHZpZXdUeXBlICE9PSAnZmlsdGVyJykgdGhpcy5zaG93RmlsdGVyQ2hpbGQgPSBmYWxzZTtcbiAgICBpZiAodmlld1R5cGUgIT09ICdzb3J0JykgdGhpcy5zaG93U29ydENoaWxkID0gZmFsc2U7XG4gICAgaWYgKHZpZXdUeXBlICE9PSAnc2VsZWN0JykgdGhpcy5zaG93U2VsZWN0ZWQgPSBmYWxzZTtcbiAgICBpZiAodmlld1R5cGUgIT09ICdleHBvcnQnKSB0aGlzLnNob3dFeHBvcnRDaGlsZCA9IGZhbHNlO1xuICAgIGlmICh2aWV3VHlwZSAhPT0gJ2NyZWF0ZScpIHRoaXMuY3JlYXRlID0gZmFsc2U7XG4gIH1cblxuICAvLyBIZWxwZXIgbWV0aG9kIHRvIGdldCB0aGUgc3RhdGUgb2YgYSBzcGVjaWZpYyBjaGlsZCB2aWV3XG4gIGdldENoaWxkVmlld1N0YXRlKHZpZXdUeXBlOiBzdHJpbmcpOiBib29sZWFuIHtcbiAgICBzd2l0Y2ggKHZpZXdUeXBlKSB7XG4gICAgICBjYXNlICdjb2x1bW4nOlxuICAgICAgICByZXR1cm4gdGhpcy5zaG93Q29sdW1uQ2hpbGQ7XG4gICAgICBjYXNlICdmaWx0ZXInOlxuICAgICAgICByZXR1cm4gdGhpcy5zaG93RmlsdGVyQ2hpbGQ7XG4gICAgICBjYXNlICdzb3J0JzpcbiAgICAgICAgcmV0dXJuIHRoaXMuc2hvd1NvcnRDaGlsZDtcbiAgICAgIGNhc2UgJ3NlbGVjdCc6XG4gICAgICAgIHJldHVybiB0aGlzLnNob3dTZWxlY3RlZDtcbiAgICAgIGNhc2UgJ2V4cG9ydCc6XG4gICAgICAgIHJldHVybiB0aGlzLnNob3dFeHBvcnRDaGlsZDtcbiAgICAgICAgY2FzZSAnY3JlYXRlJzpcbiAgICAgICAgcmV0dXJuIHRoaXMuY3JlYXRlO1xuICAgICAgZGVmYXVsdDpcbiAgICAgICAgcmV0dXJuIGZhbHNlO1xuICAgIH1cbiAgfVxufVxuIiwiPGRpdlxuICBjbGFzcz1cInRvb2xiYXIgZmxleCBnYXAganVzdGlmeS1iZXR3ZWVuIGl0ZW1zLWNlbnRlclwiXG4+XG4gIDxkaXYgY2xhc3M9XCJmbGV4IGl0ZW1zLWNlbnRlciBnYXBcIj5cbiAgICA8ZGl2ICpuZ0lmPVwidmlld1N0YXRlLmlzVG9nZ2xlXCIgY2xhc3M9XCJ0b2dnbGUtYnV0dG9uLWNvbnRhaW5lclwiPlxuICAgICAgPGJ1dHRvbiB0eXBlPVwiYnV0dG9uXCIgKGNsaWNrKT1cInRvZ2dsZVZpZXcoKVwiIFtuZ0NsYXNzXT1cImJ1dHRvbkNsYXNzXCI+XG4gICAgICAgIDx2ZXJiZW4tc3ZnXG4gICAgICAgICAgW2ljb25dPVwidGFibGVJY29uXCJcbiAgICAgICAgICBbY2xhc3MuYWN0aXZlXT1cIiFpc1RhYmxlVmlld1wiXG4gICAgICAgICAgW25nQ2xhc3NdPVwiIWlzVGFibGVWaWV3ID8gYWN0aXZlSWNvbkNsYXNzIDogaWNvbkNsYXNzXCJcbiAgICAgICAgPjwvdmVyYmVuLXN2Zz5cbiAgICAgICAgPHZlcmJlbi1zdmdcbiAgICAgICAgICBbaWNvbl09XCJjYXJkSWNvblwiXG4gICAgICAgICAgW2NsYXNzLmFjdGl2ZV09XCJpc1RhYmxlVmlld1wiXG4gICAgICAgICAgW25nQ2xhc3NdPVwiaXNUYWJsZVZpZXcgPyBhY3RpdmVJY29uQ2xhc3MgOiBpY29uQ2xhc3NcIlxuICAgICAgICAgIFt3aWR0aF09XCIyNVwiXG5cbiAgICAgICAgICBbaGVpZ2h0XT1cIjI1XCJcbiAgICAgICAgPjwvdmVyYmVuLXN2Zz5cbiAgICAgIDwvYnV0dG9uPlxuICAgIDwvZGl2PlxuICAgIDwhLS0gU2VhcmNoIElucHV0IC0tPlxuICAgIDxkaXZcbiAgICAgIFtzdHlsZS53aWR0aF09XCJpbnB1dFdpZHRoXCJcbiAgICAgIGNsYXNzPVwic2VhcmNoLWlucHV0XCJcbiAgICAgICpuZ0lmPVwidmlld1N0YXRlLmlzU2VhcmNoXCJcbiAgICA+XG4gICAgICA8dmVyYmVuYS1pbnB1dFxuICAgICAgICBbdHlwZV09XCIndGV4dCdcIlxuICAgICAgICBbcGxhY2VIb2xkZXJdPVwiJ1NlYXJjaC4uLidcIlxuICAgICAgICAoaW5wdXQpPVwib25TZWFyY2goJGV2ZW50KVwiXG4gICAgICAgICBbYmdDb2xvcl09XCIndHJhbnNwYXJlbnQnXCJcbiAgICAgICAgW2JvcmRlcl09XCInMCdcIlxuICAgICAgICBbdmFsdWVdPVwic2VhcmNoVmFsdWVcIlxuICAgICAgLz5cbiAgICAgIDx2ZXJiZW4tc3ZnXG4gICAgICAqbmdJZj1cInNlYXJjaFZhbHVlLmxlbmd0aD4wXCJcbiAgICAgICAgICBbaWNvbl09XCInY2xvc2UnXCJcbiAgICAgICAgICBbd2lkdGhdPVwiMTVcIlxuICAgICAgICAgIChjbGljayk9XCJvbkNsZWFyU2VhcmNoKClcIlxuICAgICAgICAgIGNsYXNzPVwiY2xvc2UtaWNvbi1jbGFzc1wiXG4gICAgICAgICAgW2hlaWdodF09XCIxNVwiXG4gICAgICAgID48L3ZlcmJlbi1zdmc+XG4gICAgPC9kaXY+XG4gIDwvZGl2PlxuXG4gIDxkaXYgY2xhc3M9XCJmbGV4IGl0ZW1zLWNlbnRlciByZWxhdGl2ZSBnYXBcIiBbc3R5bGUubWFyZ2luLWxlZnRdPVwiJzEwcHgnXCI+XG4gICAgPCEtLSBDb2x1bW4gU2VjdGlvbiAtLT5cbiAgICA8bmctY29udGFpbmVyXG4gICAgICBbYXBwT3V0U2lkZUNsaWNrXT1cInNob3dDb2x1bW5DaGlsZFwiXG4gICAgICAob3V0U2lkZUNsaWNrKT1cInNob3dDb2x1bW5DaGlsZCA9IGZhbHNlXCJcbiAgICAgICpuZ0lmPVwidmlld1N0YXRlLmlzQ29sdW1uICYmIGlzVGFibGVWaWV3XCJcbiAgICA+XG4gICAgICA8bmctY29udGFpbmVyICpuZ0lmPVwiY29sdW1uVGVtcGxhdGU7IGVsc2UgZGVmYXVsdENvbHVtblwiPjwvbmctY29udGFpbmVyPlxuICAgICAgPG5nLXRlbXBsYXRlICNkZWZhdWx0Q29sdW1uPlxuICAgICAgICA8c3BhblxuICAgICAgICAgIFtuZ0NsYXNzXT1cIltcbiAgICAgICAgICAgICdmbGV4IGdhcCB0ZXh0LXhzIGl0ZW1zLWNlbnRlciBwZCByb3VuZGVkIGN1cnNvci1wb2ludGVyJyxcbiAgICAgICAgICAgIGNvbHVtbkN1c3RvbUNsYXNzID8gY29sdW1uQ3VzdG9tQ2xhc3MgOiAnJ1xuICAgICAgICAgIF1cIlxuICAgICAgICAgIFtzdHlsZS5iYWNrZ3JvdW5kLWNvbG9yXT1cIicjRDlEOUQ5NDAnXCJcbiAgICAgICAgICAoY2xpY2spPVwidG9nZ2xlQ2hpbGRWaWV3KCdjb2x1bW4nKVwiXG4gICAgICAgID5cbiAgICAgICAgICA8dmVyYmVuLXN2ZyBbd2lkdGhdPVwiMTVcIiBbaWNvbl09XCInY29sdW1uJ1wiPjwvdmVyYmVuLXN2Zz5cbiAgICAgICAgICA8c3BhblxuICAgICAgICAgICAgPkNvbHVtbnMgPHN1cD4oe3sgc2VsZWN0ZWRDb2x1bW5Db3VudCB9fSk8L3N1cD48L3NwYW5cbiAgICAgICAgICA+XG4gICAgICAgIDwvc3Bhbj5cbiAgICAgICAgPGRpdiBbc3R5bGUuei1pbmRleF09XCJ6SW5kZXhcIiBjbGFzcz1cImRhdGEtdmlldy1lbGVtZW50XCI+XG4gICAgICAgICAgPG5nLWNvbnRlbnRcbiAgICAgICAgICAgICpuZ0lmPVwic2hvd0NvbHVtbkNoaWxkXCJcbiAgICAgICAgICAgIHNlbGVjdD1cIltjb2x1bW4tY29udGVudF1cIlxuICAgICAgICAgID48L25nLWNvbnRlbnQ+XG4gICAgICAgIDwvZGl2PlxuICAgICAgPC9uZy10ZW1wbGF0ZT5cbiAgICA8L25nLWNvbnRhaW5lcj5cblxuICAgIDwhLS0gRmlsdGVyIFNlY3Rpb24gLS0+XG4gICAgPG5nLWNvbnRhaW5lclxuICAgICAgW2FwcE91dFNpZGVDbGlja109XCJzaG93RmlsdGVyQ2hpbGRcIlxuICAgICAgKG91dFNpZGVDbGljayk9XCJzaG93RmlsdGVyQ2hpbGQgPSBmYWxzZVwiXG4gICAgICAqbmdJZj1cInZpZXdTdGF0ZS5pc0ZpbHRlclwiXG4gICAgPlxuICAgICAgPG5nLWNvbnRhaW5lciAqbmdJZj1cImZpbHRlclRlbXBsYXRlOyBlbHNlIGRlZmF1bHRGaWx0ZXJcIj48L25nLWNvbnRhaW5lcj5cbiAgICAgIDxuZy10ZW1wbGF0ZSAjZGVmYXVsdEZpbHRlcj5cbiAgICAgICAgPHNwYW5cbiAgICAgICAgW25nQ2xhc3NdPVwiW1xuICAgICAgICAnZmxleCBnYXAgdGV4dC14cyBpdGVtcy1jZW50ZXIgcGQgcm91bmRlZCBjdXJzb3ItcG9pbnRlcicsXG4gICAgICAgIGZpbHRlckN1c3RvbUNsYXNzID8gZmlsdGVyQ3VzdG9tQ2xhc3MgOiAnJ1xuICAgICAgXVwiXG4gICAgICAgICAgW3N0eWxlLmJhY2tncm91bmQtY29sb3JdPVwiJyNEOUQ5RDk0MCdcIlxuICAgICAgICAgIChjbGljayk9XCJ0b2dnbGVDaGlsZFZpZXcoJ2ZpbHRlcicpXCJcbiAgICAgICAgPlxuICAgICAgICAgIDx2ZXJiZW4tc3ZnIFt3aWR0aF09XCIxNVwiIFtpY29uXT1cIidmaWx0ZXInXCI+PC92ZXJiZW4tc3ZnPlxuICAgICAgICAgIDxzcGFuXG4gICAgICAgICAgICA+RmlsdGVyIDxzdXA+KHt7IHNlbGVjdGVkRmlsdGVyVGFibGVDb3VudCB9fSk8L3N1cD48L3NwYW5cbiAgICAgICAgICA+XG4gICAgICAgIDwvc3Bhbj5cbiAgICAgICAgPGRpdiBbc3R5bGUuei1pbmRleF09XCJ6SW5kZXhcIiBjbGFzcz1cImRhdGEtdmlldy1lbGVtZW50XCI+XG4gICAgICAgICAgPG5nLWNvbnRlbnRcbiAgICAgICAgICAgICpuZ0lmPVwic2hvd0ZpbHRlckNoaWxkXCJcbiAgICAgICAgICAgIHNlbGVjdD1cIltmaWx0ZXItY29udGVudF1cIlxuICAgICAgICAgID48L25nLWNvbnRlbnQ+XG4gICAgICAgIDwvZGl2PlxuICAgICAgPC9uZy10ZW1wbGF0ZT5cbiAgICA8L25nLWNvbnRhaW5lcj5cblxuICAgIDwhLS0gU29ydCBTZWN0aW9uIC0tPlxuICAgIDxuZy1jb250YWluZXJcbiAgICAgIFthcHBPdXRTaWRlQ2xpY2tdPVwic2hvd1NvcnRDaGlsZFwiXG4gICAgICAob3V0U2lkZUNsaWNrKT1cInNob3dTb3J0Q2hpbGQgPSBmYWxzZVwiXG4gICAgICAqbmdJZj1cInZpZXdTdGF0ZS5pc1NvcnRcIlxuICAgID5cbiAgICAgIDxuZy1jb250YWluZXIgKm5nSWY9XCJzb3J0VGVtcGxhdGU7IGVsc2UgZGVmYXVsdFNvcnRcIj48L25nLWNvbnRhaW5lcj5cbiAgICAgIDxuZy10ZW1wbGF0ZSAjZGVmYXVsdFNvcnQ+XG4gICAgICAgIDxzcGFuXG4gICAgICAgIFtuZ0NsYXNzXT1cIltcbiAgICAgICAgJ2ZsZXggZ2FwIHRleHQteHMgaXRlbXMtY2VudGVyIHBkIHJvdW5kZWQgY3Vyc29yLXBvaW50ZXInLFxuICAgICAgc29ydEN1c3RvbUNsYXNzID8gc29ydEN1c3RvbUNsYXNzIDogJydcbiAgICAgIF1cIlxuICAgICAgICAgIFtzdHlsZS5iYWNrZ3JvdW5kLWNvbG9yXT1cIicjRDlEOUQ5NDAnXCJcbiAgICAgICAgICAoY2xpY2spPVwidG9nZ2xlQ2hpbGRWaWV3KCdzb3J0JylcIlxuICAgICAgICA+XG4gICAgICAgICAgPHZlcmJlbi1zdmcgW3dpZHRoXT1cIjE1XCIgW2ljb25dPVwiJ3NvcnQnXCI+PC92ZXJiZW4tc3ZnPlxuICAgICAgICAgIDxzcGFuXG4gICAgICAgICAgICA+U29ydCA8c3VwPih7eyBzZWxlY3RlZFNvcnRDb3VudCB9fSk8L3N1cD48L3NwYW5cbiAgICAgICAgICA+XG4gICAgICAgIDwvc3Bhbj5cbiAgICAgICAgPGRpdiBbc3R5bGUuei1pbmRleF09XCJ6SW5kZXhcIiBjbGFzcz1cImRhdGEtdmlldy1lbGVtZW50XCI+XG4gICAgICAgICAgPG5nLWNvbnRlbnRcbiAgICAgICAgICAgICpuZ0lmPVwic2hvd1NvcnRDaGlsZFwiXG4gICAgICAgICAgICBzZWxlY3Q9XCJbc29ydC1jb250ZW50XVwiXG4gICAgICAgICAgPjwvbmctY29udGVudD5cbiAgICAgICAgPC9kaXY+XG4gICAgICA8L25nLXRlbXBsYXRlPlxuICAgIDwvbmctY29udGFpbmVyPlxuXG4gICAgPCEtLSBFeHBvcnQgU2VjdGlvbiAtLT5cbiAgICA8bmctY29udGFpbmVyXG4gICAgICBbYXBwT3V0U2lkZUNsaWNrXT1cInNob3dFeHBvcnRDaGlsZFwiXG4gICAgICAob3V0U2lkZUNsaWNrKT1cInNob3dFeHBvcnRDaGlsZCA9IGZhbHNlXCJcbiAgICAgICpuZ0lmPVwidmlld1N0YXRlLmlzRXhwb3J0XCJcbiAgICA+XG4gICAgICA8bmctY29udGFpbmVyICpuZ0lmPVwiZXhwb3J0VGVtcGxhdGU7IGVsc2UgZGVmYXVsdEV4cG9ydFwiPjwvbmctY29udGFpbmVyPlxuICAgICAgPG5nLXRlbXBsYXRlICNkZWZhdWx0RXhwb3J0PlxuICAgICAgICA8c3BhblxuICAgICAgICBbbmdDbGFzc109XCJbXG4gICAgICAgICdmbGV4IGdhcCB0ZXh0LXhzIGl0ZW1zLWNlbnRlciBwZCByb3VuZGVkIGN1cnNvci1wb2ludGVyJyxcbiAgICAgICAgZXhwb3J0Q3VzdG9tQ2xhc3MgPyBleHBvcnRDdXN0b21DbGFzcyA6ICcnXG4gICAgICBdXCJcbiAgICAgICAgICBbc3R5bGUuYmFja2dyb3VuZC1jb2xvcl09XCInI0Q5RDlEOTQwJ1wiXG4gICAgICAgICAgKGNsaWNrKT1cInRvZ2dsZUNoaWxkVmlldygnZXhwb3J0JylcIlxuICAgICAgICA+XG4gICAgICAgICAgPHZlcmJlbi1zdmcgW3dpZHRoXT1cIjE1XCIgW2ljb25dPVwiJ2V4cG9ydCdcIj48L3ZlcmJlbi1zdmc+XG4gICAgICAgICAgRXhwb3J0XG4gICAgICAgIDwvc3Bhbj5cbiAgICAgICAgPGRpdiBbc3R5bGUuei1pbmRleF09XCJ6SW5kZXhcIiBjbGFzcz1cImRhdGEtdmlldy1lbGVtZW50XCI+XG4gICAgICAgICAgPG5nLWNvbnRlbnRcbiAgICAgICAgICAgICpuZ0lmPVwic2hvd0V4cG9ydENoaWxkXCJcbiAgICAgICAgICAgIHNlbGVjdD1cIltleHBvcnQtY29udGVudF1cIlxuICAgICAgICAgID48L25nLWNvbnRlbnQ+XG4gICAgICAgIDwvZGl2PlxuICAgICAgPC9uZy10ZW1wbGF0ZT5cbiAgICA8L25nLWNvbnRhaW5lcj5cblxuICAgIDwhLS0gU2VsZWN0IFNlY3Rpb24gLS0+XG4gICAgPGRpdiAqbmdJZj1cInZpZXdTdGF0ZS5pc1NlbGVjdFwiPlxuICAgICAgPHNwYW5cbiAgICAgIFtuZ0NsYXNzXT1cIltcbiAgICAgICdmbGV4IGdhcCB0ZXh0LXhzIGl0ZW1zLWNlbnRlciBwZCByb3VuZGVkIGN1cnNvci1wb2ludGVyJyxcbiAgICAgIHNlbGVjdEN1c3RvbUNsYXNzID8gc2VsZWN0Q3VzdG9tQ2xhc3MgOiAnJ1xuICAgIF1cIlxuICAgICAgICBbc3R5bGUuYmFja2dyb3VuZC1jb2xvcl09XCInI0Q5RDlEOTQwJ1wiXG4gICAgICAgIChjbGljayk9XCJ0b2dnbGVDaGlsZFZpZXcoJ3NlbGVjdCcpXCJcbiAgICAgID5cbiAgICAgICAgPHZlcmJlbi1zdmcgW3dpZHRoXT1cIjE1XCIgW2ljb25dPVwiJ3NlbGVjdCdcIj48L3ZlcmJlbi1zdmc+XG4gICAgICAgIDxzcGFuPlNlbGVjdDwvc3Bhbj5cbiAgICAgICAgPHZlcmJlbi1zdmcgW3dpZHRoXT1cIjZcIiBbaWNvbl09XCInY2hldnJvbi1kb3duJ1wiPjwvdmVyYmVuLXN2Zz5cbiAgICAgIDwvc3Bhbj5cbiAgICA8L2Rpdj5cblxuICAgIDwhLS0gQ3JlYXRlIEJ1dHRvbiAtLT5cbiAgICAgXG4gICAgPGRpdiAgIFthcHBPdXRTaWRlQ2xpY2tdPVwiY3JlYXRlXCJcbiAgICAob3V0U2lkZUNsaWNrKT1cImNyZWF0ZSA9IGZhbHNlXCIgKm5nSWY9XCJ2aWV3U3RhdGUuaXNDcmVhdGVcIj5cbiAgICAgIDx2ZXJiZW5hLWJ1dHRvblxuICAgICAgICBjbGFzcz1cInRleHQtc20gZm9udC1zZW1pYm9sZFwiXG4gICAgICAgIFtiZ0NvbG9yXT1cIicjRkZFNjgxJ1wiXG4gICAgICAgIFtidXR0b25DbGFzc109XCJjcmVhdGVDdXN0b21DbGFzc1wiXG4gICAgICAgIFtwZF09XCInNnB4J1wiXG4gICAgICAgIFtib3JkZXJSYWRpdXNdPVwiJzRweCdcIlxuICAgICAgICBbdGV4dENvbG9yXT1cIicjMDAwJ1wiXG4gICAgICAgIFtzdmddPVwiJ2FkZCdcIlxuICAgICAgICBbc3ZnUG9zaXRpb25dPVwiJ3JpZ2h0J1wiXG4gICAgICAgIFt0ZXh0XT1cIidDcmVhdGUgTmV3J1wiXG4gICAgICAgIChjbGljayk9XCJ0b2dnbGVDaGlsZFZpZXcoJ2NyZWF0ZScpXCJcbiAgICAgID5cbiAgICAgIDwvdmVyYmVuYS1idXR0b24+XG4gICAgICA8bmctY29udGFpbmVyICpuZ0lmPVwiY3JlYXRlVGVtcGxhdGU7IGVsc2UgZGVmYXVsdENyZWF0ZVwiPjwvbmctY29udGFpbmVyPlxuICAgICAgPG5nLXRlbXBsYXRlICNkZWZhdWx0Q3JlYXRlPlxuICAgICAgXG4gICAgICAgIDxkaXYgW3N0eWxlLnotaW5kZXhdPVwiekluZGV4XCIgY2xhc3M9XCJkYXRhLXZpZXctZWxlbWVudFwiPlxuICAgICAgICAgIDxuZy1jb250ZW50XG4gICAgICAgICAgICAqbmdJZj1cImNyZWF0ZVwiXG4gICAgICAgICAgICBzZWxlY3Q9XCJbY3JlYXRlLWNvbnRlbnRdXCJcbiAgICAgICAgICA+PC9uZy1jb250ZW50PlxuICAgICAgICA8L2Rpdj5cbiAgICAgIDwvbmctdGVtcGxhdGU+XG4gICAgPC9kaXY+XG4gIDwvZGl2PlxuPC9kaXY+XG5cbjwhLS0gR3JpZCBhbmQgTGlzdCBWaWV3IEhhbmRsaW5nIC0tPlxuPGRpdiAqbmdJZj1cImlzVGFibGVWaWV3OyBlbHNlIGxpc3RWaWV3VGVtcGxhdGVcIj5cbiAgPGRpdiBbY2xhc3NdPVwidGFibGVDbGFzc1wiPlxuICAgIDxuZy1jb250ZW50IHNlbGVjdD1cIlt0YWJsZS1jb250ZW50XVwiPjwvbmctY29udGVudD5cbiAgPC9kaXY+XG48L2Rpdj5cbjxuZy10ZW1wbGF0ZSAjbGlzdFZpZXdUZW1wbGF0ZT5cbiAgPGRpdiBbY2xhc3NdPVwiY2FyZENsYXNzXCI+XG4gICAgPG5nLWNvbnRlbnQgc2VsZWN0PVwiW2NhcmQtY29udGVudF1cIj48L25nLWNvbnRlbnQ+XG4gIDwvZGl2PlxuPC9uZy10ZW1wbGF0ZT5cbiJdfQ==

package/fesm2022/verben-ng-ui.mjs

@@ -3608,7 +3608,6 @@ class DataViewComponent {
     }
     onSearch(event) {
         this.searchValue = event.target.value;
-        console.log({ key: this.searchKey, value: event.target.value });
         this.onSearchChange.emit({ key: this.searchKey, value: this.searchValue });
     }
     onClearSearch() {
@@ -3678,11 +3677,11 @@ class DataViewComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.5", ngImport: i0, type: DataViewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.5", type: DataViewComponent, selector: "verben-data-view", inputs: { buttonClass: "buttonClass", iconClass: "iconClass", activeIconClass: "activeIconClass", columnCustomClass: "columnCustomClass", filterCustomClass: "filterCustomClass", sortCustomClass: "sortCustomClass", exportCustomClass: "exportCustomClass", selectCustomClass: "selectCustomClass", zIndex: "zIndex", createCustomClass: "createCustomClass", tableIcon: "tableIcon", cardIcon: "cardIcon", cardClass: "cardClass", tableClass: "tableClass", searchKey: "searchKey", searchValue: "searchValue", viewState: "viewState", searchTemplate: "searchTemplate", columnTemplate: "columnTemplate", filterTemplate: "filterTemplate", sortTemplate: "sortTemplate", exportTemplate: "exportTemplate", createTemplate: "createTemplate", selectedColumnCount: "selectedColumnCount", selectedSortCount: "selectedSortCount", selectedFilterTableCount: "selectedFilterTableCount", inputWidth: "inputWidth", showColumnChild: "showColumnChild", showSortChild: "showSortChild", showFilterChild: "showFilterChild", showExportChild: "showExportChild", create: "create", showSelected: "showSelected", isTableView: "isTableView" }, outputs: { viewChange: "viewChange", stateChange: "stateChange", onSearchChange: "onSearchChange" }, ngImport: i0, template: "<div\n  class=\"toolbar flex gap justify-between items-center\"\n  [style.margin]=\"'0px 35px'\"\n>\n  <div class=\"flex items-center gap\">\n    <div *ngIf=\"viewState.isToggle\" class=\"toggle-button-container\">\n      <button type=\"button\" (click)=\"toggleView()\" [ngClass]=\"buttonClass\">\n        <verben-svg\n          [icon]=\"tableIcon\"\n          [class.active]=\"!isTableView\"\n          [ngClass]=\"!isTableView ? activeIconClass : iconClass\"\n        ></verben-svg>\n        <verben-svg\n          [icon]=\"cardIcon\"\n          [class.active]=\"isTableView\"\n          [ngClass]=\"isTableView ? activeIconClass : iconClass\"\n          [width]=\"25\"\n\n          [height]=\"25\"\n        ></verben-svg>\n      </button>\n    </div>\n    <!-- Search Input -->\n    <div\n      [style.width]=\"inputWidth\"\n      class=\"search-input\"\n      *ngIf=\"viewState.isSearch\"\n    >\n      <verbena-input\n        [type]=\"'text'\"\n        [placeHolder]=\"'Search...'\"\n        (input)=\"onSearch($event)\"\n         [bgColor]=\"'transparent'\"\n        [border]=\"'0'\"\n        [value]=\"searchValue\"\n      />\n      <verben-svg\n      *ngIf=\"searchValue.length>0\"\n          [icon]=\"'close'\"\n          [width]=\"15\"\n          (click)=\"onClearSearch()\"\n          class=\"close-icon-class\"\n          [height]=\"15\"\n        ></verben-svg>\n    </div>\n  </div>\n\n  <div class=\"flex items-center relative gap\" [style.margin-left]=\"'10px'\">\n    <!-- Column Section -->\n    <ng-container\n      [appOutSideClick]=\"showColumnChild\"\n      (outSideClick)=\"showColumnChild = false\"\n      *ngIf=\"viewState.isColumn && isTableView\"\n    >\n      <ng-container *ngIf=\"columnTemplate; else defaultColumn\"></ng-container>\n      <ng-template #defaultColumn>\n        <span\n          [ngClass]=\"[\n            'flex gap text-xs items-center pd rounded cursor-pointer',\n            columnCustomClass ? columnCustomClass : ''\n          ]\"\n          [style.background-color]=\"'#D9D9D940'\"\n          (click)=\"toggleChildView('column')\"\n        >\n          <verben-svg [width]=\"15\" [icon]=\"'column'\"></verben-svg>\n          <span\n            >Columns <sup>({{ selectedColumnCount }})</sup></span\n          >\n        </span>\n        <div [style.z-index]=\"zIndex\" class=\"data-view-element\">\n          <ng-content\n            *ngIf=\"showColumnChild\"\n            select=\"[column-content]\"\n          ></ng-content>\n        </div>\n      </ng-template>\n    </ng-container>\n\n    <!-- Filter Section -->\n    <ng-container\n      [appOutSideClick]=\"showFilterChild\"\n      (outSideClick)=\"showFilterChild = false\"\n      *ngIf=\"viewState.isFilter\"\n    >\n      <ng-container *ngIf=\"filterTemplate; else defaultFilter\"></ng-container>\n      <ng-template #defaultFilter>\n        <span\n        [ngClass]=\"[\n        'flex gap text-xs items-center pd rounded cursor-pointer',\n        filterCustomClass ? filterCustomClass : ''\n      ]\"\n          [style.background-color]=\"'#D9D9D940'\"\n          (click)=\"toggleChildView('filter')\"\n        >\n          <verben-svg [width]=\"15\" [icon]=\"'filter'\"></verben-svg>\n          <span\n            >Filter <sup>({{ selectedFilterTableCount }})</sup></span\n          >\n        </span>\n        <div [style.z-index]=\"zIndex\" class=\"data-view-element\">\n          <ng-content\n            *ngIf=\"showFilterChild\"\n            select=\"[filter-content]\"\n          ></ng-content>\n        </div>\n      </ng-template>\n    </ng-container>\n\n    <!-- Sort Section -->\n    <ng-container\n      [appOutSideClick]=\"showSortChild\"\n      (outSideClick)=\"showSortChild = false\"\n      *ngIf=\"viewState.isSort\"\n    >\n      <ng-container *ngIf=\"sortTemplate; else defaultSort\"></ng-container>\n      <ng-template #defaultSort>\n        <span\n        [ngClass]=\"[\n        'flex gap text-xs items-center pd rounded cursor-pointer',\n      sortCustomClass ? sortCustomClass : ''\n      ]\"\n          [style.background-color]=\"'#D9D9D940'\"\n          (click)=\"toggleChildView('sort')\"\n        >\n          <verben-svg [width]=\"15\" [icon]=\"'sort'\"></verben-svg>\n          <span\n            >Sort <sup>({{ selectedSortCount }})</sup></span\n          >\n        </span>\n        <div [style.z-index]=\"zIndex\" class=\"data-view-element\">\n          <ng-content\n            *ngIf=\"showSortChild\"\n            select=\"[sort-content]\"\n          ></ng-content>\n        </div>\n      </ng-template>\n    </ng-container>\n\n    <!-- Export Section -->\n    <ng-container\n      [appOutSideClick]=\"showExportChild\"\n      (outSideClick)=\"showExportChild = false\"\n      *ngIf=\"viewState.isExport\"\n    >\n      <ng-container *ngIf=\"exportTemplate; else defaultExport\"></ng-container>\n      <ng-template #defaultExport>\n        <span\n        [ngClass]=\"[\n        'flex gap text-xs items-center pd rounded cursor-pointer',\n        exportCustomClass ? exportCustomClass : ''\n      ]\"\n          [style.background-color]=\"'#D9D9D940'\"\n          (click)=\"toggleChildView('export')\"\n        >\n          <verben-svg [width]=\"15\" [icon]=\"'export'\"></verben-svg>\n          Export\n        </span>\n        <div [style.z-index]=\"zIndex\" class=\"data-view-element\">\n          <ng-content\n            *ngIf=\"showExportChild\"\n            select=\"[export-content]\"\n          ></ng-content>\n        </div>\n      </ng-template>\n    </ng-container>\n\n    <!-- Select Section -->\n    <div *ngIf=\"viewState.isSelect\">\n      <span\n      [ngClass]=\"[\n      'flex gap text-xs items-center pd rounded cursor-pointer',\n      selectCustomClass ? selectCustomClass : ''\n    ]\"\n        [style.background-color]=\"'#D9D9D940'\"\n        (click)=\"toggleChildView('select')\"\n      >\n        <verben-svg [width]=\"15\" [icon]=\"'select'\"></verben-svg>\n        <span>Select</span>\n        <verben-svg [width]=\"6\" [icon]=\"'chevron-down'\"></verben-svg>\n      </span>\n    </div>\n\n    <!-- Create Button -->\n     \n    <div   [appOutSideClick]=\"create\"\n    (outSideClick)=\"create = false\" *ngIf=\"viewState.isCreate\">\n      <verbena-button\n        class=\"text-sm font-semibold\"\n        [bgColor]=\"'#FFE681'\"\n        [buttonClass]=\"createCustomClass\"\n        [pd]=\"'6px'\"\n        [borderRadius]=\"'4px'\"\n        [textColor]=\"'#000'\"\n        [svg]=\"'add'\"\n        [svgPosition]=\"'right'\"\n        [text]=\"'Create New'\"\n        (click)=\"toggleChildView('create')\"\n      >\n      </verbena-button>\n      <ng-container *ngIf=\"createTemplate; else defaultCreate\"></ng-container>\n      <ng-template #defaultCreate>\n      \n        <div [style.z-index]=\"zIndex\" class=\"data-view-element\">\n          <ng-content\n            *ngIf=\"create\"\n            select=\"[create-content]\"\n          ></ng-content>\n        </div>\n      </ng-template>\n    </div>\n  </div>\n</div>\n\n<!-- Grid and List View Handling -->\n<div *ngIf=\"isTableView; else listViewTemplate\">\n  <div [class]=\"tableClass\">\n    <ng-content select=\"[table-content]\"></ng-content>\n  </div>\n</div>\n<ng-template #listViewTemplate>\n  <div [class]=\"cardClass\">\n    <ng-content select=\"[card-content]\"></ng-content>\n  </div>\n</ng-template>\n", styles: [".toggle-button-container button{display:flex;justify-content:space-between;align-content:center;border:none;background-color:transparent;cursor:pointer;border:1px solid gray;padding:0;border-radius:6px;overflow:hidden;height:35px}.toggle-button-container verben-svg{transition:background-color .5s ease;padding:6px;position:relative}.toggle-button-container verben-svg.active{background-color:#d3d3d3}.flex{display:flex}.justify-between{justify-content:space-between}.items-center{align-items:center}.font-semibold{font-weight:600}.font-normal{font-weight:400}.text-sm{font-size:14px}.text-xs{font-size:12px}.gap{gap:7px}.pd{padding:5px 8px}.rounded-sm{border-radius:10px}.cursor-pointer{cursor:pointer}.search-input{position:relative;background-color:#f9f9f9;border-radius:10px}sup{color:#3479e9;font-weight:500}.data-view-element{position:absolute;top:80px;left:0}.relative{position:relative}.z-10{z-index:100000000000}.close-icon-class{position:absolute;right:10px;cursor:pointer;top:13px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: SvgComponent, selector: "verben-svg", inputs: ["icon", "width", "height", "fill", "stroke", "size"] }, { kind: "component", type: VerbenaInputComponent, selector: "verbena-input", inputs: ["label", "placeHolder", "required", "svgPosition", "minLength", "maxLength", "type", "bgColor", "border", "borderRadius", "textColor", "value", "labelPosition", "labelColor", "disable", "min", "max", "showBorder", "showErrorMessage", "errorMessageColor", "errorBorderColor", "errorPosition", "svg", "svgWidth", "svgHeight", "svgColor", "capitalization", "inputContainerClass", "inputFieldClass", "inputWrapperClass", "customErrorMessages"], outputs: ["valueChange"] }, { kind: "component", type: VerbenaButtonComponent, selector: "verbena-button", inputs: ["text", "icon", "svgPosition", "bgColor", "textColor", "border", "borderRadius", "pd", "width", "height", "fontSize", "fontWeight", "disable", "styleType", "svg", "svgWidth", "svgHeight", "svgColor", "buttonClass", "buttonTextClass"] }, { kind: "directive", type: OutSideClickDirective, selector: "[appOutSideClick]", inputs: ["appOutSideClick"], outputs: ["outSideClick"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.5", type: DataViewComponent, selector: "verben-data-view", inputs: { buttonClass: "buttonClass", iconClass: "iconClass", activeIconClass: "activeIconClass", columnCustomClass: "columnCustomClass", filterCustomClass: "filterCustomClass", sortCustomClass: "sortCustomClass", exportCustomClass: "exportCustomClass", selectCustomClass: "selectCustomClass", zIndex: "zIndex", createCustomClass: "createCustomClass", tableIcon: "tableIcon", cardIcon: "cardIcon", cardClass: "cardClass", tableClass: "tableClass", searchKey: "searchKey", searchValue: "searchValue", viewState: "viewState", searchTemplate: "searchTemplate", columnTemplate: "columnTemplate", filterTemplate: "filterTemplate", sortTemplate: "sortTemplate", exportTemplate: "exportTemplate", createTemplate: "createTemplate", selectedColumnCount: "selectedColumnCount", selectedSortCount: "selectedSortCount", selectedFilterTableCount: "selectedFilterTableCount", inputWidth: "inputWidth", showColumnChild: "showColumnChild", showSortChild: "showSortChild", showFilterChild: "showFilterChild", showExportChild: "showExportChild", create: "create", showSelected: "showSelected", isTableView: "isTableView" }, outputs: { viewChange: "viewChange", stateChange: "stateChange", onSearchChange: "onSearchChange" }, ngImport: i0, template: "<div\n  class=\"toolbar flex gap justify-between items-center\"\n>\n  <div class=\"flex items-center gap\">\n    <div *ngIf=\"viewState.isToggle\" class=\"toggle-button-container\">\n      <button type=\"button\" (click)=\"toggleView()\" [ngClass]=\"buttonClass\">\n        <verben-svg\n          [icon]=\"tableIcon\"\n          [class.active]=\"!isTableView\"\n          [ngClass]=\"!isTableView ? activeIconClass : iconClass\"\n        ></verben-svg>\n        <verben-svg\n          [icon]=\"cardIcon\"\n          [class.active]=\"isTableView\"\n          [ngClass]=\"isTableView ? activeIconClass : iconClass\"\n          [width]=\"25\"\n\n          [height]=\"25\"\n        ></verben-svg>\n      </button>\n    </div>\n    <!-- Search Input -->\n    <div\n      [style.width]=\"inputWidth\"\n      class=\"search-input\"\n      *ngIf=\"viewState.isSearch\"\n    >\n      <verbena-input\n        [type]=\"'text'\"\n        [placeHolder]=\"'Search...'\"\n        (input)=\"onSearch($event)\"\n         [bgColor]=\"'transparent'\"\n        [border]=\"'0'\"\n        [value]=\"searchValue\"\n      />\n      <verben-svg\n      *ngIf=\"searchValue.length>0\"\n          [icon]=\"'close'\"\n          [width]=\"15\"\n          (click)=\"onClearSearch()\"\n          class=\"close-icon-class\"\n          [height]=\"15\"\n        ></verben-svg>\n    </div>\n  </div>\n\n  <div class=\"flex items-center relative gap\" [style.margin-left]=\"'10px'\">\n    <!-- Column Section -->\n    <ng-container\n      [appOutSideClick]=\"showColumnChild\"\n      (outSideClick)=\"showColumnChild = false\"\n      *ngIf=\"viewState.isColumn && isTableView\"\n    >\n      <ng-container *ngIf=\"columnTemplate; else defaultColumn\"></ng-container>\n      <ng-template #defaultColumn>\n        <span\n          [ngClass]=\"[\n            'flex gap text-xs items-center pd rounded cursor-pointer',\n            columnCustomClass ? columnCustomClass : ''\n          ]\"\n          [style.background-color]=\"'#D9D9D940'\"\n          (click)=\"toggleChildView('column')\"\n        >\n          <verben-svg [width]=\"15\" [icon]=\"'column'\"></verben-svg>\n          <span\n            >Columns <sup>({{ selectedColumnCount }})</sup></span\n          >\n        </span>\n        <div [style.z-index]=\"zIndex\" class=\"data-view-element\">\n          <ng-content\n            *ngIf=\"showColumnChild\"\n            select=\"[column-content]\"\n          ></ng-content>\n        </div>\n      </ng-template>\n    </ng-container>\n\n    <!-- Filter Section -->\n    <ng-container\n      [appOutSideClick]=\"showFilterChild\"\n      (outSideClick)=\"showFilterChild = false\"\n      *ngIf=\"viewState.isFilter\"\n    >\n      <ng-container *ngIf=\"filterTemplate; else defaultFilter\"></ng-container>\n      <ng-template #defaultFilter>\n        <span\n        [ngClass]=\"[\n        'flex gap text-xs items-center pd rounded cursor-pointer',\n        filterCustomClass ? filterCustomClass : ''\n      ]\"\n          [style.background-color]=\"'#D9D9D940'\"\n          (click)=\"toggleChildView('filter')\"\n        >\n          <verben-svg [width]=\"15\" [icon]=\"'filter'\"></verben-svg>\n          <span\n            >Filter <sup>({{ selectedFilterTableCount }})</sup></span\n          >\n        </span>\n        <div [style.z-index]=\"zIndex\" class=\"data-view-element\">\n          <ng-content\n            *ngIf=\"showFilterChild\"\n            select=\"[filter-content]\"\n          ></ng-content>\n        </div>\n      </ng-template>\n    </ng-container>\n\n    <!-- Sort Section -->\n    <ng-container\n      [appOutSideClick]=\"showSortChild\"\n      (outSideClick)=\"showSortChild = false\"\n      *ngIf=\"viewState.isSort\"\n    >\n      <ng-container *ngIf=\"sortTemplate; else defaultSort\"></ng-container>\n      <ng-template #defaultSort>\n        <span\n        [ngClass]=\"[\n        'flex gap text-xs items-center pd rounded cursor-pointer',\n      sortCustomClass ? sortCustomClass : ''\n      ]\"\n          [style.background-color]=\"'#D9D9D940'\"\n          (click)=\"toggleChildView('sort')\"\n        >\n          <verben-svg [width]=\"15\" [icon]=\"'sort'\"></verben-svg>\n          <span\n            >Sort <sup>({{ selectedSortCount }})</sup></span\n          >\n        </span>\n        <div [style.z-index]=\"zIndex\" class=\"data-view-element\">\n          <ng-content\n            *ngIf=\"showSortChild\"\n            select=\"[sort-content]\"\n          ></ng-content>\n        </div>\n      </ng-template>\n    </ng-container>\n\n    <!-- Export Section -->\n    <ng-container\n      [appOutSideClick]=\"showExportChild\"\n      (outSideClick)=\"showExportChild = false\"\n      *ngIf=\"viewState.isExport\"\n    >\n      <ng-container *ngIf=\"exportTemplate; else defaultExport\"></ng-container>\n      <ng-template #defaultExport>\n        <span\n        [ngClass]=\"[\n        'flex gap text-xs items-center pd rounded cursor-pointer',\n        exportCustomClass ? exportCustomClass : ''\n      ]\"\n          [style.background-color]=\"'#D9D9D940'\"\n          (click)=\"toggleChildView('export')\"\n        >\n          <verben-svg [width]=\"15\" [icon]=\"'export'\"></verben-svg>\n          Export\n        </span>\n        <div [style.z-index]=\"zIndex\" class=\"data-view-element\">\n          <ng-content\n            *ngIf=\"showExportChild\"\n            select=\"[export-content]\"\n          ></ng-content>\n        </div>\n      </ng-template>\n    </ng-container>\n\n    <!-- Select Section -->\n    <div *ngIf=\"viewState.isSelect\">\n      <span\n      [ngClass]=\"[\n      'flex gap text-xs items-center pd rounded cursor-pointer',\n      selectCustomClass ? selectCustomClass : ''\n    ]\"\n        [style.background-color]=\"'#D9D9D940'\"\n        (click)=\"toggleChildView('select')\"\n      >\n        <verben-svg [width]=\"15\" [icon]=\"'select'\"></verben-svg>\n        <span>Select</span>\n        <verben-svg [width]=\"6\" [icon]=\"'chevron-down'\"></verben-svg>\n      </span>\n    </div>\n\n    <!-- Create Button -->\n     \n    <div   [appOutSideClick]=\"create\"\n    (outSideClick)=\"create = false\" *ngIf=\"viewState.isCreate\">\n      <verbena-button\n        class=\"text-sm font-semibold\"\n        [bgColor]=\"'#FFE681'\"\n        [buttonClass]=\"createCustomClass\"\n        [pd]=\"'6px'\"\n        [borderRadius]=\"'4px'\"\n        [textColor]=\"'#000'\"\n        [svg]=\"'add'\"\n        [svgPosition]=\"'right'\"\n        [text]=\"'Create New'\"\n        (click)=\"toggleChildView('create')\"\n      >\n      </verbena-button>\n      <ng-container *ngIf=\"createTemplate; else defaultCreate\"></ng-container>\n      <ng-template #defaultCreate>\n      \n        <div [style.z-index]=\"zIndex\" class=\"data-view-element\">\n          <ng-content\n            *ngIf=\"create\"\n            select=\"[create-content]\"\n          ></ng-content>\n        </div>\n      </ng-template>\n    </div>\n  </div>\n</div>\n\n<!-- Grid and List View Handling -->\n<div *ngIf=\"isTableView; else listViewTemplate\">\n  <div [class]=\"tableClass\">\n    <ng-content select=\"[table-content]\"></ng-content>\n  </div>\n</div>\n<ng-template #listViewTemplate>\n  <div [class]=\"cardClass\">\n    <ng-content select=\"[card-content]\"></ng-content>\n  </div>\n</ng-template>\n", styles: [".toggle-button-container button{display:flex;justify-content:space-between;align-content:center;border:none;background-color:transparent;cursor:pointer;border:1px solid gray;padding:0;border-radius:6px;overflow:hidden;height:35px}.toggle-button-container verben-svg{transition:background-color .5s ease;padding:6px;position:relative}.toggle-button-container verben-svg.active{background-color:#d3d3d3}.flex{display:flex}.justify-between{justify-content:space-between}.items-center{align-items:center}.font-semibold{font-weight:600}.font-normal{font-weight:400}.text-sm{font-size:14px}.text-xs{font-size:12px}.gap{gap:7px}.pd{padding:5px 8px}.rounded-sm{border-radius:10px}.cursor-pointer{cursor:pointer}.search-input{position:relative;background-color:#f9f9f9;border-radius:10px}sup{color:#3479e9;font-weight:500}.data-view-element{position:absolute;top:80px;left:0}.relative{position:relative}.z-10{z-index:100000000000}.close-icon-class{position:absolute;right:10px;cursor:pointer;top:13px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: SvgComponent, selector: "verben-svg", inputs: ["icon", "width", "height", "fill", "stroke", "size"] }, { kind: "component", type: VerbenaInputComponent, selector: "verbena-input", inputs: ["label", "placeHolder", "required", "svgPosition", "minLength", "maxLength", "type", "bgColor", "border", "borderRadius", "textColor", "value", "labelPosition", "labelColor", "disable", "min", "max", "showBorder", "showErrorMessage", "errorMessageColor", "errorBorderColor", "errorPosition", "svg", "svgWidth", "svgHeight", "svgColor", "capitalization", "inputContainerClass", "inputFieldClass", "inputWrapperClass", "customErrorMessages"], outputs: ["valueChange"] }, { kind: "component", type: VerbenaButtonComponent, selector: "verbena-button", inputs: ["text", "icon", "svgPosition", "bgColor", "textColor", "border", "borderRadius", "pd", "width", "height", "fontSize", "fontWeight", "disable", "styleType", "svg", "svgWidth", "svgHeight", "svgColor", "buttonClass", "buttonTextClass"] }, { kind: "directive", type: OutSideClickDirective, selector: "[appOutSideClick]", inputs: ["appOutSideClick"], outputs: ["outSideClick"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.5", ngImport: i0, type: DataViewComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'verben-data-view', template: "<div\n  class=\"toolbar flex gap justify-between items-center\"\n  [style.margin]=\"'0px 35px'\"\n>\n  <div class=\"flex items-center gap\">\n    <div *ngIf=\"viewState.isToggle\" class=\"toggle-button-container\">\n      <button type=\"button\" (click)=\"toggleView()\" [ngClass]=\"buttonClass\">\n        <verben-svg\n          [icon]=\"tableIcon\"\n          [class.active]=\"!isTableView\"\n          [ngClass]=\"!isTableView ? activeIconClass : iconClass\"\n        ></verben-svg>\n        <verben-svg\n          [icon]=\"cardIcon\"\n          [class.active]=\"isTableView\"\n          [ngClass]=\"isTableView ? activeIconClass : iconClass\"\n          [width]=\"25\"\n\n          [height]=\"25\"\n        ></verben-svg>\n      </button>\n    </div>\n    <!-- Search Input -->\n    <div\n      [style.width]=\"inputWidth\"\n      class=\"search-input\"\n      *ngIf=\"viewState.isSearch\"\n    >\n      <verbena-input\n        [type]=\"'text'\"\n        [placeHolder]=\"'Search...'\"\n        (input)=\"onSearch($event)\"\n         [bgColor]=\"'transparent'\"\n        [border]=\"'0'\"\n        [value]=\"searchValue\"\n      />\n      <verben-svg\n      *ngIf=\"searchValue.length>0\"\n          [icon]=\"'close'\"\n          [width]=\"15\"\n          (click)=\"onClearSearch()\"\n          class=\"close-icon-class\"\n          [height]=\"15\"\n        ></verben-svg>\n    </div>\n  </div>\n\n  <div class=\"flex items-center relative gap\" [style.margin-left]=\"'10px'\">\n    <!-- Column Section -->\n    <ng-container\n      [appOutSideClick]=\"showColumnChild\"\n      (outSideClick)=\"showColumnChild = false\"\n      *ngIf=\"viewState.isColumn && isTableView\"\n    >\n      <ng-container *ngIf=\"columnTemplate; else defaultColumn\"></ng-container>\n      <ng-template #defaultColumn>\n        <span\n          [ngClass]=\"[\n            'flex gap text-xs items-center pd rounded cursor-pointer',\n            columnCustomClass ? columnCustomClass : ''\n          ]\"\n          [style.background-color]=\"'#D9D9D940'\"\n          (click)=\"toggleChildView('column')\"\n        >\n          <verben-svg [width]=\"15\" [icon]=\"'column'\"></verben-svg>\n          <span\n            >Columns <sup>({{ selectedColumnCount }})</sup></span\n          >\n        </span>\n        <div [style.z-index]=\"zIndex\" class=\"data-view-element\">\n          <ng-content\n            *ngIf=\"showColumnChild\"\n            select=\"[column-content]\"\n          ></ng-content>\n        </div>\n      </ng-template>\n    </ng-container>\n\n    <!-- Filter Section -->\n    <ng-container\n      [appOutSideClick]=\"showFilterChild\"\n      (outSideClick)=\"showFilterChild = false\"\n      *ngIf=\"viewState.isFilter\"\n    >\n      <ng-container *ngIf=\"filterTemplate; else defaultFilter\"></ng-container>\n      <ng-template #defaultFilter>\n        <span\n        [ngClass]=\"[\n        'flex gap text-xs items-center pd rounded cursor-pointer',\n        filterCustomClass ? filterCustomClass : ''\n      ]\"\n          [style.background-color]=\"'#D9D9D940'\"\n          (click)=\"toggleChildView('filter')\"\n        >\n          <verben-svg [width]=\"15\" [icon]=\"'filter'\"></verben-svg>\n          <span\n            >Filter <sup>({{ selectedFilterTableCount }})</sup></span\n          >\n        </span>\n        <div [style.z-index]=\"zIndex\" class=\"data-view-element\">\n          <ng-content\n            *ngIf=\"showFilterChild\"\n            select=\"[filter-content]\"\n          ></ng-content>\n        </div>\n      </ng-template>\n    </ng-container>\n\n    <!-- Sort Section -->\n    <ng-container\n      [appOutSideClick]=\"showSortChild\"\n      (outSideClick)=\"showSortChild = false\"\n      *ngIf=\"viewState.isSort\"\n    >\n      <ng-container *ngIf=\"sortTemplate; else defaultSort\"></ng-container>\n      <ng-template #defaultSort>\n        <span\n        [ngClass]=\"[\n        'flex gap text-xs items-center pd rounded cursor-pointer',\n      sortCustomClass ? sortCustomClass : ''\n      ]\"\n          [style.background-color]=\"'#D9D9D940'\"\n          (click)=\"toggleChildView('sort')\"\n        >\n          <verben-svg [width]=\"15\" [icon]=\"'sort'\"></verben-svg>\n          <span\n            >Sort <sup>({{ selectedSortCount }})</sup></span\n          >\n        </span>\n        <div [style.z-index]=\"zIndex\" class=\"data-view-element\">\n          <ng-content\n            *ngIf=\"showSortChild\"\n            select=\"[sort-content]\"\n          ></ng-content>\n        </div>\n      </ng-template>\n    </ng-container>\n\n    <!-- Export Section -->\n    <ng-container\n      [appOutSideClick]=\"showExportChild\"\n      (outSideClick)=\"showExportChild = false\"\n      *ngIf=\"viewState.isExport\"\n    >\n      <ng-container *ngIf=\"exportTemplate; else defaultExport\"></ng-container>\n      <ng-template #defaultExport>\n        <span\n        [ngClass]=\"[\n        'flex gap text-xs items-center pd rounded cursor-pointer',\n        exportCustomClass ? exportCustomClass : ''\n      ]\"\n          [style.background-color]=\"'#D9D9D940'\"\n          (click)=\"toggleChildView('export')\"\n        >\n          <verben-svg [width]=\"15\" [icon]=\"'export'\"></verben-svg>\n          Export\n        </span>\n        <div [style.z-index]=\"zIndex\" class=\"data-view-element\">\n          <ng-content\n            *ngIf=\"showExportChild\"\n            select=\"[export-content]\"\n          ></ng-content>\n        </div>\n      </ng-template>\n    </ng-container>\n\n    <!-- Select Section -->\n    <div *ngIf=\"viewState.isSelect\">\n      <span\n      [ngClass]=\"[\n      'flex gap text-xs items-center pd rounded cursor-pointer',\n      selectCustomClass ? selectCustomClass : ''\n    ]\"\n        [style.background-color]=\"'#D9D9D940'\"\n        (click)=\"toggleChildView('select')\"\n      >\n        <verben-svg [width]=\"15\" [icon]=\"'select'\"></verben-svg>\n        <span>Select</span>\n        <verben-svg [width]=\"6\" [icon]=\"'chevron-down'\"></verben-svg>\n      </span>\n    </div>\n\n    <!-- Create Button -->\n     \n    <div   [appOutSideClick]=\"create\"\n    (outSideClick)=\"create = false\" *ngIf=\"viewState.isCreate\">\n      <verbena-button\n        class=\"text-sm font-semibold\"\n        [bgColor]=\"'#FFE681'\"\n        [buttonClass]=\"createCustomClass\"\n        [pd]=\"'6px'\"\n        [borderRadius]=\"'4px'\"\n        [textColor]=\"'#000'\"\n        [svg]=\"'add'\"\n        [svgPosition]=\"'right'\"\n        [text]=\"'Create New'\"\n        (click)=\"toggleChildView('create')\"\n      >\n      </verbena-button>\n      <ng-container *ngIf=\"createTemplate; else defaultCreate\"></ng-container>\n      <ng-template #defaultCreate>\n      \n        <div [style.z-index]=\"zIndex\" class=\"data-view-element\">\n          <ng-content\n            *ngIf=\"create\"\n            select=\"[create-content]\"\n          ></ng-content>\n        </div>\n      </ng-template>\n    </div>\n  </div>\n</div>\n\n<!-- Grid and List View Handling -->\n<div *ngIf=\"isTableView; else listViewTemplate\">\n  <div [class]=\"tableClass\">\n    <ng-content select=\"[table-content]\"></ng-content>\n  </div>\n</div>\n<ng-template #listViewTemplate>\n  <div [class]=\"cardClass\">\n    <ng-content select=\"[card-content]\"></ng-content>\n  </div>\n</ng-template>\n", styles: [".toggle-button-container button{display:flex;justify-content:space-between;align-content:center;border:none;background-color:transparent;cursor:pointer;border:1px solid gray;padding:0;border-radius:6px;overflow:hidden;height:35px}.toggle-button-container verben-svg{transition:background-color .5s ease;padding:6px;position:relative}.toggle-button-container verben-svg.active{background-color:#d3d3d3}.flex{display:flex}.justify-between{justify-content:space-between}.items-center{align-items:center}.font-semibold{font-weight:600}.font-normal{font-weight:400}.text-sm{font-size:14px}.text-xs{font-size:12px}.gap{gap:7px}.pd{padding:5px 8px}.rounded-sm{border-radius:10px}.cursor-pointer{cursor:pointer}.search-input{position:relative;background-color:#f9f9f9;border-radius:10px}sup{color:#3479e9;font-weight:500}.data-view-element{position:absolute;top:80px;left:0}.relative{position:relative}.z-10{z-index:100000000000}.close-icon-class{position:absolute;right:10px;cursor:pointer;top:13px}\n"] }]
+            args: [{ selector: 'verben-data-view', template: "<div\n  class=\"toolbar flex gap justify-between items-center\"\n>\n  <div class=\"flex items-center gap\">\n    <div *ngIf=\"viewState.isToggle\" class=\"toggle-button-container\">\n      <button type=\"button\" (click)=\"toggleView()\" [ngClass]=\"buttonClass\">\n        <verben-svg\n          [icon]=\"tableIcon\"\n          [class.active]=\"!isTableView\"\n          [ngClass]=\"!isTableView ? activeIconClass : iconClass\"\n        ></verben-svg>\n        <verben-svg\n          [icon]=\"cardIcon\"\n          [class.active]=\"isTableView\"\n          [ngClass]=\"isTableView ? activeIconClass : iconClass\"\n          [width]=\"25\"\n\n          [height]=\"25\"\n        ></verben-svg>\n      </button>\n    </div>\n    <!-- Search Input -->\n    <div\n      [style.width]=\"inputWidth\"\n      class=\"search-input\"\n      *ngIf=\"viewState.isSearch\"\n    >\n      <verbena-input\n        [type]=\"'text'\"\n        [placeHolder]=\"'Search...'\"\n        (input)=\"onSearch($event)\"\n         [bgColor]=\"'transparent'\"\n        [border]=\"'0'\"\n        [value]=\"searchValue\"\n      />\n      <verben-svg\n      *ngIf=\"searchValue.length>0\"\n          [icon]=\"'close'\"\n          [width]=\"15\"\n          (click)=\"onClearSearch()\"\n          class=\"close-icon-class\"\n          [height]=\"15\"\n        ></verben-svg>\n    </div>\n  </div>\n\n  <div class=\"flex items-center relative gap\" [style.margin-left]=\"'10px'\">\n    <!-- Column Section -->\n    <ng-container\n      [appOutSideClick]=\"showColumnChild\"\n      (outSideClick)=\"showColumnChild = false\"\n      *ngIf=\"viewState.isColumn && isTableView\"\n    >\n      <ng-container *ngIf=\"columnTemplate; else defaultColumn\"></ng-container>\n      <ng-template #defaultColumn>\n        <span\n          [ngClass]=\"[\n            'flex gap text-xs items-center pd rounded cursor-pointer',\n            columnCustomClass ? columnCustomClass : ''\n          ]\"\n          [style.background-color]=\"'#D9D9D940'\"\n          (click)=\"toggleChildView('column')\"\n        >\n          <verben-svg [width]=\"15\" [icon]=\"'column'\"></verben-svg>\n          <span\n            >Columns <sup>({{ selectedColumnCount }})</sup></span\n          >\n        </span>\n        <div [style.z-index]=\"zIndex\" class=\"data-view-element\">\n          <ng-content\n            *ngIf=\"showColumnChild\"\n            select=\"[column-content]\"\n          ></ng-content>\n        </div>\n      </ng-template>\n    </ng-container>\n\n    <!-- Filter Section -->\n    <ng-container\n      [appOutSideClick]=\"showFilterChild\"\n      (outSideClick)=\"showFilterChild = false\"\n      *ngIf=\"viewState.isFilter\"\n    >\n      <ng-container *ngIf=\"filterTemplate; else defaultFilter\"></ng-container>\n      <ng-template #defaultFilter>\n        <span\n        [ngClass]=\"[\n        'flex gap text-xs items-center pd rounded cursor-pointer',\n        filterCustomClass ? filterCustomClass : ''\n      ]\"\n          [style.background-color]=\"'#D9D9D940'\"\n          (click)=\"toggleChildView('filter')\"\n        >\n          <verben-svg [width]=\"15\" [icon]=\"'filter'\"></verben-svg>\n          <span\n            >Filter <sup>({{ selectedFilterTableCount }})</sup></span\n          >\n        </span>\n        <div [style.z-index]=\"zIndex\" class=\"data-view-element\">\n          <ng-content\n            *ngIf=\"showFilterChild\"\n            select=\"[filter-content]\"\n          ></ng-content>\n        </div>\n      </ng-template>\n    </ng-container>\n\n    <!-- Sort Section -->\n    <ng-container\n      [appOutSideClick]=\"showSortChild\"\n      (outSideClick)=\"showSortChild = false\"\n      *ngIf=\"viewState.isSort\"\n    >\n      <ng-container *ngIf=\"sortTemplate; else defaultSort\"></ng-container>\n      <ng-template #defaultSort>\n        <span\n        [ngClass]=\"[\n        'flex gap text-xs items-center pd rounded cursor-pointer',\n      sortCustomClass ? sortCustomClass : ''\n      ]\"\n          [style.background-color]=\"'#D9D9D940'\"\n          (click)=\"toggleChildView('sort')\"\n        >\n          <verben-svg [width]=\"15\" [icon]=\"'sort'\"></verben-svg>\n          <span\n            >Sort <sup>({{ selectedSortCount }})</sup></span\n          >\n        </span>\n        <div [style.z-index]=\"zIndex\" class=\"data-view-element\">\n          <ng-content\n            *ngIf=\"showSortChild\"\n            select=\"[sort-content]\"\n          ></ng-content>\n        </div>\n      </ng-template>\n    </ng-container>\n\n    <!-- Export Section -->\n    <ng-container\n      [appOutSideClick]=\"showExportChild\"\n      (outSideClick)=\"showExportChild = false\"\n      *ngIf=\"viewState.isExport\"\n    >\n      <ng-container *ngIf=\"exportTemplate; else defaultExport\"></ng-container>\n      <ng-template #defaultExport>\n        <span\n        [ngClass]=\"[\n        'flex gap text-xs items-center pd rounded cursor-pointer',\n        exportCustomClass ? exportCustomClass : ''\n      ]\"\n          [style.background-color]=\"'#D9D9D940'\"\n          (click)=\"toggleChildView('export')\"\n        >\n          <verben-svg [width]=\"15\" [icon]=\"'export'\"></verben-svg>\n          Export\n        </span>\n        <div [style.z-index]=\"zIndex\" class=\"data-view-element\">\n          <ng-content\n            *ngIf=\"showExportChild\"\n            select=\"[export-content]\"\n          ></ng-content>\n        </div>\n      </ng-template>\n    </ng-container>\n\n    <!-- Select Section -->\n    <div *ngIf=\"viewState.isSelect\">\n      <span\n      [ngClass]=\"[\n      'flex gap text-xs items-center pd rounded cursor-pointer',\n      selectCustomClass ? selectCustomClass : ''\n    ]\"\n        [style.background-color]=\"'#D9D9D940'\"\n        (click)=\"toggleChildView('select')\"\n      >\n        <verben-svg [width]=\"15\" [icon]=\"'select'\"></verben-svg>\n        <span>Select</span>\n        <verben-svg [width]=\"6\" [icon]=\"'chevron-down'\"></verben-svg>\n      </span>\n    </div>\n\n    <!-- Create Button -->\n     \n    <div   [appOutSideClick]=\"create\"\n    (outSideClick)=\"create = false\" *ngIf=\"viewState.isCreate\">\n      <verbena-button\n        class=\"text-sm font-semibold\"\n        [bgColor]=\"'#FFE681'\"\n        [buttonClass]=\"createCustomClass\"\n        [pd]=\"'6px'\"\n        [borderRadius]=\"'4px'\"\n        [textColor]=\"'#000'\"\n        [svg]=\"'add'\"\n        [svgPosition]=\"'right'\"\n        [text]=\"'Create New'\"\n        (click)=\"toggleChildView('create')\"\n      >\n      </verbena-button>\n      <ng-container *ngIf=\"createTemplate; else defaultCreate\"></ng-container>\n      <ng-template #defaultCreate>\n      \n        <div [style.z-index]=\"zIndex\" class=\"data-view-element\">\n          <ng-content\n            *ngIf=\"create\"\n            select=\"[create-content]\"\n          ></ng-content>\n        </div>\n      </ng-template>\n    </div>\n  </div>\n</div>\n\n<!-- Grid and List View Handling -->\n<div *ngIf=\"isTableView; else listViewTemplate\">\n  <div [class]=\"tableClass\">\n    <ng-content select=\"[table-content]\"></ng-content>\n  </div>\n</div>\n<ng-template #listViewTemplate>\n  <div [class]=\"cardClass\">\n    <ng-content select=\"[card-content]\"></ng-content>\n  </div>\n</ng-template>\n", styles: [".toggle-button-container button{display:flex;justify-content:space-between;align-content:center;border:none;background-color:transparent;cursor:pointer;border:1px solid gray;padding:0;border-radius:6px;overflow:hidden;height:35px}.toggle-button-container verben-svg{transition:background-color .5s ease;padding:6px;position:relative}.toggle-button-container verben-svg.active{background-color:#d3d3d3}.flex{display:flex}.justify-between{justify-content:space-between}.items-center{align-items:center}.font-semibold{font-weight:600}.font-normal{font-weight:400}.text-sm{font-size:14px}.text-xs{font-size:12px}.gap{gap:7px}.pd{padding:5px 8px}.rounded-sm{border-radius:10px}.cursor-pointer{cursor:pointer}.search-input{position:relative;background-color:#f9f9f9;border-radius:10px}sup{color:#3479e9;font-weight:500}.data-view-element{position:absolute;top:80px;left:0}.relative{position:relative}.z-10{z-index:100000000000}.close-icon-class{position:absolute;right:10px;cursor:pointer;top:13px}\n"] }]
         }], propDecorators: { buttonClass: [{
                 type: Input
             }], iconClass: [{