@journ/lift 0.1.0 → 0.2.0

package/dist/use-haptic.d.ts

@@ -0,0 +1,8 @@
+//#region src/use-haptic.d.ts
+type Duration = number | number[];
+declare const supportsHaptics: boolean;
+declare const useHaptic: () => ((duration?: Duration) => void);
+declare const useHapticsError: () => (() => void);
+declare const useHapticsConfirm: () => (() => void);
+//#endregion
+export { supportsHaptics, useHaptic, useHapticsConfirm, useHapticsError };

package/dist/use-haptic.js

@@ -0,0 +1,84 @@
+import { n as tryCatchSync } from "./try-catch-D4d3N9_W.js";
+import { t as isServerSide } from "./env-C0PNnbwt.js";
+import { t as logger } from "./logger-Dse1660l.js";
+import { useCallback, useEffect, useRef } from "react";
+//#region src/use-haptic.ts
+const supportsVibrate = () => typeof navigator !== "undefined" && "vibrate" in navigator;
+const supportsIOSSwitch = () => {
+	if (typeof document === "undefined") return false;
+	const result = tryCatchSync(() => {
+		const input = document.createElement("input");
+		input.setAttribute("switch", "");
+		return input.getAttribute("switch") !== null;
+	});
+	return result.success && result.data;
+};
+const supportsHaptics = !isServerSide() && (supportsVibrate() || supportsIOSSwitch());
+const logFailure = (label, fn) => {
+	const result = tryCatchSync(fn);
+	if (!result.success) logger.error(label, result.error);
+};
+const appendHidden = (tag) => {
+	const element = document.createElement(tag);
+	Object.assign(element.style, {
+		position: "absolute",
+		opacity: "0",
+		pointerEvents: "none"
+	});
+	document.body.appendChild(element);
+	return element;
+};
+const triggerIOSHaptic = () => logFailure("Error triggering iOS haptic:", () => {
+	const id = `_h${Math.random().toString(36).slice(2)}`;
+	const input = appendHidden("input");
+	input.type = "checkbox";
+	input.id = id;
+	input.setAttribute("switch", "");
+	const label = appendHidden("label");
+	label.htmlFor = id;
+	label.click();
+	label.remove();
+	input.remove();
+});
+const dispatchHaptic = (duration = 50) => {
+	if (supportsVibrate()) {
+		navigator.vibrate(duration);
+		return;
+	}
+	if (Array.isArray(duration)) {
+		for (const d of duration) setTimeout(triggerIOSHaptic, Math.max(d, 101));
+		return;
+	}
+	triggerIOSHaptic();
+};
+const useHaptic = () => dispatchHaptic;
+const useHapticsError = () => {
+	const triggerHaptic = useHaptic();
+	const timerIds = useRef([]);
+	useEffect(() => () => {
+		for (const id of timerIds.current) clearTimeout(id);
+		timerIds.current = [];
+	}, []);
+	return useCallback(() => logFailure("Error triggering error haptic:", () => {
+		if (supportsVibrate()) {
+			triggerHaptic([
+				40,
+				60,
+				40,
+				60,
+				40,
+				60,
+				40
+			]);
+			return;
+		}
+		triggerHaptic();
+		timerIds.current.push(setTimeout(() => triggerHaptic(), 100), setTimeout(() => triggerHaptic(), 200), setTimeout(() => triggerHaptic(), 300));
+	}), [triggerHaptic]);
+};
+const useHapticsConfirm = () => {
+	const triggerHaptic = useHaptic();
+	return useCallback(() => logFailure("Error triggering confirm haptic:", () => triggerHaptic([100])), [triggerHaptic]);
+};
+//#endregion
+export { supportsHaptics, useHaptic, useHapticsConfirm, useHapticsError };

package/dist/use-headroom.d.ts

