@react-typed-forms/schemas 3.0.0-dev.81 → 3.0.0-dev.83

package/.rush/temp/package-deps_build.json

@@ -1,12 +1,12 @@
 {
   "files": {
     "packages/schemas/.rush/temp/shrinkwrap-deps.json": "6ad43bbf71e5f191d9f571da269a25bb4d9e8909",
-    "packages/schemas/package.json": "2a2b005eba683fc4f646ae80bb160f7a410085c8",
-    "packages/schemas/src/controlRender.tsx": "8f985c464635df4ea471535da80c2d002eb0b4a3",
-    "packages/schemas/src/hooks.ts": "89bcc068bd3a38a25f733cc1404649af82510e91",
+    "packages/schemas/package.json": "4849e807c422f7b462cccb4fc953e40198a08c8e",
+    "packages/schemas/src/controlRender.tsx": "b54a8e7ad36207ccd6684c30af2027789d9f806d",
+    "packages/schemas/src/hooks.ts": "a34545b7c63dc78ea77974f6c2fc386daaee80ea",
     "packages/schemas/src/index.ts": "b15fbb6de132cd912cf8141d5c4d2329e947546e",
-    "packages/schemas/src/schemaBuilder.ts": "3a36cbc35f70fca2b561f6d4ddc1bd1030eeb3f6",
-    "packages/schemas/src/types.ts": "286d1cee90481d4ef5e87a5b7d8b08fdcaede9d7",
+    "packages/schemas/src/schemaBuilder.ts": "4662698fd46ac14459f429ce24d919ef91992de2",
+    "packages/schemas/src/types.ts": "0f55d35f7e4b052a01bc433799647d8288e237ab",
     "packages/schemas/tsconfig.json": "52e4f044fa580f4e0ad5830f3cfca574e2788372"
   },
   "arguments": "rimraf ./lib/ && tsc "

package/lib/controlRender.d.ts

@@ -81,7 +81,8 @@ export declare function applyDefaultValues(v: {
 } | undefined, fields: SchemaField[]): any;
 export declare function applyDefaultForField(v: any, field: SchemaField, parent: SchemaField[], notElement?: boolean): any;
 export declare function defaultValueForFields(fields: SchemaField[]): any;
-export declare function defaultValueForField(sf: SchemaField, notElement?: boolean): any;
+export declare function defaultValueForField(sf: SchemaField): any;
+export declare function elementValueForField(sf: SchemaField): any;
 export declare function findScalarField(fields: SchemaField[], field: string): ScalarField | undefined;
 export declare function findCompoundField(fields: SchemaField[], field: string): CompoundField | undefined;
 export declare function findField(fields: SchemaField[], field: string): SchemaField | undefined;

package/lib/controlRender.js

@@ -23,7 +23,7 @@ var __importStar = (this && this.__importStar) || function (mod) {
     return result;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.isGroupControl = exports.isSchemaControl = exports.fieldForControl = exports.controlForField = exports.renderControl = exports.controlTitle = exports.fieldDisplayName = exports.findField = exports.findCompoundField = exports.findScalarField = exports.defaultValueForField = exports.defaultValueForFields = exports.applyDefaultForField = exports.applyDefaultValues = exports.isCompoundField = exports.isScalarField = exports.useFormRendererComponents = exports.FormRendererComponentsContext = void 0;
+exports.isGroupControl = exports.isSchemaControl = exports.fieldForControl = exports.controlForField = exports.renderControl = exports.controlTitle = exports.fieldDisplayName = exports.findField = exports.findCompoundField = exports.findScalarField = exports.elementValueForField = exports.defaultValueForField = exports.defaultValueForFields = exports.applyDefaultForField = exports.applyDefaultValues = exports.isCompoundField = exports.isScalarField = exports.useFormRendererComponents = exports.FormRendererComponentsContext = void 0;
 const types_1 = require("./types");
 const react_1 = __importStar(require("react"));
 const core_1 = require("@react-typed-forms/core");
@@ -55,7 +55,7 @@ function applyDefaultValues(v, fields) {
         out[x.field] =
             x.field in v
                 ? applyDefaultForField(v[x.field], x, fields)
-                : defaultValueForField(x, true);
+                : defaultValueForField(x);
     });
     return out;
 }
