@crimson_dev/use-resize-observer 0.1.1

package/dist/types-ASPFw2w_.d.ts

@@ -0,0 +1,49 @@
+
+import { RefObject } from "react";
+
+//#region src/types.d.ts
+/** Callback invoked with a ResizeObserverEntry on each resize. */
+type ResizeCallback = (entry: ResizeObserverEntry) => void;
+/** Box model options for ResizeObserver observation. */
+type ResizeObserverBoxOptions = "border-box" | "content-box" | "device-pixel-content-box";
+/** Options for the `useResizeObserver` hook. */
+interface UseResizeObserverOptions<T extends Element = Element> {
+  /** Pre-existing ref to observe. If omitted, an internal ref is created. */
+  ref?: RefObject<T | null>;
+  /** Which box model to report. @default 'content-box' */
+  box?: ResizeObserverBoxOptions;
+  /** Document or ShadowRoot scoping the pool. @default target.ownerDocument */
+  root?: Document | ShadowRoot;
+  /**
+  * Called on every resize event. Identity is stable across renders
+  * (powered by useEffectEvent) — do NOT wrap in useCallback.
+  */
+  onResize?: (entry: ResizeObserverEntry) => void;
+}
+/** Return value of the `useResizeObserver` hook. */
+interface UseResizeObserverResult<T extends Element = Element> {
+  /** Attach this ref to the element you want to observe. */
+  ref: RefObject<T | null>;
+  /** Inline size of the observed box. undefined until first observation. */
+  width: number | undefined;
+  /** Block size of the observed box. undefined until first observation. */
+  height: number | undefined;
+  /** The raw ResizeObserverEntry. undefined until first observation. */
+  entry: ResizeObserverEntry | undefined;
+}
+/** Options for the `createResizeObserver` factory. */
+interface CreateResizeObserverOptions {
+  /** Which box model to report. @default 'content-box' */
+  box?: ResizeObserverBoxOptions;
+  /** Document or ShadowRoot scoping the pool. @default document */
+  root?: Document | ShadowRoot;
+}
+/** Return type for the `createResizeObserver` factory. */
+interface ResizeObserverFactory {
+  observe(target: Element, callback: ResizeCallback): void;
+  unobserve(target: Element, callback: ResizeCallback): void;
+  disconnect(): void;
+}
+//#endregion
+export { UseResizeObserverOptions as a, ResizeObserverFactory as i, ResizeCallback as n, UseResizeObserverResult as o, ResizeObserverBoxOptions as r, CreateResizeObserverOptions as t };
+//# sourceMappingURL=types-ASPFw2w_.d.ts.map

package/dist/types-ASPFw2w_.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types-ASPFw2w_.d.ts","names":[],"sources":["../src/types.ts"],"mappings":";;;;;KAGY,cAAA,IAAkB,KAAA,EAAO,mBAAA;AAArC;AAAA,KAGY,wBAAA;;UAGK,wBAAA,WAAmC,OAAA,GAAU,OAAA;EANzB;EAQnC,GAAA,GAAM,SAAA,CAAU,CAAA;EALN;EAOV,GAAA,GAAM,wBAAA;EAPI;EASV,IAAA,GAAO,QAAA,GAAW,UAAA;EANpB;;;;EAWE,QAAA,IAAY,KAAA,EAAO,mBAAA;AAAA;;UAIJ,uBAAA,WAAkC,OAAA,GAAU,OAAA;;EAE3D,GAAA,EAAK,SAAA,CAAU,CAAA;;EAEf,KAAA;EARmB;EAUnB,MAAA;;EAEA,KAAA,EAAO,mBAAA;AAAA;;UAIQ,2BAAA;;EAEf,GAAA,GAAM,wBAAA;;EAEN,IAAA,GAAO,QAAA,GAAW,UAAA;AAAA;;UAIH,qBAAA;EACf,OAAA,CAAQ,MAAA,EAAQ,OAAA,EAAS,QAAA,EAAU,cAAA;EACnC,SAAA,CAAU,MAAA,EAAQ,OAAA,EAAS,QAAA,EAAU,cAAA;EACrC,UAAA;AAAA"}

package/dist/worker.d.ts

