@optiaxiom/react 1.2.1 → 1.2.3

package/dist/unstable.d.ts

@@ -1,13 +1,13 @@
 import * as react from 'react';
 import { ComponentPropsWithoutRef, ReactNode, ComponentPropsWithRef, ReactElement } from 'react';
-import { B as BoxProps, S as Sprinkles, L as Link, E as ExcludeProps, C as Checkbox, a as ExtendProps, D as DialogContent, M as MenuListbox, e as PopoverContent, d as ListboxScrollArea, b as ResponsiveArray, P as Popover } from './PopoverContent-CfLfy8ni.js';
+import { B as BoxProps, S as Sprinkles, L as Link, E as ExcludeProps, C as Checkbox, a as ExtendProps, D as DialogContent, M as MenuListbox, e as PopoverContent, b as ResponsiveArray, P as Popover, d as DropdownMenuSub } from './PopoverContent-BKiRFMYx.js';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as react_day_picker from 'react-day-picker';
 import { Matcher, DateRange } from 'react-day-picker';
-import { UseComboboxProps } from 'downshift';
 import * as _radix_ui_react_separator from '@radix-ui/react-separator';
 import * as RadixPopover from '@radix-ui/react-popover';
 import { Table as Table$1 } from '@tanstack/table-core';
+import * as RadixMenu from '@radix-ui/react-dropdown-menu';
 import * as _radix_ui_react_popper from '@radix-ui/react-popper';
 import { PopperContent } from '@radix-ui/react-popper';
 import * as RadixDialog from '@radix-ui/react-dialog';
@@ -182,8 +182,9 @@ declare const Clock: react.ForwardRefExoticComponent<{
     className?: string;
 }>, never> & Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "color" | "className" | "defaultValue"> & react.RefAttributes<HTMLDivElement>>;
 
-type CommandProps<Item> = Pick<UseComboboxProps<Item>, "inputId" | "stateReducer"> & {
-    children: ReactNode;
+type CommandProps<Item> = {
+    children?: ReactNode;
+    defaultItems?: Item[];
     /**
      * The input value in controlled mode.
      */
@@ -191,7 +192,7 @@ type CommandProps<Item> = Pick<UseComboboxProps<Item>, "inputId" | "stateReducer
     /**
      * Return true if items need to be marked as disabled and skipped from keyboard navigation.
      */
-    isItemDisabled?: UseComboboxProps<Item>["isItemDisabled"];
+    isItemDisabled?: (item: Item, index: number) => boolean;
     /**
      * Return true if item need to be marked as selected.
      */
@@ -199,11 +200,11 @@ type CommandProps<Item> = Pick<UseComboboxProps<Item>, "inputId" | "stateReducer
     /**
      * The items we want to render.
      */
-    items: UseComboboxProps<Item>["items"];
+    items?: Item[];
     /**
      * Return a string representation of items if they are objects. Needed to show selected values inside triggers.
      */
-    itemToLabel?: UseComboboxProps<Item>["itemToString"];
+    itemToLabel?: (item: Item | null) => string;
     itemToSubItems?: (value: Item) => Item[] | null;
     /**
      * Handler that is called when input value changes.
@@ -214,12 +215,12 @@ type CommandProps<Item> = Pick<UseComboboxProps<Item>, "inputId" | "stateReducer
      */
     onItemSelect?: (value: Item) => void;
 };
-declare function Command<Item>({ children, inputValue: inputValueProp, isItemDisabled, isItemSelected, items, itemToLabel, itemToSubItems, onInputValueChange, onItemSelect, ...props }: CommandProps<Item>): react_jsx_runtime.JSX.Element;
+declare function Command<Item>({ children, defaultItems, inputValue: inputValueProp, isItemDisabled, isItemSelected, items: itemsProp, itemToLabel, itemToSubItems, onInputValueChange, onItemSelect, }: CommandProps<Item>): react_jsx_runtime.JSX.Element;
 declare namespace Command {
     var displayName: string;
 }
 
-type ComboboxProps<Item> = ExtendProps<Omit<ComponentPropsWithoutRef<typeof Command<Item>>, "inputId" | "itemToSubItems" | "selectedItem" | "stateReducer">, {
+type ComboboxProps<Item> = ExcludeProps<ExtendProps<ComponentPropsWithoutRef<typeof Command<Item>>, {
     children: ReactNode;
     /**
      * The initial open state in uncontrolled mode.
@@ -233,8 +234,8 @@ type ComboboxProps<Item> = ExtendProps<Omit<ComponentPropsWithoutRef<typeof Comm
      * The open state in controlled mode.
      */
     open?: boolean;
-}>;
-declare function Combobox<Item>({ children, defaultOpen, inputValue, isItemDisabled, isItemSelected, items, itemToLabel, onInputValueChange, onItemSelect, onOpenChange, open: openProp, }: ComboboxProps<Item>): react_jsx_runtime.JSX.Element;
+}>, "itemToSubItems">;
+declare function Combobox<Item>({ children, defaultItems, defaultOpen, inputValue: inputValueProp, isItemDisabled, isItemSelected, items: itemsProp, itemToLabel, onInputValueChange, onItemSelect, onOpenChange, open: openProp, }: ComboboxProps<Item>): react_jsx_runtime.JSX.Element;
 declare namespace Combobox {
     var displayName: string;
 }
@@ -324,6 +325,25 @@ declare const ComboboxLabel: react.ForwardRefExoticComponent<Omit<Omit<Omit<NonN
     className?: string;
 }>, never> & Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "color" | "className"> & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
 
