@pepperi-addons/ngx-composite-lib 0.4.2-beta.7 → 0.4.2-beta.71

package/fesm2020/pepperi-addons-ngx-composite-lib-rich-text.mjs

@@ -0,0 +1,230 @@
+import * as i0 from '@angular/core';
+import { Injectable, EventEmitter, Component, Input, Output, NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import * as i1 from '@pepperi-addons/ngx-lib';
+import { DEFAULT_HORIZONTAL_ALIGNMENT, PepNgxLibModule } from '@pepperi-addons/ngx-lib';
+import * as i4 from '@pepperi-addons/ngx-lib/rich-html-textarea';
+import { PepRichHtmlTextareaModule } from '@pepperi-addons/ngx-lib/rich-html-textarea';
+import * as i1$1 from '@pepperi-addons/ngx-lib/remote-loader';
+import { PepRemoteLoaderModule } from '@pepperi-addons/ngx-lib/remote-loader';
+import * as i3 from '@pepperi-addons/ngx-lib/button';
+import { PepButtonModule } from '@pepperi-addons/ngx-lib/button';
+import { lastValueFrom } from 'rxjs';
+import * as i1$2 from '@pepperi-addons/ngx-lib/icon';
+import { pepIconSystemImage, PepIconModule } from '@pepperi-addons/ngx-lib/icon';
+
+class RichTextService {
+    constructor(httpService) {
+        this.httpService = httpService;
+    }
+    async searchFlows(flowKey) {
+        return lastValueFrom(await this.httpService.postPapiApiCall('/user_defined_flows/search', { KeyList: [flowKey], Fields: ['Key', 'Name'] }));
+    }
+}
+RichTextService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: RichTextService, deps: [{ token: i1.PepHttpService }], target: i0.ɵɵFactoryTarget.Injectable });
+RichTextService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: RichTextService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: RichTextService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }], ctorParameters: function () { return [{ type: i1.PepHttpService }]; } });
+
+class RichTextComponent {
+    constructor(viewContainerRef, addonBlockLoaderService, RichTextService) {
+        this.viewContainerRef = viewContainerRef;
+        this.addonBlockLoaderService = addonBlockLoaderService;
+        this.RichTextService = RichTextService;
+        this.key = '';
+        this.value = '';
+        this.label = '';
+        this.mandatory = false;
+        this.disabled = false;
+        this.readonly = false;
+        this.maxFieldCharacters = 300;
+        this.xAlignment = DEFAULT_HORIZONTAL_ALIGNMENT;
+        this.sanitize = true;
+        this.rowSpan = 1;
+        this.visible = true;
+        this.isActive = false;
+        this.showTitle = true;
+        this.renderTitle = true;
+        this.renderEnlargeButton = true;
+        this.layoutType = 'form';
+        this.inlineMode = false;
+        this.useAssetsForImages = true;
+        this._toolbarOptions = this.getDefaultToolbarOptions();
+        this.valueChange = new EventEmitter();
+        this.toolbarOptions = this.getDefaultToolbarOptions();
+    }
+    get toolbarOptions() {
+        return this._toolbarOptions;
+    }
+    set toolbarOptions(options) {
+        if (options) {
+            this._toolbarOptions = options;
+        }
+    }
+    ngOnInit() {
+        // Do nothing.
+    }
+    getDefaultToolbarOptions() {
+        return {
+            font: false,
+            size: false,
+            header: true,
+            bold: true,
+            italic: true,
+            underline: true,
+            strike: false,
+            link: true,
+            image: { useAssetsABI: true },
+            ordered: true,
+            bullet: true,
+            color: true,
+            background: false,
+            align: true
+        };
+    }
+    onEditorOpen(editor) {
+        this.quillEditor = editor;
+        if (this.useAssetsForImages) {
+            const imageButton = document.querySelector('.ql-image');
+            const newButton = document.querySelector('.quill-editor-image-btn')?.cloneNode(true);
+            if (imageButton && newButton) {
+                newButton.addEventListener("click", () => { this.openAssetsPickerDialog(); });
+                //newButton.addEventListener("click", () => { this.insertAssets('https://pfs.pepperi.com/50d42a3f-f21d-40fa-8c24-a1359b04dbb7/ad909780-0c23-401e-8e8e-f514cc4f6aa2/Assets/logo.jpg');});
+                imageButton.parentNode?.appendChild(newButton);
+                imageButton.setAttribute('style', 'display:none');
+            }
+        }
+    }
+    openAssetsPickerDialog() {
+        const dialogRef = this.addonBlockLoaderService.loadAddonBlockInDialog({
+            container: this.viewContainerRef,
+            name: 'AssetPicker',
+            hostObject: {
+                selectionType: 'single',
+                allowedAssetsTypes: 'images',
+                inDialog: true
+            },
+            size: 'full-screen',
+            hostEventsCallback: async (event) => {
+                if (event?.action === 'on-save') {
+                    if (event.url) {
+                        this.insertAssets(event.url);
+                    }
+                    dialogRef?.close();
+                }
+                else if (event.action === 'on-cancel') {
+                    dialogRef?.close();
+                }
+            }
+        });
+    }
+    insertAssets(assetUrl) {
+        const range = this.quillEditor.getSelection() || { index: 0, length: 0 };
+        this.quillEditor.insertEmbed(range.index, 'image', assetUrl);
+    }
+    valueChanged(event) {
+        this.valueChange.emit(event);
+    }
+}
+RichTextComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: RichTextComponent, deps: [{ token: i0.ViewContainerRef }, { token: i1$1.PepAddonBlockLoaderService }, { token: RichTextService }], target: i0.ɵɵFactoryTarget.Component });
+RichTextComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: RichTextComponent, selector: "pep-rich-text", inputs: { key: "key", value: "value", label: "label", mandatory: "mandatory", disabled: "disabled", readonly: "readonly", maxFieldCharacters: "maxFieldCharacters", xAlignment: "xAlignment", sanitize: "sanitize", rowSpan: "rowSpan", visible: "visible", isActive: "isActive", showTitle: "showTitle", renderTitle: "renderTitle", renderEnlargeButton: "renderEnlargeButton", layoutType: "layoutType", inlineMode: "inlineMode", useAssetsForImages: "useAssetsForImages", toolbarOptions: "toolbarOptions" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<pep-rich-html-textarea [key]=\"key\" \n                        [value]=\"value\"\n                        [label]=\"label\" \n                        [mandatory]=\"mandatory\"\n                        [disabled]=\"disabled\"\n                        [readonly]=\"readonly\"\n                        [maxFieldCharacters]=\"maxFieldCharacters\" \n                        [xAlignment]=\"xAlignment\" \n                        [toolbarOptions]=\"toolbarOptions\"\n                        [rowSpan]=\"rowSpan\" \n                        [visible]=\"visible\"\n                        \n                        [isActive]=\"isActive\"\n                        [showTitle]=\"showTitle\"\n                        [renderTitle]=\"renderTitle\"\n                        [renderEnlargeButton]=\"renderEnlargeButton\"\n                        [layoutType]=\"layoutType\"\n                        [inlineMode]=\"inlineMode\"\n                        (editorCreated)=\"onEditorOpen($event)\"\n                        (valueChange)=\"valueChanged($event)\">\n</pep-rich-html-textarea>\n<pep-button [sizeType]=\"'sm'\" [classNames]=\"'pep-spacing-element quill-editor-image-btn'\" \n                [iconName]=\"'system_image'\" (buttonClick)=\"openAssetsPickerDialog()\">\n</pep-button>", styles: ["::ng-deep .quill-editor-image-btn{display:none;width:2.5rem!important}\n"], dependencies: [{ kind: "component", type: i3.PepButtonComponent, selector: "pep-button", inputs: ["key", "value", "styleType", "styleStateType", "sizeType", "classNames", "disabled", "iconName", "iconPosition", "visible"], outputs: ["buttonClick"] }, { kind: "component", type: i4.PepRichHtmlTextareaComponent, selector: "pep-rich-html-textarea", inputs: ["key", "value", "label", "mandatory", "disabled", "readonly", "maxFieldCharacters", "xAlignment", "sanitize", "rowSpan", "visible", "form", "isActive", "showTitle", "renderTitle", "renderEnlargeButton", "layoutType", "inlineMode", "toolbarOptions"], outputs: ["valueChange", "editorCreated"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: RichTextComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'pep-rich-text', template: "<pep-rich-html-textarea [key]=\"key\" \n                        [value]=\"value\"\n                        [label]=\"label\" \n                        [mandatory]=\"mandatory\"\n                        [disabled]=\"disabled\"\n                        [readonly]=\"readonly\"\n                        [maxFieldCharacters]=\"maxFieldCharacters\" \n                        [xAlignment]=\"xAlignment\" \n                        [toolbarOptions]=\"toolbarOptions\"\n                        [rowSpan]=\"rowSpan\" \n                        [visible]=\"visible\"\n                        \n                        [isActive]=\"isActive\"\n                        [showTitle]=\"showTitle\"\n                        [renderTitle]=\"renderTitle\"\n                        [renderEnlargeButton]=\"renderEnlargeButton\"\n                        [layoutType]=\"layoutType\"\n                        [inlineMode]=\"inlineMode\"\n                        (editorCreated)=\"onEditorOpen($event)\"\n                        (valueChange)=\"valueChanged($event)\">\n</pep-rich-html-textarea>\n<pep-button [sizeType]=\"'sm'\" [classNames]=\"'pep-spacing-element quill-editor-image-btn'\" \n                [iconName]=\"'system_image'\" (buttonClick)=\"openAssetsPickerDialog()\">\n</pep-button>", styles: ["::ng-deep .quill-editor-image-btn{display:none;width:2.5rem!important}\n"] }]
+        }], ctorParameters: function () { return [{ type: i0.ViewContainerRef }, { type: i1$1.PepAddonBlockLoaderService }, { type: RichTextService }]; }, propDecorators: { key: [{
+                type: Input
+            }], value: [{
+                type: Input
+            }], label: [{
+                type: Input
+            }], mandatory: [{
+                type: Input
+            }], disabled: [{
+                type: Input
+            }], readonly: [{
+                type: Input
+            }], maxFieldCharacters: [{
+                type: Input
+            }], xAlignment: [{
+                type: Input
+            }], sanitize: [{
+                type: Input
+            }], rowSpan: [{
+                type: Input
+            }], visible: [{
+                type: Input
+            }], isActive: [{
+                type: Input
+            }], showTitle: [{
+                type: Input
+            }], renderTitle: [{
+                type: Input
+            }], renderEnlargeButton: [{
+                type: Input
+            }], layoutType: [{
+                type: Input
+            }], inlineMode: [{
+                type: Input
+            }], useAssetsForImages: [{
+                type: Input
+            }], toolbarOptions: [{
+                type: Input
+            }], valueChange: [{
+                type: Output
+            }] } });
+
+const pepIcons = [
+    pepIconSystemImage
+];
+class PepRichTextModule {
+    constructor(pepIconRegistry) {
+        this.pepIconRegistry = pepIconRegistry;
+        this.pepIconRegistry.registerIcons(pepIcons);
+    }
+}
+PepRichTextModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepRichTextModule, deps: [{ token: i1$2.PepIconRegistry }], target: i0.ɵɵFactoryTarget.NgModule });
+PepRichTextModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.0.2", ngImport: i0, type: PepRichTextModule, declarations: [RichTextComponent], imports: [CommonModule,
+        PepNgxLibModule,
+        PepIconModule,
+        PepButtonModule,
+        PepRichHtmlTextareaModule,
+        PepRemoteLoaderModule], exports: [RichTextComponent] });
+PepRichTextModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepRichTextModule, providers: [RichTextService], imports: [CommonModule,
+        PepNgxLibModule,
+        PepIconModule,
+        PepButtonModule,
+        PepRichHtmlTextareaModule,
+        PepRemoteLoaderModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepRichTextModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [
+                        RichTextComponent
+                    ],
+                    imports: [
+                        CommonModule,
+                        PepNgxLibModule,
+                        PepIconModule,
+                        PepButtonModule,
+                        PepRichHtmlTextareaModule,
+                        PepRemoteLoaderModule
+                    ],
+                    providers: [RichTextService],
+                    exports: [RichTextComponent],
+                }]
+        }], ctorParameters: function () { return [{ type: i1$2.PepIconRegistry }]; } });
+
+/*
+ * Public API Surface of ngx-composite-lib/flow-picker-button
+ */
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { PepRichTextModule, RichTextComponent };
+//# sourceMappingURL=pepperi-addons-ngx-composite-lib-rich-text.mjs.map