@@ -0,0 +1,103 @@
+
+import { o as UseResizeObserverResult, r as ResizeObserverBoxOptions } from "./types-ASPFw2w_.js";
+import { RefObject } from "react";
+
+//#region src/worker/hook.d.ts
+/** Options for the Worker-based resize observer hook. */
+interface UseResizeObserverWorkerOptions<T extends Element = Element> {
+  /** Pre-existing ref to observe. If omitted, an internal ref is created. */
+  ref?: RefObject<T | null>;
+  /** Which box model to report. @default 'content-box' */
+  box?: ResizeObserverBoxOptions;
+  /**
+  * Called on every resize event. Identity is stable across renders
+  * (powered by ref pattern) — do NOT wrap in useCallback.
+  */
+  onResize?: (dimensions: {
+    readonly width: number;
+    readonly height: number;
+  }) => void;
+}
+/**
+* Worker-based resize observer hook.
+*
+* Moves all `ResizeObserver` measurement off the main thread using
+* `SharedArrayBuffer` + `Float16Array` + `Atomics`.
+*
+* Requires `crossOriginIsolated === true` (COOP/COEP headers).
+*
+* @param options - Configuration options.
+* @returns Ref, width, height, and raw entry (entry is `undefined` in Worker mode).
+*/
+declare const useResizeObserverWorker: <T extends Element = Element>(options?: UseResizeObserverWorkerOptions<T>) => UseResizeObserverResult<T>;
+//#endregion
+//#region src/worker/protocol.d.ts
+/**
+* SharedArrayBuffer protocol for Worker-based resize observations.
+*
+* Layout:
+* - 4 Float16 values per element slot (2 bytes each = 8 bytes per slot)
+* - Int32Array overlay for `Atomics.notify()` / `Atomics.waitAsync()` synchronization
+* - Supports up to 256 simultaneous element observations
+*
+* @internal
+*/
+/** Bytes per observation slot: 4 x Float16 (2 bytes each) = 8 bytes. */
+declare const SLOT_BYTES: number;
+/** Maximum number of simultaneously observable elements. */
+declare const MAX_ELEMENTS: number;
+/** Total SharedArrayBuffer size in bytes. */
+declare const SAB_SIZE: number;
+/** Offsets within a single Float16Array slot. */
+declare const SlotOffset: {
+  readonly InlineSize: 0;
+  readonly BlockSize: 1;
+  readonly BorderInline: 2;
+  readonly BorderBlock: 3;
+};
+type SlotOffsetKey = keyof typeof SlotOffset;
+/** Discriminated union of all Worker protocol messages. */
+type WorkerMessage = {
+  readonly op: "init";
+  readonly sab: SharedArrayBuffer;
+} | {
+  readonly op: "observe";
+  readonly slotId: number;
+  readonly elementId: string;
+} | {
+  readonly op: "unobserve";
+  readonly slotId: number;
+} | {
+  readonly op: "terminate";
+} | {
+  readonly op: "ready";
+} | {
+  readonly op: "error";
+  readonly message: string;
+};
+/**
+* Write resize measurements into a SharedArrayBuffer slot.
+* Uses `Float16Array` (ES2026) for compact storage and
+* `Atomics.notify()` for cross-thread signaling.
+*
+* @param sab - SharedArrayBuffer backing the measurement protocol.
+* @param slotId - Zero-based slot index for this element.
+* @param entry - ResizeObserverEntry from the Worker's observer.
+*/
+declare const writeSlot: (sab: SharedArrayBuffer, slotId: number, entry: ResizeObserverEntry) => void;
+/**
+* Read resize measurements from a SharedArrayBuffer slot.
+*
+* @param sab - SharedArrayBuffer backing the measurement protocol.
+* @param slotId - Zero-based slot index for this element.
+* @returns Measurement object with width, height, and border dimensions.
+*/
+declare const readSlot: (sab: SharedArrayBuffer, slotId: number) => {
+  readonly width: number;
+  readonly height: number;
+  readonly borderWidth: number;
+  readonly borderHeight: number;
+};
+//#endregion
+export { MAX_ELEMENTS, SAB_SIZE, SLOT_BYTES, type SlotOffsetKey, type UseResizeObserverWorkerOptions, type WorkerMessage, readSlot, useResizeObserverWorker, writeSlot };
+//# sourceMappingURL=worker.d.ts.map

