import { __decorate } from "tslib";
import { Component, Input, Output, EventEmitter } from '@angular/core';
import { MatDialog } from '@angular/material/dialog';
import { LoggerService, EwCommonService } from 'ew-common-lib';
let RegisterFormPopupSidebarComponent = class RegisterFormPopupSidebarComponent {
    // public pageBuilderLayout: any = {
    //   components_data: {
    //     sections: [
    //       {
    //         section_rows: [
    //         ],
    //         meta_data: {},
    //         section_type: "full_width",
    //         sidebar_active: 'section_editor',
    //         is_full_width: false,
    //       }
    //     ],
    //   }
    // }
    /**
     * constructor
     */
    constructor(dialog, ewCommonService) {
        this.dialog = dialog;
        this.ewCommonService = ewCommonService;
        /**
         * DiaglogOpened or not
         */
        this.isDialogOpened = false;
        /**
         * Diaglog reference
         */
        this.dialogRef = '';
        /**
         * To manage register Form Sidebar within Popup sidebar
         */
        this.showRegisterFormSidebar = false;
        /**
         * To manage ExpansionPanel
         */
        this.currentSidebarExpansionPanel = "button";
        /**
         * Output to trigger sidebar panel
         */
        this.onChangeSidebarOptions = new EventEmitter();
        /**
         * Output
         * @param Event
         */
        this.onSidebarBackClick = new EventEmitter();
        this.callParentContainer = new EventEmitter();
        this.changeDetected = false;
    }
    /**
     * NgOnint hook
     */
    ngOnInit() {
        if (this.model == undefined) {
            this.model = {
                type: "popup",
                sidebar_active: "popup_editor",
                focused: true,
                meta_data: {},
                popup_sub_meta_data: {},
                pageBuilderLayout: {
                    components_data: {
                        sections: [
                            {
                                section_rows: [],
                                meta_data: {},
                                section_type: "full_width",
                                sidebar_active: 'section_editor',
                                is_full_width: false,
                            }
                        ],
                    }
                }
            };
            // this.model.pageBuilderLayout={
            //   components_data: {
            //     sections: [
            //       {
            //         section_rows: [
            //         ],
            //         meta_data: {},
            //         section_type: "full_width",
            //         sidebar_active: 'section_editor',
            //         is_full_width: false,
            //       }
            //     ],
            //   }
            // }
        }
        this.model.meta_data.popup_sidebar_active_option = "popup_sidebar_editor";
        if ((this.model.meta_data.reg_popup_width === undefined)) {
            this.model.meta_data.reg_popup_width = "720";
            this.model.meta_data.reg_popup_margin_top = "40";
            this.model.meta_data.reg_popup_content_bg_color = "rgb(255,255,255)";
            this.model.meta_data.reg_popup_content_border_color = "rgb(0,0,0)";
            this.model.meta_data.reg_popup_backdrop_color = "rgb(127,127,127)";
            this.model.meta_data.reg_popup_content_radius = "10";
            this.model.meta_data.reg_popup_content_padding_top = "0";
            this.model.meta_data.reg_popup_content_padding_bottom = "0";
            this.model.meta_data.reg_popup_content_padding_right = "0";
            this.model.meta_data.reg_popup_content_padding_left = "0";
            this.model.meta_data.reg_popup_content_border_size = "4";
            this.model.meta_data.reg_popup_content_border_style = "solid";
            this.model.meta_data.reg_form_popup_content_bg_color = "rgb(255,255,255)";
            this.model.meta_data.reg_popup_content_border_directions = "ew_full_border";
        }
    }
    ngDoCheck() {
        this.showRegisterFormPopSettingPanel = localStorage.getItem('showRegisterFormPopSettingPanel');
        if (this.showRegisterFormPopSettingPanel !== null) {
            if (this.showRegisterFormPopSettingPanel !== this.oldShowRegisterFormPopSettingPanel) {
                this.changeDetected = true;
                this.oldShowRegisterFormPopSettingPanel = this.showRegisterFormPopSettingPanel;
            }
            if (this.changeDetected) {
                this.togglePopupPreview();
            }
            this.changeDetected = false;
        }
    }
    ngOnDestroy() {
        this.closePopupPreview();
        //this.dialogRef.close();
    }
    /**
     * CloseDialog
     */
    closeDailog() {
        // this.dialogRef.close(true);
        this.model.meta_data.form_style_toggle = false;
        localStorage.setItem('showRegisterFormPopSettingPanel', "no");
    }
    /**
     * @description
     * To Open Settings menus from PopupSidebar
     */
    closePopupSidebarEditor() {
        this.closePopupPreview();
        this.model.focused = false;
        this.onChangeSidebarOptions.emit('settings_menu');
    }
    /**
     * @description
     * To Open Settings menus from Popup Form Style only Sidebar
     */
    // closePopupFormStyleSidebarEditor(): void {
    //   //this.closePopupPreview();
    //   this.currentSidebarExpansionPanel="popup";
    //   this.model.meta_data.popup_sidebar_active_option="register_form_editor";
    // }
    /**
     * @description
     * toggle Popup preview
     */
    togglePopupPreview() {
        //if(this.isDialogOpened) return;
        /*
            //Dont open Popup If Poup-sidebar not opened
            if(this.model?.meta_data.popup_sidebar_active_option != 'popup_sidebar_editor'){
              this.sidebarBack();
              //return ;
            }
        
            this.dialogRef = this.dialog.open(PopoverSettingComponent, {
              maxWidth: '520px',
              width: '100%',
              panelClass:'popoversetting',
              data: {
                model:this.model,
                pageBuilderLayout:this.model.pageBuilderLayout,
              }
            });
            this.ewCommonService.addPopupCustomClass("popover-settng-form");
            this.ewCommonService.addPopupCustomClass("ew-remove-extra-element-on-popup-register-page");
        */
        //this.isDialogOpened=true;
        /*
        // Save the Popup html for template
        this.dialogRef.beforeClosed().subscribe((result) => {
    
          let popUpContainer = document.getElementsByClassName(
            'popover-settng-form'
          );
          
          // Save the HTML of Popup for S3
          this.parentFrom.value.popup_html_data= popUpContainer[0].innerHTML;
          var popupCustomWrapper=document.getElementById('ew-preview-popup-custom-wrapper');
          popupCustomWrapper.innerHTML = popUpContainer[0].innerHTML;
          
          
        });
    
        this.dialogRef.afterClosed().subscribe((result) => {
          this.onSidebarBackClick.emit();
          //this.isDialogOpened=false;
          this.ewCommonService.removePopupCustomClass("popover-settng-form");
          this.ewCommonService.removePopupCustomClass("ew-remove-extra-element-on-popup-register-page");
          
        });
        */
    }
    /**
     * @description
     * toggle Popup preview
     */
    closePopupPreview() {
        if (this.dialogRef) {
            //this.dialogRef.close();
        }
    }
    /**
     * @description
     * close the sidebar for Popup
     */
    sidebarBack(type) {
        this.model.pageBuilderLayout.components_data.sections.map((item) => {
            item.focused = false;
            item.section_rows.map((item1) => {
                item1.focused = false;
                item1.rows.map((item2) => {
                    item2.focused = false;
                    item2.columns.map((item3) => {
                        if (item3.focused) {
                            item3.focused = false;
                        }
                        if (item3.type == "presenter") {
                            item3.meta_data.presenter_elements.map((item4) => {
                                if (item4.focused)
                                    item4.focused = false;
                            });
                            item3.meta_data.presenter_elements_left.map((item4) => {
                                if (item4.focused)
                                    item4.focused = false;
                            });
                        }
                    });
                });
            });
        });
        this.model.meta_data.popup_sidebar_active_option = "popup_sidebar_editor";
    }
    callElementContainer(data) {
        //this.callParentContainer.emit(data);
    }
};
RegisterFormPopupSidebarComponent.ctorParameters = () => [
    { type: MatDialog },
    { type: EwCommonService }
];
__decorate([
    Output()
], RegisterFormPopupSidebarComponent.prototype, "onChangeSidebarOptions", void 0);
__decorate([
    Input()
], RegisterFormPopupSidebarComponent.prototype, "model", void 0);
__decorate([
    Input()
], RegisterFormPopupSidebarComponent.prototype, "parentFrom", void 0);
__decorate([
    Input()
], RegisterFormPopupSidebarComponent.prototype, "parentFromObject", void 0);
__decorate([
    Input()
], RegisterFormPopupSidebarComponent.prototype, "controlName", void 0);
__decorate([
    Output()
], RegisterFormPopupSidebarComponent.prototype, "onSidebarBackClick", void 0);
__decorate([
    Output()
], RegisterFormPopupSidebarComponent.prototype, "callParentContainer", void 0);
__decorate([
    Input()
], RegisterFormPopupSidebarComponent.prototype, "popupData", void 0);
RegisterFormPopupSidebarComponent = __decorate([
    Component({
        selector: 'ew-element-register-form-popup-sidebar',
        template: "<!-- *ngIf=\"(model?.meta_data.popup_sidebar_active_option == 'popup_sidebar_editor')\"\r\n[style.display]=\"(model?.meta_data.popup_sidebar_active_option == 'popup_sidebar_editor') ? 'block' : 'none'\" -->\r\n\r\n\r\n\r\n\r\n<div class=\"elemets-ew-sidebar\"\r\n    style=\"height: 100%;\"\r\n    [style.display]=\"(model?.meta_data.popup_sidebar_active_option == 'popup_sidebar_editor') ? 'block' : 'none'\"\r\n    >\r\n    <div class=\"mat-widget-header tab-toggle-ew\">\r\n        <span class=\"title-content-ew\">{{ 'DESIGN.POPUP' | translate }}</span>\r\n\r\n        <span class=\"btn-editor-save ew-sidebar-close-btn\" (click)=\"closeDailog()\">\r\n            <button class=\"small-button-ew green base\" mat-flat-button color=\"accent\">{{ 'DESIGN.DONE' | translate }}</button>\r\n        </span>\r\n    </div>\r\n    <div class=\"elements-outer-sec-scroll   mat-toggle-multiple\">\r\n        <mat-button-toggle-group name=\"fontStyle\"  #tabOptions=\"matButtonToggleGroup\" aria-label=\"Font Style\">\r\n            <mat-button-toggle value=\"setting\" checked>{{ 'BUILDER.ELEMENTS.TABS.SETTINGS' | translate }}</mat-button-toggle>\r\n            <mat-button-toggle value=\"advanced\">{{ 'BUILDER.ELEMENTS.TABS.ADVANCED' | translate }}</mat-button-toggle>\r\n        </mat-button-toggle-group>\r\n\r\n        <div class=\" setting-tab\" *ngIf=\"tabOptions.value == 'setting'\">\r\n            <!--<ew-element-show-hide [model]=\"model\" (callSideBar)=\"callElementContainer($event)\" ></ew-element-show-hide>-->\r\n\t\t\t<div class=\"advance-title-sec-box\"><span class=\"title-advance-box\">{{ 'BUILDER.ELEMENTS.MARGIN_LABEL' | translate}}</span></div>\r\n            <div class=\"builder-elements-outer\">\r\n                <div class=\"element-builder-row\">\r\n                    <span class=\"builder-elements-name\">{{ 'BUILDER.ELEMENTS.TOP_MARGIN' | translate }}</span>\r\n                    <div class=\"mat-slider-outer-part common-builder-right\">\r\n                        <span class=\"mat-slider-inner\">\r\n                            <mat-slider [(ngModel)]=\"model?.meta_data.reg_popup_margin_top\"  (input)=\"(model?.meta_data.reg_popup_margin_top=$event.value)\"  min=\"0\" max=\"100\" step=\"1\"></mat-slider>\r\n                        </span>\r\n                        \r\n                        <span class=\"value-count-slider\">{{model?.meta_data.reg_popup_margin_top}} PX</span>\r\n                    </div>\r\n                </div>\r\n                <div class=\"element-builder-row  padding-elements-30-top\">\r\n                    <span class=\"builder-elements-name\">{{ 'BUILDER.ELEMENTS.WIDTH' | translate }}</span>\r\n                    <div class=\"mat-slider-outer-part common-builder-right \">\r\n                        <span class=\"mat-slider-inner\">\r\n                            <mat-slider [(ngModel)]=\"model?.meta_data.reg_popup_width\"  (input)=\"(model?.meta_data.reg_popup_width=$event.value)\"  min=\"300\" max=\"1500\" step=\"1\"></mat-slider>\r\n                        </span>\r\n                        \r\n                        <span class=\"value-count-slider\">{{model?.meta_data.reg_popup_width}} PX</span>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n            <div class=\"advance-title-sec-box\"><span class=\"title-advance-box\">{{ 'BUILDER.ELEMENTS.BG_IMAGE' | translate }}</span></div>\r\n            <div class=\"builder-elements-outer\">\r\n                <div class=\"element-builder-row\">\r\n                    <span class=\"builder-elements-name\">{{ 'BUILDER.ELEMENTS.BG_IMAGE' | translate }}</span>\r\n                    \r\n                    <ew-control-manage-image\r\n                        [parentFrom]=\"parentFrom\"\r\n                        [deaultImg]=\"''\"\r\n                        [editImage]=\"popupData\"\r\n                    >\r\n                    </ew-control-manage-image>\r\n                    \r\n                </div>\r\n            </div>\r\n            <div class=\"advance-title-sec-box\"><span class=\"title-advance-box\">{{ 'BUILDER.ELEMENTS.COLORS' | translate }}</span></div>\r\n            <div class=\"builder-elements-outer\">\r\n                <div class=\"element-builder-row\">\r\n                    <span class=\"builder-elements-name\">{{ 'BUILDER.ELEMENTS.BACKDROP' | translate }}</span>\r\n                    <div class=\"common-builder-right\">\r\n                        <mat-form-field class=\"mat-form-field color-picker-mat embeded-color-widget-picker\" floatLabel=\"never\">\r\n                            \r\n                            <input matInput type=\"text\"\r\n                                [cpPosition]=\"'top'\"\r\n                                [cpOutputFormat]=\"'rgba'\" \r\n                                [cpAlphaChannel]=\"'disabled'\" \r\n                                [colorPicker]=\"model?.meta_data.reg_popup_backdrop_color\"                                          \r\n                                (colorPickerChange)=\"model.meta_data.reg_popup_backdrop_color=$event\"\r\n                                [(ngModel)]=\"model?.meta_data.reg_popup_backdrop_color\"\r\n                            />\r\n                            <span class=\"color-picker-box\" [style.background-color]=\"model?.meta_data.reg_popup_backdrop_color\"></span>\r\n                        </mat-form-field>\r\n    \r\n                    </div>\r\n                </div>\r\n                <div class=\"element-builder-row padding-elements-30-top\">\r\n                    <span class=\"builder-elements-name\">{{ 'BUILDER.ELEMENTS.BG_COLOR' | translate }}</span>\r\n                    <div class=\"common-builder-right\">\r\n                        <mat-form-field class=\"mat-form-field color-picker-mat embeded-color-widget-picker\" floatLabel=\"never\">\r\n                            <input matInput type=\"text\"\r\n                                [cpPosition]=\"'top'\"\r\n                                [cpOutputFormat]=\"'rgba'\" \r\n                                [cpAlphaChannel]=\"'disabled'\" \r\n                                [colorPicker]=\"model?.meta_data.reg_popup_content_bg_color\"                                          \r\n                                (colorPickerChange)=\"model.meta_data.reg_popup_content_bg_color=$event\"\r\n                                [(ngModel)]=\"model?.meta_data.reg_popup_content_bg_color\"\r\n                            />\r\n                            <span class=\"color-picker-box\" [style.background-color]=\"model?.meta_data.reg_popup_content_bg_color\"></span>\r\n                        </mat-form-field>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n            <div class=\"advance-title-sec-box\"><span class=\"title-advance-box\">{{ 'BUILDER.ELEMENTS.PADDINGS' | translate }}</span></div>\r\n            <div class=\"builder-elements-outer\">\r\n                <div class=\"element-builder-row\">\r\n                    <span class=\"builder-elements-name\">{{ 'BUILDER.ELEMENTS.PADDING.TOP' | translate }}</span>\r\n                    <div class=\"mat-slider-outer-part common-builder-right\">\r\n                        <span class=\"mat-slider-inner\">\r\n                            <mat-slider [value]=\"model?.meta_data.reg_popup_content_padding_top\" (input)=\"model?.meta_data.reg_popup_content_padding_top = $event.value\" min=\"0\" max=\"100\" step=\"1\">\r\n                            </mat-slider>\r\n                        </span>\r\n                        <span class=\"value-count-slider\">\r\n                            {{ model?.meta_data.reg_popup_content_padding_top }} px\r\n                        </span>\r\n                    </div>\r\n                </div>\r\n    \r\n                <div class=\"element-builder-row padding-elements-30-top\">\r\n                    <span class=\"builder-elements-name\">{{ 'BUILDER.ELEMENTS.PADDING.RIGHT' | translate }}</span>\r\n                    <div class=\"mat-slider-outer-part common-builder-right \">\r\n                        <span class=\"mat-slider-inner\">\r\n                            <mat-slider [value]=\"model?.meta_data.reg_popup_content_padding_right\" (input)=\"model?.meta_data.reg_popup_content_padding_right = $event.value\" min=\"0\" max=\"100\" step=\"1\">\r\n                            </mat-slider>\r\n                        </span>\r\n                        <span class=\"value-count-slider\">\r\n                            {{ model?.meta_data.reg_popup_content_padding_right }} px\r\n                        </span>\r\n                    </div>\r\n                </div>\r\n    \r\n                <div class=\"element-builder-row padding-elements-30-top\">\r\n                    <span class=\"builder-elements-name\">{{ 'BUILDER.ELEMENTS.PADDING.BOTTOM' | translate }}</span>\r\n                    <div class=\"mat-slider-outer-part common-builder-right \">\r\n                        <span class=\"mat-slider-inner\">\r\n                            <mat-slider [value]=\"model?.meta_data.reg_popup_content_padding_bottom\" (input)=\"model?.meta_data.reg_popup_content_padding_bottom = $event.value\" min=\"0\" max=\"100\" step=\"1\">\r\n                            </mat-slider>\r\n                        </span>\r\n                        <span class=\"value-count-slider\">\r\n                            {{ model?.meta_data.reg_popup_content_padding_bottom }} px\r\n                        </span>\r\n                    </div>\r\n                </div>\r\n    \r\n                <div class=\"element-builder-row padding-elements-30-top\">\r\n                    <span class=\"builder-elements-name\">{{ 'BUILDER.ELEMENTS.PADDING.LEFT' | translate }}</span>\r\n                    <div class=\"mat-slider-outer-part common-builder-right\">\r\n                        <span class=\"mat-slider-inner\">\r\n                            <mat-slider [value]=\"model?.meta_data.reg_popup_content_padding_left\" (input)=\"model?.meta_data.reg_popup_content_padding_left = $event.value\" min=\"0\" max=\"100\" step=\"1\">\r\n                            </mat-slider>\r\n                        </span>\r\n                        <span class=\"value-count-slider\">\r\n                            {{ model?.meta_data.reg_popup_content_padding_left }} px\r\n                        </span>\r\n                    </div>\r\n                </div>\r\n\r\n                <!-- <div class=\"element-builder-row padding-elements-builder-sidebar\">\r\n                    <div class=\"row\">\r\n                        <div class=\"col m3 s3\">\r\n                            <div class=\"bottom-custom-design-fields\">\r\n                                <label class=\"label-padding-sec\">{{ 'BUILDER.ELEMENTS.PADDING.TOP' | translate }}</label>\r\n                                <mat-form-field class=\"ew-field-no-label\" floatLabel=\"never\">\r\n                                    <input matInput [(ngModel)]=\"model?.meta_data.reg_popup_content_padding_top\" type=\"number\">\r\n                                </mat-form-field>\r\n                            </div>\r\n                        </div>\r\n                        <div class=\"col m3 s3\">\r\n                            <div class=\"bottom-custom-design-fields\">\r\n                                <label class=\"label-padding-sec\">{{ 'BUILDER.ELEMENTS.PADDING.RIGHT' | translate }}</label>\r\n                                <mat-form-field class=\"ew-field-no-label\" floatLabel=\"never\">\r\n                                    <input matInput [(ngModel)]=\"model?.meta_data.reg_popup_content_padding_right\" type=\"number\">\r\n                                </mat-form-field>\r\n                            </div>\r\n                        </div>\r\n                        <div class=\"col m3 s3\">\r\n                            <div class=\"bottom-custom-design-fields\">\r\n                                <label class=\"label-padding-sec\">{{ 'BUILDER.ELEMENTS.PADDING.BOTTOM' | translate }}</label>\r\n                                <mat-form-field class=\"ew-field-no-label\" floatLabel=\"never\">\r\n                                    <input matInput [(ngModel)]=\"model?.meta_data.reg_popup_content_padding_bottom\" type=\"number\">\r\n                                </mat-form-field>\r\n                            </div>\r\n                        </div>\r\n                        <div class=\"col m3 s3\">\r\n                            <div class=\"bottom-custom-design-fields\">\r\n                                <label class=\"label-padding-sec\">{{ 'BUILDER.ELEMENTS.PADDING.LEFT' | translate }}</label>\r\n                                <mat-form-field class=\"ew-field-no-label\" floatLabel=\"never\">\r\n                                    <input matInput [(ngModel)]=\"model?.meta_data.reg_popup_content_padding_left\" type=\"number\">\r\n                                </mat-form-field>\r\n                            </div>\r\n                        </div>\r\n                    </div>\r\n                </div> -->\r\n            </div>\r\n        </div>\r\n\r\n        \r\n        <div class=\"advanced-tab\" *ngIf=\"tabOptions.value == 'advanced'\">\r\n            <div class=\"builder-elements-outer\">\r\n                <div class=\"element-builder-row\">\r\n                    <span class=\"builder-elements-name\">{{ 'BUILDER.ELEMENTS.BORDER_RADIUS' | translate }}</span>\r\n                    <div class=\"mat-slider-outer-part common-builder-right\">\r\n                        <span class=\"mat-slider-inner\">\r\n                            <mat-slider [(ngModel)]=\"model?.meta_data.reg_popup_content_radius\"  (input)=\"(model?.meta_data.reg_popup_content_radius=$event.value)\"  min=\"0\" max=\"60\" step=\"1\"></mat-slider>\r\n                        </span>\r\n                        \r\n                        <span class=\"value-count-slider\">{{model?.meta_data.reg_popup_content_radius}} PX</span>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n            <div class=\"advance-title-sec-box\"><span class=\"title-advance-box\">{{ 'BUILDER.ELEMENTS.BORDER' | translate }}</span></div>\r\n            <div class=\"builder-elements-outer\">\r\n                <div class=\"element-builder-row\">\r\n                    <span class=\"builder-elements-name\">{{ 'BUILDER.ELEMENTS.BORDER' | translate }}</span>\r\n                    <div class=\"common-builder-right\">\r\n                        <mat-form-field floatLabel=\"never\" class=\"ew-field-without-lebel\">\r\n                            <mat-select [(value)]=\"model?.meta_data.reg_popup_content_border_directions\">\r\n                                <mat-option value=\"ew_border_top_bottom\">Top & Bottom</mat-option>\r\n                                <mat-option value=\"ew_border_top\">Top Only</mat-option>\r\n                                <mat-option value=\"ew_border_bottom\">Bottom Only</mat-option>\r\n                                <mat-option value=\"ew_full_border\">Full Border</mat-option>\r\n                                <mat-option value=\"ew_no_border\">No Border</mat-option>\r\n                                \r\n                            </mat-select>\r\n                        </mat-form-field>\r\n                    </div>\r\n                </div>\r\n                <div class=\"element-builder-row padding-elements-30-top\"\r\n                    *ngIf=\"model?.meta_data.reg_popup_content_border_directions != 'ew_no_border'\"\r\n                >\r\n                    <span class=\"builder-elements-name\">{{ 'BUILDER.ELEMENTS.STYLE' | translate }}</span>\r\n                    <div class=\"common-builder-right\">\r\n                        <mat-form-field floatLabel=\"never\" class=\"ew-field-without-lebel\">\r\n                            <mat-select [(value)]=\"model?.meta_data.reg_popup_content_border_style\">\r\n                                <mat-option value=\"solid\">Solid</mat-option>\r\n                                <mat-option value=\"dashed\">Dashed</mat-option>\r\n                                <mat-option value=\"dotted\">Dotted</mat-option>\r\n                                <mat-option value=\"double\">Double</mat-option>\r\n                                <mat-option value=\"groove\">Groove</mat-option>\r\n                            </mat-select>\r\n                        </mat-form-field>\r\n                    </div>\r\n                </div>\r\n                <div class=\"element-builder-row padding-elements-30-top\"\r\n                    *ngIf=\"model?.meta_data.reg_popup_content_border_directions != 'ew_no_border'\"\r\n                >\r\n                    <span class=\"builder-elements-name\">{{ 'BUILDER.ELEMENTS.SIZE' | translate }}</span>\r\n                    <div class=\"mat-slider-outer-part common-builder-right\">\r\n                        <span class=\"mat-slider-inner\">\r\n                            <mat-slider [(ngModel)]=\"model?.meta_data.reg_popup_content_border_size\"  (input)=\"(model?.meta_data.reg_popup_content_border_size=$event.value)\"  min=\"1\" max=\"100\" step=\"1\"></mat-slider>\r\n                        </span>\r\n                        \r\n                        <span class=\"value-count-slider\">{{model?.meta_data.reg_popup_content_border_size}} PX</span>\r\n                    </div>\r\n                </div>\r\n                <div class=\"element-builder-row  padding-elements-30-top\"\r\n                    *ngIf=\"model?.meta_data.reg_popup_content_border_directions != 'ew_no_border'\"\r\n                >\r\n                    <span class=\"builder-elements-name\">{{ 'BUILDER.ELEMENTS.BORDER_COLOR' | translate }}</span>\r\n                    <div class=\"common-builder-right\">\r\n                        <mat-form-field class=\"mat-form-field color-picker-mat embeded-color-widget-picker\" floatLabel=\"never\">\r\n                            <input matInput type=\"text\"\r\n                                [cpPosition]=\"'top'\"\r\n                                [cpOutputFormat]=\"'rgba'\" \r\n                                [cpAlphaChannel]=\"'disabled'\" \r\n                                [colorPicker]=\"model?.meta_data.reg_popup_content_border_color\"                                          \r\n                                (colorPickerChange)=\"model.meta_data.reg_popup_content_border_color=$event\"\r\n                                [(ngModel)]=\"model?.meta_data.reg_popup_content_border_color\"\r\n                            />\r\n                            <span class=\"color-picker-box\" [style.background-color]=\"model?.meta_data.reg_popup_content_border_color\"></span>\r\n                        </mat-form-field>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</div>\r\n\r\n\r\n\r\n\r\n\r\n\r\n<div class=\"elemets-ew-sidebar\" \r\n    style=\"height: 100%;\"\r\n    *ngIf=\"(model?.meta_data.popup_sidebar_active_option =='reg_form_style_editor')\" \r\n>    \r\n    <ew-element-register-form-sidebar \r\n        [model]=\"model?.popup_sub_meta_data\"\r\n        [parentFromObject]=\"parentFromObject\"\r\n        [showBackFor]=\"'popup'\"\r\n        (onSidebarBackClick)=\"sidebarBack('popup')\"\r\n        (callParentContainer)=\"callElementContainer($event)\"\r\n    ></ew-element-register-form-sidebar>\r\n</div>\r\n\r\n<div class=\"elemets-ew-sidebar\"\r\n    style=\"height: 100%;\"\r\n    *ngIf=\"(model?.meta_data.popup_sidebar_active_option == 'heading_1_editor' || model?.meta_data.popup_sidebar_active_option == 'heading_2_editor' || model?.meta_data.popup_sidebar_active_option == 'paragraph_editor')\" >\r\n    \r\n    <ew-heading-sidebar\r\n        [model]=\"model?.popup_sub_meta_data\"\r\n        [showBackFor]=\"'popup'\"\r\n        (onSidebarBackClick)=\"sidebarBack('popup')\"\r\n        (callParentContainer)=\"callElementContainer($event)\"\r\n    ></ew-heading-sidebar>\r\n</div>\r\n\r\n<div class=\"elemets-ew-sidebar\"\r\n    style=\"height: 100%;\"\r\n    *ngIf=\"(model?.meta_data.popup_sidebar_active_option =='image_editor')\"\r\n>\r\n    <ew-element-image-sidebar\r\n        [model]=\"model?.popup_sub_meta_data\"\r\n        [showBackFor]=\"'popup'\"\r\n        (onSidebarBackClick)=\"sidebarBack('popup')\"\r\n        (callParentContainer)=\"callElementContainer($event)\"\r\n    ></ew-element-image-sidebar>\r\n</div>\r\n\r\n<!-- *ngIf=\"(model?.meta_data.popup_sidebar_active_option == 'event_schedule_editor')\" -->\r\n\r\n<ew-element-event-schedule-sidebar\r\n    style=\"height: 100%;\"\r\n    *ngIf=\"(model?.meta_data.popup_sidebar_active_option == 'event_schedule_editor')\"\r\n    [model]=\"model?.popup_sub_meta_data\"\r\n    [showBackFor]=\"'popup'\"\r\n    (onSidebarBackClick)=\"sidebarBack('popup')\"\r\n    (callParentContainer)=\"callElementContainer($event)\"\r\n\r\n></ew-element-event-schedule-sidebar>\r\n\r\n<div class=\"elemets-ew-sidebar\"    style=\"height: 100%;\"\r\n    *ngIf=\"model?.meta_data.popup_sidebar_active_option == 'rows_editor'\"\r\n>\r\n    <ew-rows-sidebar        \r\n        [model]=\"model?.popup_sub_meta_data\"\r\n        [showBackFor]=\"'popup'\"\r\n        (onSidebarBackClick)=\"sidebarBack('popup')\"\r\n    ></ew-rows-sidebar>\r\n</div>\r\n\r\n\r\n<div class=\"elemets-ew-sidebar\"\r\n    *ngIf=\"(model?.meta_data.popup_sidebar_active_option == 'presenter_editor') \"\r\n    style=\"height: 100%;\"\r\n>\r\n    <ew-element-presenter-sidebar\r\n        [model]=\"model?.popup_sub_meta_data\"\r\n        [showBackFor]=\"'popup'\"\r\n        (onSidebarBackClick)=\"sidebarBack('popup')\"\r\n        (callParentContainer)=\"callElementContainer($event)\"\r\n    ></ew-element-presenter-sidebar>\r\n</div>\r\n<div class=\"elemets-ew-sidebar\"\r\n*ngIf=\"(model?.meta_data.popup_sidebar_active_option =='seprator_editor')\"\r\n    style=\"height: 100%;\">\r\n    <ew-element-line-sidebar\r\n        \r\n        [model]=\"model?.popup_sub_meta_data\"\r\n        [showBackFor]=\"'popup'\"\r\n        (onSidebarBackClick)=\"sidebarBack('popup')\"\r\n        (callParentContainer)=\"callElementContainer($event)\"\r\n    ></ew-element-line-sidebar>\r\n</div>\r\n\r\n<ew-element-video-sidebar\r\n    *ngIf=\"(model?.meta_data.popup_sidebar_active_option == 'video_editor')\"\r\n    [model]=\"model?.popup_sub_meta_data\"\r\n    [showBackFor]=\"'popup'\"\r\n    (onSidebarBackClick)=\"sidebarBack('popup')\"\r\n    (callParentContainer)=\"callElementContainer($event)\"\r\n    style=\"height: 100%;\"\r\n\r\n></ew-element-video-sidebar>\r\n\r\n\r\n<div class=\"elemets-ew-sidebar\"\r\n    *ngIf=\"model?.meta_data.popup_sidebar_active_option == 'column_editor'\"\r\n    style=\"height: 100%;\"\r\n>\r\n    <ew-rows-sidebar\r\n        [model]=\"model?.popup_sub_meta_data\"\r\n        [showBackFor]=\"'popup'\"\r\n        (onSidebarBackClick)=\"sidebarBack('popup')\"\r\n    ></ew-rows-sidebar>\r\n</div>\r\n\r\n<div class=\"elemets-ew-sidebar\"\r\n    style=\"height: 100%;\"\r\n>\r\n    <ew-list-sidebar\r\n        *ngIf=\"(model?.meta_data.popup_sidebar_active_option =='list_editor')\"\r\n        [model]=\"model?.popup_sub_meta_data\"\r\n        [showBackFor]=\"'popup'\"\r\n        (onSidebarBackClick)=\"sidebarBack('popup')\"\r\n        (callParentContainer)=\"callElementContainer($event)\"\r\n    ></ew-list-sidebar>\r\n</div>\r\n\r\n\r\n\r\n\r\n",
        styles: [""]
    })
], RegisterFormPopupSidebarComponent);
export { RegisterFormPopupSidebarComponent };
//# sourceMappingURL=data:application/json;base64, 