package/fesm2020/pepperi-addons-ngx-composite-lib-rich-text.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"pepperi-addons-ngx-composite-lib-rich-text.mjs","sources":["../../../projects/ngx-composite-lib/rich-text/rich-text.service.ts","../../../projects/ngx-composite-lib/rich-text/rich-text.component.ts","../../../projects/ngx-composite-lib/rich-text/rich-text.component.html","../../../projects/ngx-composite-lib/rich-text/rich-text.module.ts","../../../projects/ngx-composite-lib/rich-text/public-api.ts","../../../projects/ngx-composite-lib/rich-text/pepperi-addons-ngx-composite-lib-rich-text.ts"],"sourcesContent":["import { Injectable } from \"@angular/core\";\nimport { PepHttpService, PepSessionService } from '@pepperi-addons/ngx-lib';\nimport { lastValueFrom } from \"rxjs\";\n\n@Injectable({\n    providedIn: 'root',\n})\nexport class RichTextService {\n    \n    constructor(\n        private httpService: PepHttpService\n        ) {\n    }\n    \n    async searchFlows(flowKey: string): Promise<any> {\n        return lastValueFrom(await this.httpService.postPapiApiCall('/user_defined_flows/search', { KeyList: [flowKey], Fields: ['Key', 'Name']}));\n    }\n}","import { AfterViewInit, Component, EventEmitter, Input, OnInit, Output, ViewContainerRef } from '@angular/core';\nimport { PepAddonBlockLoaderService } from '@pepperi-addons/ngx-lib/remote-loader';\nimport { RichTextService } from './rich-text.service';\nimport { DEFAULT_HORIZONTAL_ALIGNMENT, PepHorizontalAlignment, PepLayoutType } from '@pepperi-addons/ngx-lib';\nimport { FormGroup } from '@angular/forms';\nimport { IPepRichHtmlTextareaToolbarOptions } from '@pepperi-addons/ngx-lib/rich-html-textarea';\nimport Quill from 'quill';\n\n@Component({\n    selector: 'pep-rich-text',\n    templateUrl: './rich-text.component.html',\n    styleUrls: ['./rich-text.component.scss']\n})\nexport class RichTextComponent implements OnInit {\n\n    @Input() key = '';\n    @Input() value = '';\n    @Input() label = '';\n    @Input() mandatory = false;\n    @Input() disabled = false;\n    @Input() readonly = false;\n    @Input() maxFieldCharacters = 300;\n    @Input() xAlignment: PepHorizontalAlignment = DEFAULT_HORIZONTAL_ALIGNMENT;\n    @Input() sanitize = true;\n    @Input() rowSpan = 1;\n    @Input() visible = true;\n    @Input() isActive = false;\n    @Input() showTitle = true;\n    @Input() renderTitle = true;\n    @Input() renderEnlargeButton = true;\n    @Input() layoutType: PepLayoutType = 'form';\n    @Input() inlineMode = false;\n    @Input() useAssetsForImages = true;\n    \n    private quillEditor: any;\n    protected _toolbarOptions: IPepRichHtmlTextareaToolbarOptions = this.getDefaultToolbarOptions();\n    @Input()\n    get toolbarOptions(): IPepRichHtmlTextareaToolbarOptions {\n        return this._toolbarOptions;\n    }\n    set toolbarOptions(options: IPepRichHtmlTextareaToolbarOptions) {\n        if (options) {\n            this._toolbarOptions = options;\n        }\n    }\n\n    @Output()\n        valueChange: EventEmitter<any> = new EventEmitter<any>();\n\n    constructor(\n        private viewContainerRef: ViewContainerRef,\n        private addonBlockLoaderService: PepAddonBlockLoaderService, \n        private RichTextService: RichTextService) { \n            this.toolbarOptions = this.getDefaultToolbarOptions();\n        }\n\n    ngOnInit() {\n        // Do nothing.\n        \n    }\n\n\n    getDefaultToolbarOptions(): IPepRichHtmlTextareaToolbarOptions {\n        return {\n            font: false,\n            size: false,\n            header: true,\n            bold: true,\n            italic: true,\n            underline: true,\n            strike: false,\n            link: true,\n            image: { useAssetsABI : true },\n            ordered: true,\n            bullet: true,\n            color: true,\n            background: false,\n            align: true\n        };\n    }\n\n    onEditorOpen(editor: any){\n        this.quillEditor = editor;\n\n        if(this.useAssetsForImages){\n            const imageButton = document.querySelector('.ql-image');\n            const newButton = document.querySelector('.quill-editor-image-btn')?.cloneNode(true);\n            \n            if(imageButton && newButton){\n                newButton.addEventListener(\"click\", () => { this.openAssetsPickerDialog();});\n                //newButton.addEventListener(\"click\", () => { this.insertAssets('https://pfs.pepperi.com/50d42a3f-f21d-40fa-8c24-a1359b04dbb7/ad909780-0c23-401e-8e8e-f514cc4f6aa2/Assets/logo.jpg');});\n                imageButton.parentNode?.appendChild(newButton);\n                imageButton.setAttribute('style','display:none');    \n            }\n        }\n    }\n    \n    openAssetsPickerDialog() {\n        const dialogRef = this.addonBlockLoaderService.loadAddonBlockInDialog({\n            container: this.viewContainerRef,\n            name: 'AssetPicker',\n            hostObject: {\n                selectionType: 'single',\n                allowedAssetsTypes: 'images',\n                inDialog: true\n            },\n            size: 'full-screen',\n            hostEventsCallback: async (event) => {\n                if (event?.action === 'on-save') {\n                    if(event.url){\n                        this.insertAssets(event.url);\n                    }\n                    dialogRef?.close();\n                } else if (event.action === 'on-cancel') {\n                    dialogRef?.close();\n                }\n            }\n        });\n    }\n\n    insertAssets(assetUrl: string){\n        const range = this.quillEditor.getSelection() || { index: 0, length: 0};\n        this.quillEditor.insertEmbed(range.index, 'image', assetUrl);\n    }\n\n    valueChanged(event: any){\n        this.valueChange.emit(event);\n    }\n}\n","<pep-rich-html-textarea [key]=\"key\" \n                        [value]=\"value\"\n                        [label]=\"label\" \n                        [mandatory]=\"mandatory\"\n                        [disabled]=\"disabled\"\n                        [readonly]=\"readonly\"\n                        [maxFieldCharacters]=\"maxFieldCharacters\" \n                        [xAlignment]=\"xAlignment\" \n                        [toolbarOptions]=\"toolbarOptions\"\n                        [rowSpan]=\"rowSpan\" \n                        [visible]=\"visible\"\n                        \n                        [isActive]=\"isActive\"\n                        [showTitle]=\"showTitle\"\n                        [renderTitle]=\"renderTitle\"\n                        [renderEnlargeButton]=\"renderEnlargeButton\"\n                        [layoutType]=\"layoutType\"\n                        [inlineMode]=\"inlineMode\"\n                        (editorCreated)=\"onEditorOpen($event)\"\n                        (valueChange)=\"valueChanged($event)\">\n</pep-rich-html-textarea>\n<pep-button [sizeType]=\"'sm'\" [classNames]=\"'pep-spacing-element quill-editor-image-btn'\" \n                [iconName]=\"'system_image'\" (buttonClick)=\"openAssetsPickerDialog()\">\n</pep-button>","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { PepNgxLibModule } from '@pepperi-addons/ngx-lib';\nimport { PepRichHtmlTextareaModule } from '@pepperi-addons/ngx-lib/rich-html-textarea';\nimport { PepRemoteLoaderModule } from '@pepperi-addons/ngx-lib/remote-loader';\nimport { PepButtonModule } from '@pepperi-addons/ngx-lib/button';\nimport { RichTextComponent } from './rich-text.component';\nimport { RichTextService } from './rich-text.service';\nimport { \n    PepIconModule,\n    PepIconRegistry,\n    pepIconSystemImage\n} from '@pepperi-addons/ngx-lib/icon';\n\nconst pepIcons = [\n    pepIconSystemImage\n];\n\n@NgModule({\n    declarations: [\n        RichTextComponent\n    ],\n    imports: [\n        CommonModule,\n        PepNgxLibModule,\n        PepIconModule,\n        PepButtonModule,\n        PepRichHtmlTextareaModule,\n        PepRemoteLoaderModule\n    ],\n    providers: [RichTextService],\n    exports: [RichTextComponent],\n})\nexport class PepRichTextModule {\n    constructor(private pepIconRegistry: PepIconRegistry) {\n        this.pepIconRegistry.registerIcons(pepIcons);\n    }\n}\n","/*\n * Public API Surface of ngx-composite-lib/flow-picker-button\n */\nexport * from './rich-text.module';\nexport * from './rich-text.component';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":["i1","i2.RichTextService"],"mappings":"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"}

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

