@reause/integrations 0.1.2

package/dist/useNProgress.d.ts

@@ -0,0 +1,115 @@
+import { Dispatch, SetStateAction } from "react";
+import { NProgress, NProgressOptions } from "nprogress";
+//#region useNProgress/index.d.ts
+/**
+ * Options forwarded to `nprogress.configure` — mirrors upstream's
+ * `UseNProgressOptions` (`Partial<NProgressOptions>`).
+ */
+export type UseNProgressOptions = Partial<NProgressOptions>;
+export interface UseNProgressReturn {
+  /**
+   * Current progress percentage (`0..1`), `null` after `remove()`, `1` after
+   * `done()` — the plain-state replacement for upstream's `progress` ref.
+   * Write through `setProgress`.
+   */
+  readonly progress: number | null | undefined;
+  /**
+   * Setter for `progress` — the React mapping of upstream's writable `progress`
+   * ref. Takes a plain value or a functional updater (like a React `useState`
+   * setter, `prev => next`). A `number` result is pushed to `nprogress` once,
+   * through the progress effect (upstream: writing `progress.value`); a `null`
+   * / `undefined` result only clears the state — the bar element is removed
+   * through `remove()`.
+   */
+  readonly setProgress: Dispatch<SetStateAction<number | null | undefined>>;
+  /**
+   * Whether the bar is currently showing — the React replacement for
+   * upstream's writable `isLoading` computed: `true` while `progress` is a
+   * number below 1. Write through `setIsLoading`.
+   */
+  readonly isLoading: boolean;
+  /**
+   * Setter half of upstream's writable `isLoading` computed — takes a plain
+   * value or a functional updater (like a React `useState` setter,
+   * `prev => next`): `setIsLoading(true)` starts the bar, `setIsLoading(false)`
+   * completes it.
+   */
+  readonly setIsLoading: Dispatch<SetStateAction<boolean>>;
+  /**
+   * Show the bar — upstream's `start`.
+   */
+  readonly start: () => NProgress;
+  /**
+   * Complete the bar (the placebo `done` animation) — upstream's `done`.
+   *
+   * @param force - show the bar even when it is hidden
+   */
+  readonly done: (force?: boolean) => NProgress;
+  /**
+   * Reset `progress` to `null` and remove the bar from the DOM — upstream's
+   * `remove`.
+   */
+  readonly remove: () => void;
+}
+/**
+ * React port of VueUse's `useNProgress`.
+ *
+ * Map from @vueuse/integrations `useNProgress`
+ * (`source/vueuse/packages/integrations/useNProgress/index.ts`), a reactive
+ * wrapper around the [`nprogress`](https://github.com/rstacruz/nprogress)
+ * progress bar. `currentProgress` is the hook's **read-only value source** and
+ * takes a plain `number | null | undefined` (upstream: `MaybeRefOrGetter`).
+ *
+ * Adjustment for React:
+ * - the writable `WritableComputedRef<boolean>` `isLoading` and the
+ *   `Ref<number | null | undefined>` `progress` become plain state: `isLoading`
+ *   is derived (`typeof progress === 'number' && progress < 1`) and written
+ *   through `setIsLoading`, `progress` is a plain number written through
+ *   `setProgress`; the object return mirrors upstream's object of refs with
+ *   every writable value paired with its setter —
+ *   `{ progress, setProgress, isLoading, setIsLoading, start, done, remove }`;
+ * - the setters are React `Dispatch<SetStateAction<...>>`: each accepts a plain
+ *   value or a functional updater (`prev => next`), like a `useState` setter;
+ * - upstream monkey-patches the module-singleton `nprogress.set` so that its
+ *   internal `set` calls (`start` → `set(0)`, `done` → `set(1)`) write back
+ *   into `progress.value`, which is what makes `isLoading` flip. This port
+ *   never touches the global `nprogress.set`: `setProgress(n)` only sets the
+ *   state and the progress effect pushes the number into the bar once per
+ *   render, while `start` / `done` / `setIsLoading` mirror the same write-back
+ *   by hand (upstream's `start` only calls `set(0)` when the bar was idle, and
+ *   `done` only calls `set(1)` when it actually progresses) — so `isLoading`
+ *   flips exactly as upstream, without global pollution and safely with
+ *   concurrent hook instances;
+ * - `options` are applied once on mount (`nprogress.configure`), like
+ *   upstream's setup-time `if (options) nprogress.configure(options)`; later
+ *   `options` changes are not re-applied, matching the upstream setup
+ *   semantics;
+ * - a provided `currentProgress` is mirrored into the internal state (upstream's
+ *   `toRef`): a changed plain number re-syncs between renders, and a write
+ *   through `setProgress` / `start` / `done` is only superseded by a genuine
+ *   external change. Writes are **not** propagated back to the caller
+ *   (upstream's `toRef` writes through to a ref input); the source is
+ *   read-only here;
+ * - unmount runs `nprogress.remove()`, mirroring upstream's
+ *   `tryOnScopeDispose(nprogress.remove)`. `nprogress` is a module singleton,
+ *   so unmounting one hook instance removes the shared bar — the same
+ *   semantics as upstream.
+ *
+ * SSR-safe: `nprogress.set` is only called when `isClient` (upstream's
+ * `watchEffect` guard).
+ *
+ * @param currentProgress - initial progress percentage (`0..1`); a changed
+ *   plain value re-syncs on the next render
+ * @param options - `nprogress.configure` options, applied once on mount
+ *
+ * @__NO_SIDE_EFFECTS__
+ * @example
+ * const { progress, setProgress, isLoading, setIsLoading, done, remove } = useNProgress()
+ * setIsLoading(true) // starts the bar, isLoading === true
+ * setProgress(0.5) // progress === 0.5, the bar renders at 50%
+ * setProgress(prev => (prev ?? 0) + 0.1) // functional updater, like a useState setter
+ * done() // progress === 1, isLoading === false
+ * remove() // progress === null, the #nprogress element is gone
+ */
+export declare function useNProgress(currentProgress?: number | null | undefined, options?: UseNProgressOptions): UseNProgressReturn;
+//#endregion

