@burdenoff/fe-libs 2026.510.126

package/dist/shared/hooks/useAsync.d.ts

@@ -0,0 +1,151 @@
+/**
+ * Return type for the useAsync hook
+ */
+export interface UseAsyncReturn<T, Args extends unknown[] = unknown[]> {
+    /**
+     * Execute the async function with the provided arguments
+     */
+    execute: (...args: Args) => Promise<T | undefined>;
+    /**
+     * Whether the async operation is currently in progress
+     */
+    loading: boolean;
+    /**
+     * Error from the last failed async operation, or null if no error
+     */
+    error: Error | null;
+    /**
+     * Data from the last successful async operation, or null if not yet executed
+     */
+    data: T | null;
+    /**
+     * Reset the hook state to initial values
+     */
+    reset: () => void;
+}
+/**
+ * Manages the state and lifecycle of async operations.
+ * Provides loading, error, and data states, with the ability to execute and reset.
+ *
+ * @template T - The return type of the async function
+ * @template Args - The argument types of the async function
+ * @param asyncFunction - The async function to manage
+ * @returns Object containing execute function and state values
+ *
+ * @example
+ * ```tsx
+ * function UserProfile({ userId }: { userId: string }) {
+ *   const { execute, loading, error, data } = useAsync(fetchUser);
+ *
+ *   useEffect(() => {
+ *     execute(userId);
+ *   }, [userId, execute]);
+ *
+ *   if (loading) return <LoadingSpinner />;
+ *   if (error) return <ErrorMessage error={error} />;
+ *   if (!data) return null;
+ *
+ *   return <div>{data.name}</div>;
+ * }
+ * ```
+ *
+ * @example
+ * ```tsx
+ * function SearchComponent() {
+ *   const [query, setQuery] = useState('');
+ *   const { execute, loading, error, data, reset } = useAsync(searchAPI);
+ *
+ *   const handleSearch = async () => {
+ *     if (query.trim()) {
+ *       await execute(query);
+ *     }
+ *   };
+ *
+ *   const handleClear = () => {
+ *     setQuery('');
+ *     reset();
+ *   };
+ *
+ *   return (
+ *     <div>
+ *       <input value={query} onChange={(e) => setQuery(e.target.value)} />
+ *       <button onClick={handleSearch} disabled={loading}>
+ *         {loading ? 'Searching...' : 'Search'}
+ *       </button>
+ *       <button onClick={handleClear}>Clear</button>
+ *       {error && <ErrorDisplay error={error} />}
+ *       {data && <ResultsList results={data} />}
+ *     </div>
+ *   );
+ * }
+ * ```
+ *
+ * @example
+ * ```tsx
+ * function FormSubmission() {
+ *   const { execute, loading, error, data } = useAsync(submitForm);
+ *   const [formData, setFormData] = useState({ name: '', email: '' });
+ *
+ *   const handleSubmit = async (e: React.FormEvent) => {
+ *     e.preventDefault();
+ *     const result = await execute(formData);
+ *     if (result) {
+ *       console.log('Form submitted successfully:', result);
+ *     }
+ *   };
+ *
+ *   return (
+ *     <form onSubmit={handleSubmit}>
+ *       <input
+ *         value={formData.name}
+ *         onChange={(e) => setFormData({ ...formData, name: e.target.value })}
+ *       />
+ *       <input
+ *         value={formData.email}
+ *         onChange={(e) => setFormData({ ...formData, email: e.target.value })}
+ *       />
+ *       <button type="submit" disabled={loading}>
+ *         {loading ? 'Submitting...' : 'Submit'}
+ *       </button>
+ *       {error && <div className="error">{error.message}</div>}
+ *       {data && <div className="success">Success!</div>}
+ *     </form>
+ *   );
+ * }
+ * ```
+ */
+export declare function useAsync<T, Args extends unknown[] = unknown[]>(asyncFunction: (...args: Args) => Promise<T>): UseAsyncReturn<T, Args>;
+/**
+ * Alternative version that immediately executes the async function on mount.
+ * Useful for fetching data when a component mounts.
+ *
+ * @template T - The return type of the async function
+ * @param asyncFunction - The async function to execute
+ * @returns Object containing loading, error, data, and refetch function
+ *
+ * @example
+ * ```tsx
+ * function Dashboard() {
+ *   const { loading, error, data, refetch } = useAsyncImmediate(() =>
+ *     fetchDashboardData()
+ *   );
+ *
+ *   if (loading) return <LoadingSpinner />;
+ *   if (error) return <ErrorMessage error={error} onRetry={refetch} />;
+ *
+ *   return (
+ *     <div>
+ *       <DashboardView data={data} />
+ *       <button onClick={refetch}>Refresh</button>
+ *     </div>
+ *   );
+ * }
+ * ```
+ */
+export declare function useAsyncImmediate<T>(asyncFunction: () => Promise<T>): {
+    loading: boolean;
+    error: Error | null;
+    data: T | null;
+    refetch: () => Promise<void>;
+};
+//# sourceMappingURL=useAsync.d.ts.map

