@develemit/web-hooks 0.0.0-stage → 0.2.0

package/dist/storage-state.cjs

@@ -0,0 +1,161 @@
+"use client";
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/storage-state/index.ts
+var storage_state_exports = {};
+__export(storage_state_exports, {
+  useStorageState: () => useStorageState
+});
+module.exports = __toCommonJS(storage_state_exports);
+
+// src/storage-state/use-storage-state.ts
+var import_react = require("react");
+
+// src/storage-state/storage-store.ts
+function getStorage(kind) {
+  try {
+    if (typeof window === "undefined") return null;
+    return kind === "session" ? window.sessionStorage : window.localStorage;
+  } catch {
+    return null;
+  }
+}
+function readRaw(storage, key) {
+  try {
+    return storage ? storage.getItem(key) : null;
+  } catch {
+    return null;
+  }
+}
+function writeRaw(storage, key, value) {
+  try {
+    if (!storage) return false;
+    storage.setItem(key, value);
+    return true;
+  } catch {
+    return false;
+  }
+}
+function removeRaw(storage, key) {
+  try {
+    if (!storage) return false;
+    storage.removeItem(key);
+    return true;
+  } catch {
+    return false;
+  }
+}
+function parseOr(raw, parse, fallback) {
+  if (raw === null) return fallback;
+  try {
+    return parse(raw);
+  } catch {
+    return fallback;
+  }
+}
+var slot = (kind, key) => `${kind}\0${key}`;
+var memory = /* @__PURE__ */ new Map();
+var listeners = /* @__PURE__ */ new Map();
+function readCurrent(kind, key) {
+  const held = memory.get(slot(kind, key));
+  if (held !== void 0) return held;
+  return readRaw(getStorage(kind), key);
+}
+function notify(id) {
+  for (const listener of [...listeners.get(id) ?? []]) listener();
+}
+function writeCurrent(kind, key, raw) {
+  const id = slot(kind, key);
+  if (writeRaw(getStorage(kind), key, raw)) memory.delete(id);
+  else memory.set(id, raw);
+  notify(id);
+}
+function removeCurrent(kind, key) {
+  const id = slot(kind, key);
+  if (removeRaw(getStorage(kind), key)) memory.delete(id);
+  else memory.set(id, null);
+  notify(id);
+}
+function onStorageEvent(event) {
+  const kinds = [];
+  if (!event.storageArea || event.storageArea === getStorage("local")) kinds.push("local");
+  if (!event.storageArea || event.storageArea === getStorage("session")) kinds.push("session");
+  for (const id of [...listeners.keys()]) {
+    const [kind, key] = id.split("\0");
+    if (!kinds.includes(kind)) continue;
+    if (event.key !== null && event.key !== key) continue;
+    memory.delete(id);
+    notify(id);
+  }
+}
+function subscribeToKey(kind, key, listener) {
+  const id = slot(kind, key);
+  const wasEmpty = listeners.size === 0;
+  let set = listeners.get(id);
+  if (!set) listeners.set(id, set = /* @__PURE__ */ new Set());
+  set.add(listener);
+  if (wasEmpty) window.addEventListener("storage", onStorageEvent);
+  return () => {
+    const current = listeners.get(id);
+    current?.delete(listener);
+    if (current?.size === 0) listeners.delete(id);
+    if (listeners.size === 0) window.removeEventListener("storage", onStorageEvent);
+  };
+}
+
+// src/storage-state/use-storage-state.ts
+function useStorageState(key, defaultValue, options = {}) {
+  const kind = options.storage ?? "local";
+  const serialize = options.serialize ?? JSON.stringify;
+  const parse = options.parse ?? JSON.parse;
+  const latest = (0, import_react.useRef)({ serialize, parse, defaultValue });
+  (0, import_react.useEffect)(() => {
+    latest.current = { serialize, parse, defaultValue };
+  });
+  const cache = (0, import_react.useRef)(null);
+  const subscribe = (0, import_react.useCallback)((onChange) => subscribeToKey(kind, key, onChange), [kind, key]);
+  const getSnapshot = (0, import_react.useCallback)(() => {
+    const raw = readCurrent(kind, key);
+    const hit = cache.current;
+    if (hit && hit.kind === kind && hit.key === key && hit.raw === raw && hit.parse === parse) return hit.value;
+    const value2 = parseOr(raw, parse, defaultValue);
+    cache.current = { kind, key, raw, parse, value: value2 };
+    return value2;
+  }, [kind, key, parse, defaultValue]);
+  const getServerSnapshot = (0, import_react.useCallback)(() => defaultValue, [defaultValue]);
+  const value = (0, import_react.useSyncExternalStore)(subscribe, getSnapshot, getServerSnapshot);
+  const set = (0, import_react.useCallback)(
+    (next) => {
+      const { serialize: encode, parse: decode, defaultValue: fallback } = latest.current;
+      try {
+        const resolved = typeof next === "function" ? next(parseOr(readCurrent(kind, key), decode, fallback)) : next;
+        writeCurrent(kind, key, encode(resolved));
+      } catch {
+      }
+    },
+    [kind, key]
+  );
+  const remove = (0, import_react.useCallback)(() => removeCurrent(kind, key), [kind, key]);
+  return [value, set, remove];
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  useStorageState
+});

