react-dismiss 0.1.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 react-dismiss
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,240 @@
+# react-dismiss
+
+A tiny React hook for dismissing UI on outside interaction or Escape.
+
+Tiny, dependency-free, SSR-safe, StrictMode-safe, TypeScript-first. Ideal for dropdowns, popovers, modals, menus, and overlays.
+
+## Installation
+
+```bash
+npm install react-dismiss
+```
+
+```bash
+pnpm add react-dismiss
+```
+
+```bash
+yarn add react-dismiss
+```
+
+Requires `react >= 18` (peer dependency).
+
+## Quick Start
+
+```tsx
+import { useRef, useState } from "react";
+import { useDismiss } from "react-dismiss";
+
+function Dropdown() {
+  const [open, setOpen] = useState(false);
+  const ref = useRef<HTMLDivElement>(null);
+
+  useDismiss(ref, () => {
+    setOpen(false);
+  });
+
+  return (
+    <div ref={ref}>
+      <button onClick={() => setOpen((v) => !v)}>Menu</button>
+      {open && <div>Dropdown content</div>}
+    </div>
+  );
+}
+```
+
+## How It Works
+
+```
+Interaction inside element  → ignore
+Interaction outside element → onDismiss()
+Escape key                 → onDismiss()
+```
+
+- Outside detection uses `element.contains(event.target)` — descendants are considered inside. Safe when `ref.current === null`.
+- Escape handling listens for `keydown` with `key === "Escape"`.
+- Listeners are attached to `document` inside `useEffect` (no SSR side-effects).
+
+## API
+
+```ts
+useDismiss(ref, onDismiss, options?)
+```
+
+### `ref`
+
+`React.RefObject<T extends HTMLElement>` — the element considered "inside". Attach it to the root of the dismissible UI.
+
+### `onDismiss`
+
+`() => void` — called on dismissal. Latest callback is always used (ref-stable). Errors are not swallowed.
+
+### `options`
+
+| Option    | Type                         | Default         | Description                               |
+| --------- | ---------------------------- | --------------- | ----------------------------------------- |
+| `enabled` | `boolean`                    | `true`          | Master toggle. `false` removes listeners. |
+| `outside` | `boolean`                    | `true`          | Enable outside interaction dismissal.     |
+| `escape`  | `boolean`                    | `true`          | Enable Escape key dismissal.              |
+| `event`   | `"pointerdown"` \| `"click"` | `"pointerdown"` | DOM event for outside detection.          |
+
+All options are optional and can be toggled dynamically.
+
+## Options
+
+```tsx
+// Disabled
+useDismiss(ref, close, { enabled: false });
+
+// Escape only
+useDismiss(ref, close, { outside: false });
+
+// Outside only
+useDismiss(ref, close, { escape: false });
+
+// Use click instead of pointerdown
+useDismiss(ref, close, { event: "click" });
+```
+
+## Examples
+
+### Dropdown
+
+```tsx
+const ref = useRef<HTMLDivElement>(null);
+useDismiss(ref, () => setOpen(false));
+```
+
+### Modal
+
+```tsx
+const ref = useRef<HTMLDivElement>(null);
+useDismiss(ref, closeModal);
+// Renders inside an overlay; Escape and outside click both close.
+```
+
+### Popover
+
+```tsx
+const ref = useRef<HTMLDivElement>(null);
+useDismiss(ref, () => setPopoverOpen(false));
+```
+
+### Search suggestions
+
+```tsx
+const ref = useRef<HTMLDivElement>(null);
+useDismiss(ref, () => setSuggestions([]));
+```
+
+### Escape-only (e.g., controlled modal where backdrop handles clicks)
+
+```tsx
+useDismiss(ref, close, { outside: false });
+```
+
+### Click event (when pointerdown is too eager)
+
+```tsx
+useDismiss(ref, close, { event: "click" });
+```
+
+See `examples/basic.tsx` for runnable demos.
+
+## TypeScript
+
+Fully typed, strict `no any`.
+
+```tsx
+const divRef = useRef<HTMLDivElement>(null);
+useDismiss(divRef, onDismiss); // infers HTMLDivElement
+
+const btnRef = useRef<HTMLButtonElement>(null);
+useDismiss(btnRef, onDismiss); // infers HTMLButtonElement
+```
+
+## SSR
+
+Safe for Next.js, Remix, Vite SSR, React Router. No browser globals are accessed at import time; listeners are registered inside `useEffect` only on the client.
+
+```tsx
+// This import never touches `document` at module init:
+import { useDismiss } from "react-dismiss";
+```
+
+## Accessibility
+
+> `react-dismiss` provides interaction detection, not complete accessibility behavior.
+
+You still need to handle:
+
+- Focus management / focus trapping for dialogs
+- `aria-expanded`, `aria-controls`, correct `role`
+- Keyboard navigation (arrow keys, tab order)
+- Screen-reader announcements
+
+Escape handling in this hook complements but does not replace those patterns. Pair it with proper ARIA:
+
+```tsx
+<button aria-expanded={open} aria-controls="menu">
+  Menu
+</button>
+<div id="menu" role="menu">{/* ... */}</div>
+```
+
+## Browser Support
+
+- Outside detection uses `PointerEvent` (`pointerdown`). All modern browsers support it (Chrome 55+, Firefox 59+, Safari 13+).
+- Fallback: pass `{ event: "click" }` if you must target older browsers.
+- Escape handling uses `keydown` + `key === "Escape"` (universally supported).
+
+## Bundle Size
+
+- ~1.3 KB uncompressed (`dist/index.js`), < 1 KB minified + gzipped.
+- Zero runtime dependencies.
+- Tree-shakeable (`sideEffects: false`).
+
+## Portals
+
+By default "inside" means descendants of `ref.current` (`element.contains`). Content rendered in a React portal outside that subtree is considered outside and will dismiss. If you need multiple "inside" roots, compose refs or lift the dismiss root to a common ancestor. A dedicated multi-root API is intentionally out of scope for v1.
+
+## Development
+
+```bash
+npm install
+npm run typecheck
+npm run lint
+npm run test:run
+npm run build
+```
+
+## Testing
+
+```bash
+npm run test        # watch
+npm run test:run    # single run
+```
+
+Tests cover outside/inside, Escape, other keys, null ref, enabled/outside/escape toggles, dynamic enable, event switching, stale closures, unmount cleanup, StrictMode, nested elements, multiple instances, and error propagation.
+
+## Building
+
+```bash
+npm run build       # tsup → dist/index.js, dist/index.cjs, dist/index.d.ts
+npm pack --dry-run  # inspect published contents
+```
+
+## Publishing
+
+```bash
+npm run check       # typecheck + lint + tests
+npm run build
+npm pack --dry-run  # verify files: dist/, README.md, LICENSE
+npm publish         # or OIDC trusted publishing via GitHub Actions
+```
+
+Never commit secrets. If using GitHub Actions publishing, prefer OIDC over long-lived tokens.
+
+## License
+
+MIT — see [LICENSE](./LICENSE).

