@rc-component/select 1.1.4 → 1.2.0-alpha.0

package/es/Selector/SingleSelector.js

@@ -1,104 +0,0 @@
-import * as React from 'react';
-import pickAttrs from "@rc-component/util/es/pickAttrs";
-import Input from "./Input";
-import { getTitle } from "../utils/commonUtil";
-const SingleSelector = props => {
-  const {
-    inputElement,
-    prefixCls,
-    id,
-    inputRef,
-    disabled,
-    autoFocus,
-    autoComplete,
-    activeDescendantId,
-    mode,
-    open,
-    values,
-    placeholder,
-    tabIndex,
-    showSearch,
-    searchValue,
-    activeValue,
-    maxLength,
-    onInputKeyDown,
-    onInputMouseDown,
-    onInputChange,
-    onInputPaste,
-    onInputCompositionStart,
-    onInputCompositionEnd,
-    onInputBlur,
-    title
-  } = props;
-  const [inputChanged, setInputChanged] = React.useState(false);
-  const combobox = mode === 'combobox';
-  const inputEditable = combobox || showSearch;
-  const item = values[0];
-  let inputValue = searchValue || '';
-  if (combobox && activeValue && !inputChanged) {
-    inputValue = activeValue;
-  }
-  React.useEffect(() => {
-    if (combobox) {
-      setInputChanged(false);
-    }
-  }, [combobox, activeValue]);
-
-  // Not show text when closed expect combobox mode
-  const hasTextInput = mode !== 'combobox' && !open && !showSearch ? false : !!inputValue;
-
-  // Get title of selection item
-  const selectionTitle = title === undefined ? getTitle(item) : title;
-  const placeholderNode = React.useMemo(() => {
-    if (item) {
-      return null;
-    }
-    return /*#__PURE__*/React.createElement("span", {
-      className: `${prefixCls}-selection-placeholder`,
-      style: hasTextInput ? {
-        visibility: 'hidden'
-      } : undefined
-    }, placeholder);
-  }, [item, hasTextInput, placeholder, prefixCls]);
-  return /*#__PURE__*/React.createElement("span", {
-    className: `${prefixCls}-selection-wrap`
-  }, /*#__PURE__*/React.createElement("span", {
-    className: `${prefixCls}-selection-search`
-  }, /*#__PURE__*/React.createElement(Input, {
-    ref: inputRef,
-    prefixCls: prefixCls,
-    id: id,
-    open: open,
-    inputElement: inputElement,
-    disabled: disabled,
-    autoFocus: autoFocus,
-    autoComplete: autoComplete,
-    editable: inputEditable,
-    activeDescendantId: activeDescendantId,
-    value: inputValue,
-    onKeyDown: onInputKeyDown,
-    onMouseDown: onInputMouseDown,
-    onChange: e => {
-      setInputChanged(true);
-      onInputChange(e);
-    },
-    onPaste: onInputPaste,
-    onCompositionStart: onInputCompositionStart,
-    onCompositionEnd: onInputCompositionEnd,
-    onBlur: onInputBlur,
-    tabIndex: tabIndex,
-    attrs: pickAttrs(props, true),
-    maxLength: combobox ? maxLength : undefined
-  })), !combobox && item ? /*#__PURE__*/React.createElement("span", {
-    className: `${prefixCls}-selection-item`,
-    title: selectionTitle
-    // 当 Select 已经选中选项时，还需 selection 隐藏但留在原地占位
-    // https://github.com/ant-design/ant-design/issues/27688
-    // https://github.com/ant-design/ant-design/issues/41530
-    ,
-    style: hasTextInput ? {
-      visibility: 'hidden'
-    } : undefined
-  }, item.label) : null, placeholderNode);
-};
-export default SingleSelector;

package/es/Selector/index.d.ts

