@yamada-ui/utils 0.1.0 → 0.1.2

package/dist/assertion.d.ts

@@ -6,7 +6,7 @@ declare const isNumeric: (value: any) => boolean;
 declare const isString: (value: any) => value is string;
 declare const isUndefined: (value: any) => value is undefined;
 declare const isNull: (value: any) => value is null;
-declare const isObject: <T extends Dict<any>>(value: any) => value is T;
+declare const isObject: <T extends Dict>(value: any) => value is T;
 declare const isArray: <T extends any[]>(value: any) => value is T;
 declare const isEmpty: (value: any) => boolean;
 declare const isFunction: <T extends Function = Function>(value: any) => value is T;

package/dist/{chunk-A6J4FUU7.mjs → chunk-VPOQGCMS.mjs}

@@ -118,47 +118,87 @@ var useUpdateEffect = (callback, deps) => {
     };
   }, []);
 };
+var useAsync = (func, deps = []) => {
+  const [state, callback] = useAsyncFunc(func, deps, { loading: true });
+  React.useEffect(() => {
+    callback();
+  }, [callback]);
+  return state;
+};
+var useAsyncFunc = (func, deps = [], initialState = { loading: false }) => {
+  const lastCallId = React.useRef(0);
+  const isMounted = useIsMounted();
+  const [state, setState] = React.useState(initialState);
+  const callback = React.useCallback((...args) => {
+    const callId = ++lastCallId.current;
+    if (!state.loading) {
+      setState((prevState) => ({ ...prevState, loading: true }));
+    }
+    return func(...args).then(
+      (value) => {
+        if (isMounted.current && callId === lastCallId.current)
+          setState({ value, loading: false });
+        return value;
+      },
+      (error) => {
+        if (isMounted.current && callId === lastCallId.current)
+          setState({ error, loading: false });
+        return error;
+      }
+    );
+  }, deps);
+  return [state, callback];
+};
+var useAsyncRetry = (func, deps = []) => {
+  const [attempt, setAttempt] = React.useState(0);
+  const state = useAsync(func, [...deps, attempt]);
+  const stateLoading = state.loading;
+  const retry = React.useCallback(() => {
+    if (stateLoading)
+      return;
+    setAttempt((currentAttempt) => currentAttempt + 1);
+  }, [...deps, stateLoading]);
+  return { ...state, retry };
+};
 
 // src/color.ts
