import * as i20 from '@angular/cdk/drag-drop';
import { moveItemInArray, transferArrayItem, DragDropModule } from '@angular/cdk/drag-drop';
import * as i0 from '@angular/core';
import { EventEmitter, Component, Input, Output, NgModule } from '@angular/core';
import { Constants } from '@asoftwareworld/form-builder/form-control/core';
import { AswJsonPreviewDialog, AswJsonPreviewDialogModule } from '@asoftwareworld/form-builder/form-control/json-preview-dialog';
import * as i1 from '@angular/material/dialog';
import { MatDialogModule } from '@angular/material/dialog';
import * as i2 from '@asoftwareworld/form-builder/form-control/autocomplete';
import { AswAutocompleteModule } from '@asoftwareworld/form-builder/form-control/autocomplete';
import * as i3 from '@asoftwareworld/form-builder/form-control/header';
import { AswHeaderModule } from '@asoftwareworld/form-builder/form-control/header';
import * as i4 from '@asoftwareworld/form-builder/form-control/image';
import { AswImageModule } from '@asoftwareworld/form-builder/form-control/image';
import * as i5 from '@asoftwareworld/form-builder/form-control/textbox';
import { AswTextboxModule } from '@asoftwareworld/form-builder/form-control/textbox';
import * as i6 from '@asoftwareworld/form-builder/form-control/textarea';
import { AswTextareaModule } from '@asoftwareworld/form-builder/form-control/textarea';
import * as i7 from '@asoftwareworld/form-builder/form-control/select';
import { AswSelectModule } from '@asoftwareworld/form-builder/form-control/select';
import * as i8 from '@asoftwareworld/form-builder/form-control/multi-select';
import { AswMultiSelectModule } from '@asoftwareworld/form-builder/form-control/multi-select';
import * as i9 from '@asoftwareworld/form-builder/form-control/radio-button';
import { AswRadioButtonModule } from '@asoftwareworld/form-builder/form-control/radio-button';
import * as i10 from '@asoftwareworld/form-builder/form-control/checkbox';
import { AswCheckboxModule } from '@asoftwareworld/form-builder/form-control/checkbox';
import * as i11 from '@asoftwareworld/form-builder/form-control/datepicker';
import { AswDatepickerModule } from '@asoftwareworld/form-builder/form-control/datepicker';
import * as i12 from '@asoftwareworld/form-builder/form-control/button';
import { AswButtonModule } from '@asoftwareworld/form-builder/form-control/button';
import * as i13 from '@asoftwareworld/form-builder/form-control/paragraph';
import { AswParagraphModule } from '@asoftwareworld/form-builder/form-control/paragraph';
import * as i14 from '@asoftwareworld/form-builder/form-control/divider';
import { AswDividerModule } from '@asoftwareworld/form-builder/form-control/divider';
import * as i15 from '@asoftwareworld/form-builder/form-control/slide-toggle';
import { AswSlideToggleModule } from '@asoftwareworld/form-builder/form-control/slide-toggle';
import * as i16 from '@asoftwareworld/form-builder/form-control/gps';
import { AswGpsModule } from '@asoftwareworld/form-builder/form-control/gps';
import * as i17 from '@asoftwareworld/form-builder/form-control/signature';
import { AswSignatureModule } from '@asoftwareworld/form-builder/form-control/signature';
import * as i18 from '@asoftwareworld/form-builder/form-control/drawing';
import { AswDrawingModule } from '@asoftwareworld/form-builder/form-control/drawing';
import * as i19 from '@angular/common';
import { CommonModule } from '@angular/common';
import { ClipboardModule } from '@angular/cdk/clipboard';
import { HttpClientModule } from '@angular/common/http';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { MatIconModule } from '@angular/material/icon';

/**
 * @license
 * Copyright ASW (A Software World) All Rights Reserved.
 *
 * Use of this source code is governed by an MIT-style license that can be
 * found in the LICENSE file
 */