@@ -1,83 +0,0 @@
-/**
- * Cursor rule:
- * 1. Only `showSearch` enabled
- * 2. Only `open` is `true`
- * 3. When typing, set `open` to `true` which hit rule of 2
- *
- * Accessibility:
- * - https://www.w3.org/TR/wai-aria-practices/examples/combobox/aria1.1pattern/listbox-combo.html
- */
-import type { ScrollTo } from 'rc-virtual-list/lib/List';
-import * as React from 'react';
-import type { CustomTagProps, DisplayValueType, Mode, RenderNode } from '../BaseSelect';
-export interface InnerSelectorProps {
-    prefixCls: string;
-    id: string;
-    mode: Mode;
-    title?: string;
-    inputRef: React.Ref<HTMLInputElement | HTMLTextAreaElement>;
-    placeholder?: React.ReactNode;
-    disabled?: boolean;
-    autoFocus?: boolean;
-    autoComplete?: string;
-    values: DisplayValueType[];
-    showSearch?: boolean;
-    searchValue: string;
-    autoClearSearchValue?: boolean;
-    activeDescendantId?: string;
-    open: boolean;
-    tabIndex?: number;
-    maxLength?: number;
-    onInputKeyDown: React.KeyboardEventHandler<HTMLInputElement | HTMLTextAreaElement>;
-    onInputMouseDown: React.MouseEventHandler<HTMLInputElement | HTMLTextAreaElement>;
-    onInputChange: React.ChangeEventHandler<HTMLInputElement | HTMLTextAreaElement>;
-    onInputPaste: React.ClipboardEventHandler<HTMLInputElement | HTMLTextAreaElement>;
-    onInputCompositionStart: React.CompositionEventHandler<HTMLInputElement | HTMLTextAreaElement>;
-    onInputCompositionEnd: React.CompositionEventHandler<HTMLInputElement | HTMLTextAreaElement>;
-    onInputBlur: React.FocusEventHandler<HTMLInputElement | HTMLTextAreaElement>;
-}
-export interface RefSelectorProps {
-    focus: (options?: FocusOptions) => void;
-    blur: () => void;
-    scrollTo?: ScrollTo;
-    nativeElement: HTMLDivElement;
-}
-export interface SelectorProps {
-    prefixClassName: string;
-    prefixStyle: React.CSSProperties;
-    id: string;
-    prefixCls: string;
-    showSearch?: boolean;
-    open: boolean;
-    /** Display in the Selector value, it's not same as `value` prop */
-    values: DisplayValueType[];
-    mode: Mode;
-    searchValue: string;
-    activeValue: string;
-    autoClearSearchValue: boolean;
-    inputElement: JSX.Element;
-    maxLength?: number;
-    autoFocus?: boolean;
-    activeDescendantId?: string;
-    tabIndex?: number;
-    disabled?: boolean;
-    placeholder?: React.ReactNode;
-    removeIcon?: RenderNode;
-    prefix?: React.ReactNode;
-    maxTagCount?: number | 'responsive';
-    maxTagTextLength?: number;
-    maxTagPlaceholder?: React.ReactNode | ((omittedValues: DisplayValueType[]) => React.ReactNode);
-    tagRender?: (props: CustomTagProps) => React.ReactElement;
-    /** Check if `tokenSeparators` contains `\n` or `\r\n` */
-    tokenWithEnter?: boolean;
-    choiceTransitionName?: string;
-    onToggleOpen: (open?: boolean) => void;
-    /** `onSearch` returns go next step boolean to check if need do toggle open */
-    onSearch: (searchText: string, fromTyping: boolean, isCompositing: boolean) => boolean;
-    onSearchSubmit?: (searchText: string) => void;
-    onRemove: (value: DisplayValueType) => void;
-    onInputKeyDown?: React.KeyboardEventHandler<HTMLInputElement | HTMLTextAreaElement>;
-    onInputBlur?: () => void;
-}
-declare const ForwardSelector: React.ForwardRefExoticComponent<SelectorProps & React.RefAttributes<RefSelectorProps>>;
-export default ForwardSelector;

package/es/Selector/index.js

