@hzab/utils 1.1.1 → 1.1.3

package/src/color.ts

@@ -1,302 +1,302 @@
-/**
- * 计算颜色的亮度
- * @param r
- * @param g
- * @param b
- * @returns
- */
-export function luminance(r, g, b) {
-  const a = [r, g, b].map((v) => {
-    v /= 255;
-    return v <= 0.03928 ? v / 12.92 : Math.pow((v + 0.055) / 1.055, 2.4);
-  });
-  return a[0] * 0.2126 + a[1] * 0.7152 + a[2] * 0.0722;
-}
-
-/**
- * 计算两个颜色之间的对比度
- * @param l1
- * @param l2
- * @returns
- */
-export function contrast(l1, l2) {
-  const brightest = Math.max(l1, l2);
-  const darkest = Math.min(l1, l2);
-  return (brightest + 0.05) / (darkest + 0.05);
-}
-
-/**
- * 计算对比度
- * @param luminance1
- * @param luminance2
- * @returns
- */
-export function contrastRatio(luminance1, luminance2) {
-  return (Math.max(luminance1, luminance2) + 0.05) / (Math.min(luminance1, luminance2) + 0.05);
-}
-
-/**
- * 十六进制颜色转 RGB
- * @param hex
- * @returns
- */
-export function hexToRGB(hex) {
-  hex = hex.replace("#", "");
-  if (hex.length === 3) {
-    hex = hex[0] + hex[0] + hex[1] + hex[1] + hex[2] + hex[2];
-  }
-  const r = parseInt(hex.substring(0, 2), 16);
-  const g = parseInt(hex.substring(2, 4), 16);
-  const b = parseInt(hex.substring(4, 6), 16);
-  return [r, g, b];
-}
-
-/**
- * rgb 数值限制
- * @param val
- * @returns
- */
-export function rgbNumLimit(val) {
-  if (val > 250) {
-    return 250;
-  }
-  if (val < 0) {
-    return 0;
-  }
-  return val;
-}
-
-/**
- * RGB 转十六进制颜色
- * @param r
- * @param g
- * @param b
- * @returns
- */
-export function rgbToHex(r, g, b) {
-  return (
-    "#" +
-    [r, g, b]
-      .map((x) => {
-        const hex = x.toString(16);
-        return hex.length === 1 ? "0" + hex : hex;
-      })
-      .join("")
-  );
-}
-
-/**
- *  RGB 转 HSL
- * @param r
- * @param g
- * @param b
- * @returns
- */
-export function rgbToHsl(r, g, b) {
-  r /= 255;
-  g /= 255;
-  b /= 255;
-  const max = Math.max(r, g, b);
-  const min = Math.min(r, g, b);
-  let h,
-    s,
-    l = (max + min) / 2;
-
-  if (max === min) {
-    h = s = 0;
-  } else {
-    const 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 * 360, s * 100, l * 100];
-}
-
-/**
- * HSL 转 RGB
- * @param h
- * @param s
- * @param l
- * @returns
- */
-export function hslToRgb(h, s, l) {
-  h /= 360;
-  s /= 100;
-  l /= 100;
-  let r, g, b;
-
-  if (s === 0) {
-    r = g = b = l;
-  } else {
-    const hue2rgb = (p, q, t) => {
-      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;
-    };
-    const q = l < 0.5 ? l * (1 + s) : l + s - l * s;
-    const p = 2 * l - q;
-    r = hue2rgb(p, q, h + 1 / 3);
-    g = hue2rgb(p, q, h);
-    b = hue2rgb(p, q, h - 1 / 3);
-  }
-  return [Math.round(r * 255), Math.round(g * 255), Math.round(b * 255)];
-}
-
-/**
- * 判断是否为灰色背景
- * @param r
- * @param g
- * @param b
- * @returns
- */
-export function isGray(r, g, b, opt = { tolerance: 10 }) {
-  const {
-    /**
-     * 允许的误差范围
-     */
-    tolerance = 10,
-  } = opt || {}; //
-  return Math.abs(r - g) <= tolerance && Math.abs(g - b) <= tolerance && Math.abs(r - b) <= tolerance;
-}
-
-/**
- *  根据背景颜色选择合适的文本颜色（十六进制格式）
- * @param backgroundColor
- * @returns
- */
-export function getTextColor(backgroundColor) {
-  let [r, g, b] = [0, 0, 0];
-  if (backgroundColor.startsWith("#")) {
-    [r, g, b] = hexToRGB(backgroundColor);
-  } else {
-    const div = document.createElement("div");
-    div.style.color = backgroundColor;
-    document.body.appendChild(div);
-    const cs = getComputedStyle(div);
-    const rgb = cs.color.match(/\d+/g).map(Number);
-    document.body.removeChild(div);
-    [r, g, b] = rgb;
-  }
-  const bgLuminance = luminance(r, g, b);
-  const whiteLuminance = luminance(255, 255, 255);
-  const blackLuminance = luminance(0, 0, 0);
-  const whiteContrast = contrast(bgLuminance, whiteLuminance);
-  const blackContrast = contrast(bgLuminance, blackLuminance);
-  return whiteContrast > blackContrast ? "#ffffff" : "#000000";
-}
-
-/**
- * 根据背景亮度调整文字颜色深浅
- * @param bgR
- * @param bgG
- * @param bgB
- * @returns
- */
-export function adjustTextColor(hexColor) {
-  const [bgR, bgG, bgB] = hexToRGB(hexColor);
-  const bgLuminance = luminance(bgR, bgG, bgB);
-  let textR, textG, textB;
-  const targetContrast = 4.5; // WCAG AA 标准
-
-  if (bgR === 0 && bgG === 0 && bgB === 0) {
-    // 黑色背景
-    let textR = 255,
-      textG = 255,
-      textB = 255;
-    let textLuminance = luminance(textR, textG, textB);
-    let ratio = contrastRatio(bgLuminance, textLuminance);
-    if (ratio < targetContrast) {
-      textR = 230;
-      textG = 230;
-      textB = 230;
-    }
-    return rgbToHex(textR, textG, textB);
-  } else if (bgR === 255 && bgG === 255 && bgB === 255) {
-    // 白色背景
-    let textR = 0,
-      textG = 0,
-      textB = 0;
-    let textLuminance = luminance(textR, textG, textB);
-    let ratio = contrastRatio(bgLuminance, textLuminance);
-    if (ratio < targetContrast) {
-      textR = 20;
-      textG = 20;
-      textB = 20;
-    }
-    return rgbToHex(textR, textG, textB);
-  } else if (isGray(bgR, bgG, bgB)) {
-    // 灰色背景
-    if (bgLuminance < 0.4) {
-      // 深色灰色背景，使用白色文字
-      let textR = 255,
-        textG = 255,
-        textB = 255;
-      let textLuminance = luminance(textR, textG, textB);
-      let ratio = contrastRatio(bgLuminance, textLuminance);
-      if (ratio < targetContrast) {
-        textR = 230;
-        textG = 230;
-        textB = 230;
-      }
-      return rgbToHex(textR, textG, textB);
-    } else {
-      // 浅色灰色背景，使用黑色文字
-      let textR = 0,
-        textG = 0,
-        textB = 0;
-      let textLuminance = luminance(textR, textG, textB);
-      let ratio = contrastRatio(bgLuminance, textLuminance);
-      if (ratio < targetContrast) {
-        textR = 20;
-        textG = 20;
-        textB = 20;
-      }
-      return rgbToHex(textR, textG, textB);
-    }
-  }
-
-  // 非黑白灰背景，使用差值颜色
-  const adjustNum = 150;
-  if (bgLuminance > 0.5) {
-    // 背景较亮，文字颜色调深
-    textR = Math.max(0, bgR - adjustNum);
-    textG = Math.max(0, bgG - adjustNum);
-    textB = Math.max(0, bgB - adjustNum);
-  } else {
-    // 背景较暗，文字颜色调亮
-    textR = Math.min(255, bgR + adjustNum);
-    textG = Math.min(255, bgG + adjustNum);
-    textB = Math.min(255, bgB + adjustNum);
-  }
-  return rgbToHex(textR, textG, textB);
-}
-
-/**
- * 调整颜色深浅
- * @param hexColor
- * @param amount
- * @returns
- */
-export function adjustColor(hexColor, amount) {
-  const [r, g, b] = hexToRGB(hexColor);
-
-  const newR = rgbNumLimit(r + amount);
-  const newG = rgbNumLimit(g + amount);
-  const newB = rgbNumLimit(b + amount);
-
-  return rgbToHex(newR, newG, newB);
-}
+/**
+ * 计算颜色的亮度
+ * @param r
+ * @param g
+ * @param b
+ * @returns
+ */
+export function luminance(r, g, b) {
+  const a = [r, g, b].map((v) => {
+    v /= 255;
+    return v <= 0.03928 ? v / 12.92 : Math.pow((v + 0.055) / 1.055, 2.4);
+  });
+  return a[0] * 0.2126 + a[1] * 0.7152 + a[2] * 0.0722;
+}
+
+/**
+ * 计算两个颜色之间的对比度
+ * @param l1
+ * @param l2
+ * @returns
+ */
+export function contrast(l1, l2) {
+  const brightest = Math.max(l1, l2);
+  const darkest = Math.min(l1, l2);
+  return (brightest + 0.05) / (darkest + 0.05);
+}
+
+/**
+ * 计算对比度
+ * @param luminance1
+ * @param luminance2
+ * @returns
+ */
+export function contrastRatio(luminance1, luminance2) {
+  return (Math.max(luminance1, luminance2) + 0.05) / (Math.min(luminance1, luminance2) + 0.05);
+}
+
+/**
+ * 十六进制颜色转 RGB
+ * @param hex
+ * @returns
+ */
+export function hexToRGB(hex) {
+  hex = hex.replace("#", "");
+  if (hex.length === 3) {
+    hex = hex[0] + hex[0] + hex[1] + hex[1] + hex[2] + hex[2];
+  }
+  const r = parseInt(hex.substring(0, 2), 16);
+  const g = parseInt(hex.substring(2, 4), 16);
+  const b = parseInt(hex.substring(4, 6), 16);
+  return [r, g, b];
+}
+
+/**
+ * rgb 数值限制
+ * @param val
+ * @returns
+ */
+export function rgbNumLimit(val) {
+  if (val > 250) {
+    return 250;
+  }
+  if (val < 0) {
+    return 0;
+  }
+  return val;
+}
+
+/**
+ * RGB 转十六进制颜色
+ * @param r
+ * @param g
+ * @param b
+ * @returns
+ */
+export function rgbToHex(r, g, b) {
+  return (
+    "#" +
+    [r, g, b]
+      .map((x) => {
+        const hex = x.toString(16);
+        return hex.length === 1 ? "0" + hex : hex;
+      })
+      .join("")
+  );
+}
+
+/**
+ *  RGB 转 HSL
+ * @param r
+ * @param g
+ * @param b
+ * @returns
+ */
+export function rgbToHsl(r, g, b) {
+  r /= 255;
+  g /= 255;
+  b /= 255;
+  const max = Math.max(r, g, b);
+  const min = Math.min(r, g, b);
+  let h,
+    s,
+    l = (max + min) / 2;
+
+  if (max === min) {
+    h = s = 0;
+  } else {
+    const 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 * 360, s * 100, l * 100];
+}
+
+/**
+ * HSL 转 RGB
+ * @param h
+ * @param s
+ * @param l
+ * @returns
+ */
+export function hslToRgb(h, s, l) {
+  h /= 360;
+  s /= 100;
+  l /= 100;
+  let r, g, b;
+
+  if (s === 0) {
+    r = g = b = l;
+  } else {
+    const hue2rgb = (p, q, t) => {
+      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;
+    };
+    const q = l < 0.5 ? l * (1 + s) : l + s - l * s;
+    const p = 2 * l - q;
+    r = hue2rgb(p, q, h + 1 / 3);
+    g = hue2rgb(p, q, h);
+    b = hue2rgb(p, q, h - 1 / 3);
+  }
+  return [Math.round(r * 255), Math.round(g * 255), Math.round(b * 255)];
+}
+
+/**
+ * 判断是否为灰色背景
+ * @param r
+ * @param g
+ * @param b
+ * @returns
+ */
+export function isGray(r, g, b, opt = { tolerance: 10 }) {
+  const {
+    /**
+     * 允许的误差范围
+     */
+    tolerance = 10,
+  } = opt || {}; //
+  return Math.abs(r - g) <= tolerance && Math.abs(g - b) <= tolerance && Math.abs(r - b) <= tolerance;
+}
+
+/**
+ *  根据背景颜色选择合适的文本颜色（十六进制格式）
+ * @param backgroundColor
+ * @returns
+ */
+export function getTextColor(backgroundColor) {
+  let [r, g, b] = [0, 0, 0];
+  if (backgroundColor.startsWith("#")) {
+    [r, g, b] = hexToRGB(backgroundColor);
+  } else {
+    const div = document.createElement("div");
+    div.style.color = backgroundColor;
+    document.body.appendChild(div);
+    const cs = getComputedStyle(div);
+    const rgb = cs.color.match(/\d+/g).map(Number);
+    document.body.removeChild(div);
+    [r, g, b] = rgb;
+  }
+  const bgLuminance = luminance(r, g, b);
+  const whiteLuminance = luminance(255, 255, 255);
+  const blackLuminance = luminance(0, 0, 0);
+  const whiteContrast = contrast(bgLuminance, whiteLuminance);
+  const blackContrast = contrast(bgLuminance, blackLuminance);
+  return whiteContrast > blackContrast ? "#ffffff" : "#000000";
+}
+
+/**
+ * 根据背景亮度调整文字颜色深浅
+ * @param bgR
+ * @param bgG
+ * @param bgB
+ * @returns
+ */
+export function adjustTextColor(hexColor) {
+  const [bgR, bgG, bgB] = hexToRGB(hexColor);
+  const bgLuminance = luminance(bgR, bgG, bgB);
+  let textR, textG, textB;
+  const targetContrast = 4.5; // WCAG AA 标准
+
+  if (bgR === 0 && bgG === 0 && bgB === 0) {
+    // 黑色背景
+    let textR = 255,
+      textG = 255,
+      textB = 255;
+    let textLuminance = luminance(textR, textG, textB);
+    let ratio = contrastRatio(bgLuminance, textLuminance);
+    if (ratio < targetContrast) {
+      textR = 230;
+      textG = 230;
+      textB = 230;
+    }
+    return rgbToHex(textR, textG, textB);
+  } else if (bgR === 255 && bgG === 255 && bgB === 255) {
+    // 白色背景
+    let textR = 0,
+      textG = 0,
+      textB = 0;
+    let textLuminance = luminance(textR, textG, textB);
+    let ratio = contrastRatio(bgLuminance, textLuminance);
+    if (ratio < targetContrast) {
+      textR = 20;
+      textG = 20;
+      textB = 20;
+    }
+    return rgbToHex(textR, textG, textB);
+  } else if (isGray(bgR, bgG, bgB)) {
+    // 灰色背景
+    if (bgLuminance < 0.4) {
+      // 深色灰色背景，使用白色文字
+      let textR = 255,
+        textG = 255,
+        textB = 255;
+      let textLuminance = luminance(textR, textG, textB);
+      let ratio = contrastRatio(bgLuminance, textLuminance);
+      if (ratio < targetContrast) {
+        textR = 230;
+        textG = 230;
+        textB = 230;
+      }
+      return rgbToHex(textR, textG, textB);
+    } else {
+      // 浅色灰色背景，使用黑色文字
+      let textR = 0,
+        textG = 0,
+        textB = 0;
+      let textLuminance = luminance(textR, textG, textB);
+      let ratio = contrastRatio(bgLuminance, textLuminance);
+      if (ratio < targetContrast) {
+        textR = 20;
+        textG = 20;
+        textB = 20;
+      }
+      return rgbToHex(textR, textG, textB);
+    }
+  }
+
+  // 非黑白灰背景，使用差值颜色
+  const adjustNum = 150;
+  if (bgLuminance > 0.5) {
+    // 背景较亮，文字颜色调深
+    textR = Math.max(0, bgR - adjustNum);
+    textG = Math.max(0, bgG - adjustNum);
+    textB = Math.max(0, bgB - adjustNum);
+  } else {
+    // 背景较暗，文字颜色调亮
+    textR = Math.min(255, bgR + adjustNum);
+    textG = Math.min(255, bgG + adjustNum);
+    textB = Math.min(255, bgB + adjustNum);
+  }
+  return rgbToHex(textR, textG, textB);
+}
+
+/**
+ * 调整颜色深浅
+ * @param hexColor
+ * @param amount
+ * @returns
+ */
+export function adjustColor(hexColor, amount) {
+  const [r, g, b] = hexToRGB(hexColor);
+
+  const newR = rgbNumLimit(r + amount);
+  const newG = rgbNumLimit(g + amount);
+  const newB = rgbNumLimit(b + amount);
+
+  return rgbToHex(newR, newG, newB);
+}