package/dist/index.cjs

@@ -0,0 +1,53 @@
+'use strict';
+
+var react = require('react');
+
+// src/useDismiss.ts
+function useDismiss(ref, onDismiss, options = {}) {
+  const {
+    enabled = true,
+    outside = true,
+    escape = true,
+    event = "pointerdown"
+  } = options;
+  const onDismissRef = react.useRef(onDismiss);
+  react.useEffect(() => {
+    onDismissRef.current = onDismiss;
+  }, [onDismiss]);
+  react.useEffect(() => {
+    if (!enabled) return;
+    if (!outside && !escape) return;
+    if (typeof document === "undefined") return;
+    const handleOutside = (e) => {
+      const el = ref.current;
+      if (!el) return;
+      const target = e.target;
+      if (!(target instanceof Node)) return;
+      if (el.contains(target)) return;
+      onDismissRef.current();
+    };
+    const handleKeyDown = (e) => {
+      if (e.key === "Escape") {
+        onDismissRef.current();
+      }
+    };
+    if (outside) {
+      document.addEventListener(event, handleOutside);
+    }
+    if (escape) {
+      document.addEventListener("keydown", handleKeyDown);
+    }
+    return () => {
+      if (outside) {
+        document.removeEventListener(event, handleOutside);
+      }
+      if (escape) {
+        document.removeEventListener("keydown", handleKeyDown);
+      }
+    };
+  }, [ref, enabled, outside, escape, event]);
+}
+
+exports.useDismiss = useDismiss;
+//# sourceMappingURL=index.cjs.map
+//# sourceMappingURL=index.cjs.map

