@rjsf/utils 6.0.0-beta.9 → 6.0.0

package/src/findSchemaDefinition.ts

@@ -1,7 +1,14 @@
 import jsonpointer from 'jsonpointer';
 import omit from 'lodash/omit';
 
-import { ID_KEY, JSON_SCHEMA_DRAFT_2020_12, REF_KEY, SCHEMA_KEY } from './constants';
+import {
+  ALL_OF_KEY,
+  ID_KEY,
+  JSON_SCHEMA_DRAFT_2019_09,
+  JSON_SCHEMA_DRAFT_2020_12,
+  REF_KEY,
+  SCHEMA_KEY,
+} from './constants';
 import { GenericObjectType, RJSFSchema, StrictRJSFSchema } from './types';
 import isObject from 'lodash/isObject';
 import isEmpty from 'lodash/isEmpty';
@@ -20,7 +27,16 @@ function findEmbeddedSchemaRecursive<S extends StrictRJSFSchema = RJSFSchema>(sc
     return schema;
   }
   for (const subSchema of Object.values(schema)) {
-    if (isObject(subSchema)) {
+    if (Array.isArray(subSchema)) {
+      for (const item of subSchema) {
+        if (isObject(item)) {
+          const result = findEmbeddedSchemaRecursive<S>(item as S, ref);
+          if (result !== undefined) {
+            return result as S;
+          }
+        }
+      }
+    } else if (isObject(subSchema)) {
       const result = findEmbeddedSchemaRecursive<S>(subSchema as S, ref);
       if (result !== undefined) {
         return result as S;
@@ -30,6 +46,31 @@ function findEmbeddedSchemaRecursive<S extends StrictRJSFSchema = RJSFSchema>(sc
   return undefined;
 }
 
+/** Parses a JSONSchema and makes all references absolute with respect to
+ * the `baseURI` argument
+ * @param schema - The schema to be processed
+ * @param baseURI - The base URI to be used for resolving relative references
+ */
+export function makeAllReferencesAbsolute<S extends StrictRJSFSchema = RJSFSchema>(schema: S, baseURI: string): S {
+  const currentURI = get(schema, ID_KEY, baseURI);
+  // Make all other references absolute
+  if (REF_KEY in schema) {
+    schema = { ...schema, [REF_KEY]: UriResolver.resolve(currentURI, schema[REF_KEY]!) };
+  }
+  // Look for references in nested subschemas
+  for (const [key, subSchema] of Object.entries(schema)) {
+    if (Array.isArray(subSchema)) {
+      schema = {
+        ...schema,
+        [key]: subSchema.map((item) => (isObject(item) ? makeAllReferencesAbsolute(item as S, currentURI) : item)),
+      };
+    } else if (isObject(subSchema)) {
+      schema = { ...schema, [key]: makeAllReferencesAbsolute(subSchema as S, currentURI) };
+    }
+  }
+  return schema;
+}
+
 /** Splits out the value at the `key` in `object` from the `object`, returning an array that contains in the first
  * location, the `object` minus the `key: value` and in the second location the `value`.
  *
@@ -103,7 +144,14 @@ export function findSchemaDefinitionRecursive<S extends StrictRJSFSchema = RJSFS
     const [remaining, theRef] = splitKeyElementFromObject(REF_KEY, current);
     const subSchema = findSchemaDefinitionRecursive<S>(theRef, rootSchema, [...recurseList, ref], baseURI);
     if (Object.keys(remaining).length > 0) {
-      return { ...remaining, ...subSchema };
+      if (
+        rootSchema[SCHEMA_KEY] === JSON_SCHEMA_DRAFT_2019_09 ||
+        rootSchema[SCHEMA_KEY] === JSON_SCHEMA_DRAFT_2020_12
+      ) {
+        return { [ALL_OF_KEY]: [remaining, subSchema] } as S;
+      } else {
+        return { ...remaining, ...subSchema };
+      }
     }
     return subSchema;
   }

package/src/getDateElementProps.ts

@@ -4,7 +4,7 @@ import { type DateObject } from './types';
 export type DateElementFormat = 'DMY' | 'MDY' | 'YMD';
 
 /** Type describing format of DateElement prop */
-type DateElementProp = {
+export type DateElementProp = {
   type: string;
   range: [number, number];
   value: number | undefined;

package/src/getTestIds.ts

@@ -1,5 +1,5 @@
-import { nanoid } from 'nanoid';
 import get from 'lodash/get';
+import uniqueId from 'lodash/uniqueId';
 
 import { TestIdShape } from './types';
 
@@ -31,7 +31,7 @@ export default function getTestIds(): TestIdShape {
     {
       get(_obj, prop) {
         if (!ids.has(prop)) {
-          ids.set(prop, nanoid());
+          ids.set(prop, uniqueId('test-id-'));
         }
         return ids.get(prop);
       },

package/src/getUiOptions.ts

@@ -13,6 +13,10 @@ export default function getUiOptions<T = any, S extends StrictRJSFSchema = RJSFS
   uiSchema: UiSchema<T, S, F> = {},
   globalOptions: GlobalUISchemaOptions = {},
 ): UIOptionsType<T, S, F> {
+  // Handle null or undefined uiSchema
+  if (!uiSchema) {
+    return { ...globalOptions };
+  }
   return Object.keys(uiSchema)
     .filter((key) => key.indexOf('ui:') === 0)
     .reduce(

package/src/getWidget.tsx

@@ -110,7 +110,7 @@ export default function getWidget<T = any, S extends StrictRJSFSchema = RJSFSche
   }
 
   if (typeof widget !== 'string') {
-    throw new Error(`Unsupported widget definition: ${typeof widget}`);
+    throw new Error(`Unsupported widget definition: ${typeof widget} in schema: ${JSON.stringify(schema)}`);
   }
 
   if (widget in registeredWidgets) {
@@ -120,7 +120,7 @@ export default function getWidget<T = any, S extends StrictRJSFSchema = RJSFSche
 
   if (typeof type === 'string') {
     if (!(type in widgetMap)) {
-      throw new Error(`No widget for type '${type}'`);
+      throw new Error(`No widget for type '${type}' in schema: ${JSON.stringify(schema)}`);
     }
 
     if (widget in widgetMap[type]) {
@@ -129,5 +129,5 @@ export default function getWidget<T = any, S extends StrictRJSFSchema = RJSFSche
     }
   }
 
-  throw new Error(`No widget '${widget}' for type '${type}'`);
+  throw new Error(`No widget '${widget}' for type '${type}' in schema: ${JSON.stringify(schema)}`);
 }

package/src/idGenerators.ts

@@ -1,73 +1,73 @@
 import isString from 'lodash/isString';
 
-import { IdSchema } from './types';
+import { FieldPathId } from './types';
 import { ID_KEY } from './constants';
 
 /** Generates a consistent `id` pattern for a given `id` and a `suffix`
  *
- * @param id - Either simple string id or an IdSchema from which to extract it
+ * @param id - Either simple string id or an FieldPathId from which to extract it
  * @param suffix - The suffix to append to the id
  */
-function idGenerator<T = any>(id: IdSchema<T> | string, suffix: string) {
+function idGenerator(id: FieldPathId | string, suffix: string) {
   const theId = isString(id) ? id : id[ID_KEY];
   return `${theId}__${suffix}`;
 }
 /** Return a consistent `id` for the field description element
  *
- * @param id - Either simple string id or an IdSchema from which to extract it
+ * @param id - Either simple string id or an FieldPathId from which to extract it
  * @returns - The consistent id for the field description element from the given `id`
  */
-export function descriptionId<T = any>(id: IdSchema<T> | string) {
-  return idGenerator<T>(id, 'description');
+export function descriptionId(id: FieldPathId | string) {
+  return idGenerator(id, 'description');
 }
 
 /** Return a consistent `id` for the field error element
  *
- * @param id - Either simple string id or an IdSchema from which to extract it
+ * @param id - Either simple string id or an FieldPathId from which to extract it
  * @returns - The consistent id for the field error element from the given `id`
  */
-export function errorId<T = any>(id: IdSchema<T> | string) {
-  return idGenerator<T>(id, 'error');
+export function errorId(id: FieldPathId | string) {
+  return idGenerator(id, 'error');
 }
 
 /** Return a consistent `id` for the field examples element
  *
- * @param id - Either simple string id or an IdSchema from which to extract it
+ * @param id - Either simple string id or an FieldPathId from which to extract it
  * @returns - The consistent id for the field examples element from the given `id`
  */
-export function examplesId<T = any>(id: IdSchema<T> | string) {
-  return idGenerator<T>(id, 'examples');
+export function examplesId(id: FieldPathId | string) {
+  return idGenerator(id, 'examples');
 }
 
 /** Return a consistent `id` for the field help element
  *
- * @param id - Either simple string id or an IdSchema from which to extract it
+ * @param id - Either simple string id or an FieldPathId from which to extract it
  * @returns - The consistent id for the field help element from the given `id`
  */
-export function helpId<T = any>(id: IdSchema<T> | string) {
-  return idGenerator<T>(id, 'help');
+export function helpId(id: FieldPathId | string) {
+  return idGenerator(id, 'help');
 }
 
 /** Return a consistent `id` for the field title element
  *
- * @param id - Either simple string id or an IdSchema from which to extract it
+ * @param id - Either simple string id or an FieldPathId from which to extract it
  * @returns - The consistent id for the field title element from the given `id`
  */
-export function titleId<T = any>(id: IdSchema<T> | string) {
-  return idGenerator<T>(id, 'title');
+export function titleId(id: FieldPathId | string) {
+  return idGenerator(id, 'title');
 }
 
 /** Return a list of element ids that contain additional information about the field that can be used to as the aria
  * description of the field. This is correctly omitting `titleId` which would be "labeling" rather than "describing" the
  * element.
  *
- * @param id - Either simple string id or an IdSchema from which to extract it
+ * @param id - Either simple string id or an FieldPathId from which to extract it
  * @param [includeExamples=false] - Optional flag, if true, will add the `examplesId` into the list
  * @returns - The string containing the list of ids for use in an `aria-describedBy` attribute
  */
-export function ariaDescribedByIds<T = any>(id: IdSchema<T> | string, includeExamples = false) {
-  const examples = includeExamples ? ` ${examplesId<T>(id)}` : '';
-  return `${errorId<T>(id)} ${descriptionId<T>(id)} ${helpId<T>(id)}${examples}`;
+export function ariaDescribedByIds(id: FieldPathId | string, includeExamples = false) {
+  const examples = includeExamples ? ` ${examplesId(id)}` : '';
+  return `${errorId(id)} ${descriptionId(id)} ${helpId(id)}${examples}`;
 }
 
 /** Return a consistent `id` for the `optionIndex`s of a `Radio` or `Checkboxes` widget
@@ -82,10 +82,20 @@ export function optionId(id: string, optionIndex: number) {
 
 /** Return a consistent `id` for the `btn` button element
  *
- * @param id - Either simple string id or an IdSchema from which to extract it
+ * @param id - The id of the parent component for the option
  * @param btn - The button type for which to generate the id
  * @returns - The consistent id for the button from the given `id` and `btn` type
  */
-export function buttonId<T = any>(id: IdSchema<T> | string, btn: 'add' | 'copy' | 'moveDown' | 'moveUp' | 'remove') {
-  return idGenerator<T>(id, btn);
+export function buttonId(id: FieldPathId | string, btn: 'add' | 'copy' | 'moveDown' | 'moveUp' | 'remove') {
+  return idGenerator(id, btn);
+}
+
+/** Return a consistent `id` for the optional data controls `element`
+ *
+ * @param id - The id of the parent component for the option
+ * @param element - The element type for which to generate the id
+ * @returns - The consistent id for the optional data controls element from the given `id` and `element` type
+ */
+export function optionalControlsId(id: FieldPathId | string, element: 'Add' | 'Msg' | 'Remove') {
+  return idGenerator(id, `optional${element}`);
 }

package/src/index.ts

@@ -6,6 +6,7 @@ import createSchemaUtils from './createSchemaUtils';
 import dataURItoBlob from './dataURItoBlob';
 import dateRangeOptions from './dateRangeOptions';
 import deepEquals from './deepEquals';
+import shallowEquals from './shallowEquals';
 import englishStringTranslator from './englishStringTranslator';
 import enumOptionsDeselectValue from './enumOptionsDeselectValue';
 import enumOptionsIndexForValue from './enumOptionsIndexForValue';
@@ -14,9 +15,11 @@ import enumOptionsSelectValue from './enumOptionsSelectValue';
 import enumOptionsValueForIndex from './enumOptionsValueForIndex';
 import ErrorSchemaBuilder from './ErrorSchemaBuilder';
 import findSchemaDefinition from './findSchemaDefinition';
-import getDateElementProps, { type DateElementFormat } from './getDateElementProps';
+import getChangedFields from './getChangedFields';
+import getDateElementProps, { DateElementFormat, DateElementProp } from './getDateElementProps';
 import getDiscriminatorFieldFromSchema from './getDiscriminatorFieldFromSchema';
 import getInputProps from './getInputProps';
+import getOptionMatchingSimpleDiscriminator from './getOptionMatchingSimpleDiscriminator';
 import getSchemaType from './getSchemaType';
 import getSubmitButtonOptions from './getSubmitButtonOptions';
 import getTemplate from './getTemplate';
@@ -33,13 +36,16 @@ import {
   errorId,
   examplesId,
   helpId,
+  optionalControlsId,
   optionId,
   titleId,
 } from './idGenerators';
 import isConstant from './isConstant';
 import isCustomWidget from './isCustomWidget';
 import isFixedItems from './isFixedItems';
+import isFormDataAvailable from './isFormDataAvailable';
 import isObject from './isObject';
+import isRootSchema from './isRootSchema';
 import labelValue from './labelValue';
 import localToUTC from './localToUTC';
 import lookupFromFormContext from './lookupFromFormContext';
@@ -53,17 +59,21 @@ import parseDateString from './parseDateString';
 import rangeSpec from './rangeSpec';
 import replaceStringParameters from './replaceStringParameters';
 import schemaRequiresTrueValue from './schemaRequiresTrueValue';
-import shouldRender from './shouldRender';
+import shouldRender, { ComponentUpdateStrategy } from './shouldRender';
+import shouldRenderOptionalField from './shouldRenderOptionalField';
 import toConstant from './toConstant';
 import toDateString from './toDateString';
 import toErrorList from './toErrorList';
 import toErrorSchema from './toErrorSchema';
+import toFieldPathId from './toFieldPathId';
 import unwrapErrorHandler from './unwrapErrorHandler';
+import useAltDateWidgetProps, { DateElement, DateElementProps, UseAltDateWidgetResult } from './useAltDateWidgetProps';
+import useDeepCompareMemo from './useDeepCompareMemo';
+import useFileWidgetProps, { FileInfoType, UseFileWidgetPropsResult } from './useFileWidgetProps';
 import utcToLocal from './utcToLocal';
 import validationDataMerge from './validationDataMerge';
 import withIdRefPrefix from './withIdRefPrefix';
-import getOptionMatchingSimpleDiscriminator from './getOptionMatchingSimpleDiscriminator';
-import getChangedFields from './getChangedFields';
+import { bracketNameGenerator, dotNotationNameGenerator } from './nameGenerators';
 
 export * from './types';
 export * from './enums';
@@ -72,6 +82,16 @@ export * from './constants';
 export * from './parser';
 export * from './schema';
 
+export type {
+  ComponentUpdateStrategy,
+  DateElementFormat,
+  DateElementProp,
+  DateElementProps,
+  FileInfoType,
+  UseAltDateWidgetResult,
+  UseFileWidgetPropsResult,
+};
+
 export {
   allowAdditionalItems,
   ariaDescribedByIds,
@@ -80,7 +100,7 @@ export {
   canExpand,
   createErrorHandler,
   createSchemaUtils,
-  DateElementFormat,
+  DateElement,
   dataURItoBlob,
   dateRangeOptions,
   deepEquals,
@@ -115,13 +135,16 @@ export {
   isConstant,
   isCustomWidget,
   isFixedItems,
+  isFormDataAvailable,
   isObject,
+  isRootSchema,
   labelValue,
   localToUTC,
   lookupFromFormContext,
   mergeDefaultsWithFormData,
   mergeObjects,
   mergeSchemas,
+  optionalControlsId,
   optionId,
   optionsList,
   orderProperties,
@@ -130,15 +153,23 @@ export {
   rangeSpec,
   replaceStringParameters,
   schemaRequiresTrueValue,
+  shallowEquals,
   shouldRender,
+  shouldRenderOptionalField,
   sortedJSONStringify,
   titleId,
   toConstant,
   toDateString,
   toErrorList,
   toErrorSchema,
+  toFieldPathId,
   unwrapErrorHandler,
+  useAltDateWidgetProps,
+  useDeepCompareMemo,
+  useFileWidgetProps,
   utcToLocal,
   validationDataMerge,
   withIdRefPrefix,
+  bracketNameGenerator,
+  dotNotationNameGenerator,
 };

package/src/isFormDataAvailable.ts

@@ -0,0 +1,13 @@
+import isNil from 'lodash/isNil';
+import isEmpty from 'lodash/isEmpty';
+import isObject from 'lodash/isObject';
+
+/** Determines whether the given `formData` represents valid form data, such as a primitive type, an array, or a
+ * non-empty object.
+ *
+ * @param formData - The data to check
+ * @returns - True if `formData` is not undefined, null, a primitive type or an array or an empty object
+ */
+export default function isFormDataAvailable<T = any>(formData?: T): boolean {
+  return !isNil(formData) && (!isObject(formData) || Array.isArray(formData) || !isEmpty(formData));
+}

package/src/isRootSchema.ts

@@ -0,0 +1,30 @@
+import isEqual from 'lodash/isEqual';
+
+import { FormContextType, Registry, RJSFSchema, StrictRJSFSchema } from './types';
+import { REF_KEY } from './constants';
+
+/** Helper to check whether a JSON schema object is the root schema. The schema is a root schema with root `properties`
+ * key or a root `$ref` key. If the `schemaToCompare` has a root `oneOf` property, the function will
+ * return false. Else if `schemaToCompare` and `rootSchema` are the same object or equal, the function will return
+ * `true`. Else if the `rootSchema` has a $ref, it will be resolved using `schemaUtils.resolveSchema` utility. If the
+ * resolved schema matches the `schemaToCompare` the function will return `true`. Otherwise, it will return false.
+ *
+ * @param registry - The `Registry` used to get the `rootSchema` and `schemaUtils`
+ * @param schemaToCompare - The JSON schema object to check. If `schemaToCompare` is an root schema, the
+ *        function will return true.
+ * @returns - Flag indicating whether the `schemaToCompare` is the root schema
+ */
+export default function isRootSchema<T = any, S extends StrictRJSFSchema = RJSFSchema, F extends FormContextType = any>(
+  registry: Registry<T, S, F>,
+  schemaToCompare: S,
+): boolean {
+  const { rootSchema, schemaUtils } = registry;
+  if (isEqual(schemaToCompare, rootSchema)) {
+    return true;
+  }
+  if (REF_KEY in rootSchema) {
+    const resolvedSchema = schemaUtils.retrieveSchema(rootSchema);
+    return isEqual(schemaToCompare, resolvedSchema);
+  }
+  return false;
+}

package/src/mergeDefaultsWithFormData.ts

@@ -67,8 +67,22 @@ export default function mergeDefaultsWithFormData<T = any>(
       const keyValue = get(formData, key);
       const keyExistsInDefaults = isObject(defaults) && key in (defaults as GenericObjectType);
       const keyExistsInFormData = key in (formData as GenericObjectType);
+      const keyDefault = get(defaults, key) ?? {};
+      const defaultValueIsNestedObject = keyExistsInDefaults && Object.entries(keyDefault).some(([, v]) => isObject(v));
+
+      const keyDefaultIsObject = keyExistsInDefaults && isObject(get(defaults, key));
+      const keyHasFormDataObject = keyExistsInFormData && isObject(keyValue);
+
+      if (keyDefaultIsObject && keyHasFormDataObject && !defaultValueIsNestedObject) {
+        acc[key as keyof T] = {
+          ...get(defaults, key),
+          ...keyValue,
+        };
+        return acc;
+      }
+
       acc[key as keyof T] = mergeDefaultsWithFormData<T>(
-        defaults ? get(defaults, key) : {},
+        get(defaults, key),
         keyValue,
         mergeExtraArrayDefaults,
         defaultSupercedesUndefined,
@@ -88,7 +102,7 @@ export default function mergeDefaultsWithFormData<T = any>(
    */
   if (
     (defaultSupercedesUndefined &&
-      ((!isNil(defaults) && isNil(formData)) || (typeof formData === 'number' && isNaN(formData)))) ||
+      ((!(defaults === undefined) && isNil(formData)) || (typeof formData === 'number' && isNaN(formData)))) ||
     (overrideFormDataWithDefaults && !isNil(formData))
   ) {
     return defaults;

package/src/nameGenerators.ts

@@ -0,0 +1,43 @@
+import { NameGeneratorFunction, FieldPathList } from './types';
+
+/**
+ * Generates bracketed names
+ * Example: root[tasks][0][title]
+ * For multi-value fields (checkboxes, multi-select): root[hobbies][]
+ */
+export const bracketNameGenerator: NameGeneratorFunction = (
+  path: FieldPathList,
+  idPrefix: string,
+  isMultiValue?: boolean,
+): string => {
+  if (!path || path.length === 0) {
+    return idPrefix;
+  }
+
+  const baseName = path.reduce<string>((acc, pathUnit, index) => {
+    if (index === 0) {
+      return `${idPrefix}[${String(pathUnit)}]`;
+    }
+    return `${acc}[${String(pathUnit)}]`;
+  }, '');
+
+  // For multi-value fields, append [] to allow multiple values with the same name
+  return isMultiValue ? `${baseName}[]` : baseName;
+};
+
+/**
+ * Generates dot-notation names
+ * Example: root.tasks.0.title
+ * Multi-value fields are handled the same as single-value fields in dot notation
+ */
+export const dotNotationNameGenerator: NameGeneratorFunction = (
+  path: FieldPathList,
+  idPrefix: string,
+  _isMultiValue?: boolean,
+): string => {
+  if (!path || path.length === 0) {
+    return idPrefix;
+  }
+
+  return `${idPrefix}.${path.map(String).join('.')}`;
+};