-import { TinyColor } from "@ctrl/tinycolor";
+import { toHex, parseToRgba, transparentize, mix, darken, lighten } from "color2k";
 var getColor = (color, fallback) => (theme, colorMode) => {
   const hex = getMemoizedObject(
     theme,
     `colors.${color}`,
     color
   );
-  if (isArray(hex)) {
-    const [lightHex, darkHex] = hex;
-    const { isValid, originalInput } = new TinyColor(colorMode !== "dark" ? lightHex : darkHex);
-    return isValid ? originalInput : fallback;
-  } else {
-    const { isValid, originalInput } = new TinyColor(hex);
-    return isValid ? originalInput : fallback;
+  try {
+    if (isArray(hex)) {
+      const [lightHex, darkHex] = hex;
+      return toHex(String(colorMode !== "dark" ? lightHex : darkHex));
+    } else {
+      return toHex(String(hex));
+    }
+  } catch {
+    return fallback != null ? fallback : "#000000";
   }
 };
 var lightenColor = (color, amount) => (theme, colorMode) => {
   const raw = getColor(color)(theme, colorMode);
-  return new TinyColor(raw).lighten(amount).toRgbString();
+  return toHex(lighten(raw, amount / 100));
 };
 var darkenColor = (color, amount) => (theme, colorMode) => {
   const raw = getColor(color)(theme, colorMode);
-  return new TinyColor(raw).darken(amount).toRgbString();
-};
-var brightenColor = (color, amount) => (theme, colorMode) => {
-  const raw = getColor(color)(theme, colorMode);
-  return new TinyColor(raw).brighten(amount).toRgbString();
+  return toHex(darken(raw, amount / 100));
 };
 var tintColor = (color, amount) => (theme, colorMode) => {
   const raw = getColor(color)(theme, colorMode);
-  return new TinyColor(raw).tint(amount).toRgbString();
+  return toHex(mix(raw, "#fff", amount));
 };
 var shadeColor = (color, amount) => (theme, colorMode) => {
   const raw = getColor(color)(theme, colorMode);
-  return new TinyColor(raw).shade(amount).toRgbString();
+  return toHex(mix(raw, "#000", amount / 100));
 };
 var transparentizeColor = (color, alpha) => (theme, colorMode) => {
   const raw = getColor(color)(theme, colorMode);
-  return new TinyColor(raw).setAlpha(alpha).toRgbString();
+  return transparentize(raw, 1 - alpha);
 };
 var toneColor = (color, l) => (theme, colorMode) => {
   const raw = getColor(color)(theme, colorMode);
@@ -170,7 +210,7 @@ var toneColor = (color, l) => (theme, colorMode) => {
     n *= -1;
   if (n !== 0)
     n = n - 5 * (isLighten ? 1 : -1);
-  return new TinyColor(raw)[isLighten ? "lighten" : "shade"](n).toString();
+  return toHex(isLighten ? lighten(raw, n / 100) : mix(raw, "#000", n / 100));
 };
 var randomColor = ({ string, colors } = {}) => {
   const fallback = randomHex();
@@ -210,14 +250,18 @@ var randomColorFromList = (str, list) => {
   return list[index];
 };
 var randomFromList = (list) => list[Math.floor(Math.random() * list.length)];
-var isLight = (color) => (theme, colorMode) => {
-  const raw = getColor(color)(theme, colorMode);
-  return new TinyColor(raw).isLight();
+var getBrightness = (color) => {
+  const [r, g, b] = parseToRgba(color);
+  return (r * 299 + g * 587 + b * 114) / 1e3;
 };
-var isDark = (color) => (theme, colorMode) => {
+var isTone = (color) => (theme, colorMode) => {
   const raw = getColor(color)(theme, colorMode);
-  return new TinyColor(raw).isDark();
+  const brightness = getBrightness(raw);
+  const isDark2 = brightness < 128;
+  return isDark2 ? "dark" : "light";
 };
+var isLight = (color) => (theme, colorMode) => isTone(color)(theme, colorMode) === "dark";
+var isDark = (color) => (theme, colorMode) => isTone(color)(theme, colorMode) === "light";
 
 // src/object.ts
 var omitObject = (obj, keys) => {
@@ -387,15 +431,18 @@ export {
   useMergeRefs,
   useCallbackRef,
   useUpdateEffect,
+  useAsync,
+  useAsyncFunc,
+  useAsyncRetry,
   getColor,
   lightenColor,
   darkenColor,
-  brightenColor,
   tintColor,
   shadeColor,
   transparentizeColor,
   toneColor,
   randomColor,
+  isTone,
   isLight,
   isDark
 };

package/dist/color.d.ts

@@ -1,10 +1,8 @@
-import * as _ctrl_tinycolor from '@ctrl/tinycolor';
 import { Dict } from './index.types.js';
 
-declare const getColor: (color: string, fallback?: string) => (theme: Dict, colorMode: 'light' | 'dark' | undefined) => string | number | _ctrl_tinycolor.RGB | _ctrl_tinycolor.HSL | _ctrl_tinycolor.HSV | undefined;
+declare const getColor: (color: string, fallback?: string) => (theme: Dict, colorMode: 'light' | 'dark' | undefined) => string;
 declare const lightenColor: (color: string, amount: number) => (theme: Dict, colorMode: 'light' | 'dark' | undefined) => string;
 declare const darkenColor: (color: string, amount: number) => (theme: Dict, colorMode: 'light' | 'dark' | undefined) => string;
-declare const brightenColor: (color: string, amount: number) => (theme: Dict, colorMode: 'light' | 'dark' | undefined) => string;
 declare const tintColor: (color: string, amount: number) => (theme: Dict, colorMode: 'light' | 'dark' | undefined) => string;
 declare const shadeColor: (color: string, amount: number) => (theme: Dict, colorMode: 'light' | 'dark' | undefined) => string;
 declare const transparentizeColor: (color: string, alpha: number) => (theme: Dict, colorMode: 'light' | 'dark' | undefined) => string;
@@ -13,7 +11,8 @@ declare const randomColor: ({ string, colors }?: {
     string?: string | undefined;
     colors?: string[] | undefined;
 }) => string;
+declare const isTone: (color: string) => (theme: Dict, colorMode: 'light' | 'dark' | undefined) => "light" | "dark";
 declare const isLight: (color: string) => (theme: Dict, colorMode: 'light' | 'dark' | undefined) => boolean;
 declare const isDark: (color: string) => (theme: Dict, colorMode: 'light' | 'dark' | undefined) => boolean;
 
-export { brightenColor, darkenColor, getColor, isDark, isLight, lightenColor, randomColor, shadeColor, tintColor, toneColor, transparentizeColor };
+export { darkenColor, getColor, isDark, isLight, isTone, lightenColor, randomColor, shadeColor, tintColor, toneColor, transparentizeColor };

package/dist/color.js

@@ -20,11 +20,11 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/color.ts
 var color_exports = {};
 __export(color_exports, {
-  brightenColor: () => brightenColor,
   darkenColor: () => darkenColor,
   getColor: () => getColor,
   isDark: () => isDark,
   isLight: () => isLight,
+  isTone: () => isTone,
   lightenColor: () => lightenColor,
   randomColor: () => randomColor,
   shadeColor: () => shadeColor,
@@ -33,7 +33,7 @@ __export(color_exports, {
   transparentizeColor: () => transparentizeColor
 });
 module.exports = __toCommonJS(color_exports);
-var import_tinycolor = require("@ctrl/tinycolor");
+var import_color2k = require("color2k");
 
 // src/assertion.ts
 var isArray = (value) => Array.isArray(value);
@@ -74,38 +74,36 @@ var getColor = (color, fallback) => (theme, colorMode) => {
     `colors.${color}`,
     color
   );
-  if (isArray(hex)) {
-    const [lightHex, darkHex] = hex;
-    const { isValid, originalInput } = new import_tinycolor.TinyColor(colorMode !== "dark" ? lightHex : darkHex);
-    return isValid ? originalInput : fallback;
-  } else {
-    const { isValid, originalInput } = new import_tinycolor.TinyColor(hex);
-    return isValid ? originalInput : fallback;
+  try {
+    if (isArray(hex)) {
+      const [lightHex, darkHex] = hex;
+      return (0, import_color2k.toHex)(String(colorMode !== "dark" ? lightHex : darkHex));
+    } else {
+      return (0, import_color2k.toHex)(String(hex));
+    }
+  } catch {
+    return fallback != null ? fallback : "#000000";
   }
 };
 var lightenColor = (color, amount) => (theme, colorMode) => {
   const raw = getColor(color)(theme, colorMode);
-  return new import_tinycolor.TinyColor(raw).lighten(amount).toRgbString();
+  return (0, import_color2k.toHex)((0, import_color2k.lighten)(raw, amount / 100));
 };
 var darkenColor = (color, amount) => (theme, colorMode) => {
   const raw = getColor(color)(theme, colorMode);
-  return new import_tinycolor.TinyColor(raw).darken(amount).toRgbString();
-};
-var brightenColor = (color, amount) => (theme, colorMode) => {
-  const raw = getColor(color)(theme, colorMode);
-  return new import_tinycolor.TinyColor(raw).brighten(amount).toRgbString();
+  return (0, import_color2k.toHex)((0, import_color2k.darken)(raw, amount / 100));
 };
 var tintColor = (color, amount) => (theme, colorMode) => {
   const raw = getColor(color)(theme, colorMode);
-  return new import_tinycolor.TinyColor(raw).tint(amount).toRgbString();
+  return (0, import_color2k.toHex)((0, import_color2k.mix)(raw, "#fff", amount));
 };
 var shadeColor = (color, amount) => (theme, colorMode) => {
   const raw = getColor(color)(theme, colorMode);
-  return new import_tinycolor.TinyColor(raw).shade(amount).toRgbString();
+  return (0, import_color2k.toHex)((0, import_color2k.mix)(raw, "#000", amount / 100));
 };
 var transparentizeColor = (color, alpha) => (theme, colorMode) => {
   const raw = getColor(color)(theme, colorMode);
-  return new import_tinycolor.TinyColor(raw).setAlpha(alpha).toRgbString();
+  return (0, import_color2k.transparentize)(raw, 1 - alpha);
 };
 var toneColor = (color, l) => (theme, colorMode) => {
   const raw = getColor(color)(theme, colorMode);
@@ -117,7 +115,7 @@ var toneColor = (color, l) => (theme, colorMode) => {
     n *= -1;
   if (n !== 0)
     n = n - 5 * (isLighten ? 1 : -1);
-  return new import_tinycolor.TinyColor(raw)[isLighten ? "lighten" : "shade"](n).toString();
+  return (0, import_color2k.toHex)(isLighten ? (0, import_color2k.lighten)(raw, n / 100) : (0, import_color2k.mix)(raw, "#000", n / 100));
 };
 var randomColor = ({ string, colors } = {}) => {
   const fallback = randomHex();
@@ -157,21 +155,25 @@ var randomColorFromList = (str, list) => {
   return list[index];
 };
 var randomFromList = (list) => list[Math.floor(Math.random() * list.length)];
-var isLight = (color) => (theme, colorMode) => {
-  const raw = getColor(color)(theme, colorMode);
-  return new import_tinycolor.TinyColor(raw).isLight();
+var getBrightness = (color) => {
+  const [r, g, b] = (0, import_color2k.parseToRgba)(color);
+  return (r * 299 + g * 587 + b * 114) / 1e3;
 };
-var isDark = (color) => (theme, colorMode) => {
+var isTone = (color) => (theme, colorMode) => {
   const raw = getColor(color)(theme, colorMode);
-  return new import_tinycolor.TinyColor(raw).isDark();
+  const brightness = getBrightness(raw);
+  const isDark2 = brightness < 128;
+  return isDark2 ? "dark" : "light";
 };
+var isLight = (color) => (theme, colorMode) => isTone(color)(theme, colorMode) === "dark";
+var isDark = (color) => (theme, colorMode) => isTone(color)(theme, colorMode) === "light";
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
-  brightenColor,
   darkenColor,
   getColor,
   isDark,
   isLight,
+  isTone,
   lightenColor,
   randomColor,
   shadeColor,

package/dist/color.mjs

@@ -1,16 +1,16 @@
 import {
-  brightenColor,
   darkenColor,
   getColor,
   isDark,
   isLight,
+  isTone,
   lightenColor,
   randomColor,
   shadeColor,
   tintColor,
   toneColor,
   transparentizeColor
-} from "./chunk-A6J4FUU7.mjs";
+} from "./chunk-VPOQGCMS.mjs";
 import "./chunk-SLJ4M7XC.mjs";
 import "./chunk-VYMGBE25.mjs";
 import "./chunk-BZAW2D6U.mjs";
@@ -20,11 +20,11 @@ import "./chunk-R5OUKGQ5.mjs";
 import "./chunk-FW7XS4NH.mjs";
 import "./chunk-PF7LRFIA.mjs";
 export {
-  brightenColor,
   darkenColor,
   getColor,
   isDark,
   isLight,
+  isTone,
   lightenColor,
   randomColor,
   shadeColor,

package/dist/function.mjs

@@ -3,7 +3,7 @@ import {
   handlerAll,
   noop,
   runIfFunc
-} from "./chunk-A6J4FUU7.mjs";
+} from "./chunk-VPOQGCMS.mjs";
 import "./chunk-SLJ4M7XC.mjs";
 import "./chunk-VYMGBE25.mjs";
 import "./chunk-BZAW2D6U.mjs";

package/dist/index.d.ts

@@ -2,13 +2,12 @@ export { Dict, DynamicRecord, Length, Path, StringLiteral, Union } from './index
 export { cast, isArray, isEmpty, isFunction, isNotNumber, isNull, isNumber, isNumeric, isObject, isString, isUndefined, isUnit } from './assertion.js';
 export { assignAfter, filterObject, filterUndefined, flattenObject, getMemoizedObject, getObject, keysFormObject, memoizeObject, merge, objectFromEntries, omitObject, pickObject, replaceObject, splitObject } from './object.js';
 export { funcAll, handlerAll, noop, runIfFunc } from './function.js';
-export { DOMAttributes, MaybeRenderProp, PropGetter, RequiredPropGetter, assignRef, createContext, cx, findChildren, getValidChildren, includesChildren, isRefObject, isValidElement, mergeRefs, omitChildren, pickChildren, useCallbackRef, useIsMounted, useMergeRefs, useSafeLayoutEffect, useUnmountEffect, useUpdateEffect } from './react.js';
+export { AsyncFnReturn, AsyncState, AsyncStateRetry, DOMAttributes, FunctionReturningPromise, MaybeRenderProp, PromiseType, PropGetter, RequiredPropGetter, assignRef, createContext, cx, findChildren, getValidChildren, includesChildren, isRefObject, isValidElement, mergeRefs, omitChildren, pickChildren, useAsync, useAsyncFunc, useAsyncRetry, useCallbackRef, useIsMounted, useMergeRefs, useSafeLayoutEffect, useUnmountEffect, useUpdateEffect } from './react.js';
 export { FocusableElement, ariaAttr, createdDom, dataAttr, getActiveElement, getAllFocusable, getEventRelatedTarget, getOwnerDocument, getOwnerWindow, getPlatform, hasNegativeTabIndex, hasTabIndex, isActiveElement, isApple, isContains, isContentEditable, isDisabled, isElement, isFocusable, isHTMLElement, isHidden, isMac, isSafari, isTabbable, platform, vendor } from './dom.js';
 export { escape } from './string.js';
 export { Operand, calc } from './calc.js';
-export { brightenColor, darkenColor, getColor, isDark, isLight, lightenColor, randomColor, shadeColor, tintColor, toneColor, transparentizeColor } from './color.js';
+export { darkenColor, getColor, isDark, isLight, isTone, lightenColor, randomColor, shadeColor, tintColor, toneColor, transparentizeColor } from './color.js';
 export { filterEmpty } from './array.js';
 export { clampNumber, countDecimal, percentToValue, roundNumberToStep, toPrecision, valueToPercent } from './number.js';
 export { AnyPointerEvent, MixedEventListener, Point, PointType, PointerEventInfo, addDomEvent, addPointerEvent, getEventPoint, getEventWindow, isMouseEvent, isMultiTouchEvent, isTouchEvent, pointFromMouse, pointFromTouch } from './event.js';
 import 'react';
-import '@ctrl/tinycolor';

package/dist/index.js

@@ -35,7 +35,6 @@ __export(src_exports, {
   ariaAttr: () => ariaAttr,
   assignAfter: () => assignAfter,
   assignRef: () => assignRef,
-  brightenColor: () => brightenColor,
   calc: () => calc,
   cast: () => cast,
   clampNumber: () => clampNumber,
@@ -94,6 +93,7 @@ __export(src_exports, {
   isSafari: () => isSafari,
   isString: () => isString,
   isTabbable: () => isTabbable,
+  isTone: () => isTone,
   isTouchEvent: () => isTouchEvent,
   isUndefined: () => isUndefined,
   isUnit: () => isUnit,
@@ -123,6 +123,9 @@ __export(src_exports, {
   toPrecision: () => toPrecision,
   toneColor: () => toneColor,
   transparentizeColor: () => transparentizeColor,
+  useAsync: () => useAsync,
+  useAsyncFunc: () => useAsyncFunc,
+  useAsyncRetry: () => useAsyncRetry,
   useCallbackRef: () => useCallbackRef,
   useIsMounted: () => useIsMounted,
   useMergeRefs: () => useMergeRefs,
@@ -392,6 +395,48 @@ var useUpdateEffect = (callback, deps) => {
     };
   }, []);
 };
+var useAsync = (func, deps = []) => {
+  const [state, callback] = useAsyncFunc(func, deps, { loading: true });
+  React.useEffect(() => {
+    callback();
+  }, [callback]);
+  return state;
+};
+var useAsyncFunc = (func, deps = [], initialState = { loading: false }) => {
+  const lastCallId = React.useRef(0);
+  const isMounted = useIsMounted();
+  const [state, setState] = React.useState(initialState);
+  const callback = React.useCallback((...args) => {
+    const callId = ++lastCallId.current;
+    if (!state.loading) {
+      setState((prevState) => ({ ...prevState, loading: true }));
+    }
+    return func(...args).then(
+      (value) => {
+        if (isMounted.current && callId === lastCallId.current)
+          setState({ value, loading: false });
+        return value;
+      },
+      (error) => {
+        if (isMounted.current && callId === lastCallId.current)
+          setState({ error, loading: false });
+        return error;
+      }
+    );
+  }, deps);
+  return [state, callback];
+};
+var useAsyncRetry = (func, deps = []) => {
+  const [attempt, setAttempt] = React.useState(0);
+  const state = useAsync(func, [...deps, attempt]);
+  const stateLoading = state.loading;
+  const retry = React.useCallback(() => {
+    if (stateLoading)
+      return;
+    setAttempt((currentAttempt) => currentAttempt + 1);
+  }, [...deps, stateLoading]);
+  return { ...state, retry };
+};
 
 // src/dom.ts
 var createdDom = () => !!(typeof window !== "undefined" && window.document && window.document.createElement);
@@ -518,45 +563,43 @@ var calc = Object.assign(
 );
 
 // src/color.ts
-var import_tinycolor = require("@ctrl/tinycolor");
+var import_color2k = require("color2k");
 var getColor = (color, fallback) => (theme, colorMode) => {
   const hex = getMemoizedObject(
     theme,
     `colors.${color}`,
     color
   );
-  if (isArray(hex)) {
-    const [lightHex, darkHex] = hex;
-    const { isValid, originalInput } = new import_tinycolor.TinyColor(colorMode !== "dark" ? lightHex : darkHex);
-    return isValid ? originalInput : fallback;
-  } else {
-    const { isValid, originalInput } = new import_tinycolor.TinyColor(hex);
-    return isValid ? originalInput : fallback;
+  try {
+    if (isArray(hex)) {
+      const [lightHex, darkHex] = hex;
+      return (0, import_color2k.toHex)(String(colorMode !== "dark" ? lightHex : darkHex));
+    } else {
+      return (0, import_color2k.toHex)(String(hex));
+    }
+  } catch {
+    return fallback != null ? fallback : "#000000";
   }
 };
 var lightenColor = (color, amount) => (theme, colorMode) => {
   const raw = getColor(color)(theme, colorMode);
-  return new import_tinycolor.TinyColor(raw).lighten(amount).toRgbString();
+  return (0, import_color2k.toHex)((0, import_color2k.lighten)(raw, amount / 100));
 };
 var darkenColor = (color, amount) => (theme, colorMode) => {
   const raw = getColor(color)(theme, colorMode);
-  return new import_tinycolor.TinyColor(raw).darken(amount).toRgbString();
-};
-var brightenColor = (color, amount) => (theme, colorMode) => {
-  const raw = getColor(color)(theme, colorMode);
-  return new import_tinycolor.TinyColor(raw).brighten(amount).toRgbString();
+  return (0, import_color2k.toHex)((0, import_color2k.darken)(raw, amount / 100));
 };
 var tintColor = (color, amount) => (theme, colorMode) => {
   const raw = getColor(color)(theme, colorMode);
-  return new import_tinycolor.TinyColor(raw).tint(amount).toRgbString();
+  return (0, import_color2k.toHex)((0, import_color2k.mix)(raw, "#fff", amount));
 };
 var shadeColor = (color, amount) => (theme, colorMode) => {
   const raw = getColor(color)(theme, colorMode);
-  return new import_tinycolor.TinyColor(raw).shade(amount).toRgbString();
+  return (0, import_color2k.toHex)((0, import_color2k.mix)(raw, "#000", amount / 100));
 };
 var transparentizeColor = (color, alpha) => (theme, colorMode) => {
   const raw = getColor(color)(theme, colorMode);
-  return new import_tinycolor.TinyColor(raw).setAlpha(alpha).toRgbString();
+  return (0, import_color2k.transparentize)(raw, 1 - alpha);
 };
 var toneColor = (color, l) => (theme, colorMode) => {
   const raw = getColor(color)(theme, colorMode);
@@ -568,7 +611,7 @@ var toneColor = (color, l) => (theme, colorMode) => {
     n *= -1;
   if (n !== 0)
     n = n - 5 * (isLighten ? 1 : -1);
-  return new import_tinycolor.TinyColor(raw)[isLighten ? "lighten" : "shade"](n).toString();
+  return (0, import_color2k.toHex)(isLighten ? (0, import_color2k.lighten)(raw, n / 100) : (0, import_color2k.mix)(raw, "#000", n / 100));
 };
 var randomColor = ({ string, colors } = {}) => {
   const fallback = randomHex();
@@ -608,14 +651,18 @@ var randomColorFromList = (str, list) => {
   return list[index];
 };
 var randomFromList = (list) => list[Math.floor(Math.random() * list.length)];
-var isLight = (color) => (theme, colorMode) => {
-  const raw = getColor(color)(theme, colorMode);
-  return new import_tinycolor.TinyColor(raw).isLight();
+var getBrightness = (color) => {
+  const [r, g, b] = (0, import_color2k.parseToRgba)(color);
+  return (r * 299 + g * 587 + b * 114) / 1e3;
 };
-var isDark = (color) => (theme, colorMode) => {
+var isTone = (color) => (theme, colorMode) => {
   const raw = getColor(color)(theme, colorMode);
-  return new import_tinycolor.TinyColor(raw).isDark();
+  const brightness = getBrightness(raw);
+  const isDark2 = brightness < 128;
+  return isDark2 ? "dark" : "light";
 };
+var isLight = (color) => (theme, colorMode) => isTone(color)(theme, colorMode) === "dark";
+var isDark = (color) => (theme, colorMode) => isTone(color)(theme, colorMode) === "light";
 
 // src/array.ts
 var filterEmpty = (array) => array.filter((value) => value != null);
@@ -697,7 +744,6 @@ var addPointerEvent = (target, type, cb, options) => addDomEvent(target, type, w
   ariaAttr,
   assignAfter,
   assignRef,
-  brightenColor,
   calc,
   cast,
   clampNumber,
@@ -756,6 +802,7 @@ var addPointerEvent = (target, type, cb, options) => addDomEvent(target, type, w
   isSafari,
   isString,
   isTabbable,
+  isTone,
   isTouchEvent,
   isUndefined,
   isUnit,
@@ -785,6 +832,9 @@ var addPointerEvent = (target, type, cb, options) => addDomEvent(target, type, w
   toPrecision,
   toneColor,
   transparentizeColor,
+  useAsync,
+  useAsyncFunc,
+  useAsyncRetry,
   useCallbackRef,
   useIsMounted,
   useMergeRefs,

package/dist/index.mjs

@@ -1,7 +1,6 @@
 import {
   assignAfter,
   assignRef,
-  brightenColor,
   createContext,
   cx,
   darkenColor,
@@ -19,6 +18,7 @@ import {
   isDark,
   isLight,
   isRefObject,
+  isTone,
   isValidElement,
   keysFormObject,
   lightenColor,
@@ -39,13 +39,16 @@ import {
   tintColor,
   toneColor,
   transparentizeColor,
+  useAsync,
+  useAsyncFunc,
+  useAsyncRetry,
   useCallbackRef,
   useIsMounted,
   useMergeRefs,
   useSafeLayoutEffect,
   useUnmountEffect,
   useUpdateEffect
-} from "./chunk-A6J4FUU7.mjs";
+} from "./chunk-VPOQGCMS.mjs";
 import "./chunk-SLJ4M7XC.mjs";
 import {
   clampNumber,
@@ -122,7 +125,6 @@ export {
   ariaAttr,
   assignAfter,
   assignRef,
-  brightenColor,
   calc,
   cast,
   clampNumber,
@@ -181,6 +183,7 @@ export {
   isSafari,
   isString,
   isTabbable,
+  isTone,
   isTouchEvent,
   isUndefined,
   isUnit,
@@ -210,6 +213,9 @@ export {
   toPrecision,
   toneColor,
   transparentizeColor,
+  useAsync,
+  useAsyncFunc,
+  useAsyncRetry,
   useCallbackRef,
   useIsMounted,
   useMergeRefs,

package/dist/object.d.ts

@@ -1,14 +1,14 @@
 import { Dict } from './index.types.js';
 
-declare const omitObject: <T extends Dict<any>, K extends keyof T>(obj: T, keys: K[]) => Omit<T, K>;
-declare const pickObject: <T extends Dict<any>, K extends keyof T>(obj: T, keys: K[]) => { [P in K]: T[P]; };
-declare const splitObject: <T extends Dict<any>, K extends keyof T>(obj: T, keys: K[]) => [{ [P in K]: T[P]; }, Omit<T, K>];
-declare const filterObject: <T extends Dict<any>, K extends Dict<any>>(obj: T, func: (key: keyof T, value: T[keyof T], obj: T) => boolean) => K;
-declare const filterUndefined: <T extends Dict<any>>(obj: T) => T;
-declare const merge: <T extends Dict<any>>(target: any, source: any, overrideArray?: boolean) => T;
-declare const flattenObject: <T extends Dict<any>>(obj: any, maxDepth?: number) => T;
-declare const objectFromEntries: <T extends Dict<any>>(entries: any[][]) => T;
-declare const keysFormObject: <T extends Dict<any>>(obj: T) => (keyof T)[];
+declare const omitObject: <T extends Dict, K extends keyof T>(obj: T, keys: K[]) => Omit<T, K>;
+declare const pickObject: <T extends Dict, K extends keyof T>(obj: T, keys: K[]) => { [P in K]: T[P]; };
+declare const splitObject: <T extends Dict, K extends keyof T>(obj: T, keys: K[]) => [{ [P in K]: T[P]; }, Omit<T, K>];
+declare const filterObject: <T extends Dict, K extends Dict>(obj: T, func: (key: keyof T, value: T[keyof T], obj: T) => boolean) => K;
+declare const filterUndefined: <T extends Dict>(obj: T) => T;
+declare const merge: <T extends Dict>(target: any, source: any, overrideArray?: boolean) => T;
+declare const flattenObject: <T extends Dict>(obj: any, maxDepth?: number) => T;
+declare const objectFromEntries: <T extends Dict>(entries: any[][]) => T;
+declare const keysFormObject: <T extends Dict>(obj: T) => (keyof T)[];
 declare const replaceObject: <T extends unknown>(objOrArray: T, callBack: (value: any) => any) => T;
 declare const getObject: (obj: Dict, path: string | number, fallback?: any, i?: number) => any;
 declare const memoizeObject: (func: typeof getObject) => (obj: Dict, path: string | number, fallback?: any, i?: number) => any;

package/dist/object.mjs

@@ -13,7 +13,7 @@ import {
   pickObject,
   replaceObject,
   splitObject
-} from "./chunk-A6J4FUU7.mjs";
+} from "./chunk-VPOQGCMS.mjs";
 import "./chunk-SLJ4M7XC.mjs";
 import "./chunk-VYMGBE25.mjs";
 import "./chunk-BZAW2D6U.mjs";

package/dist/react.d.ts

@@ -40,5 +40,55 @@ declare const mergeRefs: <T extends unknown = any>(...refs: (ReactRef<T> | undef
 declare const useMergeRefs: <T extends unknown = any>(...refs: (ReactRef<T> | undefined)[]) => (node: T | null) => void;
 declare const useCallbackRef: <T extends (...args: any[]) => any>(callback: T | undefined, deps?: React.DependencyList) => T;
 declare const useUpdateEffect: (callback: React.EffectCallback, deps: React.DependencyList) => void;
+type FunctionReturningPromise = (...args: any[]) => Promise<any>;
+declare const useAsync: <T extends FunctionReturningPromise>(func: T, deps?: React.DependencyList) => StateFromFunctionReturningPromise<T>;
+type AsyncState<T> = {
+    loading: boolean;
+    error?: undefined;
+    value?: undefined;
+} | {
+    loading: true;
+    error?: Error | undefined;
+    value?: T;
+} | {
+    loading: false;
+    error: Error;
+    value?: undefined;
+} | {
+    loading: false;
+    error?: undefined;
+    value: T;
+};
+type PromiseType<P extends Promise<any>> = P extends Promise<infer T> ? T : never;
+type StateFromFunctionReturningPromise<T extends FunctionReturningPromise> = AsyncState<PromiseType<ReturnType<T>>>;
+type AsyncFnReturn<T extends FunctionReturningPromise = FunctionReturningPromise> = [
+    StateFromFunctionReturningPromise<T>,
+    T
+];
+declare const useAsyncFunc: <T extends FunctionReturningPromise>(func: T, deps?: React.DependencyList, initialState?: StateFromFunctionReturningPromise<T>) => AsyncFnReturn<T>;
+type AsyncStateRetry<T> = AsyncState<T> & {
+    retry(): void;
+};
+declare const useAsyncRetry: <T>(func: () => Promise<T>, deps?: React.DependencyList) => {
+    retry: () => void;
+    loading: boolean;
+    error?: undefined;
+    value?: undefined;
+} | {
+    retry: () => void;
+    loading: false;
+    error: Error;
+    value?: undefined;
+} | {
+    retry: () => void;
+    loading: true;
+    error?: Error | undefined;
+    value?: T | undefined;
+} | {
+    retry: () => void;
+    loading: false;
+    error?: undefined;
+    value: T;
+};
 
-export { DOMAttributes, MaybeRenderProp, PropGetter, RequiredPropGetter, assignRef, createContext, cx, findChildren, getValidChildren, includesChildren, isRefObject, isValidElement, mergeRefs, omitChildren, pickChildren, useCallbackRef, useIsMounted, useMergeRefs, useSafeLayoutEffect, useUnmountEffect, useUpdateEffect };
+export { AsyncFnReturn, AsyncState, AsyncStateRetry, DOMAttributes, FunctionReturningPromise, MaybeRenderProp, PromiseType, PropGetter, RequiredPropGetter, assignRef, createContext, cx, findChildren, getValidChildren, includesChildren, isRefObject, isValidElement, mergeRefs, omitChildren, pickChildren, useAsync, useAsyncFunc, useAsyncRetry, useCallbackRef, useIsMounted, useMergeRefs, useSafeLayoutEffect, useUnmountEffect, useUpdateEffect };

package/dist/react.js

@@ -41,6 +41,9 @@ __export(react_exports, {
   mergeRefs: () => mergeRefs,
   omitChildren: () => omitChildren,
   pickChildren: () => pickChildren,
+  useAsync: () => useAsync,
+  useAsyncFunc: () => useAsyncFunc,
+  useAsyncRetry: () => useAsyncRetry,
   useCallbackRef: () => useCallbackRef,
   useIsMounted: () => useIsMounted,
   useMergeRefs: () => useMergeRefs,
@@ -154,6 +157,48 @@ var useUpdateEffect = (callback, deps) => {
     };
   }, []);
 };
+var useAsync = (func, deps = []) => {
+  const [state, callback] = useAsyncFunc(func, deps, { loading: true });
+  React.useEffect(() => {
+    callback();
+  }, [callback]);
+  return state;
+};
+var useAsyncFunc = (func, deps = [], initialState = { loading: false }) => {
+  const lastCallId = React.useRef(0);
+  const isMounted = useIsMounted();
+  const [state, setState] = React.useState(initialState);
+  const callback = React.useCallback((...args) => {
+    const callId = ++lastCallId.current;
+    if (!state.loading) {
+      setState((prevState) => ({ ...prevState, loading: true }));
+    }
+    return func(...args).then(
+      (value) => {
+        if (isMounted.current && callId === lastCallId.current)
+          setState({ value, loading: false });
+        return value;
+      },
+      (error) => {
+        if (isMounted.current && callId === lastCallId.current)
+          setState({ error, loading: false });
+        return error;
+      }
+    );
+  }, deps);
+  return [state, callback];
+};
+var useAsyncRetry = (func, deps = []) => {
+  const [attempt, setAttempt] = React.useState(0);
+  const state = useAsync(func, [...deps, attempt]);
+  const stateLoading = state.loading;
+  const retry = React.useCallback(() => {
+    if (stateLoading)
+      return;
+    setAttempt((currentAttempt) => currentAttempt + 1);
+  }, [...deps, stateLoading]);
+  return { ...state, retry };
+};
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   assignRef,
@@ -167,6 +212,9 @@ var useUpdateEffect = (callback, deps) => {
   mergeRefs,
   omitChildren,
   pickChildren,
+  useAsync,
+  useAsyncFunc,
+  useAsyncRetry,
   useCallbackRef,
   useIsMounted,
   useMergeRefs,

package/dist/react.mjs

@@ -10,13 +10,16 @@ import {
   mergeRefs,
   omitChildren,
   pickChildren,
+  useAsync,
+  useAsyncFunc,
+  useAsyncRetry,
   useCallbackRef,
   useIsMounted,
   useMergeRefs,
   useSafeLayoutEffect,
   useUnmountEffect,
   useUpdateEffect
-} from "./chunk-A6J4FUU7.mjs";
+} from "./chunk-VPOQGCMS.mjs";
 import "./chunk-SLJ4M7XC.mjs";
 import "./chunk-VYMGBE25.mjs";
 import "./chunk-BZAW2D6U.mjs";
@@ -37,6 +40,9 @@ export {
   mergeRefs,
   omitChildren,
   pickChildren,
+  useAsync,
+  useAsyncFunc,
+  useAsyncRetry,
   useCallbackRef,
   useIsMounted,
   useMergeRefs,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@yamada-ui/utils",
-  "version": "0.1.0",
+  "version": "0.1.2",
   "description": "Yamada UI utils",
   "keywords": [
     "utils",
@@ -28,11 +28,11 @@
     "url": "https://github.com/hirotomoyamada/yamada-ui/issues"
   },
   "dependencies": {
-    "@ctrl/tinycolor": "^3.4.1"
+    "color2k": "^2.0.2"
   },
   "devDependencies": {
-    "react": "^18.0.0",
-    "clean-package": "2.2.0"
+    "clean-package": "2.2.0",
+    "react": "^18.0.0"
   },
   "peerDependencies": {
     "react": ">=18"