react-jsonschema-form demo
https://github.com/mozilla-services/react-jsonschema-form
HTML
<script src="https://npmcdn.com/react-jsonschema-form/dist/react-jsonschema-form.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<div class="container">
<div id="main"></div>
</div>
CSS
.foo textarea {
background: blue;
color: white;
}
Babel + JSX
const Form = JSONSchemaForm.default;
const schema = {
title: "react-jsonschema-form demo",
type: "object",
required: ["name"],
properties: {
name: {type: "string", minLength: 3},
description: {type: "string", default: "Some text here"}
}
};
const uiSchema = {
description: {
"ui:widget": "textarea",
classNames: "foo"
}
};
React.render(<Form schema={schema} uiSchema={uiSchema} liveValidate/>,
document.getElementById("main"));