@pepperi-addons/ngx-composite-lib 0.4.2-beta.194 → 0.4.2-beta.197

package/fesm2020/pepperi-addons-ngx-composite-lib-padding-settings.mjs

@@ -92,7 +92,7 @@ class PaddingSettingsComponent {
     }
 }
 PaddingSettingsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PaddingSettingsComponent, deps: [{ token: i1.TranslateService }], target: i0.ɵɵFactoryTarget.Component });
-PaddingSettingsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: PaddingSettingsComponent, selector: "pep-padding-settings", inputs: { padding: "padding" }, outputs: { paddingChange: "paddingChange" }, ngImport: i0, template: "<div>\n    <label class=\"body-xl bold ellipsis title\">{{'PADDING_SETTINGS.TITLE' | translate}}</label>\n    <pep-checkbox \n        class=\"checkbox-as-sub-title\"\n        [label]=\"'PADDING_SETTINGS.UNIFORM' | translate\" \n        [renderTitle]=\"false\" \n        [value]=\"padding?.IsUniform || false\" \n        (valueChange)=\"onUniformChanged($event)\">\n    </pep-checkbox>\n    <div class=\"paddingValueCont\">\n        <pep-textbox *ngIf=\"padding?.IsUniform\"\n            type=\"real\"\n            [label]=\"'PADDING_SETTINGS.DESCRIPTION' | translate\" \n            [value]=\"padding?.PaddingValue || '0'\" \n            (valueChange)=\"onPaddingChanged($event, 'uniform')\">\n        </pep-textbox>\n        <pep-textbox *ngIf=\"!padding?.IsUniform\" \n            type=\"real\"\n            [renderSymbol]=\"false\"\n            [label]=\"'PADDING_SETTINGS.TOP' | translate\" \n            [value]=\"topPaddingValue || '0'\" \n            (valueChange)=\"onPaddingChanged($event, 'top')\">\n        </pep-textbox>\n        <pep-textbox *ngIf=\"!padding?.IsUniform\"\n            type=\"real\"\n            [renderSymbol]=\"false\"\n            [label]=\"'PADDING_SETTINGS.END' | translate\" \n            [value]=\"endPaddingValue || '0'\" \n            (valueChange)=\"onPaddingChanged($event, 'end')\">\n        </pep-textbox>\n        <pep-textbox *ngIf=\"!padding?.IsUniform\"\n            type=\"real\"\n            [renderSymbol]=\"false\"\n            [label]=\"'PADDING_SETTINGS.BOTTOM' | translate\" \n            [value]=\"bottomPaddingValue || '0'\" \n            (valueChange)=\"onPaddingChanged($event, 'bottom')\">\n        </pep-textbox>\n        <pep-textbox *ngIf=\"!padding?.IsUniform\"\n            type=\"real\"\n            [renderSymbol]=\"false\"\n            [label]=\"'PADDING_SETTINGS.START' | translate\" \n            [value]=\"startPaddingValue || '0'\"\n            (valueChange)=\"onPaddingChanged($event, 'start')\">\n        </pep-textbox>\n    </div>\n</div>", styles: [":host{width:100%;display:grid}:host label{margin-bottom:0}pep-checkbox ::ng-deep .mat-checkbox-inner-container{width:1.25rem;height:1.25rem}.paddingValueCont{display:grid;column-gap:var(--pep-spacing-sm, .5rem);grid-auto-flow:column}.paddingValueCont ::ng-deep .mat-form-field-flex{padding-inline:.5rem}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.PepCheckboxComponent, selector: "pep-checkbox", inputs: ["key", "value", "label", "type", "mandatory", "disabled", "readonly", "xAlignment", "rowSpan", "additionalValue", "form", "isActive", "showTitle", "renderTitle", "layoutType", "visible"], outputs: ["valueChange", "validationChange"] }, { kind: "component", type: i4.PepTextboxComponent, selector: "pep-textbox", inputs: ["key", "value", "minFractionDigits", "maxFractionDigits", "accessory", "label", "placeholder", "type", "mandatory", "disabled", "readonly", "maxFieldCharacters", "hint", "textColor", "xAlignment", "rowSpan", "minValue", "maxValue", "visible", "form", "isActive", "showTitle", "renderTitle", "renderError", "renderSymbol", "layoutType", "parentFieldKey", "regex", "regexError", "isInFocus"], outputs: ["valueChange", "keyup", "validationChange"] }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] });
+PaddingSettingsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: PaddingSettingsComponent, selector: "pep-padding-settings", inputs: { padding: "padding" }, outputs: { paddingChange: "paddingChange" }, ngImport: i0, template: "<div>\n    <label class=\"body-xl bold ellipsis title\">{{'PADDING_SETTINGS.TITLE' | translate}}</label>\n    <pep-checkbox \n        class=\"checkbox-as-sub-title\"\n        [label]=\"'PADDING_SETTINGS.UNIFORM' | translate\" \n        [renderTitle]=\"false\" \n        [value]=\"padding?.IsUniform || false\" \n        (valueChange)=\"onUniformChanged($event)\">\n    </pep-checkbox>\n    <div class=\"paddingValueCont\">\n        <pep-textbox *ngIf=\"padding?.IsUniform\"\n            type=\"real\"\n            [label]=\"'PADDING_SETTINGS.DESCRIPTION' | translate\" \n            [value]=\"padding?.PaddingValue || '0'\" \n            (valueChange)=\"onPaddingChanged($event, 'uniform')\">\n        </pep-textbox>\n        <pep-textbox *ngIf=\"!padding?.IsUniform\" \n            type=\"real\"\n            [renderSymbol]=\"false\"\n            [label]=\"'PADDING_SETTINGS.TOP' | translate\" \n            [value]=\"topPaddingValue || '0'\" \n            (valueChange)=\"onPaddingChanged($event, 'top')\">\n        </pep-textbox>\n        <pep-textbox *ngIf=\"!padding?.IsUniform\"\n            type=\"real\"\n            [renderSymbol]=\"false\"\n            [label]=\"'PADDING_SETTINGS.END' | translate\" \n            [value]=\"endPaddingValue || '0'\" \n            (valueChange)=\"onPaddingChanged($event, 'end')\">\n        </pep-textbox>\n        <pep-textbox *ngIf=\"!padding?.IsUniform\"\n            type=\"real\"\n            [renderSymbol]=\"false\"\n            [label]=\"'PADDING_SETTINGS.BOTTOM' | translate\" \n            [value]=\"bottomPaddingValue || '0'\" \n            (valueChange)=\"onPaddingChanged($event, 'bottom')\">\n        </pep-textbox>\n        <pep-textbox *ngIf=\"!padding?.IsUniform\"\n            type=\"real\"\n            [renderSymbol]=\"false\"\n            [label]=\"'PADDING_SETTINGS.START' | translate\" \n            [value]=\"startPaddingValue || '0'\"\n            (valueChange)=\"onPaddingChanged($event, 'start')\">\n        </pep-textbox>\n    </div>\n</div>", styles: [":host{width:100%;display:grid}:host label{margin-bottom:0}pep-checkbox ::ng-deep .mat-checkbox-inner-container{width:1.25rem;height:1.25rem}.paddingValueCont{display:grid;column-gap:var(--pep-spacing-sm, .5rem);grid-auto-flow:column}.paddingValueCont ::ng-deep .mat-form-field-flex{padding-inline:.5rem}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.PepCheckboxComponent, selector: "pep-checkbox", inputs: ["key", "value", "label", "id", "type", "mandatory", "disabled", "readonly", "xAlignment", "rowSpan", "additionalValue", "form", "isActive", "showTitle", "renderTitle", "layoutType", "visible"], outputs: ["valueChange", "validationChange"] }, { kind: "component", type: i4.PepTextboxComponent, selector: "pep-textbox", inputs: ["key", "value", "minFractionDigits", "maxFractionDigits", "accessory", "label", "placeholder", "type", "mandatory", "disabled", "readonly", "maxFieldCharacters", "hint", "textColor", "xAlignment", "rowSpan", "minValue", "maxValue", "visible", "form", "isActive", "showTitle", "renderTitle", "renderError", "renderSymbol", "layoutType", "parentFieldKey", "regex", "regexError", "isInFocus"], outputs: ["valueChange", "keyup", "validationChange"] }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PaddingSettingsComponent, decorators: [{
             type: Component,
             args: [{ selector: 'pep-padding-settings', template: "<div>\n    <label class=\"body-xl bold ellipsis title\">{{'PADDING_SETTINGS.TITLE' | translate}}</label>\n    <pep-checkbox \n        class=\"checkbox-as-sub-title\"\n        [label]=\"'PADDING_SETTINGS.UNIFORM' | translate\" \n        [renderTitle]=\"false\" \n        [value]=\"padding?.IsUniform || false\" \n        (valueChange)=\"onUniformChanged($event)\">\n    </pep-checkbox>\n    <div class=\"paddingValueCont\">\n        <pep-textbox *ngIf=\"padding?.IsUniform\"\n            type=\"real\"\n            [label]=\"'PADDING_SETTINGS.DESCRIPTION' | translate\" \n            [value]=\"padding?.PaddingValue || '0'\" \n            (valueChange)=\"onPaddingChanged($event, 'uniform')\">\n        </pep-textbox>\n        <pep-textbox *ngIf=\"!padding?.IsUniform\" \n            type=\"real\"\n            [renderSymbol]=\"false\"\n            [label]=\"'PADDING_SETTINGS.TOP' | translate\" \n            [value]=\"topPaddingValue || '0'\" \n            (valueChange)=\"onPaddingChanged($event, 'top')\">\n        </pep-textbox>\n        <pep-textbox *ngIf=\"!padding?.IsUniform\"\n            type=\"real\"\n            [renderSymbol]=\"false\"\n            [label]=\"'PADDING_SETTINGS.END' | translate\" \n            [value]=\"endPaddingValue || '0'\" \n            (valueChange)=\"onPaddingChanged($event, 'end')\">\n        </pep-textbox>\n        <pep-textbox *ngIf=\"!padding?.IsUniform\"\n            type=\"real\"\n            [renderSymbol]=\"false\"\n            [label]=\"'PADDING_SETTINGS.BOTTOM' | translate\" \n            [value]=\"bottomPaddingValue || '0'\" \n            (valueChange)=\"onPaddingChanged($event, 'bottom')\">\n        </pep-textbox>\n        <pep-textbox *ngIf=\"!padding?.IsUniform\"\n            type=\"real\"\n            [renderSymbol]=\"false\"\n            [label]=\"'PADDING_SETTINGS.START' | translate\" \n            [value]=\"startPaddingValue || '0'\"\n            (valueChange)=\"onPaddingChanged($event, 'start')\">\n        </pep-textbox>\n    </div>\n</div>", styles: [":host{width:100%;display:grid}:host label{margin-bottom:0}pep-checkbox ::ng-deep .mat-checkbox-inner-container{width:1.25rem;height:1.25rem}.paddingValueCont{display:grid;column-gap:var(--pep-spacing-sm, .5rem);grid-auto-flow:column}.paddingValueCont ::ng-deep .mat-form-field-flex{padding-inline:.5rem}\n"] }]

package/fesm2020/pepperi-addons-ngx-composite-lib-padding-settings.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"pepperi-addons-ngx-composite-lib-padding-settings.mjs","sources":["../../../projects/ngx-composite-lib/padding-settings/padding-settings.model.ts","../../../projects/ngx-composite-lib/padding-settings/padding-settings.component.ts","../../../projects/ngx-composite-lib/padding-settings/padding-settings.component.html","../../../projects/ngx-composite-lib/padding-settings/padding-settings.module.ts","../../../projects/ngx-composite-lib/padding-settings/public-api.ts","../../../projects/ngx-composite-lib/padding-settings/pepperi-addons-ngx-composite-lib-padding-settings.ts"],"sourcesContent":["import { PepSizeType } from \"@pepperi-addons/ngx-lib\";\r\n\r\nexport class PepPaddingSettings {\r\n    IsUniform: boolean;\r\n    PaddingValue: string;\r\n\r\n    constructor(isUniform = true, paddingValue = '0'){\r\n        this.IsUniform = isUniform;\r\n        this.PaddingValue = paddingValue;\r\n    }\r\n}","import { Component, EventEmitter, Input, Output } from '@angular/core';\nimport { TranslateService } from '@ngx-translate/core';\nimport { PepPaddingSettings } from './padding-settings.model';\n\n@Component({\n    selector: 'pep-padding-settings',\n    templateUrl: './padding-settings.component.html',\n    styleUrls: ['./padding-settings.component.scss']\n})\n\nexport class PaddingSettingsComponent  {\n\n    public startPaddingValue = '0';\n    public endPaddingValue = '0';\n    public topPaddingValue = '0';\n    public bottomPaddingValue = '0';\n\n    private _padding: PepPaddingSettings = new PepPaddingSettings();\n    @Input()\n    set padding(value: PepPaddingSettings) {\n        if (!value) {\n            this._padding = new PepPaddingSettings();\n        } else {\n            this._padding = value;\n        }\n        this.formatPaddingValue();\n    }\n    get padding(): PepPaddingSettings {\n        return this._padding;\n    }\n\n    @Output()\n    paddingChange: EventEmitter<PepPaddingSettings> = new EventEmitter<PepPaddingSettings>();\n\n    constructor(\n        private translate: TranslateService,\n    ) {\n       \n    }\n\n    private raisePaddingChange() {\n        this.paddingChange.emit(this.padding);\n    }\n\n    onUniformChanged(value: boolean) {\n        this.padding.IsUniform = value;\n        this.formatPaddingValue();\n        this.raisePaddingChange();\n    }\n\n    formatPaddingValue() {\n        if(this.padding.IsUniform){ \n            this.padding.PaddingValue = this.padding.PaddingValue.split(',')[0];\n         } \n         else{\n            if(isNaN(Number(this.padding.PaddingValue))){\n                const num = this.padding.PaddingValue.split(',') || ['0','0','0','0'];\n                this.topPaddingValue = num[0];\n                this.endPaddingValue = num[1];\n                this.bottomPaddingValue = num[2];\n                this.startPaddingValue = num[3];\n            }\n            else{\n                this.topPaddingValue = this.endPaddingValue = this.bottomPaddingValue = this.startPaddingValue = this.padding.PaddingValue;\n            }\n            \n            this.padding.PaddingValue = `${this.topPaddingValue},${this.endPaddingValue},${this.bottomPaddingValue},${this.startPaddingValue}`;\n         } \n    }\n\n    onPaddingChanged(value: any, uniformPos: string) {\n        if(!this.padding.IsUniform){\n            switch(uniformPos){\n                case 'top':\n                    this.topPaddingValue = value;\n                    break;\n                case 'end':\n                    this.endPaddingValue = value;\n                    break;\n                case 'bottom':\n                    this.bottomPaddingValue = value;\n                    break;\n                case 'start':\n                    this.startPaddingValue = value;\n                    break;\n            }\n           this.padding.PaddingValue = `${this.topPaddingValue},${this.endPaddingValue},${this.bottomPaddingValue},${this.startPaddingValue}`;\n        }\n        else{\n            this.padding.PaddingValue = `${value}`;\n        }\n        this.raisePaddingChange();\n    }\n}\n","<div>\n    <label class=\"body-xl bold ellipsis title\">{{'PADDING_SETTINGS.TITLE' | translate}}</label>\n    <pep-checkbox \n        class=\"checkbox-as-sub-title\"\n        [label]=\"'PADDING_SETTINGS.UNIFORM' | translate\" \n        [renderTitle]=\"false\" \n        [value]=\"padding?.IsUniform || false\" \n        (valueChange)=\"onUniformChanged($event)\">\n    </pep-checkbox>\n    <div class=\"paddingValueCont\">\n        <pep-textbox *ngIf=\"padding?.IsUniform\"\n            type=\"real\"\n            [label]=\"'PADDING_SETTINGS.DESCRIPTION' | translate\" \n            [value]=\"padding?.PaddingValue || '0'\" \n            (valueChange)=\"onPaddingChanged($event, 'uniform')\">\n        </pep-textbox>\n        <pep-textbox *ngIf=\"!padding?.IsUniform\" \n            type=\"real\"\n            [renderSymbol]=\"false\"\n            [label]=\"'PADDING_SETTINGS.TOP' | translate\" \n            [value]=\"topPaddingValue || '0'\" \n            (valueChange)=\"onPaddingChanged($event, 'top')\">\n        </pep-textbox>\n        <pep-textbox *ngIf=\"!padding?.IsUniform\"\n            type=\"real\"\n            [renderSymbol]=\"false\"\n            [label]=\"'PADDING_SETTINGS.END' | translate\" \n            [value]=\"endPaddingValue || '0'\" \n            (valueChange)=\"onPaddingChanged($event, 'end')\">\n        </pep-textbox>\n        <pep-textbox *ngIf=\"!padding?.IsUniform\"\n            type=\"real\"\n            [renderSymbol]=\"false\"\n            [label]=\"'PADDING_SETTINGS.BOTTOM' | translate\" \n            [value]=\"bottomPaddingValue || '0'\" \n            (valueChange)=\"onPaddingChanged($event, 'bottom')\">\n        </pep-textbox>\n        <pep-textbox *ngIf=\"!padding?.IsUniform\"\n            type=\"real\"\n            [renderSymbol]=\"false\"\n            [label]=\"'PADDING_SETTINGS.START' | translate\" \n            [value]=\"startPaddingValue || '0'\"\n            (valueChange)=\"onPaddingChanged($event, 'start')\">\n        </pep-textbox>\n    </div>\n</div>","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { PaddingSettingsComponent } from './padding-settings.component';\nimport { PepNgxLibModule } from '@pepperi-addons/ngx-lib';\nimport { PepCheckboxModule } from '@pepperi-addons/ngx-lib/checkbox';\nimport { PepTextboxModule } from '@pepperi-addons/ngx-lib/textbox';\nimport { PepFieldTitleModule } from '@pepperi-addons/ngx-lib/field-title';\nimport { PepGroupButtonsModule } from '@pepperi-addons/ngx-lib/group-buttons';\nimport { PepSliderModule } from '@pepperi-addons/ngx-lib/slider';\n\n@NgModule({\n    declarations: [\n        PaddingSettingsComponent\n    ],\n    imports: [\n        CommonModule,\n        PepNgxLibModule,\n        PepCheckboxModule,\n        PepTextboxModule,\n        PepFieldTitleModule,\n        PepGroupButtonsModule,\n        PepSliderModule\n    ],\n    exports: [PaddingSettingsComponent],\n})\nexport class PepPaddingSettingsModule { }\n","/*\n * Public API Surface of ngx-composite-lib/padding-settings\n */\nexport * from './padding-settings.module';\nexport * from './padding-settings.component';\nexport * from './padding-settings.model';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"pepperi-addons-ngx-composite-lib-padding-settings.mjs","sources":["../../../projects/ngx-composite-lib/padding-settings/padding-settings.model.ts","../../../projects/ngx-composite-lib/padding-settings/padding-settings.component.ts","../../../projects/ngx-composite-lib/padding-settings/padding-settings.component.html","../../../projects/ngx-composite-lib/padding-settings/padding-settings.module.ts","../../../projects/ngx-composite-lib/padding-settings/public-api.ts","../../../projects/ngx-composite-lib/padding-settings/pepperi-addons-ngx-composite-lib-padding-settings.ts"],"sourcesContent":["import { PepSizeType } from \"@pepperi-addons/ngx-lib\";\r\n\r\nexport class PepPaddingSettings {\r\n    IsUniform: boolean;\r\n    PaddingValue: string;\r\n\r\n    constructor(isUniform = true, paddingValue = '0'){\r\n        this.IsUniform = isUniform;\r\n        this.PaddingValue = paddingValue;\r\n    }\r\n}","import { Component, EventEmitter, Input, Output } from '@angular/core';\nimport { TranslateService } from '@ngx-translate/core';\nimport { PepPaddingSettings } from './padding-settings.model';\n\n@Component({\n    selector: 'pep-padding-settings',\n    templateUrl: './padding-settings.component.html',\n    styleUrls: ['./padding-settings.component.scss']\n})\n\nexport class PaddingSettingsComponent  {\n\n    public startPaddingValue = '0';\n    public endPaddingValue = '0';\n    public topPaddingValue = '0';\n    public bottomPaddingValue = '0';\n\n    private _padding: PepPaddingSettings = new PepPaddingSettings();\n    @Input()\n    set padding(value: PepPaddingSettings) {\n        if (!value) {\n            this._padding = new PepPaddingSettings();\n        } else {\n            this._padding = value;\n        }\n        this.formatPaddingValue();\n    }\n    get padding(): PepPaddingSettings {\n        return this._padding;\n    }\n\n    @Output()\n    paddingChange: EventEmitter<PepPaddingSettings> = new EventEmitter<PepPaddingSettings>();\n\n    constructor(\n        private translate: TranslateService,\n    ) {\n       \n    }\n\n    private raisePaddingChange() {\n        this.paddingChange.emit(this.padding);\n    }\n\n    onUniformChanged(value: boolean) {\n        this.padding.IsUniform = value;\n        this.formatPaddingValue();\n        this.raisePaddingChange();\n    }\n\n    formatPaddingValue() {\n        if(this.padding.IsUniform){ \n            this.padding.PaddingValue = this.padding.PaddingValue.split(',')[0];\n         } \n         else{\n            if(isNaN(Number(this.padding.PaddingValue))){\n                const num = this.padding.PaddingValue.split(',') || ['0','0','0','0'];\n                this.topPaddingValue = num[0];\n                this.endPaddingValue = num[1];\n                this.bottomPaddingValue = num[2];\n                this.startPaddingValue = num[3];\n            }\n            else{\n                this.topPaddingValue = this.endPaddingValue = this.bottomPaddingValue = this.startPaddingValue = this.padding.PaddingValue;\n            }\n            \n            this.padding.PaddingValue = `${this.topPaddingValue},${this.endPaddingValue},${this.bottomPaddingValue},${this.startPaddingValue}`;\n         } \n    }\n\n    onPaddingChanged(value: any, uniformPos: string) {\n        if(!this.padding.IsUniform){\n            switch(uniformPos){\n                case 'top':\n                    this.topPaddingValue = value;\n                    break;\n                case 'end':\n                    this.endPaddingValue = value;\n                    break;\n                case 'bottom':\n                    this.bottomPaddingValue = value;\n                    break;\n                case 'start':\n                    this.startPaddingValue = value;\n                    break;\n            }\n           this.padding.PaddingValue = `${this.topPaddingValue},${this.endPaddingValue},${this.bottomPaddingValue},${this.startPaddingValue}`;\n        }\n        else{\n            this.padding.PaddingValue = `${value}`;\n        }\n        this.raisePaddingChange();\n    }\n}\n","<div>\n    <label class=\"body-xl bold ellipsis title\">{{'PADDING_SETTINGS.TITLE' | translate}}</label>\n    <pep-checkbox \n        class=\"checkbox-as-sub-title\"\n        [label]=\"'PADDING_SETTINGS.UNIFORM' | translate\" \n        [renderTitle]=\"false\" \n        [value]=\"padding?.IsUniform || false\" \n        (valueChange)=\"onUniformChanged($event)\">\n    </pep-checkbox>\n    <div class=\"paddingValueCont\">\n        <pep-textbox *ngIf=\"padding?.IsUniform\"\n            type=\"real\"\n            [label]=\"'PADDING_SETTINGS.DESCRIPTION' | translate\" \n            [value]=\"padding?.PaddingValue || '0'\" \n            (valueChange)=\"onPaddingChanged($event, 'uniform')\">\n        </pep-textbox>\n        <pep-textbox *ngIf=\"!padding?.IsUniform\" \n            type=\"real\"\n            [renderSymbol]=\"false\"\n            [label]=\"'PADDING_SETTINGS.TOP' | translate\" \n            [value]=\"topPaddingValue || '0'\" \n            (valueChange)=\"onPaddingChanged($event, 'top')\">\n        </pep-textbox>\n        <pep-textbox *ngIf=\"!padding?.IsUniform\"\n            type=\"real\"\n            [renderSymbol]=\"false\"\n            [label]=\"'PADDING_SETTINGS.END' | translate\" \n            [value]=\"endPaddingValue || '0'\" \n            (valueChange)=\"onPaddingChanged($event, 'end')\">\n        </pep-textbox>\n        <pep-textbox *ngIf=\"!padding?.IsUniform\"\n            type=\"real\"\n            [renderSymbol]=\"false\"\n            [label]=\"'PADDING_SETTINGS.BOTTOM' | translate\" \n            [value]=\"bottomPaddingValue || '0'\" \n            (valueChange)=\"onPaddingChanged($event, 'bottom')\">\n        </pep-textbox>\n        <pep-textbox *ngIf=\"!padding?.IsUniform\"\n            type=\"real\"\n            [renderSymbol]=\"false\"\n            [label]=\"'PADDING_SETTINGS.START' | translate\" \n            [value]=\"startPaddingValue || '0'\"\n            (valueChange)=\"onPaddingChanged($event, 'start')\">\n        </pep-textbox>\n    </div>\n</div>","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { PaddingSettingsComponent } from './padding-settings.component';\nimport { PepNgxLibModule } from '@pepperi-addons/ngx-lib';\nimport { PepCheckboxModule } from '@pepperi-addons/ngx-lib/checkbox';\nimport { PepTextboxModule } from '@pepperi-addons/ngx-lib/textbox';\nimport { PepFieldTitleModule } from '@pepperi-addons/ngx-lib/field-title';\nimport { PepGroupButtonsModule } from '@pepperi-addons/ngx-lib/group-buttons';\nimport { PepSliderModule } from '@pepperi-addons/ngx-lib/slider';\n\n@NgModule({\n    declarations: [\n        PaddingSettingsComponent\n    ],\n    imports: [\n        CommonModule,\n        PepNgxLibModule,\n        PepCheckboxModule,\n        PepTextboxModule,\n        PepFieldTitleModule,\n        PepGroupButtonsModule,\n        PepSliderModule\n    ],\n    exports: [PaddingSettingsComponent],\n})\nexport class PepPaddingSettingsModule { }\n","/*\n * Public API Surface of ngx-composite-lib/padding-settings\n */\nexport * from './padding-settings.module';\nexport * from './padding-settings.component';\nexport * from './padding-settings.model';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2020/pepperi-addons-ngx-composite-lib-shadow-settings.mjs

@@ -72,7 +72,7 @@ class ShadowSettingsComponent {
     }
 }
 ShadowSettingsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: ShadowSettingsComponent, deps: [{ token: i1.TranslateService }], target: i0.ɵɵFactoryTarget.Component });
-ShadowSettingsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: ShadowSettingsComponent, selector: "pep-shadow-settings", inputs: { titleSize: "titleSize", shadow: "shadow" }, outputs: { shadowChange: "shadowChange" }, ngImport: i0, template: "<div>\n    <pep-checkbox \n        class=\"{{ titleSize === 'xl' ? 'checkbox-as-title' : 'checkbox-as-sub-title' }}\" \n        [label]=\"'SHADOW_SETTINGS.TITLE' | translate\" [renderTitle]=\"false\" [value]=\"shadow.use\" (valueChange)=\"onUseChanged($event)\"></pep-checkbox>\n    <pep-field-title [label]=\"'SHADOW_SETTINGS.SIZE' | translate\" [disabled]=\"!shadow.use\"></pep-field-title>\n    <pep-group-buttons class=\"shadow-size-group\" [buttons]=\"shadowSizes\" [selectedButtonKey]=\"shadow.size\" [stretch]=\"true\" buttonsClass=\"md regular\" [buttonsDisabled]=\"!shadow.use\" viewType=\"toggle\">\n    </pep-group-buttons>\n</div>\n<div>\n    <pep-field-title [label]=\"'SHADOW_SETTINGS.INTENSITY' | translate\" [disabled]=\"!shadow.use\"></pep-field-title>\n    <pep-group-buttons class=\"shadow-intensity-group\" [buttons]=\"shadowIntensities\" [selectedButtonKey]=\"shadow.intensity\" [stretch]=\"true\" buttonsClass=\"md regular\" [buttonsDisabled]=\"!shadow.use\" viewType=\"toggle\">\n    </pep-group-buttons>\n</div>", styles: [":host{width:100%;display:grid;gap:var(--pep-spacing-lg, 1rem)}\n"], dependencies: [{ kind: "component", type: i2.PepCheckboxComponent, selector: "pep-checkbox", inputs: ["key", "value", "label", "type", "mandatory", "disabled", "readonly", "xAlignment", "rowSpan", "additionalValue", "form", "isActive", "showTitle", "renderTitle", "layoutType", "visible"], outputs: ["valueChange", "validationChange"] }, { kind: "component", type: i3.PepFieldTitleComponent, selector: "pep-field-title", inputs: ["label", "mandatory", "disabled", "maxFieldCharacters", "hint", "xAlignment", "showTitle", "inputLength", "fontBodyType", "multiLine"] }, { kind: "component", type: i4.PepGroupButtonsComponent, selector: "pep-group-buttons", inputs: ["viewType", "styleType", "sizeType", "buttons", "buttonsDisabled", "supportUnselect", "selectedButtonKey", "stretch"], outputs: ["buttonClick"] }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] });
+ShadowSettingsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: ShadowSettingsComponent, selector: "pep-shadow-settings", inputs: { titleSize: "titleSize", shadow: "shadow" }, outputs: { shadowChange: "shadowChange" }, ngImport: i0, template: "<div>\n    <pep-checkbox \n        class=\"{{ titleSize === 'xl' ? 'checkbox-as-title' : 'checkbox-as-sub-title' }}\" \n        [label]=\"'SHADOW_SETTINGS.TITLE' | translate\" [renderTitle]=\"false\" [value]=\"shadow.use\" (valueChange)=\"onUseChanged($event)\"></pep-checkbox>\n    <pep-field-title [label]=\"'SHADOW_SETTINGS.SIZE' | translate\" [disabled]=\"!shadow.use\"></pep-field-title>\n    <pep-group-buttons class=\"shadow-size-group\" [buttons]=\"shadowSizes\" [selectedButtonKey]=\"shadow.size\" [stretch]=\"true\" buttonsClass=\"md regular\" [buttonsDisabled]=\"!shadow.use\" viewType=\"toggle\">\n    </pep-group-buttons>\n</div>\n<div>\n    <pep-field-title [label]=\"'SHADOW_SETTINGS.INTENSITY' | translate\" [disabled]=\"!shadow.use\"></pep-field-title>\n    <pep-group-buttons class=\"shadow-intensity-group\" [buttons]=\"shadowIntensities\" [selectedButtonKey]=\"shadow.intensity\" [stretch]=\"true\" buttonsClass=\"md regular\" [buttonsDisabled]=\"!shadow.use\" viewType=\"toggle\">\n    </pep-group-buttons>\n</div>", styles: [":host{width:100%;display:grid;gap:var(--pep-spacing-lg, 1rem)}\n"], dependencies: [{ kind: "component", type: i2.PepCheckboxComponent, selector: "pep-checkbox", inputs: ["key", "value", "label", "id", "type", "mandatory", "disabled", "readonly", "xAlignment", "rowSpan", "additionalValue", "form", "isActive", "showTitle", "renderTitle", "layoutType", "visible"], outputs: ["valueChange", "validationChange"] }, { kind: "component", type: i3.PepFieldTitleComponent, selector: "pep-field-title", inputs: ["label", "mandatory", "disabled", "maxFieldCharacters", "hint", "xAlignment", "showTitle", "inputLength", "fontBodyType", "multiLine"] }, { kind: "component", type: i4.PepGroupButtonsComponent, selector: "pep-group-buttons", inputs: ["viewType", "styleType", "sizeType", "buttons", "buttonsDisabled", "supportUnselect", "selectedButtonKey", "stretch"], outputs: ["buttonClick"] }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: ShadowSettingsComponent, decorators: [{
             type: Component,
             args: [{ selector: 'pep-shadow-settings', template: "<div>\n    <pep-checkbox \n        class=\"{{ titleSize === 'xl' ? 'checkbox-as-title' : 'checkbox-as-sub-title' }}\" \n        [label]=\"'SHADOW_SETTINGS.TITLE' | translate\" [renderTitle]=\"false\" [value]=\"shadow.use\" (valueChange)=\"onUseChanged($event)\"></pep-checkbox>\n    <pep-field-title [label]=\"'SHADOW_SETTINGS.SIZE' | translate\" [disabled]=\"!shadow.use\"></pep-field-title>\n    <pep-group-buttons class=\"shadow-size-group\" [buttons]=\"shadowSizes\" [selectedButtonKey]=\"shadow.size\" [stretch]=\"true\" buttonsClass=\"md regular\" [buttonsDisabled]=\"!shadow.use\" viewType=\"toggle\">\n    </pep-group-buttons>\n</div>\n<div>\n    <pep-field-title [label]=\"'SHADOW_SETTINGS.INTENSITY' | translate\" [disabled]=\"!shadow.use\"></pep-field-title>\n    <pep-group-buttons class=\"shadow-intensity-group\" [buttons]=\"shadowIntensities\" [selectedButtonKey]=\"shadow.intensity\" [stretch]=\"true\" buttonsClass=\"md regular\" [buttonsDisabled]=\"!shadow.use\" viewType=\"toggle\">\n    </pep-group-buttons>\n</div>", styles: [":host{width:100%;display:grid;gap:var(--pep-spacing-lg, 1rem)}\n"] }]

package/fesm2020/pepperi-addons-ngx-composite-lib-shadow-settings.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"pepperi-addons-ngx-composite-lib-shadow-settings.mjs","sources":["../../../projects/ngx-composite-lib/shadow-settings/shadow-settings.model.ts","../../../projects/ngx-composite-lib/shadow-settings/shadow-settings.component.ts","../../../projects/ngx-composite-lib/shadow-settings/shadow-settings.component.html","../../../projects/ngx-composite-lib/shadow-settings/shadow-settings.module.ts","../../../projects/ngx-composite-lib/shadow-settings/public-api.ts","../../../projects/ngx-composite-lib/shadow-settings/pepperi-addons-ngx-composite-lib-shadow-settings.ts"],"sourcesContent":["import { PepSizeType } from \"@pepperi-addons/ngx-lib\";\r\n\r\nexport type PepShadowIntensityType = 'soft' | 'regular' | 'hard';\r\nexport class PepShadowSettings {\r\n    use: boolean;\r\n    size: PepSizeType;\r\n    intensity: PepShadowIntensityType;\r\n\r\n    constructor(use = false, size: PepSizeType = 'md', intensity: PepShadowIntensityType = 'soft') {\r\n        this.use =  use;\r\n        this.size = size;\r\n        this.intensity = intensity;\r\n    }\r\n}","import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';\nimport { TranslateService } from '@ngx-translate/core';\nimport { PepSizeType } from '@pepperi-addons/ngx-lib';\nimport { IPepButtonClickEvent, PepButton } from '@pepperi-addons/ngx-lib/button';\nimport { PepShadowIntensityType, PepShadowSettings } from './shadow-settings.model';\n\n@Component({\n    selector: 'pep-shadow-settings',\n    templateUrl: './shadow-settings.component.html',\n    styleUrls: ['./shadow-settings.component.scss']\n})\nexport class ShadowSettingsComponent implements OnInit {\n    @Input() titleSize: PepSizeType = 'xl';\n\n    private _shadow: PepShadowSettings = new PepShadowSettings();\n    @Input()\n    set shadow(value: PepShadowSettings) {\n        if (!value) {\n            this._shadow = new PepShadowSettings();\n        } else {\n            this._shadow = value;\n        }\n    }\n    get shadow(): PepShadowSettings {\n        return this._shadow;\n    }\n\n    @Output()\n    shadowChange: EventEmitter<PepShadowSettings> = new EventEmitter<PepShadowSettings>();\n    \n    shadowSizes: Array<PepButton> = [];\n    shadowIntensities: Array<PepButton> = [];\n\n    constructor(\n        private translate: TranslateService,\n    ) {\n    }\n\n    ngOnInit(): void { \n        // Get the first translation for load all translations.\n        this.translate.get('SHADOW_SETTINGS.INTENSITY_SOFT').toPromise().then((typeSoft) => {\n            this.shadowSizes = [\n                { key: 'sm', value: this.translate.instant('GENERAL.SM'), callback: () => this.onSizeChange('sm') },\n                { key: 'md', value: this.translate.instant('GENERAL.MD'), callback: () => this.onSizeChange('md') },\n                { key: 'lg', value: this.translate.instant('GENERAL.LG'), callback: () => this.onSizeChange('lg') },\n                { key: 'xl', value: this.translate.instant('GENERAL.XL'), callback: () => this.onSizeChange('xl') }\n            ];\n\n            this.shadowIntensities = [\n                { key: 'soft', value: typeSoft, callback: () => this.onIntensityChange('soft') },\n                { key: 'regular', value: this.translate.instant('SHADOW_SETTINGS.INTENSITY_REGULAR'), callback: () => this.onIntensityChange('regular') },\n                { key: 'hard', value: this.translate.instant('SHADOW_SETTINGS.INTENSITY_HARD'), callback: () => this.onIntensityChange('hard') }\n            ];\n        });\n    }\n\n\n    private raiseShadowChange() {\n        this.shadowChange.emit(this.shadow);\n    }\n\n    onUseChanged(value: boolean) {\n        this.shadow.use = value;\n        this.raiseShadowChange();\n    }\n\n    onSizeChange(value: PepSizeType) {\n        this.shadow.size = value;\n        this.raiseShadowChange();\n    }\n\n    onIntensityChange(value: PepShadowIntensityType) {\n        this.shadow.intensity = value;\n        this.raiseShadowChange();\n    }\n}\n","<div>\n    <pep-checkbox \n        class=\"{{ titleSize === 'xl' ? 'checkbox-as-title' : 'checkbox-as-sub-title' }}\" \n        [label]=\"'SHADOW_SETTINGS.TITLE' | translate\" [renderTitle]=\"false\" [value]=\"shadow.use\" (valueChange)=\"onUseChanged($event)\"></pep-checkbox>\n    <pep-field-title [label]=\"'SHADOW_SETTINGS.SIZE' | translate\" [disabled]=\"!shadow.use\"></pep-field-title>\n    <pep-group-buttons class=\"shadow-size-group\" [buttons]=\"shadowSizes\" [selectedButtonKey]=\"shadow.size\" [stretch]=\"true\" buttonsClass=\"md regular\" [buttonsDisabled]=\"!shadow.use\" viewType=\"toggle\">\n    </pep-group-buttons>\n</div>\n<div>\n    <pep-field-title [label]=\"'SHADOW_SETTINGS.INTENSITY' | translate\" [disabled]=\"!shadow.use\"></pep-field-title>\n    <pep-group-buttons class=\"shadow-intensity-group\" [buttons]=\"shadowIntensities\" [selectedButtonKey]=\"shadow.intensity\" [stretch]=\"true\" buttonsClass=\"md regular\" [buttonsDisabled]=\"!shadow.use\" viewType=\"toggle\">\n    </pep-group-buttons>\n</div>","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { ShadowSettingsComponent } from './shadow-settings.component';\nimport { PepNgxLibModule } from '@pepperi-addons/ngx-lib';\nimport { PepCheckboxModule } from '@pepperi-addons/ngx-lib/checkbox';\nimport { PepFieldTitleModule } from '@pepperi-addons/ngx-lib/field-title';\nimport { PepGroupButtonsModule } from '@pepperi-addons/ngx-lib/group-buttons';\nimport { PepSliderModule } from '@pepperi-addons/ngx-lib/slider';\n\n@NgModule({\n    declarations: [\n        ShadowSettingsComponent\n    ],\n    imports: [\n        CommonModule,\n        PepNgxLibModule,\n        PepCheckboxModule,\n        PepFieldTitleModule,\n        PepGroupButtonsModule,\n        PepSliderModule\n    ],\n    exports: [ShadowSettingsComponent],\n})\nexport class PepShadowSettingsModule { }\n","/*\n * Public API Surface of ngx-composite-lib/shadow-settings\n */\nexport * from './shadow-settings.module';\nexport * from './shadow-settings.component';\nexport * from './shadow-settings.model';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"pepperi-addons-ngx-composite-lib-shadow-settings.mjs","sources":["../../../projects/ngx-composite-lib/shadow-settings/shadow-settings.model.ts","../../../projects/ngx-composite-lib/shadow-settings/shadow-settings.component.ts","../../../projects/ngx-composite-lib/shadow-settings/shadow-settings.component.html","../../../projects/ngx-composite-lib/shadow-settings/shadow-settings.module.ts","../../../projects/ngx-composite-lib/shadow-settings/public-api.ts","../../../projects/ngx-composite-lib/shadow-settings/pepperi-addons-ngx-composite-lib-shadow-settings.ts"],"sourcesContent":["import { PepSizeType } from \"@pepperi-addons/ngx-lib\";\r\n\r\nexport type PepShadowIntensityType = 'soft' | 'regular' | 'hard';\r\nexport class PepShadowSettings {\r\n    use: boolean;\r\n    size: PepSizeType;\r\n    intensity: PepShadowIntensityType;\r\n\r\n    constructor(use = false, size: PepSizeType = 'md', intensity: PepShadowIntensityType = 'soft') {\r\n        this.use =  use;\r\n        this.size = size;\r\n        this.intensity = intensity;\r\n    }\r\n}","import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';\nimport { TranslateService } from '@ngx-translate/core';\nimport { PepSizeType } from '@pepperi-addons/ngx-lib';\nimport { IPepButtonClickEvent, PepButton } from '@pepperi-addons/ngx-lib/button';\nimport { PepShadowIntensityType, PepShadowSettings } from './shadow-settings.model';\n\n@Component({\n    selector: 'pep-shadow-settings',\n    templateUrl: './shadow-settings.component.html',\n    styleUrls: ['./shadow-settings.component.scss']\n})\nexport class ShadowSettingsComponent implements OnInit {\n    @Input() titleSize: PepSizeType = 'xl';\n\n    private _shadow: PepShadowSettings = new PepShadowSettings();\n    @Input()\n    set shadow(value: PepShadowSettings) {\n        if (!value) {\n            this._shadow = new PepShadowSettings();\n        } else {\n            this._shadow = value;\n        }\n    }\n    get shadow(): PepShadowSettings {\n        return this._shadow;\n    }\n\n    @Output()\n    shadowChange: EventEmitter<PepShadowSettings> = new EventEmitter<PepShadowSettings>();\n    \n    shadowSizes: Array<PepButton> = [];\n    shadowIntensities: Array<PepButton> = [];\n\n    constructor(\n        private translate: TranslateService,\n    ) {\n    }\n\n    ngOnInit(): void { \n        // Get the first translation for load all translations.\n        this.translate.get('SHADOW_SETTINGS.INTENSITY_SOFT').toPromise().then((typeSoft) => {\n            this.shadowSizes = [\n                { key: 'sm', value: this.translate.instant('GENERAL.SM'), callback: () => this.onSizeChange('sm') },\n                { key: 'md', value: this.translate.instant('GENERAL.MD'), callback: () => this.onSizeChange('md') },\n                { key: 'lg', value: this.translate.instant('GENERAL.LG'), callback: () => this.onSizeChange('lg') },\n                { key: 'xl', value: this.translate.instant('GENERAL.XL'), callback: () => this.onSizeChange('xl') }\n            ];\n\n            this.shadowIntensities = [\n                { key: 'soft', value: typeSoft, callback: () => this.onIntensityChange('soft') },\n                { key: 'regular', value: this.translate.instant('SHADOW_SETTINGS.INTENSITY_REGULAR'), callback: () => this.onIntensityChange('regular') },\n                { key: 'hard', value: this.translate.instant('SHADOW_SETTINGS.INTENSITY_HARD'), callback: () => this.onIntensityChange('hard') }\n            ];\n        });\n    }\n\n\n    private raiseShadowChange() {\n        this.shadowChange.emit(this.shadow);\n    }\n\n    onUseChanged(value: boolean) {\n        this.shadow.use = value;\n        this.raiseShadowChange();\n    }\n\n    onSizeChange(value: PepSizeType) {\n        this.shadow.size = value;\n        this.raiseShadowChange();\n    }\n\n    onIntensityChange(value: PepShadowIntensityType) {\n        this.shadow.intensity = value;\n        this.raiseShadowChange();\n    }\n}\n","<div>\n    <pep-checkbox \n        class=\"{{ titleSize === 'xl' ? 'checkbox-as-title' : 'checkbox-as-sub-title' }}\" \n        [label]=\"'SHADOW_SETTINGS.TITLE' | translate\" [renderTitle]=\"false\" [value]=\"shadow.use\" (valueChange)=\"onUseChanged($event)\"></pep-checkbox>\n    <pep-field-title [label]=\"'SHADOW_SETTINGS.SIZE' | translate\" [disabled]=\"!shadow.use\"></pep-field-title>\n    <pep-group-buttons class=\"shadow-size-group\" [buttons]=\"shadowSizes\" [selectedButtonKey]=\"shadow.size\" [stretch]=\"true\" buttonsClass=\"md regular\" [buttonsDisabled]=\"!shadow.use\" viewType=\"toggle\">\n    </pep-group-buttons>\n</div>\n<div>\n    <pep-field-title [label]=\"'SHADOW_SETTINGS.INTENSITY' | translate\" [disabled]=\"!shadow.use\"></pep-field-title>\n    <pep-group-buttons class=\"shadow-intensity-group\" [buttons]=\"shadowIntensities\" [selectedButtonKey]=\"shadow.intensity\" [stretch]=\"true\" buttonsClass=\"md regular\" [buttonsDisabled]=\"!shadow.use\" viewType=\"toggle\">\n    </pep-group-buttons>\n</div>","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { ShadowSettingsComponent } from './shadow-settings.component';\nimport { PepNgxLibModule } from '@pepperi-addons/ngx-lib';\nimport { PepCheckboxModule } from '@pepperi-addons/ngx-lib/checkbox';\nimport { PepFieldTitleModule } from '@pepperi-addons/ngx-lib/field-title';\nimport { PepGroupButtonsModule } from '@pepperi-addons/ngx-lib/group-buttons';\nimport { PepSliderModule } from '@pepperi-addons/ngx-lib/slider';\n\n@NgModule({\n    declarations: [\n        ShadowSettingsComponent\n    ],\n    imports: [\n        CommonModule,\n        PepNgxLibModule,\n        PepCheckboxModule,\n        PepFieldTitleModule,\n        PepGroupButtonsModule,\n        PepSliderModule\n    ],\n    exports: [ShadowSettingsComponent],\n})\nexport class PepShadowSettingsModule { }\n","/*\n * Public API Surface of ngx-composite-lib/shadow-settings\n */\nexport * from './shadow-settings.module';\nexport * from './shadow-settings.component';\nexport * from './shadow-settings.model';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/layout-builder2/hide-in/hide-in.component.d.ts

@@ -0,0 +1,25 @@
+import { EventEmitter, OnInit } from '@angular/core';
+import { TranslateService } from '@ngx-translate/core';
+import { DataViewScreenSize } from '@pepperi-addons/papi-sdk';
+import * as i0 from "@angular/core";
+interface hideInItem {
+    key: DataViewScreenSize;
+    text: string;
+    selected: boolean;
+}
+export declare class HideInComponent implements OnInit {
+    private translate;
+    hideIn: DataViewScreenSize[];
+    hideInChange: EventEmitter<DataViewScreenSize[]>;
+    menuOpened: EventEmitter<void>;
+    menuClosed: EventEmitter<void>;
+    menuItems: Array<hideInItem>;
+    constructor(translate: TranslateService);
+    ngOnInit(): Promise<void>;
+    onItemClick(event: any, menuItem: hideInItem): boolean;
+    onMenuOpened(): void;
+    onMenuClosed(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<HideInComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<HideInComponent, "hide-in", never, { "hideIn": "hideIn"; }, { "hideInChange": "hideInChange"; "menuOpened": "menuOpened"; "menuClosed": "menuClosed"; }, never, never, false>;
+}
+export {};

package/layout-builder2/hide-in/hide-in.component.theme.scss

@@ -0,0 +1,9 @@
+@use '@pepperi-addons/ngx-lib/src/core/style/abstracts/functions' as ngx-functions;
+
+.hide-in-menu {
+    .mat-menu-item {
+        &.title {
+            color: ngx-functions.get-pep-color(color-text, color-dimmed);
+        }
+    }
+}

package/layout-builder2/hide-in/hide-in.module.d.ts

@@ -0,0 +1,20 @@
+import { PepIconRegistry } from '@pepperi-addons/ngx-lib/icon';
+import * as i0 from "@angular/core";
+import * as i1 from "./hide-in.component";
+import * as i2 from "@angular/common";
+import * as i3 from "@angular/material/button";
+import * as i4 from "@angular/material/menu";
+import * as i5 from "@angular/material/icon";
+import * as i6 from "@angular/material/badge";
+import * as i7 from "@angular/material/checkbox";
+import * as i8 from "@pepperi-addons/ngx-lib/button";
+import * as i9 from "@pepperi-addons/ngx-lib/checkbox";
+import * as i10 from "@pepperi-addons/ngx-lib/icon";
+import * as i11 from "@ngx-translate/core";
+export declare class HideInModule {
+    private pepIconRegistry;
+    constructor(pepIconRegistry: PepIconRegistry);
+    static ɵfac: i0.ɵɵFactoryDeclaration<HideInModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<HideInModule, [typeof i1.HideInComponent], [typeof i2.CommonModule, typeof i3.MatButtonModule, typeof i4.MatMenuModule, typeof i5.MatIconModule, typeof i6.MatBadgeModule, typeof i7.MatCheckboxModule, typeof i8.PepButtonModule, typeof i9.PepCheckboxModule, typeof i10.PepIconModule, typeof i11.TranslateModule], [typeof i1.HideInComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<HideInModule>;
+}

package/layout-builder2/index.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Generated bundle index. Do not edit.
+ */
+/// <amd-module name="@pepperi-addons/ngx-composite-lib/layout-builder2" />
+export * from './public-api';

package/layout-builder2/layout/layout.component.d.ts

@@ -0,0 +1,58 @@
+import { ElementRef, Renderer2, OnInit, EventEmitter, TemplateRef, OnDestroy } from '@angular/core';
+import { CdkDragDrop, CdkDragEnd, CdkDragStart } from '@angular/cdk/drag-drop';
+import { BaseDestroyerDirective } from '@pepperi-addons/ngx-lib';
+import { Observable } from 'rxjs';
+import { DataViewScreenSize } from '@pepperi-addons/papi-sdk';
+import { IPepLayoutSection, IPepLayoutView, PepLayoutSizeType } from '../layout-builder.model';
+import { LayoutBuilderInternalService } from '../layout-builder-internal.service';
+import * as i0 from "@angular/core";
+export declare class PepLayoutComponent extends BaseDestroyerDirective implements OnInit, OnDestroy {
+    private layoutBuilderInternalService;
+    private hostElement;
+    private renderer;
+    skeletonContainer: ElementRef;
+    sectionsContainer: ElementRef;
+    private _editorMode;
+    set editorMode(value: boolean);
+    get editorMode(): boolean;
+    private _layoutView;
+    set layoutView(value: IPepLayoutView);
+    get layoutView(): IPepLayoutView;
+    blockTemplate: TemplateRef<any> | undefined;
+    blockTemplateRenderer: ((host: HTMLElement, blockKey: string) => void) | null;
+    blockTemplateUnmount: ((host: HTMLElement) => void) | null;
+    private _renderSkeleton;
+    set renderSkeleton(value: boolean);
+    get renderSkeleton(): boolean;
+    private _showSkeleton;
+    set showSkeleton(value: boolean);
+    get showSkeleton(): boolean;
+    layoutViewChange: EventEmitter<IPepLayoutView>;
+    screenTypeChange: EventEmitter<DataViewScreenSize>;
+    private _horizontalSpacing;
+    set horizontalSpacing(value: PepLayoutSizeType | undefined);
+    get horizontalSpacing(): PepLayoutSizeType | undefined;
+    private _verticalSpacing;
+    set verticalSpacing(value: PepLayoutSizeType | undefined);
+    get verticalSpacing(): PepLayoutSizeType | undefined;
+    protected paddingInline: string;
+    protected sectionsGap: PepLayoutSizeType;
+    protected columnsGap: PepLayoutSizeType;
+    protected previewMode: boolean;
+    private _sectionsSubject;
+    protected get sections$(): Observable<IPepLayoutSection[]>;
+    protected selectedScreenType: DataViewScreenSize;
+    constructor(layoutBuilderInternalService: LayoutBuilderInternalService, hostElement: ElementRef, renderer: Renderer2);
+    private convertLayoutSizeType;
+    private animateSkeleton;
+    private setLayoutDataProperties;
+    private setScreentType;
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    getSectionsTemplateRows(): string;
+    onSectionDropped(event: CdkDragDrop<any[]>): void;
+    onDragStart(event: CdkDragStart): void;
+    onDragEnd(event: CdkDragEnd): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<PepLayoutComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<PepLayoutComponent, "pep-layout2", never, { "editorMode": "editorMode"; "layoutView": "layoutView"; "blockTemplate": "blockTemplate"; "blockTemplateRenderer": "blockTemplateRenderer"; "blockTemplateUnmount": "blockTemplateUnmount"; "renderSkeleton": "renderSkeleton"; "showSkeleton": "showSkeleton"; }, { "layoutViewChange": "layoutViewChange"; "screenTypeChange": "screenTypeChange"; }, never, never, false>;
+}

package/layout-builder2/layout/layout.module.d.ts

@@ -0,0 +1,16 @@
+import * as i0 from "@angular/core";
+import * as i1 from "./layout.component";
+import * as i2 from "@angular/common";
+import * as i3 from "@angular/common/http";
+import * as i4 from "@pepperi-addons/ngx-lib";
+import * as i5 from "@pepperi-addons/ngx-lib/skeleton-loader";
+import * as i6 from "@pepperi-addons/ngx-lib/size-detector";
+import * as i7 from "@pepperi-addons/ngx-lib/dialog";
+import * as i8 from "@angular/cdk/drag-drop";
+import * as i9 from "../section/section.module";
+import * as i10 from "@ngx-translate/core";
+export declare class PepLayout2Module {
+    static ɵfac: i0.ɵɵFactoryDeclaration<PepLayout2Module, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<PepLayout2Module, [typeof i1.PepLayoutComponent], [typeof i2.CommonModule, typeof i3.HttpClientModule, typeof i4.PepNgxLibModule, typeof i5.PepSkeletonLoaderModule, typeof i6.PepSizeDetectorModule, typeof i7.PepDialogModule, typeof i8.DragDropModule, typeof i9.SectionModule, typeof i10.TranslateModule], [typeof i1.PepLayoutComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<PepLayout2Module>;
+}

package/layout-builder2/layout-builder-editor/layout-builder-editor.component.d.ts

@@ -0,0 +1,12 @@
+import { ElementRef, Renderer2 } from '@angular/core';
+import { BaseDestroyerDirective } from '@pepperi-addons/ngx-lib';
+import { IPepEditorTab } from '../layout-builder.model';
+import * as i0 from "@angular/core";
+export declare class PepLayoutBuilderEditorComponent extends BaseDestroyerDirective {
+    private hostElement;
+    private renderer;
+    editorTabs: IPepEditorTab[];
+    constructor(hostElement: ElementRef, renderer: Renderer2);
+    static ɵfac: i0.ɵɵFactoryDeclaration<PepLayoutBuilderEditorComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<PepLayoutBuilderEditorComponent, "pep-layout-builder-editor", never, { "editorTabs": "editorTabs"; }, {}, never, ["*", "*"], false>;
+}

package/layout-builder2/layout-builder-editor/layout-builder-editor.module.d.ts

@@ -0,0 +1,14 @@
+import * as i0 from "@angular/core";
+import * as i1 from "./layout-builder-editor.component";
+import * as i2 from "@angular/common";
+import * as i3 from "@angular/common/http";
+import * as i4 from "@angular/cdk/overlay";
+import * as i5 from "@angular/material/tabs";
+import * as i6 from "@pepperi-addons/ngx-lib";
+import * as i7 from "@ngx-translate/core";
+export declare class PepLayoutBuilderEditorModule {
+    constructor();
+    static ɵfac: i0.ɵɵFactoryDeclaration<PepLayoutBuilderEditorModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<PepLayoutBuilderEditorModule, [typeof i1.PepLayoutBuilderEditorComponent], [typeof i2.CommonModule, typeof i3.HttpClientModule, typeof i4.OverlayModule, typeof i5.MatTabsModule, typeof i6.PepNgxLibModule, typeof i7.TranslateModule], [typeof i1.PepLayoutBuilderEditorComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<PepLayoutBuilderEditorModule>;
+}

package/layout-builder2/layout-builder-internal.service.d.ts

@@ -0,0 +1,118 @@
+import { CdkDragDrop, CdkDragEnd, CdkDragStart } from "@angular/cdk/drag-drop";
+import { TranslateService } from "@ngx-translate/core";
+import { PepLayoutService, PepScreenSizeType } from "@pepperi-addons/ngx-lib";
+import { DataViewScreenSize, SplitType } from "@pepperi-addons/papi-sdk";
+import { Observable } from 'rxjs';
+import { PepLayoutEditorType, IPepLayoutBlockAddedEvent, IPepLayoutSection, IPepLayoutSectionColumn, IPepLayoutView, IPepLayoutBlockConfig, PepLayoutSizeType, IEditor } from "./layout-builder.model";
+import { PepDialogService } from "@pepperi-addons/ngx-lib/dialog";
+import { PepPaddingSettings } from "@pepperi-addons/ngx-composite-lib/padding-settings";
+import * as i0 from "@angular/core";
+export interface ILayoutEditor {
+    maxWidth: number;
+    horizontalSpacing?: PepLayoutSizeType;
+    verticalSpacing?: PepLayoutSizeType;
+    sectionsGap?: PepLayoutSizeType;
+    columnsGap?: PepLayoutSizeType;
+    roundedCorners?: PepLayoutSizeType;
+}
+export interface ILayoutSectionEditor {
+    id: string;
+    sectionName: string;
+    split: SplitType | undefined;
+    height: number;
+    collapseOnTablet: boolean;
+    fillHeight: boolean;
+    padding: PepPaddingSettings;
+}
+export declare class LayoutBuilderInternalService {
+    protected translate: TranslateService;
+    protected dialogService: PepDialogService;
+    private layoutService;
+    static readonly AVAILABLE_BLOCKS_CONTAINER_ID = "availableBlocks";
+    static readonly MAIN_EDITOR_ID = "main";
+    private _manageGlobalCursor;
+    private _defaultSectionTitle;
+    private _blocksLimitNumber;
+    private _navigateToEditorAfterBlockAdded;
+    private _getBlockTitle;
+    setBlocksConfig(value: IPepLayoutBlockConfig): void;
+    private _editorsBreadCrumb;
+    private _editorMode;
+    get editorMode(): boolean;
+    setEditorMode(value: boolean): void;
+    private _editableState;
+    get editableState(): boolean;
+    private _screenSizeSubject;
+    get screenSizeChange$(): Observable<PepScreenSizeType | undefined>;
+    private _screenWidthSubject;
+    get screenWidthChange$(): Observable<string>;
+    private _editorSubject;
+    get editorChange$(): Observable<IEditor | null>;
+    private _sectionsColumnsDropListSubject;
+    get sectionsColumnsDropListChange$(): Observable<any[]>;
+    private _sectionsViewSubject;
+    get sectionsChange$(): Observable<IPepLayoutSection[]>;
+    private _layoutViewSubject;
+    get layoutViewChange$(): Observable<IPepLayoutView | null>;
+    private _draggingBlockKey;
+    get draggingBlockKey(): Observable<string>;
+    private _draggingSectionKey;
+    get draggingSectionKey(): Observable<string>;
+    private _previewModeSubject;
+    get previewModeChange$(): Observable<boolean>;
+    private _blockAddedEventSubject;
+    get blockAddedEventSubject$(): Observable<IPepLayoutBlockAddedEvent | null>;
+    private _blocksRemovedEventSubject;
+    get blocksRemovedEventSubject$(): Observable<string[]>;
+    constructor(translate: TranslateService, dialogService: PepDialogService, layoutService: PepLayoutService);
+    private setEditableState;
+    private notifyLayoutViewChange;
+    private notifyBlockAdded;
+    private notifyBlocksRemoved;
+    private notifyEditorChange;
+    private notifyPreviewModeChange;
+    private notifySectionsColumnsDropListChange;
+    private notifyScreenSizeChange;
+    private updateLayoutEditorProperties;
+    private loadDefaultEditor;
+    private changeCurrentEditor;
+    private getEditorByType;
+    private getBlockEditor;
+    private getSectionEditorTitle;
+    private getSectionEditor;
+    private getSectionColumnByIdForEditor;
+    private getCssScreenWidh;
+    private getBlocksNumber;
+    private changeCursorOnDragStart;
+    private changeCursorOnDragEnd;
+    /***********************************************************************************************/
+    getCurrentLayoutView(): IPepLayoutView | null;
+    getBlockTitle(blockKey: string): string;
+    setManageGlobalCursor(value: boolean): void;
+    setSectionsColumnsDropListChange(sectionsColumnsDropList: any[]): void;
+    changePreviewMode(value: boolean): void;
+    getCurrentScreenType(): DataViewScreenSize;
+    getScreenType(size: PepScreenSizeType): DataViewScreenSize;
+    getSectionColumnKey(sectionKey?: string, index?: string): string;
+    getIsHidden(hideIn: DataViewScreenSize[] | undefined, currentScreenType: DataViewScreenSize): boolean;
+    navigateToEditor(editorType: PepLayoutEditorType, id: string, title?: string): boolean;
+    navigateBackFromEditor(): void;
+    updateLayoutFromEditor(editorData: ILayoutEditor): void;
+    updateSectionFromEditor(sectionData: ILayoutSectionEditor): void;
+    addSection(section?: IPepLayoutSection | null): void;
+    removeSection(sectionId: string): void;
+    hideSection(sectionId: string, hideIn: DataViewScreenSize[]): void;
+    onSectionDropped(event: CdkDragDrop<any[]>): void;
+    onSectionDragStart(event: CdkDragStart): void;
+    onSectionDragEnd(event: CdkDragEnd): void;
+    removeBlockFromSection(blockId: string): void;
+    hideBlock(sectionId: string, blockId: string, hideIn: DataViewScreenSize[]): void;
+    onBlockDropped(event: CdkDragDrop<IPepLayoutSectionColumn, any, any>, sectionId: string): void;
+    onBlockDragStart(event: CdkDragStart): void;
+    onBlockDragEnd(event: CdkDragEnd): void;
+    doesColumnContainBlock(sectionId: string, columnIndex: number): boolean;
+    setScreenWidth(screenType: DataViewScreenSize): void;
+    loadLayoutBuilder(layoutView: IPepLayoutView): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<LayoutBuilderInternalService, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<LayoutBuilderInternalService>;
+}

package/layout-builder2/layout-builder.component.d.ts

@@ -0,0 +1,87 @@
+import { AfterViewInit, ElementRef, OnChanges, OnDestroy, OnInit, Renderer2, SimpleChanges, EventEmitter } from '@angular/core';
+import { BaseDestroyerDirective, PepAddonService } from '@pepperi-addons/ngx-lib';
+import { DataViewScreenSize } from '@pepperi-addons/papi-sdk';
+import { TranslateService } from '@ngx-translate/core';
+import { PepButton } from '@pepperi-addons/ngx-lib/button';
+import { IPepSideBarStateChangeEvent } from '@pepperi-addons/ngx-lib/side-bar';
+import { IPepDraggableItem } from '@pepperi-addons/ngx-lib/draggable-items';
+import { IEditor, IPepLayoutBlockAddedEvent, IPepLayoutBlockConfig, IPepLayoutView } from './layout-builder.model';
+import { ILayoutEditor, ILayoutSectionEditor, LayoutBuilderInternalService } from './layout-builder-internal.service';
+import { CdkDragEnd, CdkDragStart } from '@angular/cdk/drag-drop';
+import * as i0 from "@angular/core";
+export declare class PepLayoutBuilder2Component extends BaseDestroyerDirective implements AfterViewInit, OnInit, OnChanges, OnDestroy {
+    private renderer;
+    private hostElement;
+    private translate;
+    private pepAddonService;
+    layoutBuilderWrapper: ElementRef;
+    private sideBarComponent;
+    private headerEndHost;
+    private blockEditorHost;
+    private layoutContentHost;
+    private _availableBlocksForDrag;
+    set availableBlocksForDrag(value: Array<IPepDraggableItem>);
+    get availableBlocksForDrag(): Array<IPepDraggableItem>;
+    private _blocksLayoutConfig;
+    set blocksLayoutConfig(value: IPepLayoutBlockConfig);
+    private _layoutEditorTitle;
+    set layoutEditorTitle(value: string);
+    get layoutEditorTitle(): string;
+    lockScreen: boolean;
+    showSkeleton: boolean;
+    updateShellRouterData: boolean;
+    manageGlobalCursor: boolean;
+    private _layoutEditorTopElement;
+    set layoutEditorTopElement(value: HTMLElement | null);
+    get layoutEditorTopElement(): HTMLElement | null;
+    private _headerEndElement;
+    set headerEndElement(value: HTMLElement | null);
+    get headerEndElement(): HTMLElement | null;
+    private _blockEditorElement;
+    set blockEditorElement(value: HTMLElement | null);
+    get blockEditorElement(): HTMLElement | null;
+    private _layoutContentElement;
+    set layoutContentElement(value: HTMLElement | null);
+    get layoutContentElement(): HTMLElement | null;
+    blockTemplateRenderer: ((host: HTMLElement, blockKey: string) => void) | null;
+    blockTemplateUnmount: ((host: HTMLElement) => void) | null;
+    layoutView: IPepLayoutView | null;
+    backClick: EventEmitter<void>;
+    editorChange: EventEmitter<IEditor>;
+    blockAdded: EventEmitter<IPepLayoutBlockAddedEvent>;
+    blocksRemoved: EventEmitter<string[]>;
+    editableStateChange: EventEmitter<boolean>;
+    layoutViewChange: EventEmitter<IPepLayoutView>;
+    screenTypeChange: EventEmitter<DataViewScreenSize>;
+    protected previewMode: boolean;
+    protected currentEditor: IEditor | null;
+    protected viewportWidth: number;
+    protected screenTypes: Array<PepButton>;
+    protected sectionsColumnsDropList: never[];
+    protected selectedScreenType: DataViewScreenSize;
+    layoutBuilderInternalService: LayoutBuilderInternalService;
+    constructor(renderer: Renderer2, hostElement: ElementRef, translate: TranslateService, layoutBuilderInternalService: LayoutBuilderInternalService, pepAddonService: PepAddonService | null);
+    private mountElement;
+    private mountHeaderEndElement;
+    private mountBlockEditorElement;
+    private mountLayoutContentElement;
+    private setScreenWidth;
+    private updateViewportWidth;
+    private subscribeEvents;
+    private setBlocksConfig;
+    ngAfterViewInit(): void;
+    ngOnChanges(changes: SimpleChanges): void;
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    onResize(event: any): void;
+    togglePreviewMode(): void;
+    onSidebarStateChange(event: IPepSideBarStateChangeEvent): void;
+    onLayoutEditorObjectChange(pageEditor: ILayoutEditor): void;
+    onSectionEditorObjectChange(sectionEditor: ILayoutSectionEditor): void;
+    onAddSectionClick(event: any): void;
+    onBlockDragStart(event: CdkDragStart): void;
+    onBlockDragEnd(event: CdkDragEnd): void;
+    onNavigateBackFromEditor(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<PepLayoutBuilder2Component, [null, null, null, null, { optional: true; }]>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<PepLayoutBuilder2Component, "pep-layout-builder2", never, { "availableBlocksForDrag": "availableBlocksForDrag"; "blocksLayoutConfig": "blocksLayoutConfig"; "layoutEditorTitle": "layoutEditorTitle"; "lockScreen": "lockScreen"; "showSkeleton": "showSkeleton"; "updateShellRouterData": "updateShellRouterData"; "manageGlobalCursor": "manageGlobalCursor"; "layoutEditorTopElement": "layoutEditorTopElement"; "headerEndElement": "headerEndElement"; "blockEditorElement": "blockEditorElement"; "layoutContentElement": "layoutContentElement"; "blockTemplateRenderer": "blockTemplateRenderer"; "blockTemplateUnmount": "blockTemplateUnmount"; "layoutView": "layoutView"; }, { "backClick": "backClick"; "editorChange": "editorChange"; "blockAdded": "blockAdded"; "blocksRemoved": "blocksRemoved"; "editableStateChange": "editableStateChange"; "layoutViewChange": "layoutViewChange"; "screenTypeChange": "screenTypeChange"; }, never, never, false>;
+}

package/layout-builder2/layout-builder.component.theme.scss

@@ -0,0 +1,57 @@
+@use '@pepperi-addons/ngx-lib/src/core/style/abstracts/mixins' as ngx-mixins;
+@use '@pepperi-addons/ngx-lib/src/core/style/abstracts/functions' as ngx-functions;
+
+// set mat tab as fixed tab just on the editors
+.layout-builder-editor-wrapper {
+    ::ng-deep {
+        .page-builder-editor-tabs,
+        .layout-builder-editor-tabs {
+            .mat-tab-header {
+                background: ngx-functions.get-pep-color(color-system-primary-invert, color-base);
+            }
+        }
+    }
+}
+
+.main-area-container {
+    background: ngx-functions.get-pep-color(color-system-primary, color-tran-10);
+
+    .header-container {
+        background: ngx-functions.get-pep-color(color-system-primary-invert, color-base);
+        box-shadow: ngx-functions.get-pep-shadow(shadow-sm, regular);
+
+        .header-title {
+            color: ngx-functions.get-pep-color(color-text, color-dimmed);
+        }
+
+        .size-limit-container {
+            @include ngx-mixins.state-weak-default();
+        }
+    }
+
+    &.preview-mode {
+        .header-container {
+            background: unset;
+            // box-shadow: unset;
+            background-color: ngx-functions.get-pep-color(color-text, color-caution);
+            
+            .preview-title,
+            .color-link {
+                color: ngx-functions.get-pep-color(color-text, color-invert);
+            }
+        }
+
+        .layout-builder-wrapper {
+            overflow: auto;
+        }
+    }
+
+    .layout-builder-wrapper {
+        background: ngx-functions.get-pep-color(color-system-primary-invert, color-base);
+        box-shadow: ngx-functions.get-pep-shadow(shadow-md, regular);
+
+        .backdrop {
+            background: ngx-functions.get-pep-color(color-system-primary, color-tran-70);
+        }
+    }
+}