Optimizations to improve performance on complex conditional schemas

docs/index.md

@@ -81,7 +81,85 @@ For more information on what themes we support, see [Using Themes](usage/themes)
 
 disabled until https://github.com/rjsf-team/react-jsonschema-form/issues/1584 is resolved
 
-## Useful samples
+Sometimes you may want to trigger events or modify external state when a field has been focused, so you can pass an `onFocus` handler, which will receive the id of the input that is focused and the field value.
+
+### Submit form programmatically
+You can use the reference to get your `Form` component and call the `submit` method to submit the form programmatically without a submit button.
+This method will dispatch the `submit` event of the form, and the function, that is passed to `onSubmit` props, will be called.
+
+```js
+const onSubmit = ({formData}) => console.log("Data submitted: ",  formData);
+let yourForm;
+
+render((
+  <Form schema={schema}
+        onSubmit={onSubmit} ref={(form) => {yourForm = form;}}/>
+), document.getElementById("app"));
+
+yourForm.submit();
+```
+
+## Styling your forms
+
+This library renders form fields and widgets leveraging the [Bootstrap](http://getbootstrap.com/) semantics. That means your forms will be beautiful by default if you're loading its stylesheet in your page.
+
+You're not necessarily forced to use Bootstrap; while it uses its semantics, it also provides a bunch of other class names so you can bring new styles or override default ones quite easily in your own personalized stylesheet. That's just HTML after all :)
+
+If you're okay with using styles from the Bootstrap ecosystem though, then the good news is that you have access to many themes for it, which are compatible with our generated forms!
+
+Here are some examples from the [playground](https://rjsf-team.github.io/react-jsonschema-form/), using some of the [Bootswatch](http://bootswatch.com/) free themes:
+
+![](https://i.imgur.com/1Z5oUK3.png)
+![](https://i.imgur.com/IMFqMwK.png)
+![](https://i.imgur.com/HOACwt5.png)
+
+Last, if you really really want to override the semantics generated by the lib, you can always create and use your own custom [widget](advanced-customization.md#custom-widget-components), [field](advanced-customization.md#custom-field-components) and/or [schema field](advanced-customization.md#custom-schemafield) components.
+
+
+## JSON Schema supporting status
+
+This component follows [JSON Schema](http://json-schema.org/documentation.html) specs. We currently support JSON Schema-07 by default, but we also support other JSON schema versions through the [custom schema validation](https://react-jsonschema-form.readthedocs.io/en/latest/validation/#custom-schema-validation) feature. Due to the limitation of form widgets, there are some exceptions as follows:
+
+* `additionalItems` keyword for arrays
+
+    This keyword works when `items` is an array. `additionalItems: true` is not supported because there's no widget to represent an item of any type. In this case it will be treated as no additional items allowed. `additionalItems` being a valid schema is supported.
+
+* `anyOf`, `allOf`, and `oneOf`, or multiple `types` (i.e. `"type": ["string", "array"]`)
+
+    The `anyOf` and `oneOf` keywords are supported; however, properties declared inside the `anyOf/oneOf` should not overlap with properties "outside" of the `anyOf/oneOf`.
+
+    You can also use `oneOf` with [schema dependencies](dependencies.md#schema-dependencies) to dynamically add schema properties based on input data.
+
+    The `allOf` keyword is partially supported. 
+
+* `"additionalProperties":false` produces incorrect schemas when used with [schema dependencies](#schema-dependencies). This library does not remove extra properties, which causes validation to fail. It is recommended to avoid setting `"additionalProperties":false` when you use schema dependencies. See [#848](https://github.com/mozilla-services/react-jsonschema-form/issues/848) [#902](https://github.com/mozilla-services/react-jsonschema-form/issues/902) [#992](https://github.com/mozilla-services/react-jsonschema-form/issues/992)
+
+## Handling of schema defaults
+
+This library automatically fills default values defined the [JSON Schema](http://json-schema.org/documentation.html) as initial values in your form. This also works for complex structures in the schema. If a field has a default defined, it should always appear as default value in form. This also works when using [schema dependencies](#schema-dependencies).
+
+Since there is a complex interaction between any supplied original form data and any injected defaults, this library tries to do the injection in a way which keeps the original intention of the original form data.
+
+Check out the defaults example on the [live playground](https://mozilla-services.github.io/react-jsonschema-form/) to see this in action.
+
+### Merging of defaults into the form data
+
+There are three different cases which need to be considered for the merging. Objects, arrays and scalar values. This library always deeply merges any defaults with the existing form data for objects.
+
+This are the rules which are used when injecting the defaults: 
+
+- When the is a scalar in the form data, nothing is changed. 
+- When the value is `undefined` in the form data, the default is created in the form data.
+- When the value is an object in the form data, the defaults are deeply merged into the form data, using the rules defined here for the deep merge.
+- Then the value is an array in the form data, defaults are only injected in existing array items. No new array items will be created, even if the schema has minItems or additional items defined.
+
+### Merging of defaults within the schema
+
+In the schema itself, defaults of parent elements are propagated into children. So when you have a schema which defines a deeply nested object as default, these defaults will be applied to children of the current node. This also merges objects defined at different levels together with the "deeper" not having precedence. If the parent node defines properties, which are not defined in the child, they will be merged so that the default for the child will be the merged defaults of parent and child.
+
+For arrays this is not the case. Defining an array, when a parent also defines an array, will be overwritten. This is only true when arrays are used in the same level, for objects within these arrays, they will be deeply merged again.
+
+## Tips and tricks
 
  - Custom field template: <https://jsfiddle.net/hdp1kgn6/1/>
  - Multi-step wizard: <https://jsfiddle.net/sn4bnw9h/1/>

packages/core/src/components/fields/SchemaField.js

@@ -249,7 +249,8 @@ function SchemaFieldRender(props) {
   const FieldTemplate =
     uiSchema["ui:FieldTemplate"] || registry.FieldTemplate || DefaultTemplate;
   let idSchema = props.idSchema;
-  const schema = retrieveSchema(props.schema, rootSchema, formData);
+  var schema = retrieveSchema(props.schema, rootSchema, formData);
+
   idSchema = mergeObjects(
     toIdSchema(schema, null, rootSchema, formData, idPrefix),
     idSchema
@@ -403,7 +404,6 @@ function SchemaFieldRender(props) {
     </FieldTemplate>
   );
 }
-
 class SchemaField extends React.Component {
   shouldComponentUpdate(nextProps, nextState) {
     return !deepEquals(this.props, nextProps);

packages/core/src/components/widgets/BaseInput.js

@@ -8,7 +8,7 @@ function BaseInput(props) {
     console.log("No id for", props);
     throw new Error(`no id for props ${JSON.stringify(props)}`);
   }
-  const {
+  var {
     value,
     readonly,
     disabled,
@@ -66,6 +66,12 @@ function BaseInput(props) {
     return props.onChange(value === "" ? options.emptyValue : value);
   };
 
+  // If its a constant value then we want to disable the control and set the default value
+  if (typeof schema.const !== "undefined") {
+    value = schema.const;
+    disabled = true;
+  }
+
   return [
     <input
       key={inputProps.id}

packages/core/src/components/widgets/CheckboxWidget.js

@@ -3,7 +3,7 @@ import PropTypes from "prop-types";
 import { schemaRequiresTrueValue } from "../../utils";
 
 function CheckboxWidget(props) {
-  const {
+  var {
     schema,
     id,
     value,
@@ -22,6 +22,12 @@ function CheckboxWidget(props) {
   // "const" or "enum" keywords
   const required = schemaRequiresTrueValue(schema);
 
+  // If its a constant value then we want to disable the control and set the default value
+  if (typeof schema.const !== "undefined") {
+    value = schema.const;
+    disabled = true;
+  }
+
   return (
     <div className={`checkbox ${disabled || readonly ? "disabled" : ""}`}>
       {schema.description && (