import { Component, EventEmitter, Output } from '@angular/core';
import * as i0 from "@angular/core";
import * as i1 from "@angular/common";
export class QuestionTypeComponent {
    constructor() {
        this.addQuestion = new EventEmitter();
    }
    ngOnInit() {
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: QuestionTypeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: QuestionTypeComponent, selector: "app-question-type", outputs: { addQuestion: "addQuestion" }, ngImport: i0, template: "<div class=\"question-type\">\n    <ul class=\"vx-d-flex vx-flex-wrap vx-p-0 vx-m-0 vx-justify-center\">\n        <li *ngIf=\"false\">\n            <button  class=\"vx-m-0 vx-text-center vx-w-100\" (click)=\"addQuestion.emit('welcome')\">\n                <div class=\"question-icon welcome-screen vx-d-flex vx-align-center vx-justify-center vx-mb-4\"><i class=\"icons vx-fs-16 vx-txt-white\">&#xeab3;</i></div>\n                <div class=\"name vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase\">WELCOME SCREEN</div>\n            </button>\n        </li>\n        <li  *ngIf=\"false\">\n            <button class=\"vx-m-0 vx-text-center vx-w-100\"  (click)=\"addQuestion.emit('thankyou')\">\n                <div class=\"question-icon thank-you-screen vx-d-flex vx-align-center vx-justify-center vx-mb-4\"><i class=\"icons vx-fs-16 vx-txt-white\">&#xeab2;</i></div>\n                <div class=\"name vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase\">THANK YOU SCREEN</div>\n            </button>\n        </li>\n        <li>\n            <button class=\"vx-m-0 vx-text-center vx-w-100\"  (click)=\"addQuestion.emit('multiple-choice')\">\n                <div class=\"question-icon multiple-choice vx-d-flex vx-align-center vx-justify-center vx-mb-4\"><i class=\"icons vx-fs-16 vx-txt-white\">&#xeabd;</i></div>\n                <div class=\"name vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase\">MULTIPLE CHOICE</div>\n            </button>\n        </li>\n        <li>\n            <button class=\"vx-m-0 vx-text-center vx-w-100\"  (click)=\"addQuestion.emit('checkbox')\">\n                <div class=\"question-icon checkboxes vx-d-flex vx-align-center vx-justify-center vx-mb-4\"><i class=\"icons vx-fs-16 vx-txt-white\">&#xeabb;</i></div>\n                <div class=\"name vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase\">CHECKBOXES</div>\n            </button>\n        </li>\n        <li  *ngIf=\"false\">\n            <button class=\"vx-m-0 vx-text-center vx-w-100\"  (click)=\"addQuestion.emit('image-choice')\">\n                <div class=\"question-icon image-choice vx-d-flex vx-align-center vx-justify-center vx-mb-4\"><i class=\"icons vx-fs-16 vx-txt-white\">&#xea29;</i></div>\n                <div class=\"name vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase\">IMAGE CHOICE</div>\n            </button>\n        </li>\n        <li  *ngIf=\"false\">\n            <button class=\"vx-m-0 vx-text-center vx-w-100\"  (click)=\"addQuestion.emit('star-rating')\">\n                <div class=\"question-icon star-rating vx-d-flex vx-align-center vx-justify-center vx-mb-4\"><i class=\"icons vx-fs-16 vx-txt-white\">&#xea71;</i></div>\n                <div class=\"name vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase\">STAR RATINGS</div>\n            </button>\n        </li>\n        <li>\n            <button class=\"vx-m-0 vx-text-center vx-w-100\"  (click)=\"addQuestion.emit('single-textbox')\">\n                <div class=\"question-icon single-textbox vx-d-flex vx-align-center vx-justify-center vx-mb-4\"><i class=\"icons vx-fs-16 vx-txt-white\">&#xeab5;</i></div>\n                <div class=\"name vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase\">SINGLE TEXTBOX</div>\n            </button>\n        </li>\n        <li  *ngIf=\"false\">\n            <button class=\"vx-m-0 vx-text-center vx-w-100\"  (click)=\"addQuestion.emit('comment-box')\">\n                <div class=\"question-icon comment-box vx-d-flex vx-align-center vx-justify-center vx-mb-4\"><i class=\"icons vx-fs-16 vx-txt-white\">&#xe9a6;</i></div>\n                <div class=\"name vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase\">COMMENT BOX</div>\n            </button>\n        </li>\n        <li  *ngIf=\"false\">\n            <button class=\"vx-m-0 vx-text-center vx-w-100\"  (click)=\"addQuestion.emit('matrix-dropdown')\">\n                <div class=\"question-icon matrix-dropdown vx-d-flex vx-align-center vx-justify-center vx-mb-4\"><i class=\"icons vx-fs-16 vx-txt-white\">&#xeab7;</i></div>\n                <div class=\"name vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase\">MATRIX OF DROPDOWNS</div>\n            </button>\n        </li>\n        <li>\n            <button class=\"vx-m-0 vx-text-center vx-w-100\"  (click)=\"addQuestion.emit('dropdown')\">\n                <div class=\"question-icon dropdown-icon vx-d-flex vx-align-center vx-justify-center vx-mb-4\"><i class=\"icons vx-fs-16 vx-txt-white\">&#xeab9;</i></div>\n                <div class=\"name vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase\">DROPDOWN</div>\n            </button>\n        </li>\n        <li  *ngIf=\"false\">\n            <button class=\"vx-m-0 vx-text-center vx-w-100\"  (click)=\"addQuestion.emit('rating-scale')\">\n                <div class=\"question-icon matrix-rating vx-d-flex vx-align-center vx-justify-center vx-mb-4\"><i class=\"icons vx-fs-16 vx-txt-white\">&#xeab8;</i></div>\n                <div class=\"name vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase\">MATRIX & RATING SCALE</div>\n            </button>\n        </li>\n        <li  *ngIf=\"false\">\n            <button class=\"vx-m-0 vx-text-center vx-w-100\"  (click)=\"addQuestion.emit('ranking')\">\n                <div class=\"question-icon ranking vx-d-flex vx-align-center vx-justify-center vx-mb-4\"><i class=\"icons vx-fs-16 vx-txt-white\">&#xeb03;</i></div>\n                <div class=\"name vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase\">RANKING</div>\n            </button>\n        </li>\n        <li  *ngIf=\"false\">\n            <button class=\"vx-m-0 vx-text-center vx-w-100\"  (click)=\"addQuestion.emit('slider')\">\n                <div class=\"question-icon slider vx-d-flex vx-align-center vx-justify-center vx-mb-4\"><i class=\"icons vx-fs-16 vx-txt-white\">&#xeab6;</i></div>\n                <div class=\"name vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase\">SLIDER</div>\n            </button>\n        </li>\n        <li  *ngIf=\"false\">\n            <button class=\"vx-m-0 vx-text-center vx-w-100\"  (click)=\"addQuestion.emit('multiple-textbox')\">\n                <div class=\"question-icon multiple-textbox vx-d-flex vx-align-center vx-justify-center vx-mb-4\"><i class=\"icons vx-fs-16 vx-txt-white\">&#xeab4;</i></div>\n                <div class=\"name vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase\">MULTIPLE TEXTBOXES</div>\n            </button>\n        </li>\n        <li >\n            <button class=\"vx-m-0 vx-text-center vx-w-100\"  (click)=\"addQuestion.emit('date-time')\">\n                <div class=\"question-icon date-time vx-d-flex vx-align-center vx-justify-center vx-mb-4\"><i class=\"icons vx-fs-16 vx-txt-white\">&#xeaba;</i></div>\n                <div class=\"name vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase\">DATE & TIME</div>\n            </button>\n        </li>\n        <li>\n            <button class=\"vx-m-0 vx-text-center vx-w-100\"  (click)=\"addQuestion.emit('file-upload')\">\n                <div class=\"question-icon file-upload vx-d-flex vx-align-center vx-justify-center vx-mb-4\"><i class=\"icons vx-fs-16 vx-txt-white\">&#xea97;</i></div>\n                <div class=\"name vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase\">FILE UPLOAD</div>\n            </button>\n        </li>\n    </ul>\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\";.question-type ul{list-style-type:none;position:relative;left:10rem;width:calc(100% - 20rem)}.question-type ul li{width:12rem;height:7rem;margin:.375rem}.question-type ul li button{background:#fff;border:1px solid #F1F1F1;border-radius:.25rem;padding:1.5rem 0}.question-type ul li button .question-icon{background:#ee5daf;border-radius:.125rem;width:2rem;height:2rem;margin:0 auto}.question-type ul li button .question-icon.welcome-screen{background:#ee5daf}.question-type ul li button .question-icon.thank-you-screen{background:#ee3939}.question-type ul li button .question-icon.multiple-choice{background:#d1c131}.question-type ul li button .question-icon.checkboxes{background:#6f81fc}.question-type ul li button .question-icon.image-choice{background:#4681ef}.question-type ul li button .question-icon.star-rating{background:#e8c247}.question-type ul li button .question-icon.single-textbox{background:#2fd2cd}.question-type ul li button .question-icon.comment-box{background:#acbb7e}.question-type ul li button .question-icon.matrix-dropdown{background:#66bf72}.question-type ul li button .question-icon.dropdown-icon{background:#9d9fe1}.question-type ul li button .question-icon.matrix-rating{background:#67d2cd}.question-type ul li button .question-icon.ranking{background:#ee9f24}.question-type ul li button .question-icon.slider{background:#d1c131}.question-type ul li button .question-icon.multiple-textbox{background:#66bf72}.question-type ul li button .question-icon.date-time{background:#acbb7e}.question-type ul li button .question-icon.file-upload{background:#4681ef}.question-type ul li button:hover{box-shadow:0 .5rem 1rem #1e5dd326}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: QuestionTypeComponent, decorators: [{
            type: Component,
            args: [{ selector: 'app-question-type', template: "<div class=\"question-type\">\n    <ul class=\"vx-d-flex vx-flex-wrap vx-p-0 vx-m-0 vx-justify-center\">\n        <li *ngIf=\"false\">\n            <button  class=\"vx-m-0 vx-text-center vx-w-100\" (click)=\"addQuestion.emit('welcome')\">\n                <div class=\"question-icon welcome-screen vx-d-flex vx-align-center vx-justify-center vx-mb-4\"><i class=\"icons vx-fs-16 vx-txt-white\">&#xeab3;</i></div>\n                <div class=\"name vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase\">WELCOME SCREEN</div>\n            </button>\n        </li>\n        <li  *ngIf=\"false\">\n            <button class=\"vx-m-0 vx-text-center vx-w-100\"  (click)=\"addQuestion.emit('thankyou')\">\n                <div class=\"question-icon thank-you-screen vx-d-flex vx-align-center vx-justify-center vx-mb-4\"><i class=\"icons vx-fs-16 vx-txt-white\">&#xeab2;</i></div>\n                <div class=\"name vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase\">THANK YOU SCREEN</div>\n            </button>\n        </li>\n        <li>\n            <button class=\"vx-m-0 vx-text-center vx-w-100\"  (click)=\"addQuestion.emit('multiple-choice')\">\n                <div class=\"question-icon multiple-choice vx-d-flex vx-align-center vx-justify-center vx-mb-4\"><i class=\"icons vx-fs-16 vx-txt-white\">&#xeabd;</i></div>\n                <div class=\"name vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase\">MULTIPLE CHOICE</div>\n            </button>\n        </li>\n        <li>\n            <button class=\"vx-m-0 vx-text-center vx-w-100\"  (click)=\"addQuestion.emit('checkbox')\">\n                <div class=\"question-icon checkboxes vx-d-flex vx-align-center vx-justify-center vx-mb-4\"><i class=\"icons vx-fs-16 vx-txt-white\">&#xeabb;</i></div>\n                <div class=\"name vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase\">CHECKBOXES</div>\n            </button>\n        </li>\n        <li  *ngIf=\"false\">\n            <button class=\"vx-m-0 vx-text-center vx-w-100\"  (click)=\"addQuestion.emit('image-choice')\">\n                <div class=\"question-icon image-choice vx-d-flex vx-align-center vx-justify-center vx-mb-4\"><i class=\"icons vx-fs-16 vx-txt-white\">&#xea29;</i></div>\n                <div class=\"name vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase\">IMAGE CHOICE</div>\n            </button>\n        </li>\n        <li  *ngIf=\"false\">\n            <button class=\"vx-m-0 vx-text-center vx-w-100\"  (click)=\"addQuestion.emit('star-rating')\">\n                <div class=\"question-icon star-rating vx-d-flex vx-align-center vx-justify-center vx-mb-4\"><i class=\"icons vx-fs-16 vx-txt-white\">&#xea71;</i></div>\n                <div class=\"name vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase\">STAR RATINGS</div>\n            </button>\n        </li>\n        <li>\n            <button class=\"vx-m-0 vx-text-center vx-w-100\"  (click)=\"addQuestion.emit('single-textbox')\">\n                <div class=\"question-icon single-textbox vx-d-flex vx-align-center vx-justify-center vx-mb-4\"><i class=\"icons vx-fs-16 vx-txt-white\">&#xeab5;</i></div>\n                <div class=\"name vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase\">SINGLE TEXTBOX</div>\n            </button>\n        </li>\n        <li  *ngIf=\"false\">\n            <button class=\"vx-m-0 vx-text-center vx-w-100\"  (click)=\"addQuestion.emit('comment-box')\">\n                <div class=\"question-icon comment-box vx-d-flex vx-align-center vx-justify-center vx-mb-4\"><i class=\"icons vx-fs-16 vx-txt-white\">&#xe9a6;</i></div>\n                <div class=\"name vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase\">COMMENT BOX</div>\n            </button>\n        </li>\n        <li  *ngIf=\"false\">\n            <button class=\"vx-m-0 vx-text-center vx-w-100\"  (click)=\"addQuestion.emit('matrix-dropdown')\">\n                <div class=\"question-icon matrix-dropdown vx-d-flex vx-align-center vx-justify-center vx-mb-4\"><i class=\"icons vx-fs-16 vx-txt-white\">&#xeab7;</i></div>\n                <div class=\"name vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase\">MATRIX OF DROPDOWNS</div>\n            </button>\n        </li>\n        <li>\n            <button class=\"vx-m-0 vx-text-center vx-w-100\"  (click)=\"addQuestion.emit('dropdown')\">\n                <div class=\"question-icon dropdown-icon vx-d-flex vx-align-center vx-justify-center vx-mb-4\"><i class=\"icons vx-fs-16 vx-txt-white\">&#xeab9;</i></div>\n                <div class=\"name vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase\">DROPDOWN</div>\n            </button>\n        </li>\n        <li  *ngIf=\"false\">\n            <button class=\"vx-m-0 vx-text-center vx-w-100\"  (click)=\"addQuestion.emit('rating-scale')\">\n                <div class=\"question-icon matrix-rating vx-d-flex vx-align-center vx-justify-center vx-mb-4\"><i class=\"icons vx-fs-16 vx-txt-white\">&#xeab8;</i></div>\n                <div class=\"name vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase\">MATRIX & RATING SCALE</div>\n            </button>\n        </li>\n        <li  *ngIf=\"false\">\n            <button class=\"vx-m-0 vx-text-center vx-w-100\"  (click)=\"addQuestion.emit('ranking')\">\n                <div class=\"question-icon ranking vx-d-flex vx-align-center vx-justify-center vx-mb-4\"><i class=\"icons vx-fs-16 vx-txt-white\">&#xeb03;</i></div>\n                <div class=\"name vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase\">RANKING</div>\n            </button>\n        </li>\n        <li  *ngIf=\"false\">\n            <button class=\"vx-m-0 vx-text-center vx-w-100\"  (click)=\"addQuestion.emit('slider')\">\n                <div class=\"question-icon slider vx-d-flex vx-align-center vx-justify-center vx-mb-4\"><i class=\"icons vx-fs-16 vx-txt-white\">&#xeab6;</i></div>\n                <div class=\"name vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase\">SLIDER</div>\n            </button>\n        </li>\n        <li  *ngIf=\"false\">\n            <button class=\"vx-m-0 vx-text-center vx-w-100\"  (click)=\"addQuestion.emit('multiple-textbox')\">\n                <div class=\"question-icon multiple-textbox vx-d-flex vx-align-center vx-justify-center vx-mb-4\"><i class=\"icons vx-fs-16 vx-txt-white\">&#xeab4;</i></div>\n                <div class=\"name vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase\">MULTIPLE TEXTBOXES</div>\n            </button>\n        </li>\n        <li >\n            <button class=\"vx-m-0 vx-text-center vx-w-100\"  (click)=\"addQuestion.emit('date-time')\">\n                <div class=\"question-icon date-time vx-d-flex vx-align-center vx-justify-center vx-mb-4\"><i class=\"icons vx-fs-16 vx-txt-white\">&#xeaba;</i></div>\n                <div class=\"name vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase\">DATE & TIME</div>\n            </button>\n        </li>\n        <li>\n            <button class=\"vx-m-0 vx-text-center vx-w-100\"  (click)=\"addQuestion.emit('file-upload')\">\n                <div class=\"question-icon file-upload vx-d-flex vx-align-center vx-justify-center vx-mb-4\"><i class=\"icons vx-fs-16 vx-txt-white\">&#xea97;</i></div>\n                <div class=\"name vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase\">FILE UPLOAD</div>\n            </button>\n        </li>\n    </ul>\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\";.question-type ul{list-style-type:none;position:relative;left:10rem;width:calc(100% - 20rem)}.question-type ul li{width:12rem;height:7rem;margin:.375rem}.question-type ul li button{background:#fff;border:1px solid #F1F1F1;border-radius:.25rem;padding:1.5rem 0}.question-type ul li button .question-icon{background:#ee5daf;border-radius:.125rem;width:2rem;height:2rem;margin:0 auto}.question-type ul li button .question-icon.welcome-screen{background:#ee5daf}.question-type ul li button .question-icon.thank-you-screen{background:#ee3939}.question-type ul li button .question-icon.multiple-choice{background:#d1c131}.question-type ul li button .question-icon.checkboxes{background:#6f81fc}.question-type ul li button .question-icon.image-choice{background:#4681ef}.question-type ul li button .question-icon.star-rating{background:#e8c247}.question-type ul li button .question-icon.single-textbox{background:#2fd2cd}.question-type ul li button .question-icon.comment-box{background:#acbb7e}.question-type ul li button .question-icon.matrix-dropdown{background:#66bf72}.question-type ul li button .question-icon.dropdown-icon{background:#9d9fe1}.question-type ul li button .question-icon.matrix-rating{background:#67d2cd}.question-type ul li button .question-icon.ranking{background:#ee9f24}.question-type ul li button .question-icon.slider{background:#d1c131}.question-type ul li button .question-icon.multiple-textbox{background:#66bf72}.question-type ul li button .question-icon.date-time{background:#acbb7e}.question-type ul li button .question-icon.file-upload{background:#4681ef}.question-type ul li button:hover{box-shadow:0 .5rem 1rem #1e5dd326}\n"] }]
        }], ctorParameters: function () { return []; }, propDecorators: { addQuestion: [{
                type: Output
            }] } });
//# sourceMappingURL=data:application/json;base64, 