diff --git a/CHANGELOG.md b/CHANGELOG.md index 9a3eaee7aa..340b60ea4d 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -18,28 +18,56 @@ should change the heading of the (upcoming) version to include a major version b # 5.0.0-beta.11 ## @rjsf/antd -- Updated `FieldTemplate` to no longer render additional, unnecessary white space for fields that have empty `help` and `extra` information, fixing [#3147](https://github.com/rjsf-team/react-jsonschema-form/issues/3174) +- Updated `FieldTemplate` to no longer render additional, unnecessary white space for fields that have empty `help` and `extra` information, fixing [#3147](https://github.com/rjsf-team/react-jsonschema-form/issues/3174) +- Updated `ArrayFieldTemplate` to always render `ArrayFieldDescriptionTemplate` since that template deals with the optional `description` +- Pass the `schema` into the `ArrayFieldDescriptionTemplate`, `ArrayFieldTitleTemplate`, `DescriptionFieldTemplate` and `TitleFieldTemplate`, fixing [#3176](https://github.com/rjsf-team/react-jsonschema-form/issues/3176) ## @rjsf/bootstrap-4 - Make label generation consistent with other themes by refactoring the code into the `FieldTemplate` instead of having the widgets implementing the label, fixing [#2007](https://github.com/rjsf-team/react-jsonschema-form/issues/2007) +- Updated `ArrayFieldTemplate` to always render `ArrayFieldDescriptionTemplate` since that template deals with the optional `description` +- Pass the `schema` into the `ArrayFieldDescriptionTemplate`, `ArrayFieldTitleTemplate`, `DescriptionFieldTemplate` and `TitleFieldTemplate`, fixing [#3176](https://github.com/rjsf-team/react-jsonschema-form/issues/3176) ## @rjsf/chakra-ui - Added support for `chakra-react-select` v4, fixing [#3152](https://github.com/rjsf-team/react-jsonschema-form/issues/3152) - In `SelectWidget` use `Select` from `chakra-react-select` for both single- and multiple-choice select - In `SelectWidget` multiple-choice select display label rather than value for selected items +- Updated `ArrayFieldTemplate` to always render `ArrayFieldDescriptionTemplate` since that template deals with the optional `description` +- Pass the `schema` into the `ArrayFieldDescriptionTemplate`, `ArrayFieldTitleTemplate`, `DescriptionFieldTemplate` and `TitleFieldTemplate`, fixing [#3176](https://github.com/rjsf-team/react-jsonschema-form/issues/3176) ## @rjsf/core - Extended `Form.onChange` to optionally return the `id` of the field that caused the change, fixing [#2768](https://github.com/rjsf-team/react-jsonschema-form/issues/2768) - Fixed a regression in earlier v5 beta versions where additional properties could not be added when `additionalProperties` was `true` ([#3719](https://github.com/rjsf-team/react-jsonschema-form/pull/3719)). - Fixed a regression in v5 beta version where BooleanField was altering readonly props ([#3188](https://github.com/rjsf-team/react-jsonschema-form/pull/3188). -- +- Updated `ArrayFieldDescriptionTemplate` and `ArrayFieldTitleTemplate` to not render content when `ui:label` is false, fixing [#2535](https://github.com/rjsf-team/react-jsonschema-form/issues/2535) +- Updated `ArrayFieldTemplate` to always render `ArrayFieldDescriptionTemplate` since that template deals with the optional `description` +- Pass the `schema` into the `ArrayFieldDescriptionTemplate`, `ArrayFieldTitleTemplate`, `DescriptionFieldTemplate` and `TitleFieldTemplate`, fixing [#3176](https://github.com/rjsf-team/react-jsonschema-form/issues/3176) + +## @rjsf/fluent-ui +- Updated `ArrayFieldTemplate` to always render `ArrayFieldDescriptionTemplate` since that template deals with the optional `description` +- Pass the `schema` into the `ArrayFieldDescriptionTemplate`, `ArrayFieldTitleTemplate`, `DescriptionFieldTemplate` and `TitleFieldTemplate`, fixing [#3176](https://github.com/rjsf-team/react-jsonschema-form/issues/3176) + +## @rjsf/material-ui +- Updated `ArrayFieldTemplate` to always render `ArrayFieldDescriptionTemplate` since that template deals with the optional `description` +- Pass the `schema` into the `ArrayFieldDescriptionTemplate`, `ArrayFieldTitleTemplate`, `DescriptionFieldTemplate` and `TitleFieldTemplate`, fixing [#3176](https://github.com/rjsf-team/react-jsonschema-form/issues/3176) + +## @rjsf/mui +- Updated `ArrayFieldTemplate` to always render `ArrayFieldDescriptionTemplate` since that template deals with the optional `description` +- Pass the `schema` into the `ArrayFieldDescriptionTemplate`, `ArrayFieldTitleTemplate`, `DescriptionFieldTemplate` and `TitleFieldTemplate`, fixing [#3176](https://github.com/rjsf-team/react-jsonschema-form/issues/3176) + +## @rjsf/semantic-ui +- Updated `ArrayFieldTemplate` to always render `ArrayFieldDescriptionTemplate` since that template deals with the optional `description` +- Pass the `schema` into the `ArrayFieldDescriptionTemplate`, `ArrayFieldTitleTemplate`, `DescriptionFieldTemplate` and `TitleFieldTemplate`, fixing [#3176](https://github.com/rjsf-team/react-jsonschema-form/issues/3176) + ## @rjsf/utils - Updated the `onChange` prop on `FieldProps` and `FieldTemplateProps` to add an optional `id` parameter to the callback. +- Updated the `DescriptionFieldProps` and `TitleFieldProps` to add a new required `schema` prop. Also updated the `ArrayFieldDescriptionTemplate` and `ArrayFieldTitleTemplate` to make `description` and `title` optional while pulling all the other props but `id` from the associated type. ## Dev / docs / playground - Added an error boundary to prevent the entire app from crashing when an error is thrown by Form. See [#3164](https://github.com/rjsf-team/react-jsonschema-form/pull/3164) for closed issues. - Updated the playground to log the `id` of the field being changed on the `onChange` handler -- Updated `form-props.md` file to describe the new `id` parameter being returned by the `Form.onChange` handler +- Updated `form-props.md` to describe the new `id` parameter being returned by the `Form.onChange` handler +- Updated `custom-templates.md` to add the new `schema` prop to the `ArrayFieldDescriptionTemplate`, `ArrayFieldTitleTemplate`, `DescriptionFieldTemplate` and `TitleFieldTemplate` documentation +- Updated the `contributing.md` to describe setting up the `husky` precommit hooks for the first time `git clone` of the repo; Also added guidance for developing on underpowered computers; Finally discussed code-coverage requirements for some packages. # 5.0.0-beta.10 diff --git a/docs/advanced-customization/custom-templates.md b/docs/advanced-customization/custom-templates.md index d31506c18e..0dd953529d 100644 --- a/docs/advanced-customization/custom-templates.md +++ b/docs/advanced-customization/custom-templates.md @@ -169,6 +169,7 @@ The following props are passed to each `ArrayFieldDescriptionTemplate`: - `description`: The description of the array field being rendered. - `idSchema`: The idSchema of the array field in the hierarchy. +- `schema`: The schema object for this array field. - `uiSchema`: The uiSchema object for this array field. - `registry`: The `registry` object. @@ -264,6 +265,7 @@ The following props are passed to each `ArrayFieldTitleTemplate`: - `title`: The title of the array field being rendered. - `idSchema`: The idSchema of the array field in the hierarchy. +- `schema`: The schema object for this array field. - `uiSchema`: The uiSchema object for this array field. - `required`: A boolean value stating if the field is required - `registry`: The `registry` object. @@ -405,6 +407,8 @@ The following props are passed to the `DescriptionFieldTemplate`: - `description`: The description of the field being rendered. - `id`: The id of the field in the hierarchy. +- `schema`: The schema object for the field. +- `uiSchema`: The uiSchema object for the field. - `registry`: The `registry` object. ## ErrorListTemplate @@ -709,7 +713,8 @@ The following props are passed to each `TitleFieldTemplate`: - `id`: The id of the field in the hierarchy. - `title`: The title of the field being rendered. -- `uiSchema`: The uiSchema object for this field. +- `schema`: The schema object for the field. +- `uiSchema`: The uiSchema object for the field. - `required`: A boolean value stating if the field is required - `registry`: The `registry` object. diff --git a/docs/contributing.md b/docs/contributing.md index 14511eba78..4d4e508301 100644 --- a/docs/contributing.md +++ b/docs/contributing.md @@ -12,13 +12,24 @@ npm start All packages will be live-built, and a live development server showcasing components with hot reload enabled will then run at [localhost:8080](http://localhost:8080). +### First time step + +If this is the first time you have cloned the repo, run the `npm run prepare` script that will set up `husky` to provide a git precommit hook that will format and lint any code you have added to a PR. + +### Optional development process +With the large number of packages, sometimes running `npm run build` or `npm start` from the root directory will overwhelm an underpowered computer. +If that is the situation for you, you can instead use `npm run build-serial` to build the packages one at a time instead of all at once. +Also, if you are only working on one package, you can `npm run build` and `npm run test` from within the subdirectory. +Finally, you can simply `npm start` inside of the `playground` directory to test changes if you have already built all of your packages, without needing to watch all of the packages via the root directory `npm start`. + ## Cloud builds When building in environments with limited memory, such as Netlify, it's recommended to use `npm run build-serial` that builds the packages serially. ## Coding style -All the JavaScript code in this project conforms to the [prettier](https://github.com/prettier/prettier) coding style. Code is automatically prettified upon commit using precommit hooks. +All the JavaScript/Typescript code in this project conforms to the [prettier](https://github.com/prettier/prettier) coding style. +Code is automatically prettified upon commit using precommit hooks, assuming you followed the `First time step` above. ## Documentation @@ -39,9 +50,14 @@ npm test ### Code coverage -Code coverage reports are currently available only for the `@rjsf/core` package. They are generated using [nyc](https://github.com/istanbuljs/nyc) each time the `npm test-coverage` script is run. +Code coverage reports are currently available only for the `@rjsf/core` theme package. +They are generated using [nyc](https://github.com/istanbuljs/nyc) each time the `npm test-coverage` script is run. The full report can be seen by opening `./coverage/lcov-report/index.html`. +#### Utils and validator-ajvX code coverage + +100% code coverage is required by the `@rjsf/utils` and `@rjsf/validator-ajv6` and `@rjsf/validator-ajv8` tests. +If you make changes to those libraries, you will have to maintain that coverage, otherwise the tests will fail. ## Releasing diff --git a/packages/antd/src/templates/ArrayFieldTemplate/index.tsx b/packages/antd/src/templates/ArrayFieldTemplate/index.tsx index b4320047da..e20937d35b 100644 --- a/packages/antd/src/templates/ArrayFieldTemplate/index.tsx +++ b/packages/antd/src/templates/ArrayFieldTemplate/index.tsx @@ -72,23 +72,23 @@ const ArrayFieldTemplate = ({ idSchema={idSchema} required={required} title={uiOptions.title || title} + schema={schema} uiSchema={uiSchema} registry={registry} /> )} - {(uiOptions.description || schema.description) && ( )} - {items && items.map(({ key, ...itemProps }) => ( diff --git a/packages/antd/src/templates/ObjectFieldTemplate/index.tsx b/packages/antd/src/templates/ObjectFieldTemplate/index.tsx index 5e1d15fc5d..75d11d0cd0 100644 --- a/packages/antd/src/templates/ObjectFieldTemplate/index.tsx +++ b/packages/antd/src/templates/ObjectFieldTemplate/index.tsx @@ -122,6 +122,7 @@ const ObjectFieldTemplate = ({ id={`${idSchema.$id}-title`} required={required} title={uiOptions.title || title} + schema={schema} uiSchema={uiSchema} registry={registry} /> @@ -132,6 +133,8 @@ const ObjectFieldTemplate = ({ diff --git a/packages/bootstrap-4/src/ArrayFieldTemplate/ArrayFieldTemplate.tsx b/packages/bootstrap-4/src/ArrayFieldTemplate/ArrayFieldTemplate.tsx index e32f73f17e..01d2575e40 100644 --- a/packages/bootstrap-4/src/ArrayFieldTemplate/ArrayFieldTemplate.tsx +++ b/packages/bootstrap-4/src/ArrayFieldTemplate/ArrayFieldTemplate.tsx @@ -51,18 +51,18 @@ const ArrayFieldTemplate = (props: ArrayFieldTemplateProps) => { - {(uiOptions.description || schema.description) && ( - - )} + )} {(uiOptions.description || description) && ( )} diff --git a/packages/bootstrap-4/test/DescriptionField.test.tsx b/packages/bootstrap-4/test/DescriptionField.test.tsx deleted file mode 100644 index 4afd847eab..0000000000 --- a/packages/bootstrap-4/test/DescriptionField.test.tsx +++ /dev/null @@ -1,31 +0,0 @@ -import React from "react"; -import renderer from "react-test-renderer"; - -import DescriptionField from "../src/DescriptionField"; -import { mockRegistry } from "./helpers/createMocks"; - -const registry = mockRegistry(); - -describe("DescriptionField", () => { - test("should return null when no description as a props is passed", () => { - const tree = renderer - .create( - - ) - .toJSON(); - expect(tree).toBe(null); - }); - - test("should return h2 element when description is being passed as props", () => { - const tree = renderer - .create( - - ) - .toJSON(); - expect(tree).toMatchSnapshot(); - }); -}); diff --git a/packages/bootstrap-4/test/TitleField.test.tsx b/packages/bootstrap-4/test/TitleField.test.tsx deleted file mode 100644 index 7c78f61569..0000000000 --- a/packages/bootstrap-4/test/TitleField.test.tsx +++ /dev/null @@ -1,15 +0,0 @@ -import React from "react"; -import renderer from "react-test-renderer"; - -import TitleField from "../src/TitleField"; -import { mockRegistry } from "./helpers/createMocks"; - -describe("TitleField", () => { - test("simple", () => { - const registry = mockRegistry(); - const tree = renderer - .create() - .toJSON(); - expect(tree).toMatchSnapshot(); - }); -}); diff --git a/packages/bootstrap-4/test/__snapshots__/DescriptionField.test.tsx.snap b/packages/bootstrap-4/test/__snapshots__/DescriptionField.test.tsx.snap deleted file mode 100644 index 49ced45c1c..0000000000 --- a/packages/bootstrap-4/test/__snapshots__/DescriptionField.test.tsx.snap +++ /dev/null @@ -1,12 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`DescriptionField should return h2 element when description is being passed as props 1`] = ` -
-
- SOME THING -
-
-`; diff --git a/packages/bootstrap-4/test/__snapshots__/TitleField.test.tsx.snap b/packages/bootstrap-4/test/__snapshots__/TitleField.test.tsx.snap deleted file mode 100644 index cfa165e0eb..0000000000 --- a/packages/bootstrap-4/test/__snapshots__/TitleField.test.tsx.snap +++ /dev/null @@ -1,20 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`TitleField simple 1`] = ` -
-
- Hello -
-
-
-`; diff --git a/packages/chakra-ui/src/ArrayFieldTemplate/ArrayFieldTemplate.tsx b/packages/chakra-ui/src/ArrayFieldTemplate/ArrayFieldTemplate.tsx index a75c53dca7..337dfcaee6 100644 --- a/packages/chakra-ui/src/ArrayFieldTemplate/ArrayFieldTemplate.tsx +++ b/packages/chakra-ui/src/ArrayFieldTemplate/ArrayFieldTemplate.tsx @@ -47,18 +47,18 @@ const ArrayFieldTemplate = (props: ArrayFieldTemplateProps) => { - {(uiOptions.description || schema.description) && ( - - )} + {items.length > 0 && diff --git a/packages/chakra-ui/src/ObjectFieldTemplate/ObjectFieldTemplate.tsx b/packages/chakra-ui/src/ObjectFieldTemplate/ObjectFieldTemplate.tsx index cb4a3c693e..66ac5a3e03 100644 --- a/packages/chakra-ui/src/ObjectFieldTemplate/ObjectFieldTemplate.tsx +++ b/packages/chakra-ui/src/ObjectFieldTemplate/ObjectFieldTemplate.tsx @@ -45,6 +45,7 @@ const ObjectFieldTemplate = (props: ObjectFieldTemplateProps) => { id={`${idSchema.$id}-title`} title={uiOptions.title || title} required={required} + schema={schema} uiSchema={uiSchema} registry={registry} /> @@ -53,6 +54,8 @@ const ObjectFieldTemplate = (props: ObjectFieldTemplateProps) => { )} diff --git a/packages/core/src/components/fields/SchemaField.tsx b/packages/core/src/components/fields/SchemaField.tsx index d73b9b5e60..923bbbf902 100644 --- a/packages/core/src/components/fields/SchemaField.tsx +++ b/packages/core/src/components/fields/SchemaField.tsx @@ -264,6 +264,8 @@ function SchemaFieldRender(props: FieldProps) { ), diff --git a/packages/core/src/components/templates/ArrayFieldDescriptionTemplate.tsx b/packages/core/src/components/templates/ArrayFieldDescriptionTemplate.tsx index 509031952c..43b1098e4a 100644 --- a/packages/core/src/components/templates/ArrayFieldDescriptionTemplate.tsx +++ b/packages/core/src/components/templates/ArrayFieldDescriptionTemplate.tsx @@ -13,11 +13,12 @@ import { export default function ArrayFieldDescriptionTemplate( props: ArrayFieldDescriptionProps ) { - const { idSchema, description, registry, uiSchema } = props; - if (!description) { + const { idSchema, description, registry, schema, uiSchema } = props; + const options = getUiOptions(uiSchema); + const { label: displayLabel = true } = options; + if (!description || !displayLabel) { return null; } - const options = getUiOptions(uiSchema); const DescriptionFieldTemplate = getTemplate< "DescriptionFieldTemplate", T, @@ -28,6 +29,8 @@ export default function ArrayFieldDescriptionTemplate( ); diff --git a/packages/core/src/components/templates/ArrayFieldTemplate.tsx b/packages/core/src/components/templates/ArrayFieldTemplate.tsx index 464327e457..f9a6bf5b75 100644 --- a/packages/core/src/components/templates/ArrayFieldTemplate.tsx +++ b/packages/core/src/components/templates/ArrayFieldTemplate.tsx @@ -53,17 +53,17 @@ export default function ArrayFieldTemplate( idSchema={idSchema} title={uiOptions.title || title} required={required} + schema={schema} + uiSchema={uiSchema} + registry={registry} + /> + - {(uiOptions.description || schema.description) && ( - - )}
{items && items.map(({ key, ...itemProps }: ArrayFieldTemplateItemType) => ( diff --git a/packages/core/src/components/templates/ArrayFieldTitleTemplate.tsx b/packages/core/src/components/templates/ArrayFieldTitleTemplate.tsx index 20024bf7a1..490a55d3fe 100644 --- a/packages/core/src/components/templates/ArrayFieldTitleTemplate.tsx +++ b/packages/core/src/components/templates/ArrayFieldTitleTemplate.tsx @@ -14,11 +14,12 @@ import { export default function ArrayFieldTitleTemplate( props: ArrayFieldTitleProps ) { - const { idSchema, title, uiSchema, required, registry } = props; - if (!title) { + const { idSchema, title, schema, uiSchema, required, registry } = props; + const options = getUiOptions(uiSchema); + const { label: displayLabel = true } = options; + if (!title || !displayLabel) { return null; } - const options = getUiOptions(uiSchema); const TitleFieldTemplate: TemplatesType["TitleFieldTemplate"] = getTemplate<"TitleFieldTemplate", T, F>( "TitleFieldTemplate", @@ -31,6 +32,7 @@ export default function ArrayFieldTitleTemplate( id={id} title={title} required={required} + schema={schema} uiSchema={uiSchema} registry={registry} /> diff --git a/packages/core/src/components/templates/ObjectFieldTemplate.tsx b/packages/core/src/components/templates/ObjectFieldTemplate.tsx index 9404b602eb..45bd936ad9 100644 --- a/packages/core/src/components/templates/ObjectFieldTemplate.tsx +++ b/packages/core/src/components/templates/ObjectFieldTemplate.tsx @@ -52,6 +52,7 @@ export default function ObjectFieldTemplate( id={`${idSchema.$id}__title`} title={options.title || title} required={required} + schema={schema} uiSchema={uiSchema} registry={registry} /> @@ -60,6 +61,8 @@ export default function ObjectFieldTemplate( )} diff --git a/packages/core/src/components/widgets/CheckboxWidget.tsx b/packages/core/src/components/widgets/CheckboxWidget.tsx index 9397bca1a1..38123db344 100644 --- a/packages/core/src/components/widgets/CheckboxWidget.tsx +++ b/packages/core/src/components/widgets/CheckboxWidget.tsx @@ -8,6 +8,7 @@ import { getTemplate, schemaRequiresTrueValue, WidgetProps } from "@rjsf/utils"; */ function CheckboxWidget({ schema, + uiSchema, options, id, value, @@ -54,6 +55,8 @@ function CheckboxWidget({ )} diff --git a/packages/core/test/ArrayField_test.js b/packages/core/test/ArrayField_test.js index 4942fc06ba..efdb1c6d12 100644 --- a/packages/core/test/ArrayField_test.js +++ b/packages/core/test/ArrayField_test.js @@ -221,6 +221,17 @@ describe("ArrayField", () => { expect(description.id).eql("root__description"); }); + it("should not render a description when label is false", () => { + const { node } = createFormComponent({ + schema, + uiSchema: { "ui:label": false }, + }); + + const description = node.querySelector("fieldset > .field-description"); + + expect(description).eql(null); + }); + it("should render a hidden list", () => { const { node } = createFormComponent({ schema, @@ -2122,6 +2133,20 @@ describe("ArrayField", () => { const { node } = createFormComponent({ schema, templates }); expect(node.querySelector("#title-")).to.be.null; }); + + it("should not render a TitleFieldTemplate when label is false", () => { + const schema = { + type: "array", + title: "test", + items: {}, + }; + const { node } = createFormComponent({ + schema, + templates, + uiSchema: { "ui:label": false }, + }); + expect(node.querySelector("#title-test")).to.be.null; + }); }); describe("should handle nested idPrefix and idSeparator parameter", () => { diff --git a/packages/fluent-ui/src/ArrayFieldTemplate/ArrayFieldTemplate.tsx b/packages/fluent-ui/src/ArrayFieldTemplate/ArrayFieldTemplate.tsx index 473d3b63ed..4512db01ef 100644 --- a/packages/fluent-ui/src/ArrayFieldTemplate/ArrayFieldTemplate.tsx +++ b/packages/fluent-ui/src/ArrayFieldTemplate/ArrayFieldTemplate.tsx @@ -50,18 +50,18 @@ const ArrayFieldTemplate = (props: ArrayFieldTemplateProps) => { - {(uiOptions.description || schema.description) && ( - - )} + {items.length > 0 && items.map(({ key, ...itemProps }: ArrayFieldTemplateItemType) => ( diff --git a/packages/fluent-ui/src/ObjectFieldTemplate/ObjectFieldTemplate.tsx b/packages/fluent-ui/src/ObjectFieldTemplate/ObjectFieldTemplate.tsx index 52e31f4032..2dc176cd21 100644 --- a/packages/fluent-ui/src/ObjectFieldTemplate/ObjectFieldTemplate.tsx +++ b/packages/fluent-ui/src/ObjectFieldTemplate/ObjectFieldTemplate.tsx @@ -10,6 +10,7 @@ const ObjectFieldTemplate = ({ title, properties, required, + schema, uiSchema, idSchema, registry, @@ -32,6 +33,7 @@ const ObjectFieldTemplate = ({ id={`${idSchema.$id}-title`} title={title} required={required} + schema={schema} uiSchema={uiSchema} registry={registry} /> @@ -39,6 +41,8 @@ const ObjectFieldTemplate = ({ {(uiOptions.description || description) && ( diff --git a/packages/material-ui/src/ArrayFieldTemplate/ArrayFieldTemplate.tsx b/packages/material-ui/src/ArrayFieldTemplate/ArrayFieldTemplate.tsx index c2a00be75b..28d90435a5 100644 --- a/packages/material-ui/src/ArrayFieldTemplate/ArrayFieldTemplate.tsx +++ b/packages/material-ui/src/ArrayFieldTemplate/ArrayFieldTemplate.tsx @@ -50,18 +50,18 @@ const ArrayFieldTemplate = (props: ArrayFieldTemplateProps) => { - {(uiOptions.description || schema.description) && ( - - )} + {items && items.map(({ key, ...itemProps }: ArrayFieldTemplateItemType) => ( diff --git a/packages/material-ui/src/ObjectFieldTemplate/ObjectFieldTemplate.tsx b/packages/material-ui/src/ObjectFieldTemplate/ObjectFieldTemplate.tsx index 92637a168f..500b7f2799 100644 --- a/packages/material-ui/src/ObjectFieldTemplate/ObjectFieldTemplate.tsx +++ b/packages/material-ui/src/ObjectFieldTemplate/ObjectFieldTemplate.tsx @@ -43,6 +43,7 @@ const ObjectFieldTemplate = ({ id={`${idSchema.$id}-title`} title={title} required={required} + schema={schema} uiSchema={uiSchema} registry={registry} /> @@ -51,6 +52,8 @@ const ObjectFieldTemplate = ({ )} diff --git a/packages/mui/src/ArrayFieldTemplate/ArrayFieldTemplate.tsx b/packages/mui/src/ArrayFieldTemplate/ArrayFieldTemplate.tsx index 277b9b94be..321b0abea6 100644 --- a/packages/mui/src/ArrayFieldTemplate/ArrayFieldTemplate.tsx +++ b/packages/mui/src/ArrayFieldTemplate/ArrayFieldTemplate.tsx @@ -50,18 +50,18 @@ const ArrayFieldTemplate = (props: ArrayFieldTemplateProps) => { - {(uiOptions.description || schema.description) && ( - - )} + {items && items.map(({ key, ...itemProps }: ArrayFieldTemplateItemType) => ( diff --git a/packages/mui/src/ObjectFieldTemplate/ObjectFieldTemplate.tsx b/packages/mui/src/ObjectFieldTemplate/ObjectFieldTemplate.tsx index 2d6a574d16..c32b4b4985 100644 --- a/packages/mui/src/ObjectFieldTemplate/ObjectFieldTemplate.tsx +++ b/packages/mui/src/ObjectFieldTemplate/ObjectFieldTemplate.tsx @@ -43,6 +43,7 @@ const ObjectFieldTemplate = ({ id={`${idSchema.$id}-title`} title={title} required={required} + schema={schema} uiSchema={uiSchema} registry={registry} /> @@ -51,6 +52,8 @@ const ObjectFieldTemplate = ({ )} diff --git a/packages/semantic-ui/src/ArrayFieldTemplate/ArrayFieldTemplate.tsx b/packages/semantic-ui/src/ArrayFieldTemplate/ArrayFieldTemplate.tsx index 01f31d3642..58f20fec42 100644 --- a/packages/semantic-ui/src/ArrayFieldTemplate/ArrayFieldTemplate.tsx +++ b/packages/semantic-ui/src/ArrayFieldTemplate/ArrayFieldTemplate.tsx @@ -54,8 +54,6 @@ function ArrayFieldTemplate({ const { ButtonTemplates: { AddButton }, } = registry.templates; - const fieldTitle = uiOptions.title || title; - const fieldDescription = uiOptions.description || schema.description; return (
- {fieldDescription && ( - - )} +
{items && diff --git a/packages/semantic-ui/src/CheckboxesWidget/CheckboxesWidget.tsx b/packages/semantic-ui/src/CheckboxesWidget/CheckboxesWidget.tsx index cf949c8139..b6de9f924a 100644 --- a/packages/semantic-ui/src/CheckboxesWidget/CheckboxesWidget.tsx +++ b/packages/semantic-ui/src/CheckboxesWidget/CheckboxesWidget.tsx @@ -72,6 +72,7 @@ function CheckboxesWidget(props: WidgetProps) { diff --git a/packages/semantic-ui/src/FieldTemplate/FieldTemplate.tsx b/packages/semantic-ui/src/FieldTemplate/FieldTemplate.tsx index 8ca1ff4680..cd31ae33a0 100644 --- a/packages/semantic-ui/src/FieldTemplate/FieldTemplate.tsx +++ b/packages/semantic-ui/src/FieldTemplate/FieldTemplate.tsx @@ -14,6 +14,7 @@ function FieldTemplate({ hidden, rawDescription, registry, + schema, uiSchema, ...props }: FieldTemplateProps) { @@ -41,6 +42,7 @@ function FieldTemplate({ id={id} label={label} registry={registry} + schema={schema} uiSchema={uiSchema} {...props} > @@ -53,6 +55,8 @@ function FieldTemplate({ )} diff --git a/packages/semantic-ui/src/ObjectFieldTemplate/ObjectFieldTemplate.tsx b/packages/semantic-ui/src/ObjectFieldTemplate/ObjectFieldTemplate.tsx index 3d3277e82b..cdf7e068cb 100644 --- a/packages/semantic-ui/src/ObjectFieldTemplate/ObjectFieldTemplate.tsx +++ b/packages/semantic-ui/src/ObjectFieldTemplate/ObjectFieldTemplate.tsx @@ -41,6 +41,7 @@ function ObjectFieldTemplate({ id={`${idSchema.$id}-title`} title={fieldTitle} required={required} + schema={schema} uiSchema={uiSchema} registry={registry} /> @@ -49,6 +50,8 @@ function ObjectFieldTemplate({ )} diff --git a/packages/utils/src/types.ts b/packages/utils/src/types.ts index cf32782558..16c99893f4 100644 --- a/packages/utils/src/types.ts +++ b/packages/utils/src/types.ts @@ -384,6 +384,8 @@ export type TitleFieldProps = { id: string; /** The title for the field being rendered */ title: string; + /** The schema object for the field being titled */ + schema: RJSFSchema; /** The uiSchema object for this title field */ uiSchema?: UiSchema; /** A boolean value stating if the field is required */ @@ -396,6 +398,10 @@ export type TitleFieldProps = { export type DescriptionFieldProps = { /** The id of the field description in the hierarchy */ id: string; + /** The schema object for the field being described */ + schema: RJSFSchema; + /** The uiSchema object for this description field */ + uiSchema?: UiSchema; /** The description of the field being rendered */ description: string | React.ReactElement; /** The `registry` object */ @@ -403,23 +409,25 @@ export type DescriptionFieldProps = { }; /** The properties that are passed to a `ArrayFieldTitleTemplate` implementation */ -export type ArrayFieldTitleProps = Pick< +export type ArrayFieldTitleProps = Omit< TitleFieldProps, - "title" | "uiSchema" | "required" | "registry" + "id" | "title" > & { + /** The title for the field being rendered */ + title?: string; /** The idSchema of the field in the hierarchy */ idSchema: IdSchema; }; /** The properties that are passed to a `ArrayFieldDescriptionTemplate` implementation */ -export type ArrayFieldDescriptionProps = Pick< +export type ArrayFieldDescriptionProps = Omit< DescriptionFieldProps, - "description" | "registry" + "id" | "description" > & { + /** The description of the field being rendered */ + description?: string | React.ReactElement; /** The idSchema of the field in the hierarchy */ idSchema: IdSchema; - /** The uiSchema object for this description field */ - uiSchema?: UiSchema; }; /** The properties of each element in the ArrayFieldTemplateProps.items array */