@@ -0,0 +1,18 @@
+//#region src/use-headroom.d.ts
+type UseHeadroomInput = {
+  fixedAt?: number;
+  scrollDistance?: number;
+  onPin?: () => void;
+  onFix?: () => void;
+  onRelease?: () => void;
+};
+type UseHeadroomReturnValue = {
+  pinned: boolean;
+  scrollProgress: number;
+};
+declare const isFixed: (current: number, fixedAt: number) => boolean;
+declare const isPinned: (current: number, previous: number) => boolean;
+declare const isReleased: (current: number, previous: number, fixedAt: number) => boolean;
+declare const useHeadroom: ({ fixedAt, scrollDistance, onPin, onFix, onRelease }?: UseHeadroomInput) => UseHeadroomReturnValue;
+//#endregion
+export { type UseHeadroomInput, type UseHeadroomReturnValue, isFixed, isPinned, isReleased, useHeadroom };

package/dist/use-headroom.js

@@ -0,0 +1,65 @@
+import { useIsomorphicEffect } from "./use-isomorphic-effect.js";
+import { useScrollDirection } from "./use-scroll-direction.js";
+import { useWindowScroll } from "./use-window-scroll.js";
+import { useEffectEvent, useRef, useState } from "react";
+import { clamp } from "@journ/fitter-happier/clamp";
+//#region src/use-headroom.ts
+const isFixed = (current, fixedAt) => current <= fixedAt;
+const isPinned = (current, previous) => current <= previous;
+const isReleased = (current, previous, fixedAt) => !isPinned(current, previous) && !isFixed(current, fixedAt);
+const progressFrom = ({ isScrollingUp, scrollY, progress }, scrollPosition, scrollDistance) => {
+	const delta = Math.abs(scrollPosition - scrollY) / scrollDistance;
+	return clamp(progress + (isScrollingUp ? delta : -delta), 0, 1);
+};
+const advanceAnchor = (anchor, scrollPosition, previousPosition, fixedAt, isScrollingUp, scrollDistance) => {
+	const fixed = isFixed(scrollPosition, fixedAt);
+	if (anchor.fixed !== fixed) return {
+		fixed,
+		isScrollingUp,
+		scrollY: fixed ? scrollPosition : fixedAt,
+		progress: 1
+	};
+	if (!fixed && anchor.isScrollingUp !== isScrollingUp) return {
+		fixed,
+		isScrollingUp,
+		scrollY: previousPosition,
+		progress: progressFrom(anchor, previousPosition, scrollDistance)
+	};
+	return anchor;
+};
+const useHeadroom = ({ fixedAt = 0, scrollDistance = 100, onPin, onFix, onRelease } = {}) => {
+	const isScrollingUp = useScrollDirection() === "up";
+	const [{ y: scrollPosition }] = useWindowScroll();
+	const fixed = isFixed(scrollPosition, fixedAt);
+	const [anchor, setAnchor] = useState({
+		fixed,
+		isScrollingUp,
+		scrollY: scrollPosition,
+		progress: fixed ? 1 : 0
+	});
+	const [previousPosition, setPreviousPosition] = useState(scrollPosition);
+	if (previousPosition !== scrollPosition) setPreviousPosition(scrollPosition);
+	const currentAnchor = advanceAnchor(anchor, scrollPosition, previousPosition, fixedAt, isScrollingUp, scrollDistance);
+	if (currentAnchor !== anchor) setAnchor(currentAnchor);
+	const scrollProgress = fixed ? 1 : progressFrom(currentAnchor, scrollPosition, scrollDistance);
+	const pinnedRef = useRef(false);
+	const onPinEvent = useEffectEvent(() => onPin?.());
+	const onReleaseEvent = useEffectEvent(() => onRelease?.());
+	const onFixEvent = useEffectEvent(() => onFix?.());
+	useIsomorphicEffect(() => {
+		const shouldBePinned = fixed || isScrollingUp;
+		if (shouldBePinned === pinnedRef.current) return;
+		pinnedRef.current = shouldBePinned;
+		if (shouldBePinned) onPinEvent();
+		else onReleaseEvent();
+	}, [fixed, isScrollingUp]);
+	useIsomorphicEffect(() => {
+		if (fixed) onFixEvent();
+	}, [fixed]);
+	return {
+		pinned: scrollProgress > 0,
+		scrollProgress
+	};
+};
+//#endregion
+export { isFixed, isPinned, isReleased, useHeadroom };

