@ant-design/fast-color - npm Package Compare versions

Comparing version 1.3.0 to 2.0.0

es/FastColor.d.ts

@@ -31,27 +31,8 @@ import type { ColorInput, HSL, HSV, RGB } from './types';
     constructor(input: ColorInput);
-    setR(value: number): this;
-    setG(value: number): this;
-    setB(value: number): this;
-    getAlpha(): number;
-    setAlpha(value: number): this;
-    clone(): FastColor;
-    equals(other: FastColor): boolean;
-    darken(amount?: number): FastColor;
-    lighten(amount?: number): FastColor;
+    setR(value: number): FastColor;
+    setG(value: number): FastColor;
+    setB(value: number): FastColor;
+    setA(value: number): FastColor;
+    setHue(value: number): FastColor;
     /**
-     * Mix the color with pure white, from 0 to 100.
-     * Providing 0 will do nothing, providing 100 will always return white.
-     */
-    tint(amount?: number): FastColor;
-    /**
-     * Mix the color with pure black, from 0 to 100.
-     * Providing 0 will do nothing, providing 100 will always return black.
-     */
-    shade(amount?: number): FastColor;
-    /**
-     * Mix the current color a given amount with another color, from 0 to 100.
-     * 0 means no mixing (return current color).
-     */
-    mix(input: ColorInput, amount?: number): FastColor;
-    /**
      * Returns the perceived luminance of a color, from 0-1.
@@ -65,4 +46,2 @@ * @see http://www.w3.org/TR/2008/REC-WCAG20-20081211/#relativeluminancedef
     getValue(): number;
-    isDark(): boolean;
-    isLight(): boolean;
     /**
@@ -73,6 +52,30 @@ * Returns the perceived brightness of the color, from 0-255.
     getBrightness(): number;
+    darken(amount?: number): FastColor;
+    lighten(amount?: number): FastColor;
+    /**
+     * Mix the current color a given amount with another color, from 0 to 100.
+     * 0 means no mixing (return current color).
+     */
+    mix(input: ColorInput, amount?: number): FastColor;
+    /**
+     * Mix the color with pure white, from 0 to 100.
+     * Providing 0 will do nothing, providing 100 will always return white.
+     */
+    tint(amount?: number): FastColor;
+    /**
+     * Mix the color with pure black, from 0 to 100.
+     * Providing 0 will do nothing, providing 100 will always return black.
+     */
+    shade(amount?: number): FastColor;
     onBackground(background: ColorInput): FastColor;
+    isDark(): boolean;
+    isLight(): boolean;
+    equals(other: FastColor): boolean;
+    clone(): FastColor;
     toHexString(): string;
+    /** CSS support color pattern */
     toHsl(): HSL;
+    /** CSS support color pattern */
     toHslString(): string;
+    /** Same as toHsb */
     toHsv(): HSV;
@@ -82,2 +85,4 @@ toRgb(): RGB;
     toString(): string;
+    /** Return a new FastColor object with one channel changed */
+    _sc(rgb: string, value: number, max?: number): FastColor;
     private getMax;
@@ -84,0 +89,0 @@ private getMin;

es/FastColor.js

