@pepperi-addons/ngx-composite-lib 0.0.16-beta.34 → 0.0.16-beta.35

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.
@@ -96,6 +96,9 @@
96
96
  this.color.value = value;
97
97
  this.raiseColorChange();
98
98
  };
99
+ ColorSettingsComponent.prototype.onSliderInputChanged = function (value) {
100
+ this.color.opacity = value;
101
+ };
99
102
  ColorSettingsComponent.prototype.onSliderValueChanged = function (value) {
100
103
  this.color.opacity = value;
101
104
  this.raiseColorChange();
@@ -103,7 +106,7 @@
103
106
  return ColorSettingsComponent;
104
107
  }());
105
108
  ColorSettingsComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0__namespace, type: ColorSettingsComponent, deps: [{ token: i1__namespace.PepColorService }], target: i0__namespace.ɵɵFactoryTarget.Component });
106
- ColorSettingsComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.0.5", type: ColorSettingsComponent, selector: "pep-color-settings", inputs: { title: "title", color: "color" }, outputs: { colorChange: "colorChange" }, ngImport: i0__namespace, template: "<pep-checkbox class=\"checkbox-as-title\" [label]=\"title\" [renderTitle]=\"false\" [value]=\"color.use\" (valueChange)=\"onUseChanged($event)\"></pep-checkbox>\n<pep-color [value]=\"color.value\" [label]=\"title + ' ' + ('COLOR_SETTINGS.COLOR' | translate)\" [disabled]=\"!color.use\" (valueChange)=\"onColorChanged($event)\">\n</pep-color>\n<pep-slider [label]=\"title + ' ' + ('COLOR_SETTINGS.OPACITY' | translate)\" [hint]=\"color.opacity.toString() || ''\" [minValue]=\"0\" [maxValue]=\"100\" [disabled]=\"!color.use\" [value]=\"color.opacity\" \n [background]=\"getSliderBackground()\" (inputChange)=\"onSliderValueChanged($event)\">\n</pep-slider>\n", styles: [":host{width:100%}\n"], components: [{ type: i2__namespace.PepCheckboxComponent, selector: "pep-checkbox", inputs: ["key", "value", "label", "mandatory", "disabled", "readonly", "xAlignment", "rowSpan", "form", "isActive", "showTitle", "renderTitle", "layoutType", "type", "additionalValue", "visible"], outputs: ["valueChange"] }, { type: i3__namespace.PepColorComponent, selector: "pep-color", inputs: ["key", "value", "label", "disabled", "xAlignment", "rowSpan", "type", "showTitle", "renderTitle", "showAAComplient", "layoutType"], outputs: ["valueChange"] }, { type: i4__namespace.PepSliderComponent, selector: "pep-slider", inputs: ["label", "disabled", "hint", "step", "minValue", "maxValue", "background", "value"], outputs: ["valueChange", "inputChange"] }], pipes: { "translate": i5__namespace.TranslatePipe } });
109
+ ColorSettingsComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.0.5", type: ColorSettingsComponent, selector: "pep-color-settings", inputs: { title: "title", color: "color" }, outputs: { colorChange: "colorChange" }, ngImport: i0__namespace, template: "<pep-checkbox class=\"checkbox-as-title\" [label]=\"title\" [renderTitle]=\"false\" [value]=\"color.use\" (valueChange)=\"onUseChanged($event)\"></pep-checkbox>\n<pep-color [value]=\"color.value\" [label]=\"title + ' ' + ('COLOR_SETTINGS.COLOR' | translate)\" [disabled]=\"!color.use\" (valueChange)=\"onColorChanged($event)\">\n</pep-color>\n<pep-slider [label]=\"title + ' ' + ('COLOR_SETTINGS.OPACITY' | translate)\" [hint]=\"color.opacity.toString() || ''\" [minValue]=\"0\" [maxValue]=\"100\" [disabled]=\"!color.use\" [value]=\"color.opacity\" \n [background]=\"getSliderBackground()\" (inputChange)=\"onSliderInputChanged($event)\" (valueChange)=\"onSliderValueChanged($event)\">\n</pep-slider>\n", styles: [":host{width:100%}\n"], components: [{ type: i2__namespace.PepCheckboxComponent, selector: "pep-checkbox", inputs: ["key", "value", "label", "mandatory", "disabled", "readonly", "xAlignment", "rowSpan", "form", "isActive", "showTitle", "renderTitle", "layoutType", "type", "additionalValue", "visible"], outputs: ["valueChange"] }, { type: i3__namespace.PepColorComponent, selector: "pep-color", inputs: ["key", "value", "label", "disabled", "xAlignment", "rowSpan", "type", "showTitle", "renderTitle", "showAAComplient", "layoutType"], outputs: ["valueChange"] }, { type: i4__namespace.PepSliderComponent, selector: "pep-slider", inputs: ["label", "disabled", "hint", "step", "minValue", "maxValue", "background", "value"], outputs: ["valueChange", "inputChange"] }], pipes: { "translate": i5__namespace.TranslatePipe } });
107
110
  i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0__namespace, type: ColorSettingsComponent, decorators: [{
108
111
  type: i0.Component,
109
112
  args: [{
@@ -1 +1 @@
1
- {"version":3,"file":"pepperi-addons-ngx-composite-lib-color-settings.umd.js","sources":["../../../projects/ngx-composite-lib/color-settings/color-settings.model.ts","../../../projects/ngx-composite-lib/color-settings/color-settings.component.ts","../../../projects/ngx-composite-lib/color-settings/color-settings.component.html","../../../projects/ngx-composite-lib/color-settings/color-settings.module.ts","../../../projects/ngx-composite-lib/color-settings/public-api.ts","../../../projects/ngx-composite-lib/color-settings/pepperi-addons-ngx-composite-lib-color-settings.ts"],"sourcesContent":["export class PepColorSettings {\r\n use = false;\r\n value = 'hsl(0, 0%, 57%)';\r\n opacity = 50;\r\n // useGradientOverlay?: boolean = true;\r\n}","import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';\nimport { PepColorService } from '@pepperi-addons/ngx-lib';\nimport { PepColorSettings } from './color-settings.model';\n\n@Component({\n selector: 'pep-color-settings',\n templateUrl: './color-settings.component.html',\n styleUrls: ['./color-settings.component.scss']\n})\nexport class ColorSettingsComponent implements OnInit {\n\n @Input() title = '';\n\n private _color: PepColorSettings = new PepColorSettings();\n @Input()\n set color(value: PepColorSettings) {\n if (!value) {\n this._color = new PepColorSettings();\n } else {\n this._color = value;\n }\n }\n get color(): PepColorSettings {\n return this._color;\n }\n\n @Output()\n colorChange: EventEmitter<PepColorSettings> = new EventEmitter<PepColorSettings>();\n \n constructor(private pepColorService: PepColorService) { }\n\n ngOnInit() {\n //\n }\n\n private getRGBAcolor(colorObj: PepColorSettings, opac: number | null = null) {\n let rgba = 'rgba(255,255,255,0)';\n\n if (colorObj) {\n const color = colorObj.value;\n let opacity = opac != null ? opac : colorObj.opacity;\n\n opacity = opacity > 0 ? opacity / 100 : 0;\n\n const hsl = this.pepColorService.hslString2hsl(color);\n const rgb = this.pepColorService.hsl2rgb(hsl);\n rgba = 'rgba(' + rgb.r + ',' + rgb.g + ',' + rgb.b + ',' + opacity + ')';\n }\n\n return rgba;\n }\n\n private raiseColorChange() {\n this.colorChange.emit(this.color);\n }\n\n getSliderBackground() {\n const alignTo = 'right';\n \n const colorObj = new PepColorSettings();\n \n colorObj.value = this.color.value;\n colorObj.opacity = 100;\n \n const gradStr = this.getRGBAcolor(colorObj, 0) + ' , ' + this.getRGBAcolor(colorObj);\n \n return 'linear-gradient(to ' + alignTo + ', ' + gradStr + ')';\n }\n\n onUseChanged(value: boolean) {\n this.color.use = value;\n this.raiseColorChange();\n }\n\n onColorChanged(value: string) {\n this.color.value = value;\n this.raiseColorChange();\n }\n\n onSliderValueChanged(value: number) {\n this.color.opacity = value;\n this.raiseColorChange();\n }\n}\n","<pep-checkbox class=\"checkbox-as-title\" [label]=\"title\" [renderTitle]=\"false\" [value]=\"color.use\" (valueChange)=\"onUseChanged($event)\"></pep-checkbox>\n<pep-color [value]=\"color.value\" [label]=\"title + ' ' + ('COLOR_SETTINGS.COLOR' | translate)\" [disabled]=\"!color.use\" (valueChange)=\"onColorChanged($event)\">\n</pep-color>\n<pep-slider [label]=\"title + ' ' + ('COLOR_SETTINGS.OPACITY' | translate)\" [hint]=\"color.opacity.toString() || ''\" [minValue]=\"0\" [maxValue]=\"100\" [disabled]=\"!color.use\" [value]=\"color.opacity\" \n [background]=\"getSliderBackground()\" (inputChange)=\"onSliderValueChanged($event)\">\n</pep-slider>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { PepNgxLibModule } from '@pepperi-addons/ngx-lib';\nimport { PepColorModule } from '@pepperi-addons/ngx-lib/color';\nimport { PepCheckboxModule } from '@pepperi-addons/ngx-lib/checkbox';\nimport { PepSliderModule } from '@pepperi-addons/ngx-lib/slider';\n\nimport { ColorSettingsComponent } from './color-settings.component';\n\n@NgModule({\n declarations: [\n ColorSettingsComponent\n ],\n imports: [\n CommonModule,\n PepNgxLibModule,\n PepCheckboxModule,\n PepColorModule,\n PepSliderModule\n ],\n exports: [ColorSettingsComponent],\n})\nexport class PepColorSettingsModule { }\n","/*\n * Public API Surface of ngx-composite-lib/color-settings\n */\nexport * from './color-settings.module';\nexport * from './color-settings.component';\nexport * from './color-settings.model';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":["EventEmitter","Component","Input","Output","CommonModule","PepNgxLibModule","PepCheckboxModule","PepColorModule","PepSliderModule","NgModule"],"mappings":"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"}
1
+ {"version":3,"file":"pepperi-addons-ngx-composite-lib-color-settings.umd.js","sources":["../../../projects/ngx-composite-lib/color-settings/color-settings.model.ts","../../../projects/ngx-composite-lib/color-settings/color-settings.component.ts","../../../projects/ngx-composite-lib/color-settings/color-settings.component.html","../../../projects/ngx-composite-lib/color-settings/color-settings.module.ts","../../../projects/ngx-composite-lib/color-settings/public-api.ts","../../../projects/ngx-composite-lib/color-settings/pepperi-addons-ngx-composite-lib-color-settings.ts"],"sourcesContent":["export class PepColorSettings {\r\n use = false;\r\n value = 'hsl(0, 0%, 57%)';\r\n opacity = 50;\r\n // useGradientOverlay?: boolean = true;\r\n}","import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';\nimport { PepColorService } from '@pepperi-addons/ngx-lib';\nimport { PepColorSettings } from './color-settings.model';\n\n@Component({\n selector: 'pep-color-settings',\n templateUrl: './color-settings.component.html',\n styleUrls: ['./color-settings.component.scss']\n})\nexport class ColorSettingsComponent implements OnInit {\n\n @Input() title = '';\n\n private _color: PepColorSettings = new PepColorSettings();\n @Input()\n set color(value: PepColorSettings) {\n if (!value) {\n this._color = new PepColorSettings();\n } else {\n this._color = value;\n }\n }\n get color(): PepColorSettings {\n return this._color;\n }\n\n @Output()\n colorChange: EventEmitter<PepColorSettings> = new EventEmitter<PepColorSettings>();\n \n constructor(private pepColorService: PepColorService) { }\n\n ngOnInit() {\n //\n }\n\n private getRGBAcolor(colorObj: PepColorSettings, opac: number | null = null) {\n let rgba = 'rgba(255,255,255,0)';\n\n if (colorObj) {\n const color = colorObj.value;\n let opacity = opac != null ? opac : colorObj.opacity;\n\n opacity = opacity > 0 ? opacity / 100 : 0;\n\n const hsl = this.pepColorService.hslString2hsl(color);\n const rgb = this.pepColorService.hsl2rgb(hsl);\n rgba = 'rgba(' + rgb.r + ',' + rgb.g + ',' + rgb.b + ',' + opacity + ')';\n }\n\n return rgba;\n }\n\n private raiseColorChange() {\n this.colorChange.emit(this.color);\n }\n\n getSliderBackground() {\n const alignTo = 'right';\n \n const colorObj = new PepColorSettings();\n \n colorObj.value = this.color.value;\n colorObj.opacity = 100;\n \n const gradStr = this.getRGBAcolor(colorObj, 0) + ' , ' + this.getRGBAcolor(colorObj);\n \n return 'linear-gradient(to ' + alignTo + ', ' + gradStr + ')';\n }\n\n onUseChanged(value: boolean) {\n this.color.use = value;\n this.raiseColorChange();\n }\n\n onColorChanged(value: string) {\n this.color.value = value;\n this.raiseColorChange();\n }\n \n onSliderInputChanged(value: number) {\n this.color.opacity = value;\n }\n\n onSliderValueChanged(value: number) {\n this.color.opacity = value;\n this.raiseColorChange();\n }\n}\n","<pep-checkbox class=\"checkbox-as-title\" [label]=\"title\" [renderTitle]=\"false\" [value]=\"color.use\" (valueChange)=\"onUseChanged($event)\"></pep-checkbox>\n<pep-color [value]=\"color.value\" [label]=\"title + ' ' + ('COLOR_SETTINGS.COLOR' | translate)\" [disabled]=\"!color.use\" (valueChange)=\"onColorChanged($event)\">\n</pep-color>\n<pep-slider [label]=\"title + ' ' + ('COLOR_SETTINGS.OPACITY' | translate)\" [hint]=\"color.opacity.toString() || ''\" [minValue]=\"0\" [maxValue]=\"100\" [disabled]=\"!color.use\" [value]=\"color.opacity\" \n [background]=\"getSliderBackground()\" (inputChange)=\"onSliderInputChanged($event)\" (valueChange)=\"onSliderValueChanged($event)\">\n</pep-slider>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { PepNgxLibModule } from '@pepperi-addons/ngx-lib';\nimport { PepColorModule } from '@pepperi-addons/ngx-lib/color';\nimport { PepCheckboxModule } from '@pepperi-addons/ngx-lib/checkbox';\nimport { PepSliderModule } from '@pepperi-addons/ngx-lib/slider';\n\nimport { ColorSettingsComponent } from './color-settings.component';\n\n@NgModule({\n declarations: [\n ColorSettingsComponent\n ],\n imports: [\n CommonModule,\n PepNgxLibModule,\n PepCheckboxModule,\n PepColorModule,\n PepSliderModule\n ],\n exports: [ColorSettingsComponent],\n})\nexport class PepColorSettingsModule { }\n","/*\n * Public API Surface of ngx-composite-lib/color-settings\n */\nexport * from './color-settings.module';\nexport * from './color-settings.component';\nexport * from './color-settings.model';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":["EventEmitter","Component","Input","Output","CommonModule","PepNgxLibModule","PepCheckboxModule","PepColorModule","PepSliderModule","NgModule"],"mappings":"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"}
@@ -16,6 +16,7 @@ export declare class ColorSettingsComponent implements OnInit {
16
16
  getSliderBackground(): string;
17
17
  onUseChanged(value: boolean): void;
18
18
  onColorChanged(value: string): void;
19
+ onSliderInputChanged(value: number): void;
19
20
  onSliderValueChanged(value: number): void;
20
21
  static ɵfac: i0.ɵɵFactoryDeclaration<ColorSettingsComponent, never>;
21
22
  static ɵcmp: i0.ɵɵComponentDeclaration<ColorSettingsComponent, "pep-color-settings", never, { "title": "title"; "color": "color"; }, { "colorChange": "colorChange"; }, never, never>;
@@ -58,13 +58,16 @@ export class ColorSettingsComponent {
58
58
  this.color.value = value;
59
59
  this.raiseColorChange();
60
60
  }
61
+ onSliderInputChanged(value) {
62
+ this.color.opacity = value;
63
+ }
61
64
  onSliderValueChanged(value) {
62
65
  this.color.opacity = value;
63
66
  this.raiseColorChange();
64
67
  }
65
68
  }
66
69
  ColorSettingsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: ColorSettingsComponent, deps: [{ token: i1.PepColorService }], target: i0.ɵɵFactoryTarget.Component });
67
- ColorSettingsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.0.5", type: ColorSettingsComponent, selector: "pep-color-settings", inputs: { title: "title", color: "color" }, outputs: { colorChange: "colorChange" }, ngImport: i0, template: "<pep-checkbox class=\"checkbox-as-title\" [label]=\"title\" [renderTitle]=\"false\" [value]=\"color.use\" (valueChange)=\"onUseChanged($event)\"></pep-checkbox>\n<pep-color [value]=\"color.value\" [label]=\"title + ' ' + ('COLOR_SETTINGS.COLOR' | translate)\" [disabled]=\"!color.use\" (valueChange)=\"onColorChanged($event)\">\n</pep-color>\n<pep-slider [label]=\"title + ' ' + ('COLOR_SETTINGS.OPACITY' | translate)\" [hint]=\"color.opacity.toString() || ''\" [minValue]=\"0\" [maxValue]=\"100\" [disabled]=\"!color.use\" [value]=\"color.opacity\" \n [background]=\"getSliderBackground()\" (inputChange)=\"onSliderValueChanged($event)\">\n</pep-slider>\n", styles: [":host{width:100%}\n"], components: [{ type: i2.PepCheckboxComponent, selector: "pep-checkbox", inputs: ["key", "value", "label", "mandatory", "disabled", "readonly", "xAlignment", "rowSpan", "form", "isActive", "showTitle", "renderTitle", "layoutType", "type", "additionalValue", "visible"], outputs: ["valueChange"] }, { type: i3.PepColorComponent, selector: "pep-color", inputs: ["key", "value", "label", "disabled", "xAlignment", "rowSpan", "type", "showTitle", "renderTitle", "showAAComplient", "layoutType"], outputs: ["valueChange"] }, { type: i4.PepSliderComponent, selector: "pep-slider", inputs: ["label", "disabled", "hint", "step", "minValue", "maxValue", "background", "value"], outputs: ["valueChange", "inputChange"] }], pipes: { "translate": i5.TranslatePipe } });
70
+ ColorSettingsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.0.5", type: ColorSettingsComponent, selector: "pep-color-settings", inputs: { title: "title", color: "color" }, outputs: { colorChange: "colorChange" }, ngImport: i0, template: "<pep-checkbox class=\"checkbox-as-title\" [label]=\"title\" [renderTitle]=\"false\" [value]=\"color.use\" (valueChange)=\"onUseChanged($event)\"></pep-checkbox>\n<pep-color [value]=\"color.value\" [label]=\"title + ' ' + ('COLOR_SETTINGS.COLOR' | translate)\" [disabled]=\"!color.use\" (valueChange)=\"onColorChanged($event)\">\n</pep-color>\n<pep-slider [label]=\"title + ' ' + ('COLOR_SETTINGS.OPACITY' | translate)\" [hint]=\"color.opacity.toString() || ''\" [minValue]=\"0\" [maxValue]=\"100\" [disabled]=\"!color.use\" [value]=\"color.opacity\" \n [background]=\"getSliderBackground()\" (inputChange)=\"onSliderInputChanged($event)\" (valueChange)=\"onSliderValueChanged($event)\">\n</pep-slider>\n", styles: [":host{width:100%}\n"], components: [{ type: i2.PepCheckboxComponent, selector: "pep-checkbox", inputs: ["key", "value", "label", "mandatory", "disabled", "readonly", "xAlignment", "rowSpan", "form", "isActive", "showTitle", "renderTitle", "layoutType", "type", "additionalValue", "visible"], outputs: ["valueChange"] }, { type: i3.PepColorComponent, selector: "pep-color", inputs: ["key", "value", "label", "disabled", "xAlignment", "rowSpan", "type", "showTitle", "renderTitle", "showAAComplient", "layoutType"], outputs: ["valueChange"] }, { type: i4.PepSliderComponent, selector: "pep-slider", inputs: ["label", "disabled", "hint", "step", "minValue", "maxValue", "background", "value"], outputs: ["valueChange", "inputChange"] }], pipes: { "translate": i5.TranslatePipe } });
68
71
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: ColorSettingsComponent, decorators: [{
69
72
  type: Component,
70
73
  args: [{
@@ -79,4 +82,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.0.5", ngImpor
79
82
  }], colorChange: [{
80
83
  type: Output
81
84
  }] } });