const CONTROLS = [
    {
        icon: 'title',
        displayName: 'Header',
        controlType: 'header',
        subtype: 'h1',
        style: 'text-left',
        label: 'Header',
        column: 'col-md-12',
    },
    {
        icon: 'image',
        displayName: 'Image',
        controlType: 'image',
        label: 'Image',
        column: 'col-md-12',
        class: 'float-left float-start',
        imageShape: 'asw-avatar-wrapper-circle',
        imageUrl: 'data:image/png;base64, ',
        event: {
            isTrusted: true
        }
    },
    {
        icon: 'corporate_fare',
        displayName: 'Autocomplete',
        controlType: 'autocomplete',
        name: 'autocomplete',
        tooltip: 'Select one',
        label: 'Autocomplete',
        column: 'col-md-12',
        style: 'outline',
        isRequired: false,
        options: [
            { key: 'option-1', value: 'Option 1', isChecked: false },
            { key: 'option-2', value: 'Option 2', isChecked: false },
            { key: 'option-3', value: 'Option 3', isChecked: false }
        ]
    },
    {
        icon: 'text_fields',
        displayName: 'Textbox',
        controlType: 'textbox',
        name: 'Textbox',
        tooltip: 'Enter Text',
        value: '',
        label: 'TextBox',
        style: 'outline',
        column: 'col-md-12',
        isRequired: false,
        maxlength: 50,
        minlength: 0
    },
    {
        icon: 'notes',
        displayName: 'Text Area',
        controlType: 'textarea',
        name: 'textarea',
        tooltip: 'Enter Text',
        value: '',
        label: 'TextArea',
        style: 'outline',
        column: 'col-md-12',
        isRequired: false,
        maxlength: 50,
        minlength: 0
    },
    {
        icon: 'event',
        displayName: 'Datepicker',
        controlType: 'datepicker',
        name: 'datepicker',
        value: '',
        tooltip: 'Choose a date',
        label: 'Date Picker',
        style: 'outline',
        column: 'col-md-12',
        isRequired: false
    },
    {
        icon: 'arrow_drop_down_circle',
        displayName: 'Select',
        controlType: 'select',
        name: 'select',
        tooltip: 'Select option',
        label: 'Select',
        style: 'outline',
        column: 'col-md-12',
        value: '',
        isRequired: false,
        options: [
            { key: 'option-1', value: 'Option 1', isChecked: false },
            { key: 'option-2', value: 'Option 2', isChecked: false },
            { key: 'option-3', value: 'Option 3', isChecked: false }
        ]
    },
    {
        icon: 'storage',
        displayName: 'Multi Select',
        controlType: 'multi-select',
        name: 'multi-select',
        tooltip: 'Select options',
        label: 'MultiSelect',
        column: 'col-md-12',
        value: '',
        style: 'outline',
        isRequired: false,
        options: [
            { key: 'option-1', value: 'Option 1', isChecked: false },
            { key: 'option-2', value: 'Option 2', isChecked: false },
            { key: 'option-3', value: 'Option 3', isChecked: false }
        ]
    },
    {
        icon: 'radio_button_checked',
        displayName: 'Radio Button',
        controlType: 'radio',
        name: 'radio',
        tooltip: 'radio',
        label: 'Radio',
        value: 'option-1',
        column: 'col-md-12',
        isRequired: false,
        options: [
            { key: 'option-1', value: 'Option 1', isChecked: false },
            { key: 'option-2', value: 'Option 2', isChecked: false },
            { key: 'option-3', value: 'Option 3', isChecked: false }
        ]
    },
    {
        icon: 'check_box',
        displayName: 'Checkbox',
        controlType: 'checkbox',
        name: 'checkbox',
        tooltip: 'checkbox',
        label: 'Checkbox',
        column: 'col-md-12',
        isRequired: false,
        options: [
            { key: 'option-1', value: 'Option 1', isChecked: false },
            { key: 'option-2', value: 'Option 2', isChecked: false },
            { key: 'option-3', value: 'Option 3', isChecked: false }
        ]
    },
    {
        icon: 'touch_app',
        displayName: 'Button',
        controlType: 'button',
        name: 'button',
        tooltip: 'Click button',
        label: 'Button',
        type: 'button',
        column: 'col-md-12',
        color: 'primary',
        style: 'mat-raised-button',
        isRequired: false
    },
    {
        icon: 'format_textdirection_l_to_r',
        displayName: 'Paragraph',
        controlType: 'paragraph',
        label: 'Paragraph',
        column: 'col-md-12',
        subtype: 'p',
        style: 'text-left'
    },
    {
        icon: 'horizontal_rule',
        displayName: 'Divider',
        controlType: 'divider',
        column: 'col-md-12'
    },
    {
        icon: 'toggle_on',
        displayName: 'Slide Toggle',
        controlType: 'slide-toggle',
        label: 'Slide me!',
        value: false,
        color: 'primary',
        column: 'col-md-12',
        isRequired: false
    },
    {
        icon: 'location_on',
        displayName: 'GPS',
        controlType: 'gps',
        name: 'gps',
        label: 'Gps',
        tooltip: 'Enter Location',
        latitude: '',
        longitude: '',
        style: 'outline',
        column: 'col-md-12',
        value: '',
        isRequired: false
    },
    {
        icon: 'edit',
        displayName: 'Signature',
        controlType: 'signature',
        label: 'Image',
        imageUrl: '',
        column: 'col-md-12',
        isRequired: false
    },
    {
        icon: 'border_color',
        displayName: 'Drawing',
        controlType: 'drawing',
        label: 'Image',
        imageUrl: '',
        column: 'col-md-12',
        isRequired: false
    }
];

/**
 * @license
 * Copyright ASW (A Software World) All Rights Reserved.
 *
 * Use of this source code is governed by an MIT-style license that can be
 * found in the LICENSE file
 */
