import { __decorate } from "tslib";
import { Component, Input, Output, EventEmitter } from "@angular/core";
var LineSidebarComponent = /** @class */ (function () {
    function LineSidebarComponent() {
        this.currentPreviewLayout = "desktop";
        this.showBackFor = '';
        this.onSidebarBackClick = new EventEmitter();
        /**
         * @description
         * Emit event to Done Click.
         */
        this.onDoneClick = new EventEmitter();
        this.callParentContainer = new EventEmitter();
        this.topMarginWebMobileBind = true;
    }
    LineSidebarComponent.prototype.ngOnInit = function () { };
    LineSidebarComponent.prototype.closeConfig = function () {
        this.onDoneClick.emit();
    };
    LineSidebarComponent.prototype.sidebarBack = function (type) {
        this.onSidebarBackClick.emit();
    };
    /**
     * Do Check event
     */
    LineSidebarComponent.prototype.ngDoCheck = function () {
        this.currentPreviewLayout = localStorage.getItem('currentPreviewLayout');
    };
    LineSidebarComponent.prototype.callElementContainer = function (data) {
        //this.callParentContainer.emit(data);
    };
    __decorate([
        Input()
    ], LineSidebarComponent.prototype, "model", void 0);
    __decorate([
        Input()
    ], LineSidebarComponent.prototype, "showBackFor", void 0);
    __decorate([
        Output()
    ], LineSidebarComponent.prototype, "onSidebarBackClick", void 0);
    __decorate([
        Output()
    ], LineSidebarComponent.prototype, "onDoneClick", void 0);
    __decorate([
        Output()
    ], LineSidebarComponent.prototype, "callParentContainer", void 0);
    LineSidebarComponent = __decorate([
        Component({
            selector: 'ew-element-line-sidebar',
            template: "<!-- <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\">Line</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\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=\"layout-page-branding branding-element-common form-setting-margin-box\">\r\n\t\t\t\t\t<div>\r\n\t\t\t\t\t\t<div class=\"row\">\r\n\t\t\t\t\t\t\t<div class=\"col m4 s4\">\r\n\t\t\t\t\t\t\t\t<div class=\"elements-custom-outer-ew\">\r\n\t\t\t\t\t\t\t\t\t<div class=\"left-list-item\">\r\n\t\t\t\t\t\t\t\t\t\t<span class=\"title-list-nav\">Line Height</span>\r\n\t\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t\t\t<div class=\"bottom-custom-design-fields fields-padding-margin-ew\">\r\n\t\t\t\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\t\t\t<input name=\"line_height\" [(ngModel)]=\"model?.meta_data.line_height\" matInput placeholder=\"1px\">\r\n\t\t\t\t\t\t\t\t\t\t</mat-form-field>\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\t\t\t\t\t\t</div>\r\n\t\t\t\t\t</div>\r\n\t\t\t\t\t<div class=\"row\">\r\n\t\t\t\t\t\t<div class=\"col m6 s6\">\r\n\t\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\t<label>Line Color</label>\r\n\t\t\t\t\t\t\t\t<input matInput type=\"text\"\r\n\t\t\t\t\t\t\t\t\t[cpPosition]=\"'bottom'\"\r\n\t\t\t\t\t\t\t\t\t[cpOutputFormat]=\"'auto'\" \r\n\t\t\t\t\t\t\t\t\t[cpAlphaChannel]=\"'disabled'\" \r\n\t\t\t\t\t\t\t\t\t[colorPicker]=\"model?.meta_data.line_color\"\r\n\t\t\t\t\t\t\t\t\t(colorPickerChange)=\"model.meta_data.line_color=$event\"\r\n\t\t\t\t\t\t\t\t\t[(ngModel)]=\"model?.meta_data.line_color\"\r\n\t\t\t\t\t\t\t\t/>\r\n\t\t\t\t\t\t\t\t<span class=\"color-picker-box\" [style.background-color]=\"model?.meta_data.line_color\"></span>\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\r\n\t\t\t\t<div class=\"advance-title-sec-box\">\r\n\t\t\t\t\t<span class=\"title-advance-box\">Margin</span>\r\n\t\t\t\t</div>\r\n\t\t\t\t<div class=\"box-title-branding branding-element-common form-setting-margin-box\">\r\n\t\t\t\t\t<div class=\"theme-box-content\">\r\n\t\t\t\t\t\t<div class=\"row\">\r\n\t\t\t\t\t\t\t<div class=\"col m5 s5\">\r\n\t\t\t\t\t\t\t\t<div class=\"elements-custom-outer-ew\">\r\n\t\t\t\t\t\t\t\t\t<div class=\"left-list-item\">\r\n\t\t\t\t\t\t\t\t\t\t<span class=\"title-list-nav\">Top</span>\r\n\t\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t\t\t<div class=\"bottom-custom-design-fields fields-padding-margin-ew\">\r\n\t\t\t\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\t\t\t<input name=\"margin_top\" [(ngModel)]=\"model?.meta_data.margin_top\" matInput placeholder=\"5px\">\r\n\t\t\t\t\t\t\t\t\t\t</mat-form-field>\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\t\t\t\t\t\t\t<div class=\"col m5 s5\">\r\n\t\t\t\t\t\t\t\t<div class=\"elements-custom-outer-ew\">\r\n\t\t\t\t\t\t\t\t\t<div class=\"left-list-item\">\r\n\t\t\t\t\t\t\t\t\t\t<span class=\"title-list-nav\">Bottom</span>\r\n\t\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t\t\t<div class=\"bottom-custom-design-fields fields-padding-margin-ew\">\r\n\t\t\t\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\t\t\t<input name=\"margin_bottom\" [(ngModel)]=\"model?.meta_data.margin_bottom\" matInput placeholder=\"5px\">\r\n\t\t\t\t\t\t\t\t\t\t</mat-form-field>\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\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</div>\r\n</div> -->\r\n\r\n\r\n<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.SEPARATOR' | translate }}</span>\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 disabled value=\"advanced\">Advanced</mat-button-toggle> -->\r\n\t\t</mat-button-toggle-group>\r\n\t\t<!-- <div class=\"builder-resolution-change\">\r\n\t\t\t<button mat-button [matMenuTriggerFor]=\"menu6\">\r\n\t\t\t\t<mat-icon>\r\n\t\t\t\t\tlaptop\r\n\t\t\t\t</mat-icon>\r\n\t\t\t\t<span class=\"keyword-errow\">\r\n\t\t\t\t\t<mat-icon>keyboard_arrow_down</mat-icon>\r\n\t\t\t\t</span>\r\n\t\t\t</button>\r\n\t\t\t<mat-menu #menu6=\"matMenu\" class=\"builder-change-resolution-items\">\r\n\t\t\t\t<button mat-menu-item>\r\n\t\t\t\t\t<mat-icon>laptop</mat-icon>\r\n\t\t\t\t</button>\r\n\t\t\t\t<button mat-menu-item>\r\n\t\t\t\t\t<mat-icon>smartphone</mat-icon>\r\n\t\t\t\t</button>\r\n\t\t\t</mat-menu>\r\n\t\t</div> -->\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>\r\n\t\t\t\t\t\t</span> <!--(topMarginWebMobileBind && model.meta_data.mobile_margin_top = $event.value)-->\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\" *ngIf=\"(this.currentPreviewLayout=='mobile')\"> <!--padding-elements-30-top ew-mobile-property-bind [ngClass]=\"{'ew-mobile-bind-active' : topMarginWebMobileBind == false}\"-->\r\n                    <span class=\"builder-elements-name\">{{ 'BUILDER.ELEMENTS.MOBILE_MARGIN' | translate }}\r\n                        <!--<mat-icon (click)=\"topMarginWebMobileBind = false\" class=\"ew-on-property\">insert_link</mat-icon>\r\n                        <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\t-->\r\n\t\t\t\t\t</span>\r\n                    <div class=\"mat-slider-outer-part common-builder-right \"> <!--opacity-pointer-event-->\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\t\t\t</div>\r\n\t\t\t<!-- <div class=\"builder-elements-outer ew-mobile-elements ew-margin-bottom-20\">\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\r\n\t\t\t<div class=\"advance-title-sec-box\">\r\n\t\t\t\t<span class=\"title-advance-box\">{{ 'BUILDER.ELEMENTS.SEPARATOR' | translate }}</span>\r\n\t\t\t</div>\r\n\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.WIDTH' | translate }}</span>\r\n\t\t\t\t<div class=\"mat-slider-outer-part common-builder-right slider-2-digit\">\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.width\" (input)=\"model.meta_data.width = $event.value\"\r\n\t\t\t\t\t\t\tmin=\"10\" max=\"100\" step=\"10\">\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\">{{ model?.meta_data.width }}%</span>\r\n\t\t\t\t</div>\r\n\t\t\t\t<!-- <div class=\"common-builder-right\">\r\n\t\t\t\t\t<mat-form-field floatLabel=\"never\" class=\"ew-field-without-lebel\">\r\n\t\t\t\t\t\t<mat-select [(value)]=\"model?.meta_data.width\">\r\n\t\t\t\t\t\t\t<mat-option [value]=\"100\">100 Percent</mat-option>\r\n\t\t\t\t\t\t\t<mat-option [value]=\"90\">90 Percent</mat-option>\r\n\t\t\t\t\t\t\t<mat-option [value]=\"80\">80 Percent</mat-option>\r\n\t\t\t\t\t\t\t<mat-option [value]=\"75\">75 Percent</mat-option>\r\n\t\t\t\t\t\t\t<mat-option [value]=\"70\">70 Percent</mat-option>\r\n\t\t\t\t\t\t\t<mat-option [value]=\"60\">60 Percent</mat-option>\r\n\t\t\t\t\t\t\t<mat-option [value]=\"50\">50 Percent</mat-option>\r\n\t\t\t\t\t\t\t<mat-option [value]=\"40\">40 Percent</mat-option>\r\n\t\t\t\t\t\t\t<mat-option [value]=\"30\">30 Percent</mat-option>\r\n\t\t\t\t\t\t\t<mat-option [value]=\"25\">25 Percent</mat-option>\r\n\t\t\t\t\t\t\t<mat-option [value]=\"20\">20 Percent</mat-option>\r\n\t\t\t\t\t\t\t<mat-option [value]=\"10\">10 Percent</mat-option>\r\n\t\t\t\t\t\t</mat-select>\r\n\t\t\t\t\t</mat-form-field>\r\n\t\t\t\t</div> -->\r\n\t\t\t</div>\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.ALIGN' | translate }}</span>\r\n\t\t\t\t<div class=\"common-builder-right\">\r\n\t\t\t\t\t<mat-form-field floatLabel=\"never\" class=\"ew-field-without-lebel\">\r\n\t\t\t\t\t\t<mat-select [(value)]=\"model?.meta_data.align\">\r\n\t\t\t\t\t\t\t<mat-option value=\"left\">Left</mat-option>\r\n\t\t\t\t\t\t\t<mat-option value=\"center\">Center</mat-option>\r\n\t\t\t\t\t\t\t<mat-option value=\"right\">Right</mat-option>\r\n\t\t\t\t\t\t</mat-select>\r\n\t\t\t\t\t</mat-form-field>\r\n\t\t\t\t</div>\r\n\t\t\t</div>\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.HEIGHT' | translate }}</span>\r\n\t\t\t\t<div class=\"common-builder-right\">\r\n\t\t\t\t\t<mat-form-field floatLabel=\"never\" class=\"ew-field-without-lebel\">\r\n\t\t\t\t\t\t<mat-select [(value)]=\"model?.meta_data.height\">\r\n\t\t\t\t\t\t\t<mat-option [value]=\"1\">1px</mat-option>\r\n\t\t\t\t\t\t\t<mat-option [value]=\"2\">2px</mat-option>\r\n\t\t\t\t\t\t\t<mat-option [value]=\"3\">3px</mat-option>\r\n\t\t\t\t\t\t\t<mat-option [value]=\"5\">5px</mat-option>\r\n\t\t\t\t\t\t\t<mat-option [value]=\"10\">10px</mat-option>\r\n\t\t\t\t\t\t\t<mat-option [value]=\"15\">15px</mat-option>\r\n\t\t\t\t\t\t\t<mat-option [value]=\"20\">20px</mat-option>\r\n\t\t\t\t\t\t\t<mat-option [value]=\"25\">25px</mat-option>\r\n\t\t\t\t\t\t\t<mat-option [value]=\"30\">30px</mat-option>\r\n\t\t\t\t\t\t\t<mat-option [value]=\"40\">40px</mat-option>\r\n\t\t\t\t\t\t\t<mat-option [value]=\"50\">50px</mat-option>\r\n\t\t\t\t\t\t\t<mat-option [value]=\"60\">60px</mat-option>\r\n\t\t\t\t\t\t</mat-select>\r\n\t\t\t\t\t</mat-form-field>\r\n\t\t\t\t</div>\r\n\t\t\t</div>\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.STYLE' | translate }}</span>\r\n\t\t\t\t<div class=\"common-builder-right\">\r\n\t\t\t\t\t<mat-form-field floatLabel=\"never\" class=\"ew-field-without-lebel\">\r\n\t\t\t\t\t\t<mat-select [(value)]=\"model?.meta_data.line_style\">\r\n\t\t\t\t\t\t\t<mat-option value=\"solid\">Solid</mat-option>\r\n\t\t\t\t\t\t\t<mat-option value=\"dashed\">Dashed</mat-option>\r\n\t\t\t\t\t\t\t<mat-option value=\"dotted\">Dotted</mat-option>\r\n\t\t\t\t\t\t\t<mat-option value=\"double\">Double</mat-option>\r\n\t\t\t\t\t\t\t<mat-option value=\"groove\">Groove</mat-option>\r\n\t\t\t\t\t\t</mat-select>\r\n\t\t\t\t\t</mat-form-field>\r\n\t\t\t\t</div>\r\n\t\t\t</div>\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.COLOR' | translate }}</span>\r\n\t\t\t\t<div class=\"common-builder-right\">\r\n\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<input matInput type=\"text\"\r\n\t\t\t\t\t\t\t[cpPosition]=\"'top'\"\r\n\t\t\t\t\t\t\t[cpOutputFormat]=\"'rgba'\"\r\n\t\t\t\t\t\t\t[colorPicker]=\"model?.meta_data.line_color\"\r\n\t\t\t\t\t\t\t(colorPickerChange)=\"model.meta_data.line_color=$event\"\r\n\t\t\t\t\t\t\t[(ngModel)]=\"model?.meta_data.line_color\" />\r\n\t\t\t\t\t\t<span class=\"color-picker-box\"\r\n\t\t\t\t\t\t[ngClass]=\"{'transparent-color-ew': (model.meta_data?.line_color.slice(-2,-1) == '0') }\"\r\n\t\t\t\t\t\t\t[style.background-color]=\"model?.meta_data.line_color\"></span>\r\n\t\t\t\t\t</mat-form-field>\r\n\t\t\t\t</div>\r\n\t\t\t</div>\r\n\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_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=\"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_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]=\"'bottom'\"\r\n\t\t\t\t\t\t\t\t[cpOutputFormat]=\"'rgba'\"\r\n\t\t\t\t\t\t\t\t[cpAlphaChannel]=\"'disabled'\"\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</div>\r\n\r\n\t</div>\r\n</div>\r\n",
            styles: [""]
        })
    ], LineSidebarComponent);
    return LineSidebarComponent;
}());
export { LineSidebarComponent };
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibGluZS1zaWRlYmFyLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiJuZzovL2V3LW1hLWRlc2lnbi8iLCJzb3VyY2VzIjpbImxpYi9jb21wb25lbnRzL2VsZW1lbnRzL2xpbmUtc2lkZWJhci9saW5lLXNpZGViYXIuY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFVLEtBQUssRUFBRSxNQUFNLEVBQUUsWUFBWSxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBTy9FO0lBdUNFO1FBckNPLHlCQUFvQixHQUFVLFNBQVMsQ0FBQztRQXdCL0IsZ0JBQVcsR0FBUSxFQUFFLENBQUM7UUFFNUIsdUJBQWtCLEdBQXNCLElBQUksWUFBWSxFQUFFLENBQUM7UUFDckU7OztXQUdHO1FBQ08sZ0JBQVcsR0FBc0IsSUFBSSxZQUFZLEVBQUUsQ0FBQztRQUVwRCx3QkFBbUIsR0FBc0IsSUFBSSxZQUFZLEVBQUUsQ0FBQztRQUUvRCwyQkFBc0IsR0FBVyxJQUFJLENBQUM7SUFFOUIsQ0FBQztJQUVoQix1Q0FBUSxHQUFSLGNBQWtCLENBQUM7SUFFbkIsMENBQVcsR0FBWDtRQUNFLElBQUksQ0FBQyxXQUFXLENBQUMsSUFBSSxFQUFFLENBQUM7SUFDMUIsQ0FBQztJQUVELDBDQUFXLEdBQVgsVUFBWSxJQUFZO1FBQ3RCLElBQUksQ0FBQyxrQkFBa0IsQ0FBQyxJQUFJLEVBQUUsQ0FBQztJQUNqQyxDQUFDO0lBQ0Q7O09BRUc7SUFDRix3Q0FBUyxHQUFUO1FBQ0MsSUFBSSxDQUFDLG9CQUFvQixHQUFHLFlBQVksQ0FBQyxPQUFPLENBQUMsc0JBQXNCLENBQUMsQ0FBQztJQUMzRSxDQUFDO0lBRUQsbURBQW9CLEdBQXBCLFVBQXFCLElBQVE7UUFDM0Isc0NBQXNDO0lBQ3hDLENBQUM7SUF2RFE7UUFBUixLQUFLLEVBQUU7dURBb0JOO0lBRU87UUFBUixLQUFLLEVBQUU7NkRBQThCO0lBRTVCO1FBQVQsTUFBTSxFQUFFO29FQUE0RDtJQUszRDtRQUFULE1BQU0sRUFBRTs2REFBcUQ7SUFFcEQ7UUFBVCxNQUFNLEVBQUU7cUVBQTZEO0lBbkMzRCxvQkFBb0I7UUFMaEMsU0FBUyxDQUFDO1lBQ1QsUUFBUSxFQUFFLHlCQUF5QjtZQUNuQywyaXdCQUE0Qzs7U0FFN0MsQ0FBQztPQUNXLG9CQUFvQixDQTZEaEM7SUFBRCwyQkFBQztDQUFBLEFBN0RELElBNkRDO1NBN0RZLG9CQUFvQiIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgT25Jbml0LCBJbnB1dCwgT3V0cHV0LCBFdmVudEVtaXR0ZXIgfSBmcm9tIFwiQGFuZ3VsYXIvY29yZVwiO1xyXG5cclxuQENvbXBvbmVudCh7XHJcbiAgc2VsZWN0b3I6ICdldy1lbGVtZW50LWxpbmUtc2lkZWJhcicsXHJcbiAgdGVtcGxhdGVVcmw6ICcuL2xpbmUtc2lkZWJhci5jb21wb25lbnQuaHRtbCcsXHJcbiAgc3R5bGVVcmxzOiBbJy4vbGluZS1zaWRlYmFyLmNvbXBvbmVudC5zY3NzJ11cclxufSlcclxuZXhwb3J0IGNsYXNzIExpbmVTaWRlYmFyQ29tcG9uZW50IGltcGxlbWVudHMgT25Jbml0IHtcclxuXHJcbiAgcHVibGljIGN1cnJlbnRQcmV2aWV3TGF5b3V0OnN0cmluZyA9IFwiZGVza3RvcFwiO1xyXG5cclxuICBASW5wdXQoKSBwdWJsaWMgbW9kZWw6IHtcclxuICAgIGZvY3VzZWQ6IGJvb2xlYW4sXHJcbiAgICB0eXBlOiBzdHJpbmcsXHJcbiAgICBtZXRhX2RhdGE6IHtcclxuICAgICAgaGVpZ2h0OiBudW1iZXIsXHJcbiAgICAgIGxpbmVfY29sb3I6IHN0cmluZyxcclxuICAgICAgbGluZV9zdHlsZTogc3RyaW5nLFxyXG4gICAgICBtYXJnaW5fdG9wOiBudW1iZXIsXHJcbiAgICAgIG1vYmlsZV9tYXJnaW5fdG9wOiBudW1iZXIsXHJcbiAgICAgIHBhZGRpbmdfdG9wOiBudW1iZXIsXHJcbiAgICAgIHBhZGRpbmdfcmlnaHQ6IG51bWJlcixcclxuICAgICAgcGFkZGluZ19ib3R0b206IG51bWJlcixcclxuICAgICAgcGFkZGluZ19sZWZ0OiBudW1iZXIsXHJcbiAgICAgIHdpZHRoOiBudW1iZXIsXHJcbiAgICAgIGFsaWduOiBzdHJpbmcsXHJcbiAgICAgIGJvcmRlcl9yYWRpdXM6IG51bWJlcixcclxuICAgICAga2V5OiBzdHJpbmcsXHJcbiAgICAgIHR5cGU6IHN0cmluZyxcclxuICAgICAgdW5pcXVlX2NsYXNzOiBzdHJpbmdcclxuICAgIH1cclxuICB9O1xyXG4gIFxyXG4gIEBJbnB1dCgpIHB1YmxpYyBzaG93QmFja0ZvcjpzdHJpbmc9Jyc7XHJcblxyXG4gIEBPdXRwdXQoKSBvblNpZGViYXJCYWNrQ2xpY2s6IEV2ZW50RW1pdHRlcjxhbnk+ID0gbmV3IEV2ZW50RW1pdHRlcigpOyBcclxuICAvKipcclxuICAgKiBAZGVzY3JpcHRpb25cclxuICAgKiBFbWl0IGV2ZW50IHRvIERvbmUgQ2xpY2suXHJcbiAgICovXHJcbiAgQE91dHB1dCgpIG9uRG9uZUNsaWNrOiBFdmVudEVtaXR0ZXI8YW55PiA9IG5ldyBFdmVudEVtaXR0ZXIoKTtcclxuXHJcbiAgQE91dHB1dCgpIGNhbGxQYXJlbnRDb250YWluZXI6IEV2ZW50RW1pdHRlcjxhbnk+ID0gbmV3IEV2ZW50RW1pdHRlcigpO1xyXG5cclxuICBwdWJsaWMgdG9wTWFyZ2luV2ViTW9iaWxlQmluZDpib29sZWFuID0gdHJ1ZTtcclxuXHJcbiAgY29uc3RydWN0b3IoKSB7fVxyXG5cclxuICBuZ09uSW5pdCgpOiB2b2lkIHt9XHJcblxyXG4gIGNsb3NlQ29uZmlnKCk6IHZvaWQge1xyXG4gICAgdGhpcy5vbkRvbmVDbGljay5lbWl0KCk7XHJcbiAgfVxyXG5cclxuICBzaWRlYmFyQmFjayh0eXBlPzpzdHJpbmcpOiB2b2lkIHsgICAgXHJcbiAgICB0aGlzLm9uU2lkZWJhckJhY2tDbGljay5lbWl0KCk7ICAgIFxyXG4gIH1cclxuICAvKipcclxuICAgKiBEbyBDaGVjayBldmVudFxyXG4gICAqL1xyXG4gICBuZ0RvQ2hlY2soKSB7XHJcbiAgICB0aGlzLmN1cnJlbnRQcmV2aWV3TGF5b3V0ID0gbG9jYWxTdG9yYWdlLmdldEl0ZW0oJ2N1cnJlbnRQcmV2aWV3TGF5b3V0Jyk7XHJcbiAgfVxyXG4gIFxyXG4gIGNhbGxFbGVtZW50Q29udGFpbmVyKGRhdGE6YW55KTp2b2lke1xyXG4gICAgLy90aGlzLmNhbGxQYXJlbnRDb250YWluZXIuZW1pdChkYXRhKTtcclxuICB9XHJcblxyXG59XHJcbiJdfQ==