82
- //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY29sb3Itc2V0dGluZ3MuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vcHJvamVjdHMvbmd4LWNvbXBvc2l0ZS1saWIvY29sb3Itc2V0dGluZ3MvY29sb3Itc2V0dGluZ3MuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vcHJvamVjdHMvbmd4LWNvbXBvc2l0ZS1saWIvY29sb3Itc2V0dGluZ3MvY29sb3Itc2V0dGluZ3MuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBRSxZQUFZLEVBQUUsS0FBSyxFQUFVLE1BQU0sRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUUvRSxPQUFPLEVBQUUsZ0JBQWdCLEVBQUUsTUFBTSx3QkFBd0IsQ0FBQzs7Ozs7OztBQU8xRCxNQUFNLE9BQU8sc0JBQXNCO0lBb0IvQixZQUFvQixlQUFnQztRQUFoQyxvQkFBZSxHQUFmLGVBQWUsQ0FBaUI7UUFsQjNDLFVBQUssR0FBRyxFQUFFLENBQUM7UUFFWixXQUFNLEdBQXFCLElBQUksZ0JBQWdCLEVBQUUsQ0FBQztRQWMxRCxnQkFBVyxHQUFtQyxJQUFJLFlBQVksRUFBb0IsQ0FBQztJQUUzQixDQUFDO0lBZnpELElBQ0ksS0FBSyxDQUFDLEtBQXVCO1FBQzdCLElBQUksQ0FBQyxLQUFLLEVBQUU7WUFDUixJQUFJLENBQUMsTUFBTSxHQUFHLElBQUksZ0JBQWdCLEVBQUUsQ0FBQztTQUN4QzthQUFNO1lBQ0gsSUFBSSxDQUFDLE1BQU0sR0FBRyxLQUFLLENBQUM7U0FDdkI7SUFDTCxDQUFDO0lBQ0QsSUFBSSxLQUFLO1FBQ0wsT0FBTyxJQUFJLENBQUMsTUFBTSxDQUFDO0lBQ3ZCLENBQUM7SUFPRCxRQUFRO1FBQ0osRUFBRTtJQUNOLENBQUM7SUFFTyxZQUFZLENBQUMsUUFBMEIsRUFBRSxPQUFzQixJQUFJO1FBQ3ZFLElBQUksSUFBSSxHQUFHLHFCQUFxQixDQUFDO1FBRWpDLElBQUksUUFBUSxFQUFFO1lBQ1YsTUFBTSxLQUFLLEdBQUcsUUFBUSxDQUFDLEtBQUssQ0FBQztZQUM3QixJQUFJLE9BQU8sR0FBRyxJQUFJLElBQUksSUFBSSxDQUFDLENBQUMsQ0FBQyxJQUFJLENBQUMsQ0FBQyxDQUFDLFFBQVEsQ0FBQyxPQUFPLENBQUM7WUFFckQsT0FBTyxHQUFHLE9BQU8sR0FBRyxDQUFDLENBQUMsQ0FBQyxDQUFDLE9BQU8sR0FBRyxHQUFHLENBQUMsQ0FBQyxDQUFDLENBQUMsQ0FBQztZQUUxQyxNQUFNLEdBQUcsR0FBRyxJQUFJLENBQUMsZUFBZSxDQUFDLGFBQWEsQ0FBQyxLQUFLLENBQUMsQ0FBQztZQUN0RCxNQUFNLEdBQUcsR0FBRyxJQUFJLENBQUMsZUFBZSxDQUFDLE9BQU8sQ0FBQyxHQUFHLENBQUMsQ0FBQztZQUM5QyxJQUFJLEdBQUcsT0FBTyxHQUFHLEdBQUcsQ0FBQyxDQUFDLEdBQUcsR0FBRyxHQUFHLEdBQUcsQ0FBQyxDQUFDLEdBQUcsR0FBRyxHQUFHLEdBQUcsQ0FBQyxDQUFDLEdBQUcsR0FBRyxHQUFHLE9BQU8sR0FBRyxHQUFHLENBQUM7U0FDNUU7UUFFRCxPQUFPLElBQUksQ0FBQztJQUNoQixDQUFDO0lBRU8sZ0JBQWdCO1FBQ3BCLElBQUksQ0FBQyxXQUFXLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxLQUFLLENBQUMsQ0FBQztJQUN0QyxDQUFDO0lBRUQsbUJBQW1CO1FBQ2YsTUFBTSxPQUFPLEdBQUcsT0FBTyxDQUFDO1FBRXhCLE1BQU0sUUFBUSxHQUFHLElBQUksZ0JBQWdCLEVBQUUsQ0FBQztRQUV4QyxRQUFRLENBQUMsS0FBSyxHQUFHLElBQUksQ0FBQyxLQUFLLENBQUMsS0FBSyxDQUFDO1FBQ2xDLFFBQVEsQ0FBQyxPQUFPLEdBQUcsR0FBRyxDQUFDO1FBRXZCLE1BQU0sT0FBTyxHQUFHLElBQUksQ0FBQyxZQUFZLENBQUMsUUFBUSxFQUFFLENBQUMsQ0FBQyxHQUFHLEtBQUssR0FBRyxJQUFJLENBQUMsWUFBWSxDQUFDLFFBQVEsQ0FBQyxDQUFDO1FBRXJGLE9BQU8scUJBQXFCLEdBQUcsT0FBTyxHQUFHLElBQUksR0FBRyxPQUFPLEdBQUcsR0FBRyxDQUFDO0lBQ2xFLENBQUM7SUFFRCxZQUFZLENBQUMsS0FBYztRQUN2QixJQUFJLENBQUMsS0FBSyxDQUFDLEdBQUcsR0FBRyxLQUFLLENBQUM7UUFDdkIsSUFBSSxDQUFDLGdCQUFnQixFQUFFLENBQUM7SUFDNUIsQ0FBQztJQUVELGNBQWMsQ0FBQyxLQUFhO1FBQ3hCLElBQUksQ0FBQyxLQUFLLENBQUMsS0FBSyxHQUFHLEtBQUssQ0FBQztRQUN6QixJQUFJLENBQUMsZ0JBQWdCLEVBQUUsQ0FBQztJQUM1QixDQUFDO0lBRUQsb0JBQW9CLENBQUMsS0FBYTtRQUM5QixJQUFJLENBQUMsS0FBSyxDQUFDLE9BQU8sR0FBRyxLQUFLLENBQUM7UUFDM0IsSUFBSSxDQUFDLGdCQUFnQixFQUFFLENBQUM7SUFDNUIsQ0FBQzs7bUhBekVRLHNCQUFzQjt1R0FBdEIsc0JBQXNCLCtJQ1RuQyxxcEJBTUE7MkZER2Esc0JBQXNCO2tCQUxsQyxTQUFTO21CQUFDO29CQUNQLFFBQVEsRUFBRSxvQkFBb0I7b0JBQzlCLFdBQVcsRUFBRSxpQ0FBaUM7b0JBQzlDLFNBQVMsRUFBRSxDQUFDLGlDQUFpQyxDQUFDO2lCQUNqRDtzR0FHWSxLQUFLO3NCQUFiLEtBQUs7Z0JBSUYsS0FBSztzQkFEUixLQUFLO2dCQWFOLFdBQVc7c0JBRFYsTUFBTSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgRXZlbnRFbWl0dGVyLCBJbnB1dCwgT25Jbml0LCBPdXRwdXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IFBlcENvbG9yU2VydmljZSB9IGZyb20gJ0BwZXBwZXJpLWFkZG9ucy9uZ3gtbGliJztcbmltcG9ydCB7IFBlcENvbG9yU2V0dGluZ3MgfSBmcm9tICcuL2NvbG9yLXNldHRpbmdzLm1vZGVsJztcblxuQENvbXBvbmVudCh7XG4gICAgc2VsZWN0b3I6ICdwZXAtY29sb3Itc2V0dGluZ3MnLFxuICAgIHRlbXBsYXRlVXJsOiAnLi9jb2xvci1zZXR0aW5ncy5jb21wb25lbnQuaHRtbCcsXG4gICAgc3R5bGVVcmxzOiBbJy4vY29sb3Itc2V0dGluZ3MuY29tcG9uZW50LnNjc3MnXVxufSlcbmV4cG9ydCBjbGFzcyBDb2xvclNldHRpbmdzQ29tcG9uZW50IGltcGxlbWVudHMgT25Jbml0IHtcblxuICAgIEBJbnB1dCgpIHRpdGxlID0gJyc7XG5cbiAgICBwcml2YXRlIF9jb2xvcjogUGVwQ29sb3JTZXR0aW5ncyA9IG5ldyBQZXBDb2xvclNldHRpbmdzKCk7XG4gICAgQElucHV0KClcbiAgICBzZXQgY29sb3IodmFsdWU6IFBlcENvbG9yU2V0dGluZ3MpIHtcbiAgICAgICAgaWYgKCF2YWx1ZSkge1xuICAgICAgICAgICAgdGhpcy5fY29sb3IgPSBuZXcgUGVwQ29sb3JTZXR0aW5ncygpO1xuICAgICAgICB9IGVsc2Uge1xuICAgICAgICAgICAgdGhpcy5fY29sb3IgPSB2YWx1ZTtcbiAgICAgICAgfVxuICAgIH1cbiAgICBnZXQgY29sb3IoKTogUGVwQ29sb3JTZXR0aW5ncyB7XG4gICAgICAgIHJldHVybiB0aGlzLl9jb2xvcjtcbiAgICB9XG5cbiAgICBAT3V0cHV0KClcbiAgICBjb2xvckNoYW5nZTogRXZlbnRFbWl0dGVyPFBlcENvbG9yU2V0dGluZ3M+ID0gbmV3IEV2ZW50RW1pdHRlcjxQZXBDb2xvclNldHRpbmdzPigpO1xuICAgIFxuICAgIGNvbnN0cnVjdG9yKHByaXZhdGUgcGVwQ29sb3JTZXJ2aWNlOiBQZXBDb2xvclNlcnZpY2UpIHsgfVxuXG4gICAgbmdPbkluaXQoKSB7XG4gICAgICAgIC8vXG4gICAgfVxuXG4gICAgcHJpdmF0ZSBnZXRSR0JBY29sb3IoY29sb3JPYmo6IFBlcENvbG9yU2V0dGluZ3MsIG9wYWM6IG51bWJlciB8IG51bGwgPSBudWxsKSB7XG4gICAgICAgIGxldCByZ2JhID0gJ3JnYmEoMjU1LDI1NSwyNTUsMCknO1xuXG4gICAgICAgIGlmIChjb2xvck9iaikge1xuICAgICAgICAgICAgY29uc3QgY29sb3IgPSBjb2xvck9iai52YWx1ZTtcbiAgICAgICAgICAgIGxldCBvcGFjaXR5ID0gb3BhYyAhPSBudWxsID8gb3BhYyA6IGNvbG9yT2JqLm9wYWNpdHk7XG5cbiAgICAgICAgICAgIG9wYWNpdHkgPSBvcGFjaXR5ID4gMCA/IG9wYWNpdHkgLyAxMDAgOiAwO1xuXG4gICAgICAgICAgICBjb25zdCBoc2wgPSB0aGlzLnBlcENvbG9yU2VydmljZS5oc2xTdHJpbmcyaHNsKGNvbG9yKTtcbiAgICAgICAgICAgIGNvbnN0IHJnYiA9IHRoaXMucGVwQ29sb3JTZXJ2aWNlLmhzbDJyZ2IoaHNsKTtcbiAgICAgICAgICAgIHJnYmEgPSAncmdiYSgnICsgcmdiLnIgKyAnLCcgKyByZ2IuZyArICcsJyArIHJnYi5iICsgJywnICsgb3BhY2l0eSArICcpJztcbiAgICAgICAgfVxuXG4gICAgICAgIHJldHVybiByZ2JhO1xuICAgIH1cblxuICAgIHByaXZhdGUgcmFpc2VDb2xvckNoYW5nZSgpIHtcbiAgICAgICAgdGhpcy5jb2xvckNoYW5nZS5lbWl0KHRoaXMuY29sb3IpO1xuICAgIH1cblxuICAgIGdldFNsaWRlckJhY2tncm91bmQoKSB7XG4gICAgICAgIGNvbnN0IGFsaWduVG8gPSAncmlnaHQnO1xuICAgIFxuICAgICAgICBjb25zdCBjb2xvck9iaiA9IG5ldyBQZXBDb2xvclNldHRpbmdzKCk7XG4gICAgXG4gICAgICAgIGNvbG9yT2JqLnZhbHVlID0gdGhpcy5jb2xvci52YWx1ZTtcbiAgICAgICAgY29sb3JPYmoub3BhY2l0eSA9IDEwMDtcbiAgICBcbiAgICAgICAgY29uc3QgZ3JhZFN0ciA9IHRoaXMuZ2V0UkdCQWNvbG9yKGNvbG9yT2JqLCAwKSArICcgLCAnICsgdGhpcy5nZXRSR0JBY29sb3IoY29sb3JPYmopO1xuICAgIFxuICAgICAgICByZXR1cm4gJ2xpbmVhci1ncmFkaWVudCh0byAnICsgYWxpZ25UbyArICcsICcgKyBncmFkU3RyICsgJyknO1xuICAgIH1cblxuICAgIG9uVXNlQ2hhbmdlZCh2YWx1ZTogYm9vbGVhbikge1xuICAgICAgICB0aGlzLmNvbG9yLnVzZSA9IHZhbHVlO1xuICAgICAgICB0aGlzLnJhaXNlQ29sb3JDaGFuZ2UoKTtcbiAgICB9XG5cbiAgICBvbkNvbG9yQ2hhbmdlZCh2YWx1ZTogc3RyaW5nKSB7XG4gICAgICAgIHRoaXMuY29sb3IudmFsdWUgPSB2YWx1ZTtcbiAgICAgICAgdGhpcy5yYWlzZUNvbG9yQ2hhbmdlKCk7XG4gICAgfVxuXG4gICAgb25TbGlkZXJWYWx1ZUNoYW5nZWQodmFsdWU6IG51bWJlcikge1xuICAgICAgICB0aGlzLmNvbG9yLm9wYWNpdHkgPSB2YWx1ZTtcbiAgICAgICAgdGhpcy5yYWlzZUNvbG9yQ2hhbmdlKCk7XG4gICAgfVxufVxuIiwiPHBlcC1jaGVja2JveCBjbGFzcz1cImNoZWNrYm94LWFzLXRpdGxlXCIgW2xhYmVsXT1cInRpdGxlXCIgW3JlbmRlclRpdGxlXT1cImZhbHNlXCIgW3ZhbHVlXT1cImNvbG9yLnVzZVwiICh2YWx1ZUNoYW5nZSk9XCJvblVzZUNoYW5nZWQoJGV2ZW50KVwiPjwvcGVwLWNoZWNrYm94PlxuPHBlcC1jb2xvciBbdmFsdWVdPVwiY29sb3IudmFsdWVcIiBbbGFiZWxdPVwidGl0bGUgKyAnICcgKyAoJ0NPTE9SX1NFVFRJTkdTLkNPTE9SJyB8IHRyYW5zbGF0ZSlcIiBbZGlzYWJsZWRdPVwiIWNvbG9yLnVzZVwiICh2YWx1ZUNoYW5nZSk9XCJvbkNvbG9yQ2hhbmdlZCgkZXZlbnQpXCI+XG48L3BlcC1jb2xvcj5cbjxwZXAtc2xpZGVyIFtsYWJlbF09XCJ0aXRsZSArICcgJyArICgnQ09MT1JfU0VUVElOR1MuT1BBQ0lUWScgfCB0cmFuc2xhdGUpXCIgW2hpbnRdPVwiY29sb3Iub3BhY2l0eS50b1N0cmluZygpIHx8ICcnXCIgW21pblZhbHVlXT1cIjBcIiBbbWF4VmFsdWVdPVwiMTAwXCIgW2Rpc2FibGVkXT1cIiFjb2xvci51c2VcIiBbdmFsdWVdPVwiY29sb3Iub3BhY2l0eVwiIFxuICAgIFtiYWNrZ3JvdW5kXT1cImdldFNsaWRlckJhY2tncm91bmQoKVwiIChpbnB1dENoYW5nZSk9XCJvblNsaWRlclZhbHVlQ2hhbmdlZCgkZXZlbnQpXCI+XG48L3BlcC1zbGlkZXI+XG4iXX0=
85
+ //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY29sb3Itc2V0dGluZ3MuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vcHJvamVjdHMvbmd4LWNvbXBvc2l0ZS1saWIvY29sb3Itc2V0dGluZ3MvY29sb3Itc2V0dGluZ3MuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vcHJvamVjdHMvbmd4LWNvbXBvc2l0ZS1saWIvY29sb3Itc2V0dGluZ3MvY29sb3Itc2V0dGluZ3MuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBRSxZQUFZLEVBQUUsS0FBSyxFQUFVLE1BQU0sRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUUvRSxPQUFPLEVBQUUsZ0JBQWdCLEVBQUUsTUFBTSx3QkFBd0IsQ0FBQzs7Ozs7OztBQU8xRCxNQUFNLE9BQU8sc0JBQXNCO0lBb0IvQixZQUFvQixlQUFnQztRQUFoQyxvQkFBZSxHQUFmLGVBQWUsQ0FBaUI7UUFsQjNDLFVBQUssR0FBRyxFQUFFLENBQUM7UUFFWixXQUFNLEdBQXFCLElBQUksZ0JBQWdCLEVBQUUsQ0FBQztRQWMxRCxnQkFBVyxHQUFtQyxJQUFJLFlBQVksRUFBb0IsQ0FBQztJQUUzQixDQUFDO0lBZnpELElBQ0ksS0FBSyxDQUFDLEtBQXVCO1FBQzdCLElBQUksQ0FBQyxLQUFLLEVBQUU7WUFDUixJQUFJLENBQUMsTUFBTSxHQUFHLElBQUksZ0JBQWdCLEVBQUUsQ0FBQztTQUN4QzthQUFNO1lBQ0gsSUFBSSxDQUFDLE1BQU0sR0FBRyxLQUFLLENBQUM7U0FDdkI7SUFDTCxDQUFDO0lBQ0QsSUFBSSxLQUFLO1FBQ0wsT0FBTyxJQUFJLENBQUMsTUFBTSxDQUFDO0lBQ3ZCLENBQUM7SUFPRCxRQUFRO1FBQ0osRUFBRTtJQUNOLENBQUM7SUFFTyxZQUFZLENBQUMsUUFBMEIsRUFBRSxPQUFzQixJQUFJO1FBQ3ZFLElBQUksSUFBSSxHQUFHLHFCQUFxQixDQUFDO1FBRWpDLElBQUksUUFBUSxFQUFFO1lBQ1YsTUFBTSxLQUFLLEdBQUcsUUFBUSxDQUFDLEtBQUssQ0FBQztZQUM3QixJQUFJLE9BQU8sR0FBRyxJQUFJLElBQUksSUFBSSxDQUFDLENBQUMsQ0FBQyxJQUFJLENBQUMsQ0FBQyxDQUFDLFFBQVEsQ0FBQyxPQUFPLENBQUM7WUFFckQsT0FBTyxHQUFHLE9BQU8sR0FBRyxDQUFDLENBQUMsQ0FBQyxDQUFDLE9BQU8sR0FBRyxHQUFHLENBQUMsQ0FBQyxDQUFDLENBQUMsQ0FBQztZQUUxQyxNQUFNLEdBQUcsR0FBRyxJQUFJLENBQUMsZUFBZSxDQUFDLGFBQWEsQ0FBQyxLQUFLLENBQUMsQ0FBQztZQUN0RCxNQUFNLEdBQUcsR0FBRyxJQUFJLENBQUMsZUFBZSxDQUFDLE9BQU8sQ0FBQyxHQUFHLENBQUMsQ0FBQztZQUM5QyxJQUFJLEdBQUcsT0FBTyxHQUFHLEdBQUcsQ0FBQyxDQUFDLEdBQUcsR0FBRyxHQUFHLEdBQUcsQ0FBQyxDQUFDLEdBQUcsR0FBRyxHQUFHLEdBQUcsQ0FBQyxDQUFDLEdBQUcsR0FBRyxHQUFHLE9BQU8sR0FBRyxHQUFHLENBQUM7U0FDNUU7UUFFRCxPQUFPLElBQUksQ0FBQztJQUNoQixDQUFDO0lBRU8sZ0JBQWdCO1FBQ3BCLElBQUksQ0FBQyxXQUFXLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxLQUFLLENBQUMsQ0FBQztJQUN0QyxDQUFDO0lBRUQsbUJBQW1CO1FBQ2YsTUFBTSxPQUFPLEdBQUcsT0FBTyxDQUFDO1FBRXhCLE1BQU0sUUFBUSxHQUFHLElBQUksZ0JBQWdCLEVBQUUsQ0FBQztRQUV4QyxRQUFRLENBQUMsS0FBSyxHQUFHLElBQUksQ0FBQyxLQUFLLENBQUMsS0FBSyxDQUFDO1FBQ2xDLFFBQVEsQ0FBQyxPQUFPLEdBQUcsR0FBRyxDQUFDO1FBRXZCLE1BQU0sT0FBTyxHQUFHLElBQUksQ0FBQyxZQUFZLENBQUMsUUFBUSxFQUFFLENBQUMsQ0FBQyxHQUFHLEtBQUssR0FBRyxJQUFJLENBQUMsWUFBWSxDQUFDLFFBQVEsQ0FBQyxDQUFDO1FBRXJGLE9BQU8scUJBQXFCLEdBQUcsT0FBTyxHQUFHLElBQUksR0FBRyxPQUFPLEdBQUcsR0FBRyxDQUFDO0lBQ2xFLENBQUM7SUFFRCxZQUFZLENBQUMsS0FBYztRQUN2QixJQUFJLENBQUMsS0FBSyxDQUFDLEdBQUcsR0FBRyxLQUFLLENBQUM7UUFDdkIsSUFBSSxDQUFDLGdCQUFnQixFQUFFLENBQUM7SUFDNUIsQ0FBQztJQUVELGNBQWMsQ0FBQyxLQUFhO1FBQ3hCLElBQUksQ0FBQyxLQUFLLENBQUMsS0FBSyxHQUFHLEtBQUssQ0FBQztRQUN6QixJQUFJLENBQUMsZ0JBQWdCLEVBQUUsQ0FBQztJQUM1QixDQUFDO0lBRUQsb0JBQW9CLENBQUMsS0FBYTtRQUM5QixJQUFJLENBQUMsS0FBSyxDQUFDLE9BQU8sR0FBRyxLQUFLLENBQUM7SUFDL0IsQ0FBQztJQUVELG9CQUFvQixDQUFDLEtBQWE7UUFDOUIsSUFBSSxDQUFDLEtBQUssQ0FBQyxPQUFPLEdBQUcsS0FBSyxDQUFDO1FBQzNCLElBQUksQ0FBQyxnQkFBZ0IsRUFBRSxDQUFDO0lBQzVCLENBQUM7O21IQTdFUSxzQkFBc0I7dUdBQXRCLHNCQUFzQiwrSUNUbkMsb3NCQU1BOzJGREdhLHNCQUFzQjtrQkFMbEMsU0FBUzttQkFBQztvQkFDUCxRQUFRLEVBQUUsb0JBQW9CO29CQUM5QixXQUFXLEVBQUUsaUNBQWlDO29CQUM5QyxTQUFTLEVBQUUsQ0FBQyxpQ0FBaUMsQ0FBQztpQkFDakQ7c0dBR1ksS0FBSztzQkFBYixLQUFLO2dCQUlGLEtBQUs7c0JBRFIsS0FBSztnQkFhTixXQUFXO3NCQURWLE1BQU0iLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIEV2ZW50RW1pdHRlciwgSW5wdXQsIE9uSW5pdCwgT3V0cHV0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBQZXBDb2xvclNlcnZpY2UgfSBmcm9tICdAcGVwcGVyaS1hZGRvbnMvbmd4LWxpYic7XG5pbXBvcnQgeyBQZXBDb2xvclNldHRpbmdzIH0gZnJvbSAnLi9jb2xvci1zZXR0aW5ncy5tb2RlbCc7XG5cbkBDb21wb25lbnQoe1xuICAgIHNlbGVjdG9yOiAncGVwLWNvbG9yLXNldHRpbmdzJyxcbiAgICB0ZW1wbGF0ZVVybDogJy4vY29sb3Itc2V0dGluZ3MuY29tcG9uZW50Lmh0bWwnLFxuICAgIHN0eWxlVXJsczogWycuL2NvbG9yLXNldHRpbmdzLmNvbXBvbmVudC5zY3NzJ11cbn0pXG5leHBvcnQgY2xhc3MgQ29sb3JTZXR0aW5nc0NvbXBvbmVudCBpbXBsZW1lbnRzIE9uSW5pdCB7XG5cbiAgICBASW5wdXQoKSB0aXRsZSA9ICcnO1xuXG4gICAgcHJpdmF0ZSBfY29sb3I6IFBlcENvbG9yU2V0dGluZ3MgPSBuZXcgUGVwQ29sb3JTZXR0aW5ncygpO1xuICAgIEBJbnB1dCgpXG4gICAgc2V0IGNvbG9yKHZhbHVlOiBQZXBDb2xvclNldHRpbmdzKSB7XG4gICAgICAgIGlmICghdmFsdWUpIHtcbiAgICAgICAgICAgIHRoaXMuX2NvbG9yID0gbmV3IFBlcENvbG9yU2V0dGluZ3MoKTtcbiAgICAgICAgfSBlbHNlIHtcbiAgICAgICAgICAgIHRoaXMuX2NvbG9yID0gdmFsdWU7XG4gICAgICAgIH1cbiAgICB9XG4gICAgZ2V0IGNvbG9yKCk6IFBlcENvbG9yU2V0dGluZ3Mge1xuICAgICAgICByZXR1cm4gdGhpcy5fY29sb3I7XG4gICAgfVxuXG4gICAgQE91dHB1dCgpXG4gICAgY29sb3JDaGFuZ2U6IEV2ZW50RW1pdHRlcjxQZXBDb2xvclNldHRpbmdzPiA9IG5ldyBFdmVudEVtaXR0ZXI8UGVwQ29sb3JTZXR0aW5ncz4oKTtcbiAgICBcbiAgICBjb25zdHJ1Y3Rvcihwcml2YXRlIHBlcENvbG9yU2VydmljZTogUGVwQ29sb3JTZXJ2aWNlKSB7IH1cblxuICAgIG5nT25Jbml0KCkge1xuICAgICAgICAvL1xuICAgIH1cblxuICAgIHByaXZhdGUgZ2V0UkdCQWNvbG9yKGNvbG9yT2JqOiBQZXBDb2xvclNldHRpbmdzLCBvcGFjOiBudW1iZXIgfCBudWxsID0gbnVsbCkge1xuICAgICAgICBsZXQgcmdiYSA9ICdyZ2JhKDI1NSwyNTUsMjU1LDApJztcblxuICAgICAgICBpZiAoY29sb3JPYmopIHtcbiAgICAgICAgICAgIGNvbnN0IGNvbG9yID0gY29sb3JPYmoudmFsdWU7XG4gICAgICAgICAgICBsZXQgb3BhY2l0eSA9IG9wYWMgIT0gbnVsbCA/IG9wYWMgOiBjb2xvck9iai5vcGFjaXR5O1xuXG4gICAgICAgICAgICBvcGFjaXR5ID0gb3BhY2l0eSA+IDAgPyBvcGFjaXR5IC8gMTAwIDogMDtcblxuICAgICAgICAgICAgY29uc3QgaHNsID0gdGhpcy5wZXBDb2xvclNlcnZpY2UuaHNsU3RyaW5nMmhzbChjb2xvcik7XG4gICAgICAgICAgICBjb25zdCByZ2IgPSB0aGlzLnBlcENvbG9yU2VydmljZS5oc2wycmdiKGhzbCk7XG4gICAgICAgICAgICByZ2JhID0gJ3JnYmEoJyArIHJnYi5yICsgJywnICsgcmdiLmcgKyAnLCcgKyByZ2IuYiArICcsJyArIG9wYWNpdHkgKyAnKSc7XG4gICAgICAgIH1cblxuICAgICAgICByZXR1cm4gcmdiYTtcbiAgICB9XG5cbiAgICBwcml2YXRlIHJhaXNlQ29sb3JDaGFuZ2UoKSB7XG4gICAgICAgIHRoaXMuY29sb3JDaGFuZ2UuZW1pdCh0aGlzLmNvbG9yKTtcbiAgICB9XG5cbiAgICBnZXRTbGlkZXJCYWNrZ3JvdW5kKCkge1xuICAgICAgICBjb25zdCBhbGlnblRvID0gJ3JpZ2h0JztcbiAgICBcbiAgICAgICAgY29uc3QgY29sb3JPYmogPSBuZXcgUGVwQ29sb3JTZXR0aW5ncygpO1xuICAgIFxuICAgICAgICBjb2xvck9iai52YWx1ZSA9IHRoaXMuY29sb3IudmFsdWU7XG4gICAgICAgIGNvbG9yT2JqLm9wYWNpdHkgPSAxMDA7XG4gICAgXG4gICAgICAgIGNvbnN0IGdyYWRTdHIgPSB0aGlzLmdldFJHQkFjb2xvcihjb2xvck9iaiwgMCkgKyAnICwgJyArIHRoaXMuZ2V0UkdCQWNvbG9yKGNvbG9yT2JqKTtcbiAgICBcbiAgICAgICAgcmV0dXJuICdsaW5lYXItZ3JhZGllbnQodG8gJyArIGFsaWduVG8gKyAnLCAnICsgZ3JhZFN0ciArICcpJztcbiAgICB9XG5cbiAgICBvblVzZUNoYW5nZWQodmFsdWU6IGJvb2xlYW4pIHtcbiAgICAgICAgdGhpcy5jb2xvci51c2UgPSB2YWx1ZTtcbiAgICAgICAgdGhpcy5yYWlzZUNvbG9yQ2hhbmdlKCk7XG4gICAgfVxuXG4gICAgb25Db2xvckNoYW5nZWQodmFsdWU6IHN0cmluZykge1xuICAgICAgICB0aGlzLmNvbG9yLnZhbHVlID0gdmFsdWU7XG4gICAgICAgIHRoaXMucmFpc2VDb2xvckNoYW5nZSgpO1xuICAgIH1cbiAgICBcbiAgICBvblNsaWRlcklucHV0Q2hhbmdlZCh2YWx1ZTogbnVtYmVyKSB7XG4gICAgICAgIHRoaXMuY29sb3Iub3BhY2l0eSA9IHZhbHVlO1xuICAgIH1cblxuICAgIG9uU2xpZGVyVmFsdWVDaGFuZ2VkKHZhbHVlOiBudW1iZXIpIHtcbiAgICAgICAgdGhpcy5jb2xvci5vcGFjaXR5ID0gdmFsdWU7XG4gICAgICAgIHRoaXMucmFpc2VDb2xvckNoYW5nZSgpO1xuICAgIH1cbn1cbiIsIjxwZXAtY2hlY2tib3ggY2xhc3M9XCJjaGVja2JveC1hcy10aXRsZVwiIFtsYWJlbF09XCJ0aXRsZVwiIFtyZW5kZXJUaXRsZV09XCJmYWxzZVwiIFt2YWx1ZV09XCJjb2xvci51c2VcIiAodmFsdWVDaGFuZ2UpPVwib25Vc2VDaGFuZ2VkKCRldmVudClcIj48L3BlcC1jaGVja2JveD5cbjxwZXAtY29sb3IgW3ZhbHVlXT1cImNvbG9yLnZhbHVlXCIgW2xhYmVsXT1cInRpdGxlICsgJyAnICsgKCdDT0xPUl9TRVRUSU5HUy5DT0xPUicgfCB0cmFuc2xhdGUpXCIgW2Rpc2FibGVkXT1cIiFjb2xvci51c2VcIiAodmFsdWVDaGFuZ2UpPVwib25Db2xvckNoYW5nZWQoJGV2ZW50KVwiPlxuPC9wZXAtY29sb3I+XG48cGVwLXNsaWRlciBbbGFiZWxdPVwidGl0bGUgKyAnICcgKyAoJ0NPTE9SX1NFVFRJTkdTLk9QQUNJVFknIHwgdHJhbnNsYXRlKVwiIFtoaW50XT1cImNvbG9yLm9wYWNpdHkudG9TdHJpbmcoKSB8fCAnJ1wiIFttaW5WYWx1ZV09XCIwXCIgW21heFZhbHVlXT1cIjEwMFwiIFtkaXNhYmxlZF09XCIhY29sb3IudXNlXCIgW3ZhbHVlXT1cImNvbG9yLm9wYWNpdHlcIiBcbiAgICBbYmFja2dyb3VuZF09XCJnZXRTbGlkZXJCYWNrZ3JvdW5kKClcIiAoaW5wdXRDaGFuZ2UpPVwib25TbGlkZXJJbnB1dENoYW5nZWQoJGV2ZW50KVwiICh2YWx1ZUNoYW5nZSk9XCJvblNsaWRlclZhbHVlQ2hhbmdlZCgkZXZlbnQpXCI+XG48L3BlcC1zbGlkZXI+XG4iXX0=
@@ -72,13 +72,16 @@ class ColorSettingsComponent {
72
72
  this.color.value = value;
73
73
  this.raiseColorChange();
74
74
  }
