@react-typed-forms/schemas 5.0.2 → 6.0.0

package/lib/internal.d.ts

@@ -1,2 +1,3 @@
 import { Control } from "@react-typed-forms/core";
 export declare function useCalculatedControl<V>(calculate: () => V): Control<V>;
+export declare function cc(n: string | null | undefined): string | undefined;

package/lib/renderers.d.ts

@@ -1,7 +1,7 @@
 import React, { CSSProperties, ReactElement, ReactNode } from "react";
 import { Control } from "@react-typed-forms/core";
-import { ActionRendererProps, AdornmentProps, AdornmentRenderer, ArrayRendererProps, ControlLayoutProps, DataRendererProps, DisplayRendererProps, FormRenderer, GroupRendererProps, LabelRendererProps, LabelType, RenderedLayout, Visibility } from "./controlRender";
-import { FieldOption, GridRenderer } from "./types";
+import { ActionRendererProps, AdornmentProps, AdornmentRenderer, ArrayRendererProps, ControlLayoutProps, DataRendererProps, DisplayRendererProps, FormRenderer, GroupRendererProps, LabelRendererProps, LabelType, RenderedControl, RenderedLayout, VisibilityRendererProps } from "./controlRender";
+import { ControlAdornment, FieldOption, GridRenderer, IconAdornment, SchemaField, SchemaInterface } from "./types";
 export interface DefaultRenderers {
     data: DataRendererRegistration;
     label: LabelRendererRegistration;
@@ -16,7 +16,7 @@ export interface DefaultRenderers {
 export interface LayoutRendererRegistration {
     type: "layout";
     match?: (props: ControlLayoutProps) => boolean;
-    render: (props: ControlLayoutProps, renderers: FormRenderer) => ReactNode;
+    render: (props: ControlLayoutProps, renderers: FormRenderer) => RenderedControl;
 }
 export interface DataRendererRegistration {
     type: "data";
@@ -44,7 +44,7 @@ export interface ArrayRendererRegistration {
 export interface GroupRendererRegistration {
     type: "group";
     renderType?: string | string[];
-    render: (props: GroupRendererProps, renderers: FormRenderer) => ReactElement;
+    render: (props: GroupRendererProps, renderers: FormRenderer) => ReactElement | ((layout: ControlLayoutProps) => ControlLayoutProps);
 }
 export interface DisplayRendererRegistration {
     type: "display";
@@ -58,7 +58,7 @@ export interface AdornmentRendererRegistration {
 }
 export interface VisibilityRendererRegistration {
     type: "visibility";
-    render: (visibility: Control<Visibility | undefined>, children: () => ReactNode) => ReactNode;
+    render: (props: VisibilityRendererProps) => ReactNode;
 }
 export type RendererRegistration = DataRendererRegistration | GroupRendererRegistration | DisplayRendererRegistration | ActionRendererRegistration | LabelRendererRegistration | ArrayRendererRegistration | AdornmentRendererRegistration | LayoutRendererRegistration | VisibilityRendererRegistration;
 export declare function createFormRenderer(customRenderers?: RendererRegistration[], defaultRenderers?: DefaultRenderers): FormRenderer;
@@ -91,6 +91,8 @@ interface DefaultGroupRendererOptions {
     gridStyles?: (columns: GridRenderer) => StyleProps;
     gridClassName?: string;
     defaultGridColumns?: number;
+    flexClassName?: string;
+    defaultFlexGap?: string;
 }
 export declare function createDefaultGroupRenderer(options?: DefaultGroupRendererOptions): GroupRendererRegistration;
 export interface DefaultDisplayRendererOptions {
@@ -98,14 +100,24 @@ export interface DefaultDisplayRendererOptions {
     htmlClassName?: string;
 }
 export declare function createDefaultDisplayRenderer(options?: DefaultDisplayRendererOptions): DisplayRendererRegistration;
+export declare function DefaultDisplay({ data, display, className, style, ...options }: DefaultDisplayRendererOptions & DisplayRendererProps): React.JSX.Element;
 export declare const DefaultBoolOptions: FieldOption[];
 interface DefaultDataRendererOptions {
     inputClass?: string;
+    displayOnlyClass?: string;
     selectOptions?: SelectRendererOptions;
     booleanOptions?: FieldOption[];
     optionRenderer?: DataRendererRegistration;
 }
 export declare function createDefaultDataRenderer(options?: DefaultDataRendererOptions): DataRendererRegistration;
+export declare function DefaultDisplayOnly({ control, className, emptyText, schemaInterface, field, style, }: {
+    control: Control<any>;
+    field: SchemaField;
+    schemaInterface: SchemaInterface;
+    className?: string;
+    style?: React.CSSProperties;
+    emptyText?: string | null;
+}): React.JSX.Element;
 export declare function ControlInput({ control, convert, ...props }: React.InputHTMLAttributes<HTMLInputElement> & {
     control: Control<any>;
     convert: InputConversion;
@@ -128,6 +140,7 @@ export interface DefaultRendererOptions {
     layout?: DefaultLayoutRendererOptions;
 }
 export declare function createDefaultRenderers(options?: DefaultRendererOptions): DefaultRenderers;
+export declare function isIconAdornment(a: ControlAdornment): a is IconAdornment;
 export declare function createLayoutRenderer(render: LayoutRendererRegistration["render"], options?: Partial<LayoutRendererRegistration>): LayoutRendererRegistration;
 export declare function createArrayRenderer(render: ArrayRendererRegistration["render"], options?: Partial<ArrayRendererRegistration>): ArrayRendererRegistration;
 export declare function createDataRenderer(render: DataRendererRegistration["render"], options?: Partial<DataRendererRegistration>): DataRendererRegistration;
@@ -160,11 +173,8 @@ export declare function createSelectConversion(ft: string): SelectConversion;
 type InputConversion = [string, (s: any) => any, (a: any) => string | number];
 export declare function createInputConversion(ft: string): InputConversion;
 export declare function createDefaultVisibilityRenderer(): VisibilityRendererRegistration;
-export declare function DefaultVisibility({ visibility, children, }: {
-    visibility: Control<Visibility | undefined>;
-    children: () => ReactNode;
-}): string | number | boolean | Iterable<React.ReactNode> | React.JSX.Element | null | undefined;
-export declare function DefaultLayout({ className, errorClass, layout: { controlEnd, controlStart, label, children, errorControl }, }: DefaultLayoutRendererOptions & {
+export declare function DefaultVisibility({ visibility, children, className, style, divRef, }: VisibilityRendererProps): React.JSX.Element;
+export declare function DefaultLayout({ errorClass, className, layout: { controlEnd, controlStart, label, children, errorControl }, }: DefaultLayoutRendererOptions & {
     layout: RenderedLayout;
 }): React.JSX.Element;
 export {};

package/lib/schemaInterface.d.ts

@@ -0,0 +1,4 @@
+import { SchemaField, SchemaInterface } from "./types";
+export declare const defaultSchemaInterface: SchemaInterface;
+export declare function defaultIsEmpty(f: SchemaField, value: any): boolean;
+export declare function defaultTextValue(f: SchemaField, value: any): string | undefined;

package/lib/types.d.ts

@@ -42,9 +42,15 @@ export interface CompoundField extends SchemaField {
     treeChildren?: boolean;
 }
 export type AnyControlDefinition = DataControlDefinition | GroupedControlsDefinition | ActionControlDefinition | DisplayControlDefinition;
+export interface SchemaInterface {
+    isEmptyValue(field: SchemaField, value: any): boolean;
+    textValue(field: SchemaField, value: any, element?: boolean): string | undefined;
+}
 export interface ControlDefinition {
     type: string;
     title?: string | null;
+    styleClass?: string | null;
+    layoutClass?: string | null;
     dynamic?: DynamicProperty[] | null;
     adornments?: ControlAdornment[] | null;
     children?: ControlDefinition[] | null;
@@ -63,22 +69,30 @@ export declare enum DynamicPropertyType {
     Visible = "Visible",
     DefaultValue = "DefaultValue",
     Readonly = "Readonly",
-    Disabled = "Disabled"
+    Disabled = "Disabled",
+    Display = "Display",
+    Style = "Style",
+    LayoutStyle = "LayoutStyle"
 }
 export interface EntityExpression {
     type: string;
 }
 export declare enum ExpressionType {
     Jsonata = "Jsonata",
-    FieldValue = "FieldValue",
+    Data = "Data",
+    DataMatch = "FieldValue",
     UserMatch = "UserMatch"
 }
 export interface JsonataExpression extends EntityExpression {
     type: ExpressionType.Jsonata;
     expression: string;
 }
-export interface FieldValueExpression extends EntityExpression {
-    type: ExpressionType.FieldValue;
+export interface DataExpression extends EntityExpression {
+    type: ExpressionType.Data;
+    field: string;
+}
+export interface DataMatchExpression extends EntityExpression {
+    type: ExpressionType.DataMatch;
     field: string;
     value: any;
 }
@@ -98,7 +112,13 @@ export declare enum AdornmentPlacement {
 export declare enum ControlAdornmentType {
     Tooltip = "Tooltip",
     Accordion = "Accordion",
-    HelpText = "HelpText"
+    HelpText = "HelpText",
+    Icon = "Icon"
+}
+export interface IconAdornment extends ControlAdornment {
+    type: ControlAdornmentType.Icon;
+    iconClass: string;
+    placement?: AdornmentPlacement | null;
 }
 export interface TooltipAdornment extends ControlAdornment {
     type: ControlAdornmentType.Tooltip;
@@ -112,7 +132,7 @@ export interface AccordionAdornment extends ControlAdornment {
 export interface HelpTextAdornment extends ControlAdornment {
     type: ControlAdornmentType.HelpText;
     helpText: string;
-    placement: AdornmentPlacement;
+    placement?: AdornmentPlacement | null;
 }
 export interface DataControlDefinition extends ControlDefinition {
     type: ControlDefinitionType.Data;
@@ -138,7 +158,8 @@ export declare enum DataRenderType {
     IconSelector = "IconSelector",
     DateTime = "DateTime",
     Checkbox = "Checkbox",
-    Dropdown = "Dropdown"
+    Dropdown = "Dropdown",
+    DisplayOnly = "DisplayOnly"
 }
 export interface RadioButtonRenderOptions extends RenderOptions {
     type: DataRenderType.Radio;
@@ -158,6 +179,11 @@ export interface IconListRenderOptions extends RenderOptions {
     type: DataRenderType.IconList;
     iconMappings: IconMapping[];
 }
+export interface DisplayOnlyRenderOptions extends RenderOptions {
+    type: DataRenderType.DisplayOnly;
+    emptyText?: string | null;
+    sampleText?: string | null;
+}
 export interface IconMapping {
     value: string;
     materialIcon?: string | null;
@@ -195,11 +221,17 @@ export interface GroupRenderOptions {
 export declare enum GroupRenderType {
     Standard = "Standard",
     Grid = "Grid",
+    Flex = "Flex",
     GroupElement = "GroupElement"
 }
 export interface StandardGroupRenderer extends GroupRenderOptions {
     type: GroupRenderType.Standard;
 }
+export interface FlexRenderer extends GroupRenderOptions {
+    type: GroupRenderType.Flex;
+    direction?: string | null;
+    gap?: string | null;
+}
 export interface GroupElementRenderer extends GroupRenderOptions {
     type: GroupRenderType.GroupElement;
     value: any;
@@ -217,12 +249,17 @@ export interface DisplayData {
 }
 export declare enum DisplayDataType {
     Text = "Text",
-    Html = "Html"
+    Html = "Html",
+    Icon = "Icon"
 }
 export interface TextDisplay extends DisplayData {
     type: DisplayDataType.Text;
     text: string;
 }
+export interface IconDisplay extends DisplayData {
+    type: DisplayDataType.Icon;
+    iconClass: string;
+}
 export interface HtmlDisplay extends DisplayData {
     type: DisplayDataType.Html;
     html: string;
@@ -264,3 +301,5 @@ export interface ControlVisitor<A> {
 }
 export declare function visitControlDefinition<A>(x: ControlDefinition, visitor: ControlVisitor<A>, defaultValue: (c: ControlDefinition) => A): A;
 export declare function isGridRenderer(options: GroupRenderOptions): options is GridRenderer;
+export declare function isFlexRenderer(options: GroupRenderOptions): options is FlexRenderer;
+export declare function isDisplayOnlyRenderer(options: RenderOptions): options is DisplayOnlyRenderOptions;

package/lib/util.d.ts

@@ -1,9 +1,10 @@
-import { CompoundField, ControlDefinition, DataControlDefinition, FieldOption, GroupedControlsDefinition, SchemaField } from "./types";
+import { CompoundField, ControlDefinition, DataControlDefinition, DisplayOnlyRenderOptions, FieldOption, GroupedControlsDefinition, SchemaField, SchemaInterface } from "./types";
 import { MutableRefObject } from "react";
 import { Control } from "@react-typed-forms/core";
-export interface ControlGroupContext {
+export interface ControlDataContext {
     groupControl: Control<any>;
     fields: SchemaField[];
+    schemaInterface: SchemaInterface;
 }
 export declare function applyDefaultValues(v: {
     [k: string]: any;
@@ -28,9 +29,10 @@ export declare function defaultControlForField(sf: SchemaField): DataControlDefi
 export declare function addMissingControls(fields: SchemaField[], controls: ControlDefinition[]): ControlDefinition[];
 export declare function useUpdatedRef<A>(a: A): MutableRefObject<A>;
 export declare function isControlReadonly(c: ControlDefinition): boolean;
-export declare function getTypeField(context: ControlGroupContext): Control<string> | undefined;
-export declare function visitControlDataArray<A>(controls: ControlDefinition[] | undefined | null, context: ControlGroupContext, cb: (definition: DataControlDefinition, field: SchemaField, control: Control<any>, element: boolean) => A | undefined): A | undefined;
-export declare function visitControlData<A>(definition: ControlDefinition, ctx: ControlGroupContext, cb: (definition: DataControlDefinition, field: SchemaField, control: Control<any>, element: boolean) => A | undefined): A | undefined;
+export declare function getDisplayOnlyOptions(d: ControlDefinition): DisplayOnlyRenderOptions | undefined;
+export declare function getTypeField(context: ControlDataContext): Control<string> | undefined;
+export declare function visitControlDataArray<A>(controls: ControlDefinition[] | undefined | null, context: ControlDataContext, cb: (definition: DataControlDefinition, field: SchemaField, control: Control<any>, element: boolean) => A | undefined): A | undefined;
+export declare function visitControlData<A>(definition: ControlDefinition, ctx: ControlDataContext, cb: (definition: DataControlDefinition, field: SchemaField, control: Control<any>, element: boolean) => A | undefined): A | undefined;
 export declare function cleanDataForSchema(v: {
     [k: string]: any;
 } | undefined, fields: SchemaField[]): any;

package/lib/validators.d.ts

@@ -1,4 +1,4 @@
 import { ControlDefinition } from "./types";
 import { Control } from "@react-typed-forms/core";
-import { ControlGroupContext } from "./util";
-export declare function useValidationHook(definition: ControlDefinition): (control: Control<any>, hidden: boolean, groupContext: ControlGroupContext) => void;
+import { ControlDataContext } from "./util";
+export declare function useValidationHook(definition: ControlDefinition): (control: Control<any>, hidden: boolean, groupContext: ControlDataContext) => void;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@react-typed-forms/schemas",
-	"version": "5.0.2",
+	"version": "6.0.0",
 	"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.117",
+		"@react-typed-forms/core": "^3.0.0",
 		"clsx": "^1 || ^2",
 		"jsonata": "^2.0.4",
 		"react": "^18.2.0"

package/src/controlBuilder.ts

@@ -2,13 +2,13 @@ import {
   ControlDefinition,
   ControlDefinitionType,
   DataControlDefinition,
+  DataMatchExpression,
   DisplayControlDefinition,
   DisplayDataType,
   DynamicProperty,
   DynamicPropertyType,
   EntityExpression,
   ExpressionType,
-  FieldValueExpression,
   GroupedControlsDefinition,
   GroupRenderType,
   HtmlDisplay,
@@ -66,8 +66,8 @@ export function dynamicDisabled(expr: EntityExpression): DynamicProperty {
   return { type: DynamicPropertyType.Disabled, expr };
 }
 
-export function fieldEqExpr(field: string, value: any): FieldValueExpression {
-  return { type: ExpressionType.FieldValue, field, value };
+export function fieldEqExpr(field: string, value: any): DataMatchExpression {
+  return { type: ExpressionType.DataMatch, field, value };
 }
 export function jsonataExpr(expression: string): JsonataExpression {
   return { type: ExpressionType.Jsonata, expression };