+declare const CommandListbox: react.ForwardRefExoticComponent<Omit<NonNullable<Sprinkles & {
+    asChild?: boolean;
+    className?: string;
+}>, never> & Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "color" | "className"> & react.RefAttributes<HTMLDivElement>>;
+
+type ComboboxListboxProps = BoxProps<typeof CommandListbox, {
+    /**
+     * Whether to show loading spinner inside the menu.
+     */
+    loading?: boolean;
+} & ({
+    children: ((item: any) => ReactNode) | ReactNode;
+    items?: any[];
+} | {
+    children?: ReactNode;
+    items?: never;
+})>;
+declare const ComboboxListbox: react.ForwardRefExoticComponent<ComboboxListboxProps & react.RefAttributes<HTMLDivElement>>;
+
 declare const ComboboxRadioItem: react.ForwardRefExoticComponent<Omit<Omit<{
     item: unknown;
     selected?: boolean;
@@ -343,20 +363,6 @@ declare const ComboboxRadioItem: react.ForwardRefExoticComponent<Omit<Omit<{
     className?: string;
 }>, never> & Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "color" | "className"> & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
 
-type ComboboxScrollAreaProps = BoxProps<typeof ListboxScrollArea, {
-    /**
-     * Whether to show loading spinner inside the menu.
-     */
-    loading?: boolean;
-} & ({
-    children: (item: any) => ReactNode;
-    items?: any[];
-} | {
-    children?: ReactNode;
-    items?: never;
-})>;
-declare const ComboboxScrollArea: react.ForwardRefExoticComponent<ComboboxScrollAreaProps & react.RefAttributes<HTMLDivElement>>;
-
 declare const ComboboxSeparator: react.ForwardRefExoticComponent<Omit<Omit<NonNullable<Sprinkles & {
     asChild?: boolean;
     className?: string;
@@ -433,11 +439,6 @@ declare const CommandItem: react.ForwardRefExoticComponent<{
     className?: string;
 }>, never> & Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "color" | "className"> & react.RefAttributes<HTMLDivElement>>;
 
-declare const CommandListbox: react.ForwardRefExoticComponent<Omit<NonNullable<Sprinkles & {
-    asChild?: boolean;
-    className?: string;
-}>, never> & Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "color" | "className"> & react.RefAttributes<HTMLDivElement>>;
-
 declare const DataTable: react.ForwardRefExoticComponent<{
     /**
      * Pass the table instance returned from `useReactTable()` hook.
@@ -1489,6 +1490,466 @@ declare const DateRangePickerTrigger: react.ForwardRefExoticComponent<Omit<{
     placeholder?: string;
 } & react.RefAttributes<HTMLButtonElement>>;
 
+type DropdownMenuComboboxProps<Item> = ExcludeProps<ExtendProps<ComponentPropsWithoutRef<typeof DropdownMenuSub>, ComponentPropsWithoutRef<typeof Command<Item>>>, "itemToSubItems">;
+declare function DropdownMenuCombobox<Item>({ children, defaultItems, defaultOpen, inputValue: inputValueProp, isItemDisabled, isItemSelected, items: itemsProp, itemToLabel, onInputValueChange, onItemSelect, onOpenChange, open: openProp, }: DropdownMenuComboboxProps<Item>): react_jsx_runtime.JSX.Element;
+declare namespace DropdownMenuCombobox {
+    var displayName: string;
+}
+
+declare const DropdownMenuComboboxContent: react.ForwardRefExoticComponent<Omit<{
+    key?: react.Key | null | undefined;
+    asChild?: boolean | undefined;
+    children?: react.ReactNode;
+    p?: "0" | "2" | "4" | "6" | "8" | "10" | "12" | "16" | "20" | "24" | "32" | "40" | "48" | "64" | "80" | undefined;
+    slot?: string | undefined | undefined;
+    style?: react.CSSProperties | undefined;
+    title?: string | undefined | undefined;
+    fontFamily?: "mono" | "sans" | undefined;
+    fontSize?: "sm" | "md" | "xs" | "lg" | "xl" | "inherit" | "3xl" | "2xl" | "4xl" | undefined;
+    size?: ("sm" | "md" | "0" | "10" | "12" | "16" | "20" | "24" | "32" | "40" | "48" | "64" | "80" | "auto" | "xs" | "lg" | "xl" | "full" | "2xs" | "3xl" | "56" | "224" | "384" | "1/2" | "1/3" | "2/3" | "1/4" | "3/4" | "fit" | "max" | "min" | {
+        readonly base?: "sm" | "md" | "0" | "10" | "12" | "16" | "20" | "24" | "32" | "40" | "48" | "64" | "80" | "auto" | "xs" | "lg" | "xl" | "full" | "2xs" | "3xl" | "56" | "224" | "384" | "1/2" | "1/3" | "2/3" | "1/4" | "3/4" | "fit" | "max" | "min" | undefined;
+        readonly sm?: "sm" | "md" | "0" | "10" | "12" | "16" | "20" | "24" | "32" | "40" | "48" | "64" | "80" | "auto" | "xs" | "lg" | "xl" | "full" | "2xs" | "3xl" | "56" | "224" | "384" | "1/2" | "1/3" | "2/3" | "1/4" | "3/4" | "fit" | "max" | "min" | undefined;
+        readonly md?: "sm" | "md" | "0" | "10" | "12" | "16" | "20" | "24" | "32" | "40" | "48" | "64" | "80" | "auto" | "xs" | "lg" | "xl" | "full" | "2xs" | "3xl" | "56" | "224" | "384" | "1/2" | "1/3" | "2/3" | "1/4" | "3/4" | "fit" | "max" | "min" | undefined;
+    } | undefined) | ResponsiveArray<2 | 1 | 3, "sm" | "md" | "0" | "10" | "12" | "16" | "20" | "24" | "32" | "40" | "48" | "64" | "80" | "auto" | "xs" | "lg" | "xl" | "full" | "2xs" | "3xl" | "56" | "224" | "384" | "1/2" | "1/3" | "2/3" | "1/4" | "3/4" | "fit" | "max" | "min" | null>;
+    animation?: "ping" | "pulse" | "spin" | undefined;
+    borderColor?: "border.accent" | "border.control" | "border.control.hovered" | "border.default" | "border.disabled" | "border.error" | "border.focus" | "border.focus.error" | "border.secondary" | "border.success" | "border.tertiary" | "border.warning" | "transparent" | "current" | undefined;
+    color?: "fg.accent" | "fg.accent.hovered" | "fg.accent.strong" | "fg.avatar.neutral" | "fg.avatar.purple" | "fg.default" | "fg.default.inverse" | "fg.disabled" | "fg.error" | "fg.error.hovered" | "fg.error.light" | "fg.error.strong" | "fg.information" | "fg.information.light" | "fg.information.strong" | "fg.link.default" | "fg.link.default.hovered" | "fg.link.inverse" | "fg.link.subtle" | "fg.link.visited" | "fg.secondary" | "fg.spinner.default" | "fg.spinner.inverse" | "fg.success" | "fg.success.hovered" | "fg.success.light" | "fg.success.strong" | "fg.tertiary" | "fg.warning" | "fg.warning.hovered" | "fg.warning.inverse" | "fg.warning.light" | "fg.warning.strong" | "fg.white" | "transparent" | "current" | undefined;
+    cursor?: "pointer" | "default" | "not-allowed" | "text" | undefined;
+    fontWeight?: "inherit" | "400" | "500" | "600" | "700" | undefined;
+    objectFit?: "contain" | "cover" | "fill" | "none" | undefined;
+    overflowX?: "auto" | "hidden" | "visible" | undefined;
+    hidden?: boolean | undefined | undefined;
+    overflowY?: "auto" | "hidden" | "visible" | undefined;
+    pointerEvents?: "auto" | "none" | undefined;
+    textAlign?: "center" | "end" | "start" | "justify" | undefined;
+    textTransform?: "none" | "capitalize" | "uppercase" | undefined;
+    transition?: "opacity" | "transform" | "colors" | "none" | "all" | undefined;
+    whiteSpace?: "nowrap" | undefined;
+    bg?: "bg.accent" | "bg.accent.hovered" | "bg.accent.light" | "bg.accent.pressed" | "bg.accent.subtle" | "bg.avatar.neutral" | "bg.avatar.purple" | "bg.default" | "bg.default.hovered" | "bg.default.inverse" | "bg.default.inverse.hovered" | "bg.default.inverse.pressed" | "bg.default.pressed" | "bg.error" | "bg.error.hovered" | "bg.error.light" | "bg.error.pressed" | "bg.error.subtle" | "bg.error.subtlest" | "bg.information" | "bg.information.light" | "bg.information.subtle" | "bg.overlay" | "bg.page" | "bg.secondary" | "bg.secondary.hovered" | "bg.spinner.default" | "bg.spinner.inverse" | "bg.success" | "bg.success.hovered" | "bg.success.light" | "bg.success.subtle" | "bg.tertiary" | "bg.tertiary.hovered" | "bg.warning" | "bg.warning.hovered" | "bg.warning.light" | "bg.warning.subtle" | "transparent" | "current" | undefined;
+    border?: "0" | "2" | "1" | undefined;
+    borderB?: "0" | "2" | "1" | undefined;
+    borderL?: "0" | "2" | "1" | undefined;
+    borderR?: "0" | "2" | "1" | undefined;
+    borderT?: "0" | "2" | "1" | undefined;
+    m?: "0" | "2" | "4" | "6" | "8" | "10" | "12" | "16" | "20" | "24" | "32" | "40" | "48" | "64" | "80" | "auto" | undefined;
+    mx?: "0" | "2" | "4" | "6" | "8" | "10" | "12" | "16" | "20" | "24" | "32" | "40" | "48" | "64" | "80" | "auto" | undefined;
+    my?: "0" | "2" | "4" | "6" | "8" | "10" | "12" | "16" | "20" | "24" | "32" | "40" | "48" | "64" | "80" | "auto" | undefined;
+    mb?: "0" | "2" | "4" | "6" | "8" | "10" | "12" | "16" | "20" | "24" | "32" | "40" | "48" | "64" | "80" | "auto" | undefined;
+    ml?: "0" | "2" | "4" | "6" | "8" | "10" | "12" | "16" | "20" | "24" | "32" | "40" | "48" | "64" | "80" | "auto" | undefined;
+    mr?: "0" | "2" | "4" | "6" | "8" | "10" | "12" | "16" | "20" | "24" | "32" | "40" | "48" | "64" | "80" | "auto" | undefined;
+    mt?: "0" | "2" | "4" | "6" | "8" | "10" | "12" | "16" | "20" | "24" | "32" | "40" | "48" | "64" | "80" | "auto" | undefined;
+    overflow?: "auto" | "hidden" | "visible" | undefined;
+    px?: "0" | "2" | "4" | "6" | "8" | "10" | "12" | "16" | "20" | "24" | "32" | "40" | "48" | "64" | "80" | undefined;
+    py?: "0" | "2" | "4" | "6" | "8" | "10" | "12" | "16" | "20" | "24" | "32" | "40" | "48" | "64" | "80" | undefined;
+    pb?: "0" | "2" | "4" | "6" | "8" | "10" | "12" | "16" | "20" | "24" | "32" | "40" | "48" | "64" | "80" | undefined;
+    pl?: "0" | "2" | "4" | "6" | "8" | "10" | "12" | "16" | "20" | "24" | "32" | "40" | "48" | "64" | "80" | undefined;
+    pr?: "0" | "2" | "4" | "6" | "8" | "10" | "12" | "16" | "20" | "24" | "32" | "40" | "48" | "64" | "80" | undefined;
+    pt?: "0" | "2" | "4" | "6" | "8" | "10" | "12" | "16" | "20" | "24" | "32" | "40" | "48" | "64" | "80" | undefined;
+    rounded?: "sm" | "md" | "xs" | "lg" | "xl" | "full" | "inherit" | "none" | undefined;
+    shadow?: "sm" | "md" | "lg" | "none" | undefined;
+    z?: "0" | "10" | "20" | "auto" | "popover" | "toast" | "tooltip" | "30" | undefined;
+    gap?: ("0" | "2" | "4" | "6" | "8" | "10" | "12" | "16" | "20" | "24" | "32" | "40" | "48" | "64" | "80" | {
+        readonly base?: "0" | "2" | "4" | "6" | "8" | "10" | "12" | "16" | "20" | "24" | "32" | "40" | "48" | "64" | "80" | undefined;
+        readonly sm?: "0" | "2" | "4" | "6" | "8" | "10" | "12" | "16" | "20" | "24" | "32" | "40" | "48" | "64" | "80" | undefined;
+        readonly md?: "0" | "2" | "4" | "6" | "8" | "10" | "12" | "16" | "20" | "24" | "32" | "40" | "48" | "64" | "80" | undefined;
+    } | undefined) | ResponsiveArray<2 | 1 | 3, "0" | "2" | "4" | "6" | "8" | "10" | "12" | "16" | "20" | "24" | "32" | "40" | "48" | "64" | "80" | null>;
+    alignItems?: ("center" | "end" | "start" | "normal" | "stretch" | {
+        readonly base?: "center" | "end" | "start" | "normal" | "stretch" | undefined;
+        readonly sm?: "center" | "end" | "start" | "normal" | "stretch" | undefined;
+        readonly md?: "center" | "end" | "start" | "normal" | "stretch" | undefined;
+    } | undefined) | ResponsiveArray<2 | 1 | 3, "center" | "end" | "start" | "normal" | "stretch" | null>;
+    alignSelf?: ("center" | "end" | "start" | "normal" | "stretch" | {
+        readonly base?: "center" | "end" | "start" | "normal" | "stretch" | undefined;
+        readonly sm?: "center" | "end" | "start" | "normal" | "stretch" | undefined;
+        readonly md?: "center" | "end" | "start" | "normal" | "stretch" | undefined;
+    } | undefined) | ResponsiveArray<2 | 1 | 3, "center" | "end" | "start" | "normal" | "stretch" | null>;
+    display?: ("table" | "none" | "flex" | "grid" | "block" | "inline" | "inline-block" | "inline-flex" | "table-cell" | "table-row" | {
+        readonly base?: "table" | "none" | "flex" | "grid" | "block" | "inline" | "inline-block" | "inline-flex" | "table-cell" | "table-row" | undefined;
+        readonly sm?: "table" | "none" | "flex" | "grid" | "block" | "inline" | "inline-block" | "inline-flex" | "table-cell" | "table-row" | undefined;
+        readonly md?: "table" | "none" | "flex" | "grid" | "block" | "inline" | "inline-block" | "inline-flex" | "table-cell" | "table-row" | undefined;
+    } | undefined) | ResponsiveArray<2 | 1 | 3, "table" | "none" | "flex" | "grid" | "block" | "inline" | "inline-block" | "inline-flex" | "table-cell" | "table-row" | null>;
+    flex?: ("auto" | "1" | "none" | "initial" | {
+        readonly base?: "auto" | "1" | "none" | "initial" | undefined;
+        readonly sm?: "auto" | "1" | "none" | "initial" | undefined;
+        readonly md?: "auto" | "1" | "none" | "initial" | undefined;
+    } | undefined) | ResponsiveArray<2 | 1 | 3, "auto" | "1" | "none" | "initial" | null>;
+    flexDirection?: ("column" | "column-reverse" | "row" | "row-reverse" | {
+        readonly base?: "column" | "column-reverse" | "row" | "row-reverse" | undefined;
+        readonly sm?: "column" | "column-reverse" | "row" | "row-reverse" | undefined;
+        readonly md?: "column" | "column-reverse" | "row" | "row-reverse" | undefined;
+    } | undefined) | ResponsiveArray<2 | 1 | 3, "column" | "column-reverse" | "row" | "row-reverse" | null>;
+    flexWrap?: ("nowrap" | "wrap" | {
+        readonly base?: "nowrap" | "wrap" | undefined;
+        readonly sm?: "nowrap" | "wrap" | undefined;
+        readonly md?: "nowrap" | "wrap" | undefined;
+    } | undefined) | ResponsiveArray<2 | 1 | 3, "nowrap" | "wrap" | null>;
+    gridColumn?: ("2" | "4" | "1" | "3" | {
+        readonly base?: "2" | "4" | "1" | "3" | undefined;
+        readonly sm?: "2" | "4" | "1" | "3" | undefined;
+        readonly md?: "2" | "4" | "1" | "3" | undefined;
+    } | undefined) | ResponsiveArray<2 | 1 | 3, "2" | "4" | "1" | "3" | null>;
+    gridTemplateColumns?: ("2" | "4" | "1" | "3" | {
+        readonly base?: "2" | "4" | "1" | "3" | undefined;
+        readonly sm?: "2" | "4" | "1" | "3" | undefined;
+        readonly md?: "2" | "4" | "1" | "3" | undefined;
+    } | undefined) | ResponsiveArray<2 | 1 | 3, "2" | "4" | "1" | "3" | null>;
+    justifyContent?: ("center" | "end" | "start" | "normal" | "stretch" | "flex-end" | "flex-start" | "space-around" | "space-between" | "space-evenly" | {
+        readonly base?: "center" | "end" | "start" | "normal" | "stretch" | "flex-end" | "flex-start" | "space-around" | "space-between" | "space-evenly" | undefined;
+        readonly sm?: "center" | "end" | "start" | "normal" | "stretch" | "flex-end" | "flex-start" | "space-around" | "space-between" | "space-evenly" | undefined;
+        readonly md?: "center" | "end" | "start" | "normal" | "stretch" | "flex-end" | "flex-start" | "space-around" | "space-between" | "space-evenly" | undefined;
+    } | undefined) | ResponsiveArray<2 | 1 | 3, "center" | "end" | "start" | "normal" | "stretch" | "flex-end" | "flex-start" | "space-around" | "space-between" | "space-evenly" | null>;
+    justifyItems?: ("center" | "end" | "start" | "normal" | "stretch" | {
+        readonly base?: "center" | "end" | "start" | "normal" | "stretch" | undefined;
+        readonly sm?: "center" | "end" | "start" | "normal" | "stretch" | undefined;
+        readonly md?: "center" | "end" | "start" | "normal" | "stretch" | undefined;
+    } | undefined) | ResponsiveArray<2 | 1 | 3, "center" | "end" | "start" | "normal" | "stretch" | null>;
+    placeItems?: ("center" | {
+        readonly base?: "center" | undefined;
+        readonly sm?: "center" | undefined;
+        readonly md?: "center" | undefined;
+    } | undefined) | ResponsiveArray<2 | 1 | 3, "center" | null>;
+    maxH?: "sm" | "md" | "xs" | "lg" | "full" | undefined;
+    maxW?: ("sm" | "md" | "xs" | "lg" | "full" | {
+        readonly base?: "sm" | "md" | "xs" | "lg" | "full" | undefined;
+        readonly sm?: "sm" | "md" | "xs" | "lg" | "full" | undefined;
+        readonly md?: "sm" | "md" | "xs" | "lg" | "full" | undefined;
+    } | undefined) | ResponsiveArray<2 | 1 | 3, "sm" | "md" | "xs" | "lg" | "full" | null>;
+    h?: ("sm" | "md" | "0" | "10" | "12" | "16" | "20" | "24" | "32" | "40" | "48" | "64" | "80" | "auto" | "xs" | "lg" | "xl" | "full" | "2xs" | "3xl" | "56" | "224" | "384" | "1/2" | "1/3" | "2/3" | "1/4" | "3/4" | "fit" | "max" | "min" | {
+        readonly base?: "sm" | "md" | "0" | "10" | "12" | "16" | "20" | "24" | "32" | "40" | "48" | "64" | "80" | "auto" | "xs" | "lg" | "xl" | "full" | "2xs" | "3xl" | "56" | "224" | "384" | "1/2" | "1/3" | "2/3" | "1/4" | "3/4" | "fit" | "max" | "min" | undefined;
+        readonly sm?: "sm" | "md" | "0" | "10" | "12" | "16" | "20" | "24" | "32" | "40" | "48" | "64" | "80" | "auto" | "xs" | "lg" | "xl" | "full" | "2xs" | "3xl" | "56" | "224" | "384" | "1/2" | "1/3" | "2/3" | "1/4" | "3/4" | "fit" | "max" | "min" | undefined;
+        readonly md?: "sm" | "md" | "0" | "10" | "12" | "16" | "20" | "24" | "32" | "40" | "48" | "64" | "80" | "auto" | "xs" | "lg" | "xl" | "full" | "2xs" | "3xl" | "56" | "224" | "384" | "1/2" | "1/3" | "2/3" | "1/4" | "3/4" | "fit" | "max" | "min" | undefined;
+    } | undefined) | ResponsiveArray<2 | 1 | 3, "sm" | "md" | "0" | "10" | "12" | "16" | "20" | "24" | "32" | "40" | "48" | "64" | "80" | "auto" | "xs" | "lg" | "xl" | "full" | "2xs" | "3xl" | "56" | "224" | "384" | "1/2" | "1/3" | "2/3" | "1/4" | "3/4" | "fit" | "max" | "min" | null>;
+    w?: ("sm" | "md" | "0" | "10" | "12" | "16" | "20" | "24" | "32" | "40" | "48" | "64" | "80" | "auto" | "xs" | "lg" | "xl" | "full" | "2xs" | "3xl" | "56" | "224" | "384" | "1/2" | "1/3" | "2/3" | "1/4" | "3/4" | "fit" | "max" | "min" | {
+        readonly base?: "sm" | "md" | "0" | "10" | "12" | "16" | "20" | "24" | "32" | "40" | "48" | "64" | "80" | "auto" | "xs" | "lg" | "xl" | "full" | "2xs" | "3xl" | "56" | "224" | "384" | "1/2" | "1/3" | "2/3" | "1/4" | "3/4" | "fit" | "max" | "min" | undefined;
+        readonly sm?: "sm" | "md" | "0" | "10" | "12" | "16" | "20" | "24" | "32" | "40" | "48" | "64" | "80" | "auto" | "xs" | "lg" | "xl" | "full" | "2xs" | "3xl" | "56" | "224" | "384" | "1/2" | "1/3" | "2/3" | "1/4" | "3/4" | "fit" | "max" | "min" | undefined;
+        readonly md?: "sm" | "md" | "0" | "10" | "12" | "16" | "20" | "24" | "32" | "40" | "48" | "64" | "80" | "auto" | "xs" | "lg" | "xl" | "full" | "2xs" | "3xl" | "56" | "224" | "384" | "1/2" | "1/3" | "2/3" | "1/4" | "3/4" | "fit" | "max" | "min" | undefined;
+    } | undefined) | ResponsiveArray<2 | 1 | 3, "sm" | "md" | "0" | "10" | "12" | "16" | "20" | "24" | "32" | "40" | "48" | "64" | "80" | "auto" | "xs" | "lg" | "xl" | "full" | "2xs" | "3xl" | "56" | "224" | "384" | "1/2" | "1/3" | "2/3" | "1/4" | "3/4" | "fit" | "max" | "min" | null>;
+    className?: string | undefined;
+    defaultChecked?: boolean | undefined | undefined;
+    defaultValue?: string | number | readonly string[] | undefined;
+    suppressContentEditableWarning?: boolean | undefined | undefined;
+    suppressHydrationWarning?: boolean | undefined | undefined;
+    accessKey?: string | undefined | undefined;
+    autoCapitalize?: "off" | "none" | "on" | "sentences" | "words" | "characters" | undefined | (string & {}) | undefined;
+    autoFocus?: boolean | undefined | undefined;
+    contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
+    contextMenu?: string | undefined | undefined;
+    draggable?: (boolean | "false" | "true") | undefined;
+    enterKeyHint?: "enter" | "done" | "go" | "next" | "previous" | "search" | "send" | undefined | undefined;
+    id?: string | undefined | undefined;
+    lang?: string | undefined | undefined;
+    nonce?: string | undefined | undefined;
+    spellCheck?: (boolean | "false" | "true") | undefined;
+    tabIndex?: number | undefined | undefined;
+    translate?: "yes" | "no" | undefined | undefined;
+    radioGroup?: string | undefined | undefined;
+    role?: react.AriaRole | undefined;
+    about?: string | undefined | undefined;
+    content?: string | undefined | undefined;
+    datatype?: string | undefined | undefined;
+    inlist?: any;
+    prefix?: string | undefined | undefined;
+    property?: string | undefined | undefined;
+    rel?: string | undefined | undefined;
+    resource?: string | undefined | undefined;
+    rev?: string | undefined | undefined;
+    typeof?: string | undefined | undefined;
+    vocab?: string | undefined | undefined;
+    autoCorrect?: string | undefined | undefined;
+    autoSave?: string | undefined | undefined;
+    itemProp?: string | undefined | undefined;
+    itemScope?: boolean | undefined | undefined;
+    itemType?: string | undefined | undefined;
+    itemID?: string | undefined | undefined;
+    itemRef?: string | undefined | undefined;
+    results?: number | undefined | undefined;
+    security?: string | undefined | undefined;
+    unselectable?: "on" | "off" | undefined | undefined;
+    inputMode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined | undefined;
+    is?: string | undefined | undefined;
+    "aria-activedescendant"?: string | undefined | undefined;
+    "aria-atomic"?: (boolean | "false" | "true") | undefined;
+    "aria-autocomplete"?: "none" | "inline" | "list" | "both" | undefined | undefined;
+    "aria-braillelabel"?: string | undefined | undefined;
+    "aria-brailleroledescription"?: string | undefined | undefined;
+    "aria-busy"?: (boolean | "false" | "true") | undefined;
+    "aria-checked"?: boolean | "false" | "mixed" | "true" | undefined | undefined;
+    "aria-colcount"?: number | undefined | undefined;
+    "aria-colindex"?: number | undefined | undefined;
+    "aria-colindextext"?: string | undefined | undefined;
+    "aria-colspan"?: number | undefined | undefined;
+    "aria-controls"?: string | undefined | undefined;
+    "aria-current"?: boolean | "false" | "true" | "page" | "step" | "location" | "date" | "time" | undefined | undefined;
+    "aria-describedby"?: string | undefined | undefined;
+    "aria-description"?: string | undefined | undefined;
+    "aria-details"?: string | undefined | undefined;
+    "aria-disabled"?: (boolean | "false" | "true") | undefined;
+    "aria-dropeffect"?: "none" | "copy" | "execute" | "link" | "move" | "popup" | undefined | undefined;
+    "aria-errormessage"?: string | undefined | undefined;
+    "aria-expanded"?: (boolean | "false" | "true") | undefined;
+    "aria-flowto"?: string | undefined | undefined;
+    "aria-grabbed"?: (boolean | "false" | "true") | undefined;
+    "aria-haspopup"?: boolean | "false" | "true" | "menu" | "listbox" | "tree" | "grid" | "dialog" | undefined | undefined;
+    "aria-hidden"?: (boolean | "false" | "true") | undefined;
+    "aria-invalid"?: boolean | "false" | "true" | "grammar" | "spelling" | undefined | undefined;
+    "aria-keyshortcuts"?: string | undefined | undefined;
+    "aria-label"?: string | undefined | undefined;
+    "aria-labelledby"?: string | undefined | undefined;
+    "aria-level"?: number | undefined | undefined;
+    "aria-live"?: "off" | "assertive" | "polite" | undefined | undefined;
+    "aria-modal"?: (boolean | "false" | "true") | undefined;
+    "aria-multiline"?: (boolean | "false" | "true") | undefined;
+    "aria-multiselectable"?: (boolean | "false" | "true") | undefined;
+    "aria-orientation"?: "horizontal" | "vertical" | undefined | undefined;
+    "aria-owns"?: string | undefined | undefined;
+    "aria-placeholder"?: string | undefined | undefined;
+    "aria-posinset"?: number | undefined | undefined;
+    "aria-pressed"?: boolean | "false" | "mixed" | "true" | undefined | undefined;
+    "aria-readonly"?: (boolean | "false" | "true") | undefined;
+    "aria-relevant"?: "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text" | "text additions" | "text removals" | undefined | undefined;
+    "aria-required"?: (boolean | "false" | "true") | undefined;
+    "aria-roledescription"?: string | undefined | undefined;
+    "aria-rowcount"?: number | undefined | undefined;
+    "aria-rowindex"?: number | undefined | undefined;
+    "aria-rowindextext"?: string | undefined | undefined;
+    "aria-rowspan"?: number | undefined | undefined;
+    "aria-selected"?: (boolean | "false" | "true") | undefined;
+    "aria-setsize"?: number | undefined | undefined;
+    "aria-sort"?: "none" | "ascending" | "descending" | "other" | undefined | undefined;
+    "aria-valuemax"?: number | undefined | undefined;
+    "aria-valuemin"?: number | undefined | undefined;
+    "aria-valuenow"?: number | undefined | undefined;
+    "aria-valuetext"?: string | undefined | undefined;
+    dangerouslySetInnerHTML?: {
+        __html: string | TrustedHTML;
+    } | undefined | undefined;
+    onCopy?: react.ClipboardEventHandler<HTMLDivElement> | undefined;
+    onCopyCapture?: react.ClipboardEventHandler<HTMLDivElement> | undefined;
+    onCut?: react.ClipboardEventHandler<HTMLDivElement> | undefined;
+    onCutCapture?: react.ClipboardEventHandler<HTMLDivElement> | undefined;
+    onPaste?: react.ClipboardEventHandler<HTMLDivElement> | undefined;
+    onPasteCapture?: react.ClipboardEventHandler<HTMLDivElement> | undefined;
+    onCompositionEnd?: react.CompositionEventHandler<HTMLDivElement> | undefined;
+    onCompositionEndCapture?: react.CompositionEventHandler<HTMLDivElement> | undefined;
+    onCompositionStart?: react.CompositionEventHandler<HTMLDivElement> | undefined;
+    onCompositionStartCapture?: react.CompositionEventHandler<HTMLDivElement> | undefined;
+    onCompositionUpdate?: react.CompositionEventHandler<HTMLDivElement> | undefined;
+    onCompositionUpdateCapture?: react.CompositionEventHandler<HTMLDivElement> | undefined;
+    onFocus?: react.FocusEventHandler<HTMLDivElement> | undefined;
+    onFocusCapture?: react.FocusEventHandler<HTMLDivElement> | undefined;
+    onBlur?: react.FocusEventHandler<HTMLDivElement> | undefined;
+    onBlurCapture?: react.FocusEventHandler<HTMLDivElement> | undefined;
+    onChange?: react.FormEventHandler<HTMLDivElement> | undefined;
+    onChangeCapture?: react.FormEventHandler<HTMLDivElement> | undefined;
+    onBeforeInput?: react.FormEventHandler<HTMLDivElement> | undefined;
+    onBeforeInputCapture?: react.FormEventHandler<HTMLDivElement> | undefined;
+    onInput?: react.FormEventHandler<HTMLDivElement> | undefined;
+    onInputCapture?: react.FormEventHandler<HTMLDivElement> | undefined;
+    onReset?: react.FormEventHandler<HTMLDivElement> | undefined;
+    onResetCapture?: react.FormEventHandler<HTMLDivElement> | undefined;
+    onSubmit?: react.FormEventHandler<HTMLDivElement> | undefined;
+    onSubmitCapture?: react.FormEventHandler<HTMLDivElement> | undefined;
+    onInvalid?: react.FormEventHandler<HTMLDivElement> | undefined;
+    onInvalidCapture?: react.FormEventHandler<HTMLDivElement> | undefined;
+    onLoad?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onLoadCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onError?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onErrorCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onKeyDown?: react.KeyboardEventHandler<HTMLDivElement> | undefined;
+    onKeyDownCapture?: react.KeyboardEventHandler<HTMLDivElement> | undefined;
+    onKeyPress?: react.KeyboardEventHandler<HTMLDivElement> | undefined;
+    onKeyPressCapture?: react.KeyboardEventHandler<HTMLDivElement> | undefined;
+    onKeyUp?: react.KeyboardEventHandler<HTMLDivElement> | undefined;
+    onKeyUpCapture?: react.KeyboardEventHandler<HTMLDivElement> | undefined;
+    onAbort?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onAbortCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onCanPlay?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onCanPlayCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onCanPlayThrough?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onCanPlayThroughCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onDurationChange?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onDurationChangeCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onEmptied?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onEmptiedCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onEncrypted?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onEncryptedCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onEnded?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onEndedCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onLoadedData?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onLoadedDataCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onLoadedMetadata?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onLoadedMetadataCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onLoadStart?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onLoadStartCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onPause?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onPauseCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onPlay?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onPlayCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onPlaying?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onPlayingCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onProgress?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onProgressCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onRateChange?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onRateChangeCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onResize?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onResizeCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onSeeked?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onSeekedCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onSeeking?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onSeekingCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onStalled?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onStalledCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onSuspend?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onSuspendCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onTimeUpdate?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onTimeUpdateCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onVolumeChange?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onVolumeChangeCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onWaiting?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onWaitingCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onAuxClick?: react.MouseEventHandler<HTMLDivElement> | undefined;
+    onAuxClickCapture?: react.MouseEventHandler<HTMLDivElement> | undefined;
+    onClick?: react.MouseEventHandler<HTMLDivElement> | undefined;
+    onClickCapture?: react.MouseEventHandler<HTMLDivElement> | undefined;
+    onContextMenu?: react.MouseEventHandler<HTMLDivElement> | undefined;
+    onContextMenuCapture?: react.MouseEventHandler<HTMLDivElement> | undefined;
+    onDoubleClick?: react.MouseEventHandler<HTMLDivElement> | undefined;
+    onDoubleClickCapture?: react.MouseEventHandler<HTMLDivElement> | undefined;
+    onDrag?: react.DragEventHandler<HTMLDivElement> | undefined;
+    onDragCapture?: react.DragEventHandler<HTMLDivElement> | undefined;
+    onDragEnd?: react.DragEventHandler<HTMLDivElement> | undefined;
+    onDragEndCapture?: react.DragEventHandler<HTMLDivElement> | undefined;
+    onDragEnter?: react.DragEventHandler<HTMLDivElement> | undefined;
+    onDragEnterCapture?: react.DragEventHandler<HTMLDivElement> | undefined;
+    onDragExit?: react.DragEventHandler<HTMLDivElement> | undefined;
+    onDragExitCapture?: react.DragEventHandler<HTMLDivElement> | undefined;
+    onDragLeave?: react.DragEventHandler<HTMLDivElement> | undefined;
+    onDragLeaveCapture?: react.DragEventHandler<HTMLDivElement> | undefined;
+    onDragOver?: react.DragEventHandler<HTMLDivElement> | undefined;
+    onDragOverCapture?: react.DragEventHandler<HTMLDivElement> | undefined;
+    onDragStart?: react.DragEventHandler<HTMLDivElement> | undefined;
+    onDragStartCapture?: react.DragEventHandler<HTMLDivElement> | undefined;
+    onDrop?: react.DragEventHandler<HTMLDivElement> | undefined;
+    onDropCapture?: react.DragEventHandler<HTMLDivElement> | undefined;
+    onMouseDown?: react.MouseEventHandler<HTMLDivElement> | undefined;
+    onMouseDownCapture?: react.MouseEventHandler<HTMLDivElement> | undefined;
+    onMouseEnter?: react.MouseEventHandler<HTMLDivElement> | undefined;
+    onMouseLeave?: react.MouseEventHandler<HTMLDivElement> | undefined;
+    onMouseMove?: react.MouseEventHandler<HTMLDivElement> | undefined;
+    onMouseMoveCapture?: react.MouseEventHandler<HTMLDivElement> | undefined;
+    onMouseOut?: react.MouseEventHandler<HTMLDivElement> | undefined;
+    onMouseOutCapture?: react.MouseEventHandler<HTMLDivElement> | undefined;
+    onMouseOver?: react.MouseEventHandler<HTMLDivElement> | undefined;
+    onMouseOverCapture?: react.MouseEventHandler<HTMLDivElement> | undefined;
+    onMouseUp?: react.MouseEventHandler<HTMLDivElement> | undefined;
+    onMouseUpCapture?: react.MouseEventHandler<HTMLDivElement> | undefined;
+    onSelect?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onSelectCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onTouchCancel?: react.TouchEventHandler<HTMLDivElement> | undefined;
+    onTouchCancelCapture?: react.TouchEventHandler<HTMLDivElement> | undefined;
+    onTouchEnd?: react.TouchEventHandler<HTMLDivElement> | undefined;
+    onTouchEndCapture?: react.TouchEventHandler<HTMLDivElement> | undefined;
+    onTouchMove?: react.TouchEventHandler<HTMLDivElement> | undefined;
+    onTouchMoveCapture?: react.TouchEventHandler<HTMLDivElement> | undefined;
+    onTouchStart?: react.TouchEventHandler<HTMLDivElement> | undefined;
+    onTouchStartCapture?: react.TouchEventHandler<HTMLDivElement> | undefined;
+    onPointerDown?: react.PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerDownCapture?: react.PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerMove?: react.PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerMoveCapture?: react.PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerUp?: react.PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerUpCapture?: react.PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerCancel?: react.PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerCancelCapture?: react.PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerEnter?: react.PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerLeave?: react.PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerOver?: react.PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerOverCapture?: react.PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerOut?: react.PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerOutCapture?: react.PointerEventHandler<HTMLDivElement> | undefined;
+    onGotPointerCapture?: react.PointerEventHandler<HTMLDivElement> | undefined;
+    onGotPointerCaptureCapture?: react.PointerEventHandler<HTMLDivElement> | undefined;
+    onLostPointerCapture?: react.PointerEventHandler<HTMLDivElement> | undefined;
+    onLostPointerCaptureCapture?: react.PointerEventHandler<HTMLDivElement> | undefined;
+    onScroll?: react.UIEventHandler<HTMLDivElement> | undefined;
+    onScrollCapture?: react.UIEventHandler<HTMLDivElement> | undefined;
+    onWheel?: react.WheelEventHandler<HTMLDivElement> | undefined;
+    onWheelCapture?: react.WheelEventHandler<HTMLDivElement> | undefined;
+    onAnimationStart?: react.AnimationEventHandler<HTMLDivElement> | undefined;
+    onAnimationStartCapture?: react.AnimationEventHandler<HTMLDivElement> | undefined;
+    onAnimationEnd?: react.AnimationEventHandler<HTMLDivElement> | undefined;
+    onAnimationEndCapture?: react.AnimationEventHandler<HTMLDivElement> | undefined;
+    onAnimationIteration?: react.AnimationEventHandler<HTMLDivElement> | undefined;
+    onAnimationIterationCapture?: react.AnimationEventHandler<HTMLDivElement> | undefined;
+    onTransitionEnd?: react.TransitionEventHandler<HTMLDivElement> | undefined;
+    onTransitionEndCapture?: react.TransitionEventHandler<HTMLDivElement> | undefined;
+    minW?: "0" | "trigger" | undefined;
+    onEscapeKeyDown?: ((event: KeyboardEvent) => void) | undefined;
+    onPointerDownOutside?: ((event: CustomEvent<{
+        originalEvent: PointerEvent;
+    }>) => void) | undefined;
+    onFocusOutside?: ((event: CustomEvent<{
+        originalEvent: FocusEvent;
+    }>) => void) | undefined;
+    onInteractOutside?: ((event: CustomEvent<{
+        originalEvent: PointerEvent;
+    }> | CustomEvent<{
+        originalEvent: FocusEvent;
+    }>) => void) | undefined;
+} & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+
+declare const DropdownMenuComboboxInput: react.ForwardRefExoticComponent<Omit<Omit<Pick<Omit<Pick<{
+    addonPointerEvents?: "auto" | "none";
+    inputRef: react.RefObject<HTMLInputElement & HTMLTextAreaElement>;
+} & {
+    children: React.ReactNode;
+}, "addonPointerEvents"> & Omit<NonNullable<Sprinkles & {
+    asChild?: boolean;
+    className?: string;
+}>, never> & Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "color" | "className"> & react.RefAttributes<HTMLInputElement & HTMLTextAreaElement>, "ref">, "addonPointerEvents"> & {
+    appearance?: "number" | "default" | undefined;
+    size?: "md" | "lg" | "xl" | undefined;
+} & {
+    addonAfter?: react.ReactNode;
+    addonBefore?: react.ReactNode;
+    htmlSize?: number;
+} & Omit<NonNullable<{
+    size?: "md" | "lg" | "xl" | undefined;
+} & {
+    disabled?: boolean;
+    error?: boolean;
+}>, "size"> & Omit<NonNullable<Sprinkles & {
+    asChild?: boolean;
+    className?: string;
+}>, "size"> & Omit<Omit<react.DetailedHTMLProps<react.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref">, "size" | "color" | "disabled" | "className"> & react.RefAttributes<HTMLInputElement>, "ref"> & react.RefAttributes<HTMLInputElement>, "ref"> & react.RefAttributes<HTMLInputElement>>;
+
+type DropdownMenuAutocompleteListboxProps = BoxProps<typeof CommandListbox, {
+    /**
+     * Whether to show loading spinner inside the menu.
+     */
+    loading?: boolean;
+} & ({
+    children: (item: any) => ReactNode;
+    items?: any[];
+} | {
+    children?: ReactNode;
+    items?: never;
+})>;
+declare const DropdownMenuComboboxListbox: react.ForwardRefExoticComponent<DropdownMenuAutocompleteListboxProps & react.RefAttributes<HTMLDivElement>>;
+
+declare const DropdownMenuComboboxTrigger: react.ForwardRefExoticComponent<Omit<Omit<NonNullable<{
+    intent?: "danger" | "neutral" | undefined;
+} & {
+    addonAfter?: react.ReactNode;
+    addonBefore?: react.ReactNode;
+    "data-highlighted"?: boolean;
+    description?: react.ReactNode;
+    icon?: react.ReactNode;
+}>, never> & Omit<NonNullable<Sprinkles & {
+    asChild?: boolean;
+    className?: string;
+}>, never> & Omit<Omit<RadixMenu.DropdownMenuSubTriggerProps & react.RefAttributes<HTMLDivElement>, "ref">, "asChild" | "color" | "className"> & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+
 declare const Highlight: react.ForwardRefExoticComponent<{
     children?: (chunk: ReactElement) => ReactNode;
     content?: string;
@@ -1663,7 +2124,7 @@ type SpotlightProps<Item> = ComponentPropsWithoutRef<typeof Command<Item>> & {
     onOpenChange?: (open: boolean) => void;
     open?: boolean;
 };
-declare function Spotlight<Item>({ children, defaultOpen, inputValue, isItemDisabled, items, itemToLabel, itemToSubItems, onInputValueChange, onItemSelect, onOpenChange, open: openProp, }: SpotlightProps<Item>): react_jsx_runtime.JSX.Element;
+declare function Spotlight<Item>({ children, defaultItems, defaultOpen, inputValue: inputValueProp, isItemDisabled, items: itemsProp, itemToLabel, itemToSubItems, onInputValueChange, onItemSelect, onOpenChange, open: openProp, }: SpotlightProps<Item>): react_jsx_runtime.JSX.Element;
 declare namespace Spotlight {
     var displayName: string;
 }
@@ -1714,6 +2175,11 @@ declare const SpotlightLabel: react.ForwardRefExoticComponent<Omit<NonNullable<S
     className?: string;
 }>, never> & Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "color" | "className"> & react.RefAttributes<HTMLDivElement>>;
 
+declare const SpotlightListbox: react.ForwardRefExoticComponent<Omit<Omit<NonNullable<Sprinkles & {
+    asChild?: boolean;
+    className?: string;
+}>, never> & Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "color" | "className"> & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+
 declare const SpotlightRadioItem: react.ForwardRefExoticComponent<Omit<Omit<Omit<NonNullable<{
     intent?: "danger" | "neutral" | undefined;
 } & {
@@ -1733,11 +2199,6 @@ declare const SpotlightRadioItem: react.ForwardRefExoticComponent<Omit<Omit<Omit
     className?: string;
 }>, never> & Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "color" | "className"> & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
 
-declare const SpotlightScrollArea: react.ForwardRefExoticComponent<Omit<Omit<Omit<NonNullable<Sprinkles & {
-    asChild?: boolean;
-    className?: string;
-}>, never> & Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "color" | "className"> & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
-
 declare const SpotlightSub: react.ForwardRefExoticComponent<Omit<{
     item: unknown;
 } & Omit<NonNullable<Sprinkles & {
@@ -1828,4 +2289,4 @@ declare const TableRow: react.ForwardRefExoticComponent<Omit<NonNullable<Sprinkl
     className?: string;
 }>, never> & Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLTableRowElement>, HTMLTableRowElement>, "ref">, "color" | "className"> & react.RefAttributes<HTMLTableRowElement>>;
 
-export { Breadcrumb, BreadcrumbEllipsis, type BreadcrumbEllipsisProps, BreadcrumbItem, type BreadcrumbItemProps, BreadcrumbLink, type BreadcrumbLinkProps, BreadcrumbPage, type BreadcrumbPageProps, type BreadcrumbProps, Calendar, Card, CardAction, CardCheckbox, CardContent, CardDescription, CardImage, CardLink, CardOverflow, CardTitle, Clock, Combobox, ComboboxCheckboxItem, ComboboxContent, ComboboxEmpty, ComboboxFooter, ComboboxGroup, ComboboxInput, ComboboxItem, ComboboxLabel, ComboboxRadioItem, ComboboxScrollArea, ComboboxSeparator, ComboboxTrigger, Command, CommandInput, CommandItem, CommandListbox, DataTable, DataTableBody, DataTableFooter, DateInput, DatePicker, DatePickerContent, DatePickerTrigger, DateRangePicker, DateRangePickerContent, DateRangePickerTrigger, Highlight, InlineInput, LabelMenuButton, Layout, Pill, PillGroup, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectRadioItem, SelectSeparator, SelectTrigger, Spotlight, SpotlightContent, SpotlightEmpty, SpotlightInput, SpotlightItem, SpotlightLabel, SpotlightRadioItem, SpotlightScrollArea, SpotlightSub, SpotlightSubItem, SpotlightTrigger, Table, TableAction, TableBody, TableCell, TableHeader, TableHeaderCell, TableRow };
+export { Breadcrumb, BreadcrumbEllipsis, type BreadcrumbEllipsisProps, BreadcrumbItem, type BreadcrumbItemProps, BreadcrumbLink, type BreadcrumbLinkProps, BreadcrumbPage, type BreadcrumbPageProps, type BreadcrumbProps, Calendar, Card, CardAction, CardCheckbox, CardContent, CardDescription, CardImage, CardLink, CardOverflow, CardTitle, Clock, Combobox, ComboboxCheckboxItem, ComboboxContent, ComboboxEmpty, ComboboxFooter, ComboboxGroup, ComboboxInput, ComboboxItem, ComboboxLabel, ComboboxListbox, ComboboxRadioItem, ComboboxSeparator, ComboboxTrigger, Command, CommandInput, CommandItem, CommandListbox, DataTable, DataTableBody, DataTableFooter, DateInput, DatePicker, DatePickerContent, DatePickerTrigger, DateRangePicker, DateRangePickerContent, DateRangePickerTrigger, DropdownMenuCombobox, DropdownMenuComboboxContent, DropdownMenuComboboxInput, DropdownMenuComboboxListbox, DropdownMenuComboboxTrigger, Highlight, InlineInput, LabelMenuButton, Layout, Pill, PillGroup, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectRadioItem, SelectSeparator, SelectTrigger, Spotlight, SpotlightContent, SpotlightEmpty, SpotlightInput, SpotlightItem, SpotlightLabel, SpotlightListbox, SpotlightRadioItem, SpotlightSub, SpotlightSubItem, SpotlightTrigger, Table, TableAction, TableBody, TableCell, TableHeader, TableHeaderCell, TableRow };