sequential-workflow-designer-react 0.10.2 → 0.12.0

package/README.md

@@ -28,7 +28,8 @@ Import types:
 import {
   Definition,
   ToolboxConfiguration,
-  StepsConfiguration
+  StepsConfiguration,
+  ValidatorConfiguration
 } from 'sequential-workflow-designer';
 import {
   SequentialWorkflowDesigner,
@@ -55,6 +56,7 @@ Configure the designer.
 ```ts
 const toolboxConfiguration: ToolboxConfiguration = { /* ... */ };
 const stepsConfiguration: StepsConfiguration = { /* ... */ };
+const validatorConfiguration: ValidatorConfiguration = { /* ... */ };
 ```
 
 Create the global editor component:
@@ -102,6 +104,7 @@ At the end attach the designer.
   definition={definition}
   onDefinitionChange={setDefinition}
   stepsConfiguration={stepsConfiguration}
+  validatorConfiguration={validatorConfiguration}
   toolboxConfiguration={toolboxConfiguration}
   controlBar={true}
   globalEditor={<GlobalEditor />}

package/lib/cjs/index.cjs

@@ -159,6 +159,7 @@ function SequentialWorkflowDesigner(props) {
     var theme = props.theme;
     var undoStackSize = props.undoStackSize;
     var steps = props.stepsConfiguration;
+    var validator = props.validatorConfiguration;
     var toolbox = props.toolboxConfiguration;
     var controlBar = props.controlBar;
     var extensions = props.extensions;
@@ -183,9 +184,9 @@ function SequentialWorkflowDesigner(props) {
         }
         return Presenter.render(externalEditorClassName, editorRootRef, jsxRuntime.jsx(StepEditorWrapperContext, __assign({ step: step, context: context }, { children: stepEditorRef.current })));
     }
-    function customActionHandler(action, step) {
+    function customActionHandler(action, step, sequence, context) {
         if (customActionHandlerRef.current) {
-            customActionHandlerRef.current(action, step);
+            customActionHandlerRef.current(action, step, sequence, context);
         }
     }
     function tryDestroy() {
@@ -243,6 +244,7 @@ function SequentialWorkflowDesigner(props) {
             undoStackSize: undoStackSize,
             toolbox: toolbox,
             steps: steps,
+            validator: validator,
             controlBar: controlBar,
             editors: globalEditorRef.current && stepEditorRef.current
                 ? {
@@ -271,7 +273,7 @@ function SequentialWorkflowDesigner(props) {
             }
         });
         designerRef.current = designer;
-    }, [placeholder, definition, selectedStepId, isReadonly, theme, undoStackSize, toolbox, controlBar, steps, extensions]);
+    }, [placeholder, definition, selectedStepId, isReadonly, theme, undoStackSize, toolbox, controlBar, steps, validator, extensions]);
     react.useEffect(function () {
         return tryDestroy;
     }, []);
@@ -294,6 +296,12 @@ var SequentialWorkflowDesignerController = /** @class */ (function () {
         this.updateBadges = function () {
             _this.getDesigner().updateBadges();
         };
+        /**
+         * @description Rerender the root component and all its children.
+         */
+        this.updateRootComponent = function () {
+            _this.getDesigner().updateRootComponent();
+        };
         // Nothing...
     }
     SequentialWorkflowDesignerController.create = function () {

package/lib/esm/index.js

@@ -157,6 +157,7 @@ function SequentialWorkflowDesigner(props) {
     var theme = props.theme;
     var undoStackSize = props.undoStackSize;
     var steps = props.stepsConfiguration;
+    var validator = props.validatorConfiguration;
     var toolbox = props.toolboxConfiguration;
     var controlBar = props.controlBar;
     var extensions = props.extensions;
@@ -181,9 +182,9 @@ function SequentialWorkflowDesigner(props) {
         }
         return Presenter.render(externalEditorClassName, editorRootRef, jsx(StepEditorWrapperContext, __assign({ step: step, context: context }, { children: stepEditorRef.current })));
     }
-    function customActionHandler(action, step) {
+    function customActionHandler(action, step, sequence, context) {
         if (customActionHandlerRef.current) {
-            customActionHandlerRef.current(action, step);
+            customActionHandlerRef.current(action, step, sequence, context);
         }
     }
     function tryDestroy() {
@@ -241,6 +242,7 @@ function SequentialWorkflowDesigner(props) {
             undoStackSize: undoStackSize,
             toolbox: toolbox,
             steps: steps,
+            validator: validator,
             controlBar: controlBar,
             editors: globalEditorRef.current && stepEditorRef.current
                 ? {
@@ -269,7 +271,7 @@ function SequentialWorkflowDesigner(props) {
             }
         });
         designerRef.current = designer;
-    }, [placeholder, definition, selectedStepId, isReadonly, theme, undoStackSize, toolbox, controlBar, steps, extensions]);
+    }, [placeholder, definition, selectedStepId, isReadonly, theme, undoStackSize, toolbox, controlBar, steps, validator, extensions]);
     useEffect(function () {
         return tryDestroy;
     }, []);
