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
|
@@ -13738,21 +13738,36 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
13738
13738
|
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"] }]
|
|
13739
13739
|
}], ctorParameters: function () { return []; } });
|
|
13740
13740
|
|
|
13741
|
-
class
|
|
13741
|
+
class QuickSettingsComponent$1 {
|
|
13742
13742
|
constructor() { }
|
|
13743
|
+
ngOnInit() { }
|
|
13744
|
+
}
|
|
13745
|
+
QuickSettingsComponent$1.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: QuickSettingsComponent$1, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
13746
|
+
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"] }] });
|
|
13747
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: QuickSettingsComponent$1, decorators: [{
|
|
13748
|
+
type: Component,
|
|
13749
|
+
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"] }]
|
|
13750
|
+
}], ctorParameters: function () { return []; }, propDecorators: { question: [{
|
|
13751
|
+
type: Input
|
|
13752
|
+
}] } });
|
|
13753
|
+
|
|
13754
|
+
class PreviewMatrixDropdownComponent {
|
|
13755
|
+
constructor() {
|
|
13756
|
+
this.questionIndex = 1;
|
|
13757
|
+
this.isQuickSettings = true;
|
|
13758
|
+
}
|
|
13759
|
+
ngOnInit() { }
|
|
13743
13760
|
scrollHandler(event) {
|
|
13744
13761
|
this.panel['_results'].forEach((panel) => {
|
|
13745
13762
|
panel['nativeElement'].scrollLeft = event.target.scrollLeft;
|
|
13746
13763
|
});
|
|
13747
13764
|
}
|
|
13748
|
-
ngOnInit() {
|
|
13749
|
-
}
|
|
13750
13765
|
}
|
|
13751
13766
|
PreviewMatrixDropdownComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PreviewMatrixDropdownComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
13752
|
-
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
|
|
13767
|
+
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"] }] });
|
|
13753
13768
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PreviewMatrixDropdownComponent, decorators: [{
|
|
13754
13769
|
type: Component,
|
|
13755
|
-
args: [{ selector: 'app-preview-matrix-dropdown', template: "<div class=\"preview-list\">\r\n
|
|
13770
|
+
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"] }]
|
|
13756
13771
|
}], ctorParameters: function () { return []; }, propDecorators: { panel: [{
|
|
13757
13772
|
type: ViewChildren,
|
|
13758
13773
|
args: ['scrollMatrixDropdown', { read: ElementRef }]
|
|
@@ -13936,7 +13951,7 @@ class PreviewWrapperComponent {
|
|
|
13936
13951
|
}
|
|
13937
13952
|
}
|
|
13938
13953
|
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 });
|
|
13939
|
-
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"] }] });
|
|
13954
|
+
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"] }] });
|
|
13940
13955
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PreviewWrapperComponent, decorators: [{
|
|
13941
13956
|
type: Component,
|
|
13942
13957
|
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"] }]
|
|
@@ -14293,7 +14308,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
14293
14308
|
type: Output
|
|
14294
14309
|
}] } });
|
|
14295
14310
|
|
|
14296
|
-
class QuickSettingsComponent
|
|
14311
|
+
class QuickSettingsComponent {
|
|
14297
14312
|
constructor(fd) {
|
|
14298
14313
|
this.fd = fd;
|
|
14299
14314
|
this.typeChanged = new EventEmitter();
|
|
@@ -14523,9 +14538,9 @@ class QuickSettingsComponent$1 {
|
|
|
14523
14538
|
this.fd.formsPage.elements[this.questionIndex][quickSetting.toggleValue] = e;
|
|
14524
14539
|
}
|
|
14525
14540
|
}
|
|
14526
|
-
QuickSettingsComponent
|
|
14527
|
-
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"] }] });
|
|
14528
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: QuickSettingsComponent
|
|
14541
|
+
QuickSettingsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: QuickSettingsComponent, deps: [{ token: EditorService }], target: i0.ɵɵFactoryTarget.Component });
|
|
14542
|
+
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"] }] });
|
|
14543
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: QuickSettingsComponent, decorators: [{
|
|
14529
14544
|
type: Component,
|
|
14530
14545
|
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"] }]
|
|
14531
14546
|
}], ctorParameters: function () { return [{ type: EditorService }]; }, propDecorators: { questionIndex: [{
|
|
@@ -15533,7 +15548,7 @@ class EditorWrapperComponent {
|
|
|
15533
15548
|
}
|
|
15534
15549
|
}
|
|
15535
15550
|
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 });
|
|
15536
|
-
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" }] });
|
|
15551
|
+
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" }] });
|
|
15537
15552
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: EditorWrapperComponent, decorators: [{
|
|
15538
15553
|
type: Component,
|
|
15539
15554
|
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"] }]
|
|
@@ -20963,19 +20978,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
20963
20978
|
type: Optional
|
|
20964
20979
|
}] }]; } });
|
|
20965
20980
|
|
|
20966
|
-
class
|
|
20981
|
+
class WelcomeComponent$2 {
|
|
20967
20982
|
constructor() { }
|
|
20968
20983
|
ngOnInit() {
|
|
20969
20984
|
}
|
|
20970
20985
|
}
|
|
20971
|
-
|
|
20972
|
-
|
|
20973
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type:
|
|
20986
|
+
WelcomeComponent$2.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: WelcomeComponent$2, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
20987
|
+
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"] });
|
|
20988
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: WelcomeComponent$2, decorators: [{
|
|
20974
20989
|
type: Component,
|
|
20975
|
-
args: [{ selector: 'app-
|
|
20976
|
-
}], ctorParameters: function () { return []; }
|
|
20977
|
-
type: Input
|
|
20978
|
-
}] } });
|
|
20990
|
+
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"] }]
|
|
20991
|
+
}], ctorParameters: function () { return []; } });
|
|
20979
20992
|
|
|
20980
20993
|
class CheckboxQuestionComponent {
|
|
20981
20994
|
constructor() {
|
|
@@ -20992,10 +21005,10 @@ class CheckboxQuestionComponent {
|
|
|
20992
21005
|
}
|
|
20993
21006
|
}
|
|
20994
21007
|
CheckboxQuestionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CheckboxQuestionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
20995
|
-
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:-
|
|
21008
|
+
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"] }] });
|
|
20996
21009
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CheckboxQuestionComponent, decorators: [{
|
|
20997
21010
|
type: Component,
|
|
20998
|
-
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:-
|
|
21011
|
+
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"] }]
|
|
20999
21012
|
}], ctorParameters: function () { return []; }, propDecorators: { question: [{
|
|
21000
21013
|
type: Input
|
|
21001
21014
|
}], questionIndex: [{
|
|
@@ -21018,10 +21031,10 @@ class DateTimeComponent {
|
|
|
21018
21031
|
}
|
|
21019
21032
|
}
|
|
21020
21033
|
DateTimeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: DateTimeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
21021
|
-
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"] }] });
|
|
21034
|
+
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"] }] });
|
|
21022
21035
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: DateTimeComponent, decorators: [{
|
|
21023
21036
|
type: Component,
|
|
21024
|
-
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"] }]
|
|
21037
|
+
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"] }]
|
|
21025
21038
|
}], ctorParameters: function () { return []; }, propDecorators: { question: [{
|
|
21026
21039
|
type: Input
|
|
21027
21040
|
}], questionIndex: [{
|
|
@@ -21056,10 +21069,10 @@ class FileUploadComponent {
|
|
|
21056
21069
|
}
|
|
21057
21070
|
}
|
|
21058
21071
|
FileUploadComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FileUploadComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
21059
|
-
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:-
|
|
21072
|
+
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"] }] });
|
|
21060
21073
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FileUploadComponent, decorators: [{
|
|
21061
21074
|
type: Component,
|
|
21062
|
-
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:-
|
|
21075
|
+
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"] }]
|
|
21063
21076
|
}], ctorParameters: function () { return []; }, propDecorators: { question: [{
|
|
21064
21077
|
type: Input
|
|
21065
21078
|
}], questionIndex: [{
|
|
@@ -21081,10 +21094,10 @@ class RadioQuestionComponent {
|
|
|
21081
21094
|
}
|
|
21082
21095
|
}
|
|
21083
21096
|
RadioQuestionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: RadioQuestionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
21084
|
-
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:-
|
|
21097
|
+
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"] }] });
|
|
21085
21098
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: RadioQuestionComponent, decorators: [{
|
|
21086
21099
|
type: Component,
|
|
21087
|
-
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:-
|
|
21100
|
+
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"] }]
|
|
21088
21101
|
}], ctorParameters: function () { return []; }, propDecorators: { question: [{
|
|
21089
21102
|
type: Input
|
|
21090
21103
|
}], questionIndex: [{
|
|
@@ -21109,10 +21122,10 @@ class SelectQuestionComponent {
|
|
|
21109
21122
|
}
|
|
21110
21123
|
}
|
|
21111
21124
|
SelectQuestionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SelectQuestionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
21112
|
-
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:-
|
|
21125
|
+
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"] }] });
|
|
21113
21126
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SelectQuestionComponent, decorators: [{
|
|
21114
21127
|
type: Component,
|
|
21115
|
-
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:-
|
|
21128
|
+
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"] }]
|
|
21116
21129
|
}], ctorParameters: function () { return []; }, propDecorators: { question: [{
|
|
21117
21130
|
type: Input
|
|
21118
21131
|
}], questionIndex: [{
|
|
@@ -21125,10 +21138,10 @@ class SingleTextboxComponent {
|
|
|
21125
21138
|
}
|
|
21126
21139
|
}
|
|
21127
21140
|
SingleTextboxComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SingleTextboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
21128
|
-
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:-
|
|
21141
|
+
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"] }] });
|
|
21129
21142
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SingleTextboxComponent, decorators: [{
|
|
21130
21143
|
type: Component,
|
|
21131
|
-
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:-
|
|
21144
|
+
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"] }]
|
|
21132
21145
|
}], ctorParameters: function () { return []; }, propDecorators: { question: [{
|
|
21133
21146
|
type: Input
|
|
21134
21147
|
}], questionIndex: [{
|
|
@@ -21151,14 +21164,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
21151
21164
|
type: Input
|
|
21152
21165
|
}] } });
|
|
21153
21166
|
|
|
21154
|
-
class WelcomeComponent$
|
|
21167
|
+
class WelcomeComponent$1 {
|
|
21155
21168
|
constructor() { }
|
|
21156
21169
|
ngOnInit() {
|
|
21157
21170
|
}
|
|
21158
21171
|
}
|
|
21159
|
-
WelcomeComponent$
|
|
21160
|
-
WelcomeComponent$
|
|
21161
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: WelcomeComponent$
|
|
21172
|
+
WelcomeComponent$1.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: WelcomeComponent$1, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
21173
|
+
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"] }] });
|
|
21174
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: WelcomeComponent$1, decorators: [{
|
|
21162
21175
|
type: Component,
|
|
21163
21176
|
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"] }]
|
|
21164
21177
|
}], ctorParameters: function () { return []; }, propDecorators: { questionDetails: [{
|
|
@@ -21197,10 +21210,10 @@ class PreviewComponent {
|
|
|
21197
21210
|
}
|
|
21198
21211
|
}
|
|
21199
21212
|
PreviewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PreviewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
21200
|
-
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"] }] });
|
|
21213
|
+
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"] }] });
|
|
21201
21214
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PreviewComponent, decorators: [{
|
|
21202
21215
|
type: Component,
|
|
21203
|
-
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"] }]
|
|
21216
|
+
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"] }]
|
|
21204
21217
|
}], ctorParameters: function () { return []; }, propDecorators: { questionData: [{
|
|
21205
21218
|
type: Input
|
|
21206
21219
|
}], previewBack: [{
|
|
@@ -39902,6 +39915,136 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
39902
39915
|
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"] }]
|
|
39903
39916
|
}], ctorParameters: function () { return []; } });
|
|
39904
39917
|
|
|
39918
|
+
class ThankYouComponent$1 {
|
|
39919
|
+
constructor() { }
|
|
39920
|
+
ngOnInit() {
|
|
39921
|
+
}
|
|
39922
|
+
}
|
|
39923
|
+
ThankYouComponent$1.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ThankYouComponent$1, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
39924
|
+
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"] });
|
|
39925
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ThankYouComponent$1, decorators: [{
|
|
39926
|
+
type: Component,
|
|
39927
|
+
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"] }]
|
|
39928
|
+
}], ctorParameters: function () { return []; } });
|
|
39929
|
+
|
|
39930
|
+
// import { SelectModule } from 'src/app/ui-kit/select/select.module';
|
|
39931
|
+
class PreviewModule {
|
|
39932
|
+
}
|
|
39933
|
+
PreviewModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PreviewModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
39934
|
+
PreviewModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.3.0", ngImport: i0, type: PreviewModule, declarations: [PreviewWrapperComponent,
|
|
39935
|
+
PreviewMultipleChoiceComponent,
|
|
39936
|
+
PreviewCheckboxComponent,
|
|
39937
|
+
PreviewImageChoiceComponent,
|
|
39938
|
+
PreviewStarRatingComponent,
|
|
39939
|
+
PreviewSingleTextboxComponent,
|
|
39940
|
+
PreviewCommentBoxComponent,
|
|
39941
|
+
PreviewMatrixDropdownComponent,
|
|
39942
|
+
PreviewDropdownComponent,
|
|
39943
|
+
PreviewMatrixRatingScaleComponent,
|
|
39944
|
+
PreviewRankingComponent,
|
|
39945
|
+
PreviewSliderComponent,
|
|
39946
|
+
PreviewMultipleTextboxComponent,
|
|
39947
|
+
PreviewDateTimeComponent,
|
|
39948
|
+
PreviewFileUploadComponent,
|
|
39949
|
+
WelcomeComponent$2,
|
|
39950
|
+
ThankYouComponent$1], imports: [CommonModule,
|
|
39951
|
+
TooltipModule,
|
|
39952
|
+
PopoverModule,
|
|
39953
|
+
DialogModule,
|
|
39954
|
+
// MarxEditorModule,
|
|
39955
|
+
VcomplyEditorModule,
|
|
39956
|
+
FormgroupModule,
|
|
39957
|
+
NoDataModule$1,
|
|
39958
|
+
DpDatePickerModule,
|
|
39959
|
+
NgxMaterialTimepickerModule,
|
|
39960
|
+
SelectModule,
|
|
39961
|
+
QuickSettingsComponent$1], exports: [PreviewWrapperComponent,
|
|
39962
|
+
PreviewMultipleChoiceComponent,
|
|
39963
|
+
PreviewCheckboxComponent,
|
|
39964
|
+
PreviewImageChoiceComponent,
|
|
39965
|
+
PreviewStarRatingComponent,
|
|
39966
|
+
PreviewSingleTextboxComponent,
|
|
39967
|
+
PreviewCommentBoxComponent,
|
|
39968
|
+
PreviewMatrixDropdownComponent,
|
|
39969
|
+
PreviewDropdownComponent,
|
|
39970
|
+
PreviewMatrixRatingScaleComponent,
|
|
39971
|
+
PreviewRankingComponent,
|
|
39972
|
+
PreviewSliderComponent,
|
|
39973
|
+
PreviewMultipleTextboxComponent,
|
|
39974
|
+
PreviewDateTimeComponent,
|
|
39975
|
+
PreviewFileUploadComponent,
|
|
39976
|
+
WelcomeComponent$2,
|
|
39977
|
+
ThankYouComponent$1] });
|
|
39978
|
+
PreviewModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PreviewModule, imports: [CommonModule,
|
|
39979
|
+
TooltipModule,
|
|
39980
|
+
PopoverModule,
|
|
39981
|
+
DialogModule,
|
|
39982
|
+
// MarxEditorModule,
|
|
39983
|
+
VcomplyEditorModule,
|
|
39984
|
+
FormgroupModule,
|
|
39985
|
+
NoDataModule$1,
|
|
39986
|
+
DpDatePickerModule,
|
|
39987
|
+
NgxMaterialTimepickerModule,
|
|
39988
|
+
SelectModule,
|
|
39989
|
+
QuickSettingsComponent$1] });
|
|
39990
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PreviewModule, decorators: [{
|
|
39991
|
+
type: NgModule,
|
|
39992
|
+
args: [{
|
|
39993
|
+
declarations: [
|
|
39994
|
+
PreviewWrapperComponent,
|
|
39995
|
+
PreviewMultipleChoiceComponent,
|
|
39996
|
+
PreviewCheckboxComponent,
|
|
39997
|
+
PreviewImageChoiceComponent,
|
|
39998
|
+
PreviewStarRatingComponent,
|
|
39999
|
+
PreviewSingleTextboxComponent,
|
|
40000
|
+
PreviewCommentBoxComponent,
|
|
40001
|
+
PreviewMatrixDropdownComponent,
|
|
40002
|
+
PreviewDropdownComponent,
|
|
40003
|
+
PreviewMatrixRatingScaleComponent,
|
|
40004
|
+
PreviewRankingComponent,
|
|
40005
|
+
PreviewSliderComponent,
|
|
40006
|
+
PreviewMultipleTextboxComponent,
|
|
40007
|
+
PreviewDateTimeComponent,
|
|
40008
|
+
PreviewFileUploadComponent,
|
|
40009
|
+
WelcomeComponent$2,
|
|
40010
|
+
ThankYouComponent$1,
|
|
40011
|
+
],
|
|
40012
|
+
imports: [
|
|
40013
|
+
CommonModule,
|
|
40014
|
+
TooltipModule,
|
|
40015
|
+
PopoverModule,
|
|
40016
|
+
DialogModule,
|
|
40017
|
+
// MarxEditorModule,
|
|
40018
|
+
VcomplyEditorModule,
|
|
40019
|
+
FormgroupModule,
|
|
40020
|
+
NoDataModule$1,
|
|
40021
|
+
DpDatePickerModule,
|
|
40022
|
+
NgxMaterialTimepickerModule,
|
|
40023
|
+
SelectModule,
|
|
40024
|
+
QuickSettingsComponent$1,
|
|
40025
|
+
],
|
|
40026
|
+
exports: [
|
|
40027
|
+
PreviewWrapperComponent,
|
|
40028
|
+
PreviewMultipleChoiceComponent,
|
|
40029
|
+
PreviewCheckboxComponent,
|
|
40030
|
+
PreviewImageChoiceComponent,
|
|
40031
|
+
PreviewStarRatingComponent,
|
|
40032
|
+
PreviewSingleTextboxComponent,
|
|
40033
|
+
PreviewCommentBoxComponent,
|
|
40034
|
+
PreviewMatrixDropdownComponent,
|
|
40035
|
+
PreviewDropdownComponent,
|
|
40036
|
+
PreviewMatrixRatingScaleComponent,
|
|
40037
|
+
PreviewRankingComponent,
|
|
40038
|
+
PreviewSliderComponent,
|
|
40039
|
+
PreviewMultipleTextboxComponent,
|
|
40040
|
+
PreviewDateTimeComponent,
|
|
40041
|
+
PreviewFileUploadComponent,
|
|
40042
|
+
WelcomeComponent$2,
|
|
40043
|
+
ThankYouComponent$1,
|
|
40044
|
+
],
|
|
40045
|
+
}]
|
|
40046
|
+
}] });
|
|
40047
|
+
|
|
39905
40048
|
class AssessmentPreviewModule {
|
|
39906
40049
|
}
|
|
39907
40050
|
AssessmentPreviewModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: AssessmentPreviewModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
@@ -39911,33 +40054,35 @@ AssessmentPreviewModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0",
|
|
|
39911
40054
|
FileUploadComponent,
|
|
39912
40055
|
PreviewComponent,
|
|
39913
40056
|
PreviewContainerComponent,
|
|
39914
|
-
QuickSettingsComponent,
|
|
39915
40057
|
RadioQuestionComponent,
|
|
39916
40058
|
SelectQuestionComponent,
|
|
39917
40059
|
SingleTextboxComponent,
|
|
39918
40060
|
PageHeaderComponent,
|
|
39919
|
-
WelcomeComponent$
|
|
40061
|
+
WelcomeComponent$1], imports: [CommonModule,
|
|
39920
40062
|
TooltipModule,
|
|
39921
40063
|
FormgroupModule$1,
|
|
39922
40064
|
PopoverModule,
|
|
39923
40065
|
NgxMaterialTimepickerModule,
|
|
39924
|
-
DpDatePickerModule
|
|
40066
|
+
DpDatePickerModule,
|
|
40067
|
+
PreviewModule,
|
|
40068
|
+
QuickSettingsComponent$1], exports: [CheckboxQuestionComponent,
|
|
39925
40069
|
DateTimeComponent,
|
|
39926
40070
|
DeviceComponent,
|
|
39927
40071
|
FileUploadComponent,
|
|
39928
40072
|
PreviewComponent,
|
|
39929
40073
|
PreviewContainerComponent,
|
|
39930
|
-
QuickSettingsComponent,
|
|
39931
40074
|
RadioQuestionComponent,
|
|
39932
40075
|
SelectQuestionComponent,
|
|
39933
40076
|
SingleTextboxComponent,
|
|
39934
|
-
WelcomeComponent$
|
|
40077
|
+
WelcomeComponent$1] });
|
|
39935
40078
|
AssessmentPreviewModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: AssessmentPreviewModule, imports: [CommonModule,
|
|
39936
40079
|
TooltipModule,
|
|
39937
40080
|
FormgroupModule$1,
|
|
39938
40081
|
PopoverModule,
|
|
39939
40082
|
NgxMaterialTimepickerModule,
|
|
39940
|
-
DpDatePickerModule
|
|
40083
|
+
DpDatePickerModule,
|
|
40084
|
+
PreviewModule,
|
|
40085
|
+
QuickSettingsComponent$1] });
|
|
39941
40086
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: AssessmentPreviewModule, decorators: [{
|
|
39942
40087
|
type: NgModule,
|
|
39943
40088
|
args: [{
|
|
@@ -39948,12 +40093,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
39948
40093
|
FileUploadComponent,
|
|
39949
40094
|
PreviewComponent,
|
|
39950
40095
|
PreviewContainerComponent,
|
|
39951
|
-
QuickSettingsComponent,
|
|
39952
40096
|
RadioQuestionComponent,
|
|
39953
40097
|
SelectQuestionComponent,
|
|
39954
40098
|
SingleTextboxComponent,
|
|
39955
40099
|
PageHeaderComponent,
|
|
39956
|
-
WelcomeComponent$
|
|
40100
|
+
WelcomeComponent$1,
|
|
39957
40101
|
],
|
|
39958
40102
|
imports: [
|
|
39959
40103
|
CommonModule,
|
|
@@ -39962,6 +40106,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
39962
40106
|
PopoverModule,
|
|
39963
40107
|
NgxMaterialTimepickerModule,
|
|
39964
40108
|
DpDatePickerModule,
|
|
40109
|
+
PreviewModule,
|
|
40110
|
+
QuickSettingsComponent$1,
|
|
39965
40111
|
],
|
|
39966
40112
|
exports: [
|
|
39967
40113
|
CheckboxQuestionComponent,
|
|
@@ -39970,35 +40116,34 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
39970
40116
|
FileUploadComponent,
|
|
39971
40117
|
PreviewComponent,
|
|
39972
40118
|
PreviewContainerComponent,
|
|
39973
|
-
QuickSettingsComponent,
|
|
39974
40119
|
RadioQuestionComponent,
|
|
39975
40120
|
SelectQuestionComponent,
|
|
39976
40121
|
SingleTextboxComponent,
|
|
39977
|
-
WelcomeComponent$
|
|
39978
|
-
]
|
|
40122
|
+
WelcomeComponent$1,
|
|
40123
|
+
],
|
|
39979
40124
|
}]
|
|
39980
40125
|
}] });
|
|
39981
40126
|
|
|
39982
|
-
class WelcomeComponent
|
|
40127
|
+
class WelcomeComponent {
|
|
39983
40128
|
constructor() { }
|
|
39984
40129
|
ngOnInit() {
|
|
39985
40130
|
}
|
|
39986
40131
|
}
|
|
39987
|
-
WelcomeComponent
|
|
39988
|
-
WelcomeComponent
|
|
39989
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: WelcomeComponent
|
|
40132
|
+
WelcomeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: WelcomeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
40133
|
+
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"] });
|
|
40134
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: WelcomeComponent, decorators: [{
|
|
39990
40135
|
type: Component,
|
|
39991
40136
|
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"] }]
|
|
39992
40137
|
}], ctorParameters: function () { return []; } });
|
|
39993
40138
|
|
|
39994
|
-
class ThankYouComponent
|
|
40139
|
+
class ThankYouComponent {
|
|
39995
40140
|
constructor() { }
|
|
39996
40141
|
ngOnInit() {
|
|
39997
40142
|
}
|
|
39998
40143
|
}
|
|
39999
|
-
ThankYouComponent
|
|
40000
|
-
ThankYouComponent
|
|
40001
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ThankYouComponent
|
|
40144
|
+
ThankYouComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ThankYouComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
40145
|
+
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"] });
|
|
40146
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ThankYouComponent, decorators: [{
|
|
40002
40147
|
type: Component,
|
|
40003
40148
|
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"] }]
|
|
40004
40149
|
}], ctorParameters: function () { return []; } });
|
|
@@ -40018,8 +40163,8 @@ BuildModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "1
|
|
|
40018
40163
|
MultipleTextboxComponent,
|
|
40019
40164
|
DateTimeComponent$1,
|
|
40020
40165
|
ChoiceSettingsPanelComponent,
|
|
40021
|
-
WelcomeComponent
|
|
40022
|
-
ThankYouComponent
|
|
40166
|
+
WelcomeComponent,
|
|
40167
|
+
ThankYouComponent,
|
|
40023
40168
|
WeightageSelectorComponent], imports: [CommonModule,
|
|
40024
40169
|
TooltipModule,
|
|
40025
40170
|
PopoverModule,
|
|
@@ -40035,8 +40180,8 @@ BuildModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "1
|
|
|
40035
40180
|
SliderComponent,
|
|
40036
40181
|
MultipleTextboxComponent,
|
|
40037
40182
|
DateTimeComponent$1,
|
|
40038
|
-
WelcomeComponent
|
|
40039
|
-
ThankYouComponent
|
|
40183
|
+
WelcomeComponent,
|
|
40184
|
+
ThankYouComponent,
|
|
40040
40185
|
WeightageSelectorComponent] });
|
|
40041
40186
|
BuildModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: BuildModule, imports: [CommonModule,
|
|
40042
40187
|
TooltipModule,
|
|
@@ -40059,8 +40204,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
40059
40204
|
MultipleTextboxComponent,
|
|
40060
40205
|
DateTimeComponent$1,
|
|
40061
40206
|
ChoiceSettingsPanelComponent,
|
|
40062
|
-
WelcomeComponent
|
|
40063
|
-
ThankYouComponent
|
|
40207
|
+
WelcomeComponent,
|
|
40208
|
+
ThankYouComponent,
|
|
40064
40209
|
WeightageSelectorComponent
|
|
40065
40210
|
],
|
|
40066
40211
|
imports: [
|
|
@@ -40082,149 +40227,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
40082
40227
|
SliderComponent,
|
|
40083
40228
|
MultipleTextboxComponent,
|
|
40084
40229
|
DateTimeComponent$1,
|
|
40085
|
-
WelcomeComponent$1,
|
|
40086
|
-
ThankYouComponent$1,
|
|
40087
|
-
WeightageSelectorComponent
|
|
40088
|
-
]
|
|
40089
|
-
}]
|
|
40090
|
-
}] });
|
|
40091
|
-
|
|
40092
|
-
class WelcomeComponent {
|
|
40093
|
-
constructor() { }
|
|
40094
|
-
ngOnInit() {
|
|
40095
|
-
}
|
|
40096
|
-
}
|
|
40097
|
-
WelcomeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: WelcomeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
40098
|
-
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"] });
|
|
40099
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: WelcomeComponent, decorators: [{
|
|
40100
|
-
type: Component,
|
|
40101
|
-
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"] }]
|
|
40102
|
-
}], ctorParameters: function () { return []; } });
|
|
40103
|
-
|
|
40104
|
-
class ThankYouComponent {
|
|
40105
|
-
constructor() { }
|
|
40106
|
-
ngOnInit() {
|
|
40107
|
-
}
|
|
40108
|
-
}
|
|
40109
|
-
ThankYouComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ThankYouComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
40110
|
-
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"] });
|
|
40111
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ThankYouComponent, decorators: [{
|
|
40112
|
-
type: Component,
|
|
40113
|
-
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"] }]
|
|
40114
|
-
}], ctorParameters: function () { return []; } });
|
|
40115
|
-
|
|
40116
|
-
// import { SelectModule } from 'src/app/ui-kit/select/select.module';
|
|
40117
|
-
class PreviewModule {
|
|
40118
|
-
}
|
|
40119
|
-
PreviewModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PreviewModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
40120
|
-
PreviewModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.3.0", ngImport: i0, type: PreviewModule, declarations: [PreviewWrapperComponent,
|
|
40121
|
-
PreviewMultipleChoiceComponent,
|
|
40122
|
-
PreviewCheckboxComponent,
|
|
40123
|
-
PreviewImageChoiceComponent,
|
|
40124
|
-
PreviewStarRatingComponent,
|
|
40125
|
-
PreviewSingleTextboxComponent,
|
|
40126
|
-
PreviewCommentBoxComponent,
|
|
40127
|
-
PreviewMatrixDropdownComponent,
|
|
40128
|
-
PreviewDropdownComponent,
|
|
40129
|
-
PreviewMatrixRatingScaleComponent,
|
|
40130
|
-
PreviewRankingComponent,
|
|
40131
|
-
PreviewSliderComponent,
|
|
40132
|
-
PreviewMultipleTextboxComponent,
|
|
40133
|
-
PreviewDateTimeComponent,
|
|
40134
|
-
PreviewFileUploadComponent,
|
|
40135
|
-
WelcomeComponent,
|
|
40136
|
-
ThankYouComponent], imports: [CommonModule,
|
|
40137
|
-
TooltipModule,
|
|
40138
|
-
PopoverModule,
|
|
40139
|
-
DialogModule,
|
|
40140
|
-
// MarxEditorModule,
|
|
40141
|
-
VcomplyEditorModule,
|
|
40142
|
-
FormgroupModule,
|
|
40143
|
-
NoDataModule$1,
|
|
40144
|
-
DpDatePickerModule,
|
|
40145
|
-
NgxMaterialTimepickerModule,
|
|
40146
|
-
SelectModule], exports: [PreviewWrapperComponent,
|
|
40147
|
-
PreviewMultipleChoiceComponent,
|
|
40148
|
-
PreviewCheckboxComponent,
|
|
40149
|
-
PreviewImageChoiceComponent,
|
|
40150
|
-
PreviewStarRatingComponent,
|
|
40151
|
-
PreviewSingleTextboxComponent,
|
|
40152
|
-
PreviewCommentBoxComponent,
|
|
40153
|
-
PreviewMatrixDropdownComponent,
|
|
40154
|
-
PreviewDropdownComponent,
|
|
40155
|
-
PreviewMatrixRatingScaleComponent,
|
|
40156
|
-
PreviewRankingComponent,
|
|
40157
|
-
PreviewSliderComponent,
|
|
40158
|
-
PreviewMultipleTextboxComponent,
|
|
40159
|
-
PreviewDateTimeComponent,
|
|
40160
|
-
PreviewFileUploadComponent,
|
|
40161
|
-
WelcomeComponent,
|
|
40162
|
-
ThankYouComponent] });
|
|
40163
|
-
PreviewModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PreviewModule, imports: [CommonModule,
|
|
40164
|
-
TooltipModule,
|
|
40165
|
-
PopoverModule,
|
|
40166
|
-
DialogModule,
|
|
40167
|
-
// MarxEditorModule,
|
|
40168
|
-
VcomplyEditorModule,
|
|
40169
|
-
FormgroupModule,
|
|
40170
|
-
NoDataModule$1,
|
|
40171
|
-
DpDatePickerModule,
|
|
40172
|
-
NgxMaterialTimepickerModule,
|
|
40173
|
-
SelectModule] });
|
|
40174
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PreviewModule, decorators: [{
|
|
40175
|
-
type: NgModule,
|
|
40176
|
-
args: [{
|
|
40177
|
-
declarations: [
|
|
40178
|
-
PreviewWrapperComponent,
|
|
40179
|
-
PreviewMultipleChoiceComponent,
|
|
40180
|
-
PreviewCheckboxComponent,
|
|
40181
|
-
PreviewImageChoiceComponent,
|
|
40182
|
-
PreviewStarRatingComponent,
|
|
40183
|
-
PreviewSingleTextboxComponent,
|
|
40184
|
-
PreviewCommentBoxComponent,
|
|
40185
|
-
PreviewMatrixDropdownComponent,
|
|
40186
|
-
PreviewDropdownComponent,
|
|
40187
|
-
PreviewMatrixRatingScaleComponent,
|
|
40188
|
-
PreviewRankingComponent,
|
|
40189
|
-
PreviewSliderComponent,
|
|
40190
|
-
PreviewMultipleTextboxComponent,
|
|
40191
|
-
PreviewDateTimeComponent,
|
|
40192
|
-
PreviewFileUploadComponent,
|
|
40193
40230
|
WelcomeComponent,
|
|
40194
40231
|
ThankYouComponent,
|
|
40195
|
-
|
|
40196
|
-
|
|
40197
|
-
CommonModule,
|
|
40198
|
-
TooltipModule,
|
|
40199
|
-
PopoverModule,
|
|
40200
|
-
DialogModule,
|
|
40201
|
-
// MarxEditorModule,
|
|
40202
|
-
VcomplyEditorModule,
|
|
40203
|
-
FormgroupModule,
|
|
40204
|
-
NoDataModule$1,
|
|
40205
|
-
DpDatePickerModule,
|
|
40206
|
-
NgxMaterialTimepickerModule,
|
|
40207
|
-
SelectModule,
|
|
40208
|
-
],
|
|
40209
|
-
exports: [
|
|
40210
|
-
PreviewWrapperComponent,
|
|
40211
|
-
PreviewMultipleChoiceComponent,
|
|
40212
|
-
PreviewCheckboxComponent,
|
|
40213
|
-
PreviewImageChoiceComponent,
|
|
40214
|
-
PreviewStarRatingComponent,
|
|
40215
|
-
PreviewSingleTextboxComponent,
|
|
40216
|
-
PreviewCommentBoxComponent,
|
|
40217
|
-
PreviewMatrixDropdownComponent,
|
|
40218
|
-
PreviewDropdownComponent,
|
|
40219
|
-
PreviewMatrixRatingScaleComponent,
|
|
40220
|
-
PreviewRankingComponent,
|
|
40221
|
-
PreviewSliderComponent,
|
|
40222
|
-
PreviewMultipleTextboxComponent,
|
|
40223
|
-
PreviewDateTimeComponent,
|
|
40224
|
-
PreviewFileUploadComponent,
|
|
40225
|
-
WelcomeComponent,
|
|
40226
|
-
ThankYouComponent,
|
|
40227
|
-
],
|
|
40232
|
+
WeightageSelectorComponent
|
|
40233
|
+
]
|
|
40228
40234
|
}]
|
|
40229
40235
|
}] });
|
|
40230
40236
|
|
|
@@ -40365,7 +40371,7 @@ CreateAssessmentModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0",
|
|
|
40365
40371
|
AddSegmentPopupComponent,
|
|
40366
40372
|
AddResponseSetPopupComponent,
|
|
40367
40373
|
EditorWrapperComponent,
|
|
40368
|
-
QuickSettingsComponent
|
|
40374
|
+
QuickSettingsComponent,
|
|
40369
40375
|
SingleLineEditorComponent,
|
|
40370
40376
|
ResponseSelectorComponent,
|
|
40371
40377
|
MoveComponent,
|
|
@@ -40423,7 +40429,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
40423
40429
|
AddSegmentPopupComponent,
|
|
40424
40430
|
AddResponseSetPopupComponent,
|
|
40425
40431
|
EditorWrapperComponent,
|
|
40426
|
-
QuickSettingsComponent
|
|
40432
|
+
QuickSettingsComponent,
|
|
40427
40433
|
SingleLineEditorComponent,
|
|
40428
40434
|
ResponseSelectorComponent,
|
|
40429
40435
|
MoveComponent,
|