class AswFormBuilder {
    constructor(dialog) {
        this.dialog = dialog;
        this.constants = Constants;
        this.availableControls = [];
        this.formContainer = [];
        this.uploadData = [];
        this.isShowPreviewButton = true;
        this.isShowJsonDataButton = true;
        this.isShowPublishButton = true;
        this.previewClick = new EventEmitter();
        this.publishClick = new EventEmitter();
    }
    ngOnInit() {
        this.availableControls = CONTROLS;
        if (this.uploadData.length) {
            this.formContainer = this.uploadData;
        }
    }
    drop(event) {
        if (event.previousContainer === event.container) {
            moveItemInArray(event.container.data, event.previousIndex, event.currentIndex);
        }
        else {
            transferArrayItem(JSON.parse(JSON.stringify(event.previousContainer.data)), event.container.data, event.previousIndex, event.currentIndex);
        }
    }
    updatedControl(data) {
        this.formContainer.splice(data.index, 1, data.control);
    }
    deleteControl(index) {
        this.formContainer.splice(index, 1);
    }
    previewTemplate() {
        this.previewClick.emit(this.formContainer);
    }
    previewJsonData() {
        const dialogRef = this.dialog.open(AswJsonPreviewDialog, {
            disableClose: true,
            width: '744px',
            data: this.formContainer
        });
        dialogRef.afterClosed();
    }
    publishTemplate() {
        this.publishClick.emit(this.formContainer);
    }
}
AswFormBuilder.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.4", ngImport: i0, type: AswFormBuilder, deps: [{ token: i1.MatDialog }], target: i0.ɵɵFactoryTarget.Component });
AswFormBuilder.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.4", type: AswFormBuilder, selector: "asw-form-builder", inputs: { uploadData: "uploadData", isShowPreviewButton: "isShowPreviewButton", isShowJsonDataButton: "isShowJsonDataButton", isShowPublishButton: "isShowPublishButton" }, outputs: { previewClick: "previewClick", publishClick: "publishClick" }, ngImport: i0, template: "<div class=\"row\">\r\n    <div class=\"col-md-12 text-right float-right text-end\">\r\n        <button type=\"button\" *ngIf=\"isShowPreviewButton\"\r\n                class=\"btn btn-primary btn-sm mr-1 mb-2 me-1\"\r\n                (click)=\"previewTemplate()\">Preview</button>\r\n        <button type=\"button\" *ngIf=\"isShowJsonDataButton\"\r\n                class=\"btn btn-secondary btn-sm mr-1 mb-2 me-1\"\r\n                (click)=\"previewJsonData()\">Json Data</button>\r\n        <button class=\"btn btn-success btn-sm mb-2 me-1\"\r\n                type=\"button\" *ngIf=\"isShowPublishButton\"\r\n                (click)=\"publishTemplate()\">Publish</button>\r\n    </div>\r\n</div>\r\n<div class=\"row\" cdkDropListGroup>\r\n    <div class=\"col-md-3\">\r\n        <div class=\"card\">\r\n            <div class=\"card-body\">\r\n                <h4 class=\"card-title mb-3\">Controls</h4>\r\n                <div cdkDropList\r\n                    [cdkDropListData]=\"availableControls\"\r\n                    class=\"asw-list\">\r\n                    <div class=\"row\">\r\n                        <ng-container *ngFor=\"let item of availableControls\">\r\n                            <div class=\"asw-box col-md-12\" cdkDrag>\r\n                                <i class=\"asw-mat-icon material-icons\" aria-hidden=\"false\">{{item.icon}}</i>\r\n                                {{item.displayName}}\r\n                            </div>\r\n                        </ng-container>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n        </div>\r\n    </div>\r\n    <div class=\"col-md-9\">\r\n        <div class=\"card\">            \r\n            <div class=\"card-body\">\r\n                <h4 class=\"card-title mb-3\">Drop Area</h4>\r\n                <div cdkDropList\r\n                    [cdkDropListData]=\"formContainer\"\r\n                    class=\"asw-list\"\r\n                    (cdkDropListDropped)=\"drop($event)\">\r\n                    <div class=\"row\">\r\n                        <ng-container *ngFor=\"let control of formContainer; let i = index\">\r\n                            <div class=\"asw-box\" [ngClass]=\"control.column\" cdkDrag>\r\n                                <ng-container [ngSwitch]=\"control.controlType\" class=\"asw-full-width\">\r\n                                    <ng-container *ngSwitchCase=\"'autocomplete'\">\r\n                                        <asw-autocomplete [control]=\"control\"\r\n                                                            [controlIndex]=\"i\"\r\n                                                            [isPreviewTemplate]=\"true\"\r\n                                                            (autocompleteUpdateEvent)=\"updatedControl($event)\"\r\n                                                            (autocompleteDeleteEvent)=\"deleteControl($event)\">\r\n                                        </asw-autocomplete>\r\n                                    </ng-container>\r\n                                    <ng-container *ngSwitchCase=\"'header'\">\r\n                                        <asw-header [control]=\"control\"\r\n                                                    [controlIndex]=\"i\"\r\n                                                    [isPreviewTemplate]=\"true\"\r\n                                                    (headerUpdateEvent)=\"updatedControl($event)\"\r\n                                                    (headerDeleteEvent)=\"deleteControl($event)\">\r\n                                        </asw-header>\r\n                                    </ng-container>\r\n                                    <ng-container *ngSwitchCase=\"'image'\">\r\n                                        <asw-image [control]=\"control\"\r\n                                                    [controlIndex]=\"i\"\r\n                                                    [isPreviewTemplate]=\"true\"\r\n                                                    (imageUpdateEvent)=\"updatedControl($event)\"\r\n                                                    (imageDeleteEvent)=\"deleteControl($event)\">\r\n                                        </asw-image>\r\n                                    </ng-container>\r\n                                    <ng-container *ngSwitchCase=\"'textbox'\">\r\n                                        <asw-textbox [control]=\"control\"\r\n                                                    [controlIndex]=\"i\"\r\n                                                    [isPreviewTemplate]=\"true\"\r\n                                                    (textboxUpdateEvent)=\"updatedControl($event)\"\r\n                                                    (textboxDeleteEvent)=\"deleteControl($event)\">\r\n                                        </asw-textbox>\r\n                                    </ng-container>\r\n                                    <ng-container *ngSwitchCase=\"'textarea'\">\r\n                                        <asw-textarea [control]=\"control\"\r\n                                                        [controlIndex]=\"i\"\r\n                                                        [isPreviewTemplate]=\"true\"\r\n                                                        (textAreaUpdateEvent)=\"updatedControl($event)\"\r\n                                                        (textAreaDeleteEvent)=\"deleteControl($event)\">\r\n                                        </asw-textarea>\r\n                                    </ng-container>\r\n                                    <ng-container *ngSwitchCase=\"'select'\">\r\n                                        <asw-select [control]=\"control\"\r\n                                                    [controlIndex]=\"i\"\r\n                                                    [isPreviewTemplate]=\"true\"\r\n                                                    (selectUpdateEvent)=\"updatedControl($event)\"\r\n                                                    (selectDeleteEvent)=\"deleteControl($event)\">\r\n                                        </asw-select>\r\n                                    </ng-container>\r\n                                    <ng-container *ngSwitchCase=\"'multi-select'\">\r\n                                        <asw-multi-select [control]=\"control\"\r\n                                                            [controlIndex]=\"i\"\r\n                                                            [isPreviewTemplate]=\"true\"\r\n                                                            (multiSelectUpdateEvent)=\"updatedControl($event)\"\r\n                                                            (multiSelectDeleteEvent)=\"deleteControl($event)\">\r\n                                        </asw-multi-select>\r\n                                    </ng-container>\r\n                                    <ng-container *ngSwitchCase=\"'radio'\">\r\n                                        <asw-radio-button [control]=\"control\"\r\n                                                            [controlIndex]=\"i\"\r\n                                                            [isPreviewTemplate]=\"true\"\r\n                                                            (radioButtonUpdateEvent)=\"updatedControl($event)\"\r\n                                                            (radioButtonDeleteEvent)=\"deleteControl($event)\">\r\n                                        </asw-radio-button>\r\n                                    </ng-container>\r\n                                    <ng-container *ngSwitchCase=\"'checkbox'\">\r\n                                        <asw-checkbox [control]=\"control\"\r\n                                                        [controlIndex]=\"i\"\r\n                                                        [isPreviewTemplate]=\"true\"\r\n                                                        (checkboxUpdateEvent)=\"updatedControl($event)\"\r\n                                                        (checkboxDeleteEvent)=\"deleteControl($event)\">\r\n                                        </asw-checkbox>\r\n                                    </ng-container>\r\n                                    <ng-container *ngSwitchCase=\"'datepicker'\">\r\n                                        <asw-datepicker [control]=\"control\"\r\n                                                        [controlIndex]=\"i\"\r\n                                                        [isPreviewTemplate]=\"true\"\r\n                                                        (datepickerUpdateEvent)=\"updatedControl($event)\"\r\n                                                        (datepickerDeleteEvent)=\"deleteControl($event)\">\r\n                                        </asw-datepicker>\r\n                                    </ng-container>\r\n                                    <ng-container *ngSwitchCase=\"'button'\">\r\n                                        <asw-button [control]=\"control\"\r\n                                                    [controlIndex]=\"i\"\r\n                                                    [isPreviewTemplate]=\"true\"\r\n                                                    (buttonUpdateEvent)=\"updatedControl($event)\"\r\n                                                    (buttonDeleteEvent)=\"deleteControl($event)\">\r\n                                        </asw-button>                                       \r\n                                    </ng-container>\r\n                                    <ng-container *ngSwitchCase=\"'paragraph'\">\r\n                                        <asw-paragraph [control]=\"control\"\r\n                                                    [controlIndex]=\"i\"\r\n                                                    [isPreviewTemplate]=\"true\"\r\n                                                    (paragraphUpdateEvent)=\"updatedControl($event)\"\r\n                                                    (paragraphDeleteEvent)=\"deleteControl($event)\">\r\n                                        </asw-paragraph>\r\n                                    </ng-container>\r\n                                    <ng-container *ngSwitchCase=\"'divider'\">\r\n                                        <asw-divider [control]=\"control\"\r\n                                                        [controlIndex]=\"i\"\r\n                                                        [isPreviewTemplate]=\"true\"\r\n                                                        (dividerDeleteEvent)=\"deleteControl($event)\">\r\n                                        </asw-divider>\r\n                                    </ng-container>\r\n                                    <ng-container *ngSwitchCase=\"'slide-toggle'\">\r\n                                        <asw-slide-toggle [control]=\"control\"\r\n                                                            [controlIndex]=\"i\"\r\n                                                            [isPreviewTemplate]=\"true\"\r\n                                                            (slidetoggleUpdateEvent)=\"updatedControl($event)\"\r\n                                                            (slidetoggleDeleteEvent)=\"deleteControl($event)\">\r\n                                        </asw-slide-toggle>\r\n                                    </ng-container>\r\n                                    <ng-container *ngSwitchCase=\"'gps'\">\r\n                                        <asw-gps [control]=\"control\"\r\n                                                    [controlIndex]=\"i\"\r\n                                                    [isPreviewTemplate]=\"true\"\r\n                                                    (gpsUpdateEvent)=\"updatedControl($event)\"\r\n                                                    (gpsDeleteEvent)=\"deleteControl($event)\">\r\n                                        </asw-gps>\r\n                                    </ng-container>\r\n                                    <ng-container *ngSwitchCase=\"'signature'\">\r\n                                        <asw-signature [control]=\"control\"\r\n                                                        [controlIndex]=\"i\"\r\n                                                        [isPreviewTemplate]=\"true\"\r\n                                                        (signatureUpdateEvent)=\"updatedControl($event)\"\r\n                                                        (signatureDeleteEvent)=\"deleteControl($event)\">\r\n                                        </asw-signature>\r\n                                    </ng-container>\r\n                                    <ng-container *ngSwitchCase=\"'drawing'\">\r\n                                        <asw-drawing [control]=\"control\"\r\n                                                        [controlIndex]=\"i\"\r\n                                                        [isPreviewTemplate]=\"true\"\r\n                                                        (drawingUpdateEvent)=\"updatedControl($event)\"\r\n                                                        (drawingDeleteEvent)=\"deleteControl($event)\">\r\n                                        </asw-drawing>\r\n                                    </ng-container>\r\n                                </ng-container>\r\n                            </div>\r\n                        </ng-container>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</div>", styles: [".asw-list{min-height:595px;border-radius:4px;display:block}.asw-box{padding:7px;border-bottom:solid 1px #ccc;color:#000000de;flex-direction:row;align-items:center;justify-content:space-between;box-sizing:border-box;cursor:move;background:white;font-size:14px}.cdk-drag-preview{box-sizing:border-box;border-radius:4px;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}.cdk-drag-placeholder{opacity:0}.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.asw-list.cdk-drop-list-dragging .asw-box:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}\n"], components: [{ type: i2.AswAutocomplete, selector: "asw-autocomplete", inputs: ["control", "controlIndex", "isPreviewTemplate"], outputs: ["autocompleteUpdateEvent", "autocompleteDeleteEvent"] }, { type: i3.AswHeader, selector: "asw-header", inputs: ["control", "controlIndex", "isPreviewTemplate"], outputs: ["headerUpdateEvent", "headerDeleteEvent"] }, { type: i4.AswImage, selector: "asw-image", inputs: ["control", "controlIndex", "isPreviewTemplate"], outputs: ["imageUpdateEvent", "imageDeleteEvent"] }, { type: i5.AswTextbox, selector: "asw-textbox", inputs: ["control", "controlIndex", "isPreviewTemplate"], outputs: ["textboxUpdateEvent", "textboxDeleteEvent"] }, { type: i6.AswTextarea, selector: "asw-textarea", inputs: ["control", "controlIndex", "isPreviewTemplate"], outputs: ["textAreaUpdateEvent", "textAreaDeleteEvent"] }, { type: i7.AswSelect, selector: "asw-select", inputs: ["control", "controlIndex", "isPreviewTemplate"], outputs: ["selectUpdateEvent", "selectDeleteEvent"] }, { type: i8.AswMultiSelect, selector: "asw-multi-select", inputs: ["control", "controlIndex", "isPreviewTemplate"], outputs: ["multiSelectUpdateEvent", "multiSelectDeleteEvent"] }, { type: i9.AswRadioButton, selector: "asw-radio-button", inputs: ["control", "controlIndex", "isPreviewTemplate"], outputs: ["radioButtonUpdateEvent", "radioButtonDeleteEvent"] }, { type: i10.AswCheckbox, selector: "asw-checkbox", inputs: ["control", "controlIndex", "isPreviewTemplate"], outputs: ["checkboxUpdateEvent", "checkboxDeleteEvent"] }, { type: i11.AswDatepicker, selector: "asw-datepicker", inputs: ["control", "controlIndex", "isPreviewTemplate"], outputs: ["datepickerUpdateEvent", "datepickerDeleteEvent"] }, { type: i12.AswButton, selector: "asw-button", inputs: ["control", "controlIndex", "isPreviewTemplate"], outputs: ["buttonUpdateEvent", "buttonDeleteEvent"] }, { type: i13.AswParagraph, selector: "asw-paragraph", inputs: ["control", "controlIndex", "isPreviewTemplate"], outputs: ["paragraphUpdateEvent", "paragraphDeleteEvent"] }, { type: i14.AswDivider, selector: "asw-divider", inputs: ["control", "controlIndex", "isPreviewTemplate"], outputs: ["dividerDeleteEvent"] }, { type: i15.AswSlideToggle, selector: "asw-slide-toggle", inputs: ["control", "controlIndex", "isPreviewTemplate"], outputs: ["slidetoggleUpdateEvent", "slidetoggleDeleteEvent"] }, { type: i16.AswGps, selector: "asw-gps", inputs: ["control", "controlIndex", "isPreviewTemplate"], outputs: ["gpsUpdateEvent", "gpsDeleteEvent"] }, { type: i17.AswSignature, selector: "asw-signature", inputs: ["control", "controlIndex", "isPreviewTemplate"], outputs: ["signatureUpdateEvent", "signatureDeleteEvent"] }, { type: i18.AswDrawing, selector: "asw-drawing", inputs: ["control", "controlIndex", "isPreviewTemplate"], outputs: ["drawingUpdateEvent", "drawingDeleteEvent"] }], directives: [{ type: i19.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i20.CdkDropListGroup, selector: "[cdkDropListGroup]", inputs: ["cdkDropListGroupDisabled"], exportAs: ["cdkDropListGroup"] }, { type: i20.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { type: i19.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i20.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { type: i19.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i19.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i19.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.4", ngImport: i0, type: AswFormBuilder, decorators: [{
            type: Component,
            args: [{ selector: 'asw-form-builder', template: "<div class=\"row\">\r\n    <div class=\"col-md-12 text-right float-right text-end\">\r\n        <button type=\"button\" *ngIf=\"isShowPreviewButton\"\r\n                class=\"btn btn-primary btn-sm mr-1 mb-2 me-1\"\r\n                (click)=\"previewTemplate()\">Preview</button>\r\n        <button type=\"button\" *ngIf=\"isShowJsonDataButton\"\r\n                class=\"btn btn-secondary btn-sm mr-1 mb-2 me-1\"\r\n                (click)=\"previewJsonData()\">Json Data</button>\r\n        <button class=\"btn btn-success btn-sm mb-2 me-1\"\r\n                type=\"button\" *ngIf=\"isShowPublishButton\"\r\n                (click)=\"publishTemplate()\">Publish</button>\r\n    </div>\r\n</div>\r\n<div class=\"row\" cdkDropListGroup>\r\n    <div class=\"col-md-3\">\r\n        <div class=\"card\">\r\n            <div class=\"card-body\">\r\n                <h4 class=\"card-title mb-3\">Controls</h4>\r\n                <div cdkDropList\r\n                    [cdkDropListData]=\"availableControls\"\r\n                    class=\"asw-list\">\r\n                    <div class=\"row\">\r\n                        <ng-container *ngFor=\"let item of availableControls\">\r\n                            <div class=\"asw-box col-md-12\" cdkDrag>\r\n                                <i class=\"asw-mat-icon material-icons\" aria-hidden=\"false\">{{item.icon}}</i>\r\n                                {{item.displayName}}\r\n                            </div>\r\n                        </ng-container>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n        </div>\r\n    </div>\r\n    <div class=\"col-md-9\">\r\n        <div class=\"card\">            \r\n            <div class=\"card-body\">\r\n                <h4 class=\"card-title mb-3\">Drop Area</h4>\r\n                <div cdkDropList\r\n                    [cdkDropListData]=\"formContainer\"\r\n                    class=\"asw-list\"\r\n                    (cdkDropListDropped)=\"drop($event)\">\r\n                    <div class=\"row\">\r\n                        <ng-container *ngFor=\"let control of formContainer; let i = index\">\r\n                            <div class=\"asw-box\" [ngClass]=\"control.column\" cdkDrag>\r\n                                <ng-container [ngSwitch]=\"control.controlType\" class=\"asw-full-width\">\r\n                                    <ng-container *ngSwitchCase=\"'autocomplete'\">\r\n                                        <asw-autocomplete [control]=\"control\"\r\n                                                            [controlIndex]=\"i\"\r\n                                                            [isPreviewTemplate]=\"true\"\r\n                                                            (autocompleteUpdateEvent)=\"updatedControl($event)\"\r\n                                                            (autocompleteDeleteEvent)=\"deleteControl($event)\">\r\n                                        </asw-autocomplete>\r\n                                    </ng-container>\r\n                                    <ng-container *ngSwitchCase=\"'header'\">\r\n                                        <asw-header [control]=\"control\"\r\n                                                    [controlIndex]=\"i\"\r\n                                                    [isPreviewTemplate]=\"true\"\r\n                                                    (headerUpdateEvent)=\"updatedControl($event)\"\r\n                                                    (headerDeleteEvent)=\"deleteControl($event)\">\r\n                                        </asw-header>\r\n                                    </ng-container>\r\n                                    <ng-container *ngSwitchCase=\"'image'\">\r\n                                        <asw-image [control]=\"control\"\r\n                                                    [controlIndex]=\"i\"\r\n                                                    [isPreviewTemplate]=\"true\"\r\n                                                    (imageUpdateEvent)=\"updatedControl($event)\"\r\n                                                    (imageDeleteEvent)=\"deleteControl($event)\">\r\n                                        </asw-image>\r\n                                    </ng-container>\r\n                                    <ng-container *ngSwitchCase=\"'textbox'\">\r\n                                        <asw-textbox [control]=\"control\"\r\n                                                    [controlIndex]=\"i\"\r\n                                                    [isPreviewTemplate]=\"true\"\r\n                                                    (textboxUpdateEvent)=\"updatedControl($event)\"\r\n                                                    (textboxDeleteEvent)=\"deleteControl($event)\">\r\n                                        </asw-textbox>\r\n                                    </ng-container>\r\n                                    <ng-container *ngSwitchCase=\"'textarea'\">\r\n                                        <asw-textarea [control]=\"control\"\r\n                                                        [controlIndex]=\"i\"\r\n                                                        [isPreviewTemplate]=\"true\"\r\n                                                        (textAreaUpdateEvent)=\"updatedControl($event)\"\r\n                                                        (textAreaDeleteEvent)=\"deleteControl($event)\">\r\n                                        </asw-textarea>\r\n                                    </ng-container>\r\n                                    <ng-container *ngSwitchCase=\"'select'\">\r\n                                        <asw-select [control]=\"control\"\r\n                                                    [controlIndex]=\"i\"\r\n                                                    [isPreviewTemplate]=\"true\"\r\n                                                    (selectUpdateEvent)=\"updatedControl($event)\"\r\n                                                    (selectDeleteEvent)=\"deleteControl($event)\">\r\n                                        </asw-select>\r\n                                    </ng-container>\r\n                                    <ng-container *ngSwitchCase=\"'multi-select'\">\r\n                                        <asw-multi-select [control]=\"control\"\r\n                                                            [controlIndex]=\"i\"\r\n                                                            [isPreviewTemplate]=\"true\"\r\n                                                            (multiSelectUpdateEvent)=\"updatedControl($event)\"\r\n                                                            (multiSelectDeleteEvent)=\"deleteControl($event)\">\r\n                                        </asw-multi-select>\r\n                                    </ng-container>\r\n                                    <ng-container *ngSwitchCase=\"'radio'\">\r\n                                        <asw-radio-button [control]=\"control\"\r\n                                                            [controlIndex]=\"i\"\r\n                                                            [isPreviewTemplate]=\"true\"\r\n                                                            (radioButtonUpdateEvent)=\"updatedControl($event)\"\r\n                                                            (radioButtonDeleteEvent)=\"deleteControl($event)\">\r\n                                        </asw-radio-button>\r\n                                    </ng-container>\r\n                                    <ng-container *ngSwitchCase=\"'checkbox'\">\r\n                                        <asw-checkbox [control]=\"control\"\r\n                                                        [controlIndex]=\"i\"\r\n                                                        [isPreviewTemplate]=\"true\"\r\n                                                        (checkboxUpdateEvent)=\"updatedControl($event)\"\r\n                                                        (checkboxDeleteEvent)=\"deleteControl($event)\">\r\n                                        </asw-checkbox>\r\n                                    </ng-container>\r\n                                    <ng-container *ngSwitchCase=\"'datepicker'\">\r\n                                        <asw-datepicker [control]=\"control\"\r\n                                                        [controlIndex]=\"i\"\r\n                                                        [isPreviewTemplate]=\"true\"\r\n                                                        (datepickerUpdateEvent)=\"updatedControl($event)\"\r\n                                                        (datepickerDeleteEvent)=\"deleteControl($event)\">\r\n                                        </asw-datepicker>\r\n                                    </ng-container>\r\n                                    <ng-container *ngSwitchCase=\"'button'\">\r\n                                        <asw-button [control]=\"control\"\r\n                                                    [controlIndex]=\"i\"\r\n                                                    [isPreviewTemplate]=\"true\"\r\n                                                    (buttonUpdateEvent)=\"updatedControl($event)\"\r\n                                                    (buttonDeleteEvent)=\"deleteControl($event)\">\r\n                                        </asw-button>                                       \r\n                                    </ng-container>\r\n                                    <ng-container *ngSwitchCase=\"'paragraph'\">\r\n                                        <asw-paragraph [control]=\"control\"\r\n                                                    [controlIndex]=\"i\"\r\n                                                    [isPreviewTemplate]=\"true\"\r\n                                                    (paragraphUpdateEvent)=\"updatedControl($event)\"\r\n                                                    (paragraphDeleteEvent)=\"deleteControl($event)\">\r\n                                        </asw-paragraph>\r\n                                    </ng-container>\r\n                                    <ng-container *ngSwitchCase=\"'divider'\">\r\n                                        <asw-divider [control]=\"control\"\r\n                                                        [controlIndex]=\"i\"\r\n                                                        [isPreviewTemplate]=\"true\"\r\n                                                        (dividerDeleteEvent)=\"deleteControl($event)\">\r\n                                        </asw-divider>\r\n                                    </ng-container>\r\n                                    <ng-container *ngSwitchCase=\"'slide-toggle'\">\r\n                                        <asw-slide-toggle [control]=\"control\"\r\n                                                            [controlIndex]=\"i\"\r\n                                                            [isPreviewTemplate]=\"true\"\r\n                                                            (slidetoggleUpdateEvent)=\"updatedControl($event)\"\r\n                                                            (slidetoggleDeleteEvent)=\"deleteControl($event)\">\r\n                                        </asw-slide-toggle>\r\n                                    </ng-container>\r\n                                    <ng-container *ngSwitchCase=\"'gps'\">\r\n                                        <asw-gps [control]=\"control\"\r\n                                                    [controlIndex]=\"i\"\r\n                                                    [isPreviewTemplate]=\"true\"\r\n                                                    (gpsUpdateEvent)=\"updatedControl($event)\"\r\n                                                    (gpsDeleteEvent)=\"deleteControl($event)\">\r\n                                        </asw-gps>\r\n                                    </ng-container>\r\n                                    <ng-container *ngSwitchCase=\"'signature'\">\r\n                                        <asw-signature [control]=\"control\"\r\n                                                        [controlIndex]=\"i\"\r\n                                                        [isPreviewTemplate]=\"true\"\r\n                                                        (signatureUpdateEvent)=\"updatedControl($event)\"\r\n                                                        (signatureDeleteEvent)=\"deleteControl($event)\">\r\n                                        </asw-signature>\r\n                                    </ng-container>\r\n                                    <ng-container *ngSwitchCase=\"'drawing'\">\r\n                                        <asw-drawing [control]=\"control\"\r\n                                                        [controlIndex]=\"i\"\r\n                                                        [isPreviewTemplate]=\"true\"\r\n                                                        (drawingUpdateEvent)=\"updatedControl($event)\"\r\n                                                        (drawingDeleteEvent)=\"deleteControl($event)\">\r\n                                        </asw-drawing>\r\n                                    </ng-container>\r\n                                </ng-container>\r\n                            </div>\r\n                        </ng-container>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</div>", styles: [".asw-list{min-height:595px;border-radius:4px;display:block}.asw-box{padding:7px;border-bottom:solid 1px #ccc;color:#000000de;flex-direction:row;align-items:center;justify-content:space-between;box-sizing:border-box;cursor:move;background:white;font-size:14px}.cdk-drag-preview{box-sizing:border-box;border-radius:4px;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}.cdk-drag-placeholder{opacity:0}.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.asw-list.cdk-drop-list-dragging .asw-box:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}\n"] }]
        }], ctorParameters: function () { return [{ type: i1.MatDialog }]; }, propDecorators: { uploadData: [{
                type: Input
            }], isShowPreviewButton: [{
                type: Input
            }], isShowJsonDataButton: [{
                type: Input
            }], isShowPublishButton: [{
                type: Input
            }], previewClick: [{
                type: Output
            }], publishClick: [{
                type: Output
            }] } });

