Merge pull request #55 from x0k/schema-value-deep-equals

x0k · web-flow · commit d58001b50035 · 2025-01-13T13:52:54.000+03:00
Use custom deep equals functions
diff --git a/.changeset/early-mails-itch.md b/.changeset/early-mails-itch.md
@@ -0,0 +1,5 @@
+---
+"@sjsf/form": minor
+---
+
+Add `isSchemaValueDeepEqual` and `isSchemaDeepEqual` functions
diff --git a/.changeset/fast-icons-protect.md b/.changeset/fast-icons-protect.md
@@ -0,0 +1,5 @@
+---
+"@sjsf/ajv8-validator": patch
+---
+
+Migrate to `isSchemaDeepEqual`
diff --git a/packages/ajv8-validator/src/validator.ts b/packages/ajv8-validator/src/validator.ts
@@ -1,14 +1,15 @@
 import { Ajv, type AsyncValidateFunction, type ValidateFunction } from "ajv";
 import type { ErrorObject, AnySchema } from "ajv";
+import type { AnyValidateFunction } from "ajv/dist/core.js";
 
-import type { MaybePromise } from '@sjsf/form/lib/types';
-import { deepEqual } from "@sjsf/form/lib/deep-equal";
+import type { MaybePromise } from "@sjsf/form/lib/types";
 import { getValueByPath } from "@sjsf/form/lib/object";
 import { weakMemoize } from "@sjsf/form/lib/memoize";
 import {
   ID_KEY,
   prefixSchemaRefs,
   ROOT_SCHEMA_PREFIX,
+  isSchemaDeepEqual,
   type Schema,
   type SchemaDefinition,
   type SchemaValue,
@@ -25,7 +26,6 @@ import {
   type UiSchema,
   type UiSchemaRoot,
 } from "@sjsf/form";
-import type { AnyValidateFunction } from "ajv/dist/core.js";
 
 const trueSchema: Schema = {};
 const falseSchema: Schema = {
@@ -58,9 +58,12 @@ export function makeSchemaCompiler<A extends boolean>(ajv: Ajv, _async: A) {
   return (schema: Schema, rootSchema: Schema) => {
     rootSchemaId = rootSchema[ID_KEY] ?? ROOT_SCHEMA_PREFIX;
     let ajvSchema = ajv.getSchema(rootSchemaId)?.schema;
-    // @deprecated
-    // TODO: Replace deep equality comparison with reference equality by default
-    if (ajvSchema !== undefined && !deepEqual(ajvSchema, rootSchema)) {
+    if (
+      ajvSchema !== undefined &&
+      // @deprecated
+      // TODO: Replace deep equality comparison with reference equality by default
+      !isSchemaDeepEqual(ajvSchema as Schema, rootSchema)
+    ) {
       ajv.removeSchema(rootSchemaId);
       validatorsCache.delete(schema);
       ajvSchema = undefined;
diff --git a/packages/form/src/core/deep-equal.ts b/packages/form/src/core/deep-equal.ts
@@ -0,0 +1,47 @@
+import { isObject } from "@/lib/object.js";
+
+import type { Schema, SchemaValue } from "./schema.js";
+
+export function isSchemaValueDeepEqual(
+  a: SchemaValue | undefined,
+  b: SchemaValue | undefined
+): boolean {
+  if (a === b) {
+    return true;
+  }
+  if (isObject(a) && isObject(b)) {
+    if (Array.isArray(a)) {
+      if (!Array.isArray(b)) {
+        return false;
+      }
+      const { length } = a;
+      if (length !== b.length) {
+        return false;
+      }
+      for (let i = length; i-- !== 0; ) {
+        if (!isSchemaValueDeepEqual(a[i], b[i])) {
+          return false;
+        }
+      }
+      return true;
+    }
+    if (Array.isArray(b)) {
+      return false;
+    }
+    const aKeys = Object.keys(a);
+    let key;
+    for (let i = aKeys.length; i-- !== 0; ) {
+      key = aKeys[i]!;
+      if (!isSchemaValueDeepEqual(a[key], b[key])) {
+        return false;
+      }
+    }
+    return Object.keys(b).length === aKeys.length;
+  }
+  return a !== a && b !== b
+}
+
+export const isSchemaDeepEqual = isSchemaValueDeepEqual as (
+  a: Schema | undefined,
+  b: Schema | undefined
+) => boolean;
diff --git a/packages/form/src/core/index.ts b/packages/form/src/core/index.ts
@@ -22,5 +22,6 @@ export * from "./merger.js";
 export * from "./default-merger.js";
 export * from "./schema-traverser.js";
 export * from "./schema-value-traverser.js";
-export * from './schema-transformer.js';
+export * from "./schema-transformer.js";
 export * from "./path.js";
+export * from "./deep-equal.js";
diff --git a/packages/form/src/core/path-schema.ts b/packages/form/src/core/path-schema.ts
@@ -2,8 +2,6 @@
 // Licensed under the Apache License, Version 2.0.
 // Modifications made by Roman Krasilnikov.
 
-import { deepEqual } from "@/lib/deep-equal.js";
-
 import { retrieveSchema2 } from "./resolve.js";
 import {
   ALL_OF_KEY,
@@ -22,6 +20,7 @@ import { isSchemaObjectValue } from "./value.js";
 import type { Merger2 } from './merger.js';
 import { defaultMerger } from './merger.js';
 import { getClosestMatchingOption2 } from './matching.js';
+import { isSchemaDeepEqual } from './deep-equal.js';
 
 export const SJSF_ADDITIONAL_PROPERTIES_FLAG = "__sjsf_additionalProperties";
 
@@ -88,7 +87,7 @@ function toPathSchemaInternal(
   if (REF_KEY in schema || DEPENDENCIES_KEY in schema || ALL_OF_KEY in schema) {
     const _schema = retrieveSchema2(validator, merger, schema, rootSchema, formData);
     const sameSchemaIndex = _recurseList.findIndex((item) =>
-      deepEqual(item, _schema)
+      isSchemaDeepEqual(item, _schema)
     );
     if (sameSchemaIndex === -1) {
       return toPathSchemaInternal(
diff --git a/packages/form/src/core/resolve.ts b/packages/form/src/core/resolve.ts
@@ -2,7 +2,6 @@
 // Licensed under the Apache License, Version 2.0.
 // Modifications made by Roman Krasilnikov.
 
-import { deepEqual } from "@/lib/deep-equal.js";
 import { array } from "@/lib/array.js";
 
 import {
@@ -30,6 +29,7 @@ import { getDiscriminatorFieldFromSchema } from "./discriminator.js";
 import { getFirstMatchingOption } from "./matching.js";
 import { isSchemaObjectValue } from "./value.js";
 import { defaultMerger, type Merger2 } from "./merger.js";
+import { isSchemaDeepEqual } from './deep-equal.js';
 
 /**
  * @deprecated use `retrieveSchema2`
@@ -157,7 +157,7 @@ export function resolveReference2(
   formData?: SchemaValue
 ): Schema[] {
   const resolvedSchema = resolveAllReferences(schema, rootSchema, stack);
-  if (!deepEqual(schema, resolvedSchema)) {
+  if (!isSchemaDeepEqual(schema, resolvedSchema)) {
     return retrieveSchemaInternal(
       validator,
       merger,
diff --git a/packages/form/src/form/fields/multi-field.svelte b/packages/form/src/form/fields/multi-field.svelte
@@ -1,8 +1,8 @@
 <script lang="ts">
   import { proxy } from "@/lib/svelte.svelte";
-  import { deepEqual } from '@/lib/deep-equal.js'
   import {
     getDiscriminatorFieldFromSchema,
+    isSchemaValueDeepEqual,
     mergeSchemas,
     type EnumOption,
     type SchemaValue,
@@ -53,7 +53,7 @@
       retrievedOptions;
       return -1;
     }
-    if (currentSelected !== undefined && deepEqual(lastValue, value)) {
+    if (currentSelected !== undefined && isSchemaValueDeepEqual(lastValue, value)) {
       return currentSelected
     }
     lastValue = $state.snapshot(value)
diff --git a/packages/form/src/form/fields/object/object-field.svelte b/packages/form/src/form/fields/object/object-field.svelte
@@ -1,11 +1,11 @@
 <script lang="ts">
   import { untrack } from "svelte";
 
-  import { deepEqual } from "@/lib/deep-equal.js";
   import {
     getDefaultValueForType,
     getSimpleSchemaType,
     isAdditionalProperty,
+    isSchemaDeepEqual,
     isSchemaExpandable,
     isSchemaObjectValue,
     orderProperties,
@@ -94,7 +94,7 @@
 
   let lastSchemaProperties: Schema["properties"] = undefined;
   const schemaProperties = $derived.by(() => {
-    if (!deepEqual(lastSchemaProperties, retrievedSchema.properties)) {
+    if (!isSchemaDeepEqual(lastSchemaProperties, retrievedSchema.properties)) {
       lastSchemaProperties = $state.snapshot(retrievedSchema.properties);
     }
     return lastSchemaProperties;
diff --git a/packages/form/src/form/id-schema.ts b/packages/form/src/form/id-schema.ts
@@ -2,8 +2,6 @@
 // Licensed under the Apache License, Version 2.0.
 // Modifications made by Roman Krasilnikov.
 
-import { deepEqual } from "@/lib/deep-equal.js";
-
 import {
   ALL_OF_KEY,
   defaultMerger,
@@ -12,6 +10,7 @@ import {
   ID_KEY,
   isNormalArrayItems,
   isSchema,
+  isSchemaDeepEqual,
   isSchemaObjectValue,
   ITEMS_KEY,
   PROPERTIES_KEY,
@@ -93,7 +92,7 @@ export function toIdSchema2(
       formData
     );
     const sameSchemaIndex = _recurseList.findIndex((item) =>
-      deepEqual(item, _schema)
+      isSchemaDeepEqual(item, _schema)
     );
     if (sameSchemaIndex === -1) {
       return toIdSchema2(
diff --git a/packages/form/src/form/options.svelte.ts b/packages/form/src/form/options.svelte.ts
@@ -1,14 +1,20 @@
-import { deepEqual } from "@/lib/deep-equal.js";
-import { isObject } from '@/lib/object.js';
+import { isObject } from "@/lib/object.js";
 
-import type { EnumOption, SchemaArrayValue, SchemaValue } from '@/core/index.js';
+import {
+  isSchemaValueDeepEqual,
+  type EnumOption,
+  type SchemaArrayValue,
+  type SchemaValue,
+} from "@/core/index.js";
 
 export interface OptionsMapper<V> {
   fromValue: (value: SchemaValue | undefined) => V;
   toValue: (value: V) => SchemaValue | undefined;
 }
 
-export function indexMapper(options: EnumOption<SchemaValue>[]): OptionsMapper<number> {
+export function indexMapper(
+  options: EnumOption<SchemaValue>[]
+): OptionsMapper<number> {
   const map = new Map(options.map((option, index) => [option.value, index]));
   return {
     fromValue(value: SchemaValue | undefined) {
@@ -22,15 +28,19 @@ export function indexMapper(options: EnumOption<SchemaValue>[]): OptionsMapper<n
       if (!isObject(value)) {
         return options.findIndex((option) => option.value === value);
       }
-      return options.findIndex((option) => deepEqual(option.value, value));
+      return options.findIndex((option) =>
+        isSchemaValueDeepEqual(option.value, value)
+      );
     },
     toValue(index: number) {
       return options[index]?.value;
     },
   };
 }
 
-export function stringIndexMapper(options: EnumOption<SchemaValue>[]): OptionsMapper<string> {
+export function stringIndexMapper(
+  options: EnumOption<SchemaValue>[]
+): OptionsMapper<string> {
   const { fromValue, toValue } = indexMapper(options);
   return {
     fromValue(value) {
@@ -47,9 +57,9 @@ export function singleOption<V>({
   value,
   update,
 }: {
-  mapper: () => OptionsMapper<V>,
-  value: () => SchemaValue | undefined,
-  update: (value: SchemaValue | undefined) => void,
+  mapper: () => OptionsMapper<V>;
+  value: () => SchemaValue | undefined;
+  update: (value: SchemaValue | undefined) => void;
 }) {
   const { fromValue, toValue } = $derived(mapper());
   return {
@@ -58,18 +68,18 @@ export function singleOption<V>({
     },
     set value(v) {
       update(toValue(v));
-    }
-  }
+    },
+  };
 }
 
 export function multipleOptions<V>({
   mapper,
   value,
   update,
 }: {
-  mapper: () => OptionsMapper<V>,
-  value: () => SchemaArrayValue | undefined,
-  update: (value: SchemaArrayValue) => void,
+  mapper: () => OptionsMapper<V>;
+  value: () => SchemaArrayValue | undefined;
+  update: (value: SchemaArrayValue) => void;
 }) {
   const { fromValue, toValue } = $derived(mapper());
   return {
@@ -78,6 +88,6 @@ export function multipleOptions<V>({
     },
     set value(v) {
       update(v.map(toValue));
-    }
-  }
+    },
+  };
 }
diff --git a/packages/form/src/lib/deep-equal.ts b/packages/form/src/lib/deep-equal.ts
@@ -1 +1,6 @@
-export { deepEqual } from 'fast-equals'
+import { deepEqual } from "fast-equals";
+
+export {
+  /** @deprecated use `isSchemaValueDeepEqual` or `isSchemaDeepEqual` from `form/core` */
+  deepEqual,
+};

-Original file line number
+Diff line change
@@ @@ -0,0 +1,5 @@ @@
 +---
 +"@sjsf/form": minor
 +---
++
 +Add `isSchemaValueDeepEqual` and `isSchemaDeepEqual` functions