Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
@vibrant/color
Advanced tools
@vibrant/color - npm Package Compare versions
Comparing version 3.0.0 to 3.1.0-0
@@ -12,3 +12,5 @@ "use strict"; | ||
| var m = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex); | ||
| return m === null ? null : [m[1], m[2], m[3]].map(function (s) { return parseInt(s, 16); }); | ||
| if (!m) | ||
| throw new RangeError("'" + hex + "' is not a valid hex color"); | ||
| return [m[1], m[2], m[3]].map(function (s) { return parseInt(s, 16); }); | ||
| } | ||
@@ -26,9 +28,6 @@ exports.hexToRgb = hexToRgb; | ||
| var min = Math.min(r, g, b); | ||
| var h; | ||
| var s; | ||
| var h = 0; | ||
| var s = 0; | ||
| var l = (max + min) / 2; | ||
| if (max === min) { | ||
| h = s = 0; | ||
| } | ||
| else { | ||
| if (max !== min) { | ||
| var d = max - min; | ||
@@ -161,16 +160,21 @@ s = l > 0.5 ? d / (2 - max - min) : d / (max + min); | ||
| function getColorDiffStatus(d) { | ||
| if (d < exports.DELTAE94_DIFF_STATUS.NA) | ||
| if (d < exports.DELTAE94_DIFF_STATUS.NA) { | ||
| return 'N/A'; | ||
| } | ||
| // Not perceptible by human eyes | ||
| if (d <= exports.DELTAE94_DIFF_STATUS.PERFECT) | ||
| if (d <= exports.DELTAE94_DIFF_STATUS.PERFECT) { | ||
| return 'Perfect'; | ||
| } | ||
| // Perceptible through close observation | ||
| if (d <= exports.DELTAE94_DIFF_STATUS.CLOSE) | ||
| if (d <= exports.DELTAE94_DIFF_STATUS.CLOSE) { | ||
| return 'Close'; | ||
| } | ||
| // Perceptible at a glance | ||
| if (d <= exports.DELTAE94_DIFF_STATUS.GOOD) | ||
| if (d <= exports.DELTAE94_DIFF_STATUS.GOOD) { | ||
| return 'Good'; | ||
| } | ||
| // Colors are more similar than opposite | ||
| if (d < exports.DELTAE94_DIFF_STATUS.SIMILAR) | ||
| if (d < exports.DELTAE94_DIFF_STATUS.SIMILAR) { | ||
| return 'Similar'; | ||
| } | ||
| return 'Wrong'; | ||
@@ -177,0 +181,0 @@ } |
| export interface Filter { | ||
| (red: number, green: number, blue: number, alpha: number): boolean; | ||
| } | ||
| export interface Vec3 extends Array<number> { | ||
| 0: number; | ||
| 1: number; | ||
| 2: number; | ||
| } | ||
| export declare type Vec3 = [number, number, number]; | ||
| export interface Palette { | ||
| Vibrant?: Swatch; | ||
| Muted?: Swatch; | ||
| DarkVibrant?: Swatch; | ||
| DarkMuted?: Swatch; | ||
| LightVibrant?: Swatch; | ||
| LightMuted?: Swatch; | ||
| [name: string]: Swatch; | ||
| Vibrant: Swatch | null; | ||
| Muted: Swatch | null; | ||
| DarkVibrant: Swatch | null; | ||
| DarkMuted: Swatch | null; | ||
| LightVibrant: Swatch | null; | ||
| LightMuted: Swatch | null; | ||
| [name: string]: Swatch | null; | ||
| } | ||
@@ -29,2 +25,10 @@ export declare class Swatch { | ||
| readonly b: number; | ||
| readonly rgb: Vec3; | ||
| readonly hsl: Vec3; | ||
| readonly hex: string; | ||
| readonly population: number; | ||
| toJSON(): { | ||
| rgb: [number, number, number]; | ||
| population: number; | ||
| }; | ||
| getRgb(): Vec3; | ||
@@ -34,3 +38,7 @@ getHsl(): Vec3; | ||
| getHex(): string; | ||
| private getYiq(); | ||
| private getYiq; | ||
| private _titleTextColor; | ||
| private _bodyTextColor; | ||
| readonly titleTextColor: string; | ||
| readonly bodyTextColor: string; | ||
| getTitleTextColor(): string; | ||
@@ -37,0 +45,0 @@ getBodyTextColor(): string; |
102
lib/index.js
@@ -25,3 +25,5 @@ "use strict"; | ||
| Object.defineProperty(Swatch.prototype, "r", { | ||
| get: function () { return this._rgb[0]; }, | ||
| get: function () { | ||
| return this._rgb[0]; | ||
| }, | ||
| enumerable: true, | ||
@@ -31,3 +33,5 @@ configurable: true | ||
| Object.defineProperty(Swatch.prototype, "g", { | ||
| get: function () { return this._rgb[1]; }, | ||
| get: function () { | ||
| return this._rgb[1]; | ||
| }, | ||
| enumerable: true, | ||
@@ -37,21 +41,65 @@ configurable: true | ||
| Object.defineProperty(Swatch.prototype, "b", { | ||
| get: function () { return this._rgb[2]; }, | ||
| get: function () { | ||
| return this._rgb[2]; | ||
| }, | ||
| enumerable: true, | ||
| configurable: true | ||
| }); | ||
| Swatch.prototype.getRgb = function () { return this._rgb; }; | ||
| Object.defineProperty(Swatch.prototype, "rgb", { | ||
| get: function () { | ||
| return this._rgb; | ||
| }, | ||
| enumerable: true, | ||
| configurable: true | ||
| }); | ||
| Object.defineProperty(Swatch.prototype, "hsl", { | ||
| get: function () { | ||
| if (!this._hsl) { | ||
| var _a = this._rgb, r = _a[0], g = _a[1], b = _a[2]; | ||
| this._hsl = converter_1.rgbToHsl(r, g, b); | ||
| } | ||
| return this._hsl; | ||
| }, | ||
| enumerable: true, | ||
| configurable: true | ||
| }); | ||
| Object.defineProperty(Swatch.prototype, "hex", { | ||
| get: function () { | ||
| if (!this._hex) { | ||
| var _a = this._rgb, r = _a[0], g = _a[1], b = _a[2]; | ||
| this._hex = converter_1.rgbToHex(r, g, b); | ||
| } | ||
| return this._hex; | ||
| }, | ||
| enumerable: true, | ||
| configurable: true | ||
| }); | ||
| Object.defineProperty(Swatch.prototype, "population", { | ||
| get: function () { | ||
| return this._population; | ||
| }, | ||
| enumerable: true, | ||
| configurable: true | ||
| }); | ||
| Swatch.prototype.toJSON = function () { | ||
| return { | ||
| rgb: this.rgb, | ||
| population: this.population | ||
| }; | ||
| }; | ||
| // TODO: deprecate internally, use property instead | ||
| Swatch.prototype.getRgb = function () { | ||
| return this._rgb; | ||
| }; | ||
| // TODO: deprecate internally, use property instead | ||
| Swatch.prototype.getHsl = function () { | ||
| if (!this._hsl) { | ||
| var _a = this._rgb, r = _a[0], g = _a[1], b = _a[2]; | ||
| this._hsl = converter_1.rgbToHsl(r, g, b); | ||
| } | ||
| return this._hsl; | ||
| return this.hsl; | ||
| }; | ||
| Swatch.prototype.getPopulation = function () { return this._population; }; | ||
| // TODO: deprecate internally, use property instead | ||
| Swatch.prototype.getPopulation = function () { | ||
| return this._population; | ||
| }; | ||
| // TODO: deprecate internally, use property instead | ||
| Swatch.prototype.getHex = function () { | ||
| if (!this._hex) { | ||
| var _a = this._rgb, r = _a[0], g = _a[1], b = _a[2]; | ||
| this._hex = converter_1.rgbToHex(r, g, b); | ||
| } | ||
| return this._hex; | ||
| return this.hex; | ||
| }; | ||
@@ -65,7 +113,27 @@ Swatch.prototype.getYiq = function () { | ||
| }; | ||
| Object.defineProperty(Swatch.prototype, "titleTextColor", { | ||
| get: function () { | ||
| if (this._titleTextColor) { | ||
| this._titleTextColor = this.getYiq() < 200 ? '#fff' : '#000'; | ||
| } | ||
| return this._titleTextColor; | ||
| }, | ||
| enumerable: true, | ||
| configurable: true | ||
| }); | ||
| Object.defineProperty(Swatch.prototype, "bodyTextColor", { | ||
| get: function () { | ||
| if (this._bodyTextColor) { | ||
| this._bodyTextColor = this.getYiq() < 150 ? '#fff' : '#000'; | ||
| } | ||
| return this._bodyTextColor; | ||
| }, | ||
| enumerable: true, | ||
| configurable: true | ||
| }); | ||
| Swatch.prototype.getTitleTextColor = function () { | ||
| return this.getYiq() < 200 ? '#fff' : '#000'; | ||
| return this.titleTextColor; | ||
| }; | ||
| Swatch.prototype.getBodyTextColor = function () { | ||
| return this.getYiq() < 150 ? '#fff' : '#000'; | ||
| return this.bodyTextColor; | ||
| }; | ||
@@ -72,0 +140,0 @@ return Swatch; |
| { | ||
| "name": "@vibrant/color", | ||
| "version": "3.0.0", | ||
| "version": "3.1.0-0", | ||
| "description": "Color utilities for vibrant", | ||
| "scripts": { | ||
| "build:module": "tsc", | ||
| "test": "echo \"Error: no test specified\" && exit 1" | ||
@@ -11,8 +10,18 @@ }, | ||
| "types": "lib/index.d.ts", | ||
| "author": "", | ||
| "license": "ISC", | ||
| "author": { | ||
| "name": "akfish", | ||
| "email": "akfish@gmail.com" | ||
| }, | ||
| "bugs": { | ||
| "url": "https://github.com/akfish/node-vibrant/issues" | ||
| }, | ||
| "homepage": "https://github.com/akfish/node-vibrant", | ||
| "license": "MIT", | ||
| "dependencies": {}, | ||
| "devDependencies": { | ||
| "typescript": "latest" | ||
| "typescript": "^3.2.2" | ||
| }, | ||
| "publishConfig": { | ||
| "access": "public" | ||
| } | ||
| } |
| import { Vec3 } from './' | ||
| export const DELTAE94_DIFF_STATUS = { | ||
| NA: 0, | ||
| PERFECT: 1, | ||
| CLOSE: 2, | ||
| GOOD: 10, | ||
| SIMILAR: 50 | ||
| NA: 0, | ||
| PERFECT: 1, | ||
| CLOSE: 2, | ||
| GOOD: 10, | ||
| SIMILAR: 50 | ||
| } | ||
| export function hexToRgb(hex: string): Vec3 { | ||
| let m = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex) | ||
| export function hexToRgb (hex: string): Vec3 { | ||
| let m = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex) | ||
| return m === null ? null : <Vec3>[m[1], m[2], m[3]].map((s) => parseInt(s, 16)) | ||
| if (!m) throw new RangeError(`'${hex}' is not a valid hex color`) | ||
| return [m[1], m[2], m[3]].map((s) => parseInt(s, 16)) as Vec3 | ||
| } | ||
| export function rgbToHex(r: number, g: number, b: number): string { | ||
| return '#' + ((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1, 7) | ||
| export function rgbToHex (r: number, g: number, b: number): string { | ||
| return '#' + ((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1, 7) | ||
| } | ||
| export function rgbToHsl(r: number, g: number, b: number): Vec3 { | ||
| r /= 255 | ||
| g /= 255 | ||
| b /= 255 | ||
| let max = Math.max(r, g, b) | ||
| let min = Math.min(r, g, b) | ||
| let h: number | ||
| let s: number | ||
| let l = (max + min) / 2 | ||
| if (max === min) { | ||
| h = s = 0 | ||
| export function rgbToHsl (r: number, g: number, b: number): Vec3 { | ||
| r /= 255 | ||
| g /= 255 | ||
| b /= 255 | ||
| let max = Math.max(r, g, b) | ||
| let min = Math.min(r, g, b) | ||
| let h: number = 0 | ||
| let s: number = 0 | ||
| let l = (max + min) / 2 | ||
| if (max !== min) { | ||
| let d = max - min | ||
| s = l > 0.5 ? d / (2 - max - min) : d / (max + min) | ||
| switch (max) { | ||
| case r: | ||
| h = (g - b) / d + (g < b ? 6 : 0) | ||
| break | ||
| case g: | ||
| h = (b - r) / d + 2 | ||
| break | ||
| case b: | ||
| h = (r - g) / d + 4 | ||
| break | ||
| } | ||
| else { | ||
| let d = max - min | ||
| s = l > 0.5 ? d / (2 - max - min) : d / (max + min) | ||
| switch (max) { | ||
| case r: | ||
| h = (g - b) / d + (g < b ? 6 : 0) | ||
| break | ||
| case g: | ||
| h = (b - r) / d + 2 | ||
| break | ||
| case b: | ||
| h = (r - g) / d + 4 | ||
| break | ||
| } | ||
| h /= 6 | ||
| } | ||
| return [h, s, l] | ||
| h /= 6 | ||
| } | ||
| return [h, s, l] | ||
| } | ||
| export function hslToRgb(h: number, s: number, l: number): Vec3 { | ||
| let r: number | ||
| let g: number | ||
| let b: number | ||
| export function hslToRgb (h: number, s: number, l: number): Vec3 { | ||
| let r: number | ||
| let g: number | ||
| let b: number | ||
| function hue2rgb(p: number, q: number, t: number): number { | ||
| if (t < 0) t += 1 | ||
| if (t > 1) t -= 1 | ||
| if (t < 1 / 6) return p + (q - p) * 6 * t | ||
| if (t < 1 / 2) return q | ||
| if (t < 2 / 3) return p + (q - p) * (2 / 3 - t) * 6 | ||
| return p | ||
| } | ||
| function hue2rgb (p: number, q: number, t: number): number { | ||
| if (t < 0) t += 1 | ||
| if (t > 1) t -= 1 | ||
| if (t < 1 / 6) return p + (q - p) * 6 * t | ||
| if (t < 1 / 2) return q | ||
| if (t < 2 / 3) return p + (q - p) * (2 / 3 - t) * 6 | ||
| return p | ||
| } | ||
| if (s === 0) { | ||
| r = g = b = l | ||
| } else { | ||
| let q = l < 0.5 ? l * (1 + s) : l + s - (l * s) | ||
| let p = 2 * l - q | ||
| r = hue2rgb(p, q, h + 1 / 3) | ||
| g = hue2rgb(p, q, h) | ||
| b = hue2rgb(p, q, h - (1 / 3)) | ||
| } | ||
| return [ | ||
| r * 255, | ||
| g * 255, | ||
| b * 255 | ||
| ] | ||
| if (s === 0) { | ||
| r = g = b = l | ||
| } else { | ||
| let q = l < 0.5 ? l * (1 + s) : l + s - (l * s) | ||
| let p = 2 * l - q | ||
| r = hue2rgb(p, q, h + 1 / 3) | ||
| g = hue2rgb(p, q, h) | ||
| b = hue2rgb(p, q, h - (1 / 3)) | ||
| } | ||
| return [ | ||
| r * 255, | ||
| g * 255, | ||
| b * 255 | ||
| ] | ||
| } | ||
| export function rgbToXyz(r: number, g: number, b: number): Vec3 { | ||
| r /= 255 | ||
| g /= 255 | ||
| b /= 255 | ||
| r = r > 0.04045 ? Math.pow((r + 0.005) / 1.055, 2.4) : r / 12.92 | ||
| g = g > 0.04045 ? Math.pow((g + 0.005) / 1.055, 2.4) : g / 12.92 | ||
| b = b > 0.04045 ? Math.pow((b + 0.005) / 1.055, 2.4) : b / 12.92 | ||
| export function rgbToXyz (r: number, g: number, b: number): Vec3 { | ||
| r /= 255 | ||
| g /= 255 | ||
| b /= 255 | ||
| r = r > 0.04045 ? Math.pow((r + 0.005) / 1.055, 2.4) : r / 12.92 | ||
| g = g > 0.04045 ? Math.pow((g + 0.005) / 1.055, 2.4) : g / 12.92 | ||
| b = b > 0.04045 ? Math.pow((b + 0.005) / 1.055, 2.4) : b / 12.92 | ||
| r *= 100 | ||
| g *= 100 | ||
| b *= 100 | ||
| r *= 100 | ||
| g *= 100 | ||
| b *= 100 | ||
| let x = r * 0.4124 + g * 0.3576 + b * 0.1805 | ||
| let y = r * 0.2126 + g * 0.7152 + b * 0.0722 | ||
| let z = r * 0.0193 + g * 0.1192 + b * 0.9505 | ||
| let x = r * 0.4124 + g * 0.3576 + b * 0.1805 | ||
| let y = r * 0.2126 + g * 0.7152 + b * 0.0722 | ||
| let z = r * 0.0193 + g * 0.1192 + b * 0.9505 | ||
| return [x, y, z] | ||
| return [x, y, z] | ||
| } | ||
| export function xyzToCIELab(x: number, y: number, z: number): Vec3 { | ||
| let REF_X = 95.047 | ||
| let REF_Y = 100 | ||
| let REF_Z = 108.883 | ||
| export function xyzToCIELab (x: number, y: number, z: number): Vec3 { | ||
| let REF_X = 95.047 | ||
| let REF_Y = 100 | ||
| let REF_Z = 108.883 | ||
| x /= REF_X | ||
| y /= REF_Y | ||
| z /= REF_Z | ||
| x /= REF_X | ||
| y /= REF_Y | ||
| z /= REF_Z | ||
| x = x > 0.008856 ? Math.pow(x, 1 / 3) : 7.787 * x + 16 / 116 | ||
| y = y > 0.008856 ? Math.pow(y, 1 / 3) : 7.787 * y + 16 / 116 | ||
| z = z > 0.008856 ? Math.pow(z, 1 / 3) : 7.787 * z + 16 / 116 | ||
| x = x > 0.008856 ? Math.pow(x, 1 / 3) : 7.787 * x + 16 / 116 | ||
| y = y > 0.008856 ? Math.pow(y, 1 / 3) : 7.787 * y + 16 / 116 | ||
| z = z > 0.008856 ? Math.pow(z, 1 / 3) : 7.787 * z + 16 / 116 | ||
| let L = 116 * y - 16 | ||
| let a = 500 * (x - y) | ||
| let b = 200 * (y - z) | ||
| let L = 116 * y - 16 | ||
| let a = 500 * (x - y) | ||
| let b = 200 * (y - z) | ||
| return [L, a, b] | ||
| return [L, a, b] | ||
| } | ||
| export function rgbToCIELab(r: number, g: number, b: number): Vec3 { | ||
| let [x, y, z] = rgbToXyz(r, g, b) | ||
| return xyzToCIELab(x, y, z) | ||
| export function rgbToCIELab (r: number, g: number, b: number): Vec3 { | ||
| let [x, y, z] = rgbToXyz(r, g, b) | ||
| return xyzToCIELab(x, y, z) | ||
| } | ||
| export function deltaE94(lab1: Vec3, lab2: Vec3): number { | ||
| let WEIGHT_L = 1 | ||
| let WEIGHT_C = 1 | ||
| let WEIGHT_H = 1 | ||
| export function deltaE94 (lab1: Vec3, lab2: Vec3): number { | ||
| let WEIGHT_L = 1 | ||
| let WEIGHT_C = 1 | ||
| let WEIGHT_H = 1 | ||
| let [L1, a1, b1] = lab1 | ||
| let [L2, a2, b2] = lab2 | ||
| let dL = L1 - L2 | ||
| let da = a1 - a2 | ||
| let db = b1 - b2 | ||
| let [L1, a1, b1] = lab1 | ||
| let [L2, a2, b2] = lab2 | ||
| let dL = L1 - L2 | ||
| let da = a1 - a2 | ||
| let db = b1 - b2 | ||
| let xC1 = Math.sqrt(a1 * a1 + b1 * b1) | ||
| let xC2 = Math.sqrt(a2 * a2 + b2 * b2) | ||
| let xC1 = Math.sqrt(a1 * a1 + b1 * b1) | ||
| let xC2 = Math.sqrt(a2 * a2 + b2 * b2) | ||
| let xDL = L2 - L1 | ||
| let xDC = xC2 - xC1 | ||
| let xDE = Math.sqrt(dL * dL + da * da + db * db) | ||
| let xDL = L2 - L1 | ||
| let xDC = xC2 - xC1 | ||
| let xDE = Math.sqrt(dL * dL + da * da + db * db) | ||
| let xDH = (Math.sqrt(xDE) > Math.sqrt(Math.abs(xDL)) + Math.sqrt(Math.abs(xDC))) | ||
| ? Math.sqrt(xDE * xDE - xDL * xDL - xDC * xDC) | ||
| : 0 | ||
| let xDH = (Math.sqrt(xDE) > Math.sqrt(Math.abs(xDL)) + Math.sqrt(Math.abs(xDC))) | ||
| ? Math.sqrt(xDE * xDE - xDL * xDL - xDC * xDC) | ||
| : 0 | ||
| let xSC = 1 + 0.045 * xC1 | ||
| let xSH = 1 + 0.015 * xC1 | ||
| let xSC = 1 + 0.045 * xC1 | ||
| let xSH = 1 + 0.015 * xC1 | ||
| xDL /= WEIGHT_L | ||
| xDC /= WEIGHT_C * xSC | ||
| xDH /= WEIGHT_H * xSH | ||
| xDL /= WEIGHT_L | ||
| xDC /= WEIGHT_C * xSC | ||
| xDH /= WEIGHT_H * xSH | ||
| return Math.sqrt(xDL * xDL + xDC * xDC + xDH * xDH) | ||
| return Math.sqrt(xDL * xDL + xDC * xDC + xDH * xDH) | ||
| } | ||
| export function rgbDiff(rgb1: Vec3, rgb2: Vec3): number { | ||
| let lab1 = rgbToCIELab.apply(undefined, rgb1) | ||
| let lab2 = rgbToCIELab.apply(undefined, rgb2) | ||
| return deltaE94(lab1, lab2) | ||
| export function rgbDiff (rgb1: Vec3, rgb2: Vec3): number { | ||
| let lab1 = rgbToCIELab.apply(undefined, rgb1) | ||
| let lab2 = rgbToCIELab.apply(undefined, rgb2) | ||
| return deltaE94(lab1, lab2) | ||
| } | ||
| export function hexDiff(hex1: string, hex2: string): number { | ||
| let rgb1 = hexToRgb(hex1) | ||
| let rgb2 = hexToRgb(hex2) | ||
| export function hexDiff (hex1: string, hex2: string): number { | ||
| let rgb1 = hexToRgb(hex1) | ||
| let rgb2 = hexToRgb(hex2) | ||
| return rgbDiff(rgb1, rgb2) | ||
| return rgbDiff(rgb1, rgb2) | ||
| } | ||
| export function getColorDiffStatus(d: number): string { | ||
| if (d < DELTAE94_DIFF_STATUS.NA) | ||
| return 'N/A' | ||
| // Not perceptible by human eyes | ||
| if (d <= DELTAE94_DIFF_STATUS.PERFECT) | ||
| return 'Perfect' | ||
| // Perceptible through close observation | ||
| if (d <= DELTAE94_DIFF_STATUS.CLOSE) | ||
| return 'Close' | ||
| // Perceptible at a glance | ||
| if (d <= DELTAE94_DIFF_STATUS.GOOD) | ||
| return 'Good' | ||
| // Colors are more similar than opposite | ||
| if (d < DELTAE94_DIFF_STATUS.SIMILAR) | ||
| return 'Similar' | ||
| return 'Wrong' | ||
| export function getColorDiffStatus (d: number): string { | ||
| if (d < DELTAE94_DIFF_STATUS.NA) { | ||
| return 'N/A' | ||
| } | ||
| // Not perceptible by human eyes | ||
| if (d <= DELTAE94_DIFF_STATUS.PERFECT) { | ||
| return 'Perfect' | ||
| } | ||
| // Perceptible through close observation | ||
| if (d <= DELTAE94_DIFF_STATUS.CLOSE) { | ||
| return 'Close' | ||
| } | ||
| // Perceptible at a glance | ||
| if (d <= DELTAE94_DIFF_STATUS.GOOD) { | ||
| return 'Good' | ||
| } | ||
| // Colors are more similar than opposite | ||
| if (d < DELTAE94_DIFF_STATUS.SIMILAR) { | ||
| return 'Similar' | ||
| } | ||
| return 'Wrong' | ||
| } | ||
| } |
171
src/index.ts
| import { rgbToHsl, rgbToHex } from './converter' | ||
| export interface Filter { | ||
| (red: number, green: number, blue: number, alpha: number): boolean | ||
| (red: number, green: number, blue: number, alpha: number): boolean | ||
| } | ||
| export interface Vec3 extends Array<number> { | ||
| 0: number, | ||
| 1: number, | ||
| 2: number | ||
| } | ||
| export type Vec3 = [number, number, number] | ||
| export interface Palette { | ||
| Vibrant?: Swatch, | ||
| Muted?: Swatch, | ||
| DarkVibrant?: Swatch, | ||
| DarkMuted?: Swatch, | ||
| LightVibrant?: Swatch, | ||
| LightMuted?: Swatch | ||
| [name: string]: Swatch | ||
| Vibrant: Swatch | null | ||
| Muted: Swatch | null | ||
| DarkVibrant: Swatch | null | ||
| DarkMuted: Swatch | null | ||
| LightVibrant: Swatch | null | ||
| LightMuted: Swatch | null | ||
| [name: string]: Swatch | null | ||
| } | ||
| export class Swatch { | ||
| static applyFilters(colors: Swatch[], filters: Filter[]): Swatch[] { | ||
| return filters.length > 0 | ||
| ? colors.filter(({ r, g, b }) => { | ||
| for (let j = 0; j < filters.length; j++) { | ||
| if (!filters[j](r, g, b, 255)) | ||
| return false | ||
| } | ||
| return true | ||
| }) | ||
| : colors | ||
| } | ||
| static clone(swatch: Swatch) { | ||
| return new Swatch(swatch._rgb, swatch._population) | ||
| } | ||
| private _hsl: Vec3 | ||
| private _rgb: Vec3 | ||
| private _yiq: number | ||
| private _population: number | ||
| private _hex: string | ||
| get r() { return this._rgb[0] } | ||
| get g() { return this._rgb[1] } | ||
| get b() { return this._rgb[2] } | ||
| getRgb(): Vec3 { return this._rgb } | ||
| getHsl(): Vec3 { | ||
| if (!this._hsl) { | ||
| let [r, g, b] = this._rgb | ||
| this._hsl = rgbToHsl(r, g, b) | ||
| static applyFilters (colors: Swatch[], filters: Filter[]): Swatch[] { | ||
| return filters.length > 0 | ||
| ? colors.filter(({ r, g, b }) => { | ||
| for (let j = 0; j < filters.length; j++) { | ||
| if (!filters[j](r, g, b, 255)) return false | ||
| } | ||
| return this._hsl | ||
| return true | ||
| }) | ||
| : colors | ||
| } | ||
| static clone (swatch: Swatch) { | ||
| return new Swatch(swatch._rgb, swatch._population) | ||
| } | ||
| private _hsl: Vec3 | ||
| private _rgb: Vec3 | ||
| private _yiq: number | ||
| private _population: number | ||
| private _hex: string | ||
| get r (): number { | ||
| return this._rgb[0] | ||
| } | ||
| get g (): number { | ||
| return this._rgb[1] | ||
| } | ||
| get b (): number { | ||
| return this._rgb[2] | ||
| } | ||
| get rgb (): Vec3 { | ||
| return this._rgb | ||
| } | ||
| get hsl (): Vec3 { | ||
| if (!this._hsl) { | ||
| let [r, g, b] = this._rgb | ||
| this._hsl = rgbToHsl(r, g, b) | ||
| } | ||
| getPopulation(): number { return this._population } | ||
| getHex(): string { | ||
| if (!this._hex) { | ||
| let [r, g, b] = this._rgb | ||
| this._hex = rgbToHex(r, g, b) | ||
| } | ||
| return this._hex | ||
| return this._hsl | ||
| } | ||
| get hex () { | ||
| if (!this._hex) { | ||
| let [r, g, b] = this._rgb | ||
| this._hex = rgbToHex(r, g, b) | ||
| } | ||
| return this._hex | ||
| } | ||
| get population (): number { | ||
| return this._population | ||
| } | ||
| private getYiq(): number { | ||
| if (!this._yiq) { | ||
| let rgb = this._rgb | ||
| this._yiq = (rgb[0] * 299 + rgb[1] * 587 + rgb[2] * 114) / 1000 | ||
| } | ||
| return this._yiq | ||
| toJSON () { | ||
| return { | ||
| rgb: this.rgb, | ||
| population: this.population | ||
| } | ||
| } | ||
| getTitleTextColor(): string { | ||
| return this.getYiq() < 200 ? '#fff' : '#000' | ||
| // TODO: deprecate internally, use property instead | ||
| getRgb (): Vec3 { | ||
| return this._rgb | ||
| } | ||
| // TODO: deprecate internally, use property instead | ||
| getHsl (): Vec3 { | ||
| return this.hsl | ||
| } | ||
| // TODO: deprecate internally, use property instead | ||
| getPopulation (): number { | ||
| return this._population | ||
| } | ||
| // TODO: deprecate internally, use property instead | ||
| getHex (): string { | ||
| return this.hex | ||
| } | ||
| private getYiq (): number { | ||
| if (!this._yiq) { | ||
| let rgb = this._rgb | ||
| this._yiq = (rgb[0] * 299 + rgb[1] * 587 + rgb[2] * 114) / 1000 | ||
| } | ||
| return this._yiq | ||
| } | ||
| getBodyTextColor(): string { | ||
| return this.getYiq() < 150 ? '#fff' : '#000' | ||
| private _titleTextColor: string | ||
| private _bodyTextColor: string | ||
| get titleTextColor () { | ||
| if (this._titleTextColor) { | ||
| this._titleTextColor = this.getYiq() < 200 ? '#fff' : '#000' | ||
| } | ||
| return this._titleTextColor | ||
| } | ||
| get bodyTextColor () { | ||
| if (this._bodyTextColor) { | ||
| this._bodyTextColor = this.getYiq() < 150 ? '#fff' : '#000' | ||
| } | ||
| return this._bodyTextColor | ||
| } | ||
| getTitleTextColor (): string { | ||
| return this.titleTextColor | ||
| } | ||
| constructor(rgb: Vec3, population: number) { | ||
| this._rgb = rgb | ||
| this._population = population | ||
| } | ||
| } | ||
| getBodyTextColor (): string { | ||
| return this.bodyTextColor | ||
| } | ||
| constructor (rgb: Vec3, population: number) { | ||
| this._rgb = rgb | ||
| this._population = population | ||
| } | ||
| } |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
No v1
QualityPackage is not semver >=1. This means it is not stable and does not support ^ ranges.
Found 1 instance in 1 package
Fixed alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
No contributors or author data
MaintenancePackage does not specify a list of contributors or an author in package.json.
Found 1 instance in 1 package
No bug tracker
MaintenancePackage does not have a linked bug tracker in package.json.
Found 1 instance in 1 package
No website
QualityPackage does not have a website.
Found 1 instance in 1 package
Improved metrics
- Total package byte prevSize
- increased by6.52%
30185
- Lines of code
- increased by20.11%
657
- Number of low maintenance alerts
- decreased by-100%
0
Worsened metrics
- Number of package files
- decreased by-15.38%
11
No dependency changes