@@ -76,3 +76,3 @@ /**
 
-  // intermedia variables to calculate HSL/HSV
+  // intermediate variables to calculate HSL/HSV
   _max;
@@ -92,2 +92,11 @@ _min;
       // Do nothing since already initialized
+    } else if (input instanceof FastColor) {
+      this.r = input.r;
+      this.g = input.g;
+      this.b = input.b;
+      this.a = input.a;
+      this._h = input._h;
+      this._s = input._s;
+      this._l = input._l;
+      this._v = input._v;
     } else if (typeof input === 'string') {
@@ -108,6 +117,6 @@ const trimStr = input.trim();
     } else if (matchFormat('rgb')) {
-      this.setR(input.r);
-      this.setG(input.g);
-      this.setB(input.b);
-      this.setAlpha(typeof input.a === 'number' ? input.a : 1);
+      this.r = limitRange(input.r);
+      this.g = limitRange(input.g);
+      this.b = limitRange(input.b);
+      this.a = typeof input.a === 'number' ? limitRange(input.a, 1) : 1;
     } else if (matchFormat('hsl')) {
@@ -121,99 +130,25 @@ this.fromHsl(input);
   }
+
+  // ======================= Setter =======================
+
   setR(value) {
-    this.r = limitRange(value);
-    return this;
+    return this._sc('r', value);
   }
   setG(value) {
-    this.g = limitRange(value);
-    return this;
+    return this._sc('g', value);
   }
   setB(value) {
-    this.b = limitRange(value);
-    return this;
+    return this._sc('b', value);
   }
-  getAlpha() {
-    return this.a;
+  setA(value) {
+    return this._sc('a', value, 1);
   }
-  setAlpha(value) {
-    this.a = limitRange(value, 1);
-    return this;
+  setHue(value) {
+    const hsl = this.toHsl();
+    hsl.h = value;
+    return new FastColor(hsl);
   }
-  clone() {
-    return new FastColor(this);
-  }
-  equals(other) {
-    return this.r === other.r && this.g === other.g && this.b === other.b && this.a === other.a;
-  }
-  darken(amount = 10) {
-    const h = this.getHue();
-    const s = this.getSaturation();
-    let l = this.getLightness() - amount / 100;
-    if (l < 0) {
-      l = 0;
-    }
-    return new FastColor({
-      h,
-      s,
-      l,
-      a: this.a
-    });
-  }
-  lighten(amount = 10) {
-    const h = this.getHue();
-    const s = this.getSaturation();
-    let l = this.getLightness() + amount / 100;
-    if (l > 1) {
-      l = 1;
-    }
-    return new FastColor({
-      h,
-      s,
-      l,
-      a: this.a
-    });
-  }
 
+  // ======================= Getter =======================
   /**
-   * Mix the color with pure white, from 0 to 100.
-   * Providing 0 will do nothing, providing 100 will always return white.
-   */
-  tint(amount = 10) {
-    return this.mix({
-      r: 255,
-      g: 255,
-      b: 255,
-      a: 1
-    }, amount);
-  }
-
-  /**
-   * Mix the color with pure black, from 0 to 100.
-   * Providing 0 will do nothing, providing 100 will always return black.
-   */
-  shade(amount = 10) {
-    return this.mix({
-      r: 0,
-      g: 0,
-      b: 0,
-      a: 1
-    }, amount);
-  }
-
-  /**
-   * Mix the current color a given amount with another color, from 0 to 100.
-   * 0 means no mixing (return current color).
-   */
-  mix(input, amount = 50) {
-    const color = new FastColor(input);
-    const p = amount / 100;
-    const rgba = {
-      r: (color.r - this.r) * p + this.r,
-      g: (color.g - this.g) * p + this.g,
-      b: (color.b - this.b) * p + this.b,
-      a: (color.a - this.a) * p + this.a
-    };
-    return new FastColor(rgba);
-  }
-
-  /**
    * Returns the perceived luminance of a color, from 0-1.
@@ -266,8 +201,2 @@ * @see http://www.w3.org/TR/2008/REC-WCAG20-20081211/#relativeluminancedef
   }
-  isDark() {
-    return this.getBrightness() < 128;
-  }
-  isLight() {
-    return this.getBrightness() >= 128;
-  }
 
@@ -284,2 +213,75 @@ /**
   }
+
+  // ======================== Func ========================
+
+  darken(amount = 10) {
+    const h = this.getHue();
+    const s = this.getSaturation();
+    let l = this.getLightness() - amount / 100;
+    if (l < 0) {
+      l = 0;
+    }
+    return new FastColor({
+      h,
+      s,
+      l,
+      a: this.a
+    });
+  }
+  lighten(amount = 10) {
+    const h = this.getHue();
+    const s = this.getSaturation();
+    let l = this.getLightness() + amount / 100;
+    if (l > 1) {
+      l = 1;
+    }
+    return new FastColor({
+      h,
+      s,
+      l,
+      a: this.a
+    });
+  }
+
+  /**
+   * Mix the current color a given amount with another color, from 0 to 100.
+   * 0 means no mixing (return current color).
+   */
+  mix(input, amount = 50) {
+    const color = new FastColor(input);
+    const p = amount / 100;
+    const rgba = {
+      r: (color.r - this.r) * p + this.r,
+      g: (color.g - this.g) * p + this.g,
+      b: (color.b - this.b) * p + this.b,
+      a: (color.a - this.a) * p + this.a
+    };
+    return new FastColor(rgba);
+  }
+
+  /**
+   * Mix the color with pure white, from 0 to 100.
+   * Providing 0 will do nothing, providing 100 will always return white.
+   */
+  tint(amount = 10) {
+    return this.mix({
+      r: 255,
+      g: 255,
+      b: 255,
+      a: 1
+    }, amount);
+  }
+
+  /**
+   * Mix the color with pure black, from 0 to 100.
+   * Providing 0 will do nothing, providing 100 will always return black.
+   */
+  shade(amount = 10) {
+    return this.mix({
+      r: 0,
+      g: 0,
+      b: 0,
+      a: 1
+    }, amount);
+  }
   onBackground(background) {
@@ -295,2 +297,20 @@ const bg = new FastColor(background);
   }
