nikordaris / redux-form-jsonschema-reactstrap

redux-form field library using reactstrap

Redux-Form Jsonschema Reactstrap

A collection of reactstrap form components for redux-form. These components are intended to be used with react-jsonschema-vis to generate redux-form forms from a jsonschema definitions

Install

$ npm install redux-form-jsonschema-reactstrap

with react-jsonschema-vis

Example

Demo

redux-form-jsonschema-reactstrap's Issues

Array Components

• Dynamic input fields with add and remove buttons
• Dynamic object form with add and remove buttons
• Dynamic modal object form with list group display, add/remove buttons, modal edit, and es6-template-strings display names

File Components

• Single File component
• Multi File component

Unexpected Field Validation behaviour (different from storybook demo)

I'm having difficulty replicating the behaviour of the 'simple form' demo provided.

I have created a codesandbox here : https://codesandbox.io/s/qkxmyyvokq

The sandbox behaves slightly differently from what happens on my desktop. In the sandbox if an inputs valid prop is false there is no change to the inputs border or the green tick in the corner. On my desktop the border goes gray and the green tick disappears. In the demo the border goes red, the green tick disappears and a message like 'missing required field' appears below the input.

How do I get this behaviour to work outside of the storybook?

The 'App.js' code is also below:

import React, { Component } from "react";
import SchemaVis from "react-jsonschema-vis";
import components from "redux-form-jsonschema-reactstrap";
import { Provider } from "react-redux";
import { createStore, combineReducers } from "redux";
import { reducer as formReducer } from "redux-form";

import simpleFormSchema from "./schema.json";
import { ReduxTestForm } from "./TestForm";

const rootReducer = combineReducers({
  // ...your other reducers here
  // you have to pass formReducer under 'form' key,
  // for custom keys look up the docs for 'getFormState'
  form: formReducer
});

const store = createStore(rootReducer);

class App extends Component {
  render() {
    return (
      <Provider store={store}>
        <ReduxTestForm
          form="simple form"
          //onSubmit={data => action('Form(SimpleForm) submit')(data)}
        >
          <SchemaVis
            form="simple form"
            schema={simpleFormSchema}
            components={components}
          />
        </ReduxTestForm>
      </Provider>
    );
  }
}

export default App;

Dropdown selected values are not tracked when submitting form.

Dropdown values are not being tracked when hitting the submit button.
This can be confirmed on the storybook simple form example selecting any gender option value and filling in other form required fields. Dropdown values for gender are not coming out in the log.

The same happens when trying with custom code.
Is it probably something else missing to make the form grab the correct values in data?

[question] support anyOf and allOf?

just a question this project support json schema with anyOf and allOf? this project its like a fork of react-jsonschema-form?

Can this library be used without react-jsonschema-vis

I think this is what I'm looking for. I'm having difficulties wrapping reactstrap with redux-form or vice versa to get the styles from reactstrap to work with redux-form.

My question: If I don't want to predefine my schema, but still want to use this libarary, is that possible? If so, how? If not, I'm still not sure how to use it... any plans on building out the docs?