package/dist/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/useDismiss.ts"],"names":["useRef","useEffect"],"mappings":";;;;;AAGO,SAAS,UAAA,CACd,GAAA,EACA,SAAA,EACA,OAAA,GAA6B,EAAC,EACxB;AACN,EAAA,MAAM;AAAA,IACJ,OAAA,GAAU,IAAA;AAAA,IACV,OAAA,GAAU,IAAA;AAAA,IACV,MAAA,GAAS,IAAA;AAAA,IACT,KAAA,GAAQ;AAAA,GACV,GAAI,OAAA;AAEJ,EAAA,MAAM,YAAA,GAAeA,aAAO,SAAS,CAAA;AACrC,EAAAC,eAAA,CAAU,MAAM;AACd,IAAA,YAAA,CAAa,OAAA,GAAU,SAAA;AAAA,EACzB,CAAA,EAAG,CAAC,SAAS,CAAC,CAAA;AAEd,EAAAA,eAAA,CAAU,MAAM;AACd,IAAA,IAAI,CAAC,OAAA,EAAS;AACd,IAAA,IAAI,CAAC,OAAA,IAAW,CAAC,MAAA,EAAQ;AAIzB,IAAA,IAAI,OAAO,aAAa,WAAA,EAAa;AAErC,IAAA,MAAM,aAAA,GAAgB,CAAC,CAAA,KAAa;AAClC,MAAA,MAAM,KAAK,GAAA,CAAI,OAAA;AACf,MAAA,IAAI,CAAC,EAAA,EAAI;AACT,MAAA,MAAM,SAAS,CAAA,CAAE,MAAA;AACjB,MAAA,IAAI,EAAE,kBAAkB,IAAA,CAAA,EAAO;AAC/B,MAAA,IAAI,EAAA,CAAG,QAAA,CAAS,MAAM,CAAA,EAAG;AACzB,MAAA,YAAA,CAAa,OAAA,EAAQ;AAAA,IACvB,CAAA;AAEA,IAAA,MAAM,aAAA,GAAgB,CAAC,CAAA,KAAqB;AAC1C,MAAA,IAAI,CAAA,CAAE,QAAQ,QAAA,EAAU;AACtB,QAAA,YAAA,CAAa,OAAA,EAAQ;AAAA,MACvB;AAAA,IACF,CAAA;AAEA,IAAA,IAAI,OAAA,EAAS;AACX,MAAA,QAAA,CAAS,gBAAA,CAAiB,OAAO,aAAa,CAAA;AAAA,IAChD;AACA,IAAA,IAAI,MAAA,EAAQ;AACV,MAAA,QAAA,CAAS,gBAAA,CAAiB,WAAW,aAAa,CAAA;AAAA,IACpD;AAEA,IAAA,OAAO,MAAM;AACX,MAAA,IAAI,OAAA,EAAS;AACX,QAAA,QAAA,CAAS,mBAAA,CAAoB,OAAO,aAAa,CAAA;AAAA,MACnD;AACA,MAAA,IAAI,MAAA,EAAQ;AACV,QAAA,QAAA,CAAS,mBAAA,CAAoB,WAAW,aAAa,CAAA;AAAA,MACvD;AAAA,IACF,CAAA;AAAA,EACF,GAAG,CAAC,GAAA,EAAK,SAAS,OAAA,EAAS,MAAA,EAAQ,KAAK,CAAC,CAAA;AAC3C","file":"index.cjs","sourcesContent":["import { useEffect, useRef } from \"react\";\nimport type { UseDismissOptions } from \"./types.js\";\n\nexport function useDismiss<T extends HTMLElement>(\n  ref: React.RefObject<T | null>,\n  onDismiss: () => void,\n  options: UseDismissOptions = {},\n): void {\n  const {\n    enabled = true,\n    outside = true,\n    escape = true,\n    event = \"pointerdown\",\n  } = options;\n\n  const onDismissRef = useRef(onDismiss);\n  useEffect(() => {\n    onDismissRef.current = onDismiss;\n  }, [onDismiss]);\n\n  useEffect(() => {\n    if (!enabled) return;\n    if (!outside && !escape) return;\n\n    // SSR guard: document is unavailable on server. Effect only runs on client,\n    // but guard keeps logic safe if environment is non-DOM.\n    if (typeof document === \"undefined\") return;\n\n    const handleOutside = (e: Event) => {\n      const el = ref.current;\n      if (!el) return;\n      const target = e.target;\n      if (!(target instanceof Node)) return;\n      if (el.contains(target)) return;\n      onDismissRef.current();\n    };\n\n    const handleKeyDown = (e: KeyboardEvent) => {\n      if (e.key === \"Escape\") {\n        onDismissRef.current();\n      }\n    };\n\n    if (outside) {\n      document.addEventListener(event, handleOutside);\n    }\n    if (escape) {\n      document.addEventListener(\"keydown\", handleKeyDown);\n    }\n\n    return () => {\n      if (outside) {\n        document.removeEventListener(event, handleOutside);\n      }\n      if (escape) {\n        document.removeEventListener(\"keydown\", handleKeyDown);\n      }\n    };\n  }, [ref, enabled, outside, escape, event]);\n}\n"]}

