verben-workflow-ui 0.5.77 → 0.5.79

package/fesm2022/verben-workflow-ui-src-lib-components-workflow.mjs

@@ -95,7 +95,7 @@ const baseStyle = {
     fontSize: '125%',
     whiteSpace: 'nowrap',
     margin: '0',
-    border: '1px solid #D4A007',
+    border: '1px solid var(--vbn-color-primary)',
     borderRadius: '16px',
     borderCollapse: 'separate',
     borderSpacing: '0',
@@ -103,10 +103,10 @@ const baseStyle = {
     overflow: 'hidden',
     rows: {
         even: {
-            backgroundColor: '#FDFDFD',
+            backgroundColor: 'var(--vbn-color-surface)',
         },
         odd: {
-            backgroundColor: '#F1F4FB',
+            backgroundColor: 'var(--vbn-color-surface-alt)',
         },
         height: '68px',
     },
@@ -116,7 +116,7 @@ const baseStyle = {
     header: {
         // stickyTop: true,
         // zIndex: 2,
-        backgroundColor: '#EFF2FB',
+        backgroundColor: 'var(--vbn-color-surface-alt)',
         fontWeight: 'bold',
         textAlign: 'left',
         padding: '12px 16px',
@@ -128,7 +128,7 @@ const baseStyle = {
         padding: '3px',
     },
     //   body: {
-    //     background: '#fff',
+    //     background: 'var(--vbn-color-surface)',
     //     padding: '4px 5px',
     //     textAlign: 'center',
     //   },
@@ -324,21 +324,21 @@ class WorkflowComponent {
         console.log('data is here', type);
         switch (type) {
             // case WorkflowStatus.Pending:
-            //   return 'bg-[#FEF2E5] text-[#CD6200]';
+            //   return 'bg-[#FEF2E5] text-[var(--vbn-color-warning)]';
             case Status.Active:
-                return 'bg-[#EBF9F1] text-[#1F9254]';
+                return 'bg-[var(--vbn-color-success-bg)] text-[var(--vbn-color-success)]';
             case Status.InActive:
-                return 'bg-[#FBE7E8] text-[#A30D11]';
+                return 'bg-[#FBE7E8] text-[var(--vbn-color-error)]';
             default:
                 return '';
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: WorkflowComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: WorkflowComponent, selector: "verben-workflow", outputs: { itemClicked: "itemClicked" }, viewQueries: [{ propertyName: "cardDataView", first: true, predicate: ["vdcv"], descendants: true }, { propertyName: "dataView", first: true, predicate: ["vdv"], descendants: true }], ngImport: i0, template: "<div class=\"space-y-8\">\n    <verben-data-view\n      #vdv\n      [viewState]=\"{\n        isSearch: true,\n        isColumn: true,\n        isFilter: true,\n        isSort: true,\n        isExport: true,\n        isSelect: true,\n        isCreate: true,\n        isToggle:true\n      }\"\n      [buttonClass]=\"'my-custom-button-class'\"\n      [iconClass]=\"'my-icon-class'\"\n      [tableIcon]=\"'table-view'\"\n      [cardIcon]=\"'list-view'\"\n      [activeIconClass]=\"'my-active-icon-class'\"\n      [selectedColumnCount]=\"0\"\n      [selectedSortCount]=\"0\"\n      [selectedFilterTableCount]=\"0\"\n      (viewChange)=\"onViewChange($event)\"\n      (stateChange)=\"onStateChange($event)\"\n    >\n      <div table-content>\n        <lib-data-table\n          [data]=\"data\"\n          [columns]=\"columns\"\n          [styleConfig]=\"styles\"\n          (selectionChange)=\"onSelectionChange($event)\"\n        >\n        <ng-container libColumn=\"select\">\n          <ng-template\n            #cell\n            let-value\n            let-isSelected=\"isSelected\"\n            let-toggleRowSelection=\"toggleRowSelection\"\n          >\n            <input\n              type=\"checkbox\"\n              [checked]=\"isSelected\"\n              class=\"cursor-pointer\"\n            />\n          </ng-template>\n          <ng-template\n          #header\n          let-allRowsSelected=\"allRowsSelected\"\n          let-someRowsSelected=\"someRowsSelected\"\n          let-toggleAllRows=\"toggleAllRows\"\n        >\n          <input\n            type=\"checkbox\"\n            [checked]=\"allRowsSelected()\"\n            [indeterminate]=\"someRowsSelected()\"\n            (change)=\"toggleAllRows()\"\n          />\n        </ng-template>\n        </ng-container>\n          <ng-container libColumn=\"status\">\n            <ng-template #cell let-value>\n              <div [class]=\"getRowStatus(value)\" class=\"rounded-[22px] flex items-center justify-center w-[84px] h-[31px] font-medium text-xs leading-[14.63px]\"> \n                {{value}}\n              </div>\n            </ng-template>\n          </ng-container>\n          <ng-container libColumn=\"action\">\n            <ng-template \n            #cell let-value \n            let-row=\"row\">\n            <div class=\"flex items-center gap-4\">\n              <span class=\"cursor-pointer\">\n                <verben-svg\n                  icon=\"edit\"\n                  [width]=\"15\"\n                  [height]=\"15\"\n                ></verben-svg>\n              </span>\n              <span class=\"cursor-pointer\">\n                <verben-svg\n                  icon=\"delete\"\n                  [width]=\"15\"\n                  [height]=\"15\"\n                ></verben-svg>\n              </span>\n              <span class=\"cursor-pointer\">\n                <verben-svg\n                  icon=\"draw\"\n                  [width]=\"18\"\n                  [height]=\"18\"\n                ></verben-svg>\n              </span>\n            </div>\n            </ng-template>\n          </ng-container>\n        </lib-data-table>\n      </div>\n      <div card-content>\n        <verben-card-data-view\n          borderRadius=\"12px\"\n          (loadMoreClick)=\"loadMore()\"\n          #vdcv\n          dataId=\"MailAddress\"\n          border=\"5px\"\n          [cardDataList]=\"cardData\"\n          rbgColor=\"#f5f6f9\"\n          mg=\"0px\"\n        >\n          <verben-left-card-data-view class=\"\">\n            <verben-left-card-data\n              #vlcd\n              [parent]=\"vdcv\"\n              dataId=\"MailAddress\"\n              class=\"bg-secondary-100 rounded-xl border-primary border-[1px]\"\n              [cardDataList]=\"cardData\"\n            >\n              <ng-template #card let-item>\n                <div class=\"flex h-[88px]\">\n                  <div\n                    class=\"flex  w-full bg-secondary rounded-xl\"\n                  >\n                    <div\n                      class=\"w-3 rounded-xl rounded-tr-none rounded-br-none\"\n                      [ngClass]=\"\n                        item.selected ? 'bg-primary' : 'bg-secondary-200'\n                      \"\n                    ></div>\n                    <div class=\"py-3 px-4 w-full h-[100%]\">\n                      <div class=\"flex items-start justify-between h-[100%]\">\n                        <div class=\"flex flex-col justify-between h-[100%]\">\n                          <h3 class=\"my-0 font-semibold text-[#404040] leading-[19.5px]\">{{\n                            item.title\n                          }}</h3>\n                          <p class=\"flex items-center\">\n                            <label  class=\"!text-[10px] font-light text-[#404040] leading-[12.1px]\"\n                              >Config count:</label\n                            >\n                            <span class=\"text-[13px] leading-[15.85px] font-medium ml-1 text-black\">{{\n                              item.data.Count\n                            }}</span>\n                          </p>\n                        </div>\n  \n                        <div class=\"flex items-end h-[100%]\">\n                            <p\n                            (click)=\"handleClick(item)\" \n                            class=\"my-0 underline text-[#3479E9] text-[11px] leading-[16.6px] cursor-pointer font-medium\"\n                            >View configs</p>\n                        </div>\n                      </div>\n                    </div>\n                  </div>\n                </div>\n              </ng-template>\n            </verben-left-card-data>\n          </verben-left-card-data-view>\n          <!-- <verben-right-card-data-view> \n            yeshhhhhh\n          </verben-right-card-data-view> -->\n  \n          <verben-card-data-view-footer class=\"float-right\">\n            <div class=\"flex gap-2\">\n              <span class=\"paginator-text\"\n                >{{ cardData.length }} records loaded</span\n              >\n              <button (click)=\"loadMore()\" class=\"load-more\">Load more</button>\n            </div>\n          </verben-card-data-view-footer>\n        </verben-card-data-view>\n      </div>\n      <div column-content>\n        <verben-visible-column\n          (columnsUpdated)=\"onColumnsUpdated($event)\"\n          [border]=\"'1px solid rgba(212, 160, 7, 1)'\"\n          borderRadius=\"10px\"\n          boxShadow=\"2px 2px 2px 0px silver\"\n          bgColor=\"white\"\n          width=\"400px\"\n          textColor=\"black\"\n          pd=\"1rem\"\n          primaryColor=\"#FFE681\"\n          secondaryColor=\"#3479E9\"\n          [columns]=\"visibleColumns\"\n          [displayedColumns]=\"5\"\n        ></verben-visible-column>\n      </div>\n      <div filter-content>\n        <verben-table-filter\n          [border]=\"'1px solid rgba(212, 160, 7, 1)'\"\n          borderRadius=\"10px\"\n          boxShadow=\"2px 2px 2px 0px silver\"\n          bgColor=\"white\"\n          width=\"420px\"\n          textColor=\"black\"\n          pd=\"1rem\"\n          primaryColor=\"#FFE681\"\n          secondaryColor=\"#3479E9\"\n          tertiaryColor=\"#404040\"\n          [filterOptions]=\"filterArray\"\n          [maxFilterLength]=\"3\"\n        ></verben-table-filter>\n      </div>\n      <div sort-content>\n        <verben-sort-table\n          (selectedOptions)=\"onSortUpdated($event)\"\n          [border]=\"'1px solid rgba(212, 160, 7, 1)'\"\n          borderRadius=\"10px\"\n          boxShadow=\"2px 2px 2px 0px silver\"\n          bgColor=\"white\"\n          width=\"400px\"\n          textColor=\"black\"\n          pd=\"1rem\"\n          primaryColor=\"#FFE681\"\n          secondaryColor=\"#3479E9\"\n          tertiaryColor=\"#404040\"\n          [enableDragAndDrop]=\"true\"\n          [sortOptions]=\"sortOptions\"\n        ></verben-sort-table>\n      </div>\n      <div export-content>\n        <lib-data-export [data]=\"data\" (exportDataEvent)=\"handleExport($event)\">\n        </lib-data-export>\n      </div>\n    </verben-data-view>\n  </div>\n  \n  ", styles: [""], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i2.DataTableComponent, selector: "lib-data-table", inputs: ["data", "columns", "dataKey", "formGroupConfig", "groupBy", "useVirtualScroll", "virtualScrollItemSize", "styleConfig"], outputs: ["rowEdit", "rowSave", "rowRevert", "rowDelete", "selectionChange"] }, { kind: "directive", type: i2.ColumnDirective, selector: "[libColumn]", inputs: ["libColumn"] }, { kind: "component", type: i2.SvgComponent, selector: "verben-svg", inputs: ["icon", "width", "height", "fill", "stroke", "type", "size"] }, { kind: "component", type: i2.DataViewComponent, selector: "verben-data-view", inputs: ["buttonClass", "iconClass", "activeIconClass", "columnCustomClass", "filterCustomClass", "sortCustomClass", "extendCustomClass", "exportCustomClass", "selectCustomClass", "importCustomClass", "zIndex", "createCustomClass", "tableIcon", "cardIcon", "cardClass", "tableClass", "searchKey", "searchValue", "viewState", "searchTemplate", "importTemplate", "columnTemplate", "extendTemplate", "filterTemplate", "sortTemplate", "children", "exportTemplate", "createTemplate", "selectedColumnCount", "selectedSortCount", "selectedFilterTableCount", "inputWidth", "milliseconds", "showColumnChild", "showSortChild", "showFilterChild", "showImportChild", "showExportChild", "showExtendChild", "create", "showSelected", "isTableView"], outputs: ["viewChange", "stateChange", "onSearchChange"] }, { kind: "component", type: i2.CardDataViewComponent, selector: "verben-card-data-view", inputs: ["pd", "mg", "lHeight", "rHeight", "rWidth", "lWidth", "textColor", "lbgColor", "rbgColor", "border", "display", "borderRadius", "activeCss", "inActiveCss", "displayAsRow", "cardDataList", "dataId", "totalRecords", "footer", "noOfVisibleChildren", "showEditIcon", "onItemClick", "onCardChildClick"], outputs: ["editClicked", "loadMoreClick"] }, { kind: "component", type: i2.LeftCardDataComponent, selector: "verben-left-card-data", inputs: ["pd", "mg", "height", "weight", "activeCss", "inActiveCss", "cardDataList", "iconCollapse", "iconExpanded", "parent", "dataId"] }, { kind: "component", type: i2.LeftCardDataViewComponent, selector: "verben-left-card-data-view", inputs: ["cardDataList"] }, { kind: "component", type: i2.CardDataViewFooterComponent, selector: "verben-card-data-view-footer" }, { kind: "component", type: i2.SortTableComponent, selector: "verben-sort-table", inputs: ["enableDragAndDrop", "sortOptions", "resetText", "displayedOptions", "propertyText", "showMoreText", "sortButtonText", "pd", "mg", "height", "width", "bgColor", "boxShadow", "textColor", "primaryColor", "secondaryColor", "tertiaryColor", "border", "borderRadius", "selectWidth", "containerHeight"], outputs: ["selectedOptions", "resetSortData"] }, { kind: "component", type: i2.VisibleColumnComponent, selector: "verben-visible-column", inputs: ["columns", "items", "enableDragAndDrop", "displayedColumns", "showMore", "pd", "mg", "height", "width", "bgColor", "boxShadow", "textColor", "primaryColor", "secondaryColor", "tertiaryColor", "border", "borderRadius", "selectWidth", "closeColumn"], outputs: ["columnsUpdated", "resetFilter"] }, { kind: "component", type: i2.TableFilterComponent, selector: "verben-table-filter", inputs: ["filterOptions", "pd", "mg", "height", "width", "bgColor", "boxShadow", "textColor", "primaryColor", "secondaryColor", "tertiaryColor", "border", "borderRadius", "selectWidth", "maxFilterLength", "tooltip"], outputs: ["filtersApplied", "resetSortData"] }, { kind: "component", type: i2.DataExportComponent, selector: "lib-data-export", inputs: ["columns", "data", "dataFetchUrl", "dataQueryParameters"], outputs: ["exportDataEvent"] }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: WorkflowComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: WorkflowComponent, selector: "verben-workflow", outputs: { itemClicked: "itemClicked" }, viewQueries: [{ propertyName: "cardDataView", first: true, predicate: ["vdcv"], descendants: true }, { propertyName: "dataView", first: true, predicate: ["vdv"], descendants: true }], ngImport: i0, template: "<div class=\"space-y-8\">\n    <verben-data-view\n      #vdv\n      [viewState]=\"{\n        isSearch: true,\n        isColumn: true,\n        isFilter: true,\n        isSort: true,\n        isExport: true,\n        isSelect: true,\n        isCreate: true,\n        isToggle:true\n      }\"\n      [buttonClass]=\"'my-custom-button-class'\"\n      [iconClass]=\"'my-icon-class'\"\n      [tableIcon]=\"'table-view'\"\n      [cardIcon]=\"'list-view'\"\n      [activeIconClass]=\"'my-active-icon-class'\"\n      [selectedColumnCount]=\"0\"\n      [selectedSortCount]=\"0\"\n      [selectedFilterTableCount]=\"0\"\n      (viewChange)=\"onViewChange($event)\"\n      (stateChange)=\"onStateChange($event)\"\n    >\n      <div table-content>\n        <lib-data-table\n          [data]=\"data\"\n          [columns]=\"columns\"\n          [styleConfig]=\"styles\"\n          (selectionChange)=\"onSelectionChange($event)\"\n        >\n        <ng-container libColumn=\"select\">\n          <ng-template\n            #cell\n            let-value\n            let-isSelected=\"isSelected\"\n            let-toggleRowSelection=\"toggleRowSelection\"\n          >\n            <input\n              type=\"checkbox\"\n              [checked]=\"isSelected\"\n              class=\"cursor-pointer\"\n            />\n          </ng-template>\n          <ng-template\n          #header\n          let-allRowsSelected=\"allRowsSelected\"\n          let-someRowsSelected=\"someRowsSelected\"\n          let-toggleAllRows=\"toggleAllRows\"\n        >\n          <input\n            type=\"checkbox\"\n            [checked]=\"allRowsSelected()\"\n            [indeterminate]=\"someRowsSelected()\"\n            (change)=\"toggleAllRows()\"\n          />\n        </ng-template>\n        </ng-container>\n          <ng-container libColumn=\"status\">\n            <ng-template #cell let-value>\n              <div [class]=\"getRowStatus(value)\" class=\"rounded-[22px] flex items-center justify-center w-[84px] h-[31px] font-medium text-xs leading-[14.63px]\"> \n                {{value}}\n              </div>\n            </ng-template>\n          </ng-container>\n          <ng-container libColumn=\"action\">\n            <ng-template \n            #cell let-value \n            let-row=\"row\">\n            <div class=\"flex items-center gap-4\">\n              <span class=\"cursor-pointer\">\n                <verben-svg\n                  icon=\"edit\"\n                  [width]=\"15\"\n                  [height]=\"15\"\n                ></verben-svg>\n              </span>\n              <span class=\"cursor-pointer\">\n                <verben-svg\n                  icon=\"delete\"\n                  [width]=\"15\"\n                  [height]=\"15\"\n                ></verben-svg>\n              </span>\n              <span class=\"cursor-pointer\">\n                <verben-svg\n                  icon=\"draw\"\n                  [width]=\"18\"\n                  [height]=\"18\"\n                ></verben-svg>\n              </span>\n            </div>\n            </ng-template>\n          </ng-container>\n        </lib-data-table>\n      </div>\n      <div card-content>\n        <verben-card-data-view\n          borderRadius=\"12px\"\n          (loadMoreClick)=\"loadMore()\"\n          #vdcv\n          dataId=\"MailAddress\"\n          border=\"5px\"\n          [cardDataList]=\"cardData\"\n          rbgColor=\"var(--vbn-color-surface-alt)\"\n          mg=\"0px\"\n        >\n          <verben-left-card-data-view class=\"\">\n            <verben-left-card-data\n              #vlcd\n              [parent]=\"vdcv\"\n              dataId=\"MailAddress\"\n              class=\"bg-secondary-100 rounded-xl border-primary border-[1px]\"\n              [cardDataList]=\"cardData\"\n            >\n              <ng-template #card let-item>\n                <div class=\"flex h-[88px]\">\n                  <div\n                    class=\"flex  w-full bg-secondary rounded-xl\"\n                  >\n                    <div\n                      class=\"w-3 rounded-xl rounded-tr-none rounded-br-none\"\n                      [ngClass]=\"\n                        item.selected ? 'bg-primary' : 'bg-secondary-200'\n                      \"\n                    ></div>\n                    <div class=\"py-3 px-4 w-full h-[100%]\">\n                      <div class=\"flex items-start justify-between h-[100%]\">\n                        <div class=\"flex flex-col justify-between h-[100%]\">\n                          <h3 class=\"my-0 font-semibold text-[var(--vbn-color-on-primary)] leading-[19.5px]\">{{\n                            item.title\n                          }}</h3>\n                          <p class=\"flex items-center\">\n                            <label  class=\"!text-[10px] font-light text-[var(--vbn-color-on-primary)] leading-[12.1px]\"\n                              >Config count:</label\n                            >\n                            <span class=\"text-[13px] leading-[15.85px] font-medium ml-1 text-black\">{{\n                              item.data.Count\n                            }}</span>\n                          </p>\n                        </div>\n  \n                        <div class=\"flex items-end h-[100%]\">\n                            <p\n                            (click)=\"handleClick(item)\" \n                            class=\"my-0 underline text-[var(--vbn-color-border-focus)] text-[11px] leading-[16.6px] cursor-pointer font-medium\"\n                            >View configs</p>\n                        </div>\n                      </div>\n                    </div>\n                  </div>\n                </div>\n              </ng-template>\n            </verben-left-card-data>\n          </verben-left-card-data-view>\n          <!-- <verben-right-card-data-view> \n            yeshhhhhh\n          </verben-right-card-data-view> -->\n  \n          <verben-card-data-view-footer class=\"float-right\">\n            <div class=\"flex gap-2\">\n              <span class=\"paginator-text\"\n                >{{ cardData.length }} records loaded</span\n              >\n              <button (click)=\"loadMore()\" class=\"load-more\">Load more</button>\n            </div>\n          </verben-card-data-view-footer>\n        </verben-card-data-view>\n      </div>\n      <div column-content>\n        <verben-visible-column\n          (columnsUpdated)=\"onColumnsUpdated($event)\"\n          [border]=\"'1px solid var(--vbn-color-primary)'\"\n          borderRadius=\"10px\"\n          boxShadow=\"2px 2px 2px 0px silver\"\n          bgColor=\"white\"\n          width=\"400px\"\n          textColor=\"black\"\n          pd=\"1rem\"\n          primaryColor=\"var(--vbn-color-primary)\"\n          secondaryColor=\"var(--vbn-color-border-focus)\"\n          [columns]=\"visibleColumns\"\n          [displayedColumns]=\"5\"\n        ></verben-visible-column>\n      </div>\n      <div filter-content>\n        <verben-table-filter\n          [border]=\"'1px solid var(--vbn-color-primary)'\"\n          borderRadius=\"10px\"\n          boxShadow=\"2px 2px 2px 0px silver\"\n          bgColor=\"white\"\n          width=\"420px\"\n          textColor=\"black\"\n          pd=\"1rem\"\n          primaryColor=\"var(--vbn-color-primary)\"\n          secondaryColor=\"var(--vbn-color-border-focus)\"\n          tertiaryColor=\"var(--vbn-color-on-primary)\"\n          [filterOptions]=\"filterArray\"\n          [maxFilterLength]=\"3\"\n        ></verben-table-filter>\n      </div>\n      <div sort-content>\n        <verben-sort-table\n          (selectedOptions)=\"onSortUpdated($event)\"\n          [border]=\"'1px solid var(--vbn-color-primary)'\"\n          borderRadius=\"10px\"\n          boxShadow=\"2px 2px 2px 0px silver\"\n          bgColor=\"white\"\n          width=\"400px\"\n          textColor=\"black\"\n          pd=\"1rem\"\n          primaryColor=\"var(--vbn-color-primary)\"\n          secondaryColor=\"var(--vbn-color-border-focus)\"\n          tertiaryColor=\"var(--vbn-color-on-primary)\"\n          [enableDragAndDrop]=\"true\"\n          [sortOptions]=\"sortOptions\"\n        ></verben-sort-table>\n      </div>\n      <div export-content>\n        <lib-data-export [data]=\"data\" (exportDataEvent)=\"handleExport($event)\">\n        </lib-data-export>\n      </div>\n    </verben-data-view>\n  </div>\n  \n  ", styles: [""], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i2.DataTableComponent, selector: "lib-data-table", inputs: ["data", "columns", "dataKey", "formGroupConfig", "groupBy", "useVirtualScroll", "virtualScrollItemSize", "styleConfig"], outputs: ["rowEdit", "rowSave", "rowRevert", "rowDelete", "selectionChange"] }, { kind: "directive", type: i2.ColumnDirective, selector: "[libColumn]", inputs: ["libColumn"] }, { kind: "component", type: i2.SvgComponent, selector: "verben-svg", inputs: ["icon", "width", "height", "fill", "stroke", "type", "size"] }, { kind: "component", type: i2.DataViewComponent, selector: "verben-data-view", inputs: ["buttonClass", "iconClass", "activeIconClass", "columnCustomClass", "filterCustomClass", "sortCustomClass", "extendCustomClass", "exportCustomClass", "selectCustomClass", "importCustomClass", "zIndex", "createCustomClass", "tableIcon", "cardIcon", "cardClass", "tableClass", "searchKey", "searchValue", "viewState", "searchTemplate", "importTemplate", "columnTemplate", "extendTemplate", "filterTemplate", "sortTemplate", "children", "exportTemplate", "createTemplate", "selectedColumnCount", "selectedSortCount", "selectedFilterTableCount", "inputWidth", "milliseconds", "showColumnChild", "showSortChild", "showFilterChild", "showImportChild", "showExportChild", "showExtendChild", "create", "showSelected", "isTableView"], outputs: ["viewChange", "stateChange", "onSearchChange"] }, { kind: "component", type: i2.CardDataViewComponent, selector: "verben-card-data-view", inputs: ["pd", "mg", "lHeight", "rHeight", "rWidth", "lWidth", "textColor", "lbgColor", "rbgColor", "border", "display", "borderRadius", "activeCss", "inActiveCss", "displayAsRow", "cardDataList", "dataId", "totalRecords", "footer", "noOfVisibleChildren", "showEditIcon", "useVirtualScroll", "virtualScrollItemSize", "onItemClick", "onCardChildClick"], outputs: ["editClicked", "loadMoreClick"] }, { kind: "component", type: i2.LeftCardDataComponent, selector: "verben-left-card-data", inputs: ["pd", "mg", "height", "weight", "activeCss", "inActiveCss", "cardDataList", "iconCollapse", "iconExpanded", "parent", "useVirtualScroll", "virtualScrollItemSize", "dataId"] }, { kind: "component", type: i2.LeftCardDataViewComponent, selector: "verben-left-card-data-view", inputs: ["cardDataList"] }, { kind: "component", type: i2.CardDataViewFooterComponent, selector: "verben-card-data-view-footer" }, { kind: "component", type: i2.SortTableComponent, selector: "verben-sort-table", inputs: ["enableDragAndDrop", "sortOptions", "resetText", "displayedOptions", "propertyText", "showMoreText", "sortButtonText", "pd", "mg", "height", "width", "bgColor", "boxShadow", "textColor", "primaryColor", "secondaryColor", "tertiaryColor", "border", "borderRadius", "selectWidth", "containerHeight"], outputs: ["selectedOptions", "resetSortData"] }, { kind: "component", type: i2.VisibleColumnComponent, selector: "verben-visible-column", inputs: ["columns", "items", "enableDragAndDrop", "displayedColumns", "showMore", "pd", "mg", "height", "width", "bgColor", "boxShadow", "textColor", "primaryColor", "secondaryColor", "tertiaryColor", "border", "borderRadius", "selectWidth", "closeColumn"], outputs: ["columnsUpdated", "resetFilter"] }, { kind: "component", type: i2.TableFilterComponent, selector: "verben-table-filter", inputs: ["filterOptions", "pd", "mg", "height", "width", "bgColor", "boxShadow", "textColor", "primaryColor", "secondaryColor", "tertiaryColor", "border", "borderRadius", "selectWidth", "maxFilterLength", "tooltip"], outputs: ["filtersApplied", "resetSortData"] }, { kind: "component", type: i2.DataExportComponent, selector: "lib-data-export", inputs: ["columns", "data", "dataFetchUrl", "dataQueryParameters"], outputs: ["exportDataEvent"] }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: WorkflowComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: WorkflowComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'verben-workflow', template: "<div class=\"space-y-8\">\n    <verben-data-view\n      #vdv\n      [viewState]=\"{\n        isSearch: true,\n        isColumn: true,\n        isFilter: true,\n        isSort: true,\n        isExport: true,\n        isSelect: true,\n        isCreate: true,\n        isToggle:true\n      }\"\n      [buttonClass]=\"'my-custom-button-class'\"\n      [iconClass]=\"'my-icon-class'\"\n      [tableIcon]=\"'table-view'\"\n      [cardIcon]=\"'list-view'\"\n      [activeIconClass]=\"'my-active-icon-class'\"\n      [selectedColumnCount]=\"0\"\n      [selectedSortCount]=\"0\"\n      [selectedFilterTableCount]=\"0\"\n      (viewChange)=\"onViewChange($event)\"\n      (stateChange)=\"onStateChange($event)\"\n    >\n      <div table-content>\n        <lib-data-table\n          [data]=\"data\"\n          [columns]=\"columns\"\n          [styleConfig]=\"styles\"\n          (selectionChange)=\"onSelectionChange($event)\"\n        >\n        <ng-container libColumn=\"select\">\n          <ng-template\n            #cell\n            let-value\n            let-isSelected=\"isSelected\"\n            let-toggleRowSelection=\"toggleRowSelection\"\n          >\n            <input\n              type=\"checkbox\"\n              [checked]=\"isSelected\"\n              class=\"cursor-pointer\"\n            />\n          </ng-template>\n          <ng-template\n          #header\n          let-allRowsSelected=\"allRowsSelected\"\n          let-someRowsSelected=\"someRowsSelected\"\n          let-toggleAllRows=\"toggleAllRows\"\n        >\n          <input\n            type=\"checkbox\"\n            [checked]=\"allRowsSelected()\"\n            [indeterminate]=\"someRowsSelected()\"\n            (change)=\"toggleAllRows()\"\n          />\n        </ng-template>\n        </ng-container>\n          <ng-container libColumn=\"status\">\n            <ng-template #cell let-value>\n              <div [class]=\"getRowStatus(value)\" class=\"rounded-[22px] flex items-center justify-center w-[84px] h-[31px] font-medium text-xs leading-[14.63px]\"> \n                {{value}}\n              </div>\n            </ng-template>\n          </ng-container>\n          <ng-container libColumn=\"action\">\n            <ng-template \n            #cell let-value \n            let-row=\"row\">\n            <div class=\"flex items-center gap-4\">\n              <span class=\"cursor-pointer\">\n                <verben-svg\n                  icon=\"edit\"\n                  [width]=\"15\"\n                  [height]=\"15\"\n                ></verben-svg>\n              </span>\n              <span class=\"cursor-pointer\">\n                <verben-svg\n                  icon=\"delete\"\n                  [width]=\"15\"\n                  [height]=\"15\"\n                ></verben-svg>\n              </span>\n              <span class=\"cursor-pointer\">\n                <verben-svg\n                  icon=\"draw\"\n                  [width]=\"18\"\n                  [height]=\"18\"\n                ></verben-svg>\n              </span>\n            </div>\n            </ng-template>\n          </ng-container>\n        </lib-data-table>\n      </div>\n      <div card-content>\n        <verben-card-data-view\n          borderRadius=\"12px\"\n          (loadMoreClick)=\"loadMore()\"\n          #vdcv\n          dataId=\"MailAddress\"\n          border=\"5px\"\n          [cardDataList]=\"cardData\"\n          rbgColor=\"#f5f6f9\"\n          mg=\"0px\"\n        >\n          <verben-left-card-data-view class=\"\">\n            <verben-left-card-data\n              #vlcd\n              [parent]=\"vdcv\"\n              dataId=\"MailAddress\"\n              class=\"bg-secondary-100 rounded-xl border-primary border-[1px]\"\n              [cardDataList]=\"cardData\"\n            >\n              <ng-template #card let-item>\n                <div class=\"flex h-[88px]\">\n                  <div\n                    class=\"flex  w-full bg-secondary rounded-xl\"\n                  >\n                    <div\n                      class=\"w-3 rounded-xl rounded-tr-none rounded-br-none\"\n                      [ngClass]=\"\n                        item.selected ? 'bg-primary' : 'bg-secondary-200'\n                      \"\n                    ></div>\n                    <div class=\"py-3 px-4 w-full h-[100%]\">\n                      <div class=\"flex items-start justify-between h-[100%]\">\n                        <div class=\"flex flex-col justify-between h-[100%]\">\n                          <h3 class=\"my-0 font-semibold text-[#404040] leading-[19.5px]\">{{\n                            item.title\n                          }}</h3>\n                          <p class=\"flex items-center\">\n                            <label  class=\"!text-[10px] font-light text-[#404040] leading-[12.1px]\"\n                              >Config count:</label\n                            >\n                            <span class=\"text-[13px] leading-[15.85px] font-medium ml-1 text-black\">{{\n                              item.data.Count\n                            }}</span>\n                          </p>\n                        </div>\n  \n                        <div class=\"flex items-end h-[100%]\">\n                            <p\n                            (click)=\"handleClick(item)\" \n                            class=\"my-0 underline text-[#3479E9] text-[11px] leading-[16.6px] cursor-pointer font-medium\"\n                            >View configs</p>\n                        </div>\n                      </div>\n                    </div>\n                  </div>\n                </div>\n              </ng-template>\n            </verben-left-card-data>\n          </verben-left-card-data-view>\n          <!-- <verben-right-card-data-view> \n            yeshhhhhh\n          </verben-right-card-data-view> -->\n  \n          <verben-card-data-view-footer class=\"float-right\">\n            <div class=\"flex gap-2\">\n              <span class=\"paginator-text\"\n                >{{ cardData.length }} records loaded</span\n              >\n              <button (click)=\"loadMore()\" class=\"load-more\">Load more</button>\n            </div>\n          </verben-card-data-view-footer>\n        </verben-card-data-view>\n      </div>\n      <div column-content>\n        <verben-visible-column\n          (columnsUpdated)=\"onColumnsUpdated($event)\"\n          [border]=\"'1px solid rgba(212, 160, 7, 1)'\"\n          borderRadius=\"10px\"\n          boxShadow=\"2px 2px 2px 0px silver\"\n          bgColor=\"white\"\n          width=\"400px\"\n          textColor=\"black\"\n          pd=\"1rem\"\n          primaryColor=\"#FFE681\"\n          secondaryColor=\"#3479E9\"\n          [columns]=\"visibleColumns\"\n          [displayedColumns]=\"5\"\n        ></verben-visible-column>\n      </div>\n      <div filter-content>\n        <verben-table-filter\n          [border]=\"'1px solid rgba(212, 160, 7, 1)'\"\n          borderRadius=\"10px\"\n          boxShadow=\"2px 2px 2px 0px silver\"\n          bgColor=\"white\"\n          width=\"420px\"\n          textColor=\"black\"\n          pd=\"1rem\"\n          primaryColor=\"#FFE681\"\n          secondaryColor=\"#3479E9\"\n          tertiaryColor=\"#404040\"\n          [filterOptions]=\"filterArray\"\n          [maxFilterLength]=\"3\"\n        ></verben-table-filter>\n      </div>\n      <div sort-content>\n        <verben-sort-table\n          (selectedOptions)=\"onSortUpdated($event)\"\n          [border]=\"'1px solid rgba(212, 160, 7, 1)'\"\n          borderRadius=\"10px\"\n          boxShadow=\"2px 2px 2px 0px silver\"\n          bgColor=\"white\"\n          width=\"400px\"\n          textColor=\"black\"\n          pd=\"1rem\"\n          primaryColor=\"#FFE681\"\n          secondaryColor=\"#3479E9\"\n          tertiaryColor=\"#404040\"\n          [enableDragAndDrop]=\"true\"\n          [sortOptions]=\"sortOptions\"\n        ></verben-sort-table>\n      </div>\n      <div export-content>\n        <lib-data-export [data]=\"data\" (exportDataEvent)=\"handleExport($event)\">\n        </lib-data-export>\n      </div>\n    </verben-data-view>\n  </div>\n  \n  " }]
+            args: [{ selector: 'verben-workflow', template: "<div class=\"space-y-8\">\n    <verben-data-view\n      #vdv\n      [viewState]=\"{\n        isSearch: true,\n        isColumn: true,\n        isFilter: true,\n        isSort: true,\n        isExport: true,\n        isSelect: true,\n        isCreate: true,\n        isToggle:true\n      }\"\n      [buttonClass]=\"'my-custom-button-class'\"\n      [iconClass]=\"'my-icon-class'\"\n      [tableIcon]=\"'table-view'\"\n      [cardIcon]=\"'list-view'\"\n      [activeIconClass]=\"'my-active-icon-class'\"\n      [selectedColumnCount]=\"0\"\n      [selectedSortCount]=\"0\"\n      [selectedFilterTableCount]=\"0\"\n      (viewChange)=\"onViewChange($event)\"\n      (stateChange)=\"onStateChange($event)\"\n    >\n      <div table-content>\n        <lib-data-table\n          [data]=\"data\"\n          [columns]=\"columns\"\n          [styleConfig]=\"styles\"\n          (selectionChange)=\"onSelectionChange($event)\"\n        >\n        <ng-container libColumn=\"select\">\n          <ng-template\n            #cell\n            let-value\n            let-isSelected=\"isSelected\"\n            let-toggleRowSelection=\"toggleRowSelection\"\n          >\n            <input\n              type=\"checkbox\"\n              [checked]=\"isSelected\"\n              class=\"cursor-pointer\"\n            />\n          </ng-template>\n          <ng-template\n          #header\n          let-allRowsSelected=\"allRowsSelected\"\n          let-someRowsSelected=\"someRowsSelected\"\n          let-toggleAllRows=\"toggleAllRows\"\n        >\n          <input\n            type=\"checkbox\"\n            [checked]=\"allRowsSelected()\"\n            [indeterminate]=\"someRowsSelected()\"\n            (change)=\"toggleAllRows()\"\n          />\n        </ng-template>\n        </ng-container>\n          <ng-container libColumn=\"status\">\n            <ng-template #cell let-value>\n              <div [class]=\"getRowStatus(value)\" class=\"rounded-[22px] flex items-center justify-center w-[84px] h-[31px] font-medium text-xs leading-[14.63px]\"> \n                {{value}}\n              </div>\n            </ng-template>\n          </ng-container>\n          <ng-container libColumn=\"action\">\n            <ng-template \n            #cell let-value \n            let-row=\"row\">\n            <div class=\"flex items-center gap-4\">\n              <span class=\"cursor-pointer\">\n                <verben-svg\n                  icon=\"edit\"\n                  [width]=\"15\"\n                  [height]=\"15\"\n                ></verben-svg>\n              </span>\n              <span class=\"cursor-pointer\">\n                <verben-svg\n                  icon=\"delete\"\n                  [width]=\"15\"\n                  [height]=\"15\"\n                ></verben-svg>\n              </span>\n              <span class=\"cursor-pointer\">\n                <verben-svg\n                  icon=\"draw\"\n                  [width]=\"18\"\n                  [height]=\"18\"\n                ></verben-svg>\n              </span>\n            </div>\n            </ng-template>\n          </ng-container>\n        </lib-data-table>\n      </div>\n      <div card-content>\n        <verben-card-data-view\n          borderRadius=\"12px\"\n          (loadMoreClick)=\"loadMore()\"\n          #vdcv\n          dataId=\"MailAddress\"\n          border=\"5px\"\n          [cardDataList]=\"cardData\"\n          rbgColor=\"var(--vbn-color-surface-alt)\"\n          mg=\"0px\"\n        >\n          <verben-left-card-data-view class=\"\">\n            <verben-left-card-data\n              #vlcd\n              [parent]=\"vdcv\"\n              dataId=\"MailAddress\"\n              class=\"bg-secondary-100 rounded-xl border-primary border-[1px]\"\n              [cardDataList]=\"cardData\"\n            >\n              <ng-template #card let-item>\n                <div class=\"flex h-[88px]\">\n                  <div\n                    class=\"flex  w-full bg-secondary rounded-xl\"\n                  >\n                    <div\n                      class=\"w-3 rounded-xl rounded-tr-none rounded-br-none\"\n                      [ngClass]=\"\n                        item.selected ? 'bg-primary' : 'bg-secondary-200'\n                      \"\n                    ></div>\n                    <div class=\"py-3 px-4 w-full h-[100%]\">\n                      <div class=\"flex items-start justify-between h-[100%]\">\n                        <div class=\"flex flex-col justify-between h-[100%]\">\n                          <h3 class=\"my-0 font-semibold text-[var(--vbn-color-on-primary)] leading-[19.5px]\">{{\n                            item.title\n                          }}</h3>\n                          <p class=\"flex items-center\">\n                            <label  class=\"!text-[10px] font-light text-[var(--vbn-color-on-primary)] leading-[12.1px]\"\n                              >Config count:</label\n                            >\n                            <span class=\"text-[13px] leading-[15.85px] font-medium ml-1 text-black\">{{\n                              item.data.Count\n                            }}</span>\n                          </p>\n                        </div>\n  \n                        <div class=\"flex items-end h-[100%]\">\n                            <p\n                            (click)=\"handleClick(item)\" \n                            class=\"my-0 underline text-[var(--vbn-color-border-focus)] text-[11px] leading-[16.6px] cursor-pointer font-medium\"\n                            >View configs</p>\n                        </div>\n                      </div>\n                    </div>\n                  </div>\n                </div>\n              </ng-template>\n            </verben-left-card-data>\n          </verben-left-card-data-view>\n          <!-- <verben-right-card-data-view> \n            yeshhhhhh\n          </verben-right-card-data-view> -->\n  \n          <verben-card-data-view-footer class=\"float-right\">\n            <div class=\"flex gap-2\">\n              <span class=\"paginator-text\"\n                >{{ cardData.length }} records loaded</span\n              >\n              <button (click)=\"loadMore()\" class=\"load-more\">Load more</button>\n            </div>\n          </verben-card-data-view-footer>\n        </verben-card-data-view>\n      </div>\n      <div column-content>\n        <verben-visible-column\n          (columnsUpdated)=\"onColumnsUpdated($event)\"\n          [border]=\"'1px solid var(--vbn-color-primary)'\"\n          borderRadius=\"10px\"\n          boxShadow=\"2px 2px 2px 0px silver\"\n          bgColor=\"white\"\n          width=\"400px\"\n          textColor=\"black\"\n          pd=\"1rem\"\n          primaryColor=\"var(--vbn-color-primary)\"\n          secondaryColor=\"var(--vbn-color-border-focus)\"\n          [columns]=\"visibleColumns\"\n          [displayedColumns]=\"5\"\n        ></verben-visible-column>\n      </div>\n      <div filter-content>\n        <verben-table-filter\n          [border]=\"'1px solid var(--vbn-color-primary)'\"\n          borderRadius=\"10px\"\n          boxShadow=\"2px 2px 2px 0px silver\"\n          bgColor=\"white\"\n          width=\"420px\"\n          textColor=\"black\"\n          pd=\"1rem\"\n          primaryColor=\"var(--vbn-color-primary)\"\n          secondaryColor=\"var(--vbn-color-border-focus)\"\n          tertiaryColor=\"var(--vbn-color-on-primary)\"\n          [filterOptions]=\"filterArray\"\n          [maxFilterLength]=\"3\"\n        ></verben-table-filter>\n      </div>\n      <div sort-content>\n        <verben-sort-table\n          (selectedOptions)=\"onSortUpdated($event)\"\n          [border]=\"'1px solid var(--vbn-color-primary)'\"\n          borderRadius=\"10px\"\n          boxShadow=\"2px 2px 2px 0px silver\"\n          bgColor=\"white\"\n          width=\"400px\"\n          textColor=\"black\"\n          pd=\"1rem\"\n          primaryColor=\"var(--vbn-color-primary)\"\n          secondaryColor=\"var(--vbn-color-border-focus)\"\n          tertiaryColor=\"var(--vbn-color-on-primary)\"\n          [enableDragAndDrop]=\"true\"\n          [sortOptions]=\"sortOptions\"\n        ></verben-sort-table>\n      </div>\n      <div export-content>\n        <lib-data-export [data]=\"data\" (exportDataEvent)=\"handleExport($event)\">\n        </lib-data-export>\n      </div>\n    </verben-data-view>\n  </div>\n  \n  " }]
         }], propDecorators: { cardDataView: [{
                 type: ViewChild,
                 args: ['vdcv']
@@ -350,11 +350,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
             }] } });
 
 class WorkflowModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: WorkflowModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: WorkflowModule, declarations: [WorkflowComponent], imports: [CommonModule, SharedModule], exports: [WorkflowComponent] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: WorkflowModule, imports: [CommonModule, SharedModule] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: WorkflowModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.14", ngImport: i0, type: WorkflowModule, declarations: [WorkflowComponent], imports: [CommonModule, SharedModule], exports: [WorkflowComponent] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: WorkflowModule, imports: [CommonModule, SharedModule] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: WorkflowModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: WorkflowModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [WorkflowComponent],

