Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Sign up
Appearance settings

Commit d4271b3

Browse files
adding inputName prop
1 parent 93797fd commit d4271b3

File tree

2 files changed

+18
-11
lines changed

2 files changed

+18
-11
lines changed

‎README.md

Lines changed: 15 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ Whether you want to showcase a constant list of options or dynamically adapt to
1414

1515
- Clear button
1616

17-
- `Rtl` support
17+
- Rtl support
1818

1919
- Flexible style
2020

@@ -75,6 +75,16 @@ function App() {
7575
- **onChange**
7676
- type : `Func`
7777
- description : onChange Handler for the input value
78+
- **onClear?**
79+
- type : `Func`
80+
- description : triggered when the user clicks on the Clear icon
81+
- **theme?**
82+
- type : `"outline"|"underline"|"panel"`
83+
- description : searchbox theme
84+
- default : `"outline"`
85+
- **autoFocus?**
86+
- type : `Boolean`
87+
- default : `Fasle`
7888
- **children**
7989
- type : `ReactNode`
8090
- description : suggestions list
@@ -116,16 +126,10 @@ function App() {
116126
- **MagnifierIconComponent?**
117127
- type : `React function component`
118128
- description : custom Magnifier icon
119-
- **onClear?**
120-
- type : `Func`
121-
- description : triggered when the user clicks on the Clear icon
122-
- **theme?**
123-
- type : `"outline"|"underline"|"panel"`
124-
- description : searchbox theme
125-
- default : `"outline"`
126-
- **autoFocus?**
127-
- type : `Boolean`
128-
- default : `Fasle`
129+
- **inputName?**
130+
- type : `String`
131+
- description : name attribute for the input element
132+
- default : `""`
129133

130134
## Test
131135

‎src/index.js

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,7 @@ import ClearIcon from './icons/clear.js';
2424
* @param {"underline"|"outline"|"panel"} [props.theme="outline"] - searchbox theme
2525
* @param {Boolean} [props.corner=true] - if set true then border-radius would be "5px"
2626
* @param {Boolean} [props.autoFocus=false] - autoFocus attribute for the input element
27+
* @param {String} [props.inputName=""] - name attribute for the input element
2728
*/
2829
function ReactCustomSearchList(props) {
2930
const {
@@ -46,6 +47,7 @@ function ReactCustomSearchList(props) {
4647
theme = 'outline',
4748
corner = true,
4849
autoFocus = false,
50+
inputName = '',
4951
} = props;
5052
const [open, setOpen] = useState(false);
5153
const rootRef = useRef();
@@ -99,6 +101,7 @@ function ReactCustomSearchList(props) {
99101
placeholder={placeholder}
100102
style={inputStyle}
101103
autoFocus={autoFocus}
104+
{...(inputName ? {name: inputName} : {})}
102105
/>
103106
{ClearIconComponent ? <ClearIconComponent value={value} onClear={onClear} /> : null}
104107

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /