verben-ng-ui 0.0.8 → 0.0.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/esm2022/lib/components/data-view/data-view.component.mjs +23 -6
  2. package/fesm2022/verben-ng-ui.mjs +22 -5
  3. package/fesm2022/verben-ng-ui.mjs.map +1 -1
  4. package/lib/components/data-view/data-view.component.d.ts +10 -2
  5. package/package.json +1 -1
package/esm2022/lib/components/data-view/data-view.component.mjs CHANGED
@@ -20,6 +20,8 @@ export class DataViewComponent {
20
20
  cardIcon = 'list-view';
21
21
  cardClass = '';
22
22
  tableClass = '';
23
+ searchKey = 'search';
24
+ searchValue = '';
23
25
  viewState = {
24
26
  isSearch: true,
25
27
  isColumn: true,
@@ -27,7 +29,8 @@ export class DataViewComponent {
27
29
  isSort: true,
28
30
  isExport: true,
29
31
  isSelect: true,
30
- isCreate: true
32
+ isCreate: true,
33
+ isToggle: true
31
34
  };
32
35
  searchTemplate;
33
36
  columnTemplate;
@@ -45,16 +48,22 @@ export class DataViewComponent {
45
48
  showExportChild = false;
46
49
  create = false;
47
50
  showSelected = false;
51
+ isTableView = false;
48
52
  viewChange = new EventEmitter();
49
53
  stateChange = new EventEmitter();
50
- isTableView = false;
54
+ onSearchChange = new EventEmitter();
51
55
  ngOnInit() { }
52
56
  toggleView() {
53
57
  this.isTableView = !this.isTableView;
54
58
  this.viewChange.emit(this.isTableView);
55
59
  }
56
60
  onSearch(event) {
57
- this.stateChange.emit({ key: 'search', value: event.target.value });
61
+ this.searchValue = event.target.value;
62
+ console.log({ key: this.searchKey, value: event.target.value });
63
+ this.onSearchChange.emit({ key: this.searchKey, value: this.searchValue });
64
+ }
65
+ onClearSearch() {
66
+ this.searchValue = "";
58
67
  }
59
68
  toggleChildView(viewType) {
60
69
  switch (viewType) {
@@ -120,11 +129,11 @@ export class DataViewComponent {
120
129
  }
121
130
  }
122
131
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.5", ngImport: i0, type: DataViewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
123
- 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", 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" }, outputs: { viewChange: "viewChange", stateChange: "stateChange" }, 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 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 [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 [borderRadius]=\"'10px'\"\n [border]=\"'0'\"\n />\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{width:30%}sup{color:#3479e9;font-weight:500}.data-view-element{position:absolute;top:80px;left:0}.relative{position:relative}.z-10{z-index:100000000000}\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"] }] });
132
+ 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"] }] });
124
133
  }
125
134
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.5", ngImport: i0, type: DataViewComponent, decorators: [{
126
135
  type: Component,
127
- 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 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 [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 [borderRadius]=\"'10px'\"\n [border]=\"'0'\"\n />\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{width:30%}sup{color:#3479e9;font-weight:500}.data-view-element{position:absolute;top:80px;left:0}.relative{position:relative}.z-10{z-index:100000000000}\n"] }]
136
+ 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"] }]
128
137
  }], propDecorators: { buttonClass: [{
129
138
  type: Input
130
139
  }], iconClass: [{
@@ -153,6 +162,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.5", ngImpor
153
162
  type: Input
154
163
  }], tableClass: [{
155
164
  type: Input
165
+ }], searchKey: [{
166
+ type: Input
167
+ }], searchValue: [{
168
+ type: Input
156
169
  }], viewState: [{
157
170
  type: Input
158
171
  }], searchTemplate: [{
@@ -187,9 +200,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.5", ngImpor
187
200
  type: Input
188
201
  }], showSelected: [{
189
202
  type: Input
203
+ }], isTableView: [{
204
+ type: Input
190
205
  }], viewChange: [{
191
206
  type: Output
192
207
  }], stateChange: [{
193
208
  type: Output
209
+ }], onSearchChange: [{
210
+ type: Output
194
211
  }] } });
195
- //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGF0YS12aWV3LmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL3ZlcmJlbi1uZy11aS9zcmMvbGliL2NvbXBvbmVudHMvZGF0YS12aWV3L2RhdGEtdmlldy5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy92ZXJiZW4tbmctdWkvc3JjL2xpYi9jb21wb25lbnRzL2RhdGEtdmlldy9kYXRhLXZpZXcuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUVMLFNBQVMsRUFDVCxZQUFZLEVBQ1osS0FBSyxFQUVMLE1BQU0sR0FDUCxNQUFNLGVBQWUsQ0FBQzs7Ozs7OztBQWlCdkIsTUFBTSxPQUFPLGlCQUFpQjtJQUNuQixXQUFXLENBQVU7SUFDckIsU0FBUyxDQUFVO0lBQ25CLGVBQWUsR0FBVSxFQUFFLENBQUE7SUFDM0IsaUJBQWlCLEdBQVMsRUFBRSxDQUFBO0lBQzVCLGlCQUFpQixHQUFTLEVBQUUsQ0FBQTtJQUM1QixlQUFlLEdBQVMsRUFBRSxDQUFBO0lBQzFCLGlCQUFpQixHQUFTLEVBQUUsQ0FBQTtJQUM1QixpQkFBaUIsR0FBUyxFQUFFLENBQUE7SUFDNUIsTUFBTSxHQUFTLENBQUMsQ0FBQTtJQUNoQixpQkFBaUIsR0FBUSxFQUFFLENBQUE7SUFDM0IsU0FBUyxHQUFXLFFBQVEsQ0FBQztJQUM3QixRQUFRLEdBQVcsV0FBVyxDQUFDO0lBQy9CLFNBQVMsR0FBVyxFQUFFLENBQUM7SUFDdkIsVUFBVSxHQUFXLEVBQUUsQ0FBQztJQUN4QixTQUFTLEdBQWM7UUFDOUIsUUFBUSxFQUFFLElBQUk7UUFDZCxRQUFRLEVBQUUsSUFBSTtRQUNkLFFBQVEsRUFBRSxJQUFJO1FBQ2QsTUFBTSxFQUFFLElBQUk7UUFDWixRQUFRLEVBQUUsSUFBSTtRQUNkLFFBQVEsRUFBRSxJQUFJO1FBQ2QsUUFBUSxFQUFDLElBQUk7S0FD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ZTtzQkFBdkIsS0FBSztnQkFDRyxpQkFBaUI7c0JBQXpCLEtBQUs7Z0JBQ0csaUJBQWlCO3NCQUF6QixLQUFLO2dCQUNHLE1BQU07c0JBQWQsS0FBSztnQkFDRyxpQkFBaUI7c0JBQXpCLEtBQUs7Z0JBQ0csU0FBUztzQkFBakIsS0FBSztnQkFDRyxRQUFRO3NCQUFoQixLQUFLO2dCQUNHLFNBQVM7c0JBQWpCLEtBQUs7Z0JBQ0csVUFBVTtzQkFBbEIsS0FBSztnQkFDRyxTQUFTO3NCQUFqQixLQUFLO2dCQVVHLGNBQWM7c0JBQXRCLEtBQUs7Z0JBQ0csY0FBYztzQkFBdEIsS0FBSztnQkFDRyxjQUFjO3NCQUF0QixLQUFLO2dCQUNHLFlBQVk7c0JBQXBCLEtBQUs7Z0JBQ0csY0FBYztzQkFBdEIsS0FBSztnQkFDRyxjQUFjO3NCQUF0QixLQUFLO2dCQUNHLG1CQUFtQjtzQkFBM0IsS0FBSztnQkFDRyxpQkFBaUI7c0JBQXpCLEtBQUs7Z0JBQ0csd0JBQXdCO3NCQUFoQyxLQUFLO2dCQUNHLFVBQVU7c0JBQWxCLEtBQUs7Z0JBQ0UsZUFBZTtzQkFBdEIsS0FBSztnQkFDRyxhQUFhO3NCQUFyQixLQUFLO2dCQUNHLGVBQWU7c0JBQXZCLEtBQUs7Z0JBQ0csZUFBZTtzQkFBdkIsS0FBSztnQkFDRyxNQUFNO3NCQUFkLEtBQUs7Z0JBQ0csWUFBWTtzQkFBcEIsS0FBSztnQkFFSSxVQUFVO3NCQUFuQixNQUFNO2dCQUNHLFdBQVc7c0JBQXBCLE1BQU0iLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge1xuICBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSxcbiAgQ29tcG9uZW50LFxuICBFdmVudEVtaXR0ZXIsXG4gIElucHV0LFxuICBPbkluaXQsXG4gIE91dHB1dCxcbn0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbmludGVyZmFjZSBWaWV3U3RhdGUge1xuICBpc1NlYXJjaD86IGJvb2xlYW47XG4gIGlzQ29sdW1uPzogYm9vbGVhbjtcbiAgaXNGaWx0ZXI/OiBib29sZWFuO1xuICBpc1NvcnQ/OiBib29sZWFuO1xuICBpc0V4cG9ydD86IGJvb2xlYW47XG4gIGlzU2VsZWN0PzogYm9vbGVhbjtcbiAgaXNDcmVhdGU/OmJvb2xlYW5cbn1cblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAndmVyYmVuLWRhdGEtdmlldycsXG4gIHRlbXBsYXRlVXJsOiAnLi9kYXRhLXZpZXcuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybHM6IFsnLi9kYXRhLXZpZXcuY29tcG9uZW50LmNzcyddLFxufSlcbmV4cG9ydCBjbGFzcyBEYXRhVmlld0NvbXBvbmVudCBpbXBsZW1lbnRzIE9uSW5pdCB7XG4gIEBJbnB1dCgpIGJ1dHRvbkNsYXNzPzogc3RyaW5nO1xuICBASW5wdXQoKSBpY29uQ2xhc3M/OiBzdHJpbmc7XG4gIEBJbnB1dCgpIGFjdGl2ZUljb25DbGFzcz86IHN0cmluZz1cIlwiXG4gIEBJbnB1dCgpIGNvbHVtbkN1c3RvbUNsYXNzPzpzdHJpbmc9JydcbiAgQElucHV0KCkgZmlsdGVyQ3VzdG9tQ2xhc3M/OnN0cmluZz0nJ1xuICBASW5wdXQoKSBzb3J0Q3VzdG9tQ2xhc3M/OnN0cmluZz0nJ1xuICBASW5wdXQoKSBleHBvcnRDdXN0b21DbGFzcz86c3RyaW5nPScnXG4gIEBJbnB1dCgpIHNlbGVjdEN1c3RvbUNsYXNzPzpzdHJpbmc9JydcbiAgQElucHV0KCkgekluZGV4PzpudW1iZXI9NVxuICBASW5wdXQoKSBjcmVhdGVDdXN0b21DbGFzczpzdHJpbmc9JydcbiAgQElucHV0KCkgdGFibGVJY29uOiBzdHJpbmcgPSAnZ3JpZC0zJztcbiAgQElucHV0KCkgY2FyZEljb246IHN0cmluZyA9ICdsaXN0LXZpZXcnO1xuICBASW5wdXQoKSBjYXJkQ2xhc3M6IHN0cmluZyA9ICcnO1xuICBASW5wdXQoKSB0YWJsZUNsYXNzOiBzdHJpbmcgPSAnJztcbiAgQElucHV0KCkgdmlld1N0YXRlOiBWaWV3U3RhdGUgPSB7XG4gICAgaXNTZWFyY2g6IHRydWUsXG4gICAgaXNDb2x1bW46IHRydWUsXG4gICAgaXNGaWx0ZXI6IHRydWUsXG4gICAgaXNTb3J0OiB0cnVlLFxuICAgIGlzRXhwb3J0OiB0cnVlLFxuICAgIGlzU2VsZWN0OiB0cnVlLFxuICAgIGlzQ3JlYXRlOnRydWVcbiAgfTtcblxuICBASW5wdXQoKSBzZWFyY2hUZW1wbGF0ZT86IE5vZGU7XG4gIEBJbnB1dCgpIGNvbHVtblRlbXBsYXRlPzogTm9kZTtcbiAgQElucHV0KCkgZmlsdGVyVGVtcGxhdGU/OiBOb2RlO1xuICBASW5wdXQoKSBzb3J0VGVtcGxhdGU/OiBOb2RlO1xuICBASW5wdXQoKSBleHBvcnRUZW1wbGF0ZT86IE5vZGU7XG4gIEBJbnB1dCgpIGNyZWF0ZVRlbXBsYXRlPzogTm9kZTtcbiAgQElucHV0KCkgc2VsZWN0ZWRDb2x1bW5Db3VudD86IG51bWJlciA9IDA7XG4gIEBJbnB1dCgpIHNlbGVjdGVkU29ydENvdW50OiBudW1iZXIgPSAwO1xuICBASW5wdXQoKSBzZWxlY3RlZEZpbHRlclRhYmxlQ291bnQ6IG51bWJlciA9IDA7XG4gIEBJbnB1dCgpIGlucHV0V2lkdGg6IHN0cmluZz1cIjM1MHB4XCI7XG4gIEBJbnB1dCgpc2hvd0NvbHVtbkNoaWxkOiBib29sZWFuID0gZmFsc2U7XG4gIEBJbnB1dCgpIHNob3dTb3J0Q2hpbGQ6IGJvb2xlYW4gPSBmYWxzZTtcbiAgQElucHV0KCkgc2hvd0ZpbHRlckNoaWxkOiBib29sZWFuID0gZmFsc2U7XG4gIEBJbnB1dCgpIHNob3dFeHBvcnRDaGlsZDogYm9vbGVhbiA9IGZhbHNlO1xuICBASW5wdXQoKSBjcmVhdGU6IGJvb2xlYW4gPSBmYWxzZTtcbiAgQElucHV0KCkgc2hvd1NlbGVjdGVkOiBib29sZWFuID0gZmFsc2U7XG4gIFxuICBAT3V0cHV0KCkgdmlld0NoYW5nZSA9IG5ldyBFdmVudEVtaXR0ZXI8Ym9vbGVhbj4oKTtcbiAgQE91dHB1dCgpIHN0YXRlQ2hhbmdlID0gbmV3IEV2ZW50RW1pdHRlcjx7IGtleTogc3RyaW5nOyB2YWx1ZTogYm9vbGVhbiB9PigpO1xuXG4gIGlzVGFibGVWaWV3OiBib29sZWFuID0gZmFsc2U7XG5cbiAgbmdPbkluaXQoKTogdm9pZCB7fVxuXG4gIHRvZ2dsZVZpZXcoKTogdm9pZCB7XG4gICAgdGhpcy5pc1RhYmxlVmlldyA9ICF0aGlzLmlzVGFibGVWaWV3O1xuICAgIHRoaXMudmlld0NoYW5nZS5lbWl0KHRoaXMuaXNUYWJsZVZpZXcpO1xuICB9XG5cbiAgb25TZWFyY2goZXZlbnQ6IGFueSk6IHZvaWQge1xuICAgIHRoaXMuc3RhdGVDaGFuZ2UuZW1pdCh7IGtleTogJ3NlYXJjaCcsIHZhbHVlOiBldmVudC50YXJnZXQudmFsdWUgfSk7XG4gIH1cblxuICB0b2dnbGVDaGlsZFZpZXcodmlld1R5cGU6IHN0cmluZyk6IHZvaWQge1xuICAgIHN3aXRjaCAodmlld1R5cGUpIHtcbiAgICAgIGNhc2UgJ2NvbHVtbic6XG4gICAgICAgIHRoaXMuc2hvd0NvbHVtbkNoaWxkID0gIXRoaXMuc2hvd0NvbHVtbkNoaWxkO1xuICAgICAgICB0aGlzLnJlc2V0Q2hpbGRWaWV3c0V4Y2VwdCgnY29sdW1uJyk7XG4gICAgICAgIGJyZWFrO1xuICAgICAgY2FzZSAnZmlsdGVyJzpcbiAgICAgICAgdGhpcy5zaG93RmlsdGVyQ2hpbGQgPSAhdGhpcy5zaG93RmlsdGVyQ2hpbGQ7XG4gICAgICAgIHRoaXMucmVzZXRDaGlsZFZpZXdzRXhjZXB0KCdmaWx0ZXInKTtcbiAgICAgICAgYnJlYWs7XG4gICAgICBjYXNlICdzb3J0JzpcbiAgICAgICAgdGhpcy5zaG93U29ydENoaWxkID0gIXRoaXMuc2hvd1NvcnRDaGlsZDtcbiAgICAgICAgdGhpcy5yZXNldENoaWxkVmlld3NFeGNlcHQoJ3NvcnQnKTtcbiAgICAgICAgYnJlYWs7XG4gICAgICBjYXNlICdzZWxlY3QnOlxuICAgICAgICB0aGlzLnNob3dTZWxlY3RlZCA9ICF0aGlzLnNob3dTZWxlY3RlZDtcbiAgICAgICAgdGhpcy5yZXNldENoaWxkVmlld3NFeGNlcHQoJ3NlbGVjdCcpO1xuICAgICAgICBicmVhaztcbiAgICAgIGNhc2UgJ2V4cG9ydCc6XG4gICAgICAgIHRoaXMuc2hvd0V4cG9ydENoaWxkID0gIXRoaXMuc2hvd0V4cG9ydENoaWxkO1xuICAgICAgICB0aGlzLnJlc2V0Q2hpbGRWaWV3c0V4Y2VwdCgnZXhwb3J0Jyk7XG4gICAgICAgIGJyZWFrO1xuICAgICAgICBjYXNlICdjcmVhdGUnOlxuICAgICAgICAgIHRoaXMuY3JlYXRlID0gIXRoaXMuY3JlYXRlO1xuICAgICAgICAgIHRoaXMucmVzZXRDaGlsZFZpZXdzRXhjZXB0KCdjcmVhdGUnKTtcbiAgICAgICAgICBicmVhaztcbiAgICB9XG4gICAgdGhpcy5zdGF0ZUNoYW5nZS5lbWl0KHsga2V5OiB2aWV3VHlwZSwgdmFsdWU6IHRoaXMuZ2V0Q2hpbGRWaWV3U3RhdGUodmlld1R5cGUpIH0pO1xuICB9XG5cbiAgLy8gUmVzZXQgb3RoZXIgY2hpbGQgdmlld3Mgd2hlbiBvbmUgaXMgdG9nZ2xlZFxuICByZXNldENoaWxkVmlld3NFeGNlcHQodmlld1R5cGU6IHN0cmluZyk6IHZvaWQge1xuICAgIGlmICh2aWV3VHlwZSAhPT0gJ2NvbHVtbicpIHRoaXMuc2hvd0NvbHVtbkNoaWxkID0gZmFsc2U7XG4gICAgaWYgKHZpZXdUeXBlICE9PSAnZmlsdGVyJykgdGhpcy5zaG93RmlsdGVyQ2hpbGQgPSBmYWxzZTtcbiAgICBpZiAodmlld1R5cGUgIT09ICdzb3J0JykgdGhpcy5zaG93U29ydENoaWxkID0gZmFsc2U7XG4gICAgaWYgKHZpZXdUeXBlICE9PSAnc2VsZWN0JykgdGhpcy5zaG93U2VsZWN0ZWQgPSBmYWxzZTtcbiAgICBpZiAodmlld1R5cGUgIT09ICdleHBvcnQnKSB0aGlzLnNob3dFeHBvcnRDaGlsZCA9IGZhbHNlO1xuICAgIGlmICh2aWV3VHlwZSAhPT0gJ2NyZWF0ZScpIHRoaXMuY3JlYXRlID0gZmFsc2U7XG4gIH1cblxuICAvLyBIZWxwZXIgbWV0aG9kIHRvIGdldCB0aGUgc3RhdGUgb2YgYSBzcGVjaWZpYyBjaGlsZCB2aWV3XG4gIGdldENoaWxkVmlld1N0YXRlKHZpZXdUeXBlOiBzdHJpbmcpOiBib29sZWFuIHtcbiAgICBzd2l0Y2ggKHZpZXdUeXBlKSB7XG4gICAgICBjYXNlICdjb2x1bW4nOlxuICAgICAgICByZXR1cm4gdGhpcy5zaG93Q29sdW1uQ2hpbGQ7XG4gICAgICBjYXNlICdmaWx0ZXInOlxuICAgICAgICByZXR1cm4gdGhpcy5zaG93RmlsdGVyQ2hpbGQ7XG4gICAgICBjYXNlICdzb3J0JzpcbiAgICAgICAgcmV0dXJuIHRoaXMuc2hvd1NvcnRDaGlsZDtcbiAgICAgIGNhc2UgJ3NlbGVjdCc6XG4gICAgICAgIHJldHVybiB0aGlzLnNob3dTZWxlY3RlZDtcbiAgICAgIGNhc2UgJ2V4cG9ydCc6XG4gICAgICAgIHJldHVybiB0aGlzLnNob3dFeHBvcnRDaGlsZDtcbiAgICAgICAgY2FzZSAnY3JlYXRlJzpcbiAgICAgICAgcmV0dXJuIHRoaXMuY3JlYXRlO1xuICAgICAgZGVmYXVsdDpcbiAgICAgICAgcmV0dXJuIGZhbHNlO1xuICAgIH1cbiAgfVxufVxuIiwiPGRpdlxuICBjbGFzcz1cInRvb2xiYXIgZmxleCBnYXAganVzdGlmeS1iZXR3ZWVuIGl0ZW1zLWNlbnRlclwiXG4gIFtzdHlsZS5tYXJnaW5dPVwiJzBweCAzNXB4J1wiXG4+XG4gIDxkaXYgY2xhc3M9XCJmbGV4IGl0ZW1zLWNlbnRlciBnYXBcIj5cbiAgICA8ZGl2IGNsYXNzPVwidG9nZ2xlLWJ1dHRvbi1jb250YWluZXJcIj5cbiAgICAgIDxidXR0b24gdHlwZT1cImJ1dHRvblwiIChjbGljayk9XCJ0b2dnbGVWaWV3KClcIiBbbmdDbGFzc109XCJidXR0b25DbGFzc1wiPlxuICAgICAgICA8dmVyYmVuLXN2Z1xuICAgICAgICAgIFtpY29uXT1cInRhYmxlSWNvblwiXG4gICAgICAgICAgW2NsYXNzLmFjdGl2ZV09XCIhaXNUYWJsZVZpZXdcIlxuICAgICAgICAgIFtuZ0NsYXNzXT1cIiFpc1RhYmxlVmlldyA/IGFjdGl2ZUljb25DbGFzcyA6IGljb25DbGFzc1wiXG4gICAgICAgID48L3ZlcmJlbi1zdmc+XG4gICAgICAgIDx2ZXJiZW4tc3ZnXG4gICAgICAgICAgW2ljb25dPVwiY2FyZEljb25cIlxuICAgICAgICAgIFtjbGFzcy5hY3RpdmVdPVwiaXNUYWJsZVZpZXdcIlxuICAgICAgICAgIFtuZ0NsYXNzXT1cImlzVGFibGVWaWV3ID8gYWN0aXZlSWNvbkNsYXNzIDogaWNvbkNsYXNzXCJcbiAgICAgICAgICBbd2lkdGhdPVwiMjVcIlxuICAgICAgICAgIFtoZWlnaHRdPVwiMjVcIlxuICAgICAgICA+PC92ZXJiZW4tc3ZnPlxuICAgICAgPC9idXR0b24+XG4gICAgPC9kaXY+XG4gICAgPCEtLSBTZWFyY2ggSW5wdXQgLS0+XG4gICAgPGRpdlxuICAgICAgW3N0eWxlLndpZHRoXT1cImlucHV0V2lkdGhcIlxuICAgICAgY2xhc3M9XCJzZWFyY2gtaW5wdXRcIlxuICAgICAgKm5nSWY9XCJ2aWV3U3RhdGUuaXNTZWFyY2hcIlxuICAgID5cbiAgICAgIDx2ZXJiZW5hLWlucHV0XG4gICAgICAgIFt0eXBlXT1cIid0ZXh0J1wiXG4gICAgICAgIFtwbGFjZUhvbGRlcl09XCInU2VhcmNoLi4uJ1wiXG4gICAgICAgIChpbnB1dCk9XCJvblNlYXJjaCgkZXZlbnQpXCJcbiAgICAgICAgW2JvcmRlclJhZGl1c109XCInMTBweCdcIlxuICAgICAgICBbYm9yZGVyXT1cIicwJ1wiXG4gICAgICAvPlxuICAgIDwvZGl2PlxuICA8L2Rpdj5cblxuICA8ZGl2IGNsYXNzPVwiZmxleCBpdGVtcy1jZW50ZXIgcmVsYXRpdmUgZ2FwXCIgW3N0eWxlLm1hcmdpbi1sZWZ0XT1cIicxMHB4J1wiPlxuICAgIDwhLS0gQ29sdW1uIFNlY3Rpb24gLS0+XG4gICAgPG5nLWNvbnRhaW5lclxuICAgICAgW2FwcE91dFNpZGVDbGlja109XCJzaG93Q29sdW1uQ2hpbGRcIlxuICAgICAgKG91dFNpZGVDbGljayk9XCJzaG93Q29sdW1uQ2hpbGQgPSBmYWxzZVwiXG4gICAgICAqbmdJZj1cInZpZXdTdGF0ZS5pc0NvbHVtbiAmJiBpc1RhYmxlVmlld1wiXG4gICAgPlxuICAgICAgPG5nLWNvbnRhaW5lciAqbmdJZj1cImNvbHVtblRlbXBsYXRlOyBlbHNlIGRlZmF1bHRDb2x1bW5cIj48L25nLWNvbnRhaW5lcj5cbiAgICAgIDxuZy10ZW1wbGF0ZSAjZGVmYXVsdENvbHVtbj5cbiAgICAgICAgPHNwYW5cbiAgICAgICAgICBbbmdDbGFzc109XCJbXG4gICAgICAgICAgICAnZmxleCBnYXAgdGV4dC14cyBpdGVtcy1jZW50ZXIgcGQgcm91bmRlZCBjdXJzb3ItcG9pbnRlcicsXG4gICAgICAgICAgICBjb2x1bW5DdXN0b21DbGFzcyA/IGNvbHVtbkN1c3RvbUNsYXNzIDogJydcbiAgICAgICAgICBdXCJcbiAgICAgICAgICBbc3R5bGUuYmFja2dyb3VuZC1jb2xvcl09XCInI0Q5RDlEOTQwJ1wiXG4gICAgICAgICAgKGNsaWNrKT1cInRvZ2dsZUNoaWxkVmlldygnY29sdW1uJylcIlxuICAgICAgICA+XG4gICAgICAgICAgPHZlcmJlbi1zdmcgW3dpZHRoXT1cIjE1XCIgW2ljb25dPVwiJ2NvbHVtbidcIj48L3ZlcmJlbi1zdmc+XG4gICAgICAgICAgPHNwYW5cbiAgICAgICAgICAgID5Db2x1bW5zIDxzdXA+KHt7IHNlbGVjdGVkQ29sdW1uQ291bnQgfX0pPC9zdXA+PC9zcGFuXG4gICAgICAgICAgPlxuICAgICAgICA8L3NwYW4+XG4gICAgICAgIDxkaXYgW3N0eWxlLnotaW5kZXhdPVwiekluZGV4XCIgY2xhc3M9XCJkYXRhLXZpZXctZWxlbWVudFwiPlxuICAgICAgICAgIDxuZy1jb250ZW50XG4gICAgICAgICAgICAqbmdJZj1cInNob3dDb2x1bW5DaGlsZFwiXG4gICAgICAgICAgICBzZWxlY3Q9XCJbY29sdW1uLWNvbnRlbnRdXCJcbiAgICAgICAgICA+PC9uZy1jb250ZW50PlxuICAgICAgICA8L2Rpdj5cbiAgICAgIDwvbmctdGVtcGxhdGU+XG4gICAgPC9uZy1jb250YWluZXI+XG5cbiAgICA8IS0tIEZpbHRlciBTZWN0aW9uIC0tPlxuICAgIDxuZy1jb250YWluZXJcbiAgICAgIFthcHBPdXRTaWRlQ2xpY2tdPVwic2hvd0ZpbHRlckNoaWxkXCJcbiAgICAgIChvdXRTaWRlQ2xpY2spPVwic2hvd0ZpbHRlckNoaWxkID0gZmFsc2VcIlxuICAgICAgKm5nSWY9XCJ2aWV3U3RhdGUuaXNGaWx0ZXJcIlxuICAgID5cbiAgICAgIDxuZy1jb250YWluZXIgKm5nSWY9XCJmaWx0ZXJUZW1wbGF0ZTsgZWxzZSBkZWZhdWx0RmlsdGVyXCI+PC9uZy1jb250YWluZXI+XG4gICAgICA8bmctdGVtcGxhdGUgI2RlZmF1bHRGaWx0ZXI+XG4gICAgICAgIDxzcGFuXG4gICAgICAgIFtuZ0NsYXNzXT1cIltcbiAgICAgICAgJ2ZsZXggZ2FwIHRleHQteHMgaXRlbXMtY2VudGVyIHBkIHJvdW5kZWQgY3Vyc29yLXBvaW50ZXInLFxuICAgICAgICBmaWx0ZXJDdXN0b21DbGFzcyA/IGZpbHRlckN1c3RvbUNsYXNzIDogJydcbiAgICAgIF1cIlxuICAgICAgICAgIFtzdHlsZS5iYWNrZ3JvdW5kLWNvbG9yXT1cIicjRDlEOUQ5NDAnXCJcbiAgICAgICAgICAoY2xpY2spPVwidG9nZ2xlQ2hpbGRWaWV3KCdmaWx0ZXInKVwiXG4gICAgICAgID5cbiAgICAgICAgICA8dmVyYmVuLXN2ZyBbd2lkdGhdPVwiMTVcIiBbaWNvbl09XCInZmlsdGVyJ1wiPjwvdmVyYmVuLXN2Zz5cbiAgICAgICAgICA8c3BhblxuICAgICAgICAgICAgPkZpbHRlciA8c3VwPih7eyBzZWxlY3RlZEZpbHRlclRhYmxlQ291bnQgfX0pPC9zdXA+PC9zcGFuXG4gICAgICAgICAgPlxuICAgICAgICA8L3NwYW4+XG4gICAgICAgIDxkaXYgW3N0eWxlLnotaW5kZXhdPVwiekluZGV4XCIgY2xhc3M9XCJkYXRhLXZpZXctZWxlbWVudFwiPlxuICAgICAgICAgIDxuZy1jb250ZW50XG4gICAgICAgICAgICAqbmdJZj1cInNob3dGaWx0ZXJDaGlsZFwiXG4gICAgICAgICAgICBzZWxlY3Q9XCJbZmlsdGVyLWNvbnRlbnRdXCJcbiAgICAgICAgICA+PC9uZy1jb250ZW50PlxuICAgICAgICA8L2Rpdj5cbiAgICAgIDwvbmctdGVtcGxhdGU+XG4gICAgPC9uZy1jb250YWluZXI+XG5cbiAgICA8IS0tIFNvcnQgU2VjdGlvbiAtLT5cbiAgICA8bmctY29udGFpbmVyXG4gICAgICBbYXBwT3V0U2lkZUNsaWNrXT1cInNob3dTb3J0Q2hpbGRcIlxuICAgICAgKG91dFNpZGVDbGljayk9XCJzaG93U29ydENoaWxkID0gZmFsc2VcIlxuICAgICAgKm5nSWY9XCJ2aWV3U3RhdGUuaXNTb3J0XCJcbiAgICA+XG4gICAgICA8bmctY29udGFpbmVyICpuZ0lmPVwic29ydFRlbXBsYXRlOyBlbHNlIGRlZmF1bHRTb3J0XCI+PC9uZy1jb250YWluZXI+XG4gICAgICA8bmctdGVtcGxhdGUgI2RlZmF1bHRTb3J0PlxuICAgICAgICA8c3BhblxuICAgICAgICBbbmdDbGFzc109XCJbXG4gICAgICAgICdmbGV4IGdhcCB0ZXh0LXhzIGl0ZW1zLWNlbnRlciBwZCByb3VuZGVkIGN1cnNvci1wb2ludGVyJyxcbiAgICAgIHNvcnRDdXN0b21DbGFzcyA/IHNvcnRDdXN0b21DbGFzcyA6ICcnXG4gICAgICBdXCJcbiAgICAgICAgICBbc3R5bGUuYmFja2dyb3VuZC1jb2xvcl09XCInI0Q5RDlEOTQwJ1wiXG4gICAgICAgICAgKGNsaWNrKT1cInRvZ2dsZUNoaWxkVmlldygnc29ydCcpXCJcbiAgICAgICAgPlxuICAgICAgICAgIDx2ZXJiZW4tc3ZnIFt3aWR0aF09XCIxNVwiIFtpY29uXT1cIidzb3J0J1wiPjwvdmVyYmVuLXN2Zz5cbiAgICAgICAgICA8c3BhblxuICAgICAgICAgICAgPlNvcnQgPHN1cD4oe3sgc2VsZWN0ZWRTb3J0Q291bnQgfX0pPC9zdXA+PC9zcGFuXG4gICAgICAgICAgPlxuICAgICAgICA8L3NwYW4+XG4gICAgICAgIDxkaXYgW3N0eWxlLnotaW5kZXhdPVwiekluZGV4XCIgY2xhc3M9XCJkYXRhLXZpZXctZWxlbWVudFwiPlxuICAgICAgICAgIDxuZy1jb250ZW50XG4gICAgICAgICAgICAqbmdJZj1cInNob3dTb3J0Q2hpbGRcIlxuICAgICAgICAgICAgc2VsZWN0PVwiW3NvcnQtY29udGVudF1cIlxuICAgICAgICAgID48L25nLWNvbnRlbnQ+XG4gICAgICAgIDwvZGl2PlxuICAgICAgPC9uZy10ZW1wbGF0ZT5cbiAgICA8L25nLWNvbnRhaW5lcj5cblxuICAgIDwhLS0gRXhwb3J0IFNlY3Rpb24gLS0+XG4gICAgPG5nLWNvbnRhaW5lclxuICAgICAgW2FwcE91dFNpZGVDbGlja109XCJzaG93RXhwb3J0Q2hpbGRcIlxuICAgICAgKG91dFNpZGVDbGljayk9XCJzaG93RXhwb3J0Q2hpbGQgPSBmYWxzZVwiXG4gICAgICAqbmdJZj1cInZpZXdTdGF0ZS5pc0V4cG9ydFwiXG4gICAgPlxuICAgICAgPG5nLWNvbnRhaW5lciAqbmdJZj1cImV4cG9ydFRlbXBsYXRlOyBlbHNlIGRlZmF1bHRFeHBvcnRcIj48L25nLWNvbnRhaW5lcj5cbiAgICAgIDxuZy10ZW1wbGF0ZSAjZGVmYXVsdEV4cG9ydD5cbiAgICAgICAgPHNwYW5cbiAgICAgICAgW25nQ2xhc3NdPVwiW1xuICAgICAgICAnZmxleCBnYXAgdGV4dC14cyBpdGVtcy1jZW50ZXIgcGQgcm91bmRlZCBjdXJzb3ItcG9pbnRlcicsXG4gICAgICAgIGV4cG9ydEN1c3RvbUNsYXNzID8gZXhwb3J0Q3VzdG9tQ2xhc3MgOiAnJ1xuICAgICAgXVwiXG4gICAgICAgICAgW3N0eWxlLmJhY2tncm91bmQtY29sb3JdPVwiJyNEOUQ5RDk0MCdcIlxuICAgICAgICAgIChjbGljayk9XCJ0b2dnbGVDaGlsZFZpZXcoJ2V4cG9ydCcpXCJcbiAgICAgICAgPlxuICAgICAgICAgIDx2ZXJiZW4tc3ZnIFt3aWR0aF09XCIxNVwiIFtpY29uXT1cIidleHBvcnQnXCI+PC92ZXJiZW4tc3ZnPlxuICAgICAgICAgIEV4cG9ydFxuICAgICAgICA8L3NwYW4+XG4gICAgICAgIDxkaXYgW3N0eWxlLnotaW5kZXhdPVwiekluZGV4XCIgY2xhc3M9XCJkYXRhLXZpZXctZWxlbWVudFwiPlxuICAgICAgICAgIDxuZy1jb250ZW50XG4gICAgICAgICAgICAqbmdJZj1cInNob3dFeHBvcnRDaGlsZFwiXG4gICAgICAgICAgICBzZWxlY3Q9XCJbZXhwb3J0LWNvbnRlbnRdXCJcbiAgICAgICAgICA+PC9uZy1jb250ZW50PlxuICAgICAgICA8L2Rpdj5cbiAgICAgIDwvbmctdGVtcGxhdGU+XG4gICAgPC9uZy1jb250YWluZXI+XG5cbiAgICA8IS0tIFNlbGVjdCBTZWN0aW9uIC0tPlxuICAgIDxkaXYgKm5nSWY9XCJ2aWV3U3RhdGUuaXNTZWxlY3RcIj5cbiAgICAgIDxzcGFuXG4gICAgICBbbmdDbGFzc109XCJbXG4gICAgICAnZmxleCBnYXAgdGV4dC14cyBpdGVtcy1jZW50ZXIgcGQgcm91bmRlZCBjdXJzb3ItcG9pbnRlcicsXG4gICAgICBzZWxlY3RDdXN0b21DbGFzcyA/IHNlbGVjdEN1c3RvbUNsYXNzIDogJydcbiAgICBdXCJcbiAgICAgICAgW3N0eWxlLmJhY2tncm91bmQtY29sb3JdPVwiJyNEOUQ5RDk0MCdcIlxuICAgICAgICAoY2xpY2spPVwidG9nZ2xlQ2hpbGRWaWV3KCdzZWxlY3QnKVwiXG4gICAgICA+XG4gICAgICAgIDx2ZXJiZW4tc3ZnIFt3aWR0aF09XCIxNVwiIFtpY29uXT1cIidzZWxlY3QnXCI+PC92ZXJiZW4tc3ZnPlxuICAgICAgICA8c3Bhbj5TZWxlY3Q8L3NwYW4+XG4gICAgICAgIDx2ZXJiZW4tc3ZnIFt3aWR0aF09XCI2XCIgW2ljb25dPVwiJ2NoZXZyb24tZG93bidcIj48L3ZlcmJlbi1zdmc+XG4gICAgICA8L3NwYW4+XG4gICAgPC9kaXY+XG5cbiAgICA8IS0tIENyZWF0ZSBCdXR0b24gLS0+XG4gICAgIFxuICAgIDxkaXYgICBbYXBwT3V0U2lkZUNsaWNrXT1cImNyZWF0ZVwiXG4gICAgKG91dFNpZGVDbGljayk9XCJjcmVhdGUgPSBmYWxzZVwiICpuZ0lmPVwidmlld1N0YXRlLmlzQ3JlYXRlXCI+XG4gICAgICA8dmVyYmVuYS1idXR0b25cbiAgICAgICAgY2xhc3M9XCJ0ZXh0LXNtIGZvbnQtc2VtaWJvbGRcIlxuICAgICAgICBbYmdDb2xvcl09XCInI0ZGRTY4MSdcIlxuICAgICAgICBbYnV0dG9uQ2xhc3NdPVwiY3JlYXRlQ3VzdG9tQ2xhc3NcIlxuICAgICAgICBbcGRdPVwiJzZweCdcIlxuICAgICAgICBbYm9yZGVyUmFkaXVzXT1cIic0cHgnXCJcbiAgICAgICAgW3RleHRDb2xvcl09XCInIzAwMCdcIlxuICAgICAgICBbc3ZnXT1cIidhZGQnXCJcbiAgICAgICAgW3N2Z1Bvc2l0aW9uXT1cIidyaWdodCdcIlxuICAgICAgICBbdGV4dF09XCInQ3JlYXRlIE5ldydcIlxuICAgICAgICAoY2xpY2spPVwidG9nZ2xlQ2hpbGRWaWV3KCdjcmVhdGUnKVwiXG4gICAgICA+XG4gICAgICA8L3ZlcmJlbmEtYnV0dG9uPlxuICAgICAgPG5nLWNvbnRhaW5lciAqbmdJZj1cImNyZWF0ZVRlbXBsYXRlOyBlbHNlIGRlZmF1bHRDcmVhdGVcIj48L25nLWNvbnRhaW5lcj5cbiAgICAgIDxuZy10ZW1wbGF0ZSAjZGVmYXVsdENyZWF0ZT5cbiAgICAgIFxuICAgICAgICA8ZGl2IFtzdHlsZS56LWluZGV4XT1cInpJbmRleFwiIGNsYXNzPVwiZGF0YS12aWV3LWVsZW1lbnRcIj5cbiAgICAgICAgICA8bmctY29udGVudFxuICAgICAgICAgICAgKm5nSWY9XCJjcmVhdGVcIlxuICAgICAgICAgICAgc2VsZWN0PVwiW2NyZWF0ZS1jb250ZW50XVwiXG4gICAgICAgICAgPjwvbmctY29udGVudD5cbiAgICAgICAgPC9kaXY+XG4gICAgICA8L25nLXRlbXBsYXRlPlxuICAgIDwvZGl2PlxuICA8L2Rpdj5cbjwvZGl2PlxuXG48IS0tIEdyaWQgYW5kIExpc3QgVmlldyBIYW5kbGluZyAtLT5cbjxkaXYgKm5nSWY9XCJpc1RhYmxlVmlldzsgZWxzZSBsaXN0Vmlld1RlbXBsYXRlXCI+XG4gIDxkaXYgW2NsYXNzXT1cInRhYmxlQ2xhc3NcIj5cbiAgICA8bmctY29udGVudCBzZWxlY3Q9XCJbdGFibGUtY29udGVudF1cIj48L25nLWNvbnRlbnQ+XG4gIDwvZGl2PlxuPC9kaXY+XG48bmctdGVtcGxhdGUgI2xpc3RWaWV3VGVtcGxhdGU+XG4gIDxkaXYgW2NsYXNzXT1cImNhcmRDbGFzc1wiPlxuICAgIDxuZy1jb250ZW50IHNlbGVjdD1cIltjYXJkLWNvbnRlbnRdXCI+PC9uZy1jb250ZW50PlxuICA8L2Rpdj5cbjwvbmctdGVtcGxhdGU+XG4iXX0=
212
+ //# 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==
package/fesm2022/verben-ng-ui.mjs CHANGED
@@ -3569,6 +3569,8 @@ class DataViewComponent {
3569
3569
  cardIcon = 'list-view';
3570
3570
  cardClass = '';
3571
3571
  tableClass = '';
3572
+ searchKey = 'search';
3573
+ searchValue = '';
3572
3574
  viewState = {
3573
3575
  isSearch: true,
3574
3576
  isColumn: true,
@@ -3576,7 +3578,8 @@ class DataViewComponent {
3576
3578
  isSort: true,
3577
3579
  isExport: true,
3578
3580
  isSelect: true,
3579
- isCreate: true
3581
+ isCreate: true,
3582
+ isToggle: true
3580
3583
  };
3581
3584
  searchTemplate;
3582
3585
  columnTemplate;
@@ -3594,16 +3597,22 @@ class DataViewComponent {
3594
3597
  showExportChild = false;
3595
3598
  create = false;
3596
3599
  showSelected = false;
3600
+ isTableView = false;
3597
3601
  viewChange = new EventEmitter();
3598
3602
  stateChange = new EventEmitter();
3599
- isTableView = false;
3603
+ onSearchChange = new EventEmitter();
3600
3604
  ngOnInit() { }
3601
3605
  toggleView() {
3602
3606
  this.isTableView = !this.isTableView;
3603
3607
  this.viewChange.emit(this.isTableView);
3604
3608
  }
3605
3609
  onSearch(event) {
3606
- this.stateChange.emit({ key: 'search', value: event.target.value });
3610
+ this.searchValue = event.target.value;
3611
+ console.log({ key: this.searchKey, value: event.target.value });
3612
+ this.onSearchChange.emit({ key: this.searchKey, value: this.searchValue });
3613
+ }
3614
+ onClearSearch() {
3615
+ this.searchValue = "";
3607
3616
  }
3608
3617
  toggleChildView(viewType) {
3609
3618
  switch (viewType) {
@@ -3669,11 +3678,11 @@ class DataViewComponent {
3669
3678
  }
3670
3679
  }
3671
3680
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.5", ngImport: i0, type: DataViewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
3672
- 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", 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" }, outputs: { viewChange: "viewChange", stateChange: "stateChange" }, 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 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 [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 [borderRadius]=\"'10px'\"\n [border]=\"'0'\"\n />\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{width:30%}sup{color:#3479e9;font-weight:500}.data-view-element{position:absolute;top:80px;left:0}.relative{position:relative}.z-10{z-index:100000000000}\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"] }] });
3681
+ 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"] }] });
3673
3682
  }
