You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
85 lines
3.0 KiB
85 lines
3.0 KiB
import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
|
|
import React from 'react';
|
|
import pickAttrs from "rc-util/es/pickAttrs";
|
|
import Input from './Input';
|
|
|
|
var SingleSelector = function SingleSelector(props) {
|
|
var inputElement = props.inputElement,
|
|
prefixCls = props.prefixCls,
|
|
id = props.id,
|
|
inputRef = props.inputRef,
|
|
disabled = props.disabled,
|
|
autoFocus = props.autoFocus,
|
|
autoComplete = props.autoComplete,
|
|
accessibilityIndex = props.accessibilityIndex,
|
|
mode = props.mode,
|
|
open = props.open,
|
|
values = props.values,
|
|
placeholder = props.placeholder,
|
|
tabIndex = props.tabIndex,
|
|
showSearch = props.showSearch,
|
|
searchValue = props.searchValue,
|
|
activeValue = props.activeValue,
|
|
onInputKeyDown = props.onInputKeyDown,
|
|
onInputMouseDown = props.onInputMouseDown,
|
|
onInputChange = props.onInputChange,
|
|
onInputPaste = props.onInputPaste,
|
|
onInputCompositionStart = props.onInputCompositionStart,
|
|
onInputCompositionEnd = props.onInputCompositionEnd;
|
|
|
|
var _React$useState = React.useState(false),
|
|
_React$useState2 = _slicedToArray(_React$useState, 2),
|
|
inputChanged = _React$useState2[0],
|
|
setInputChanged = _React$useState2[1];
|
|
|
|
var combobox = mode === 'combobox';
|
|
var inputEditable = combobox || showSearch && open;
|
|
var item = values[0];
|
|
var inputValue = searchValue || '';
|
|
|
|
if (combobox && activeValue && !inputChanged) {
|
|
inputValue = activeValue;
|
|
}
|
|
|
|
React.useEffect(function () {
|
|
if (combobox) {
|
|
setInputChanged(false);
|
|
}
|
|
}, [combobox, activeValue]); // Not show text when closed expect combobox mode
|
|
|
|
var hasTextInput = mode !== 'combobox' && !open ? false : !!inputValue;
|
|
var title = item && (typeof item.label === 'string' || typeof item.label === 'number') ? item.label.toString() : undefined;
|
|
return React.createElement(React.Fragment, null, React.createElement("span", {
|
|
className: "".concat(prefixCls, "-selection-search")
|
|
}, React.createElement(Input, {
|
|
ref: inputRef,
|
|
prefixCls: prefixCls,
|
|
id: id,
|
|
open: open,
|
|
inputElement: inputElement,
|
|
disabled: disabled,
|
|
autoFocus: autoFocus,
|
|
autoComplete: autoComplete,
|
|
editable: inputEditable,
|
|
accessibilityIndex: accessibilityIndex,
|
|
value: inputValue,
|
|
onKeyDown: onInputKeyDown,
|
|
onMouseDown: onInputMouseDown,
|
|
onChange: function onChange(e) {
|
|
setInputChanged(true);
|
|
onInputChange(e);
|
|
},
|
|
onPaste: onInputPaste,
|
|
onCompositionStart: onInputCompositionStart,
|
|
onCompositionEnd: onInputCompositionEnd,
|
|
tabIndex: tabIndex,
|
|
attrs: pickAttrs(props, true)
|
|
})), !combobox && item && !hasTextInput && React.createElement("span", {
|
|
className: "".concat(prefixCls, "-selection-item"),
|
|
title: title
|
|
}, item.label), !item && !hasTextInput && React.createElement("span", {
|
|
className: "".concat(prefixCls, "-selection-placeholder")
|
|
}, placeholder));
|
|
};
|
|
|
|
export default SingleSelector; |