@rjsf/utils 6.7.1 → 6.10.0

package/src/getChangedFields.ts

@@ -1,19 +1,41 @@
-import difference from 'lodash/difference';
-import get from 'lodash/get';
-import isPlainObject from 'lodash/isPlainObject';
-import keys from 'lodash/keys';
-import pickBy from 'lodash/pickBy';
+import deepEquals from './deepEquals.ts';
+import isPlainObject from './isPlainObject.ts';
+import { getByPath } from './pathUtils.ts';
 
-import deepEquals from './deepEquals';
+/** Returns the paths of the changed descendants of `a` relative to `b`, relative to the node itself. An empty list
+ * means the difference could not be narrowed any further, so the caller should report its own key instead.
+ *
+ * @param a - The first value, representing the original data to compare
+ * @param b - The second value, representing the updated data to compare
+ * @returns - An array of dotted paths, relative to `a`
+ */
+function getChangedDescendants(a: unknown, b: unknown): string[] {
+  if (isPlainObject(a) && isPlainObject(b)) {
+    return getChangedFields(a, b, true);
+  }
+  // Arrays of a different length shift their items around, so nothing below them can be matched up by index.
+  if (Array.isArray(a) && Array.isArray(b) && a.length === b.length) {
+    return a.flatMap((value, index) => {
+      if (deepEquals(value, b[index])) {
+        return [];
+      }
+      const descendants = getChangedDescendants(value, b[index]);
+      return descendants.length ? descendants.map((path) => `${index}.${path}`) : [String(index)];
+    });
+  }
+  return [];
+}
 
 /**
  * Compares two objects and returns the names of the fields that have changed.
- * This function iterates over each field of object `a`, using `_.isEqual` to compare the field value
+ * This function iterates over each field of object `a`, using `deepEquals` to compare the field value
  * with the corresponding field value in object `b`. If the values are different, the field name will
  * be included in the returned array.
  *
  * @param a - The first object, representing the original data to compare.
  * @param b - The second object, representing the updated data to compare.
+ * @param [deep=false] - Optional flag that, when true, descends into nested objects and same-length arrays and returns
+ *          the dotted path of the deepest field that changed rather than the name of the top-level field holding it.
  * @returns - An array of field names that have changed.
  *
  * @example
@@ -21,21 +43,38 @@ import deepEquals from './deepEquals';
  * const b = { name: 'John', age: 31 };
  * const changedFields = getChangedFields(a, b);
  * console.log(changedFields); // Output: ['age']
+ *
+ * @example
+ * const a = { items: [{ qux: '', corge: '' }] };
+ * const b = { items: [{ qux: 'a', corge: '' }] };
+ * console.log(getChangedFields(a, b)); // Output: ['items']
+ * console.log(getChangedFields(a, b, true)); // Output: ['items.0.qux']
  */