package/dist/storage-state.d.cts

@@ -0,0 +1,14 @@
+type StorageKind = 'local' | 'session';
+
+interface UseStorageStateOptions<T> {
+    /** `'local'` (default) or `'session'`. */
+    storage?: StorageKind;
+    /** Default `JSON.stringify`. */
+    serialize?: (value: T) => string;
+    /** Default `JSON.parse`. A throw returns `defaultValue`. */
+    parse?: (raw: string) => T;
+}
+type StorageStateSetter<T> = (next: T | ((prev: T) => T)) => void;
+declare function useStorageState<T>(key: string, defaultValue: T, options?: UseStorageStateOptions<T>): readonly [T, StorageStateSetter<T>, () => void];
+
+export { type StorageKind, type StorageStateSetter, type UseStorageStateOptions, useStorageState };

package/dist/storage-state.d.ts

@@ -0,0 +1,14 @@
+type StorageKind = 'local' | 'session';
+
+interface UseStorageStateOptions<T> {
+    /** `'local'` (default) or `'session'`. */
+    storage?: StorageKind;
+    /** Default `JSON.stringify`. */
+    serialize?: (value: T) => string;
+    /** Default `JSON.parse`. A throw returns `defaultValue`. */
+    parse?: (raw: string) => T;
+}
+type StorageStateSetter<T> = (next: T | ((prev: T) => T)) => void;
+declare function useStorageState<T>(key: string, defaultValue: T, options?: UseStorageStateOptions<T>): readonly [T, StorageStateSetter<T>, () => void];
+
+export { type StorageKind, type StorageStateSetter, type UseStorageStateOptions, useStorageState };

package/dist/storage-state.js

@@ -0,0 +1,7 @@
+"use client";
+import {
+  useStorageState
+} from "./chunk-5KIH2XLV.js";
+export {
+  useStorageState
+};

package/dist/unsaved-guard.cjs

@@ -0,0 +1,48 @@
+"use client";
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/unsaved-guard/index.ts
+var unsaved_guard_exports = {};
+__export(unsaved_guard_exports, {
+  handleBeforeUnload: () => handleBeforeUnload,
+  useUnsavedChangesGuard: () => useUnsavedChangesGuard
+});
+module.exports = __toCommonJS(unsaved_guard_exports);
+
+// src/unsaved-guard/handle-before-unload.ts
+function handleBeforeUnload(event) {
+  event.preventDefault();
+  event.returnValue = "";
+}
+
+// src/unsaved-guard/use-unsaved-changes-guard.ts
+var import_react = require("react");
+function useUnsavedChangesGuard(dirty) {
+  (0, import_react.useEffect)(() => {
+    if (!dirty) return;
+    window.addEventListener("beforeunload", handleBeforeUnload);
+    return () => window.removeEventListener("beforeunload", handleBeforeUnload);
+  }, [dirty]);
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  handleBeforeUnload,
+  useUnsavedChangesGuard
+});

package/dist/unsaved-guard.d.cts

@@ -0,0 +1,5 @@
+declare function handleBeforeUnload(event: BeforeUnloadEvent): void;
+
+declare function useUnsavedChangesGuard(dirty: boolean): void;
+
+export { handleBeforeUnload, useUnsavedChangesGuard };

package/dist/unsaved-guard.d.ts

@@ -0,0 +1,5 @@
+declare function handleBeforeUnload(event: BeforeUnloadEvent): void;
+
+declare function useUnsavedChangesGuard(dirty: boolean): void;
+
+export { handleBeforeUnload, useUnsavedChangesGuard };

package/dist/unsaved-guard.js

@@ -0,0 +1,9 @@
+"use client";
+import {
+  handleBeforeUnload,
+  useUnsavedChangesGuard
+} from "./chunk-LZKAGDER.js";
+export {
+  handleBeforeUnload,
+  useUnsavedChangesGuard
+};

package/dist/visibility-polling.cjs

