ngx-color 8.0.3 → 10.0.0
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.
- package/README.md +2 -3
- package/alpha/alpha-picker.component.d.ts +1 -1
- package/alpha.component.d.ts +1 -1
- package/block/block-swatches.component.d.ts +1 -1
- package/block/block.component.d.ts +1 -1
- package/checkboard.component.d.ts +1 -1
- package/chrome/chrome-fields.component.d.ts +1 -1
- package/chrome/chrome.component.d.ts +1 -1
- package/circle/circle-swatch.component.d.ts +1 -1
- package/circle/circle.component.d.ts +1 -1
- package/color-wrap.component.d.ts +1 -1
- package/compact/compact-color.component.d.ts +1 -1
- package/compact/compact-fields.component.d.ts +1 -1
- package/compact/compact.component.d.ts +1 -1
- package/coordinates.directive.d.ts +2 -3
- package/editable-input.component.d.ts +1 -1
- package/{fesm2020 → fesm2022}/ngx-color-alpha.mjs +36 -38
- package/fesm2022/ngx-color-alpha.mjs.map +1 -0
- package/fesm2022/ngx-color-block.mjs +233 -0
- package/fesm2022/ngx-color-block.mjs.map +1 -0
- package/fesm2022/ngx-color-chrome.mjs +543 -0
- package/fesm2022/ngx-color-chrome.mjs.map +1 -0
- package/fesm2022/ngx-color-circle.mjs +223 -0
- package/fesm2022/ngx-color-circle.mjs.map +1 -0
- package/fesm2022/ngx-color-compact.mjs +403 -0
- package/fesm2022/ngx-color-compact.mjs.map +1 -0
- package/fesm2022/ngx-color-github.mjs +167 -0
- package/fesm2022/ngx-color-github.mjs.map +1 -0
- package/fesm2022/ngx-color-hue.mjs +109 -0
- package/fesm2022/ngx-color-hue.mjs.map +1 -0
- package/fesm2022/ngx-color-material.mjs +209 -0
- package/fesm2022/ngx-color-material.mjs.map +1 -0
- package/fesm2022/ngx-color-photoshop.mjs +475 -0
- package/fesm2022/ngx-color-photoshop.mjs.map +1 -0
- package/{fesm2015 → fesm2022}/ngx-color-shade.mjs +41 -35
- package/fesm2022/ngx-color-shade.mjs.map +1 -0
- package/fesm2022/ngx-color-sketch.mjs +491 -0
- package/fesm2022/ngx-color-sketch.mjs.map +1 -0
- package/fesm2022/ngx-color-slider.mjs +282 -0
- package/fesm2022/ngx-color-slider.mjs.map +1 -0
- package/fesm2022/ngx-color-swatches.mjs +293 -0
- package/fesm2022/ngx-color-swatches.mjs.map +1 -0
- package/fesm2022/ngx-color-twitter.mjs +169 -0
- package/fesm2022/ngx-color-twitter.mjs.map +1 -0
- package/{fesm2020 → fesm2022}/ngx-color.mjs +348 -264
- package/fesm2022/ngx-color.mjs.map +1 -0
- package/github/github-swatch.component.d.ts +1 -1
- package/github/github.component.d.ts +1 -1
- package/hue/hue-picker.component.d.ts +1 -1
- package/hue.component.d.ts +1 -1
- package/material/material.component.d.ts +1 -1
- package/package.json +29 -84
- package/photoshop/photoshop-button.component.d.ts +1 -1
- package/photoshop/photoshop-fields.component.d.ts +1 -1
- package/photoshop/photoshop-previews.component.d.ts +1 -1
- package/photoshop/photoshop.component.d.ts +1 -1
- package/raised.component.d.ts +2 -2
- package/saturation.component.d.ts +1 -1
- package/shade/shade-picker.component.d.ts +1 -1
- package/shade.component.d.ts +1 -1
- package/sketch/sketch-fields.component.d.ts +1 -1
- package/sketch/sketch-preset-colors.component.d.ts +1 -1
- package/sketch/sketch.component.d.ts +1 -1
- package/slider/slider-swatch.component.d.ts +1 -1
- package/slider/slider-swatches.component.d.ts +1 -1
- package/slider/slider.component.d.ts +1 -1
- package/swatch.component.d.ts +1 -1
- package/swatches/swatches-color.component.d.ts +1 -1
- package/swatches/swatches-group.component.d.ts +1 -1
- package/swatches/swatches.component.d.ts +1 -1
- package/twitter/twitter.component.d.ts +1 -1
- package/esm2020/alpha/alpha-picker.component.mjs +0 -100
- package/esm2020/alpha/ngx-color-alpha.mjs +0 -5
- package/esm2020/alpha/public_api.mjs +0 -2
- package/esm2020/alpha.component.mjs +0 -138
- package/esm2020/block/block-swatches.component.mjs +0 -63
- package/esm2020/block/block.component.mjs +0 -158
- package/esm2020/block/ngx-color-block.mjs +0 -5
- package/esm2020/block/public_api.mjs +0 -3
- package/esm2020/checkboard.component.mjs +0 -50
- package/esm2020/chrome/chrome-fields.component.mjs +0 -314
- package/esm2020/chrome/chrome.component.mjs +0 -184
- package/esm2020/chrome/ngx-color-chrome.mjs +0 -5
- package/esm2020/chrome/public_api.mjs +0 -3
- package/esm2020/circle/circle-swatch.component.mjs +0 -69
- package/esm2020/circle/circle.component.mjs +0 -134
- package/esm2020/circle/ngx-color-circle.mjs +0 -5
- package/esm2020/circle/public_api.mjs +0 -3
- package/esm2020/color-wrap.component.mjs +0 -163
- package/esm2020/compact/compact-color.component.mjs +0 -70
- package/esm2020/compact/compact-fields.component.mjs +0 -164
- package/esm2020/compact/compact.component.mjs +0 -154
- package/esm2020/compact/ngx-color-compact.mjs +0 -5
- package/esm2020/compact/public_api.mjs +0 -4
- package/esm2020/coordinates.directive.mjs +0 -104
- package/esm2020/editable-input.component.mjs +0 -199
- package/esm2020/github/github-swatch.component.mjs +0 -53
- package/esm2020/github/github.component.mjs +0 -112
- package/esm2020/github/ngx-color-github.mjs +0 -5
- package/esm2020/github/public_api.mjs +0 -3
- package/esm2020/helpers/checkboard.mjs +0 -33
- package/esm2020/helpers/color.interfaces.mjs +0 -2
- package/esm2020/helpers/color.mjs +0 -60
- package/esm2020/hue/hue-picker.component.mjs +0 -100
- package/esm2020/hue/ngx-color-hue.mjs +0 -5
- package/esm2020/hue/public_api.mjs +0 -2
- package/esm2020/hue.component.mjs +0 -124
- package/esm2020/material/material.component.mjs +0 -186
- package/esm2020/material/ngx-color-material.mjs +0 -5
- package/esm2020/material/public_api.mjs +0 -2
- package/esm2020/ngx-color.mjs +0 -5
- package/esm2020/photoshop/ngx-color-photoshop.mjs +0 -5
- package/esm2020/photoshop/photoshop-button.component.mjs +0 -34
- package/esm2020/photoshop/photoshop-fields.component.mjs +0 -212
- package/esm2020/photoshop/photoshop-previews.component.mjs +0 -40
- package/esm2020/photoshop/photoshop.component.mjs +0 -185
- package/esm2020/photoshop/public_api.mjs +0 -5
- package/esm2020/public_api.mjs +0 -14
- package/esm2020/raised.component.mjs +0 -50
- package/esm2020/saturation.component.mjs +0 -92
- package/esm2020/shade/ngx-color-shade.mjs +0 -5
- package/esm2020/shade/public_api.mjs +0 -2
- package/esm2020/shade/shade-picker.component.mjs +0 -92
- package/esm2020/shade.component.mjs +0 -125
- package/esm2020/sketch/ngx-color-sketch.mjs +0 -5
- package/esm2020/sketch/public_api.mjs +0 -4
- package/esm2020/sketch/sketch-fields.component.mjs +0 -209
- package/esm2020/sketch/sketch-preset-colors.component.mjs +0 -68
- package/esm2020/sketch/sketch.component.mjs +0 -212
- package/esm2020/slider/ngx-color-slider.mjs +0 -5
- package/esm2020/slider/public_api.mjs +0 -4
- package/esm2020/slider/slider-swatch.component.mjs +0 -52
- package/esm2020/slider/slider-swatches.component.mjs +0 -119
- package/esm2020/slider/slider.component.mjs +0 -102
- package/esm2020/swatch.component.mjs +0 -110
- package/esm2020/swatches/ngx-color-swatches.mjs +0 -5
- package/esm2020/swatches/public_api.mjs +0 -4
- package/esm2020/swatches/swatches-color.component.mjs +0 -104
- package/esm2020/swatches/swatches-group.component.mjs +0 -49
- package/esm2020/swatches/swatches.component.mjs +0 -242
- package/esm2020/twitter/ngx-color-twitter.mjs +0 -5
- package/esm2020/twitter/public_api.mjs +0 -2
- package/esm2020/twitter/twitter.component.mjs +0 -159
- package/fesm2015/ngx-color-alpha.mjs +0 -107
- package/fesm2015/ngx-color-alpha.mjs.map +0 -1
- package/fesm2015/ngx-color-block.mjs +0 -223
- package/fesm2015/ngx-color-block.mjs.map +0 -1
- package/fesm2015/ngx-color-chrome.mjs +0 -499
- package/fesm2015/ngx-color-chrome.mjs.map +0 -1
- package/fesm2015/ngx-color-circle.mjs +0 -207
- package/fesm2015/ngx-color-circle.mjs.map +0 -1
- package/fesm2015/ngx-color-compact.mjs +0 -385
- package/fesm2015/ngx-color-compact.mjs.map +0 -1
- package/fesm2015/ngx-color-github.mjs +0 -169
- package/fesm2015/ngx-color-github.mjs.map +0 -1
- package/fesm2015/ngx-color-hue.mjs +0 -107
- package/fesm2015/ngx-color-hue.mjs.map +0 -1
- package/fesm2015/ngx-color-material.mjs +0 -193
- package/fesm2015/ngx-color-material.mjs.map +0 -1
- package/fesm2015/ngx-color-photoshop.mjs +0 -467
- package/fesm2015/ngx-color-photoshop.mjs.map +0 -1
- package/fesm2015/ngx-color-shade.mjs.map +0 -1
- package/fesm2015/ngx-color-sketch.mjs +0 -485
- package/fesm2015/ngx-color-sketch.mjs.map +0 -1
- package/fesm2015/ngx-color-slider.mjs +0 -273
- package/fesm2015/ngx-color-slider.mjs.map +0 -1
- package/fesm2015/ngx-color-swatches.mjs +0 -391
- package/fesm2015/ngx-color-swatches.mjs.map +0 -1
- package/fesm2015/ngx-color-twitter.mjs +0 -166
- package/fesm2015/ngx-color-twitter.mjs.map +0 -1
- package/fesm2015/ngx-color.mjs +0 -1202
- package/fesm2015/ngx-color.mjs.map +0 -1
- package/fesm2020/ngx-color-alpha.mjs.map +0 -1
- package/fesm2020/ngx-color-block.mjs +0 -223
- package/fesm2020/ngx-color-block.mjs.map +0 -1
- package/fesm2020/ngx-color-chrome.mjs +0 -499
- package/fesm2020/ngx-color-chrome.mjs.map +0 -1
- package/fesm2020/ngx-color-circle.mjs +0 -207
- package/fesm2020/ngx-color-circle.mjs.map +0 -1
- package/fesm2020/ngx-color-compact.mjs +0 -385
- package/fesm2020/ngx-color-compact.mjs.map +0 -1
- package/fesm2020/ngx-color-github.mjs +0 -169
- package/fesm2020/ngx-color-github.mjs.map +0 -1
- package/fesm2020/ngx-color-hue.mjs +0 -107
- package/fesm2020/ngx-color-hue.mjs.map +0 -1
- package/fesm2020/ngx-color-material.mjs +0 -193
- package/fesm2020/ngx-color-material.mjs.map +0 -1
- package/fesm2020/ngx-color-photoshop.mjs +0 -467
- package/fesm2020/ngx-color-photoshop.mjs.map +0 -1
- package/fesm2020/ngx-color-shade.mjs +0 -99
- package/fesm2020/ngx-color-shade.mjs.map +0 -1
- package/fesm2020/ngx-color-sketch.mjs +0 -485
- package/fesm2020/ngx-color-sketch.mjs.map +0 -1
- package/fesm2020/ngx-color-slider.mjs +0 -273
- package/fesm2020/ngx-color-slider.mjs.map +0 -1
- package/fesm2020/ngx-color-swatches.mjs +0 -391
- package/fesm2020/ngx-color-swatches.mjs.map +0 -1
- package/fesm2020/ngx-color-twitter.mjs +0 -166
- package/fesm2020/ngx-color-twitter.mjs.map +0 -1
- package/fesm2020/ngx-color.mjs.map +0 -1
@@ -1,125 +0,0 @@
|
|
1
|
-
import { CommonModule } from '@angular/common';
|
2
|
-
import { ChangeDetectionStrategy, Component, EventEmitter, Input, NgModule, Output, } from '@angular/core';
|
3
|
-
import { CoordinatesModule } from './coordinates.directive';
|
4
|
-
import { TinyColor } from '@ctrl/tinycolor';
|
5
|
-
import * as i0 from "@angular/core";
|
6
|
-
import * as i1 from "@angular/common";
|
7
|
-
import * as i2 from "./coordinates.directive";
|
8
|
-
export class ShadeComponent {
|
9
|
-
constructor() {
|
10
|
-
this.onChange = new EventEmitter();
|
11
|
-
}
|
12
|
-
ngOnChanges() {
|
13
|
-
this.gradient = {
|
14
|
-
background: `linear-gradient(to right,
|
15
|
-
hsl(${this.hsl.h}, 90%, 55%),
|
16
|
-
#000)`,
|
17
|
-
};
|
18
|
-
const hsv = new TinyColor(this.hsl).toHsv();
|
19
|
-
this.pointerLeft = 100 - (hsv.v * 100);
|
20
|
-
}
|
21
|
-
handleChange({ left, containerWidth, $event }) {
|
22
|
-
let data;
|
23
|
-
let v;
|
24
|
-
if (left < 0) {
|
25
|
-
v = 0;
|
26
|
-
}
|
27
|
-
else if (left > containerWidth) {
|
28
|
-
v = 1;
|
29
|
-
}
|
30
|
-
else {
|
31
|
-
v = Math.round((left * 100) / containerWidth) / 100;
|
32
|
-
}
|
33
|
-
const hsv = new TinyColor(this.hsl).toHsv();
|
34
|
-
if (hsv.v !== v) {
|
35
|
-
data = {
|
36
|
-
h: this.hsl.h,
|
37
|
-
s: 100,
|
38
|
-
v: 1 - v,
|
39
|
-
l: this.hsl.l,
|
40
|
-
a: this.hsl.a,
|
41
|
-
source: 'rgb',
|
42
|
-
};
|
43
|
-
}
|
44
|
-
if (!data) {
|
45
|
-
return;
|
46
|
-
}
|
47
|
-
this.onChange.emit({ data, $event });
|
48
|
-
}
|
49
|
-
}
|
50
|
-
ShadeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.2", ngImport: i0, type: ShadeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
51
|
-
ShadeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.2", type: ShadeComponent, selector: "color-shade", inputs: { hsl: "hsl", rgb: "rgb", pointer: "pointer", shadow: "shadow", radius: "radius" }, outputs: { onChange: "onChange" }, usesOnChanges: true, ngImport: i0, template: `
|
52
|
-
<div class="shade" [style.border-radius]="radius">
|
53
|
-
<div
|
54
|
-
class="shade-gradient"
|
55
|
-
[ngStyle]="gradient"
|
56
|
-
[style.box-shadow]="shadow"
|
57
|
-
[style.border-radius]="radius"
|
58
|
-
></div>
|
59
|
-
<div
|
60
|
-
ngx-color-coordinates
|
61
|
-
(coordinatesChange)="handleChange($event)"
|
62
|
-
class="shade-container"
|
63
|
-
>
|
64
|
-
<div
|
65
|
-
class="shade-pointer"
|
66
|
-
[style.left.%]="pointerLeft"
|
67
|
-
[style.top.%]="pointerTop"
|
68
|
-
>
|
69
|
-
<div class="shade-slider" [ngStyle]="pointer"></div>
|
70
|
-
</div>
|
71
|
-
</div>
|
72
|
-
</div>
|
73
|
-
`, isInline: true, styles: [".shade,.shade-gradient{position:absolute;top:0;bottom:0;left:0;right:0}.shade-container{position:relative;height:100%;margin:0 3px}.shade-pointer{position:absolute}.shade-slider{width:4px;border-radius:1px;height:8px;box-shadow:0 0 2px #0009;background:#fff;margin-top:1px;transform:translate(-2px)}\n"], dependencies: [{ kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2.CoordinatesDirective, selector: "[ngx-color-coordinates]", outputs: ["coordinatesChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
74
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.2", ngImport: i0, type: ShadeComponent, decorators: [{
|
75
|
-
type: Component,
|
76
|
-
args: [{ selector: 'color-shade', template: `
|
77
|
-
<div class="shade" [style.border-radius]="radius">
|
78
|
-
<div
|
79
|
-
class="shade-gradient"
|
80
|
-
[ngStyle]="gradient"
|
81
|
-
[style.box-shadow]="shadow"
|
82
|
-
[style.border-radius]="radius"
|
83
|
-
></div>
|
84
|
-
<div
|
85
|
-
ngx-color-coordinates
|
86
|
-
(coordinatesChange)="handleChange($event)"
|
87
|
-
class="shade-container"
|
88
|
-
>
|
89
|
-
<div
|
90
|
-
class="shade-pointer"
|
91
|
-
[style.left.%]="pointerLeft"
|
92
|
-
[style.top.%]="pointerTop"
|
93
|
-
>
|
94
|
-
<div class="shade-slider" [ngStyle]="pointer"></div>
|
95
|
-
</div>
|
96
|
-
</div>
|
97
|
-
</div>
|
98
|
-
`, changeDetection: ChangeDetectionStrategy.OnPush, preserveWhitespaces: false, styles: [".shade,.shade-gradient{position:absolute;top:0;bottom:0;left:0;right:0}.shade-container{position:relative;height:100%;margin:0 3px}.shade-pointer{position:absolute}.shade-slider{width:4px;border-radius:1px;height:8px;box-shadow:0 0 2px #0009;background:#fff;margin-top:1px;transform:translate(-2px)}\n"] }]
|
99
|
-
}], propDecorators: { hsl: [{
|
100
|
-
type: Input
|
101
|
-
}], rgb: [{
|
102
|
-
type: Input
|
103
|
-
}], pointer: [{
|
104
|
-
type: Input
|
105
|
-
}], shadow: [{
|
106
|
-
type: Input
|
107
|
-
}], radius: [{
|
108
|
-
type: Input
|
109
|
-
}], onChange: [{
|
110
|
-
type: Output
|
111
|
-
}] } });
|
112
|
-
export class ShadeModule {
|
113
|
-
}
|
114
|
-
ShadeModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.2", ngImport: i0, type: ShadeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
115
|
-
ShadeModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.1.2", ngImport: i0, type: ShadeModule, declarations: [ShadeComponent], imports: [CommonModule, CoordinatesModule], exports: [ShadeComponent] });
|
116
|
-
ShadeModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.1.2", ngImport: i0, type: ShadeModule, imports: [CommonModule, CoordinatesModule] });
|
117
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.2", ngImport: i0, type: ShadeModule, decorators: [{
|
118
|
-
type: NgModule,
|
119
|
-
args: [{
|
120
|
-
declarations: [ShadeComponent],
|
121
|
-
exports: [ShadeComponent],
|
122
|
-
imports: [CommonModule, CoordinatesModule],
|
123
|
-
}]
|
124
|
-
}] });
|
125
|
-
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2hhZGUuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vc3JjL2xpYi9zaGFkZS5jb21wb25lbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQy9DLE9BQU8sRUFDTCx1QkFBdUIsRUFDdkIsU0FBUyxFQUNULFlBQVksRUFDWixLQUFLLEVBQ0wsUUFBUSxFQUVSLE1BQU0sR0FDUCxNQUFNLGVBQWUsQ0FBQztBQUN2QixPQUFPLEVBQUUsaUJBQWlCLEVBQUUsTUFBTSx5QkFBeUIsQ0FBQztBQUU1RCxPQUFPLEVBQUUsU0FBUyxFQUFFLE1BQU0saUJBQWlCLENBQUM7Ozs7QUFrRTVDLE1BQU0sT0FBTyxjQUFjO0lBL0QzQjtRQXFFWSxhQUFRLEdBQUcsSUFBSSxZQUFZLEVBQU8sQ0FBQztLQTRDOUM7SUF2Q0MsV0FBVztRQUNULElBQUksQ0FBQyxRQUFRLEdBQUc7WUFDZCxVQUFVLEVBQUU7Z0JBQ0YsSUFBSSxDQUFDLEdBQUcsQ0FBQyxDQUFDO2dCQUNWO1NBQ1gsQ0FBQztRQUNGLE1BQU0sR0FBRyxHQUFHLElBQUksU0FBUyxDQUFDLElBQUksQ0FBQyxHQUFHLENBQUMsQ0FBQyxLQUFLLEVBQUUsQ0FBQztRQUM1QyxJQUFJLENBQUMsV0FBVyxHQUFHLEdBQUcsR0FBRyxDQUFDLEdBQUcsQ0FBQyxDQUFDLEdBQUcsR0FBRyxDQUFDLENBQUM7SUFDekMsQ0FBQztJQUVELFlBQVksQ0FBQyxFQUFFLElBQUksRUFBRSxjQUFjLEVBQUUsTUFBTSxFQUFFO1FBQzNDLElBQUksSUFBSSxDQUFDO1FBQ1QsSUFBSSxDQUFTLENBQUM7UUFDZCxJQUFJLElBQUksR0FBRyxDQUFDLEVBQUU7WUFDWixDQUFDLEdBQUcsQ0FBQyxDQUFDO1NBQ1A7YUFBTSxJQUFJLElBQUksR0FBRyxjQUFjLEVBQUU7WUFDaEMsQ0FBQyxHQUFHLENBQUMsQ0FBQztTQUNQO2FBQU07WUFDTCxDQUFDLEdBQUcsSUFBSSxDQUFDLEtBQUssQ0FBQyxDQUFDLElBQUksR0FBRyxHQUFHLENBQUMsR0FBRyxjQUFjLENBQUMsR0FBRyxHQUFHLENBQUM7U0FDckQ7UUFFRCxNQUFNLEdBQUcsR0FBRyxJQUFJLFNBQVMsQ0FBQyxJQUFJLENBQUMsR0FBRyxDQUFDLENBQUMsS0FBSyxFQUFFLENBQUM7UUFDNUMsSUFBSSxHQUFHLENBQUMsQ0FBQyxLQUFLLENBQUMsRUFBRTtZQUNmLElBQUksR0FBRztnQkFDTCxDQUFDLEVBQUUsSUFBSSxDQUFDLEdBQUcsQ0FBQyxDQUFDO2dCQUNiLENBQUMsRUFBRSxHQUFHO2dCQUNOLENBQUMsRUFBRSxDQUFDLEdBQUcsQ0FBQztnQkFDUixDQUFDLEVBQUUsSUFBSSxDQUFDLEdBQUcsQ0FBQyxDQUFDO2dCQUNiLENBQUMsRUFBRSxJQUFJLENBQUMsR0FBRyxDQUFDLENBQUM7Z0JBQ2IsTUFBTSxFQUFFLEtBQUs7YUFDZCxDQUFDO1NBQ0g7UUFFRCxJQUFJLENBQUMsSUFBSSxFQUFFO1lBQ1QsT0FBTztTQUNSO1FBRUQsSUFBSSxDQUFDLFFBQVEsQ0FBQyxJQUFJLENBQUMsRUFBRSxJQUFJLEVBQUUsTUFBTSxFQUFFLENBQUMsQ0FBQztJQUN2QyxDQUFDOzsyR0FqRFUsY0FBYzsrRkFBZCxjQUFjLHVNQTdEZjs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7OztHQXNCVDsyRkF1Q1UsY0FBYztrQkEvRDFCLFNBQVM7K0JBQ0UsYUFBYSxZQUNiOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7O0dBc0JULG1CQW9DZ0IsdUJBQXVCLENBQUMsTUFBTSx1QkFDMUIsS0FBSzs4QkFHakIsR0FBRztzQkFBWCxLQUFLO2dCQUNHLEdBQUc7c0JBQVgsS0FBSztnQkFDRyxPQUFPO3NCQUFmLEtBQUs7Z0JBQ0csTUFBTTtzQkFBZCxLQUFLO2dCQUNHLE1BQU07c0JBQWQsS0FBSztnQkFDSSxRQUFRO3NCQUFqQixNQUFNOztBQW1EVCxNQUFNLE9BQU8sV0FBVzs7d0dBQVgsV0FBVzt5R0FBWCxXQUFXLGlCQXpEWCxjQUFjLGFBdURmLFlBQVksRUFBRSxpQkFBaUIsYUF2RDlCLGNBQWM7eUdBeURkLFdBQVcsWUFGWixZQUFZLEVBQUUsaUJBQWlCOzJGQUU5QixXQUFXO2tCQUx2QixRQUFRO21CQUFDO29CQUNSLFlBQVksRUFBRSxDQUFDLGNBQWMsQ0FBQztvQkFDOUIsT0FBTyxFQUFFLENBQUMsY0FBYyxDQUFDO29CQUN6QixPQUFPLEVBQUUsQ0FBQyxZQUFZLEVBQUUsaUJBQWlCLENBQUM7aUJBQzNDIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tbW9uTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvY29tbW9uJztcbmltcG9ydCB7XG4gIENoYW5nZURldGVjdGlvblN0cmF0ZWd5LFxuICBDb21wb25lbnQsXG4gIEV2ZW50RW1pdHRlcixcbiAgSW5wdXQsXG4gIE5nTW9kdWxlLFxuICBPbkNoYW5nZXMsXG4gIE91dHB1dCxcbn0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBDb29yZGluYXRlc01vZHVsZSB9IGZyb20gJy4vY29vcmRpbmF0ZXMuZGlyZWN0aXZlJztcbmltcG9ydCB7IEhTTEEsIFJHQkEgfSBmcm9tICcuL2hlbHBlcnMvY29sb3IuaW50ZXJmYWNlcyc7XG5pbXBvcnQgeyBUaW55Q29sb3IgfSBmcm9tICdAY3RybC90aW55Y29sb3InO1xuXG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ2NvbG9yLXNoYWRlJyxcbiAgdGVtcGxhdGU6IGBcbiAgICA8ZGl2IGNsYXNzPVwic2hhZGVcIiBbc3R5bGUuYm9yZGVyLXJhZGl1c109XCJyYWRpdXNcIj5cbiAgICAgIDxkaXZcbiAgICAgICAgY2xhc3M9XCJzaGFkZS1ncmFkaWVudFwiXG4gICAgICAgIFtuZ1N0eWxlXT1cImdyYWRpZW50XCJcbiAgICAgICAgW3N0eWxlLmJveC1zaGFkb3ddPVwic2hhZG93XCJcbiAgICAgICAgW3N0eWxlLmJvcmRlci1yYWRpdXNdPVwicmFkaXVzXCJcbiAgICAgID48L2Rpdj5cbiAgICAgIDxkaXZcbiAgICAgICAgbmd4LWNvbG9yLWNvb3JkaW5hdGVzXG4gICAgICAgIChjb29yZGluYXRlc0NoYW5nZSk9XCJoYW5kbGVDaGFuZ2UoJGV2ZW50KVwiXG4gICAgICAgIGNsYXNzPVwic2hhZGUtY29udGFpbmVyXCJcbiAgICAgID5cbiAgICAgICAgPGRpdlxuICAgICAgICAgIGNsYXNzPVwic2hhZGUtcG9pbnRlclwiXG4gICAgICAgICAgW3N0eWxlLmxlZnQuJV09XCJwb2ludGVyTGVmdFwiXG4gICAgICAgICAgW3N0eWxlLnRvcC4lXT1cInBvaW50ZXJUb3BcIlxuICAgICAgICA+XG4gICAgICAgICAgPGRpdiBjbGFzcz1cInNoYWRlLXNsaWRlclwiIFtuZ1N0eWxlXT1cInBvaW50ZXJcIj48L2Rpdj5cbiAgICAgICAgPC9kaXY+XG4gICAgICA8L2Rpdj5cbiAgICA8L2Rpdj5cbiAgYCxcbiAgc3R5bGVzOiBbXG4gICAgYFxuICAgIC5zaGFkZSB7XG4gICAgICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gICAgICB0b3A6IDA7XG4gICAgICBib3R0b206IDA7XG4gICAgICBsZWZ0OiAwO1xuICAgICAgcmlnaHQ6IDA7XG4gICAgfVxuICAgIC5zaGFkZS1ncmFkaWVudCB7XG4gICAgICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gICAgICB0b3A6IDA7XG4gICAgICBib3R0b206IDA7XG4gICAgICBsZWZ0OiAwO1xuICAgICAgcmlnaHQ6IDA7XG4gICAgfVxuICAgIC5zaGFkZS1jb250YWluZXIge1xuICAgICAgcG9zaXRpb246IHJlbGF0aXZlO1xuICAgICAgaGVpZ2h0OiAxMDAlO1xuICAgICAgbWFyZ2luOiAwIDNweDtcbiAgICB9XG4gICAgLnNoYWRlLXBvaW50ZXIge1xuICAgICAgcG9zaXRpb246IGFic29sdXRlO1xuICAgIH1cbiAgICAuc2hhZGUtc2xpZGVyIHtcbiAgICAgIHdpZHRoOiA0cHg7XG4gICAgICBib3JkZXItcmFkaXVzOiAxcHg7XG4gICAgICBoZWlnaHQ6IDhweDtcbiAgICAgIGJveC1zaGFkb3c6IDAgMCAycHggcmdiYSgwLCAwLCAwLCAuNik7XG4gICAgICBiYWNrZ3JvdW5kOiAjZmZmO1xuICAgICAgbWFyZ2luLXRvcDogMXB4O1xuICAgICAgdHJhbnNmb3JtOiB0cmFuc2xhdGVYKC0ycHgpO1xuICAgIH1cbiAgYCxcbiAgXSxcbiAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXG4gIHByZXNlcnZlV2hpdGVzcGFjZXM6IGZhbHNlLFxufSlcbmV4cG9ydCBjbGFzcyBTaGFkZUNvbXBvbmVudCBpbXBsZW1lbnRzIE9uQ2hhbmdlcyB7XG4gIEBJbnB1dCgpIGhzbCE6IEhTTEE7XG4gIEBJbnB1dCgpIHJnYiE6IFJHQkE7XG4gIEBJbnB1dCgpIHBvaW50ZXIhOiBSZWNvcmQ8c3RyaW5nLCBzdHJpbmc+O1xuICBASW5wdXQoKSBzaGFkb3chOiBzdHJpbmc7XG4gIEBJbnB1dCgpIHJhZGl1cyE6IHN0cmluZztcbiAgQE91dHB1dCgpIG9uQ2hhbmdlID0gbmV3IEV2ZW50RW1pdHRlcjxhbnk+KCk7XG4gIGdyYWRpZW50ITogUmVjb3JkPHN0cmluZywgc3RyaW5nPjtcbiAgcG9pbnRlckxlZnQhOiBudW1iZXI7XG4gIHBvaW50ZXJUb3A/OiBudW1iZXI7XG5cbiAgbmdPbkNoYW5nZXMoKSB7XG4gICAgdGhpcy5ncmFkaWVudCA9IHtcbiAgICAgIGJhY2tncm91bmQ6IGBsaW5lYXItZ3JhZGllbnQodG8gcmlnaHQsXG4gICAgICAgICAgaHNsKCR7dGhpcy5oc2wuaH0sIDkwJSwgNTUlKSxcbiAgICAgICAgICAjMDAwKWAsXG4gICAgfTtcbiAgICBjb25zdCBoc3YgPSBuZXcgVGlueUNvbG9yKHRoaXMuaHNsKS50b0hzdigpO1xuICAgIHRoaXMucG9pbnRlckxlZnQgPSAxMDAgLSAoaHN2LnYgKiAxMDApO1xuICB9XG5cbiAgaGFuZGxlQ2hhbmdlKHsgbGVmdCwgY29udGFpbmVyV2lkdGgsICRldmVudCB9KTogdm9pZCB7XG4gICAgbGV0IGRhdGE7XG4gICAgbGV0IHY6IG51bWJlcjtcbiAgICBpZiAobGVmdCA8IDApIHtcbiAgICAgIHYgPSAwO1xuICAgIH0gZWxzZSBpZiAobGVmdCA+IGNvbnRhaW5lcldpZHRoKSB7XG4gICAgICB2ID0gMTtcbiAgICB9IGVsc2Uge1xuICAgICAgdiA9IE1hdGgucm91bmQoKGxlZnQgKiAxMDApIC8gY29udGFpbmVyV2lkdGgpIC8gMTAwO1xuICAgIH1cblxuICAgIGNvbnN0IGhzdiA9IG5ldyBUaW55Q29sb3IodGhpcy5oc2wpLnRvSHN2KCk7XG4gICAgaWYgKGhzdi52ICE9PSB2KSB7XG4gICAgICBkYXRhID0ge1xuICAgICAgICBoOiB0aGlzLmhzbC5oLFxuICAgICAgICBzOiAxMDAsXG4gICAgICAgIHY6IDEgLSB2LFxuICAgICAgICBsOiB0aGlzLmhzbC5sLFxuICAgICAgICBhOiB0aGlzLmhzbC5hLFxuICAgICAgICBzb3VyY2U6ICdyZ2InLFxuICAgICAgfTtcbiAgICB9XG5cbiAgICBpZiAoIWRhdGEpIHtcbiAgICAgIHJldHVybjtcbiAgICB9XG5cbiAgICB0aGlzLm9uQ2hhbmdlLmVtaXQoeyBkYXRhLCAkZXZlbnQgfSk7XG4gIH1cbn1cblxuQE5nTW9kdWxlKHtcbiAgZGVjbGFyYXRpb25zOiBbU2hhZGVDb21wb25lbnRdLFxuICBleHBvcnRzOiBbU2hhZGVDb21wb25lbnRdLFxuICBpbXBvcnRzOiBbQ29tbW9uTW9kdWxlLCBDb29yZGluYXRlc01vZHVsZV0sXG59KVxuZXhwb3J0IGNsYXNzIFNoYWRlTW9kdWxlIHt9XG4iXX0=
|
@@ -1,5 +0,0 @@
|
|
1
|
-
/**
|
2
|
-
* Generated bundle index. Do not edit.
|
3
|
-
*/
|
4
|
-
export * from './public_api';
|
5
|
-
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibmd4LWNvbG9yLXNrZXRjaC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9saWIvc2tldGNoL25neC1jb2xvci1za2V0Y2gudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUE7O0dBRUc7QUFFSCxjQUFjLGNBQWMsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogR2VuZXJhdGVkIGJ1bmRsZSBpbmRleC4gRG8gbm90IGVkaXQuXG4gKi9cblxuZXhwb3J0ICogZnJvbSAnLi9wdWJsaWNfYXBpJztcbiJdfQ==
|
@@ -1,4 +0,0 @@
|
|
1
|
-
export { SketchFieldsComponent } from './sketch-fields.component';
|
2
|
-
export { SketchPresetColorsComponent } from './sketch-preset-colors.component';
|
3
|
-
export { ColorSketchModule, SketchComponent } from './sketch.component';
|
4
|
-
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHVibGljX2FwaS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9saWIvc2tldGNoL3B1YmxpY19hcGkudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLHFCQUFxQixFQUFFLE1BQU0sMkJBQTJCLENBQUM7QUFDbEUsT0FBTyxFQUFFLDJCQUEyQixFQUFFLE1BQU0sa0NBQWtDLENBQUM7QUFDL0UsT0FBTyxFQUFFLGlCQUFpQixFQUFFLGVBQWUsRUFBRSxNQUFNLG9CQUFvQixDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiZXhwb3J0IHsgU2tldGNoRmllbGRzQ29tcG9uZW50IH0gZnJvbSAnLi9za2V0Y2gtZmllbGRzLmNvbXBvbmVudCc7XG5leHBvcnQgeyBTa2V0Y2hQcmVzZXRDb2xvcnNDb21wb25lbnQgfSBmcm9tICcuL3NrZXRjaC1wcmVzZXQtY29sb3JzLmNvbXBvbmVudCc7XG5leHBvcnQgeyBDb2xvclNrZXRjaE1vZHVsZSwgU2tldGNoQ29tcG9uZW50IH0gZnJvbSAnLi9za2V0Y2guY29tcG9uZW50JztcbiJdfQ==
|
@@ -1,209 +0,0 @@
|
|
1
|
-
import { ChangeDetectionStrategy, Component, EventEmitter, Input, Output, } from '@angular/core';
|
2
|
-
import { isValidHex } from 'ngx-color';
|
3
|
-
import { TinyColor } from '@ctrl/tinycolor';
|
4
|
-
import * as i0 from "@angular/core";
|
5
|
-
import * as i1 from "@angular/common";
|
6
|
-
import * as i2 from "ngx-color";
|
7
|
-
export class SketchFieldsComponent {
|
8
|
-
constructor() {
|
9
|
-
this.disableAlpha = false;
|
10
|
-
this.onChange = new EventEmitter();
|
11
|
-
this.input = {
|
12
|
-
width: '100%',
|
13
|
-
padding: '4px 10% 3px',
|
14
|
-
border: 'none',
|
15
|
-
boxSizing: 'border-box',
|
16
|
-
boxShadow: 'inset 0 0 0 1px #ccc',
|
17
|
-
fontSize: '11px',
|
18
|
-
};
|
19
|
-
this.label = {
|
20
|
-
display: 'block',
|
21
|
-
textAlign: 'center',
|
22
|
-
fontSize: '11px',
|
23
|
-
color: '#222',
|
24
|
-
paddingTop: '3px',
|
25
|
-
paddingBottom: '4px',
|
26
|
-
textTransform: 'capitalize',
|
27
|
-
};
|
28
|
-
}
|
29
|
-
round(value) {
|
30
|
-
return Math.round(value);
|
31
|
-
}
|
32
|
-
handleChange({ data, $event }) {
|
33
|
-
if (data.hex) {
|
34
|
-
if (isValidHex(data.hex)) {
|
35
|
-
const color = new TinyColor(data.hex);
|
36
|
-
this.onChange.emit({
|
37
|
-
data: {
|
38
|
-
hex: this.disableAlpha || data.hex.length <= 6 ? color.toHex() : color.toHex8(),
|
39
|
-
source: 'hex',
|
40
|
-
},
|
41
|
-
$event,
|
42
|
-
});
|
43
|
-
}
|
44
|
-
}
|
45
|
-
else if (data.r || data.g || data.b) {
|
46
|
-
this.onChange.emit({
|
47
|
-
data: {
|
48
|
-
r: data.r || this.rgb.r,
|
49
|
-
g: data.g || this.rgb.g,
|
50
|
-
b: data.b || this.rgb.b,
|
51
|
-
source: 'rgb',
|
52
|
-
},
|
53
|
-
$event,
|
54
|
-
});
|
55
|
-
}
|
56
|
-
else if (data.a) {
|
57
|
-
if (data.a < 0) {
|
58
|
-
data.a = 0;
|
59
|
-
}
|
60
|
-
else if (data.a > 100) {
|
61
|
-
data.a = 100;
|
62
|
-
}
|
63
|
-
data.a /= 100;
|
64
|
-
if (this.disableAlpha) {
|
65
|
-
data.a = 1;
|
66
|
-
}
|
67
|
-
this.onChange.emit({
|
68
|
-
data: {
|
69
|
-
h: this.hsl.h,
|
70
|
-
s: this.hsl.s,
|
71
|
-
l: this.hsl.l,
|
72
|
-
a: Math.round(data.a * 100) / 100,
|
73
|
-
source: 'rgb',
|
74
|
-
},
|
75
|
-
$event,
|
76
|
-
});
|
77
|
-
}
|
78
|
-
else if (data.h || data.s || data.l) {
|
79
|
-
this.onChange.emit({
|
80
|
-
data: {
|
81
|
-
h: data.h || this.hsl.h,
|
82
|
-
s: Number((data.s && data.s) || this.hsl.s),
|
83
|
-
l: Number((data.l && data.l) || this.hsl.l),
|
84
|
-
source: 'hsl',
|
85
|
-
},
|
86
|
-
$event,
|
87
|
-
});
|
88
|
-
}
|
89
|
-
}
|
90
|
-
}
|
91
|
-
SketchFieldsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.2", ngImport: i0, type: SketchFieldsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
92
|
-
SketchFieldsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.2", type: SketchFieldsComponent, selector: "color-sketch-fields", inputs: { hsl: "hsl", rgb: "rgb", hex: "hex", disableAlpha: "disableAlpha" }, outputs: { onChange: "onChange" }, ngImport: i0, template: `
|
93
|
-
<div class="sketch-fields">
|
94
|
-
<div class="sketch-double">
|
95
|
-
<color-editable-input
|
96
|
-
[style]="{ input: input, label: label }"
|
97
|
-
label="hex"
|
98
|
-
[value]="hex.replace('#', '')"
|
99
|
-
(onChange)="handleChange($event)"
|
100
|
-
></color-editable-input>
|
101
|
-
</div>
|
102
|
-
<div class="sketch-single">
|
103
|
-
<color-editable-input
|
104
|
-
[style]="{ input: input, label: label }"
|
105
|
-
label="r"
|
106
|
-
[value]="rgb.r"
|
107
|
-
(onChange)="handleChange($event)"
|
108
|
-
[dragLabel]="true"
|
109
|
-
[dragMax]="255"
|
110
|
-
></color-editable-input>
|
111
|
-
</div>
|
112
|
-
<div class="sketch-single">
|
113
|
-
<color-editable-input
|
114
|
-
[style]="{ input: input, label: label }"
|
115
|
-
label="g"
|
116
|
-
[value]="rgb.g"
|
117
|
-
(onChange)="handleChange($event)"
|
118
|
-
[dragLabel]="true"
|
119
|
-
[dragMax]="255"
|
120
|
-
></color-editable-input>
|
121
|
-
</div>
|
122
|
-
<div class="sketch-single">
|
123
|
-
<color-editable-input
|
124
|
-
[style]="{ input: input, label: label }"
|
125
|
-
label="b"
|
126
|
-
[value]="rgb.b"
|
127
|
-
(onChange)="handleChange($event)"
|
128
|
-
[dragLabel]="true"
|
129
|
-
[dragMax]="255"
|
130
|
-
></color-editable-input>
|
131
|
-
</div>
|
132
|
-
<div class="sketch-alpha" *ngIf="disableAlpha === false">
|
133
|
-
<color-editable-input
|
134
|
-
[style]="{ input: input, label: label }"
|
135
|
-
label="a"
|
136
|
-
[value]="round(rgb.a * 100)"
|
137
|
-
(onChange)="handleChange($event)"
|
138
|
-
[dragLabel]="true"
|
139
|
-
[dragMax]="100"
|
140
|
-
></color-editable-input>
|
141
|
-
</div>
|
142
|
-
</div>
|
143
|
-
`, isInline: true, styles: [".sketch-fields{display:flex;padding-top:4px}.sketch-double{flex:2 1 0%}.sketch-single,.sketch-alpha{flex:1 1 0%;padding-left:6px}:host-context([dir=rtl]) .sketch-single{padding-right:6px;padding-left:0}:host-context([dir=rtl]) .sketch-alpha{padding-right:6px;padding-left:0}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.EditableInputComponent, selector: "color-editable-input", inputs: ["style", "label", "value", "arrowOffset", "dragLabel", "dragMax", "placeholder"], outputs: ["onChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
144
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.2", ngImport: i0, type: SketchFieldsComponent, decorators: [{
|
145
|
-
type: Component,
|
146
|
-
args: [{ selector: 'color-sketch-fields', template: `
|
147
|
-
<div class="sketch-fields">
|
148
|
-
<div class="sketch-double">
|
149
|
-
<color-editable-input
|
150
|
-
[style]="{ input: input, label: label }"
|
151
|
-
label="hex"
|
152
|
-
[value]="hex.replace('#', '')"
|
153
|
-
(onChange)="handleChange($event)"
|
154
|
-
></color-editable-input>
|
155
|
-
</div>
|
156
|
-
<div class="sketch-single">
|
157
|
-
<color-editable-input
|
158
|
-
[style]="{ input: input, label: label }"
|
159
|
-
label="r"
|
160
|
-
[value]="rgb.r"
|
161
|
-
(onChange)="handleChange($event)"
|
162
|
-
[dragLabel]="true"
|
163
|
-
[dragMax]="255"
|
164
|
-
></color-editable-input>
|
165
|
-
</div>
|
166
|
-
<div class="sketch-single">
|
167
|
-
<color-editable-input
|
168
|
-
[style]="{ input: input, label: label }"
|
169
|
-
label="g"
|
170
|
-
[value]="rgb.g"
|
171
|
-
(onChange)="handleChange($event)"
|
172
|
-
[dragLabel]="true"
|
173
|
-
[dragMax]="255"
|
174
|
-
></color-editable-input>
|
175
|
-
</div>
|
176
|
-
<div class="sketch-single">
|
177
|
-
<color-editable-input
|
178
|
-
[style]="{ input: input, label: label }"
|
179
|
-
label="b"
|
180
|
-
[value]="rgb.b"
|
181
|
-
(onChange)="handleChange($event)"
|
182
|
-
[dragLabel]="true"
|
183
|
-
[dragMax]="255"
|
184
|
-
></color-editable-input>
|
185
|
-
</div>
|
186
|
-
<div class="sketch-alpha" *ngIf="disableAlpha === false">
|
187
|
-
<color-editable-input
|
188
|
-
[style]="{ input: input, label: label }"
|
189
|
-
label="a"
|
190
|
-
[value]="round(rgb.a * 100)"
|
191
|
-
(onChange)="handleChange($event)"
|
192
|
-
[dragLabel]="true"
|
193
|
-
[dragMax]="100"
|
194
|
-
></color-editable-input>
|
195
|
-
</div>
|
196
|
-
</div>
|
197
|
-
`, changeDetection: ChangeDetectionStrategy.OnPush, preserveWhitespaces: false, styles: [".sketch-fields{display:flex;padding-top:4px}.sketch-double{flex:2 1 0%}.sketch-single,.sketch-alpha{flex:1 1 0%;padding-left:6px}:host-context([dir=rtl]) .sketch-single{padding-right:6px;padding-left:0}:host-context([dir=rtl]) .sketch-alpha{padding-right:6px;padding-left:0}\n"] }]
|
198
|
-
}], propDecorators: { hsl: [{
|
199
|
-
type: Input
|
200
|
-
}], rgb: [{
|
201
|
-
type: Input
|
202
|
-
}], hex: [{
|
203
|
-
type: Input
|
204
|
-
}], disableAlpha: [{
|
205
|
-
type: Input
|
206
|
-
}], onChange: [{
|
207
|
-
type: Output
|
208
|
-
}] } });
|
209
|
-
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2tldGNoLWZpZWxkcy5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9zcmMvbGliL3NrZXRjaC9za2V0Y2gtZmllbGRzLmNvbXBvbmVudC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQ0wsdUJBQXVCLEVBQ3ZCLFNBQVMsRUFDVCxZQUFZLEVBQ1osS0FBSyxFQUNMLE1BQU0sR0FDUCxNQUFNLGVBQWUsQ0FBQztBQUV2QixPQUFPLEVBQUUsVUFBVSxFQUFjLE1BQU0sV0FBVyxDQUFDO0FBQ25ELE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQzs7OztBQXdGNUMsTUFBTSxPQUFPLHFCQUFxQjtJQXRGbEM7UUEwRlcsaUJBQVksR0FBRyxLQUFLLENBQUM7UUFDcEIsYUFBUSxHQUFHLElBQUksWUFBWSxFQUFPLENBQUM7UUFDN0MsVUFBSyxHQUE0QjtZQUMvQixLQUFLLEVBQUUsTUFBTTtZQUNiLE9BQU8sRUFBRSxhQUFhO1lBQ3RCLE1BQU0sRUFBRSxNQUFNO1lBQ2QsU0FBUyxFQUFFLFlBQVk7WUFDdkIsU0FBUyxFQUFFLHNCQUFzQjtZQUNqQyxRQUFRLEVBQUUsTUFBTTtTQUNqQixDQUFDO1FBQ0YsVUFBSyxHQUE0QjtZQUMvQixPQUFPLEVBQUUsT0FBTztZQUNoQixTQUFTLEVBQUUsUUFBUTtZQUNuQixRQUFRLEVBQUUsTUFBTTtZQUNoQixLQUFLLEVBQUUsTUFBTTtZQUNiLFVBQVUsRUFBRSxLQUFLO1lBQ2pCLGFBQWEsRUFBRSxLQUFLO1lBQ3BCLGFBQWEsRUFBRSxZQUFZO1NBQzVCLENBQUM7S0E2REg7SUEzREMsS0FBSyxDQUFDLEtBQUs7UUFDVCxPQUFPLElBQUksQ0FBQyxLQUFLLENBQUMsS0FBSyxDQUFDLENBQUM7SUFDM0IsQ0FBQztJQUNELFlBQVksQ0FBQyxFQUFFLElBQUksRUFBRSxNQUFNLEVBQUU7UUFDM0IsSUFBSSxJQUFJLENBQUMsR0FBRyxFQUFFO1lBQ1osSUFBSSxVQUFVLENBQUMsSUFBSSxDQUFDLEdBQUcsQ0FBQyxFQUFFO2dCQUN4QixNQUFNLEtBQUssR0FBRyxJQUFJLFNBQVMsQ0FBQyxJQUFJLENBQUMsR0FBRyxDQUFDLENBQUM7Z0JBQ3RDLElBQUksQ0FBQyxRQUFRLENBQUMsSUFBSSxDQUFDO29CQUNqQixJQUFJLEVBQUU7d0JBQ0osR0FBRyxFQUFFLElBQUksQ0FBQyxZQUFZLElBQUksSUFBSSxDQUFDLEdBQUcsQ0FBQyxNQUFNLElBQUksQ0FBQyxDQUFDLENBQUMsQ0FBQyxLQUFLLENBQUMsS0FBSyxFQUFFLENBQUMsQ0FBQyxDQUFDLEtBQUssQ0FBQyxNQUFNLEVBQUU7d0JBQy9FLE1BQU0sRUFBRSxLQUFLO3FCQUNkO29CQUNELE1BQU07aUJBQ1AsQ0FBQyxDQUFDO2FBQ0o7U0FDRjthQUFNLElBQUksSUFBSSxDQUFDLENBQUMsSUFBSSxJQUFJLENBQUMsQ0FBQyxJQUFJLElBQUksQ0FBQyxDQUFDLEVBQUU7WUFDckMsSUFBSSxDQUFDLFFBQVEsQ0FBQyxJQUFJLENBQUM7Z0JBQ2pCLElBQUksRUFBRTtvQkFDSixDQUFDLEVBQUUsSUFBSSxDQUFDLENBQUMsSUFBSSxJQUFJLENBQUMsR0FBRyxDQUFDLENBQUM7b0JBQ3ZCLENBQUMsRUFBRSxJQUFJLENBQUMsQ0FBQyxJQUFJLElBQUksQ0FBQyxHQUFHLENBQUMsQ0FBQztvQkFDdkIsQ0FBQyxFQUFFLElBQUksQ0FBQyxDQUFDLElBQUksSUFBSSxDQUFDLEdBQUcsQ0FBQyxDQUFDO29CQUN2QixNQUFNLEVBQUUsS0FBSztpQkFDZDtnQkFDRCxNQUFNO2FBQ1AsQ0FBQyxDQUFDO1NBQ0o7YUFBTSxJQUFJLElBQUksQ0FBQyxDQUFDLEVBQUU7WUFDakIsSUFBSSxJQUFJLENBQUMsQ0FBQyxHQUFHLENBQUMsRUFBRTtnQkFDZCxJQUFJLENBQUMsQ0FBQyxHQUFHLENBQUMsQ0FBQzthQUNaO2lCQUFNLElBQUksSUFBSSxDQUFDLENBQUMsR0FBRyxHQUFHLEVBQUU7Z0JBQ3ZCLElBQUksQ0FBQyxDQUFDLEdBQUcsR0FBRyxDQUFDO2FBQ2Q7WUFDRCxJQUFJLENBQUMsQ0FBQyxJQUFJLEdBQUcsQ0FBQztZQUVkLElBQUksSUFBSSxDQUFDLFlBQVksRUFBRTtnQkFDckIsSUFBSSxDQUFDLENBQUMsR0FBRyxDQUFDLENBQUM7YUFDWjtZQUVELElBQUksQ0FBQyxRQUFRLENBQUMsSUFBSSxDQUFDO2dCQUNqQixJQUFJLEVBQUU7b0JBQ0osQ0FBQyxFQUFFLElBQUksQ0FBQyxHQUFHLENBQUMsQ0FBQztvQkFDYixDQUFDLEVBQUUsSUFBSSxDQUFDLEdBQUcsQ0FBQyxDQUFDO29CQUNiLENBQUMsRUFBRSxJQUFJLENBQUMsR0FBRyxDQUFDLENBQUM7b0JBQ2IsQ0FBQyxFQUFFLElBQUksQ0FBQyxLQUFLLENBQUMsSUFBSSxDQUFDLENBQUMsR0FBRyxHQUFHLENBQUMsR0FBRyxHQUFHO29CQUNqQyxNQUFNLEVBQUUsS0FBSztpQkFDZDtnQkFDRCxNQUFNO2FBQ1AsQ0FBQyxDQUFDO1NBQ0o7YUFBTSxJQUFJLElBQUksQ0FBQyxDQUFDLElBQUksSUFBSSxDQUFDLENBQUMsSUFBSSxJQUFJLENBQUMsQ0FBQyxFQUFFO1lBQ3JDLElBQUksQ0FBQyxRQUFRLENBQUMsSUFBSSxDQUFDO2dCQUNqQixJQUFJLEVBQUU7b0JBQ0osQ0FBQyxFQUFFLElBQUksQ0FBQyxDQUFDLElBQUksSUFBSSxDQUFDLEdBQUcsQ0FBQyxDQUFDO29CQUN2QixDQUFDLEVBQUUsTUFBTSxDQUFDLENBQUMsSUFBSSxDQUFDLENBQUMsSUFBSSxJQUFJLENBQUMsQ0FBQyxDQUFDLElBQUksSUFBSSxDQUFDLEdBQUcsQ0FBQyxDQUFDLENBQUM7b0JBQzNDLENBQUMsRUFBRSxNQUFNLENBQUMsQ0FBQyxJQUFJLENBQUMsQ0FBQyxJQUFJLElBQUksQ0FBQyxDQUFDLENBQUMsSUFBSSxJQUFJLENBQUMsR0FBRyxDQUFDLENBQUMsQ0FBQztvQkFDM0MsTUFBTSxFQUFFLEtBQUs7aUJBQ2Q7Z0JBQ0QsTUFBTTthQUNQLENBQUMsQ0FBQztTQUNKO0lBQ0gsQ0FBQzs7a0hBbEZVLHFCQUFxQjtzR0FBckIscUJBQXFCLDRLQXBGdEI7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7OztHQW1EVDsyRkFpQ1UscUJBQXFCO2tCQXRGakMsU0FBUzsrQkFDRSxxQkFBcUIsWUFDckI7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7OztHQW1EVCxtQkE4QmdCLHVCQUF1QixDQUFDLE1BQU0sdUJBQzFCLEtBQUs7OEJBR2pCLEdBQUc7c0JBQVgsS0FBSztnQkFDRyxHQUFHO3NCQUFYLEtBQUs7Z0JBQ0csR0FBRztzQkFBWCxLQUFLO2dCQUNHLFlBQVk7c0JBQXBCLEtBQUs7Z0JBQ0ksUUFBUTtzQkFBakIsTUFBTSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7XG4gIENoYW5nZURldGVjdGlvblN0cmF0ZWd5LFxuICBDb21wb25lbnQsXG4gIEV2ZW50RW1pdHRlcixcbiAgSW5wdXQsXG4gIE91dHB1dCxcbn0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbmltcG9ydCB7IGlzVmFsaWRIZXgsIEhTTEEsIFJHQkEgfSBmcm9tICduZ3gtY29sb3InO1xuaW1wb3J0IHsgVGlueUNvbG9yIH0gZnJvbSAnQGN0cmwvdGlueWNvbG9yJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnY29sb3Itc2tldGNoLWZpZWxkcycsXG4gIHRlbXBsYXRlOiBgXG4gIDxkaXYgY2xhc3M9XCJza2V0Y2gtZmllbGRzXCI+XG4gICAgPGRpdiBjbGFzcz1cInNrZXRjaC1kb3VibGVcIj5cbiAgICAgIDxjb2xvci1lZGl0YWJsZS1pbnB1dFxuICAgICAgICBbc3R5bGVdPVwieyBpbnB1dDogaW5wdXQsIGxhYmVsOiBsYWJlbCB9XCJcbiAgICAgICAgbGFiZWw9XCJoZXhcIlxuICAgICAgICBbdmFsdWVdPVwiaGV4LnJlcGxhY2UoJyMnLCAnJylcIlxuICAgICAgICAob25DaGFuZ2UpPVwiaGFuZGxlQ2hhbmdlKCRldmVudClcIlxuICAgICAgPjwvY29sb3ItZWRpdGFibGUtaW5wdXQ+XG4gICAgPC9kaXY+XG4gICAgPGRpdiBjbGFzcz1cInNrZXRjaC1zaW5nbGVcIj5cbiAgICAgIDxjb2xvci1lZGl0YWJsZS1pbnB1dFxuICAgICAgICBbc3R5bGVdPVwieyBpbnB1dDogaW5wdXQsIGxhYmVsOiBsYWJlbCB9XCJcbiAgICAgICAgbGFiZWw9XCJyXCJcbiAgICAgICAgW3ZhbHVlXT1cInJnYi5yXCJcbiAgICAgICAgKG9uQ2hhbmdlKT1cImhhbmRsZUNoYW5nZSgkZXZlbnQpXCJcbiAgICAgICAgW2RyYWdMYWJlbF09XCJ0cnVlXCJcbiAgICAgICAgW2RyYWdNYXhdPVwiMjU1XCJcbiAgICAgID48L2NvbG9yLWVkaXRhYmxlLWlucHV0PlxuICAgIDwvZGl2PlxuICAgIDxkaXYgY2xhc3M9XCJza2V0Y2gtc2luZ2xlXCI+XG4gICAgICA8Y29sb3ItZWRpdGFibGUtaW5wdXRcbiAgICAgICAgW3N0eWxlXT1cInsgaW5wdXQ6IGlucHV0LCBsYWJlbDogbGFiZWwgfVwiXG4gICAgICAgIGxhYmVsPVwiZ1wiXG4gICAgICAgIFt2YWx1ZV09XCJyZ2IuZ1wiXG4gICAgICAgIChvbkNoYW5nZSk9XCJoYW5kbGVDaGFuZ2UoJGV2ZW50KVwiXG4gICAgICAgIFtkcmFnTGFiZWxdPVwidHJ1ZVwiXG4gICAgICAgIFtkcmFnTWF4XT1cIjI1NVwiXG4gICAgICA+PC9jb2xvci1lZGl0YWJsZS1pbnB1dD5cbiAgICA8L2Rpdj5cbiAgICA8ZGl2IGNsYXNzPVwic2tldGNoLXNpbmdsZVwiPlxuICAgICAgPGNvbG9yLWVkaXRhYmxlLWlucHV0XG4gICAgICAgIFtzdHlsZV09XCJ7IGlucHV0OiBpbnB1dCwgbGFiZWw6IGxhYmVsIH1cIlxuICAgICAgICBsYWJlbD1cImJcIlxuICAgICAgICBbdmFsdWVdPVwicmdiLmJcIlxuICAgICAgICAob25DaGFuZ2UpPVwiaGFuZGxlQ2hhbmdlKCRldmVudClcIlxuICAgICAgICBbZHJhZ0xhYmVsXT1cInRydWVcIlxuICAgICAgICBbZHJhZ01heF09XCIyNTVcIlxuICAgICAgPjwvY29sb3ItZWRpdGFibGUtaW5wdXQ+XG4gICAgPC9kaXY+XG4gICAgPGRpdiBjbGFzcz1cInNrZXRjaC1hbHBoYVwiICpuZ0lmPVwiZGlzYWJsZUFscGhhID09PSBmYWxzZVwiPlxuICAgICAgPGNvbG9yLWVkaXRhYmxlLWlucHV0XG4gICAgICAgIFtzdHlsZV09XCJ7IGlucHV0OiBpbnB1dCwgbGFiZWw6IGxhYmVsIH1cIlxuICAgICAgICBsYWJlbD1cImFcIlxuICAgICAgICBbdmFsdWVdPVwicm91bmQocmdiLmEgKiAxMDApXCJcbiAgICAgICAgKG9uQ2hhbmdlKT1cImhhbmRsZUNoYW5nZSgkZXZlbnQpXCJcbiAgICAgICAgW2RyYWdMYWJlbF09XCJ0cnVlXCJcbiAgICAgICAgW2RyYWdNYXhdPVwiMTAwXCJcbiAgICAgID48L2NvbG9yLWVkaXRhYmxlLWlucHV0PlxuICAgIDwvZGl2PlxuICA8L2Rpdj5cbiAgYCxcbiAgc3R5bGVzOiBbXG4gICAgYFxuICAgIC5za2V0Y2gtZmllbGRzIHtcbiAgICAgIGRpc3BsYXk6IGZsZXg7XG4gICAgICBwYWRkaW5nLXRvcDogNHB4O1xuICAgIH1cbiAgICAuc2tldGNoLWRvdWJsZSB7XG4gICAgICAtd2Via2l0LWJveC1mbGV4OiAyO1xuICAgICAgZmxleDogMiAxIDAlO1xuICAgIH1cbiAgICAuc2tldGNoLXNpbmdsZSB7XG4gICAgICBmbGV4OiAxIDEgMCU7XG4gICAgICBwYWRkaW5nLWxlZnQ6IDZweDtcbiAgICB9XG4gICAgLnNrZXRjaC1hbHBoYSB7XG4gICAgICAtd2Via2l0LWJveC1mbGV4OiAxO1xuICAgICAgZmxleDogMSAxIDAlO1xuICAgICAgcGFkZGluZy1sZWZ0OiA2cHg7XG4gICAgfVxuICAgIDpob3N0LWNvbnRleHQoW2Rpcj1ydGxdKSAuc2tldGNoLXNpbmdsZSB7XG4gICAgICBwYWRkaW5nLXJpZ2h0OiA2cHg7XG4gICAgICBwYWRkaW5nLWxlZnQ6IDA7XG4gICAgfVxuICAgIDpob3N0LWNvbnRleHQoW2Rpcj1ydGxdKSAuc2tldGNoLWFscGhhIHtcbiAgICAgIHBhZGRpbmctcmlnaHQ6IDZweDtcbiAgICAgIHBhZGRpbmctbGVmdDogMDtcbiAgICB9XG4gIGAsXG4gIF0sXG4gIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxuICBwcmVzZXJ2ZVdoaXRlc3BhY2VzOiBmYWxzZSxcbn0pXG5leHBvcnQgY2xhc3MgU2tldGNoRmllbGRzQ29tcG9uZW50IHtcbiAgQElucHV0KCkgaHNsITogSFNMQTtcbiAgQElucHV0KCkgcmdiITogUkdCQTtcbiAgQElucHV0KCkgaGV4ITogc3RyaW5nO1xuICBASW5wdXQoKSBkaXNhYmxlQWxwaGEgPSBmYWxzZTtcbiAgQE91dHB1dCgpIG9uQ2hhbmdlID0gbmV3IEV2ZW50RW1pdHRlcjxhbnk+KCk7XG4gIGlucHV0OiB7W2tleTogc3RyaW5nXTogc3RyaW5nfSA9IHtcbiAgICB3aWR0aDogJzEwMCUnLFxuICAgIHBhZGRpbmc6ICc0cHggMTAlIDNweCcsXG4gICAgYm9yZGVyOiAnbm9uZScsXG4gICAgYm94U2l6aW5nOiAnYm9yZGVyLWJveCcsXG4gICAgYm94U2hhZG93OiAnaW5zZXQgMCAwIDAgMXB4ICNjY2MnLFxuICAgIGZvbnRTaXplOiAnMTFweCcsXG4gIH07XG4gIGxhYmVsOiB7W2tleTogc3RyaW5nXTogc3RyaW5nfSA9IHtcbiAgICBkaXNwbGF5OiAnYmxvY2snLFxuICAgIHRleHRBbGlnbjogJ2NlbnRlcicsXG4gICAgZm9udFNpemU6ICcxMXB4JyxcbiAgICBjb2xvcjogJyMyMjInLFxuICAgIHBhZGRpbmdUb3A6ICczcHgnLFxuICAgIHBhZGRpbmdCb3R0b206ICc0cHgnLFxuICAgIHRleHRUcmFuc2Zvcm06ICdjYXBpdGFsaXplJyxcbiAgfTtcblxuICByb3VuZCh2YWx1ZSkge1xuICAgIHJldHVybiBNYXRoLnJvdW5kKHZhbHVlKTtcbiAgfVxuICBoYW5kbGVDaGFuZ2UoeyBkYXRhLCAkZXZlbnQgfSkge1xuICAgIGlmIChkYXRhLmhleCkge1xuICAgICAgaWYgKGlzVmFsaWRIZXgoZGF0YS5oZXgpKSB7XG4gICAgICAgIGNvbnN0IGNvbG9yID0gbmV3IFRpbnlDb2xvcihkYXRhLmhleCk7XG4gICAgICAgIHRoaXMub25DaGFuZ2UuZW1pdCh7XG4gICAgICAgICAgZGF0YToge1xuICAgICAgICAgICAgaGV4OiB0aGlzLmRpc2FibGVBbHBoYSB8fCBkYXRhLmhleC5sZW5ndGggPD0gNiA/IGNvbG9yLnRvSGV4KCkgOiBjb2xvci50b0hleDgoKSxcbiAgICAgICAgICAgIHNvdXJjZTogJ2hleCcsXG4gICAgICAgICAgfSxcbiAgICAgICAgICAkZXZlbnQsXG4gICAgICAgIH0pO1xuICAgICAgfVxuICAgIH0gZWxzZSBpZiAoZGF0YS5yIHx8IGRhdGEuZyB8fCBkYXRhLmIpIHtcbiAgICAgIHRoaXMub25DaGFuZ2UuZW1pdCh7XG4gICAgICAgIGRhdGE6IHtcbiAgICAgICAgICByOiBkYXRhLnIgfHwgdGhpcy5yZ2IucixcbiAgICAgICAgICBnOiBkYXRhLmcgfHwgdGhpcy5yZ2IuZyxcbiAgICAgICAgICBiOiBkYXRhLmIgfHwgdGhpcy5yZ2IuYixcbiAgICAgICAgICBzb3VyY2U6ICdyZ2InLFxuICAgICAgICB9LFxuICAgICAgICAkZXZlbnQsXG4gICAgICB9KTtcbiAgICB9IGVsc2UgaWYgKGRhdGEuYSkge1xuICAgICAgaWYgKGRhdGEuYSA8IDApIHtcbiAgICAgICAgZGF0YS5hID0gMDtcbiAgICAgIH0gZWxzZSBpZiAoZGF0YS5hID4gMTAwKSB7XG4gICAgICAgIGRhdGEuYSA9IDEwMDtcbiAgICAgIH1cbiAgICAgIGRhdGEuYSAvPSAxMDA7XG5cbiAgICAgIGlmICh0aGlzLmRpc2FibGVBbHBoYSkge1xuICAgICAgICBkYXRhLmEgPSAxO1xuICAgICAgfVxuXG4gICAgICB0aGlzLm9uQ2hhbmdlLmVtaXQoe1xuICAgICAgICBkYXRhOiB7XG4gICAgICAgICAgaDogdGhpcy5oc2wuaCxcbiAgICAgICAgICBzOiB0aGlzLmhzbC5zLFxuICAgICAgICAgIGw6IHRoaXMuaHNsLmwsXG4gICAgICAgICAgYTogTWF0aC5yb3VuZChkYXRhLmEgKiAxMDApIC8gMTAwLFxuICAgICAgICAgIHNvdXJjZTogJ3JnYicsXG4gICAgICAgIH0sXG4gICAgICAgICRldmVudCxcbiAgICAgIH0pO1xuICAgIH0gZWxzZSBpZiAoZGF0YS5oIHx8IGRhdGEucyB8fCBkYXRhLmwpIHtcbiAgICAgIHRoaXMub25DaGFuZ2UuZW1pdCh7XG4gICAgICAgIGRhdGE6IHtcbiAgICAgICAgICBoOiBkYXRhLmggfHwgdGhpcy5oc2wuaCxcbiAgICAgICAgICBzOiBOdW1iZXIoKGRhdGEucyAmJiBkYXRhLnMpIHx8IHRoaXMuaHNsLnMpLFxuICAgICAgICAgIGw6IE51bWJlcigoZGF0YS5sICYmIGRhdGEubCkgfHwgdGhpcy5oc2wubCksXG4gICAgICAgICAgc291cmNlOiAnaHNsJyxcbiAgICAgICAgfSxcbiAgICAgICAgJGV2ZW50LFxuICAgICAgfSk7XG4gICAgfVxuICB9XG59XG4iXX0=
|
@@ -1,68 +0,0 @@
|
|
1
|
-
import { ChangeDetectionStrategy, Component, EventEmitter, Input, Output, } from '@angular/core';
|
2
|
-
import * as i0 from "@angular/core";
|
3
|
-
import * as i1 from "@angular/common";
|
4
|
-
import * as i2 from "ngx-color";
|
5
|
-
export class SketchPresetColorsComponent {
|
6
|
-
constructor() {
|
7
|
-
this.onClick = new EventEmitter();
|
8
|
-
this.onSwatchHover = new EventEmitter();
|
9
|
-
this.swatchStyle = {
|
10
|
-
borderRadius: '3px',
|
11
|
-
boxShadow: 'inset 0 0 0 1px rgba(0,0,0,.15)',
|
12
|
-
};
|
13
|
-
}
|
14
|
-
handleClick({ hex, $event }) {
|
15
|
-
this.onClick.emit({ hex, $event });
|
16
|
-
}
|
17
|
-
normalizeValue(val) {
|
18
|
-
if (typeof val === 'string') {
|
19
|
-
return { color: val };
|
20
|
-
}
|
21
|
-
return val;
|
22
|
-
}
|
23
|
-
focusStyle(val) {
|
24
|
-
const c = this.normalizeValue(val);
|
25
|
-
return {
|
26
|
-
boxShadow: `inset 0 0 0 1px rgba(0,0,0,.15), 0 0 4px ${c.color}`,
|
27
|
-
};
|
28
|
-
}
|
29
|
-
}
|
30
|
-
SketchPresetColorsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.2", ngImport: i0, type: SketchPresetColorsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
31
|
-
SketchPresetColorsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.2", type: SketchPresetColorsComponent, selector: "color-sketch-preset-colors", inputs: { colors: "colors" }, outputs: { onClick: "onClick", onSwatchHover: "onSwatchHover" }, ngImport: i0, template: `
|
32
|
-
<div class="sketch-swatches">
|
33
|
-
<div class="sketch-wrap" *ngFor="let c of colors">
|
34
|
-
<color-swatch
|
35
|
-
[color]="normalizeValue(c).color"
|
36
|
-
[style]="swatchStyle"
|
37
|
-
[focusStyle]="focusStyle(c)"
|
38
|
-
(onClick)="handleClick($event)"
|
39
|
-
(onHover)="onSwatchHover.emit($event)"
|
40
|
-
class="swatch"
|
41
|
-
></color-swatch>
|
42
|
-
</div>
|
43
|
-
</div>
|
44
|
-
`, isInline: true, styles: [".sketch-swatches{position:relative;display:flex;flex-wrap:wrap;margin:0 -10px;padding:10px 0 0 10px;border-top:1px solid rgb(238,238,238)}.sketch-wrap{width:16px;height:16px;margin:0 10px 10px 0}:host-context([dir=rtl]) .sketch-swatches{padding-right:10px;padding-left:0}:host-context([dir=rtl]) .sketch-wrap{margin-left:10px;margin-right:0}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: i2.SwatchComponent, selector: "color-swatch", inputs: ["color", "style", "focusStyle", "focus"], outputs: ["onClick", "onHover"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
45
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.2", ngImport: i0, type: SketchPresetColorsComponent, decorators: [{
|
46
|
-
type: Component,
|
47
|
-
args: [{ selector: 'color-sketch-preset-colors', template: `
|
48
|
-
<div class="sketch-swatches">
|
49
|
-
<div class="sketch-wrap" *ngFor="let c of colors">
|
50
|
-
<color-swatch
|
51
|
-
[color]="normalizeValue(c).color"
|
52
|
-
[style]="swatchStyle"
|
53
|
-
[focusStyle]="focusStyle(c)"
|
54
|
-
(onClick)="handleClick($event)"
|
55
|
-
(onHover)="onSwatchHover.emit($event)"
|
56
|
-
class="swatch"
|
57
|
-
></color-swatch>
|
58
|
-
</div>
|
59
|
-
</div>
|
60
|
-
`, changeDetection: ChangeDetectionStrategy.OnPush, preserveWhitespaces: false, styles: [".sketch-swatches{position:relative;display:flex;flex-wrap:wrap;margin:0 -10px;padding:10px 0 0 10px;border-top:1px solid rgb(238,238,238)}.sketch-wrap{width:16px;height:16px;margin:0 10px 10px 0}:host-context([dir=rtl]) .sketch-swatches{padding-right:10px;padding-left:0}:host-context([dir=rtl]) .sketch-wrap{margin-left:10px;margin-right:0}\n"] }]
|
61
|
-
}], propDecorators: { colors: [{
|
62
|
-
type: Input
|
63
|
-
}], onClick: [{
|
64
|
-
type: Output
|
65
|
-
}], onSwatchHover: [{
|
66
|
-
type: Output
|
67
|
-
}] } });
|
68
|
-
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2tldGNoLXByZXNldC1jb2xvcnMuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL2xpYi9za2V0Y2gvc2tldGNoLXByZXNldC1jb2xvcnMuY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFDTCx1QkFBdUIsRUFDdkIsU0FBUyxFQUNULFlBQVksRUFDWixLQUFLLEVBQ0wsTUFBTSxHQUNQLE1BQU0sZUFBZSxDQUFDOzs7O0FBZ0R2QixNQUFNLE9BQU8sMkJBQTJCO0lBNUN4QztRQThDWSxZQUFPLEdBQUcsSUFBSSxZQUFZLEVBQU8sQ0FBQztRQUNsQyxrQkFBYSxHQUFHLElBQUksWUFBWSxFQUFPLENBQUM7UUFDbEQsZ0JBQVcsR0FBRztZQUNaLFlBQVksRUFBRSxLQUFLO1lBQ25CLFNBQVMsRUFBRSxpQ0FBaUM7U0FDN0MsQ0FBQztLQWlCSDtJQWZDLFdBQVcsQ0FBQyxFQUFFLEdBQUcsRUFBRSxNQUFNLEVBQUU7UUFDekIsSUFBSSxDQUFDLE9BQU8sQ0FBQyxJQUFJLENBQUMsRUFBRSxHQUFHLEVBQUUsTUFBTSxFQUFFLENBQUMsQ0FBQztJQUNyQyxDQUFDO0lBQ0QsY0FBYyxDQUFDLEdBQW1CO1FBQ2hDLElBQUksT0FBTyxHQUFHLEtBQUssUUFBUSxFQUFFO1lBQzNCLE9BQU8sRUFBRSxLQUFLLEVBQUUsR0FBRyxFQUFFLENBQUM7U0FDdkI7UUFDRCxPQUFPLEdBQUcsQ0FBQztJQUNiLENBQUM7SUFDRCxVQUFVLENBQUMsR0FBbUI7UUFDNUIsTUFBTSxDQUFDLEdBQUcsSUFBSSxDQUFDLGNBQWMsQ0FBQyxHQUFHLENBQUMsQ0FBQztRQUNuQyxPQUFPO1lBQ0wsU0FBUyxFQUFFLDRDQUE0QyxDQUFDLENBQUMsS0FBSyxFQUFFO1NBQ2pFLENBQUM7SUFDSixDQUFDOzt3SEF2QlUsMkJBQTJCOzRHQUEzQiwyQkFBMkIsaUtBMUM1Qjs7Ozs7Ozs7Ozs7OztHQWFUOzJGQTZCVSwyQkFBMkI7a0JBNUN2QyxTQUFTOytCQUNFLDRCQUE0QixZQUM1Qjs7Ozs7Ozs7Ozs7OztHQWFULG1CQTBCZ0IsdUJBQXVCLENBQUMsTUFBTSx1QkFDMUIsS0FBSzs4QkFHakIsTUFBTTtzQkFBZCxLQUFLO2dCQUNJLE9BQU87c0JBQWhCLE1BQU07Z0JBQ0csYUFBYTtzQkFBdEIsTUFBTSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7XG4gIENoYW5nZURldGVjdGlvblN0cmF0ZWd5LFxuICBDb21wb25lbnQsXG4gIEV2ZW50RW1pdHRlcixcbiAgSW5wdXQsXG4gIE91dHB1dCxcbn0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbmltcG9ydCB7IFNoYXBlIH0gZnJvbSAnbmd4LWNvbG9yJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnY29sb3Itc2tldGNoLXByZXNldC1jb2xvcnMnLFxuICB0ZW1wbGF0ZTogYFxuICA8ZGl2IGNsYXNzPVwic2tldGNoLXN3YXRjaGVzXCI+XG4gICAgPGRpdiBjbGFzcz1cInNrZXRjaC13cmFwXCIgKm5nRm9yPVwibGV0IGMgb2YgY29sb3JzXCI+XG4gICAgICA8Y29sb3Itc3dhdGNoXG4gICAgICAgIFtjb2xvcl09XCJub3JtYWxpemVWYWx1ZShjKS5jb2xvclwiXG4gICAgICAgIFtzdHlsZV09XCJzd2F0Y2hTdHlsZVwiXG4gICAgICAgIFtmb2N1c1N0eWxlXT1cImZvY3VzU3R5bGUoYylcIlxuICAgICAgICAob25DbGljayk9XCJoYW5kbGVDbGljaygkZXZlbnQpXCJcbiAgICAgICAgKG9uSG92ZXIpPVwib25Td2F0Y2hIb3Zlci5lbWl0KCRldmVudClcIlxuICAgICAgICBjbGFzcz1cInN3YXRjaFwiXG4gICAgICA+PC9jb2xvci1zd2F0Y2g+XG4gICAgPC9kaXY+XG4gIDwvZGl2PlxuICBgLFxuICBzdHlsZXM6IFtcbiAgICBgXG4gICAgLnNrZXRjaC1zd2F0Y2hlcyB7XG4gICAgICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gICAgICBkaXNwbGF5OiBmbGV4O1xuICAgICAgZmxleC13cmFwOiB3cmFwO1xuICAgICAgbWFyZ2luOiAwcHggLTEwcHg7XG4gICAgICBwYWRkaW5nOiAxMHB4IDBweCAwcHggMTBweDtcbiAgICAgIGJvcmRlci10b3A6IDFweCBzb2xpZCByZ2IoMjM4LCAyMzgsIDIzOCk7XG4gICAgfVxuICAgIC5za2V0Y2gtd3JhcCB7XG4gICAgICB3aWR0aDogMTZweDtcbiAgICAgIGhlaWdodDogMTZweDtcbiAgICAgIG1hcmdpbjogMHB4IDEwcHggMTBweCAwcHg7XG4gICAgfVxuICAgIDpob3N0LWNvbnRleHQoW2Rpcj1ydGxdKSAuc2tldGNoLXN3YXRjaGVzIHtcbiAgICAgIHBhZGRpbmctcmlnaHQ6IDEwcHg7XG4gICAgICBwYWRkaW5nLWxlZnQ6IDA7XG4gICAgfVxuICAgIDpob3N0LWNvbnRleHQoW2Rpcj1ydGxdKSAuc2tldGNoLXdyYXAge1xuICAgICAgbWFyZ2luLWxlZnQ6IDEwcHg7XG4gICAgICBtYXJnaW4tcmlnaHQ6IDA7XG4gICAgfVxuICBgLFxuICBdLFxuICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaCxcbiAgcHJlc2VydmVXaGl0ZXNwYWNlczogZmFsc2UsXG59KVxuZXhwb3J0IGNsYXNzIFNrZXRjaFByZXNldENvbG9yc0NvbXBvbmVudCB7XG4gIEBJbnB1dCgpIGNvbG9ycyE6IHN0cmluZ1tdO1xuICBAT3V0cHV0KCkgb25DbGljayA9IG5ldyBFdmVudEVtaXR0ZXI8YW55PigpO1xuICBAT3V0cHV0KCkgb25Td2F0Y2hIb3ZlciA9IG5ldyBFdmVudEVtaXR0ZXI8YW55PigpO1xuICBzd2F0Y2hTdHlsZSA9IHtcbiAgICBib3JkZXJSYWRpdXM6ICczcHgnLFxuICAgIGJveFNoYWRvdzogJ2luc2V0IDAgMCAwIDFweCByZ2JhKDAsMCwwLC4xNSknLFxuICB9O1xuXG4gIGhhbmRsZUNsaWNrKHsgaGV4LCAkZXZlbnQgfSkge1xuICAgIHRoaXMub25DbGljay5lbWl0KHsgaGV4LCAkZXZlbnQgfSk7XG4gIH1cbiAgbm9ybWFsaXplVmFsdWUodmFsOiBzdHJpbmcgfCBTaGFwZSkge1xuICAgIGlmICh0eXBlb2YgdmFsID09PSAnc3RyaW5nJykge1xuICAgICAgcmV0dXJuIHsgY29sb3I6IHZhbCB9O1xuICAgIH1cbiAgICByZXR1cm4gdmFsO1xuICB9XG4gIGZvY3VzU3R5bGUodmFsOiBzdHJpbmcgfCBTaGFwZSkge1xuICAgIGNvbnN0IGMgPSB0aGlzLm5vcm1hbGl6ZVZhbHVlKHZhbCk7XG4gICAgcmV0dXJuIHtcbiAgICAgIGJveFNoYWRvdzogYGluc2V0IDAgMCAwIDFweCByZ2JhKDAsMCwwLC4xNSksIDAgMCA0cHggJHtjLmNvbG9yfWAsXG4gICAgfTtcbiAgfVxufVxuIl19
|