@yamada-ui/react 1.7.7 → 2.0.0-dev-20250626073729

package/dist/esm/hooks/use-focus-visible/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["modality: Modality | null","modality: Modality","ev: HandlerEvent | null","modality","e: KeyboardEvent","ev: KeyboardEvent","ev: MouseEvent | PointerEvent","ev: MouseEvent","ev: FocusEvent","func: FocusVisibleCallback","options?: TrackFocusVisibleOptions"],"sources":["../../../../src/hooks/use-focus-visible/index.ts"],"sourcesContent":["\"use client\"\n\nimport { useEffect, useState } from \"react\"\nimport { isMac } from \"../../utils\"\n\ntype Modality = \"keyboard\" | \"pointer\" | \"virtual\"\ntype HandlerEvent = FocusEvent | KeyboardEvent | MouseEvent | PointerEvent\ntype Handler = (modality: Modality, e: HandlerEvent | null) => void\ntype FocusVisibleCallback = (isFocusVisible: boolean) => void\n\nlet hasSetup = false\nlet modality: Modality | null = null\nlet hasEventBeforeFocus = false\nlet hasBlurredWindowRecently = false\n\nconst handlers = new Set<Handler>()\n\nconst trigger = (modality: Modality, ev: HandlerEvent | null) =>\n  handlers.forEach((handler) => handler(modality, ev))\n\nconst onValid = (e: KeyboardEvent) => {\n  return !(\n    e.metaKey ||\n    (!isMac() && e.altKey) ||\n    e.ctrlKey ||\n    e.key === \"Control\" ||\n    e.key === \"Shift\" ||\n    e.key === \"Meta\"\n  )\n}\n\nconst onKeyboard = (ev: KeyboardEvent) => {\n  hasEventBeforeFocus = true\n\n  if (onValid(ev)) {\n    modality = \"keyboard\"\n\n    trigger(\"keyboard\", ev)\n  }\n}\n\nconst onPointer = (ev: MouseEvent | PointerEvent) => {\n  modality = \"pointer\"\n\n  if (\n    ev.type === \"mousedown\" ||\n    ev.type === \"pointerdown\" ||\n    ev.type === \"pointerup\"\n  ) {\n    hasEventBeforeFocus = true\n\n    const target = ev.composedPath()[0] ?? ev.target\n\n    if ((target as HTMLElement).matches(\":focus-visible\")) return\n\n    trigger(\"pointer\", ev)\n  }\n}\n\nconst isVirtualClick = (ev: MouseEvent | PointerEvent): boolean => {\n  if ((ev as any).mozInputSource === 0 && ev.isTrusted) return true\n\n  return ev.detail === 0 && !(ev as PointerEvent).pointerType\n}\n\nconst onClick = (ev: MouseEvent) => {\n  if (!isVirtualClick(ev)) return\n\n  hasEventBeforeFocus = true\n\n  modality = \"virtual\"\n}\n\nconst onFocus = (ev: FocusEvent) => {\n  if (ev.target === window || ev.target === document) return\n\n  if (!hasEventBeforeFocus && !hasBlurredWindowRecently) {\n    modality = \"virtual\"\n\n    trigger(\"virtual\", ev)\n  }\n\n  hasEventBeforeFocus = false\n  hasBlurredWindowRecently = false\n}\n\nconst onBlur = () => {\n  hasEventBeforeFocus = false\n  hasBlurredWindowRecently = true\n}\n\nconst isFocusVisible = () => modality !== \"pointer\"\n\nconst setGlobalFocusEvents = () => {\n  if (typeof window === \"undefined\" || hasSetup) return\n\n  const { focus } = HTMLElement.prototype\n\n  if (process.env.NODE_ENV !== \"test\") {\n    Object.defineProperties(HTMLElement.prototype, {\n      focus: {\n        configurable: false,\n        value: function customFocus(...args: [FocusOptions]) {\n          hasEventBeforeFocus = true\n\n          if (this) focus.apply(this, args)\n        },\n        writable: false,\n      },\n    })\n  }\n\n  document.addEventListener(\"keydown\", onKeyboard, true)\n  document.addEventListener(\"keyup\", onKeyboard, true)\n  document.addEventListener(\"click\", onClick, true)\n\n  window.addEventListener(\"focus\", onFocus, true)\n  window.addEventListener(\"blur\", onBlur, false)\n\n  if (typeof PointerEvent !== \"undefined\") {\n    document.addEventListener(\"pointerdown\", onPointer, true)\n    document.addEventListener(\"pointermove\", onPointer, true)\n    document.addEventListener(\"pointerup\", onPointer, true)\n  } else {\n    document.addEventListener(\"mousedown\", onPointer, true)\n    document.addEventListener(\"mousemove\", onPointer, true)\n    document.addEventListener(\"mouseup\", onPointer, true)\n  }\n\n  hasSetup = true\n}\n\ninterface TrackFocusVisibleOptions {\n  force?: boolean\n}\n\nexport const trackFocusVisible = (\n  func: FocusVisibleCallback,\n  { force }: TrackFocusVisibleOptions = {},\n) => {\n  if (force) hasSetup = false\n\n  setGlobalFocusEvents()\n\n  func(isFocusVisible())\n\n  const handler = () => func(isFocusVisible())\n\n  handlers.add(handler)\n\n  return () => {\n    handlers.delete(handler)\n  }\n}\n\nexport const useFocusVisible = (options?: TrackFocusVisibleOptions) => {\n  const [focusVisible, setFocusVisible] = useState(false)\n  const [focus, setFocus] = useState(false)\n\n  useEffect(() => {\n    return trackFocusVisible(setFocusVisible, options)\n  }, [options])\n\n  return {\n    focusVisible: focusVisible && focus,\n    onBlur: () => setFocus(false),\n    onFocus: () => setFocus(true),\n  }\n}\n"],"mappings":"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"}

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

