updated bootstrap and redux-form

nikordaris · Nov 1, 2017 · 044da40 · 044da40
1 parent 7f45ca0
commit 044da40
Show file tree

Hide file tree

Showing 11 changed files with 747 additions and 253 deletions.
diff --git a/package.json b/package.json
@@ -1,21 +1,18 @@
 {
   "name": "redux-form-jsonschema-reactstrap",
-  "version": "0.1.3",
+  "version": "0.1.4",
   "description": "",
   "main": "lib/index.js",
   "repository": {
     "type": "git",
-    "url":
-      "git+https://github.com/nikordaris/redux-form-jsonschema-reactstrap.git"
+    "url": "git+https://github.com/nikordaris/redux-form-jsonschema-reactstrap.git"
   },
   "author": "Nikordaris <nikordaris@gmail.com>",
   "license": "MIT",
   "bugs": {
-    "url":
-      "https://github.com/nikordaris/redux-form-jsonschema-reactstrap/issues"
+    "url": "https://github.com/nikordaris/redux-form-jsonschema-reactstrap/issues"
   },
-  "homepage":
-    "https://github.com/nikordaris/redux-form-jsonschema-reactstrap#readme",
+  "homepage": "https://github.com/nikordaris/redux-form-jsonschema-reactstrap#readme",
   "scripts": {
     "prepublish": "npm run build",
     "build": "npm run clean; babel src --out-dir lib --ignore *.test.js",
@@ -51,7 +48,7 @@
     "babel-preset-flow": "^6.23.0",
     "babel-preset-react": "^6.24.1",
     "babel-preset-stage-0": "^6.24.1",
-    "bootstrap": "^4.0.0-alpha.6",
+    "bootstrap": "^4.0.0-beta.2",
     "codecov": "^2.2.0",
     "concurrently": "^3.4.0",
     "css-loader": "^0.28.4",
@@ -79,7 +76,7 @@
     "react-redux": "^5.0.5",
     "react-test-renderer": "^15.5.4",
     "react-transition-group": "^1.2",
-    "reactstrap": "^4.6.2",
+    "reactstrap": "^5.0.0-alpha.3",
     "redux": "^3.7.1",
     "redux-form": "^7.0.2",
     "rimraf": "^2.6.1",
@@ -99,7 +96,8 @@
     "react-dom": "^15.6.1",
     "react-jsonschema-vis": "^0.0.8",
     "react-redux": "^5.0.5",
+    "reactstrap": "^5.0.0-alpha.3",
     "redux": "^3.7.1",
     "redux-form": "^6.8.0"
   }
-}
+}
diff --git a/src/components/CardContainers.js b/src/components/CardContainers.js
@@ -1,7 +1,7 @@
 // @flow
 
 import React, { Component } from 'react';
-import { Card, CardBlock, CardHeader, Button } from 'reactstrap';
+import { Card, CardBody, CardHeader, Button } from 'reactstrap';
 import { injectSheet } from '../Jss';
 import SchemaVis from 'react-jsonschema-vis';
 import { set, merge } from 'lodash';
