feat: Adds support for additional fields in UIOptions

[tdurnford]

Description

Adds the ability to add additional fields to the Adaptive Form. To add an additional field, developers only have to add a new property with the additionalField option set to true and a field override to the properties option in the UIOptions. The <ObjectField /> will recognize the new field and add it to the schema.

const uiOptions = {
  order: ['schemaField1', 'schemaField2', '*', 'additionalField']
  properties: {
    additionalField: {
      additionalField: true,
      field: () => <div>Additional Field</div>,
    }
  }
}

Order

Additional fields can be included in the UI Option order override by adding the additional field's name to the order array. Note, the additional field's name can not exist as a property name in the schema.

const uiOptions = {
  order: ['schemaField1', 'schemaField2', '*', 'additionalField']
  properties: {
    additionalField: {
      additionalField: true,
      field: () => <div>Additional Field</div>,
    }
  }
}

Field sets

Additional fields can also be included in field sets by adding the additional field's name to the fields array in the field set.

const uiOptions = {
  fieldset: [{ titile: 'field set 1', fields: ['schema field 1', 'additionalField', '*' }],
  properties: {
    additionalField: {
      additionalField: true,
      field: () => <div>Additional Field</div>,
    }
  }
}

Task Item

Closes #4208

[coveralls]

Coverage increased (+0.05%) to 55.759% when pulling d7b1aca on tdurnford:feature/additional-fields into b0f2fd8 on microsoft:main.

[a-b-r-o-w-n]

This isn't directly related to this PR, but I'm curious how fieldsets and order work together?

[a-b-r-o-w-n]

I think that when processing ui options, we take additionalFields and merge that into the schema and ui options so that

{
  SomeKind: {
    additionalFields: [{ name: 'newField', field: SomeFieldWidget, description: 'some description' }]
  }
}

becomes

// schema
{
  SomeKind: {
    properties: {
      // ... other properties
      newField: { type: 'string' }
    }
  }
}

// ui options
{
  SomeKind: {
    properties: {
      newField: {
        description: 'some description'
      }
    }
  }
}

I'm not sure about modifying the schema, but I think this approach would work nicely with the ui options. What do you think?

[tdurnford]

This isn't directly related to this PR, but I'm curious how fieldsets and order work together?

Currently, the the ui order take priority over the order provided in the fieldset. Not sure if I like that behavior. Thoughts?

[a-b-r-o-w-n]

Just one suggestion.