@@ -0,0 +1,36 @@
+"use client";
+
+
+import { useCallback, useEffect, useRef, useState } from "react";
+
+//#region src/hooks/use-hover/index.ts
+/**
+* `useHover` is a custom hook that detects whether the pointer has moved over or away from an element.
+*
+* @see https://yamada-ui.com/hooks/use-hover
+*/
+const useHover = () => {
+	const [hovered, setHovered] = useState(false);
+	const ref = useRef(null);
+	const onMouseEnter = useCallback(() => setHovered(true), []);
+	const onMouseLeave = useCallback(() => setHovered(false), []);
+	useEffect(() => {
+		const el = ref.current;
+		if (el) {
+			el.addEventListener("mouseenter", onMouseEnter);
+			el.addEventListener("mouseleave", onMouseLeave);
+			return () => {
+				el.removeEventListener("mouseenter", onMouseEnter);
+				el.removeEventListener("mouseleave", onMouseLeave);
+			};
+		}
+	}, [onMouseEnter, onMouseLeave]);
+	return {
+		ref,
+		hovered
+	};
+};
+
+//#endregion
+export { useHover };
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../../../src/hooks/use-hover/index.ts"],"sourcesContent":["\"use client\"\n\nimport { useCallback, useEffect, useRef, useState } from \"react\"\n\n/**\n * `useHover` is a custom hook that detects whether the pointer has moved over or away from an element.\n *\n * @see https://yamada-ui.com/hooks/use-hover\n */\nexport const useHover = <T extends HTMLElement = HTMLDivElement>() => {\n  const [hovered, setHovered] = useState(false)\n  const ref = useRef<T>(null)\n\n  const onMouseEnter = useCallback(() => setHovered(true), [])\n  const onMouseLeave = useCallback(() => setHovered(false), [])\n\n  useEffect(() => {\n    const el = ref.current\n\n    if (el) {\n      el.addEventListener(\"mouseenter\", onMouseEnter)\n      el.addEventListener(\"mouseleave\", onMouseLeave)\n\n      return () => {\n        el.removeEventListener(\"mouseenter\", onMouseEnter)\n        el.removeEventListener(\"mouseleave\", onMouseLeave)\n      }\n    }\n  }, [onMouseEnter, onMouseLeave])\n\n  return { ref, hovered }\n}\n"],"mappings":";;;;;;;;;;;AASA,MAAa,WAAW,MAA8C;CACpE,MAAM,CAAC,SAAS,WAAW,GAAG,SAAS,MAAM;CAC7C,MAAM,MAAM,OAAU,KAAK;CAE3B,MAAM,eAAe,YAAY,MAAM,WAAW,KAAK,EAAE,CAAE,EAAC;CAC5D,MAAM,eAAe,YAAY,MAAM,WAAW,MAAM,EAAE,CAAE,EAAC;AAE7D,WAAU,MAAM;EACd,MAAM,KAAK,IAAI;AAEf,MAAI,IAAI;AACN,MAAG,iBAAiB,cAAc,aAAa;AAC/C,MAAG,iBAAiB,cAAc,aAAa;AAE/C,UAAO,MAAM;AACX,OAAG,oBAAoB,cAAc,aAAa;AAClD,OAAG,oBAAoB,cAAc,aAAa;GACnD;EACF;CACF,GAAE,CAAC,cAAc,YAAa,EAAC;AAEhC,QAAO;EAAE;EAAK;CAAS;AACxB"}

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

@@ -0,0 +1,46 @@
+"use client";
+
+
+import { useEffect, useRef, useState } from "react";
+
+//#region src/hooks/use-idle/index.ts
+const DEFAULT_EVENTS = [
+	"keypress",
+	"mousemove",
+	"touchmove",
+	"click",
+	"scroll"
+];
+const DEFAULT_OPTIONS = {
+	events: DEFAULT_EVENTS,
+	initialState: true
+};
+/**
+* `useIdle` is a custom hook that detects whether the user has been idle for a certain amount of time in milliseconds.
+*
+* @see https://yamada-ui.com/hooks/use-idle
+*/
+const useIdle = (timeout, options) => {
+	const { events, initialState } = {
+		...DEFAULT_OPTIONS,
+		...options
+	};
+	const [idle, setIdle] = useState(initialState);
+	const timeoutId = useRef(void 0);
+	useEffect(() => {
+		const handleEvent = () => {
+			setIdle(false);
+			if (timeoutId.current) clearTimeout(timeoutId.current);
+			timeoutId.current = setTimeout(() => setIdle(true), timeout);
+		};
+		events.forEach((event) => document.addEventListener(event, handleEvent));
+		return () => {
+			events.forEach((event) => document.removeEventListener(event, handleEvent));
+		};
+	}, [events, timeout]);
+	return idle;
+};
+
+//#endregion
+export { useIdle };
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["DEFAULT_EVENTS: (keyof DocumentEventMap)[]","timeout: number","options?: IdleOptions"],"sources":["../../../../src/hooks/use-idle/index.ts"],"sourcesContent":["\"use client\"\n\nimport { useEffect, useRef, useState } from \"react\"\n\nconst DEFAULT_EVENTS: (keyof DocumentEventMap)[] = [\n  \"keypress\",\n  \"mousemove\",\n  \"touchmove\",\n  \"click\",\n  \"scroll\",\n]\n\nconst DEFAULT_OPTIONS = {\n  events: DEFAULT_EVENTS,\n  initialState: true,\n}\n\nexport interface IdleOptions {\n  events?: (keyof DocumentEventMap)[]\n  initialState?: boolean\n}\n\n/**\n * `useIdle` is a custom hook that detects whether the user has been idle for a certain amount of time in milliseconds.\n *\n * @see https://yamada-ui.com/hooks/use-idle\n */\nexport const useIdle = (timeout: number, options?: IdleOptions) => {\n  const { events, initialState } = { ...DEFAULT_OPTIONS, ...options }\n  const [idle, setIdle] = useState<boolean>(initialState)\n  const timeoutId = useRef<NodeJS.Timeout>(undefined)\n\n  useEffect(() => {\n    const handleEvent = () => {\n      setIdle(false)\n\n      if (timeoutId.current) clearTimeout(timeoutId.current)\n\n      timeoutId.current = setTimeout(() => setIdle(true), timeout)\n    }\n\n    events.forEach((event) => document.addEventListener(event, handleEvent))\n\n    return () => {\n      events.forEach((event) =>\n        document.removeEventListener(event, handleEvent),\n      )\n    }\n  }, [events, timeout])\n\n  return idle\n}\n"],"mappings":";;;;;;AAIA,MAAMA,iBAA6C;CACjD;CACA;CACA;CACA;CACA;AACD;AAED,MAAM,kBAAkB;CACtB,QAAQ;CACR,cAAc;AACf;;;;;;AAYD,MAAa,UAAU,CAACC,SAAiBC,YAA0B;CACjE,MAAM,EAAE,QAAQ,cAAc,GAAG;EAAE,GAAG;EAAiB,GAAG;CAAS;CACnE,MAAM,CAAC,MAAM,QAAQ,GAAG,SAAkB,aAAa;CACvD,MAAM,YAAY,cAAiC;AAEnD,WAAU,MAAM;EACd,MAAM,cAAc,MAAM;AACxB,WAAQ,MAAM;AAEd,OAAI,UAAU,QAAS,cAAa,UAAU,QAAQ;AAEtD,aAAU,UAAU,WAAW,MAAM,QAAQ,KAAK,EAAE,QAAQ;EAC7D;AAED,SAAO,QAAQ,CAAC,UAAU,SAAS,iBAAiB,OAAO,YAAY,CAAC;AAExE,SAAO,MAAM;AACX,UAAO,QAAQ,CAAC,UACd,SAAS,oBAAoB,OAAO,YAAY,CACjD;EACF;CACF,GAAE,CAAC,QAAQ,OAAQ,EAAC;AAErB,QAAO;AACR"}

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