package/dist/useNProgress.iife.js

@@ -0,0 +1,148 @@
+(function(exports, _reause_shared, nprogress, react) {
+	Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+	//#region \0rolldown/runtime.js
+	var __create = Object.create;
+	var __defProp = Object.defineProperty;
+	var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+	var __getOwnPropNames = Object.getOwnPropertyNames;
+	var __getProtoOf = Object.getPrototypeOf;
+	var __hasOwnProp = Object.prototype.hasOwnProperty;
+	var __copyProps = (to, from, except, desc) => {
+		if (from && typeof from === "object" || typeof from === "function") for (var keys = __getOwnPropNames(from), i = 0, n = keys.length, key; i < n; i++) {
+			key = keys[i];
+			if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+				get: ((k) => from[k]).bind(null, key),
+				enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+			});
+		}
+		return to;
+	};
+	var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule || !__hasOwnProp.call(mod, "default") ? __defProp(target, "default", {
+		value: mod,
+		enumerable: true
+	}) : target, mod));
+	//#endregion
+	nprogress = __toESM(nprogress, 1);
+	//#region useNProgress/index.tsx
+	/**
+	* React port of VueUse's `useNProgress`.
+	*
+	* Map from @vueuse/integrations `useNProgress`
+	* (`source/vueuse/packages/integrations/useNProgress/index.ts`), a reactive
+	* wrapper around the [`nprogress`](https://github.com/rstacruz/nprogress)
+	* progress bar. `currentProgress` is the hook's **read-only value source** and
+	* takes a plain `number | null | undefined` (upstream: `MaybeRefOrGetter`).
+	*
+	* Adjustment for React:
+	* - the writable `WritableComputedRef<boolean>` `isLoading` and the
+	*   `Ref<number | null | undefined>` `progress` become plain state: `isLoading`
+	*   is derived (`typeof progress === 'number' && progress < 1`) and written
+	*   through `setIsLoading`, `progress` is a plain number written through
+	*   `setProgress`; the object return mirrors upstream's object of refs with
+	*   every writable value paired with its setter —
+	*   `{ progress, setProgress, isLoading, setIsLoading, start, done, remove }`;
+	* - the setters are React `Dispatch<SetStateAction<...>>`: each accepts a plain
+	*   value or a functional updater (`prev => next`), like a `useState` setter;
+	* - upstream monkey-patches the module-singleton `nprogress.set` so that its
+	*   internal `set` calls (`start` → `set(0)`, `done` → `set(1)`) write back
+	*   into `progress.value`, which is what makes `isLoading` flip. This port
+	*   never touches the global `nprogress.set`: `setProgress(n)` only sets the
+	*   state and the progress effect pushes the number into the bar once per
+	*   render, while `start` / `done` / `setIsLoading` mirror the same write-back
+	*   by hand (upstream's `start` only calls `set(0)` when the bar was idle, and
+	*   `done` only calls `set(1)` when it actually progresses) — so `isLoading`
+	*   flips exactly as upstream, without global pollution and safely with
+	*   concurrent hook instances;
+	* - `options` are applied once on mount (`nprogress.configure`), like
+	*   upstream's setup-time `if (options) nprogress.configure(options)`; later
+	*   `options` changes are not re-applied, matching the upstream setup
+	*   semantics;
+	* - a provided `currentProgress` is mirrored into the internal state (upstream's
+	*   `toRef`): a changed plain number re-syncs between renders, and a write
+	*   through `setProgress` / `start` / `done` is only superseded by a genuine
+	*   external change. Writes are **not** propagated back to the caller
+	*   (upstream's `toRef` writes through to a ref input); the source is
+	*   read-only here;
+	* - unmount runs `nprogress.remove()`, mirroring upstream's
+	*   `tryOnScopeDispose(nprogress.remove)`. `nprogress` is a module singleton,
+	*   so unmounting one hook instance removes the shared bar — the same
+	*   semantics as upstream.
+	*
+	* SSR-safe: `nprogress.set` is only called when `isClient` (upstream's
+	* `watchEffect` guard).
+	*
+	* @param currentProgress - initial progress percentage (`0..1`); a changed
+	*   plain value re-syncs on the next render
+	* @param options - `nprogress.configure` options, applied once on mount
+	*
+	* @__NO_SIDE_EFFECTS__
+	* @example
+	* const { progress, setProgress, isLoading, setIsLoading, done, remove } = useNProgress()
+	* setIsLoading(true) // starts the bar, isLoading === true
+	* setProgress(0.5) // progress === 0.5, the bar renders at 50%
+	* setProgress(prev => (prev ?? 0) + 0.1) // functional updater, like a useState setter
+	* done() // progress === 1, isLoading === false
+	* remove() // progress === null, the #nprogress element is gone
+	*/
+	function useNProgress(currentProgress = null, options) {
+		const [progress, setProgressState] = (0, react.useState)(currentProgress);
+		const progressRef = (0, react.useRef)(currentProgress);
+		const updateProgress = (0, react.useCallback)((next) => {
+			progressRef.current = next;
+			setProgressState(next);
+		}, []);
+		const lastExternalRef = (0, react.useRef)(currentProgress);
+		(0, react.useEffect)(() => {
+			if (!Object.is(currentProgress, lastExternalRef.current)) {
+				lastExternalRef.current = currentProgress;
+				updateProgress(currentProgress);
+			}
+		});
+		const optionsRef = (0, react.useRef)(options);
+		optionsRef.current = options;
+		(0, react.useEffect)(() => {
+			if (optionsRef.current) nprogress.default.configure(optionsRef.current);
+		}, []);
+		(0, react.useEffect)(() => {
+			if (typeof progress === "number" && _reause_shared.isClient) nprogress.default.set(progress);
+		}, [progress]);
+		(0, react.useEffect)(() => () => {
+			nprogress.default.remove();
+		}, []);
+		const setProgress = (0, react.useCallback)((updater) => {
+			const next = typeof updater === "function" ? updater(progressRef.current) : updater;
+			updateProgress(next);
+		}, [updateProgress]);
+		const start = (0, react.useCallback)(() => {
+			const wasStarted = nprogress.default.isStarted();
+			const result = nprogress.default.start();
+			if (!wasStarted) updateProgress(0);
+			return result;
+		}, [updateProgress]);
+		const done = (0, react.useCallback)((force) => {
+			const status = nprogress.default.status;
+			const result = nprogress.default.done(force);
+			if (force || status) updateProgress(1);
+			return result;
+		}, [updateProgress]);
+		const setIsLoading = (0, react.useCallback)((updater) => {
+			if (typeof updater === "function" ? updater(typeof progressRef.current === "number" && progressRef.current < 1) : updater) start();
+			else done();
+		}, [start, done]);
+		const remove = (0, react.useCallback)(() => {
+			updateProgress(null);
+			nprogress.default.remove();
+		}, [updateProgress]);
+		return {
+			progress,
+			setProgress,
+			isLoading: typeof progress === "number" && progress < 1,
+			setIsLoading,
+			start,
+			done,
+			remove
+		};
+	}
+	//#endregion
+	exports.useNProgress = useNProgress;
+})(this.reause = this.reause || {}, reause, nprogress, React);

