@yamada-ui/react 2.2.1-dev-20260504103143 → 2.2.1-dev-20260509050741

package/dist/esm/core/system/var.js.map

@@ -1 +1 @@
-{"version":3,"file":"var.js","names":["value","system: System","calc","computedValue: DefineThemeValue","resolvedValue: DefineThemeValue | Dict","cssMap: CSSMap","cssVars: Dict","objOrArray","result: [string, any][]"],"sources":["../../../../src/core/system/var.ts"],"sourcesContent":["import type { Dict } from \"../../utils\"\nimport type { CSSProperties, StyleValueWithCondition } from \"../css\"\nimport type {\n  CSSMap,\n  DefineThemeValue,\n  System,\n  ThemeToken,\n  UsageTheme,\n  VariableTokens,\n  VariableValue,\n} from \"../system\"\nimport type { Breakpoints } from \"./breakpoint\"\nimport {\n  calc,\n  escape,\n  isArray,\n  isNull,\n  isObject,\n  isString,\n  isUndefined,\n  merge,\n  replaceObject,\n} from \"../../utils\"\nimport { DEFAULT_VAR_PREFIX } from \"../constant\"\nimport {\n  animation,\n  colorMix,\n  conditions,\n  css,\n  getStyle,\n  gradient,\n  injectKeyframes,\n  isCSSFunction,\n  isCSSVar,\n} from \"../css\"\nimport { isInterpolation } from \"../css/utils\"\nimport { defaultSystem } from \"../system\"\n\ntype ParsedValue = number | string | undefined\n\ninterface Variable {\n  reference: string\n  variable: string\n}\n\nexport function transformInterpolation(\n  value: any,\n  callback: (value: string, fallbackValue?: string) => string,\n) {\n  if (isString(value)) {\n    return value.replace(/\\{(.*?)\\}/g, (_, value) => {\n      const [token, fallbackValue] = value.split(/,(.+)/)\n\n      return callback(token.trim(), fallbackValue?.trim())\n    })\n  } else {\n    return value\n  }\n}\n\nexport function getVar(token: string, fallback?: string) {\n  if (!token.startsWith(\"--\")) token = `--${token}`\n\n  token = token.replace(/[^-_a-zA-Z0-9]/g, \"\")\n\n  return fallback ? `var(${token}, ${fallback})` : `var(${token})`\n}\n\nexport function getVarName(system: System) {\n  return function (token: string) {\n    const prefix = system.config.css?.varPrefix ?? DEFAULT_VAR_PREFIX\n\n    return `--${prefix}-${token}`\n  }\n}\n\nexport function getColorSchemeVar(system: System) {\n  return function (value: any, fallback?: string) {\n    if (!isString(value)) return value\n\n    const prefix = system.config.css?.varPrefix ?? DEFAULT_VAR_PREFIX\n\n    const [, token] = value.split(\".\")\n\n    return getVar(`${prefix}-colorScheme-${token}`, fallback)\n  }\n}\n\nconst isGradient = (token: string) => token.startsWith(\"gradients.\")\nconst isKeyframes = (token: string) => token.startsWith(\"keyframes.\")\nconst isAnimation = (token: string) => token.startsWith(\"animations.\")\nconst isSpace = (token: string) => token.startsWith(\"spaces.\")\nconst isColor = (token: string) => token.startsWith(\"colors.\")\nexport const isColorScheme = (token: any) =>\n  isString(token) && token.startsWith(\"colorScheme.\") && !token.includes(\"/\")\n\nexport function createVars(\n  prefix: string = DEFAULT_VAR_PREFIX,\n  theme: UsageTheme,\n  breakpoints: Breakpoints,\n) {\n  return function (tokens: VariableTokens) {\n    const { getQuery, isResponsive } = breakpoints\n\n    function tokenToVar(token: string): Variable {\n      token = token.replace(/\\./g, \"-\")\n      token = token.replace(/\\//g, \"\\\\/\")\n\n      const variable = `--${[prefix, escape(token, \"-\")].filter(Boolean).join(\"-\")}`\n      const reference = `var(${variable})`\n\n      return { reference, variable }\n    }\n\n    return function (\n      cssMap: CSSMap = {},\n      cssVars: Dict = {},\n      prevTokens?: VariableTokens,\n    ): { cssMap: CSSMap; cssVars: Dict } {\n      const system: System = { ...defaultSystem, cssMap }\n      const options = { css, system, theme }\n\n      function getRelatedReference(\n        token: string,\n        value: ParsedValue = \"\",\n      ): [ParsedValue, Exclude<ParsedValue, undefined>] {\n        const relatedToken = [token.split(\".\")[0], value].join(\".\")\n\n        if (token === relatedToken) return [undefined, value]\n\n        const targetToken = tokens[relatedToken] ?? prevTokens?.[relatedToken]\n\n        if (!targetToken) return [undefined, value]\n\n        const { reference, variable } = tokenToVar(relatedToken)\n\n        return [variable, reference]\n      }\n\n      function valueToVar(value: any) {\n        return transformInterpolation(value, (value, fallbackValue) => {\n          if (value.includes(\"colors.\") || value.includes(\"colorScheme.\")) {\n            if (isColorScheme(value)) return getColorSchemeVar(system)(value)\n\n            return colorMix(value, { fallback: fallbackValue, system })\n          } else {\n            const token = tokens[value] ?? prevTokens?.[value]\n\n            if (token) {\n              return tokenToVar(value).reference\n            } else if (value in cssMap && cssMap[value]?.ref) {\n              return cssMap[value].ref\n            } else if (fallbackValue) {\n              fallbackValue =\n                fallbackValue in cssMap && cssMap[fallbackValue]?.ref\n                  ? cssMap[fallbackValue]?.ref\n                  : fallbackValue\n\n              return `var(--${prefix}-${value}, ${fallbackValue})`\n            } else {\n              return `var(--${prefix}-${value})`\n            }\n          }\n        })\n      }\n\n      function createNegativeVar(token: string, reference: string) {\n        const paths = token.split(\".\")\n        const [start, ...rest] = paths\n\n        const negativeToken = `${start}.-${rest.join(\".\")}`\n\n        const negativeReference = calc.negate(reference)\n\n        return { negativeReference, negativeToken }\n      }\n\n      function createAnimationVar(value: VariableValue) {\n        if (isArray(value)) {\n          return value.map((value) => animation(value, options)).join(\",\")\n        } else {\n          return animation(value, options)\n        }\n      }\n\n      function createGradientVar(token: string, value: DefineThemeValue) {\n        return function (semantic: boolean) {\n          if (!semantic) {\n            return gradient(value, options)\n          } else {\n            const [variable, reference] = getRelatedReference(token, value)\n\n            return variable ? reference : gradient(value, options)\n          }\n        }\n      }\n\n      function createKeyframesVar(token: string, value: any) {\n        return function (semantic: boolean) {\n          if (!semantic) {\n            return injectKeyframes(css(system, theme)(value))\n          } else {\n            const [variable, reference] = getRelatedReference(token, value)\n\n            return variable\n              ? reference\n              : injectKeyframes(css(system, theme)(value))\n          }\n        }\n      }\n\n      function createColorVar(\n        token: string,\n        properties: string[],\n        value: DefineThemeValue,\n      ) {\n        return function (semantic: boolean) {\n          if (!semantic) {\n            return colorMix(value, { ...options, properties })\n          } else {\n            const [variable, reference] = getRelatedReference(token, value)\n\n            return variable\n              ? reference\n              : colorMix(value, { ...options, properties })\n          }\n        }\n      }\n\n      function createVar(\n        token: string,\n        value: VariableValue,\n        variable: string,\n      ) {\n        return function (semantic: boolean, queries: string[] = []) {\n          if (isAnimation(token)) value = createAnimationVar(value)\n\n          if (isArray(value)) {\n            const [lightValue, darkValue] = value\n\n            createVar(token, lightValue, variable)(semantic, queries)\n            createVar(\n              token,\n              darkValue,\n              variable,\n            )(semantic, [...queries, conditions._dark])\n          } else if (isResponsive(value, true)) {\n            Object.entries(value).forEach(([key, value]) => {\n              if (key === \"base\") {\n                createVar(token, value, variable)(semantic, queries)\n              } else {\n                const query = getQuery(key)\n\n                if (!query) return\n\n                createVar(token, value, variable)(semantic, [...queries, query])\n              }\n            })\n          } else {\n            const computedValue: DefineThemeValue = valueToVar(value)\n\n            let resolvedValue: DefineThemeValue | Dict = computedValue\n\n            if (isKeyframes(token)) {\n              resolvedValue = createKeyframesVar(token, computedValue)(semantic)\n            } else if (isGradient(token)) {\n              resolvedValue = createGradientVar(token, computedValue)(semantic)\n            } else if (isColor(token)) {\n              resolvedValue = createColorVar(\n                token,\n                [variable],\n                computedValue,\n              )(semantic)\n            } else if (semantic) {\n              const [, reference] = getRelatedReference(token, computedValue)\n\n              resolvedValue = reference\n            }\n\n            if (!isObject(resolvedValue))\n              resolvedValue = { [variable]: resolvedValue }\n\n            const resolvedCssVars = queries.reduceRight<Dict>(\n              (prev, key) => ({ [key]: prev }),\n              resolvedValue,\n            )\n\n            cssVars = merge(cssVars, resolvedCssVars)\n          }\n        }\n      }\n\n      for (let [token, { semantic, value }] of Object.entries(tokens)) {\n        const { reference, variable } = tokenToVar(token)\n\n        createVar(token, value, variable)(semantic)\n\n        if (isSpace(token)) {\n          const { negativeReference, negativeToken } = createNegativeVar(\n            token,\n            reference,\n          )\n\n          cssMap[negativeToken] = { ref: negativeReference, var: variable }\n        }\n\n        cssMap[token] = { ref: reference, var: variable }\n      }\n\n      return { cssMap, cssVars }\n    }\n  }\n}\n\nexport type CreateVars = ReturnType<ReturnType<typeof createVars>>\n\nexport function mergeVars(...fns: CreateVars[]) {\n  return function (prevTokens?: VariableTokens) {\n    let cssMap: CSSMap = {}\n    let cssVars: Dict = {}\n\n    for (const fn of fns) {\n      const result = fn(cssMap, cssVars, prevTokens)\n\n      cssMap = { ...cssMap, ...result.cssMap }\n      cssVars = { ...cssVars, ...result.cssVars }\n    }\n\n    return { cssMap, cssVars }\n  }\n}\n\nexport function varAttr<Y = StyleValueWithCondition<number | string>>(\n  value: undefined | Y,\n  token?: ThemeToken,\n  fallbackValue?: string,\n): undefined | Y {\n  if (isUndefined(value) || isNull(value) || isCSSFunction(value)) return value\n\n  if (isObject(value) || isArray(value)) {\n    return replaceObject(value, (value) => varAttr(value, token, fallbackValue))\n  } else {\n    return token\n      ? (`{${token}.${value as number | string}, ${fallbackValue ?? (value as number | string)}}` as Y)\n      : value\n  }\n}\n\nexport function injectVars<Y extends Dict | Dict[] | undefined>(\n  objOrArray: Y,\n  targets: { [key in CSSProperties]?: string },\n  isInvalidProp?: (prop: string) => boolean,\n): Y {\n  if (!objOrArray) return objOrArray\n\n  function callback(objOrArray: Dict) {\n    return Object.fromEntries(\n      Object.entries(objOrArray).flatMap(function ([prop, value]) {\n        if (isInvalidProp?.(prop)) return [[prop, value]]\n\n        const target = targets[prop]\n        const result: [string, any][] = []\n\n        if (target) {\n          const { token } = getStyle(prop) ?? {}\n\n          if (isCSSVar(value) || isInterpolation(value)) {\n            result.push([`--${target}`, value])\n          } else {\n            result.push([\n              `--${target}`,\n              token ? `{${token}.${value}, ${value}}` : value,\n            ])\n          }\n        } else if (isObject(value)) {\n          result.push([prop, injectVars(value, targets)])\n        } else {\n          result.push([prop, value])\n        }\n\n        return result\n      }),\n    )\n  }\n\n  if (isArray(objOrArray)) {\n    return objOrArray.map(callback) as Y\n  } else {\n    return callback(objOrArray) as Y\n  }\n}\n"],"mappings":"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"}
+{"version":3,"file":"var.js","names":["calc"],"sources":["../../../../src/core/system/var.ts"],"sourcesContent":["import type { Dict } from \"../../utils\"\nimport type { CSSProperties, StyleValueWithCondition } from \"../css\"\nimport type {\n  CSSMap,\n  DefineThemeValue,\n  System,\n  ThemeToken,\n  UsageTheme,\n  VariableTokens,\n  VariableValue,\n} from \"../system\"\nimport type { Breakpoints } from \"./breakpoint\"\nimport {\n  calc,\n  escape,\n  isArray,\n  isNull,\n  isObject,\n  isString,\n  isUndefined,\n  merge,\n  replaceObject,\n} from \"../../utils\"\nimport { DEFAULT_VAR_PREFIX } from \"../constant\"\nimport {\n  animation,\n  colorMix,\n  conditions,\n  css,\n  getStyle,\n  gradient,\n  injectKeyframes,\n  isCSSFunction,\n  isCSSVar,\n} from \"../css\"\nimport { isInterpolation } from \"../css/utils\"\nimport { defaultSystem } from \"../system\"\n\ntype ParsedValue = number | string | undefined\n\ninterface Variable {\n  reference: string\n  variable: string\n}\n\nexport function transformInterpolation(\n  value: any,\n  callback: (value: string, fallbackValue?: string) => string,\n) {\n  if (isString(value)) {\n    return value.replace(/\\{(.*?)\\}/g, (_, value) => {\n      const [token, fallbackValue] = value.split(/,(.+)/)\n\n      return callback(token.trim(), fallbackValue?.trim())\n    })\n  } else {\n    return value\n  }\n}\n\nexport function getVar(token: string, fallback?: string) {\n  if (!token.startsWith(\"--\")) token = `--${token}`\n\n  token = token.replace(/[^-_a-zA-Z0-9]/g, \"\")\n\n  return fallback ? `var(${token}, ${fallback})` : `var(${token})`\n}\n\nexport function getVarName(system: System) {\n  return function (token: string) {\n    const prefix = system.config.css?.varPrefix ?? DEFAULT_VAR_PREFIX\n\n    return `--${prefix}-${token}`\n  }\n}\n\nexport function getColorSchemeVar(system: System) {\n  return function (value: any, fallback?: string) {\n    if (!isString(value)) return value\n\n    const prefix = system.config.css?.varPrefix ?? DEFAULT_VAR_PREFIX\n\n    const [, token] = value.split(\".\")\n\n    return getVar(`${prefix}-colorScheme-${token}`, fallback)\n  }\n}\n\nconst isGradient = (token: string) => token.startsWith(\"gradients.\")\nconst isKeyframes = (token: string) => token.startsWith(\"keyframes.\")\nconst isAnimation = (token: string) => token.startsWith(\"animations.\")\nconst isSpace = (token: string) => token.startsWith(\"spaces.\")\nconst isColor = (token: string) => token.startsWith(\"colors.\")\nexport const isColorScheme = (token: any) =>\n  isString(token) && token.startsWith(\"colorScheme.\") && !token.includes(\"/\")\n\nexport function createVars(\n  prefix: string = DEFAULT_VAR_PREFIX,\n  theme: UsageTheme,\n  breakpoints: Breakpoints,\n) {\n  return function (tokens: VariableTokens) {\n    const { getQuery, isResponsive } = breakpoints\n\n    function tokenToVar(token: string): Variable {\n      token = token.replace(/\\./g, \"-\")\n      token = token.replace(/\\//g, \"\\\\/\")\n\n      const variable = `--${[prefix, escape(token, \"-\")].filter(Boolean).join(\"-\")}`\n      const reference = `var(${variable})`\n\n      return { reference, variable }\n    }\n\n    return function (\n      cssMap: CSSMap = {},\n      cssVars: Dict = {},\n      prevTokens?: VariableTokens,\n    ): { cssMap: CSSMap; cssVars: Dict } {\n      const system: System = { ...defaultSystem, cssMap }\n      const options = { css, system, theme }\n\n      function getRelatedReference(\n        token: string,\n        value: ParsedValue = \"\",\n      ): [ParsedValue, Exclude<ParsedValue, undefined>] {\n        const relatedToken = [token.split(\".\")[0], value].join(\".\")\n\n        if (token === relatedToken) return [undefined, value]\n\n        const targetToken = tokens[relatedToken] ?? prevTokens?.[relatedToken]\n\n        if (!targetToken) return [undefined, value]\n\n        const { reference, variable } = tokenToVar(relatedToken)\n\n        return [variable, reference]\n      }\n\n      function valueToVar(value: any) {\n        return transformInterpolation(value, (value, fallbackValue) => {\n          if (value.includes(\"colors.\") || value.includes(\"colorScheme.\")) {\n            if (isColorScheme(value)) return getColorSchemeVar(system)(value)\n\n            return colorMix(value, { fallback: fallbackValue, system })\n          } else {\n            const token = tokens[value] ?? prevTokens?.[value]\n\n            if (token) {\n              return tokenToVar(value).reference\n            } else if (value in cssMap && cssMap[value]?.ref) {\n              return cssMap[value].ref\n            } else if (fallbackValue) {\n              fallbackValue =\n                fallbackValue in cssMap && cssMap[fallbackValue]?.ref\n                  ? cssMap[fallbackValue]?.ref\n                  : fallbackValue\n\n              return `var(--${prefix}-${value}, ${fallbackValue})`\n            } else {\n              return `var(--${prefix}-${value})`\n            }\n          }\n        })\n      }\n\n      function createNegativeVar(token: string, reference: string) {\n        const paths = token.split(\".\")\n        const [start, ...rest] = paths\n\n        const negativeToken = `${start}.-${rest.join(\".\")}`\n\n        const negativeReference = calc.negate(reference)\n\n        return { negativeReference, negativeToken }\n      }\n\n      function createAnimationVar(value: VariableValue) {\n        if (isArray(value)) {\n          return value.map((value) => animation(value, options)).join(\",\")\n        } else {\n          return animation(value, options)\n        }\n      }\n\n      function createGradientVar(token: string, value: DefineThemeValue) {\n        return function (semantic: boolean) {\n          if (!semantic) {\n            return gradient(value, options)\n          } else {\n            const [variable, reference] = getRelatedReference(token, value)\n\n            return variable ? reference : gradient(value, options)\n          }\n        }\n      }\n\n      function createKeyframesVar(token: string, value: any) {\n        return function (semantic: boolean) {\n          if (!semantic) {\n            return injectKeyframes(css(system, theme)(value))\n          } else {\n            const [variable, reference] = getRelatedReference(token, value)\n\n            return variable\n              ? reference\n              : injectKeyframes(css(system, theme)(value))\n          }\n        }\n      }\n\n      function createColorVar(\n        token: string,\n        properties: string[],\n        value: DefineThemeValue,\n      ) {\n        return function (semantic: boolean) {\n          if (!semantic) {\n            return colorMix(value, { ...options, properties })\n          } else {\n            const [variable, reference] = getRelatedReference(token, value)\n\n            return variable\n              ? reference\n              : colorMix(value, { ...options, properties })\n          }\n        }\n      }\n\n      function createVar(\n        token: string,\n        value: VariableValue,\n        variable: string,\n      ) {\n        return function (semantic: boolean, queries: string[] = []) {\n          if (isAnimation(token)) value = createAnimationVar(value)\n\n          if (isArray(value)) {\n            const [lightValue, darkValue] = value\n\n            createVar(token, lightValue, variable)(semantic, queries)\n            createVar(\n              token,\n              darkValue,\n              variable,\n            )(semantic, [...queries, conditions._dark])\n          } else if (isResponsive(value, true)) {\n            Object.entries(value).forEach(([key, value]) => {\n              if (key === \"base\") {\n                createVar(token, value, variable)(semantic, queries)\n              } else {\n                const query = getQuery(key)\n\n                if (!query) return\n\n                createVar(token, value, variable)(semantic, [...queries, query])\n              }\n            })\n          } else {\n            const computedValue: DefineThemeValue = valueToVar(value)\n\n            let resolvedValue: DefineThemeValue | Dict = computedValue\n\n            if (isKeyframes(token)) {\n              resolvedValue = createKeyframesVar(token, computedValue)(semantic)\n            } else if (isGradient(token)) {\n              resolvedValue = createGradientVar(token, computedValue)(semantic)\n            } else if (isColor(token)) {\n              resolvedValue = createColorVar(\n                token,\n                [variable],\n                computedValue,\n              )(semantic)\n            } else if (semantic) {\n              const [, reference] = getRelatedReference(token, computedValue)\n\n              resolvedValue = reference\n            }\n\n            if (!isObject(resolvedValue))\n              resolvedValue = { [variable]: resolvedValue }\n\n            const resolvedCssVars = queries.reduceRight<Dict>(\n              (prev, key) => ({ [key]: prev }),\n              resolvedValue,\n            )\n\n            cssVars = merge(cssVars, resolvedCssVars)\n          }\n        }\n      }\n\n      for (let [token, { semantic, value }] of Object.entries(tokens)) {\n        const { reference, variable } = tokenToVar(token)\n\n        createVar(token, value, variable)(semantic)\n\n        if (isSpace(token)) {\n          const { negativeReference, negativeToken } = createNegativeVar(\n            token,\n            reference,\n          )\n\n          cssMap[negativeToken] = { ref: negativeReference, var: variable }\n        }\n\n        cssMap[token] = { ref: reference, var: variable }\n      }\n\n      return { cssMap, cssVars }\n    }\n  }\n}\n\nexport type CreateVars = ReturnType<ReturnType<typeof createVars>>\n\nexport function mergeVars(...fns: CreateVars[]) {\n  return function (prevTokens?: VariableTokens) {\n    let cssMap: CSSMap = {}\n    let cssVars: Dict = {}\n\n    for (const fn of fns) {\n      const result = fn(cssMap, cssVars, prevTokens)\n\n      cssMap = { ...cssMap, ...result.cssMap }\n      cssVars = { ...cssVars, ...result.cssVars }\n    }\n\n    return { cssMap, cssVars }\n  }\n}\n\nexport function varAttr<Y = StyleValueWithCondition<number | string>>(\n  value: undefined | Y,\n  token?: ThemeToken,\n  fallbackValue?: string,\n): undefined | Y {\n  if (isUndefined(value) || isNull(value) || isCSSFunction(value)) return value\n\n  if (isObject(value) || isArray(value)) {\n    return replaceObject(value, (value) => varAttr(value, token, fallbackValue))\n  } else {\n    return token\n      ? (`{${token}.${value as number | string}, ${fallbackValue ?? (value as number | string)}}` as Y)\n      : value\n  }\n}\n\nexport function injectVars<Y extends Dict | Dict[] | undefined>(\n  objOrArray: Y,\n  targets: { [key in CSSProperties]?: string },\n  isInvalidProp?: (prop: string) => boolean,\n): Y {\n  if (!objOrArray) return objOrArray\n\n  function callback(objOrArray: Dict) {\n    return Object.fromEntries(\n      Object.entries(objOrArray).flatMap(function ([prop, value]) {\n        if (isInvalidProp?.(prop)) return [[prop, value]]\n\n        const target = targets[prop]\n        const result: [string, any][] = []\n\n        if (target) {\n          const { token } = getStyle(prop) ?? {}\n\n          if (isCSSVar(value) || isInterpolation(value)) {\n            result.push([`--${target}`, value])\n          } else {\n            result.push([\n              `--${target}`,\n              token ? `{${token}.${value}, ${value}}` : value,\n            ])\n          }\n        } else if (isObject(value)) {\n          result.push([prop, injectVars(value, targets)])\n        } else {\n          result.push([prop, value])\n        }\n\n        return result\n      }),\n    )\n  }\n\n  if (isArray(objOrArray)) {\n    return objOrArray.map(callback) as Y\n  } else {\n    return callback(objOrArray) as Y\n  }\n}\n"],"mappings":"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"}

