@react-typed-forms/schemas 7.0.0 → 7.2.0

package/lib/schemaBuilder.d.ts

@@ -41,7 +41,7 @@ export declare function stringOptionsField(displayName: string, ...options: Fiel
     displayName: string;
     options: FieldOption[];
 };
-export declare function withScalarOptions<S extends SchemaField>(options: Partial<SchemaField>, v: (name: string) => S): (name: string) => S;
+export declare function withScalarOptions<S extends SchemaField, S2 extends Partial<SchemaField>>(options: S2, v: (name: string) => S): (name: string) => S & S2;
 export declare function makeScalarField<S extends Partial<SchemaField>>(options: S): (name: string) => SchemaField & S;
 export declare function makeCompoundField<S extends Partial<CompoundField>>(options: S): (name: string) => CompoundField & {
     type: FieldType.Compound;

package/lib/types.d.ts

@@ -72,7 +72,8 @@ export declare enum DynamicPropertyType {
     Disabled = "Disabled",
     Display = "Display",
     Style = "Style",
-    LayoutStyle = "LayoutStyle"
+    LayoutStyle = "LayoutStyle",
+    AllowedOptions = "AllowedOptions"
 }
 export interface EntityExpression {
     type: string;

package/lib/util.d.ts

@@ -3,6 +3,7 @@ import { MutableRefObject } from "react";
 import { Control } from "@react-typed-forms/core";
 export interface ControlDataContext {
     groupControl: Control<any>;
+    root: Control<any>;
     fields: SchemaField[];
     schemaInterface: SchemaInterface;
 }

package/package.json

@@ -1,49 +1,49 @@
 {
-	"name": "@react-typed-forms/schemas",
-	"version": "7.0.0",
-	"description": "",
-	"main": "lib/index.js",
-	"types": "lib/index.d.ts",
-	"repository": {
-		"type": "git",
-		"url": "git+https://github.com/doolse/react-typed-forms.git"
-	},
-	"author": "Jolse Maginnis",
-	"license": "ISC",
-	"bugs": {
-		"url": "https://github.com/doolse/react-typed-forms/issues"
-	},
-	"homepage": "https://github.com/doolse/react-typed-forms#readme",
-	"publishConfig": {
-		"access": "public"
-	},
-	"keywords": [
-		"react",
-		"typescript",
-		"forms",
-		"material-ui"
-	],
-	"dependencies": {
-		"@react-typed-forms/core": "^3.0.0",
-		"clsx": "^1 || ^2",
-		"jsonata": "^2.0.4",
-		"react": "^18.2.0"
-	},
-	"devDependencies": {
-		"@react-typed-forms/transform": "^0.2.0",
-		"@types/react": "^18.2.28",
-		"markdown-magic": "^2.6.1",
-		"microbundle": "^0.15.1",
-		"nswag": "^13.18.2",
-		"prettier": "^3.0.3",
-		"rimraf": "^3.0.2",
-		"typescript": "^5.2.2"
-	},
-	"gitHead": "698e16cd3ab31b7dd0528fc76536f4d3205ce8c6",
-	"scripts": {
-		"build": "rimraf ./lib/ && microbundle -f cjs --no-compress --jsx React.createElement --jsxFragment React.Fragment",
-		"watch": "microbundle -w -f cjs --no-compress --jsx React.createElement --jsxFragment React.Fragment",
-		"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"
-	}
-}
+  "name": "@react-typed-forms/schemas",
+  "version": "7.2.0",
+  "description": "",
+  "main": "lib/index.js",
+  "types": "lib/index.d.ts",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/doolse/react-typed-forms.git"
+  },
+  "author": "Jolse Maginnis",
+  "license": "ISC",
+  "bugs": {
+    "url": "https://github.com/doolse/react-typed-forms/issues"
+  },
+  "homepage": "https://github.com/doolse/react-typed-forms#readme",
+  "publishConfig": {
+    "access": "public"
+  },
+  "keywords": [
+    "react",
+    "typescript",
+    "forms",
+    "material-ui"
+  ],
+  "dependencies": {
+    "@react-typed-forms/core": "^3.0.0",
+    "clsx": "^1 || ^2",
+    "jsonata": "^2.0.4",
+    "react": "^18.2.0"
+  },
+  "devDependencies": {
+    "@react-typed-forms/transform": "^0.2.0",
+    "@types/react": "^18.2.28",
+    "markdown-magic": "^2.6.1",
+    "microbundle": "^0.15.1",
+    "nswag": "^13.18.2",
+    "prettier": "^3.0.3",
+    "rimraf": "^3.0.2",
+    "typescript": "^5.2.2"
+  },
+  "gitHead": "698e16cd3ab31b7dd0528fc76536f4d3205ce8c6",
+  "scripts": {
+    "build": "rimraf ./lib/ && microbundle -f cjs --no-compress --jsx React.createElement --jsxFragment React.Fragment",
+    "watch": "microbundle -w -f cjs --no-compress --jsx React.createElement --jsxFragment React.Fragment",
+    "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/src/controlRender.tsx

@@ -44,6 +44,7 @@ import {
 import { dataControl } from "./controlBuilder";
 import {
   defaultUseEvalExpressionHook,
+  useEvalAllowedOptionsHook,
   useEvalDefaultValueHook,
   useEvalDisabledHook,
   useEvalDisplayHook,
@@ -208,6 +209,7 @@ export interface DataControlProps {
   style: React.CSSProperties | undefined;
   childCount: number;
   renderChild: ChildRenderer;
+  allowedOptions?: Control<any[] | undefined>;
   elementRenderer?: (elemProps: Control<any>) => ReactNode;
 }
 export type CreateDataProps = (
@@ -219,6 +221,7 @@ export interface ControlRenderOptions extends FormContextOptions {
   useEvalExpressionHook?: UseEvalExpressionHook;
   clearHidden?: boolean;
   schemaInterface?: SchemaInterface;
+  dataRoot?: Control<any>;
 }
 export function useControlRenderer(
   definition: ControlDefinition,
@@ -239,6 +242,7 @@ export function useControlRenderer(
   const useIsVisible = useEvalVisibilityHook(useExpr, definition, schemaField);
   const useIsReadonly = useEvalReadonlyHook(useExpr, definition);
   const useIsDisabled = useEvalDisabledHook(useExpr, definition);
+  const useAllowedOptions = useEvalAllowedOptionsHook(useExpr, definition);
   const useCustomStyle = useEvalStyleHook(
     useExpr,
     DynamicPropertyType.Style,
@@ -262,6 +266,7 @@ export function useControlRenderer(
           groupControl: parentControl,
           fields,
           schemaInterface,
+          root: options.dataRoot ?? parentControl,
         };
         const readonlyControl = useIsReadonly(dataContext);
         const disabledControl = useIsDisabled(dataContext);
@@ -289,6 +294,7 @@ export function useControlRenderer(
           },
         );
 
+        const allowedOptions = useAllowedOptions(dataContext);
         const defaultValueControl = useDefaultValue(dataContext);
         const [control, childContext] = getControlData(
           schemaField,
@@ -327,6 +333,7 @@ export function useControlRenderer(
             useControlRenderer(cd, childContext.fields, renderer, {
               ...options,
               ...myOptions,
+              dataRoot: dataContext.root,
             }),
           ) ?? [];
         useEffect(() => {
@@ -353,6 +360,7 @@ export function useControlRenderer(
           schemaField,
           displayControl,
           style: customStyle,
+          allowedOptions,
         });
         const renderedControl = renderer.renderLayout({
           ...labelAndChildren,
@@ -374,6 +382,7 @@ export function useControlRenderer(
       useIsDisabled,
       useCustomStyle,
       useLayoutStyle,
+      useAllowedOptions,
       useDynamicDisplay,
       useValidation,
       renderer,
@@ -390,8 +399,8 @@ export function lookupSchemaField(
   const fieldName = isGroupControlsDefinition(c)
     ? c.compoundField
     : isDataControlDefinition(c)
-    ? c.field
-    : undefined;
+      ? c.field
+      : undefined;
   return fieldName ? findField(fields, fieldName) : undefined;
 }
 export function getControlData(
@@ -405,9 +414,9 @@ export function getControlData(
     childControl,
     schemaField && isCompoundField(schemaField)
       ? {
+          ...parentContext,
           groupControl: childControl!,
           fields: schemaField.children,
-          schemaInterface: parentContext.schemaInterface,
         }
       : parentContext,
   ];
@@ -437,15 +446,22 @@ export function defaultDataProps({
   options,
   elementRenderer,
   style,
+  allowedOptions,
   ...props
 }: DataControlProps): DataRendererProps {
   const className = cc(definition.styleClass);
   const required = !!definition.required;
+  const fieldOptions =
+    (field.options?.length ?? 0) === 0 ? null : field.options;
+  const allowed = allowedOptions?.value ?? [];
   return {
     control,
     field,
     id: "c" + control.uniqueId,
-    options: (field.options?.length ?? 0) === 0 ? null : field.options,
+    options:
+      fieldOptions && allowed.length > 0
+        ? fieldOptions.filter((x) => allowed.includes(x.value))
+        : fieldOptions,
     readonly: !!options.readonly,
     renderOptions: definition.renderOptions ?? { type: "Standard" },
     required,
@@ -516,6 +532,7 @@ export interface RenderControlProps {
   schemaField?: SchemaField;
   displayControl?: Control<string | undefined>;
   style?: React.CSSProperties;
+  allowedOptions?: Control<any[] | undefined>;
 }
 export function renderControlLayout({
   definition: c,
@@ -529,6 +546,7 @@ export function renderControlLayout({
   createDataProps: dataProps,
   displayControl,
   style,
+  allowedOptions,
 }: RenderControlProps): ControlLayoutProps {
   if (isDataControlDefinition(c)) {
     return renderData(c);
@@ -593,6 +611,7 @@ export function renderControlLayout({
       options: dataOptions,
       style,
       childCount,
+      allowedOptions,
       renderChild: childRenderer,
       elementRenderer:
         elementControl == null && schemaField.collection

package/src/hooks.tsx

@@ -105,6 +105,24 @@ export function useEvalStyleHook(
   );
 }
 
+export function useEvalAllowedOptionsHook(
+  useEvalExpressionHook: UseEvalExpressionHook,
+  definition: ControlDefinition,
+): EvalExpressionHook<any[]> {
+  const dynamicAllowed = useEvalDynamicHook(
+    definition,
+    DynamicPropertyType.AllowedOptions,
+    useEvalExpressionHook,
+  );
+  return useCallback(
+    (ctx) => {
+      if (dynamicAllowed) return dynamicAllowed(ctx);
+      return useControl([]);
+    },
+    [dynamicAllowed],
+  );
+}
+
 export function useEvalDisabledHook(
   useEvalExpressionHook: UseEvalExpressionHook,
   definition: ControlDefinition,
@@ -203,6 +221,7 @@ export function defaultEvalHooks(
       return useJsonataExpression(
         (expr as JsonataExpression).expression,
         context.groupControl,
+        context.root,
       );
     case ExpressionType.Data:
       return useDataExpression(
@@ -280,20 +299,21 @@ export function hideDisplayOnly(
 export function useJsonataExpression(
   jExpr: string,
   data: Control<any>,
+  root: Control<any>,
 ): Control<any> {
   const compiledExpr = useMemo(() => {
     try {
       return jsonata(jExpr);
     } catch (e) {
       console.error(e);
-      return jsonata("");
+      return jsonata("null");
     }
   }, [jExpr]);
   const control = useControl();
   useControlEffect(
-    () => data.value,
-    async (v) => {
-      control.value = await compiledExpr.evaluate(v);
+    () => [data.value, root.value],
+    async ([v, rv]) => {
+      control.value = await compiledExpr.evaluate(v, { root: rv });
     },
     true,
   );

package/src/schemaBuilder.ts

@@ -5,22 +5,22 @@ type AllowedSchema<T> = T extends string
       type: FieldType.String | FieldType.Date | FieldType.DateTime;
     }
   : T extends number
-  ? SchemaField & {
-      type: FieldType.Int | FieldType.Double;
-    }
-  : T extends boolean
-  ? SchemaField & {
-      type: FieldType.Bool;
-    }
-  : T extends Array<infer E>
-  ? AllowedSchema<E> & {
-      collection: true;
-    }
-  : T extends { [key: string]: any }
-  ? CompoundField & {
-      type: FieldType.Compound;
-    }
-  : SchemaField & { type: FieldType.Any };
+    ? SchemaField & {
+        type: FieldType.Int | FieldType.Double;
+      }
+    : T extends boolean
+      ? SchemaField & {
+          type: FieldType.Bool;
+        }
+      : T extends Array<infer E>
+        ? AllowedSchema<E> & {
+            collection: true;
+          }
+        : T extends { [key: string]: any }
+          ? CompoundField & {
+              type: FieldType.Compound;
+            }
+          : SchemaField & { type: FieldType.Any };
 
 type AllowedField<T, K> = (
   name: string,
@@ -56,10 +56,10 @@ export function stringOptionsField(
   });
 }
 
-export function withScalarOptions<S extends SchemaField>(
-  options: Partial<SchemaField>,
-  v: (name: string) => S,
-): (name: string) => S {
+export function withScalarOptions<
+  S extends SchemaField,
+  S2 extends Partial<SchemaField>,
+>(options: S2, v: (name: string) => S): (name: string) => S & S2 {
   return (n) => ({ ...v(n), ...options });
 }
 

package/src/types.ts

@@ -90,6 +90,7 @@ export enum DynamicPropertyType {
   Display = "Display",
   Style = "Style",
   LayoutStyle = "LayoutStyle",
+  AllowedOptions = "AllowedOptions"
 }
 
 export interface EntityExpression {

package/src/util.ts

@@ -22,6 +22,7 @@ import clsx from "clsx";
 
 export interface ControlDataContext {
   groupControl: Control<any>;
+  root: Control<any>;
   fields: SchemaField[];
   schemaInterface: SchemaInterface;
 }
@@ -318,9 +319,9 @@ export function visitControlData<A>(
           const cfResult = visitControlDataArray(
             children,
             {
+              ...ctx,
               fields: fieldData.children,
               groupControl: c,
-              schemaInterface: ctx.schemaInterface,
             },
             cb,
           );

package/src/validators.ts

@@ -70,7 +70,11 @@ function useJsonataValidator(
   hidden: boolean,
   i: number,
 ) {
-  const errorMsg = useJsonataExpression(expr.expression, context.groupControl);
+  const errorMsg = useJsonataExpression(
+    expr.expression,
+    context.groupControl,
+    context.root,
+  );
   useControlEffect(
     () => [hidden, errorMsg.value],
     ([hidden, msg]) => control.setError("jsonata" + i, !hidden ? msg : null),