@yamada-ui/utils - npm Package Compare versions

Comparing version 0.0.0-dev-20230920110346 to 0.0.0-dev-20231009175554

dist/color.d.ts

 import { Dict } from './index.types.js';
 
+declare const hues: readonly [50, 100, 200, 300, 400, 500, 600, 700, 800, 900, 950];
 declare const isGray: (colorScheme: string) => boolean;
-declare const getColor: (color: string, fallback?: string) => (theme: Dict, colorMode?: 'light' | 'dark') => string;
+declare const getColor: (color: string, fallback?: string) => (theme?: Dict, colorMode?: 'light' | 'dark') => string;
 declare const lightenColor: (color: string, amount: number) => (theme?: Dict, colorMode?: 'light' | 'dark') => string;
@@ -10,3 +11,3 @@ declare const darkenColor: (color: string, amount: number) => (theme?: Dict, colorMode?: 'light' | 'dark') => string;
 declare const transparentizeColor: (color: string, alpha: number) => (theme?: Dict, colorMode?: 'light' | 'dark') => string;
-declare const toneColor: (color: string, l: number) => (theme?: Dict, colorMode?: 'light' | 'dark') => string;
+declare const toneColor: (color: string, hue: (typeof hues)[number]) => (theme?: Dict, colorMode?: 'light' | 'dark') => string;
 declare const randomColor: ({ string, colors, }?: {
@@ -20,2 +21,2 @@ string?: string | undefined;
 
-export { darkenColor, getColor, isDark, isGray, isLight, isTone, lightenColor, randomColor, shadeColor, tintColor, toneColor, transparentizeColor };
+export { darkenColor, getColor, hues, isDark, isGray, isLight, isTone, lightenColor, randomColor, shadeColor, tintColor, toneColor, transparentizeColor };

dist/color.js

@@ -25,2 +25,3 @@ "use strict";
   getColor: () => getColor,
+  hues: () => hues,
   isDark: () => isDark,
@@ -73,9 +74,28 @@ isGray: () => isGray,
 // src/color.ts
+var hues = [
+  50,
+  100,
+  200,
+  300,
+  400,
+  500,
+  600,
+  700,
+  800,
+  900,
+  950
+];
 var isGray = (colorScheme) => colorScheme === "gray" || colorScheme === "zinc" || colorScheme === "neutral" || colorScheme === "stone";
-var getColor = (color, fallback) => (theme, colorMode) => {
+var getColor = (color, fallback) => (theme = {}, colorMode) => {
+  var _a, _b, _c;
+  const [token, hue] = color.split(".");
+  const [, relatedToken] = (_c = Object.entries((_b = (_a = theme.semantics) == null ? void 0 : _a.colorSchemes) != null ? _b : {}).find(
+    ([semanticToken]) => token === semanticToken
+  )) != null ? _c : [];
+  if (relatedToken)
+    color = `${relatedToken}.${hue}`;
   const hex = getMemoizedObject(theme, `colors.${color}`, color);
   try {
     if (isArray(hex)) {
-      const [lightHex, darkHex] = hex;
-      return (0, import_color2k.toHex)(String(colorMode !== "dark" ? lightHex : darkHex));
+      return (0, import_color2k.toHex)(String(colorMode !== "dark" ? hex[0] : hex[1]));
     } else {
@@ -89,26 +109,26 @@ return (0, import_color2k.toHex)(String(hex));
 var lightenColor = (color, amount) => (theme, colorMode) => {
-  const raw = theme ? getColor(color)(theme, colorMode) : color;
+  const raw = getColor(color, color)(theme, colorMode);
   return (0, import_color2k.toHex)((0, import_color2k.lighten)(raw, amount / 100));
 };
 var darkenColor = (color, amount) => (theme, colorMode) => {
-  const raw = theme ? getColor(color)(theme, colorMode) : color;
+  const raw = getColor(color, color)(theme, colorMode);
   return (0, import_color2k.toHex)((0, import_color2k.darken)(raw, amount / 100));
 };
 var tintColor = (color, amount) => (theme, colorMode) => {
-  const raw = theme ? getColor(color)(theme, colorMode) : color;
+  const raw = getColor(color, color)(theme, colorMode);
   return (0, import_color2k.toHex)((0, import_color2k.mix)(raw, "#fff", amount));
 };
 var shadeColor = (color, amount) => (theme, colorMode) => {
-  const raw = theme ? getColor(color)(theme, colorMode) : color;
+  const raw = getColor(color, color)(theme, colorMode);
   return (0, import_color2k.toHex)((0, import_color2k.mix)(raw, "#000", amount / 100));
 };
 var transparentizeColor = (color, alpha) => (theme, colorMode) => {
-  const raw = theme ? getColor(color)(theme, colorMode) : color;
+  const raw = getColor(color, color)(theme, colorMode);
   return (0, import_color2k.transparentize)(raw, 1 - alpha);
 };
-var toneColor = (color, l) => (theme, colorMode) => {
-  const raw = theme ? getColor(color)(theme, colorMode) : color;
-  if (l < 0 || 900 < l)
+var toneColor = (color, hue) => (theme, colorMode) => {
+  const raw = getColor(color, color)(theme, colorMode);
+  if (hue < 50 || 950 < hue)
     return color;
-  let n = (l - 500) / 10;
+  let n = (hue - 500) / 10;
   const isLighten = n <= 0;
@@ -178,2 +198,3 @@ if (isLighten)
   getColor,
+  hues,
   isDark,
@@ -180,0 +201,0 @@ isGray,

dist/index.d.ts

@@ -1,2 +0,2 @@
-export { Dict, DynamicRecord, Length, Path, StringLiteral, Union } from './index.types.js';
+export { Dict, Length, Path, StringLiteral, Union } from './index.types.js';
 export { cast, isArray, isEmpty, isFunction, isNotNumber, isNull, isNumber, isNumeric, isObject, isString, isUndefined, isUnit } from './assertion.js';
@@ -9,3 +9,3 @@ export { assignAfter, filterObject, filterUndefined, flattenObject, getMemoizedObject, getObject, keysFormObject, memoizeObject, merge, objectFromEntries, omitObject, pickObject, replaceObject, splitObject } from './object.js';
 export { Operand, calc } from './calc.js';
-export { darkenColor, getColor, isDark, isGray, isLight, isTone, lightenColor, randomColor, shadeColor, tintColor, toneColor, transparentizeColor } from './color.js';
+export { darkenColor, getColor, hues, isDark, isGray, isLight, isTone, lightenColor, randomColor, shadeColor, tintColor, toneColor, transparentizeColor } from './color.js';
 export { filterEmpty } from './array.js';
@@ -12,0 +12,0 @@ export { clampNumber, countDecimal, percentToValue, roundNumberToStep, toPrecision, valueToPercent } from './number.js';

dist/index.js

@@ -69,2 +69,3 @@ "use strict";
   hasTabIndex: () => hasTabIndex,
+  hues: () => hues,
   includesChildren: () => includesChildren,
@@ -587,9 +588,28 @@ isActiveElement: () => isActiveElement,
 var import_color2k = require("color2k");
+var hues = [
+  50,
+  100,
+  200,
+  300,
+  400,
+  500,
+  600,
+  700,
+  800,
+  900,
+  950
+];
 var isGray = (colorScheme) => colorScheme === "gray" || colorScheme === "zinc" || colorScheme === "neutral" || colorScheme === "stone";
-var getColor = (color, fallback) => (theme, colorMode) => {
+var getColor = (color, fallback) => (theme = {}, colorMode) => {
+  var _a, _b, _c;
+  const [token, hue] = color.split(".");
+  const [, relatedToken] = (_c = Object.entries((_b = (_a = theme.semantics) == null ? void 0 : _a.colorSchemes) != null ? _b : {}).find(
+    ([semanticToken]) => token === semanticToken
+  )) != null ? _c : [];
+  if (relatedToken)
+    color = `${relatedToken}.${hue}`;
   const hex = getMemoizedObject(theme, `colors.${color}`, color);
   try {
     if (isArray(hex)) {
-      const [lightHex, darkHex] = hex;
-      return (0, import_color2k.toHex)(String(colorMode !== "dark" ? lightHex : darkHex));
+      return (0, import_color2k.toHex)(String(colorMode !== "dark" ? hex[0] : hex[1]));
     } else {
@@ -603,26 +623,26 @@ return (0, import_color2k.toHex)(String(hex));
 var lightenColor = (color, amount) => (theme, colorMode) => {
-  const raw = theme ? getColor(color)(theme, colorMode) : color;
+  const raw = getColor(color, color)(theme, colorMode);
   return (0, import_color2k.toHex)((0, import_color2k.lighten)(raw, amount / 100));
 };
 var darkenColor = (color, amount) => (theme, colorMode) => {
-  const raw = theme ? getColor(color)(theme, colorMode) : color;
+  const raw = getColor(color, color)(theme, colorMode);
   return (0, import_color2k.toHex)((0, import_color2k.darken)(raw, amount / 100));
 };
 var tintColor = (color, amount) => (theme, colorMode) => {
-  const raw = theme ? getColor(color)(theme, colorMode) : color;
+  const raw = getColor(color, color)(theme, colorMode);
   return (0, import_color2k.toHex)((0, import_color2k.mix)(raw, "#fff", amount));
 };
 var shadeColor = (color, amount) => (theme, colorMode) => {
-  const raw = theme ? getColor(color)(theme, colorMode) : color;
+  const raw = getColor(color, color)(theme, colorMode);
   return (0, import_color2k.toHex)((0, import_color2k.mix)(raw, "#000", amount / 100));
 };
 var transparentizeColor = (color, alpha) => (theme, colorMode) => {
-  const raw = theme ? getColor(color)(theme, colorMode) : color;
+  const raw = getColor(color, color)(theme, colorMode);
   return (0, import_color2k.transparentize)(raw, 1 - alpha);
 };
-var toneColor = (color, l) => (theme, colorMode) => {
-  const raw = theme ? getColor(color)(theme, colorMode) : color;
-  if (l < 0 || 900 < l)
+var toneColor = (color, hue) => (theme, colorMode) => {
+  const raw = getColor(color, color)(theme, colorMode);
+  if (hue < 50 || 950 < hue)
     return color;
-  let n = (l - 500) / 10;
+  let n = (hue - 500) / 10;
   const isLighten = n <= 0;
@@ -800,2 +820,3 @@ if (isLighten)
   hasTabIndex,
+  hues,
   includesChildren,
@@ -802,0 +823,0 @@ isActiveElement,

dist/index.types.d.ts

@@ -10,6 +10,3 @@ type Primitive = null | undefined | string | number | boolean | symbol | bigint;
 type Length = string | 0 | number;
-type DynamicRecord<T> = {
-    [K in keyof T]-?: T[K] extends Primitive ? string | number : DynamicRecord<T[K]>;
-};
 
-export { Dict, DynamicRecord, Length, Path, StringLiteral, Union };
+export { Dict, Length, Path, StringLiteral, Union };

package.json

 {
   "name": "@yamada-ui/utils",
-  "version": "0.0.0-dev-20230920110346",
+  "version": "0.0.0-dev-20231009175554",
   "description": "Yamada UI utils",
@@ -5,0 +5,0 @@ "keywords": [

No alert changes

Improved metrics

Total package byte prevSize

137047

0.77%

Lines of code

3598

1.81%

No dependency changes