package/dist/esm/hooks/use-animation/index.js

@@ -1,12 +1,9 @@
 "use client";
-
 import { utils_exports } from "../../utils/index.js";
 import { useSystem } from "../../core/system/system-provider.js";
 import { animation } from "../../core/css/animation.js";
 import { css } from "../../core/css/css.js";
-import "../../core/index.js";
 import { useCallback, useRef, useState } from "react";
-
 //#region src/hooks/use-animation/index.ts
 /**
 * `useAnimation` is a custom hook that implements animations similar to CSS `keyframes`.
@@ -15,7 +12,7 @@ import { useCallback, useRef, useState } from "react";
 */
 const useAnimation = (cssObj) => {
 	const system = useSystem();
-	if ((0, utils_exports.isArray)(cssObj)) return cssObj.map((cssObj$1) => animation(cssObj$1, {
+	if ((0, utils_exports.isArray)(cssObj)) return cssObj.map((cssObj) => animation(cssObj, {
 		css,
 		system
 	})).join(", ");
@@ -55,7 +52,7 @@ const useDynamicAnimation = (arrayOrObj, init) => {
 		else setAnimations(cache.current.get(keys.current));
 	}, [arrayOrObj])];
 };
-
 //#endregion
 export { useAnimation, useDynamicAnimation };
+
 //# sourceMappingURL=index.js.map

package/dist/esm/hooks/use-animation/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["cssObj"],"sources":["../../../../src/hooks/use-animation/index.ts"],"sourcesContent":["\"use client\"\n\nimport type { CSSAnimationObject, Token } from \"../../core\"\nimport { useCallback, useRef, useState } from \"react\"\nimport { animation, css, useSystem } from \"../../core\"\nimport { isArray, isUndefined, runIfFn } from \"../../utils\"\n\ntype CSSObject =\n  | Token<CSSAnimationObject, \"animations\">\n  | Token<CSSAnimationObject, \"animations\">[]\n\n/**\n * `useAnimation` is a custom hook that implements animations similar to CSS `keyframes`.\n *\n * @see https://yamada-ui.com/docs/hooks/use-animation\n */\nexport const useAnimation = (cssObj: CSSObject): string => {\n  const system = useSystem()\n\n  if (isArray(cssObj)) {\n    return cssObj.map((cssObj) => animation(cssObj, { css, system })).join(\", \")\n  } else {\n    return animation(cssObj, { css, system })\n  }\n}\n\n/**\n * `useDynamicAnimation` is a custom hook used to switch animations.\n *\n * @see https://yamada-ui.com/docs/hooks/use-dynamic-animation\n */\nexport const useDynamicAnimation = <\n  Y extends\n    | Token<CSSAnimationObject, \"animations\">[]\n    | { [key: string]: CSSObject },\n>(\n  arrayOrObj: Y,\n  init?: (keyof Y)[] | keyof Y,\n): [\n  string | undefined,\n  (\n    key:\n      | ((key: (keyof Y)[] | keyof Y | undefined) => (keyof Y)[] | keyof Y)\n      | (keyof Y)[]\n      | keyof Y,\n  ) => void,\n] => {\n  const system = useSystem()\n\n  const keys = useRef<string | string[] | undefined>(\n    !isUndefined(init)\n      ? isArray(init)\n        ? init.map(String)\n        : String(init)\n      : undefined,\n  )\n  const cache = useRef<Map<string, string>>(new Map<string, string>())\n\n  const [animations, setAnimations] = useState<string | undefined>(() => {\n    for (const [key, styles] of Object.entries(arrayOrObj)) {\n      if (isArray(styles)) {\n        cache.current.set(\n          key,\n          styles.map((style) => animation(style, { css, system })).join(\", \"),\n        )\n      } else {\n        cache.current.set(key, animation(styles, { css, system }))\n      }\n    }\n\n    if (isArray(keys.current)) {\n      return keys.current.map((key) => cache.current.get(key)).join(\", \")\n    } else {\n      return cache.current.get(keys.current ?? \"\")\n    }\n  })\n\n  const setAnimation = useCallback(\n    (\n      keysOrFunc:\n        | ((key: (keyof Y)[] | keyof Y | undefined) => (keyof Y)[] | keyof Y)\n        | (keyof Y)[]\n        | keyof Y,\n    ) => {\n      const args = (() => {\n        if (!isUndefined(keys.current) && isArray(arrayOrObj)) {\n          return isArray(keys.current)\n            ? keys.current.map(Number)\n            : Number(keys.current)\n        } else {\n          return keys.current\n        }\n      })() as (keyof Y)[] | keyof Y | undefined\n\n      const keyOrArray = runIfFn(keysOrFunc, args)\n\n      keys.current = isArray(keyOrArray)\n        ? keyOrArray.map(String)\n        : String(keyOrArray)\n\n      if (isArray(keys.current)) {\n        setAnimations(\n          keys.current.map((key) => cache.current.get(key)).join(\", \"),\n        )\n      } else {\n        setAnimations(cache.current.get(keys.current))\n      }\n    },\n    [arrayOrObj],\n  )\n\n  return [animations, setAnimation]\n}\n"],"mappings":";;;;;;;;;;;;;;;AAgBA,MAAa,gBAAgB,WAA8B;CACzD,MAAM,SAAS,WAAW;AAE1B,gCAAY,OAAO,CACjB,QAAO,OAAO,KAAK,aAAW,UAAUA,UAAQ;EAAE;EAAK;EAAQ,CAAC,CAAC,CAAC,KAAK,KAAK;KAE5E,QAAO,UAAU,QAAQ;EAAE;EAAK;EAAQ,CAAC;;;;;;;AAS7C,MAAa,uBAKX,YACA,SASG;CACH,MAAM,SAAS,WAAW;CAE1B,MAAM,OAAO,OACX,gCAAa,KAAK,8BACN,KAAK,GACX,KAAK,IAAI,OAAO,GAChB,OAAO,KAAK,GACd,OACL;CACD,MAAM,QAAQ,uBAA4B,IAAI,KAAqB,CAAC;CAEpE,MAAM,CAAC,YAAY,iBAAiB,eAAmC;AACrE,OAAK,MAAM,CAAC,KAAK,WAAW,OAAO,QAAQ,WAAW,CACpD,gCAAY,OAAO,CACjB,OAAM,QAAQ,IACZ,KACA,OAAO,KAAK,UAAU,UAAU,OAAO;GAAE;GAAK;GAAQ,CAAC,CAAC,CAAC,KAAK,KAAK,CACpE;MAED,OAAM,QAAQ,IAAI,KAAK,UAAU,QAAQ;GAAE;GAAK;GAAQ,CAAC,CAAC;AAI9D,iCAAY,KAAK,QAAQ,CACvB,QAAO,KAAK,QAAQ,KAAK,QAAQ,MAAM,QAAQ,IAAI,IAAI,CAAC,CAAC,KAAK,KAAK;MAEnE,QAAO,MAAM,QAAQ,IAAI,KAAK,WAAW,GAAG;GAE9C;AAoCF,QAAO,CAAC,YAlCa,aAEjB,eAIG;EAWH,MAAM,wCAAqB,mBAVP;AAClB,OAAI,gCAAa,KAAK,QAAQ,+BAAY,WAAW,CACnD,mCAAe,KAAK,QAAQ,GACxB,KAAK,QAAQ,IAAI,OAAO,GACxB,OAAO,KAAK,QAAQ;OAExB,QAAO,KAAK;MAEZ,CAEwC;AAE5C,OAAK,qCAAkB,WAAW,GAC9B,WAAW,IAAI,OAAO,GACtB,OAAO,WAAW;AAEtB,iCAAY,KAAK,QAAQ,CACvB,eACE,KAAK,QAAQ,KAAK,QAAQ,MAAM,QAAQ,IAAI,IAAI,CAAC,CAAC,KAAK,KAAK,CAC7D;MAED,eAAc,MAAM,QAAQ,IAAI,KAAK,QAAQ,CAAC;IAGlD,CAAC,WAAW,CACb,CAEgC"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../../src/hooks/use-animation/index.ts"],"sourcesContent":["\"use client\"\n\nimport type { CSSAnimationObject, Token } from \"../../core\"\nimport { useCallback, useRef, useState } from \"react\"\nimport { animation, css, useSystem } from \"../../core\"\nimport { isArray, isUndefined, runIfFn } from \"../../utils\"\n\ntype CSSObject =\n  | Token<CSSAnimationObject, \"animations\">\n  | Token<CSSAnimationObject, \"animations\">[]\n\n/**\n * `useAnimation` is a custom hook that implements animations similar to CSS `keyframes`.\n *\n * @see https://yamada-ui.com/docs/hooks/use-animation\n */\nexport const useAnimation = (cssObj: CSSObject): string => {\n  const system = useSystem()\n\n  if (isArray(cssObj)) {\n    return cssObj.map((cssObj) => animation(cssObj, { css, system })).join(\", \")\n  } else {\n    return animation(cssObj, { css, system })\n  }\n}\n\n/**\n * `useDynamicAnimation` is a custom hook used to switch animations.\n *\n * @see https://yamada-ui.com/docs/hooks/use-dynamic-animation\n */\nexport const useDynamicAnimation = <\n  Y extends\n    | Token<CSSAnimationObject, \"animations\">[]\n    | { [key: string]: CSSObject },\n>(\n  arrayOrObj: Y,\n  init?: (keyof Y)[] | keyof Y,\n): [\n  string | undefined,\n  (\n    key:\n      | ((key: (keyof Y)[] | keyof Y | undefined) => (keyof Y)[] | keyof Y)\n      | (keyof Y)[]\n      | keyof Y,\n  ) => void,\n] => {\n  const system = useSystem()\n\n  const keys = useRef<string | string[] | undefined>(\n    !isUndefined(init)\n      ? isArray(init)\n        ? init.map(String)\n        : String(init)\n      : undefined,\n  )\n  const cache = useRef<Map<string, string>>(new Map<string, string>())\n\n  const [animations, setAnimations] = useState<string | undefined>(() => {\n    for (const [key, styles] of Object.entries(arrayOrObj)) {\n      if (isArray(styles)) {\n        cache.current.set(\n          key,\n          styles.map((style) => animation(style, { css, system })).join(\", \"),\n        )\n      } else {\n        cache.current.set(key, animation(styles, { css, system }))\n      }\n    }\n\n    if (isArray(keys.current)) {\n      return keys.current.map((key) => cache.current.get(key)).join(\", \")\n    } else {\n      return cache.current.get(keys.current ?? \"\")\n    }\n  })\n\n  const setAnimation = useCallback(\n    (\n      keysOrFunc:\n        | ((key: (keyof Y)[] | keyof Y | undefined) => (keyof Y)[] | keyof Y)\n        | (keyof Y)[]\n        | keyof Y,\n    ) => {\n      const args = (() => {\n        if (!isUndefined(keys.current) && isArray(arrayOrObj)) {\n          return isArray(keys.current)\n            ? keys.current.map(Number)\n            : Number(keys.current)\n        } else {\n          return keys.current\n        }\n      })() as (keyof Y)[] | keyof Y | undefined\n\n      const keyOrArray = runIfFn(keysOrFunc, args)\n\n      keys.current = isArray(keyOrArray)\n        ? keyOrArray.map(String)\n        : String(keyOrArray)\n\n      if (isArray(keys.current)) {\n        setAnimations(\n          keys.current.map((key) => cache.current.get(key)).join(\", \"),\n        )\n      } else {\n        setAnimations(cache.current.get(keys.current))\n      }\n    },\n    [arrayOrObj],\n  )\n\n  return [animations, setAnimation]\n}\n"],"mappings":";;;;;;;;;;;;AAgBA,MAAa,gBAAgB,WAA8B;CACzD,MAAM,SAAS,WAAW;CAE1B,KAAA,GAAA,cAAA,SAAY,OAAO,EACjB,OAAO,OAAO,KAAK,WAAW,UAAU,QAAQ;EAAE;EAAK;EAAQ,CAAC,CAAC,CAAC,KAAK,KAAK;MAE5E,OAAO,UAAU,QAAQ;EAAE;EAAK;EAAQ,CAAC;;;;;;;AAS7C,MAAa,uBAKX,YACA,SASG;CACH,MAAM,SAAS,WAAW;CAE1B,MAAM,OAAO,OACX,EAAA,GAAA,cAAA,aAAa,KAAK,IAAA,GAAA,cAAA,SACN,KAAK,GACX,KAAK,IAAI,OAAO,GAChB,OAAO,KAAK,GACd,KAAA,EACL;CACD,MAAM,QAAQ,uBAA4B,IAAI,KAAqB,CAAC;CAEpE,MAAM,CAAC,YAAY,iBAAiB,eAAmC;EACrE,KAAK,MAAM,CAAC,KAAK,WAAW,OAAO,QAAQ,WAAW,EACpD,KAAA,GAAA,cAAA,SAAY,OAAO,EACjB,MAAM,QAAQ,IACZ,KACA,OAAO,KAAK,UAAU,UAAU,OAAO;GAAE;GAAK;GAAQ,CAAC,CAAC,CAAC,KAAK,KAAK,CACpE;OAED,MAAM,QAAQ,IAAI,KAAK,UAAU,QAAQ;GAAE;GAAK;GAAQ,CAAC,CAAC;EAI9D,KAAA,GAAA,cAAA,SAAY,KAAK,QAAQ,EACvB,OAAO,KAAK,QAAQ,KAAK,QAAQ,MAAM,QAAQ,IAAI,IAAI,CAAC,CAAC,KAAK,KAAK;OAEnE,OAAO,MAAM,QAAQ,IAAI,KAAK,WAAW,GAAG;GAE9C;CAoCF,OAAO,CAAC,YAlCa,aAEjB,eAIG;EAWH,MAAM,cAAA,GAAA,cAAA,SAAqB,mBAVP;GAClB,IAAI,EAAA,GAAA,cAAA,aAAa,KAAK,QAAQ,KAAA,GAAA,cAAA,SAAY,WAAW,EACnD,QAAA,GAAA,cAAA,SAAe,KAAK,QAAQ,GACxB,KAAK,QAAQ,IAAI,OAAO,GACxB,OAAO,KAAK,QAAQ;QAExB,OAAO,KAAK;MAI2B,CAAC;EAE5C,KAAK,WAAA,GAAA,cAAA,SAAkB,WAAW,GAC9B,WAAW,IAAI,OAAO,GACtB,OAAO,WAAW;EAEtB,KAAA,GAAA,cAAA,SAAY,KAAK,QAAQ,EACvB,cACE,KAAK,QAAQ,KAAK,QAAQ,MAAM,QAAQ,IAAI,IAAI,CAAC,CAAC,KAAK,KAAK,CAC7D;OAED,cAAc,MAAM,QAAQ,IAAI,KAAK,QAAQ,CAAC;IAGlD,CAAC,WAAW,CAGkB,CAAC"}

package/dist/esm/hooks/use-async/index.js

@@ -1,8 +1,6 @@
 "use client";
-
 import { useMounted } from "../use-mounted/index.js";
 import { useCallback, useEffect, useRef, useState } from "react";
-
 //#region src/hooks/use-async/index.ts
 /**
 * `useAsync` is a custom hook that executes an asynchronous function and tracks its state.
@@ -54,7 +52,7 @@ function useAsyncRetry(func, deps = []) {
 		retry
 	};
 }
-
 //#endregion
 export { useAsync, useAsyncFunc, useAsyncRetry };
+
 //# sourceMappingURL=index.js.map

package/dist/esm/hooks/use-async/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../../src/hooks/use-async/index.ts"],"sourcesContent":["\"use client\"\n\nimport type { DependencyList } from \"react\"\nimport { useCallback, useEffect, useRef, useState } from \"react\"\nimport { useMounted } from \"../use-mounted\"\n\nexport type FunctionReturningPromise = (...args: any[]) => Promise<any>\n\n/**\n * `useAsync` is a custom hook that executes an asynchronous function and tracks its state.\n *\n * @see https://yamada-ui.com/docs/hooks/use-async\n */\nexport function useAsync<Y extends FunctionReturningPromise>(\n  func: Y,\n  deps: DependencyList = [],\n) {\n  const [state, callback] = useAsyncFunc(func, deps, { loading: true })\n\n  useEffect(() => {\n    callback()\n  }, [callback])\n\n  return state\n}\n\nexport type AsyncState<Y> =\n  | {\n      error: Error\n      loading: false\n      value?: undefined\n    }\n  | {\n      loading: boolean\n      error?: undefined\n      value?: undefined\n    }\n  | {\n      loading: false\n      value: Y\n      error?: undefined\n    }\n  | {\n      loading: true\n      error?: Error | undefined\n      value?: Y\n    }\n\nexport type PromiseType<P extends Promise<any>> =\n  P extends Promise<infer Y> ? Y : never\n\ntype StateFromFunctionReturningPromise<Y extends FunctionReturningPromise> =\n  AsyncState<PromiseType<ReturnType<Y>>>\n\nexport type AsyncFnReturn<\n  Y extends FunctionReturningPromise = FunctionReturningPromise,\n> = [StateFromFunctionReturningPromise<Y>, Y]\n\nexport function useAsyncFunc<Y extends FunctionReturningPromise>(\n  func: Y,\n  deps: DependencyList = [],\n  initialState: StateFromFunctionReturningPromise<Y> = { loading: false },\n): AsyncFnReturn<Y> {\n  const lastCallId = useRef(0)\n  const mounted = useMounted()\n  const [state, setState] =\n    useState<StateFromFunctionReturningPromise<Y>>(initialState)\n\n  const callback = useCallback(\n    (...args: Parameters<Y>): ReturnType<Y> => {\n      const callId = ++lastCallId.current\n\n      if (!state.loading)\n        setState((prevState) => ({ ...prevState, loading: true }))\n\n      return func(...args).then(\n        (value) => {\n          if (mounted() && callId === lastCallId.current)\n            setState({ loading: false, value })\n\n          return value\n        },\n        (error) => {\n          if (mounted() && callId === lastCallId.current)\n            setState({ error, loading: false })\n\n          return error\n        },\n      ) as ReturnType<Y>\n    },\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    deps,\n  )\n\n  return [state, callback as unknown as Y]\n}\n\nexport type AsyncStateRetry<Y> = AsyncState<Y> & {\n  retry(): void\n}\n\nexport function useAsyncRetry<Y>(\n  func: () => Promise<Y>,\n  deps: DependencyList = [],\n) {\n  const [attempt, setAttempt] = useState<number>(0)\n  const state = useAsync(func, [...deps, attempt])\n\n  const stateLoading = state.loading\n\n  const retry = useCallback(() => {\n    if (stateLoading) return\n\n    setAttempt((currentAttempt) => currentAttempt + 1)\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [...deps, stateLoading])\n\n  return { ...state, retry }\n}\n"],"mappings":";;;;;;;;;;;AAaA,SAAgB,SACd,MACA,OAAuB,EAAE,EACzB;CACA,MAAM,CAAC,OAAO,YAAY,aAAa,MAAM,MAAM,EAAE,SAAS,MAAM,CAAC;AAErE,iBAAgB;AACd,YAAU;IACT,CAAC,SAAS,CAAC;AAEd,QAAO;;AAmCT,SAAgB,aACd,MACA,OAAuB,EAAE,EACzB,eAAqD,EAAE,SAAS,OAAO,EACrD;CAClB,MAAM,aAAa,OAAO,EAAE;CAC5B,MAAM,UAAU,YAAY;CAC5B,MAAM,CAAC,OAAO,YACZ,SAA+C,aAAa;AA4B9D,QAAO,CAAC,OA1BS,aACd,GAAG,SAAuC;EACzC,MAAM,SAAS,EAAE,WAAW;AAE5B,MAAI,CAAC,MAAM,QACT,WAAU,eAAe;GAAE,GAAG;GAAW,SAAS;GAAM,EAAE;AAE5D,SAAO,KAAK,GAAG,KAAK,CAAC,MAClB,UAAU;AACT,OAAI,SAAS,IAAI,WAAW,WAAW,QACrC,UAAS;IAAE,SAAS;IAAO;IAAO,CAAC;AAErC,UAAO;MAER,UAAU;AACT,OAAI,SAAS,IAAI,WAAW,WAAW,QACrC,UAAS;IAAE;IAAO,SAAS;IAAO,CAAC;AAErC,UAAO;IAEV;IAGH,KACD,CAEuC;;AAO1C,SAAgB,cACd,MACA,OAAuB,EAAE,EACzB;CACA,MAAM,CAAC,SAAS,cAAc,SAAiB,EAAE;CACjD,MAAM,QAAQ,SAAS,MAAM,CAAC,GAAG,MAAM,QAAQ,CAAC;CAEhD,MAAM,eAAe,MAAM;CAE3B,MAAM,QAAQ,kBAAkB;AAC9B,MAAI,aAAc;AAElB,cAAY,mBAAmB,iBAAiB,EAAE;IAEjD,CAAC,GAAG,MAAM,aAAa,CAAC;AAE3B,QAAO;EAAE,GAAG;EAAO;EAAO"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../../src/hooks/use-async/index.ts"],"sourcesContent":["\"use client\"\n\nimport type { DependencyList } from \"react\"\nimport { useCallback, useEffect, useRef, useState } from \"react\"\nimport { useMounted } from \"../use-mounted\"\n\nexport type FunctionReturningPromise = (...args: any[]) => Promise<any>\n\n/**\n * `useAsync` is a custom hook that executes an asynchronous function and tracks its state.\n *\n * @see https://yamada-ui.com/docs/hooks/use-async\n */\nexport function useAsync<Y extends FunctionReturningPromise>(\n  func: Y,\n  deps: DependencyList = [],\n) {\n  const [state, callback] = useAsyncFunc(func, deps, { loading: true })\n\n  useEffect(() => {\n    callback()\n  }, [callback])\n\n  return state\n}\n\nexport type AsyncState<Y> =\n  | {\n      error: Error\n      loading: false\n      value?: undefined\n    }\n  | {\n      loading: boolean\n      error?: undefined\n      value?: undefined\n    }\n  | {\n      loading: false\n      value: Y\n      error?: undefined\n    }\n  | {\n      loading: true\n      error?: Error | undefined\n      value?: Y\n    }\n\nexport type PromiseType<P extends Promise<any>> =\n  P extends Promise<infer Y> ? Y : never\n\ntype StateFromFunctionReturningPromise<Y extends FunctionReturningPromise> =\n  AsyncState<PromiseType<ReturnType<Y>>>\n\nexport type AsyncFnReturn<\n  Y extends FunctionReturningPromise = FunctionReturningPromise,\n> = [StateFromFunctionReturningPromise<Y>, Y]\n\nexport function useAsyncFunc<Y extends FunctionReturningPromise>(\n  func: Y,\n  deps: DependencyList = [],\n  initialState: StateFromFunctionReturningPromise<Y> = { loading: false },\n): AsyncFnReturn<Y> {\n  const lastCallId = useRef(0)\n  const mounted = useMounted()\n  const [state, setState] =\n    useState<StateFromFunctionReturningPromise<Y>>(initialState)\n\n  const callback = useCallback(\n    (...args: Parameters<Y>): ReturnType<Y> => {\n      const callId = ++lastCallId.current\n\n      if (!state.loading)\n        setState((prevState) => ({ ...prevState, loading: true }))\n\n      return func(...args).then(\n        (value) => {\n          if (mounted() && callId === lastCallId.current)\n            setState({ loading: false, value })\n\n          return value\n        },\n        (error) => {\n          if (mounted() && callId === lastCallId.current)\n            setState({ error, loading: false })\n\n          return error\n        },\n      ) as ReturnType<Y>\n    },\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    deps,\n  )\n\n  return [state, callback as unknown as Y]\n}\n\nexport type AsyncStateRetry<Y> = AsyncState<Y> & {\n  retry(): void\n}\n\nexport function useAsyncRetry<Y>(\n  func: () => Promise<Y>,\n  deps: DependencyList = [],\n) {\n  const [attempt, setAttempt] = useState<number>(0)\n  const state = useAsync(func, [...deps, attempt])\n\n  const stateLoading = state.loading\n\n  const retry = useCallback(() => {\n    if (stateLoading) return\n\n    setAttempt((currentAttempt) => currentAttempt + 1)\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [...deps, stateLoading])\n\n  return { ...state, retry }\n}\n"],"mappings":";;;;;;;;;AAaA,SAAgB,SACd,MACA,OAAuB,EAAE,EACzB;CACA,MAAM,CAAC,OAAO,YAAY,aAAa,MAAM,MAAM,EAAE,SAAS,MAAM,CAAC;CAErE,gBAAgB;EACd,UAAU;IACT,CAAC,SAAS,CAAC;CAEd,OAAO;;AAmCT,SAAgB,aACd,MACA,OAAuB,EAAE,EACzB,eAAqD,EAAE,SAAS,OAAO,EACrD;CAClB,MAAM,aAAa,OAAO,EAAE;CAC5B,MAAM,UAAU,YAAY;CAC5B,MAAM,CAAC,OAAO,YACZ,SAA+C,aAAa;CA4B9D,OAAO,CAAC,OA1BS,aACd,GAAG,SAAuC;EACzC,MAAM,SAAS,EAAE,WAAW;EAE5B,IAAI,CAAC,MAAM,SACT,UAAU,eAAe;GAAE,GAAG;GAAW,SAAS;GAAM,EAAE;EAE5D,OAAO,KAAK,GAAG,KAAK,CAAC,MAClB,UAAU;GACT,IAAI,SAAS,IAAI,WAAW,WAAW,SACrC,SAAS;IAAE,SAAS;IAAO;IAAO,CAAC;GAErC,OAAO;MAER,UAAU;GACT,IAAI,SAAS,IAAI,WAAW,WAAW,SACrC,SAAS;IAAE;IAAO,SAAS;IAAO,CAAC;GAErC,OAAO;IAEV;IAGH,KAGqB,CAAiB;;AAO1C,SAAgB,cACd,MACA,OAAuB,EAAE,EACzB;CACA,MAAM,CAAC,SAAS,cAAc,SAAiB,EAAE;CACjD,MAAM,QAAQ,SAAS,MAAM,CAAC,GAAG,MAAM,QAAQ,CAAC;CAEhD,MAAM,eAAe,MAAM;CAE3B,MAAM,QAAQ,kBAAkB;EAC9B,IAAI,cAAc;EAElB,YAAY,mBAAmB,iBAAiB,EAAE;IAEjD,CAAC,GAAG,MAAM,aAAa,CAAC;CAE3B,OAAO;EAAE,GAAG;EAAO;EAAO"}

package/dist/esm/hooks/use-async-callback/index.js

@@ -1,9 +1,7 @@
 import { useCallbackRef } from "../../utils/ref.js";
 import { useLoading } from "../../components/loading/loading-provider.js";
-import "../../components/loading/index.js";
 import { useProcessing } from "../use-processing/index.js";
 import { useCallback, useMemo } from "react";
-
 //#region src/hooks/use-async-callback/index.ts
 /**
 * `useAsyncCallback` is a custom hook used to manage async callbacks.
@@ -42,7 +40,7 @@ const useAsyncCallback = (callback, deps, { loading: method = false, loadingOpti
 		}), [finish, start])
 	];
 };
-
 //#endregion
 export { useAsyncCallback };
+
 //# sourceMappingURL=index.js.map

package/dist/esm/hooks/use-async-callback/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../../src/hooks/use-async-callback/index.ts"],"sourcesContent":["import type { DependencyList } from \"react\"\nimport type { Loading } from \"../../components/loading\"\nimport { useCallback, useMemo } from \"react\"\nimport { useLoading } from \"../../components/loading\"\nimport { useCallbackRef } from \"../../utils/ref\"\nimport { useProcessing } from \"../use-processing\"\n\ntype Callback = (...args: any[]) => any\n\nexport interface UseAsyncCallbackOptions {\n  /**\n   * The method to use for loading.\n   * If `false`, the loading will not be shown.\n   */\n  loading?: false | Loading.Method\n  /**\n   * The options to pass to the loading component.\n   */\n  loadingOptions?: Loading.Options\n  /**\n   * If `false`, the processing will not change.\n   *\n   * @default true\n   */\n  processing?: boolean\n}\n\n/**\n * `useAsyncCallback` is a custom hook used to manage async callbacks.\n *\n * @see https://yamada-ui.com/docs/hooks/use-async-callback\n */\nexport const useAsyncCallback = <Y extends Callback>(\n  callback: Y,\n  deps: DependencyList,\n  {\n    loading: method = false,\n    loadingOptions,\n    processing: shouldProcessing = true,\n  }: UseAsyncCallbackOptions = {},\n): UseAsyncCallbackReturn<Y> => {\n  const context = useLoading()\n  const { finish, loading, start } = useProcessing()\n  const shouldLoading = !!method\n  const callbackRef = useCallbackRef(callback, deps)\n\n  const asyncCallback = useCallback(\n    async (...args: Parameters<Y>) => {\n      try {\n        if (shouldProcessing) start()\n        if (shouldLoading) context[method].start(loadingOptions)\n\n        return await callbackRef(...args)\n      } finally {\n        if (shouldProcessing) finish()\n        if (shouldLoading) context[method].finish()\n      }\n    },\n    [\n      callbackRef,\n      shouldProcessing,\n      shouldLoading,\n      context,\n      method,\n      loadingOptions,\n      start,\n      finish,\n    ],\n  )\n\n  const control = useMemo(() => ({ finish, start }), [finish, start])\n\n  return [loading, asyncCallback, control]\n}\n\nexport type UseAsyncCallbackReturn<Y extends Callback> = [\n  loading: boolean,\n  callback: (...args: Parameters<Y>) => Promise<Awaited<ReturnType<Y>>>,\n  control: { finish: () => void; start: () => void },\n]\n"],"mappings":";;;;;;;;;;;;AAgCA,MAAa,oBACX,UACA,MACA,EACE,SAAS,SAAS,OAClB,gBACA,YAAY,mBAAmB,SACJ,EAAE,KACD;CAC9B,MAAM,UAAU,YAAY;CAC5B,MAAM,EAAE,QAAQ,SAAS,UAAU,eAAe;CAClD,MAAM,gBAAgB,CAAC,CAAC;CACxB,MAAM,cAAc,eAAe,UAAU,KAAK;AA4BlD,QAAO;EAAC;EA1Bc,YACpB,OAAO,GAAG,SAAwB;AAChC,OAAI;AACF,QAAI,iBAAkB,QAAO;AAC7B,QAAI,cAAe,SAAQ,QAAQ,MAAM,eAAe;AAExD,WAAO,MAAM,YAAY,GAAG,KAAK;aACzB;AACR,QAAI,iBAAkB,SAAQ;AAC9B,QAAI,cAAe,SAAQ,QAAQ,QAAQ;;KAG/C;GACE;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACD,CACF;EAEe,eAAe;GAAE;GAAQ;GAAO,GAAG,CAAC,QAAQ,MAAM,CAAC;EAE3B"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../../src/hooks/use-async-callback/index.ts"],"sourcesContent":["import type { DependencyList } from \"react\"\nimport type { Loading } from \"../../components/loading\"\nimport { useCallback, useMemo } from \"react\"\nimport { useLoading } from \"../../components/loading\"\nimport { useCallbackRef } from \"../../utils/ref\"\nimport { useProcessing } from \"../use-processing\"\n\ntype Callback = (...args: any[]) => any\n\nexport interface UseAsyncCallbackOptions {\n  /**\n   * The method to use for loading.\n   * If `false`, the loading will not be shown.\n   */\n  loading?: false | Loading.Method\n  /**\n   * The options to pass to the loading component.\n   */\n  loadingOptions?: Loading.Options\n  /**\n   * If `false`, the processing will not change.\n   *\n   * @default true\n   */\n  processing?: boolean\n}\n\n/**\n * `useAsyncCallback` is a custom hook used to manage async callbacks.\n *\n * @see https://yamada-ui.com/docs/hooks/use-async-callback\n */\nexport const useAsyncCallback = <Y extends Callback>(\n  callback: Y,\n  deps: DependencyList,\n  {\n    loading: method = false,\n    loadingOptions,\n    processing: shouldProcessing = true,\n  }: UseAsyncCallbackOptions = {},\n): UseAsyncCallbackReturn<Y> => {\n  const context = useLoading()\n  const { finish, loading, start } = useProcessing()\n  const shouldLoading = !!method\n  const callbackRef = useCallbackRef(callback, deps)\n\n  const asyncCallback = useCallback(\n    async (...args: Parameters<Y>) => {\n      try {\n        if (shouldProcessing) start()\n        if (shouldLoading) context[method].start(loadingOptions)\n\n        return await callbackRef(...args)\n      } finally {\n        if (shouldProcessing) finish()\n        if (shouldLoading) context[method].finish()\n      }\n    },\n    [\n      callbackRef,\n      shouldProcessing,\n      shouldLoading,\n      context,\n      method,\n      loadingOptions,\n      start,\n      finish,\n    ],\n  )\n\n  const control = useMemo(() => ({ finish, start }), [finish, start])\n\n  return [loading, asyncCallback, control]\n}\n\nexport type UseAsyncCallbackReturn<Y extends Callback> = [\n  loading: boolean,\n  callback: (...args: Parameters<Y>) => Promise<Awaited<ReturnType<Y>>>,\n  control: { finish: () => void; start: () => void },\n]\n"],"mappings":";;;;;;;;;;AAgCA,MAAa,oBACX,UACA,MACA,EACE,SAAS,SAAS,OAClB,gBACA,YAAY,mBAAmB,SACJ,EAAE,KACD;CAC9B,MAAM,UAAU,YAAY;CAC5B,MAAM,EAAE,QAAQ,SAAS,UAAU,eAAe;CAClD,MAAM,gBAAgB,CAAC,CAAC;CACxB,MAAM,cAAc,eAAe,UAAU,KAAK;CA4BlD,OAAO;EAAC;EA1Bc,YACpB,OAAO,GAAG,SAAwB;GAChC,IAAI;IACF,IAAI,kBAAkB,OAAO;IAC7B,IAAI,eAAe,QAAQ,QAAQ,MAAM,eAAe;IAExD,OAAO,MAAM,YAAY,GAAG,KAAK;aACzB;IACR,IAAI,kBAAkB,QAAQ;IAC9B,IAAI,eAAe,QAAQ,QAAQ,QAAQ;;KAG/C;GACE;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACD,CAK2B;EAFd,eAAe;GAAE;GAAQ;GAAO,GAAG,CAAC,QAAQ,MAAM,CAE3B;EAAC"}

package/dist/esm/hooks/use-boolean/index.js

@@ -1,7 +1,5 @@
 "use client";
-
 import { useCallback, useState } from "react";
