@bifrostui/utils 2.0.0-alpha.12 → 2.0.0-alpha.14

package/dist/context-selector/createContext.d.ts

@@ -0,0 +1,26 @@
+import { Context } from './types';
+/**
+ * Creates a context that supports selective subscriptions.
+ * This allows components to subscribe to only specific parts of the context value
+ * and re-render only when those parts change.
+ *
+ * @param defaultValue - The default value for the context
+ * @returns A context object that can be used with useContextSelector
+ *
+ * @example
+ * ```tsx
+ * interface MyContextValue {
+ *   count: number;
+ *   name: string;
+ * }
+ *
+ * const MyContext = createContext<MyContextValue>({ count: 0, name: '' });
+ *
+ * function MyComponent() {
+ *   // Only re-renders when count changes, not when name changes
+ *   const count = useContextSelector(MyContext, ctx => ctx.count);
+ *   return <div>{count}</div>;
+ * }
+ * ```
+ */
+export declare const createContext: <Value>(defaultValue: Value) => Context<Value>;

package/dist/context-selector/createContext.js

@@ -0,0 +1,83 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var createContext_exports = {};
+__export(createContext_exports, {
+  createContext: () => createContext
+});
+module.exports = __toCommonJS(createContext_exports);
+var React = __toESM(require("react"));
+var import_scheduler = require("scheduler");
+var import_useIsomorphicLayoutEffect = require("../hooks/useIsomorphicLayoutEffect");
+const createProvider = (Original) => {
+  const Provider = (props) => {
+    const valueRef = React.useRef(props.value);
+    const versionRef = React.useRef(0);
+    const contextValue = React.useRef(null);
+    if (!contextValue.current) {
+      contextValue.current = {
+        value: valueRef,
+        version: versionRef,
+        listeners: []
+      };
+    }
+    (0, import_useIsomorphicLayoutEffect.useIsomorphicLayoutEffect)(() => {
+      valueRef.current = props.value;
+      versionRef.current += 1;
+      (0, import_scheduler.unstable_runWithPriority)(import_scheduler.unstable_NormalPriority, () => {
+        contextValue.current.listeners.forEach(
+          (listener) => {
+            listener([versionRef.current, props.value]);
+          }
+        );
+      });
+    }, [props.value]);
+    return React.createElement(
+      Original,
+      { value: contextValue.current },
+      props.children
+    );
+  };
+  if (process.env.NODE_ENV !== "production") {
+    Provider.displayName = "ContextSelector.Provider";
+  }
+  return Provider;
+};
+const createContext = (defaultValue) => {
+  const context = React.createContext({
+    value: { current: defaultValue },
+    version: { current: -1 },
+    listeners: []
+  });
+  context.Provider = createProvider(context.Provider);
+  delete context.Consumer;
+  return context;
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  createContext
+});

package/dist/context-selector/index.d.ts

@@ -0,0 +1,4 @@
+export { createContext } from './createContext';
+export { useContextSelector } from './useContextSelector';
+export { useHasParentContext } from './useHasParentContext';
+export type { Context, ContextSelector, ContextValue, ContextVersion, } from './types';

package/dist/context-selector/index.js

@@ -0,0 +1,33 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var context_selector_exports = {};
+__export(context_selector_exports, {
+  createContext: () => import_createContext.createContext,
+  useContextSelector: () => import_useContextSelector.useContextSelector,
+  useHasParentContext: () => import_useHasParentContext.useHasParentContext
+});
+module.exports = __toCommonJS(context_selector_exports);
+var import_createContext = require("./createContext");
+var import_useContextSelector = require("./useContextSelector");
+var import_useHasParentContext = require("./useHasParentContext");
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  createContext,
+  useContextSelector,
+  useHasParentContext
+});

package/dist/context-selector/types.d.ts

@@ -0,0 +1,24 @@
+import * as React from 'react';
+/**
+ * @internal
+ */
+export type Context<Value> = React.Context<Value> & {
+    Provider: React.FC<React.ProviderProps<Value>>;
+    Consumer: never;
+};
+export type ContextSelector<Value, SelectedValue> = (value: Value) => SelectedValue;
+/**
+ * @internal
+ */
+export type ContextVersion = number;
+/**
+ * @internal
+ */
+export type ContextValue<Value> = {
+    /** Holds a set of subscribers from components. */
+    listeners: ((payload: readonly [ContextVersion, Value]) => void)[];
+    /** Holds an actual value of React's context that will be propagated down for computations. */
+    value: React.MutableRefObject<Value>;
+    /** A version field is used to sync a context value and consumers. */
+    version: React.MutableRefObject<ContextVersion>;
+};

