Support using SchemaField as documentation seems outdated

[billycrid]

Prerequisites

• [X] I have read the documentation

What theme are you using?

core

What is your question?

Hey,

I am currently trying to use SchemaField to overlay all of the field components that render in a form. I am looking to add some basic functionality like layout changes (using rows/columns to adjust how the fields align) and some changes to the way help text can render.

I am specifically looking at using SchemaField to achieve this as have read loads about it online, this seems the best suggested way. However, following the Docs i have created:

Form.tsx

export const FormV2 = ({ schema, uiSchema }: IFormV2 ) => {
  const log = (type: any) => console.log.bind(console, type);
  
  const fields = {
    TitleField: customComponents.TitleField,
    DescriptionField: customComponents.DescriptionField,
    layout: LayoutField
  }

  return <Form
      fields={fields}
      schema={schema}
      uiSchema={uiSchema}
      validator={validator}
      onChange={log('changed')}
      onSubmit={log('submitted')}
      onError={log('errors')}
    />
}

In my LayoutField.tsx file where this custom component is, i am using SchemaField similar to how it was once used in react-json-schema-layout: https://github.com/audibene-labs/react-jsonschema-form-layout/blob/master/src/index.js

I know this library is outdated, but the solution it solves for the layout is perfect for what i need, so im trying to adapt it to work with v5 of rjsf/core. The problems that i'm having is:

• when typing into a field, the onChange is triggered once but the value is not kept in the input field (so looks like i would need to manage the state seperate?), I am fine doing this for individual fields thats are referencing a custom component (for example a string using a custom component and that custom component onChange just returns a string), but using SchemaField would i now need to create a state object that houses every level of my formData? How will this work for deep objects. I am wondering if this is what onPropertyChange was once for? if so, how do i use this now?
• in previous versions we could do things like isRequired and onPropertyChange - are these no longer supported as i can no longer find any docs on them but i think this is what i require?

any support is much appreciated.

[heath-freenome]

@billycrid We would highly recommend avoiding customizing at the SchemaField level as that code is the work-horse of RJSF world. For layouts, you may best be served updating a template instead. Good candidate to look at is the ObjectFieldTemplate. and in the code that looks like:

      {properties.map((prop: ObjectFieldTemplatePropertyType) => prop.content)}

You could render a grid around the prop.content