package/fesm2022/verben-workflow-ui-src-lib-components-workflow.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"verben-workflow-ui-src-lib-components-workflow.mjs","sources":["../../../projects/verben-workflow-ui/src/lib/components/workflow/column.ts","../../../projects/verben-workflow-ui/src/lib/components/workflow/helper.ts","../../../projects/verben-workflow-ui/src/lib/components/workflow/table-style.ts","../../../projects/verben-workflow-ui/src/lib/components/workflow/workflow.component.ts","../../../projects/verben-workflow-ui/src/lib/components/workflow/workflow.component.html","../../../projects/verben-workflow-ui/src/lib/components/workflow/workflow.module.ts","../../../projects/verben-workflow-ui/src/lib/components/workflow/verben-workflow-ui-src-lib-components-workflow.ts"],"sourcesContent":["import { ColumnDefinition } from 'verben-ng-ui';\nimport { Workflow } from 'verben-workflow-ui/src/lib/models';\n\nexport const columns: ColumnDefinition<Workflow>[] = [\n  {\n    id: 'name',\n    header: 'Name',\n    accessorKey: 'Name',\n  },\n  {\n    id: 'description',\n    header: 'Description',\n    accessorKey: 'Description',\n  },\n  {\n    id: 'assignmentType',\n    header: 'Assignment Type',\n    accessorKey: 'AssignmentType',\n  },\n  {\n    id: 'service',\n    header: 'Service',\n    accessorKey: 'StageEntryRule',\n  },\n  {\n    id: 'operation',\n    header: 'Operation',\n    accessorKey: 'Operation',\n  },\n  {\n    id: 'status',\n    header: 'Status',\n    accessorKey: 'Status',\n  },\n  {\n    id: 'action',\n    header: 'Actions',\n    // accessorKey: 'Actions',\n  },\n];\n","import { TaskAssignmentType } from 'verben-workflow-ui/src/lib/models';\nimport { Workflow } from 'verben-workflow-ui/src/lib/models';\n\nimport { ObjectState } from 'verben-workflow-ui/src/lib/models';\nimport { Status } from 'verben-workflow-ui/src/lib/models';\n\nlet mockNames: string[] = [\n  'Jecil',\n  'Akintunde',\n  'Babatunde',\n  'Busayo',\n  'Jibola',\n  'Temiloluwa',\n];\n\nlet mockOperations: string[] = ['Queve', 'Assign'];\n\nexport const mockData: Workflow[] = new Array(10).fill(1).map((id, i) => ({\n  Status: randomEnum(Status),\n  Operation: randomOperation(),\n  Description: 'Sign in flow',\n  Name: randomName(),\n  StageEntryRule: 'Design',\n  AssignmentType: TaskAssignmentType.Queue,\n  Actions: [],\n  Id: id + i,\n  id: (id + i).toString(),\n  Tenants: [],\n  ServiceName: '',\n  Code: '',\n  TenantId: '',\n  CreatedAt: new Date(),\n  UpdatedAt: new Date(),\n  DataState: ObjectState.New,\n  Tenant: `Tenant${id + i}`,\n  Lanes: [],\n  Stages: [],\n}));\n\nfunction randomEnum<T extends object>(anEnum: T): T[keyof T] {\n  const enumValues = Object.values(anEnum) as unknown as T[keyof T][];\n  const randomIndex = Math.floor(Math.random() * enumValues.length);\n  return enumValues[randomIndex];\n}\n\nfunction randomOperation(): string {\n  const randomIndex = Math.floor(Math.random() * mockOperations.length);\n  return mockOperations[randomIndex];\n}\nfunction randomName(): string {\n  const randomIndex = Math.floor(Math.random() * mockNames.length);\n  return mockNames[randomIndex];\n}\n","export const baseStyle: any = {\n    width: '100%',\n    fontFamily: '\"Fraunces\", serif',\n    fontSize: '125%',\n    whiteSpace: 'nowrap',\n    margin: '0',\n    border: '1px solid #D4A007',\n    borderRadius: '16px',\n    borderCollapse: 'separate',\n    borderSpacing: '0',\n    tableLayout: 'fixed',\n    overflow: 'hidden',\n    rows: {\n      even: {\n        backgroundColor: '#FDFDFD',\n      },\n      odd: {\n        backgroundColor: '#F1F4FB',\n      },\n      height: '68px',\n    },\n    cells: {\n      padding: '0.5rem 1rem',\n    },\n    header: {\n      // stickyTop: true,\n      // zIndex: 2,\n      backgroundColor: '#EFF2FB',\n      fontWeight: 'bold',\n      textAlign: 'left',\n      padding: '12px 16px',\n      height: '40px',\n    },\n    footer: {\n      // stickyBottom: true,\n      // zIndex: 2,\n      padding: '3px',\n    },\n    //   body: {\n    //     background: '#fff',\n    //     padding: '4px 5px',\n    //     textAlign: 'center',\n    //   },\n    // firstColumn: {\n    //   stickyLeft: true,\n    //   zIndex: 1,\n    // },\n    lastColumn: {\n      // stickyRight: true,\n      // zIndex: 1,\n    },\n  };\n  ","import { Component, EventEmitter, Output, ViewChild } from '@angular/core';\nimport { columns } from './column';\nimport { mockData } from './helper';\nimport { baseStyle } from './table-style';\n\nimport {\n  CardData,\n  CardDataViewComponent,\n  DataFilterType,\n  DataViewComponent,\n  IDataFilter,\n} from 'verben-ng-ui';\nimport { Workflow } from 'verben-workflow-ui/src/lib/models';\nimport { Status } from 'verben-workflow-ui/src/lib/models';\n\n@Component({\n  selector: 'verben-workflow',\n  templateUrl: './workflow.component.html',\n  styleUrl: './workflow.component.css',\n})\nexport class WorkflowComponent {\n  @ViewChild('vdcv') cardDataView!: CardDataViewComponent;\n  @ViewChild('vdv') dataView!: DataViewComponent;\n  @Output() itemClicked = new EventEmitter<any>();\n\n  data = mockData;\n  styles = baseStyle;\n  currentData: CardData | null = null;\n  isGridView = true;\n  selected: CardData | null = null;\n  showSidebar: boolean = false;\n  columns = columns;\n\n  cardData: CardData[] = mockData.map(({ Operation, Description, Name }) => ({\n    selected: false,\n    title: Name,\n    data: {\n      Name,\n      Operation,\n      Description,\n    } as Partial<Workflow>,\n    body: [],\n    children: [],\n  }));\n\n  openDetailView(mailAddress: string) {\n    const cardItem = this.getCardDataByMailAddress(mailAddress);\n    if (cardItem && this.cardDataView) {\n      this.dataView.toggleView();\n      // First reset all selections\n      this.cardData.forEach((item) => {\n        item.selected = false;\n        if (item.children) {\n          item.children.forEach((child) => (child.selected = false));\n        }\n      });\n\n      // Set the selected item\n      cardItem.selected = true;\n      this.currentData = this.cardDataView.onItemClick(cardItem);\n\n      // Force change detection if needed\n      // this.changeDetectorRef.detectChanges();\n    }\n  }\n\n  getCardDataByMailAddress(mailAddress: string): CardData | undefined {\n    return this.cardData.find(({ data }) => data.MailAddress === mailAddress);\n  }\n\n  onViewChange(isGridView: boolean): void {\n    this.isGridView = isGridView;\n    // Reset selection when switching views\n    if (this.currentData) {\n      this.cardDataView?.clearData();\n      this.currentData = null;\n    }\n\n    if (this.selected) {\n      this.cardDataView.onItemClick(this.selected);\n    }\n  }\n\n  openFormView(index: number) {\n    const item = this.cardData[index];\n  }\n\n  handleExport(exportedData: Partial<any>[]) {\n    this.downloadCSV(exportedData);\n  }\n\n  handleClick(item: any) {\n    this.itemClicked.emit(item.data);\n  }\n  handleConfig(item: any) {\n    this.itemClicked.emit(item);\n  }\n\n  /**\n   *\n   * @param data Simple csv export for testing\n   */\n  private downloadCSV(data: Partial<any>[]) {\n    const headers = Object.keys(data[0]);\n    const csvContent = [\n      headers.join(','),\n      ...data.map((row) => headers.map((header) => row[header]).join(',')),\n    ].join('\\n');\n\n    const blob = new Blob([csvContent], { type: 'text/csv;charset=utf-8;' });\n    const link = document.createElement('a');\n    if (link.download !== undefined) {\n      const url = URL.createObjectURL(blob);\n      link.setAttribute('href', url);\n      link.setAttribute('download', 'export.csv');\n      link.style.visibility = 'hidden';\n      document.body.appendChild(link);\n      link.click();\n      document.body.removeChild(link);\n    }\n  }\n\n  onSelectionChange(selectedRows: Workflow[]) {\n    console.log('Selection changed:', selectedRows);\n    // Handle the selection change\n  }\n\n  /**\n   * Copied over from card view doc until I understand usage\n   */\n  selectedColumnCount: number = 0;\n  selectedFilterTableCount: number = 0;\n  isOPen: boolean = true;\n  selectedSortCount: number = 0;\n  showColumn: boolean = false;\n  showSort: boolean = false;\n  selectedAll: boolean = false;\n  nestedbgcolor: string = '';\n\n  visibleColumns: IDataFilter[] = columns.map((col) => ({\n    checked: true,\n    name: typeof col.header === 'string' ? col.header : col.id,\n    type: DataFilterType.Bool,\n  }));\n  filterArray: IDataFilter[] = [\n    {\n      name: 'Name',\n      type: DataFilterType.String,\n      checked: false,\n    },\n    {\n      name: 'MailAddress',\n      type: DataFilterType.String,\n      checked: false,\n    },\n    {\n      name: 'PhoneNumber',\n      type: DataFilterType.String,\n      checked: false,\n    },\n    {\n      name: 'CreatedAt',\n      type: DataFilterType.Date,\n      checked: false,\n    },\n  ];\n\n  sortOptions: IDataFilter[] = [\n    {\n      name: 'Name',\n      type: DataFilterType.String,\n      checked: false,\n    },\n    {\n      name: 'MailAddress',\n      type: DataFilterType.String,\n      checked: false,\n    },\n    {\n      name: 'PhoneNumber',\n      type: DataFilterType.String,\n      checked: false,\n    },\n    {\n      name: 'CreatedAt',\n      type: DataFilterType.Date,\n      checked: false,\n    },\n  ];\n  clearData() {\n    this.currentData = {} as CardData;\n  }\n  loadMore() {\n    this.cardData = this.cardData.concat(this.cardData);\n  }\n  onColumnChange(event: boolean) {\n    this.showColumn = event;\n  }\n  onSortChange(event: boolean) {\n    this.showSort = event;\n    console.log(event);\n  }\n  onColumnsUpdated(updatedColumns: IDataFilter[]) {\n    console.log(updatedColumns);\n    this.onColumnChange(false);\n    this.selectedColumnCount = updatedColumns.length;\n  }\n  onSortUpdated(updatedSorts: IDataFilter[]) {\n    this.onSortChange(false);\n    this.selectedSortCount = updatedSorts.length;\n    console.log(updatedSorts);\n  }\n  onStateChange(event: { key: string; value: boolean }): void {\n    console.log(`State changed for ${event.key}:`, event.value);\n  }\n  getRowStatus(type: string) {\n    console.log('data is here', type);\n\n    switch (type) {\n      // case WorkflowStatus.Pending:\n      //   return 'bg-[#FEF2E5] text-[#CD6200]';\n      case Status.Active:\n        return 'bg-[#EBF9F1] text-[#1F9254]';\n      case Status.InActive:\n        return 'bg-[#FBE7E8] text-[#A30D11]';\n      default:\n        return '';\n    }\n  }\n}\n","<div class=\"space-y-8\">\n    <verben-data-view\n      #vdv\n      [viewState]=\"{\n        isSearch: true,\n        isColumn: true,\n        isFilter: true,\n        isSort: true,\n        isExport: true,\n        isSelect: true,\n        isCreate: true,\n        isToggle:true\n      }\"\n      [buttonClass]=\"'my-custom-button-class'\"\n      [iconClass]=\"'my-icon-class'\"\n      [tableIcon]=\"'table-view'\"\n      [cardIcon]=\"'list-view'\"\n      [activeIconClass]=\"'my-active-icon-class'\"\n      [selectedColumnCount]=\"0\"\n      [selectedSortCount]=\"0\"\n      [selectedFilterTableCount]=\"0\"\n      (viewChange)=\"onViewChange($event)\"\n      (stateChange)=\"onStateChange($event)\"\n    >\n      <div table-content>\n        <lib-data-table\n          [data]=\"data\"\n          [columns]=\"columns\"\n          [styleConfig]=\"styles\"\n          (selectionChange)=\"onSelectionChange($event)\"\n        >\n        <ng-container libColumn=\"select\">\n          <ng-template\n            #cell\n            let-value\n            let-isSelected=\"isSelected\"\n            let-toggleRowSelection=\"toggleRowSelection\"\n          >\n            <input\n              type=\"checkbox\"\n              [checked]=\"isSelected\"\n              class=\"cursor-pointer\"\n            />\n          </ng-template>\n          <ng-template\n          #header\n          let-allRowsSelected=\"allRowsSelected\"\n          let-someRowsSelected=\"someRowsSelected\"\n          let-toggleAllRows=\"toggleAllRows\"\n        >\n          <input\n            type=\"checkbox\"\n            [checked]=\"allRowsSelected()\"\n            [indeterminate]=\"someRowsSelected()\"\n            (change)=\"toggleAllRows()\"\n          />\n        </ng-template>\n        </ng-container>\n          <ng-container libColumn=\"status\">\n            <ng-template #cell let-value>\n              <div [class]=\"getRowStatus(value)\" class=\"rounded-[22px] flex items-center justify-center w-[84px] h-[31px] font-medium text-xs leading-[14.63px]\"> \n                {{value}}\n              </div>\n            </ng-template>\n          </ng-container>\n          <ng-container libColumn=\"action\">\n            <ng-template \n            #cell let-value \n            let-row=\"row\">\n            <div class=\"flex items-center gap-4\">\n              <span class=\"cursor-pointer\">\n                <verben-svg\n                  icon=\"edit\"\n                  [width]=\"15\"\n                  [height]=\"15\"\n                ></verben-svg>\n              </span>\n              <span class=\"cursor-pointer\">\n                <verben-svg\n                  icon=\"delete\"\n                  [width]=\"15\"\n                  [height]=\"15\"\n                ></verben-svg>\n              </span>\n              <span class=\"cursor-pointer\">\n                <verben-svg\n                  icon=\"draw\"\n                  [width]=\"18\"\n                  [height]=\"18\"\n                ></verben-svg>\n              </span>\n            </div>\n            </ng-template>\n          </ng-container>\n        </lib-data-table>\n      </div>\n      <div card-content>\n        <verben-card-data-view\n          borderRadius=\"12px\"\n          (loadMoreClick)=\"loadMore()\"\n          #vdcv\n          dataId=\"MailAddress\"\n          border=\"5px\"\n          [cardDataList]=\"cardData\"\n          rbgColor=\"#f5f6f9\"\n          mg=\"0px\"\n        >\n          <verben-left-card-data-view class=\"\">\n            <verben-left-card-data\n              #vlcd\n              [parent]=\"vdcv\"\n              dataId=\"MailAddress\"\n              class=\"bg-secondary-100 rounded-xl border-primary border-[1px]\"\n              [cardDataList]=\"cardData\"\n            >\n              <ng-template #card let-item>\n                <div class=\"flex h-[88px]\">\n                  <div\n                    class=\"flex  w-full bg-secondary rounded-xl\"\n                  >\n                    <div\n                      class=\"w-3 rounded-xl rounded-tr-none rounded-br-none\"\n                      [ngClass]=\"\n                        item.selected ? 'bg-primary' : 'bg-secondary-200'\n                      \"\n                    ></div>\n                    <div class=\"py-3 px-4 w-full h-[100%]\">\n                      <div class=\"flex items-start justify-between h-[100%]\">\n                        <div class=\"flex flex-col justify-between h-[100%]\">\n                          <h3 class=\"my-0 font-semibold text-[#404040] leading-[19.5px]\">{{\n                            item.title\n                          }}</h3>\n                          <p class=\"flex items-center\">\n                            <label  class=\"!text-[10px] font-light text-[#404040] leading-[12.1px]\"\n                              >Config count:</label\n                            >\n                            <span class=\"text-[13px] leading-[15.85px] font-medium ml-1 text-black\">{{\n                              item.data.Count\n                            }}</span>\n                          </p>\n                        </div>\n  \n                        <div class=\"flex items-end h-[100%]\">\n                            <p\n                            (click)=\"handleClick(item)\" \n                            class=\"my-0 underline text-[#3479E9] text-[11px] leading-[16.6px] cursor-pointer font-medium\"\n                            >View configs</p>\n                        </div>\n                      </div>\n                    </div>\n                  </div>\n                </div>\n              </ng-template>\n            </verben-left-card-data>\n          </verben-left-card-data-view>\n          <!-- <verben-right-card-data-view> \n            yeshhhhhh\n          </verben-right-card-data-view> -->\n  \n          <verben-card-data-view-footer class=\"float-right\">\n            <div class=\"flex gap-2\">\n              <span class=\"paginator-text\"\n                >{{ cardData.length }} records loaded</span\n              >\n              <button (click)=\"loadMore()\" class=\"load-more\">Load more</button>\n            </div>\n          </verben-card-data-view-footer>\n        </verben-card-data-view>\n      </div>\n      <div column-content>\n        <verben-visible-column\n          (columnsUpdated)=\"onColumnsUpdated($event)\"\n          [border]=\"'1px solid rgba(212, 160, 7, 1)'\"\n          borderRadius=\"10px\"\n          boxShadow=\"2px 2px 2px 0px silver\"\n          bgColor=\"white\"\n          width=\"400px\"\n          textColor=\"black\"\n          pd=\"1rem\"\n          primaryColor=\"#FFE681\"\n          secondaryColor=\"#3479E9\"\n          [columns]=\"visibleColumns\"\n          [displayedColumns]=\"5\"\n        ></verben-visible-column>\n      </div>\n      <div filter-content>\n        <verben-table-filter\n          [border]=\"'1px solid rgba(212, 160, 7, 1)'\"\n          borderRadius=\"10px\"\n          boxShadow=\"2px 2px 2px 0px silver\"\n          bgColor=\"white\"\n          width=\"420px\"\n          textColor=\"black\"\n          pd=\"1rem\"\n          primaryColor=\"#FFE681\"\n          secondaryColor=\"#3479E9\"\n          tertiaryColor=\"#404040\"\n          [filterOptions]=\"filterArray\"\n          [maxFilterLength]=\"3\"\n        ></verben-table-filter>\n      </div>\n      <div sort-content>\n        <verben-sort-table\n          (selectedOptions)=\"onSortUpdated($event)\"\n          [border]=\"'1px solid rgba(212, 160, 7, 1)'\"\n          borderRadius=\"10px\"\n          boxShadow=\"2px 2px 2px 0px silver\"\n          bgColor=\"white\"\n          width=\"400px\"\n          textColor=\"black\"\n          pd=\"1rem\"\n          primaryColor=\"#FFE681\"\n          secondaryColor=\"#3479E9\"\n          tertiaryColor=\"#404040\"\n          [enableDragAndDrop]=\"true\"\n          [sortOptions]=\"sortOptions\"\n        ></verben-sort-table>\n      </div>\n      <div export-content>\n        <lib-data-export [data]=\"data\" (exportDataEvent)=\"handleExport($event)\">\n        </lib-data-export>\n      </div>\n    </verben-data-view>\n  </div>\n  \n  ","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { WorkflowComponent } from './workflow.component';\nimport { SharedModule } from 'verben-workflow-ui/src/lib/shared';\n\n@NgModule({\n  declarations: [WorkflowComponent],\n  imports: [CommonModule, SharedModule],\n  exports: [WorkflowComponent],\n})\nexport class WorkflowModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"verben-workflow-ui-src-lib-components-workflow.mjs","sources":["../../../projects/verben-workflow-ui/src/lib/components/workflow/column.ts","../../../projects/verben-workflow-ui/src/lib/components/workflow/helper.ts","../../../projects/verben-workflow-ui/src/lib/components/workflow/table-style.ts","../../../projects/verben-workflow-ui/src/lib/components/workflow/workflow.component.ts","../../../projects/verben-workflow-ui/src/lib/components/workflow/workflow.component.html","../../../projects/verben-workflow-ui/src/lib/components/workflow/workflow.module.ts","../../../projects/verben-workflow-ui/src/lib/components/workflow/verben-workflow-ui-src-lib-components-workflow.ts"],"sourcesContent":["import { ColumnDefinition } from 'verben-ng-ui';\nimport { Workflow } from 'verben-workflow-ui/src/lib/models';\n\nexport const columns: ColumnDefinition<Workflow>[] = [\n  {\n    id: 'name',\n    header: 'Name',\n    accessorKey: 'Name',\n  },\n  {\n    id: 'description',\n    header: 'Description',\n    accessorKey: 'Description',\n  },\n  {\n    id: 'assignmentType',\n    header: 'Assignment Type',\n    accessorKey: 'AssignmentType',\n  },\n  {\n    id: 'service',\n    header: 'Service',\n    accessorKey: 'StageEntryRule',\n  },\n  {\n    id: 'operation',\n    header: 'Operation',\n    accessorKey: 'Operation',\n  },\n  {\n    id: 'status',\n    header: 'Status',\n    accessorKey: 'Status',\n  },\n  {\n    id: 'action',\n    header: 'Actions',\n    // accessorKey: 'Actions',\n  },\n];\n","import { TaskAssignmentType } from 'verben-workflow-ui/src/lib/models';\nimport { Workflow } from 'verben-workflow-ui/src/lib/models';\n\nimport { ObjectState } from 'verben-workflow-ui/src/lib/models';\nimport { Status } from 'verben-workflow-ui/src/lib/models';\n\nlet mockNames: string[] = [\n  'Jecil',\n  'Akintunde',\n  'Babatunde',\n  'Busayo',\n  'Jibola',\n  'Temiloluwa',\n];\n\nlet mockOperations: string[] = ['Queve', 'Assign'];\n\nexport const mockData: Workflow[] = new Array(10).fill(1).map((id, i) => ({\n  Status: randomEnum(Status),\n  Operation: randomOperation(),\n  Description: 'Sign in flow',\n  Name: randomName(),\n  StageEntryRule: 'Design',\n  AssignmentType: TaskAssignmentType.Queue,\n  Actions: [],\n  Id: id + i,\n  id: (id + i).toString(),\n  Tenants: [],\n  ServiceName: '',\n  Code: '',\n  TenantId: '',\n  CreatedAt: new Date(),\n  UpdatedAt: new Date(),\n  DataState: ObjectState.New,\n  Tenant: `Tenant${id + i}`,\n  Lanes: [],\n  Stages: [],\n}));\n\nfunction randomEnum<T extends object>(anEnum: T): T[keyof T] {\n  const enumValues = Object.values(anEnum) as unknown as T[keyof T][];\n  const randomIndex = Math.floor(Math.random() * enumValues.length);\n  return enumValues[randomIndex];\n}\n\nfunction randomOperation(): string {\n  const randomIndex = Math.floor(Math.random() * mockOperations.length);\n  return mockOperations[randomIndex];\n}\nfunction randomName(): string {\n  const randomIndex = Math.floor(Math.random() * mockNames.length);\n  return mockNames[randomIndex];\n}\n","export const baseStyle: any = {\n    width: '100%',\n    fontFamily: '\"Fraunces\", serif',\n    fontSize: '125%',\n    whiteSpace: 'nowrap',\n    margin: '0',\n    border: '1px solid var(--vbn-color-primary)',\n    borderRadius: '16px',\n    borderCollapse: 'separate',\n    borderSpacing: '0',\n    tableLayout: 'fixed',\n    overflow: 'hidden',\n    rows: {\n      even: {\n        backgroundColor: 'var(--vbn-color-surface)',\n      },\n      odd: {\n        backgroundColor: 'var(--vbn-color-surface-alt)',\n      },\n      height: '68px',\n    },\n    cells: {\n      padding: '0.5rem 1rem',\n    },\n    header: {\n      // stickyTop: true,\n      // zIndex: 2,\n      backgroundColor: 'var(--vbn-color-surface-alt)',\n      fontWeight: 'bold',\n      textAlign: 'left',\n      padding: '12px 16px',\n      height: '40px',\n    },\n    footer: {\n      // stickyBottom: true,\n      // zIndex: 2,\n      padding: '3px',\n    },\n    //   body: {\n    //     background: 'var(--vbn-color-surface)',\n    //     padding: '4px 5px',\n    //     textAlign: 'center',\n    //   },\n    // firstColumn: {\n    //   stickyLeft: true,\n    //   zIndex: 1,\n    // },\n    lastColumn: {\n      // stickyRight: true,\n      // zIndex: 1,\n    },\n  };\n  ","import { Component, EventEmitter, Output, ViewChild } from '@angular/core';\nimport { columns } from './column';\nimport { mockData } from './helper';\nimport { baseStyle } from './table-style';\n\nimport {\n  CardData,\n  CardDataViewComponent,\n  DataFilterType,\n  DataViewComponent,\n  IDataFilter,\n} from 'verben-ng-ui';\nimport { Workflow } from 'verben-workflow-ui/src/lib/models';\nimport { Status } from 'verben-workflow-ui/src/lib/models';\n\n@Component({\n  selector: 'verben-workflow',\n  templateUrl: './workflow.component.html',\n  styleUrl: './workflow.component.css',\n})\nexport class WorkflowComponent {\n  @ViewChild('vdcv') cardDataView!: CardDataViewComponent;\n  @ViewChild('vdv') dataView!: DataViewComponent;\n  @Output() itemClicked = new EventEmitter<any>();\n\n  data = mockData;\n  styles = baseStyle;\n  currentData: CardData | null = null;\n  isGridView = true;\n  selected: CardData | null = null;\n  showSidebar: boolean = false;\n  columns = columns;\n\n  cardData: CardData[] = mockData.map(({ Operation, Description, Name }) => ({\n    selected: false,\n    title: Name,\n    data: {\n      Name,\n      Operation,\n      Description,\n    } as Partial<Workflow>,\n    body: [],\n    children: [],\n  }));\n\n  openDetailView(mailAddress: string) {\n    const cardItem = this.getCardDataByMailAddress(mailAddress);\n    if (cardItem && this.cardDataView) {\n      this.dataView.toggleView();\n      // First reset all selections\n      this.cardData.forEach((item) => {\n        item.selected = false;\n        if (item.children) {\n          item.children.forEach((child) => (child.selected = false));\n        }\n      });\n\n      // Set the selected item\n      cardItem.selected = true;\n      this.currentData = this.cardDataView.onItemClick(cardItem);\n\n      // Force change detection if needed\n      // this.changeDetectorRef.detectChanges();\n    }\n  }\n\n  getCardDataByMailAddress(mailAddress: string): CardData | undefined {\n    return this.cardData.find(({ data }) => data.MailAddress === mailAddress);\n  }\n\n  onViewChange(isGridView: boolean): void {\n    this.isGridView = isGridView;\n    // Reset selection when switching views\n    if (this.currentData) {\n      this.cardDataView?.clearData();\n      this.currentData = null;\n    }\n\n    if (this.selected) {\n      this.cardDataView.onItemClick(this.selected);\n    }\n  }\n\n  openFormView(index: number) {\n    const item = this.cardData[index];\n  }\n\n  handleExport(exportedData: Partial<any>[]) {\n    this.downloadCSV(exportedData);\n  }\n\n  handleClick(item: any) {\n    this.itemClicked.emit(item.data);\n  }\n  handleConfig(item: any) {\n    this.itemClicked.emit(item);\n  }\n\n  /**\n   *\n   * @param data Simple csv export for testing\n   */\n  private downloadCSV(data: Partial<any>[]) {\n    const headers = Object.keys(data[0]);\n    const csvContent = [\n      headers.join(','),\n      ...data.map((row) => headers.map((header) => row[header]).join(',')),\n    ].join('\\n');\n\n    const blob = new Blob([csvContent], { type: 'text/csv;charset=utf-8;' });\n    const link = document.createElement('a');\n    if (link.download !== undefined) {\n      const url = URL.createObjectURL(blob);\n      link.setAttribute('href', url);\n      link.setAttribute('download', 'export.csv');\n      link.style.visibility = 'hidden';\n      document.body.appendChild(link);\n      link.click();\n      document.body.removeChild(link);\n    }\n  }\n\n  onSelectionChange(selectedRows: Workflow[]) {\n    console.log('Selection changed:', selectedRows);\n    // Handle the selection change\n  }\n\n  /**\n   * Copied over from card view doc until I understand usage\n   */\n  selectedColumnCount: number = 0;\n  selectedFilterTableCount: number = 0;\n  isOPen: boolean = true;\n  selectedSortCount: number = 0;\n  showColumn: boolean = false;\n  showSort: boolean = false;\n  selectedAll: boolean = false;\n  nestedbgcolor: string = '';\n\n  visibleColumns: IDataFilter[] = columns.map((col) => ({\n    checked: true,\n    name: typeof col.header === 'string' ? col.header : col.id,\n    type: DataFilterType.Bool,\n  }));\n  filterArray: IDataFilter[] = [\n    {\n      name: 'Name',\n      type: DataFilterType.String,\n      checked: false,\n    },\n    {\n      name: 'MailAddress',\n      type: DataFilterType.String,\n      checked: false,\n    },\n    {\n      name: 'PhoneNumber',\n      type: DataFilterType.String,\n      checked: false,\n    },\n    {\n      name: 'CreatedAt',\n      type: DataFilterType.Date,\n      checked: false,\n    },\n  ];\n\n  sortOptions: IDataFilter[] = [\n    {\n      name: 'Name',\n      type: DataFilterType.String,\n      checked: false,\n    },\n    {\n      name: 'MailAddress',\n      type: DataFilterType.String,\n      checked: false,\n    },\n    {\n      name: 'PhoneNumber',\n      type: DataFilterType.String,\n      checked: false,\n    },\n    {\n      name: 'CreatedAt',\n      type: DataFilterType.Date,\n      checked: false,\n    },\n  ];\n  clearData() {\n    this.currentData = {} as CardData;\n  }\n  loadMore() {\n    this.cardData = this.cardData.concat(this.cardData);\n  }\n  onColumnChange(event: boolean) {\n    this.showColumn = event;\n  }\n  onSortChange(event: boolean) {\n    this.showSort = event;\n    console.log(event);\n  }\n  onColumnsUpdated(updatedColumns: IDataFilter[]) {\n    console.log(updatedColumns);\n    this.onColumnChange(false);\n    this.selectedColumnCount = updatedColumns.length;\n  }\n  onSortUpdated(updatedSorts: IDataFilter[]) {\n    this.onSortChange(false);\n    this.selectedSortCount = updatedSorts.length;\n    console.log(updatedSorts);\n  }\n  onStateChange(event: { key: string; value: boolean }): void {\n    console.log(`State changed for ${event.key}:`, event.value);\n  }\n  getRowStatus(type: string) {\n    console.log('data is here', type);\n\n    switch (type) {\n      // case WorkflowStatus.Pending:\n      //   return 'bg-[#FEF2E5] text-[var(--vbn-color-warning)]';\n      case Status.Active:\n        return 'bg-[var(--vbn-color-success-bg)] text-[var(--vbn-color-success)]';\n      case Status.InActive:\n        return 'bg-[#FBE7E8] text-[var(--vbn-color-error)]';\n      default:\n        return '';\n    }\n  }\n}\n","<div class=\"space-y-8\">\n    <verben-data-view\n      #vdv\n      [viewState]=\"{\n        isSearch: true,\n        isColumn: true,\n        isFilter: true,\n        isSort: true,\n        isExport: true,\n        isSelect: true,\n        isCreate: true,\n        isToggle:true\n      }\"\n      [buttonClass]=\"'my-custom-button-class'\"\n      [iconClass]=\"'my-icon-class'\"\n      [tableIcon]=\"'table-view'\"\n      [cardIcon]=\"'list-view'\"\n      [activeIconClass]=\"'my-active-icon-class'\"\n      [selectedColumnCount]=\"0\"\n      [selectedSortCount]=\"0\"\n      [selectedFilterTableCount]=\"0\"\n      (viewChange)=\"onViewChange($event)\"\n      (stateChange)=\"onStateChange($event)\"\n    >\n      <div table-content>\n        <lib-data-table\n          [data]=\"data\"\n          [columns]=\"columns\"\n          [styleConfig]=\"styles\"\n          (selectionChange)=\"onSelectionChange($event)\"\n        >\n        <ng-container libColumn=\"select\">\n          <ng-template\n            #cell\n            let-value\n            let-isSelected=\"isSelected\"\n            let-toggleRowSelection=\"toggleRowSelection\"\n          >\n            <input\n              type=\"checkbox\"\n              [checked]=\"isSelected\"\n              class=\"cursor-pointer\"\n            />\n          </ng-template>\n          <ng-template\n          #header\n          let-allRowsSelected=\"allRowsSelected\"\n          let-someRowsSelected=\"someRowsSelected\"\n          let-toggleAllRows=\"toggleAllRows\"\n        >\n          <input\n            type=\"checkbox\"\n            [checked]=\"allRowsSelected()\"\n            [indeterminate]=\"someRowsSelected()\"\n            (change)=\"toggleAllRows()\"\n          />\n        </ng-template>\n        </ng-container>\n          <ng-container libColumn=\"status\">\n            <ng-template #cell let-value>\n              <div [class]=\"getRowStatus(value)\" class=\"rounded-[22px] flex items-center justify-center w-[84px] h-[31px] font-medium text-xs leading-[14.63px]\"> \n                {{value}}\n              </div>\n            </ng-template>\n          </ng-container>\n          <ng-container libColumn=\"action\">\n            <ng-template \n            #cell let-value \n            let-row=\"row\">\n            <div class=\"flex items-center gap-4\">\n              <span class=\"cursor-pointer\">\n                <verben-svg\n                  icon=\"edit\"\n                  [width]=\"15\"\n                  [height]=\"15\"\n                ></verben-svg>\n              </span>\n              <span class=\"cursor-pointer\">\n                <verben-svg\n                  icon=\"delete\"\n                  [width]=\"15\"\n                  [height]=\"15\"\n                ></verben-svg>\n              </span>\n              <span class=\"cursor-pointer\">\n                <verben-svg\n                  icon=\"draw\"\n                  [width]=\"18\"\n                  [height]=\"18\"\n                ></verben-svg>\n              </span>\n            </div>\n            </ng-template>\n          </ng-container>\n        </lib-data-table>\n      </div>\n      <div card-content>\n        <verben-card-data-view\n          borderRadius=\"12px\"\n          (loadMoreClick)=\"loadMore()\"\n          #vdcv\n          dataId=\"MailAddress\"\n          border=\"5px\"\n          [cardDataList]=\"cardData\"\n          rbgColor=\"var(--vbn-color-surface-alt)\"\n          mg=\"0px\"\n        >\n          <verben-left-card-data-view class=\"\">\n            <verben-left-card-data\n              #vlcd\n              [parent]=\"vdcv\"\n              dataId=\"MailAddress\"\n              class=\"bg-secondary-100 rounded-xl border-primary border-[1px]\"\n              [cardDataList]=\"cardData\"\n            >\n              <ng-template #card let-item>\n                <div class=\"flex h-[88px]\">\n                  <div\n                    class=\"flex  w-full bg-secondary rounded-xl\"\n                  >\n                    <div\n                      class=\"w-3 rounded-xl rounded-tr-none rounded-br-none\"\n                      [ngClass]=\"\n                        item.selected ? 'bg-primary' : 'bg-secondary-200'\n                      \"\n                    ></div>\n                    <div class=\"py-3 px-4 w-full h-[100%]\">\n                      <div class=\"flex items-start justify-between h-[100%]\">\n                        <div class=\"flex flex-col justify-between h-[100%]\">\n                          <h3 class=\"my-0 font-semibold text-[var(--vbn-color-on-primary)] leading-[19.5px]\">{{\n                            item.title\n                          }}</h3>\n                          <p class=\"flex items-center\">\n                            <label  class=\"!text-[10px] font-light text-[var(--vbn-color-on-primary)] leading-[12.1px]\"\n                              >Config count:</label\n                            >\n                            <span class=\"text-[13px] leading-[15.85px] font-medium ml-1 text-black\">{{\n                              item.data.Count\n                            }}</span>\n                          </p>\n                        </div>\n  \n                        <div class=\"flex items-end h-[100%]\">\n                            <p\n                            (click)=\"handleClick(item)\" \n                            class=\"my-0 underline text-[var(--vbn-color-border-focus)] text-[11px] leading-[16.6px] cursor-pointer font-medium\"\n                            >View configs</p>\n                        </div>\n                      </div>\n                    </div>\n                  </div>\n                </div>\n              </ng-template>\n            </verben-left-card-data>\n          </verben-left-card-data-view>\n          <!-- <verben-right-card-data-view> \n            yeshhhhhh\n          </verben-right-card-data-view> -->\n  \n          <verben-card-data-view-footer class=\"float-right\">\n            <div class=\"flex gap-2\">\n              <span class=\"paginator-text\"\n                >{{ cardData.length }} records loaded</span\n              >\n              <button (click)=\"loadMore()\" class=\"load-more\">Load more</button>\n            </div>\n          </verben-card-data-view-footer>\n        </verben-card-data-view>\n      </div>\n      <div column-content>\n        <verben-visible-column\n          (columnsUpdated)=\"onColumnsUpdated($event)\"\n          [border]=\"'1px solid var(--vbn-color-primary)'\"\n          borderRadius=\"10px\"\n          boxShadow=\"2px 2px 2px 0px silver\"\n          bgColor=\"white\"\n          width=\"400px\"\n          textColor=\"black\"\n          pd=\"1rem\"\n          primaryColor=\"var(--vbn-color-primary)\"\n          secondaryColor=\"var(--vbn-color-border-focus)\"\n          [columns]=\"visibleColumns\"\n          [displayedColumns]=\"5\"\n        ></verben-visible-column>\n      </div>\n      <div filter-content>\n        <verben-table-filter\n          [border]=\"'1px solid var(--vbn-color-primary)'\"\n          borderRadius=\"10px\"\n          boxShadow=\"2px 2px 2px 0px silver\"\n          bgColor=\"white\"\n          width=\"420px\"\n          textColor=\"black\"\n          pd=\"1rem\"\n          primaryColor=\"var(--vbn-color-primary)\"\n          secondaryColor=\"var(--vbn-color-border-focus)\"\n          tertiaryColor=\"var(--vbn-color-on-primary)\"\n          [filterOptions]=\"filterArray\"\n          [maxFilterLength]=\"3\"\n        ></verben-table-filter>\n      </div>\n      <div sort-content>\n        <verben-sort-table\n          (selectedOptions)=\"onSortUpdated($event)\"\n          [border]=\"'1px solid var(--vbn-color-primary)'\"\n          borderRadius=\"10px\"\n          boxShadow=\"2px 2px 2px 0px silver\"\n          bgColor=\"white\"\n          width=\"400px\"\n          textColor=\"black\"\n          pd=\"1rem\"\n          primaryColor=\"var(--vbn-color-primary)\"\n          secondaryColor=\"var(--vbn-color-border-focus)\"\n          tertiaryColor=\"var(--vbn-color-on-primary)\"\n          [enableDragAndDrop]=\"true\"\n          [sortOptions]=\"sortOptions\"\n        ></verben-sort-table>\n      </div>\n      <div export-content>\n        <lib-data-export [data]=\"data\" (exportDataEvent)=\"handleExport($event)\">\n        </lib-data-export>\n      </div>\n    </verben-data-view>\n  </div>\n  \n  ","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { WorkflowComponent } from './workflow.component';\nimport { SharedModule } from 'verben-workflow-ui/src/lib/shared';\n\n@NgModule({\n  declarations: [WorkflowComponent],\n  imports: [CommonModule, SharedModule],\n  exports: [WorkflowComponent],\n})\nexport class WorkflowModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}