package/dist/useNProgress.iife.min.js

@@ -0,0 +1 @@
+(function(e,t,n,r){Object.defineProperty(e,Symbol.toStringTag,{value:`Module`});var i=Object.create,a=Object.defineProperty,o=Object.getOwnPropertyDescriptor,s=Object.getOwnPropertyNames,c=Object.getPrototypeOf,l=Object.prototype.hasOwnProperty,u=(e,t,n,r)=>{if(t&&typeof t==`object`||typeof t==`function`)for(var i=s(t),c=0,u=i.length,d;c<u;c++)d=i[c],!l.call(e,d)&&d!==n&&a(e,d,{get:(e=>t[e]).bind(null,d),enumerable:!(r=o(t,d))||r.enumerable});return e};n=((e,t,n)=>(n=e==null?{}:i(c(e)),u(t||!e||!e.__esModule||!l.call(e,`default`)?a(n,`default`,{value:e,enumerable:!0}):n,e)))(n,1);function d(e=null,i){let[a,o]=(0,r.useState)(e),s=(0,r.useRef)(e),c=(0,r.useCallback)(e=>{s.current=e,o(e)},[]),l=(0,r.useRef)(e);(0,r.useEffect)(()=>{Object.is(e,l.current)||(l.current=e,c(e))});let u=(0,r.useRef)(i);u.current=i,(0,r.useEffect)(()=>{u.current&&n.default.configure(u.current)},[]),(0,r.useEffect)(()=>{typeof a==`number`&&t.isClient&&n.default.set(a)},[a]),(0,r.useEffect)(()=>()=>{n.default.remove()},[]);let d=(0,r.useCallback)(e=>{let t=typeof e==`function`?e(s.current):e;c(t)},[c]),f=(0,r.useCallback)(()=>{let e=n.default.isStarted(),t=n.default.start();return e||c(0),t},[c]),p=(0,r.useCallback)(e=>{let t=n.default.status,r=n.default.done(e);return(e||t)&&c(1),r},[c]),m=(0,r.useCallback)(e=>{(typeof e==`function`?e(typeof s.current==`number`&&s.current<1):e)?f():p()},[f,p]),h=(0,r.useCallback)(()=>{c(null),n.default.remove()},[c]);return{progress:a,setProgress:d,isLoading:typeof a==`number`&&a<1,setIsLoading:m,start:f,done:p,remove:h}}e.useNProgress=d})(this.reause=this.reause||{},reause,nprogress,React);

