Skip to content

Commit

Permalink
fix: improved chakra-ui docs to fix #2863
Browse files Browse the repository at this point in the history
- Updated `chakra-ui/uiSchema.md` to make it clear that the special `chakra` section of `ui:options` are on a per-field basis
- Updated `CHANGELOG.md` accordingly`
  • Loading branch information
heath-freenome committed Sep 19, 2022
1 parent 0f442c2 commit 872d281
Show file tree
Hide file tree
Showing 2 changed files with 10 additions and 7 deletions.
1 change: 1 addition & 0 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
Expand Up @@ -34,6 +34,7 @@ should change the heading of the (upcoming) version to include a major version b
- Updated the `custom-templates.md` file to add the missing asterisk to the new `FieldErrorTemplate` and `FieldHelpTemplate`
- Updated the playground to add a new button for programmatically validating a form
- Also updated the `validation.md` documentation to describe how to programmatically validate a form
- Fixed the `chakra-ui` custom `uiSchema` documentation to make it clear they work on a per-field basis, fixing (https://github.com/rjsf-team/react-jsonschema-form/issues/2865)

# 5.0.0-beta.8

Expand Down
16 changes: 9 additions & 7 deletions docs/api-reference/themes/chakra-ui/uiSchema.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,17 +4,19 @@ When using `@rjsf/chakra-ui` there are a couple of ways to customize the feel of

## Styling

You can use `ChakraProvider`, where you can customize the components at a theme level.\
You can use `ChakraProvider`, where you can customize the field components at a theme level.
And, `uiSchema` allows for the use of a `"chakra"` `"ui:option"` to customize the styling of the form widgets.

```json
{
"ui:options": {
"chakra": {
"p": "1rem",
"color": "blue.200",
"sx": {
"margin": "0 auto"
"yourField": {
"ui:options": {
"chakra": {
"p": "1rem",
"color": "blue.200",
"sx": {
"margin": "0 auto"
}
}
}
}
Expand Down

0 comments on commit 872d281

Please sign in to comment.