package/dist/worker.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"worker.d.ts","names":[],"sources":["../src/worker/hook.ts","../src/worker/protocol.ts"],"mappings":";;;;;;UAUiB,8BAAA,WAAyC,OAAA,GAAU,OAAA;EAApE;EAEE,GAAA,GAAM,SAAA,CAAU,CAAA;;EAEhB,GAAA,GAAM,wBAAA;;;;;EAKN,QAAA,IAAY,UAAA;IAAA,SAAuB,KAAA;IAAA,SAAwB,MAAA;EAAA;AAAA;;;;;;;;;;;;cAsFhD,uBAAA,aAAqC,OAAA,GAAU,OAAA,EAC1D,OAAA,GAAS,8BAAA,CAA+B,CAAA,MACvC,uBAAA,CAAwB,CAAA;;;;;;;AAjG3B;;;;;;;cCEa,UAAA;;cAGA,YAAA;;cAGA,QAAA;;cAGA,UAAA;EAAA,SACX,UAAA;EAAA,SACA,SAAA;EAAA,SACA,YAAA;EAAA,SACA,WAAA;AAAA;AAAA,KAGU,aAAA,gBAA6B,UAAA;;KAG7B,aAAA;EAAA,SACG,EAAA;EAAA,SAAqB,GAAA,EAAK,iBAAA;AAAA;EAAA,SAC1B,EAAA;EAAA,SAAwB,MAAA;EAAA,SAAyB,SAAA;AAAA;EAAA,SACjD,EAAA;EAAA,SAA0B,MAAA;AAAA;EAAA,SAC1B,EAAA;AAAA;EAAA,SACA,EAAA;AAAA;EAAA,SACA,EAAA;EAAA,SAAsB,OAAA;AAAA;;;;;;;;;;cAWxB,SAAA,GACX,GAAA,EAAK,iBAAA,EACL,MAAA,UACA,KAAA,EAAO,mBAAA;;;;;AApCT;;;cAwDa,QAAA,GACX,GAAA,EAAK,iBAAA,EACL,MAAA;EAAA,SAES,KAAA;EAAA,SACA,MAAA;EAAA,SACA,WAAA;EAAA,SACA,YAAA;AAAA"}

package/dist/worker.js

