rc-select

  • Version 14.16.6
  • Published
  • 347 kB
  • 7 dependencies
  • MIT license

Install

npm i rc-select
yarn add rc-select
pnpm add rc-select

Overview

React Select

Index

Variables

variable BaseSelect

const BaseSelect: React.ForwardRefExoticComponent<any>;

    variable OptGroup

    const OptGroup: OptionGroupFC;
    • This is a placeholder, not real render in dom

    variable Option

    const Option: OptionFC;
    • This is a placeholder, not real render in dom

    variable TypedSelect

    const TypedSelect: (<
    ValueType = any,
    OptionType extends BaseOptionType | DefaultOptionType = DefaultOptionType
    >(
    props: any
    ) => React.ReactElement) & { Option: typeof Option; OptGroup: typeof OptGroup };

      Functions

      function useBaseProps

      useBaseProps: () => BaseSelectContextProps;

        Interfaces

        interface BaseSelectProps

        interface BaseSelectProps extends BaseSelectPrivateProps, React.AriaAttributes {}

          property allowClear

          allowClear?:
          | boolean
          | {
          clearIcon?: RenderNode;
          };

            property animation

            animation?: string;

              property autoFocus

              autoFocus?: boolean;

                property builtinPlacements

                builtinPlacements?: BuildInPlacements;

                  property choiceTransitionName

                  choiceTransitionName?: string;

                    property className

                    className?: string;

                      property clearIcon

                      clearIcon?: RenderNode;
                      • Clear all icon

                        Deprecated

                        Please use allowClear instead

                      property defaultOpen

                      defaultOpen?: boolean;

                        property direction

                        direction?: 'ltr' | 'rtl';

                          property disabled

                          disabled?: boolean;

                            property dropdownAlign

                            dropdownAlign?: AlignType;

                              property dropdownClassName

                              dropdownClassName?: string;

                                property dropdownMatchSelectWidth

                                dropdownMatchSelectWidth?: boolean | number;

                                  property dropdownRender

                                  dropdownRender?: (menu: React.ReactElement) => React.ReactElement;

                                    property dropdownStyle

                                    dropdownStyle?: React.CSSProperties;

                                      property getInputElement

                                      getInputElement?: () => JSX.Element;
                                      • Internal usage. Do not use in your production.

                                      property getPopupContainer

                                      getPopupContainer?: RenderDOMFunc;

                                        property getRawInputElement

                                        getRawInputElement?: () => JSX.Element;
                                        • Internal usage. Do not use in your production.

                                        property loading

                                        loading?: boolean;

                                          property maxLength

                                          maxLength?: number;

                                            property maxTagCount

                                            maxTagCount?: number | 'responsive';

                                              property maxTagPlaceholder

                                              maxTagPlaceholder?:
                                              | React.ReactNode
                                              | ((omittedValues: DisplayValueType[]) => React.ReactNode);

                                                property maxTagTextLength

                                                maxTagTextLength?: number;

                                                  property mode

                                                  mode?: Mode;

                                                    property notFoundContent

                                                    notFoundContent?: React.ReactNode;

                                                      property onBlur

                                                      onBlur?: React.FocusEventHandler<HTMLElement>;

                                                        property onClear

                                                        onClear?: () => void;

                                                          property onClick

                                                          onClick?: React.MouseEventHandler<HTMLDivElement>;

                                                            property onDropdownVisibleChange

                                                            onDropdownVisibleChange?: (open: boolean) => void;

                                                              property onFocus

                                                              onFocus?: React.FocusEventHandler<HTMLElement>;

                                                                property onInputKeyDown

                                                                onInputKeyDown?: React.KeyboardEventHandler<
                                                                HTMLInputElement | HTMLTextAreaElement
                                                                >;

                                                                  property onKeyDown

                                                                  onKeyDown?: React.KeyboardEventHandler<HTMLDivElement>;

                                                                    property onKeyUp

                                                                    onKeyUp?: React.KeyboardEventHandler<HTMLDivElement>;

                                                                      property onMouseDown

                                                                      onMouseDown?: React.MouseEventHandler<HTMLDivElement>;

                                                                        property onMouseEnter

                                                                        onMouseEnter?: React.MouseEventHandler<HTMLDivElement>;

                                                                          property onMouseLeave

                                                                          onMouseLeave?: React.MouseEventHandler<HTMLDivElement>;

                                                                            property onPopupScroll

                                                                            onPopupScroll?: React.UIEventHandler<HTMLDivElement>;

                                                                              property open

                                                                              open?: boolean;

                                                                                property placeholder

                                                                                placeholder?: React.ReactNode;

                                                                                  property placement

                                                                                  placement?: Placement;

                                                                                    property prefix

                                                                                    prefix?: React.ReactNode;

                                                                                      property removeIcon

                                                                                      removeIcon?: RenderNode;
                                                                                      • Selector remove icon

                                                                                      property showAction

                                                                                      showAction?: ('focus' | 'click')[];

                                                                                        property showSearch

                                                                                        showSearch?: boolean;

                                                                                          property style

                                                                                          style?: React.CSSProperties;

                                                                                            property suffixIcon

                                                                                            suffixIcon?: RenderNode;

                                                                                              property tabIndex

                                                                                              tabIndex?: number;

                                                                                                property tagRender

                                                                                                tagRender?: (props: CustomTagProps) => React.ReactElement;

                                                                                                  property title

                                                                                                  title?: string;

                                                                                                    property tokenSeparators

                                                                                                    tokenSeparators?: string[];

                                                                                                      property transitionName

                                                                                                      transitionName?: string;

                                                                                                        interface BaseSelectRef

                                                                                                        interface BaseSelectRef {}

                                                                                                          property blur

                                                                                                          blur: () => void;

                                                                                                            property focus

                                                                                                            focus: (options?: FocusOptions) => void;

                                                                                                              property nativeElement

                                                                                                              nativeElement: HTMLElement;

                                                                                                                property scrollTo

                                                                                                                scrollTo: ScrollTo;

                                                                                                                  interface SelectProps

                                                                                                                  interface SelectProps<
                                                                                                                  ValueType = any,
                                                                                                                  OptionType extends BaseOptionType = DefaultOptionType
                                                                                                                  > extends BaseSelectPropsWithoutPrivate {}

                                                                                                                    property autoClearSearchValue

                                                                                                                    autoClearSearchValue?: boolean;

                                                                                                                      property backfill

                                                                                                                      backfill?: boolean;

                                                                                                                        property children

                                                                                                                        children?: React.ReactNode;

                                                                                                                          property defaultActiveFirstOption

                                                                                                                          defaultActiveFirstOption?: boolean;

                                                                                                                            property defaultValue

                                                                                                                            defaultValue?: ValueType | null;

                                                                                                                              property direction

                                                                                                                              direction?: 'ltr' | 'rtl';

                                                                                                                                property fieldNames

                                                                                                                                fieldNames?: FieldNames;

                                                                                                                                  property filterOption

                                                                                                                                  filterOption?: boolean | FilterFunc<OptionType>;
                                                                                                                                  • In Select, false means do nothing. In TreeSelect, false will highlight match item. It's by design.

                                                                                                                                  property filterSort

                                                                                                                                  filterSort?: (
                                                                                                                                  optionA: OptionType,
                                                                                                                                  optionB: OptionType,
                                                                                                                                  info: {
                                                                                                                                  searchValue: string;
                                                                                                                                  }
                                                                                                                                  ) => number;

                                                                                                                                    property id

                                                                                                                                    id?: string;

                                                                                                                                      property inputValue

                                                                                                                                      inputValue?: string;
                                                                                                                                      • Deprecated

                                                                                                                                        Use searchValue instead

                                                                                                                                      property labelInValue

                                                                                                                                      labelInValue?: boolean;

                                                                                                                                        property labelRender

                                                                                                                                        labelRender?: (props: LabelInValueType) => React.ReactNode;

                                                                                                                                          property listHeight

                                                                                                                                          listHeight?: number;

                                                                                                                                            property listItemHeight

                                                                                                                                            listItemHeight?: number;

                                                                                                                                              property maxCount

                                                                                                                                              maxCount?: number;

                                                                                                                                                property menuItemSelectedIcon

                                                                                                                                                menuItemSelectedIcon?: RenderNode;

                                                                                                                                                  property mode

                                                                                                                                                  mode?: 'combobox' | 'multiple' | 'tags';

                                                                                                                                                    property onChange

                                                                                                                                                    onChange?: (value: ValueType, option?: OptionType | OptionType[]) => void;

                                                                                                                                                      property onDeselect

                                                                                                                                                      onDeselect?: SelectHandler<ArrayElementType<ValueType>, OptionType>;

                                                                                                                                                        property onSearch

                                                                                                                                                        onSearch?: (value: string) => void;

                                                                                                                                                          property onSelect

                                                                                                                                                          onSelect?: SelectHandler<ArrayElementType<ValueType>, OptionType>;

                                                                                                                                                            property optionFilterProp

                                                                                                                                                            optionFilterProp?: string;

                                                                                                                                                              property optionLabelProp

                                                                                                                                                              optionLabelProp?: string;

                                                                                                                                                                property optionRender

                                                                                                                                                                optionRender?: (
                                                                                                                                                                oriOption: FlattenOptionData<OptionType>,
                                                                                                                                                                info: {
                                                                                                                                                                index: number;
                                                                                                                                                                }
                                                                                                                                                                ) => React.ReactNode;

                                                                                                                                                                  property options

                                                                                                                                                                  options?: OptionType[];

                                                                                                                                                                    property prefixCls

                                                                                                                                                                    prefixCls?: string;

                                                                                                                                                                      property searchValue

                                                                                                                                                                      searchValue?: string;

                                                                                                                                                                        property value

                                                                                                                                                                        value?: ValueType | null;

                                                                                                                                                                          property virtual

                                                                                                                                                                          virtual?: boolean;

                                                                                                                                                                            Type Aliases

                                                                                                                                                                            type BaseSelectPropsWithoutPrivate

                                                                                                                                                                            type BaseSelectPropsWithoutPrivate = Omit<
                                                                                                                                                                            BaseSelectProps,
                                                                                                                                                                            keyof BaseSelectPrivateProps
                                                                                                                                                                            >;

                                                                                                                                                                              Package Files (6)

                                                                                                                                                                              Dependencies (7)

                                                                                                                                                                              Dev Dependencies (25)

                                                                                                                                                                              Peer Dependencies (2)

                                                                                                                                                                              Badge

                                                                                                                                                                              To add a badge like this onejsDocs.io badgeto your package's README, use the codes available below.

                                                                                                                                                                              You may also use Shields.io to create a custom badge linking to https://www.jsdocs.io/package/rc-select.

                                                                                                                                                                              • Markdown
                                                                                                                                                                                [![jsDocs.io](https://img.shields.io/badge/jsDocs.io-reference-blue)](https://www.jsdocs.io/package/rc-select)
                                                                                                                                                                              • HTML
                                                                                                                                                                                <a href="https://www.jsdocs.io/package/rc-select"><img src="https://img.shields.io/badge/jsDocs.io-reference-blue" alt="jsDocs.io"></a>