75
+ onSliderInputChanged(value) {
76
+ this.color.opacity = value;
77
+ }
75
78
  onSliderValueChanged(value) {
76
79
  this.color.opacity = value;
77
80
  this.raiseColorChange();
78
81
  }
79
82
  }
80
83
  ColorSettingsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: ColorSettingsComponent, deps: [{ token: i1.PepColorService }], target: i0.ɵɵFactoryTarget.Component });
81
- ColorSettingsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.0.5", type: ColorSettingsComponent, selector: "pep-color-settings", inputs: { title: "title", color: "color" }, outputs: { colorChange: "colorChange" }, ngImport: i0, template: "<pep-checkbox class=\"checkbox-as-title\" [label]=\"title\" [renderTitle]=\"false\" [value]=\"color.use\" (valueChange)=\"onUseChanged($event)\"></pep-checkbox>\n<pep-color [value]=\"color.value\" [label]=\"title + ' ' + ('COLOR_SETTINGS.COLOR' | translate)\" [disabled]=\"!color.use\" (valueChange)=\"onColorChanged($event)\">\n</pep-color>\n<pep-slider [label]=\"title + ' ' + ('COLOR_SETTINGS.OPACITY' | translate)\" [hint]=\"color.opacity.toString() || ''\" [minValue]=\"0\" [maxValue]=\"100\" [disabled]=\"!color.use\" [value]=\"color.opacity\" \n [background]=\"getSliderBackground()\" (inputChange)=\"onSliderValueChanged($event)\">\n</pep-slider>\n", styles: [":host{width:100%}\n"], components: [{ type: i2.PepCheckboxComponent, selector: "pep-checkbox", inputs: ["key", "value", "label", "mandatory", "disabled", "readonly", "xAlignment", "rowSpan", "form", "isActive", "showTitle", "renderTitle", "layoutType", "type", "additionalValue", "visible"], outputs: ["valueChange"] }, { type: i3.PepColorComponent, selector: "pep-color", inputs: ["key", "value", "label", "disabled", "xAlignment", "rowSpan", "type", "showTitle", "renderTitle", "showAAComplient", "layoutType"], outputs: ["valueChange"] }, { type: i4.PepSliderComponent, selector: "pep-slider", inputs: ["label", "disabled", "hint", "step", "minValue", "maxValue", "background", "value"], outputs: ["valueChange", "inputChange"] }], pipes: { "translate": i5.TranslatePipe } });
84
+ ColorSettingsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.0.5", type: ColorSettingsComponent, selector: "pep-color-settings", inputs: { title: "title", color: "color" }, outputs: { colorChange: "colorChange" }, ngImport: i0, template: "<pep-checkbox class=\"checkbox-as-title\" [label]=\"title\" [renderTitle]=\"false\" [value]=\"color.use\" (valueChange)=\"onUseChanged($event)\"></pep-checkbox>\n<pep-color [value]=\"color.value\" [label]=\"title + ' ' + ('COLOR_SETTINGS.COLOR' | translate)\" [disabled]=\"!color.use\" (valueChange)=\"onColorChanged($event)\">\n</pep-color>\n<pep-slider [label]=\"title + ' ' + ('COLOR_SETTINGS.OPACITY' | translate)\" [hint]=\"color.opacity.toString() || ''\" [minValue]=\"0\" [maxValue]=\"100\" [disabled]=\"!color.use\" [value]=\"color.opacity\" \n [background]=\"getSliderBackground()\" (inputChange)=\"onSliderInputChanged($event)\" (valueChange)=\"onSliderValueChanged($event)\">\n</pep-slider>\n", styles: [":host{width:100%}\n"], components: [{ type: i2.PepCheckboxComponent, selector: "pep-checkbox", inputs: ["key", "value", "label", "mandatory", "disabled", "readonly", "xAlignment", "rowSpan", "form", "isActive", "showTitle", "renderTitle", "layoutType", "type", "additionalValue", "visible"], outputs: ["valueChange"] }, { type: i3.PepColorComponent, selector: "pep-color", inputs: ["key", "value", "label", "disabled", "xAlignment", "rowSpan", "type", "showTitle", "renderTitle", "showAAComplient", "layoutType"], outputs: ["valueChange"] }, { type: i4.PepSliderComponent, selector: "pep-slider", inputs: ["label", "disabled", "hint", "step", "minValue", "maxValue", "background", "value"], outputs: ["valueChange", "inputChange"] }], pipes: { "translate": i5.TranslatePipe } });
82
85
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: ColorSettingsComponent, decorators: [{
83
86
  type: Component,
84
87
  args: [{
@@ -1 +1 @@
1
- {"version":3,"file":"pepperi-addons-ngx-composite-lib-color-settings.js","sources":["../../../projects/ngx-composite-lib/color-settings/color-settings.model.ts","../../../projects/ngx-composite-lib/color-settings/color-settings.component.ts","../../../projects/ngx-composite-lib/color-settings/color-settings.component.html","../../../projects/ngx-composite-lib/color-settings/color-settings.module.ts","../../../projects/ngx-composite-lib/color-settings/public-api.ts","../../../projects/ngx-composite-lib/color-settings/pepperi-addons-ngx-composite-lib-color-settings.ts"],"sourcesContent":["export class PepColorSettings {\r\n use = false;\r\n value = 'hsl(0, 0%, 57%)';\r\n opacity = 50;\r\n // useGradientOverlay?: boolean = true;\r\n}","import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';\nimport { PepColorService } from '@pepperi-addons/ngx-lib';\nimport { PepColorSettings } from './color-settings.model';\n\n@Component({\n selector: 'pep-color-settings',\n templateUrl: './color-settings.component.html',\n styleUrls: ['./color-settings.component.scss']\n})\nexport class ColorSettingsComponent implements OnInit {\n\n @Input() title = '';\n\n private _color: PepColorSettings = new PepColorSettings();\n @Input()\n set color(value: PepColorSettings) {\n if (!value) {\n this._color = new PepColorSettings();\n } else {\n this._color = value;\n }\n }\n get color(): PepColorSettings {\n return this._color;\n }\n\n @Output()\n colorChange: EventEmitter<PepColorSettings> = new EventEmitter<PepColorSettings>();\n \n constructor(private pepColorService: PepColorService) { }\n\n ngOnInit() {\n //\n }\n\n private getRGBAcolor(colorObj: PepColorSettings, opac: number | null = null) {\n let rgba = 'rgba(255,255,255,0)';\n\n if (colorObj) {\n const color = colorObj.value;\n let opacity = opac != null ? opac : colorObj.opacity;\n\n opacity = opacity > 0 ? opacity / 100 : 0;\n\n const hsl = this.pepColorService.hslString2hsl(color);\n const rgb = this.pepColorService.hsl2rgb(hsl);\n rgba = 'rgba(' + rgb.r + ',' + rgb.g + ',' + rgb.b + ',' + opacity + ')';\n }\n\n return rgba;\n }\n\n private raiseColorChange() {\n this.colorChange.emit(this.color);\n }\n\n getSliderBackground() {\n const alignTo = 'right';\n \n const colorObj = new PepColorSettings();\n \n colorObj.value = this.color.value;\n colorObj.opacity = 100;\n \n const gradStr = this.getRGBAcolor(colorObj, 0) + ' , ' + this.getRGBAcolor(colorObj);\n \n return 'linear-gradient(to ' + alignTo + ', ' + gradStr + ')';\n }\n\n onUseChanged(value: boolean) {\n this.color.use = value;\n this.raiseColorChange();\n }\n\n onColorChanged(value: string) {\n this.color.value = value;\n this.raiseColorChange();\n }\n\n onSliderValueChanged(value: number) {\n this.color.opacity = value;\n this.raiseColorChange();\n }\n}\n","<pep-checkbox class=\"checkbox-as-title\" [label]=\"title\" [renderTitle]=\"false\" [value]=\"color.use\" (valueChange)=\"onUseChanged($event)\"></pep-checkbox>\n<pep-color [value]=\"color.value\" [label]=\"title + ' ' + ('COLOR_SETTINGS.COLOR' | translate)\" [disabled]=\"!color.use\" (valueChange)=\"onColorChanged($event)\">\n</pep-color>\n<pep-slider [label]=\"title + ' ' + ('COLOR_SETTINGS.OPACITY' | translate)\" [hint]=\"color.opacity.toString() || ''\" [minValue]=\"0\" [maxValue]=\"100\" [disabled]=\"!color.use\" [value]=\"color.opacity\" \n [background]=\"getSliderBackground()\" (inputChange)=\"onSliderValueChanged($event)\">\n</pep-slider>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { PepNgxLibModule } from '@pepperi-addons/ngx-lib';\nimport { PepColorModule } from '@pepperi-addons/ngx-lib/color';\nimport { PepCheckboxModule } from '@pepperi-addons/ngx-lib/checkbox';\nimport { PepSliderModule } from '@pepperi-addons/ngx-lib/slider';\n\nimport { ColorSettingsComponent } from './color-settings.component';\n\n@NgModule({\n declarations: [\n ColorSettingsComponent\n ],\n imports: [\n CommonModule,\n PepNgxLibModule,\n PepCheckboxModule,\n PepColorModule,\n PepSliderModule\n ],\n exports: [ColorSettingsComponent],\n})\nexport class PepColorSettingsModule { }\n","/*\n * Public API Surface of ngx-composite-lib/color-settings\n */\nexport * from './color-settings.module';\nexport * from './color-settings.component';\nexport * from './color-settings.model';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"pepperi-addons-ngx-composite-lib-color-settings.js","sources":["../../../projects/ngx-composite-lib/color-settings/color-settings.model.ts","../../../projects/ngx-composite-lib/color-settings/color-settings.component.ts","../../../projects/ngx-composite-lib/color-settings/color-settings.component.html","../../../projects/ngx-composite-lib/color-settings/color-settings.module.ts","../../../projects/ngx-composite-lib/color-settings/public-api.ts","../../../projects/ngx-composite-lib/color-settings/pepperi-addons-ngx-composite-lib-color-settings.ts"],"sourcesContent":["export class PepColorSettings {\r\n use = false;\r\n value = 'hsl(0, 0%, 57%)';\r\n opacity = 50;\r\n // useGradientOverlay?: boolean = true;\r\n}","import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';\nimport { PepColorService } from '@pepperi-addons/ngx-lib';\nimport { PepColorSettings } from './color-settings.model';\n\n@Component({\n selector: 'pep-color-settings',\n templateUrl: './color-settings.component.html',\n styleUrls: ['./color-settings.component.scss']\n})\nexport class ColorSettingsComponent implements OnInit {\n\n @Input() title = '';\n\n private _color: PepColorSettings = new PepColorSettings();\n @Input()\n set color(value: PepColorSettings) {\n if (!value) {\n this._color = new PepColorSettings();\n } else {\n this._color = value;\n }\n }\n get color(): PepColorSettings {\n return this._color;\n }\n\n @Output()\n colorChange: EventEmitter<PepColorSettings> = new EventEmitter<PepColorSettings>();\n \n constructor(private pepColorService: PepColorService) { }\n\n ngOnInit() {\n //\n }\n\n private getRGBAcolor(colorObj: PepColorSettings, opac: number | null = null) {\n let rgba = 'rgba(255,255,255,0)';\n\n if (colorObj) {\n const color = colorObj.value;\n let opacity = opac != null ? opac : colorObj.opacity;\n\n opacity = opacity > 0 ? opacity / 100 : 0;\n\n const hsl = this.pepColorService.hslString2hsl(color);\n const rgb = this.pepColorService.hsl2rgb(hsl);\n rgba = 'rgba(' + rgb.r + ',' + rgb.g + ',' + rgb.b + ',' + opacity + ')';\n }\n\n return rgba;\n }\n\n private raiseColorChange() {\n this.colorChange.emit(this.color);\n }\n\n getSliderBackground() {\n const alignTo = 'right';\n \n const colorObj = new PepColorSettings();\n \n colorObj.value = this.color.value;\n colorObj.opacity = 100;\n \n const gradStr = this.getRGBAcolor(colorObj, 0) + ' , ' + this.getRGBAcolor(colorObj);\n \n return 'linear-gradient(to ' + alignTo + ', ' + gradStr + ')';\n }\n\n onUseChanged(value: boolean) {\n this.color.use = value;\n this.raiseColorChange();\n }\n\n onColorChanged(value: string) {\n this.color.value = value;\n this.raiseColorChange();\n }\n \n onSliderInputChanged(value: number) {\n this.color.opacity = value;\n }\n\n onSliderValueChanged(value: number) {\n this.color.opacity = value;\n this.raiseColorChange();\n }\n}\n","<pep-checkbox class=\"checkbox-as-title\" [label]=\"title\" [renderTitle]=\"false\" [value]=\"color.use\" (valueChange)=\"onUseChanged($event)\"></pep-checkbox>\n<pep-color [value]=\"color.value\" [label]=\"title + ' ' + ('COLOR_SETTINGS.COLOR' | translate)\" [disabled]=\"!color.use\" (valueChange)=\"onColorChanged($event)\">\n</pep-color>\n<pep-slider [label]=\"title + ' ' + ('COLOR_SETTINGS.OPACITY' | translate)\" [hint]=\"color.opacity.toString() || ''\" [minValue]=\"0\" [maxValue]=\"100\" [disabled]=\"!color.use\" [value]=\"color.opacity\" \n [background]=\"getSliderBackground()\" (inputChange)=\"onSliderInputChanged($event)\" (valueChange)=\"onSliderValueChanged($event)\">\n</pep-slider>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { PepNgxLibModule } from '@pepperi-addons/ngx-lib';\nimport { PepColorModule } from '@pepperi-addons/ngx-lib/color';\nimport { PepCheckboxModule } from '@pepperi-addons/ngx-lib/checkbox';\nimport { PepSliderModule } from '@pepperi-addons/ngx-lib/slider';\n\nimport { ColorSettingsComponent } from './color-settings.component';\n\n@NgModule({\n declarations: [\n ColorSettingsComponent\n ],\n imports: [\n CommonModule,\n PepNgxLibModule,\n PepCheckboxModule,\n PepColorModule,\n PepSliderModule\n ],\n exports: [ColorSettingsComponent],\n})\nexport class PepColorSettingsModule { }\n","/*\n * Public API Surface of ngx-composite-lib/color-settings\n */\nexport * from './color-settings.module';\nexport * from './color-settings.component';\nexport * from './color-settings.model';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@pepperi-addons/ngx-composite-lib",
3
- "version": "0.0.16-beta.34",
3
+ "version": "0.0.16-beta.35",
4
4
  "peerDependencies": {
5
5
  "@angular/animations": ">= 12.0.0",
6
6
  "@angular/cdk": ">= 12.0.0",