@@ -22,6 +22,7 @@ class PepShadowSettings {
 class ShadowSettingsComponent {
     constructor(translate) {
         this.translate = translate;
+        this.titleSize = 'xl';
         this._shadow = new PepShadowSettings();
         this.shadowChange = new EventEmitter();
         this.shadowSizes = [];
@@ -71,11 +72,13 @@ 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: { shadow: "shadow" }, outputs: { shadowChange: "shadowChange" }, ngImport: i0, template: "<pep-checkbox class=\"checkbox-as-title\" [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<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>", styles: [":host{width:100%}:host .shadow-size-group,:host .shadow-type-group{display:block;margin-bottom:var(--pep-form-spacing, 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"] }, { kind: "component", type: i3.PepFieldTitleComponent, selector: "pep-field-title", inputs: ["label", "mandatory", "disabled", "maxFieldCharacters", "hint", "xAlignment", "showTitle", "inputLength", "fontBodyType"] }, { 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", "type", "mandatory", "disabled", "readonly", "xAlignment", "rowSpan", "additionalValue", "form", "isActive", "showTitle", "renderTitle", "layoutType", "visible"], outputs: ["valueChange"] }, { kind: "component", type: i3.PepFieldTitleComponent, selector: "pep-field-title", inputs: ["label", "mandatory", "disabled", "maxFieldCharacters", "hint", "xAlignment", "showTitle", "inputLength", "fontBodyType"] }, { 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: "<pep-checkbox class=\"checkbox-as-title\" [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<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>", styles: [":host{width:100%}:host .shadow-size-group,:host .shadow-type-group{display:block;margin-bottom:var(--pep-form-spacing, 1rem)}\n"] }]
-        }], ctorParameters: function () { return [{ type: i1.TranslateService }]; }, propDecorators: { shadow: [{
+            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"] }]
+        }], ctorParameters: function () { return [{ type: i1.TranslateService }]; }, propDecorators: { titleSize: [{
+                type: Input
+            }], shadow: [{
                 type: Input
             }], shadowChange: [{
                 type: Output

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\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","<pep-checkbox class=\"checkbox-as-title\" [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<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>","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":";;;;;;;;;;;;;MAGa,iBAAiB,CAAA;IAK1B,WAAY,CAAA,GAAG,GAAG,KAAK,EAAE,OAAoB,IAAI,EAAE,YAAoC,MAAM,EAAA;AACzF,QAAA,IAAI,CAAC,GAAG,GAAI,GAAG,CAAC;AAChB,QAAA,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;AACjB,QAAA,IAAI,CAAC,SAAS,GAAG,SAAS,CAAC;KAC9B;AACJ;;MCFY,uBAAuB,CAAA;AAsBhC,IAAA,WAAA,CACY,SAA2B,EAAA;QAA3B,IAAS,CAAA,SAAA,GAAT,SAAS,CAAkB;QAtB9B,IAAS,CAAA,SAAA,GAAgB,IAAI,CAAC;AAE/B,QAAA,IAAA,CAAA,OAAO,GAAsB,IAAI,iBAAiB,EAAE,CAAC;AAc7D,QAAA,IAAA,CAAA,YAAY,GAAoC,IAAI,YAAY,EAAqB,CAAC;QAEtF,IAAW,CAAA,WAAA,GAAqB,EAAE,CAAC;QACnC,IAAiB,CAAA,iBAAA,GAAqB,EAAE,CAAC;KAKxC;IArBD,IACI,MAAM,CAAC,KAAwB,EAAA;QAC/B,IAAI,CAAC,KAAK,EAAE;AACR,YAAA,IAAI,CAAC,OAAO,GAAG,IAAI,iBAAiB,EAAE,CAAC;AAC1C,SAAA;AAAM,aAAA;AACH,YAAA,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;AACxB,SAAA;KACJ;AACD,IAAA,IAAI,MAAM,GAAA;QACN,OAAO,IAAI,CAAC,OAAO,CAAC;KACvB;IAaD,QAAQ,GAAA;;AAEJ,QAAA,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,gCAAgC,CAAC,CAAC,SAAS,EAAE,CAAC,IAAI,CAAC,CAAC,QAAQ,KAAI;YAC/E,IAAI,CAAC,WAAW,GAAG;gBACf,EAAE,GAAG,EAAE,IAAI,EAAE,KAAK,EAAE,IAAI,CAAC,SAAS,CAAC,OAAO,CAAC,YAAY,CAAC,EAAE,QAAQ,EAAE,MAAM,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,EAAE;gBACnG,EAAE,GAAG,EAAE,IAAI,EAAE,KAAK,EAAE,IAAI,CAAC,SAAS,CAAC,OAAO,CAAC,YAAY,CAAC,EAAE,QAAQ,EAAE,MAAM,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,EAAE;gBACnG,EAAE,GAAG,EAAE,IAAI,EAAE,KAAK,EAAE,IAAI,CAAC,SAAS,CAAC,OAAO,CAAC,YAAY,CAAC,EAAE,QAAQ,EAAE,MAAM,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,EAAE;gBACnG,EAAE,GAAG,EAAE,IAAI,EAAE,KAAK,EAAE,IAAI,CAAC,SAAS,CAAC,OAAO,CAAC,YAAY,CAAC,EAAE,QAAQ,EAAE,MAAM,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,EAAE;aACtG,CAAC;YAEF,IAAI,CAAC,iBAAiB,GAAG;AACrB,gBAAA,EAAE,GAAG,EAAE,MAAM,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,MAAM,IAAI,CAAC,iBAAiB,CAAC,MAAM,CAAC,EAAE;gBAChF,EAAE,GAAG,EAAE,SAAS,EAAE,KAAK,EAAE,IAAI,CAAC,SAAS,CAAC,OAAO,CAAC,mCAAmC,CAAC,EAAE,QAAQ,EAAE,MAAM,IAAI,CAAC,iBAAiB,CAAC,SAAS,CAAC,EAAE;gBACzI,EAAE,GAAG,EAAE,MAAM,EAAE,KAAK,EAAE,IAAI,CAAC,SAAS,CAAC,OAAO,CAAC,gCAAgC,CAAC,EAAE,QAAQ,EAAE,MAAM,IAAI,CAAC,iBAAiB,CAAC,MAAM,CAAC,EAAE;aACnI,CAAC;AACN,SAAC,CAAC,CAAC;KACN;IAGO,iBAAiB,GAAA;QACrB,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;KACvC;AAED,IAAA,YAAY,CAAC,KAAc,EAAA;AACvB,QAAA,IAAI,CAAC,MAAM,CAAC,GAAG,GAAG,KAAK,CAAC;QACxB,IAAI,CAAC,iBAAiB,EAAE,CAAC;KAC5B;AAED,IAAA,YAAY,CAAC,KAAkB,EAAA;AAC3B,QAAA,IAAI,CAAC,MAAM,CAAC,IAAI,GAAG,KAAK,CAAC;QACzB,IAAI,CAAC,iBAAiB,EAAE,CAAC;KAC5B;AAED,IAAA,iBAAiB,CAAC,KAA6B,EAAA;AAC3C,QAAA,IAAI,CAAC,MAAM,CAAC,SAAS,GAAG,KAAK,CAAC;QAC9B,IAAI,CAAC,iBAAiB,EAAE,CAAC;KAC5B;;oHA/DQ,uBAAuB,EAAA,IAAA,EAAA,CAAA,EAAA,KAAA,EAAA,EAAA,CAAA,gBAAA,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAvB,uBAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,uBAAuB,4JCXpC,6gCAYM,EAAA,MAAA,EAAA,CAAA,kEAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,oBAAA,EAAA,QAAA,EAAA,cAAA,EAAA,MAAA,EAAA,CAAA,KAAA,EAAA,OAAA,EAAA,OAAA,EAAA,MAAA,EAAA,WAAA,EAAA,UAAA,EAAA,UAAA,EAAA,YAAA,EAAA,SAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,UAAA,EAAA,WAAA,EAAA,aAAA,EAAA,YAAA,EAAA,SAAA,CAAA,EAAA,OAAA,EAAA,CAAA,aAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,sBAAA,EAAA,QAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,WAAA,EAAA,UAAA,EAAA,oBAAA,EAAA,MAAA,EAAA,YAAA,EAAA,WAAA,EAAA,aAAA,EAAA,cAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,wBAAA,EAAA,QAAA,EAAA,mBAAA,EAAA,MAAA,EAAA,CAAA,UAAA,EAAA,WAAA,EAAA,UAAA,EAAA,SAAA,EAAA,iBAAA,EAAA,iBAAA,EAAA,mBAAA,EAAA,SAAA,CAAA,EAAA,OAAA,EAAA,CAAA,aAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,MAAA,EAAA,IAAA,EAAA,EAAA,CAAA,aAAA,EAAA,IAAA,EAAA,WAAA,EAAA,CAAA,EAAA,CAAA,CAAA;2FDDO,uBAAuB,EAAA,UAAA,EAAA,CAAA;kBALnC,SAAS;+BACI,qBAAqB,EAAA,QAAA,EAAA,6gCAAA,EAAA,MAAA,EAAA,CAAA,kEAAA,CAAA,EAAA,CAAA;uGAKtB,SAAS,EAAA,CAAA;sBAAjB,KAAK;gBAIF,MAAM,EAAA,CAAA;sBADT,KAAK;gBAaN,YAAY,EAAA,CAAA;sBADX,MAAM;;;MEJE,uBAAuB,CAAA;;oHAAvB,uBAAuB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA;qHAAvB,uBAAuB,EAAA,YAAA,EAAA,CAZ5B,uBAAuB,CAAA,EAAA,OAAA,EAAA,CAGvB,YAAY;QACZ,eAAe;QACf,iBAAiB;QACjB,mBAAmB;QACnB,qBAAqB;AACrB,QAAA,eAAe,aAET,uBAAuB,CAAA,EAAA,CAAA,CAAA;AAExB,uBAAA,CAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,uBAAuB,YAT5B,YAAY;QACZ,eAAe;QACf,iBAAiB;QACjB,mBAAmB;QACnB,qBAAqB;QACrB,eAAe,CAAA,EAAA,CAAA,CAAA;2FAIV,uBAAuB,EAAA,UAAA,EAAA,CAAA;kBAdnC,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;AACN,oBAAA,YAAY,EAAE;wBACV,uBAAuB;AAC1B,qBAAA;AACD,oBAAA,OAAO,EAAE;wBACL,YAAY;wBACZ,eAAe;wBACf,iBAAiB;wBACjB,mBAAmB;wBACnB,qBAAqB;wBACrB,eAAe;AAClB,qBAAA;oBACD,OAAO,EAAE,CAAC,uBAAuB,CAAC;AACrC,iBAAA,CAAA;;;ACtBD;;AAEG;;ACFH;;AAEG;;;;"}

package/fesm2020/pepperi-addons-ngx-composite-lib-show-if-badge.mjs

@@ -0,0 +1,100 @@
+import * as i0 from '@angular/core';
+import { Component, Input, NgModule } from '@angular/core';
+import * as i2 from '@angular/common';
+import { CommonModule } from '@angular/common';
+import * as i1 from '@pepperi-addons/ngx-lib';
+import { PepNgxLibModule } from '@pepperi-addons/ngx-lib';
+import * as i1$1 from '@pepperi-addons/ngx-lib/icon';
+import { pepIconSystemView, PepIconModule } from '@pepperi-addons/ngx-lib/icon';
+import * as i2$1 from '@ngx-translate/core';
+import { TranslateModule } from '@ngx-translate/core';
+import * as i4 from '@angular/material/icon';
+import { MatIconModule } from '@angular/material/icon';
+import { MatBadgeModule } from '@angular/material/badge';
+
+class ShowIfBadgeComponent {
+    constructor(layoutService) {
+        this.layoutService = layoutService;
+        this.showIf = false;
+        /**
+        * If you want to show an icon in the button then select an icon form the provided icon list
+        *
+        * @type {PepIconType} See {@link PepIconType}
+        * @memberof PepButtonComponent
+        */
+        this.iconName = pepIconSystemView.name;
+        this.backgroundColor = 'hsl(0,0%,0%)';
+        this.isRtl = false;
+        this.isRtl = this.layoutService.isRtl();
+    }
+    ngOnInit() {
+        setTimeout(() => {
+            const badge = document.getElementsByClassName("mat-badge-content")[0];
+            if (badge) {
+                badge.setAttribute('style', 'background-color:' + this.backgroundColor + '!important');
+            }
+        }, 0);
+    }
+}
+ShowIfBadgeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: ShowIfBadgeComponent, deps: [{ token: i1.PepLayoutService }], target: i0.ɵɵFactoryTarget.Component });
+ShowIfBadgeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: ShowIfBadgeComponent, selector: "pep-show-if-badge", inputs: { showIf: "showIf", iconName: "iconName", backgroundColor: "backgroundColor" }, ngImport: i0, template: "<div *ngIf=\"showIf\" class=\"show-if-badge\" [ngClass]=\"{ 'rtl-direction': isRtl }\">\n    <mat-icon class=\"mat-badge-content\">\n        <pep-icon [name]=\"iconName\"></pep-icon>\n    </mat-icon>\n</div>", styles: [".show-if-badge{position:relative;right:0}.show-if-badge .mat-badge-content{font-weight:var(--pep-font-weight-bold, 600);background:hsl(var(--pep-color-strong-h, 78),var(--pep-color-strong-s, 87%),var(--pep-color-strong-l, 27%));box-shadow:var(--pep-shadow-sm-offset, 0 .25rem .5rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.08);color:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%));background-color:hsl(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%))!important;box-shadow:var(--pep-shadow-sm-offset, 0 .25rem .5rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.32)}.show-if-badge .mat-badge-content .svg-icon{fill:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}.show-if-badge .mat-badge-content .svg-icon.stroke{fill:unset;stroke:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}.show-if-badge.rtl-direction{right:unset;left:0}.show-if-badge .mat-icon{right:0;height:2.5rem;width:2.5rem;margin-top:-1rem;margin-right:-1.25rem}.show-if-badge .mat-icon ::ng-deep .svg-icon{fill:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%));width:1.75rem;height:1.75rem}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i1$1.PepIconComponent, selector: "pep-icon", inputs: ["spin", "name", "fill"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: ShowIfBadgeComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'pep-show-if-badge', template: "<div *ngIf=\"showIf\" class=\"show-if-badge\" [ngClass]=\"{ 'rtl-direction': isRtl }\">\n    <mat-icon class=\"mat-badge-content\">\n        <pep-icon [name]=\"iconName\"></pep-icon>\n    </mat-icon>\n</div>", styles: [".show-if-badge{position:relative;right:0}.show-if-badge .mat-badge-content{font-weight:var(--pep-font-weight-bold, 600);background:hsl(var(--pep-color-strong-h, 78),var(--pep-color-strong-s, 87%),var(--pep-color-strong-l, 27%));box-shadow:var(--pep-shadow-sm-offset, 0 .25rem .5rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.08);color:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%));background-color:hsl(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%))!important;box-shadow:var(--pep-shadow-sm-offset, 0 .25rem .5rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.32)}.show-if-badge .mat-badge-content .svg-icon{fill:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}.show-if-badge .mat-badge-content .svg-icon.stroke{fill:unset;stroke:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}.show-if-badge.rtl-direction{right:unset;left:0}.show-if-badge .mat-icon{right:0;height:2.5rem;width:2.5rem;margin-top:-1rem;margin-right:-1.25rem}.show-if-badge .mat-icon ::ng-deep .svg-icon{fill:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%));width:1.75rem;height:1.75rem}\n"] }]
+        }], ctorParameters: function () { return [{ type: i1.PepLayoutService }]; }, propDecorators: { showIf: [{
+                type: Input
+            }], iconName: [{
+                type: Input
+            }], backgroundColor: [{
+                type: Input
+            }] } });
+
+const pepIcons = [
+    pepIconSystemView
+];
+class PepShowIfBadgeModule {
+    constructor(pepIconRegistry) {
+        this.pepIconRegistry = pepIconRegistry;
+        this.pepIconRegistry.registerIcons(pepIcons);
+    }
+}
+PepShowIfBadgeModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepShowIfBadgeModule, deps: [{ token: i1$1.PepIconRegistry }], target: i0.ɵɵFactoryTarget.NgModule });
+PepShowIfBadgeModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.0.2", ngImport: i0, type: PepShowIfBadgeModule, declarations: [ShowIfBadgeComponent], imports: [CommonModule,
+        PepNgxLibModule,
+        PepIconModule,
+        MatIconModule,
+        MatBadgeModule, i2$1.TranslateModule], exports: [ShowIfBadgeComponent] });
+PepShowIfBadgeModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepShowIfBadgeModule, imports: [CommonModule,
+        PepNgxLibModule,
+        PepIconModule,
+        MatIconModule,
+        MatBadgeModule,
+        TranslateModule.forChild()] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepShowIfBadgeModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [
+                        ShowIfBadgeComponent
+                    ],
+                    imports: [
+                        CommonModule,
+                        PepNgxLibModule,
+                        PepIconModule,
+                        MatIconModule,
+                        MatBadgeModule,
+                        TranslateModule.forChild(),
+                    ],
+                    exports: [ShowIfBadgeComponent]
+                }]
+        }], ctorParameters: function () { return [{ type: i1$1.PepIconRegistry }]; } });
+
+/*
+ * Public API Surface of ngx-composite-lib/flow-picker-button
+ */
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { PepShowIfBadgeModule, ShowIfBadgeComponent };
+//# sourceMappingURL=pepperi-addons-ngx-composite-lib-show-if-badge.mjs.map