package/dist/index.d.cts

@@ -0,0 +1,26 @@
+interface UseDismissOptions {
+    /**
+     * Whether dismissal listeners are active.
+     * @default true
+     */
+    enabled?: boolean;
+    /**
+     * Whether outside interaction triggers dismissal.
+     * @default true
+     */
+    outside?: boolean;
+    /**
+     * Whether pressing Escape triggers dismissal.
+     * @default true
+     */
+    escape?: boolean;
+    /**
+     * DOM event used to detect outside interaction.
+     * @default "pointerdown"
+     */
+    event?: "pointerdown" | "click";
+}
+
+declare function useDismiss<T extends HTMLElement>(ref: React.RefObject<T | null>, onDismiss: () => void, options?: UseDismissOptions): void;
+
+export { type UseDismissOptions, useDismiss };

package/dist/index.d.ts

@@ -0,0 +1,26 @@
+interface UseDismissOptions {
+    /**
+     * Whether dismissal listeners are active.
+     * @default true
+     */
+    enabled?: boolean;
+    /**
+     * Whether outside interaction triggers dismissal.
+     * @default true
+     */
+    outside?: boolean;
+    /**
+     * Whether pressing Escape triggers dismissal.
+     * @default true
+     */
+    escape?: boolean;
+    /**
+     * DOM event used to detect outside interaction.
+     * @default "pointerdown"
+     */
+    event?: "pointerdown" | "click";
+}
+
+declare function useDismiss<T extends HTMLElement>(ref: React.RefObject<T | null>, onDismiss: () => void, options?: UseDismissOptions): void;
+
+export { type UseDismissOptions, useDismiss };

package/dist/index.js