@@ -29,8 +29,8 @@ export class CardWithHeader extends Component {
       <Card className={classes.card}>
         <CardHeader className={classes.header}>{schema.title}</CardHeader>
         <SchemaVis
-          tag={CardBlock}
-          className={classes.cardblock}
+          tag={CardBody}
+          className={classes.cardbody}
           {...schemaVis}
           schema={_schema}
           namespace={name}
@@ -86,8 +86,8 @@ export class CardItem extends Component {
           </div>
         </CardHeader>
         <SchemaVis
-          tag={CardBlock}
-          className={classes.cardblock}
+          tag={CardBody}
+          className={classes.cardbody}
           namespace={name}
           prefix={prefix}
           schema={_schema}

diff --git a/src/components/FormField.js b/src/components/FormField.js
@@ -82,7 +82,7 @@ export default class FormField extends Component {
     const labelId = `${name}-label`;
     const inputState = this.getInputState();
     return (
-      <Tag {...rest} className={classes.formGroup} color={inputState}>
+      <Tag {...rest} className={classes.formGroup}>
         <LabelTag
           className={classes.label}
           id={labelId}
@@ -106,14 +106,12 @@ export default class FormField extends Component {
         {Children.map(children, child =>
           cloneElement(child, {
             id: name,
-            state: inputState
+            valid: (!showFeedback(this.props) || (!error && !warning))
           })
         )}
-
-        {inputState &&
-          <FormFeedback className={classes.feedback} id={`${name}-feedback`}>
-            {error || warning}
-          </FormFeedback>}
+        <FormFeedback className={classes.feedback} id={`${name}-feedback`}>
+          {error || warning}
+        </FormFeedback>
       </Tag>
     );
   }

diff --git a/src/components/UniformedArrayFields.js b/src/components/UniformedArrayFields.js
@@ -5,7 +5,7 @@ import {
   Button,
   Card,
   CardHeader,
-  CardBlock,
+  CardBody,
   ListGroup,
   Modal,
   ModalHeader,
@@ -25,7 +25,7 @@ class UniformedArray extends Component {
   static defaultProps = {
     tag: Card,
     headerTag: CardHeader,
-    bodyTag: CardBlock,
+    bodyTag: CardBody,
     addBtnProps: {},
     required: false
   };
@@ -158,7 +158,7 @@ export class UniformedArrayInline extends Component {
 }
 
 @reduxForm({
-  form: 'arrayItem'
+  form: 'uniformedArrayItem'
 })
 class SchemaVisForm extends Component {
   render() {
@@ -192,6 +192,7 @@ class ModalUniformArray extends Component {
   props: {
     tag: string,
     submitForm: string => void,
+    formName: string,
     fields: any,
     items: any,
     headerTag: string,
@@ -226,8 +227,8 @@ class ModalUniformArray extends Component {
   };
 
   handleSubmitModal = () => {
-    const { submitForm } = this.props;
-    submitForm('arrayItem');
+    const { submitForm, formName } = this.props;
+    submitForm(formName);
   };
 
   toggleAddFormModal = (state: any = { selectedIdx: undefined }) => {
@@ -271,6 +272,7 @@ class ModalUniformArray extends Component {
     const {
       schemaVis,
       fields,
+      formName,
       schemaVis: { schema: { items: schema } }
     } = this.props;
     const { selectedIdx } = this.state;
@@ -286,6 +288,7 @@ class ModalUniformArray extends Component {
         </ModalHeader>
         <ModalBody>
           <SchemaVisForm
+            form={formName}
             initialValues={initialValues}
             schemaVis={{ ...schemaVis, schema }}
             onSubmit={this.handleSubmitItem}
@@ -365,6 +368,7 @@ export class ModalUniformedArrayCard extends Component {
         component={ModalUniformArray}
         schemaVis={schemaVis}
         bodyProps={{ flush: true }}
+        formName="uniformedArrayCardItem"
         {...rest}
       />
     );
@@ -406,6 +410,7 @@ export class ModalUniformedArrayInline extends Component {
         bodyTag="div"
         headerTag="div"
         tag="div"
+        formName="uniformedArrayInlineItem"
         {...rest}
       />
     );

diff --git a/src/components/VariedArrayFields.js b/src/components/VariedArrayFields.js
@@ -5,7 +5,7 @@ import {
   Button,
   Card,
   CardHeader,
-  CardBlock,
+  CardBody,
   Input,
   ListGroup,
   Modal,
@@ -26,7 +26,7 @@ class VariedArray extends Component {
   static defaultProps = {
     tag: Card,
     headerTag: CardHeader,
-    bodyTag: CardBlock,
+    bodyTag: CardBody,
     addBtnProps: {},
     selectInputProps: {},
     required: false
@@ -276,6 +276,7 @@ class ModalVariedArray extends Component {
     fields: any,
     meta: { form: string },
     submitForm: string => void,
+    formName: string,
     tag: string,
     headerTag: string,
     bodyTag: string,
@@ -340,8 +341,8 @@ class ModalVariedArray extends Component {
   };
 
   handleSubmitModal = () => {
-    const { submitForm } = this.props;
-    submitForm(ARRAY_ITEM_FORM);
+    const { submitForm, formName } = this.props;
+    submitForm(formName);
   };
 
   handleRemoveItem = (idx: number) => () => {
@@ -396,6 +397,7 @@ class ModalVariedArray extends Component {
     const {
       schemaVis,
       fields,
+      formName,
       schemaVis: { prefix, schema: { items: schema } }
     } = this.props;
     const { selectedIdx, fieldSchemas } = this.state;
@@ -429,6 +431,7 @@ class ModalVariedArray extends Component {
               schema,
               componentProps
             }}
+            form={formName}
             initialValues={initialValues}
             onSubmit={this.handleSubmitItem}
           />
@@ -506,6 +509,7 @@ export class ModalVariedArrayCard extends Component {
         component={ModalVariedArray}
         schemaVis={schemaVis}
         bodyProps={{ flush: true }}
+        formName="variedArrayCardItem"
         {...rest}
       />
     );
@@ -547,6 +551,7 @@ export class ModalVariedArrayInline extends Component {
         bodyTag="div"
         headerTag="div"
         tag="div"
+        formName="variedArrayInlineItem"
         {...rest}
       />
     );