Search.js 6.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162
  1. "use strict";
  2. "use client";
  3. var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
  4. var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
  5. Object.defineProperty(exports, "__esModule", {
  6. value: true
  7. });
  8. exports.default = void 0;
  9. var React = _interopRequireWildcard(require("react"));
  10. var _SearchOutlined = _interopRequireDefault(require("@ant-design/icons/SearchOutlined"));
  11. var _classnames = _interopRequireDefault(require("classnames"));
  12. var _ref = require("rc-util/lib/ref");
  13. var _reactNode = require("../_util/reactNode");
  14. var _button = _interopRequireDefault(require("../button"));
  15. var _configProvider = require("../config-provider");
  16. var _useSize = _interopRequireDefault(require("../config-provider/hooks/useSize"));
  17. var _Compact = require("../space/Compact");
  18. var _Input = _interopRequireDefault(require("./Input"));
  19. var __rest = void 0 && (void 0).__rest || function (s, e) {
  20. var t = {};
  21. for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
  22. if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
  23. if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
  24. }
  25. return t;
  26. };
  27. const Search = /*#__PURE__*/React.forwardRef((props, ref) => {
  28. const {
  29. prefixCls: customizePrefixCls,
  30. inputPrefixCls: customizeInputPrefixCls,
  31. className,
  32. size: customizeSize,
  33. suffix,
  34. enterButton = false,
  35. addonAfter,
  36. loading,
  37. disabled,
  38. onSearch: customOnSearch,
  39. onChange: customOnChange,
  40. onCompositionStart,
  41. onCompositionEnd,
  42. variant,
  43. onPressEnter: customOnPressEnter
  44. } = props,
  45. restProps = __rest(props, ["prefixCls", "inputPrefixCls", "className", "size", "suffix", "enterButton", "addonAfter", "loading", "disabled", "onSearch", "onChange", "onCompositionStart", "onCompositionEnd", "variant", "onPressEnter"]);
  46. const {
  47. getPrefixCls,
  48. direction
  49. } = React.useContext(_configProvider.ConfigContext);
  50. const composedRef = React.useRef(false);
  51. const prefixCls = getPrefixCls('input-search', customizePrefixCls);
  52. const inputPrefixCls = getPrefixCls('input', customizeInputPrefixCls);
  53. const {
  54. compactSize
  55. } = (0, _Compact.useCompactItemContext)(prefixCls, direction);
  56. const size = (0, _useSize.default)(ctx => {
  57. var _a;
  58. return (_a = customizeSize !== null && customizeSize !== void 0 ? customizeSize : compactSize) !== null && _a !== void 0 ? _a : ctx;
  59. });
  60. const inputRef = React.useRef(null);
  61. const onChange = e => {
  62. if ((e === null || e === void 0 ? void 0 : e.target) && e.type === 'click' && customOnSearch) {
  63. customOnSearch(e.target.value, e, {
  64. source: 'clear'
  65. });
  66. }
  67. customOnChange === null || customOnChange === void 0 ? void 0 : customOnChange(e);
  68. };
  69. const onMouseDown = e => {
  70. var _a;
  71. if (document.activeElement === ((_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.input)) {
  72. e.preventDefault();
  73. }
  74. };
  75. const onSearch = e => {
  76. var _a, _b;
  77. if (customOnSearch) {
  78. customOnSearch((_b = (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.input) === null || _b === void 0 ? void 0 : _b.value, e, {
  79. source: 'input'
  80. });
  81. }
  82. };
  83. const onPressEnter = e => {
  84. if (composedRef.current || loading) {
  85. return;
  86. }
  87. customOnPressEnter === null || customOnPressEnter === void 0 ? void 0 : customOnPressEnter(e);
  88. onSearch(e);
  89. };
  90. const searchIcon = typeof enterButton === 'boolean' ? /*#__PURE__*/React.createElement(_SearchOutlined.default, null) : null;
  91. const btnClassName = `${prefixCls}-button`;
  92. let button;
  93. const enterButtonAsElement = enterButton || {};
  94. const isAntdButton = enterButtonAsElement.type && enterButtonAsElement.type.__ANT_BUTTON === true;
  95. if (isAntdButton || enterButtonAsElement.type === 'button') {
  96. button = (0, _reactNode.cloneElement)(enterButtonAsElement, Object.assign({
  97. onMouseDown,
  98. onClick: e => {
  99. var _a, _b;
  100. (_b = (_a = enterButtonAsElement === null || enterButtonAsElement === void 0 ? void 0 : enterButtonAsElement.props) === null || _a === void 0 ? void 0 : _a.onClick) === null || _b === void 0 ? void 0 : _b.call(_a, e);
  101. onSearch(e);
  102. },
  103. key: 'enterButton'
  104. }, isAntdButton ? {
  105. className: btnClassName,
  106. size
  107. } : {}));
  108. } else {
  109. button = /*#__PURE__*/React.createElement(_button.default, {
  110. className: btnClassName,
  111. color: enterButton ? 'primary' : 'default',
  112. size: size,
  113. disabled: disabled,
  114. key: "enterButton",
  115. onMouseDown: onMouseDown,
  116. onClick: onSearch,
  117. loading: loading,
  118. icon: searchIcon,
  119. variant: variant === 'borderless' || variant === 'filled' || variant === 'underlined' ? 'text' : enterButton ? 'solid' : undefined
  120. }, enterButton);
  121. }
  122. if (addonAfter) {
  123. button = [button, (0, _reactNode.cloneElement)(addonAfter, {
  124. key: 'addonAfter'
  125. })];
  126. }
  127. const cls = (0, _classnames.default)(prefixCls, {
  128. [`${prefixCls}-rtl`]: direction === 'rtl',
  129. [`${prefixCls}-${size}`]: !!size,
  130. [`${prefixCls}-with-button`]: !!enterButton
  131. }, className);
  132. const handleOnCompositionStart = e => {
  133. composedRef.current = true;
  134. onCompositionStart === null || onCompositionStart === void 0 ? void 0 : onCompositionStart(e);
  135. };
  136. const handleOnCompositionEnd = e => {
  137. composedRef.current = false;
  138. onCompositionEnd === null || onCompositionEnd === void 0 ? void 0 : onCompositionEnd(e);
  139. };
  140. const inputProps = Object.assign(Object.assign({}, restProps), {
  141. className: cls,
  142. prefixCls: inputPrefixCls,
  143. type: 'search',
  144. size,
  145. variant,
  146. onPressEnter,
  147. onCompositionStart: handleOnCompositionStart,
  148. onCompositionEnd: handleOnCompositionEnd,
  149. addonAfter: button,
  150. suffix,
  151. onChange,
  152. disabled
  153. });
  154. return /*#__PURE__*/React.createElement(_Input.default, Object.assign({
  155. ref: (0, _ref.composeRef)(inputRef, ref)
  156. }, inputProps));
  157. });
  158. if (process.env.NODE_ENV !== 'production') {
  159. Search.displayName = 'Search';
  160. }
  161. var _default = exports.default = Search;