fix(FormInputGroup): make breaking change non-breaking

Author: jonthomp

example/src/FormElementsPage.react.js

@@ -158,15 +158,15 @@ function FormElements() {
               <Form.Group label="Input Group Buttons">
                 <Form.InputGroup>
                   <Form.Input />
-                  <Form.InputGroupAppend>
+                  <Form.InputGroup append>
                     <Button color="primary">Actions</Button>
                     <Button.Dropdown color="primary">
                       <Dropdown.Item>News</Dropdown.Item>
                       <Dropdown.Item>Messages</Dropdown.Item>
                       <Dropdown.ItemDivider />
                       <Dropdown.Item>Edit Profile</Dropdown.Item>
                     </Button.Dropdown>
-                  </Form.InputGroupAppend>
+                  </Form.InputGroup>
                 </Form.InputGroup>
               </Form.Group>
             </ComponentDemo>

src/components/Form/FormInputGroup.react.js

@@ -27,6 +27,14 @@ function FormInputGroup(props: Props): React.Node {
   const Component = RootComponent || "div";
   const children = inputProps ? <Form.Input {...inputProps} /> : props.children;
 
+  if (prepend === true) {
+    return <FormInputGroupPrepend>{children}</FormInputGroupPrepend>;
+  }
+
+  if (append === true) {
+    return <FormInputGroupAppend>{children}</FormInputGroupAppend>;
+  }
+
   return (
     <Component className={classes}>
       {prepend && <FormInputGroupPrepend>{prepend}</FormInputGroupPrepend>}