/**
 * @license
 * Copyright ASW (A Software World) All Rights Reserved.
 *
 * Use of this source code is governed by an MIT-style license that can be
 * found in the LICENSE file
 */
class AswFormBuilderModule {
}
AswFormBuilderModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.4", ngImport: i0, type: AswFormBuilderModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
AswFormBuilderModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.2.4", ngImport: i0, type: AswFormBuilderModule, declarations: [AswFormBuilder], imports: [CommonModule,
        FormsModule,
        HttpClientModule,
        ReactiveFormsModule,
        MatDialogModule,
        DragDropModule,
        ClipboardModule,
        MatIconModule,
        AswAutocompleteModule,
        AswButtonModule,
        AswCheckboxModule,
        AswDatepickerModule,
        AswDividerModule,
        AswDrawingModule,
        AswGpsModule,
        AswHeaderModule,
        AswImageModule,
        AswMultiSelectModule,
        AswParagraphModule,
        AswSelectModule,
        AswSignatureModule,
        AswSlideToggleModule,
        AswTextareaModule,
        AswTextboxModule,
        AswRadioButtonModule,
        AswJsonPreviewDialogModule], exports: [AswFormBuilder] });
AswFormBuilderModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.2.4", ngImport: i0, type: AswFormBuilderModule, imports: [[
            CommonModule,
            FormsModule,
            HttpClientModule,
            ReactiveFormsModule,
            MatDialogModule,
            DragDropModule,
            ClipboardModule,
            MatIconModule,
            AswAutocompleteModule,
            AswButtonModule,
            AswCheckboxModule,
            AswDatepickerModule,
            AswDividerModule,
            AswDrawingModule,
            AswGpsModule,
            AswHeaderModule,
            AswImageModule,
            AswMultiSelectModule,
            AswParagraphModule,
            AswSelectModule,
            AswSignatureModule,
            AswSlideToggleModule,
            AswTextareaModule,
            AswTextboxModule,
            AswRadioButtonModule,
            AswJsonPreviewDialogModule
        ]] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.4", ngImport: i0, type: AswFormBuilderModule, decorators: [{
            type: NgModule,
            args: [{
                    declarations: [
                        AswFormBuilder
                    ],
                    imports: [
                        CommonModule,
                        FormsModule,
                        HttpClientModule,
                        ReactiveFormsModule,
                        MatDialogModule,
                        DragDropModule,
                        ClipboardModule,
                        MatIconModule,
                        AswAutocompleteModule,
                        AswButtonModule,
                        AswCheckboxModule,
                        AswDatepickerModule,
                        AswDividerModule,
                        AswDrawingModule,
                        AswGpsModule,
                        AswHeaderModule,
                        AswImageModule,
                        AswMultiSelectModule,
                        AswParagraphModule,
                        AswSelectModule,
                        AswSignatureModule,
                        AswSlideToggleModule,
                        AswTextareaModule,
                        AswTextboxModule,
                        AswRadioButtonModule,
                        AswJsonPreviewDialogModule
                    ],
                    exports: [AswFormBuilder]
                }]
        }] });

/**
 * @license
 * Copyright ASW (A Software World) All Rights Reserved.
 *
 * Use of this source code is governed by an MIT-style license that can be
 * found in the LICENSE file
 */

/**
 * Generated bundle index. Do not edit.
 */

export { AswFormBuilder, AswFormBuilderModule };
//# sourceMappingURL=asoftwareworld-form-builder-form-builder.mjs.map