@@ -292,6 +294,12 @@ var SequentialWorkflowDesignerController = /** @class */ (function () {
         this.updateBadges = function () {
             _this.getDesigner().updateBadges();
         };
+        /**
+         * @description Rerender the root component and all its children.
+         */
+        this.updateRootComponent = function () {
+            _this.getDesigner().updateRootComponent();
+        };
         // Nothing...
     }
     SequentialWorkflowDesignerController.create = function () {

package/lib/index.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 import { MutableRefObject, Context, DependencyList } from 'react';
 import ReactDOM from 'react-dom/client';
-import { Definition, GlobalEditorContext, Designer, StepsConfiguration, ToolboxConfiguration, CustomActionHandler, DesignerExtension, Step, StepEditorContext } from 'sequential-workflow-designer';
+import { Definition, GlobalEditorContext, Designer, StepsConfiguration, ValidatorConfiguration, ToolboxConfiguration, CustomActionHandler, DesignerExtension, Step, StepEditorContext } from 'sequential-workflow-designer';
 
 declare class Presenter {
     static render(className: string, rootRef: MutableRefObject<ReactDOM.Root | null>, element: JSX.Element): HTMLElement;
@@ -42,6 +42,10 @@ declare class SequentialWorkflowDesignerController {
      * @description Updates all badges.
      */
     readonly updateBadges: () => void;
+    /**
+     * @description Rerender the root component and all its children.
+     */
+    readonly updateRootComponent: () => void;
     /**
      * @returns `true` if the controller is ready to be used, `false` otherwise.
      */
@@ -62,6 +66,7 @@ interface SequentialWorkflowDesignerProps<TDefinition extends Definition> {
     theme?: string;
     undoStackSize?: number;
     stepsConfiguration: StepsConfiguration;
+    validatorConfiguration?: ValidatorConfiguration;
     toolboxConfiguration: false | ToolboxConfiguration;
     /**
      * @description If true, the control bar will be displayed.

package/package.json

@@ -1,7 +1,7 @@
 {
 	"name": "sequential-workflow-designer-react",
 	"description": "React wrapper for Sequential Workflow Designer component.",
-	"version": "0.10.2",
+	"version": "0.12.0",
 	"type": "module",
 	"main": "./lib/esm/index.js",
 	"types": "./lib/index.d.ts",
@@ -47,7 +47,7 @@
 	"peerDependencies": {
 		"react": "^18.2.0",
 		"react-dom": "^18.2.0",
-		"sequential-workflow-designer": "^0.10.2"
+		"sequential-workflow-designer": "^0.12.0"
 	},
 	"devDependencies": {
 		"@rollup/plugin-node-resolve": "^15.0.1",
@@ -63,7 +63,7 @@
 		"prettier": "^2.8.2",
 		"react": "^18.2.0",
 		"react-dom": "^18.2.0",
-		"sequential-workflow-designer": "^0.10.2",
+		"sequential-workflow-designer": "^0.12.0",
 		"rollup": "^3.18.0",
 		"rollup-plugin-dts": "^5.2.0",
 		"rollup-plugin-typescript2": "^0.34.1",