@@ -1,189 +0,0 @@
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-/**
- * Cursor rule:
- * 1. Only `showSearch` enabled
- * 2. Only `open` is `true`
- * 3. When typing, set `open` to `true` which hit rule of 2
- *
- * Accessibility:
- * - https://www.w3.org/TR/wai-aria-practices/examples/combobox/aria1.1pattern/listbox-combo.html
- */
-
-import KeyCode from "@rc-component/util/es/KeyCode";
-import * as React from 'react';
-import { useRef } from 'react';
-import useLock from "../hooks/useLock";
-import { isValidateOpenKey } from "../utils/keyUtil";
-import MultipleSelector from "./MultipleSelector";
-import SingleSelector from "./SingleSelector";
-import classNames from 'classnames';
-const Selector = (props, ref) => {
-  const inputRef = useRef(null);
-  const compositionStatusRef = useRef(false);
-  const {
-    prefixClassName,
-    prefixStyle,
-    prefixCls,
-    open,
-    mode,
-    showSearch,
-    tokenWithEnter,
-    disabled,
-    prefix,
-    autoClearSearchValue,
-    onSearch,
-    onSearchSubmit,
-    onToggleOpen,
-    onInputKeyDown,
-    onInputBlur
-  } = props;
-
-  // ======================= Ref =======================
-  const containerRef = React.useRef(null);
-  React.useImperativeHandle(ref, () => ({
-    focus: options => {
-      inputRef.current.focus(options);
-    },
-    blur: () => {
-      inputRef.current.blur();
-    },
-    nativeElement: containerRef.current
-  }));
-
-  // ====================== Input ======================
-  const [getInputMouseDown, setInputMouseDown] = useLock(0);
-  const onInternalInputKeyDown = event => {
-    const {
-      which
-    } = event;
-
-    // Compatible with multiple lines in TextArea
-    const isTextAreaElement = inputRef.current instanceof HTMLTextAreaElement;
-    if (!isTextAreaElement && open && (which === KeyCode.UP || which === KeyCode.DOWN)) {
-      event.preventDefault();
-    }
-    if (onInputKeyDown) {
-      onInputKeyDown(event);
-    }
-    if (which === KeyCode.ENTER && mode === 'tags' && !compositionStatusRef.current && !open) {
-      // When menu isn't open, OptionList won't trigger a value change
-      // So when enter is pressed, the tag's input value should be emitted here to let selector know
-      onSearchSubmit?.(event.target.value);
-    }
-    // Move within the text box
-    if (isTextAreaElement && !open && ~[KeyCode.UP, KeyCode.DOWN, KeyCode.LEFT, KeyCode.RIGHT].indexOf(which)) {
-      return;
-    }
-    if (isValidateOpenKey(which)) {
-      onToggleOpen(true);
-    }
-  };
-
-  /**
-   * We can not use `findDOMNode` sine it will get warning,
-   * have to use timer to check if is input element.
-   */
-  const onInternalInputMouseDown = () => {
-    setInputMouseDown(true);
-  };
-
-  // When paste come, ignore next onChange
-  const pastedTextRef = useRef(null);
-  const triggerOnSearch = value => {
-    if (onSearch(value, true, compositionStatusRef.current) !== false) {
-      onToggleOpen(true);
-    }
-  };
-  const onInputCompositionStart = () => {
-    compositionStatusRef.current = true;
-  };
-  const onInputCompositionEnd = e => {
-    compositionStatusRef.current = false;
-
-    // Trigger search again to support `tokenSeparators` with typewriting
-    if (mode !== 'combobox') {
-      triggerOnSearch(e.target.value);
-    }
-  };
-  const onInputChange = event => {
-    let {
-      target: {
-        value
-      }
-    } = event;
-
-    // Pasted text should replace back to origin content
-    if (tokenWithEnter && pastedTextRef.current && /[\r\n]/.test(pastedTextRef.current)) {
-      // CRLF will be treated as a single space for input element
-      const replacedText = pastedTextRef.current.replace(/[\r\n]+$/, '').replace(/\r\n/g, ' ').replace(/[\r\n]/g, ' ');
-      value = value.replace(replacedText, pastedTextRef.current);
-    }
-    pastedTextRef.current = null;
-    triggerOnSearch(value);
-  };
-  const onInputPaste = e => {
-    const {
-      clipboardData
-    } = e;
-    const value = clipboardData?.getData('text');
-    pastedTextRef.current = value || '';
-  };
-  const onClick = ({
-    target
-  }) => {
-    if (target !== inputRef.current) {
-      // Should focus input if click the selector
-      const isIE = document.body.style.msTouchAction !== undefined;
-      if (isIE) {
-        setTimeout(() => {
-          inputRef.current.focus();
-        });
-      } else {
-        inputRef.current.focus();
-      }
-    }
-  };
-  const onMouseDown = event => {
-    const inputMouseDown = getInputMouseDown();
-
-    // when mode is combobox and it is disabled, don't prevent default behavior
-    // https://github.com/ant-design/ant-design/issues/37320
-    // https://github.com/ant-design/ant-design/issues/48281
-    if (event.target !== inputRef.current && !inputMouseDown && !(mode === 'combobox' && disabled)) {
-      event.preventDefault();
-    }
-    if (mode !== 'combobox' && (!showSearch || !inputMouseDown) || !open) {
-      if (open && autoClearSearchValue !== false) {
-        onSearch('', true, false);
-      }
-      onToggleOpen();
-    }
-  };
-
-  // ================= Inner Selector ==================
-  const sharedProps = {
-    inputRef,
-    onInputKeyDown: onInternalInputKeyDown,
-    onInputMouseDown: onInternalInputMouseDown,
-    onInputChange,
-    onInputPaste,
-    onInputCompositionStart,
-    onInputCompositionEnd,
-    onInputBlur
-  };
-  const selectNode = mode === 'multiple' || mode === 'tags' ? /*#__PURE__*/React.createElement(MultipleSelector, _extends({}, props, sharedProps)) : /*#__PURE__*/React.createElement(SingleSelector, _extends({}, props, sharedProps));
-  return /*#__PURE__*/React.createElement("div", {
-    ref: containerRef,
-    className: `${prefixCls}-selector`,
-    onClick: onClick,
-    onMouseDown: onMouseDown
-  }, prefix && /*#__PURE__*/React.createElement("div", {
-    className: classNames(`${prefixCls}-prefix`, prefixClassName),
-    style: prefixStyle
-  }, prefix), selectNode);
-};
-const ForwardSelector = /*#__PURE__*/React.forwardRef(Selector);
-if (process.env.NODE_ENV !== 'production') {
-  ForwardSelector.displayName = 'Selector';
-}
-export default ForwardSelector;

