@develemit/web-hooks 0.1.0 → 0.3.0

package/dist/escape.js

@@ -1,21 +1,7 @@
 "use client";
-
-// src/escape/use-escape.ts
-import { useEffect, useRef } from "react";
-function useEscape(onEscape, active = true) {
-  const handlerRef = useRef(onEscape);
-  useEffect(() => {
-    handlerRef.current = onEscape;
-  });
-  useEffect(() => {
-    if (!active) return;
-    function onKeyDown(event) {
-      if (event.key === "Escape") handlerRef.current();
-    }
-    document.addEventListener("keydown", onKeyDown);
-    return () => document.removeEventListener("keydown", onKeyDown);
-  }, [active]);
-}
+import {
+  useEscape
+} from "./chunk-S4YKMGQE.js";
 export {
   useEscape
 };

package/dist/focus-trap.cjs

@@ -58,6 +58,9 @@ function useFocusTrap(containerRef, {
   if (active && !openerRef.current && typeof document !== "undefined") {
     openerRef.current = document.activeElement;
   }
+  (0, import_react.useEffect)(() => {
+    if (!active) openerRef.current = null;
+  }, [active]);
   (0, import_react.useEffect)(() => {
     const container = containerRef.current;
     if (!active || !container) return;
@@ -94,7 +97,6 @@ function useFocusTrap(containerRef, {
       document.removeEventListener("keydown", onKeyDown);
       activeTraps.splice(activeTraps.indexOf(token), 1);
       const opener = returnFocusRef?.current ?? openerRef.current;
-      openerRef.current = null;
       if (restoreFocus && opener?.isConnected) opener.focus();
     };
   }, [active, containerRef, initialFocusRef, returnFocusRef, restoreFocus]);

package/dist/focus-trap.js

@@ -1,76 +1,10 @@
 "use client";
-
-// src/focus-trap/focusables.ts
-var FOCUSABLE_SELECTOR = 'a[href], button:not([disabled]), input:not([disabled]):not([type="hidden"]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex="-1"])';
-function focusableWithin(container) {
-  return Array.from(
-    container.querySelectorAll(FOCUSABLE_SELECTOR)
-  ).filter((el) => !el.closest("[hidden], [inert]"));
-}
-function nextFocusTarget(items, current, shiftKey, container) {
-  const first = items[0];
-  const last = items[items.length - 1];
-  if (!first || !last) return null;
-  if (!current || !container.contains(current)) return shiftKey ? last : first;
-  if (shiftKey && (current === first || current === container)) return last;
-  if (!shiftKey && current === last) return first;
-  return null;
-}
-
-// src/focus-trap/use-focus-trap.ts
-import { useEffect, useRef } from "react";
-var activeTraps = [];
-function useFocusTrap(containerRef, {
-  active,
-  initialFocusRef,
-  returnFocusRef,
-  restoreFocus = true
-}) {
-  const openerRef = useRef(null);
-  if (active && !openerRef.current && typeof document !== "undefined") {
-    openerRef.current = document.activeElement;
-  }
-  useEffect(() => {
-    const container = containerRef.current;
-    if (!active || !container) return;
-    const token = {};
-    activeTraps.push(token);
-    if (!container.contains(document.activeElement)) {
-      const target = initialFocusRef?.current ?? focusableWithin(container)[0] ?? container;
-      if (target === container && !container.hasAttribute("tabindex")) {
-        container.setAttribute("tabindex", "-1");
-      }
-      target.focus();
-    }
-    function onKeyDown(event) {
-      if (event.key !== "Tab" || !container) return;
-      if (activeTraps[activeTraps.length - 1] !== token) return;
-      const items = focusableWithin(container);
-      if (items.length === 0) {
-        event.preventDefault();
-        return;
-      }
-      const target = nextFocusTarget(
-        items,
-        document.activeElement,
-        event.shiftKey,
-        container
-      );
-      if (target) {
-        event.preventDefault();
-        target.focus();
-      }
-    }
-    document.addEventListener("keydown", onKeyDown);
-    return () => {
-      document.removeEventListener("keydown", onKeyDown);
-      activeTraps.splice(activeTraps.indexOf(token), 1);
-      const opener = returnFocusRef?.current ?? openerRef.current;
-      openerRef.current = null;
-      if (restoreFocus && opener?.isConnected) opener.focus();
-    };
-  }, [active, containerRef, initialFocusRef, returnFocusRef, restoreFocus]);
-}
+import {
+  FOCUSABLE_SELECTOR,
+  focusableWithin,
+  nextFocusTarget,
+  useFocusTrap
+} from "./chunk-DNU57XEJ.js";
 export {
   FOCUSABLE_SELECTOR,
   focusableWithin,

package/dist/hotkey.cjs

@@ -0,0 +1,127 @@
+"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/hotkey/index.ts
+var hotkey_exports = {};
+__export(hotkey_exports, {
+  detectApple: () => detectApple,
+  isEditableTarget: () => isEditableTarget,
+  matchHotkey: () => matchHotkey,
+  parseHotkey: () => parseHotkey,
+  useHotkey: () => useHotkey
+});
+module.exports = __toCommonJS(hotkey_exports);
+
+// src/hotkey/parse-hotkey.ts
+var KEY_ALIASES = {
+  esc: "escape",
+  space: " ",
+  plus: "+",
+  up: "arrowup",
+  down: "arrowdown",
+  left: "arrowleft",
+  right: "arrowright"
+};
+function parseHotkey(combo) {
+  const parsed = { key: "", mod: false, ctrl: false, meta: false, alt: false, shift: false };
+  const parts = combo.trim().toLowerCase().split(/\+(?=.)/);
+  for (const part of parts) {
+    const token = part.trim();
+    if (token === "mod" || token === "ctrl" || token === "meta" || token === "alt" || token === "shift") {
+      parsed[token] = true;
+    } else {
+      parsed.key = KEY_ALIASES[token] ?? token;
+    }
+  }
+  if (!parsed.key) throw new Error(`Invalid hotkey "${combo}": no key`);
+  return parsed;
+}
+
+// src/hotkey/match-hotkey.ts
+var CODE_FOR_SYMBOL = {
+  "/": "Slash",
+  ".": "Period",
+  ",": "Comma",
+  ";": "Semicolon",
+  "'": "Quote",
+  "[": "BracketLeft",
+  "]": "BracketRight",
+  "\\": "Backslash",
+  "-": "Minus",
+  "=": "Equal",
+  "`": "Backquote"
+};
+function physicalCode(key) {
+  if (/^[a-z]$/.test(key)) return `Key${key.toUpperCase()}`;
+  if (/^[0-9]$/.test(key)) return `Digit${key}`;
+  return CODE_FOR_SYMBOL[key] ?? null;
+}
+function keyMatches(event, parsed) {
+  if (event.key.toLowerCase() === parsed.key) return true;
+  return parsed.shift && physicalCode(parsed.key) === event.code;
+}
+function matchHotkey(event, combo, isApple) {
+  const parsed = typeof combo === "string" ? parseHotkey(combo) : combo;
+  const wantMeta = parsed.meta || parsed.mod && isApple;
+  const wantCtrl = parsed.ctrl || parsed.mod && !isApple;
+  return event.metaKey === wantMeta && event.ctrlKey === wantCtrl && event.altKey === parsed.alt && event.shiftKey === parsed.shift && keyMatches(event, parsed);
+}
+function detectApple(nav) {
+  if (!nav) return false;
+  const platform = nav.userAgentData?.platform || nav.platform || "";
+  return /mac|iphone|ipad|ipod/i.test(platform);
+}
+function isEditableTarget(target) {
+  const el = target;
+  if (!el || typeof el.tagName !== "string") return false;
+  const tag = el.tagName.toLowerCase();
+  return tag === "input" || tag === "textarea" || tag === "select" || el.isContentEditable === true;
+}
+
+// src/hotkey/use-hotkey.ts
+var import_react = require("react");
+function useHotkey(combo, onHotkey, options = {}) {
+  const { enabled = true, allowInInputs = false, preventDefault = true } = options;
+  const handlerRef = (0, import_react.useRef)(onHotkey);
+  (0, import_react.useEffect)(() => {
+    handlerRef.current = onHotkey;
+  });
+  (0, import_react.useEffect)(() => {
+    if (!enabled) return;
+    const parsed = parseHotkey(combo);
+    function onKeyDown(event) {
+      if (event.isComposing || event.keyCode === 229) return;
+      if (!allowInInputs && isEditableTarget(event.target)) return;
+      if (!matchHotkey(event, parsed, detectApple(navigator))) return;
+      if (preventDefault) event.preventDefault();
+      handlerRef.current(event);
+    }
+    document.addEventListener("keydown", onKeyDown);
+    return () => document.removeEventListener("keydown", onKeyDown);
+  }, [combo, enabled, allowInInputs, preventDefault]);
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  detectApple,
+  isEditableTarget,
+  matchHotkey,
+  parseHotkey,
+  useHotkey
+});

package/dist/hotkey.d.cts

@@ -0,0 +1,31 @@
+interface ParsedHotkey {
+    key: string;
+    mod: boolean;
+    ctrl: boolean;
+    meta: boolean;
+    alt: boolean;
+    shift: boolean;
+}
+declare function parseHotkey(combo: string): ParsedHotkey;
+
+type KeyEventLike = Pick<KeyboardEvent, 'key' | 'code' | 'ctrlKey' | 'metaKey' | 'altKey' | 'shiftKey'>;
+/** `isApple` decides what `mod` means: Cmd on Apple devices, Ctrl elsewhere. */
+declare function matchHotkey(event: KeyEventLike, combo: string | ParsedHotkey, isApple: boolean): boolean;
+interface NavigatorLike {
+    platform?: string;
+    userAgentData?: {
+        platform?: string;
+    };
+}
+/** iPad in desktop mode reports MacIntel, so it counts as Apple. */
+declare function detectApple(nav: NavigatorLike | undefined): boolean;
+declare function isEditableTarget(target: EventTarget | null): boolean;
+
+interface UseHotkeyOptions {
+    enabled?: boolean;
+    allowInInputs?: boolean;
+    preventDefault?: boolean;
+}
+declare function useHotkey(combo: string, onHotkey: (event: KeyboardEvent) => void, options?: UseHotkeyOptions): void;
+
+export { type ParsedHotkey, type UseHotkeyOptions, detectApple, isEditableTarget, matchHotkey, parseHotkey, useHotkey };

package/dist/hotkey.d.ts

@@ -0,0 +1,31 @@
+interface ParsedHotkey {
+    key: string;
+    mod: boolean;
+    ctrl: boolean;
+    meta: boolean;
+    alt: boolean;
+    shift: boolean;
+}
+declare function parseHotkey(combo: string): ParsedHotkey;
+
+type KeyEventLike = Pick<KeyboardEvent, 'key' | 'code' | 'ctrlKey' | 'metaKey' | 'altKey' | 'shiftKey'>;
+/** `isApple` decides what `mod` means: Cmd on Apple devices, Ctrl elsewhere. */
+declare function matchHotkey(event: KeyEventLike, combo: string | ParsedHotkey, isApple: boolean): boolean;
+interface NavigatorLike {
+    platform?: string;
+    userAgentData?: {
+        platform?: string;
+    };
+}
+/** iPad in desktop mode reports MacIntel, so it counts as Apple. */
+declare function detectApple(nav: NavigatorLike | undefined): boolean;
+declare function isEditableTarget(target: EventTarget | null): boolean;
+
+interface UseHotkeyOptions {
+    enabled?: boolean;
+    allowInInputs?: boolean;
+    preventDefault?: boolean;
+}
+declare function useHotkey(combo: string, onHotkey: (event: KeyboardEvent) => void, options?: UseHotkeyOptions): void;
+
+export { type ParsedHotkey, type UseHotkeyOptions, detectApple, isEditableTarget, matchHotkey, parseHotkey, useHotkey };

package/dist/hotkey.js

@@ -0,0 +1,15 @@
+"use client";
+import {
+  detectApple,
+  isEditableTarget,
+  matchHotkey,
+  parseHotkey,
+  useHotkey
+} from "./chunk-NKLEB5TR.js";
+export {
+  detectApple,
+  isEditableTarget,
+  matchHotkey,
+  parseHotkey,
+  useHotkey
+};