@@ -0,0 +1,98 @@
+"use client";
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/visibility-polling/index.ts
+var visibility_polling_exports = {};
+__export(visibility_polling_exports, {
+  nextDelay: () => nextDelay,
+  useVisibilityPolling: () => useVisibilityPolling
+});
+module.exports = __toCommonJS(visibility_polling_exports);
+
+// src/visibility-polling/schedule.ts
+function nextDelay(intervalMs, jitter, random) {
+  const fraction = Math.min(1, Math.max(0, jitter));
+  return intervalMs + random() * fraction * intervalMs;
+}
+
+// src/visibility-polling/use-visibility-polling.ts
+var import_react = require("react");
+var isHidden = () => document.visibilityState === "hidden";
+function useVisibilityPolling(fn, intervalMs, { enabled = true, immediate = true, jitter = 0, runOnVisible = true } = {}) {
+  const fnRef = (0, import_react.useRef)(fn);
+  const optionsRef = (0, import_react.useRef)({ immediate, jitter, runOnVisible });
+  (0, import_react.useEffect)(() => {
+    fnRef.current = fn;
+    optionsRef.current = { immediate, jitter, runOnVisible };
+  });
+  const runningRef = (0, import_react.useRef)(false);
+  const scheduleRef = (0, import_react.useRef)(null);
+  (0, import_react.useEffect)(() => {
+    if (!enabled) return;
+    let active = true;
+    let timer = null;
+    function clearTimer() {
+      if (timer !== null) clearTimeout(timer);
+      timer = null;
+    }
+    function schedule() {
+      clearTimer();
+      if (!active || isHidden()) return;
+      timer = setTimeout(run, nextDelay(intervalMs, optionsRef.current.jitter, Math.random));
+    }
+    async function run() {
+      timer = null;
+      if (!active || runningRef.current || isHidden()) return;
+      runningRef.current = true;
+      try {
+        await fnRef.current();
+      } catch {
+      } finally {
+        runningRef.current = false;
+      }
+      scheduleRef.current?.();
+    }
+    function onVisibilityChange() {
+      if (isHidden()) {
+        clearTimer();
+      } else if (optionsRef.current.runOnVisible) {
+        clearTimer();
+        void run();
+      } else if (!runningRef.current) {
+        schedule();
+      }
+    }
+    scheduleRef.current = schedule;
+    if (optionsRef.current.immediate && !isHidden()) void run();
+    else schedule();
+    document.addEventListener("visibilitychange", onVisibilityChange);
+    return () => {
+      active = false;
+      scheduleRef.current = null;
+      clearTimer();
+      document.removeEventListener("visibilitychange", onVisibilityChange);
+    };
+  }, [enabled, intervalMs]);
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  nextDelay,
+  useVisibilityPolling
+});

package/dist/visibility-polling.d.cts

@@ -0,0 +1,14 @@
+declare function nextDelay(intervalMs: number, jitter: number, random: () => number): number;
+
+interface UseVisibilityPollingOptions {
+    enabled?: boolean;
+    /** Run once on mount (when visible) before the first interval. */
+    immediate?: boolean;
+    /** 0–1 fraction of the interval added at random to each delay. */
+    jitter?: number;
+    /** Run once as soon as the page becomes visible again. */
+    runOnVisible?: boolean;
+}
+declare function useVisibilityPolling(fn: () => unknown, intervalMs: number, { enabled, immediate, jitter, runOnVisible }?: UseVisibilityPollingOptions): void;
+
+export { type UseVisibilityPollingOptions, nextDelay, useVisibilityPolling };

package/dist/visibility-polling.d.ts

@@ -0,0 +1,14 @@
+declare function nextDelay(intervalMs: number, jitter: number, random: () => number): number;
+
+interface UseVisibilityPollingOptions {
+    enabled?: boolean;
+    /** Run once on mount (when visible) before the first interval. */
+    immediate?: boolean;
+    /** 0–1 fraction of the interval added at random to each delay. */
+    jitter?: number;
+    /** Run once as soon as the page becomes visible again. */
+    runOnVisible?: boolean;
+}
+declare function useVisibilityPolling(fn: () => unknown, intervalMs: number, { enabled, immediate, jitter, runOnVisible }?: UseVisibilityPollingOptions): void;
+
+export { type UseVisibilityPollingOptions, nextDelay, useVisibilityPolling };

package/dist/visibility-polling.js

@@ -0,0 +1,9 @@
+"use client";
+import {
+  nextDelay,
+  useVisibilityPolling
+} from "./chunk-UPVNSGIK.js";
+export {
+  nextDelay,
+  useVisibilityPolling
+};

package/package.json