@@ -0,0 +1,26 @@
+"use client";
+
+
+import { useCallbackRef } from "../../utils/ref.js";
+import { useEffect } from "react";
+
+//#region src/hooks/use-interval/index.ts
+/**
+* `useInterval` is a custom hook that runs a function at a specified interval.
+*
+* @see https://yamada-ui.com/hooks/use-interval
+*/
+const useInterval = (callback, delay) => {
+	const callbackRef = useCallbackRef(callback);
+	useEffect(() => {
+		let timeoutId = null;
+		if (delay !== null) timeoutId = setInterval(callbackRef, delay);
+		return () => {
+			if (timeoutId) clearInterval(timeoutId);
+		};
+	}, [delay, callbackRef]);
+};
+
+//#endregion
+export { useInterval };
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["callback: () => void","delay: null | number","timeoutId: NodeJS.Timeout | null"],"sources":["../../../../src/hooks/use-interval/index.ts"],"sourcesContent":["\"use client\"\n\nimport { useEffect } from \"react\"\nimport { useCallbackRef } from \"../../utils\"\n\n/**\n * `useInterval` is a custom hook that runs a function at a specified interval.\n *\n * @see https://yamada-ui.com/hooks/use-interval\n */\nexport const useInterval = (callback: () => void, delay: null | number) => {\n  const callbackRef = useCallbackRef(callback)\n\n  useEffect(() => {\n    let timeoutId: NodeJS.Timeout | null = null\n\n    if (delay !== null) timeoutId = setInterval(callbackRef, delay)\n\n    return () => {\n      if (timeoutId) clearInterval(timeoutId)\n    }\n  }, [delay, callbackRef])\n}\n"],"mappings":";;;;;;;;;;;;AAUA,MAAa,cAAc,CAACA,UAAsBC,UAAyB;CACzE,MAAM,cAAc,eAAe,SAAS;AAE5C,WAAU,MAAM;EACd,IAAIC,YAAmC;AAEvC,MAAI,UAAU,KAAM,aAAY,YAAY,aAAa,MAAM;AAE/D,SAAO,MAAM;AACX,OAAI,UAAW,eAAc,UAAU;EACxC;CACF,GAAE,CAAC,OAAO,WAAY,EAAC;AACzB"}

package/dist/esm/hooks/use-latest-ref/index.js

@@ -0,0 +1,15 @@
+"use client";
+
+
+import { useRef } from "react";
+
+//#region src/hooks/use-latest-ref/index.ts
+const useLatestRef = (value) => {
+	const ref = useRef(null);
+	ref.current = value;
+	return ref;
+};
+
+//#endregion
+export { useLatestRef };
+//# sourceMappingURL=index.js.map

package/dist/esm/hooks/use-latest-ref/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["value: T"],"sources":["../../../../src/hooks/use-latest-ref/index.ts"],"sourcesContent":["\"use client\"\n\nimport type { RefObject } from \"react\"\nimport { useRef } from \"react\"\n\nexport const useLatestRef = <T>(value: T) => {\n  const ref = useRef<null | T>(null)\n\n  ref.current = value\n\n  return ref as RefObject<T>\n}\n"],"mappings":";;;;;;AAKA,MAAa,eAAe,CAAIA,UAAa;CAC3C,MAAM,MAAM,OAAiB,KAAK;AAElC,KAAI,UAAU;AAEd,QAAO;AACR"}

package/dist/esm/hooks/use-lazy-mount/index.js

@@ -0,0 +1,23 @@
+"use client";
+
+
+import { useRef } from "react";
+
+//#region src/hooks/use-lazy-mount/index.ts
+const useLazyMount = ({ children, lazy, lazyBehavior = "unmount", mounted }) => {
+	const beforeMounted = useRef(false);
+	if (!lazy) {
+		beforeMounted.current = false;
+		return children;
+	}
+	if (mounted) {
+		beforeMounted.current = true;
+		return children;
+	}
+	if (lazyBehavior === "keepMounted" && beforeMounted.current) return children;
+	return null;
+};
+
+//#endregion
+export { useLazyMount };
+//# sourceMappingURL=index.js.map

package/dist/esm/hooks/use-lazy-mount/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../../../src/hooks/use-lazy-mount/index.ts"],"sourcesContent":["\"use client\"\n\nimport type { ReactNode } from \"react\"\nimport { useRef } from \"react\"\n\nexport type LazyBehavior = \"keepMounted\" | \"unmount\"\n\nexport interface UseLazyMountProps {\n  children?: ReactNode\n  /**\n   * If `true`, rendering of the content will be deferred until it is selected.\n   *\n   * @default false\n   */\n  lazy?: boolean\n  /**\n   * The lazy behavior of content when not active. Only works when `lazy={true}`.\n   *\n   * - `unmount`: The content is always unmounted.\n   * - `keepMounted`: The content is initially unmounted, but stays mounted when selected.\n   *\n   * @default 'unmount'\n   */\n  lazyBehavior?: LazyBehavior\n  /**\n   * If `true`, the content is mounted.\n   *\n   * @default false\n   */\n  mounted?: boolean\n}\n\nexport const useLazyMount = ({\n  children,\n  lazy,\n  lazyBehavior = \"unmount\",\n  mounted,\n}: UseLazyMountProps): ReactNode => {\n  const beforeMounted = useRef<boolean>(false)\n\n  if (!lazy) {\n    beforeMounted.current = false\n\n    return children\n  }\n\n  if (mounted) {\n    beforeMounted.current = true\n\n    return children\n  }\n\n  if (lazyBehavior === \"keepMounted\" && beforeMounted.current) return children\n\n  return null\n}\n"],"mappings":";;;;;;AAgCA,MAAa,eAAe,CAAC,EAC3B,UACA,MACA,eAAe,WACf,SACkB,KAAgB;CAClC,MAAM,gBAAgB,OAAgB,MAAM;AAE5C,MAAK,MAAM;AACT,gBAAc,UAAU;AAExB,SAAO;CACR;AAED,KAAI,SAAS;AACX,gBAAc,UAAU;AAExB,SAAO;CACR;AAED,KAAI,iBAAiB,iBAAiB,cAAc,QAAS,QAAO;AAEpE,QAAO;AACR"}

package/dist/esm/hooks/use-local-storage/index.js

