npm - @pepperi-addons/ngx-lib - Versions diffs - 0.5.0-ng16.8 → 0.5.0-ng17.2 - Mend

@pepperi-addons/ngx-lib 0.5.0-ng16.8 → 0.5.0-ng17.2

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 (276) hide show

package/fesm2022/pepperi-addons-ngx-lib-chips.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"pepperi-addons-ngx-lib-chips.mjs","sources":["../../../projects/ngx-lib/chips/chips.service.ts","../../../projects/ngx-lib/chips/chips.component.ts","../../../projects/ngx-lib/chips/chips.component.html","../../../projects/ngx-lib/chips/chips.module.ts","../../../projects/ngx-lib/chips/public-api.ts","../../../projects/ngx-lib/chips/pepperi-addons-ngx-lib-chips.ts"],"sourcesContent":["import { Injectable } from '@angular/core';\nimport { Subject } from 'rxjs';\nimport { IPepChip } from './chips.model';\n\n@Injectable()\nexport class PepChipsService {\n private _chips: IPepChip[] = []; \n\n constructor() {\n //\n }\n\n get chips() {\n return this._chips;\n }\n\n get selected() {\n return this._chips.filter(chip => chip.selected).map(chip => chip.value);\n }\n\n initData(chips: IPepChip[]) {\n this._chips = []; \n if (chips?.length) {\n chips.forEach(chip => this.addChip(chip));\n } \n }\n\n addChip(chip: IPepChip) { \n this._chips.push({\n key: chip.key,\n value: chip.value,\n disabled: chip.disabled !== undefined ? chip.disabled : false,\n selected: chip.selected !== undefined ? chip.selected : false,\n removable: chip.removable !== undefined ? chip.removable : true,\n selectable: chip.selectable !== undefined ? chip.selectable : true\n })\n }\n}","import {\n Component,\n OnInit,\n Input,\n Output,\n EventEmitter,\n OnDestroy\n} from '@angular/core';\n// import { FormGroup } from '@angular/forms';\nimport { MatChipInputEvent, } from '@angular/material/chips';\nimport { TranslateService } from '@ngx-translate/core';\nimport { DEFAULT_HORIZONTAL_ALIGNMENT, PepHorizontalAlignment, PepLayoutType, PepStyleType, BaseDestroyerDirective } from '@pepperi-addons/ngx-lib';\nimport { IPepChip, PepChipsOrientationType, PepChipsInputType, IPepChipSelection } from './chips.model';\nimport { PepChipsService } from './chips.service';\n\n\n@Component({\n selector: 'pep-chips',\n templateUrl: './chips.component.html',\n styleUrls: ['./chips.component.scss', './chips.component.theme.scss'],\n providers: [PepChipsService]\n})\nexport class PepChipsComponent extends BaseDestroyerDirective implements OnInit {\n /*\n The chips within the chip list.\n * \n * @memberof PepChipsComponent\n /\n\n // @Input() form: FormGroup = null; // Why we need this?\n @Input() layoutType: PepLayoutType = 'form';\n @Input() inline = false;\n @Input() xAlignment: PepHorizontalAlignment = DEFAULT_HORIZONTAL_ALIGNMENT;\n @Input() renderTitle = true;\n @Input() showTitle = true; \n @Input() label = '';\n\n @Input() mandatory = false;\n @Input() disabled = false;\n @Input() classNames = '';\n \n @Input()\n set chips(chips: IPepChip[]) {\n this.chipsService.initData(chips);\n }\n get chips() {\n return this.chipsService.chips;\n }\n\n /\n The add chip emitter type.\n \n @type {PepChipsInputType}\n * @memberof PepChipsComponent\n /\n @Input() type: PepChipsInputType = 'input';\n\n /\n The chip layput direction type.\n \n @type {PepChipsOrientationType}\n * @memberof PepChipsComponent\n /\n @Input() orientation: PepChipsOrientationType = 'horizontal';\n\n /\n The style of the button.\n \n @type {PepStyleType}\n * @memberof PepButtonComponent\n /\n @Input() styleType: PepStyleType = 'regular';\n\n /\n Whether chip multi select allowed.\n * \n * @memberof PepChipsComponent\n /\n @Input() multiSelect = false;\n\n /\n Add new chip placeholder.\n * \n * @memberof PepChipsComponent\n /\n @Input() placeholder = '';\n\n /\n Add new chip(s) event.\n \n @type {EventEmitter<void>}\n * @memberof PepButtonComponent\n /\n @Output() fieldClick: EventEmitter<void> = new EventEmitter<void>();\n @Output() selectionChange: EventEmitter<IPepChipSelection> = new EventEmitter<IPepChipSelection>();\n\n /\n Selected chip(s)\n /\n get selected() {\n const selected = this.chipsService.selected; \n if (this.multiSelect) {\n return selected.length ? selected : [];\n } else {\n return selected.length ? selected[0] : null;\n } \n }\n\n constructor(public chipsService: PepChipsService, private _translate: TranslateService) {\n super();\n //\n }\n\n ngOnInit(): void {\n //\n }\n\n /\n Adding chip(s) to current chips list\n * @param chips Chip(s) to add\n /\n addChipsToList(chips: IPepChip[]) {\n chips.forEach(chip => this.chipsService.addChip(chip));\n } \n\n /\n On new chip added\n * @param event Chip addition event\n /\n onChipAdded(event: MatChipInputEvent): void {\n const value = (event.value \|\| '').trim();\n\n if (value) {\n this.chipsService.addChip({\n value: value\n });\n // clear the input value\n event.chipInput?.clear();\n }\n }\n\n /\n On chip removed\n * @param chip Removed chip item\n /\n onChipRemoved(chip: IPepChip): void {\n const index = this.chips.indexOf(chip);\n\n if (index >= 0) {\n this.chips.splice(index, 1);\n }\n }\n\n /\n On chip selection status changed\n * @param isSelected Whether the chip is selected\n * @param chip Selected chip item\n /\n onSelectionChanged(isSelected: boolean, chip: IPepChip) {\n chip.selected = isSelected;\n\n this.selectionChange.emit({\n value: chip.value,\n isSelected: isSelected\n })\n }\n\n /\n On Add new chip(s) clicked\n /\n onChipsSelectClicked() {\n this.fieldClick.emit();\n }\n\n}","<!-- <ng-container [formGroup]=\"form\"> -->\n <pep-field-title ngIf=\"renderTitle\" \n [label]=\"label\" \n [mandatory]=\"mandatory\"\n [disabled]=\"disabled\" \n [xAlignment]=\"xAlignment\" \n [showTitle]=\"showTitle\">\n </pep-field-title>\n <div class=\"pep-chips-container\" [ngClass]=\"[type === 'input' ? 'input-type-state' : '', chips?.length > 0 ? 'need-gap' : '' ]\" [ngStyle]=\"{ 'height': inline === true ? '100%' : 'auto' }\">\n <!-- <mat-form-field class=\"pep-chips-container keep-background-on-focus\" [ngClass]=\"type === 'select' ? 'not-mat-form-state' : ''\" appearance=\"outline\"> -->\n <mat-chip-grid #chipList [ngClass]=\"{'mat-chip-list-stacked': orientation === 'vertical'}\">\n <!-- If you need multi-select, implement selection logic in your component and use custom classes -->\n <mat-chip-row ngFor=\"let chip of chips\" class=\"pep-chips {{ styleType }} {{ classNames }}\" [disabled]=\"chip.disabled \|\| disabled\"\n [removable]=\"chip.removable\"\n (removed)=\"onChipRemoved(chip)\" (selectionChange)=\"onSelectionChanged($event.selected, chip)\">\n<!-- If you need selection state, add a custom class or attribute here and handle selection logic in your TS -->\n <span class=\"ellipsis pull-left flip noSelect\" title=\"{{chip.value}}\">{{chip.value}}</span>\n <pep-button ngIf=\"chip.removable\" matChipRemove styleType=\"weak\" styleStateType=\"system\" sizeType=\"xs\" iconName=\"system_close\"></pep-button>\n </mat-chip-row>\n </mat-chip-grid>\n <input ngIf=\"type === 'input' && !disabled\" matInput autocomplete=\"off\" class=\"chip-input\"\n [placeholder]=\"placeholder \|\| 'CHIPS.ADD_CHIP' \| translate\" [matChipInputFor]=\"chipList\"\n [matChipInputAddOnBlur]=\"true\" (matChipInputTokenEnd)=\"onChipAdded($event)\">\n <pep-button ngIf=\"type === 'select' && !disabled\" [value]=\"placeholder \|\| 'CHIPS.ADD_CHIP' \| translate\" styleType=\"weak\" styleStateType=\"system\" sizeType=\"xs\" iconName=\"number_plus\"\n iconPosition=\"end\" (buttonClick)=\"onChipsSelectClicked()\"></pep-button>\n <!-- </mat-form-field> -->\n </div>\n<!-- </ng-container> -->","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { ReactiveFormsModule } from '@angular/forms';\n\nimport { MatCommonModule } from '@angular/material/core';\nimport { MatFormFieldModule } from '@angular/material/form-field';\nimport { MatChipsModule, MAT_CHIPS_DEFAULT_OPTIONS } from '@angular/material/chips';\nimport { MatIconModule } from '@angular/material/icon';\nimport { COMMA, ENTER, TAB, SEMICOLON } from '@angular/cdk/keycodes';\n\nimport { TranslateModule } from '@ngx-translate/core';\n\nimport { PepNgxLibModule } from '@pepperi-addons/ngx-lib';\nimport { \n PepIconModule,\n PepIconRegistry,\n pepIconSystemBolt,\n pepIconSystemClose\n} from '@pepperi-addons/ngx-lib/icon';\n\nimport { PepFieldTitleModule } from '@pepperi-addons/ngx-lib/field-title';\nimport { PepButtonModule } from '@pepperi-addons/ngx-lib/button';\nimport { PepChipsComponent } from './chips.component';\n\nconst pepIcons = [\n pepIconSystemBolt,\n pepIconSystemClose\n];\n\n\n@NgModule({\n declarations: [PepChipsComponent],\n imports: [\n CommonModule,\n ReactiveFormsModule, \n MatCommonModule,\n MatFormFieldModule,\n MatChipsModule,\n MatIconModule,\n // Translation module\n TranslateModule,\n PepNgxLibModule,\n PepIconModule,\n PepFieldTitleModule, \n PepButtonModule\n ],\n exports: [PepChipsComponent],\n providers: [\n {\n provide: MAT_CHIPS_DEFAULT_OPTIONS,\n useValue: {\n separatorKeyCodes: [ENTER, COMMA]\n }\n }\n ] \n})\nexport class PepChipsModule {\n constructor(private pepIconRegistry: PepIconRegistry) {\n this.pepIconRegistry.registerIcons(pepIcons);\n }\n}\n","/\n Public API Surface of ngx-lib/chips\n /\nexport from './chips.module';\nexport * from './chips.component';\nexport * from './chips.model';\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":["i1.PepChipsService"],"mappings":"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"}
1	+ {"version":3,"file":"pepperi-addons-ngx-lib-chips.mjs","sources":["../../../projects/ngx-lib/chips/chips.service.ts","../../../projects/ngx-lib/chips/chips.component.ts","../../../projects/ngx-lib/chips/chips.component.html","../../../projects/ngx-lib/chips/chips.module.ts","../../../projects/ngx-lib/chips/public-api.ts","../../../projects/ngx-lib/chips/pepperi-addons-ngx-lib-chips.ts"],"sourcesContent":["import { Injectable } from '@angular/core';\nimport { Subject } from 'rxjs';\nimport { IPepChip } from './chips.model';\n\n@Injectable()\nexport class PepChipsService {\n private _chips: IPepChip[] = []; \n\n constructor() {\n //\n }\n\n get chips() {\n return this._chips;\n }\n\n get selected() {\n return this._chips.filter(chip => chip.selected).map(chip => chip.value);\n }\n\n initData(chips: IPepChip[]) {\n this._chips = []; \n if (chips?.length) {\n chips.forEach(chip => this.addChip(chip));\n } \n }\n\n addChip(chip: IPepChip) { \n this._chips.push({\n key: chip.key,\n value: chip.value,\n disabled: chip.disabled !== undefined ? chip.disabled : false,\n selected: chip.selected !== undefined ? chip.selected : false,\n removable: chip.removable !== undefined ? chip.removable : true,\n selectable: chip.selectable !== undefined ? chip.selectable : true\n })\n }\n}","import {\n Component,\n OnInit,\n Input,\n Output,\n EventEmitter,\n OnDestroy\n} from '@angular/core';\n// import { FormGroup } from '@angular/forms';\nimport { MatChipInputEvent, } from '@angular/material/chips';\nimport { TranslateService } from '@ngx-translate/core';\nimport { DEFAULT_HORIZONTAL_ALIGNMENT, PepHorizontalAlignment, PepLayoutType, PepStyleType, BaseDestroyerDirective } from '@pepperi-addons/ngx-lib';\nimport { IPepChip, PepChipsOrientationType, PepChipsInputType, IPepChipSelection } from './chips.model';\nimport { PepChipsService } from './chips.service';\n\n\n@Component({\n selector: 'pep-chips',\n templateUrl: './chips.component.html',\n styleUrls: ['./chips.component.scss', './chips.component.theme.scss'],\n providers: [PepChipsService]\n})\nexport class PepChipsComponent extends BaseDestroyerDirective implements OnInit {\n /*\n The chips within the chip list.\n * \n * @memberof PepChipsComponent\n /\n\n // @Input() form: FormGroup = null; // Why we need this?\n @Input() layoutType: PepLayoutType = 'form';\n @Input() inline = false;\n @Input() xAlignment: PepHorizontalAlignment = DEFAULT_HORIZONTAL_ALIGNMENT;\n @Input() renderTitle = true;\n @Input() showTitle = true; \n @Input() label = '';\n\n @Input() mandatory = false;\n @Input() disabled = false;\n @Input() classNames = '';\n \n @Input()\n set chips(chips: IPepChip[]) {\n this.chipsService.initData(chips);\n }\n get chips() {\n return this.chipsService.chips;\n }\n\n /\n The add chip emitter type.\n \n @type {PepChipsInputType}\n * @memberof PepChipsComponent\n /\n @Input() type: PepChipsInputType = 'input';\n\n /\n The chip layput direction type.\n \n @type {PepChipsOrientationType}\n * @memberof PepChipsComponent\n /\n @Input() orientation: PepChipsOrientationType = 'horizontal';\n\n /\n The style of the button.\n \n @type {PepStyleType}\n * @memberof PepButtonComponent\n /\n @Input() styleType: PepStyleType = 'regular';\n\n /\n Whether chip multi select allowed.\n * \n * @memberof PepChipsComponent\n /\n @Input() multiSelect = false;\n\n /\n Add new chip placeholder.\n * \n * @memberof PepChipsComponent\n /\n @Input() placeholder = '';\n\n /\n Add new chip(s) event.\n \n @type {EventEmitter<void>}\n * @memberof PepButtonComponent\n /\n @Output() fieldClick: EventEmitter<void> = new EventEmitter<void>();\n @Output() selectionChange: EventEmitter<IPepChipSelection> = new EventEmitter<IPepChipSelection>();\n\n /\n Selected chip(s)\n /\n get selected() {\n const selected = this.chipsService.selected; \n if (this.multiSelect) {\n return selected.length ? selected : [];\n } else {\n return selected.length ? selected[0] : null;\n } \n }\n\n constructor(public chipsService: PepChipsService, private _translate: TranslateService) {\n super();\n //\n }\n\n ngOnInit(): void {\n //\n }\n\n /\n Adding chip(s) to current chips list\n * @param chips Chip(s) to add\n /\n addChipsToList(chips: IPepChip[]) {\n chips.forEach(chip => this.chipsService.addChip(chip));\n } \n\n /\n On new chip added\n * @param event Chip addition event\n /\n onChipAdded(event: MatChipInputEvent): void {\n const value = (event.value \|\| '').trim();\n\n if (value) {\n this.chipsService.addChip({\n value: value\n });\n // clear the input value\n event.chipInput?.clear();\n }\n }\n\n /\n On chip removed\n * @param chip Removed chip item\n /\n onChipRemoved(chip: IPepChip): void {\n const index = this.chips.indexOf(chip);\n\n if (index >= 0) {\n this.chips.splice(index, 1);\n }\n }\n\n /\n On chip selection status changed\n * @param isSelected Whether the chip is selected\n * @param chip Selected chip item\n /\n onSelectionChanged(isSelected: boolean, chip: IPepChip) {\n chip.selected = isSelected;\n\n this.selectionChange.emit({\n value: chip.value,\n isSelected: isSelected\n })\n }\n\n /\n On Add new chip(s) clicked\n /\n onChipsSelectClicked() {\n this.fieldClick.emit();\n }\n\n}","<!-- <ng-container [formGroup]=\"form\"> -->\n <pep-field-title ngIf=\"renderTitle\" \n [label]=\"label\" \n [mandatory]=\"mandatory\"\n [disabled]=\"disabled\" \n [xAlignment]=\"xAlignment\" \n [showTitle]=\"showTitle\">\n </pep-field-title>\n <div class=\"pep-chips-container\" [ngClass]=\"[type === 'input' ? 'input-type-state' : '', chips?.length > 0 ? 'need-gap' : '' ]\" [ngStyle]=\"{ 'height': inline === true ? '100%' : 'auto' }\">\n <!-- <mat-form-field class=\"pep-chips-container keep-background-on-focus\" [ngClass]=\"type === 'select' ? 'not-mat-form-state' : ''\" appearance=\"outline\"> -->\n <mat-chip-grid #chipList [ngClass]=\"{'mat-chip-list-stacked': orientation === 'vertical'}\">\n <!-- If you need multi-select, implement selection logic in your component and use custom classes -->\n <mat-chip-row ngFor=\"let chip of chips\" class=\"pep-chips {{ styleType }} {{ classNames }}\" [disabled]=\"chip.disabled \|\| disabled\"\n [removable]=\"chip.removable\"\n (removed)=\"onChipRemoved(chip)\" (selectionChange)=\"onSelectionChanged($event.selected, chip)\">\n<!-- If you need selection state, add a custom class or attribute here and handle selection logic in your TS -->\n <span class=\"ellipsis pull-left flip noSelect\" title=\"{{chip.value}}\">{{chip.value}}</span>\n <pep-button ngIf=\"chip.removable\" matChipRemove styleType=\"weak\" styleStateType=\"system\" sizeType=\"xs\" iconName=\"system_close\"></pep-button>\n </mat-chip-row>\n </mat-chip-grid>\n <input ngIf=\"type === 'input' && !disabled\" matInput autocomplete=\"off\" class=\"chip-input\"\n [placeholder]=\"placeholder \|\| 'CHIPS.ADD_CHIP' \| translate\" [matChipInputFor]=\"chipList\"\n [matChipInputAddOnBlur]=\"true\" (matChipInputTokenEnd)=\"onChipAdded($event)\">\n <pep-button ngIf=\"type === 'select' && !disabled\" [value]=\"placeholder \|\| 'CHIPS.ADD_CHIP' \| translate\" styleType=\"weak\" styleStateType=\"system\" sizeType=\"xs\" iconName=\"number_plus\"\n iconPosition=\"end\" (buttonClick)=\"onChipsSelectClicked()\"></pep-button>\n <!-- </mat-form-field> -->\n </div>\n<!-- </ng-container> -->","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { ReactiveFormsModule } from '@angular/forms';\n\nimport { MatCommonModule } from '@angular/material/core';\nimport { MatFormFieldModule } from '@angular/material/form-field';\nimport { MatChipsModule, MAT_CHIPS_DEFAULT_OPTIONS } from '@angular/material/chips';\nimport { MatIconModule } from '@angular/material/icon';\nimport { COMMA, ENTER, TAB, SEMICOLON } from '@angular/cdk/keycodes';\n\nimport { TranslateModule } from '@ngx-translate/core';\n\nimport { PepNgxLibModule } from '@pepperi-addons/ngx-lib';\nimport { \n PepIconModule,\n PepIconRegistry,\n pepIconSystemBolt,\n pepIconSystemClose\n} from '@pepperi-addons/ngx-lib/icon';\n\nimport { PepFieldTitleModule } from '@pepperi-addons/ngx-lib/field-title';\nimport { PepButtonModule } from '@pepperi-addons/ngx-lib/button';\nimport { PepChipsComponent } from './chips.component';\n\nconst pepIcons = [\n pepIconSystemBolt,\n pepIconSystemClose\n];\n\n\n@NgModule({\n declarations: [PepChipsComponent],\n imports: [\n CommonModule,\n ReactiveFormsModule, \n MatCommonModule,\n MatFormFieldModule,\n MatChipsModule,\n MatIconModule,\n // Translation module\n TranslateModule,\n PepNgxLibModule,\n PepIconModule,\n PepFieldTitleModule, \n PepButtonModule\n ],\n exports: [PepChipsComponent],\n providers: [\n {\n provide: MAT_CHIPS_DEFAULT_OPTIONS,\n useValue: {\n separatorKeyCodes: [ENTER, COMMA]\n }\n }\n ] \n})\nexport class PepChipsModule {\n constructor(private pepIconRegistry: PepIconRegistry) {\n this.pepIconRegistry.registerIcons(pepIcons);\n }\n}\n","/\n Public API Surface of ngx-lib/chips\n /\nexport from './chips.module';\nexport * from './chips.component';\nexport * from './chips.model';\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":["i1.PepChipsService"],"mappings":";;;;;;;;;;;;;;;;;;;;;MAKa,eAAe,CAAA;IAChB,MAAM,GAAe,EAAE;AAE/B,IAAA,WAAA,GAAA;;IAEA;AAEA,IAAA,IAAI,KAAK,GAAA;QACL,OAAO,IAAI,CAAC,MAAM;IACtB;AAEA,IAAA,IAAI,QAAQ,GAAA;QACR,OAAO,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,IAAI,IAAI,IAAI,CAAC,QAAQ,CAAC,CAAC,GAAG,CAAC,IAAI,IAAI,IAAI,CAAC,KAAK,CAAC;IAC5E;AAEA,IAAA,QAAQ,CAAC,KAAiB,EAAA;AACtB,QAAA,IAAI,CAAC,MAAM,GAAG,EAAE;QAChB,IAAI,KAAK,EAAE,MAAM,EAAE;AACf,YAAA,KAAK,CAAC,OAAO,CAAC,IAAI,IAAI,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC;AAC5C,QAAA;IACL;AAEA,IAAA,OAAO,CAAC,IAAc,EAAA;AAClB,QAAA,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC;YACb,GAAG,EAAE,IAAI,CAAC,GAAG;YACb,KAAK,EAAE,IAAI,CAAC,KAAK;AACjB,YAAA,QAAQ,EAAE,IAAI,CAAC,QAAQ,KAAK,SAAS,GAAG,IAAI,CAAC,QAAQ,GAAG,KAAK;AAC7D,YAAA,QAAQ,EAAE,IAAI,CAAC,QAAQ,KAAK,SAAS,GAAG,IAAI,CAAC,QAAQ,GAAG,KAAK;AAC7D,YAAA,SAAS,EAAE,IAAI,CAAC,SAAS,KAAK,SAAS,GAAG,IAAI,CAAC,SAAS,GAAG,IAAI;AAC/D,YAAA,UAAU,EAAE,IAAI,CAAC,UAAU,KAAK,SAAS,GAAG,IAAI,CAAC,UAAU,GAAG;AACjE,SAAA,CAAC;IACN;wGA/BS,eAAe,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,UAAA,EAAA,CAAA;4GAAf,eAAe,EAAA,CAAA;;4FAAf,eAAe,EAAA,UAAA,EAAA,CAAA;kBAD3B;;;ACkBK,MAAO,iBAAkB,SAAQ,sBAAsB,CAAA;AAsFtC,IAAA,YAAA;AAAuC,IAAA,UAAA;AArF1D;;;;AAIE;;IAGO,UAAU,GAAkB,MAAM;IAClC,MAAM,GAAG,KAAK;IACd,UAAU,GAA2B,4BAA4B;IACjE,WAAW,GAAG,IAAI;IAClB,SAAS,GAAG,IAAI;IAChB,KAAK,GAAG,EAAE;IAEV,SAAS,GAAG,KAAK;IACjB,QAAQ,GAAG,KAAK;IAChB,UAAU,GAAG,EAAE;IAExB,IACI,KAAK,CAAC,KAAiB,EAAA;AACvB,QAAA,IAAI,CAAC,YAAY,CAAC,QAAQ,CAAC,KAAK,CAAC;IACrC;AACA,IAAA,IAAI,KAAK,GAAA;AACL,QAAA,OAAO,IAAI,CAAC,YAAY,CAAC,KAAK;IAClC;AAEA;;;;;AAKE;IACO,IAAI,GAAsB,OAAO;AAE1C;;;;;AAKE;IACO,WAAW,GAA4B,YAAY;AAE5D;;;;;AAKE;IACO,SAAS,GAAiB,SAAS;AAE5C;;;;AAIE;IACO,WAAW,GAAG,KAAK;AAE5B;;;;AAIE;IACO,WAAW,GAAG,EAAE;AAEzB;;;;;AAKG;AACO,IAAA,UAAU,GAAuB,IAAI,YAAY,EAAQ;AACzD,IAAA,eAAe,GAAoC,IAAI,YAAY,EAAqB;AAElG;;AAEG;AACH,IAAA,IAAI,QAAQ,GAAA;AACR,QAAA,MAAM,QAAQ,GAAG,IAAI,CAAC,YAAY,CAAC,QAAQ;QAC3C,IAAI,IAAI,CAAC,WAAW,EAAE;YAClB,OAAO,QAAQ,CAAC,MAAM,GAAG,QAAQ,GAAG,EAAE;AACzC,QAAA;AAAM,aAAA;AACH,YAAA,OAAO,QAAQ,CAAC,MAAM,GAAG,QAAQ,CAAC,CAAC,CAAC,GAAG,IAAI;AAC9C,QAAA;IACL;IAEA,WAAA,CAAmB,YAA6B,EAAU,UAA4B,EAAA;AAClF,QAAA,KAAK,EAAE;QADQ,IAAA,CAAA,YAAY,GAAZ,YAAY;QAA2B,IAAA,CAAA,UAAU,GAAV,UAAU;;IAGpE;IAEA,QAAQ,GAAA;;IAER;AAEA;;;AAGG;AACH,IAAA,cAAc,CAAC,KAAiB,EAAA;AAC5B,QAAA,KAAK,CAAC,OAAO,CAAC,IAAI,IAAI,IAAI,CAAC,YAAY,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC;IAC1D;AAEA;;;AAGG;AACH,IAAA,WAAW,CAAC,KAAwB,EAAA;AAChC,QAAA,MAAM,KAAK,GAAG,CAAC,KAAK,CAAC,KAAK,IAAI,EAAE,EAAE,IAAI,EAAE;AAExC,QAAA,IAAI,KAAK,EAAE;AACP,YAAA,IAAI,CAAC,YAAY,CAAC,OAAO,CAAC;AACtB,gBAAA,KAAK,EAAE;AACV,aAAA,CAAC;;AAEF,YAAA,KAAK,CAAC,SAAS,EAAE,KAAK,EAAE;AAC3B,QAAA;IACL;AAEA;;;AAGG;AACH,IAAA,aAAa,CAAC,IAAc,EAAA;QACxB,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC;QAEtC,IAAI,KAAK,IAAI,CAAC,EAAE;YACZ,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC,CAAC;AAC9B,QAAA;IACL;AAEA;;;;AAIG;IACH,kBAAkB,CAAC,UAAmB,EAAE,IAAc,EAAA;AAClD,QAAA,IAAI,CAAC,QAAQ,GAAG,UAAU;AAE1B,QAAA,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC;YACtB,KAAK,EAAE,IAAI,CAAC,KAAK;AACjB,YAAA,UAAU,EAAE;AACf,SAAA,CAAC;IACN;AAEA;;AAEG;IACH,oBAAoB,GAAA;AAChB,QAAA,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE;IAC1B;wGAtJS,iBAAiB,EAAA,IAAA,EAAA,CAAA,EAAA,KAAA,EAAAA,eAAA,EAAA,EAAA,EAAA,KAAA,EAAA,EAAA,CAAA,gBAAA,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAjB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,iBAAiB,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,EAAA,UAAA,EAAA,YAAA,EAAA,MAAA,EAAA,QAAA,EAAA,UAAA,EAAA,YAAA,EAAA,WAAA,EAAA,aAAA,EAAA,SAAA,EAAA,WAAA,EAAA,KAAA,EAAA,OAAA,EAAA,SAAA,EAAA,WAAA,EAAA,QAAA,EAAA,UAAA,EAAA,UAAA,EAAA,YAAA,EAAA,KAAA,EAAA,OAAA,EAAA,IAAA,EAAA,MAAA,EAAA,WAAA,EAAA,aAAA,EAAA,SAAA,EAAA,WAAA,EAAA,WAAA,EAAA,aAAA,EAAA,WAAA,EAAA,aAAA,EAAA,EAAA,OAAA,EAAA,EAAA,UAAA,EAAA,YAAA,EAAA,eAAA,EAAA,iBAAA,EAAA,EAAA,SAAA,EAFf,CAAC,eAAe,CAAC,iDCpBhC,kpEA2BwB,EAAA,MAAA,EAAA,CAAA,+sSAAA,EAAA,4xwBAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,kBAAA,EAAA,MAAA,EAAA,CAAA,SAAA,EAAA,cAAA,EAAA,eAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,IAAA,EAAA,QAAA,EAAA,QAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,UAAA,EAAA,UAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,WAAA,EAAA,QAAA,EAAA,eAAA,EAAA,MAAA,EAAA,CAAA,UAAA,EAAA,aAAA,EAAA,UAAA,EAAA,OAAA,EAAA,mBAAA,CAAA,EAAA,OAAA,EAAA,CAAA,QAAA,EAAA,aAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,YAAA,EAAA,QAAA,EAAA,wBAAA,EAAA,MAAA,EAAA,CAAA,iBAAA,EAAA,uBAAA,EAAA,+BAAA,EAAA,aAAA,EAAA,IAAA,EAAA,UAAA,CAAA,EAAA,OAAA,EAAA,CAAA,sBAAA,CAAA,EAAA,QAAA,EAAA,CAAA,cAAA,EAAA,iBAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,aAAA,EAAA,QAAA,EAAA,iBAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,UAAA,EAAA,QAAA,EAAA,wEAAA,EAAA,MAAA,EAAA,CAAA,UAAA,CAAA,EAAA,OAAA,EAAA,CAAA,QAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,sBAAA,EAAA,QAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,WAAA,EAAA,UAAA,EAAA,oBAAA,EAAA,MAAA,EAAA,YAAA,EAAA,WAAA,EAAA,aAAA,EAAA,cAAA,EAAA,WAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,kBAAA,EAAA,QAAA,EAAA,YAAA,EAAA,MAAA,EAAA,CAAA,KAAA,EAAA,OAAA,EAAA,WAAA,EAAA,gBAAA,EAAA,UAAA,EAAA,YAAA,EAAA,UAAA,EAAA,UAAA,EAAA,cAAA,EAAA,SAAA,CAAA,EAAA,OAAA,EAAA,CAAA,aAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,MAAA,EAAA,IAAA,EAAA,EAAA,CAAA,aAAA,EAAA,IAAA,EAAA,WAAA,EAAA,CAAA,EAAA,CAAA;;4FDLX,iBAAiB,EAAA,UAAA,EAAA,CAAA;kBAN7B,SAAS;+BACI,WAAW,EAAA,SAAA,EAGV,CAAC,eAAe,CAAC,EAAA,QAAA,EAAA,kpEAAA,EAAA,MAAA,EAAA,CAAA,+sSAAA,EAAA,4xwBAAA,CAAA,EAAA;gHAUnB,UAAU,EAAA,CAAA;sBAAlB;gBACQ,MAAM,EAAA,CAAA;sBAAd;gBACQ,UAAU,EAAA,CAAA;sBAAlB;gBACQ,WAAW,EAAA,CAAA;sBAAnB;gBACQ,SAAS,EAAA,CAAA;sBAAjB;gBACQ,KAAK,EAAA,CAAA;sBAAb;gBAEQ,SAAS,EAAA,CAAA;sBAAjB;gBACQ,QAAQ,EAAA,CAAA;sBAAhB;gBACQ,UAAU,EAAA,CAAA;sBAAlB;gBAGG,KAAK,EAAA,CAAA;sBADR;gBAcQ,IAAI,EAAA,CAAA;sBAAZ;gBAQQ,WAAW,EAAA,CAAA;sBAAnB;gBAQQ,SAAS,EAAA,CAAA;sBAAjB;gBAOQ,WAAW,EAAA,CAAA;sBAAnB;gBAOQ,WAAW,EAAA,CAAA;sBAAnB;gBAQS,UAAU,EAAA,CAAA;sBAAnB;gBACS,eAAe,EAAA,CAAA;sBAAxB;;;AEtEL,MAAM,QAAQ,GAAG;IACb,iBAAiB;IACjB;CACH;MA6BY,cAAc,CAAA;AACH,IAAA,eAAA;AAApB,IAAA,WAAA,CAAoB,eAAgC,EAAA;QAAhC,IAAA,CAAA,eAAe,GAAf,eAAe;AAC/B,QAAA,IAAI,CAAC,eAAe,CAAC,aAAa,CAAC,QAAQ,CAAC;IAChD;wGAHS,cAAc,EAAA,IAAA,EAAA,CAAA,EAAA,KAAA,EAAA,EAAA,CAAA,eAAA,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA;yGAAd,cAAc,EAAA,YAAA,EAAA,CAzBR,iBAAiB,CAAA,EAAA,OAAA,EAAA,CAE5B,YAAY;YACZ,mBAAmB;YACnB,eAAe;YACf,kBAAkB;YAClB,cAAc;YACd,aAAa;;YAEb,eAAe;YACf,eAAe;YACf,aAAa;YACb,mBAAmB;AACnB,YAAA,eAAe,aAET,iBAAiB,CAAA,EAAA,CAAA;AAUlB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,cAAc,EAAA,SAAA,EATZ;AACP,YAAA;AACE,gBAAA,OAAO,EAAE,yBAAyB;AAClC,gBAAA,QAAQ,EAAE;AACR,oBAAA,iBAAiB,EAAE,CAAC,KAAK,EAAE,KAAK;AACjC;AACF;AACF,SAAA,EAAA,OAAA,EAAA,CArBC,YAAY;YACZ,mBAAmB;YACnB,eAAe;YACf,kBAAkB;YAClB,cAAc;YACd,aAAa;;YAEb,eAAe;YACf,eAAe;YACf,aAAa;YACb,mBAAmB;YACnB,eAAe,CAAA,EAAA,CAAA;;4FAYV,cAAc,EAAA,UAAA,EAAA,CAAA;kBA1B1B,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;oBACN,YAAY,EAAE,CAAC,iBAAiB,CAAC;AACjC,oBAAA,OAAO,EAAE;wBACL,YAAY;wBACZ,mBAAmB;wBACnB,eAAe;wBACf,kBAAkB;wBAClB,cAAc;wBACd,aAAa;;wBAEb,eAAe;wBACf,eAAe;wBACf,aAAa;wBACb,mBAAmB;wBACnB;AACH,qBAAA;oBACD,OAAO,EAAE,CAAC,iBAAiB,CAAC;AAC5B,oBAAA,SAAS,EAAE;AACP,wBAAA;AACE,4BAAA,OAAO,EAAE,yBAAyB;AAClC,4BAAA,QAAQ,EAAE;AACR,gCAAA,iBAAiB,EAAE,CAAC,KAAK,EAAE,KAAK;AACjC;AACF;AACF;AACN,iBAAA;;;ACvDD;;AAEG;;ACFH;;AAEG;;;;"}

package/fesm2022/pepperi-addons-ngx-lib-color.mjs CHANGED Viewed

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { Component, Inject, EventEmitter, Input, Output, NgModule } from '@angular/core';
+import { Inject, Component, EventEmitter, Output, Input, NgModule } from '@angular/core';
 import * as i3 from '@angular/common';
 import { CommonModule } from '@angular/common';
 import { ReactiveFormsModule } from '@angular/forms';
@@ -231,16 +231,16 @@ class PepColorPickerComponent {
     closeDialog(event) {
         this.dialogRef.close(event);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PepColorPickerComponent, deps: [{ token: i1.PepColorService }, { token: i2.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: PepColorPickerComponent, selector: "ng-component", ngImport: i0, template: "<div class=\"pep-color-picker-container\">\n    <pep-dialog [title]=\"'COLOR.DIALOG_TITLE' | translate\" (close)=\"closeDialog($event)\">\n        <ng-container pep-dialog-content>\n            <div class=\"color-chooser-content\">\n                <div class=\"current-color\" [ngStyle]=\"{ 'background': data?.value ? data.value : 'transparent' }\"></div>\n\n                <pep-slider class=\"slider-box\" [label]=\"'COLOR.CHANGE_HUE' | translate\" [minValue]=\"currentHueMin\"\n                    [maxValue]=\"currentHueMax\" [value]=\"currentHue\" [background]=\"currentHueBackground\"\n                    (valueChange)=\"onHueChange($event)\">\n                </pep-slider>\n                <pep-slider class=\"slider-box\" [label]=\"'COLOR.CHANGE_SATURATION' | translate\"\n                    [minValue]=\"currentSaturationMin\" [maxValue]=\"currentSaturationMax\" [value]=\"currentSaturation\"\n                    [background]=\"currentSaturationBackground\" (valueChange)=\"onSaturationChange($event)\">\n                </pep-slider>\n                <pep-slider class=\"slider-box\" [label]=\"'COLOR.CHANGE_LIGHTNESS' | translate\"\n                    [minValue]=\"currentLightnessMin\" [maxValue]=\"currentLightnessMax\"\n                    [value]=\"currentLightnessMax - currentLightness + currentLightnessMin\"\n                    [background]=\"currentLightnessBackground\" (valueChange)=\"onLightnessChange($event)\">\n                </pep-slider>\n            </div>\n            <div class=\"color-value-content\">\n                <div class=\"color-value\" [ngClass]=\"{ 'with-complient': checkAAComplient }\">\n                    <pep-textbox [key]=\"'colorValue'\" [label]=\"'COLOR.ADD_VALUE_HERE' | translate \"\n                        [value]=\"data?.value\" (valueChange)=\"onColorValueChange($event)\">\n                    </pep-textbox>\n                </div>\n                <div *ngIf=\"checkAAComplient\" class=\"color-complient-container\">\n                    <pep-field-title [label]=\"'COLOR.AA_COMPLIENT' | translate \">\n                    </pep-field-title>\n                    <div class=\"color-complient\" [ngStyle]=\"{ 'background': complientColor }\">\n                        <mat-icon *ngIf=\"isUserChooseAAComplientColor\">\n                            <pep-icon name=\"system_ok\">\n                            </pep-icon>\n                        </mat-icon>\n                    </div>\n                </div>\n            </div>\n        </ng-container>\n        <ng-container pep-dialog-actions>\n            <div class=\"color-actions pep-spacing-element-negative\" [ngStyle]=\"{'justify-content': data.showAAComplient ? 'space-between' : 'flex-end'}\">\n                <mat-checkbox *ngIf=\"data.showAAComplient\" class=\"pep-spacing-element\" type=\"checkbox\"\n                    id=\"checkAAComplient\" (change)=\"checkAAComplient = !checkAAComplient\" [checked]=\"checkAAComplient\">\n                    <span class=\"body-xs ellipsis\">{{ 'COLOR.AA_COMPLIENT' | translate }}</span>\n                </mat-checkbox>\n                <div>\n                    <button mat-button [mat-dialog-close]=\"null\" class=\"pep-spacing-element pep-button md weak\">\n                        {{'ACTIONS.CANCEL' | translate}}\n                    </button>\n                    <button mat-button class=\"pep-spacing-element pep-button md strong\" (click)=\"onSave($event)\">\n                        {{'ACTIONS.DONE' | translate}}\n                    </button>\n                </div>\n            </div>\n        </ng-container>\n    </pep-dialog>\n</div>", styles: [".mat-slider-track-background,.mat-mdc-slider-track-background,.mat-slider-horizontal .mat-slider-track-fill,.mat-mdc-slider-horizontal .mat-mdc-slider-track-fill{display:none}.pepperi-color-picker-container ::ng-deep .mat-dialog-content,.pepperi-color-picker-container ::ng-deep .mat-mdc-dialog-content,.pep-color-picker-container ::ng-deep .mat-dialog-content,.pep-color-picker-container ::ng-deep .mat-mdc-dialog-content{padding:var(--pep-spacing-sm, .5rem) var(--pep-spacing-sm, .5rem) 0}.pepperi-color-picker-container .color-chooser-content,.pep-color-picker-container .color-chooser-content{display:grid;grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(3,1fr);grid-column-gap:var(--pep-spacing-xl, 1.5rem);grid-row-gap:var(--pep-spacing-sm, .5rem);margin-top:var(--pep-spacing-sm, .5rem)}.pepperi-color-picker-container .color-chooser-content .current-color,.pep-color-picker-container .color-chooser-content .current-color{grid-row:1/span 3;grid-column:7/span 4;border-radius:var(--pep-border-radius-md, .25rem);width:9.25rem;height:9.25rem}.pepperi-color-picker-container .color-chooser-content .slider-box,.pep-color-picker-container .color-chooser-content .slider-box{grid-column:1/span 6}.pepperi-color-picker-container .color-value-content,.pep-color-picker-container .color-value-content{display:grid;grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(1,1fr);grid-column-gap:var(--pep-spacing-xl, 1.5rem);grid-row-gap:var(--pep-spacing-sm, .5rem);margin-top:1.5rem}.pepperi-color-picker-container .color-value-content .color-value,.pep-color-picker-container .color-value-content .color-value{grid-row:1/span 1;grid-column:1/span 9}.pepperi-color-picker-container .color-value-content .color-value.with-complient,.pep-color-picker-container .color-value-content .color-value.with-complient{grid-column:1/span 6}.pepperi-color-picker-container .color-value-content .color-complient-container,.pep-color-picker-container .color-value-content .color-complient-container{grid-column:7/span 4}.pepperi-color-picker-container .color-value-content .color-complient-container .color-complient,.pep-color-picker-container .color-value-content .color-complient-container .color-complient{display:flex;justify-content:center;align-items:center;border-radius:var(--pep-border-radius-md, .25rem);height:var(--pep-form-field-height, 2.5rem);width:9.25rem}.pepperi-color-picker-container ::ng-deep .mat-dialog-actions,.pepperi-color-picker-container ::ng-deep .mat-mdc-dialog-actions,.pep-color-picker-container ::ng-deep .mat-dialog-actions,.pep-color-picker-container ::ng-deep .mat-mdc-dialog-actions{display:block}.pepperi-color-picker-container ::ng-deep .mat-dialog-actions .color-actions,.pepperi-color-picker-container ::ng-deep .mat-mdc-dialog-actions .color-actions,.pep-color-picker-container ::ng-deep .mat-dialog-actions .color-actions,.pep-color-picker-container ::ng-deep .mat-mdc-dialog-actions .color-actions{display:flex;justify-content:space-between;align-items:center}\n", ".pepperi-color-picker-container .color-value-content .color-complient-container .color-complient ::ng-deep .mat-icon .svg-icon,.pepperi-color-picker-container .color-value-content .color-complient-container .color-complient ::ng-deep .mat-mdc-icon .svg-icon,.pep-color-picker-container .color-value-content .color-complient-container .color-complient ::ng-deep .mat-icon .svg-icon,.pep-color-picker-container .color-value-content .color-complient-container .color-complient ::ng-deep .mat-mdc-icon .svg-icon{fill:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}\n"], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i4.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i5.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex"], exportAs: ["matCheckbox"] }, { kind: "directive", type: i2.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "component", type: i6.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i1$1.PepDialogComponent, selector: "pep-dialog", inputs: ["title", "showClose", "showHeader", "showFooter"], outputs: ["close"] }, { kind: "component", type: i1$2.PepIconComponent, selector: "pep-icon", inputs: ["spin", "name", "fill"] }, { kind: "component", type: i9.PepSliderComponent, selector: "pep-slider", inputs: ["label", "disabled", "hint", "background", "step", "minValue", "maxValue", "value"], outputs: ["valueChange", "inputChange"] }, { kind: "component", type: i10.PepFieldTitleComponent, selector: "pep-field-title", inputs: ["label", "mandatory", "disabled", "maxFieldCharacters", "hint", "xAlignment", "showTitle", "inputLength", "fontBodyType", "multiLine"] }, { kind: "component", type: i11.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: i12.TranslatePipe, name: "translate" }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: PepColorPickerComponent, deps: [{ token: i1.PepColorService }, { token: i2.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: PepColorPickerComponent, selector: "ng-component", ngImport: i0, template: "<div class=\"pep-color-picker-container\">\n    <pep-dialog [title]=\"'COLOR.DIALOG_TITLE' | translate\" (close)=\"closeDialog($event)\">\n        <ng-container pep-dialog-content>\n            <div class=\"color-chooser-content\">\n                <div class=\"current-color\" [ngStyle]=\"{ 'background': data?.value ? data.value : 'transparent' }\"></div>\n\n                <pep-slider class=\"slider-box\" [label]=\"'COLOR.CHANGE_HUE' | translate\" [minValue]=\"currentHueMin\"\n                    [maxValue]=\"currentHueMax\" [value]=\"currentHue\" [background]=\"currentHueBackground\"\n                    (valueChange)=\"onHueChange($event)\">\n                </pep-slider>\n                <pep-slider class=\"slider-box\" [label]=\"'COLOR.CHANGE_SATURATION' | translate\"\n                    [minValue]=\"currentSaturationMin\" [maxValue]=\"currentSaturationMax\" [value]=\"currentSaturation\"\n                    [background]=\"currentSaturationBackground\" (valueChange)=\"onSaturationChange($event)\">\n                </pep-slider>\n                <pep-slider class=\"slider-box\" [label]=\"'COLOR.CHANGE_LIGHTNESS' | translate\"\n                    [minValue]=\"currentLightnessMin\" [maxValue]=\"currentLightnessMax\"\n                    [value]=\"currentLightnessMax - currentLightness + currentLightnessMin\"\n                    [background]=\"currentLightnessBackground\" (valueChange)=\"onLightnessChange($event)\">\n                </pep-slider>\n            </div>\n            <div class=\"color-value-content\">\n                <div class=\"color-value\" [ngClass]=\"{ 'with-complient': checkAAComplient }\">\n                    <pep-textbox [key]=\"'colorValue'\" [label]=\"'COLOR.ADD_VALUE_HERE' | translate \"\n                        [value]=\"data?.value\" (valueChange)=\"onColorValueChange($event)\">\n                    </pep-textbox>\n                </div>\n                <div *ngIf=\"checkAAComplient\" class=\"color-complient-container\">\n                    <pep-field-title [label]=\"'COLOR.AA_COMPLIENT' | translate \">\n                    </pep-field-title>\n                    <div class=\"color-complient\" [ngStyle]=\"{ 'background': complientColor }\">\n                        <mat-icon *ngIf=\"isUserChooseAAComplientColor\">\n                            <pep-icon name=\"system_ok\">\n                            </pep-icon>\n                        </mat-icon>\n                    </div>\n                </div>\n            </div>\n        </ng-container>\n        <ng-container pep-dialog-actions>\n            <div class=\"color-actions pep-spacing-element-negative\" [ngStyle]=\"{'justify-content': data.showAAComplient ? 'space-between' : 'flex-end'}\">\n                <mat-checkbox *ngIf=\"data.showAAComplient\" class=\"pep-spacing-element\" type=\"checkbox\"\n                    id=\"checkAAComplient\" (change)=\"checkAAComplient = !checkAAComplient\" [checked]=\"checkAAComplient\">\n                    <span class=\"body-xs ellipsis\">{{ 'COLOR.AA_COMPLIENT' | translate }}</span>\n                </mat-checkbox>\n                <div>\n                    <button mat-button [mat-dialog-close]=\"null\" class=\"pep-spacing-element pep-button md weak\">\n                        {{'ACTIONS.CANCEL' | translate}}\n                    </button>\n                    <button mat-button class=\"pep-spacing-element pep-button md strong\" (click)=\"onSave($event)\">\n                        {{'ACTIONS.DONE' | translate}}\n                    </button>\n                </div>\n            </div>\n        </ng-container>\n    </pep-dialog>\n</div>", styles: [".mat-slider-track-background,.mat-mdc-slider-track-background,.mat-slider-horizontal .mat-slider-track-fill,.mat-mdc-slider-horizontal .mat-mdc-slider-track-fill{display:none}.pepperi-color-picker-container ::ng-deep .mat-dialog-content,.pepperi-color-picker-container ::ng-deep .mat-mdc-dialog-content,.pep-color-picker-container ::ng-deep .mat-dialog-content,.pep-color-picker-container ::ng-deep .mat-mdc-dialog-content{padding:var(--pep-spacing-sm, .5rem) var(--pep-spacing-sm, .5rem) 0}.pepperi-color-picker-container .color-chooser-content,.pep-color-picker-container .color-chooser-content{display:-ms-grid;display:grid;grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(3,1fr);grid-column-gap:var(--pep-spacing-xl, 1.5rem);grid-row-gap:var(--pep-spacing-sm, .5rem);margin-top:var(--pep-spacing-sm, .5rem)}.pepperi-color-picker-container .color-chooser-content .current-color,.pep-color-picker-container .color-chooser-content .current-color{grid-row:1/span 3;grid-column:7/span 4;border-radius:var(--pep-border-radius-md, .25rem);width:9.25rem;height:9.25rem}.pepperi-color-picker-container .color-chooser-content .slider-box,.pep-color-picker-container .color-chooser-content .slider-box{grid-column:1/span 6}.pepperi-color-picker-container .color-value-content,.pep-color-picker-container .color-value-content{display:-ms-grid;display:grid;grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(1,1fr);grid-column-gap:var(--pep-spacing-xl, 1.5rem);grid-row-gap:var(--pep-spacing-sm, .5rem);margin-top:1.5rem}.pepperi-color-picker-container .color-value-content .color-value,.pep-color-picker-container .color-value-content .color-value{grid-row:1/span 1;grid-column:1/span 9}.pepperi-color-picker-container .color-value-content .color-value.with-complient,.pep-color-picker-container .color-value-content .color-value.with-complient{grid-column:1/span 6}.pepperi-color-picker-container .color-value-content .color-complient-container,.pep-color-picker-container .color-value-content .color-complient-container{grid-column:7/span 4}.pepperi-color-picker-container .color-value-content .color-complient-container .color-complient,.pep-color-picker-container .color-value-content .color-complient-container .color-complient{display:flex;justify-content:center;align-items:center;border-radius:var(--pep-border-radius-md, .25rem);height:var(--pep-form-field-height, 2.5rem);width:9.25rem}.pepperi-color-picker-container ::ng-deep .mat-dialog-actions,.pepperi-color-picker-container ::ng-deep .mat-mdc-dialog-actions,.pep-color-picker-container ::ng-deep .mat-dialog-actions,.pep-color-picker-container ::ng-deep .mat-mdc-dialog-actions{display:block}.pepperi-color-picker-container ::ng-deep .mat-dialog-actions .color-actions,.pepperi-color-picker-container ::ng-deep .mat-mdc-dialog-actions .color-actions,.pep-color-picker-container ::ng-deep .mat-dialog-actions .color-actions,.pep-color-picker-container ::ng-deep .mat-mdc-dialog-actions .color-actions{display:flex;justify-content:space-between;align-items:center}\n", ".pepperi-color-picker-container .color-value-content .color-complient-container .color-complient ::ng-deep .mat-icon .svg-icon,.pepperi-color-picker-container .color-value-content .color-complient-container .color-complient ::ng-deep .mat-mdc-icon .svg-icon,.pep-color-picker-container .color-value-content .color-complient-container .color-complient ::ng-deep .mat-icon .svg-icon,.pep-color-picker-container .color-value-content .color-complient-container .color-complient ::ng-deep .mat-mdc-icon .svg-icon{fill:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}\n"], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i4.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: i5.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "directive", type: i2.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "component", type: i6.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i1$1.PepDialogComponent, selector: "pep-dialog", inputs: ["title", "showClose", "showHeader", "showFooter"], outputs: ["close"] }, { kind: "component", type: i1$2.PepIconComponent, selector: "pep-icon", inputs: ["spin", "name", "fill"] }, { kind: "component", type: i9.PepSliderComponent, selector: "pep-slider", inputs: ["label", "disabled", "hint", "background", "step", "minValue", "maxValue", "value"], outputs: ["valueChange", "inputChange"] }, { kind: "component", type: i10.PepFieldTitleComponent, selector: "pep-field-title", inputs: ["label", "mandatory", "disabled", "maxFieldCharacters", "hint", "xAlignment", "showTitle", "inputLength", "fontBodyType", "multiLine"] }, { kind: "component", type: i11.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: i12.TranslatePipe, name: "translate" }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PepColorPickerComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: PepColorPickerComponent, decorators: [{
             type: Component,
-            args: [{ template: "<div class=\"pep-color-picker-container\">\n    <pep-dialog [title]=\"'COLOR.DIALOG_TITLE' | translate\" (close)=\"closeDialog($event)\">\n        <ng-container pep-dialog-content>\n            <div class=\"color-chooser-content\">\n                <div class=\"current-color\" [ngStyle]=\"{ 'background': data?.value ? data.value : 'transparent' }\"></div>\n\n                <pep-slider class=\"slider-box\" [label]=\"'COLOR.CHANGE_HUE' | translate\" [minValue]=\"currentHueMin\"\n                    [maxValue]=\"currentHueMax\" [value]=\"currentHue\" [background]=\"currentHueBackground\"\n                    (valueChange)=\"onHueChange($event)\">\n                </pep-slider>\n                <pep-slider class=\"slider-box\" [label]=\"'COLOR.CHANGE_SATURATION' | translate\"\n                    [minValue]=\"currentSaturationMin\" [maxValue]=\"currentSaturationMax\" [value]=\"currentSaturation\"\n                    [background]=\"currentSaturationBackground\" (valueChange)=\"onSaturationChange($event)\">\n                </pep-slider>\n                <pep-slider class=\"slider-box\" [label]=\"'COLOR.CHANGE_LIGHTNESS' | translate\"\n                    [minValue]=\"currentLightnessMin\" [maxValue]=\"currentLightnessMax\"\n                    [value]=\"currentLightnessMax - currentLightness + currentLightnessMin\"\n                    [background]=\"currentLightnessBackground\" (valueChange)=\"onLightnessChange($event)\">\n                </pep-slider>\n            </div>\n            <div class=\"color-value-content\">\n                <div class=\"color-value\" [ngClass]=\"{ 'with-complient': checkAAComplient }\">\n                    <pep-textbox [key]=\"'colorValue'\" [label]=\"'COLOR.ADD_VALUE_HERE' | translate \"\n                        [value]=\"data?.value\" (valueChange)=\"onColorValueChange($event)\">\n                    </pep-textbox>\n                </div>\n                <div *ngIf=\"checkAAComplient\" class=\"color-complient-container\">\n                    <pep-field-title [label]=\"'COLOR.AA_COMPLIENT' | translate \">\n                    </pep-field-title>\n                    <div class=\"color-complient\" [ngStyle]=\"{ 'background': complientColor }\">\n                        <mat-icon *ngIf=\"isUserChooseAAComplientColor\">\n                            <pep-icon name=\"system_ok\">\n                            </pep-icon>\n                        </mat-icon>\n                    </div>\n                </div>\n            </div>\n        </ng-container>\n        <ng-container pep-dialog-actions>\n            <div class=\"color-actions pep-spacing-element-negative\" [ngStyle]=\"{'justify-content': data.showAAComplient ? 'space-between' : 'flex-end'}\">\n                <mat-checkbox *ngIf=\"data.showAAComplient\" class=\"pep-spacing-element\" type=\"checkbox\"\n                    id=\"checkAAComplient\" (change)=\"checkAAComplient = !checkAAComplient\" [checked]=\"checkAAComplient\">\n                    <span class=\"body-xs ellipsis\">{{ 'COLOR.AA_COMPLIENT' | translate }}</span>\n                </mat-checkbox>\n                <div>\n                    <button mat-button [mat-dialog-close]=\"null\" class=\"pep-spacing-element pep-button md weak\">\n                        {{'ACTIONS.CANCEL' | translate}}\n                    </button>\n                    <button mat-button class=\"pep-spacing-element pep-button md strong\" (click)=\"onSave($event)\">\n                        {{'ACTIONS.DONE' | translate}}\n                    </button>\n                </div>\n            </div>\n        </ng-container>\n    </pep-dialog>\n</div>", styles: [".mat-slider-track-background,.mat-mdc-slider-track-background,.mat-slider-horizontal .mat-slider-track-fill,.mat-mdc-slider-horizontal .mat-mdc-slider-track-fill{display:none}.pepperi-color-picker-container ::ng-deep .mat-dialog-content,.pepperi-color-picker-container ::ng-deep .mat-mdc-dialog-content,.pep-color-picker-container ::ng-deep .mat-dialog-content,.pep-color-picker-container ::ng-deep .mat-mdc-dialog-content{padding:var(--pep-spacing-sm, .5rem) var(--pep-spacing-sm, .5rem) 0}.pepperi-color-picker-container .color-chooser-content,.pep-color-picker-container .color-chooser-content{display:grid;grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(3,1fr);grid-column-gap:var(--pep-spacing-xl, 1.5rem);grid-row-gap:var(--pep-spacing-sm, .5rem);margin-top:var(--pep-spacing-sm, .5rem)}.pepperi-color-picker-container .color-chooser-content .current-color,.pep-color-picker-container .color-chooser-content .current-color{grid-row:1/span 3;grid-column:7/span 4;border-radius:var(--pep-border-radius-md, .25rem);width:9.25rem;height:9.25rem}.pepperi-color-picker-container .color-chooser-content .slider-box,.pep-color-picker-container .color-chooser-content .slider-box{grid-column:1/span 6}.pepperi-color-picker-container .color-value-content,.pep-color-picker-container .color-value-content{display:grid;grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(1,1fr);grid-column-gap:var(--pep-spacing-xl, 1.5rem);grid-row-gap:var(--pep-spacing-sm, .5rem);margin-top:1.5rem}.pepperi-color-picker-container .color-value-content .color-value,.pep-color-picker-container .color-value-content .color-value{grid-row:1/span 1;grid-column:1/span 9}.pepperi-color-picker-container .color-value-content .color-value.with-complient,.pep-color-picker-container .color-value-content .color-value.with-complient{grid-column:1/span 6}.pepperi-color-picker-container .color-value-content .color-complient-container,.pep-color-picker-container .color-value-content .color-complient-container{grid-column:7/span 4}.pepperi-color-picker-container .color-value-content .color-complient-container .color-complient,.pep-color-picker-container .color-value-content .color-complient-container .color-complient{display:flex;justify-content:center;align-items:center;border-radius:var(--pep-border-radius-md, .25rem);height:var(--pep-form-field-height, 2.5rem);width:9.25rem}.pepperi-color-picker-container ::ng-deep .mat-dialog-actions,.pepperi-color-picker-container ::ng-deep .mat-mdc-dialog-actions,.pep-color-picker-container ::ng-deep .mat-dialog-actions,.pep-color-picker-container ::ng-deep .mat-mdc-dialog-actions{display:block}.pepperi-color-picker-container ::ng-deep .mat-dialog-actions .color-actions,.pepperi-color-picker-container ::ng-deep .mat-mdc-dialog-actions .color-actions,.pep-color-picker-container ::ng-deep .mat-dialog-actions .color-actions,.pep-color-picker-container ::ng-deep .mat-mdc-dialog-actions .color-actions{display:flex;justify-content:space-between;align-items:center}\n", ".pepperi-color-picker-container .color-value-content .color-complient-container .color-complient ::ng-deep .mat-icon .svg-icon,.pepperi-color-picker-container .color-value-content .color-complient-container .color-complient ::ng-deep .mat-mdc-icon .svg-icon,.pep-color-picker-container .color-value-content .color-complient-container .color-complient ::ng-deep .mat-icon .svg-icon,.pep-color-picker-container .color-value-content .color-complient-container .color-complient ::ng-deep .mat-mdc-icon .svg-icon{fill:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}\n"] }]
-        }], ctorParameters: function () { return [{ type: i1.PepColorService }, { type: i2.MatDialogRef }, { type: undefined, decorators: [{
+            args: [{ template: "<div class=\"pep-color-picker-container\">\n    <pep-dialog [title]=\"'COLOR.DIALOG_TITLE' | translate\" (close)=\"closeDialog($event)\">\n        <ng-container pep-dialog-content>\n            <div class=\"color-chooser-content\">\n                <div class=\"current-color\" [ngStyle]=\"{ 'background': data?.value ? data.value : 'transparent' }\"></div>\n\n                <pep-slider class=\"slider-box\" [label]=\"'COLOR.CHANGE_HUE' | translate\" [minValue]=\"currentHueMin\"\n                    [maxValue]=\"currentHueMax\" [value]=\"currentHue\" [background]=\"currentHueBackground\"\n                    (valueChange)=\"onHueChange($event)\">\n                </pep-slider>\n                <pep-slider class=\"slider-box\" [label]=\"'COLOR.CHANGE_SATURATION' | translate\"\n                    [minValue]=\"currentSaturationMin\" [maxValue]=\"currentSaturationMax\" [value]=\"currentSaturation\"\n                    [background]=\"currentSaturationBackground\" (valueChange)=\"onSaturationChange($event)\">\n                </pep-slider>\n                <pep-slider class=\"slider-box\" [label]=\"'COLOR.CHANGE_LIGHTNESS' | translate\"\n                    [minValue]=\"currentLightnessMin\" [maxValue]=\"currentLightnessMax\"\n                    [value]=\"currentLightnessMax - currentLightness + currentLightnessMin\"\n                    [background]=\"currentLightnessBackground\" (valueChange)=\"onLightnessChange($event)\">\n                </pep-slider>\n            </div>\n            <div class=\"color-value-content\">\n                <div class=\"color-value\" [ngClass]=\"{ 'with-complient': checkAAComplient }\">\n                    <pep-textbox [key]=\"'colorValue'\" [label]=\"'COLOR.ADD_VALUE_HERE' | translate \"\n                        [value]=\"data?.value\" (valueChange)=\"onColorValueChange($event)\">\n                    </pep-textbox>\n                </div>\n                <div *ngIf=\"checkAAComplient\" class=\"color-complient-container\">\n                    <pep-field-title [label]=\"'COLOR.AA_COMPLIENT' | translate \">\n                    </pep-field-title>\n                    <div class=\"color-complient\" [ngStyle]=\"{ 'background': complientColor }\">\n                        <mat-icon *ngIf=\"isUserChooseAAComplientColor\">\n                            <pep-icon name=\"system_ok\">\n                            </pep-icon>\n                        </mat-icon>\n                    </div>\n                </div>\n            </div>\n        </ng-container>\n        <ng-container pep-dialog-actions>\n            <div class=\"color-actions pep-spacing-element-negative\" [ngStyle]=\"{'justify-content': data.showAAComplient ? 'space-between' : 'flex-end'}\">\n                <mat-checkbox *ngIf=\"data.showAAComplient\" class=\"pep-spacing-element\" type=\"checkbox\"\n                    id=\"checkAAComplient\" (change)=\"checkAAComplient = !checkAAComplient\" [checked]=\"checkAAComplient\">\n                    <span class=\"body-xs ellipsis\">{{ 'COLOR.AA_COMPLIENT' | translate }}</span>\n                </mat-checkbox>\n                <div>\n                    <button mat-button [mat-dialog-close]=\"null\" class=\"pep-spacing-element pep-button md weak\">\n                        {{'ACTIONS.CANCEL' | translate}}\n                    </button>\n                    <button mat-button class=\"pep-spacing-element pep-button md strong\" (click)=\"onSave($event)\">\n                        {{'ACTIONS.DONE' | translate}}\n                    </button>\n                </div>\n            </div>\n        </ng-container>\n    </pep-dialog>\n</div>", styles: [".mat-slider-track-background,.mat-mdc-slider-track-background,.mat-slider-horizontal .mat-slider-track-fill,.mat-mdc-slider-horizontal .mat-mdc-slider-track-fill{display:none}.pepperi-color-picker-container ::ng-deep .mat-dialog-content,.pepperi-color-picker-container ::ng-deep .mat-mdc-dialog-content,.pep-color-picker-container ::ng-deep .mat-dialog-content,.pep-color-picker-container ::ng-deep .mat-mdc-dialog-content{padding:var(--pep-spacing-sm, .5rem) var(--pep-spacing-sm, .5rem) 0}.pepperi-color-picker-container .color-chooser-content,.pep-color-picker-container .color-chooser-content{display:-ms-grid;display:grid;grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(3,1fr);grid-column-gap:var(--pep-spacing-xl, 1.5rem);grid-row-gap:var(--pep-spacing-sm, .5rem);margin-top:var(--pep-spacing-sm, .5rem)}.pepperi-color-picker-container .color-chooser-content .current-color,.pep-color-picker-container .color-chooser-content .current-color{grid-row:1/span 3;grid-column:7/span 4;border-radius:var(--pep-border-radius-md, .25rem);width:9.25rem;height:9.25rem}.pepperi-color-picker-container .color-chooser-content .slider-box,.pep-color-picker-container .color-chooser-content .slider-box{grid-column:1/span 6}.pepperi-color-picker-container .color-value-content,.pep-color-picker-container .color-value-content{display:-ms-grid;display:grid;grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(1,1fr);grid-column-gap:var(--pep-spacing-xl, 1.5rem);grid-row-gap:var(--pep-spacing-sm, .5rem);margin-top:1.5rem}.pepperi-color-picker-container .color-value-content .color-value,.pep-color-picker-container .color-value-content .color-value{grid-row:1/span 1;grid-column:1/span 9}.pepperi-color-picker-container .color-value-content .color-value.with-complient,.pep-color-picker-container .color-value-content .color-value.with-complient{grid-column:1/span 6}.pepperi-color-picker-container .color-value-content .color-complient-container,.pep-color-picker-container .color-value-content .color-complient-container{grid-column:7/span 4}.pepperi-color-picker-container .color-value-content .color-complient-container .color-complient,.pep-color-picker-container .color-value-content .color-complient-container .color-complient{display:flex;justify-content:center;align-items:center;border-radius:var(--pep-border-radius-md, .25rem);height:var(--pep-form-field-height, 2.5rem);width:9.25rem}.pepperi-color-picker-container ::ng-deep .mat-dialog-actions,.pepperi-color-picker-container ::ng-deep .mat-mdc-dialog-actions,.pep-color-picker-container ::ng-deep .mat-dialog-actions,.pep-color-picker-container ::ng-deep .mat-mdc-dialog-actions{display:block}.pepperi-color-picker-container ::ng-deep .mat-dialog-actions .color-actions,.pepperi-color-picker-container ::ng-deep .mat-mdc-dialog-actions .color-actions,.pep-color-picker-container ::ng-deep .mat-dialog-actions .color-actions,.pep-color-picker-container ::ng-deep .mat-mdc-dialog-actions .color-actions{display:flex;justify-content:space-between;align-items:center}\n", ".pepperi-color-picker-container .color-value-content .color-complient-container .color-complient ::ng-deep .mat-icon .svg-icon,.pepperi-color-picker-container .color-value-content .color-complient-container .color-complient ::ng-deep .mat-mdc-icon .svg-icon,.pep-color-picker-container .color-value-content .color-complient-container .color-complient ::ng-deep .mat-icon .svg-icon,.pep-color-picker-container .color-value-content .color-complient-container .color-complient ::ng-deep .mat-mdc-icon .svg-icon{fill:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}\n"] }]
+        }], ctorParameters: () => [{ type: i1.PepColorService }, { type: i2.MatDialogRef }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [MAT_DIALOG_DATA]
-                }] }]; } });
+                }] }] });
 class PepColorComponent {
     dialogService;
@@ -290,13 +290,13 @@ class PepColorComponent {
             }
         });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PepColorComponent, deps: [{ token: i1$1.PepDialogService }, { token: i0.Renderer2 }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: PepColorComponent, selector: "pep-color", inputs: { key: "key", value: "value", label: "label", disabled: "disabled", xAlignment: "xAlignment", rowSpan: "rowSpan", type: "type", showTitle: "showTitle", renderTitle: "renderTitle", showAAComplient: "showAAComplient", checkAAComplient: "checkAAComplient", layoutType: "layoutType" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<pep-field-title *ngIf=\"renderTitle\" [label]=\"label\" [disabled]=\"disabled\" [xAlignment]=\"xAlignment\"\n    [showTitle]=\"showTitle\">\n</pep-field-title>\n<div [id]=\"key\" class=\"pep-color-container\" [ngClass]=\"{ 'right-alignment': xAlignment == 'right' }\">\n    <div pepRtlDirection (click)=\"!disabled ? chooseColor() : ''\" class=\"pep-color pep-input\"\n        [ngClass]=\"{disable: disabled, 'one-row': rowSpan === 1}\"\n        style=\"background: {{ value ? value + '!important' : 'transparent' }}; opacity: {{ disabled && value ? 0.12 : 1}};\">\n        <button *ngIf=\"!disabled\" class=\"pep-button icon-button xs weak special mat-button btn-edit\" tabindex=\"-1\"\n            pepButtonBlur mat-button>\n            <mat-icon>\n                <pep-icon name=\"system_edit\"></pep-icon>\n            </mat-icon>\n        </button>\n    </div>\n</div>", styles: [":host{display:grid}.pepperi-color-container .pepperi-color,.pepperi-color-container .pep-color,.pep-color-container .pepperi-color,.pep-color-container .pep-color{padding:0;display:grid}.pepperi-color-container .pepperi-color .btn-edit,.pepperi-color-container .pep-color .btn-edit,.pep-color-container .pepperi-color .btn-edit,.pep-color-container .pep-color .btn-edit{width:calc(var(--pep-form-field-height, 2.5rem) - var(--pep-spacing-lg, 1rem));min-width:unset;padding:0;margin:0 var(--pep-spacing-md, .75rem);justify-self:end;align-self:center}.pepperi-color-container.right-alignment .pepperi-color .btn-edit,.pepperi-color-container.right-alignment .pep-color .btn-edit,.pep-color-container.right-alignment .pepperi-color .btn-edit,.pep-color-container.right-alignment .pep-color .btn-edit{justify-self:start}\n"], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i6.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i1.PepButtonBlurDirective, selector: "[pepButtonBlur]" }, { kind: "directive", type: i1.PepRtlDirectionDirective, selector: "[pepRtlDirection]" }, { kind: "component", type: i1$2.PepIconComponent, selector: "pep-icon", inputs: ["spin", "name", "fill"] }, { kind: "component", type: i10.PepFieldTitleComponent, selector: "pep-field-title", inputs: ["label", "mandatory", "disabled", "maxFieldCharacters", "hint", "xAlignment", "showTitle", "inputLength", "fontBodyType", "multiLine"] }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: PepColorComponent, deps: [{ token: i1$1.PepDialogService }, { token: i0.Renderer2 }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: PepColorComponent, selector: "pep-color", inputs: { key: "key", value: "value", label: "label", disabled: "disabled", xAlignment: "xAlignment", rowSpan: "rowSpan", type: "type", showTitle: "showTitle", renderTitle: "renderTitle", showAAComplient: "showAAComplient", checkAAComplient: "checkAAComplient", layoutType: "layoutType" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<pep-field-title *ngIf=\"renderTitle\" [label]=\"label\" [disabled]=\"disabled\" [xAlignment]=\"xAlignment\"\n    [showTitle]=\"showTitle\">\n</pep-field-title>\n<div [id]=\"key\" class=\"pep-color-container\" [ngClass]=\"{ 'right-alignment': xAlignment == 'right' }\">\n    <div pepRtlDirection (click)=\"!disabled ? chooseColor() : ''\" class=\"pep-color pep-input\"\n        [ngClass]=\"{disable: disabled, 'one-row': rowSpan === 1}\"\n        style=\"background: {{ value ? value + '!important' : 'transparent' }}; opacity: {{ disabled && value ? 0.12 : 1}};\">\n        <button *ngIf=\"!disabled\" class=\"pep-button icon-button xs weak special mat-button btn-edit\" tabindex=\"-1\"\n            pepButtonBlur mat-button>\n            <mat-icon>\n                <pep-icon name=\"system_edit\"></pep-icon>\n            </mat-icon>\n        </button>\n    </div>\n</div>", styles: [":host{display:grid}.pepperi-color-container .pepperi-color,.pepperi-color-container .pep-color,.pep-color-container .pepperi-color,.pep-color-container .pep-color{padding:0;display:grid}.pepperi-color-container .pepperi-color .btn-edit,.pepperi-color-container .pep-color .btn-edit,.pep-color-container .pepperi-color .btn-edit,.pep-color-container .pep-color .btn-edit{width:calc(var(--pep-form-field-height, 2.5rem) - var(--pep-spacing-lg, 1rem));min-width:unset;padding:0;margin:0 var(--pep-spacing-md, .75rem);justify-self:end;align-self:center}.pepperi-color-container.right-alignment .pepperi-color .btn-edit,.pepperi-color-container.right-alignment .pep-color .btn-edit,.pep-color-container.right-alignment .pepperi-color .btn-edit,.pep-color-container.right-alignment .pep-color .btn-edit{justify-self:start}\n"], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: i6.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i1.PepButtonBlurDirective, selector: "[pepButtonBlur]" }, { kind: "directive", type: i1.PepRtlDirectionDirective, selector: "[pepRtlDirection]" }, { kind: "component", type: i1$2.PepIconComponent, selector: "pep-icon", inputs: ["spin", "name", "fill"] }, { kind: "component", type: i10.PepFieldTitleComponent, selector: "pep-field-title", inputs: ["label", "mandatory", "disabled", "maxFieldCharacters", "hint", "xAlignment", "showTitle", "inputLength", "fontBodyType", "multiLine"] }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PepColorComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: PepColorComponent, decorators: [{
             type: Component,
             args: [{ selector: 'pep-color', template: "<pep-field-title *ngIf=\"renderTitle\" [label]=\"label\" [disabled]=\"disabled\" [xAlignment]=\"xAlignment\"\n    [showTitle]=\"showTitle\">\n</pep-field-title>\n<div [id]=\"key\" class=\"pep-color-container\" [ngClass]=\"{ 'right-alignment': xAlignment == 'right' }\">\n    <div pepRtlDirection (click)=\"!disabled ? chooseColor() : ''\" class=\"pep-color pep-input\"\n        [ngClass]=\"{disable: disabled, 'one-row': rowSpan === 1}\"\n        style=\"background: {{ value ? value + '!important' : 'transparent' }}; opacity: {{ disabled && value ? 0.12 : 1}};\">\n        <button *ngIf=\"!disabled\" class=\"pep-button icon-button xs weak special mat-button btn-edit\" tabindex=\"-1\"\n            pepButtonBlur mat-button>\n            <mat-icon>\n                <pep-icon name=\"system_edit\"></pep-icon>\n            </mat-icon>\n        </button>\n    </div>\n</div>", styles: [":host{display:grid}.pepperi-color-container .pepperi-color,.pepperi-color-container .pep-color,.pep-color-container .pepperi-color,.pep-color-container .pep-color{padding:0;display:grid}.pepperi-color-container .pepperi-color .btn-edit,.pepperi-color-container .pep-color .btn-edit,.pep-color-container .pepperi-color .btn-edit,.pep-color-container .pep-color .btn-edit{width:calc(var(--pep-form-field-height, 2.5rem) - var(--pep-spacing-lg, 1rem));min-width:unset;padding:0;margin:0 var(--pep-spacing-md, .75rem);justify-self:end;align-self:center}.pepperi-color-container.right-alignment .pepperi-color .btn-edit,.pepperi-color-container.right-alignment .pep-color .btn-edit,.pep-color-container.right-alignment .pepperi-color .btn-edit,.pep-color-container.right-alignment .pep-color .btn-edit{justify-self:start}\n"] }]
-        }], ctorParameters: function () { return [{ type: i1$1.PepDialogService }, { type: i0.Renderer2 }, { type: i0.ElementRef }]; }, propDecorators: { key: [{
+        }], ctorParameters: () => [{ type: i1$1.PepDialogService }, { type: i0.Renderer2 }, { type: i0.ElementRef }], propDecorators: { key: [{
                 type: Input
             }], value: [{
                 type: Input
@@ -334,8 +334,8 @@ class PepColorModule {
             pepIconSystemClose,
         ]);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PepColorModule, deps: [{ token: i1$2.PepIconRegistry }], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.2.12", ngImport: i0, type: PepColorModule, declarations: [PepColorComponent, PepColorPickerComponent], imports: [CommonModule,
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: PepColorModule, deps: [{ token: i1$2.PepIconRegistry }], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.12", ngImport: i0, type: PepColorModule, declarations: [PepColorComponent, PepColorPickerComponent], imports: [CommonModule,
             ReactiveFormsModule,
             // Material modules
             MatCommonModule,
@@ -352,7 +352,7 @@ class PepColorModule {
             PepSliderModule,
             PepFieldTitleModule,
             PepTextboxModule], exports: [PepColorComponent] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PepColorModule, imports: [CommonModule,
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: PepColorModule, imports: [CommonModule,
             ReactiveFormsModule,
             // Material modules
             MatCommonModule,
@@ -370,7 +370,7 @@ class PepColorModule {
             PepFieldTitleModule,
             PepTextboxModule] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PepColorModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: PepColorModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [
@@ -395,7 +395,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                     exports: [PepColorComponent],
                     declarations: [PepColorComponent, PepColorPickerComponent],
                 }]
-        }], ctorParameters: function () { return [{ type: i1$2.PepIconRegistry }]; } });
+        }], ctorParameters: () => [{ type: i1$2.PepIconRegistry }] });
 /*
  * Public API Surface of ngx-lib/color

package/fesm2022/pepperi-addons-ngx-lib-color.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"pepperi-addons-ngx-lib-color.mjs","sources":["../../../projects/ngx-lib/color/color-picker.component.ts","../../../projects/ngx-lib/color/color-picker.component.html","../../../projects/ngx-lib/color/color.component.ts","../../../projects/ngx-lib/color/color.component.html","../../../projects/ngx-lib/color/color.module.ts","../../../projects/ngx-lib/color/public-api.ts","../../../projects/ngx-lib/color/pepperi-addons-ngx-lib-color.ts"],"sourcesContent":["import { Component, OnInit, Inject } from '@angular/core';\nimport { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';\n// import {\n// hex2hsl,\n// hslString2hsl,\n// rgbString2hsl,\n// IPepHslColor,\n// findClosestAccessibleColor,\n// hsl2hex,\n// convertHslToStringHsl,\n// } from './color-utils';\nimport { PepColorService, IPepHslColor } from '@pepperi-addons/ngx-lib';\n\nimport { PepColorType } from './color.model';\n\nenum PepContrastRatioType {\n AA = 4.5,\n AAA = 7,\n}\n\ninterface IPepColorPickerDialogData {\n value: string;\n type: PepColorType;\n // TODO fix typo Complient -> Compliant\n showAAComplient: boolean;\n checkAAComplient: boolean;\n textColor: string;\n contrastRatio: PepContrastRatioType;\n}\n\n@Component({\n templateUrl: './color-picker.component.html',\n styleUrls: ['./color-picker.component.scss', './color-picker.component.theme.scss'],\n})\nexport class PepColorPickerComponent implements OnInit {\n static CURRENT_HUE = '--pep-color-picker-current-hue';\n private readonly defaultColor = '#ccc';\n\n checkAAComplient = true;\n\n constructor(\n private colorService: PepColorService,\n private dialogRef: MatDialogRef<PepColorPickerComponent>,\n @Inject(MAT_DIALOG_DATA) public data: IPepColorPickerDialogData\n ) {\n this.data.type = data ? data.type : 'any';\n this.data.showAAComplient = !data\n ? false\n : data.showAAComplient ?? true;\n this.data.textColor = data && data.textColor ? data.textColor : '#fff';\n this.data.contrastRatio =\n data && data.contrastRatio\n ? data.contrastRatio\n : PepContrastRatioType.AA;\n }\n\n private defaultHueBackground = `linear-gradient(to right,\n hsl(0, 100%, 50%) 0%,\n hsl(60, 100%, 50%) 17%,\n hsl(120, 100%, 50%) 33%,\n hsl(180, 100%, 50%) 50%,\n hsl(240, 100%, 50%) 67%,\n hsl(300, 100%, 50%) 83%,\n hsl(360, 100%, 50%) 100%)`;\n\n currentHue = 100;\n currentHueMin = 0;\n currentHueMax = 360;\n currentHueBackground = this.defaultHueBackground;\n\n private defaultSaturationBackground = `linear-gradient(to right,\n hsl(var(--pep-color-picker-current-hue), 0.01%, 50%) 0%,\n hsl(var(--pep-color-picker-current-hue), 100%, 50%) 100%)`;\n\n currentSaturation = 50;\n currentSaturationMin = 0;\n currentSaturationMax = 100;\n currentSaturationBackground = this.defaultSaturationBackground;\n\n private defaultLightnessBackground = `linear-gradient(to right,\n hsl(var(--pep-color-picker-current-hue), 100%, 100%) 0%,\n hsl(var(--pep-color-picker-current-hue), 100%, 50%) 50%,\n hsl(var(--pep-color-picker-current-hue), 100%, 0.01%) 100%)`;\n\n currentLightness = 50;\n currentLightnessMin = 0;\n currentLightnessMax = 100;\n currentLightnessBackground = this.defaultLightnessBackground;\n\n complientColor: string;\n isUserChooseAAComplientColor: boolean;\n\n ngOnInit(): void {\n this.initVars();\n this.checkAAComplient = this.data.checkAAComplient;\n this.convertValueStringToColor(this.data.value);\n }\n\n initVars(): void {\n if (this.data.type === 'main') {\n this.currentLightnessMax = 10;\n this.currentLightness = 5;\n this.currentHueBackground = this.defaultHueBackground;\n this.currentSaturationBackground = this.defaultSaturationBackground;\n this.currentLightnessBackground = this.defaultLightnessBackground;\n } else if (this.data.type === 'success') {\n this.currentHueMin = 70;\n this.currentHueMax = 150;\n this.currentHue = 100;\n\n this.currentSaturationMin = 50;\n this.currentSaturationMax = 100;\n this.currentSaturation = 50;\n\n this.currentLightnessMin = 10;\n this.currentLightnessMax = 65;\n this.currentLightness = 50;\n\n this.currentHueBackground = `linear-gradient(to right,\n hsl(70, 100%, 50%) 0%,\n hsl(150, 100%, 50%) 100%)`;\n this.currentSaturationBackground = `linear-gradient(to right,\n hsl(var(--pep-color-picker-current-hue), 50%, 50%) 50%,\n hsl(var(--pep-color-picker-current-hue), 100%, 50%) 100%)`;\n this.currentLightnessBackground = `linear-gradient(to right,\n hsl(var(--pep-color-picker-current-hue), 100%, 65%) 10%,\n hsl(var(--pep-color-picker-current-hue), 100%, 35%) 35%,\n hsl(var(--pep-color-picker-current-hue), 100%, 10%) 65%)`;\n\n } else if (this.data.type === 'caution') {\n this.currentHueMin = -20;\n this.currentHueMax = 20;\n this.currentHue = 10;\n\n this.currentSaturationMin = 75;\n this.currentSaturationMax = 100;\n this.currentSaturation = 75;\n\n this.currentLightnessMin = 25;\n this.currentLightnessMax = 75;\n this.currentLightness = 50;\n\n this.currentHueBackground = `linear-gradient(to right,\n hsl(340, 100%, 50%) 0%,\n hsl(20, 100%, 50%) 100%)`;\n this.currentSaturationBackground = `linear-gradient(to right,\n hsl(var(--pep-color-picker-current-hue), 75%, 50%) 75%,\n hsl(var(--pep-color-picker-current-hue), 100%, 50%) 100%)`;\n this.currentLightnessBackground = `linear-gradient(to right,\n hsl(var(--pep-color-picker-current-hue), 100%, 75%) 25%,\n hsl(var(--pep-color-picker-current-hue), 100%, 50%) 50%,\n hsl(var(--pep-color-picker-current-hue), 100%, 25%) 75%)`;\n }\n }\n\n setCurrentHueInCss(): void {\n document.documentElement.style.setProperty(\n PepColorPickerComponent.CURRENT_HUE,\n this.currentHue.toString()\n );\n }\n\n convertValueStringToColor(color): void {\n if (color.indexOf('hsl') === 0) {\n const hsl = this.colorService.hslString2hsl(color);\n this.convertColorToValueString(hsl);\n } else if (color.indexOf('rgb') === 0) {\n const hsl = this.colorService.rgbString2hsl(color);\n this.convertColorToValueString(hsl);\n } else if (color.indexOf('#') === 0) {\n const hsl = this.colorService.hex2hsl(color);\n this.convertColorToValueString(hsl);\n } else {\n // Handle default.\n const hsl = this.colorService.hex2hsl(this.defaultColor);\n this.convertColorToValueString(hsl);\n }\n\n this.setCurrentHueInCss();\n }\n\n convertColorToValueString(hslColor: IPepHslColor): void {\n // Regular hue\n if (\n hslColor.h >= this.currentHueMin &&\n hslColor.h <= this.currentHueMax\n ) {\n this.currentHue = hslColor.h;\n } else if (\n this.currentHueMin < 0 &&\n hslColor.h >= 0 &&\n hslColor.h <= 360\n ) {\n // For min with - (change to the other side of the circle)\n hslColor.h = hslColor.h - 360;\n\n if (\n hslColor.h >= this.currentHueMin &&\n hslColor.h <= this.currentHueMax\n ) {\n this.currentHue = hslColor.h;\n }\n }\n\n this.currentSaturation =\n hslColor.s >= this.currentSaturationMin &&\n hslColor.s <= this.currentSaturationMax\n ? hslColor.s\n : this.currentSaturation;\n\n this.currentLightness =\n hslColor.l >= this.currentLightnessMin &&\n hslColor.l <= this.currentLightnessMax\n ? hslColor.l\n : this.currentLightness;\n\n // Write the value (if hue is changed to the other side of the circle return it back).\n const hsl = {\n h: this.currentHue,\n s: this.currentSaturation,\n l: this.currentLightness,\n };\n this.data.value = this.colorService.convertHslToStringHsl(hsl);\n\n // Check the contrast ratio - set the closest accessible color to complientColor\n // and update isUserChooseAAComplientColor.\n const adjustableColor = this.colorService.hsl2hex(hsl);\n const closestHex = this.colorService.findClosestAccessibleColor(\n adjustableColor,\n this.data.textColor,\n this.data.contrastRatio\n );\n\n this.isUserChooseAAComplientColor = adjustableColor === closestHex;\n this.complientColor = this.colorService.convertHslToStringHsl(\n this.colorService.hex2hsl(closestHex)\n );\n }\n\n onHueChange(value): void {\n this.convertColorToValueString({ h: value });\n this.setCurrentHueInCss();\n }\n\n onSaturationChange(value): void {\n // this.currentSaturation = event.value;\n this.convertColorToValueString({ s: value });\n }\n\n onLightnessChange(value): void {\n // this.currentLightness = event.value;\n this.convertColorToValueString({\n l:\n this.currentLightnessMax -\n value +\n this.currentLightnessMin,\n });\n }\n\n onColorValueChange(color): void {\n this.convertValueStringToColor(color);\n }\n\n onSave(event): void {\n const color = this.checkAAComplient\n ? this.complientColor\n : this.data.value;\n\n // this.notify.emit({ key: this.key, value: color });\n this.dialogRef.close(color);\n }\n\n closeDialog(event) {\n this.dialogRef.close(event);\n }\n}\n","<div class=\"pep-color-picker-container\">\n <pep-dialog [title]=\"'COLOR.DIALOG_TITLE' \| translate\" (close)=\"closeDialog($event)\">\n <ng-container pep-dialog-content>\n <div class=\"color-chooser-content\">\n <div class=\"current-color\" [ngStyle]=\"{ 'background': data?.value ? data.value : 'transparent' }\"></div>\n\n <pep-slider class=\"slider-box\" [label]=\"'COLOR.CHANGE_HUE' \| translate\" [minValue]=\"currentHueMin\"\n [maxValue]=\"currentHueMax\" [value]=\"currentHue\" [background]=\"currentHueBackground\"\n (valueChange)=\"onHueChange($event)\">\n </pep-slider>\n <pep-slider class=\"slider-box\" [label]=\"'COLOR.CHANGE_SATURATION' \| translate\"\n [minValue]=\"currentSaturationMin\" [maxValue]=\"currentSaturationMax\" [value]=\"currentSaturation\"\n [background]=\"currentSaturationBackground\" (valueChange)=\"onSaturationChange($event)\">\n </pep-slider>\n <pep-slider class=\"slider-box\" [label]=\"'COLOR.CHANGE_LIGHTNESS' \| translate\"\n [minValue]=\"currentLightnessMin\" [maxValue]=\"currentLightnessMax\"\n [value]=\"currentLightnessMax - currentLightness + currentLightnessMin\"\n [background]=\"currentLightnessBackground\" (valueChange)=\"onLightnessChange($event)\">\n </pep-slider>\n </div>\n <div class=\"color-value-content\">\n <div class=\"color-value\" [ngClass]=\"{ 'with-complient': checkAAComplient }\">\n <pep-textbox [key]=\"'colorValue'\" [label]=\"'COLOR.ADD_VALUE_HERE' \| translate \"\n [value]=\"data?.value\" (valueChange)=\"onColorValueChange($event)\">\n </pep-textbox>\n </div>\n <div ngIf=\"checkAAComplient\" class=\"color-complient-container\">\n <pep-field-title [label]=\"'COLOR.AA_COMPLIENT' \| translate \">\n </pep-field-title>\n <div class=\"color-complient\" [ngStyle]=\"{ 'background': complientColor }\">\n <mat-icon ngIf=\"isUserChooseAAComplientColor\">\n <pep-icon name=\"system_ok\">\n </pep-icon>\n </mat-icon>\n </div>\n </div>\n </div>\n </ng-container>\n <ng-container pep-dialog-actions>\n <div class=\"color-actions pep-spacing-element-negative\" [ngStyle]=\"{'justify-content': data.showAAComplient ? 'space-between' : 'flex-end'}\">\n <mat-checkbox ngIf=\"data.showAAComplient\" class=\"pep-spacing-element\" type=\"checkbox\"\n id=\"checkAAComplient\" (change)=\"checkAAComplient = !checkAAComplient\" [checked]=\"checkAAComplient\">\n <span class=\"body-xs ellipsis\">{{ 'COLOR.AA_COMPLIENT' \| translate }}</span>\n </mat-checkbox>\n <div>\n <button mat-button [mat-dialog-close]=\"null\" class=\"pep-spacing-element pep-button md weak\">\n {{'ACTIONS.CANCEL' \| translate}}\n </button>\n <button mat-button class=\"pep-spacing-element pep-button md strong\" (click)=\"onSave($event)\">\n {{'ACTIONS.DONE' \| translate}}\n </button>\n </div>\n </div>\n </ng-container>\n </pep-dialog>\n</div>","import {\n Component,\n OnInit,\n Input,\n Output,\n Renderer2,\n ElementRef,\n EventEmitter,\n OnChanges,\n OnDestroy,\n} from '@angular/core';\nimport {\n PepCustomizationService,\n PepLayoutType,\n PepHorizontalAlignment,\n DEFAULT_HORIZONTAL_ALIGNMENT,\n} from '@pepperi-addons/ngx-lib';\nimport { PepDialogService } from '@pepperi-addons/ngx-lib/dialog';\nimport { PepColorPickerComponent } from './color-picker.component';\nimport { PepColorType } from './color.model';\n\n@Component({\n selector: 'pep-color',\n templateUrl: './color.component.html',\n styleUrls: ['./color.component.scss'],\n})\nexport class PepColorComponent implements OnInit, OnDestroy {\n @Input() key = '';\n @Input() value = '';\n @Input() label = '';\n @Input() disabled = false;\n @Input() xAlignment: PepHorizontalAlignment = DEFAULT_HORIZONTAL_ALIGNMENT;\n @Input() rowSpan = 1;\n @Input() type: PepColorType = 'any';\n\n @Input() showTitle = true;\n @Input() renderTitle = true;\n\n @Input() showAAComplient = true;\n @Input() checkAAComplient = true;\n @Input() layoutType: PepLayoutType = 'form';\n\n @Output()\n valueChange: EventEmitter<string> = new EventEmitter<string>();\n\n constructor(\n private dialogService: PepDialogService,\n private renderer: Renderer2,\n private element: ElementRef\n ) { }\n\n ngOnInit(): void {\n this.renderer.addClass(\n this.element.nativeElement,\n PepCustomizationService.STAND_ALONE_FIELD_CLASS_NAME\n );\n\n if (!this.renderTitle) {\n this.renderer.addClass(\n this.element.nativeElement,\n PepCustomizationService.STAND_ALONE_FIELD_NO_SPACING_CLASS_NAME\n );\n }\n }\n\n ngOnDestroy(): void {\n //\n }\n\n changeColor(value: any): void {\n this.value = value;\n this.valueChange.emit(value);\n }\n\n chooseColor(): void {\n const dialogRef = this.dialogService.openDialog(\n PepColorPickerComponent,\n {\n value: this.value,\n type: this.type,\n showAAComplient: this.showAAComplient,\n checkAAComplient: this.checkAAComplient\n }\n );\n\n dialogRef.afterClosed().subscribe((value) => {\n if (value !== undefined && value !== null) {\n this.changeColor(value);\n }\n });\n }\n}\n","<pep-field-title ngIf=\"renderTitle\" [label]=\"label\" [disabled]=\"disabled\" [xAlignment]=\"xAlignment\"\n [showTitle]=\"showTitle\">\n</pep-field-title>\n<div [id]=\"key\" class=\"pep-color-container\" [ngClass]=\"{ 'right-alignment': xAlignment == 'right' }\">\n <div pepRtlDirection (click)=\"!disabled ? chooseColor() : ''\" class=\"pep-color pep-input\"\n [ngClass]=\"{disable: disabled, 'one-row': rowSpan === 1}\"\n style=\"background: {{ value ? value + '!important' : 'transparent' }}; opacity: {{ disabled && value ? 0.12 : 1}};\">\n <button ngIf=\"!disabled\" class=\"pep-button icon-button xs weak special mat-button btn-edit\" tabindex=\"-1\"\n pepButtonBlur mat-button>\n <mat-icon>\n <pep-icon name=\"system_edit\"></pep-icon>\n </mat-icon>\n </button>\n </div>\n</div>","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { ReactiveFormsModule } from '@angular/forms';\n\nimport { MatCommonModule } from '@angular/material/core';\nimport { MatButtonModule } from '@angular/material/button';\nimport { MatFormFieldModule } from '@angular/material/form-field';\nimport { MatCheckboxModule } from '@angular/material/checkbox';\nimport { MatDialogModule } from '@angular/material/dialog';\nimport { MatIconModule } from '@angular/material/icon';\nimport { MatSliderModule } from '@angular/material/slider';\n\nimport { PepNgxLibModule } from '@pepperi-addons/ngx-lib';\nimport { PepDialogModule } from '@pepperi-addons/ngx-lib/dialog';\nimport { PepSliderModule } from '@pepperi-addons/ngx-lib/slider';\n\nimport {\n PepIconModule,\n PepIconRegistry,\n pepIconSystemEdit,\n pepIconSystemOk,\n pepIconSystemClose,\n} from '@pepperi-addons/ngx-lib/icon';\nimport { PepFieldTitleModule } from '@pepperi-addons/ngx-lib/field-title';\nimport { PepTextboxModule } from '@pepperi-addons/ngx-lib/textbox';\n\nimport { PepColorComponent } from './color.component';\nimport { PepColorPickerComponent } from './color-picker.component';\n\n@NgModule({\n imports: [\n CommonModule,\n ReactiveFormsModule,\n // Material modules\n MatCommonModule,\n MatButtonModule,\n MatFormFieldModule,\n MatCheckboxModule,\n MatDialogModule,\n MatIconModule,\n MatSliderModule,\n // ngx-lib modules\n PepNgxLibModule,\n PepDialogModule,\n PepIconModule,\n PepSliderModule,\n PepFieldTitleModule,\n PepTextboxModule,\n ],\n exports: [PepColorComponent],\n declarations: [PepColorComponent, PepColorPickerComponent],\n})\nexport class PepColorModule {\n constructor(private pepIconRegistry: PepIconRegistry) {\n this.pepIconRegistry.registerIcons([\n pepIconSystemEdit,\n pepIconSystemOk,\n pepIconSystemClose,\n ]);\n }\n}\n","/\n * Public API Surface of ngx-lib/color\n /\nexport from './color.module';\nexport * from './color.model';\nexport * from './color.component';\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":["i7","i8","i1","i2","i3","i4","i5","i6"],"mappings":"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"}
1	+ {"version":3,"file":"pepperi-addons-ngx-lib-color.mjs","sources":["../../../projects/ngx-lib/color/color-picker.component.ts","../../../projects/ngx-lib/color/color-picker.component.html","../../../projects/ngx-lib/color/color.component.ts","../../../projects/ngx-lib/color/color.component.html","../../../projects/ngx-lib/color/color.module.ts","../../../projects/ngx-lib/color/public-api.ts","../../../projects/ngx-lib/color/pepperi-addons-ngx-lib-color.ts"],"sourcesContent":["import { Component, OnInit, Inject } from '@angular/core';\nimport { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';\n// import {\n// hex2hsl,\n// hslString2hsl,\n// rgbString2hsl,\n// IPepHslColor,\n// findClosestAccessibleColor,\n// hsl2hex,\n// convertHslToStringHsl,\n// } from './color-utils';\nimport { PepColorService, IPepHslColor } from '@pepperi-addons/ngx-lib';\n\nimport { PepColorType } from './color.model';\n\nenum PepContrastRatioType {\n AA = 4.5,\n AAA = 7,\n}\n\ninterface IPepColorPickerDialogData {\n value: string;\n type: PepColorType;\n // TODO fix typo Complient -> Compliant\n showAAComplient: boolean;\n checkAAComplient: boolean;\n textColor: string;\n contrastRatio: PepContrastRatioType;\n}\n\n@Component({\n templateUrl: './color-picker.component.html',\n styleUrls: ['./color-picker.component.scss', './color-picker.component.theme.scss'],\n})\nexport class PepColorPickerComponent implements OnInit {\n static CURRENT_HUE = '--pep-color-picker-current-hue';\n private readonly defaultColor = '#ccc';\n\n checkAAComplient = true;\n\n constructor(\n private colorService: PepColorService,\n private dialogRef: MatDialogRef<PepColorPickerComponent>,\n @Inject(MAT_DIALOG_DATA) public data: IPepColorPickerDialogData\n ) {\n this.data.type = data ? data.type : 'any';\n this.data.showAAComplient = !data\n ? false\n : data.showAAComplient ?? true;\n this.data.textColor = data && data.textColor ? data.textColor : '#fff';\n this.data.contrastRatio =\n data && data.contrastRatio\n ? data.contrastRatio\n : PepContrastRatioType.AA;\n }\n\n private defaultHueBackground = `linear-gradient(to right,\n hsl(0, 100%, 50%) 0%,\n hsl(60, 100%, 50%) 17%,\n hsl(120, 100%, 50%) 33%,\n hsl(180, 100%, 50%) 50%,\n hsl(240, 100%, 50%) 67%,\n hsl(300, 100%, 50%) 83%,\n hsl(360, 100%, 50%) 100%)`;\n\n currentHue = 100;\n currentHueMin = 0;\n currentHueMax = 360;\n currentHueBackground = this.defaultHueBackground;\n\n private defaultSaturationBackground = `linear-gradient(to right,\n hsl(var(--pep-color-picker-current-hue), 0.01%, 50%) 0%,\n hsl(var(--pep-color-picker-current-hue), 100%, 50%) 100%)`;\n\n currentSaturation = 50;\n currentSaturationMin = 0;\n currentSaturationMax = 100;\n currentSaturationBackground = this.defaultSaturationBackground;\n\n private defaultLightnessBackground = `linear-gradient(to right,\n hsl(var(--pep-color-picker-current-hue), 100%, 100%) 0%,\n hsl(var(--pep-color-picker-current-hue), 100%, 50%) 50%,\n hsl(var(--pep-color-picker-current-hue), 100%, 0.01%) 100%)`;\n\n currentLightness = 50;\n currentLightnessMin = 0;\n currentLightnessMax = 100;\n currentLightnessBackground = this.defaultLightnessBackground;\n\n complientColor: string;\n isUserChooseAAComplientColor: boolean;\n\n ngOnInit(): void {\n this.initVars();\n this.checkAAComplient = this.data.checkAAComplient;\n this.convertValueStringToColor(this.data.value);\n }\n\n initVars(): void {\n if (this.data.type === 'main') {\n this.currentLightnessMax = 10;\n this.currentLightness = 5;\n this.currentHueBackground = this.defaultHueBackground;\n this.currentSaturationBackground = this.defaultSaturationBackground;\n this.currentLightnessBackground = this.defaultLightnessBackground;\n } else if (this.data.type === 'success') {\n this.currentHueMin = 70;\n this.currentHueMax = 150;\n this.currentHue = 100;\n\n this.currentSaturationMin = 50;\n this.currentSaturationMax = 100;\n this.currentSaturation = 50;\n\n this.currentLightnessMin = 10;\n this.currentLightnessMax = 65;\n this.currentLightness = 50;\n\n this.currentHueBackground = `linear-gradient(to right,\n hsl(70, 100%, 50%) 0%,\n hsl(150, 100%, 50%) 100%)`;\n this.currentSaturationBackground = `linear-gradient(to right,\n hsl(var(--pep-color-picker-current-hue), 50%, 50%) 50%,\n hsl(var(--pep-color-picker-current-hue), 100%, 50%) 100%)`;\n this.currentLightnessBackground = `linear-gradient(to right,\n hsl(var(--pep-color-picker-current-hue), 100%, 65%) 10%,\n hsl(var(--pep-color-picker-current-hue), 100%, 35%) 35%,\n hsl(var(--pep-color-picker-current-hue), 100%, 10%) 65%)`;\n\n } else if (this.data.type === 'caution') {\n this.currentHueMin = -20;\n this.currentHueMax = 20;\n this.currentHue = 10;\n\n this.currentSaturationMin = 75;\n this.currentSaturationMax = 100;\n this.currentSaturation = 75;\n\n this.currentLightnessMin = 25;\n this.currentLightnessMax = 75;\n this.currentLightness = 50;\n\n this.currentHueBackground = `linear-gradient(to right,\n hsl(340, 100%, 50%) 0%,\n hsl(20, 100%, 50%) 100%)`;\n this.currentSaturationBackground = `linear-gradient(to right,\n hsl(var(--pep-color-picker-current-hue), 75%, 50%) 75%,\n hsl(var(--pep-color-picker-current-hue), 100%, 50%) 100%)`;\n this.currentLightnessBackground = `linear-gradient(to right,\n hsl(var(--pep-color-picker-current-hue), 100%, 75%) 25%,\n hsl(var(--pep-color-picker-current-hue), 100%, 50%) 50%,\n hsl(var(--pep-color-picker-current-hue), 100%, 25%) 75%)`;\n }\n }\n\n setCurrentHueInCss(): void {\n document.documentElement.style.setProperty(\n PepColorPickerComponent.CURRENT_HUE,\n this.currentHue.toString()\n );\n }\n\n convertValueStringToColor(color): void {\n if (color.indexOf('hsl') === 0) {\n const hsl = this.colorService.hslString2hsl(color);\n this.convertColorToValueString(hsl);\n } else if (color.indexOf('rgb') === 0) {\n const hsl = this.colorService.rgbString2hsl(color);\n this.convertColorToValueString(hsl);\n } else if (color.indexOf('#') === 0) {\n const hsl = this.colorService.hex2hsl(color);\n this.convertColorToValueString(hsl);\n } else {\n // Handle default.\n const hsl = this.colorService.hex2hsl(this.defaultColor);\n this.convertColorToValueString(hsl);\n }\n\n this.setCurrentHueInCss();\n }\n\n convertColorToValueString(hslColor: IPepHslColor): void {\n // Regular hue\n if (\n hslColor.h >= this.currentHueMin &&\n hslColor.h <= this.currentHueMax\n ) {\n this.currentHue = hslColor.h;\n } else if (\n this.currentHueMin < 0 &&\n hslColor.h >= 0 &&\n hslColor.h <= 360\n ) {\n // For min with - (change to the other side of the circle)\n hslColor.h = hslColor.h - 360;\n\n if (\n hslColor.h >= this.currentHueMin &&\n hslColor.h <= this.currentHueMax\n ) {\n this.currentHue = hslColor.h;\n }\n }\n\n this.currentSaturation =\n hslColor.s >= this.currentSaturationMin &&\n hslColor.s <= this.currentSaturationMax\n ? hslColor.s\n : this.currentSaturation;\n\n this.currentLightness =\n hslColor.l >= this.currentLightnessMin &&\n hslColor.l <= this.currentLightnessMax\n ? hslColor.l\n : this.currentLightness;\n\n // Write the value (if hue is changed to the other side of the circle return it back).\n const hsl = {\n h: this.currentHue,\n s: this.currentSaturation,\n l: this.currentLightness,\n };\n this.data.value = this.colorService.convertHslToStringHsl(hsl);\n\n // Check the contrast ratio - set the closest accessible color to complientColor\n // and update isUserChooseAAComplientColor.\n const adjustableColor = this.colorService.hsl2hex(hsl);\n const closestHex = this.colorService.findClosestAccessibleColor(\n adjustableColor,\n this.data.textColor,\n this.data.contrastRatio\n );\n\n this.isUserChooseAAComplientColor = adjustableColor === closestHex;\n this.complientColor = this.colorService.convertHslToStringHsl(\n this.colorService.hex2hsl(closestHex)\n );\n }\n\n onHueChange(value): void {\n this.convertColorToValueString({ h: value });\n this.setCurrentHueInCss();\n }\n\n onSaturationChange(value): void {\n // this.currentSaturation = event.value;\n this.convertColorToValueString({ s: value });\n }\n\n onLightnessChange(value): void {\n // this.currentLightness = event.value;\n this.convertColorToValueString({\n l:\n this.currentLightnessMax -\n value +\n this.currentLightnessMin,\n });\n }\n\n onColorValueChange(color): void {\n this.convertValueStringToColor(color);\n }\n\n onSave(event): void {\n const color = this.checkAAComplient\n ? this.complientColor\n : this.data.value;\n\n // this.notify.emit({ key: this.key, value: color });\n this.dialogRef.close(color);\n }\n\n closeDialog(event) {\n this.dialogRef.close(event);\n }\n}\n","<div class=\"pep-color-picker-container\">\n <pep-dialog [title]=\"'COLOR.DIALOG_TITLE' \| translate\" (close)=\"closeDialog($event)\">\n <ng-container pep-dialog-content>\n <div class=\"color-chooser-content\">\n <div class=\"current-color\" [ngStyle]=\"{ 'background': data?.value ? data.value : 'transparent' }\"></div>\n\n <pep-slider class=\"slider-box\" [label]=\"'COLOR.CHANGE_HUE' \| translate\" [minValue]=\"currentHueMin\"\n [maxValue]=\"currentHueMax\" [value]=\"currentHue\" [background]=\"currentHueBackground\"\n (valueChange)=\"onHueChange($event)\">\n </pep-slider>\n <pep-slider class=\"slider-box\" [label]=\"'COLOR.CHANGE_SATURATION' \| translate\"\n [minValue]=\"currentSaturationMin\" [maxValue]=\"currentSaturationMax\" [value]=\"currentSaturation\"\n [background]=\"currentSaturationBackground\" (valueChange)=\"onSaturationChange($event)\">\n </pep-slider>\n <pep-slider class=\"slider-box\" [label]=\"'COLOR.CHANGE_LIGHTNESS' \| translate\"\n [minValue]=\"currentLightnessMin\" [maxValue]=\"currentLightnessMax\"\n [value]=\"currentLightnessMax - currentLightness + currentLightnessMin\"\n [background]=\"currentLightnessBackground\" (valueChange)=\"onLightnessChange($event)\">\n </pep-slider>\n </div>\n <div class=\"color-value-content\">\n <div class=\"color-value\" [ngClass]=\"{ 'with-complient': checkAAComplient }\">\n <pep-textbox [key]=\"'colorValue'\" [label]=\"'COLOR.ADD_VALUE_HERE' \| translate \"\n [value]=\"data?.value\" (valueChange)=\"onColorValueChange($event)\">\n </pep-textbox>\n </div>\n <div ngIf=\"checkAAComplient\" class=\"color-complient-container\">\n <pep-field-title [label]=\"'COLOR.AA_COMPLIENT' \| translate \">\n </pep-field-title>\n <div class=\"color-complient\" [ngStyle]=\"{ 'background': complientColor }\">\n <mat-icon ngIf=\"isUserChooseAAComplientColor\">\n <pep-icon name=\"system_ok\">\n </pep-icon>\n </mat-icon>\n </div>\n </div>\n </div>\n </ng-container>\n <ng-container pep-dialog-actions>\n <div class=\"color-actions pep-spacing-element-negative\" [ngStyle]=\"{'justify-content': data.showAAComplient ? 'space-between' : 'flex-end'}\">\n <mat-checkbox ngIf=\"data.showAAComplient\" class=\"pep-spacing-element\" type=\"checkbox\"\n id=\"checkAAComplient\" (change)=\"checkAAComplient = !checkAAComplient\" [checked]=\"checkAAComplient\">\n <span class=\"body-xs ellipsis\">{{ 'COLOR.AA_COMPLIENT' \| translate }}</span>\n </mat-checkbox>\n <div>\n <button mat-button [mat-dialog-close]=\"null\" class=\"pep-spacing-element pep-button md weak\">\n {{'ACTIONS.CANCEL' \| translate}}\n </button>\n <button mat-button class=\"pep-spacing-element pep-button md strong\" (click)=\"onSave($event)\">\n {{'ACTIONS.DONE' \| translate}}\n </button>\n </div>\n </div>\n </ng-container>\n </pep-dialog>\n</div>","import {\n Component,\n OnInit,\n Input,\n Output,\n Renderer2,\n ElementRef,\n EventEmitter,\n OnChanges,\n OnDestroy,\n} from '@angular/core';\nimport {\n PepCustomizationService,\n PepLayoutType,\n PepHorizontalAlignment,\n DEFAULT_HORIZONTAL_ALIGNMENT,\n} from '@pepperi-addons/ngx-lib';\nimport { PepDialogService } from '@pepperi-addons/ngx-lib/dialog';\nimport { PepColorPickerComponent } from './color-picker.component';\nimport { PepColorType } from './color.model';\n\n@Component({selector: 'pep-color',\n templateUrl: './color.component.html',\n styleUrls: ['./color.component.scss']})\nexport class PepColorComponent implements OnInit, OnDestroy {\n @Input() key = '';\n @Input() value = '';\n @Input() label = '';\n @Input() disabled = false;\n @Input() xAlignment: PepHorizontalAlignment = DEFAULT_HORIZONTAL_ALIGNMENT;\n @Input() rowSpan = 1;\n @Input() type: PepColorType = 'any';\n\n @Input() showTitle = true;\n @Input() renderTitle = true;\n\n @Input() showAAComplient = true;\n @Input() checkAAComplient = true;\n @Input() layoutType: PepLayoutType = 'form';\n\n @Output()\n valueChange: EventEmitter<string> = new EventEmitter<string>();\n\n constructor(\n private dialogService: PepDialogService,\n private renderer: Renderer2,\n private element: ElementRef\n ) { }\n\n ngOnInit(): void {\n this.renderer.addClass(\n this.element.nativeElement,\n PepCustomizationService.STAND_ALONE_FIELD_CLASS_NAME\n );\n\n if (!this.renderTitle) {\n this.renderer.addClass(\n this.element.nativeElement,\n PepCustomizationService.STAND_ALONE_FIELD_NO_SPACING_CLASS_NAME\n );\n }\n }\n\n ngOnDestroy(): void {\n //\n }\n\n changeColor(value: any): void {\n this.value = value;\n this.valueChange.emit(value);\n }\n\n chooseColor(): void {\n const dialogRef = this.dialogService.openDialog(\n PepColorPickerComponent,\n {\n value: this.value,\n type: this.type,\n showAAComplient: this.showAAComplient,\n checkAAComplient: this.checkAAComplient\n }\n );\n\n dialogRef.afterClosed().subscribe((value) => {\n if (value !== undefined && value !== null) {\n this.changeColor(value);\n }\n });\n }\n}\n","<pep-field-title ngIf=\"renderTitle\" [label]=\"label\" [disabled]=\"disabled\" [xAlignment]=\"xAlignment\"\n [showTitle]=\"showTitle\">\n</pep-field-title>\n<div [id]=\"key\" class=\"pep-color-container\" [ngClass]=\"{ 'right-alignment': xAlignment == 'right' }\">\n <div pepRtlDirection (click)=\"!disabled ? chooseColor() : ''\" class=\"pep-color pep-input\"\n [ngClass]=\"{disable: disabled, 'one-row': rowSpan === 1}\"\n style=\"background: {{ value ? value + '!important' : 'transparent' }}; opacity: {{ disabled && value ? 0.12 : 1}};\">\n <button ngIf=\"!disabled\" class=\"pep-button icon-button xs weak special mat-button btn-edit\" tabindex=\"-1\"\n pepButtonBlur mat-button>\n <mat-icon>\n <pep-icon name=\"system_edit\"></pep-icon>\n </mat-icon>\n </button>\n </div>\n</div>","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { ReactiveFormsModule } from '@angular/forms';\n\nimport { MatCommonModule } from '@angular/material/core';\nimport { MatButtonModule } from '@angular/material/button';\nimport { MatFormFieldModule } from '@angular/material/form-field';\nimport { MatCheckboxModule } from '@angular/material/checkbox';\nimport { MatDialogModule } from '@angular/material/dialog';\nimport { MatIconModule } from '@angular/material/icon';\nimport { MatSliderModule } from '@angular/material/slider';\n\nimport { PepNgxLibModule } from '@pepperi-addons/ngx-lib';\nimport { PepDialogModule } from '@pepperi-addons/ngx-lib/dialog';\nimport { PepSliderModule } from '@pepperi-addons/ngx-lib/slider';\n\nimport {\n PepIconModule,\n PepIconRegistry,\n pepIconSystemEdit,\n pepIconSystemOk,\n pepIconSystemClose,\n} from '@pepperi-addons/ngx-lib/icon';\nimport { PepFieldTitleModule } from '@pepperi-addons/ngx-lib/field-title';\nimport { PepTextboxModule } from '@pepperi-addons/ngx-lib/textbox';\n\nimport { PepColorComponent } from './color.component';\nimport { PepColorPickerComponent } from './color-picker.component';\n\n@NgModule({\n imports: [\n CommonModule,\n ReactiveFormsModule,\n // Material modules\n MatCommonModule,\n MatButtonModule,\n MatFormFieldModule,\n MatCheckboxModule,\n MatDialogModule,\n MatIconModule,\n MatSliderModule,\n // ngx-lib modules\n PepNgxLibModule,\n PepDialogModule,\n PepIconModule,\n PepSliderModule,\n PepFieldTitleModule,\n PepTextboxModule,\n ],\n exports: [PepColorComponent],\n declarations: [PepColorComponent, PepColorPickerComponent],\n})\nexport class PepColorModule {\n constructor(private pepIconRegistry: PepIconRegistry) {\n this.pepIconRegistry.registerIcons([\n pepIconSystemEdit,\n pepIconSystemOk,\n pepIconSystemClose,\n ]);\n }\n}\n","/\n * Public API Surface of ngx-lib/color\n /\nexport from './color.module';\nexport * from './color.model';\nexport * from './color.component';\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":["i7","i8","i1","i2","i3","i4","i5","i6"],"mappings":"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"}