Skip to content

Commit f3d218f

Browse files
committed
Allow "name" attribute for input, select, textarea elements
Allows this attribute to be used on web. No support for native at this time. Close #309
1 parent 4fac83c commit f3d218f

11 files changed

Lines changed: 23 additions & 3 deletions

File tree

apps/examples/src/components/App.js

Lines changed: 7 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -220,7 +220,11 @@ function Shell(): React.MixedElement {
220220
<html.div />
221221
{/*<html.input placeholder="input type:date" type="date" />*/}
222222
<html.div />
223-
<html.input placeholder="input type:email" type="email" />
223+
<html.input
224+
name="name-input"
225+
placeholder="input type:email"
226+
type="email"
227+
/>
224228
<html.div />
225229
<html.input placeholder="input type:number" type="number" />
226230
<html.div />
@@ -237,15 +241,15 @@ function Shell(): React.MixedElement {
237241
<html.div />
238242
<html.input enterKeyHint="go" placeholder="input enterKeyHint:go" />
239243
<html.div />
240-
<html.select>
244+
<html.select name="name-select">
241245
<html.optgroup label="optgroup">
242246
<html.option label="option 1" />
243247
<html.option label="option 2" />
244248
<html.option label="option 3" />
245249
</html.optgroup>
246250
</html.select>
247251
<html.div />
248-
<html.textarea placeholder="textarea" />
252+
<html.textarea name="name-textarea" placeholder="textarea" />
249253
</ExampleBlock>
250254

251255
<ExampleBlock title="CSS Animations">

apps/website/docs/api/03-html/05-input.md

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -34,6 +34,7 @@ const Foo = () => (
3434
* `min`
3535
* `minLength`
3636
* `multiple`
37+
* `name`
3738
* `onBeforeInput`
3839
* `onChange`
3940
* `onInput`

apps/website/docs/api/03-html/10-select.md

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -25,6 +25,7 @@ const Foo = () => (
2525
* [...Common props](/api/html/common/)
2626
* `autoComplete`
2727
* `multiple`
28+
* `name`
2829
* `required`
2930
* `onBeforeInput`
3031
* `onChange`

apps/website/docs/api/03-html/11-textarea.md

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -30,6 +30,7 @@ const Foo = () => (
3030
* `disabled`
3131
* `maxLength`
3232
* `minLength`
33+
* `name`
3334
* `onBeforeInput`
3435
* `onChange`
3536
* `onInput`

apps/website/docs/api/03-html/index.md

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -179,6 +179,9 @@ The following tables represent the compatibility status of the strict HTML API s
179179
| minLength (input) ||| |
180180
| minLength (textarea) ||| |
181181
| multiple (select) ||| |
182+
| name (input) ||| |
183+
| name (select) ||| |
184+
| name (textarea) ||| |
182185
| onAuxClick ||| [#38](https://github.com/facebook/react-strict-dom/issues/38) |
183186
| onBeforeInput (input) ||| [#38](https://github.com/facebook/react-strict-dom/issues/38) |
184187
| onBeforeInput (select) ||| [#38](https://github.com/facebook/react-strict-dom/issues/38) |

packages/react-strict-dom/src/shared/isPropAllowed.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -87,6 +87,7 @@ const strictAttributeSet: Set<string> = new Set([
8787
'min', // input
8888
'minLength', // input, textarea
8989
'multiple', // input, select
90+
'name', // input, select, textarea
9091
'onAuxClick',
9192
'onBeforeInput', // input, select, textarea
9293
'onBlur',

packages/react-strict-dom/src/types/StrictReactDOMInputProps.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,7 @@ export type StrictReactDOMInputProps = $ReadOnly<{
2121
min?: ?(string | number),
2222
minLength?: ?number,
2323
multiple?: ?boolean,
24+
name?: ?string,
2425
onBeforeInput?: $FlowFixMe,
2526
onChange?: $FlowFixMe,
2627
onInput?: $FlowFixMe,

packages/react-strict-dom/src/types/StrictReactDOMSelectProps.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,7 @@ export type StrictReactDOMSelectProps = $ReadOnly<{
1313
...StrictReactDOMProps,
1414
autoComplete?: AutoComplete,
1515
multiple?: ?boolean,
16+
name?: ?string,
1617
required?: ?boolean,
1718
onBeforeInput?: $FlowFixMe,
1819
onChange?: $FlowFixMe,

packages/react-strict-dom/src/types/StrictReactDOMTextAreaProps.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,7 @@ export type StrictReactDOMTextAreaProps = $ReadOnly<{
1616
disabled?: ?boolean,
1717
maxLength?: ?number,
1818
minLength?: ?number,
19+
name?: ?string,
1920
onBeforeInput?: $FlowFixMe,
2021
onChange?: $FlowFixMe,
2122
onInput?: $FlowFixMe,

packages/react-strict-dom/tests/__snapshots__/html-test.js.snap-dom

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3552,6 +3552,7 @@ exports[`html "input" supports additional input attributes 1`] = `
35523552
min="0"
35533553
minLength="0"
35543554
multiple={true}
3555+
name="user-firstname"
35553556
onBeforeInput={[Function]}
35563557
onChange={[Function]}
35573558
onInput={[Function]}
@@ -5477,6 +5478,7 @@ exports[`html "select" supports additional select attributes 1`] = `
54775478
<select
54785479
className="html-select x1y0btm7 x1ghz6dp x1717udv"
54795480
disabled={true}
5481+
name="user-language"
54805482
onBeforeInput={[Function]}
54815483
onChange={[Function]}
54825484
onInput={[Function]}
@@ -6168,6 +6170,7 @@ exports[`html "textarea" supports additional textarea attributes 1`] = `
61686170
disabled={true}
61696171
maxLength="10"
61706172
minLength="0"
6173+
name="user-message"
61716174
onBeforeInput={[Function]}
61726175
onChange={[Function]}
61736176
onInput={[Function]}

0 commit comments

Comments
 (0)