package/dist/shared/hooks/useAsync.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useAsync.d.ts","sourceRoot":"","sources":["../../../src/shared/hooks/useAsync.ts"],"names":[],"mappings":"AAEA;;GAEG;AACH,MAAM,WAAW,cAAc,CAAC,CAAC,EAAE,IAAI,SAAS,OAAO,EAAE,GAAG,OAAO,EAAE;IACnE;;OAEG;IACH,OAAO,EAAE,CAAC,GAAG,IAAI,EAAE,IAAI,KAAK,OAAO,CAAC,CAAC,GAAG,SAAS,CAAC,CAAC;IAEnD;;OAEG;IACH,OAAO,EAAE,OAAO,CAAC;IAEjB;;OAEG;IACH,KAAK,EAAE,KAAK,GAAG,IAAI,CAAC;IAEpB;;OAEG;IACH,IAAI,EAAE,CAAC,GAAG,IAAI,CAAC;IAEf;;OAEG;IACH,KAAK,EAAE,MAAM,IAAI,CAAC;CACnB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA0FG;AACH,wBAAgB,QAAQ,CAAC,CAAC,EAAE,IAAI,SAAS,OAAO,EAAE,GAAG,OAAO,EAAE,EAC5D,aAAa,EAAE,CAAC,GAAG,IAAI,EAAE,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,GAC3C,cAAc,CAAC,CAAC,EAAE,IAAI,CAAC,CAkCzB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,wBAAgB,iBAAiB,CAAC,CAAC,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC,CAAC,CAAC,GAAG;IACrE,OAAO,EAAE,OAAO,CAAC;IACjB,KAAK,EAAE,KAAK,GAAG,IAAI,CAAC;IACpB,IAAI,EAAE,CAAC,GAAG,IAAI,CAAC;IACf,OAAO,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;CAC9B,CAiBA"}

package/dist/shared/hooks/useAsync.js

@@ -0,0 +1,39 @@
+import { useCallback as e, useState as t } from "react";
+//#region src/shared/hooks/useAsync.ts
+function n(n) {
+	let [r, i] = t(!1), [a, o] = t(null), [s, c] = t(null);
+	return {
+		execute: e(async (...e) => {
+			i(!0), o(null);
+			try {
+				let t = await n(...e);
+				return c(t), t;
+			} catch (e) {
+				let t = e instanceof Error ? e : /* @__PURE__ */ Error("An unknown error occurred");
+				o(t), console.error("useAsync error:", t);
+				return;
+			} finally {
+				i(!1);
+			}
+		}, [n]),
+		loading: r,
+		error: a,
+		data: s,
+		reset: e(() => {
+			i(!1), o(null), c(null);
+		}, [])
+	};
+}
+function r(r) {
+	let { execute: i, loading: a, error: o, data: s } = n(r), [c, l] = t(!1), u = e(async () => {
+		await i();
+	}, [i]);
+	return c || (l(!0), i()), {
+		loading: a,
+		error: o,
+		data: s,
+		refetch: u
+	};
+}
+//#endregion
+export { n as useAsync, r as useAsyncImmediate };

package/dist/shared/hooks/useBreakpoint.d.ts