-
 //#region src/hooks/use-boolean/index.ts
 /**
 * `useBoolean` is a custom hook used to manage boolean values using `on`, `off`, and `toggle` functions.
@@ -17,7 +15,7 @@ const useBoolean = (init = false) => {
 		on
 	}];
 };
-
 //#endregion
 export { useBoolean };
+
 //# sourceMappingURL=index.js.map

package/dist/esm/hooks/use-boolean/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../../src/hooks/use-boolean/index.ts"],"sourcesContent":["\"use client\"\n\nimport { useCallback, useState } from \"react\"\n\n/**\n * `useBoolean` is a custom hook used to manage boolean values using `on`, `off`, and `toggle` functions.\n *\n * @see https://yamada-ui.com/docs/hooks/use-boolean\n */\nexport const useBoolean = (init = false): UseBooleanReturn => {\n  const [flg, setFlg] = useState<boolean>(init)\n\n  const on = useCallback(() => setFlg(true), [])\n\n  const off = useCallback(() => setFlg(false), [])\n\n  const toggle = useCallback(() => setFlg((prev) => !prev), [])\n\n  return [flg, { off, toggle, on }]\n}\n\nexport type UseBooleanReturn = [\n  flg: boolean,\n  setFlg: { off: () => void; on: () => void; toggle: () => void },\n]\n"],"mappings":";;;;;;;;;;AASA,MAAa,cAAc,OAAO,UAA4B;CAC5D,MAAM,CAAC,KAAK,UAAU,SAAkB,KAAK;CAE7C,MAAM,KAAK,kBAAkB,OAAO,KAAK,EAAE,EAAE,CAAC;AAM9C,QAAO,CAAC,KAAK;EAAE,KAJH,kBAAkB,OAAO,MAAM,EAAE,EAAE,CAAC;EAI5B,QAFL,kBAAkB,QAAQ,SAAS,CAAC,KAAK,EAAE,EAAE,CAAC;EAEjC;EAAI,CAAC"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../../src/hooks/use-boolean/index.ts"],"sourcesContent":["\"use client\"\n\nimport { useCallback, useState } from \"react\"\n\n/**\n * `useBoolean` is a custom hook used to manage boolean values using `on`, `off`, and `toggle` functions.\n *\n * @see https://yamada-ui.com/docs/hooks/use-boolean\n */\nexport const useBoolean = (init = false): UseBooleanReturn => {\n  const [flg, setFlg] = useState<boolean>(init)\n\n  const on = useCallback(() => setFlg(true), [])\n\n  const off = useCallback(() => setFlg(false), [])\n\n  const toggle = useCallback(() => setFlg((prev) => !prev), [])\n\n  return [flg, { off, toggle, on }]\n}\n\nexport type UseBooleanReturn = [\n  flg: boolean,\n  setFlg: { off: () => void; on: () => void; toggle: () => void },\n]\n"],"mappings":";;;;;;;;AASA,MAAa,cAAc,OAAO,UAA4B;CAC5D,MAAM,CAAC,KAAK,UAAU,SAAkB,KAAK;CAE7C,MAAM,KAAK,kBAAkB,OAAO,KAAK,EAAE,EAAE,CAAC;CAM9C,OAAO,CAAC,KAAK;EAAE,KAJH,kBAAkB,OAAO,MAAM,EAAE,EAAE,CAI7B;EAAE,QAFL,kBAAkB,QAAQ,SAAS,CAAC,KAAK,EAAE,EAAE,CAElC;EAAE;EAAI,CAAC"}

package/dist/esm/hooks/use-breakpoint/index.js

@@ -3,5 +3,4 @@ import { useBreakpointEffect } from "./use-breakpoint-effect.js";
 import { getBreakpointValue, useBreakpointValue } from "./use-breakpoint-value.js";
 import { useBreakpointState } from "./use-breakpoint-state.js";
 import { useUpdateBreakpointEffect } from "./use-update-breakpoint-effect.js";
-
-export { getBreakpointValue, useBreakpoint, useBreakpointEffect, useBreakpointState, useBreakpointValue, useUpdateBreakpointEffect };
+export { getBreakpointValue, useBreakpoint, useBreakpointEffect, useBreakpointState, useBreakpointValue, useUpdateBreakpointEffect };

package/dist/esm/hooks/use-breakpoint/use-breakpoint-effect.js

@@ -1,8 +1,6 @@
 "use client";
-
 import { useBreakpoint } from "./use-breakpoint.js";
 import { useEffect } from "react";
