@ark-ui/react 5.38.2 → 5.39.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (142) hide show
  1. package/dist/components/anatomy.cjs +7 -0
  2. package/dist/components/anatomy.d.cts +1 -0
  3. package/dist/components/anatomy.d.ts +1 -0
  4. package/dist/components/anatomy.js +2 -1
  5. package/dist/components/collapsible/split-collapsible-props.d.cts +1 -1
  6. package/dist/components/collapsible/split-collapsible-props.d.ts +1 -1
  7. package/dist/components/factory.cjs +9 -1
  8. package/dist/components/factory.js +9 -1
  9. package/dist/components/field/use-field.cjs +1 -1
  10. package/dist/components/field/use-field.js +2 -2
  11. package/dist/components/fieldset/use-fieldset.js +1 -1
  12. package/dist/components/index.cjs +38 -0
  13. package/dist/components/index.d.cts +1 -0
  14. package/dist/components/index.d.ts +1 -0
  15. package/dist/components/index.js +15 -1
  16. package/dist/components/presence/split-presence-props.cjs +1 -0
  17. package/dist/components/presence/split-presence-props.d.cts +1 -1
  18. package/dist/components/presence/split-presence-props.d.ts +1 -1
  19. package/dist/components/presence/split-presence-props.js +1 -0
  20. package/dist/components/presence/use-presence.cjs +1 -0
  21. package/dist/components/presence/use-presence.js +1 -0
  22. package/dist/components/toc/index.cjs +39 -0
  23. package/dist/components/toc/index.d.cts +15 -0
  24. package/dist/components/toc/index.d.ts +15 -0
  25. package/dist/components/toc/index.js +15 -0
  26. package/dist/components/toc/toc-content.cjs +13 -0
  27. package/dist/components/toc/toc-content.d.cts +7 -0
  28. package/dist/components/toc/toc-content.d.ts +7 -0
  29. package/dist/components/toc/toc-content.js +13 -0
  30. package/dist/components/toc/toc-context.cjs +5 -0
  31. package/dist/components/toc/toc-context.d.cts +6 -0
  32. package/dist/components/toc/toc-context.d.ts +6 -0
  33. package/dist/components/toc/toc-context.js +5 -0
  34. package/dist/components/toc/toc-indicator.cjs +17 -0
  35. package/dist/components/toc/toc-indicator.d.cts +7 -0
  36. package/dist/components/toc/toc-indicator.d.ts +7 -0
  37. package/dist/components/toc/toc-indicator.js +17 -0
  38. package/dist/components/toc/toc-item.cjs +24 -0
  39. package/dist/components/toc/toc-item.d.cts +8 -0
  40. package/dist/components/toc/toc-item.d.ts +8 -0
  41. package/dist/components/toc/toc-item.js +24 -0
  42. package/dist/components/toc/toc-link.cjs +19 -0
  43. package/dist/components/toc/toc-link.d.cts +7 -0
  44. package/dist/components/toc/toc-link.d.ts +7 -0
  45. package/dist/components/toc/toc-link.js +19 -0
  46. package/dist/components/toc/toc-list.cjs +17 -0
  47. package/dist/components/toc/toc-list.d.cts +7 -0
  48. package/dist/components/toc/toc-list.d.ts +7 -0
  49. package/dist/components/toc/toc-list.js +17 -0
  50. package/dist/components/toc/toc-nav.cjs +19 -0
  51. package/dist/components/toc/toc-nav.d.cts +8 -0
  52. package/dist/components/toc/toc-nav.d.ts +8 -0
  53. package/dist/components/toc/toc-nav.js +19 -0
  54. package/dist/components/toc/toc-root-provider.cjs +20 -0
  55. package/dist/components/toc/toc-root-provider.d.cts +13 -0
  56. package/dist/components/toc/toc-root-provider.d.ts +13 -0
  57. package/dist/components/toc/toc-root-provider.js +20 -0
  58. package/dist/components/toc/toc-root.cjs +36 -0
  59. package/dist/components/toc/toc-root.d.cts +9 -0
  60. package/dist/components/toc/toc-root.d.ts +9 -0
  61. package/dist/components/toc/toc-root.js +36 -0
  62. package/dist/components/toc/toc-title.cjs +17 -0
  63. package/dist/components/toc/toc-title.d.cts +7 -0
  64. package/dist/components/toc/toc-title.d.ts +7 -0
  65. package/dist/components/toc/toc-title.js +17 -0
  66. package/dist/components/toc/toc.anatomy.d.cts +1 -0
  67. package/dist/components/toc/toc.anatomy.d.ts +1 -0
  68. package/dist/components/toc/toc.anatomy.js +2 -0
  69. package/dist/components/toc/toc.cjs +41 -0
  70. package/dist/components/toc/toc.d.cts +11 -0
  71. package/dist/components/toc/toc.d.ts +11 -0
  72. package/dist/components/toc/toc.js +26 -0
  73. package/dist/components/toc/use-toc-context.cjs +9 -0
  74. package/dist/components/toc/use-toc-context.d.cts +5 -0
  75. package/dist/components/toc/use-toc-context.d.ts +5 -0
  76. package/dist/components/toc/use-toc-context.js +9 -0
  77. package/dist/components/toc/use-toc-item-props-context.cjs +9 -0
  78. package/dist/components/toc/use-toc-item-props-context.d.cts +5 -0
  79. package/dist/components/toc/use-toc-item-props-context.d.ts +5 -0
  80. package/dist/components/toc/use-toc-item-props-context.js +9 -0
  81. package/dist/components/toc/use-toc.cjs +24 -0
  82. package/dist/components/toc/use-toc.d.cts +8 -0
  83. package/dist/components/toc/use-toc.d.ts +8 -0
  84. package/dist/components/toc/use-toc.js +22 -0
  85. package/dist/index.cjs +106 -0
  86. package/dist/index.js +26 -1
  87. package/dist/providers/hotkeys/index.cjs +56 -0
  88. package/dist/providers/hotkeys/index.d.cts +11 -0
  89. package/dist/providers/hotkeys/index.d.ts +11 -0
  90. package/dist/providers/hotkeys/index.js +11 -0
  91. package/dist/providers/hotkeys/use-format-hotkey.cjs +14 -0
  92. package/dist/providers/hotkeys/use-format-hotkey.d.cts +3 -0
  93. package/dist/providers/hotkeys/use-format-hotkey.d.ts +3 -0
  94. package/dist/providers/hotkeys/use-format-hotkey.js +14 -0
  95. package/dist/providers/hotkeys/use-hotkey-recorder.cjs +58 -0
  96. package/dist/providers/hotkeys/use-hotkey-recorder.d.cts +30 -0
  97. package/dist/providers/hotkeys/use-hotkey-recorder.d.ts +30 -0
  98. package/dist/providers/hotkeys/use-hotkey-recorder.js +58 -0
  99. package/dist/providers/hotkeys/use-hotkey-registrations.cjs +12 -0
  100. package/dist/providers/hotkeys/use-hotkey-registrations.d.cts +3 -0
  101. package/dist/providers/hotkeys/use-hotkey-registrations.d.ts +3 -0
  102. package/dist/providers/hotkeys/use-hotkey-registrations.js +12 -0
  103. package/dist/providers/hotkeys/use-hotkey-store.cjs +23 -0
  104. package/dist/providers/hotkeys/use-hotkey-store.d.cts +12 -0
  105. package/dist/providers/hotkeys/use-hotkey-store.d.ts +12 -0
  106. package/dist/providers/hotkeys/use-hotkey-store.js +23 -0
  107. package/dist/providers/hotkeys/use-hotkey.cjs +12 -0
  108. package/dist/providers/hotkeys/use-hotkey.d.cts +4 -0
  109. package/dist/providers/hotkeys/use-hotkey.d.ts +4 -0
  110. package/dist/providers/hotkeys/use-hotkey.js +12 -0
  111. package/dist/providers/hotkeys/use-hotkeys.cjs +69 -0
  112. package/dist/providers/hotkeys/use-hotkeys.d.cts +21 -0
  113. package/dist/providers/hotkeys/use-hotkeys.d.ts +21 -0
  114. package/dist/providers/hotkeys/use-hotkeys.js +69 -0
  115. package/dist/providers/hotkeys/use-is-key-pressed.cjs +13 -0
  116. package/dist/providers/hotkeys/use-is-key-pressed.d.cts +8 -0
  117. package/dist/providers/hotkeys/use-is-key-pressed.d.ts +8 -0
  118. package/dist/providers/hotkeys/use-is-key-pressed.js +13 -0
  119. package/dist/providers/hotkeys/use-platform.cjs +18 -0
  120. package/dist/providers/hotkeys/use-platform.d.cts +2 -0
  121. package/dist/providers/hotkeys/use-platform.d.ts +2 -0
  122. package/dist/providers/hotkeys/use-platform.js +18 -0
  123. package/dist/providers/hotkeys/use-pressed-keys.cjs +12 -0
  124. package/dist/providers/hotkeys/use-pressed-keys.d.cts +2 -0
  125. package/dist/providers/hotkeys/use-pressed-keys.d.ts +2 -0
  126. package/dist/providers/hotkeys/use-pressed-keys.js +12 -0
  127. package/dist/providers/hotkeys/use-store-snapshot.cjs +23 -0
  128. package/dist/providers/hotkeys/use-store-snapshot.d.cts +2 -0
  129. package/dist/providers/hotkeys/use-store-snapshot.d.ts +2 -0
  130. package/dist/providers/hotkeys/use-store-snapshot.js +23 -0
  131. package/dist/providers/index.cjs +55 -0
  132. package/dist/providers/index.d.cts +1 -0
  133. package/dist/providers/index.d.ts +1 -0
  134. package/dist/providers/index.js +11 -1
  135. package/dist/utils/attr.d.cts +1 -0
  136. package/dist/utils/attr.d.ts +1 -0
  137. package/dist/utils/attr.js +2 -0
  138. package/dist/utils/index.cjs +13 -0
  139. package/dist/utils/index.d.cts +1 -0
  140. package/dist/utils/index.d.ts +1 -0
  141. package/dist/utils/index.js +2 -1
  142. package/package.json +71 -68
