@choice-ui/react 1.6.1 → 1.6.3

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

@@ -13,8 +13,9 @@ declare const DialogTrigger: react.MemoExoticComponent<react.ForwardRefExoticCom
 
 type DialogPosition = "left-top" | "center-top" | "right-top" | "left-center" | "center" | "right-center" | "left-bottom" | "center-bottom" | "right-bottom";
 
-interface DialogProps {
+interface DialogProps extends Omit<react__default.HTMLAttributes<HTMLElement>, "title"> {
     afterOpenChange?: (isOpen: boolean) => void;
+    as?: react__default.ElementType;
     children?: react__default.ReactNode;
     className?: string;
     closeOnEscape?: boolean;

package/dist/components/dialog/dist/index.js

@@ -645,6 +645,7 @@ var dragDialogTv = tcv({
 });
 var PORTAL_ROOT_ID = "floating-modal-root";
 var DialogComponent = memo(function DialogComponent2({
+  as,
   className,
   children,
   closeOnEscape = true,
@@ -667,7 +668,8 @@ var DialogComponent = memo(function DialogComponent2({
   rememberSize = false,
   focusManagerProps = { initialFocus: 1 },
   transitionStylesProps,
-  root
+  root,
+  ...restProps
 }) {
   const dialogRef = useRef(null);
   const contentRef = useRef(null);
@@ -829,9 +831,11 @@ var DialogComponent = memo(function DialogComponent2({
                         floating.refs.setFloating(node);
                       }
                     },
+                    as,
                     style: getStyleWithDefaults,
                     className: tcx(style.dialog(), className),
                     ...floating.getFloatingProps(),
+                    ...restProps,
                     "aria-labelledby": titleId,
                     "aria-describedby": descriptionId,
                     role: "dialog",

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

@@ -3,8 +3,9 @@ import { FloatingFocusManagerProps, UseTransitionStylesProps } from '@floating-u
 import { default as React } from 'react';
 import { DialogHeader, DialogTrigger } from './components';
 import { DialogPosition } from './types';
-export interface DialogProps {
+export interface DialogProps extends Omit<React.HTMLAttributes<HTMLElement>, "title"> {
     afterOpenChange?: (isOpen: boolean) => void;
+    as?: React.ElementType;
     children?: React.ReactNode;
     className?: string;
     closeOnEscape?: boolean;

package/dist/components/dialog/src/dialog.js

@@ -14,6 +14,7 @@ import { findChildByType } from "../../../shared/utils/assertion.js";
 import { tcx } from "../../../shared/utils/tcx/tcx.js";
 const PORTAL_ROOT_ID = "floating-modal-root";
 const DialogComponent = memo(function DialogComponent2({
+  as,
   className,
   children,
   closeOnEscape = true,
@@ -36,7 +37,8 @@ const DialogComponent = memo(function DialogComponent2({
   rememberSize = false,
   focusManagerProps = { initialFocus: 1 },
   transitionStylesProps,
-  root
+  root,
+  ...restProps
 }) {
   const dialogRef = useRef(null);
   const contentRef = useRef(null);
@@ -198,9 +200,11 @@ const DialogComponent = memo(function DialogComponent2({
                         floating.refs.setFloating(node);
                       }
                     },
+                    as,
                     style: getStyleWithDefaults,
                     className: tcx(style.dialog(), className),
                     ...floating.getFloatingProps(),
+                    ...restProps,
                     "aria-labelledby": titleId,
                     "aria-describedby": descriptionId,
                     role: "dialog",

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

@@ -3,11 +3,12 @@ import { MenuValue } from '../../menus/src';
 import { KbdKey } from '../../kbd/src';
 import * as react from 'react';
 
-interface ListContentProps extends React.HTMLProps<HTMLDivElement> {
+interface ListContentProps extends Omit<React.HTMLAttributes<HTMLElement>, "as"> {
+    as?: React.ElementType;
     children: React.ReactNode;
     parentId?: string;
 }
-declare const ListContent: react.ForwardRefExoticComponent<Omit<ListContentProps, "ref"> & react.RefAttributes<HTMLDivElement>>;
+declare const ListContent: react.ForwardRefExoticComponent<ListContentProps & react.RefAttributes<HTMLDivElement>>;
 
 declare const ListDivider: react.ForwardRefExoticComponent<Omit<react.HTMLProps<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
 
@@ -21,6 +22,7 @@ interface ListItemProps extends React.HTMLAttributes<HTMLElement> {
         shortcut?: string;
     };
     disabled?: boolean;
+    href?: string;
     id?: string;
     parentId?: string;
     prefixElement?: ReactNode;
@@ -30,6 +32,8 @@ interface ListItemProps extends React.HTMLAttributes<HTMLElement> {
         modifier?: KbdKey | KbdKey[] | undefined;
     };
     suffixElement?: ReactNode;
+    target?: string;
+    rel?: string;
 }
 declare const ListItem: react.MemoExoticComponent<react.ForwardRefExoticComponent<ListItemProps & react.RefAttributes<HTMLElement>>>;
 
@@ -56,7 +60,8 @@ interface ListSubTriggerProps extends React.HTMLAttributes<HTMLButtonElement> {
 }
 declare const ListSubTrigger: react.MemoExoticComponent<react.ForwardRefExoticComponent<ListSubTriggerProps & react.RefAttributes<HTMLButtonElement>>>;
 
-interface ListProps extends Omit<HTMLProps<HTMLDivElement>, "size"> {
+interface ListProps extends Omit<HTMLProps<HTMLDivElement>, "size" | "as"> {
+    as?: React.ElementType;
     children: React.ReactNode;
     interactive?: boolean;
     selection?: boolean;

package/dist/components/list/src/components/list-content.d.ts

@@ -1,5 +1,6 @@
-export interface ListContentProps extends React.HTMLProps<HTMLDivElement> {
+export interface ListContentProps extends Omit<React.HTMLAttributes<HTMLElement>, "as"> {
+    as?: React.ElementType;
     children: React.ReactNode;
     parentId?: string;
 }
-export declare const ListContent: import('react').ForwardRefExoticComponent<Omit<ListContentProps, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
+export declare const ListContent: import('react').ForwardRefExoticComponent<ListContentProps & import('react').RefAttributes<HTMLDivElement>>;

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

@@ -4,7 +4,7 @@ import { ListContentTv } from "../tv.js";
 import { useExpandContext, useStructureContext, LevelContext } from "../context/list-context.js";
 import { tcx } from "../../../../shared/utils/tcx/tcx.js";
 const ListContent = forwardRef((props, ref) => {
-  const { children, className, parentId, ...rest } = props;
+  const { as: As = "div", children, className, parentId, ...rest } = props;
   const { isSubListExpanded } = useExpandContext();
   const { itemsMap, shouldShowReferenceLine, size } = useStructureContext();
   const level = useMemo(() => {
@@ -35,7 +35,7 @@ const ListContent = forwardRef((props, ref) => {
     size
   });
   return /* @__PURE__ */ jsx(LevelContext.Provider, { value: { level: safeLevel }, children: /* @__PURE__ */ jsx(
-    "div",
+    As,
     {
       ref,
       role: "group",

package/dist/components/list/src/components/list-item.d.ts

@@ -10,6 +10,7 @@ export interface ListItemProps extends React.HTMLAttributes<HTMLElement> {
         shortcut?: string;
     };
     disabled?: boolean;
+    href?: string;
     id?: string;
     parentId?: string;
     prefixElement?: ReactNode;
@@ -19,5 +20,7 @@ export interface ListItemProps extends React.HTMLAttributes<HTMLElement> {
         modifier?: KbdKey | KbdKey[] | undefined;
     };
     suffixElement?: ReactNode;
+    target?: string;
+    rel?: string;
 }
 export declare const ListItem: import('react').MemoExoticComponent<import('react').ForwardRefExoticComponent<ListItemProps & import('react').RefAttributes<HTMLElement>>>;

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

@@ -5,7 +5,8 @@ import { ListDivider } from './components/list-divider';
 import { ListItem } from './components/list-item';
 import { ListLabel } from './components/list-label';
 import { ListSubTrigger } from './components/list-sub-trigger';
-export interface ListProps extends Omit<HTMLProps<HTMLDivElement>, "size"> {
+export interface ListProps extends Omit<HTMLProps<HTMLDivElement>, "size" | "as"> {
+    as?: React.ElementType;
     children: React.ReactNode;
     interactive?: boolean;
     selection?: boolean;

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

@@ -13,6 +13,7 @@ import { useActiveItemContext } from "./context/list-context.js";
 import { tcx } from "../../../shared/utils/tcx/tcx.js";
 const ListBase = forwardRef((props, ref) => {
   const {
+    as,
     children,
     className,
     interactive = true,
@@ -34,6 +35,7 @@ const ListBase = forwardRef((props, ref) => {
         ListRoot,
         {
           ref,
+          as,
           className,
           ...rest,
           children
@@ -43,12 +45,12 @@ const ListBase = forwardRef((props, ref) => {
   );
 });
 const ListRoot = forwardRef((props, ref) => {
-  const { children, className, ...rest } = props;
+  const { as: As = "div", children, className, ...rest } = props;
   const handleKeyDown = useListKeyboard();
   const { setActiveItem } = useActiveItemContext();
   const tv = ListTv();
   return /* @__PURE__ */ jsx(
-    "div",
+    As,
     {
       ref,
       role: "list",

package/dist/components/md-render/dist/index.js

@@ -53,7 +53,7 @@ var mdRenderTv = tcv({
     },
     variant: {
       github: {
-        root: "markdown-body",
+        root: "github-md",
         tableWrapper: "table-wrapper"
       },
       default: {

package/dist/components/md-render/src/tv.js

@@ -44,7 +44,7 @@ const mdRenderTv = tcv({
     },
     variant: {
       github: {
-        root: "markdown-body",
+        root: "github-md",
         tableWrapper: "table-wrapper"
       },
       default: {

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

@@ -45,7 +45,8 @@ interface ModalTextareaProps extends Omit<TextareaProps, "children" | "label"> {
 }
 declare const ModalTextarea: react.MemoExoticComponent<react.ForwardRefExoticComponent<Omit<ModalTextareaProps, "ref"> & react.RefAttributes<HTMLTextAreaElement>>>;
 
-interface ModalProps extends Omit<HTMLProps<HTMLDivElement>, "title"> {
+interface ModalProps extends Omit<HTMLProps<HTMLDivElement>, "title" | "as"> {
+    as?: React.ElementType;
     className?: string;
     onClose?: () => void;
     title?: ReactNode;

package/dist/components/modal/dist/index.js

@@ -186,10 +186,10 @@ var ModalTextarea = memo(
 );
 ModalTextarea.displayName = "ModalTextarea";
 var ModalBase = forwardRef((props, ref) => {
-  const { className, title, onClose, ...rest } = props;
+  const { as: As = "div", className, title, onClose, ...rest } = props;
   const tv = ModalTv();
   return /* @__PURE__ */ jsx(
-    "div",
+    As,
     {
       ref,
       className: tcx(tv.root(), className),

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

@@ -1,6 +1,7 @@
 import { HTMLProps, ReactNode } from 'react';
 import { ModalBackdrop, ModalContent, ModalFooter, ModalHeader, ModalInput, ModalSelect, ModalTextarea } from './components';
-interface ModalProps extends Omit<HTMLProps<HTMLDivElement>, "title"> {
+interface ModalProps extends Omit<HTMLProps<HTMLDivElement>, "title" | "as"> {
+    as?: React.ElementType;
     className?: string;
     onClose?: () => void;
     title?: ReactNode;

package/dist/components/modal/src/modal.js

@@ -10,10 +10,10 @@ import { ModalTextarea } from "./components/modal-textarea.js";
 import { ModalBackdrop } from "./components/modal-backdrop.js";
 import { tcx } from "../../../shared/utils/tcx/tcx.js";
 const ModalBase = forwardRef((props, ref) => {
-  const { className, title, onClose, ...rest } = props;
+  const { as: As = "div", className, title, onClose, ...rest } = props;
   const tv = ModalTv();
   return /* @__PURE__ */ jsx(
-    "div",
+    As,
     {
       ref,
       className: tcx(tv.root(), className),

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

@@ -1,21 +1,22 @@
 import { ModalHeaderProps, ModalContent, ModalFooter } from '../../modal/src';
 import { FloatingFocusManagerProps, OffsetOptions, Placement } from '@floating-ui/react';
-import { default as react__default } from 'react';
-import * as react from 'react';
+import { default as React__default } from 'react';
+import * as React$1 from 'react';
 
-declare const PopoverHeader: react.MemoExoticComponent<react.ForwardRefExoticComponent<Omit<ModalHeaderProps, "ref"> & react.RefAttributes<HTMLDivElement>>>;
+declare const PopoverHeader: React$1.MemoExoticComponent<React$1.ForwardRefExoticComponent<Omit<ModalHeaderProps, "ref"> & React$1.RefAttributes<HTMLDivElement>>>;
 
-declare const PopoverTrigger: react.MemoExoticComponent<react.ForwardRefExoticComponent<{
+declare const PopoverTrigger: React$1.MemoExoticComponent<React$1.ForwardRefExoticComponent<{
     children: React.ReactNode;
-} & react.RefAttributes<HTMLElement>>>;
+} & React$1.RefAttributes<HTMLElement>>>;
 
-interface PopoverProps {
+interface PopoverProps extends Omit<React__default.HTMLAttributes<HTMLElement>, "title"> {
+    as?: React__default.ElementType;
     autoSize?: boolean;
     autoUpdate?: boolean;
-    children?: react__default.ReactNode;
+    children?: React__default.ReactNode;
     className?: string;
     closeOnEscape?: boolean;
-    contentRef?: react__default.RefObject<HTMLDivElement>;
+    contentRef?: React__default.RefObject<HTMLDivElement>;
     defaultOpen?: boolean;
     delay?: {
         close?: number;
@@ -39,9 +40,9 @@ interface PopoverProps {
      * If not specified, will auto-detect from triggerRef's ownerDocument.
      */
     root?: HTMLElement | null;
-    triggerRef?: react__default.RefObject<HTMLElement>;
+    triggerRef?: React__default.RefObject<HTMLElement>;
 }
-interface PopoverComponent extends react__default.FC<PopoverProps> {
+interface PopoverComponent extends React__default.FC<PopoverProps> {
     Content: typeof ModalContent;
     Footer: typeof ModalFooter;
     Header: typeof PopoverHeader;

package/dist/components/popover/dist/index.js

@@ -405,6 +405,7 @@ function useFloatingPopover({
 var PORTAL_ROOT_ID = "floating-popover-root";
 var DEFAULT_OFFSET = { mainAxis: 8, crossAxis: 0 };
 var DragPopover = memo(function DragPopover2({
+  as,
   className,
   children,
   triggerRef: externalTriggerRef,
@@ -430,7 +431,8 @@ var DragPopover = memo(function DragPopover2({
   autoSize = true,
   rememberPosition = false,
   maxWidth,
-  matchTriggerWidth = false
+  matchTriggerWidth = false,
+  ...restProps
 }) {
   const titleId = useId();
   const descriptionId = useId();
@@ -564,6 +566,7 @@ var DragPopover = memo(function DragPopover2({
               Modal,
               {
                 ref: handleFloatingRef,
+                as,
                 style: combinedStyles,
                 className: tcx(matchTriggerWidth && "max-w-none", className),
                 "data-state": floating.positionReady ? "open" : "opening",
@@ -571,6 +574,7 @@ var DragPopover = memo(function DragPopover2({
                 "data-draggable": draggable ? "true" : void 0,
                 "data-closing": floating.isClosing ? "true" : void 0,
                 ...floating.getFloatingProps(),
+                ...restProps,
                 role: "dialog",
                 "aria-modal": "true",
                 "aria-labelledby": titleId,

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

@@ -2,7 +2,8 @@ import { ModalContent, ModalFooter } from '../../modal/src';
 import { FloatingFocusManagerProps, Placement, OffsetOptions } from '@floating-ui/react';
 import { default as React } from 'react';
 import { PopoverHeader, PopoverTrigger } from './components';
-export interface PopoverProps {
+export interface PopoverProps extends Omit<React.HTMLAttributes<HTMLElement>, "title"> {
+    as?: React.ElementType;
     autoSize?: boolean;
     autoUpdate?: boolean;
     children?: React.ReactNode;

package/dist/components/popover/src/popover.js

@@ -14,6 +14,7 @@ import { tcx } from "../../../shared/utils/tcx/tcx.js";
 const PORTAL_ROOT_ID = "floating-popover-root";
 const DEFAULT_OFFSET = { mainAxis: 8, crossAxis: 0 };
 const DragPopover = memo(function DragPopover2({
+  as,
   className,
   children,
   triggerRef: externalTriggerRef,
@@ -39,7 +40,8 @@ const DragPopover = memo(function DragPopover2({
   autoSize = true,
   rememberPosition = false,
   maxWidth,
-  matchTriggerWidth = false
+  matchTriggerWidth = false,
+  ...restProps
 }) {
   const titleId = useId();
   const descriptionId = useId();
@@ -173,6 +175,7 @@ const DragPopover = memo(function DragPopover2({
               Modal,
               {
                 ref: handleFloatingRef,
+                as,
                 style: combinedStyles,
                 className: tcx(matchTriggerWidth && "max-w-none", className),
                 "data-state": floating.positionReady ? "open" : "opening",
@@ -180,6 +183,7 @@ const DragPopover = memo(function DragPopover2({
                 "data-draggable": draggable ? "true" : void 0,
                 "data-closing": floating.isClosing ? "true" : void 0,
                 ...floating.getFloatingProps(),
+                ...restProps,
                 role: "dialog",
                 "aria-modal": "true",
                 "aria-labelledby": titleId,

package/dist/components/scroll-area/dist/index.d.ts

@@ -1,5 +1,10 @@
+import { default as react__default } from 'react';
 import * as react from 'react';
 
+interface ScrollAreaContentProps extends Omit<react__default.HTMLAttributes<HTMLElement>, "as"> {
+    as?: react__default.ElementType;
+}
+
 type ScrollbarVisibilityType = "auto" | "always" | "scroll" | "hover";
 type ScrollbarMode = "default" | "padding-y" | "padding-x" | "padding-b" | "padding-t" | "padding-l" | "padding-r";
 type ScrollAreaVariant = "default" | "light" | "dark";
@@ -49,7 +54,7 @@ interface ThumbProps extends React.ComponentPropsWithoutRef<"div"> {
 declare const ScrollArea: react.ForwardRefExoticComponent<ScrollAreaProps & react.RefAttributes<HTMLDivElement>> & {
     Root: react.ForwardRefExoticComponent<ScrollAreaProps & react.RefAttributes<HTMLDivElement>>;
     Viewport: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
-    Content: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+    Content: react.ForwardRefExoticComponent<ScrollAreaContentProps & react.RefAttributes<HTMLDivElement>>;
     Scrollbar: react.ForwardRefExoticComponent<ScrollbarProps & react.RefAttributes<HTMLDivElement>>;
     Thumb: react.ForwardRefExoticComponent<ThumbProps & react.RefAttributes<HTMLDivElement>>;
     Corner: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;

package/dist/components/scroll-area/dist/index.js

@@ -917,7 +917,7 @@ var ScrollAreaViewport = forwardRef(
 );
 ScrollAreaViewport.displayName = "ScrollArea.Viewport";
 var ScrollAreaContent = forwardRef(
-  ({ className, children, ...props }, ref) => {
+  ({ as: As = "div", className, children, ...props }, ref) => {
     const { setContent, orientation } = useScrollAreaContext();
     const setRef = useCallback(
       (node) => {
@@ -943,7 +943,7 @@ var ScrollAreaContent = forwardRef(
       }
     }, [orientation]);
     return /* @__PURE__ */ jsx(
-      "div",
+      As,
       {
         ref: setRef,
         className: tcx(sizeClasses, className),

package/dist/components/scroll-area/src/components/scroll-area-content.d.ts

@@ -1,2 +1,5 @@
 import { default as React } from 'react';
-export declare const ScrollAreaContent: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export interface ScrollAreaContentProps extends Omit<React.HTMLAttributes<HTMLElement>, "as"> {
+    as?: React.ElementType;
+}
+export declare const ScrollAreaContent: React.ForwardRefExoticComponent<ScrollAreaContentProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/scroll-area/src/components/scroll-area-content.js

@@ -3,7 +3,7 @@ import { forwardRef, useCallback, useMemo } from "react";
 import { useScrollAreaContext } from "../context/scroll-area-context.js";
 import { tcx } from "../../../../shared/utils/tcx/tcx.js";
 const ScrollAreaContent = forwardRef(
-  ({ className, children, ...props }, ref) => {
+  ({ as: As = "div", className, children, ...props }, ref) => {
     const { setContent, orientation } = useScrollAreaContext();
     const setRef = useCallback(
       (node) => {
@@ -29,7 +29,7 @@ const ScrollAreaContent = forwardRef(
       }
     }, [orientation]);
     return /* @__PURE__ */ jsx(
-      "div",
+      As,
       {
         ref: setRef,
         className: tcx(sizeClasses, className),

package/dist/components/scroll-area/src/scroll-area.d.ts

@@ -2,7 +2,7 @@ import { ScrollAreaProps, ScrollbarProps, ThumbProps } from './types';
 export declare const ScrollArea: import('react').ForwardRefExoticComponent<ScrollAreaProps & import('react').RefAttributes<HTMLDivElement>> & {
     Root: import('react').ForwardRefExoticComponent<ScrollAreaProps & import('react').RefAttributes<HTMLDivElement>>;
     Viewport: import('react').ForwardRefExoticComponent<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
-    Content: import('react').ForwardRefExoticComponent<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
+    Content: import('react').ForwardRefExoticComponent<import('./components/scroll-area-content').ScrollAreaContentProps & import('react').RefAttributes<HTMLDivElement>>;
     Scrollbar: import('react').ForwardRefExoticComponent<ScrollbarProps & import('react').RefAttributes<HTMLDivElement>>;
     Thumb: import('react').ForwardRefExoticComponent<ThumbProps & import('react').RefAttributes<HTMLDivElement>>;
     Corner: import('react').ForwardRefExoticComponent<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;

package/dist/components/virtual-select/dist/index.d.ts

@@ -0,0 +1,48 @@
+import { MenuContextContent, MenuDivider, MenuEmpty, MenuContextItem, MenuSearch, MenuTrigger, MenuValue } from '../../menus/src';
+import { FloatingFocusManagerProps } from '@floating-ui/react';
+import { default as React } from 'react';
+interface VirtualSelectOption<T = unknown> {
+    value: string;
+    label: string;
+    disabled?: boolean;
+    data?: T;
+}
+interface VirtualSelectProps<T = unknown> {
+    className?: string;
+    closeOnEscape?: boolean;
+    disabled?: boolean;
+    emptyText?: string;
+    focusManagerProps?: Partial<FloatingFocusManagerProps>;
+    matchTriggerWidth?: boolean;
+    maxHeight?: number;
+    onChange?: (value: string) => void;
+    onOpenChange?: (open: boolean) => void;
+    open?: boolean;
+    options: VirtualSelectOption<T>[];
+    overscan?: number;
+    placeholder?: string;
+    placement?: "bottom-start" | "bottom-end";
+    portalId?: string;
+    readOnly?: boolean;
+    renderOption?: (option: VirtualSelectOption<T>, isSelected: boolean) => React.ReactNode;
+    renderValue?: (option: VirtualSelectOption<T> | null) => React.ReactNode;
+    root?: HTMLElement | null;
+    searchPlaceholder?: string;
+    size?: "default" | "large";
+    value?: string | null;
+    variant?: "default" | "light" | "reset";
+}
+interface VirtualSelectComponentType {
+    <T = unknown>(props: VirtualSelectProps<T>): React.ReactElement | null;
+    displayName?: string;
+    Content: typeof MenuContextContent;
+    Divider: typeof MenuDivider;
+    Empty: typeof MenuEmpty;
+    Item: typeof MenuContextItem;
+    Search: typeof MenuSearch;
+    Trigger: typeof MenuTrigger;
+    Value: typeof MenuValue;
+}
+declare const VirtualSelect: VirtualSelectComponentType;
+
+export { VirtualSelect, type VirtualSelectOption, type VirtualSelectProps };