import * as _react_types_shared from '@react-types/shared'; import { ValidationError } from '@react-types/shared'; import * as React$1 from 'react'; import { Key, ReactNode } from 'react'; import * as _heroui_system from '@heroui/system'; import { PropGetter, DOMAttributes, HTMLHeroUIProps, SharedSelection } from '@heroui/system'; import { SelectVariantProps, SlotsToClasses, SelectSlots } from '@heroui/theme'; import { HiddenSelectProps } from './hidden-select.js'; import { ReactRef } from '@heroui/react-utils'; import { ListboxProps } from '@heroui/listbox'; import { PopoverProps } from '@heroui/popover'; import { ScrollShadowProps } from '@heroui/scroll-shadow'; import { MultiSelectState, MultiSelectProps } from '@heroui/use-aria-multiselect'; import { SpinnerProps } from '@heroui/spinner'; import 'react/jsx-runtime'; type SelectedItemProps = { /** A unique key for the item. */ key?: Key; /** The props passed to the item. */ props?: Record; /** The item data. */ data?: T | null; /** An accessibility label for this item. */ "aria-label"?: string; /** The rendered contents of this item (e.g. JSX). */ rendered?: ReactNode; /** A string value for this item, used for features like typeahead. */ textValue?: string; /** The type of item this item represents. */ type?: string; }; type SelectedItems = Array>; interface Props extends Omit, keyof SelectVariantProps> { /** * Ref to the DOM node. */ ref?: ReactRef; /** * The ref to the scroll element. Useful when having async loading of items. */ scrollRef?: ReactRef; /** * The ref to the spinner element. */ spinnerRef?: ReactRef; /** * Whether the select is required. * @default false */ isRequired?: boolean; /** * The icon that represents the select open state. Usually a chevron icon. */ selectorIcon?: ReactNode; /** * Element to be rendered in the left side of the select. */ startContent?: React.ReactNode; /** * Element to be rendered in the right side of the select. */ endContent?: ReactNode; /** * The placeholder for the select to display when no option is selected. * @default "Select an option" */ placeholder?: string; /** * Whether to display a top and bottom arrow indicators when the listbox is scrollable. * @default true */ showScrollIndicators?: boolean; /** * Props to be passed to the popover component. * * @default { placement: "bottom", triggerScaleOnOpen: false, offset: 5 } */ popoverProps?: Partial; /** * Props to be passed to the listbox component. * * @default { disableAnimation: false } */ listboxProps?: Partial; /** * Props to be passed to the scroll shadow component. This component * adds a shadow to the top and bottom of the listbox when it is scrollable. * * @default { hideScrollBar: true, offset: 15 } */ scrollShadowProps?: Partial; /** * Props to be passed to the spinner component. * * @default { size: "sm" , color: "current" } */ spinnerProps?: Partial; /** * Function to render the value of the select. It renders the selected item by default. * @param value * @returns */ renderValue?: (items: SelectedItems) => ReactNode; /** * Callback fired when the select menu is closed. */ onClose?: () => void; /** * Classes object to style the select and its children. */ classNames?: SlotsToClasses; /** * Handler that is called when the selection changes. */ onSelectionChange?: (keys: SharedSelection) => void; /** * A function that returns an error message if a given value is invalid. * Validation errors are displayed to the user when the form is submitted * if `validationBehavior="native"`. For realtime validation, use the `isInvalid` * prop instead. */ validate?: (value: string | string[]) => ValidationError | true | null | undefined; } interface SelectData { isDisabled?: boolean; isRequired?: boolean; isInvalid?: boolean; name?: string; validationBehavior?: "aria" | "native"; } declare const selectData: WeakMap, SelectData>; type UseSelectProps = Omit, keyof Omit, "onSelectionChange">> & Omit, "onSelectionChange"> & SelectVariantProps & { /** * The height of each item in the listbox. * For dataset with sections, the itemHeight must be the height of each item (including padding, border, margin). * This is required for virtualized listboxes to calculate the height of each item. * @default 36 */ itemHeight?: number; /** * The max height of the listbox (which will be rendered in a popover). * This is required for virtualized listboxes to set the maximum height of the listbox. */ maxListboxHeight?: number; /** * Whether to enable virtualization of the listbox items. * By default, virtualization is automatically enabled when the number of items is greater than 50. * @default undefined */ isVirtualized?: boolean; /** * Whether the listbox will be prevented from opening when there are no items. * @default false */ hideEmptyContent?: boolean; }; declare function useSelect(originalProps: UseSelectProps): { Component: _heroui_system.As; domRef: React$1.RefObject; state: MultiSelectState; label: ReactNode; name: string | undefined; triggerRef: React$1.RefObject; isLoading: boolean | undefined; placeholder: string | undefined; startContent: ReactNode; endContent: ReactNode; description: ReactNode; selectorIcon: ReactNode; hasHelper: boolean; labelPlacement: "outside" | "outside-left" | "inside" | undefined; hasPlaceholder: boolean; renderValue: ((items: SelectedItems) => ReactNode) | undefined; selectionMode: _react_types_shared.SelectionMode; disableAnimation: boolean; isOutsideLeft: boolean; shouldLabelBeOutside: boolean; shouldLabelBeInside: boolean; isInvalid: boolean; errorMessage: ReactNode; getBaseProps: PropGetter, DOMAttributes<_heroui_system.DOMElement>>; getTriggerProps: PropGetter, DOMAttributes<_heroui_system.DOMElement>>; getLabelProps: PropGetter, DOMAttributes<_heroui_system.DOMElement>>; getValueProps: PropGetter, DOMAttributes<_heroui_system.DOMElement>>; getListboxProps: (props?: any) => ListboxProps; getPopoverProps: (props?: DOMAttributes) => PopoverProps; getSpinnerProps: PropGetter, DOMAttributes<_heroui_system.DOMElement>>; getMainWrapperProps: PropGetter, DOMAttributes<_heroui_system.DOMElement>>; getListboxWrapperProps: PropGetter, DOMAttributes<_heroui_system.DOMElement>>; getHiddenSelectProps: (props?: {}) => HiddenSelectProps; getInnerWrapperProps: PropGetter, DOMAttributes<_heroui_system.DOMElement>>; getHelperWrapperProps: PropGetter, DOMAttributes<_heroui_system.DOMElement>>; getDescriptionProps: PropGetter, DOMAttributes<_heroui_system.DOMElement>>; getErrorMessageProps: PropGetter, DOMAttributes<_heroui_system.DOMElement>>; getSelectorIconProps: () => { "data-slot": string; "aria-hidden": boolean | "true" | "false"; "data-open": boolean | "true" | "false"; className: string; }; }; type UseSelectReturn = ReturnType; export { SelectedItemProps, SelectedItems, UseSelectProps, UseSelectReturn, selectData, useSelect };