@@ -0,0 +1,92 @@
+"use client";
+
+
+import { utils_exports } from "../../utils/index.js";
+import { useWindowEvent } from "../use-window-event/index.js";
+import { useCallback, useEffect, useState } from "react";
+
+//#region src/hooks/use-local-storage/index.ts
+const serializeJSON = (value, name) => {
+	try {
+		return JSON.stringify(value);
+	} catch {
+		throw new Error(`useLocalStorage ${name}: Failed to serialize the value`);
+	}
+};
+const deserializeJSON = (value) => {
+	if (!value) return value;
+	try {
+		return JSON.parse(value);
+	} catch {
+		return value;
+	}
+};
+const createStorage = (type, name) => {
+	const eventName = type === "localStorage" ? "local-storage" : "session-storage";
+	return ({ key, defaultValue = void 0, deserialize = deserializeJSON, getInitialValueInEffect = true, serialize = (value$1) => serializeJSON(value$1, name) }) => {
+		const readStorageValue = useCallback((skipStorage) => {
+			if (typeof window === "undefined" || !(type in window) || window[type] == null || skipStorage) return defaultValue ?? "";
+			const storageValue = window[type].getItem(key);
+			return storageValue !== null ? deserialize(storageValue) : defaultValue ?? "";
+		}, [
+			key,
+			deserialize,
+			defaultValue
+		]);
+		const [value, setValue] = useState(readStorageValue(getInitialValueInEffect));
+		const setStorageValue = useCallback((valOrFn) => {
+			if ((0, utils_exports.isFunction)(valOrFn)) setValue((current) => {
+				const result = valOrFn(current);
+				window[type].setItem(key, serialize(result));
+				window.dispatchEvent(new CustomEvent(eventName, { detail: {
+					key,
+					value: valOrFn(current)
+				} }));
+				return result;
+			});
+			else {
+				window[type].setItem(key, serialize(valOrFn));
+				window.dispatchEvent(new CustomEvent(eventName, { detail: {
+					key,
+					value: valOrFn
+				} }));
+				setValue(valOrFn);
+			}
+		}, [key, serialize]);
+		const removeStorageValue = useCallback(() => {
+			window[type].removeItem(key);
+			setValue(defaultValue);
+		}, [defaultValue, key]);
+		useWindowEvent("storage", (ev) => {
+			if (ev.storageArea === window[type] && ev.key === key) setValue(deserialize(ev.newValue ?? void 0));
+		});
+		useWindowEvent(eventName, (ev) => {
+			if (ev.detail.key === key) setValue(ev.detail.value);
+		});
+		useEffect(() => {
+			if (defaultValue !== void 0 && value === void 0) setStorageValue(defaultValue);
+		}, [
+			defaultValue,
+			value,
+			setStorageValue
+		]);
+		useEffect(() => {
+			if (getInitialValueInEffect) setValue(readStorageValue());
+		}, [getInitialValueInEffect, readStorageValue]);
+		return [
+			value === void 0 ? defaultValue : value,
+			setStorageValue,
+			removeStorageValue
+		];
+	};
+};
+/**
+* `useLocalStorage` is a custom hook for storing, updating, and retrieving values in local storage.
+*
+* @see https://yamada-ui.com/hooks/use-local-storage
+*/
+const useLocalStorage = (props) => createStorage("localStorage", "use-local-storage")(props);
+
+//#endregion
+export { createStorage, useLocalStorage };
+//# sourceMappingURL=index.js.map

