import { __decorate } from "tslib";
import { Component, Input, Output, EventEmitter } from "@angular/core";
var PresenterSidebarComponent = /** @class */ (function () {
    function PresenterSidebarComponent() {
        // public presenterConfigForm: FormGroup;
        // public addNewPresenter: boolean = false;
        // public editData: any;
        this.currentPreviewLayout = "desktop";
        // @Input() 
        // public set data_model(v : any) {
        //     if(v){
        //       this.model = v;
        //     this.presenterConfigForm.get('styles').patchValue(this.model.meta_data);
        //   }
        // }
        /**
         * @description
         * Emit event to Done Click.
         */
        this.onDoneClick = new EventEmitter();
        this.showBackFor = '';
        this.onSidebarBackClick = new EventEmitter();
        this.callParentContainer = new EventEmitter();
        this.topMarginWebMobileBind = true;
    }
    PresenterSidebarComponent.prototype.ngOnInit = function () {
        // this.createConfigControls();
    };
    /**
   * ngDoCheck Hook
   */
    PresenterSidebarComponent.prototype.ngDoCheck = function () {
        this.currentPreviewLayout = localStorage.getItem('currentPreviewLayout');
    };
    /**
     * @description
     * Setup the Presenter element config controls.
     */
    // createConfigControls() {
    //   this.presenterConfigForm = this.formBuilder.group({
    //     styles: this.formBuilder.group({})
    //   });
    //   this.presenterConfigForm.valueChanges.subscribe(
    //     formData => {
    //       if (this.model) {
    //         Object.assign(this.model.meta_data, this.presenterConfigForm.value.styles);
    //       }
    //       // console.log('Presenter!!!...-->',formData)
    //     }
    //   );
    //   // this.presenterConfigForm.get('styles').patchValue(this.model.meta_data);
    // }
    // editPresenter(presenter:any): void {
    //   this.addNewPresenter = true;
    //   this.editData = presenter;
    // }
    /**
     * @description
     * Delete Presenter
     */
    // deletePresenter(index:number): void {
    //   this.model.meta_data.presenters.splice(index, 1);
    // }
    PresenterSidebarComponent.prototype.closeConfig = function () {
        this.onDoneClick.emit();
    };
    /**
     * @description
     * Back sidebar for Popup options only
     */
    PresenterSidebarComponent.prototype.sidebarBack = function (type) {
        this.onSidebarBackClick.emit();
    };
    /*
    * OnChange of Color Picker
    */
    PresenterSidebarComponent.prototype.changeColorPicker = function (event) {
        this.model.meta_data.bg_color = event;
    };
    /**
     * OnChange of Layout
     */
    PresenterSidebarComponent.prototype.changeLayout = function (align) {
        if (align == 'center') {
            this.model.meta_data.presenter_elements.forEach(function (value) {
                if (value.type == 'paragraph') {
                    value.meta_data.txt_align = 'center';
                }
            });
            this.model.meta_data.layout = 'center';
        }
        else {
            this.model.meta_data.presenter_elements.forEach(function (value) {
                if (value.type == 'paragraph') {
                    value.meta_data.txt_align = 'left';
                }
            });
            this.model.meta_data.layout = 'right';
        }
    };
    /*
    * Checking the value is undefined or not
    */
    PresenterSidebarComponent.prototype.isUndefined = function (val) { return typeof val === 'undefined'; };
    PresenterSidebarComponent.prototype.callElementContainer = function (data) {
        //this.callParentContainer.emit(data);
    };
    __decorate([
        Input()
    ], PresenterSidebarComponent.prototype, "model", void 0);
    __decorate([
        Output()
    ], PresenterSidebarComponent.prototype, "onDoneClick", void 0);
    __decorate([
        Input()
    ], PresenterSidebarComponent.prototype, "showBackFor", void 0);
    __decorate([
        Output()
    ], PresenterSidebarComponent.prototype, "onSidebarBackClick", void 0);
    __decorate([
        Output()
    ], PresenterSidebarComponent.prototype, "callParentContainer", void 0);
    PresenterSidebarComponent = __decorate([
        Component({
            selector: 'ew-element-presenter-sidebar',
            template: "<div class=\"elemets-ew-sidebar\">\r\n\t<div class=\"mat-widget-header tab-toggle-ew\">\r\n\t\t<mat-icon *ngIf=\"showBackFor == 'popup'\" (click)=\"sidebarBack('popup')\">arrow_back</mat-icon>\r\n\t\t<span class=\"title-content-ew\">{{ 'BUILDER.ELEMENTS.PRESENTER' | translate }}</span>\r\n\t\t\r\n\t\t<span class=\"btn-editor-save ew-sidebar-close-btn\" *ngIf=\"showBackFor !== 'popup'\" (click)=\"sidebarBack('builderPage')\">\r\n            <button class=\"small-button-ew green base\" mat-flat-button color=\"accent\">{{ 'DESIGN.DONE' | translate }}</button>\r\n        </span>\r\n\t</div>\r\n\t<div class=\"elements-outer-sec-scroll mat-toggle-multiple\">\r\n\t\t<mat-button-toggle-group name=\"fontStyle\" aria-label=\"Font Style\" #tabOptions=\"matButtonToggleGroup\">\r\n\t\t\t<mat-button-toggle value=\"setting\" checked>\r\n\t\t\t\t{{ 'BUILDER.ELEMENTS.TABS.SETTINGS' | translate }}\r\n\t\t\t</mat-button-toggle>\r\n\t\t\t<mat-button-toggle value=\"advanced\">{{ 'BUILDER.ELEMENTS.TABS.ADVANCED' | translate }}</mat-button-toggle>\r\n\t\t</mat-button-toggle-group>\r\n\r\n\t\t<div *ngIf=\"tabOptions.value == 'setting'\">\r\n\t\t\t<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\t\t\t<div class=\"builder-elements-outer\">\r\n\t\t\t\t<div class=\"element-builder-row\" *ngIf=\"(this.currentPreviewLayout=='desktop')\">\r\n\t\t\t\t\t<span class=\"builder-elements-name\">{{ 'BUILDER.ELEMENTS.TOP_MARGIN' | translate }}</span>\r\n\r\n\t\t\t\t\t<div class=\"mat-slider-outer-part common-builder-right\">\r\n\t\t\t\t\t\t<span class=\"mat-slider-inner\">\r\n\t\t\t\t\t\t\t<mat-slider [value]=\"model?.meta_data.margin_top\" (input)=\"model.meta_data.margin_top = $event.value; \"\r\n\t\t\t\t\t\t\t\tmin=\"0\" max=\"100\" step=\"1\">\r\n\t\t\t\t\t\t\t</mat-slider> <!--(topMarginWebMobileBind && model.meta_data.mobile_margin_top = $event.value)-->\r\n\t\t\t\t\t\t</span>\r\n\t\t\t\t\t\t<span class=\"value-count-slider\">\r\n\t\t\t\t\t\t\t{{ model?.meta_data.margin_top }} PX\r\n\t\t\t\t\t\t</span>\r\n\t\t\t\t\t</div>\r\n\t\t\t\t</div>\r\n\t\t\t\t<div class=\"element-builder-row \"\t\t\t\t\r\n\t\t\t\t\t*ngIf=\"(this.currentPreviewLayout=='mobile')\"> <!--padding-elements-30-top ew-mobile-property-bind [ngClass]=\"{'ew-mobile-bind-active' : topMarginWebMobileBind == false}\"-->\r\n\t\t\t\t\t<span class=\"builder-elements-name\">{{ 'BUILDER.ELEMENTS.MOBILE_MARGIN' | translate }}\r\n\t\t\t\t\t\t<!--<mat-icon (click)=\"topMarginWebMobileBind = false\" class=\"ew-on-property\">insert_link</mat-icon>\r\n\t\t\t\t\t\t<mat-icon (click)=\"topMarginWebMobileBind = true; model.meta_data.mobile_margin_top = model.meta_data.margin_top\" class=\"ew-off-property\">link_off</mat-icon>-->\r\n\t\t\t\t\t</span>\r\n\t\t\t\t\t<div class=\"mat-slider-outer-part common-builder-right\"> <!-- opacity-pointer-event-->\r\n\t\t\t\t\t\t<span class=\"mat-slider-inner\">\r\n\t\t\t\t\t\t\t<mat-slider [value]=\"model?.meta_data.mobile_margin_top\" (input)=\"model.meta_data.mobile_margin_top = $event.value\"\r\n\t\t\t\t\t\t\t\tmin=\"0\" max=\"75\" step=\"1\">\r\n\t\t\t\t\t\t\t</mat-slider>\r\n\t\t\t\t\t\t</span>\r\n\t\t\t\t\t\t<span class=\"value-count-slider\">\r\n\t\t\t\t\t\t\t{{ model?.meta_data.mobile_margin_top }} PX\r\n\t\t\t\t\t\t</span>\r\n\t\t\t\t\t</div>\r\n\t\t\t\t</div>\r\n\t\t\t</div>\r\n\t\t\t<!-- <div class=\"builder-elements-outer ew-mobile-elements\">\r\n                <div class=\"element-builder-row\">\r\n                    <div class=\"ew-mobile-setting\">\r\n                        <span class=\"builder-elements-name\"><span class=\"mobile-icon-title\"><mat-icon>smartphone</mat-icon>Mobile</span>Top Margin</span>\r\n                        <div class=\"mat-slider-outer-part common-builder-right slider-2-digit\">\r\n                            <span class=\"mat-slider-inner\">\r\n                                <mat-slider [value]=\"model?.meta_data.mobile_margin_top\" (input)=\"model.meta_data.mobile_margin_top = $event.value\"\r\n                                    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.mobile_margin_top }} PX\r\n                            </span>\r\n                        </div>\r\n                    </div>\r\n                </div>\r\n            </div> -->\r\n\t\t\t<div class=\"builder-elements-outer\">\r\n\t\t\t\t<div class=\"element-builder-row \">\r\n\t\t\t\t\t<span class=\"builder-elements-name\">{{ 'BUILDER.ELEMENTS.WIDTH' | translate }}</span>\r\n\t\t\t\t\t\r\n\t\t\t\t\t<div class=\"mat-slider-outer-part common-builder-right\">\r\n\t\t\t\t\t\t<span class=\"mat-slider-inner\">\r\n\t\t\t\t\t\t\t<mat-slider [value]=\"model?.meta_data.width\" (input)=\"model.meta_data.width = $event.value\" min=\"30\"\r\n\t\t\t\t\t\t\t\tmax=\"100\" step=\"1\">\r\n\t\t\t\t\t\t\t</mat-slider>\r\n\t\t\t\t\t\t</span>\r\n\t\t\t\t\t\t<span class=\"value-count-slider\">\r\n\t\t\t\t\t\t\t{{ model?.meta_data.width }}%\r\n\t\t\t\t\t\t</span>\r\n\t\t\t\t\t</div>\r\n\t\t\t\t</div>\r\n\t\t\t</div>\r\n\t\t\t<div class=\"advance-title-sec-box\">\r\n\t\t\t\t<span class=\"title-advance-box\">{{ 'BUILDER.ELEMENTS.STYLE' | translate }}</span>\r\n\t\t\t</div>\r\n\t\t\t<div class=\"builder-elements-outer\">\r\n\t\t\t\t<div class=\"element-builder-row\" *ngIf=\"(this.currentPreviewLayout=='desktop')\">\r\n\t\t\t\t\t<span class=\"builder-elements-name\">{{ 'BUILDER.ELEMENTS.LAYOUT' | translate }}</span>\r\n\t\t\t\t\t<div class=\"common-builder-right\">\r\n\t\t\t\t\t\t<label for=\"layout1\">\r\n\t\t\t\t\t\t\t<span (click)=\"changeLayout('center')\" class=\"layout-presenter-selection\" [ngClass]=\"{'active': model.meta_data?.layout == 'center'}\">\r\n\t\t\t\t\t\t\t\t<svg id=\"Component_2_1\" data-name=\"Component 2 \u2013 1\" xmlns=\"http://www.w3.org/2000/svg\" width=\"80\"\r\n\t\t\t\t\t\t\t\t\theight=\"60\" viewBox=\"0 0 80 60\">\r\n\t\t\t\t\t\t\t\t\t<g id=\"Rectangle_44\" data-name=\"Rectangle 44\" fill=\"none\" stroke=\"#b1b1b1\" stroke-width=\"1\">\r\n\t\t\t\t\t\t\t\t\t\t<rect width=\"80\" height=\"60\" rx=\"5\" stroke=\"none\" />\r\n\t\t\t\t\t\t\t\t\t\t<rect x=\"0.5\" y=\"0.5\" width=\"79\" height=\"59\" rx=\"4.5\" fill=\"none\" />\r\n\t\t\t\t\t\t\t\t\t</g>\r\n\t\t\t\t\t\t\t\t\t<g id=\"Group_3847\" data-name=\"Group 3847\" transform=\"translate(-259 -364)\">\r\n\t\t\t\t\t\t\t\t\t\t<circle id=\"Ellipse_553\" data-name=\"Ellipse 553\" cx=\"7.5\" cy=\"7.5\" r=\"7.5\"\r\n\t\t\t\t\t\t\t\t\t\t\ttransform=\"translate(292 374)\" fill=\"#b1b1b1\" />\r\n\t\t\t\t\t\t\t\t\t\t<rect id=\"Rectangle_1386\" data-name=\"Rectangle 1386\" width=\"40\" height=\"10\"\r\n\t\t\t\t\t\t\t\t\t\t\ttransform=\"translate(279 394)\" fill=\"#b1b1b1\" />\r\n\t\t\t\t\t\t\t\t\t\t<rect id=\"Rectangle_1387\" data-name=\"Rectangle 1387\" width=\"40\" height=\"5\"\r\n\t\t\t\t\t\t\t\t\t\t\ttransform=\"translate(279 409)\" fill=\"#b1b1b1\" />\r\n\t\t\t\t\t\t\t\t\t</g>\r\n\t\t\t\t\t\t\t\t</svg>\r\n\t\t\t\t\t\t\t</span>\r\n\t\t\t\t\t\t</label>\r\n\t\t\t\t\t\t<!--<input type=\"radio\" [(ngModel)]=\"model?.meta_data.layout\" id=\"layout1\" value=\"center\" class=\"ew-layout-display-none\">-->\r\n\t\t\t\t\t\t<label for=\"layout2\">\r\n\t\t\t\t\t\t\t<span (click)=\"changeLayout('right')\" class=\"layout-presenter-selection double-layout-presenter\" [ngClass]=\"{'active': model.meta_data?.layout == 'right'}\">\r\n\t\t\t\t\t\t\t\t<svg id=\"Component_1_1\" data-name=\"Component 1 \u2013 1\" xmlns=\"http://www.w3.org/2000/svg\" width=\"80\"\r\n\t\t\t\t\t\t\t\t\theight=\"60\" viewBox=\"0 0 80 60\">\r\n\t\t\t\t\t\t\t\t\t<g id=\"Rectangle_44\" data-name=\"Rectangle 44\" fill=\"none\" stroke=\"#d2d1d2\" stroke-width=\"1\">\r\n\t\t\t\t\t\t\t\t\t\t<rect width=\"80\" height=\"60\" rx=\"5\" stroke=\"none\" />\r\n\t\t\t\t\t\t\t\t\t\t<rect x=\"0.5\" y=\"0.5\" width=\"79\" height=\"59\" rx=\"4.5\" fill=\"none\" />\r\n\t\t\t\t\t\t\t\t\t</g>\r\n\t\t\t\t\t\t\t\t\t<g id=\"Group_3847\" data-name=\"Group 3847\" transform=\"translate(-249 -379)\">\r\n\t\t\t\t\t\t\t\t\t\t<circle id=\"Ellipse_553\" data-name=\"Ellipse 553\" cx=\"7.5\" cy=\"7.5\" r=\"7.5\"\r\n\t\t\t\t\t\t\t\t\t\t\ttransform=\"translate(259 394)\" fill=\"#b1b1b1\" />\r\n\t\t\t\t\t\t\t\t\t\t<rect id=\"Rectangle_1386\" data-name=\"Rectangle 1386\" width=\"40\" height=\"10\"\r\n\t\t\t\t\t\t\t\t\t\t\ttransform=\"translate(279 394)\" fill=\"#b1b1b1\" />\r\n\t\t\t\t\t\t\t\t\t\t<rect id=\"Rectangle_1387\" data-name=\"Rectangle 1387\" width=\"40\" height=\"5\"\r\n\t\t\t\t\t\t\t\t\t\t\ttransform=\"translate(279 409)\" fill=\"#b1b1b1\" />\r\n\t\t\t\t\t\t\t\t\t\t<rect id=\"Rectangle_1388\" data-name=\"Rectangle 1388\" width=\"40\" height=\"5\"\r\n\t\t\t\t\t\t\t\t\t\t\ttransform=\"translate(279 419)\" fill=\"#b1b1b1\" />\r\n\t\t\t\t\t\t\t\t\t</g>\r\n\t\t\t\t\t\t\t\t</svg>\r\n\t\t\t\t\t\t\t</span>\r\n\t\t\t\t\t\t</label>\r\n\t\t\t\t\t\t<!--<input type=\"radio\" [(ngModel)]=\"model?.meta_data.layout\" id=\"layout2\" value=\"right\" class=\"ew-layout-display-none\">-->\r\n\t\t\t\t\t</div>\r\n\t\t\t\t</div>\r\n\t\t\t\t<div class=\"element-builder-row padding-elements-30-top\">\r\n\t\t\t\t\t<span class=\"builder-elements-name\">{{ 'BUILDER.ELEMENTS.ALIGN' | translate }}</span>\r\n\t\t\t\t\t<div class=\"common-builder-right\">\r\n\t\t\t\t\t\t<mat-form-field floatLabel=\"never\" class=\"ew-field-without-lebel\">\r\n\t\t\t\t\t\t\t<mat-select [(value)]=\"model?.meta_data.align\">\r\n\t\t\t\t\t\t\t\t<mat-option value=\"margin-right: auto;\">Left</mat-option>\r\n\t\t\t\t\t\t\t\t<mat-option value=\"margin-left: auto;margin-right: auto;\">Center</mat-option>\r\n\t\t\t\t\t\t\t\t<mat-option value=\"margin-left: auto;\">Right</mat-option>\r\n\t\t\t\t\t\t\t</mat-select>\r\n\t\t\t\t\t\t</mat-form-field>\r\n\t\t\t\t\t</div>\r\n\t\t\t\t</div>\r\n\r\n\t\t\t\t<div class=\"element-builder-row padding-elements-30-top\">\r\n\t\t\t\t\t<span class=\"builder-elements-name\">{{ 'BUILDER.ELEMENTS.BG_COLOR' | translate }}</span>\r\n\t\t\t\t\t<div class=\"common-builder-right\">\r\n\t\t\t\t\t\t<mat-form-field class=\"mat-form-field color-picker-mat embeded-color-widget-picker\"\r\n\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\tfloatLabel=\"never\">\r\n\t\t\t\t\t\t\t<input matInput type=\"text\"\r\n\t\t\t\t\t\t\t\t[cpPosition]=\"'top'\"\r\n\t\t\t\t\t\t\t\t[cpOutputFormat]=\"'rgba'\"\r\n\t\t\t\t\t\t\t\t[colorPicker]=\"model.meta_data?.bg_color\"\t\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\t(colorPickerChange)=\"changeColorPicker($event)\"\r\n\t\t\t\t\t\t\t\t[ngModel]=\"model.meta_data?.bg_color\" />\r\n\t\t\t\t\t\t\t<span class=\"color-picker-box\" \r\n\t\t\t\t\t\t\t\t[ngClass]=\"{'transparent-color-ew': (isUndefined(model.meta_data?.bg_color) || model.meta_data?.bg_color.slice(-2,-1) == '0') }\"\r\n\t\t\t\t\t\t\t\t[style.background-color]=\"model?.meta_data.bg_color\"></span>\r\n\t\t\t\t\t\t</mat-form-field>\r\n\t\t\t\t\t</div>\r\n\t\t\t\t</div>\r\n\t\t\t\t<!-- <div class=\"element-builder-row padding-elements-30-top\">\r\n\t\t\t\t\t<span class=\"builder-elements-name\">{{ 'BUILDER.ELEMENTS.TEXT_COLOR' | translate }}</span>\r\n\t\t\t\t\t<div class=\"common-builder-right\">\r\n\t\t\t\t\t\t<mat-form-field class=\"mat-form-field color-picker-mat embeded-color-widget-picker\"\r\n\t\t\t\t\t\t[ngClass]=\"{'transparent-color-ew': model?.meta_data.text_color.slice(-2,-1) == '0' }\"\r\n\t\t\t\t\t\tfloatLabel=\"never\">\r\n\t\t\t\t\t\t\t<input matInput type=\"text\" [cpPosition]=\"'top'\" [cpOutputFormat]=\"'rgba'\"\r\n\t\t\t\t\t\t\t\t[colorPicker]=\"model?.meta_data.text_color\"\r\n\t\t\t\t\t\t\t\t(colorPickerChange)=\"model.meta_data.text_color=$event\"\r\n\t\t\t\t\t\t\t\t[(ngModel)]=\"model?.meta_data.text_color\" />\r\n\t\t\t\t\t\t\t<span class=\"color-picker-box\" [style.background-color]=\"model?.meta_data.text_color\"></span>\r\n\t\t\t\t\t\t</mat-form-field>\r\n\t\t\t\t\t</div>\r\n\t\t\t\t</div> -->\r\n\t\t\t</div>\r\n\t\t<div class=\"advance-title-sec-box\">\r\n\t\t\t<span class=\"title-advance-box\">{{ 'BUILDER.ELEMENTS.PADDINGS' | translate }}</span>\r\n\t\t</div>\r\n\t\t<div class=\"builder-elements-outer\">\r\n\t\t\t<div class=\"element-builder-row\">\r\n\t\t\t\t<span class=\"builder-elements-name\">{{ 'BUILDER.ELEMENTS.PADDING.TOP' | translate }}</span>\r\n\t\t\t\t<div class=\"mat-slider-outer-part common-builder-right\">\r\n\t\t\t\t\t<span class=\"mat-slider-inner\">\r\n\t\t\t\t\t\t<mat-slider [value]=\"model?.meta_data.padding_top\" (input)=\"model?.meta_data.padding_top = $event.value\" min=\"0\" max=\"100\" step=\"1\">\r\n\t\t\t\t\t\t</mat-slider>\r\n\t\t\t\t\t</span>\r\n\t\t\t\t\t<span class=\"value-count-slider\">\r\n\t\t\t\t\t\t{{ model?.meta_data.padding_top }} px\r\n\t\t\t\t\t</span>\r\n\t\t\t\t</div>\r\n\t\t\t</div>\r\n\r\n\t\t\t<div class=\"element-builder-row padding-elements-30-top\">\r\n\t\t\t\t<span class=\"builder-elements-name\">{{ 'BUILDER.ELEMENTS.PADDING.RIGHT' | translate }}</span>\r\n\t\t\t\t<div class=\"mat-slider-outer-part common-builder-right \">\r\n\t\t\t\t\t<span class=\"mat-slider-inner\">\r\n\t\t\t\t\t\t<mat-slider [value]=\"model?.meta_data.padding_right\" (input)=\"model?.meta_data.padding_right = $event.value\" min=\"0\" max=\"100\" step=\"1\">\r\n\t\t\t\t\t\t</mat-slider>\r\n\t\t\t\t\t</span>\r\n\t\t\t\t\t<span class=\"value-count-slider\">\r\n\t\t\t\t\t\t{{ model?.meta_data.padding_right }} px\r\n\t\t\t\t\t</span>\r\n\t\t\t\t</div>\r\n\t\t\t</div>\r\n\r\n\t\t\t<div class=\"element-builder-row padding-elements-30-top\">\r\n\t\t\t\t<span class=\"builder-elements-name\">{{ 'BUILDER.ELEMENTS.PADDING.BOTTOM' | translate }}</span>\r\n\t\t\t\t<div class=\"mat-slider-outer-part common-builder-right \">\r\n\t\t\t\t\t<span class=\"mat-slider-inner\">\r\n\t\t\t\t\t\t<mat-slider [value]=\"model?.meta_data.padding_bottom\" (input)=\"model?.meta_data.padding_bottom = $event.value\" min=\"0\" max=\"100\" step=\"1\">\r\n\t\t\t\t\t\t</mat-slider>\r\n\t\t\t\t\t</span>\r\n\t\t\t\t\t<span class=\"value-count-slider\">\r\n\t\t\t\t\t\t{{ model?.meta_data.padding_bottom }} px\r\n\t\t\t\t\t</span>\r\n\t\t\t\t</div>\r\n\t\t\t</div>\r\n\r\n\t\t\t<div class=\"element-builder-row padding-elements-30-top\">\r\n\t\t\t\t<span class=\"builder-elements-name\">{{ 'BUILDER.ELEMENTS.PADDING.LEFT' | translate }}</span>\r\n\t\t\t\t<div class=\"mat-slider-outer-part common-builder-right\">\r\n\t\t\t\t\t<span class=\"mat-slider-inner\">\r\n\t\t\t\t\t\t<mat-slider [value]=\"model?.meta_data.padding_left\" (input)=\"model?.meta_data.padding_left = $event.value\" min=\"0\" max=\"100\" step=\"1\">\r\n\t\t\t\t\t\t</mat-slider>\r\n\t\t\t\t\t</span>\r\n\t\t\t\t\t<span class=\"value-count-slider\">\r\n\t\t\t\t\t\t{{ model?.meta_data.padding_left }} px\r\n\t\t\t\t\t</span>\r\n\t\t\t\t</div>\r\n\t\t\t</div>\r\n\t\t\t\r\n\t\t\t<!-- <div class=\"element-builder-row padding-elements-builder-sidebar\">\r\n\t\t\t\t<div class=\"row\">\r\n\t\t\t\t\t<div class=\"col m3 s3\">\r\n\t\t\t\t\t\t<div class=\"bottom-custom-design-fields\">\r\n\t\t\t\t\t\t\t<label class=\"label-padding-sec\">{{ 'BUILDER.ELEMENTS.PADDING.TOP' | translate }}</label>\r\n\t\t\t\t\t\t\t<mat-form-field class=\"ew-field-no-label\" floatLabel=\"never\">\r\n\t\t\t\t\t\t\t\t<input matInput [(ngModel)]=\"model?.meta_data.padding_top\" type=\"number\" placeholder=\"\">\r\n\t\t\t\t\t\t\t</mat-form-field>\r\n\t\t\t\t\t\t</div>\r\n\t\t\t\t\t</div>\r\n\t\t\t\t\t<div class=\"col m3 s3\">\r\n\t\t\t\t\t\t<div class=\"bottom-custom-design-fields\">\r\n\t\t\t\t\t\t\t<label class=\"label-padding-sec\">{{ 'BUILDER.ELEMENTS.PADDING.RIGHT' | translate }}</label>\r\n\t\t\t\t\t\t\t<mat-form-field class=\"ew-field-no-label\" floatLabel=\"never\">\r\n\t\t\t\t\t\t\t\t<input matInput [(ngModel)]=\"model?.meta_data.padding_right\" type=\"number\" placeholder=\"\">\r\n\t\t\t\t\t\t\t</mat-form-field>\r\n\t\t\t\t\t\t</div>\r\n\t\t\t\t\t</div>\r\n\t\t\t\t\t<div class=\"col m3 s3\">\r\n\t\t\t\t\t\t<div class=\"bottom-custom-design-fields\">\r\n\t\t\t\t\t\t\t<label class=\"label-padding-sec\">{{ 'BUILDER.ELEMENTS.PADDING.BOTTOM' | translate }}</label>\r\n\t\t\t\t\t\t\t<mat-form-field class=\"ew-field-no-label\" floatLabel=\"never\">\r\n\t\t\t\t\t\t\t\t<input matInput [(ngModel)]=\"model?.meta_data.padding_bottom\" type=\"number\" placeholder=\"\">\r\n\t\t\t\t\t\t\t</mat-form-field>\r\n\t\t\t\t\t\t</div>\r\n\t\t\t\t\t</div>\r\n\t\t\t\t\t<div class=\"col m3 s3\">\r\n\t\t\t\t\t\t<div class=\"bottom-custom-design-fields\">\r\n\t\t\t\t\t\t\t<label class=\"label-padding-sec\">{{ 'BUILDER.ELEMENTS.PADDING.LEFT' | translate }}</label>\r\n\t\t\t\t\t\t\t<mat-form-field class=\"ew-field-no-label\" floatLabel=\"never\">\r\n\t\t\t\t\t\t\t\t<input matInput [(ngModel)]=\"model?.meta_data.padding_left\" type=\"number\" placeholder=\"\">\r\n\t\t\t\t\t\t\t</mat-form-field>\r\n\t\t\t\t\t\t</div>\r\n\t\t\t\t\t</div>\r\n\t\t\t\t</div>\r\n\t\t\t</div> -->\r\n\t\t</div>\r\n\t\t</div>\r\n\t\t\r\n\t\t<div class=\"advanced-tab\" *ngIf=\"tabOptions.value == 'advanced'\">\r\n\t\t\t<div class=\"builder-elements-outer\">\r\n\t\t\t\t<div class=\"element-builder-row\">\r\n\t\t\t\t\t<span class=\"builder-elements-name\">{{ 'BUILDER.ELEMENTS.BORDER_RADIUS' | translate }}</span>\r\n\t\t\t\t\t<div class=\"mat-slider-outer-part common-builder-right\">\r\n\t\t\t\t\t\t<span class=\"mat-slider-inner\">\r\n\t\t\t\t\t\t\t<mat-slider [value]=\"model?.meta_data.border_radius\" (input)=\"model.meta_data.border_radius = $event.value\"\r\n\t\t\t\t\t\t\t\tmin=\"0\" max=\"100\" step=\"1\">\r\n\t\t\t\t\t\t\t</mat-slider>\r\n\t\t\t\t\t\t</span>\r\n\t\t\t\t\t\t<span class=\"value-count-slider\">{{ model?.meta_data.border_radius }} PX</span>\r\n\t\t\t\t\t</div>\r\n\t\t\t\t</div>\r\n\t\t\t</div>\r\n\t\t\t<div class=\"advance-title-sec-box\">\r\n\t\t\t\t<span class=\"title-advance-box\">{{ 'BUILDER.ELEMENTS.BORDER' | translate }}</span>\r\n\t\t\t</div>\r\n\t\t\t<div class=\"builder-elements-outer\">\r\n\t\t\t\t<div class=\"element-builder-row\">\r\n\t\t\t\t\t<span class=\"builder-elements-name\">{{ 'BUILDER.ELEMENTS.BORDER' | translate }}</span>\r\n\t\t\t\t\t<div class=\"common-builder-right\">\r\n\t\t\t\t\t\t<mat-form-field floatLabel=\"never\" class=\"ew-field-without-lebel\">\r\n\t\t\t\t\t\t\t<mat-select [(value)]=\"model?.meta_data.border_position\">\r\n\t\t\t\t\t\t\t\t<mat-option value=\"ew_border_top_bottom\">Top & Bottom</mat-option>\r\n\t\t\t\t\t\t\t\t<mat-option value=\"ew_border_top\">Top Only</mat-option>\r\n\t\t\t\t\t\t\t\t<mat-option value=\"ew_border_bottom\">Bottom Only</mat-option>\r\n\t\t\t\t\t\t\t\t<mat-option value=\"ew_border_left_right\">Left & Right</mat-option>\r\n                                <mat-option value=\"ew_border_left\">Left Only</mat-option>\r\n                                <mat-option value=\"ew_border_right\">Right Only</mat-option>\r\n\t\t\t\t\t\t\t\t<mat-option value=\"ew_full_border\">Full Border</mat-option>\r\n\t\t\t\t\t\t\t\t<mat-option value=\"ew_no_border\">No Border</mat-option>\r\n\t\t\t\t\t\t\t</mat-select>\r\n\t\t\t\t\t\t</mat-form-field>\r\n\t\t\t\t\t</div>\r\n\t\t\t\t</div>\r\n\t\t\t\t<div *ngIf=\"model?.meta_data.border_position != 'ew_no_border'\" class=\"element-builder-row padding-elements-30-top\">\r\n\t\t\t\t\t<span class=\"builder-elements-name\">{{ 'BUILDER.ELEMENTS.STYLE' | translate }}</span>\r\n\t\t\t\t\t<div class=\"common-builder-right\">\r\n\t\t\t\t\t\t<mat-form-field floatLabel=\"never\" class=\"ew-field-without-lebel\">\r\n\t\t\t\t\t\t\t<mat-select [(value)]=\"model?.meta_data.border_style\">\r\n\t\t\t\t\t\t\t\t<mat-option value=\"solid\">Solid</mat-option>\r\n\t\t\t\t\t\t\t\t<mat-option value=\"dashed\">Dashed</mat-option>\r\n\t\t\t\t\t\t\t\t<mat-option value=\"dotted\">Dotted</mat-option>\r\n\t\t\t\t\t\t\t\t<mat-option value=\"double\">Double</mat-option>\r\n\t\t\t\t\t\t\t\t<mat-option value=\"groove\">Groove</mat-option>\r\n\t\t\t\t\t\t\t</mat-select>\r\n\t\t\t\t\t\t</mat-form-field>\r\n\t\t\t\t\t</div>\r\n\t\t\t\t</div>\r\n\t\t\t\t<div *ngIf=\"model?.meta_data.border_position != 'ew_no_border'\" class=\"element-builder-row padding-elements-30-top\">\r\n\t\t\t\t\t<span class=\"builder-elements-name\">{{ 'BUILDER.ELEMENTS.SIZE' | translate }}</span>\r\n\t\t\t\t\t<div class=\"mat-slider-outer-part common-builder-right\">\r\n\t\t\t\t\t\t<span class=\"mat-slider-inner\">\r\n\t\t\t\t\t\t\t<mat-slider [value]=\"model?.meta_data.border_size\" (input)=\"model.meta_data.border_size = $event.value\"\r\n\t\t\t\t\t\t\t\tmin=\"1\" max=\"100\" step=\"1\">\r\n\t\t\t\t\t\t\t</mat-slider>\r\n\t\t\t\t\t\t</span>\r\n\t\t\t\t\t\t<span class=\"value-count-slider\">{{ model?.meta_data.border_size }} PX</span>\r\n\t\t\t\t\t</div>\r\n\t\t\t\t</div>\r\n\t\t\t\t<div *ngIf=\"model?.meta_data.border_position != 'ew_no_border'\" class=\"element-builder-row  padding-elements-30-top\">\r\n\t\t\t\t\t<span class=\"builder-elements-name\">{{ 'BUILDER.ELEMENTS.BORDER_COLOR' | translate }}</span>\r\n\t\t\t\t\t<div class=\"common-builder-right\">\r\n\t\t\t\t\t\t<mat-form-field class=\"mat-form-field color-picker-mat embeded-color-widget-picker\" floatLabel=\"never\">\r\n\t\t\t\t\t\t\t<input matInput type=\"text\"\r\n\t\t\t\t\t\t\t\t[cpPosition]=\"'top'\"\r\n\t\t\t\t\t\t\t\t[cpAlphaChannel]=\"'disableAlpha'\"\r\n                                [cpOutputFormat]=\"'auto'\"\r\n\t\t\t\t\t\t\t\t[colorPicker]=\"model?.meta_data.border_color\"\r\n\t\t\t\t\t\t\t\t(colorPickerChange)=\"model.meta_data.border_color=$event\"\r\n\t\t\t\t\t\t\t\t[(ngModel)]=\"model?.meta_data.border_color\" />\r\n\t\t\t\t\t\t\t<span class=\"color-picker-box\"\r\n\t\t\t\t\t\t\t\t[style.background-color]=\"model?.meta_data.border_color\"></span>\r\n\t\t\t\t\t\t</mat-form-field>\r\n\t\t\t\t\t</div>\r\n\t\t\t\t</div>\r\n\t\t\t</div>\r\n\t\t\t<div class=\"advance-title-sec-box\">\r\n                <span class=\"title-advance-box\">{{ 'BUILDER.ELEMENTS.BOX_SHADOW' | translate }}</span>\r\n            </div>\r\n            <div class=\"builder-elements-outer\">\r\n                <div class=\"element-builder-row\">\r\n                    <span class=\"builder-elements-name\">{{ 'BUILDER.ELEMENTS.TYPE' | 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.box_shadow\">\r\n                                <mat-option value=\"ew-no-shadow\">No Shadow</mat-option>\r\n                                <mat-option value=\"ew-small-shadow\">Small</mat-option>\r\n                                <mat-option value=\"ew-medium-shadow\">Medium</mat-option>\r\n                                <mat-option value=\"ew-large-shadow\">Large</mat-option>\r\n                            </mat-select>\r\n                        </mat-form-field>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n            <div class=\"advance-title-sec-box\">\r\n                <span class=\"title-advance-box\">{{ 'BUILDER.ELEMENTS.CUSTOM_CLASS' | translate }}</span>\r\n            </div>\r\n            <div class=\"builder-elements-outer\">\r\n                <div class=\"element-builder-row\">\r\n                    <span class=\"builder-elements-name\">{{ 'BUILDER.ELEMENTS.CUSTOM_CLASS_NAME' | translate }}</span>\r\n                    <div class=\"common-builder-right\">\r\n                        <mat-form-field class=\"ew-field-without-lebel builder-input-fields\" floatLabel=\"never\">\r\n                            <input matInput type=\"text\" [(ngModel)]=\"model?.meta_data.custom_class\">\r\n                        </mat-form-field>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n\t\t\t\r\n\t\t</div>\r\n\r\n\t</div>\r\n</div>\r\n\r\n\r\n\r\n<!-- <div class=\"page-sidebar-elements layout-branding-elements page-editor-ew-view\">\r\n\t<div class=\"mat-widget-header tab-toggle-ew editor-type-header\">\r\n\t\t<span class=\"title-content-ew\">Presenter</span>\r\n\t\t<span class=\"btn-editor-save\">\r\n\t\t\t<button (click)=\"closeConfig()\" class=\"small-button-ew\" mat-flat-button color=\"accent\">Done</button>\r\n\t\t</span>\r\n\t</div>\r\n\r\n\t<div class=\"elements-outer-sec-scroll popover-btn-ew-custom\">\r\n\r\n\t\t<div class=\"layout-branding-elements\">\r\n\t\t\t<div class=\"layout-page-branding\">\r\n\t\t\t\t<div class=\"advance-title-sec-box\">\r\n\t\t\t\t\t<span class=\"title-advance-box\">Presenter</span>\r\n\t\t\t\t</div>\r\n\r\n\t\t\t\t<div class=\"element-child-list-nav\">\r\n\t\t\t\t\t<ul>\r\n\t\t\t\t\t\t<li *ngFor=\"let presenter of model?.meta_data.presenters; let i = index\">\r\n\t\t\t\t\t\t\t<div class=\"elements-custom-outer-ew\">\r\n\t\t\t\t\t\t\t\t<div class=\"left-list-item\">\r\n\t\t\t\t\t\t\t\t\t<div class=\"presenter-view-opt-ew\">\r\n\t\t\t\t\t\t\t\t\t\t<div class=\"left-presenter-setting-ew circle\">\r\n\t\t\t\t\t\t\t\t\t\t\t<img src=\"{{ presenter.image.url }}\" alt=\"profile_image\">\r\n\t\t\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t\t\t\t<div class=\"right-presenter-info-setting-ew\">\r\n\t\t\t\t\t\t\t\t\t\t\t<span class=\"title-presenter-name-ew-setting\">{{ presenter.name }}</span>\r\n\t\t\t\t\t\t\t\t\t\t\t<span class=\"designation-presenter-setting\">{{ presenter.title }}</span>\r\n\t\t\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t\t<div class=\"right-list-item added-action-ew no-margin-padding\">\r\n\t\t\t\t\t\t\t\t\t<span class=\"ew-form-fields-action\">\r\n\t\t\t\t\t\t\t\t\t\t<span (click)=\"editPresenter(presenter)\" class=\"edit-form-fields-ew\">\r\n\t\t\t\t\t\t\t\t\t\t\t<svg id=\"edit_1_\" data-name=\"edit (1)\" xmlns=\"http://www.w3.org/2000/svg\" width=\"14\" height=\"14\"\r\n\t\t\t\t\t\t\t\t\t\t\t\tviewBox=\"0 0 14 14\">\r\n\t\t\t\t\t\t\t\t\t\t\t\t<g id=\"Group_2928\" data-name=\"Group 2928\" transform=\"translate(0 9.66)\">\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t<g id=\"Group_2927\" data-name=\"Group 2927\">\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<path id=\"Path_1378\" data-name=\"Path 1378\" d=\"M1.4,353.28,0,357.62l4.34-1.4Z\"\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ttransform=\"translate(0 -353.28)\" />\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t</g>\r\n\t\t\t\t\t\t\t\t\t\t\t\t</g>\r\n\t\t\t\t\t\t\t\t\t\t\t\t<g id=\"Group_2930\" data-name=\"Group 2930\" transform=\"translate(2.383 1.824)\">\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t<g id=\"Group_2929\" data-name=\"Group 2929\" transform=\"translate(0 0)\">\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<rect id=\"Rectangle_934\" data-name=\"Rectangle 934\" width=\"9.66\" height=\"4.2\"\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ttransform=\"translate(0 6.831) rotate(-45)\" />\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t</g>\r\n\t\t\t\t\t\t\t\t\t\t\t\t</g>\r\n\t\t\t\t\t\t\t\t\t\t\t\t<g id=\"Group_2932\" data-name=\"Group 2932\" transform=\"translate(10.22)\">\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t<g id=\"Group_2931\" data-name=\"Group 2931\">\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<path id=\"Path_1379\" data-name=\"Path 1379\"\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\td=\"M377.33,2.17,375.37.21a.677.677,0,0,0-.98,0l-.63.63,2.94,2.94.63-.63A.677.677,0,0,0,377.33,2.17Z\"\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ttransform=\"translate(-373.76)\" />\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t</g>\r\n\t\t\t\t\t\t\t\t\t\t\t\t</g>\r\n\t\t\t\t\t\t\t\t\t\t\t</svg>\r\n\t\t\t\t\t\t\t\t\t\t</span>\r\n\t\t\t\t\t\t\t\t\t\t<span (click)=\"deletePresenter(i)\" class=\"edit-form-fields-ew\">\r\n\t\t\t\t\t\t\t\t\t\t\t<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"14\" height=\"17.238\" viewBox=\"0 0 14 17.238\">\r\n\t\t\t\t\t\t\t\t\t\t\t\t<g id=\"bin\" transform=\"translate(0.003 0.002)\">\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t<path id=\"Path_1354\" data-name=\"Path 1354\"\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\td=\"M222.8,154.7a.4.4,0,0,0-.4.4v7.63a.4.4,0,1,0,.807,0v-7.63A.4.4,0,0,0,222.8,154.7Zm0,0\"\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\ttransform=\"translate(-213.423 -148.459)\" />\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t<path id=\"Path_1355\" data-name=\"Path 1355\"\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\td=\"M104.8,154.7a.4.4,0,0,0-.4.4v7.63a.4.4,0,0,0,.807,0v-7.63A.4.4,0,0,0,104.8,154.7Zm0,0\"\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\ttransform=\"translate(-100.187 -148.459)\" />\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t<path id=\"Path_1356\" data-name=\"Path 1356\"\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\td=\"M1.143,5.13v9.946a2.227,2.227,0,0,0,.592,1.536,1.988,1.988,0,0,0,1.442.624h7.638a1.987,1.987,0,0,0,1.442-.624,2.227,2.227,0,0,0,.592-1.536V5.13a1.542,1.542,0,0,0-.4-3.033H10.388v-.5A1.586,1.586,0,0,0,8.789,0H5.2a1.586,1.586,0,0,0-1.6,1.595v.5H1.539a1.542,1.542,0,0,0-.4,3.033Zm9.672,11.3H3.178a1.278,1.278,0,0,1-1.227-1.352V5.166H12.043v9.911a1.278,1.278,0,0,1-1.227,1.352ZM4.413,1.593A.778.778,0,0,1,5.2.806H8.789a.778.778,0,0,1,.791.787v.5H4.413ZM1.539,2.905H12.455a.727.727,0,1,1,0,1.453H1.539a.727.727,0,0,1,0-1.453Zm0,0\"\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\ttransform=\"translate(0 0)\" />\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t<path id=\"Path_1357\" data-name=\"Path 1357\"\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\td=\"M163.8,154.7a.4.4,0,0,0-.4.4v7.63a.4.4,0,0,0,.807,0v-7.63A.4.4,0,0,0,163.8,154.7Zm0,0\"\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\ttransform=\"translate(-156.805 -148.459)\" />\r\n\t\t\t\t\t\t\t\t\t\t\t\t</g>\r\n\t\t\t\t\t\t\t\t\t\t\t</svg>\r\n\t\t\t\t\t\t\t\t\t\t</span>\r\n\t\t\t\t\t\t\t\t\t</span>\r\n\t\t\t\t\t\t\t\t\t<div class=\"ew-toggle-button\">\r\n\t\t\t\t\t\t\t\t\t\t<div class=\"toggle-button-cover\">\r\n\t\t\t\t\t\t\t\t\t\t\t<div class=\"button-cover\">\r\n\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"button b3\" id=\"button-ew\">\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t<input type=\"checkbox\" class=\"checkbox\" [(ngModel)]=\"model?.meta_data.presenters[i].status\">\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"knobs\">\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<span></span>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"layer\"></div>\r\n\t\t\t\t\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t</div>\r\n\r\n\t\t\t\t\t\t</li>\r\n\t\t\t\t\t</ul>\r\n\r\n\t\t\t\t\t<div *ngIf=\"addNewPresenter == false\" class=\"add-custom-filed-link-ew\">\r\n\t\t\t\t\t\t<button (click)=\"addNewPresenter = true; editData = undefined\" class=\"icon-only-button-ew padding-right-15px-ew no-bg-btn theme-button-text-ew-small\" disableRipple mat-flat-button>\r\n\t\t\t\t\t\t\t<mat-icon>add</mat-icon>Add Another Presenter\r\n\t\t\t\t\t\t</button>\r\n\t\t\t\t\t</div>\r\n\t\t\t\t\t<ew-element-add-new-presenter\r\n\t\t\t\t\t\t*ngIf=\"addNewPresenter == true\"\r\n\t\t\t\t\t\t[parent]=\"this\"\r\n\t\t\t\t\t\t[data]=\"editData\"\r\n\t\t\t\t\t>\r\n\t\t\t\t\t</ew-element-add-new-presenter>\r\n\r\n\t\t\t\t</div>\r\n\r\n\t\t\t\t<div class=\"advance-title-sec-box\">\r\n\t\t\t\t\t<span class=\"title-advance-box\">Style Options</span>\r\n\t\t\t\t</div>\r\n\r\n\t\t\t\t<div class=\"layout-page-branding branding-element-common form-setting-margin-box\">\r\n\t\t\t\t\t<label class=\"custom-small-label\">Layout</label>\r\n\r\n\t\t\t\t\t<ew-control-layout-selection\r\n\t\t\t\t\t\t[parentFrom]=\"presenterConfigForm.get('styles')\"\r\n\t\t\t\t\t\ttemplateType=\"presenter_layout\"\r\n\t\t\t\t\t>\r\n\t\t\t\t\t</ew-control-layout-selection>\r\n\r\n\t\t\t\t\t<div class=\"outer-padding-sec-ew medium-padding-ew\">\r\n\t\t\t\t\t\t<div class=\"row\">\r\n\t\t\t\t\t\t\t<div class=\"col m6 s6\">\r\n\r\n\t\t\t\t\t\t\t\t<ew-control-color-selector\r\n\t\t\t\t\t\t\t\t\t[controlName]=\"'background_color'\"\r\n\t\t\t\t\t\t\t\t\t[defaultValue]=\"'rgba(255,255,255)'\"\r\n\t\t\t\t\t\t\t\t\t[labelText]=\"'Background Color'\"\r\n\t\t\t\t\t\t\t\t\t[position]=\"'top'\"\r\n\t\t\t\t\t\t\t\t\t[parentFrom]=\"presenterConfigForm.get('styles')\"\r\n\t\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t</ew-control-color-selector>\r\n\r\n\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t<div class=\"col m6 s6\">\r\n\r\n\t\t\t\t\t\t\t\t<ew-control-color-selector\r\n\t\t\t\t\t\t\t\t\t[controlName]=\"'text_color'\"\r\n\t\t\t\t\t\t\t\t\t[defaultValue]=\"'rgba(0,0,0)'\"\r\n\t\t\t\t\t\t\t\t\t[labelText]=\"'Text Color'\"\r\n\t\t\t\t\t\t\t\t\t[position]=\"'top'\"\r\n\t\t\t\t\t\t\t\t\t[parentFrom]=\"presenterConfigForm.get('styles')\"\r\n\t\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t</ew-control-color-selector>\r\n\r\n\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t</div>\r\n\t\t\t\t\t</div>\r\n\r\n\t\t\t\t\t<div class=\"outer-padding-sec-ew\">\r\n\r\n\t\t\t\t\t\t<ew-control-color-selector\r\n\t\t\t\t\t\t\t[controlName]=\"'separator_color'\"\r\n\t\t\t\t\t\t\t[defaultValue]=\"'rgba(0,0,0)'\"\r\n\t\t\t\t\t\t\t[labelText]=\"'Separator Color'\"\r\n\t\t\t\t\t\t\t[position]=\"'top'\"\r\n\t\t\t\t\t\t\t[parentFrom]=\"presenterConfigForm.get('styles')\"\r\n\t\t\t\t\t\t>\r\n\t\t\t\t\t\t</ew-control-color-selector>\r\n\r\n\t\t\t\t\t</div>\r\n\r\n\t\t\t\t\t<div class=\"outer-padding-sec-ew large-padding-ew\">\r\n\t\t\t\t\t\t<div class=\"common-slider-ew-spiner slider-without-spiner logo-part-slider-ew\">\r\n\t\t\t\t\t\t\t<label class=\"upload-img-label\">Image Radius</label>\r\n\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t<ew-control-slider\r\n                              [controlName]=\"'image_radius'\"\r\n                              [withLabel]=\"true\"\r\n                              [min]=\"0\"\r\n                              [max]=\"100\"\r\n                              [step]=\"1\"\r\n                              [defaultValue]=\"100\"\r\n                              [formatMultiplier]=\"1\"\r\n                              [parentFrom]=\"presenterConfigForm.get('styles')\"\r\n                            >\r\n\t\t\t\t\t\t\t</ew-control-slider>\r\n\r\n\t\t\t\t\t\t</div>\r\n\t\t\t\t\t</div>\r\n\t\t\t\t\t<div class=\"outer-padding-sec-ew\">\r\n\t\t\t\t\t\t<div class=\"design-view-countdow-fields\">\r\n\t\t\t\t\t\t\t<span class=\"timr-label-fields\">\r\n\t\t\t\t\t\t\t\tPadding\r\n\t\t\t\t\t\t\t</span>\r\n\t\t\t\t\t\t\t<div class=\"row\">\r\n\t\t\t\t\t\t\t\t<div class=\"col m3 s3\">\r\n\r\n\t\t\t\t\t\t\t\t\t<ew-control-pixel-input\r\n\t\t\t\t\t\t\t\t\t\t[templateType]=\"'grouped'\"\r\n\t\t\t\t\t\t\t\t\t\t[controlName]=\"'padding_top'\"\r\n\t\t\t\t\t\t\t\t\t\t[labelText]=\"'Top'\"\r\n\t\t\t\t\t\t\t\t\t\t[placeHolderText]=\"'80px'\"\r\n\t\t\t\t\t\t\t\t\t\t[parentFrom]=\"presenterConfigForm.get('styles')\"\r\n\t\t\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t\t</ew-control-pixel-input>\r\n\r\n\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t\t<div class=\"col m3 s3\">\r\n\r\n\t\t\t\t\t\t\t\t\t<ew-control-pixel-input\r\n\t\t\t\t\t\t\t\t\t\t[templateType]=\"'grouped'\"\r\n\t\t\t\t\t\t\t\t\t\t[controlName]=\"'padding_right'\"\r\n\t\t\t\t\t\t\t\t\t\t[labelText]=\"'Right'\"\r\n\t\t\t\t\t\t\t\t\t\t[placeHolderText]=\"'80px'\"\r\n\t\t\t\t\t\t\t\t\t\t[parentFrom]=\"presenterConfigForm.get('styles')\"\r\n\t\t\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t\t</ew-control-pixel-input>\r\n\r\n\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t\t<div class=\"col m3 s3\">\r\n\r\n\t\t\t\t\t\t\t\t\t<ew-control-pixel-input\r\n\t\t\t\t\t\t\t\t\t\t[templateType]=\"'grouped'\"\r\n\t\t\t\t\t\t\t\t\t\t[controlName]=\"'padding_bottom'\"\r\n\t\t\t\t\t\t\t\t\t\t[labelText]=\"'Bottom'\"\r\n\t\t\t\t\t\t\t\t\t\t[placeHolderText]=\"'80px'\"\r\n\t\t\t\t\t\t\t\t\t\t[parentFrom]=\"presenterConfigForm.get('styles')\"\r\n\t\t\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t\t</ew-control-pixel-input>\r\n\r\n\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t\t<div class=\"col m3 s3\">\r\n\r\n\t\t\t\t\t\t\t\t\t<ew-control-pixel-input\r\n\t\t\t\t\t\t\t\t\t\t[templateType]=\"'grouped'\"\r\n\t\t\t\t\t\t\t\t\t\t[controlName]=\"'padding_left'\"\r\n\t\t\t\t\t\t\t\t\t\t[labelText]=\"'Left'\"\r\n\t\t\t\t\t\t\t\t\t\t[placeHolderText]=\"'80px'\"\r\n\t\t\t\t\t\t\t\t\t\t[parentFrom]=\"presenterConfigForm.get('styles')\"\r\n\t\t\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t\t</ew-control-pixel-input>\r\n\r\n\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t</div>\r\n\t\t\t\t\t</div>\r\n\t\t\t\t\t<div class=\"outer-padding-sec-ew\">\r\n\t\t\t\t\t\t<div class=\"design-view-countdow-fields\">\r\n\t\t\t\t\t\t\t<span class=\"timr-label-fields\">\r\n\t\t\t\t\t\t\t\tMargin\r\n\t\t\t\t\t\t\t</span>\r\n\t\t\t\t\t\t\t<div class=\"row\">\r\n\t\t\t\t\t\t\t\t<div class=\"col m3 s3\">\r\n\r\n\t\t\t\t\t\t\t\t\t<ew-control-pixel-input\r\n\t\t\t\t\t\t\t\t\t\t[templateType]=\"'grouped'\"\r\n\t\t\t\t\t\t\t\t\t\t[controlName]=\"'margin_top'\"\r\n\t\t\t\t\t\t\t\t\t\t[labelText]=\"'Top'\"\r\n\t\t\t\t\t\t\t\t\t\t[placeHolderText]=\"'80px'\"\r\n\t\t\t\t\t\t\t\t\t\t[parentFrom]=\"presenterConfigForm.get('styles')\"\r\n\t\t\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t\t</ew-control-pixel-input>\r\n\r\n\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t\t<div class=\"col m3 s3\">\r\n\r\n\t\t\t\t\t\t\t\t\t<ew-control-pixel-input\r\n\t\t\t\t\t\t\t\t\t\t[templateType]=\"'grouped'\"\r\n\t\t\t\t\t\t\t\t\t\t[controlName]=\"'margin_bottom'\"\r\n\t\t\t\t\t\t\t\t\t\t[labelText]=\"'Bottom'\"\r\n\t\t\t\t\t\t\t\t\t\t[placeHolderText]=\"'80px'\"\r\n\t\t\t\t\t\t\t\t\t\t[parentFrom]=\"presenterConfigForm.get('styles')\"\r\n\t\t\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t\t</ew-control-pixel-input>\r\n\r\n\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t</div>\r\n\t\t\t\t\t</div>\r\n\r\n\t\t\t\t</div>\r\n\t\t\t</div>\r\n\t\t</div>\r\n\t</div>\r\n\r\n</div> -->",
            styles: [""]
        })
    ], PresenterSidebarComponent);
    return PresenterSidebarComponent;
}());
export { PresenterSidebarComponent };
//# sourceMappingURL=data:application/json;base64, 