diff --git a/CHANGELOG.md b/CHANGELOG.md index a265fe59ea..0299113013 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -34,6 +34,7 @@ should change the heading of the (upcoming) version to include a major version b - Fix case where NumberField would not properly reset the field when using programmatic form reset (#4202)[https://github.com/rjsf-team/react-jsonschema-form/issues/4202] - Updated widgets to handle undefined `target` in `onFocus` and `onBlur` handlers +- Fix field disable or readonly property can't cover globalOptions corresponding property (#4212)[https://github.com/rjsf-team/react-jsonschema-form/pull/4212] ## @rfsf/fluent-ui @@ -55,7 +56,6 @@ should change the heading of the (upcoming) version to include a major version b - Updated widgets to handle undefined `target` in `onFocus` and `onBlur` handlers - ## @rjsf/validator-ajv6 - Improved performance issues with large schema dependencies and oneOf conditions [#4203](https://github.com/rjsf-team/react-jsonschema-form/issues/4203). @@ -95,6 +95,7 @@ should change the heading of the (upcoming) version to include a major version b # 5.18.0 ## @rjsf/antd + - Fix issue where the theme provided by the ConfigProvider under antd v5 wasn't respected thereby rendering the form items unusable under dark themes [#4129](https://github.com/rjsf-team/react-jsonschema-form/issues/4129) ## @rjsf/core @@ -133,7 +134,7 @@ should change the heading of the (upcoming) version to include a major version b ## Dev / docs / playground -- [#4080](https://github.com/rjsf-team/react-jsonschema-form/issues/4080) - Moved the `base64` encoder/decoder object to the Playground package. +- [#4080](https://github.com/rjsf-team/react-jsonschema-form/issues/4080) - Moved the `base64` encoder/decoder object to the Playground package. - Added test configuration and script to the Playground. # 5.17.0 diff --git a/packages/core/src/components/Form.tsx b/packages/core/src/components/Form.tsx index f77849207b..b5e6d46bb2 100644 --- a/packages/core/src/components/Form.tsx +++ b/packages/core/src/components/Form.tsx @@ -877,8 +877,8 @@ export default class Form< acceptcharset, acceptCharset, noHtml5Validate = false, - disabled = false, - readonly = false, + disabled, + readonly, formContext, showErrorList = 'top', _internalFormWrapper, diff --git a/packages/core/src/components/fields/ObjectField.tsx b/packages/core/src/components/fields/ObjectField.tsx index dfde7fe1c3..eb4e1d4d99 100644 --- a/packages/core/src/components/fields/ObjectField.tsx +++ b/packages/core/src/components/fields/ObjectField.tsx @@ -236,8 +236,8 @@ class ObjectField(schema, uiOptions, idSchema, registry); - const disabled = Boolean(props.disabled || uiOptions.disabled); - const readonly = Boolean(props.readonly || uiOptions.readonly || props.schema.readOnly || schema.readOnly); + const disabled = Boolean(uiOptions.disabled ?? props.disabled); + const readonly = Boolean(uiOptions.readonly ?? props.readonly ?? props.schema.readOnly ?? schema.readOnly); const uiSchemaHideError = uiOptions.hideError; // Set hideError to the value provided in the uiSchema, otherwise stick with the prop to propagate to children const hideError = uiSchemaHideError === undefined ? props.hideError : Boolean(uiSchemaHideError); - const autofocus = Boolean(props.autofocus || uiOptions.autofocus); + const autofocus = Boolean(uiOptions.autofocus ?? props.autofocus); if (Object.keys(schema).length === 0) { return null; } diff --git a/packages/core/test/uiSchema.test.jsx b/packages/core/test/uiSchema.test.jsx index eec82a2bb2..b60406b28d 100644 --- a/packages/core/test/uiSchema.test.jsx +++ b/packages/core/test/uiSchema.test.jsx @@ -2505,9 +2505,7 @@ describe('uiSchema', () => { }); describe('ObjectField', () => { - let node; - - beforeEach(() => { + it('should mark as readonly an ObjectField', () => { const schema = { type: 'object', properties: { @@ -2523,13 +2521,41 @@ describe('uiSchema', () => { const uiSchema = {}; let rendered = createFormComponent({ schema, uiSchema }); - node = rendered.node; - }); + const node = rendered.node; - it('should mark as readonly an ObjectField', () => { const disabled = [].map.call(node.querySelectorAll('[type=text]'), (node) => node.hasAttribute('readonly')); expect(disabled).eql([true, true]); }); + + it('should not mark as readonly even if globalOptions set readonly', () => { + const schema = { + type: 'object', + properties: { + foo: { + type: 'string', + }, + bar: { + type: 'string', + }, + }, + readOnly: true, + }; + + const uiSchema = { + 'ui:globalOptions': { + readonly: true, + }, + foo: { + 'ui:readonly': false, + }, + }; + + let rendered = createFormComponent({ schema, uiSchema }); + const node = rendered.node; + + const disabled = [].map.call(node.querySelectorAll('[type=text]'), (node) => node.hasAttribute('readonly')); + expect(disabled).eql([false, true]); + }); }); }); diff --git a/packages/utils/src/types.ts b/packages/utils/src/types.ts index 4343be2353..0d3461eed1 100644 --- a/packages/utils/src/types.ts +++ b/packages/utils/src/types.ts @@ -380,11 +380,11 @@ export interface FieldProps (event?: any) => void; /** A boolean value stating if the array item is read-only */ - readonly: boolean; + readonly?: boolean; /** A stable, unique key for the array item */ key: string; /** The schema object for this array item */ @@ -631,9 +631,9 @@ export type ObjectFieldTemplatePropertyType = { /** A string representing the property name */ name: string; /** A boolean value stating if the object property is disabled */ - disabled: boolean; + disabled?: boolean; /** A boolean value stating if the property is read-only */ - readonly: boolean; + readonly?: boolean; /** A boolean value stating if the property should be hidden */ hidden: boolean; };