From 7c672e608d34edef55770ddf021967716eb83615 Mon Sep 17 00:00:00 2001
From: "J. Ryan Stinnett" <jryans@gmail.com>
Date: Fri, 1 Mar 2019 16:13:11 +0000
Subject: [PATCH 1/2] Reorganise props handling in Field

Several small tweaks to the props handling:

* Use destructuring instead of `delete`
* Emphasize the `element` as a primary prop
* Document `textarea` as supported
---
 src/components/views/elements/Field.js | 28 ++++++++++++--------------
 1 file changed, 13 insertions(+), 15 deletions(-)

diff --git a/src/components/views/elements/Field.js b/src/components/views/elements/Field.js
index 55d1f42b55..1367ca0d7a 100644
--- a/src/components/views/elements/Field.js
+++ b/src/components/views/elements/Field.js
@@ -21,15 +21,16 @@ export default class Field extends React.PureComponent {
     static propTypes = {
         // The field's ID, which binds the input and label together.
         id: PropTypes.string.isRequired,
-        // The field's <input> type. Defaults to "text".
+        // The element to create. Defaults to "input".
+        // Should be "input", "select", or "textarea".
+        // To define options for a select, use <Field><option ... /></Field>
+        element: PropTypes.string,
+        // The field's type (when used as an <input>). Defaults to "text".
         type: PropTypes.string,
         // The field's label string.
         label: PropTypes.string,
         // The field's placeholder string. Defaults to the label.
         placeholder: PropTypes.string,
-        // The type of field to create. Defaults to "input". Should be "input" or "select".
-        // To define options for a select, use <Field><option ... /></Field>
-        element: PropTypes.string,
         // All other props pass through to the <input>.
     };
 
@@ -46,21 +47,18 @@ export default class Field extends React.PureComponent {
     }
 
     render() {
-        const extraProps = Object.assign({}, this.props);
+        const { element, children, ...inputProps } = this.props;
 
-        // Remove explicit properties that shouldn't be copied
-        delete extraProps.element;
-        delete extraProps.children;
+        const inputElement = element || "input";
 
-        // Set some defaults for the element
-        extraProps.type = extraProps.type || "text";
-        extraProps.ref = "fieldInput";
-        extraProps.placeholder = extraProps.placeholder || extraProps.label;
+        // Set some defaults for the <input> element
+        inputProps.type = inputProps.type || "text";
+        inputProps.ref = "fieldInput";
+        inputProps.placeholder = inputProps.placeholder || inputProps.label;
 
-        const element = this.props.element || "input";
-        const fieldInput = React.createElement(element, extraProps, this.props.children);
+        const fieldInput = React.createElement(inputElement, inputProps, children);
 
-        return <div className={`mx_Field mx_Field_${element}`}>
+        return <div className={`mx_Field mx_Field_${inputElement}`}>
             {fieldInput}
             <label htmlFor={this.props.id}>{this.props.label}</label>
         </div>;

From d4a148d56c413eddb81acae8f3d12977837eb6fc Mon Sep 17 00:00:00 2001
From: "J. Ryan Stinnett" <jryans@gmail.com>
Date: Tue, 5 Mar 2019 11:18:58 +0000
Subject: [PATCH 2/2] Use `oneOf` to check the input element

---
 src/components/views/elements/Field.js | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/src/components/views/elements/Field.js b/src/components/views/elements/Field.js
index 1367ca0d7a..1b7d9fdd73 100644
--- a/src/components/views/elements/Field.js
+++ b/src/components/views/elements/Field.js
@@ -22,9 +22,8 @@ export default class Field extends React.PureComponent {
         // The field's ID, which binds the input and label together.
         id: PropTypes.string.isRequired,
         // The element to create. Defaults to "input".
-        // Should be "input", "select", or "textarea".
         // To define options for a select, use <Field><option ... /></Field>
-        element: PropTypes.string,
+        element: PropTypes.oneOf(["input", "select", "textarea"]),
         // The field's type (when used as an <input>). Defaults to "text".
         type: PropTypes.string,
         // The field's label string.