@@ -0,0 +1,222 @@
+'use client';
+'use client';
+
+import { useEffect, useRef, useState } from "react";
+
+//#region src/worker/protocol.ts
+/**
+* SharedArrayBuffer protocol for Worker-based resize observations.
+*
+* Layout:
+* - 4 Float16 values per element slot (2 bytes each = 8 bytes per slot)
+* - Int32Array overlay for `Atomics.notify()` / `Atomics.waitAsync()` synchronization
+* - Supports up to 256 simultaneous element observations
+*
+* @internal
+*/
+/** Bytes per observation slot: 4 x Float16 (2 bytes each) = 8 bytes. */
+const SLOT_BYTES = 8;
+/** Maximum number of simultaneously observable elements. */
+const MAX_ELEMENTS = 256;
+/** Total SharedArrayBuffer size in bytes. */
+const SAB_SIZE = SLOT_BYTES * MAX_ELEMENTS;
+/** Offsets within a single Float16Array slot. */
+const SlotOffset = {
+	InlineSize: 0,
+	BlockSize: 1,
+	BorderInline: 2,
+	BorderBlock: 3
+};
+/**
+* Write resize measurements into a SharedArrayBuffer slot.
+* Uses `Float16Array` (ES2026) for compact storage and
+* `Atomics.notify()` for cross-thread signaling.
+*
+* @param sab - SharedArrayBuffer backing the measurement protocol.
+* @param slotId - Zero-based slot index for this element.
+* @param entry - ResizeObserverEntry from the Worker's observer.
+*/
+const writeSlot = (sab, slotId, entry) => {
+	const view = new Float16Array(sab, slotId * SLOT_BYTES, 4);
+	const cs = entry.contentBoxSize[0];
+	const bs = entry.borderBoxSize[0];
+	view[SlotOffset.InlineSize] = cs?.inlineSize ?? 0;
+	view[SlotOffset.BlockSize] = cs?.blockSize ?? 0;
+	view[SlotOffset.BorderInline] = bs?.inlineSize ?? 0;
+	view[SlotOffset.BorderBlock] = bs?.blockSize ?? 0;
+	Atomics.notify(new Int32Array(sab), slotId, 1);
+};
+/**
+* Read resize measurements from a SharedArrayBuffer slot.
+*
+* @param sab - SharedArrayBuffer backing the measurement protocol.
+* @param slotId - Zero-based slot index for this element.
+* @returns Measurement object with width, height, and border dimensions.
+*/
+const readSlot = (sab, slotId) => {
+	const view = new Float16Array(sab, slotId * SLOT_BYTES, 4);
+	return {
+		width: view[SlotOffset.InlineSize] ?? 0,
+		height: view[SlotOffset.BlockSize] ?? 0,
+		borderWidth: view[SlotOffset.BorderInline] ?? 0,
+		borderHeight: view[SlotOffset.BorderBlock] ?? 0
+	};
+};
+/**
+* Allocate a slot from the bitmap tracker.
+* Scans for the first unallocated slot in O(n) worst case.
+*
+* @param bitmap - Int32Array tracking allocated slots (1 = in use).
+* @returns The allocated slot index, or -1 if all slots are in use.
+*/
+const allocateSlot = (bitmap) => {
+	for (let i = 0; i < MAX_ELEMENTS; i++) if (bitmap[i] === 0) {
+		bitmap[i] = 1;
+		return i;
+	}
+	return -1;
+};
+/**
+* Release a slot back to the bitmap tracker.
+*
+* @param bitmap - Int32Array tracking allocated slots.
+* @param slotId - The slot index to release.
+*/
+const releaseSlot = (bitmap, slotId) => {
+	if (slotId >= 0 && slotId < MAX_ELEMENTS) bitmap[slotId] = 0;
+};
+
+//#endregion
+//#region src/worker/hook.ts
+/** Shared Worker instance — lazy-initialized, lives until last observer unmounts. */
+let sharedWorker = null;
+let sharedSab = null;
+const slotBitmap = new Int32Array(MAX_ELEMENTS);
+let activeObserverCount = 0;
+let workerReady = false;
+/** Promise that resolves when the Worker is initialized and ready. */
+let initPromise = null;
+/**
+* Lazily initialize the shared Worker with `Promise.withResolvers()` (ES2024+).
+* Uses `Error.isError()` (ES2026) for robust error discrimination.
+*/
+const ensureWorker = () => {
+	if (initPromise) return initPromise;
+	const { promise, resolve, reject } = Promise.withResolvers();
+	initPromise = promise;
+	Promise.try(() => {
+		if (!globalThis.crossOriginIsolated) throw new Error("[@crimson_dev/use-resize-observer/worker] crossOriginIsolated is false. Worker mode requires COOP/COEP headers. See: https://developer.mozilla.org/en-US/docs/Web/API/crossOriginIsolated");
+		sharedSab = new SharedArrayBuffer(SAB_SIZE);
+		const workerUrl = new URL("./worker.js", import.meta.url);
+		sharedWorker = new Worker(workerUrl, { type: "module" });
+		sharedWorker.addEventListener("message", (event) => {
+			if (event.data.op === "ready") {
+				workerReady = true;
+				resolve();
+			} else if (event.data.op === "error") reject(new Error(event.data.message));
+		});
+		sharedWorker.addEventListener("error", (event) => {
+			const errorMessage = event instanceof ErrorEvent ? event.message : "Worker error";
+			reject(new Error(errorMessage));
+			sharedWorker = null;
+			initPromise = null;
+			workerReady = false;
+		});
+		sharedWorker.postMessage({
+			op: "init",
+			sab: sharedSab
+		});
+	}).catch((error) => {
+		reject(Error.isError(error) ? error : new Error(String(error)));
+	});
+	return promise;
+};
+const terminateWorkerIfIdle = () => {
+	if (activeObserverCount === 0 && sharedWorker) {
+		sharedWorker.postMessage({ op: "terminate" });
+		sharedWorker.terminate();
+		sharedWorker = null;
+		sharedSab = null;
+		initPromise = null;
+		workerReady = false;
+		slotBitmap.fill(0);
+	}
+};
+/**
+* Worker-based resize observer hook.
+*
+* Moves all `ResizeObserver` measurement off the main thread using
+* `SharedArrayBuffer` + `Float16Array` + `Atomics`.
+*
+* Requires `crossOriginIsolated === true` (COOP/COEP headers).
+*
+* @param options - Configuration options.
+* @returns Ref, width, height, and raw entry (entry is `undefined` in Worker mode).
+*/
+const useResizeObserverWorker = (options = {}) => {
+	const { ref: externalRef, onResize } = options;
+	const internalRef = useRef(null);
+	const targetRef = externalRef ?? internalRef;
+	const [width, setWidth] = useState(void 0);
+	const [height, setHeight] = useState(void 0);
+	const onResizeRef = useRef(onResize);
+	onResizeRef.current = onResize;
+	useEffect(() => {
+		const element = targetRef.current;
+		if (!element) return;
+		const slotId = allocateSlot(slotBitmap);
+		if (slotId === -1) {
+			console.error(`[@crimson_dev/use-resize-observer/worker] Maximum ${String(MAX_ELEMENTS)} simultaneous observations exceeded.`);
+			return;
+		}
+		activeObserverCount++;
+		let cancelled = false;
+		let rafId = null;
+		const startPolling = () => {
+			const poll = () => {
+				if (cancelled || !sharedSab) return;
+				const { width: w, height: h } = readSlot(sharedSab, slotId);
+				setWidth(w);
+				setHeight(h);
+				onResizeRef.current?.({
+					width: w,
+					height: h
+				});
+				rafId = requestAnimationFrame(poll);
+			};
+			rafId = requestAnimationFrame(poll);
+		};
+		ensureWorker().then(() => {
+			if (cancelled) return;
+			sharedWorker?.postMessage({
+				op: "observe",
+				slotId,
+				elementId: element.id || `slot-${String(slotId)}`
+			});
+			startPolling();
+		}).catch((error) => {
+			console.error("[@crimson_dev/use-resize-observer/worker] Init failed:", error);
+		});
+		return () => {
+			cancelled = true;
+			if (rafId !== null) cancelAnimationFrame(rafId);
+			if (workerReady && sharedWorker) sharedWorker.postMessage({
+				op: "unobserve",
+				slotId
+			});
+			releaseSlot(slotBitmap, slotId);
+			activeObserverCount--;
+			terminateWorkerIfIdle();
+		};
+	}, [targetRef]);
+	return {
+		ref: targetRef,
+		width,
+		height,
+		entry: void 0
+	};
+};
+
+//#endregion
+export { MAX_ELEMENTS, SAB_SIZE, SLOT_BYTES, readSlot, useResizeObserverWorker, writeSlot };
+//# sourceMappingURL=worker.js.map