package/es/hooks/useDelayReset.d.ts

@@ -1,5 +0,0 @@
-/**
- * Similar with `useLock`, but this hook will always execute last value.
- * When set to `true`, it will keep `true` for a short time even if `false` is set.
- */
-export default function useDelayReset(timeout?: number): [boolean, (val: boolean, callback?: () => void) => void, () => void];

package/es/hooks/useDelayReset.js

@@ -1,33 +0,0 @@
-import * as React from 'react';
-
-/**
- * Similar with `useLock`, but this hook will always execute last value.
- * When set to `true`, it will keep `true` for a short time even if `false` is set.
- */
-export default function useDelayReset(timeout = 10) {
-  const [bool, setBool] = React.useState(false);
-  const delayRef = React.useRef(null);
-  const cancelLatest = () => {
-    window.clearTimeout(delayRef.current);
-  };
-  React.useEffect(() => {
-    return () => {
-      cancelLatest();
-    };
-  }, []);
-  const delaySetBool = (value, callback) => {
-    cancelLatest();
-    if (value === true) {
-      // true 值立即设置
-      setBool(true);
-      callback?.();
-    } else {
-      // false 值延迟设置
-      delayRef.current = window.setTimeout(() => {
-        setBool(false);
-        callback?.();
-      }, timeout);
-    }
-  };
-  return [bool, delaySetBool, cancelLatest];
-}

package/es/hooks/useLayoutEffect.d.ts

@@ -1,5 +0,0 @@
-import * as React from 'react';
-/**
- * Wrap `React.useLayoutEffect` which will not throw warning message in test env
- */
-export default function useLayoutEffect(effect: React.EffectCallback, deps?: React.DependencyList): void;

package/es/hooks/useLayoutEffect.js

@@ -1,17 +0,0 @@
-/* eslint-disable react-hooks/rules-of-hooks */
-import * as React from 'react';
-import { isBrowserClient } from "../utils/commonUtil";
-
-/**
- * Wrap `React.useLayoutEffect` which will not throw warning message in test env
- */
-export default function useLayoutEffect(effect, deps) {
-  // Never happen in test env
-  if (isBrowserClient) {
-    /* istanbul ignore next */
-    React.useLayoutEffect(effect, deps);
-  } else {
-    React.useEffect(effect, deps);
-  }
-}
-/* eslint-enable */

package/lib/Selector/Input.d.ts