package/dist/use-idle-queue.d.ts

@@ -0,0 +1,28 @@
+//#region src/lib/idle-queue/idle-queue.d.ts
+/** The state captured when a task was queued, passed to it when it runs. */
+interface TaskState {
+  time: number;
+  visibilityState: DocumentVisibilityState;
+}
+type Task = (state: TaskState) => void;
+interface TaskOptions {
+  minTaskTime?: number;
+}
+//#endregion
+//#region src/use-idle-queue.d.ts
+type UseIdleQueueOptions = {
+  ensureTasksRun?: boolean;
+  minTaskTime?: number;
+  onError?: (error: unknown) => void;
+};
+type UseIdleQueueReturnValue = {
+  pushTask: (task: Task, options?: TaskOptions) => void;
+  unshiftTask: (task: Task, options?: TaskOptions) => void;
+  runTasksImmediately: () => void;
+  hasPendingTasks: () => boolean;
+  clearPendingTasks: () => void;
+  getState: () => TaskState | null;
+};
+declare const useIdleQueue: ({ ensureTasksRun, minTaskTime, onError }?: UseIdleQueueOptions) => UseIdleQueueReturnValue;
+//#endregion
+export { type UseIdleQueueOptions, type UseIdleQueueReturnValue, useIdleQueue };

package/dist/use-idle-queue.js