@@ -0,0 +1,30 @@
1
+ import { HotkeyRecorderOptions, RecordedHotkey } from '@zag-js/hotkeys';
2
+ export interface UseHotkeyRecorderProps extends Omit<HotkeyRecorderOptions, 'target'> {
3
+ }
4
+ export interface UseHotkeyRecorderReturn {
5
+ /**
6
+ * Whether the recorder is currently listening for key events.
7
+ */
8
+ recording: boolean;
9
+ /**
10
+ * The hotkey recorded so far, or `null` if nothing has been recorded.
11
+ */
12
+ value: RecordedHotkey | null;
13
+ /**
14
+ * Start listening for key events.
15
+ */
16
+ start: () => void;
17
+ /**
18
+ * Stop listening and finalize the recorded hotkey.
19
+ */
20
+ stop: () => void;
21
+ /**
22
+ * Stop listening and discard the recorded hotkey.
23
+ */
24
+ cancel: () => void;
25
+ /**
26
+ * Clear the recorded hotkey.
27
+ */
28
+ clear: () => void;
29
+ }
30
+ export declare const useHotkeyRecorder: (props?: UseHotkeyRecorderProps) => UseHotkeyRecorderReturn;
@@ -0,0 +1,30 @@
1
+ import { HotkeyRecorderOptions, RecordedHotkey } from '@zag-js/hotkeys';
2
+ export interface UseHotkeyRecorderProps extends Omit<HotkeyRecorderOptions, 'target'> {
3
+ }
4
+ export interface UseHotkeyRecorderReturn {
5
+ /**
6
+ * Whether the recorder is currently listening for key events.
7
+ */
8
+ recording: boolean;
9
+ /**
10
+ * The hotkey recorded so far, or `null` if nothing has been recorded.
11
+ */
12
+ value: RecordedHotkey | null;
13
+ /**
14
+ * Start listening for key events.
15
+ */
16
+ start: () => void;
17
+ /**
18
+ * Stop listening and finalize the recorded hotkey.
19
+ */
20
+ stop: () => void;
21
+ /**
22
+ * Stop listening and discard the recorded hotkey.
23
+ */
24
+ cancel: () => void;
25
+ /**
26
+ * Clear the recorded hotkey.
27
+ */
28
+ clear: () => void;
29
+ }
30
+ export declare const useHotkeyRecorder: (props?: UseHotkeyRecorderProps) => UseHotkeyRecorderReturn;
@@ -0,0 +1,58 @@
1
+ "use client";
2
+ import { useEnvironmentContext } from "../environment/use-environment-context.js";
3
+ import { useSafeLayoutEffect } from "../../utils/use-safe-layout-effect.js";
4
+ import { useEvent } from "../../utils/use-event.js";
5
+ import { useCallback, useMemo, useRef, useState, useSyncExternalStore } from "react";
6
+ import { createHotkeyRecorder } from "@zag-js/hotkeys";
7
+ //#region src/providers/hotkeys/use-hotkey-recorder.ts
8
+ var useHotkeyRecorder = (props = {}) => {
9
+ const { formatOptions, sequenceTimeoutMs } = props;
10
+ const env = useEnvironmentContext();
11
+ const [recorder] = useState(() => createHotkeyRecorder());
12
+ const onRecord = useEvent(props.onRecord);
13
+ const onCancel = useEvent(props.onCancel);
14
+ const onClear = useEvent(props.onClear);
15
+ useSafeLayoutEffect(() => {
16
+ recorder.init(env.getRootNode());
17
+ recorder.setOptions({
18
+ onRecord,
19
+ onCancel,
20
+ onClear
21
+ });
22
+ return () => {
23
+ recorder.destroy();
24
+ };
25
+ }, [
26
+ recorder,
27
+ env,
28
+ onRecord,
29
+ onCancel,
30
+ onClear
31
+ ]);
32
+ const formatRef = useRef(formatOptions);
33
+ formatRef.current = formatOptions;
34
+ const formatKey = formatOptions ? JSON.stringify(formatOptions) : "";
35
+ useSafeLayoutEffect(() => {
36
+ recorder.setOptions({
37
+ ...formatRef.current && { formatOptions: formatRef.current },
38
+ ...sequenceTimeoutMs !== void 0 && { sequenceTimeoutMs }
39
+ });
40
+ }, [
41
+ recorder,
42
+ formatKey,
43
+ sequenceTimeoutMs
44
+ ]);
45
+ const subscribe = useCallback((onChange) => recorder.subscribe(onChange), [recorder]);
46
+ const getSnapshot = useCallback(() => recorder.getState(), [recorder]);
47
+ const state = useSyncExternalStore(subscribe, getSnapshot, getSnapshot);
48
+ return useMemo(() => ({
49
+ recording: state.recording,
50
+ value: state.value,
51
+ start: () => void recorder.start(),
52
+ stop: () => void recorder.stop(),
53
+ cancel: () => void recorder.cancel(),
54
+ clear: () => void recorder.clear()
55
+ }), [state, recorder]);
56
+ };
57
+ //#endregion
58
+ export { useHotkeyRecorder };
@@ -0,0 +1,12 @@
1
+ "use client";
2
+ const require_use_hotkey_store = require("./use-hotkey-store.cjs");
3
+ const require_use_store_snapshot = require("./use-store-snapshot.cjs");
4
+ //#region src/providers/hotkeys/use-hotkey-registrations.ts
5
+ var getVersion = (state) => Array.from(state.commands.values(), (command) => `${command.id}:${command.hotkey}:${command.label ?? ""}`).join("|");
6
+ var build = (state) => Array.from(state.commands.values());
7
+ var useHotkeyRegistrations = (props = {}) => {
8
+ const store = require_use_hotkey_store.useHotkeyStore(props);
9
+ return require_use_store_snapshot.useStoreSnapshot(store, getVersion, build);
10
+ };
11
+ //#endregion
12
+ exports.useHotkeyRegistrations = useHotkeyRegistrations;
@@ -0,0 +1,3 @@
1
+ import { HotkeyCommand } from '@zag-js/hotkeys';
2
+ import { UseHotkeyStoreProps } from './use-hotkey-store.js';
3
+ export declare const useHotkeyRegistrations: (props?: UseHotkeyStoreProps) => HotkeyCommand[];
@@ -0,0 +1,3 @@
1
+ import { HotkeyCommand } from '@zag-js/hotkeys';
2
+ import { UseHotkeyStoreProps } from './use-hotkey-store.js';
3
+ export declare const useHotkeyRegistrations: (props?: UseHotkeyStoreProps) => HotkeyCommand[];
@@ -0,0 +1,12 @@
1
+ "use client";
2
+ import { useHotkeyStore } from "./use-hotkey-store.js";
3
+ import { useStoreSnapshot } from "./use-store-snapshot.js";
4
+ //#region src/providers/hotkeys/use-hotkey-registrations.ts
5
+ var getVersion = (state) => Array.from(state.commands.values(), (command) => `${command.id}:${command.hotkey}:${command.label ?? ""}`).join("|");
6
+ var build = (state) => Array.from(state.commands.values());
7
+ var useHotkeyRegistrations = (props = {}) => {
8
+ const store = useHotkeyStore(props);
9
+ return useStoreSnapshot(store, getVersion, build);
10
+ };
11
+ //#endregion
12
+ export { useHotkeyRegistrations };
@@ -0,0 +1,23 @@
1
+ "use client";
2
+ const require_use_environment_context = require("../environment/use-environment-context.cjs");
3
+ const require_use_safe_layout_effect = require("../../utils/use-safe-layout-effect.cjs");
4
+ let _zag_js_hotkeys = require("@zag-js/hotkeys");
5
+ //#region src/providers/hotkeys/use-hotkey-store.ts
6
+ var defaultHotkeyStore;
7
+ var getDefaultHotkeyStore = () => {
8
+ defaultHotkeyStore ??= (0, _zag_js_hotkeys.createHotkeyStore)();
9
+ return defaultHotkeyStore;
10
+ };
11
+ var initialized = /* @__PURE__ */ new WeakSet();
12
+ var useHotkeyStore = (props = {}) => {
13
+ const env = require_use_environment_context.useEnvironmentContext();
14
+ const store = props.store ?? getDefaultHotkeyStore();
15
+ require_use_safe_layout_effect.useSafeLayoutEffect(() => {
16
+ if (initialized.has(store)) return;
17
+ initialized.add(store);
18
+ store.init({ target: env.getRootNode() });
19
+ }, [store, env]);
20
+ return store;
21
+ };
22
+ //#endregion
23
+ exports.useHotkeyStore = useHotkeyStore;
@@ -0,0 +1,12 @@
1
+ import { HotkeyStore } from '@zag-js/hotkeys';
2
+ export interface UseHotkeyStoreProps {
3
+ /**
4
+ * The store to read from and register on. Defaults to a store shared by every hook that
5
+ * does not name one.
6
+ *
7
+ * Keep it stable: build it outside the component or memoize it, since a store created
8
+ * during render is rebuilt on every render and loses its registrations.
9
+ */
10
+ store?: HotkeyStore | undefined;
11
+ }
12
+ export declare const useHotkeyStore: (props?: UseHotkeyStoreProps) => HotkeyStore;
@@ -0,0 +1,12 @@
1
+ import { HotkeyStore } from '@zag-js/hotkeys';
2
+ export interface UseHotkeyStoreProps {
3
+ /**
4
+ * The store to read from and register on. Defaults to a store shared by every hook that
5
+ * does not name one.
6
+ *
7
+ * Keep it stable: build it outside the component or memoize it, since a store created
8
+ * during render is rebuilt on every render and loses its registrations.
9
+ */
10
+ store?: HotkeyStore | undefined;
11
+ }
12
+ export declare const useHotkeyStore: (props?: UseHotkeyStoreProps) => HotkeyStore;
@@ -0,0 +1,23 @@
1
+ "use client";
2
+ import { useEnvironmentContext } from "../environment/use-environment-context.js";
3
+ import { useSafeLayoutEffect } from "../../utils/use-safe-layout-effect.js";
4
+ import { createHotkeyStore } from "@zag-js/hotkeys";
5
+ //#region src/providers/hotkeys/use-hotkey-store.ts
6
+ var defaultHotkeyStore;
7
+ var getDefaultHotkeyStore = () => {
8
+ defaultHotkeyStore ??= createHotkeyStore();
9
+ return defaultHotkeyStore;
10
+ };
11
+ var initialized = /* @__PURE__ */ new WeakSet();
12
+ var useHotkeyStore = (props = {}) => {
13
+ const env = useEnvironmentContext();
14
+ const store = props.store ?? getDefaultHotkeyStore();
15
+ useSafeLayoutEffect(() => {
16
+ if (initialized.has(store)) return;
17
+ initialized.add(store);
18
+ store.init({ target: env.getRootNode() });
19
+ }, [store, env]);
20
+ return store;
21
+ };
22
+ //#endregion
23
+ export { useHotkeyStore };
@@ -0,0 +1,12 @@
1
+ "use client";
2
+ const require_use_hotkeys = require("./use-hotkeys.cjs");
3
+ //#region src/providers/hotkeys/use-hotkey.ts
4
+ var useHotkey = (props) => {
5
+ const { store, ...command } = props;
6
+ require_use_hotkeys.useHotkeys({
7
+ commands: [command],
8
+ store
9
+ });
10
+ };
11
+ //#endregion
12
+ exports.useHotkey = useHotkey;
@@ -0,0 +1,4 @@
1
+ import { UseHotkeysCommand, UseHotkeysProps } from './use-hotkeys.js';
2
+ export interface UseHotkeyProps extends UseHotkeysCommand, Pick<UseHotkeysProps, 'store'> {
3
+ }
4
+ export declare const useHotkey: (props: UseHotkeyProps) => void;
@@ -0,0 +1,4 @@
1
+ import { UseHotkeysCommand, UseHotkeysProps } from './use-hotkeys.js';
2
+ export interface UseHotkeyProps extends UseHotkeysCommand, Pick<UseHotkeysProps, 'store'> {
3
+ }
4
+ export declare const useHotkey: (props: UseHotkeyProps) => void;
@@ -0,0 +1,12 @@
1
+ "use client";
2
+ import { useHotkeys } from "./use-hotkeys.js";
3
+ //#region src/providers/hotkeys/use-hotkey.ts
4
+ var useHotkey = (props) => {
5
+ const { store, ...command } = props;
6
+ useHotkeys({
7
+ commands: [command],
8
+ store
9
+ });
10
+ };
11
+ //#endregion
12
+ export { useHotkey };
@@ -0,0 +1,69 @@
1
+ "use client";
2
+ const require_use_platform = require("./use-platform.cjs");
3
+ const require_use_hotkey_store = require("./use-hotkey-store.cjs");
4
+ let _zag_js_utils = require("@zag-js/utils");
5
+ let react = require("react");
6
+ let _zag_js_hotkeys = require("@zag-js/hotkeys");
7
+ //#region src/providers/hotkeys/use-hotkeys.ts
8
+ var warnOnForeignId = (store, id) => {
9
+ (0, _zag_js_utils.warn)(store.getState().commands.has(id), `[ark-ui/hotkeys] Command id "${id}" is already registered on this store by another component, so the earlier command will stop firing. Use a unique id, omit it to have one generated, or register on a separate store.`);
10
+ };
11
+ var toRegistration = (command, platform) => ({
12
+ hotkey: (0, _zag_js_hotkeys.normalizeHotkey)(command.hotkey, platform),
13
+ scopes: command.scopes,
14
+ label: command.label,
15
+ description: command.description,
16
+ category: command.category,
17
+ keywords: command.keywords,
18
+ options: command.options
19
+ });
20
+ var useHotkeys = (props) => {
21
+ const store = require_use_hotkey_store.useHotkeyStore(props);
22
+ const platform = require_use_platform.usePlatform();
23
+ const generatedId = (0, react.useId)();
24
+ const instanceId = props.id ?? generatedId;
25
+ const commandsRef = (0, react.useRef)(props.commands);
26
+ commandsRef.current = props.commands;
27
+ const registered = (0, react.useRef)(/* @__PURE__ */ new Map());
28
+ const resolveId = (command, index) => command.id ?? `${instanceId}:${index}`;
29
+ const findCommand = (id) => commandsRef.current.find((item, index) => resolveId(item, index) === id);
30
+ (0, react.useEffect)(() => {
31
+ const current = commandsRef.current;
32
+ const nextIds = new Set(current.map(resolveId));
33
+ for (const id of [...registered.current.keys()]) {
34
+ if (nextIds.has(id)) continue;
35
+ store.unregister(id);
36
+ registered.current.delete(id);
37
+ }
38
+ current.forEach((command, index) => {
39
+ const id = resolveId(command, index);
40
+ const next = toRegistration(command, platform);
41
+ const previous = registered.current.get(id);
42
+ if (previous && (0, _zag_js_utils.isEqual)(previous, next)) return;
43
+ if (previous) store.unregister(id);
44
+ else warnOnForeignId(store, id);
45
+ store.register({
46
+ ...command,
47
+ id,
48
+ action: (event) => {
49
+ findCommand(id)?.action(event);
50
+ },
51
+ enabled: () => {
52
+ const enabled = findCommand(id)?.enabled;
53
+ if (enabled === void 0) return true;
54
+ return typeof enabled === "function" ? enabled() : enabled;
55
+ }
56
+ });
57
+ registered.current.set(id, next);
58
+ });
59
+ });
60
+ (0, react.useEffect)(() => {
61
+ const registry = registered.current;
62
+ return () => {
63
+ for (const id of registry.keys()) store.unregister(id);
64
+ registry.clear();
65
+ };
66
+ }, [store]);
67
+ };
68
+ //#endregion
69
+ exports.useHotkeys = useHotkeys;
@@ -0,0 +1,21 @@
1
+ import { CommandDefinition } from '@zag-js/hotkeys';
2
+ import { UseHotkeyStoreProps } from './use-hotkey-store.js';
3
+ export interface UseHotkeysCommand extends Omit<CommandDefinition, 'id'> {
4
+ /**
5
+ * Identifies the command across renders. One is generated when omitted, which is enough
6
+ * unless something else needs to address this command by name.
7
+ */
8
+ id?: string | undefined;
9
+ }
10
+ export interface UseHotkeysProps extends UseHotkeyStoreProps {
11
+ /**
12
+ * The commands to register.
13
+ */
14
+ commands: UseHotkeysCommand[];
15
+ /**
16
+ * Prefix for the ids generated for commands that do not set their own. One is generated
17
+ * when omitted.
18
+ */
19
+ id?: string | undefined;
20
+ }
21
+ export declare const useHotkeys: (props: UseHotkeysProps) => void;
@@ -0,0 +1,21 @@
1
+ import { CommandDefinition } from '@zag-js/hotkeys';
2
+ import { UseHotkeyStoreProps } from './use-hotkey-store.js';
3
+ export interface UseHotkeysCommand extends Omit<CommandDefinition, 'id'> {
4
+ /**
5
+ * Identifies the command across renders. One is generated when omitted, which is enough
6
+ * unless something else needs to address this command by name.
7
+ */
8
+ id?: string | undefined;
9
+ }
10
+ export interface UseHotkeysProps extends UseHotkeyStoreProps {
11
+ /**
12
+ * The commands to register.
13
+ */
14
+ commands: UseHotkeysCommand[];
15
+ /**
16
+ * Prefix for the ids generated for commands that do not set their own. One is generated
17
+ * when omitted.
18
+ */
19
+ id?: string | undefined;
20
+ }
21
+ export declare const useHotkeys: (props: UseHotkeysProps) => void;
@@ -0,0 +1,69 @@
1
+ "use client";
2
+ import { usePlatform } from "./use-platform.js";
3
+ import { useHotkeyStore } from "./use-hotkey-store.js";
4
+ import { isEqual, warn } from "@zag-js/utils";
5
+ import { useEffect, useId, useRef } from "react";
6
+ import { normalizeHotkey } from "@zag-js/hotkeys";
7
+ //#region src/providers/hotkeys/use-hotkeys.ts
8
+ var warnOnForeignId = (store, id) => {
9
+ warn(store.getState().commands.has(id), `[ark-ui/hotkeys] Command id "${id}" is already registered on this store by another component, so the earlier command will stop firing. Use a unique id, omit it to have one generated, or register on a separate store.`);
10
+ };
11
+ var toRegistration = (command, platform) => ({
12
+ hotkey: normalizeHotkey(command.hotkey, platform),
13
+ scopes: command.scopes,
14
+ label: command.label,
15
+ description: command.description,
16
+ category: command.category,
17
+ keywords: command.keywords,
18
+ options: command.options
19
+ });
20
+ var useHotkeys = (props) => {
21
+ const store = useHotkeyStore(props);
22
+ const platform = usePlatform();
23
+ const generatedId = useId();
24
+ const instanceId = props.id ?? generatedId;
25
+ const commandsRef = useRef(props.commands);
26
+ commandsRef.current = props.commands;
27
+ const registered = useRef(/* @__PURE__ */ new Map());
28
+ const resolveId = (command, index) => command.id ?? `${instanceId}:${index}`;
29
+ const findCommand = (id) => commandsRef.current.find((item, index) => resolveId(item, index) === id);
30
+ useEffect(() => {
31
+ const current = commandsRef.current;
32
+ const nextIds = new Set(current.map(resolveId));
33
+ for (const id of [...registered.current.keys()]) {
34
+ if (nextIds.has(id)) continue;
35
+ store.unregister(id);
36
+ registered.current.delete(id);
37
+ }
38
+ current.forEach((command, index) => {
39
+ const id = resolveId(command, index);
40
+ const next = toRegistration(command, platform);
41
+ const previous = registered.current.get(id);
42
+ if (previous && isEqual(previous, next)) return;
43
+ if (previous) store.unregister(id);
44
+ else warnOnForeignId(store, id);
45
+ store.register({
46
+ ...command,
47
+ id,
48
+ action: (event) => {
49
+ findCommand(id)?.action(event);
50
+ },
51
+ enabled: () => {
52
+ const enabled = findCommand(id)?.enabled;
53
+ if (enabled === void 0) return true;
54
+ return typeof enabled === "function" ? enabled() : enabled;
55
+ }
56
+ });
57
+ registered.current.set(id, next);
58
+ });
59
+ });
60
+ useEffect(() => {
61
+ const registry = registered.current;
62
+ return () => {
63
+ for (const id of registry.keys()) store.unregister(id);
64
+ registry.clear();
65
+ };
66
+ }, [store]);
67
+ };
68
+ //#endregion
69
+ export { useHotkeys };
@@ -0,0 +1,13 @@
1
+ "use client";
2
+ const require_use_hotkey_store = require("./use-hotkey-store.cjs");
3
+ let react = require("react");
4
+ //#region src/providers/hotkeys/use-is-key-pressed.ts
5
+ var useIsKeyPressed = (props) => {
6
+ const { hotkey } = props;
7
+ const store = require_use_hotkey_store.useHotkeyStore(props);
8
+ const subscribe = (0, react.useCallback)((onChange) => store.subscribe(() => store.isPressed(hotkey), onChange), [store, hotkey]);
9
+ const getSnapshot = (0, react.useCallback)(() => store.isPressed(hotkey), [store, hotkey]);
10
+ return (0, react.useSyncExternalStore)(subscribe, getSnapshot, getSnapshot);
11
+ };
12
+ //#endregion
13
+ exports.useIsKeyPressed = useIsKeyPressed;
@@ -0,0 +1,8 @@
1
+ import { UseHotkeyStoreProps } from './use-hotkey-store.js';
2
+ export interface UseIsKeyPressedProps extends UseHotkeyStoreProps {
3
+ /**
4
+ * The key or combination to watch.
5
+ */
6
+ hotkey: string;
7
+ }
8
+ export declare const useIsKeyPressed: (props: UseIsKeyPressedProps) => boolean;
@@ -0,0 +1,8 @@
1
+ import { UseHotkeyStoreProps } from './use-hotkey-store.js';
2
+ export interface UseIsKeyPressedProps extends UseHotkeyStoreProps {
3
+ /**
4
+ * The key or combination to watch.
5
+ */
6
+ hotkey: string;
7
+ }
8
+ export declare const useIsKeyPressed: (props: UseIsKeyPressedProps) => boolean;
@@ -0,0 +1,13 @@
1
+ "use client";
2
+ import { useHotkeyStore } from "./use-hotkey-store.js";
3
+ import { useCallback, useSyncExternalStore } from "react";
4
+ //#region src/providers/hotkeys/use-is-key-pressed.ts
5
+ var useIsKeyPressed = (props) => {
6
+ const { hotkey } = props;
7
+ const store = useHotkeyStore(props);
8
+ const subscribe = useCallback((onChange) => store.subscribe(() => store.isPressed(hotkey), onChange), [store, hotkey]);
9
+ const getSnapshot = useCallback(() => store.isPressed(hotkey), [store, hotkey]);
10
+ return useSyncExternalStore(subscribe, getSnapshot, getSnapshot);
11
+ };
12
+ //#endregion
13
+ export { useIsKeyPressed };
@@ -0,0 +1,18 @@
1
+ "use client";
2
+ let react = require("react");
3
+ let _zag_js_dom_query = require("@zag-js/dom-query");
4
+ //#region src/providers/hotkeys/use-platform.ts
5
+ var isLinux = () => /^Linux|^CrOS/i.test((0, _zag_js_dom_query.getPlatform)()) && !(0, _zag_js_dom_query.isAndroid)();
6
+ var subscribe = () => () => {};
7
+ var detect = () => {
8
+ if ((0, _zag_js_dom_query.isApple)()) return "mac";
9
+ if (isLinux()) return "linux";
10
+ return "windows";
11
+ };
12
+ var usePlatform = () => {
13
+ const getSnapshot = (0, react.useCallback)(detect, []);
14
+ const getServerSnapshot = (0, react.useCallback)(() => "windows", []);
15
+ return (0, react.useSyncExternalStore)(subscribe, getSnapshot, getServerSnapshot);
16
+ };
17
+ //#endregion
18
+ exports.usePlatform = usePlatform;
@@ -0,0 +1,2 @@
1
+ export type Platform = 'mac' | 'windows' | 'linux';
2
+ export declare const usePlatform: () => Platform;
@@ -0,0 +1,2 @@
1
+ export type Platform = 'mac' | 'windows' | 'linux';
2
+ export declare const usePlatform: () => Platform;
@@ -0,0 +1,18 @@
1
+ "use client";
2
+ import { useCallback, useSyncExternalStore } from "react";
3
+ import { getPlatform, isAndroid, isApple } from "@zag-js/dom-query";
4
+ //#region src/providers/hotkeys/use-platform.ts
5
+ var isLinux = () => /^Linux|^CrOS/i.test(getPlatform()) && !isAndroid();
6
+ var subscribe = () => () => {};
7
+ var detect = () => {
8
+ if (isApple()) return "mac";
9
+ if (isLinux()) return "linux";
10
+ return "windows";
11
+ };
12
+ var usePlatform = () => {
13
+ const getSnapshot = useCallback(detect, []);
14
+ const getServerSnapshot = useCallback(() => "windows", []);
15
+ return useSyncExternalStore(subscribe, getSnapshot, getServerSnapshot);
16
+ };
17
+ //#endregion
18
+ export { usePlatform };
@@ -0,0 +1,12 @@
1
+ "use client";
2
+ const require_use_hotkey_store = require("./use-hotkey-store.cjs");
3
+ const require_use_store_snapshot = require("./use-store-snapshot.cjs");
4
+ //#region src/providers/hotkeys/use-pressed-keys.ts
5
+ var getVersion = (state) => Array.from(state.pressedKeys).join("|");
6
+ var build = (state) => Array.from(state.pressedKeys);
7
+ var usePressedKeys = (props = {}) => {
8
+ const store = require_use_hotkey_store.useHotkeyStore(props);
9
+ return require_use_store_snapshot.useStoreSnapshot(store, getVersion, build);
10
+ };
11
+ //#endregion
12
+ exports.usePressedKeys = usePressedKeys;
@@ -0,0 +1,2 @@
1
+ import { UseHotkeyStoreProps } from './use-hotkey-store.js';
2
+ export declare const usePressedKeys: (props?: UseHotkeyStoreProps) => string[];
@@ -0,0 +1,2 @@
1
+ import { UseHotkeyStoreProps } from './use-hotkey-store.js';
2
+ export declare const usePressedKeys: (props?: UseHotkeyStoreProps) => string[];
@@ -0,0 +1,12 @@
1
+ "use client";
2
+ import { useHotkeyStore } from "./use-hotkey-store.js";
3
+ import { useStoreSnapshot } from "./use-store-snapshot.js";
4
+ //#region src/providers/hotkeys/use-pressed-keys.ts
5
+ var getVersion = (state) => Array.from(state.pressedKeys).join("|");
6
+ var build = (state) => Array.from(state.pressedKeys);
7
+ var usePressedKeys = (props = {}) => {
8
+ const store = useHotkeyStore(props);
9
+ return useStoreSnapshot(store, getVersion, build);
10
+ };
11
+ //#endregion
12
+ export { usePressedKeys };
@@ -0,0 +1,23 @@
1
+ "use client";
2
+ let react = require("react");
3
+ //#region src/providers/hotkeys/use-store-snapshot.ts
4
+ function useStoreSnapshot(store, getVersion, build) {
5
+ const cache = (0, react.useRef)(null);
6
+ const subscribe = (0, react.useCallback)((onChange) => store.subscribe(getVersion, onChange), [store, getVersion]);
7
+ const getSnapshot = (0, react.useCallback)(() => {
8
+ const state = store.getState();
9
+ const version = getVersion(state);
10
+ if (cache.current?.version !== version) cache.current = {
11
+ version,
12
+ value: build(state)
13
+ };
14
+ return cache.current.value;
15
+ }, [
16
+ store,
17
+ getVersion,
18
+ build
19
+ ]);
20
+ return (0, react.useSyncExternalStore)(subscribe, getSnapshot, getSnapshot);
21
+ }
22
+ //#endregion
23
+ exports.useStoreSnapshot = useStoreSnapshot;
@@ -0,0 +1,2 @@
1
+ import { HotkeyStore, HotkeyStoreState } from '@zag-js/hotkeys';
2
+ export declare function useStoreSnapshot<T>(store: HotkeyStore, getVersion: (state: HotkeyStoreState) => string, build: (state: HotkeyStoreState) => T): T;
@@ -0,0 +1,2 @@
1
+ import { HotkeyStore, HotkeyStoreState } from '@zag-js/hotkeys';
2
+ export declare function useStoreSnapshot<T>(store: HotkeyStore, getVersion: (state: HotkeyStoreState) => string, build: (state: HotkeyStoreState) => T): T;
@@ -0,0 +1,23 @@
1
+ "use client";
2
+ import { useCallback, useRef, useSyncExternalStore } from "react";
3
+ //#region src/providers/hotkeys/use-store-snapshot.ts
4
+ function useStoreSnapshot(store, getVersion, build) {
5
+ const cache = useRef(null);
6
+ const subscribe = useCallback((onChange) => store.subscribe(getVersion, onChange), [store, getVersion]);
7
+ const getSnapshot = useCallback(() => {
8
+ const state = store.getState();
9
+ const version = getVersion(state);
10
+ if (cache.current?.version !== version) cache.current = {
11
+ version,
12
+ value: build(state)
13
+ };
14
+ return cache.current.value;
15
+ }, [
16
+ store,
17
+ getVersion,
18
+ build
19
+ ]);
20
+ return useSyncExternalStore(subscribe, getSnapshot, getSnapshot);
21
+ }
22
+ //#endregion
23
+ export { useStoreSnapshot };