@dxos/react-hooks 0.6.11 → 0.6.12-main.5cc132e

package/dist/lib/node-esm/index.mjs

@@ -0,0 +1,324 @@
+// packages/ui/primitives/react-hooks/src/useAsyncCallback.ts
+import { useEffect, useState } from "react";
+var useAsyncCallback = (cb) => {
+  const [value, setValue] = useState();
+  useEffect(() => {
+    const t = setTimeout(async () => {
+      const data = await cb();
+      setValue(data);
+    });
+    return () => clearTimeout(t);
+  }, []);
+  return value;
+};
+
+// packages/ui/primitives/react-hooks/src/useAsyncEffect.ts
+import { useEffect as useEffect2 } from "react";
+import { log } from "@dxos/log";
+var useAsyncEffect = (callback, destructor, deps) => {
+  const [effectDestructor, effectDeps] = typeof destructor === "function" ? [
+    destructor,
+    deps
+  ] : [
+    void 0,
+    destructor
+  ];
+  useEffect2(() => {
+    let mounted = true;
+    let value;
+    const asyncResult = callback(() => mounted);
+    void Promise.resolve(asyncResult).then((result) => {
+      value = result;
+    }).catch(log.catch);
+    return () => {
+      mounted = false;
+      effectDestructor?.(value);
+    };
+  }, effectDeps);
+};
+
+// packages/ui/primitives/react-hooks/src/useControlledValue.ts
+import { useEffect as useEffect3, useState as useState2 } from "react";
+var useControlledValue = (controlledValue) => {
+  const [value, setValue] = useState2(controlledValue);
+  useEffect3(() => {
+    if (controlledValue !== void 0) {
+      setValue(controlledValue);
+    }
+  }, [
+    controlledValue
+  ]);
+  return [
+    value,
+    setValue
+  ];
+};
+
+// packages/ui/primitives/react-hooks/src/useDebugReactDeps.ts
+import { useEffect as useEffect4, useRef } from "react";
+var useDebugReactDeps = (deps = []) => {
+  const lastDeps = useRef([]);
+  useEffect4(() => {
+    console.group("deps changed", {
+      old: lastDeps.current.length,
+      new: deps.length
+    });
+    for (let i = 0; i < Math.max(lastDeps.current.length ?? 0, deps.length ?? 0); i++) {
+      console.log(i, lastDeps.current[i] === deps[i] ? "SAME" : "CHANGED", {
+        previous: lastDeps.current[i],
+        current: deps[i]
+      });
+    }
+    console.groupEnd();
+    lastDeps.current = deps;
+  }, deps);
+};
+
+// packages/ui/primitives/react-hooks/src/useDefaultValue.ts
+import { useEffect as useEffect5, useState as useState3, useMemo } from "react";
+var useDefaultValue = (reactiveValue, defaultValue) => {
+  const stableDefaultValue = useMemo(() => defaultValue, []);
+  const [value, setValue] = useState3(reactiveValue ?? stableDefaultValue);
+  useEffect5(() => {
+    setValue(reactiveValue ?? stableDefaultValue);
+  }, [
+    reactiveValue,
+    stableDefaultValue
+  ]);
+  return value;
+};
+
+// packages/ui/primitives/react-hooks/src/useDynamicRef.ts
+import { useEffect as useEffect6, useRef as useRef2 } from "react";
+var useDynamicRef = (value) => {
+  const ref = useRef2(value);
+  useEffect6(() => {
+    ref.current = value;
+  }, [
+    value
+  ]);
+  return ref;
+};
+
+// packages/ui/primitives/react-hooks/src/useFileDownload.ts
+import { useMemo as useMemo2 } from "react";
+var useFileDownload = () => {
+  return useMemo2(() => (data, filename) => {
+    const url = typeof data === "string" ? data : URL.createObjectURL(data);
+    const element = document.createElement("a");
+    element.setAttribute("href", url);
+    element.setAttribute("download", filename);
+    element.setAttribute("target", "download");
+    element.click();
+  }, []);
+};
+
+// packages/ui/primitives/react-hooks/src/useForwardedRef.ts
+import { useRef as useRef3, useEffect as useEffect7 } from "react";
+var useForwardedRef = (ref) => {
+  const innerRef = useRef3(null);
+  useEffect7(() => {
+    if (!ref) {
+      return;
+    }
+    if (typeof ref === "function") {
+      ref(innerRef.current);
+    } else {
+      ref.current = innerRef.current;
+    }
+  });
+  return innerRef;
+};
+
+// packages/ui/primitives/react-hooks/src/useId.ts
+import alea from "alea";
+import { useMemo as useMemo3 } from "react";
+var Alea = alea;
+var prng = new Alea("@dxos/react-hooks");
+var randomString = (n = 4) => prng().toString(16).slice(2, n + 2);
+var useId = (namespace, propsId, opts) => useMemo3(() => propsId ?? `${namespace}-${randomString(opts?.n ?? 4)}`, [
+  propsId
+]);
+
+// packages/ui/primitives/react-hooks/src/useIsFocused.ts
+import { useEffect as useEffect8, useRef as useRef4, useState as useState4 } from "react";
+var useIsFocused = (inputRef) => {
+  const [isFocused, setIsFocused] = useState4(void 0);
+  const isFocusedRef = useRef4(isFocused);
+  isFocusedRef.current = isFocused;
+  useEffect8(() => {
+    const input = inputRef.current;
+    if (!input) {
+      return;
+    }
+    const onFocus = () => setIsFocused(true);
+    const onBlur = () => setIsFocused(false);
+    input.addEventListener("focus", onFocus);
+    input.addEventListener("blur", onBlur);
+    if (isFocusedRef.current === void 0) {
+      setIsFocused(document.activeElement === input);
+    }
+    return () => {
+      input.removeEventListener("focus", onFocus);
+      input.removeEventListener("blur", onBlur);
+    };
+  }, [
+    inputRef,
+    setIsFocused
+  ]);
+  return isFocused;
+};
+
+// packages/ui/primitives/react-hooks/src/useMediaQuery.ts
+import { useEffect as useEffect9, useState as useState5 } from "react";
+var breakpointMediaQueries = {
+  sm: "(min-width: 640px)",
+  md: "(min-width: 768px)",
+  lg: "(min-width: 1024px)",
+  xl: "(min-width: 1280px)",
+  "2xl": "(min-width: 1536px)"
+};
+var useMediaQuery = (query, options = {}) => {
+  const { ssr = true, fallback } = options;
+  const queries = (Array.isArray(query) ? query : [
+    query
+  ]).map((query2) => query2 in breakpointMediaQueries ? breakpointMediaQueries[query2] : query2);
+  let fallbackValues = Array.isArray(fallback) ? fallback : [
+    fallback
+  ];
+  fallbackValues = fallbackValues.filter((v) => v != null);
+  const [value, setValue] = useState5(() => {
+    return queries.map((query2, index) => ({
+      media: query2,
+      matches: ssr ? !!fallbackValues[index] : document.defaultView?.matchMedia(query2).matches
+    }));
+  });
+  useEffect9(() => {
+    setValue(queries.map((query2) => ({
+      media: query2,
+      matches: document.defaultView?.matchMedia(query2).matches
+    })));
+    const mql = queries.map((query2) => document.defaultView?.matchMedia(query2));
+    const handler = (evt) => {
+      setValue((prev) => {
+        return prev.slice().map((item) => {
+          if (item.media === evt.media) {
+            return {
+              ...item,
+              matches: evt.matches
+            };
+          }
+          return item;
+        });
+      });
+    };
+    mql.forEach((mql2) => {
+      if (typeof mql2?.addListener === "function") {
+        mql2?.addListener(handler);
+      } else {
+        mql2?.addEventListener("change", handler);
+      }
+    });
+    return () => {
+      mql.forEach((mql2) => {
+        if (typeof mql2?.removeListener === "function") {
+          mql2?.removeListener(handler);
+        } else {
+          mql2?.removeEventListener("change", handler);
+        }
+      });
+    };
+  }, [
+    document.defaultView
+  ]);
+  return value.map((item) => !!item.matches);
+};
+
+// packages/ui/primitives/react-hooks/src/useMulticastObservable.ts
+import { useMemo as useMemo4, useSyncExternalStore } from "react";
+var useMulticastObservable = (observable) => {
+  const subscribeFn = useMemo4(() => (listener) => {
+    const subscription = observable.subscribe(listener);
+    return () => subscription.unsubscribe();
+  }, [
+    observable
+  ]);
+  return useSyncExternalStore(subscribeFn, () => observable.get());
+};
+
+// packages/ui/primitives/react-hooks/src/useRefCallback.ts
+import { useState as useState6 } from "react";
+var useRefCallback = () => {
+  const [value, setValue] = useState6(null);
+  return {
+    refCallback: (value2) => setValue(value2),
+    value
+  };
+};
+
+// packages/ui/primitives/react-hooks/src/useTransitions.ts
+import { useRef as useRef5, useEffect as useEffect10, useState as useState7 } from "react";
+var isFunction = (functionToCheck) => {
+  return functionToCheck instanceof Function;
+};
+var useDidTransition = (currentValue, fromValue, toValue) => {
+  const [hasTransitioned, setHasTransitioned] = useState7(false);
+  const previousValue = useRef5(currentValue);
+  useEffect10(() => {
+    const toValueValid = isFunction(toValue) ? toValue(currentValue) : toValue === currentValue;
+    const fromValueValid = isFunction(fromValue) ? fromValue(previousValue.current) : fromValue === previousValue.current;
+    const transitioned = fromValueValid && toValueValid;
+    if (transitioned) {
+      setHasTransitioned(true);
+    } else {
+      setHasTransitioned(false);
+    }
+    previousValue.current = currentValue;
+  }, [
+    currentValue,
+    fromValue,
+    toValue,
+    setHasTransitioned,
+    previousValue
+  ]);
+  return hasTransitioned;
+};
+var useOnTransition = (currentValue, fromValue, toValue, callback) => {
+  const dirty = useRef5(false);
+  const hasTransitioned = useDidTransition(currentValue, fromValue, toValue);
+  useEffect10(() => {
+    dirty.current = false;
+  }, [
+    currentValue,
+    dirty
+  ]);
+  useEffect10(() => {
+    if (hasTransitioned && !dirty.current) {
+      callback();
+      dirty.current = true;
+    }
+  }, [
+    hasTransitioned,
+    dirty,
+    callback
+  ]);
+};
+export {
+  randomString,
+  useAsyncCallback,
+  useAsyncEffect,
+  useControlledValue,
+  useDebugReactDeps,
+  useDefaultValue,
+  useDidTransition,
+  useDynamicRef,
+  useFileDownload,
+  useForwardedRef,
+  useId,
+  useIsFocused,
+  useMediaQuery,
+  useMulticastObservable,
+  useOnTransition,
+  useRefCallback
+};
+//# sourceMappingURL=index.mjs.map