@@ -0,0 +1,221 @@
+import { useEffect, useEffectEvent, useMemo, useRef } from "react";
+//#region src/lib/idle-queue/idle-callback.ts
+/** The budget the shim reports, matching the spec's frame allowance. */
+const SHIM_BUDGET_MS = 50;
+const supportsRequestIdleCallback = () => typeof globalThis.requestIdleCallback === "function" && typeof globalThis.cancelIdleCallback === "function";
+const createIdleDeadline = (initTime) => ({
+	didTimeout: false,
+	timeRemaining: () => Math.max(0, SHIM_BUDGET_MS - (Date.now() - initTime))
+});
+const requestIdleCallbackShim = (callback) => {
+	const deadline = createIdleDeadline(Date.now());
+	return setTimeout(() => callback(deadline), 0);
+};
+const cancelIdleCallbackShim = (handle) => {
+	clearTimeout(handle);
+};
+/**
+* Requests an idle callback, falling back to a timeout where the API is
+* missing. Support is checked per call so the module stays importable under
+* SSR, where no global exists at load time.
+*/
+const rIC = (callback, options) => supportsRequestIdleCallback() ? globalThis.requestIdleCallback(callback, options) : requestIdleCallbackShim(callback);
+/** Cancels a callback scheduled by {@link rIC}. */
+const cIC = (handle) => {
+	if (supportsRequestIdleCallback()) globalThis.cancelIdleCallback(handle);
+	else cancelIdleCallbackShim(handle);
+};
+//#endregion
+//#region src/lib/idle-queue/queue-microtask.ts
+/** Rethrows asynchronously so a failing task cannot swallow the error. */
+const rethrowAsync = (error) => {
+	setTimeout(() => {
+		throw error;
+	}, 0);
+};
+const viaNativeQueueMicrotask = () => (microtask) => {
+	globalThis.queueMicrotask(() => {
+		try {
+			microtask();
+		} catch (error) {
+			rethrowAsync(error);
+		}
+	});
+};
+const viaPromise = () => (microtask) => {
+	Promise.resolve().then(() => {
+		try {
+			microtask();
+		} catch (error) {
+			rethrowAsync(error);
+		}
+	});
+};
+/** Last resort for engines predating both native scheduling paths. */
+const viaMutationObserver = () => {
+	let counter = 0;
+	let pending = [];
+	const node = document.createTextNode("");
+	new MutationObserver(() => {
+		const tasks = pending;
+		pending = [];
+		for (const microtask of tasks) try {
+			microtask();
+		} catch (error) {
+			rethrowAsync(error);
+		}
+	}).observe(node, { characterData: true });
+	return (microtask) => {
+		pending.push(microtask);
+		node.data = String(++counter % 2);
+	};
+};
+const selectScheduler = () => {
+	if (typeof globalThis.queueMicrotask === "function") return viaNativeQueueMicrotask();
+	if (typeof Promise === "function") return viaPromise();
+	return viaMutationObserver();
+};
+let scheduler = null;
+/**
+* Schedules a callback on the microtask queue, rethrowing failures instead of
+* turning them into unhandled rejections.
+*/
+const queueMicrotask = (microtask) => {
+	scheduler ??= selectScheduler();
+	scheduler(microtask);
+};
+//#endregion
+//#region src/lib/idle-queue/idle-queue.ts
+const DEFAULT_MIN_TASK_TIME = 0;
+const isBrowser = () => typeof window !== "undefined" && typeof document !== "undefined";
+const isSafari = () => isBrowser() && /^((?!chrome|android).)*safari/i.test(window.navigator.userAgent);
+const shouldYield = (deadline, minTaskTime) => !!deadline && deadline.timeRemaining() <= minTaskTime;
+const createTaskState = () => ({
+	time: Date.now(),
+	visibilityState: isBrowser() ? document.visibilityState : "visible"
+});
+const createIdleQueue = (options = {}) => {
+	const { ensureTasksRun = false, minTaskTime: defaultMinTaskTime = DEFAULT_MIN_TASK_TIME, onError } = options;
+	let taskQueue = [];
+	let idleCallbackHandle = null;
+	let isProcessing = false;
+	let currentState = null;
+	let isDestroyed = false;
+	const cancelScheduledRun = () => {
+		if (idleCallbackHandle !== null) {
+			cIC(idleCallbackHandle);
+			idleCallbackHandle = null;
+		}
+	};
+	const runTasks = (deadline) => {
+		cancelScheduledRun();
+		if (isProcessing) return;
+		isProcessing = true;
+		try {
+			while (taskQueue.length > 0 && !shouldYield(deadline, taskQueue[0]?.minTaskTime ?? 0)) {
+				const nextTask = taskQueue.shift();
+				if (!nextTask) break;
+				currentState = nextTask.state;
+				try {
+					nextTask.task(nextTask.state);
+				} catch (error) {
+					if (onError) onError(error, nextTask.state);
+					else setTimeout(() => {
+						throw error;
+					}, 0);
+				} finally {
+					currentState = null;
+				}
+			}
+		} finally {
+			isProcessing = false;
+		}
+		if (taskQueue.length > 0) scheduleTasksToRun();
+	};
+	const scheduleTasksToRun = () => {
+		if (isDestroyed) return;
+		if (ensureTasksRun && isBrowser() && document.visibilityState === "hidden") queueMicrotask(() => runTasks());
+		else if (idleCallbackHandle === null) idleCallbackHandle = rIC(runTasks);
+	};
+	const enqueue = (task, taskOptions = {}, position) => {
+		if (isDestroyed) return;
+		const { minTaskTime = defaultMinTaskTime } = taskOptions;
+		const queued = {
+			state: createTaskState(),
+			task,
+			minTaskTime
+		};
+		if (position === "start") taskQueue.unshift(queued);
+		else taskQueue.push(queued);
+		scheduleTasksToRun();
+	};
+	const runTasksImmediately = () => {
+		runTasks();
+	};
+	const onVisibilityChange = () => {
+		if (document.visibilityState === "hidden") runTasksImmediately();
+	};
+	const listensForUnload = ensureTasksRun && isBrowser();
+	const needsBeforeUnload = listensForUnload && isSafari();
+	if (listensForUnload) {
+		addEventListener("visibilitychange", onVisibilityChange, true);
+		if (needsBeforeUnload) addEventListener("beforeunload", runTasksImmediately, true);
+	}
+	return {
+		/** Queues a task to run after those already pending. */
+		pushTask: (task, taskOptions) => {
+			enqueue(task, taskOptions, "end");
+		},
+		/** Queues a task to run before those already pending. */
+		unshiftTask: (task, taskOptions) => {
+			enqueue(task, taskOptions, "start");
+		},
+		/** Runs every pending task now, ignoring the idle deadline. */
+		runTasksImmediately,
+		hasPendingTasks: () => taskQueue.length > 0,
+		clearPendingTasks: () => {
+			taskQueue = [];
+			cancelScheduledRun();
+		},
+		/** The state of the task currently running, or `null` between tasks. */
+		getState: () => currentState,
+		/** Drops pending tasks and detaches listeners. The queue is unusable after. */
+		destroy: () => {
+			isDestroyed = true;
+			taskQueue = [];
+			cancelScheduledRun();
+			if (listensForUnload) {
+				removeEventListener("visibilitychange", onVisibilityChange, true);
+				if (needsBeforeUnload) removeEventListener("beforeunload", runTasksImmediately, true);
+			}
+		}
+	};
+};
+//#endregion
+//#region src/use-idle-queue.ts
+const useIdleQueue = ({ ensureTasksRun = true, minTaskTime = 0, onError } = {}) => {
+	const queueRef = useRef(null);
+	const reportError = useEffectEvent((error) => onError?.(error));
+	useEffect(() => {
+		const queue = createIdleQueue({
+			ensureTasksRun,
+			minTaskTime,
+			onError: reportError
+		});
+		queueRef.current = queue;
+		return () => {
+			queue.destroy();
+			queueRef.current = null;
+		};
+	}, [ensureTasksRun, minTaskTime]);
+	return useMemo(() => ({
+		pushTask: (task, options) => queueRef.current?.pushTask(task, options),
+		unshiftTask: (task, options) => queueRef.current?.unshiftTask(task, options),
+		runTasksImmediately: () => queueRef.current?.runTasksImmediately(),
+		hasPendingTasks: () => queueRef.current?.hasPendingTasks() ?? false,
+		clearPendingTasks: () => queueRef.current?.clearPendingTasks(),
+		getState: () => queueRef.current?.getState() ?? null
+	}), []);
+};
+//#endregion
+export { useIdleQueue };