@@ -0,0 +1,83 @@
+/**
+ * Standard breakpoint values matching common design system breakpoints
+ */
+export declare const BREAKPOINTS: {
+    readonly xs: 480;
+    readonly sm: 640;
+    readonly md: 768;
+    readonly lg: 1024;
+    readonly xl: 1280;
+    readonly "2xl": 1536;
+};
+export type Breakpoint = keyof typeof BREAKPOINTS;
+/**
+ * Hook to detect the current responsive breakpoint.
+ * Returns an object with boolean flags for each breakpoint.
+ *
+ * @param customBreakpoints - Optional custom breakpoint values
+ * @returns Object with boolean flags for each breakpoint
+ *
+ * @example
+ * ```tsx
+ * function ResponsiveLayout() {
+ *   const { isMobile, isTablet, isDesktop } = useBreakpoint();
+ *
+ *   if (isMobile) return <MobileLayout />;
+ *   if (isTablet) return <TabletLayout />;
+ *   return <DesktopLayout />;
+ * }
+ * ```
+ *
+ * @example
+ * ```tsx
+ * function Navigation() {
+ *   const { xs, sm, md, lg, xl } = useBreakpoint();
+ *
+ *   return (
+ *     <nav>
+ *       {(xs || sm) && <MobileNav />}
+ *       {md && <TabletNav />}
+ *       {(lg || xl) && <DesktopNav />}
+ *     </nav>
+ *   );
+ * }
+ * ```
+ *
+ * @example
+ * ```tsx
+ * // Using custom breakpoints
+ * function CustomBreakpoint() {
+ *   const breakpoints = useBreakpoint({
+ *     mobile: 375,
+ *     tablet: 768,
+ *     desktop: 1440
+ *   });
+ *
+ *   return <div>Current breakpoint data: {JSON.stringify(breakpoints)}</div>;
+ * }
+ * ```
+ */
+export declare function useBreakpoint<T extends Record<string, number> = typeof BREAKPOINTS>(customBreakpoints?: T): Record<keyof T, boolean> & {
+    isMobile: boolean;
+    isTablet: boolean;
+    isDesktop: boolean;
+    current: keyof T | "base";
+};
+/**
+ * Simple hook to check if viewport is below a specific breakpoint (mobile-first approach).
+ *
+ * @param breakpoint - The breakpoint value in pixels (default: 768)
+ * @returns Whether the viewport is below the breakpoint
+ *
+ * @example
+ * ```tsx
+ * function Component() {
+ *   const isMobile = useMobileBreakpoint();
+ *   const isSmall = useMobileBreakpoint(640);
+ *
+ *   return isMobile ? <MobileView /> : <DesktopView />;
+ * }
+ * ```
+ */
+export declare function useMobileBreakpoint(breakpoint?: number): boolean;
+//# sourceMappingURL=useBreakpoint.d.ts.map

package/dist/shared/hooks/useBreakpoint.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useBreakpoint.d.ts","sourceRoot":"","sources":["../../../src/shared/hooks/useBreakpoint.ts"],"names":[],"mappings":"AAEA;;GAEG;AACH,eAAO,MAAM,WAAW;;;;;;;CAOd,CAAC;AAEX,MAAM,MAAM,UAAU,GAAG,MAAM,OAAO,WAAW,CAAC;AAElD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8CG;AACH,wBAAgB,aAAa,CAC3B,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,OAAO,WAAW,EAErD,iBAAiB,CAAC,EAAE,CAAC,GACpB,MAAM,CAAC,MAAM,CAAC,EAAE,OAAO,CAAC,GAAG;IAC5B,QAAQ,EAAE,OAAO,CAAC;IAClB,QAAQ,EAAE,OAAO,CAAC;IAClB,SAAS,EAAE,OAAO,CAAC;IACnB,OAAO,EAAE,MAAM,CAAC,GAAG,MAAM,CAAC;CAC3B,CAgCA;AAED;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,mBAAmB,CAAC,UAAU,GAAE,MAAY,GAAG,OAAO,CAErE"}

package/dist/shared/hooks/useBreakpoint.js

@@ -0,0 +1,32 @@
+import { useMediaQuery as e } from "./useMediaQuery.js";
+//#region src/shared/hooks/useBreakpoint.ts
+var t = {
+	xs: 480,
+	sm: 640,
+	md: 768,
+	lg: 1024,
+	xl: 1280,
+	"2xl": 1536
+};
+function n(n) {
+	let r = n || t, i = {};
+	for (let [t, n] of Object.entries(r)) i[t] = e(`(min-width: ${n}px)`);
+	let a = "base";
+	for (let [e] of Object.entries(r).reverse()) if (i[e]) {
+		a = e;
+		break;
+	}
+	let o = !i.md, s = i.md && !i.lg, c = i.lg;
+	return {
+		...i,
+		isMobile: o,
+		isTablet: s,
+		isDesktop: c,
+		current: a
+	};
+}
+function r(t = 768) {
+	return e(`(max-width: ${t - 1}px)`);
+}
+//#endregion
+export { t as BREAKPOINTS, n as useBreakpoint, r as useMobileBreakpoint };

package/dist/shared/hooks/useCopyToClipboard.d.ts