package/dist/useNProgress.js

@@ -0,0 +1,125 @@
+import { useCallback, useEffect, useRef, useState } from "react";
+import { isClient } from "@reause/shared";
+import nprogress from "nprogress";
+//#region useNProgress/index.tsx
+/**
+* React port of VueUse's `useNProgress`.
+*
+* Map from @vueuse/integrations `useNProgress`
+* (`source/vueuse/packages/integrations/useNProgress/index.ts`), a reactive
+* wrapper around the [`nprogress`](https://github.com/rstacruz/nprogress)
+* progress bar. `currentProgress` is the hook's **read-only value source** and
+* takes a plain `number | null | undefined` (upstream: `MaybeRefOrGetter`).
+*
+* Adjustment for React:
+* - the writable `WritableComputedRef<boolean>` `isLoading` and the
+*   `Ref<number | null | undefined>` `progress` become plain state: `isLoading`
+*   is derived (`typeof progress === 'number' && progress < 1`) and written
+*   through `setIsLoading`, `progress` is a plain number written through
+*   `setProgress`; the object return mirrors upstream's object of refs with
+*   every writable value paired with its setter —
+*   `{ progress, setProgress, isLoading, setIsLoading, start, done, remove }`;
+* - the setters are React `Dispatch<SetStateAction<...>>`: each accepts a plain
+*   value or a functional updater (`prev => next`), like a `useState` setter;
+* - upstream monkey-patches the module-singleton `nprogress.set` so that its
+*   internal `set` calls (`start` → `set(0)`, `done` → `set(1)`) write back
+*   into `progress.value`, which is what makes `isLoading` flip. This port
+*   never touches the global `nprogress.set`: `setProgress(n)` only sets the
+*   state and the progress effect pushes the number into the bar once per
+*   render, while `start` / `done` / `setIsLoading` mirror the same write-back
+*   by hand (upstream's `start` only calls `set(0)` when the bar was idle, and
+*   `done` only calls `set(1)` when it actually progresses) — so `isLoading`
+*   flips exactly as upstream, without global pollution and safely with
+*   concurrent hook instances;
+* - `options` are applied once on mount (`nprogress.configure`), like
+*   upstream's setup-time `if (options) nprogress.configure(options)`; later
+*   `options` changes are not re-applied, matching the upstream setup
+*   semantics;
+* - a provided `currentProgress` is mirrored into the internal state (upstream's
+*   `toRef`): a changed plain number re-syncs between renders, and a write
+*   through `setProgress` / `start` / `done` is only superseded by a genuine
+*   external change. Writes are **not** propagated back to the caller
+*   (upstream's `toRef` writes through to a ref input); the source is
+*   read-only here;
+* - unmount runs `nprogress.remove()`, mirroring upstream's
+*   `tryOnScopeDispose(nprogress.remove)`. `nprogress` is a module singleton,
+*   so unmounting one hook instance removes the shared bar — the same
+*   semantics as upstream.
+*
+* SSR-safe: `nprogress.set` is only called when `isClient` (upstream's
+* `watchEffect` guard).
+*
+* @param currentProgress - initial progress percentage (`0..1`); a changed
+*   plain value re-syncs on the next render
+* @param options - `nprogress.configure` options, applied once on mount
+*
+* @__NO_SIDE_EFFECTS__
+* @example
+* const { progress, setProgress, isLoading, setIsLoading, done, remove } = useNProgress()
+* setIsLoading(true) // starts the bar, isLoading === true
+* setProgress(0.5) // progress === 0.5, the bar renders at 50%
+* setProgress(prev => (prev ?? 0) + 0.1) // functional updater, like a useState setter
+* done() // progress === 1, isLoading === false
+* remove() // progress === null, the #nprogress element is gone
+*/
+function useNProgress(currentProgress = null, options) {
+	const [progress, setProgressState] = useState(currentProgress);
+	const progressRef = useRef(currentProgress);
+	const updateProgress = useCallback((next) => {
+		progressRef.current = next;
+		setProgressState(next);
+	}, []);
+	const lastExternalRef = useRef(currentProgress);
+	useEffect(() => {
+		if (!Object.is(currentProgress, lastExternalRef.current)) {
+			lastExternalRef.current = currentProgress;
+			updateProgress(currentProgress);
+		}
+	});
+	const optionsRef = useRef(options);
+	optionsRef.current = options;
+	useEffect(() => {
+		if (optionsRef.current) nprogress.configure(optionsRef.current);
+	}, []);
+	useEffect(() => {
+		if (typeof progress === "number" && isClient) nprogress.set(progress);
+	}, [progress]);
+	useEffect(() => () => {
+		nprogress.remove();
+	}, []);
+	const setProgress = useCallback((updater) => {
+		const next = typeof updater === "function" ? updater(progressRef.current) : updater;
+		updateProgress(next);
+	}, [updateProgress]);
+	const start = useCallback(() => {
+		const wasStarted = nprogress.isStarted();
+		const result = nprogress.start();
+		if (!wasStarted) updateProgress(0);
+		return result;
+	}, [updateProgress]);
+	const done = useCallback((force) => {
+		const status = nprogress.status;
+		const result = nprogress.done(force);
+		if (force || status) updateProgress(1);
+		return result;
+	}, [updateProgress]);
+	const setIsLoading = useCallback((updater) => {
+		if (typeof updater === "function" ? updater(typeof progressRef.current === "number" && progressRef.current < 1) : updater) start();
+		else done();
+	}, [start, done]);
+	const remove = useCallback(() => {
+		updateProgress(null);
+		nprogress.remove();
+	}, [updateProgress]);
+	return {
+		progress,
+		setProgress,
+		isLoading: typeof progress === "number" && progress < 1,
+		setIsLoading,
+		start,
+		done,
+		remove
+	};
+}
+//#endregion
+export { useNProgress };

