json-schema-prepare-data-for-form

Enrich form data with sensible and provided defaults for editing in a HTML <form> and especially for react-json-schema-form.

Uses information from a JSON-Schema to prepare data for editing in a HTML form.

It takes a JSON Schema and generates a Template with the following properties:

• All string fields contain '' (via json-schema-empty-strings)
• All array fields contain [] (via json-schema-empty-arrays)
• It fills in the default values from the schema (via json-schema-default)

This then is merged with the data provided by the caller. Merging is done in a way expected by users for form data. Other deep merge implementations (e.g. [_.merge()](https://lodash.com/docs/4.17.15#merge)) handle Arrays as if they are tuples which leads to unexpected behavior:

    >>> _.merge({ l: [1, 2, 3, 4] }, { l: [4, 5, 6] })
    {
      "l": [
        4,
        5,
        6,
        4,
      ],
    }

The resulting array has duplicate elements and is longer than the provided data. With jsonSchemaDataMerge() the last array overwrites the provided data:

    >>> jsonSchemaDataMerge({ l: [1, 2, 3, 4] }, [{ l: [4, 5, 6] }]))
    {
      "l": [
        4,
        5,
        6,
      ],
    }

Prepare Data for editing in react-json-schema-form has some special requirements: During validation empty strings are validated against pattern. But for example "" is no valid E-Mail address. So empty strings musst be undefined during rjsf validation, to allow fields with empty strings to pass validation (unless the field is required).

See Issue 402, Issue 605 and retool Issue 4837.

import { prepareDataForForm, prepareDataForRjsf } from '../src/index'

const finalData = prepareDataForForm(schema, inputData)
// or
const finalDataForRjsf = prepareDataForRjsf(schema, inputData)

See the tests for additional demonstration on the merging issues.

See also:

• json-schema-empty-array
• json-schema-empty-strings
• json-schema-default
• react-json-schema-form
• graphql-clean-diff