|
1 | 1 | /* eslint-disable @typescript-eslint/no-explicit-any */ |
2 | 2 | import classnames from "classnames"; |
3 | | -import React, { ComponentProps, FC, useRef } from "react"; |
4 | | -import { EbayTextbox, EbayTextboxPrefixIcon, EbayTextboxPostfixIcon } from "../ebay-textbox"; |
| 3 | +import React, { FC, useRef } from "react"; |
| 4 | +import { EbayTextbox, EbayTextboxPrefixIcon, EbayTextboxPostfixIcon, type EbayTextboxProps } from "../ebay-textbox"; |
5 | 5 | import { EbayIconSearch16 } from "../ebay-icon/icons/ebay-icon-search-16"; |
6 | 6 | import { EbayIconClear16 } from "../ebay-icon/icons/ebay-icon-clear-16"; |
7 | | -import { |
8 | | - EbayChangeEventHandler, |
9 | | - EbayFocusEventHandler, |
10 | | - EbayKeyboardEventHandler, |
11 | | -} from "../common/event-utils/types"; |
| 7 | +import { EbayChangeEventHandler } from "../common/event-utils/types"; |
12 | 8 | import type { Size as TextboxSize } from "../ebay-textbox/types"; |
13 | 9 |
|
14 | 10 | const validSizes = ["large", "small"] as const; |
15 | 11 | export type Size = (typeof validSizes)[number]; |
16 | 12 |
|
17 | 13 | export type FilterInputEventProps = { value: string }; |
18 | 14 |
|
19 | | -export type EbayFilterInputProps = Omit<ComponentProps<"input">, "size" | "defaultValue"> & { |
| 15 | +export type EbayFilterInputProps = Omit<EbayTextboxProps, "inputSize"> & { |
20 | 16 | size?: Size; |
21 | | - defaultValue?: string; |
22 | 17 | a11yClearButton?: string; |
23 | 18 | a11yControlsId?: string; |
24 | 19 | onClear?: EbayChangeEventHandler<HTMLInputElement, FilterInputEventProps>; |
25 | | - onKeyDown?: EbayKeyboardEventHandler<HTMLInputElement, FilterInputEventProps>; |
26 | | - onKeyPress?: EbayKeyboardEventHandler<HTMLInputElement, FilterInputEventProps>; |
27 | | - onKeyUp?: EbayKeyboardEventHandler<HTMLInputElement, FilterInputEventProps>; |
28 | | - onChange?: EbayChangeEventHandler<HTMLInputElement, FilterInputEventProps>; |
29 | | - onInputChange?: EbayChangeEventHandler<HTMLInputElement, FilterInputEventProps>; |
30 | | - onFocus?: EbayFocusEventHandler<HTMLInputElement, FilterInputEventProps>; |
31 | | - onBlur?: EbayFocusEventHandler<HTMLInputElement, FilterInputEventProps>; |
32 | 20 | }; |
33 | 21 |
|
34 | 22 | const EbayFilterInput: FC<EbayFilterInputProps> = ({ |
35 | 23 | size: inputSize, |
36 | 24 | a11yClearButton, |
37 | 25 | a11yControlsId, |
38 | 26 | onClear = () => {}, |
39 | | - onKeyDown = () => {}, |
40 | | - onKeyPress = () => {}, |
41 | | - onKeyUp = () => {}, |
42 | | - onChange = () => {}, |
43 | | - onInputChange = () => {}, |
44 | | - onFocus = () => {}, |
45 | | - onBlur = () => {}, |
46 | 27 | className, |
47 | 28 | placeholder = "Filter", |
48 | | - // Only pass through specific input props that are compatible |
49 | | - id, |
50 | | - name, |
51 | | - value, |
52 | | - defaultValue, |
53 | | - disabled, |
54 | | - required, |
55 | | - readOnly, |
56 | | - maxLength, |
57 | | - minLength, |
58 | | - autoComplete, |
59 | | - autoFocus, |
60 | | - tabIndex |
| 29 | + ...rest |
61 | 30 | }) => { |
62 | 31 | const inputRef = useRef<HTMLInputElement>(null); |
63 | 32 |
|
@@ -105,31 +74,13 @@ const EbayFilterInput: FC<EbayFilterInputProps> = ({ |
105 | 74 | return ( |
106 | 75 | <span className={containerClassName}> |
107 | 76 | <EbayTextbox |
| 77 | + {...rest} |
108 | 78 | forwardedRef={inputRef} |
109 | | - id={id} |
110 | | - name={name} |
111 | | - value={value} |
112 | | - defaultValue={defaultValue} |
113 | | - disabled={disabled} |
114 | | - required={required} |
115 | | - readOnly={readOnly} |
116 | | - maxLength={maxLength} |
117 | | - minLength={minLength} |
118 | | - autoComplete={autoComplete} |
119 | | - autoFocus={autoFocus} // eslint-disable-line jsx-a11y/no-autofocus |
120 | | - tabIndex={tabIndex} |
121 | 79 | fluid |
122 | 80 | type="search" |
123 | 81 | aria-controls={a11yControlsId} |
124 | 82 | placeholder={placeholder} |
125 | 83 | inputSize={textboxSize} |
126 | | - onKeyDown={onKeyDown} |
127 | | - onKeyPress={onKeyPress} |
128 | | - onKeyUp={onKeyUp} |
129 | | - onChange={onChange} |
130 | | - onInputChange={onInputChange} |
131 | | - onFocus={onFocus} |
132 | | - onBlur={onBlur} |
133 | 84 | > |
134 | 85 | <EbayTextboxPrefixIcon icon={<EbayIconSearch16 />} /> |
135 | 86 | {a11yClearButton && ( |
|
0 commit comments