@@ -0,0 +1,51 @@
+import { useRef, useEffect } from 'react';
+
+// src/useDismiss.ts
+function useDismiss(ref, onDismiss, options = {}) {
+  const {
+    enabled = true,
+    outside = true,
+    escape = true,
+    event = "pointerdown"
+  } = options;
+  const onDismissRef = useRef(onDismiss);
+  useEffect(() => {
+    onDismissRef.current = onDismiss;
+  }, [onDismiss]);
+  useEffect(() => {
+    if (!enabled) return;
+    if (!outside && !escape) return;
+    if (typeof document === "undefined") return;
+    const handleOutside = (e) => {
+      const el = ref.current;
+      if (!el) return;
+      const target = e.target;
+      if (!(target instanceof Node)) return;
+      if (el.contains(target)) return;
+      onDismissRef.current();
+    };
+    const handleKeyDown = (e) => {
+      if (e.key === "Escape") {
+        onDismissRef.current();
+      }
+    };
+    if (outside) {
+      document.addEventListener(event, handleOutside);
+    }
+    if (escape) {
+      document.addEventListener("keydown", handleKeyDown);
+    }
+    return () => {
+      if (outside) {
+        document.removeEventListener(event, handleOutside);
+      }
+      if (escape) {
+        document.removeEventListener("keydown", handleKeyDown);
+      }
+    };
+  }, [ref, enabled, outside, escape, event]);
+}
+
+export { useDismiss };
+//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/useDismiss.ts"],"names":[],"mappings":";;;AAGO,SAAS,UAAA,CACd,GAAA,EACA,SAAA,EACA,OAAA,GAA6B,EAAC,EACxB;AACN,EAAA,MAAM;AAAA,IACJ,OAAA,GAAU,IAAA;AAAA,IACV,OAAA,GAAU,IAAA;AAAA,IACV,MAAA,GAAS,IAAA;AAAA,IACT,KAAA,GAAQ;AAAA,GACV,GAAI,OAAA;AAEJ,EAAA,MAAM,YAAA,GAAe,OAAO,SAAS,CAAA;AACrC,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,YAAA,CAAa,OAAA,GAAU,SAAA;AAAA,EACzB,CAAA,EAAG,CAAC,SAAS,CAAC,CAAA;AAEd,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,IAAI,CAAC,OAAA,EAAS;AACd,IAAA,IAAI,CAAC,OAAA,IAAW,CAAC,MAAA,EAAQ;AAIzB,IAAA,IAAI,OAAO,aAAa,WAAA,EAAa;AAErC,IAAA,MAAM,aAAA,GAAgB,CAAC,CAAA,KAAa;AAClC,MAAA,MAAM,KAAK,GAAA,CAAI,OAAA;AACf,MAAA,IAAI,CAAC,EAAA,EAAI;AACT,MAAA,MAAM,SAAS,CAAA,CAAE,MAAA;AACjB,MAAA,IAAI,EAAE,kBAAkB,IAAA,CAAA,EAAO;AAC/B,MAAA,IAAI,EAAA,CAAG,QAAA,CAAS,MAAM,CAAA,EAAG;AACzB,MAAA,YAAA,CAAa,OAAA,EAAQ;AAAA,IACvB,CAAA;AAEA,IAAA,MAAM,aAAA,GAAgB,CAAC,CAAA,KAAqB;AAC1C,MAAA,IAAI,CAAA,CAAE,QAAQ,QAAA,EAAU;AACtB,QAAA,YAAA,CAAa,OAAA,EAAQ;AAAA,MACvB;AAAA,IACF,CAAA;AAEA,IAAA,IAAI,OAAA,EAAS;AACX,MAAA,QAAA,CAAS,gBAAA,CAAiB,OAAO,aAAa,CAAA;AAAA,IAChD;AACA,IAAA,IAAI,MAAA,EAAQ;AACV,MAAA,QAAA,CAAS,gBAAA,CAAiB,WAAW,aAAa,CAAA;AAAA,IACpD;AAEA,IAAA,OAAO,MAAM;AACX,MAAA,IAAI,OAAA,EAAS;AACX,QAAA,QAAA,CAAS,mBAAA,CAAoB,OAAO,aAAa,CAAA;AAAA,MACnD;AACA,MAAA,IAAI,MAAA,EAAQ;AACV,QAAA,QAAA,CAAS,mBAAA,CAAoB,WAAW,aAAa,CAAA;AAAA,MACvD;AAAA,IACF,CAAA;AAAA,EACF,GAAG,CAAC,GAAA,EAAK,SAAS,OAAA,EAAS,MAAA,EAAQ,KAAK,CAAC,CAAA;AAC3C","file":"index.js","sourcesContent":["import { useEffect, useRef } from \"react\";\nimport type { UseDismissOptions } from \"./types.js\";\n\nexport function useDismiss<T extends HTMLElement>(\n  ref: React.RefObject<T | null>,\n  onDismiss: () => void,\n  options: UseDismissOptions = {},\n): void {\n  const {\n    enabled = true,\n    outside = true,\n    escape = true,\n    event = \"pointerdown\",\n  } = options;\n\n  const onDismissRef = useRef(onDismiss);\n  useEffect(() => {\n    onDismissRef.current = onDismiss;\n  }, [onDismiss]);\n\n  useEffect(() => {\n    if (!enabled) return;\n    if (!outside && !escape) return;\n\n    // SSR guard: document is unavailable on server. Effect only runs on client,\n    // but guard keeps logic safe if environment is non-DOM.\n    if (typeof document === \"undefined\") return;\n\n    const handleOutside = (e: Event) => {\n      const el = ref.current;\n      if (!el) return;\n      const target = e.target;\n      if (!(target instanceof Node)) return;\n      if (el.contains(target)) return;\n      onDismissRef.current();\n    };\n\n    const handleKeyDown = (e: KeyboardEvent) => {\n      if (e.key === \"Escape\") {\n        onDismissRef.current();\n      }\n    };\n\n    if (outside) {\n      document.addEventListener(event, handleOutside);\n    }\n    if (escape) {\n      document.addEventListener(\"keydown\", handleKeyDown);\n    }\n\n    return () => {\n      if (outside) {\n        document.removeEventListener(event, handleOutside);\n      }\n      if (escape) {\n        document.removeEventListener(\"keydown\", handleKeyDown);\n      }\n    };\n  }, [ref, enabled, outside, escape, event]);\n}\n"]}