package/dist/context-selector/types.js

@@ -0,0 +1,15 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var types_exports = {};
+module.exports = __toCommonJS(types_exports);

package/dist/context-selector/useContextSelector.d.ts

@@ -0,0 +1,29 @@
+import { Context, ContextSelector } from './types';
+/**
+ * This hook returns context selected value by selector.
+ * It will only accept context created by `createContext` from this package.
+ * It will trigger re-render only if the selected value is referentially changed.
+ *
+ * @param context - Context created by createContext from this package
+ * @param selector - Function that selects a value from the context
+ * @returns The selected value from the context
+ *
+ * @example
+ * ```tsx
+ * interface MyContextValue {
+ *   count: number;
+ *   name: string;
+ * }
+ *
+ * const MyContext = createContext<MyContextValue>({ count: 0, name: '' });
+ *
+ * function Counter() {
+ *   // Only re-renders when count changes, not when name changes
+ *   const count = useContextSelector(MyContext, ctx => ctx.count);
+ *   const increment = useContextSelector(MyContext, ctx => ctx.increment);
+ *
+ *   return <button onClick={increment}>{count}</button>;
+ * }
+ * ```
+ */
+export declare const useContextSelector: <Value, SelectedValue>(context: Context<Value>, selector: ContextSelector<Value, SelectedValue>) => SelectedValue;

package/dist/context-selector/useContextSelector.js

@@ -0,0 +1,92 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var useContextSelector_exports = {};
+__export(useContextSelector_exports, {
+  useContextSelector: () => useContextSelector
+});
+module.exports = __toCommonJS(useContextSelector_exports);
+var React = __toESM(require("react"));
+var import_useEventCallback = __toESM(require("../hooks/useEventCallback"));
+var import_useIsomorphicLayoutEffect = require("../hooks/useIsomorphicLayoutEffect");
+const useContextSelector = (context, selector) => {
+  const contextValue = React.useContext(
+    context
+  );
+  const {
+    value: { current: value },
+    version: { current: version },
+    listeners
+  } = contextValue;
+  const selected = selector(value);
+  const [state, setState] = React.useState([
+    value,
+    selected
+  ]);
+  const dispatch = (payload) => {
+    setState((prevState) => {
+      if (!payload) {
+        return [value, selected];
+      }
+      if (payload[0] <= version) {
+        if (Object.is(prevState[1], selected)) {
+          return prevState;
+        }
+        return [value, selected];
+      }
+      try {
+        if (Object.is(prevState[0], payload[1])) {
+          return prevState;
+        }
+        const nextSelected = selector(payload[1]);
+        if (Object.is(prevState[1], nextSelected)) {
+          return prevState;
+        }
+        return [payload[1], nextSelected];
+      } catch (e) {
+        console.error(e);
+      }
+      return [prevState[0], prevState[1]];
+    });
+  };
+  if (!Object.is(state[1], selected)) {
+    dispatch(void 0);
+  }
+  const stableDispatch = (0, import_useEventCallback.default)(dispatch);
+  (0, import_useIsomorphicLayoutEffect.useIsomorphicLayoutEffect)(() => {
+    listeners.push(stableDispatch);
+    return () => {
+      const index = listeners.indexOf(stableDispatch);
+      listeners.splice(index, 1);
+    };
+  }, [stableDispatch, listeners]);
+  return state[1];
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  useContextSelector
+});

package/dist/context-selector/useHasParentContext.d.ts

@@ -0,0 +1,26 @@
+import { Context } from './types';
+/**
+ * Utility hook for contexts created by createContext from this package
+ * to determine if a parent context exists.
+ *
+ * WARNING: This hook will not work for native React contexts
+ *
+ * @param context - Context created by createContext from this package
+ * @returns Whether the hook is wrapped by a parent context provider
+ *
+ * @example
+ * ```tsx
+ * const MyContext = createContext({ value: 'default' });
+ *
+ * function MyComponent() {
+ *   const hasContext = useHasParentContext(MyContext);
+ *
+ *   if (hasContext) {
+ *     return <div>I am inside context provider</div>;
+ *   } else {
+ *     return <div>I can only use default context value</div>;
+ *   }
+ * }
+ * ```
+ */
+export declare function useHasParentContext<Value>(context: Context<Value>): boolean;

package/dist/context-selector/useHasParentContext.js

