@5minds/processcube_app_sdk/build/client/components/DynamicUi/DynamicUi.d.ts

The SDK for ProcessCube Apps

import React, { PropsWithChildren } from 'react';
import { DataModels } from '@5minds/processcube_engine_sdk';
import { UserTaskInstance } from '../../../common/types';
import { type DynamicUiFormFieldComponentMap } from './FormFields';
interface DynamicUiForwardedRefRenderFunction extends React.ForwardRefRenderFunction<DynamicUiRefFunctions, DynamicUiComponentProps> {
    (props: DynamicUiComponentProps, ref: DynamicUiFormFieldRef): React.ReactNode;
}
type DynamicUiForwardedRefExoticComponent = React.ForwardRefExoticComponent<DynamicUiComponentProps & React.RefAttributes<DynamicUiRefFunctions>>;
export type DynamicUiFormFieldComponent = DynamicUiForwardedRefExoticComponent | DynamicUiForwardedRefRenderFunction | typeof DynamicUiComponent<DynamicUiComponentProps, {}>;
type DynamicUiRefFunctions = Omit<DynamicUiComponent, keyof React.Component>;
export type JSONPrimitive = string | number | boolean | null;
export type JSONValue = JSONPrimitive | JSONObject | JSONArray;
export type JSONObject = {
    [member: string]: JSONValue;
};
export interface JSONArray extends Array<JSONValue> {
}
export declare abstract class DynamicUiComponent<P extends DynamicUiComponentProps = DynamicUiComponentProps, S = {}, SS = any> extends React.Component<P, S, SS> {
    getValue?(): JSONValue | void;
    getState?(): JSONValue | void;
}
export type DynamicUiFormFieldRef = React.ForwardedRef<DynamicUiRefFunctions>;
export type DynamicUiComponentProps<TState = any> = {
    formField: DataModels.FlowNodeInstances.UserTaskFormField;
    state?: TState;
};
export type UserTaskResult = DataModels.FlowNodeInstances.UserTaskResult;
export type FormState = {
    [formFieldId: string]: JSONValue;
};
export declare function DynamicUi(props: PropsWithChildren<{
    /** UserTaskInstance with a defined dynamic form  */
    task: DataModels.FlowNodeInstances.UserTaskInstance | UserTaskInstance;
    /** Custom element to insert into the DynamicUI Headline */
    headerComponent?: JSX.Element;
    /** Callback, that will be called when the form is submitted */
    onSubmit: (result: UserTaskResult, rawFormData: FormData, task: UserTaskInstance) => Promise<void>;
    /** Custom class name for the root element */
    className?: string;
    /** Custom class names for the different parts of the component */
    classNames?: Partial<Record<'wrapper' | 'base' | 'header' | 'body' | 'footer', string>>;
    /** Custom title for the headline of the dialog */
    title?: React.ReactNode;
    /** Custom components that will be used to render own form field types or override existing ones */
    customFieldComponents?: DynamicUiFormFieldComponentMap;
    /** Initial state of the form fields */
    state?: FormState;
    /** Callback, that is called on every form field change */
    onStateChange?: (newValue: string, formFieldId: string, formState: FormState) => void | Promise<void>;
    /** Option to enable dark mode */
    darkMode?: true;
}>): import("react/jsx-runtime").JSX.Element;
export {};