package/dist/esm/hooks/use-local-storage/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["value: T","name: string","value: string | undefined","type: StorageType","value","skipStorage?: boolean","valOrFn: ((prevState: T) => T) | T","props: StorageProps<T>"],"sources":["../../../../src/hooks/use-local-storage/index.ts"],"sourcesContent":["\"use client\"\n\nimport { useCallback, useEffect, useState } from \"react\"\nimport { isFunction } from \"../../utils\"\nimport { useWindowEvent } from \"../use-window-event\"\n\nexport type StorageType = \"localStorage\" | \"sessionStorage\"\n\nexport interface StorageProps<T> {\n  key: string\n  defaultValue?: T\n  deserialize?: (value: string | undefined) => T\n  getInitialValueInEffect?: boolean\n  serialize?: (value: T) => string\n}\n\nconst serializeJSON = <T>(value: T, name: string) => {\n  try {\n    return JSON.stringify(value)\n  } catch {\n    throw new Error(`useLocalStorage ${name}: Failed to serialize the value`)\n  }\n}\n\nconst deserializeJSON = (value: string | undefined) => {\n  if (!value) return value\n\n  try {\n    return JSON.parse(value)\n  } catch {\n    return value\n  }\n}\n\nexport const createStorage = <T>(type: StorageType, name: string) => {\n  const eventName =\n    type === \"localStorage\" ? \"local-storage\" : \"session-storage\"\n\n  return ({\n    key,\n    defaultValue = undefined,\n    deserialize = deserializeJSON,\n    getInitialValueInEffect = true,\n    serialize = (value: T) => serializeJSON(value, name),\n  }: StorageProps<T>) => {\n    const readStorageValue = useCallback(\n      (skipStorage?: boolean): T => {\n        if (\n          typeof window === \"undefined\" ||\n          !(type in window) ||\n          // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition\n          window[type] == null ||\n          skipStorage\n        ) {\n          return (defaultValue ?? \"\") as T\n        }\n\n        const storageValue = window[type].getItem(key)\n\n        return storageValue !== null\n          ? deserialize(storageValue)\n          : ((defaultValue ?? \"\") as T)\n      },\n      [key, deserialize, defaultValue],\n    )\n\n    const [value, setValue] = useState<T>(\n      readStorageValue(getInitialValueInEffect),\n    )\n\n    const setStorageValue = useCallback(\n      (valOrFn: ((prevState: T) => T) | T) => {\n        if (isFunction(valOrFn)) {\n          setValue((current) => {\n            const result = valOrFn(current)\n\n            window[type].setItem(key, serialize(result))\n            window.dispatchEvent(\n              new CustomEvent(eventName, {\n                detail: { key, value: valOrFn(current) },\n              }),\n            )\n\n            return result\n          })\n        } else {\n          window[type].setItem(key, serialize(valOrFn))\n          window.dispatchEvent(\n            new CustomEvent(eventName, { detail: { key, value: valOrFn } }),\n          )\n\n          setValue(valOrFn)\n        }\n      },\n      [key, serialize],\n    )\n\n    const removeStorageValue = useCallback(() => {\n      window[type].removeItem(key)\n      setValue(defaultValue as T)\n    }, [defaultValue, key])\n\n    useWindowEvent(\"storage\", (ev) => {\n      if (ev.storageArea === window[type] && ev.key === key)\n        setValue(deserialize(ev.newValue ?? undefined))\n    })\n\n    useWindowEvent(eventName, (ev) => {\n      if (ev.detail.key === key) setValue(ev.detail.value)\n    })\n\n    useEffect(() => {\n      if (defaultValue !== undefined && value === undefined)\n        setStorageValue(defaultValue)\n    }, [defaultValue, value, setStorageValue])\n\n    useEffect(() => {\n      if (getInitialValueInEffect) setValue(readStorageValue())\n    }, [getInitialValueInEffect, readStorageValue])\n\n    return [\n      value === undefined ? defaultValue : value,\n      setStorageValue,\n      removeStorageValue,\n    ] as const\n  }\n}\n\n/**\n * `useLocalStorage` is a custom hook for storing, updating, and retrieving values in local storage.\n *\n * @see https://yamada-ui.com/hooks/use-local-storage\n */\nexport const useLocalStorage = <T = string>(props: StorageProps<T>) =>\n  createStorage<T>(\"localStorage\", \"use-local-storage\")(props)\n"],"mappings":";;;;;;;;AAgBA,MAAM,gBAAgB,CAAIA,OAAUC,SAAiB;AACnD,KAAI;AACF,SAAO,KAAK,UAAU,MAAM;CAC7B,QAAO;AACN,QAAM,IAAI,OAAO,kBAAkB,KAAK;CACzC;AACF;AAED,MAAM,kBAAkB,CAACC,UAA8B;AACrD,MAAK,MAAO,QAAO;AAEnB,KAAI;AACF,SAAO,KAAK,MAAM,MAAM;CACzB,QAAO;AACN,SAAO;CACR;AACF;AAED,MAAa,gBAAgB,CAAIC,MAAmBF,SAAiB;CACnE,MAAM,YACJ,SAAS,iBAAiB,kBAAkB;AAE9C,QAAO,CAAC,EACN,KACA,uBACA,cAAc,iBACd,0BAA0B,MAC1B,YAAY,CAACD,YAAa,cAAcI,SAAO,KAAK,EACpC,KAAK;EACrB,MAAM,mBAAmB,YACvB,CAACC,gBAA6B;AAC5B,cACS,WAAW,iBAChB,QAAQ,WAEV,OAAO,SAAS,QAChB,YAEA,QAAQ,gBAAgB;GAG1B,MAAM,eAAe,OAAO,MAAM,QAAQ,IAAI;AAE9C,UAAO,iBAAiB,OACpB,YAAY,aAAa,GACvB,gBAAgB;EACvB,GACD;GAAC;GAAK;GAAa;EAAa,EACjC;EAED,MAAM,CAAC,OAAO,SAAS,GAAG,SACxB,iBAAiB,wBAAwB,CAC1C;EAED,MAAM,kBAAkB,YACtB,CAACC,YAAuC;AACtC,OAAI,8BAAW,QAAQ,CACrB,UAAS,CAAC,YAAY;IACpB,MAAM,SAAS,QAAQ,QAAQ;AAE/B,WAAO,MAAM,QAAQ,KAAK,UAAU,OAAO,CAAC;AAC5C,WAAO,cACL,IAAI,YAAY,WAAW,EACzB,QAAQ;KAAE;KAAK,OAAO,QAAQ,QAAQ;IAAE,EACzC,GACF;AAED,WAAO;GACR,EAAC;QACG;AACL,WAAO,MAAM,QAAQ,KAAK,UAAU,QAAQ,CAAC;AAC7C,WAAO,cACL,IAAI,YAAY,WAAW,EAAE,QAAQ;KAAE;KAAK,OAAO;IAAS,EAAE,GAC/D;AAED,aAAS,QAAQ;GAClB;EACF,GACD,CAAC,KAAK,SAAU,EACjB;EAED,MAAM,qBAAqB,YAAY,MAAM;AAC3C,UAAO,MAAM,WAAW,IAAI;AAC5B,YAAS,aAAkB;EAC5B,GAAE,CAAC,cAAc,GAAI,EAAC;AAEvB,iBAAe,WAAW,CAAC,OAAO;AAChC,OAAI,GAAG,gBAAgB,OAAO,SAAS,GAAG,QAAQ,IAChD,UAAS,YAAY,GAAG,mBAAsB,CAAC;EAClD,EAAC;AAEF,iBAAe,WAAW,CAAC,OAAO;AAChC,OAAI,GAAG,OAAO,QAAQ,IAAK,UAAS,GAAG,OAAO,MAAM;EACrD,EAAC;AAEF,YAAU,MAAM;AACd,OAAI,2BAA8B,iBAChC,iBAAgB,aAAa;EAChC,GAAE;GAAC;GAAc;GAAO;EAAgB,EAAC;AAE1C,YAAU,MAAM;AACd,OAAI,wBAAyB,UAAS,kBAAkB,CAAC;EAC1D,GAAE,CAAC,yBAAyB,gBAAiB,EAAC;AAE/C,SAAO;GACL,mBAAsB,eAAe;GACrC;GACA;EACD;CACF;AACF;;;;;;AAOD,MAAa,kBAAkB,CAAaC,UAC1C,cAAiB,gBAAgB,oBAAoB,CAAC,MAAM"}

package/dist/esm/hooks/use-media-query/index.js

@@ -0,0 +1,34 @@
+"use client";
+
+
+import { useEnvironment } from "../../core/system/environment-provider.js";
+import { useCallback, useSyncExternalStore } from "react";
+
+//#region src/hooks/use-media-query/index.ts
+/**
+* `useMediaQuery` is a custom hook that detects whether it matches a media query.
+*
+* @see https://yamada-ui.com/hooks/use-media-query
+*/
+const useMediaQuery = (query, fallback = false) => {
+	const { getWindow } = useEnvironment();
+	const subscribe = useCallback((onStoreChange) => {
+		const mql = getWindow()?.matchMedia(query);
+		mql?.addEventListener("change", onStoreChange);
+		return () => {
+			mql?.removeEventListener("change", onStoreChange);
+		};
+	}, [getWindow, query]);
+	const getSnapshot = useCallback(() => {
+		return getWindow()?.matchMedia(query).matches ?? fallback;
+	}, [
+		getWindow,
+		query,
+		fallback
+	]);
+	return useSyncExternalStore(subscribe, getSnapshot, getSnapshot);
+};
+
+//#endregion
+export { useMediaQuery };
+//# sourceMappingURL=index.js.map