-export default function getChangedFields(a: unknown, b: unknown): string[] {
-  const aIsPlainObject = isPlainObject(a);
-  const bIsPlainObject = isPlainObject(b);
-  // If strictly equal or neither of them is a plainObject returns an empty array
-  if (a === b || (!aIsPlainObject && !bIsPlainObject)) {
+export default function getChangedFields(a: unknown, b: unknown, deep = false): string[] {
+  if (a === b) {
     return [];
   }
-  if (aIsPlainObject && !bIsPlainObject) {
-    return keys(a);
+  // If only one of them is a plainObject all of its fields changed; if neither is, nothing did
+  if (!isPlainObject(a)) {
+    return isPlainObject(b) ? Object.keys(b) : [];
   }
-  if (!aIsPlainObject && bIsPlainObject) {
-    return keys(b);
+  if (!isPlainObject(b)) {
+    return Object.keys(a);
   }
-  const unequalFields = keys(pickBy(a as object, (value, key) => !deepEquals(value, get(b, key))));
-  const diffFields = difference(keys(b), keys(a));
+  const aKeys = Object.keys(a);
+  const aKeySet = new Set(aKeys);
+  const unequalFields = aKeys
+    .filter((key) => !deepEquals(a[key], getByPath(b, key)))
+    .flatMap((key) => {
+      if (!deep) {
+        return [key];
+      }
+      // A key holding a `.` or a `[` is descended into like any other. The path it produces cannot be told apart from
+      // a path through nested keys, but neither can the entry an `ErrorSchema` keeps for it, since `toErrorSchema()`
+      // spells such a name out as a path in the same way, so the two agree on where the field lives.
+      const descendants = getChangedDescendants(a[key], getByPath(b, key));
+      return descendants.length ? descendants.map((path) => `${key}.${path}`) : [key];
+    });
+  const diffFields = Object.keys(b).filter((key) => !aKeySet.has(key));
   return [...unequalFields, ...diffFields];
 }

package/src/getDateElementProps.ts

@@ -1,4 +1,4 @@
-import type { DateObject } from './types';
+import type { DateObject } from './types.ts';
 
 /** Available options for re-ordering date input element */
 export type DateElementFormat = 'DMY' | 'MDY' | 'YMD';

package/src/getDiscriminatorFieldFromSchema.ts

@@ -1,8 +1,6 @@
-import get from 'lodash/get';
-import isString from 'lodash/isString';
-
-import { DISCRIMINATOR_PATH } from './constants';
-import type { RJSFSchema, StrictRJSFSchema } from './types';
+import { DISCRIMINATOR_PATH } from './constants.ts';
+import { getByPath } from './pathUtils.ts';
+import type { RJSFSchema, StrictRJSFSchema } from './types.ts';
 
 /** Returns the `discriminator.propertyName` when defined in the `schema` if it is a string. A warning is generated when
  * it is not a string. Returns `undefined` when a valid discriminator is not present.
@@ -12,8 +10,8 @@ import type { RJSFSchema, StrictRJSFSchema } from './types';
  */
 export default function getDiscriminatorFieldFromSchema<S extends StrictRJSFSchema = RJSFSchema>(schema: S) {
   let discriminator: string | undefined;
-  const maybeString = get(schema, DISCRIMINATOR_PATH);
-  if (isString(maybeString)) {
+  const maybeString = getByPath(schema, DISCRIMINATOR_PATH);
+  if (typeof maybeString === 'string') {
     discriminator = maybeString;
   } else if (maybeString !== undefined) {
     // oxlint-disable-next-line no-console

package/src/getInputProps.ts

@@ -1,5 +1,5 @@
-import rangeSpec from './rangeSpec';
-import type { FormContextType, InputPropsType, RJSFSchema, StrictRJSFSchema, UIOptionsType } from './types';
+import rangeSpec from './rangeSpec.ts';
+import type { FormContextType, InputPropsType, RJSFSchema, StrictRJSFSchema, UIOptionsType } from './types.ts';
 
 /** Using the `schema`, `defaultType` and `options`, extract out the props for the <input> element that make sense.
  *
@@ -61,6 +61,10 @@ export default function getInputProps<
     inputProps.autoComplete = options.autocomplete;
   }
 
+  if (options.autocapitalize) {
+    inputProps.autoCapitalize = options.autocapitalize;
+  }
+
   if (options.accept) {
     inputProps.accept = options.accept as string;
   }

package/src/getOptionMatchingSimpleDiscriminator.ts

@@ -1,7 +1,6 @@
-import get from 'lodash/get';
-
-import { PROPERTIES_KEY } from './constants';
-import type { RJSFSchema, StrictRJSFSchema } from './types';
+import getPropertySchema from './getPropertySchema.ts';
+import { getByPath } from './pathUtils.ts';
+import type { RJSFSchema, StrictRJSFSchema } from './types.ts';
 
 /** Compares the value of `discriminatorField` within `formData` against the value of `discriminatorField` within schema for each `option`.
  * Returns index of first `option` whose discriminator matches formData. Returns `undefined` if there is no match.
@@ -19,7 +18,7 @@ export default function getOptionMatchingSimpleDiscriminator<T = any, S extends
   discriminatorField?: string,
 ): number | undefined {
   if (formData && discriminatorField) {
-    const value = get(formData, discriminatorField);
+    const value = getByPath(formData, discriminatorField);
 
     if (value === undefined) {
       return undefined;
@@ -27,13 +26,14 @@ export default function getOptionMatchingSimpleDiscriminator<T = any, S extends
 
     for (let i = 0; i < options.length; i += 1) {
       const option = options[i];
-      const discriminator: S = get(option, [PROPERTIES_KEY, discriminatorField], {}) as S;
+      const discriminator = getPropertySchema<S>(option, discriminatorField);
 
       if (discriminator.type !== 'object' && discriminator.type !== 'array') {
         if (discriminator.const === value) {
           return i;
         }
-        if (discriminator.enum?.includes(value)) {
+        const enumValues: readonly unknown[] | undefined = discriminator.enum;
+        if (enumValues?.includes(value)) {
           return i;
         }
       }

package/src/getOptionValueFormat.ts

@@ -1,4 +1,4 @@
-import type { OptionValueFormat } from './types';
+import type { OptionValueFormat } from './types.ts';
 
 /** Resolves the effective `optionValueFormat` for enum-backed widgets.
  *

package/src/getPropertySchema.ts

@@ -0,0 +1,18 @@
+import { PROPERTIES_KEY } from './constants.ts';
+import type { RJSFSchema, StrictRJSFSchema } from './types.ts';
+
+/** Returns the sub-schema declared for `property` in the `properties` of `schema`, falling back to an empty schema
+ * when the schema has no such property. Callers treat the properties of a schema as schemas of the same type `S`,
+ * which the `JSONSchema7` typing of `properties` cannot express, so this function owns that single assertion rather
+ * than repeating it at every lookup.
+ *
+ * @param schema - The schema, if any, from which to read the property sub-schema
+ * @param property - The name of the property whose sub-schema is desired
+ * @returns - The sub-schema for `property`, or an empty schema when it is not declared
+ */
+export default function getPropertySchema<S extends StrictRJSFSchema = RJSFSchema>(
+  schema: S | undefined,
+  property: string,
+): S {
+  return (schema?.[PROPERTIES_KEY]?.[property] ?? {}) as S;
+}

package/src/getSchemaType.ts

@@ -1,5 +1,5 @@
-import guessType from './guessType';
-import type { RJSFSchema, StrictRJSFSchema } from './types';
+import guessType from './guessType.ts';
+import type { RJSFSchema, StrictRJSFSchema } from './types.ts';
 
 /** Gets the type of a given `schema`. If the type is not explicitly defined, then an attempt is made to infer it from
  * other elements of the schema as follows:

package/src/getSubmitButtonOptions.ts

@@ -1,6 +1,6 @@
-import { SUBMIT_BTN_OPTIONS_KEY } from './constants';
-import getUiOptions from './getUiOptions';
-import type { FormContextType, RJSFSchema, StrictRJSFSchema, UiSchema, UISchemaSubmitButtonOptions } from './types';
+import { SUBMIT_BTN_OPTIONS_KEY } from './constants.ts';
+import getUiOptions from './getUiOptions.ts';
+import type { FormContextType, RJSFSchema, StrictRJSFSchema, UiSchema, UISchemaSubmitButtonOptions } from './types.ts';
 
 /** The default submit button options, exported for testing purposes
  */

package/src/getTemplate.ts

@@ -1,4 +1,4 @@
-import type { FormContextType, TemplatesType, Registry, UIOptionsType, StrictRJSFSchema, RJSFSchema } from './types';
+import type { FormContextType, TemplatesType, Registry, UIOptionsType, StrictRJSFSchema, RJSFSchema } from './types.ts';
 
 /** Returns the template with the given `name` from either the `uiSchema` if it is defined or from the `registry`
  * otherwise. NOTE, since `ButtonTemplates` are not overridden in `uiSchema` only those in the `registry` are returned.

package/src/getTestIds.ts

@@ -1,7 +1,7 @@
-import get from 'lodash/get';
-import uniqueId from 'lodash/uniqueId';
+import { getByPath } from './pathUtils.ts';
+import type { TestIdShape } from './types.ts';
 
-import type { TestIdShape } from './types';
+let testIdCounter = 0;
 
 /** Returns an object of test IDs that can only be used in test mode. If the function is called in a test environment
  * (`NODE_ENV === 'test'`, this is set by vitest) then a Proxy object will be returned. If a key within the returned
@@ -20,9 +20,9 @@ import type { TestIdShape } from './types';
  */
 export default function getTestIds(): TestIdShape {
   // For some reason, even though process.env contains the value of `test` for NODE_ENV, accessing it directly returns
-  // 'development'. Using `get()` does, in fact, return test so sticking with it.
+  // 'development'. Using `getByPath()` does, in fact, return test so sticking with it.
   // Use globalThis to access process without requiring @types/node (TS6 compatibility).
-  if (get(globalThis, 'process.env.NODE_ENV') !== 'test') {
+  if (getByPath(globalThis, ['process', 'env', 'NODE_ENV']) !== 'test') {
     return {};
   }
 
@@ -32,7 +32,8 @@ export default function getTestIds(): TestIdShape {
     {
       get(_obj, prop) {
         if (!ids.has(prop)) {
-          ids.set(prop, uniqueId('test-id-'));
+          testIdCounter += 1;
+          ids.set(prop, `test-id-${testIdCounter}`);
         }
         return ids.get(prop);
       },

package/src/getUiOptions.ts

@@ -1,5 +1,5 @@
-import { UI_OPTIONS_KEY, UI_WIDGET_KEY } from './constants';
-import isObject from './isObject';
+import { UI_OPTIONS_KEY, UI_WIDGET_KEY } from './constants.ts';
+import isObject from './isObject.ts';
 import type {
   FormContextType,
   GlobalUISchemaOptions,
@@ -7,7 +7,7 @@ import type {
   StrictRJSFSchema,
   UIOptionsType,
   UiSchema,
-} from './types';
+} from './types.ts';
 
 /** Get all passed options from ui:options, and ui:<optionName>, returning them in an object with the `ui:`
  * stripped off. Any `globalOptions` will always be returned, unless they are overridden by options in the `uiSchema`.

package/src/getWidget.tsx

@@ -1,10 +1,8 @@
 import { createElement } from 'react';
-import get from 'lodash/get';
-import set from 'lodash/set';
 import ReactIs from 'react-is';
 
-import getSchemaType from './getSchemaType';
-import type { FormContextType, RJSFSchema, Widget, RegistryWidgetsType, StrictRJSFSchema } from './types';
+import getSchemaType from './getSchemaType.ts';
+import type { FormContextType, RJSFSchema, Widget, RegistryWidgetsType, StrictRJSFSchema } from './types.ts';
 
 /** The map of schema types to widget type to widget name
  */
@@ -71,13 +69,15 @@ const widgetMap: Record<string, Record<string, string>> = {
 function mergeWidgetOptions<T = any, S extends StrictRJSFSchema = RJSFSchema, F extends FormContextType = any>(
   AWidget: Widget<T, S, F>,
 ) {
-  let MergedWidget: Widget<T, S, F> | undefined = get(AWidget, 'MergedWidget');
+  let { MergedWidget } = AWidget;
   // cache return value as property of widget for proper react reconciliation
   if (!MergedWidget) {
     // oxlint-disable-next-line typescript/no-deprecated
     const defaultOptions = AWidget.defaultProps?.options || {};
     MergedWidget = ({ options, ...props }) => <AWidget options={{ ...defaultOptions, ...options }} {...props} />;
-    set(AWidget, 'MergedWidget', MergedWidget);
+    // The mutation is deliberate: the wrapper is cached on the widget itself for React reconciliation
+    // oxlint-disable-next-line no-param-reassign
+    AWidget.MergedWidget = MergedWidget;
   }
   return MergedWidget;
 }

package/src/hasWidget.ts

@@ -1,5 +1,5 @@
-import getWidget from './getWidget';
-import type { FormContextType, RegistryWidgetsType, RJSFSchema, StrictRJSFSchema, Widget } from './types';
+import getWidget from './getWidget.tsx';
+import type { FormContextType, RegistryWidgetsType, RJSFSchema, StrictRJSFSchema, Widget } from './types.ts';
 
 /** Detects whether the `widget` exists for the `schema` with the associated `registryWidgets` and returns true if it
  * does, or false if it doesn't.

package/src/hashForSchema.ts

@@ -1,4 +1,4 @@
-import type { RJSFSchema, StrictRJSFSchema } from './types';
+import type { RJSFSchema, StrictRJSFSchema } from './types.ts';
 
 /** Hashes a string using the algorithm based on Java's hashing function.
  * JS has no built-in hashing function, so rolling our own
@@ -20,19 +20,30 @@ export function hashString(string: string): string {
   return hash.toString(16);
 }
 
-/** Stringifies an `object`, sorts object fields in consistent order before stringifying it.
+/** Recursively serializes a value to JSON with object keys sorted alphabetically to produce
+ * a stable string representation.
  *
  * @param object - The object for which the sorted stringify is desired
  * @returns - The stringified object with keys sorted in a consistent order
  */
 export function sortedJSONStringify(object: unknown): string {
-  const allKeys = new Set<string>();
-  // solution source: https://stackoverflow.com/questions/16167581/sort-object-properties-and-json-stringify/53593328#53593328
-  JSON.stringify(object, (key, value) => {
-    allKeys.add(key);
-    return value;
-  });
-  return JSON.stringify(object, Array.from(allKeys).sort());
+  function shouldIncludeValue(value: unknown) {
+    return value !== undefined && typeof value !== 'function' && typeof value !== 'symbol';
+  }
+
+  if (Array.isArray(object)) {
+    return `[${object.map((x) => (x === undefined ? 'undefined' : sortedJSONStringify(x))).join(',')}]`;
+  }
+  if (object === null || typeof object !== 'object') {
+    return JSON.stringify(typeof object === 'function' ? null : object); // Normalise functions
+  }
+
+  const record = object as Record<string, unknown>;
+  const sortedValues = Object.keys(record)
+    .sort()
+    .filter((key) => shouldIncludeValue(record[key]))
+    .map((key) => `${JSON.stringify(key)}:${sortedJSONStringify(record[key])}`);
+  return `{${sortedValues.join(',')}}`;
 }
 
 /** Stringifies an `object` and returns the hash of the resulting string. Sorts object fields

package/src/idGenerators.ts

@@ -1,7 +1,5 @@
-import isString from 'lodash/isString';
-
-import { ID_KEY } from './constants';
-import type { FieldPathId } from './types';
+import { ID_KEY } from './constants.ts';
+import type { FieldPathId } from './types.ts';
 
 /** Generates a consistent `id` pattern for a given `id` and a `suffix`
  *
@@ -9,7 +7,7 @@ import type { FieldPathId } from './types';
  * @param suffix - The suffix to append to the id
  */
 function idGenerator(id: FieldPathId | string, suffix: string) {
-  const theId = isString(id) ? id : id[ID_KEY];
+  const theId = typeof id === 'string' ? id : id[ID_KEY];
   return `${theId}__${suffix}`;
 }
 /** Return a consistent `id` for the field description element