ngx-color 8.0.2 → 9.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 +1 -1
- package/editable-input.component.d.ts +1 -1
- package/esm2022/alpha/alpha-picker.component.mjs +102 -0
- package/esm2022/alpha.component.mjs +146 -0
- package/esm2022/block/block-swatches.component.mjs +63 -0
- package/esm2022/block/block.component.mjs +160 -0
- package/esm2022/checkboard.component.mjs +53 -0
- package/esm2022/chrome/chrome-fields.component.mjs +317 -0
- package/esm2022/chrome/chrome.component.mjs +187 -0
- package/esm2022/circle/circle-swatch.component.mjs +69 -0
- package/esm2022/circle/circle.component.mjs +136 -0
- package/esm2022/color-wrap.component.mjs +173 -0
- package/esm2022/compact/compact-color.component.mjs +71 -0
- package/esm2022/compact/compact-fields.component.mjs +165 -0
- package/esm2022/compact/compact.component.mjs +156 -0
- package/esm2022/coordinates.directive.mjs +108 -0
- package/esm2022/editable-input.component.mjs +212 -0
- package/esm2022/github/github-swatch.component.mjs +53 -0
- package/esm2022/github/github.component.mjs +114 -0
- package/esm2022/hue/hue-picker.component.mjs +102 -0
- package/esm2022/hue.component.mjs +128 -0
- package/esm2022/material/material.component.mjs +188 -0
- package/esm2022/photoshop/photoshop-button.component.mjs +33 -0
- package/esm2022/photoshop/photoshop-fields.component.mjs +214 -0
- package/esm2022/photoshop/photoshop-previews.component.mjs +40 -0
- package/esm2022/photoshop/photoshop.component.mjs +187 -0
- package/esm2022/raised.component.mjs +50 -0
- package/esm2022/saturation.component.mjs +100 -0
- package/esm2022/shade/shade-picker.component.mjs +94 -0
- package/esm2022/shade.component.mjs +133 -0
- package/esm2022/sketch/sketch-fields.component.mjs +211 -0
- package/esm2022/sketch/sketch-preset-colors.component.mjs +68 -0
- package/esm2022/sketch/sketch.component.mjs +215 -0
- package/esm2022/slider/slider-swatch.component.mjs +55 -0
- package/esm2022/slider/slider-swatches.component.mjs +119 -0
- package/esm2022/slider/slider.component.mjs +104 -0
- package/esm2022/swatch.component.mjs +112 -0
- package/esm2022/swatches/swatches-color.component.mjs +105 -0
- package/esm2022/swatches/swatches-group.component.mjs +50 -0
- package/esm2022/swatches/swatches.component.mjs +244 -0
- package/esm2022/twitter/twitter.component.mjs +161 -0
- package/{fesm2020 → fesm2022}/ngx-color-alpha.mjs +30 -30
- package/fesm2022/ngx-color-alpha.mjs.map +1 -0
- package/{fesm2020 → fesm2022}/ngx-color-block.mjs +65 -66
- package/fesm2022/ngx-color-block.mjs.map +1 -0
- package/{fesm2015 → fesm2022}/ngx-color-chrome.mjs +77 -74
- package/{fesm2020 → fesm2022}/ngx-color-chrome.mjs.map +1 -1
- package/{fesm2015 → fesm2022}/ngx-color-circle.mjs +61 -62
- package/fesm2022/ngx-color-circle.mjs.map +1 -0
- package/{fesm2015 → fesm2022}/ngx-color-compact.mjs +136 -136
- package/{fesm2015 → fesm2022}/ngx-color-compact.mjs.map +1 -1
- package/{fesm2015 → fesm2022}/ngx-color-github.mjs +53 -54
- package/{fesm2020 → fesm2022}/ngx-color-github.mjs.map +1 -1
- package/{fesm2020 → fesm2022}/ngx-color-hue.mjs +32 -32
- package/fesm2022/ngx-color-hue.mjs.map +1 -0
- package/{fesm2015 → fesm2022}/ngx-color-material.mjs +59 -59
- package/{fesm2015 → fesm2022}/ngx-color-material.mjs.map +1 -1
- package/{fesm2020 → fesm2022}/ngx-color-photoshop.mjs +111 -113
- package/{fesm2015 → fesm2022}/ngx-color-photoshop.mjs.map +1 -1
- package/{fesm2015 → fesm2022}/ngx-color-shade.mjs +29 -29
- package/fesm2022/ngx-color-shade.mjs.map +1 -0
- package/{fesm2015 → fesm2022}/ngx-color-sketch.mjs +96 -95
- package/fesm2022/ngx-color-sketch.mjs.map +1 -0
- package/{fesm2020 → fesm2022}/ngx-color-slider.mjs +46 -45
- package/{fesm2015 → fesm2022}/ngx-color-slider.mjs.map +1 -1
- package/{fesm2015 → fesm2022}/ngx-color-swatches.mjs +182 -182
- package/fesm2022/ngx-color-swatches.mjs.map +1 -0
- package/{fesm2015 → fesm2022}/ngx-color-twitter.mjs +55 -55
- package/{fesm2015 → fesm2022}/ngx-color-twitter.mjs.map +1 -1
- package/{fesm2020 → fesm2022}/ngx-color.mjs +200 -160
- 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 +59 -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.component.mjs +0 -138
- package/esm2020/block/block-swatches.component.mjs +0 -63
- package/esm2020/block/block.component.mjs +0 -158
- 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/circle/circle-swatch.component.mjs +0 -69
- package/esm2020/circle/circle.component.mjs +0 -134
- 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/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/hue/hue-picker.component.mjs +0 -100
- package/esm2020/hue.component.mjs +0 -124
- package/esm2020/material/material.component.mjs +0 -186
- 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/raised.component.mjs +0 -50
- package/esm2020/saturation.component.mjs +0 -92
- package/esm2020/shade/shade-picker.component.mjs +0 -92
- package/esm2020/shade.component.mjs +0 -125
- 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/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/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/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.map +0 -1
- package/fesm2015/ngx-color-circle.mjs.map +0 -1
- 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-photoshop.mjs +0 -467
- package/fesm2015/ngx-color-shade.mjs.map +0 -1
- package/fesm2015/ngx-color-sketch.mjs.map +0 -1
- package/fesm2015/ngx-color-slider.mjs +0 -273
- package/fesm2015/ngx-color-swatches.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.map +0 -1
- package/fesm2020/ngx-color-chrome.mjs +0 -499
- 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-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.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.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
- /package/{esm2020 → esm2022}/alpha/ngx-color-alpha.mjs +0 -0
- /package/{esm2020 → esm2022}/alpha/public_api.mjs +0 -0
- /package/{esm2020 → esm2022}/block/ngx-color-block.mjs +0 -0
- /package/{esm2020 → esm2022}/block/public_api.mjs +0 -0
- /package/{esm2020 → esm2022}/chrome/ngx-color-chrome.mjs +0 -0
- /package/{esm2020 → esm2022}/chrome/public_api.mjs +0 -0
- /package/{esm2020 → esm2022}/circle/ngx-color-circle.mjs +0 -0
- /package/{esm2020 → esm2022}/circle/public_api.mjs +0 -0
- /package/{esm2020 → esm2022}/compact/ngx-color-compact.mjs +0 -0
- /package/{esm2020 → esm2022}/compact/public_api.mjs +0 -0
- /package/{esm2020 → esm2022}/github/ngx-color-github.mjs +0 -0
- /package/{esm2020 → esm2022}/github/public_api.mjs +0 -0
- /package/{esm2020 → esm2022}/helpers/checkboard.mjs +0 -0
- /package/{esm2020 → esm2022}/helpers/color.interfaces.mjs +0 -0
- /package/{esm2020 → esm2022}/helpers/color.mjs +0 -0
- /package/{esm2020 → esm2022}/hue/ngx-color-hue.mjs +0 -0
- /package/{esm2020 → esm2022}/hue/public_api.mjs +0 -0
- /package/{esm2020 → esm2022}/material/ngx-color-material.mjs +0 -0
- /package/{esm2020 → esm2022}/material/public_api.mjs +0 -0
- /package/{esm2020 → esm2022}/ngx-color.mjs +0 -0
- /package/{esm2020 → esm2022}/photoshop/ngx-color-photoshop.mjs +0 -0
- /package/{esm2020 → esm2022}/photoshop/public_api.mjs +0 -0
- /package/{esm2020 → esm2022}/public_api.mjs +0 -0
- /package/{esm2020 → esm2022}/shade/ngx-color-shade.mjs +0 -0
- /package/{esm2020 → esm2022}/shade/public_api.mjs +0 -0
- /package/{esm2020 → esm2022}/sketch/ngx-color-sketch.mjs +0 -0
- /package/{esm2020 → esm2022}/sketch/public_api.mjs +0 -0
- /package/{esm2020 → esm2022}/slider/ngx-color-slider.mjs +0 -0
- /package/{esm2020 → esm2022}/slider/public_api.mjs +0 -0
- /package/{esm2020 → esm2022}/swatches/ngx-color-swatches.mjs +0 -0
- /package/{esm2020 → esm2022}/swatches/public_api.mjs +0 -0
- /package/{esm2020 → esm2022}/twitter/ngx-color-twitter.mjs +0 -0
- /package/{esm2020 → esm2022}/twitter/public_api.mjs +0 -0
@@ -7,21 +7,21 @@ import { CommonModule } from '@angular/common';
|
|
7
7
|
import { NG_VALUE_ACCESSOR } from '@angular/forms';
|
8
8
|
|
9
9
|
class CompactColorComponent {
|
10
|
-
|
11
|
-
|
12
|
-
|
13
|
-
|
14
|
-
|
15
|
-
|
16
|
-
|
17
|
-
|
18
|
-
|
19
|
-
|
20
|
-
|
21
|
-
|
22
|
-
|
23
|
-
|
24
|
-
|
10
|
+
color;
|
11
|
+
active;
|
12
|
+
onClick = new EventEmitter();
|
13
|
+
onSwatchHover = new EventEmitter();
|
14
|
+
swatchStyle = {
|
15
|
+
width: '15px',
|
16
|
+
height: '15px',
|
17
|
+
float: 'left',
|
18
|
+
marginRight: '5px',
|
19
|
+
marginBottom: '5px',
|
20
|
+
position: 'relative',
|
21
|
+
cursor: 'pointer',
|
22
|
+
};
|
23
|
+
swatchFocus = {};
|
24
|
+
getContrastingColor = getContrastingColor;
|
25
25
|
ngOnChanges() {
|
26
26
|
this.swatchStyle.background = this.color;
|
27
27
|
this.swatchFocus.boxShadow = `0 0 4px ${this.color}`;
|
@@ -32,9 +32,8 @@ class CompactColorComponent {
|
|
32
32
|
handleClick({ hex, $event }) {
|
33
33
|
this.onClick.emit({ hex, $event });
|
34
34
|
}
|
35
|
-
}
|
36
|
-
|
37
|
-
CompactColorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.2", type: CompactColorComponent, selector: "color-compact-color", inputs: { color: "color", active: "active" }, outputs: { onClick: "onClick", onSwatchHover: "onSwatchHover" }, usesOnChanges: true, ngImport: i0, template: `
|
35
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: CompactColorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
36
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.1", type: CompactColorComponent, selector: "color-compact-color", inputs: { color: "color", active: "active" }, outputs: { onClick: "onClick", onSwatchHover: "onSwatchHover" }, usesOnChanges: true, ngImport: i0, template: `
|
38
37
|
<div class="compact-color">
|
39
38
|
<color-swatch class="swatch"
|
40
39
|
[color]="color" [style]="swatchStyle"
|
@@ -46,8 +45,9 @@ CompactColorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0",
|
|
46
45
|
></div>
|
47
46
|
</color-swatch>
|
48
47
|
</div>
|
49
|
-
`, isInline: true, styles: [".compact-dot{position:absolute;
|
50
|
-
|
48
|
+
`, isInline: true, styles: [".compact-dot{position:absolute;inset:5px;border-radius:50%;opacity:0}.compact-dot.active{opacity:1}\n"], dependencies: [{ kind: "component", type: i1.SwatchComponent, selector: "color-swatch", inputs: ["color", "style", "focusStyle", "focus"], outputs: ["onClick", "onHover"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
49
|
+
}
|
50
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: CompactColorComponent, decorators: [{
|
51
51
|
type: Component,
|
52
52
|
args: [{ selector: 'color-compact-color', template: `
|
53
53
|
<div class="compact-color">
|
@@ -61,7 +61,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.2", ngImpor
|
|
61
61
|
></div>
|
62
62
|
</color-swatch>
|
63
63
|
</div>
|
64
|
-
`, changeDetection: ChangeDetectionStrategy.OnPush, preserveWhitespaces: false, styles: [".compact-dot{position:absolute;
|
64
|
+
`, changeDetection: ChangeDetectionStrategy.OnPush, preserveWhitespaces: false, styles: [".compact-dot{position:absolute;inset:5px;border-radius:50%;opacity:0}.compact-dot.active{opacity:1}\n"] }]
|
65
65
|
}], propDecorators: { color: [{
|
66
66
|
type: Input
|
67
67
|
}], active: [{
|
@@ -73,55 +73,55 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.2", ngImpor
|
|
73
73
|
}] } });
|
74
74
|
|
75
75
|
class CompactFieldsComponent {
|
76
|
-
|
77
|
-
|
78
|
-
|
79
|
-
|
80
|
-
|
81
|
-
|
82
|
-
|
83
|
-
|
84
|
-
|
85
|
-
|
86
|
-
|
87
|
-
|
88
|
-
|
89
|
-
|
90
|
-
|
91
|
-
|
92
|
-
|
93
|
-
|
94
|
-
|
95
|
-
|
96
|
-
|
97
|
-
|
98
|
-
|
99
|
-
|
100
|
-
|
101
|
-
|
102
|
-
|
103
|
-
|
104
|
-
|
105
|
-
|
106
|
-
|
107
|
-
|
108
|
-
|
109
|
-
|
110
|
-
|
111
|
-
|
112
|
-
|
113
|
-
|
114
|
-
|
115
|
-
|
116
|
-
|
117
|
-
|
118
|
-
|
119
|
-
|
120
|
-
|
121
|
-
|
122
|
-
|
123
|
-
|
124
|
-
}
|
76
|
+
hex;
|
77
|
+
rgb;
|
78
|
+
onChange = new EventEmitter();
|
79
|
+
HEXWrap = {
|
80
|
+
marginTop: '-3px',
|
81
|
+
marginBottom: '-3px',
|
82
|
+
// flex: '6 1 0%',
|
83
|
+
position: 'relative',
|
84
|
+
};
|
85
|
+
HEXinput = {
|
86
|
+
width: '80%',
|
87
|
+
padding: '0px',
|
88
|
+
paddingLeft: '20%',
|
89
|
+
border: 'none',
|
90
|
+
outline: 'none',
|
91
|
+
background: 'none',
|
92
|
+
fontSize: '12px',
|
93
|
+
color: '#333',
|
94
|
+
height: '16px',
|
95
|
+
};
|
96
|
+
HEXlabel = {
|
97
|
+
display: 'none',
|
98
|
+
};
|
99
|
+
RGBwrap = {
|
100
|
+
marginTop: '-3px',
|
101
|
+
marginBottom: '-3px',
|
102
|
+
// flex: '3 1 0%',
|
103
|
+
position: 'relative',
|
104
|
+
};
|
105
|
+
RGBinput = {
|
106
|
+
width: '80%',
|
107
|
+
padding: '0px',
|
108
|
+
paddingLeft: '30%',
|
109
|
+
border: 'none',
|
110
|
+
outline: 'none',
|
111
|
+
background: 'none',
|
112
|
+
fontSize: '12px',
|
113
|
+
color: '#333',
|
114
|
+
height: '16px',
|
115
|
+
};
|
116
|
+
RGBlabel = {
|
117
|
+
position: 'absolute',
|
118
|
+
top: '6px',
|
119
|
+
left: '0px',
|
120
|
+
'line-height': '16px',
|
121
|
+
'text-transform': 'uppercase',
|
122
|
+
fontSize: '12px',
|
123
|
+
color: '#999',
|
124
|
+
};
|
125
125
|
handleChange({ data, $event }) {
|
126
126
|
if (data.hex) {
|
127
127
|
if (isValidHex(data.hex)) {
|
@@ -146,9 +146,8 @@ class CompactFieldsComponent {
|
|
146
146
|
});
|
147
147
|
}
|
148
148
|
}
|
149
|
-
}
|
150
|
-
|
151
|
-
CompactFieldsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.2", type: CompactFieldsComponent, selector: "color-compact-fields", inputs: { hex: "hex", rgb: "rgb" }, outputs: { onChange: "onChange" }, ngImport: i0, template: `
|
149
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: CompactFieldsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
150
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.1", type: CompactFieldsComponent, selector: "color-compact-fields", inputs: { hex: "hex", rgb: "rgb" }, outputs: { onChange: "onChange" }, ngImport: i0, template: `
|
152
151
|
<div class="compact-fields">
|
153
152
|
<div class="compact-active" [style.background]="hex"></div>
|
154
153
|
<div style="flex: 6 1 0%;">
|
@@ -185,7 +184,8 @@ CompactFieldsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0",
|
|
185
184
|
</div>
|
186
185
|
</div>
|
187
186
|
`, isInline: true, styles: [".compact-fields{display:flex;padding-bottom:6px;padding-right:5px;position:relative}.compact-active{position:absolute;top:6px;left:5px;height:9px;width:9px}\n"], dependencies: [{ kind: "component", type: i1.EditableInputComponent, selector: "color-editable-input", inputs: ["style", "label", "value", "arrowOffset", "dragLabel", "dragMax", "placeholder"], outputs: ["onChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
188
|
-
|
187
|
+
}
|
188
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: CompactFieldsComponent, decorators: [{
|
189
189
|
type: Component,
|
190
190
|
args: [{ selector: 'color-compact-fields', template: `
|
191
191
|
<div class="compact-fields">
|
@@ -233,51 +233,51 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.2", ngImpor
|
|
233
233
|
}] } });
|
234
234
|
|
235
235
|
class CompactComponent extends ColorWrap {
|
236
|
+
/** Color squares to display */
|
237
|
+
colors = [
|
238
|
+
'#4D4D4D',
|
239
|
+
'#999999',
|
240
|
+
'#FFFFFF',
|
241
|
+
'#F44E3B',
|
242
|
+
'#FE9200',
|
243
|
+
'#FCDC00',
|
244
|
+
'#DBDF00',
|
245
|
+
'#A4DD00',
|
246
|
+
'#68CCCA',
|
247
|
+
'#73D8FF',
|
248
|
+
'#AEA1FF',
|
249
|
+
'#FDA1FF',
|
250
|
+
'#333333',
|
251
|
+
'#808080',
|
252
|
+
'#cccccc',
|
253
|
+
'#D33115',
|
254
|
+
'#E27300',
|
255
|
+
'#FCC400',
|
256
|
+
'#B0BC00',
|
257
|
+
'#68BC00',
|
258
|
+
'#16A5A5',
|
259
|
+
'#009CE0',
|
260
|
+
'#7B64FF',
|
261
|
+
'#FA28FF',
|
262
|
+
'#000000',
|
263
|
+
'#666666',
|
264
|
+
'#B3B3B3',
|
265
|
+
'#9F0500',
|
266
|
+
'#C45100',
|
267
|
+
'#FB9E00',
|
268
|
+
'#808900',
|
269
|
+
'#194D33',
|
270
|
+
'#0C797D',
|
271
|
+
'#0062B1',
|
272
|
+
'#653294',
|
273
|
+
'#AB149E',
|
274
|
+
];
|
275
|
+
zDepth = 1;
|
276
|
+
radius = 1;
|
277
|
+
background = '#fff';
|
278
|
+
disableAlpha = true;
|
236
279
|
constructor() {
|
237
280
|
super();
|
238
|
-
/** Color squares to display */
|
239
|
-
this.colors = [
|
240
|
-
'#4D4D4D',
|
241
|
-
'#999999',
|
242
|
-
'#FFFFFF',
|
243
|
-
'#F44E3B',
|
244
|
-
'#FE9200',
|
245
|
-
'#FCDC00',
|
246
|
-
'#DBDF00',
|
247
|
-
'#A4DD00',
|
248
|
-
'#68CCCA',
|
249
|
-
'#73D8FF',
|
250
|
-
'#AEA1FF',
|
251
|
-
'#FDA1FF',
|
252
|
-
'#333333',
|
253
|
-
'#808080',
|
254
|
-
'#cccccc',
|
255
|
-
'#D33115',
|
256
|
-
'#E27300',
|
257
|
-
'#FCC400',
|
258
|
-
'#B0BC00',
|
259
|
-
'#68BC00',
|
260
|
-
'#16A5A5',
|
261
|
-
'#009CE0',
|
262
|
-
'#7B64FF',
|
263
|
-
'#FA28FF',
|
264
|
-
'#000000',
|
265
|
-
'#666666',
|
266
|
-
'#B3B3B3',
|
267
|
-
'#9F0500',
|
268
|
-
'#C45100',
|
269
|
-
'#FB9E00',
|
270
|
-
'#808900',
|
271
|
-
'#194D33',
|
272
|
-
'#0C797D',
|
273
|
-
'#0062B1',
|
274
|
-
'#653294',
|
275
|
-
'#AB149E',
|
276
|
-
];
|
277
|
-
this.zDepth = 1;
|
278
|
-
this.radius = 1;
|
279
|
-
this.background = '#fff';
|
280
|
-
this.disableAlpha = true;
|
281
281
|
}
|
282
282
|
handleBlockChange({ hex, $event }) {
|
283
283
|
if (isValidHex(hex)) {
|
@@ -287,19 +287,18 @@ class CompactComponent extends ColorWrap {
|
|
287
287
|
handleValueChange({ data, $event }) {
|
288
288
|
this.handleChange(data, $event);
|
289
289
|
}
|
290
|
-
}
|
291
|
-
|
292
|
-
|
293
|
-
|
294
|
-
|
295
|
-
|
296
|
-
|
297
|
-
|
298
|
-
|
299
|
-
|
300
|
-
|
301
|
-
|
302
|
-
], usesInheritance: true, ngImport: i0, template: `
|
290
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: CompactComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
291
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.1", type: CompactComponent, selector: "color-compact", inputs: { colors: "colors", zDepth: "zDepth", radius: "radius", background: "background" }, providers: [
|
292
|
+
{
|
293
|
+
provide: NG_VALUE_ACCESSOR,
|
294
|
+
useExisting: forwardRef(() => CompactComponent),
|
295
|
+
multi: true,
|
296
|
+
},
|
297
|
+
{
|
298
|
+
provide: ColorWrap,
|
299
|
+
useExisting: forwardRef(() => CompactComponent),
|
300
|
+
},
|
301
|
+
], usesInheritance: true, ngImport: i0, template: `
|
303
302
|
<color-raised class="color-compact" [zDepth]="zDepth" [background]="background" [radius]="radius">
|
304
303
|
<div class="compact-picker {{ className }}">
|
305
304
|
<div>
|
@@ -318,7 +317,8 @@ CompactComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", versi
|
|
318
317
|
</div>
|
319
318
|
</color-raised>
|
320
319
|
`, isInline: true, styles: [".color-compact{background:#f6f6f6;radius:4px}.compact-picker{padding-top:5px;padding-left:5px;box-sizing:border-box;width:245px}.compact-clear{clear:both}\n"], dependencies: [{ kind: "directive", type: i0.forwardRef(function () { return i1$1.NgForOf; }), selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: i0.forwardRef(function () { return i1.RaisedComponent; }), selector: "color-raised", inputs: ["zDepth", "radius", "background"] }, { kind: "component", type: i0.forwardRef(function () { return CompactColorComponent; }), selector: "color-compact-color", inputs: ["color", "active"], outputs: ["onClick", "onSwatchHover"] }, { kind: "component", type: i0.forwardRef(function () { return CompactFieldsComponent; }), selector: "color-compact-fields", inputs: ["hex", "rgb"], outputs: ["onChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
321
|
-
|
320
|
+
}
|
321
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: CompactComponent, decorators: [{
|
322
322
|
type: Component,
|
323
323
|
args: [{ selector: 'color-compact', template: `
|
324
324
|
<color-raised class="color-compact" [zDepth]="zDepth" [background]="background" [radius]="radius">
|
@@ -359,12 +359,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.2", ngImpor
|
|
359
359
|
type: Input
|
360
360
|
}] } });
|
361
361
|
class ColorCompactModule {
|
362
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: ColorCompactModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
363
|
+
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.0.1", ngImport: i0, type: ColorCompactModule, declarations: [CompactComponent, CompactColorComponent,
|
364
|
+
CompactFieldsComponent], imports: [CommonModule, EditableInputModule, SwatchModule, RaisedModule], exports: [CompactComponent, CompactColorComponent, CompactFieldsComponent] });
|
365
|
+
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: ColorCompactModule, imports: [CommonModule, EditableInputModule, SwatchModule, RaisedModule] });
|
362
366
|
}
|
363
|
-
|
364
|
-
ColorCompactModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.1.2", ngImport: i0, type: ColorCompactModule, declarations: [CompactComponent, CompactColorComponent,
|
365
|
-
CompactFieldsComponent], imports: [CommonModule, EditableInputModule, SwatchModule, RaisedModule], exports: [CompactComponent, CompactColorComponent, CompactFieldsComponent] });
|
366
|
-
ColorCompactModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.1.2", ngImport: i0, type: ColorCompactModule, imports: [CommonModule, EditableInputModule, SwatchModule, RaisedModule] });
|
367
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.2", ngImport: i0, type: ColorCompactModule, decorators: [{
|
367
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: ColorCompactModule, decorators: [{
|
368
368
|
type: NgModule,
|
369
369
|
args: [{
|
370
370
|
declarations: [
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"ngx-color-compact.mjs","sources":["../../src/lib/compact/compact-color.component.ts","../../src/lib/compact/compact-fields.component.ts","../../src/lib/compact/compact.component.ts","../../src/lib/compact/ngx-color-compact.ts"],"sourcesContent":["import {\n ChangeDetectionStrategy,\n Component,\n EventEmitter,\n Input,\n OnChanges,\n Output,\n} from '@angular/core';\n\nimport { getContrastingColor } from 'ngx-color';\n\n@Component({\n selector: 'color-compact-color',\n template: `\n <div class=\"compact-color\">\n <color-swatch class=\"swatch\"\n [color]=\"color\" [style]=\"swatchStyle\"\n [focusStyle]=\"swatchFocus\"\n (onClick)=\"handleClick($event)\" (onHover)=\"onSwatchHover.emit($event)\"\n >\n <div class=\"compact-dot\"\n [class.active]=\"active\" [style.background]=\"getContrastingColor(color)\"\n ></div>\n </color-swatch>\n </div>\n `,\n styles: [\n `\n .compact-dot {\n position: absolute;\n top: 5px;\n right: 5px;\n bottom: 5px;\n left: 5px;\n border-radius: 50%;\n opacity: 0;\n }\n .compact-dot.active {\n opacity: 1;\n }\n `,\n ],\n changeDetection: ChangeDetectionStrategy.OnPush,\n preserveWhitespaces: false,\n})\nexport class CompactColorComponent implements OnChanges {\n @Input() color!: string;\n @Input() active!: boolean;\n @Output() onClick = new EventEmitter<any>();\n @Output() onSwatchHover = new EventEmitter<any>();\n swatchStyle: Record<string, string> = {\n width: '15px',\n height: '15px',\n float: 'left',\n marginRight: '5px',\n marginBottom: '5px',\n position: 'relative',\n cursor: 'pointer',\n };\n swatchFocus: Record<string, string> = {};\n getContrastingColor = getContrastingColor;\n\n ngOnChanges() {\n this.swatchStyle.background = this.color;\n this.swatchFocus.boxShadow = `0 0 4px ${this.color}`;\n if (this.color.toLowerCase() === '#ffffff') {\n this.swatchStyle.boxShadow = 'inset 0 0 0 1px #ddd';\n }\n }\n handleClick({ hex, $event }) {\n this.onClick.emit({ hex, $event });\n }\n}\n","import {\n ChangeDetectionStrategy,\n Component,\n EventEmitter,\n Input,\n Output,\n} from '@angular/core';\n\nimport { isValidHex, RGBA } from 'ngx-color';\n\n@Component({\n selector: 'color-compact-fields',\n template: `\n <div class=\"compact-fields\">\n <div class=\"compact-active\" [style.background]=\"hex\"></div>\n <div style=\"flex: 6 1 0%;\">\n <color-editable-input\n [style]=\"{ wrap: HEXWrap, input: HEXinput, label: HEXlabel }\"\n label=\"hex\"\n [value]=\"hex\"\n (onChange)=\"handleChange($event)\"\n ></color-editable-input>\n </div>\n <div style=\"flex: 3 1 0%\">\n <color-editable-input\n [style]=\"{ wrap: RGBwrap, input: RGBinput, label: RGBlabel }\"\n label=\"r\"\n [value]=\"rgb.r\"\n (onChange)=\"handleChange($event)\"\n ></color-editable-input>\n </div>\n <div style=\"flex: 3 1 0%\">\n <color-editable-input\n [style]=\"{ wrap: RGBwrap, input: RGBinput, label: RGBlabel }\"\n label=\"g\"\n [value]=\"rgb.g\"\n (onChange)=\"handleChange($event)\"\n ></color-editable-input>\n </div>\n <div style=\"flex: 3 1 0%\">\n <color-editable-input\n [style]=\"{ wrap: RGBwrap, input: RGBinput, label: RGBlabel }\"\n label=\"b\"\n [value]=\"rgb.b\"\n (onChange)=\"handleChange($event)\"\n ></color-editable-input>\n </div>\n </div>\n `,\n styles: [\n `\n .compact-fields {\n display: flex;\n padding-bottom: 6px;\n padding-right: 5px;\n position: relative;\n }\n .compact-active {\n position: absolute;\n top: 6px;\n left: 5px;\n height: 9px;\n width: 9px;\n }\n `,\n ],\n changeDetection: ChangeDetectionStrategy.OnPush,\n preserveWhitespaces: false,\n})\nexport class CompactFieldsComponent {\n @Input() hex!: string;\n @Input() rgb!: RGBA;\n @Output() onChange = new EventEmitter<any>();\n HEXWrap: {[key: string]: string} = {\n marginTop: '-3px',\n marginBottom: '-3px',\n // flex: '6 1 0%',\n position: 'relative',\n };\n HEXinput: {[key: string]: string} = {\n width: '80%',\n padding: '0px',\n paddingLeft: '20%',\n border: 'none',\n outline: 'none',\n background: 'none',\n fontSize: '12px',\n color: '#333',\n height: '16px',\n };\n HEXlabel: {[key: string]: string} = {\n display: 'none',\n };\n RGBwrap: {[key: string]: string} = {\n marginTop: '-3px',\n marginBottom: '-3px',\n // flex: '3 1 0%',\n position: 'relative',\n };\n RGBinput: {[key: string]: string} = {\n width: '80%',\n padding: '0px',\n paddingLeft: '30%',\n border: 'none',\n outline: 'none',\n background: 'none',\n fontSize: '12px',\n color: '#333',\n height: '16px',\n };\n RGBlabel: {[key: string]: string} = {\n position: 'absolute',\n top: '6px',\n left: '0px',\n 'line-height': '16px',\n 'text-transform': 'uppercase',\n fontSize: '12px',\n color: '#999',\n };\n\n handleChange({ data, $event }) {\n if (data.hex) {\n if (isValidHex(data.hex)) {\n this.onChange.emit({\n data: {\n hex: data.hex,\n source: 'hex',\n },\n $event,\n });\n }\n } else {\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 }\n }\n}\n","import { CommonModule } from '@angular/common';\nimport { ChangeDetectionStrategy, Component, forwardRef, Input, NgModule } from '@angular/core';\n\nimport { ColorWrap, EditableInputModule, isValidHex, RaisedModule, SwatchModule, zDepth } from 'ngx-color';\nimport { CompactColorComponent } from './compact-color.component';\nimport { CompactFieldsComponent } from './compact-fields.component';\nimport { NG_VALUE_ACCESSOR } from '@angular/forms';\n\n@Component({\n selector: 'color-compact',\n template: `\n <color-raised class=\"color-compact\" [zDepth]=\"zDepth\" [background]=\"background\" [radius]=\"radius\">\n <div class=\"compact-picker {{ className }}\">\n <div>\n <color-compact-color\n *ngFor=\"let color of colors\" [color]=\"color\"\n [active]=\"color.toLowerCase() === hex.toLowerCase()\"\n (onClick)=\"handleBlockChange($event)\"\n ></color-compact-color>\n <div class=\"compact-clear\"></div>\n </div>\n <color-compact-fields\n [hex]=\"hex\"\n [rgb]=\"rgb\"\n (onChange)=\"handleValueChange($event)\"\n ></color-compact-fields>\n </div>\n </color-raised>\n `,\n styles: [\n `\n .color-compact {\n background: #f6f6f6;\n radius: 4px;\n }\n .compact-picker {\n padding-top: 5px;\n padding-left: 5px;\n box-sizing: border-box;\n width: 245px;\n }\n .compact-clear {\n clear: both;\n }\n `,\n ],\n changeDetection: ChangeDetectionStrategy.OnPush,\n preserveWhitespaces: false,\n providers: [\n {\n provide: NG_VALUE_ACCESSOR,\n useExisting: forwardRef(() => CompactComponent),\n multi: true,\n },\n {\n provide: ColorWrap,\n useExisting: forwardRef(() => CompactComponent),\n },\n ]\n})\nexport class CompactComponent extends ColorWrap {\n /** Color squares to display */\n @Input() colors = [\n '#4D4D4D',\n '#999999',\n '#FFFFFF',\n '#F44E3B',\n '#FE9200',\n '#FCDC00',\n '#DBDF00',\n '#A4DD00',\n '#68CCCA',\n '#73D8FF',\n '#AEA1FF',\n '#FDA1FF',\n '#333333',\n '#808080',\n '#cccccc',\n '#D33115',\n '#E27300',\n '#FCC400',\n '#B0BC00',\n '#68BC00',\n '#16A5A5',\n '#009CE0',\n '#7B64FF',\n '#FA28FF',\n '#000000',\n '#666666',\n '#B3B3B3',\n '#9F0500',\n '#C45100',\n '#FB9E00',\n '#808900',\n '#194D33',\n '#0C797D',\n '#0062B1',\n '#653294',\n '#AB149E',\n ];\n @Input() zDepth: zDepth = 1;\n @Input() radius = 1;\n @Input() background = '#fff';\n disableAlpha = true;\n\n constructor() {\n super();\n }\n handleBlockChange({ hex, $event }) {\n if (isValidHex(hex)) {\n this.handleChange({ hex, source: 'hex' }, $event);\n }\n }\n handleValueChange({ data, $event }) {\n this.handleChange(data, $event);\n }\n}\n\n@NgModule({\n declarations: [\n CompactComponent,\n CompactColorComponent,\n CompactFieldsComponent,\n ],\n exports: [CompactComponent, CompactColorComponent, CompactFieldsComponent],\n imports: [CommonModule, EditableInputModule, SwatchModule, RaisedModule],\n})\nexport class ColorCompactModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":["i1","i2"],"mappings":"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"}
|
1
|
+
{"version":3,"file":"ngx-color-compact.mjs","sources":["../../src/lib/compact/compact-color.component.ts","../../src/lib/compact/compact-fields.component.ts","../../src/lib/compact/compact.component.ts","../../src/lib/compact/ngx-color-compact.ts"],"sourcesContent":["import {\n ChangeDetectionStrategy,\n Component,\n EventEmitter,\n Input,\n OnChanges,\n Output,\n} from '@angular/core';\n\nimport { getContrastingColor } from 'ngx-color';\n\n@Component({\n selector: 'color-compact-color',\n template: `\n <div class=\"compact-color\">\n <color-swatch class=\"swatch\"\n [color]=\"color\" [style]=\"swatchStyle\"\n [focusStyle]=\"swatchFocus\"\n (onClick)=\"handleClick($event)\" (onHover)=\"onSwatchHover.emit($event)\"\n >\n <div class=\"compact-dot\"\n [class.active]=\"active\" [style.background]=\"getContrastingColor(color)\"\n ></div>\n </color-swatch>\n </div>\n `,\n styles: [\n `\n .compact-dot {\n position: absolute;\n top: 5px;\n right: 5px;\n bottom: 5px;\n left: 5px;\n border-radius: 50%;\n opacity: 0;\n }\n .compact-dot.active {\n opacity: 1;\n }\n `,\n ],\n changeDetection: ChangeDetectionStrategy.OnPush,\n preserveWhitespaces: false,\n})\nexport class CompactColorComponent implements OnChanges {\n @Input() color!: string;\n @Input() active!: boolean;\n @Output() onClick = new EventEmitter<any>();\n @Output() onSwatchHover = new EventEmitter<any>();\n swatchStyle: Record<string, string> = {\n width: '15px',\n height: '15px',\n float: 'left',\n marginRight: '5px',\n marginBottom: '5px',\n position: 'relative',\n cursor: 'pointer',\n };\n swatchFocus: Record<string, string> = {};\n getContrastingColor = getContrastingColor;\n\n ngOnChanges() {\n this.swatchStyle.background = this.color;\n this.swatchFocus.boxShadow = `0 0 4px ${this.color}`;\n if (this.color.toLowerCase() === '#ffffff') {\n this.swatchStyle.boxShadow = 'inset 0 0 0 1px #ddd';\n }\n }\n handleClick({ hex, $event }) {\n this.onClick.emit({ hex, $event });\n }\n}\n","import {\n ChangeDetectionStrategy,\n Component,\n EventEmitter,\n Input,\n Output,\n} from '@angular/core';\n\nimport { isValidHex, RGBA } from 'ngx-color';\n\n@Component({\n selector: 'color-compact-fields',\n template: `\n <div class=\"compact-fields\">\n <div class=\"compact-active\" [style.background]=\"hex\"></div>\n <div style=\"flex: 6 1 0%;\">\n <color-editable-input\n [style]=\"{ wrap: HEXWrap, input: HEXinput, label: HEXlabel }\"\n label=\"hex\"\n [value]=\"hex\"\n (onChange)=\"handleChange($event)\"\n ></color-editable-input>\n </div>\n <div style=\"flex: 3 1 0%\">\n <color-editable-input\n [style]=\"{ wrap: RGBwrap, input: RGBinput, label: RGBlabel }\"\n label=\"r\"\n [value]=\"rgb.r\"\n (onChange)=\"handleChange($event)\"\n ></color-editable-input>\n </div>\n <div style=\"flex: 3 1 0%\">\n <color-editable-input\n [style]=\"{ wrap: RGBwrap, input: RGBinput, label: RGBlabel }\"\n label=\"g\"\n [value]=\"rgb.g\"\n (onChange)=\"handleChange($event)\"\n ></color-editable-input>\n </div>\n <div style=\"flex: 3 1 0%\">\n <color-editable-input\n [style]=\"{ wrap: RGBwrap, input: RGBinput, label: RGBlabel }\"\n label=\"b\"\n [value]=\"rgb.b\"\n (onChange)=\"handleChange($event)\"\n ></color-editable-input>\n </div>\n </div>\n `,\n styles: [\n `\n .compact-fields {\n display: flex;\n padding-bottom: 6px;\n padding-right: 5px;\n position: relative;\n }\n .compact-active {\n position: absolute;\n top: 6px;\n left: 5px;\n height: 9px;\n width: 9px;\n }\n `,\n ],\n changeDetection: ChangeDetectionStrategy.OnPush,\n preserveWhitespaces: false,\n})\nexport class CompactFieldsComponent {\n @Input() hex!: string;\n @Input() rgb!: RGBA;\n @Output() onChange = new EventEmitter<any>();\n HEXWrap: {[key: string]: string} = {\n marginTop: '-3px',\n marginBottom: '-3px',\n // flex: '6 1 0%',\n position: 'relative',\n };\n HEXinput: {[key: string]: string} = {\n width: '80%',\n padding: '0px',\n paddingLeft: '20%',\n border: 'none',\n outline: 'none',\n background: 'none',\n fontSize: '12px',\n color: '#333',\n height: '16px',\n };\n HEXlabel: {[key: string]: string} = {\n display: 'none',\n };\n RGBwrap: {[key: string]: string} = {\n marginTop: '-3px',\n marginBottom: '-3px',\n // flex: '3 1 0%',\n position: 'relative',\n };\n RGBinput: {[key: string]: string} = {\n width: '80%',\n padding: '0px',\n paddingLeft: '30%',\n border: 'none',\n outline: 'none',\n background: 'none',\n fontSize: '12px',\n color: '#333',\n height: '16px',\n };\n RGBlabel: {[key: string]: string} = {\n position: 'absolute',\n top: '6px',\n left: '0px',\n 'line-height': '16px',\n 'text-transform': 'uppercase',\n fontSize: '12px',\n color: '#999',\n };\n\n handleChange({ data, $event }) {\n if (data.hex) {\n if (isValidHex(data.hex)) {\n this.onChange.emit({\n data: {\n hex: data.hex,\n source: 'hex',\n },\n $event,\n });\n }\n } else {\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 }\n }\n}\n","import { CommonModule } from '@angular/common';\nimport { ChangeDetectionStrategy, Component, forwardRef, Input, NgModule } from '@angular/core';\n\nimport { ColorWrap, EditableInputModule, isValidHex, RaisedModule, SwatchModule, zDepth } from 'ngx-color';\nimport { CompactColorComponent } from './compact-color.component';\nimport { CompactFieldsComponent } from './compact-fields.component';\nimport { NG_VALUE_ACCESSOR } from '@angular/forms';\n\n@Component({\n selector: 'color-compact',\n template: `\n <color-raised class=\"color-compact\" [zDepth]=\"zDepth\" [background]=\"background\" [radius]=\"radius\">\n <div class=\"compact-picker {{ className }}\">\n <div>\n <color-compact-color\n *ngFor=\"let color of colors\" [color]=\"color\"\n [active]=\"color.toLowerCase() === hex.toLowerCase()\"\n (onClick)=\"handleBlockChange($event)\"\n ></color-compact-color>\n <div class=\"compact-clear\"></div>\n </div>\n <color-compact-fields\n [hex]=\"hex\"\n [rgb]=\"rgb\"\n (onChange)=\"handleValueChange($event)\"\n ></color-compact-fields>\n </div>\n </color-raised>\n `,\n styles: [\n `\n .color-compact {\n background: #f6f6f6;\n radius: 4px;\n }\n .compact-picker {\n padding-top: 5px;\n padding-left: 5px;\n box-sizing: border-box;\n width: 245px;\n }\n .compact-clear {\n clear: both;\n }\n `,\n ],\n changeDetection: ChangeDetectionStrategy.OnPush,\n preserveWhitespaces: false,\n providers: [\n {\n provide: NG_VALUE_ACCESSOR,\n useExisting: forwardRef(() => CompactComponent),\n multi: true,\n },\n {\n provide: ColorWrap,\n useExisting: forwardRef(() => CompactComponent),\n },\n ]\n})\nexport class CompactComponent extends ColorWrap {\n /** Color squares to display */\n @Input() colors = [\n '#4D4D4D',\n '#999999',\n '#FFFFFF',\n '#F44E3B',\n '#FE9200',\n '#FCDC00',\n '#DBDF00',\n '#A4DD00',\n '#68CCCA',\n '#73D8FF',\n '#AEA1FF',\n '#FDA1FF',\n '#333333',\n '#808080',\n '#cccccc',\n '#D33115',\n '#E27300',\n '#FCC400',\n '#B0BC00',\n '#68BC00',\n '#16A5A5',\n '#009CE0',\n '#7B64FF',\n '#FA28FF',\n '#000000',\n '#666666',\n '#B3B3B3',\n '#9F0500',\n '#C45100',\n '#FB9E00',\n '#808900',\n '#194D33',\n '#0C797D',\n '#0062B1',\n '#653294',\n '#AB149E',\n ];\n @Input() zDepth: zDepth = 1;\n @Input() radius = 1;\n @Input() background = '#fff';\n disableAlpha = true;\n\n constructor() {\n super();\n }\n handleBlockChange({ hex, $event }) {\n if (isValidHex(hex)) {\n this.handleChange({ hex, source: 'hex' }, $event);\n }\n }\n handleValueChange({ data, $event }) {\n this.handleChange(data, $event);\n }\n}\n\n@NgModule({\n declarations: [\n CompactComponent,\n CompactColorComponent,\n CompactFieldsComponent,\n ],\n exports: [CompactComponent, CompactColorComponent, CompactFieldsComponent],\n imports: [CommonModule, EditableInputModule, SwatchModule, RaisedModule],\n})\nexport class ColorCompactModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":["i1","i2"],"mappings":"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"}
|
@@ -7,22 +7,20 @@ import { CommonModule } from '@angular/common';
|
|
7
7
|
import { NG_VALUE_ACCESSOR } from '@angular/forms';
|
8
8
|
|
9
9
|
class GithubSwatchComponent {
|
10
|
-
|
11
|
-
|
12
|
-
|
13
|
-
|
14
|
-
|
15
|
-
|
16
|
-
|
17
|
-
|
18
|
-
|
19
|
-
}
|
10
|
+
color;
|
11
|
+
onClick = new EventEmitter();
|
12
|
+
onSwatchHover = new EventEmitter();
|
13
|
+
focusStyle = {
|
14
|
+
position: 'relative',
|
15
|
+
'z-index': '2',
|
16
|
+
outline: '2px solid #fff',
|
17
|
+
'box-shadow': '0 0 5px 2px rgba(0,0,0,0.25)',
|
18
|
+
};
|
20
19
|
handleClick({ hex, $event }) {
|
21
20
|
this.onClick.emit({ hex, $event });
|
22
21
|
}
|
23
|
-
}
|
24
|
-
|
25
|
-
GithubSwatchComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.2", type: GithubSwatchComponent, selector: "color-github-swatch", inputs: { color: "color" }, outputs: { onClick: "onClick", onSwatchHover: "onSwatchHover" }, ngImport: i0, template: `
|
22
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: GithubSwatchComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
23
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.1", type: GithubSwatchComponent, selector: "color-github-swatch", inputs: { color: "color" }, outputs: { onClick: "onClick", onSwatchHover: "onSwatchHover" }, ngImport: i0, template: `
|
26
24
|
<div class="github-swatch">
|
27
25
|
<color-swatch
|
28
26
|
[color]="color"
|
@@ -34,7 +32,8 @@ GithubSwatchComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0",
|
|
34
32
|
<div class="clear"></div>
|
35
33
|
</div>
|
36
34
|
`, isInline: true, styles: [".github-swatch{width:25px;height:25px;font-size:0}\n"], dependencies: [{ kind: "component", type: i1.SwatchComponent, selector: "color-swatch", inputs: ["color", "style", "focusStyle", "focus"], outputs: ["onClick", "onHover"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
37
|
-
|
35
|
+
}
|
36
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: GithubSwatchComponent, decorators: [{
|
38
37
|
type: Component,
|
39
38
|
args: [{ selector: 'color-github-swatch', template: `
|
40
39
|
<div class="github-swatch">
|
@@ -57,30 +56,30 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.2", ngImpor
|
|
57
56
|
}] } });
|
58
57
|
|
59
58
|
class GithubComponent extends ColorWrap {
|
59
|
+
/** Pixel value for picker width */
|
60
|
+
width = 212;
|
61
|
+
/** Color squares to display */
|
62
|
+
colors = [
|
63
|
+
'#B80000',
|
64
|
+
'#DB3E00',
|
65
|
+
'#FCCB00',
|
66
|
+
'#008B02',
|
67
|
+
'#006B76',
|
68
|
+
'#1273DE',
|
69
|
+
'#004DCF',
|
70
|
+
'#5300EB',
|
71
|
+
'#EB9694',
|
72
|
+
'#FAD0C3',
|
73
|
+
'#FEF3BD',
|
74
|
+
'#C1E1C5',
|
75
|
+
'#BEDADC',
|
76
|
+
'#C4DEF6',
|
77
|
+
'#BED3F3',
|
78
|
+
'#D4C4FB',
|
79
|
+
];
|
80
|
+
triangle = 'top-left';
|
60
81
|
constructor() {
|
61
82
|
super();
|
62
|
-
/** Pixel value for picker width */
|
63
|
-
this.width = 212;
|
64
|
-
/** Color squares to display */
|
65
|
-
this.colors = [
|
66
|
-
'#B80000',
|
67
|
-
'#DB3E00',
|
68
|
-
'#FCCB00',
|
69
|
-
'#008B02',
|
70
|
-
'#006B76',
|
71
|
-
'#1273DE',
|
72
|
-
'#004DCF',
|
73
|
-
'#5300EB',
|
74
|
-
'#EB9694',
|
75
|
-
'#FAD0C3',
|
76
|
-
'#FEF3BD',
|
77
|
-
'#C1E1C5',
|
78
|
-
'#BEDADC',
|
79
|
-
'#C4DEF6',
|
80
|
-
'#BED3F3',
|
81
|
-
'#D4C4FB',
|
82
|
-
];
|
83
|
-
this.triangle = 'top-left';
|
84
83
|
}
|
85
84
|
handleBlockChange({ hex, $event }) {
|
86
85
|
if (isValidHex(hex)) {
|
@@ -90,19 +89,18 @@ class GithubComponent extends ColorWrap {
|
|
90
89
|
handleValueChange({ data, $event }) {
|
91
90
|
this.handleChange(data, $event);
|
92
91
|
}
|
93
|
-
}
|
94
|
-
|
95
|
-
|
96
|
-
|
97
|
-
|
98
|
-
|
99
|
-
|
100
|
-
|
101
|
-
|
102
|
-
|
103
|
-
|
104
|
-
|
105
|
-
], usesInheritance: true, ngImport: i0, template: `
|
92
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: GithubComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
93
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.1", type: GithubComponent, selector: "color-github", inputs: { width: "width", colors: "colors", triangle: "triangle" }, providers: [
|
94
|
+
{
|
95
|
+
provide: NG_VALUE_ACCESSOR,
|
96
|
+
useExisting: forwardRef(() => GithubComponent),
|
97
|
+
multi: true,
|
98
|
+
},
|
99
|
+
{
|
100
|
+
provide: ColorWrap,
|
101
|
+
useExisting: forwardRef(() => GithubComponent),
|
102
|
+
},
|
103
|
+
], usesInheritance: true, ngImport: i0, template: `
|
106
104
|
<div class="github-picker {{ triangle }}-triangle {{ className }}"
|
107
105
|
[style.width.px]="width"
|
108
106
|
>
|
@@ -115,7 +113,8 @@ GithubComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", versio
|
|
115
113
|
></color-github-swatch>
|
116
114
|
</div>
|
117
115
|
`, isInline: true, styles: [".github-picker{background:rgb(255,255,255);border:1px solid rgba(0,0,0,.2);box-shadow:#00000026 0 3px 12px;border-radius:4px;position:relative;padding:5px;display:flex;flex-wrap:wrap;box-sizing:border-box}.triangleShadow{position:absolute;border-width:8px;border-style:solid;border-color:transparent transparent rgba(0,0,0,.15);border-image:initial}.triangle{position:absolute;border-width:7px;border-style:solid;border-color:transparent transparent rgb(255,255,255);border-image:initial}.hide-triangle>.triangle{display:none}.hide-triangle>.triangleShadow{display:none}.top-left-triangle>.triangle{top:-14px;left:10px}.top-left-triangle>.triangleShadow{top:-16px;left:9px}.top-right-triangle>.triangle{top:-14px;right:10px}.top-right-triangle>.triangleShadow{top:-16px;right:9px}.bottom-right-triangle>.triangle{top:35px;right:10px;transform:rotate(180deg)}.bottom-right-triangle>.triangleShadow{top:37px;right:9px;transform:rotate(180deg)}\n"], dependencies: [{ kind: "directive", type: i0.forwardRef(function () { return i1$1.NgForOf; }), selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: i0.forwardRef(function () { return GithubSwatchComponent; }), selector: "color-github-swatch", inputs: ["color"], outputs: ["onClick", "onSwatchHover"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
118
|
-
|
116
|
+
}
|
117
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: GithubComponent, decorators: [{
|
119
118
|
type: Component,
|
120
119
|
args: [{ selector: 'color-github', template: `
|
121
120
|
<div class="github-picker {{ triangle }}-triangle {{ className }}"
|
@@ -148,11 +147,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.2", ngImpor
|
|
148
147
|
type: Input
|
149
148
|
}] } });
|
150
149
|
class ColorGithubModule {
|
150
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: ColorGithubModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
151
|
+
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.0.1", ngImport: i0, type: ColorGithubModule, declarations: [GithubComponent, GithubSwatchComponent], imports: [CommonModule, SwatchModule], exports: [GithubComponent, GithubSwatchComponent] });
|
152
|
+
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: ColorGithubModule, imports: [CommonModule, SwatchModule] });
|
151
153
|
}
|
152
|
-
|
153
|
-
ColorGithubModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.1.2", ngImport: i0, type: ColorGithubModule, declarations: [GithubComponent, GithubSwatchComponent], imports: [CommonModule, SwatchModule], exports: [GithubComponent, GithubSwatchComponent] });
|
154
|
-
ColorGithubModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.1.2", ngImport: i0, type: ColorGithubModule, imports: [CommonModule, SwatchModule] });
|
155
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.2", ngImport: i0, type: ColorGithubModule, decorators: [{
|
154
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: ColorGithubModule, decorators: [{
|
156
155
|
type: NgModule,
|
157
156
|
args: [{
|
158
157
|
declarations: [GithubComponent, GithubSwatchComponent],
|