ngx-color 7.3.3 → 8.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 -1
- package/alpha.component.d.ts +1 -1
- package/checkboard.component.d.ts +1 -1
- package/color-wrap.component.d.ts +1 -1
- package/coordinates.directive.d.ts +1 -1
- package/editable-input.component.d.ts +1 -1
- package/esm2020/alpha.component.mjs +13 -61
- package/esm2020/checkboard.component.mjs +9 -25
- package/esm2020/color-wrap.component.mjs +8 -8
- package/esm2020/coordinates.directive.mjs +7 -7
- package/esm2020/editable-input.component.mjs +11 -25
- package/esm2020/hue.component.mjs +13 -54
- package/esm2020/raised.component.mjs +10 -49
- package/esm2020/saturation.component.mjs +13 -57
- package/esm2020/shade.component.mjs +11 -51
- package/esm2020/swatch.component.mjs +13 -28
- package/fesm2015/ngx-color.mjs +92 -349
- package/fesm2015/ngx-color.mjs.map +1 -1
- package/fesm2020/ngx-color.mjs +92 -349
- package/fesm2020/ngx-color.mjs.map +1 -1
- package/hue.component.d.ts +1 -1
- package/{ngx-color.d.ts → index.d.ts} +0 -0
- package/package.json +6 -119
- package/raised.component.d.ts +1 -1
- package/saturation.component.d.ts +1 -1
- package/shade.component.d.ts +1 -1
- package/swatch.component.d.ts +1 -1
- package/alpha/alpha-picker.component.d.ts +0 -28
- package/alpha/ngx-color-alpha.d.ts +0 -5
- package/alpha/package.json +0 -17
- package/alpha/public_api.d.ts +0 -1
- package/block/block-swatches.component.d.ts +0 -24
- package/block/block.component.d.ts +0 -36
- package/block/ngx-color-block.d.ts +0 -5
- package/block/package.json +0 -16
- package/block/public_api.d.ts +0 -2
- package/chrome/chrome-fields.component.d.ts +0 -22
- package/chrome/chrome.component.d.ts +0 -25
- package/chrome/ngx-color-chrome.d.ts +0 -5
- package/chrome/package.json +0 -16
- package/chrome/public_api.d.ts +0 -2
- package/circle/circle-swatch.component.d.ts +0 -19
- package/circle/circle.component.d.ts +0 -32
- package/circle/ngx-color-circle.d.ts +0 -5
- package/circle/package.json +0 -19
- package/circle/public_api.d.ts +0 -2
- package/compact/compact-color.component.d.ts +0 -19
- package/compact/compact-fields.component.d.ts +0 -32
- package/compact/compact.component.d.ts +0 -30
- package/compact/ngx-color-compact.d.ts +0 -5
- package/compact/package.json +0 -16
- package/compact/public_api.d.ts +0 -3
- package/esm2020/alpha/alpha-picker.component.mjs +0 -116
- package/esm2020/alpha/ngx-color-alpha.mjs +0 -5
- package/esm2020/alpha/public_api.mjs +0 -2
- package/esm2020/block/block-swatches.component.mjs +0 -74
- package/esm2020/block/block.component.mjs +0 -199
- package/esm2020/block/ngx-color-block.mjs +0 -5
- package/esm2020/block/public_api.mjs +0 -3
- package/esm2020/chrome/chrome-fields.component.mjs +0 -356
- package/esm2020/chrome/chrome.component.mjs +0 -249
- 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 -85
- package/esm2020/circle/circle.component.mjs +0 -148
- package/esm2020/circle/ngx-color-circle.mjs +0 -5
- package/esm2020/circle/public_api.mjs +0 -3
- package/esm2020/compact/compact-color.component.mjs +0 -91
- package/esm2020/compact/compact-fields.component.mjs +0 -186
- package/esm2020/compact/compact.component.mjs +0 -177
- package/esm2020/compact/ngx-color-compact.mjs +0 -5
- package/esm2020/compact/public_api.mjs +0 -4
- package/esm2020/github/github-swatch.component.mjs +0 -67
- package/esm2020/github/github.component.mjs +0 -179
- package/esm2020/github/ngx-color-github.mjs +0 -5
- package/esm2020/github/public_api.mjs +0 -3
- package/esm2020/hue/hue-picker.component.mjs +0 -113
- package/esm2020/hue/ngx-color-hue.mjs +0 -5
- package/esm2020/hue/public_api.mjs +0 -2
- package/esm2020/material/material.component.mjs +0 -211
- package/esm2020/material/ngx-color-material.mjs +0 -5
- package/esm2020/material/public_api.mjs +0 -2
- package/esm2020/photoshop/ngx-color-photoshop.mjs +0 -5
- package/esm2020/photoshop/photoshop-button.component.mjs +0 -63
- package/esm2020/photoshop/photoshop-fields.component.mjs +0 -241
- package/esm2020/photoshop/photoshop-previews.component.mjs +0 -68
- package/esm2020/photoshop/photoshop.component.mjs +0 -258
- package/esm2020/photoshop/public_api.mjs +0 -5
- 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 -105
- 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 -243
- package/esm2020/sketch/sketch-preset-colors.component.mjs +0 -98
- package/esm2020/sketch/sketch.component.mjs +0 -283
- 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 -80
- package/esm2020/slider/slider-swatches.component.mjs +0 -135
- package/esm2020/slider/slider.component.mjs +0 -116
- 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 -123
- package/esm2020/swatches/swatches-group.component.mjs +0 -64
- package/esm2020/swatches/swatches.component.mjs +0 -258
- package/esm2020/twitter/ngx-color-twitter.mjs +0 -5
- package/esm2020/twitter/public_api.mjs +0 -2
- package/esm2020/twitter/twitter.component.mjs +0 -255
- package/fesm2015/ngx-color-alpha.mjs +0 -123
- package/fesm2015/ngx-color-alpha.mjs.map +0 -1
- package/fesm2015/ngx-color-block.mjs +0 -275
- package/fesm2015/ngx-color-block.mjs.map +0 -1
- package/fesm2015/ngx-color-chrome.mjs +0 -606
- package/fesm2015/ngx-color-chrome.mjs.map +0 -1
- package/fesm2015/ngx-color-circle.mjs +0 -237
- package/fesm2015/ngx-color-circle.mjs.map +0 -1
- package/fesm2015/ngx-color-compact.mjs +0 -451
- package/fesm2015/ngx-color-compact.mjs.map +0 -1
- package/fesm2015/ngx-color-github.mjs +0 -250
- package/fesm2015/ngx-color-github.mjs.map +0 -1
- package/fesm2015/ngx-color-hue.mjs +0 -120
- package/fesm2015/ngx-color-hue.mjs.map +0 -1
- package/fesm2015/ngx-color-material.mjs +0 -218
- package/fesm2015/ngx-color-material.mjs.map +0 -1
- package/fesm2015/ngx-color-photoshop.mjs +0 -626
- package/fesm2015/ngx-color-photoshop.mjs.map +0 -1
- package/fesm2015/ngx-color-shade.mjs +0 -112
- package/fesm2015/ngx-color-shade.mjs.map +0 -1
- package/fesm2015/ngx-color-sketch.mjs +0 -620
- package/fesm2015/ngx-color-sketch.mjs.map +0 -1
- package/fesm2015/ngx-color-slider.mjs +0 -331
- package/fesm2015/ngx-color-slider.mjs.map +0 -1
- package/fesm2015/ngx-color-swatches.mjs +0 -441
- package/fesm2015/ngx-color-swatches.mjs.map +0 -1
- package/fesm2015/ngx-color-twitter.mjs +0 -262
- package/fesm2015/ngx-color-twitter.mjs.map +0 -1
- package/fesm2020/ngx-color-alpha.mjs +0 -123
- package/fesm2020/ngx-color-alpha.mjs.map +0 -1
- package/fesm2020/ngx-color-block.mjs +0 -275
- package/fesm2020/ngx-color-block.mjs.map +0 -1
- package/fesm2020/ngx-color-chrome.mjs +0 -606
- package/fesm2020/ngx-color-chrome.mjs.map +0 -1
- package/fesm2020/ngx-color-circle.mjs +0 -237
- package/fesm2020/ngx-color-circle.mjs.map +0 -1
- package/fesm2020/ngx-color-compact.mjs +0 -451
- package/fesm2020/ngx-color-compact.mjs.map +0 -1
- package/fesm2020/ngx-color-github.mjs +0 -250
- package/fesm2020/ngx-color-github.mjs.map +0 -1
- package/fesm2020/ngx-color-hue.mjs +0 -120
- package/fesm2020/ngx-color-hue.mjs.map +0 -1
- package/fesm2020/ngx-color-material.mjs +0 -218
- package/fesm2020/ngx-color-material.mjs.map +0 -1
- package/fesm2020/ngx-color-photoshop.mjs +0 -626
- package/fesm2020/ngx-color-photoshop.mjs.map +0 -1
- package/fesm2020/ngx-color-shade.mjs +0 -112
- package/fesm2020/ngx-color-shade.mjs.map +0 -1
- package/fesm2020/ngx-color-sketch.mjs +0 -620
- package/fesm2020/ngx-color-sketch.mjs.map +0 -1
- package/fesm2020/ngx-color-slider.mjs +0 -331
- package/fesm2020/ngx-color-slider.mjs.map +0 -1
- package/fesm2020/ngx-color-swatches.mjs +0 -441
- package/fesm2020/ngx-color-swatches.mjs.map +0 -1
- package/fesm2020/ngx-color-twitter.mjs +0 -262
- package/fesm2020/ngx-color-twitter.mjs.map +0 -1
- package/github/github-swatch.component.d.ts +0 -19
- package/github/github.component.d.ts +0 -28
- package/github/ngx-color-github.d.ts +0 -5
- package/github/package.json +0 -16
- package/github/public_api.d.ts +0 -2
- package/hue/hue-picker.component.d.ts +0 -29
- package/hue/ngx-color-hue.d.ts +0 -5
- package/hue/package.json +0 -15
- package/hue/public_api.d.ts +0 -1
- package/material/material.component.d.ts +0 -39
- package/material/ngx-color-material.d.ts +0 -5
- package/material/package.json +0 -15
- package/material/public_api.d.ts +0 -1
- package/photoshop/ngx-color-photoshop.d.ts +0 -5
- package/photoshop/package.json +0 -15
- package/photoshop/photoshop-button.component.d.ts +0 -9
- package/photoshop/photoshop-fields.component.d.ts +0 -22
- package/photoshop/photoshop-previews.component.d.ts +0 -11
- package/photoshop/photoshop.component.d.ts +0 -33
- package/photoshop/public_api.d.ts +0 -4
- package/shade/ngx-color-shade.d.ts +0 -5
- package/shade/package.json +0 -17
- package/shade/public_api.d.ts +0 -1
- package/shade/shade-picker.component.d.ts +0 -27
- package/sketch/ngx-color-sketch.d.ts +0 -5
- package/sketch/package.json +0 -15
- package/sketch/public_api.d.ts +0 -3
- package/sketch/sketch-fields.component.d.ts +0 -23
- package/sketch/sketch-preset-colors.component.d.ts +0 -24
- package/sketch/sketch.component.d.ts +0 -32
- package/slider/ngx-color-slider.d.ts +0 -5
- package/slider/package.json +0 -15
- package/slider/public_api.d.ts +0 -3
- package/slider/slider-swatch.component.d.ts +0 -16
- package/slider/slider-swatches.component.d.ts +0 -15
- package/slider/slider.component.d.ts +0 -22
- package/swatches/ngx-color-swatches.d.ts +0 -5
- package/swatches/package.json +0 -18
- package/swatches/public_api.d.ts +0 -3
- package/swatches/swatches-color.component.d.ts +0 -18
- package/swatches/swatches-group.component.d.ts +0 -10
- package/swatches/swatches.component.d.ts +0 -29
- package/twitter/ngx-color-twitter.d.ts +0 -5
- package/twitter/package.json +0 -15
- package/twitter/public_api.d.ts +0 -1
- package/twitter/twitter.component.d.ts +0 -31
@@ -1,620 +0,0 @@
|
|
1
|
-
import * as i0 from '@angular/core';
|
2
|
-
import { EventEmitter, Component, ChangeDetectionStrategy, Input, Output, forwardRef, NgModule } from '@angular/core';
|
3
|
-
import * as i1 from 'ngx-color';
|
4
|
-
import { isValidHex, ColorWrap, AlphaModule, CheckboardModule, EditableInputModule, HueModule, SaturationModule, SwatchModule } from 'ngx-color';
|
5
|
-
import { TinyColor } from '@ctrl/tinycolor';
|
6
|
-
import * as i2 from '@angular/common';
|
7
|
-
import { CommonModule } from '@angular/common';
|
8
|
-
import { NG_VALUE_ACCESSOR } from '@angular/forms';
|
9
|
-
|
10
|
-
class SketchFieldsComponent {
|
11
|
-
constructor() {
|
12
|
-
this.disableAlpha = false;
|
13
|
-
this.onChange = new EventEmitter();
|
14
|
-
this.input = {
|
15
|
-
width: '100%',
|
16
|
-
padding: '4px 10% 3px',
|
17
|
-
border: 'none',
|
18
|
-
boxSizing: 'border-box',
|
19
|
-
boxShadow: 'inset 0 0 0 1px #ccc',
|
20
|
-
fontSize: '11px',
|
21
|
-
};
|
22
|
-
this.label = {
|
23
|
-
display: 'block',
|
24
|
-
textAlign: 'center',
|
25
|
-
fontSize: '11px',
|
26
|
-
color: '#222',
|
27
|
-
paddingTop: '3px',
|
28
|
-
paddingBottom: '4px',
|
29
|
-
textTransform: 'capitalize',
|
30
|
-
};
|
31
|
-
}
|
32
|
-
round(value) {
|
33
|
-
return Math.round(value);
|
34
|
-
}
|
35
|
-
handleChange({ data, $event }) {
|
36
|
-
if (data.hex) {
|
37
|
-
if (isValidHex(data.hex)) {
|
38
|
-
const color = new TinyColor(data.hex);
|
39
|
-
this.onChange.emit({
|
40
|
-
data: {
|
41
|
-
hex: this.disableAlpha || data.hex.length <= 6 ? color.toHex() : color.toHex8(),
|
42
|
-
source: 'hex',
|
43
|
-
},
|
44
|
-
$event,
|
45
|
-
});
|
46
|
-
}
|
47
|
-
}
|
48
|
-
else if (data.r || data.g || data.b) {
|
49
|
-
this.onChange.emit({
|
50
|
-
data: {
|
51
|
-
r: data.r || this.rgb.r,
|
52
|
-
g: data.g || this.rgb.g,
|
53
|
-
b: data.b || this.rgb.b,
|
54
|
-
source: 'rgb',
|
55
|
-
},
|
56
|
-
$event,
|
57
|
-
});
|
58
|
-
}
|
59
|
-
else if (data.a) {
|
60
|
-
if (data.a < 0) {
|
61
|
-
data.a = 0;
|
62
|
-
}
|
63
|
-
else if (data.a > 100) {
|
64
|
-
data.a = 100;
|
65
|
-
}
|
66
|
-
data.a /= 100;
|
67
|
-
if (this.disableAlpha) {
|
68
|
-
data.a = 1;
|
69
|
-
}
|
70
|
-
this.onChange.emit({
|
71
|
-
data: {
|
72
|
-
h: this.hsl.h,
|
73
|
-
s: this.hsl.s,
|
74
|
-
l: this.hsl.l,
|
75
|
-
a: Math.round(data.a * 100) / 100,
|
76
|
-
source: 'rgb',
|
77
|
-
},
|
78
|
-
$event,
|
79
|
-
});
|
80
|
-
}
|
81
|
-
else if (data.h || data.s || data.l) {
|
82
|
-
this.onChange.emit({
|
83
|
-
data: {
|
84
|
-
h: data.h || this.hsl.h,
|
85
|
-
s: Number((data.s && data.s) || this.hsl.s),
|
86
|
-
l: Number((data.l && data.l) || this.hsl.l),
|
87
|
-
source: 'hsl',
|
88
|
-
},
|
89
|
-
$event,
|
90
|
-
});
|
91
|
-
}
|
92
|
-
}
|
93
|
-
}
|
94
|
-
SketchFieldsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.0", ngImport: i0, type: SketchFieldsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
95
|
-
SketchFieldsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.0.0", type: SketchFieldsComponent, selector: "color-sketch-fields", inputs: { hsl: "hsl", rgb: "rgb", hex: "hex", disableAlpha: "disableAlpha" }, outputs: { onChange: "onChange" }, ngImport: i0, template: `
|
96
|
-
<div class="sketch-fields">
|
97
|
-
<div class="sketch-double">
|
98
|
-
<color-editable-input
|
99
|
-
[style]="{ input: input, label: label }"
|
100
|
-
label="hex"
|
101
|
-
[value]="hex.replace('#', '')"
|
102
|
-
(onChange)="handleChange($event)"
|
103
|
-
></color-editable-input>
|
104
|
-
</div>
|
105
|
-
<div class="sketch-single">
|
106
|
-
<color-editable-input
|
107
|
-
[style]="{ input: input, label: label }"
|
108
|
-
label="r"
|
109
|
-
[value]="rgb.r"
|
110
|
-
(onChange)="handleChange($event)"
|
111
|
-
[dragLabel]="true"
|
112
|
-
[dragMax]="255"
|
113
|
-
></color-editable-input>
|
114
|
-
</div>
|
115
|
-
<div class="sketch-single">
|
116
|
-
<color-editable-input
|
117
|
-
[style]="{ input: input, label: label }"
|
118
|
-
label="g"
|
119
|
-
[value]="rgb.g"
|
120
|
-
(onChange)="handleChange($event)"
|
121
|
-
[dragLabel]="true"
|
122
|
-
[dragMax]="255"
|
123
|
-
></color-editable-input>
|
124
|
-
</div>
|
125
|
-
<div class="sketch-single">
|
126
|
-
<color-editable-input
|
127
|
-
[style]="{ input: input, label: label }"
|
128
|
-
label="b"
|
129
|
-
[value]="rgb.b"
|
130
|
-
(onChange)="handleChange($event)"
|
131
|
-
[dragLabel]="true"
|
132
|
-
[dragMax]="255"
|
133
|
-
></color-editable-input>
|
134
|
-
</div>
|
135
|
-
<div class="sketch-alpha" *ngIf="disableAlpha === false">
|
136
|
-
<color-editable-input
|
137
|
-
[style]="{ input: input, label: label }"
|
138
|
-
label="a"
|
139
|
-
[value]="round(rgb.a * 100)"
|
140
|
-
(onChange)="handleChange($event)"
|
141
|
-
[dragLabel]="true"
|
142
|
-
[dragMax]="100"
|
143
|
-
></color-editable-input>
|
144
|
-
</div>
|
145
|
-
</div>
|
146
|
-
`, isInline: true, styles: [".sketch-fields{display:flex;padding-top:4px}.sketch-double{flex:2 1 0%}.sketch-single{flex:1 1 0%;padding-left:6px}.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"], components: [{ type: i1.EditableInputComponent, selector: "color-editable-input", inputs: ["style", "label", "value", "arrowOffset", "dragLabel", "dragMax", "placeholder"], outputs: ["onChange"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
147
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.0", ngImport: i0, type: SketchFieldsComponent, decorators: [{
|
148
|
-
type: Component,
|
149
|
-
args: [{
|
150
|
-
selector: 'color-sketch-fields',
|
151
|
-
template: `
|
152
|
-
<div class="sketch-fields">
|
153
|
-
<div class="sketch-double">
|
154
|
-
<color-editable-input
|
155
|
-
[style]="{ input: input, label: label }"
|
156
|
-
label="hex"
|
157
|
-
[value]="hex.replace('#', '')"
|
158
|
-
(onChange)="handleChange($event)"
|
159
|
-
></color-editable-input>
|
160
|
-
</div>
|
161
|
-
<div class="sketch-single">
|
162
|
-
<color-editable-input
|
163
|
-
[style]="{ input: input, label: label }"
|
164
|
-
label="r"
|
165
|
-
[value]="rgb.r"
|
166
|
-
(onChange)="handleChange($event)"
|
167
|
-
[dragLabel]="true"
|
168
|
-
[dragMax]="255"
|
169
|
-
></color-editable-input>
|
170
|
-
</div>
|
171
|
-
<div class="sketch-single">
|
172
|
-
<color-editable-input
|
173
|
-
[style]="{ input: input, label: label }"
|
174
|
-
label="g"
|
175
|
-
[value]="rgb.g"
|
176
|
-
(onChange)="handleChange($event)"
|
177
|
-
[dragLabel]="true"
|
178
|
-
[dragMax]="255"
|
179
|
-
></color-editable-input>
|
180
|
-
</div>
|
181
|
-
<div class="sketch-single">
|
182
|
-
<color-editable-input
|
183
|
-
[style]="{ input: input, label: label }"
|
184
|
-
label="b"
|
185
|
-
[value]="rgb.b"
|
186
|
-
(onChange)="handleChange($event)"
|
187
|
-
[dragLabel]="true"
|
188
|
-
[dragMax]="255"
|
189
|
-
></color-editable-input>
|
190
|
-
</div>
|
191
|
-
<div class="sketch-alpha" *ngIf="disableAlpha === false">
|
192
|
-
<color-editable-input
|
193
|
-
[style]="{ input: input, label: label }"
|
194
|
-
label="a"
|
195
|
-
[value]="round(rgb.a * 100)"
|
196
|
-
(onChange)="handleChange($event)"
|
197
|
-
[dragLabel]="true"
|
198
|
-
[dragMax]="100"
|
199
|
-
></color-editable-input>
|
200
|
-
</div>
|
201
|
-
</div>
|
202
|
-
`,
|
203
|
-
styles: [
|
204
|
-
`
|
205
|
-
.sketch-fields {
|
206
|
-
display: flex;
|
207
|
-
padding-top: 4px;
|
208
|
-
}
|
209
|
-
.sketch-double {
|
210
|
-
-webkit-box-flex: 2;
|
211
|
-
flex: 2 1 0%;
|
212
|
-
}
|
213
|
-
.sketch-single {
|
214
|
-
flex: 1 1 0%;
|
215
|
-
padding-left: 6px;
|
216
|
-
}
|
217
|
-
.sketch-alpha {
|
218
|
-
-webkit-box-flex: 1;
|
219
|
-
flex: 1 1 0%;
|
220
|
-
padding-left: 6px;
|
221
|
-
}
|
222
|
-
:host-context([dir=rtl]) .sketch-single {
|
223
|
-
padding-right: 6px;
|
224
|
-
padding-left: 0;
|
225
|
-
}
|
226
|
-
:host-context([dir=rtl]) .sketch-alpha {
|
227
|
-
padding-right: 6px;
|
228
|
-
padding-left: 0;
|
229
|
-
}
|
230
|
-
`,
|
231
|
-
],
|
232
|
-
changeDetection: ChangeDetectionStrategy.OnPush,
|
233
|
-
preserveWhitespaces: false,
|
234
|
-
}]
|
235
|
-
}], propDecorators: { hsl: [{
|
236
|
-
type: Input
|
237
|
-
}], rgb: [{
|
238
|
-
type: Input
|
239
|
-
}], hex: [{
|
240
|
-
type: Input
|
241
|
-
}], disableAlpha: [{
|
242
|
-
type: Input
|
243
|
-
}], onChange: [{
|
244
|
-
type: Output
|
245
|
-
}] } });
|
246
|
-
|
247
|
-
class SketchPresetColorsComponent {
|
248
|
-
constructor() {
|
249
|
-
this.onClick = new EventEmitter();
|
250
|
-
this.onSwatchHover = new EventEmitter();
|
251
|
-
this.swatchStyle = {
|
252
|
-
borderRadius: '3px',
|
253
|
-
boxShadow: 'inset 0 0 0 1px rgba(0,0,0,.15)',
|
254
|
-
};
|
255
|
-
}
|
256
|
-
handleClick({ hex, $event }) {
|
257
|
-
this.onClick.emit({ hex, $event });
|
258
|
-
}
|
259
|
-
normalizeValue(val) {
|
260
|
-
if (typeof val === 'string') {
|
261
|
-
return { color: val };
|
262
|
-
}
|
263
|
-
return val;
|
264
|
-
}
|
265
|
-
focusStyle(val) {
|
266
|
-
const c = this.normalizeValue(val);
|
267
|
-
return {
|
268
|
-
boxShadow: `inset 0 0 0 1px rgba(0,0,0,.15), 0 0 4px ${c.color}`,
|
269
|
-
};
|
270
|
-
}
|
271
|
-
}
|
272
|
-
SketchPresetColorsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.0", ngImport: i0, type: SketchPresetColorsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
273
|
-
SketchPresetColorsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.0.0", type: SketchPresetColorsComponent, selector: "color-sketch-preset-colors", inputs: { colors: "colors" }, outputs: { onClick: "onClick", onSwatchHover: "onSwatchHover" }, ngImport: i0, template: `
|
274
|
-
<div class="sketch-swatches">
|
275
|
-
<div class="sketch-wrap" *ngFor="let c of colors">
|
276
|
-
<color-swatch
|
277
|
-
[color]="normalizeValue(c).color"
|
278
|
-
[style]="swatchStyle"
|
279
|
-
[focusStyle]="focusStyle(c)"
|
280
|
-
(onClick)="handleClick($event)"
|
281
|
-
(onHover)="onSwatchHover.emit($event)"
|
282
|
-
class="swatch"
|
283
|
-
></color-swatch>
|
284
|
-
</div>
|
285
|
-
</div>
|
286
|
-
`, 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"], components: [{ type: i1.SwatchComponent, selector: "color-swatch", inputs: ["color", "style", "focusStyle", "focus"], outputs: ["onClick", "onHover"] }], directives: [{ type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
287
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.0", ngImport: i0, type: SketchPresetColorsComponent, decorators: [{
|
288
|
-
type: Component,
|
289
|
-
args: [{
|
290
|
-
selector: 'color-sketch-preset-colors',
|
291
|
-
template: `
|
292
|
-
<div class="sketch-swatches">
|
293
|
-
<div class="sketch-wrap" *ngFor="let c of colors">
|
294
|
-
<color-swatch
|
295
|
-
[color]="normalizeValue(c).color"
|
296
|
-
[style]="swatchStyle"
|
297
|
-
[focusStyle]="focusStyle(c)"
|
298
|
-
(onClick)="handleClick($event)"
|
299
|
-
(onHover)="onSwatchHover.emit($event)"
|
300
|
-
class="swatch"
|
301
|
-
></color-swatch>
|
302
|
-
</div>
|
303
|
-
</div>
|
304
|
-
`,
|
305
|
-
styles: [
|
306
|
-
`
|
307
|
-
.sketch-swatches {
|
308
|
-
position: relative;
|
309
|
-
display: flex;
|
310
|
-
flex-wrap: wrap;
|
311
|
-
margin: 0px -10px;
|
312
|
-
padding: 10px 0px 0px 10px;
|
313
|
-
border-top: 1px solid rgb(238, 238, 238);
|
314
|
-
}
|
315
|
-
.sketch-wrap {
|
316
|
-
width: 16px;
|
317
|
-
height: 16px;
|
318
|
-
margin: 0px 10px 10px 0px;
|
319
|
-
}
|
320
|
-
:host-context([dir=rtl]) .sketch-swatches {
|
321
|
-
padding-right: 10px;
|
322
|
-
padding-left: 0;
|
323
|
-
}
|
324
|
-
:host-context([dir=rtl]) .sketch-wrap {
|
325
|
-
margin-left: 10px;
|
326
|
-
margin-right: 0;
|
327
|
-
}
|
328
|
-
`,
|
329
|
-
],
|
330
|
-
changeDetection: ChangeDetectionStrategy.OnPush,
|
331
|
-
preserveWhitespaces: false,
|
332
|
-
}]
|
333
|
-
}], propDecorators: { colors: [{
|
334
|
-
type: Input
|
335
|
-
}], onClick: [{
|
336
|
-
type: Output
|
337
|
-
}], onSwatchHover: [{
|
338
|
-
type: Output
|
339
|
-
}] } });
|
340
|
-
|
341
|
-
class SketchComponent extends ColorWrap {
|
342
|
-
constructor() {
|
343
|
-
super();
|
344
|
-
/** Remove alpha slider and options from picker */
|
345
|
-
this.disableAlpha = false;
|
346
|
-
/** Hex strings for default colors at bottom of picker */
|
347
|
-
this.presetColors = [
|
348
|
-
'#D0021B',
|
349
|
-
'#F5A623',
|
350
|
-
'#F8E71C',
|
351
|
-
'#8B572A',
|
352
|
-
'#7ED321',
|
353
|
-
'#417505',
|
354
|
-
'#BD10E0',
|
355
|
-
'#9013FE',
|
356
|
-
'#4A90E2',
|
357
|
-
'#50E3C2',
|
358
|
-
'#B8E986',
|
359
|
-
'#000000',
|
360
|
-
'#4A4A4A',
|
361
|
-
'#9B9B9B',
|
362
|
-
'#FFFFFF',
|
363
|
-
];
|
364
|
-
/** Width of picker */
|
365
|
-
this.width = 200;
|
366
|
-
}
|
367
|
-
afterValidChange() {
|
368
|
-
const alpha = this.disableAlpha ? 1 : this.rgb.a;
|
369
|
-
this.activeBackground = `rgba(${this.rgb.r}, ${this.rgb.g}, ${this.rgb.b}, ${alpha})`;
|
370
|
-
}
|
371
|
-
handleValueChange({ data, $event }) {
|
372
|
-
this.handleChange(data, $event);
|
373
|
-
}
|
374
|
-
handleBlockChange({ hex, $event }) {
|
375
|
-
if (isValidHex(hex)) {
|
376
|
-
// this.hex = hex;
|
377
|
-
this.handleChange({
|
378
|
-
hex,
|
379
|
-
source: 'hex',
|
380
|
-
}, $event);
|
381
|
-
}
|
382
|
-
}
|
383
|
-
}
|
384
|
-
SketchComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.0", ngImport: i0, type: SketchComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
385
|
-
SketchComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.0.0", type: SketchComponent, selector: "color-sketch", inputs: { disableAlpha: "disableAlpha", presetColors: "presetColors", width: "width" }, providers: [
|
386
|
-
{
|
387
|
-
provide: NG_VALUE_ACCESSOR,
|
388
|
-
useExisting: forwardRef(() => SketchComponent),
|
389
|
-
multi: true,
|
390
|
-
},
|
391
|
-
{
|
392
|
-
provide: ColorWrap,
|
393
|
-
useExisting: forwardRef(() => SketchComponent),
|
394
|
-
},
|
395
|
-
], usesInheritance: true, ngImport: i0, template: `
|
396
|
-
<div class="sketch-picker {{ className }}" [style.width]="width">
|
397
|
-
<div class="sketch-saturation">
|
398
|
-
<color-saturation [hsl]="hsl" [hsv]="hsv"
|
399
|
-
(onChange)="handleValueChange($event)"
|
400
|
-
>
|
401
|
-
</color-saturation>
|
402
|
-
</div>
|
403
|
-
<div class="sketch-controls">
|
404
|
-
<div class="sketch-sliders">
|
405
|
-
<div class="sketch-hue">
|
406
|
-
<color-hue [hsl]="hsl"
|
407
|
-
(onChange)="handleValueChange($event)"
|
408
|
-
></color-hue>
|
409
|
-
</div>
|
410
|
-
<div class="sketch-alpha" *ngIf="disableAlpha === false">
|
411
|
-
<color-alpha
|
412
|
-
[radius]="2" [rgb]="rgb" [hsl]="hsl"
|
413
|
-
(onChange)="handleValueChange($event)"
|
414
|
-
></color-alpha>
|
415
|
-
</div>
|
416
|
-
</div>
|
417
|
-
<div class="sketch-color">
|
418
|
-
<color-checkboard></color-checkboard>
|
419
|
-
<div class="sketch-active" [style.background]="activeBackground"></div>
|
420
|
-
</div>
|
421
|
-
</div>
|
422
|
-
<div class="sketch-fields-container">
|
423
|
-
<color-sketch-fields
|
424
|
-
[rgb]="rgb" [hsl]="hsl" [hex]="hex"
|
425
|
-
[disableAlpha]="disableAlpha"
|
426
|
-
(onChange)="handleValueChange($event)"
|
427
|
-
></color-sketch-fields>
|
428
|
-
</div>
|
429
|
-
<div class="sketch-swatches-container" *ngIf="presetColors && presetColors.length">
|
430
|
-
<color-sketch-preset-colors
|
431
|
-
[colors]="presetColors"
|
432
|
-
(onClick)="handleBlockChange($event)"
|
433
|
-
(onSwatchHover)="onSwatchHover.emit($event)"
|
434
|
-
></color-sketch-preset-colors>
|
435
|
-
</div>
|
436
|
-
</div>
|
437
|
-
`, isInline: true, styles: [".sketch-picker{padding:10px 10px 3px;box-sizing:initial;background:#fff;border-radius:4px;box-shadow:0 0 0 1px #00000026,0 8px 16px #00000026}.sketch-saturation{width:100%;padding-bottom:75%;position:relative;overflow:hidden}.sketch-fields-container{display:block}.sketch-swatches-container{display:block}.sketch-controls{display:flex}.sketch-sliders{padding:4px 0;flex:1 1 0%}.sketch-hue{position:relative;height:10px;overflow:hidden}.sketch-alpha{position:relative;height:10px;margin-top:4px;overflow:hidden}.sketch-color{width:24px;height:24px;position:relative;margin-top:4px;margin-left:4px;border-radius:3px}.sketch-active{position:absolute;top:0px;right:0px;bottom:0px;left:0px;border-radius:2px;box-shadow:#00000026 0 0 0 1px inset,#00000040 0 0 4px inset}:host-context([dir=rtl]) .sketch-color{margin-right:4px;margin-left:0}\n"], components: [{ type: i0.forwardRef(function () { return i1.SaturationComponent; }), selector: "color-saturation", inputs: ["hsl", "hsv", "radius", "pointer", "circle"], outputs: ["onChange"] }, { type: i0.forwardRef(function () { return i1.HueComponent; }), selector: "color-hue", inputs: ["hsl", "pointer", "radius", "shadow", "hidePointer", "direction"], outputs: ["onChange"] }, { type: i0.forwardRef(function () { return i1.AlphaComponent; }), selector: "color-alpha", inputs: ["hsl", "rgb", "pointer", "shadow", "radius", "direction"], outputs: ["onChange"] }, { type: i0.forwardRef(function () { return i1.CheckboardComponent; }), selector: "color-checkboard", inputs: ["white", "size", "grey", "boxShadow", "borderRadius"] }, { type: i0.forwardRef(function () { return SketchFieldsComponent; }), selector: "color-sketch-fields", inputs: ["hsl", "rgb", "hex", "disableAlpha"], outputs: ["onChange"] }, { type: i0.forwardRef(function () { return SketchPresetColorsComponent; }), selector: "color-sketch-preset-colors", inputs: ["colors"], outputs: ["onClick", "onSwatchHover"] }], directives: [{ type: i0.forwardRef(function () { return i2.NgIf; }), selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
438
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.0", ngImport: i0, type: SketchComponent, decorators: [{
|
439
|
-
type: Component,
|
440
|
-
args: [{
|
441
|
-
selector: 'color-sketch',
|
442
|
-
template: `
|
443
|
-
<div class="sketch-picker {{ className }}" [style.width]="width">
|
444
|
-
<div class="sketch-saturation">
|
445
|
-
<color-saturation [hsl]="hsl" [hsv]="hsv"
|
446
|
-
(onChange)="handleValueChange($event)"
|
447
|
-
>
|
448
|
-
</color-saturation>
|
449
|
-
</div>
|
450
|
-
<div class="sketch-controls">
|
451
|
-
<div class="sketch-sliders">
|
452
|
-
<div class="sketch-hue">
|
453
|
-
<color-hue [hsl]="hsl"
|
454
|
-
(onChange)="handleValueChange($event)"
|
455
|
-
></color-hue>
|
456
|
-
</div>
|
457
|
-
<div class="sketch-alpha" *ngIf="disableAlpha === false">
|
458
|
-
<color-alpha
|
459
|
-
[radius]="2" [rgb]="rgb" [hsl]="hsl"
|
460
|
-
(onChange)="handleValueChange($event)"
|
461
|
-
></color-alpha>
|
462
|
-
</div>
|
463
|
-
</div>
|
464
|
-
<div class="sketch-color">
|
465
|
-
<color-checkboard></color-checkboard>
|
466
|
-
<div class="sketch-active" [style.background]="activeBackground"></div>
|
467
|
-
</div>
|
468
|
-
</div>
|
469
|
-
<div class="sketch-fields-container">
|
470
|
-
<color-sketch-fields
|
471
|
-
[rgb]="rgb" [hsl]="hsl" [hex]="hex"
|
472
|
-
[disableAlpha]="disableAlpha"
|
473
|
-
(onChange)="handleValueChange($event)"
|
474
|
-
></color-sketch-fields>
|
475
|
-
</div>
|
476
|
-
<div class="sketch-swatches-container" *ngIf="presetColors && presetColors.length">
|
477
|
-
<color-sketch-preset-colors
|
478
|
-
[colors]="presetColors"
|
479
|
-
(onClick)="handleBlockChange($event)"
|
480
|
-
(onSwatchHover)="onSwatchHover.emit($event)"
|
481
|
-
></color-sketch-preset-colors>
|
482
|
-
</div>
|
483
|
-
</div>
|
484
|
-
`,
|
485
|
-
styles: [
|
486
|
-
`
|
487
|
-
.sketch-picker {
|
488
|
-
padding: 10px 10px 3px;
|
489
|
-
box-sizing: initial;
|
490
|
-
background: #fff;
|
491
|
-
border-radius: 4px;
|
492
|
-
box-shadow: 0 0 0 1px rgba(0,0,0,.15), 0 8px 16px rgba(0,0,0,.15);
|
493
|
-
}
|
494
|
-
.sketch-saturation {
|
495
|
-
width: 100%;
|
496
|
-
padding-bottom: 75%;
|
497
|
-
position: relative;
|
498
|
-
overflow: hidden;
|
499
|
-
}
|
500
|
-
.sketch-fields-container {
|
501
|
-
display: block;
|
502
|
-
}
|
503
|
-
.sketch-swatches-container {
|
504
|
-
display: block;
|
505
|
-
}
|
506
|
-
.sketch-controls {
|
507
|
-
display: flex;
|
508
|
-
}
|
509
|
-
.sketch-sliders {
|
510
|
-
padding: 4px 0px;
|
511
|
-
-webkit-box-flex: 1;
|
512
|
-
flex: 1 1 0%;
|
513
|
-
}
|
514
|
-
.sketch-hue {
|
515
|
-
position: relative;
|
516
|
-
height: 10px;
|
517
|
-
overflow: hidden;
|
518
|
-
}
|
519
|
-
.sketch-alpha {
|
520
|
-
position: relative;
|
521
|
-
height: 10px;
|
522
|
-
margin-top: 4px;
|
523
|
-
overflow: hidden;
|
524
|
-
}
|
525
|
-
.sketch-color {
|
526
|
-
width: 24px;
|
527
|
-
height: 24px;
|
528
|
-
position: relative;
|
529
|
-
margin-top: 4px;
|
530
|
-
margin-left: 4px;
|
531
|
-
border-radius: 3px;
|
532
|
-
}
|
533
|
-
.sketch-active {
|
534
|
-
position: absolute;
|
535
|
-
top: 0px;
|
536
|
-
right: 0px;
|
537
|
-
bottom: 0px;
|
538
|
-
left: 0px;
|
539
|
-
border-radius: 2px;
|
540
|
-
box-shadow: rgba(0, 0, 0, 0.15) 0px 0px 0px 1px inset, rgba(0, 0, 0, 0.25) 0px 0px 4px inset;
|
541
|
-
}
|
542
|
-
:host-context([dir=rtl]) .sketch-color {
|
543
|
-
margin-right: 4px;
|
544
|
-
margin-left: 0;
|
545
|
-
}
|
546
|
-
`,
|
547
|
-
],
|
548
|
-
changeDetection: ChangeDetectionStrategy.OnPush,
|
549
|
-
preserveWhitespaces: false,
|
550
|
-
providers: [
|
551
|
-
{
|
552
|
-
provide: NG_VALUE_ACCESSOR,
|
553
|
-
useExisting: forwardRef(() => SketchComponent),
|
554
|
-
multi: true,
|
555
|
-
},
|
556
|
-
{
|
557
|
-
provide: ColorWrap,
|
558
|
-
useExisting: forwardRef(() => SketchComponent),
|
559
|
-
},
|
560
|
-
]
|
561
|
-
}]
|
562
|
-
}], ctorParameters: function () { return []; }, propDecorators: { disableAlpha: [{
|
563
|
-
type: Input
|
564
|
-
}], presetColors: [{
|
565
|
-
type: Input
|
566
|
-
}], width: [{
|
567
|
-
type: Input
|
568
|
-
}] } });
|
569
|
-
class ColorSketchModule {
|
570
|
-
}
|
571
|
-
ColorSketchModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.0", ngImport: i0, type: ColorSketchModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
572
|
-
ColorSketchModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.0.0", ngImport: i0, type: ColorSketchModule, declarations: [SketchComponent, SketchFieldsComponent,
|
573
|
-
SketchPresetColorsComponent], imports: [CommonModule,
|
574
|
-
AlphaModule,
|
575
|
-
CheckboardModule,
|
576
|
-
EditableInputModule,
|
577
|
-
HueModule,
|
578
|
-
SaturationModule,
|
579
|
-
SwatchModule], exports: [SketchComponent, SketchFieldsComponent,
|
580
|
-
SketchPresetColorsComponent] });
|
581
|
-
ColorSketchModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.0.0", ngImport: i0, type: ColorSketchModule, imports: [[
|
582
|
-
CommonModule,
|
583
|
-
AlphaModule,
|
584
|
-
CheckboardModule,
|
585
|
-
EditableInputModule,
|
586
|
-
HueModule,
|
587
|
-
SaturationModule,
|
588
|
-
SwatchModule,
|
589
|
-
]] });
|
590
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.0", ngImport: i0, type: ColorSketchModule, decorators: [{
|
591
|
-
type: NgModule,
|
592
|
-
args: [{
|
593
|
-
declarations: [
|
594
|
-
SketchComponent,
|
595
|
-
SketchFieldsComponent,
|
596
|
-
SketchPresetColorsComponent,
|
597
|
-
],
|
598
|
-
exports: [
|
599
|
-
SketchComponent,
|
600
|
-
SketchFieldsComponent,
|
601
|
-
SketchPresetColorsComponent,
|
602
|
-
],
|
603
|
-
imports: [
|
604
|
-
CommonModule,
|
605
|
-
AlphaModule,
|
606
|
-
CheckboardModule,
|
607
|
-
EditableInputModule,
|
608
|
-
HueModule,
|
609
|
-
SaturationModule,
|
610
|
-
SwatchModule,
|
611
|
-
],
|
612
|
-
}]
|
613
|
-
}] });
|
614
|
-
|
615
|
-
/**
|
616
|
-
* Generated bundle index. Do not edit.
|
617
|
-
*/
|
618
|
-
|
619
|
-
export { ColorSketchModule, SketchComponent, SketchFieldsComponent, SketchPresetColorsComponent };
|
620
|
-
//# sourceMappingURL=ngx-color-sketch.mjs.map
|
@@ -1 +0,0 @@
|
|
1
|
-
{"version":3,"file":"ngx-color-sketch.mjs","sources":["../../src/lib/sketch/sketch-fields.component.ts","../../src/lib/sketch/sketch-preset-colors.component.ts","../../src/lib/sketch/sketch.component.ts","../../src/lib/sketch/ngx-color-sketch.ts"],"sourcesContent":["import {\n ChangeDetectionStrategy,\n Component,\n EventEmitter,\n Input,\n Output,\n} from '@angular/core';\n\nimport { isValidHex, HSLA, RGBA } from 'ngx-color';\nimport { TinyColor } from '@ctrl/tinycolor';\n\n@Component({\n selector: 'color-sketch-fields',\n template: `\n <div class=\"sketch-fields\">\n <div class=\"sketch-double\">\n <color-editable-input\n [style]=\"{ input: input, label: label }\"\n label=\"hex\"\n [value]=\"hex.replace('#', '')\"\n (onChange)=\"handleChange($event)\"\n ></color-editable-input>\n </div>\n <div class=\"sketch-single\">\n <color-editable-input\n [style]=\"{ input: input, label: label }\"\n label=\"r\"\n [value]=\"rgb.r\"\n (onChange)=\"handleChange($event)\"\n [dragLabel]=\"true\"\n [dragMax]=\"255\"\n ></color-editable-input>\n </div>\n <div class=\"sketch-single\">\n <color-editable-input\n [style]=\"{ input: input, label: label }\"\n label=\"g\"\n [value]=\"rgb.g\"\n (onChange)=\"handleChange($event)\"\n [dragLabel]=\"true\"\n [dragMax]=\"255\"\n ></color-editable-input>\n </div>\n <div class=\"sketch-single\">\n <color-editable-input\n [style]=\"{ input: input, label: label }\"\n label=\"b\"\n [value]=\"rgb.b\"\n (onChange)=\"handleChange($event)\"\n [dragLabel]=\"true\"\n [dragMax]=\"255\"\n ></color-editable-input>\n </div>\n <div class=\"sketch-alpha\" *ngIf=\"disableAlpha === false\">\n <color-editable-input\n [style]=\"{ input: input, label: label }\"\n label=\"a\"\n [value]=\"round(rgb.a * 100)\"\n (onChange)=\"handleChange($event)\"\n [dragLabel]=\"true\"\n [dragMax]=\"100\"\n ></color-editable-input>\n </div>\n </div>\n `,\n styles: [\n `\n .sketch-fields {\n display: flex;\n padding-top: 4px;\n }\n .sketch-double {\n -webkit-box-flex: 2;\n flex: 2 1 0%;\n }\n .sketch-single {\n flex: 1 1 0%;\n padding-left: 6px;\n }\n .sketch-alpha {\n -webkit-box-flex: 1;\n flex: 1 1 0%;\n padding-left: 6px;\n }\n :host-context([dir=rtl]) .sketch-single {\n padding-right: 6px;\n padding-left: 0;\n }\n :host-context([dir=rtl]) .sketch-alpha {\n padding-right: 6px;\n padding-left: 0;\n }\n `,\n ],\n changeDetection: ChangeDetectionStrategy.OnPush,\n preserveWhitespaces: false,\n})\nexport class SketchFieldsComponent {\n @Input() hsl!: HSLA;\n @Input() rgb!: RGBA;\n @Input() hex!: string;\n @Input() disableAlpha = false;\n @Output() onChange = new EventEmitter<any>();\n input: {[key: string]: string} = {\n width: '100%',\n padding: '4px 10% 3px',\n border: 'none',\n boxSizing: 'border-box',\n boxShadow: 'inset 0 0 0 1px #ccc',\n fontSize: '11px',\n };\n label: {[key: string]: string} = {\n display: 'block',\n textAlign: 'center',\n fontSize: '11px',\n color: '#222',\n paddingTop: '3px',\n paddingBottom: '4px',\n textTransform: 'capitalize',\n };\n\n round(value) {\n return Math.round(value);\n }\n handleChange({ data, $event }) {\n if (data.hex) {\n if (isValidHex(data.hex)) {\n const color = new TinyColor(data.hex);\n this.onChange.emit({\n data: {\n hex: this.disableAlpha || data.hex.length <= 6 ? color.toHex() : color.toHex8(),\n source: 'hex',\n },\n $event,\n });\n }\n } else if (data.r || data.g || data.b) {\n this.onChange.emit({\n data: {\n r: data.r || this.rgb.r,\n g: data.g || this.rgb.g,\n b: data.b || this.rgb.b,\n source: 'rgb',\n },\n $event,\n });\n } else if (data.a) {\n if (data.a < 0) {\n data.a = 0;\n } else if (data.a > 100) {\n data.a = 100;\n }\n data.a /= 100;\n\n if (this.disableAlpha) {\n data.a = 1;\n }\n\n this.onChange.emit({\n data: {\n h: this.hsl.h,\n s: this.hsl.s,\n l: this.hsl.l,\n a: Math.round(data.a * 100) / 100,\n source: 'rgb',\n },\n $event,\n });\n } else if (data.h || data.s || data.l) {\n this.onChange.emit({\n data: {\n h: data.h || this.hsl.h,\n s: Number((data.s && data.s) || this.hsl.s),\n l: Number((data.l && data.l) || this.hsl.l),\n source: 'hsl',\n },\n $event,\n });\n }\n }\n}\n","import {\n ChangeDetectionStrategy,\n Component,\n EventEmitter,\n Input,\n Output,\n} from '@angular/core';\n\nimport { Shape } from 'ngx-color';\n\n@Component({\n selector: 'color-sketch-preset-colors',\n template: `\n <div class=\"sketch-swatches\">\n <div class=\"sketch-wrap\" *ngFor=\"let c of colors\">\n <color-swatch\n [color]=\"normalizeValue(c).color\"\n [style]=\"swatchStyle\"\n [focusStyle]=\"focusStyle(c)\"\n (onClick)=\"handleClick($event)\"\n (onHover)=\"onSwatchHover.emit($event)\"\n class=\"swatch\"\n ></color-swatch>\n </div>\n </div>\n `,\n styles: [\n `\n .sketch-swatches {\n position: relative;\n display: flex;\n flex-wrap: wrap;\n margin: 0px -10px;\n padding: 10px 0px 0px 10px;\n border-top: 1px solid rgb(238, 238, 238);\n }\n .sketch-wrap {\n width: 16px;\n height: 16px;\n margin: 0px 10px 10px 0px;\n }\n :host-context([dir=rtl]) .sketch-swatches {\n padding-right: 10px;\n padding-left: 0;\n }\n :host-context([dir=rtl]) .sketch-wrap {\n margin-left: 10px;\n margin-right: 0;\n }\n `,\n ],\n changeDetection: ChangeDetectionStrategy.OnPush,\n preserveWhitespaces: false,\n})\nexport class SketchPresetColorsComponent {\n @Input() colors!: string[];\n @Output() onClick = new EventEmitter<any>();\n @Output() onSwatchHover = new EventEmitter<any>();\n swatchStyle = {\n borderRadius: '3px',\n boxShadow: 'inset 0 0 0 1px rgba(0,0,0,.15)',\n };\n\n handleClick({ hex, $event }) {\n this.onClick.emit({ hex, $event });\n }\n normalizeValue(val: string | Shape) {\n if (typeof val === 'string') {\n return { color: val };\n }\n return val;\n }\n focusStyle(val: string | Shape) {\n const c = this.normalizeValue(val);\n return {\n boxShadow: `inset 0 0 0 1px rgba(0,0,0,.15), 0 0 4px ${c.color}`,\n };\n }\n}\n","import { CommonModule } from '@angular/common';\nimport { ChangeDetectionStrategy, Component, forwardRef, Input, NgModule } from '@angular/core';\n\nimport {\n AlphaModule,\n CheckboardModule,\n ColorWrap,\n EditableInputModule,\n HueModule,\n isValidHex,\n SaturationModule,\n SwatchModule,\n} from 'ngx-color';\nimport { SketchFieldsComponent } from './sketch-fields.component';\nimport { SketchPresetColorsComponent } from './sketch-preset-colors.component';\nimport { NG_VALUE_ACCESSOR } from '@angular/forms';\n\n@Component({\n selector: 'color-sketch',\n template: `\n <div class=\"sketch-picker {{ className }}\" [style.width]=\"width\">\n <div class=\"sketch-saturation\">\n <color-saturation [hsl]=\"hsl\" [hsv]=\"hsv\"\n (onChange)=\"handleValueChange($event)\"\n >\n </color-saturation>\n </div>\n <div class=\"sketch-controls\">\n <div class=\"sketch-sliders\">\n <div class=\"sketch-hue\">\n <color-hue [hsl]=\"hsl\"\n (onChange)=\"handleValueChange($event)\"\n ></color-hue>\n </div>\n <div class=\"sketch-alpha\" *ngIf=\"disableAlpha === false\">\n <color-alpha\n [radius]=\"2\" [rgb]=\"rgb\" [hsl]=\"hsl\"\n (onChange)=\"handleValueChange($event)\"\n ></color-alpha>\n </div>\n </div>\n <div class=\"sketch-color\">\n <color-checkboard></color-checkboard>\n <div class=\"sketch-active\" [style.background]=\"activeBackground\"></div>\n </div>\n </div>\n <div class=\"sketch-fields-container\">\n <color-sketch-fields\n [rgb]=\"rgb\" [hsl]=\"hsl\" [hex]=\"hex\"\n [disableAlpha]=\"disableAlpha\"\n (onChange)=\"handleValueChange($event)\"\n ></color-sketch-fields>\n </div>\n <div class=\"sketch-swatches-container\" *ngIf=\"presetColors && presetColors.length\">\n <color-sketch-preset-colors\n [colors]=\"presetColors\"\n (onClick)=\"handleBlockChange($event)\"\n (onSwatchHover)=\"onSwatchHover.emit($event)\"\n ></color-sketch-preset-colors>\n </div>\n </div>\n `,\n styles: [\n `\n .sketch-picker {\n padding: 10px 10px 3px;\n box-sizing: initial;\n background: #fff;\n border-radius: 4px;\n box-shadow: 0 0 0 1px rgba(0,0,0,.15), 0 8px 16px rgba(0,0,0,.15);\n }\n .sketch-saturation {\n width: 100%;\n padding-bottom: 75%;\n position: relative;\n overflow: hidden;\n }\n .sketch-fields-container {\n display: block;\n }\n .sketch-swatches-container {\n display: block;\n }\n .sketch-controls {\n display: flex;\n }\n .sketch-sliders {\n padding: 4px 0px;\n -webkit-box-flex: 1;\n flex: 1 1 0%;\n }\n .sketch-hue {\n position: relative;\n height: 10px;\n overflow: hidden;\n }\n .sketch-alpha {\n position: relative;\n height: 10px;\n margin-top: 4px;\n overflow: hidden;\n }\n .sketch-color {\n width: 24px;\n height: 24px;\n position: relative;\n margin-top: 4px;\n margin-left: 4px;\n border-radius: 3px;\n }\n .sketch-active {\n position: absolute;\n top: 0px;\n right: 0px;\n bottom: 0px;\n left: 0px;\n border-radius: 2px;\n box-shadow: rgba(0, 0, 0, 0.15) 0px 0px 0px 1px inset, rgba(0, 0, 0, 0.25) 0px 0px 4px inset;\n }\n :host-context([dir=rtl]) .sketch-color {\n margin-right: 4px;\n margin-left: 0;\n }\n `,\n ],\n changeDetection: ChangeDetectionStrategy.OnPush,\n preserveWhitespaces: false,\n providers: [\n {\n provide: NG_VALUE_ACCESSOR,\n useExisting: forwardRef(() => SketchComponent),\n multi: true,\n },\n {\n provide: ColorWrap,\n useExisting: forwardRef(() => SketchComponent),\n },\n ]\n})\nexport class SketchComponent extends ColorWrap {\n /** Remove alpha slider and options from picker */\n @Input() disableAlpha = false;\n /** Hex strings for default colors at bottom of picker */\n @Input() presetColors = [\n '#D0021B',\n '#F5A623',\n '#F8E71C',\n '#8B572A',\n '#7ED321',\n '#417505',\n '#BD10E0',\n '#9013FE',\n '#4A90E2',\n '#50E3C2',\n '#B8E986',\n '#000000',\n '#4A4A4A',\n '#9B9B9B',\n '#FFFFFF',\n ];\n /** Width of picker */\n @Input() width = 200;\n activeBackground!: string;\n constructor() {\n super();\n }\n afterValidChange() {\n const alpha = this.disableAlpha ? 1 : this.rgb.a;\n this.activeBackground = `rgba(${this.rgb.r}, ${this.rgb.g}, ${this.rgb.b}, ${alpha})`;\n }\n handleValueChange({ data, $event }) {\n this.handleChange(data, $event);\n }\n handleBlockChange({ hex, $event }) {\n if (isValidHex(hex)) {\n // this.hex = hex;\n this.handleChange(\n {\n hex,\n source: 'hex',\n },\n $event,\n );\n }\n }\n}\n\n@NgModule({\n declarations: [\n SketchComponent,\n SketchFieldsComponent,\n SketchPresetColorsComponent,\n ],\n exports: [\n SketchComponent,\n SketchFieldsComponent,\n SketchPresetColorsComponent,\n ],\n imports: [\n CommonModule,\n AlphaModule,\n CheckboardModule,\n EditableInputModule,\n HueModule,\n SaturationModule,\n SwatchModule,\n ],\n})\nexport class ColorSketchModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}
|