+
+  // ======================= Status =======================
+  isDark() {
+    return this.getBrightness() < 128;
+  }
+  isLight() {
+    return this.getBrightness() >= 128;
+  }
+
+  // ======================== MISC ========================
+  equals(other) {
+    return this.r === other.r && this.g === other.g && this.b === other.b && this.a === other.a;
+  }
+  clone() {
+    return new FastColor(this);
+  }
+
+  // ======================= Format =======================
   toHexString() {
@@ -310,2 +330,4 @@ let hex = '#';
   }
+
+  /** CSS support color pattern */
   toHsl() {
@@ -316,5 +338,7 @@ return {
       l: this.getLightness(),
-      a: this.getAlpha()
+      a: this.a
     };
   }
+
+  /** CSS support color pattern */
   toHslString() {
@@ -326,2 +350,4 @@ const h = this.getHue();
   }
+
+  /** Same as toHsb */
   toHsv() {
@@ -332,3 +358,3 @@ return {
       v: this.getValue(),
-      a: this.getAlpha()
+      a: this.a
     };
@@ -350,2 +376,10 @@ }
   }
+
+  // ====================== Privates ======================
+  /** Return a new FastColor object with one channel changed */
+  _sc(rgb, value, max) {
+    const clone = this.clone();
+    clone[rgb] = limitRange(value, max);
+    return clone;
+  }
   getMax() {
@@ -479,4 +513,4 @@ if (typeof this._max === 'undefined') {
   }
-  fromHsvString(trimed) {
-    const cells = splitColorStr(trimed, parseHSVorHSL);
+  fromHsvString(trimStr) {
+    const cells = splitColorStr(trimStr, parseHSVorHSL);
     this.fromHsv({
@@ -489,4 +523,4 @@ h: cells[0],
   }
-  fromHslString(trimed) {
-    const cells = splitColorStr(trimed, parseHSVorHSL);
+  fromHslString(trimStr) {
+    const cells = splitColorStr(trimStr, parseHSVorHSL);
     this.fromHsl({
@@ -499,4 +533,4 @@ h: cells[0],
   }
-  fromRgbString(trimed) {
-    const cells = splitColorStr(trimed, (num, txt) =>
+  fromRgbString(trimStr) {
+    const cells = splitColorStr(trimStr, (num, txt) =>
     // Convert percentage to number. e.g. 50% -> 128
@@ -503,0 +537,0 @@ txt.includes('%') ? Math.round(num / 100 * 255) : num);

lib/FastColor.d.ts

@@ -31,27 +31,8 @@ import type { ColorInput, HSL, HSV, RGB } from './types';
     constructor(input: ColorInput);
-    setR(value: number): this;
-    setG(value: number): this;
-    setB(value: number): this;
-    getAlpha(): number;
-    setAlpha(value: number): this;
-    clone(): FastColor;
-    equals(other: FastColor): boolean;
-    darken(amount?: number): FastColor;
-    lighten(amount?: number): FastColor;
+    setR(value: number): FastColor;
+    setG(value: number): FastColor;
+    setB(value: number): FastColor;
+    setA(value: number): FastColor;
+    setHue(value: number): FastColor;
     /**
-     * Mix the color with pure white, from 0 to 100.
-     * Providing 0 will do nothing, providing 100 will always return white.
-     */
-    tint(amount?: number): FastColor;
-    /**
-     * Mix the color with pure black, from 0 to 100.
-     * Providing 0 will do nothing, providing 100 will always return black.
-     */
-    shade(amount?: number): FastColor;
-    /**
-     * Mix the current color a given amount with another color, from 0 to 100.
-     * 0 means no mixing (return current color).
-     */
-    mix(input: ColorInput, amount?: number): FastColor;
-    /**
      * Returns the perceived luminance of a color, from 0-1.
@@ -65,4 +46,2 @@ * @see http://www.w3.org/TR/2008/REC-WCAG20-20081211/#relativeluminancedef
     getValue(): number;
-    isDark(): boolean;
-    isLight(): boolean;
     /**
@@ -73,6 +52,30 @@ * Returns the perceived brightness of the color, from 0-255.
     getBrightness(): number;
+    darken(amount?: number): FastColor;
+    lighten(amount?: number): FastColor;
+    /**
+     * Mix the current color a given amount with another color, from 0 to 100.
+     * 0 means no mixing (return current color).
+     */
+    mix(input: ColorInput, amount?: number): FastColor;
+    /**
+     * Mix the color with pure white, from 0 to 100.
+     * Providing 0 will do nothing, providing 100 will always return white.
+     */
+    tint(amount?: number): FastColor;
+    /**
+     * Mix the color with pure black, from 0 to 100.
+     * Providing 0 will do nothing, providing 100 will always return black.
+     */
+    shade(amount?: number): FastColor;
     onBackground(background: ColorInput): FastColor;
+    isDark(): boolean;
+    isLight(): boolean;
+    equals(other: FastColor): boolean;
+    clone(): FastColor;
     toHexString(): string;
+    /** CSS support color pattern */
     toHsl(): HSL;
+    /** CSS support color pattern */
     toHslString(): string;
+    /** Same as toHsb */
     toHsv(): HSV;
@@ -82,2 +85,4 @@ toRgb(): RGB;
     toString(): string;
+    /** Return a new FastColor object with one channel changed */
+    _sc(rgb: string, value: number, max?: number): FastColor;
     private getMax;
@@ -84,0 +89,0 @@ private getMin;

lib/FastColor.js

@@ -82,3 +82,3 @@ "use strict";
 
-  // intermedia variables to calculate HSL/HSV
+  // intermediate variables to calculate HSL/HSV
   _max;
@@ -98,2 +98,11 @@ _min;
       // Do nothing since already initialized
+    } else if (input instanceof FastColor) {
+      this.r = input.r;
+      this.g = input.g;
+      this.b = input.b;
+      this.a = input.a;
+      this._h = input._h;
+      this._s = input._s;
+      this._l = input._l;
+      this._v = input._v;
     } else if (typeof input === 'string') {
@@ -114,6 +123,6 @@ const trimStr = input.trim();
     } else if (matchFormat('rgb')) {
-      this.setR(input.r);
-      this.setG(input.g);
-      this.setB(input.b);
-      this.setAlpha(typeof input.a === 'number' ? input.a : 1);
+      this.r = limitRange(input.r);
+      this.g = limitRange(input.g);
+      this.b = limitRange(input.b);
+      this.a = typeof input.a === 'number' ? limitRange(input.a, 1) : 1;
     } else if (matchFormat('hsl')) {
@@ -127,99 +136,25 @@ this.fromHsl(input);
   }
+
+  // ======================= Setter =======================
+
   setR(value) {
-    this.r = limitRange(value);
-    return this;
+    return this._sc('r', value);
   }
   setG(value) {
-    this.g = limitRange(value);
-    return this;
+    return this._sc('g', value);
   }
   setB(value) {
-    this.b = limitRange(value);
-    return this;
+    return this._sc('b', value);
   }
-  getAlpha() {
-    return this.a;
+  setA(value) {
+    return this._sc('a', value, 1);
   }
-  setAlpha(value) {
-    this.a = limitRange(value, 1);
-    return this;
+  setHue(value) {
+    const hsl = this.toHsl();
+    hsl.h = value;
+    return new FastColor(hsl);
   }
-  clone() {
-    return new FastColor(this);
-  }
-  equals(other) {
-    return this.r === other.r && this.g === other.g && this.b === other.b && this.a === other.a;
-  }
-  darken(amount = 10) {
-    const h = this.getHue();
-    const s = this.getSaturation();
-    let l = this.getLightness() - amount / 100;
-    if (l < 0) {
-      l = 0;
-    }
-    return new FastColor({
-      h,
-      s,
-      l,
-      a: this.a
-    });
-  }
-  lighten(amount = 10) {
-    const h = this.getHue();
-    const s = this.getSaturation();
-    let l = this.getLightness() + amount / 100;
-    if (l > 1) {
-      l = 1;
-    }
-    return new FastColor({
-      h,
-      s,
-      l,
-      a: this.a
-    });
-  }
 
+  // ======================= Getter =======================
   /**
-   * Mix the color with pure white, from 0 to 100.
-   * Providing 0 will do nothing, providing 100 will always return white.
-   */
-  tint(amount = 10) {
-    return this.mix({
-      r: 255,
-      g: 255,
-      b: 255,
-      a: 1
-    }, amount);
-  }
-
-  /**
-   * Mix the color with pure black, from 0 to 100.
-   * Providing 0 will do nothing, providing 100 will always return black.
-   */
-  shade(amount = 10) {
-    return this.mix({
-      r: 0,
-      g: 0,
-      b: 0,
-      a: 1
-    }, amount);
-  }
-
-  /**
-   * Mix the current color a given amount with another color, from 0 to 100.
-   * 0 means no mixing (return current color).
-   */
-  mix(input, amount = 50) {
-    const color = new FastColor(input);
-    const p = amount / 100;
-    const rgba = {
-      r: (color.r - this.r) * p + this.r,
-      g: (color.g - this.g) * p + this.g,
-      b: (color.b - this.b) * p + this.b,
-      a: (color.a - this.a) * p + this.a
-    };
-    return new FastColor(rgba);
-  }
-
-  /**
    * Returns the perceived luminance of a color, from 0-1.
@@ -272,8 +207,2 @@ * @see http://www.w3.org/TR/2008/REC-WCAG20-20081211/#relativeluminancedef
   }
-  isDark() {
-    return this.getBrightness() < 128;
-  }
-  isLight() {
-    return this.getBrightness() >= 128;
-  }
 
@@ -290,2 +219,75 @@ /**
   }
+
+  // ======================== Func ========================
+
+  darken(amount = 10) {
+    const h = this.getHue();
+    const s = this.getSaturation();
+    let l = this.getLightness() - amount / 100;
+    if (l < 0) {
+      l = 0;
+    }
+    return new FastColor({
+      h,
+      s,
+      l,
+      a: this.a
+    });
+  }
+  lighten(amount = 10) {
+    const h = this.getHue();
+    const s = this.getSaturation();
+    let l = this.getLightness() + amount / 100;
+    if (l > 1) {
+      l = 1;
+    }
+    return new FastColor({
+      h,
+      s,
+      l,
+      a: this.a
+    });
+  }
+
+  /**
+   * Mix the current color a given amount with another color, from 0 to 100.
+   * 0 means no mixing (return current color).
+   */
+  mix(input, amount = 50) {
+    const color = new FastColor(input);
+    const p = amount / 100;
+    const rgba = {
+      r: (color.r - this.r) * p + this.r,
+      g: (color.g - this.g) * p + this.g,
+      b: (color.b - this.b) * p + this.b,
+      a: (color.a - this.a) * p + this.a
+    };
+    return new FastColor(rgba);
+  }
+
+  /**
+   * Mix the color with pure white, from 0 to 100.
+   * Providing 0 will do nothing, providing 100 will always return white.
+   */
+  tint(amount = 10) {
+    return this.mix({
+      r: 255,
+      g: 255,
+      b: 255,
+      a: 1
+    }, amount);
+  }
+
+  /**
+   * Mix the color with pure black, from 0 to 100.
+   * Providing 0 will do nothing, providing 100 will always return black.
+   */
+  shade(amount = 10) {
+    return this.mix({
+      r: 0,
+      g: 0,
+      b: 0,
+      a: 1
+    }, amount);
+  }
   onBackground(background) {
@@ -301,2 +303,20 @@ const bg = new FastColor(background);
   }
+
+  // ======================= Status =======================
+  isDark() {
+    return this.getBrightness() < 128;
+  }
+  isLight() {
+    return this.getBrightness() >= 128;
+  }
+
+  // ======================== MISC ========================
+  equals(other) {
+    return this.r === other.r && this.g === other.g && this.b === other.b && this.a === other.a;
+  }
+  clone() {
+    return new FastColor(this);
+  }
+
+  // ======================= Format =======================
   toHexString() {
@@ -316,2 +336,4 @@ let hex = '#';
   }
+
+  /** CSS support color pattern */
   toHsl() {
@@ -322,5 +344,7 @@ return {
       l: this.getLightness(),
-      a: this.getAlpha()
+      a: this.a
     };
   }
+
+  /** CSS support color pattern */
   toHslString() {
@@ -332,2 +356,4 @@ const h = this.getHue();
   }
+
+  /** Same as toHsb */
   toHsv() {
@@ -338,3 +364,3 @@ return {
       v: this.getValue(),
-      a: this.getAlpha()
+      a: this.a
     };
@@ -356,2 +382,10 @@ }
   }
+
+  // ====================== Privates ======================
+  /** Return a new FastColor object with one channel changed */
+  _sc(rgb, value, max) {
+    const clone = this.clone();
+    clone[rgb] = limitRange(value, max);
+    return clone;
+  }
   getMax() {
@@ -485,4 +519,4 @@ if (typeof this._max === 'undefined') {
   }
-  fromHsvString(trimed) {
-    const cells = splitColorStr(trimed, parseHSVorHSL);
+  fromHsvString(trimStr) {
+    const cells = splitColorStr(trimStr, parseHSVorHSL);
     this.fromHsv({
@@ -495,4 +529,4 @@ h: cells[0],
   }
-  fromHslString(trimed) {
-    const cells = splitColorStr(trimed, parseHSVorHSL);
+  fromHslString(trimStr) {
+    const cells = splitColorStr(trimStr, parseHSVorHSL);
     this.fromHsl({
@@ -505,4 +539,4 @@ h: cells[0],
   }
-  fromRgbString(trimed) {
-    const cells = splitColorStr(trimed, (num, txt) =>
+  fromRgbString(trimStr) {
+    const cells = splitColorStr(trimStr, (num, txt) =>
     // Convert percentage to number. e.g. 50% -> 128
@@ -509,0 +543,0 @@ txt.includes('%') ? Math.round(num / 100 * 255) : num);

package.json

 {
   "name": "@ant-design/fast-color",
-  "version": "1.3.0",
+  "version": "2.0.0",
   "description": "fast and small color class",
@@ -5,0 +5,0 @@ "engines": {

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

42877

increased by6.11%

Lines of code

1277

increased by4.59%

No dependency changes