Add lazy getDefaultRegistry (rjsf-team#575)

Author: vinhlh

src/components/fields/ArrayField.js

@@ -179,7 +179,7 @@ class ArrayField extends Component {
     uiSchema: {},
     formData: [],
     idSchema: {},
-    registry: getDefaultRegistry(),
+    registry: null,
     required: false,
     disabled: false,
     readonly: false,
@@ -203,7 +203,7 @@ class ArrayField extends Component {
 
   onAddClick = event => {
     event.preventDefault();
-    const { schema, registry, formData } = this.props;
+    const { schema, formData, registry = getDefaultRegistry() } = this.props;
     const { definitions } = registry;
     let itemSchema = schema.items;
     if (isFixedItems(schema) && allowAdditionalItems(schema)) {
@@ -291,7 +291,7 @@ class ArrayField extends Component {
       disabled,
       readonly,
       autofocus,
-      registry,
+      registry = getDefaultRegistry(),
       formContext,
       onBlur,
     } = this.props;
@@ -348,9 +348,10 @@ class ArrayField extends Component {
       readonly,
       autofocus,
       onBlur,
+      registry = getDefaultRegistry(),
     } = this.props;
     const items = this.props.formData;
-    const { widgets, definitions, formContext } = this.props.registry;
+    const { widgets, definitions, formContext } = registry;
     const itemsSchema = retrieveSchema(schema.items, definitions);
     const enumOptions = optionsList(itemsSchema);
     const { widget = "select", ...options } = {
@@ -385,10 +386,11 @@ class ArrayField extends Component {
       readonly,
       autofocus,
       onBlur,
+      registry = getDefaultRegistry(),
     } = this.props;
     const title = schema.title || name;
     const items = this.props.formData;
-    const { widgets, formContext } = this.props.registry;
+    const { widgets, formContext } = registry;
     const { widget = "files", ...options } = getUiOptions(uiSchema);
     const Widget = getWidget(schema, widget, widgets);
     return (
@@ -420,7 +422,7 @@ class ArrayField extends Component {
       disabled,
       readonly,
       autofocus,
-      registry,
+      registry = getDefaultRegistry(),
       onBlur,
     } = this.props;
     const title = schema.title || name;
@@ -502,8 +504,13 @@ class ArrayField extends Component {
       autofocus,
       onBlur,
     } = props;
-    const { SchemaField } = this.props.registry.fields;
-    const { disabled, readonly, uiSchema } = this.props;
+    const {
+      disabled,
+      readonly,
+      uiSchema,
+      registry = getDefaultRegistry(),
+    } = this.props;
+    const { fields: { SchemaField } } = registry;
     const { orderable, removable } = {
       orderable: true,
       removable: true,

src/components/fields/BooleanField.js

@@ -15,7 +15,7 @@ function BooleanField(props) {
     uiSchema,
     idSchema,
     formData,
-    registry,
+    registry = getDefaultRegistry(),
     required,
     disabled,
     readonly,
@@ -72,7 +72,7 @@ if (process.env.NODE_ENV !== "production") {
 
 BooleanField.defaultProps = {
   uiSchema: {},
-  registry: getDefaultRegistry(),
+  registry: null,
   disabled: false,
   readonly: false,
   autofocus: false,

src/components/fields/ObjectField.js

@@ -13,7 +13,7 @@ class ObjectField extends Component {
     formData: {},
     errorSchema: {},
     idSchema: {},
-    registry: getDefaultRegistry(),
+    registry: null,
     required: false,
     disabled: false,
     readonly: false,
@@ -44,8 +44,9 @@ class ObjectField extends Component {
       disabled,
       readonly,
       onBlur,
+      registry = getDefaultRegistry(),
     } = this.props;
-    const { definitions, fields, formContext } = this.props.registry;
+    const { definitions, fields, formContext } = registry;
     const { SchemaField, TitleField, DescriptionField } = fields;
     const schema = retrieveSchema(this.props.schema, definitions);
     const title = schema.title === undefined ? name : schema.title;
@@ -92,7 +93,7 @@ class ObjectField extends Component {
               formData={formData[name]}
               onChange={this.onPropertyChange(name)}
               onBlur={onBlur}
-              registry={this.props.registry}
+              registry={registry}
               disabled={disabled}
               readonly={readonly}
             />

src/components/fields/SchemaField.js

@@ -132,7 +132,14 @@ DefaultTemplate.defaultProps = {
 };
 
 function SchemaFieldRender(props) {
-  const { uiSchema, errorSchema, idSchema, name, required, registry } = props;
+  const {
+    uiSchema,
+    errorSchema,
+    idSchema,
+    name,
+    required,
+    registry = getDefaultRegistry(),
+  } = props;
   const {
     definitions,
     fields,
@@ -247,7 +254,7 @@ SchemaField.defaultProps = {
   uiSchema: {},
   errorSchema: {},
   idSchema: {},
-  registry: getDefaultRegistry(),
+  registry: null,
   disabled: false,
   readonly: false,
   autofocus: false,

src/components/fields/StringField.js

@@ -19,9 +19,9 @@ function StringField(props) {
     disabled,
     readonly,
     autofocus,
-    registry,
     onChange,
     onBlur,
+    registry = getDefaultRegistry(),
   } = props;
   const { title, format } = schema;
   const { widgets, formContext } = registry;
@@ -78,7 +78,7 @@ if (process.env.NODE_ENV !== "production") {
 
 StringField.defaultProps = {
   uiSchema: {},
-  registry: getDefaultRegistry(),
+  registry: null,
   disabled: false,
   readonly: false,
   autofocus: false,

src/utils.js

@@ -52,15 +52,13 @@ const widgetMap = {
   },
 };
 
-const defaultRegistry = {
-  fields: require("./components/fields").default,
-  widgets: require("./components/widgets").default,
-  definitions: {},
-  formContext: {},
-};
-
 export function getDefaultRegistry() {
-  return defaultRegistry;
+  return {
+    fields: require("./components/fields").default,
+    widgets: require("./components/widgets").default,
+    definitions: {},
+    formContext: {},
+  };
 }
 
 export function getWidget(schema, widget, registeredWidgets = {}) {
@@ -249,9 +247,9 @@ export function orderProperties(properties, order) {
       return prev;
     }, {});
   const errorPropList = arr =>
-    (arr.length > 1
+    arr.length > 1
       ? `properties '${arr.join("', '")}'`
-      : `property '${arr[0]}'`);
+      : `property '${arr[0]}'`;
   const propertyHash = arrayToHash(properties);
   const orderHash = arrayToHash(order);
   const extraneous = order.filter(prop => prop !== "*" && !propertyHash[prop]);