@@ -66,24 +66,37 @@ function applyDefaultForField(v, field, parent, notElement) {
         return ((_a = v) !== null && _a !== void 0 ? _a : []).map((x) => applyDefaultForField(x, field, parent, true));
     }
     if (isCompoundField(field)) {
+        if (!v && !field.required)
+            return v;
         return applyDefaultValues(v, field.treeChildren ? parent : field.children);
     }
-    return defaultValueForField(field, true);
+    return defaultValueForField(field);
 }
 exports.applyDefaultForField = applyDefaultForField;
 function defaultValueForFields(fields) {
-    return Object.fromEntries(fields.map((x) => [x.field, defaultValueForField(x, true)]));
+    return Object.fromEntries(fields.map((x) => [x.field, defaultValueForField(x)]));
 }
 exports.defaultValueForFields = defaultValueForFields;
-function defaultValueForField(sf, notElement) {
-    if (notElement && sf.collection)
+function defaultValueForField(sf) {
+    if (isCompoundField(sf)) {
+        return sf.required
+            ? sf.collection
+                ? []
+                : defaultValueForFields(sf.children)
+            : undefined;
+    }
+    if (sf.collection)
         return [];
+    return sf.defaultValue;
+}
+exports.defaultValueForField = defaultValueForField;
+function elementValueForField(sf) {
     if (isCompoundField(sf)) {
         return defaultValueForFields(sf.children);
     }
     return sf.defaultValue;
 }
-exports.defaultValueForField = defaultValueForField;
+exports.elementValueForField = elementValueForField;
 function findScalarField(fields, field) {
     return findField(fields, field);
 }
@@ -137,11 +150,11 @@ function DataRenderer({ hooks, formState, controlDef, wrapElem, fieldData, }) {
     const renderer = useFormRendererComponents();
     const props = hooks.useDataProperties(formState, controlDef, fieldData);
     const scalarControl = (_a = formState.data.fields[fieldData.field]) !== null && _a !== void 0 ? _a : (0, core_1.newControl)(undefined);
-    (0, core_1.useControlChangeEffect)(scalarControl, (c) => {
-        if (props.defaultValue && !c.current.value) {
-            c.value = props.defaultValue;
+    (0, core_1.useControlEffect)(() => scalarControl.value, (v) => {
+        if (props.defaultValue && !v) {
+            scalarControl.value = props.defaultValue;
         }
-    }, core_1.ControlChange.Value, [scalarControl, props.defaultValue], true);
+    }, true);
     if (!props.visible) {
         return react_1.default.createElement(react_1.default.Fragment, null);
     }

package/lib/hooks.js

@@ -21,16 +21,22 @@ function useIsControlVisible(definition, formState, useExpression) {
         return Boolean(useExpression(visibleExpression.expr, formState));
     }
     const schemaFields = formState.fields;
-    const typeControl = (0, react_1.useMemo)(() => {
+    const { typeControl, compoundField } = (0, react_1.useMemo)(() => {
         var _a, _b;
         const typeField = schemaFields.find((x) => (0, controlRender_1.isScalarField)(x) && x.isTypeField);
-        return ((_b = (typeField && ((_a = formState.data.fields) === null || _a === void 0 ? void 0 : _a[typeField.field]))) !== null && _b !== void 0 ? _b : (0, core_1.newControl)(undefined));
+        const typeControl = ((_b = (typeField &&
+            ((_a = formState.data.fields) === null || _a === void 0 ? void 0 : _a[typeField.field]))) !== null && _b !== void 0 ? _b : (0, core_1.newControl)(undefined));
+        const compoundField = (0, controlRender_1.isGroupControl)(definition) && definition.compoundField
+            ? formState.data.fields[definition.compoundField]
+            : undefined;
+        return { typeControl, compoundField };
     }, [schemaFields, formState.data]);
     const fieldName = (0, controlRender_1.fieldForControl)(definition);
     const onlyForTypes = (_b = (fieldName ? (0, controlRender_1.findField)(schemaFields, fieldName) : undefined)) === null || _b === void 0 ? void 0 : _b.onlyForTypes;
-    return (0, core_1.useControlValue)(() => !onlyForTypes ||
-        onlyForTypes.length === 0 ||
-        Boolean(typeControl.value && onlyForTypes.includes(typeControl.value)));
+    return (0, core_1.useControlValue)(() => (!compoundField || compoundField.value != null) &&
+        (!onlyForTypes ||
+            onlyForTypes.length === 0 ||
+            Boolean(typeControl.value && onlyForTypes.includes(typeControl.value))));
 }
 exports.useIsControlVisible = useIsControlVisible;
 function getDefaultScalarControlProperties(control, field, visible, defaultValue, readonly) {

package/lib/schemaBuilder.d.ts

@@ -29,8 +29,8 @@ export declare function stringField(displayName: string, options?: Partial<Omit<
     system?: boolean | undefined;
     collection?: boolean | undefined;
     onlyForTypes?: string[] | undefined;
-    entityRefType?: string | undefined;
     required?: boolean | undefined;
+    entityRefType?: string | undefined;
     parentField?: string | undefined;
     searchable?: boolean | undefined;
     defaultValue?: any;
@@ -64,8 +64,8 @@ export declare function intField(displayName: string, options?: Partial<Omit<Sca
     system?: boolean | undefined;
     collection?: boolean | undefined;
     onlyForTypes?: string[] | undefined;
-    entityRefType?: string | undefined;
     required?: boolean | undefined;
+    entityRefType?: string | undefined;
     parentField?: string | undefined;
     searchable?: boolean | undefined;
     defaultValue?: any;
@@ -82,8 +82,8 @@ export declare function boolField(displayName: string, options?: Partial<Omit<Sc
     system?: boolean | undefined;
     collection?: boolean | undefined;
     onlyForTypes?: string[] | undefined;
-    entityRefType?: string | undefined;
     required?: boolean | undefined;
+    entityRefType?: string | undefined;
     parentField?: string | undefined;
     searchable?: boolean | undefined;
     defaultValue?: any;

package/lib/schemaBuilder.js

@@ -76,6 +76,7 @@ function defaultCompoundField(field, displayName, collection) {
         treeChildren: false,
         children: [],
         onlyForTypes: [],
+        required: true,
     };
 }
 exports.defaultCompoundField = defaultCompoundField;

package/lib/types.d.ts

@@ -7,6 +7,7 @@ export interface SchemaField {
     system: boolean;
     collection: boolean;
     onlyForTypes: string[];
+    required: boolean;
 }
 export declare enum SchemaFieldType {
     Scalar = "Scalar",
@@ -26,7 +27,6 @@ export declare enum FieldType {
 }
 export interface ScalarField extends SchemaField {
     entityRefType: string;
-    required: boolean;
     parentField: string;
     searchable: boolean;
     defaultValue: any;
@@ -44,7 +44,7 @@ export interface CompoundField extends SchemaField {
     children: SchemaField[];
     treeChildren: boolean;
 }
-export type AnyControlDefinition = ControlDefinition | DataControlDefinition | GroupedControlsDefinition | ActionControlDefinition | DisplayControlDefinition;
+export type AnyControlDefinition = DataControlDefinition | GroupedControlsDefinition | ActionControlDefinition | DisplayControlDefinition;
 export interface ControlDefinition {
     type: string;
     title?: string;
@@ -156,12 +156,12 @@ export interface IconSelectionRenderOptions extends RenderOptions {
 export interface GroupedControlsDefinition extends ControlDefinition {
     type: ControlDefinitionType.Group;
     children: AnyControlDefinition[];
-    compoundField: string | undefined;
+    compoundField?: string;
     groupOptions: GroupRenderOptions;
 }
 export interface GroupRenderOptions {
     type: GroupRenderType;
-    hideTitle: boolean;
+    hideTitle?: boolean;
 }
 export declare enum GroupRenderType {
     Standard = "Standard",

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@react-typed-forms/schemas",
-	"version": "3.0.0-dev.81",
+	"version": "3.0.0-dev.83",
 	"description": "",
 	"main": "lib/index.js",
 	"types": "lib/index.d.ts",
@@ -24,7 +24,7 @@
 		"material-ui"
 	],
 	"dependencies": {
-		"@react-typed-forms/core": "3.0.0-dev.81"
+		"@react-typed-forms/core": "3.0.0-dev.83"
 	},
 	"devDependencies": {
 		"@types/react": "^18.0.22",

package/src/controlRender.tsx

@@ -14,11 +14,10 @@ import {
 } from "./types";
 import React, { createContext, Key, ReactElement, useContext } from "react";
 import {
-  AnyControl,
   Control,
   ControlChange,
   newControl,
-  useControlChangeEffect,
+  useControlEffect,
 } from "@react-typed-forms/core";
 
 export interface FormEditHooks {
@@ -175,7 +174,7 @@ export function applyDefaultValues(
     out[x.field] =
       x.field in v
         ? applyDefaultForField(v[x.field], x, fields)
-        : defaultValueForField(x, true);
+        : defaultValueForField(x);
   });
   return out;
 }
@@ -192,22 +191,31 @@ export function applyDefaultForField(
     );
   }
   if (isCompoundField(field)) {
+    if (!v && !field.required) return v;
     return applyDefaultValues(v, field.treeChildren ? parent : field.children);
   }
-  return defaultValueForField(field, true);
+  return defaultValueForField(field);
 }
 
 export function defaultValueForFields(fields: SchemaField[]): any {
   return Object.fromEntries(
-    fields.map((x) => [x.field, defaultValueForField(x, true)])
+    fields.map((x) => [x.field, defaultValueForField(x)])
   );
 }
 
-export function defaultValueForField(
-  sf: SchemaField,
-  notElement?: boolean
-): any {
-  if (notElement && sf.collection) return [];
+export function defaultValueForField(sf: SchemaField): any {
+  if (isCompoundField(sf)) {
+    return sf.required
+      ? sf.collection
+        ? []
+        : defaultValueForFields(sf.children)
+      : undefined;
+  }
+  if (sf.collection) return [];
+  return (sf as ScalarField).defaultValue;
+}
+
+export function elementValueForField(sf: SchemaField): any {
   if (isCompoundField(sf)) {
     return defaultValueForFields(sf.children);
   }
@@ -297,7 +305,7 @@ export function renderControl(
         />
       );
     default:
-      return <h1>Unknown control: {definition.type}</h1>;
+      return <h1>Unknown control: {(definition as any).type}</h1>;
   }
 
   function wrapElem(e: ReactElement): ReactElement {
@@ -322,15 +330,13 @@ function DataRenderer({
   const props = hooks.useDataProperties(formState, controlDef, fieldData);
   const scalarControl =
     formState.data.fields[fieldData.field] ?? newControl(undefined);
-  useControlChangeEffect(
-    scalarControl,
-    (c) => {
-      if (props.defaultValue && !c.current.value) {
-        c.value = props.defaultValue;
+  useControlEffect(
+    () => scalarControl.value,
+    (v) => {
+      if (props.defaultValue && !v) {
+        scalarControl.value = props.defaultValue;
       }
     },
-    ControlChange.Value,
-    [scalarControl, props.defaultValue],
     true
   );
   if (!props.visible) {
@@ -406,7 +412,7 @@ function GroupRenderer({
           properties: groupProps,
           renderChild: (k, c, data, wrapChild) =>
             renderControl(
-              c,
+              c as AnyControlDefinition,
               {
                 ...formState,
                 fields: compoundField!.children,

package/src/hooks.ts

@@ -17,6 +17,7 @@ import {
   findField,
   FormEditHooks,
   FormEditState,
+  isGroupControl,
   isScalarField,
 } from "./controlRender";
 import { useMemo } from "react";
@@ -54,26 +55,34 @@ export function useIsControlVisible(
   }
   const schemaFields = formState.fields;
 
-  const typeControl = useMemo(() => {
+  const { typeControl, compoundField } = useMemo(() => {
     const typeField = schemaFields.find(
       (x) => isScalarField(x) && x.isTypeField
     ) as ScalarField | undefined;
-    return ((typeField && formState.data.fields?.[typeField.field]) ??
+
+    const typeControl = ((typeField &&
+      formState.data.fields?.[typeField.field]) ??
       newControl(undefined)) as Control<string | undefined>;
+    const compoundField =
+      isGroupControl(definition) && definition.compoundField
+        ? formState.data.fields[definition.compoundField]
+        : undefined;
+    return { typeControl, compoundField };
   }, [schemaFields, formState.data]);
 
   const fieldName = fieldForControl(definition);
   const onlyForTypes = (
     fieldName ? findField(schemaFields, fieldName) : undefined
   )?.onlyForTypes;
+
   return useControlValue(
     () =>
-      !onlyForTypes ||
-      onlyForTypes.length === 0 ||
-      Boolean(typeControl.value && onlyForTypes.includes(typeControl.value))
+      (!compoundField || compoundField.value != null) &&
+      (!onlyForTypes ||
+        onlyForTypes.length === 0 ||
+        Boolean(typeControl.value && onlyForTypes.includes(typeControl.value)))
   );
 }
-
 export function getDefaultScalarControlProperties(
   control: DataControlDefinition,
   field: ScalarField,

package/src/schemaBuilder.ts

@@ -162,5 +162,6 @@ export function defaultCompoundField(
     treeChildren: false,
     children: [],
     onlyForTypes: [],
+    required: true,
   };
 }

package/src/types.ts

@@ -7,6 +7,7 @@ export interface SchemaField {
   system: boolean;
   collection: boolean;
   onlyForTypes: string[];
+  required: boolean;
 }
 
 export enum SchemaFieldType {
@@ -29,7 +30,6 @@ export enum FieldType {
 
 export interface ScalarField extends SchemaField {
   entityRefType: string;
-  required: boolean;
   parentField: string;
   searchable: boolean;
   defaultValue: any;
@@ -52,7 +52,6 @@ export interface CompoundField extends SchemaField {
 }
 
 export type AnyControlDefinition =
-  | ControlDefinition
   | DataControlDefinition
   | GroupedControlsDefinition
   | ActionControlDefinition
@@ -145,8 +144,8 @@ export enum DataRenderType {
   UserSelection = "UserSelection",
   Synchronised = "Synchronised",
   IconSelector = "IconSelector",
-  
-  DateTime = "DateTime"
+
+  DateTime = "DateTime",
 }
 
 export interface RadioButtonRenderOptions extends RenderOptions {}
@@ -172,7 +171,6 @@ export interface IconMapping {
 
 export interface CheckListRenderOptions extends RenderOptions {}
 
-
 export interface SynchronisedRenderOptions extends RenderOptions {
   fieldToSync: string;
   syncType: SyncTextType;
@@ -194,13 +192,13 @@ export interface IconSelectionRenderOptions extends RenderOptions {}
 export interface GroupedControlsDefinition extends ControlDefinition {
   type: ControlDefinitionType.Group;
   children: AnyControlDefinition[];
-  compoundField: string | undefined;
+  compoundField?: string;
   groupOptions: GroupRenderOptions;
 }
 
 export interface GroupRenderOptions {
   type: GroupRenderType;
-  hideTitle: boolean;
+  hideTitle?: boolean;
 }
 
 export enum GroupRenderType {