@@ -1,27 +0,0 @@
-import * as React from 'react';
-type InputRef = HTMLInputElement | HTMLTextAreaElement;
-interface InputProps {
-    prefixCls: string;
-    id: string;
-    inputElement: React.ReactElement;
-    disabled: boolean;
-    autoFocus: boolean;
-    autoComplete: string;
-    editable: boolean;
-    activeDescendantId?: string;
-    value: string;
-    maxLength?: number;
-    open: boolean;
-    tabIndex: number;
-    /** Pass accessibility props to input */
-    attrs: Record<string, unknown>;
-    onKeyDown: React.KeyboardEventHandler<HTMLInputElement | HTMLTextAreaElement | HTMLElement>;
-    onMouseDown: React.MouseEventHandler<HTMLInputElement | HTMLTextAreaElement | HTMLElement>;
-    onChange: React.ChangeEventHandler<HTMLInputElement | HTMLTextAreaElement | HTMLElement>;
-    onPaste: React.ClipboardEventHandler<HTMLInputElement | HTMLTextAreaElement | HTMLElement>;
-    onBlur: React.FocusEventHandler<HTMLInputElement | HTMLTextAreaElement | HTMLElement>;
-    onCompositionStart: React.CompositionEventHandler<HTMLInputElement | HTMLTextAreaElement | HTMLElement>;
-    onCompositionEnd: React.CompositionEventHandler<HTMLInputElement | HTMLTextAreaElement | HTMLElement>;
-}
-declare const RefInput: React.ForwardRefExoticComponent<InputProps & React.RefAttributes<InputRef>>;
-export default RefInput;

package/lib/Selector/Input.js

@@ -1,70 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var React = _interopRequireWildcard(require("react"));
-var _classnames = _interopRequireDefault(require("classnames"));
-var _ref = require("@rc-component/util/lib/ref");
-var _warning = require("@rc-component/util/lib/warning");
-var _composeProps = _interopRequireDefault(require("@rc-component/util/lib/composeProps"));
-var _useBaseProps = _interopRequireDefault(require("../hooks/useBaseProps"));
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-const Input = (props, ref) => {
-  const {
-    prefixCls,
-    id,
-    inputElement,
-    autoComplete,
-    editable,
-    activeDescendantId,
-    value,
-    open,
-    attrs,
-    ...restProps
-  } = props;
-  const {
-    classNames: contextClassNames,
-    styles: contextStyles
-  } = (0, _useBaseProps.default)() || {};
-  let inputNode = inputElement || /*#__PURE__*/React.createElement("input", null);
-  const {
-    ref: originRef,
-    props: originProps
-  } = inputNode;
-  (0, _warning.warning)(!('maxLength' in inputNode.props), `Passing 'maxLength' to input element directly may not work because input in BaseSelect is controlled.`);
-  inputNode = /*#__PURE__*/React.cloneElement(inputNode, {
-    type: 'search',
-    ...(0, _composeProps.default)(restProps, originProps, true),
-    // Override over origin props
-    id,
-    ref: (0, _ref.composeRef)(ref, originRef),
-    autoComplete: autoComplete || 'off',
-    className: (0, _classnames.default)(`${prefixCls}-selection-search-input`, originProps.className, contextClassNames?.input),
-    role: 'combobox',
-    'aria-expanded': open || false,
-    'aria-haspopup': 'listbox',
-    'aria-owns': `${id}_list`,
-    'aria-autocomplete': 'list',
-    'aria-controls': `${id}_list`,
-    'aria-activedescendant': open ? activeDescendantId : undefined,
-    ...attrs,
-    value: editable ? value : '',
-    readOnly: !editable,
-    unselectable: !editable ? 'on' : null,
-    style: {
-      ...originProps.style,
-      opacity: editable ? null : 0,
-      ...contextStyles?.input
-    }
-  });
-  return inputNode;
-};
-const RefInput = /*#__PURE__*/React.forwardRef(Input);
-if (process.env.NODE_ENV !== 'production') {
-  RefInput.displayName = 'Input';
-}
-var _default = exports.default = RefInput;

package/lib/Selector/MultipleSelector.d.ts

@@ -1,16 +0,0 @@
-import * as React from 'react';
-import type { InnerSelectorProps } from '.';
-import type { DisplayValueType, RenderNode, CustomTagProps } from '../BaseSelect';
-interface SelectorProps extends InnerSelectorProps {
-    removeIcon?: RenderNode;
-    maxTagCount?: number | 'responsive';
-    maxTagTextLength?: number;
-    maxTagPlaceholder?: React.ReactNode | ((omittedValues: DisplayValueType[]) => React.ReactNode);
-    tokenSeparators?: string[];
-    tagRender?: (props: CustomTagProps) => React.ReactElement;
-    onToggleOpen: (open?: boolean) => void;
-    choiceTransitionName?: string;
-    onRemove: (value: DisplayValueType) => void;
-}
-declare const SelectSelector: React.FC<SelectorProps>;
-export default SelectSelector;