package/dist/useQRCode.d.ts

@@ -0,0 +1,38 @@
+import * as QRCode from "qrcode";
+//#region useQRCode/index.d.ts
+/**
+ * React port of VueUse's `useQRCode`.
+ *
+ * Map from @vueuse/integrations `useQRCode`
+ * (`source/vueuse/packages/integrations/useQRCode/`), a reactive wrapper
+ * around the `qrcode` package: it encodes `text` into a PNG data URL.
+ *
+ * Adjustment for React:
+ * - upstream returns a `shallowRef<string>` holding the data URL; in React the
+ *   asynchronous result is state, so the hook returns the plain `string` data
+ *   URL directly (no `.value`, no tuple) — `''` until the first encode
+ *   resolves. Exactly like upstream, an empty `text` never encodes, so the
+ *   previous data URL is kept (it is not cleared);
+ * - `text` is the hook's **read-only value source** and takes a plain string
+ *   (upstream: `MaybeRefOrGetter<string>`); a changed `text` prop re-encodes
+ *   on the next render;
+ * - the encode is `await`-free but guarded by a `cancelled` flag: when `text`
+ *   (or `options`) changes or the component unmounts while an encode is still
+ *   pending, the stale promise is ignored, so the last write always wins;
+ * - **pass a memoized `options` object** (`useMemo`/module constant). React has
+ *   no dependency-tracking equivalent of Vue's `watch` source, so `options` is
+ *   compared by identity: a fresh literal on every render re-runs the effect
+ *   and re-encodes the QR code. Options are deliberately not serialized — they
+ *   may contain non-JSON values (`toSJISFunc`, `color` functions…), which
+ *   serialization would break.
+ *
+ * @__NO_SIDE_EFFECTS__
+ * @see https://vueuse.org/useQRCode
+ * @param text - the text to encode (plain string)
+ * @param options - `qrcode` `toDataURL` options, memoized by the caller
+ * @example
+ * const qrcode = useQRCode('https://vueuse.org')
+ * qrcode // '' at first, then 'data:image/png;base64,…'
+ */
+export declare function useQRCode(text: string, options?: QRCode.QRCodeToDataURLOptions): string;
+//#endregion