package/dist/esm/hooks/use-media-query/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["query: string","onStoreChange: () => void"],"sources":["../../../../src/hooks/use-media-query/index.ts"],"sourcesContent":["\"use client\"\n\nimport { useCallback, useSyncExternalStore } from \"react\"\nimport { useEnvironment } from \"../../core\"\n\n/**\n * `useMediaQuery` is a custom hook that detects whether it matches a media query.\n *\n * @see https://yamada-ui.com/hooks/use-media-query\n */\nexport const useMediaQuery = (query: string, fallback = false): boolean => {\n  const { getWindow } = useEnvironment()\n\n  const subscribe = useCallback(\n    (onStoreChange: () => void) => {\n      const mql = getWindow()?.matchMedia(query)\n\n      mql?.addEventListener(\"change\", onStoreChange)\n\n      return () => {\n        mql?.removeEventListener(\"change\", onStoreChange)\n      }\n    },\n    [getWindow, query],\n  )\n\n  const getSnapshot = useCallback(() => {\n    return getWindow()?.matchMedia(query).matches ?? fallback\n  }, [getWindow, query, fallback])\n\n  return useSyncExternalStore(subscribe, getSnapshot, getSnapshot)\n}\n"],"mappings":";;;;;;;;;;;;AAUA,MAAa,gBAAgB,CAACA,OAAe,WAAW,UAAmB;CACzE,MAAM,EAAE,WAAW,GAAG,gBAAgB;CAEtC,MAAM,YAAY,YAChB,CAACC,kBAA8B;EAC7B,MAAM,MAAM,WAAW,EAAE,WAAW,MAAM;AAE1C,OAAK,iBAAiB,UAAU,cAAc;AAE9C,SAAO,MAAM;AACX,QAAK,oBAAoB,UAAU,cAAc;EAClD;CACF,GACD,CAAC,WAAW,KAAM,EACnB;CAED,MAAM,cAAc,YAAY,MAAM;AACpC,SAAO,WAAW,EAAE,WAAW,MAAM,CAAC,WAAW;CAClD,GAAE;EAAC;EAAW;EAAO;CAAS,EAAC;AAEhC,QAAO,qBAAqB,WAAW,aAAa,YAAY;AACjE"}

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

@@ -0,0 +1,27 @@
+"use client";
+
+
+import { useSafeLayoutEffect } from "../../utils/effect.js";
+import { useCallback, useRef, useState } from "react";
+
+//#region src/hooks/use-mounted/index.ts
+function useMounted({ delay = 0, rerender = false } = {}) {
+	const mountedRef = useRef(false);
+	const [mounted, setMounted] = useState(false);
+	useSafeLayoutEffect(() => {
+		mountedRef.current = true;
+		let timeoutId = null;
+		if (rerender) if (delay > 0) timeoutId = setTimeout(() => setMounted(true), delay);
+		else setMounted(true);
+		return () => {
+			mountedRef.current = false;
+			if (rerender) setMounted(false);
+			if (timeoutId) clearTimeout(timeoutId);
+		};
+	}, [delay, rerender]);
+	return [useCallback(() => mountedRef.current, []), mounted];
+}
+
+//#endregion
+export { useMounted };
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["timeoutId: NodeJS.Timeout | null"],"sources":["../../../../src/hooks/use-mounted/index.ts"],"sourcesContent":["\"use client\"\n\nimport { useCallback, useState } from \"react\"\nimport { useRef } from \"react\"\nimport { useSafeLayoutEffect } from \"../../utils\"\n\nexport interface UseMountedProps {\n  delay?: number\n  rerender?: boolean\n}\n\nexport function useMounted({\n  delay = 0,\n  rerender = false,\n}: UseMountedProps = {}): [() => boolean, boolean] {\n  const mountedRef = useRef(false)\n  const [mounted, setMounted] = useState(false)\n\n  useSafeLayoutEffect(() => {\n    mountedRef.current = true\n\n    let timeoutId: NodeJS.Timeout | null = null\n\n    if (rerender) {\n      if (delay > 0) {\n        timeoutId = setTimeout(() => setMounted(true), delay)\n      } else {\n        setMounted(true)\n      }\n    }\n\n    return () => {\n      mountedRef.current = false\n\n      if (rerender) setMounted(false)\n\n      if (timeoutId) clearTimeout(timeoutId)\n    }\n  }, [delay, rerender])\n\n  return [useCallback(() => mountedRef.current, []), mounted]\n}\n\nexport type UseMountedReturn = ReturnType<typeof useMounted>\n"],"mappings":";;;;;;;AAWA,SAAgB,WAAW,EACzB,QAAQ,GACR,WAAW,OACK,GAAG,CAAE,GAA4B;CACjD,MAAM,aAAa,OAAO,MAAM;CAChC,MAAM,CAAC,SAAS,WAAW,GAAG,SAAS,MAAM;AAE7C,qBAAoB,MAAM;AACxB,aAAW,UAAU;EAErB,IAAIA,YAAmC;AAEvC,MAAI,SACF,KAAI,QAAQ,EACV,aAAY,WAAW,MAAM,WAAW,KAAK,EAAE,MAAM;MAErD,YAAW,KAAK;AAIpB,SAAO,MAAM;AACX,cAAW,UAAU;AAErB,OAAI,SAAU,YAAW,MAAM;AAE/B,OAAI,UAAW,cAAa,UAAU;EACvC;CACF,GAAE,CAAC,OAAO,QAAS,EAAC;AAErB,QAAO,CAAC,YAAY,MAAM,WAAW,SAAS,CAAE,EAAC,EAAE,OAAQ;AAC5D"}

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

@@ -0,0 +1,25 @@
+"use client";
+
+
+import { useSyncExternalStore } from "react";
+
+//#region src/hooks/use-online/index.ts
+function subscribe(callback) {
+	window.addEventListener("online", callback);
+	window.addEventListener("offline", callback);
+	return () => {
+		window.removeEventListener("online", callback);
+		window.removeEventListener("offline", callback);
+	};
+}
+function getSnapshot() {
+	return window.navigator.onLine;
+}
+function useOnline(getServerSnapshot = () => true) {
+	const online = useSyncExternalStore(subscribe, getSnapshot, getServerSnapshot);
+	return online;
+}
+
+//#endregion
+export { useOnline };
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["callback: () => void","getServerSnapshot: () => boolean"],"sources":["../../../../src/hooks/use-online/index.ts"],"sourcesContent":["\"use client\"\n\nimport { useSyncExternalStore } from \"react\"\n\nfunction subscribe(callback: () => void) {\n  window.addEventListener(\"online\", callback)\n  window.addEventListener(\"offline\", callback)\n\n  return () => {\n    window.removeEventListener(\"online\", callback)\n    window.removeEventListener(\"offline\", callback)\n  }\n}\n\nfunction getSnapshot() {\n  return window.navigator.onLine\n}\n\nexport interface UseOnlineProps {}\n\nexport function useOnline(\n  getServerSnapshot: () => boolean = () => true,\n): boolean {\n  const online = useSyncExternalStore(subscribe, getSnapshot, getServerSnapshot)\n\n  return online\n}\n\nexport type UseOnlineReturn = ReturnType<typeof useOnline>\n"],"mappings":";;;;;;AAIA,SAAS,UAAUA,UAAsB;AACvC,QAAO,iBAAiB,UAAU,SAAS;AAC3C,QAAO,iBAAiB,WAAW,SAAS;AAE5C,QAAO,MAAM;AACX,SAAO,oBAAoB,UAAU,SAAS;AAC9C,SAAO,oBAAoB,WAAW,SAAS;CAChD;AACF;AAED,SAAS,cAAc;AACrB,QAAO,OAAO,UAAU;AACzB;AAID,SAAgB,UACdC,oBAAmC,MAAM,MAChC;CACT,MAAM,SAAS,qBAAqB,WAAW,aAAa,kBAAkB;AAE9E,QAAO;AACR"}

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