package/dist/lib/node-esm/index.mjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/useAsyncCallback.ts", "../../../src/useAsyncEffect.ts", "../../../src/useControlledValue.ts", "../../../src/useDebugReactDeps.ts", "../../../src/useDefaultValue.ts", "../../../src/useDynamicRef.ts", "../../../src/useFileDownload.ts", "../../../src/useForwardedRef.ts", "../../../src/useId.ts", "../../../src/useIsFocused.ts", "../../../src/useMediaQuery.ts", "../../../src/useMulticastObservable.ts", "../../../src/useRefCallback.ts", "../../../src/useTransitions.ts"],
+  "sourcesContent": ["//\n// Copyright 2024 DXOS.org\n//\n\nimport { useEffect, useState } from 'react';\n\n/**\n * NOTE: Use with care and when necessary to be able to cancel an async operation when unmounting.\n */\nexport const useAsyncCallback = <T>(cb: () => Promise<T>): T | undefined => {\n  const [value, setValue] = useState<T | undefined>();\n  useEffect(() => {\n    const t = setTimeout(async () => {\n      const data = await cb();\n      setValue(data);\n    });\n\n    return () => clearTimeout(t);\n  }, []);\n\n  return value;\n};\n", "//\n// Copyright 2022 DXOS.org\n//\n\nimport { useEffect } from 'react';\n\nimport { log } from '@dxos/log';\n\n/**\n * Process async event with optional non-async destructor.\n * Inspired by: https://github.com/rauldeheer/use-async-effect/blob/master/index.js\n *\n * ```tsx\n * useAsyncEffect(async () => {\n *   await test();\n * }, []);\n * ```\n *\n * The callback may check of the component is still mounted before doing state updates.\n *\n * ```tsx\n * const [value, setValue] = useState<string>();\n * useAsyncEffect<string>(async (isMounted) => {\n *   const value = await test();\n *   if (!isMounted()) {\n *     setValue(value);\n *   }\n * }, () => console.log('Unmounted'), []);\n * ```\n *\n * @param callback Receives a getter function that determines if the component is still mounted.\n * @param destructor Receives the value returned from the callback.\n * @param deps\n *\n * NOTE: This effect does not cancel the async operation if the component is unmounted.\n */\nexport const useAsyncEffect = <T>(\n  callback: (isMounted: () => boolean) => Promise<T> | undefined,\n  destructor?: ((value?: T) => void) | any[],\n  deps?: any[],\n) => {\n  const [effectDestructor, effectDeps] =\n    typeof destructor === 'function' ? [destructor, deps] : [undefined, destructor];\n\n  useEffect(() => {\n    let mounted = true;\n    let value: T | undefined;\n    const asyncResult = callback(() => mounted);\n\n    void Promise.resolve(asyncResult)\n      .then((result) => {\n        value = result;\n      })\n      .catch(log.catch);\n\n    return () => {\n      mounted = false;\n      effectDestructor?.(value);\n    };\n  }, effectDeps);\n};\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport { type Dispatch, type SetStateAction, useEffect, useState } from 'react';\n\n/**\n * A stateful hook with a controlled value.\n */\nexport const useControlledValue = <TValue>(controlledValue: TValue): [TValue, Dispatch<SetStateAction<TValue>>] => {\n  const [value, setValue] = useState<TValue>(controlledValue);\n  useEffect(() => {\n    if (controlledValue !== undefined) {\n      setValue(controlledValue);\n    }\n  }, [controlledValue]);\n\n  return [value, setValue];\n};\n", "//\n// Copyright 2024 DXOS.org\n//\n\n/* eslint-disable no-console */\n\nimport { type DependencyList, useEffect, useRef } from 'react';\n\n/**\n * Util to log deps that have changed.\n */\n// TODO(burdon): Move to react-hooks.\nexport const useDebugReactDeps = (deps: DependencyList = []) => {\n  const lastDeps = useRef<DependencyList>([]);\n  useEffect(() => {\n    console.group('deps changed', { old: lastDeps.current.length, new: deps.length });\n    for (let i = 0; i < Math.max(lastDeps.current.length ?? 0, deps.length ?? 0); i++) {\n      console.log(i, lastDeps.current[i] === deps[i] ? 'SAME' : 'CHANGED', {\n        previous: lastDeps.current[i],\n        current: deps[i],\n      });\n    }\n\n    console.groupEnd();\n    lastDeps.current = deps;\n  }, deps);\n};\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport { useEffect, useState, useMemo } from 'react';\n\n/**\n * A custom React hook that provides a stable default value for a potentially undefined reactive value.\n * The defaultValue is memoized upon component mount and remains unchanged until the component unmounts,\n * ensuring stability across all re-renders, even if the defaultValue prop changes.\n *\n * Note: The defaultValue is not reactive. It retains the same value from the component's mount to unmount.\n *\n * @param reactiveValue - The value that may change over time.\n * @param defaultValue - The initial value used when the reactiveValue is undefined. This value is not reactive.\n * @returns - The reactiveValue if it's defined, otherwise the defaultValue.\n */\nexport const useDefaultValue = <T>(reactiveValue: T | undefined | null, defaultValue: T): T => {\n  // Memoize defaultValue with an empty dependency array.\n  // This ensures that the defaultValue instance remains stable across all re-renders,\n  // regardless of whether the defaultValue changes.\n  const stableDefaultValue = useMemo(() => defaultValue, []);\n  const [value, setValue] = useState(reactiveValue ?? stableDefaultValue);\n\n  useEffect(() => {\n    setValue(reactiveValue ?? stableDefaultValue);\n  }, [reactiveValue, stableDefaultValue]);\n\n  return value;\n};\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport { useEffect, useRef } from 'react';\n\nexport const useDynamicRef = <T>(value: T) => {\n  const ref = useRef<T>(value);\n  useEffect(() => {\n    ref.current = value;\n  }, [value]);\n\n  return ref;\n};\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport { useMemo } from 'react';\n\n/**\n * File download anchor.\n *\n * ```\n * const download = useDownload();\n * const handleDownload = (data: string) => {\n *   download(new Blob([data], { type: 'text/plain' }), 'test.txt');\n * };\n * ```\n */\nexport const useFileDownload = (): ((data: Blob | string, filename: string) => void) => {\n  return useMemo(\n    () => (data: Blob | string, filename: string) => {\n      const url = typeof data === 'string' ? data : URL.createObjectURL(data);\n      const element = document.createElement('a');\n      element.setAttribute('href', url);\n      element.setAttribute('download', filename);\n      element.setAttribute('target', 'download');\n      element.click();\n    },\n    [],\n  );\n};\n", "//\n// Copyright 2022 DXOS.org\n//\n\nimport { type ForwardedRef, useRef, useEffect } from 'react';\n\nexport const useForwardedRef = <T>(ref: ForwardedRef<T>) => {\n  const innerRef = useRef<T>(null);\n\n  useEffect(() => {\n    if (!ref) {\n      return;\n    }\n\n    if (typeof ref === 'function') {\n      ref(innerRef.current);\n    } else {\n      ref.current = innerRef.current;\n    }\n  });\n\n  return innerRef;\n};\n", "//\n// Copyright 2022 DXOS.org\n//\n\nimport alea from 'alea';\nimport { useMemo } from 'react';\n\ninterface PrngFactory {\n  new (seed?: string): () => number;\n}\n\nconst Alea: PrngFactory = alea as unknown as PrngFactory;\n\nconst prng = new Alea('@dxos/react-hooks');\n\n// TODO(burdon): Replace with PublicKey.random().\nexport const randomString = (n = 4) =>\n  prng()\n    .toString(16)\n    .slice(2, n + 2);\n\nexport const useId = (namespace: string, propsId?: string, opts?: Partial<{ n: number }>) =>\n  useMemo(() => propsId ?? `${namespace}-${randomString(opts?.n ?? 4)}`, [propsId]);\n", "//\n// Copyright 2022 DXOS.org\n//\n\n// Based upon the useIsFocused hook which is part of the `rci` project:\n/// https://github.com/leonardodino/rci/blob/main/packages/use-is-focused\n\nimport { useEffect, useRef, useState, type RefObject } from 'react';\n\nexport const useIsFocused = (inputRef: RefObject<HTMLInputElement>) => {\n  const [isFocused, setIsFocused] = useState<boolean | undefined>(undefined);\n  const isFocusedRef = useRef<boolean | undefined>(isFocused);\n\n  isFocusedRef.current = isFocused;\n\n  useEffect(() => {\n    const input = inputRef.current;\n    if (!input) {\n      return;\n    }\n\n    const onFocus = () => setIsFocused(true);\n    const onBlur = () => setIsFocused(false);\n    input.addEventListener('focus', onFocus);\n    input.addEventListener('blur', onBlur);\n\n    if (isFocusedRef.current === undefined) {\n      setIsFocused(document.activeElement === input);\n    }\n\n    return () => {\n      input.removeEventListener('focus', onFocus);\n      input.removeEventListener('blur', onBlur);\n    };\n  }, [inputRef, setIsFocused]);\n\n  return isFocused;\n};\n", "//\n// Copyright 2023 DXOS.org\n//\n\n// This hook is based on Chakra UI’s `useMediaQuery`: https://github.com/chakra-ui/chakra-ui/blob/main/packages/components/media-query/src/use-media-query.ts\n\nimport { useEffect, useState } from 'react';\n\nexport type UseMediaQueryOptions = {\n  fallback?: boolean | boolean[];\n  ssr?: boolean;\n};\n\n// TODO(thure): This should be derived from the same source of truth as the Tailwind theme config\nconst breakpointMediaQueries: Record<string, string> = {\n  sm: '(min-width: 640px)',\n  md: '(min-width: 768px)',\n  lg: '(min-width: 1024px)',\n  xl: '(min-width: 1280px)',\n  '2xl': '(min-width: 1536px)',\n};\n\n/**\n * React hook that tracks state of a CSS media query\n *\n * @param query the media query to match, or a recognized breakpoint token\n * @param options the media query options { fallback, ssr }\n *\n * @see Docs https://chakra-ui.com/docs/hooks/use-media-query\n */\nexport const useMediaQuery = (query: string | string[], options: UseMediaQueryOptions = {}): boolean[] => {\n  const { ssr = true, fallback } = options;\n\n  const queries = (Array.isArray(query) ? query : [query]).map((query) =>\n    query in breakpointMediaQueries ? breakpointMediaQueries[query] : query,\n  );\n\n  let fallbackValues = Array.isArray(fallback) ? fallback : [fallback];\n  fallbackValues = fallbackValues.filter((v) => v != null) as boolean[];\n\n  const [value, setValue] = useState(() => {\n    return queries.map((query, index) => ({\n      media: query,\n      matches: ssr ? !!fallbackValues[index] : document.defaultView?.matchMedia(query).matches,\n    }));\n  });\n\n  useEffect(() => {\n    setValue(\n      queries.map((query) => ({\n        media: query,\n        matches: document.defaultView?.matchMedia(query).matches,\n      })),\n    );\n\n    const mql = queries.map((query) => document.defaultView?.matchMedia(query));\n\n    const handler = (evt: MediaQueryListEvent) => {\n      setValue((prev) => {\n        return prev.slice().map((item) => {\n          if (item.media === evt.media) {\n            return { ...item, matches: evt.matches };\n          }\n          return item;\n        });\n      });\n    };\n\n    mql.forEach((mql) => {\n      if (typeof mql?.addListener === 'function') {\n        mql?.addListener(handler);\n      } else {\n        mql?.addEventListener('change', handler);\n      }\n    });\n\n    return () => {\n      mql.forEach((mql) => {\n        if (typeof mql?.removeListener === 'function') {\n          mql?.removeListener(handler);\n        } else {\n          mql?.removeEventListener('change', handler);\n        }\n      });\n    };\n  }, [document.defaultView]);\n\n  return value.map((item) => !!item.matches);\n};\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport { useMemo, useSyncExternalStore } from 'react';\n\nimport { type MulticastObservable } from '@dxos/async';\n\n/**\n * Subscribe to a MulticastObservable and return the latest value.\n * @param observable the observable to subscribe to. Will resubscribe if the observable changes.\n */\n// TODO(burdon): Move to react-hooks.\nexport const useMulticastObservable = <T>(observable: MulticastObservable<T>): T => {\n  // Make sure useSyncExternalStore is stable in respect to the observable.\n  const subscribeFn = useMemo(\n    () => (listener: () => void) => {\n      const subscription = observable.subscribe(listener);\n      return () => subscription.unsubscribe();\n    },\n    [observable],\n  );\n\n  // useSyncExternalStore will resubscribe to the observable and update the value if the subscribeFn changes.\n  return useSyncExternalStore(subscribeFn, () => observable.get());\n};\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport { type RefCallback, useState } from 'react';\n\n/**\n * Custom React Hook that creates a ref callback and a state variable.\n * The ref callback sets the state variable when the ref changes.\n *\n * @returns An object containing the ref callback and the current value of the ref.\n */\nexport const useRefCallback = <T = any>(): { refCallback: RefCallback<T>; value: T | null } => {\n  const [value, setValue] = useState<T | null>(null);\n  return { refCallback: (value: T) => setValue(value), value };\n};\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport { useRef, useEffect, useState } from 'react';\n\nconst isFunction = <T>(functionToCheck: any): functionToCheck is (value: T) => boolean => {\n  return functionToCheck instanceof Function;\n};\n\n/**\n * This is an internal custom hook that checks if a value has transitioned from a specified 'from' value to a 'to' value.\n *\n * @param currentValue - The value that is being monitored for transitions.\n * @param fromValue - The *from* value or a predicate function that determines the start of the transition.\n * @param toValue - The *to* value or a predicate function that determines the end of the transition.\n * @returns A boolean indicating whether the transition from *fromValue* to *toValue* has occurred.\n *\n * @internal Consider using `useOnTransition` for handling transitions instead of this hook.\n */\nexport const useDidTransition = <T>(\n  currentValue: T,\n  fromValue: T | ((value: T) => boolean),\n  toValue: T | ((value: T) => boolean),\n) => {\n  const [hasTransitioned, setHasTransitioned] = useState(false);\n  const previousValue = useRef<T>(currentValue);\n\n  useEffect(() => {\n    const toValueValid = isFunction<T>(toValue) ? toValue(currentValue) : toValue === currentValue;\n\n    const fromValueValid = isFunction<T>(fromValue)\n      ? fromValue(previousValue.current)\n      : fromValue === previousValue.current;\n\n    const transitioned = fromValueValid && toValueValid;\n\n    if (transitioned) {\n      setHasTransitioned(true);\n    } else {\n      setHasTransitioned(false);\n    }\n\n    previousValue.current = currentValue;\n  }, [currentValue, fromValue, toValue, setHasTransitioned, previousValue]);\n\n  return hasTransitioned;\n};\n\n/**\n * Executes a callback function when a specified transition occurs in a value.\n *\n * This function utilizes the `useDidTransition` hook to monitor changes in `currentValue`.\n * When `currentValue` transitions from `fromValue` to `toValue`, the provided `callback` function is executed. */\nexport const useOnTransition = <T>(\n  currentValue: T,\n  fromValue: T | ((value: T) => boolean),\n  toValue: ((value: T) => boolean) | T,\n  callback: () => void,\n) => {\n  const dirty = useRef(false);\n  const hasTransitioned = useDidTransition(currentValue, fromValue, toValue);\n\n  useEffect(() => {\n    dirty.current = false;\n  }, [currentValue, dirty]);\n\n  useEffect(() => {\n    if (hasTransitioned && !dirty.current) {\n      callback();\n      dirty.current = true;\n    }\n  }, [hasTransitioned, dirty, callback]);\n};\n"],
+  "mappings": ";AAIA,SAASA,WAAWC,gBAAgB;AAK7B,IAAMC,mBAAmB,CAAIC,OAAAA;AAClC,QAAM,CAACC,OAAOC,QAAAA,IAAYC,SAAAA;AAC1BC,YAAU,MAAA;AACR,UAAMC,IAAIC,WAAW,YAAA;AACnB,YAAMC,OAAO,MAAMP,GAAAA;AACnBE,eAASK,IAAAA;IACX,CAAA;AAEA,WAAO,MAAMC,aAAaH,CAAAA;EAC5B,GAAG,CAAA,CAAE;AAEL,SAAOJ;AACT;;;ACjBA,SAASQ,aAAAA,kBAAiB;AAE1B,SAASC,WAAW;AA8Bb,IAAMC,iBAAiB,CAC5BC,UACAC,YACAC,SAAAA;AAEA,QAAM,CAACC,kBAAkBC,UAAAA,IACvB,OAAOH,eAAe,aAAa;IAACA;IAAYC;MAAQ;IAACG;IAAWJ;;AAEtEK,EAAAA,WAAU,MAAA;AACR,QAAIC,UAAU;AACd,QAAIC;AACJ,UAAMC,cAAcT,SAAS,MAAMO,OAAAA;AAEnC,SAAKG,QAAQC,QAAQF,WAAAA,EAClBG,KAAK,CAACC,WAAAA;AACLL,cAAQK;IACV,CAAA,EACCC,MAAMC,IAAID,KAAK;AAElB,WAAO,MAAA;AACLP,gBAAU;AACVJ,yBAAmBK,KAAAA;IACrB;EACF,GAAGJ,UAAAA;AACL;;;ACxDA,SAA6CY,aAAAA,YAAWC,YAAAA,iBAAgB;AAKjE,IAAMC,qBAAqB,CAASC,oBAAAA;AACzC,QAAM,CAACC,OAAOC,QAAAA,IAAYC,UAAiBH,eAAAA;AAC3CI,EAAAA,WAAU,MAAA;AACR,QAAIJ,oBAAoBK,QAAW;AACjCH,eAASF,eAAAA;IACX;EACF,GAAG;IAACA;GAAgB;AAEpB,SAAO;IAACC;IAAOC;;AACjB;;;ACZA,SAA8BI,aAAAA,YAAWC,cAAc;AAMhD,IAAMC,oBAAoB,CAACC,OAAuB,CAAA,MAAE;AACzD,QAAMC,WAAWC,OAAuB,CAAA,CAAE;AAC1CC,EAAAA,WAAU,MAAA;AACRC,YAAQC,MAAM,gBAAgB;MAAEC,KAAKL,SAASM,QAAQC;MAAQC,KAAKT,KAAKQ;IAAO,CAAA;AAC/E,aAASE,IAAI,GAAGA,IAAIC,KAAKC,IAAIX,SAASM,QAAQC,UAAU,GAAGR,KAAKQ,UAAU,CAAA,GAAIE,KAAK;AACjFN,cAAQS,IAAIH,GAAGT,SAASM,QAAQG,CAAAA,MAAOV,KAAKU,CAAAA,IAAK,SAAS,WAAW;QACnEI,UAAUb,SAASM,QAAQG,CAAAA;QAC3BH,SAASP,KAAKU,CAAAA;MAChB,CAAA;IACF;AAEAN,YAAQW,SAAQ;AAChBd,aAASM,UAAUP;EACrB,GAAGA,IAAAA;AACL;;;ACtBA,SAASgB,aAAAA,YAAWC,YAAAA,WAAUC,eAAe;AAatC,IAAMC,kBAAkB,CAAIC,eAAqCC,iBAAAA;AAItE,QAAMC,qBAAqBC,QAAQ,MAAMF,cAAc,CAAA,CAAE;AACzD,QAAM,CAACG,OAAOC,QAAAA,IAAYC,UAASN,iBAAiBE,kBAAAA;AAEpDK,EAAAA,WAAU,MAAA;AACRF,aAASL,iBAAiBE,kBAAAA;EAC5B,GAAG;IAACF;IAAeE;GAAmB;AAEtC,SAAOE;AACT;;;ACzBA,SAASI,aAAAA,YAAWC,UAAAA,eAAc;AAE3B,IAAMC,gBAAgB,CAAIC,UAAAA;AAC/B,QAAMC,MAAMC,QAAUF,KAAAA;AACtBG,EAAAA,WAAU,MAAA;AACRF,QAAIG,UAAUJ;EAChB,GAAG;IAACA;GAAM;AAEV,SAAOC;AACT;;;ACTA,SAASI,WAAAA,gBAAe;AAYjB,IAAMC,kBAAkB,MAAA;AAC7B,SAAOC,SACL,MAAM,CAACC,MAAqBC,aAAAA;AAC1B,UAAMC,MAAM,OAAOF,SAAS,WAAWA,OAAOG,IAAIC,gBAAgBJ,IAAAA;AAClE,UAAMK,UAAUC,SAASC,cAAc,GAAA;AACvCF,YAAQG,aAAa,QAAQN,GAAAA;AAC7BG,YAAQG,aAAa,YAAYP,QAAAA;AACjCI,YAAQG,aAAa,UAAU,UAAA;AAC/BH,YAAQI,MAAK;EACf,GACA,CAAA,CAAE;AAEN;;;ACxBA,SAA4BC,UAAAA,SAAQC,aAAAA,kBAAiB;AAE9C,IAAMC,kBAAkB,CAAIC,QAAAA;AACjC,QAAMC,WAAWC,QAAU,IAAA;AAE3BC,EAAAA,WAAU,MAAA;AACR,QAAI,CAACH,KAAK;AACR;IACF;AAEA,QAAI,OAAOA,QAAQ,YAAY;AAC7BA,UAAIC,SAASG,OAAO;IACtB,OAAO;AACLJ,UAAII,UAAUH,SAASG;IACzB;EACF,CAAA;AAEA,SAAOH;AACT;;;AClBA,OAAOI,UAAU;AACjB,SAASC,WAAAA,gBAAe;AAMxB,IAAMC,OAAoBC;AAE1B,IAAMC,OAAO,IAAIF,KAAK,mBAAA;AAGf,IAAMG,eAAe,CAACC,IAAI,MAC/BF,KAAAA,EACGG,SAAS,EAAA,EACTC,MAAM,GAAGF,IAAI,CAAA;AAEX,IAAMG,QAAQ,CAACC,WAAmBC,SAAkBC,SACzDC,SAAQ,MAAMF,WAAW,GAAGD,SAAAA,IAAaL,aAAaO,MAAMN,KAAK,CAAA,CAAA,IAAM;EAACK;CAAQ;;;ACflF,SAASG,aAAAA,YAAWC,UAAAA,SAAQC,YAAAA,iBAAgC;AAErD,IAAMC,eAAe,CAACC,aAAAA;AAC3B,QAAM,CAACC,WAAWC,YAAAA,IAAgBC,UAA8BC,MAAAA;AAChE,QAAMC,eAAeC,QAA4BL,SAAAA;AAEjDI,eAAaE,UAAUN;AAEvBO,EAAAA,WAAU,MAAA;AACR,UAAMC,QAAQT,SAASO;AACvB,QAAI,CAACE,OAAO;AACV;IACF;AAEA,UAAMC,UAAU,MAAMR,aAAa,IAAA;AACnC,UAAMS,SAAS,MAAMT,aAAa,KAAA;AAClCO,UAAMG,iBAAiB,SAASF,OAAAA;AAChCD,UAAMG,iBAAiB,QAAQD,MAAAA;AAE/B,QAAIN,aAAaE,YAAYH,QAAW;AACtCF,mBAAaW,SAASC,kBAAkBL,KAAAA;IAC1C;AAEA,WAAO,MAAA;AACLA,YAAMM,oBAAoB,SAASL,OAAAA;AACnCD,YAAMM,oBAAoB,QAAQJ,MAAAA;IACpC;EACF,GAAG;IAACX;IAAUE;GAAa;AAE3B,SAAOD;AACT;;;AC/BA,SAASe,aAAAA,YAAWC,YAAAA,iBAAgB;AAQpC,IAAMC,yBAAiD;EACrDC,IAAI;EACJC,IAAI;EACJC,IAAI;EACJC,IAAI;EACJ,OAAO;AACT;AAUO,IAAMC,gBAAgB,CAACC,OAA0BC,UAAgC,CAAC,MAAC;AACxF,QAAM,EAAEC,MAAM,MAAMC,SAAQ,IAAKF;AAEjC,QAAMG,WAAWC,MAAMC,QAAQN,KAAAA,IAASA,QAAQ;IAACA;KAAQO,IAAI,CAACP,WAC5DA,UAASN,yBAAyBA,uBAAuBM,MAAAA,IAASA,MAAAA;AAGpE,MAAIQ,iBAAiBH,MAAMC,QAAQH,QAAAA,IAAYA,WAAW;IAACA;;AAC3DK,mBAAiBA,eAAeC,OAAO,CAACC,MAAMA,KAAK,IAAA;AAEnD,QAAM,CAACC,OAAOC,QAAAA,IAAYC,UAAS,MAAA;AACjC,WAAOT,QAAQG,IAAI,CAACP,QAAOc,WAAW;MACpCC,OAAOf;MACPgB,SAASd,MAAM,CAAC,CAACM,eAAeM,KAAAA,IAASG,SAASC,aAAaC,WAAWnB,MAAAA,EAAOgB;IACnF,EAAA;EACF,CAAA;AAEAI,EAAAA,WAAU,MAAA;AACRR,aACER,QAAQG,IAAI,CAACP,YAAW;MACtBe,OAAOf;MACPgB,SAASC,SAASC,aAAaC,WAAWnB,MAAAA,EAAOgB;IACnD,EAAA,CAAA;AAGF,UAAMK,MAAMjB,QAAQG,IAAI,CAACP,WAAUiB,SAASC,aAAaC,WAAWnB,MAAAA,CAAAA;AAEpE,UAAMsB,UAAU,CAACC,QAAAA;AACfX,eAAS,CAACY,SAAAA;AACR,eAAOA,KAAKC,MAAK,EAAGlB,IAAI,CAACmB,SAAAA;AACvB,cAAIA,KAAKX,UAAUQ,IAAIR,OAAO;AAC5B,mBAAO;cAAE,GAAGW;cAAMV,SAASO,IAAIP;YAAQ;UACzC;AACA,iBAAOU;QACT,CAAA;MACF,CAAA;IACF;AAEAL,QAAIM,QAAQ,CAACN,SAAAA;AACX,UAAI,OAAOA,MAAKO,gBAAgB,YAAY;AAC1CP,QAAAA,MAAKO,YAAYN,OAAAA;MACnB,OAAO;AACLD,QAAAA,MAAKQ,iBAAiB,UAAUP,OAAAA;MAClC;IACF,CAAA;AAEA,WAAO,MAAA;AACLD,UAAIM,QAAQ,CAACN,SAAAA;AACX,YAAI,OAAOA,MAAKS,mBAAmB,YAAY;AAC7CT,UAAAA,MAAKS,eAAeR,OAAAA;QACtB,OAAO;AACLD,UAAAA,MAAKU,oBAAoB,UAAUT,OAAAA;QACrC;MACF,CAAA;IACF;EACF,GAAG;IAACL,SAASC;GAAY;AAEzB,SAAOP,MAAMJ,IAAI,CAACmB,SAAS,CAAC,CAACA,KAAKV,OAAO;AAC3C;;;ACpFA,SAASgB,WAAAA,UAASC,4BAA4B;AASvC,IAAMC,yBAAyB,CAAIC,eAAAA;AAExC,QAAMC,cAAcC,SAClB,MAAM,CAACC,aAAAA;AACL,UAAMC,eAAeJ,WAAWK,UAAUF,QAAAA;AAC1C,WAAO,MAAMC,aAAaE,YAAW;EACvC,GACA;IAACN;GAAW;AAId,SAAOO,qBAAqBN,aAAa,MAAMD,WAAWQ,IAAG,CAAA;AAC/D;;;ACrBA,SAA2BC,YAAAA,iBAAgB;AAQpC,IAAMC,iBAAiB,MAAA;AAC5B,QAAM,CAACC,OAAOC,QAAAA,IAAYC,UAAmB,IAAA;AAC7C,SAAO;IAAEC,aAAa,CAACH,WAAaC,SAASD,MAAAA;IAAQA;EAAM;AAC7D;;;ACXA,SAASI,UAAAA,SAAQC,aAAAA,aAAWC,YAAAA,iBAAgB;AAE5C,IAAMC,aAAa,CAAIC,oBAAAA;AACrB,SAAOA,2BAA2BC;AACpC;AAYO,IAAMC,mBAAmB,CAC9BC,cACAC,WACAC,YAAAA;AAEA,QAAM,CAACC,iBAAiBC,kBAAAA,IAAsBC,UAAS,KAAA;AACvD,QAAMC,gBAAgBC,QAAUP,YAAAA;AAEhCQ,EAAAA,YAAU,MAAA;AACR,UAAMC,eAAeb,WAAcM,OAAAA,IAAWA,QAAQF,YAAAA,IAAgBE,YAAYF;AAElF,UAAMU,iBAAiBd,WAAcK,SAAAA,IACjCA,UAAUK,cAAcK,OAAO,IAC/BV,cAAcK,cAAcK;AAEhC,UAAMC,eAAeF,kBAAkBD;AAEvC,QAAIG,cAAc;AAChBR,yBAAmB,IAAA;IACrB,OAAO;AACLA,yBAAmB,KAAA;IACrB;AAEAE,kBAAcK,UAAUX;EAC1B,GAAG;IAACA;IAAcC;IAAWC;IAASE;IAAoBE;GAAc;AAExE,SAAOH;AACT;AAOO,IAAMU,kBAAkB,CAC7Bb,cACAC,WACAC,SACAY,aAAAA;AAEA,QAAMC,QAAQR,QAAO,KAAA;AACrB,QAAMJ,kBAAkBJ,iBAAiBC,cAAcC,WAAWC,OAAAA;AAElEM,EAAAA,YAAU,MAAA;AACRO,UAAMJ,UAAU;EAClB,GAAG;IAACX;IAAce;GAAM;AAExBP,EAAAA,YAAU,MAAA;AACR,QAAIL,mBAAmB,CAACY,MAAMJ,SAAS;AACrCG,eAAAA;AACAC,YAAMJ,UAAU;IAClB;EACF,GAAG;IAACR;IAAiBY;IAAOD;GAAS;AACvC;",
+  "names": ["useEffect", "useState", "useAsyncCallback", "cb", "value", "setValue", "useState", "useEffect", "t", "setTimeout", "data", "clearTimeout", "useEffect", "log", "useAsyncEffect", "callback", "destructor", "deps", "effectDestructor", "effectDeps", "undefined", "useEffect", "mounted", "value", "asyncResult", "Promise", "resolve", "then", "result", "catch", "log", "useEffect", "useState", "useControlledValue", "controlledValue", "value", "setValue", "useState", "useEffect", "undefined", "useEffect", "useRef", "useDebugReactDeps", "deps", "lastDeps", "useRef", "useEffect", "console", "group", "old", "current", "length", "new", "i", "Math", "max", "log", "previous", "groupEnd", "useEffect", "useState", "useMemo", "useDefaultValue", "reactiveValue", "defaultValue", "stableDefaultValue", "useMemo", "value", "setValue", "useState", "useEffect", "useEffect", "useRef", "useDynamicRef", "value", "ref", "useRef", "useEffect", "current", "useMemo", "useFileDownload", "useMemo", "data", "filename", "url", "URL", "createObjectURL", "element", "document", "createElement", "setAttribute", "click", "useRef", "useEffect", "useForwardedRef", "ref", "innerRef", "useRef", "useEffect", "current", "alea", "useMemo", "Alea", "alea", "prng", "randomString", "n", "toString", "slice", "useId", "namespace", "propsId", "opts", "useMemo", "useEffect", "useRef", "useState", "useIsFocused", "inputRef", "isFocused", "setIsFocused", "useState", "undefined", "isFocusedRef", "useRef", "current", "useEffect", "input", "onFocus", "onBlur", "addEventListener", "document", "activeElement", "removeEventListener", "useEffect", "useState", "breakpointMediaQueries", "sm", "md", "lg", "xl", "useMediaQuery", "query", "options", "ssr", "fallback", "queries", "Array", "isArray", "map", "fallbackValues", "filter", "v", "value", "setValue", "useState", "index", "media", "matches", "document", "defaultView", "matchMedia", "useEffect", "mql", "handler", "evt", "prev", "slice", "item", "forEach", "addListener", "addEventListener", "removeListener", "removeEventListener", "useMemo", "useSyncExternalStore", "useMulticastObservable", "observable", "subscribeFn", "useMemo", "listener", "subscription", "subscribe", "unsubscribe", "useSyncExternalStore", "get", "useState", "useRefCallback", "value", "setValue", "useState", "refCallback", "useRef", "useEffect", "useState", "isFunction", "functionToCheck", "Function", "useDidTransition", "currentValue", "fromValue", "toValue", "hasTransitioned", "setHasTransitioned", "useState", "previousValue", "useRef", "useEffect", "toValueValid", "fromValueValid", "current", "transitioned", "useOnTransition", "callback", "dirty"]
+}