package/dist/useQRCode.iife.js

@@ -0,0 +1,78 @@
+(function(exports, _reause_shared, qrcode, react) {
+	Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+	//#region \0rolldown/runtime.js
+	var __create = Object.create;
+	var __defProp = Object.defineProperty;
+	var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+	var __getOwnPropNames = Object.getOwnPropertyNames;
+	var __getProtoOf = Object.getPrototypeOf;
+	var __hasOwnProp = Object.prototype.hasOwnProperty;
+	var __copyProps = (to, from, except, desc) => {
+		if (from && typeof from === "object" || typeof from === "function") for (var keys = __getOwnPropNames(from), i = 0, n = keys.length, key; i < n; i++) {
+			key = keys[i];
+			if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+				get: ((k) => from[k]).bind(null, key),
+				enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+			});
+		}
+		return to;
+	};
+	var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule || !__hasOwnProp.call(mod, "default") ? __defProp(target, "default", {
+		value: mod,
+		enumerable: true
+	}) : target, mod));
+	//#endregion
+	qrcode = __toESM(qrcode, 1);
+	//#region useQRCode/index.tsx
+	/**
+	* React port of VueUse's `useQRCode`.
+	*
+	* Map from @vueuse/integrations `useQRCode`
+	* (`source/vueuse/packages/integrations/useQRCode/`), a reactive wrapper
+	* around the `qrcode` package: it encodes `text` into a PNG data URL.
+	*
+	* Adjustment for React:
+	* - upstream returns a `shallowRef<string>` holding the data URL; in React the
+	*   asynchronous result is state, so the hook returns the plain `string` data
+	*   URL directly (no `.value`, no tuple) — `''` until the first encode
+	*   resolves. Exactly like upstream, an empty `text` never encodes, so the
+	*   previous data URL is kept (it is not cleared);
+	* - `text` is the hook's **read-only value source** and takes a plain string
+	*   (upstream: `MaybeRefOrGetter<string>`); a changed `text` prop re-encodes
+	*   on the next render;
+	* - the encode is `await`-free but guarded by a `cancelled` flag: when `text`
+	*   (or `options`) changes or the component unmounts while an encode is still
+	*   pending, the stale promise is ignored, so the last write always wins;
+	* - **pass a memoized `options` object** (`useMemo`/module constant). React has
+	*   no dependency-tracking equivalent of Vue's `watch` source, so `options` is
+	*   compared by identity: a fresh literal on every render re-runs the effect
+	*   and re-encodes the QR code. Options are deliberately not serialized — they
+	*   may contain non-JSON values (`toSJISFunc`, `color` functions…), which
+	*   serialization would break.
+	*
+	* @__NO_SIDE_EFFECTS__
+	* @see https://vueuse.org/useQRCode
+	* @param text - the text to encode (plain string)
+	* @param options - `qrcode` `toDataURL` options, memoized by the caller
+	* @example
+	* const qrcode = useQRCode('https://vueuse.org')
+	* qrcode // '' at first, then 'data:image/png;base64,…'
+	*/
+	function useQRCode(text, options) {
+		const value = text;
+		const [result, setResult] = (0, react.useState)("");
+		(0, react.useEffect)(() => {
+			if (!value || !_reause_shared.isClient) return;
+			let cancelled = false;
+			qrcode.toDataURL(value, options).then((url) => {
+				if (!cancelled) setResult(url);
+			});
+			return () => {
+				cancelled = true;
+			};
+		}, [value, options]);
+		return result;
+	}
+	//#endregion
+	exports.useQRCode = useQRCode;
+})(this.reause = this.reause || {}, reause, QRCode, React);

