Merge branch 'main' into oneOf-select-readonly

rjsf-team · Jan 27, 2025 · 64e8aaa · 64e8aaa
2 parents 2eee7e2 + 5a3537e
commit 64e8aaa
Show file tree

Hide file tree

Showing 10 changed files with 1,873 additions and 1,974 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -21,6 +21,12 @@ should change the heading of the (upcoming) version to include a major version b
 
 - switch `lodash.isEqualWith` to `fast-equals.createCustomEqual` providing `areFunctionsEqual` assuming any functions are equal.
 - Fixed issue with oneOf selector can be modified in readonly mode, fixing [#4460](https://github.com/rjsf-team/react-jsonschema-form/issues/4460)
+- Fixed issue with fields inside an array can't be set to empty when a default is set, fixing [#4456](https://github.com/rjsf-team/react-jsonschema-form/issues/4456)
+- Fixed issue with file accept attribute, fixing [#4404](https://github.com/rjsf-team/react-jsonschema-form/issues/4404).
+
+## @rjsf/mui
+
+- Fixed issue with file accept attribute, fixing [#4404](https://github.com/rjsf-team/react-jsonschema-form/issues/4404).
 
 # 5.24.1
 

diff --git a/packages/docs/docs/usage/validation.md b/packages/docs/docs/usage/validation.md
@@ -88,7 +88,7 @@ import * as precompiledValidator from 'path_to/yourCompiledSchema';
 
 const validator = createPrecompiledValidator(precompiledValidator as ValidatorFunctions);
 
-render(<Form schema={schema} validator={validator} />, document.getElementById('app'));
+render(<Form schema={yourSchema} validator={validator} />, document.getElementById('app'));
 ```
 
 ### Dynamically pre-compiling validators

diff --git a/packages/mui/src/BaseInputTemplate/BaseInputTemplate.tsx b/packages/mui/src/BaseInputTemplate/BaseInputTemplate.tsx
@@ -53,16 +53,8 @@ export default function BaseInputTemplate<
   } = props;
   const inputProps = getInputProps<T, S, F>(schema, type, options);
   // Now we need to pull out the step, min, max into an inner `inputProps` for material-ui
-  const { step, min, max, ...rest } = inputProps;
-  const otherProps = {
-    inputProps: {
-      step,
-      min,
-      max,
-      ...(schema.examples ? { list: examplesId<T>(id) } : undefined),
-    },
-    ...rest,
-  };
+  const { step, min, max, accept, ...rest } = inputProps;
+  const htmlInputProps = { step, min, max, accept, ...(schema.examples ? { list: examplesId<T>(id) } : undefined) };
   const _onChange = ({ target: { value } }: ChangeEvent<HTMLInputElement>) =>
     onChange(value === '' ? options.emptyValue : value);
   const _onBlur = ({ target }: FocusEvent<HTMLInputElement>) => onBlur(id, target && target.value);
@@ -84,7 +76,10 @@ export default function BaseInputTemplate<
         autoFocus={autofocus}
         required={required}
         disabled={disabled || readonly}
-        {...otherProps}
+        slotProps={{
+          htmlInput: htmlInputProps,
+        }}
+        {...rest}
         value={value || value === 0 ? value : ''}
         error={rawErrors.length > 0}
         onChange={onChangeOverride || _onChange}

diff --git a/packages/utils/src/getInputProps.ts b/packages/utils/src/getInputProps.ts
@@ -51,5 +51,9 @@ export default function getInputProps<
     inputProps.autoComplete = options.autocomplete;
   }
 
+  if (options.accept) {
+    inputProps.accept = options.accept as string;
+  }
+
   return inputProps;
 }
diff --git a/packages/utils/src/mergeDefaultsWithFormData.ts b/packages/utils/src/mergeDefaultsWithFormData.ts
@@ -41,7 +41,8 @@ export default function mergeDefaultsWithFormData<T = any>(
     const overrideOppositeArray = overrideFormDataWithDefaults ? formData : defaultsArray;
 
     const mapped = overrideArray.map((value, idx) => {
-      if (overrideOppositeArray[idx]) {
+      // We want to explicitly make sure that the value is NOT undefined since null, 0 and empty space are valid values
+      if (overrideOppositeArray[idx] !== undefined) {
         return mergeDefaultsWithFormData<any>(
           defaultsArray[idx],
           formData[idx],

diff --git a/packages/utils/src/types.ts b/packages/utils/src/types.ts
@@ -150,6 +150,8 @@ export type InputPropsType = Omit<RangeSpecType, 'step'> & {
   step?: number | 'any';
   /** Specifies the `autoComplete` value for an <input> element */
   autoComplete?: HTMLInputElement['autocomplete'];
+  /** Specifies a filter for what file types the user can upload. */
+  accept?: HTMLInputElement['accept'];
 };
 
 /** Type describing an id used for a field in the `IdSchema` */

diff --git a/packages/utils/test/getInputProps.test.ts b/packages/utils/test/getInputProps.test.ts
@@ -1,16 +1,23 @@
-import { getInputProps, RJSFSchema } from '../src';
+import { getInputProps, RJSFSchema, UIOptionsType } from '../src';
 
 describe('getInputProps', () => {
   it('returns type=text when no other data is passed', () => {
     expect(getInputProps({})).toEqual({ type: 'text' });
   });
   it('returns type and autoComplete from options when provided', () => {
-    const options = { inputType: 'password', autocomplete: 'on' };
+    const options: UIOptionsType = { inputType: 'password', autocomplete: 'on' };
     expect(getInputProps({}, 'text', options)).toEqual({
       type: options.inputType,
       autoComplete: options.autocomplete,
     });
   });
+  it('returns type and accept from options when provided', () => {
+    const options: UIOptionsType = { accept: '.pdf' };
+    expect(getInputProps({}, 'file', options)).toEqual({
+      type: 'file',
+      accept: options.accept,
+    });
+  });
   it('returns type=defaultType even when schema has type', () => {
     const schema: RJSFSchema = {
       type: 'number',

diff --git a/packages/utils/test/mergeDefaultsWithFormData.test.ts b/packages/utils/test/mergeDefaultsWithFormData.test.ts
@@ -150,6 +150,38 @@ describe('mergeDefaultsWithFormData()', () => {
       expect(mergeDefaultsWithFormData({}, undefined, undefined, undefined, true)).toEqual(undefined);
     });
 
+    it('should deeply merge and return formData when formData is undefined and defaultSupercedesUndefined false', () => {
+      expect(
+        mergeDefaultsWithFormData(
+          {
+            arrayWithDefaults: ['Hello World'],
+            objectWidthDefaults: {
+              nestedField: 'Hello World!',
+            },
+            stringField: 'Hello World!!',
+          },
+          {
+            arrayWithDefaults: [null],
+            objectWidthDefaults: {
+              nestedField: undefined,
+            },
+            stringField: undefined,
+            nonEmptyField: 'Hello World!!!',
+          },
+          undefined,
+          undefined,
+          true
+        )
+      ).toEqual({
+        arrayWithDefaults: [null],
+        objectWidthDefaults: {
+          nestedField: undefined,
+        },
+        stringField: undefined,
+        nonEmptyField: 'Hello World!!!',
+      });
+    });
+
     it('should return default when formData is undefined and defaultSupercedesUndefined true', () => {
       expect(mergeDefaultsWithFormData({}, undefined, undefined, true, true)).toEqual({});
     });