package/dist/use-intersection-observer.d.ts

@@ -0,0 +1,17 @@
+//#region src/use-intersection-observer.d.ts
+type UseIntersectionObserverOptions = {
+  root?: Element | Document | null;
+  rootMargin?: string;
+  threshold?: number | number[];
+  freezeOnceVisible?: boolean;
+  onChange?: (isIntersecting: boolean, entry: IntersectionObserverEntry) => void;
+  initialIsIntersecting?: boolean;
+};
+type IntersectionReturn = [(node?: Element | null) => void, boolean, IntersectionObserverEntry | undefined] & {
+  ref: (node?: Element | null) => void;
+  isIntersecting: boolean;
+  entry?: IntersectionObserverEntry;
+};
+declare const useIntersectionObserver: ({ threshold, root, rootMargin, freezeOnceVisible, initialIsIntersecting, onChange }?: UseIntersectionObserverOptions) => IntersectionReturn;
+//#endregion
+export { useIntersectionObserver };

package/dist/use-intersection-observer.js

@@ -0,0 +1,50 @@
+import { useCallback, useEffect, useEffectEvent, useState } from "react";
+//#region src/use-intersection-observer.ts
+const checkIntersecting = (entry, thresholds) => entry.isIntersecting && thresholds.some((threshold) => entry.intersectionRatio >= threshold);
+const useIntersectionObserver = ({ threshold = 0, root = null, rootMargin = "0%", freezeOnceVisible = false, initialIsIntersecting = false, onChange } = {}) => {
+	const [node, setNode] = useState(null);
+	const [state, setState] = useState({ isIntersecting: initialIsIntersecting });
+	const notify = useEffectEvent((isIntersecting, entry) => onChange?.(isIntersecting, entry));
+	const frozen = freezeOnceVisible && state.entry?.isIntersecting === true;
+	const thresholdKey = [threshold].flat().join(",");
+	useEffect(() => {
+		if (!node || frozen || !("IntersectionObserver" in window)) return;
+		const observer = new IntersectionObserver((entries) => {
+			for (const entry of entries) {
+				const isIntersecting = checkIntersecting(entry, observer.thresholds);
+				setState({
+					isIntersecting,
+					entry
+				});
+				notify(isIntersecting, entry);
+			}
+		}, {
+			threshold: thresholdKey.split(",").map(Number),
+			root,
+			rootMargin
+		});
+		observer.observe(node);
+		return () => observer.disconnect();
+	}, [
+		node,
+		frozen,
+		thresholdKey,
+		root,
+		rootMargin
+	]);
+	const ref = useCallback((next) => {
+		setNode(next ?? null);
+		if (!next && !freezeOnceVisible) setState({ isIntersecting: initialIsIntersecting });
+	}, [freezeOnceVisible, initialIsIntersecting]);
+	return Object.assign([
+		ref,
+		state.isIntersecting,
+		state.entry
+	], {
+		ref,
+		isIntersecting: state.isIntersecting,
+		entry: state.entry
+	});
+};
+//#endregion
+export { useIntersectionObserver };

package/dist/use-isomorphic-effect.d.ts

@@ -0,0 +1,5 @@
+import { useEffect } from "react";
+//#region src/use-isomorphic-effect.d.ts
+declare const useIsomorphicEffect: typeof useEffect;
+//#endregion
+export { useIsomorphicEffect };

package/dist/use-isomorphic-effect.js

@@ -0,0 +1,5 @@
+import { useEffect, useLayoutEffect } from "react";
+//#region src/use-isomorphic-effect.ts
+const useIsomorphicEffect = typeof document !== "undefined" ? useLayoutEffect : useEffect;
+//#endregion
+export { useIsomorphicEffect };

package/dist/use-keybindings.d.ts

@@ -0,0 +1,14 @@
+//#region src/lib/keybindings.d.ts
+type KeyBindingMap = Record<string, (event: KeyboardEvent) => void>;
+type KeyBindingHandlerOptions = {
+  timeout?: number;
+};
+type KeyBindingOptions = KeyBindingHandlerOptions & {
+  event?: "keydown" | "keyup";
+  capture?: boolean;
+};
+//#endregion
+//#region src/use-keybindings.d.ts
+declare const useKeybindings: (keyBindingMap: KeyBindingMap, target?: Window | HTMLElement, { event, capture, timeout }?: KeyBindingOptions) => void;
+//#endregion
+export { useKeybindings };

package/dist/use-keybindings.js

@@ -0,0 +1,76 @@
+import { useEffect, useEffectEvent } from "react";
+//#region src/lib/keybindings.ts
+const KEYBINDING_MODIFIER_KEYS = [
+	"Shift",
+	"Meta",
+	"Alt",
+	"Control"
+];
+const DEFAULT_TIMEOUT = 1e3;
+const DEFAULT_EVENT = "keydown";
+const PLATFORM = typeof navigator === "object" ? navigator.platform : "";
+const APPLE_DEVICE = /Mac|iPod|iPhone|iPad/.test(PLATFORM);
+const MOD = APPLE_DEVICE ? "Meta" : "Control";
+const ALT_GRAPH_ALIASES = PLATFORM === "Win32" ? ["Control", "Alt"] : APPLE_DEVICE ? ["Alt"] : [];
+const getModifierState = (event, mod) => typeof event.getModifierState === "function" ? event.getModifierState(mod) || ALT_GRAPH_ALIASES.includes(mod) && event.getModifierState("AltGraph") : false;
+const parseKeybinding = (str) => str.trim().split(" ").map((press) => {
+	const parts = press.split(/\b\+/);
+	const rawKey = parts.at(-1);
+	const mods = parts.slice(0, -1).map((mod) => mod === "$mod" ? MOD : mod);
+	const match = rawKey.match(/^\((.+)\)$/);
+	return [mods, match ? new RegExp(`^${match[1]}$`) : rawKey];
+});
+const matchesKey = (event, key) => key instanceof RegExp ? key.test(event.key) || key.test(event.code) : key.toUpperCase() === event.key.toUpperCase() || key === event.code;
+const hasRequiredModifiers = (event, mods) => mods.every((mod) => getModifierState(event, mod));
+const hasExtraModifiers = (event, mods, key) => KEYBINDING_MODIFIER_KEYS.some((mod) => !mods.includes(mod) && key !== mod && getModifierState(event, mod));
+const matchKeyBindingPress = (event, [mods, key]) => matchesKey(event, key) && hasRequiredModifiers(event, mods) && !hasExtraModifiers(event, mods, key);
+const createKeybindingsHandler = (keyBindingMap, { timeout = DEFAULT_TIMEOUT } = {}) => {
+	const keyBindings = Object.entries(keyBindingMap).map(([binding, callback]) => [parseKeybinding(binding), callback]);
+	const possibleMatches = /* @__PURE__ */ new Map();
+	let timer = null;
+	return (event) => {
+		if (!(event instanceof KeyboardEvent)) return;
+		for (const [sequence, callback] of keyBindings) {
+			const remainingExpectedPresses = possibleMatches.get(sequence) ?? sequence;
+			const currentExpectedPress = remainingExpectedPresses[0];
+			if (!currentExpectedPress) continue;
+			if (!matchKeyBindingPress(event, currentExpectedPress)) {
+				if (!getModifierState(event, event.key)) possibleMatches.delete(sequence);
+			} else if (remainingExpectedPresses.length > 1) possibleMatches.set(sequence, remainingExpectedPresses.slice(1));
+			else {
+				possibleMatches.delete(sequence);
+				callback(event);
+			}
+		}
+		if (timer) clearTimeout(timer);
+		timer = setTimeout(() => possibleMatches.clear(), timeout);
+	};
+};
+const keybindings = (target, keyBindingMap, { event = DEFAULT_EVENT, capture, timeout } = {}) => {
+	const onKeyEvent = createKeybindingsHandler(keyBindingMap, { timeout });
+	target.addEventListener(event, onKeyEvent, capture);
+	return () => target.removeEventListener(event, onKeyEvent, capture);
+};
+//#endregion
+//#region src/use-keybindings.ts
+const useKeybindings = (keyBindingMap, target, { event, capture, timeout } = {}) => {
+	const run = useEffectEvent((binding, keyboardEvent) => keyBindingMap[binding]?.(keyboardEvent));
+	const bindingsKey = Object.keys(keyBindingMap).join("\n");
+	useEffect(() => {
+		const bindings = bindingsKey === "" ? [] : bindingsKey.split("\n");
+		const map = Object.fromEntries(bindings.map((binding) => [binding, (keyboardEvent) => run(binding, keyboardEvent)]));
+		return keybindings(target ?? window, map, {
+			event,
+			capture,
+			timeout
+		});
+	}, [
+		bindingsKey,
+		target,
+		event,
+		capture,
+		timeout
+	]);
+};
+//#endregion
+export { useKeybindings };

package/dist/use-local-storage.d.ts

@@ -0,0 +1,13 @@
+//#region src/use-local-storage.d.ts
+type UseStorageOptions<T> = {
+  key: string;
+  defaultValue?: T;
+  serialize?: (value: T) => string;
+  deserialize?: (value: string) => T;
+};
+type UseStorageReturnValue<T> = [T, (val: T | ((prevState: T) => T)) => void, () => void];
+type UseStorage = <T>(options: UseStorageOptions<T>) => UseStorageReturnValue<T>;
+declare const useLocalStorage: UseStorage;
+declare const useSessionStorage: UseStorage;
+//#endregion
+export { useLocalStorage, useSessionStorage };