@@ -1,6 +1,129 @@
 {
   "name": "@develemit/web-hooks",
-  "version": "0.0.0-stage",
-  "stub": true,
-  "description": "Temporary package placeholder for staged publishing"
+  "version": "0.2.0",
+  "description": "Shared React behavior hooks for develemit web apps: drawer swipe, focus trap, escape key and clipboard.",
+  "license": "MIT",
+  "author": "Emit Dutcher",
+  "type": "module",
+  "sideEffects": false,
+  "engines": {
+    "node": ">=20"
+  },
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js",
+      "require": "./dist/index.cjs"
+    },
+    "./drawer-swipe": {
+      "types": "./dist/drawer-swipe.d.ts",
+      "import": "./dist/drawer-swipe.js",
+      "require": "./dist/drawer-swipe.cjs"
+    },
+    "./focus-trap": {
+      "types": "./dist/focus-trap.d.ts",
+      "import": "./dist/focus-trap.js",
+      "require": "./dist/focus-trap.cjs"
+    },
+    "./escape": {
+      "types": "./dist/escape.d.ts",
+      "import": "./dist/escape.js",
+      "require": "./dist/escape.cjs"
+    },
+    "./clipboard": {
+      "types": "./dist/clipboard.d.ts",
+      "import": "./dist/clipboard.js",
+      "require": "./dist/clipboard.cjs"
+    },
+    "./scroll-lock": {
+      "types": "./dist/scroll-lock.d.ts",
+      "import": "./dist/scroll-lock.js",
+      "require": "./dist/scroll-lock.cjs"
+    },
+    "./media-query": {
+      "types": "./dist/media-query.d.ts",
+      "import": "./dist/media-query.js",
+      "require": "./dist/media-query.cjs"
+    },
+    "./outside-press": {
+      "types": "./dist/outside-press.d.ts",
+      "import": "./dist/outside-press.js",
+      "require": "./dist/outside-press.cjs"
+    },
+    "./visibility-polling": {
+      "types": "./dist/visibility-polling.d.ts",
+      "import": "./dist/visibility-polling.js",
+      "require": "./dist/visibility-polling.cjs"
+    },
+    "./debounce": {
+      "types": "./dist/debounce.d.ts",
+      "import": "./dist/debounce.js",
+      "require": "./dist/debounce.cjs"
+    },
+    "./storage-state": {
+      "types": "./dist/storage-state.d.ts",
+      "import": "./dist/storage-state.js",
+      "require": "./dist/storage-state.cjs"
+    },
+    "./unsaved-guard": {
+      "types": "./dist/unsaved-guard.d.ts",
+      "import": "./dist/unsaved-guard.js",
+      "require": "./dist/unsaved-guard.cjs"
+    },
+    "./hotkey": {
+      "types": "./dist/hotkey.d.ts",
+      "import": "./dist/hotkey.js",
+      "require": "./dist/hotkey.cjs"
+    },
+    "./auto-grow": {
+      "types": "./dist/auto-grow.d.ts",
+      "import": "./dist/auto-grow.js",
+      "require": "./dist/auto-grow.cjs"
+    }
+  },
+  "main": "./dist/index.cjs",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "files": [
+    "dist",
+    "LICENSE",
+    "CHANGELOG.md"
+  ],
+  "publishConfig": {
+    "access": "public"
+  },
+  "peerDependencies": {
+    "react": "^18.0.0 || ^19.0.0"
+  },
+  "devDependencies": {
+    "@eslint/js": "^9.0.0",
+    "@testing-library/react": "^16.0.0",
+    "@types/react": "^19.0.0",
+    "@types/react-18": "npm:@types/react@^18.3.31",
+    "@types/react-dom": "^19.0.0",
+    "@vitest/browser": "3.2.7",
+    "eslint": "^9.0.0",
+    "jsdom": "^26.0.0",
+    "playwright": "1.64.0",
+    "react": "^19.0.0",
+    "react-18": "npm:react@^18.3.1",
+    "react-dom": "^19.0.0",
+    "react-dom-18": "npm:react-dom@^18.3.1",
+    "testing-library-react-18": "npm:@testing-library/react@16.2.0",
+    "tsup": "^8.5.1",
+    "typescript": "^5.9.0",
+    "typescript-eslint": "^8.0.0",
+    "vitest": "^3.0.0"
+  },
+  "scripts": {
+    "typecheck": "tsc --noEmit",
+    "lint": "eslint .",
+    "test": "vitest run",
+    "build": "rm -rf dist && tsup",
+    "check": "pnpm typecheck && pnpm lint && pnpm test && pnpm build",
+    "release": "pnpm check && pnpm publish --access public",
+    "release:dry": "pnpm publish --access public --dry-run",
+    "test:unit": "vitest run --project jsdom-react19 --project jsdom-react18",
+    "test:browser": "vitest run --project browser-webkit"
+  }
 }