vcomply-workflow-engine 3.3.0 → 3.3.2
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/esm2020/lib/sharedComponents/assessment-editor/components/preview/preview-matrix-dropdown/preview-matrix-dropdown.component.mjs +10 -7
- package/esm2020/lib/sharedComponents/assessment-editor/components/preview/preview-wrapper/preview-wrapper.component.mjs +1 -1
- package/esm2020/lib/sharedComponents/assessment-editor/components/preview/preview.module.mjs +7 -3
- package/esm2020/lib/sharedComponents/assessment-preview/assessment-preview.module.mjs +13 -10
- package/esm2020/lib/sharedComponents/assessment-preview/checkbox-question/checkbox-question.component.mjs +2 -2
- package/esm2020/lib/sharedComponents/assessment-preview/date-time/date-time.component.mjs +2 -2
- package/esm2020/lib/sharedComponents/assessment-preview/file-upload/file-upload.component.mjs +2 -2
- package/esm2020/lib/sharedComponents/assessment-preview/preview/preview.component.mjs +14 -12
- package/esm2020/lib/sharedComponents/assessment-preview/quick-settings/quick-settings.component.mjs +7 -5
- package/esm2020/lib/sharedComponents/assessment-preview/radio-question/radio-question.component.mjs +2 -2
- package/esm2020/lib/sharedComponents/assessment-preview/select-question/select-question.component.mjs +2 -2
- package/esm2020/lib/sharedComponents/assessment-preview/single-textbox/single-textbox.component.mjs +2 -2
- package/esm2020/lib/sharedComponents/v-loader/loader/loader.component.mjs +1 -1
- package/esm2020/lib/sharedComponents/v-loader/loader-inline/loader-inline.component.mjs +1 -1
- package/fesm2015/vcomply-workflow-engine.mjs +211 -205
- package/fesm2015/vcomply-workflow-engine.mjs.map +1 -1
- package/fesm2020/vcomply-workflow-engine.mjs +211 -205
- package/fesm2020/vcomply-workflow-engine.mjs.map +1 -1
- package/lib/sharedComponents/assessment-editor/components/preview/preview-matrix-dropdown/preview-matrix-dropdown.component.d.ts +5 -2
- package/lib/sharedComponents/assessment-editor/components/preview/preview.module.d.ts +2 -1
- package/lib/sharedComponents/assessment-preview/assessment-preview.module.d.ts +14 -13
- package/lib/sharedComponents/assessment-preview/quick-settings/quick-settings.component.d.ts +1 -1
- package/lib/sharedComponents/v-loader/loader/loader.component.d.ts +1 -1
- package/lib/sharedComponents/v-loader/loader-inline/loader-inline.component.d.ts +1 -1
- package/package.json +1 -1
|
@@ -13911,21 +13911,36 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
13911
13911
|
args: [{ selector: 'app-preview-comment-box', template: "<div class=\"preview-list\">\r\n <textarea class=\"comment-box vx-m-0\" placeholder=\"placeholder\"></textarea>\r\n</div>", styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";::ng-deep .preview-list .comment-box{border:1px solid #DBDBDB;border-radius:.25rem;color:#747576;font-size:13px;width:37.5rem;height:8rem;padding:.5rem .75rem;outline:none;resize:none;transition:all .2s ease-in-out}::ng-deep .preview-list .comment-box::-webkit-scrollbar-track{background-color:#fff}::ng-deep .preview-list .comment-box:hover,::ng-deep .preview-list .comment-box:focus{border:1px solid #1e5dd3;box-shadow:0 0 5px #1e5dd345}\n"] }]
|
|
13912
13912
|
}], ctorParameters: function () { return []; } });
|
|
13913
13913
|
|
|
13914
|
-
class
|
|
13914
|
+
class QuickSettingsComponent$1 {
|
|
13915
13915
|
constructor() { }
|
|
13916
|
+
ngOnInit() { }
|
|
13917
|
+
}
|
|
13918
|
+
QuickSettingsComponent$1.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: QuickSettingsComponent$1, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
13919
|
+
QuickSettingsComponent$1.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: QuickSettingsComponent$1, isStandalone: true, selector: "app-quick-settings", inputs: { question: "question" }, ngImport: i0, template: "<div class=\"quick-settings\">\r\n <ul class=\"more-options vx-p-0 vx-m-0\">\r\n <li class=\"vx-pt-1 vx-pb-1\" *ngIf='question.hasComments'>\r\n <button class=\"options vx-fs-14 vx-d-flex vx-align-center vx-justify-center vx-bg-grey vx-label-txt vx-p-2\" [class.close]=\"info?.showPopover\" appPopover (click)=\"info?.popover()\" placement=\"right\">\r\n <span class=\"status vx-bg-blue\"></span>\r\n <i class=\"icons\" *ngIf=\"!info?.showPopover\"></i>\r\n <i class=\"icons\" *ngIf=\"info?.showPopover\"></i>\r\n </button>\r\n\r\n <app-popover #info [dontCloseonClick]=\"false\">\r\n <div class=\"block info vx-bg-white vx-p-3\">\r\n <div class=\"block-text vx-fs-13 vx-paragraph-txt\" [innerHTML]='question.comments'></div>\r\n </div>\r\n </app-popover>\r\n </li>\r\n\r\n <li class=\"vx-pt-1 vx-pb-1\" *ngIf='question.isRespondentAttachment'>\r\n <button class=\"options vx-fs-16 vx-d-flex vx-align-center vx-justify-center vx-bg-grey vx-label-txt vx-p-2\" [class.close]=\"attachment?.showPopover\" appPopover (click)=\"attachment.popover()\" placement=\"right\">\r\n <span class=\"status vx-bg-blue\"></span>\r\n <i class=\"icons\" *ngIf=\"!attachment?.showPopover\"></i>\r\n <i class=\"icons\" *ngIf=\"attachment?.showPopover\"></i>\r\n </button>\r\n\r\n <app-popover #attachment [dontCloseonClick]=\"true\">\r\n <div class=\"block attachment vx-bg-white\">\r\n <div *ngIf=\"false\" class=\"attached vx-pt-1 vx-pl-3 vx-pr-3\">\r\n <div class=\"file-box vx-d-flex vx-align-center vx-pb-2 vx-pt-2\" *ngFor=\"let data of [1, 1]\">\r\n <span class=\"file table pdf\">\r\n <i class=\"icons\"></i>\r\n <span class=\"format\">pdf</span>\r\n </span>\r\n <div class=\"file-name vx-fs-12 vx-label-txt\" [appTooltip]=\"'payrollnew-vcomply-interns.pdf'\" placement=\"bottom-left\" delay=\"0\" type=\"black\" [tooltipMandatory]=\"false\">payrollnew-vcomply-interns.pdf</div>\r\n <button class=\"delete-btn vx-fs-14 vx-txt-red vx-p-0 vx-m-0 vx-ml-2 vx-d-flex vx-align-center vx-justify-center\"><i class=\"icons\"></i></button>\r\n <div class=\"line-progress\">\r\n <div class=\"line-progress-bar\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"attach-btn vx-d-flex vx-align-center vx-justify-center vx-p-2\">\r\n <input type=\"file\">\r\n <i class=\"icons vx-fs-18 vx-pt-2 vx-mb-1\"></i>\r\n <span class=\"vx-txt-blue vx-fs-12 vx-tt-uppercase\">Attach Files</span>\r\n </div>\r\n <div *ngIf=\"false\" class=\"bottom vx-p-2 vx-justify-center vx-d-flex vx-align-center\">\r\n <button class=\"save-btn vx-fs-11 vx-fw-500 vx-txt-white vx-tt-uppercase vx-p-0 vx-m-0 vx-d-flex vx-align-center vx-justify-center\">SAVE</button>\r\n </div>\r\n </div>\r\n </app-popover>\r\n </li>\r\n\r\n <li class=\"vx-pt-1 vx-pb-1\" *ngIf='question.isRespondentComment'>\r\n <button class=\"options vx-fs-14 vx-d-flex vx-align-center vx-justify-center vx-bg-grey vx-label-txt vx-p-2\" [class.close]=\"comment?.showPopover\" appPopover (click)=\"comment.popover()\" placement=\"right\">\r\n <span class=\"status vx-bg-blue\"></span>\r\n <i class=\"icons\" *ngIf=\"!comment?.showPopover\"></i>\r\n <i class=\"icons\" *ngIf=\"comment?.showPopover\"></i>\r\n </button>\r\n \r\n <app-popover #comment [dontCloseonClick]=\"true\">\r\n <div class=\"block comment vx-p-0 vx-bg-white \">\r\n <div class=\"text-area\">\r\n <textarea class=\"vx-fs-13 vx-paragraph-txt vx-lh-5 vx-p-2 vx-m-0\" placeholder=\"Type here...\"></textarea>\r\n </div>\r\n <div *ngIf=\"true\" class=\"bottom vx-p-2 vx-justify-center vx-d-flex vx-align-center\">\r\n <button class=\"save-btn vx-fs-11 vx-fw-500 vx-txt-white vx-tt-uppercase vx-p-0 vx-m-0 vx-d-flex vx-align-center vx-justify-center\">SAVE</button>\r\n </div>\r\n </div>\r\n </app-popover>\r\n </li>\r\n </ul>\r\n</div>\r\n", styles: ["@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";.quick-settings ul.more-options li{position:relative;list-style:none}.quick-settings ul.more-options li button.options{border-radius:50%;border:1px solid #F1F1F1}.quick-settings ul.more-options li button.options span.status{border-radius:50%;height:.5rem;width:.5rem;position:absolute;right:.125rem;top:.5rem}.quick-settings ul.more-options li button.options.close{border:1px solid #4681ef;background:#4681ef;color:#fff}::ng-deep app-popover .block{border-radius:.125rem;box-shadow:0 0 10px #1e5dd31a;max-height:10rem;overflow:auto}::ng-deep app-popover .block::-webkit-scrollbar-track{background-color:#fff}::ng-deep app-popover .block.info{width:17rem}::ng-deep app-popover .block.attachment{min-width:12.25rem;max-width:17rem}::ng-deep app-popover .block.attachment .attached .file-box{border-bottom:1px solid #F1F1F1;position:relative}::ng-deep app-popover .block.attachment .attached .file-box .file-name{min-width:11.375rem;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}::ng-deep app-popover .block.attachment .attached .file-box button.delete-btn{background:transparent;border-radius:0;border:none}::ng-deep app-popover .block.attachment .attached .file-box .line-progress{left:1.625rem;top:auto;bottom:.5rem;width:80%}::ng-deep app-popover .block.attachment .attach-btn{flex-direction:column;position:relative}::ng-deep app-popover .block.attachment .attach-btn input{position:absolute;top:0;right:0;height:100%;width:100%;opacity:0;cursor:pointer}::ng-deep app-popover .block.attachment .attach-btn i{color:#dbdbdb}::ng-deep app-popover .block.comment{width:17rem}::ng-deep app-popover .block.comment textarea{border:none;outline:none;width:100%;resize:none}::ng-deep app-popover .block .bottom{border-top:1px solid #F1F1F1}::ng-deep app-popover .block .bottom button.save-btn{background:#1e5dd3;border-radius:.125rem;border:none;height:1.5rem;width:4rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: ToolTipDirective, selector: "[appTooltip]", inputs: ["appTooltip", "placement", "type", "tooltipMandatory", "showTooltip", "animate"] }, { kind: "ngmodule", type: PopoverModule }, { kind: "component", type: PopoverComponent, selector: "app-popover", inputs: ["dontCloseonClick"] }, { kind: "directive", type: PopoverDirective, selector: "[appPopover]", inputs: ["refrence", "placement"] }] });
|
|
13920
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: QuickSettingsComponent$1, decorators: [{
|
|
13921
|
+
type: Component,
|
|
13922
|
+
args: [{ selector: 'app-quick-settings', imports: [CommonModule, TooltipModule, PopoverModule], standalone: true, template: "<div class=\"quick-settings\">\r\n <ul class=\"more-options vx-p-0 vx-m-0\">\r\n <li class=\"vx-pt-1 vx-pb-1\" *ngIf='question.hasComments'>\r\n <button class=\"options vx-fs-14 vx-d-flex vx-align-center vx-justify-center vx-bg-grey vx-label-txt vx-p-2\" [class.close]=\"info?.showPopover\" appPopover (click)=\"info?.popover()\" placement=\"right\">\r\n <span class=\"status vx-bg-blue\"></span>\r\n <i class=\"icons\" *ngIf=\"!info?.showPopover\"></i>\r\n <i class=\"icons\" *ngIf=\"info?.showPopover\"></i>\r\n </button>\r\n\r\n <app-popover #info [dontCloseonClick]=\"false\">\r\n <div class=\"block info vx-bg-white vx-p-3\">\r\n <div class=\"block-text vx-fs-13 vx-paragraph-txt\" [innerHTML]='question.comments'></div>\r\n </div>\r\n </app-popover>\r\n </li>\r\n\r\n <li class=\"vx-pt-1 vx-pb-1\" *ngIf='question.isRespondentAttachment'>\r\n <button class=\"options vx-fs-16 vx-d-flex vx-align-center vx-justify-center vx-bg-grey vx-label-txt vx-p-2\" [class.close]=\"attachment?.showPopover\" appPopover (click)=\"attachment.popover()\" placement=\"right\">\r\n <span class=\"status vx-bg-blue\"></span>\r\n <i class=\"icons\" *ngIf=\"!attachment?.showPopover\"></i>\r\n <i class=\"icons\" *ngIf=\"attachment?.showPopover\"></i>\r\n </button>\r\n\r\n <app-popover #attachment [dontCloseonClick]=\"true\">\r\n <div class=\"block attachment vx-bg-white\">\r\n <div *ngIf=\"false\" class=\"attached vx-pt-1 vx-pl-3 vx-pr-3\">\r\n <div class=\"file-box vx-d-flex vx-align-center vx-pb-2 vx-pt-2\" *ngFor=\"let data of [1, 1]\">\r\n <span class=\"file table pdf\">\r\n <i class=\"icons\"></i>\r\n <span class=\"format\">pdf</span>\r\n </span>\r\n <div class=\"file-name vx-fs-12 vx-label-txt\" [appTooltip]=\"'payrollnew-vcomply-interns.pdf'\" placement=\"bottom-left\" delay=\"0\" type=\"black\" [tooltipMandatory]=\"false\">payrollnew-vcomply-interns.pdf</div>\r\n <button class=\"delete-btn vx-fs-14 vx-txt-red vx-p-0 vx-m-0 vx-ml-2 vx-d-flex vx-align-center vx-justify-center\"><i class=\"icons\"></i></button>\r\n <div class=\"line-progress\">\r\n <div class=\"line-progress-bar\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"attach-btn vx-d-flex vx-align-center vx-justify-center vx-p-2\">\r\n <input type=\"file\">\r\n <i class=\"icons vx-fs-18 vx-pt-2 vx-mb-1\"></i>\r\n <span class=\"vx-txt-blue vx-fs-12 vx-tt-uppercase\">Attach Files</span>\r\n </div>\r\n <div *ngIf=\"false\" class=\"bottom vx-p-2 vx-justify-center vx-d-flex vx-align-center\">\r\n <button class=\"save-btn vx-fs-11 vx-fw-500 vx-txt-white vx-tt-uppercase vx-p-0 vx-m-0 vx-d-flex vx-align-center vx-justify-center\">SAVE</button>\r\n </div>\r\n </div>\r\n </app-popover>\r\n </li>\r\n\r\n <li class=\"vx-pt-1 vx-pb-1\" *ngIf='question.isRespondentComment'>\r\n <button class=\"options vx-fs-14 vx-d-flex vx-align-center vx-justify-center vx-bg-grey vx-label-txt vx-p-2\" [class.close]=\"comment?.showPopover\" appPopover (click)=\"comment.popover()\" placement=\"right\">\r\n <span class=\"status vx-bg-blue\"></span>\r\n <i class=\"icons\" *ngIf=\"!comment?.showPopover\"></i>\r\n <i class=\"icons\" *ngIf=\"comment?.showPopover\"></i>\r\n </button>\r\n \r\n <app-popover #comment [dontCloseonClick]=\"true\">\r\n <div class=\"block comment vx-p-0 vx-bg-white \">\r\n <div class=\"text-area\">\r\n <textarea class=\"vx-fs-13 vx-paragraph-txt vx-lh-5 vx-p-2 vx-m-0\" placeholder=\"Type here...\"></textarea>\r\n </div>\r\n <div *ngIf=\"true\" class=\"bottom vx-p-2 vx-justify-center vx-d-flex vx-align-center\">\r\n <button class=\"save-btn vx-fs-11 vx-fw-500 vx-txt-white vx-tt-uppercase vx-p-0 vx-m-0 vx-d-flex vx-align-center vx-justify-center\">SAVE</button>\r\n </div>\r\n </div>\r\n </app-popover>\r\n </li>\r\n </ul>\r\n</div>\r\n", styles: ["@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";.quick-settings ul.more-options li{position:relative;list-style:none}.quick-settings ul.more-options li button.options{border-radius:50%;border:1px solid #F1F1F1}.quick-settings ul.more-options li button.options span.status{border-radius:50%;height:.5rem;width:.5rem;position:absolute;right:.125rem;top:.5rem}.quick-settings ul.more-options li button.options.close{border:1px solid #4681ef;background:#4681ef;color:#fff}::ng-deep app-popover .block{border-radius:.125rem;box-shadow:0 0 10px #1e5dd31a;max-height:10rem;overflow:auto}::ng-deep app-popover .block::-webkit-scrollbar-track{background-color:#fff}::ng-deep app-popover .block.info{width:17rem}::ng-deep app-popover .block.attachment{min-width:12.25rem;max-width:17rem}::ng-deep app-popover .block.attachment .attached .file-box{border-bottom:1px solid #F1F1F1;position:relative}::ng-deep app-popover .block.attachment .attached .file-box .file-name{min-width:11.375rem;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}::ng-deep app-popover .block.attachment .attached .file-box button.delete-btn{background:transparent;border-radius:0;border:none}::ng-deep app-popover .block.attachment .attached .file-box .line-progress{left:1.625rem;top:auto;bottom:.5rem;width:80%}::ng-deep app-popover .block.attachment .attach-btn{flex-direction:column;position:relative}::ng-deep app-popover .block.attachment .attach-btn input{position:absolute;top:0;right:0;height:100%;width:100%;opacity:0;cursor:pointer}::ng-deep app-popover .block.attachment .attach-btn i{color:#dbdbdb}::ng-deep app-popover .block.comment{width:17rem}::ng-deep app-popover .block.comment textarea{border:none;outline:none;width:100%;resize:none}::ng-deep app-popover .block .bottom{border-top:1px solid #F1F1F1}::ng-deep app-popover .block .bottom button.save-btn{background:#1e5dd3;border-radius:.125rem;border:none;height:1.5rem;width:4rem}\n"] }]
|
|
13923
|
+
}], ctorParameters: function () { return []; }, propDecorators: { question: [{
|
|
13924
|
+
type: Input
|
|
13925
|
+
}] } });
|
|
13926
|
+
|
|
13927
|
+
class PreviewMatrixDropdownComponent {
|
|
13928
|
+
constructor() {
|
|
13929
|
+
this.questionIndex = 1;
|
|
13930
|
+
this.isQuickSettings = true;
|
|
13931
|
+
}
|
|
13932
|
+
ngOnInit() { }
|
|
13916
13933
|
scrollHandler(event) {
|
|
13917
13934
|
this.panel['_results'].forEach((panel) => {
|
|
13918
13935
|
panel['nativeElement'].scrollLeft = event.target.scrollLeft;
|
|
13919
13936
|
});
|
|
13920
13937
|
}
|
|
13921
|
-
ngOnInit() {
|
|
13922
|
-
}
|
|
13923
13938
|
}
|
|
13924
13939
|
PreviewMatrixDropdownComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PreviewMatrixDropdownComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
13925
|
-
PreviewMatrixDropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PreviewMatrixDropdownComponent, selector: "app-preview-matrix-dropdown", host: { listeners: { "scroll": "scrollHandler($event)" } }, viewQueries: [{ propertyName: "panel", predicate: ["scrollMatrixDropdown"], descendants: true, read: ElementRef }], ngImport: i0, template: "<div class=\"preview-list\">\r\n
|
|
13940
|
+
PreviewMatrixDropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PreviewMatrixDropdownComponent, selector: "app-preview-matrix-dropdown", inputs: { question: "question", questionIndex: "questionIndex" }, host: { listeners: { "scroll": "scrollHandler($event)" } }, viewQueries: [{ propertyName: "panel", predicate: ["scrollMatrixDropdown"], descendants: true, read: ElementRef }], ngImport: i0, template: "<div class=\"head vx-d-flex vx-mb-4\">\r\n <span class=\"count vx-paragraph-txt vx-fs-20 vx-fw-400\"\r\n >{{ questionIndex }}.</span\r\n >\r\n <span class=\"heading vx-pl-3\">\r\n <span\r\n class=\"vx-fw-300 vx-label-txt vx-fs-20 vx-lh-8\"\r\n [innerHTML]=\"question?.title\"\r\n ></span>\r\n <span\r\n *ngIf=\"question?.isRequired\"\r\n class=\"required vx-fw-400 vx-txt-red vx-fs-24 vx-ml-2\"\r\n >*</span\r\n >\r\n </span>\r\n</div>\r\n<div class=\"preview-list\">\r\n <div class=\"matrix-dropdown-table\">\r\n <div class=\"matrix-table-row table-head vx-d-flex\">\r\n <div class=\"left\">\r\n <div class=\"body\">\r\n <div class=\"title vx-fs-12 vx-label-txt vx-p-2\"></div>\r\n </div>\r\n </div>\r\n <div class=\"right\" (scroll)=\"scrollHandler($event)\" #scrollMatrixDropdown>\r\n <div class=\"body\">\r\n <ul class=\"columns vx-p-0 vx-m-0 vx-d-flex\">\r\n <li\r\n class=\"vx-d-flex vx-align-center vx-justify-center vx-p-2\"\r\n *ngFor=\"let columns of question?.columns\"\r\n >\r\n <div\r\n class=\"matrix-value vx-fs-12 vx-fw-500 vx-label-txt vx-tt-uppercase vx-d-flex vx-align-center\"\r\n >\r\n <div\r\n class=\"heading\"\r\n [appTooltip]=\"columns?.title\"\r\n placement=\"bottom-left\"\r\n delay=\"0\"\r\n type=\"black\"\r\n [tooltipMandatory]=\"false\"\r\n >\r\n {{ columns?.title ?? \"--\" }}.\r\n </div>\r\n </div>\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n </div>\r\n <div\r\n class=\"matrix-table-row vx-d-flex\"\r\n *ngFor=\"let eachRow of question?.choices; let rowIndex = index\"\r\n >\r\n <div class=\"left\">\r\n <div class=\"body\">\r\n <div\r\n class=\"title vx-fs-12 vx-label-txt vx-lh-7 vx-p-2\"\r\n [appTooltip]=\"eachRow?.title\"\r\n placement=\"bottom-left\"\r\n delay=\"0\"\r\n type=\"black\"\r\n [tooltipMandatory]=\"false\"\r\n >\r\n {{ eachRow?.title }}\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"right\" (scroll)=\"scrollHandler($event)\" #scrollMatrixDropdown>\r\n <div class=\"body\">\r\n <ul class=\"columns vx-p-0 vx-m-0 vx-d-flex\">\r\n <li\r\n class=\"vx-d-flex vx-align-center vx-justify-center vx-p-2\"\r\n *ngFor=\"\r\n let eachColumns of question?.columns;\r\n let columnIndex = index\r\n \"\r\n >\r\n <div\r\n class=\"matrix-value vx-d-flex vx-align-center vx-justify-center\"\r\n >\r\n <app-cs-select\r\n [dataList]=\"eachColumns?.choices\"\r\n [valueKey]=\"'title'\"\r\n [displayProperty]=\"'title'\"\r\n [selectedValue]=\"'--'\"\r\n ></app-cs-select>\r\n </div>\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"question-quick-settings\">\r\n <app-quick-settings [question]=\"question\"></app-quick-settings>\r\n </div>\r\n</div>\r\n", styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";::ng-deep .preview-list{display:flex;position:relative;margin-bottom:3rem}::ng-deep .preview-list .matrix-dropdown-table{border:1px solid #dbdbdb;border-bottom:none;max-width:100%}::ng-deep .preview-list .matrix-dropdown-table .matrix-table-row{border-bottom:1px solid #dbdbdb}::ng-deep .preview-list .matrix-dropdown-table .matrix-table-row:last-child .right::-webkit-scrollbar{display:block}::ng-deep .preview-list .matrix-dropdown-table .matrix-table-row.table-head{background:#f8f8f8}::ng-deep .preview-list .matrix-dropdown-table .matrix-table-row .left{width:18rem}::ng-deep .preview-list .matrix-dropdown-table .matrix-table-row .left .body{height:100%}::ng-deep .preview-list .matrix-dropdown-table .matrix-table-row .left .body .title{border-right:1px solid #dbdbdb;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;height:100%;font-weight:500}::ng-deep .preview-list .matrix-dropdown-table .matrix-table-row .right{width:calc(100% - 18rem);overflow-x:auto;position:static!important;height:auto!important;background:transparent!important}::ng-deep .preview-list .matrix-dropdown-table .matrix-table-row .right::-webkit-scrollbar{display:none;height:6px}::ng-deep .preview-list .matrix-dropdown-table .matrix-table-row .right .body ul.columns li{border-right:1px solid #dbdbdb}::ng-deep .preview-list .matrix-dropdown-table .matrix-table-row .right .body ul.columns li:last-of-type{border-right:none}::ng-deep .preview-list .matrix-dropdown-table .matrix-table-row .right .body ul.columns li .matrix-value{width:7rem}::ng-deep .preview-list .matrix-dropdown-table .matrix-table-row .right .body ul.columns li .matrix-value .heading{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}::ng-deep .preview-list .matrix-dropdown-table .matrix-table-row .right .body ul.columns li .matrix-value .devider{color:#dbdbdb}::ng-deep .preview-list .matrix-dropdown-table .matrix-table-row .right .body ul.columns li .matrix-value app-cs-select .input-group .custom-select-box{z-index:unset}::ng-deep .preview-list .matrix-dropdown-table .matrix-table-row .right .body ul.columns li .matrix-value app-cs-select .input-group .custom-select-box input[type=text]{height:28px;padding:4px 20px 4px 8px}::ng-deep .preview-list .matrix-dropdown-table .matrix-table-row .right .body ul.columns li .matrix-value app-cs-select .input-group .custom-select-box:after{right:8px;top:calc(50% - 5px);z-index:0}::ng-deep .preview-list .question-quick-settings{position:absolute;top:-.25rem;right:-3.75rem}\n"], dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: ToolTipDirective, selector: "[appTooltip]", inputs: ["appTooltip", "placement", "type", "tooltipMandatory", "showTooltip", "animate"] }, { kind: "component", type: CsSelectComponent$1, selector: "app-cs-select", inputs: ["dataList", "dropdownLabel", "displayProperty", "selectedValue", "isRequired", "dropdownSubLabel", "disabled", "placeholder", "stylex", "valueKey", "multipleSelect", "colorProperty", "colorSelected"], outputs: ["selectedData", "selectedValueChange"] }, { kind: "component", type: QuickSettingsComponent$1, selector: "app-quick-settings", inputs: ["question"] }] });
|
|
13926
13941
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PreviewMatrixDropdownComponent, decorators: [{
|
|
13927
13942
|
type: Component,
|
|
13928
|
-
args: [{ selector: 'app-preview-matrix-dropdown', template: "<div class=\"preview-list\">\r\n
|
|
13943
|
+
args: [{ selector: 'app-preview-matrix-dropdown', inputs: ['question', 'questionIndex'], template: "<div class=\"head vx-d-flex vx-mb-4\">\r\n <span class=\"count vx-paragraph-txt vx-fs-20 vx-fw-400\"\r\n >{{ questionIndex }}.</span\r\n >\r\n <span class=\"heading vx-pl-3\">\r\n <span\r\n class=\"vx-fw-300 vx-label-txt vx-fs-20 vx-lh-8\"\r\n [innerHTML]=\"question?.title\"\r\n ></span>\r\n <span\r\n *ngIf=\"question?.isRequired\"\r\n class=\"required vx-fw-400 vx-txt-red vx-fs-24 vx-ml-2\"\r\n >*</span\r\n >\r\n </span>\r\n</div>\r\n<div class=\"preview-list\">\r\n <div class=\"matrix-dropdown-table\">\r\n <div class=\"matrix-table-row table-head vx-d-flex\">\r\n <div class=\"left\">\r\n <div class=\"body\">\r\n <div class=\"title vx-fs-12 vx-label-txt vx-p-2\"></div>\r\n </div>\r\n </div>\r\n <div class=\"right\" (scroll)=\"scrollHandler($event)\" #scrollMatrixDropdown>\r\n <div class=\"body\">\r\n <ul class=\"columns vx-p-0 vx-m-0 vx-d-flex\">\r\n <li\r\n class=\"vx-d-flex vx-align-center vx-justify-center vx-p-2\"\r\n *ngFor=\"let columns of question?.columns\"\r\n >\r\n <div\r\n class=\"matrix-value vx-fs-12 vx-fw-500 vx-label-txt vx-tt-uppercase vx-d-flex vx-align-center\"\r\n >\r\n <div\r\n class=\"heading\"\r\n [appTooltip]=\"columns?.title\"\r\n placement=\"bottom-left\"\r\n delay=\"0\"\r\n type=\"black\"\r\n [tooltipMandatory]=\"false\"\r\n >\r\n {{ columns?.title ?? \"--\" }}.\r\n </div>\r\n </div>\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n </div>\r\n <div\r\n class=\"matrix-table-row vx-d-flex\"\r\n *ngFor=\"let eachRow of question?.choices; let rowIndex = index\"\r\n >\r\n <div class=\"left\">\r\n <div class=\"body\">\r\n <div\r\n class=\"title vx-fs-12 vx-label-txt vx-lh-7 vx-p-2\"\r\n [appTooltip]=\"eachRow?.title\"\r\n placement=\"bottom-left\"\r\n delay=\"0\"\r\n type=\"black\"\r\n [tooltipMandatory]=\"false\"\r\n >\r\n {{ eachRow?.title }}\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"right\" (scroll)=\"scrollHandler($event)\" #scrollMatrixDropdown>\r\n <div class=\"body\">\r\n <ul class=\"columns vx-p-0 vx-m-0 vx-d-flex\">\r\n <li\r\n class=\"vx-d-flex vx-align-center vx-justify-center vx-p-2\"\r\n *ngFor=\"\r\n let eachColumns of question?.columns;\r\n let columnIndex = index\r\n \"\r\n >\r\n <div\r\n class=\"matrix-value vx-d-flex vx-align-center vx-justify-center\"\r\n >\r\n <app-cs-select\r\n [dataList]=\"eachColumns?.choices\"\r\n [valueKey]=\"'title'\"\r\n [displayProperty]=\"'title'\"\r\n [selectedValue]=\"'--'\"\r\n ></app-cs-select>\r\n </div>\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"question-quick-settings\">\r\n <app-quick-settings [question]=\"question\"></app-quick-settings>\r\n </div>\r\n</div>\r\n", styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";::ng-deep .preview-list{display:flex;position:relative;margin-bottom:3rem}::ng-deep .preview-list .matrix-dropdown-table{border:1px solid #dbdbdb;border-bottom:none;max-width:100%}::ng-deep .preview-list .matrix-dropdown-table .matrix-table-row{border-bottom:1px solid #dbdbdb}::ng-deep .preview-list .matrix-dropdown-table .matrix-table-row:last-child .right::-webkit-scrollbar{display:block}::ng-deep .preview-list .matrix-dropdown-table .matrix-table-row.table-head{background:#f8f8f8}::ng-deep .preview-list .matrix-dropdown-table .matrix-table-row .left{width:18rem}::ng-deep .preview-list .matrix-dropdown-table .matrix-table-row .left .body{height:100%}::ng-deep .preview-list .matrix-dropdown-table .matrix-table-row .left .body .title{border-right:1px solid #dbdbdb;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;height:100%;font-weight:500}::ng-deep .preview-list .matrix-dropdown-table .matrix-table-row .right{width:calc(100% - 18rem);overflow-x:auto;position:static!important;height:auto!important;background:transparent!important}::ng-deep .preview-list .matrix-dropdown-table .matrix-table-row .right::-webkit-scrollbar{display:none;height:6px}::ng-deep .preview-list .matrix-dropdown-table .matrix-table-row .right .body ul.columns li{border-right:1px solid #dbdbdb}::ng-deep .preview-list .matrix-dropdown-table .matrix-table-row .right .body ul.columns li:last-of-type{border-right:none}::ng-deep .preview-list .matrix-dropdown-table .matrix-table-row .right .body ul.columns li .matrix-value{width:7rem}::ng-deep .preview-list .matrix-dropdown-table .matrix-table-row .right .body ul.columns li .matrix-value .heading{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}::ng-deep .preview-list .matrix-dropdown-table .matrix-table-row .right .body ul.columns li .matrix-value .devider{color:#dbdbdb}::ng-deep .preview-list .matrix-dropdown-table .matrix-table-row .right .body ul.columns li .matrix-value app-cs-select .input-group .custom-select-box{z-index:unset}::ng-deep .preview-list .matrix-dropdown-table .matrix-table-row .right .body ul.columns li .matrix-value app-cs-select .input-group .custom-select-box input[type=text]{height:28px;padding:4px 20px 4px 8px}::ng-deep .preview-list .matrix-dropdown-table .matrix-table-row .right .body ul.columns li .matrix-value app-cs-select .input-group .custom-select-box:after{right:8px;top:calc(50% - 5px);z-index:0}::ng-deep .preview-list .question-quick-settings{position:absolute;top:-.25rem;right:-3.75rem}\n"] }]
|
|
13929
13944
|
}], ctorParameters: function () { return []; }, propDecorators: { panel: [{
|
|
13930
13945
|
type: ViewChildren,
|
|
13931
13946
|
args: ['scrollMatrixDropdown', { read: ElementRef }]
|
|
@@ -14113,7 +14128,7 @@ class PreviewWrapperComponent {
|
|
|
14113
14128
|
}
|
|
14114
14129
|
}
|
|
14115
14130
|
PreviewWrapperComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PreviewWrapperComponent, deps: [{ token: EditorService }, { token: ValidatorService }], target: i0.ɵɵFactoryTarget.Component });
|
|
14116
|
-
PreviewWrapperComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PreviewWrapperComponent, selector: "app-preview-wrapper", inputs: { question: "question", questionIndex: "questionIndex" }, outputs: { makeActiveQuestion: "makeActiveQuestion", validQuestionData: "validQuestionData" }, ngImport: i0, template: "<div class=\"preview-wrapper vx-p-5 vx-mb-4\" [class.error]=\"errorPresent === true\">\r\n <!-- <app-welcome></app-welcome> -->\r\n\r\n <button (click)=\"editQuestion()\" class=\"question-edit vx-fs-11 vx-fw-500 vx-txt-white vx-tt-uppercase vx-p-0 vx-m-0 vx-d-flex vx-align-center vx-justify-center\"><i class=\"icons vx-fs-10 vx-mr-2\"></i> EDIT</button>\r\n <div class=\"question-no vx-fs-11 vx-fw-600 vx-label-txt vx-tt-uppercase vx-pl-2 vx-mb-5 vx-lh-4\">QUESTION {{questionIndex + 1}} \r\n <span class=\"vx-txt-red\" *ngIf=\"question?.isRequired\">*</span></div>\r\n <div class=\"question-name vx-fs-16 vx-paragraph-txt vx-lih-6 vx-mb-5\"><span [innerHTML]=\"question?.title=='' ? 'Question' : question?.title\"></span> \r\n <i *ngIf=\"question?.hasComments\" class=\"icons info vx-txt-blue vx-ml-1\" [appTooltip]=\"question?.comments\" placement=\"bottom\" delay=\"0\" type=\"white\" [tooltipMandatory]=\"true\"></i></div>\r\n <div class=\"question-description vx-fs-14 vx-label-txt vx-pb-3 vx-mb-5\" *ngIf=\"question?.hasDescription && question?.description.trim().length > 0 \" [innerHTML]=\"question?.description\"></div>\r\n\r\n <app-preview-multiple-choice *ngIf=\"question.type === 'multiple-choice'\" [question]=\"question\"></app-preview-multiple-choice>\r\n <app-preview-checkbox *ngIf=\"question.type === 'checkbox'\" [question]=\"question\"></app-preview-checkbox>\r\n <app-preview-image-choice *ngIf=\"question.type === 'image-choice'\"></app-preview-image-choice>\r\n <app-preview-star-rating *ngIf=\"question.type === 'star-rating'\"></app-preview-star-rating>\r\n <app-preview-single-textbox *ngIf=\"question.type === 'single-textbox'\"></app-preview-single-textbox>\r\n <app-preview-comment-box *ngIf=\"question.type === 'comment-box'\"></app-preview-comment-box>\r\n <app-preview-matrix-dropdown *ngIf=\"question.type === 'matrix-dropdown'\" ></app-preview-matrix-dropdown>\r\n <app-preview-dropdown *ngIf=\"question.type === 'dropdown'\" [question]=\"question\"></app-preview-dropdown>\r\n <app-preview-matrix-rating-scale *ngIf=\"question.type === 'rating-scale'\"></app-preview-matrix-rating-scale>\r\n <app-preview-ranking *ngIf=\"question.type === 'ranking'\"> </app-preview-ranking>\r\n <app-preview-slider *ngIf=\"question.type === 'slider'\"></app-preview-slider>\r\n <app-preview-multiple-textbox *ngIf=\"question.type === 'multiple-textbox'\"></app-preview-multiple-textbox>\r\n <app-preview-date-time *ngIf=\"question.type === 'date-time'\" [question]=\"question\"></app-preview-date-time>\r\n <app-preview-file-upload *ngIf=\"question.type === 'file-upload'\"></app-preview-file-upload>\r\n\r\n <!-- <app-thank-you></app-thank-you> -->\r\n</div>", styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";.preview-wrapper{border:1px solid #F1F1F1;border-radius:.25rem;position:relative}.preview-wrapper button.question-edit{background:#1e5dd3;border-radius:.125rem;border:none;height:1.75rem;width:4.5rem;position:absolute;top:1.25rem;right:1.25rem;z-index:1;opacity:0;transition:all .2s ease-in-out}.preview-wrapper:hover button.question-edit{opacity:1}.preview-wrapper .question-no{position:relative}.preview-wrapper .question-no:before{background:#4681ef;position:absolute;left:0;top:0;bottom:0;content:\"\";width:.125rem}.preview-wrapper .question-name{width:90%}.preview-wrapper .question-name i.info{position:relative;top:1px;cursor:pointer}.error{border-color:#d93b41}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: ToolTipDirective, selector: "[appTooltip]", inputs: ["appTooltip", "placement", "type", "tooltipMandatory", "showTooltip", "animate"] }, { kind: "component", type: PreviewMultipleChoiceComponent, selector: "app-preview-multiple-choice", inputs: ["question"] }, { kind: "component", type: PreviewCheckboxComponent, selector: "app-preview-checkbox", inputs: ["question"] }, { kind: "component", type: PreviewImageChoiceComponent, selector: "app-preview-image-choice" }, { kind: "component", type: PreviewStarRatingComponent, selector: "app-preview-star-rating" }, { kind: "component", type: PreviewSingleTextboxComponent, selector: "app-preview-single-textbox", inputs: ["question"] }, { kind: "component", type: PreviewCommentBoxComponent, selector: "app-preview-comment-box" }, { kind: "component", type: PreviewMatrixDropdownComponent, selector: "app-preview-matrix-dropdown" }, { kind: "component", type: PreviewDropdownComponent, selector: "app-preview-dropdown", inputs: ["question"] }, { kind: "component", type: PreviewMatrixRatingScaleComponent, selector: "app-preview-matrix-rating-scale" }, { kind: "component", type: PreviewRankingComponent, selector: "app-preview-ranking" }, { kind: "component", type: PreviewSliderComponent, selector: "app-preview-slider" }, { kind: "component", type: PreviewMultipleTextboxComponent, selector: "app-preview-multiple-textbox" }, { kind: "component", type: PreviewDateTimeComponent, selector: "app-preview-date-time", inputs: ["question"] }, { kind: "component", type: PreviewFileUploadComponent, selector: "app-preview-file-upload", inputs: ["question"] }] });
|
|
14131
|
+
PreviewWrapperComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PreviewWrapperComponent, selector: "app-preview-wrapper", inputs: { question: "question", questionIndex: "questionIndex" }, outputs: { makeActiveQuestion: "makeActiveQuestion", validQuestionData: "validQuestionData" }, ngImport: i0, template: "<div class=\"preview-wrapper vx-p-5 vx-mb-4\" [class.error]=\"errorPresent === true\">\r\n <!-- <app-welcome></app-welcome> -->\r\n\r\n <button (click)=\"editQuestion()\" class=\"question-edit vx-fs-11 vx-fw-500 vx-txt-white vx-tt-uppercase vx-p-0 vx-m-0 vx-d-flex vx-align-center vx-justify-center\"><i class=\"icons vx-fs-10 vx-mr-2\"></i> EDIT</button>\r\n <div class=\"question-no vx-fs-11 vx-fw-600 vx-label-txt vx-tt-uppercase vx-pl-2 vx-mb-5 vx-lh-4\">QUESTION {{questionIndex + 1}} \r\n <span class=\"vx-txt-red\" *ngIf=\"question?.isRequired\">*</span></div>\r\n <div class=\"question-name vx-fs-16 vx-paragraph-txt vx-lih-6 vx-mb-5\"><span [innerHTML]=\"question?.title=='' ? 'Question' : question?.title\"></span> \r\n <i *ngIf=\"question?.hasComments\" class=\"icons info vx-txt-blue vx-ml-1\" [appTooltip]=\"question?.comments\" placement=\"bottom\" delay=\"0\" type=\"white\" [tooltipMandatory]=\"true\"></i></div>\r\n <div class=\"question-description vx-fs-14 vx-label-txt vx-pb-3 vx-mb-5\" *ngIf=\"question?.hasDescription && question?.description.trim().length > 0 \" [innerHTML]=\"question?.description\"></div>\r\n\r\n <app-preview-multiple-choice *ngIf=\"question.type === 'multiple-choice'\" [question]=\"question\"></app-preview-multiple-choice>\r\n <app-preview-checkbox *ngIf=\"question.type === 'checkbox'\" [question]=\"question\"></app-preview-checkbox>\r\n <app-preview-image-choice *ngIf=\"question.type === 'image-choice'\"></app-preview-image-choice>\r\n <app-preview-star-rating *ngIf=\"question.type === 'star-rating'\"></app-preview-star-rating>\r\n <app-preview-single-textbox *ngIf=\"question.type === 'single-textbox'\"></app-preview-single-textbox>\r\n <app-preview-comment-box *ngIf=\"question.type === 'comment-box'\"></app-preview-comment-box>\r\n <app-preview-matrix-dropdown *ngIf=\"question.type === 'matrix-dropdown'\" ></app-preview-matrix-dropdown>\r\n <app-preview-dropdown *ngIf=\"question.type === 'dropdown'\" [question]=\"question\"></app-preview-dropdown>\r\n <app-preview-matrix-rating-scale *ngIf=\"question.type === 'rating-scale'\"></app-preview-matrix-rating-scale>\r\n <app-preview-ranking *ngIf=\"question.type === 'ranking'\"> </app-preview-ranking>\r\n <app-preview-slider *ngIf=\"question.type === 'slider'\"></app-preview-slider>\r\n <app-preview-multiple-textbox *ngIf=\"question.type === 'multiple-textbox'\"></app-preview-multiple-textbox>\r\n <app-preview-date-time *ngIf=\"question.type === 'date-time'\" [question]=\"question\"></app-preview-date-time>\r\n <app-preview-file-upload *ngIf=\"question.type === 'file-upload'\"></app-preview-file-upload>\r\n\r\n <!-- <app-thank-you></app-thank-you> -->\r\n</div>", styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";.preview-wrapper{border:1px solid #F1F1F1;border-radius:.25rem;position:relative}.preview-wrapper button.question-edit{background:#1e5dd3;border-radius:.125rem;border:none;height:1.75rem;width:4.5rem;position:absolute;top:1.25rem;right:1.25rem;z-index:1;opacity:0;transition:all .2s ease-in-out}.preview-wrapper:hover button.question-edit{opacity:1}.preview-wrapper .question-no{position:relative}.preview-wrapper .question-no:before{background:#4681ef;position:absolute;left:0;top:0;bottom:0;content:\"\";width:.125rem}.preview-wrapper .question-name{width:90%}.preview-wrapper .question-name i.info{position:relative;top:1px;cursor:pointer}.error{border-color:#d93b41}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: ToolTipDirective, selector: "[appTooltip]", inputs: ["appTooltip", "placement", "type", "tooltipMandatory", "showTooltip", "animate"] }, { kind: "component", type: PreviewMultipleChoiceComponent, selector: "app-preview-multiple-choice", inputs: ["question"] }, { kind: "component", type: PreviewCheckboxComponent, selector: "app-preview-checkbox", inputs: ["question"] }, { kind: "component", type: PreviewImageChoiceComponent, selector: "app-preview-image-choice" }, { kind: "component", type: PreviewStarRatingComponent, selector: "app-preview-star-rating" }, { kind: "component", type: PreviewSingleTextboxComponent, selector: "app-preview-single-textbox", inputs: ["question"] }, { kind: "component", type: PreviewCommentBoxComponent, selector: "app-preview-comment-box" }, { kind: "component", type: PreviewMatrixDropdownComponent, selector: "app-preview-matrix-dropdown", inputs: ["question", "questionIndex"] }, { kind: "component", type: PreviewDropdownComponent, selector: "app-preview-dropdown", inputs: ["question"] }, { kind: "component", type: PreviewMatrixRatingScaleComponent, selector: "app-preview-matrix-rating-scale" }, { kind: "component", type: PreviewRankingComponent, selector: "app-preview-ranking" }, { kind: "component", type: PreviewSliderComponent, selector: "app-preview-slider" }, { kind: "component", type: PreviewMultipleTextboxComponent, selector: "app-preview-multiple-textbox" }, { kind: "component", type: PreviewDateTimeComponent, selector: "app-preview-date-time", inputs: ["question"] }, { kind: "component", type: PreviewFileUploadComponent, selector: "app-preview-file-upload", inputs: ["question"] }] });
|
|
14117
14132
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PreviewWrapperComponent, decorators: [{
|
|
14118
14133
|
type: Component,
|
|
14119
14134
|
args: [{ selector: 'app-preview-wrapper', template: "<div class=\"preview-wrapper vx-p-5 vx-mb-4\" [class.error]=\"errorPresent === true\">\r\n <!-- <app-welcome></app-welcome> -->\r\n\r\n <button (click)=\"editQuestion()\" class=\"question-edit vx-fs-11 vx-fw-500 vx-txt-white vx-tt-uppercase vx-p-0 vx-m-0 vx-d-flex vx-align-center vx-justify-center\"><i class=\"icons vx-fs-10 vx-mr-2\"></i> EDIT</button>\r\n <div class=\"question-no vx-fs-11 vx-fw-600 vx-label-txt vx-tt-uppercase vx-pl-2 vx-mb-5 vx-lh-4\">QUESTION {{questionIndex + 1}} \r\n <span class=\"vx-txt-red\" *ngIf=\"question?.isRequired\">*</span></div>\r\n <div class=\"question-name vx-fs-16 vx-paragraph-txt vx-lih-6 vx-mb-5\"><span [innerHTML]=\"question?.title=='' ? 'Question' : question?.title\"></span> \r\n <i *ngIf=\"question?.hasComments\" class=\"icons info vx-txt-blue vx-ml-1\" [appTooltip]=\"question?.comments\" placement=\"bottom\" delay=\"0\" type=\"white\" [tooltipMandatory]=\"true\"></i></div>\r\n <div class=\"question-description vx-fs-14 vx-label-txt vx-pb-3 vx-mb-5\" *ngIf=\"question?.hasDescription && question?.description.trim().length > 0 \" [innerHTML]=\"question?.description\"></div>\r\n\r\n <app-preview-multiple-choice *ngIf=\"question.type === 'multiple-choice'\" [question]=\"question\"></app-preview-multiple-choice>\r\n <app-preview-checkbox *ngIf=\"question.type === 'checkbox'\" [question]=\"question\"></app-preview-checkbox>\r\n <app-preview-image-choice *ngIf=\"question.type === 'image-choice'\"></app-preview-image-choice>\r\n <app-preview-star-rating *ngIf=\"question.type === 'star-rating'\"></app-preview-star-rating>\r\n <app-preview-single-textbox *ngIf=\"question.type === 'single-textbox'\"></app-preview-single-textbox>\r\n <app-preview-comment-box *ngIf=\"question.type === 'comment-box'\"></app-preview-comment-box>\r\n <app-preview-matrix-dropdown *ngIf=\"question.type === 'matrix-dropdown'\" ></app-preview-matrix-dropdown>\r\n <app-preview-dropdown *ngIf=\"question.type === 'dropdown'\" [question]=\"question\"></app-preview-dropdown>\r\n <app-preview-matrix-rating-scale *ngIf=\"question.type === 'rating-scale'\"></app-preview-matrix-rating-scale>\r\n <app-preview-ranking *ngIf=\"question.type === 'ranking'\"> </app-preview-ranking>\r\n <app-preview-slider *ngIf=\"question.type === 'slider'\"></app-preview-slider>\r\n <app-preview-multiple-textbox *ngIf=\"question.type === 'multiple-textbox'\"></app-preview-multiple-textbox>\r\n <app-preview-date-time *ngIf=\"question.type === 'date-time'\" [question]=\"question\"></app-preview-date-time>\r\n <app-preview-file-upload *ngIf=\"question.type === 'file-upload'\"></app-preview-file-upload>\r\n\r\n <!-- <app-thank-you></app-thank-you> -->\r\n</div>", styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";.preview-wrapper{border:1px solid #F1F1F1;border-radius:.25rem;position:relative}.preview-wrapper button.question-edit{background:#1e5dd3;border-radius:.125rem;border:none;height:1.75rem;width:4.5rem;position:absolute;top:1.25rem;right:1.25rem;z-index:1;opacity:0;transition:all .2s ease-in-out}.preview-wrapper:hover button.question-edit{opacity:1}.preview-wrapper .question-no{position:relative}.preview-wrapper .question-no:before{background:#4681ef;position:absolute;left:0;top:0;bottom:0;content:\"\";width:.125rem}.preview-wrapper .question-name{width:90%}.preview-wrapper .question-name i.info{position:relative;top:1px;cursor:pointer}.error{border-color:#d93b41}\n"] }]
|
|
@@ -14470,7 +14485,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
14470
14485
|
type: Output
|
|
14471
14486
|
}] } });
|
|
14472
14487
|
|
|
14473
|
-
class QuickSettingsComponent
|
|
14488
|
+
class QuickSettingsComponent {
|
|
14474
14489
|
constructor(fd) {
|
|
14475
14490
|
this.fd = fd;
|
|
14476
14491
|
this.typeChanged = new EventEmitter();
|
|
@@ -14700,9 +14715,9 @@ class QuickSettingsComponent$1 {
|
|
|
14700
14715
|
this.fd.formsPage.elements[this.questionIndex][quickSetting.toggleValue] = e;
|
|
14701
14716
|
}
|
|
14702
14717
|
}
|
|
14703
|
-
QuickSettingsComponent
|
|
14704
|
-
QuickSettingsComponent$1.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: QuickSettingsComponent$1, selector: "app-quick-setting", inputs: { questionIndex: "questionIndex", question: "question" }, outputs: { typeChanged: "typeChanged" }, ngImport: i0, template: "<div class=\"quick-settings\">\r\n <div class=\"heading vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-5 vx-pl-2\">QUESTION TYPE</div>\r\n <div class=\"settings-option vx-d-flex vx-align-center vx-justify-between vx-pb-2\" appPopover (click)=\"questionOption.popover()\" placement=\"right\">\r\n <div class=\"content vx-d-flex vx-align-center\">\r\n <div class=\"question-icon vx-d-flex vx-align-center vx-justify-center vx-mr-2\" [ngClass]=\"selectedQuestionDetails.questionClass\">\r\n <i class=\"icons vx-fs-16 vx-txt-white\" [innerHTML]='selectedQuestionDetails.questionIcon'></i></div>\r\n <div class=\"name vx-fs-14 vx-label-txt\">{{selectedQuestionDetails.questionName}}</div>\r\n </div>\r\n <i class=\"icons vx-fs-10 vx-paragraph-txt\"></i>\r\n </div>\r\n <app-popover #questionOption>\r\n <div class=\"select-option vx-p-2 vx-pb-1\">\r\n <ul class=\"vx-p-0 vx-m-0 vx-d-flex vx-flex-wrap\">\r\n <li class=\"vx-d-flex vx-align-center vx-mt-1 vx-mb-1\" *ngFor=\"let menu of questionTypeDropdown\">\r\n <button class=\"vx-m-0 vx-p-0 vx-text-left vx-w-100 vx-d-flex vx-align-center\" (click)='changeQuestionType(menu)'>\r\n <div [ngClass]=\"menu.questionClass\" class=\"question-icon vx-d-flex vx-align-center vx-justify-center vx-mr-1\"><i class=\"icons vx-fs-16 vx-txt-white\" [innerHTML]=\"menu?.questionIcon\"></i></div>\r\n <div class=\"name vx-fs-12 vx-label-txt\">{{menu?.questionName}}</div>\r\n </button>\r\n </li>\r\n </ul>\r\n </div>\r\n </app-popover>\r\n <div class=\"title vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-2\">QUICK SETTINGS</div>\r\n <div class=\"settings-list\">\r\n <ul class=\"vx-p-0 vx-m-0\">\r\n <li class=\"vx-pt-3 vx-pb-3\" *ngFor='let quickSetting of quickSettingsList'>\r\n <app-cs-switch \r\n [ngValue]=\"fd.formsPage.elements[questionIndex][quickSetting.toggleValue]\"\r\n (ngValueChange)=\"toggle($event,quickSetting);\"\r\n [disabled]='quickSetting.title === \"Is required\" && fd.formsPage.elements[questionIndex].visibilityLogic.length > 0'>\r\n <div class=\"vx-d-flex vx-align-center vx-justify-between vx-w-100\">\r\n <div class=\"settings-name vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase\">{{quickSetting.title}}</div>\r\n <i class=\"icons info vx-fs-14 vx-txt-blue\" *ngIf=\"quickSetting.toolTip.length>0\" [appTooltip]=\"quickSetting.toolTip\" placement=\"bottom\" delay=\"0\" type=\"white\" [tooltipMandatory]=\"true\"></i>\r\n </div>\r\n </app-cs-switch>\r\n </li>\r\n \r\n </ul>\r\n </div>\r\n <div class=\"max-min-field vx-d-flex vx-align-center vx-mt-3 vx-mb-2\" *ngIf=\"fd.formsPage.elements[questionIndex].hasCharacterLength\">\r\n <input type=\"number\" [(ngModel)]=\"fd.formsPage.elements[questionIndex].minCharacterLength\"/>\r\n <span class=\"vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mr-5\">Min</span>\r\n <input type=\"number\" [(ngModel)]=\"fd.formsPage.elements[questionIndex].maxCharacterLength\"/>\r\n <span class=\"vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase\">Max</span>\r\n </div>\r\n</div>", styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";::ng-deep .quick-settings .heading{position:relative}::ng-deep .quick-settings .heading:before{background:#1e5dd3;content:\"\";position:absolute;left:0;top:.0625rem;width:.125rem;height:.875rem}::ng-deep .quick-settings .settings-option{border-bottom:1px solid #F1F1F1;cursor:pointer;margin-bottom:1.875rem}::ng-deep .quick-settings .settings-option .content .question-icon{background:#EE5DAF;border-radius:.25rem;width:1.5rem;min-width:1.5rem;height:1.5rem}::ng-deep .quick-settings .settings-option .content .question-icon.welcome-screen{background:#EE5DAF}::ng-deep .quick-settings .settings-option .content .question-icon.thank-you-screen{background:#EE3939}::ng-deep .quick-settings .settings-option .content .question-icon.multiple-choice{background:#D1C131}::ng-deep .quick-settings .settings-option .content .question-icon.checkboxes{background:#6F81FC}::ng-deep .quick-settings .settings-option .content .question-icon.image-choice{background:#4681EF}::ng-deep .quick-settings .settings-option .content .question-icon.star-rating{background:#E8C247}::ng-deep .quick-settings .settings-option .content .question-icon.single-textbox{background:#2FD2CD}::ng-deep .quick-settings .settings-option .content .question-icon.comment-box{background:#ACBB7E}::ng-deep .quick-settings .settings-option .content .question-icon.matrix-dropdown{background:#66BF72}::ng-deep .quick-settings .settings-option .content .question-icon.dropdown-icon{background:#9D9FE1}::ng-deep .quick-settings .settings-option .content .question-icon.matrix-rating{background:#67D2CD}::ng-deep .quick-settings .settings-option .content .question-icon.ranking{background:#EE9F24}::ng-deep .quick-settings .settings-option .content .question-icon.slider{background:#D1C131}::ng-deep .quick-settings .settings-option .content .question-icon.multiple-textbox{background:#66BF72}::ng-deep .quick-settings .settings-option .content .question-icon.date-time{background:#ACBB7E}::ng-deep .quick-settings .settings-option .content .question-icon.file-upload{background:#4681EF}::ng-deep .quick-settings .settings-option .content .name{width:calc(100% - 1.75rem);white-space:nowrap}::ng-deep .quick-settings .settings-list ul{list-style-type:none}::ng-deep .quick-settings .settings-list ul li{border-bottom:1px solid #F1F1F1}::ng-deep .quick-settings .settings-list ul li app-cs-switch .cs-switch{cursor:pointer}::ng-deep .quick-settings .max-min-field input{background:#FFFFFF;border:1px solid #DBDBDB;border-radius:.125rem;color:#161b2f;font-size:13px;width:3.5rem;height:2.5rem;padding:0 .75rem;margin-right:.5rem;outline:none}.select-option{background:#FFFFFF;border-radius:.25rem;box-shadow:0 3px 6px #1c5bd140;width:25.5rem}.select-option ul{list-style-type:none}.select-option ul li{width:50%}.select-option ul li button{background:transparent;border:none;border-radius:0}.select-option ul li button .question-icon{background:#EE5DAF;border-radius:.25rem;width:1.5rem;min-width:1.5rem;height:1.5rem}.select-option ul li button .question-icon.welcome-screen{background:#EE5DAF}.select-option ul li button .question-icon.thank-you-screen{background:#EE3939}.select-option ul li button .question-icon.multiple-choice{background:#D1C131}.select-option ul li button .question-icon.checkboxes{background:#6F81FC}.select-option ul li button .question-icon.image-choice{background:#4681EF}.select-option ul li button .question-icon.star-rating{background:#E8C247}.select-option ul li button .question-icon.single-textbox{background:#2FD2CD}.select-option ul li button .question-icon.comment-box{background:#ACBB7E}.select-option ul li button .question-icon.matrix-dropdown{background:#66BF72}.select-option ul li button .question-icon.dropdown-icon{background:#9D9FE1}.select-option ul li button .question-icon.matrix-rating{background:#67D2CD}.select-option ul li button .question-icon.ranking{background:#EE9F24}.select-option ul li button .question-icon.slider{background:#D1C131}.select-option ul li button .question-icon.multiple-textbox{background:#66BF72}.select-option ul li button .question-icon.date-time{background:#ACBB7E}.select-option ul li button .question-icon.file-upload{background:#4681EF}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: ToolTipDirective, selector: "[appTooltip]", inputs: ["appTooltip", "placement", "type", "tooltipMandatory", "showTooltip", "animate"] }, { kind: "component", type: PopoverComponent, selector: "app-popover", inputs: ["dontCloseonClick"] }, { kind: "directive", type: PopoverDirective, selector: "[appPopover]", inputs: ["refrence", "placement"] }, { kind: "component", type: CsSwitchComponent$1, selector: "app-cs-switch", inputs: ["disabled", "ngValue", "value", "tooltipMessage", "position"], outputs: ["ngValueChange"] }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
|
|
14705
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: QuickSettingsComponent
|
|
14718
|
+
QuickSettingsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: QuickSettingsComponent, deps: [{ token: EditorService }], target: i0.ɵɵFactoryTarget.Component });
|
|
14719
|
+
QuickSettingsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: QuickSettingsComponent, selector: "app-quick-setting", inputs: { questionIndex: "questionIndex", question: "question" }, outputs: { typeChanged: "typeChanged" }, ngImport: i0, template: "<div class=\"quick-settings\">\r\n <div class=\"heading vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-5 vx-pl-2\">QUESTION TYPE</div>\r\n <div class=\"settings-option vx-d-flex vx-align-center vx-justify-between vx-pb-2\" appPopover (click)=\"questionOption.popover()\" placement=\"right\">\r\n <div class=\"content vx-d-flex vx-align-center\">\r\n <div class=\"question-icon vx-d-flex vx-align-center vx-justify-center vx-mr-2\" [ngClass]=\"selectedQuestionDetails.questionClass\">\r\n <i class=\"icons vx-fs-16 vx-txt-white\" [innerHTML]='selectedQuestionDetails.questionIcon'></i></div>\r\n <div class=\"name vx-fs-14 vx-label-txt\">{{selectedQuestionDetails.questionName}}</div>\r\n </div>\r\n <i class=\"icons vx-fs-10 vx-paragraph-txt\"></i>\r\n </div>\r\n <app-popover #questionOption>\r\n <div class=\"select-option vx-p-2 vx-pb-1\">\r\n <ul class=\"vx-p-0 vx-m-0 vx-d-flex vx-flex-wrap\">\r\n <li class=\"vx-d-flex vx-align-center vx-mt-1 vx-mb-1\" *ngFor=\"let menu of questionTypeDropdown\">\r\n <button class=\"vx-m-0 vx-p-0 vx-text-left vx-w-100 vx-d-flex vx-align-center\" (click)='changeQuestionType(menu)'>\r\n <div [ngClass]=\"menu.questionClass\" class=\"question-icon vx-d-flex vx-align-center vx-justify-center vx-mr-1\"><i class=\"icons vx-fs-16 vx-txt-white\" [innerHTML]=\"menu?.questionIcon\"></i></div>\r\n <div class=\"name vx-fs-12 vx-label-txt\">{{menu?.questionName}}</div>\r\n </button>\r\n </li>\r\n </ul>\r\n </div>\r\n </app-popover>\r\n <div class=\"title vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-2\">QUICK SETTINGS</div>\r\n <div class=\"settings-list\">\r\n <ul class=\"vx-p-0 vx-m-0\">\r\n <li class=\"vx-pt-3 vx-pb-3\" *ngFor='let quickSetting of quickSettingsList'>\r\n <app-cs-switch \r\n [ngValue]=\"fd.formsPage.elements[questionIndex][quickSetting.toggleValue]\"\r\n (ngValueChange)=\"toggle($event,quickSetting);\"\r\n [disabled]='quickSetting.title === \"Is required\" && fd.formsPage.elements[questionIndex].visibilityLogic.length > 0'>\r\n <div class=\"vx-d-flex vx-align-center vx-justify-between vx-w-100\">\r\n <div class=\"settings-name vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase\">{{quickSetting.title}}</div>\r\n <i class=\"icons info vx-fs-14 vx-txt-blue\" *ngIf=\"quickSetting.toolTip.length>0\" [appTooltip]=\"quickSetting.toolTip\" placement=\"bottom\" delay=\"0\" type=\"white\" [tooltipMandatory]=\"true\"></i>\r\n </div>\r\n </app-cs-switch>\r\n </li>\r\n \r\n </ul>\r\n </div>\r\n <div class=\"max-min-field vx-d-flex vx-align-center vx-mt-3 vx-mb-2\" *ngIf=\"fd.formsPage.elements[questionIndex].hasCharacterLength\">\r\n <input type=\"number\" [(ngModel)]=\"fd.formsPage.elements[questionIndex].minCharacterLength\"/>\r\n <span class=\"vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mr-5\">Min</span>\r\n <input type=\"number\" [(ngModel)]=\"fd.formsPage.elements[questionIndex].maxCharacterLength\"/>\r\n <span class=\"vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase\">Max</span>\r\n </div>\r\n</div>", styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";::ng-deep .quick-settings .heading{position:relative}::ng-deep .quick-settings .heading:before{background:#1e5dd3;content:\"\";position:absolute;left:0;top:.0625rem;width:.125rem;height:.875rem}::ng-deep .quick-settings .settings-option{border-bottom:1px solid #F1F1F1;cursor:pointer;margin-bottom:1.875rem}::ng-deep .quick-settings .settings-option .content .question-icon{background:#EE5DAF;border-radius:.25rem;width:1.5rem;min-width:1.5rem;height:1.5rem}::ng-deep .quick-settings .settings-option .content .question-icon.welcome-screen{background:#EE5DAF}::ng-deep .quick-settings .settings-option .content .question-icon.thank-you-screen{background:#EE3939}::ng-deep .quick-settings .settings-option .content .question-icon.multiple-choice{background:#D1C131}::ng-deep .quick-settings .settings-option .content .question-icon.checkboxes{background:#6F81FC}::ng-deep .quick-settings .settings-option .content .question-icon.image-choice{background:#4681EF}::ng-deep .quick-settings .settings-option .content .question-icon.star-rating{background:#E8C247}::ng-deep .quick-settings .settings-option .content .question-icon.single-textbox{background:#2FD2CD}::ng-deep .quick-settings .settings-option .content .question-icon.comment-box{background:#ACBB7E}::ng-deep .quick-settings .settings-option .content .question-icon.matrix-dropdown{background:#66BF72}::ng-deep .quick-settings .settings-option .content .question-icon.dropdown-icon{background:#9D9FE1}::ng-deep .quick-settings .settings-option .content .question-icon.matrix-rating{background:#67D2CD}::ng-deep .quick-settings .settings-option .content .question-icon.ranking{background:#EE9F24}::ng-deep .quick-settings .settings-option .content .question-icon.slider{background:#D1C131}::ng-deep .quick-settings .settings-option .content .question-icon.multiple-textbox{background:#66BF72}::ng-deep .quick-settings .settings-option .content .question-icon.date-time{background:#ACBB7E}::ng-deep .quick-settings .settings-option .content .question-icon.file-upload{background:#4681EF}::ng-deep .quick-settings .settings-option .content .name{width:calc(100% - 1.75rem);white-space:nowrap}::ng-deep .quick-settings .settings-list ul{list-style-type:none}::ng-deep .quick-settings .settings-list ul li{border-bottom:1px solid #F1F1F1}::ng-deep .quick-settings .settings-list ul li app-cs-switch .cs-switch{cursor:pointer}::ng-deep .quick-settings .max-min-field input{background:#FFFFFF;border:1px solid #DBDBDB;border-radius:.125rem;color:#161b2f;font-size:13px;width:3.5rem;height:2.5rem;padding:0 .75rem;margin-right:.5rem;outline:none}.select-option{background:#FFFFFF;border-radius:.25rem;box-shadow:0 3px 6px #1c5bd140;width:25.5rem}.select-option ul{list-style-type:none}.select-option ul li{width:50%}.select-option ul li button{background:transparent;border:none;border-radius:0}.select-option ul li button .question-icon{background:#EE5DAF;border-radius:.25rem;width:1.5rem;min-width:1.5rem;height:1.5rem}.select-option ul li button .question-icon.welcome-screen{background:#EE5DAF}.select-option ul li button .question-icon.thank-you-screen{background:#EE3939}.select-option ul li button .question-icon.multiple-choice{background:#D1C131}.select-option ul li button .question-icon.checkboxes{background:#6F81FC}.select-option ul li button .question-icon.image-choice{background:#4681EF}.select-option ul li button .question-icon.star-rating{background:#E8C247}.select-option ul li button .question-icon.single-textbox{background:#2FD2CD}.select-option ul li button .question-icon.comment-box{background:#ACBB7E}.select-option ul li button .question-icon.matrix-dropdown{background:#66BF72}.select-option ul li button .question-icon.dropdown-icon{background:#9D9FE1}.select-option ul li button .question-icon.matrix-rating{background:#67D2CD}.select-option ul li button .question-icon.ranking{background:#EE9F24}.select-option ul li button .question-icon.slider{background:#D1C131}.select-option ul li button .question-icon.multiple-textbox{background:#66BF72}.select-option ul li button .question-icon.date-time{background:#ACBB7E}.select-option ul li button .question-icon.file-upload{background:#4681EF}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: ToolTipDirective, selector: "[appTooltip]", inputs: ["appTooltip", "placement", "type", "tooltipMandatory", "showTooltip", "animate"] }, { kind: "component", type: PopoverComponent, selector: "app-popover", inputs: ["dontCloseonClick"] }, { kind: "directive", type: PopoverDirective, selector: "[appPopover]", inputs: ["refrence", "placement"] }, { kind: "component", type: CsSwitchComponent$1, selector: "app-cs-switch", inputs: ["disabled", "ngValue", "value", "tooltipMessage", "position"], outputs: ["ngValueChange"] }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
|
|
14720
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: QuickSettingsComponent, decorators: [{
|
|
14706
14721
|
type: Component,
|
|
14707
14722
|
args: [{ selector: 'app-quick-setting', template: "<div class=\"quick-settings\">\r\n <div class=\"heading vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-5 vx-pl-2\">QUESTION TYPE</div>\r\n <div class=\"settings-option vx-d-flex vx-align-center vx-justify-between vx-pb-2\" appPopover (click)=\"questionOption.popover()\" placement=\"right\">\r\n <div class=\"content vx-d-flex vx-align-center\">\r\n <div class=\"question-icon vx-d-flex vx-align-center vx-justify-center vx-mr-2\" [ngClass]=\"selectedQuestionDetails.questionClass\">\r\n <i class=\"icons vx-fs-16 vx-txt-white\" [innerHTML]='selectedQuestionDetails.questionIcon'></i></div>\r\n <div class=\"name vx-fs-14 vx-label-txt\">{{selectedQuestionDetails.questionName}}</div>\r\n </div>\r\n <i class=\"icons vx-fs-10 vx-paragraph-txt\"></i>\r\n </div>\r\n <app-popover #questionOption>\r\n <div class=\"select-option vx-p-2 vx-pb-1\">\r\n <ul class=\"vx-p-0 vx-m-0 vx-d-flex vx-flex-wrap\">\r\n <li class=\"vx-d-flex vx-align-center vx-mt-1 vx-mb-1\" *ngFor=\"let menu of questionTypeDropdown\">\r\n <button class=\"vx-m-0 vx-p-0 vx-text-left vx-w-100 vx-d-flex vx-align-center\" (click)='changeQuestionType(menu)'>\r\n <div [ngClass]=\"menu.questionClass\" class=\"question-icon vx-d-flex vx-align-center vx-justify-center vx-mr-1\"><i class=\"icons vx-fs-16 vx-txt-white\" [innerHTML]=\"menu?.questionIcon\"></i></div>\r\n <div class=\"name vx-fs-12 vx-label-txt\">{{menu?.questionName}}</div>\r\n </button>\r\n </li>\r\n </ul>\r\n </div>\r\n </app-popover>\r\n <div class=\"title vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-2\">QUICK SETTINGS</div>\r\n <div class=\"settings-list\">\r\n <ul class=\"vx-p-0 vx-m-0\">\r\n <li class=\"vx-pt-3 vx-pb-3\" *ngFor='let quickSetting of quickSettingsList'>\r\n <app-cs-switch \r\n [ngValue]=\"fd.formsPage.elements[questionIndex][quickSetting.toggleValue]\"\r\n (ngValueChange)=\"toggle($event,quickSetting);\"\r\n [disabled]='quickSetting.title === \"Is required\" && fd.formsPage.elements[questionIndex].visibilityLogic.length > 0'>\r\n <div class=\"vx-d-flex vx-align-center vx-justify-between vx-w-100\">\r\n <div class=\"settings-name vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase\">{{quickSetting.title}}</div>\r\n <i class=\"icons info vx-fs-14 vx-txt-blue\" *ngIf=\"quickSetting.toolTip.length>0\" [appTooltip]=\"quickSetting.toolTip\" placement=\"bottom\" delay=\"0\" type=\"white\" [tooltipMandatory]=\"true\"></i>\r\n </div>\r\n </app-cs-switch>\r\n </li>\r\n \r\n </ul>\r\n </div>\r\n <div class=\"max-min-field vx-d-flex vx-align-center vx-mt-3 vx-mb-2\" *ngIf=\"fd.formsPage.elements[questionIndex].hasCharacterLength\">\r\n <input type=\"number\" [(ngModel)]=\"fd.formsPage.elements[questionIndex].minCharacterLength\"/>\r\n <span class=\"vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mr-5\">Min</span>\r\n <input type=\"number\" [(ngModel)]=\"fd.formsPage.elements[questionIndex].maxCharacterLength\"/>\r\n <span class=\"vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase\">Max</span>\r\n </div>\r\n</div>", styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";::ng-deep .quick-settings .heading{position:relative}::ng-deep .quick-settings .heading:before{background:#1e5dd3;content:\"\";position:absolute;left:0;top:.0625rem;width:.125rem;height:.875rem}::ng-deep .quick-settings .settings-option{border-bottom:1px solid #F1F1F1;cursor:pointer;margin-bottom:1.875rem}::ng-deep .quick-settings .settings-option .content .question-icon{background:#EE5DAF;border-radius:.25rem;width:1.5rem;min-width:1.5rem;height:1.5rem}::ng-deep .quick-settings .settings-option .content .question-icon.welcome-screen{background:#EE5DAF}::ng-deep .quick-settings .settings-option .content .question-icon.thank-you-screen{background:#EE3939}::ng-deep .quick-settings .settings-option .content .question-icon.multiple-choice{background:#D1C131}::ng-deep .quick-settings .settings-option .content .question-icon.checkboxes{background:#6F81FC}::ng-deep .quick-settings .settings-option .content .question-icon.image-choice{background:#4681EF}::ng-deep .quick-settings .settings-option .content .question-icon.star-rating{background:#E8C247}::ng-deep .quick-settings .settings-option .content .question-icon.single-textbox{background:#2FD2CD}::ng-deep .quick-settings .settings-option .content .question-icon.comment-box{background:#ACBB7E}::ng-deep .quick-settings .settings-option .content .question-icon.matrix-dropdown{background:#66BF72}::ng-deep .quick-settings .settings-option .content .question-icon.dropdown-icon{background:#9D9FE1}::ng-deep .quick-settings .settings-option .content .question-icon.matrix-rating{background:#67D2CD}::ng-deep .quick-settings .settings-option .content .question-icon.ranking{background:#EE9F24}::ng-deep .quick-settings .settings-option .content .question-icon.slider{background:#D1C131}::ng-deep .quick-settings .settings-option .content .question-icon.multiple-textbox{background:#66BF72}::ng-deep .quick-settings .settings-option .content .question-icon.date-time{background:#ACBB7E}::ng-deep .quick-settings .settings-option .content .question-icon.file-upload{background:#4681EF}::ng-deep .quick-settings .settings-option .content .name{width:calc(100% - 1.75rem);white-space:nowrap}::ng-deep .quick-settings .settings-list ul{list-style-type:none}::ng-deep .quick-settings .settings-list ul li{border-bottom:1px solid #F1F1F1}::ng-deep .quick-settings .settings-list ul li app-cs-switch .cs-switch{cursor:pointer}::ng-deep .quick-settings .max-min-field input{background:#FFFFFF;border:1px solid #DBDBDB;border-radius:.125rem;color:#161b2f;font-size:13px;width:3.5rem;height:2.5rem;padding:0 .75rem;margin-right:.5rem;outline:none}.select-option{background:#FFFFFF;border-radius:.25rem;box-shadow:0 3px 6px #1c5bd140;width:25.5rem}.select-option ul{list-style-type:none}.select-option ul li{width:50%}.select-option ul li button{background:transparent;border:none;border-radius:0}.select-option ul li button .question-icon{background:#EE5DAF;border-radius:.25rem;width:1.5rem;min-width:1.5rem;height:1.5rem}.select-option ul li button .question-icon.welcome-screen{background:#EE5DAF}.select-option ul li button .question-icon.thank-you-screen{background:#EE3939}.select-option ul li button .question-icon.multiple-choice{background:#D1C131}.select-option ul li button .question-icon.checkboxes{background:#6F81FC}.select-option ul li button .question-icon.image-choice{background:#4681EF}.select-option ul li button .question-icon.star-rating{background:#E8C247}.select-option ul li button .question-icon.single-textbox{background:#2FD2CD}.select-option ul li button .question-icon.comment-box{background:#ACBB7E}.select-option ul li button .question-icon.matrix-dropdown{background:#66BF72}.select-option ul li button .question-icon.dropdown-icon{background:#9D9FE1}.select-option ul li button .question-icon.matrix-rating{background:#67D2CD}.select-option ul li button .question-icon.ranking{background:#EE9F24}.select-option ul li button .question-icon.slider{background:#D1C131}.select-option ul li button .question-icon.multiple-textbox{background:#66BF72}.select-option ul li button .question-icon.date-time{background:#ACBB7E}.select-option ul li button .question-icon.file-upload{background:#4681EF}\n"] }]
|
|
14708
14723
|
}], ctorParameters: function () { return [{ type: EditorService }]; }, propDecorators: { questionIndex: [{
|
|
@@ -15714,7 +15729,7 @@ class EditorWrapperComponent {
|
|
|
15714
15729
|
}
|
|
15715
15730
|
}
|
|
15716
15731
|
EditorWrapperComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: EditorWrapperComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: ValidatorService }], target: i0.ɵɵFactoryTarget.Component });
|
|
15717
|
-
EditorWrapperComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: EditorWrapperComponent, selector: "app-editor-wrapper", inputs: { openPortal: "openPortal", questionIndex: "questionIndex", question: "question", GRS: "GRS", service: "service", editorMode: "editorMode" }, outputs: { validQuestionData: "validQuestionData", deleteQuestion: "deleteQuestion", copyQuestion: "copyQuestion" }, viewQueries: [{ propertyName: "questionContainer", first: true, predicate: ["questionContainer"], descendants: true }], ngImport: i0, template: "<div class=\"editor-wrapper vx-mb-4 \" [class.error]=\"errorPresent\" [class.with-logic]=\"false\" [ngSwitch]=\"viewMode\" #questionContainer >\r\n <!-- <div class=\"label-mode vx-fs-10 vx-fw-500 vx-txt-white vx-tt-uppercase vx-pt-1 vx-pb-1\">ASSESSMENT MODE ENABLED</div> -->\r\n <div class=\"editor-top vx-d-flex vx-align-center vx-justify-center vx-pl-2 vx-pr-2\">\r\n <button class=\"type-btn vx-fs-11 vx-fw-600 vx-paragraph-txt vx-tt-uppercase vx-p-0 vx-d-flex vx-align-center\" [class.active]=\"viewMode == 'build'\" (click)=\"viewMode = 'build'\">BUILD</button>\r\n\r\n\r\n\r\n <div class=\"logic-area\">\r\n <button [class.disabled]=\" (service.formsPage.elements | currentPageQuestion : service.currentPageNumber ) === false\" class=\"type-btn vx-fs-11 vx-fw-600 vx-paragraph-txt vx-tt-uppercase vx-p-0 vx-d-flex vx-align-center\" [class.active]=\"viewMode == 'logic'\" (click)=\"viewMode = 'logic'\" >LOGIC</button>\r\n <i *ngIf=\"(service.formsPage.elements | currentPageQuestion : service.currentPageNumber ) === false\" [appTooltip]=\"(service.formsPage.elements | currentPageQuestion : service.currentPageNumber ) === false ? 'You need to have at least two questions to create a logical workflow.':''\" class=\"icons info vx-fs-12 vx-txt-blue\" placement=\"bottom\" delay=\"0\" type=\"black\" [tooltipMandatory]=\"true\"></i>\r\n </div>\r\n\r\n\r\n\r\n <button [class.disabled]=\"service.formsPage?.elements?.length < 2\" class=\"type-btn vx-fs-11 vx-fw-600 vx-paragraph-txt vx-tt-uppercase vx-p-0 vx-d-flex vx-align-center\" [class.active]=\"viewMode == 'move'\" (click)=\"viewMode = 'move'\">MOVE</button>\r\n <div class=\"rightside-button vx-d-flex vx-align-center\">\r\n <button class=\"duplicate-btn vx-fs-11 vx-fw-500 vx-txt-blue vx-tt-uppercase vx-pl-2 vx-pr-2 vx-m-0 vx-d-flex vx-align-center vx-justify-center vx-lh-7\" (click)=\"copyQuestion.emit(questionIndex)\">DUPLICATE</button>\r\n <button class=\"delete-btn vx-fs-14 vx-txt-red vx-pl-2 vx-pr-2 vx-m-0 vx-ml-1 vx-d-flex vx-align-center vx-justify-center\" (click)=\"deleteQuestion.emit(questionIndex)\"><i class=\"icons\"></i></button>\r\n </div>\r\n </div>\r\n <div class=\"editor-mid vx-pl-5 vx-pr-5\" [ngSwitch]=\"viewMode\">\r\n <div class=\"build-area vx-d-flex vx-justify-between\" *ngSwitchCase=\"'build'\">\r\n <div class=\"left\">\r\n <!-- <app-welcome></app-welcome>\r\n <app-thank-you></app-thank-you> -->\r\n <div class=\"vx-d-flex vx-justify-between\">\r\n <div class=\"heading vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-5 vx-pl-2\">QUESTION {{questionIndex + 1}} <span *ngIf=\"question.isRequired === true\" class=\"vx-fs-16 vx-fw-400 vx-txt-red vx-ml-1\">*</span></div>\r\n <!-- *ngIf=\"service.formsPage?.settings?.weightageEnabled === true\" -->\r\n <app-weightage-selector *ngIf=\"service.formsPage?.settings?.weightageEnabled === true && ['multiple-choice','checkbox','dropdown'].includes(question?.type)\" [(value)]=\"question.weightage\" ></app-weightage-selector>\r\n </div>\r\n <!-- <div class=\"heading vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-5 vx-pl-2\">QUESTION {{questionIndex + 1}}\r\n <span *ngIf=\"question.isRequired === true\" class=\"vx-fs-16 vx-fw-400 vx-txt-red vx-ml-1\">*</span></div> -->\r\n <app-single-line-editor [placeholder]=\"'Question'\" [label]=\"false\" [editorMode]=\"'multiline'\" [(ngModel)]=\"question.title\"></app-single-line-editor>\r\n <ng-container *ngIf=\"question.isPlaceholder && ['single-textbox','comment-box'].includes(question.type)\">\r\n <div class=\"label-heading vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-1\">Placeholder Text</div>\r\n <app-single-line-editor [placeholder]=\"'Please enter a response'\" [label]=\"false\" [editorMode]=\"'multiline'\"></app-single-line-editor>\r\n </ng-container>\r\n\r\n <app-single-line-editor [label]=\"true\" [(ngModel)]=\"question.description\" *ngIf=\"question.hasDescription\" [placeholder]=\"'Description'\" [editorMode]=\"'multiline'\"></app-single-line-editor>\r\n <app-single-line-editor [label]=\"true\" [(ngModel)]=\"question.comments\" *ngIf=\"question.hasComments\" [placeholder]=\"'Comment'\" [editorMode]=\"'multiline'\"></app-single-line-editor>\r\n <div class=\"response-block vx-d-flex vx-align-center vx-justify-end vx-mb-3\" *ngIf=\"false\">\r\n <button *ngIf=\"!hideResponsePopup\" class=\"response-select vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-m-0 vx-p-0 vx-pl-2 vx-pr-2 vx-d-flex vx-align-center vx-justify-center vx-lh-6\" (click)=\"openResponsePopup()\">PRECONFIGURED RESPONSE CHOICE <i class=\"icons vx-fs-10 vx-d-flex vx-ml-4\"></i></button>\r\n <app-response-selector *ngIf=\"hideResponsePopup\"></app-response-selector>\r\n <div class=\"overlay\" *ngIf=\"hideResponsePopup\" (click)=\"closeResponsePopup()\"></div>\r\n </div>\r\n <ng-container [ngSwitch]=\"question?.type\">\r\n <app-multiple-choice *ngSwitchCase=\"'multiple-choice'\" [service]=\"service\" [question]=\"question\" (addOption)=\"addOption($event)\" (deleteOption)=\"deleteOption($event)\"></app-multiple-choice>\r\n <app-checkbox *ngSwitchCase=\"'checkbox'\" [service]=\"service\" [question]=\"question\" (addOption)=\"addOption($event)\" (deleteOption)=\"deleteOption($event)\"></app-checkbox>\r\n <app-image-choice *ngSwitchCase=\"'image-choice'\"></app-image-choice>\r\n <app-star-rating *ngSwitchCase=\"'star-rating'\"></app-star-rating>\r\n <app-matrix-dropdown *ngSwitchCase=\"'matrix-dropdown'\"></app-matrix-dropdown>\r\n <app-build-dropdown *ngSwitchCase=\"'dropdown'\" [service]=\"service\" [question]=\"question\" (addOption)=\"addOption($event)\" (deleteOption)=\"deleteOption($event)\"></app-build-dropdown>\r\n <app-matrix-rating-scale *ngSwitchCase=\"'rating-scale'\"></app-matrix-rating-scale>\r\n <app-ranking *ngSwitchCase=\"'ranking'\"></app-ranking>\r\n <app-slider *ngSwitchCase=\"'slider'\"></app-slider>\r\n <app-multiple-textbox *ngSwitchCase=\"'multiple-textbox'\"></app-multiple-textbox>\r\n <app-build-date-time *ngSwitchCase=\"'date-time'\" [question]=\"question\"></app-build-date-time>\r\n </ng-container>\r\n\r\n </div>\r\n <div class=\"right\">\r\n <app-quick-setting [questionIndex]=\"questionIndex\" [question]=\"question\" (typeChanged)=\"checkForValidationStatus('PARTIAL')\"></app-quick-setting>\r\n </div>\r\n </div>\r\n <div class=\"logic-area\" *ngSwitchCase=\"'logic'\">\r\n <div class=\"question-heading vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-5 vx-pl-2\">QUESTION {{questionIndex + 1}} <span *ngIf=\"question.isRequired === true\" class=\"vx-fs-16 vx-fw-400 vx-txt-red vx-ml-1\">*</span></div>\r\n <div class=\"question-name vx-fs-16 vx-label-txt vx-lh-6 vx-pt-1 vx-pb-1 vx-mb-5\">\r\n {{question?.title ? question?.title : 'Question'}}\r\n <i class=\"icons info vx-txt-blue vx-ml-2\" *ngIf=\"question?.hasComments\" [appTooltip]=\"question?.comments\" placement=\"bottom-right\" delay=\"0\" type=\"white\" [tooltipMandatory]=\"true\"></i></div>\r\n <app-logic [service]=\"service\" [question]=\"question\" [editorMode]=\"editorMode\" [questionIndex]=\"questionIndex\"></app-logic>\r\n </div>\r\n <div class=\"move-area\" *ngSwitchCase=\"'move'\">\r\n <div class=\"question-heading vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-5 vx-pl-2\">QUESTION {{questionIndex + 1}} <span *ngIf=\"question.isRequired === true\" class=\"vx-fs-16 vx-fw-400 vx-txt-red vx-ml-1\">*</span></div>\r\n <div class=\"question-name vx-fs-16 vx-label-txt vx-lh-6 vx-pt-1 vx-pb-1 vx-mb-5\">{{question?.title ? question?.title : 'Question'}} <i *ngIf=\"question?.hasComments\" class=\"icons info vx-txt-blue vx-ml-2\" [appTooltip]=\"question?.comments\" placement=\"bottom-right\" delay=\"0\" type=\"white\" [tooltipMandatory]=\"true\"></i></div>\r\n <app-move [service]=\"service\" [openPortal]=\"openPortal\" [question] =\"question\" [questionIndex]=\"questionIndex\"></app-move>\r\n </div>\r\n </div>\r\n <div class=\"editor-bottom vx-d-flex vx-align-center vx-justify-between vx-p-2 error\">\r\n <button (click)=\"openNextQuestion()\" class=\"next-btn vx-fs-12 vx-fw-600 vx-txt-blue vx-tt-uppercase vx-pl-2 vx-pr-2 vx-m-0 vx-d-flex vx-align-center vx-justify-center\"><span class=\"plus-icon vx-fs-14 vx-fw-500 vx-d-flex vx-align-center vx-justify-center vx-mr-1\">+</span> NEXT QUESTION</button>\r\n <div class=\"error-msg vx-fs-12 vx-txt-white vx-tt-uppercase vx-d-flex vx-align-center\" *ngIf=\"(question?.errorArray|errorMessage) as error\">\r\n <i class=\"icons vx-d-flex vx-mr-1\"></i> {{error}}\r\n </div>\r\n <button (click)=\"checkForValidationStatus('save')\" class=\"save-btn vx-fs-11 vx-fw-500 vx-txt-blue vx-tt-uppercase vx-p-0 vx-m-0 vx-d-flex vx-align-center vx-justify-center\">SAVE</button>\r\n <div *ngIf=\"nextQuestion\" class=\"next-question vx-p-4\">\r\n <app-question-type (addQuestion)=\"service.addQuestion($event,questionIndex);closeNextQuestion();\"></app-question-type>\r\n </div>\r\n <div *ngIf=\"nextQuestion\" class=\"overlay\" (click)=\"closeNextQuestion()\"></div>\r\n </div>\r\n</div>\r\n", styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";.editor-wrapper{border:1px solid #1e5dd3;border-radius:.25rem;position:relative}.editor-wrapper .label-mode{background:#7aa6f7;border:1px solid #1e5dd3;border-left:none;border-radius:0 .125rem .125rem 0;writing-mode:vertical-lr;position:absolute;left:-1.0625rem;top:3rem;width:1rem;transform:rotate(180deg)}.editor-wrapper.error{border-color:#d93b41}.editor-wrapper.error .editor-bottom{background:#d93b41}.editor-wrapper.with-logic{border-color:#f0b819}.editor-wrapper.with-logic .label-mode{background:#f4c84a;border-color:#f0b819}.editor-top{background:#FBFBFB;border-bottom:1px solid #F1F1F1;border-radius:.25rem .25rem 0 0;height:2.75rem;position:relative}.editor-top .logic-area{position:relative}.editor-top .logic-area i.info{position:absolute;right:.75rem;top:1.0625rem;cursor:pointer}.editor-top button.type-btn{background:transparent;border:none;border-bottom:.1875rem solid transparent;border-radius:0;line-height:2.75rem;margin:0 2rem}.editor-top button.type-btn.active{color:#1e5dd3;border-color:#1e5dd3}.editor-top button.disabled{pointer-events:none;opacity:.5}.editor-top .rightside-button{position:absolute;right:.5rem;top:.5rem}.editor-top .rightside-button button{background:#F1F1F1;border:none;border-radius:.125rem;height:1.75rem}.editor-top .rightside-button button.delete-btn{width:1.75rem}.editor-mid{padding-top:1.5rem;padding-bottom:1.5rem}.editor-mid .build-area .left{width:calc(100% - 17.5rem);position:relative}.editor-mid .build-area .left .heading{position:relative}.editor-mid .build-area .left .heading:before{background:#4681ef;content:\"\";position:absolute;top:.125rem;left:0;width:.125rem;height:.875rem}.editor-mid .build-area .left .response-block{position:relative;top:-.5rem}.editor-mid .build-area .left .response-block button.response-select{background:#FBFBFB;border:1px solid #DBDBDB;border-radius:.125rem}.editor-mid .build-area .left .response-block app-response-selector{position:relative;width:100%;z-index:9}.editor-mid .build-area .left .response-block .overlay{z-index:8}.editor-mid .build-area .right{width:16rem}.editor-mid .logic-area .question-heading,.editor-mid .move-area .question-heading{position:relative}.editor-mid .logic-area .question-heading:before,.editor-mid .move-area .question-heading:before{background:#4681ef;content:\"\";position:absolute;top:.4375rem;left:0;width:.125rem;height:.875rem}.editor-mid .logic-area .question-name i.info,.editor-mid .move-area .question-name i.info{cursor:pointer;position:relative;top:.125rem}.editor-bottom{background:#1e5dd3;border-radius:0 0 .125rem .125rem;position:relative}.editor-bottom button{background:#FFFFFF;border:none;border-radius:.1125rem}.editor-bottom button.next-btn{height:1.75rem}.editor-bottom button.next-btn .plus-icon{border:.125rem solid #1e5dd3;border-radius:50%;width:1.125rem;height:1.125rem;line-height:1.125rem}.editor-bottom button.save-btn{width:4.75rem;height:1.75rem}.editor-bottom .next-question{background:#FFFFFF;border-radius:.25rem;box-shadow:0 -3px 6px #1e5dd326;position:absolute;bottom:0;left:0;z-index:9}.editor-bottom .next-question ::ng-deep app-question-type .question-type ul{left:10rem;width:calc(100% - 20rem)}.editor-bottom .next-question ::ng-deep app-question-type .question-type ul li{width:10rem!important}.editor-bottom .overlay{z-index:8}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: ToolTipDirective, selector: "[appTooltip]", inputs: ["appTooltip", "placement", "type", "tooltipMandatory", "showTooltip", "animate"] }, { kind: "component", type: MultipleChoiceComponent, selector: "app-multiple-choice", inputs: ["question", "service"], outputs: ["addOption", "deleteOption"] }, { kind: "component", type: CheckboxComponent, selector: "app-checkbox", inputs: ["question", "service"], outputs: ["addOption", "deleteOption"] }, { kind: "component", type: ImageChoiceComponent, selector: "app-image-choice" }, { kind: "component", type: StarRatingComponent, selector: "app-star-rating" }, { kind: "component", type: MatrixDropdownComponent, selector: "app-matrix-dropdown" }, { kind: "component", type: DropdownComponent, selector: "app-build-dropdown", inputs: ["question", "service"], outputs: ["addOption", "deleteOption"] }, { kind: "component", type: MatrixRatingScaleComponent, selector: "app-matrix-rating-scale" }, { kind: "component", type: RankingComponent, selector: "app-ranking" }, { kind: "component", type: SliderComponent, selector: "app-slider" }, { kind: "component", type: MultipleTextboxComponent, selector: "app-multiple-textbox" }, { kind: "component", type: DateTimeComponent$1, selector: "app-build-date-time", inputs: ["question"] }, { kind: "component", type: WeightageSelectorComponent, selector: "app-weightage-selector", inputs: ["value"], outputs: ["valueChange"] }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: QuestionTypeComponent, selector: "app-question-type", outputs: ["addQuestion"] }, { kind: "component", type: QuickSettingsComponent$1, selector: "app-quick-setting", inputs: ["questionIndex", "question"], outputs: ["typeChanged"] }, { kind: "component", type: SingleLineEditorComponent, selector: "app-single-line-editor", inputs: ["placeholder", "editorMode", "label", "id"] }, { kind: "component", type: ResponseSelectorComponent, selector: "app-response-selector" }, { kind: "component", type: MoveComponent, selector: "app-move", inputs: ["questionIndex", "question", "service", "openPortal"] }, { kind: "component", type: LogicComponent, selector: "app-logic", inputs: ["service", "question", "questionIndex", "editorMode"] }, { kind: "pipe", type: ErrorMessagePipe, name: "errorMessage" }, { kind: "pipe", type: CurrentPageQuestionPipe, name: "currentPageQuestion" }] });
|
|
15732
|
+
EditorWrapperComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: EditorWrapperComponent, selector: "app-editor-wrapper", inputs: { openPortal: "openPortal", questionIndex: "questionIndex", question: "question", GRS: "GRS", service: "service", editorMode: "editorMode" }, outputs: { validQuestionData: "validQuestionData", deleteQuestion: "deleteQuestion", copyQuestion: "copyQuestion" }, viewQueries: [{ propertyName: "questionContainer", first: true, predicate: ["questionContainer"], descendants: true }], ngImport: i0, template: "<div class=\"editor-wrapper vx-mb-4 \" [class.error]=\"errorPresent\" [class.with-logic]=\"false\" [ngSwitch]=\"viewMode\" #questionContainer >\r\n <!-- <div class=\"label-mode vx-fs-10 vx-fw-500 vx-txt-white vx-tt-uppercase vx-pt-1 vx-pb-1\">ASSESSMENT MODE ENABLED</div> -->\r\n <div class=\"editor-top vx-d-flex vx-align-center vx-justify-center vx-pl-2 vx-pr-2\">\r\n <button class=\"type-btn vx-fs-11 vx-fw-600 vx-paragraph-txt vx-tt-uppercase vx-p-0 vx-d-flex vx-align-center\" [class.active]=\"viewMode == 'build'\" (click)=\"viewMode = 'build'\">BUILD</button>\r\n\r\n\r\n\r\n <div class=\"logic-area\">\r\n <button [class.disabled]=\" (service.formsPage.elements | currentPageQuestion : service.currentPageNumber ) === false\" class=\"type-btn vx-fs-11 vx-fw-600 vx-paragraph-txt vx-tt-uppercase vx-p-0 vx-d-flex vx-align-center\" [class.active]=\"viewMode == 'logic'\" (click)=\"viewMode = 'logic'\" >LOGIC</button>\r\n <i *ngIf=\"(service.formsPage.elements | currentPageQuestion : service.currentPageNumber ) === false\" [appTooltip]=\"(service.formsPage.elements | currentPageQuestion : service.currentPageNumber ) === false ? 'You need to have at least two questions to create a logical workflow.':''\" class=\"icons info vx-fs-12 vx-txt-blue\" placement=\"bottom\" delay=\"0\" type=\"black\" [tooltipMandatory]=\"true\"></i>\r\n </div>\r\n\r\n\r\n\r\n <button [class.disabled]=\"service.formsPage?.elements?.length < 2\" class=\"type-btn vx-fs-11 vx-fw-600 vx-paragraph-txt vx-tt-uppercase vx-p-0 vx-d-flex vx-align-center\" [class.active]=\"viewMode == 'move'\" (click)=\"viewMode = 'move'\">MOVE</button>\r\n <div class=\"rightside-button vx-d-flex vx-align-center\">\r\n <button class=\"duplicate-btn vx-fs-11 vx-fw-500 vx-txt-blue vx-tt-uppercase vx-pl-2 vx-pr-2 vx-m-0 vx-d-flex vx-align-center vx-justify-center vx-lh-7\" (click)=\"copyQuestion.emit(questionIndex)\">DUPLICATE</button>\r\n <button class=\"delete-btn vx-fs-14 vx-txt-red vx-pl-2 vx-pr-2 vx-m-0 vx-ml-1 vx-d-flex vx-align-center vx-justify-center\" (click)=\"deleteQuestion.emit(questionIndex)\"><i class=\"icons\"></i></button>\r\n </div>\r\n </div>\r\n <div class=\"editor-mid vx-pl-5 vx-pr-5\" [ngSwitch]=\"viewMode\">\r\n <div class=\"build-area vx-d-flex vx-justify-between\" *ngSwitchCase=\"'build'\">\r\n <div class=\"left\">\r\n <!-- <app-welcome></app-welcome>\r\n <app-thank-you></app-thank-you> -->\r\n <div class=\"vx-d-flex vx-justify-between\">\r\n <div class=\"heading vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-5 vx-pl-2\">QUESTION {{questionIndex + 1}} <span *ngIf=\"question.isRequired === true\" class=\"vx-fs-16 vx-fw-400 vx-txt-red vx-ml-1\">*</span></div>\r\n <!-- *ngIf=\"service.formsPage?.settings?.weightageEnabled === true\" -->\r\n <app-weightage-selector *ngIf=\"service.formsPage?.settings?.weightageEnabled === true && ['multiple-choice','checkbox','dropdown'].includes(question?.type)\" [(value)]=\"question.weightage\" ></app-weightage-selector>\r\n </div>\r\n <!-- <div class=\"heading vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-5 vx-pl-2\">QUESTION {{questionIndex + 1}}\r\n <span *ngIf=\"question.isRequired === true\" class=\"vx-fs-16 vx-fw-400 vx-txt-red vx-ml-1\">*</span></div> -->\r\n <app-single-line-editor [placeholder]=\"'Question'\" [label]=\"false\" [editorMode]=\"'multiline'\" [(ngModel)]=\"question.title\"></app-single-line-editor>\r\n <ng-container *ngIf=\"question.isPlaceholder && ['single-textbox','comment-box'].includes(question.type)\">\r\n <div class=\"label-heading vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-1\">Placeholder Text</div>\r\n <app-single-line-editor [placeholder]=\"'Please enter a response'\" [label]=\"false\" [editorMode]=\"'multiline'\"></app-single-line-editor>\r\n </ng-container>\r\n\r\n <app-single-line-editor [label]=\"true\" [(ngModel)]=\"question.description\" *ngIf=\"question.hasDescription\" [placeholder]=\"'Description'\" [editorMode]=\"'multiline'\"></app-single-line-editor>\r\n <app-single-line-editor [label]=\"true\" [(ngModel)]=\"question.comments\" *ngIf=\"question.hasComments\" [placeholder]=\"'Comment'\" [editorMode]=\"'multiline'\"></app-single-line-editor>\r\n <div class=\"response-block vx-d-flex vx-align-center vx-justify-end vx-mb-3\" *ngIf=\"false\">\r\n <button *ngIf=\"!hideResponsePopup\" class=\"response-select vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-m-0 vx-p-0 vx-pl-2 vx-pr-2 vx-d-flex vx-align-center vx-justify-center vx-lh-6\" (click)=\"openResponsePopup()\">PRECONFIGURED RESPONSE CHOICE <i class=\"icons vx-fs-10 vx-d-flex vx-ml-4\"></i></button>\r\n <app-response-selector *ngIf=\"hideResponsePopup\"></app-response-selector>\r\n <div class=\"overlay\" *ngIf=\"hideResponsePopup\" (click)=\"closeResponsePopup()\"></div>\r\n </div>\r\n <ng-container [ngSwitch]=\"question?.type\">\r\n <app-multiple-choice *ngSwitchCase=\"'multiple-choice'\" [service]=\"service\" [question]=\"question\" (addOption)=\"addOption($event)\" (deleteOption)=\"deleteOption($event)\"></app-multiple-choice>\r\n <app-checkbox *ngSwitchCase=\"'checkbox'\" [service]=\"service\" [question]=\"question\" (addOption)=\"addOption($event)\" (deleteOption)=\"deleteOption($event)\"></app-checkbox>\r\n <app-image-choice *ngSwitchCase=\"'image-choice'\"></app-image-choice>\r\n <app-star-rating *ngSwitchCase=\"'star-rating'\"></app-star-rating>\r\n <app-matrix-dropdown *ngSwitchCase=\"'matrix-dropdown'\"></app-matrix-dropdown>\r\n <app-build-dropdown *ngSwitchCase=\"'dropdown'\" [service]=\"service\" [question]=\"question\" (addOption)=\"addOption($event)\" (deleteOption)=\"deleteOption($event)\"></app-build-dropdown>\r\n <app-matrix-rating-scale *ngSwitchCase=\"'rating-scale'\"></app-matrix-rating-scale>\r\n <app-ranking *ngSwitchCase=\"'ranking'\"></app-ranking>\r\n <app-slider *ngSwitchCase=\"'slider'\"></app-slider>\r\n <app-multiple-textbox *ngSwitchCase=\"'multiple-textbox'\"></app-multiple-textbox>\r\n <app-build-date-time *ngSwitchCase=\"'date-time'\" [question]=\"question\"></app-build-date-time>\r\n </ng-container>\r\n\r\n </div>\r\n <div class=\"right\">\r\n <app-quick-setting [questionIndex]=\"questionIndex\" [question]=\"question\" (typeChanged)=\"checkForValidationStatus('PARTIAL')\"></app-quick-setting>\r\n </div>\r\n </div>\r\n <div class=\"logic-area\" *ngSwitchCase=\"'logic'\">\r\n <div class=\"question-heading vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-5 vx-pl-2\">QUESTION {{questionIndex + 1}} <span *ngIf=\"question.isRequired === true\" class=\"vx-fs-16 vx-fw-400 vx-txt-red vx-ml-1\">*</span></div>\r\n <div class=\"question-name vx-fs-16 vx-label-txt vx-lh-6 vx-pt-1 vx-pb-1 vx-mb-5\">\r\n {{question?.title ? question?.title : 'Question'}}\r\n <i class=\"icons info vx-txt-blue vx-ml-2\" *ngIf=\"question?.hasComments\" [appTooltip]=\"question?.comments\" placement=\"bottom-right\" delay=\"0\" type=\"white\" [tooltipMandatory]=\"true\"></i></div>\r\n <app-logic [service]=\"service\" [question]=\"question\" [editorMode]=\"editorMode\" [questionIndex]=\"questionIndex\"></app-logic>\r\n </div>\r\n <div class=\"move-area\" *ngSwitchCase=\"'move'\">\r\n <div class=\"question-heading vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-5 vx-pl-2\">QUESTION {{questionIndex + 1}} <span *ngIf=\"question.isRequired === true\" class=\"vx-fs-16 vx-fw-400 vx-txt-red vx-ml-1\">*</span></div>\r\n <div class=\"question-name vx-fs-16 vx-label-txt vx-lh-6 vx-pt-1 vx-pb-1 vx-mb-5\">{{question?.title ? question?.title : 'Question'}} <i *ngIf=\"question?.hasComments\" class=\"icons info vx-txt-blue vx-ml-2\" [appTooltip]=\"question?.comments\" placement=\"bottom-right\" delay=\"0\" type=\"white\" [tooltipMandatory]=\"true\"></i></div>\r\n <app-move [service]=\"service\" [openPortal]=\"openPortal\" [question] =\"question\" [questionIndex]=\"questionIndex\"></app-move>\r\n </div>\r\n </div>\r\n <div class=\"editor-bottom vx-d-flex vx-align-center vx-justify-between vx-p-2 error\">\r\n <button (click)=\"openNextQuestion()\" class=\"next-btn vx-fs-12 vx-fw-600 vx-txt-blue vx-tt-uppercase vx-pl-2 vx-pr-2 vx-m-0 vx-d-flex vx-align-center vx-justify-center\"><span class=\"plus-icon vx-fs-14 vx-fw-500 vx-d-flex vx-align-center vx-justify-center vx-mr-1\">+</span> NEXT QUESTION</button>\r\n <div class=\"error-msg vx-fs-12 vx-txt-white vx-tt-uppercase vx-d-flex vx-align-center\" *ngIf=\"(question?.errorArray|errorMessage) as error\">\r\n <i class=\"icons vx-d-flex vx-mr-1\"></i> {{error}}\r\n </div>\r\n <button (click)=\"checkForValidationStatus('save')\" class=\"save-btn vx-fs-11 vx-fw-500 vx-txt-blue vx-tt-uppercase vx-p-0 vx-m-0 vx-d-flex vx-align-center vx-justify-center\">SAVE</button>\r\n <div *ngIf=\"nextQuestion\" class=\"next-question vx-p-4\">\r\n <app-question-type (addQuestion)=\"service.addQuestion($event,questionIndex);closeNextQuestion();\"></app-question-type>\r\n </div>\r\n <div *ngIf=\"nextQuestion\" class=\"overlay\" (click)=\"closeNextQuestion()\"></div>\r\n </div>\r\n</div>\r\n", styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";.editor-wrapper{border:1px solid #1e5dd3;border-radius:.25rem;position:relative}.editor-wrapper .label-mode{background:#7aa6f7;border:1px solid #1e5dd3;border-left:none;border-radius:0 .125rem .125rem 0;writing-mode:vertical-lr;position:absolute;left:-1.0625rem;top:3rem;width:1rem;transform:rotate(180deg)}.editor-wrapper.error{border-color:#d93b41}.editor-wrapper.error .editor-bottom{background:#d93b41}.editor-wrapper.with-logic{border-color:#f0b819}.editor-wrapper.with-logic .label-mode{background:#f4c84a;border-color:#f0b819}.editor-top{background:#FBFBFB;border-bottom:1px solid #F1F1F1;border-radius:.25rem .25rem 0 0;height:2.75rem;position:relative}.editor-top .logic-area{position:relative}.editor-top .logic-area i.info{position:absolute;right:.75rem;top:1.0625rem;cursor:pointer}.editor-top button.type-btn{background:transparent;border:none;border-bottom:.1875rem solid transparent;border-radius:0;line-height:2.75rem;margin:0 2rem}.editor-top button.type-btn.active{color:#1e5dd3;border-color:#1e5dd3}.editor-top button.disabled{pointer-events:none;opacity:.5}.editor-top .rightside-button{position:absolute;right:.5rem;top:.5rem}.editor-top .rightside-button button{background:#F1F1F1;border:none;border-radius:.125rem;height:1.75rem}.editor-top .rightside-button button.delete-btn{width:1.75rem}.editor-mid{padding-top:1.5rem;padding-bottom:1.5rem}.editor-mid .build-area .left{width:calc(100% - 17.5rem);position:relative}.editor-mid .build-area .left .heading{position:relative}.editor-mid .build-area .left .heading:before{background:#4681ef;content:\"\";position:absolute;top:.125rem;left:0;width:.125rem;height:.875rem}.editor-mid .build-area .left .response-block{position:relative;top:-.5rem}.editor-mid .build-area .left .response-block button.response-select{background:#FBFBFB;border:1px solid #DBDBDB;border-radius:.125rem}.editor-mid .build-area .left .response-block app-response-selector{position:relative;width:100%;z-index:9}.editor-mid .build-area .left .response-block .overlay{z-index:8}.editor-mid .build-area .right{width:16rem}.editor-mid .logic-area .question-heading,.editor-mid .move-area .question-heading{position:relative}.editor-mid .logic-area .question-heading:before,.editor-mid .move-area .question-heading:before{background:#4681ef;content:\"\";position:absolute;top:.4375rem;left:0;width:.125rem;height:.875rem}.editor-mid .logic-area .question-name i.info,.editor-mid .move-area .question-name i.info{cursor:pointer;position:relative;top:.125rem}.editor-bottom{background:#1e5dd3;border-radius:0 0 .125rem .125rem;position:relative}.editor-bottom button{background:#FFFFFF;border:none;border-radius:.1125rem}.editor-bottom button.next-btn{height:1.75rem}.editor-bottom button.next-btn .plus-icon{border:.125rem solid #1e5dd3;border-radius:50%;width:1.125rem;height:1.125rem;line-height:1.125rem}.editor-bottom button.save-btn{width:4.75rem;height:1.75rem}.editor-bottom .next-question{background:#FFFFFF;border-radius:.25rem;box-shadow:0 -3px 6px #1e5dd326;position:absolute;bottom:0;left:0;z-index:9}.editor-bottom .next-question ::ng-deep app-question-type .question-type ul{left:10rem;width:calc(100% - 20rem)}.editor-bottom .next-question ::ng-deep app-question-type .question-type ul li{width:10rem!important}.editor-bottom .overlay{z-index:8}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: ToolTipDirective, selector: "[appTooltip]", inputs: ["appTooltip", "placement", "type", "tooltipMandatory", "showTooltip", "animate"] }, { kind: "component", type: MultipleChoiceComponent, selector: "app-multiple-choice", inputs: ["question", "service"], outputs: ["addOption", "deleteOption"] }, { kind: "component", type: CheckboxComponent, selector: "app-checkbox", inputs: ["question", "service"], outputs: ["addOption", "deleteOption"] }, { kind: "component", type: ImageChoiceComponent, selector: "app-image-choice" }, { kind: "component", type: StarRatingComponent, selector: "app-star-rating" }, { kind: "component", type: MatrixDropdownComponent, selector: "app-matrix-dropdown" }, { kind: "component", type: DropdownComponent, selector: "app-build-dropdown", inputs: ["question", "service"], outputs: ["addOption", "deleteOption"] }, { kind: "component", type: MatrixRatingScaleComponent, selector: "app-matrix-rating-scale" }, { kind: "component", type: RankingComponent, selector: "app-ranking" }, { kind: "component", type: SliderComponent, selector: "app-slider" }, { kind: "component", type: MultipleTextboxComponent, selector: "app-multiple-textbox" }, { kind: "component", type: DateTimeComponent$1, selector: "app-build-date-time", inputs: ["question"] }, { kind: "component", type: WeightageSelectorComponent, selector: "app-weightage-selector", inputs: ["value"], outputs: ["valueChange"] }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: QuestionTypeComponent, selector: "app-question-type", outputs: ["addQuestion"] }, { kind: "component", type: QuickSettingsComponent, selector: "app-quick-setting", inputs: ["questionIndex", "question"], outputs: ["typeChanged"] }, { kind: "component", type: SingleLineEditorComponent, selector: "app-single-line-editor", inputs: ["placeholder", "editorMode", "label", "id"] }, { kind: "component", type: ResponseSelectorComponent, selector: "app-response-selector" }, { kind: "component", type: MoveComponent, selector: "app-move", inputs: ["questionIndex", "question", "service", "openPortal"] }, { kind: "component", type: LogicComponent, selector: "app-logic", inputs: ["service", "question", "questionIndex", "editorMode"] }, { kind: "pipe", type: ErrorMessagePipe, name: "errorMessage" }, { kind: "pipe", type: CurrentPageQuestionPipe, name: "currentPageQuestion" }] });
|
|
15718
15733
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: EditorWrapperComponent, decorators: [{
|
|
15719
15734
|
type: Component,
|
|
15720
15735
|
args: [{ selector: 'app-editor-wrapper', template: "<div class=\"editor-wrapper vx-mb-4 \" [class.error]=\"errorPresent\" [class.with-logic]=\"false\" [ngSwitch]=\"viewMode\" #questionContainer >\r\n <!-- <div class=\"label-mode vx-fs-10 vx-fw-500 vx-txt-white vx-tt-uppercase vx-pt-1 vx-pb-1\">ASSESSMENT MODE ENABLED</div> -->\r\n <div class=\"editor-top vx-d-flex vx-align-center vx-justify-center vx-pl-2 vx-pr-2\">\r\n <button class=\"type-btn vx-fs-11 vx-fw-600 vx-paragraph-txt vx-tt-uppercase vx-p-0 vx-d-flex vx-align-center\" [class.active]=\"viewMode == 'build'\" (click)=\"viewMode = 'build'\">BUILD</button>\r\n\r\n\r\n\r\n <div class=\"logic-area\">\r\n <button [class.disabled]=\" (service.formsPage.elements | currentPageQuestion : service.currentPageNumber ) === false\" class=\"type-btn vx-fs-11 vx-fw-600 vx-paragraph-txt vx-tt-uppercase vx-p-0 vx-d-flex vx-align-center\" [class.active]=\"viewMode == 'logic'\" (click)=\"viewMode = 'logic'\" >LOGIC</button>\r\n <i *ngIf=\"(service.formsPage.elements | currentPageQuestion : service.currentPageNumber ) === false\" [appTooltip]=\"(service.formsPage.elements | currentPageQuestion : service.currentPageNumber ) === false ? 'You need to have at least two questions to create a logical workflow.':''\" class=\"icons info vx-fs-12 vx-txt-blue\" placement=\"bottom\" delay=\"0\" type=\"black\" [tooltipMandatory]=\"true\"></i>\r\n </div>\r\n\r\n\r\n\r\n <button [class.disabled]=\"service.formsPage?.elements?.length < 2\" class=\"type-btn vx-fs-11 vx-fw-600 vx-paragraph-txt vx-tt-uppercase vx-p-0 vx-d-flex vx-align-center\" [class.active]=\"viewMode == 'move'\" (click)=\"viewMode = 'move'\">MOVE</button>\r\n <div class=\"rightside-button vx-d-flex vx-align-center\">\r\n <button class=\"duplicate-btn vx-fs-11 vx-fw-500 vx-txt-blue vx-tt-uppercase vx-pl-2 vx-pr-2 vx-m-0 vx-d-flex vx-align-center vx-justify-center vx-lh-7\" (click)=\"copyQuestion.emit(questionIndex)\">DUPLICATE</button>\r\n <button class=\"delete-btn vx-fs-14 vx-txt-red vx-pl-2 vx-pr-2 vx-m-0 vx-ml-1 vx-d-flex vx-align-center vx-justify-center\" (click)=\"deleteQuestion.emit(questionIndex)\"><i class=\"icons\"></i></button>\r\n </div>\r\n </div>\r\n <div class=\"editor-mid vx-pl-5 vx-pr-5\" [ngSwitch]=\"viewMode\">\r\n <div class=\"build-area vx-d-flex vx-justify-between\" *ngSwitchCase=\"'build'\">\r\n <div class=\"left\">\r\n <!-- <app-welcome></app-welcome>\r\n <app-thank-you></app-thank-you> -->\r\n <div class=\"vx-d-flex vx-justify-between\">\r\n <div class=\"heading vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-5 vx-pl-2\">QUESTION {{questionIndex + 1}} <span *ngIf=\"question.isRequired === true\" class=\"vx-fs-16 vx-fw-400 vx-txt-red vx-ml-1\">*</span></div>\r\n <!-- *ngIf=\"service.formsPage?.settings?.weightageEnabled === true\" -->\r\n <app-weightage-selector *ngIf=\"service.formsPage?.settings?.weightageEnabled === true && ['multiple-choice','checkbox','dropdown'].includes(question?.type)\" [(value)]=\"question.weightage\" ></app-weightage-selector>\r\n </div>\r\n <!-- <div class=\"heading vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-5 vx-pl-2\">QUESTION {{questionIndex + 1}}\r\n <span *ngIf=\"question.isRequired === true\" class=\"vx-fs-16 vx-fw-400 vx-txt-red vx-ml-1\">*</span></div> -->\r\n <app-single-line-editor [placeholder]=\"'Question'\" [label]=\"false\" [editorMode]=\"'multiline'\" [(ngModel)]=\"question.title\"></app-single-line-editor>\r\n <ng-container *ngIf=\"question.isPlaceholder && ['single-textbox','comment-box'].includes(question.type)\">\r\n <div class=\"label-heading vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-1\">Placeholder Text</div>\r\n <app-single-line-editor [placeholder]=\"'Please enter a response'\" [label]=\"false\" [editorMode]=\"'multiline'\"></app-single-line-editor>\r\n </ng-container>\r\n\r\n <app-single-line-editor [label]=\"true\" [(ngModel)]=\"question.description\" *ngIf=\"question.hasDescription\" [placeholder]=\"'Description'\" [editorMode]=\"'multiline'\"></app-single-line-editor>\r\n <app-single-line-editor [label]=\"true\" [(ngModel)]=\"question.comments\" *ngIf=\"question.hasComments\" [placeholder]=\"'Comment'\" [editorMode]=\"'multiline'\"></app-single-line-editor>\r\n <div class=\"response-block vx-d-flex vx-align-center vx-justify-end vx-mb-3\" *ngIf=\"false\">\r\n <button *ngIf=\"!hideResponsePopup\" class=\"response-select vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-m-0 vx-p-0 vx-pl-2 vx-pr-2 vx-d-flex vx-align-center vx-justify-center vx-lh-6\" (click)=\"openResponsePopup()\">PRECONFIGURED RESPONSE CHOICE <i class=\"icons vx-fs-10 vx-d-flex vx-ml-4\"></i></button>\r\n <app-response-selector *ngIf=\"hideResponsePopup\"></app-response-selector>\r\n <div class=\"overlay\" *ngIf=\"hideResponsePopup\" (click)=\"closeResponsePopup()\"></div>\r\n </div>\r\n <ng-container [ngSwitch]=\"question?.type\">\r\n <app-multiple-choice *ngSwitchCase=\"'multiple-choice'\" [service]=\"service\" [question]=\"question\" (addOption)=\"addOption($event)\" (deleteOption)=\"deleteOption($event)\"></app-multiple-choice>\r\n <app-checkbox *ngSwitchCase=\"'checkbox'\" [service]=\"service\" [question]=\"question\" (addOption)=\"addOption($event)\" (deleteOption)=\"deleteOption($event)\"></app-checkbox>\r\n <app-image-choice *ngSwitchCase=\"'image-choice'\"></app-image-choice>\r\n <app-star-rating *ngSwitchCase=\"'star-rating'\"></app-star-rating>\r\n <app-matrix-dropdown *ngSwitchCase=\"'matrix-dropdown'\"></app-matrix-dropdown>\r\n <app-build-dropdown *ngSwitchCase=\"'dropdown'\" [service]=\"service\" [question]=\"question\" (addOption)=\"addOption($event)\" (deleteOption)=\"deleteOption($event)\"></app-build-dropdown>\r\n <app-matrix-rating-scale *ngSwitchCase=\"'rating-scale'\"></app-matrix-rating-scale>\r\n <app-ranking *ngSwitchCase=\"'ranking'\"></app-ranking>\r\n <app-slider *ngSwitchCase=\"'slider'\"></app-slider>\r\n <app-multiple-textbox *ngSwitchCase=\"'multiple-textbox'\"></app-multiple-textbox>\r\n <app-build-date-time *ngSwitchCase=\"'date-time'\" [question]=\"question\"></app-build-date-time>\r\n </ng-container>\r\n\r\n </div>\r\n <div class=\"right\">\r\n <app-quick-setting [questionIndex]=\"questionIndex\" [question]=\"question\" (typeChanged)=\"checkForValidationStatus('PARTIAL')\"></app-quick-setting>\r\n </div>\r\n </div>\r\n <div class=\"logic-area\" *ngSwitchCase=\"'logic'\">\r\n <div class=\"question-heading vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-5 vx-pl-2\">QUESTION {{questionIndex + 1}} <span *ngIf=\"question.isRequired === true\" class=\"vx-fs-16 vx-fw-400 vx-txt-red vx-ml-1\">*</span></div>\r\n <div class=\"question-name vx-fs-16 vx-label-txt vx-lh-6 vx-pt-1 vx-pb-1 vx-mb-5\">\r\n {{question?.title ? question?.title : 'Question'}}\r\n <i class=\"icons info vx-txt-blue vx-ml-2\" *ngIf=\"question?.hasComments\" [appTooltip]=\"question?.comments\" placement=\"bottom-right\" delay=\"0\" type=\"white\" [tooltipMandatory]=\"true\"></i></div>\r\n <app-logic [service]=\"service\" [question]=\"question\" [editorMode]=\"editorMode\" [questionIndex]=\"questionIndex\"></app-logic>\r\n </div>\r\n <div class=\"move-area\" *ngSwitchCase=\"'move'\">\r\n <div class=\"question-heading vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-5 vx-pl-2\">QUESTION {{questionIndex + 1}} <span *ngIf=\"question.isRequired === true\" class=\"vx-fs-16 vx-fw-400 vx-txt-red vx-ml-1\">*</span></div>\r\n <div class=\"question-name vx-fs-16 vx-label-txt vx-lh-6 vx-pt-1 vx-pb-1 vx-mb-5\">{{question?.title ? question?.title : 'Question'}} <i *ngIf=\"question?.hasComments\" class=\"icons info vx-txt-blue vx-ml-2\" [appTooltip]=\"question?.comments\" placement=\"bottom-right\" delay=\"0\" type=\"white\" [tooltipMandatory]=\"true\"></i></div>\r\n <app-move [service]=\"service\" [openPortal]=\"openPortal\" [question] =\"question\" [questionIndex]=\"questionIndex\"></app-move>\r\n </div>\r\n </div>\r\n <div class=\"editor-bottom vx-d-flex vx-align-center vx-justify-between vx-p-2 error\">\r\n <button (click)=\"openNextQuestion()\" class=\"next-btn vx-fs-12 vx-fw-600 vx-txt-blue vx-tt-uppercase vx-pl-2 vx-pr-2 vx-m-0 vx-d-flex vx-align-center vx-justify-center\"><span class=\"plus-icon vx-fs-14 vx-fw-500 vx-d-flex vx-align-center vx-justify-center vx-mr-1\">+</span> NEXT QUESTION</button>\r\n <div class=\"error-msg vx-fs-12 vx-txt-white vx-tt-uppercase vx-d-flex vx-align-center\" *ngIf=\"(question?.errorArray|errorMessage) as error\">\r\n <i class=\"icons vx-d-flex vx-mr-1\"></i> {{error}}\r\n </div>\r\n <button (click)=\"checkForValidationStatus('save')\" class=\"save-btn vx-fs-11 vx-fw-500 vx-txt-blue vx-tt-uppercase vx-p-0 vx-m-0 vx-d-flex vx-align-center vx-justify-center\">SAVE</button>\r\n <div *ngIf=\"nextQuestion\" class=\"next-question vx-p-4\">\r\n <app-question-type (addQuestion)=\"service.addQuestion($event,questionIndex);closeNextQuestion();\"></app-question-type>\r\n </div>\r\n <div *ngIf=\"nextQuestion\" class=\"overlay\" (click)=\"closeNextQuestion()\"></div>\r\n </div>\r\n</div>\r\n", styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";.editor-wrapper{border:1px solid #1e5dd3;border-radius:.25rem;position:relative}.editor-wrapper .label-mode{background:#7aa6f7;border:1px solid #1e5dd3;border-left:none;border-radius:0 .125rem .125rem 0;writing-mode:vertical-lr;position:absolute;left:-1.0625rem;top:3rem;width:1rem;transform:rotate(180deg)}.editor-wrapper.error{border-color:#d93b41}.editor-wrapper.error .editor-bottom{background:#d93b41}.editor-wrapper.with-logic{border-color:#f0b819}.editor-wrapper.with-logic .label-mode{background:#f4c84a;border-color:#f0b819}.editor-top{background:#FBFBFB;border-bottom:1px solid #F1F1F1;border-radius:.25rem .25rem 0 0;height:2.75rem;position:relative}.editor-top .logic-area{position:relative}.editor-top .logic-area i.info{position:absolute;right:.75rem;top:1.0625rem;cursor:pointer}.editor-top button.type-btn{background:transparent;border:none;border-bottom:.1875rem solid transparent;border-radius:0;line-height:2.75rem;margin:0 2rem}.editor-top button.type-btn.active{color:#1e5dd3;border-color:#1e5dd3}.editor-top button.disabled{pointer-events:none;opacity:.5}.editor-top .rightside-button{position:absolute;right:.5rem;top:.5rem}.editor-top .rightside-button button{background:#F1F1F1;border:none;border-radius:.125rem;height:1.75rem}.editor-top .rightside-button button.delete-btn{width:1.75rem}.editor-mid{padding-top:1.5rem;padding-bottom:1.5rem}.editor-mid .build-area .left{width:calc(100% - 17.5rem);position:relative}.editor-mid .build-area .left .heading{position:relative}.editor-mid .build-area .left .heading:before{background:#4681ef;content:\"\";position:absolute;top:.125rem;left:0;width:.125rem;height:.875rem}.editor-mid .build-area .left .response-block{position:relative;top:-.5rem}.editor-mid .build-area .left .response-block button.response-select{background:#FBFBFB;border:1px solid #DBDBDB;border-radius:.125rem}.editor-mid .build-area .left .response-block app-response-selector{position:relative;width:100%;z-index:9}.editor-mid .build-area .left .response-block .overlay{z-index:8}.editor-mid .build-area .right{width:16rem}.editor-mid .logic-area .question-heading,.editor-mid .move-area .question-heading{position:relative}.editor-mid .logic-area .question-heading:before,.editor-mid .move-area .question-heading:before{background:#4681ef;content:\"\";position:absolute;top:.4375rem;left:0;width:.125rem;height:.875rem}.editor-mid .logic-area .question-name i.info,.editor-mid .move-area .question-name i.info{cursor:pointer;position:relative;top:.125rem}.editor-bottom{background:#1e5dd3;border-radius:0 0 .125rem .125rem;position:relative}.editor-bottom button{background:#FFFFFF;border:none;border-radius:.1125rem}.editor-bottom button.next-btn{height:1.75rem}.editor-bottom button.next-btn .plus-icon{border:.125rem solid #1e5dd3;border-radius:50%;width:1.125rem;height:1.125rem;line-height:1.125rem}.editor-bottom button.save-btn{width:4.75rem;height:1.75rem}.editor-bottom .next-question{background:#FFFFFF;border-radius:.25rem;box-shadow:0 -3px 6px #1e5dd326;position:absolute;bottom:0;left:0;z-index:9}.editor-bottom .next-question ::ng-deep app-question-type .question-type ul{left:10rem;width:calc(100% - 20rem)}.editor-bottom .next-question ::ng-deep app-question-type .question-type ul li{width:10rem!important}.editor-bottom .overlay{z-index:8}\n"] }]
|
|
@@ -21180,19 +21195,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
21180
21195
|
}] }];
|
|
21181
21196
|
} });
|
|
21182
21197
|
|
|
21183
|
-
class
|
|
21198
|
+
class WelcomeComponent$2 {
|
|
21184
21199
|
constructor() { }
|
|
21185
21200
|
ngOnInit() {
|
|
21186
21201
|
}
|
|
21187
21202
|
}
|
|
21188
|
-
|
|
21189
|
-
|
|
21190
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type:
|
|
21203
|
+
WelcomeComponent$2.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: WelcomeComponent$2, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
21204
|
+
WelcomeComponent$2.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: WelcomeComponent$2, selector: "app-preview-welcome", ngImport: i0, template: "<div class=\"welcome-preview vx-text-center vx-mb-5\">\r\n <div class=\"image\"><img src=\"https://s3-eu-west-1.amazonaws.com/eu.v-comply.com/o/5e481a5d61ca5e14f5731049/survey/61ee3c97a973170009458150/welcome/202011270933381643024815820.png\" /></div>\r\n <div class=\"heading vx-fs-16 vx-paragraph-txt vx-lih-6 vx-mb-5\">Welcome heading</div>\r\n <div class=\"details vx-fs-14 vx-label-txt vx-pb-3 vx-mb-5\">In publishing and graphic design, Lorem ipsum is a placeholder text commonly used to demonstrate the visual form of a document or a typeface without relying on meaningful content. Lorem ipsum may be used as a placeholder before the final copy is available.</div>\r\n</div>", styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";.welcome-preview .image{width:30rem;margin:0 auto 2rem}.welcome-preview .image img{border-radius:.625rem;width:100%}\n"] });
|
|
21205
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: WelcomeComponent$2, decorators: [{
|
|
21191
21206
|
type: Component,
|
|
21192
|
-
args: [{ selector: 'app-
|
|
21193
|
-
}], ctorParameters: function () { return []; }
|
|
21194
|
-
type: Input
|
|
21195
|
-
}] } });
|
|
21207
|
+
args: [{ selector: 'app-preview-welcome', template: "<div class=\"welcome-preview vx-text-center vx-mb-5\">\r\n <div class=\"image\"><img src=\"https://s3-eu-west-1.amazonaws.com/eu.v-comply.com/o/5e481a5d61ca5e14f5731049/survey/61ee3c97a973170009458150/welcome/202011270933381643024815820.png\" /></div>\r\n <div class=\"heading vx-fs-16 vx-paragraph-txt vx-lih-6 vx-mb-5\">Welcome heading</div>\r\n <div class=\"details vx-fs-14 vx-label-txt vx-pb-3 vx-mb-5\">In publishing and graphic design, Lorem ipsum is a placeholder text commonly used to demonstrate the visual form of a document or a typeface without relying on meaningful content. Lorem ipsum may be used as a placeholder before the final copy is available.</div>\r\n</div>", styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";.welcome-preview .image{width:30rem;margin:0 auto 2rem}.welcome-preview .image img{border-radius:.625rem;width:100%}\n"] }]
|
|
21208
|
+
}], ctorParameters: function () { return []; } });
|
|
21196
21209
|
|
|
21197
21210
|
class CheckboxQuestionComponent {
|
|
21198
21211
|
constructor() {
|
|
@@ -21209,10 +21222,10 @@ class CheckboxQuestionComponent {
|
|
|
21209
21222
|
}
|
|
21210
21223
|
}
|
|
21211
21224
|
CheckboxQuestionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CheckboxQuestionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
21212
|
-
CheckboxQuestionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: CheckboxQuestionComponent, selector: "app-checkbox-question", inputs: { question: "question", questionIndex: "questionIndex" }, ngImport: i0, template: "<div class=\"question-block\">\r\n <div class=\"question-head vx-d-flex vx-mb-4\">\r\n <span class=\"count vx-paragraph-txt vx-fs-20 vx-fw-400\">{{questionIndex}}.</span>\r\n <span class=\"heading vx-pl-3\">\r\n <span class=\"vx-fw-300 vx-label-txt vx-fs-20\" [innerHTML]=\"question?.title=='' ? 'Question' : question?.title\"></span>\r\n <span class=\"required vx-fw-400 vx-txt-red vx-fs-24 vx-ml-2\" *ngIf=\"question?.isRequired\">*</span>\r\n </span>\r\n </div>\r\n <div class=\"question-details vx-fs-13 vx-paragraph-txt\" *ngIf=\"question?.hasDescription && question?.description.trim().length > 0 \" [innerHTML]=\"question?.description\"></div>\r\n <div class=\"question-options\">\r\n <ul class=\"vx-p-0 vx-m-0\">\r\n <li class=\"vx-mt-5 vx-pb-2\" *ngFor=\"let choice of choicesForPreviewMode; let choiceIndex = index\">\r\n <app-cs-checkbox>\r\n <span class=\"checkbox-value vx-fs-14 vx-paragraph-txt vx-fw-400 \" [appTooltip]=\"choice?.title\" placement=\"bottom-left\" delay=\"0\" type=\"black\" [tooltipMandatory]=\"false\">{{choice?.title ? choice?.title: 'Option' }}</span>\r\n </app-cs-checkbox>\r\n </li>\r\n <li class=\"vx-mt-5 vx-pb-2\" *ngIf=\"question?.hasOther\">\r\n <app-cs-checkbox>\r\n <span class=\"checkbox-value vx-fs-14 vx-paragraph-txt vx-fw-400 \" [appTooltip]=\"question.otherValue\" placement=\"bottom-left\" delay=\"0\" type=\"black\" [tooltipMandatory]=\"false\">{{question.otherValue}}</span>\r\n </app-cs-checkbox>\r\n </li>\r\n </ul>\r\n </div>\r\n <div class=\"question-quick-settings\">\r\n <app-quick-settings [question]=\"question\"></app-quick-settings>\r\n </div>\r\n</div>\r\n", styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";::ng-deep .question-block{position:relative;margin-bottom:3rem}::ng-deep .question-head{padding-right:4rem}::ng-deep .question-head .count{min-width:1.5rem}::ng-deep .question-head .heading .required{position:relative;top:-.25rem}::ng-deep .question-details{padding-right:4rem;padding-left:2.5rem}::ng-deep .question-options{margin-left:2.5rem;margin-top:1.875rem}::ng-deep .question-options ul{list-style-type:none}::ng-deep .question-options ul li app-cs-checkbox .checkbox-item{width:100%!important;position:relative;padding-left:2rem}::ng-deep .question-options ul li app-cs-checkbox .checkbox-item .checkbox,::ng-deep .question-options ul li app-cs-checkbox .checkbox-item .checkmark{min-width:1.375rem!important;width:1.375rem!important;height:1.375rem!important;position:absolute!important;left:0!important}::ng-deep .question-options ul li app-cs-checkbox .checkbox-item .value{width:100%!important;margin:0!important;justify-content:start!important}::ng-deep .question-options ul li app-cs-checkbox .checkbox-item .value .checkbox-value{text-overflow:ellipsis;white-space:nowrap;overflow:hidden;width:90%}::ng-deep .question-quick-settings{position:absolute;top:-.25rem;right:-
|
|
21225
|
+
CheckboxQuestionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: CheckboxQuestionComponent, selector: "app-checkbox-question", inputs: { question: "question", questionIndex: "questionIndex" }, ngImport: i0, template: "<div class=\"question-block\">\r\n <div class=\"question-head vx-d-flex vx-mb-4\">\r\n <span class=\"count vx-paragraph-txt vx-fs-20 vx-fw-400\">{{questionIndex}}.</span>\r\n <span class=\"heading vx-pl-3\">\r\n <span class=\"vx-fw-300 vx-label-txt vx-fs-20\" [innerHTML]=\"question?.title=='' ? 'Question' : question?.title\"></span>\r\n <span class=\"required vx-fw-400 vx-txt-red vx-fs-24 vx-ml-2\" *ngIf=\"question?.isRequired\">*</span>\r\n </span>\r\n </div>\r\n <div class=\"question-details vx-fs-13 vx-paragraph-txt\" *ngIf=\"question?.hasDescription && question?.description.trim().length > 0 \" [innerHTML]=\"question?.description\"></div>\r\n <div class=\"question-options\">\r\n <ul class=\"vx-p-0 vx-m-0\">\r\n <li class=\"vx-mt-5 vx-pb-2\" *ngFor=\"let choice of choicesForPreviewMode; let choiceIndex = index\">\r\n <app-cs-checkbox>\r\n <span class=\"checkbox-value vx-fs-14 vx-paragraph-txt vx-fw-400 \" [appTooltip]=\"choice?.title\" placement=\"bottom-left\" delay=\"0\" type=\"black\" [tooltipMandatory]=\"false\">{{choice?.title ? choice?.title: 'Option' }}</span>\r\n </app-cs-checkbox>\r\n </li>\r\n <li class=\"vx-mt-5 vx-pb-2\" *ngIf=\"question?.hasOther\">\r\n <app-cs-checkbox>\r\n <span class=\"checkbox-value vx-fs-14 vx-paragraph-txt vx-fw-400 \" [appTooltip]=\"question.otherValue\" placement=\"bottom-left\" delay=\"0\" type=\"black\" [tooltipMandatory]=\"false\">{{question.otherValue}}</span>\r\n </app-cs-checkbox>\r\n </li>\r\n </ul>\r\n </div>\r\n <div class=\"question-quick-settings\">\r\n <app-quick-settings [question]=\"question\"></app-quick-settings>\r\n </div>\r\n</div>\r\n", styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";::ng-deep .question-block{position:relative;margin-bottom:3rem}::ng-deep .question-head{padding-right:4rem}::ng-deep .question-head .count{min-width:1.5rem}::ng-deep .question-head .heading .required{position:relative;top:-.25rem}::ng-deep .question-details{padding-right:4rem;padding-left:2.5rem}::ng-deep .question-options{margin-left:2.5rem;margin-top:1.875rem}::ng-deep .question-options ul{list-style-type:none}::ng-deep .question-options ul li app-cs-checkbox .checkbox-item{width:100%!important;position:relative;padding-left:2rem}::ng-deep .question-options ul li app-cs-checkbox .checkbox-item .checkbox,::ng-deep .question-options ul li app-cs-checkbox .checkbox-item .checkmark{min-width:1.375rem!important;width:1.375rem!important;height:1.375rem!important;position:absolute!important;left:0!important}::ng-deep .question-options ul li app-cs-checkbox .checkbox-item .value{width:100%!important;margin:0!important;justify-content:start!important}::ng-deep .question-options ul li app-cs-checkbox .checkbox-item .value .checkbox-value{text-overflow:ellipsis;white-space:nowrap;overflow:hidden;width:90%}::ng-deep .question-quick-settings{position:absolute;top:-.25rem;right:-3.75rem}\n"], dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: ToolTipDirective, selector: "[appTooltip]", inputs: ["appTooltip", "placement", "type", "tooltipMandatory", "showTooltip", "animate"] }, { kind: "component", type: CsCheckboxComponent$1, selector: "app-cs-checkbox", inputs: ["disabled", "ngValue", "value", "readonly", "oneLine"], outputs: ["ngValueChange"] }, { kind: "component", type: QuickSettingsComponent$1, selector: "app-quick-settings", inputs: ["question"] }] });
|
|
21213
21226
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CheckboxQuestionComponent, decorators: [{
|
|
21214
21227
|
type: Component,
|
|
21215
|
-
args: [{ selector: 'app-checkbox-question', template: "<div class=\"question-block\">\r\n <div class=\"question-head vx-d-flex vx-mb-4\">\r\n <span class=\"count vx-paragraph-txt vx-fs-20 vx-fw-400\">{{questionIndex}}.</span>\r\n <span class=\"heading vx-pl-3\">\r\n <span class=\"vx-fw-300 vx-label-txt vx-fs-20\" [innerHTML]=\"question?.title=='' ? 'Question' : question?.title\"></span>\r\n <span class=\"required vx-fw-400 vx-txt-red vx-fs-24 vx-ml-2\" *ngIf=\"question?.isRequired\">*</span>\r\n </span>\r\n </div>\r\n <div class=\"question-details vx-fs-13 vx-paragraph-txt\" *ngIf=\"question?.hasDescription && question?.description.trim().length > 0 \" [innerHTML]=\"question?.description\"></div>\r\n <div class=\"question-options\">\r\n <ul class=\"vx-p-0 vx-m-0\">\r\n <li class=\"vx-mt-5 vx-pb-2\" *ngFor=\"let choice of choicesForPreviewMode; let choiceIndex = index\">\r\n <app-cs-checkbox>\r\n <span class=\"checkbox-value vx-fs-14 vx-paragraph-txt vx-fw-400 \" [appTooltip]=\"choice?.title\" placement=\"bottom-left\" delay=\"0\" type=\"black\" [tooltipMandatory]=\"false\">{{choice?.title ? choice?.title: 'Option' }}</span>\r\n </app-cs-checkbox>\r\n </li>\r\n <li class=\"vx-mt-5 vx-pb-2\" *ngIf=\"question?.hasOther\">\r\n <app-cs-checkbox>\r\n <span class=\"checkbox-value vx-fs-14 vx-paragraph-txt vx-fw-400 \" [appTooltip]=\"question.otherValue\" placement=\"bottom-left\" delay=\"0\" type=\"black\" [tooltipMandatory]=\"false\">{{question.otherValue}}</span>\r\n </app-cs-checkbox>\r\n </li>\r\n </ul>\r\n </div>\r\n <div class=\"question-quick-settings\">\r\n <app-quick-settings [question]=\"question\"></app-quick-settings>\r\n </div>\r\n</div>\r\n", styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";::ng-deep .question-block{position:relative;margin-bottom:3rem}::ng-deep .question-head{padding-right:4rem}::ng-deep .question-head .count{min-width:1.5rem}::ng-deep .question-head .heading .required{position:relative;top:-.25rem}::ng-deep .question-details{padding-right:4rem;padding-left:2.5rem}::ng-deep .question-options{margin-left:2.5rem;margin-top:1.875rem}::ng-deep .question-options ul{list-style-type:none}::ng-deep .question-options ul li app-cs-checkbox .checkbox-item{width:100%!important;position:relative;padding-left:2rem}::ng-deep .question-options ul li app-cs-checkbox .checkbox-item .checkbox,::ng-deep .question-options ul li app-cs-checkbox .checkbox-item .checkmark{min-width:1.375rem!important;width:1.375rem!important;height:1.375rem!important;position:absolute!important;left:0!important}::ng-deep .question-options ul li app-cs-checkbox .checkbox-item .value{width:100%!important;margin:0!important;justify-content:start!important}::ng-deep .question-options ul li app-cs-checkbox .checkbox-item .value .checkbox-value{text-overflow:ellipsis;white-space:nowrap;overflow:hidden;width:90%}::ng-deep .question-quick-settings{position:absolute;top:-.25rem;right:-
|
|
21228
|
+
args: [{ selector: 'app-checkbox-question', template: "<div class=\"question-block\">\r\n <div class=\"question-head vx-d-flex vx-mb-4\">\r\n <span class=\"count vx-paragraph-txt vx-fs-20 vx-fw-400\">{{questionIndex}}.</span>\r\n <span class=\"heading vx-pl-3\">\r\n <span class=\"vx-fw-300 vx-label-txt vx-fs-20\" [innerHTML]=\"question?.title=='' ? 'Question' : question?.title\"></span>\r\n <span class=\"required vx-fw-400 vx-txt-red vx-fs-24 vx-ml-2\" *ngIf=\"question?.isRequired\">*</span>\r\n </span>\r\n </div>\r\n <div class=\"question-details vx-fs-13 vx-paragraph-txt\" *ngIf=\"question?.hasDescription && question?.description.trim().length > 0 \" [innerHTML]=\"question?.description\"></div>\r\n <div class=\"question-options\">\r\n <ul class=\"vx-p-0 vx-m-0\">\r\n <li class=\"vx-mt-5 vx-pb-2\" *ngFor=\"let choice of choicesForPreviewMode; let choiceIndex = index\">\r\n <app-cs-checkbox>\r\n <span class=\"checkbox-value vx-fs-14 vx-paragraph-txt vx-fw-400 \" [appTooltip]=\"choice?.title\" placement=\"bottom-left\" delay=\"0\" type=\"black\" [tooltipMandatory]=\"false\">{{choice?.title ? choice?.title: 'Option' }}</span>\r\n </app-cs-checkbox>\r\n </li>\r\n <li class=\"vx-mt-5 vx-pb-2\" *ngIf=\"question?.hasOther\">\r\n <app-cs-checkbox>\r\n <span class=\"checkbox-value vx-fs-14 vx-paragraph-txt vx-fw-400 \" [appTooltip]=\"question.otherValue\" placement=\"bottom-left\" delay=\"0\" type=\"black\" [tooltipMandatory]=\"false\">{{question.otherValue}}</span>\r\n </app-cs-checkbox>\r\n </li>\r\n </ul>\r\n </div>\r\n <div class=\"question-quick-settings\">\r\n <app-quick-settings [question]=\"question\"></app-quick-settings>\r\n </div>\r\n</div>\r\n", styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";::ng-deep .question-block{position:relative;margin-bottom:3rem}::ng-deep .question-head{padding-right:4rem}::ng-deep .question-head .count{min-width:1.5rem}::ng-deep .question-head .heading .required{position:relative;top:-.25rem}::ng-deep .question-details{padding-right:4rem;padding-left:2.5rem}::ng-deep .question-options{margin-left:2.5rem;margin-top:1.875rem}::ng-deep .question-options ul{list-style-type:none}::ng-deep .question-options ul li app-cs-checkbox .checkbox-item{width:100%!important;position:relative;padding-left:2rem}::ng-deep .question-options ul li app-cs-checkbox .checkbox-item .checkbox,::ng-deep .question-options ul li app-cs-checkbox .checkbox-item .checkmark{min-width:1.375rem!important;width:1.375rem!important;height:1.375rem!important;position:absolute!important;left:0!important}::ng-deep .question-options ul li app-cs-checkbox .checkbox-item .value{width:100%!important;margin:0!important;justify-content:start!important}::ng-deep .question-options ul li app-cs-checkbox .checkbox-item .value .checkbox-value{text-overflow:ellipsis;white-space:nowrap;overflow:hidden;width:90%}::ng-deep .question-quick-settings{position:absolute;top:-.25rem;right:-3.75rem}\n"] }]
|
|
21216
21229
|
}], ctorParameters: function () { return []; }, propDecorators: { question: [{
|
|
21217
21230
|
type: Input
|
|
21218
21231
|
}], questionIndex: [{
|
|
@@ -21237,10 +21250,10 @@ class DateTimeComponent {
|
|
|
21237
21250
|
}
|
|
21238
21251
|
}
|
|
21239
21252
|
DateTimeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: DateTimeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
21240
|
-
DateTimeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: DateTimeComponent, selector: "app-date-time", inputs: { question: "question", questionIndex: "questionIndex" }, viewQueries: [{ propertyName: "datePicker", first: true, predicate: ["datePicker"], descendants: true }], ngImport: i0, template: "<div class=\"question-block\">\r\n <div class=\"question-head vx-d-flex vx-mb-4\">\r\n <span class=\"count vx-paragraph-txt vx-fs-20 vx-fw-400\">{{questionIndex}}.</span>\r\n <span class=\"heading vx-pl-3\">\r\n <span class=\"vx-fw-300 vx-label-txt vx-fs-20\" [innerHTML]=\"question?.title=='' ? 'Question' : question?.title\"></span>\r\n <span class=\"required vx-fw-400 vx-txt-red vx-fs-24 vx-ml-2\" *ngIf=\"question?.isRequired\">*</span>\r\n </span>\r\n </div>\r\n <div class=\"question-details vx-fs-13 vx-paragraph-txt\" *ngIf=\"question?.hasDescription && question?.description?.trim().length > 0 \" [innerHTML]=\"question?.description\"></div>\r\n <div class=\"question-options\">\r\n <div class=\"textbox-group vx-mt-5\">\r\n <div class=\"input-group vx-d-flex vx-mb-2\" *ngIf=\"question?.hasDate\">\r\n <span class=\"label vx-bg-grey vx-label-txt vx-lh-24 vx-d-flex vx-tt-uppercase vx-fs-11 vx-text-center vx-p-2 vx-justify-center vx-align-center\"><span class=\"vx-d-block\" [appTooltip]=\"question?.date?.title==''?'Date Label':question?.date?.title\" placement=\"bottom-left\" delay=\"0\" type=\"black\" [tooltipMandatory]=\"false\">{{question?.date?.title==''?'Date Label':question?.date?.title}}</span></span>\r\n <div class=\"date-time-area\">\r\n <i class=\"icons vx-fs-14 vx-paragraph-txt\"></i>\r\n <input class=\"datePicker\" (click)=\"openDatePicker()\" placeholder=\"Select Date\">\r\n <dp-date-picker #datePicker placeholder=\"Select Date\" (click)=\"openDatePicker()\" (click)=\"closeDatepicker()\"></dp-date-picker>\r\n <div class=\"overlay\" (click)=\"closeDatepicker()\" *ngIf=\"datepickerOverlay\"></div>\r\n </div>\r\n </div>\r\n <div class=\"input-group vx-d-flex vx-mb-10\" *ngIf=\"question?.hasTime\">\r\n <span class=\"label vx-bg-grey vx-label-txt vx-lh-24 vx-d-flex vx-tt-uppercase vx-fs-11 vx-text-center vx-p-2 vx-justify-center vx-align-center\"><span class=\"vx-d-block\" [appTooltip]=\"question?.time?.title==''?'Time Label':question?.time?.title\" placement=\"bottom-left\" delay=\"0\" type=\"black\" [tooltipMandatory]=\"false\">{{question?.time?.title==''?'Time Label':question?.time?.title}}</span></span>\r\n <div class=\"date-time-area\">\r\n <input aria-label=\"12hr format\" [ngxTimepicker]=\"timeOnly\" readonly placeholder=\"Select Time\" />\r\n <i class=\"icons vx-fs-14 vx-paragraph-txt\"></i>\r\n <ngx-material-timepicker #timeOnly></ngx-material-timepicker>\r\n </div>\r\n </div>\r\n \r\n </div>\r\n </div>\r\n <div class=\"question-quick-settings\">\r\n <app-quick-settings [question]=\"question\"></app-quick-settings>\r\n </div>\r\n</div>", styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";::ng-deep .question-block{position:relative;margin-bottom:3rem}::ng-deep .question-head{padding-right:4rem}::ng-deep .question-head .count{min-width:1.5rem}::ng-deep .question-head .heading .required{position:relative;top:-.25rem}::ng-deep .question-details{padding-right:4rem;padding-left:2.5rem}::ng-deep .question-options{margin-left:2.5rem;margin-top:1.875rem}::ng-deep .question-options .textbox-group{display:block;max-width:31.25rem}::ng-deep .question-options .textbox-group .input-group{border:1px solid #F1F1F1;border-radius:.25rem;position:relative}::ng-deep .question-options .textbox-group .input-group .label{width:5.875rem}::ng-deep .question-options .textbox-group .input-group .label span{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}::ng-deep .question-options .textbox-group .input-group .date-time-area{width:calc(100% - 5.875rem);height:2.5rem;position:relative}::ng-deep .question-options .textbox-group .input-group .date-time-area input{background:transparent;border:none;border-radius:0;width:100%;height:100%;outline:none;cursor:pointer;margin:0;padding:8px;position:relative;z-index:1}::ng-deep .question-options .textbox-group .input-group .date-time-area input.datePicker{opacity:0}::ng-deep .question-options .textbox-group .input-group .date-time-area i{position:absolute;top:.75rem;right:.5rem}::ng-deep .question-options .textbox-group .input-group .date-time-area .overlay{z-index:2}::ng-deep .question-options .textbox-group .input-group .date-time-area dp-date-picker .dp-input-container input{top:-2.25rem;z-index:-1}::ng-deep .question-quick-settings{position:absolute;top:-.25rem;right:-2.25rem}::ng-deep dp-date-picker .dp-popup{width:412px;box-shadow:0 0 20px #161b2f26;background-color:#fff;border-radius:4px;animation:scale-up-center .2s cubic-bezier(.39,.575,.565,1) both}::ng-deep dp-date-picker .dp-popup dp-day-calendar,::ng-deep dp-date-picker .dp-popup dp-month-calendar{width:100%;pointer-events:auto}::ng-deep dp-date-picker .dp-popup dp-day-calendar button,::ng-deep dp-date-picker .dp-popup dp-month-calendar button{background:transparent;border:none;outline:none}::ng-deep dp-date-picker .dp-popup dp-day-calendar button.dp-current-location-btn,::ng-deep dp-date-picker .dp-popup dp-month-calendar button.dp-current-location-btn,::ng-deep dp-date-picker .dp-popup dp-day-calendar button.dp-calendar-nav-left,::ng-deep dp-date-picker .dp-popup dp-month-calendar button.dp-calendar-nav-left,::ng-deep dp-date-picker .dp-popup dp-day-calendar button.dp-calendar-nav-right,::ng-deep dp-date-picker .dp-popup dp-month-calendar button.dp-calendar-nav-right{width:40px;height:40px;display:flex;justify-content:center;align-items:center;border-radius:50%;font-size:14px}::ng-deep dp-date-picker .dp-popup dp-day-calendar button.dp-current-location-btn:hover,::ng-deep dp-date-picker .dp-popup dp-month-calendar button.dp-current-location-btn:hover,::ng-deep dp-date-picker .dp-popup dp-day-calendar button.dp-calendar-nav-left:hover,::ng-deep dp-date-picker .dp-popup dp-month-calendar button.dp-calendar-nav-left:hover,::ng-deep dp-date-picker .dp-popup dp-day-calendar button.dp-calendar-nav-right:hover,::ng-deep dp-date-picker .dp-popup dp-month-calendar button.dp-calendar-nav-right:hover{background-color:#f3f3f3}::ng-deep dp-date-picker .dp-popup dp-day-calendar button.dp-current-location-btn,::ng-deep dp-date-picker .dp-popup dp-month-calendar button.dp-current-location-btn{display:none}::ng-deep dp-date-picker .dp-popup dp-day-calendar button.dp-current-location-btn:before,::ng-deep dp-date-picker .dp-popup dp-month-calendar button.dp-current-location-btn:before{content:\"\";height:10px;width:10px;border-radius:50%;background:#000000;display:inline-flex}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-weekdays,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-weekdays,::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-calendar-week,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-calendar-week{display:flex;justify-content:space-around}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-weekdays .dp-calendar-weekday,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-weekdays .dp-calendar-weekday,::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-calendar-week .dp-calendar-weekday,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-calendar-week .dp-calendar-weekday{width:52px;border-left:none;border-bottom-color:#fff;color:#747576;font-size:11px;font-weight:600;text-transform:uppercase}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-weekdays button,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-weekdays button,::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-calendar-week button,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-calendar-week button{width:40px;height:40px;border-radius:50%;display:inline-flex;justify-content:center;align-items:center}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-weekdays button:hover,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-weekdays button:hover,::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-calendar-week button:hover,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-calendar-week button:hover{background-color:#f3f3f3}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-weekdays button.dp-selected,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-weekdays button.dp-selected,::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-calendar-week button.dp-selected,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-calendar-week button.dp-selected{background:#1e5dd3}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-weekdays button.dp-current-day,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-weekdays button.dp-current-day,::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-calendar-week button.dp-current-day,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-calendar-week button.dp-current-day{border:1px solid rgba(0,0,0,.38);color:#1e5dd3;background-color:#fff}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-day-calendar-container,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-day-calendar-container{padding:20px;border-radius:2px}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-calendar-nav-container,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-calendar-nav-container{display:flex;margin:0 0 20px;border:none}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-calendar-nav-container .dp-nav-header button,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-calendar-nav-container .dp-nav-header button{color:#000;font-size:17px;font-weight:500;margin:0 0 0 12px;padding:0}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-nav-btns-container,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-nav-btns-container{width:80px;display:flex}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-nav-btns-container .dp-calendar-nav-container-left button,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-nav-btns-container .dp-calendar-nav-container-left button,::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-nav-btns-container .dp-calendar-nav-container-right button,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-nav-btns-container .dp-calendar-nav-container-right button{margin:0!important}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-calendar-wrapper,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-calendar-wrapper{border:none}::ng-deep dp-date-picker .dp-open+div{position:fixed!important;inset:0!important;display:flex;justify-content:center;align-items:center;z-index:99;pointer-events:none;background:rgba(0,0,0,.3)}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: ToolTipDirective, selector: "[appTooltip]", inputs: ["appTooltip", "placement", "type", "tooltipMandatory", "showTooltip", "animate"] }, { kind: "component", type: i4$1.NgxMaterialTimepickerComponent, selector: "ngx-material-timepicker", inputs: ["ESC", "hoursOnly", "ngxMaterialTimepickerTheme", "format", "minutesGap", "cancelBtnTmpl", "editableHintTmpl", "confirmBtnTmpl", "enableKeyboardInput", "preventOverlayClick", "disableAnimation", "appendToInput", "defaultTime", "timepickerClass", "theme", "min", "max"], outputs: ["timeSet", "opened", "closed", "hourSelected", "timeChanged"] }, { kind: "directive", type: i4$1.TimepickerDirective, selector: "[ngxTimepicker]", inputs: ["format", "value", "min", "max", "ngxTimepicker", "disabled", "disableClick"] }, { kind: "component", type: i4.DatePickerComponent, selector: "dp-date-picker", inputs: ["mode", "placeholder", "disabled", "config", "displayDate", "theme", "minDate", "maxDate", "minTime", "maxTime"], outputs: ["open", "close", "onChange", "onGoToCurrent", "onLeftNav", "onRightNav", "onSelect"] }, { kind: "component", type: QuickSettingsComponent, selector: "app-quick-settings", inputs: ["question"] }] });
|
|
21253
|
+
DateTimeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: DateTimeComponent, selector: "app-date-time", inputs: { question: "question", questionIndex: "questionIndex" }, viewQueries: [{ propertyName: "datePicker", first: true, predicate: ["datePicker"], descendants: true }], ngImport: i0, template: "<div class=\"question-block\">\r\n <div class=\"question-head vx-d-flex vx-mb-4\">\r\n <span class=\"count vx-paragraph-txt vx-fs-20 vx-fw-400\">{{questionIndex}}.</span>\r\n <span class=\"heading vx-pl-3\">\r\n <span class=\"vx-fw-300 vx-label-txt vx-fs-20\" [innerHTML]=\"question?.title=='' ? 'Question' : question?.title\"></span>\r\n <span class=\"required vx-fw-400 vx-txt-red vx-fs-24 vx-ml-2\" *ngIf=\"question?.isRequired\">*</span>\r\n </span>\r\n </div>\r\n <div class=\"question-details vx-fs-13 vx-paragraph-txt\" *ngIf=\"question?.hasDescription && question?.description?.trim().length > 0 \" [innerHTML]=\"question?.description\"></div>\r\n <div class=\"question-options\">\r\n <div class=\"textbox-group vx-mt-5\">\r\n <div class=\"input-group vx-d-flex vx-mb-2\" *ngIf=\"question?.hasDate\">\r\n <span class=\"label vx-bg-grey vx-label-txt vx-lh-24 vx-d-flex vx-tt-uppercase vx-fs-11 vx-text-center vx-p-2 vx-justify-center vx-align-center\"><span class=\"vx-d-block\" [appTooltip]=\"question?.date?.title==''?'Date Label':question?.date?.title\" placement=\"bottom-left\" delay=\"0\" type=\"black\" [tooltipMandatory]=\"false\">{{question?.date?.title==''?'Date Label':question?.date?.title}}</span></span>\r\n <div class=\"date-time-area\">\r\n <i class=\"icons vx-fs-14 vx-paragraph-txt\"></i>\r\n <input class=\"datePicker\" (click)=\"openDatePicker()\" placeholder=\"Select Date\">\r\n <dp-date-picker #datePicker placeholder=\"Select Date\" (click)=\"openDatePicker()\" (click)=\"closeDatepicker()\"></dp-date-picker>\r\n <div class=\"overlay\" (click)=\"closeDatepicker()\" *ngIf=\"datepickerOverlay\"></div>\r\n </div>\r\n </div>\r\n <div class=\"input-group vx-d-flex vx-mb-10\" *ngIf=\"question?.hasTime\">\r\n <span class=\"label vx-bg-grey vx-label-txt vx-lh-24 vx-d-flex vx-tt-uppercase vx-fs-11 vx-text-center vx-p-2 vx-justify-center vx-align-center\"><span class=\"vx-d-block\" [appTooltip]=\"question?.time?.title==''?'Time Label':question?.time?.title\" placement=\"bottom-left\" delay=\"0\" type=\"black\" [tooltipMandatory]=\"false\">{{question?.time?.title==''?'Time Label':question?.time?.title}}</span></span>\r\n <div class=\"date-time-area\">\r\n <input aria-label=\"12hr format\" [ngxTimepicker]=\"timeOnly\" readonly placeholder=\"Select Time\" />\r\n <i class=\"icons vx-fs-14 vx-paragraph-txt\"></i>\r\n <ngx-material-timepicker #timeOnly></ngx-material-timepicker>\r\n </div>\r\n </div>\r\n \r\n </div>\r\n </div>\r\n <div class=\"question-quick-settings\">\r\n <app-quick-settings [question]=\"question\"></app-quick-settings>\r\n </div>\r\n</div>", styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";::ng-deep .question-block{position:relative;margin-bottom:3rem}::ng-deep .question-head{padding-right:4rem}::ng-deep .question-head .count{min-width:1.5rem}::ng-deep .question-head .heading .required{position:relative;top:-.25rem}::ng-deep .question-details{padding-right:4rem;padding-left:2.5rem}::ng-deep .question-options{margin-left:2.5rem;margin-top:1.875rem}::ng-deep .question-options .textbox-group{display:block;max-width:31.25rem}::ng-deep .question-options .textbox-group .input-group{border:1px solid #F1F1F1;border-radius:.25rem;position:relative}::ng-deep .question-options .textbox-group .input-group .label{width:5.875rem}::ng-deep .question-options .textbox-group .input-group .label span{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}::ng-deep .question-options .textbox-group .input-group .date-time-area{width:calc(100% - 5.875rem);height:2.5rem;position:relative}::ng-deep .question-options .textbox-group .input-group .date-time-area input{background:transparent;border:none;border-radius:0;width:100%;height:100%;outline:none;cursor:pointer;margin:0;padding:8px;position:relative;z-index:1}::ng-deep .question-options .textbox-group .input-group .date-time-area input.datePicker{opacity:0}::ng-deep .question-options .textbox-group .input-group .date-time-area i{position:absolute;top:.75rem;right:.5rem}::ng-deep .question-options .textbox-group .input-group .date-time-area .overlay{z-index:2}::ng-deep .question-options .textbox-group .input-group .date-time-area dp-date-picker .dp-input-container input{top:-2.25rem;z-index:-1}::ng-deep .question-quick-settings{position:absolute;top:-.25rem;right:-3.75rem}::ng-deep dp-date-picker .dp-popup{width:412px;box-shadow:0 0 20px #161b2f26;background-color:#fff;border-radius:4px;animation:scale-up-center .2s cubic-bezier(.39,.575,.565,1) both}::ng-deep dp-date-picker .dp-popup dp-day-calendar,::ng-deep dp-date-picker .dp-popup dp-month-calendar{width:100%;pointer-events:auto}::ng-deep dp-date-picker .dp-popup dp-day-calendar button,::ng-deep dp-date-picker .dp-popup dp-month-calendar button{background:transparent;border:none;outline:none}::ng-deep dp-date-picker .dp-popup dp-day-calendar button.dp-current-location-btn,::ng-deep dp-date-picker .dp-popup dp-month-calendar button.dp-current-location-btn,::ng-deep dp-date-picker .dp-popup dp-day-calendar button.dp-calendar-nav-left,::ng-deep dp-date-picker .dp-popup dp-month-calendar button.dp-calendar-nav-left,::ng-deep dp-date-picker .dp-popup dp-day-calendar button.dp-calendar-nav-right,::ng-deep dp-date-picker .dp-popup dp-month-calendar button.dp-calendar-nav-right{width:40px;height:40px;display:flex;justify-content:center;align-items:center;border-radius:50%;font-size:14px}::ng-deep dp-date-picker .dp-popup dp-day-calendar button.dp-current-location-btn:hover,::ng-deep dp-date-picker .dp-popup dp-month-calendar button.dp-current-location-btn:hover,::ng-deep dp-date-picker .dp-popup dp-day-calendar button.dp-calendar-nav-left:hover,::ng-deep dp-date-picker .dp-popup dp-month-calendar button.dp-calendar-nav-left:hover,::ng-deep dp-date-picker .dp-popup dp-day-calendar button.dp-calendar-nav-right:hover,::ng-deep dp-date-picker .dp-popup dp-month-calendar button.dp-calendar-nav-right:hover{background-color:#f3f3f3}::ng-deep dp-date-picker .dp-popup dp-day-calendar button.dp-current-location-btn,::ng-deep dp-date-picker .dp-popup dp-month-calendar button.dp-current-location-btn{display:none}::ng-deep dp-date-picker .dp-popup dp-day-calendar button.dp-current-location-btn:before,::ng-deep dp-date-picker .dp-popup dp-month-calendar button.dp-current-location-btn:before{content:\"\";height:10px;width:10px;border-radius:50%;background:#000000;display:inline-flex}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-weekdays,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-weekdays,::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-calendar-week,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-calendar-week{display:flex;justify-content:space-around}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-weekdays .dp-calendar-weekday,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-weekdays .dp-calendar-weekday,::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-calendar-week .dp-calendar-weekday,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-calendar-week .dp-calendar-weekday{width:52px;border-left:none;border-bottom-color:#fff;color:#747576;font-size:11px;font-weight:600;text-transform:uppercase}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-weekdays button,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-weekdays button,::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-calendar-week button,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-calendar-week button{width:40px;height:40px;border-radius:50%;display:inline-flex;justify-content:center;align-items:center}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-weekdays button:hover,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-weekdays button:hover,::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-calendar-week button:hover,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-calendar-week button:hover{background-color:#f3f3f3}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-weekdays button.dp-selected,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-weekdays button.dp-selected,::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-calendar-week button.dp-selected,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-calendar-week button.dp-selected{background:#1e5dd3}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-weekdays button.dp-current-day,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-weekdays button.dp-current-day,::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-calendar-week button.dp-current-day,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-calendar-week button.dp-current-day{border:1px solid rgba(0,0,0,.38);color:#1e5dd3;background-color:#fff}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-day-calendar-container,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-day-calendar-container{padding:20px;border-radius:2px}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-calendar-nav-container,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-calendar-nav-container{display:flex;margin:0 0 20px;border:none}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-calendar-nav-container .dp-nav-header button,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-calendar-nav-container .dp-nav-header button{color:#000;font-size:17px;font-weight:500;margin:0 0 0 12px;padding:0}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-nav-btns-container,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-nav-btns-container{width:80px;display:flex}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-nav-btns-container .dp-calendar-nav-container-left button,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-nav-btns-container .dp-calendar-nav-container-left button,::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-nav-btns-container .dp-calendar-nav-container-right button,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-nav-btns-container .dp-calendar-nav-container-right button{margin:0!important}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-calendar-wrapper,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-calendar-wrapper{border:none}::ng-deep dp-date-picker .dp-open+div{position:fixed!important;inset:0!important;display:flex;justify-content:center;align-items:center;z-index:99;pointer-events:none;background:rgba(0,0,0,.3)}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: ToolTipDirective, selector: "[appTooltip]", inputs: ["appTooltip", "placement", "type", "tooltipMandatory", "showTooltip", "animate"] }, { kind: "component", type: i4$1.NgxMaterialTimepickerComponent, selector: "ngx-material-timepicker", inputs: ["ESC", "hoursOnly", "ngxMaterialTimepickerTheme", "format", "minutesGap", "cancelBtnTmpl", "editableHintTmpl", "confirmBtnTmpl", "enableKeyboardInput", "preventOverlayClick", "disableAnimation", "appendToInput", "defaultTime", "timepickerClass", "theme", "min", "max"], outputs: ["timeSet", "opened", "closed", "hourSelected", "timeChanged"] }, { kind: "directive", type: i4$1.TimepickerDirective, selector: "[ngxTimepicker]", inputs: ["format", "value", "min", "max", "ngxTimepicker", "disabled", "disableClick"] }, { kind: "component", type: i4.DatePickerComponent, selector: "dp-date-picker", inputs: ["mode", "placeholder", "disabled", "config", "displayDate", "theme", "minDate", "maxDate", "minTime", "maxTime"], outputs: ["open", "close", "onChange", "onGoToCurrent", "onLeftNav", "onRightNav", "onSelect"] }, { kind: "component", type: QuickSettingsComponent$1, selector: "app-quick-settings", inputs: ["question"] }] });
|
|
21241
21254
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: DateTimeComponent, decorators: [{
|
|
21242
21255
|
type: Component,
|
|
21243
|
-
args: [{ selector: 'app-date-time', template: "<div class=\"question-block\">\r\n <div class=\"question-head vx-d-flex vx-mb-4\">\r\n <span class=\"count vx-paragraph-txt vx-fs-20 vx-fw-400\">{{questionIndex}}.</span>\r\n <span class=\"heading vx-pl-3\">\r\n <span class=\"vx-fw-300 vx-label-txt vx-fs-20\" [innerHTML]=\"question?.title=='' ? 'Question' : question?.title\"></span>\r\n <span class=\"required vx-fw-400 vx-txt-red vx-fs-24 vx-ml-2\" *ngIf=\"question?.isRequired\">*</span>\r\n </span>\r\n </div>\r\n <div class=\"question-details vx-fs-13 vx-paragraph-txt\" *ngIf=\"question?.hasDescription && question?.description?.trim().length > 0 \" [innerHTML]=\"question?.description\"></div>\r\n <div class=\"question-options\">\r\n <div class=\"textbox-group vx-mt-5\">\r\n <div class=\"input-group vx-d-flex vx-mb-2\" *ngIf=\"question?.hasDate\">\r\n <span class=\"label vx-bg-grey vx-label-txt vx-lh-24 vx-d-flex vx-tt-uppercase vx-fs-11 vx-text-center vx-p-2 vx-justify-center vx-align-center\"><span class=\"vx-d-block\" [appTooltip]=\"question?.date?.title==''?'Date Label':question?.date?.title\" placement=\"bottom-left\" delay=\"0\" type=\"black\" [tooltipMandatory]=\"false\">{{question?.date?.title==''?'Date Label':question?.date?.title}}</span></span>\r\n <div class=\"date-time-area\">\r\n <i class=\"icons vx-fs-14 vx-paragraph-txt\"></i>\r\n <input class=\"datePicker\" (click)=\"openDatePicker()\" placeholder=\"Select Date\">\r\n <dp-date-picker #datePicker placeholder=\"Select Date\" (click)=\"openDatePicker()\" (click)=\"closeDatepicker()\"></dp-date-picker>\r\n <div class=\"overlay\" (click)=\"closeDatepicker()\" *ngIf=\"datepickerOverlay\"></div>\r\n </div>\r\n </div>\r\n <div class=\"input-group vx-d-flex vx-mb-10\" *ngIf=\"question?.hasTime\">\r\n <span class=\"label vx-bg-grey vx-label-txt vx-lh-24 vx-d-flex vx-tt-uppercase vx-fs-11 vx-text-center vx-p-2 vx-justify-center vx-align-center\"><span class=\"vx-d-block\" [appTooltip]=\"question?.time?.title==''?'Time Label':question?.time?.title\" placement=\"bottom-left\" delay=\"0\" type=\"black\" [tooltipMandatory]=\"false\">{{question?.time?.title==''?'Time Label':question?.time?.title}}</span></span>\r\n <div class=\"date-time-area\">\r\n <input aria-label=\"12hr format\" [ngxTimepicker]=\"timeOnly\" readonly placeholder=\"Select Time\" />\r\n <i class=\"icons vx-fs-14 vx-paragraph-txt\"></i>\r\n <ngx-material-timepicker #timeOnly></ngx-material-timepicker>\r\n </div>\r\n </div>\r\n \r\n </div>\r\n </div>\r\n <div class=\"question-quick-settings\">\r\n <app-quick-settings [question]=\"question\"></app-quick-settings>\r\n </div>\r\n</div>", styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";::ng-deep .question-block{position:relative;margin-bottom:3rem}::ng-deep .question-head{padding-right:4rem}::ng-deep .question-head .count{min-width:1.5rem}::ng-deep .question-head .heading .required{position:relative;top:-.25rem}::ng-deep .question-details{padding-right:4rem;padding-left:2.5rem}::ng-deep .question-options{margin-left:2.5rem;margin-top:1.875rem}::ng-deep .question-options .textbox-group{display:block;max-width:31.25rem}::ng-deep .question-options .textbox-group .input-group{border:1px solid #F1F1F1;border-radius:.25rem;position:relative}::ng-deep .question-options .textbox-group .input-group .label{width:5.875rem}::ng-deep .question-options .textbox-group .input-group .label span{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}::ng-deep .question-options .textbox-group .input-group .date-time-area{width:calc(100% - 5.875rem);height:2.5rem;position:relative}::ng-deep .question-options .textbox-group .input-group .date-time-area input{background:transparent;border:none;border-radius:0;width:100%;height:100%;outline:none;cursor:pointer;margin:0;padding:8px;position:relative;z-index:1}::ng-deep .question-options .textbox-group .input-group .date-time-area input.datePicker{opacity:0}::ng-deep .question-options .textbox-group .input-group .date-time-area i{position:absolute;top:.75rem;right:.5rem}::ng-deep .question-options .textbox-group .input-group .date-time-area .overlay{z-index:2}::ng-deep .question-options .textbox-group .input-group .date-time-area dp-date-picker .dp-input-container input{top:-2.25rem;z-index:-1}::ng-deep .question-quick-settings{position:absolute;top:-.25rem;right:-2.25rem}::ng-deep dp-date-picker .dp-popup{width:412px;box-shadow:0 0 20px #161b2f26;background-color:#fff;border-radius:4px;animation:scale-up-center .2s cubic-bezier(.39,.575,.565,1) both}::ng-deep dp-date-picker .dp-popup dp-day-calendar,::ng-deep dp-date-picker .dp-popup dp-month-calendar{width:100%;pointer-events:auto}::ng-deep dp-date-picker .dp-popup dp-day-calendar button,::ng-deep dp-date-picker .dp-popup dp-month-calendar button{background:transparent;border:none;outline:none}::ng-deep dp-date-picker .dp-popup dp-day-calendar button.dp-current-location-btn,::ng-deep dp-date-picker .dp-popup dp-month-calendar button.dp-current-location-btn,::ng-deep dp-date-picker .dp-popup dp-day-calendar button.dp-calendar-nav-left,::ng-deep dp-date-picker .dp-popup dp-month-calendar button.dp-calendar-nav-left,::ng-deep dp-date-picker .dp-popup dp-day-calendar button.dp-calendar-nav-right,::ng-deep dp-date-picker .dp-popup dp-month-calendar button.dp-calendar-nav-right{width:40px;height:40px;display:flex;justify-content:center;align-items:center;border-radius:50%;font-size:14px}::ng-deep dp-date-picker .dp-popup dp-day-calendar button.dp-current-location-btn:hover,::ng-deep dp-date-picker .dp-popup dp-month-calendar button.dp-current-location-btn:hover,::ng-deep dp-date-picker .dp-popup dp-day-calendar button.dp-calendar-nav-left:hover,::ng-deep dp-date-picker .dp-popup dp-month-calendar button.dp-calendar-nav-left:hover,::ng-deep dp-date-picker .dp-popup dp-day-calendar button.dp-calendar-nav-right:hover,::ng-deep dp-date-picker .dp-popup dp-month-calendar button.dp-calendar-nav-right:hover{background-color:#f3f3f3}::ng-deep dp-date-picker .dp-popup dp-day-calendar button.dp-current-location-btn,::ng-deep dp-date-picker .dp-popup dp-month-calendar button.dp-current-location-btn{display:none}::ng-deep dp-date-picker .dp-popup dp-day-calendar button.dp-current-location-btn:before,::ng-deep dp-date-picker .dp-popup dp-month-calendar button.dp-current-location-btn:before{content:\"\";height:10px;width:10px;border-radius:50%;background:#000000;display:inline-flex}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-weekdays,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-weekdays,::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-calendar-week,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-calendar-week{display:flex;justify-content:space-around}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-weekdays .dp-calendar-weekday,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-weekdays .dp-calendar-weekday,::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-calendar-week .dp-calendar-weekday,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-calendar-week .dp-calendar-weekday{width:52px;border-left:none;border-bottom-color:#fff;color:#747576;font-size:11px;font-weight:600;text-transform:uppercase}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-weekdays button,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-weekdays button,::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-calendar-week button,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-calendar-week button{width:40px;height:40px;border-radius:50%;display:inline-flex;justify-content:center;align-items:center}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-weekdays button:hover,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-weekdays button:hover,::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-calendar-week button:hover,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-calendar-week button:hover{background-color:#f3f3f3}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-weekdays button.dp-selected,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-weekdays button.dp-selected,::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-calendar-week button.dp-selected,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-calendar-week button.dp-selected{background:#1e5dd3}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-weekdays button.dp-current-day,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-weekdays button.dp-current-day,::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-calendar-week button.dp-current-day,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-calendar-week button.dp-current-day{border:1px solid rgba(0,0,0,.38);color:#1e5dd3;background-color:#fff}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-day-calendar-container,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-day-calendar-container{padding:20px;border-radius:2px}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-calendar-nav-container,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-calendar-nav-container{display:flex;margin:0 0 20px;border:none}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-calendar-nav-container .dp-nav-header button,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-calendar-nav-container .dp-nav-header button{color:#000;font-size:17px;font-weight:500;margin:0 0 0 12px;padding:0}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-nav-btns-container,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-nav-btns-container{width:80px;display:flex}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-nav-btns-container .dp-calendar-nav-container-left button,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-nav-btns-container .dp-calendar-nav-container-left button,::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-nav-btns-container .dp-calendar-nav-container-right button,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-nav-btns-container .dp-calendar-nav-container-right button{margin:0!important}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-calendar-wrapper,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-calendar-wrapper{border:none}::ng-deep dp-date-picker .dp-open+div{position:fixed!important;inset:0!important;display:flex;justify-content:center;align-items:center;z-index:99;pointer-events:none;background:rgba(0,0,0,.3)}\n"] }]
|
|
21256
|
+
args: [{ selector: 'app-date-time', template: "<div class=\"question-block\">\r\n <div class=\"question-head vx-d-flex vx-mb-4\">\r\n <span class=\"count vx-paragraph-txt vx-fs-20 vx-fw-400\">{{questionIndex}}.</span>\r\n <span class=\"heading vx-pl-3\">\r\n <span class=\"vx-fw-300 vx-label-txt vx-fs-20\" [innerHTML]=\"question?.title=='' ? 'Question' : question?.title\"></span>\r\n <span class=\"required vx-fw-400 vx-txt-red vx-fs-24 vx-ml-2\" *ngIf=\"question?.isRequired\">*</span>\r\n </span>\r\n </div>\r\n <div class=\"question-details vx-fs-13 vx-paragraph-txt\" *ngIf=\"question?.hasDescription && question?.description?.trim().length > 0 \" [innerHTML]=\"question?.description\"></div>\r\n <div class=\"question-options\">\r\n <div class=\"textbox-group vx-mt-5\">\r\n <div class=\"input-group vx-d-flex vx-mb-2\" *ngIf=\"question?.hasDate\">\r\n <span class=\"label vx-bg-grey vx-label-txt vx-lh-24 vx-d-flex vx-tt-uppercase vx-fs-11 vx-text-center vx-p-2 vx-justify-center vx-align-center\"><span class=\"vx-d-block\" [appTooltip]=\"question?.date?.title==''?'Date Label':question?.date?.title\" placement=\"bottom-left\" delay=\"0\" type=\"black\" [tooltipMandatory]=\"false\">{{question?.date?.title==''?'Date Label':question?.date?.title}}</span></span>\r\n <div class=\"date-time-area\">\r\n <i class=\"icons vx-fs-14 vx-paragraph-txt\"></i>\r\n <input class=\"datePicker\" (click)=\"openDatePicker()\" placeholder=\"Select Date\">\r\n <dp-date-picker #datePicker placeholder=\"Select Date\" (click)=\"openDatePicker()\" (click)=\"closeDatepicker()\"></dp-date-picker>\r\n <div class=\"overlay\" (click)=\"closeDatepicker()\" *ngIf=\"datepickerOverlay\"></div>\r\n </div>\r\n </div>\r\n <div class=\"input-group vx-d-flex vx-mb-10\" *ngIf=\"question?.hasTime\">\r\n <span class=\"label vx-bg-grey vx-label-txt vx-lh-24 vx-d-flex vx-tt-uppercase vx-fs-11 vx-text-center vx-p-2 vx-justify-center vx-align-center\"><span class=\"vx-d-block\" [appTooltip]=\"question?.time?.title==''?'Time Label':question?.time?.title\" placement=\"bottom-left\" delay=\"0\" type=\"black\" [tooltipMandatory]=\"false\">{{question?.time?.title==''?'Time Label':question?.time?.title}}</span></span>\r\n <div class=\"date-time-area\">\r\n <input aria-label=\"12hr format\" [ngxTimepicker]=\"timeOnly\" readonly placeholder=\"Select Time\" />\r\n <i class=\"icons vx-fs-14 vx-paragraph-txt\"></i>\r\n <ngx-material-timepicker #timeOnly></ngx-material-timepicker>\r\n </div>\r\n </div>\r\n \r\n </div>\r\n </div>\r\n <div class=\"question-quick-settings\">\r\n <app-quick-settings [question]=\"question\"></app-quick-settings>\r\n </div>\r\n</div>", styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";::ng-deep .question-block{position:relative;margin-bottom:3rem}::ng-deep .question-head{padding-right:4rem}::ng-deep .question-head .count{min-width:1.5rem}::ng-deep .question-head .heading .required{position:relative;top:-.25rem}::ng-deep .question-details{padding-right:4rem;padding-left:2.5rem}::ng-deep .question-options{margin-left:2.5rem;margin-top:1.875rem}::ng-deep .question-options .textbox-group{display:block;max-width:31.25rem}::ng-deep .question-options .textbox-group .input-group{border:1px solid #F1F1F1;border-radius:.25rem;position:relative}::ng-deep .question-options .textbox-group .input-group .label{width:5.875rem}::ng-deep .question-options .textbox-group .input-group .label span{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}::ng-deep .question-options .textbox-group .input-group .date-time-area{width:calc(100% - 5.875rem);height:2.5rem;position:relative}::ng-deep .question-options .textbox-group .input-group .date-time-area input{background:transparent;border:none;border-radius:0;width:100%;height:100%;outline:none;cursor:pointer;margin:0;padding:8px;position:relative;z-index:1}::ng-deep .question-options .textbox-group .input-group .date-time-area input.datePicker{opacity:0}::ng-deep .question-options .textbox-group .input-group .date-time-area i{position:absolute;top:.75rem;right:.5rem}::ng-deep .question-options .textbox-group .input-group .date-time-area .overlay{z-index:2}::ng-deep .question-options .textbox-group .input-group .date-time-area dp-date-picker .dp-input-container input{top:-2.25rem;z-index:-1}::ng-deep .question-quick-settings{position:absolute;top:-.25rem;right:-3.75rem}::ng-deep dp-date-picker .dp-popup{width:412px;box-shadow:0 0 20px #161b2f26;background-color:#fff;border-radius:4px;animation:scale-up-center .2s cubic-bezier(.39,.575,.565,1) both}::ng-deep dp-date-picker .dp-popup dp-day-calendar,::ng-deep dp-date-picker .dp-popup dp-month-calendar{width:100%;pointer-events:auto}::ng-deep dp-date-picker .dp-popup dp-day-calendar button,::ng-deep dp-date-picker .dp-popup dp-month-calendar button{background:transparent;border:none;outline:none}::ng-deep dp-date-picker .dp-popup dp-day-calendar button.dp-current-location-btn,::ng-deep dp-date-picker .dp-popup dp-month-calendar button.dp-current-location-btn,::ng-deep dp-date-picker .dp-popup dp-day-calendar button.dp-calendar-nav-left,::ng-deep dp-date-picker .dp-popup dp-month-calendar button.dp-calendar-nav-left,::ng-deep dp-date-picker .dp-popup dp-day-calendar button.dp-calendar-nav-right,::ng-deep dp-date-picker .dp-popup dp-month-calendar button.dp-calendar-nav-right{width:40px;height:40px;display:flex;justify-content:center;align-items:center;border-radius:50%;font-size:14px}::ng-deep dp-date-picker .dp-popup dp-day-calendar button.dp-current-location-btn:hover,::ng-deep dp-date-picker .dp-popup dp-month-calendar button.dp-current-location-btn:hover,::ng-deep dp-date-picker .dp-popup dp-day-calendar button.dp-calendar-nav-left:hover,::ng-deep dp-date-picker .dp-popup dp-month-calendar button.dp-calendar-nav-left:hover,::ng-deep dp-date-picker .dp-popup dp-day-calendar button.dp-calendar-nav-right:hover,::ng-deep dp-date-picker .dp-popup dp-month-calendar button.dp-calendar-nav-right:hover{background-color:#f3f3f3}::ng-deep dp-date-picker .dp-popup dp-day-calendar button.dp-current-location-btn,::ng-deep dp-date-picker .dp-popup dp-month-calendar button.dp-current-location-btn{display:none}::ng-deep dp-date-picker .dp-popup dp-day-calendar button.dp-current-location-btn:before,::ng-deep dp-date-picker .dp-popup dp-month-calendar button.dp-current-location-btn:before{content:\"\";height:10px;width:10px;border-radius:50%;background:#000000;display:inline-flex}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-weekdays,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-weekdays,::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-calendar-week,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-calendar-week{display:flex;justify-content:space-around}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-weekdays .dp-calendar-weekday,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-weekdays .dp-calendar-weekday,::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-calendar-week .dp-calendar-weekday,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-calendar-week .dp-calendar-weekday{width:52px;border-left:none;border-bottom-color:#fff;color:#747576;font-size:11px;font-weight:600;text-transform:uppercase}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-weekdays button,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-weekdays button,::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-calendar-week button,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-calendar-week button{width:40px;height:40px;border-radius:50%;display:inline-flex;justify-content:center;align-items:center}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-weekdays button:hover,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-weekdays button:hover,::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-calendar-week button:hover,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-calendar-week button:hover{background-color:#f3f3f3}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-weekdays button.dp-selected,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-weekdays button.dp-selected,::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-calendar-week button.dp-selected,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-calendar-week button.dp-selected{background:#1e5dd3}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-weekdays button.dp-current-day,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-weekdays button.dp-current-day,::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-calendar-week button.dp-current-day,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-calendar-week button.dp-current-day{border:1px solid rgba(0,0,0,.38);color:#1e5dd3;background-color:#fff}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-day-calendar-container,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-day-calendar-container{padding:20px;border-radius:2px}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-calendar-nav-container,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-calendar-nav-container{display:flex;margin:0 0 20px;border:none}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-calendar-nav-container .dp-nav-header button,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-calendar-nav-container .dp-nav-header button{color:#000;font-size:17px;font-weight:500;margin:0 0 0 12px;padding:0}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-nav-btns-container,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-nav-btns-container{width:80px;display:flex}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-nav-btns-container .dp-calendar-nav-container-left button,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-nav-btns-container .dp-calendar-nav-container-left button,::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-nav-btns-container .dp-calendar-nav-container-right button,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-nav-btns-container .dp-calendar-nav-container-right button{margin:0!important}::ng-deep dp-date-picker .dp-popup dp-day-calendar .dp-calendar-wrapper,::ng-deep dp-date-picker .dp-popup dp-month-calendar .dp-calendar-wrapper{border:none}::ng-deep dp-date-picker .dp-open+div{position:fixed!important;inset:0!important;display:flex;justify-content:center;align-items:center;z-index:99;pointer-events:none;background:rgba(0,0,0,.3)}\n"] }]
|
|
21244
21257
|
}], ctorParameters: function () { return []; }, propDecorators: { question: [{
|
|
21245
21258
|
type: Input
|
|
21246
21259
|
}], questionIndex: [{
|
|
@@ -21275,10 +21288,10 @@ class FileUploadComponent {
|
|
|
21275
21288
|
}
|
|
21276
21289
|
}
|
|
21277
21290
|
FileUploadComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FileUploadComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
21278
|
-
FileUploadComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FileUploadComponent, selector: "app-file-upload", inputs: { question: "question", questionIndex: "questionIndex" }, ngImport: i0, template: "<div class=\"question-block\">\r\n <div class=\"question-head vx-d-flex vx-mb-4\">\r\n <span class=\"count vx-paragraph-txt vx-fs-20 vx-fw-400\">{{questionIndex}}.</span>\r\n <span class=\"heading vx-pl-3\">\r\n <span class=\"vx-fw-300 vx-label-txt vx-fs-20\" [innerHTML]=\"question?.title=='' ? 'Question' : question?.title\">How long have you been a customer of our product have you been a customer of our product?</span>\r\n <span class=\"required vx-fw-400 vx-txt-red vx-fs-24 vx-ml-2\" *ngIf=\"question?.isRequired\">*</span>\r\n </span>\r\n </div>\r\n <div class=\"question-details vx-fs-13 vx-paragraph-txt\" *ngIf=\"question?.hasDescription && question?.description.trim().length > 0 \" [innerHTML]=\"question?.description\"></div>\r\n <div class=\"question-options\" >\r\n <div class=\"custom-file-upload vx-d-flex vx-align-center vx-mt-5 vx-p-1\">\r\n <input type=\"file\">\r\n <span class=\"value vx-fs-11 vx-label-txt vx-d-block vx-pl-2\">Select file</span>\r\n <span class=\"button vx-d-flex vx-align-center vx-justify-center vx-txt-white vx-bg-blue vx-fs-12 vx-tt-uppercase\">Browse</span>\r\n </div>\r\n <ul class=\"file-list vx-p-0 vx-pt-5 vx-m-0\" *ngIf=\"false\">\r\n <li class=\"file vx-pb-1\">\r\n <div class=\"file-box vx-d-flex vx-align-center vx-pt-2 vx-pb-2\">\r\n <span class=\"file pdf\">\r\n <i class=\"icons\"></i>\r\n <span class=\"format\">pdf</span>\r\n </span>\r\n <div class=\"file-name vx-fs-12 vx-label-txt\" [appTooltip]=\"'Tooltip.pdf'\" placement=\"bottom-left\" delay=\"0\" type=\"black\" [tooltipMandatory]=\"false\">file-name.pdf</div>\r\n <button class=\"delete-btn vx-fs-14 vx-txt-red vx-p-0 vx-m-0 vx-d-flex vx-align-center vx-justify-center\"><i class=\"icons vx-ml-3\"></i></button>\r\n <div class=\"line-progress\">\r\n <div class=\"line-progress-bar\"></div>\r\n </div>\r\n </div>\r\n </li>\r\n </ul>\r\n </div>\r\n <div class=\"question-quick-settings\">\r\n <app-quick-settings [question]=\"question\"></app-quick-settings>\r\n </div>\r\n</div>", styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";::ng-deep .question-block{position:relative;margin-bottom:3rem}::ng-deep .question-head{padding-right:4rem}::ng-deep .question-head .count{min-width:1.5rem}::ng-deep .question-head .heading .required{position:relative;top:-.25rem}::ng-deep .question-details{padding-right:4rem;padding-left:2.5rem}::ng-deep .question-options{margin-left:2.5rem;margin-top:1.875rem}::ng-deep .question-options .custom-file-upload{position:relative;max-width:25rem;width:100%;border:1px solid #DBDBDB;box-shadow:0 0 10px #f1f1f1;height:2.5rem;border-radius:.25rem}::ng-deep .question-options .custom-file-upload input{position:absolute;top:0;right:0;height:100%;width:100%;opacity:0;cursor:pointer;z-index:1}::ng-deep .question-options .custom-file-upload span.value{width:calc(100% - 6.25rem);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}::ng-deep .question-options .custom-file-upload span.button{height:1.875rem;width:6.25rem;border-radius:.25rem}::ng-deep .question-options ul.file-list{list-style:none;width:37.5rem}::ng-deep .question-options ul.file-list li.file .file-box{border-bottom:1px solid #F1F1F1;position:relative}::ng-deep .question-options ul.file-list li.file .file-box .file-name{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:calc(100% - 1.25rem)}::ng-deep .question-options ul.file-list li.file .file-box button.delete-btn{background:transparent;border:none;border-radius:0}::ng-deep .question-options ul.file-list li.file .file-box .line-progress{left:1.625rem;top:auto;bottom:.5rem;width:92%}::ng-deep .question-quick-settings{position:absolute;top:-.25rem;right:-
|
|
21291
|
+
FileUploadComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FileUploadComponent, selector: "app-file-upload", inputs: { question: "question", questionIndex: "questionIndex" }, ngImport: i0, template: "<div class=\"question-block\">\r\n <div class=\"question-head vx-d-flex vx-mb-4\">\r\n <span class=\"count vx-paragraph-txt vx-fs-20 vx-fw-400\">{{questionIndex}}.</span>\r\n <span class=\"heading vx-pl-3\">\r\n <span class=\"vx-fw-300 vx-label-txt vx-fs-20\" [innerHTML]=\"question?.title=='' ? 'Question' : question?.title\">How long have you been a customer of our product have you been a customer of our product?</span>\r\n <span class=\"required vx-fw-400 vx-txt-red vx-fs-24 vx-ml-2\" *ngIf=\"question?.isRequired\">*</span>\r\n </span>\r\n </div>\r\n <div class=\"question-details vx-fs-13 vx-paragraph-txt\" *ngIf=\"question?.hasDescription && question?.description.trim().length > 0 \" [innerHTML]=\"question?.description\"></div>\r\n <div class=\"question-options\" >\r\n <div class=\"custom-file-upload vx-d-flex vx-align-center vx-mt-5 vx-p-1\">\r\n <input type=\"file\">\r\n <span class=\"value vx-fs-11 vx-label-txt vx-d-block vx-pl-2\">Select file</span>\r\n <span class=\"button vx-d-flex vx-align-center vx-justify-center vx-txt-white vx-bg-blue vx-fs-12 vx-tt-uppercase\">Browse</span>\r\n </div>\r\n <ul class=\"file-list vx-p-0 vx-pt-5 vx-m-0\" *ngIf=\"false\">\r\n <li class=\"file vx-pb-1\">\r\n <div class=\"file-box vx-d-flex vx-align-center vx-pt-2 vx-pb-2\">\r\n <span class=\"file pdf\">\r\n <i class=\"icons\"></i>\r\n <span class=\"format\">pdf</span>\r\n </span>\r\n <div class=\"file-name vx-fs-12 vx-label-txt\" [appTooltip]=\"'Tooltip.pdf'\" placement=\"bottom-left\" delay=\"0\" type=\"black\" [tooltipMandatory]=\"false\">file-name.pdf</div>\r\n <button class=\"delete-btn vx-fs-14 vx-txt-red vx-p-0 vx-m-0 vx-d-flex vx-align-center vx-justify-center\"><i class=\"icons vx-ml-3\"></i></button>\r\n <div class=\"line-progress\">\r\n <div class=\"line-progress-bar\"></div>\r\n </div>\r\n </div>\r\n </li>\r\n </ul>\r\n </div>\r\n <div class=\"question-quick-settings\">\r\n <app-quick-settings [question]=\"question\"></app-quick-settings>\r\n </div>\r\n</div>", styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";::ng-deep .question-block{position:relative;margin-bottom:3rem}::ng-deep .question-head{padding-right:4rem}::ng-deep .question-head .count{min-width:1.5rem}::ng-deep .question-head .heading .required{position:relative;top:-.25rem}::ng-deep .question-details{padding-right:4rem;padding-left:2.5rem}::ng-deep .question-options{margin-left:2.5rem;margin-top:1.875rem}::ng-deep .question-options .custom-file-upload{position:relative;max-width:25rem;width:100%;border:1px solid #DBDBDB;box-shadow:0 0 10px #f1f1f1;height:2.5rem;border-radius:.25rem}::ng-deep .question-options .custom-file-upload input{position:absolute;top:0;right:0;height:100%;width:100%;opacity:0;cursor:pointer;z-index:1}::ng-deep .question-options .custom-file-upload span.value{width:calc(100% - 6.25rem);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}::ng-deep .question-options .custom-file-upload span.button{height:1.875rem;width:6.25rem;border-radius:.25rem}::ng-deep .question-options ul.file-list{list-style:none;width:37.5rem}::ng-deep .question-options ul.file-list li.file .file-box{border-bottom:1px solid #F1F1F1;position:relative}::ng-deep .question-options ul.file-list li.file .file-box .file-name{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:calc(100% - 1.25rem)}::ng-deep .question-options ul.file-list li.file .file-box button.delete-btn{background:transparent;border:none;border-radius:0}::ng-deep .question-options ul.file-list li.file .file-box .line-progress{left:1.625rem;top:auto;bottom:.5rem;width:92%}::ng-deep .question-quick-settings{position:absolute;top:-.25rem;right:-3.75rem}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: ToolTipDirective, selector: "[appTooltip]", inputs: ["appTooltip", "placement", "type", "tooltipMandatory", "showTooltip", "animate"] }, { kind: "component", type: QuickSettingsComponent$1, selector: "app-quick-settings", inputs: ["question"] }] });
|
|
21279
21292
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FileUploadComponent, decorators: [{
|
|
21280
21293
|
type: Component,
|
|
21281
|
-
args: [{ selector: 'app-file-upload', template: "<div class=\"question-block\">\r\n <div class=\"question-head vx-d-flex vx-mb-4\">\r\n <span class=\"count vx-paragraph-txt vx-fs-20 vx-fw-400\">{{questionIndex}}.</span>\r\n <span class=\"heading vx-pl-3\">\r\n <span class=\"vx-fw-300 vx-label-txt vx-fs-20\" [innerHTML]=\"question?.title=='' ? 'Question' : question?.title\">How long have you been a customer of our product have you been a customer of our product?</span>\r\n <span class=\"required vx-fw-400 vx-txt-red vx-fs-24 vx-ml-2\" *ngIf=\"question?.isRequired\">*</span>\r\n </span>\r\n </div>\r\n <div class=\"question-details vx-fs-13 vx-paragraph-txt\" *ngIf=\"question?.hasDescription && question?.description.trim().length > 0 \" [innerHTML]=\"question?.description\"></div>\r\n <div class=\"question-options\" >\r\n <div class=\"custom-file-upload vx-d-flex vx-align-center vx-mt-5 vx-p-1\">\r\n <input type=\"file\">\r\n <span class=\"value vx-fs-11 vx-label-txt vx-d-block vx-pl-2\">Select file</span>\r\n <span class=\"button vx-d-flex vx-align-center vx-justify-center vx-txt-white vx-bg-blue vx-fs-12 vx-tt-uppercase\">Browse</span>\r\n </div>\r\n <ul class=\"file-list vx-p-0 vx-pt-5 vx-m-0\" *ngIf=\"false\">\r\n <li class=\"file vx-pb-1\">\r\n <div class=\"file-box vx-d-flex vx-align-center vx-pt-2 vx-pb-2\">\r\n <span class=\"file pdf\">\r\n <i class=\"icons\"></i>\r\n <span class=\"format\">pdf</span>\r\n </span>\r\n <div class=\"file-name vx-fs-12 vx-label-txt\" [appTooltip]=\"'Tooltip.pdf'\" placement=\"bottom-left\" delay=\"0\" type=\"black\" [tooltipMandatory]=\"false\">file-name.pdf</div>\r\n <button class=\"delete-btn vx-fs-14 vx-txt-red vx-p-0 vx-m-0 vx-d-flex vx-align-center vx-justify-center\"><i class=\"icons vx-ml-3\"></i></button>\r\n <div class=\"line-progress\">\r\n <div class=\"line-progress-bar\"></div>\r\n </div>\r\n </div>\r\n </li>\r\n </ul>\r\n </div>\r\n <div class=\"question-quick-settings\">\r\n <app-quick-settings [question]=\"question\"></app-quick-settings>\r\n </div>\r\n</div>", styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";::ng-deep .question-block{position:relative;margin-bottom:3rem}::ng-deep .question-head{padding-right:4rem}::ng-deep .question-head .count{min-width:1.5rem}::ng-deep .question-head .heading .required{position:relative;top:-.25rem}::ng-deep .question-details{padding-right:4rem;padding-left:2.5rem}::ng-deep .question-options{margin-left:2.5rem;margin-top:1.875rem}::ng-deep .question-options .custom-file-upload{position:relative;max-width:25rem;width:100%;border:1px solid #DBDBDB;box-shadow:0 0 10px #f1f1f1;height:2.5rem;border-radius:.25rem}::ng-deep .question-options .custom-file-upload input{position:absolute;top:0;right:0;height:100%;width:100%;opacity:0;cursor:pointer;z-index:1}::ng-deep .question-options .custom-file-upload span.value{width:calc(100% - 6.25rem);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}::ng-deep .question-options .custom-file-upload span.button{height:1.875rem;width:6.25rem;border-radius:.25rem}::ng-deep .question-options ul.file-list{list-style:none;width:37.5rem}::ng-deep .question-options ul.file-list li.file .file-box{border-bottom:1px solid #F1F1F1;position:relative}::ng-deep .question-options ul.file-list li.file .file-box .file-name{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:calc(100% - 1.25rem)}::ng-deep .question-options ul.file-list li.file .file-box button.delete-btn{background:transparent;border:none;border-radius:0}::ng-deep .question-options ul.file-list li.file .file-box .line-progress{left:1.625rem;top:auto;bottom:.5rem;width:92%}::ng-deep .question-quick-settings{position:absolute;top:-.25rem;right:-
|
|
21294
|
+
args: [{ selector: 'app-file-upload', template: "<div class=\"question-block\">\r\n <div class=\"question-head vx-d-flex vx-mb-4\">\r\n <span class=\"count vx-paragraph-txt vx-fs-20 vx-fw-400\">{{questionIndex}}.</span>\r\n <span class=\"heading vx-pl-3\">\r\n <span class=\"vx-fw-300 vx-label-txt vx-fs-20\" [innerHTML]=\"question?.title=='' ? 'Question' : question?.title\">How long have you been a customer of our product have you been a customer of our product?</span>\r\n <span class=\"required vx-fw-400 vx-txt-red vx-fs-24 vx-ml-2\" *ngIf=\"question?.isRequired\">*</span>\r\n </span>\r\n </div>\r\n <div class=\"question-details vx-fs-13 vx-paragraph-txt\" *ngIf=\"question?.hasDescription && question?.description.trim().length > 0 \" [innerHTML]=\"question?.description\"></div>\r\n <div class=\"question-options\" >\r\n <div class=\"custom-file-upload vx-d-flex vx-align-center vx-mt-5 vx-p-1\">\r\n <input type=\"file\">\r\n <span class=\"value vx-fs-11 vx-label-txt vx-d-block vx-pl-2\">Select file</span>\r\n <span class=\"button vx-d-flex vx-align-center vx-justify-center vx-txt-white vx-bg-blue vx-fs-12 vx-tt-uppercase\">Browse</span>\r\n </div>\r\n <ul class=\"file-list vx-p-0 vx-pt-5 vx-m-0\" *ngIf=\"false\">\r\n <li class=\"file vx-pb-1\">\r\n <div class=\"file-box vx-d-flex vx-align-center vx-pt-2 vx-pb-2\">\r\n <span class=\"file pdf\">\r\n <i class=\"icons\"></i>\r\n <span class=\"format\">pdf</span>\r\n </span>\r\n <div class=\"file-name vx-fs-12 vx-label-txt\" [appTooltip]=\"'Tooltip.pdf'\" placement=\"bottom-left\" delay=\"0\" type=\"black\" [tooltipMandatory]=\"false\">file-name.pdf</div>\r\n <button class=\"delete-btn vx-fs-14 vx-txt-red vx-p-0 vx-m-0 vx-d-flex vx-align-center vx-justify-center\"><i class=\"icons vx-ml-3\"></i></button>\r\n <div class=\"line-progress\">\r\n <div class=\"line-progress-bar\"></div>\r\n </div>\r\n </div>\r\n </li>\r\n </ul>\r\n </div>\r\n <div class=\"question-quick-settings\">\r\n <app-quick-settings [question]=\"question\"></app-quick-settings>\r\n </div>\r\n</div>", styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";::ng-deep .question-block{position:relative;margin-bottom:3rem}::ng-deep .question-head{padding-right:4rem}::ng-deep .question-head .count{min-width:1.5rem}::ng-deep .question-head .heading .required{position:relative;top:-.25rem}::ng-deep .question-details{padding-right:4rem;padding-left:2.5rem}::ng-deep .question-options{margin-left:2.5rem;margin-top:1.875rem}::ng-deep .question-options .custom-file-upload{position:relative;max-width:25rem;width:100%;border:1px solid #DBDBDB;box-shadow:0 0 10px #f1f1f1;height:2.5rem;border-radius:.25rem}::ng-deep .question-options .custom-file-upload input{position:absolute;top:0;right:0;height:100%;width:100%;opacity:0;cursor:pointer;z-index:1}::ng-deep .question-options .custom-file-upload span.value{width:calc(100% - 6.25rem);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}::ng-deep .question-options .custom-file-upload span.button{height:1.875rem;width:6.25rem;border-radius:.25rem}::ng-deep .question-options ul.file-list{list-style:none;width:37.5rem}::ng-deep .question-options ul.file-list li.file .file-box{border-bottom:1px solid #F1F1F1;position:relative}::ng-deep .question-options ul.file-list li.file .file-box .file-name{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:calc(100% - 1.25rem)}::ng-deep .question-options ul.file-list li.file .file-box button.delete-btn{background:transparent;border:none;border-radius:0}::ng-deep .question-options ul.file-list li.file .file-box .line-progress{left:1.625rem;top:auto;bottom:.5rem;width:92%}::ng-deep .question-quick-settings{position:absolute;top:-.25rem;right:-3.75rem}\n"] }]
|
|
21282
21295
|
}], ctorParameters: function () { return []; }, propDecorators: { question: [{
|
|
21283
21296
|
type: Input
|
|
21284
21297
|
}], questionIndex: [{
|
|
@@ -21300,10 +21313,10 @@ class RadioQuestionComponent {
|
|
|
21300
21313
|
}
|
|
21301
21314
|
}
|
|
21302
21315
|
RadioQuestionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: RadioQuestionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
21303
|
-
RadioQuestionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: RadioQuestionComponent, selector: "app-radio-question", inputs: { question: "question", questionIndex: "questionIndex" }, ngImport: i0, template: "<div class=\"question-block\">\r\n <div class=\"question-head vx-d-flex vx-mb-4\">\r\n <span class=\"count vx-paragraph-txt vx-fs-20 vx-fw-400\">{{questionIndex}}.</span>\r\n <span class=\"heading vx-pl-3\">\r\n <span class=\"vx-fw-300 vx-label-txt vx-fs-20\" [innerHTML]=\"question?.title=='' ? 'Question' : question?.title\"></span>\r\n <span class=\"required vx-fw-400 vx-txt-red vx-fs-24 vx-ml-2\" *ngIf=\"question?.isRequired\">*</span>\r\n </span>\r\n </div>\r\n <div class=\"question-details vx-fs-13 vx-paragraph-txt\" [innerHTML]=\"question?.description\"></div>\r\n <div class=\"question-options\">\r\n <ul class=\"vx-p-0 vx-m-0\">\r\n <li *ngFor=\"let choice of choicesForPreviewMode; let choiceIndex = index\" class=\"vx-mt-5\">\r\n <app-cs-radio [name]=\"question?.name\">\r\n <span class=\"radio-value vx-fs-14 vx-paragraph-txt vx-fw-400 vx-lh-5\" [appTooltip]=\"choice?.title\" placement=\"bottom-left\" delay=\"0\" type=\"black\" [tooltipMandatory]=\"false\"> {{choice?.title ? choice?.title: 'Option' }}</span>\r\n </app-cs-radio>\r\n </li>\r\n <li *ngIf=\"question?.hasOther\" class=\"vx-mt-5\">\r\n <app-cs-radio [name]=\"question?.name\">\r\n <span class=\"radio-value vx-fs-14 vx-paragraph-txt vx-fw-400 vx-lh-5\" [appTooltip]=\"question.otherValue\" placement=\"bottom-left\" delay=\"0\" type=\"black\" [tooltipMandatory]=\"false\">{{question.otherValue}}</span>\r\n </app-cs-radio>\r\n </li>\r\n </ul>\r\n </div>\r\n <div class=\"question-quick-settings\">\r\n <app-quick-settings [question]=\"question\"></app-quick-settings>\r\n </div>\r\n</div>\r\n", styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";::ng-deep .question-block{position:relative;margin-bottom:3rem}::ng-deep .question-head{padding-right:4rem}::ng-deep .question-head .count{min-width:1.5rem}::ng-deep .question-head .heading .required{position:relative;top:-.25rem}::ng-deep .question-details{padding-right:4rem;padding-left:2.5rem}::ng-deep .question-options{margin-left:2.5rem;margin-top:1.875rem}::ng-deep .question-options ul{list-style-type:none}::ng-deep .question-options ul li app-cs-radio .radio-item{width:100%!important}::ng-deep .question-options ul li app-cs-radio .radio-item .radio,::ng-deep .question-options ul li app-cs-radio .radio-item .radiomark{min-width:1.375rem!important;width:1.375rem!important;height:1.375rem!important}::ng-deep .question-options ul li app-cs-radio .radio-item .value{width:100%!important}::ng-deep .question-options ul li app-cs-radio .radio-item .value .radio-value{text-overflow:ellipsis;white-space:nowrap;overflow:hidden;width:90%}::ng-deep .question-quick-settings{position:absolute;top:-.25rem;right:-
|
|
21316
|
+
RadioQuestionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: RadioQuestionComponent, selector: "app-radio-question", inputs: { question: "question", questionIndex: "questionIndex" }, ngImport: i0, template: "<div class=\"question-block\">\r\n <div class=\"question-head vx-d-flex vx-mb-4\">\r\n <span class=\"count vx-paragraph-txt vx-fs-20 vx-fw-400\">{{questionIndex}}.</span>\r\n <span class=\"heading vx-pl-3\">\r\n <span class=\"vx-fw-300 vx-label-txt vx-fs-20\" [innerHTML]=\"question?.title=='' ? 'Question' : question?.title\"></span>\r\n <span class=\"required vx-fw-400 vx-txt-red vx-fs-24 vx-ml-2\" *ngIf=\"question?.isRequired\">*</span>\r\n </span>\r\n </div>\r\n <div class=\"question-details vx-fs-13 vx-paragraph-txt\" [innerHTML]=\"question?.description\"></div>\r\n <div class=\"question-options\">\r\n <ul class=\"vx-p-0 vx-m-0\">\r\n <li *ngFor=\"let choice of choicesForPreviewMode; let choiceIndex = index\" class=\"vx-mt-5\">\r\n <app-cs-radio [name]=\"question?.name\">\r\n <span class=\"radio-value vx-fs-14 vx-paragraph-txt vx-fw-400 vx-lh-5\" [appTooltip]=\"choice?.title\" placement=\"bottom-left\" delay=\"0\" type=\"black\" [tooltipMandatory]=\"false\"> {{choice?.title ? choice?.title: 'Option' }}</span>\r\n </app-cs-radio>\r\n </li>\r\n <li *ngIf=\"question?.hasOther\" class=\"vx-mt-5\">\r\n <app-cs-radio [name]=\"question?.name\">\r\n <span class=\"radio-value vx-fs-14 vx-paragraph-txt vx-fw-400 vx-lh-5\" [appTooltip]=\"question.otherValue\" placement=\"bottom-left\" delay=\"0\" type=\"black\" [tooltipMandatory]=\"false\">{{question.otherValue}}</span>\r\n </app-cs-radio>\r\n </li>\r\n </ul>\r\n </div>\r\n <div class=\"question-quick-settings\">\r\n <app-quick-settings [question]=\"question\"></app-quick-settings>\r\n </div>\r\n</div>\r\n", styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";::ng-deep .question-block{position:relative;margin-bottom:3rem}::ng-deep .question-head{padding-right:4rem}::ng-deep .question-head .count{min-width:1.5rem}::ng-deep .question-head .heading .required{position:relative;top:-.25rem}::ng-deep .question-details{padding-right:4rem;padding-left:2.5rem}::ng-deep .question-options{margin-left:2.5rem;margin-top:1.875rem}::ng-deep .question-options ul{list-style-type:none}::ng-deep .question-options ul li app-cs-radio .radio-item{width:100%!important}::ng-deep .question-options ul li app-cs-radio .radio-item .radio,::ng-deep .question-options ul li app-cs-radio .radio-item .radiomark{min-width:1.375rem!important;width:1.375rem!important;height:1.375rem!important}::ng-deep .question-options ul li app-cs-radio .radio-item .value{width:100%!important}::ng-deep .question-options ul li app-cs-radio .radio-item .value .radio-value{text-overflow:ellipsis;white-space:nowrap;overflow:hidden;width:90%}::ng-deep .question-quick-settings{position:absolute;top:-.25rem;right:-3.75rem}\n"], dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: ToolTipDirective, selector: "[appTooltip]", inputs: ["appTooltip", "placement", "type", "tooltipMandatory", "showTooltip", "animate"] }, { kind: "component", type: CsRadioComponent$1, selector: "app-cs-radio", inputs: ["disabled", "readonly", "name", "checked", "value", "oneLine"], outputs: ["checkedEvent"] }, { kind: "component", type: QuickSettingsComponent$1, selector: "app-quick-settings", inputs: ["question"] }] });
|
|
21304
21317
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: RadioQuestionComponent, decorators: [{
|
|
21305
21318
|
type: Component,
|
|
21306
|
-
args: [{ selector: 'app-radio-question', template: "<div class=\"question-block\">\r\n <div class=\"question-head vx-d-flex vx-mb-4\">\r\n <span class=\"count vx-paragraph-txt vx-fs-20 vx-fw-400\">{{questionIndex}}.</span>\r\n <span class=\"heading vx-pl-3\">\r\n <span class=\"vx-fw-300 vx-label-txt vx-fs-20\" [innerHTML]=\"question?.title=='' ? 'Question' : question?.title\"></span>\r\n <span class=\"required vx-fw-400 vx-txt-red vx-fs-24 vx-ml-2\" *ngIf=\"question?.isRequired\">*</span>\r\n </span>\r\n </div>\r\n <div class=\"question-details vx-fs-13 vx-paragraph-txt\" [innerHTML]=\"question?.description\"></div>\r\n <div class=\"question-options\">\r\n <ul class=\"vx-p-0 vx-m-0\">\r\n <li *ngFor=\"let choice of choicesForPreviewMode; let choiceIndex = index\" class=\"vx-mt-5\">\r\n <app-cs-radio [name]=\"question?.name\">\r\n <span class=\"radio-value vx-fs-14 vx-paragraph-txt vx-fw-400 vx-lh-5\" [appTooltip]=\"choice?.title\" placement=\"bottom-left\" delay=\"0\" type=\"black\" [tooltipMandatory]=\"false\"> {{choice?.title ? choice?.title: 'Option' }}</span>\r\n </app-cs-radio>\r\n </li>\r\n <li *ngIf=\"question?.hasOther\" class=\"vx-mt-5\">\r\n <app-cs-radio [name]=\"question?.name\">\r\n <span class=\"radio-value vx-fs-14 vx-paragraph-txt vx-fw-400 vx-lh-5\" [appTooltip]=\"question.otherValue\" placement=\"bottom-left\" delay=\"0\" type=\"black\" [tooltipMandatory]=\"false\">{{question.otherValue}}</span>\r\n </app-cs-radio>\r\n </li>\r\n </ul>\r\n </div>\r\n <div class=\"question-quick-settings\">\r\n <app-quick-settings [question]=\"question\"></app-quick-settings>\r\n </div>\r\n</div>\r\n", styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";::ng-deep .question-block{position:relative;margin-bottom:3rem}::ng-deep .question-head{padding-right:4rem}::ng-deep .question-head .count{min-width:1.5rem}::ng-deep .question-head .heading .required{position:relative;top:-.25rem}::ng-deep .question-details{padding-right:4rem;padding-left:2.5rem}::ng-deep .question-options{margin-left:2.5rem;margin-top:1.875rem}::ng-deep .question-options ul{list-style-type:none}::ng-deep .question-options ul li app-cs-radio .radio-item{width:100%!important}::ng-deep .question-options ul li app-cs-radio .radio-item .radio,::ng-deep .question-options ul li app-cs-radio .radio-item .radiomark{min-width:1.375rem!important;width:1.375rem!important;height:1.375rem!important}::ng-deep .question-options ul li app-cs-radio .radio-item .value{width:100%!important}::ng-deep .question-options ul li app-cs-radio .radio-item .value .radio-value{text-overflow:ellipsis;white-space:nowrap;overflow:hidden;width:90%}::ng-deep .question-quick-settings{position:absolute;top:-.25rem;right:-
|
|
21319
|
+
args: [{ selector: 'app-radio-question', template: "<div class=\"question-block\">\r\n <div class=\"question-head vx-d-flex vx-mb-4\">\r\n <span class=\"count vx-paragraph-txt vx-fs-20 vx-fw-400\">{{questionIndex}}.</span>\r\n <span class=\"heading vx-pl-3\">\r\n <span class=\"vx-fw-300 vx-label-txt vx-fs-20\" [innerHTML]=\"question?.title=='' ? 'Question' : question?.title\"></span>\r\n <span class=\"required vx-fw-400 vx-txt-red vx-fs-24 vx-ml-2\" *ngIf=\"question?.isRequired\">*</span>\r\n </span>\r\n </div>\r\n <div class=\"question-details vx-fs-13 vx-paragraph-txt\" [innerHTML]=\"question?.description\"></div>\r\n <div class=\"question-options\">\r\n <ul class=\"vx-p-0 vx-m-0\">\r\n <li *ngFor=\"let choice of choicesForPreviewMode; let choiceIndex = index\" class=\"vx-mt-5\">\r\n <app-cs-radio [name]=\"question?.name\">\r\n <span class=\"radio-value vx-fs-14 vx-paragraph-txt vx-fw-400 vx-lh-5\" [appTooltip]=\"choice?.title\" placement=\"bottom-left\" delay=\"0\" type=\"black\" [tooltipMandatory]=\"false\"> {{choice?.title ? choice?.title: 'Option' }}</span>\r\n </app-cs-radio>\r\n </li>\r\n <li *ngIf=\"question?.hasOther\" class=\"vx-mt-5\">\r\n <app-cs-radio [name]=\"question?.name\">\r\n <span class=\"radio-value vx-fs-14 vx-paragraph-txt vx-fw-400 vx-lh-5\" [appTooltip]=\"question.otherValue\" placement=\"bottom-left\" delay=\"0\" type=\"black\" [tooltipMandatory]=\"false\">{{question.otherValue}}</span>\r\n </app-cs-radio>\r\n </li>\r\n </ul>\r\n </div>\r\n <div class=\"question-quick-settings\">\r\n <app-quick-settings [question]=\"question\"></app-quick-settings>\r\n </div>\r\n</div>\r\n", styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";::ng-deep .question-block{position:relative;margin-bottom:3rem}::ng-deep .question-head{padding-right:4rem}::ng-deep .question-head .count{min-width:1.5rem}::ng-deep .question-head .heading .required{position:relative;top:-.25rem}::ng-deep .question-details{padding-right:4rem;padding-left:2.5rem}::ng-deep .question-options{margin-left:2.5rem;margin-top:1.875rem}::ng-deep .question-options ul{list-style-type:none}::ng-deep .question-options ul li app-cs-radio .radio-item{width:100%!important}::ng-deep .question-options ul li app-cs-radio .radio-item .radio,::ng-deep .question-options ul li app-cs-radio .radio-item .radiomark{min-width:1.375rem!important;width:1.375rem!important;height:1.375rem!important}::ng-deep .question-options ul li app-cs-radio .radio-item .value{width:100%!important}::ng-deep .question-options ul li app-cs-radio .radio-item .value .radio-value{text-overflow:ellipsis;white-space:nowrap;overflow:hidden;width:90%}::ng-deep .question-quick-settings{position:absolute;top:-.25rem;right:-3.75rem}\n"] }]
|
|
21307
21320
|
}], ctorParameters: function () { return []; }, propDecorators: { question: [{
|
|
21308
21321
|
type: Input
|
|
21309
21322
|
}], questionIndex: [{
|
|
@@ -21328,10 +21341,10 @@ class SelectQuestionComponent {
|
|
|
21328
21341
|
}
|
|
21329
21342
|
}
|
|
21330
21343
|
SelectQuestionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SelectQuestionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
21331
|
-
SelectQuestionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: SelectQuestionComponent, selector: "app-select-question", inputs: { question: "question", questionIndex: "questionIndex" }, ngImport: i0, template: "<div class=\"question-block\">\r\n <div class=\"question-head vx-d-flex vx-mb-4\">\r\n <span class=\"count vx-paragraph-txt vx-fs-20 vx-fw-400\">{{questionIndex}}.</span>\r\n <span class=\"heading vx-pl-3\">\r\n <span class=\"vx-fw-300 vx-label-txt vx-fs-20\" [innerHTML]=\"question?.title=='' ? 'Question' : question?.title\">{{question?.title}}</span>\r\n <span class=\"required vx-fw-400 vx-txt-red vx-fs-24 vx-ml-2\">*</span>\r\n </span>\r\n </div>\r\n <div class=\"question-details vx-fs-13 vx-paragraph-txt\" *ngIf=\"question?.hasDescription && question?.description.trim().length > 0 \" [innerHTML]=\"question?.description\">In publishing and graphic design, Lorem ipsum is a placeholder text commonly used to demonstrate the visual form of a document or a typeface without relying on meaningful content. Lorem ipsum may be used as a placeholder before the final copy is available.</div>\r\n <div class=\"question-options\">\r\n <div class=\"options-area\">\r\n <app-cs-select [dataList]='choicesForPreviewMode' [valueKey]=\"'title'\" [displayProperty]=\"'title'\" [selectedValue]=\"'Select an option'\"></app-cs-select>\r\n </div>\r\n </div>\r\n <div class=\"question-quick-settings\">\r\n <app-quick-settings [question]=\"question\"></app-quick-settings>\r\n </div>\r\n</div>", styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";::ng-deep .question-block{position:relative;margin-bottom:3rem}::ng-deep .question-head{padding-right:4rem}::ng-deep .question-head .count{min-width:1.5rem}::ng-deep .question-head .heading .required{position:relative;top:-.25rem}::ng-deep .question-details{padding-right:4rem;padding-left:2.5rem}::ng-deep .question-options{margin-left:2.5rem;margin-top:1.875rem}::ng-deep .question-options .options-area{width:70%}::ng-deep .question-options .options-area app-cs-select .input-group .custom-select-box .arrow{top:.5rem!important;right:0!important}::ng-deep .question-quick-settings{position:absolute;top:-.25rem;right:-
|
|
21344
|
+
SelectQuestionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: SelectQuestionComponent, selector: "app-select-question", inputs: { question: "question", questionIndex: "questionIndex" }, ngImport: i0, template: "<div class=\"question-block\">\r\n <div class=\"question-head vx-d-flex vx-mb-4\">\r\n <span class=\"count vx-paragraph-txt vx-fs-20 vx-fw-400\">{{questionIndex}}.</span>\r\n <span class=\"heading vx-pl-3\">\r\n <span class=\"vx-fw-300 vx-label-txt vx-fs-20\" [innerHTML]=\"question?.title=='' ? 'Question' : question?.title\">{{question?.title}}</span>\r\n <span class=\"required vx-fw-400 vx-txt-red vx-fs-24 vx-ml-2\">*</span>\r\n </span>\r\n </div>\r\n <div class=\"question-details vx-fs-13 vx-paragraph-txt\" *ngIf=\"question?.hasDescription && question?.description.trim().length > 0 \" [innerHTML]=\"question?.description\">In publishing and graphic design, Lorem ipsum is a placeholder text commonly used to demonstrate the visual form of a document or a typeface without relying on meaningful content. Lorem ipsum may be used as a placeholder before the final copy is available.</div>\r\n <div class=\"question-options\">\r\n <div class=\"options-area\">\r\n <app-cs-select [dataList]='choicesForPreviewMode' [valueKey]=\"'title'\" [displayProperty]=\"'title'\" [selectedValue]=\"'Select an option'\"></app-cs-select>\r\n </div>\r\n </div>\r\n <div class=\"question-quick-settings\">\r\n <app-quick-settings [question]=\"question\"></app-quick-settings>\r\n </div>\r\n</div>", styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";::ng-deep .question-block{position:relative;margin-bottom:3rem}::ng-deep .question-head{padding-right:4rem}::ng-deep .question-head .count{min-width:1.5rem}::ng-deep .question-head .heading .required{position:relative;top:-.25rem}::ng-deep .question-details{padding-right:4rem;padding-left:2.5rem}::ng-deep .question-options{margin-left:2.5rem;margin-top:1.875rem}::ng-deep .question-options .options-area{width:70%}::ng-deep .question-options .options-area app-cs-select .input-group .custom-select-box .arrow{top:.5rem!important;right:0!important}::ng-deep .question-quick-settings{position:absolute;top:-.25rem;right:-3.75rem}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: CsSelectComponent$2, selector: "app-cs-select", inputs: ["dataList", "dropdownLabel", "displayProperty", "selectedValue", "isRequired", "dropdownSubLabel", "placeholder", "stylex", "valueKey", "colorBlock", "colorCode"], outputs: ["selectedData", "selectedValueChange"] }, { kind: "component", type: QuickSettingsComponent$1, selector: "app-quick-settings", inputs: ["question"] }] });
|
|
21332
21345
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SelectQuestionComponent, decorators: [{
|
|
21333
21346
|
type: Component,
|
|
21334
|
-
args: [{ selector: 'app-select-question', template: "<div class=\"question-block\">\r\n <div class=\"question-head vx-d-flex vx-mb-4\">\r\n <span class=\"count vx-paragraph-txt vx-fs-20 vx-fw-400\">{{questionIndex}}.</span>\r\n <span class=\"heading vx-pl-3\">\r\n <span class=\"vx-fw-300 vx-label-txt vx-fs-20\" [innerHTML]=\"question?.title=='' ? 'Question' : question?.title\">{{question?.title}}</span>\r\n <span class=\"required vx-fw-400 vx-txt-red vx-fs-24 vx-ml-2\">*</span>\r\n </span>\r\n </div>\r\n <div class=\"question-details vx-fs-13 vx-paragraph-txt\" *ngIf=\"question?.hasDescription && question?.description.trim().length > 0 \" [innerHTML]=\"question?.description\">In publishing and graphic design, Lorem ipsum is a placeholder text commonly used to demonstrate the visual form of a document or a typeface without relying on meaningful content. Lorem ipsum may be used as a placeholder before the final copy is available.</div>\r\n <div class=\"question-options\">\r\n <div class=\"options-area\">\r\n <app-cs-select [dataList]='choicesForPreviewMode' [valueKey]=\"'title'\" [displayProperty]=\"'title'\" [selectedValue]=\"'Select an option'\"></app-cs-select>\r\n </div>\r\n </div>\r\n <div class=\"question-quick-settings\">\r\n <app-quick-settings [question]=\"question\"></app-quick-settings>\r\n </div>\r\n</div>", styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";::ng-deep .question-block{position:relative;margin-bottom:3rem}::ng-deep .question-head{padding-right:4rem}::ng-deep .question-head .count{min-width:1.5rem}::ng-deep .question-head .heading .required{position:relative;top:-.25rem}::ng-deep .question-details{padding-right:4rem;padding-left:2.5rem}::ng-deep .question-options{margin-left:2.5rem;margin-top:1.875rem}::ng-deep .question-options .options-area{width:70%}::ng-deep .question-options .options-area app-cs-select .input-group .custom-select-box .arrow{top:.5rem!important;right:0!important}::ng-deep .question-quick-settings{position:absolute;top:-.25rem;right:-
|
|
21347
|
+
args: [{ selector: 'app-select-question', template: "<div class=\"question-block\">\r\n <div class=\"question-head vx-d-flex vx-mb-4\">\r\n <span class=\"count vx-paragraph-txt vx-fs-20 vx-fw-400\">{{questionIndex}}.</span>\r\n <span class=\"heading vx-pl-3\">\r\n <span class=\"vx-fw-300 vx-label-txt vx-fs-20\" [innerHTML]=\"question?.title=='' ? 'Question' : question?.title\">{{question?.title}}</span>\r\n <span class=\"required vx-fw-400 vx-txt-red vx-fs-24 vx-ml-2\">*</span>\r\n </span>\r\n </div>\r\n <div class=\"question-details vx-fs-13 vx-paragraph-txt\" *ngIf=\"question?.hasDescription && question?.description.trim().length > 0 \" [innerHTML]=\"question?.description\">In publishing and graphic design, Lorem ipsum is a placeholder text commonly used to demonstrate the visual form of a document or a typeface without relying on meaningful content. Lorem ipsum may be used as a placeholder before the final copy is available.</div>\r\n <div class=\"question-options\">\r\n <div class=\"options-area\">\r\n <app-cs-select [dataList]='choicesForPreviewMode' [valueKey]=\"'title'\" [displayProperty]=\"'title'\" [selectedValue]=\"'Select an option'\"></app-cs-select>\r\n </div>\r\n </div>\r\n <div class=\"question-quick-settings\">\r\n <app-quick-settings [question]=\"question\"></app-quick-settings>\r\n </div>\r\n</div>", styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";::ng-deep .question-block{position:relative;margin-bottom:3rem}::ng-deep .question-head{padding-right:4rem}::ng-deep .question-head .count{min-width:1.5rem}::ng-deep .question-head .heading .required{position:relative;top:-.25rem}::ng-deep .question-details{padding-right:4rem;padding-left:2.5rem}::ng-deep .question-options{margin-left:2.5rem;margin-top:1.875rem}::ng-deep .question-options .options-area{width:70%}::ng-deep .question-options .options-area app-cs-select .input-group .custom-select-box .arrow{top:.5rem!important;right:0!important}::ng-deep .question-quick-settings{position:absolute;top:-.25rem;right:-3.75rem}\n"] }]
|
|
21335
21348
|
}], ctorParameters: function () { return []; }, propDecorators: { question: [{
|
|
21336
21349
|
type: Input
|
|
21337
21350
|
}], questionIndex: [{
|
|
@@ -21344,10 +21357,10 @@ class SingleTextboxComponent {
|
|
|
21344
21357
|
}
|
|
21345
21358
|
}
|
|
21346
21359
|
SingleTextboxComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SingleTextboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
21347
|
-
SingleTextboxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: SingleTextboxComponent, selector: "app-single-textbox", inputs: { question: "question", questionIndex: "questionIndex" }, ngImport: i0, template: "<div class=\"question-block\">\r\n <div class=\"question-head vx-d-flex vx-mb-4\">\r\n <span class=\"count vx-paragraph-txt vx-fs-20 vx-fw-400\">{{questionIndex}}.</span>\r\n <span class=\"heading vx-pl-3\">\r\n <span class=\"vx-fw-300 vx-label-txt vx-fs-20\" [innerHTML]=\"question?.title=='' ? 'Question' : question?.title\"></span>\r\n <span class=\"required vx-fw-400 vx-txt-red vx-fs-24 vx-ml-2\">*</span>\r\n </span>\r\n </div>\r\n <div class=\"question-details vx-fs-13 vx-paragraph-txt\" *ngIf=\"question?.hasDescription && question?.description?.trim().length > 0 \" [innerHTML]=\"question?.description\"></div>\r\n <div class=\"question-options\">\r\n <input class=\"single-textbox vx-bg-white vx-fs-14 vx-lh-24 vx-paragraph-txt\" type=\"text\" [placeholder]=\"(question?.isPlaceholder === true && question?.placeholder?.trim().length > 0) ? question?.placeholder.trim() : 'Please enter a response'\">\r\n </div>\r\n <div class=\"question-quick-settings\">\r\n <app-quick-settings [question]=\"question\"></app-quick-settings>\r\n </div>\r\n</div>", styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";::ng-deep .question-block{position:relative;margin-bottom:3rem}::ng-deep .question-head{padding-right:4rem}::ng-deep .question-head .count{min-width:1.5rem}::ng-deep .question-head .heading .required{position:relative;top:-.25rem}::ng-deep .question-details{padding-right:4rem;padding-left:2.5rem}::ng-deep .question-options{margin-left:2.5rem;margin-top:1.875rem}::ng-deep .question-options .single-textbox{border:1px solid #DBDBDB;border-radius:.25rem;color:#747576;font-size:13px;height:2.5rem;padding:.5rem .75rem;width:37.5rem;outline:none;transition:all .2s ease-in-out}::ng-deep .question-options .single-textbox:hover,::ng-deep .question-options .single-textbox:focus{border:1px solid #1e5dd3;box-shadow:0 0 5px #1e5dd345}::ng-deep .question-quick-settings{position:absolute;top:-.25rem;right:-
|
|
21360
|
+
SingleTextboxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: SingleTextboxComponent, selector: "app-single-textbox", inputs: { question: "question", questionIndex: "questionIndex" }, ngImport: i0, template: "<div class=\"question-block\">\r\n <div class=\"question-head vx-d-flex vx-mb-4\">\r\n <span class=\"count vx-paragraph-txt vx-fs-20 vx-fw-400\">{{questionIndex}}.</span>\r\n <span class=\"heading vx-pl-3\">\r\n <span class=\"vx-fw-300 vx-label-txt vx-fs-20\" [innerHTML]=\"question?.title=='' ? 'Question' : question?.title\"></span>\r\n <span class=\"required vx-fw-400 vx-txt-red vx-fs-24 vx-ml-2\">*</span>\r\n </span>\r\n </div>\r\n <div class=\"question-details vx-fs-13 vx-paragraph-txt\" *ngIf=\"question?.hasDescription && question?.description?.trim().length > 0 \" [innerHTML]=\"question?.description\"></div>\r\n <div class=\"question-options\">\r\n <input class=\"single-textbox vx-bg-white vx-fs-14 vx-lh-24 vx-paragraph-txt\" type=\"text\" [placeholder]=\"(question?.isPlaceholder === true && question?.placeholder?.trim().length > 0) ? question?.placeholder.trim() : 'Please enter a response'\">\r\n </div>\r\n <div class=\"question-quick-settings\">\r\n <app-quick-settings [question]=\"question\"></app-quick-settings>\r\n </div>\r\n</div>", styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";::ng-deep .question-block{position:relative;margin-bottom:3rem}::ng-deep .question-head{padding-right:4rem}::ng-deep .question-head .count{min-width:1.5rem}::ng-deep .question-head .heading .required{position:relative;top:-.25rem}::ng-deep .question-details{padding-right:4rem;padding-left:2.5rem}::ng-deep .question-options{margin-left:2.5rem;margin-top:1.875rem}::ng-deep .question-options .single-textbox{border:1px solid #DBDBDB;border-radius:.25rem;color:#747576;font-size:13px;height:2.5rem;padding:.5rem .75rem;width:37.5rem;outline:none;transition:all .2s ease-in-out}::ng-deep .question-options .single-textbox:hover,::ng-deep .question-options .single-textbox:focus{border:1px solid #1e5dd3;box-shadow:0 0 5px #1e5dd345}::ng-deep .question-quick-settings{position:absolute;top:-.25rem;right:-3.75rem}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: QuickSettingsComponent$1, selector: "app-quick-settings", inputs: ["question"] }] });
|
|
21348
21361
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SingleTextboxComponent, decorators: [{
|
|
21349
21362
|
type: Component,
|
|
21350
|
-
args: [{ selector: 'app-single-textbox', template: "<div class=\"question-block\">\r\n <div class=\"question-head vx-d-flex vx-mb-4\">\r\n <span class=\"count vx-paragraph-txt vx-fs-20 vx-fw-400\">{{questionIndex}}.</span>\r\n <span class=\"heading vx-pl-3\">\r\n <span class=\"vx-fw-300 vx-label-txt vx-fs-20\" [innerHTML]=\"question?.title=='' ? 'Question' : question?.title\"></span>\r\n <span class=\"required vx-fw-400 vx-txt-red vx-fs-24 vx-ml-2\">*</span>\r\n </span>\r\n </div>\r\n <div class=\"question-details vx-fs-13 vx-paragraph-txt\" *ngIf=\"question?.hasDescription && question?.description?.trim().length > 0 \" [innerHTML]=\"question?.description\"></div>\r\n <div class=\"question-options\">\r\n <input class=\"single-textbox vx-bg-white vx-fs-14 vx-lh-24 vx-paragraph-txt\" type=\"text\" [placeholder]=\"(question?.isPlaceholder === true && question?.placeholder?.trim().length > 0) ? question?.placeholder.trim() : 'Please enter a response'\">\r\n </div>\r\n <div class=\"question-quick-settings\">\r\n <app-quick-settings [question]=\"question\"></app-quick-settings>\r\n </div>\r\n</div>", styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";::ng-deep .question-block{position:relative;margin-bottom:3rem}::ng-deep .question-head{padding-right:4rem}::ng-deep .question-head .count{min-width:1.5rem}::ng-deep .question-head .heading .required{position:relative;top:-.25rem}::ng-deep .question-details{padding-right:4rem;padding-left:2.5rem}::ng-deep .question-options{margin-left:2.5rem;margin-top:1.875rem}::ng-deep .question-options .single-textbox{border:1px solid #DBDBDB;border-radius:.25rem;color:#747576;font-size:13px;height:2.5rem;padding:.5rem .75rem;width:37.5rem;outline:none;transition:all .2s ease-in-out}::ng-deep .question-options .single-textbox:hover,::ng-deep .question-options .single-textbox:focus{border:1px solid #1e5dd3;box-shadow:0 0 5px #1e5dd345}::ng-deep .question-quick-settings{position:absolute;top:-.25rem;right:-
|
|
21363
|
+
args: [{ selector: 'app-single-textbox', template: "<div class=\"question-block\">\r\n <div class=\"question-head vx-d-flex vx-mb-4\">\r\n <span class=\"count vx-paragraph-txt vx-fs-20 vx-fw-400\">{{questionIndex}}.</span>\r\n <span class=\"heading vx-pl-3\">\r\n <span class=\"vx-fw-300 vx-label-txt vx-fs-20\" [innerHTML]=\"question?.title=='' ? 'Question' : question?.title\"></span>\r\n <span class=\"required vx-fw-400 vx-txt-red vx-fs-24 vx-ml-2\">*</span>\r\n </span>\r\n </div>\r\n <div class=\"question-details vx-fs-13 vx-paragraph-txt\" *ngIf=\"question?.hasDescription && question?.description?.trim().length > 0 \" [innerHTML]=\"question?.description\"></div>\r\n <div class=\"question-options\">\r\n <input class=\"single-textbox vx-bg-white vx-fs-14 vx-lh-24 vx-paragraph-txt\" type=\"text\" [placeholder]=\"(question?.isPlaceholder === true && question?.placeholder?.trim().length > 0) ? question?.placeholder.trim() : 'Please enter a response'\">\r\n </div>\r\n <div class=\"question-quick-settings\">\r\n <app-quick-settings [question]=\"question\"></app-quick-settings>\r\n </div>\r\n</div>", styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";::ng-deep .question-block{position:relative;margin-bottom:3rem}::ng-deep .question-head{padding-right:4rem}::ng-deep .question-head .count{min-width:1.5rem}::ng-deep .question-head .heading .required{position:relative;top:-.25rem}::ng-deep .question-details{padding-right:4rem;padding-left:2.5rem}::ng-deep .question-options{margin-left:2.5rem;margin-top:1.875rem}::ng-deep .question-options .single-textbox{border:1px solid #DBDBDB;border-radius:.25rem;color:#747576;font-size:13px;height:2.5rem;padding:.5rem .75rem;width:37.5rem;outline:none;transition:all .2s ease-in-out}::ng-deep .question-options .single-textbox:hover,::ng-deep .question-options .single-textbox:focus{border:1px solid #1e5dd3;box-shadow:0 0 5px #1e5dd345}::ng-deep .question-quick-settings{position:absolute;top:-.25rem;right:-3.75rem}\n"] }]
|
|
21351
21364
|
}], ctorParameters: function () { return []; }, propDecorators: { question: [{
|
|
21352
21365
|
type: Input
|
|
21353
21366
|
}], questionIndex: [{
|
|
@@ -21370,14 +21383,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
21370
21383
|
type: Input
|
|
21371
21384
|
}] } });
|
|
21372
21385
|
|
|
21373
|
-
class WelcomeComponent$
|
|
21386
|
+
class WelcomeComponent$1 {
|
|
21374
21387
|
constructor() { }
|
|
21375
21388
|
ngOnInit() {
|
|
21376
21389
|
}
|
|
21377
21390
|
}
|
|
21378
|
-
WelcomeComponent$
|
|
21379
|
-
WelcomeComponent$
|
|
21380
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: WelcomeComponent$
|
|
21391
|
+
WelcomeComponent$1.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: WelcomeComponent$1, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
21392
|
+
WelcomeComponent$1.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: WelcomeComponent$1, selector: "app-preview-welcome", inputs: { questionDetails: "questionDetails" }, ngImport: i0, template: "<div class=\"welcome-preview vx-text-center vx-mb-5\">\r\n <div class=\"image\" *ngIf=\"questionDetails?.hasWelcomeImage && questionDetails?.welcomeImage !=''\"><img [src]=\"questionDetails?.welcomeImage\" /></div>\r\n <div class=\"heading vx-fs-16 vx-paragraph-txt vx-lih-6 vx-mb-5\" *ngIf=\"questionDetails?.welcomeText\" [innerHTML]=\"questionDetails?.welcomeText\"></div>\r\n <div *ngIf=\"questionDetails?.hasWelcomeDescription\" class=\"details vx-fs-14 vx-label-txt vx-pb-3 vx-mb-5\" [innerHTML]=\"questionDetails?.welcomeDescription\"> </div>\r\n</div>", styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";.welcome-preview .image{width:30rem;margin:0 auto 2rem}.welcome-preview .image img{border-radius:.625rem;width:100%}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
21393
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: WelcomeComponent$1, decorators: [{
|
|
21381
21394
|
type: Component,
|
|
21382
21395
|
args: [{ selector: 'app-preview-welcome', template: "<div class=\"welcome-preview vx-text-center vx-mb-5\">\r\n <div class=\"image\" *ngIf=\"questionDetails?.hasWelcomeImage && questionDetails?.welcomeImage !=''\"><img [src]=\"questionDetails?.welcomeImage\" /></div>\r\n <div class=\"heading vx-fs-16 vx-paragraph-txt vx-lih-6 vx-mb-5\" *ngIf=\"questionDetails?.welcomeText\" [innerHTML]=\"questionDetails?.welcomeText\"></div>\r\n <div *ngIf=\"questionDetails?.hasWelcomeDescription\" class=\"details vx-fs-14 vx-label-txt vx-pb-3 vx-mb-5\" [innerHTML]=\"questionDetails?.welcomeDescription\"> </div>\r\n</div>", styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";.welcome-preview .image{width:30rem;margin:0 auto 2rem}.welcome-preview .image img{border-radius:.625rem;width:100%}\n"] }]
|
|
21383
21396
|
}], ctorParameters: function () { return []; }, propDecorators: { questionDetails: [{
|
|
@@ -21418,10 +21431,10 @@ class PreviewComponent {
|
|
|
21418
21431
|
}
|
|
21419
21432
|
}
|
|
21420
21433
|
PreviewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PreviewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
21421
|
-
PreviewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PreviewComponent, selector: "app-preview", inputs: { questionData: "questionData" }, outputs: { previewBack: "previewBack" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"preview-page\" [class.with-datepicker]=\"false\">\r\n <div class=\"preview-page-heading vx-fs-14 vx-fw-500 vx-label-txt vx-pl-3 vx-pr-3 vx-mb-5 vx-d-flex vx-align-center\">Preview <span class=\"vx-fs-12 vx-paragraph-txt vx-ml-2 vx-d-flex vx-align-center\">(<span class=\"value\" [appTooltip]=\"questionData?.assessment_name\" placement=\"bottom-left\" delay=\"0\" type=\"black\" [tooltipMandatory]=\"false\">{{questionData?.assessment_name}}</span>)</span></div>\r\n\r\n <div class=\"preview-page-mid\" [class.with-tablet]=\"selectedDevice === 'TABLET'\" [class.with-mobile]=\"selectedDevice === 'MOBILE'\">\r\n <div class=\"preview-page-mid-inner\" [class.tablet]=\"selectedDevice === 'TABLET'\" [class.mobile]=\"selectedDevice === 'MOBILE'\">\r\n <ng-container>\r\n <div class=\"mobile-top\" *ngIf=\"false\"></div>\r\n <div class=\"preview-inside\">\r\n <!-- <app-question-welcome></app-question-welcome> -->\r\n <app-page-header *ngIf=\"questionData?.hasWelcome===true\" [pageTitle]=\"'WELCOME SCREEN'\"></app-page-header>\r\n <app-preview-welcome [questionDetails]=\"questionData\" *ngIf=\"questionData?.hasWelcome===true\" ></app-preview-welcome>\r\n <ng-container *ngFor=\"let question of questionData?.questions?.elements;let i = index\">\r\n <app-page-header *ngIf=\"pageData[i]\" [pageDetail]=\"pageData[i]\"></app-page-header>\r\n <app-radio-question *ngIf=\"question.type === 'multiple-choice'\" [question]=\"question\" [questionIndex]=\"i+1\"></app-radio-question>\r\n <app-checkbox-question *ngIf=\"question.type === 'checkbox'\" [question]=\"question\" [questionIndex]=\"i+1\"></app-checkbox-question>\r\n <!-- <app-image-radio-question></app-image-radio-question>\r\n <app-star-rating></app-star-rating> -->\r\n <app-single-textbox *ngIf=\"question.type === 'single-textbox'\" [question]=\"question\" [questionIndex]=\"i+1\"></app-single-textbox>\r\n <!-- <app-comment-question></app-comment-question>\r\n <app-rating-table></app-rating-table> -->\r\n <app-select-question *ngIf=\"question.type === 'dropdown'\" [question]=\"question\" [questionIndex]=\"i+1\"></app-select-question>\r\n <!-- <app-select-option-rating></app-select-option-rating>\r\n <app-ranking></app-ranking>\r\n <app-slider-question></app-slider-question>\r\n <app-multiple-textbox></app-multiple-textbox> -->\r\n <app-date-time *ngIf=\"question.type === 'date-time'\" [question]=\"question\" [questionIndex]=\"i+1\"></app-date-time>\r\n <app-file-upload *ngIf=\"question.type === 'file-upload'\" [question]=\"question\" [questionIndex]=\"i+1\"></app-file-upload>\r\n </ng-container>\r\n </div>\r\n </ng-container>\r\n <div class=\"device-area\"><app-device (deviceChanged)=\"selectedDevice = $event\" [selectedDevice]=\"selectedDevice\"></app-device></div>\r\n </div>\r\n </div>\r\n \r\n <div class=\"preview-page-footer vx-p-3 vx-d-flex vx-align-center vx-justify-between\">\r\n <div class=\"question-count vx-text-center\">\r\n <!-- <div class=\"label vx-fs-12 vx-fw-500 vx-paragraph-txt vx-tt-uppercase vx-mb-1\">1 OF {{questionData?.questions?.elements?.length}} QUESTIONS ANSWERED</div>\r\n <div class=\"question-progress\">\r\n <div class=\"inner-line\" style=\"width: 20%;\"></div>\r\n </div> -->\r\n </div>\r\n <div class=\"vx-d-flex vx-align-center\">\r\n <div class=\"powered-section vx-fs-9 vx-fw-500 vx-txt-blue vx-tt-uppercase vx-pl-2 vx-pr-2 vx-d-flex vx-align-center vx-lh-7\">\r\n POWERED BY <span class=\"vx-fw-700\">VCOMPLY</span> <sup class=\"vx-fw-600\">TM</sup>\r\n </div>\r\n <button (click)=\"previewBack.emit()\" class=\"back vx-fs-11 vx-fw-500 vx-txt-white vx-tt-uppercase vx-p-0 vx-pl-2 vx-pr-2 vx-m-0 vx-ml-1 vx-d-flex vx-align-center vx-justify-center\"><i class=\"icons vx-fs-16 vx-mr-1\"></i> BACK</button>\r\n </div>\r\n </div>\r\n</div>", styles: ["@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";::ng-deep .preview-page{background:#FFFFFF;border-top:3px solid #1E5DD3;position:fixed;top:0;left:0;height:100vh;width:calc(100vw - 3rem);z-index:4}::ng-deep .preview-page.with-datepicker{z-index:11}::ng-deep .preview-page-heading{background:#FBFBFB;border-bottom:1px solid #F1F1F1;height:2.75rem}::ng-deep .preview-page-heading .value{text-overflow:ellipsis;white-space:nowrap;overflow:hidden;display:inline-block;max-width:calc(100vw - 42.5rem)}::ng-deep .preview-page-mid.with-tablet{overflow-y:auto;align-items:unset;padding:3rem 0;height:calc(100vh - 10rem)}::ng-deep .preview-page-mid.with-mobile{overflow-y:auto;align-items:unset;padding:3rem 0;height:calc(100vh - 10rem)}::ng-deep .preview-page-mid-inner .preview-inside{padding:1.5rem 3rem 1.5rem 1.25rem;width:calc(100% - 1.75rem);height:calc(100vh - 9rem);overflow-y:auto;width:52.5rem;margin:0 auto}::ng-deep .preview-page-mid-inner .preview-inside::-webkit-scrollbar-track{background-color:transparent}::ng-deep .preview-page-mid-inner.tablet{border-radius:1.25rem;border:1px solid #f1f1f1;box-shadow:0 6px 12px #1e5dd31a;width:36.25rem;min-height:40.5rem;position:relative;padding:1.25rem 1.25rem 4.25rem;margin:0 auto}::ng-deep .preview-page-mid-inner.tablet:before{border:1px solid #f1f1f1;border-radius:.625rem;content:\"\";position:absolute;top:1rem;left:1rem;width:calc(100% - 2rem);height:calc(100% - 5rem)}::ng-deep .preview-page-mid-inner.tablet:after{background:#DBDBDB;border-radius:50%;content:\"\";position:absolute;bottom:1rem;left:0;right:0;margin:0 auto;width:1.5rem;height:1.5rem}::ng-deep .preview-page-mid-inner.tablet .preview-inside{padding-right:1.25rem;height:calc(100vh + 5rem);width:100%;margin:0 auto}::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-block,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-block,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-block,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-block,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-block,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-block,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-block,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-block,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-block,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-block,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-block,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-block,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-block,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-block{padding:0 .75rem}::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-head,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-head,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-head,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-head,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-head,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-head,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-head,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-head,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-head,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-head,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-head,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-head,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-head,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-head,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-details,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-details,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-details,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-details,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-details,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-details,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-details,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-details,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-details,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-details,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-details,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-details,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-details,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-details{padding-right:3rem}::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-quick-settings,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-quick-settings,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-quick-settings,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-quick-settings,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-quick-settings,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-quick-settings,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-quick-settings,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-quick-settings,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-quick-settings,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-quick-settings,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-quick-settings,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-quick-settings,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-quick-settings,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-quick-settings{right:-.125rem}::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-options,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-options,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-options,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-options,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-options,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-options,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-options,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-options,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-options,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-options,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-options,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-options,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-options,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-options{padding-right:3rem}::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-options .image-row .image-items{width:8rem}::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-options .single-textbox,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-options .single-textbox,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-options .single-textbox,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-options .single-textbox,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-options .single-textbox,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-options .single-textbox,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-options .single-textbox,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-options .single-textbox,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-options .single-textbox,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-options .single-textbox,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-options .single-textbox,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-options .single-textbox,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-options .single-textbox,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-options .single-textbox,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-options .comment-box,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-options .comment-box,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-options .comment-box,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-options .comment-box,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-options .comment-box,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-options .comment-box,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-options .comment-box,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-options .comment-box,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-options .comment-box,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-options .comment-box,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-options .comment-box,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-options .comment-box,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-options .comment-box,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-options .comment-box,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-options .options-area,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-options .options-area,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-options .options-area,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-options .options-area,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-options .options-area,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-options .options-area,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-options .options-area,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-options .options-area,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-options .options-area,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-options .options-area,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-options .options-area,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-options .options-area,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-options .options-area,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-options .options-area,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-options .slider-container,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-options .slider-container,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-options .slider-container,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-options .slider-container,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-options .slider-container,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-options .slider-container,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-options .slider-container,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-options .slider-container,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-options .slider-container,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-options .slider-container,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-options .slider-container,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-options .slider-container,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-options .slider-container,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-options .slider-container,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-options ul,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-options ul,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-options ul,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-options ul,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-options ul,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-options ul,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-options ul,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-options ul,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-options ul,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-options ul,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-options ul,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-options ul,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-options ul,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-options ul,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-options ul.file-list,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-options ul.file-list,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-options ul.file-list,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-options ul.file-list,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-options ul.file-list,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-options ul.file-list,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-options ul.file-list,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-options ul.file-list,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-options ul.file-list,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-options ul.file-list,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-options ul.file-list,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-options ul.file-list,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-options ul.file-list,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-options ul.file-list{width:100%}::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-options .textbox-group,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-options .textbox-group,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-options .textbox-group,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-options .textbox-group,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-options .textbox-group,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-options .textbox-group,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-options .textbox-group,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-options .textbox-group,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-options .textbox-group,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-options .textbox-group,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-options .textbox-group,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-options .textbox-group,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-options .textbox-group,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-options .textbox-group,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-options .custom-file-upload{max-width:100%}::ng-deep .preview-page-mid-inner.mobile{border-radius:1.25rem;border:1px solid #f1f1f1;box-shadow:0 6px 12px #1e5dd31a;width:26.25rem;min-height:40.5rem;position:relative;padding:1.25rem 1.25rem 4.25rem;margin:0 auto}::ng-deep .preview-page-mid-inner.mobile:before{border:1px solid #f1f1f1;border-radius:.625rem;content:\"\";position:absolute;top:1rem;left:1rem;width:calc(100% - 2rem);height:calc(100% - 5rem)}::ng-deep .preview-page-mid-inner.mobile:after{background:#DBDBDB;border-radius:50%;content:\"\";position:absolute;bottom:1rem;left:0;right:0;margin:0 auto;width:1.5rem;height:1.5rem}::ng-deep .preview-page-mid-inner.mobile .mobile-top{background:#f1f1f1;border-radius:0 0 2rem 2rem;position:absolute;top:0;left:0;right:0;margin:0 auto;width:7rem;height:1.5rem}::ng-deep .preview-page-mid-inner.mobile .preview-inside{padding-right:1.25rem;height:calc(100vh + 5rem);width:100%;margin:0 auto}::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-block,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-block,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-block,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-block,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-block,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-block,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-block,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-block,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-block,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-block,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-block,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-block,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-block,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-block{padding:0 .75rem}::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-head,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-head,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-head,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-head,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-head,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-head,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-head,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-head,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-head,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-head,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-head,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-head,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-head,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-head,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-details,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-details,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-details,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-details,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-details,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-details,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-details,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-details,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-details,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-details,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-details,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-details,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-details,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-details{padding-right:3rem}::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-quick-settings,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-quick-settings,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-quick-settings,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-quick-settings,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-quick-settings,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-quick-settings,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-quick-settings,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-quick-settings,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-quick-settings,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-quick-settings,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-quick-settings,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-quick-settings,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-quick-settings,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-quick-settings{right:-.125rem}::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-options,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-options,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-options,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-options,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-options,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-options,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-options,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-options,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-options,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-options,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-options,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-options,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-options,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-options{padding-right:3rem}::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-options .image-row .image-items{width:7rem}::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-options .single-textbox,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-options .single-textbox,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-options .single-textbox,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-options .single-textbox,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-options .single-textbox,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-options .single-textbox,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-options .single-textbox,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-options .single-textbox,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-options .single-textbox,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-options .single-textbox,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-options .single-textbox,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-options .single-textbox,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-options .single-textbox,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-options .single-textbox,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-options .comment-box,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-options .comment-box,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-options .comment-box,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-options .comment-box,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-options .comment-box,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-options .comment-box,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-options .comment-box,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-options .comment-box,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-options .comment-box,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-options .comment-box,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-options .comment-box,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-options .comment-box,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-options .comment-box,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-options .comment-box,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-options .options-area,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-options .options-area,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-options .options-area,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-options .options-area,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-options .options-area,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-options .options-area,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-options .options-area,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-options .options-area,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-options .options-area,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-options .options-area,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-options .options-area,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-options .options-area,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-options .options-area,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-options .options-area,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-options .slider-container,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-options .slider-container,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-options .slider-container,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-options .slider-container,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-options .slider-container,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-options .slider-container,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-options .slider-container,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-options .slider-container,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-options .slider-container,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-options .slider-container,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-options .slider-container,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-options .slider-container,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-options .slider-container,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-options .slider-container,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-options ul,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-options ul,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-options ul,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-options ul,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-options ul,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-options ul,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-options ul,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-options ul,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-options ul,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-options ul,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-options ul,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-options ul,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-options ul,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-options ul,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-options ul.file-list,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-options ul.file-list,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-options ul.file-list,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-options ul.file-list,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-options ul.file-list,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-options ul.file-list,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-options ul.file-list,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-options ul.file-list,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-options ul.file-list,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-options ul.file-list,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-options ul.file-list,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-options ul.file-list,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-options ul.file-list,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-options ul.file-list{width:100%}::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-options .textbox-group,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-options .textbox-group,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-options .textbox-group,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-options .textbox-group,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-options .textbox-group,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-options .textbox-group,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-options .textbox-group,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-options .textbox-group,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-options .textbox-group,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-options .textbox-group,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-options .textbox-group,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-options .textbox-group,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-options .textbox-group,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-options .textbox-group,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-options .custom-file-upload{max-width:100%}::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-options ul li button.rating-btn,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-options ul li button.rating-btn,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-options ul li button.rating-btn,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-options ul li button.rating-btn,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-options ul li button.rating-btn,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-options ul li button.rating-btn,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-options ul li button.rating-btn,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-options ul li button.rating-btn,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-options ul li button.rating-btn,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-options ul li button.rating-btn,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-options ul li button.rating-btn,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-options ul li button.rating-btn,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-options ul li button.rating-btn,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-options ul li button.rating-btn{font-size:1rem;padding:.5rem!important;line-height:1rem}::ng-deep .preview-page-mid-inner .device-area{position:fixed;top:38%;transform:translate(-50%);right:8rem}::ng-deep .preview-page-footer{background:#FFFFFF;border-radius:0 0 .125rem .125rem;box-shadow:0 0 10px #1e5dd326;height:3.25rem;margin-top:1.25rem;position:fixed;left:1rem;bottom:1.5rem;width:calc(100% - 4.75rem)}::ng-deep .preview-page-footer .question-count .question-progress{background:#DBDBDB;border-radius:1.25rem;width:12rem;height:.1875rem}::ng-deep .preview-page-footer .question-count .question-progress .inner-line{background:#34aa44;border-radius:1.25rem;height:.1875rem}::ng-deep .preview-page-footer button{border-radius:.125rem;height:1.75rem}::ng-deep .preview-page-footer button.back{background:#1e5dd3;border:none}::ng-deep .preview-page-footer button.disabled{background:#DBDBDB;color:#747576;pointer-events:none}::ng-deep .preview-page-footer .powered-section{background:#F1F1F1;border-radius:.125rem}::ng-deep .preview-page-footer .powered-section sup{position:relative;top:-.25rem}\n"], dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: ToolTipDirective, selector: "[appTooltip]", inputs: ["appTooltip", "placement", "type", "tooltipMandatory", "showTooltip", "animate"] }, { kind: "component", type: CheckboxQuestionComponent, selector: "app-checkbox-question", inputs: ["question", "questionIndex"] }, { kind: "component", type: DateTimeComponent, selector: "app-date-time", inputs: ["question", "questionIndex"] }, { kind: "component", type: DeviceComponent, selector: "app-device", inputs: ["selectedDevice"], outputs: ["deviceChanged"] }, { kind: "component", type: FileUploadComponent, selector: "app-file-upload", inputs: ["question", "questionIndex"] }, { kind: "component", type: RadioQuestionComponent, selector: "app-radio-question", inputs: ["question", "questionIndex"] }, { kind: "component", type: SelectQuestionComponent, selector: "app-select-question", inputs: ["question", "questionIndex"] }, { kind: "component", type: SingleTextboxComponent, selector: "app-single-textbox", inputs: ["question", "questionIndex"] }, { kind: "component", type: PageHeaderComponent, selector: "app-page-header", inputs: ["pageDetail", "pageTitle"] }, { kind: "component", type: WelcomeComponent$2, selector: "app-preview-welcome", inputs: ["questionDetails"] }] });
|
|
21434
|
+
PreviewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PreviewComponent, selector: "app-preview", inputs: { questionData: "questionData" }, outputs: { previewBack: "previewBack" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"preview-page\" [class.with-datepicker]=\"false\">\r\n <div\r\n class=\"preview-page-heading vx-fs-14 vx-fw-500 vx-label-txt vx-pl-3 vx-pr-3 vx-mb-5 vx-d-flex vx-align-center\"\r\n >\r\n Preview\r\n <span class=\"vx-fs-12 vx-paragraph-txt vx-ml-2 vx-d-flex vx-align-center\"\r\n >(<span\r\n class=\"value\"\r\n [appTooltip]=\"questionData?.assessment_name\"\r\n placement=\"bottom-left\"\r\n delay=\"0\"\r\n type=\"black\"\r\n [tooltipMandatory]=\"false\"\r\n >{{ questionData?.assessment_name }}</span\r\n >)</span\r\n >\r\n </div>\r\n\r\n <div\r\n class=\"preview-page-mid\"\r\n [class.with-tablet]=\"selectedDevice === 'TABLET'\"\r\n [class.with-mobile]=\"selectedDevice === 'MOBILE'\"\r\n >\r\n <div\r\n class=\"preview-page-mid-inner\"\r\n [class.tablet]=\"selectedDevice === 'TABLET'\"\r\n [class.mobile]=\"selectedDevice === 'MOBILE'\"\r\n >\r\n <ng-container>\r\n <div class=\"mobile-top\" *ngIf=\"false\"></div>\r\n <div class=\"preview-inside\">\r\n <!-- <app-question-welcome></app-question-welcome> -->\r\n <app-page-header\r\n *ngIf=\"questionData?.hasWelcome === true\"\r\n [pageTitle]=\"'WELCOME SCREEN'\"\r\n ></app-page-header>\r\n <app-preview-welcome\r\n [questionDetails]=\"questionData\"\r\n *ngIf=\"questionData?.hasWelcome === true\"\r\n ></app-preview-welcome>\r\n <ng-container\r\n *ngFor=\"\r\n let question of questionData?.questions?.elements;\r\n let i = index\r\n \"\r\n >\r\n <app-page-header\r\n *ngIf=\"pageData[i]\"\r\n [pageDetail]=\"pageData[i]\"\r\n ></app-page-header>\r\n <app-radio-question\r\n *ngIf=\"question.type === 'multiple-choice'\"\r\n [question]=\"question\"\r\n [questionIndex]=\"i + 1\"\r\n ></app-radio-question>\r\n <app-checkbox-question\r\n *ngIf=\"question.type === 'checkbox'\"\r\n [question]=\"question\"\r\n [questionIndex]=\"i + 1\"\r\n ></app-checkbox-question>\r\n <!-- <app-image-radio-question></app-image-radio-question>\r\n <app-star-rating></app-star-rating> -->\r\n <app-single-textbox\r\n *ngIf=\"question.type === 'single-textbox'\"\r\n [question]=\"question\"\r\n [questionIndex]=\"i + 1\"\r\n ></app-single-textbox>\r\n <!-- <app-comment-question></app-comment-question>\r\n <app-rating-table></app-rating-table> -->\r\n <app-select-question\r\n *ngIf=\"question.type === 'dropdown'\"\r\n [question]=\"question\"\r\n [questionIndex]=\"i + 1\"\r\n ></app-select-question>\r\n <!-- <app-select-option-rating></app-select-option-rating>\r\n <app-ranking></app-ranking>\r\n <app-slider-question></app-slider-question>\r\n <app-multiple-textbox></app-multiple-textbox> -->\r\n <app-preview-matrix-dropdown\r\n *ngIf=\"question.type === 'matrix-dropdown'\"\r\n [question]=\"question\"\r\n [questionIndex]=\"i + 1\"\r\n ></app-preview-matrix-dropdown>\r\n <app-date-time\r\n *ngIf=\"question.type === 'date-time'\"\r\n [question]=\"question\"\r\n [questionIndex]=\"i + 1\"\r\n ></app-date-time>\r\n <app-file-upload\r\n *ngIf=\"question.type === 'file-upload'\"\r\n [question]=\"question\"\r\n [questionIndex]=\"i + 1\"\r\n ></app-file-upload>\r\n </ng-container>\r\n </div>\r\n </ng-container>\r\n <div class=\"device-area\">\r\n <app-device\r\n (deviceChanged)=\"selectedDevice = $event\"\r\n [selectedDevice]=\"selectedDevice\"\r\n ></app-device>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div\r\n class=\"preview-page-footer vx-p-3 vx-d-flex vx-align-center vx-justify-between\"\r\n >\r\n <div class=\"question-count vx-text-center\">\r\n <!-- <div class=\"label vx-fs-12 vx-fw-500 vx-paragraph-txt vx-tt-uppercase vx-mb-1\">1 OF {{questionData?.questions?.elements?.length}} QUESTIONS ANSWERED</div>\r\n <div class=\"question-progress\">\r\n <div class=\"inner-line\" style=\"width: 20%;\"></div>\r\n </div> -->\r\n </div>\r\n <div class=\"vx-d-flex vx-align-center\">\r\n <div\r\n class=\"powered-section vx-fs-9 vx-fw-500 vx-txt-blue vx-tt-uppercase vx-pl-2 vx-pr-2 vx-d-flex vx-align-center vx-lh-7\"\r\n >\r\n POWERED BY <span class=\"vx-fw-700\">VCOMPLY</span> <sup\r\n class=\"vx-fw-600\"\r\n >TM</sup\r\n >\r\n </div>\r\n <button\r\n (click)=\"previewBack.emit()\"\r\n class=\"back vx-fs-11 vx-fw-500 vx-txt-white vx-tt-uppercase vx-p-0 vx-pl-2 vx-pr-2 vx-m-0 vx-ml-1 vx-d-flex vx-align-center vx-justify-center\"\r\n >\r\n <i class=\"icons vx-fs-16 vx-mr-1\"></i> BACK\r\n </button>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: ["@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";::ng-deep .preview-page{background:#FFFFFF;border-top:3px solid #1E5DD3;position:fixed;top:0;left:0;height:100vh;width:calc(100vw - 3rem);z-index:4}::ng-deep .preview-page.with-datepicker{z-index:11}::ng-deep .preview-page-heading{background:#FBFBFB;border-bottom:1px solid #F1F1F1;height:2.75rem}::ng-deep .preview-page-heading .value{text-overflow:ellipsis;white-space:nowrap;overflow:hidden;display:inline-block;max-width:calc(100vw - 42.5rem)}::ng-deep .preview-page-mid.with-tablet{overflow-y:auto;align-items:unset;padding:3rem 0;height:calc(100vh - 10rem)}::ng-deep .preview-page-mid.with-mobile{overflow-y:auto;align-items:unset;padding:3rem 0;height:calc(100vh - 10rem)}::ng-deep .preview-page-mid-inner .preview-inside{padding:1.5rem 5rem 1.5rem 1.25rem;width:calc(100% - 1.75rem);height:calc(100vh - 9rem);overflow-y:auto;width:52.5rem;margin:0 auto}::ng-deep .preview-page-mid-inner .preview-inside::-webkit-scrollbar-track{background-color:transparent}::ng-deep .preview-page-mid-inner.tablet{border-radius:1.25rem;border:1px solid #f1f1f1;box-shadow:0 6px 12px #1e5dd31a;width:36.25rem;min-height:40.5rem;position:relative;padding:1.25rem 1.25rem 4.25rem;margin:0 auto}::ng-deep .preview-page-mid-inner.tablet:before{border:1px solid #f1f1f1;border-radius:.625rem;content:\"\";position:absolute;top:1rem;left:1rem;width:calc(100% - 2rem);height:calc(100% - 5rem)}::ng-deep .preview-page-mid-inner.tablet:after{background:#DBDBDB;border-radius:50%;content:\"\";position:absolute;bottom:1rem;left:0;right:0;margin:0 auto;width:1.5rem;height:1.5rem}::ng-deep .preview-page-mid-inner.tablet .preview-inside{padding-right:4.25rem;height:calc(100vh + 5rem);width:100%;margin:0 auto}::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-block,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-block,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-block,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-block,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-block,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-block,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-block,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-block,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-block,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-block,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-block,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-block,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-block,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-block,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-preview-matrix-dropdown .question-block{padding:0 .75rem}::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-head,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-head,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-head,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-head,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-head,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-head,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-head,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-head,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-head,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-head,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-head,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-head,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-head,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-head,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-preview-matrix-dropdown .question-head,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-details,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-details,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-details,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-details,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-details,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-details,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-details,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-details,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-details,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-details,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-details,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-details,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-details,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-details,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-preview-matrix-dropdown .question-details{padding-right:3rem}::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-quick-settings,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-quick-settings,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-quick-settings,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-quick-settings,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-quick-settings,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-quick-settings,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-quick-settings,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-quick-settings,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-quick-settings,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-quick-settings,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-quick-settings,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-quick-settings,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-quick-settings,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-quick-settings,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-preview-matrix-dropdown .question-quick-settings{right:-2.75rem}::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-options,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-options,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-options,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-options,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-options,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-options,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-options,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-options,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-options,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-options,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-options,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-options,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-options,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-options,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-preview-matrix-dropdown .question-options{padding-right:3rem}::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-preview-matrix-dropdown .question-options .image-row .image-items{width:8rem}::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-options .single-textbox,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-options .single-textbox,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-options .single-textbox,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-options .single-textbox,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-options .single-textbox,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-options .single-textbox,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-options .single-textbox,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-options .single-textbox,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-options .single-textbox,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-options .single-textbox,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-options .single-textbox,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-options .single-textbox,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-options .single-textbox,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-options .single-textbox,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-preview-matrix-dropdown .question-options .single-textbox,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-options .comment-box,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-options .comment-box,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-options .comment-box,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-options .comment-box,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-options .comment-box,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-options .comment-box,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-options .comment-box,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-options .comment-box,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-options .comment-box,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-options .comment-box,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-options .comment-box,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-options .comment-box,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-options .comment-box,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-options .comment-box,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-preview-matrix-dropdown .question-options .comment-box,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-preview-matrix-dropdown .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-options .options-area,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-options .options-area,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-options .options-area,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-options .options-area,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-options .options-area,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-options .options-area,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-options .options-area,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-options .options-area,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-options .options-area,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-options .options-area,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-options .options-area,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-options .options-area,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-options .options-area,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-options .options-area,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-preview-matrix-dropdown .question-options .options-area,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-preview-matrix-dropdown .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-options .slider-container,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-options .slider-container,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-options .slider-container,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-options .slider-container,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-options .slider-container,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-options .slider-container,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-options .slider-container,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-options .slider-container,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-options .slider-container,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-options .slider-container,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-options .slider-container,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-options .slider-container,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-options .slider-container,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-options .slider-container,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-preview-matrix-dropdown .question-options .slider-container,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-options ul,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-options ul,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-options ul,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-options ul,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-options ul,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-options ul,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-options ul,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-options ul,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-options ul,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-options ul,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-options ul,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-options ul,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-options ul,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-options ul,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-preview-matrix-dropdown .question-options ul,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-options ul.file-list,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-options ul.file-list,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-options ul.file-list,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-options ul.file-list,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-options ul.file-list,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-options ul.file-list,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-options ul.file-list,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-options ul.file-list,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-options ul.file-list,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-options ul.file-list,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-options ul.file-list,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-options ul.file-list,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-options ul.file-list,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-options ul.file-list,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-preview-matrix-dropdown .question-options ul.file-list{width:100%}::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-options .textbox-group,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-options .textbox-group,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-options .textbox-group,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-options .textbox-group,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-options .textbox-group,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-options .textbox-group,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-options .textbox-group,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-options .textbox-group,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-options .textbox-group,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-options .textbox-group,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-options .textbox-group,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-options .textbox-group,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-options .textbox-group,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-options .textbox-group,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-preview-matrix-dropdown .question-options .textbox-group,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-preview-matrix-dropdown .question-options .custom-file-upload{max-width:100%}::ng-deep .preview-page-mid-inner.mobile{border-radius:1.25rem;border:1px solid #f1f1f1;box-shadow:0 6px 12px #1e5dd31a;width:26.25rem;min-height:40.5rem;position:relative;padding:1.25rem 1.25rem 4.25rem;margin:0 auto}::ng-deep .preview-page-mid-inner.mobile:before{border:1px solid #f1f1f1;border-radius:.625rem;content:\"\";position:absolute;top:1rem;left:1rem;width:calc(100% - 2rem);height:calc(100% - 5rem)}::ng-deep .preview-page-mid-inner.mobile:after{background:#DBDBDB;border-radius:50%;content:\"\";position:absolute;bottom:1rem;left:0;right:0;margin:0 auto;width:1.5rem;height:1.5rem}::ng-deep .preview-page-mid-inner.mobile .mobile-top{background:#f1f1f1;border-radius:0 0 2rem 2rem;position:absolute;top:0;left:0;right:0;margin:0 auto;width:7rem;height:1.5rem}::ng-deep .preview-page-mid-inner.mobile .preview-inside{padding-right:1.25rem;height:calc(100vh + 5rem);width:100%;margin:0 auto}::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-block,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-block,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-block,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-block,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-block,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-block,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-block,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-block,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-block,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-block,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-block,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-block,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-block,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-block{padding:0 .75rem}::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-head,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-head,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-head,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-head,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-head,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-head,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-head,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-head,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-head,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-head,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-head,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-head,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-head,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-head,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-details,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-details,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-details,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-details,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-details,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-details,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-details,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-details,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-details,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-details,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-details,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-details,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-details,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-details{padding-right:3rem}::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-quick-settings,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-quick-settings,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-quick-settings,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-quick-settings,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-quick-settings,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-quick-settings,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-quick-settings,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-quick-settings,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-quick-settings,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-quick-settings,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-quick-settings,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-quick-settings,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-quick-settings,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-quick-settings{right:-.25rem}::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-options,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-options,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-options,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-options,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-options,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-options,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-options,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-options,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-options,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-options,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-options,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-options,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-options,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-options{padding-right:3rem}::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-options .image-row .image-items{width:7rem}::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-options .single-textbox,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-options .single-textbox,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-options .single-textbox,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-options .single-textbox,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-options .single-textbox,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-options .single-textbox,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-options .single-textbox,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-options .single-textbox,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-options .single-textbox,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-options .single-textbox,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-options .single-textbox,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-options .single-textbox,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-options .single-textbox,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-options .single-textbox,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-options .comment-box,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-options .comment-box,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-options .comment-box,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-options .comment-box,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-options .comment-box,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-options .comment-box,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-options .comment-box,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-options .comment-box,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-options .comment-box,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-options .comment-box,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-options .comment-box,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-options .comment-box,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-options .comment-box,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-options .comment-box,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-options .options-area,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-options .options-area,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-options .options-area,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-options .options-area,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-options .options-area,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-options .options-area,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-options .options-area,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-options .options-area,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-options .options-area,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-options .options-area,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-options .options-area,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-options .options-area,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-options .options-area,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-options .options-area,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-options .slider-container,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-options .slider-container,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-options .slider-container,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-options .slider-container,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-options .slider-container,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-options .slider-container,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-options .slider-container,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-options .slider-container,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-options .slider-container,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-options .slider-container,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-options .slider-container,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-options .slider-container,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-options .slider-container,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-options .slider-container,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-options ul,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-options ul,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-options ul,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-options ul,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-options ul,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-options ul,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-options ul,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-options ul,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-options ul,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-options ul,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-options ul,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-options ul,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-options ul,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-options ul,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-options ul.file-list,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-options ul.file-list,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-options ul.file-list,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-options ul.file-list,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-options ul.file-list,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-options ul.file-list,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-options ul.file-list,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-options ul.file-list,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-options ul.file-list,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-options ul.file-list,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-options ul.file-list,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-options ul.file-list,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-options ul.file-list,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-options ul.file-list{width:100%}::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-options .textbox-group,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-options .textbox-group,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-options .textbox-group,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-options .textbox-group,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-options .textbox-group,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-options .textbox-group,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-options .textbox-group,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-options .textbox-group,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-options .textbox-group,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-options .textbox-group,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-options .textbox-group,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-options .textbox-group,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-options .textbox-group,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-options .textbox-group,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-options .custom-file-upload{max-width:100%}::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-options ul li button.rating-btn,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-options ul li button.rating-btn,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-options ul li button.rating-btn,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-options ul li button.rating-btn,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-options ul li button.rating-btn,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-options ul li button.rating-btn,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-options ul li button.rating-btn,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-options ul li button.rating-btn,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-options ul li button.rating-btn,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-options ul li button.rating-btn,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-options ul li button.rating-btn,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-options ul li button.rating-btn,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-options ul li button.rating-btn,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-options ul li button.rating-btn{font-size:1rem;padding:.5rem!important;line-height:1rem}::ng-deep .preview-page-mid-inner.mobile .preview-inside app-preview-matrix-dropdown .preview-list{width:90%}::ng-deep .preview-page-mid-inner.mobile .preview-inside app-preview-matrix-dropdown .preview-list .matrix-dropdown-table .matrix-table-row .left{width:8rem}::ng-deep .preview-page-mid-inner.mobile .preview-inside app-preview-matrix-dropdown .preview-list .matrix-dropdown-table .matrix-table-row .right{width:calc(100% - 8rem)}::ng-deep .preview-page-mid-inner.mobile .preview-inside app-preview-matrix-dropdown .preview-list .question-quick-settings{right:-2.5rem}::ng-deep .preview-page-mid-inner .device-area{position:fixed;top:38%;transform:translate(-50%);right:8rem}::ng-deep .preview-page-footer{background:#FFFFFF;border-radius:0 0 .125rem .125rem;box-shadow:0 0 10px #1e5dd326;height:3.25rem;margin-top:1.25rem;position:fixed;left:1rem;bottom:1.5rem;width:calc(100% - 4.75rem)}::ng-deep .preview-page-footer .question-count .question-progress{background:#DBDBDB;border-radius:1.25rem;width:12rem;height:.1875rem}::ng-deep .preview-page-footer .question-count .question-progress .inner-line{background:#34aa44;border-radius:1.25rem;height:.1875rem}::ng-deep .preview-page-footer button{border-radius:.125rem;height:1.75rem}::ng-deep .preview-page-footer button.back{background:#1e5dd3;border:none}::ng-deep .preview-page-footer button.disabled{background:#DBDBDB;color:#747576;pointer-events:none}::ng-deep .preview-page-footer .powered-section{background:#F1F1F1;border-radius:.125rem}::ng-deep .preview-page-footer .powered-section sup{position:relative;top:-.25rem}\n"], dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: ToolTipDirective, selector: "[appTooltip]", inputs: ["appTooltip", "placement", "type", "tooltipMandatory", "showTooltip", "animate"] }, { kind: "component", type: PreviewMatrixDropdownComponent, selector: "app-preview-matrix-dropdown", inputs: ["question", "questionIndex"] }, { kind: "component", type: WelcomeComponent$2, selector: "app-preview-welcome" }, { kind: "component", type: CheckboxQuestionComponent, selector: "app-checkbox-question", inputs: ["question", "questionIndex"] }, { kind: "component", type: DateTimeComponent, selector: "app-date-time", inputs: ["question", "questionIndex"] }, { kind: "component", type: DeviceComponent, selector: "app-device", inputs: ["selectedDevice"], outputs: ["deviceChanged"] }, { kind: "component", type: FileUploadComponent, selector: "app-file-upload", inputs: ["question", "questionIndex"] }, { kind: "component", type: RadioQuestionComponent, selector: "app-radio-question", inputs: ["question", "questionIndex"] }, { kind: "component", type: SelectQuestionComponent, selector: "app-select-question", inputs: ["question", "questionIndex"] }, { kind: "component", type: SingleTextboxComponent, selector: "app-single-textbox", inputs: ["question", "questionIndex"] }, { kind: "component", type: PageHeaderComponent, selector: "app-page-header", inputs: ["pageDetail", "pageTitle"] }, { kind: "component", type: WelcomeComponent$1, selector: "app-preview-welcome", inputs: ["questionDetails"] }] });
|
|
21422
21435
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PreviewComponent, decorators: [{
|
|
21423
21436
|
type: Component,
|
|
21424
|
-
args: [{ selector: 'app-preview', template: "<div class=\"preview-page\" [class.with-datepicker]=\"false\">\r\n <div class=\"preview-page-heading vx-fs-14 vx-fw-500 vx-label-txt vx-pl-3 vx-pr-3 vx-mb-5 vx-d-flex vx-align-center\">Preview <span class=\"vx-fs-12 vx-paragraph-txt vx-ml-2 vx-d-flex vx-align-center\">(<span class=\"value\" [appTooltip]=\"questionData?.assessment_name\" placement=\"bottom-left\" delay=\"0\" type=\"black\" [tooltipMandatory]=\"false\">{{questionData?.assessment_name}}</span>)</span></div>\r\n\r\n <div class=\"preview-page-mid\" [class.with-tablet]=\"selectedDevice === 'TABLET'\" [class.with-mobile]=\"selectedDevice === 'MOBILE'\">\r\n <div class=\"preview-page-mid-inner\" [class.tablet]=\"selectedDevice === 'TABLET'\" [class.mobile]=\"selectedDevice === 'MOBILE'\">\r\n <ng-container>\r\n <div class=\"mobile-top\" *ngIf=\"false\"></div>\r\n <div class=\"preview-inside\">\r\n <!-- <app-question-welcome></app-question-welcome> -->\r\n <app-page-header *ngIf=\"questionData?.hasWelcome===true\" [pageTitle]=\"'WELCOME SCREEN'\"></app-page-header>\r\n <app-preview-welcome [questionDetails]=\"questionData\" *ngIf=\"questionData?.hasWelcome===true\" ></app-preview-welcome>\r\n <ng-container *ngFor=\"let question of questionData?.questions?.elements;let i = index\">\r\n <app-page-header *ngIf=\"pageData[i]\" [pageDetail]=\"pageData[i]\"></app-page-header>\r\n <app-radio-question *ngIf=\"question.type === 'multiple-choice'\" [question]=\"question\" [questionIndex]=\"i+1\"></app-radio-question>\r\n <app-checkbox-question *ngIf=\"question.type === 'checkbox'\" [question]=\"question\" [questionIndex]=\"i+1\"></app-checkbox-question>\r\n <!-- <app-image-radio-question></app-image-radio-question>\r\n <app-star-rating></app-star-rating> -->\r\n <app-single-textbox *ngIf=\"question.type === 'single-textbox'\" [question]=\"question\" [questionIndex]=\"i+1\"></app-single-textbox>\r\n <!-- <app-comment-question></app-comment-question>\r\n <app-rating-table></app-rating-table> -->\r\n <app-select-question *ngIf=\"question.type === 'dropdown'\" [question]=\"question\" [questionIndex]=\"i+1\"></app-select-question>\r\n <!-- <app-select-option-rating></app-select-option-rating>\r\n <app-ranking></app-ranking>\r\n <app-slider-question></app-slider-question>\r\n <app-multiple-textbox></app-multiple-textbox> -->\r\n <app-date-time *ngIf=\"question.type === 'date-time'\" [question]=\"question\" [questionIndex]=\"i+1\"></app-date-time>\r\n <app-file-upload *ngIf=\"question.type === 'file-upload'\" [question]=\"question\" [questionIndex]=\"i+1\"></app-file-upload>\r\n </ng-container>\r\n </div>\r\n </ng-container>\r\n <div class=\"device-area\"><app-device (deviceChanged)=\"selectedDevice = $event\" [selectedDevice]=\"selectedDevice\"></app-device></div>\r\n </div>\r\n </div>\r\n \r\n <div class=\"preview-page-footer vx-p-3 vx-d-flex vx-align-center vx-justify-between\">\r\n <div class=\"question-count vx-text-center\">\r\n <!-- <div class=\"label vx-fs-12 vx-fw-500 vx-paragraph-txt vx-tt-uppercase vx-mb-1\">1 OF {{questionData?.questions?.elements?.length}} QUESTIONS ANSWERED</div>\r\n <div class=\"question-progress\">\r\n <div class=\"inner-line\" style=\"width: 20%;\"></div>\r\n </div> -->\r\n </div>\r\n <div class=\"vx-d-flex vx-align-center\">\r\n <div class=\"powered-section vx-fs-9 vx-fw-500 vx-txt-blue vx-tt-uppercase vx-pl-2 vx-pr-2 vx-d-flex vx-align-center vx-lh-7\">\r\n POWERED BY <span class=\"vx-fw-700\">VCOMPLY</span> <sup class=\"vx-fw-600\">TM</sup>\r\n </div>\r\n <button (click)=\"previewBack.emit()\" class=\"back vx-fs-11 vx-fw-500 vx-txt-white vx-tt-uppercase vx-p-0 vx-pl-2 vx-pr-2 vx-m-0 vx-ml-1 vx-d-flex vx-align-center vx-justify-center\"><i class=\"icons vx-fs-16 vx-mr-1\"></i> BACK</button>\r\n </div>\r\n </div>\r\n</div>", styles: ["@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";::ng-deep .preview-page{background:#FFFFFF;border-top:3px solid #1E5DD3;position:fixed;top:0;left:0;height:100vh;width:calc(100vw - 3rem);z-index:4}::ng-deep .preview-page.with-datepicker{z-index:11}::ng-deep .preview-page-heading{background:#FBFBFB;border-bottom:1px solid #F1F1F1;height:2.75rem}::ng-deep .preview-page-heading .value{text-overflow:ellipsis;white-space:nowrap;overflow:hidden;display:inline-block;max-width:calc(100vw - 42.5rem)}::ng-deep .preview-page-mid.with-tablet{overflow-y:auto;align-items:unset;padding:3rem 0;height:calc(100vh - 10rem)}::ng-deep .preview-page-mid.with-mobile{overflow-y:auto;align-items:unset;padding:3rem 0;height:calc(100vh - 10rem)}::ng-deep .preview-page-mid-inner .preview-inside{padding:1.5rem 3rem 1.5rem 1.25rem;width:calc(100% - 1.75rem);height:calc(100vh - 9rem);overflow-y:auto;width:52.5rem;margin:0 auto}::ng-deep .preview-page-mid-inner .preview-inside::-webkit-scrollbar-track{background-color:transparent}::ng-deep .preview-page-mid-inner.tablet{border-radius:1.25rem;border:1px solid #f1f1f1;box-shadow:0 6px 12px #1e5dd31a;width:36.25rem;min-height:40.5rem;position:relative;padding:1.25rem 1.25rem 4.25rem;margin:0 auto}::ng-deep .preview-page-mid-inner.tablet:before{border:1px solid #f1f1f1;border-radius:.625rem;content:\"\";position:absolute;top:1rem;left:1rem;width:calc(100% - 2rem);height:calc(100% - 5rem)}::ng-deep .preview-page-mid-inner.tablet:after{background:#DBDBDB;border-radius:50%;content:\"\";position:absolute;bottom:1rem;left:0;right:0;margin:0 auto;width:1.5rem;height:1.5rem}::ng-deep .preview-page-mid-inner.tablet .preview-inside{padding-right:1.25rem;height:calc(100vh + 5rem);width:100%;margin:0 auto}::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-block,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-block,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-block,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-block,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-block,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-block,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-block,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-block,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-block,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-block,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-block,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-block,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-block,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-block{padding:0 .75rem}::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-head,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-head,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-head,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-head,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-head,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-head,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-head,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-head,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-head,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-head,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-head,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-head,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-head,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-head,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-details,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-details,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-details,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-details,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-details,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-details,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-details,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-details,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-details,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-details,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-details,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-details,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-details,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-details{padding-right:3rem}::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-quick-settings,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-quick-settings,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-quick-settings,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-quick-settings,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-quick-settings,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-quick-settings,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-quick-settings,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-quick-settings,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-quick-settings,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-quick-settings,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-quick-settings,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-quick-settings,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-quick-settings,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-quick-settings{right:-.125rem}::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-options,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-options,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-options,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-options,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-options,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-options,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-options,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-options,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-options,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-options,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-options,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-options,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-options,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-options{padding-right:3rem}::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-options .image-row .image-items{width:8rem}::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-options .single-textbox,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-options .single-textbox,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-options .single-textbox,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-options .single-textbox,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-options .single-textbox,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-options .single-textbox,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-options .single-textbox,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-options .single-textbox,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-options .single-textbox,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-options .single-textbox,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-options .single-textbox,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-options .single-textbox,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-options .single-textbox,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-options .single-textbox,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-options .comment-box,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-options .comment-box,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-options .comment-box,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-options .comment-box,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-options .comment-box,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-options .comment-box,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-options .comment-box,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-options .comment-box,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-options .comment-box,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-options .comment-box,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-options .comment-box,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-options .comment-box,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-options .comment-box,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-options .comment-box,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-options .options-area,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-options .options-area,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-options .options-area,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-options .options-area,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-options .options-area,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-options .options-area,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-options .options-area,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-options .options-area,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-options .options-area,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-options .options-area,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-options .options-area,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-options .options-area,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-options .options-area,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-options .options-area,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-options .slider-container,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-options .slider-container,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-options .slider-container,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-options .slider-container,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-options .slider-container,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-options .slider-container,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-options .slider-container,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-options .slider-container,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-options .slider-container,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-options .slider-container,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-options .slider-container,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-options .slider-container,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-options .slider-container,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-options .slider-container,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-options ul,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-options ul,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-options ul,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-options ul,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-options ul,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-options ul,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-options ul,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-options ul,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-options ul,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-options ul,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-options ul,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-options ul,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-options ul,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-options ul,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-options ul.file-list,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-options ul.file-list,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-options ul.file-list,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-options ul.file-list,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-options ul.file-list,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-options ul.file-list,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-options ul.file-list,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-options ul.file-list,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-options ul.file-list,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-options ul.file-list,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-options ul.file-list,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-options ul.file-list,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-options ul.file-list,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-options ul.file-list{width:100%}::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-options .textbox-group,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-options .textbox-group,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-options .textbox-group,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-options .textbox-group,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-options .textbox-group,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-options .textbox-group,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-options .textbox-group,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-options .textbox-group,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-options .textbox-group,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-options .textbox-group,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-options .textbox-group,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-options .textbox-group,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-options .textbox-group,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-options .textbox-group,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-options .custom-file-upload{max-width:100%}::ng-deep .preview-page-mid-inner.mobile{border-radius:1.25rem;border:1px solid #f1f1f1;box-shadow:0 6px 12px #1e5dd31a;width:26.25rem;min-height:40.5rem;position:relative;padding:1.25rem 1.25rem 4.25rem;margin:0 auto}::ng-deep .preview-page-mid-inner.mobile:before{border:1px solid #f1f1f1;border-radius:.625rem;content:\"\";position:absolute;top:1rem;left:1rem;width:calc(100% - 2rem);height:calc(100% - 5rem)}::ng-deep .preview-page-mid-inner.mobile:after{background:#DBDBDB;border-radius:50%;content:\"\";position:absolute;bottom:1rem;left:0;right:0;margin:0 auto;width:1.5rem;height:1.5rem}::ng-deep .preview-page-mid-inner.mobile .mobile-top{background:#f1f1f1;border-radius:0 0 2rem 2rem;position:absolute;top:0;left:0;right:0;margin:0 auto;width:7rem;height:1.5rem}::ng-deep .preview-page-mid-inner.mobile .preview-inside{padding-right:1.25rem;height:calc(100vh + 5rem);width:100%;margin:0 auto}::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-block,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-block,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-block,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-block,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-block,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-block,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-block,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-block,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-block,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-block,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-block,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-block,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-block,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-block{padding:0 .75rem}::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-head,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-head,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-head,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-head,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-head,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-head,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-head,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-head,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-head,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-head,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-head,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-head,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-head,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-head,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-details,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-details,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-details,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-details,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-details,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-details,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-details,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-details,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-details,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-details,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-details,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-details,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-details,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-details{padding-right:3rem}::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-quick-settings,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-quick-settings,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-quick-settings,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-quick-settings,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-quick-settings,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-quick-settings,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-quick-settings,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-quick-settings,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-quick-settings,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-quick-settings,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-quick-settings,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-quick-settings,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-quick-settings,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-quick-settings{right:-.125rem}::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-options,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-options,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-options,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-options,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-options,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-options,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-options,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-options,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-options,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-options,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-options,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-options,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-options,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-options{padding-right:3rem}::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-options .image-row .image-items{width:7rem}::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-options .single-textbox,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-options .single-textbox,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-options .single-textbox,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-options .single-textbox,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-options .single-textbox,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-options .single-textbox,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-options .single-textbox,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-options .single-textbox,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-options .single-textbox,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-options .single-textbox,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-options .single-textbox,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-options .single-textbox,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-options .single-textbox,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-options .single-textbox,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-options .comment-box,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-options .comment-box,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-options .comment-box,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-options .comment-box,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-options .comment-box,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-options .comment-box,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-options .comment-box,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-options .comment-box,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-options .comment-box,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-options .comment-box,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-options .comment-box,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-options .comment-box,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-options .comment-box,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-options .comment-box,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-options .options-area,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-options .options-area,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-options .options-area,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-options .options-area,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-options .options-area,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-options .options-area,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-options .options-area,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-options .options-area,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-options .options-area,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-options .options-area,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-options .options-area,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-options .options-area,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-options .options-area,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-options .options-area,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-options .slider-container,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-options .slider-container,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-options .slider-container,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-options .slider-container,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-options .slider-container,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-options .slider-container,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-options .slider-container,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-options .slider-container,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-options .slider-container,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-options .slider-container,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-options .slider-container,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-options .slider-container,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-options .slider-container,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-options .slider-container,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-options ul,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-options ul,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-options ul,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-options ul,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-options ul,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-options ul,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-options ul,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-options ul,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-options ul,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-options ul,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-options ul,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-options ul,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-options ul,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-options ul,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-options ul.file-list,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-options ul.file-list,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-options ul.file-list,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-options ul.file-list,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-options ul.file-list,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-options ul.file-list,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-options ul.file-list,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-options ul.file-list,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-options ul.file-list,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-options ul.file-list,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-options ul.file-list,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-options ul.file-list,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-options ul.file-list,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-options ul.file-list{width:100%}::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-options .textbox-group,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-options .textbox-group,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-options .textbox-group,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-options .textbox-group,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-options .textbox-group,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-options .textbox-group,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-options .textbox-group,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-options .textbox-group,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-options .textbox-group,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-options .textbox-group,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-options .textbox-group,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-options .textbox-group,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-options .textbox-group,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-options .textbox-group,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-options .custom-file-upload{max-width:100%}::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-options ul li button.rating-btn,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-options ul li button.rating-btn,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-options ul li button.rating-btn,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-options ul li button.rating-btn,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-options ul li button.rating-btn,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-options ul li button.rating-btn,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-options ul li button.rating-btn,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-options ul li button.rating-btn,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-options ul li button.rating-btn,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-options ul li button.rating-btn,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-options ul li button.rating-btn,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-options ul li button.rating-btn,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-options ul li button.rating-btn,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-options ul li button.rating-btn{font-size:1rem;padding:.5rem!important;line-height:1rem}::ng-deep .preview-page-mid-inner .device-area{position:fixed;top:38%;transform:translate(-50%);right:8rem}::ng-deep .preview-page-footer{background:#FFFFFF;border-radius:0 0 .125rem .125rem;box-shadow:0 0 10px #1e5dd326;height:3.25rem;margin-top:1.25rem;position:fixed;left:1rem;bottom:1.5rem;width:calc(100% - 4.75rem)}::ng-deep .preview-page-footer .question-count .question-progress{background:#DBDBDB;border-radius:1.25rem;width:12rem;height:.1875rem}::ng-deep .preview-page-footer .question-count .question-progress .inner-line{background:#34aa44;border-radius:1.25rem;height:.1875rem}::ng-deep .preview-page-footer button{border-radius:.125rem;height:1.75rem}::ng-deep .preview-page-footer button.back{background:#1e5dd3;border:none}::ng-deep .preview-page-footer button.disabled{background:#DBDBDB;color:#747576;pointer-events:none}::ng-deep .preview-page-footer .powered-section{background:#F1F1F1;border-radius:.125rem}::ng-deep .preview-page-footer .powered-section sup{position:relative;top:-.25rem}\n"] }]
|
|
21437
|
+
args: [{ selector: 'app-preview', template: "<div class=\"preview-page\" [class.with-datepicker]=\"false\">\r\n <div\r\n class=\"preview-page-heading vx-fs-14 vx-fw-500 vx-label-txt vx-pl-3 vx-pr-3 vx-mb-5 vx-d-flex vx-align-center\"\r\n >\r\n Preview\r\n <span class=\"vx-fs-12 vx-paragraph-txt vx-ml-2 vx-d-flex vx-align-center\"\r\n >(<span\r\n class=\"value\"\r\n [appTooltip]=\"questionData?.assessment_name\"\r\n placement=\"bottom-left\"\r\n delay=\"0\"\r\n type=\"black\"\r\n [tooltipMandatory]=\"false\"\r\n >{{ questionData?.assessment_name }}</span\r\n >)</span\r\n >\r\n </div>\r\n\r\n <div\r\n class=\"preview-page-mid\"\r\n [class.with-tablet]=\"selectedDevice === 'TABLET'\"\r\n [class.with-mobile]=\"selectedDevice === 'MOBILE'\"\r\n >\r\n <div\r\n class=\"preview-page-mid-inner\"\r\n [class.tablet]=\"selectedDevice === 'TABLET'\"\r\n [class.mobile]=\"selectedDevice === 'MOBILE'\"\r\n >\r\n <ng-container>\r\n <div class=\"mobile-top\" *ngIf=\"false\"></div>\r\n <div class=\"preview-inside\">\r\n <!-- <app-question-welcome></app-question-welcome> -->\r\n <app-page-header\r\n *ngIf=\"questionData?.hasWelcome === true\"\r\n [pageTitle]=\"'WELCOME SCREEN'\"\r\n ></app-page-header>\r\n <app-preview-welcome\r\n [questionDetails]=\"questionData\"\r\n *ngIf=\"questionData?.hasWelcome === true\"\r\n ></app-preview-welcome>\r\n <ng-container\r\n *ngFor=\"\r\n let question of questionData?.questions?.elements;\r\n let i = index\r\n \"\r\n >\r\n <app-page-header\r\n *ngIf=\"pageData[i]\"\r\n [pageDetail]=\"pageData[i]\"\r\n ></app-page-header>\r\n <app-radio-question\r\n *ngIf=\"question.type === 'multiple-choice'\"\r\n [question]=\"question\"\r\n [questionIndex]=\"i + 1\"\r\n ></app-radio-question>\r\n <app-checkbox-question\r\n *ngIf=\"question.type === 'checkbox'\"\r\n [question]=\"question\"\r\n [questionIndex]=\"i + 1\"\r\n ></app-checkbox-question>\r\n <!-- <app-image-radio-question></app-image-radio-question>\r\n <app-star-rating></app-star-rating> -->\r\n <app-single-textbox\r\n *ngIf=\"question.type === 'single-textbox'\"\r\n [question]=\"question\"\r\n [questionIndex]=\"i + 1\"\r\n ></app-single-textbox>\r\n <!-- <app-comment-question></app-comment-question>\r\n <app-rating-table></app-rating-table> -->\r\n <app-select-question\r\n *ngIf=\"question.type === 'dropdown'\"\r\n [question]=\"question\"\r\n [questionIndex]=\"i + 1\"\r\n ></app-select-question>\r\n <!-- <app-select-option-rating></app-select-option-rating>\r\n <app-ranking></app-ranking>\r\n <app-slider-question></app-slider-question>\r\n <app-multiple-textbox></app-multiple-textbox> -->\r\n <app-preview-matrix-dropdown\r\n *ngIf=\"question.type === 'matrix-dropdown'\"\r\n [question]=\"question\"\r\n [questionIndex]=\"i + 1\"\r\n ></app-preview-matrix-dropdown>\r\n <app-date-time\r\n *ngIf=\"question.type === 'date-time'\"\r\n [question]=\"question\"\r\n [questionIndex]=\"i + 1\"\r\n ></app-date-time>\r\n <app-file-upload\r\n *ngIf=\"question.type === 'file-upload'\"\r\n [question]=\"question\"\r\n [questionIndex]=\"i + 1\"\r\n ></app-file-upload>\r\n </ng-container>\r\n </div>\r\n </ng-container>\r\n <div class=\"device-area\">\r\n <app-device\r\n (deviceChanged)=\"selectedDevice = $event\"\r\n [selectedDevice]=\"selectedDevice\"\r\n ></app-device>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div\r\n class=\"preview-page-footer vx-p-3 vx-d-flex vx-align-center vx-justify-between\"\r\n >\r\n <div class=\"question-count vx-text-center\">\r\n <!-- <div class=\"label vx-fs-12 vx-fw-500 vx-paragraph-txt vx-tt-uppercase vx-mb-1\">1 OF {{questionData?.questions?.elements?.length}} QUESTIONS ANSWERED</div>\r\n <div class=\"question-progress\">\r\n <div class=\"inner-line\" style=\"width: 20%;\"></div>\r\n </div> -->\r\n </div>\r\n <div class=\"vx-d-flex vx-align-center\">\r\n <div\r\n class=\"powered-section vx-fs-9 vx-fw-500 vx-txt-blue vx-tt-uppercase vx-pl-2 vx-pr-2 vx-d-flex vx-align-center vx-lh-7\"\r\n >\r\n POWERED BY <span class=\"vx-fw-700\">VCOMPLY</span> <sup\r\n class=\"vx-fw-600\"\r\n >TM</sup\r\n >\r\n </div>\r\n <button\r\n (click)=\"previewBack.emit()\"\r\n class=\"back vx-fs-11 vx-fw-500 vx-txt-white vx-tt-uppercase vx-p-0 vx-pl-2 vx-pr-2 vx-m-0 vx-ml-1 vx-d-flex vx-align-center vx-justify-center\"\r\n >\r\n <i class=\"icons vx-fs-16 vx-mr-1\"></i> BACK\r\n </button>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: ["@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";::ng-deep .preview-page{background:#FFFFFF;border-top:3px solid #1E5DD3;position:fixed;top:0;left:0;height:100vh;width:calc(100vw - 3rem);z-index:4}::ng-deep .preview-page.with-datepicker{z-index:11}::ng-deep .preview-page-heading{background:#FBFBFB;border-bottom:1px solid #F1F1F1;height:2.75rem}::ng-deep .preview-page-heading .value{text-overflow:ellipsis;white-space:nowrap;overflow:hidden;display:inline-block;max-width:calc(100vw - 42.5rem)}::ng-deep .preview-page-mid.with-tablet{overflow-y:auto;align-items:unset;padding:3rem 0;height:calc(100vh - 10rem)}::ng-deep .preview-page-mid.with-mobile{overflow-y:auto;align-items:unset;padding:3rem 0;height:calc(100vh - 10rem)}::ng-deep .preview-page-mid-inner .preview-inside{padding:1.5rem 5rem 1.5rem 1.25rem;width:calc(100% - 1.75rem);height:calc(100vh - 9rem);overflow-y:auto;width:52.5rem;margin:0 auto}::ng-deep .preview-page-mid-inner .preview-inside::-webkit-scrollbar-track{background-color:transparent}::ng-deep .preview-page-mid-inner.tablet{border-radius:1.25rem;border:1px solid #f1f1f1;box-shadow:0 6px 12px #1e5dd31a;width:36.25rem;min-height:40.5rem;position:relative;padding:1.25rem 1.25rem 4.25rem;margin:0 auto}::ng-deep .preview-page-mid-inner.tablet:before{border:1px solid #f1f1f1;border-radius:.625rem;content:\"\";position:absolute;top:1rem;left:1rem;width:calc(100% - 2rem);height:calc(100% - 5rem)}::ng-deep .preview-page-mid-inner.tablet:after{background:#DBDBDB;border-radius:50%;content:\"\";position:absolute;bottom:1rem;left:0;right:0;margin:0 auto;width:1.5rem;height:1.5rem}::ng-deep .preview-page-mid-inner.tablet .preview-inside{padding-right:4.25rem;height:calc(100vh + 5rem);width:100%;margin:0 auto}::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-block,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-block,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-block,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-block,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-block,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-block,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-block,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-block,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-block,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-block,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-block,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-block,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-block,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-block,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-preview-matrix-dropdown .question-block{padding:0 .75rem}::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-head,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-head,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-head,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-head,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-head,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-head,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-head,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-head,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-head,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-head,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-head,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-head,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-head,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-head,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-preview-matrix-dropdown .question-head,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-details,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-details,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-details,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-details,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-details,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-details,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-details,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-details,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-details,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-details,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-details,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-details,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-details,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-details,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-preview-matrix-dropdown .question-details{padding-right:3rem}::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-quick-settings,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-quick-settings,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-quick-settings,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-quick-settings,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-quick-settings,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-quick-settings,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-quick-settings,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-quick-settings,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-quick-settings,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-quick-settings,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-quick-settings,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-quick-settings,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-quick-settings,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-quick-settings,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-preview-matrix-dropdown .question-quick-settings{right:-2.75rem}::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-options,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-options,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-options,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-options,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-options,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-options,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-options,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-options,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-options,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-options,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-options,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-options,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-options,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-options,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-preview-matrix-dropdown .question-options{padding-right:3rem}::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-preview-matrix-dropdown .question-options .image-row .image-items{width:8rem}::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-options .single-textbox,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-options .single-textbox,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-options .single-textbox,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-options .single-textbox,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-options .single-textbox,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-options .single-textbox,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-options .single-textbox,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-options .single-textbox,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-options .single-textbox,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-options .single-textbox,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-options .single-textbox,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-options .single-textbox,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-options .single-textbox,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-options .single-textbox,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-preview-matrix-dropdown .question-options .single-textbox,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-options .comment-box,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-options .comment-box,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-options .comment-box,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-options .comment-box,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-options .comment-box,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-options .comment-box,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-options .comment-box,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-options .comment-box,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-options .comment-box,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-options .comment-box,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-options .comment-box,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-options .comment-box,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-options .comment-box,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-options .comment-box,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-preview-matrix-dropdown .question-options .comment-box,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-preview-matrix-dropdown .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-options .options-area,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-options .options-area,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-options .options-area,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-options .options-area,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-options .options-area,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-options .options-area,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-options .options-area,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-options .options-area,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-options .options-area,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-options .options-area,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-options .options-area,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-options .options-area,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-options .options-area,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-options .options-area,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-preview-matrix-dropdown .question-options .options-area,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-preview-matrix-dropdown .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-options .slider-container,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-options .slider-container,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-options .slider-container,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-options .slider-container,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-options .slider-container,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-options .slider-container,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-options .slider-container,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-options .slider-container,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-options .slider-container,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-options .slider-container,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-options .slider-container,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-options .slider-container,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-options .slider-container,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-options .slider-container,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-preview-matrix-dropdown .question-options .slider-container,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-options ul,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-options ul,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-options ul,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-options ul,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-options ul,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-options ul,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-options ul,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-options ul,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-options ul,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-options ul,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-options ul,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-options ul,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-options ul,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-options ul,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-preview-matrix-dropdown .question-options ul,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-options ul.file-list,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-options ul.file-list,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-options ul.file-list,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-options ul.file-list,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-options ul.file-list,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-options ul.file-list,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-options ul.file-list,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-options ul.file-list,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-options ul.file-list,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-options ul.file-list,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-options ul.file-list,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-options ul.file-list,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-options ul.file-list,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-options ul.file-list,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-preview-matrix-dropdown .question-options ul.file-list{width:100%}::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-options .textbox-group,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-options .textbox-group,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-options .textbox-group,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-options .textbox-group,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-options .textbox-group,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-options .textbox-group,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-options .textbox-group,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-options .textbox-group,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-options .textbox-group,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-options .textbox-group,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-options .textbox-group,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-options .textbox-group,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-options .textbox-group,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-options .textbox-group,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-preview-matrix-dropdown .question-options .textbox-group,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-radio-question .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-checkbox-question .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-image-radio-question .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-star-rating .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-single-textbox .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-comment-question .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-rating-table .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-question .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-select-option-rating .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-ranking .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-slider-question .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-multiple-textbox .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-date-time .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-file-upload .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.tablet .preview-inside app-preview-matrix-dropdown .question-options .custom-file-upload{max-width:100%}::ng-deep .preview-page-mid-inner.mobile{border-radius:1.25rem;border:1px solid #f1f1f1;box-shadow:0 6px 12px #1e5dd31a;width:26.25rem;min-height:40.5rem;position:relative;padding:1.25rem 1.25rem 4.25rem;margin:0 auto}::ng-deep .preview-page-mid-inner.mobile:before{border:1px solid #f1f1f1;border-radius:.625rem;content:\"\";position:absolute;top:1rem;left:1rem;width:calc(100% - 2rem);height:calc(100% - 5rem)}::ng-deep .preview-page-mid-inner.mobile:after{background:#DBDBDB;border-radius:50%;content:\"\";position:absolute;bottom:1rem;left:0;right:0;margin:0 auto;width:1.5rem;height:1.5rem}::ng-deep .preview-page-mid-inner.mobile .mobile-top{background:#f1f1f1;border-radius:0 0 2rem 2rem;position:absolute;top:0;left:0;right:0;margin:0 auto;width:7rem;height:1.5rem}::ng-deep .preview-page-mid-inner.mobile .preview-inside{padding-right:1.25rem;height:calc(100vh + 5rem);width:100%;margin:0 auto}::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-block,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-block,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-block,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-block,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-block,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-block,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-block,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-block,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-block,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-block,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-block,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-block,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-block,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-block{padding:0 .75rem}::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-head,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-head,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-head,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-head,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-head,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-head,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-head,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-head,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-head,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-head,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-head,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-head,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-head,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-head,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-details,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-details,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-details,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-details,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-details,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-details,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-details,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-details,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-details,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-details,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-details,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-details,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-details,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-details{padding-right:3rem}::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-quick-settings,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-quick-settings,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-quick-settings,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-quick-settings,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-quick-settings,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-quick-settings,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-quick-settings,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-quick-settings,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-quick-settings,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-quick-settings,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-quick-settings,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-quick-settings,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-quick-settings,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-quick-settings{right:-.25rem}::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-options,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-options,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-options,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-options,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-options,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-options,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-options,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-options,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-options,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-options,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-options,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-options,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-options,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-options{padding-right:3rem}::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-options .image-row .image-items,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-options .image-row .image-items{width:7rem}::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-options .single-textbox,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-options .single-textbox,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-options .single-textbox,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-options .single-textbox,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-options .single-textbox,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-options .single-textbox,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-options .single-textbox,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-options .single-textbox,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-options .single-textbox,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-options .single-textbox,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-options .single-textbox,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-options .single-textbox,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-options .single-textbox,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-options .single-textbox,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-options .comment-box,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-options .comment-box,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-options .comment-box,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-options .comment-box,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-options .comment-box,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-options .comment-box,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-options .comment-box,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-options .comment-box,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-options .comment-box,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-options .comment-box,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-options .comment-box,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-options .comment-box,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-options .comment-box,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-options .comment-box,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-options .question-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-options .options-area,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-options .options-area,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-options .options-area,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-options .options-area,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-options .options-area,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-options .options-area,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-options .options-area,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-options .options-area,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-options .options-area,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-options .options-area,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-options .options-area,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-options .options-area,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-options .options-area,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-options .options-area,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-options .select-rating-table,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-options .slider-container,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-options .slider-container,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-options .slider-container,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-options .slider-container,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-options .slider-container,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-options .slider-container,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-options .slider-container,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-options .slider-container,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-options .slider-container,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-options .slider-container,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-options .slider-container,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-options .slider-container,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-options .slider-container,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-options .slider-container,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-options ul,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-options ul,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-options ul,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-options ul,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-options ul,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-options ul,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-options ul,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-options ul,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-options ul,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-options ul,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-options ul,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-options ul,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-options ul,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-options ul,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-options ul.file-list,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-options ul.file-list,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-options ul.file-list,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-options ul.file-list,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-options ul.file-list,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-options ul.file-list,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-options ul.file-list,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-options ul.file-list,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-options ul.file-list,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-options ul.file-list,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-options ul.file-list,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-options ul.file-list,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-options ul.file-list,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-options ul.file-list{width:100%}::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-options .textbox-group,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-options .textbox-group,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-options .textbox-group,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-options .textbox-group,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-options .textbox-group,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-options .textbox-group,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-options .textbox-group,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-options .textbox-group,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-options .textbox-group,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-options .textbox-group,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-options .textbox-group,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-options .textbox-group,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-options .textbox-group,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-options .textbox-group,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-options .custom-file-upload,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-options .custom-file-upload{max-width:100%}::ng-deep .preview-page-mid-inner.mobile .preview-inside app-radio-question .question-options ul li button.rating-btn,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-checkbox-question .question-options ul li button.rating-btn,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-image-radio-question .question-options ul li button.rating-btn,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-star-rating .question-options ul li button.rating-btn,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-single-textbox .question-options ul li button.rating-btn,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-comment-question .question-options ul li button.rating-btn,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-rating-table .question-options ul li button.rating-btn,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-question .question-options ul li button.rating-btn,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-select-option-rating .question-options ul li button.rating-btn,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-ranking .question-options ul li button.rating-btn,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-slider-question .question-options ul li button.rating-btn,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-multiple-textbox .question-options ul li button.rating-btn,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-date-time .question-options ul li button.rating-btn,::ng-deep .preview-page-mid-inner.mobile .preview-inside app-file-upload .question-options ul li button.rating-btn{font-size:1rem;padding:.5rem!important;line-height:1rem}::ng-deep .preview-page-mid-inner.mobile .preview-inside app-preview-matrix-dropdown .preview-list{width:90%}::ng-deep .preview-page-mid-inner.mobile .preview-inside app-preview-matrix-dropdown .preview-list .matrix-dropdown-table .matrix-table-row .left{width:8rem}::ng-deep .preview-page-mid-inner.mobile .preview-inside app-preview-matrix-dropdown .preview-list .matrix-dropdown-table .matrix-table-row .right{width:calc(100% - 8rem)}::ng-deep .preview-page-mid-inner.mobile .preview-inside app-preview-matrix-dropdown .preview-list .question-quick-settings{right:-2.5rem}::ng-deep .preview-page-mid-inner .device-area{position:fixed;top:38%;transform:translate(-50%);right:8rem}::ng-deep .preview-page-footer{background:#FFFFFF;border-radius:0 0 .125rem .125rem;box-shadow:0 0 10px #1e5dd326;height:3.25rem;margin-top:1.25rem;position:fixed;left:1rem;bottom:1.5rem;width:calc(100% - 4.75rem)}::ng-deep .preview-page-footer .question-count .question-progress{background:#DBDBDB;border-radius:1.25rem;width:12rem;height:.1875rem}::ng-deep .preview-page-footer .question-count .question-progress .inner-line{background:#34aa44;border-radius:1.25rem;height:.1875rem}::ng-deep .preview-page-footer button{border-radius:.125rem;height:1.75rem}::ng-deep .preview-page-footer button.back{background:#1e5dd3;border:none}::ng-deep .preview-page-footer button.disabled{background:#DBDBDB;color:#747576;pointer-events:none}::ng-deep .preview-page-footer .powered-section{background:#F1F1F1;border-radius:.125rem}::ng-deep .preview-page-footer .powered-section sup{position:relative;top:-.25rem}\n"] }]
|
|
21425
21438
|
}], ctorParameters: function () { return []; }, propDecorators: { questionData: [{
|
|
21426
21439
|
type: Input
|
|
21427
21440
|
}], previewBack: [{
|
|
@@ -40359,6 +40372,136 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
40359
40372
|
args: [{ selector: 'app-preview-container', template: "<div class=\"preview-body\">\r\n <div class=\"preview-heading vx-bg-white vx-d-flex vx-align-center vx-pt-2 vx-pb-2 vx-pl-3 vx-pr-3\">\r\n <div class=\"vx-avatar-group vx-align-center vx-mr-2\">\r\n <div class=\"vx-avatar md\">\r\n <span class=\"blue\" [appTooltip]=\"'Harshvardhan Kariwala'\" placement=\"bottom-left\" delay=\"0\" type=\"black\" [tooltipMandatory]=\"true\">Hk</span>\r\n <img *ngIf=\"false\" src=\"https://s3-eu-west-1.amazonaws.com/eu.v-comply.com/profile_pic/thumb/1591875227667_vcomply.png\" alt=\"\" [appTooltip]=\"'Harshvardhan Kariwala'\" placement=\"bottom-left\" delay=\"0\" type=\"black\" [tooltipMandatory]=\"true\">\r\n </div>\r\n <div class=\"vx-avatar md\">\r\n <span class=\"green\" [appTooltip]=\"'Harshvardhan Kariwala'\" placement=\"bottom-left\" delay=\"0\" type=\"black\" [tooltipMandatory]=\"true\">Hk</span>\r\n <img *ngIf=\"false\" src=\"https://s3-eu-west-1.amazonaws.com/eu.v-comply.com/profile_pic/thumb/1591875227667_vcomply.png\" alt=\"\" [appTooltip]=\"'Harshvardhan Kariwala'\" placement=\"bottom-left\" delay=\"0\" type=\"black\" [tooltipMandatory]=\"true\">\r\n </div>\r\n </div>\r\n <i class=\"icons star vx-fs-12 vx-mr-2\" [class.active]=\"false\"></i>\r\n <div class=\"name\">\r\n <div class=\"id vx-fs-11 vx-fw-500 vx-paragraph-txt vx-tt-uppercase vx-lh-4\">[CID-19110027]</div>\r\n <div class=\"value vx-fs-14 vx-labl-txt vx-pr-5 vx-lh-5\" [appTooltip]=\"'Data Protection Impact Assessment (DPIA) (RSK-10)'\" placement=\"bottom-left\" delay=\"0\" type=\"black\" [tooltipMandatory]=\"false\">Data Protection Impact Assessment (DPIA) (RSK-10)</div>\r\n </div>\r\n </div>\r\n <!-- <app-preview-details></app-preview-details> -->\r\n <div class=\"preview-inner vx-mt-1 vx-mb-5 vx-pt-5\">\r\n <div class=\"inside vx-pt-5\">\r\n <!-- <app-question-welcome></app-question-welcome> -->\r\n <app-radio-question></app-radio-question>\r\n <app-checkbox-question></app-checkbox-question>\r\n <!-- <app-image-radio-question></app-image-radio-question>\r\n <app-star-rating></app-star-rating> -->\r\n <app-single-textbox></app-single-textbox>\r\n <!-- <app-comment-question></app-comment-question>\r\n <app-rating-table></app-rating-table> -->\r\n <app-select-question></app-select-question>\r\n <!-- <app-select-option-rating></app-select-option-rating>\r\n <app-ranking></app-ranking>\r\n <app-slider-question></app-slider-question>\r\n <app-multiple-textbox></app-multiple-textbox> -->\r\n <app-date-time></app-date-time>\r\n <app-file-upload></app-file-upload>\r\n </div>\r\n <div *ngIf=\"false\" class=\"inside vx-pt-5\">\r\n <!-- <app-question-loader></app-question-loader> -->\r\n </div>\r\n </div>\r\n</div>", styles: ["@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";.preview-heading{border-radius:.125rem}.preview-heading i.star{color:#dbdbdb}.preview-heading i.star.active{color:#f0b819}.preview-heading .name{width:calc(100% - 5rem)}.preview-heading .name .value{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.preview-inner{background:#FFFFFF;border-radius:.125rem;padding-right:5rem;padding-left:4.375rem;height:calc(100vh - 16.25rem)}.preview-inner .inside{padding-right:5rem;height:calc(100% - 1.25rem);overflow-y:auto}.preview-inner .inside::-webkit-scrollbar-track{background-color:transparent}\n"] }]
|
|
40360
40373
|
}], ctorParameters: function () { return []; } });
|
|
40361
40374
|
|
|
40375
|
+
class ThankYouComponent$1 {
|
|
40376
|
+
constructor() { }
|
|
40377
|
+
ngOnInit() {
|
|
40378
|
+
}
|
|
40379
|
+
}
|
|
40380
|
+
ThankYouComponent$1.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ThankYouComponent$1, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
40381
|
+
ThankYouComponent$1.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ThankYouComponent$1, selector: "app-thank-you", ngImport: i0, template: "<div class=\"thank-you-preview vx-text-center vx-mt-5\">\r\n <div class=\"image\"><img src=\"https://s3-eu-west-1.amazonaws.com/eu.v-comply.com/o/5e481a5d61ca5e14f5731049/survey/61ee3c97a973170009458150/welcome/202011270933381643024815820.png\" /></div>\r\n <div class=\"heading vx-fs-16 vx-paragraph-txt vx-lih-6 vx-mb-5\">Thank you heading</div>\r\n <div class=\"details vx-fs-14 vx-label-txt vx-pb-3 vx-mb-5\">In publishing and graphic design, Lorem ipsum is a placeholder text commonly used to demonstrate the visual form of a document or a typeface without relying on meaningful content. Lorem ipsum may be used as a placeholder before the final copy is available.</div>\r\n</div>", styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";.thank-you-preview .image{width:30rem;margin:0 auto 2rem}.thank-you-preview .image img{border-radius:.625rem;width:100%}\n"] });
|
|
40382
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ThankYouComponent$1, decorators: [{
|
|
40383
|
+
type: Component,
|
|
40384
|
+
args: [{ selector: 'app-thank-you', template: "<div class=\"thank-you-preview vx-text-center vx-mt-5\">\r\n <div class=\"image\"><img src=\"https://s3-eu-west-1.amazonaws.com/eu.v-comply.com/o/5e481a5d61ca5e14f5731049/survey/61ee3c97a973170009458150/welcome/202011270933381643024815820.png\" /></div>\r\n <div class=\"heading vx-fs-16 vx-paragraph-txt vx-lih-6 vx-mb-5\">Thank you heading</div>\r\n <div class=\"details vx-fs-14 vx-label-txt vx-pb-3 vx-mb-5\">In publishing and graphic design, Lorem ipsum is a placeholder text commonly used to demonstrate the visual form of a document or a typeface without relying on meaningful content. Lorem ipsum may be used as a placeholder before the final copy is available.</div>\r\n</div>", styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";.thank-you-preview .image{width:30rem;margin:0 auto 2rem}.thank-you-preview .image img{border-radius:.625rem;width:100%}\n"] }]
|
|
40385
|
+
}], ctorParameters: function () { return []; } });
|
|
40386
|
+
|
|
40387
|
+
// import { SelectModule } from 'src/app/ui-kit/select/select.module';
|
|
40388
|
+
class PreviewModule {
|
|
40389
|
+
}
|
|
40390
|
+
PreviewModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PreviewModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
40391
|
+
PreviewModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.3.0", ngImport: i0, type: PreviewModule, declarations: [PreviewWrapperComponent,
|
|
40392
|
+
PreviewMultipleChoiceComponent,
|
|
40393
|
+
PreviewCheckboxComponent,
|
|
40394
|
+
PreviewImageChoiceComponent,
|
|
40395
|
+
PreviewStarRatingComponent,
|
|
40396
|
+
PreviewSingleTextboxComponent,
|
|
40397
|
+
PreviewCommentBoxComponent,
|
|
40398
|
+
PreviewMatrixDropdownComponent,
|
|
40399
|
+
PreviewDropdownComponent,
|
|
40400
|
+
PreviewMatrixRatingScaleComponent,
|
|
40401
|
+
PreviewRankingComponent,
|
|
40402
|
+
PreviewSliderComponent,
|
|
40403
|
+
PreviewMultipleTextboxComponent,
|
|
40404
|
+
PreviewDateTimeComponent,
|
|
40405
|
+
PreviewFileUploadComponent,
|
|
40406
|
+
WelcomeComponent$2,
|
|
40407
|
+
ThankYouComponent$1], imports: [CommonModule,
|
|
40408
|
+
TooltipModule,
|
|
40409
|
+
PopoverModule,
|
|
40410
|
+
DialogModule,
|
|
40411
|
+
// MarxEditorModule,
|
|
40412
|
+
VcomplyEditorModule,
|
|
40413
|
+
FormgroupModule,
|
|
40414
|
+
NoDataModule$1,
|
|
40415
|
+
DpDatePickerModule,
|
|
40416
|
+
NgxMaterialTimepickerModule,
|
|
40417
|
+
SelectModule,
|
|
40418
|
+
QuickSettingsComponent$1], exports: [PreviewWrapperComponent,
|
|
40419
|
+
PreviewMultipleChoiceComponent,
|
|
40420
|
+
PreviewCheckboxComponent,
|
|
40421
|
+
PreviewImageChoiceComponent,
|
|
40422
|
+
PreviewStarRatingComponent,
|
|
40423
|
+
PreviewSingleTextboxComponent,
|
|
40424
|
+
PreviewCommentBoxComponent,
|
|
40425
|
+
PreviewMatrixDropdownComponent,
|
|
40426
|
+
PreviewDropdownComponent,
|
|
40427
|
+
PreviewMatrixRatingScaleComponent,
|
|
40428
|
+
PreviewRankingComponent,
|
|
40429
|
+
PreviewSliderComponent,
|
|
40430
|
+
PreviewMultipleTextboxComponent,
|
|
40431
|
+
PreviewDateTimeComponent,
|
|
40432
|
+
PreviewFileUploadComponent,
|
|
40433
|
+
WelcomeComponent$2,
|
|
40434
|
+
ThankYouComponent$1] });
|
|
40435
|
+
PreviewModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PreviewModule, imports: [CommonModule,
|
|
40436
|
+
TooltipModule,
|
|
40437
|
+
PopoverModule,
|
|
40438
|
+
DialogModule,
|
|
40439
|
+
// MarxEditorModule,
|
|
40440
|
+
VcomplyEditorModule,
|
|
40441
|
+
FormgroupModule,
|
|
40442
|
+
NoDataModule$1,
|
|
40443
|
+
DpDatePickerModule,
|
|
40444
|
+
NgxMaterialTimepickerModule,
|
|
40445
|
+
SelectModule,
|
|
40446
|
+
QuickSettingsComponent$1] });
|
|
40447
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PreviewModule, decorators: [{
|
|
40448
|
+
type: NgModule,
|
|
40449
|
+
args: [{
|
|
40450
|
+
declarations: [
|
|
40451
|
+
PreviewWrapperComponent,
|
|
40452
|
+
PreviewMultipleChoiceComponent,
|
|
40453
|
+
PreviewCheckboxComponent,
|
|
40454
|
+
PreviewImageChoiceComponent,
|
|
40455
|
+
PreviewStarRatingComponent,
|
|
40456
|
+
PreviewSingleTextboxComponent,
|
|
40457
|
+
PreviewCommentBoxComponent,
|
|
40458
|
+
PreviewMatrixDropdownComponent,
|
|
40459
|
+
PreviewDropdownComponent,
|
|
40460
|
+
PreviewMatrixRatingScaleComponent,
|
|
40461
|
+
PreviewRankingComponent,
|
|
40462
|
+
PreviewSliderComponent,
|
|
40463
|
+
PreviewMultipleTextboxComponent,
|
|
40464
|
+
PreviewDateTimeComponent,
|
|
40465
|
+
PreviewFileUploadComponent,
|
|
40466
|
+
WelcomeComponent$2,
|
|
40467
|
+
ThankYouComponent$1,
|
|
40468
|
+
],
|
|
40469
|
+
imports: [
|
|
40470
|
+
CommonModule,
|
|
40471
|
+
TooltipModule,
|
|
40472
|
+
PopoverModule,
|
|
40473
|
+
DialogModule,
|
|
40474
|
+
// MarxEditorModule,
|
|
40475
|
+
VcomplyEditorModule,
|
|
40476
|
+
FormgroupModule,
|
|
40477
|
+
NoDataModule$1,
|
|
40478
|
+
DpDatePickerModule,
|
|
40479
|
+
NgxMaterialTimepickerModule,
|
|
40480
|
+
SelectModule,
|
|
40481
|
+
QuickSettingsComponent$1,
|
|
40482
|
+
],
|
|
40483
|
+
exports: [
|
|
40484
|
+
PreviewWrapperComponent,
|
|
40485
|
+
PreviewMultipleChoiceComponent,
|
|
40486
|
+
PreviewCheckboxComponent,
|
|
40487
|
+
PreviewImageChoiceComponent,
|
|
40488
|
+
PreviewStarRatingComponent,
|
|
40489
|
+
PreviewSingleTextboxComponent,
|
|
40490
|
+
PreviewCommentBoxComponent,
|
|
40491
|
+
PreviewMatrixDropdownComponent,
|
|
40492
|
+
PreviewDropdownComponent,
|
|
40493
|
+
PreviewMatrixRatingScaleComponent,
|
|
40494
|
+
PreviewRankingComponent,
|
|
40495
|
+
PreviewSliderComponent,
|
|
40496
|
+
PreviewMultipleTextboxComponent,
|
|
40497
|
+
PreviewDateTimeComponent,
|
|
40498
|
+
PreviewFileUploadComponent,
|
|
40499
|
+
WelcomeComponent$2,
|
|
40500
|
+
ThankYouComponent$1,
|
|
40501
|
+
],
|
|
40502
|
+
}]
|
|
40503
|
+
}] });
|
|
40504
|
+
|
|
40362
40505
|
class AssessmentPreviewModule {
|
|
40363
40506
|
}
|
|
40364
40507
|
AssessmentPreviewModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: AssessmentPreviewModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
@@ -40368,33 +40511,35 @@ AssessmentPreviewModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0",
|
|
|
40368
40511
|
FileUploadComponent,
|
|
40369
40512
|
PreviewComponent,
|
|
40370
40513
|
PreviewContainerComponent,
|
|
40371
|
-
QuickSettingsComponent,
|
|
40372
40514
|
RadioQuestionComponent,
|
|
40373
40515
|
SelectQuestionComponent,
|
|
40374
40516
|
SingleTextboxComponent,
|
|
40375
40517
|
PageHeaderComponent,
|
|
40376
|
-
WelcomeComponent$
|
|
40518
|
+
WelcomeComponent$1], imports: [CommonModule,
|
|
40377
40519
|
TooltipModule,
|
|
40378
40520
|
FormgroupModule$1,
|
|
40379
40521
|
PopoverModule,
|
|
40380
40522
|
NgxMaterialTimepickerModule,
|
|
40381
|
-
DpDatePickerModule
|
|
40523
|
+
DpDatePickerModule,
|
|
40524
|
+
PreviewModule,
|
|
40525
|
+
QuickSettingsComponent$1], exports: [CheckboxQuestionComponent,
|
|
40382
40526
|
DateTimeComponent,
|
|
40383
40527
|
DeviceComponent,
|
|
40384
40528
|
FileUploadComponent,
|
|
40385
40529
|
PreviewComponent,
|
|
40386
40530
|
PreviewContainerComponent,
|
|
40387
|
-
QuickSettingsComponent,
|
|
40388
40531
|
RadioQuestionComponent,
|
|
40389
40532
|
SelectQuestionComponent,
|
|
40390
40533
|
SingleTextboxComponent,
|
|
40391
|
-
WelcomeComponent$
|
|
40534
|
+
WelcomeComponent$1] });
|
|
40392
40535
|
AssessmentPreviewModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: AssessmentPreviewModule, imports: [CommonModule,
|
|
40393
40536
|
TooltipModule,
|
|
40394
40537
|
FormgroupModule$1,
|
|
40395
40538
|
PopoverModule,
|
|
40396
40539
|
NgxMaterialTimepickerModule,
|
|
40397
|
-
DpDatePickerModule
|
|
40540
|
+
DpDatePickerModule,
|
|
40541
|
+
PreviewModule,
|
|
40542
|
+
QuickSettingsComponent$1] });
|
|
40398
40543
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: AssessmentPreviewModule, decorators: [{
|
|
40399
40544
|
type: NgModule,
|
|
40400
40545
|
args: [{
|
|
@@ -40405,12 +40550,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
40405
40550
|
FileUploadComponent,
|
|
40406
40551
|
PreviewComponent,
|
|
40407
40552
|
PreviewContainerComponent,
|
|
40408
|
-
QuickSettingsComponent,
|
|
40409
40553
|
RadioQuestionComponent,
|
|
40410
40554
|
SelectQuestionComponent,
|
|
40411
40555
|
SingleTextboxComponent,
|
|
40412
40556
|
PageHeaderComponent,
|
|
40413
|
-
WelcomeComponent$
|
|
40557
|
+
WelcomeComponent$1,
|
|
40414
40558
|
],
|
|
40415
40559
|
imports: [
|
|
40416
40560
|
CommonModule,
|
|
@@ -40419,6 +40563,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
40419
40563
|
PopoverModule,
|
|
40420
40564
|
NgxMaterialTimepickerModule,
|
|
40421
40565
|
DpDatePickerModule,
|
|
40566
|
+
PreviewModule,
|
|
40567
|
+
QuickSettingsComponent$1,
|
|
40422
40568
|
],
|
|
40423
40569
|
exports: [
|
|
40424
40570
|
CheckboxQuestionComponent,
|
|
@@ -40427,35 +40573,34 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
40427
40573
|
FileUploadComponent,
|
|
40428
40574
|
PreviewComponent,
|
|
40429
40575
|
PreviewContainerComponent,
|
|
40430
|
-
QuickSettingsComponent,
|
|
40431
40576
|
RadioQuestionComponent,
|
|
40432
40577
|
SelectQuestionComponent,
|
|
40433
40578
|
SingleTextboxComponent,
|
|
40434
|
-
WelcomeComponent$
|
|
40435
|
-
]
|
|
40579
|
+
WelcomeComponent$1,
|
|
40580
|
+
],
|
|
40436
40581
|
}]
|
|
40437
40582
|
}] });
|
|
40438
40583
|
|
|
40439
|
-
class WelcomeComponent
|
|
40584
|
+
class WelcomeComponent {
|
|
40440
40585
|
constructor() { }
|
|
40441
40586
|
ngOnInit() {
|
|
40442
40587
|
}
|
|
40443
40588
|
}
|
|
40444
|
-
WelcomeComponent
|
|
40445
|
-
WelcomeComponent
|
|
40446
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: WelcomeComponent
|
|
40589
|
+
WelcomeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: WelcomeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
40590
|
+
WelcomeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: WelcomeComponent, selector: "app-welcome", ngImport: i0, template: "<div class=\"build-welcome vx-d-flex vx-align-center vx-justify-center vx-mb-5\">\r\n <div class=\"build-welcome-inner\">\r\n <div class=\"image vx-mb-5\">\r\n <img src=\"https://cdn.v-comply.com/libraries/workflow-engine/assets/assessment-editor/placeholder.jpg\" alt=\"\" />\r\n </div>\r\n <div class=\"upload-btn vx-fs-11 vx-fw-500 vx-txt-white vx-tt-uppercase vx-d-flex vx-align-center vx-justify-center\">\r\n <input type=\"file\" /> Upload Image\r\n </div>\r\n </div>\r\n</div>", styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";.build-welcome-inner .image{border:.125rem solid #F1F1F1;border-radius:.125rem;width:18.75rem;height:12.75rem}.build-welcome-inner .image img{width:100%;height:100%}.build-welcome-inner .upload-btn{background:#1e5dd3;border-radius:.125rem;border:none;width:10rem;height:2.5rem;margin:0 auto;position:relative}.build-welcome-inner .upload-btn input[type=file]{position:absolute;inset:0;margin:0;width:100%;height:100%;text-indent:-9999px;opacity:0;cursor:pointer}\n"] });
|
|
40591
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: WelcomeComponent, decorators: [{
|
|
40447
40592
|
type: Component,
|
|
40448
40593
|
args: [{ selector: 'app-welcome', template: "<div class=\"build-welcome vx-d-flex vx-align-center vx-justify-center vx-mb-5\">\r\n <div class=\"build-welcome-inner\">\r\n <div class=\"image vx-mb-5\">\r\n <img src=\"https://cdn.v-comply.com/libraries/workflow-engine/assets/assessment-editor/placeholder.jpg\" alt=\"\" />\r\n </div>\r\n <div class=\"upload-btn vx-fs-11 vx-fw-500 vx-txt-white vx-tt-uppercase vx-d-flex vx-align-center vx-justify-center\">\r\n <input type=\"file\" /> Upload Image\r\n </div>\r\n </div>\r\n</div>", styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";.build-welcome-inner .image{border:.125rem solid #F1F1F1;border-radius:.125rem;width:18.75rem;height:12.75rem}.build-welcome-inner .image img{width:100%;height:100%}.build-welcome-inner .upload-btn{background:#1e5dd3;border-radius:.125rem;border:none;width:10rem;height:2.5rem;margin:0 auto;position:relative}.build-welcome-inner .upload-btn input[type=file]{position:absolute;inset:0;margin:0;width:100%;height:100%;text-indent:-9999px;opacity:0;cursor:pointer}\n"] }]
|
|
40449
40594
|
}], ctorParameters: function () { return []; } });
|
|
40450
40595
|
|
|
40451
|
-
class ThankYouComponent
|
|
40596
|
+
class ThankYouComponent {
|
|
40452
40597
|
constructor() { }
|
|
40453
40598
|
ngOnInit() {
|
|
40454
40599
|
}
|
|
40455
40600
|
}
|
|
40456
|
-
ThankYouComponent
|
|
40457
|
-
ThankYouComponent
|
|
40458
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ThankYouComponent
|
|
40601
|
+
ThankYouComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ThankYouComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
40602
|
+
ThankYouComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ThankYouComponent, selector: "app-thank-you", ngImport: i0, template: "<div class=\"build-thank-you vx-d-flex vx-align-center vx-justify-center vx-mb-5\">\r\n <div class=\"build-thank-you-inner\">\r\n <div class=\"image vx-mb-5\">\r\n <img src=\"https://cdn.v-comply.com/libraries/workflow-engine/assets/assessment-editor/placeholder.jpg\" alt=\"\" />\r\n </div>\r\n <div class=\"upload-btn vx-fs-11 vx-fw-500 vx-txt-white vx-tt-uppercase vx-d-flex vx-align-center vx-justify-center\">\r\n <input type=\"file\" /> Upload Image\r\n </div>\r\n </div>\r\n</div>", styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";.build-thank-you-inner .image{border:.125rem solid #F1F1F1;border-radius:.125rem;width:18.75rem;height:12.75rem}.build-thank-you-inner .image img{width:100%;height:100%}.build-thank-you-inner .upload-btn{background:#1e5dd3;border-radius:.125rem;border:none;width:10rem;height:2.5rem;margin:0 auto;position:relative}.build-thank-you-inner .upload-btn input[type=file]{position:absolute;inset:0;margin:0;width:100%;height:100%;text-indent:-9999px;opacity:0;cursor:pointer}\n"] });
|
|
40603
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ThankYouComponent, decorators: [{
|
|
40459
40604
|
type: Component,
|
|
40460
40605
|
args: [{ selector: 'app-thank-you', template: "<div class=\"build-thank-you vx-d-flex vx-align-center vx-justify-center vx-mb-5\">\r\n <div class=\"build-thank-you-inner\">\r\n <div class=\"image vx-mb-5\">\r\n <img src=\"https://cdn.v-comply.com/libraries/workflow-engine/assets/assessment-editor/placeholder.jpg\" alt=\"\" />\r\n </div>\r\n <div class=\"upload-btn vx-fs-11 vx-fw-500 vx-txt-white vx-tt-uppercase vx-d-flex vx-align-center vx-justify-center\">\r\n <input type=\"file\" /> Upload Image\r\n </div>\r\n </div>\r\n</div>", styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";.build-thank-you-inner .image{border:.125rem solid #F1F1F1;border-radius:.125rem;width:18.75rem;height:12.75rem}.build-thank-you-inner .image img{width:100%;height:100%}.build-thank-you-inner .upload-btn{background:#1e5dd3;border-radius:.125rem;border:none;width:10rem;height:2.5rem;margin:0 auto;position:relative}.build-thank-you-inner .upload-btn input[type=file]{position:absolute;inset:0;margin:0;width:100%;height:100%;text-indent:-9999px;opacity:0;cursor:pointer}\n"] }]
|
|
40461
40606
|
}], ctorParameters: function () { return []; } });
|
|
@@ -40475,8 +40620,8 @@ BuildModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "1
|
|
|
40475
40620
|
MultipleTextboxComponent,
|
|
40476
40621
|
DateTimeComponent$1,
|
|
40477
40622
|
ChoiceSettingsPanelComponent,
|
|
40478
|
-
WelcomeComponent
|
|
40479
|
-
ThankYouComponent
|
|
40623
|
+
WelcomeComponent,
|
|
40624
|
+
ThankYouComponent,
|
|
40480
40625
|
WeightageSelectorComponent], imports: [CommonModule,
|
|
40481
40626
|
TooltipModule,
|
|
40482
40627
|
PopoverModule,
|
|
@@ -40492,8 +40637,8 @@ BuildModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "1
|
|
|
40492
40637
|
SliderComponent,
|
|
40493
40638
|
MultipleTextboxComponent,
|
|
40494
40639
|
DateTimeComponent$1,
|
|
40495
|
-
WelcomeComponent
|
|
40496
|
-
ThankYouComponent
|
|
40640
|
+
WelcomeComponent,
|
|
40641
|
+
ThankYouComponent,
|
|
40497
40642
|
WeightageSelectorComponent] });
|
|
40498
40643
|
BuildModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: BuildModule, imports: [CommonModule,
|
|
40499
40644
|
TooltipModule,
|
|
@@ -40516,8 +40661,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
40516
40661
|
MultipleTextboxComponent,
|
|
40517
40662
|
DateTimeComponent$1,
|
|
40518
40663
|
ChoiceSettingsPanelComponent,
|
|
40519
|
-
WelcomeComponent
|
|
40520
|
-
ThankYouComponent
|
|
40664
|
+
WelcomeComponent,
|
|
40665
|
+
ThankYouComponent,
|
|
40521
40666
|
WeightageSelectorComponent
|
|
40522
40667
|
],
|
|
40523
40668
|
imports: [
|
|
@@ -40539,149 +40684,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
40539
40684
|
SliderComponent,
|
|
40540
40685
|
MultipleTextboxComponent,
|
|
40541
40686
|
DateTimeComponent$1,
|
|
40542
|
-
WelcomeComponent$1,
|
|
40543
|
-
ThankYouComponent$1,
|
|
40544
|
-
WeightageSelectorComponent
|
|
40545
|
-
]
|
|
40546
|
-
}]
|
|
40547
|
-
}] });
|
|
40548
|
-
|
|
40549
|
-
class WelcomeComponent {
|
|
40550
|
-
constructor() { }
|
|
40551
|
-
ngOnInit() {
|
|
40552
|
-
}
|
|
40553
|
-
}
|
|
40554
|
-
WelcomeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: WelcomeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
40555
|
-
WelcomeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: WelcomeComponent, selector: "app-preview-welcome", ngImport: i0, template: "<div class=\"welcome-preview vx-text-center vx-mb-5\">\r\n <div class=\"image\"><img src=\"https://s3-eu-west-1.amazonaws.com/eu.v-comply.com/o/5e481a5d61ca5e14f5731049/survey/61ee3c97a973170009458150/welcome/202011270933381643024815820.png\" /></div>\r\n <div class=\"heading vx-fs-16 vx-paragraph-txt vx-lih-6 vx-mb-5\">Welcome heading</div>\r\n <div class=\"details vx-fs-14 vx-label-txt vx-pb-3 vx-mb-5\">In publishing and graphic design, Lorem ipsum is a placeholder text commonly used to demonstrate the visual form of a document or a typeface without relying on meaningful content. Lorem ipsum may be used as a placeholder before the final copy is available.</div>\r\n</div>", styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";.welcome-preview .image{width:30rem;margin:0 auto 2rem}.welcome-preview .image img{border-radius:.625rem;width:100%}\n"] });
|
|
40556
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: WelcomeComponent, decorators: [{
|
|
40557
|
-
type: Component,
|
|
40558
|
-
args: [{ selector: 'app-preview-welcome', template: "<div class=\"welcome-preview vx-text-center vx-mb-5\">\r\n <div class=\"image\"><img src=\"https://s3-eu-west-1.amazonaws.com/eu.v-comply.com/o/5e481a5d61ca5e14f5731049/survey/61ee3c97a973170009458150/welcome/202011270933381643024815820.png\" /></div>\r\n <div class=\"heading vx-fs-16 vx-paragraph-txt vx-lih-6 vx-mb-5\">Welcome heading</div>\r\n <div class=\"details vx-fs-14 vx-label-txt vx-pb-3 vx-mb-5\">In publishing and graphic design, Lorem ipsum is a placeholder text commonly used to demonstrate the visual form of a document or a typeface without relying on meaningful content. Lorem ipsum may be used as a placeholder before the final copy is available.</div>\r\n</div>", styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";.welcome-preview .image{width:30rem;margin:0 auto 2rem}.welcome-preview .image img{border-radius:.625rem;width:100%}\n"] }]
|
|
40559
|
-
}], ctorParameters: function () { return []; } });
|
|
40560
|
-
|
|
40561
|
-
class ThankYouComponent {
|
|
40562
|
-
constructor() { }
|
|
40563
|
-
ngOnInit() {
|
|
40564
|
-
}
|
|
40565
|
-
}
|
|
40566
|
-
ThankYouComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ThankYouComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
40567
|
-
ThankYouComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ThankYouComponent, selector: "app-thank-you", ngImport: i0, template: "<div class=\"thank-you-preview vx-text-center vx-mt-5\">\r\n <div class=\"image\"><img src=\"https://s3-eu-west-1.amazonaws.com/eu.v-comply.com/o/5e481a5d61ca5e14f5731049/survey/61ee3c97a973170009458150/welcome/202011270933381643024815820.png\" /></div>\r\n <div class=\"heading vx-fs-16 vx-paragraph-txt vx-lih-6 vx-mb-5\">Thank you heading</div>\r\n <div class=\"details vx-fs-14 vx-label-txt vx-pb-3 vx-mb-5\">In publishing and graphic design, Lorem ipsum is a placeholder text commonly used to demonstrate the visual form of a document or a typeface without relying on meaningful content. Lorem ipsum may be used as a placeholder before the final copy is available.</div>\r\n</div>", styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";.thank-you-preview .image{width:30rem;margin:0 auto 2rem}.thank-you-preview .image img{border-radius:.625rem;width:100%}\n"] });
|
|
40568
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ThankYouComponent, decorators: [{
|
|
40569
|
-
type: Component,
|
|
40570
|
-
args: [{ selector: 'app-thank-you', template: "<div class=\"thank-you-preview vx-text-center vx-mt-5\">\r\n <div class=\"image\"><img src=\"https://s3-eu-west-1.amazonaws.com/eu.v-comply.com/o/5e481a5d61ca5e14f5731049/survey/61ee3c97a973170009458150/welcome/202011270933381643024815820.png\" /></div>\r\n <div class=\"heading vx-fs-16 vx-paragraph-txt vx-lih-6 vx-mb-5\">Thank you heading</div>\r\n <div class=\"details vx-fs-14 vx-label-txt vx-pb-3 vx-mb-5\">In publishing and graphic design, Lorem ipsum is a placeholder text commonly used to demonstrate the visual form of a document or a typeface without relying on meaningful content. Lorem ipsum may be used as a placeholder before the final copy is available.</div>\r\n</div>", styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";.thank-you-preview .image{width:30rem;margin:0 auto 2rem}.thank-you-preview .image img{border-radius:.625rem;width:100%}\n"] }]
|
|
40571
|
-
}], ctorParameters: function () { return []; } });
|
|
40572
|
-
|
|
40573
|
-
// import { SelectModule } from 'src/app/ui-kit/select/select.module';
|
|
40574
|
-
class PreviewModule {
|
|
40575
|
-
}
|
|
40576
|
-
PreviewModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PreviewModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
40577
|
-
PreviewModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.3.0", ngImport: i0, type: PreviewModule, declarations: [PreviewWrapperComponent,
|
|
40578
|
-
PreviewMultipleChoiceComponent,
|
|
40579
|
-
PreviewCheckboxComponent,
|
|
40580
|
-
PreviewImageChoiceComponent,
|
|
40581
|
-
PreviewStarRatingComponent,
|
|
40582
|
-
PreviewSingleTextboxComponent,
|
|
40583
|
-
PreviewCommentBoxComponent,
|
|
40584
|
-
PreviewMatrixDropdownComponent,
|
|
40585
|
-
PreviewDropdownComponent,
|
|
40586
|
-
PreviewMatrixRatingScaleComponent,
|
|
40587
|
-
PreviewRankingComponent,
|
|
40588
|
-
PreviewSliderComponent,
|
|
40589
|
-
PreviewMultipleTextboxComponent,
|
|
40590
|
-
PreviewDateTimeComponent,
|
|
40591
|
-
PreviewFileUploadComponent,
|
|
40592
|
-
WelcomeComponent,
|
|
40593
|
-
ThankYouComponent], imports: [CommonModule,
|
|
40594
|
-
TooltipModule,
|
|
40595
|
-
PopoverModule,
|
|
40596
|
-
DialogModule,
|
|
40597
|
-
// MarxEditorModule,
|
|
40598
|
-
VcomplyEditorModule,
|
|
40599
|
-
FormgroupModule,
|
|
40600
|
-
NoDataModule$1,
|
|
40601
|
-
DpDatePickerModule,
|
|
40602
|
-
NgxMaterialTimepickerModule,
|
|
40603
|
-
SelectModule], exports: [PreviewWrapperComponent,
|
|
40604
|
-
PreviewMultipleChoiceComponent,
|
|
40605
|
-
PreviewCheckboxComponent,
|
|
40606
|
-
PreviewImageChoiceComponent,
|
|
40607
|
-
PreviewStarRatingComponent,
|
|
40608
|
-
PreviewSingleTextboxComponent,
|
|
40609
|
-
PreviewCommentBoxComponent,
|
|
40610
|
-
PreviewMatrixDropdownComponent,
|
|
40611
|
-
PreviewDropdownComponent,
|
|
40612
|
-
PreviewMatrixRatingScaleComponent,
|
|
40613
|
-
PreviewRankingComponent,
|
|
40614
|
-
PreviewSliderComponent,
|
|
40615
|
-
PreviewMultipleTextboxComponent,
|
|
40616
|
-
PreviewDateTimeComponent,
|
|
40617
|
-
PreviewFileUploadComponent,
|
|
40618
|
-
WelcomeComponent,
|
|
40619
|
-
ThankYouComponent] });
|
|
40620
|
-
PreviewModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PreviewModule, imports: [CommonModule,
|
|
40621
|
-
TooltipModule,
|
|
40622
|
-
PopoverModule,
|
|
40623
|
-
DialogModule,
|
|
40624
|
-
// MarxEditorModule,
|
|
40625
|
-
VcomplyEditorModule,
|
|
40626
|
-
FormgroupModule,
|
|
40627
|
-
NoDataModule$1,
|
|
40628
|
-
DpDatePickerModule,
|
|
40629
|
-
NgxMaterialTimepickerModule,
|
|
40630
|
-
SelectModule] });
|
|
40631
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PreviewModule, decorators: [{
|
|
40632
|
-
type: NgModule,
|
|
40633
|
-
args: [{
|
|
40634
|
-
declarations: [
|
|
40635
|
-
PreviewWrapperComponent,
|
|
40636
|
-
PreviewMultipleChoiceComponent,
|
|
40637
|
-
PreviewCheckboxComponent,
|
|
40638
|
-
PreviewImageChoiceComponent,
|
|
40639
|
-
PreviewStarRatingComponent,
|
|
40640
|
-
PreviewSingleTextboxComponent,
|
|
40641
|
-
PreviewCommentBoxComponent,
|
|
40642
|
-
PreviewMatrixDropdownComponent,
|
|
40643
|
-
PreviewDropdownComponent,
|
|
40644
|
-
PreviewMatrixRatingScaleComponent,
|
|
40645
|
-
PreviewRankingComponent,
|
|
40646
|
-
PreviewSliderComponent,
|
|
40647
|
-
PreviewMultipleTextboxComponent,
|
|
40648
|
-
PreviewDateTimeComponent,
|
|
40649
|
-
PreviewFileUploadComponent,
|
|
40650
40687
|
WelcomeComponent,
|
|
40651
40688
|
ThankYouComponent,
|
|
40652
|
-
|
|
40653
|
-
|
|
40654
|
-
CommonModule,
|
|
40655
|
-
TooltipModule,
|
|
40656
|
-
PopoverModule,
|
|
40657
|
-
DialogModule,
|
|
40658
|
-
// MarxEditorModule,
|
|
40659
|
-
VcomplyEditorModule,
|
|
40660
|
-
FormgroupModule,
|
|
40661
|
-
NoDataModule$1,
|
|
40662
|
-
DpDatePickerModule,
|
|
40663
|
-
NgxMaterialTimepickerModule,
|
|
40664
|
-
SelectModule,
|
|
40665
|
-
],
|
|
40666
|
-
exports: [
|
|
40667
|
-
PreviewWrapperComponent,
|
|
40668
|
-
PreviewMultipleChoiceComponent,
|
|
40669
|
-
PreviewCheckboxComponent,
|
|
40670
|
-
PreviewImageChoiceComponent,
|
|
40671
|
-
PreviewStarRatingComponent,
|
|
40672
|
-
PreviewSingleTextboxComponent,
|
|
40673
|
-
PreviewCommentBoxComponent,
|
|
40674
|
-
PreviewMatrixDropdownComponent,
|
|
40675
|
-
PreviewDropdownComponent,
|
|
40676
|
-
PreviewMatrixRatingScaleComponent,
|
|
40677
|
-
PreviewRankingComponent,
|
|
40678
|
-
PreviewSliderComponent,
|
|
40679
|
-
PreviewMultipleTextboxComponent,
|
|
40680
|
-
PreviewDateTimeComponent,
|
|
40681
|
-
PreviewFileUploadComponent,
|
|
40682
|
-
WelcomeComponent,
|
|
40683
|
-
ThankYouComponent,
|
|
40684
|
-
],
|
|
40689
|
+
WeightageSelectorComponent
|
|
40690
|
+
]
|
|
40685
40691
|
}]
|
|
40686
40692
|
}] });
|
|
40687
40693
|
|
|
@@ -40822,7 +40828,7 @@ CreateAssessmentModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0",
|
|
|
40822
40828
|
AddSegmentPopupComponent,
|
|
40823
40829
|
AddResponseSetPopupComponent,
|
|
40824
40830
|
EditorWrapperComponent,
|
|
40825
|
-
QuickSettingsComponent
|
|
40831
|
+
QuickSettingsComponent,
|
|
40826
40832
|
SingleLineEditorComponent,
|
|
40827
40833
|
ResponseSelectorComponent,
|
|
40828
40834
|
MoveComponent,
|
|
@@ -40880,7 +40886,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
40880
40886
|
AddSegmentPopupComponent,
|
|
40881
40887
|
AddResponseSetPopupComponent,
|
|
40882
40888
|
EditorWrapperComponent,
|
|
40883
|
-
QuickSettingsComponent
|
|
40889
|
+
QuickSettingsComponent,
|
|
40884
40890
|
SingleLineEditorComponent,
|
|
40885
40891
|
ResponseSelectorComponent,
|
|
40886
40892
|
MoveComponent,
|