npm - @pepperi-addons/ngx-composite-lib - Versions diffs - 0.4.2-beta.99 → 0.5.0-ng15.1 - Mend

@pepperi-addons/ngx-composite-lib 0.4.2-beta.99 → 0.5.0-ng15.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (195) hide show

package/fesm2015/pepperi-addons-ngx-composite-lib.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"pepperi-addons-ngx-composite-lib.mjs","sources":["../../../projects/ngx-composite-lib/src/core/common/directives/reset-configuration-field.directive.ts","../../../projects/ngx-composite-lib/src/core/common/services/utilities.service.ts","../../../projects/ngx-composite-lib/src/core/common/services/dimx.service.ts","../../../projects/ngx-composite-lib/src/core/common/services/public-api.ts","../../../projects/ngx-composite-lib/src/core/common/services/index.ts","../../../projects/ngx-composite-lib/src/ngx-composite-lib.module.ts","../../../projects/ngx-composite-lib/src/core/common/directives/public-api.ts","../../../projects/ngx-composite-lib/src/core/common/directives/index.ts","../../../projects/ngx-composite-lib/src/core/common/public-api.ts","../../../projects/ngx-composite-lib/src/core/common/index.ts","../../../projects/ngx-composite-lib/src/core/public-api.ts","../../../projects/ngx-composite-lib/src/core/index.ts","../../../projects/ngx-composite-lib/src/public-api.ts","../../../projects/ngx-composite-lib/src/pepperi-addons-ngx-composite-lib.ts"],"sourcesContent":["import { Directive, HostListener, ElementRef, AfterViewInit, TemplateRef, ViewContainerRef, Renderer2, Output, EventEmitter, Input, OnDestroy } from '@angular/core';\r\nimport { TranslateService } from '@ngx-translate/core';\r\nimport { PepSizeType, PepStyleStateType, PepStyleType } from '@pepperi-addons/ngx-lib';\r\nimport { PepIconService, pepIconDeviceResponsive } from '@pepperi-addons/ngx-lib/icon';\r\n\r\n\r\n@Directive({\r\n selector: '[pepResetConfigurationField]',\r\n})\r\nexport class PepResetConfigurationFieldDirective implements AfterViewInit, OnDestroy {\r\n @Input('pepResetConfigurationField') resetFieldKey = '';\r\n @Input() resetHostEvents: EventEmitter<any> = new EventEmitter();\r\n \r\n private _disabled = false;\r\n @Input() \r\n set disabled(value: boolean) {\r\n this._disabled = value;\r\n // this.renderer.setStyle(this.buttonContainer, 'visibility', this.getVisibility());\r\n this.setButtonStyle(this.resetButton);\r\n }\r\n get disabled(): boolean {\r\n return this._disabled;\r\n }\r\n\r\n private _hideReset = false;\r\n @Input() \r\n set hideReset(value: boolean) {\r\n this._hideReset = value;\r\n // this.renderer.setStyle(this.buttonContainer, 'visibility', this.getVisibility());\r\n this.setButtonStyle(this.resetButton);\r\n }\r\n get hideReset(): boolean {\r\n return this._hideReset;\r\n }\r\n\r\n private _dir: 'rtl' \| 'ltr' = 'ltr';\r\n @Input() \r\n set dir(value: 'rtl' \| 'ltr') {\r\n this._dir = value;\r\n this.renderer.setStyle(this.buttonContainer, 'float', this.getFloat());\r\n }\r\n get dir(): 'rtl' \| 'ltr' {\r\n return this._dir;\r\n }\r\n\r\n // styleType: PepStyleType = 'weak';\r\n // styleStateType: PepStyleStateType = 'system';\r\n sizeType: PepSizeType = 'sm';\r\n resetPosition = 'bottom-end';\r\n \r\n private unlistener: (() => void) \| undefined;\r\n private buttonContainer!: HTMLDivElement;\r\n private resetButton!: HTMLButtonElement;\r\n\r\n constructor(\r\n private renderer:Renderer2,\r\n private element: ElementRef,\r\n private pepIconService: PepIconService,\r\n private translate: TranslateService) {\r\n // Create the buton container.\r\n this.buttonContainer = this.renderer.createElement('div');\r\n\r\n this.translate.get('GENERAL.RESET_HINT').toPromise().then(hint => {\r\n this.renderer.setAttribute(this.buttonContainer, 'title', hint);\r\n });\r\n }\r\n\r\n private getVisibility() {\r\n return this.disabled \|\| this.hideReset ? 'hidden' : 'visible';\r\n }\r\n\r\n private getFloat() {\r\n return this.dir === 'rtl' ? 'left' : 'right';\r\n }\r\n\r\n private setButtonContainerStyle() {\r\n const css = `\r\n display: flex;\r\n justify-content: flex-end;\r\n `;\r\n \r\n // This was removed.\r\n // float: ${this.getFloat()};\r\n // margin-bottom: 1rem;\r\n\r\n this.buttonContainer.setAttribute(\"style\", css);\r\n }\r\n\r\n private setButtonStyle(button: HTMLButtonElement) {\r\n if (button) {\r\n const css = `\r\n display: flex !important;\r\n align-items: center !important;\r\n height: 1rem !important;\r\n line-height: unset !important;\r\n padding: unset !important;\r\n background: unset !important;\r\n font-size: var(--pep-button-2xs-font-size) !important;\r\n visibility: ${this.getVisibility()};\r\n `;\r\n \r\n button.setAttribute(\"style\", css);\r\n }\r\n }\r\n\r\n private setSvgStyle(svg: SVGElement) {\r\n const css = `\r\n transform: rotate(270deg);\r\n width: 0.75rem;\r\n `;\r\n svg.setAttribute('style', css);\r\n }\r\n\r\n private async getResetElement(): Promise<HTMLElement> {\r\n this.setButtonContainerStyle();\r\n this.renderer.addClass(this.buttonContainer, 'pep-reset-configuration-field-container');\r\n\r\n // Append button\r\n this.resetButton = this.renderer.createElement('button');\r\n await this.translate.get('ACTIONS.RESET').toPromise().then(resetText => {\r\n const buttonText = this.renderer.createText(resetText);\r\n this.renderer.appendChild(this.resetButton, buttonText);\r\n });\r\n \r\n this.renderer.addClass(this.resetButton, 'pep-button');\r\n // this.renderer.addClass(button, this.styleType);\r\n // this.renderer.addClass(button, this.styleStateType);\r\n this.renderer.addClass(this.resetButton, 'color-link');\r\n this.renderer.addClass(this.resetButton, this.sizeType);\r\n this.setButtonStyle(this.resetButton);\r\n // this.renderer.addClass(button, 'reset-configuration-field-button');\r\n \r\n this.unlistener = this.renderer.listen(this.resetButton, 'click', () => this.onResetClicked());\r\n \r\n this.renderer.appendChild(this.buttonContainer, this.resetButton);\r\n\r\n // Append svg\r\n const svgIcon = this.pepIconService.getSvgIcon(pepIconDeviceResponsive.name);\r\n this.setSvgStyle(svgIcon);\r\n this.renderer.appendChild(this.buttonContainer, svgIcon);\r\n\r\n return this.buttonContainer;\r\n }\r\n \r\n ngAfterViewInit(): void {\r\n this.getResetElement().then(element => {\r\n if (this.resetPosition === 'top-end' && this.element.nativeElement.children?.length > 0) {\r\n this.renderer.insertBefore(this.element.nativeElement, element, this.element.nativeElement.children[0]);\r\n } else {\r\n this.renderer.appendChild(this.element.nativeElement, element);\r\n }\r\n });\r\n }\r\n\r\n ngOnDestroy() {\r\n if (this.unlistener) {\r\n this.unlistener();\r\n }\r\n }\r\n\r\n onResetClicked() {\r\n this.resetHostEvents.emit({\r\n action: 'set-configuration-field',\r\n key: this.resetFieldKey,\r\n value: undefined\r\n });\r\n }\r\n}\r\n","import { Injectable } from '@angular/core';\r\n\r\n/\r\n This service is for utillity usege.\r\n/\r\n@Injectable({\r\n providedIn: 'root',\r\n})\r\nexport class PepCompositeLibUtilitiesService {\r\n constructor(\r\n // private sessionService: PepSessionService,\r\n // private httpService: PepHttpService,\r\n // private loaderService: PepLoaderService\r\n ) {\r\n //\r\n }\r\n}\r\n","import { Injectable, ViewContainerRef } from \"@angular/core\";\r\nimport { PepAddonBlockLoaderService } from \"@pepperi-addons/ngx-lib/remote-loader\";\r\n\r\nexport interface DIMXHostObject {\r\n DIMXAddonUUID: string;\r\n DIMXResource: string;\r\n}\r\n\r\nexport interface DIMXImportOptions {\r\n OverwriteObject?: boolean;\r\n Delimiter?: string;\r\n OwnerID?: string;\r\n ActionID?: string;\r\n AdditionalData?: any;\r\n}\r\n\r\nexport interface DIMXRecursiveImportOptions {\r\n OverwriteObject?: boolean;\r\n OwnerID?: string;\r\n ActionID?: string;\r\n AdditionalData?: any;\r\n}\r\n\r\nexport interface DIMXExportOptions {\r\n DIMXExportFormat?: string;\r\n DIMXExportIncludeDeleted?: boolean;\r\n DIMXExportFileName?: string;\r\n DIMXExportWhere?: string;\r\n DIMXExportFields?: string;\r\n DIMXExportDelimiter?: string;\r\n ActionID?: string;\r\n AdditionalData?: any;\r\n}\r\n\r\nexport interface DIMXRecursiveExportOptions {\r\n DIMXExportIncludeDeleted?: boolean;\r\n DIMXExportFileName?: string;\r\n DIMXExportWhere?: string;\r\n DIMXExportFields?: string;\r\n ActionID?: string;\r\n AdditionalData?: any;\r\n}\r\n\r\n@Injectable()\r\nexport class PepDIMXHelperService {\r\n private dimxFunctions!: {\r\n DIMXImport: (options?: DIMXImportOptions) => void,\r\n DIMXRecursiveImport: (options?: DIMXRecursiveImportOptions) => void,\r\n DIMXExport: (options?: DIMXExportOptions) => void,\r\n DIMXRecursiveExport: (options?: DIMXRecursiveExportOptions) => void\r\n };\r\n\r\n constructor(\r\n private addonBlockLoaderService: PepAddonBlockLoaderService\r\n ) {\r\n }\r\n\r\n register(viewContainerRef: ViewContainerRef, dimxHostObject: DIMXHostObject, onDIMXProcessDoneCallback: (dimxEvent: any) => void) {\r\n return this.addonBlockLoaderService.loadAddonBlockInContainer({\r\n container: viewContainerRef,\r\n name: 'DIMX',\r\n hostObject: dimxHostObject,\r\n hostEventsCallback: (event: any) => {\r\n if (event.action === 'DIMXFunctionsRegister') {\r\n this.dimxFunctions = event.value;\r\n } else if (event.action === 'DIMXProcessDone') {\r\n onDIMXProcessDoneCallback(event.value);\r\n } else {\r\n console.error('Unknown event action: ' + event.action);\r\n }\r\n }\r\n });\r\n }\r\n\r\n import(options?: DIMXImportOptions) {\r\n if (typeof (this.dimxFunctions?.DIMXImport) === 'function') {\r\n this.dimxFunctions.DIMXImport(options);\r\n } else {\r\n console.error('DIMXImport function not found, are you registered?');\r\n }\r\n }\r\n\r\n recursive_import(options?: DIMXRecursiveImportOptions) {\r\n if (typeof (this.dimxFunctions?.DIMXRecursiveImport) === 'function') {\r\n this.dimxFunctions.DIMXRecursiveImport(options);\r\n } else {\r\n console.error('DIMXRecursiveImport function not found, are you registered?');\r\n }\r\n }\r\n\r\n export(options?: DIMXExportOptions) {\r\n if (typeof (this.dimxFunctions?.DIMXExport) === 'function') {\r\n this.dimxFunctions.DIMXExport(options);\r\n } else {\r\n console.error('DIMXExport function not found, are you registered?');\r\n }\r\n }\r\n\r\n recursive_export(options?: DIMXRecursiveExportOptions) {\r\n if (typeof (this.dimxFunctions?.DIMXRecursiveExport) === 'function') {\r\n this.dimxFunctions.DIMXRecursiveExport(options);\r\n } else {\r\n console.error('DIMXRecursiveExport function not found, are you registered?');\r\n }\r\n }\r\n}","/\n Public API Surface of ngx-composite-lib/core/common/services\n /\nexport from './utilities.service';\nexport * from './dimx.service';\n","/\n export from ngx-composite-lib/core/common/services\n /\nexport from './public-api';\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\n//import { TranslateModule } from '@ngx-translate/core';\n// import { HttpClientModule } from '@angular/common/http';\n// import { ReactiveFormsModule } from '@angular/forms';\nimport { PepResetConfigurationFieldDirective } from './core/common/directives/reset-configuration-field.directive';\nimport { PepDIMXHelperService, PepCompositeLibUtilitiesService } from './core/common/services/index';\n\nimport { PepRemoteLoaderModule } from '@pepperi-addons/ngx-lib/remote-loader';\n\nimport {\n PepIconModule,\n PepIconRegistry,\n pepIconDeviceResponsive,\n} from '@pepperi-addons/ngx-lib/icon';\n\nconst utilitiesList = [\n PepResetConfigurationFieldDirective\n];\n\n@NgModule({\n declarations: [\n utilitiesList\n ],\n imports: [\n CommonModule,\n PepIconModule,\n PepRemoteLoaderModule,\n ],\n exports: [\n utilitiesList\n //TranslateModule\n ],\n providers: [\n PepDIMXHelperService,\n PepCompositeLibUtilitiesService\n ]\n})\nexport class PepNgxCompositeLibModule {\n constructor(\n private pepIconRegistry: PepIconRegistry\n ) {\n this.pepIconRegistry.registerIcons([\n pepIconDeviceResponsive\n ]);\n }\n}\n","/\n Public API Surface of ngx-composite-lib/core/common/directives\n /\nexport from '../directives/reset-configuration-field.directive';\n","/\n export from ngx-composite-lib/core/common/directives\n /\nexport from './public-api';\n","/\n Public API Surface of ngx-composite-lib/core/common\n /\nexport from './services/index';\nexport * from './directives/index';\n","/\n export from ngx-composite-lib/core/common\n /\nexport from './public-api';\n","/\n Public API Surface of ngx-composite-lib/core\n /\nexport from './common/index';","/\n export from ngx-composite-lib/core\n /\nexport from './public-api';\n","/\n Public API Surface of ngx-composite-lib\n /\nexport from './ngx-composite-lib.module';\nexport * from './core/index';\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":["i1"],"mappings":"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"}
1	+ {"version":3,"file":"pepperi-addons-ngx-composite-lib.mjs","sources":["../../../projects/ngx-composite-lib/src/core/common/directives/reset-configuration-field.directive.ts","../../../projects/ngx-composite-lib/src/core/common/services/utilities.service.ts","../../../projects/ngx-composite-lib/src/core/common/services/dimx.service.ts","../../../projects/ngx-composite-lib/src/core/common/services/public-api.ts","../../../projects/ngx-composite-lib/src/core/common/services/index.ts","../../../projects/ngx-composite-lib/src/ngx-composite-lib.module.ts","../../../projects/ngx-composite-lib/src/core/common/directives/public-api.ts","../../../projects/ngx-composite-lib/src/core/common/directives/index.ts","../../../projects/ngx-composite-lib/src/core/common/public-api.ts","../../../projects/ngx-composite-lib/src/core/common/index.ts","../../../projects/ngx-composite-lib/src/core/public-api.ts","../../../projects/ngx-composite-lib/src/core/index.ts","../../../projects/ngx-composite-lib/src/public-api.ts","../../../projects/ngx-composite-lib/src/pepperi-addons-ngx-composite-lib.ts"],"sourcesContent":["import { Directive, HostListener, ElementRef, AfterViewInit, TemplateRef, ViewContainerRef, Renderer2, Output, EventEmitter, Input, OnDestroy } from '@angular/core';\r\nimport { TranslateService } from '@ngx-translate/core';\r\nimport { PepSizeType, PepStyleStateType, PepStyleType } from '@pepperi-addons/ngx-lib';\r\nimport { PepIconService, pepIconDeviceResponsive } from '@pepperi-addons/ngx-lib/icon';\r\n\r\n\r\n@Directive({\r\n selector: '[pepResetConfigurationField]',\r\n})\r\nexport class PepResetConfigurationFieldDirective implements AfterViewInit, OnDestroy {\r\n @Input('pepResetConfigurationField') resetFieldKey = '';\r\n @Input() resetHostEvents: EventEmitter<any> = new EventEmitter();\r\n \r\n private _disabled = false;\r\n @Input() \r\n set disabled(value: boolean) {\r\n this._disabled = value;\r\n // this.renderer.setStyle(this.buttonContainer, 'visibility', this.getVisibility());\r\n this.setButtonStyle(this.resetButton);\r\n }\r\n get disabled(): boolean {\r\n return this._disabled;\r\n }\r\n\r\n private _hideReset = false;\r\n @Input() \r\n set hideReset(value: boolean) {\r\n this._hideReset = value;\r\n // this.renderer.setStyle(this.buttonContainer, 'visibility', this.getVisibility());\r\n this.setButtonStyle(this.resetButton);\r\n }\r\n get hideReset(): boolean {\r\n return this._hideReset;\r\n }\r\n\r\n private _dir: 'rtl' \| 'ltr' = 'ltr';\r\n @Input() \r\n set dir(value: 'rtl' \| 'ltr') {\r\n this._dir = value;\r\n this.renderer.setStyle(this.buttonContainer, 'float', this.getFloat());\r\n }\r\n get dir(): 'rtl' \| 'ltr' {\r\n return this._dir;\r\n }\r\n\r\n // styleType: PepStyleType = 'weak';\r\n // styleStateType: PepStyleStateType = 'system';\r\n sizeType: PepSizeType = 'sm';\r\n resetPosition = 'bottom-end';\r\n \r\n private unlistener: (() => void) \| undefined;\r\n private buttonContainer!: HTMLDivElement;\r\n private resetButton!: HTMLButtonElement;\r\n\r\n constructor(\r\n private renderer:Renderer2,\r\n private element: ElementRef,\r\n private pepIconService: PepIconService,\r\n private translate: TranslateService) {\r\n // Create the buton container.\r\n this.buttonContainer = this.renderer.createElement('div');\r\n\r\n this.translate.get('GENERAL.RESET_HINT').toPromise().then(hint => {\r\n this.renderer.setAttribute(this.buttonContainer, 'title', hint);\r\n });\r\n }\r\n\r\n private getVisibility() {\r\n return this.disabled \|\| this.hideReset ? 'hidden' : 'visible';\r\n }\r\n\r\n private getFloat() {\r\n return this.dir === 'rtl' ? 'left' : 'right';\r\n }\r\n\r\n private setButtonContainerStyle() {\r\n const css = `\r\n display: flex;\r\n justify-content: flex-end;\r\n `;\r\n \r\n // This was removed.\r\n // float: ${this.getFloat()};\r\n // margin-bottom: 1rem;\r\n\r\n this.buttonContainer.setAttribute(\"style\", css);\r\n }\r\n\r\n private setButtonStyle(button: HTMLButtonElement) {\r\n if (button) {\r\n const css = `\r\n display: flex !important;\r\n align-items: center !important;\r\n height: 1rem !important;\r\n line-height: unset !important;\r\n padding: unset !important;\r\n background: unset !important;\r\n font-size: var(--pep-button-2xs-font-size) !important;\r\n visibility: ${this.getVisibility()};\r\n `;\r\n \r\n button.setAttribute(\"style\", css);\r\n }\r\n }\r\n\r\n private setSvgStyle(svg: SVGElement) {\r\n const css = `\r\n transform: rotate(270deg);\r\n width: 0.75rem;\r\n `;\r\n svg.setAttribute('style', css);\r\n }\r\n\r\n private async getResetElement(): Promise<HTMLElement> {\r\n this.setButtonContainerStyle();\r\n this.renderer.addClass(this.buttonContainer, 'pep-reset-configuration-field-container');\r\n\r\n // Append button\r\n this.resetButton = this.renderer.createElement('button');\r\n await this.translate.get('ACTIONS.RESET').toPromise().then(resetText => {\r\n const buttonText = this.renderer.createText(resetText);\r\n this.renderer.appendChild(this.resetButton, buttonText);\r\n });\r\n \r\n this.renderer.addClass(this.resetButton, 'pep-button');\r\n // this.renderer.addClass(button, this.styleType);\r\n // this.renderer.addClass(button, this.styleStateType);\r\n this.renderer.addClass(this.resetButton, 'color-link');\r\n this.renderer.addClass(this.resetButton, this.sizeType);\r\n this.setButtonStyle(this.resetButton);\r\n // this.renderer.addClass(button, 'reset-configuration-field-button');\r\n \r\n this.unlistener = this.renderer.listen(this.resetButton, 'click', () => this.onResetClicked());\r\n \r\n this.renderer.appendChild(this.buttonContainer, this.resetButton);\r\n\r\n // Append svg\r\n const svgIcon = this.pepIconService.getSvgIcon(pepIconDeviceResponsive.name);\r\n this.setSvgStyle(svgIcon);\r\n this.renderer.appendChild(this.buttonContainer, svgIcon);\r\n\r\n return this.buttonContainer;\r\n }\r\n \r\n ngAfterViewInit(): void {\r\n this.getResetElement().then(element => {\r\n if (this.resetPosition === 'top-end' && this.element.nativeElement.children?.length > 0) {\r\n this.renderer.insertBefore(this.element.nativeElement, element, this.element.nativeElement.children[0]);\r\n } else {\r\n this.renderer.appendChild(this.element.nativeElement, element);\r\n }\r\n });\r\n }\r\n\r\n ngOnDestroy() {\r\n if (this.unlistener) {\r\n this.unlistener();\r\n }\r\n }\r\n\r\n onResetClicked() {\r\n this.resetHostEvents.emit({\r\n action: 'set-configuration-field',\r\n key: this.resetFieldKey,\r\n value: undefined\r\n });\r\n }\r\n}\r\n","import { Injectable } from '@angular/core';\r\n\r\n/\r\n This service is for utillity usege.\r\n/\r\n@Injectable({\r\n providedIn: 'root',\r\n})\r\nexport class PepCompositeLibUtilitiesService {\r\n constructor(\r\n // private sessionService: PepSessionService,\r\n // private httpService: PepHttpService,\r\n // private loaderService: PepLoaderService\r\n ) {\r\n //\r\n }\r\n}\r\n","import { Injectable, ViewContainerRef } from \"@angular/core\";\r\nimport { PepAddonBlockLoaderService } from \"@pepperi-addons/ngx-lib/remote-loader\";\r\n\r\nexport interface DIMXHostObject {\r\n DIMXAddonUUID: string;\r\n DIMXResource: string;\r\n}\r\n\r\nexport interface DIMXImportOptions {\r\n OverwriteObject?: boolean;\r\n Delimiter?: string;\r\n OwnerID?: string;\r\n ActionID?: string;\r\n AdditionalData?: any;\r\n}\r\n\r\nexport interface DIMXRecursiveImportOptions {\r\n OverwriteObject?: boolean;\r\n OwnerID?: string;\r\n ActionID?: string;\r\n AdditionalData?: any;\r\n}\r\n\r\nexport interface DIMXExportOptions {\r\n DIMXExportFormat?: string;\r\n DIMXExportIncludeDeleted?: boolean;\r\n DIMXExportFileName?: string;\r\n DIMXExportWhere?: string;\r\n DIMXExportFields?: string;\r\n DIMXExportDelimiter?: string;\r\n ActionID?: string;\r\n AdditionalData?: any;\r\n}\r\n\r\nexport interface DIMXRecursiveExportOptions {\r\n DIMXExportIncludeDeleted?: boolean;\r\n DIMXExportFileName?: string;\r\n DIMXExportWhere?: string;\r\n DIMXExportFields?: string;\r\n ActionID?: string;\r\n AdditionalData?: any;\r\n}\r\n\r\n@Injectable()\r\nexport class PepDIMXHelperService {\r\n private dimxFunctions!: {\r\n DIMXImport: (options?: DIMXImportOptions) => void,\r\n DIMXRecursiveImport: (options?: DIMXRecursiveImportOptions) => void,\r\n DIMXExport: (options?: DIMXExportOptions) => void,\r\n DIMXRecursiveExport: (options?: DIMXRecursiveExportOptions) => void\r\n };\r\n\r\n constructor(\r\n private addonBlockLoaderService: PepAddonBlockLoaderService\r\n ) {\r\n }\r\n\r\n register(viewContainerRef: ViewContainerRef, dimxHostObject: DIMXHostObject, onDIMXProcessDoneCallback: (dimxEvent: any) => void) {\r\n return this.addonBlockLoaderService.loadAddonBlockInContainer({\r\n container: viewContainerRef,\r\n name: 'DIMX',\r\n hostObject: dimxHostObject,\r\n hostEventsCallback: (event: any) => {\r\n if (event.action === 'DIMXFunctionsRegister') {\r\n this.dimxFunctions = event.value;\r\n } else if (event.action === 'DIMXProcessDone') {\r\n onDIMXProcessDoneCallback(event.value);\r\n } else {\r\n console.error('Unknown event action: ' + event.action);\r\n }\r\n }\r\n });\r\n }\r\n\r\n import(options?: DIMXImportOptions) {\r\n if (typeof (this.dimxFunctions?.DIMXImport) === 'function') {\r\n this.dimxFunctions.DIMXImport(options);\r\n } else {\r\n console.error('DIMXImport function not found, are you registered?');\r\n }\r\n }\r\n\r\n recursive_import(options?: DIMXRecursiveImportOptions) {\r\n if (typeof (this.dimxFunctions?.DIMXRecursiveImport) === 'function') {\r\n this.dimxFunctions.DIMXRecursiveImport(options);\r\n } else {\r\n console.error('DIMXRecursiveImport function not found, are you registered?');\r\n }\r\n }\r\n\r\n export(options?: DIMXExportOptions) {\r\n if (typeof (this.dimxFunctions?.DIMXExport) === 'function') {\r\n this.dimxFunctions.DIMXExport(options);\r\n } else {\r\n console.error('DIMXExport function not found, are you registered?');\r\n }\r\n }\r\n\r\n recursive_export(options?: DIMXRecursiveExportOptions) {\r\n if (typeof (this.dimxFunctions?.DIMXRecursiveExport) === 'function') {\r\n this.dimxFunctions.DIMXRecursiveExport(options);\r\n } else {\r\n console.error('DIMXRecursiveExport function not found, are you registered?');\r\n }\r\n }\r\n}","/\n Public API Surface of ngx-composite-lib/core/common/services\n /\nexport from './utilities.service';\nexport * from './dimx.service';\n","/\n export from ngx-composite-lib/core/common/services\n /\nexport from './public-api';\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\n//import { TranslateModule } from '@ngx-translate/core';\n// import { HttpClientModule } from '@angular/common/http';\n// import { ReactiveFormsModule } from '@angular/forms';\nimport { PepResetConfigurationFieldDirective } from './core/common/directives/reset-configuration-field.directive';\nimport { PepDIMXHelperService, PepCompositeLibUtilitiesService } from './core/common/services/index';\n\nimport { PepRemoteLoaderModule } from '@pepperi-addons/ngx-lib/remote-loader';\n\nimport {\n PepIconModule,\n PepIconRegistry,\n pepIconDeviceResponsive,\n} from '@pepperi-addons/ngx-lib/icon';\n\nconst utilitiesList = [\n PepResetConfigurationFieldDirective\n];\n\n@NgModule({\n declarations: [\n utilitiesList\n ],\n imports: [\n CommonModule,\n PepIconModule,\n PepRemoteLoaderModule,\n ],\n exports: [\n utilitiesList\n //TranslateModule\n ],\n providers: [\n PepDIMXHelperService,\n PepCompositeLibUtilitiesService\n ]\n})\nexport class PepNgxCompositeLibModule {\n constructor(\n private pepIconRegistry: PepIconRegistry\n ) {\n this.pepIconRegistry.registerIcons([\n pepIconDeviceResponsive\n ]);\n }\n}\n","/\n Public API Surface of ngx-composite-lib/core/common/directives\n /\nexport from '../directives/reset-configuration-field.directive';\n","/\n export from ngx-composite-lib/core/common/directives\n /\nexport from './public-api';\n","/\n Public API Surface of ngx-composite-lib/core/common\n /\nexport from './services/index';\nexport * from './directives/index';\n","/\n export from ngx-composite-lib/core/common\n /\nexport from './public-api';\n","/\n Public API Surface of ngx-composite-lib/core\n /\nexport from './common/index';","/\n export from ngx-composite-lib/core\n /\nexport from './public-api';\n","/\n Public API Surface of ngx-composite-lib\n /\nexport from './ngx-composite-lib.module';\nexport * from './core/index';\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":["i1"],"mappings":"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"}

package/fesm2020/pepperi-addons-ngx-composite-lib-color-settings.mjs CHANGED Viewed

@@ -21,15 +21,6 @@ class PepColorSettings {
 }
 class ColorSettingsComponent {
-    constructor(pepColorService) {
-        this.pepColorService = pepColorService;
-        this.title = '';
-        this.checkAAComplient = true;
-        this.showAAComplient = true;
-        this.titleSize = 'xl';
-        this._color = new PepColorSettings();
-        this.colorChange = new EventEmitter();
-    }
     set color(value) {
         if (!value) {
             this._color = new PepColorSettings();
@@ -41,6 +32,15 @@ class ColorSettingsComponent {
     get color() {
         return this._color;
     }
+    constructor(pepColorService) {
+        this.pepColorService = pepColorService;
+        this.title = '';
+        this.checkAAComplient = true;
+        this.showAAComplient = true;
+        this.titleSize = 'xl';
+        this._color = new PepColorSettings();
+        this.colorChange = new EventEmitter();
+    }
     ngOnInit() {
         //
     }
@@ -83,9 +83,9 @@ class ColorSettingsComponent {
         this.raiseColorChange();
     }
 }
-ColorSettingsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: ColorSettingsComponent, deps: [{ token: i1.PepColorService }], target: i0.ɵɵFactoryTarget.Component });
-ColorSettingsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: ColorSettingsComponent, selector: "pep-color-settings", inputs: { title: "title", checkAAComplient: "checkAAComplient", showAAComplient: "showAAComplient", titleSize: "titleSize", color: "color" }, outputs: { colorChange: "colorChange" }, ngImport: i0, template: "<div>\n    <pep-checkbox \n        class=\"{{ titleSize === 'xl' ? 'checkbox-as-title' : 'checkbox-as-sub-title' }}\" \n        [label]=\"title\" [renderTitle]=\"false\" [value]=\"color.use\"\n        (valueChange)=\"onUseChanged($event)\"></pep-checkbox>\n    <pep-color [value]=\"color.value\" [label]=\"title + ' ' + ('COLOR_SETTINGS.COLOR' | translate)\" [disabled]=\"!color.use\"\n        [checkAAComplient]=\"checkAAComplient\" [showAAComplient]=\"showAAComplient\" (valueChange)=\"onColorChanged($event)\">\n    </pep-color>\n</div>\n<pep-slider [label]=\"title + ' ' + ('COLOR_SETTINGS.OPACITY' | translate)\" [hint]=\"color.opacity.toString() || ''\"\n    [minValue]=\"0\" [maxValue]=\"100\" [disabled]=\"!color.use\" [value]=\"color.opacity\" [background]=\"getSliderBackground()\"\n    (inputChange)=\"onSliderInputChanged($event)\" (valueChange)=\"onSliderValueChanged($event)\">\n</pep-slider>", 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.PepColorComponent, selector: "pep-color", inputs: ["key", "value", "label", "disabled", "xAlignment", "rowSpan", "type", "showTitle", "renderTitle", "showAAComplient", "checkAAComplient", "layoutType"], outputs: ["valueChange"] }, { kind: "component", type: i4.PepSliderComponent, selector: "pep-slider", inputs: ["label", "disabled", "hint", "background", "step", "minValue", "maxValue", "value"], outputs: ["valueChange", "inputChange"] }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: ColorSettingsComponent, decorators: [{
+ColorSettingsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ColorSettingsComponent, deps: [{ token: i1.PepColorService }], target: i0.ɵɵFactoryTarget.Component });
+ColorSettingsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: ColorSettingsComponent, selector: "pep-color-settings", inputs: { title: "title", checkAAComplient: "checkAAComplient", showAAComplient: "showAAComplient", titleSize: "titleSize", color: "color" }, outputs: { colorChange: "colorChange" }, ngImport: i0, template: "<div>\n    <pep-checkbox \n        class=\"{{ titleSize === 'xl' ? 'checkbox-as-title' : 'checkbox-as-sub-title' }}\" \n        [label]=\"title\" [renderTitle]=\"false\" [value]=\"color.use\"\n        (valueChange)=\"onUseChanged($event)\"></pep-checkbox>\n    <pep-color [value]=\"color.value\" [label]=\"title + ' ' + ('COLOR_SETTINGS.COLOR' | translate)\" [disabled]=\"!color.use\"\n        [checkAAComplient]=\"checkAAComplient\" [showAAComplient]=\"showAAComplient\" (valueChange)=\"onColorChanged($event)\">\n    </pep-color>\n</div>\n<pep-slider [label]=\"title + ' ' + ('COLOR_SETTINGS.OPACITY' | translate)\" [hint]=\"color.opacity.toString() || ''\"\n    [minValue]=\"0\" [maxValue]=\"100\" [disabled]=\"!color.use\" [value]=\"color.opacity\" [background]=\"getSliderBackground()\"\n    (inputChange)=\"onSliderInputChanged($event)\" (valueChange)=\"onSliderValueChanged($event)\">\n</pep-slider>", 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.PepColorComponent, selector: "pep-color", inputs: ["key", "value", "label", "disabled", "xAlignment", "rowSpan", "type", "showTitle", "renderTitle", "showAAComplient", "checkAAComplient", "layoutType"], outputs: ["valueChange"] }, { kind: "component", type: i4.PepSliderComponent, selector: "pep-slider", inputs: ["label", "disabled", "hint", "background", "step", "minValue", "maxValue", "value"], outputs: ["valueChange", "inputChange"] }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ColorSettingsComponent, decorators: [{
             type: Component,
             args: [{ selector: 'pep-color-settings', template: "<div>\n    <pep-checkbox \n        class=\"{{ titleSize === 'xl' ? 'checkbox-as-title' : 'checkbox-as-sub-title' }}\" \n        [label]=\"title\" [renderTitle]=\"false\" [value]=\"color.use\"\n        (valueChange)=\"onUseChanged($event)\"></pep-checkbox>\n    <pep-color [value]=\"color.value\" [label]=\"title + ' ' + ('COLOR_SETTINGS.COLOR' | translate)\" [disabled]=\"!color.use\"\n        [checkAAComplient]=\"checkAAComplient\" [showAAComplient]=\"showAAComplient\" (valueChange)=\"onColorChanged($event)\">\n    </pep-color>\n</div>\n<pep-slider [label]=\"title + ' ' + ('COLOR_SETTINGS.OPACITY' | translate)\" [hint]=\"color.opacity.toString() || ''\"\n    [minValue]=\"0\" [maxValue]=\"100\" [disabled]=\"!color.use\" [value]=\"color.opacity\" [background]=\"getSliderBackground()\"\n    (inputChange)=\"onSliderInputChanged($event)\" (valueChange)=\"onSliderValueChanged($event)\">\n</pep-slider>", styles: [":host{width:100%;display:grid;gap:var(--pep-spacing-lg, 1rem)}\n"] }]
         }], ctorParameters: function () { return [{ type: i1.PepColorService }]; }, propDecorators: { title: [{
@@ -104,18 +104,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImpor
 class PepColorSettingsModule {
 }
-PepColorSettingsModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepColorSettingsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-PepColorSettingsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.0.2", ngImport: i0, type: PepColorSettingsModule, declarations: [ColorSettingsComponent], imports: [CommonModule,
+PepColorSettingsModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PepColorSettingsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+PepColorSettingsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: PepColorSettingsModule, declarations: [ColorSettingsComponent], imports: [CommonModule,
         PepNgxLibModule,
         PepCheckboxModule,
         PepColorModule,
         PepSliderModule], exports: [ColorSettingsComponent] });
-PepColorSettingsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepColorSettingsModule, imports: [CommonModule,
+PepColorSettingsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PepColorSettingsModule, imports: [CommonModule,
         PepNgxLibModule,
         PepCheckboxModule,
         PepColorModule,
         PepSliderModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepColorSettingsModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PepColorSettingsModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [

package/fesm2020/pepperi-addons-ngx-composite-lib-color-settings.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"pepperi-addons-ngx-composite-lib-color-settings.mjs","sources":["../../../projects/ngx-composite-lib/color-settings/color-settings.model.ts","../../../projects/ngx-composite-lib/color-settings/color-settings.component.ts","../../../projects/ngx-composite-lib/color-settings/color-settings.component.html","../../../projects/ngx-composite-lib/color-settings/color-settings.module.ts","../../../projects/ngx-composite-lib/color-settings/public-api.ts","../../../projects/ngx-composite-lib/color-settings/pepperi-addons-ngx-composite-lib-color-settings.ts"],"sourcesContent":["export class PepColorSettings {\r\n use: boolean;\r\n value: string;\r\n opacity = 50;\r\n \r\n constructor(use = false, value = 'hsl(0, 0%, 57%)', opacity = 50) {\r\n this.use = use;\r\n this.value = value;\r\n this.opacity = opacity;\r\n }\r\n}","import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';\nimport { PepColorService, PepSizeType } from '@pepperi-addons/ngx-lib';\nimport { PepColorSettings } from './color-settings.model';\n\n@Component({\n selector: 'pep-color-settings',\n templateUrl: './color-settings.component.html',\n styleUrls: ['./color-settings.component.scss']\n})\nexport class ColorSettingsComponent implements OnInit {\n @Input() title = '';\n @Input() checkAAComplient = true;\n @Input() showAAComplient = true;\n @Input() titleSize: PepSizeType = 'xl';\n\n private _color: PepColorSettings = new PepColorSettings();\n @Input()\n set color(value: PepColorSettings) {\n if (!value) {\n this._color = new PepColorSettings();\n } else {\n this._color = value;\n }\n }\n get color(): PepColorSettings {\n return this._color;\n }\n\n @Output()\n colorChange: EventEmitter<PepColorSettings> = new EventEmitter<PepColorSettings>();\n \n constructor(private pepColorService: PepColorService) { }\n\n ngOnInit() {\n //\n }\n\n private getRGBAcolor(colorObj: PepColorSettings, opac: number \| null = null) {\n let rgba = 'rgba(255,255,255,0)';\n\n if (colorObj) {\n const color = colorObj.value;\n let opacity = opac != null ? opac : colorObj.opacity;\n\n opacity = opacity > 0 ? opacity / 100 : 0;\n\n const hsl = this.pepColorService.hslString2hsl(color);\n const rgb = this.pepColorService.hsl2rgb(hsl);\n rgba = 'rgba(' + rgb.r + ',' + rgb.g + ',' + rgb.b + ',' + opacity + ')';\n }\n\n return rgba;\n }\n\n private raiseColorChange() {\n this.colorChange.emit(this.color);\n }\n\n getSliderBackground() {\n const alignTo = 'right';\n \n const colorObj = new PepColorSettings();\n \n colorObj.value = this.color.value;\n colorObj.opacity = 100;\n \n const gradStr = this.getRGBAcolor(colorObj, 0) + ' , ' + this.getRGBAcolor(colorObj);\n \n return 'linear-gradient(to ' + alignTo + ', ' + gradStr + ')';\n }\n\n onUseChanged(value: boolean) {\n this.color.use = value;\n this.raiseColorChange();\n }\n\n onColorChanged(value: string) {\n this.color.value = value;\n this.raiseColorChange();\n }\n \n onSliderInputChanged(value: number) {\n this.color.opacity = value;\n }\n\n onSliderValueChanged(value: number) {\n this.color.opacity = value;\n this.raiseColorChange();\n }\n}\n","<div>\n <pep-checkbox \n class=\"{{ titleSize === 'xl' ? 'checkbox-as-title' : 'checkbox-as-sub-title' }}\" \n [label]=\"title\" [renderTitle]=\"false\" [value]=\"color.use\"\n (valueChange)=\"onUseChanged($event)\"></pep-checkbox>\n <pep-color [value]=\"color.value\" [label]=\"title + ' ' + ('COLOR_SETTINGS.COLOR' \| translate)\" [disabled]=\"!color.use\"\n [checkAAComplient]=\"checkAAComplient\" [showAAComplient]=\"showAAComplient\" (valueChange)=\"onColorChanged($event)\">\n </pep-color>\n</div>\n<pep-slider [label]=\"title + ' ' + ('COLOR_SETTINGS.OPACITY' \| translate)\" [hint]=\"color.opacity.toString() \|\| ''\"\n [minValue]=\"0\" [maxValue]=\"100\" [disabled]=\"!color.use\" [value]=\"color.opacity\" [background]=\"getSliderBackground()\"\n (inputChange)=\"onSliderInputChanged($event)\" (valueChange)=\"onSliderValueChanged($event)\">\n</pep-slider>","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { PepNgxLibModule } from '@pepperi-addons/ngx-lib';\nimport { PepColorModule } from '@pepperi-addons/ngx-lib/color';\nimport { PepCheckboxModule } from '@pepperi-addons/ngx-lib/checkbox';\nimport { PepSliderModule } from '@pepperi-addons/ngx-lib/slider';\n\nimport { ColorSettingsComponent } from './color-settings.component';\n\n@NgModule({\n declarations: [\n ColorSettingsComponent\n ],\n imports: [\n CommonModule,\n PepNgxLibModule,\n PepCheckboxModule,\n PepColorModule,\n PepSliderModule\n ],\n exports: [ColorSettingsComponent],\n})\nexport class PepColorSettingsModule { }\n","/\n Public API Surface of ngx-composite-lib/color-settings\n /\nexport from './color-settings.module';\nexport * from './color-settings.component';\nexport * from './color-settings.model';\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"pepperi-addons-ngx-composite-lib-color-settings.mjs","sources":["../../../projects/ngx-composite-lib/color-settings/color-settings.model.ts","../../../projects/ngx-composite-lib/color-settings/color-settings.component.ts","../../../projects/ngx-composite-lib/color-settings/color-settings.component.html","../../../projects/ngx-composite-lib/color-settings/color-settings.module.ts","../../../projects/ngx-composite-lib/color-settings/public-api.ts","../../../projects/ngx-composite-lib/color-settings/pepperi-addons-ngx-composite-lib-color-settings.ts"],"sourcesContent":["export class PepColorSettings {\r\n use: boolean;\r\n value: string;\r\n opacity = 50;\r\n \r\n constructor(use = false, value = 'hsl(0, 0%, 57%)', opacity = 50) {\r\n this.use = use;\r\n this.value = value;\r\n this.opacity = opacity;\r\n }\r\n}","import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';\nimport { PepColorService, PepSizeType } from '@pepperi-addons/ngx-lib';\nimport { PepColorSettings } from './color-settings.model';\n\n@Component({\n selector: 'pep-color-settings',\n templateUrl: './color-settings.component.html',\n styleUrls: ['./color-settings.component.scss']\n})\nexport class ColorSettingsComponent implements OnInit {\n @Input() title = '';\n @Input() checkAAComplient = true;\n @Input() showAAComplient = true;\n @Input() titleSize: PepSizeType = 'xl';\n\n private _color: PepColorSettings = new PepColorSettings();\n @Input()\n set color(value: PepColorSettings) {\n if (!value) {\n this._color = new PepColorSettings();\n } else {\n this._color = value;\n }\n }\n get color(): PepColorSettings {\n return this._color;\n }\n\n @Output()\n colorChange: EventEmitter<PepColorSettings> = new EventEmitter<PepColorSettings>();\n \n constructor(private pepColorService: PepColorService) { }\n\n ngOnInit() {\n //\n }\n\n private getRGBAcolor(colorObj: PepColorSettings, opac: number \| null = null) {\n let rgba = 'rgba(255,255,255,0)';\n\n if (colorObj) {\n const color = colorObj.value;\n let opacity = opac != null ? opac : colorObj.opacity;\n\n opacity = opacity > 0 ? opacity / 100 : 0;\n\n const hsl = this.pepColorService.hslString2hsl(color);\n const rgb = this.pepColorService.hsl2rgb(hsl);\n rgba = 'rgba(' + rgb.r + ',' + rgb.g + ',' + rgb.b + ',' + opacity + ')';\n }\n\n return rgba;\n }\n\n private raiseColorChange() {\n this.colorChange.emit(this.color);\n }\n\n getSliderBackground() {\n const alignTo = 'right';\n \n const colorObj = new PepColorSettings();\n \n colorObj.value = this.color.value;\n colorObj.opacity = 100;\n \n const gradStr = this.getRGBAcolor(colorObj, 0) + ' , ' + this.getRGBAcolor(colorObj);\n \n return 'linear-gradient(to ' + alignTo + ', ' + gradStr + ')';\n }\n\n onUseChanged(value: boolean) {\n this.color.use = value;\n this.raiseColorChange();\n }\n\n onColorChanged(value: string) {\n this.color.value = value;\n this.raiseColorChange();\n }\n \n onSliderInputChanged(value: number) {\n this.color.opacity = value;\n }\n\n onSliderValueChanged(value: number) {\n this.color.opacity = value;\n this.raiseColorChange();\n }\n}\n","<div>\n <pep-checkbox \n class=\"{{ titleSize === 'xl' ? 'checkbox-as-title' : 'checkbox-as-sub-title' }}\" \n [label]=\"title\" [renderTitle]=\"false\" [value]=\"color.use\"\n (valueChange)=\"onUseChanged($event)\"></pep-checkbox>\n <pep-color [value]=\"color.value\" [label]=\"title + ' ' + ('COLOR_SETTINGS.COLOR' \| translate)\" [disabled]=\"!color.use\"\n [checkAAComplient]=\"checkAAComplient\" [showAAComplient]=\"showAAComplient\" (valueChange)=\"onColorChanged($event)\">\n </pep-color>\n</div>\n<pep-slider [label]=\"title + ' ' + ('COLOR_SETTINGS.OPACITY' \| translate)\" [hint]=\"color.opacity.toString() \|\| ''\"\n [minValue]=\"0\" [maxValue]=\"100\" [disabled]=\"!color.use\" [value]=\"color.opacity\" [background]=\"getSliderBackground()\"\n (inputChange)=\"onSliderInputChanged($event)\" (valueChange)=\"onSliderValueChanged($event)\">\n</pep-slider>","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { PepNgxLibModule } from '@pepperi-addons/ngx-lib';\nimport { PepColorModule } from '@pepperi-addons/ngx-lib/color';\nimport { PepCheckboxModule } from '@pepperi-addons/ngx-lib/checkbox';\nimport { PepSliderModule } from '@pepperi-addons/ngx-lib/slider';\n\nimport { ColorSettingsComponent } from './color-settings.component';\n\n@NgModule({\n declarations: [\n ColorSettingsComponent\n ],\n imports: [\n CommonModule,\n PepNgxLibModule,\n PepCheckboxModule,\n PepColorModule,\n PepSliderModule\n ],\n exports: [ColorSettingsComponent],\n})\nexport class PepColorSettingsModule { }\n","/\n Public API Surface of ngx-composite-lib/color-settings\n /\nexport from './color-settings.module';\nexport * from './color-settings.component';\nexport * from './color-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-data-view-builder.mjs CHANGED Viewed

@@ -26,14 +26,14 @@ import { distinctUntilChanged } from 'rxjs/operators';
 import * as i1 from '@ngx-translate/core';
 class DataViewBuilderService {
+    get isGrabbingChange$() {
+        return this._isGrabbingSubject.asObservable().pipe(distinctUntilChanged());
+    }
     constructor() {
         // This subject is for is grabbing mode.
         this._isGrabbingSubject = new BehaviorSubject(false);
         //
     }
-    get isGrabbingChange$() {
-        return this._isGrabbingSubject.asObservable().pipe(distinctUntilChanged());
-    }
     changeCursorOnDragStart() {
         document.body.classList.add('inheritCursors');
         document.body.style.cursor = 'grabbing';
@@ -51,9 +51,9 @@ class DataViewBuilderService {
         this.changeCursorOnDragEnd();
     }
 }
-DataViewBuilderService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: DataViewBuilderService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-DataViewBuilderService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: DataViewBuilderService, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: DataViewBuilderService, decorators: [{
+DataViewBuilderService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DataViewBuilderService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+DataViewBuilderService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DataViewBuilderService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DataViewBuilderService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'
@@ -158,9 +158,9 @@ class MenuDataViewComponent {
         this.dialogRef?.close(value);
     }
 }
-MenuDataViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: MenuDataViewComponent, deps: [{ token: i1.TranslateService }, { token: i2.PepDialogService }, { token: DataViewBuilderService }], target: i0.ɵɵFactoryTarget.Component });
-MenuDataViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: MenuDataViewComponent, selector: "menu-data-view", inputs: { fields: "fields", availableFieldsTitles: "availableFieldsTitles", emptyDropAreaId: "emptyDropAreaId", mappedFieldsId: "mappedFieldsId", showAddSeparator: "showAddSeparator", itemKeyLabel: "itemKeyLabel", itemTitleLabel: "itemTitleLabel" }, outputs: { fieldsChange: "fieldsChange" }, viewQueries: [{ propertyName: "separatorTitleModalTemplate", first: true, predicate: ["separatorTitleModalTemplate"], descendants: true, read: TemplateRef }], ngImport: i0, template: "<ng-container *ngIf=\"fields === null || fields.length === 0; then emptyTemplate; else notEmptyTemplate\"></ng-container>\n<ng-template #emptyTemplate>\n    <div [id]=\"emptyDropAreaId\" class=\"drop-field-here-area\" cdkDropList (cdkDropListDropped)=\"onDropField($event)\">\n        <mat-icon class=\"pep-spacing-element\">\n            <pep-icon name=\"arrow_down_alt\"></pep-icon>\n        </mat-icon>\n        <span class=\"body-sm ellipsis\">\n            {{ 'DATA_VIEW_BUILDER.EMPTY_DROP_AREA_TEXT' | translate }}\n        </span> \n    </div>\n</ng-template>\n<ng-template #notEmptyTemplate>\n    <div [id]=\"mappedFieldsId\" class=\"mapped-fields-area\" [ngClass]=\"{ 'no-row-gap': !isGrabbing }\"\n        cdkDropList [cdkDropListData]=\"fields\" (cdkDropListDropped)=\"onDropField($event)\">\n        <ng-container *ngFor=\"let menuField of fields; let i = index\" >\n            <div class=\"mapped-field-container\" [ngClass]=\"{ 'separator-container': menuField.FieldID === '' }\" \n                cdkDrag (cdkDragStarted)=\"onDragStart($event)\" (cdkDragEnded)=\"onDragEnd($event)\">\n                <ng-container *ngTemplateOutlet=\"mappedFieldTemplate; context: { menuField: menuField }\"></ng-container>\n            </div>\n            <div *ngIf=\"!isGrabbing\" class=\"add-separator-container\">\n                <pep-button *ngIf=\"showAddSeparator\" class=\"add-separator\" styleType=\"regular\" sizeType=\"sm\" iconName=\"number_plus\" \n                    [value]=\"'DATA_VIEW_BUILDER.ADD_SEPARATOR' | translate\" (buttonClick)=\"addSeparator(i+1)\"></pep-button>\n            </div>\n        </ng-container>\n    </div>\n</ng-template>\n\n<ng-template #mappedFieldTemplate let-menuField=\"menuField\">\n    <ng-container *ngIf=\"menuField.FieldID !== ''; then menuItemTemplate; else separatorTemplate\"></ng-container>\n\n    <ng-template #menuItemTemplate>\n        <div class=\"fields-wrapper\">\n            <pep-textbox [label]=\"itemKeyLabel\" [value]=\"menuField.FieldID\" [disabled]=\"true\">\n            </pep-textbox>\n            \n            <pep-textbox [label]=\"itemTitleLabel\" [hint]=\"'(' + (availableFieldsTitles.get(menuField.FieldID) || '') + ')'\"\n                [value]=\"menuField.Title\" (valueChange)=\"onTitleChanged($event, menuField)\">\n            </pep-textbox>\n    \n            <pep-button class=\"center-button\" iconName=\"system_bin\" [title]=\"'ACTIONS.DELETE' | translate\" (buttonClick)=\"onDeleteMappedField($event, menuField)\"></pep-button>\n        </div>\n    </ng-template>\n    <ng-template #separatorTemplate>\n        <div class=\"separator-wrapper \">\n            <div class=\"pep-spacing-element title title-md color-dimmed\">\n                <span [title]=\"menuField.Title\">{{ menuField.Title }}</span>\n            </div>\n            <div class=\"list-actions\">\n                <pep-button iconName=\"system_edit\" [title]=\"'ACTIONS.EDIT' | translate\" sizeType=\"xs\" styleType=\"regular\" (buttonClick)=\"onEditSeparatorField($event, menuField)\"></pep-button>\n                <pep-button iconName=\"system_bin\" [title]=\"'ACTIONS.DELETE' | translate\" sizeType=\"xs\" styleType=\"regular\" (buttonClick)=\"onDeleteMappedField($event, menuField)\"></pep-button>\n            </div>\n        </div>\n    </ng-template>\n</ng-template>\n\n<ng-template #separatorTitleModalTemplate let-data>\n    <pep-dialog [title]=\"'DATA_VIEW_BUILDER.SEPARATOR_TITLE' | translate\">\n        <ng-container pep-dialog-content>\n            <pep-textbox #txt [label]=\"'DATA_VIEW_BUILDER.ADD_A_TITLE' | translate\" [(value)]=\"data.value\">\n            </pep-textbox>\n        </ng-container>\n        <ng-container pep-dialog-actions>\n            <div class=\"pep-spacing-element-negative\">\n                <button mat-button class=\"pep-spacing-element pep-button md weak\"\n                    (click)=\"closeDialog()\">\n                    {{'Cancel' | translate}}\n                </button>\n                <button mat-button class=\"pep-spacing-element pep-button md strong\"\n                    (click)=\"setDialogValue(txt.value)\">\n                    {{ 'Save' | translate}}\n                </button>\n            </div>\n        </ng-container>\n    </pep-dialog>\n</ng-template>\n", styles: ["html body.inheritCursors *{cursor:inherit!important}.cdk-drag-preview.mapped-field-container{max-width:600px;display:flex;justify-content:center;align-items:center;border-radius:var(--pep-border-radius-md, .25rem)}.cdk-drag-preview.mapped-field-container:not(.separator-container){padding-inline:var(--pep-spacing-lg, 1rem)}.cdk-drag-preview.mapped-field-container:not(.separator-container){gap:calc(var(--pep-spacing-lg, 1rem) * 2);background:hsl(var(--pep-color-regular-h, 0),var(--pep-color-regular-s, 0%),98%);box-shadow:var(--pep-shadow-xs-offset, 0 .125rem .25rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.08);border:1px solid hsl(var(--pep-color-regular-h, 0),var(--pep-color-regular-s, 0%),calc(var(--pep-color-regular-l, 10%) + 30%))}.cdk-drag-preview.mapped-field-container .fields-wrapper{display:grid;width:100%;grid-template-columns:1fr 1fr auto;gap:.5rem;padding-top:.5rem}.cdk-drag-preview.mapped-field-container .fields-wrapper .center-button{margin-top:var(--pep-form-field-title-height, 1.5rem)}.cdk-drag-preview.mapped-field-container .separator-wrapper{display:grid;width:100%;grid-template-columns:1fr auto;padding-bottom:var(--pep-spacing-xs, .25rem);border-bottom:1px solid hsl(var(--pep-color-regular-h, 0),var(--pep-color-regular-s, 0%),calc(var(--pep-color-regular-l, 10%) + 30%))}.cdk-drag-preview.mapped-field-container .separator-wrapper .list-actions{display:flex;gap:var(--pep-spacing-xs, .25rem)}.drop-field-here-area{min-height:5rem;max-width:600px;display:flex;justify-content:center;align-items:center;border-radius:var(--pep-border-radius-md, .25rem);background:hsla(var(--pep-color-weak-h, 0),var(--pep-color-weak-s, 0%),var(--pep-color-weak-l, 10%),.08);position:relative}.drop-field-here-area:not(.separator-container){padding-inline:var(--pep-spacing-lg, 1rem)}.drop-field-here-area:after{z-index:0;content:\"\";transition:all .25s;display:block;position:absolute;inset:0;border-radius:inherit;border:1px dashed hsl(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),calc(var(--pep-color-system-primary-l, 10%) + 30%))}.drop-field-here-area.cdk-drop-list-dragging{box-shadow:0 0 0 var(--pep-spacing-xs, .25rem) hsla(var(--pep-color-text-link-h, 207),var(--pep-color-text-link-s, 76%),var(--pep-color-text-link-l, 37%),.5)}.drop-field-here-area.cdk-drop-list-dragging:hover{background:hsl(var(--pep-color-regular-h, 0),var(--pep-color-regular-s, 0%),98%);box-shadow:var(--pep-shadow-xs-offset, 0 .125rem .25rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.16);border:1px solid hsl(var(--pep-color-regular-h, 0),var(--pep-color-regular-s, 0%),calc(var(--pep-color-regular-l, 10%) + 20%));box-shadow:0 0 0 var(--pep-spacing-xs, .25rem) hsla(var(--pep-color-text-link-h, 207),var(--pep-color-text-link-s, 76%),var(--pep-color-text-link-l, 37%),.5)}.drop-field-here-area.cdk-drop-list-dragging ::ng-deep .placeholder-item{display:none}.mapped-fields-area{display:flex;flex-direction:column;column-gap:var(--pep-spacing-lg, 1rem)}.mapped-fields-area:not(.no-row-gap){row-gap:var(--pep-spacing-lg, 1rem)}.mapped-fields-area.cdk-drop-list-dragging ::ng-deep .placeholder-item{max-width:600px;display:flex;justify-content:center;align-items:center;border-radius:var(--pep-border-radius-md, .25rem);background:hsl(var(--pep-color-regular-h, 0),var(--pep-color-regular-s, 0%),98%);box-shadow:var(--pep-shadow-xs-offset, 0 .125rem .25rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.08);border:1px solid hsl(var(--pep-color-regular-h, 0),var(--pep-color-regular-s, 0%),calc(var(--pep-color-regular-l, 10%) + 30%));box-shadow:0 0 0 var(--pep-spacing-xs, .25rem) hsla(var(--pep-color-text-link-h, 207),var(--pep-color-text-link-s, 76%),var(--pep-color-text-link-l, 37%),.5);height:2.5rem}.mapped-fields-area.cdk-drop-list-dragging ::ng-deep .placeholder-item:not(.separator-container){padding-inline:var(--pep-spacing-lg, 1rem)}.mapped-fields-area .mapped-field-container{cursor:grab;max-width:600px;display:flex;justify-content:center;align-items:center;border-radius:var(--pep-border-radius-md, .25rem)}.mapped-fields-area .mapped-field-container:not(.separator-container){padding-inline:var(--pep-spacing-lg, 1rem)}.mapped-fields-area .mapped-field-container:not(.separator-container){gap:calc(var(--pep-spacing-lg, 1rem) * 2);background:hsl(var(--pep-color-regular-h, 0),var(--pep-color-regular-s, 0%),98%);box-shadow:var(--pep-shadow-xs-offset, 0 .125rem .25rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.08);border:1px solid hsl(var(--pep-color-regular-h, 0),var(--pep-color-regular-s, 0%),calc(var(--pep-color-regular-l, 10%) + 30%))}.mapped-fields-area .mapped-field-container .fields-wrapper{display:grid;width:100%;grid-template-columns:1fr 1fr auto;gap:.5rem;padding-top:.5rem}.mapped-fields-area .mapped-field-container .fields-wrapper .center-button{margin-top:var(--pep-form-field-title-height, 1.5rem)}.mapped-fields-area .mapped-field-container .separator-wrapper{display:grid;width:100%;grid-template-columns:1fr auto;padding-bottom:var(--pep-spacing-xs, .25rem);border-bottom:1px solid hsl(var(--pep-color-regular-h, 0),var(--pep-color-regular-s, 0%),calc(var(--pep-color-regular-l, 10%) + 30%))}.mapped-fields-area .mapped-field-container .separator-wrapper .list-actions{display:flex;gap:var(--pep-spacing-xs, .25rem)}.mapped-fields-area .mapped-field-container.cdk-drag-placeholder{box-shadow:0 0 0 var(--pep-spacing-xs, .25rem) hsla(var(--pep-color-text-link-h, 207),var(--pep-color-text-link-s, 76%),var(--pep-color-text-link-l, 37%),.5)}.mapped-fields-area .mapped-field-container.cdk-drag-placeholder .fields-wrapper,.mapped-fields-area .mapped-field-container.cdk-drag-placeholder .separator-wrapper{opacity:0}.mapped-fields-area .add-separator-container{max-width:600px;display:flex;justify-content:center;align-items:center;border-radius:var(--pep-border-radius-md, .25rem);height:var(--pep-spacing-lg, 1rem)}.mapped-fields-area .add-separator-container:not(.separator-container){padding-inline:var(--pep-spacing-lg, 1rem)}.mapped-fields-area .add-separator-container .add-separator{position:relative;display:none}.mapped-fields-area .add-separator-container:hover .add-separator{display:block}\n"], dependencies: [{ kind: "directive", type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i5.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i5.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "component", type: i6.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i7.PepButtonComponent, selector: "pep-button", inputs: ["key", "value", "styleType", "styleStateType", "sizeType", "classNames", "disabled", "iconName", "iconPosition", "visible"], outputs: ["buttonClick"] }, { kind: "component", type: i2.PepDialogComponent, selector: "pep-dialog", inputs: ["title", "showClose", "showHeader", "showFooter"], outputs: ["close"] }, { kind: "component", type: i1$1.PepIconComponent, selector: "pep-icon", inputs: ["spin", "name", "fill"] }, { kind: "component", type: i9.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"] }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: MenuDataViewComponent, decorators: [{
+MenuDataViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MenuDataViewComponent, deps: [{ token: i1.TranslateService }, { token: i2.PepDialogService }, { token: DataViewBuilderService }], target: i0.ɵɵFactoryTarget.Component });
+MenuDataViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: MenuDataViewComponent, selector: "menu-data-view", inputs: { fields: "fields", availableFieldsTitles: "availableFieldsTitles", emptyDropAreaId: "emptyDropAreaId", mappedFieldsId: "mappedFieldsId", showAddSeparator: "showAddSeparator", itemKeyLabel: "itemKeyLabel", itemTitleLabel: "itemTitleLabel" }, outputs: { fieldsChange: "fieldsChange" }, viewQueries: [{ propertyName: "separatorTitleModalTemplate", first: true, predicate: ["separatorTitleModalTemplate"], descendants: true, read: TemplateRef }], ngImport: i0, template: "<ng-container *ngIf=\"fields === null || fields.length === 0; then emptyTemplate; else notEmptyTemplate\"></ng-container>\n<ng-template #emptyTemplate>\n    <div [id]=\"emptyDropAreaId\" class=\"drop-field-here-area\" cdkDropList (cdkDropListDropped)=\"onDropField($event)\">\n        <mat-icon class=\"pep-spacing-element\">\n            <pep-icon name=\"arrow_down_alt\"></pep-icon>\n        </mat-icon>\n        <span class=\"body-sm ellipsis\">\n            {{ 'DATA_VIEW_BUILDER.EMPTY_DROP_AREA_TEXT' | translate }}\n        </span> \n    </div>\n</ng-template>\n<ng-template #notEmptyTemplate>\n    <div [id]=\"mappedFieldsId\" class=\"mapped-fields-area\" [ngClass]=\"{ 'no-row-gap': !isGrabbing }\"\n        cdkDropList [cdkDropListData]=\"fields\" (cdkDropListDropped)=\"onDropField($event)\">\n        <ng-container *ngFor=\"let menuField of fields; let i = index\" >\n            <div class=\"mapped-field-container\" [ngClass]=\"{ 'separator-container': menuField.FieldID === '' }\" \n                cdkDrag (cdkDragStarted)=\"onDragStart($event)\" (cdkDragEnded)=\"onDragEnd($event)\">\n                <ng-container *ngTemplateOutlet=\"mappedFieldTemplate; context: { menuField: menuField }\"></ng-container>\n            </div>\n            <div *ngIf=\"!isGrabbing\" class=\"add-separator-container\">\n                <pep-button *ngIf=\"showAddSeparator\" class=\"add-separator\" styleType=\"regular\" sizeType=\"sm\" iconName=\"number_plus\" \n                    [value]=\"'DATA_VIEW_BUILDER.ADD_SEPARATOR' | translate\" (buttonClick)=\"addSeparator(i+1)\"></pep-button>\n            </div>\n        </ng-container>\n    </div>\n</ng-template>\n\n<ng-template #mappedFieldTemplate let-menuField=\"menuField\">\n    <ng-container *ngIf=\"menuField.FieldID !== ''; then menuItemTemplate; else separatorTemplate\"></ng-container>\n\n    <ng-template #menuItemTemplate>\n        <div class=\"fields-wrapper\">\n            <pep-textbox [label]=\"itemKeyLabel\" [value]=\"menuField.FieldID\" [disabled]=\"true\">\n            </pep-textbox>\n            \n            <pep-textbox [label]=\"itemTitleLabel\" [hint]=\"'(' + (availableFieldsTitles.get(menuField.FieldID) || '') + ')'\"\n                [value]=\"menuField.Title\" (valueChange)=\"onTitleChanged($event, menuField)\">\n            </pep-textbox>\n    \n            <pep-button class=\"center-button\" iconName=\"system_bin\" [title]=\"'ACTIONS.DELETE' | translate\" (buttonClick)=\"onDeleteMappedField($event, menuField)\"></pep-button>\n        </div>\n    </ng-template>\n    <ng-template #separatorTemplate>\n        <div class=\"separator-wrapper \">\n            <div class=\"pep-spacing-element title title-md color-dimmed\">\n                <span [title]=\"menuField.Title\">{{ menuField.Title }}</span>\n            </div>\n            <div class=\"list-actions\">\n                <pep-button iconName=\"system_edit\" [title]=\"'ACTIONS.EDIT' | translate\" sizeType=\"xs\" styleType=\"regular\" (buttonClick)=\"onEditSeparatorField($event, menuField)\"></pep-button>\n                <pep-button iconName=\"system_bin\" [title]=\"'ACTIONS.DELETE' | translate\" sizeType=\"xs\" styleType=\"regular\" (buttonClick)=\"onDeleteMappedField($event, menuField)\"></pep-button>\n            </div>\n        </div>\n    </ng-template>\n</ng-template>\n\n<ng-template #separatorTitleModalTemplate let-data>\n    <pep-dialog [title]=\"'DATA_VIEW_BUILDER.SEPARATOR_TITLE' | translate\">\n        <ng-container pep-dialog-content>\n            <pep-textbox #txt [label]=\"'DATA_VIEW_BUILDER.ADD_A_TITLE' | translate\" [(value)]=\"data.value\">\n            </pep-textbox>\n        </ng-container>\n        <ng-container pep-dialog-actions>\n            <div class=\"pep-spacing-element-negative\">\n                <button mat-button class=\"pep-spacing-element pep-button md weak\"\n                    (click)=\"closeDialog()\">\n                    {{'Cancel' | translate}}\n                </button>\n                <button mat-button class=\"pep-spacing-element pep-button md strong\"\n                    (click)=\"setDialogValue(txt.value)\">\n                    {{ 'Save' | translate}}\n                </button>\n            </div>\n        </ng-container>\n    </pep-dialog>\n</ng-template>\n", styles: ["html body.inheritCursors *{cursor:inherit!important}.cdk-drag-preview.mapped-field-container{max-width:600px;display:flex;justify-content:center;align-items:center;border-radius:var(--pep-border-radius-md, .25rem)}.cdk-drag-preview.mapped-field-container:not(.separator-container){padding-inline:var(--pep-spacing-lg, 1rem)}.cdk-drag-preview.mapped-field-container:not(.separator-container){gap:calc(var(--pep-spacing-lg, 1rem) * 2);background:hsl(var(--pep-color-regular-h, 0),var(--pep-color-regular-s, 0%),98%);box-shadow:var(--pep-shadow-xs-offset, 0 .125rem .25rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.08);border:1px solid hsl(var(--pep-color-regular-h, 0),var(--pep-color-regular-s, 0%),calc(var(--pep-color-regular-l, 10%) + 30%))}.cdk-drag-preview.mapped-field-container .fields-wrapper{display:grid;width:100%;grid-template-columns:1fr 1fr auto;gap:.5rem;padding-top:.5rem}.cdk-drag-preview.mapped-field-container .fields-wrapper .center-button{margin-top:var(--pep-form-field-title-height, 1.5rem)}.cdk-drag-preview.mapped-field-container .separator-wrapper{display:grid;width:100%;grid-template-columns:1fr auto;padding-bottom:var(--pep-spacing-xs, .25rem);border-bottom:1px solid hsl(var(--pep-color-regular-h, 0),var(--pep-color-regular-s, 0%),calc(var(--pep-color-regular-l, 10%) + 30%))}.cdk-drag-preview.mapped-field-container .separator-wrapper .list-actions{display:flex;gap:var(--pep-spacing-xs, .25rem)}.drop-field-here-area{min-height:5rem;max-width:600px;display:flex;justify-content:center;align-items:center;border-radius:var(--pep-border-radius-md, .25rem);background:hsla(var(--pep-color-weak-h, 0),var(--pep-color-weak-s, 0%),var(--pep-color-weak-l, 10%),.08);position:relative}.drop-field-here-area:not(.separator-container){padding-inline:var(--pep-spacing-lg, 1rem)}.drop-field-here-area:after{z-index:0;content:\"\";transition:all .25s;display:block;position:absolute;inset:0;border-radius:inherit;border:1px dashed hsl(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),calc(var(--pep-color-system-primary-l, 10%) + 30%))}.drop-field-here-area.cdk-drop-list-dragging{box-shadow:0 0 0 var(--pep-spacing-xs, .25rem) hsla(var(--pep-color-text-link-h, 207),var(--pep-color-text-link-s, 76%),var(--pep-color-text-link-l, 37%),.5)}.drop-field-here-area.cdk-drop-list-dragging:hover{background:hsl(var(--pep-color-regular-h, 0),var(--pep-color-regular-s, 0%),98%);box-shadow:var(--pep-shadow-xs-offset, 0 .125rem .25rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.16);border:1px solid hsl(var(--pep-color-regular-h, 0),var(--pep-color-regular-s, 0%),calc(var(--pep-color-regular-l, 10%) + 20%));box-shadow:0 0 0 var(--pep-spacing-xs, .25rem) hsla(var(--pep-color-text-link-h, 207),var(--pep-color-text-link-s, 76%),var(--pep-color-text-link-l, 37%),.5)}.drop-field-here-area.cdk-drop-list-dragging ::ng-deep .placeholder-item{display:none}.mapped-fields-area{display:flex;flex-direction:column;column-gap:var(--pep-spacing-lg, 1rem)}.mapped-fields-area:not(.no-row-gap){row-gap:var(--pep-spacing-lg, 1rem)}.mapped-fields-area.cdk-drop-list-dragging ::ng-deep .placeholder-item{max-width:600px;display:flex;justify-content:center;align-items:center;border-radius:var(--pep-border-radius-md, .25rem);background:hsl(var(--pep-color-regular-h, 0),var(--pep-color-regular-s, 0%),98%);box-shadow:var(--pep-shadow-xs-offset, 0 .125rem .25rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.08);border:1px solid hsl(var(--pep-color-regular-h, 0),var(--pep-color-regular-s, 0%),calc(var(--pep-color-regular-l, 10%) + 30%));box-shadow:0 0 0 var(--pep-spacing-xs, .25rem) hsla(var(--pep-color-text-link-h, 207),var(--pep-color-text-link-s, 76%),var(--pep-color-text-link-l, 37%),.5);height:2.5rem}.mapped-fields-area.cdk-drop-list-dragging ::ng-deep .placeholder-item:not(.separator-container){padding-inline:var(--pep-spacing-lg, 1rem)}.mapped-fields-area .mapped-field-container{cursor:grab;max-width:600px;display:flex;justify-content:center;align-items:center;border-radius:var(--pep-border-radius-md, .25rem)}.mapped-fields-area .mapped-field-container:not(.separator-container){padding-inline:var(--pep-spacing-lg, 1rem)}.mapped-fields-area .mapped-field-container:not(.separator-container){gap:calc(var(--pep-spacing-lg, 1rem) * 2);background:hsl(var(--pep-color-regular-h, 0),var(--pep-color-regular-s, 0%),98%);box-shadow:var(--pep-shadow-xs-offset, 0 .125rem .25rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.08);border:1px solid hsl(var(--pep-color-regular-h, 0),var(--pep-color-regular-s, 0%),calc(var(--pep-color-regular-l, 10%) + 30%))}.mapped-fields-area .mapped-field-container .fields-wrapper{display:grid;width:100%;grid-template-columns:1fr 1fr auto;gap:.5rem;padding-top:.5rem}.mapped-fields-area .mapped-field-container .fields-wrapper .center-button{margin-top:var(--pep-form-field-title-height, 1.5rem)}.mapped-fields-area .mapped-field-container .separator-wrapper{display:grid;width:100%;grid-template-columns:1fr auto;padding-bottom:var(--pep-spacing-xs, .25rem);border-bottom:1px solid hsl(var(--pep-color-regular-h, 0),var(--pep-color-regular-s, 0%),calc(var(--pep-color-regular-l, 10%) + 30%))}.mapped-fields-area .mapped-field-container .separator-wrapper .list-actions{display:flex;gap:var(--pep-spacing-xs, .25rem)}.mapped-fields-area .mapped-field-container.cdk-drag-placeholder{box-shadow:0 0 0 var(--pep-spacing-xs, .25rem) hsla(var(--pep-color-text-link-h, 207),var(--pep-color-text-link-s, 76%),var(--pep-color-text-link-l, 37%),.5)}.mapped-fields-area .mapped-field-container.cdk-drag-placeholder .fields-wrapper,.mapped-fields-area .mapped-field-container.cdk-drag-placeholder .separator-wrapper{opacity:0}.mapped-fields-area .add-separator-container{max-width:600px;display:flex;justify-content:center;align-items:center;border-radius:var(--pep-border-radius-md, .25rem);height:var(--pep-spacing-lg, 1rem)}.mapped-fields-area .add-separator-container:not(.separator-container){padding-inline:var(--pep-spacing-lg, 1rem)}.mapped-fields-area .add-separator-container .add-separator{position:relative;display:none}.mapped-fields-area .add-separator-container:hover .add-separator{display:block}\n"], dependencies: [{ kind: "directive", type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i5.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i5.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "component", type: i6.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i7.PepButtonComponent, selector: "pep-button", inputs: ["key", "value", "styleType", "styleStateType", "sizeType", "classNames", "disabled", "iconName", "iconPosition", "visible"], outputs: ["buttonClick"] }, { kind: "component", type: i2.PepDialogComponent, selector: "pep-dialog", inputs: ["title", "showClose", "showHeader", "showFooter"], outputs: ["close"] }, { kind: "component", type: i1$1.PepIconComponent, selector: "pep-icon", inputs: ["spin", "name", "fill"] }, { kind: "component", type: i9.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: "15.2.10", ngImport: i0, type: MenuDataViewComponent, decorators: [{
             type: Component,
             args: [{ selector: 'menu-data-view', template: "<ng-container *ngIf=\"fields === null || fields.length === 0; then emptyTemplate; else notEmptyTemplate\"></ng-container>\n<ng-template #emptyTemplate>\n    <div [id]=\"emptyDropAreaId\" class=\"drop-field-here-area\" cdkDropList (cdkDropListDropped)=\"onDropField($event)\">\n        <mat-icon class=\"pep-spacing-element\">\n            <pep-icon name=\"arrow_down_alt\"></pep-icon>\n        </mat-icon>\n        <span class=\"body-sm ellipsis\">\n            {{ 'DATA_VIEW_BUILDER.EMPTY_DROP_AREA_TEXT' | translate }}\n        </span> \n    </div>\n</ng-template>\n<ng-template #notEmptyTemplate>\n    <div [id]=\"mappedFieldsId\" class=\"mapped-fields-area\" [ngClass]=\"{ 'no-row-gap': !isGrabbing }\"\n        cdkDropList [cdkDropListData]=\"fields\" (cdkDropListDropped)=\"onDropField($event)\">\n        <ng-container *ngFor=\"let menuField of fields; let i = index\" >\n            <div class=\"mapped-field-container\" [ngClass]=\"{ 'separator-container': menuField.FieldID === '' }\" \n                cdkDrag (cdkDragStarted)=\"onDragStart($event)\" (cdkDragEnded)=\"onDragEnd($event)\">\n                <ng-container *ngTemplateOutlet=\"mappedFieldTemplate; context: { menuField: menuField }\"></ng-container>\n            </div>\n            <div *ngIf=\"!isGrabbing\" class=\"add-separator-container\">\n                <pep-button *ngIf=\"showAddSeparator\" class=\"add-separator\" styleType=\"regular\" sizeType=\"sm\" iconName=\"number_plus\" \n                    [value]=\"'DATA_VIEW_BUILDER.ADD_SEPARATOR' | translate\" (buttonClick)=\"addSeparator(i+1)\"></pep-button>\n            </div>\n        </ng-container>\n    </div>\n</ng-template>\n\n<ng-template #mappedFieldTemplate let-menuField=\"menuField\">\n    <ng-container *ngIf=\"menuField.FieldID !== ''; then menuItemTemplate; else separatorTemplate\"></ng-container>\n\n    <ng-template #menuItemTemplate>\n        <div class=\"fields-wrapper\">\n            <pep-textbox [label]=\"itemKeyLabel\" [value]=\"menuField.FieldID\" [disabled]=\"true\">\n            </pep-textbox>\n            \n            <pep-textbox [label]=\"itemTitleLabel\" [hint]=\"'(' + (availableFieldsTitles.get(menuField.FieldID) || '') + ')'\"\n                [value]=\"menuField.Title\" (valueChange)=\"onTitleChanged($event, menuField)\">\n            </pep-textbox>\n    \n            <pep-button class=\"center-button\" iconName=\"system_bin\" [title]=\"'ACTIONS.DELETE' | translate\" (buttonClick)=\"onDeleteMappedField($event, menuField)\"></pep-button>\n        </div>\n    </ng-template>\n    <ng-template #separatorTemplate>\n        <div class=\"separator-wrapper \">\n            <div class=\"pep-spacing-element title title-md color-dimmed\">\n                <span [title]=\"menuField.Title\">{{ menuField.Title }}</span>\n            </div>\n            <div class=\"list-actions\">\n                <pep-button iconName=\"system_edit\" [title]=\"'ACTIONS.EDIT' | translate\" sizeType=\"xs\" styleType=\"regular\" (buttonClick)=\"onEditSeparatorField($event, menuField)\"></pep-button>\n                <pep-button iconName=\"system_bin\" [title]=\"'ACTIONS.DELETE' | translate\" sizeType=\"xs\" styleType=\"regular\" (buttonClick)=\"onDeleteMappedField($event, menuField)\"></pep-button>\n            </div>\n        </div>\n    </ng-template>\n</ng-template>\n\n<ng-template #separatorTitleModalTemplate let-data>\n    <pep-dialog [title]=\"'DATA_VIEW_BUILDER.SEPARATOR_TITLE' | translate\">\n        <ng-container pep-dialog-content>\n            <pep-textbox #txt [label]=\"'DATA_VIEW_BUILDER.ADD_A_TITLE' | translate\" [(value)]=\"data.value\">\n            </pep-textbox>\n        </ng-container>\n        <ng-container pep-dialog-actions>\n            <div class=\"pep-spacing-element-negative\">\n                <button mat-button class=\"pep-spacing-element pep-button md weak\"\n                    (click)=\"closeDialog()\">\n                    {{'Cancel' | translate}}\n                </button>\n                <button mat-button class=\"pep-spacing-element pep-button md strong\"\n                    (click)=\"setDialogValue(txt.value)\">\n                    {{ 'Save' | translate}}\n                </button>\n            </div>\n        </ng-container>\n    </pep-dialog>\n</ng-template>\n", styles: ["html body.inheritCursors *{cursor:inherit!important}.cdk-drag-preview.mapped-field-container{max-width:600px;display:flex;justify-content:center;align-items:center;border-radius:var(--pep-border-radius-md, .25rem)}.cdk-drag-preview.mapped-field-container:not(.separator-container){padding-inline:var(--pep-spacing-lg, 1rem)}.cdk-drag-preview.mapped-field-container:not(.separator-container){gap:calc(var(--pep-spacing-lg, 1rem) * 2);background:hsl(var(--pep-color-regular-h, 0),var(--pep-color-regular-s, 0%),98%);box-shadow:var(--pep-shadow-xs-offset, 0 .125rem .25rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.08);border:1px solid hsl(var(--pep-color-regular-h, 0),var(--pep-color-regular-s, 0%),calc(var(--pep-color-regular-l, 10%) + 30%))}.cdk-drag-preview.mapped-field-container .fields-wrapper{display:grid;width:100%;grid-template-columns:1fr 1fr auto;gap:.5rem;padding-top:.5rem}.cdk-drag-preview.mapped-field-container .fields-wrapper .center-button{margin-top:var(--pep-form-field-title-height, 1.5rem)}.cdk-drag-preview.mapped-field-container .separator-wrapper{display:grid;width:100%;grid-template-columns:1fr auto;padding-bottom:var(--pep-spacing-xs, .25rem);border-bottom:1px solid hsl(var(--pep-color-regular-h, 0),var(--pep-color-regular-s, 0%),calc(var(--pep-color-regular-l, 10%) + 30%))}.cdk-drag-preview.mapped-field-container .separator-wrapper .list-actions{display:flex;gap:var(--pep-spacing-xs, .25rem)}.drop-field-here-area{min-height:5rem;max-width:600px;display:flex;justify-content:center;align-items:center;border-radius:var(--pep-border-radius-md, .25rem);background:hsla(var(--pep-color-weak-h, 0),var(--pep-color-weak-s, 0%),var(--pep-color-weak-l, 10%),.08);position:relative}.drop-field-here-area:not(.separator-container){padding-inline:var(--pep-spacing-lg, 1rem)}.drop-field-here-area:after{z-index:0;content:\"\";transition:all .25s;display:block;position:absolute;inset:0;border-radius:inherit;border:1px dashed hsl(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),calc(var(--pep-color-system-primary-l, 10%) + 30%))}.drop-field-here-area.cdk-drop-list-dragging{box-shadow:0 0 0 var(--pep-spacing-xs, .25rem) hsla(var(--pep-color-text-link-h, 207),var(--pep-color-text-link-s, 76%),var(--pep-color-text-link-l, 37%),.5)}.drop-field-here-area.cdk-drop-list-dragging:hover{background:hsl(var(--pep-color-regular-h, 0),var(--pep-color-regular-s, 0%),98%);box-shadow:var(--pep-shadow-xs-offset, 0 .125rem .25rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.16);border:1px solid hsl(var(--pep-color-regular-h, 0),var(--pep-color-regular-s, 0%),calc(var(--pep-color-regular-l, 10%) + 20%));box-shadow:0 0 0 var(--pep-spacing-xs, .25rem) hsla(var(--pep-color-text-link-h, 207),var(--pep-color-text-link-s, 76%),var(--pep-color-text-link-l, 37%),.5)}.drop-field-here-area.cdk-drop-list-dragging ::ng-deep .placeholder-item{display:none}.mapped-fields-area{display:flex;flex-direction:column;column-gap:var(--pep-spacing-lg, 1rem)}.mapped-fields-area:not(.no-row-gap){row-gap:var(--pep-spacing-lg, 1rem)}.mapped-fields-area.cdk-drop-list-dragging ::ng-deep .placeholder-item{max-width:600px;display:flex;justify-content:center;align-items:center;border-radius:var(--pep-border-radius-md, .25rem);background:hsl(var(--pep-color-regular-h, 0),var(--pep-color-regular-s, 0%),98%);box-shadow:var(--pep-shadow-xs-offset, 0 .125rem .25rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.08);border:1px solid hsl(var(--pep-color-regular-h, 0),var(--pep-color-regular-s, 0%),calc(var(--pep-color-regular-l, 10%) + 30%));box-shadow:0 0 0 var(--pep-spacing-xs, .25rem) hsla(var(--pep-color-text-link-h, 207),var(--pep-color-text-link-s, 76%),var(--pep-color-text-link-l, 37%),.5);height:2.5rem}.mapped-fields-area.cdk-drop-list-dragging ::ng-deep .placeholder-item:not(.separator-container){padding-inline:var(--pep-spacing-lg, 1rem)}.mapped-fields-area .mapped-field-container{cursor:grab;max-width:600px;display:flex;justify-content:center;align-items:center;border-radius:var(--pep-border-radius-md, .25rem)}.mapped-fields-area .mapped-field-container:not(.separator-container){padding-inline:var(--pep-spacing-lg, 1rem)}.mapped-fields-area .mapped-field-container:not(.separator-container){gap:calc(var(--pep-spacing-lg, 1rem) * 2);background:hsl(var(--pep-color-regular-h, 0),var(--pep-color-regular-s, 0%),98%);box-shadow:var(--pep-shadow-xs-offset, 0 .125rem .25rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.08);border:1px solid hsl(var(--pep-color-regular-h, 0),var(--pep-color-regular-s, 0%),calc(var(--pep-color-regular-l, 10%) + 30%))}.mapped-fields-area .mapped-field-container .fields-wrapper{display:grid;width:100%;grid-template-columns:1fr 1fr auto;gap:.5rem;padding-top:.5rem}.mapped-fields-area .mapped-field-container .fields-wrapper .center-button{margin-top:var(--pep-form-field-title-height, 1.5rem)}.mapped-fields-area .mapped-field-container .separator-wrapper{display:grid;width:100%;grid-template-columns:1fr auto;padding-bottom:var(--pep-spacing-xs, .25rem);border-bottom:1px solid hsl(var(--pep-color-regular-h, 0),var(--pep-color-regular-s, 0%),calc(var(--pep-color-regular-l, 10%) + 30%))}.mapped-fields-area .mapped-field-container .separator-wrapper .list-actions{display:flex;gap:var(--pep-spacing-xs, .25rem)}.mapped-fields-area .mapped-field-container.cdk-drag-placeholder{box-shadow:0 0 0 var(--pep-spacing-xs, .25rem) hsla(var(--pep-color-text-link-h, 207),var(--pep-color-text-link-s, 76%),var(--pep-color-text-link-l, 37%),.5)}.mapped-fields-area .mapped-field-container.cdk-drag-placeholder .fields-wrapper,.mapped-fields-area .mapped-field-container.cdk-drag-placeholder .separator-wrapper{opacity:0}.mapped-fields-area .add-separator-container{max-width:600px;display:flex;justify-content:center;align-items:center;border-radius:var(--pep-border-radius-md, .25rem);height:var(--pep-spacing-lg, 1rem)}.mapped-fields-area .add-separator-container:not(.separator-container){padding-inline:var(--pep-spacing-lg, 1rem)}.mapped-fields-area .add-separator-container .add-separator{position:relative;display:none}.mapped-fields-area .add-separator-container:hover .add-separator{display:block}\n"] }]
         }], ctorParameters: function () { return [{ type: i1.TranslateService }, { type: i2.PepDialogService }, { type: DataViewBuilderService }]; }, propDecorators: { separatorTitleModalTemplate: [{
@@ -185,6 +185,21 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImpor
             }] } });
 class DataViewBuilderComponent {
+    set availableFields(value) {
+        this._availableFields = value;
+        this.setTitlesMap();
+    }
+    get availableFields() {
+        return this._availableFields;
+    }
+    set dataView(value) {
+        this._dataView = value;
+        this.setType();
+        this.refreshAvailableFields();
+    }
+    get dataView() {
+        return this._dataView;
+    }
     constructor(dataViewBuilderService) {
         this.dataViewBuilderService = dataViewBuilderService;
         // @Input() title: string = '';
@@ -201,21 +216,6 @@ class DataViewBuilderComponent {
         this.availableFieldsTitles = new Map();
         //
     }
-    set availableFields(value) {
-        this._availableFields = value;
-        this.setTitlesMap();
-    }
-    get availableFields() {
-        return this._availableFields;
-    }
-    set dataView(value) {
-        this._dataView = value;
-        this.setType();
-        this.refreshAvailableFields();
-    }
-    get dataView() {
-        return this._dataView;
-    }
     setType() {
         if (this._dataView.Type === 'Menu') {
             this.type = 'menu';
@@ -279,9 +279,9 @@ class DataViewBuilderComponent {
         this.notifyDataViewChange();
     }
 }
-DataViewBuilderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: DataViewBuilderComponent, deps: [{ token: DataViewBuilderService }], target: i0.ɵɵFactoryTarget.Component });
-DataViewBuilderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: DataViewBuilderComponent, selector: "pep-data-view-builder", inputs: { builderTitle: "builderTitle", builderTitleHint: "builderTitleHint", showAddSeparator: "showAddSeparator", itemKeyLabel: "itemKeyLabel", itemTitleLabel: "itemTitleLabel", availableFields: "availableFields", dataView: "dataView" }, outputs: { dataViewChange: "dataViewChange" }, ngImport: i0, template: "<pep-page-layout >\n    <!-- <ng-container pep-top-area>\n        <pep-top-bar [title]=\"title\">\n            <div header-end-content>\n            </div>\n        </pep-top-bar>\n    </ng-container> -->\n    <ng-container pep-main-area>\n        <ng-container *ngIf=\"type === 'not-supported' ; then notSupportedTemplate; else supportedTemplate\"></ng-container>\n        <ng-template #notSupportedTemplate>\n            <span class=\"body-sm ellipsis\">\n                {{ 'DATA_VIEW_BUILDER.TYPE_NOT_SUPPORTED' | translate }}\n            </span> \n        </ng-template>\n        <ng-template #supportedTemplate>\n            <div *ngIf=\"dataView && availableFields\" class=\"mapped-fields-container\">\n                <div class=\"available-fields-side-area\">\n                    <pep-draggable-items [items]=\"availableFields\" [title]=\"'DATA_VIEW_BUILDER.AVAILABLE_FIELDS' | translate\" titleType=\"with-bottom-border\" titleSizeType=\"md\"\n                        itemPlaceholderType=\"weak\" [showSearch]=\"true\" [dropAreaIds]=\"['emptyDropArea', 'mappedFields']\" (itemDragStarted)=\"onDragStart($event)\" (itemDragEnded)=\"onDragEnd($event)\">\n                    </pep-draggable-items>\n                </div>\n                <div pep-main-area class=\"mapped-fields-main-area\">\n                    <div class=\"mapped-fields-top-area pep-border-bottom\"\n                        [title]=\"builderTitle + ' ' + (builderTitleHint ? ('(' + builderTitleHint + ')') : '')\">\n                        <span class=\"title-md\">{{ builderTitle }}&nbsp;</span>\n                        <span *ngIf=\"builderTitleHint\" class=\"color-dimmed\">({{ builderTitleHint }})</span>\n                    </div>\n                    \n                    <div class=\"data-view-by-type-area\" [ngSwitch]=\"type\">\n                        <ng-container *ngSwitchCase=\"'menu'\">\n                            <menu-data-view [fields]=\"dataView?.Fields || []\" [availableFieldsTitles]=\"availableFieldsTitles\" [emptyDropAreaId]=\"emptyDropAreaId\"\n                                [mappedFieldsId]=\"mappedFieldsId\" (fieldsChange)=\"onFieldsChanged($event)\" [showAddSeparator]=\"showAddSeparator\" [itemKeyLabel]=\"itemKeyLabel\" [itemTitleLabel]=\"itemTitleLabel\">\n                            </menu-data-view>\n                        </ng-container>\n                        <!-- <ng-container *ngSwitchDefault>\n                        </ng-container> -->\n                    </div>\n                </div>\n            </div>\n        </ng-template>\n    </ng-container>\n</pep-page-layout>\n\n", styles: [".mapped-fields-container{display:grid;height:100%;grid-template-columns:auto 1fr;grid-template-areas:\"side-area    main-area\"}.mapped-fields-container .available-fields-side-area{grid-area:side-area;width:240px;max-width:240px;overflow:auto;height:inherit;padding-top:var(--pep-spacing-2xl, 2rem);margin-inline-end:calc(var(--pep-spacing-lg, 1rem) * 2)}.mapped-fields-container .mapped-fields-main-area{display:grid;grid-template-rows:auto 1fr;grid-area:main-area;padding-top:var(--pep-spacing-2xl, 2rem);overflow:auto;height:inherit}.mapped-fields-container .mapped-fields-main-area .mapped-fields-top-area{height:var(--pep-top-bar-field-height, 2.5rem);display:flex;align-items:center}.mapped-fields-container .mapped-fields-main-area .data-view-by-type-area{overflow:auto;height:inherit;padding-top:var(--pep-spacing-lg, 1rem);padding-bottom:var(--pep-spacing-lg, 1rem);padding-inline:var(--pep-spacing-xs, .25rem)}\n"], dependencies: [{ kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i4.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: i3.PepPageLayoutComponent, selector: "pep-page-layout", inputs: ["addPadding", "showShadow"] }, { kind: "component", type: i4$1.PepDraggableItemsComponent, selector: "pep-draggable-items", inputs: ["containerId", "showSearch", "title", "titleType", "titleSizeType", "itemPlaceholderType", "dropAreaIds", "items"], outputs: ["itemDragStarted", "itemDragEnded"] }, { kind: "component", type: MenuDataViewComponent, selector: "menu-data-view", inputs: ["fields", "availableFieldsTitles", "emptyDropAreaId", "mappedFieldsId", "showAddSeparator", "itemKeyLabel", "itemTitleLabel"], outputs: ["fieldsChange"] }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: DataViewBuilderComponent, decorators: [{
+DataViewBuilderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DataViewBuilderComponent, deps: [{ token: DataViewBuilderService }], target: i0.ɵɵFactoryTarget.Component });
+DataViewBuilderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: DataViewBuilderComponent, selector: "pep-data-view-builder", inputs: { builderTitle: "builderTitle", builderTitleHint: "builderTitleHint", showAddSeparator: "showAddSeparator", itemKeyLabel: "itemKeyLabel", itemTitleLabel: "itemTitleLabel", availableFields: "availableFields", dataView: "dataView" }, outputs: { dataViewChange: "dataViewChange" }, ngImport: i0, template: "<pep-page-layout >\n    <!-- <ng-container pep-top-area>\n        <pep-top-bar [title]=\"title\">\n            <div header-end-content>\n            </div>\n        </pep-top-bar>\n    </ng-container> -->\n    <ng-container pep-main-area>\n        <ng-container *ngIf=\"type === 'not-supported' ; then notSupportedTemplate; else supportedTemplate\"></ng-container>\n        <ng-template #notSupportedTemplate>\n            <span class=\"body-sm ellipsis\">\n                {{ 'DATA_VIEW_BUILDER.TYPE_NOT_SUPPORTED' | translate }}\n            </span> \n        </ng-template>\n        <ng-template #supportedTemplate>\n            <div *ngIf=\"dataView && availableFields\" class=\"mapped-fields-container\">\n                <div class=\"available-fields-side-area\">\n                    <pep-draggable-items [items]=\"availableFields\" [title]=\"'DATA_VIEW_BUILDER.AVAILABLE_FIELDS' | translate\" titleType=\"with-bottom-border\" titleSizeType=\"md\"\n                        itemPlaceholderType=\"weak\" [showSearch]=\"true\" [dropAreaIds]=\"['emptyDropArea', 'mappedFields']\" (itemDragStarted)=\"onDragStart($event)\" (itemDragEnded)=\"onDragEnd($event)\">\n                    </pep-draggable-items>\n                </div>\n                <div pep-main-area class=\"mapped-fields-main-area\">\n                    <div class=\"mapped-fields-top-area pep-border-bottom\"\n                        [title]=\"builderTitle + ' ' + (builderTitleHint ? ('(' + builderTitleHint + ')') : '')\">\n                        <span class=\"title-md\">{{ builderTitle }}&nbsp;</span>\n                        <span *ngIf=\"builderTitleHint\" class=\"color-dimmed\">({{ builderTitleHint }})</span>\n                    </div>\n                    \n                    <div class=\"data-view-by-type-area\" [ngSwitch]=\"type\">\n                        <ng-container *ngSwitchCase=\"'menu'\">\n                            <menu-data-view [fields]=\"dataView?.Fields || []\" [availableFieldsTitles]=\"availableFieldsTitles\" [emptyDropAreaId]=\"emptyDropAreaId\"\n                                [mappedFieldsId]=\"mappedFieldsId\" (fieldsChange)=\"onFieldsChanged($event)\" [showAddSeparator]=\"showAddSeparator\" [itemKeyLabel]=\"itemKeyLabel\" [itemTitleLabel]=\"itemTitleLabel\">\n                            </menu-data-view>\n                        </ng-container>\n                        <!-- <ng-container *ngSwitchDefault>\n                        </ng-container> -->\n                    </div>\n                </div>\n            </div>\n        </ng-template>\n    </ng-container>\n</pep-page-layout>\n\n", styles: [".mapped-fields-container{display:grid;height:100%;grid-template-columns:auto 1fr;grid-template-areas:\"side-area    main-area\"}.mapped-fields-container .available-fields-side-area{grid-area:side-area;width:240px;max-width:240px;overflow:auto;height:inherit;padding-top:var(--pep-spacing-2xl, 2rem);margin-inline-end:calc(var(--pep-spacing-lg, 1rem) * 2)}.mapped-fields-container .mapped-fields-main-area{display:grid;grid-template-rows:auto 1fr;grid-area:main-area;padding-top:var(--pep-spacing-2xl, 2rem);overflow:auto;height:inherit}.mapped-fields-container .mapped-fields-main-area .mapped-fields-top-area{height:var(--pep-top-bar-field-height, 2.5rem);display:flex;align-items:center}.mapped-fields-container .mapped-fields-main-area .data-view-by-type-area{overflow:auto;height:inherit;padding-top:var(--pep-spacing-lg, 1rem);padding-bottom:var(--pep-spacing-lg, 1rem);padding-inline:var(--pep-spacing-xs, .25rem)}\n"], dependencies: [{ kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i4.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: i3.PepPageLayoutComponent, selector: "pep-page-layout", inputs: ["addPadding", "showShadow"] }, { kind: "component", type: i4$1.PepDraggableItemsComponent, selector: "pep-draggable-items", inputs: ["containerId", "showSearch", "title", "titleType", "titleSizeType", "itemPlaceholderType", "dropAreaIds", "items"], outputs: ["itemDragStarted", "itemDragEnded"] }, { kind: "component", type: MenuDataViewComponent, selector: "menu-data-view", inputs: ["fields", "availableFieldsTitles", "emptyDropAreaId", "mappedFieldsId", "showAddSeparator", "itemKeyLabel", "itemTitleLabel"], outputs: ["fieldsChange"] }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DataViewBuilderComponent, decorators: [{
             type: Component,
             args: [{ selector: 'pep-data-view-builder', template: "<pep-page-layout >\n    <!-- <ng-container pep-top-area>\n        <pep-top-bar [title]=\"title\">\n            <div header-end-content>\n            </div>\n        </pep-top-bar>\n    </ng-container> -->\n    <ng-container pep-main-area>\n        <ng-container *ngIf=\"type === 'not-supported' ; then notSupportedTemplate; else supportedTemplate\"></ng-container>\n        <ng-template #notSupportedTemplate>\n            <span class=\"body-sm ellipsis\">\n                {{ 'DATA_VIEW_BUILDER.TYPE_NOT_SUPPORTED' | translate }}\n            </span> \n        </ng-template>\n        <ng-template #supportedTemplate>\n            <div *ngIf=\"dataView && availableFields\" class=\"mapped-fields-container\">\n                <div class=\"available-fields-side-area\">\n                    <pep-draggable-items [items]=\"availableFields\" [title]=\"'DATA_VIEW_BUILDER.AVAILABLE_FIELDS' | translate\" titleType=\"with-bottom-border\" titleSizeType=\"md\"\n                        itemPlaceholderType=\"weak\" [showSearch]=\"true\" [dropAreaIds]=\"['emptyDropArea', 'mappedFields']\" (itemDragStarted)=\"onDragStart($event)\" (itemDragEnded)=\"onDragEnd($event)\">\n                    </pep-draggable-items>\n                </div>\n                <div pep-main-area class=\"mapped-fields-main-area\">\n                    <div class=\"mapped-fields-top-area pep-border-bottom\"\n                        [title]=\"builderTitle + ' ' + (builderTitleHint ? ('(' + builderTitleHint + ')') : '')\">\n                        <span class=\"title-md\">{{ builderTitle }}&nbsp;</span>\n                        <span *ngIf=\"builderTitleHint\" class=\"color-dimmed\">({{ builderTitleHint }})</span>\n                    </div>\n                    \n                    <div class=\"data-view-by-type-area\" [ngSwitch]=\"type\">\n                        <ng-container *ngSwitchCase=\"'menu'\">\n                            <menu-data-view [fields]=\"dataView?.Fields || []\" [availableFieldsTitles]=\"availableFieldsTitles\" [emptyDropAreaId]=\"emptyDropAreaId\"\n                                [mappedFieldsId]=\"mappedFieldsId\" (fieldsChange)=\"onFieldsChanged($event)\" [showAddSeparator]=\"showAddSeparator\" [itemKeyLabel]=\"itemKeyLabel\" [itemTitleLabel]=\"itemTitleLabel\">\n                            </menu-data-view>\n                        </ng-container>\n                        <!-- <ng-container *ngSwitchDefault>\n                        </ng-container> -->\n                    </div>\n                </div>\n            </div>\n        </ng-template>\n    </ng-container>\n</pep-page-layout>\n\n", styles: [".mapped-fields-container{display:grid;height:100%;grid-template-columns:auto 1fr;grid-template-areas:\"side-area    main-area\"}.mapped-fields-container .available-fields-side-area{grid-area:side-area;width:240px;max-width:240px;overflow:auto;height:inherit;padding-top:var(--pep-spacing-2xl, 2rem);margin-inline-end:calc(var(--pep-spacing-lg, 1rem) * 2)}.mapped-fields-container .mapped-fields-main-area{display:grid;grid-template-rows:auto 1fr;grid-area:main-area;padding-top:var(--pep-spacing-2xl, 2rem);overflow:auto;height:inherit}.mapped-fields-container .mapped-fields-main-area .mapped-fields-top-area{height:var(--pep-top-bar-field-height, 2.5rem);display:flex;align-items:center}.mapped-fields-container .mapped-fields-main-area .data-view-by-type-area{overflow:auto;height:inherit;padding-top:var(--pep-spacing-lg, 1rem);padding-bottom:var(--pep-spacing-lg, 1rem);padding-inline:var(--pep-spacing-xs, .25rem)}\n"] }]
         }], ctorParameters: function () { return [{ type: DataViewBuilderService }]; }, propDecorators: { builderTitle: [{
@@ -314,8 +314,8 @@ class PepDataViewBuilderModule {
         this.pepIconRegistry.registerIcons(pepIcons);
     }
 }
-PepDataViewBuilderModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepDataViewBuilderModule, deps: [{ token: i1$1.PepIconRegistry }], target: i0.ɵɵFactoryTarget.NgModule });
-PepDataViewBuilderModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.0.2", ngImport: i0, type: PepDataViewBuilderModule, declarations: [DataViewBuilderComponent, MenuDataViewComponent], imports: [CommonModule,
+PepDataViewBuilderModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PepDataViewBuilderModule, deps: [{ token: i1$1.PepIconRegistry }], target: i0.ɵɵFactoryTarget.NgModule });
+PepDataViewBuilderModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: PepDataViewBuilderModule, declarations: [DataViewBuilderComponent, MenuDataViewComponent], imports: [CommonModule,
         DragDropModule,
         MatIconModule,
         PepNgxLibModule,
@@ -327,7 +327,7 @@ PepDataViewBuilderModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0"
         PepTextboxModule,
         PepTopBarModule,
         PepDraggableItemsModule], exports: [DataViewBuilderComponent] });
-PepDataViewBuilderModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepDataViewBuilderModule, providers: [DataViewBuilderService], imports: [CommonModule,
+PepDataViewBuilderModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PepDataViewBuilderModule, providers: [DataViewBuilderService], imports: [CommonModule,
         DragDropModule,
         MatIconModule,
         PepNgxLibModule,
@@ -339,7 +339,7 @@ PepDataViewBuilderModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0"
         PepTextboxModule,
         PepTopBarModule,
         PepDraggableItemsModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepDataViewBuilderModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PepDataViewBuilderModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [