ngx-color 8.0.3 → 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/{fesm2020 → 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 +94 -93
- package/{fesm2015 → fesm2022}/ngx-color-sketch.mjs.map +1 -1
- 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 +0 -499
- 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-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-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
@@ -1,193 +0,0 @@
|
|
1
|
-
import { CommonModule } from '@angular/common';
|
2
|
-
import * as i0 from '@angular/core';
|
3
|
-
import { forwardRef, Component, ChangeDetectionStrategy, Input, NgModule } from '@angular/core';
|
4
|
-
import * as i1 from 'ngx-color';
|
5
|
-
import { ColorWrap, isValidHex, EditableInputModule, RaisedModule } from 'ngx-color';
|
6
|
-
import { NG_VALUE_ACCESSOR } from '@angular/forms';
|
7
|
-
|
8
|
-
class MaterialComponent extends ColorWrap {
|
9
|
-
constructor() {
|
10
|
-
super();
|
11
|
-
this.HEXinput = {
|
12
|
-
width: '100%',
|
13
|
-
marginTop: '12px',
|
14
|
-
fontSize: '15px',
|
15
|
-
color: 'rgb(51, 51, 51)',
|
16
|
-
padding: '0px',
|
17
|
-
'border-width': '0px 0px 2px',
|
18
|
-
outline: 'none',
|
19
|
-
height: '30px',
|
20
|
-
};
|
21
|
-
this.HEXlabel = {
|
22
|
-
position: 'absolute',
|
23
|
-
top: '0px',
|
24
|
-
left: '0px',
|
25
|
-
fontSize: '11px',
|
26
|
-
color: 'rgb(153, 153, 153)',
|
27
|
-
'text-transform': 'capitalize',
|
28
|
-
};
|
29
|
-
this.RGBinput = {
|
30
|
-
width: '100%',
|
31
|
-
marginTop: '12px',
|
32
|
-
fontSize: '15px',
|
33
|
-
color: '#333',
|
34
|
-
padding: '0px',
|
35
|
-
border: '0px',
|
36
|
-
'border-bottom': '1px solid #eee',
|
37
|
-
outline: 'none',
|
38
|
-
height: '30px',
|
39
|
-
};
|
40
|
-
this.RGBlabel = {
|
41
|
-
position: 'absolute',
|
42
|
-
top: '0px',
|
43
|
-
left: '0px',
|
44
|
-
fontSize: '11px',
|
45
|
-
color: '#999999',
|
46
|
-
'text-transform': 'capitalize',
|
47
|
-
};
|
48
|
-
this.zDepth = 1;
|
49
|
-
this.radius = 1;
|
50
|
-
this.background = '#fff';
|
51
|
-
this.disableAlpha = true;
|
52
|
-
}
|
53
|
-
handleValueChange({ data, $event }) {
|
54
|
-
this.handleChange(data, $event);
|
55
|
-
}
|
56
|
-
handleInputChange({ data, $event }) {
|
57
|
-
if (data.hex) {
|
58
|
-
if (isValidHex(data.hex)) {
|
59
|
-
this.handleValueChange({
|
60
|
-
data: {
|
61
|
-
hex: data.hex,
|
62
|
-
source: 'hex',
|
63
|
-
},
|
64
|
-
$event,
|
65
|
-
});
|
66
|
-
}
|
67
|
-
}
|
68
|
-
else if (data.r || data.g || data.b) {
|
69
|
-
this.handleValueChange({
|
70
|
-
data: {
|
71
|
-
r: data.r || this.rgb.r,
|
72
|
-
g: data.g || this.rgb.g,
|
73
|
-
b: data.b || this.rgb.b,
|
74
|
-
source: 'rgb',
|
75
|
-
},
|
76
|
-
$event,
|
77
|
-
});
|
78
|
-
}
|
79
|
-
}
|
80
|
-
afterValidChange() {
|
81
|
-
this.HEXinput['border-bottom-color'] = this.hex;
|
82
|
-
}
|
83
|
-
}
|
84
|
-
MaterialComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.2", ngImport: i0, type: MaterialComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
85
|
-
MaterialComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.2", type: MaterialComponent, selector: "color-material", inputs: { zDepth: "zDepth", radius: "radius", background: "background" }, providers: [
|
86
|
-
{
|
87
|
-
provide: NG_VALUE_ACCESSOR,
|
88
|
-
useExisting: forwardRef(() => MaterialComponent),
|
89
|
-
multi: true,
|
90
|
-
},
|
91
|
-
{
|
92
|
-
provide: ColorWrap,
|
93
|
-
useExisting: forwardRef(() => MaterialComponent),
|
94
|
-
},
|
95
|
-
], usesInheritance: true, ngImport: i0, template: `
|
96
|
-
<color-raised [zDepth]="zDepth" [background]="background" [radius]="radius">
|
97
|
-
<div class="material-picker {{ className }}">
|
98
|
-
<color-editable-input label="hex" [value]="hex"
|
99
|
-
(onChange)="handleValueChange($event)"
|
100
|
-
[style]="{input: HEXinput, label: HEXlabel}"
|
101
|
-
></color-editable-input>
|
102
|
-
<div class="material-split">
|
103
|
-
<div class="material-third">
|
104
|
-
<color-editable-input label="r" [value]="rgb.r"
|
105
|
-
[style]="{ input: RGBinput, label: RGBlabel }"
|
106
|
-
(onChange)="handleInputChange($event)"
|
107
|
-
></color-editable-input>
|
108
|
-
</div>
|
109
|
-
<div class="material-third">
|
110
|
-
<color-editable-input label="g" [value]="rgb.g"
|
111
|
-
[style]="{ input: RGBinput, label: RGBlabel }"
|
112
|
-
(onChange)="handleInputChange($event)"
|
113
|
-
></color-editable-input>
|
114
|
-
</div>
|
115
|
-
<div class="material-third">
|
116
|
-
<color-editable-input label="b" [value]="rgb.b"
|
117
|
-
[style]="{ input: RGBinput, label: RGBlabel }"
|
118
|
-
(onChange)="handleInputChange($event)"
|
119
|
-
></color-editable-input>
|
120
|
-
</div>
|
121
|
-
</div>
|
122
|
-
</div>
|
123
|
-
</color-raised>
|
124
|
-
`, isInline: true, styles: [".material-picker{width:130px;height:130px;padding:16px;font-family:Roboto}.material-split{display:flex;margin-right:-10px;padding-top:11px}.material-third{flex:1 1 0%;padding-right:10px}\n"], dependencies: [{ kind: "component", type: i1.EditableInputComponent, selector: "color-editable-input", inputs: ["style", "label", "value", "arrowOffset", "dragLabel", "dragMax", "placeholder"], outputs: ["onChange"] }, { kind: "component", type: i1.RaisedComponent, selector: "color-raised", inputs: ["zDepth", "radius", "background"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
125
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.2", ngImport: i0, type: MaterialComponent, decorators: [{
|
126
|
-
type: Component,
|
127
|
-
args: [{ selector: 'color-material', template: `
|
128
|
-
<color-raised [zDepth]="zDepth" [background]="background" [radius]="radius">
|
129
|
-
<div class="material-picker {{ className }}">
|
130
|
-
<color-editable-input label="hex" [value]="hex"
|
131
|
-
(onChange)="handleValueChange($event)"
|
132
|
-
[style]="{input: HEXinput, label: HEXlabel}"
|
133
|
-
></color-editable-input>
|
134
|
-
<div class="material-split">
|
135
|
-
<div class="material-third">
|
136
|
-
<color-editable-input label="r" [value]="rgb.r"
|
137
|
-
[style]="{ input: RGBinput, label: RGBlabel }"
|
138
|
-
(onChange)="handleInputChange($event)"
|
139
|
-
></color-editable-input>
|
140
|
-
</div>
|
141
|
-
<div class="material-third">
|
142
|
-
<color-editable-input label="g" [value]="rgb.g"
|
143
|
-
[style]="{ input: RGBinput, label: RGBlabel }"
|
144
|
-
(onChange)="handleInputChange($event)"
|
145
|
-
></color-editable-input>
|
146
|
-
</div>
|
147
|
-
<div class="material-third">
|
148
|
-
<color-editable-input label="b" [value]="rgb.b"
|
149
|
-
[style]="{ input: RGBinput, label: RGBlabel }"
|
150
|
-
(onChange)="handleInputChange($event)"
|
151
|
-
></color-editable-input>
|
152
|
-
</div>
|
153
|
-
</div>
|
154
|
-
</div>
|
155
|
-
</color-raised>
|
156
|
-
`, changeDetection: ChangeDetectionStrategy.OnPush, preserveWhitespaces: false, providers: [
|
157
|
-
{
|
158
|
-
provide: NG_VALUE_ACCESSOR,
|
159
|
-
useExisting: forwardRef(() => MaterialComponent),
|
160
|
-
multi: true,
|
161
|
-
},
|
162
|
-
{
|
163
|
-
provide: ColorWrap,
|
164
|
-
useExisting: forwardRef(() => MaterialComponent),
|
165
|
-
},
|
166
|
-
], styles: [".material-picker{width:130px;height:130px;padding:16px;font-family:Roboto}.material-split{display:flex;margin-right:-10px;padding-top:11px}.material-third{flex:1 1 0%;padding-right:10px}\n"] }]
|
167
|
-
}], ctorParameters: function () { return []; }, propDecorators: { zDepth: [{
|
168
|
-
type: Input
|
169
|
-
}], radius: [{
|
170
|
-
type: Input
|
171
|
-
}], background: [{
|
172
|
-
type: Input
|
173
|
-
}] } });
|
174
|
-
class ColorMaterialModule {
|
175
|
-
}
|
176
|
-
ColorMaterialModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.2", ngImport: i0, type: ColorMaterialModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
177
|
-
ColorMaterialModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.1.2", ngImport: i0, type: ColorMaterialModule, declarations: [MaterialComponent], imports: [CommonModule, EditableInputModule, RaisedModule], exports: [MaterialComponent] });
|
178
|
-
ColorMaterialModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.1.2", ngImport: i0, type: ColorMaterialModule, imports: [CommonModule, EditableInputModule, RaisedModule] });
|
179
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.2", ngImport: i0, type: ColorMaterialModule, decorators: [{
|
180
|
-
type: NgModule,
|
181
|
-
args: [{
|
182
|
-
exports: [MaterialComponent],
|
183
|
-
declarations: [MaterialComponent],
|
184
|
-
imports: [CommonModule, EditableInputModule, RaisedModule],
|
185
|
-
}]
|
186
|
-
}] });
|
187
|
-
|
188
|
-
/**
|
189
|
-
* Generated bundle index. Do not edit.
|
190
|
-
*/
|
191
|
-
|
192
|
-
export { ColorMaterialModule, MaterialComponent };
|
193
|
-
//# sourceMappingURL=ngx-color-material.mjs.map
|
@@ -1 +0,0 @@
|
|
1
|
-
{"version":3,"file":"ngx-color-material.mjs","sources":["../../src/lib/material/material.component.ts","../../src/lib/material/ngx-color-material.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport { ChangeDetectionStrategy, Component, forwardRef, Input, NgModule } from '@angular/core';\n\nimport { ColorWrap, EditableInputModule, isValidHex, RaisedModule, zDepth } from 'ngx-color';\nimport { NG_VALUE_ACCESSOR } from '@angular/forms';\n\n@Component({\n selector: 'color-material',\n template: `\n <color-raised [zDepth]=\"zDepth\" [background]=\"background\" [radius]=\"radius\">\n <div class=\"material-picker {{ className }}\">\n <color-editable-input label=\"hex\" [value]=\"hex\"\n (onChange)=\"handleValueChange($event)\"\n [style]=\"{input: HEXinput, label: HEXlabel}\"\n ></color-editable-input>\n <div class=\"material-split\">\n <div class=\"material-third\">\n <color-editable-input label=\"r\" [value]=\"rgb.r\"\n [style]=\"{ input: RGBinput, label: RGBlabel }\"\n (onChange)=\"handleInputChange($event)\"\n ></color-editable-input>\n </div>\n <div class=\"material-third\">\n <color-editable-input label=\"g\" [value]=\"rgb.g\"\n [style]=\"{ input: RGBinput, label: RGBlabel }\"\n (onChange)=\"handleInputChange($event)\"\n ></color-editable-input>\n </div>\n <div class=\"material-third\">\n <color-editable-input label=\"b\" [value]=\"rgb.b\"\n [style]=\"{ input: RGBinput, label: RGBlabel }\"\n (onChange)=\"handleInputChange($event)\"\n ></color-editable-input>\n </div>\n </div>\n </div>\n </color-raised>\n `,\n styles: [\n `\n .material-picker {\n width: 130px;\n height: 130px;\n padding: 16px;\n font-family: Roboto;\n }\n .material-split {\n display: flex;\n margin-right: -10px;\n padding-top: 11px;\n }\n .material-third {\n flex: 1 1 0%;\n padding-right: 10px;\n }\n `,\n ],\n changeDetection: ChangeDetectionStrategy.OnPush,\n preserveWhitespaces: false,\n providers: [\n {\n provide: NG_VALUE_ACCESSOR,\n useExisting: forwardRef(() => MaterialComponent),\n multi: true,\n },\n {\n provide: ColorWrap,\n useExisting: forwardRef(() => MaterialComponent),\n },\n ]\n})\nexport class MaterialComponent extends ColorWrap {\n HEXinput: {[key: string]: string} = {\n width: '100%',\n marginTop: '12px',\n fontSize: '15px',\n color: 'rgb(51, 51, 51)',\n padding: '0px',\n 'border-width': '0px 0px 2px',\n outline: 'none',\n height: '30px',\n };\n HEXlabel: {[key: string]: string} = {\n position: 'absolute',\n top: '0px',\n left: '0px',\n fontSize: '11px',\n color: 'rgb(153, 153, 153)',\n 'text-transform': 'capitalize',\n };\n RGBinput: {[key: string]: string} = {\n width: '100%',\n marginTop: '12px',\n fontSize: '15px',\n color: '#333',\n padding: '0px',\n border: '0px',\n 'border-bottom': '1px solid #eee',\n outline: 'none',\n height: '30px',\n };\n RGBlabel: {[key: string]: string} = {\n position: 'absolute',\n top: '0px',\n left: '0px',\n fontSize: '11px',\n color: '#999999',\n 'text-transform': 'capitalize',\n };\n @Input() zDepth: zDepth = 1;\n @Input() radius = 1;\n @Input() background = '#fff';\n disableAlpha = true;\n\n constructor() {\n super();\n }\n\n handleValueChange({ data, $event }) {\n this.handleChange(data, $event);\n }\n\n handleInputChange({ data, $event }) {\n if (data.hex) {\n if (isValidHex(data.hex)) {\n this.handleValueChange({\n data: {\n hex: data.hex,\n source: 'hex',\n },\n $event,\n });\n }\n } else if (data.r || data.g || data.b) {\n this.handleValueChange({\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 afterValidChange() {\n this.HEXinput['border-bottom-color'] = this.hex;\n }\n}\n\n@NgModule({\n exports: [MaterialComponent],\n declarations: [MaterialComponent],\n imports: [CommonModule, EditableInputModule, RaisedModule],\n})\nexport class ColorMaterialModule { }\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}
|
@@ -1 +0,0 @@
|
|
1
|
-
{"version":3,"file":"ngx-color-photoshop.mjs","sources":["../../src/lib/photoshop/photoshop-button.component.ts","../../src/lib/photoshop/photoshop-fields.component.ts","../../src/lib/photoshop/photoshop-previews.component.ts","../../src/lib/photoshop/photoshop.component.ts","../../src/lib/photoshop/ngx-color-photoshop.ts"],"sourcesContent":["import {\n ChangeDetectionStrategy,\n Component,\n EventEmitter,\n Input,\n Output,\n} from '@angular/core';\n\n@Component({\n selector: 'color-photoshop-button',\n template: `\n <div class=\"photoshop-button\" [class.active]=\"active\"\n (click)=\"onClick.emit($event)\"\n >\n {{ label }}\n </div>\n `,\n styles: [\n `\n .photoshop-button {\n background-image: linear-gradient(\n -180deg,\n rgb(255, 255, 255) 0%,\n rgb(230, 230, 230) 100%\n );\n border: 1px solid rgb(135, 135, 135);\n border-radius: 2px;\n height: 22px;\n box-shadow: rgb(234, 234, 234) 0px 1px 0px 0px;\n font-size: 14px;\n color: rgb(0, 0, 0);\n line-height: 20px;\n text-align: center;\n margin-bottom: 10px;\n cursor: pointer;\n }\n .photoshop-button.active {\n box-shadow: 0 0 0 1px #878787;\n }\n `,\n ],\n changeDetection: ChangeDetectionStrategy.OnPush,\n preserveWhitespaces: false,\n})\nexport class PhotoshopButtonComponent {\n @Input() label = '';\n @Input() active = false;\n @Output() onClick = new EventEmitter<Event>();\n}\n","import {\n ChangeDetectionStrategy,\n Component,\n EventEmitter,\n Input,\n Output,\n} from '@angular/core';\n\nimport { isValidHex, HSV, RGB } from 'ngx-color';\n\n@Component({\n selector: 'color-photoshop-fields',\n template: `\n <div class=\"photoshop-fields\">\n <color-editable-input\n [value]=\"round(hsv.h)\"\n label=\"h\"\n (onChange)=\"handleValueChange($event)\"\n [style]=\"{input: RGBinput, wrap: RGBwrap, label: RGBlabel}\"\n ></color-editable-input>\n <color-editable-input\n [value]=\"round(hsv.s * 100)\"\n label=\"s\"\n (onChange)=\"handleValueChange($event)\"\n [style]=\"{input: RGBinput, wrap: RGBwrap, label: RGBlabel}\"\n ></color-editable-input>\n <color-editable-input\n [value]=\"round(hsv.v * 100)\"\n label=\"v\"\n (onChange)=\"handleValueChange($event)\"\n [style]=\"{input: RGBinput, wrap: RGBwrap, label: RGBlabel}\"\n ></color-editable-input>\n <div class=\"photoshop-divider\"></div>\n <color-editable-input\n [value]=\"rgb.r\"\n label=\"r\"\n (onChange)=\"handleValueChange($event)\"\n [style]=\"{input: RGBinput, wrap: RGBwrap, label: RGBlabel}\"\n ></color-editable-input>\n <color-editable-input\n [value]=\"rgb.g\"\n label=\"g\"\n (onChange)=\"handleValueChange($event)\"\n [style]=\"{input: RGBinput, wrap: RGBwrap, label: RGBlabel}\"\n ></color-editable-input>\n <color-editable-input\n [value]=\"rgb.b\"\n label=\"b\"\n (onChange)=\"handleValueChange($event)\"\n [style]=\"{input: RGBinput, wrap: RGBwrap, label: RGBlabel}\"\n ></color-editable-input>\n <div class=\"photoshop-divider\"></div>\n <color-editable-input\n [value]=\"hex.replace('#', '')\"\n label=\"#\"\n (onChange)=\"handleValueChange($event)\"\n [style]=\"{input: HEXinput, wrap: HEXwrap, label: HEXlabel}\"\n ></color-editable-input>\n <div class=\"photoshop-field-symbols\">\n <div class=\"photoshop-symbol\">°</div>\n <div class=\"photoshop-symbol\">%</div>\n <div class=\"photoshop-symbol\">%</div>\n </div>\n </div>\n `,\n styles: [\n `\n .photoshop-fields {\n padding-top: 5px;\n padding-bottom: 9px;\n width: 85px;\n position: relative;\n }\n .photoshop-field-symbols {\n position: absolute;\n top: 5px;\n right: -7px;\n font-size: 13px;\n }\n .photoshop-symbol {\n height: 24px;\n line-height: 24px;\n padding-bottom: 7px;\n }\n .photoshop-divider {\n height: 5px;\n }\n `,\n ],\n changeDetection: ChangeDetectionStrategy.OnPush,\n preserveWhitespaces: false,\n})\nexport class PhotoshopFieldsComponent {\n @Input() rgb!: RGB;\n @Input() hsv!: HSV;\n @Input() hex!: string;\n @Output() onChange = new EventEmitter<any>();\n RGBinput: Record<string, string> = {\n marginLeft: '35%',\n width: '40%',\n height: '22px',\n border: '1px solid rgb(136, 136, 136)',\n boxShadow:\n 'rgba(0, 0, 0, 0.1) 0px 1px 1px inset, rgb(236, 236, 236) 0px 1px 0px 0px',\n marginBottom: '2px',\n fontSize: '13px',\n paddingLeft: '3px',\n marginRight: '10px',\n };\n RGBwrap: Record<string, string> = {\n position: 'relative',\n };\n RGBlabel: Record<string, string> = {\n left: '0px',\n width: '34px',\n textTransform: 'uppercase',\n fontSize: '13px',\n height: '24px',\n lineHeight: '24px',\n position: 'absolute',\n };\n HEXinput: Record<string, string> = {\n marginLeft: '20%',\n width: '80%',\n height: '22px',\n border: '1px solid #888888',\n boxShadow: 'inset 0 1px 1px rgba(0,0,0,.1), 0 1px 0 0 #ECECEC',\n marginBottom: '3px',\n fontSize: '13px',\n paddingLeft: '3px',\n };\n HEXwrap: Record<string, string> = {\n position: 'relative',\n };\n HEXlabel: Record<string, string> = {\n position: 'absolute',\n top: '0px',\n left: '0px',\n width: '14px',\n textTransform: 'uppercase',\n fontSize: '13px',\n height: '24px',\n lineHeight: '24px',\n };\n\n round(v) {\n return Math.round(v);\n }\n handleValueChange({ data, $event }) {\n if (data['#']) {\n if (isValidHex(data['#'])) {\n this.onChange.emit({\n data: {\n hex: data['#'],\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.h || data.s || data.v) {\n this.onChange.emit({\n data: {\n h: data.h || this.hsv.h,\n s: data.s || this.hsv.s,\n v: data.v || this.hsv.v,\n source: 'hsv',\n },\n $event,\n });\n }\n }\n}\n","import {\n ChangeDetectionStrategy,\n Component,\n Input,\n OnChanges,\n} from '@angular/core';\nimport { RGB } from 'ngx-color';\n\n@Component({\n selector: 'color-photoshop-previews',\n template: `\n <div>\n <div class=\"photoshop-label\">new</div>\n <div class=\"photoshop-swatches\">\n <div class=\"photoshop-new\" [style.background]=\"backgroundNew\"></div>\n <div class=\"photoshop-current\" [style.background]=\"currentColor\"></div>\n </div>\n <div class=\"photoshop-label\">current</div>\n </div>\n `,\n styles: [\n `\n .photoshop-swatches {\n border: 1px solid #B3B3B3;\n border-bottom: 1px solid #F0F0F0;\n margin-bottom: 2px;\n margin-top: 1px;\n }\n .photoshop-new {\n height: 34px;\n box-shadow: inset 1px 0 0 #000, inset -1px 0 0 #000, inset 0 1px 0 #000;\n }\n .photoshop-current {\n height: 34px;\n box-shadow: inset 1px 0 0 #000, inset -1px 0 0 #000, inset 0 -1px 0 #000;\n }\n .photoshop-label {\n font-size: 14px;\n color: #000;\n text-align: center;\n }\n `,\n ],\n changeDetection: ChangeDetectionStrategy.OnPush,\n preserveWhitespaces: false,\n})\nexport class PhotoshopPreviewsComponent implements OnChanges {\n @Input() rgb!: RGB;\n @Input() currentColor = '';\n backgroundNew = '';\n\n ngOnChanges() {\n this.backgroundNew = `rgb(${this.rgb.r},${this.rgb.g}, ${this.rgb.b})`;\n }\n}\n","import { CommonModule } from '@angular/common';\nimport { ChangeDetectionStrategy, Component, EventEmitter, forwardRef, Input, NgModule, Output } from '@angular/core';\n\nimport { AlphaModule, ColorWrap, EditableInputModule, HueModule, SaturationModule, SwatchModule } from 'ngx-color';\nimport { PhotoshopButtonComponent } from './photoshop-button.component';\nimport { PhotoshopFieldsComponent } from './photoshop-fields.component';\nimport { PhotoshopPreviewsComponent } from './photoshop-previews.component';\nimport { NG_VALUE_ACCESSOR } from '@angular/forms';\n\n@Component({\n selector: 'color-photoshop',\n template: `\n <div class=\"photoshop-picker {{ className }}\">\n <div class=\"photoshop-head\">{{ header }}</div>\n <div class=\"photoshop-body\">\n <div class=\"photoshop-saturation\">\n <color-saturation\n [hsl]=\"hsl\" [hsv]=\"hsv\" [circle]=\"circle\"\n (onChange)=\"handleValueChange($event)\"\n ></color-saturation>\n </div>\n <div class=\"photoshop-hue\">\n <color-hue direction=\"vertical\"\n [hsl]=\"hsl\" [hidePointer]=\"true\"\n (onChange)=\"handleValueChange($event)\"\n ></color-hue>\n </div>\n <div class=\"photoshop-controls\">\n <div class=\"photoshop-top\">\n <div class=\"photoshop-previews\">\n <color-photoshop-previews\n [rgb]=\"rgb\" [currentColor]=\"currentColor\"\n ></color-photoshop-previews>\n </div>\n <div class=\"photoshop-actions\">\n <color-photoshop-button label=\"OK\"\n [active]=\"true\" (onClick)=\"onAccept.emit($event)\"\n ></color-photoshop-button>\n <color-photoshop-button label=\"Cancel\"\n (onClick)=\"onCancel.emit($event)\"\n >\n </color-photoshop-button>\n <color-photoshop-fields\n [rgb]=\"rgb\" [hex]=\"hex\" [hsv]=\"hsv\"\n (onChange)=\"handleValueChange($event)\"\n ></color-photoshop-fields>\n </div>\n </div>\n </div>\n </div>\n </div>\n `,\n styles: [\n `\n .photoshop-picker {\n background: rgb(220, 220, 220);\n border-radius: 4px;\n box-shadow: rgba(0, 0, 0, 0.25) 0px 0px 0px 1px, rgba(0, 0, 0, 0.15) 0px 8px 16px;\n box-sizing: initial; width: 513px;\n }\n .photoshop-head {\n background-image: linear-gradient(\n -180deg,\n rgb(240, 240, 240) 0%,\n rgb(212, 212, 212) 100%\n );\n border-bottom: 1px solid rgb(177, 177, 177);\n box-shadow: rgba(255, 255, 255, 0.2) 0px 1px 0px 0px inset,\n rgba(0, 0, 0, 0.02) 0px -1px 0px 0px inset;\n height: 23px;\n line-height: 24px;\n border-radius: 4px 4px 0px 0px;\n font-size: 13px;\n color: rgb(77, 77, 77);\n text-align: center;\n }\n .photoshop-body {\n padding: 15px 15px 0px;\n display: flex;\n }\n .photoshop-saturation {\n width: 256px;\n height: 256px;\n position: relative;\n border-width: 2px;\n border-style: solid;\n border-color: rgb(179, 179, 179) rgb(179, 179, 179) rgb(240, 240, 240);\n border-image: initial;\n overflow: hidden;\n }\n .photoshop-hue {\n position: relative;\n height: 256px;\n width: 23px;\n margin-left: 10px;\n border-width: 2px;\n border-style: solid;\n border-color: rgb(179, 179, 179) rgb(179, 179, 179) rgb(240, 240, 240);\n border-image: initial;\n }\n .photoshop-controls {\n width: 180px;\n margin-left: 10px;\n }\n .photoshop-top {\n display: flex;\n }\n .photoshop-previews {\n width: 60px;\n }\n .photoshop-actions {\n -webkit-box-flex: 1;\n flex: 1 1 0%;\n margin-left: 20px;\n }\n `,\n ],\n changeDetection: ChangeDetectionStrategy.OnPush,\n preserveWhitespaces: false,\n providers: [\n {\n provide: NG_VALUE_ACCESSOR,\n useExisting: forwardRef(() => PhotoshopComponent),\n multi: true,\n },\n {\n provide: ColorWrap,\n useExisting: forwardRef(() => PhotoshopComponent),\n },\n ]\n})\nexport class PhotoshopComponent extends ColorWrap {\n /** Title text */\n @Input() header = 'Color Picker';\n @Output() onAccept = new EventEmitter<Event>();\n @Output() onCancel = new EventEmitter<Event>();\n circle = {\n width: '12px',\n height: '12px',\n borderRadius: '6px',\n boxShadow: 'rgb(255, 255, 255) 0px 0px 0px 1px inset',\n transform: 'translate(-6px, -10px)',\n };\n constructor() {\n super();\n }\n handleValueChange({ data, $event }) {\n this.handleChange(data, $event);\n }\n}\n\n@NgModule({\n declarations: [\n PhotoshopComponent,\n PhotoshopPreviewsComponent,\n PhotoshopButtonComponent,\n PhotoshopFieldsComponent,\n ],\n exports: [\n PhotoshopComponent,\n PhotoshopPreviewsComponent,\n PhotoshopButtonComponent,\n PhotoshopFieldsComponent,\n ],\n imports: [\n CommonModule,\n EditableInputModule,\n HueModule,\n AlphaModule,\n SwatchModule,\n SaturationModule,\n ],\n})\nexport class ColorPhotoshopModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}
|
@@ -1,99 +0,0 @@
|
|
1
|
-
import { CommonModule } from '@angular/common';
|
2
|
-
import * as i0 from '@angular/core';
|
3
|
-
import { forwardRef, Component, ChangeDetectionStrategy, Input, NgModule } from '@angular/core';
|
4
|
-
import * as i1 from 'ngx-color';
|
5
|
-
import { ColorWrap, toState, ShadeModule } from 'ngx-color';
|
6
|
-
import { NG_VALUE_ACCESSOR } from '@angular/forms';
|
7
|
-
|
8
|
-
class ShadeSliderComponent extends ColorWrap {
|
9
|
-
constructor() {
|
10
|
-
super();
|
11
|
-
/** Pixel value for picker width */
|
12
|
-
this.width = 316;
|
13
|
-
/** Pixel value for picker height */
|
14
|
-
this.height = 16;
|
15
|
-
this.pointer = {
|
16
|
-
width: '18px',
|
17
|
-
height: '18px',
|
18
|
-
borderRadius: '50%',
|
19
|
-
transform: 'translate(-9px, -2px)',
|
20
|
-
boxShadow: '0 1px 4px 0 rgba(0, 0, 0, 0.37)',
|
21
|
-
};
|
22
|
-
}
|
23
|
-
ngOnChanges() {
|
24
|
-
this.setState(toState(this.color, this.oldHue));
|
25
|
-
}
|
26
|
-
handlePickerChange({ data, $event }) {
|
27
|
-
this.handleChange(data, $event);
|
28
|
-
}
|
29
|
-
}
|
30
|
-
ShadeSliderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.2", ngImport: i0, type: ShadeSliderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
31
|
-
ShadeSliderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.2", type: ShadeSliderComponent, selector: "color-shade-picker", inputs: { width: "width", height: "height" }, providers: [
|
32
|
-
{
|
33
|
-
provide: NG_VALUE_ACCESSOR,
|
34
|
-
useExisting: forwardRef(() => ShadeSliderComponent),
|
35
|
-
multi: true,
|
36
|
-
},
|
37
|
-
{
|
38
|
-
provide: ColorWrap,
|
39
|
-
useExisting: forwardRef(() => ShadeSliderComponent),
|
40
|
-
},
|
41
|
-
], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: `
|
42
|
-
<div class="shade-slider {{ className || '' }}"
|
43
|
-
[style.width.px]="width" [style.height.px]="height">
|
44
|
-
<color-shade
|
45
|
-
[hsl]="hsl"
|
46
|
-
[rgb]="rgb"
|
47
|
-
[pointer]="pointer"
|
48
|
-
(onChange)="handlePickerChange($event)"
|
49
|
-
></color-shade>
|
50
|
-
</div>
|
51
|
-
`, isInline: true, styles: [".shade-slider{position:relative}\n"], dependencies: [{ kind: "component", type: i1.ShadeComponent, selector: "color-shade", inputs: ["hsl", "rgb", "pointer", "shadow", "radius"], outputs: ["onChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
52
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.2", ngImport: i0, type: ShadeSliderComponent, decorators: [{
|
53
|
-
type: Component,
|
54
|
-
args: [{ selector: 'color-shade-picker', template: `
|
55
|
-
<div class="shade-slider {{ className || '' }}"
|
56
|
-
[style.width.px]="width" [style.height.px]="height">
|
57
|
-
<color-shade
|
58
|
-
[hsl]="hsl"
|
59
|
-
[rgb]="rgb"
|
60
|
-
[pointer]="pointer"
|
61
|
-
(onChange)="handlePickerChange($event)"
|
62
|
-
></color-shade>
|
63
|
-
</div>
|
64
|
-
`, changeDetection: ChangeDetectionStrategy.OnPush, preserveWhitespaces: false, providers: [
|
65
|
-
{
|
66
|
-
provide: NG_VALUE_ACCESSOR,
|
67
|
-
useExisting: forwardRef(() => ShadeSliderComponent),
|
68
|
-
multi: true,
|
69
|
-
},
|
70
|
-
{
|
71
|
-
provide: ColorWrap,
|
72
|
-
useExisting: forwardRef(() => ShadeSliderComponent),
|
73
|
-
},
|
74
|
-
], styles: [".shade-slider{position:relative}\n"] }]
|
75
|
-
}], ctorParameters: function () { return []; }, propDecorators: { width: [{
|
76
|
-
type: Input
|
77
|
-
}], height: [{
|
78
|
-
type: Input
|
79
|
-
}] } });
|
80
|
-
class ColorShadeModule {
|
81
|
-
}
|
82
|
-
ColorShadeModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.2", ngImport: i0, type: ColorShadeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
83
|
-
ColorShadeModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.1.2", ngImport: i0, type: ColorShadeModule, declarations: [ShadeSliderComponent], imports: [CommonModule, ShadeModule], exports: [ShadeSliderComponent] });
|
84
|
-
ColorShadeModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.1.2", ngImport: i0, type: ColorShadeModule, imports: [CommonModule, ShadeModule] });
|
85
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.2", ngImport: i0, type: ColorShadeModule, decorators: [{
|
86
|
-
type: NgModule,
|
87
|
-
args: [{
|
88
|
-
declarations: [ShadeSliderComponent],
|
89
|
-
exports: [ShadeSliderComponent],
|
90
|
-
imports: [CommonModule, ShadeModule],
|
91
|
-
}]
|
92
|
-
}] });
|
93
|
-
|
94
|
-
/**
|
95
|
-
* Generated bundle index. Do not edit.
|
96
|
-
*/
|
97
|
-
|
98
|
-
export { ColorShadeModule, ShadeSliderComponent };
|
99
|
-
//# sourceMappingURL=ngx-color-shade.mjs.map
|
@@ -1 +0,0 @@
|
|
1
|
-
{"version":3,"file":"ngx-color-shade.mjs","sources":["../../src/lib/shade/shade-picker.component.ts","../../src/lib/shade/ngx-color-shade.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport { ChangeDetectionStrategy, Component, forwardRef, Input, NgModule, OnChanges } from '@angular/core';\nimport { ColorWrap, ShadeModule, toState } from 'ngx-color';\nimport { NG_VALUE_ACCESSOR } from '@angular/forms';\n\n@Component({\n selector: 'color-shade-picker',\n template: `\n <div class=\"shade-slider {{ className || '' }}\"\n [style.width.px]=\"width\" [style.height.px]=\"height\">\n <color-shade\n [hsl]=\"hsl\"\n [rgb]=\"rgb\"\n [pointer]=\"pointer\"\n (onChange)=\"handlePickerChange($event)\"\n ></color-shade>\n </div>\n `,\n styles: [\n `\n .shade-slider {\n position: relative;\n }\n `,\n ],\n changeDetection: ChangeDetectionStrategy.OnPush,\n preserveWhitespaces: false,\n providers: [\n {\n provide: NG_VALUE_ACCESSOR,\n useExisting: forwardRef(() => ShadeSliderComponent),\n multi: true,\n },\n {\n provide: ColorWrap,\n useExisting: forwardRef(() => ShadeSliderComponent),\n },\n ]\n})\nexport class ShadeSliderComponent extends ColorWrap implements OnChanges {\n /** Pixel value for picker width */\n @Input() width: string | number = 316;\n /** Pixel value for picker height */\n @Input() height: string | number = 16;\n pointer: {[key: string]: string} = {\n width: '18px',\n height: '18px',\n borderRadius: '50%',\n transform: 'translate(-9px, -2px)',\n boxShadow: '0 1px 4px 0 rgba(0, 0, 0, 0.37)',\n };\n\n constructor() {\n super();\n }\n ngOnChanges() {\n this.setState(toState(this.color, this.oldHue));\n }\n handlePickerChange({ data, $event }) {\n this.handleChange(data, $event);\n }\n}\n\n@NgModule({\n declarations: [ShadeSliderComponent],\n exports: [ShadeSliderComponent],\n imports: [CommonModule, ShadeModule],\n})\nexport class ColorShadeModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":";;;;;;;AAuCM,MAAO,oBAAqB,SAAQ,SAAS,CAAA;AAajD,IAAA,WAAA,GAAA;AACE,QAAA,KAAK,EAAE,CAAC;;QAZD,IAAK,CAAA,KAAA,GAAoB,GAAG,CAAC;;QAE7B,IAAM,CAAA,MAAA,GAAoB,EAAE,CAAC;AACtC,QAAA,IAAA,CAAA,OAAO,GAA4B;AACjC,YAAA,KAAK,EAAE,MAAM;AACb,YAAA,MAAM,EAAE,MAAM;AACd,YAAA,YAAY,EAAE,KAAK;AACnB,YAAA,SAAS,EAAE,uBAAuB;AAClC,YAAA,SAAS,EAAE,iCAAiC;SAC7C,CAAC;KAID;IACD,WAAW,GAAA;AACT,QAAA,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC;KACjD;AACD,IAAA,kBAAkB,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,EAAA;AACjC,QAAA,IAAI,CAAC,YAAY,CAAC,IAAI,EAAE,MAAM,CAAC,CAAC;KACjC;;iHArBU,oBAAoB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAApB,oBAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,oBAAoB,EAZpB,QAAA,EAAA,oBAAA,EAAA,MAAA,EAAA,EAAA,KAAA,EAAA,OAAA,EAAA,MAAA,EAAA,QAAA,EAAA,EAAA,SAAA,EAAA;AACT,QAAA;AACE,YAAA,OAAO,EAAE,iBAAiB;AAC1B,YAAA,WAAW,EAAE,UAAU,CAAC,MAAM,oBAAoB,CAAC;AACnD,YAAA,KAAK,EAAE,IAAI;AACZ,SAAA;AACD,QAAA;AACE,YAAA,OAAO,EAAE,SAAS;AAClB,YAAA,WAAW,EAAE,UAAU,CAAC,MAAM,oBAAoB,CAAC;AACpD,SAAA;KACF,EA9BS,eAAA,EAAA,IAAA,EAAA,aAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAAA,CAAA;;;;;;;;;;AAUT,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,oCAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,cAAA,EAAA,QAAA,EAAA,aAAA,EAAA,MAAA,EAAA,CAAA,KAAA,EAAA,KAAA,EAAA,SAAA,EAAA,QAAA,EAAA,QAAA,CAAA,EAAA,OAAA,EAAA,CAAA,UAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;2FAsBU,oBAAoB,EAAA,UAAA,EAAA,CAAA;kBAlChC,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,oBAAoB,EACpB,QAAA,EAAA,CAAA;;;;;;;;;;AAUT,EAAA,CAAA,EAAA,eAAA,EAQgB,uBAAuB,CAAC,MAAM,EAAA,mBAAA,EAC1B,KAAK,EACf,SAAA,EAAA;AACT,wBAAA;AACE,4BAAA,OAAO,EAAE,iBAAiB;AAC1B,4BAAA,WAAW,EAAE,UAAU,CAAC,0BAA0B,CAAC;AACnD,4BAAA,KAAK,EAAE,IAAI;AACZ,yBAAA;AACD,wBAAA;AACE,4BAAA,OAAO,EAAE,SAAS;AAClB,4BAAA,WAAW,EAAE,UAAU,CAAC,0BAA0B,CAAC;AACpD,yBAAA;AACF,qBAAA,EAAA,MAAA,EAAA,CAAA,oCAAA,CAAA,EAAA,CAAA;0EAIQ,KAAK,EAAA,CAAA;sBAAb,KAAK;gBAEG,MAAM,EAAA,CAAA;sBAAd,KAAK;;MAyBK,gBAAgB,CAAA;;6GAAhB,gBAAgB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA;AAAhB,gBAAA,CAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,gBAAgB,iBA7BhB,oBAAoB,CAAA,EAAA,OAAA,EAAA,CA2BrB,YAAY,EAAE,WAAW,aA3BxB,oBAAoB,CAAA,EAAA,CAAA,CAAA;8GA6BpB,gBAAgB,EAAA,OAAA,EAAA,CAFjB,YAAY,EAAE,WAAW,CAAA,EAAA,CAAA,CAAA;2FAExB,gBAAgB,EAAA,UAAA,EAAA,CAAA;kBAL5B,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;oBACR,YAAY,EAAE,CAAC,oBAAoB,CAAC;oBACpC,OAAO,EAAE,CAAC,oBAAoB,CAAC;AAC/B,oBAAA,OAAO,EAAE,CAAC,YAAY,EAAE,WAAW,CAAC;AACrC,iBAAA,CAAA;;;ACnED;;AAEG;;;;"}
|