package/dist/worker.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"worker.js","names":[],"sources":["../src/worker/protocol.ts","../src/worker/hook.ts"],"sourcesContent":["/**\n * SharedArrayBuffer protocol for Worker-based resize observations.\n *\n * Layout:\n * - 4 Float16 values per element slot (2 bytes each = 8 bytes per slot)\n * - Int32Array overlay for `Atomics.notify()` / `Atomics.waitAsync()` synchronization\n * - Supports up to 256 simultaneous element observations\n *\n * @internal\n */\n\n/** Bytes per observation slot: 4 x Float16 (2 bytes each) = 8 bytes. */\nexport const SLOT_BYTES: number = 8;\n\n/** Maximum number of simultaneously observable elements. */\nexport const MAX_ELEMENTS: number = 256;\n\n/** Total SharedArrayBuffer size in bytes. */\nexport const SAB_SIZE: number = SLOT_BYTES * MAX_ELEMENTS;\n\n/** Offsets within a single Float16Array slot. */\nexport const SlotOffset = {\n  InlineSize: 0,\n  BlockSize: 1,\n  BorderInline: 2,\n  BorderBlock: 3,\n} as const;\n\nexport type SlotOffsetKey = keyof typeof SlotOffset;\n\n/** Discriminated union of all Worker protocol messages. */\nexport type WorkerMessage =\n  | { readonly op: 'init'; readonly sab: SharedArrayBuffer }\n  | { readonly op: 'observe'; readonly slotId: number; readonly elementId: string }\n  | { readonly op: 'unobserve'; readonly slotId: number }\n  | { readonly op: 'terminate' }\n  | { readonly op: 'ready' }\n  | { readonly op: 'error'; readonly message: string };\n\n/**\n * Write resize measurements into a SharedArrayBuffer slot.\n * Uses `Float16Array` (ES2026) for compact storage and\n * `Atomics.notify()` for cross-thread signaling.\n *\n * @param sab - SharedArrayBuffer backing the measurement protocol.\n * @param slotId - Zero-based slot index for this element.\n * @param entry - ResizeObserverEntry from the Worker's observer.\n */\nexport const writeSlot = (\n  sab: SharedArrayBuffer,\n  slotId: number,\n  entry: ResizeObserverEntry,\n): void => {\n  const view = new Float16Array(sab, slotId * SLOT_BYTES, 4);\n  const cs = entry.contentBoxSize[0];\n  const bs = entry.borderBoxSize[0];\n  view[SlotOffset.InlineSize] = cs?.inlineSize ?? 0;\n  view[SlotOffset.BlockSize] = cs?.blockSize ?? 0;\n  view[SlotOffset.BorderInline] = bs?.inlineSize ?? 0;\n  view[SlotOffset.BorderBlock] = bs?.blockSize ?? 0;\n  // Signal main thread that new data is available\n  Atomics.notify(new Int32Array(sab), slotId, 1);\n};\n\n/**\n * Read resize measurements from a SharedArrayBuffer slot.\n *\n * @param sab - SharedArrayBuffer backing the measurement protocol.\n * @param slotId - Zero-based slot index for this element.\n * @returns Measurement object with width, height, and border dimensions.\n */\nexport const readSlot = (\n  sab: SharedArrayBuffer,\n  slotId: number,\n): {\n  readonly width: number;\n  readonly height: number;\n  readonly borderWidth: number;\n  readonly borderHeight: number;\n} => {\n  const view = new Float16Array(sab, slotId * SLOT_BYTES, 4);\n  return {\n    width: view[SlotOffset.InlineSize] ?? 0,\n    height: view[SlotOffset.BlockSize] ?? 0,\n    borderWidth: view[SlotOffset.BorderInline] ?? 0,\n    borderHeight: view[SlotOffset.BorderBlock] ?? 0,\n  };\n};\n\n/**\n * Allocate a slot from the bitmap tracker.\n * Scans for the first unallocated slot in O(n) worst case.\n *\n * @param bitmap - Int32Array tracking allocated slots (1 = in use).\n * @returns The allocated slot index, or -1 if all slots are in use.\n */\nexport const allocateSlot = (bitmap: Int32Array): number => {\n  for (let i = 0; i < MAX_ELEMENTS; i++) {\n    if (bitmap[i] === 0) {\n      bitmap[i] = 1;\n      return i;\n    }\n  }\n  return -1;\n};\n\n/**\n * Release a slot back to the bitmap tracker.\n *\n * @param bitmap - Int32Array tracking allocated slots.\n * @param slotId - The slot index to release.\n */\nexport const releaseSlot = (bitmap: Int32Array, slotId: number): void => {\n  if (slotId >= 0 && slotId < MAX_ELEMENTS) {\n    bitmap[slotId] = 0;\n  }\n};\n","'use client';\n\nimport type { RefObject } from 'react';\nimport { useEffect, useRef, useState } from 'react';\n\nimport type { ResizeObserverBoxOptions, UseResizeObserverResult } from '../types.js';\nimport type { WorkerMessage } from './protocol.js';\nimport { allocateSlot, MAX_ELEMENTS, readSlot, releaseSlot, SAB_SIZE } from './protocol.js';\n\n/** Options for the Worker-based resize observer hook. */\nexport interface UseResizeObserverWorkerOptions<T extends Element = Element> {\n  /** Pre-existing ref to observe. If omitted, an internal ref is created. */\n  ref?: RefObject<T | null>;\n  /** Which box model to report. @default 'content-box' */\n  box?: ResizeObserverBoxOptions;\n  /**\n   * Called on every resize event. Identity is stable across renders\n   * (powered by ref pattern) — do NOT wrap in useCallback.\n   */\n  onResize?: (dimensions: { readonly width: number; readonly height: number }) => void;\n}\n\n/** Shared Worker instance — lazy-initialized, lives until last observer unmounts. */\nlet sharedWorker: Worker | null = null;\nlet sharedSab: SharedArrayBuffer | null = null;\nconst slotBitmap = new Int32Array(MAX_ELEMENTS);\nlet activeObserverCount = 0;\nlet workerReady = false;\n\n/** Promise that resolves when the Worker is initialized and ready. */\nlet initPromise: Promise<void> | null = null;\n\n/**\n * Lazily initialize the shared Worker with `Promise.withResolvers()` (ES2024+).\n * Uses `Error.isError()` (ES2026) for robust error discrimination.\n */\nconst ensureWorker = (): Promise<void> => {\n  if (initPromise) return initPromise;\n\n  const { promise, resolve, reject } = Promise.withResolvers<void>();\n  initPromise = promise;\n\n  Promise.try(() => {\n    if (!globalThis.crossOriginIsolated) {\n      throw new Error(\n        '[@crimson_dev/use-resize-observer/worker] ' +\n          'crossOriginIsolated is false. Worker mode requires COOP/COEP headers. ' +\n          'See: https://developer.mozilla.org/en-US/docs/Web/API/crossOriginIsolated',\n      );\n    }\n\n    sharedSab = new SharedArrayBuffer(SAB_SIZE);\n    const workerUrl = new URL('./worker.js', import.meta.url);\n    sharedWorker = new Worker(workerUrl, { type: 'module' });\n\n    sharedWorker.addEventListener('message', (event: MessageEvent<WorkerMessage>) => {\n      if (event.data.op === 'ready') {\n        workerReady = true;\n        resolve();\n      } else if (event.data.op === 'error') {\n        reject(new Error(event.data.message));\n      }\n    });\n\n    sharedWorker.addEventListener('error', (event) => {\n      const errorMessage = event instanceof ErrorEvent ? event.message : 'Worker error';\n      reject(new Error(errorMessage));\n\n      // Auto-restart on crash\n      sharedWorker = null;\n      initPromise = null;\n      workerReady = false;\n    });\n\n    sharedWorker.postMessage({ op: 'init', sab: sharedSab } satisfies WorkerMessage);\n  }).catch((error: unknown) => {\n    reject(Error.isError(error) ? error : new Error(String(error)));\n  });\n\n  return promise;\n};\n\nconst terminateWorkerIfIdle = (): void => {\n  if (activeObserverCount === 0 && sharedWorker) {\n    sharedWorker.postMessage({ op: 'terminate' } satisfies WorkerMessage);\n    sharedWorker.terminate();\n    sharedWorker = null;\n    sharedSab = null;\n    initPromise = null;\n    workerReady = false;\n    slotBitmap.fill(0);\n  }\n};\n\n/**\n * Worker-based resize observer hook.\n *\n * Moves all `ResizeObserver` measurement off the main thread using\n * `SharedArrayBuffer` + `Float16Array` + `Atomics`.\n *\n * Requires `crossOriginIsolated === true` (COOP/COEP headers).\n *\n * @param options - Configuration options.\n * @returns Ref, width, height, and raw entry (entry is `undefined` in Worker mode).\n */\nexport const useResizeObserverWorker = <T extends Element = Element>(\n  options: UseResizeObserverWorkerOptions<T> = {},\n): UseResizeObserverResult<T> => {\n  const { ref: externalRef, onResize } = options;\n\n  const internalRef = useRef<T | null>(null);\n  const targetRef = externalRef ?? internalRef;\n\n  const [width, setWidth] = useState<number | undefined>(undefined);\n  const [height, setHeight] = useState<number | undefined>(undefined);\n\n  const onResizeRef = useRef(onResize);\n  onResizeRef.current = onResize;\n\n  useEffect(() => {\n    const element = targetRef.current;\n    if (!element) return;\n\n    const slotId = allocateSlot(slotBitmap);\n    if (slotId === -1) {\n      console.error(\n        `[@crimson_dev/use-resize-observer/worker] ` +\n          `Maximum ${String(MAX_ELEMENTS)} simultaneous observations exceeded.`,\n      );\n      return;\n    }\n\n    activeObserverCount++;\n    let cancelled = false;\n    let rafId: number | null = null;\n\n    const startPolling = (): void => {\n      const poll = (): void => {\n        if (cancelled || !sharedSab) return;\n\n        const { width: w, height: h } = readSlot(sharedSab, slotId);\n        setWidth(w);\n        setHeight(h);\n        onResizeRef.current?.({ width: w, height: h });\n        rafId = requestAnimationFrame(poll);\n      };\n      rafId = requestAnimationFrame(poll);\n    };\n\n    ensureWorker()\n      .then(() => {\n        if (cancelled) return;\n        sharedWorker?.postMessage({\n          op: 'observe',\n          slotId,\n          elementId: element.id || `slot-${String(slotId)}`,\n        } satisfies WorkerMessage);\n        startPolling();\n      })\n      .catch((error: unknown) => {\n        console.error('[@crimson_dev/use-resize-observer/worker] Init failed:', error);\n      });\n\n    return () => {\n      cancelled = true;\n      if (rafId !== null) cancelAnimationFrame(rafId);\n\n      if (workerReady && sharedWorker) {\n        sharedWorker.postMessage({\n          op: 'unobserve',\n          slotId,\n        } satisfies WorkerMessage);\n      }\n\n      releaseSlot(slotBitmap, slotId);\n      activeObserverCount--;\n      terminateWorkerIfIdle();\n    };\n  }, [targetRef]);\n\n  return { ref: targetRef, width, height, entry: undefined };\n};\n"],"mappings":"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"}

