@reause/shared 0.1.2

package/dist/index.iife.js

@@ -0,0 +1,3381 @@
+(function(exports, react) {
+	Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+	//#region \0rolldown/runtime.js
+	var __commonJSMin = (cb, mod) => () => (mod || (cb((mod = { exports: {} }).exports, mod), cb = null), mod.exports);
+	//#endregion
+	//#region createEventHook/index.tsx
+	/**
+	* Utility for creating event hooks
+	*
+	* @see https://vueuse.org/createEventHook
+	*
+	* @__NO_SIDE_EFFECTS__
+	*/
+	function createEventHook() {
+		const fns = /* @__PURE__ */ new Set();
+		const off = (fn) => {
+			fns.delete(fn);
+		};
+		const clear = () => {
+			fns.clear();
+		};
+		const on = (fn) => {
+			fns.add(fn);
+			const offFn = () => off(fn);
+			return { off: offFn };
+		};
+		const trigger = (...args) => {
+			return Promise.all(Array.from(fns).map((fn) => fn(...args)));
+		};
+		return {
+			on,
+			off,
+			trigger,
+			clear
+		};
+	}
+	//#endregion
+	//#region createGlobalState/index.tsx
+	/* @__NO_SIDE_EFFECTS__ */
+	function createGlobalState(initialState) {
+		let state = typeof initialState === "function" ? initialState() : initialState;
+		const listeners = /* @__PURE__ */ new Set();
+		const subscribe = (listener) => {
+			listeners.add(listener);
+			return () => {
+				listeners.delete(listener);
+			};
+		};
+		const getSnapshot = () => state;
+		const setState = (update) => {
+			state = typeof update === "function" ? update(state) : update;
+			for (const listener of listeners) listener();
+		};
+		return function useGlobalState() {
+			const snapshot = (0, react.useSyncExternalStore)(subscribe, getSnapshot, getSnapshot);
+			return (0, react.useMemo)(() => [snapshot, setState], [snapshot, setState]);
+		};
+	}
+	//#endregion
+	//#region ../../node_modules/.pnpm/react@19.2.8/node_modules/react/cjs/react-jsx-runtime.development.js
+	/**
+	* @license React
+	* react-jsx-runtime.development.js
+	*
+	* Copyright (c) Meta Platforms, Inc. and affiliates.
+	*
+	* This source code is licensed under the MIT license found in the
+	* LICENSE file in the root directory of this source tree.
+	*/
+	var require_react_jsx_runtime_development = /* @__PURE__ */ __commonJSMin(((exports) => {
+		(function() {
+			function getComponentNameFromType(type) {
+				if (null == type) return null;
+				if ("function" === typeof type) return type.$$typeof === REACT_CLIENT_REFERENCE ? null : type.displayName || type.name || null;
+				if ("string" === typeof type) return type;
+				switch (type) {
+					case REACT_FRAGMENT_TYPE: return "Fragment";
+					case REACT_PROFILER_TYPE: return "Profiler";
+					case REACT_STRICT_MODE_TYPE: return "StrictMode";
+					case REACT_SUSPENSE_TYPE: return "Suspense";
+					case REACT_SUSPENSE_LIST_TYPE: return "SuspenseList";
+					case REACT_ACTIVITY_TYPE: return "Activity";
+				}
+				if ("object" === typeof type) switch ("number" === typeof type.tag && console.error("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."), type.$$typeof) {
+					case REACT_PORTAL_TYPE: return "Portal";
+					case REACT_CONTEXT_TYPE: return type.displayName || "Context";
+					case REACT_CONSUMER_TYPE: return (type._context.displayName || "Context") + ".Consumer";
+					case REACT_FORWARD_REF_TYPE:
+						var innerType = type.render;
+						type = type.displayName;
+						type || (type = innerType.displayName || innerType.name || "", type = "" !== type ? "ForwardRef(" + type + ")" : "ForwardRef");
+						return type;
+					case REACT_MEMO_TYPE: return innerType = type.displayName || null, null !== innerType ? innerType : getComponentNameFromType(type.type) || "Memo";
+					case REACT_LAZY_TYPE:
+						innerType = type._payload;
+						type = type._init;
+						try {
+							return getComponentNameFromType(type(innerType));
+						} catch (x) {}
+				}
+				return null;
+			}
+			function testStringCoercion(value) {
+				return "" + value;
+			}
+			function checkKeyStringCoercion(value) {
+				try {
+					testStringCoercion(value);
+					var JSCompiler_inline_result = !1;
+				} catch (e) {
+					JSCompiler_inline_result = !0;
+				}
+				if (JSCompiler_inline_result) {
+					JSCompiler_inline_result = console;
+					var JSCompiler_temp_const = JSCompiler_inline_result.error;
+					var JSCompiler_inline_result$jscomp$0 = "function" === typeof Symbol && Symbol.toStringTag && value[Symbol.toStringTag] || value.constructor.name || "Object";
+					JSCompiler_temp_const.call(JSCompiler_inline_result, "The provided key is an unsupported type %s. This value must be coerced to a string before using it here.", JSCompiler_inline_result$jscomp$0);
+					return testStringCoercion(value);
+				}
+			}
+			function getTaskName(type) {
+				if (type === REACT_FRAGMENT_TYPE) return "<>";
+				if ("object" === typeof type && null !== type && type.$$typeof === REACT_LAZY_TYPE) return "<...>";
+				try {
+					var name = getComponentNameFromType(type);
+					return name ? "<" + name + ">" : "<...>";
+				} catch (x) {
+					return "<...>";
+				}
+			}
+			function getOwner() {
+				var dispatcher = ReactSharedInternals.A;
+				return null === dispatcher ? null : dispatcher.getOwner();
+			}
+			function UnknownOwner() {
+				return Error("react-stack-top-frame");
+			}
+			function hasValidKey(config) {
+				if (hasOwnProperty.call(config, "key")) {
+					var getter = Object.getOwnPropertyDescriptor(config, "key").get;
+					if (getter && getter.isReactWarning) return !1;
+				}
+				return void 0 !== config.key;
+			}
+			function defineKeyPropWarningGetter(props, displayName) {
+				function warnAboutAccessingKey() {
+					specialPropKeyWarningShown || (specialPropKeyWarningShown = !0, console.error("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)", displayName));
+				}
+				warnAboutAccessingKey.isReactWarning = !0;
+				Object.defineProperty(props, "key", {
+					get: warnAboutAccessingKey,
+					configurable: !0
+				});
+			}
+			function elementRefGetterWithDeprecationWarning() {
+				var componentName = getComponentNameFromType(this.type);
+				didWarnAboutElementRef[componentName] || (didWarnAboutElementRef[componentName] = !0, console.error("Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release."));
+				componentName = this.props.ref;
+				return void 0 !== componentName ? componentName : null;
+			}
+			function ReactElement(type, key, props, owner, debugStack, debugTask) {
+				var refProp = props.ref;
+				type = {
+					$$typeof: REACT_ELEMENT_TYPE,
+					type,
+					key,
+					props,
+					_owner: owner
+				};
+				null !== (void 0 !== refProp ? refProp : null) ? Object.defineProperty(type, "ref", {
+					enumerable: !1,
+					get: elementRefGetterWithDeprecationWarning
+				}) : Object.defineProperty(type, "ref", {
+					enumerable: !1,
+					value: null
+				});
+				type._store = {};
+				Object.defineProperty(type._store, "validated", {
+					configurable: !1,
+					enumerable: !1,
+					writable: !0,
+					value: 0
+				});
+				Object.defineProperty(type, "_debugInfo", {
+					configurable: !1,
+					enumerable: !1,
+					writable: !0,
+					value: null
+				});
+				Object.defineProperty(type, "_debugStack", {
+					configurable: !1,
+					enumerable: !1,
+					writable: !0,
+					value: debugStack
+				});
+				Object.defineProperty(type, "_debugTask", {
+					configurable: !1,
+					enumerable: !1,
+					writable: !0,
+					value: debugTask
+				});
+				Object.freeze && (Object.freeze(type.props), Object.freeze(type));
+				return type;
+			}
+			function jsxDEVImpl(type, config, maybeKey, isStaticChildren, debugStack, debugTask) {
+				var children = config.children;
+				if (void 0 !== children) if (isStaticChildren) if (isArrayImpl(children)) {
+					for (isStaticChildren = 0; isStaticChildren < children.length; isStaticChildren++) validateChildKeys(children[isStaticChildren]);
+					Object.freeze && Object.freeze(children);
+				} else console.error("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");
+				else validateChildKeys(children);
+				if (hasOwnProperty.call(config, "key")) {
+					children = getComponentNameFromType(type);
+					var keys = Object.keys(config).filter(function(k) {
+						return "key" !== k;
+					});
+					isStaticChildren = 0 < keys.length ? "{key: someKey, " + keys.join(": ..., ") + ": ...}" : "{key: someKey}";
+					didWarnAboutKeySpread[children + isStaticChildren] || (keys = 0 < keys.length ? "{" + keys.join(": ..., ") + ": ...}" : "{}", console.error("A props object containing a \"key\" prop is being spread into JSX:\n  let props = %s;\n  <%s {...props} />\nReact keys must be passed directly to JSX without using spread:\n  let props = %s;\n  <%s key={someKey} {...props} />", isStaticChildren, children, keys, children), didWarnAboutKeySpread[children + isStaticChildren] = !0);
+				}
+				children = null;
+				void 0 !== maybeKey && (checkKeyStringCoercion(maybeKey), children = "" + maybeKey);
+				hasValidKey(config) && (checkKeyStringCoercion(config.key), children = "" + config.key);
+				if ("key" in config) {
+					maybeKey = {};
+					for (var propName in config) "key" !== propName && (maybeKey[propName] = config[propName]);
+				} else maybeKey = config;
+				children && defineKeyPropWarningGetter(maybeKey, "function" === typeof type ? type.displayName || type.name || "Unknown" : type);
+				return ReactElement(type, children, maybeKey, getOwner(), debugStack, debugTask);
+			}
+			function validateChildKeys(node) {
+				isValidElement(node) ? node._store && (node._store.validated = 1) : "object" === typeof node && null !== node && node.$$typeof === REACT_LAZY_TYPE && ("fulfilled" === node._payload.status ? isValidElement(node._payload.value) && node._payload.value._store && (node._payload.value._store.validated = 1) : node._store && (node._store.validated = 1));
+			}
+			function isValidElement(object) {
+				return "object" === typeof object && null !== object && object.$$typeof === REACT_ELEMENT_TYPE;
+			}
+			var React = require("react"), REACT_ELEMENT_TYPE = Symbol.for("react.transitional.element"), REACT_PORTAL_TYPE = Symbol.for("react.portal"), REACT_FRAGMENT_TYPE = Symbol.for("react.fragment"), REACT_STRICT_MODE_TYPE = Symbol.for("react.strict_mode"), REACT_PROFILER_TYPE = Symbol.for("react.profiler"), REACT_CONSUMER_TYPE = Symbol.for("react.consumer"), REACT_CONTEXT_TYPE = Symbol.for("react.context"), REACT_FORWARD_REF_TYPE = Symbol.for("react.forward_ref"), REACT_SUSPENSE_TYPE = Symbol.for("react.suspense"), REACT_SUSPENSE_LIST_TYPE = Symbol.for("react.suspense_list"), REACT_MEMO_TYPE = Symbol.for("react.memo"), REACT_LAZY_TYPE = Symbol.for("react.lazy"), REACT_ACTIVITY_TYPE = Symbol.for("react.activity"), REACT_CLIENT_REFERENCE = Symbol.for("react.client.reference"), ReactSharedInternals = React.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, hasOwnProperty = Object.prototype.hasOwnProperty, isArrayImpl = Array.isArray, createTask = console.createTask ? console.createTask : function() {
+				return null;
+			};
+			React = { react_stack_bottom_frame: function(callStackForError) {
+				return callStackForError();
+			} };
+			var specialPropKeyWarningShown;
+			var didWarnAboutElementRef = {};
+			var unknownOwnerDebugStack = React.react_stack_bottom_frame.bind(React, UnknownOwner)();
+			var unknownOwnerDebugTask = createTask(getTaskName(UnknownOwner));
+			var didWarnAboutKeySpread = {};
+			exports.Fragment = REACT_FRAGMENT_TYPE;
+			exports.jsx = function(type, config, maybeKey) {
+				var trackActualOwner = 1e4 > ReactSharedInternals.recentlyCreatedOwnerStacks++;
+				return jsxDEVImpl(type, config, maybeKey, !1, trackActualOwner ? Error("react-stack-top-frame") : unknownOwnerDebugStack, trackActualOwner ? createTask(getTaskName(type)) : unknownOwnerDebugTask);
+			};
+			exports.jsxs = function(type, config, maybeKey) {
+				var trackActualOwner = 1e4 > ReactSharedInternals.recentlyCreatedOwnerStacks++;
+				return jsxDEVImpl(type, config, maybeKey, !0, trackActualOwner ? Error("react-stack-top-frame") : unknownOwnerDebugStack, trackActualOwner ? createTask(getTaskName(type)) : unknownOwnerDebugTask);
+			};
+		})();
+	}));
+	//#endregion
+	//#region createInjectionState/index.tsx
+	var import_jsx_runtime = (/* @__PURE__ */ __commonJSMin(((exports, module) => {
+		module.exports = require_react_jsx_runtime_development();
+	})))();
+	function createInjectionState(composable, options) {
+		var _options$injectionKey;
+		const InjectionContext = (_options$injectionKey = options === null || options === void 0 ? void 0 : options.injectionKey) !== null && _options$injectionKey !== void 0 ? _options$injectionKey : (0, react.createContext)(options === null || options === void 0 ? void 0 : options.defaultValue);
+		function Provider(props) {
+			const { children, ...rest } = props;
+			const state = composable(rest);
+			return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(InjectionContext.Provider, {
+				value: state,
+				children
+			});
+		}
+		Provider.displayName = composable.name ? `${composable.name}Provider` : "InjectionStateProvider";
+		const useInjectedState = () => (0, react.useContext)(InjectionContext);
+		return [Provider, useInjectedState];
+	}
+	//#endregion
+	//#region createSharedHook/index.tsx
+	/**
+	* Make a composable function usable with multiple React components.
+	*
+	* Map from @vueuse/shared `createSharedComposable`
+	* Mapping: upstream runs the composable once inside a detached
+	* `effectScope(true)`, counts the subscribers and stops the scope when the
+	* last consumer leaves. React has no `effectScope`, so the same lifetime is
+	* expressed by an external store held in the closure of one
+	* `createSharedHook` call — the `state` snapshot, a `Set` of `listeners`, the
+	* `refCount` and the optional `cleanup` — which every consumer reads through
+	* `useSyncExternalStore`.
+	*
+	* The shared instance is created by the **first consumer to render** (the
+	* "creator"): it runs the wrapped hook on every one of its renders — the
+	* wrapped hook is therefore free to use React hooks internally — assigning
+	* the result to `state`, and `useLayoutEffect` publishes the latest value to
+	* every other consumer after commit. Every later consumer never calls the
+	* wrapped hook (both call patterns are stable per consumer, so the hook order
+	* never changes across renders); it just reads the published snapshot. The
+	* creator assigns `state` *before* `useSyncExternalStore` reads its snapshot
+	* in the same render, so every consumer — creator included — receives the
+	* shared value on its very first render, never `undefined`.
+	*
+	* The creator deliberately **does not register a store listener**: it already
+	* re-renders on its own state changes (the wrapped hook's setters belong to
+	* its component) and re-publishes afterwards, so a notification would only
+	* re-render it from its own publish. `useSyncExternalStore` requires the
+	* snapshot to stay reference-stable between real changes ("the result of
+	* getSnapshot should be cached"): every creator render assigns a fresh
+	* reference, so a subscribed creator would see "the store changed" forever and
+	* loop. The creator still counts toward `refCount`, so teardown timing is
+	* exact — it just never receives notifications.
+	*
+	* Deviations from upstream:
+	* - upstream runs the composable exactly once, with the first caller's
+	*   arguments; here the creator re-runs the wrapped hook on every one of its
+	*   renders (React hooks cannot be called outside a render), so while the
+	*   creator stays mounted the shared value keeps tracking its latest render.
+	* - **frozen after the creator unmounts**: the wrapped hook's setters belong
+	*   to the creator's component, so if the creator unmounts while other
+	*   consumers remain mounted, the shared value stops updating — it freezes at
+	*   the last published value. The instance itself lives on until the last
+	*   consumer unmounts (upstream lifetime parity).
+	* - `getServerSnapshot` returns the same snapshot as the client: server
+	*   rendering yields the uninitialized value, the client fills it in after
+	*   hydration, and `useSyncExternalStore` handles the mismatch.
+	* - Teardown has no `tryOnScopeDispose` to hook into, so the optional
+	*   `cleanup` argument is called — and the state dropped — when the last
+	*   consumer unmounts; a later mount starts a fresh instance, exactly like
+	*   upstream's `scope.stop()` followed by `state = undefined`.
+	*
+	* ```tsx
+	* const useSharedMouse = createSharedHook(useMouse)
+	*
+	* // CompA — const { x, y } = useSharedMouse()
+	* // CompB — const { x, y } = useSharedMouse() // same state, no new listeners
+	* ```
+	*
+	* @see https://vueuse.org/createSharedComposable
+	* @param hook The composable to share across every consumer of the returned
+	* hook. It runs on every render of the first consumer (the creator).
+	* @param cleanup Called when the last consumer unmounts, before the shared
+	* state is dropped — the place to undo whatever `hook` set up outside React.
+	*/
+	/* @__NO_SIDE_EFFECTS__ */
+	function createSharedHook(hook, cleanup) {
+		let state;
+		const listeners = /* @__PURE__ */ new Set();
+		let refCount = 0;
+		let teardown = cleanup;
+		let creatorId;
+		const notify = () => {
+			for (const listener of listeners) listener();
+		};
+		const subscribe = (listener) => {
+			listeners.add(listener);
+			refCount += 1;
+			return () => {
+				listeners.delete(listener);
+				refCount -= 1;
+				if (refCount <= 0) {
+					state = void 0;
+					refCount = 0;
+					creatorId = void 0;
+					teardown === null || teardown === void 0 || teardown();
+					teardown = void 0;
+				}
+			};
+		};
+		const creatorSubscribe = (_listener) => {
+			refCount += 1;
+			return () => {
+				refCount -= 1;
+				if (refCount <= 0) {
+					state = void 0;
+					refCount = 0;
+					creatorId = void 0;
+					teardown === null || teardown === void 0 || teardown();
+					teardown = void 0;
+				}
+			};
+		};
+		const getSnapshot = () => state;
+		const getServerSnapshot = getSnapshot;
+		return function useSharedHook(...args) {
+			const id = (0, react.useRef)(Symbol("createSharedHook")).current;
+			if (creatorId === void 0) creatorId = id;
+			const isCreator = creatorId === id;
+			if (isCreator) state = hook(...args);
+			(0, react.useLayoutEffect)(() => {
+				if (isCreator) notify();
+			});
+			return (0, react.useSyncExternalStore)(isCreator ? creatorSubscribe : subscribe, getSnapshot, getServerSnapshot);
+		};
+	}
+	//#endregion
+	//#region utils/index.tsx
+	function promiseTimeout(ms, throwOnTimeout = false, reason = "Timeout") {
+		return new Promise((resolve, reject) => {
+			if (throwOnTimeout) setTimeout(reject, ms, reason);
+			else setTimeout(resolve, ms);
+		});
+	}
+	/**
+	* Create singleton promise function
+	*
+	* @example
+	* ```
+	* const promise = createSingletonPromise(async () => { ... })
+	*
+	* await promise()
+	* await promise() // all of them will be bind to a single promise instance
+	* await promise() // and be resolved together
+	* ```
+	*/
+	function createSingletonPromise(fn) {
+		let _promise;
+		function wrapper() {
+			if (!_promise) _promise = fn();
+			return _promise;
+		}
+		wrapper.reset = async () => {
+			const _prev = _promise;
+			_promise = void 0;
+			if (_prev) await _prev;
+		};
+		return wrapper;
+	}
+	function increaseWithUnit(target, delta) {
+		var _target$match;
+		if (typeof target === "number") return target + delta;
+		const value = ((_target$match = target.match(/^-?\d+\.?\d*/)) === null || _target$match === void 0 ? void 0 : _target$match[0]) || "";
+		const unit = target.slice(value.length);
+		const result = Number.parseFloat(value) + delta;
+		if (Number.isNaN(result)) return target;
+		return result + unit;
+	}
+	/**
+	* Get a px value for SSR use, do not rely on this method outside of SSR as REM
+	* unit is assumed at 16px, which might not be the case on the client
+	*
+	* @example pxValue('37rem') // 592
+	* @example pxValue('500px') // 500
+	*/
+	function pxValue(px) {
+		return px.endsWith("rem") ? Number.parseFloat(px) * 16 : Number.parseFloat(px);
+	}
+	/**
+	* Create a new subset object by giving keys
+	*/
+	function objectPick(obj, keys, omitUndefined = false) {
+		return keys.reduce((n, k) => {
+			if (k in obj) {
+				if (!omitUndefined || obj[k] !== void 0) n[k] = obj[k];
+			}
+			return n;
+		}, {});
+	}
+	/**
+	* Create a new subset object by omit giving keys
+	*/
+	function objectOmit(obj, keys, omitUndefined = false) {
+		return Object.fromEntries(Object.entries(obj).filter(([key, value]) => {
+			return (!omitUndefined || value !== void 0) && !keys.includes(key);
+		}));
+	}
+	function toArray(value) {
+		return Array.isArray(value) ? value : [value];
+	}
+	const isClient$1 = typeof window !== "undefined" && typeof document !== "undefined";
+	const isDef = (val) => typeof val !== "undefined";
+	const assert = (condition, ...infos) => {
+		if (!condition) console.warn(...infos);
+	};
+	const toString$1 = Object.prototype.toString;
+	const isObject = (val) => toString$1.call(val) === "[object Object]";
+	const now = () => Date.now();
+	const timestamp = () => +Date.now();
+	const clamp = (n, min, max) => Math.min(max, Math.max(min, n));
+	const rand = (min, max) => {
+		min = Math.ceil(min);
+		max = Math.floor(max);
+		return Math.floor(Math.random() * (max - min + 1)) + min;
+	};
+	const hasOwn = (val, key) => Object.hasOwn(val, key);
+	const isIOS = /* #__PURE__ */ getIsIOS();
+	function getIsIOS() {
+		var _window, _window2, _window3;
+		return isClient$1 && !!((_window = window) === null || _window === void 0 || (_window = _window.navigator) === null || _window === void 0 ? void 0 : _window.userAgent) && (/iP(?:ad|hone|od)/.test(window.navigator.userAgent) || ((_window2 = window) === null || _window2 === void 0 || (_window2 = _window2.navigator) === null || _window2 === void 0 ? void 0 : _window2.maxTouchPoints) > 2 && /iPad|Macintosh/.test((_window3 = window) === null || _window3 === void 0 ? void 0 : _window3.navigator.userAgent));
+	}
+	function cacheStringFunction(fn) {
+		const cache = Object.create(null);
+		return ((str) => {
+			return cache[str] || (cache[str] = fn(str));
+		});
+	}
+	const hyphenateRE = /\B([A-Z])/g;
+	const hyphenate = cacheStringFunction((str) => str.replace(hyphenateRE, "-$1").toLowerCase());
+	/**
+	* Type guard for React ref objects (`RefObject` — `{ current }` holders).
+	* Callback refs are functions and cannot be read synchronously, so they are
+	* not ref-like.
+	*/
+	function isRefLike(value) {
+		return value !== null && value !== void 0 && typeof value === "object" && "current" in value;
+	}
+	function toValue(value) {
+		if (Array.isArray(value) && value.length === 2 && typeof value[1] === "function") return value[0];
+		if (value !== null && value !== void 0 && typeof value === "object" && "value" in value && !("addEventListener" in value)) return value.value;
+		if (typeof value === "function") return value();
+		if (isRefLike(value)) return value.current;
+		return value;
+	}
+	/**
+	* Write a value back through a writable `State<T>` source — a ref-like
+	* `.current`, a `[value, setter]` tuple or a `{ value, onChange }` pair.
+	* Plain values and getters have no write path and are skipped. This is the
+	* write-side counterpart of `toValue`; hooks that push values into a
+	* `State<T>` import it from here rather than re-implementing the branches.
+	*/
+	function writeState(source, value) {
+		if (source === null || source === void 0) return;
+		if (Array.isArray(source) && source.length === 2 && typeof source[1] === "function") {
+			source[1](value);
+			return;
+		}
+		if (isRefLike(source)) {
+			source.current = value;
+			return;
+		}
+		if (typeof source === "object" && !Array.isArray(source) && "value" in source && !("addEventListener" in source)) {
+			var _onChange;
+			(_onChange = source.onChange) === null || _onChange === void 0 || _onChange.call(source, value);
+		}
+	}
+	//#endregion
+	//#region isDefined/index.tsx
+	function isDefined(v) {
+		return (isRefLike(v) ? v.current : v) != null;
+	}
+	//#endregion
+	//#region makeDestructurable/index.tsx
+	/**
+	* Make isomorphic destructurable for object and array at the same time —
+	* React port of VueUse's `makeDestructurable` (a pure utility function, so it
+	* maps 1:1 with no React adaptation). See this blog for the underlying idea:
+	* https://antfu.me/posts/destructuring-with-object-or-array/
+	*
+	* Map from @vueuse/shared `makeDestructurable`
+	* Upstream semantics are kept verbatim: given `(obj, arr)` the returned value
+	* can be destructured as an object (`const { foo, bar } = obj`) or as an array
+	* (`const [foo, bar] = obj`) — the array mode is backed by a non-enumerable
+	* `Symbol.iterator` defined on a shallow clone of `obj` (spread
+	* `{ ...obj }`); `Object.assign` appears only in the no-Symbol SSR fallback.
+	*
+	* @example
+	* const foo = { name: 'foo' }
+	* const bar = 1024
+	* const obj = makeDestructurable({ foo, bar } as const, [foo, bar] as const)
+	* const { foo: f1, bar: b1 } = obj // object destructuring
+	* const [f2, b2] = obj // array destructuring
+	*/
+	/* @__NO_SIDE_EFFECTS__ */
+	function makeDestructurable(obj, arr) {
+		if (typeof Symbol !== "undefined") {
+			const clone = { ...obj };
+			Object.defineProperty(clone, Symbol.iterator, {
+				enumerable: false,
+				value() {
+					let index = 0;
+					return { next: () => ({
+						value: arr[index++],
+						done: index > arr.length
+					}) };
+				}
+			});
+			return clone;
+		} else return Object.assign([...arr], obj);
+	}
+	//#endregion
+	//#region syncState/index.tsx
+	const neverObserved$1 = Symbol("reause.syncState.neverObserved");
+	function classifyWritable(source) {
+		if (source === null || source === void 0) return "readonly";
+		if (isRefLike(source)) return "sync";
+		if (Array.isArray(source) && source.length === 2 && typeof source[1] === "function") return "async";
+		if (typeof source === "object" && !Array.isArray(source) && "value" in source && !("addEventListener" in source)) return "async";
+		return "readonly";
+	}
+	/**
+	* Two-way state synchronization — keeps two writable `State<T>` sources in
+	* sync, with optional direction and value transforms.
+	*
+	* Map from @vueuse/shared `syncRef`
+	* (`source/vueuse/packages/shared/syncRef/`), renamed `syncState` for the
+	* React port: the two sides are `State<T>` sources — a `[value, setter]`
+	* tuple, a `{ value, onChange }` pair, a ref-like `{ current }`, a getter or
+	* a plain value — instead of Vue refs. Each side is read with `toValue` and
+	* written back through its writable form (tuple setter / `onChange` /
+	* `.current`); plain values and getters have no write path, so that side is
+	* treated as read-only (the sync becomes one-way for it).
+	*
+	* React Hook adaptation: upstream drives both sides through Vue's reactive
+	* `watchPausable`, pausing all watchers while writing so a side never echoes
+	* its own write back. React has no reactive system, so `syncState` is
+	* implemented as a hook (call it unconditionally at the top of a component).
+	* A `useEffect` that runs after every commit compares each side's resolved
+	* value with the last observed one via `Object.is` and mirrors the changed
+	* side into the other — through the optional `transform` convertors when
+	* given — recording the value it just wrote as already observed on the
+	* receiving side (the React analogue of upstream's pause/resume). Ref-like
+	* `.current` writes are synchronous and need no absorption; writes through a
+	* setter / `onChange` are asynchronous, so until the target's value reflects
+	* the write the stale pre-write value is absorbed and never mistaken for an
+	* external change. Read-only sides (plain values / getters) are never marked
+	* as written, so a changing source keeps propagating. The initial sync
+	* (upstream default `immediate: true`) runs in the mount effect and cascades
+	* ltr before rtl,
+	* matching upstream's watcher creation order. Because the observation happens
+	* post-commit, an external mutation is only adopted on the render that
+	* follows it — the mutation itself never schedules a render, so a bare
+	* `.current` write outside of React is not observed (see the maintainer
+	* notes on reause #40 / #41). The returned `stop` function tears the
+	* synchronization down; the effect also stops doing any work once the owning
+	* component unmounts.
+	*
+	* @example
+	* const [a, setA] = useState('a')
+	* const [b, setB] = useState('b')
+	*
+	* const stop = syncState([a, setA], [b, setB])
+	*
+	* console.log(a) // a
+	*
+	* setB('foo') // then the component re-renders
+	* console.log(a) // foo
+	*
+	* setA('bar') // then the component re-renders
+	* console.log(b) // bar
+	*
+	* stop()
+	*/
+	function syncState(left, right, options = {}) {
+		var _transform$ltr, _transform$rtl;
+		const { immediate = true, direction = "both", transform = {} } = options;
+		const leftRef = (0, react.useRef)(left);
+		leftRef.current = left;
+		const rightRef = (0, react.useRef)(right);
+		rightRef.current = right;
+		const transformLTR = (_transform$ltr = transform.ltr) !== null && _transform$ltr !== void 0 ? _transform$ltr : ((v) => v);
+		const transformRTL = (_transform$rtl = transform.rtl) !== null && _transform$rtl !== void 0 ? _transform$rtl : ((v) => v);
+		const lastLeftRef = (0, react.useRef)(neverObserved$1);
+		const lastRightRef = (0, react.useRef)(neverObserved$1);
+		const pendingLeftRef = (0, react.useRef)(null);
+		const pendingRightRef = (0, react.useRef)(null);
+		const stoppedRef = (0, react.useRef)(false);
+		(0, react.useEffect)(() => {
+			if (stoppedRef.current) return;
+			const leftState = leftRef.current;
+			const rightState = rightRef.current;
+			const l = toValue(leftState);
+			const r = toValue(rightState);
+			const ltrActive = direction === "both" || direction === "ltr";
+			const rtlActive = direction === "both" || direction === "rtl";
+			if (lastLeftRef.current === neverObserved$1 && lastRightRef.current === neverObserved$1) {
+				let lastLeft = l;
+				let lastRight = r;
+				if (immediate) {
+					if (ltrActive) {
+						const newRight = transformLTR(l);
+						if (!Object.is(r, newRight)) {
+							const rightKind = classifyWritable(rightState);
+							if (rightKind !== "readonly") {
+								writeState(rightState, newRight);
+								lastRight = newRight;
+								if (rightKind === "async") pendingRightRef.current = {
+									before: r,
+									after: newRight
+								};
+							}
+						}
+						if (rtlActive) {
+							const newLeft = transformRTL(newRight);
+							if (!Object.is(l, newLeft)) {
+								const leftKind = classifyWritable(leftState);
+								if (leftKind !== "readonly") {
+									writeState(leftState, newLeft);
+									lastLeft = newLeft;
+									if (leftKind === "async") pendingLeftRef.current = {
+										before: l,
+										after: newLeft
+									};
+								}
+							}
+						}
+					} else {
+						const newLeft = transformRTL(r);
+						if (!Object.is(l, newLeft)) {
+							const leftKind = classifyWritable(leftState);
+							if (leftKind !== "readonly") {
+								writeState(leftState, newLeft);
+								lastLeft = newLeft;
+								if (leftKind === "async") pendingLeftRef.current = {
+									before: l,
+									after: newLeft
+								};
+							}
+						}
+					}
+				}
+				lastLeftRef.current = lastLeft;
+				lastRightRef.current = lastRight;
+				return;
+			}
+			const leftPending = pendingLeftRef.current;
+			const rightPending = pendingRightRef.current;
+			const leftChanged = !Object.is(lastLeftRef.current, l) && !(leftPending && Object.is(leftPending.before, l));
+			const rightChanged = !Object.is(lastRightRef.current, r) && !(rightPending && Object.is(rightPending.before, r));
+			if (leftPending && !Object.is(leftPending.before, l)) pendingLeftRef.current = null;
+			if (rightPending && !Object.is(rightPending.before, r)) pendingRightRef.current = null;
+			if (ltrActive && leftChanged) {
+				lastLeftRef.current = l;
+				const converted = transformLTR(l);
+				if (!Object.is(r, converted)) {
+					const rightKind = classifyWritable(rightState);
+					if (rightKind !== "readonly") {
+						writeState(rightState, converted);
+						lastRightRef.current = converted;
+						if (rightKind === "async") pendingRightRef.current = {
+							before: r,
+							after: converted
+						};
+					}
+				}
+			}
+			if (rtlActive && rightChanged) {
+				lastRightRef.current = r;
+				const converted = transformRTL(r);
+				if (!Object.is(l, converted)) {
+					const leftKind = classifyWritable(leftState);
+					if (leftKind !== "readonly") {
+						writeState(leftState, converted);
+						lastLeftRef.current = converted;
+						if (leftKind === "async") pendingLeftRef.current = {
+							before: l,
+							after: converted
+						};
+					}
+				}
+			}
+		});
+		return () => {
+			stoppedRef.current = true;
+		};
+	}
+	//#endregion
+	//#region syncStates/index.tsx
+	const neverObserved = Symbol("reause.syncStates.neverObserved");
+	/**
+	* Keep target state(s) in sync with a source value — React port of VueUse's
+	* `syncRefs`.
+	*
+	* Map from @vueuse/shared `syncRefs`
+	* (`source/vueuse/packages/shared/syncRefs/`), renamed `syncStates` for the
+	* React port: the source is a `State<T>` — a plain value, getter, ref-like,
+	* `[value, setter]` tuple or `{ value, onChange }` pair (upstream:
+	* `WatchSource`) — resolved with `toValue`; the targets are writable
+	* `State<T>` sources written back through their writable form (tuple setter /
+	* `onChange` / `.current`); upstream's `flush` / `deep` / `immediate` options
+	* are kept for signature compatibility.
+	*
+	* React Hook adaptation: upstream syncs through Vue's reactive `watch`, and
+	* React has no reactive system — so `syncStates` is implemented as a hook
+	* (call it unconditionally at the top of a component). Internally a
+	* `useEffect` that runs after every commit compares the resolved source value
+	* with the last observed one via `Object.is`; a change is written through to
+	* all targets. Because the observation happens post-commit, the caller must
+	* re-render (e.g. `setState`) for a new source value to reach the targets —
+	* a bare mutation outside of React is never observed (see the maintainer
+	* notes on reause #40 / #41). The returned `stop` function tears the
+	* synchronization down; the effect also stops doing any work once the owning
+	* component unmounts.
+	*
+	* @example
+	* function Form() {
+	*   const [source, setSource] = useState('hello')
+	*   const [target, setTarget] = useState('target')
+	*
+	*   const stop = syncStates(source, [target, setTarget])
+	*
+	*   // during the first render `target` is still 'target' — the sync effect
+	*   // runs after the commit, so the source reaches the target only once the
+	*   // component has mounted (target === 'hello' afterwards).
+	*   // Calling `setSource('foo')` re-renders and the effect then copies 'foo'
+	*   // into the target state on the following commit.
+	*
+	*   stop()
+	* }
+	*/
+	function syncStates(source, targets, options = {}) {
+		const { immediate = true } = options;
+		const sourceRef = (0, react.useRef)(source);
+		sourceRef.current = source;
+		const isTupleTarget = Array.isArray(targets) && targets.length === 2 && typeof targets[1] === "function";
+		const targetsArray = Array.isArray(targets) && !isTupleTarget ? targets : [targets];
+		const targetsRef = (0, react.useRef)(targetsArray);
+		targetsRef.current = targetsArray;
+		const lastValueRef = (0, react.useRef)(neverObserved);
+		const stoppedRef = (0, react.useRef)(false);
+		(0, react.useEffect)(() => {
+			if (stoppedRef.current) return;
+			const value = toValue(sourceRef.current);
+			const last = lastValueRef.current;
+			lastValueRef.current = value;
+			if (last === neverObserved) {
+				if (!immediate) return;
+			} else if (Object.is(last, value)) return;
+			targetsRef.current.forEach((target) => {
+				if (!Object.is(toValue(target), value)) writeState(target, value);
+			});
+		});
+		return (0, react.useCallback)(() => {
+			stoppedRef.current = true;
+		}, []);
+	}
+	//#endregion
+	//#region until/index.tsx
+	/**
+	* Polling interval (ms) used to resolve `until` promises. React has no
+	* reactive watch, so the port re-reads the source at this fixed interval —
+	* the same polling approach `useFetch` uses for its `refetch` watch.
+	*/
+	const UNTIL_POLL_INTERVAL = 50;
+	/**
+	* Minimal structural equality — `Object.is` for primitives (so `NaN` equals
+	* `NaN`), arrays compared by length and element, plain objects by own-key
+	* count and value. Used by `changedTimes` when `deep: true`.
+	*/
+	function deepEquals(a, b) {
+		if (Object.is(a, b)) return true;
+		if (typeof a !== "object" || typeof b !== "object" || a === null || b === null) return false;
+		const aIsArray = Array.isArray(a);
+		const bIsArray = Array.isArray(b);
+		if (aIsArray !== bIsArray) return false;
+		if (aIsArray && bIsArray) {
+			const arrA = a;
+			const arrB = b;
+			if (arrA.length !== arrB.length) return false;
+			return arrA.every((item, index) => deepEquals(item, arrB[index]));
+		}
+		const keysA = Object.keys(a);
+		const keysB = Object.keys(b);
+		if (keysA.length !== keysB.length) return false;
+		return keysA.every((key) => deepEquals(a[key], b[key]));
+	}
+	/**
+	* Clone used to snapshot the source between polls when `changedTimes` runs
+	* with `deep: true` — the poller re-reads the same reference, so a reference
+	* copy could never see an in-place mutation.
+	*/
+	function cloneDeep(value) {
+		if (value === null || typeof value !== "object") return value;
+		if (Array.isArray(value)) return value.map((item) => cloneDeep(item));
+		const result = {};
+		for (const key of Object.keys(value)) result[key] = cloneDeep(value[key]);
+		return result;
+	}
+	/**
+	* Resolve the accepted `until` source — a plain value or a zero-argument
+	* getter (the React-idiomatic live source; a `Ref` / `{ current }` object is
+	* not accepted — pass `() => ref.current`).
+	*
+	* NOTE: a source value that *is* a function is treated as a getter and
+	* invoked (the same ambiguity `toValue` has).
+	*/
+	function resolveSource(source) {
+		return typeof source === "function" ? source() : source;
+	}
+	function createUntil(r, isNot = false) {
+		function toMatch(condition, { timeout, throwOnTimeout } = {}) {
+			let stop = null;
+			const promises = [new Promise((resolve) => {
+				let settled = false;
+				const check = () => {
+					if (settled) return;
+					const value = resolveSource(r);
+					if (condition(value) !== isNot) {
+						settled = true;
+						stop === null || stop === void 0 || stop();
+						resolve(value);
+					}
+				};
+				check();
+				if (!settled) {
+					const timer = setInterval(check, UNTIL_POLL_INTERVAL);
+					stop = () => clearInterval(timer);
+				}
+			})];
+			if (timeout != null) promises.push(promiseTimeout(timeout, throwOnTimeout).then(() => resolveSource(r)).finally(() => stop === null || stop === void 0 ? void 0 : stop()));
+			return Promise.race(promises);
+		}
+		function toBe(value, options) {
+			return toMatch((v) => v === value, options);
+		}
+		function toBeTruthy(options) {
+			return toMatch((v) => Boolean(v), options);
+		}
+		function toBeNull(options) {
+			return toBe(null, options);
+		}
+		function toBeUndefined(options) {
+			return toBe(void 0, options);
+		}
+		function toBeNaN(options) {
+			return toMatch(Number.isNaN, options);
+		}
+		function toContains(value, options) {
+			return toMatch((v) => {
+				return Array.from(v).includes(value);
+			}, options);
+		}
+		function changed(options) {
+			return changedTimes(1, options);
+		}
+		function changedTimes(n = 1, options) {
+			var _options$deep;
+			let count = 0;
+			let hasBaseline = false;
+			let lastValue;
+			const deep = (_options$deep = options === null || options === void 0 ? void 0 : options.deep) !== null && _options$deep !== void 0 ? _options$deep : false;
+			const snapshot = (value) => deep ? cloneDeep(value) : value;
+			return toMatch((v) => {
+				if (!hasBaseline) {
+					hasBaseline = true;
+					lastValue = snapshot(v);
+					return count >= n;
+				}
+				if (deep ? !deepEquals(lastValue, v) : !Object.is(lastValue, v)) {
+					count += 1;
+					lastValue = snapshot(v);
+				}
+				return count >= n;
+			}, options);
+		}
+		if (Array.isArray(resolveSource(r))) return {
+			toMatch,
+			toContains,
+			changed,
+			changedTimes,
+			get not() {
+				return createUntil(r, !isNot);
+			}
+		};
+		else return {
+			toMatch,
+			toBe,
+			toBeTruthy,
+			toBeNull,
+			toBeNaN,
+			toBeUndefined,
+			changed,
+			changedTimes,
+			get not() {
+				return createUntil(r, !isNot);
+			}
+		};
+	}
+	function until(r) {
+		return createUntil(r);
+	}
+	//#endregion
+	//#region useArrayDifference/index.tsx
+	function defaultComparator(value, othVal) {
+		return value === othVal;
+	}
+	/**
+	* React port of VueUse's `useArrayDifference`.
+	*
+	* Map from @vueuse/shared `useArrayDifference`
+	* Mapping: upstream wraps the diff passes in `computed(...)` and returns a
+	* `ComputedRef`; React has no reactive value tracking, so this is a plain
+	* function recomputed on every render over the plain `list` / `values` arrays
+	* the caller passes — pass state arrays and the difference is re-diffed on the
+	* next render, no `.value` on the result. The same three call shapes as
+	* upstream are supported: plain diff, diff by `key`, and diff by `compareFn`,
+	* plus the `{ symmetric }` option.
+	*
+	* @see https://vueuse.org/shared/useArrayDifference/
+	*
+	* @example
+	* const list = [{ id: 1 }, { id: 2 }, { id: 3 }]
+	* useArrayDifference(list, [{ id: 3 }]) // [{ id: 1 }, { id: 2 }]
+	* useArrayDifference(list, [{ id: 3 }], 'id') // diff by key
+	* useArrayDifference(list, [{ id: 3 }], (a, b) => a.id === b.id, { symmetric: true })
+	*/
+	function useArrayDifference(...args) {
+		var _args$, _args$2;
+		const list = args[0];
+		const values = args[1];
+		let compareFn = (_args$ = args[2]) !== null && _args$ !== void 0 ? _args$ : defaultComparator;
+		const { symmetric = false } = (_args$2 = args[3]) !== null && _args$2 !== void 0 ? _args$2 : {};
+		if (typeof compareFn === "string") {
+			const key = compareFn;
+			compareFn = (value, othVal) => value[key] === othVal[key];
+		}
+		const diff1 = list.filter((x) => values.findIndex((y) => compareFn(x, y)) === -1);
+		if (symmetric) {
+			const diff2 = values.filter((x) => list.findIndex((y) => compareFn(x, y)) === -1);
+			return [...diff1, ...diff2];
+		} else return diff1;
+	}
+	//#endregion
+	//#region useArrayEvery/index.tsx
+	/**
+	* React port of VueUse's `useArrayEvery`.
+	*
+	* Map from @vueuse/shared `useArrayEvery`
+	* Mapping: upstream wraps `toValue(list).every(...)` in `computed(() => ...)`
+	* and returns a `ComputedRef`; React has no reactive value tracking, so this
+	* is a plain function recomputed on every render over the plain `list` array
+	* the caller passes. Hold the array in `useState` (or any render-scoped value)
+	* and pass a new array to observe a change — the result recomputes on the next
+	* render. The predicate may return any value (coerced by truthiness, like
+	* `Array.prototype.every`).
+	*
+	* @see https://vueuse.org/shared/useArrayEvery/
+	*
+	* @example
+	* const [list, setList] = useState([0, 2, 4])
+	* useArrayEvery(list, val => val % 2 === 0) // true
+	* setList([0, 2, 5]) // false on the next render
+	*
+	* @param list - the array was called upon.
+	* @param fn - a function to test each element.
+	*
+	* @returns **true** if the `fn` function returns a **truthy** value for every element from the array. Otherwise, **false**.
+	*/
+	function useArrayEvery(list, fn) {
+		return list.every(fn);
+	}
+	//#endregion
+	//#region useArrayFilter/index.tsx
+	function useArrayFilter(list, fn) {
+		return list.filter(fn);
+	}
+	//#endregion
+	//#region useArrayFind/index.tsx
+	/**
+	* React port of VueUse's `useArrayFind`.
+	*
+	* Map from @vueuse/shared `useArrayFind`
+	* Mapping: upstream wraps `toValue(list).find(...)` in `computed(() => ...)`
+	* and returns a `ComputedRef`; React has no reactive value tracking, so this
+	* is a plain function recomputed on every render over the plain `list` array
+	* the caller passes. Hold the array in `useState` and pass a new array to
+	* observe a change — the first match is returned on the next render.
+	*
+	* @see https://vueuse.org/shared/useArrayFind/
+	*
+	* @example
+	* const [list, setList] = useState([1, -1, 2])
+	* useArrayFind(list, val => val > 0) // 1
+	* setList([3, -1, 2]) // 3 on the next render
+	*/
+	function useArrayFind(list, fn) {
+		return list.find(fn);
+	}
+	//#endregion
+	//#region useArrayFindIndex/index.tsx
+	/**
+	* React port of VueUse's `useArrayFindIndex`.
+	*
+	* Map from @vueuse/shared `useArrayFindIndex`
+	* Mapping: upstream wraps `toValue(list).findIndex(...)` in `computed(...)`
+	* and accepts a `RefOrValue`; React has no reactive value tracking, so
+	* this is a plain function that recomputes the index on every render — pass
+	* a state array (upstream: reactive array) and re-render with new state to
+	* see the updated result. The return is a plain number, no `.value`.
+	*
+	* @example
+	* const [list, setList] = useState([0, 2, 4, 6, 8])
+	* useArrayFindIndex(list, i => i % 2 === 0) // 0
+	*
+	* setList([1, 3, 5, 7, 9]) // result === -1 on the next render
+	*
+	* @param list - the array was called upon.
+	* @param fn - a function to test each element.
+	*
+	* @returns the index of the first element in the array that passes the test. Otherwise, "-1".
+	*/
+	function useArrayFindIndex(list, fn) {
+		return list.findIndex(fn);
+	}
+	//#endregion
+	//#region useArrayFindLast/index.tsx
+	/**
+	* Loop equivalent of `Array.prototype.findLast` — upstream ships the same
+	* fallback for runtimes without the native method (e.g. node < 18); the repo
+	* targets lib ES2022, where the native method is not available.
+	*/
+	function findLast(array, fn) {
+		for (let index = array.length - 1; index >= 0; index--) if (fn(array[index], index, array)) return array[index];
+	}
+	/**
+	* React port of VueUse's `useArrayFindLast`.
+	*
+	* Map from @vueuse/shared `useArrayFindLast`
+	* Mapping: upstream wraps native `Array.prototype.findLast` (with a loop
+	* fallback for runtimes without it) in `computed(() => ...)` and returns a
+	* `ComputedRef`; React has no reactive value tracking, so this is a plain
+	* function recomputed on every render over the plain `list` array the caller
+	* passes — the loop helper stands in for the native method since the repo
+	* targets lib ES2022. Hold the array in `useState` and pass a new array to
+	* observe a change — the last match is returned on the next render.
+	*
+	* @see https://vueuse.org/shared/useArrayFindLast/
+	*
+	* @example
+	* const [list, setList] = useState([1, -1, 2])
+	* useArrayFindLast(list, val => val > 0) // 2
+	* setList([1, -1, -2]) // 1 on the next render
+	*/
+	function useArrayFindLast(list, fn) {
+		return findLast(list, fn);
+	}
+	//#endregion
+	//#region useArrayIncludes/index.tsx
+	const toString = Object.prototype.toString;
+	function isObject$1(val) {
+		return toString.call(val) === "[object Object]";
+	}
+	function containsProp(obj, ...props) {
+		return props.some((k) => k in obj);
+	}
+	function isArrayIncludesOptions(obj) {
+		return isObject$1(obj) && containsProp(obj, "formIndex", "comparator");
+	}
+	function useArrayIncludes(...args) {
+		var _comparator;
+		const list = args[0];
+		const value = args[1];
+		let comparator = args[2];
+		let formIndex = 0;
+		if (isArrayIncludesOptions(comparator)) {
+			var _comparator$fromIndex;
+			formIndex = (_comparator$fromIndex = comparator.fromIndex) !== null && _comparator$fromIndex !== void 0 ? _comparator$fromIndex : 0;
+			comparator = comparator.comparator;
+		}
+		if (typeof comparator === "string") {
+			const key = comparator;
+			comparator = (element, value) => element[key] === value;
+		}
+		comparator = (_comparator = comparator) !== null && _comparator !== void 0 ? _comparator : ((element, value) => element === value);
+		return list.slice(formIndex).some((element, index, arr) => comparator(element, value, index, arr));
+	}
+	//#endregion
+	//#region useArrayJoin/index.tsx
+	/**
+	* React port of VueUse's `useArrayJoin`.
+	*
+	* Map from @vueuse/shared `useArrayJoin`
+	* Mapping: upstream wraps `toValue(list).map(i => toValue(i)).join(toValue(separator))`
+	* in `computed(...)` and accepts a `RefOrValue`; React has no reactive
+	* value tracking, so this is a plain function that recomputes the join on
+	* every render — pass a state array (upstream: reactive array) and re-render
+	* with new state to see the updated result. The return is a plain string,
+	* no `.value`.
+	*
+	* `list` holds plain values only: the elements are joined with
+	* `Array.prototype.join`, so no per-element unwrap happens (upstream
+	* `toValue`s each element). A function element would be stringified to its
+	* source instead of invoked.
+	*
+	* @example
+	* const [list, setList] = useState(['foo', 0, { prop: 'val' }])
+	* useArrayJoin(list) // 'foo,0,[object Object]'
+	* useArrayJoin(list, '--') // 'foo--0--[object Object]'
+	*
+	* setList([...list, 'bar']) // result === 'foo--0--[object Object]--bar' on the next render
+	*
+	* @param list - the array was called upon.
+	* @param separator - a string to separate each pair of adjacent elements of the array. If omitted, the array elements are separated with a comma (",").
+	*
+	* @returns a string with all array elements joined. If `list.length` is 0, the empty string is returned.
+	*/
+	function useArrayJoin(list, separator) {
+		return list.join(separator);
+	}
+	//#endregion
+	//#region useArrayMap/index.tsx
+	/**
+	* Reactive `Array.map`
+	*
+	* Map from @vueuse/shared `useArrayMap`
+	* React port of VueUse's `useArrayMap`.
+	*
+	* Mapping: Vue's `computed` → recompute per render and return a plain array
+	* (no `.value`) over the plain `list` array the caller passes.
+	* Pass a `useState` array directly — the result updates on the next render.
+	*
+	* @example
+	* const [list, setList] = useState([0, 1, 2, 3, 4])
+	* const result = useArrayMap(list, i => i * 2) // [0, 2, 4, 6, 8]
+	* setList(list.slice(0, -1)) // result: [0, 2, 4, 6] on the next render
+	*/
+	function useArrayMap(list, fn) {
+		return list.map(fn);
+	}
+	//#endregion
+	//#region useArrayReduce/index.tsx
+	function useArrayReduce(list, reducer, ...args) {
+		const reduceCallback = (sum, value, index) => reducer(sum, value, index);
+		const initial = typeof args[0] === "function" ? args[0]() : args[0];
+		return args.length ? list.reduce(reduceCallback, initial) : list.reduce(reduceCallback);
+	}
+	//#endregion
+	//#region useArraySome/index.tsx
+	/**
+	* React port of VueUse's `useArraySome`.
+	*
+	* Map from @vueuse/shared `useArraySome`
+	* Mapping: `computed(() => ...)` → recompute on every render — the result is a
+	* plain `boolean` (no `.value`, no caching) computed from the plain `list`
+	* array the caller passes. Hold the array in `useState` and pass a new array
+	* to observe a change; the result recomputes on the next render.
+	*
+	* @see https://vueuse.org/shared/useArraySome/
+	* @param list - the array was called upon.
+	* @param fn - a function to test each element.
+	*
+	* @returns **true** if the `fn` function returns a **truthy** value for any element from the array. Otherwise, **false**.
+	*
+	* @example
+	* const [list, setList] = useState([0, 2, 4, 6, 8])
+	* const result = useArraySome(list, i => i > 10) // false
+	* setList([...list, 11]) // result === true on the next render
+	*/
+	function useArraySome(list, fn) {
+		return list.some(fn);
+	}
+	//#endregion
+	//#region useArrayUnique/index.tsx
+	/**
+	* Reactive `Array.unique`
+	*
+	* Map from @vueuse/shared `useArrayUnique`
+	* React port of VueUse's `useArrayUnique`.
+	*
+	* Mapping: upstream wraps `toValue(list)` in `computed(() => ...)` and returns
+	* a `ComputedRef`; React has no reactive value tracking, so this is a plain
+	* function recomputed on every render over the plain `list` array the caller
+	* passes — the result is a deduped plain array (no `.value`, no caching).
+	* Duplicate detection uses a `Set` of the values (reference identity for
+	* objects) unless a custom `compareFn` is given — same as upstream. Hold the
+	* array in `useState` and pass a new array to observe a change.
+	*
+	* @see https://vueuse.org/shared/useArrayUnique/
+	*
+	* @example
+	* const [list, setList] = useState([0, 2, 2, 4, 4, 4])
+	* const result = useArrayUnique(list) // [0, 2, 4]
+	*
+	* setList([0, 2, 4, 6, 6]) // result === [0, 2, 4, 6] on the next render
+	*/
+	function useArrayUnique(list, compareFn) {
+		return compareFn ? uniqueElementsBy(list, compareFn) : uniq(list);
+	}
+	function uniq(array) {
+		return Array.from(new Set(array));
+	}
+	function uniqueElementsBy(array, fn) {
+		return array.reduce((acc, v) => {
+			if (!acc.some((x) => fn(v, x, array))) acc.push(v);
+			return acc;
+		}, []);
+	}
+	//#endregion
+	//#region useControllableState/index.tsx
+	function isTuple(state) {
+		return Array.isArray(state) && state.length === 2 && typeof state[1] === "function";
+	}
+	function isObjectState$1(state) {
+		return typeof state === "object" && state !== null && !Array.isArray(state) && "value" in state;
+	}
+	/**
+	* Combine controlled and uncontrolled state sources.
+	*
+	* `state` is resolved with `toValue` on every render. A tuple
+	* `[value, setter]` or a `{ value, onChange }` pair is always controlled: the
+	* current value is the resolved source and `setValue` writes through to the
+	* tuple setter / `onChange`. With `passive: true` a plain value, getter, or
+	* ref source is uncontrolled — the hook initializes from the source and local
+	* updates persist, and external source changes are synced back (honoring
+	* `shouldUpdate`). With the default `passive: false` such a source is
+	* controlled (the external value wins on every render); `setValue` then has
+	* no channel back to the caller, so it warns instead of silently discarding
+	* the update — pass a tuple, a `{ value, onChange }` pair, or use
+	* `passive: true` to write. `defaultValue` (value or lazy initializer) seeds
+	* the internal state of uncontrolled sources; `shouldUpdate(prev, next)`
+	* guards every commit, including the passive sync.
+	*/
+	function useControllableState(state, options = {}) {
+		const { defaultValue, shouldUpdate = (prev, next) => !Object.is(prev, next), passive = false } = options;
+		const controlled = isTuple(state) || isObjectState$1(state) || !passive;
+		const externalValue = toValue(state);
+		const initial = defaultValue === void 0 ? externalValue : typeof defaultValue === "function" ? defaultValue() : defaultValue;
+		const [internal, setInternal] = (0, react.useState)(initial);
+		const value = controlled ? externalValue : internal;
+		const valueRef = (0, react.useRef)(value);
+		const previousExternalRef = (0, react.useRef)(externalValue);
+		valueRef.current = value;
+		const stateRef = (0, react.useRef)(state);
+		stateRef.current = state;
+		(0, react.useEffect)(() => {
+			const canSync = typeof state === "function" || isRefLike(state) || externalValue === null || typeof externalValue !== "object";
+			if (passive && canSync && !isTuple(state) && !isObjectState$1(state) && !Object.is(previousExternalRef.current, externalValue) && shouldUpdate(valueRef.current, externalValue)) setInternal(externalValue);
+			previousExternalRef.current = externalValue;
+		}, [
+			externalValue,
+			passive,
+			shouldUpdate
+		]);
+		return [value, (0, react.useCallback)((action) => {
+			var _currentState$onChang;
+			const prev = valueRef.current;
+			const next = typeof action === "function" ? action(prev) : action;
+			if (!shouldUpdate(prev, next)) return;
+			const currentState = stateRef.current;
+			if (isTuple(currentState)) currentState[1](next);
+			else if (isObjectState$1(currentState)) (_currentState$onChang = currentState.onChange) === null || _currentState$onChang === void 0 || _currentState$onChang.call(currentState, next);
+			else if (!controlled) setInternal(next);
+			else assert(false, "useControllableState: `setValue` on a controlled source without a write channel (a plain value, getter, or ref with `passive: false`) is ignored. Pass a [value, setter] tuple, a { value, onChange } pair, or use `passive: true`.");
+		}, [controlled, shouldUpdate])];
+	}
+	//#endregion
+	//#region useCounter/index.tsx
+	/**
+	* React port of VueUse's `useCounter`.
+	*
+	* Map from @vueuse/shared `useCounter`
+	* Mapping: `ref(initialValue)` → `useState`, mutation functions become
+	* stable `useCallback`s; options are kept in refs so callbacks stay stable.
+	*
+	* @example
+	* const { count, inc, dec, set, reset } = useCounter(10, { min: 0, max: 100 })
+	*/
+	function useCounter(initialValue = 0, options = {}) {
+		const { min = Number.NEGATIVE_INFINITY, max = Number.POSITIVE_INFINITY } = options;
+		const minRef = (0, react.useRef)(min);
+		const maxRef = (0, react.useRef)(max);
+		const initialRef = (0, react.useRef)(toValue(initialValue));
+		const [count, setCount] = useControllableState(initialValue, { passive: true });
+		const set = (0, react.useCallback)((value) => {
+			setCount((current) => {
+				const next = clamp(value, minRef.current, maxRef.current);
+				return current === next ? current : next;
+			});
+		}, []);
+		const get = (0, react.useCallback)(() => count, [count]);
+		return {
+			count,
+			inc: (0, react.useCallback)((delta = 1) => {
+				setCount((current) => {
+					const next = clamp(current + delta, minRef.current, maxRef.current);
+					return current === next ? current : next;
+				});
+			}, []),
+			dec: (0, react.useCallback)((delta = 1) => {
+				setCount((current) => {
+					const next = clamp(current - delta, minRef.current, maxRef.current);
+					return current === next ? current : next;
+				});
+			}, []),
+			get,
+			set,
+			reset: (0, react.useCallback)((val) => {
+				const target = val === void 0 ? initialRef.current : val;
+				initialRef.current = target;
+				const next = clamp(target, minRef.current, maxRef.current);
+				setCount((current) => current === next ? current : next);
+				return next;
+			}, [])
+		};
+	}
+	//#endregion
+	//#region useDateFormat/index.tsx
+	const REGEX_PARSE = /^(\d{4})[-/]?(\d{1,2})?[-/]?(\d{0,2})[T\s]*(\d{1,2})?:?(\d{1,2})?:?(\d{1,2})?[.:]?(\d+)?$/i;
+	const REGEX_FORMAT = /[YMDHhms]o|\[([^\]]+)\]|Y{1,4}|M{1,4}|D{1,2}|d{1,4}|H{1,2}|h{1,2}|a{1,2}|A{1,2}|m{1,2}|s{1,2}|Z{1,2}|z{1,4}|SSS/g;
+	function defaultMeridiem(hours, minutes, isLowercase, hasPeriod) {
+		let m = hours < 12 ? "AM" : "PM";
+		if (hasPeriod) m = m.split("").reduce((acc, curr) => acc += `${curr}.`, "");
+		return isLowercase ? m.toLowerCase() : m;
+	}
+	function formatOrdinal(num) {
+		const suffixes = [
+			"th",
+			"st",
+			"nd",
+			"rd"
+		];
+		const v = num % 100;
+		return num + (suffixes[(v - 20) % 10] || suffixes[v] || suffixes[0]);
+	}
+	/**
+	* Unwrap the house input convention — a plain value, a ref-like `{ current }`
+	* or a getter function (house replacement for Vue's `toValue` /
+	* `RefOrValue<T>`).
+	*/
+	function formatDate(date, formatStr, options = {}) {
+		var _options$customMeridi;
+		const years = date.getFullYear();
+		const month = date.getMonth();
+		const days = date.getDate();
+		const hours = date.getHours();
+		const minutes = date.getMinutes();
+		const seconds = date.getSeconds();
+		const milliseconds = date.getMilliseconds();
+		const day = date.getDay();
+		const meridiem = (_options$customMeridi = options.customMeridiem) !== null && _options$customMeridi !== void 0 ? _options$customMeridi : defaultMeridiem;
+		const stripTimeZone = (dateString) => {
+			var _dateString$split$;
+			return (_dateString$split$ = dateString.split(" ")[1]) !== null && _dateString$split$ !== void 0 ? _dateString$split$ : "";
+		};
+		const matches = {
+			Yo: () => formatOrdinal(years),
+			YY: () => String(years).slice(-2),
+			YYYY: () => years,
+			M: () => month + 1,
+			Mo: () => formatOrdinal(month + 1),
+			MM: () => `${month + 1}`.padStart(2, "0"),
+			MMM: () => date.toLocaleDateString(options.locales, { month: "short" }),
+			MMMM: () => date.toLocaleDateString(options.locales, { month: "long" }),
+			D: () => String(days),
+			Do: () => formatOrdinal(days),
+			DD: () => `${days}`.padStart(2, "0"),
+			H: () => String(hours),
+			Ho: () => formatOrdinal(hours),
+			HH: () => `${hours}`.padStart(2, "0"),
+			h: () => `${hours % 12 || 12}`.padStart(1, "0"),
+			ho: () => formatOrdinal(hours % 12 || 12),
+			hh: () => `${hours % 12 || 12}`.padStart(2, "0"),
+			m: () => String(minutes),
+			mo: () => formatOrdinal(minutes),
+			mm: () => `${minutes}`.padStart(2, "0"),
+			s: () => String(seconds),
+			so: () => formatOrdinal(seconds),
+			ss: () => `${seconds}`.padStart(2, "0"),
+			SSS: () => `${milliseconds}`.padStart(3, "0"),
+			d: () => day,
+			dd: () => date.toLocaleDateString(options.locales, { weekday: "narrow" }),
+			ddd: () => date.toLocaleDateString(options.locales, { weekday: "short" }),
+			dddd: () => date.toLocaleDateString(options.locales, { weekday: "long" }),
+			A: () => meridiem(hours, minutes),
+			AA: () => meridiem(hours, minutes, false, true),
+			a: () => meridiem(hours, minutes, true),
+			aa: () => meridiem(hours, minutes, true, true),
+			z: () => stripTimeZone(date.toLocaleDateString(options.locales, { timeZoneName: "shortOffset" })),
+			zz: () => stripTimeZone(date.toLocaleDateString(options.locales, { timeZoneName: "shortOffset" })),
+			zzz: () => stripTimeZone(date.toLocaleDateString(options.locales, { timeZoneName: "shortOffset" })),
+			zzzz: () => stripTimeZone(date.toLocaleDateString(options.locales, { timeZoneName: "longOffset" }))
+		};
+		return formatStr.replace(REGEX_FORMAT, (match, $1) => {
+			var _ref, _matches$match;
+			return (_ref = $1 !== null && $1 !== void 0 ? $1 : (_matches$match = matches[match]) === null || _matches$match === void 0 ? void 0 : _matches$match.call(matches)) !== null && _ref !== void 0 ? _ref : match;
+		});
+	}
+	function normalizeDate(date) {
+		if (date === null) return /* @__PURE__ */ new Date(NaN);
+		if (date === void 0) return /* @__PURE__ */ new Date();
+		if (date instanceof Date) return new Date(date);
+		if (typeof date === "string" && !/Z$/i.test(date)) {
+			const d = date.match(REGEX_PARSE);
+			if (d) {
+				const m = Number(d[2]) - 1 || 0;
+				const ms = Number((d[7] || "0").substring(0, 3));
+				return new Date(Number(d[1]), m, Number(d[3]) || 1, Number(d[4]) || 0, Number(d[5]) || 0, Number(d[6]) || 0, ms);
+			}
+		}
+		return new Date(date);
+	}
+	/**
+	* Get the formatted date according to the string of tokens passed in.
+	*
+	* Map from @vueuse/shared `useDateFormat`.
+	*
+	* React divergence: upstream wraps the result in a Vue `computed` and returns
+	* `ComputedRef<string>` — this port returns a PLAIN STRING. Call it during
+	* render and pass plain values (e.g. your `useState` date); the string is
+	* recomputed on every render with fresh inputs. Do not read `.value` from it.
+	*
+	* Inputs (`date`, `formatStr`, `options.locales`) are plain read-only values
+	* — pass `ref.current` or the state value; a `MaybeRefOrGetter` source must be
+	* resolved by the caller (upstream types them `MaybeRefOrGetter`).
+	*
+	* Supported tokens (mirroring upstream 1:1, default format `HH:mm:ss`):
+	* `Yo YY YYYY` — year · `M Mo MM MMM MMMM` — month (locale-aware short/long
+	* names via `Intl`) · `D Do DD` — day of month · `H Ho HH` — 24-hour clock ·
+	* `h ho hh` — 12-hour clock · `m mo mm` — minutes · `s so ss` — seconds ·
+	* `SSS` — milliseconds (3 digits) · `d dd ddd dddd` — weekday (locale-aware
+	* via `Intl`) · `A AA a aa` — meridiem, customizable via
+	* `options.customMeridiem` · `z zz zzz zzzz` — timezone offset names
+	* (`shortOffset` / `longOffset` via `toLocaleString`). Text wrapped in
+	* brackets (`[...]`) is output literally as an escape sequence.
+	*
+	* @see https://vueuse.org/useDateFormat
+	* @param date - The date to format, can either be a `Date` object, a timestamp, or a string
+	* @param formatStr - The combination of tokens to format the date
+	* @param options - UseDateFormatOptions
+	*
+	* @__NO_SIDE_EFFECTS__
+	*/
+	function useDateFormat(date, formatStr = "HH:mm:ss", options = {}) {
+		return formatDate(normalizeDate(date), formatStr, options);
+	}
+	//#endregion
+	//#region useDebounceFn/index.tsx
+	/**
+	* Debounce execution of a function — React port of VueUse's `useDebounceFn`.
+	*
+	* Map from @vueuse/shared `useDebounceFn`
+	* Mapping: upstream builds `createFilterWrapper(debounceFilter(ms, options), fn)`
+	* so every call returns a promise and the wrapper carries `cancel` / `flush` /
+	* `isPending`. This port builds the same wrapper once (`useMemo`) so its
+	* identity is stable across renders; the latest `fn` / `ms` / `options` are
+	* mirrored into refs so every call sees fresh values. `ms` accepts a number or
+	* a ref-like `{ current }` (upstream: `RefOrValue<number>`) and is re-read on
+	* every call. `isPending` becomes a non-reactive getter (React has no reactive
+	* refs); promise settlement mirrors upstream — a regular debounce resolves
+	* with the result, a superseded/canceled call settles with `undefined` (or
+	* rejects with `rejectOnCancel`), and the `maxWait` trailing edge runs the
+	* latest invocation but settles the pending promise without its result.
+	* Pending timers are cleared when the component unmounts (upstream leaves
+	* disposal to the effect scope).
+	*
+	* @example
+	* const debouncedFn = useDebounceFn(() => { ... }, 1000)
+	* debouncedFn()
+	* debouncedFn.cancel()
+	* debouncedFn.flush()
+	*/
+	function useDebounceFn(fn, ms = 200, options = {}) {
+		const fnRef = (0, react.useRef)(fn);
+		fnRef.current = fn;
+		const msRef = (0, react.useRef)(ms);
+		msRef.current = ms;
+		const optionsRef = (0, react.useRef)(options);
+		optionsRef.current = options;
+		const timerRef = (0, react.useRef)(null);
+		const maxTimerRef = (0, react.useRef)(null);
+		const pendingRef = (0, react.useRef)(false);
+		const onCancelRef = (0, react.useRef)(noop);
+		const onFlushRef = (0, react.useRef)(noop);
+		const lastInvokeRef = (0, react.useRef)(noop);
+		const debounced = (0, react.useMemo)(() => {
+			const clearTimers = () => {
+				if (timerRef.current !== null) {
+					clearTimeout(timerRef.current);
+					timerRef.current = null;
+				}
+				if (maxTimerRef.current !== null) {
+					clearTimeout(maxTimerRef.current);
+					maxTimerRef.current = null;
+				}
+			};
+			const settleCurrent = (settleRef) => {
+				const callback = settleRef.current;
+				onCancelRef.current = noop;
+				onFlushRef.current = noop;
+				pendingRef.current = false;
+				callback();
+			};
+			const handler = (invoke) => {
+				const duration = toValue(msRef.current);
+				const maxDuration = toValue(optionsRef.current.maxWait);
+				if (timerRef.current !== null) {
+					clearTimeout(timerRef.current);
+					timerRef.current = null;
+					settleCurrent(onCancelRef);
+				}
+				if (duration === void 0 || duration <= 0 || maxDuration !== void 0 && maxDuration <= 0) {
+					clearTimers();
+					pendingRef.current = false;
+					try {
+						return Promise.resolve(invoke());
+					} catch (error) {
+						return Promise.reject(error);
+					}
+				}
+				pendingRef.current = true;
+				return new Promise((resolve, reject) => {
+					onCancelRef.current = optionsRef.current.rejectOnCancel ? reject : () => resolve(void 0);
+					onFlushRef.current = () => resolve(invoke());
+					lastInvokeRef.current = invoke;
+					if (maxDuration !== void 0 && maxTimerRef.current === null) maxTimerRef.current = setTimeout(() => {
+						maxTimerRef.current = null;
+						if (timerRef.current !== null) {
+							clearTimeout(timerRef.current);
+							timerRef.current = null;
+						}
+						const invoke = lastInvokeRef.current;
+						settleCurrent(onCancelRef);
+						invoke();
+					}, maxDuration);
+					timerRef.current = setTimeout(() => {
+						timerRef.current = null;
+						if (maxTimerRef.current !== null) {
+							clearTimeout(maxTimerRef.current);
+							maxTimerRef.current = null;
+						}
+						settleCurrent(onFlushRef);
+					}, duration);
+				});
+			};
+			const cancel = () => {
+				clearTimers();
+				settleCurrent(onCancelRef);
+			};
+			const flush = () => {
+				if (!pendingRef.current) return;
+				clearTimers();
+				settleCurrent(onFlushRef);
+			};
+			const wrapped = ((...args) => {
+				return handler(() => fnRef.current(...args));
+			});
+			wrapped.cancel = cancel;
+			wrapped.flush = flush;
+			Object.defineProperty(wrapped, "isPending", {
+				enumerable: true,
+				get: () => pendingRef.current
+			});
+			return wrapped;
+		}, []);
+		(0, react.useEffect)(() => debounced.cancel, [debounced]);
+		return debounced;
+	}
+	//#endregion
+	//#region useInterval/index.tsx
+	function useInterval(interval = 1e3, options = {}) {
+		const { controls: exposeControls = false, immediate = true, callback, immediateCallback = false } = options;
+		const intervalRef = (0, react.useRef)(interval);
+		intervalRef.current = interval;
+		const callbackRef = (0, react.useRef)(callback);
+		callbackRef.current = callback;
+		const immediateCallbackRef = (0, react.useRef)(immediateCallback);
+		immediateCallbackRef.current = immediateCallback;
+		const [counter, setCounter] = (0, react.useState)(0);
+		const counterRef = (0, react.useRef)(0);
+		const [isActive, setIsActive] = (0, react.useState)(() => immediate && toValue(interval) > 0);
+		const isActiveRef = (0, react.useRef)(false);
+		const timerRef = (0, react.useRef)(null);
+		const tick = (0, react.useCallback)(() => {
+			var _callbackRef$current;
+			counterRef.current += 1;
+			setCounter(counterRef.current);
+			(_callbackRef$current = callbackRef.current) === null || _callbackRef$current === void 0 || _callbackRef$current.call(callbackRef, counterRef.current);
+		}, []);
+		const reset = (0, react.useCallback)(() => {
+			counterRef.current = 0;
+			setCounter(0);
+		}, []);
+		const pause = (0, react.useCallback)(() => {
+			isActiveRef.current = false;
+			setIsActive(false);
+			if (timerRef.current !== null) {
+				clearInterval(timerRef.current);
+				timerRef.current = null;
+			}
+		}, []);
+		const resume = (0, react.useCallback)(() => {
+			const ms = toValue(intervalRef.current);
+			if (ms <= 0) return;
+			isActiveRef.current = true;
+			setIsActive(true);
+			if (immediateCallbackRef.current) tick();
+			if (timerRef.current !== null) {
+				clearInterval(timerRef.current);
+				timerRef.current = null;
+			}
+			timerRef.current = setInterval(tick, ms);
+		}, [tick]);
+		const startedRef = (0, react.useRef)(false);
+		(0, react.useEffect)(() => {
+			if (immediate && !startedRef.current) {
+				startedRef.current = true;
+				resume();
+			}
+			return pause;
+		}, [immediate, resume]);
+		const mountedRef = (0, react.useRef)(false);
+		const intervalMs = toValue(interval);
+		(0, react.useEffect)(() => {
+			if (!mountedRef.current) {
+				mountedRef.current = true;
+				return;
+			}
+			if (isActiveRef.current) resume();
+		}, [intervalMs, resume]);
+		if (exposeControls) return {
+			counter,
+			reset,
+			isActive,
+			pause,
+			resume
+		};
+		return counter;
+	}
+	//#endregion
+	//#region useIntervalFn/index.tsx
+	/**
+	* React port of VueUse's `useIntervalFn` — wrapper for `setInterval` with
+	* controls.
+	*
+	* Map from @vueuse/shared `useIntervalFn`
+	* Mapping: upstream accepts `RefOrValue<number>` for the interval — this
+	* port accepts a plain `number`. `isActive` is a boolean state (upstream: a
+	* readonly shallow ref), also mirrored in a ref so `resume()` can check it
+	* synchronously right after `immediateCallback` fires the callback — the
+	* callback may `pause()` itself ("pause in callback"). The timer is scheduled
+	* in a mount effect (upstream starts synchronously during setup) and cleared
+	* on unmount via effect cleanup; changing the interval while active restarts
+	* the timer (upstream: a `watch` on the interval calls `resume()`). The
+	* callback, interval and options are kept in refs so every tick and restart
+	* uses the newest ones.
+	*
+	* @example
+	* const { isActive, pause, resume } = useIntervalFn(() => { ... }, 1000)
+	*/
+	function useIntervalFn(cb, interval = 1e3, options = {}) {
+		const { immediate = true, immediateCallback = false } = options;
+		const [isActive, setIsActive] = (0, react.useState)(false);
+		const isActiveRef = (0, react.useRef)(false);
+		const cbRef = (0, react.useRef)(cb);
+		const intervalRef = (0, react.useRef)(interval);
+		const immediateCallbackRef = (0, react.useRef)(immediateCallback);
+		const timerRef = (0, react.useRef)(null);
+		cbRef.current = cb;
+		intervalRef.current = interval;
+		immediateCallbackRef.current = immediateCallback;
+		const immediateRef = (0, react.useRef)(immediate);
+		function clean() {
+			if (timerRef.current) {
+				clearInterval(timerRef.current);
+				timerRef.current = null;
+			}
+		}
+		function setActive(active) {
+			isActiveRef.current = active;
+			setIsActive(active);
+		}
+		const pause = (0, react.useCallback)(() => {
+			setActive(false);
+			clean();
+		}, []);
+		const resume = (0, react.useCallback)(() => {
+			const intervalValue = intervalRef.current;
+			if (intervalValue <= 0) return;
+			setActive(true);
+			if (immediateCallbackRef.current) cbRef.current();
+			clean();
+			if (isActiveRef.current) timerRef.current = setInterval(() => cbRef.current(), intervalValue);
+		}, []);
+		(0, react.useEffect)(() => {
+			if (immediateRef.current) resume();
+			return () => {
+				clean();
+			};
+		}, [resume]);
+		const mountedRef = (0, react.useRef)(false);
+		(0, react.useEffect)(() => {
+			if (!mountedRef.current) {
+				mountedRef.current = true;
+				return;
+			}
+			if (isActiveRef.current) resume();
+		}, [interval, resume]);
+		return {
+			isActive,
+			pause,
+			resume
+		};
+	}
+	//#endregion
+	//#region useLastChanged/index.tsx
+	function useLastChanged(value, options = {}) {
+		const [lastChanged, setLastChanged] = (0, react.useState)(() => {
+			var _options$initialValue;
+			return (_options$initialValue = options.initialValue) !== null && _options$initialValue !== void 0 ? _options$initialValue : null;
+		});
+		const prevValue = (0, react.useRef)(value);
+		(0, react.useEffect)(() => {
+			if (!Object.is(prevValue.current, value)) {
+				prevValue.current = value;
+				setLastChanged(timestamp());
+			}
+		});
+		return lastChanged;
+	}
+	//#endregion
+	//#region useListener/index.tsx
+	/**
+	* React port of the `useListener` protocol — bind a callback to an event
+	* registration function returned by a reause hook, with automatic cleanup
+	* on unmount.
+	*
+	* Map from @reause/shared `useListener` (protocol: #129)
+	* Motivation: hooks like `useFileDialog` return `onChange` / `onCancel`
+	* registration functions (upstream `EventHookOn`). In Vue those auto-clean
+	* via the effect scope; in React we need a hook to own that lifecycle.
+	* `useListener` registers `cb` with `on` on mount and, when `on` returns an
+	* `off` function, calls it on unmount, so listeners are cleaned up and
+	* callbacks never fire after the component is gone. (An `on` that returns
+	* nothing provides no cleanup — nothing can be released.) The callback is
+	* kept in a ref, so changing `cb` across renders does not re-register — the
+	* latest callback is used by the already-registered listener. If `on` itself
+	* changes (a new hook instance), the effect re-runs and re-registers.
+	*
+	* @example
+	* const { files, open, onChange } = useFileDialog()
+	* useListener(onChange, (files) => { console.log(files) })
+	*/
+	function useListener(on, cb) {
+		const cbRef = (0, react.useRef)(cb);
+		cbRef.current = cb;
+		(0, react.useEffect)(() => {
+			if (typeof on !== "function") return;
+			const result = on(((...args) => cbRef.current(...args)));
+			return () => {
+				var _result$off;
+				result === null || result === void 0 || (_result$off = result.off) === null || _result$off === void 0 || _result$off.call(result);
+			};
+		}, [on]);
+	}
+	//#endregion
+	//#region useMount/index.tsx
+	/**
+	* React port of react-use's `useMount`.
+	*
+	* Map from react-use `useMount`.
+	* Runs `fn` exactly once after the component mounts.
+	*
+	* @example
+	* useMount(() => {
+	*   trackPageView()
+	* })
+	*/
+	function useMount(fn) {
+		(0, react.useEffect)(() => {
+			fn();
+		}, []);
+	}
+	//#endregion
+	//#region useStateAutoReset/index.tsx
+	/**
+	* A state which will be reset to the default value after some time.
+	*
+	* Map from @vueuse/shared `refAutoReset`
+	* (`source/vueuse/packages/shared/refAutoReset/`). Upstream returns a single
+	* writable Vue ref; per this repo's `useState*` family convention the return
+	* is the React `[value, setValue]` tuple — `value` is the state, `setValue`
+	* is a `useState`-style setter (value or updater form, `Dispatch<SetStateAction>`)
+	* that also (re)schedules a timer to restore `defaultValue` after `afterMs`
+	* milliseconds. `defaultValue` accepts the shared `State<T>` form (plain value,
+	* lazy getter, ref-like object, state tuple, or controlled `{ value, onChange }` pair).
+	* `afterMs` accepts the shared `RefOrValue<number>` form and is resolved with `toValue` at fire time
+	* (upstream: `toValue`); the pending timer is cleared on unmount (upstream:
+	* `tryOnScopeDispose`, timers in the effect scope). The deprecated `autoResetRef`
+	* alias is not ported.
+	*
+	* @param defaultValue The value which will be set.
+	* @param afterMs      A zero-or-greater delay in milliseconds.
+	* @example
+	* const [message, setMessage] = useStateAutoReset('default message', 1000)
+	*
+	* function handleMessage() {
+	*   setMessage('message has set') // resets to 'default message' after 1000ms
+	* }
+	*/
+	function useStateAutoReset(defaultValue, afterMs = 1e4) {
+		const [value, setValue] = useControllableState(defaultValue, { passive: true });
+		const defaultValueRef = (0, react.useRef)(defaultValue);
+		const afterMsRef = (0, react.useRef)(afterMs);
+		const timerRef = (0, react.useRef)(null);
+		defaultValueRef.current = defaultValue;
+		afterMsRef.current = afterMs;
+		const scheduleReset = (0, react.useCallback)(() => {
+			if (timerRef.current) clearTimeout(timerRef.current);
+			timerRef.current = setTimeout(() => {
+				timerRef.current = null;
+				setValue(toValue(defaultValueRef.current));
+			}, toValue(afterMsRef.current));
+		}, []);
+		const setValueWithReset = (0, react.useCallback)((next) => {
+			setValue(next);
+			scheduleReset();
+		}, [scheduleReset]);
+		(0, react.useEffect)(() => () => {
+			if (timerRef.current) clearTimeout(timerRef.current);
+		}, []);
+		return [value, setValueWithReset];
+	}
+	//#endregion
+	//#region useStateDebounced/index.tsx
+	/**
+	* Debounce updates of a state value — React port of VueUse's `refDebounced`.
+	*
+	* Map from @vueuse/shared `refDebounced`
+	* Mapping: upstream takes a Vue `Ref<T>` and returns a readonly ref that only
+	* flips to the latest source value once it stops changing for `ms` (a watcher
+	* hands every change to `useDebounceFn`). The naming follows this repo's
+	* `ref* → useState*` rule (`refDebounced` → `useStateDebounced`), the Vue
+	* `Ref<T>` input becomes a plain initial value, and the readonly ref becomes
+	* an extra state slot — so the hook returns the tuple
+	* `[value, setValue, debounced]`:
+	*
+	* ```ts
+	* const [input, setInput, debounced] = useStateDebounced('foo', 1000)
+	*
+	* setInput('bar')
+	* console.log(debounced) // 'foo' — flips to 'bar' once the debounce elapses
+	* ```
+	*
+	* `value` is the source state, `setValue` its setter, and `debounced` lags
+	* behind it by `ms`. Writes settle through a `useDebounceFn` updater, so a
+	* burst of writes collapses into a single trailing update carrying the last
+	* written value. `ms` (and `options.maxWait`) accept a plain number or a
+	* ref-like `{ current }` (upstream: `RefOrValue<number>`) and are re-read on
+	* every write; pending timers are cleared when the component unmounts
+	* (upstream disposes with the effect scope). Note: a write only schedules the
+	* debounce when the value actually changes — writing the same value is
+	* skipped by `useControllableState`'s `Object.is` guard, so the pending timer
+	* is not re-delayed (upstream's `watch` re-delays on every source write, even
+	* unchanged ones).
+	*
+	* @example
+	* ```ts
+	* const [value, setValue, debounced] = useStateDebounced('foo', 1000)
+	* ```
+	*/
+	function useStateDebounced(value, ms = 200, options = {}) {
+		const [state, setState] = useControllableState(value, { passive: true });
+		const [debounced, setDebounced] = (0, react.useState)(state);
+		const stateRef = (0, react.useRef)(state);
+		stateRef.current = state;
+		const updater = useDebounceFn(() => {
+			setDebounced(stateRef.current);
+		}, ms, options);
+		const isFirstRunRef = (0, react.useRef)(true);
+		(0, react.useEffect)(() => {
+			if (isFirstRunRef.current) {
+				isFirstRunRef.current = false;
+				return;
+			}
+			updater();
+		}, [state, updater]);
+		return [
+			state,
+			setState,
+			debounced
+		];
+	}
+	//#endregion
+	//#region useStateDefault/index.tsx
+	/**
+	* A state tuple (`[value, setter]`) — mirrors `toValue`'s tuple branch.
+	*/
+	function isStateTuple(source) {
+		return Array.isArray(source) && source.length === 2 && typeof source[1] === "function";
+	}
+	/**
+	* A `{ value, onChange }` source — mirrors `toValue`'s object branch (the
+	* `addEventListener` guard keeps DOM-ish objects out, like `toValue`).
+	*/
+	function isObjectState(source) {
+		return typeof source === "object" && source !== null && !Array.isArray(source) && "value" in source && !("addEventListener" in source);
+	}
+	/**
+	* A ref-like `{ current }` source.
+	*/
+	function isRefState(source) {
+		return source !== null && source !== void 0 && typeof source === "object" && "current" in source;
+	}
+	/**
+	* Apply default value to a ref-like source — React port of VueUse's
+	* `refDefault` renamed to `useStateDefault` (this repo's naming for the
+	* `ref*` family; upstream's single writable computed ref becomes a tuple).
+	*
+	* Map from @vueuse/shared `refDefault`
+	* Mapping: upstream derives a writable `computed` from a source
+	* `Ref<T | undefined | null>` — it reads `source.value ?? defaultValue` and
+	* writes back to `source.value`. This port accepts a `State<T | undefined |
+	* null>` — a plain value, a ref-like object (`{ current }`, e.g. the first
+	* tuple element of `useStorage`), a getter, a `[value, setter]` tuple or a
+	* `{ value, onChange }` pair — and returns the React tuple
+	* `const [value, setValue] = useStateDefault(raw, 'default')`. `value` is
+	* derived on every render from the source through `toValue` (`source.current
+	* ?? defaultValue`), so it always reflects the source's current value —
+	* including writes made from outside the component; `setValue` resolves the
+	* next value (value or updater form), writes it through to the source (its
+	* `current`, its setter or its `onChange`) and bumps a local version counter
+	* so the derived `value` re-renders. SSR-safe: nothing touches the DOM and the
+	* first server render already shows the default.
+	*
+	* @param source       The `State<T | undefined | null>` source holding the
+	*                     value — read through `toValue` on every render and
+	*                     written back to `current` / the tuple setter /
+	*                     `onChange` on `setValue`.
+	* @param defaultValue The value displayed while the source is `null` or
+	*                     `undefined`.
+	* @return  A tuple `[value, setValue]` — the current value (source value or
+	*          `defaultValue`) and its setter.
+	*
+	* @example
+	* const raw = { current: undefined as string | undefined }
+	* const [value, setValue] = useStateDefault(raw, 'default')
+	*
+	* setValue('hello')
+	* console.log(value) // 'hello' after the next render (React derives at render)
+	*
+	* setValue(undefined)
+	* console.log(value) // 'default' after the next render
+	*/
+	function useStateDefault(source, defaultValue) {
+		var _toValue;
+		const sourceRef = (0, react.useRef)(source);
+		sourceRef.current = source;
+		const [, setVersion] = (0, react.useState)(0);
+		const bump = () => {
+			setVersion((current) => current + 1);
+		};
+		const setValue = (0, react.useCallback)((next) => {
+			const current = toValue(sourceRef.current);
+			const resolved = typeof next === "function" ? next(current) : next;
+			const currentSource = sourceRef.current;
+			if (isStateTuple(currentSource)) {
+				currentSource[1](resolved);
+				bump();
+			} else if (isObjectState(currentSource)) {
+				var _currentSource$onChan;
+				(_currentSource$onChan = currentSource.onChange) === null || _currentSource$onChan === void 0 || _currentSource$onChan.call(currentSource, resolved);
+				bump();
+			} else if (isRefState(currentSource)) {
+				currentSource.current = resolved;
+				bump();
+			}
+		}, []);
+		return [(_toValue = toValue(source)) !== null && _toValue !== void 0 ? _toValue : defaultValue, setValue];
+	}
+	//#endregion
+	//#region useStateManualReset/index.tsx
+	/**
+	* A controlled source — a `[value, setter]` tuple or a `{ value, onChange }`
+	* object. These have no stored default of their own: `toValue` returns the
+	* live value, so resetting to it would be a no-op. Reset therefore restores
+	* the initial argument value instead.
+	*/
+	function isControlledSource$1(state) {
+		return Array.isArray(state) && state.length === 2 && typeof state[1] === "function" || typeof state === "object" && state !== null && !Array.isArray(state) && "value" in state;
+	}
+	/**
+	* React port of VueUse's `refManualReset`.
+	*
+	* Map from @vueuse/shared `refManualReset`
+	* (`source/vueuse/packages/shared/refManualReset/`). Create a state with
+	* manual reset functionality — any update can be reverted back to the initial
+	* value with the returned `reset` function.
+	*
+	* Upstream returns a writable Vue `Ref<T>` extended with a `reset` method
+	* (built on `customRef`). Per this repo's naming rules the port is renamed to
+	* `useStateManualReset` and the ref becomes a `[value, setValue, reset]`
+	* tuple: the second element is the plain `useState` setter (value or updater
+	* form), and `reset` restores the default value.
+	*
+	* The state input accepts the shared `State<T>` form: a value, getter, ref-like
+	* object, state tuple, or controlled `{ value, onChange }` object. `reset`
+	* re-reads the input on every call, so plain, getter and ref-like sources
+	* reset to the latest source value (matching upstream's
+	* `value = toValue(defaultValue)`); tuple / `{ value, onChange }` (controlled)
+	* sources have no stored default, so they restore the initial argument value.
+	*
+	* @example
+	* const [message, setMessage, resetMessage] = useStateManualReset('default message')
+	* setMessage('message has set')
+	* resetMessage()
+	* console.log(message) // 'default message'
+	*/
+	function useStateManualReset(value) {
+		const valueRef = (0, react.useRef)(value);
+		valueRef.current = value;
+		const initialDefaultRef = (0, react.useRef)(toValue(value));
+		const [state, setState] = useControllableState(value, { passive: true });
+		return [
+			state,
+			setState,
+			(0, react.useCallback)(() => {
+				const current = valueRef.current;
+				setState(isControlledSource$1(current) ? initialDefaultRef.current : toValue(current));
+			}, [])
+		];
+	}
+	//#endregion
+	//#region useThrottleFn/index.tsx
+	/**
+	* Throttle execution of a function — React port of VueUse's `useThrottleFn`.
+	* Especially useful for rate limiting execution of handlers on events like
+	* resize and scroll.
+	*
+	* Map from @vueuse/shared `useThrottleFn`
+	* Mapping: upstream builds `createFilterWrapper(throttleFilter(ms, trailing,
+	* leading, rejectOnCancel), fn)` and returns a plain `PromisifyFn<T>` — the
+	* throttled wrapper carries no `cancel` / `flush` / `isPending` (unlike the
+	* debounce filter, upstream's `throttleFilter` is not cancelable), so this
+	* port mirrors that: the return value is the wrapped function and nothing
+	* more. The wrapper is built once (`useMemo`) so its identity is stable
+	* across renders — safe to add/remove in effects; the latest `fn` / `ms` /
+	* `trailing` / `leading` / `rejectOnCancel` are mirrored into refs so every
+	* call sees fresh values (upstream captures the flags once, at filter
+	* creation). `ms` accepts a number or a ref-like `{ current: number }`
+	* (upstream: `RefOrValue<number>`) and is re-read on every call. The
+	* throttle filter logic is inlined (upstream: `utils/filters.ts`
+	* `throttleFilter` — leading/trailing timestamps with a trailing invoke on
+	* window end). The wrapper is cleaned up on unmount: any pending trailing
+	* timer is cleared when the component unmounts — a React hygiene measure;
+	* upstream registers no disposal at all (`@__NO_SIDE_EFFECTS__`), so a
+	* pending call would still fire there after teardown.
+	*
+	* @param   fn             A function to be executed after delay milliseconds. The `this` context and all arguments are passed through, as-is,
+	*                                    to `callback` when the throttled-function is executed.
+	* @param   ms             A zero-or-greater delay in milliseconds. For event callbacks, values around 100 or 250 (or even higher) are most useful.
+	*                                    (default value: 200)
+	*
+	* @param [trailing] if true, call fn again after the time is up (default value: true)
+	*
+	* @param [leading] if true, call fn on the leading edge of the ms timeout (default value: true)
+	*
+	* @param [rejectOnCancel] if true, reject the last call if it's been cancel (default value: false)
+	*
+	* @return  A new, throttled, function.
+	*
+	* @example
+	* const throttledFn = useThrottleFn(() => { ... }, 1000)
+	* throttledFn()
+	*/
+	function useThrottleFn(fn, ms = 200, trailing = true, leading = true, rejectOnCancel = false) {
+		const fnRef = (0, react.useRef)(fn);
+		fnRef.current = fn;
+		const msRef = (0, react.useRef)(ms);
+		msRef.current = ms;
+		const trailingRef = (0, react.useRef)(trailing);
+		trailingRef.current = trailing;
+		const leadingRef = (0, react.useRef)(leading);
+		leadingRef.current = leading;
+		const rejectOnCancelRef = (0, react.useRef)(rejectOnCancel);
+		rejectOnCancelRef.current = rejectOnCancel;
+		const { throttled, clear } = (0, react.useMemo)(() => {
+			let lastExec = 0;
+			let timer;
+			let isLeading = true;
+			let lastRejector = noop;
+			let lastValue;
+			const clear = () => {
+				if (timer !== void 0) {
+					clearTimeout(timer);
+					timer = void 0;
+					lastRejector();
+					lastRejector = noop;
+				}
+			};
+			const handler = (_invoke) => {
+				const duration = toValue(msRef.current);
+				const elapsed = Date.now() - lastExec;
+				const invoke = () => {
+					return lastValue = _invoke();
+				};
+				clear();
+				if (duration === void 0 || duration <= 0) {
+					lastExec = Date.now();
+					return invoke();
+				}
+				if (elapsed > duration) {
+					lastExec = Date.now();
+					if (leadingRef.current || !isLeading) invoke();
+				} else if (trailingRef.current) lastValue = new Promise((resolve, reject) => {
+					lastRejector = rejectOnCancelRef.current ? reject : resolve;
+					timer = setTimeout(() => {
+						lastExec = Date.now();
+						isLeading = true;
+						resolve(invoke());
+						clear();
+					}, Math.max(0, duration - elapsed));
+				});
+				if (!leadingRef.current && timer === void 0) timer = setTimeout(() => {
+					isLeading = true;
+				}, duration);
+				isLeading = false;
+				return lastValue;
+			};
+			const throttled = ((...args) => {
+				return new Promise((resolve, reject) => {
+					Promise.resolve(handler(() => fnRef.current(...args))).then(resolve).catch(reject);
+				});
+			});
+			return {
+				throttled,
+				clear
+			};
+		}, []);
+		(0, react.useEffect)(() => () => clear(), [clear]);
+		return throttled;
+	}
+	//#endregion
+	//#region useStateThrottled/index.tsx
+	/**
+	* Throttle changing of a state value — React port of VueUse's `refThrottled`.
+	*
+	* The `value` argument accepts any `State<T>` supported by
+	* `useControllableState`: a plain value, lazy initializer, controlled tuple,
+	* or `{ value, onChange }` source. The returned tuple contains the current
+	* value, its setter, and a throttled mirror.
+	*
+	* A `delay <= 0` short-circuits like upstream (`if (delay <= 0) return value`):
+	* the throttled element is the input itself — no throttling, no timers.
+	*
+	* @param value State source accepted by `useControllableState`.
+	* @param delay Delay in milliseconds between commits (default: 200).
+	* @param trailing Whether to commit the latest value after the window (default: true).
+	* @param leading Whether to commit on the leading edge (default: true).
+	*/
+	function useStateThrottled(value, delay = 200, trailing = true, leading = true) {
+		const [input, setInput] = useControllableState(value, { passive: true });
+		const [throttled, setThrottled] = (0, react.useState)(input);
+		const inputRef = (0, react.useRef)(input);
+		inputRef.current = input;
+		const delayRef = (0, react.useRef)(delay);
+		delayRef.current = delay;
+		const throttledFn = useThrottleFn(() => {
+			setThrottled(inputRef.current);
+		}, delay, trailing, leading);
+		const isFirstRunRef = (0, react.useRef)(true);
+		(0, react.useEffect)(() => {
+			if (isFirstRunRef.current) {
+				isFirstRunRef.current = false;
+				return;
+			}
+			if (delayRef.current > 0) throttledFn();
+		}, [input, throttledFn]);
+		if (delay <= 0) return [
+			input,
+			setInput,
+			input
+		];
+		return [
+			input,
+			setInput,
+			throttled
+		];
+	}
+	//#endregion
+	//#region useStateWithControl/index.tsx
+	/**
+	* A controlled source — a `[value, setter]` tuple or a `{ value, onChange }`
+	* object — whose value is owned by the caller (re-rendered externally).
+	*/
+	function isControlledSource(state) {
+		return Array.isArray(state) && state.length === 2 && typeof state[1] === "function" || typeof state === "object" && state !== null && !Array.isArray(state) && "value" in state;
+	}
+	/**
+	* Fine-grained controls over a state and its re-renders — React port of
+	* VueUse's `refWithControl`.
+	*
+	* Map from @vueuse/shared `refWithControl`
+	* (`source/vueuse/packages/shared/refWithControl/`). Upstream returns a single
+	* writable Vue `Ref` extended with `get` / `set` / `untrackedGet` /
+	* `silentSet` / `peek` / `lay`. This port owns the state like a `useState` and
+	* returns the React tuple `const [num, setNum, control] = useStateWithControl(0)`
+	* — the name follows this repo's `ref*` → `useState*` mapping rule. `setNum`
+	* behaves like a normal `setState` (value or updater form — the updater base
+	* is the current internal value, which may be ahead of the rendered value
+	* after a silent write), while `control`
+	* keeps the fine-grained get/set pair: `set(value, false)` (and `lay` /
+	* `silentSet`) updates the value without re-rendering (upstream: without
+	* triggering reactivity), and `peek` / `untrackedGet` read it back — in React
+	* there is no dependency tracking during render, so those are plain aliases
+	* for the current value. `reset()` (a small addition, upstream has no
+	* equivalent) restores the initial value and participates in the change
+	* callbacks (`onBeforeChange` can dismiss it, `onChanged` fires when
+	* accepted). Option names are kept from upstream:
+	* `onBeforeChange` can dismiss a change by returning `false`, and `onChanged`
+	* fires synchronously after an accepted change.
+	*
+	* @param   state    State source: a plain value, getter, ref-like value, state
+	*                   tuple, or `{ value, onChange }` controllable state.
+	* @param   options
+	* @return  A tuple `[value, setValue, control]` — the current value, a
+	*          `setState`-like setter and the fine-grained control object.
+	*
+	* @example
+	* const [num, setNum, control] = useStateWithControl(0)
+	*
+	* setNum(42) // just like a normal useState setter
+	* control.set(30, false) // set the value without re-rendering
+	* control.peek() // get the value without tracking
+	*/
+	function useStateWithControl(state, options = {}) {
+		const { onBeforeChange, onChanged } = options;
+		const initialRef = (0, react.useRef)(toValue(state));
+		const sourceRef = (0, react.useRef)(initialRef.current);
+		const [value, setState] = useControllableState(state, { passive: true });
+		const lastTriggeredRef = (0, react.useRef)(void 0);
+		if (isControlledSource(state) && !Object.is(value, lastTriggeredRef.current)) {
+			sourceRef.current = value;
+			lastTriggeredRef.current = value;
+		}
+		const callbacksRef = (0, react.useRef)({
+			onBeforeChange,
+			onChanged
+		});
+		callbacksRef.current = {
+			onBeforeChange,
+			onChanged
+		};
+		const set = (0, react.useCallback)((nextValue, triggering = true) => {
+			var _callbacksRef$current, _callbacksRef$current2, _callbacksRef$current3, _callbacksRef$current4;
+			if (nextValue === sourceRef.current) return;
+			const old = sourceRef.current;
+			if (((_callbacksRef$current = (_callbacksRef$current2 = callbacksRef.current).onBeforeChange) === null || _callbacksRef$current === void 0 ? void 0 : _callbacksRef$current.call(_callbacksRef$current2, nextValue, old)) === false) return;
+			sourceRef.current = nextValue;
+			(_callbacksRef$current3 = (_callbacksRef$current4 = callbacksRef.current).onChanged) === null || _callbacksRef$current3 === void 0 || _callbacksRef$current3.call(_callbacksRef$current4, nextValue, old);
+			if (triggering) {
+				lastTriggeredRef.current = nextValue;
+				setState(nextValue);
+			}
+		}, []);
+		const get = (0, react.useCallback)((_tracking = true) => {
+			return sourceRef.current;
+		}, []);
+		const untrackedGet = (0, react.useCallback)(() => get(false), [get]);
+		const silentSet = (0, react.useCallback)((nextValue) => set(nextValue, false), [set]);
+		const peek = (0, react.useCallback)(() => get(false), [get]);
+		const lay = (0, react.useCallback)((nextValue) => set(nextValue, false), [set]);
+		const reset = (0, react.useCallback)(() => set(initialRef.current), [set]);
+		return [
+			value,
+			(0, react.useCallback)((nextValue) => {
+				const resolved = typeof nextValue === "function" ? nextValue(sourceRef.current) : nextValue;
+				set(resolved);
+			}, [set]),
+			{
+				get,
+				set,
+				untrackedGet,
+				silentSet,
+				peek,
+				lay,
+				reset
+			}
+		];
+	}
+	//#endregion
+	//#region useTimeout/index.tsx
+	function useTimeout(interval = 1e3, options = {}) {
+		const { controls: exposeControls = false, callback, immediate = true, immediateCallback = false } = options;
+		const [isPending, setIsPending] = (0, react.useState)(immediate);
+		const intervalRef = (0, react.useRef)(interval);
+		intervalRef.current = interval;
+		const callbackRef = (0, react.useRef)(callback);
+		callbackRef.current = callback;
+		const immediateCallbackRef = (0, react.useRef)(immediateCallback);
+		immediateCallbackRef.current = immediateCallback;
+		const timerRef = (0, react.useRef)(null);
+		const stop = (0, react.useCallback)(() => {
+			if (timerRef.current !== null) {
+				clearTimeout(timerRef.current);
+				timerRef.current = null;
+			}
+			setIsPending(false);
+		}, []);
+		const start = (0, react.useCallback)(() => {
+			var _callbackRef$current;
+			if (immediateCallbackRef.current) (_callbackRef$current = callbackRef.current) === null || _callbackRef$current === void 0 || _callbackRef$current.call(callbackRef);
+			if (timerRef.current !== null) {
+				clearTimeout(timerRef.current);
+				timerRef.current = null;
+			}
+			setIsPending(true);
+			const delay = toValue(intervalRef.current);
+			timerRef.current = setTimeout(() => {
+				var _callbackRef$current2;
+				timerRef.current = null;
+				setIsPending(false);
+				(_callbackRef$current2 = callbackRef.current) === null || _callbackRef$current2 === void 0 || _callbackRef$current2.call(callbackRef);
+			}, delay);
+		}, []);
+		(0, react.useEffect)(() => {
+			if (immediate) start();
+			return stop;
+		}, []);
+		const ready = !isPending;
+		if (exposeControls) return {
+			ready,
+			isPending,
+			start,
+			stop
+		};
+		return ready;
+	}
+	//#endregion
+	//#region useTimeoutFn/index.tsx
+	/**
+	* React port of VueUse's `useTimeoutFn` — wrapper for `setTimeout` with
+	* controls.
+	*
+	* Map from @vueuse/shared `useTimeoutFn`
+	* Mapping: upstream accepts `RefOrValue<number>` for the interval — this
+	* port accepts a plain `number`. `isPending` becomes a boolean state
+	* (upstream: a readonly shallow ref) that starts `false` and is set inside
+	* the mount effect — like upstream's `shallowRef(false)` + `isClient` gate,
+	* the server render does not report pending. `immediateCallback` runs the
+	* callback synchronously on `start` (before the timer is armed). The timer
+	* is scheduled in a mount effect (upstream starts synchronously during
+	* setup) and a pending timer is cleared on unmount via effect cleanup. The
+	* latest callback and interval are kept in refs so restarts always use the
+	* newest ones.
+	*
+	* @example
+	* const { isPending, start, stop } = useTimeoutFn(() => { ... }, 3000)
+	*/
+	function useTimeoutFn(cb, interval, options = {}) {
+		const { immediate = true, immediateCallback = false } = options;
+		const [isPending, setIsPending] = (0, react.useState)(false);
+		const cbRef = (0, react.useRef)(cb);
+		const intervalRef = (0, react.useRef)(interval);
+		const immediateCallbackRef = (0, react.useRef)(immediateCallback);
+		const timerRef = (0, react.useRef)(null);
+		cbRef.current = cb;
+		intervalRef.current = interval;
+		immediateCallbackRef.current = immediateCallback;
+		function clear() {
+			if (timerRef.current) {
+				clearTimeout(timerRef.current);
+				timerRef.current = null;
+			}
+		}
+		const stop = (0, react.useCallback)(() => {
+			setIsPending(false);
+			clear();
+		}, []);
+		const start = (0, react.useCallback)((...args) => {
+			if (immediateCallbackRef.current) cbRef.current();
+			clear();
+			setIsPending(true);
+			timerRef.current = setTimeout(() => {
+				timerRef.current = null;
+				setIsPending(false);
+				cbRef.current(...args);
+			}, intervalRef.current);
+		}, []);
+		(0, react.useEffect)(() => {
+			if (immediate) start();
+			return () => {
+				clear();
+			};
+		}, [immediate, start]);
+		return {
+			isPending,
+			start,
+			stop
+		};
+	}
+	//#endregion
+	//#region useToggle/index.tsx
+	/**
+	* React port of VueUse's `useToggle` — a toggler between a truthy and a falsy
+	* value, both configurable.
+	*
+	* Map from @vueuse/shared `useToggle`
+	* Mapping: `ref(initialValue)` → `useControllableState(initialValue)`,
+	* `toggle()` → stable `useCallback`; accepts the full `State<T>` input.
+	* `truthyValue` / `falsyValue` are plain values (upstream: `MaybeRefOrGetter` —
+	* reactive refs/getters are not supported, see `RefOrValue`). Upstream's
+	* `toggle` returns the new value synchronously; React state updates are async,
+	* so here `toggle` is `() => void` and the new value is read from `value` on
+	* the next render. Like upstream, a bare `toggle()` flips between
+	* `truthyValue` and `falsyValue`, `toggle(value)` (including an explicit
+	* `undefined`) forces the value, and a function argument is applied as a
+	* functional update (React adaptation).
+	*
+	* @example
+	* const [value, toggle] = useToggle()
+	* toggle()        // false → true
+	* toggle(false)   // force to false
+	*
+	* const [status, toggleStatus] = useToggle('on', { truthyValue: 'on', falsyValue: 'off' })
+	* toggleStatus()  // 'on' → 'off'
+	*/
+	function useToggle(initialValue = false, options = {}) {
+		const { truthyValue = true, falsyValue = false } = options;
+		const [state, setState] = useControllableState(initialValue, { passive: true });
+		const truthyRef = (0, react.useRef)(truthyValue);
+		truthyRef.current = truthyValue;
+		const falsyRef = (0, react.useRef)(falsyValue);
+		falsyRef.current = falsyValue;
+		return [state, (0, react.useCallback)((...args) => {
+			const hasValue = args.length > 0;
+			const value = args[0];
+			setState((current) => {
+				if (hasValue) {
+					if (typeof value === "function") return value(current);
+					return value;
+				}
+				return Object.is(current, truthyRef.current) ? falsyRef.current : truthyRef.current;
+			});
+		}, [setState])];
+	}
+	//#endregion
+	//#region useToNumber/index.tsx
+	/**
+	* React port of VueUse's `useToNumber`.
+	*
+	* Map from @vueuse/shared `useToNumber`
+	* Mapping: `ComputedRef<number>` → plain number recomputed from the current
+	* value on every render (accepts `number | string`); no hook state needed.
+	*
+	* @__NO_SIDE_EFFECTS__
+	* @example
+	* useToNumber('123') // 123
+	* useToNumber('0xFA', { method: 'parseInt', radix: 16 }) // 250
+	*/
+	function useToNumber(value, options = {}) {
+		const { method = "parseFloat", radix, nanToZero } = options;
+		let resolved = value;
+		if (typeof method === "function") resolved = method(resolved);
+		else if (typeof resolved === "string") resolved = Number[method](resolved, radix);
+		if (nanToZero && Number.isNaN(resolved)) resolved = 0;
+		return resolved;
+	}
+	//#endregion
+	//#region useToString/index.tsx
+	/**
+	* React port of VueUse's `useToString`.
+	*
+	* Map from @vueuse/shared `useToString`
+	* Mapping: VueUse wraps the template-literal coercion in `computed(() => ...)`
+	* and accepts a `MaybeRefOrGetter`; React has no reactive value tracking, so
+	* this is a plain function returning the stringified value directly.
+	*
+	* The `value` param is a PLAIN read-only value — pass `ref.current` or the
+	* state value. Getter inputs are intentionally not supported (getters were
+	* removed repo-wide); unlike upstream, a getter passed here is coerced as-is
+	* (its source text), not invoked.
+	*
+	* @example
+	* useToString(123.345)       // '123.345'
+	* useToString('hi')          // 'hi'
+	* useToString({ foo: 'hi' }) // '[object Object]'
+	*/
+	function useToString(value) {
+		return `${value}`;
+	}
+	//#endregion
+	//#region useUnmount/index.tsx
+	/**
+	* React port of react-use's `useUnmount`.
+	*
+	* Map from react-use `useUnmount`
+	* Mapping: react-use's `useUnmount` keeps the callback in a `useRef`,
+	* reassigning it on every render so the newest callback is invoked, and runs
+	* it via an empty-dependency `useEffect` cleanup (react-use's `useEffectOnce`
+	* is just `useEffect(effect, [])`). This port follows the same semantics.
+	*
+	* @example
+	* useUnmount(() => cleanup())
+	*/
+	function useUnmount(fn) {
+		const fnRef = (0, react.useRef)(fn);
+		fnRef.current = fn;
+		(0, react.useEffect)(() => () => fnRef.current(), []);
+	}
+	//#endregion
+	//#region useUpdate/index.tsx
+	const updateReducer = (num) => (num + 1) % 1e6;
+	/**
+	* React port of react-use's `useUpdate`.
+	*
+	* Map from react-use `useUpdate`
+	* Mapping: `useReducer` with a wrapping counter — the returned function
+	* dispatches an update that forces a re-render and is stable across renders.
+	*
+	* @example
+	* const update = useUpdate()
+	* update() // forces a re-render
+	*/
+	function useUpdate() {
+		const [, update] = (0, react.useReducer)(updateReducer, 0);
+		return update;
+	}
+	//#endregion
+	//#region useWatch/index.tsx
+	function useWatch(source, callback, options = {}) {
+		const firstRender = (0, react.useRef)(true);
+		const oldValueRef = (0, react.useRef)(void 0);
+		(0, react.useEffect)(() => {
+			const oldValue = oldValueRef.current;
+			const first = firstRender.current;
+			firstRender.current = false;
+			if (!first || options.immediate) callback(source, oldValue);
+			oldValueRef.current = source;
+		}, Array.isArray(source) ? source : [source]);
+	}
+	//#endregion
+	//#region useWatchArray/index.tsx
+	/**
+	* React port of VueUse's `watchArray` — watch for an array with additions and removals.
+	*
+	* Mapping: built on the house `useWatch` — the list is a plain array value tracked across
+	* renders, `useWatch` handles the change detection, and the previous list is diffed against
+	* the next one with item-identity matching (like upstream) so the callback receives
+	* `(newList, oldList, added, removed)`. The list is wrapped as a single-element watch
+	* source (`[list]`) so `useWatch` tracks it by reference identity instead of spreading a
+	* variable-length list into its dependency list (React requires a constant deps size).
+	*
+	* Divergences from the upstream Vue API:
+	* - `source` is a plain array value — Vue's `WatchSource` forms (ref / getter / reactive)
+	*   have no React equivalent, compute the array during render and pass it directly.
+	* - The list is tracked by reference identity: replacing it with a new array fires the
+	*   callback even when the items are identical (like a Vue ref reassignment), while
+	*   re-renders that keep the same array reference do not fire.
+	* - In-place mutations (`push` / `splice`) do not re-render — produce a new array
+	*   (`setList([...list, item])`) to trigger the watch.
+	* - The upstream `onCleanup` callback parameter is not ported — `useWatch` has no
+	*   watch-cleanup equivalent, use `useEffect` cleanup in the component instead.
+	* - The return value is `void` — upstream returns a stop `WatchHandle`; watching
+	*   ends when the component unmounts.
+	*
+	* @example
+	* ```ts
+	* useWatchArray(list, (newList, oldList, added, removed) => {
+	*   console.log('added:', added, 'removed:', removed)
+	* })
+	* ```
+	*/
+	function useWatchArray(source, cb, options) {
+		useWatch([source], (watched, watchedOld) => {
+			var _watchedOld$;
+			const newList = watched[0];
+			const prevList = [...(_watchedOld$ = watchedOld === null || watchedOld === void 0 ? void 0 : watchedOld[0]) !== null && _watchedOld$ !== void 0 ? _watchedOld$ : []];
+			const oldListRemains = Array.from({ length: prevList.length });
+			const added = [];
+			for (const obj of newList) {
+				let found = false;
+				for (let i = 0; i < prevList.length; i++) if (!oldListRemains[i] && obj === prevList[i]) {
+					oldListRemains[i] = true;
+					found = true;
+					break;
+				}
+				if (!found) added.push(obj);
+			}
+			cb(newList, prevList, added, prevList.filter((_, i) => !oldListRemains[i]));
+		}, options);
+	}
+	//#endregion
+	//#region useWatchAtMost/index.tsx
+	/**
+	* React port of VueUse's `watchAtMost` — `watch` with the number of times
+	* triggered.
+	*
+	* Map from @vueuse/shared `watchAtMost`
+	* Mapping: built on the house `useWatch`. The callback is wrapped with a fire
+	* counter: each invocation increments the `count` state (exposed in the
+	* return so components re-render), and once the limit — `options.count` — is
+	* reached the wrapper marks the watcher as stopped so further source changes
+	* are ignored. A manual `stop()` has the same effect before the limit.
+	*
+	* Divergences from upstream:
+	* - upstream stops the underlying watcher via `stop()` scheduled on
+	*   `nextTick`; this port keeps the effect registered but the wrapped callback
+	*   becomes a no-op — observable behavior is identical (the callback fires at
+	*   most `count` times).
+	* - `pause` / `resume` (upstream: inherited from `watchWithFilter`) are ported
+	*   as a skip flag on the wrapped callback — React has no watcher to detach,
+	*   but the observable behavior matches the Pausable controls.
+	* - upstream's `count` return is a shallow ref; here it is React state so
+	*   reads re-render.
+	* - upstream's `WatchWithFilterOptions` members beyond `immediate` (`deep`,
+	*   `flush`, `onTrack`, `onTrigger`) are not accepted — they are not
+	*   expressible in React (no reactive graph, no configurable commit, no
+	*   reactivity bookkeeping), and the option type rejects them.
+	*
+	* @example
+	* ```tsx
+	* const { count, stop } = useWatchAtMost(num, (value, oldValue) => {
+	*   console.log(value, oldValue)
+	* }, { count: 3 })
+	* ```
+	*/
+	function useWatchAtMost(source, callback, options) {
+		const { count: maxCount, ...watchOptions } = options;
+		const [count, setCount] = (0, react.useState)(0);
+		const firedRef = (0, react.useRef)(0);
+		const stoppedRef = (0, react.useRef)(false);
+		const pausedRef = (0, react.useRef)(false);
+		const maxCountRef = (0, react.useRef)(maxCount);
+		maxCountRef.current = maxCount;
+		const stop = (0, react.useCallback)(() => {
+			stoppedRef.current = true;
+		}, []);
+		const pause = (0, react.useCallback)(() => {
+			pausedRef.current = true;
+		}, []);
+		const resume = (0, react.useCallback)(() => {
+			pausedRef.current = false;
+		}, []);
+		function wrapped(value, oldValue) {
+			if (stoppedRef.current || pausedRef.current) return;
+			firedRef.current += 1;
+			setCount(firedRef.current);
+			callback(value, oldValue);
+			if (firedRef.current >= maxCountRef.current) stoppedRef.current = true;
+		}
+		useWatch(source, wrapped, watchOptions);
+		return {
+			count,
+			stop,
+			pause,
+			resume
+		};
+	}
+	//#endregion
+	//#region useWatchDebounced/index.tsx
+	function useWatchDebounced(source, callback, options = {}) {
+		const { debounce = 0, maxWait, rejectOnCancel } = options;
+		useWatch(source, useDebounceFn((value, oldValue) => callback(value, oldValue), debounce, {
+			maxWait,
+			rejectOnCancel
+		}), { immediate: options.immediate });
+	}
+	//#endregion
+	//#region useWatchDeep/index.tsx
+	/**
+	* Structural equality, mirroring the semantics of test `toEqual`: primitives
+	* are compared with `Object.is`, and `Date`, `RegExp`, `Array`, `Map`, `Set`
+	* and objects (plain or class instances) are compared by contents. Functions
+	* compare by reference, and `Map` keys are matched by reference because key
+	* lookups cannot deep-match, while `Map` values and `Set` items are compared
+	* deeply.
+	*
+	* Shared single source of truth — used by {@link useWatchDeep} and imported
+	* from `@reause/shared` by core hooks that need deep change detection
+	* (e.g. `useCloned`).
+	*/
+	function deepEqual(a, b) {
+		if (Object.is(a, b)) return true;
+		if (a === null || b === null || typeof a !== "object" || typeof b !== "object") return false;
+		const aRecord = a;
+		const bRecord = b;
+		if (aRecord.constructor !== bRecord.constructor) return false;
+		if (a instanceof Date) return a.getTime() === b.getTime();
+		if (a instanceof RegExp) return a.source === b.source && a.flags === b.flags;
+		if (Array.isArray(a)) {
+			const bArray = b;
+			return a.length === bArray.length && a.every((item, index) => deepEqual(item, bArray[index]));
+		}
+		if (a instanceof Map) {
+			const bMap = b;
+			if (a.size !== bMap.size) return false;
+			for (const [key, value] of a) if (!bMap.has(key) || !deepEqual(value, bMap.get(key))) return false;
+			return true;
+		}
+		if (a instanceof Set) {
+			const bSet = b;
+			if (a.size !== bSet.size) return false;
+			const unmatched = [...bSet];
+			for (const item of a) {
+				const index = unmatched.findIndex((candidate) => deepEqual(item, candidate));
+				if (index === -1) return false;
+				unmatched.splice(index, 1);
+			}
+			return true;
+		}
+		const aKeys = Object.keys(aRecord);
+		if (aKeys.length !== Object.keys(bRecord).length) return false;
+		return aKeys.every((key) => Object.hasOwn(bRecord, key) && deepEqual(aRecord[key], bRecord[key]));
+	}
+	/**
+	* Deep clone pairing with {@link deepEqual}'s type coverage — `Date`, `RegExp`,
+	* `Array`, `Map`, `Set` and objects (plain or class instances) are copied
+	* structurally, primitives and functions pass through. Used to snapshot a live
+	* value into an isolated baseline for change detection (e.g. `useCloned`'s
+	* source / cloned baselines, which must stay unaffected by in-place mutations).
+	*/
+	function deepClone(value) {
+		if (value === null || typeof value !== "object") return value;
+		if (value instanceof Date) return new Date(value.getTime());
+		if (value instanceof RegExp) return new RegExp(value.source, value.flags);
+		if (Array.isArray(value)) return value.map((item) => deepClone(item));
+		if (value instanceof Map) {
+			const result = /* @__PURE__ */ new Map();
+			for (const [key, item] of value) result.set(key, deepClone(item));
+			return result;
+		}
+		if (value instanceof Set) {
+			const result = /* @__PURE__ */ new Set();
+			for (const item of value) result.add(deepClone(item));
+			return result;
+		}
+		const result = Object.create(Object.getPrototypeOf(value));
+		for (const key of Object.keys(value)) result[key] = deepClone(value[key]);
+		return result;
+	}
+	function useWatchDeep(source, callback, options = {}) {
+		const immediateCall = (0, react.useRef)(options.immediate === true);
+		useWatch(source, (value, oldValue) => {
+			if (immediateCall.current) {
+				immediateCall.current = false;
+				callback(value, oldValue);
+				return;
+			}
+			if (!deepEqual(value, oldValue)) callback(value, oldValue);
+		}, options);
+	}
+	//#endregion
+	//#region useWatchIgnorable/index.tsx
+	function useWatchIgnorable(source, callback, options = {}) {
+		const { immediate, once } = options;
+		const lastSeenRef = (0, react.useRef)(source);
+		const snapshotRef = (0, react.useRef)(source);
+		const ignoreRef = (0, react.useRef)(false);
+		const stoppedRef = (0, react.useRef)(false);
+		useWatch(source, (value, oldValue) => {
+			lastSeenRef.current = value;
+			const ignore = ignoreRef.current;
+			ignoreRef.current = false;
+			if (ignore || stoppedRef.current) return;
+			callback(value, oldValue);
+			if (once) stoppedRef.current = true;
+		}, { immediate });
+		(0, react.useEffect)(() => {
+			if (ignoreRef.current && Object.is(source, snapshotRef.current)) ignoreRef.current = false;
+		});
+		return {
+			ignoreUpdates: (0, react.useCallback)((updater) => {
+				snapshotRef.current = lastSeenRef.current;
+				updater();
+				ignoreRef.current = true;
+			}, []),
+			ignorePrevAsyncUpdates: (0, react.useCallback)(() => {
+				snapshotRef.current = lastSeenRef.current;
+				ignoreRef.current = true;
+			}, []),
+			stop: (0, react.useCallback)(() => {
+				stoppedRef.current = true;
+			}, [])
+		};
+	}
+	//#endregion
+	//#region useWatchImmediate/index.tsx
+	function useWatchImmediate(source, callback) {
+		useWatch(source, callback, { immediate: true });
+	}
+	//#endregion
+	//#region useWatchOnce/index.tsx
+	/**
+	* Shorthand for watching value with `{ once: true }` — the callback fires at
+	* most once (the first matching change) and the watcher stops afterwards —
+	* React port of VueUse's `watchOnce`.
+	*
+	* Map from @vueuse/shared `watchOnce`.
+	*
+	* Mapping: upstream is a shorthand for
+	* `watch(source, cb, { ...options, once: true })`. This port builds the same
+	* shorthand on the house `useWatch` (like `useWatchAtMost` does with
+	* `count: 1`): the callback is wrapped with a `stopped` ref — the first
+	* invocation forwards `(value, oldValue)` and marks the watcher stopped, so
+	* every further source change is ignored. An `immediate: true` call counts
+	* toward the once, matching upstream.
+	*
+	* Divergences from upstream:
+	* - Returns `{ stop }` instead of the full Vue `WatchHandle` — `stop` disables
+	*   further fires early (matching upstream's `stop()`); disposal otherwise
+	*   follows the component lifecycle.
+	* - The source is a plain value (or array of values) tracked across renders —
+	*   Vue's `WatchSource` forms (ref / getter / reactive) have no React
+	*   equivalent, and the `deep` / `flush` watch options don't apply.
+	*
+	* @example
+	* ```ts
+	* useWatchOnce(count, (value, oldValue) => console.log(value, oldValue))
+	* ```
+	*/
+	function useWatchOnce(source, callback, options = {}) {
+		const stoppedRef = (0, react.useRef)(false);
+		const stop = (0, react.useCallback)(() => {
+			stoppedRef.current = true;
+		}, []);
+		function wrapped(value, oldValue) {
+			if (stoppedRef.current) return;
+			stoppedRef.current = true;
+			callback(value, oldValue);
+		}
+		useWatch(source, wrapped, options);
+		return { stop };
+	}
+	//#endregion
+	//#region useWatchPausable/index.tsx
+	function useWatchPausable(source, callback, options = {}) {
+		const { initialState = "active", immediate } = options;
+		const [isActive, setIsActive] = (0, react.useState)(initialState === "active");
+		const activeRef = (0, react.useRef)(initialState === "active");
+		const stoppedRef = (0, react.useRef)(false);
+		const pause = (0, react.useCallback)(() => {
+			activeRef.current = false;
+			setIsActive(false);
+		}, []);
+		const resume = (0, react.useCallback)(() => {
+			activeRef.current = true;
+			setIsActive(true);
+		}, []);
+		const stop = (0, react.useCallback)(() => {
+			stoppedRef.current = true;
+		}, []);
+		useWatch(source, (current, oldValue) => {
+			if (!activeRef.current || stoppedRef.current) return;
+			callback(current, oldValue);
+		}, { immediate });
+		return {
+			pause,
+			resume,
+			isActive,
+			stop
+		};
+	}
+	//#endregion
+	//#region useWatchThrottled/index.tsx
+	function useWatchThrottled(source, callback, options = {}) {
+		const { throttle = 0, trailing = true, leading = true } = options;
+		useWatch(source, useThrottleFn((value, oldValue) => callback(value, oldValue), throttle, trailing, leading), { immediate: options.immediate });
+	}
+	//#endregion
+	//#region useWatchTriggerable/index.tsx
+	function useWatchTriggerable(source, callback, options = {}) {
+		const { immediate } = options;
+		const [, forceCommit] = (0, react.useState)(0);
+		const cleanupFnRef = (0, react.useRef)(void 0);
+		const onCleanup = (0, react.useCallback)((cleanupFn) => {
+			cleanupFnRef.current = cleanupFn;
+		}, []);
+		const triggerableCallback = (0, react.useCallback)((value, oldValue) => {
+			const cleanupFn = cleanupFnRef.current;
+			if (cleanupFn) {
+				cleanupFnRef.current = void 0;
+				cleanupFn();
+			}
+			return callback(value, oldValue, onCleanup);
+		}, [callback, onCleanup]);
+		const lastSeenRef = (0, react.useRef)(source);
+		const snapshotRef = (0, react.useRef)(source);
+		const ignoreRef = (0, react.useRef)(false);
+		const stoppedRef = (0, react.useRef)(false);
+		useWatch(source, (value, oldValue) => {
+			lastSeenRef.current = value;
+			const ignore = ignoreRef.current;
+			ignoreRef.current = false;
+			if (ignore || stoppedRef.current) return;
+			triggerableCallback(value, oldValue);
+		}, { immediate });
+		(0, react.useEffect)(() => {
+			if (ignoreRef.current && isSameSource(source, snapshotRef.current)) ignoreRef.current = false;
+		});
+		const ignoreUpdates = (0, react.useCallback)((updater) => {
+			snapshotRef.current = lastSeenRef.current;
+			updater();
+			ignoreRef.current = true;
+			forceCommit((x) => x + 1);
+		}, [forceCommit]);
+		const ignorePrevAsyncUpdates = (0, react.useCallback)(() => {
+			snapshotRef.current = lastSeenRef.current;
+			ignoreRef.current = true;
+			forceCommit((x) => x + 1);
+		}, [forceCommit]);
+		const stop = (0, react.useCallback)(() => {
+			stoppedRef.current = true;
+		}, []);
+		return {
+			trigger: (0, react.useCallback)(() => {
+				let result;
+				ignoreUpdates(() => {
+					result = triggerableCallback(source, getOldValue(source));
+				});
+				return result;
+			}, [
+				source,
+				triggerableCallback,
+				ignoreUpdates
+			]),
+			ignoreUpdates,
+			ignorePrevAsyncUpdates,
+			stop
+		};
+	}
+	function getOldValue(source) {
+		return Array.isArray(source) ? source.map(() => void 0) : void 0;
+	}
+	function isSameSource(a, b) {
+		if (Object.is(a, b)) return true;
+		return Array.isArray(a) && Array.isArray(b) && a.length === b.length && a.every((item, index) => Object.is(item, b[index]));
+	}
+	//#endregion
+	//#region useWatchWithFilter/index.tsx
+	function bypassFilter(invoke) {
+		invoke();
+	}
+	/**
+	* Create an EventFilter that debounce the events — in-house port of upstream
+	* `@vueuse/shared` `debounceFilter` (trailing edge + `maxWait`).
+	*
+	* Mapping: same collapsing semantics as upstream (a newer call supersedes the
+	* pending one; the `maxWait` timer survives re-scheduling and forces the call
+	* with the latest `invoke`). Divergences: the promise-settlement plumbing
+	* (`lastRejector` / `rejectOnCancel`) is dropped — the house `EventFilter`
+	* contract returns `void` and the watch path consumes no promise, so
+	* `rejectOnCancel` has no observable effect — and `isPending` is a plain
+	* getter instead of a reactive ref. `ms` accepts a plain number or a React
+	* ref (upstream: `RefOrValue<number>`) and is re-read on every call. Pending
+	* timers are cleared by `cancel()` — the `useWatchWithFilter` hook calls it
+	* on stop / unmount.
+	*
+	* @example
+	* ```ts
+	* useWatchWithFilter(input, callback, { eventFilter: debounceFilter(300, { maxWait: 1000 }) })
+	* ```
+	*/
+	function debounceFilter(ms = 200, options = {}) {
+		let timer;
+		let maxTimer;
+		let pending = false;
+		let lastInvoker;
+		const clearTimers = () => {
+			if (timer !== void 0) {
+				clearTimeout(timer);
+				timer = void 0;
+			}
+			if (maxTimer !== void 0) {
+				clearTimeout(maxTimer);
+				maxTimer = void 0;
+			}
+		};
+		const handler = (invoke) => {
+			const duration = toValue(ms);
+			const maxDuration = toValue(options.maxWait);
+			if (timer !== void 0) {
+				clearTimeout(timer);
+				timer = void 0;
+			}
+			if (duration === void 0 || duration <= 0 || maxDuration !== void 0 && maxDuration <= 0) {
+				clearTimers();
+				pending = false;
+				invoke();
+				return;
+			}
+			pending = true;
+			lastInvoker = invoke;
+			if (maxDuration !== void 0 && maxTimer === void 0) maxTimer = setTimeout(() => {
+				maxTimer = void 0;
+				if (timer !== void 0) {
+					clearTimeout(timer);
+					timer = void 0;
+				}
+				pending = false;
+				lastInvoker === null || lastInvoker === void 0 || lastInvoker();
+			}, maxDuration);
+			timer = setTimeout(() => {
+				timer = void 0;
+				if (maxTimer !== void 0) {
+					clearTimeout(maxTimer);
+					maxTimer = void 0;
+				}
+				pending = false;
+				invoke();
+			}, duration);
+		};
+		const filter = handler;
+		filter.cancel = () => {
+			clearTimers();
+			pending = false;
+			lastInvoker = void 0;
+		};
+		filter.flush = () => {
+			if (!pending) return;
+			clearTimers();
+			pending = false;
+			const invoker = lastInvoker;
+			lastInvoker = void 0;
+			invoker === null || invoker === void 0 || invoker();
+		};
+		Object.defineProperty(filter, "isPending", {
+			enumerable: true,
+			get: () => pending
+		});
+		return filter;
+	}
+	/**
+	* Create an EventFilter that throttle the events — in-house port of upstream
+	* `@vueuse/shared` `throttleFilter` (leading/trailing edges with a trailing
+	* invoke on window end).
+	*
+	* Mapping: same collapsing semantics as upstream — a call inside the throttle
+	* window re-schedules the trailing timer with the remaining time, collapsing
+	* bursts into one trailing call carrying the latest `invoke`. Divergences:
+	* the promise-settlement plumbing (`rejectOnCancel`, upstream's fourth
+	* parameter) is dropped — the house `EventFilter` contract returns `void` —
+	* and the object options form is not ported (positional
+	* `throttleFilter(ms, trailing, leading)` like the house `useThrottleFn`).
+	* `ms` accepts a plain number or a React ref (upstream:
+	* `RefOrValue<number>`) and is re-read on every call.
+	*
+	* @example
+	* ```ts
+	* useWatchWithFilter(scrollY, callback, { eventFilter: throttleFilter(100, true, false) })
+	* ```
+	*/
+	function throttleFilter(ms = 200, trailing = true, leading = true) {
+		let lastExec = 0;
+		let timer;
+		let isLeading = true;
+		const clear = () => {
+			if (timer !== void 0) {
+				clearTimeout(timer);
+				timer = void 0;
+			}
+		};
+		return (invoke) => {
+			const duration = toValue(ms);
+			const elapsed = Date.now() - lastExec;
+			clear();
+			if (duration === void 0 || duration <= 0) {
+				lastExec = Date.now();
+				invoke();
+				return;
+			}
+			if (elapsed > duration) {
+				lastExec = Date.now();
+				if (leading || !isLeading) invoke();
+			} else if (trailing) timer = setTimeout(() => {
+				lastExec = Date.now();
+				isLeading = true;
+				invoke();
+				clear();
+			}, Math.max(0, duration - elapsed));
+			if (!leading && timer === void 0) timer = setTimeout(() => {
+				isLeading = true;
+			}, duration);
+			isLeading = false;
+		};
+	}
+	/**
+	* `watch` with additional EventFilter control — React port of VueUse's
+	* `watchWithFilter`.
+	* Map from @vueuse/shared watchWithFilter.
+	*
+	* Mapping: upstream builds `watch(source, createFilterWrapper(eventFilter, cb),
+	* watchOptions)` — the event filter wraps the watch trigger, so every source
+	* change hands an `invoke` closure to the filter, which decides whether and
+	* when the callback actually runs. This port builds the same wrapper on the
+	* house `useWatch` (Vue's reactive dependency tracking becomes the effect
+	* dependency list): every source change invokes the captured `eventFilter`
+	* with an `invoke` closure carrying the latest `(value, oldValue)` pair. The
+	* hook holds no state of its own — the source is the caller's own value — and
+	* returns a `stop` function (upstream's `WatchHandle`, reduced to the stop
+	* capability): after `stop()`, further source changes and any pending
+	* filtered invocation no longer fire the callback, and cancelable filters
+	* (`debounceFilter`) are cancelled outright.
+	*
+	* Divergences from upstream:
+	* - React batching: source changes made in the same tick collapse into a
+	*   single effect run, so the filter sees ONE trigger where Vue's watcher
+	*   would fire per mutation. For a trailing filter the collapsed call is
+	*   identical (the latest `(value, oldValue)` pair); a leading-edge filter
+	*   fires at most once per tick instead of once per mutation.
+	* - `deep` is not ported: React values are not deeply reactive. The source is
+	*   tracked by reference across renders (the effect dependency list), so
+	*   mutating an object in place is invisible and `deep: true` would have
+	*   nothing to recurse into — watch a derived primitive (or key) instead.
+	*   The same applies to the `flush` watch option: React effects always run
+	*   after the commit, there is no pre/post/sync choice.
+	* - The filter instance is captured once on mount (upstream evaluates watch
+	*   options once during setup) — an inline `debounceFilter(ms)` is safe; use
+	*   a getter-based delay for dynamic values.
+	* - `stop()` also suppresses a pending filtered invocation (upstream: an
+	*   already-scheduled filtered invoke still fires after stop), and pending
+	*   timers are cancelled when the component unmounts (upstream leaves
+	*   disposal to the effect scope).
+	* - The promise-settlement plumbing of upstream filters (`lastRejector` /
+	*   `rejectOnCancel`) is dropped — the house `EventFilter` contract returns
+	*   `void`, so `rejectOnCancel` has no observable effect.
+	*
+	* @example
+	* ```ts
+	* const stop = useWatchWithFilter(count, (value, oldValue) => console.log(value, oldValue))
+	* useWatchWithFilter(count, callback, { eventFilter: debounceFilter(300) })
+	* stop()
+	* ```
+	*/
+	function useWatchWithFilter(source, callback, options = {}) {
+		const { eventFilter = bypassFilter, immediate = false } = options;
+		const stoppedRef = (0, react.useRef)(false);
+		const callbackRef = (0, react.useRef)(callback);
+		callbackRef.current = callback;
+		const filterRef = (0, react.useRef)(eventFilter);
+		function wrapped(value, oldValue) {
+			if (stoppedRef.current) return;
+			filterRef.current(() => {
+				if (stoppedRef.current) return;
+				callbackRef.current(value, oldValue);
+			});
+		}
+		useWatch(source, wrapped, { immediate });
+		const stop = (0, react.useCallback)(() => {
+			stoppedRef.current = true;
+			const cancelable = filterRef.current;
+			if (typeof cancelable.cancel === "function") cancelable.cancel();
+		}, []);
+		(0, react.useEffect)(() => stop, [stop]);
+		return stop;
+	}
+	//#endregion
+	//#region useWhenever/index.tsx
+	/**
+	* React port of VueUse's `whenever`.
+	*
+	* Map from @vueuse/shared `whenever`
+	* Mapping: upstream `whenever` is Vue's `watch` plus a truthy guard — the
+	* callback runs every time the source CHANGES to a truthy value (a re-render
+	* with the same truthy value never fires). In React this becomes a `useEffect`
+	* watching `[value]`: the initial mount is skipped unless `immediate` (which
+	* fires with `oldValue` `undefined`), later runs fire when the value is truthy
+	* and actually changed, and the previous value is tracked in a ref updated on
+	* every run — mirroring `watch`'s `oldValue`, which advances through falsy
+	* values too. The callback is kept in a ref so re-renders always invoke the
+	* newest one.
+	*
+	* The `once` option stops the watch after the first truthy fire — expressible
+	* in React as a one-shot flag consulted by the effect, mirroring upstream's
+	* `if (options?.once) nextTick(() => stop())`.
+	*
+	* The return value is a `stop` function — upstream's `WatchHandle`, reduced to
+	* the stop capability (house `useWatch` has no stop-handle infrastructure).
+	* `stop()` is also called when the component unmounts.
+	*
+	* The upstream 3-arg callback `(value, oldValue, onInvalidate)` becomes a
+	* 2-arg `(value, oldValue)` in this port — `onInvalidate` (Vue's effect
+	* invalidation registration) has no React equivalent, so it is dropped.
+	*
+	* @see https://vueuse.org/shared/whenever/
+	*
+	* @example
+	* useWhenever(ready, () => console.log(state))
+	* useWhenever(ready, () => console.log(state), { immediate: true })
+	* useWhenever(ready, () => console.log(state), { once: true })
+	*/
+	function useWhenever(value, cb, options) {
+		const cbRef = (0, react.useRef)(cb);
+		cbRef.current = cb;
+		const oldValueRef = (0, react.useRef)(void 0);
+		const isFirstRenderRef = (0, react.useRef)(true);
+		const stoppedRef = (0, react.useRef)(false);
+		(0, react.useEffect)(() => {
+			if (stoppedRef.current) return;
+			const isFirstRender = isFirstRenderRef.current;
+			isFirstRenderRef.current = false;
+			const isMountFire = isFirstRender && (options === null || options === void 0 ? void 0 : options.immediate) === true;
+			const isChange = !Object.is(oldValueRef.current, value);
+			if (value && (isMountFire || !isFirstRender && isChange)) {
+				if (options === null || options === void 0 ? void 0 : options.once) stoppedRef.current = true;
+				cbRef.current(value, oldValueRef.current);
+			}
+			oldValueRef.current = value;
+		}, [value]);
+		const stop = (0, react.useCallback)(() => {
+			stoppedRef.current = true;
+		}, []);
+		(0, react.useEffect)(() => stop, [stop]);
+		return stop;
+	}
+	//#endregion
+	//#region index.ts
+	/**
+	* @reause/shared — React port of @vueuse/shared
+	* Shared utilities shared across all reause packages.
+	*
+	* Mapping note: @vueuse/shared exposes pure utilities + composables that
+	* don't depend on the renderer. In the React world those become either
+	* plain functions (no hook) or hooks without rendering logic.
+	*/
+	const isClient = typeof window !== "undefined";
+	function noop() {}
+	//#endregion
+	exports.assert = assert;
+	exports.clamp = clamp;
+	exports.createEventHook = createEventHook;
+	exports.createGlobalState = createGlobalState;
+	exports.createInjectionState = createInjectionState;
+	exports.createSharedHook = createSharedHook;
+	exports.createSingletonPromise = createSingletonPromise;
+	exports.debounceFilter = debounceFilter;
+	exports.deepClone = deepClone;
+	exports.deepEqual = deepEqual;
+	exports.formatDate = formatDate;
+	exports.hasOwn = hasOwn;
+	exports.hyphenate = hyphenate;
+	exports.increaseWithUnit = increaseWithUnit;
+	exports.isClient = isClient;
+	exports.isDef = isDef;
+	exports.isDefined = isDefined;
+	exports.isIOS = isIOS;
+	exports.isObject = isObject;
+	exports.isRefLike = isRefLike;
+	exports.makeDestructurable = makeDestructurable;
+	exports.noop = noop;
+	exports.normalizeDate = normalizeDate;
+	exports.now = now;
+	exports.objectOmit = objectOmit;
+	exports.objectPick = objectPick;
+	exports.promiseTimeout = promiseTimeout;
+	exports.pxValue = pxValue;
+	exports.rand = rand;
+	exports.syncState = syncState;
+	exports.syncStates = syncStates;
+	exports.throttleFilter = throttleFilter;
+	exports.timestamp = timestamp;
+	exports.toArray = toArray;
+	exports.toValue = toValue;
+	exports.until = until;
+	exports.useArrayDifference = useArrayDifference;
+	exports.useArrayEvery = useArrayEvery;
+	exports.useArrayFilter = useArrayFilter;
+	exports.useArrayFind = useArrayFind;
+	exports.useArrayFindIndex = useArrayFindIndex;
+	exports.useArrayFindLast = useArrayFindLast;
+	exports.useArrayIncludes = useArrayIncludes;
+	exports.useArrayJoin = useArrayJoin;
+	exports.useArrayMap = useArrayMap;
+	exports.useArrayReduce = useArrayReduce;
+	exports.useArraySome = useArraySome;
+	exports.useArrayUnique = useArrayUnique;
+	exports.useControllableState = useControllableState;
+	exports.useCounter = useCounter;
+	exports.useDateFormat = useDateFormat;
+	exports.useDebounceFn = useDebounceFn;
+	exports.useInterval = useInterval;
+	exports.useIntervalFn = useIntervalFn;
+	exports.useLastChanged = useLastChanged;
+	exports.useListener = useListener;
+	exports.useMount = useMount;
+	exports.useStateAutoReset = useStateAutoReset;
+	exports.useStateDebounced = useStateDebounced;
+	exports.useStateDefault = useStateDefault;
+	exports.useStateManualReset = useStateManualReset;
+	exports.useStateThrottled = useStateThrottled;
+	exports.useStateWithControl = useStateWithControl;
+	exports.useThrottleFn = useThrottleFn;
+	exports.useTimeout = useTimeout;
+	exports.useTimeoutFn = useTimeoutFn;
+	exports.useToNumber = useToNumber;
+	exports.useToString = useToString;
+	exports.useToggle = useToggle;
+	exports.useUnmount = useUnmount;
+	exports.useUpdate = useUpdate;
+	exports.useWatch = useWatch;
+	exports.useWatchArray = useWatchArray;
+	exports.useWatchAtMost = useWatchAtMost;
+	exports.useWatchDebounced = useWatchDebounced;
+	exports.useWatchDeep = useWatchDeep;
+	exports.useWatchIgnorable = useWatchIgnorable;
+	exports.useWatchImmediate = useWatchImmediate;
+	exports.useWatchOnce = useWatchOnce;
+	exports.useWatchPausable = useWatchPausable;
+	exports.useWatchThrottled = useWatchThrottled;
+	exports.useWatchTriggerable = useWatchTriggerable;
+	exports.useWatchWithFilter = useWatchWithFilter;
+	exports.useWhenever = useWhenever;
+	exports.writeState = writeState;
+})(this.reause = this.reause || {}, React);