package/dist/lib/node-esm/meta.json

@@ -0,0 +1 @@
+{"inputs":{"packages/ui/primitives/react-hooks/src/useAsyncCallback.ts":{"bytes":2022,"imports":[{"path":"react","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/primitives/react-hooks/src/useAsyncEffect.ts":{"bytes":5018,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/log","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/primitives/react-hooks/src/useControlledValue.ts":{"bytes":1974,"imports":[{"path":"react","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/primitives/react-hooks/src/useDebugReactDeps.ts":{"bytes":3192,"imports":[{"path":"react","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/primitives/react-hooks/src/useDefaultValue.ts":{"bytes":4104,"imports":[{"path":"react","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/primitives/react-hooks/src/useDynamicRef.ts":{"bytes":1251,"imports":[{"path":"react","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/primitives/react-hooks/src/useFileDownload.ts":{"bytes":2740,"imports":[{"path":"react","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/primitives/react-hooks/src/useForwardedRef.ts":{"bytes":1783,"imports":[{"path":"react","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/primitives/react-hooks/src/useId.ts":{"bytes":2163,"imports":[{"path":"alea","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/primitives/react-hooks/src/useIsFocused.ts":{"bytes":3990,"imports":[{"path":"react","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/primitives/react-hooks/src/useMediaQuery.ts":{"bytes":9390,"imports":[{"path":"react","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/primitives/react-hooks/src/useMulticastObservable.ts":{"bytes":3033,"imports":[{"path":"react","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/primitives/react-hooks/src/useRefCallback.ts":{"bytes":1879,"imports":[{"path":"react","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/primitives/react-hooks/src/useTransitions.ts":{"bytes":7797,"imports":[{"path":"react","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/primitives/react-hooks/src/index.ts":{"bytes":1913,"imports":[{"path":"packages/ui/primitives/react-hooks/src/useAsyncCallback.ts","kind":"import-statement","original":"./useAsyncCallback"},{"path":"packages/ui/primitives/react-hooks/src/useAsyncEffect.ts","kind":"import-statement","original":"./useAsyncEffect"},{"path":"packages/ui/primitives/react-hooks/src/useControlledValue.ts","kind":"import-statement","original":"./useControlledValue"},{"path":"packages/ui/primitives/react-hooks/src/useDebugReactDeps.ts","kind":"import-statement","original":"./useDebugReactDeps"},{"path":"packages/ui/primitives/react-hooks/src/useDefaultValue.ts","kind":"import-statement","original":"./useDefaultValue"},{"path":"packages/ui/primitives/react-hooks/src/useDynamicRef.ts","kind":"import-statement","original":"./useDynamicRef"},{"path":"packages/ui/primitives/react-hooks/src/useFileDownload.ts","kind":"import-statement","original":"./useFileDownload"},{"path":"packages/ui/primitives/react-hooks/src/useForwardedRef.ts","kind":"import-statement","original":"./useForwardedRef"},{"path":"packages/ui/primitives/react-hooks/src/useId.ts","kind":"import-statement","original":"./useId"},{"path":"packages/ui/primitives/react-hooks/src/useIsFocused.ts","kind":"import-statement","original":"./useIsFocused"},{"path":"packages/ui/primitives/react-hooks/src/useMediaQuery.ts","kind":"import-statement","original":"./useMediaQuery"},{"path":"packages/ui/primitives/react-hooks/src/useMulticastObservable.ts","kind":"import-statement","original":"./useMulticastObservable"},{"path":"packages/ui/primitives/react-hooks/src/useRefCallback.ts","kind":"import-statement","original":"./useRefCallback"},{"path":"packages/ui/primitives/react-hooks/src/useTransitions.ts","kind":"import-statement","original":"./useTransitions"}],"format":"esm"}},"outputs":{"packages/ui/primitives/react-hooks/dist/lib/node-esm/index.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":24207},"packages/ui/primitives/react-hooks/dist/lib/node-esm/index.mjs":{"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/log","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"alea","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true}],"exports":["randomString","useAsyncCallback","useAsyncEffect","useControlledValue","useDebugReactDeps","useDefaultValue","useDidTransition","useDynamicRef","useFileDownload","useForwardedRef","useId","useIsFocused","useMediaQuery","useMulticastObservable","useOnTransition","useRefCallback"],"entryPoint":"packages/ui/primitives/react-hooks/src/index.ts","inputs":{"packages/ui/primitives/react-hooks/src/useAsyncCallback.ts":{"bytesInOutput":301},"packages/ui/primitives/react-hooks/src/index.ts":{"bytesInOutput":0},"packages/ui/primitives/react-hooks/src/useAsyncEffect.ts":{"bytesInOutput":596},"packages/ui/primitives/react-hooks/src/useControlledValue.ts":{"bytesInOutput":350},"packages/ui/primitives/react-hooks/src/useDebugReactDeps.ts":{"bytesInOutput":567},"packages/ui/primitives/react-hooks/src/useDefaultValue.ts":{"bytesInOutput":422},"packages/ui/primitives/react-hooks/src/useDynamicRef.ts":{"bytesInOutput":217},"packages/ui/primitives/react-hooks/src/useFileDownload.ts":{"bytesInOutput":416},"packages/ui/primitives/react-hooks/src/useForwardedRef.ts":{"bytesInOutput":343},"packages/ui/primitives/react-hooks/src/useId.ts":{"bytesInOutput":326},"packages/ui/primitives/react-hooks/src/useIsFocused.ts":{"bytesInOutput":833},"packages/ui/primitives/react-hooks/src/useMediaQuery.ts":{"bytesInOutput":1940},"packages/ui/primitives/react-hooks/src/useMulticastObservable.ts":{"bytesInOutput":368},"packages/ui/primitives/react-hooks/src/useRefCallback.ts":{"bytesInOutput":197},"packages/ui/primitives/react-hooks/src/useTransitions.ts":{"bytesInOutput":1388}},"bytes":9466}}}

package/dist/types/src/useAsyncEffect.test.d.ts

@@ -1,2 +1,2 @@
-import 'raf/polyfill';
+export {};
 //# sourceMappingURL=useAsyncEffect.test.d.ts.map

package/dist/types/src/useAsyncEffect.test.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useAsyncEffect.test.d.ts","sourceRoot":"","sources":["../../../src/useAsyncEffect.test.tsx"],"names":[],"mappings":"AAKA,OAAO,cAAc,CAAC"}
+{"version":3,"file":"useAsyncEffect.test.d.ts","sourceRoot":"","sources":["../../../src/useAsyncEffect.test.tsx"],"names":[],"mappings":""}

package/dist/types/src/useMulticastObservable.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=useMulticastObservable.test.d.ts.map

package/dist/types/src/useMulticastObservable.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useMulticastObservable.test.d.ts","sourceRoot":"","sources":["../../../src/useMulticastObservable.test.tsx"],"names":[],"mappings":""}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dxos/react-hooks",
-  "version": "0.6.11",
+  "version": "0.6.12-main.5cc132e",
   "description": "React hooks supporting DXOS React primitives.",
   "homepage": "https://dxos.org",
   "bugs": "https://github.com/dxos/dxos/issues",
@@ -10,7 +10,8 @@
     ".": {
       "browser": "./dist/lib/browser/index.mjs",
       "node": {
-        "default": "./dist/lib/node/index.cjs"
+        "require": "./dist/lib/node/index.cjs",
+        "default": "./dist/lib/node-esm/index.mjs"
       },
       "types": "./dist/types/src/index.d.ts"
     }
@@ -25,10 +26,11 @@
   ],
   "dependencies": {
     "alea": "^1.0.1",
-    "@dxos/async": "0.6.11",
-    "@dxos/log": "0.6.11"
+    "@dxos/async": "0.6.12-main.5cc132e",
+    "@dxos/log": "0.6.12-main.5cc132e"
   },
   "devDependencies": {
+    "@testing-library/react": "^13.4.0",
     "@types/react": "~18.2.0",
     "@types/react-dom": "~18.2.0",
     "react": "~18.2.0",

package/src/useAsyncEffect.test.tsx

@@ -2,14 +2,10 @@
 // Copyright 2022 DXOS.org
 //
 
-import expect from 'expect';
-import 'raf/polyfill';
 import React, { useState } from 'react';
 import { createRoot } from 'react-dom/client';
 import { act } from 'react-dom/test-utils';
-import waitForExpect from 'wait-for-expect';
-
-import { afterEach, beforeEach, describe, test } from '@dxos/test';
+import { afterEach, beforeEach, describe, expect, test } from 'vitest';
 
 import { useAsyncEffect } from './useAsyncEffect';
 
@@ -45,13 +41,11 @@ describe('useAsyncEffect', () => {
   });
 
   test('gets async value.', async () => {
-    void act(() => {
+    await act(() => {
       createRoot(rootContainer).render(<Test />);
     });
 
     const h1 = rootContainer.querySelector('h1');
-    await waitForExpect(() => {
-      expect(h1?.textContent).toEqual('DXOS');
-    });
+    expect(h1?.textContent).toEqual('DXOS');
   });
 });

package/src/useMulticastObservable.test.tsx

@@ -0,0 +1,23 @@
+//
+// Copyright 2022 DXOS.org
+//
+
+import { act, renderHook } from '@testing-library/react';
+import { describe, expect, test } from 'vitest';
+
+import { Event, MulticastObservable } from '@dxos/async';
+
+import { useMulticastObservable } from './useMulticastObservable';
+
+describe('useMulticastObservable', () => {
+  test('observes value', async () => {
+    const event = new Event<number>();
+    const observable = MulticastObservable.from(event, 0);
+    const { result } = renderHook(() => useMulticastObservable(observable));
+    expect(result.current).toEqual(0);
+
+    await act(() => event.emit(1));
+
+    await expect.poll(() => result.current).toEqual(1);
+  });
+});