3674
3683
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.5", ngImport: i0, type: DataViewComponent, decorators: [{
3675
3684
  type: Component,
3676
- 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 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 [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 [borderRadius]=\"'10px'\"\n [border]=\"'0'\"\n />\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{width:30%}sup{color:#3479e9;font-weight:500}.data-view-element{position:absolute;top:80px;left:0}.relative{position:relative}.z-10{z-index:100000000000}\n"] }]
3685
+ 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"] }]
3677
3686
  }], propDecorators: { buttonClass: [{
3678
3687
  type: Input
3679
3688
  }], iconClass: [{
@@ -3702,6 +3711,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.5", ngImpor
3702
3711
  type: Input
3703
3712
  }], tableClass: [{
3704
3713
  type: Input
3714
+ }], searchKey: [{
3715
+ type: Input
3716
+ }], searchValue: [{
3717
+ type: Input
3705
3718
  }], viewState: [{
3706
3719
  type: Input
3707
3720
  }], searchTemplate: [{
@@ -3736,10 +3749,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.5", ngImpor
3736
3749
  type: Input
3737
3750
  }], showSelected: [{
3738
3751
  type: Input
3752
+ }], isTableView: [{
3753
+ type: Input
3739
3754
  }], viewChange: [{
3740
3755
  type: Output
3741
3756
  }], stateChange: [{
3742
3757
  type: Output
3758
+ }], onSearchChange: [{
3759
+ type: Output
3743
3760
  }] } });
3744
3761
 
3745
3762
  class ColumnDirective {