import { Component } from '@angular/core';
import * as i0 from "@angular/core";
export class MultipleTextboxComponent {
    constructor() { }
    ngOnInit() {
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MultipleTextboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: MultipleTextboxComponent, selector: "app-multiple-textbox", ngImport: i0, template: "<div class=\"multiple-textbox vx-d-flex vx-mb-4\">\n    <div class=\"left\">\n        <div class=\"label vx-mb-2\">\n            <input type=\"text\" placeholder=\"Please enter a response\" />\n            <div class=\"heading vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-pr-1\">LABEL 1</div>\n        </div>\n        <input type=\"text\" placeholder=\"Please enter a response\" />\n    </div>\n    <div class=\"right vx-d-flex vx-align-center vx-ml-1\">\n        <button class=\"vx-fs-24 vx-paragraph-txt vx-p-0 vx-m-0 vx-ml-1 vx-d-flex vx-align-center vx-justify-center\">+</button>\n        <button class=\"vx-fs-24 vx-paragraph-txt vx-p-0 vx-m-0 vx-ml-1 vx-d-flex vx-align-center vx-justify-center\" [class.disabled]=\"false\">-</button>\n    </div>\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\";.multiple-textbox .left{width:calc(100% - 4.75rem);position:relative}.multiple-textbox .left .label{border:1px solid #DBDBDB;border-radius:.25rem;height:2.5rem;transition:all .3s ease-in-out;position:relative}.multiple-textbox .left .label:focus-within{border-color:#1e5dd3;box-shadow:0 0 5px #1e5dd345}.multiple-textbox .left .label input[type=text]{border:none;height:2.375rem;padding-left:5rem}.multiple-textbox .left .label input[type=text]:focus{border-color:unset;box-shadow:unset}.multiple-textbox .left .label .heading{position:absolute;top:.625rem;left:.75rem;width:3.5rem}.multiple-textbox .left .label .heading:before{background:#dbdbdb;content:\"\";position:absolute;top:0;right:0;width:1px;height:1rem}.multiple-textbox .left input[type=text]{background:#fff;border:1px solid #DBDBDB;border-radius:.25rem;color:#747576;font-size:12px;padding:.5rem .75rem;width:100%;height:2.5rem;outline:none;transition:all .3s ease-in-out}.multiple-textbox .left input[type=text]:focus{border-color:#1e5dd3;box-shadow:0 0 5px #1e5dd345}.multiple-textbox .right{width:4.5rem;height:2.5rem}.multiple-textbox .right button{background:#f8f8f8;border-radius:50%;border:none;width:2rem;height:2rem}.multiple-textbox .right button.disabled{pointer-events:none;opacity:.5}\n"] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MultipleTextboxComponent, decorators: [{
            type: Component,
            args: [{ selector: 'app-multiple-textbox', template: "<div class=\"multiple-textbox vx-d-flex vx-mb-4\">\n    <div class=\"left\">\n        <div class=\"label vx-mb-2\">\n            <input type=\"text\" placeholder=\"Please enter a response\" />\n            <div class=\"heading vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-pr-1\">LABEL 1</div>\n        </div>\n        <input type=\"text\" placeholder=\"Please enter a response\" />\n    </div>\n    <div class=\"right vx-d-flex vx-align-center vx-ml-1\">\n        <button class=\"vx-fs-24 vx-paragraph-txt vx-p-0 vx-m-0 vx-ml-1 vx-d-flex vx-align-center vx-justify-center\">+</button>\n        <button class=\"vx-fs-24 vx-paragraph-txt vx-p-0 vx-m-0 vx-ml-1 vx-d-flex vx-align-center vx-justify-center\" [class.disabled]=\"false\">-</button>\n    </div>\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\";.multiple-textbox .left{width:calc(100% - 4.75rem);position:relative}.multiple-textbox .left .label{border:1px solid #DBDBDB;border-radius:.25rem;height:2.5rem;transition:all .3s ease-in-out;position:relative}.multiple-textbox .left .label:focus-within{border-color:#1e5dd3;box-shadow:0 0 5px #1e5dd345}.multiple-textbox .left .label input[type=text]{border:none;height:2.375rem;padding-left:5rem}.multiple-textbox .left .label input[type=text]:focus{border-color:unset;box-shadow:unset}.multiple-textbox .left .label .heading{position:absolute;top:.625rem;left:.75rem;width:3.5rem}.multiple-textbox .left .label .heading:before{background:#dbdbdb;content:\"\";position:absolute;top:0;right:0;width:1px;height:1rem}.multiple-textbox .left input[type=text]{background:#fff;border:1px solid #DBDBDB;border-radius:.25rem;color:#747576;font-size:12px;padding:.5rem .75rem;width:100%;height:2.5rem;outline:none;transition:all .3s ease-in-out}.multiple-textbox .left input[type=text]:focus{border-color:#1e5dd3;box-shadow:0 0 5px #1e5dd345}.multiple-textbox .right{width:4.5rem;height:2.5rem}.multiple-textbox .right button{background:#f8f8f8;border-radius:50%;border:none;width:2rem;height:2rem}.multiple-textbox .right button.disabled{pointer-events:none;opacity:.5}\n"] }]
        }], ctorParameters: function () { return []; } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibXVsdGlwbGUtdGV4dGJveC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy92eC13b3JrZmxvdy1lbmdpbmUvc3JjL2xpYi9zaGFyZWRDb21wb25lbnRzL2Fzc2Vzc21lbnQtZWRpdG9yL2NvbXBvbmVudHMvYnVpbGQvbXVsdGlwbGUtdGV4dGJveC9tdWx0aXBsZS10ZXh0Ym94LmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL3Z4LXdvcmtmbG93LWVuZ2luZS9zcmMvbGliL3NoYXJlZENvbXBvbmVudHMvYXNzZXNzbWVudC1lZGl0b3IvY29tcG9uZW50cy9idWlsZC9tdWx0aXBsZS10ZXh0Ym94L211bHRpcGxlLXRleHRib3guY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBVSxNQUFNLGVBQWUsQ0FBQzs7QUFPbEQsTUFBTSxPQUFPLHdCQUF3QjtJQUVuQyxnQkFBZ0IsQ0FBQztJQUVqQixRQUFRO0lBQ1IsQ0FBQzsrR0FMVSx3QkFBd0I7bUdBQXhCLHdCQUF3Qiw0RENQckMsaXdCQVlNOzs0RkRMTyx3QkFBd0I7a0JBTHBDLFNBQVM7K0JBQ0Usc0JBQXNCIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBPbkluaXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnYXBwLW11bHRpcGxlLXRleHRib3gnLFxuICB0ZW1wbGF0ZVVybDogJy4vbXVsdGlwbGUtdGV4dGJveC5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsczogWycuL211bHRpcGxlLXRleHRib3guY29tcG9uZW50Lmxlc3MnXVxufSlcbmV4cG9ydCBjbGFzcyBNdWx0aXBsZVRleHRib3hDb21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQge1xuXG4gIGNvbnN0cnVjdG9yKCkgeyB9XG5cbiAgbmdPbkluaXQoKTogdm9pZCB7XG4gIH1cblxufVxuIiwiPGRpdiBjbGFzcz1cIm11bHRpcGxlLXRleHRib3ggdngtZC1mbGV4IHZ4LW1iLTRcIj5cbiAgICA8ZGl2IGNsYXNzPVwibGVmdFwiPlxuICAgICAgICA8ZGl2IGNsYXNzPVwibGFiZWwgdngtbWItMlwiPlxuICAgICAgICAgICAgPGlucHV0IHR5cGU9XCJ0ZXh0XCIgcGxhY2Vob2xkZXI9XCJQbGVhc2UgZW50ZXIgYSByZXNwb25zZVwiIC8+XG4gICAgICAgICAgICA8ZGl2IGNsYXNzPVwiaGVhZGluZyB2eC1mcy0xMSB2eC1mdy01MDAgdngtbGFiZWwtdHh0IHZ4LXR0LXVwcGVyY2FzZSB2eC1wci0xXCI+TEFCRUwgMTwvZGl2PlxuICAgICAgICA8L2Rpdj5cbiAgICAgICAgPGlucHV0IHR5cGU9XCJ0ZXh0XCIgcGxhY2Vob2xkZXI9XCJQbGVhc2UgZW50ZXIgYSByZXNwb25zZVwiIC8+XG4gICAgPC9kaXY+XG4gICAgPGRpdiBjbGFzcz1cInJpZ2h0IHZ4LWQtZmxleCB2eC1hbGlnbi1jZW50ZXIgdngtbWwtMVwiPlxuICAgICAgICA8YnV0dG9uIGNsYXNzPVwidngtZnMtMjQgdngtcGFyYWdyYXBoLXR4dCB2eC1wLTAgdngtbS0wIHZ4LW1sLTEgdngtZC1mbGV4IHZ4LWFsaWduLWNlbnRlciB2eC1qdXN0aWZ5LWNlbnRlclwiPis8L2J1dHRvbj5cbiAgICAgICAgPGJ1dHRvbiBjbGFzcz1cInZ4LWZzLTI0IHZ4LXBhcmFncmFwaC10eHQgdngtcC0wIHZ4LW0tMCB2eC1tbC0xIHZ4LWQtZmxleCB2eC1hbGlnbi1jZW50ZXIgdngtanVzdGlmeS1jZW50ZXJcIiBbY2xhc3MuZGlzYWJsZWRdPVwiZmFsc2VcIj4tPC9idXR0b24+XG4gICAgPC9kaXY+XG48L2Rpdj4iXX0=