-
 //#region src/hooks/use-breakpoint/use-breakpoint-effect.ts
 /**
 * `useBreakpointEffect` is a custom hook that executes a specific callback function when the breakpoint changes.
@@ -15,7 +13,7 @@ const useBreakpointEffect = (callback, deps) => {
 		callback(breakpoint);
 	}, [breakpoint, ...deps]);
 };
-
 //#endregion
 export { useBreakpointEffect };
+
 //# sourceMappingURL=use-breakpoint-effect.js.map

package/dist/esm/hooks/use-breakpoint/use-breakpoint-effect.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-breakpoint-effect.js","names":[],"sources":["../../../../src/hooks/use-breakpoint/use-breakpoint-effect.ts"],"sourcesContent":["\"use client\"\n\nimport type { DependencyList } from \"react\"\nimport type { Breakpoint } from \"../../core\"\nimport { useEffect } from \"react\"\nimport { useBreakpoint } from \"./use-breakpoint\"\n\n/**\n * `useBreakpointEffect` is a custom hook that executes a specific callback function when the breakpoint changes.\n *\n * @see https://yamada-ui.com/docs/hooks/use-breakpoint-effect\n */\nexport const useBreakpointEffect = (\n  callback: (breakpoint: Breakpoint) => void,\n  deps: DependencyList,\n) => {\n  const breakpoint = useBreakpoint()\n\n  useEffect(() => {\n    callback(breakpoint)\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [breakpoint, ...deps])\n}\n"],"mappings":";;;;;;;;;;;AAYA,MAAa,uBACX,UACA,SACG;CACH,MAAM,aAAa,eAAe;AAElC,iBAAgB;AACd,WAAS,WAAW;IAEnB,CAAC,YAAY,GAAG,KAAK,CAAC"}
+{"version":3,"file":"use-breakpoint-effect.js","names":[],"sources":["../../../../src/hooks/use-breakpoint/use-breakpoint-effect.ts"],"sourcesContent":["\"use client\"\n\nimport type { DependencyList } from \"react\"\nimport type { Breakpoint } from \"../../core\"\nimport { useEffect } from \"react\"\nimport { useBreakpoint } from \"./use-breakpoint\"\n\n/**\n * `useBreakpointEffect` is a custom hook that executes a specific callback function when the breakpoint changes.\n *\n * @see https://yamada-ui.com/docs/hooks/use-breakpoint-effect\n */\nexport const useBreakpointEffect = (\n  callback: (breakpoint: Breakpoint) => void,\n  deps: DependencyList,\n) => {\n  const breakpoint = useBreakpoint()\n\n  useEffect(() => {\n    callback(breakpoint)\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [breakpoint, ...deps])\n}\n"],"mappings":";;;;;;;;;AAYA,MAAa,uBACX,UACA,SACG;CACH,MAAM,aAAa,eAAe;CAElC,gBAAgB;EACd,SAAS,WAAW;IAEnB,CAAC,YAAY,GAAG,KAAK,CAAC"}

package/dist/esm/hooks/use-breakpoint/use-breakpoint-state.js

@@ -1,8 +1,6 @@
 "use client";
-
 import { useBreakpointValue } from "./use-breakpoint-value.js";
 import { useState } from "react";
-
 //#region src/hooks/use-breakpoint/use-breakpoint-state.ts
 /**
 * `useBreakpointState` is a custom hook that takes a responsive object as an initial state and returns a state corresponding to the current breakpoint.
@@ -12,7 +10,7 @@ import { useState } from "react";
 const useBreakpointState = (initialState) => {
 	return useState(useBreakpointValue(initialState));
 };
-
 //#endregion
 export { useBreakpointState };
+
 //# sourceMappingURL=use-breakpoint-state.js.map

package/dist/esm/hooks/use-breakpoint/use-breakpoint-state.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-breakpoint-state.js","names":[],"sources":["../../../../src/hooks/use-breakpoint/use-breakpoint-state.ts"],"sourcesContent":["\"use client\"\n\nimport type { ResponsiveObject } from \"../../core\"\nimport { useState } from \"react\"\nimport { useBreakpointValue } from \"./use-breakpoint-value\"\n\n/**\n * `useBreakpointState` is a custom hook that takes a responsive object as an initial state and returns a state corresponding to the current breakpoint.\n *\n * @see https://yamada-ui.com/docs/hooks/use-breakpoint-state\n */\nexport const useBreakpointState = <Y>(\n  initialState: ResponsiveObject<Y, false>,\n) => {\n  const state = useBreakpointValue(initialState)\n\n  return useState(state)\n}\n"],"mappings":";;;;;;;;;;;AAWA,MAAa,sBACX,iBACG;AAGH,QAAO,SAFO,mBAAmB,aAAa,CAExB"}
+{"version":3,"file":"use-breakpoint-state.js","names":[],"sources":["../../../../src/hooks/use-breakpoint/use-breakpoint-state.ts"],"sourcesContent":["\"use client\"\n\nimport type { ResponsiveObject } from \"../../core\"\nimport { useState } from \"react\"\nimport { useBreakpointValue } from \"./use-breakpoint-value\"\n\n/**\n * `useBreakpointState` is a custom hook that takes a responsive object as an initial state and returns a state corresponding to the current breakpoint.\n *\n * @see https://yamada-ui.com/docs/hooks/use-breakpoint-state\n */\nexport const useBreakpointState = <Y>(\n  initialState: ResponsiveObject<Y, false>,\n) => {\n  const state = useBreakpointValue(initialState)\n\n  return useState(state)\n}\n"],"mappings":";;;;;;;;;AAWA,MAAa,sBACX,iBACG;CAGH,OAAO,SAFO,mBAAmB,aAEZ,CAAC"}

package/dist/esm/hooks/use-breakpoint/use-breakpoint-value.js

@@ -1,8 +1,6 @@
 import { useSystem } from "../../core/system/system-provider.js";
-import "../../core/index.js";
 import { useBreakpoint } from "./use-breakpoint.js";
 import { useMemo } from "react";
-
 //#region src/hooks/use-breakpoint/use-breakpoint-value.ts
 /**
 * `useBreakpointValue` is a custom hook that returns the value of the current breakpoint from the provided object.
@@ -29,7 +27,7 @@ const getBreakpointValue = (values = {}) => (system, breakpoint) => {
 	}
 	return values.base;
 };
-
 //#endregion
 export { getBreakpointValue, useBreakpointValue };
+
 //# sourceMappingURL=use-breakpoint-value.js.map

package/dist/esm/hooks/use-breakpoint/use-breakpoint-value.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-breakpoint-value.js","names":[],"sources":["../../../../src/hooks/use-breakpoint/use-breakpoint-value.ts"],"sourcesContent":["import type { Breakpoint, ResponsiveObject, System } from \"../../core\"\nimport { useMemo } from \"react\"\nimport { useSystem } from \"../../core\"\nimport { useBreakpoint } from \"./use-breakpoint\"\n\n/**\n * `useBreakpointValue` is a custom hook that returns the value of the current breakpoint from the provided object.\n * This hook monitors changes in the window size and returns the appropriate value.\n *\n * @see https://yamada-ui.com/docs/hooks/use-breakpoint-value\n */\nexport const useBreakpointValue = <Y>(\n  values: ResponsiveObject<Y, false>,\n): Y => {\n  const system = useSystem()\n  const breakpoint = useBreakpoint()\n\n  return useMemo(\n    () => getBreakpointValue<Y>(values)(system, breakpoint),\n    [values, system, breakpoint],\n  )\n}\n\nexport const getBreakpointValue =\n  <Y>(values: ResponsiveObject<Y, false> = {}) =>\n  (system: System, breakpoint: Breakpoint): Y => {\n    const breakpoints = system.breakpoints.keys\n\n    if (!breakpoints.length) {\n      console.warn(\"getBreakpointValue: `breakpoints` is undefined.\")\n    }\n\n    const currentIndex = breakpoints.indexOf(breakpoint)\n\n    for (let i = currentIndex; 0 < i; i--) {\n      const nextBreakpoint = breakpoints[i]\n\n      if (nextBreakpoint && values.hasOwnProperty(nextBreakpoint)) {\n        return values[nextBreakpoint] as Y\n      }\n    }\n\n    return values.base as Y\n  }\n"],"mappings":";;;;;;;;;;;;AAWA,MAAa,sBACX,WACM;CACN,MAAM,SAAS,WAAW;CAC1B,MAAM,aAAa,eAAe;AAElC,QAAO,cACC,mBAAsB,OAAO,CAAC,QAAQ,WAAW,EACvD;EAAC;EAAQ;EAAQ;EAAW,CAC7B;;AAGH,MAAa,sBACP,SAAqC,EAAE,MAC1C,QAAgB,eAA8B;CAC7C,MAAM,cAAc,OAAO,YAAY;AAEvC,KAAI,CAAC,YAAY,OACf,SAAQ,KAAK,kDAAkD;CAGjE,MAAM,eAAe,YAAY,QAAQ,WAAW;AAEpD,MAAK,IAAI,IAAI,cAAc,IAAI,GAAG,KAAK;EACrC,MAAM,iBAAiB,YAAY;AAEnC,MAAI,kBAAkB,OAAO,eAAe,eAAe,CACzD,QAAO,OAAO;;AAIlB,QAAO,OAAO"}
+{"version":3,"file":"use-breakpoint-value.js","names":[],"sources":["../../../../src/hooks/use-breakpoint/use-breakpoint-value.ts"],"sourcesContent":["import type { Breakpoint, ResponsiveObject, System } from \"../../core\"\nimport { useMemo } from \"react\"\nimport { useSystem } from \"../../core\"\nimport { useBreakpoint } from \"./use-breakpoint\"\n\n/**\n * `useBreakpointValue` is a custom hook that returns the value of the current breakpoint from the provided object.\n * This hook monitors changes in the window size and returns the appropriate value.\n *\n * @see https://yamada-ui.com/docs/hooks/use-breakpoint-value\n */\nexport const useBreakpointValue = <Y>(\n  values: ResponsiveObject<Y, false>,\n): Y => {\n  const system = useSystem()\n  const breakpoint = useBreakpoint()\n\n  return useMemo(\n    () => getBreakpointValue<Y>(values)(system, breakpoint),\n    [values, system, breakpoint],\n  )\n}\n\nexport const getBreakpointValue =\n  <Y>(values: ResponsiveObject<Y, false> = {}) =>\n  (system: System, breakpoint: Breakpoint): Y => {\n    const breakpoints = system.breakpoints.keys\n\n    if (!breakpoints.length) {\n      console.warn(\"getBreakpointValue: `breakpoints` is undefined.\")\n    }\n\n    const currentIndex = breakpoints.indexOf(breakpoint)\n\n    for (let i = currentIndex; 0 < i; i--) {\n      const nextBreakpoint = breakpoints[i]\n\n      if (nextBreakpoint && values.hasOwnProperty(nextBreakpoint)) {\n        return values[nextBreakpoint] as Y\n      }\n    }\n\n    return values.base as Y\n  }\n"],"mappings":";;;;;;;;;;AAWA,MAAa,sBACX,WACM;CACN,MAAM,SAAS,WAAW;CAC1B,MAAM,aAAa,eAAe;CAElC,OAAO,cACC,mBAAsB,OAAO,CAAC,QAAQ,WAAW,EACvD;EAAC;EAAQ;EAAQ;EAAW,CAC7B;;AAGH,MAAa,sBACP,SAAqC,EAAE,MAC1C,QAAgB,eAA8B;CAC7C,MAAM,cAAc,OAAO,YAAY;CAEvC,IAAI,CAAC,YAAY,QACf,QAAQ,KAAK,kDAAkD;CAGjE,MAAM,eAAe,YAAY,QAAQ,WAAW;CAEpD,KAAK,IAAI,IAAI,cAAc,IAAI,GAAG,KAAK;EACrC,MAAM,iBAAiB,YAAY;EAEnC,IAAI,kBAAkB,OAAO,eAAe,eAAe,EACzD,OAAO,OAAO;;CAIlB,OAAO,OAAO"}

package/dist/esm/hooks/use-breakpoint/use-breakpoint.js

@@ -1,11 +1,8 @@
 "use client";
-
 import { utils_exports } from "../../utils/index.js";
 import { useEnvironment } from "../../core/system/environment-provider.js";
 import { useSystem } from "../../core/system/system-provider.js";
-import "../../core/index.js";
 import { useCallback, useMemo, useRef, useSyncExternalStore } from "react";
-
 //#region src/hooks/use-breakpoint/use-breakpoint.ts
 /**
 * `useBreakpoint` is a custom hook that returns the current breakpoint.
@@ -91,7 +88,7 @@ const useBreakpoint = () => {
 	}, []);
 	return useSyncExternalStore(subscribe, getSnapshot, getSnapshot);
 };
-
 //#endregion
 export { useBreakpoint };
+
 //# sourceMappingURL=use-breakpoint.js.map

package/dist/esm/hooks/use-breakpoint/use-breakpoint.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-breakpoint.js","names":["noop"],"sources":["../../../../src/hooks/use-breakpoint/use-breakpoint.ts"],"sourcesContent":["\"use client\"\n\nimport type { Breakpoint } from \"../../core\"\nimport { useCallback, useMemo, useRef, useSyncExternalStore } from \"react\"\nimport { useEnvironment, useSystem } from \"../../core\"\nimport { createdDom, isUndefined, noop } from \"../../utils\"\n\n/**\n * `useBreakpoint` is a custom hook that returns the current breakpoint.\n * This hook monitors changes in the window size and returns the appropriate value.\n *\n * @see https://yamada-ui.com/docs/hooks/use-breakpoint\n */\nexport const useBreakpoint = () => {\n  const animationFrameId = useRef(0)\n  const { breakpoints, config } = useSystem()\n  const { getWindow } = useEnvironment()\n  const {\n    containerRef,\n    direction = \"down\",\n    identifier = \"@media screen\",\n  } = config.breakpoint ?? {}\n  const hasContainer = !!containerRef\n\n  const queries = useMemo(() => {\n    return breakpoints.queries.map(\n      ({ breakpoint, maxW, minMaxQuery, minW }) => {\n        const searchValue =\n          identifier === \"@media screen\"\n            ? \"@media screen and \"\n            : `${identifier} `\n        const query = minMaxQuery?.replace(searchValue, \"\") ?? \"\"\n\n        return {\n          breakpoint,\n          maxW,\n          minW,\n          query,\n        }\n      },\n    )\n  }, [breakpoints, identifier])\n\n  const hasQueries = !!queries.length\n\n  const getBreakpoint = useCallback(\n    (width?: number) => {\n      if (isUndefined(width)) {\n        const win = getWindow()\n\n        if (hasContainer || !hasQueries) return \"base\"\n\n        for (const { breakpoint, query } of queries) {\n          const mql = win?.matchMedia(query)\n\n          if (mql?.matches) return breakpoint\n        }\n      } else {\n        for (const { breakpoint, maxW, minW } of queries) {\n          if (direction !== \"up\") {\n            if ((minW ?? 0) <= width) return breakpoint\n          } else {\n            if (width <= (maxW ?? Infinity)) return breakpoint\n          }\n        }\n      }\n\n      return \"base\"\n    },\n    [direction, getWindow, hasContainer, hasQueries, queries],\n  )\n\n  const breakpointRef = useRef<Breakpoint>(getBreakpoint())\n\n  const subscribe = useCallback(\n    (listener: () => void) => {\n      if (!hasContainer || !hasQueries) {\n        const observer = queries.map(({ breakpoint, query }): (() => void) => {\n          const mql = getWindow()?.matchMedia(query)\n\n          const onChange = (e: MediaQueryListEvent) => {\n            if (e.matches) breakpointRef.current = breakpoint\n\n            listener()\n          }\n\n          mql?.addEventListener(\"change\", onChange)\n\n          return () => {\n            mql?.removeEventListener(\"change\", onChange)\n          }\n        })\n\n        return () => {\n          observer.forEach((unobserve) => unobserve())\n        }\n      } else if (createdDom()) {\n        const observer = new ResizeObserver(([entry]) => {\n          if (!entry) return\n\n          cancelAnimationFrame(animationFrameId.current)\n\n          const { width } = entry.contentRect\n\n          breakpointRef.current = getBreakpoint(width)\n\n          animationFrameId.current = requestAnimationFrame(listener)\n        })\n\n        if (containerRef.current) observer.observe(containerRef.current)\n\n        return () => {\n          observer.disconnect()\n\n          if (process.env.NODE_ENV !== \"test\")\n            cancelAnimationFrame(animationFrameId.current)\n        }\n      } else {\n        return noop\n      }\n    },\n    [containerRef, getBreakpoint, getWindow, hasContainer, hasQueries, queries],\n  )\n\n  const getSnapshot = useCallback(() => {\n    return breakpointRef.current\n  }, [])\n\n  const breakpoint = useSyncExternalStore(subscribe, getSnapshot, getSnapshot)\n\n  return breakpoint\n}\n"],"mappings":";;;;;;;;;;;;;;;AAaA,MAAa,sBAAsB;CACjC,MAAM,mBAAmB,OAAO,EAAE;CAClC,MAAM,EAAE,aAAa,WAAW,WAAW;CAC3C,MAAM,EAAE,cAAc,gBAAgB;CACtC,MAAM,EACJ,cACA,YAAY,QACZ,aAAa,oBACX,OAAO,cAAc,EAAE;CAC3B,MAAM,eAAe,CAAC,CAAC;CAEvB,MAAM,UAAU,cAAc;AAC5B,SAAO,YAAY,QAAQ,KACxB,EAAE,YAAY,MAAM,aAAa,WAAW;GAC3C,MAAM,cACJ,eAAe,kBACX,uBACA,GAAG,WAAW;AAGpB,UAAO;IACL;IACA;IACA;IACA,OANY,aAAa,QAAQ,aAAa,GAAG,IAAI;IAOtD;IAEJ;IACA,CAAC,aAAa,WAAW,CAAC;CAE7B,MAAM,aAAa,CAAC,CAAC,QAAQ;CAE7B,MAAM,gBAAgB,aACnB,UAAmB;AAClB,qCAAgB,MAAM,EAAE;GACtB,MAAM,MAAM,WAAW;AAEvB,OAAI,gBAAgB,CAAC,WAAY,QAAO;AAExC,QAAK,MAAM,EAAE,YAAY,WAAW,QAGlC,MAFY,KAAK,WAAW,MAAM,GAEzB,QAAS,QAAO;QAG3B,MAAK,MAAM,EAAE,YAAY,MAAM,UAAU,QACvC,KAAI,cAAc,MAChB;QAAK,QAAQ,MAAM,MAAO,QAAO;aAE7B,UAAU,QAAQ,UAAW,QAAO;AAK9C,SAAO;IAET;EAAC;EAAW;EAAW;EAAc;EAAY;EAAQ,CAC1D;CAED,MAAM,gBAAgB,OAAmB,eAAe,CAAC;CAEzD,MAAM,YAAY,aACf,aAAyB;AACxB,MAAI,CAAC,gBAAgB,CAAC,YAAY;GAChC,MAAM,WAAW,QAAQ,KAAK,EAAE,YAAY,YAA0B;IACpE,MAAM,MAAM,WAAW,EAAE,WAAW,MAAM;IAE1C,MAAM,YAAY,MAA2B;AAC3C,SAAI,EAAE,QAAS,eAAc,UAAU;AAEvC,eAAU;;AAGZ,SAAK,iBAAiB,UAAU,SAAS;AAEzC,iBAAa;AACX,UAAK,oBAAoB,UAAU,SAAS;;KAE9C;AAEF,gBAAa;AACX,aAAS,SAAS,cAAc,WAAW,CAAC;;4CAEzB,EAAE;GACvB,MAAM,WAAW,IAAI,gBAAgB,CAAC,WAAW;AAC/C,QAAI,CAAC,MAAO;AAEZ,yBAAqB,iBAAiB,QAAQ;IAE9C,MAAM,EAAE,UAAU,MAAM;AAExB,kBAAc,UAAU,cAAc,MAAM;AAE5C,qBAAiB,UAAU,sBAAsB,SAAS;KAC1D;AAEF,OAAI,aAAa,QAAS,UAAS,QAAQ,aAAa,QAAQ;AAEhE,gBAAa;AACX,aAAS,YAAY;AAGnB,yBAAqB,iBAAiB,QAAQ;;QAGlD,QAAOA;IAGX;EAAC;EAAc;EAAe;EAAW;EAAc;EAAY;EAAQ,CAC5E;CAED,MAAM,cAAc,kBAAkB;AACpC,SAAO,cAAc;IACpB,EAAE,CAAC;AAIN,QAFmB,qBAAqB,WAAW,aAAa,YAAY"}
+{"version":3,"file":"use-breakpoint.js","names":["noop"],"sources":["../../../../src/hooks/use-breakpoint/use-breakpoint.ts"],"sourcesContent":["\"use client\"\n\nimport type { Breakpoint } from \"../../core\"\nimport { useCallback, useMemo, useRef, useSyncExternalStore } from \"react\"\nimport { useEnvironment, useSystem } from \"../../core\"\nimport { createdDom, isUndefined, noop } from \"../../utils\"\n\n/**\n * `useBreakpoint` is a custom hook that returns the current breakpoint.\n * This hook monitors changes in the window size and returns the appropriate value.\n *\n * @see https://yamada-ui.com/docs/hooks/use-breakpoint\n */\nexport const useBreakpoint = () => {\n  const animationFrameId = useRef(0)\n  const { breakpoints, config } = useSystem()\n  const { getWindow } = useEnvironment()\n  const {\n    containerRef,\n    direction = \"down\",\n    identifier = \"@media screen\",\n  } = config.breakpoint ?? {}\n  const hasContainer = !!containerRef\n\n  const queries = useMemo(() => {\n    return breakpoints.queries.map(\n      ({ breakpoint, maxW, minMaxQuery, minW }) => {\n        const searchValue =\n          identifier === \"@media screen\"\n            ? \"@media screen and \"\n            : `${identifier} `\n        const query = minMaxQuery?.replace(searchValue, \"\") ?? \"\"\n\n        return {\n          breakpoint,\n          maxW,\n          minW,\n          query,\n        }\n      },\n    )\n  }, [breakpoints, identifier])\n\n  const hasQueries = !!queries.length\n\n  const getBreakpoint = useCallback(\n    (width?: number) => {\n      if (isUndefined(width)) {\n        const win = getWindow()\n\n        if (hasContainer || !hasQueries) return \"base\"\n\n        for (const { breakpoint, query } of queries) {\n          const mql = win?.matchMedia(query)\n\n          if (mql?.matches) return breakpoint\n        }\n      } else {\n        for (const { breakpoint, maxW, minW } of queries) {\n          if (direction !== \"up\") {\n            if ((minW ?? 0) <= width) return breakpoint\n          } else {\n            if (width <= (maxW ?? Infinity)) return breakpoint\n          }\n        }\n      }\n\n      return \"base\"\n    },\n    [direction, getWindow, hasContainer, hasQueries, queries],\n  )\n\n  const breakpointRef = useRef<Breakpoint>(getBreakpoint())\n\n  const subscribe = useCallback(\n    (listener: () => void) => {\n      if (!hasContainer || !hasQueries) {\n        const observer = queries.map(({ breakpoint, query }): (() => void) => {\n          const mql = getWindow()?.matchMedia(query)\n\n          const onChange = (e: MediaQueryListEvent) => {\n            if (e.matches) breakpointRef.current = breakpoint\n\n            listener()\n          }\n\n          mql?.addEventListener(\"change\", onChange)\n\n          return () => {\n            mql?.removeEventListener(\"change\", onChange)\n          }\n        })\n\n        return () => {\n          observer.forEach((unobserve) => unobserve())\n        }\n      } else if (createdDom()) {\n        const observer = new ResizeObserver(([entry]) => {\n          if (!entry) return\n\n          cancelAnimationFrame(animationFrameId.current)\n\n          const { width } = entry.contentRect\n\n          breakpointRef.current = getBreakpoint(width)\n\n          animationFrameId.current = requestAnimationFrame(listener)\n        })\n\n        if (containerRef.current) observer.observe(containerRef.current)\n\n        return () => {\n          observer.disconnect()\n\n          if (process.env.NODE_ENV !== \"test\")\n            cancelAnimationFrame(animationFrameId.current)\n        }\n      } else {\n        return noop\n      }\n    },\n    [containerRef, getBreakpoint, getWindow, hasContainer, hasQueries, queries],\n  )\n\n  const getSnapshot = useCallback(() => {\n    return breakpointRef.current\n  }, [])\n\n  const breakpoint = useSyncExternalStore(subscribe, getSnapshot, getSnapshot)\n\n  return breakpoint\n}\n"],"mappings":";;;;;;;;;;;;AAaA,MAAa,sBAAsB;CACjC,MAAM,mBAAmB,OAAO,EAAE;CAClC,MAAM,EAAE,aAAa,WAAW,WAAW;CAC3C,MAAM,EAAE,cAAc,gBAAgB;CACtC,MAAM,EACJ,cACA,YAAY,QACZ,aAAa,oBACX,OAAO,cAAc,EAAE;CAC3B,MAAM,eAAe,CAAC,CAAC;CAEvB,MAAM,UAAU,cAAc;EAC5B,OAAO,YAAY,QAAQ,KACxB,EAAE,YAAY,MAAM,aAAa,WAAW;GAC3C,MAAM,cACJ,eAAe,kBACX,uBACA,GAAG,WAAW;GAGpB,OAAO;IACL;IACA;IACA;IACA,OANY,aAAa,QAAQ,aAAa,GAAG,IAAI;IAOtD;IAEJ;IACA,CAAC,aAAa,WAAW,CAAC;CAE7B,MAAM,aAAa,CAAC,CAAC,QAAQ;CAE7B,MAAM,gBAAgB,aACnB,UAAmB;EAClB,KAAA,GAAA,cAAA,aAAgB,MAAM,EAAE;GACtB,MAAM,MAAM,WAAW;GAEvB,IAAI,gBAAgB,CAAC,YAAY,OAAO;GAExC,KAAK,MAAM,EAAE,YAAY,WAAW,SAGlC,KAFY,KAAK,WAAW,MAAM,GAEzB,SAAS,OAAO;SAG3B,KAAK,MAAM,EAAE,YAAY,MAAM,UAAU,SACvC,IAAI,cAAc;QACX,QAAQ,MAAM,OAAO,OAAO;SAEjC,IAAI,UAAU,QAAQ,WAAW,OAAO;EAK9C,OAAO;IAET;EAAC;EAAW;EAAW;EAAc;EAAY;EAAQ,CAC1D;CAED,MAAM,gBAAgB,OAAmB,eAAe,CAAC;CAEzD,MAAM,YAAY,aACf,aAAyB;EACxB,IAAI,CAAC,gBAAgB,CAAC,YAAY;GAChC,MAAM,WAAW,QAAQ,KAAK,EAAE,YAAY,YAA0B;IACpE,MAAM,MAAM,WAAW,EAAE,WAAW,MAAM;IAE1C,MAAM,YAAY,MAA2B;KAC3C,IAAI,EAAE,SAAS,cAAc,UAAU;KAEvC,UAAU;;IAGZ,KAAK,iBAAiB,UAAU,SAAS;IAEzC,aAAa;KACX,KAAK,oBAAoB,UAAU,SAAS;;KAE9C;GAEF,aAAa;IACX,SAAS,SAAS,cAAc,WAAW,CAAC;;SAEzC,KAAA,GAAA,cAAA,aAAgB,EAAE;GACvB,MAAM,WAAW,IAAI,gBAAgB,CAAC,WAAW;IAC/C,IAAI,CAAC,OAAO;IAEZ,qBAAqB,iBAAiB,QAAQ;IAE9C,MAAM,EAAE,UAAU,MAAM;IAExB,cAAc,UAAU,cAAc,MAAM;IAE5C,iBAAiB,UAAU,sBAAsB,SAAS;KAC1D;GAEF,IAAI,aAAa,SAAS,SAAS,QAAQ,aAAa,QAAQ;GAEhE,aAAa;IACX,SAAS,YAAY;IAGnB,qBAAqB,iBAAiB,QAAQ;;SAGlD,OAAOA,cAAAA;IAGX;EAAC;EAAc;EAAe;EAAW;EAAc;EAAY;EAAQ,CAC5E;CAED,MAAM,cAAc,kBAAkB;EACpC,OAAO,cAAc;IACpB,EAAE,CAAC;CAIN,OAFmB,qBAAqB,WAAW,aAAa,YAE/C"}

package/dist/esm/hooks/use-breakpoint/use-update-breakpoint-effect.js

@@ -1,7 +1,5 @@
 import { useUpdateEffect } from "../../utils/effect.js";
-import "../../utils/index.js";
 import { useBreakpoint } from "./use-breakpoint.js";
-
 //#region src/hooks/use-breakpoint/use-update-breakpoint-effect.ts
 /**
 * `useUpdateBreakpointEffect` is a custom hook that skips the side effect on the initial render and executes a specific callback function when the breakpoint changes.
@@ -14,7 +12,7 @@ const useUpdateBreakpointEffect = (callback, deps) => {
 		callback(breakpoint);
 	}, [breakpoint, ...deps]);
 };
-
 //#endregion
 export { useUpdateBreakpointEffect };
+
 //# sourceMappingURL=use-update-breakpoint-effect.js.map

package/dist/esm/hooks/use-breakpoint/use-update-breakpoint-effect.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-update-breakpoint-effect.js","names":[],"sources":["../../../../src/hooks/use-breakpoint/use-update-breakpoint-effect.ts"],"sourcesContent":["import type { DependencyList } from \"react\"\nimport type { Breakpoint } from \"../../core\"\nimport { useUpdateEffect } from \"../../utils\"\nimport { useBreakpoint } from \"./use-breakpoint\"\n\n/**\n * `useUpdateBreakpointEffect` is a custom hook that skips the side effect on the initial render and executes a specific callback function when the breakpoint changes.\n *\n * @see https://yamada-ui.com/docs/hooks/use-update-breakpoint-effect\n */\nexport const useUpdateBreakpointEffect = (\n  callback: (breakpoint: Breakpoint) => void,\n  deps: DependencyList,\n) => {\n  const breakpoint = useBreakpoint()\n\n  useUpdateEffect(() => {\n    callback(breakpoint)\n  }, [breakpoint, ...deps])\n}\n"],"mappings":";;;;;;;;;;AAUA,MAAa,6BACX,UACA,SACG;CACH,MAAM,aAAa,eAAe;AAElC,uBAAsB;AACpB,WAAS,WAAW;IACnB,CAAC,YAAY,GAAG,KAAK,CAAC"}
+{"version":3,"file":"use-update-breakpoint-effect.js","names":[],"sources":["../../../../src/hooks/use-breakpoint/use-update-breakpoint-effect.ts"],"sourcesContent":["import type { DependencyList } from \"react\"\nimport type { Breakpoint } from \"../../core\"\nimport { useUpdateEffect } from \"../../utils\"\nimport { useBreakpoint } from \"./use-breakpoint\"\n\n/**\n * `useUpdateBreakpointEffect` is a custom hook that skips the side effect on the initial render and executes a specific callback function when the breakpoint changes.\n *\n * @see https://yamada-ui.com/docs/hooks/use-update-breakpoint-effect\n */\nexport const useUpdateBreakpointEffect = (\n  callback: (breakpoint: Breakpoint) => void,\n  deps: DependencyList,\n) => {\n  const breakpoint = useBreakpoint()\n\n  useUpdateEffect(() => {\n    callback(breakpoint)\n  }, [breakpoint, ...deps])\n}\n"],"mappings":";;;;;;;;AAUA,MAAa,6BACX,UACA,SACG;CACH,MAAM,aAAa,eAAe;CAElC,sBAAsB;EACpB,SAAS,WAAW;IACnB,CAAC,YAAY,GAAG,KAAK,CAAC"}

package/dist/esm/hooks/use-clickable/index.js

@@ -1,10 +1,8 @@
 "use client";
-
 import { mergeRefs } from "../../utils/ref.js";
 import { utils_exports } from "../../utils/index.js";
 import { useEventListeners } from "../use-event-listener/index.js";
 import { useCallback, useState } from "react";
-
 //#region src/hooks/use-clickable/index.ts
 const isValidElement$1 = (ev) => {
 	const { isContentEditable, tagName } = ev.target;
@@ -161,7 +159,7 @@ const useClickable = ({ ref, clickOnEnter = true, clickOnSpace = true, disabled,
 		onMouseUp
 	};
 };
-
 //#endregion
 export { useClickable };
+
 //# sourceMappingURL=index.js.map

package/dist/esm/hooks/use-clickable/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["isValidElement"],"sources":["../../../../src/hooks/use-clickable/index.ts"],"sourcesContent":["\"use client\"\n\nimport type { HTMLAttributes, KeyboardEvent, MouseEvent, Ref } from \"react\"\nimport type { StyledProps } from \"../../core\"\nimport { useCallback, useState } from \"react\"\nimport { dataAttr, isTouchDevice, mergeRefs } from \"../../utils\"\nimport { useEventListeners } from \"../use-event-listener\"\n\ntype Props<Y extends HTMLElement = HTMLElement> = Omit<\n  HTMLAttributes<Y>,\n  \"ref\" | \"size\" | keyof StyledProps\n>\n\nexport type UseClickableProps<\n  Y extends HTMLElement = HTMLElement,\n  M extends Props<Y> = Props<Y>,\n> = M & {\n  /**\n   * Whether or not trigger click on pressing `Enter`.\n   *\n   * @default true\n   */\n  clickOnEnter?: boolean\n  /**\n   * Whether or not trigger click on pressing `Space`.\n   *\n   * @default true\n   */\n  clickOnSpace?: boolean\n  /**\n   * If `true`, the element will be disabled. It will set the `disabled` HTML attribute.\n   *\n   * @default false\n   */\n  disabled?: boolean\n  /**\n   * Disable the touch device behavior.\n   *\n   * @default true\n   */\n  disableTouchBehavior?: boolean\n  /**\n   * If `true` and isDisabled, the element will have only `aria-disabled` set to `true`.\n   *\n   * @default false\n   */\n  focusable?: boolean\n  /**\n   * Whether or not to focus the element when it is clicked.\n   * If `true`, the element will receive focus upon click.\n   *\n   * @default true\n   */\n  focusOnClick?: boolean\n  /**\n   * The ref for the element.\n   */\n  ref?: Ref<Y>\n}\n\nconst isValidElement = (\n  ev: KeyboardEvent | KeyboardEvent[\"nativeEvent\"],\n): boolean => {\n  const { isContentEditable, tagName } = ev.target as HTMLElement\n\n  return tagName !== \"INPUT\" && tagName !== \"TEXTAREA\" && !isContentEditable\n}\n\nexport const useClickable = <\n  Y extends HTMLElement = HTMLElement,\n  M extends Props<Y> = Props<Y>,\n>(\n  {\n    ref,\n    clickOnEnter = true,\n    clickOnSpace = true,\n    disabled,\n    disableTouchBehavior = true,\n    focusable,\n    focusOnClick = true,\n    tabIndex: tabIndexProp,\n    onClick: onClickProp,\n    onKeyDown: onKeyDownProp,\n    onKeyUp: onKeyUpProp,\n    onMouseDown: onMouseDownProp,\n    onMouseLeave: onMouseLeaveProp,\n    onMouseOver: onMouseOverProp,\n    onMouseUp: onMouseUpProp,\n    ...props\n  }: UseClickableProps<Y, M> = {} as UseClickableProps<Y, M>,\n) => {\n  const [button, setButton] = useState<boolean>(true)\n  const [pressed, setPressed] = useState<boolean>(false)\n\n  const listeners = useEventListeners()\n\n  const tabIndex = button ? tabIndexProp : tabIndexProp || 0\n  const trulyDisabled = disabled && !focusable\n\n  const refCb = (node: any) => {\n    if (!node) return\n\n    if (node.tagName !== \"BUTTON\") setButton(false)\n  }\n\n  const onClick = useCallback(\n    (ev: MouseEvent<Y>) => {\n      if (disabled) {\n        ev.stopPropagation()\n        ev.preventDefault()\n\n        return\n      }\n\n      if (focusOnClick) ev.currentTarget.focus()\n      onClickProp?.(ev)\n    },\n    [disabled, focusOnClick, onClickProp],\n  )\n\n  const onDocumentKeyUp = useCallback(\n    (ev: globalThis.KeyboardEvent) => {\n      if (pressed && isValidElement(ev)) {\n        ev.preventDefault()\n        ev.stopPropagation()\n\n        setPressed(false)\n\n        listeners.remove(document, \"keyup\", onDocumentKeyUp, false)\n      }\n    },\n    [pressed, listeners],\n  )\n\n  const onKeyDown = useCallback(\n    (ev: KeyboardEvent<Y>) => {\n      onKeyDownProp?.(ev)\n\n      if (disabled || ev.defaultPrevented || ev.metaKey) return\n\n      if (!isValidElement(ev.nativeEvent) || button) return\n\n      if (clickOnSpace && ev.key === \" \") {\n        ev.preventDefault()\n        setPressed(true)\n      }\n\n      if (clickOnEnter && ev.key === \"Enter\") {\n        ev.preventDefault()\n        ev.currentTarget.click()\n      }\n\n      listeners.add(document, \"keyup\", onDocumentKeyUp, false)\n    },\n    [\n      disabled,\n      button,\n      onKeyDownProp,\n      clickOnEnter,\n      clickOnSpace,\n      listeners,\n      onDocumentKeyUp,\n    ],\n  )\n\n  const onKeyUp = useCallback(\n    (ev: KeyboardEvent<Y>) => {\n      onKeyUpProp?.(ev)\n\n      if (disabled || ev.defaultPrevented || ev.metaKey) return\n\n      if (!isValidElement(ev.nativeEvent) || button) return\n\n      if (clickOnSpace && ev.key === \" \") {\n        ev.preventDefault()\n        setPressed(false)\n\n        ev.currentTarget.click()\n      }\n    },\n    [clickOnSpace, button, disabled, onKeyUpProp],\n  )\n\n  const onDocumentMouseUp = useCallback(\n    (ev: globalThis.MouseEvent) => {\n      if (ev.button !== 0) return\n\n      setPressed(false)\n\n      listeners.remove(document, \"mouseup\", onDocumentMouseUp, false)\n    },\n    [listeners],\n  )\n\n  const onMouseDown = useCallback(\n    (ev: MouseEvent<Y>) => {\n      if (ev.button !== 0) return\n\n      if (disabled) {\n        ev.stopPropagation()\n        ev.preventDefault()\n\n        return\n      }\n\n      if (!button) setPressed(true)\n\n      if (focusOnClick) ev.currentTarget.focus({ preventScroll: true })\n\n      listeners.add(document, \"mouseup\", onDocumentMouseUp, false)\n\n      onMouseDownProp?.(ev)\n    },\n    [\n      disabled,\n      button,\n      onMouseDownProp,\n      listeners,\n      onDocumentMouseUp,\n      focusOnClick,\n    ],\n  )\n\n  const onMouseUp = useCallback(\n    (ev: MouseEvent<Y>) => {\n      if (ev.button !== 0) return\n\n      if (!button) setPressed(false)\n\n      onMouseUpProp?.(ev)\n    },\n    [onMouseUpProp, button],\n  )\n\n  const onMouseOver = useCallback(\n    (ev: MouseEvent<Y>) => {\n      if (disabled) {\n        ev.preventDefault()\n\n        return\n      }\n\n      if (disableTouchBehavior && isTouchDevice()) return\n\n      onMouseOverProp?.(ev)\n    },\n    [disabled, onMouseOverProp, disableTouchBehavior],\n  )\n\n  const onMouseLeave = useCallback(\n    (ev: MouseEvent<Y>) => {\n      if (pressed) {\n        ev.preventDefault()\n\n        setPressed(false)\n      }\n\n      if (disableTouchBehavior && isTouchDevice()) return\n\n      onMouseLeaveProp?.(ev)\n    },\n    [pressed, onMouseLeaveProp, disableTouchBehavior],\n  )\n\n  if (button) {\n    return {\n      ...props,\n      ref: mergeRefs(ref, refCb),\n      type: \"button\" as const,\n      \"aria-disabled\": trulyDisabled ? undefined : disabled,\n      disabled: trulyDisabled,\n      onClick: onClick,\n      onKeyDown: onKeyDownProp,\n      onKeyUp: onKeyUpProp,\n      onMouseDown: onMouseDownProp,\n      onMouseLeave: onMouseLeaveProp,\n      onMouseOver: onMouseOverProp,\n      onMouseUp: onMouseUpProp,\n    }\n  } else {\n    return {\n      ...props,\n      ref: mergeRefs(ref, refCb),\n      \"aria-disabled\": disabled ? (\"true\" as const) : undefined,\n      \"data-active\": dataAttr(pressed),\n      role: \"button\",\n      tabIndex: trulyDisabled ? undefined : tabIndex,\n      onClick,\n      onKeyDown,\n      onKeyUp,\n      onMouseDown,\n      onMouseLeave,\n      onMouseOver,\n      onMouseUp,\n    }\n  }\n}\n\nexport type UseClickableReturn = ReturnType<typeof useClickable>\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["isValidElement"],"sources":["../../../../src/hooks/use-clickable/index.ts"],"sourcesContent":["\"use client\"\n\nimport type { HTMLAttributes, KeyboardEvent, MouseEvent, Ref } from \"react\"\nimport type { StyledProps } from \"../../core\"\nimport { useCallback, useState } from \"react\"\nimport { dataAttr, isTouchDevice, mergeRefs } from \"../../utils\"\nimport { useEventListeners } from \"../use-event-listener\"\n\ntype Props<Y extends HTMLElement = HTMLElement> = Omit<\n  HTMLAttributes<Y>,\n  \"ref\" | \"size\" | keyof StyledProps\n>\n\nexport type UseClickableProps<\n  Y extends HTMLElement = HTMLElement,\n  M extends Props<Y> = Props<Y>,\n> = M & {\n  /**\n   * Whether or not trigger click on pressing `Enter`.\n   *\n   * @default true\n   */\n  clickOnEnter?: boolean\n  /**\n   * Whether or not trigger click on pressing `Space`.\n   *\n   * @default true\n   */\n  clickOnSpace?: boolean\n  /**\n   * If `true`, the element will be disabled. It will set the `disabled` HTML attribute.\n   *\n   * @default false\n   */\n  disabled?: boolean\n  /**\n   * Disable the touch device behavior.\n   *\n   * @default true\n   */\n  disableTouchBehavior?: boolean\n  /**\n   * If `true` and isDisabled, the element will have only `aria-disabled` set to `true`.\n   *\n   * @default false\n   */\n  focusable?: boolean\n  /**\n   * Whether or not to focus the element when it is clicked.\n   * If `true`, the element will receive focus upon click.\n   *\n   * @default true\n   */\n  focusOnClick?: boolean\n  /**\n   * The ref for the element.\n   */\n  ref?: Ref<Y>\n}\n\nconst isValidElement = (\n  ev: KeyboardEvent | KeyboardEvent[\"nativeEvent\"],\n): boolean => {\n  const { isContentEditable, tagName } = ev.target as HTMLElement\n\n  return tagName !== \"INPUT\" && tagName !== \"TEXTAREA\" && !isContentEditable\n}\n\nexport const useClickable = <\n  Y extends HTMLElement = HTMLElement,\n  M extends Props<Y> = Props<Y>,\n>(\n  {\n    ref,\n    clickOnEnter = true,\n    clickOnSpace = true,\n    disabled,\n    disableTouchBehavior = true,\n    focusable,\n    focusOnClick = true,\n    tabIndex: tabIndexProp,\n    onClick: onClickProp,\n    onKeyDown: onKeyDownProp,\n    onKeyUp: onKeyUpProp,\n    onMouseDown: onMouseDownProp,\n    onMouseLeave: onMouseLeaveProp,\n    onMouseOver: onMouseOverProp,\n    onMouseUp: onMouseUpProp,\n    ...props\n  }: UseClickableProps<Y, M> = {} as UseClickableProps<Y, M>,\n) => {\n  const [button, setButton] = useState<boolean>(true)\n  const [pressed, setPressed] = useState<boolean>(false)\n\n  const listeners = useEventListeners()\n\n  const tabIndex = button ? tabIndexProp : tabIndexProp || 0\n  const trulyDisabled = disabled && !focusable\n\n  const refCb = (node: any) => {\n    if (!node) return\n\n    if (node.tagName !== \"BUTTON\") setButton(false)\n  }\n\n  const onClick = useCallback(\n    (ev: MouseEvent<Y>) => {\n      if (disabled) {\n        ev.stopPropagation()\n        ev.preventDefault()\n\n        return\n      }\n\n      if (focusOnClick) ev.currentTarget.focus()\n      onClickProp?.(ev)\n    },\n    [disabled, focusOnClick, onClickProp],\n  )\n\n  const onDocumentKeyUp = useCallback(\n    (ev: globalThis.KeyboardEvent) => {\n      if (pressed && isValidElement(ev)) {\n        ev.preventDefault()\n        ev.stopPropagation()\n\n        setPressed(false)\n\n        listeners.remove(document, \"keyup\", onDocumentKeyUp, false)\n      }\n    },\n    [pressed, listeners],\n  )\n\n  const onKeyDown = useCallback(\n    (ev: KeyboardEvent<Y>) => {\n      onKeyDownProp?.(ev)\n\n      if (disabled || ev.defaultPrevented || ev.metaKey) return\n\n      if (!isValidElement(ev.nativeEvent) || button) return\n\n      if (clickOnSpace && ev.key === \" \") {\n        ev.preventDefault()\n        setPressed(true)\n      }\n\n      if (clickOnEnter && ev.key === \"Enter\") {\n        ev.preventDefault()\n        ev.currentTarget.click()\n      }\n\n      listeners.add(document, \"keyup\", onDocumentKeyUp, false)\n    },\n    [\n      disabled,\n      button,\n      onKeyDownProp,\n      clickOnEnter,\n      clickOnSpace,\n      listeners,\n      onDocumentKeyUp,\n    ],\n  )\n\n  const onKeyUp = useCallback(\n    (ev: KeyboardEvent<Y>) => {\n      onKeyUpProp?.(ev)\n\n      if (disabled || ev.defaultPrevented || ev.metaKey) return\n\n      if (!isValidElement(ev.nativeEvent) || button) return\n\n      if (clickOnSpace && ev.key === \" \") {\n        ev.preventDefault()\n        setPressed(false)\n\n        ev.currentTarget.click()\n      }\n    },\n    [clickOnSpace, button, disabled, onKeyUpProp],\n  )\n\n  const onDocumentMouseUp = useCallback(\n    (ev: globalThis.MouseEvent) => {\n      if (ev.button !== 0) return\n\n      setPressed(false)\n\n      listeners.remove(document, \"mouseup\", onDocumentMouseUp, false)\n    },\n    [listeners],\n  )\n\n  const onMouseDown = useCallback(\n    (ev: MouseEvent<Y>) => {\n      if (ev.button !== 0) return\n\n      if (disabled) {\n        ev.stopPropagation()\n        ev.preventDefault()\n\n        return\n      }\n\n      if (!button) setPressed(true)\n\n      if (focusOnClick) ev.currentTarget.focus({ preventScroll: true })\n\n      listeners.add(document, \"mouseup\", onDocumentMouseUp, false)\n\n      onMouseDownProp?.(ev)\n    },\n    [\n      disabled,\n      button,\n      onMouseDownProp,\n      listeners,\n      onDocumentMouseUp,\n      focusOnClick,\n    ],\n  )\n\n  const onMouseUp = useCallback(\n    (ev: MouseEvent<Y>) => {\n      if (ev.button !== 0) return\n\n      if (!button) setPressed(false)\n\n      onMouseUpProp?.(ev)\n    },\n    [onMouseUpProp, button],\n  )\n\n  const onMouseOver = useCallback(\n    (ev: MouseEvent<Y>) => {\n      if (disabled) {\n        ev.preventDefault()\n\n        return\n      }\n\n      if (disableTouchBehavior && isTouchDevice()) return\n\n      onMouseOverProp?.(ev)\n    },\n    [disabled, onMouseOverProp, disableTouchBehavior],\n  )\n\n  const onMouseLeave = useCallback(\n    (ev: MouseEvent<Y>) => {\n      if (pressed) {\n        ev.preventDefault()\n\n        setPressed(false)\n      }\n\n      if (disableTouchBehavior && isTouchDevice()) return\n\n      onMouseLeaveProp?.(ev)\n    },\n    [pressed, onMouseLeaveProp, disableTouchBehavior],\n  )\n\n  if (button) {\n    return {\n      ...props,\n      ref: mergeRefs(ref, refCb),\n      type: \"button\" as const,\n      \"aria-disabled\": trulyDisabled ? undefined : disabled,\n      disabled: trulyDisabled,\n      onClick: onClick,\n      onKeyDown: onKeyDownProp,\n      onKeyUp: onKeyUpProp,\n      onMouseDown: onMouseDownProp,\n      onMouseLeave: onMouseLeaveProp,\n      onMouseOver: onMouseOverProp,\n      onMouseUp: onMouseUpProp,\n    }\n  } else {\n    return {\n      ...props,\n      ref: mergeRefs(ref, refCb),\n      \"aria-disabled\": disabled ? (\"true\" as const) : undefined,\n      \"data-active\": dataAttr(pressed),\n      role: \"button\",\n      tabIndex: trulyDisabled ? undefined : tabIndex,\n      onClick,\n      onKeyDown,\n      onKeyUp,\n      onMouseDown,\n      onMouseLeave,\n      onMouseOver,\n      onMouseUp,\n    }\n  }\n}\n\nexport type UseClickableReturn = ReturnType<typeof useClickable>\n"],"mappings":"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"}

package/dist/esm/hooks/use-clipboard/index.js

@@ -1,9 +1,7 @@
 "use client";
-
 import { utils_exports } from "../../utils/index.js";
 import { useCallback, useEffect, useState } from "react";
 import copy from "copy-to-clipboard";
-
 //#region src/hooks/use-clipboard/index.ts
 /**
 * `useClipboard` is a custom hook that performs the operation of copying a value to the clipboard.
@@ -36,7 +34,7 @@ const useClipboard = (defaultValue = "", timeoutOrOptions = {}) => {
 		onCopy
 	};
 };
-
 //#endregion
 export { useClipboard };
+
 //# sourceMappingURL=index.js.map

package/dist/esm/hooks/use-clipboard/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["timeoutId: NodeJS.Timeout | null"],"sources":["../../../../src/hooks/use-clipboard/index.ts"],"sourcesContent":["\"use client\"\n\nimport copy from \"copy-to-clipboard\"\nimport { useCallback, useEffect, useState } from \"react\"\nimport { isNumber, isString } from \"../../utils\"\n\nexport interface UseClipboardOptions {\n  format?: string\n  timeout?: number\n}\n\n/**\n * `useClipboard` is a custom hook that performs the operation of copying a value to the clipboard.\n *\n * @see https://yamada-ui.com/docs/hooks/use-clipboard\n */\nexport const useClipboard = (\n  defaultValue = \"\",\n  timeoutOrOptions: number | UseClipboardOptions = {},\n) => {\n  const [copied, setCopied] = useState(false)\n\n  const [value, setValue] = useState(defaultValue)\n\n  useEffect(() => setValue(defaultValue), [defaultValue])\n\n  const { timeout = 1500, ...copyOptions } = isNumber(timeoutOrOptions)\n    ? { timeout: timeoutOrOptions }\n    : timeoutOrOptions\n\n  const onCopy = useCallback(\n    (newValue?: any) => {\n      if (!isString(newValue)) {\n        newValue = value\n      } else {\n        setValue(newValue)\n      }\n\n      const copied = copy(newValue, copyOptions)\n\n      setCopied(copied)\n    },\n    [value, copyOptions],\n  )\n\n  useEffect(() => {\n    let timeoutId: NodeJS.Timeout | null = null\n\n    if (copied)\n      timeoutId = setTimeout(() => {\n        setCopied(false)\n      }, timeout)\n\n    return () => {\n      if (timeoutId) clearTimeout(timeoutId)\n    }\n  }, [timeout, copied])\n\n  return {\n    copied,\n    setValue,\n    value,\n    onCopy,\n  }\n}\n"],"mappings":";;;;;;;;;;;;AAgBA,MAAa,gBACX,eAAe,IACf,mBAAiD,EAAE,KAChD;CACH,MAAM,CAAC,QAAQ,aAAa,SAAS,MAAM;CAE3C,MAAM,CAAC,OAAO,YAAY,SAAS,aAAa;AAEhD,iBAAgB,SAAS,aAAa,EAAE,CAAC,aAAa,CAAC;CAEvD,MAAM,EAAE,UAAU,MAAM,GAAG,4CAAyB,iBAAiB,GACjE,EAAE,SAAS,kBAAkB,GAC7B;CAEJ,MAAM,SAAS,aACZ,aAAmB;AAClB,MAAI,6BAAU,SAAS,CACrB,YAAW;MAEX,UAAS,SAAS;AAKpB,YAFe,KAAK,UAAU,YAAY,CAEzB;IAEnB,CAAC,OAAO,YAAY,CACrB;AAED,iBAAgB;EACd,IAAIA,YAAmC;AAEvC,MAAI,OACF,aAAY,iBAAiB;AAC3B,aAAU,MAAM;KACf,QAAQ;AAEb,eAAa;AACX,OAAI,UAAW,cAAa,UAAU;;IAEvC,CAAC,SAAS,OAAO,CAAC;AAErB,QAAO;EACL;EACA;EACA;EACA;EACD"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../../src/hooks/use-clipboard/index.ts"],"sourcesContent":["\"use client\"\n\nimport copy from \"copy-to-clipboard\"\nimport { useCallback, useEffect, useState } from \"react\"\nimport { isNumber, isString } from \"../../utils\"\n\nexport interface UseClipboardOptions {\n  format?: string\n  timeout?: number\n}\n\n/**\n * `useClipboard` is a custom hook that performs the operation of copying a value to the clipboard.\n *\n * @see https://yamada-ui.com/docs/hooks/use-clipboard\n */\nexport const useClipboard = (\n  defaultValue = \"\",\n  timeoutOrOptions: number | UseClipboardOptions = {},\n) => {\n  const [copied, setCopied] = useState(false)\n\n  const [value, setValue] = useState(defaultValue)\n\n  useEffect(() => setValue(defaultValue), [defaultValue])\n\n  const { timeout = 1500, ...copyOptions } = isNumber(timeoutOrOptions)\n    ? { timeout: timeoutOrOptions }\n    : timeoutOrOptions\n\n  const onCopy = useCallback(\n    (newValue?: any) => {\n      if (!isString(newValue)) {\n        newValue = value\n      } else {\n        setValue(newValue)\n      }\n\n      const copied = copy(newValue, copyOptions)\n\n      setCopied(copied)\n    },\n    [value, copyOptions],\n  )\n\n  useEffect(() => {\n    let timeoutId: NodeJS.Timeout | null = null\n\n    if (copied)\n      timeoutId = setTimeout(() => {\n        setCopied(false)\n      }, timeout)\n\n    return () => {\n      if (timeoutId) clearTimeout(timeoutId)\n    }\n  }, [timeout, copied])\n\n  return {\n    copied,\n    setValue,\n    value,\n    onCopy,\n  }\n}\n"],"mappings":";;;;;;;;;;AAgBA,MAAa,gBACX,eAAe,IACf,mBAAiD,EAAE,KAChD;CACH,MAAM,CAAC,QAAQ,aAAa,SAAS,MAAM;CAE3C,MAAM,CAAC,OAAO,YAAY,SAAS,aAAa;CAEhD,gBAAgB,SAAS,aAAa,EAAE,CAAC,aAAa,CAAC;CAEvD,MAAM,EAAE,UAAU,MAAM,GAAG,iBAAA,GAAA,cAAA,UAAyB,iBAAiB,GACjE,EAAE,SAAS,kBAAkB,GAC7B;CAEJ,MAAM,SAAS,aACZ,aAAmB;EAClB,IAAI,EAAA,GAAA,cAAA,UAAU,SAAS,EACrB,WAAW;OAEX,SAAS,SAAS;EAKpB,UAFe,KAAK,UAAU,YAEd,CAAC;IAEnB,CAAC,OAAO,YAAY,CACrB;CAED,gBAAgB;EACd,IAAI,YAAmC;EAEvC,IAAI,QACF,YAAY,iBAAiB;GAC3B,UAAU,MAAM;KACf,QAAQ;EAEb,aAAa;GACX,IAAI,WAAW,aAAa,UAAU;;IAEvC,CAAC,SAAS,OAAO,CAAC;CAErB,OAAO;EACL;EACA;EACA;EACA;EACD"}