From 40e13156710f9ce4e8d4f10d8a0ccb8dad151841 Mon Sep 17 00:00:00 2001
From: Wylie Conlon <wylieconlon@gmail.com>
Date: Tue, 18 Jun 2019 14:11:41 -0400
Subject: [PATCH 1/3] Require that FormRow has exactly one child element

---
 src-docs/src/i18ntokens.json                  | 12 ++++++------
 src/components/form/form_row/form_row.js      |  6 +++---
 src/components/form/form_row/form_row.test.js |  4 ++++
 src/components/form/form_row/index.d.ts       | 11 +++++++++--
 4 files changed, 22 insertions(+), 11 deletions(-)

diff --git a/src-docs/src/i18ntokens.json b/src-docs/src/i18ntokens.json
index e2b32956121..a3b0cdfdf1b 100644
--- a/src-docs/src/i18ntokens.json
+++ b/src-docs/src/i18ntokens.json
@@ -5,11 +5,11 @@
     "highlighting": "string",
     "loc": {
       "start": {
-        "line": 465,
+        "line": 467,
         "column": 12
       },
       "end": {
-        "line": 469,
+        "line": 471,
         "column": 14
       }
     },
@@ -21,11 +21,11 @@
     "highlighting": "string",
     "loc": {
       "start": {
-        "line": 503,
+        "line": 505,
         "column": 6
       },
       "end": {
-        "line": 503,
+        "line": 505,
         "column": 77
       }
     },
@@ -37,11 +37,11 @@
     "highlighting": "string",
     "loc": {
       "start": {
-        "line": 848,
+        "line": 863,
         "column": 8
       },
       "end": {
-        "line": 848,
+        "line": 863,
         "column": 79
       }
     },
diff --git a/src/components/form/form_row/form_row.js b/src/components/form/form_row/form_row.js
index d42d41d1392..79835cb54df 100644
--- a/src/components/form/form_row/form_row.js
+++ b/src/components/form/form_row/form_row.js
@@ -1,4 +1,4 @@
-import React, { cloneElement, Component } from 'react';
+import React, { cloneElement, Component, Children } from 'react';
 import PropTypes from 'prop-types';
 import classNames from 'classnames';
 
@@ -155,7 +155,7 @@ export class EuiFormRow extends Component {
       optionalProps['aria-describedby'] = describingIds.join(' ');
     }
 
-    let field = cloneElement(children, {
+    let field = cloneElement(Children.only(children), {
       id,
       onFocus: this.onFocus,
       onBlur: this.onBlur,
@@ -186,7 +186,7 @@ export class EuiFormRow extends Component {
 }
 
 EuiFormRow.propTypes = {
-  children: PropTypes.node.isRequired,
+  children: PropTypes.element.isRequired,
   className: PropTypes.string,
   label: PropTypes.node,
   /**
diff --git a/src/components/form/form_row/form_row.test.js b/src/components/form/form_row/form_row.test.js
index 130d18752bf..6265a7b4d5b 100644
--- a/src/components/form/form_row/form_row.test.js
+++ b/src/components/form/form_row/form_row.test.js
@@ -18,6 +18,10 @@ describe('EuiFormRow', () => {
     expect(component).toMatchSnapshot();
   });
 
+  test('single child is required', () => {
+    expect(() => <EuiFormRow {...requiredProps} />).toThrow();
+  });
+
   test('ties together parts for accessibility', () => {
     const props = {
       label: 'Label',
diff --git a/src/components/form/form_row/index.d.ts b/src/components/form/form_row/index.d.ts
index 89ed398e5ff..93aadba7221 100644
--- a/src/components/form/form_row/index.d.ts
+++ b/src/components/form/form_row/index.d.ts
@@ -1,6 +1,11 @@
 import { CommonProps, ExclusiveUnion } from '../../common';
 
-import { FunctionComponent, ReactNode, HTMLAttributes } from 'react';
+import {
+  FunctionComponent,
+  ReactNode,
+  ReactElement,
+  HTMLAttributes,
+} from 'react';
 
 declare module '@elastic/eui' {
   /**
@@ -29,7 +34,9 @@ declare module '@elastic/eui' {
   } & EuiFormRowCommonProps &
     HTMLAttributes<HTMLFieldSetElement>;
 
-  export type EuiFormRowProps = ExclusiveUnion<LabelProps, LegendProps>;
+  export type EuiFormRowProps = ExclusiveUnion<LabelProps, LegendProps> & {
+    children: ReactElement;
+  };
 
   export const EuiFormRow: FunctionComponent<EuiFormRowProps>;
 }

From 3dedde1356312c4a25380058c5b08ecbcf19cd31 Mon Sep 17 00:00:00 2001
From: Wylie Conlon <wylieconlon@gmail.com>
Date: Tue, 18 Jun 2019 14:15:06 -0400
Subject: [PATCH 2/3] Update tests

---
 src/components/form/form_row/form_row.test.js | 11 ++++++++++-
 1 file changed, 10 insertions(+), 1 deletion(-)

diff --git a/src/components/form/form_row/form_row.test.js b/src/components/form/form_row/form_row.test.js
index 6265a7b4d5b..c32f7d24ac2 100644
--- a/src/components/form/form_row/form_row.test.js
+++ b/src/components/form/form_row/form_row.test.js
@@ -18,10 +18,19 @@ describe('EuiFormRow', () => {
     expect(component).toMatchSnapshot();
   });
 
-  test('single child is required', () => {
+  test('no children is an error', () => {
     expect(() => <EuiFormRow {...requiredProps} />).toThrow();
   });
 
+  test('two children is an error', () => {
+    expect(() => (
+      <EuiFormRow {...requiredProps}>
+        <div />
+        <div />
+      </EuiFormRow>
+    )).toThrow();
+  });
+
   test('ties together parts for accessibility', () => {
     const props = {
       label: 'Label',

From a7d79f8ab5fd08b5e816f45c54c70c8dc3bc8bd0 Mon Sep 17 00:00:00 2001
From: Wylie Conlon <wylieconlon@gmail.com>
Date: Thu, 20 Jun 2019 16:55:22 -0400
Subject: [PATCH 3/3] Add changelog entry

---
 CHANGELOG.md | 1 +
 1 file changed, 1 insertion(+)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 9872acd4ec7..a2b26ebedde 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -16,6 +16,7 @@
 - Fixed TypeScript `Toast` member export ([#2052](https://github.com/elastic/eui/pull/2052))
 - Fixed style of readOnly input groups via `EuiFormControlLayout` and `prepend`/`append` ([#2057](https://github.com/elastic/eui/pull/2057))
 - Removed TS types from ES exports when the exported name differs from the imported one ([#2069](https://github.com/elastic/eui/pull/2069))
+- Require that FormRow has exactly one child element [#2054](https://github.com/elastic/eui/pull/2054)
 
 ## [`12.0.0`](https://github.com/elastic/eui/tree/v12.0.0)