@react-typed-forms/schemas 14.0.3 → 14.0.5

package/lib/schemaField.d.ts

@@ -212,7 +212,7 @@ export interface SchemaDataNode {
     id: string;
     schema: SchemaNode;
     elementIndex?: number;
-    control?: Control<unknown>;
+    control: Control<any>;
     parent?: SchemaDataNode;
     getChild(schemaNode: SchemaNode): SchemaDataNode;
     getChildElement(index: number): SchemaDataNode;
@@ -221,7 +221,7 @@ export declare function findField(fields: SchemaField[], field: string): SchemaF
 export declare function isScalarField(sf: SchemaField): sf is SchemaField;
 export declare function isCompoundField(sf: SchemaField): sf is CompoundField;
 export declare function createSchemaLookup<A extends Record<string, SchemaField[]>>(schemaMap: A): SchemaTreeLookup<keyof A>;
-export declare function makeSchemaDataNode(schema: SchemaNode, control?: Control<unknown>, parent?: SchemaDataNode, elementIndex?: number): SchemaDataNode;
+export declare function makeSchemaDataNode(schema: SchemaNode, control: Control<unknown>, parent?: SchemaDataNode, elementIndex?: number): SchemaDataNode;
 export declare function schemaDataForFieldRef(fieldRef: string | undefined, schema: SchemaDataNode): SchemaDataNode;
 export declare function schemaForFieldRef(fieldRef: string | undefined, schema: SchemaNode): SchemaNode;
 export declare function traverseSchemaPath<A>(fieldPath: string[], schema: SchemaNode, acc: A, next: (acc: A, node: SchemaNode) => A): A;
@@ -243,7 +243,8 @@ export declare enum SchemaTags {
     NoControl = "_NoControl",
     HtmlEditor = "_HtmlEditor",
     ControlGroup = "_ControlGroup:",
-    ControlRef = "_ControlRef:"
+    ControlRef = "_ControlRef:",
+    IdField = "_IdField:"
 }
 export declare function getTagParam(field: SchemaField, tag: string): string | undefined;
 export declare function makeParamTag(tag: string, value: string): string;

package/lib/util.d.ts

@@ -1,6 +1,6 @@
 import { ControlActionHandler, ControlDefinition, DataControlDefinition, DisplayOnlyRenderOptions, GroupRenderOptions } from "./controlDefinition";
 import { MutableRefObject } from "react";
-import { CompoundField, FieldOption, SchemaField, SchemaNode } from "./schemaField";
+import { CompoundField, FieldOption, SchemaDataNode, SchemaField, SchemaNode } from "./schemaField";
 /**
  * Interface representing the classes for a control.
  */
@@ -243,3 +243,4 @@ export declare function isControlDisplayOnly(def: ControlDefinition): boolean;
  * @returns {ControlActionHandler} - The combined action handler.
  */
 export declare function actionHandlers(...handlers: (ControlActionHandler | undefined)[]): ControlActionHandler;
+export declare function getDiffObject(dataNode: SchemaDataNode, force?: boolean): any;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@react-typed-forms/schemas",
-  "version": "14.0.3",
+  "version": "14.0.5",
   "description": "",
   "type": "module",
   "main": "lib/index.cjs",
@@ -42,6 +42,11 @@
   "devDependencies": {
     "react": "^18.2.0",
     "@react-typed-forms/transform": "^0.2.0",
+    "jest": "^29.7.0",
+    "tsx": "^4.19.1",
+    "fast-check": "^3.22.0",
+    "ts-jest": "^29.2.5",
+    "@jest/globals": "^29.7.0",
     "typedoc": "^0.27.2",
     "@types/uuid": "^10.0.0",
     "@types/react": "^18.2.28",
@@ -51,12 +56,13 @@
     "prettier": "^3.0.3",
     "rimraf": "^3.0.2",
     "typescript": "^5.6.2",
-    "@react-typed-forms/core": "4.0.0"
+    "@react-typed-forms/core": "4.0.3"
   },
   "gitHead": "698e16cd3ab31b7dd0528fc76536f4d3205ce8c6",
   "scripts": {
     "build": "rimraf ./lib/ node_modules/.cache && microbundle -f modern,cjs --jsx React.createElement --jsxFragment React.Fragment",
     "watch": "microbundle -w -f modern,cjs --no-compress --jsx React.createElement --jsxFragment React.Fragment",
+    "test": "jest --coverage",
     "update-readme": "md-magic --path README.md",
     "gencode": "nswag swagger2tsclient /input:http://localhost:5216/swagger/v1/swagger.json /runtime:Net60 /output:src/types.ts /GenerateClientClasses:false /MarkOptionalProperties:false /Template:Fetch /TypeStyle:Interface /DateTimeType:string"
   }

package/test/diff.test.ts

@@ -0,0 +1,146 @@
+import { describe, expect, it } from "@jest/globals";
+import fc from "fast-check";
+import { makeDataNode, newIndexes, valueAndSchema } from "./gen";
+import { getDiffObject, getTagParam, SchemaDataNode, SchemaTags } from "../src";
+import {
+  deepEquals,
+  newElement,
+  updateElements,
+} from "@react-typed-forms/core";
+
+describe("diff", () => {
+  it("unchanged value always returns undefined", () => {
+    fc.assert(
+      fc.property(valueAndSchema(), (fv) => {
+        const dataNode = makeDataNode(fv);
+        expect(getDiffObject(dataNode)).toBeUndefined();
+      }),
+    );
+  });
+
+  it("primitive value always returns new value", () => {
+    fc.assert(
+      fc.property(
+        valueAndSchema({ arrayChance: 0, compoundChance: 0 }),
+        (fv) => {
+          const dataNode = makeDataNode(fv);
+          const control = dataNode.control!;
+          control.setValue((x) => fv.newValue);
+          expect(getDiffObject(dataNode)).toBe(control.value);
+        },
+      ),
+    );
+  });
+
+  it("compound fields only return changed values", () => {
+    fc.assert(
+      fc.property(
+        valueAndSchema({
+          arrayChance: 0,
+          compoundChance: 0,
+          forceCompound: true,
+        }),
+        (fv) => {
+          const dataNode = makeDataNode(fv);
+          const control = dataNode.control!;
+          control.value = fv.newValue;
+          const changed = dataNode.schema
+            .getChildNodes()
+            .map((x) => x.field.field)
+            .filter((x) => fv.value?.[x] !== fv.newValue?.[x])
+            .map((x) => [x, fv.newValue?.[x]]);
+          expect(getDiffObject(dataNode)).toStrictEqual(
+            changed.length ? Object.fromEntries(changed) : undefined,
+          );
+        },
+      ),
+    );
+  });
+
+  it("array compound with id field always returns id field and changes", () => {
+    fc.assert(
+      fc.property(
+        valueAndSchema({
+          forceArray: true,
+          forceCompound: true,
+          arrayChance: 0,
+          compoundChance: 0,
+          idField: true,
+        }),
+        (fv) => {
+          const dataNode = makeDataNode(fv);
+          const arrayControl = dataNode.control!;
+          arrayControl.value = fv.newValue;
+          const idField = getTagParam(
+            dataNode.schema.field,
+            SchemaTags.IdField,
+          );
+          const origValues = (fv.value ?? []) as any[];
+          const newValues = (fv.newValue ?? []) as any[];
+          const expected = newValues.map((nv, i) => {
+            if (nv == null) return null;
+            return objectDiff(dataNode, origValues[i], nv, idField);
+          });
+          expect(getDiffObject(dataNode)).toStrictEqual(
+            arrayControl.dirty ? expected : undefined,
+          );
+        },
+      ),
+    );
+  });
+
+  it("array without id always returns array index edit format", () => {
+    fc.assert(
+      fc.property(
+        valueAndSchema({
+          forceArray: true,
+          forceCompound: true,
+          arrayChance: 0,
+          compoundChance: 0,
+        })
+          .filter((x) => !deepEquals(x.newValue, x.value) && x.value != null)
+          .chain((x) => newIndexes(x.value.length).map((i) => [x, i] as const)),
+        ([fv, indexes]) => {
+          const dataNode = makeDataNode(fv);
+          const arrayControl = dataNode.control!.as<any[]>();
+          const newValue = fv.newValue as any[];
+          const results = Array.from({ length: newValue.length });
+          updateElements(arrayControl, (x) => {
+            const sorted = indexes.map((ni, i) => {
+              const c = x[ni];
+              c.value = newValue[i];
+              results[i] = {
+                old: ni,
+                edit: objectDiff(dataNode, c.initialValue, c.value),
+              };
+              return c;
+            });
+            while (newValue.length > sorted.length) {
+              const ne = newElement(arrayControl, undefined);
+              ne.value = newValue[sorted.length];
+              results[sorted.length] = { old: undefined, edit: ne.value };
+              sorted.push(ne);
+            }
+            return sorted;
+          });
+          expect(getDiffObject(dataNode)).toStrictEqual(results);
+        },
+      ),
+    );
+  });
+});
+
+function objectDiff(
+  dataNode: SchemaDataNode,
+  oldValue: Record<string, any> | undefined | null,
+  newValue: Record<string, any> | undefined | null,
+  idField?: string,
+) {
+  if (newValue == null) return oldValue == null ? undefined : newValue;
+  const changed = dataNode.schema
+    .getChildNodes()
+    .map((x) => x.field.field)
+    .filter((x) => x == idField || oldValue?.[x] !== newValue[x])
+    .map((x) => [x, newValue[x]]);
+  return changed.length ? Object.fromEntries(changed) : undefined;
+}

package/test/gen.ts

@@ -0,0 +1,220 @@
+import fc, { Arbitrary } from "fast-check";
+import {
+  CompoundField,
+  createSchemaLookup,
+  FieldType,
+  getTagParam,
+  isCompoundField,
+  makeSchemaDataNode,
+  SchemaDataNode,
+  SchemaField,
+  SchemaTags,
+} from "../src";
+import { newControl } from "@react-typed-forms/core";
+
+export interface FieldAndValue {
+  field: SchemaField;
+  value: any;
+}
+
+export interface FieldAndValueChanged extends FieldAndValue {
+  newValue: any;
+}
+
+export function newIndexes(arr: number): Arbitrary<number[]> {
+  return fc.array(fc.integer(), { minLength: arr, maxLength: arr }).map((x) =>
+    x
+      .map((n, i) => ({ n, i }))
+      .sort((a, b) => a.n - b.n)
+      .map((x) => x.i),
+  );
+}
+export function valueAndSchema(
+  schemaOptions?: SchemaFieldGenOptions,
+): Arbitrary<FieldAndValueChanged> {
+  return randomSchemaField(schemaOptions)
+    .chain((schema) =>
+      randomValueForField(schema).map((value) => ({
+        field: schema,
+        value,
+      })),
+    )
+    .chain(changedValue);
+}
+
+export function changedValue(
+  val: FieldAndValue,
+): Arbitrary<FieldAndValueChanged> {
+  return changeValue(val.value, val.field, true).map((newValue) => ({
+    ...val,
+    newValue,
+  }));
+}
+
+export function makeDataNode(fv: FieldAndValue): SchemaDataNode {
+  return makeSchemaDataNode(
+    createSchemaLookup({ "": [fv.field] })
+      .getSchema("")!
+      .getChildNode(fv.field.field)!,
+    newControl(fv.value),
+  );
+}
+
+export interface SchemaFieldGenOptions {
+  arrayChance?: number;
+  forceCompound?: boolean;
+  forceArray?: boolean;
+  compoundChance?: number;
+  idField?: boolean;
+}
+function randomSchemaField(
+  options: SchemaFieldGenOptions = {},
+): Arbitrary<SchemaField> {
+  const {
+    arrayChance = 5,
+    compoundChance = 10,
+    forceCompound,
+    forceArray,
+    idField,
+  } = options;
+  const nextOptions = { arrayChance, compoundChance };
+  const field = fc.oneof(
+    {
+      weight: forceCompound ? 100 : compoundChance,
+      arbitrary: fc.constant(FieldType.Compound),
+    },
+    {
+      weight: forceCompound ? 0 : 100 - compoundChance,
+      arbitrary: fc.constantFrom(
+        FieldType.String,
+        FieldType.Int,
+        FieldType.Double,
+        FieldType.Bool,
+        FieldType.Date,
+        FieldType.DateTime,
+        FieldType.Time,
+      ),
+    },
+  );
+  const collection = fc.oneof(
+    {
+      weight: forceArray ? 0 : 100 - arrayChance,
+      arbitrary: fc.constant(false),
+    },
+    {
+      weight: forceArray ? 100 : arrayChance,
+      arbitrary: fc.constant(true),
+    },
+  );
+
+  const withoutId = field.chain((fieldType) =>
+    fc.record({
+      field: fc.string(),
+      type: fc.constant(fieldType),
+      collection,
+      notNullable: fc.boolean(),
+      children:
+        fieldType == FieldType.Compound
+          ? fc
+              .array(randomSchemaField(nextOptions), {
+                minLength: 1,
+                maxLength: 10,
+              })
+              .map((x) =>
+                Object.values(Object.fromEntries(x.map((y) => [y.field, y]))),
+              )
+          : fc.constant(null),
+    }),
+  );
+  return !idField
+    ? withoutId
+    : withoutId.chain((x) =>
+        fc.integer({ min: 0, max: (x.children?.length ?? 0) - 1 }).map((i) => ({
+          ...x,
+          tags: [SchemaTags.IdField + x.children![i].field],
+        })),
+      );
+}
+function randomValueForField(
+  f: SchemaField,
+  element?: boolean,
+): Arbitrary<any> {
+  return fc.integer({ min: 0, max: 100 }).chain(((nc) => {
+    if (nc <= 75 || f.notNullable) {
+      if (!element && f.collection) {
+        return fc.array(randomValueForField(f, true), {
+          minLength: 0,
+          maxLength: 10,
+        });
+      }
+      if (f.type === FieldType.String) return fc.string();
+      if (f.type === FieldType.Int) return fc.integer();
+      if (f.type === FieldType.Double) return fc.double({ noNaN: true });
+      if (f.type === FieldType.Bool) return fc.boolean();
+      if (f.type === FieldType.Date)
+        return fc.date().map((x) => x.toISOString().substring(0, 10));
+      if (f.type === FieldType.DateTime)
+        return fc.date().map((x) => x.toISOString());
+      if (f.type === FieldType.Time)
+        return fc.date().map((x) => x.toISOString().substring(11));
+      if (isCompoundField(f))
+        return fc.record(
+          Object.fromEntries(
+            f.children.map((x) => [x.field, randomValueForField(x)]),
+          ),
+        );
+    }
+    return fc.constantFrom(null);
+  }) as (x: number) => Arbitrary<any>);
+}
+
+export function changeValue(
+  value: any,
+  field: SchemaField,
+  forceChange: boolean | undefined,
+  element?: boolean,
+): Arbitrary<any> {
+  return fc.boolean().chain((shouldChange) => {
+    if (forceChange === false || (!shouldChange && !forceChange))
+      return fc.constant(value);
+    if (field.collection && !element) {
+      if (!value || !value.length)
+        return changeValue(undefined, field, true, true).map((x) => [x]);
+      return (value as any[]).reduce(
+        (acc, x) =>
+          acc.chain((nx: any[]) =>
+            changeValue(x, field, undefined, true).map((v) => [...nx, v]),
+          ),
+        fc.constant([] as any[]),
+      );
+    }
+    if (isCompoundField(field)) {
+      return fc.record(
+        Object.fromEntries(
+          field.children.map((x) => [
+            x.field,
+            changeValue(value?.[x.field], x, value == null ? true : undefined),
+          ]),
+        ),
+      );
+    }
+    return fc.constant(changePrim() as any);
+    function changePrim() {
+      switch (field.type) {
+        case FieldType.String:
+        case FieldType.Date:
+        case FieldType.DateTime:
+        case FieldType.Time:
+          return (value ?? "") + "x";
+        case FieldType.Int:
+          const v = value ?? 0;
+          return !v ? 1 : -v;
+        case FieldType.Double:
+          const dv = value ?? 0;
+          return !dv ? 1 : -dv;
+        case FieldType.Bool:
+          return !(value ?? false);
+      }
+    }
+  });
+}

package/test/play.ts

@@ -0,0 +1,54 @@
+import {
+  changeValue,
+  FieldAndValue,
+  FieldAndValueChanged,
+  makeDataNode,
+} from "./gen";
+import { getDiffObject } from "../src";
+import { updateElements } from "@react-typed-forms/core";
+
+const testData = [
+  {
+    field: {
+      field: ")W",
+      type: "Compound",
+      collection: true,
+      notNullable: true,
+      children: [
+        {
+          field: "4N`rCgnDXm",
+          type: "DateTime",
+          collection: false,
+          notNullable: false,
+          children: null,
+        },
+      ],
+    },
+    value: [
+      { "4N`rCgnDXm": "1970-01-01T00:00:00.000Z" },
+      { "4N`rCgnDXm": "1970-01-01T00:00:00.000Z" },
+      { "4N`rCgnDXm": "1970-01-01T00:00:00.000Z" },
+    ],
+    newValue: [
+      { "4N`rCgnDXm": "1970-01-01T00:00:00.000Zx" },
+      { "4N`rCgnDXm": "1970-01-01T00:00:00.000Z" },
+      { "4N`rCgnDXm": "1970-01-01T00:00:00.000Zz" },
+    ],
+  } as FieldAndValueChanged,
+  [2, 0, 1],
+] as [FieldAndValueChanged, number[]];
+
+const [fv, indexes] = testData;
+const dataNode = makeDataNode(fv);
+const arrayControl = dataNode.control!;
+
+const newValue = fv.newValue as any[];
+updateElements(arrayControl.as<any[]>(), (x) => {
+  const sorted = indexes.map((ni, i) => {
+    const c = x[ni];
+    c.value = newValue[i];
+    return c;
+  });
+  return sorted;
+});
+console.log(getDiffObject(dataNode));

package/tsconfig.json

@@ -13,7 +13,7 @@
     "moduleResolution": "node",
     "resolveJsonModule": true,
     "isolatedModules": true,
-    "jsx": "preserve",
+    "jsx": "react",
     "outDir": "lib"
   },
   "include": ["src/**/*.ts", "src/**/*.tsx"],