@@ -0,0 +1,46 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var useHasParentContext_exports = {};
+__export(useHasParentContext_exports, {
+  useHasParentContext: () => useHasParentContext
+});
+module.exports = __toCommonJS(useHasParentContext_exports);
+var React = __toESM(require("react"));
+function useHasParentContext(context) {
+  const contextValue = React.useContext(
+    context
+  );
+  if (contextValue.version) {
+    return contextValue.version.current !== -1;
+  }
+  return false;
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  useHasParentContext
+});

package/dist/directionLocationUtil.d.ts

@@ -1,3 +1,4 @@
+import * as React from 'react';
 /**
  * 根据元素宽高判断是否超出边界，超出边界则重新定义方向
  */

package/dist/hooks/useDomReady/index.js

@@ -30,9 +30,9 @@ __export(useDomReady_exports, {
   default: () => useDomReady_default
 });
 module.exports = __toCommonJS(useDomReady_exports);
-var import_react = __toESM(require("react"));
+var React = __toESM(require("react"));
 function useDomReady(cb) {
-  import_react.default.useEffect(() => {
+  React.useEffect(() => {
     cb == null ? void 0 : cb();
   }, []);
 }

package/dist/hooks/useEventCallback.d.ts

@@ -1,6 +1,15 @@
 /**
- * https://github.com/facebook/react/issues/14099#issuecomment-440013892
+ * Modified `useCallback` that can be used when dependencies change too frequently.
  *
- * @param {function} fn
+ * Can occur when:
+ * - User props are dependencies which could change on every render
+ * - Volatile values (i.e. useState/useDispatch) are dependencies which could change frequently
+ *
+ * This should not be used often, but can be a useful re-render optimization since the callback
+ * is a ref and will not be invalidated between re-renders.
+ *
+ * @param fn - The callback function that will be used
+ * @see https://github.com/facebook/react/issues/14099#issuecomment-440013892
+ * @see https://reactjs.org/docs/hooks-faq.html#how-to-read-an-often-changing-value-from-usecallback
  */
-export default function useEventCallback(fn: any): (...args: any[]) => any;
+export default function useEventCallback<Args extends unknown[], Return>(fn: (...args: Args) => Return): (...args: Args) => Return;

package/dist/hooks/useEventCallback.js

@@ -30,11 +30,20 @@ __export(useEventCallback_exports, {
   default: () => useEventCallback
 });
 module.exports = __toCommonJS(useEventCallback_exports);
-var import_react = __toESM(require("react"));
+var React = __toESM(require("react"));
+var import_useIsomorphicLayoutEffect = require("./useIsomorphicLayoutEffect");
 function useEventCallback(fn) {
-  const ref = import_react.default.useRef(fn);
-  (0, import_react.useLayoutEffect)(() => {
-    ref.current = fn;
+  const callbackRef = React.useRef(() => {
+    throw new Error("Cannot call an event handler while rendering");
   });
-  return import_react.default.useCallback((...args) => (0, ref.current)(...args), []);
+  (0, import_useIsomorphicLayoutEffect.useIsomorphicLayoutEffect)(() => {
+    callbackRef.current = fn;
+  }, [fn]);
+  return React.useCallback(
+    (...args) => {
+      const callback = callbackRef.current;
+      return callback(...args);
+    },
+    [callbackRef]
+  );
 }

package/dist/hooks/useIsomorphicLayoutEffect.d.ts

@@ -0,0 +1,11 @@
+import * as React from 'react';
+/**
+ * React currently throws a warning when using useLayoutEffect on the server. To get around it, we can conditionally
+ * useEffect on the server (no-op) and useLayoutEffect in the browser. We occasionally need useLayoutEffect to
+ * ensure we don't get a render flash for certain operations, but we may also need affected components to render on
+ * the server.
+ *
+ * https://gist.github.com/gaearon/e7d97cdf38a2907924ea12e4ebdf3c85
+ * https://github.com/reduxjs/react-redux/blob/master/src/utils/useIsomorphicLayoutEffect.js
+ */
+export declare const useIsomorphicLayoutEffect: typeof React.useEffect;

package/dist/hooks/useIsomorphicLayoutEffect.js

@@ -0,0 +1,39 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var useIsomorphicLayoutEffect_exports = {};
+__export(useIsomorphicLayoutEffect_exports, {
+  useIsomorphicLayoutEffect: () => useIsomorphicLayoutEffect
+});
+module.exports = __toCommonJS(useIsomorphicLayoutEffect_exports);
+var React = __toESM(require("react"));
+var import_ssr = require("../ssr");
+const useIsomorphicLayoutEffect = (0, import_ssr.canUseDOM)() ? React.useLayoutEffect : React.useEffect;
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  useIsomorphicLayoutEffect
+});

package/dist/hooks/useMemoizedFn.js

@@ -45,7 +45,7 @@ function useMemoizedFn(fn) {
   fnRef.current = (0, import_react.useMemo)(() => fn, [fn]);
   const memoizedFn = (0, import_react.useRef)();
   if (!memoizedFn.current) {
-    memoizedFn.current = function(...args) {
+    memoizedFn.current = function memoized(...args) {
       return fnRef.current.apply(this, args);
     };
   }

package/dist/hooks/useSize.js

@@ -30,12 +30,12 @@ __export(useSize_exports, {
   default: () => useSize_default
 });
 module.exports = __toCommonJS(useSize_exports);
-var import_react = __toESM(require("react"));
+var React = __toESM(require("react"));
 var import_useDomReady = __toESM(require("./useDomReady"));
 var import_getBoundingClientRect = __toESM(require("../getBoundingClientRect"));
 var import_domTarget = require("../domTarget");
 function useSize(target) {
-  const [state, setState] = import_react.default.useState({});
+  const [state, setState] = React.useState({});
   (0, import_useDomReady.default)(() => {
     const el = (0, import_domTarget.getTargetElement)(target);
     if (el) {

package/dist/hooks/useTouchEmulator.js

@@ -26,9 +26,9 @@ __export(useTouchEmulator_exports, {
 module.exports = __toCommonJS(useTouchEmulator_exports);
 var import_react = require("react");
 let eventTarget;
-const Touch = function Touch2(target, identifier, pos, deltaX, deltaY) {
-  deltaX = deltaX || 0;
-  deltaY = deltaY || 0;
+const Touch = function Touch2(target, identifier, pos, dx = 0, dy = 0) {
+  const deltaX = dx || 0;
+  const deltaY = dy || 0;
   this.identifier = identifier;
   this.target = target;
   this.clientX = pos.clientX + deltaX;

package/dist/index.d.ts

@@ -15,3 +15,4 @@ export * from './domUtils';
 export * from './isType';
 export * from './render';
 export * from './themeCreator';
+export * from './context-selector';

package/dist/index.js

@@ -82,6 +82,7 @@ __reExport(src_exports, require("./domUtils"), module.exports);
 __reExport(src_exports, require("./isType"), module.exports);
 __reExport(src_exports, require("./render"), module.exports);
 __reExport(src_exports, require("./themeCreator"), module.exports);
+__reExport(src_exports, require("./context-selector"), module.exports);
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   blockTouch,
@@ -122,5 +123,6 @@ __reExport(src_exports, require("./themeCreator"), module.exports);
   ...require("./domUtils"),
   ...require("./isType"),
   ...require("./render"),
-  ...require("./themeCreator")
+  ...require("./themeCreator"),
+  ...require("./context-selector")
 });

package/dist/setRef.d.ts

@@ -1,2 +1,2 @@
-import React from 'react';
+import * as React from 'react';
 export default function setRef<T>(ref: React.MutableRefObject<T | null> | ((instance: T | null) => void) | null | undefined, value: T | null): void;

package/dist/ssr/canUseDOM.d.ts

@@ -0,0 +1,4 @@
+/**
+ * Verifies if an application can use DOM.
+ */
+export declare function canUseDOM(): boolean;

package/dist/ssr/canUseDOM.js

@@ -0,0 +1,29 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var canUseDOM_exports = {};
+__export(canUseDOM_exports, {
+  canUseDOM: () => canUseDOM
+});
+module.exports = __toCommonJS(canUseDOM_exports);
+function canUseDOM() {
+  return typeof window !== "undefined" && !!(window.document && window.document.createElement);
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  canUseDOM
+});

package/dist/ssr/index.d.ts

@@ -0,0 +1 @@
+export { canUseDOM } from './canUseDOM';

package/dist/ssr/index.js

@@ -0,0 +1,27 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var ssr_exports = {};
+__export(ssr_exports, {
+  canUseDOM: () => import_canUseDOM.canUseDOM
+});
+module.exports = __toCommonJS(ssr_exports);
+var import_canUseDOM = require("./canUseDOM");
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  canUseDOM
+});

package/dist/toArray.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 interface Option {
     keepEmpty?: boolean;
 }

package/dist/toArray.js

@@ -30,17 +30,17 @@ __export(toArray_exports, {
   default: () => toArray
 });
 module.exports = __toCommonJS(toArray_exports);
-var import_react = __toESM(require("react"));
+var React = __toESM(require("react"));
 var import_react_is = require("react-is");
 function toArray(children, option = {}) {
   let ret = [];
-  import_react.default.Children.forEach(children, (child) => {
+  React.Children.forEach(children, (child) => {
     if ((child === void 0 || child === null) && !option.keepEmpty) {
       return;
     }
     if (Array.isArray(child)) {
       ret = ret.concat(toArray(child));
-    } else if ((0, import_react_is.isFragment)(child) && child.props) {
+    } else if ((0, import_react_is.isFragment)(child) && React.isValidElement(child)) {
       ret = ret.concat(toArray(child.props.children, option));
     } else {
       ret.push(child);

package/dist/transitions.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 interface IEasing {
     easeInOut: string;
     easeIn: string;

package/dist/transitions.js

@@ -75,7 +75,7 @@ function formatMs(milliseconds) {
 function createTransitions(inputTransitions = {}) {
   const mergedEasing = __spreadValues(__spreadValues({}, easing), inputTransitions.easing);
   const mergedDuration = __spreadValues(__spreadValues({}, duration), inputTransitions.duration);
-  const create = (props = ["all"], options) => {
+  const create = (props = ["all"], options = {}) => {
     const {
       duration: durationOption = mergedDuration.standard,
       easing: easingOption = mergedEasing.easeInOut,

package/es/context-selector/createContext.d.ts

@@ -0,0 +1,26 @@
+import { Context } from './types';
+/**
+ * Creates a context that supports selective subscriptions.
+ * This allows components to subscribe to only specific parts of the context value
+ * and re-render only when those parts change.
+ *
+ * @param defaultValue - The default value for the context
+ * @returns A context object that can be used with useContextSelector
+ *
+ * @example
+ * ```tsx
+ * interface MyContextValue {
+ *   count: number;
+ *   name: string;
+ * }
+ *
+ * const MyContext = createContext<MyContextValue>({ count: 0, name: '' });
+ *
+ * function MyComponent() {
+ *   // Only re-renders when count changes, not when name changes
+ *   const count = useContextSelector(MyContext, ctx => ctx.count);
+ *   return <div>{count}</div>;
+ * }
+ * ```
+ */
+export declare const createContext: <Value>(defaultValue: Value) => Context<Value>;

package/es/context-selector/createContext.js

@@ -0,0 +1,53 @@
+import * as React from "react";
+import {
+  unstable_NormalPriority as NormalPriority,
+  unstable_runWithPriority as runWithPriority
+} from "scheduler";
+import { useIsomorphicLayoutEffect } from "../hooks/useIsomorphicLayoutEffect";
+const createProvider = (Original) => {
+  const Provider = (props) => {
+    const valueRef = React.useRef(props.value);
+    const versionRef = React.useRef(0);
+    const contextValue = React.useRef(null);
+    if (!contextValue.current) {
+      contextValue.current = {
+        value: valueRef,
+        version: versionRef,
+        listeners: []
+      };
+    }
+    useIsomorphicLayoutEffect(() => {
+      valueRef.current = props.value;
+      versionRef.current += 1;
+      runWithPriority(NormalPriority, () => {
+        contextValue.current.listeners.forEach(
+          (listener) => {
+            listener([versionRef.current, props.value]);
+          }
+        );
+      });
+    }, [props.value]);
+    return React.createElement(
+      Original,
+      { value: contextValue.current },
+      props.children
+    );
+  };
+  if (process.env.NODE_ENV !== "production") {
+    Provider.displayName = "ContextSelector.Provider";
+  }
+  return Provider;
+};
+const createContext = (defaultValue) => {
+  const context = React.createContext({
+    value: { current: defaultValue },
+    version: { current: -1 },
+    listeners: []
+  });
+  context.Provider = createProvider(context.Provider);
+  delete context.Consumer;
+  return context;
+};
+export {
+  createContext
+};

package/es/context-selector/index.d.ts

@@ -0,0 +1,4 @@
+export { createContext } from './createContext';
+export { useContextSelector } from './useContextSelector';
+export { useHasParentContext } from './useHasParentContext';
+export type { Context, ContextSelector, ContextValue, ContextVersion, } from './types';

package/es/context-selector/index.js

@@ -0,0 +1,8 @@
+import { createContext } from "./createContext";
+import { useContextSelector } from "./useContextSelector";
+import { useHasParentContext } from "./useHasParentContext";
+export {
+  createContext,
+  useContextSelector,
+  useHasParentContext
+};

package/es/context-selector/types.d.ts

@@ -0,0 +1,24 @@
+import * as React from 'react';
+/**
+ * @internal
+ */
+export type Context<Value> = React.Context<Value> & {
+    Provider: React.FC<React.ProviderProps<Value>>;
+    Consumer: never;
+};
+export type ContextSelector<Value, SelectedValue> = (value: Value) => SelectedValue;
+/**
+ * @internal
+ */
+export type ContextVersion = number;
+/**
+ * @internal
+ */
+export type ContextValue<Value> = {
+    /** Holds a set of subscribers from components. */
+    listeners: ((payload: readonly [ContextVersion, Value]) => void)[];
+    /** Holds an actual value of React's context that will be propagated down for computations. */
+    value: React.MutableRefObject<Value>;
+    /** A version field is used to sync a context value and consumers. */
+    version: React.MutableRefObject<ContextVersion>;
+};

package/es/context-selector/useContextSelector.d.ts

@@ -0,0 +1,29 @@
+import { Context, ContextSelector } from './types';
+/**
+ * This hook returns context selected value by selector.
+ * It will only accept context created by `createContext` from this package.
+ * It will trigger re-render only if the selected value is referentially changed.
+ *
+ * @param context - Context created by createContext from this package
+ * @param selector - Function that selects a value from the context
+ * @returns The selected value from the context
+ *
+ * @example
+ * ```tsx
+ * interface MyContextValue {
+ *   count: number;
+ *   name: string;
+ * }
+ *
+ * const MyContext = createContext<MyContextValue>({ count: 0, name: '' });
+ *
+ * function Counter() {
+ *   // Only re-renders when count changes, not when name changes
+ *   const count = useContextSelector(MyContext, ctx => ctx.count);
+ *   const increment = useContextSelector(MyContext, ctx => ctx.increment);
+ *
+ *   return <button onClick={increment}>{count}</button>;
+ * }
+ * ```
+ */
+export declare const useContextSelector: <Value, SelectedValue>(context: Context<Value>, selector: ContextSelector<Value, SelectedValue>) => SelectedValue;

package/es/context-selector/useContextSelector.js

@@ -0,0 +1,59 @@
+import * as React from "react";
+import useEventCallback from "../hooks/useEventCallback";
+import { useIsomorphicLayoutEffect } from "../hooks/useIsomorphicLayoutEffect";
+const useContextSelector = (context, selector) => {
+  const contextValue = React.useContext(
+    context
+  );
+  const {
+    value: { current: value },
+    version: { current: version },
+    listeners
+  } = contextValue;
+  const selected = selector(value);
+  const [state, setState] = React.useState([
+    value,
+    selected
+  ]);
+  const dispatch = (payload) => {
+    setState((prevState) => {
+      if (!payload) {
+        return [value, selected];
+      }
+      if (payload[0] <= version) {
+        if (Object.is(prevState[1], selected)) {
+          return prevState;
+        }
+        return [value, selected];
+      }
+      try {
+        if (Object.is(prevState[0], payload[1])) {
+          return prevState;
+        }
+        const nextSelected = selector(payload[1]);
+        if (Object.is(prevState[1], nextSelected)) {
+          return prevState;
+        }
+        return [payload[1], nextSelected];
+      } catch (e) {
+        console.error(e);
+      }
+      return [prevState[0], prevState[1]];
+    });
+  };
+  if (!Object.is(state[1], selected)) {
+    dispatch(void 0);
+  }
+  const stableDispatch = useEventCallback(dispatch);
+  useIsomorphicLayoutEffect(() => {
+    listeners.push(stableDispatch);
+    return () => {
+      const index = listeners.indexOf(stableDispatch);
+      listeners.splice(index, 1);
+    };
+  }, [stableDispatch, listeners]);
+  return state[1];
+};
+export {
+  useContextSelector
+};

package/es/context-selector/useHasParentContext.d.ts

@@ -0,0 +1,26 @@
+import { Context } from './types';
+/**
+ * Utility hook for contexts created by createContext from this package
+ * to determine if a parent context exists.
+ *
+ * WARNING: This hook will not work for native React contexts
+ *
+ * @param context - Context created by createContext from this package
+ * @returns Whether the hook is wrapped by a parent context provider
+ *
+ * @example
+ * ```tsx
+ * const MyContext = createContext({ value: 'default' });
+ *
+ * function MyComponent() {
+ *   const hasContext = useHasParentContext(MyContext);
+ *
+ *   if (hasContext) {
+ *     return <div>I am inside context provider</div>;
+ *   } else {
+ *     return <div>I can only use default context value</div>;
+ *   }
+ * }
+ * ```
+ */
+export declare function useHasParentContext<Value>(context: Context<Value>): boolean;

package/es/context-selector/useHasParentContext.js

@@ -0,0 +1,13 @@
+import * as React from "react";
+function useHasParentContext(context) {
+  const contextValue = React.useContext(
+    context
+  );
+  if (contextValue.version) {
+    return contextValue.version.current !== -1;
+  }
+  return false;
+}
+export {
+  useHasParentContext
+};

package/es/directionLocationUtil.d.ts

@@ -1,3 +1,4 @@
+import * as React from 'react';
 /**
  * 根据元素宽高判断是否超出边界，超出边界则重新定义方向
  */

package/es/hooks/useDomReady/index.js

@@ -1,4 +1,4 @@
-import React from "react";
+import * as React from "react";
 function useDomReady(cb) {
   React.useEffect(() => {
     cb == null ? void 0 : cb();

package/es/hooks/useEventCallback.d.ts

@@ -1,6 +1,15 @@
 /**
- * https://github.com/facebook/react/issues/14099#issuecomment-440013892
+ * Modified `useCallback` that can be used when dependencies change too frequently.
  *
- * @param {function} fn
+ * Can occur when:
+ * - User props are dependencies which could change on every render
+ * - Volatile values (i.e. useState/useDispatch) are dependencies which could change frequently
+ *
+ * This should not be used often, but can be a useful re-render optimization since the callback
+ * is a ref and will not be invalidated between re-renders.
+ *
+ * @param fn - The callback function that will be used
+ * @see https://github.com/facebook/react/issues/14099#issuecomment-440013892
+ * @see https://reactjs.org/docs/hooks-faq.html#how-to-read-an-often-changing-value-from-usecallback
  */
-export default function useEventCallback(fn: any): (...args: any[]) => any;
+export default function useEventCallback<Args extends unknown[], Return>(fn: (...args: Args) => Return): (...args: Args) => Return;

package/es/hooks/useEventCallback.js

@@ -1,10 +1,19 @@
-import React, { useLayoutEffect } from "react";
+import * as React from "react";
+import { useIsomorphicLayoutEffect } from "./useIsomorphicLayoutEffect";
 function useEventCallback(fn) {
-  const ref = React.useRef(fn);
-  useLayoutEffect(() => {
-    ref.current = fn;
+  const callbackRef = React.useRef(() => {
+    throw new Error("Cannot call an event handler while rendering");
   });
-  return React.useCallback((...args) => (0, ref.current)(...args), []);
+  useIsomorphicLayoutEffect(() => {
+    callbackRef.current = fn;
+  }, [fn]);
+  return React.useCallback(
+    (...args) => {
+      const callback = callbackRef.current;
+      return callback(...args);
+    },
+    [callbackRef]
+  );
 }
 export {
   useEventCallback as default

package/es/hooks/useIsomorphicLayoutEffect.d.ts

@@ -0,0 +1,11 @@
+import * as React from 'react';
+/**
+ * React currently throws a warning when using useLayoutEffect on the server. To get around it, we can conditionally
+ * useEffect on the server (no-op) and useLayoutEffect in the browser. We occasionally need useLayoutEffect to
+ * ensure we don't get a render flash for certain operations, but we may also need affected components to render on
+ * the server.
+ *
+ * https://gist.github.com/gaearon/e7d97cdf38a2907924ea12e4ebdf3c85
+ * https://github.com/reduxjs/react-redux/blob/master/src/utils/useIsomorphicLayoutEffect.js
+ */
+export declare const useIsomorphicLayoutEffect: typeof React.useEffect;

package/es/hooks/useIsomorphicLayoutEffect.js

@@ -0,0 +1,6 @@
+import * as React from "react";
+import { canUseDOM } from "../ssr";
+const useIsomorphicLayoutEffect = canUseDOM() ? React.useLayoutEffect : React.useEffect;
+export {
+  useIsomorphicLayoutEffect
+};

package/es/hooks/useMemoizedFn.js

@@ -13,7 +13,7 @@ function useMemoizedFn(fn) {
   fnRef.current = useMemo(() => fn, [fn]);
   const memoizedFn = useRef();
   if (!memoizedFn.current) {
-    memoizedFn.current = function(...args) {
+    memoizedFn.current = function memoized(...args) {
       return fnRef.current.apply(this, args);
     };
   }

package/es/hooks/useSize.js

@@ -1,4 +1,4 @@
-import React from "react";
+import * as React from "react";
 import useDomReady from "./useDomReady";
 import getBoundingClientRect from "../getBoundingClientRect";
 import { getTargetElement } from "../domTarget";

package/es/hooks/useTouchEmulator.js

@@ -1,8 +1,8 @@
 import { useEffect } from "react";
 let eventTarget;
-const Touch = function Touch2(target, identifier, pos, deltaX, deltaY) {
-  deltaX = deltaX || 0;
-  deltaY = deltaY || 0;
+const Touch = function Touch2(target, identifier, pos, dx = 0, dy = 0) {
+  const deltaX = dx || 0;
+  const deltaY = dy || 0;
   this.identifier = identifier;
   this.target = target;
   this.clientX = pos.clientX + deltaX;

package/es/index.d.ts

@@ -15,3 +15,4 @@ export * from './domUtils';
 export * from './isType';
 export * from './render';
 export * from './themeCreator';
+export * from './context-selector';

package/es/index.js

@@ -40,6 +40,7 @@ export * from "./domUtils";
 export * from "./isType";
 export * from "./render";
 export * from "./themeCreator";
+export * from "./context-selector";
 export {
   default8 as blockTouch,
   default3 as convertHexToRGBA,

package/es/setRef.d.ts

@@ -1,2 +1,2 @@
-import React from 'react';
+import * as React from 'react';
 export default function setRef<T>(ref: React.MutableRefObject<T | null> | ((instance: T | null) => void) | null | undefined, value: T | null): void;

package/es/ssr/canUseDOM.d.ts

@@ -0,0 +1,4 @@
+/**
+ * Verifies if an application can use DOM.
+ */
+export declare function canUseDOM(): boolean;

package/es/ssr/canUseDOM.js

@@ -0,0 +1,6 @@
+function canUseDOM() {
+  return typeof window !== "undefined" && !!(window.document && window.document.createElement);
+}
+export {
+  canUseDOM
+};

package/es/ssr/index.d.ts

@@ -0,0 +1 @@
+export { canUseDOM } from './canUseDOM';

package/es/ssr/index.js

@@ -0,0 +1,4 @@
+import { canUseDOM } from "./canUseDOM";
+export {
+  canUseDOM
+};

package/es/toArray.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 interface Option {
     keepEmpty?: boolean;
 }

package/es/toArray.js

@@ -1,4 +1,4 @@
-import React from "react";
+import * as React from "react";
 import { isFragment } from "react-is";
 function toArray(children, option = {}) {
   let ret = [];
@@ -8,7 +8,7 @@ function toArray(children, option = {}) {
     }
     if (Array.isArray(child)) {
       ret = ret.concat(toArray(child));
-    } else if (isFragment(child) && child.props) {
+    } else if (isFragment(child) && React.isValidElement(child)) {
       ret = ret.concat(toArray(child.props.children, option));
     } else {
       ret.push(child);

package/es/transitions.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 interface IEasing {
     easeInOut: string;
     easeIn: string;

package/es/transitions.js

@@ -52,7 +52,7 @@ function formatMs(milliseconds) {
 function createTransitions(inputTransitions = {}) {
   const mergedEasing = __spreadValues(__spreadValues({}, easing), inputTransitions.easing);
   const mergedDuration = __spreadValues(__spreadValues({}, duration), inputTransitions.duration);
-  const create = (props = ["all"], options) => {
+  const create = (props = ["all"], options = {}) => {
     const {
       duration: durationOption = mergedDuration.standard,
       easing: easingOption = mergedEasing.easeInOut,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bifrostui/utils",
-  "version": "2.0.0-alpha.12",
+  "version": "2.0.0-alpha.14",
   "description": "BUI React utilities for building components.",
   "main": "dist/index.js",
   "module": "es/index.js",
@@ -17,13 +17,14 @@
   },
   "dependencies": {
     "react-is": "^18.0.0",
-    "@bifrostui/styles": "2.0.0-alpha.12"
+    "@bifrostui/styles": "2.0.0-alpha.14"
   },
   "peerDependencies": {
     "@tarojs/runtime": "^3.0.0",
     "@tarojs/taro": "^3.0.0",
     "react": "^17.0.0 || ^18.0.0",
-    "react-dom": "^17.0.0 || ^18.0.0"
+    "react-dom": "^17.0.0 || ^18.0.0",
+    "scheduler": ">=0.27.0"
   },
   "license": "MIT",
   "publishConfig": {
@@ -32,6 +33,6 @@
   },
   "scripts": {
     "build": "node esbuild.config.js",
-    "test": "echo \"Error: run tests from root\" && exit 1"
+    "test": "cd ../.. && vitest run --project bui-utils"
   }
 }