package/lib/Selector/SingleSelector.d.ts

@@ -1,8 +0,0 @@
-import * as React from 'react';
-import type { InnerSelectorProps } from '.';
-interface SelectorProps extends InnerSelectorProps {
-    inputElement: React.ReactElement;
-    activeValue: string;
-}
-declare const SingleSelector: React.FC<SelectorProps>;
-export default SingleSelector;

package/lib/Selector/SingleSelector.js

@@ -1,113 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var React = _interopRequireWildcard(require("react"));
-var _pickAttrs = _interopRequireDefault(require("@rc-component/util/lib/pickAttrs"));
-var _Input = _interopRequireDefault(require("./Input"));
-var _commonUtil = require("../utils/commonUtil");
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-const SingleSelector = props => {
-  const {
-    inputElement,
-    prefixCls,
-    id,
-    inputRef,
-    disabled,
-    autoFocus,
-    autoComplete,
-    activeDescendantId,
-    mode,
-    open,
-    values,
-    placeholder,
-    tabIndex,
-    showSearch,
-    searchValue,
-    activeValue,
-    maxLength,
-    onInputKeyDown,
-    onInputMouseDown,
-    onInputChange,
-    onInputPaste,
-    onInputCompositionStart,
-    onInputCompositionEnd,
-    onInputBlur,
-    title
-  } = props;
-  const [inputChanged, setInputChanged] = React.useState(false);
-  const combobox = mode === 'combobox';
-  const inputEditable = combobox || showSearch;
-  const item = values[0];
-  let inputValue = searchValue || '';
-  if (combobox && activeValue && !inputChanged) {
-    inputValue = activeValue;
-  }
-  React.useEffect(() => {
-    if (combobox) {
-      setInputChanged(false);
-    }
-  }, [combobox, activeValue]);
-
-  // Not show text when closed expect combobox mode
-  const hasTextInput = mode !== 'combobox' && !open && !showSearch ? false : !!inputValue;
-
-  // Get title of selection item
-  const selectionTitle = title === undefined ? (0, _commonUtil.getTitle)(item) : title;
-  const placeholderNode = React.useMemo(() => {
-    if (item) {
-      return null;
-    }
-    return /*#__PURE__*/React.createElement("span", {
-      className: `${prefixCls}-selection-placeholder`,
-      style: hasTextInput ? {
-        visibility: 'hidden'
-      } : undefined
-    }, placeholder);
-  }, [item, hasTextInput, placeholder, prefixCls]);
-  return /*#__PURE__*/React.createElement("span", {
-    className: `${prefixCls}-selection-wrap`
-  }, /*#__PURE__*/React.createElement("span", {
-    className: `${prefixCls}-selection-search`
-  }, /*#__PURE__*/React.createElement(_Input.default, {
-    ref: inputRef,
-    prefixCls: prefixCls,
-    id: id,
-    open: open,
-    inputElement: inputElement,
-    disabled: disabled,
-    autoFocus: autoFocus,
-    autoComplete: autoComplete,
-    editable: inputEditable,
-    activeDescendantId: activeDescendantId,
-    value: inputValue,
-    onKeyDown: onInputKeyDown,
-    onMouseDown: onInputMouseDown,
-    onChange: e => {
-      setInputChanged(true);
-      onInputChange(e);
-    },
-    onPaste: onInputPaste,
-    onCompositionStart: onInputCompositionStart,
-    onCompositionEnd: onInputCompositionEnd,
-    onBlur: onInputBlur,
-    tabIndex: tabIndex,
-    attrs: (0, _pickAttrs.default)(props, true),
-    maxLength: combobox ? maxLength : undefined
-  })), !combobox && item ? /*#__PURE__*/React.createElement("span", {
-    className: `${prefixCls}-selection-item`,
-    title: selectionTitle
-    // 当 Select 已经选中选项时，还需 selection 隐藏但留在原地占位
-    // https://github.com/ant-design/ant-design/issues/27688
-    // https://github.com/ant-design/ant-design/issues/41530
-    ,
-    style: hasTextInput ? {
-      visibility: 'hidden'
-    } : undefined
-  }, item.label) : null, placeholderNode);
-};
-var _default = exports.default = SingleSelector;