color-util-helpers 1.0.7 → 1.0.8
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/color-util-helpers-1.0.8.tgz +0 -0
- package/esm2022/color-util-helpers.mjs +5 -0
- package/esm2022/lib/color-conversion.service.mjs +39 -0
- package/esm2022/lib/color-extractor.directive.mjs +37 -0
- package/esm2022/lib/color-grab.directive.mjs +185 -0
- package/esm2022/lib/color-lighten-darken.service.mjs +79 -0
- package/esm2022/lib/color-pallette.service.mjs +172 -0
- package/esm2022/lib/color-scheme.service.mjs +113 -0
- package/esm2022/lib/color-utilities-demo/color-utilities-demo.component.mjs +41 -0
- package/esm2022/lib/color-utils.module.mjs +38 -0
- package/esm2022/lib/text-color.service.mjs +79 -0
- package/esm2022/public-api.mjs +13 -0
- package/fesm2022/color-util-helpers.mjs +767 -0
- package/fesm2022/color-util-helpers.mjs.map +1 -0
- package/index.d.ts +5 -0
- package/lib/color-conversion.service.d.ts +8 -0
- package/lib/color-extractor.directive.d.ts +13 -0
- package/lib/color-grab.directive.d.ts +31 -0
- package/lib/color-lighten-darken.service.d.ts +10 -0
- package/lib/color-pallette.service.d.ts +36 -0
- package/lib/color-scheme.service.d.ts +45 -0
- package/lib/color-utilities-demo/color-utilities-demo.component.d.ts +34 -0
- package/lib/color-utils.module.d.ts +12 -0
- package/lib/text-color.service.d.ts +18 -0
- package/package.json +15 -2
- package/{src/public-api.ts → public-api.d.ts} +0 -6
- package/ng-package.json +0 -8
- package/src/lib/assets/picture.webp +0 -0
- package/src/lib/color-conversion.service.spec.ts +0 -54
- package/src/lib/color-conversion.service.ts +0 -35
- package/src/lib/color-extractor.directive.spec.ts +0 -49
- package/src/lib/color-extractor.directive.ts +0 -28
- package/src/lib/color-grab.directive.ts +0 -204
- package/src/lib/color-lighten-darken.service.spec.ts +0 -61
- package/src/lib/color-lighten-darken.service.ts +0 -83
- package/src/lib/color-pallette.service.spec.ts +0 -85
- package/src/lib/color-pallette.service.ts +0 -191
- package/src/lib/color-scheme.service.ts +0 -123
- package/src/lib/color-utilities-demo/color-utilities-demo.component.css +0 -12
- package/src/lib/color-utilities-demo/color-utilities-demo.component.html +0 -109
- package/src/lib/color-utilities-demo/color-utilities-demo.component.ts +0 -57
- package/src/lib/color-utils.module.ts +0 -27
- package/src/lib/text-color.service.spec.ts +0 -75
- package/src/lib/text-color.service.ts +0 -101
- package/tsconfig.lib.json +0 -32
- package/tsconfig.lib.prod.json +0 -10
- package/tsconfig.spec.json +0 -14
|
@@ -0,0 +1,113 @@
|
|
|
1
|
+
import { Injectable } from '@angular/core';
|
|
2
|
+
import * as i0 from "@angular/core";
|
|
3
|
+
export class ColorSchemeService {
|
|
4
|
+
constructor() { }
|
|
5
|
+
/**
|
|
6
|
+
* Generates a random hexadecimal color code.
|
|
7
|
+
*
|
|
8
|
+
* This function generates a random hue value between 0 and 360 degrees, and random saturation and lightness values between 50% and 100%. It then converts the HSL values to RGB values using the `hslToRgb` function, and finally converts the RGB values to a hexadecimal color code using the `rgbToHex` function.
|
|
9
|
+
*
|
|
10
|
+
* @returns A hexadecimal color code in the format "#RRGGBB".
|
|
11
|
+
*/
|
|
12
|
+
generateRandomColor() {
|
|
13
|
+
// Generate a random hue between 0 and 360 (representing degrees on the color wheel)
|
|
14
|
+
const hue = Math.floor(Math.random() * 360);
|
|
15
|
+
// Generate random saturation and lightness values between 50% and 100%
|
|
16
|
+
const saturation = Math.floor(Math.random() * 51) + 50;
|
|
17
|
+
const lightness = Math.floor(Math.random() * 51) + 50;
|
|
18
|
+
// Convert HSL values to RGB values
|
|
19
|
+
const rgbColor = this.hslToRgb(hue, saturation, lightness);
|
|
20
|
+
// Convert RGB values to hexadecimal color code
|
|
21
|
+
const hexColor = this.rgbToHex(rgbColor.r, rgbColor.g, rgbColor.b);
|
|
22
|
+
return hexColor;
|
|
23
|
+
}
|
|
24
|
+
/**
|
|
25
|
+
* Converts HSL (Hue, Saturation, Lightness) color values to RGB (Red, Green, Blue) color values.
|
|
26
|
+
*
|
|
27
|
+
* @param h - The hue value, ranging from 0 to 360 degrees.
|
|
28
|
+
* @param s - The saturation value, ranging from 0 to 100 percent.
|
|
29
|
+
* @param l - The lightness value, ranging from 0 to 100 percent.
|
|
30
|
+
* @returns An object with the RGB color values, where each value is between 0 and 255.
|
|
31
|
+
*/
|
|
32
|
+
hslToRgb(h, s, l) {
|
|
33
|
+
h /= 360;
|
|
34
|
+
s /= 100;
|
|
35
|
+
l /= 100;
|
|
36
|
+
let r, g, b;
|
|
37
|
+
if (s === 0) {
|
|
38
|
+
r = g = b = l; // Achromatic color (gray)
|
|
39
|
+
}
|
|
40
|
+
else {
|
|
41
|
+
const hueToRgb = (p, q, t) => {
|
|
42
|
+
if (t < 0)
|
|
43
|
+
t += 1;
|
|
44
|
+
if (t > 1)
|
|
45
|
+
t -= 1;
|
|
46
|
+
if (t < 1 / 6)
|
|
47
|
+
return p + (q - p) * 6 * t;
|
|
48
|
+
if (t < 1 / 2)
|
|
49
|
+
return q;
|
|
50
|
+
if (t < 2 / 3)
|
|
51
|
+
return p + (q - p) * (2 / 3 - t) * 6;
|
|
52
|
+
return p;
|
|
53
|
+
};
|
|
54
|
+
const q = l < 0.5 ? l * (1 + s) : l + s - l * s;
|
|
55
|
+
const p = 2 * l - q;
|
|
56
|
+
r = Math.round(hueToRgb(p, q, h + 1 / 3) * 255);
|
|
57
|
+
g = Math.round(hueToRgb(p, q, h) * 255);
|
|
58
|
+
b = Math.round(hueToRgb(p, q, h - 1 / 3) * 255);
|
|
59
|
+
}
|
|
60
|
+
return { r, g, b };
|
|
61
|
+
}
|
|
62
|
+
/**
|
|
63
|
+
* Converts RGB color values to a hexadecimal color string.
|
|
64
|
+
*
|
|
65
|
+
* @param r - The red color value, between 0 and 255.
|
|
66
|
+
* @param g - The green color value, between 0 and 255.
|
|
67
|
+
* @param b - The blue color value, between 0 and 255.
|
|
68
|
+
* @returns A hexadecimal color string in the format "#RRGGBB".
|
|
69
|
+
*/
|
|
70
|
+
rgbToHex(r, g, b) {
|
|
71
|
+
const componentToHex = (c) => {
|
|
72
|
+
const hex = c.toString(16);
|
|
73
|
+
return hex.length === 1 ? "0" + hex : hex;
|
|
74
|
+
};
|
|
75
|
+
return "#" + componentToHex(r) + componentToHex(g) + componentToHex(b);
|
|
76
|
+
}
|
|
77
|
+
/**
|
|
78
|
+
* Adjusts a hexadecimal color value by a given percentage.
|
|
79
|
+
*
|
|
80
|
+
* @param hexColor - The hexadecimal color value to adjust.
|
|
81
|
+
* @param percentage - The percentage to adjust the color by, ranging from -100 to 100.
|
|
82
|
+
* @returns The adjusted hexadecimal color value.
|
|
83
|
+
*/
|
|
84
|
+
adjustHexColor(hexColor, percentage) {
|
|
85
|
+
// Remove the "#" symbol if present
|
|
86
|
+
hexColor = hexColor.replace("#", "");
|
|
87
|
+
// Convert the hex color to RGB values
|
|
88
|
+
const red = parseInt(hexColor.substring(0, 2), 16);
|
|
89
|
+
const green = parseInt(hexColor.substring(2, 4), 16);
|
|
90
|
+
const blue = parseInt(hexColor.substring(4, 6), 16);
|
|
91
|
+
// Calculate the adjustment amount based on the percentage
|
|
92
|
+
const adjustAmount = Math.round(255 * (percentage / 100));
|
|
93
|
+
// Adjust the RGB values
|
|
94
|
+
const adjustedRed = this.clamp(red + adjustAmount);
|
|
95
|
+
const adjustedGreen = this.clamp(green + adjustAmount);
|
|
96
|
+
const adjustedBlue = this.clamp(blue + adjustAmount);
|
|
97
|
+
// Convert the adjusted RGB values back to hex
|
|
98
|
+
const adjustedHexColor = `#${(adjustedRed).toString(16).padStart(2, '0')}${(adjustedGreen).toString(16).padStart(2, '0')}${(adjustedBlue).toString(16).padStart(2, '0')}`;
|
|
99
|
+
return adjustedHexColor;
|
|
100
|
+
}
|
|
101
|
+
clamp(value) {
|
|
102
|
+
return Math.max(0, Math.min(value, 255));
|
|
103
|
+
}
|
|
104
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ColorSchemeService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
105
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ColorSchemeService, providedIn: 'root' }); }
|
|
106
|
+
}
|
|
107
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ColorSchemeService, decorators: [{
|
|
108
|
+
type: Injectable,
|
|
109
|
+
args: [{
|
|
110
|
+
providedIn: 'root'
|
|
111
|
+
}]
|
|
112
|
+
}], ctorParameters: function () { return []; } });
|
|
113
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY29sb3Itc2NoZW1lLnNlcnZpY2UuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9wcm9qZWN0cy9jb2xvci11dGlscy9zcmMvbGliL2NvbG9yLXNjaGVtZS5zZXJ2aWNlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxVQUFVLEVBQUUsTUFBTSxlQUFlLENBQUM7O0FBSzNDLE1BQU0sT0FBTyxrQkFBa0I7SUFFN0IsZ0JBQWdCLENBQUM7SUFFakI7Ozs7OztPQU1HO0lBQ0gsbUJBQW1CO1FBQ2pCLG9GQUFvRjtRQUNwRixNQUFNLEdBQUcsR0FBRyxJQUFJLENBQUMsS0FBSyxDQUFDLElBQUksQ0FBQyxNQUFNLEVBQUUsR0FBRyxHQUFHLENBQUMsQ0FBQztRQUU1Qyx1RUFBdUU7UUFDdkUsTUFBTSxVQUFVLEdBQUcsSUFBSSxDQUFDLEtBQUssQ0FBQyxJQUFJLENBQUMsTUFBTSxFQUFFLEdBQUcsRUFBRSxDQUFDLEdBQUcsRUFBRSxDQUFDO1FBQ3ZELE1BQU0sU0FBUyxHQUFHLElBQUksQ0FBQyxLQUFLLENBQUMsSUFBSSxDQUFDLE1BQU0sRUFBRSxHQUFHLEVBQUUsQ0FBQyxHQUFHLEVBQUUsQ0FBQztRQUV0RCxtQ0FBbUM7UUFDbkMsTUFBTSxRQUFRLEdBQUcsSUFBSSxDQUFDLFFBQVEsQ0FBQyxHQUFHLEVBQUUsVUFBVSxFQUFFLFNBQVMsQ0FBQyxDQUFDO1FBRTNELCtDQUErQztRQUMvQyxNQUFNLFFBQVEsR0FBRyxJQUFJLENBQUMsUUFBUSxDQUFDLFFBQVEsQ0FBQyxDQUFDLEVBQUUsUUFBUSxDQUFDLENBQUMsRUFBRSxRQUFRLENBQUMsQ0FBQyxDQUFDLENBQUM7UUFFbkUsT0FBTyxRQUFRLENBQUM7SUFDbEIsQ0FBQztJQUVEOzs7Ozs7O09BT0c7SUFDSCxRQUFRLENBQUMsQ0FBUyxFQUFFLENBQVMsRUFBRSxDQUFTO1FBQ3RDLENBQUMsSUFBSSxHQUFHLENBQUM7UUFDVCxDQUFDLElBQUks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SUFBSSxDQUFDLEdBQUcsQ0FBQyxDQUFDLEVBQUUsSUFBSSxDQUFDLEdBQUcsQ0FBQyxLQUFLLEVBQUUsR0FBRyxDQUFDLENBQUMsQ0FBQztJQUMzQyxDQUFDOytHQW5IVSxrQkFBa0I7bUhBQWxCLGtCQUFrQixjQUZqQixNQUFNOzs0RkFFUCxrQkFBa0I7a0JBSDlCLFVBQVU7bUJBQUM7b0JBQ1YsVUFBVSxFQUFFLE1BQU07aUJBQ25CIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgSW5qZWN0YWJsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuXG5ASW5qZWN0YWJsZSh7XG4gIHByb3ZpZGVkSW46ICdyb290J1xufSlcbmV4cG9ydCBjbGFzcyBDb2xvclNjaGVtZVNlcnZpY2Uge1xuXG4gIGNvbnN0cnVjdG9yKCkgeyB9XG5cbiAgLyoqXG4gICAqIEdlbmVyYXRlcyBhIHJhbmRvbSBoZXhhZGVjaW1hbCBjb2xvciBjb2RlLlxuICAgKlxuICAgKiBUaGlzIGZ1bmN0aW9uIGdlbmVyYXRlcyBhIHJhbmRvbSBodWUgdmFsdWUgYmV0d2VlbiAwIGFuZCAzNjAgZGVncmVlcywgYW5kIHJhbmRvbSBzYXR1cmF0aW9uIGFuZCBsaWdodG5lc3MgdmFsdWVzIGJldHdlZW4gNTAlIGFuZCAxMDAlLiBJdCB0aGVuIGNvbnZlcnRzIHRoZSBIU0wgdmFsdWVzIHRvIFJHQiB2YWx1ZXMgdXNpbmcgdGhlIGBoc2xUb1JnYmAgZnVuY3Rpb24sIGFuZCBmaW5hbGx5IGNvbnZlcnRzIHRoZSBSR0IgdmFsdWVzIHRvIGEgaGV4YWRlY2ltYWwgY29sb3IgY29kZSB1c2luZyB0aGUgYHJnYlRvSGV4YCBmdW5jdGlvbi5cbiAgICpcbiAgICogQHJldHVybnMgQSBoZXhhZGVjaW1hbCBjb2xvciBjb2RlIGluIHRoZSBmb3JtYXQgXCIjUlJHR0JCXCIuXG4gICAqL1xuICBnZW5lcmF0ZVJhbmRvbUNvbG9yKCkge1xuICAgIC8vIEdlbmVyYXRlIGEgcmFuZG9tIGh1ZSBiZXR3ZWVuIDAgYW5kIDM2MCAocmVwcmVzZW50aW5nIGRlZ3JlZXMgb24gdGhlIGNvbG9yIHdoZWVsKVxuICAgIGNvbnN0IGh1ZSA9IE1hdGguZmxvb3IoTWF0aC5yYW5kb20oKSAqIDM2MCk7XG5cbiAgICAvLyBHZW5lcmF0ZSByYW5kb20gc2F0dXJhdGlvbiBhbmQgbGlnaHRuZXNzIHZhbHVlcyBiZXR3ZWVuIDUwJSBhbmQgMTAwJVxuICAgIGNvbnN0IHNhdHVyYXRpb24gPSBNYXRoLmZsb29yKE1hdGgucmFuZG9tKCkgKiA1MSkgKyA1MDtcbiAgICBjb25zdCBsaWdodG5lc3MgPSBNYXRoLmZsb29yKE1hdGgucmFuZG9tKCkgKiA1MSkgKyA1MDtcblxuICAgIC8vIENvbnZlcnQgSFNMIHZhbHVlcyB0byBSR0IgdmFsdWVzXG4gICAgY29uc3QgcmdiQ29sb3IgPSB0aGlzLmhzbFRvUmdiKGh1ZSwgc2F0dXJhdGlvbiwgbGlnaHRuZXNzKTtcblxuICAgIC8vIENvbnZlcnQgUkdCIHZhbHVlcyB0byBoZXhhZGVjaW1hbCBjb2xvciBjb2RlXG4gICAgY29uc3QgaGV4Q29sb3IgPSB0aGlzLnJnYlRvSGV4KHJnYkNvbG9yLnIsIHJnYkNvbG9yLmcsIHJnYkNvbG9yLmIpO1xuXG4gICAgcmV0dXJuIGhleENvbG9yO1xuICB9XG5cbiAgLyoqXG4gICAqIENvbnZlcnRzIEhTTCAoSHVlLCBTYXR1cmF0aW9uLCBMaWdodG5lc3MpIGNvbG9yIHZhbHVlcyB0byBSR0IgKFJlZCwgR3JlZW4sIEJsdWUpIGNvbG9yIHZhbHVlcy5cbiAgICpcbiAgICogQHBhcmFtIGggLSBUaGUgaHVlIHZhbHVlLCByYW5naW5nIGZyb20gMCB0byAzNjAgZGVncmVlcy5cbiAgICogQHBhcmFtIHMgLSBUaGUgc2F0dXJhdGlvbiB2YWx1ZSwgcmFuZ2luZyBmcm9tIDAgdG8gMTAwIHBlcmNlbnQuXG4gICAqIEBwYXJhbSBsIC0gVGhlIGxpZ2h0bmVzcyB2YWx1ZSwgcmFuZ2luZyBmcm9tIDAgdG8gMTAwIHBlcmNlbnQuXG4gICAqIEByZXR1cm5zIEFuIG9iamVjdCB3aXRoIHRoZSBSR0IgY29sb3IgdmFsdWVzLCB3aGVyZSBlYWNoIHZhbHVlIGlzIGJldHdlZW4gMCBhbmQgMjU1LlxuICAgKi9cbiAgaHNsVG9SZ2IoaDogbnVtYmVyLCBzOiBudW1iZXIsIGw6IG51bWJlcikge1xuICAgIGggLz0gMzYwO1xuICAgIHMgLz0gMTAwO1xuICAgIGwgLz0gMTAwO1xuXG4gICAgbGV0IHIsIGcsIGI7XG5cbiAgICBpZiAocyA9PT0gMCkge1xuICAgICAgciA9IGcgPSBiID0gbDsgLy8gQWNocm9tYXRpYyBjb2xvciAoZ3JheSlcbiAgICB9IGVsc2Uge1xuICAgICAgY29uc3QgaHVlVG9SZ2IgPSAocDogbnVtYmVyLCBxOiBudW1iZXIsIHQ6IG51bWJlcikgPT4ge1xuICAgICAgICBpZiAodCA8IDApIHQgKz0gMTtcbiAgICAgICAgaWYgKHQgPiAxKSB0IC09IDE7XG4gICAgICAgIGlmICh0IDwgMSAvIDYpIHJldHVybiBwICsgKHEgLSBwKSAqIDYgKiB0O1xuICAgICAgICBpZiAodCA8IDEgLyAyKSByZXR1cm4gcTtcbiAgICAgICAgaWYgKHQgPCAyIC8gMykgcmV0dXJuIHAgKyAocSAtIHApICogKDIgLyAzIC0gdCkgKiA2O1xuICAgICAgICByZXR1cm4gcDtcbiAgICAgIH07XG5cbiAgICAgIGNvbnN0IHEgPSBsIDwgMC41ID8gbCAqICgxICsgcykgOiBsICsgcyAtIGwgKiBzO1xuICAgICAgY29uc3QgcCA9IDIgKiBsIC0gcTtcblxuICAgICAgciA9IE1hdGgucm91bmQoaHVlVG9SZ2IocCwgcSwgaCArIDEgLyAzKSAqIDI1NSk7XG4gICAgICBnID0gTWF0aC5yb3VuZChodWVUb1JnYihwLCBxLCBoKSAqIDI1NSk7XG4gICAgICBiID0gTWF0aC5yb3VuZChodWVUb1JnYihwLCBxLCBoIC0gMSAvIDMpICogMjU1KTtcbiAgICB9XG5cbiAgICByZXR1cm4geyByLCBnLCBiIH07XG4gIH1cblxuICAvKipcbiAgICogQ29udmVydHMgUkdCIGNvbG9yIHZhbHVlcyB0byBhIGhleGFkZWNpbWFsIGNvbG9yIHN0cmluZy5cbiAgICpcbiAgICogQHBhcmFtIHIgLSBUaGUgcmVkIGNvbG9yIHZhbHVlLCBiZXR3ZWVuIDAgYW5kIDI1NS5cbiAgICogQHBhcmFtIGcgLSBUaGUgZ3JlZW4gY29sb3IgdmFsdWUsIGJldHdlZW4gMCBhbmQgMjU1LlxuICAgKiBAcGFyYW0gYiAtIFRoZSBibHVlIGNvbG9yIHZhbHVlLCBiZXR3ZWVuIDAgYW5kIDI1NS5cbiAgICogQHJldHVybnMgQSBoZXhhZGVjaW1hbCBjb2xvciBzdHJpbmcgaW4gdGhlIGZvcm1hdCBcIiNSUkdHQkJcIi5cbiAgICovXG4gIHJnYlRvSGV4KHI6IG51bWJlciwgZzogbnVtYmVyLCBiOiBudW1iZXIpIHtcbiAgICBjb25zdCBjb21wb25lbnRUb0hleCA9IChjOiBudW1iZXIpID0+IHtcbiAgICAgIGNvbnN0IGhleCA9IGMudG9TdHJpbmcoMTYpO1xuICAgICAgcmV0dXJuIGhleC5sZW5ndGggPT09IDEgPyBcIjBcIiArIGhleCA6IGhleDtcbiAgICB9O1xuXG4gICAgcmV0dXJuIFwiI1wiICsgY29tcG9uZW50VG9IZXgocikgKyBjb21wb25lbnRUb0hleChnKSArIGNvbXBvbmVudFRvSGV4KGIpO1xuICB9XG5cbiAgICAvKipcbiAgICogQWRqdXN0cyBhIGhleGFkZWNpbWFsIGNvbG9yIHZhbHVlIGJ5IGEgZ2l2ZW4gcGVyY2VudGFnZS5cbiAgICpcbiAgICogQHBhcmFtIGhleENvbG9yIC0gVGhlIGhleGFkZWNpbWFsIGNvbG9yIHZhbHVlIHRvIGFkanVzdC5cbiAgICogQHBhcmFtIHBlcmNlbnRhZ2UgLSBUaGUgcGVyY2VudGFnZSB0byBhZGp1c3QgdGhlIGNvbG9yIGJ5LCByYW5naW5nIGZyb20gLTEwMCB0byAxMDAuXG4gICAqIEByZXR1cm5zIFRoZSBhZGp1c3RlZCBoZXhhZGVjaW1hbCBjb2xvciB2YWx1ZS5cbiAgICovXG4gIGFkanVzdEhleENvbG9yKGhleENvbG9yOiBzdHJpbmcsIHBlcmNlbnRhZ2U6IG51bWJlcikge1xuICAgIC8vIFJlbW92ZSB0aGUgXCIjXCIgc3ltYm9sIGlmIHByZXNlbnRcbiAgICBoZXhDb2xvciA9IGhleENvbG9yLnJlcGxhY2UoXCIjXCIsIFwiXCIpO1xuXG4gICAgLy8gQ29udmVydCB0aGUgaGV4IGNvbG9yIHRvIFJHQiB2YWx1ZXNcbiAgICBjb25zdCByZWQgPSBwYXJzZUludChoZXhDb2xvci5zdWJzdHJpbmcoMCwgMiksIDE2KTtcbiAgICBjb25zdCBncmVlbiA9IHBhcnNlSW50KGhleENvbG9yLnN1YnN0cmluZygyLCA0KSwgMTYpO1xuICAgIGNvbnN0IGJsdWUgPSBwYXJzZUludChoZXhDb2xvci5zdWJzdHJpbmcoNCwgNiksIDE2KTtcblxuICAgIC8vIENhbGN1bGF0ZSB0aGUgYWRqdXN0bWVudCBhbW91bnQgYmFzZWQgb24gdGhlIHBlcmNlbnRhZ2VcbiAgICBjb25zdCBhZGp1c3RBbW91bnQgPSBNYXRoLnJvdW5kKDI1NSAqIChwZXJjZW50YWdlIC8gMTAwKSk7XG5cbiAgICAvLyBBZGp1c3QgdGhlIFJHQiB2YWx1ZXNcbiAgICBjb25zdCBhZGp1c3RlZFJlZCA9IHRoaXMuY2xhbXAocmVkICsgYWRqdXN0QW1vdW50KTtcbiAgICBjb25zdCBhZGp1c3RlZEdyZWVuID0gdGhpcy5jbGFtcChncmVlbiArIGFkanVzdEFtb3VudCk7XG4gICAgY29uc3QgYWRqdXN0ZWRCbHVlID0gdGhpcy5jbGFtcChibHVlICsgYWRqdXN0QW1vdW50KTtcblxuICAgIC8vIENvbnZlcnQgdGhlIGFkanVzdGVkIFJHQiB2YWx1ZXMgYmFjayB0byBoZXhcbiAgICBjb25zdCBhZGp1c3RlZEhleENvbG9yID0gYCMkeyhhZGp1c3RlZFJlZCkudG9TdHJpbmcoMTYpLnBhZFN0YXJ0KDIsICcwJyl9JHsoYWRqdXN0ZWRHcmVlbikudG9TdHJpbmcoMTYpLnBhZFN0YXJ0KDIsICcwJyl9JHsoYWRqdXN0ZWRCbHVlKS50b1N0cmluZygxNikucGFkU3RhcnQoMiwgJzAnKX1gO1xuXG4gICAgcmV0dXJuIGFkanVzdGVkSGV4Q29sb3I7XG4gIH1cblxuICBjbGFtcCh2YWx1ZTogbnVtYmVyKSB7XG4gICAgcmV0dXJuIE1hdGgubWF4KDAsIE1hdGgubWluKHZhbHVlLCAyNTUpKTtcbiAgfVxuXG59XG4iXX0=
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
import { Component, inject } from '@angular/core';
|
|
2
|
+
import { ColorConversionService } from '../color-conversion.service';
|
|
3
|
+
import { ColorPalletteService } from '../color-pallette.service';
|
|
4
|
+
import { TextColorService } from '../text-color.service';
|
|
5
|
+
import { ColorLightenDarkenService } from '../color-lighten-darken.service';
|
|
6
|
+
import { ColorSchemeService } from '../color-scheme.service';
|
|
7
|
+
import * as i0 from "@angular/core";
|
|
8
|
+
import * as i1 from "@angular/common";
|
|
9
|
+
import * as i2 from "@angular/material/divider";
|
|
10
|
+
export class ColorUtilitiesDemoComponent {
|
|
11
|
+
constructor() {
|
|
12
|
+
this.colorConversionService = inject(ColorConversionService);
|
|
13
|
+
this.colorLightenDarkenService = inject(ColorLightenDarkenService);
|
|
14
|
+
this.colorPalletteService = inject(ColorPalletteService);
|
|
15
|
+
this.textColorService = inject(TextColorService);
|
|
16
|
+
this.colorSchemeService = inject(ColorSchemeService);
|
|
17
|
+
this.HEX = this.colorConversionService.rgbToHex([12, 56, 128]);
|
|
18
|
+
this.RGB = `rgb(${this.colorConversionService.hexToRgb('#AA11BB')})`;
|
|
19
|
+
this.lighten = this.colorLightenDarkenService.lighten('#AA11BB', .25);
|
|
20
|
+
this.darken = this.colorLightenDarkenService.darken('#AA11BB', .25);
|
|
21
|
+
this.colorIsDarker = this.textColorService.isColorDarker(this.lighten, this.darken);
|
|
22
|
+
this.darkBk = this.textColorService.textColorForBgColor(this.HEX, this.lighten, this.darken);
|
|
23
|
+
this.lightBk = this.textColorService.textColorForBgColor('whitesmoke', this.lighten, this.darken);
|
|
24
|
+
this.colors$ = this.colorPalletteService.palette$;
|
|
25
|
+
this.colorPick = this.colorSchemeService.generateRandomColor();
|
|
26
|
+
this.colorPickDarker = this.colorSchemeService.adjustHexColor(this.colorPick, -25);
|
|
27
|
+
this.colorPickLighter = this.colorSchemeService.adjustHexColor(this.colorPick, 25);
|
|
28
|
+
}
|
|
29
|
+
ngOnInit() {
|
|
30
|
+
// define image path
|
|
31
|
+
this.img = 'assets/picture.webp';
|
|
32
|
+
this.colorPalletteService.getColorsFromImage(this.img, 8);
|
|
33
|
+
}
|
|
34
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ColorUtilitiesDemoComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
35
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ColorUtilitiesDemoComponent, selector: "app-color-utilities-demo", ngImport: i0, template: "<div style=\"margin: 2rem;\">\n\n <h1>Color Conversion Service</h1>\n <div style=\"display: flex; flex-direction: column; gap: 1rem;\">\n <div style=\"display: flex\">\n <div style=\"padding-top: .5rem; margin-right: .5rem;\">rgbToHex: {{ HEX }}</div>\n <div style=\"width: 32px; height: 32px;\" [style.backgroundColor]=\"HEX\"></div>\n </div>\n\n <div style=\"display: flex\">\n <div style=\"padding-top: .5rem; margin-right: .5rem;\"> hexToRgb: {{ RGB }} </div>\n <div style=\"width: 32px; height: 32px;\" [style.backgroundColor]=\"RGB\"></div>\n </div>\n </div>\n\n <div style=\"margin-top: 1rem; margin-bottom: 1rem;\">\n <mat-divider></mat-divider>\n </div>\n\n <h1>Color Light/Darken Service</h1>\n\n <div style=\"display: flex; flex-direction: column; gap: 1rem;\">\n\n <div style=\"display: flex; gap: 1rem\">\n Original Color: #AA11BB<br>\n <div style=\"width: 32px; height: 32px; background-color: #AA11BB;\"></div>\n Lighten (25%): {{ lighten }}<br>\n <div style=\"width: 32px; height: 32px;\" [style.backgroundColor]=\"lighten\"></div>\n Darken (25%): {{ darken }}<br>\n <div style=\"width: 32px; height: 32px;\" [style.backgroundColor]=\"darken\"></div>\n </div>\n\n </div>\n\n <div style=\"margin-top: 1rem; margin-bottom: 1rem;\">\n <mat-divider></mat-divider>\n </div>\n\n <h1>Text Color Utility Services</h1>\n\n <div style=\"display: flex; gap: 1rem; flex-direction: column;\">\n <div style=\"display: flex; gap: 1rem\">\n <div style=\"width: 32px; height: 32px;\" [style.backgroundColor]=\"darken\"></div>\n <div style=\"width: 32px; height: 32px;\" [style.backgroundColor]=\"lighten\"></div>\n is Darker : {{ colorIsDarker }}\n <div style=\"width: 32px; height: 32px;\" [style.backgroundColor]=\"colorIsDarker\"></div>\n </div>\n \n <div style=\"display: flex; gap: 1rem; flex-direction: column;\">\n \n <div>\n Use: {{ lightBk }} for '{{ HEX }}' background-color<br>\n <div style=\"padding: 1rem;\" [style.backgroundColor]=\"HEX\" [style.color]=\"darkBk\">\n Sample Text Color\n </div>\n </div>\n\n <div>\n Use: {{ lightBk }} for 'whitesmoke' background-color<br>\n <div style=\"padding: 1rem; background-color: whitesmoke;\" [style.color]=\"lightBk\">\n Sample Text Color\n </div>\n </div>\n </div>\n </div>\n\n <div style=\"margin-top: 1rem; margin-bottom: 1rem;\">\n <mat-divider></mat-divider>\n </div>\n \n <h1>Color Schema Services</h1>\n\n <div style=\"display: flex; gap: 1rem\">\n Pick Color: {{ colorPick }}<br>\n <div style=\"width: 32px; height: 32px;\" [style.backgroundColor]=\"colorPick\"></div>\n Lighter Version: {{ colorPickLighter }}<br>\n <div style=\"width: 32px; height: 32px;\" [style.backgroundColor]=\"colorPickLighter\"></div>\n DarkerVersion: {{ colorPickDarker }}<br>\n <div style=\"width: 32px; height: 32px;\" [style.backgroundColor]=\"colorPickDarker\"></div>\n </div>\n\n <div style=\"margin-top: 1rem; margin-bottom: 1rem;\">\n <mat-divider></mat-divider>\n </div>\n\n <h1>Color Pallette Service</h1>\n Creates Pallette from Image\n <div style=\"display: flex; gap: 2rem;\">\n <div>\n <img [src]=\"img\" height=\"180\">\n </div>\n\n <div style=\"display: flex; gap: .5rem; width: 120px; border: 1px solid black; flex-wrap: wrap; padding: .5rem;\">\n <div>Color Pick</div>\n <ng-container *ngFor=\"let color of (colors$ | async)\">\n <div style=\"width: 32px; height: 32px;\" [style.backgroundColor]=\"color.color\"></div>\n </ng-container>\n </div>\n \n <div style=\"display: flex; gap: .5rem; width: 120px; border: 1px solid black; flex-wrap: wrap; padding: .5rem;\">\n <div>Complementary</div>\n <ng-container *ngFor=\"let color of (colors$ | async)\">\n <div style=\"width: 32px; height: 32px;\" [style.backgroundColor]=\"color.complementaryColor\"></div>\n </ng-container>\n </div>\n </div>\n\n</div>\n\n", styles: [".box{width:100px;height:100px;border:solid thin black;color:#000;margin:4px;padding:16px;display:flex;flex-wrap:wrap;align-content:center;justify-content:center}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: i2.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] }); }
|
|
36
|
+
}
|
|
37
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ColorUtilitiesDemoComponent, decorators: [{
|
|
38
|
+
type: Component,
|
|
39
|
+
args: [{ selector: 'app-color-utilities-demo', template: "<div style=\"margin: 2rem;\">\n\n <h1>Color Conversion Service</h1>\n <div style=\"display: flex; flex-direction: column; gap: 1rem;\">\n <div style=\"display: flex\">\n <div style=\"padding-top: .5rem; margin-right: .5rem;\">rgbToHex: {{ HEX }}</div>\n <div style=\"width: 32px; height: 32px;\" [style.backgroundColor]=\"HEX\"></div>\n </div>\n\n <div style=\"display: flex\">\n <div style=\"padding-top: .5rem; margin-right: .5rem;\"> hexToRgb: {{ RGB }} </div>\n <div style=\"width: 32px; height: 32px;\" [style.backgroundColor]=\"RGB\"></div>\n </div>\n </div>\n\n <div style=\"margin-top: 1rem; margin-bottom: 1rem;\">\n <mat-divider></mat-divider>\n </div>\n\n <h1>Color Light/Darken Service</h1>\n\n <div style=\"display: flex; flex-direction: column; gap: 1rem;\">\n\n <div style=\"display: flex; gap: 1rem\">\n Original Color: #AA11BB<br>\n <div style=\"width: 32px; height: 32px; background-color: #AA11BB;\"></div>\n Lighten (25%): {{ lighten }}<br>\n <div style=\"width: 32px; height: 32px;\" [style.backgroundColor]=\"lighten\"></div>\n Darken (25%): {{ darken }}<br>\n <div style=\"width: 32px; height: 32px;\" [style.backgroundColor]=\"darken\"></div>\n </div>\n\n </div>\n\n <div style=\"margin-top: 1rem; margin-bottom: 1rem;\">\n <mat-divider></mat-divider>\n </div>\n\n <h1>Text Color Utility Services</h1>\n\n <div style=\"display: flex; gap: 1rem; flex-direction: column;\">\n <div style=\"display: flex; gap: 1rem\">\n <div style=\"width: 32px; height: 32px;\" [style.backgroundColor]=\"darken\"></div>\n <div style=\"width: 32px; height: 32px;\" [style.backgroundColor]=\"lighten\"></div>\n is Darker : {{ colorIsDarker }}\n <div style=\"width: 32px; height: 32px;\" [style.backgroundColor]=\"colorIsDarker\"></div>\n </div>\n \n <div style=\"display: flex; gap: 1rem; flex-direction: column;\">\n \n <div>\n Use: {{ lightBk }} for '{{ HEX }}' background-color<br>\n <div style=\"padding: 1rem;\" [style.backgroundColor]=\"HEX\" [style.color]=\"darkBk\">\n Sample Text Color\n </div>\n </div>\n\n <div>\n Use: {{ lightBk }} for 'whitesmoke' background-color<br>\n <div style=\"padding: 1rem; background-color: whitesmoke;\" [style.color]=\"lightBk\">\n Sample Text Color\n </div>\n </div>\n </div>\n </div>\n\n <div style=\"margin-top: 1rem; margin-bottom: 1rem;\">\n <mat-divider></mat-divider>\n </div>\n \n <h1>Color Schema Services</h1>\n\n <div style=\"display: flex; gap: 1rem\">\n Pick Color: {{ colorPick }}<br>\n <div style=\"width: 32px; height: 32px;\" [style.backgroundColor]=\"colorPick\"></div>\n Lighter Version: {{ colorPickLighter }}<br>\n <div style=\"width: 32px; height: 32px;\" [style.backgroundColor]=\"colorPickLighter\"></div>\n DarkerVersion: {{ colorPickDarker }}<br>\n <div style=\"width: 32px; height: 32px;\" [style.backgroundColor]=\"colorPickDarker\"></div>\n </div>\n\n <div style=\"margin-top: 1rem; margin-bottom: 1rem;\">\n <mat-divider></mat-divider>\n </div>\n\n <h1>Color Pallette Service</h1>\n Creates Pallette from Image\n <div style=\"display: flex; gap: 2rem;\">\n <div>\n <img [src]=\"img\" height=\"180\">\n </div>\n\n <div style=\"display: flex; gap: .5rem; width: 120px; border: 1px solid black; flex-wrap: wrap; padding: .5rem;\">\n <div>Color Pick</div>\n <ng-container *ngFor=\"let color of (colors$ | async)\">\n <div style=\"width: 32px; height: 32px;\" [style.backgroundColor]=\"color.color\"></div>\n </ng-container>\n </div>\n \n <div style=\"display: flex; gap: .5rem; width: 120px; border: 1px solid black; flex-wrap: wrap; padding: .5rem;\">\n <div>Complementary</div>\n <ng-container *ngFor=\"let color of (colors$ | async)\">\n <div style=\"width: 32px; height: 32px;\" [style.backgroundColor]=\"color.complementaryColor\"></div>\n </ng-container>\n </div>\n </div>\n\n</div>\n\n", styles: [".box{width:100px;height:100px;border:solid thin black;color:#000;margin:4px;padding:16px;display:flex;flex-wrap:wrap;align-content:center;justify-content:center}\n"] }]
|
|
40
|
+
}], ctorParameters: function () { return []; } });
|
|
41
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY29sb3ItdXRpbGl0aWVzLWRlbW8uY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvY29sb3ItdXRpbHMvc3JjL2xpYi9jb2xvci11dGlsaXRpZXMtZGVtby9jb2xvci11dGlsaXRpZXMtZGVtby5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9jb2xvci11dGlscy9zcmMvbGliL2NvbG9yLXV0aWxpdGllcy1kZW1vL2NvbG9yLXV0aWxpdGllcy1kZW1vLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQVUsTUFBTSxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBRTFELE9BQU8sRUFBRSxzQkFBc0IsRUFBRSxNQUFNLDZCQUE2QixDQUFDO0FBQ3JFLE9BQU8sRUFBRSxvQkFBb0IsRUFBRSxNQUFNLDJCQUEyQixDQUFDO0FBQ2pFLE9BQU8sRUFBRSxnQkFBZ0IsRUFBRSxNQUFNLHVCQUF1QixDQUFDO0FBQ3pELE9BQU8sRUFBRSx5QkFBeUIsRUFBRSxNQUFNLGlDQUFpQyxDQUFDO0FBQzVFLE9BQU8sRUFBRSxrQkFBa0IsRUFBRSxNQUFNLHlCQUF5QixDQUFDOzs7O0FBTzdELE1BQU0sT0FBTywyQkFBMkI7SUE4QnRDO1FBNUJBLDJCQUFzQixHQUFHLE1BQU0sQ0FBQyxzQkFBc0IsQ0FBQyxDQUFBO1FBQ3ZELDhCQUF5QixHQUFHLE1BQU0sQ0FBQyx5QkFBeUIsQ0FBQyxDQUFBO1FBQzdELHlCQUFvQixHQUFHLE1BQU0sQ0FBQyxvQkFBb0IsQ0FBQyxDQUFBO1FBQ25ELHFCQUFnQixHQUFHLE1BQU0sQ0FBQyxnQkFBZ0IsQ0FBQyxDQUFBO1FBQzNDLHVCQUFrQixHQUFHLE1BQU0sQ0FBQyxrQkFBa0IsQ0FBQyxDQUFBO1FBRy9DLFFBQUcsR0FBRyxJQUFJLENBQUMsc0JBQXNCLENBQUMsUUFBUSxDQUFDLENBQUMsRUFBRSxFQUFFLEVBQUUsRUFBRSxHQUFHLENBQUMsQ0FBQyxDQUFBO1FBQ3pELFFBQUcsR0FBRyxPQUFPLElBQUksQ0FBQyxzQkFBc0IsQ0FBQyxRQUFRLENBQUMsU0FBUyxDQUFDLEdBQUcsQ0FBQTtRQUcvRCxZQUFPLEdBQUcsSUFBSSxDQUFDLHlCQUF5QixDQUFDLE9BQU8sQ0FBQyxTQUFTLEVBQUUsR0FBRyxDQUFDLENBQUE7UUFDaEUsV0FBTSxHQUFHLElBQUksQ0FBQyx5QkFBeUIsQ0FBQyxNQUFNLENBQUMsU0FBUyxFQUFFLEdBQUcsQ0FBQyxDQUFBO1FBRTlELGtCQUFhLEdBQUcsSUFBSSxDQUFDLGdCQUFnQixDQUFDLGFBQWEsQ0FBQyxJQUFJLENBQUMsT0FBTyxFQUFFLElBQUksQ0FBQyxNQUFNLENBQUMsQ0FBQTtRQUU5RSxXQUFNLEdBQUcsSUFBSSxDQUFDLGdCQUFnQixDQUFDLG1CQUFtQixDQUFDLElBQUksQ0FBQyxHQUFHLEVBQUUsSUFBSSxDQUFDLE9BQU8sRUFBRSxJQUFJLENBQUMsTUFBTSxDQUFDLENBQUE7UUFDdkYsWUFBTyxHQUFHLElBQUksQ0FBQyxnQkFBZ0IsQ0FBQyxtQkFBbUIsQ0FBQyxZQUFZLEVBQUUsSUFBSSxDQUFDLE9BQU8sRUFBRSxJQUFJLENBQUMsTUFBTSxDQUFDLENBQUE7UUFHNUYsWUFBTyxHQUFHLElBQUksQ0FBQyxvQkFBb0IsQ0FBQyxRQUFRLENBQUE7UUFFNUMsY0FBUyxHQUFHLElBQUksQ0FBQyxrQkFBa0IsQ0FBQyxtQkFBbUIsRUFBRSxDQUFBO1FBQ3pELG9CQUFlLEdBQUcsSUFBSSxDQUFDLGtCQUFrQixDQUFDLGNBQWMsQ0FBQyxJQUFJLENBQUMsU0FBUyxFQUFFLENBQUMsRUFBRSxDQUFDLENBQUE7UUFDN0UscUJBQWdCLEdBQUcsSUFBSSxDQUFDLGtCQUFrQixDQUFDLGNBQWMsQ0FBQyxJQUFJLENBQUMsU0FBUyxFQUFFLEVBQUUsQ0FBQyxDQUFBO0lBSTdELENBQUM7SUFFakIsUUFBUTtRQUVOLG9CQUFvQjtRQUNwQixJQUFJLENBQUMsR0FBRyxHQUFHLHFCQUFxQixDQUFBO1FBQ2hDLElBQUksQ0FBQyxvQkFBb0IsQ0FBQyxrQkFBa0IsQ0FBQyxJQUFJLENBQUMsR0FBRyxFQUFFLENBQUMsQ0FBQyxDQUFBO0lBRzNELENBQUM7K0dBdkNVLDJCQUEyQjttR0FBM0IsMkJBQTJCLGdFQ2J4QywwK0hBNkdBOzs0RkRoR2EsMkJBQTJCO2tCQUx2QyxTQUFTOytCQUNFLDBCQUEwQiIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgT25Jbml0LCBpbmplY3QgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcblxuaW1wb3J0IHsgQ29sb3JDb252ZXJzaW9uU2VydmljZSB9IGZyb20gJy4uL2NvbG9yLWNvbnZlcnNpb24uc2VydmljZSc7XG5pbXBvcnQgeyBDb2xvclBhbGxldHRlU2VydmljZSB9IGZyb20gJy4uL2NvbG9yLXBhbGxldHRlLnNlcnZpY2UnO1xuaW1wb3J0IHsgVGV4dENvbG9yU2VydmljZSB9IGZyb20gJy4uL3RleHQtY29sb3Iuc2VydmljZSc7XG5pbXBvcnQgeyBDb2xvckxpZ2h0ZW5EYXJrZW5TZXJ2aWNlIH0gZnJvbSAnLi4vY29sb3ItbGlnaHRlbi1kYXJrZW4uc2VydmljZSc7XG5pbXBvcnQgeyBDb2xvclNjaGVtZVNlcnZpY2UgfSBmcm9tICcuLi9jb2xvci1zY2hlbWUuc2VydmljZSc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ2FwcC1jb2xvci11dGlsaXRpZXMtZGVtbycsXG4gIHRlbXBsYXRlVXJsOiAnLi9jb2xvci11dGlsaXRpZXMtZGVtby5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsczogWycuL2NvbG9yLXV0aWxpdGllcy1kZW1vLmNvbXBvbmVudC5jc3MnXSxcbn0pXG5leHBvcnQgY2xhc3MgQ29sb3JVdGlsaXRpZXNEZW1vQ29tcG9uZW50IGltcGxlbWVudHMgT25Jbml0IHtcblxuICBjb2xvckNvbnZlcnNpb25TZXJ2aWNlID0gaW5qZWN0KENvbG9yQ29udmVyc2lvblNlcnZpY2UpXG4gIGNvbG9yTGlnaHRlbkRhcmtlblNlcnZpY2UgPSBpbmplY3QoQ29sb3JMaWdodGVuRGFya2VuU2VydmljZSlcbiAgY29sb3JQYWxsZXR0ZVNlcnZpY2UgPSBpbmplY3QoQ29sb3JQYWxsZXR0ZVNlcnZpY2UpXG4gIHRleHRDb2xvclNlcnZpY2UgPSBpbmplY3QoVGV4dENvbG9yU2VydmljZSlcbiAgY29sb3JTY2hlbWVTZXJ2aWNlID0gaW5qZWN0KENvbG9yU2NoZW1lU2VydmljZSlcblxuXG4gIEhFWCA9IHRoaXMuY29sb3JDb252ZXJzaW9uU2VydmljZS5yZ2JUb0hleChbMTIsIDU2LCAxMjhdKVxuICBSR0IgPSBgcmdiKCR7dGhpcy5jb2xvckNvbnZlcnNpb25TZXJ2aWNlLmhleFRvUmdiKCcjQUExMUJCJyl9KWBcblxuXG4gIGxpZ2h0ZW4gPSB0aGlzLmNvbG9yTGlnaHRlbkRhcmtlblNlcnZpY2UubGlnaHRlbignI0FBMTFCQicsIC4yNSlcbiAgZGFya2VuID0gdGhpcy5jb2xvckxpZ2h0ZW5EYXJrZW5TZXJ2aWNlLmRhcmtlbignI0FBMTFCQicsIC4yNSlcblxuICBjb2xvcklzRGFya2VyID0gdGhpcy50ZXh0Q29sb3JTZXJ2aWNlLmlzQ29sb3JEYXJrZXIodGhpcy5saWdodGVuLCB0aGlzLmRhcmtlbilcblxuICBkYXJrQmsgPSB0aGlzLnRleHRDb2xvclNlcnZpY2UudGV4dENvbG9yRm9yQmdDb2xvcih0aGlzLkhFWCwgdGhpcy5saWdodGVuLCB0aGlzLmRhcmtlbilcbiAgbGlnaHRCayA9IHRoaXMudGV4dENvbG9yU2VydmljZS50ZXh0Q29sb3JGb3JCZ0NvbG9yKCd3aGl0ZXNtb2tlJywgdGhpcy5saWdodGVuLCB0aGlzLmRhcmtlbilcblxuICBwYWxldHRlOiBhbnlcbiAgY29sb3JzJCA9IHRoaXMuY29sb3JQYWxsZXR0ZVNlcnZpY2UucGFsZXR0ZSRcblxuICBjb2xvclBpY2sgPSB0aGlzLmNvbG9yU2NoZW1lU2VydmljZS5nZW5lcmF0ZVJhbmRvbUNvbG9yKClcbiAgY29sb3JQaWNrRGFya2VyID0gdGhpcy5jb2xvclNjaGVtZVNlcnZpY2UuYWRqdXN0SGV4Q29sb3IodGhpcy5jb2xvclBpY2ssIC0yNSlcbiAgY29sb3JQaWNrTGlnaHRlciA9IHRoaXMuY29sb3JTY2hlbWVTZXJ2aWNlLmFkanVzdEhleENvbG9yKHRoaXMuY29sb3JQaWNrLCAyNSlcblxuICBpbWc6IHN0cmluZ3xhbnlcblxuICBjb25zdHJ1Y3RvcigpIHsgfVxuXG4gIG5nT25Jbml0KCkge1xuXG4gICAgLy8gZGVmaW5lIGltYWdlIHBhdGhcbiAgICB0aGlzLmltZyA9ICdhc3NldHMvcGljdHVyZS53ZWJwJ1xuICAgIHRoaXMuY29sb3JQYWxsZXR0ZVNlcnZpY2UuZ2V0Q29sb3JzRnJvbUltYWdlKHRoaXMuaW1nLCA4KVxuXG5cbiAgfVxuXG5cbn1cblxuIiwiPGRpdiBzdHlsZT1cIm1hcmdpbjogMnJlbTtcIj5cblxuICA8aDE+Q29sb3IgQ29udmVyc2lvbiBTZXJ2aWNlPC9oMT5cbiAgPGRpdiBzdHlsZT1cImRpc3BsYXk6IGZsZXg7IGZsZXgtZGlyZWN0aW9uOiBjb2x1bW47IGdhcDogMXJlbTtcIj5cbiAgICA8ZGl2IHN0eWxlPVwiZGlzcGxheTogZmxleFwiPlxuICAgICAgPGRpdiBzdHlsZT1cInBhZGRpbmctdG9wOiAuNXJlbTsgbWFyZ2luLXJpZ2h0OiAuNXJlbTtcIj5yZ2JUb0hleDoge3sgSEVYIH19PC9kaXY+XG4gICAgICA8ZGl2IHN0eWxlPVwid2lkdGg6IDMycHg7IGhlaWdodDogMzJweDtcIiBbc3R5bGUuYmFja2dyb3VuZENvbG9yXT1cIkhFWFwiPjwvZGl2PlxuICAgIDwvZGl2PlxuXG4gICAgPGRpdiBzdHlsZT1cImRpc3BsYXk6IGZsZXhcIj5cbiAgICAgIDxkaXYgc3R5bGU9XCJwYWRkaW5nLXRvcDogLjVyZW07IG1hcmdpbi1yaWdodDogLjVyZW07XCI+IGhleFRvUmdiOiB7eyBSR0IgfX0gPC9kaXY+XG4gICAgICA8ZGl2IHN0eWxlPVwid2lkdGg6IDMycHg7IGhlaWdodDogMzJweDtcIiBbc3R5bGUuYmFja2dyb3VuZENvbG9yXT1cIlJHQlwiPjwvZGl2PlxuICAgIDwvZGl2PlxuICA8L2Rpdj5cblxuICA8ZGl2IHN0eWxlPVwibWFyZ2luLXRvcDogMXJlbTsgbWFyZ2luLWJvdHRvbTogMXJlbTtcIj5cbiAgICA8bWF0LWRpdmlkZXI+PC9tYXQtZGl2aWRlcj5cbiAgPC9kaXY+XG5cbiAgPGgxPkNvbG9yIExpZ2h0L0RhcmtlbiBTZXJ2aWNlPC9oMT5cblxuICA8ZGl2IHN0eWxlPVwiZGlzcGxheTogZmxleDsgZmxleC1kaXJlY3Rpb246IGNvbHVtbjsgZ2FwOiAxcmVtO1wiPlxuXG4gICAgPGRpdiBzdHlsZT1cImRpc3BsYXk6IGZsZXg7IGdhcDogMXJlbVwiPlxuICAgICAgT3JpZ2luYWwgQ29sb3I6ICNBQTExQkI8YnI+XG4gICAgICA8ZGl2IHN0eWxlPVwid2lkdGg6IDMycHg7IGhlaWdodDogMzJweDsgYmFja2dyb3VuZC1jb2xvcjogI0FBMTFCQjtcIj48L2Rpdj5cbiAgICAgIExpZ2h0ZW4gKDI1JSk6IHt7IGxpZ2h0ZW4gfX08YnI+XG4gICAgICA8ZGl2IHN0eWxlPVwid2lkdGg6IDMycHg7IGhlaWdodDogMzJweDtcIiBbc3R5bGUuYmFja2dyb3VuZENvbG9yXT1cImxpZ2h0ZW5cIj48L2Rpdj5cbiAgICAgIERhcmtlbiAoMjUlKToge3sgZGFya2VuIH19PGJyPlxuICAgICAgPGRpdiBzdHlsZT1cIndpZHRoOiAzMnB4OyBoZWlnaHQ6IDMycHg7XCIgW3N0eWxlLmJhY2tncm91bmRDb2xvcl09XCJkYXJrZW5cIj48L2Rpdj5cbiAgICA8L2Rpdj5cblxuICA8L2Rpdj5cblxuICA8ZGl2IHN0eWxlPVwibWFyZ2luLXRvcDogMXJlbTsgbWFyZ2luLWJvdHRvbTogMXJlbTtcIj5cbiAgICA8bWF0LWRpdmlkZXI+PC9tYXQtZGl2aWRlcj5cbiAgPC9kaXY+XG5cbiAgPGgxPlRleHQgQ29sb3IgVXRpbGl0eSBTZXJ2aWNlczwvaDE+XG5cbiAgPGRpdiBzdHlsZT1cImRpc3BsYXk6IGZsZXg7IGdhcDogMXJlbTsgZmxleC1kaXJlY3Rpb246IGNvbHVtbjtcIj5cbiAgICA8ZGl2IHN0eWxlPVwiZGlzcGxheTogZmxleDsgZ2FwOiAxcmVtXCI+XG4gICAgICA8ZGl2IHN0eWxlPVwid2lkdGg6IDMycHg7IGhlaWdodDogMzJweDtcIiBbc3R5bGUuYmFja2dyb3VuZENvbG9yXT1cImRhcmtlblwiPjwvZGl2PlxuICAgICAgPGRpdiBzdHlsZT1cIndpZHRoOiAzMnB4OyBoZWlnaHQ6IDMycHg7XCIgW3N0eWxlLmJhY2tncm91bmRDb2xvcl09XCJsaWdodGVuXCI+PC9kaXY+XG4gICAgICBpcyBEYXJrZXIgOiB7eyBjb2xvcklzRGFya2VyIH19XG4gICAgICA8ZGl2IHN0eWxlPVwid2lkdGg6IDMycHg7IGhlaWdodDogMzJweDtcIiBbc3R5bGUuYmFja2dyb3VuZENvbG9yXT1cImNvbG9ySXNEYXJrZXJcIj48L2Rpdj5cbiAgICA8L2Rpdj5cbiAgXG4gICAgPGRpdiBzdHlsZT1cImRpc3BsYXk6IGZsZXg7IGdhcDogMXJlbTsgZmxleC1kaXJlY3Rpb246IGNvbHVtbjtcIj5cbiAgICAgIFxuICAgICAgPGRpdj5cbiAgICAgICAgVXNlOiB7eyBsaWdodEJrIH19IGZvciAne3sgSEVYIH19JyBiYWNrZ3JvdW5kLWNvbG9yPGJyPlxuICAgICAgICA8ZGl2IHN0eWxlPVwicGFkZGluZzogMXJlbTtcIiBbc3R5bGUuYmFja2dyb3VuZENvbG9yXT1cIkhFWFwiIFtzdHlsZS5jb2xvcl09XCJkYXJrQmtcIj5cbiAgICAgICAgU2FtcGxlIFRleHQgQ29sb3JcbiAgICAgICAgPC9kaXY+XG4gICAgICA8L2Rpdj5cblxuICAgICAgPGRpdj5cbiAgICAgICAgVXNlOiB7eyBsaWdodEJrIH19IGZvciAnd2hpdGVzbW9rZScgYmFja2dyb3VuZC1jb2xvcjxicj5cbiAgICAgICAgPGRpdiBzdHlsZT1cInBhZGRpbmc6IDFyZW07IGJhY2tncm91bmQtY29sb3I6IHdoaXRlc21va2U7XCIgW3N0eWxlLmNvbG9yXT1cImxpZ2h0QmtcIj5cbiAgICAgICAgICBTYW1wbGUgVGV4dCBDb2xvclxuICAgICAgICA8L2Rpdj5cbiAgICAgIDwvZGl2PlxuICAgIDwvZGl2PlxuICA8L2Rpdj5cblxuICA8ZGl2IHN0eWxlPVwibWFyZ2luLXRvcDogMXJlbTsgbWFyZ2luLWJvdHRvbTogMXJlbTtcIj5cbiAgICA8bWF0LWRpdmlkZXI+PC9tYXQtZGl2aWRlcj5cbiAgPC9kaXY+XG4gIFxuIDxoMT5Db2xvciBTY2hlbWEgU2VydmljZXM8L2gxPlxuXG4gIDxkaXYgc3R5bGU9XCJkaXNwbGF5OiBmbGV4OyBnYXA6IDFyZW1cIj5cbiAgICBQaWNrIENvbG9yOiB7eyBjb2xvclBpY2sgfX08YnI+XG4gICAgPGRpdiBzdHlsZT1cIndpZHRoOiAzMnB4OyBoZWlnaHQ6IDMycHg7XCIgW3N0eWxlLmJhY2tncm91bmRDb2xvcl09XCJjb2xvclBpY2tcIj48L2Rpdj5cbiAgICBMaWdodGVyIFZlcnNpb246IHt7IGNvbG9yUGlja0xpZ2h0ZXIgfX08YnI+XG4gICAgPGRpdiBzdHlsZT1cIndpZHRoOiAzMnB4OyBoZWlnaHQ6IDMycHg7XCIgW3N0eWxlLmJhY2tncm91bmRDb2xvcl09XCJjb2xvclBpY2tMaWdodGVyXCI+PC9kaXY+XG4gICAgRGFya2VyVmVyc2lvbjoge3sgY29sb3JQaWNrRGFya2VyIH19PGJyPlxuICAgIDxkaXYgc3R5bGU9XCJ3aWR0aDogMzJweDsgaGVpZ2h0OiAzMnB4O1wiIFtzdHlsZS5iYWNrZ3JvdW5kQ29sb3JdPVwiY29sb3JQaWNrRGFya2VyXCI+PC9kaXY+XG4gIDwvZGl2PlxuXG4gIDxkaXYgc3R5bGU9XCJtYXJnaW4tdG9wOiAxcmVtOyBtYXJnaW4tYm90dG9tOiAxcmVtO1wiPlxuICAgIDxtYXQtZGl2aWRlcj48L21hdC1kaXZpZGVyPlxuICA8L2Rpdj5cblxuICA8aDE+Q29sb3IgUGFsbGV0dGUgU2VydmljZTwvaDE+XG4gIENyZWF0ZXMgUGFsbGV0dGUgZnJvbSBJbWFnZVxuICA8ZGl2IHN0eWxlPVwiZGlzcGxheTogZmxleDsgZ2FwOiAycmVtO1wiPlxuICAgIDxkaXY+XG4gICAgICA8aW1nIFtzcmNdPVwiaW1nXCIgaGVpZ2h0PVwiMTgwXCI+XG4gICAgPC9kaXY+XG5cbiAgICA8ZGl2IHN0eWxlPVwiZGlzcGxheTogZmxleDsgZ2FwOiAuNXJlbTsgd2lkdGg6IDEyMHB4OyBib3JkZXI6IDFweCBzb2xpZCBibGFjazsgZmxleC13cmFwOiB3cmFwOyBwYWRkaW5nOiAuNXJlbTtcIj5cbiAgICAgIDxkaXY+Q29sb3IgUGljazwvZGl2PlxuICAgICAgPG5nLWNvbnRhaW5lciAqbmdGb3I9XCJsZXQgY29sb3Igb2YgKGNvbG9ycyQgfCBhc3luYylcIj5cbiAgICAgICAgICA8ZGl2IHN0eWxlPVwid2lkdGg6IDMycHg7IGhlaWdodDogMzJweDtcIiBbc3R5bGUuYmFja2dyb3VuZENvbG9yXT1cImNvbG9yLmNvbG9yXCI+PC9kaXY+XG4gICAgICA8L25nLWNvbnRhaW5lcj5cbiAgICA8L2Rpdj5cbiAgXG4gICAgPGRpdiBzdHlsZT1cImRpc3BsYXk6IGZsZXg7IGdhcDogLjVyZW07IHdpZHRoOiAxMjBweDsgYm9yZGVyOiAxcHggc29saWQgYmxhY2s7IGZsZXgtd3JhcDogd3JhcDsgcGFkZGluZzogLjVyZW07XCI+XG4gICAgICA8ZGl2PkNvbXBsZW1lbnRhcnk8L2Rpdj5cbiAgICAgIDxuZy1jb250YWluZXIgKm5nRm9yPVwibGV0IGNvbG9yIG9mIChjb2xvcnMkIHwgYXN5bmMpXCI+XG4gICAgICAgICAgPGRpdiBzdHlsZT1cIndpZHRoOiAzMnB4OyBoZWlnaHQ6IDMycHg7XCIgW3N0eWxlLmJhY2tncm91bmRDb2xvcl09XCJjb2xvci5jb21wbGVtZW50YXJ5Q29sb3JcIj48L2Rpdj5cbiAgICAgIDwvbmctY29udGFpbmVyPlxuICAgIDwvZGl2PlxuICA8L2Rpdj5cblxuPC9kaXY+XG5cbiJdfQ==
|
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
import { NgModule } from '@angular/core';
|
|
2
|
+
import { CommonModule } from '@angular/common';
|
|
3
|
+
import { MatButtonModule } from '@angular/material/button';
|
|
4
|
+
import { MatDividerModule } from '@angular/material/divider';
|
|
5
|
+
import { ColorGrabberDirective } from './color-grab.directive';
|
|
6
|
+
import { ColorUtilitiesDemoComponent } from './color-utilities-demo/color-utilities-demo.component';
|
|
7
|
+
import { ColorExtractorDirective } from './color-extractor.directive';
|
|
8
|
+
import * as i0 from "@angular/core";
|
|
9
|
+
export class ColorUtilsModule {
|
|
10
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ColorUtilsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
11
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.2.12", ngImport: i0, type: ColorUtilsModule, declarations: [ColorUtilitiesDemoComponent,
|
|
12
|
+
ColorGrabberDirective,
|
|
13
|
+
ColorExtractorDirective], imports: [CommonModule,
|
|
14
|
+
MatButtonModule,
|
|
15
|
+
MatDividerModule], exports: [ColorUtilitiesDemoComponent] }); }
|
|
16
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ColorUtilsModule, imports: [CommonModule,
|
|
17
|
+
MatButtonModule,
|
|
18
|
+
MatDividerModule] }); }
|
|
19
|
+
}
|
|
20
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ColorUtilsModule, decorators: [{
|
|
21
|
+
type: NgModule,
|
|
22
|
+
args: [{
|
|
23
|
+
imports: [
|
|
24
|
+
CommonModule,
|
|
25
|
+
MatButtonModule,
|
|
26
|
+
MatDividerModule
|
|
27
|
+
],
|
|
28
|
+
declarations: [
|
|
29
|
+
ColorUtilitiesDemoComponent,
|
|
30
|
+
ColorGrabberDirective,
|
|
31
|
+
ColorExtractorDirective
|
|
32
|
+
],
|
|
33
|
+
exports: [
|
|
34
|
+
ColorUtilitiesDemoComponent
|
|
35
|
+
]
|
|
36
|
+
}]
|
|
37
|
+
}] });
|
|
38
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY29sb3ItdXRpbHMubW9kdWxlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vcHJvamVjdHMvY29sb3ItdXRpbHMvc3JjL2xpYi9jb2xvci11dGlscy5tb2R1bGUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFFBQVEsRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUN6QyxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0saUJBQWlCLENBQUM7QUFFL0MsT0FBTyxFQUFFLGVBQWUsRUFBRSxNQUFNLDBCQUEwQixDQUFDO0FBQzNELE9BQU8sRUFBRSxnQkFBZ0IsRUFBRSxNQUFNLDJCQUEyQixDQUFDO0FBQzdELE9BQU8sRUFBRSxxQkFBcUIsRUFBRSxNQUFNLHdCQUF3QixDQUFDO0FBRS9ELE9BQU8sRUFBRSwyQkFBMkIsRUFBRSxNQUFNLHVEQUF1RCxDQUFDO0FBQ3BHLE9BQU8sRUFBRSx1QkFBdUIsRUFBRSxNQUFNLDZCQUE2QixDQUFDOztBQWtCdEUsTUFBTSxPQUFPLGdCQUFnQjsrR0FBaEIsZ0JBQWdCO2dIQUFoQixnQkFBZ0IsaUJBUnpCLDJCQUEyQjtZQUMzQixxQkFBcUI7WUFDckIsdUJBQXVCLGFBUHZCLFlBQVk7WUFDWixlQUFlO1lBQ2YsZ0JBQWdCLGFBUWhCLDJCQUEyQjtnSEFHbEIsZ0JBQWdCLFlBYnpCLFlBQVk7WUFDWixlQUFlO1lBQ2YsZ0JBQWdCOzs0RkFXUCxnQkFBZ0I7a0JBZjVCLFFBQVE7bUJBQUM7b0JBQ1IsT0FBTyxFQUFFO3dCQUNQLFlBQVk7d0JBQ1osZUFBZTt3QkFDZixnQkFBZ0I7cUJBQ2pCO29CQUNELFlBQVksRUFBRTt3QkFDWiwyQkFBMkI7d0JBQzNCLHFCQUFxQjt3QkFDckIsdUJBQXVCO3FCQUN4QjtvQkFDRCxPQUFPLEVBQUU7d0JBQ1AsMkJBQTJCO3FCQUM1QjtpQkFDRiIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IE5nTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBDb21tb25Nb2R1bGUgfSBmcm9tICdAYW5ndWxhci9jb21tb24nO1xuXG5pbXBvcnQgeyBNYXRCdXR0b25Nb2R1bGUgfSBmcm9tICdAYW5ndWxhci9tYXRlcmlhbC9idXR0b24nO1xuaW1wb3J0IHsgTWF0RGl2aWRlck1vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL21hdGVyaWFsL2RpdmlkZXInO1xuaW1wb3J0IHsgQ29sb3JHcmFiYmVyRGlyZWN0aXZlIH0gZnJvbSAnLi9jb2xvci1ncmFiLmRpcmVjdGl2ZSc7XG5cbmltcG9ydCB7IENvbG9yVXRpbGl0aWVzRGVtb0NvbXBvbmVudCB9IGZyb20gJy4vY29sb3ItdXRpbGl0aWVzLWRlbW8vY29sb3ItdXRpbGl0aWVzLWRlbW8uY29tcG9uZW50JztcbmltcG9ydCB7IENvbG9yRXh0cmFjdG9yRGlyZWN0aXZlIH0gZnJvbSAnLi9jb2xvci1leHRyYWN0b3IuZGlyZWN0aXZlJztcblxuXG5ATmdNb2R1bGUoe1xuICBpbXBvcnRzOiBbXG4gICAgQ29tbW9uTW9kdWxlLFxuICAgIE1hdEJ1dHRvbk1vZHVsZSxcbiAgICBNYXREaXZpZGVyTW9kdWxlXG4gIF0sXG4gIGRlY2xhcmF0aW9uczogW1xuICAgIENvbG9yVXRpbGl0aWVzRGVtb0NvbXBvbmVudCxcbiAgICBDb2xvckdyYWJiZXJEaXJlY3RpdmUsXG4gICAgQ29sb3JFeHRyYWN0b3JEaXJlY3RpdmVcbiAgXSxcbiAgZXhwb3J0czogW1xuICAgIENvbG9yVXRpbGl0aWVzRGVtb0NvbXBvbmVudFxuICBdXG59KVxuZXhwb3J0IGNsYXNzIENvbG9yVXRpbHNNb2R1bGUgeyB9XG4iXX0=
|
|
@@ -0,0 +1,79 @@
|
|
|
1
|
+
import { Injectable } from '@angular/core';
|
|
2
|
+
import * as i0 from "@angular/core";
|
|
3
|
+
import * as i1 from "./color-conversion.service";
|
|
4
|
+
export class TextColorService {
|
|
5
|
+
constructor(colorConversionService) {
|
|
6
|
+
this.colorConversionService = colorConversionService;
|
|
7
|
+
}
|
|
8
|
+
textColorForBgColor(bgColor, lightColor, darkColor) {
|
|
9
|
+
const UIColors = this.fixColor(bgColor);
|
|
10
|
+
const r = UIColors[0];
|
|
11
|
+
const g = UIColors[1];
|
|
12
|
+
const b = UIColors[2];
|
|
13
|
+
return ((r * 0.299 + g * 0.587 + b * 0.114) > 149) ? darkColor : lightColor;
|
|
14
|
+
}
|
|
15
|
+
darkerColor(color1, color2) {
|
|
16
|
+
return this.isColorDarker(color1, color2) ? color1 : color2;
|
|
17
|
+
}
|
|
18
|
+
isColorDarker(color1, color2) {
|
|
19
|
+
const newColor1 = this.fixColor(color1);
|
|
20
|
+
const newColor2 = this.fixColor(color2);
|
|
21
|
+
const luminance1 = this.calculateLuminance(newColor1[0], newColor1[1], newColor1[2]);
|
|
22
|
+
const luminance2 = this.calculateLuminance(newColor2[0], newColor2[1], newColor2[2]);
|
|
23
|
+
return luminance1 < luminance2;
|
|
24
|
+
}
|
|
25
|
+
lighterColor(color1, color2) {
|
|
26
|
+
return (this.isColorLighter(color1, color2)) ? color1 : color2;
|
|
27
|
+
}
|
|
28
|
+
isColorLighter(color1, color2) {
|
|
29
|
+
const newColor1 = this.fixColor(color1);
|
|
30
|
+
const newColor2 = this.fixColor(color2);
|
|
31
|
+
const luminance1 = this.calculateLuminance(newColor1[0], newColor1[1], newColor1[2]);
|
|
32
|
+
const luminance2 = this.calculateLuminance(newColor2[0], newColor2[1], newColor2[2]);
|
|
33
|
+
return (luminance1 > luminance2);
|
|
34
|
+
}
|
|
35
|
+
calculateLuminance(r, g, b) {
|
|
36
|
+
return 0.2126 * r + 0.7152 * g + 0.0722 * b;
|
|
37
|
+
}
|
|
38
|
+
fixColor(color) {
|
|
39
|
+
// Remove leading hash if present
|
|
40
|
+
const sanitizedColor = color.startsWith('#') ? color.slice(1) : color;
|
|
41
|
+
// Validate if the color is a valid hex (3 or 6 characters)
|
|
42
|
+
if (!this.isValidHex(sanitizedColor)) {
|
|
43
|
+
return this.parseRgb(sanitizedColor); // If not hex, attempt to parse as RGB
|
|
44
|
+
}
|
|
45
|
+
// Convert hex to RGB
|
|
46
|
+
const rgb = this.hexToRgb(sanitizedColor);
|
|
47
|
+
return rgb;
|
|
48
|
+
}
|
|
49
|
+
// Helper function to validate if a string is a valid 3 or 6 digit hex code
|
|
50
|
+
isValidHex(color) {
|
|
51
|
+
const hexRegex = /^[A-Fa-f0-9]{3}$|^[A-Fa-f0-9]{6}$/i;
|
|
52
|
+
return hexRegex.test(color);
|
|
53
|
+
}
|
|
54
|
+
// Helper function to convert a 3 or 6 digit hex color to RGB
|
|
55
|
+
hexToRgb(hex) {
|
|
56
|
+
if (hex.length === 3) {
|
|
57
|
+
hex = hex.split('').map(c => c + c).join(''); // Expand shorthand hex to full
|
|
58
|
+
}
|
|
59
|
+
return [
|
|
60
|
+
parseInt(hex.slice(0, 2), 16),
|
|
61
|
+
parseInt(hex.slice(2, 4), 16),
|
|
62
|
+
parseInt(hex.slice(4, 6), 16),
|
|
63
|
+
];
|
|
64
|
+
}
|
|
65
|
+
// Helper function to parse an RGB string (e.g., rgb(255, 0, 0)) into an array
|
|
66
|
+
parseRgb(rgb) {
|
|
67
|
+
const match = rgb.match(/\d+/g);
|
|
68
|
+
return match ? match.map(num => parseInt(num)) : [];
|
|
69
|
+
}
|
|
70
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TextColorService, deps: [{ token: i1.ColorConversionService }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
71
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TextColorService, providedIn: 'root' }); }
|
|
72
|
+
}
|
|
73
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TextColorService, decorators: [{
|
|
74
|
+
type: Injectable,
|
|
75
|
+
args: [{
|
|
76
|
+
providedIn: 'root'
|
|
77
|
+
}]
|
|
78
|
+
}], ctorParameters: function () { return [{ type: i1.ColorConversionService }]; } });
|
|
79
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidGV4dC1jb2xvci5zZXJ2aWNlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vcHJvamVjdHMvY29sb3ItdXRpbHMvc3JjL2xpYi90ZXh0LWNvbG9yLnNlcnZpY2UudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFVBQVUsRUFBRSxNQUFNLGVBQWUsQ0FBQTs7O0FBTTFDLE1BQU0sT0FBTyxnQkFBZ0I7SUFFM0IsWUFDVSxzQkFBOEM7UUFBOUMsMkJBQXNCLEdBQXRCLHNCQUFzQixDQUF3QjtJQUNyRCxDQUFDO0lBRUosbUJBQW1CLENBQUMsT0FBZSxFQUFFLFVBQWtCLEVBQUUsU0FBaUI7UUFFeEUsTUFBTSxRQUFRLEdBQUcsSUFBSSxDQUFDLFFBQVEsQ0FBQyxPQUFPLENBQUMsQ0FBQTtRQUV2QyxNQUFNLENBQUMsR0FBRyxRQUFRLENBQUMsQ0FBQyxDQUFDLENBQUE7UUFDckIsTUFBTSxDQUFDLEdBQUcsUUFBUSxDQUFDLENBQUMsQ0FBQyxDQUFBO1FBQ3JCLE1BQU0sQ0FBQyxHQUFHLFFBQVEsQ0FBQyxDQUFDLENBQUMsQ0FBQTtRQUVyQixPQUFPLENBQUMsQ0FBQyxDQUFDLEdBQUMsS0FBSyxHQUFHLENBQUMsR0FBQyxLQUFLLEdBQUcsQ0FBQyxHQUFDLEtBQUssQ0FBQyxHQUFHLEdBQUcsQ0FBQyxDQUFDLENBQUMsQ0FBQyxTQUFTLENBQUMsQ0FBQyxDQUFDLFVBQVUsQ0FBQztJQUV4RSxDQUFDO0lBRUQsV0FBVyxDQUFDLE1BQWMsRUFBRSxNQUFjO1FBQ3hDLE9BQU8sSUFBSSxDQUFDLGFBQWEsQ0FBQyxNQUFNLEVBQUUsTUFBTSxDQUFDLENBQUMsQ0FBQyxDQUFDLE1BQU0sQ0FBQyxDQUFDLENBQUMsTUFBTSxDQUFDO0lBQzlELENBQUM7SUFFRCxhQUFhLENBQUMsTUFBYyxFQUFFLE1BQWM7UUFFMUMsTUFBTSxTQUFTLEdBQUcsSUFBSSxDQUFDLFFBQVEsQ0FBQyxNQUFNLENBQUMsQ0FBQztR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LENBQUMsR0FBRyxDQUFDLEtBQUssQ0FBQyxDQUFDLEVBQUUsQ0FBQyxDQUFDLEVBQUUsRUFBRSxDQUFDO1lBQzdCLFFBQVEsQ0FBQyxHQUFHLENBQUMsS0FBSyxDQUFDLENBQUMsRUFBRSxDQUFDLENBQUMsRUFBRSxFQUFFLENBQUM7WUFDN0IsUUFBUSxDQUFDLEdBQUcsQ0FBQyxLQUFLLENBQUMsQ0FBQyxFQUFFLENBQUMsQ0FBQyxFQUFFLEVBQUUsQ0FBQztTQUM5QixDQUFDO0lBQ0osQ0FBQztJQUVELDhFQUE4RTtJQUM5RSxRQUFRLENBQUMsR0FBVztRQUNsQixNQUFNLEtBQUssR0FBRyxHQUFHLENBQUMsS0FBSyxDQUFDLE1BQU0sQ0FBQyxDQUFDO1FBQ2hDLE9BQU8sS0FBSyxDQUFDLENBQUMsQ0FBQyxLQUFLLENBQUMsR0FBRyxDQUFDLEdBQUcsQ0FBQyxFQUFFLENBQUMsUUFBUSxDQUFDLEdBQUcsQ0FBQyxDQUFDLENBQUMsQ0FBQyxDQUFDLEVBQUUsQ0FBQztJQUN0RCxDQUFDOytHQTNGVSxnQkFBZ0I7bUhBQWhCLGdCQUFnQixjQUZmLE1BQU07OzRGQUVQLGdCQUFnQjtrQkFINUIsVUFBVTttQkFBQztvQkFDVixVQUFVLEVBQUUsTUFBTTtpQkFDbkIiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBJbmplY3RhYmxlIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSdcclxuaW1wb3J0IHsgQ29sb3JDb252ZXJzaW9uU2VydmljZSB9IGZyb20gJy4vY29sb3ItY29udmVyc2lvbi5zZXJ2aWNlJ1xyXG5cclxuQEluamVjdGFibGUoe1xyXG4gIHByb3ZpZGVkSW46ICdyb290J1xyXG59KVxyXG5leHBvcnQgY2xhc3MgVGV4dENvbG9yU2VydmljZSB7XHJcblxyXG4gIGNvbnN0cnVjdG9yKFxyXG4gICAgcHJpdmF0ZSBjb2xvckNvbnZlcnNpb25TZXJ2aWNlOiBDb2xvckNvbnZlcnNpb25TZXJ2aWNlXHJcbiAgKSB7fVxyXG5cclxuICB0ZXh0Q29sb3JGb3JCZ0NvbG9yKGJnQ29sb3I6IHN0cmluZywgbGlnaHRDb2xvcjogc3RyaW5nLCBkYXJrQ29sb3I6IHN0cmluZykge1xyXG5cclxuICAgIGNvbnN0IFVJQ29sb3JzID0gdGhpcy5maXhDb2xvcihiZ0NvbG9yKVxyXG5cclxuICAgIGNvbnN0IHIgPSBVSUNvbG9yc1swXVxyXG4gICAgY29uc3QgZyA9IFVJQ29sb3JzWzFdXHJcbiAgICBjb25zdCBiID0gVUlDb2xvcnNbMl1cclxuXHJcbiAgICByZXR1cm4gKChyKjAuMjk5ICsgZyowLjU4NyArIGIqMC4xMTQpID4gMTQ5KSA/IGRhcmtDb2xvciA6IGxpZ2h0Q29sb3I7XHJcblxyXG4gIH1cclxuXHJcbiAgZGFya2VyQ29sb3IoY29sb3IxOiBzdHJpbmcsIGNvbG9yMjogc3RyaW5nKSB7XHJcbiAgICByZXR1cm4gdGhpcy5pc0NvbG9yRGFya2VyKGNvbG9yMSwgY29sb3IyKSA/IGNvbG9yMSA6IGNvbG9yMjtcclxuICB9XHJcblxyXG4gIGlzQ29sb3JEYXJrZXIoY29sb3IxOiBzdHJpbmcsIGNvbG9yMjogc3RyaW5nKSB7XHJcblxyXG4gICAgY29uc3QgbmV3Q29sb3IxID0gdGhpcy5maXhDb2xvcihjb2xvcjEpO1xyXG4gICAgY29uc3QgbmV3Q29sb3IyID0gdGhpcy5maXhDb2xvcihjb2xvcjIpO1xyXG5cclxuICAgIGNvbnN0IGx1bWluYW5jZTEgPSB0aGlzLmNhbGN1bGF0ZUx1bWluYW5jZShuZXdDb2xvcjFbMF0sIG5ld0NvbG9yMVsxXSwgbmV3Q29sb3IxWzJdKTtcclxuICAgIGNvbnN0IGx1bWluYW5jZTIgPSB0aGlzLmNhbGN1bGF0ZUx1bWluYW5jZShuZXdDb2xvcjJbMF0sIG5ld0NvbG9yMlsxXSwgbmV3Q29sb3IyWzJdKTtcclxuXHJcbiAgICByZXR1cm4gbHVtaW5hbmNlMSA8IGx1bWluYW5jZTI7XHJcbiAgfVxyXG5cclxuXHJcbiAgbGlnaHRlckNvbG9yKGNvbG9yMTogc3RyaW5nLCBjb2xvcjI6IHN0cmluZyk6IHN0cmluZyB7XHJcbiAgICByZXR1cm4gKHRoaXMuaXNDb2xvckxpZ2h0ZXIoY29sb3IxLGNvbG9yMikpID8gY29sb3IxIDogY29sb3IyO1xyXG4gIH1cclxuXHJcbiAgaXNDb2xvckxpZ2h0ZXIoY29sb3IxOiBzdHJpbmcsIGNvbG9yMjogc3RyaW5nKSB7XHJcblxyXG4gICAgY29uc3QgbmV3Q29sb3IxID0gdGhpcy5maXhDb2xvcihjb2xvcjEpO1xyXG4gICAgY29uc3QgbmV3Q29sb3IyID0gdGhpcy5maXhDb2xvcihjb2xvcjIpO1xyXG5cclxuICAgIGNvbnN0IGx1bWluYW5jZTEgPSB0aGlzLmNhbGN1bGF0ZUx1bWluYW5jZShuZXdDb2xvcjFbMF0sIG5ld0NvbG9yMVsxXSwgbmV3Q29sb3IxWzJdKTtcclxuICAgIGNvbnN0IGx1bWluYW5jZTIgPSB0aGlzLmNhbGN1bGF0ZUx1bWluYW5jZShuZXdDb2xvcjJbMF0sIG5ld0NvbG9yMlsxXSwgbmV3Q29sb3IyWzJdKTtcclxuXHJcbiAgICByZXR1cm4gKGx1bWluYW5jZTEgPiBsdW1pbmFuY2UyKVxyXG5cclxuICB9XHJcblxyXG4gIGNhbGN1bGF0ZUx1bWluYW5jZShyOiBudW1iZXIsIGc6IG51bWJlciwgYjogbnVtYmVyKTogbnVtYmVyIHtcclxuICAgIHJldHVybiAwLjIxMjYgKiByICsgMC43MTUyICogZyArIDAuMDcyMiAqIGI7XHJcbiAgfVxyXG5cclxuICBmaXhDb2xvcihjb2xvcjogc3RyaW5nKSB7XHJcbiAgICAvLyBSZW1vdmUgbGVhZGluZyBoYXNoIGlmIHByZXNlbnRcclxuICAgIGNvbnN0IHNhbml0aXplZENvbG9yID0gY29sb3Iuc3RhcnRzV2l0aCgnIycpID8gY29sb3Iuc2xpY2UoMSkgOiBjb2xvcjtcclxuXHJcbiAgICAvLyBWYWxpZGF0ZSBpZiB0aGUgY29sb3IgaXMgYSB2YWxpZCBoZXggKDMgb3IgNiBjaGFyYWN0ZXJzKVxyXG4gICAgaWYgKCF0aGlzLmlzVmFsaWRIZXgoc2FuaXRpemVkQ29sb3IpKSB7XHJcbiAgICAgIHJldHVybiB0aGlzLnBhcnNlUmdiKHNhbml0aXplZENvbG9yKTsgLy8gSWYgbm90IGhleCwgYXR0ZW1wdCB0byBwYXJzZSBhcyBSR0JcclxuICAgIH1cclxuXHJcbiAgICAvLyBDb252ZXJ0IGhleCB0byBSR0JcclxuICAgIGNvbnN0IHJnYiA9IHRoaXMuaGV4VG9SZ2Ioc2FuaXRpemVkQ29sb3IpO1xyXG4gICAgcmV0dXJuIHJnYjtcclxuICB9XHJcblxyXG4gIC8vIEhlbHBlciBmdW5jdGlvbiB0byB2YWxpZGF0ZSBpZiBhIHN0cmluZyBpcyBhIHZhbGlkIDMgb3IgNiBkaWdpdCBoZXggY29kZVxyXG4gIGlzVmFsaWRIZXgoY29sb3I6IHN0cmluZyk6IGJvb2xlYW4ge1xyXG4gICAgY29uc3QgaGV4UmVnZXggPSAvXltBLUZhLWYwLTldezN9JHxeW0EtRmEtZjAtOV17Nn0kL2k7XHJcbiAgICByZXR1cm4gaGV4UmVnZXgudGVzdChjb2xvcik7XHJcbiAgfVxyXG5cclxuICAvLyBIZWxwZXIgZnVuY3Rpb24gdG8gY29udmVydCBhIDMgb3IgNiBkaWdpdCBoZXggY29sb3IgdG8gUkdCXHJcbiAgaGV4VG9SZ2IoaGV4OiBzdHJpbmcpOiBudW1iZXJbXSB7XHJcbiAgICBpZiAoaGV4Lmxlbmd0aCA9PT0gMykge1xyXG4gICAgICBoZXggPSBoZXguc3BsaXQoJycpLm1hcChjID0+IGMgKyBjKS5qb2luKCcnKTsgLy8gRXhwYW5kIHNob3J0aGFuZCBoZXggdG8gZnVsbFxyXG4gICAgfVxyXG5cclxuICAgIHJldHVybiBbXHJcbiAgICAgIHBhcnNlSW50KGhleC5zbGljZSgwLCAyKSwgMTYpLFxyXG4gICAgICBwYXJzZUludChoZXguc2xpY2UoMiwgNCksIDE2KSxcclxuICAgICAgcGFyc2VJbnQoaGV4LnNsaWNlKDQsIDYpLCAxNiksXHJcbiAgICBdO1xyXG4gIH1cclxuXHJcbiAgLy8gSGVscGVyIGZ1bmN0aW9uIHRvIHBhcnNlIGFuIFJHQiBzdHJpbmcgKGUuZy4sIHJnYigyNTUsIDAsIDApKSBpbnRvIGFuIGFycmF5XHJcbiAgcGFyc2VSZ2IocmdiOiBzdHJpbmcpOiBudW1iZXJbXSB7XHJcbiAgICBjb25zdCBtYXRjaCA9IHJnYi5tYXRjaCgvXFxkKy9nKTtcclxuICAgIHJldHVybiBtYXRjaCA/IG1hdGNoLm1hcChudW0gPT4gcGFyc2VJbnQobnVtKSkgOiBbXTtcclxuICB9XHJcblxyXG5cclxufVxyXG4iXX0=
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
/*
|
|
2
|
+
* Public API Surface of color-utils
|
|
3
|
+
*/
|
|
4
|
+
export * from './lib/color-utils.module';
|
|
5
|
+
export * from './lib/color-utilities-demo/color-utilities-demo.component';
|
|
6
|
+
export * from './lib/color-conversion.service';
|
|
7
|
+
export * from './lib/color-extractor.directive';
|
|
8
|
+
export * from './lib/color-grab.directive';
|
|
9
|
+
export * from './lib/color-pallette.service';
|
|
10
|
+
export * from './lib/text-color.service';
|
|
11
|
+
export * from './lib/color-scheme.service';
|
|
12
|
+
export * from './lib/color-lighten-darken.service';
|
|
13
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHVibGljLWFwaS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3Byb2plY3RzL2NvbG9yLXV0aWxzL3NyYy9wdWJsaWMtYXBpLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBOztHQUVHO0FBRUgsY0FBYywwQkFBMEIsQ0FBQztBQUV6QyxjQUFjLDJEQUEyRCxDQUFDO0FBRTFFLGNBQWMsZ0NBQWdDLENBQUM7QUFDL0MsY0FBYyxpQ0FBaUMsQ0FBQztBQUNoRCxjQUFjLDRCQUE0QixDQUFDO0FBQzNDLGNBQWMsOEJBQThCLENBQUM7QUFDN0MsY0FBYywwQkFBMEIsQ0FBQztBQUV6QyxjQUFjLDRCQUE0QixDQUFDO0FBQzNDLGNBQWMsb0NBQW9DLENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyIvKlxuICogUHVibGljIEFQSSBTdXJmYWNlIG9mIGNvbG9yLXV0aWxzXG4gKi9cblxuZXhwb3J0ICogZnJvbSAnLi9saWIvY29sb3ItdXRpbHMubW9kdWxlJztcblxuZXhwb3J0ICogZnJvbSAnLi9saWIvY29sb3ItdXRpbGl0aWVzLWRlbW8vY29sb3ItdXRpbGl0aWVzLWRlbW8uY29tcG9uZW50JztcblxuZXhwb3J0ICogZnJvbSAnLi9saWIvY29sb3ItY29udmVyc2lvbi5zZXJ2aWNlJztcbmV4cG9ydCAqIGZyb20gJy4vbGliL2NvbG9yLWV4dHJhY3Rvci5kaXJlY3RpdmUnO1xuZXhwb3J0ICogZnJvbSAnLi9saWIvY29sb3ItZ3JhYi5kaXJlY3RpdmUnO1xuZXhwb3J0ICogZnJvbSAnLi9saWIvY29sb3ItcGFsbGV0dGUuc2VydmljZSc7XG5leHBvcnQgKiBmcm9tICcuL2xpYi90ZXh0LWNvbG9yLnNlcnZpY2UnO1xuXG5leHBvcnQgKiBmcm9tICcuL2xpYi9jb2xvci1zY2hlbWUuc2VydmljZSc7XG5leHBvcnQgKiBmcm9tICcuL2xpYi9jb2xvci1saWdodGVuLWRhcmtlbi5zZXJ2aWNlJztcbiJdfQ==
|