@piserve-tech/form-submission 1.0.21 → 1.0.23
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.
- package/esm2022/form-fields/check-box-fields/check-box-fields.component.mjs +2 -2
- package/esm2022/form-fields/date-time-fields/date-time-fields.component.mjs +2 -2
- package/esm2022/form-fields/drop-down-fields/drop-down-fields.component.mjs +2 -2
- package/esm2022/form-fields/file-picker-fields/file-picker-fields.component.mjs +2 -2
- package/esm2022/form-fields/location-fields/location-fields.component.mjs +2 -2
- package/esm2022/form-fields/mail-fields/mail-fields.component.mjs +2 -2
- package/esm2022/form-fields/mobile-fields/mobile-fields.component.mjs +2 -2
- package/esm2022/form-fields/number-fields/number-fields.component.mjs +2 -2
- package/esm2022/form-fields/password-fields/password-fields.component.mjs +2 -2
- package/esm2022/form-fields/radio-button-fields/radio-button-fields.component.mjs +2 -2
- package/esm2022/form-fields/rich-text-editor-fields/rich-text-editor-fields.component.mjs +2 -2
- package/esm2022/form-fields/selection-matrix-fields/selection-matrix-fields.component.mjs +2 -2
- package/esm2022/form-fields/signature-fields/signature-fields.component.mjs +2 -2
- package/esm2022/form-fields/slider-fields/slider-fields.component.mjs +2 -2
- package/esm2022/form-fields/terms-and-condition-fields/terms-and-condition-fields.component.mjs +2 -2
- package/esm2022/form-fields/text-area-fields/text-area-fields.component.mjs +2 -2
- package/esm2022/form-fields/text-fields/text-fields.component.mjs +2 -2
- package/esm2022/form-fields/toggle-switch-fields/toggle-switch-fields.component.mjs +2 -2
- package/esm2022/form-fields/url-fields/url-fields.component.mjs +2 -2
- package/esm2022/form-submission/form-submission.module.mjs +8 -2
- package/fesm2022/piserve-tech-form-submission.mjs +45 -39
- package/fesm2022/piserve-tech-form-submission.mjs.map +1 -1
- package/form-submission/form-submission.module.d.ts +1 -0
- package/package.json +1 -1
- package/src/assets/ContryDetails.json +25956 -0
- package/src/assets/css/fontawesome-custom.css +1 -0
|
@@ -122,11 +122,11 @@ export class PasswordFieldsComponent {
|
|
|
122
122
|
}
|
|
123
123
|
}
|
|
124
124
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PasswordFieldsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
125
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: PasswordFieldsComponent, selector: "lib-password-fields", inputs: { grid: "grid" }, ngImport: i0, template: "<div [ngClass]=\"'col-' + count\" class=\"mb-4 px-3\">\n <div class=\"password-input-wrapper\">\n <div class=\"input-wrapper\">\n <label for=\"passwordField\">{{ question.question }}</label> \n <span class=\"text-danger\" *ngIf=\"required\">*</span>\n <div class=\"svg-wrapper mb-2 hintIcon\" [attr.data-title]=\"hint\" *ngIf=\"hint\">\n <svg class=\"hintSvg\" viewBox=\"0 0 30 30\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </div>\n </div>\n <input\n type=\"password\"\n class=\"form-control mb-2 height\"\n id=\"passwordField\"\n (blur)=\"validatePassword()\"\n [(ngModel)]=\"enteredPassowrd\"\n [class.invalid]=\"validatedPassword\"\n />\n <button id=\"togglePasswordBtn\" class=\"toggle-password-btn\" (click)=\"togglePasswordVisibility()\">\n <i class=\"fa fa-eye\" id=\"passwordEyeIcon\"></i>\n </button>\n </div>\n <div class=\"password-strength-meter\" *ngIf=\"displayStrength\">\n <div class=\"progress\">\n <div\n class=\"progress-bar\"\n role=\"progressbar\"\n [style.width]=\"passwordStrength + '%'\"\n [class.bg-danger]=\"passwordStrength < 30\"\n [class.bg-warning]=\"passwordStrength >= 30 && passwordStrength < 70\"\n [class.bg-success]=\"passwordStrength >= 70\"\n ></div>\n </div>\n </div>\n <div *ngIf=\"validatedPassword\" class=\"text-danger mb-2\">\n <svg class=\"validationSvg\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n <path 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\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" fill=\"#FF0000\" stroke=\"#FF0000\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M12 12.75L12 7.75\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <circle cx=\"12\" cy=\"16\" r=\"1\" fill=\"white\"/>\n </svg>\n {{validationMessage}}</div>\n \n <div class=\"cnfrmPasswordWrapper\" *ngIf=\"confirmPassword\">\n <label for=\"cnfrmPasswordField\">Confirm password</label>\n <input type=\"password\" class=\"form-control mb-2 height\" id=\"cnfrmPasswordField\"\n (blur)=\"checkPasswordMatch()\"\n [(ngModel)]=\"enteredCnfrmPassword\"\n [class.invalid]=\"validatedCnfrmPassword\">\n <button id=\"toggleCnfrmPasswordBtn\" class=\"toggle-password-btn\" (click)=\"toggleCnfrmPasswordVisibility()\">\n <i class=\"fa fa-eye\" id=\"CnfrmPasswordEyeIcon\"></i>\n </button>\n </div>\n <div *ngIf=\"validatedCnfrmPassword\" class=\"text-danger\">\n <svg class=\"validationSvg\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n <path 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\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" fill=\"#FF0000\" stroke=\"#FF0000\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M12 12.75L12 7.75\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <circle cx=\"12\" cy=\"16\" r=\"1\" fill=\"white\"/>\n </svg>\n {{cnfrmValidationMessage}}</div>\n \n</div>\n", styles: ["
|
|
125
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: PasswordFieldsComponent, selector: "lib-password-fields", inputs: { grid: "grid" }, ngImport: i0, template: "<div [ngClass]=\"'col-' + count\" class=\"mb-4 px-3\">\n <div class=\"password-input-wrapper\">\n <div class=\"input-wrapper\">\n <label for=\"passwordField\">{{ question.question }}</label> \n <span class=\"text-danger\" *ngIf=\"required\">*</span>\n <div class=\"svg-wrapper mb-2 hintIcon\" [attr.data-title]=\"hint\" *ngIf=\"hint\">\n <svg class=\"hintSvg\" viewBox=\"0 0 30 30\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </div>\n </div>\n <input\n type=\"password\"\n class=\"form-control mb-2 height\"\n id=\"passwordField\"\n (blur)=\"validatePassword()\"\n [(ngModel)]=\"enteredPassowrd\"\n [class.invalid]=\"validatedPassword\"\n />\n <button id=\"togglePasswordBtn\" class=\"toggle-password-btn\" (click)=\"togglePasswordVisibility()\">\n <i class=\"fa fa-eye\" id=\"passwordEyeIcon\"></i>\n </button>\n </div>\n <div class=\"password-strength-meter\" *ngIf=\"displayStrength\">\n <div class=\"progress\">\n <div\n class=\"progress-bar\"\n role=\"progressbar\"\n [style.width]=\"passwordStrength + '%'\"\n [class.bg-danger]=\"passwordStrength < 30\"\n [class.bg-warning]=\"passwordStrength >= 30 && passwordStrength < 70\"\n [class.bg-success]=\"passwordStrength >= 70\"\n ></div>\n </div>\n </div>\n <div *ngIf=\"validatedPassword\" class=\"text-danger mb-2\">\n <svg class=\"validationSvg\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n <path 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\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" fill=\"#FF0000\" stroke=\"#FF0000\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M12 12.75L12 7.75\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <circle cx=\"12\" cy=\"16\" r=\"1\" fill=\"white\"/>\n </svg>\n {{validationMessage}}</div>\n \n <div class=\"cnfrmPasswordWrapper\" *ngIf=\"confirmPassword\">\n <label for=\"cnfrmPasswordField\">Confirm password</label>\n <input type=\"password\" class=\"form-control mb-2 height\" id=\"cnfrmPasswordField\"\n (blur)=\"checkPasswordMatch()\"\n [(ngModel)]=\"enteredCnfrmPassword\"\n [class.invalid]=\"validatedCnfrmPassword\">\n <button id=\"toggleCnfrmPasswordBtn\" class=\"toggle-password-btn\" (click)=\"toggleCnfrmPasswordVisibility()\">\n <i class=\"fa fa-eye\" id=\"CnfrmPasswordEyeIcon\"></i>\n </button>\n </div>\n <div *ngIf=\"validatedCnfrmPassword\" class=\"text-danger\">\n <svg class=\"validationSvg\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n <path 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\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" fill=\"#FF0000\" stroke=\"#FF0000\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M12 12.75L12 7.75\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <circle cx=\"12\" cy=\"16\" r=\"1\" fill=\"white\"/>\n </svg>\n {{cnfrmValidationMessage}}</div>\n \n</div>\n", styles: [".input-wrapper{display:flex;align-items:flex-start}.svg-wrapper{margin-left:auto;z-index:999}.hintIcon{position:relative;cursor:pointer}.hintIcon:hover:before{content:attr(data-title);position:absolute;top:calc(100% + 2px);left:50%;transform:translate(-50%);padding:4px 8px;border-radius:4px;background-color:#1d252d;color:#8e9aa0;font-size:14px;white-space:nowrap}.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}.password-input-wrapper{position:relative}.password-input{padding-right:40px}.toggle-password-btn{position:absolute;top:70%;right:15px;transform:translateY(-50%);border:none;background-color:transparent;cursor:pointer}.toggle-password-btn:focus{outline:none}.cnfrmPasswordWrapper{position:relative}.password-strength-meter{width:40%;margin-top:10px;margin-left:auto}.progress{height:10px}.progress-bar{transition:width .3s ease-in-out}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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"] }] }); }
|
|
126
126
|
}
|
|
127
127
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PasswordFieldsComponent, decorators: [{
|
|
128
128
|
type: Component,
|
|
129
|
-
args: [{ selector: 'lib-password-fields', template: "<div [ngClass]=\"'col-' + count\" class=\"mb-4 px-3\">\n <div class=\"password-input-wrapper\">\n <div class=\"input-wrapper\">\n <label for=\"passwordField\">{{ question.question }}</label> \n <span class=\"text-danger\" *ngIf=\"required\">*</span>\n <div class=\"svg-wrapper mb-2 hintIcon\" [attr.data-title]=\"hint\" *ngIf=\"hint\">\n <svg class=\"hintSvg\" viewBox=\"0 0 30 30\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </div>\n </div>\n <input\n type=\"password\"\n class=\"form-control mb-2 height\"\n id=\"passwordField\"\n (blur)=\"validatePassword()\"\n [(ngModel)]=\"enteredPassowrd\"\n [class.invalid]=\"validatedPassword\"\n />\n <button id=\"togglePasswordBtn\" class=\"toggle-password-btn\" (click)=\"togglePasswordVisibility()\">\n <i class=\"fa fa-eye\" id=\"passwordEyeIcon\"></i>\n </button>\n </div>\n <div class=\"password-strength-meter\" *ngIf=\"displayStrength\">\n <div class=\"progress\">\n <div\n class=\"progress-bar\"\n role=\"progressbar\"\n [style.width]=\"passwordStrength + '%'\"\n [class.bg-danger]=\"passwordStrength < 30\"\n [class.bg-warning]=\"passwordStrength >= 30 && passwordStrength < 70\"\n [class.bg-success]=\"passwordStrength >= 70\"\n ></div>\n </div>\n </div>\n <div *ngIf=\"validatedPassword\" class=\"text-danger mb-2\">\n <svg class=\"validationSvg\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n <path 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\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" fill=\"#FF0000\" stroke=\"#FF0000\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M12 12.75L12 7.75\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <circle cx=\"12\" cy=\"16\" r=\"1\" fill=\"white\"/>\n </svg>\n {{validationMessage}}</div>\n \n <div class=\"cnfrmPasswordWrapper\" *ngIf=\"confirmPassword\">\n <label for=\"cnfrmPasswordField\">Confirm password</label>\n <input type=\"password\" class=\"form-control mb-2 height\" id=\"cnfrmPasswordField\"\n (blur)=\"checkPasswordMatch()\"\n [(ngModel)]=\"enteredCnfrmPassword\"\n [class.invalid]=\"validatedCnfrmPassword\">\n <button id=\"toggleCnfrmPasswordBtn\" class=\"toggle-password-btn\" (click)=\"toggleCnfrmPasswordVisibility()\">\n <i class=\"fa fa-eye\" id=\"CnfrmPasswordEyeIcon\"></i>\n </button>\n </div>\n <div *ngIf=\"validatedCnfrmPassword\" class=\"text-danger\">\n <svg class=\"validationSvg\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n <path 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\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" fill=\"#FF0000\" stroke=\"#FF0000\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M12 12.75L12 7.75\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <circle cx=\"12\" cy=\"16\" r=\"1\" fill=\"white\"/>\n </svg>\n {{cnfrmValidationMessage}}</div>\n \n</div>\n", styles: ["
|
|
129
|
+
args: [{ selector: 'lib-password-fields', template: "<div [ngClass]=\"'col-' + count\" class=\"mb-4 px-3\">\n <div class=\"password-input-wrapper\">\n <div class=\"input-wrapper\">\n <label for=\"passwordField\">{{ question.question }}</label> \n <span class=\"text-danger\" *ngIf=\"required\">*</span>\n <div class=\"svg-wrapper mb-2 hintIcon\" [attr.data-title]=\"hint\" *ngIf=\"hint\">\n <svg class=\"hintSvg\" viewBox=\"0 0 30 30\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </div>\n </div>\n <input\n type=\"password\"\n class=\"form-control mb-2 height\"\n id=\"passwordField\"\n (blur)=\"validatePassword()\"\n [(ngModel)]=\"enteredPassowrd\"\n [class.invalid]=\"validatedPassword\"\n />\n <button id=\"togglePasswordBtn\" class=\"toggle-password-btn\" (click)=\"togglePasswordVisibility()\">\n <i class=\"fa fa-eye\" id=\"passwordEyeIcon\"></i>\n </button>\n </div>\n <div class=\"password-strength-meter\" *ngIf=\"displayStrength\">\n <div class=\"progress\">\n <div\n class=\"progress-bar\"\n role=\"progressbar\"\n [style.width]=\"passwordStrength + '%'\"\n [class.bg-danger]=\"passwordStrength < 30\"\n [class.bg-warning]=\"passwordStrength >= 30 && passwordStrength < 70\"\n [class.bg-success]=\"passwordStrength >= 70\"\n ></div>\n </div>\n </div>\n <div *ngIf=\"validatedPassword\" class=\"text-danger mb-2\">\n <svg class=\"validationSvg\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n <path 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\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" fill=\"#FF0000\" stroke=\"#FF0000\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M12 12.75L12 7.75\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <circle cx=\"12\" cy=\"16\" r=\"1\" fill=\"white\"/>\n </svg>\n {{validationMessage}}</div>\n \n <div class=\"cnfrmPasswordWrapper\" *ngIf=\"confirmPassword\">\n <label for=\"cnfrmPasswordField\">Confirm password</label>\n <input type=\"password\" class=\"form-control mb-2 height\" id=\"cnfrmPasswordField\"\n (blur)=\"checkPasswordMatch()\"\n [(ngModel)]=\"enteredCnfrmPassword\"\n [class.invalid]=\"validatedCnfrmPassword\">\n <button id=\"toggleCnfrmPasswordBtn\" class=\"toggle-password-btn\" (click)=\"toggleCnfrmPasswordVisibility()\">\n <i class=\"fa fa-eye\" id=\"CnfrmPasswordEyeIcon\"></i>\n </button>\n </div>\n <div *ngIf=\"validatedCnfrmPassword\" class=\"text-danger\">\n <svg class=\"validationSvg\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n <path 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\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" fill=\"#FF0000\" stroke=\"#FF0000\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M12 12.75L12 7.75\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <circle cx=\"12\" cy=\"16\" r=\"1\" fill=\"white\"/>\n </svg>\n {{cnfrmValidationMessage}}</div>\n \n</div>\n", styles: [".input-wrapper{display:flex;align-items:flex-start}.svg-wrapper{margin-left:auto;z-index:999}.hintIcon{position:relative;cursor:pointer}.hintIcon:hover:before{content:attr(data-title);position:absolute;top:calc(100% + 2px);left:50%;transform:translate(-50%);padding:4px 8px;border-radius:4px;background-color:#1d252d;color:#8e9aa0;font-size:14px;white-space:nowrap}.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}.password-input-wrapper{position:relative}.password-input{padding-right:40px}.toggle-password-btn{position:absolute;top:70%;right:15px;transform:translateY(-50%);border:none;background-color:transparent;cursor:pointer}.toggle-password-btn:focus{outline:none}.cnfrmPasswordWrapper{position:relative}.password-strength-meter{width:40%;margin-top:10px;margin-left:auto}.progress{height:10px}.progress-bar{transition:width .3s ease-in-out}\n"] }]
|
|
130
130
|
}], propDecorators: { grid: [{
|
|
131
131
|
type: Input
|
|
132
132
|
}] } });
|
|
@@ -75,11 +75,11 @@ export class RadioButtonFieldsComponent {
|
|
|
75
75
|
}
|
|
76
76
|
}
|
|
77
77
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: RadioButtonFieldsComponent, deps: [{ token: i1.FormService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
78
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: RadioButtonFieldsComponent, selector: "lib-radio-button-fields", inputs: { grid: "grid" }, ngImport: i0, template: "<div [ngClass]=\"'col-' + count\" class=\"mb-4 px-3\">\n <div class=\"input-wrapper\">\n <label>{{ question.question }}</label> \n <span class=\"text-danger\" *ngIf=\"required\">*</span>\n <div class=\"svg-wrapper mb-2 hintIcon\" [attr.data-title]=\"hint\" *ngIf=\"hint\">\n <svg class=\"hintSvg\" viewBox=\"0 0 30 30\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </div>\n</div>\n <div class=\"checkboxField\" *ngFor=\"let option of getOptions()\">\n <input\n class=\"formCheckbox mb-2\"\n type=\"radio\"\n [name]=\"question.id\"\n [id]=\"option.value\"\n [value]=\"option.value\"\n [style.accent-color]=\"color\"\n (blur)=\"validateInput()\"\n [(ngModel)]=\"selectedOption\"\n />\n <label class=\"formCheckLabel ms-2 mb-2\" [for]=\"option.value\">{{\n option.value\n }}</label>\n </div>\n <div *ngIf=\"validationFailed\" class=\"text-danger\">\n <svg class=\"validationSvg\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n <path 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\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" fill=\"#FF0000\" stroke=\"#FF0000\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M12 12.75L12 7.75\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <circle cx=\"12\" cy=\"16\" r=\"1\" fill=\"white\"/>\n </svg>\n {{validationMessage}}</div>\n</div>\n", styles: ["
|
|
78
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: RadioButtonFieldsComponent, selector: "lib-radio-button-fields", inputs: { grid: "grid" }, ngImport: i0, template: "<div [ngClass]=\"'col-' + count\" class=\"mb-4 px-3\">\n <div class=\"input-wrapper\">\n <label>{{ question.question }}</label> \n <span class=\"text-danger\" *ngIf=\"required\">*</span>\n <div class=\"svg-wrapper mb-2 hintIcon\" [attr.data-title]=\"hint\" *ngIf=\"hint\">\n <svg class=\"hintSvg\" viewBox=\"0 0 30 30\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </div>\n</div>\n <div class=\"checkboxField\" *ngFor=\"let option of getOptions()\">\n <input\n class=\"formCheckbox mb-2\"\n type=\"radio\"\n [name]=\"question.id\"\n [id]=\"option.value\"\n [value]=\"option.value\"\n [style.accent-color]=\"color\"\n (blur)=\"validateInput()\"\n [(ngModel)]=\"selectedOption\"\n />\n <label class=\"formCheckLabel ms-2 mb-2\" [for]=\"option.value\">{{\n option.value\n }}</label>\n </div>\n <div *ngIf=\"validationFailed\" class=\"text-danger\">\n <svg class=\"validationSvg\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n <path 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\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" fill=\"#FF0000\" stroke=\"#FF0000\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M12 12.75L12 7.75\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <circle cx=\"12\" cy=\"16\" r=\"1\" fill=\"white\"/>\n </svg>\n {{validationMessage}}</div>\n</div>\n", styles: [".input-wrapper{display:flex;align-items:flex-start}.svg-wrapper{margin-left:auto;z-index:999}.hintIcon{position:relative;cursor:pointer}.hintIcon:hover:before{content:attr(data-title);position:absolute;top:calc(100% + 2px);left:50%;transform:translate(-50%);padding:4px 8px;border-radius:4px;background-color:#1d252d;color:#8e9aa0;font-size:14px;white-space:nowrap}.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}.formCheckbox,.formCheckLabel{cursor:pointer}.formCheckbox{width:15px;height:15px}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.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: i3.RadioControlValueAccessor, selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] }); }
|
|
79
79
|
}
|
|
80
80
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: RadioButtonFieldsComponent, decorators: [{
|
|
81
81
|
type: Component,
|
|
82
|
-
args: [{ selector: 'lib-radio-button-fields', template: "<div [ngClass]=\"'col-' + count\" class=\"mb-4 px-3\">\n <div class=\"input-wrapper\">\n <label>{{ question.question }}</label> \n <span class=\"text-danger\" *ngIf=\"required\">*</span>\n <div class=\"svg-wrapper mb-2 hintIcon\" [attr.data-title]=\"hint\" *ngIf=\"hint\">\n <svg class=\"hintSvg\" viewBox=\"0 0 30 30\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </div>\n</div>\n <div class=\"checkboxField\" *ngFor=\"let option of getOptions()\">\n <input\n class=\"formCheckbox mb-2\"\n type=\"radio\"\n [name]=\"question.id\"\n [id]=\"option.value\"\n [value]=\"option.value\"\n [style.accent-color]=\"color\"\n (blur)=\"validateInput()\"\n [(ngModel)]=\"selectedOption\"\n />\n <label class=\"formCheckLabel ms-2 mb-2\" [for]=\"option.value\">{{\n option.value\n }}</label>\n </div>\n <div *ngIf=\"validationFailed\" class=\"text-danger\">\n <svg class=\"validationSvg\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n <path 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\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" fill=\"#FF0000\" stroke=\"#FF0000\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M12 12.75L12 7.75\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <circle cx=\"12\" cy=\"16\" r=\"1\" fill=\"white\"/>\n </svg>\n {{validationMessage}}</div>\n</div>\n", styles: ["
|
|
82
|
+
args: [{ selector: 'lib-radio-button-fields', template: "<div [ngClass]=\"'col-' + count\" class=\"mb-4 px-3\">\n <div class=\"input-wrapper\">\n <label>{{ question.question }}</label> \n <span class=\"text-danger\" *ngIf=\"required\">*</span>\n <div class=\"svg-wrapper mb-2 hintIcon\" [attr.data-title]=\"hint\" *ngIf=\"hint\">\n <svg class=\"hintSvg\" viewBox=\"0 0 30 30\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </div>\n</div>\n <div class=\"checkboxField\" *ngFor=\"let option of getOptions()\">\n <input\n class=\"formCheckbox mb-2\"\n type=\"radio\"\n [name]=\"question.id\"\n [id]=\"option.value\"\n [value]=\"option.value\"\n [style.accent-color]=\"color\"\n (blur)=\"validateInput()\"\n [(ngModel)]=\"selectedOption\"\n />\n <label class=\"formCheckLabel ms-2 mb-2\" [for]=\"option.value\">{{\n option.value\n }}</label>\n </div>\n <div *ngIf=\"validationFailed\" class=\"text-danger\">\n <svg class=\"validationSvg\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n <path 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\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" fill=\"#FF0000\" stroke=\"#FF0000\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M12 12.75L12 7.75\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <circle cx=\"12\" cy=\"16\" r=\"1\" fill=\"white\"/>\n </svg>\n {{validationMessage}}</div>\n</div>\n", styles: [".input-wrapper{display:flex;align-items:flex-start}.svg-wrapper{margin-left:auto;z-index:999}.hintIcon{position:relative;cursor:pointer}.hintIcon:hover:before{content:attr(data-title);position:absolute;top:calc(100% + 2px);left:50%;transform:translate(-50%);padding:4px 8px;border-radius:4px;background-color:#1d252d;color:#8e9aa0;font-size:14px;white-space:nowrap}.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}.formCheckbox,.formCheckLabel{cursor:pointer}.formCheckbox{width:15px;height:15px}\n"] }]
|
|
83
83
|
}], ctorParameters: function () { return [{ type: i1.FormService }]; }, propDecorators: { grid: [{
|
|
84
84
|
type: Input
|
|
85
85
|
}] } });
|
|
@@ -76,11 +76,11 @@ export class RichTextEditorFieldsComponent {
|
|
|
76
76
|
}
|
|
77
77
|
}
|
|
78
78
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: RichTextEditorFieldsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
79
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: RichTextEditorFieldsComponent, selector: "lib-rich-text-editor-fields", inputs: { grid: "grid" }, ngImport: i0, template: "<div [ngClass]=\"'col-' + count\" class=\"mb-4 px-3\">\n <div class=\"input-wrapper\">\n <label>{{ question.question }}</label> \n <span class=\"text-danger\" *ngIf=\"required\">*</span>\n <div class=\"svg-wrapper mb-2 hintIcon\" [attr.data-title]=\"hint\" *ngIf=\"hint\">\n <svg class=\"hintSvg\" viewBox=\"0 0 30 30\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </div>\n</div>\n <angular-editor\n [(ngModel)]=\"htmlContent\"\n [config]=\"config\"\n (input)=\"validateInput($event)\"\n (blur)=\"validateEditor()\"\n ></angular-editor>\n <div *ngIf=\"validationFailed\" class=\"text-danger\">\n <svg class=\"validationSvg\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n <path 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\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" fill=\"#FF0000\" stroke=\"#FF0000\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M12 12.75L12 7.75\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <circle cx=\"12\" cy=\"16\" r=\"1\" fill=\"white\"/>\n </svg>\n {{validationMessage}}</div>\n</div>\n", styles: ["
|
|
79
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: RichTextEditorFieldsComponent, selector: "lib-rich-text-editor-fields", inputs: { grid: "grid" }, ngImport: i0, template: "<div [ngClass]=\"'col-' + count\" class=\"mb-4 px-3\">\n <div class=\"input-wrapper\">\n <label>{{ question.question }}</label> \n <span class=\"text-danger\" *ngIf=\"required\">*</span>\n <div class=\"svg-wrapper mb-2 hintIcon\" [attr.data-title]=\"hint\" *ngIf=\"hint\">\n <svg class=\"hintSvg\" viewBox=\"0 0 30 30\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </div>\n</div>\n <angular-editor\n [(ngModel)]=\"htmlContent\"\n [config]=\"config\"\n (input)=\"validateInput($event)\"\n (blur)=\"validateEditor()\"\n ></angular-editor>\n <div *ngIf=\"validationFailed\" class=\"text-danger\">\n <svg class=\"validationSvg\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n <path 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\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" fill=\"#FF0000\" stroke=\"#FF0000\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M12 12.75L12 7.75\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <circle cx=\"12\" cy=\"16\" r=\"1\" fill=\"white\"/>\n </svg>\n {{validationMessage}}</div>\n</div>\n", styles: [".input-wrapper{display:flex;align-items:flex-start}.svg-wrapper{margin-left:auto;z-index:999}.hintIcon{position:relative;cursor:pointer}.hintIcon:hover:before{content:attr(data-title);position:absolute;top:calc(100% + 2px);left:50%;transform:translate(-50%);padding:4px 8px;border-radius:4px;background-color:#1d252d;color:#8e9aa0;font-size:14px;white-space:nowrap}.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}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { 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: "component", type: i3.AngularEditorComponent, selector: "angular-editor", inputs: ["id", "config", "placeholder", "tabIndex"], outputs: ["html", "viewMode", "blur", "focus"] }] }); }
|
|
80
80
|
}
|
|
81
81
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: RichTextEditorFieldsComponent, decorators: [{
|
|
82
82
|
type: Component,
|
|
83
|
-
args: [{ selector: 'lib-rich-text-editor-fields', template: "<div [ngClass]=\"'col-' + count\" class=\"mb-4 px-3\">\n <div class=\"input-wrapper\">\n <label>{{ question.question }}</label> \n <span class=\"text-danger\" *ngIf=\"required\">*</span>\n <div class=\"svg-wrapper mb-2 hintIcon\" [attr.data-title]=\"hint\" *ngIf=\"hint\">\n <svg class=\"hintSvg\" viewBox=\"0 0 30 30\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </div>\n</div>\n <angular-editor\n [(ngModel)]=\"htmlContent\"\n [config]=\"config\"\n (input)=\"validateInput($event)\"\n (blur)=\"validateEditor()\"\n ></angular-editor>\n <div *ngIf=\"validationFailed\" class=\"text-danger\">\n <svg class=\"validationSvg\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n <path 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\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" fill=\"#FF0000\" stroke=\"#FF0000\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M12 12.75L12 7.75\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <circle cx=\"12\" cy=\"16\" r=\"1\" fill=\"white\"/>\n </svg>\n {{validationMessage}}</div>\n</div>\n", styles: ["
|
|
83
|
+
args: [{ selector: 'lib-rich-text-editor-fields', template: "<div [ngClass]=\"'col-' + count\" class=\"mb-4 px-3\">\n <div class=\"input-wrapper\">\n <label>{{ question.question }}</label> \n <span class=\"text-danger\" *ngIf=\"required\">*</span>\n <div class=\"svg-wrapper mb-2 hintIcon\" [attr.data-title]=\"hint\" *ngIf=\"hint\">\n <svg class=\"hintSvg\" viewBox=\"0 0 30 30\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </div>\n</div>\n <angular-editor\n [(ngModel)]=\"htmlContent\"\n [config]=\"config\"\n (input)=\"validateInput($event)\"\n (blur)=\"validateEditor()\"\n ></angular-editor>\n <div *ngIf=\"validationFailed\" class=\"text-danger\">\n <svg class=\"validationSvg\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n <path 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\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" fill=\"#FF0000\" stroke=\"#FF0000\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M12 12.75L12 7.75\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <circle cx=\"12\" cy=\"16\" r=\"1\" fill=\"white\"/>\n </svg>\n {{validationMessage}}</div>\n</div>\n", styles: [".input-wrapper{display:flex;align-items:flex-start}.svg-wrapper{margin-left:auto;z-index:999}.hintIcon{position:relative;cursor:pointer}.hintIcon:hover:before{content:attr(data-title);position:absolute;top:calc(100% + 2px);left:50%;transform:translate(-50%);padding:4px 8px;border-radius:4px;background-color:#1d252d;color:#8e9aa0;font-size:14px;white-space:nowrap}.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}\n"] }]
|
|
84
84
|
}], propDecorators: { grid: [{
|
|
85
85
|
type: Input
|
|
86
86
|
}] } });
|
|
@@ -18,11 +18,11 @@ export class SelectionMatrixFieldsComponent {
|
|
|
18
18
|
this.count;
|
|
19
19
|
}
|
|
20
20
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SelectionMatrixFieldsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
21
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SelectionMatrixFieldsComponent, selector: "lib-selection-matrix-fields", inputs: { grid: "grid" }, ngImport: i0, template: "<div [ngClass]=\"'col-' + count\" class=\"mb-4 px-3\">\n <div class=\"input-wrapper\">\n <label>{{question.question}}</label> \n <span class=\"text-danger\" *ngIf=\"required\">*</span>\n <div class=\"svg-wrapper mb-2 hintIcon\" [attr.data-title]=\"hint\" *ngIf=\"hint\">\n <svg class=\"hintSvg\" viewBox=\"0 0 30 30\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </div>\n </div>\n</div>\n", styles: ["
|
|
21
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SelectionMatrixFieldsComponent, selector: "lib-selection-matrix-fields", inputs: { grid: "grid" }, ngImport: i0, template: "<div [ngClass]=\"'col-' + count\" class=\"mb-4 px-3\">\n <div class=\"input-wrapper\">\n <label>{{question.question}}</label> \n <span class=\"text-danger\" *ngIf=\"required\">*</span>\n <div class=\"svg-wrapper mb-2 hintIcon\" [attr.data-title]=\"hint\" *ngIf=\"hint\">\n <svg class=\"hintSvg\" viewBox=\"0 0 30 30\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </div>\n </div>\n</div>\n", styles: [".input-wrapper{display:flex;align-items:flex-start}.svg-wrapper{margin-left:auto;z-index:999}.hintIcon{position:relative;cursor:pointer}.hintIcon:hover:before{content:attr(data-title);position:absolute;top:calc(100% + 2px);left:50%;transform:translate(-50%);padding:4px 8px;border-radius:4px;background-color:#1d252d;color:#8e9aa0;font-size:14px;white-space:nowrap}.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}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
|
|
22
22
|
}
|
|
23
23
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SelectionMatrixFieldsComponent, decorators: [{
|
|
24
24
|
type: Component,
|
|
25
|
-
args: [{ selector: 'lib-selection-matrix-fields', template: "<div [ngClass]=\"'col-' + count\" class=\"mb-4 px-3\">\n <div class=\"input-wrapper\">\n <label>{{question.question}}</label> \n <span class=\"text-danger\" *ngIf=\"required\">*</span>\n <div class=\"svg-wrapper mb-2 hintIcon\" [attr.data-title]=\"hint\" *ngIf=\"hint\">\n <svg class=\"hintSvg\" viewBox=\"0 0 30 30\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </div>\n </div>\n</div>\n", styles: ["
|
|
25
|
+
args: [{ selector: 'lib-selection-matrix-fields', template: "<div [ngClass]=\"'col-' + count\" class=\"mb-4 px-3\">\n <div class=\"input-wrapper\">\n <label>{{question.question}}</label> \n <span class=\"text-danger\" *ngIf=\"required\">*</span>\n <div class=\"svg-wrapper mb-2 hintIcon\" [attr.data-title]=\"hint\" *ngIf=\"hint\">\n <svg class=\"hintSvg\" viewBox=\"0 0 30 30\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </div>\n </div>\n</div>\n", styles: [".input-wrapper{display:flex;align-items:flex-start}.svg-wrapper{margin-left:auto;z-index:999}.hintIcon{position:relative;cursor:pointer}.hintIcon:hover:before{content:attr(data-title);position:absolute;top:calc(100% + 2px);left:50%;transform:translate(-50%);padding:4px 8px;border-radius:4px;background-color:#1d252d;color:#8e9aa0;font-size:14px;white-space:nowrap}.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}\n"] }]
|
|
26
26
|
}], propDecorators: { grid: [{
|
|
27
27
|
type: Input
|
|
28
28
|
}] } });
|
|
@@ -20,11 +20,11 @@ export class SignatureFieldsComponent {
|
|
|
20
20
|
this.minFileSize = this.question.formElement.validation.minFileSize;
|
|
21
21
|
}
|
|
22
22
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SignatureFieldsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
23
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SignatureFieldsComponent, selector: "lib-signature-fields", inputs: { grid: "grid" }, ngImport: i0, template: "<div [ngClass]=\"'col-' + count\" class=\"mb-4 px-3\">\n <div class=\"input-wrapper\">\n <label>{{question.question}}</label> \n <span class=\"text-danger\" *ngIf=\"required\">*</span>\n <div class=\"svg-wrapper mb-2 hintIcon\" [attr.data-title]=\"hint\" *ngIf=\"hint\">\n <svg class=\"hintSvg\" viewBox=\"0 0 30 30\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </div>\n</div>\n</div>\n", styles: ["
|
|
23
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SignatureFieldsComponent, selector: "lib-signature-fields", inputs: { grid: "grid" }, ngImport: i0, template: "<div [ngClass]=\"'col-' + count\" class=\"mb-4 px-3\">\n <div class=\"input-wrapper\">\n <label>{{question.question}}</label> \n <span class=\"text-danger\" *ngIf=\"required\">*</span>\n <div class=\"svg-wrapper mb-2 hintIcon\" [attr.data-title]=\"hint\" *ngIf=\"hint\">\n <svg class=\"hintSvg\" viewBox=\"0 0 30 30\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </div>\n</div>\n</div>\n", styles: [".input-wrapper{display:flex;align-items:flex-start}.svg-wrapper{margin-left:auto;z-index:999}.hintIcon{position:relative;cursor:pointer}.hintIcon:hover:before{content:attr(data-title);position:absolute;top:calc(100% + 2px);left:50%;transform:translate(-50%);padding:4px 8px;border-radius:4px;background-color:#1d252d;color:#8e9aa0;font-size:14px;white-space:nowrap}.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}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
|
|
24
24
|
}
|
|
25
25
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SignatureFieldsComponent, decorators: [{
|
|
26
26
|
type: Component,
|
|
27
|
-
args: [{ selector: 'lib-signature-fields', template: "<div [ngClass]=\"'col-' + count\" class=\"mb-4 px-3\">\n <div class=\"input-wrapper\">\n <label>{{question.question}}</label> \n <span class=\"text-danger\" *ngIf=\"required\">*</span>\n <div class=\"svg-wrapper mb-2 hintIcon\" [attr.data-title]=\"hint\" *ngIf=\"hint\">\n <svg class=\"hintSvg\" viewBox=\"0 0 30 30\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </div>\n</div>\n</div>\n", styles: ["
|
|
27
|
+
args: [{ selector: 'lib-signature-fields', template: "<div [ngClass]=\"'col-' + count\" class=\"mb-4 px-3\">\n <div class=\"input-wrapper\">\n <label>{{question.question}}</label> \n <span class=\"text-danger\" *ngIf=\"required\">*</span>\n <div class=\"svg-wrapper mb-2 hintIcon\" [attr.data-title]=\"hint\" *ngIf=\"hint\">\n <svg class=\"hintSvg\" viewBox=\"0 0 30 30\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </div>\n</div>\n</div>\n", styles: [".input-wrapper{display:flex;align-items:flex-start}.svg-wrapper{margin-left:auto;z-index:999}.hintIcon{position:relative;cursor:pointer}.hintIcon:hover:before{content:attr(data-title);position:absolute;top:calc(100% + 2px);left:50%;transform:translate(-50%);padding:4px 8px;border-radius:4px;background-color:#1d252d;color:#8e9aa0;font-size:14px;white-space:nowrap}.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}\n"] }]
|
|
28
28
|
}], propDecorators: { grid: [{
|
|
29
29
|
type: Input
|
|
30
30
|
}] } });
|
|
@@ -33,11 +33,11 @@ export class SliderFieldsComponent {
|
|
|
33
33
|
}
|
|
34
34
|
}
|
|
35
35
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SliderFieldsComponent, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
36
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SliderFieldsComponent, selector: "lib-slider-fields", inputs: { grid: "grid" }, ngImport: i0, template: "<div [ngClass]=\"'col-' + count\" class=\"mb-4 px-3\">\n <div class=\"input-wrapper\">\n <label>{{ question.question }}</label> \n <span class=\"text-danger\" *ngIf=\"required\">*</span>\n <div class=\"svg-wrapper mb-2 hintIcon\" [attr.data-title]=\"hint\" *ngIf=\"hint\">\n <svg class=\"hintSvg\" viewBox=\"0 0 30 30\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n</div>\n</div>\n <div class=\"sliderRow\">\n <div class=\"sliderLeft\">\n <mat-slider\n [min]=\"minValue\"\n [max]=\"maxValue\"\n [step]=\"stepValue\"\n [ngStyle]=\"{\n '--mdc-slider-active-track-color': changeSliderColor\n ? sliderColor\n : ''\n }\"\n >\n <input matSliderThumb [(ngModel)]=\"selectedValue\" />\n </mat-slider>\n </div>\n <div class=\"sliderRight\">\n <label class=\"selected-count font-weight-bold\">{{ selectedValue }}</label>\n </div>\n </div>\n</div>\n", styles: ["
|
|
36
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SliderFieldsComponent, selector: "lib-slider-fields", inputs: { grid: "grid" }, ngImport: i0, template: "<div [ngClass]=\"'col-' + count\" class=\"mb-4 px-3\">\n <div class=\"input-wrapper\">\n <label>{{ question.question }}</label> \n <span class=\"text-danger\" *ngIf=\"required\">*</span>\n <div class=\"svg-wrapper mb-2 hintIcon\" [attr.data-title]=\"hint\" *ngIf=\"hint\">\n <svg class=\"hintSvg\" viewBox=\"0 0 30 30\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n</div>\n</div>\n <div class=\"sliderRow\">\n <div class=\"sliderLeft\">\n <mat-slider\n [min]=\"minValue\"\n [max]=\"maxValue\"\n [step]=\"stepValue\"\n [ngStyle]=\"{\n '--mdc-slider-active-track-color': changeSliderColor\n ? sliderColor\n : ''\n }\"\n >\n <input matSliderThumb [(ngModel)]=\"selectedValue\" />\n </mat-slider>\n </div>\n <div class=\"sliderRight\">\n <label class=\"selected-count font-weight-bold\">{{ selectedValue }}</label>\n </div>\n </div>\n</div>\n", styles: [".input-wrapper{display:flex;align-items:flex-start}.svg-wrapper{margin-left:auto;z-index:999}.hintIcon{position:relative;cursor:pointer}.hintIcon:hover:before{content:attr(data-title);position:absolute;top:calc(100% + 2px);left:50%;transform:translate(-50%);padding:4px 8px;border-radius:4px;background-color:#1d252d;color:#8e9aa0;font-size:14px;white-space:nowrap}.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}.selected-count{font-size:.8rem;color:#000}mat-slider{width:100%}.mat-mdc-slider.mat-primary{--mdc-slider-handle-color: #fcfcfc;--mdc-slider-handle-width: 15px;--mdc-slider-handle-height: 15px;--mat-mdc-slider-focus-ripple-color: none;--mat-mdc-slider-hover-ripple-color: none;--mdc-slider-focus-handle-color: #fcfcfc;--mdc-slider-inactive-track-color: #9e9d9d}.mat-mdc-slider .mdc-slider__thumb-knob{outline:1px solid #ff0000!important}.mat-slider-thumb{background-color:none!important;border:none!important;box-shadow:none;outline:none}.sliderRow{display:flex;align-items:center;gap:32px;width:100%}.sliderLeft{flex:1}.sliderRight label{margin-bottom:0}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { 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: "component", type: i3.MatSlider, selector: "mat-slider", inputs: ["color", "disableRipple", "disabled", "discrete", "showTickMarks", "min", "max", "step", "displayWith"], exportAs: ["matSlider"] }, { kind: "directive", type: i3.MatSliderThumb, selector: "input[matSliderThumb]", inputs: ["value"], outputs: ["valueChange", "dragStart", "dragEnd"], exportAs: ["matSliderThumb"] }] }); }
|
|
37
37
|
}
|
|
38
38
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SliderFieldsComponent, decorators: [{
|
|
39
39
|
type: Component,
|
|
40
|
-
args: [{ selector: 'lib-slider-fields', template: "<div [ngClass]=\"'col-' + count\" class=\"mb-4 px-3\">\n <div class=\"input-wrapper\">\n <label>{{ question.question }}</label> \n <span class=\"text-danger\" *ngIf=\"required\">*</span>\n <div class=\"svg-wrapper mb-2 hintIcon\" [attr.data-title]=\"hint\" *ngIf=\"hint\">\n <svg class=\"hintSvg\" viewBox=\"0 0 30 30\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n</div>\n</div>\n <div class=\"sliderRow\">\n <div class=\"sliderLeft\">\n <mat-slider\n [min]=\"minValue\"\n [max]=\"maxValue\"\n [step]=\"stepValue\"\n [ngStyle]=\"{\n '--mdc-slider-active-track-color': changeSliderColor\n ? sliderColor\n : ''\n }\"\n >\n <input matSliderThumb [(ngModel)]=\"selectedValue\" />\n </mat-slider>\n </div>\n <div class=\"sliderRight\">\n <label class=\"selected-count font-weight-bold\">{{ selectedValue }}</label>\n </div>\n </div>\n</div>\n", styles: ["
|
|
40
|
+
args: [{ selector: 'lib-slider-fields', template: "<div [ngClass]=\"'col-' + count\" class=\"mb-4 px-3\">\n <div class=\"input-wrapper\">\n <label>{{ question.question }}</label> \n <span class=\"text-danger\" *ngIf=\"required\">*</span>\n <div class=\"svg-wrapper mb-2 hintIcon\" [attr.data-title]=\"hint\" *ngIf=\"hint\">\n <svg class=\"hintSvg\" viewBox=\"0 0 30 30\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n</div>\n</div>\n <div class=\"sliderRow\">\n <div class=\"sliderLeft\">\n <mat-slider\n [min]=\"minValue\"\n [max]=\"maxValue\"\n [step]=\"stepValue\"\n [ngStyle]=\"{\n '--mdc-slider-active-track-color': changeSliderColor\n ? sliderColor\n : ''\n }\"\n >\n <input matSliderThumb [(ngModel)]=\"selectedValue\" />\n </mat-slider>\n </div>\n <div class=\"sliderRight\">\n <label class=\"selected-count font-weight-bold\">{{ selectedValue }}</label>\n </div>\n </div>\n</div>\n", styles: [".input-wrapper{display:flex;align-items:flex-start}.svg-wrapper{margin-left:auto;z-index:999}.hintIcon{position:relative;cursor:pointer}.hintIcon:hover:before{content:attr(data-title);position:absolute;top:calc(100% + 2px);left:50%;transform:translate(-50%);padding:4px 8px;border-radius:4px;background-color:#1d252d;color:#8e9aa0;font-size:14px;white-space:nowrap}.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}.selected-count{font-size:.8rem;color:#000}mat-slider{width:100%}.mat-mdc-slider.mat-primary{--mdc-slider-handle-color: #fcfcfc;--mdc-slider-handle-width: 15px;--mdc-slider-handle-height: 15px;--mat-mdc-slider-focus-ripple-color: none;--mat-mdc-slider-hover-ripple-color: none;--mdc-slider-focus-handle-color: #fcfcfc;--mdc-slider-inactive-track-color: #9e9d9d}.mat-mdc-slider .mdc-slider__thumb-knob{outline:1px solid #ff0000!important}.mat-slider-thumb{background-color:none!important;border:none!important;box-shadow:none;outline:none}.sliderRow{display:flex;align-items:center;gap:32px;width:100%}.sliderLeft{flex:1}.sliderRight label{margin-bottom:0}\n"] }]
|
|
41
41
|
}], ctorParameters: function () { return [{ type: i0.Renderer2 }, { type: i0.ElementRef }]; }, propDecorators: { grid: [{
|
|
42
42
|
type: Input
|
|
43
43
|
}] } });
|
package/esm2022/form-fields/terms-and-condition-fields/terms-and-condition-fields.component.mjs
CHANGED
|
@@ -18,11 +18,11 @@ export class TermsAndConditionFieldsComponent {
|
|
|
18
18
|
this.count;
|
|
19
19
|
}
|
|
20
20
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TermsAndConditionFieldsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
21
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TermsAndConditionFieldsComponent, selector: "lib-terms-and-condition-fields", inputs: { grid: "grid" }, ngImport: i0, template: "<div [ngClass]=\"'col-' + count\" class=\"mb-4 px-3\">\n <div class=\"input-wrapper\">\n <label>{{ question.question }}</label> \n <span class=\"text-danger\" *ngIf=\"required\">*</span>\n <div class=\"svg-wrapper mb-2 hintIcon\" [attr.data-title]=\"hint\" *ngIf=\"hint\">\n <svg class=\"hintSvg\" viewBox=\"0 0 30 30\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </div>\n</div>\n </div>\n \n", styles: ["
|
|
21
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TermsAndConditionFieldsComponent, selector: "lib-terms-and-condition-fields", inputs: { grid: "grid" }, ngImport: i0, template: "<div [ngClass]=\"'col-' + count\" class=\"mb-4 px-3\">\n <div class=\"input-wrapper\">\n <label>{{ question.question }}</label> \n <span class=\"text-danger\" *ngIf=\"required\">*</span>\n <div class=\"svg-wrapper mb-2 hintIcon\" [attr.data-title]=\"hint\" *ngIf=\"hint\">\n <svg class=\"hintSvg\" viewBox=\"0 0 30 30\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </div>\n</div>\n </div>\n \n", styles: [".input-wrapper{display:flex;align-items:flex-start}.svg-wrapper{margin-left:auto;z-index:999}.hintIcon{position:relative;cursor:pointer}.hintIcon:hover:before{content:attr(data-title);position:absolute;top:calc(100% + 2px);left:50%;transform:translate(-50%);padding:4px 8px;border-radius:4px;background-color:#1d252d;color:#8e9aa0;font-size:14px;white-space:nowrap}.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}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
|
|
22
22
|
}
|
|
23
23
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TermsAndConditionFieldsComponent, decorators: [{
|
|
24
24
|
type: Component,
|
|
25
|
-
args: [{ selector: 'lib-terms-and-condition-fields', template: "<div [ngClass]=\"'col-' + count\" class=\"mb-4 px-3\">\n <div class=\"input-wrapper\">\n <label>{{ question.question }}</label> \n <span class=\"text-danger\" *ngIf=\"required\">*</span>\n <div class=\"svg-wrapper mb-2 hintIcon\" [attr.data-title]=\"hint\" *ngIf=\"hint\">\n <svg class=\"hintSvg\" viewBox=\"0 0 30 30\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </div>\n</div>\n </div>\n \n", styles: ["
|
|
25
|
+
args: [{ selector: 'lib-terms-and-condition-fields', template: "<div [ngClass]=\"'col-' + count\" class=\"mb-4 px-3\">\n <div class=\"input-wrapper\">\n <label>{{ question.question }}</label> \n <span class=\"text-danger\" *ngIf=\"required\">*</span>\n <div class=\"svg-wrapper mb-2 hintIcon\" [attr.data-title]=\"hint\" *ngIf=\"hint\">\n <svg class=\"hintSvg\" viewBox=\"0 0 30 30\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </div>\n</div>\n </div>\n \n", styles: [".input-wrapper{display:flex;align-items:flex-start}.svg-wrapper{margin-left:auto;z-index:999}.hintIcon{position:relative;cursor:pointer}.hintIcon:hover:before{content:attr(data-title);position:absolute;top:calc(100% + 2px);left:50%;transform:translate(-50%);padding:4px 8px;border-radius:4px;background-color:#1d252d;color:#8e9aa0;font-size:14px;white-space:nowrap}.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}\n"] }]
|
|
26
26
|
}], propDecorators: { grid: [{
|
|
27
27
|
type: Input
|
|
28
28
|
}] } });
|
|
@@ -45,11 +45,11 @@ export class TextAreaFieldsComponent {
|
|
|
45
45
|
}
|
|
46
46
|
}
|
|
47
47
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TextAreaFieldsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
48
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TextAreaFieldsComponent, selector: "lib-text-area-fields", inputs: { grid: "grid" }, ngImport: i0, template: "<div [ngClass]=\"'col-' + count\" class=\"mb-4 px-3\">\n <div class=\"input-wrapper\">\n <label>{{ question.question }}</label> \n <span class=\"text-danger\" *ngIf=\"required\">*</span>\n <div class=\"svg-wrapper mb-2 hintIcon\" [attr.data-title]=\"hint\" *ngIf=\"hint\">\n <svg class=\"hintSvg\" viewBox=\"0 0 30 30\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n</div>\n</div>\n <textarea class=\"form-control mb-2\" [rows]=\"numberOfRows\"\n (input)=\"validateInput($event)\"\n (blur)=\"validateTextarea()\"\n [(ngModel)]=\"enteredText\"\n [class.invalid]=\"validationFailed\"\n [maxlength]=\"characterCount\"\n ></textarea>\n <div *ngIf=\"validationFailed\" class=\"text-danger\">\n <svg class=\"validationSvg\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n <path 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\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" fill=\"#FF0000\" stroke=\"#FF0000\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M12 12.75L12 7.75\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <circle cx=\"12\" cy=\"16\" r=\"1\" fill=\"white\"/>\n </svg>\n {{validationMessage}}</div>\n</div>\n", styles: ["
|
|
48
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TextAreaFieldsComponent, selector: "lib-text-area-fields", inputs: { grid: "grid" }, ngImport: i0, template: "<div [ngClass]=\"'col-' + count\" class=\"mb-4 px-3\">\n <div class=\"input-wrapper\">\n <label>{{ question.question }}</label> \n <span class=\"text-danger\" *ngIf=\"required\">*</span>\n <div class=\"svg-wrapper mb-2 hintIcon\" [attr.data-title]=\"hint\" *ngIf=\"hint\">\n <svg class=\"hintSvg\" viewBox=\"0 0 30 30\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n</div>\n</div>\n <textarea class=\"form-control mb-2\" [rows]=\"numberOfRows\"\n (input)=\"validateInput($event)\"\n (blur)=\"validateTextarea()\"\n [(ngModel)]=\"enteredText\"\n [class.invalid]=\"validationFailed\"\n [maxlength]=\"characterCount\"\n ></textarea>\n <div *ngIf=\"validationFailed\" class=\"text-danger\">\n <svg class=\"validationSvg\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n <path 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\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" fill=\"#FF0000\" stroke=\"#FF0000\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M12 12.75L12 7.75\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <circle cx=\"12\" cy=\"16\" r=\"1\" fill=\"white\"/>\n </svg>\n {{validationMessage}}</div>\n</div>\n", styles: [".input-wrapper{display:flex;align-items:flex-start}.svg-wrapper{margin-left:auto;z-index:999}.hintIcon{position:relative;cursor:pointer}.hintIcon:hover:before{content:attr(data-title);position:absolute;top:calc(100% + 2px);left:50%;transform:translate(-50%);padding:4px 8px;border-radius:4px;background-color:#1d252d;color:#8e9aa0;font-size:14px;white-space:nowrap}.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}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] }); }
|
|
49
49
|
}
|
|
50
50
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TextAreaFieldsComponent, decorators: [{
|
|
51
51
|
type: Component,
|
|
52
|
-
args: [{ selector: 'lib-text-area-fields', template: "<div [ngClass]=\"'col-' + count\" class=\"mb-4 px-3\">\n <div class=\"input-wrapper\">\n <label>{{ question.question }}</label> \n <span class=\"text-danger\" *ngIf=\"required\">*</span>\n <div class=\"svg-wrapper mb-2 hintIcon\" [attr.data-title]=\"hint\" *ngIf=\"hint\">\n <svg class=\"hintSvg\" viewBox=\"0 0 30 30\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n</div>\n</div>\n <textarea class=\"form-control mb-2\" [rows]=\"numberOfRows\"\n (input)=\"validateInput($event)\"\n (blur)=\"validateTextarea()\"\n [(ngModel)]=\"enteredText\"\n [class.invalid]=\"validationFailed\"\n [maxlength]=\"characterCount\"\n ></textarea>\n <div *ngIf=\"validationFailed\" class=\"text-danger\">\n <svg class=\"validationSvg\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n <path 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\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" fill=\"#FF0000\" stroke=\"#FF0000\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M12 12.75L12 7.75\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <circle cx=\"12\" cy=\"16\" r=\"1\" fill=\"white\"/>\n </svg>\n {{validationMessage}}</div>\n</div>\n", styles: ["
|
|
52
|
+
args: [{ selector: 'lib-text-area-fields', template: "<div [ngClass]=\"'col-' + count\" class=\"mb-4 px-3\">\n <div class=\"input-wrapper\">\n <label>{{ question.question }}</label> \n <span class=\"text-danger\" *ngIf=\"required\">*</span>\n <div class=\"svg-wrapper mb-2 hintIcon\" [attr.data-title]=\"hint\" *ngIf=\"hint\">\n <svg class=\"hintSvg\" viewBox=\"0 0 30 30\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n</div>\n</div>\n <textarea class=\"form-control mb-2\" [rows]=\"numberOfRows\"\n (input)=\"validateInput($event)\"\n (blur)=\"validateTextarea()\"\n [(ngModel)]=\"enteredText\"\n [class.invalid]=\"validationFailed\"\n [maxlength]=\"characterCount\"\n ></textarea>\n <div *ngIf=\"validationFailed\" class=\"text-danger\">\n <svg class=\"validationSvg\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n <path 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\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" fill=\"#FF0000\" stroke=\"#FF0000\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M12 12.75L12 7.75\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <circle cx=\"12\" cy=\"16\" r=\"1\" fill=\"white\"/>\n </svg>\n {{validationMessage}}</div>\n</div>\n", styles: [".input-wrapper{display:flex;align-items:flex-start}.svg-wrapper{margin-left:auto;z-index:999}.hintIcon{position:relative;cursor:pointer}.hintIcon:hover:before{content:attr(data-title);position:absolute;top:calc(100% + 2px);left:50%;transform:translate(-50%);padding:4px 8px;border-radius:4px;background-color:#1d252d;color:#8e9aa0;font-size:14px;white-space:nowrap}.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}\n"] }]
|
|
53
53
|
}], propDecorators: { grid: [{
|
|
54
54
|
type: Input
|
|
55
55
|
}] } });
|
|
@@ -71,11 +71,11 @@ export class TextFieldsComponent {
|
|
|
71
71
|
}
|
|
72
72
|
}
|
|
73
73
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TextFieldsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
74
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TextFieldsComponent, selector: "lib-text-fields", inputs: { grid: "grid" }, ngImport: i0, template: "<div [ngClass]=\"'col-' + count\" class=\"mb-4 px-3\">\n <div class=\"input-wrapper\">\n <label>{{ question.question }}</label> \n <span class=\"text-danger\" *ngIf=\"required\">*</span>\n <div class=\"svg-wrapper mb-2 hintIcon\" [attr.data-title]=\"hint\" *ngIf=\"hint\">\n <svg class=\"hintSvg\" viewBox=\"0 0 30 30\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </div>\n </div>\n \n <input\n type=\"text\"\n class=\"form-control mb-2 height\"\n [placeholder]=\"placeholder\"\n [value]=\"defaultValue\"\n [ngClass]=\"{\n 'bold': isBold,\n 'underline': isUnderline,\n 'italics': isItalics\n }\"\n [style.text-align]=\"textAlign\"\n [style.font-family]=\"font\"\n [style.font-size]=\"fontSize+'px'\"\n [(ngModel)]=\"enteredText\"\n (blur)=\"validatetextField()\"\n (input)=\"validateInput($event)\"\n [class.invalid]=\"validationFailed\"\n />\n <div *ngIf=\"validationFailed\" class=\"text-danger\">\n <svg class=\"validationSvg\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n <path 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\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" fill=\"#FF0000\" stroke=\"#FF0000\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M12 12.75L12 7.75\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <circle cx=\"12\" cy=\"16\" r=\"1\" fill=\"white\"/>\n </svg>\n {{validationMessage}}</div>\n</div>\n", styles: ["
|
|
74
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TextFieldsComponent, selector: "lib-text-fields", inputs: { grid: "grid" }, ngImport: i0, template: "<div [ngClass]=\"'col-' + count\" class=\"mb-4 px-3\">\n <div class=\"input-wrapper\">\n <label>{{ question.question }}</label> \n <span class=\"text-danger\" *ngIf=\"required\">*</span>\n <div class=\"svg-wrapper mb-2 hintIcon\" [attr.data-title]=\"hint\" *ngIf=\"hint\">\n <svg class=\"hintSvg\" viewBox=\"0 0 30 30\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </div>\n </div>\n \n <input\n type=\"text\"\n class=\"form-control mb-2 height\"\n [placeholder]=\"placeholder\"\n [value]=\"defaultValue\"\n [ngClass]=\"{\n 'bold': isBold,\n 'underline': isUnderline,\n 'italics': isItalics\n }\"\n [style.text-align]=\"textAlign\"\n [style.font-family]=\"font\"\n [style.font-size]=\"fontSize+'px'\"\n [(ngModel)]=\"enteredText\"\n (blur)=\"validatetextField()\"\n (input)=\"validateInput($event)\"\n [class.invalid]=\"validationFailed\"\n />\n <div *ngIf=\"validationFailed\" class=\"text-danger\">\n <svg class=\"validationSvg\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n <path 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\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" fill=\"#FF0000\" stroke=\"#FF0000\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M12 12.75L12 7.75\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <circle cx=\"12\" cy=\"16\" r=\"1\" fill=\"white\"/>\n </svg>\n {{validationMessage}}</div>\n</div>\n", styles: [".input-wrapper{display:flex;align-items:flex-start}.svg-wrapper{margin-left:auto;z-index:999}.hintIcon{position:relative;cursor:pointer}.hintIcon:hover:before{content:attr(data-title);position:absolute;top:calc(100% + 2px);left:50%;transform:translate(-50%);padding:4px 8px;border-radius:4px;background-color:#1d252d;color:#8e9aa0;font-size:14px;white-space:nowrap}.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}.form-control:not(:placeholder-shown).bold{font-weight:700}.form-control:not(:placeholder-shown).underline{text-decoration:underline}.form-control:not(:placeholder-shown).italics{font-style:italic}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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"] }] }); }
|
|
75
75
|
}
|
|
76
76
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TextFieldsComponent, decorators: [{
|
|
77
77
|
type: Component,
|
|
78
|
-
args: [{ selector: 'lib-text-fields', template: "<div [ngClass]=\"'col-' + count\" class=\"mb-4 px-3\">\n <div class=\"input-wrapper\">\n <label>{{ question.question }}</label> \n <span class=\"text-danger\" *ngIf=\"required\">*</span>\n <div class=\"svg-wrapper mb-2 hintIcon\" [attr.data-title]=\"hint\" *ngIf=\"hint\">\n <svg class=\"hintSvg\" viewBox=\"0 0 30 30\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </div>\n </div>\n \n <input\n type=\"text\"\n class=\"form-control mb-2 height\"\n [placeholder]=\"placeholder\"\n [value]=\"defaultValue\"\n [ngClass]=\"{\n 'bold': isBold,\n 'underline': isUnderline,\n 'italics': isItalics\n }\"\n [style.text-align]=\"textAlign\"\n [style.font-family]=\"font\"\n [style.font-size]=\"fontSize+'px'\"\n [(ngModel)]=\"enteredText\"\n (blur)=\"validatetextField()\"\n (input)=\"validateInput($event)\"\n [class.invalid]=\"validationFailed\"\n />\n <div *ngIf=\"validationFailed\" class=\"text-danger\">\n <svg class=\"validationSvg\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n <path 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\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" fill=\"#FF0000\" stroke=\"#FF0000\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M12 12.75L12 7.75\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <circle cx=\"12\" cy=\"16\" r=\"1\" fill=\"white\"/>\n </svg>\n {{validationMessage}}</div>\n</div>\n", styles: ["
|
|
78
|
+
args: [{ selector: 'lib-text-fields', template: "<div [ngClass]=\"'col-' + count\" class=\"mb-4 px-3\">\n <div class=\"input-wrapper\">\n <label>{{ question.question }}</label> \n <span class=\"text-danger\" *ngIf=\"required\">*</span>\n <div class=\"svg-wrapper mb-2 hintIcon\" [attr.data-title]=\"hint\" *ngIf=\"hint\">\n <svg class=\"hintSvg\" viewBox=\"0 0 30 30\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </div>\n </div>\n \n <input\n type=\"text\"\n class=\"form-control mb-2 height\"\n [placeholder]=\"placeholder\"\n [value]=\"defaultValue\"\n [ngClass]=\"{\n 'bold': isBold,\n 'underline': isUnderline,\n 'italics': isItalics\n }\"\n [style.text-align]=\"textAlign\"\n [style.font-family]=\"font\"\n [style.font-size]=\"fontSize+'px'\"\n [(ngModel)]=\"enteredText\"\n (blur)=\"validatetextField()\"\n (input)=\"validateInput($event)\"\n [class.invalid]=\"validationFailed\"\n />\n <div *ngIf=\"validationFailed\" class=\"text-danger\">\n <svg class=\"validationSvg\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n <path 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\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" fill=\"#FF0000\" stroke=\"#FF0000\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M12 12.75L12 7.75\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <circle cx=\"12\" cy=\"16\" r=\"1\" fill=\"white\"/>\n </svg>\n {{validationMessage}}</div>\n</div>\n", styles: [".input-wrapper{display:flex;align-items:flex-start}.svg-wrapper{margin-left:auto;z-index:999}.hintIcon{position:relative;cursor:pointer}.hintIcon:hover:before{content:attr(data-title);position:absolute;top:calc(100% + 2px);left:50%;transform:translate(-50%);padding:4px 8px;border-radius:4px;background-color:#1d252d;color:#8e9aa0;font-size:14px;white-space:nowrap}.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}.form-control:not(:placeholder-shown).bold{font-weight:700}.form-control:not(:placeholder-shown).underline{text-decoration:underline}.form-control:not(:placeholder-shown).italics{font-style:italic}\n"] }]
|
|
79
79
|
}], propDecorators: { grid: [{
|
|
80
80
|
type: Input
|
|
81
81
|
}] } });
|
|
@@ -33,11 +33,11 @@ export class ToggleSwitchFieldsComponent {
|
|
|
33
33
|
: this.question.formElement.appearance.labelOnColor;
|
|
34
34
|
}
|
|
35
35
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ToggleSwitchFieldsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
36
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ToggleSwitchFieldsComponent, selector: "lib-toggle-switch-fields", inputs: { grid: "grid" }, ngImport: i0, template: "<div [ngClass]=\"'col-' + count\" class=\"mb-2 px-3\">\n <div class=\"input-wrapper\">\n <label>{{ question.question }}</label> \n <span class=\"text-danger\" *ngIf=\"required\">*</span>\n <div class=\"svg-wrapper mb-2 hintIcon\" [attr.data-title]=\"hint\" *ngIf=\"hint\">\n <svg class=\"hintSvg\" viewBox=\"0 0 30 30\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </div> \n</div>\n <div class=\"mt-2\">\n <label class=\"switch\">\n <input type=\"checkbox\" id=\"togBtn\" (change)=\"toggleSliderColor($event)\" />\n <div\n class=\"slider round\"\n [ngStyle]=\"{ 'background-color': toggleBackgroundColor }\"\n >\n <span class=\"on action-btn-text\">{{ labelOffValue }}</span>\n <span class=\"off action-btn-text\">{{ labelOnValue }}</span>\n </div>\n </label>\n </div>\n</div>\n", styles: ["
|
|
36
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ToggleSwitchFieldsComponent, selector: "lib-toggle-switch-fields", inputs: { grid: "grid" }, ngImport: i0, template: "<div [ngClass]=\"'col-' + count\" class=\"mb-2 px-3\">\n <div class=\"input-wrapper\">\n <label>{{ question.question }}</label> \n <span class=\"text-danger\" *ngIf=\"required\">*</span>\n <div class=\"svg-wrapper mb-2 hintIcon\" [attr.data-title]=\"hint\" *ngIf=\"hint\">\n <svg class=\"hintSvg\" viewBox=\"0 0 30 30\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </div> \n</div>\n <div class=\"mt-2\">\n <label class=\"switch\">\n <input type=\"checkbox\" id=\"togBtn\" (change)=\"toggleSliderColor($event)\" />\n <div\n class=\"slider round\"\n [ngStyle]=\"{ 'background-color': toggleBackgroundColor }\"\n >\n <span class=\"on action-btn-text\">{{ labelOffValue }}</span>\n <span class=\"off action-btn-text\">{{ labelOnValue }}</span>\n </div>\n </label>\n </div>\n</div>\n", styles: [".input-wrapper{display:flex;align-items:flex-start}.svg-wrapper{margin-left:auto;z-index:999}.hintIcon{position:relative;cursor:pointer}.hintIcon:hover:before{content:attr(data-title);position:absolute;top:calc(100% + 2px);left:50%;transform:translate(-50%);padding:4px 8px;border-radius:4px;background-color:#1d252d;color:#8e9aa0;font-size:14px;white-space:nowrap}.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}.switch{position:relative;display:inline-block;width:auto;height:34px;min-width:120px}.switch input{display:none}.slider{position:absolute;cursor:pointer;inset:0;transition:.4s}.slider:before{position:absolute;content:\"\";height:26px;width:26px;left:4px;right:59px;bottom:4px;background-color:#fff;transition:.4s}input:checked+.slider{background-color:#00c48c}input:not(:checked)+.slider{background-color:#00c48c}input:focus+.slider{box-shadow:0 0 1px #2196f3}input:checked+.slider:before{transform:translate(86px)}.on{display:none}.on,.off{color:#fff;position:absolute;transform:translate(-50%,-50%);top:50%;left:50%;font-size:13px;font-weight:500}input:checked+.slider .on{display:block}input:checked+.slider .off{display:none}.slider.round{border-radius:28px}.slider.round:before{border-radius:50%}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] }); }
|
|
37
37
|
}
|
|
38
38
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ToggleSwitchFieldsComponent, decorators: [{
|
|
39
39
|
type: Component,
|
|
40
|
-
args: [{ selector: 'lib-toggle-switch-fields', template: "<div [ngClass]=\"'col-' + count\" class=\"mb-2 px-3\">\n <div class=\"input-wrapper\">\n <label>{{ question.question }}</label> \n <span class=\"text-danger\" *ngIf=\"required\">*</span>\n <div class=\"svg-wrapper mb-2 hintIcon\" [attr.data-title]=\"hint\" *ngIf=\"hint\">\n <svg class=\"hintSvg\" viewBox=\"0 0 30 30\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </div> \n</div>\n <div class=\"mt-2\">\n <label class=\"switch\">\n <input type=\"checkbox\" id=\"togBtn\" (change)=\"toggleSliderColor($event)\" />\n <div\n class=\"slider round\"\n [ngStyle]=\"{ 'background-color': toggleBackgroundColor }\"\n >\n <span class=\"on action-btn-text\">{{ labelOffValue }}</span>\n <span class=\"off action-btn-text\">{{ labelOnValue }}</span>\n </div>\n </label>\n </div>\n</div>\n", styles: ["
|
|
40
|
+
args: [{ selector: 'lib-toggle-switch-fields', template: "<div [ngClass]=\"'col-' + count\" class=\"mb-2 px-3\">\n <div class=\"input-wrapper\">\n <label>{{ question.question }}</label> \n <span class=\"text-danger\" *ngIf=\"required\">*</span>\n <div class=\"svg-wrapper mb-2 hintIcon\" [attr.data-title]=\"hint\" *ngIf=\"hint\">\n <svg class=\"hintSvg\" viewBox=\"0 0 30 30\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path 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\" stroke=\"#323232\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </div> \n</div>\n <div class=\"mt-2\">\n <label class=\"switch\">\n <input type=\"checkbox\" id=\"togBtn\" (change)=\"toggleSliderColor($event)\" />\n <div\n class=\"slider round\"\n [ngStyle]=\"{ 'background-color': toggleBackgroundColor }\"\n >\n <span class=\"on action-btn-text\">{{ labelOffValue }}</span>\n <span class=\"off action-btn-text\">{{ labelOnValue }}</span>\n </div>\n </label>\n </div>\n</div>\n", styles: [".input-wrapper{display:flex;align-items:flex-start}.svg-wrapper{margin-left:auto;z-index:999}.hintIcon{position:relative;cursor:pointer}.hintIcon:hover:before{content:attr(data-title);position:absolute;top:calc(100% + 2px);left:50%;transform:translate(-50%);padding:4px 8px;border-radius:4px;background-color:#1d252d;color:#8e9aa0;font-size:14px;white-space:nowrap}.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}.switch{position:relative;display:inline-block;width:auto;height:34px;min-width:120px}.switch input{display:none}.slider{position:absolute;cursor:pointer;inset:0;transition:.4s}.slider:before{position:absolute;content:\"\";height:26px;width:26px;left:4px;right:59px;bottom:4px;background-color:#fff;transition:.4s}input:checked+.slider{background-color:#00c48c}input:not(:checked)+.slider{background-color:#00c48c}input:focus+.slider{box-shadow:0 0 1px #2196f3}input:checked+.slider:before{transform:translate(86px)}.on{display:none}.on,.off{color:#fff;position:absolute;transform:translate(-50%,-50%);top:50%;left:50%;font-size:13px;font-weight:500}input:checked+.slider .on{display:block}input:checked+.slider .off{display:none}.slider.round{border-radius:28px}.slider.round:before{border-radius:50%}\n"] }]
|
|
41
41
|
}], propDecorators: { grid: [{
|
|
42
42
|
type: Input
|
|
43
43
|
}] } });
|