@@ -0,0 +1,32 @@
+import { utils_exports } from "../../utils/index.js";
+
+//#region src/hooks/use-os/index.ts
+const getOS = () => {
+	const { userAgent } = window.navigator;
+	const macos = /(Macintosh)|(MacIntel)|(MacPPC)|(Mac68K)/i;
+	const windows = /(Win32)|(Win64)|(Windows)|(WinCE)/i;
+	const ios = /(iPhone)|(iPad)|(iPod)/i;
+	const android = /Android/i;
+	const linux = /Linux/i;
+	const chromeos = /CrOS/i;
+	if (macos.test(userAgent)) return "macos";
+	if (ios.test(userAgent)) return "ios";
+	if (windows.test(userAgent)) return "windows";
+	if (android.test(userAgent)) return "android";
+	if (linux.test(userAgent)) return "linux";
+	if (chromeos.test(userAgent)) return "chromeos";
+	return "undetermined";
+};
+/**
+* `useOS` is a custom hook that returns the user's OS.
+*
+* @see https://yamada-ui.com/hooks/use-os
+*/
+const useOS = () => {
+	if (!(0, utils_exports.isUndefined)(window)) return getOS();
+	return "undetermined";
+};
+
+//#endregion
+export { useOS };
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../../../src/hooks/use-os/index.ts"],"sourcesContent":["import { isUndefined } from \"../../utils\"\n\nexport type OS =\n  | \"android\"\n  | \"chromeos\"\n  | \"ios\"\n  | \"linux\"\n  | \"macos\"\n  | \"undetermined\"\n  | \"windows\"\n\nconst getOS = (): OS => {\n  const { userAgent } = window.navigator\n\n  const macos = /(Macintosh)|(MacIntel)|(MacPPC)|(Mac68K)/i\n  const windows = /(Win32)|(Win64)|(Windows)|(WinCE)/i\n  const ios = /(iPhone)|(iPad)|(iPod)/i\n  const android = /Android/i\n  const linux = /Linux/i\n  const chromeos = /CrOS/i\n\n  if (macos.test(userAgent)) return \"macos\"\n  if (ios.test(userAgent)) return \"ios\"\n  if (windows.test(userAgent)) return \"windows\"\n  if (android.test(userAgent)) return \"android\"\n  if (linux.test(userAgent)) return \"linux\"\n  if (chromeos.test(userAgent)) return \"chromeos\"\n\n  return \"undetermined\"\n}\n\n/**\n * `useOS` is a custom hook that returns the user's OS.\n *\n * @see https://yamada-ui.com/hooks/use-os\n */\nexport const useOS = (): OS => {\n  if (!isUndefined(window)) return getOS()\n\n  return \"undetermined\"\n}\n"],"mappings":";;;AAWA,MAAM,QAAQ,MAAU;CACtB,MAAM,EAAE,WAAW,GAAG,OAAO;CAE7B,MAAM,QAAQ;CACd,MAAM,UAAU;CAChB,MAAM,MAAM;CACZ,MAAM,UAAU;CAChB,MAAM,QAAQ;CACd,MAAM,WAAW;AAEjB,KAAI,MAAM,KAAK,UAAU,CAAE,QAAO;AAClC,KAAI,IAAI,KAAK,UAAU,CAAE,QAAO;AAChC,KAAI,QAAQ,KAAK,UAAU,CAAE,QAAO;AACpC,KAAI,QAAQ,KAAK,UAAU,CAAE,QAAO;AACpC,KAAI,MAAM,KAAK,UAAU,CAAE,QAAO;AAClC,KAAI,SAAS,KAAK,UAAU,CAAE,QAAO;AAErC,QAAO;AACR;;;;;;AAOD,MAAa,QAAQ,MAAU;AAC7B,MAAK,+BAAY,OAAO,CAAE,QAAO,OAAO;AAExC,QAAO;AACR"}

package/dist/esm/hooks/use-outside-click/index.js

@@ -0,0 +1,83 @@
+"use client";
+
+
+import { useCallbackRef } from "../../utils/ref.js";
+import { utils_exports } from "../../utils/index.js";
+import { useCallback, useEffect, useRef } from "react";
+
+//#region src/hooks/use-outside-click/index.ts
+/**
+* `useOutsideClick` is a custom hook that detects click events outside of an element.
+*
+* @see https://yamada-ui.com/hooks/use-outside-click
+*/
+const useOutsideClick = ({ ref, enabled = true, handler }) => {
+	const handlerRef = useCallbackRef(handler);
+	const state = useRef({
+		ignoreEmulatedMouseEvents: false,
+		isPointerDown: false
+	});
+	const onPointerDown = useCallback((ev) => {
+		if (isValidEvent(ev, ref)) state.current.isPointerDown = true;
+	}, [ref]);
+	const onMouseUp = useCallback((ev) => {
+		if (state.current.ignoreEmulatedMouseEvents) {
+			state.current.ignoreEmulatedMouseEvents = false;
+			return;
+		}
+		if (state.current.isPointerDown && handler && isValidEvent(ev, ref)) {
+			state.current.isPointerDown = false;
+			handlerRef(ev);
+		}
+	}, [
+		handler,
+		handlerRef,
+		ref
+	]);
+	const onTouchEnd = useCallback((ev) => {
+		state.current.ignoreEmulatedMouseEvents = true;
+		if (state.current.isPointerDown && handler && isValidEvent(ev, ref)) {
+			state.current.isPointerDown = false;
+			handlerRef(ev);
+		}
+	}, [
+		handler,
+		handlerRef,
+		ref
+	]);
+	useEffect(() => {
+		if (!enabled) return;
+		const doc = (0, utils_exports.getDocument)(ref.current);
+		doc.addEventListener("mousedown", onPointerDown, true);
+		doc.addEventListener("mouseup", onMouseUp, true);
+		doc.addEventListener("touchstart", onPointerDown, true);
+		doc.addEventListener("touchend", onTouchEnd, true);
+		return () => {
+			doc.removeEventListener("mousedown", onPointerDown, true);
+			doc.removeEventListener("mouseup", onMouseUp, true);
+			doc.removeEventListener("touchstart", onPointerDown, true);
+			doc.removeEventListener("touchend", onTouchEnd, true);
+		};
+	}, [
+		handler,
+		ref,
+		handlerRef,
+		state,
+		enabled,
+		onPointerDown,
+		onMouseUp,
+		onTouchEnd
+	]);
+};
+const isValidEvent = (ev, ref) => {
+	const target = ev.target;
+	if ("button" in ev && ev.button > 0) return false;
+	if (target) {
+		if (!(0, utils_exports.getDocument)(target).contains(target)) return false;
+	}
+	return !ref.current?.contains(target);
+};
+
+//#endregion
+export { useOutsideClick };
+//# sourceMappingURL=index.js.map