package/package.json

@@ -0,0 +1,129 @@
+{
+  "name": "@crimson_dev/use-resize-observer",
+  "version": "0.1.1",
+  "description": "Zero-dependency, Worker-native, ESNext-first React 19 ResizeObserver hook",
+  "type": "module",
+  "sideEffects": false,
+  "license": "MIT",
+  "author": {
+    "name": "Crimson Dev",
+    "url": "https://github.com/ABCrimson"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/ABCrimson/use-resize-observer.git"
+  },
+  "keywords": [
+    "react",
+    "hook",
+    "resize",
+    "ResizeObserver",
+    "typescript",
+    "esm",
+    "worker",
+    "performance"
+  ],
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
+    },
+    "./worker": {
+      "types": "./dist/worker.d.ts",
+      "import": "./dist/worker.js"
+    },
+    "./shim": {
+      "types": "./dist/shim.d.ts",
+      "import": "./dist/shim.js"
+    },
+    "./server": {
+      "types": "./dist/server.d.ts",
+      "import": "./dist/server.js"
+    },
+    "./core": {
+      "types": "./dist/core.d.ts",
+      "import": "./dist/core.js"
+    },
+    "./package.json": "./package.json"
+  },
+  "main": "./dist/index.js",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "files": [
+    "dist",
+    "README.md",
+    "LICENSE",
+    "CHANGELOG.md"
+  ],
+  "engines": {
+    "node": ">=25.0.0"
+  },
+  "peerDependencies": {
+    "react": ">=19.3.0"
+  },
+  "peerDependenciesMeta": {
+    "react": {
+      "optional": false
+    }
+  },
+  "devDependencies": {
+    "@biomejs/biome": "2.4.5",
+    "@changesets/cli": "2.30.0",
+    "@size-limit/preset-small-lib": "12.0.0",
+    "@testing-library/dom": "^10.4.1",
+    "@testing-library/react": "16.3.2",
+    "@testing-library/user-event": "14.6.1",
+    "@types/react": "19.2.14",
+    "@types/react-dom": "19.2.3",
+    "@typescript/native-preview": "7.0.0-dev.20260305.1",
+    "@vitejs/plugin-react": "4.5.0",
+    "@vitest/browser-playwright": "4.1.0-beta.5",
+    "@vitest/coverage-v8": "4.1.0-beta.5",
+    "@vitest/ui": "4.1.0-beta.5",
+    "concurrently": "9.2.1",
+    "happy-dom": "20.8.3",
+    "playwright": "1.59.0-alpha-2026-03-05",
+    "publint": "0.3.0",
+    "react": "19.3.0-canary-3bc2d414-20260304",
+    "react-dom": "19.3.0-canary-3bc2d414-20260304",
+    "shiki": "4.0.1",
+    "simple-git-hooks": "2.13.1",
+    "size-limit": "12.0.0",
+    "svgo": "4.0.1",
+    "tinybench": "6.0.0",
+    "tsdown": "0.21.0-beta.5",
+    "tsx": "4.21.0",
+    "typedoc": "0.28.17",
+    "typedoc-plugin-markdown": "4.10.0",
+    "typedoc-vitepress-theme": "1.1.2",
+    "typescript": "6.0.0-dev.20260305",
+    "vitepress": "2.0.0-alpha.16",
+    "vitepress-plugin-mermaid": "2.0.17",
+    "vitest": "4.1.0-beta.5"
+  },
+  "simple-git-hooks": {
+    "pre-commit": "npx @biomejs/biome check --staged"
+  },
+  "scripts": {
+    "build": "tsdown",
+    "dev": "tsdown --watch",
+    "lint": "biome check ./src ./tests ./bench",
+    "format": "biome check --write ./src ./tests ./bench",
+    "typecheck": "tsc --noEmit",
+    "typecheck:ts7": "tsgo --noEmit",
+    "test": "vitest run",
+    "test:watch": "vitest",
+    "test:browser": "vitest run --project browser:chromium --project browser:firefox --project browser:webkit",
+    "test:coverage": "vitest run --coverage",
+    "bench": "tsx bench/pool.ts && tsx bench/scheduler.ts && tsx bench/hook.ts && tsx bench/worker.ts && tsx bench/memory.ts",
+    "publint": "publint",
+    "size": "size-limit",
+    "docs:dev": "vitepress dev docs",
+    "docs:build": "typedoc && vitepress build docs",
+    "docs:preview": "vitepress preview docs",
+    "release": "changeset publish --provenance",
+    "version": "changeset version",
+    "optimize-svgs": "tsx scripts/optimize-svgs.ts",
+    "prepare": "simple-git-hooks"
+  }
+}