@navinc/base-react-components/dist/wayfinder/select/select.d.ts

Nav's Pattern Library

import * as SelectPrimitive from '@radix-ui/react-select';
import { CSSProperties, ReactNode } from 'react';
import { InferComponentProps } from '../../types.js';
/** All internal styled components used to build the Select to allow fine-grained overrides */
export declare const SelectInternal: {
    SelectArrow: import("react").ForwardRefExoticComponent<SelectPrimitive.SelectArrowProps & import("react").RefAttributes<SVGSVGElement>>;
    Root: import("react").FC<SelectPrimitive.SelectProps>;
    Trigger: import("react").ComponentType<SelectPrimitive.SelectTriggerProps & import("react").RefAttributes<HTMLButtonElement>>;
    Value: import("react").ForwardRefExoticComponent<SelectPrimitive.SelectValueProps & import("react").RefAttributes<HTMLSpanElement>>;
    Icon: import("react").ComponentType<SelectPrimitive.SelectIconProps & import("react").RefAttributes<HTMLSpanElement>>;
    Portal: import("react").FC<SelectPrimitive.SelectPortalProps>;
    Content: import("react").ComponentType<SelectPrimitive.SelectContentProps & import("react").RefAttributes<HTMLDivElement>>;
    Viewport: import("react").ForwardRefExoticComponent<SelectPrimitive.SelectViewportProps & import("react").RefAttributes<HTMLDivElement>>;
    Group: import("react").ForwardRefExoticComponent<SelectPrimitive.SelectGroupProps & import("react").RefAttributes<HTMLDivElement>>;
    Label: import("react").ForwardRefExoticComponent<SelectPrimitive.SelectLabelProps & import("react").RefAttributes<HTMLDivElement>>;
    Item: import("react").ComponentType<SelectPrimitive.SelectItemProps & import("react").RefAttributes<HTMLDivElement>>;
    ItemText: import("react").ComponentType<SelectPrimitive.SelectItemTextProps & import("react").RefAttributes<HTMLSpanElement>>;
    ItemIndicator: import("react").ForwardRefExoticComponent<SelectPrimitive.SelectItemIndicatorProps & import("react").RefAttributes<HTMLSpanElement>>;
    ScrollUpButton: import("react").ForwardRefExoticComponent<SelectPrimitive.SelectScrollUpButtonProps & import("react").RefAttributes<HTMLDivElement>>;
    ScrollDownButton: import("react").ForwardRefExoticComponent<SelectPrimitive.SelectScrollDownButtonProps & import("react").RefAttributes<HTMLDivElement>>;
    Separator: import("react").ComponentType<SelectPrimitive.SelectSeparatorProps & import("react").RefAttributes<HTMLDivElement>>;
    Arrow: import("react").ForwardRefExoticComponent<SelectPrimitive.SelectArrowProps & import("react").RefAttributes<SVGSVGElement>>;
    UpIcon: () => import("react/jsx-runtime").JSX.Element;
    DownIcon: () => import("react/jsx-runtime").JSX.Element;
    PlaceholderText: import("react").ComponentType<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>>;
};
/** Wayfinder Select
 *
 * @example
 * ```tsx
 * <Select value={value} onValueChange={setValue} placeholder="Some Placeholder">
 *   <SelectItem value="first">Option 1</SelectItem>
 *   <SelectItem value="second">Option 2</SelectItem>
 * </Select>
 * ```
 */
export declare const Select: import("react").ForwardRefExoticComponent<{
    children: ReactNode;
    placeholder?: ReactNode;
    contentOverlayStyle?: CSSProperties;
    /** Simulated onChange handler with only bare minimum event details to get form libraries to work properly */
    onChange?: (event: {
        target: {
            name?: string;
            value: string;
        };
    }) => void;
} & Pick<InferComponentProps<import("react").FC<SelectPrimitive.SelectProps>>, "name" | "open" | "disabled" | "defaultValue" | "dir" | "value" | "autoComplete" | "required" | "defaultOpen" | "onOpenChange" | "onValueChange"> & Omit<InferComponentProps<import("react").ComponentType<SelectPrimitive.SelectTriggerProps & import("react").RefAttributes<HTMLButtonElement>>>, "children" | "onChange" | "placeholder"> & import("react").RefAttributes<HTMLButtonElement>>;
export declare const SelectItem: import("react").ForwardRefExoticComponent<{
    children: ReactNode;
} & InferComponentProps<import("react").ComponentType<SelectPrimitive.SelectItemProps & import("react").RefAttributes<HTMLDivElement>>> & import("react").RefAttributes<HTMLDivElement>>;