verben-authentication-ui 1.0.35 → 1.0.37

package/esm2022/src/lib/components/sso/sso-form/sso-form.component.mjs

@@ -61,14 +61,14 @@ export class SsoFormComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SsoFormComponent, deps: [{ token: i1.FormBuilder }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: SsoFormComponent, selector: "lib-sso-form", inputs: { currentData: "currentData" }, outputs: { switchView: "switchView" }, ngImport: i0, template: "<form\n  [formGroup]=\"form\"\n  class=\"flex flex-col px-3 pb-3 rounded-xl h-full w-full relative\"\n>\n  <verbena-input\n    name=\"Name\"\n    label=\"Name:\"\n    formControlName=\"Name\"\n    [(ngModel)]=\"currentData?.data.Name\"\n  />\n  <verbena-input\n    label=\"Description:\"\n    name=\"Description\"\n    formControlName=\"Description\"\n    [(ngModel)]=\"currentData?.data.Description\"\n  />\n  <verbena-input\n  label=\"Link:\"\n  name=\"Link\"\n  formControlName=\"Link\"\n  [(ngModel)]=\"currentData?.data.Link\"\n/>\n<span class=\"block my-2 \">Logo</span>\n<label [style.background-color]=\"'#f9f9f9'\" class=\"border cursor-pointer border-secondary-200 rounded-md w-full px-4 py-2 flex justify-between\">\n  <span *ngIf=\"!uploadedFileName\">{{isUploading?\"uploading...\":\"Upload a photo\"}}</span>\n  <span *ngIf=\"fileUploadError\" class=\"error\">{{ fileUploadError }}</span>\n  <div *ngIf=\"uploadedFileName\" class=\"flex items-center text-sm gap-2 border border-primary rounded-lg px-3 \">\n    <span>{{ uploadedFileName }}</span>\n    <button\n      [style.color]=\"'black'\"\n      type=\"button\"\n      (click)=\"removeFile()\"\n    >\n      &#x2715;\n    </button>\n  </div>\n  <input\n  id=\"logo\"\n[type]=\"'file'\"\n  label=\"Logo:\"\n  name=\"Logo\"\n  accept=\"image/png\"\n  formControlName=\"Logo\"\n  (change)=\"onFileSelected($event)\"\n  formControlName=\"Logo\"\n/>\n<span class=\"flex gap-2\">\n<span class=\"bg-primary flex icon-container rounded-md justify-center items-center\">\n  <img src=\"./assets/icons/cam.png\" class=\"icon-width\"/>\n</span>\n<span  class=\"bg-primary flex icon-container rounded-md justify-center items-center\">\n  <img src=\"./assets/icons/file.png\" class=\"icon-width2\"/>\n</span>\n</span>\n</label>\n\n  <!-- buttons -->\n  <div\n    class=\"flex justify-between bottom-8 left-0 right-0 px-3 pb-2 absolute\"\n    style=\"\n      display: flex;\n      justify-content: space-between;\n      position: absolute;\n      padding: 8px 12px;\n      right: 0;\n      left: 0;\n      bottom: 32;\n    \"\n  >\n    <!-- <verbena-button\n      text=\"Delete\"\n      class=\"bg-secondary-200 text-[black]\"\n      (click)=\"onDelete()\"\n    />\n    <verbena-button\n      text=\"Save\"\n      class=\"bg-primary text-[black]\"\n      (click)=\"onSave()\"\n    />\n\n    <verbena-button\n      text=\"Secondary Button\"\n      styleType=\"secondary\"\n    ></verbena-button> -->\n    <verbena-button\n      width=\"114px\"\n      height=\"39px\"\n      text=\"Delete\"\n      [bgColor]=\"'#999999'\"\n      [textColor]=\"'#404040'\"\n      borderRadius=\"10px\"\n    ></verbena-button>\n    <verbena-button\n      (click)=\"switchView.emit()\"\n      text=\"Switch To Table\"\n      styleType=\"ylw-outline\"\n    ></verbena-button>\n    <verbena-button\n      text=\"Save\"\n      bgColor=\"#28a745\"\n      textColor=\"#404040\"\n      borderRadius=\"10px\"\n      pd=\"10px 20px\"\n      [bgColor]=\"'#FFE681'\"\n      width=\"114px\"\n      height=\"39px\"\n    ></verbena-button>\n  </div>\n</form>\n", styles: ["#logo{display:none}.icon-width{width:20px}.icon-width2{width:15px}.icon-container{width:30px;height:30px}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i3.VerbenaButtonComponent, selector: "verbena-button", inputs: ["text", "icon", "useIcon", "svgPosition", "iconPosition", "bgColor", "textColor", "border", "borderRadius", "pd", "width", "height", "fontSize", "fontWeight", "disable", "svgSize", "weight", "variant", "styleType", "svg", "svgWidth", "svgHeight", "iconColor", "svgColor", "buttonClass", "buttonTextClass", "isLoading", "spinnerSize", "spinnerColor"] }, { kind: "component", type: i3.VerbenaInputComponent, selector: "verbena-input", inputs: ["label", "placeHolder", "required", "svgPosition", "minLength", "maxLength", "type", "bgColor", "border", "borderRadius", "textColor", "value", "labelPosition", "labelColor", "disable", "readOnly", "min", "max", "showBorder", "showErrorMessage", "errorMessageColor", "errorBorderColor", "errorPosition", "svg", "fontSize", "svgWidth", "svgHeight", "svgColor", "capitalization", "inputContainerClass", "inputFieldClass", "passLength", "inputWrapperClass", "passwordToggle", "customErrorMessages", "icon", "textPass"], outputs: ["valueChange"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: SsoFormComponent, selector: "lib-sso-form", inputs: { currentData: "currentData" }, outputs: { switchView: "switchView" }, ngImport: i0, template: "<form\n  [formGroup]=\"form\"\n  *ngIf=\"currentData\"\n  class=\"flex flex-col px-3 pb-3 rounded-xl h-full w-full relative\"\n>\n  <verbena-input\n    name=\"Name\"\n    label=\"Name:\"\n    formControlName=\"Name\"\n    [(ngModel)]=\"currentData.data.Name\"\n  />\n  <verbena-input\n    label=\"Description:\"\n    name=\"Description\"\n    formControlName=\"Description\"\n    [(ngModel)]=\"currentData.data.Description\"\n  />\n  <verbena-input\n    label=\"Link:\"\n    name=\"Link\"\n    formControlName=\"Link\"\n    [(ngModel)]=\"currentData.data.Link\"\n  />\n  <span class=\"block my-2\">Logo</span>\n  <label\n    [style.background-color]=\"'#f9f9f9'\"\n    class=\"border cursor-pointer border-secondary-200 rounded-md w-full px-4 py-2 flex justify-between\"\n  >\n    <span *ngIf=\"!uploadedFileName\">{{\n      isUploading ? \"uploading...\" : \"Upload a photo\"\n    }}</span>\n    <span *ngIf=\"fileUploadError\" class=\"error\">{{ fileUploadError }}</span>\n    <div\n      *ngIf=\"uploadedFileName\"\n      class=\"flex items-center text-sm gap-2 border border-primary rounded-lg px-3\"\n    >\n      <span>{{ uploadedFileName }}</span>\n      <button [style.color]=\"'black'\" type=\"button\" (click)=\"removeFile()\">\n        &#x2715;\n      </button>\n    </div>\n    <input\n      id=\"logo\"\n      [type]=\"'file'\"\n      label=\"Logo:\"\n      name=\"Logo\"\n      accept=\"image/png\"\n      formControlName=\"Logo\"\n      (change)=\"onFileSelected($event)\"\n      formControlName=\"Logo\"\n    />\n    <span class=\"flex gap-2\">\n      <span\n        class=\"bg-primary flex icon-container rounded-md justify-center items-center\"\n      >\n        <img src=\"./assets/icons/cam.png\" class=\"icon-width\" />\n      </span>\n      <span\n        class=\"bg-primary flex icon-container rounded-md justify-center items-center\"\n      >\n        <img src=\"./assets/icons/file.png\" class=\"icon-width2\" />\n      </span>\n    </span>\n  </label>\n\n  <!-- buttons -->\n  <div\n    class=\"flex justify-between bottom-8 left-0 right-0 px-3 pb-2 absolute\"\n    style=\"\n      display: flex;\n      justify-content: space-between;\n      position: absolute;\n      padding: 8px 12px;\n      right: 0;\n      left: 0;\n      bottom: 32;\n    \"\n  >\n    <!-- <verbena-button\n      text=\"Delete\"\n      class=\"bg-secondary-200 text-[black]\"\n      (click)=\"onDelete()\"\n    />\n    <verbena-button\n      text=\"Save\"\n      class=\"bg-primary text-[black]\"\n      (click)=\"onSave()\"\n    />\n\n    <verbena-button\n      text=\"Secondary Button\"\n      styleType=\"secondary\"\n    ></verbena-button> -->\n    <verbena-button\n      width=\"114px\"\n      height=\"39px\"\n      text=\"Delete\"\n      [bgColor]=\"'#999999'\"\n      [textColor]=\"'#404040'\"\n      borderRadius=\"10px\"\n    ></verbena-button>\n    <verbena-button\n      (click)=\"switchView.emit()\"\n      text=\"Switch To Table\"\n      styleType=\"ylw-outline\"\n    ></verbena-button>\n    <verbena-button\n      text=\"Save\"\n      bgColor=\"#28a745\"\n      textColor=\"#404040\"\n      borderRadius=\"10px\"\n      pd=\"10px 20px\"\n      [bgColor]=\"'#FFE681'\"\n      width=\"114px\"\n      height=\"39px\"\n    ></verbena-button>\n  </div>\n</form>\n", styles: ["#logo{display:none}.icon-width{width:20px}.icon-width2{width:15px}.icon-container{width:30px;height:30px}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i3.VerbenaButtonComponent, selector: "verbena-button", inputs: ["type", "text", "icon", "useIcon", "svgPosition", "iconPosition", "bgColor", "textColor", "border", "borderRadius", "pd", "width", "height", "fontSize", "fontWeight", "disable", "svgSize", "weight", "variant", "styleType", "svg", "svgWidth", "svgHeight", "iconColor", "svgColor", "buttonClass", "buttonTextClass", "isLoading", "spinnerSize", "spinnerColor"] }, { kind: "component", type: i3.VerbenaInputComponent, selector: "verbena-input", inputs: ["disabled", "label", "placeHolder", "required", "svgPosition", "minLength", "maxLength", "type", "bgColor", "border", "borderRadius", "textColor", "value", "labelPosition", "labelColor", "disable", "readOnly", "min", "max", "showBorder", "showErrorMessage", "errorMessageColor", "errorBorderColor", "errorPosition", "svg", "fontSize", "svgWidth", "svgHeight", "svgColor", "capitalization", "inputContainerClass", "inputFieldClass", "passLength", "inputWrapperClass", "passwordToggle", "customErrorMessages", "icon", "textPass"], outputs: ["valueChange"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SsoFormComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'lib-sso-form', template: "<form\n  [formGroup]=\"form\"\n  class=\"flex flex-col px-3 pb-3 rounded-xl h-full w-full relative\"\n>\n  <verbena-input\n    name=\"Name\"\n    label=\"Name:\"\n    formControlName=\"Name\"\n    [(ngModel)]=\"currentData?.data.Name\"\n  />\n  <verbena-input\n    label=\"Description:\"\n    name=\"Description\"\n    formControlName=\"Description\"\n    [(ngModel)]=\"currentData?.data.Description\"\n  />\n  <verbena-input\n  label=\"Link:\"\n  name=\"Link\"\n  formControlName=\"Link\"\n  [(ngModel)]=\"currentData?.data.Link\"\n/>\n<span class=\"block my-2 \">Logo</span>\n<label [style.background-color]=\"'#f9f9f9'\" class=\"border cursor-pointer border-secondary-200 rounded-md w-full px-4 py-2 flex justify-between\">\n  <span *ngIf=\"!uploadedFileName\">{{isUploading?\"uploading...\":\"Upload a photo\"}}</span>\n  <span *ngIf=\"fileUploadError\" class=\"error\">{{ fileUploadError }}</span>\n  <div *ngIf=\"uploadedFileName\" class=\"flex items-center text-sm gap-2 border border-primary rounded-lg px-3 \">\n    <span>{{ uploadedFileName }}</span>\n    <button\n      [style.color]=\"'black'\"\n      type=\"button\"\n      (click)=\"removeFile()\"\n    >\n      &#x2715;\n    </button>\n  </div>\n  <input\n  id=\"logo\"\n[type]=\"'file'\"\n  label=\"Logo:\"\n  name=\"Logo\"\n  accept=\"image/png\"\n  formControlName=\"Logo\"\n  (change)=\"onFileSelected($event)\"\n  formControlName=\"Logo\"\n/>\n<span class=\"flex gap-2\">\n<span class=\"bg-primary flex icon-container rounded-md justify-center items-center\">\n  <img src=\"./assets/icons/cam.png\" class=\"icon-width\"/>\n</span>\n<span  class=\"bg-primary flex icon-container rounded-md justify-center items-center\">\n  <img src=\"./assets/icons/file.png\" class=\"icon-width2\"/>\n</span>\n</span>\n</label>\n\n  <!-- buttons -->\n  <div\n    class=\"flex justify-between bottom-8 left-0 right-0 px-3 pb-2 absolute\"\n    style=\"\n      display: flex;\n      justify-content: space-between;\n      position: absolute;\n      padding: 8px 12px;\n      right: 0;\n      left: 0;\n      bottom: 32;\n    \"\n  >\n    <!-- <verbena-button\n      text=\"Delete\"\n      class=\"bg-secondary-200 text-[black]\"\n      (click)=\"onDelete()\"\n    />\n    <verbena-button\n      text=\"Save\"\n      class=\"bg-primary text-[black]\"\n      (click)=\"onSave()\"\n    />\n\n    <verbena-button\n      text=\"Secondary Button\"\n      styleType=\"secondary\"\n    ></verbena-button> -->\n    <verbena-button\n      width=\"114px\"\n      height=\"39px\"\n      text=\"Delete\"\n      [bgColor]=\"'#999999'\"\n      [textColor]=\"'#404040'\"\n      borderRadius=\"10px\"\n    ></verbena-button>\n    <verbena-button\n      (click)=\"switchView.emit()\"\n      text=\"Switch To Table\"\n      styleType=\"ylw-outline\"\n    ></verbena-button>\n    <verbena-button\n      text=\"Save\"\n      bgColor=\"#28a745\"\n      textColor=\"#404040\"\n      borderRadius=\"10px\"\n      pd=\"10px 20px\"\n      [bgColor]=\"'#FFE681'\"\n      width=\"114px\"\n      height=\"39px\"\n    ></verbena-button>\n  </div>\n</form>\n", styles: ["#logo{display:none}.icon-width{width:20px}.icon-width2{width:15px}.icon-container{width:30px;height:30px}\n"] }]
+            args: [{ selector: 'lib-sso-form', template: "<form\n  [formGroup]=\"form\"\n  *ngIf=\"currentData\"\n  class=\"flex flex-col px-3 pb-3 rounded-xl h-full w-full relative\"\n>\n  <verbena-input\n    name=\"Name\"\n    label=\"Name:\"\n    formControlName=\"Name\"\n    [(ngModel)]=\"currentData.data.Name\"\n  />\n  <verbena-input\n    label=\"Description:\"\n    name=\"Description\"\n    formControlName=\"Description\"\n    [(ngModel)]=\"currentData.data.Description\"\n  />\n  <verbena-input\n    label=\"Link:\"\n    name=\"Link\"\n    formControlName=\"Link\"\n    [(ngModel)]=\"currentData.data.Link\"\n  />\n  <span class=\"block my-2\">Logo</span>\n  <label\n    [style.background-color]=\"'#f9f9f9'\"\n    class=\"border cursor-pointer border-secondary-200 rounded-md w-full px-4 py-2 flex justify-between\"\n  >\n    <span *ngIf=\"!uploadedFileName\">{{\n      isUploading ? \"uploading...\" : \"Upload a photo\"\n    }}</span>\n    <span *ngIf=\"fileUploadError\" class=\"error\">{{ fileUploadError }}</span>\n    <div\n      *ngIf=\"uploadedFileName\"\n      class=\"flex items-center text-sm gap-2 border border-primary rounded-lg px-3\"\n    >\n      <span>{{ uploadedFileName }}</span>\n      <button [style.color]=\"'black'\" type=\"button\" (click)=\"removeFile()\">\n        &#x2715;\n      </button>\n    </div>\n    <input\n      id=\"logo\"\n      [type]=\"'file'\"\n      label=\"Logo:\"\n      name=\"Logo\"\n      accept=\"image/png\"\n      formControlName=\"Logo\"\n      (change)=\"onFileSelected($event)\"\n      formControlName=\"Logo\"\n    />\n    <span class=\"flex gap-2\">\n      <span\n        class=\"bg-primary flex icon-container rounded-md justify-center items-center\"\n      >\n        <img src=\"./assets/icons/cam.png\" class=\"icon-width\" />\n      </span>\n      <span\n        class=\"bg-primary flex icon-container rounded-md justify-center items-center\"\n      >\n        <img src=\"./assets/icons/file.png\" class=\"icon-width2\" />\n      </span>\n    </span>\n  </label>\n\n  <!-- buttons -->\n  <div\n    class=\"flex justify-between bottom-8 left-0 right-0 px-3 pb-2 absolute\"\n    style=\"\n      display: flex;\n      justify-content: space-between;\n      position: absolute;\n      padding: 8px 12px;\n      right: 0;\n      left: 0;\n      bottom: 32;\n    \"\n  >\n    <!-- <verbena-button\n      text=\"Delete\"\n      class=\"bg-secondary-200 text-[black]\"\n      (click)=\"onDelete()\"\n    />\n    <verbena-button\n      text=\"Save\"\n      class=\"bg-primary text-[black]\"\n      (click)=\"onSave()\"\n    />\n\n    <verbena-button\n      text=\"Secondary Button\"\n      styleType=\"secondary\"\n    ></verbena-button> -->\n    <verbena-button\n      width=\"114px\"\n      height=\"39px\"\n      text=\"Delete\"\n      [bgColor]=\"'#999999'\"\n      [textColor]=\"'#404040'\"\n      borderRadius=\"10px\"\n    ></verbena-button>\n    <verbena-button\n      (click)=\"switchView.emit()\"\n      text=\"Switch To Table\"\n      styleType=\"ylw-outline\"\n    ></verbena-button>\n    <verbena-button\n      text=\"Save\"\n      bgColor=\"#28a745\"\n      textColor=\"#404040\"\n      borderRadius=\"10px\"\n      pd=\"10px 20px\"\n      [bgColor]=\"'#FFE681'\"\n      width=\"114px\"\n      height=\"39px\"\n    ></verbena-button>\n  </div>\n</form>\n", styles: ["#logo{display:none}.icon-width{width:20px}.icon-width2{width:15px}.icon-container{width:30px;height:30px}\n"] }]
         }], ctorParameters: () => [{ type: i1.FormBuilder }], propDecorators: { currentData: [{
                 type: Input
             }], switchView: [{
                 type: Output
             }] } });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3NvLWZvcm0uY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvdmVyYmVuLWF1dGhlbnRpY2F0aW9uLXVpL3NyYy9saWIvY29tcG9uZW50cy9zc28vc3NvLWZvcm0vc3NvLWZvcm0uY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvdmVyYmVuLWF1dGhlbnRpY2F0aW9uLXVpL3NyYy9saWIvY29tcG9uZW50cy9zc28vc3NvLWZvcm0vc3NvLWZvcm0uY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBYyxZQUFZLEVBQUUsS0FBSyxFQUFFLE1BQU0sRUFBYSxNQUFNLGVBQWUsQ0FBQzs7Ozs7QUFVOUYsTUFBTSxPQUFPLGdCQUFnQjtJQVNQO0lBUnBCLFdBQVcsR0FBWSxLQUFLLENBQUM7SUFDN0IsZ0JBQWdCLEdBQWtCLElBQUksQ0FBQztJQUN2QyxlQUFlLEdBQWtCLElBQUksQ0FBQztJQUM3QixXQUFXLEdBQWUsSUFBSSxDQUFBO0lBQzdCLFVBQVUsR0FBRyxJQUFJLFlBQVksRUFBYSxDQUFDO0lBRXJELElBQUksQ0FBWTtJQUVoQixZQUFvQixFQUFlO1FBQWYsT0FBRSxHQUFGLEVBQUUsQ0FBYTtRQUNqQyxJQUFJLENBQUMsSUFBSSxHQUFHLElBQUksQ0FBQyxFQUFFLENBQUMsS0FBSyxDQUFDO1lBQ3hCLFdBQVcsRUFBRSxDQUFDLEVBQUUsQ0FBQztZQUNqQixJQUFJLEVBQUUsQ0FBQyxFQUFFLENBQUM7WUFDVixJQUFJLEVBQUUsQ0FBQyxFQUFFLENBQUM7WUFDVixJQUFJLEVBQUUsQ0FBQyxFQUFFLENBQUM7U0FDWCxDQUFDLENBQUM7SUFDTCxDQUFDO0lBRUQsUUFBUSxLQUFVLENBQUM7SUFFbkIsTUFBTTtRQUNKLElBQUksSUFBSSxDQUFDLElBQUksQ0FBQyxLQUFLLEVBQUUsQ0FBQztZQUNwQixrQ0FBa0M7WUFDbEMsT0FBTyxDQUFDLEdBQUcsQ0FBQyxhQUFhLEVBQUUsSUFBSSxDQUFDLElBQUksQ0FBQyxLQUFLLENBQUMsQ0FBQztRQUM5QyxDQUFDO0lBQ0gsQ0FBQztJQUNELFFBQVE7UUFDTixvQkFBb0I7UUFDcEIsT0FBTyxDQUFDLEdBQUcsQ0FBQyxrQkFBa0IsQ0FBQyxDQUFDO0lBQ2xDLENBQUM7SUFDRCxjQUFjLENBQUMsS0FBWTtRQUN6QixNQUFNLEtBQUssR0FBRyxLQUFLLENBQUMsTUFBMEIsQ0FBQztRQUMvQyxJQUFJLEtBQUssQ0FBQyxLQUFLLElBQUksS0FBSyxDQUFDLEtBQUssQ0FBQyxNQUFNLEdBQUcsQ0FBQyxFQUFFLENBQUM7WUFDMUMsTUFBTSxJQUFJLEdBQUcsS0FBSyxDQUFDLEtBQUssQ0FBQyxDQUFDLENBQUMsQ0FBQztZQUM1QixJQUFJLENBQUMsZUFBZSxHQUFHLElBQUksQ0FBQztZQUM1QixJQUFJLENBQUMsSUFBSSxFQUFFLENBQUM7Z0JBQ1YsSUFBSSxDQUFDLFdBQVcsR0FBRyxJQUFJLENBQUM7WUFDMUIsQ0FBQztZQUNELElBQUksSUFBSSxDQUFDLElBQUksR0FBRyxPQUFPLEVBQUUsQ0FBQztnQkFDeEIsSUFBSSxDQUFDLGVBQWUsR0FBRyw4QkFBOEIsQ0FBQztnQkFDdEQsSUFBSSxDQUFDLGdCQUFnQixHQUFHLElBQUksQ0FBQztnQkFDN0IsSUFBSSxDQUFDLFdBQVcsR0FBRyxLQUFLLENBQUMsQ0FBQywwQkFBMEI7WUFDdEQsQ0FBQztpQkFBTSxDQUFDO2dCQUNOLElBQUksQ0FBQyxnQkFBZ0IsR0FBRyxJQUFJLENBQUMsSUFBSSxDQUFDO1lBQ3BDLENBQUM7UUFDSCxDQUFDO2FBQU0sQ0FBQztZQUNOLElBQUksQ0FBQyxXQUFXLEdBQUcsS0FBSyxDQUFDO1FBQzNCLENBQUM7SUFDSCxDQUFDO0lBRUQsVUFBVTtRQUNSLElBQUksQ0FBQyxnQkFBZ0IsR0FBRyxJQUFJLENBQUM7UUFDN0IsSUFBSSxDQUFDLGVBQWUsR0FBRyxJQUFJLENBQUM7UUFDNUIsTUFBTSxTQUFTLEdBQUcsUUFBUSxDQUFDLGNBQWMsQ0FBQyxZQUFZLENBQXFCLENBQUM7UUFDNUUsSUFBSSxTQUFTLEVBQUUsQ0FBQztZQUNkLFNBQVMsQ0FBQyxLQUFLLEdBQUcsRUFBRSxDQUFDO1FBQ3ZCLENBQUM7SUFDSCxDQUFDO3dHQXpEVSxnQkFBZ0I7NEZBQWhCLGdCQUFnQixtSUNWN0Isd2dHQTZHQTs7NEZEbkdhLGdCQUFnQjtrQkFMNUIsU0FBUzsrQkFDRSxjQUFjO2dGQVFmLFdBQVc7c0JBQW5CLEtBQUs7Z0JBQ0ksVUFBVTtzQkFBbkIsTUFBTSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgRWxlbWVudFJlZiwgRXZlbnRFbWl0dGVyLCBJbnB1dCwgT3V0cHV0LCBWaWV3Q2hpbGQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IEZvcm1CdWlsZGVyLCBGb3JtR3JvdXAgfSBmcm9tICdAYW5ndWxhci9mb3Jtcyc7XG5pbXBvcnQgeyBDYXJkRGF0YSB9IGZyb20gJ3ZlcmJlbi1uZy11aSc7XG5cblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnbGliLXNzby1mb3JtJyxcbiAgdGVtcGxhdGVVcmw6ICcuL3Nzby1mb3JtLmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmw6ICcuL3Nzby1mb3JtLmNvbXBvbmVudC5jc3MnLFxufSlcbmV4cG9ydCBjbGFzcyBTc29Gb3JtQ29tcG9uZW50IHtcbiAgaXNVcGxvYWRpbmc6IGJvb2xlYW4gPSBmYWxzZTtcbiAgdXBsb2FkZWRGaWxlTmFtZTogc3RyaW5nIHwgbnVsbCA9IG51bGw7XG4gIGZpbGVVcGxvYWRFcnJvcjogc3RyaW5nIHwgbnVsbCA9IG51bGw7XG4gIEBJbnB1dCgpIGN1cnJlbnREYXRhOkNhcmREYXRhfG51bGw9bnVsbFxuICBAT3V0cHV0KCkgc3dpdGNoVmlldyA9IG5ldyBFdmVudEVtaXR0ZXI8dW5kZWZpbmVkPigpO1xuXG4gIGZvcm06IEZvcm1Hcm91cDtcblxuICBjb25zdHJ1Y3Rvcihwcml2YXRlIGZiOiBGb3JtQnVpbGRlcikge1xuICAgIHRoaXMuZm9ybSA9IHRoaXMuZmIuZ3JvdXAoe1xuICAgICAgRGVzY3JpcHRpb246IFsnJ10sXG4gICAgICBOYW1lOiBbJyddLFxuICAgICAgTGluazogWycnXSxcbiAgICAgIExvZ286IFsnJ10sXG4gICAgfSk7XG4gIH1cblxuICBuZ09uSW5pdCgpOiB2b2lkIHt9XG5cbiAgb25TYXZlKCk6IHZvaWQge1xuICAgIGlmICh0aGlzLmZvcm0udmFsaWQpIHtcbiAgICAgIC8vIEVtaXQgc2F2ZSBldmVudCB3aXRoIGZvcm0gdmFsdWVcbiAgICAgIGNvbnNvbGUubG9nKCdGb3JtIHNhdmVkOicsIHRoaXMuZm9ybS52YWx1ZSk7XG4gICAgfVxuICB9XG4gIG9uRGVsZXRlKCk6IHZvaWQge1xuICAgIC8vIEVtaXQgZGVsZXRlIGV2ZW50XG4gICAgY29uc29sZS5sb2coJ0RlbGV0ZSByZXF1ZXN0ZWQnKTtcbiAgfVxuICBvbkZpbGVTZWxlY3RlZChldmVudDogRXZlbnQpIHtcbiAgICBjb25zdCBpbnB1dCA9IGV2ZW50LnRhcmdldCBhcyBIVE1MSW5wdXRFbGVtZW50O1xuICAgIGlmIChpbnB1dC5maWxlcyAmJiBpbnB1dC5maWxlcy5sZW5ndGggPiAwKSB7XG4gICAgICBjb25zdCBmaWxlID0gaW5wdXQuZmlsZXNbMF07XG4gICAgICB0aGlzLmZpbGVVcGxvYWRFcnJvciA9IG51bGw7XG4gICAgICBpZiAoIWZpbGUpIHtcbiAgICAgICAgdGhpcy5pc1VwbG9hZGluZyA9IHRydWU7XG4gICAgICB9XG4gICAgICBpZiAoZmlsZS5zaXplID4gNTAwMDAwMCkge1xuICAgICAgICB0aGlzLmZpbGVVcGxvYWRFcnJvciA9ICdGaWxlIHNpemUgZXhjZWVkcyA1TUIgbGltaXQuJztcbiAgICAgICAgdGhpcy51cGxvYWRlZEZpbGVOYW1lID0gbnVsbDtcbiAgICAgICAgdGhpcy5pc1VwbG9hZGluZyA9IGZhbHNlOyAvLyBSZXNldCBpc1VwbG9hZGluZyBzdGF0ZVxuICAgICAgfSBlbHNlIHtcbiAgICAgICAgdGhpcy51cGxvYWRlZEZpbGVOYW1lID0gZmlsZS5uYW1lO1xuICAgICAgfVxuICAgIH0gZWxzZSB7XG4gICAgICB0aGlzLmlzVXBsb2FkaW5nID0gZmFsc2U7XG4gICAgfVxuICB9XG5cbiAgcmVtb3ZlRmlsZSgpIHtcbiAgICB0aGlzLnVwbG9hZGVkRmlsZU5hbWUgPSBudWxsO1xuICAgIHRoaXMuZmlsZVVwbG9hZEVycm9yID0gbnVsbDtcbiAgICBjb25zdCBmaWxlSW5wdXQgPSBkb2N1bWVudC5nZXRFbGVtZW50QnlJZCgnYXR0YWNobWVudCcpIGFzIEhUTUxJbnB1dEVsZW1lbnQ7XG4gICAgaWYgKGZpbGVJbnB1dCkge1xuICAgICAgZmlsZUlucHV0LnZhbHVlID0gJyc7XG4gICAgfVxuICB9XG5cbn1cbiIsIjxmb3JtXG4gIFtmb3JtR3JvdXBdPVwiZm9ybVwiXG4gIGNsYXNzPVwiZmxleCBmbGV4LWNvbCBweC0zIHBiLTMgcm91bmRlZC14bCBoLWZ1bGwgdy1mdWxsIHJlbGF0aXZlXCJcbj5cbiAgPHZlcmJlbmEtaW5wdXRcbiAgICBuYW1lPVwiTmFtZVwiXG4gICAgbGFiZWw9XCJOYW1lOlwiXG4gICAgZm9ybUNvbnRyb2xOYW1lPVwiTmFtZVwiXG4gICAgWyhuZ01vZGVsKV09XCJjdXJyZW50RGF0YT8uZGF0YS5OYW1lXCJcbiAgLz5cbiAgPHZlcmJlbmEtaW5wdXRcbiAgICBsYWJlbD1cIkRlc2NyaXB0aW9uOlwiXG4gICAgbmFtZT1cIkRlc2NyaXB0aW9uXCJcbiAgICBmb3JtQ29udHJvbE5hbWU9XCJEZXNjcmlwdGlvblwiXG4gICAgWyhuZ01vZGVsKV09XCJjdXJyZW50RGF0YT8uZGF0YS5EZXNjcmlwdGlvblwiXG4gIC8+XG4gIDx2ZXJiZW5hLWlucHV0XG4gIGxhYmVsPVwiTGluazpcIlxuICBuYW1lPVwiTGlua1wiXG4gIGZvcm1Db250cm9sTmFtZT1cIkxpbmtcIlxuICBbKG5nTW9kZWwpXT1cImN1cnJlbnREYXRhPy5kYXRhLkxpbmtcIlxuLz5cbjxzcGFuIGNsYXNzPVwiYmxvY2sgbXktMiBcIj5Mb2dvPC9zcGFuPlxuPGxhYmVsIFtzdHlsZS5iYWNrZ3JvdW5kLWNvbG9yXT1cIicjZjlmOWY5J1wiIGNsYXNzPVwiYm9yZGVyIGN1cnNvci1wb2ludGVyIGJvcmRlci1zZWNvbmRhcnktMjAwIHJvdW5kZWQtbWQgdy1mdWxsIHB4LTQgcHktMiBmbGV4IGp1c3RpZnktYmV0d2VlblwiPlxuICA8c3BhbiAqbmdJZj1cIiF1cGxvYWRlZEZpbGVOYW1lXCI+e3tpc1VwbG9hZGluZz9cInVwbG9hZGluZy4uLlwiOlwiVXBsb2FkIGEgcGhvdG9cIn19PC9zcGFuPlxuICA8c3BhbiAqbmdJZj1cImZpbGVVcGxvYWRFcnJvclwiIGNsYXNzPVwiZXJyb3JcIj57eyBmaWxlVXBsb2FkRXJyb3IgfX08L3NwYW4+XG4gIDxkaXYgKm5nSWY9XCJ1cGxvYWRlZEZpbGVOYW1lXCIgY2xhc3M9XCJmbGV4IGl0ZW1zLWNlbnRlciB0ZXh0LXNtIGdhcC0yIGJvcmRlciBib3JkZXItcHJpbWFyeSByb3VuZGVkLWxnIHB4LTMgXCI+XG4gICAgPHNwYW4+e3sgdXBsb2FkZWRGaWxlTmFtZSB9fTwvc3Bhbj5cbiAgICA8YnV0dG9uXG4gICAgICBbc3R5bGUuY29sb3JdPVwiJ2JsYWNrJ1wiXG4gICAgICB0eXBlPVwiYnV0dG9uXCJcbiAgICAgIChjbGljayk9XCJyZW1vdmVGaWxlKClcIlxuICAgID5cbiAgICAgICYjeDI3MTU7XG4gICAgPC9idXR0b24+XG4gIDwvZGl2PlxuICA8aW5wdXRcbiAgaWQ9XCJsb2dvXCJcblt0eXBlXT1cIidmaWxlJ1wiXG4gIGxhYmVsPVwiTG9nbzpcIlxuICBuYW1lPVwiTG9nb1wiXG4gIGFjY2VwdD1cImltYWdlL3BuZ1wiXG4gIGZvcm1Db250cm9sTmFtZT1cIkxvZ29cIlxuICAoY2hhbmdlKT1cIm9uRmlsZVNlbGVjdGVkKCRldmVudClcIlxuICBmb3JtQ29udHJvbE5hbWU9XCJMb2dvXCJcbi8+XG48c3BhbiBjbGFzcz1cImZsZXggZ2FwLTJcIj5cbjxzcGFuIGNsYXNzPVwiYmctcHJpbWFyeSBmbGV4IGljb24tY29udGFpbmVyIHJvdW5kZWQtbWQganVzdGlmeS1jZW50ZXIgaXRlbXMtY2VudGVyXCI+XG4gIDxpbWcgc3JjPVwiLi9hc3NldHMvaWNvbnMvY2FtLnBuZ1wiIGNsYXNzPVwiaWNvbi13aWR0aFwiLz5cbjwvc3Bhbj5cbjxzcGFuICBjbGFzcz1cImJnLXByaW1hcnkgZmxleCBpY29uLWNvbnRhaW5lciByb3VuZGVkLW1kIGp1c3RpZnktY2VudGVyIGl0ZW1zLWNlbnRlclwiPlxuICA8aW1nIHNyYz1cIi4vYXNzZXRzL2ljb25zL2ZpbGUucG5nXCIgY2xhc3M9XCJpY29uLXdpZHRoMlwiLz5cbjwvc3Bhbj5cbjwvc3Bhbj5cbjwvbGFiZWw+XG5cbiAgPCEtLSBidXR0b25zIC0tPlxuICA8ZGl2XG4gICAgY2xhc3M9XCJmbGV4IGp1c3RpZnktYmV0d2VlbiBib3R0b20tOCBsZWZ0LTAgcmlnaHQtMCBweC0zIHBiLTIgYWJzb2x1dGVcIlxuICAgIHN0eWxlPVwiXG4gICAgICBkaXNwbGF5OiBmbGV4O1xuICAgICAganVzdGlmeS1jb250ZW50OiBzcGFjZS1iZXR3ZWVuO1xuICAgICAgcG9zaXRpb246IGFic29sdXRlO1xuICAgICAgcGFkZGluZzogOHB4IDEycHg7XG4gICAgICByaWdodDogMDtcbiAgICAgIGxlZnQ6IDA7XG4gICAgICBib3R0b206IDMyO1xuICAgIFwiXG4gID5cbiAgICA8IS0tIDx2ZXJiZW5hLWJ1dHRvblxuICAgICAgdGV4dD1cIkRlbGV0ZVwiXG4gICAgICBjbGFzcz1cImJnLXNlY29uZGFyeS0yMDAgdGV4dC1bYmxhY2tdXCJcbiAgICAgIChjbGljayk9XCJvbkRlbGV0ZSgpXCJcbiAgICAvPlxuICAgIDx2ZXJiZW5hLWJ1dHRvblxuICAgICAgdGV4dD1cIlNhdmVcIlxuICAgICAgY2xhc3M9XCJiZy1wcmltYXJ5IHRleHQtW2JsYWNrXVwiXG4gICAgICAoY2xpY2spPVwib25TYXZlKClcIlxuICAgIC8+XG5cbiAgICA8dmVyYmVuYS1idXR0b25cbiAgICAgIHRleHQ9XCJTZWNvbmRhcnkgQnV0dG9uXCJcbiAgICAgIHN0eWxlVHlwZT1cInNlY29uZGFyeVwiXG4gICAgPjwvdmVyYmVuYS1idXR0b24+IC0tPlxuICAgIDx2ZXJiZW5hLWJ1dHRvblxuICAgICAgd2lkdGg9XCIxMTRweFwiXG4gICAgICBoZWlnaHQ9XCIzOXB4XCJcbiAgICAgIHRleHQ9XCJEZWxldGVcIlxuICAgICAgW2JnQ29sb3JdPVwiJyM5OTk5OTknXCJcbiAgICAgIFt0ZXh0Q29sb3JdPVwiJyM0MDQwNDAnXCJcbiAgICAgIGJvcmRlclJhZGl1cz1cIjEwcHhcIlxuICAgID48L3ZlcmJlbmEtYnV0dG9uPlxuICAgIDx2ZXJiZW5hLWJ1dHRvblxuICAgICAgKGNsaWNrKT1cInN3aXRjaFZpZXcuZW1pdCgpXCJcbiAgICAgIHRleHQ9XCJTd2l0Y2ggVG8gVGFibGVcIlxuICAgICAgc3R5bGVUeXBlPVwieWx3LW91dGxpbmVcIlxuICAgID48L3ZlcmJlbmEtYnV0dG9uPlxuICAgIDx2ZXJiZW5hLWJ1dHRvblxuICAgICAgdGV4dD1cIlNhdmVcIlxuICAgICAgYmdDb2xvcj1cIiMyOGE3NDVcIlxuICAgICAgdGV4dENvbG9yPVwiIzQwNDA0MFwiXG4gICAgICBib3JkZXJSYWRpdXM9XCIxMHB4XCJcbiAgICAgIHBkPVwiMTBweCAyMHB4XCJcbiAgICAgIFtiZ0NvbG9yXT1cIicjRkZFNjgxJ1wiXG4gICAgICB3aWR0aD1cIjExNHB4XCJcbiAgICAgIGhlaWdodD1cIjM5cHhcIlxuICAgID48L3ZlcmJlbmEtYnV0dG9uPlxuICA8L2Rpdj5cbjwvZm9ybT5cbiJdfQ==
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3NvLWZvcm0uY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvdmVyYmVuLWF1dGhlbnRpY2F0aW9uLXVpL3NyYy9saWIvY29tcG9uZW50cy9zc28vc3NvLWZvcm0vc3NvLWZvcm0uY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvdmVyYmVuLWF1dGhlbnRpY2F0aW9uLXVpL3NyYy9saWIvY29tcG9uZW50cy9zc28vc3NvLWZvcm0vc3NvLWZvcm0uY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBYyxZQUFZLEVBQUUsS0FBSyxFQUFFLE1BQU0sRUFBYSxNQUFNLGVBQWUsQ0FBQzs7Ozs7QUFVOUYsTUFBTSxPQUFPLGdCQUFnQjtJQVNQO0lBUnBCLFdBQVcsR0FBWSxLQUFLLENBQUM7SUFDN0IsZ0JBQWdCLEdBQWtCLElBQUksQ0FBQztJQUN2QyxlQUFlLEdBQWtCLElBQUksQ0FBQztJQUM3QixXQUFXLEdBQWUsSUFBSSxDQUFBO0lBQzdCLFVBQVUsR0FBRyxJQUFJLFlBQVksRUFBYSxDQUFDO0lBRXJELElBQUksQ0FBWTtJQUVoQixZQUFvQixFQUFlO1FBQWYsT0FBRSxHQUFGLEVBQUUsQ0FBYTtRQUNqQyxJQUFJLENBQUMsSUFBSSxHQUFHLElBQUksQ0FBQyxFQUFFLENBQUMsS0FBSyxDQUFDO1lBQ3hCLFdBQVcsRUFBRSxDQUFDLEVBQUUsQ0FBQztZQUNqQixJQUFJLEVBQUUsQ0FBQyxFQUFFLENBQUM7WUFDVixJQUFJLEVBQUUsQ0FBQyxFQUFFLENBQUM7WUFDVixJQUFJLEVBQUUsQ0FBQyxFQUFFLENBQUM7U0FDWCxDQUFDLENBQUM7SUFDTCxDQUFDO0lBRUQsUUFBUSxLQUFVLENBQUM7SUFFbkIsTUFBTTtRQUNKLElBQUksSUFBSSxDQUFDLElBQUksQ0FBQyxLQUFLLEVBQUUsQ0FBQztZQUNwQixrQ0FBa0M7WUFDbEMsT0FBTyxDQUFDLEdBQUcsQ0FBQyxhQUFhLEVBQUUsSUFBSSxDQUFDLElBQUksQ0FBQyxLQUFLLENBQUMsQ0FBQztRQUM5QyxDQUFDO0lBQ0gsQ0FBQztJQUNELFFBQVE7UUFDTixvQkFBb0I7UUFDcEIsT0FBTyxDQUFDLEdBQUcsQ0FBQyxrQkFBa0IsQ0FBQyxDQUFDO0lBQ2xDLENBQUM7SUFDRCxjQUFjLENBQUMsS0FBWTtRQUN6QixNQUFNLEtBQUssR0FBRyxLQUFLLENBQUMsTUFBMEIsQ0FBQztRQUMvQyxJQUFJLEtBQUssQ0FBQyxLQUFLLElBQUksS0FBSyxDQUFDLEtBQUssQ0FBQyxNQUFNLEdBQUcsQ0FBQyxFQUFFLENBQUM7WUFDMUMsTUFBTSxJQUFJLEdBQUcsS0FBSyxDQUFDLEtBQUssQ0FBQyxDQUFDLENBQUMsQ0FBQztZQUM1QixJQUFJLENBQUMsZUFBZSxHQUFHLElBQUksQ0FBQztZQUM1QixJQUFJLENBQUMsSUFBSSxFQUFFLENBQUM7Z0JBQ1YsSUFBSSxDQUFDLFdBQVcsR0FBRyxJQUFJLENBQUM7WUFDMUIsQ0FBQztZQUNELElBQUksSUFBSSxDQUFDLElBQUksR0FBRyxPQUFPLEVBQUUsQ0FBQztnQkFDeEIsSUFBSSxDQUFDLGVBQWUsR0FBRyw4QkFBOEIsQ0FBQztnQkFDdEQsSUFBSSxDQUFDLGdCQUFnQixHQUFHLElBQUksQ0FBQztnQkFDN0IsSUFBSSxDQUFDLFdBQVcsR0FBRyxLQUFLLENBQUMsQ0FBQywwQkFBMEI7WUFDdEQsQ0FBQztpQkFBTSxDQUFDO2dCQUNOLElBQUksQ0FBQyxnQkFBZ0IsR0FBRyxJQUFJLENBQUMsSUFBSSxDQUFDO1lBQ3BDLENBQUM7UUFDSCxDQUFDO2FBQU0sQ0FBQztZQUNOLElBQUksQ0FBQyxXQUFXLEdBQUcsS0FBSyxDQUFDO1FBQzNCLENBQUM7SUFDSCxDQUFDO0lBRUQsVUFBVTtRQUNSLElBQUksQ0FBQyxnQkFBZ0IsR0FBRyxJQUFJLENBQUM7UUFDN0IsSUFBSSxDQUFDLGVBQWUsR0FBRyxJQUFJLENBQUM7UUFDNUIsTUFBTSxTQUFTLEdBQUcsUUFBUSxDQUFDLGNBQWMsQ0FBQyxZQUFZLENBQXFCLENBQUM7UUFDNUUsSUFBSSxTQUFTLEVBQUUsQ0FBQztZQUNkLFNBQVMsQ0FBQyxLQUFLLEdBQUcsRUFBRSxDQUFDO1FBQ3ZCLENBQUM7SUFDSCxDQUFDO3dHQXpEVSxnQkFBZ0I7NEZBQWhCLGdCQUFnQixtSUNWN0IsNHNHQXNIQTs7NEZENUdhLGdCQUFnQjtrQkFMNUIsU0FBUzsrQkFDRSxjQUFjO2dGQVFmLFdBQVc7c0JBQW5CLEtBQUs7Z0JBQ0ksVUFBVTtzQkFBbkIsTUFBTSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgRWxlbWVudFJlZiwgRXZlbnRFbWl0dGVyLCBJbnB1dCwgT3V0cHV0LCBWaWV3Q2hpbGQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IEZvcm1CdWlsZGVyLCBGb3JtR3JvdXAgfSBmcm9tICdAYW5ndWxhci9mb3Jtcyc7XG5pbXBvcnQgeyBDYXJkRGF0YSB9IGZyb20gJ3ZlcmJlbi1uZy11aSc7XG5cblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnbGliLXNzby1mb3JtJyxcbiAgdGVtcGxhdGVVcmw6ICcuL3Nzby1mb3JtLmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmw6ICcuL3Nzby1mb3JtLmNvbXBvbmVudC5jc3MnLFxufSlcbmV4cG9ydCBjbGFzcyBTc29Gb3JtQ29tcG9uZW50IHtcbiAgaXNVcGxvYWRpbmc6IGJvb2xlYW4gPSBmYWxzZTtcbiAgdXBsb2FkZWRGaWxlTmFtZTogc3RyaW5nIHwgbnVsbCA9IG51bGw7XG4gIGZpbGVVcGxvYWRFcnJvcjogc3RyaW5nIHwgbnVsbCA9IG51bGw7XG4gIEBJbnB1dCgpIGN1cnJlbnREYXRhOkNhcmREYXRhfG51bGw9bnVsbFxuICBAT3V0cHV0KCkgc3dpdGNoVmlldyA9IG5ldyBFdmVudEVtaXR0ZXI8dW5kZWZpbmVkPigpO1xuXG4gIGZvcm06IEZvcm1Hcm91cDtcblxuICBjb25zdHJ1Y3Rvcihwcml2YXRlIGZiOiBGb3JtQnVpbGRlcikge1xuICAgIHRoaXMuZm9ybSA9IHRoaXMuZmIuZ3JvdXAoe1xuICAgICAgRGVzY3JpcHRpb246IFsnJ10sXG4gICAgICBOYW1lOiBbJyddLFxuICAgICAgTGluazogWycnXSxcbiAgICAgIExvZ286IFsnJ10sXG4gICAgfSk7XG4gIH1cblxuICBuZ09uSW5pdCgpOiB2b2lkIHt9XG5cbiAgb25TYXZlKCk6IHZvaWQge1xuICAgIGlmICh0aGlzLmZvcm0udmFsaWQpIHtcbiAgICAgIC8vIEVtaXQgc2F2ZSBldmVudCB3aXRoIGZvcm0gdmFsdWVcbiAgICAgIGNvbnNvbGUubG9nKCdGb3JtIHNhdmVkOicsIHRoaXMuZm9ybS52YWx1ZSk7XG4gICAgfVxuICB9XG4gIG9uRGVsZXRlKCk6IHZvaWQge1xuICAgIC8vIEVtaXQgZGVsZXRlIGV2ZW50XG4gICAgY29uc29sZS5sb2coJ0RlbGV0ZSByZXF1ZXN0ZWQnKTtcbiAgfVxuICBvbkZpbGVTZWxlY3RlZChldmVudDogRXZlbnQpIHtcbiAgICBjb25zdCBpbnB1dCA9IGV2ZW50LnRhcmdldCBhcyBIVE1MSW5wdXRFbGVtZW50O1xuICAgIGlmIChpbnB1dC5maWxlcyAmJiBpbnB1dC5maWxlcy5sZW5ndGggPiAwKSB7XG4gICAgICBjb25zdCBmaWxlID0gaW5wdXQuZmlsZXNbMF07XG4gICAgICB0aGlzLmZpbGVVcGxvYWRFcnJvciA9IG51bGw7XG4gICAgICBpZiAoIWZpbGUpIHtcbiAgICAgICAgdGhpcy5pc1VwbG9hZGluZyA9IHRydWU7XG4gICAgICB9XG4gICAgICBpZiAoZmlsZS5zaXplID4gNTAwMDAwMCkge1xuICAgICAgICB0aGlzLmZpbGVVcGxvYWRFcnJvciA9ICdGaWxlIHNpemUgZXhjZWVkcyA1TUIgbGltaXQuJztcbiAgICAgICAgdGhpcy51cGxvYWRlZEZpbGVOYW1lID0gbnVsbDtcbiAgICAgICAgdGhpcy5pc1VwbG9hZGluZyA9IGZhbHNlOyAvLyBSZXNldCBpc1VwbG9hZGluZyBzdGF0ZVxuICAgICAgfSBlbHNlIHtcbiAgICAgICAgdGhpcy51cGxvYWRlZEZpbGVOYW1lID0gZmlsZS5uYW1lO1xuICAgICAgfVxuICAgIH0gZWxzZSB7XG4gICAgICB0aGlzLmlzVXBsb2FkaW5nID0gZmFsc2U7XG4gICAgfVxuICB9XG5cbiAgcmVtb3ZlRmlsZSgpIHtcbiAgICB0aGlzLnVwbG9hZGVkRmlsZU5hbWUgPSBudWxsO1xuICAgIHRoaXMuZmlsZVVwbG9hZEVycm9yID0gbnVsbDtcbiAgICBjb25zdCBmaWxlSW5wdXQgPSBkb2N1bWVudC5nZXRFbGVtZW50QnlJZCgnYXR0YWNobWVudCcpIGFzIEhUTUxJbnB1dEVsZW1lbnQ7XG4gICAgaWYgKGZpbGVJbnB1dCkge1xuICAgICAgZmlsZUlucHV0LnZhbHVlID0gJyc7XG4gICAgfVxuICB9XG5cbn1cbiIsIjxmb3JtXG4gIFtmb3JtR3JvdXBdPVwiZm9ybVwiXG4gICpuZ0lmPVwiY3VycmVudERhdGFcIlxuICBjbGFzcz1cImZsZXggZmxleC1jb2wgcHgtMyBwYi0zIHJvdW5kZWQteGwgaC1mdWxsIHctZnVsbCByZWxhdGl2ZVwiXG4+XG4gIDx2ZXJiZW5hLWlucHV0XG4gICAgbmFtZT1cIk5hbWVcIlxuICAgIGxhYmVsPVwiTmFtZTpcIlxuICAgIGZvcm1Db250cm9sTmFtZT1cIk5hbWVcIlxuICAgIFsobmdNb2RlbCldPVwiY3VycmVudERhdGEuZGF0YS5OYW1lXCJcbiAgLz5cbiAgPHZlcmJlbmEtaW5wdXRcbiAgICBsYWJlbD1cIkRlc2NyaXB0aW9uOlwiXG4gICAgbmFtZT1cIkRlc2NyaXB0aW9uXCJcbiAgICBmb3JtQ29udHJvbE5hbWU9XCJEZXNjcmlwdGlvblwiXG4gICAgWyhuZ01vZGVsKV09XCJjdXJyZW50RGF0YS5kYXRhLkRlc2NyaXB0aW9uXCJcbiAgLz5cbiAgPHZlcmJlbmEtaW5wdXRcbiAgICBsYWJlbD1cIkxpbms6XCJcbiAgICBuYW1lPVwiTGlua1wiXG4gICAgZm9ybUNvbnRyb2xOYW1lPVwiTGlua1wiXG4gICAgWyhuZ01vZGVsKV09XCJjdXJyZW50RGF0YS5kYXRhLkxpbmtcIlxuICAvPlxuICA8c3BhbiBjbGFzcz1cImJsb2NrIG15LTJcIj5Mb2dvPC9zcGFuPlxuICA8bGFiZWxcbiAgICBbc3R5bGUuYmFja2dyb3VuZC1jb2xvcl09XCInI2Y5ZjlmOSdcIlxuICAgIGNsYXNzPVwiYm9yZGVyIGN1cnNvci1wb2ludGVyIGJvcmRlci1zZWNvbmRhcnktMjAwIHJvdW5kZWQtbWQgdy1mdWxsIHB4LTQgcHktMiBmbGV4IGp1c3RpZnktYmV0d2VlblwiXG4gID5cbiAgICA8c3BhbiAqbmdJZj1cIiF1cGxvYWRlZEZpbGVOYW1lXCI+e3tcbiAgICAgIGlzVXBsb2FkaW5nID8gXCJ1cGxvYWRpbmcuLi5cIiA6IFwiVXBsb2FkIGEgcGhvdG9cIlxuICAgIH19PC9zcGFuPlxuICAgIDxzcGFuICpuZ0lmPVwiZmlsZVVwbG9hZEVycm9yXCIgY2xhc3M9XCJlcnJvclwiPnt7IGZpbGVVcGxvYWRFcnJvciB9fTwvc3Bhbj5cbiAgICA8ZGl2XG4gICAgICAqbmdJZj1cInVwbG9hZGVkRmlsZU5hbWVcIlxuICAgICAgY2xhc3M9XCJmbGV4IGl0ZW1zLWNlbnRlciB0ZXh0LXNtIGdhcC0yIGJvcmRlciBib3JkZXItcHJpbWFyeSByb3VuZGVkLWxnIHB4LTNcIlxuICAgID5cbiAgICAgIDxzcGFuPnt7IHVwbG9hZGVkRmlsZU5hbWUgfX08L3NwYW4+XG4gICAgICA8YnV0dG9uIFtzdHlsZS5jb2xvcl09XCInYmxhY2snXCIgdHlwZT1cImJ1dHRvblwiIChjbGljayk9XCJyZW1vdmVGaWxlKClcIj5cbiAgICAgICAgJiN4MjcxNTtcbiAgICAgIDwvYnV0dG9uPlxuICAgIDwvZGl2PlxuICAgIDxpbnB1dFxuICAgICAgaWQ9XCJsb2dvXCJcbiAgICAgIFt0eXBlXT1cIidmaWxlJ1wiXG4gICAgICBsYWJlbD1cIkxvZ286XCJcbiAgICAgIG5hbWU9XCJMb2dvXCJcbiAgICAgIGFjY2VwdD1cImltYWdlL3BuZ1wiXG4gICAgICBmb3JtQ29udHJvbE5hbWU9XCJMb2dvXCJcbiAgICAgIChjaGFuZ2UpPVwib25GaWxlU2VsZWN0ZWQoJGV2ZW50KVwiXG4gICAgICBmb3JtQ29udHJvbE5hbWU9XCJMb2dvXCJcbiAgICAvPlxuICAgIDxzcGFuIGNsYXNzPVwiZmxleCBnYXAtMlwiPlxuICAgICAgPHNwYW5cbiAgICAgICAgY2xhc3M9XCJiZy1wcmltYXJ5IGZsZXggaWNvbi1jb250YWluZXIgcm91bmRlZC1tZCBqdXN0aWZ5LWNlbnRlciBpdGVtcy1jZW50ZXJcIlxuICAgICAgPlxuICAgICAgICA8aW1nIHNyYz1cIi4vYXNzZXRzL2ljb25zL2NhbS5wbmdcIiBjbGFzcz1cImljb24td2lkdGhcIiAvPlxuICAgICAgPC9zcGFuPlxuICAgICAgPHNwYW5cbiAgICAgICAgY2xhc3M9XCJiZy1wcmltYXJ5IGZsZXggaWNvbi1jb250YWluZXIgcm91bmRlZC1tZCBqdXN0aWZ5LWNlbnRlciBpdGVtcy1jZW50ZXJcIlxuICAgICAgPlxuICAgICAgICA8aW1nIHNyYz1cIi4vYXNzZXRzL2ljb25zL2ZpbGUucG5nXCIgY2xhc3M9XCJpY29uLXdpZHRoMlwiIC8+XG4gICAgICA8L3NwYW4+XG4gICAgPC9zcGFuPlxuICA8L2xhYmVsPlxuXG4gIDwhLS0gYnV0dG9ucyAtLT5cbiAgPGRpdlxuICAgIGNsYXNzPVwiZmxleCBqdXN0aWZ5LWJldHdlZW4gYm90dG9tLTggbGVmdC0wIHJpZ2h0LTAgcHgtMyBwYi0yIGFic29sdXRlXCJcbiAgICBzdHlsZT1cIlxuICAgICAgZGlzcGxheTogZmxleDtcbiAgICAgIGp1c3RpZnktY29udGVudDogc3BhY2UtYmV0d2VlbjtcbiAgICAgIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgICAgIHBhZGRpbmc6IDhweCAxMnB4O1xuICAgICAgcmlnaHQ6IDA7XG4gICAgICBsZWZ0OiAwO1xuICAgICAgYm90dG9tOiAzMjtcbiAgICBcIlxuICA+XG4gICAgPCEtLSA8dmVyYmVuYS1idXR0b25cbiAgICAgIHRleHQ9XCJEZWxldGVcIlxuICAgICAgY2xhc3M9XCJiZy1zZWNvbmRhcnktMjAwIHRleHQtW2JsYWNrXVwiXG4gICAgICAoY2xpY2spPVwib25EZWxldGUoKVwiXG4gICAgLz5cbiAgICA8dmVyYmVuYS1idXR0b25cbiAgICAgIHRleHQ9XCJTYXZlXCJcbiAgICAgIGNsYXNzPVwiYmctcHJpbWFyeSB0ZXh0LVtibGFja11cIlxuICAgICAgKGNsaWNrKT1cIm9uU2F2ZSgpXCJcbiAgICAvPlxuXG4gICAgPHZlcmJlbmEtYnV0dG9uXG4gICAgICB0ZXh0PVwiU2Vjb25kYXJ5IEJ1dHRvblwiXG4gICAgICBzdHlsZVR5cGU9XCJzZWNvbmRhcnlcIlxuICAgID48L3ZlcmJlbmEtYnV0dG9uPiAtLT5cbiAgICA8dmVyYmVuYS1idXR0b25cbiAgICAgIHdpZHRoPVwiMTE0cHhcIlxuICAgICAgaGVpZ2h0PVwiMzlweFwiXG4gICAgICB0ZXh0PVwiRGVsZXRlXCJcbiAgICAgIFtiZ0NvbG9yXT1cIicjOTk5OTk5J1wiXG4gICAgICBbdGV4dENvbG9yXT1cIicjNDA0MDQwJ1wiXG4gICAgICBib3JkZXJSYWRpdXM9XCIxMHB4XCJcbiAgICA+PC92ZXJiZW5hLWJ1dHRvbj5cbiAgICA8dmVyYmVuYS1idXR0b25cbiAgICAgIChjbGljayk9XCJzd2l0Y2hWaWV3LmVtaXQoKVwiXG4gICAgICB0ZXh0PVwiU3dpdGNoIFRvIFRhYmxlXCJcbiAgICAgIHN0eWxlVHlwZT1cInlsdy1vdXRsaW5lXCJcbiAgICA+PC92ZXJiZW5hLWJ1dHRvbj5cbiAgICA8dmVyYmVuYS1idXR0b25cbiAgICAgIHRleHQ9XCJTYXZlXCJcbiAgICAgIGJnQ29sb3I9XCIjMjhhNzQ1XCJcbiAgICAgIHRleHRDb2xvcj1cIiM0MDQwNDBcIlxuICAgICAgYm9yZGVyUmFkaXVzPVwiMTBweFwiXG4gICAgICBwZD1cIjEwcHggMjBweFwiXG4gICAgICBbYmdDb2xvcl09XCInI0ZGRTY4MSdcIlxuICAgICAgd2lkdGg9XCIxMTRweFwiXG4gICAgICBoZWlnaHQ9XCIzOXB4XCJcbiAgICA+PC92ZXJiZW5hLWJ1dHRvbj5cbiAgPC9kaXY+XG48L2Zvcm0+XG4iXX0=

