diff --git a/src/Selector/Input.tsx b/src/Selector/Input.tsx index c4353e056..3eb987341 100644 --- a/src/Selector/Input.tsx +++ b/src/Selector/Input.tsx @@ -2,6 +2,7 @@ import * as React from 'react'; import classNames from 'classnames'; import { composeRef } from 'rc-util/lib/ref'; import { warning } from 'rc-util/lib/warning'; +import composeProps from 'rc-util/lib/composeProps'; type InputRef = HTMLInputElement | HTMLTextAreaElement; @@ -39,39 +40,20 @@ const Input: React.ForwardRefRenderFunction = (props, ref) prefixCls, id, inputElement, - disabled, - tabIndex, autoFocus, autoComplete, editable, activeDescendantId, value, - maxLength, - onKeyDown, - onMouseDown, - onChange, - onPaste, - onCompositionStart, - onCompositionEnd, - onBlur, open, attrs, + ...restProps } = props; let inputNode: React.ComponentElement = inputElement || ; const { ref: originRef, props: originProps } = inputNode; - const { - onKeyDown: onOriginKeyDown, - onChange: onOriginChange, - onMouseDown: onOriginMouseDown, - onCompositionStart: onOriginCompositionStart, - onCompositionEnd: onOriginCompositionEnd, - onBlur: onOriginBlur, - style, - } = originProps; - warning( !('maxLength' in inputNode.props), `Passing 'maxLength' to input element directly may not work because input in BaseSelect is controlled.`, @@ -79,17 +61,15 @@ const Input: React.ForwardRefRenderFunction = (props, ref) inputNode = React.cloneElement(inputNode, { type: 'search', - ...originProps, + ...composeProps(restProps, originProps, true), // Override over origin props id, ref: composeRef(ref, originRef as any), - disabled, - tabIndex, autoComplete: autoComplete || 'off', autoFocus, - className: classNames(`${prefixCls}-selection-search-input`, inputNode?.props?.className), + className: classNames(`${prefixCls}-selection-search-input`, originProps?.className), role: 'combobox', 'aria-expanded': open || false, @@ -100,49 +80,10 @@ const Input: React.ForwardRefRenderFunction = (props, ref) 'aria-activedescendant': open ? activeDescendantId : undefined, ...attrs, value: editable ? value : '', - maxLength, readOnly: !editable, unselectable: !editable ? 'on' : null, - style: { ...style, opacity: editable ? null : 0 }, - - onKeyDown: (event: React.KeyboardEvent) => { - onKeyDown(event); - if (onOriginKeyDown) { - onOriginKeyDown(event); - } - }, - onMouseDown: (event: React.MouseEvent) => { - onMouseDown(event); - if (onOriginMouseDown) { - onOriginMouseDown(event); - } - }, - onChange: (event: React.ChangeEvent) => { - onChange(event); - if (onOriginChange) { - onOriginChange(event); - } - }, - onCompositionStart(event: React.CompositionEvent) { - onCompositionStart(event); - if (onOriginCompositionStart) { - onOriginCompositionStart(event); - } - }, - onCompositionEnd(event: React.CompositionEvent) { - onCompositionEnd(event); - if (onOriginCompositionEnd) { - onOriginCompositionEnd(event); - } - }, - onPaste, - onBlur(event: React.FocusEvent) { - onBlur(event); - if (onOriginBlur) { - onOriginBlur(event); - } - }, + style: { ...originProps.style, opacity: editable ? null : 0 }, }); return inputNode; diff --git a/tests/Select.test.tsx b/tests/Select.test.tsx index 573eda314..f73c5975b 100644 --- a/tests/Select.test.tsx +++ b/tests/Select.test.tsx @@ -923,6 +923,7 @@ describe('Select.Basic', () => { const onCompositionEnd = jest.fn(); const textareaRef = jest.fn(); const mouseDownPreventDefault = jest.fn(); + const onPaste = jest.fn(); const { container } = render(