@piserve-tech/form-submission 1.3.58 → 1.3.60

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (9) hide show
  1. package/esm2022/form-fields/date-time-fields/date-time-fields.component.mjs +2 -2
  2. package/esm2022/form-fields/terms-and-condition-fields/terms-and-condition-fields.component.mjs +2 -2
  3. package/esm2022/form-submission/next-prev-navigation/next-prev-navigation.component.mjs +2 -2
  4. package/esm2022/form-submission/submit-form/submit-form.component.mjs +14 -1
  5. package/esm2022/sub-form/submission-modal/submission-modal.component.mjs +2 -2
  6. package/fesm2022/piserve-tech-form-submission.mjs +21 -8
  7. package/fesm2022/piserve-tech-form-submission.mjs.map +1 -1
  8. package/form-submission/submit-form/submit-form.component.d.ts +1 -0
  9. package/package.json +1 -1
package/esm2022/form-fields/date-time-fields/date-time-fields.component.mjs CHANGED
@@ -396,11 +396,11 @@ export class DateTimeFieldsComponent {
396
396
  return date;
397
397
  }
398
398
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DateTimeFieldsComponent, deps: [{ token: i1.DatePipe }], target: i0.ɵɵFactoryTarget.Component }); }
399
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: DateTimeFieldsComponent, selector: "lib-date-time-fields", inputs: { question: "question" }, providers: [DatePipe], viewQueries: [{ propertyName: "datepicker", first: true, predicate: ["datepickerYMD"], descendants: true }, { propertyName: "dateRangePicker", first: true, predicate: ["daterangepicker"], descendants: true }, { propertyName: "dateAndTimePicker", first: true, predicate: ["dateAndTimePicker"], descendants: true }], ngImport: i0, template: "<div class=\"mb-5 px-3\">\r\n <div class=\"input-wrapper mb-2\">\r\n <div [innerHTML]=\"question.questionNumber\"></div>\r\n &nbsp;&nbsp; <label>{{ question.question }}</label\r\n >&nbsp;\r\n <span class=\"text-danger\" *ngIf=\"required\">*</span>\r\n <div\r\n class=\"svg-wrapper mb-2 hintIcon\"\r\n [attr.data-title]=\"hint\"\r\n *ngIf=\"hint\"\r\n >\r\n <svg\r\n class=\"hintSvg\"\r\n viewBox=\"0 0 30 30\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n >\r\n <path\r\n fill-rule=\"evenodd\"\r\n clip-rule=\"evenodd\"\r\n d=\"M15 26.25V26.25C8.78625 26.25 3.75 21.2138 3.75 15V15C3.75 8.78625 8.78625 3.75 15 3.75V3.75C21.2138 3.75 26.25 8.78625 26.25 15V15C26.25 21.2138 21.2138 26.25 15 26.25Z\"\r\n stroke=\"#323232\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n d=\"M15 16.5623V16.2498C15 15.2285 15.6312 14.6748 16.2637 14.2498C16.8812 13.8335 17.5 13.291 17.5 12.291C17.5 10.9098 16.3813 9.79102 15 9.79102C13.6187 9.79102 12.5 10.9098 12.5 12.291\"\r\n stroke=\"#323232\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n d=\"M14.9988 20C14.8263 20 14.6863 20.14 14.6875 20.3125C14.6875 20.485 14.8275 20.625 15 20.625C15.1725 20.625 15.3125 20.485 15.3125 20.3125C15.3125 20.14 15.1725 20 14.9988 20\"\r\n stroke=\"#323232\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n </svg>\r\n </div>\r\n </div>\r\n <ng-container *ngIf=\"dateType === 'DATE_ONLY'\">\r\n <!-- Date only picker -->\r\n <div class=\"input-container\">\r\n <input\r\n class=\"form-control height\"\r\n #datepickerYMD=\"bsDatepicker\"\r\n bsDatepicker\r\n [minDate]=\"minDate ? minDate : undefined\"\r\n [maxDate]=\"maxDate ? maxDate : undefined\"\r\n [bsConfig]=\"{ dateInputFormat: format }\"\r\n [(ngModel)]=\"selectedDate\"\r\n (blur)=\"validateField()\"\r\n (ngModelChange)=\"validateField()\"\r\n [class.invalid]=\"validationFailed\"\r\n placeholder=\"Select date\"\r\n />\r\n <i\r\n class=\"fa-solid fa-calendar-days calendar-icon text-primary fs-5\"\r\n (click)=\"openDatePicker()\"\r\n ></i>\r\n </div>\r\n <div *ngIf=\"validationFailed\" class=\"text-danger mt-2\">\r\n <svg\r\n class=\"validationSvg\"\r\n viewBox=\"0 0 24 24\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n >\r\n <path\r\n d=\"M12.001 16.75C12.139 16.75 12.251 16.638 12.25 16.5C12.25 16.362 12.138 16.25 12 16.25C11.862 16.25 11.75 16.362 11.75 16.5C11.75 16.638 11.862 16.75 12.001 16.75\"\r\n stroke=\"white\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n fill-rule=\"evenodd\"\r\n clip-rule=\"evenodd\"\r\n d=\"M12 21C7.029 21 3 16.971 3 12C3 7.029 7.029 3 12 3C16.971 3 21 7.029 21 12C21 16.971 16.971 21 12 21Z\"\r\n fill=\"#FF0000\"\r\n stroke=\"#FF0000\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n d=\"M12 12.75L12 7.75\"\r\n stroke=\"white\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <circle cx=\"12\" cy=\"16\" r=\"1\" fill=\"white\" />\r\n </svg>\r\n {{ validationMessage }}\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"dateType === 'TIME_ONLY'\">\r\n <!-- Time picker -->\r\n\r\n\r\n<div class=\"input-container\">\r\n <input\r\n class=\"form-control height appearanceInput mt-3\"\r\n aria-label=\"Select time\"\r\n placeholder=\"Select time\"\r\n readonly\r\n [format]=\"timeFormat==='24'?24:12\"\r\n [ngxTimepicker]=\"fullTime3\"\r\n [(ngModel)]=\"selectedTime\"\r\n [max]=\"maxTime\"\r\n [min]=\"minTime\"\r\n (ngModelChange)=\"validateField()\"\r\n [class.invalid]=\"validationFailed\"\r\n />\r\n \r\n <i\r\n id=\"startDateIcon\"\r\n class=\"fa-solid fa-clock text-primary fs-6 clock-icon\"\r\n (click)=\"fullTime3.open()\"\r\n style=\"cursor: pointer;\"\r\n></i>\r\n <ngx-material-timepicker #fullTime3></ngx-material-timepicker>\r\n</div>\r\n <div *ngIf=\"validationFailed\" class=\"text-danger mt-2\">\r\n <svg\r\n class=\"validationSvg\"\r\n viewBox=\"0 0 24 24\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n >\r\n <path\r\n d=\"M12.001 16.75C12.139 16.75 12.251 16.638 12.25 16.5C12.25 16.362 12.138 16.25 12 16.25C11.862 16.25 11.75 16.362 11.75 16.5C11.75 16.638 11.862 16.75 12.001 16.75\"\r\n stroke=\"white\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n fill-rule=\"evenodd\"\r\n clip-rule=\"evenodd\"\r\n d=\"M12 21C7.029 21 3 16.971 3 12C3 7.029 7.029 3 12 3C16.971 3 21 7.029 21 12C21 16.971 16.971 21 12 21Z\"\r\n fill=\"#FF0000\"\r\n stroke=\"#FF0000\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n d=\"M12 12.75L12 7.75\"\r\n stroke=\"white\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <circle cx=\"12\" cy=\"16\" r=\"1\" fill=\"white\" />\r\n </svg>\r\n {{ validationMessage }}\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"dateType === 'DATE_AND_TIME'\">\r\n <!-- Date and time picker -->\r\n <div class=\"input-container\">\r\n <input\r\n #dateAndTimePicker=\"bsDatepicker\"\r\n type=\"text\"\r\n class=\"form-control height\"\r\n [minDate]=\"minDate ? minDate : undefined\"\r\n [maxDate]=\"maxDate ? maxDate : undefined\"\r\n [bsConfig]=\"{\r\n dateInputFormat: format\r\n }\"\r\n placeholder=\"Select date\"\r\n bsDatepicker\r\n [class.invalid]=\"validationFailed\"\r\n [(ngModel)]=\"selectedDateAndTime\"\r\n (blur)=\"validateField()\"\r\n (ngModelChange)=\"validateField()\"\r\n />\r\n <i\r\n class=\"fa-solid fa-calendar-days calendar-icon text-primary fs-5\"\r\n (click)=\"openDateAndTimePicker()\"\r\n ></i>\r\n </div>\r\n <div class=\"input-container\" *ngIf=\"selectedDateAndTime && selectedDateAndTime != null\">\r\n <input\r\n \r\n class=\"form-control height appearanceInput mt-3\"\r\n aria-label=\"Select time\"\r\n placeholder=\"Select time\"\r\n readonly\r\n [format]=\"timeFormat==='24'?24:12\"\r\n [ngxTimepicker]=\"fullTime4\"\r\n [(ngModel)]=\"selectedTime\"\r\n [max]=\"maxTime\"\r\n [min]=\"minTime\"\r\n (ngModelChange)=\"validateField()\"\r\n [class.invalid]=\"timeValidationFailed\"\r\n />\r\n \r\n <i\r\n id=\"startDateIcon\"\r\n class=\"fa-solid fa-clock text-primary fs-6 clock-icon\"\r\n (click)=\"fullTime4.open()\"\r\n style=\"cursor: pointer;\"\r\n ></i>\r\n <ngx-material-timepicker #fullTime4></ngx-material-timepicker>\r\n </div>\r\n \r\n <div *ngIf=\"validationFailed || timeValidationFailed\" class=\"text-danger mt-2\">\r\n <svg\r\n class=\"validationSvg\"\r\n viewBox=\"0 0 24 24\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n >\r\n <path\r\n d=\"M12.001 16.75C12.139 16.75 12.251 16.638 12.25 16.5C12.25 16.362 12.138 16.25 12 16.25C11.862 16.25 11.75 16.362 11.75 16.5C11.75 16.638 11.862 16.75 12.001 16.75\"\r\n stroke=\"white\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n fill-rule=\"evenodd\"\r\n clip-rule=\"evenodd\"\r\n d=\"M12 21C7.029 21 3 16.971 3 12C3 7.029 7.029 3 12 3C16.971 3 21 7.029 21 12C21 16.971 16.971 21 12 21Z\"\r\n fill=\"#FF0000\"\r\n stroke=\"#FF0000\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n d=\"M12 12.75L12 7.75\"\r\n stroke=\"white\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <circle cx=\"12\" cy=\"16\" r=\"1\" fill=\"white\" />\r\n </svg>\r\n {{ validationMessage }}\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"dateType === 'DATE_RANGE'\">\r\n <!-- Date range picker -->\r\n <div class=\"input-container\">\r\n <input\r\n type=\"text\"\r\n class=\"form-control height\"\r\n #daterangepicker=\"bsDaterangepicker\"\r\n bsDaterangepicker\r\n placeholder=\"Select date\"\r\n [minDate]=\"minDate ? minDate : undefined\"\r\n [maxDate]=\"maxDate ? maxDate : undefined\"\r\n [bsConfig]=\"{\r\n rangeInputFormat: format,\r\n dateInputFormat: format,\r\n }\"\r\n [(ngModel)]=\"selectedDateRange\"\r\n (blur)=\"validateField()\"\r\n (ngModelChange)=\"validateField()\"\r\n [class.invalid]=\"validationFailed\"\r\n />\r\n <i\r\n class=\"fa-solid fa-calendar-days calendar-icon text-primary fs-5\"\r\n (click)=\"openDateRangePicker()\"\r\n ></i>\r\n </div>\r\n <div *ngIf=\"validationFailed\" class=\"text-danger mt-2\">\r\n <svg\r\n class=\"validationSvg\"\r\n viewBox=\"0 0 24 24\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n >\r\n <path\r\n d=\"M12.001 16.75C12.139 16.75 12.251 16.638 12.25 16.5C12.25 16.362 12.138 16.25 12 16.25C11.862 16.25 11.75 16.362 11.75 16.5C11.75 16.638 11.862 16.75 12.001 16.75\"\r\n stroke=\"white\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n fill-rule=\"evenodd\"\r\n clip-rule=\"evenodd\"\r\n d=\"M12 21C7.029 21 3 16.971 3 12C3 7.029 7.029 3 12 3C16.971 3 21 7.029 21 12C21 16.971 16.971 21 12 21Z\"\r\n fill=\"#FF0000\"\r\n stroke=\"#FF0000\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n d=\"M12 12.75L12 7.75\"\r\n stroke=\"white\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <circle cx=\"12\" cy=\"16\" r=\"1\" fill=\"white\" />\r\n </svg>\r\n {{ validationMessage }}\r\n </div>\r\n </ng-container>\r\n</div>\r\n", styles: [".input-wrapper{display:flex;align-items:flex-start}.svg-wrapper{margin-inline-start:auto;z-index:999}.hintIcon{position:relative;cursor:pointer}.hintIcon:hover:before{content:attr(data-title);position:absolute;top:calc(100% + 2px);right:0;padding:4px 8px;border-radius:4px;background-color:#1d252d;color:#8e9aa0;font-size:14px;min-width:300px;word-wrap:break-word;word-break:break-word;text-align:center;white-space:normal}.hintIcon:hover:after{content:\"\";position:absolute;top:calc(100% - 26px);left:50%;border:solid transparent;border-width:18px;border-bottom-color:#1d252d;transform:translate(-50%)}.height{height:42px}.invalid{border-color:red}.hintSvg{width:30px;height:30px;fill:none}.validationSvg{width:24px;height:24px;fill:none}.input-container{position:relative}.input-container .form-control{padding-right:30px}.input-container .calendar-icon,.clock-icon{position:absolute;top:50%;right:10px;transform:translateY(-50%);cursor:pointer}.appearanceInput{background-color:#fff}::ng-deep ngx-material-timepicker-content{--body-background-color: #fff;--primary-font-family: \"Roboto\",sans-serif;--button-color: #0637b2 !important;--dial-active-color: #fff;--dial-inactive-color: rgba(255, 255, 255, .5);--dial-background-color: #0637b2 !important;--dial-editable-active-color: #0637b2 !important;--dial-editable-background-color: #fff;--clock-face-time-active-color: #fff;--clock-face-time-inactive-color: #6c6c6c;--clock-face-inner-time-inactive-color: #929292;--clock-face-time-disabled-color: #c5c5c5;--clock-face-background-color: #f0f0f0;--clock-hand-color: #0637b2 !important;position:relative;z-index:99999999}::ng-deep ngx-material-timepicker-container{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#00000052;z-index:99998}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3.BsDatepickerDirective, selector: "[bsDatepicker]", inputs: ["placement", "triggers", "outsideClick", "container", "outsideEsc", "isDisabled", "minDate", "maxDate", "minMode", "daysDisabled", "datesDisabled", "datesEnabled", "dateCustomClasses", "dateTooltipTexts", "isOpen", "bsValue", "bsConfig"], outputs: ["onShown", "onHidden", "bsValueChange"], exportAs: ["bsDatepicker"] }, { kind: "directive", type: i3.BsDatepickerInputDirective, selector: "input[bsDatepicker]" }, { kind: "directive", type: i3.BsDaterangepickerDirective, selector: "[bsDaterangepicker]", inputs: ["placement", "triggers", "outsideClick", "container", "outsideEsc", "isOpen", "bsValue", "bsConfig", "isDisabled", "minDate", "maxDate", "dateCustomClasses", "daysDisabled", "datesDisabled", "datesEnabled"], outputs: ["onShown", "onHidden", "bsValueChange"], exportAs: ["bsDaterangepicker"] }, { kind: "directive", type: i3.BsDaterangepickerInputDirective, selector: "input[bsDaterangepicker]" }, { kind: "component", type: i4.NgxMaterialTimepickerComponent, selector: "ngx-material-timepicker", inputs: ["cancelBtnTmpl", "editableHintTmpl", "confirmBtnTmpl", "ESC", "enableKeyboardInput", "preventOverlayClick", "disableAnimation", "appendToInput", "hoursOnly", "defaultTime", "timepickerClass", "theme", "min", "max", "ngxMaterialTimepickerTheme", "format", "minutesGap"], outputs: ["timeSet", "opened", "closed", "hourSelected", "timeChanged"] }, { kind: "directive", type: i4.TimepickerDirective, selector: "[ngxTimepicker]", inputs: ["format", "min", "max", "ngxTimepicker", "value", "disabled", "disableClick"] }] }); }
399
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: DateTimeFieldsComponent, selector: "lib-date-time-fields", inputs: { question: "question" }, providers: [DatePipe], viewQueries: [{ propertyName: "datepicker", first: true, predicate: ["datepickerYMD"], descendants: true }, { propertyName: "dateRangePicker", first: true, predicate: ["daterangepicker"], descendants: true }, { propertyName: "dateAndTimePicker", first: true, predicate: ["dateAndTimePicker"], descendants: true }], ngImport: i0, template: "<div class=\"mb-5 px-3\">\r\n <div class=\"input-wrapper mb-2\">\r\n <div [innerHTML]=\"question.questionNumber\"></div>\r\n &nbsp;&nbsp; <label>{{ question.question }}</label\r\n >&nbsp;\r\n <span class=\"text-danger\" *ngIf=\"required\">*</span>\r\n <div\r\n class=\"svg-wrapper mb-2 hintIcon\"\r\n [attr.data-title]=\"hint\"\r\n *ngIf=\"hint\"\r\n >\r\n <svg\r\n class=\"hintSvg\"\r\n viewBox=\"0 0 30 30\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n >\r\n <path\r\n fill-rule=\"evenodd\"\r\n clip-rule=\"evenodd\"\r\n d=\"M15 26.25V26.25C8.78625 26.25 3.75 21.2138 3.75 15V15C3.75 8.78625 8.78625 3.75 15 3.75V3.75C21.2138 3.75 26.25 8.78625 26.25 15V15C26.25 21.2138 21.2138 26.25 15 26.25Z\"\r\n stroke=\"#323232\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n d=\"M15 16.5623V16.2498C15 15.2285 15.6312 14.6748 16.2637 14.2498C16.8812 13.8335 17.5 13.291 17.5 12.291C17.5 10.9098 16.3813 9.79102 15 9.79102C13.6187 9.79102 12.5 10.9098 12.5 12.291\"\r\n stroke=\"#323232\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n d=\"M14.9988 20C14.8263 20 14.6863 20.14 14.6875 20.3125C14.6875 20.485 14.8275 20.625 15 20.625C15.1725 20.625 15.3125 20.485 15.3125 20.3125C15.3125 20.14 15.1725 20 14.9988 20\"\r\n stroke=\"#323232\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n </svg>\r\n </div>\r\n </div>\r\n <ng-container *ngIf=\"dateType === 'DATE_ONLY'\">\r\n <!-- Date only picker -->\r\n <div class=\"input-container\">\r\n <input\r\n class=\"form-control height\"\r\n #datepickerYMD=\"bsDatepicker\"\r\n bsDatepicker\r\n [minDate]=\"minDate ? minDate : undefined\"\r\n [maxDate]=\"maxDate ? maxDate : undefined\"\r\n [bsConfig]=\"{ dateInputFormat: format }\"\r\n [(ngModel)]=\"selectedDate\"\r\n (blur)=\"validateField()\"\r\n (ngModelChange)=\"validateField()\"\r\n [class.invalid]=\"validationFailed\"\r\n placeholder=\"Select date\"\r\n />\r\n <i\r\n class=\"fa-solid fa-calendar-days calendar-icon text-primary fs-5\"\r\n (click)=\"openDatePicker()\"\r\n ></i>\r\n </div>\r\n <div *ngIf=\"validationFailed\" class=\"text-danger mt-2\">\r\n <svg\r\n class=\"validationSvg\"\r\n viewBox=\"0 0 24 24\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n >\r\n <path\r\n d=\"M12.001 16.75C12.139 16.75 12.251 16.638 12.25 16.5C12.25 16.362 12.138 16.25 12 16.25C11.862 16.25 11.75 16.362 11.75 16.5C11.75 16.638 11.862 16.75 12.001 16.75\"\r\n stroke=\"white\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n fill-rule=\"evenodd\"\r\n clip-rule=\"evenodd\"\r\n d=\"M12 21C7.029 21 3 16.971 3 12C3 7.029 7.029 3 12 3C16.971 3 21 7.029 21 12C21 16.971 16.971 21 12 21Z\"\r\n fill=\"#FF0000\"\r\n stroke=\"#FF0000\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n d=\"M12 12.75L12 7.75\"\r\n stroke=\"white\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <circle cx=\"12\" cy=\"16\" r=\"1\" fill=\"white\" />\r\n </svg>\r\n {{ validationMessage }}\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"dateType === 'TIME_ONLY'\">\r\n <!-- Time picker -->\r\n\r\n\r\n<div class=\"input-container\">\r\n <input\r\n class=\"form-control height appearanceInput mt-3\"\r\n aria-label=\"Select time\"\r\n placeholder=\"Select time\"\r\n readonly\r\n [format]=\"timeFormat==='24'?24:12\"\r\n [ngxTimepicker]=\"fullTime3\"\r\n [(ngModel)]=\"selectedTime\"\r\n [max]=\"maxTime\"\r\n [min]=\"minTime\"\r\n (ngModelChange)=\"validateField()\"\r\n [class.invalid]=\"validationFailed\"\r\n />\r\n \r\n <i\r\n id=\"startDateIcon\"\r\n class=\"fa-solid fa-clock text-primary fs-6 clock-icon\"\r\n (click)=\"fullTime3.open()\"\r\n style=\"cursor: pointer;\"\r\n></i>\r\n <ngx-material-timepicker #fullTime3></ngx-material-timepicker>\r\n</div>\r\n <div *ngIf=\"validationFailed\" class=\"text-danger mt-2\">\r\n <svg\r\n class=\"validationSvg\"\r\n viewBox=\"0 0 24 24\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n >\r\n <path\r\n d=\"M12.001 16.75C12.139 16.75 12.251 16.638 12.25 16.5C12.25 16.362 12.138 16.25 12 16.25C11.862 16.25 11.75 16.362 11.75 16.5C11.75 16.638 11.862 16.75 12.001 16.75\"\r\n stroke=\"white\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n fill-rule=\"evenodd\"\r\n clip-rule=\"evenodd\"\r\n d=\"M12 21C7.029 21 3 16.971 3 12C3 7.029 7.029 3 12 3C16.971 3 21 7.029 21 12C21 16.971 16.971 21 12 21Z\"\r\n fill=\"#FF0000\"\r\n stroke=\"#FF0000\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n d=\"M12 12.75L12 7.75\"\r\n stroke=\"white\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <circle cx=\"12\" cy=\"16\" r=\"1\" fill=\"white\" />\r\n </svg>\r\n {{ validationMessage }}\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"dateType === 'DATE_AND_TIME'\">\r\n <!-- Date and time picker -->\r\n <div class=\"input-container\">\r\n <input\r\n #dateAndTimePicker=\"bsDatepicker\"\r\n type=\"text\"\r\n class=\"form-control height\"\r\n [minDate]=\"minDate ? minDate : undefined\"\r\n [maxDate]=\"maxDate ? maxDate : undefined\"\r\n [bsConfig]=\"{\r\n dateInputFormat: format\r\n }\"\r\n placeholder=\"Select date\"\r\n bsDatepicker\r\n [class.invalid]=\"validationFailed\"\r\n [(ngModel)]=\"selectedDateAndTime\"\r\n (blur)=\"validateField()\"\r\n (ngModelChange)=\"validateField()\"\r\n />\r\n <i\r\n class=\"fa-solid fa-calendar-days calendar-icon text-primary fs-5\"\r\n (click)=\"openDateAndTimePicker()\"\r\n ></i>\r\n </div>\r\n <div class=\"input-container\" *ngIf=\"selectedDateAndTime && selectedDateAndTime != null\">\r\n <input\r\n \r\n class=\"form-control height appearanceInput mt-3\"\r\n aria-label=\"Select time\"\r\n placeholder=\"Select time\"\r\n readonly\r\n [format]=\"timeFormat==='24'?24:12\"\r\n [ngxTimepicker]=\"fullTime4\"\r\n [(ngModel)]=\"selectedTime\"\r\n [max]=\"maxTime\"\r\n [min]=\"minTime\"\r\n (ngModelChange)=\"validateField()\"\r\n [class.invalid]=\"timeValidationFailed\"\r\n />\r\n \r\n <i\r\n id=\"startDateIcon\"\r\n class=\"fa-solid fa-clock text-primary fs-6 clock-icon\"\r\n (click)=\"fullTime4.open()\"\r\n style=\"cursor: pointer;\"\r\n ></i>\r\n <ngx-material-timepicker #fullTime4></ngx-material-timepicker>\r\n </div>\r\n \r\n <div *ngIf=\"validationFailed || timeValidationFailed\" class=\"text-danger mt-2\">\r\n <svg\r\n class=\"validationSvg\"\r\n viewBox=\"0 0 24 24\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n >\r\n <path\r\n d=\"M12.001 16.75C12.139 16.75 12.251 16.638 12.25 16.5C12.25 16.362 12.138 16.25 12 16.25C11.862 16.25 11.75 16.362 11.75 16.5C11.75 16.638 11.862 16.75 12.001 16.75\"\r\n stroke=\"white\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n fill-rule=\"evenodd\"\r\n clip-rule=\"evenodd\"\r\n d=\"M12 21C7.029 21 3 16.971 3 12C3 7.029 7.029 3 12 3C16.971 3 21 7.029 21 12C21 16.971 16.971 21 12 21Z\"\r\n fill=\"#FF0000\"\r\n stroke=\"#FF0000\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n d=\"M12 12.75L12 7.75\"\r\n stroke=\"white\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <circle cx=\"12\" cy=\"16\" r=\"1\" fill=\"white\" />\r\n </svg>\r\n {{ validationMessage }}\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"dateType === 'DATE_RANGE'\">\r\n <!-- Date range picker -->\r\n <div class=\"input-container\">\r\n <input\r\n type=\"text\"\r\n class=\"form-control height\"\r\n #daterangepicker=\"bsDaterangepicker\"\r\n bsDaterangepicker\r\n placeholder=\"Select date\"\r\n [minDate]=\"minDate ? minDate : undefined\"\r\n [maxDate]=\"maxDate ? maxDate : undefined\"\r\n [bsConfig]=\"{\r\n rangeInputFormat: format,\r\n dateInputFormat: format,\r\n }\"\r\n [(ngModel)]=\"selectedDateRange\"\r\n (blur)=\"validateField()\"\r\n (ngModelChange)=\"validateField()\"\r\n [class.invalid]=\"validationFailed\"\r\n />\r\n <i\r\n class=\"fa-solid fa-calendar-days calendar-icon text-primary fs-5\"\r\n (click)=\"openDateRangePicker()\"\r\n ></i>\r\n </div>\r\n <div *ngIf=\"validationFailed\" class=\"text-danger mt-2\">\r\n <svg\r\n class=\"validationSvg\"\r\n viewBox=\"0 0 24 24\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n >\r\n <path\r\n d=\"M12.001 16.75C12.139 16.75 12.251 16.638 12.25 16.5C12.25 16.362 12.138 16.25 12 16.25C11.862 16.25 11.75 16.362 11.75 16.5C11.75 16.638 11.862 16.75 12.001 16.75\"\r\n stroke=\"white\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n fill-rule=\"evenodd\"\r\n clip-rule=\"evenodd\"\r\n d=\"M12 21C7.029 21 3 16.971 3 12C3 7.029 7.029 3 12 3C16.971 3 21 7.029 21 12C21 16.971 16.971 21 12 21Z\"\r\n fill=\"#FF0000\"\r\n stroke=\"#FF0000\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n d=\"M12 12.75L12 7.75\"\r\n stroke=\"white\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <circle cx=\"12\" cy=\"16\" r=\"1\" fill=\"white\" />\r\n </svg>\r\n {{ validationMessage }}\r\n </div>\r\n </ng-container>\r\n</div>\r\n", styles: [".input-wrapper{display:flex;align-items:flex-start}.svg-wrapper{margin-inline-start:auto;z-index:999}.hintIcon{position:relative;cursor:pointer}.hintIcon:hover:before{content:attr(data-title);position:absolute;top:calc(100% + 2px);right:0;padding:4px 8px;border-radius:4px;background-color:#1d252d;color:#8e9aa0;font-size:14px;min-width:300px;word-wrap:break-word;word-break:break-word;text-align:center;white-space:normal}.hintIcon:hover:after{content:\"\";position:absolute;top:calc(100% - 26px);left:50%;border:solid transparent;border-width:18px;border-bottom-color:#1d252d;transform:translate(-50%)}.height{height:42px}.invalid{border-color:red}.hintSvg{width:30px;height:30px;fill:none}.validationSvg{width:24px;height:24px;fill:none}.input-container{position:relative}.input-container .form-control{padding-right:30px}.input-container .calendar-icon,.clock-icon{position:absolute;top:50%;right:10px;transform:translateY(-50%);cursor:pointer}.appearanceInput{background-color:#fff}::ng-deep ngx-material-timepicker-content{--body-background-color: #fff;--button-color: #0637b2 !important;--dial-active-color: #fff;--dial-inactive-color: rgba(255, 255, 255, .5);--dial-background-color: #0637b2 !important;--dial-editable-active-color: #0637b2 !important;--dial-editable-background-color: #fff;--clock-face-time-active-color: #fff;--clock-face-time-inactive-color: #6c6c6c;--clock-face-inner-time-inactive-color: #929292;--clock-face-time-disabled-color: #c5c5c5;--clock-face-background-color: #f0f0f0;--clock-hand-color: #0637b2 !important;position:relative;z-index:99999999}::ng-deep ngx-material-timepicker-container{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#00000052;z-index:99998}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3.BsDatepickerDirective, selector: "[bsDatepicker]", inputs: ["placement", "triggers", "outsideClick", "container", "outsideEsc", "isDisabled", "minDate", "maxDate", "minMode", "daysDisabled", "datesDisabled", "datesEnabled", "dateCustomClasses", "dateTooltipTexts", "isOpen", "bsValue", "bsConfig"], outputs: ["onShown", "onHidden", "bsValueChange"], exportAs: ["bsDatepicker"] }, { kind: "directive", type: i3.BsDatepickerInputDirective, selector: "input[bsDatepicker]" }, { kind: "directive", type: i3.BsDaterangepickerDirective, selector: "[bsDaterangepicker]", inputs: ["placement", "triggers", "outsideClick", "container", "outsideEsc", "isOpen", "bsValue", "bsConfig", "isDisabled", "minDate", "maxDate", "dateCustomClasses", "daysDisabled", "datesDisabled", "datesEnabled"], outputs: ["onShown", "onHidden", "bsValueChange"], exportAs: ["bsDaterangepicker"] }, { kind: "directive", type: i3.BsDaterangepickerInputDirective, selector: "input[bsDaterangepicker]" }, { kind: "component", type: i4.NgxMaterialTimepickerComponent, selector: "ngx-material-timepicker", inputs: ["cancelBtnTmpl", "editableHintTmpl", "confirmBtnTmpl", "ESC", "enableKeyboardInput", "preventOverlayClick", "disableAnimation", "appendToInput", "hoursOnly", "defaultTime", "timepickerClass", "theme", "min", "max", "ngxMaterialTimepickerTheme", "format", "minutesGap"], outputs: ["timeSet", "opened", "closed", "hourSelected", "timeChanged"] }, { kind: "directive", type: i4.TimepickerDirective, selector: "[ngxTimepicker]", inputs: ["format", "min", "max", "ngxTimepicker", "value", "disabled", "disableClick"] }] }); }
400
400
  }
401
401
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DateTimeFieldsComponent, decorators: [{
402
402
  type: Component,
403
- args: [{ selector: 'lib-date-time-fields', providers: [DatePipe], template: "<div class=\"mb-5 px-3\">\r\n <div class=\"input-wrapper mb-2\">\r\n <div [innerHTML]=\"question.questionNumber\"></div>\r\n &nbsp;&nbsp; <label>{{ question.question }}</label\r\n >&nbsp;\r\n <span class=\"text-danger\" *ngIf=\"required\">*</span>\r\n <div\r\n class=\"svg-wrapper mb-2 hintIcon\"\r\n [attr.data-title]=\"hint\"\r\n *ngIf=\"hint\"\r\n >\r\n <svg\r\n class=\"hintSvg\"\r\n viewBox=\"0 0 30 30\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n >\r\n <path\r\n fill-rule=\"evenodd\"\r\n clip-rule=\"evenodd\"\r\n d=\"M15 26.25V26.25C8.78625 26.25 3.75 21.2138 3.75 15V15C3.75 8.78625 8.78625 3.75 15 3.75V3.75C21.2138 3.75 26.25 8.78625 26.25 15V15C26.25 21.2138 21.2138 26.25 15 26.25Z\"\r\n stroke=\"#323232\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n d=\"M15 16.5623V16.2498C15 15.2285 15.6312 14.6748 16.2637 14.2498C16.8812 13.8335 17.5 13.291 17.5 12.291C17.5 10.9098 16.3813 9.79102 15 9.79102C13.6187 9.79102 12.5 10.9098 12.5 12.291\"\r\n stroke=\"#323232\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n d=\"M14.9988 20C14.8263 20 14.6863 20.14 14.6875 20.3125C14.6875 20.485 14.8275 20.625 15 20.625C15.1725 20.625 15.3125 20.485 15.3125 20.3125C15.3125 20.14 15.1725 20 14.9988 20\"\r\n stroke=\"#323232\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n </svg>\r\n </div>\r\n </div>\r\n <ng-container *ngIf=\"dateType === 'DATE_ONLY'\">\r\n <!-- Date only picker -->\r\n <div class=\"input-container\">\r\n <input\r\n class=\"form-control height\"\r\n #datepickerYMD=\"bsDatepicker\"\r\n bsDatepicker\r\n [minDate]=\"minDate ? minDate : undefined\"\r\n [maxDate]=\"maxDate ? maxDate : undefined\"\r\n [bsConfig]=\"{ dateInputFormat: format }\"\r\n [(ngModel)]=\"selectedDate\"\r\n (blur)=\"validateField()\"\r\n (ngModelChange)=\"validateField()\"\r\n [class.invalid]=\"validationFailed\"\r\n placeholder=\"Select date\"\r\n />\r\n <i\r\n class=\"fa-solid fa-calendar-days calendar-icon text-primary fs-5\"\r\n (click)=\"openDatePicker()\"\r\n ></i>\r\n </div>\r\n <div *ngIf=\"validationFailed\" class=\"text-danger mt-2\">\r\n <svg\r\n class=\"validationSvg\"\r\n viewBox=\"0 0 24 24\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n >\r\n <path\r\n d=\"M12.001 16.75C12.139 16.75 12.251 16.638 12.25 16.5C12.25 16.362 12.138 16.25 12 16.25C11.862 16.25 11.75 16.362 11.75 16.5C11.75 16.638 11.862 16.75 12.001 16.75\"\r\n stroke=\"white\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n fill-rule=\"evenodd\"\r\n clip-rule=\"evenodd\"\r\n d=\"M12 21C7.029 21 3 16.971 3 12C3 7.029 7.029 3 12 3C16.971 3 21 7.029 21 12C21 16.971 16.971 21 12 21Z\"\r\n fill=\"#FF0000\"\r\n stroke=\"#FF0000\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n d=\"M12 12.75L12 7.75\"\r\n stroke=\"white\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <circle cx=\"12\" cy=\"16\" r=\"1\" fill=\"white\" />\r\n </svg>\r\n {{ validationMessage }}\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"dateType === 'TIME_ONLY'\">\r\n <!-- Time picker -->\r\n\r\n\r\n<div class=\"input-container\">\r\n <input\r\n class=\"form-control height appearanceInput mt-3\"\r\n aria-label=\"Select time\"\r\n placeholder=\"Select time\"\r\n readonly\r\n [format]=\"timeFormat==='24'?24:12\"\r\n [ngxTimepicker]=\"fullTime3\"\r\n [(ngModel)]=\"selectedTime\"\r\n [max]=\"maxTime\"\r\n [min]=\"minTime\"\r\n (ngModelChange)=\"validateField()\"\r\n [class.invalid]=\"validationFailed\"\r\n />\r\n \r\n <i\r\n id=\"startDateIcon\"\r\n class=\"fa-solid fa-clock text-primary fs-6 clock-icon\"\r\n (click)=\"fullTime3.open()\"\r\n style=\"cursor: pointer;\"\r\n></i>\r\n <ngx-material-timepicker #fullTime3></ngx-material-timepicker>\r\n</div>\r\n <div *ngIf=\"validationFailed\" class=\"text-danger mt-2\">\r\n <svg\r\n class=\"validationSvg\"\r\n viewBox=\"0 0 24 24\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n >\r\n <path\r\n d=\"M12.001 16.75C12.139 16.75 12.251 16.638 12.25 16.5C12.25 16.362 12.138 16.25 12 16.25C11.862 16.25 11.75 16.362 11.75 16.5C11.75 16.638 11.862 16.75 12.001 16.75\"\r\n stroke=\"white\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n fill-rule=\"evenodd\"\r\n clip-rule=\"evenodd\"\r\n d=\"M12 21C7.029 21 3 16.971 3 12C3 7.029 7.029 3 12 3C16.971 3 21 7.029 21 12C21 16.971 16.971 21 12 21Z\"\r\n fill=\"#FF0000\"\r\n stroke=\"#FF0000\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n d=\"M12 12.75L12 7.75\"\r\n stroke=\"white\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <circle cx=\"12\" cy=\"16\" r=\"1\" fill=\"white\" />\r\n </svg>\r\n {{ validationMessage }}\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"dateType === 'DATE_AND_TIME'\">\r\n <!-- Date and time picker -->\r\n <div class=\"input-container\">\r\n <input\r\n #dateAndTimePicker=\"bsDatepicker\"\r\n type=\"text\"\r\n class=\"form-control height\"\r\n [minDate]=\"minDate ? minDate : undefined\"\r\n [maxDate]=\"maxDate ? maxDate : undefined\"\r\n [bsConfig]=\"{\r\n dateInputFormat: format\r\n }\"\r\n placeholder=\"Select date\"\r\n bsDatepicker\r\n [class.invalid]=\"validationFailed\"\r\n [(ngModel)]=\"selectedDateAndTime\"\r\n (blur)=\"validateField()\"\r\n (ngModelChange)=\"validateField()\"\r\n />\r\n <i\r\n class=\"fa-solid fa-calendar-days calendar-icon text-primary fs-5\"\r\n (click)=\"openDateAndTimePicker()\"\r\n ></i>\r\n </div>\r\n <div class=\"input-container\" *ngIf=\"selectedDateAndTime && selectedDateAndTime != null\">\r\n <input\r\n \r\n class=\"form-control height appearanceInput mt-3\"\r\n aria-label=\"Select time\"\r\n placeholder=\"Select time\"\r\n readonly\r\n [format]=\"timeFormat==='24'?24:12\"\r\n [ngxTimepicker]=\"fullTime4\"\r\n [(ngModel)]=\"selectedTime\"\r\n [max]=\"maxTime\"\r\n [min]=\"minTime\"\r\n (ngModelChange)=\"validateField()\"\r\n [class.invalid]=\"timeValidationFailed\"\r\n />\r\n \r\n <i\r\n id=\"startDateIcon\"\r\n class=\"fa-solid fa-clock text-primary fs-6 clock-icon\"\r\n (click)=\"fullTime4.open()\"\r\n style=\"cursor: pointer;\"\r\n ></i>\r\n <ngx-material-timepicker #fullTime4></ngx-material-timepicker>\r\n </div>\r\n \r\n <div *ngIf=\"validationFailed || timeValidationFailed\" class=\"text-danger mt-2\">\r\n <svg\r\n class=\"validationSvg\"\r\n viewBox=\"0 0 24 24\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n >\r\n <path\r\n d=\"M12.001 16.75C12.139 16.75 12.251 16.638 12.25 16.5C12.25 16.362 12.138 16.25 12 16.25C11.862 16.25 11.75 16.362 11.75 16.5C11.75 16.638 11.862 16.75 12.001 16.75\"\r\n stroke=\"white\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n fill-rule=\"evenodd\"\r\n clip-rule=\"evenodd\"\r\n d=\"M12 21C7.029 21 3 16.971 3 12C3 7.029 7.029 3 12 3C16.971 3 21 7.029 21 12C21 16.971 16.971 21 12 21Z\"\r\n fill=\"#FF0000\"\r\n stroke=\"#FF0000\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n d=\"M12 12.75L12 7.75\"\r\n stroke=\"white\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <circle cx=\"12\" cy=\"16\" r=\"1\" fill=\"white\" />\r\n </svg>\r\n {{ validationMessage }}\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"dateType === 'DATE_RANGE'\">\r\n <!-- Date range picker -->\r\n <div class=\"input-container\">\r\n <input\r\n type=\"text\"\r\n class=\"form-control height\"\r\n #daterangepicker=\"bsDaterangepicker\"\r\n bsDaterangepicker\r\n placeholder=\"Select date\"\r\n [minDate]=\"minDate ? minDate : undefined\"\r\n [maxDate]=\"maxDate ? maxDate : undefined\"\r\n [bsConfig]=\"{\r\n rangeInputFormat: format,\r\n dateInputFormat: format,\r\n }\"\r\n [(ngModel)]=\"selectedDateRange\"\r\n (blur)=\"validateField()\"\r\n (ngModelChange)=\"validateField()\"\r\n [class.invalid]=\"validationFailed\"\r\n />\r\n <i\r\n class=\"fa-solid fa-calendar-days calendar-icon text-primary fs-5\"\r\n (click)=\"openDateRangePicker()\"\r\n ></i>\r\n </div>\r\n <div *ngIf=\"validationFailed\" class=\"text-danger mt-2\">\r\n <svg\r\n class=\"validationSvg\"\r\n viewBox=\"0 0 24 24\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n >\r\n <path\r\n d=\"M12.001 16.75C12.139 16.75 12.251 16.638 12.25 16.5C12.25 16.362 12.138 16.25 12 16.25C11.862 16.25 11.75 16.362 11.75 16.5C11.75 16.638 11.862 16.75 12.001 16.75\"\r\n stroke=\"white\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n fill-rule=\"evenodd\"\r\n clip-rule=\"evenodd\"\r\n d=\"M12 21C7.029 21 3 16.971 3 12C3 7.029 7.029 3 12 3C16.971 3 21 7.029 21 12C21 16.971 16.971 21 12 21Z\"\r\n fill=\"#FF0000\"\r\n stroke=\"#FF0000\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n d=\"M12 12.75L12 7.75\"\r\n stroke=\"white\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <circle cx=\"12\" cy=\"16\" r=\"1\" fill=\"white\" />\r\n </svg>\r\n {{ validationMessage }}\r\n </div>\r\n </ng-container>\r\n</div>\r\n", styles: [".input-wrapper{display:flex;align-items:flex-start}.svg-wrapper{margin-inline-start:auto;z-index:999}.hintIcon{position:relative;cursor:pointer}.hintIcon:hover:before{content:attr(data-title);position:absolute;top:calc(100% + 2px);right:0;padding:4px 8px;border-radius:4px;background-color:#1d252d;color:#8e9aa0;font-size:14px;min-width:300px;word-wrap:break-word;word-break:break-word;text-align:center;white-space:normal}.hintIcon:hover:after{content:\"\";position:absolute;top:calc(100% - 26px);left:50%;border:solid transparent;border-width:18px;border-bottom-color:#1d252d;transform:translate(-50%)}.height{height:42px}.invalid{border-color:red}.hintSvg{width:30px;height:30px;fill:none}.validationSvg{width:24px;height:24px;fill:none}.input-container{position:relative}.input-container .form-control{padding-right:30px}.input-container .calendar-icon,.clock-icon{position:absolute;top:50%;right:10px;transform:translateY(-50%);cursor:pointer}.appearanceInput{background-color:#fff}::ng-deep ngx-material-timepicker-content{--body-background-color: #fff;--primary-font-family: \"Roboto\",sans-serif;--button-color: #0637b2 !important;--dial-active-color: #fff;--dial-inactive-color: rgba(255, 255, 255, .5);--dial-background-color: #0637b2 !important;--dial-editable-active-color: #0637b2 !important;--dial-editable-background-color: #fff;--clock-face-time-active-color: #fff;--clock-face-time-inactive-color: #6c6c6c;--clock-face-inner-time-inactive-color: #929292;--clock-face-time-disabled-color: #c5c5c5;--clock-face-background-color: #f0f0f0;--clock-hand-color: #0637b2 !important;position:relative;z-index:99999999}::ng-deep ngx-material-timepicker-container{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#00000052;z-index:99998}\n"] }]
403
+ args: [{ selector: 'lib-date-time-fields', providers: [DatePipe], template: "<div class=\"mb-5 px-3\">\r\n <div class=\"input-wrapper mb-2\">\r\n <div [innerHTML]=\"question.questionNumber\"></div>\r\n &nbsp;&nbsp; <label>{{ question.question }}</label\r\n >&nbsp;\r\n <span class=\"text-danger\" *ngIf=\"required\">*</span>\r\n <div\r\n class=\"svg-wrapper mb-2 hintIcon\"\r\n [attr.data-title]=\"hint\"\r\n *ngIf=\"hint\"\r\n >\r\n <svg\r\n class=\"hintSvg\"\r\n viewBox=\"0 0 30 30\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n >\r\n <path\r\n fill-rule=\"evenodd\"\r\n clip-rule=\"evenodd\"\r\n d=\"M15 26.25V26.25C8.78625 26.25 3.75 21.2138 3.75 15V15C3.75 8.78625 8.78625 3.75 15 3.75V3.75C21.2138 3.75 26.25 8.78625 26.25 15V15C26.25 21.2138 21.2138 26.25 15 26.25Z\"\r\n stroke=\"#323232\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n d=\"M15 16.5623V16.2498C15 15.2285 15.6312 14.6748 16.2637 14.2498C16.8812 13.8335 17.5 13.291 17.5 12.291C17.5 10.9098 16.3813 9.79102 15 9.79102C13.6187 9.79102 12.5 10.9098 12.5 12.291\"\r\n stroke=\"#323232\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n d=\"M14.9988 20C14.8263 20 14.6863 20.14 14.6875 20.3125C14.6875 20.485 14.8275 20.625 15 20.625C15.1725 20.625 15.3125 20.485 15.3125 20.3125C15.3125 20.14 15.1725 20 14.9988 20\"\r\n stroke=\"#323232\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n </svg>\r\n </div>\r\n </div>\r\n <ng-container *ngIf=\"dateType === 'DATE_ONLY'\">\r\n <!-- Date only picker -->\r\n <div class=\"input-container\">\r\n <input\r\n class=\"form-control height\"\r\n #datepickerYMD=\"bsDatepicker\"\r\n bsDatepicker\r\n [minDate]=\"minDate ? minDate : undefined\"\r\n [maxDate]=\"maxDate ? maxDate : undefined\"\r\n [bsConfig]=\"{ dateInputFormat: format }\"\r\n [(ngModel)]=\"selectedDate\"\r\n (blur)=\"validateField()\"\r\n (ngModelChange)=\"validateField()\"\r\n [class.invalid]=\"validationFailed\"\r\n placeholder=\"Select date\"\r\n />\r\n <i\r\n class=\"fa-solid fa-calendar-days calendar-icon text-primary fs-5\"\r\n (click)=\"openDatePicker()\"\r\n ></i>\r\n </div>\r\n <div *ngIf=\"validationFailed\" class=\"text-danger mt-2\">\r\n <svg\r\n class=\"validationSvg\"\r\n viewBox=\"0 0 24 24\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n >\r\n <path\r\n d=\"M12.001 16.75C12.139 16.75 12.251 16.638 12.25 16.5C12.25 16.362 12.138 16.25 12 16.25C11.862 16.25 11.75 16.362 11.75 16.5C11.75 16.638 11.862 16.75 12.001 16.75\"\r\n stroke=\"white\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n fill-rule=\"evenodd\"\r\n clip-rule=\"evenodd\"\r\n d=\"M12 21C7.029 21 3 16.971 3 12C3 7.029 7.029 3 12 3C16.971 3 21 7.029 21 12C21 16.971 16.971 21 12 21Z\"\r\n fill=\"#FF0000\"\r\n stroke=\"#FF0000\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n d=\"M12 12.75L12 7.75\"\r\n stroke=\"white\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <circle cx=\"12\" cy=\"16\" r=\"1\" fill=\"white\" />\r\n </svg>\r\n {{ validationMessage }}\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"dateType === 'TIME_ONLY'\">\r\n <!-- Time picker -->\r\n\r\n\r\n<div class=\"input-container\">\r\n <input\r\n class=\"form-control height appearanceInput mt-3\"\r\n aria-label=\"Select time\"\r\n placeholder=\"Select time\"\r\n readonly\r\n [format]=\"timeFormat==='24'?24:12\"\r\n [ngxTimepicker]=\"fullTime3\"\r\n [(ngModel)]=\"selectedTime\"\r\n [max]=\"maxTime\"\r\n [min]=\"minTime\"\r\n (ngModelChange)=\"validateField()\"\r\n [class.invalid]=\"validationFailed\"\r\n />\r\n \r\n <i\r\n id=\"startDateIcon\"\r\n class=\"fa-solid fa-clock text-primary fs-6 clock-icon\"\r\n (click)=\"fullTime3.open()\"\r\n style=\"cursor: pointer;\"\r\n></i>\r\n <ngx-material-timepicker #fullTime3></ngx-material-timepicker>\r\n</div>\r\n <div *ngIf=\"validationFailed\" class=\"text-danger mt-2\">\r\n <svg\r\n class=\"validationSvg\"\r\n viewBox=\"0 0 24 24\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n >\r\n <path\r\n d=\"M12.001 16.75C12.139 16.75 12.251 16.638 12.25 16.5C12.25 16.362 12.138 16.25 12 16.25C11.862 16.25 11.75 16.362 11.75 16.5C11.75 16.638 11.862 16.75 12.001 16.75\"\r\n stroke=\"white\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n fill-rule=\"evenodd\"\r\n clip-rule=\"evenodd\"\r\n d=\"M12 21C7.029 21 3 16.971 3 12C3 7.029 7.029 3 12 3C16.971 3 21 7.029 21 12C21 16.971 16.971 21 12 21Z\"\r\n fill=\"#FF0000\"\r\n stroke=\"#FF0000\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n d=\"M12 12.75L12 7.75\"\r\n stroke=\"white\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <circle cx=\"12\" cy=\"16\" r=\"1\" fill=\"white\" />\r\n </svg>\r\n {{ validationMessage }}\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"dateType === 'DATE_AND_TIME'\">\r\n <!-- Date and time picker -->\r\n <div class=\"input-container\">\r\n <input\r\n #dateAndTimePicker=\"bsDatepicker\"\r\n type=\"text\"\r\n class=\"form-control height\"\r\n [minDate]=\"minDate ? minDate : undefined\"\r\n [maxDate]=\"maxDate ? maxDate : undefined\"\r\n [bsConfig]=\"{\r\n dateInputFormat: format\r\n }\"\r\n placeholder=\"Select date\"\r\n bsDatepicker\r\n [class.invalid]=\"validationFailed\"\r\n [(ngModel)]=\"selectedDateAndTime\"\r\n (blur)=\"validateField()\"\r\n (ngModelChange)=\"validateField()\"\r\n />\r\n <i\r\n class=\"fa-solid fa-calendar-days calendar-icon text-primary fs-5\"\r\n (click)=\"openDateAndTimePicker()\"\r\n ></i>\r\n </div>\r\n <div class=\"input-container\" *ngIf=\"selectedDateAndTime && selectedDateAndTime != null\">\r\n <input\r\n \r\n class=\"form-control height appearanceInput mt-3\"\r\n aria-label=\"Select time\"\r\n placeholder=\"Select time\"\r\n readonly\r\n [format]=\"timeFormat==='24'?24:12\"\r\n [ngxTimepicker]=\"fullTime4\"\r\n [(ngModel)]=\"selectedTime\"\r\n [max]=\"maxTime\"\r\n [min]=\"minTime\"\r\n (ngModelChange)=\"validateField()\"\r\n [class.invalid]=\"timeValidationFailed\"\r\n />\r\n \r\n <i\r\n id=\"startDateIcon\"\r\n class=\"fa-solid fa-clock text-primary fs-6 clock-icon\"\r\n (click)=\"fullTime4.open()\"\r\n style=\"cursor: pointer;\"\r\n ></i>\r\n <ngx-material-timepicker #fullTime4></ngx-material-timepicker>\r\n </div>\r\n \r\n <div *ngIf=\"validationFailed || timeValidationFailed\" class=\"text-danger mt-2\">\r\n <svg\r\n class=\"validationSvg\"\r\n viewBox=\"0 0 24 24\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n >\r\n <path\r\n d=\"M12.001 16.75C12.139 16.75 12.251 16.638 12.25 16.5C12.25 16.362 12.138 16.25 12 16.25C11.862 16.25 11.75 16.362 11.75 16.5C11.75 16.638 11.862 16.75 12.001 16.75\"\r\n stroke=\"white\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n fill-rule=\"evenodd\"\r\n clip-rule=\"evenodd\"\r\n d=\"M12 21C7.029 21 3 16.971 3 12C3 7.029 7.029 3 12 3C16.971 3 21 7.029 21 12C21 16.971 16.971 21 12 21Z\"\r\n fill=\"#FF0000\"\r\n stroke=\"#FF0000\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n d=\"M12 12.75L12 7.75\"\r\n stroke=\"white\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <circle cx=\"12\" cy=\"16\" r=\"1\" fill=\"white\" />\r\n </svg>\r\n {{ validationMessage }}\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"dateType === 'DATE_RANGE'\">\r\n <!-- Date range picker -->\r\n <div class=\"input-container\">\r\n <input\r\n type=\"text\"\r\n class=\"form-control height\"\r\n #daterangepicker=\"bsDaterangepicker\"\r\n bsDaterangepicker\r\n placeholder=\"Select date\"\r\n [minDate]=\"minDate ? minDate : undefined\"\r\n [maxDate]=\"maxDate ? maxDate : undefined\"\r\n [bsConfig]=\"{\r\n rangeInputFormat: format,\r\n dateInputFormat: format,\r\n }\"\r\n [(ngModel)]=\"selectedDateRange\"\r\n (blur)=\"validateField()\"\r\n (ngModelChange)=\"validateField()\"\r\n [class.invalid]=\"validationFailed\"\r\n />\r\n <i\r\n class=\"fa-solid fa-calendar-days calendar-icon text-primary fs-5\"\r\n (click)=\"openDateRangePicker()\"\r\n ></i>\r\n </div>\r\n <div *ngIf=\"validationFailed\" class=\"text-danger mt-2\">\r\n <svg\r\n class=\"validationSvg\"\r\n viewBox=\"0 0 24 24\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n >\r\n <path\r\n d=\"M12.001 16.75C12.139 16.75 12.251 16.638 12.25 16.5C12.25 16.362 12.138 16.25 12 16.25C11.862 16.25 11.75 16.362 11.75 16.5C11.75 16.638 11.862 16.75 12.001 16.75\"\r\n stroke=\"white\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n fill-rule=\"evenodd\"\r\n clip-rule=\"evenodd\"\r\n d=\"M12 21C7.029 21 3 16.971 3 12C3 7.029 7.029 3 12 3C16.971 3 21 7.029 21 12C21 16.971 16.971 21 12 21Z\"\r\n fill=\"#FF0000\"\r\n stroke=\"#FF0000\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n d=\"M12 12.75L12 7.75\"\r\n stroke=\"white\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <circle cx=\"12\" cy=\"16\" r=\"1\" fill=\"white\" />\r\n </svg>\r\n {{ validationMessage }}\r\n </div>\r\n </ng-container>\r\n</div>\r\n", styles: [".input-wrapper{display:flex;align-items:flex-start}.svg-wrapper{margin-inline-start:auto;z-index:999}.hintIcon{position:relative;cursor:pointer}.hintIcon:hover:before{content:attr(data-title);position:absolute;top:calc(100% + 2px);right:0;padding:4px 8px;border-radius:4px;background-color:#1d252d;color:#8e9aa0;font-size:14px;min-width:300px;word-wrap:break-word;word-break:break-word;text-align:center;white-space:normal}.hintIcon:hover:after{content:\"\";position:absolute;top:calc(100% - 26px);left:50%;border:solid transparent;border-width:18px;border-bottom-color:#1d252d;transform:translate(-50%)}.height{height:42px}.invalid{border-color:red}.hintSvg{width:30px;height:30px;fill:none}.validationSvg{width:24px;height:24px;fill:none}.input-container{position:relative}.input-container .form-control{padding-right:30px}.input-container .calendar-icon,.clock-icon{position:absolute;top:50%;right:10px;transform:translateY(-50%);cursor:pointer}.appearanceInput{background-color:#fff}::ng-deep ngx-material-timepicker-content{--body-background-color: #fff;--button-color: #0637b2 !important;--dial-active-color: #fff;--dial-inactive-color: rgba(255, 255, 255, .5);--dial-background-color: #0637b2 !important;--dial-editable-active-color: #0637b2 !important;--dial-editable-background-color: #fff;--clock-face-time-active-color: #fff;--clock-face-time-inactive-color: #6c6c6c;--clock-face-inner-time-inactive-color: #929292;--clock-face-time-disabled-color: #c5c5c5;--clock-face-background-color: #f0f0f0;--clock-hand-color: #0637b2 !important;position:relative;z-index:99999999}::ng-deep ngx-material-timepicker-container{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#00000052;z-index:99998}\n"] }]
404
404
  }], ctorParameters: function () { return [{ type: i1.DatePipe }]; }, propDecorators: { question: [{
405
405
  type: Input
406
406
  }], datepicker: [{
package/esm2022/form-fields/terms-and-condition-fields/terms-and-condition-fields.component.mjs CHANGED
@@ -52,11 +52,11 @@ export class TermsAndConditionFieldsComponent {
52
52
  this.visible = false;
53
53
  }
54
54
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TermsAndConditionFieldsComponent, deps: [{ token: i1.FormService }, { token: i2.HttpClient }, { token: i3.DataService }], target: i0.ɵɵFactoryTarget.Component }); }
55
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TermsAndConditionFieldsComponent, selector: "lib-terms-and-condition-fields", inputs: { question: "question" }, ngImport: i0, template: "<div class=\"mb-4 px-3\">\r\n <div class=\"input-wrapper\">\r\n <div [innerHTML]=\"question.questionNumber\" ></div>\r\n &nbsp;&nbsp; <label (click)=\"preview()\">{{ question.question }}</label\r\n >&nbsp;\r\n <span class=\"text-danger\" *ngIf=\"required\">*</span>\r\n <div\r\n class=\"svg-wrapper mb-2 hintIcon\"\r\n [attr.data-title]=\"hint\"\r\n *ngIf=\"hint\"\r\n >\r\n <svg\r\n class=\"hintSvg\"\r\n viewBox=\"0 0 30 30\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n >\r\n <path\r\n fill-rule=\"evenodd\"\r\n clip-rule=\"evenodd\"\r\n d=\"M15 26.25V26.25C8.78625 26.25 3.75 21.2138 3.75 15V15C3.75 8.78625 8.78625 3.75 15 3.75V3.75C21.2138 3.75 26.25 8.78625 26.25 15V15C26.25 21.2138 21.2138 26.25 15 26.25Z\"\r\n stroke=\"#323232\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n d=\"M15 16.5623V16.2498C15 15.2285 15.6312 14.6748 16.2637 14.2498C16.8812 13.8335 17.5 13.291 17.5 12.291C17.5 10.9098 16.3813 9.79102 15 9.79102C13.6187 9.79102 12.5 10.9098 12.5 12.291\"\r\n stroke=\"#323232\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n d=\"M14.9988 20C14.8263 20 14.6863 20.14 14.6875 20.3125C14.6875 20.485 14.8275 20.625 15 20.625C15.1725 20.625 15.3125 20.485 15.3125 20.3125C15.3125 20.14 15.1725 20 14.9988 20\"\r\n stroke=\"#323232\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n </svg>\r\n </div>\r\n </div>\r\n <div class=\"modal1\" *ngIf=\"visible\">\r\n <div class=\"modal-content1\">\r\n <span class=\"close\" (click)=\"closeModal()\">&times;</span>\r\n <div class=\"imgContiner\">\r\n <img [src]=\"imgUrl\" alt=\"Image\">\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n", styles: [".input-wrapper{display:flex;align-items:flex-start}.svg-wrapper{margin-inline-start:auto;z-index:999}.hintIcon{position:relative;cursor:pointer}.hintIcon:hover:before{content:attr(data-title);position:absolute;top:calc(100% + 2px);right:0;padding:4px 8px;border-radius:4px;background-color:#1d252d;color:#8e9aa0;font-size:14px;min-width:300px;word-wrap:break-word;word-break:break-word;text-align:center;white-space:normal}.hintIcon:hover:after{content:\"\";position:absolute;top:calc(100% - 26px);left:50%;border:solid transparent;border-width:18px;border-bottom-color:#1d252d;transform:translate(-50%)}.height{height:42px}.invalid{border-color:red}.hintSvg{width:30px;height:30px;fill:none}.validationSvg{width:24px;height:24px;fill:none}label{color:#084fff}.modal1{display:flex;position:fixed;z-index:1000;left:0;top:0;width:100%;height:100%;background-color:#000;background-color:#0006;align-items:center}.modal-content1{background-color:#fefefe;margin:15% auto;padding:20px;border:1px solid #888;width:80%;max-width:877px}.close{color:#aaa;float:right;font-size:28px;font-weight:700;justify-content:end;display:flex;opacity:1}.close:hover,.close:focus{color:#000;text-decoration:none;cursor:pointer}.imgContiner{height:500px;overflow-y:auto}.imgContiner img{max-width:100%;width:100%}div::-webkit-scrollbar,main::-webkit-scrollbar,ul::-webkit-scrollbar{width:6px;height:8px;visibility:hidden}div::-webkit-scrollbar-thumb,main::-webkit-scrollbar-thumb,ul::-webkit-scrollbar-thumb{background-color:var(--scrollBarThumbColor);border-radius:8px;visibility:hidden}div:hover::-webkit-scrollbar,main:hover::-webkit-scrollbar,ul:hover::-webkit-scrollbar{visibility:unset}div:hover::-webkit-scrollbar-thumb,main:hover::-webkit-scrollbar-thumb,ul:hover::-webkit-scrollbar-thumb{visibility:unset}\n"], dependencies: [{ kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
55
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TermsAndConditionFieldsComponent, selector: "lib-terms-and-condition-fields", inputs: { question: "question" }, ngImport: i0, template: "<div class=\"mb-4 px-3\">\r\n <div class=\"input-wrapper\">\r\n <div [innerHTML]=\"question.questionNumber\" ></div>\r\n &nbsp;&nbsp; <label (click)=\"preview()\">{{ question.question }}</label\r\n >&nbsp;\r\n <span class=\"text-danger\" *ngIf=\"required\">*</span>\r\n <div\r\n class=\"svg-wrapper mb-2 hintIcon\"\r\n [attr.data-title]=\"hint\"\r\n *ngIf=\"hint\"\r\n >\r\n <svg\r\n class=\"hintSvg\"\r\n viewBox=\"0 0 30 30\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n >\r\n <path\r\n fill-rule=\"evenodd\"\r\n clip-rule=\"evenodd\"\r\n d=\"M15 26.25V26.25C8.78625 26.25 3.75 21.2138 3.75 15V15C3.75 8.78625 8.78625 3.75 15 3.75V3.75C21.2138 3.75 26.25 8.78625 26.25 15V15C26.25 21.2138 21.2138 26.25 15 26.25Z\"\r\n stroke=\"#323232\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n d=\"M15 16.5623V16.2498C15 15.2285 15.6312 14.6748 16.2637 14.2498C16.8812 13.8335 17.5 13.291 17.5 12.291C17.5 10.9098 16.3813 9.79102 15 9.79102C13.6187 9.79102 12.5 10.9098 12.5 12.291\"\r\n stroke=\"#323232\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n d=\"M14.9988 20C14.8263 20 14.6863 20.14 14.6875 20.3125C14.6875 20.485 14.8275 20.625 15 20.625C15.1725 20.625 15.3125 20.485 15.3125 20.3125C15.3125 20.14 15.1725 20 14.9988 20\"\r\n stroke=\"#323232\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n </svg>\r\n </div>\r\n </div>\r\n <div class=\"modal1\" *ngIf=\"visible\">\r\n <div class=\"modal-content1\">\r\n <span class=\"close\" (click)=\"closeModal()\">&times;</span>\r\n <div class=\"imgContiner\">\r\n <img [src]=\"imgUrl\" alt=\"Image\">\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n", styles: [".input-wrapper{display:flex;align-items:flex-start}.svg-wrapper{margin-inline-start:auto;z-index:999}.hintIcon{position:relative;cursor:pointer}.hintIcon:hover:before{content:attr(data-title);position:absolute;top:calc(100% + 2px);right:0;padding:4px 8px;border-radius:4px;background-color:#1d252d;color:#8e9aa0;font-size:14px;min-width:300px;word-wrap:break-word;word-break:break-word;text-align:center;white-space:normal}.hintIcon:hover:after{content:\"\";position:absolute;top:calc(100% - 26px);left:50%;border:solid transparent;border-width:18px;border-bottom-color:#1d252d;transform:translate(-50%)}.height{height:42px}.invalid{border-color:red}.hintSvg{width:30px;height:30px;fill:none}.validationSvg{width:24px;height:24px;fill:none}label{color:#084fff}.modal1{display:flex;position:fixed;z-index:1000;left:0;top:0;width:100%;height:100%;background-color:#000;background-color:#0006;align-items:center}.modal-content1{background-color:#fefefe;margin:15% auto;padding:20px;border:1px solid #888;width:80%;max-width:877px}.close{color:#aaa;float:right;font-size:28px;font-weight:700;justify-content:flex-end;display:flex;opacity:1}.close:hover,.close:focus{color:#000;text-decoration:none;cursor:pointer}.imgContiner{height:500px;overflow-y:auto}.imgContiner img{max-width:100%;width:100%}div::-webkit-scrollbar,main::-webkit-scrollbar,ul::-webkit-scrollbar{width:6px;height:8px;visibility:hidden}div::-webkit-scrollbar-thumb,main::-webkit-scrollbar-thumb,ul::-webkit-scrollbar-thumb{background-color:var(--scrollBarThumbColor);border-radius:8px;visibility:hidden}div:hover::-webkit-scrollbar,main:hover::-webkit-scrollbar,ul:hover::-webkit-scrollbar{visibility:unset}div:hover::-webkit-scrollbar-thumb,main:hover::-webkit-scrollbar-thumb,ul:hover::-webkit-scrollbar-thumb{visibility:unset}\n"], dependencies: [{ kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
56
56
  }
57
57
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TermsAndConditionFieldsComponent, decorators: [{
58
58
  type: Component,
59
- args: [{ selector: 'lib-terms-and-condition-fields', template: "<div class=\"mb-4 px-3\">\r\n <div class=\"input-wrapper\">\r\n <div [innerHTML]=\"question.questionNumber\" ></div>\r\n &nbsp;&nbsp; <label (click)=\"preview()\">{{ question.question }}</label\r\n >&nbsp;\r\n <span class=\"text-danger\" *ngIf=\"required\">*</span>\r\n <div\r\n class=\"svg-wrapper mb-2 hintIcon\"\r\n [attr.data-title]=\"hint\"\r\n *ngIf=\"hint\"\r\n >\r\n <svg\r\n class=\"hintSvg\"\r\n viewBox=\"0 0 30 30\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n >\r\n <path\r\n fill-rule=\"evenodd\"\r\n clip-rule=\"evenodd\"\r\n d=\"M15 26.25V26.25C8.78625 26.25 3.75 21.2138 3.75 15V15C3.75 8.78625 8.78625 3.75 15 3.75V3.75C21.2138 3.75 26.25 8.78625 26.25 15V15C26.25 21.2138 21.2138 26.25 15 26.25Z\"\r\n stroke=\"#323232\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n d=\"M15 16.5623V16.2498C15 15.2285 15.6312 14.6748 16.2637 14.2498C16.8812 13.8335 17.5 13.291 17.5 12.291C17.5 10.9098 16.3813 9.79102 15 9.79102C13.6187 9.79102 12.5 10.9098 12.5 12.291\"\r\n stroke=\"#323232\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n d=\"M14.9988 20C14.8263 20 14.6863 20.14 14.6875 20.3125C14.6875 20.485 14.8275 20.625 15 20.625C15.1725 20.625 15.3125 20.485 15.3125 20.3125C15.3125 20.14 15.1725 20 14.9988 20\"\r\n stroke=\"#323232\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n </svg>\r\n </div>\r\n </div>\r\n <div class=\"modal1\" *ngIf=\"visible\">\r\n <div class=\"modal-content1\">\r\n <span class=\"close\" (click)=\"closeModal()\">&times;</span>\r\n <div class=\"imgContiner\">\r\n <img [src]=\"imgUrl\" alt=\"Image\">\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n", styles: [".input-wrapper{display:flex;align-items:flex-start}.svg-wrapper{margin-inline-start:auto;z-index:999}.hintIcon{position:relative;cursor:pointer}.hintIcon:hover:before{content:attr(data-title);position:absolute;top:calc(100% + 2px);right:0;padding:4px 8px;border-radius:4px;background-color:#1d252d;color:#8e9aa0;font-size:14px;min-width:300px;word-wrap:break-word;word-break:break-word;text-align:center;white-space:normal}.hintIcon:hover:after{content:\"\";position:absolute;top:calc(100% - 26px);left:50%;border:solid transparent;border-width:18px;border-bottom-color:#1d252d;transform:translate(-50%)}.height{height:42px}.invalid{border-color:red}.hintSvg{width:30px;height:30px;fill:none}.validationSvg{width:24px;height:24px;fill:none}label{color:#084fff}.modal1{display:flex;position:fixed;z-index:1000;left:0;top:0;width:100%;height:100%;background-color:#000;background-color:#0006;align-items:center}.modal-content1{background-color:#fefefe;margin:15% auto;padding:20px;border:1px solid #888;width:80%;max-width:877px}.close{color:#aaa;float:right;font-size:28px;font-weight:700;justify-content:end;display:flex;opacity:1}.close:hover,.close:focus{color:#000;text-decoration:none;cursor:pointer}.imgContiner{height:500px;overflow-y:auto}.imgContiner img{max-width:100%;width:100%}div::-webkit-scrollbar,main::-webkit-scrollbar,ul::-webkit-scrollbar{width:6px;height:8px;visibility:hidden}div::-webkit-scrollbar-thumb,main::-webkit-scrollbar-thumb,ul::-webkit-scrollbar-thumb{background-color:var(--scrollBarThumbColor);border-radius:8px;visibility:hidden}div:hover::-webkit-scrollbar,main:hover::-webkit-scrollbar,ul:hover::-webkit-scrollbar{visibility:unset}div:hover::-webkit-scrollbar-thumb,main:hover::-webkit-scrollbar-thumb,ul:hover::-webkit-scrollbar-thumb{visibility:unset}\n"] }]
59
+ args: [{ selector: 'lib-terms-and-condition-fields', template: "<div class=\"mb-4 px-3\">\r\n <div class=\"input-wrapper\">\r\n <div [innerHTML]=\"question.questionNumber\" ></div>\r\n &nbsp;&nbsp; <label (click)=\"preview()\">{{ question.question }}</label\r\n >&nbsp;\r\n <span class=\"text-danger\" *ngIf=\"required\">*</span>\r\n <div\r\n class=\"svg-wrapper mb-2 hintIcon\"\r\n [attr.data-title]=\"hint\"\r\n *ngIf=\"hint\"\r\n >\r\n <svg\r\n class=\"hintSvg\"\r\n viewBox=\"0 0 30 30\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n >\r\n <path\r\n fill-rule=\"evenodd\"\r\n clip-rule=\"evenodd\"\r\n d=\"M15 26.25V26.25C8.78625 26.25 3.75 21.2138 3.75 15V15C3.75 8.78625 8.78625 3.75 15 3.75V3.75C21.2138 3.75 26.25 8.78625 26.25 15V15C26.25 21.2138 21.2138 26.25 15 26.25Z\"\r\n stroke=\"#323232\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n d=\"M15 16.5623V16.2498C15 15.2285 15.6312 14.6748 16.2637 14.2498C16.8812 13.8335 17.5 13.291 17.5 12.291C17.5 10.9098 16.3813 9.79102 15 9.79102C13.6187 9.79102 12.5 10.9098 12.5 12.291\"\r\n stroke=\"#323232\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n d=\"M14.9988 20C14.8263 20 14.6863 20.14 14.6875 20.3125C14.6875 20.485 14.8275 20.625 15 20.625C15.1725 20.625 15.3125 20.485 15.3125 20.3125C15.3125 20.14 15.1725 20 14.9988 20\"\r\n stroke=\"#323232\"\r\n stroke-width=\"1.5\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n </svg>\r\n </div>\r\n </div>\r\n <div class=\"modal1\" *ngIf=\"visible\">\r\n <div class=\"modal-content1\">\r\n <span class=\"close\" (click)=\"closeModal()\">&times;</span>\r\n <div class=\"imgContiner\">\r\n <img [src]=\"imgUrl\" alt=\"Image\">\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n", styles: [".input-wrapper{display:flex;align-items:flex-start}.svg-wrapper{margin-inline-start:auto;z-index:999}.hintIcon{position:relative;cursor:pointer}.hintIcon:hover:before{content:attr(data-title);position:absolute;top:calc(100% + 2px);right:0;padding:4px 8px;border-radius:4px;background-color:#1d252d;color:#8e9aa0;font-size:14px;min-width:300px;word-wrap:break-word;word-break:break-word;text-align:center;white-space:normal}.hintIcon:hover:after{content:\"\";position:absolute;top:calc(100% - 26px);left:50%;border:solid transparent;border-width:18px;border-bottom-color:#1d252d;transform:translate(-50%)}.height{height:42px}.invalid{border-color:red}.hintSvg{width:30px;height:30px;fill:none}.validationSvg{width:24px;height:24px;fill:none}label{color:#084fff}.modal1{display:flex;position:fixed;z-index:1000;left:0;top:0;width:100%;height:100%;background-color:#000;background-color:#0006;align-items:center}.modal-content1{background-color:#fefefe;margin:15% auto;padding:20px;border:1px solid #888;width:80%;max-width:877px}.close{color:#aaa;float:right;font-size:28px;font-weight:700;justify-content:flex-end;display:flex;opacity:1}.close:hover,.close:focus{color:#000;text-decoration:none;cursor:pointer}.imgContiner{height:500px;overflow-y:auto}.imgContiner img{max-width:100%;width:100%}div::-webkit-scrollbar,main::-webkit-scrollbar,ul::-webkit-scrollbar{width:6px;height:8px;visibility:hidden}div::-webkit-scrollbar-thumb,main::-webkit-scrollbar-thumb,ul::-webkit-scrollbar-thumb{background-color:var(--scrollBarThumbColor);border-radius:8px;visibility:hidden}div:hover::-webkit-scrollbar,main:hover::-webkit-scrollbar,ul:hover::-webkit-scrollbar{visibility:unset}div:hover::-webkit-scrollbar-thumb,main:hover::-webkit-scrollbar-thumb,ul:hover::-webkit-scrollbar-thumb{visibility:unset}\n"] }]
60
60
  }], ctorParameters: function () { return [{ type: i1.FormService }, { type: i2.HttpClient }, { type: i3.DataService }]; }, propDecorators: { question: [{
61
61
  type: Input
62
62
  }] } });
package/esm2022/form-submission/next-prev-navigation/next-prev-navigation.component.mjs CHANGED
@@ -29,11 +29,11 @@ export class NextPrevNavigationComponent {
29
29
  this.submitEmit.emit();
30
30
  }
31
31
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: NextPrevNavigationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
32
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: NextPrevNavigationComponent, selector: "lib-next-prev-navigation", inputs: { currentPageIndex: "currentPageIndex", pages: "pages", previousPage: "previousPage", nextPage: "nextPage", currentPage: "currentPage", edit: "edit", acceptedLanguage: "acceptedLanguage" }, outputs: { navigateNext: "navigateNext", navigatePrevious: "navigatePrevious", submitEmit: "submitEmit", subFormChange: "subFormChange" }, ngImport: i0, template: "<div class=\"pageTitleDiv\">\r\n <p class=\"pageTitle\">{{ currentPage.title }}</p>\r\n</div>\r\n<div class=\"button-inner-container rounded\">\r\n <div class=\"tab-content pt-5 pb-3 row\">\r\n <div *ngFor=\"let row of pages[currentPageIndex].rows\" class=\"marginSize d-flex\">\r\n <div *ngFor=\"let grid of row.grid\"\r\n [ngStyle]=\"{'width.%': (grid.element.count) * (100 / (12))}\">\r\n <lib-form-elements\r\n [grid]=\"grid\"\r\n [currentPageIndex]=\"currentPageIndex\"\r\n [edit]=\"edit\"\r\n [acceptedLanguage]=\"acceptedLanguage\"\r\n (subFormChange)=\"updateSubFormWithSubmissions($event)\"\r\n ></lib-form-elements>\r\n </div>\r\n </div>\r\n <div class=\"footerButton\">\r\n <div\r\n class=\"prevButtonDiv\"\r\n [ngClass]=\"{ 'prevDirection-rtl': acceptedLanguage === 'ara' }\">\r\n <button\r\n class=\"me-md-2 rounded-pill navButton\"\r\n type=\"button\"\r\n (click)=\"onNavigatePrevious()\"\r\n *ngIf=\"0 < currentPageIndex\"\r\n >\r\n <ng-container *ngIf=\"acceptedLanguage === 'ara'; else defaultSvg\">\r\n <svg\r\n width=\"24\"\r\n height=\"24\"\r\n viewBox=\"0 0 24 24\"\r\n fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n >\r\n <path\r\n d=\"M19.4897 12.0117L4.49975 12.0117\"\r\n stroke=\"white\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n d=\"M13.486 6.02344L19.502 12.0004L13.486 17.9774\"\r\n stroke=\"white\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n </svg>\r\n </ng-container>\r\n <ng-template #defaultSvg>\r\n <svg\r\n width=\"24\"\r\n height=\"24\"\r\n viewBox=\"0 0 24 24\"\r\n fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n >\r\n <path\r\n d=\"M4.51025 11.9883L19.5003 11.9883\"\r\n stroke=\"white\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n d=\"M10.514 17.9766L4.49805 11.9996L10.514 6.02256\"\r\n stroke=\"white\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n </svg>\r\n </ng-template>\r\n Previous | {{ previousPage.title }}\r\n </button>\r\n </div>\r\n <div\r\n class=\"nextButtonDiv\"\r\n [ngClass]=\"{ 'nextDirection-rtl': acceptedLanguage === 'ara' }\"\r\n >\r\n <button\r\n class=\"md-2 rounded-pill navButton\"\r\n type=\"button\"\r\n (click)=\"onNavigateNext()\"\r\n *ngIf=\"currentPageIndex < pages.length - 1\"\r\n >\r\n Next | {{ nextPage.title }}\r\n <ng-container *ngIf=\"acceptedLanguage === 'ara'; else defaultSvg\">\r\n <svg\r\n width=\"24\"\r\n height=\"24\"\r\n viewBox=\"0 0 24 24\"\r\n fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n >\r\n <path\r\n d=\"M4.51025 11.9883L19.5003 11.9883\"\r\n stroke=\"white\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n d=\"M10.514 17.9766L4.49805 11.9996L10.514 6.02256\"\r\n stroke=\"white\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n </svg>\r\n </ng-container>\r\n <ng-template #defaultSvg>\r\n <svg\r\n width=\"24\"\r\n height=\"24\"\r\n viewBox=\"0 0 24 24\"\r\n fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n >\r\n <path\r\n d=\"M19.4897 12.0117L4.49975 12.0117\"\r\n stroke=\"white\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n d=\"M13.486 6.02344L19.502 12.0004L13.486 17.9774\"\r\n stroke=\"white\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n </svg>\r\n </ng-template>\r\n </button>\r\n <button\r\n class=\"submitBtn ms-md-2 me-md-2 rounded-pill\"\r\n type=\"button\"\r\n *ngIf=\"currentPageIndex == pages.length - 1\"\r\n (click)=\"submitForm()\"\r\n >\r\n Submit\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: [".pageTitle{font-size:15px;font-weight:500}.pageTitleDiv{padding-left:3rem;padding-top:3rem;padding-right:3rem}@media (max-width: 1024px){.pageTitleDiv{padding-left:1rem;padding-right:1rem;padding-top:2rem}}@media (max-width: 576px){.pageTitleDiv{padding-left:.4rem;padding-right:.4rem;padding-top:1.5rem}}.button-inner-container{width:100%;position:relative;padding:0rem 3rem 3rem}@media (max-width: 1024px){.button-inner-container{padding-left:1rem;padding-right:1rem}}@media (max-width: 576px){.button-inner-container{padding:.1rem .5rem 2rem}}@media (max-width: 576px){.marginSize{padding:0!important}}.footerButton{padding:10px 32px 16px 30px;display:flex;flex-wrap:wrap}@media (max-width: 576px){.footerButton{padding-left:20px;padding-right:17px}}.navButton{background:#084fff;color:#fff;border:none;padding:10px 8px;width:auto}.submitBtn{background:#084fff;color:#fff;border:none;padding:10px 27px;width:auto}.prevButtonDiv{display:flex;justify-content:center;margin-bottom:5px}.nextButtonDiv{display:flex;justify-content:end;margin-left:auto;margin-bottom:5px}.nextDirection-rtl{margin-left:0;margin-right:auto}.tab-content,.row{background-color:#fff}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i2.FormElementsComponent, selector: "lib-form-elements", inputs: ["grid", "currentPageIndex", "edit", "acceptedLanguage"], outputs: ["subFormChange"] }] }); }
32
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: NextPrevNavigationComponent, selector: "lib-next-prev-navigation", inputs: { currentPageIndex: "currentPageIndex", pages: "pages", previousPage: "previousPage", nextPage: "nextPage", currentPage: "currentPage", edit: "edit", acceptedLanguage: "acceptedLanguage" }, outputs: { navigateNext: "navigateNext", navigatePrevious: "navigatePrevious", submitEmit: "submitEmit", subFormChange: "subFormChange" }, ngImport: i0, template: "<div class=\"pageTitleDiv\">\r\n <p class=\"pageTitle\">{{ currentPage.title }}</p>\r\n</div>\r\n<div class=\"button-inner-container rounded\">\r\n <div class=\"tab-content pt-5 pb-3 row\">\r\n <div *ngFor=\"let row of pages[currentPageIndex].rows\" class=\"marginSize d-flex\">\r\n <div *ngFor=\"let grid of row.grid\"\r\n [ngStyle]=\"{'width.%': (grid.element.count) * (100 / (12))}\">\r\n <lib-form-elements\r\n [grid]=\"grid\"\r\n [currentPageIndex]=\"currentPageIndex\"\r\n [edit]=\"edit\"\r\n [acceptedLanguage]=\"acceptedLanguage\"\r\n (subFormChange)=\"updateSubFormWithSubmissions($event)\"\r\n ></lib-form-elements>\r\n </div>\r\n </div>\r\n <div class=\"footerButton\">\r\n <div\r\n class=\"prevButtonDiv\"\r\n [ngClass]=\"{ 'prevDirection-rtl': acceptedLanguage === 'ara' }\">\r\n <button\r\n class=\"me-md-2 rounded-pill navButton\"\r\n type=\"button\"\r\n (click)=\"onNavigatePrevious()\"\r\n *ngIf=\"0 < currentPageIndex\"\r\n >\r\n <ng-container *ngIf=\"acceptedLanguage === 'ara'; else defaultSvg\">\r\n <svg\r\n width=\"24\"\r\n height=\"24\"\r\n viewBox=\"0 0 24 24\"\r\n fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n >\r\n <path\r\n d=\"M19.4897 12.0117L4.49975 12.0117\"\r\n stroke=\"white\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n d=\"M13.486 6.02344L19.502 12.0004L13.486 17.9774\"\r\n stroke=\"white\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n </svg>\r\n </ng-container>\r\n <ng-template #defaultSvg>\r\n <svg\r\n width=\"24\"\r\n height=\"24\"\r\n viewBox=\"0 0 24 24\"\r\n fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n >\r\n <path\r\n d=\"M4.51025 11.9883L19.5003 11.9883\"\r\n stroke=\"white\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n d=\"M10.514 17.9766L4.49805 11.9996L10.514 6.02256\"\r\n stroke=\"white\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n </svg>\r\n </ng-template>\r\n Previous | {{ previousPage.title }}\r\n </button>\r\n </div>\r\n <div\r\n class=\"nextButtonDiv\"\r\n [ngClass]=\"{ 'nextDirection-rtl': acceptedLanguage === 'ara' }\"\r\n >\r\n <button\r\n class=\"md-2 rounded-pill navButton\"\r\n type=\"button\"\r\n (click)=\"onNavigateNext()\"\r\n *ngIf=\"currentPageIndex < pages.length - 1\"\r\n >\r\n Next | {{ nextPage.title }}\r\n <ng-container *ngIf=\"acceptedLanguage === 'ara'; else defaultSvg\">\r\n <svg\r\n width=\"24\"\r\n height=\"24\"\r\n viewBox=\"0 0 24 24\"\r\n fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n >\r\n <path\r\n d=\"M4.51025 11.9883L19.5003 11.9883\"\r\n stroke=\"white\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n d=\"M10.514 17.9766L4.49805 11.9996L10.514 6.02256\"\r\n stroke=\"white\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n </svg>\r\n </ng-container>\r\n <ng-template #defaultSvg>\r\n <svg\r\n width=\"24\"\r\n height=\"24\"\r\n viewBox=\"0 0 24 24\"\r\n fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n >\r\n <path\r\n d=\"M19.4897 12.0117L4.49975 12.0117\"\r\n stroke=\"white\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n d=\"M13.486 6.02344L19.502 12.0004L13.486 17.9774\"\r\n stroke=\"white\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n </svg>\r\n </ng-template>\r\n </button>\r\n <button\r\n class=\"submitBtn ms-md-2 me-md-2 rounded-pill\"\r\n type=\"button\"\r\n *ngIf=\"currentPageIndex == pages.length - 1\"\r\n (click)=\"submitForm()\"\r\n >\r\n Submit\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: [".pageTitle{font-size:15px;font-weight:500}.pageTitleDiv{padding-left:3rem;padding-top:3rem;padding-right:3rem}@media (max-width: 1024px){.pageTitleDiv{padding-left:1rem;padding-right:1rem;padding-top:2rem}}@media (max-width: 576px){.pageTitleDiv{padding-left:.4rem;padding-right:.4rem;padding-top:1.5rem}}.button-inner-container{width:100%;position:relative;padding:0rem 3rem 3rem}@media (max-width: 1024px){.button-inner-container{padding-left:1rem;padding-right:1rem}}@media (max-width: 576px){.button-inner-container{padding:.1rem .5rem 2rem}}@media (max-width: 576px){.marginSize{padding:0!important}}.footerButton{padding:10px 32px 16px 30px;display:flex;flex-wrap:wrap}@media (max-width: 576px){.footerButton{padding-left:20px;padding-right:17px}}.navButton{background:#084fff;color:#fff;border:none;padding:10px 8px;width:auto}.submitBtn{background:#084fff;color:#fff;border:none;padding:10px 27px;width:auto}.prevButtonDiv{display:flex;justify-content:center;margin-bottom:5px}.nextButtonDiv{display:flex;justify-content:flex-end;margin-left:auto;margin-bottom:5px}.nextDirection-rtl{margin-left:0;margin-right:auto}.tab-content,.row{background-color:#fff}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i2.FormElementsComponent, selector: "lib-form-elements", inputs: ["grid", "currentPageIndex", "edit", "acceptedLanguage"], outputs: ["subFormChange"] }] }); }
33
33
  }
34
34
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: NextPrevNavigationComponent, decorators: [{
35
35
  type: Component,
36
- args: [{ selector: 'lib-next-prev-navigation', template: "<div class=\"pageTitleDiv\">\r\n <p class=\"pageTitle\">{{ currentPage.title }}</p>\r\n</div>\r\n<div class=\"button-inner-container rounded\">\r\n <div class=\"tab-content pt-5 pb-3 row\">\r\n <div *ngFor=\"let row of pages[currentPageIndex].rows\" class=\"marginSize d-flex\">\r\n <div *ngFor=\"let grid of row.grid\"\r\n [ngStyle]=\"{'width.%': (grid.element.count) * (100 / (12))}\">\r\n <lib-form-elements\r\n [grid]=\"grid\"\r\n [currentPageIndex]=\"currentPageIndex\"\r\n [edit]=\"edit\"\r\n [acceptedLanguage]=\"acceptedLanguage\"\r\n (subFormChange)=\"updateSubFormWithSubmissions($event)\"\r\n ></lib-form-elements>\r\n </div>\r\n </div>\r\n <div class=\"footerButton\">\r\n <div\r\n class=\"prevButtonDiv\"\r\n [ngClass]=\"{ 'prevDirection-rtl': acceptedLanguage === 'ara' }\">\r\n <button\r\n class=\"me-md-2 rounded-pill navButton\"\r\n type=\"button\"\r\n (click)=\"onNavigatePrevious()\"\r\n *ngIf=\"0 < currentPageIndex\"\r\n >\r\n <ng-container *ngIf=\"acceptedLanguage === 'ara'; else defaultSvg\">\r\n <svg\r\n width=\"24\"\r\n height=\"24\"\r\n viewBox=\"0 0 24 24\"\r\n fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n >\r\n <path\r\n d=\"M19.4897 12.0117L4.49975 12.0117\"\r\n stroke=\"white\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n d=\"M13.486 6.02344L19.502 12.0004L13.486 17.9774\"\r\n stroke=\"white\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n </svg>\r\n </ng-container>\r\n <ng-template #defaultSvg>\r\n <svg\r\n width=\"24\"\r\n height=\"24\"\r\n viewBox=\"0 0 24 24\"\r\n fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n >\r\n <path\r\n d=\"M4.51025 11.9883L19.5003 11.9883\"\r\n stroke=\"white\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n d=\"M10.514 17.9766L4.49805 11.9996L10.514 6.02256\"\r\n stroke=\"white\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n </svg>\r\n </ng-template>\r\n Previous | {{ previousPage.title }}\r\n </button>\r\n </div>\r\n <div\r\n class=\"nextButtonDiv\"\r\n [ngClass]=\"{ 'nextDirection-rtl': acceptedLanguage === 'ara' }\"\r\n >\r\n <button\r\n class=\"md-2 rounded-pill navButton\"\r\n type=\"button\"\r\n (click)=\"onNavigateNext()\"\r\n *ngIf=\"currentPageIndex < pages.length - 1\"\r\n >\r\n Next | {{ nextPage.title }}\r\n <ng-container *ngIf=\"acceptedLanguage === 'ara'; else defaultSvg\">\r\n <svg\r\n width=\"24\"\r\n height=\"24\"\r\n viewBox=\"0 0 24 24\"\r\n fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n >\r\n <path\r\n d=\"M4.51025 11.9883L19.5003 11.9883\"\r\n stroke=\"white\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n d=\"M10.514 17.9766L4.49805 11.9996L10.514 6.02256\"\r\n stroke=\"white\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n </svg>\r\n </ng-container>\r\n <ng-template #defaultSvg>\r\n <svg\r\n width=\"24\"\r\n height=\"24\"\r\n viewBox=\"0 0 24 24\"\r\n fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n >\r\n <path\r\n d=\"M19.4897 12.0117L4.49975 12.0117\"\r\n stroke=\"white\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n d=\"M13.486 6.02344L19.502 12.0004L13.486 17.9774\"\r\n stroke=\"white\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n </svg>\r\n </ng-template>\r\n </button>\r\n <button\r\n class=\"submitBtn ms-md-2 me-md-2 rounded-pill\"\r\n type=\"button\"\r\n *ngIf=\"currentPageIndex == pages.length - 1\"\r\n (click)=\"submitForm()\"\r\n >\r\n Submit\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: [".pageTitle{font-size:15px;font-weight:500}.pageTitleDiv{padding-left:3rem;padding-top:3rem;padding-right:3rem}@media (max-width: 1024px){.pageTitleDiv{padding-left:1rem;padding-right:1rem;padding-top:2rem}}@media (max-width: 576px){.pageTitleDiv{padding-left:.4rem;padding-right:.4rem;padding-top:1.5rem}}.button-inner-container{width:100%;position:relative;padding:0rem 3rem 3rem}@media (max-width: 1024px){.button-inner-container{padding-left:1rem;padding-right:1rem}}@media (max-width: 576px){.button-inner-container{padding:.1rem .5rem 2rem}}@media (max-width: 576px){.marginSize{padding:0!important}}.footerButton{padding:10px 32px 16px 30px;display:flex;flex-wrap:wrap}@media (max-width: 576px){.footerButton{padding-left:20px;padding-right:17px}}.navButton{background:#084fff;color:#fff;border:none;padding:10px 8px;width:auto}.submitBtn{background:#084fff;color:#fff;border:none;padding:10px 27px;width:auto}.prevButtonDiv{display:flex;justify-content:center;margin-bottom:5px}.nextButtonDiv{display:flex;justify-content:end;margin-left:auto;margin-bottom:5px}.nextDirection-rtl{margin-left:0;margin-right:auto}.tab-content,.row{background-color:#fff}\n"] }]
36
+ args: [{ selector: 'lib-next-prev-navigation', template: "<div class=\"pageTitleDiv\">\r\n <p class=\"pageTitle\">{{ currentPage.title }}</p>\r\n</div>\r\n<div class=\"button-inner-container rounded\">\r\n <div class=\"tab-content pt-5 pb-3 row\">\r\n <div *ngFor=\"let row of pages[currentPageIndex].rows\" class=\"marginSize d-flex\">\r\n <div *ngFor=\"let grid of row.grid\"\r\n [ngStyle]=\"{'width.%': (grid.element.count) * (100 / (12))}\">\r\n <lib-form-elements\r\n [grid]=\"grid\"\r\n [currentPageIndex]=\"currentPageIndex\"\r\n [edit]=\"edit\"\r\n [acceptedLanguage]=\"acceptedLanguage\"\r\n (subFormChange)=\"updateSubFormWithSubmissions($event)\"\r\n ></lib-form-elements>\r\n </div>\r\n </div>\r\n <div class=\"footerButton\">\r\n <div\r\n class=\"prevButtonDiv\"\r\n [ngClass]=\"{ 'prevDirection-rtl': acceptedLanguage === 'ara' }\">\r\n <button\r\n class=\"me-md-2 rounded-pill navButton\"\r\n type=\"button\"\r\n (click)=\"onNavigatePrevious()\"\r\n *ngIf=\"0 < currentPageIndex\"\r\n >\r\n <ng-container *ngIf=\"acceptedLanguage === 'ara'; else defaultSvg\">\r\n <svg\r\n width=\"24\"\r\n height=\"24\"\r\n viewBox=\"0 0 24 24\"\r\n fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n >\r\n <path\r\n d=\"M19.4897 12.0117L4.49975 12.0117\"\r\n stroke=\"white\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n d=\"M13.486 6.02344L19.502 12.0004L13.486 17.9774\"\r\n stroke=\"white\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n </svg>\r\n </ng-container>\r\n <ng-template #defaultSvg>\r\n <svg\r\n width=\"24\"\r\n height=\"24\"\r\n viewBox=\"0 0 24 24\"\r\n fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n >\r\n <path\r\n d=\"M4.51025 11.9883L19.5003 11.9883\"\r\n stroke=\"white\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n d=\"M10.514 17.9766L4.49805 11.9996L10.514 6.02256\"\r\n stroke=\"white\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n </svg>\r\n </ng-template>\r\n Previous | {{ previousPage.title }}\r\n </button>\r\n </div>\r\n <div\r\n class=\"nextButtonDiv\"\r\n [ngClass]=\"{ 'nextDirection-rtl': acceptedLanguage === 'ara' }\"\r\n >\r\n <button\r\n class=\"md-2 rounded-pill navButton\"\r\n type=\"button\"\r\n (click)=\"onNavigateNext()\"\r\n *ngIf=\"currentPageIndex < pages.length - 1\"\r\n >\r\n Next | {{ nextPage.title }}\r\n <ng-container *ngIf=\"acceptedLanguage === 'ara'; else defaultSvg\">\r\n <svg\r\n width=\"24\"\r\n height=\"24\"\r\n viewBox=\"0 0 24 24\"\r\n fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n >\r\n <path\r\n d=\"M4.51025 11.9883L19.5003 11.9883\"\r\n stroke=\"white\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n d=\"M10.514 17.9766L4.49805 11.9996L10.514 6.02256\"\r\n stroke=\"white\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n </svg>\r\n </ng-container>\r\n <ng-template #defaultSvg>\r\n <svg\r\n width=\"24\"\r\n height=\"24\"\r\n viewBox=\"0 0 24 24\"\r\n fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n >\r\n <path\r\n d=\"M19.4897 12.0117L4.49975 12.0117\"\r\n stroke=\"white\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n <path\r\n d=\"M13.486 6.02344L19.502 12.0004L13.486 17.9774\"\r\n stroke=\"white\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n />\r\n </svg>\r\n </ng-template>\r\n </button>\r\n <button\r\n class=\"submitBtn ms-md-2 me-md-2 rounded-pill\"\r\n type=\"button\"\r\n *ngIf=\"currentPageIndex == pages.length - 1\"\r\n (click)=\"submitForm()\"\r\n >\r\n Submit\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: [".pageTitle{font-size:15px;font-weight:500}.pageTitleDiv{padding-left:3rem;padding-top:3rem;padding-right:3rem}@media (max-width: 1024px){.pageTitleDiv{padding-left:1rem;padding-right:1rem;padding-top:2rem}}@media (max-width: 576px){.pageTitleDiv{padding-left:.4rem;padding-right:.4rem;padding-top:1.5rem}}.button-inner-container{width:100%;position:relative;padding:0rem 3rem 3rem}@media (max-width: 1024px){.button-inner-container{padding-left:1rem;padding-right:1rem}}@media (max-width: 576px){.button-inner-container{padding:.1rem .5rem 2rem}}@media (max-width: 576px){.marginSize{padding:0!important}}.footerButton{padding:10px 32px 16px 30px;display:flex;flex-wrap:wrap}@media (max-width: 576px){.footerButton{padding-left:20px;padding-right:17px}}.navButton{background:#084fff;color:#fff;border:none;padding:10px 8px;width:auto}.submitBtn{background:#084fff;color:#fff;border:none;padding:10px 27px;width:auto}.prevButtonDiv{display:flex;justify-content:center;margin-bottom:5px}.nextButtonDiv{display:flex;justify-content:flex-end;margin-left:auto;margin-bottom:5px}.nextDirection-rtl{margin-left:0;margin-right:auto}.tab-content,.row{background-color:#fff}\n"] }]
37
37
  }], propDecorators: { currentPageIndex: [{
38
38
  type: Input
39
39
  }], pages: [{