package/dist/useQRCode.iife.min.js

@@ -0,0 +1 @@
+(function(e,t,n,r){Object.defineProperty(e,Symbol.toStringTag,{value:`Module`});var i=Object.create,a=Object.defineProperty,o=Object.getOwnPropertyDescriptor,s=Object.getOwnPropertyNames,c=Object.getPrototypeOf,l=Object.prototype.hasOwnProperty,u=(e,t,n,r)=>{if(t&&typeof t==`object`||typeof t==`function`)for(var i=s(t),c=0,u=i.length,d;c<u;c++)d=i[c],!l.call(e,d)&&d!==n&&a(e,d,{get:(e=>t[e]).bind(null,d),enumerable:!(r=o(t,d))||r.enumerable});return e};n=((e,t,n)=>(n=e==null?{}:i(c(e)),u(t||!e||!e.__esModule||!l.call(e,`default`)?a(n,`default`,{value:e,enumerable:!0}):n,e)))(n,1);function d(e,i){let a=e,[o,s]=(0,r.useState)(``);return(0,r.useEffect)(()=>{if(!a||!t.isClient)return;let e=!1;return n.toDataURL(a,i).then(t=>{e||s(t)}),()=>{e=!0}},[a,i]),o}e.useQRCode=d})(this.reause=this.reause||{},reause,QRCode,React);