package/src/empty-val.ts

@@ -1,40 +1,40 @@
-export interface ICheckEmptyOpt {
-  /** 【废弃】空值占位符 */
-  emptyStr?: string;
-  /** 空值占位符 */
-  emptySymbol?: string;
-  checkEmptyArr?: boolean;
-}
-export interface IHandleEmptyValOpt extends ICheckEmptyOpt {}
-
-/**
- * 空数据判断
- * @param {*} val
- * @param {*} opt
- * @returns
- */
-export function checkEmpty(val, opt: ICheckEmptyOpt = {}) {
-  const { checkEmptyArr = true } = opt || {};
-  if (val === "" || val === null || val === undefined) {
-    return true;
-  }
-  if (checkEmptyArr && Array.isArray(val) && Array.length === 0) {
-    return true;
-  }
-  return false;
-}
-
-/**
- * 处理空数据显示占位符
- * @param val
- * @param opt
- * @returns
- */
-export const handleEmptyVal = (val, opt: IHandleEmptyValOpt = {}) => {
-  const { emptyStr = "--" } = opt || {};
-  const emptySymbol = opt?.emptySymbol ?? emptyStr;
-  if (checkEmpty(val, opt)) {
-    return emptySymbol;
-  }
-  return val;
-};
+export interface ICheckEmptyOpt {
+  /** 【废弃】空值占位符 */
+  emptyStr?: string;
+  /** 空值占位符 */
+  emptySymbol?: string;
+  checkEmptyArr?: boolean;
+}
+export interface IHandleEmptyValOpt extends ICheckEmptyOpt {}
+
+/**
+ * 空数据判断
+ * @param {*} val
+ * @param {*} opt
+ * @returns
+ */
+export function checkEmpty(val, opt: ICheckEmptyOpt = {}) {
+  const { checkEmptyArr = true } = opt || {};
+  if (val === "" || val === null || val === undefined) {
+    return true;
+  }
+  if (checkEmptyArr && Array.isArray(val) && Array.length === 0) {
+    return true;
+  }
+  return false;
+}
+
+/**
+ * 处理空数据显示占位符
+ * @param val
+ * @param opt
+ * @returns
+ */
+export const handleEmptyVal = (val, opt: IHandleEmptyValOpt = {}) => {
+  const { emptyStr = "--" } = opt || {};
+  const emptySymbol = opt?.emptySymbol ?? emptyStr;
+  if (checkEmpty(val, opt)) {
+    return emptySymbol;
+  }
+  return val;
+};