@rjsf/core 6.0.0 → 6.0.2

package/dist/index.esm.js

@@ -6,7 +6,7 @@ import {
   ErrorSchemaBuilder,
   getChangedFields,
   getTemplate as getTemplate28,
-  getUiOptions as getUiOptions19,
+  getUiOptions as getUiOptions20,
   isObject as isObject6,
   mergeObjects,
   NAME_KEY,
@@ -29,6 +29,7 @@ import _isEmpty from "lodash/isEmpty";
 import _pick from "lodash/pick";
 import _set from "lodash/set";
 import _toPath from "lodash/toPath";
+import _unset from "lodash/unset";
 
 // src/getDefaultRegistry.ts
 import {
@@ -109,9 +110,11 @@ function computeItemUiSchema(uiSchema, item, index, formContext) {
   }
 }
 function getNewFormDataRow(registry, schema) {
-  const { schemaUtils } = registry;
+  const { schemaUtils, globalFormOptions } = registry;
   let itemSchema = schema.items;
-  if (isFixedItems(schema) && allowAdditionalItems(schema)) {
+  if (globalFormOptions.useFallbackUiForUnsupportedType && !itemSchema) {
+    itemSchema = {};
+  } else if (isFixedItems(schema) && allowAdditionalItems(schema)) {
     itemSchema = schema.additionalItems;
   }
   return schemaUtils.getDefaultFormState(itemSchema);
@@ -646,7 +649,7 @@ function useKeyedFormData(formData = []) {
 }
 function ArrayField(props) {
   const { schema, uiSchema, errorSchema, fieldPathId, registry, formData, onChange } = props;
-  const { schemaUtils, translateString } = registry;
+  const { globalFormOptions, schemaUtils, translateString } = registry;
   const { keyedFormData, updateKeyedFormData } = useKeyedFormData(formData);
   const childFieldPathId = props.childFieldPathId ?? fieldPathId;
   const handleAddItem = useCallback(
@@ -783,24 +786,14 @@ function ArrayField(props) {
     },
     [onChange, childFieldPathId]
   );
-  if (!(ITEMS_KEY in schema)) {
-    const uiOptions = getUiOptions(uiSchema);
-    const UnsupportedFieldTemplate = getTemplate(
-      "UnsupportedFieldTemplate",
-      registry,
-      uiOptions
-    );
-    return /* @__PURE__ */ jsx(
-      UnsupportedFieldTemplate,
-      {
-        schema,
-        fieldPathId,
-        reason: translateString(TranslatableString.MissingItems),
-        registry
-      }
-    );
-  }
+  const arrayAsMultiProps = {
+    ...props,
+    formData,
+    fieldPathId: childFieldPathId,
+    onSelectChange
+  };
   const arrayProps = {
+    ...props,
     handleAddItem,
     handleCopyItem,
     handleRemoveItem,
@@ -808,19 +801,41 @@ function ArrayField(props) {
     keyedFormData,
     onChange: handleChange
   };
-  if (schemaUtils.isMultiSelect(schema)) {
-    return /* @__PURE__ */ jsx(ArrayAsMultiSelect, { ...props, fieldPathId: childFieldPathId, onSelectChange });
+  if (!(ITEMS_KEY in schema)) {
+    if (!globalFormOptions.useFallbackUiForUnsupportedType) {
+      const uiOptions = getUiOptions(uiSchema);
+      const UnsupportedFieldTemplate = getTemplate(
+        "UnsupportedFieldTemplate",
+        registry,
+        uiOptions
+      );
+      return /* @__PURE__ */ jsx(
+        UnsupportedFieldTemplate,
+        {
+          schema,
+          fieldPathId,
+          reason: translateString(TranslatableString.MissingItems),
+          registry
+        }
+      );
+    }
+    const fallbackSchema = { ...schema, [ITEMS_KEY]: { type: void 0 } };
+    arrayAsMultiProps.schema = fallbackSchema;
+    arrayProps.schema = fallbackSchema;
+  }
+  if (schemaUtils.isMultiSelect(arrayAsMultiProps.schema)) {
+    return /* @__PURE__ */ jsx(ArrayAsMultiSelect, { ...arrayAsMultiProps });
   }
   if (isCustomWidget(uiSchema)) {
-    return /* @__PURE__ */ jsx(ArrayAsCustomWidget, { ...props, fieldPathId: childFieldPathId, onSelectChange });
+    return /* @__PURE__ */ jsx(ArrayAsCustomWidget, { ...arrayAsMultiProps });
   }
-  if (isFixedItems(schema)) {
-    return /* @__PURE__ */ jsx(FixedArray, { ...props, ...arrayProps });
+  if (isFixedItems(arrayAsMultiProps.schema)) {
+    return /* @__PURE__ */ jsx(FixedArray, { ...arrayProps });
   }
-  if (schemaUtils.isFilesArray(schema, uiSchema)) {
-    return /* @__PURE__ */ jsx(ArrayAsFiles, { ...props, fieldPathId: childFieldPathId, onSelectChange });
+  if (schemaUtils.isFilesArray(arrayAsMultiProps.schema, uiSchema)) {
+    return /* @__PURE__ */ jsx(ArrayAsFiles, { ...arrayAsMultiProps });
   }
-  return /* @__PURE__ */ jsx(NormalArray, { ...props, ...arrayProps });
+  return /* @__PURE__ */ jsx(NormalArray, { ...arrayProps });
 }
 
 // src/components/fields/BooleanField.tsx
@@ -947,7 +962,7 @@ import { jsx as jsx3 } from "react/jsx-runtime";
 function getFallbackTypeSelectionSchema(title) {
   return {
     type: "string",
-    enum: ["string", "number", "boolean"],
+    enum: ["string", "number", "boolean", "object", "array"],
     default: "string",
     title
   };
@@ -957,6 +972,9 @@ function getTypeOfFormData(formData) {
   if (dataType === "string" || dataType === "number" || dataType === "boolean") {
     return dataType;
   }
+  if (dataType === "object") {
+    return Array.isArray(formData) ? "array" : "object";
+  }
   return "string";
 }
 function castToNewType(formData, newType) {
@@ -1006,20 +1024,13 @@ function FallbackField(props) {
     }
   };
   if (!globalFormOptions.useFallbackUiForUnsupportedType) {
+    const { reason = translateString(TranslatableString3.UnknownFieldType, [String(schema.type)]) } = props;
     const UnsupportedFieldTemplate = getTemplate2(
       "UnsupportedFieldTemplate",
       registry,
       uiOptions
     );
-    return /* @__PURE__ */ jsx3(
-      UnsupportedFieldTemplate,
-      {
-        schema,
-        fieldPathId,
-        reason: translateString(TranslatableString3.UnknownFieldType, [String(schema.type)]),
-        registry
-      }
-    );
+    return /* @__PURE__ */ jsx3(UnsupportedFieldTemplate, { schema, fieldPathId, reason, registry });
   }
   const FallbackFieldTemplate2 = getTemplate2(
     "FallbackFieldTemplate",
@@ -1050,7 +1061,17 @@ function FallbackField(props) {
         },
         formData ? hashObject2(formData) : "__empty__"
       ),
-      schemaField: /* @__PURE__ */ jsx3(SchemaField2, { ...props, schema: { type, title: translateString(TranslatableString3.Value) } })
+      schemaField: /* @__PURE__ */ jsx3(
+        SchemaField2,
+        {
+          ...props,
+          schema: {
+            type,
+            title: translateString(TranslatableString3.Value),
+            ...type === "object" && { additionalProperties: true }
+          }
+        }
+      )
     }
   );
 }
@@ -1890,7 +1911,6 @@ import {
   ANY_OF_KEY as ANY_OF_KEY4,
   getTemplate as getTemplate7,
   getUiOptions as getUiOptions8,
-  hashObject as hashObject5,
   isFormDataAvailable as isFormDataAvailable3,
   orderProperties,
   shouldRenderOptionalField as shouldRenderOptionalField3,
@@ -1906,7 +1926,12 @@ import get4 from "lodash/get";
 import has3 from "lodash/has";
 import isObject4 from "lodash/isObject";
 import set4 from "lodash/set";
-import unset from "lodash/unset";
+
+// src/components/constants.ts
+var ADDITIONAL_PROPERTY_KEY_REMOVE = Symbol("remove-this-key");
+var IS_RESET = Symbol("reset");
+
+// src/components/fields/ObjectField.tsx
 import { jsx as jsx9, jsxs } from "react/jsx-runtime";
 function isRequired(schema, name) {
   return Array.isArray(schema.required) && schema.required.indexOf(name) !== -1;
@@ -2031,7 +2056,6 @@ function ObjectField(props) {
   const schema = schemaUtils.retrieveSchema(rawSchema, formData, true);
   const uiOptions = getUiOptions8(uiSchema, globalUiOptions);
   const { properties: schemaProperties = {} } = schema;
-  const formDataHash = hashObject5(formData || {});
   const childFieldPathId = props.childFieldPathId ?? fieldPathId;
   const templateTitle = uiOptions.title ?? schema.title ?? title ?? name;
   const description = uiOptions.description ?? schema.description;
@@ -2104,11 +2128,9 @@ function ObjectField(props) {
   );
   const handleRemoveProperty = useCallback4(
     (key) => {
-      const copiedFormData = { ...formData };
-      unset(copiedFormData, key);
-      onChange(copiedFormData, childFieldPathId.path);
+      onChange(ADDITIONAL_PROPERTY_KEY_REMOVE, [...childFieldPathId.path, key]);
     },
-    [onChange, childFieldPathId, formData]
+    [onChange, childFieldPathId]
   );
   if (!renderOptionalField || hasFormData) {
     try {
@@ -2152,7 +2174,7 @@ function ObjectField(props) {
           readonly,
           hideError
         },
-        addedByAdditionalProperties ? `${name2}-${formDataHash}` : name2
+        name2
       );
       return {
         content,
@@ -3123,8 +3145,9 @@ function FieldTemplate(props) {
   if (hidden) {
     return /* @__PURE__ */ jsx27("div", { className: "hidden", children });
   }
+  const isCheckbox = uiOptions.widget === "checkbox";
   return /* @__PURE__ */ jsxs9(WrapIfAdditionalTemplate2, { ...props, children: [
-    displayLabel && /* @__PURE__ */ jsx27(Label, { label, required, id }),
+    displayLabel && !isCheckbox && /* @__PURE__ */ jsx27(Label, { label, required, id }),
     displayLabel && description ? description : null,
     children,
     errors,
@@ -3471,7 +3494,8 @@ import {
   descriptionId as descriptionId4,
   getTemplate as getTemplate17,
   labelValue,
-  schemaRequiresTrueValue
+  schemaRequiresTrueValue,
+  getUiOptions as getUiOptions19
 } from "@rjsf/utils";
 import { jsx as jsx39, jsxs as jsxs16 } from "react/jsx-runtime";
 function CheckboxWidget({
@@ -3509,7 +3533,9 @@ function CheckboxWidget({
     (event) => onFocus(id, event.target.checked),
     [onFocus, id]
   );
-  const description = options.description ?? schema.description;
+  const uiOptions = getUiOptions19(uiSchema);
+  const isCheckboxWidget = uiOptions.widget === "checkbox";
+  const description = isCheckboxWidget ? void 0 : options.description ?? schema.description;
   return /* @__PURE__ */ jsxs16("div", { className: `checkbox ${disabled || readonly ? "disabled" : ""}`, children: [
     !hideLabel && description && /* @__PURE__ */ jsx39(
       DescriptionFieldTemplate,
@@ -4167,7 +4193,6 @@ function getDefaultRegistry() {
 
 // src/components/Form.tsx
 import { jsx as jsx57, jsxs as jsxs23 } from "react/jsx-runtime";
-var IS_RESET = Symbol("reset");
 function toIChangeEvent(state, status) {
   return {
     ..._pick(state, ["schema", "uiSchema", "fieldPathId", "schemaUtils", "formData", "edit", "errors", "errorSchema"]),
@@ -4421,7 +4446,7 @@ var Form = class extends Component3 {
   /** Renders any errors contained in the `state` in using the `ErrorList`, if not disabled by `showErrorList`. */
   renderErrors(registry) {
     const { errors, errorSchema, schema, uiSchema } = this.state;
-    const options = getUiOptions19(uiSchema);
+    const options = getUiOptions20(uiSchema);
     const ErrorListTemplate = getTemplate28("ErrorListTemplate", registry, options);
     if (errors && errors.length) {
       return /* @__PURE__ */ jsx57(
@@ -4599,7 +4624,9 @@ var Form = class extends Component3 {
     let retrievedSchema = this.state.retrievedSchema;
     let formData = isRootPath ? newValue : _cloneDeep(oldFormData);
     if (isObject6(formData) || Array.isArray(formData)) {
-      if (!isRootPath) {
+      if (newValue === ADDITIONAL_PROPERTY_KEY_REMOVE) {
+        _unset(formData, path);
+      } else if (!isRootPath) {
         _set(formData, path, newValue);
       }
       const newState = this.getStateFromProps(this.props, formData, void 0, void 0, void 0, true);
@@ -4982,7 +5009,7 @@ var Form = class extends Component3 {
     const { SubmitButton: SubmitButton2 } = registry.templates.ButtonTemplates;
     const as = _internalFormWrapper ? tagName : void 0;
     const FormTag = _internalFormWrapper || tagName || "form";
-    let { [SUBMIT_BTN_OPTIONS_KEY]: submitOptions = {} } = getUiOptions19(uiSchema);
+    let { [SUBMIT_BTN_OPTIONS_KEY]: submitOptions = {} } = getUiOptions20(uiSchema);
     if (disabled) {
       submitOptions = { ...submitOptions, props: { ...submitOptions.props, disabled: true } };
     }