@neuctra/ui/dist/types/components/basic/Select.d.ts

A modern, responsive, customizable React UI component library powered by Tailwind CSS and Vite.

import { default as React } from 'react';
export interface SelectOption {
    label: string;
    value: string;
    icon?: React.ReactNode;
    description?: string;
    onClick?: (option: SelectOption, event: React.MouseEvent) => void;
}
export interface SelectProps {
    label?: string;
    name?: string;
    value?: string | string[];
    showDescription?: boolean;
    showCheckIcon?: boolean;
    defaultValue?: string | string[];
    onValueChange?: (value: string | string[], name?: string) => void;
    options?: SelectOption[];
    placeholder?: string;
    required?: boolean;
    disabled?: boolean;
    error?: string | boolean;
    success?: boolean;
    helperText?: string;
    multiple?: boolean;
    /** Icons */
    labelIcon?: React.ElementType;
    prefixIcon?: React.ElementType;
    dropdownIcon?: React.ElementType;
    /** Configuration */
    size?: "sm" | "md" | "lg";
    maxDropdownHeight?: string | number;
    searchable?: boolean;
    searchPlaceholder?: string;
    searchClassName?: string;
    searchStyle?: React.CSSProperties;
    /** Customization */
    className?: string;
    containerClassName?: string;
    labelClassName?: string;
    triggerClassName?: string;
    valueClassName?: string;
    dropdownClassName?: string;
    itemClassName?: string;
    iconClassName?: string;
    helperClassName?: string;
    /** The label icon rendered before `label`. */
    labelIconClassName?: string;
    /** The wrapper around the search input, when `searchable` is set. */
    searchWrapperClassName?: string;
    /** The "No options available" empty state. */
    emptyClassName?: string;
    /** An option's label text. */
    itemLabelClassName?: string;
    /** An option's description text, when `showDescription` is set. */
    itemDescriptionClassName?: string;
    /** Item Icon Styling */
    itemIconClassName?: string;
    itemIconStyle?: React.CSSProperties;
    /** Check Icon Styling */
    checkIconClassName?: string;
    checkIconStyle?: React.CSSProperties;
    style?: React.CSSProperties;
    triggerStyle?: React.CSSProperties;
    dropdownStyle?: React.CSSProperties;
    itemStyle?: React.CSSProperties;
}
export declare const Select: React.ForwardRefExoticComponent<SelectProps & React.RefAttributes<HTMLDivElement>>;