package/fesm2020/pepperi-addons-ngx-composite-lib-show-if-badge.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"pepperi-addons-ngx-composite-lib-show-if-badge.mjs","sources":["../../../projects/ngx-composite-lib/show-if-badge/show-if-badge.component.ts","../../../projects/ngx-composite-lib/show-if-badge/show-if-badge.component.html","../../../projects/ngx-composite-lib/show-if-badge/show-if-badge.module.ts","../../../projects/ngx-composite-lib/show-if-badge/public-api.ts","../../../projects/ngx-composite-lib/show-if-badge/pepperi-addons-ngx-composite-lib-show-if-badge.ts"],"sourcesContent":["import { Component, Input, OnInit } from '@angular/core';\n\nimport { PepLayoutService } from '@pepperi-addons/ngx-lib';\nimport { PepIconType, pepIconSystemView } from '@pepperi-addons/ngx-lib/icon';\nimport { PepColorSettings } from '@pepperi-addons/ngx-composite-lib/color-settings';\n\n\n@Component({\n    selector: 'pep-show-if-badge',\n    templateUrl: './show-if-badge.component.html',\n    styleUrls: ['./show-if-badge.component.scss']\n})\n\nexport class ShowIfBadgeComponent {\n    @Input() showIf = false;\n   \n     /**\n     * If you want to show an icon in the button then select an icon form the provided icon list\n     *\n     * @type {PepIconType} See {@link PepIconType}\n     * @memberof PepButtonComponent\n     */\n   @Input() iconName: PepIconType = pepIconSystemView.name;\n   @Input() backgroundColor = 'hsl(0,0%,0%)';\n   \n    \n    protected isRtl = false;\n    \n    constructor(protected layoutService: PepLayoutService) { \n        this.isRtl = this.layoutService.isRtl();\n    }\n\n    ngOnInit(){\n        setTimeout(() => {\n            const badge = document.getElementsByClassName(\"mat-badge-content\")[0] as HTMLElement;\n                if(badge){\n                    badge.setAttribute('style', 'background-color:'+ this.backgroundColor + '!important');\n                }\n          }, 0);\n    }\n}\n","<div *ngIf=\"showIf\" class=\"show-if-badge\" [ngClass]=\"{ 'rtl-direction': isRtl }\">\n    <mat-icon class=\"mat-badge-content\">\n        <pep-icon [name]=\"iconName\"></pep-icon>\n    </mat-icon>\n</div>","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\n\nimport { PepNgxLibModule, PepAddonService } from '@pepperi-addons/ngx-lib';\nimport { PepIconModule, PepIconRegistry, pepIconSystemView} from '@pepperi-addons/ngx-lib/icon';\n\nimport { TranslateModule } from '@ngx-translate/core';\n\nimport { MatIconModule } from '@angular/material/icon';\nimport { MatBadgeModule } from '@angular/material/badge';\n\nimport { ShowIfBadgeComponent } from './show-if-badge.component';\n\nconst pepIcons = [\n    pepIconSystemView\n];\n\n@NgModule({\n    declarations: [\n        ShowIfBadgeComponent\n    ],\n    imports: [\n        CommonModule,\n        PepNgxLibModule,\n        PepIconModule,\n        MatIconModule,\n        MatBadgeModule,\n        TranslateModule.forChild(),\n    ],\n    exports: [ShowIfBadgeComponent]\n})\nexport class PepShowIfBadgeModule { \n\nconstructor(\n    private pepIconRegistry: PepIconRegistry\n    ) {\n        this.pepIconRegistry.registerIcons(pepIcons);\n    }\n}\n","/*\n * Public API Surface of ngx-composite-lib/flow-picker-button\n */\nexport * from './show-if-badge.module';\nexport * from './show-if-badge.component';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":["i3","i1"],"mappings":"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"}

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

@@ -61,9 +61,10 @@ class PepResetConfigurationFieldDirective {
         const css = `
             display: flex;
             justify-content: flex-end;
-            float: ${this.getFloat()};
-            margin-bottom: 1rem;
-        `;
+            `;
+        // This was removed.
+        // float: ${this.getFloat()};
+        // margin-bottom: 1rem;
         this.buttonContainer.setAttribute("style", css);
     }
     setButtonStyle(button) {