@choice-ui/react 1.5.3 → 1.5.5

package/dist/components/select/src/select.js

@@ -1,8 +1,8 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Slot } from "../../slot/dist/index.js";
-import { MenuValue, MenuContextContent, MenuContextLabel, MenuDivider, MenuTrigger, MenuContextItem, useMenuScroll, MenuContext, MenuScrollArrow } from "../../menus/dist/index.js";
+import { MenuValue, MenuTrigger, MenuContextLabel, MenuContextItem, MenuEmpty, MenuDivider, MenuContextContent, useMenuScroll, MenuContext, MenuScrollArrow } from "../../menus/dist/index.js";
 import { useFloatingParentNodeId, FloatingTree, useFloatingNodeId, useFloating, offset, shift, flip, size, inner, autoUpdate, useClick, useDismiss, useRole, useInnerOffset, useListNavigation, useTypeahead, useInteractions, FloatingNode, FloatingPortal, FloatingOverlay, FloatingFocusManager, FloatingList } from "@floating-ui/react";
-import React, { memo, useMemo, Children, isValidElement, useRef, useState, useId, useEffect, cloneElement } from "react";
+import React__default, { memo, useMemo, Children, isValidElement, useRef, useState, useId, useEffect, cloneElement } from "react";
 import { useEventCallback } from "usehooks-ts";
 import { tcx } from "../../../shared/utils/tcx/tcx.js";
 const PORTAL_ROOT_ID = "floating-menu-root";