package/dist/useQRCode.js

@@ -0,0 +1,55 @@
+import { useEffect, useState } from "react";
+import { isClient } from "@reause/shared";
+import * as QRCode from "qrcode";
+//#region useQRCode/index.tsx
+/**
+* React port of VueUse's `useQRCode`.
+*
+* Map from @vueuse/integrations `useQRCode`
+* (`source/vueuse/packages/integrations/useQRCode/`), a reactive wrapper
+* around the `qrcode` package: it encodes `text` into a PNG data URL.
+*
+* Adjustment for React:
+* - upstream returns a `shallowRef<string>` holding the data URL; in React the
+*   asynchronous result is state, so the hook returns the plain `string` data
+*   URL directly (no `.value`, no tuple) — `''` until the first encode
+*   resolves. Exactly like upstream, an empty `text` never encodes, so the
+*   previous data URL is kept (it is not cleared);
+* - `text` is the hook's **read-only value source** and takes a plain string
+*   (upstream: `MaybeRefOrGetter<string>`); a changed `text` prop re-encodes
+*   on the next render;
+* - the encode is `await`-free but guarded by a `cancelled` flag: when `text`
+*   (or `options`) changes or the component unmounts while an encode is still
+*   pending, the stale promise is ignored, so the last write always wins;
+* - **pass a memoized `options` object** (`useMemo`/module constant). React has
+*   no dependency-tracking equivalent of Vue's `watch` source, so `options` is
+*   compared by identity: a fresh literal on every render re-runs the effect
+*   and re-encodes the QR code. Options are deliberately not serialized — they
+*   may contain non-JSON values (`toSJISFunc`, `color` functions…), which
+*   serialization would break.
+*
+* @__NO_SIDE_EFFECTS__
+* @see https://vueuse.org/useQRCode
+* @param text - the text to encode (plain string)
+* @param options - `qrcode` `toDataURL` options, memoized by the caller
+* @example
+* const qrcode = useQRCode('https://vueuse.org')
+* qrcode // '' at first, then 'data:image/png;base64,…'
+*/
+function useQRCode(text, options) {
+	const value = text;
+	const [result, setResult] = useState("");
+	useEffect(() => {
+		if (!value || !isClient) return;
+		let cancelled = false;
+		QRCode.toDataURL(value, options).then((url) => {
+			if (!cancelled) setResult(url);
+		});
+		return () => {
+			cancelled = true;
+		};
+	}, [value, options]);
+	return result;
+}
+//#endregion
+export { useQRCode };