@@ -0,0 +1,72 @@
+/**
+ * Provides clipboard copy functionality with automatic timeout for the "copied" state.
+ * Uses the modern Clipboard API for secure, asynchronous copying.
+ *
+ * @param timeout - Duration in milliseconds to keep the "copied" state true (default: 2000ms)
+ * @returns Object containing the copied state and copy function
+ *
+ * @example
+ * ```tsx
+ * function CodeBlock({ code }: { code: string }) {
+ *   const { copied, copy } = useCopyToClipboard();
+ *
+ *   return (
+ *     <div>
+ *       <pre>{code}</pre>
+ *       <button onClick={() => copy(code)}>
+ *         {copied ? 'Copied!' : 'Copy'}
+ *       </button>
+ *     </div>
+ *   );
+ * }
+ * ```
+ *
+ * @example
+ * ```tsx
+ * function ShareLink({ url }: { url: string }) {
+ *   const { copied, copy, error } = useCopyToClipboard(3000);
+ *
+ *   return (
+ *     <div>
+ *       <input value={url} readOnly />
+ *       <button onClick={() => copy(url)} disabled={copied}>
+ *         {copied ? 'Link Copied!' : 'Copy Link'}
+ *       </button>
+ *       {error && <p className="error">Failed to copy: {error.message}</p>}
+ *     </div>
+ *   );
+ * }
+ * ```
+ *
+ * @example
+ * ```tsx
+ * function ApiKeyDisplay({ apiKey }: { apiKey: string }) {
+ *   const { copied, copy } = useCopyToClipboard();
+ *   const [showKey, setShowKey] = useState(false);
+ *
+ *   const handleCopy = async () => {
+ *     await copy(apiKey);
+ *     // Additional actions after successful copy
+ *     trackEvent('api_key_copied');
+ *   };
+ *
+ *   return (
+ *     <div>
+ *       <code>{showKey ? apiKey : '••••••••••••'}</code>
+ *       <button onClick={() => setShowKey(!showKey)}>
+ *         {showKey ? 'Hide' : 'Show'}
+ *       </button>
+ *       <button onClick={handleCopy}>
+ *         {copied ? 'Copied!' : 'Copy Key'}
+ *       </button>
+ *     </div>
+ *   );
+ * }
+ * ```
+ */
+export declare function useCopyToClipboard(timeout?: number): {
+    copied: boolean;
+    copy: (text: string) => Promise<void>;
+    error: Error | null;
+};
+//# sourceMappingURL=useCopyToClipboard.d.ts.map

package/dist/shared/hooks/useCopyToClipboard.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useCopyToClipboard.d.ts","sourceRoot":"","sources":["../../../src/shared/hooks/useCopyToClipboard.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiEG;AACH,wBAAgB,kBAAkB,CAAC,OAAO,GAAE,MAAa,GAAG;IAC1D,MAAM,EAAE,OAAO,CAAC;IAChB,IAAI,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IACtC,KAAK,EAAE,KAAK,GAAG,IAAI,CAAC;CACrB,CAoCA"}

package/dist/shared/hooks/useCopyToClipboard.js

@@ -0,0 +1,26 @@
+import { useCallback as e, useState as t } from "react";
+//#region src/shared/hooks/useCopyToClipboard.ts
+function n(n = 2e3) {
+	let [r, i] = t(!1), [a, o] = t(null);
+	return {
+		copied: r,
+		copy: e(async (e) => {
+			if (!navigator?.clipboard) {
+				let e = /* @__PURE__ */ Error("Clipboard API not available");
+				o(e), console.error("useCopyToClipboard:", e.message);
+				return;
+			}
+			try {
+				await navigator.clipboard.writeText(e), i(!0), o(null), setTimeout(() => {
+					i(!1);
+				}, n);
+			} catch (e) {
+				let t = e instanceof Error ? e : /* @__PURE__ */ Error("Failed to copy to clipboard");
+				o(t), i(!1), console.error("useCopyToClipboard:", t.message);
+			}
+		}, [n]),
+		error: a
+	};
+}
+//#endregion
+export { n as useCopyToClipboard };

package/dist/shared/hooks/useDebounce.d.ts