package/package.json

@@ -0,0 +1,76 @@
+{
+  "name": "react-dismiss",
+  "version": "0.1.0",
+  "description": "A tiny React hook for dismissing UI when users interact outside or press Escape.",
+  "keywords": [
+    "react",
+    "react-hook",
+    "dismiss",
+    "click-outside",
+    "outside-click",
+    "popover",
+    "dropdown",
+    "modal",
+    "typescript"
+  ],
+  "license": "MIT",
+  "author": "",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/parasraju/react-dismiss.git"
+  },
+  "bugs": {
+    "url": "https://github.com/parasraju/react-dismiss/issues"
+  },
+  "homepage": "https://github.com/parasraju/react-dismiss#readme",
+  "files": [
+    "dist",
+    "README.md",
+    "LICENSE"
+  ],
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js",
+      "require": "./dist/index.cjs"
+    }
+  },
+  "main": "./dist/index.cjs",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "sideEffects": false,
+  "type": "module",
+  "scripts": {
+    "build": "tsup",
+    "test": "vitest",
+    "test:run": "vitest run",
+    "test:coverage": "vitest run --coverage",
+    "lint": "eslint .",
+    "format": "prettier --write .",
+    "format:check": "prettier --check .",
+    "typecheck": "tsc --noEmit",
+    "check": "npm run typecheck && npm run lint && npm run test:run",
+    "prepublishOnly": "npm run check && npm run build"
+  },
+  "peerDependencies": {
+    "react": ">=18"
+  },
+  "devDependencies": {
+    "@testing-library/react": "^16.0.1",
+    "@types/node": "^22.0.0",
+    "@types/react": "^18.3.12",
+    "@types/react-dom": "^18.3.1",
+    "eslint": "^9.18.0",
+    "@eslint/js": "^9.18.0",
+    "eslint-plugin-react-hooks": "^5.1.0",
+    "globals": "^15.14.0",
+    "jsdom": "^25.0.1",
+    "prettier": "^3.4.2",
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1",
+    "tsup": "^8.3.6",
+    "typescript": "^5.7.3",
+    "typescript-eslint": "^8.19.0",
+    "vitest": "^3.1.1"
+  }
+}