@react-typed-forms/schemas 15.2.0 → 16.0.0

package/src/createFormRenderer.tsx

@@ -1,6 +1,5 @@
-import React, { ReactNode } from "react";
+import { ReactNode } from "react";
 import {
-  ActionRendererProps,
   AdornmentProps,
   AdornmentRenderer,
   ArrayRendererProps,
@@ -27,7 +26,8 @@ import {
   RendererRegistration,
   VisibilityRendererRegistration,
 } from "./renderers";
-import { DataRenderType } from "./controlDefinition";
+import { DataRenderType } from "@astroapps/forms-core";
+import { ActionRendererProps } from "./types";
 
 export function createFormRenderer(
   customRenderers: RendererRegistration[] = [],
@@ -59,7 +59,6 @@ export function createFormRenderer(
     renderLayout,
     renderVisibility,
     renderLabelText,
-    renderText: defaultRenderers.renderText,
     html: defaultRenderers.html,
   };
 
@@ -125,7 +124,7 @@ export function createFormRenderer(
       if (noMatch === true) return false;
       const matchCollection =
         (x.collection ?? false) ===
-        (props.elementIndex == null && (field.collection ?? false));
+        (props.dataNode.elementIndex == null && (field.collection ?? false));
       const isSchemaAllowed =
         !!x.schemaType && renderType == DataRenderType.Standard
           ? isOneOf(x.schemaType, field.type)

package/src/index.ts

@@ -1,14 +1,8 @@
-export * from "./controlDefinition";
-export * from "./schemaBuilder";
+export * from "@astroapps/forms-core";
 export * from "./controlBuilder";
 export * from "./controlRender";
 export * from "./util";
 export * from "./renderers";
-export * from "./validators";
-export * from "./hooks";
-export * from "./defaultSchemaInterface";
 export * from "./createFormRenderer";
-export * from "./dynamicHooks";
-export * from "./schemaValidator";
-export * from "./schemaField";
-export * from "./entityExpression";
+export * from "./RenderForm";
+export * from "./types";

package/src/renderers.tsx

@@ -1,6 +1,5 @@
 import { ReactElement, ReactNode } from "react";
 import {
-  ActionRendererProps,
   AdornmentProps,
   AdornmentRenderer,
   ArrayRendererProps,
@@ -23,7 +22,8 @@ import {
   OptionalAdornment,
   RenderOptions,
   SetFieldAdornment,
-} from "./controlDefinition";
+} from "@astroapps/forms-core";
+import { ActionRendererProps } from "./types";
 
 export interface DefaultRenderers {
   data: DataRendererRegistration;
@@ -36,7 +36,6 @@ export interface DefaultRenderers {
   renderLayout: LayoutRendererRegistration;
   visibility: VisibilityRendererRegistration;
   extraRenderers: RendererRegistration[];
-  renderText: (props: ReactNode) => ReactNode;
   html: HtmlComponents;
 }
 

package/src/types.ts

@@ -0,0 +1,52 @@
+import {
+  ActionStyle,
+  EntityExpression,
+  FormContextData,
+  IconPlacement,
+  IconReference,
+  SchemaDataNode,
+  SchemaInterface,
+} from "@astroapps/forms-core";
+import React, { Key, ReactNode } from "react";
+import { CleanupScope } from "@react-typed-forms/core";
+
+/**
+ * Interface representing the control data context.
+ */
+export interface ControlDataContext {
+  schemaInterface: SchemaInterface;
+  dataNode: SchemaDataNode | undefined;
+  parentNode: SchemaDataNode;
+  variables: Record<string, any>;
+}
+
+export type ControlActionHandler = (
+  actionId: string,
+  actionData: any,
+  ctx: ControlDataContext,
+) => (() => void) | undefined;
+
+export interface ActionRendererProps {
+  key?: Key;
+  actionId: string;
+  actionContent?: ReactNode;
+  actionText: string;
+  actionData?: any;
+  actionStyle?: ActionStyle | null;
+  icon?: IconReference | null;
+  iconPlacement?: IconPlacement | null;
+  onClick: () => void;
+  className?: string | null;
+  textClass?: string | null;
+  style?: React.CSSProperties;
+  disabled?: boolean;
+  hidden?: boolean;
+  inline?: boolean;
+}
+
+export type RunExpression = (
+  scope: CleanupScope,
+  expression: EntityExpression,
+  returnResult: (v: unknown) => void,
+  bindings?: FormContextData,
+) => void;

package/src/util.ts

@@ -1,49 +1,54 @@
 import {
-  ControlActionHandler,
+  CompoundField,
   ControlDataVisitor,
   ControlDefinition,
   ControlDefinitionType,
-  createFormTree,
+  createSchemaTree,
   DataControlDefinition,
   DataRenderType,
   DisplayOnlyRenderOptions,
+  EntityExpression,
+  FieldOption,
   fieldPathForDefinition,
-  FormNode,
-  FormTree,
+  findField,
+  FormContextData,
+  getGroupRendererOptions,
+  getTagParam,
   GroupRenderOptions,
   isAutoCompleteClasses,
   isCheckEntryClasses,
+  isCompoundField,
+  isCompoundNode,
   isDataControl,
   isDataGroupRenderer,
   isDisplayOnlyRenderer,
+  isGridRenderer,
   isGroupControl,
-} from "./controlDefinition";
-import { MutableRefObject, useRef } from "react";
-import clsx from "clsx";
-import {
-  CompoundField,
-  FieldOption,
-  findField,
-  getTagParam,
-  isCompoundField,
-  isCompoundNode,
   isScalarField,
   relativePath,
-  rootSchemaNode,
   SchemaDataNode,
   SchemaField,
   schemaForFieldPath,
   SchemaNode,
   SchemaTags,
-} from "./schemaField";
+} from "@astroapps/forms-core";
+import { MutableRefObject, useRef } from "react";
+import clsx from "clsx";
 import {
   Control,
   ControlChange,
+  createScopedEffect,
   ensureMetaValue,
   getElementIndex,
   newControl,
+  useControl,
 } from "@react-typed-forms/core";
-import { ActionRendererProps } from "./controlRender";
+import {
+  ActionRendererProps,
+  ControlActionHandler,
+  RunExpression,
+} from "./types";
+import { Expression } from "jsonata";
 
 /**
  * Interface representing the classes for a control.
@@ -52,13 +57,10 @@ export interface ControlClasses {
   styleClass?: string;
   layoutClass?: string;
   labelClass?: string;
+  textClass?: string;
+  labelTextClass?: string;
 }
 
-/**
- * Type representing a JSON path, which can be a string or a number.
- */
-export type JsonPath = string | number;
-
 /**
  * Applies default values to the given record based on the provided schema fields.
  * @param v - The record to apply default values to.
@@ -146,7 +148,7 @@ export function defaultValueForField(
   const isRequired = !!(required || sf.required);
   if (isCompoundField(sf)) {
     if (isRequired) {
-      const childValue = defaultValueForFields(sf.children);
+      const childValue = defaultValueForFields(sf.children ?? []);
       return sf.collection ? [childValue] : childValue;
     }
     return sf.notNullable ? (sf.collection ? [] : {}) : undefined;
@@ -164,7 +166,7 @@ export function defaultValueForField(
  */
 export function elementValueForField(sf: SchemaField): any {
   if (isCompoundField(sf)) {
-    return defaultValueForFields(sf.children);
+    return defaultValueForFields(sf.children ?? []);
   }
   return sf.defaultValue;
 }
@@ -344,31 +346,18 @@ export function addMissingControls(
   controls: ControlDefinition[],
   warning?: (msg: string) => void,
 ) {
-  return addMissingControlsForSchema(rootSchemaNode(fields), controls, warning);
+  return addMissingControlsForSchema(
+    createSchemaTree(fields).rootNode,
+    controls,
+    warning,
+  );
 }
 
-function registerSchemaEntries(formNode: FormNode, parentSchema: SchemaNode) {
-  const formToSchema: Record<string, SchemaNode> = {};
-  const schemaToForm: Record<string, FormNode[]> = {};
-  function register(node: FormNode, parentSchema: SchemaNode) {
-    const c = node.definition;
-    const controlPath = fieldPathForDefinition(c);
-    let dataSchema = controlPath
-      ? schemaForFieldPath(controlPath, parentSchema)
-      : undefined;
-    if (isGroupControl(c) && dataSchema == null) dataSchema = parentSchema;
-    if (dataSchema) {
-      formToSchema[node.id] = dataSchema;
-      const formNodes = schemaToForm[dataSchema.id] ?? [];
-      formNodes.push(node);
-      schemaToForm[dataSchema.id] = formNodes;
-    }
-    node
-      .getChildNodes()
-      .forEach((x) => register(x, dataSchema ?? parentSchema));
-  }
-  register(formNode, parentSchema);
-  return { formToSchema, schemaToForm, register };
+interface ControlAndSchema {
+  control: ControlDefinition;
+  children: ControlAndSchema[];
+  schema?: SchemaNode;
+  parent?: ControlAndSchema;
 }
 
 /**
@@ -382,77 +371,56 @@ export function addMissingControlsForSchema(
   schema: SchemaNode,
   controls: ControlDefinition[],
   warning?: (msg: string) => void,
-) {
-  const tree = createFormTree(controls);
-  addMissingControlsToForm(schema, tree, warning);
-  return toDefinition(tree.rootNode).children ?? [];
-
-  function toDefinition(c: FormNode): ControlDefinition {
-    const children = c.getChildNodes().length
-      ? c.getChildNodes().map(toDefinition)
-      : null;
-    return { ...c.definition, children };
+): ControlDefinition[] {
+  const controlMap: { [k: string]: ControlAndSchema } = {};
+  const schemaControlMap: { [k: string]: ControlAndSchema[] } = {};
+  const rootControls = controls.map((c) => toControlAndSchema(c, schema));
+  const rootSchema = { schema, children: rootControls } as ControlAndSchema;
+  addSchemaMapEntry("", rootSchema);
+  rootControls.forEach(addReferences);
+  const fields = schema.getChildNodes();
+  fields.forEach(addMissing);
+  return rootControls.map(toDefinition);
+
+  function toDefinition(c: ControlAndSchema): ControlDefinition {
+    const children = c.children.length ? c.children.map(toDefinition) : null;
+    return { ...c.control, children };
   }
-}
-
-/**
- * Adds missing controls to the provided form tree based on the schema fields.
- * @param schema - The root schema node to use for adding missing controls.
- * @param tree - The form tree to add missing controls to.
- * @param warning - An optional function to call with warning messages.
- */
-export function addMissingControlsToForm(
-  schema: SchemaNode,
-  tree: FormTree,
-  warning?: (msg: string) => void,
-): void {
-  const { formToSchema, schemaToForm, register } = registerSchemaEntries(
-    tree.rootNode,
-    schema,
-  );
-
-  schema.getChildNodes().forEach(addMissing);
-  return;
 
   function addMissing(schemaNode: SchemaNode) {
     if (fieldHasTag(schemaNode.field, SchemaTags.NoControl)) return;
     let skipChildren = false;
-    const existingControls = schemaToForm[schemaNode.id];
+    const existingControls = schemaControlMap[schemaNode.id];
     if (!existingControls) {
       const eligibleParents = getEligibleParents(schemaNode);
       const desiredGroup = getTagParam(
         schemaNode.field,
         SchemaTags.ControlGroup,
       );
-      let parentGroup = desiredGroup
-        ? tree.getByRefId(desiredGroup)
-        : undefined;
+      let parentGroup = desiredGroup ? controlMap[desiredGroup] : undefined;
       if (!parentGroup && desiredGroup)
         warning?.("No group '" + desiredGroup + "' for " + schemaNode.id);
-      if (
-        parentGroup &&
-        eligibleParents.indexOf(formToSchema[parentGroup.id]!.id) < 0
-      ) {
+      if (parentGroup && eligibleParents.indexOf(parentGroup.schema!.id) < 0) {
         warning?.(
           `Target group '${desiredGroup}' is not an eligible parent for '${schemaNode.id}'`,
         );
         parentGroup = undefined;
       }
       if (!parentGroup && eligibleParents.length) {
-        parentGroup = schemaToForm[eligibleParents[0]]?.[0];
+        parentGroup = schemaControlMap[eligibleParents[0]]?.[0];
       }
       if (parentGroup) {
         const newControl = defaultControlForField(schemaNode.field, true);
         skipChildren = !!newControl.childRefId;
-        const parentSchemaNode = formToSchema[parentGroup.id];
-        newControl.field = relativePath(parentSchemaNode, schemaNode);
-        const newNode = tree.addChild(parentGroup, newControl);
-        register(newNode, parentSchemaNode);
+        newControl.field = relativePath(parentGroup.schema!, schemaNode);
+        parentGroup.children.push(
+          toControlAndSchema(newControl, parentGroup.schema!, parentGroup),
+        );
       } else warning?.("Could not find a parent group for: " + schemaNode.id);
     } else {
-      skipChildren = existingControls.some((x) => x.definition.childRefId);
+      skipChildren = existingControls.some((x) => x.control.childRefId);
     }
-    if (!skipChildren) schemaNode.getChildNodes(true).forEach(addMissing);
+    if (!skipChildren) schemaNode.getChildNodes().forEach(addMissing);
   }
 
   function getEligibleParents(schemaNode: SchemaNode) {
@@ -461,7 +429,7 @@ export function addMissingControlsToForm(
     while (parent) {
       eligibleParents.push(parent.id);
       if (parent.field.collection) break;
-      if (!parent.parent) parent.getChildNodes(true).forEach(addCompound);
+      if (!parent.parent) parent.getChildNodes().forEach(addCompound);
       parent = parent.parent;
     }
     return eligibleParents;
@@ -469,10 +437,56 @@ export function addMissingControlsToForm(
     function addCompound(node: SchemaNode) {
       if (isCompoundNode(node) && !node.field.collection) {
         eligibleParents.push(node.id);
-        node.getChildNodes(true).forEach(addCompound);
+        node.getChildNodes().forEach(addCompound);
+      }
+    }
+  }
+
+  function addReferences(c: ControlAndSchema) {
+    c.children.forEach(addReferences);
+    if (c.control.childRefId) {
+      const ref = controlMap[c.control.childRefId];
+      if (ref) {
+        ref.children.forEach((x) =>
+          toControlAndSchema(x.control, c.schema!, c, true),
+        );
+        return;
       }
+      console.warn("Missing reference", c.control.childRefId);
     }
   }
+
+  function addSchemaMapEntry(schemaId: string, entry: ControlAndSchema) {
+    if (!schemaControlMap[schemaId]) schemaControlMap[schemaId] = [];
+    schemaControlMap[schemaId].push(entry);
+  }
+  function toControlAndSchema(
+    c: ControlDefinition,
+    parentSchema: SchemaNode,
+    parentNode?: ControlAndSchema,
+    dontRegister?: boolean,
+  ): ControlAndSchema {
+    const controlPath = fieldPathForDefinition(c);
+    let dataSchema = controlPath
+      ? schemaForFieldPath(controlPath, parentSchema)
+      : undefined;
+    if (isGroupControl(c) && dataSchema == null) dataSchema = parentSchema;
+    const entry: ControlAndSchema = {
+      schema: dataSchema,
+      control: c,
+      children: [],
+      parent: parentNode,
+    };
+    entry.children =
+      c.children?.map((x) =>
+        toControlAndSchema(x, dataSchema ?? parentSchema, entry, dontRegister),
+      ) ?? [];
+    if (!dontRegister && c.id) controlMap[c.id] = entry;
+    if (dataSchema) {
+      addSchemaMapEntry(dataSchema.id, entry);
+    }
+    return entry;
+  }
 }
 
 /**
@@ -486,54 +500,22 @@ export function useUpdatedRef<A>(a: A): MutableRefObject<A> {
   return r;
 }
 
-/**
- * Checks if a control definition is readonly.
- * @param c - The control definition to check.
- * @returns True if the control definition is readonly, false otherwise.
- */
-export function isControlReadonly(c: ControlDefinition): boolean {
-  return isDataControl(c) && !!c.readonly;
-}
-
-/**
- * Checks if a control definition is disabled.
- * @param c - The control definition to check.
- * @returns True if the control definition is disabled, false otherwise.
- */
-export function isControlDisabled(c: ControlDefinition): boolean {
-  return isDataControl(c) && !!c.disabled;
-}
-
-/**
- * Returns the display-only render options for a control definition.
- * @param d - The control definition to get the display-only render options for.
- * @returns The display-only render options, or undefined if not applicable.
- */
-export function getDisplayOnlyOptions(
-  d: ControlDefinition,
-): DisplayOnlyRenderOptions | undefined {
-  return isDataControl(d) &&
-    d.renderOptions &&
-    isDisplayOnlyRenderer(d.renderOptions)
-    ? d.renderOptions
-    : undefined;
-}
-
 /**
  * Cleans data for a schema based on the provided schema fields.
  * @param v - The data to clean.
- * @param fields - The schema fields to use for cleaning the data.
+ * @param schemaNode
  * @param removeIfDefault - Flag indicating if default values should be removed.
  * @returns The cleaned data.
  */
 export function cleanDataForSchema(
   v: { [k: string]: any } | undefined,
-  fields: SchemaField[],
+  schemaNode: SchemaNode,
   removeIfDefault?: boolean,
 ): any {
   if (!v) return v;
-  const typeField = fields.find((x) => x.isTypeField);
-  const typeValue = typeField ? v[typeField.field] : undefined;
+  const fields = schemaNode.getResolvedFields();
+  const typeField = fields.find((x) => x.isTypeField)?.field;
+  const typeValue = typeField ? v[typeField] : undefined;
   const cleanableFields = !removeIfDefault
     ? fields.filter(
         (x) => isCompoundField(x) || (x.onlyForTypes?.length ?? 0) > 0,
@@ -551,17 +533,17 @@ export function cleanDataForSchema(
       return;
     }
     if (isCompoundField(x)) {
-      const childFields = x.treeChildren ? fields : x.children;
+      const childNode = schemaNode.createChildNode(x);
       if (x.collection) {
         if (Array.isArray(childValue)) {
           out[x.field] = childValue.map((cv) =>
-            cleanDataForSchema(cv, childFields, removeIfDefault),
+            cleanDataForSchema(cv, childNode, removeIfDefault),
           );
         }
       } else {
         out[x.field] = cleanDataForSchema(
           childValue,
-          childFields,
+          childNode,
           removeIfDefault,
         );
       }
@@ -596,6 +578,9 @@ export function getAllReferencedClasses(
     isDataControl(c) && isCheckEntryClasses(c.renderOptions)
       ? c.renderOptions
       : {};
+  const groupOptions = isGroupControl(c) ? c.groupOptions : undefined;
+  const gridClasses =
+    groupOptions && isGridRenderer(groupOptions) ? [groupOptions.rowClass] : [];
 
   const {
     listContainerClass,
@@ -612,6 +597,9 @@ export function getAllReferencedClasses(
       c.styleClass,
       c.layoutClass,
       c.labelClass,
+      c.textClass,
+      c.labelTextClass,
+      ...gridClasses,
       ...Object.values(go),
       ...(collectExtra?.(c) ?? []),
       entryWrapperClass,
@@ -629,28 +617,6 @@ export function getAllReferencedClasses(
   return [tc];
 }
 
-/**
- * Converts a JSON path array to a string.
- * @param jsonPath - The JSON path array to convert.
- * @param customIndex - Optional function to customize the index format.
- * @returns The JSON path string.
- */
-export function jsonPathString(
-  jsonPath: JsonPath[],
-  customIndex?: (n: number) => string,
-) {
-  let out = "";
-  jsonPath.forEach((v, i) => {
-    if (typeof v === "number") {
-      out += customIndex?.(v) ?? "[" + v + "]";
-    } else {
-      if (i > 0) out += ".";
-      out += v;
-    }
-  });
-  return out;
-}
-
 /**
  * Finds a child control definition within a parent control definition.
  * @param parent - The parent control definition.
@@ -796,6 +762,7 @@ export function deepMerge<A>(value: A, fallback: A): A {
     deepMerge(v1, fv),
   ) as A;
 }
+
 /**
  * Coerces a value to a string.
  * @param {unknown} v - The value to coerce.
@@ -809,21 +776,6 @@ export function coerceToString(v: unknown) {
       : v.toString();
 }
 
-/**
- * Returns the group renderer options for a control definition.
- * @param {ControlDefinition} def - The control definition to get the group renderer options for.
- * @returns {GroupRenderOptions | undefined} - The group renderer options, or undefined if not applicable.
- */
-export function getGroupRendererOptions(
-  def: ControlDefinition,
-): GroupRenderOptions | undefined {
-  return isGroupControl(def)
-    ? def.groupOptions
-    : isDataControl(def) && isDataGroupRenderer(def.renderOptions)
-      ? def.renderOptions.groupOptions
-      : undefined;
-}
-
 /**
  * Returns the group class overrides for a control definition.
  * @param {ControlDefinition} def - The control definition to get the group class overrides for.
@@ -841,15 +793,6 @@ export function getGroupClassOverrides(def: ControlDefinition): ControlClasses {
   return out;
 }
 
-/**
- * Checks if a control definition is display-only.
- * @param {ControlDefinition} def - The control definition to check.
- * @returns {boolean} - True if the control definition is display-only, false otherwise.
- */
-export function isControlDisplayOnly(def: ControlDefinition): boolean {
-  return Boolean(getGroupRendererOptions(def)?.displayOnly);
-}
-
 /**
  * Combines multiple action handlers into a single handler.
  * @param {...(ControlActionHandler | undefined)[]} handlers - The action handlers to combine.
@@ -857,10 +800,12 @@ export function isControlDisplayOnly(def: ControlDefinition): boolean {
  */
 export function actionHandlers(
   ...handlers: (ControlActionHandler | undefined)[]
-): ControlActionHandler {
+): ControlActionHandler | undefined {
+  const nonNullHandlers = handlers.filter((x) => x != null);
+  if (nonNullHandlers.length === 0) return undefined;
   return (actionId, actionData, ctx) => {
-    for (let i = 0; i < handlers.length; i++) {
-      const res = handlers[i]?.(actionId, actionData, ctx);
+    for (let i = 0; i < nonNullHandlers.length; i++) {
+      const res = nonNullHandlers[i](actionId, actionData, ctx);
       if (res) return res;
     }
     return undefined;
@@ -1051,3 +996,24 @@ export function validationVisitor(
     return undefined;
   };
 }
+
+export function useExpression<T>(
+  defaultValue: T,
+  runExpression: RunExpression,
+  expression: EntityExpression | null | undefined,
+  coerce: (x: any) => T,
+  bindings?: Record<string, any>,
+): Control<T> {
+  const value = useControl<T>(defaultValue);
+  createScopedEffect((scope) => {
+    if (expression?.type)
+      runExpression(
+        scope,
+        expression,
+        (x) => (value.value = coerce(x)),
+        bindings,
+      );
+    else value.value = defaultValue;
+  }, value);
+  return value;
+}