package/esm2022/src/lib/components/sso/sso.component.mjs

@@ -219,7 +219,7 @@ export class SsoComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SsoComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: SsoComponent, selector: "lib-sso", 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        isToggle:true\n      }\"\n    [buttonClass]=\"'my-custom-button-class'\"\n    [iconClass]=\"'my-icon-class'\"\n    [activeIconClass]=\"'my-active-icon-class'\"\n    [selectedSortCount]=\"selectedSortCount\"\n    [selectedColumnCount]=\"selectedColumnCount\"\n    [selectedFilterTableCount]=\"selectedFilterTableCount\"\n    [showColumnChild]=\"showColumn\"\n    [showSortChild]=\"showSort\"\n    [showFilterChild]=\"showFilter\"\n    [isTableView]=\"false\"\n    [selectedFilterTableCount]=\"0\"\n    [cardIcon]=\"'list-view'\"\n    [tableIcon]=\"'table-view'\"\n    (viewChange)=\"onViewChange($event)\"\n    (stateChange)=\"onStateChange($event)\"\n  >\n    <div table-content>\n      <lib-data-table\n        [data]=\"data\"\n        [columns]=\"filteredColumns\"\n        [styleConfig]=\"styles\"\n        (selectionChange)=\"onSelectionChange($event)\"\n      >\n        <ng-container libColumn=\"createdAt\">\n          <ng-template #cell let-value>\n            {{ value | date }}\n          </ng-template>\n        </ng-container>\n        <ng-container libColumn=\"logo\">\n          <ng-template #cell let-value>\n            <img class=\"logo-width\" [src]=\"value\"/>\n          </ng-template>\n        </ng-container>\n        <ng-container libColumn=\"actions\">\n          <ng-template #cell let-value let-deleteRow let-rowIndex>\n            <div class=\"flex space-x-8\" style=\"display: flex; gap: 24px\">\n              <verben-svg\n                (click)=\"openDetailView(value)\"\n                icon=\"edit\"\n                [width]=\"15\"\n                [height]=\"15\"\n                stroke=\"#3479E9\"\n                fill=\"white\"\n                class=\"cursor-pointer\"\n              ></verben-svg>\n              <verben-svg\n                icon=\"delete\"\n                [width]=\"15\"\n                [height]=\"15\"\n                stroke=\"#E20000\"\n                (click)=\"deleteRow()\"\n                class=\"cursor-pointer\"\n              ></verben-svg>\n            </div>\n          </ng-template>\n          <ng-template #header>\n            <strong>Actions</strong>\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=\"Link\"\n        border=\"5px\"\n        [cardDataList]=\"cardData\"\n        rbgColor=\"#f5f6f9\"\n      >\n        <verben-left-card-data-view class=\"\">\n          <verben-left-card-data\n            #vlcd\n            [parent]=\"vdcv\"\n            dataId=\"Link\"\n            class=\"bg-secondary-100 rounded-xl border-primary border-[1px]\"\n            [cardDataList]=\"cardData\"\n          >\n            <ng-template #card let-item>\n              <div (click)=\"currentData = vdcv.onItemClick(item)\" class=\"flex\">\n                <verben-svg\n                  [width]=\"15\"\n                  [height]=\"15\"\n                  (click)=\"vlcd.showChildren(item)\"\n                  [ngClass]=\"vlcd.showToggle(item) ? 'visible' : 'invisible'\"\n                  class=\"items-center flex pr-1 cursor-pointer\"\n                  [icon]=\"item.isChildrenExpanded ? 'minus' : 'plus'\"\n                />\n                <div\n                  (click)=\"currentData = vdcv.onItemClick(item)\"\n                  class=\"flex cursor-pointer 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=\"flex flex-col py-2 px-4 w-full\">\n                    <div class=\"flex\">\n                      <span class=\"font-bold text-sm\">{{ item.data.Name }}</span>\n                    </div>\n                    @for (ciItem of item.body; track ciItem.value) {\n                    <div class=\"flex items-center justify-between gap-2\">\n                      <div>\n                        <span class=\"text-muted font-light text-xs\"\n                          >{{ ciItem.title }}:</span\n                        >\n                        <span class=\"text-black text-xs font-semibold\">{{ item.data.Description }}</span>\n                      </div>\n                      <img class=\"logo-width\" [alt]=\"ciItem.title\" [src]=\"item.data.Logo\"/>\n                    </div>\n                    }\n                  </div>\n                </div>\n              </div>\n            </ng-template>\n          </verben-left-card-data>\n        </verben-left-card-data-view>\n\n        <verben-right-card-data-view>\n          <ng-template #parent>\n            <lib-sso-form\n              [currentData]=\"currentData\"\n              (switchView)=\"vdv.toggleView()\"\n            ></lib-sso-form>\n          </ng-template>\n        </verben-right-card-data-view>\n\n        <verben-card-data-view-footer class=\"float-right\">\n          <div class=\"flex gap-2 mt-1\">\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      (filtersApplied)=\"onFilterApplied($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=\"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", styles: [".flex{display:flex}.w-full{width:100%}.bg-secondary-200{background-color:#e8eaf1}.flex-col{flex-direction:column}.items-center{align-items:center}.bg-primary{background-color:#d4a007}.border-primary{border:1px solid #d4a007}.rounded-lg{border-radius:20px}.w-3{width:6px}.rounded-tr-none{border-top-right-radius:0}.rounded-br-none{border-bottom-right-radius:0}.bg-secondary-100{background-color:#8080800e}.bg-secondary{background-color:#e8eaf1}.p-2{padding:6px}.logo-width{width:70px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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.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.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.DataExportComponent, selector: "lib-data-export", inputs: ["columns", "data", "dataFetchUrl", "dataQueryParameters"], outputs: ["exportDataEvent"] }, { 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.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.RightCardDataViewComponent, selector: "verben-right-card-data-view", inputs: ["parentData", "chilData", "meth"] }, { kind: "component", type: i2.CardDataViewFooterComponent, selector: "verben-card-data-view-footer" }, { kind: "component", type: i2.SvgComponent, selector: "verben-svg", inputs: ["icon", "width", "height", "fill", "stroke", "type", "size"] }, { 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: i3.SsoFormComponent, selector: "lib-sso-form", inputs: ["currentData"], outputs: ["switchView"] }, { kind: "pipe", type: i1.DatePipe, name: "date" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: SsoComponent, selector: "lib-sso", 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        isToggle:true\n      }\"\n    [buttonClass]=\"'my-custom-button-class'\"\n    [iconClass]=\"'my-icon-class'\"\n    [activeIconClass]=\"'my-active-icon-class'\"\n    [selectedSortCount]=\"selectedSortCount\"\n    [selectedColumnCount]=\"selectedColumnCount\"\n    [selectedFilterTableCount]=\"selectedFilterTableCount\"\n    [showColumnChild]=\"showColumn\"\n    [showSortChild]=\"showSort\"\n    [showFilterChild]=\"showFilter\"\n    [isTableView]=\"false\"\n    [selectedFilterTableCount]=\"0\"\n    [cardIcon]=\"'list-view'\"\n    [tableIcon]=\"'table-view'\"\n    (viewChange)=\"onViewChange($event)\"\n    (stateChange)=\"onStateChange($event)\"\n  >\n    <div table-content>\n      <lib-data-table\n        [data]=\"data\"\n        [columns]=\"filteredColumns\"\n        [styleConfig]=\"styles\"\n        (selectionChange)=\"onSelectionChange($event)\"\n      >\n        <ng-container libColumn=\"createdAt\">\n          <ng-template #cell let-value>\n            {{ value | date }}\n          </ng-template>\n        </ng-container>\n        <ng-container libColumn=\"logo\">\n          <ng-template #cell let-value>\n            <img class=\"logo-width\" [src]=\"value\"/>\n          </ng-template>\n        </ng-container>\n        <ng-container libColumn=\"actions\">\n          <ng-template #cell let-value let-deleteRow let-rowIndex>\n            <div class=\"flex space-x-8\" style=\"display: flex; gap: 24px\">\n              <verben-svg\n                (click)=\"openDetailView(value)\"\n                icon=\"edit\"\n                [width]=\"15\"\n                [height]=\"15\"\n                stroke=\"#3479E9\"\n                fill=\"white\"\n                class=\"cursor-pointer\"\n              ></verben-svg>\n              <verben-svg\n                icon=\"delete\"\n                [width]=\"15\"\n                [height]=\"15\"\n                stroke=\"#E20000\"\n                (click)=\"deleteRow()\"\n                class=\"cursor-pointer\"\n              ></verben-svg>\n            </div>\n          </ng-template>\n          <ng-template #header>\n            <strong>Actions</strong>\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=\"Link\"\n        border=\"5px\"\n        [cardDataList]=\"cardData\"\n        rbgColor=\"#f5f6f9\"\n      >\n        <verben-left-card-data-view class=\"\">\n          <verben-left-card-data\n            #vlcd\n            [parent]=\"vdcv\"\n            dataId=\"Link\"\n            class=\"bg-secondary-100 rounded-xl border-primary border-[1px]\"\n            [cardDataList]=\"cardData\"\n          >\n            <ng-template #card let-item>\n              <div (click)=\"currentData = vdcv.onItemClick(item)\" class=\"flex\">\n                <verben-svg\n                  [width]=\"15\"\n                  [height]=\"15\"\n                  (click)=\"vlcd.showChildren(item)\"\n                  [ngClass]=\"vlcd.showToggle(item) ? 'visible' : 'invisible'\"\n                  class=\"items-center flex pr-1 cursor-pointer\"\n                  [icon]=\"item.isChildrenExpanded ? 'minus' : 'plus'\"\n                />\n                <div\n                  (click)=\"currentData = vdcv.onItemClick(item)\"\n                  class=\"flex cursor-pointer 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=\"flex flex-col py-2 px-4 w-full\">\n                    <div class=\"flex\">\n                      <span class=\"font-bold text-sm\">{{ item.data.Name }}</span>\n                    </div>\n                    @for (ciItem of item.body; track ciItem.value) {\n                    <div class=\"flex items-center justify-between gap-2\">\n                      <div>\n                        <span class=\"text-muted font-light text-xs\"\n                          >{{ ciItem.title }}:</span\n                        >\n                        <span class=\"text-black text-xs font-semibold\">{{ item.data.Description }}</span>\n                      </div>\n                      <img class=\"logo-width\" [alt]=\"ciItem.title\" [src]=\"item.data.Logo\"/>\n                    </div>\n                    }\n                  </div>\n                </div>\n              </div>\n            </ng-template>\n          </verben-left-card-data>\n        </verben-left-card-data-view>\n\n        <verben-right-card-data-view>\n          <ng-template #parent>\n            <lib-sso-form\n              [currentData]=\"currentData\"\n              (switchView)=\"vdv.toggleView()\"\n            ></lib-sso-form>\n          </ng-template>\n        </verben-right-card-data-view>\n\n        <verben-card-data-view-footer class=\"float-right\">\n          <div class=\"flex gap-2 mt-1\">\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      (filtersApplied)=\"onFilterApplied($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=\"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", styles: [".flex{display:flex}.w-full{width:100%}.bg-secondary-200{background-color:#e8eaf1}.flex-col{flex-direction:column}.items-center{align-items:center}.bg-primary{background-color:#d4a007}.border-primary{border:1px solid #d4a007}.rounded-lg{border-radius:20px}.w-3{width:6px}.rounded-tr-none{border-top-right-radius:0}.rounded-br-none{border-bottom-right-radius:0}.bg-secondary-100{background-color:#8080800e}.bg-secondary{background-color:#e8eaf1}.p-2{padding:6px}.logo-width{width:70px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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.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.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.DataExportComponent, selector: "lib-data-export", inputs: ["columns", "data", "dataFetchUrl", "dataQueryParameters"], outputs: ["exportDataEvent"] }, { 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.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.RightCardDataViewComponent, selector: "verben-right-card-data-view", inputs: ["parentData", "chilData", "meth"] }, { kind: "component", type: i2.CardDataViewFooterComponent, selector: "verben-card-data-view-footer" }, { kind: "component", type: i2.SvgComponent, selector: "verben-svg", inputs: ["icon", "width", "height", "fill", "stroke", "type", "size"] }, { 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: i3.SsoFormComponent, selector: "lib-sso-form", inputs: ["currentData"], outputs: ["switchView"] }, { kind: "pipe", type: i1.DatePipe, name: "date" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SsoComponent, decorators: [{
             type: Component,

package/esm2022/src/lib/components/two-factor-auth-otp/two-factor-auth-otp.component.mjs

@@ -135,7 +135,7 @@ export class TwoFactorAuthOtpComponent {
         };
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TwoFactorAuthOtpComponent, deps: [{ token: i1.FormBuilder }, { token: i2.HttpWebRequestService }, { token: i2.UtilService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: TwoFactorAuthOtpComponent, selector: "verben-auth-otp", inputs: { customClass: "customClass", headlingClass: "headlingClass", headlingText: "headlingText", paragraphClass: "paragraphClass", resendClass: "resendClass", width: "width", maxWidth: "maxWidth", margin: "margin", pd: "pd", bgColor: "bgColor", boxShadow: "boxShadow", border: "border", borderRadius: "borderRadius", textColor: "textColor", height: "height", length: "length", otpClass: "otpClass", resendOtpData: "resendOtpData", User: "User", OtpData: "OtpData", btnClass: "btnClass", btnBgColor: "btnBgColor", btnColor: "btnColor", btnBorder: "btnBorder", btnBorderRadius: "btnBorderRadius", btnPd: "btnPd", btnText: "btnText" }, outputs: { buttonClick: "buttonClick", otpChange: "otpChange", clearStore: "clearStore", onSubmitEnd: "onSubmitEnd", resend: "resend" }, ngImport: i0, template: "<section\n[ngStyle]=\"styles\"\nclass=\"{{ customClass }}\"\n>\n  <h3 class=\"{{headlingClass}}\">{{headlingText}}</h3>\n  <div class=\"otpWrapper\"> \n    <p class=\"{{paragraphClass}}\">Enter the {{length}} digit code sent to you</p>\n    <verben-otp-input \n    [length]=\"length\" \n    (otpChange)=\"onOtpChange($event)\"\n    [otpClass]=\"otpClass\"\n    ></verben-otp-input>\n  </div>\n  <lib-button  \n  [buttonClass]=\"btnClass\"\n  [color]=\"btnColor\"\n  [border]=\"btnBorder\"\n  [borderRadius]=\"btnBorderRadius\"\n  [bgColor]=\"btnBgColor\"\n  [pd]=\"btnPd\"\n  [text]=\"btnText\"  \n  (buttonClick)=\"submitData()\"\n  [disabled]=\"!otpForm.valid\"\n  ></lib-button>\n  <p class=\"resendWrapper\">\n    Didn\u2019t get a code?\n    <a class=\"{{resendClass}}\" (click)=\"resendOtp()\">Resend</a>\n  </p>\n   \n</section>", styles: [".otpWrapper{margin-bottom:20px;margin-top:15px}.resendWrapper{margin-top:10px;margin-bottom:0!important}\n"], dependencies: [{ kind: "directive", type: i3.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i4.ButtonComponent, selector: "lib-button", inputs: ["text", "color", "border", "borderRadius", "bgColor", "width", "pd", "buttonClass", "disabled"], outputs: ["buttonClick"] }, { kind: "component", type: i5.OtpInputComponent, selector: "verben-otp-input", inputs: ["length", "otpClass"], outputs: ["otpChange"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: TwoFactorAuthOtpComponent, selector: "verben-auth-otp", inputs: { customClass: "customClass", headlingClass: "headlingClass", headlingText: "headlingText", paragraphClass: "paragraphClass", resendClass: "resendClass", width: "width", maxWidth: "maxWidth", margin: "margin", pd: "pd", bgColor: "bgColor", boxShadow: "boxShadow", border: "border", borderRadius: "borderRadius", textColor: "textColor", height: "height", length: "length", otpClass: "otpClass", resendOtpData: "resendOtpData", User: "User", OtpData: "OtpData", btnClass: "btnClass", btnBgColor: "btnBgColor", btnColor: "btnColor", btnBorder: "btnBorder", btnBorderRadius: "btnBorderRadius", btnPd: "btnPd", btnText: "btnText" }, outputs: { buttonClick: "buttonClick", otpChange: "otpChange", clearStore: "clearStore", onSubmitEnd: "onSubmitEnd", resend: "resend" }, ngImport: i0, template: "<section\n[ngStyle]=\"styles\"\nclass=\"{{ customClass }}\"\n>\n  <h3 class=\"{{headlingClass}}\">{{headlingText}}</h3>\n  <div class=\"otpWrapper\"> \n    <p class=\"{{paragraphClass}}\">Enter the {{length}} digit code sent to you</p>\n    <verben-otp-input \n    [length]=\"length\" \n    (otpChange)=\"onOtpChange($event)\"\n    [otpClass]=\"otpClass\"\n    ></verben-otp-input>\n  </div>\n  <lib-button  \n  [buttonClass]=\"btnClass\"\n  [color]=\"btnColor\"\n  [border]=\"btnBorder\"\n  [borderRadius]=\"btnBorderRadius\"\n  [bgColor]=\"btnBgColor\"\n  [pd]=\"btnPd\"\n  [text]=\"btnText\"  \n  (buttonClick)=\"submitData()\"\n  [disabled]=\"!otpForm.valid\"\n  ></lib-button>\n  <p class=\"resendWrapper\">\n    Didn\u2019t get a code?\n    <a class=\"{{resendClass}}\" (click)=\"resendOtp()\">Resend</a>\n  </p>\n   \n</section>", styles: [".otpWrapper{margin-bottom:20px;margin-top:15px}.resendWrapper{margin-top:10px;margin-bottom:0!important}\n"], dependencies: [{ kind: "directive", type: i3.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i4.ButtonComponent, selector: "lib-button", inputs: ["type", "text", "color", "border", "borderRadius", "bgColor", "width", "pd", "buttonClass", "disabled"], outputs: ["buttonClick"] }, { kind: "component", type: i5.OtpInputComponent, selector: "verben-otp-input", inputs: ["length", "otpClass"], outputs: ["otpChange"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TwoFactorAuthOtpComponent, decorators: [{
             type: Component,

package/esm2022/src/lib/components/two-factor-auth-setup/two-factor-auth-setup.component.mjs

@@ -45,7 +45,7 @@ export class TwoFactorAuthSetupComponent {
         };
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TwoFactorAuthSetupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: TwoFactorAuthSetupComponent, selector: "verben-two-factor-auth-setup", inputs: { customClass: "customClass", headlingClass: "headlingClass", headlingText: "headlingText", paragraphClass: "paragraphClass", buttonClass: "buttonClass", width: "width", maxWidth: "maxWidth", margin: "margin", pd: "pd", bgColor: "bgColor", boxShadow: "boxShadow", border: "border", borderRadius: "borderRadius", textColor: "textColor", height: "height" }, outputs: { smsClick: "smsClick", mailClick: "mailClick", skipClick: "skipClick" }, ngImport: i0, template: "<section\n[ngStyle]=\"styles\"\nclass=\"{{ customClass }}\"\n>\n  <h3 class=\"{{headlingClass}}\">{{headlingText}}</h3>\n  <div class=\"setUpBtnWrapper\">\n    <verbena-button\n    svg=\"2fa-mail\"\n    [svgHeight]=\"16\"\n    [svgWidth]=\"20\"\n    text=\"Continue with Mail\"\n    bgColor=\"white\"\n    textColor=\"#333333\"\n    border=\"1px solid #333\"\n    borderRadius=\"40px\"\n    pd=\"10px 20px\"\n    width=\"100%\"\n    svgPosition=\"left\"\n    buttonClass=\"font-normal text-[24px] leading-[29.05px] text-[#333] mb-2\"\n    (click)=\"continueWithMail()\"\n    ></verbena-button>\n    <verbena-button\n    svg=\"2fa-sms\"\n    [svgHeight]=\"24\"\n    [svgWidth]=\"24\"\n    text=\"Continue with SMS\"\n    bgColor=\"white\"\n    textColor=\"#333333\"\n    border=\"1px solid #333\"\n    borderRadius=\"40px\"\n    pd=\"10px 20px\"\n    width=\"100%\"\n    svgPosition=\"left\"\n    (click)=\"continueWithSMS()\"\n    ></verbena-button>\n    <!-- <div class=\"iconWrapper\" (click)=\"handleSkip()\"> \n        <p class=\"{{paragraphClass}}\">Skip for now</p>\n        <verben-svg \n        icon=\"skip-forward\"\n        [height]=\"24\"\n        [width]=\"24\"\n        />\n    </div> -->\n</div>\n</section>", styles: [".setUpBtnWrapper{display:flex;flex-direction:column;gap:12px;margin-top:40px}.iconWrapper{display:flex;cursor:pointer;align-items:center;justify-content:end;gap:12px;margin-bottom:50px}.custom-button{font-weight:500}\n"], dependencies: [{ kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i2.VerbenaButtonComponent, selector: "verbena-button", inputs: ["text", "icon", "useIcon", "svgPosition", "iconPosition", "bgColor", "textColor", "border", "borderRadius", "pd", "width", "height", "fontSize", "fontWeight", "disable", "svgSize", "weight", "variant", "styleType", "svg", "svgWidth", "svgHeight", "iconColor", "svgColor", "buttonClass", "buttonTextClass", "isLoading", "spinnerSize", "spinnerColor"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: TwoFactorAuthSetupComponent, selector: "verben-two-factor-auth-setup", inputs: { customClass: "customClass", headlingClass: "headlingClass", headlingText: "headlingText", paragraphClass: "paragraphClass", buttonClass: "buttonClass", width: "width", maxWidth: "maxWidth", margin: "margin", pd: "pd", bgColor: "bgColor", boxShadow: "boxShadow", border: "border", borderRadius: "borderRadius", textColor: "textColor", height: "height" }, outputs: { smsClick: "smsClick", mailClick: "mailClick", skipClick: "skipClick" }, ngImport: i0, template: "<section\n[ngStyle]=\"styles\"\nclass=\"{{ customClass }}\"\n>\n  <h3 class=\"{{headlingClass}}\">{{headlingText}}</h3>\n  <div class=\"setUpBtnWrapper\">\n    <verbena-button\n    svg=\"2fa-mail\"\n    [svgHeight]=\"16\"\n    [svgWidth]=\"20\"\n    text=\"Continue with Mail\"\n    bgColor=\"white\"\n    textColor=\"#333333\"\n    border=\"1px solid #333\"\n    borderRadius=\"40px\"\n    pd=\"10px 20px\"\n    width=\"100%\"\n    svgPosition=\"left\"\n    buttonClass=\"font-normal text-[24px] leading-[29.05px] text-[#333] mb-2\"\n    (click)=\"continueWithMail()\"\n    ></verbena-button>\n    <verbena-button\n    svg=\"2fa-sms\"\n    [svgHeight]=\"24\"\n    [svgWidth]=\"24\"\n    text=\"Continue with SMS\"\n    bgColor=\"white\"\n    textColor=\"#333333\"\n    border=\"1px solid #333\"\n    borderRadius=\"40px\"\n    pd=\"10px 20px\"\n    width=\"100%\"\n    svgPosition=\"left\"\n    (click)=\"continueWithSMS()\"\n    ></verbena-button>\n    <!-- <div class=\"iconWrapper\" (click)=\"handleSkip()\"> \n        <p class=\"{{paragraphClass}}\">Skip for now</p>\n        <verben-svg \n        icon=\"skip-forward\"\n        [height]=\"24\"\n        [width]=\"24\"\n        />\n    </div> -->\n</div>\n</section>", styles: [".setUpBtnWrapper{display:flex;flex-direction:column;gap:12px;margin-top:40px}.iconWrapper{display:flex;cursor:pointer;align-items:center;justify-content:end;gap:12px;margin-bottom:50px}.custom-button{font-weight:500}\n"], dependencies: [{ kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i2.VerbenaButtonComponent, selector: "verbena-button", inputs: ["type", "text", "icon", "useIcon", "svgPosition", "iconPosition", "bgColor", "textColor", "border", "borderRadius", "pd", "width", "height", "fontSize", "fontWeight", "disable", "svgSize", "weight", "variant", "styleType", "svg", "svgWidth", "svgHeight", "iconColor", "svgColor", "buttonClass", "buttonTextClass", "isLoading", "spinnerSize", "spinnerColor"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TwoFactorAuthSetupComponent, decorators: [{
             type: Component,

package/esm2022/src/lib/components/user-management/user-management-form/user-management-form.component.mjs

@@ -92,7 +92,7 @@ export class UserManagementFormComponent {
         console.log('Delete requested');
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: UserManagementFormComponent, deps: [{ token: i1.FormBuilder }, { token: i2.UserManagementService }, { token: i3.EnvironmentService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: UserManagementFormComponent, selector: "lib-user-request-form", inputs: { currentData: "currentData", roles: "roles", tags: "tags" }, outputs: { switchView: "switchView", onFormSave: "onFormSave" }, ngImport: i0, template: "<form [formGroup]=\"form\" class=\"flex flex-col px-3 pb-3 rounded-xl h-full w-full relative space-y-4\">\n  <verbena-input label=\"First Name:\" name=\"FirstName\" type=\"text\" formControlName=\"FirstName\" />\n  <verbena-input label=\"Last Name:\" name=\"LastName\" type=\"text\" formControlName=\"LastName\" />\n  <verbena-input label=\"Phone Number:\" name=\"PhoneNumber\" type=\"tel\" formControlName=\"PhoneNumber\" />\n  <verbena-input name=\"MailAddress\" label=\"E-Mail Address:\" [type]=\"'email'\" formControlName=\"MailAddress\" />\n  <!-- <verbena-input\n    label=\"Address\"\n    name=\"Address\"\n    type=\"text\"\n    formControlName=\"Address\"\n  /> -->\n\n  <div class=\"space-y-1\">\n    <label for=\"role\">Role</label>\n\n    <verben-drop-down label=\"Role\" styleClass=\"w-full\" width=\"100%\" [multiselect]=\"false\" [filter]=\"true\"\n      [showClear]=\"true\" placeholder=\"\" [(options)]=\"roles\" id=\"role\" optionLabel=\"Name\" optionValue=\"Code\"\n      formControlName=\"RoleID\" class=\"form-control\">\n    </verben-drop-down>\n  </div>\n\n  <div class=\"space-y-1\">\n    <label for=\"tags\">Tags</label>\n\n    <verben-drop-down label=\"Tags\" styleClass=\"w-full\" width=\"100%\" [multiselect]=\"true\" [filter]=\"true\"\n      [showClear]=\"true\" placeholder=\"\" [(options)]=\"tags\" id=\"tags\" optionLabel=\"Name\" optionValue=\"Code\"\n      formControlName=\"Tags\" class=\"form-control\">\n    </verben-drop-down>\n  </div>\n\n  <!-- <div class=\"space-y-1\">\n    <label for=\"warehouses\">Warehouses</label>\n\n    <verben-drop-down label=\"Warehouses\" styleClass=\"w-full\" width=\"100%\" [multiselect]=\"true\" [filter]=\"true\"\n      [showClear]=\"true\" placeholder=\"\" [(options)]=\"warehouses\" id=\"warehouses\" optionLabel=\"Name\" optionValue=\"Code\"\n      formControlName=\"Warehouses\" (onChange)=\"onWarehouseChange($event)\" class=\"form-control\">\n    </verben-drop-down>\n  </div> -->\n\n  <div class=\"space-y-1\">\n    <label for=\"status\">Status</label>\n\n    <verben-drop-down styleClass=\"w-full\" width=\"100%\" [multiselect]=\"false\" [filter]=\"false\" [showClear]=\"false\"\n      placeholder=\"\" [(options)]=\"statusOptions\" id=\"status\" formControlName=\"Status\" class=\"form-control\">\n    </verben-drop-down>\n  </div>\n</form>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i4.VerbenaInputComponent, selector: "verbena-input", inputs: ["label", "placeHolder", "required", "svgPosition", "minLength", "maxLength", "type", "bgColor", "border", "borderRadius", "textColor", "value", "labelPosition", "labelColor", "disable", "readOnly", "min", "max", "showBorder", "showErrorMessage", "errorMessageColor", "errorBorderColor", "errorPosition", "svg", "fontSize", "svgWidth", "svgHeight", "svgColor", "capitalization", "inputContainerClass", "inputFieldClass", "passLength", "inputWrapperClass", "passwordToggle", "customErrorMessages", "icon", "textPass"], outputs: ["valueChange"] }, { kind: "component", type: i4.DropDownComponent, selector: "verben-drop-down", inputs: ["options", "width", "showHorizontalLine", "horizontalLineColor", "optionLabel", "optionSubLabel", "optionValue", "placeholder", "invalidMessage", "errorPosition", "loadMoreCaption", "display", "showClear", "lazyLoad", "selectKey", "styleClass", "group", "multiselect", "filter", "avoidDuplication", "filterBy", "debounceTime", "minChar", "disabled", "required", "load", "asyncLabel", "search"], outputs: ["optionsChange", "onChange", "onClick", "onClear"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: UserManagementFormComponent, selector: "lib-user-request-form", inputs: { currentData: "currentData", roles: "roles", tags: "tags" }, outputs: { switchView: "switchView", onFormSave: "onFormSave" }, ngImport: i0, template: "<form [formGroup]=\"form\" class=\"flex flex-col px-3 pb-3 rounded-xl h-full w-full relative space-y-4\">\n  <verbena-input label=\"First Name:\" name=\"FirstName\" type=\"text\" formControlName=\"FirstName\" />\n  <verbena-input label=\"Last Name:\" name=\"LastName\" type=\"text\" formControlName=\"LastName\" />\n  <verbena-input label=\"Phone Number:\" name=\"PhoneNumber\" type=\"tel\" formControlName=\"PhoneNumber\" />\n  <verbena-input name=\"MailAddress\" label=\"E-Mail Address:\" [type]=\"'email'\" formControlName=\"MailAddress\" />\n  <!-- <verbena-input\n    label=\"Address\"\n    name=\"Address\"\n    type=\"text\"\n    formControlName=\"Address\"\n  /> -->\n\n  <div class=\"space-y-1\">\n    <label for=\"role\">Role</label>\n\n    <verben-drop-down label=\"Role\" styleClass=\"w-full\" width=\"100%\" [multiselect]=\"false\" [filter]=\"true\"\n      [showClear]=\"true\" placeholder=\"\" [(options)]=\"roles\" id=\"role\" optionLabel=\"Name\" optionValue=\"Code\"\n      formControlName=\"RoleID\" class=\"form-control\">\n    </verben-drop-down>\n  </div>\n\n  <div class=\"space-y-1\">\n    <label for=\"tags\">Tags</label>\n\n    <verben-drop-down label=\"Tags\" styleClass=\"w-full\" width=\"100%\" [multiselect]=\"true\" [filter]=\"true\"\n      [showClear]=\"true\" placeholder=\"\" [(options)]=\"tags\" id=\"tags\" optionLabel=\"Name\" optionValue=\"Code\"\n      formControlName=\"Tags\" class=\"form-control\">\n    </verben-drop-down>\n  </div>\n\n  <!-- <div class=\"space-y-1\">\n    <label for=\"warehouses\">Warehouses</label>\n\n    <verben-drop-down label=\"Warehouses\" styleClass=\"w-full\" width=\"100%\" [multiselect]=\"true\" [filter]=\"true\"\n      [showClear]=\"true\" placeholder=\"\" [(options)]=\"warehouses\" id=\"warehouses\" optionLabel=\"Name\" optionValue=\"Code\"\n      formControlName=\"Warehouses\" (onChange)=\"onWarehouseChange($event)\" class=\"form-control\">\n    </verben-drop-down>\n  </div> -->\n\n  <div class=\"space-y-1\">\n    <label for=\"status\">Status</label>\n\n    <verben-drop-down styleClass=\"w-full\" width=\"100%\" [multiselect]=\"false\" [filter]=\"false\" [showClear]=\"false\"\n      placeholder=\"\" [(options)]=\"statusOptions\" id=\"status\" formControlName=\"Status\" class=\"form-control\">\n    </verben-drop-down>\n  </div>\n</form>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i4.VerbenaInputComponent, selector: "verbena-input", inputs: ["disabled", "label", "placeHolder", "required", "svgPosition", "minLength", "maxLength", "type", "bgColor", "border", "borderRadius", "textColor", "value", "labelPosition", "labelColor", "disable", "readOnly", "min", "max", "showBorder", "showErrorMessage", "errorMessageColor", "errorBorderColor", "errorPosition", "svg", "fontSize", "svgWidth", "svgHeight", "svgColor", "capitalization", "inputContainerClass", "inputFieldClass", "passLength", "inputWrapperClass", "passwordToggle", "customErrorMessages", "icon", "textPass"], outputs: ["valueChange"] }, { kind: "component", type: i4.DropDownComponent, selector: "verben-drop-down", inputs: ["options", "width", "overlayWidth", "showHorizontalLine", "horizontalLineColor", "optionLabel", "optionSubLabel", "optionValue", "placeholder", "invalidMessage", "errorPosition", "loadMoreCaption", "display", "showClear", "lazyLoad", "selectKey", "styleClass", "group", "multiselect", "filter", "avoidDuplication", "filterBy", "debounceTime", "minChar", "refPageSize", "disabled", "required", "load", "asyncLabel", "search"], outputs: ["optionsChange", "onChange", "onClick", "onClear"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: UserManagementFormComponent, decorators: [{
             type: Component,