package/dist/esm/hooks/use-outside-click/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["ev: MouseEvent | TouchEvent","ev: MouseEvent","ev: TouchEvent","ref: RefObject<HTMLElement | null>"],"sources":["../../../../src/hooks/use-outside-click/index.ts"],"sourcesContent":["\"use client\"\n\nimport type { RefObject } from \"react\"\nimport { useCallback, useEffect, useRef } from \"react\"\nimport { getDocument, useCallbackRef } from \"../../utils\"\n\nexport interface UseOutsideClickProps {\n  ref: React.RefObject<HTMLElement | null>\n  enabled?: boolean\n  handler?: (ev: Event) => void\n}\n\n/**\n * `useOutsideClick` is a custom hook that detects click events outside of an element.\n *\n * @see https://yamada-ui.com/hooks/use-outside-click\n */\nexport const useOutsideClick = ({\n  ref,\n  enabled = true,\n  handler,\n}: UseOutsideClickProps) => {\n  const handlerRef = useCallbackRef(handler)\n\n  const state = useRef({\n    ignoreEmulatedMouseEvents: false,\n    isPointerDown: false,\n  })\n\n  const onPointerDown = useCallback(\n    (ev: MouseEvent | TouchEvent) => {\n      if (isValidEvent(ev, ref)) state.current.isPointerDown = true\n    },\n    [ref],\n  )\n\n  const onMouseUp = useCallback(\n    (ev: MouseEvent) => {\n      if (state.current.ignoreEmulatedMouseEvents) {\n        state.current.ignoreEmulatedMouseEvents = false\n\n        return\n      }\n\n      if (state.current.isPointerDown && handler && isValidEvent(ev, ref)) {\n        state.current.isPointerDown = false\n\n        handlerRef(ev)\n      }\n    },\n    [handler, handlerRef, ref],\n  )\n\n  const onTouchEnd = useCallback(\n    (ev: TouchEvent) => {\n      state.current.ignoreEmulatedMouseEvents = true\n\n      if (state.current.isPointerDown && handler && isValidEvent(ev, ref)) {\n        state.current.isPointerDown = false\n\n        handlerRef(ev)\n      }\n    },\n    [handler, handlerRef, ref],\n  )\n\n  useEffect(() => {\n    if (!enabled) return\n\n    const doc = getDocument(ref.current)\n\n    doc.addEventListener(\"mousedown\", onPointerDown, true)\n    doc.addEventListener(\"mouseup\", onMouseUp, true)\n    doc.addEventListener(\"touchstart\", onPointerDown, true)\n    doc.addEventListener(\"touchend\", onTouchEnd, true)\n\n    return () => {\n      doc.removeEventListener(\"mousedown\", onPointerDown, true)\n      doc.removeEventListener(\"mouseup\", onMouseUp, true)\n      doc.removeEventListener(\"touchstart\", onPointerDown, true)\n      doc.removeEventListener(\"touchend\", onTouchEnd, true)\n    }\n  }, [\n    handler,\n    ref,\n    handlerRef,\n    state,\n    enabled,\n    onPointerDown,\n    onMouseUp,\n    onTouchEnd,\n  ])\n}\n\nconst isValidEvent = (\n  ev: MouseEvent | TouchEvent,\n  ref: RefObject<HTMLElement | null>,\n) => {\n  const target = ev.target as HTMLElement | null\n\n  if (\"button\" in ev && ev.button > 0) return false\n\n  if (target) if (!getDocument(target).contains(target)) return false\n\n  return !ref.current?.contains(target)\n}\n"],"mappings":";;;;;;;;;;;;;AAiBA,MAAa,kBAAkB,CAAC,EAC9B,KACA,UAAU,MACV,SACqB,KAAK;CAC1B,MAAM,aAAa,eAAe,QAAQ;CAE1C,MAAM,QAAQ,OAAO;EACnB,2BAA2B;EAC3B,eAAe;CAChB,EAAC;CAEF,MAAM,gBAAgB,YACpB,CAACA,OAAgC;AAC/B,MAAI,aAAa,IAAI,IAAI,CAAE,OAAM,QAAQ,gBAAgB;CAC1D,GACD,CAAC,GAAI,EACN;CAED,MAAM,YAAY,YAChB,CAACC,OAAmB;AAClB,MAAI,MAAM,QAAQ,2BAA2B;AAC3C,SAAM,QAAQ,4BAA4B;AAE1C;EACD;AAED,MAAI,MAAM,QAAQ,iBAAiB,WAAW,aAAa,IAAI,IAAI,EAAE;AACnE,SAAM,QAAQ,gBAAgB;AAE9B,cAAW,GAAG;EACf;CACF,GACD;EAAC;EAAS;EAAY;CAAI,EAC3B;CAED,MAAM,aAAa,YACjB,CAACC,OAAmB;AAClB,QAAM,QAAQ,4BAA4B;AAE1C,MAAI,MAAM,QAAQ,iBAAiB,WAAW,aAAa,IAAI,IAAI,EAAE;AACnE,SAAM,QAAQ,gBAAgB;AAE9B,cAAW,GAAG;EACf;CACF,GACD;EAAC;EAAS;EAAY;CAAI,EAC3B;AAED,WAAU,MAAM;AACd,OAAK,QAAS;EAEd,MAAM,MAAM,+BAAY,IAAI,QAAQ;AAEpC,MAAI,iBAAiB,aAAa,eAAe,KAAK;AACtD,MAAI,iBAAiB,WAAW,WAAW,KAAK;AAChD,MAAI,iBAAiB,cAAc,eAAe,KAAK;AACvD,MAAI,iBAAiB,YAAY,YAAY,KAAK;AAElD,SAAO,MAAM;AACX,OAAI,oBAAoB,aAAa,eAAe,KAAK;AACzD,OAAI,oBAAoB,WAAW,WAAW,KAAK;AACnD,OAAI,oBAAoB,cAAc,eAAe,KAAK;AAC1D,OAAI,oBAAoB,YAAY,YAAY,KAAK;EACtD;CACF,GAAE;EACD;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACD,EAAC;AACH;AAED,MAAM,eAAe,CACnBF,IACAG,QACG;CACH,MAAM,SAAS,GAAG;AAElB,KAAI,YAAY,MAAM,GAAG,SAAS,EAAG,QAAO;AAE5C,KAAI,QAAQ;OAAK,+BAAY,OAAO,CAAC,SAAS,OAAO,CAAE,QAAO;CAAK;AAEnE,SAAQ,IAAI,SAAS,SAAS,OAAO;AACtC"}