1 | import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
2 | import _extends from "@babel/runtime/helpers/esm/extends";
|
3 |
|
4 | var __rest = this && this.__rest || function (s, e) {
|
5 | var t = {};
|
6 |
|
7 | for (var p in s) {
|
8 | if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
|
9 | }
|
10 |
|
11 | if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
12 | if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
|
13 | }
|
14 | return t;
|
15 | };
|
16 |
|
17 | import * as React from 'react';
|
18 | import classNames from 'classnames';
|
19 | import { composeRef } from "rc-util/es/ref";
|
20 | import SearchOutlined from "@ant-design/icons/es/icons/SearchOutlined";
|
21 | import Input from './Input';
|
22 | import Button from '../button';
|
23 | import SizeContext from '../config-provider/SizeContext';
|
24 | import { ConfigContext } from '../config-provider';
|
25 | import { cloneElement } from '../_util/reactNode';
|
26 | var Search = React.forwardRef(function (props, ref) {
|
27 | var _classNames;
|
28 |
|
29 | var customizePrefixCls = props.prefixCls,
|
30 | customizeInputPrefixCls = props.inputPrefixCls,
|
31 | className = props.className,
|
32 | customizeSize = props.size,
|
33 | suffix = props.suffix,
|
34 | _props$enterButton = props.enterButton,
|
35 | enterButton = _props$enterButton === void 0 ? false : _props$enterButton,
|
36 | addonAfter = props.addonAfter,
|
37 | loading = props.loading,
|
38 | disabled = props.disabled,
|
39 | customOnSearch = props.onSearch,
|
40 | customOnChange = props.onChange,
|
41 | restProps = __rest(props, ["prefixCls", "inputPrefixCls", "className", "size", "suffix", "enterButton", "addonAfter", "loading", "disabled", "onSearch", "onChange"]);
|
42 |
|
43 | var _React$useContext = React.useContext(ConfigContext),
|
44 | getPrefixCls = _React$useContext.getPrefixCls,
|
45 | direction = _React$useContext.direction;
|
46 |
|
47 | var contextSize = React.useContext(SizeContext);
|
48 | var size = customizeSize || contextSize;
|
49 | var inputRef = React.useRef(null);
|
50 |
|
51 | var onChange = function onChange(e) {
|
52 | if (e && e.target && e.type === 'click' && customOnSearch) {
|
53 | customOnSearch(e.target.value, e);
|
54 | }
|
55 |
|
56 | if (customOnChange) {
|
57 | customOnChange(e);
|
58 | }
|
59 | };
|
60 |
|
61 | var onMouseDown = function onMouseDown(e) {
|
62 | var _a;
|
63 |
|
64 | if (document.activeElement === ((_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.input)) {
|
65 | e.preventDefault();
|
66 | }
|
67 | };
|
68 |
|
69 | var onSearch = function onSearch(e) {
|
70 | var _a;
|
71 |
|
72 | if (customOnSearch) {
|
73 | customOnSearch((_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.input.value, e);
|
74 | }
|
75 | };
|
76 |
|
77 | var prefixCls = getPrefixCls('input-search', customizePrefixCls);
|
78 | var inputPrefixCls = getPrefixCls('input', customizeInputPrefixCls);
|
79 | var searchIcon = typeof enterButton === 'boolean' ? React.createElement(SearchOutlined, null) : null;
|
80 | var btnClassName = "".concat(prefixCls, "-button");
|
81 | var button;
|
82 | var enterButtonAsElement = enterButton || {};
|
83 | var isAntdButton = enterButtonAsElement.type && enterButtonAsElement.type.__ANT_BUTTON === true;
|
84 |
|
85 | if (isAntdButton || enterButtonAsElement.type === 'button') {
|
86 | button = cloneElement(enterButtonAsElement, _extends({
|
87 | onMouseDown: onMouseDown,
|
88 | onClick: onSearch,
|
89 | key: 'enterButton'
|
90 | }, isAntdButton ? {
|
91 | className: btnClassName,
|
92 | size: size
|
93 | } : {}));
|
94 | } else {
|
95 | button = React.createElement(Button, {
|
96 | className: btnClassName,
|
97 | type: enterButton ? 'primary' : undefined,
|
98 | size: size,
|
99 | disabled: disabled,
|
100 | key: "enterButton",
|
101 | onMouseDown: onMouseDown,
|
102 | onClick: onSearch,
|
103 | loading: loading,
|
104 | icon: searchIcon
|
105 | }, enterButton);
|
106 | }
|
107 |
|
108 | if (addonAfter) {
|
109 | button = [button, cloneElement(addonAfter, {
|
110 | key: 'addonAfter'
|
111 | })];
|
112 | }
|
113 |
|
114 | var cls = classNames(prefixCls, (_classNames = {}, _defineProperty(_classNames, "".concat(prefixCls, "-rtl"), direction === 'rtl'), _defineProperty(_classNames, "".concat(prefixCls, "-").concat(size), !!size), _defineProperty(_classNames, "".concat(prefixCls, "-with-button"), !!enterButton), _classNames), className);
|
115 | return React.createElement(Input, _extends({
|
116 | ref: composeRef(inputRef, ref),
|
117 | onPressEnter: onSearch
|
118 | }, restProps, {
|
119 | size: size,
|
120 | prefixCls: inputPrefixCls,
|
121 | addonAfter: button,
|
122 | suffix: suffix,
|
123 | onChange: onChange,
|
124 | className: cls,
|
125 | disabled: disabled
|
126 | }));
|
127 | });
|
128 | Search.displayName = 'Search';
|
129 | export default Search; |
\ | No newline at end of file |