@@ -0,0 +1,26 @@
+/**
+ * Debounces a rapidly changing value, only updating after the specified delay
+ * has passed without the value changing.
+ *
+ * @template T - The type of the value being debounced
+ * @param value - The value to debounce
+ * @param delay - The delay in milliseconds (default: 300ms)
+ * @returns The debounced value
+ *
+ * @example
+ * ```tsx
+ * function SearchComponent() {
+ *   const [search, setSearch] = useState('');
+ *   const debouncedSearch = useDebounce(search, 500);
+ *
+ *   useEffect(() => {
+ *     // Only triggers 500ms after user stops typing
+ *     fetchResults(debouncedSearch);
+ *   }, [debouncedSearch]);
+ *
+ *   return <input value={search} onChange={(e) => setSearch(e.target.value)} />;
+ * }
+ * ```
+ */
+export declare function useDebounce<T>(value: T, delay?: number): T;
+//# sourceMappingURL=useDebounce.d.ts.map

package/dist/shared/hooks/useDebounce.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDebounce.d.ts","sourceRoot":"","sources":["../../../src/shared/hooks/useDebounce.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,wBAAgB,WAAW,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,KAAK,GAAE,MAAY,GAAG,CAAC,CAgB/D"}

package/dist/shared/hooks/useDebounce.js

@@ -0,0 +1,15 @@
+import { useEffect as e, useState as t } from "react";
+//#region src/shared/hooks/useDebounce.ts
+function n(n, r = 300) {
+	let [i, a] = t(n);
+	return e(() => {
+		let e = setTimeout(() => {
+			a(n);
+		}, r);
+		return () => {
+			clearTimeout(e);
+		};
+	}, [n, r]), i;
+}
+//#endregion
+export { n as useDebounce };

package/dist/shared/hooks/useHasAnimated.d.ts

@@ -0,0 +1,10 @@
+/**
+ * Returns `true` if the current page has already played its entrance
+ * animation. Marks the page as animated after the first paint.
+ *
+ * Unlike a ref-based approach, this survives unmount/remount within
+ * the same route — so loading-state guards that unmount MotionPage
+ * won't cause re-animation when MotionPage remounts.
+ */
+export declare function useHasAnimated(): boolean;
+//# sourceMappingURL=useHasAnimated.d.ts.map

package/dist/shared/hooks/useHasAnimated.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useHasAnimated.d.ts","sourceRoot":"","sources":["../../../src/shared/hooks/useHasAnimated.ts"],"names":[],"mappings":"AAUA;;;;;;;GAOG;AACH,wBAAgB,cAAc,IAAI,OAAO,CAexC"}

package/dist/shared/hooks/useHasAnimated.js

@@ -0,0 +1,16 @@
+import { useEffect as e } from "react";
+//#region src/shared/hooks/useHasAnimated.ts
+var t = /* @__PURE__ */ new Set();
+function n() {
+	let n = typeof window < "u" ? window.location.pathname : "", r = t.has(n);
+	return e(() => {
+		if (!r) {
+			let e = requestAnimationFrame(() => {
+				t.add(n);
+			});
+			return () => cancelAnimationFrame(e);
+		}
+	}, [n, r]), r;
+}
+//#endregion
+export { n as useHasAnimated };

package/dist/shared/hooks/useKeyPress.d.ts