@@ -45,9 +45,9 @@ const SelectComponent = memo(function SelectComponent2(props) {
       const result = [];
       children2.forEach((child) => {
         if (!isValidElement(child)) return;
-        if (child.type === MenuContextItem || child.type === MenuDivider || child.type === MenuContextLabel) {
+        if (child.type === MenuContextItem || child.type === MenuDivider || child.type === MenuContextLabel || child.type === MenuEmpty) {
           result.push(child);
-        } else if (child.type === React.Fragment && child.props.children) {
+        } else if (child.type === React__default.Fragment && child.props.children) {
           const fragmentChildren = Children.toArray(child.props.children);
           result.push(...extractSelectItems(fragmentChildren));
         }
@@ -67,6 +67,9 @@ const SelectComponent = memo(function SelectComponent2(props) {
       if (child.type === MenuContextLabel) {
         return { label: true, children: child.props.children };
       }
+      if (child.type === MenuEmpty) {
+        return { empty: true, children: child.props.children, element: child };
+      }
       const {
         value: itemValue,
         children: itemChildren,
@@ -82,7 +85,7 @@ const SelectComponent = memo(function SelectComponent2(props) {
     });
   }, [itemElements]);
   const selectableOptions = useMemo(() => {
-    return options.filter((option) => !option.divider && !option.label);
+    return options.filter((option) => !option.divider && !option.label && !option.empty);
   }, [options]);
   const listRef = useRef([]);
   const listContentRef = useRef([]);
@@ -287,6 +290,9 @@ const SelectComponent = memo(function SelectComponent2(props) {
       if (option.label) {
         return /* @__PURE__ */ jsx(MenuContextLabel, { children: option.children }, `label-${index}`);
       }
+      if (option.empty) {
+        return /* @__PURE__ */ jsx(MenuEmpty, { children: option.children }, `empty-${index}`);
+      }
       const currentSelectableIndex = selectableIndex;
       selectableIndex++;
       const isSelected = currentSelectedIndex === currentSelectableIndex;
@@ -467,11 +473,12 @@ const BaseSelect = memo(function Select2(props) {
   return /* @__PURE__ */ jsx(SelectComponent, { ...props, children });
 });
 const Select = Object.assign(BaseSelect, {
-  Item: MenuContextItem,
-  Trigger: MenuTrigger,
+  Content: MenuContextContent,
   Divider: MenuDivider,
+  Empty: MenuEmpty,
+  Item: MenuContextItem,
   Label: MenuContextLabel,
-  Content: MenuContextContent,
+  Trigger: MenuTrigger,
   Value: MenuValue
 });
 Select.displayName = "Select";

package/dist/components/slot/dist/index.d.ts

@@ -3,23 +3,23 @@ interface SlotProps extends React.HTMLAttributes<HTMLElement> {
     children?: React.ReactNode;
 }
 /**
- * Optimized Slot component implementation
+ * 优化的 Slot 组件实现
  *
- * Compared to performance optimization of @radix-ui/react-slot:
- * 1. Use useMemo to cache children processing results
- * 2. Simplify props merging logic
- * 3. Avoid unnecessary deep traversal
- * 4. Better type safety
+ * 相比 @radix-ui/react-slot 的性能优化：
+ * 1. 使用 useMemo 缓存 children 处理结果
+ * 2. 简化 props 合并逻辑
+ * 3. 避免不必要的深度遍历
+ * 4. 更好的类型安全
  */
 declare const Slot: React.ForwardRefExoticComponent<SlotProps & React.RefAttributes<HTMLElement>>;
 /**
- * Hook version of Slot logic
- * Used for scenarios that require more granular control
+ * Hook 版本的 Slot 逻辑
+ * 用于需要更细粒度控制的场景
  */
 declare function useSlot(children: React.ReactNode, slotProps: Record<string, unknown>, forwardedRef?: React.Ref<unknown>): string | number | boolean | React.ReactElement<any, string | React.JSXElementConstructor<any>> | Iterable<React.ReactNode> | null | undefined;
 /**
- * Performance optimized asChild mode Hook
- * Used to replace `const Component = asChild ? Slot : "button"` mode
+ * 性能优化的 asChild 模式 Hook
+ * 用于替代 `const Component = asChild ? Slot : "button"` 模式
  */
 declare function useAsChild<T extends React.ElementType = "button">(asChild: boolean | undefined, defaultElement: T): T | typeof Slot;
 

package/dist/components/slot/dist/index.js

@@ -1,22 +1,14 @@
-import React, { forwardRef, useMemo } from "react";
+import React__default, { forwardRef, useMemo } from "react";
 import { jsx, Fragment } from "react/jsx-runtime";
-var REACT_MAJOR = parseInt(React.version.split(".")[0], 10);
-var IS_REACT_19 = REACT_MAJOR >= 19;
-function getChildRef(children) {
-  if (IS_REACT_19) {
-    return children.props.ref;
-  }
-  return void 0;
-}
 var Slot = forwardRef(
   ({ children, ...slotProps }, forwardedRef) => {
     const slottedChild = useMemo(() => {
-      if (!React.isValidElement(children)) {
+      if (!React__default.isValidElement(children)) {
         return children;
       }
-      const childRef = getChildRef(children);
+      const childRef = children.ref;
       const mergedProps = mergeProps(slotProps, children.props);
-      return React.cloneElement(children, {
+      return React__default.cloneElement(children, {
         ...mergedProps,
         ref: forwardedRef ? composeRefs(forwardedRef, childRef) : childRef
       });
@@ -28,12 +20,12 @@ Slot.displayName = "Slot";
 var SlotClone = forwardRef(
   ({ children, ...slotProps }, forwardedRef) => {
     const slottedChild = useMemo(() => {
-      if (!React.isValidElement(children)) {
+      if (!React__default.isValidElement(children)) {
         return children;
       }
-      const childRef = getChildRef(children);
+      const childRef = children.ref;
       const mergedProps = mergeProps(slotProps, children.props);
-      return React.cloneElement(children, {
+      return React__default.cloneElement(children, {
         ...mergedProps,
         ref: forwardedRef ? composeRefs(forwardedRef, childRef) : childRef
       });

package/dist/components/slot/src/slot.d.ts

@@ -6,28 +6,28 @@ interface SlotCloneProps {
     children: React.ReactNode;
 }
 /**
- * Optimized Slot component implementation
+ * 优化的 Slot 组件实现
  *
- * Compared to performance optimization of @radix-ui/react-slot:
- * 1. Use useMemo to cache children processing results
- * 2. Simplify props merging logic
- * 3. Avoid unnecessary deep traversal
- * 4. Better type safety
+ * 相比 @radix-ui/react-slot 的性能优化：
+ * 1. 使用 useMemo 缓存 children 处理结果
+ * 2. 简化 props 合并逻辑
+ * 3. 避免不必要的深度遍历
+ * 4. 更好的类型安全
  */
 export declare const Slot: React.ForwardRefExoticComponent<SlotProps & React.RefAttributes<HTMLElement>>;
 /**
- * SlotClone component - used for deep cloning
- * When nested structures need to be processed
+ * SlotClone 组件 - 用于深度克隆
+ * 当需要处理嵌套结构时使用
  */
 export declare const SlotClone: React.ForwardRefExoticComponent<SlotCloneProps & React.RefAttributes<HTMLElement>>;
 /**
- * Hook version of Slot logic
- * Used for scenarios that require more granular control
+ * Hook 版本的 Slot 逻辑
+ * 用于需要更细粒度控制的场景
  */
 export declare function useSlot(children: React.ReactNode, slotProps: Record<string, unknown>, forwardedRef?: React.Ref<unknown>): string | number | boolean | React.ReactElement<any, string | React.JSXElementConstructor<any>> | Iterable<React.ReactNode> | null | undefined;
 /**
- * Performance optimized asChild mode Hook
- * Used to replace `const Component = asChild ? Slot : "button"` mode
+ * 性能优化的 asChild 模式 Hook
+ * 用于替代 `const Component = asChild ? Slot : "button"` 模式
  */
 export declare function useAsChild<T extends React.ElementType = "button">(asChild: boolean | undefined, defaultElement: T): T | typeof Slot;
 export {};

package/dist/components/slot/src/slot.js

@@ -1,22 +1,14 @@
 import { jsx, Fragment } from "react/jsx-runtime";
-import React, { forwardRef, useMemo } from "react";
-const REACT_MAJOR = parseInt(React.version.split(".")[0], 10);
-const IS_REACT_19 = REACT_MAJOR >= 19;
-function getChildRef(children) {
-  if (IS_REACT_19) {
-    return children.props.ref;
-  }
-  return void 0;
-}
+import React__default, { forwardRef, useMemo } from "react";
 const Slot = forwardRef(
   ({ children, ...slotProps }, forwardedRef) => {
     const slottedChild = useMemo(() => {
-      if (!React.isValidElement(children)) {
+      if (!React__default.isValidElement(children)) {
         return children;
       }
-      const childRef = getChildRef(children);
+      const childRef = children.ref;
       const mergedProps = mergeProps(slotProps, children.props);
-      return React.cloneElement(children, {
+      return React__default.cloneElement(children, {
         ...mergedProps,
         ref: forwardedRef ? composeRefs(forwardedRef, childRef) : childRef
       });
@@ -28,12 +20,12 @@ Slot.displayName = "Slot";
 const SlotClone = forwardRef(
   ({ children, ...slotProps }, forwardedRef) => {
     const slottedChild = useMemo(() => {
-      if (!React.isValidElement(children)) {
+      if (!React__default.isValidElement(children)) {
         return children;
       }
-      const childRef = getChildRef(children);
+      const childRef = children.ref;
       const mergedProps = mergeProps(slotProps, children.props);
-      return React.cloneElement(children, {
+      return React__default.cloneElement(children, {
         ...mergedProps,
         ref: forwardedRef ? composeRefs(forwardedRef, childRef) : childRef
       });
@@ -86,12 +78,12 @@ function composeRefs(...refs) {
 }
 function useSlot(children, slotProps, forwardedRef) {
   return useMemo(() => {
-    if (!React.isValidElement(children)) {
+    if (!React__default.isValidElement(children)) {
       return children;
     }
-    const childRef = getChildRef(children);
+    const childRef = children.ref;
     const mergedProps = mergeProps(slotProps, children.props);
-    return React.cloneElement(children, {
+    return React__default.cloneElement(children, {
       ...mergedProps,
       ref: forwardedRef ? composeRefs(forwardedRef, childRef) : childRef
     });

package/dist/components/textarea/dist/index.js

@@ -1,5 +1,5 @@
 import { ScrollArea } from "../../scroll-area/dist/index.js";
-import React, { forwardRef, useRef, useState, useImperativeHandle, useMemo, useEffect, Children, isValidElement, memo } from "react";
+import React__default, { forwardRef, useRef, useState, useImperativeHandle, useMemo, useEffect, Children, isValidElement, memo } from "react";
 import { useUnmount, useEventCallback, useIsomorphicLayoutEffect } from "usehooks-ts";
 import { jsxs, jsx } from "react/jsx-runtime";
 import { mergeRefs } from "../../../shared/utils/merge-refs/merge-refs.js";
@@ -217,12 +217,12 @@ var getSizingData = (node) => {
 };
 var get_sizing_data_default = getSizingData;
 function useLatest(value) {
-  const ref = React.useRef(value);
+  const ref = React__default.useRef(value);
   ref.current = value;
   return ref;
 }
 function useComposedRef(libRef, userRef) {
-  return React.useCallback(
+  return React__default.useCallback(
     (node) => {
       libRef.current = node;
       if (typeof userRef === "function") {
@@ -256,7 +256,7 @@ function useListener(target, type, listener) {
   }, [target, type, latestListener]);
 }
 var useFormResetListener = (libRef, listener) => {
-  const stableListener = React.useCallback(
+  const stableListener = React__default.useCallback(
     (ev) => {
       var _a;
       if (((_a = libRef.current) == null ? void 0 : _a.form) === ev.target) {
@@ -271,7 +271,7 @@ var useWindowResizeListener = (listener) => {
   useListener(isBrowser ? window : null, "resize", listener);
 };
 var useFontsLoadedListener = (listener) => {
-  const safeListener = React.useCallback(
+  const safeListener = React__default.useCallback(
     (event) => {
       try {
         listener(event);
@@ -334,14 +334,14 @@ var TextareaAutosize = forwardRef(
     ...props
   }, userRef) {
     const isControlled = props.value !== void 0;
-    const libRef = React.useRef(null);
+    const libRef = React__default.useRef(null);
     const ref = useComposedRef(libRef, userRef);
-    const heightRef = React.useRef(0);
-    const measurementsCacheRef = React.useRef();
-    const lastValueRef = React.useRef("");
+    const heightRef = React__default.useRef(0);
+    const measurementsCacheRef = React__default.useRef();
+    const lastValueRef = React__default.useRef("");
     const normalizedMinRows = Math.max(minRows, 1);
     const normalizedMaxRows = maxRows && maxRows >= normalizedMinRows ? maxRows : void 0;
-    const resizeTextarea = React.useCallback(() => {
+    const resizeTextarea = React__default.useCallback(() => {
       const node = libRef.current;
       if (!node || !isBrowser) return;
       const currentValue = node.value || node.placeholder || "";
@@ -388,7 +388,7 @@ var TextareaAutosize = forwardRef(
       }
     }, [cacheMeasurements, normalizedMinRows, normalizedMaxRows, onHeightChange]);
     const debouncedResize = useDebounce(resizeTextarea, debounceMs);
-    const handleChange = React.useCallback(
+    const handleChange = React__default.useCallback(
       (event) => {
         if (!isControlled) {
           if (debounceMs > 0) {
@@ -401,7 +401,7 @@ var TextareaAutosize = forwardRef(
       },
       [isControlled, debounceMs, debouncedResize, resizeTextarea, onChange]
     );
-    const formResetCallback = React.useCallback(() => {
+    const formResetCallback = React__default.useCallback(() => {
       var _a;
       if (!isControlled) {
         const currentValue = ((_a = libRef.current) == null ? void 0 : _a.value) || "";
@@ -417,7 +417,7 @@ var TextareaAutosize = forwardRef(
     useFormResetListener(libRef, formResetCallback);
     useWindowResizeListener(resizeTextarea);
     useFontsLoadedListener(resizeTextarea);
-    React.useEffect(() => {
+    React__default.useEffect(() => {
       const node = libRef.current;
       if (!node || !isBrowser || typeof IntersectionObserver === "undefined") {
         return;
@@ -439,7 +439,7 @@ var TextareaAutosize = forwardRef(
         observer.disconnect();
       };
     }, [resizeTextarea]);
-    React.useEffect(() => {
+    React__default.useEffect(() => {
       resizeTextarea();
     }, [style == null ? void 0 : style.lineHeight, style == null ? void 0 : style.padding, resizeTextarea]);
     const mergedStyle = useMemo(() => {

package/dist/components/textarea/src/components/autosize/hooks.js

@@ -1,13 +1,13 @@
-import React from "react";
+import React__default from "react";
 import { isBrowser } from "./utils.js";
 import { useIsomorphicLayoutEffect } from "usehooks-ts";
 function useLatest(value) {
-  const ref = React.useRef(value);
+  const ref = React__default.useRef(value);
   ref.current = value;
   return ref;
 }
 function useComposedRef(libRef, userRef) {
-  return React.useCallback(
+  return React__default.useCallback(
     (node) => {
       libRef.current = node;
       if (typeof userRef === "function") {
@@ -41,7 +41,7 @@ function useListener(target, type, listener) {
   }, [target, type, latestListener]);
 }
 const useFormResetListener = (libRef, listener) => {
-  const stableListener = React.useCallback(
+  const stableListener = React__default.useCallback(
     (ev) => {
       var _a;
       if (((_a = libRef.current) == null ? void 0 : _a.form) === ev.target) {
@@ -56,7 +56,7 @@ const useWindowResizeListener = (listener) => {
   useListener(isBrowser ? window : null, "resize", listener);
 };
 const useFontsLoadedListener = (listener) => {
-  const safeListener = React.useCallback(
+  const safeListener = React__default.useCallback(
     (event) => {
       try {
         listener(event);

package/dist/components/textarea/src/components/autosize/index.js

@@ -1,5 +1,5 @@
 import { jsx } from "react/jsx-runtime";
-import React, { forwardRef, useMemo, useRef } from "react";
+import React__default, { forwardRef, useMemo, useRef } from "react";
 import { isBrowser, noop } from "./utils.js";
 import calculateNodeHeight from "./calculate-node-height.js";
 import getSizingData from "./get-sizing-data.js";
@@ -53,14 +53,14 @@ const TextareaAutosize = forwardRef(
     ...props
   }, userRef) {
     const isControlled = props.value !== void 0;
-    const libRef = React.useRef(null);
+    const libRef = React__default.useRef(null);
     const ref = useComposedRef(libRef, userRef);
-    const heightRef = React.useRef(0);
-    const measurementsCacheRef = React.useRef();
-    const lastValueRef = React.useRef("");
+    const heightRef = React__default.useRef(0);
+    const measurementsCacheRef = React__default.useRef();
+    const lastValueRef = React__default.useRef("");
     const normalizedMinRows = Math.max(minRows, 1);
     const normalizedMaxRows = maxRows && maxRows >= normalizedMinRows ? maxRows : void 0;
-    const resizeTextarea = React.useCallback(() => {
+    const resizeTextarea = React__default.useCallback(() => {
       const node = libRef.current;
       if (!node || !isBrowser) return;
       const currentValue = node.value || node.placeholder || "";
@@ -107,7 +107,7 @@ const TextareaAutosize = forwardRef(
       }
     }, [cacheMeasurements, normalizedMinRows, normalizedMaxRows, onHeightChange]);
     const debouncedResize = useDebounce(resizeTextarea, debounceMs);
-    const handleChange = React.useCallback(
+    const handleChange = React__default.useCallback(
       (event) => {
         if (!isControlled) {
           if (debounceMs > 0) {
@@ -120,7 +120,7 @@ const TextareaAutosize = forwardRef(
       },
       [isControlled, debounceMs, debouncedResize, resizeTextarea, onChange]
     );
-    const formResetCallback = React.useCallback(() => {
+    const formResetCallback = React__default.useCallback(() => {
       var _a;
       if (!isControlled) {
         const currentValue = ((_a = libRef.current) == null ? void 0 : _a.value) || "";
@@ -136,7 +136,7 @@ const TextareaAutosize = forwardRef(
     useFormResetListener(libRef, formResetCallback);
     useWindowResizeListener(resizeTextarea);
     useFontsLoadedListener(resizeTextarea);
-    React.useEffect(() => {
+    React__default.useEffect(() => {
       const node = libRef.current;
       if (!node || !isBrowser || typeof IntersectionObserver === "undefined") {
         return;
@@ -158,7 +158,7 @@ const TextareaAutosize = forwardRef(
         observer.disconnect();
       };
     }, [resizeTextarea]);
-    React.useEffect(() => {
+    React__default.useEffect(() => {
       resizeTextarea();
     }, [style == null ? void 0 : style.lineHeight, style == null ? void 0 : style.padding, resizeTextarea]);
     const mergedStyle = useMemo(() => {

package/dist/components/tree-list/src/tree-list.js

@@ -1,7 +1,7 @@
 import { jsx, Fragment } from "react/jsx-runtime";
 import { ScrollArea } from "../../scroll-area/dist/index.js";
 import { useVirtualizer } from "@tanstack/react-virtual";
-import React, { useState, useRef, useCallback, useEffect, useImperativeHandle, useMemo, createContext } from "react";
+import React__default, { useState, useRef, useCallback, useEffect, useImperativeHandle, useMemo, createContext } from "react";
 import { flattenTree, findNodePathById } from "./utils/tree.js";
 import { useSelection } from "./hooks/use-selection.js";
 import { useRenaming } from "./hooks/use-renaming.js";
@@ -11,14 +11,14 @@ import { TreeNodeWrapper } from "./components/tree-node-wrapper.js";
 import { tcx } from "../../../shared/utils/tcx/tcx.js";
 const TreeContext = createContext(null);
 const useTreeContext = () => {
-  const context = React.useContext(TreeContext);
+  const context = React__default.useContext(TreeContext);
   if (!context) {
     throw new Error("useTreeContext must be used within a TreeList");
   }
   return context;
 };
 const DEFAULT_NODE_HEIGHT = 32;
-const TreeList = React.forwardRef((props, ref) => {
+const TreeList = React__default.forwardRef((props, ref) => {
   const {
     data,
     selectedNodeIds,

package/dist/components/virtualized-grid/src/error-boundary.js

@@ -3,8 +3,8 @@ var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { en
 var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Button } from "../../button/dist/index.js";
-import React from "react";
-class VirtualizedGridErrorBoundary extends React.Component {
+import React__default from "react";
+class VirtualizedGridErrorBoundary extends React__default.Component {
   constructor(props) {
     super(props);
     __publicField(this, "retry", () => {

package/dist/index.js

@@ -136,6 +136,7 @@ import { Menubar } from "./components/menubar/src/menubar.js";
 import { MenuButton } from "./components/menus/src/components/menu-button.js";
 import { MenuCheckbox } from "./components/menus/src/components/menu-checkbox.js";
 import { MenuDivider } from "./components/menus/src/components/menu-divider.js";
+import { MenuEmpty } from "./components/menus/src/components/menu-empty.js";
 import { MenuInput } from "./components/menus/src/components/menu-input.js";
 import { MenuItem } from "./components/menus/src/components/menu-item.js";
 import { MenuLabel } from "./components/menus/src/components/menu-label.js";
@@ -173,6 +174,7 @@ import { NumericInput } from "./components/numeric-input/src/numeric-input.js";
 import { NumericInputElement } from "./components/numeric-input/src/components/numeric-input-element.js";
 import { NumericInputMenuTrigger } from "./components/numeric-input/src/components/numeric-input-menu-trigger.js";
 import { NumericInputVariable } from "./components/numeric-input/src/components/numeric-input-variable.js";
+import { OtpInput } from "./components/otp-input/src/otp-input.js";
 import { Pagination } from "./components/pagination/src/pagination.js";
 import { Panel, PanelBase } from "./components/panel/src/panel.js";
 import { PanelRow } from "./components/panel/src/components/panel-row.js";
@@ -346,6 +348,7 @@ export {
   MenuContextLabel,
   MenuContextSubTrigger,
   MenuDivider,
+  MenuEmpty,
   MenuInput,
   MenuItem,
   MenuLabel,
@@ -377,6 +380,7 @@ export {
   NumericInputMenuTrigger,
   NumericInputVariable,
   OPERATOR_CONFIGS,
+  OtpInput,
   PRESET_EASINGS,
   PREVIEW_KEYFRAMES,
   Pagination,