@@ -0,0 +1,116 @@
+/**
+ * Detects when a specific key is pressed.
+ * Returns a boolean indicating whether the key is currently pressed.
+ *
+ * @param targetKey - The key to detect (e.g., 'Enter', 'Escape', 'a', 'ArrowUp')
+ * @returns Whether the target key is currently pressed
+ *
+ * @example
+ * ```tsx
+ * function SearchInput() {
+ *   const [query, setQuery] = useState('');
+ *   const enterPressed = useKeyPress('Enter');
+ *
+ *   useEffect(() => {
+ *     if (enterPressed) {
+ *       performSearch(query);
+ *     }
+ *   }, [enterPressed]);
+ *
+ *   return <input value={query} onChange={(e) => setQuery(e.target.value)} />;
+ * }
+ * ```
+ *
+ * @example
+ * ```tsx
+ * function Modal({ onClose }: { onClose: () => void }) {
+ *   const escapePressed = useKeyPress('Escape');
+ *
+ *   useEffect(() => {
+ *     if (escapePressed) {
+ *       onClose();
+ *     }
+ *   }, [escapePressed, onClose]);
+ *
+ *   return <div>Modal content</div>;
+ * }
+ * ```
+ *
+ * @example
+ * ```tsx
+ * function Game() {
+ *   const wPressed = useKeyPress('w');
+ *   const aPressed = useKeyPress('a');
+ *   const sPressed = useKeyPress('s');
+ *   const dPressed = useKeyPress('d');
+ *
+ *   return (
+ *     <div>
+ *       <p>W: {wPressed ? 'Pressed' : 'Released'}</p>
+ *       <p>A: {aPressed ? 'Pressed' : 'Released'}</p>
+ *       <p>S: {sPressed ? 'Pressed' : 'Released'}</p>
+ *       <p>D: {dPressed ? 'Pressed' : 'Released'}</p>
+ *     </div>
+ *   );
+ * }
+ * ```
+ */
+export declare function useKeyPress(targetKey: string): boolean;
+/**
+ * Detects keyboard shortcuts with modifier keys (Ctrl, Alt, Shift, Meta).
+ * Returns whether the shortcut combination is currently active.
+ *
+ * @param options - Configuration object for the keyboard shortcut
+ * @returns Whether the shortcut is currently active
+ *
+ * @example
+ * ```tsx
+ * function Editor() {
+ *   const saveShortcut = useKeyboardShortcut({ key: 's', ctrlKey: true });
+ *   const boldShortcut = useKeyboardShortcut({ key: 'b', metaKey: true });
+ *
+ *   useEffect(() => {
+ *     if (saveShortcut) {
+ *       handleSave();
+ *     }
+ *   }, [saveShortcut]);
+ *
+ *   useEffect(() => {
+ *     if (boldShortcut) {
+ *       toggleBold();
+ *     }
+ *   }, [boldShortcut]);
+ *
+ *   return <textarea />;
+ * }
+ * ```
+ *
+ * @example
+ * ```tsx
+ * function CommandPalette() {
+ *   const commandPalette = useKeyboardShortcut({
+ *     key: 'k',
+ *     ctrlKey: true,
+ *     shiftKey: true
+ *   });
+ *
+ *   const [isOpen, setIsOpen] = useState(false);
+ *
+ *   useEffect(() => {
+ *     if (commandPalette) {
+ *       setIsOpen(true);
+ *     }
+ *   }, [commandPalette]);
+ *
+ *   return isOpen ? <CommandPaletteModal onClose={() => setIsOpen(false)} /> : null;
+ * }
+ * ```
+ */
+export declare function useKeyboardShortcut(options: {
+    key: string;
+    ctrlKey?: boolean;
+    altKey?: boolean;
+    shiftKey?: boolean;
+    metaKey?: boolean;
+}): boolean;
+//# sourceMappingURL=useKeyPress.d.ts.map

package/dist/shared/hooks/useKeyPress.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useKeyPress.d.ts","sourceRoot":"","sources":["../../../src/shared/hooks/useKeyPress.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAwDG;AACH,wBAAgB,WAAW,CAAC,SAAS,EAAE,MAAM,GAAG,OAAO,CA8BtD;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiDG;AACH,wBAAgB,mBAAmB,CAAC,OAAO,EAAE;IAC3C,GAAG,EAAE,MAAM,CAAC;IACZ,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,GAAG,OAAO,CAmCV"}

package/dist/shared/hooks/useKeyPress.js

@@ -0,0 +1,31 @@
+import { useEffect as e, useState as t } from "react";
+//#region src/shared/hooks/useKeyPress.ts
+function n(n) {
+	let [r, i] = t(!1);
+	return e(() => {
+		let e = (e) => {
+			e.key === n && i(!0);
+		}, t = (e) => {
+			e.key === n && i(!1);
+		};
+		return window.addEventListener("keydown", e), window.addEventListener("keyup", t), () => {
+			window.removeEventListener("keydown", e), window.removeEventListener("keyup", t);
+		};
+	}, [n]), r;
+}
+function r(n) {
+	let [r, i] = t(!1);
+	return e(() => {
+		let e = (e) => {
+			let t = n.ctrlKey === void 0 || e.ctrlKey === n.ctrlKey, r = n.altKey === void 0 || e.altKey === n.altKey, a = n.shiftKey === void 0 || e.shiftKey === n.shiftKey, o = n.metaKey === void 0 || e.metaKey === n.metaKey, s = e.key.toLowerCase() === n.key.toLowerCase();
+			t && r && a && o && s && (e.preventDefault(), i(!0));
+		}, t = () => {
+			i(!1);
+		};
+		return window.addEventListener("keydown", e), window.addEventListener("keyup", t), () => {
+			window.removeEventListener("keydown", e), window.removeEventListener("keyup", t);
+		};
+	}, [n]), r;
+}
+//#endregion
+export { n as useKeyPress, r as useKeyboardShortcut };