sequential-workflow-designer-react 0.13.1 → 0.13.2

package/lib/cjs/index.cjs

@@ -2,7 +2,7 @@
 
 var ReactDOM = require('react-dom/client');
 var jsxRuntime = require('react/jsx-runtime');
-var react = require('react');
+var React = require('react');
 var sequentialWorkflowDesigner = require('sequential-workflow-designer');
 
 var Presenter = /** @class */ (function () {
@@ -53,18 +53,18 @@ var __assign = function() {
 };
 
 if (!window.sqdGlobalEditorContext) {
-    window.sqdGlobalEditorContext = react.createContext(null);
+    window.sqdGlobalEditorContext = React.createContext(null);
 }
 var globalEditorContext = window.sqdGlobalEditorContext;
 function useGlobalEditor() {
-    var wrapper = react.useContext(globalEditorContext);
+    var wrapper = React.useContext(globalEditorContext);
     if (!wrapper) {
         throw new Error('Cannot find global editor context');
     }
     return wrapper;
 }
 function GlobalEditorWrapperContext(props) {
-    var _a = react.useState(function () { return createWrapper(); }), wrapper = _a[0], setWrapper = _a[1];
+    var _a = React.useState(function () { return createWrapper(); }), wrapper = _a[0], setWrapper = _a[1];
     function createWrapper() {
         return {
             properties: props.definition.properties,
@@ -83,18 +83,18 @@ function GlobalEditorWrapperContext(props) {
 }
 
 if (!window.sqdStepEditorContext) {
-    window.sqdStepEditorContext = react.createContext(null);
+    window.sqdStepEditorContext = React.createContext(null);
 }
 var stepEditorContext = window.sqdStepEditorContext;
 function useStepEditor() {
-    var wrapper = react.useContext(stepEditorContext);
+    var wrapper = React.useContext(stepEditorContext);
     if (!wrapper) {
         throw new Error('Cannot find step editor context');
     }
     return wrapper;
 }
 function StepEditorWrapperContext(props) {
-    var _a = react.useState(function () { return createWrapper(); }), wrapper = _a[0], setWrapper = _a[1];
+    var _a = React.useState(function () { return createWrapper(); }), wrapper = _a[0], setWrapper = _a[1];
     function createWrapper() {
         return {
             id: props.step.id,
@@ -144,15 +144,15 @@ function wrapDefinition(value, isValid) {
 
 var externalEditorClassName = 'sqd-editor-react';
 function SequentialWorkflowDesigner(props) {
-    var _a = react.useState(null), placeholder = _a[0], setPlaceholder = _a[1];
-    var onDefinitionChangeRef = react.useRef(props.onDefinitionChange);
-    var onSelectedStepIdChangedRef = react.useRef(props.onSelectedStepIdChanged);
-    var globalEditorRef = react.useRef(props.globalEditor);
-    var stepEditorRef = react.useRef(props.stepEditor);
-    var controllerRef = react.useRef(props.controller);
-    var customActionHandlerRef = react.useRef(props.customActionHandler);
-    var designerRef = react.useRef(null);
-    var editorRootRef = react.useRef(null);
+    var _a = React.useState(null), placeholder = _a[0], setPlaceholder = _a[1];
+    var onDefinitionChangeRef = React.useRef(props.onDefinitionChange);
+    var onSelectedStepIdChangedRef = React.useRef(props.onSelectedStepIdChanged);
+    var globalEditorRef = React.useRef(props.globalEditor);
+    var stepEditorRef = React.useRef(props.stepEditor);
+    var controllerRef = React.useRef(props.controller);
+    var customActionHandlerRef = React.useRef(props.customActionHandler);
+    var designerRef = React.useRef(null);
+    var editorRootRef = React.useRef(null);
     var definition = props.definition;
     var selectedStepId = props.selectedStepId;
     var isReadonly = props.isReadonly;
@@ -176,13 +176,19 @@ function SequentialWorkflowDesigner(props) {
         if (!globalEditorRef.current) {
             throw new Error('Global editor is not provided');
         }
-        return Presenter.render(externalEditorClassName, editorRootRef, jsxRuntime.jsx(GlobalEditorWrapperContext, __assign({ definition: def, context: context }, { children: globalEditorRef.current })));
+        if (React.isValidElement(globalEditorRef.current)) {
+            return Presenter.render(externalEditorClassName, editorRootRef, jsxRuntime.jsx(GlobalEditorWrapperContext, __assign({ definition: def, context: context }, { children: globalEditorRef.current })));
+        }
+        return globalEditorRef.current(def, context);
     }
     function stepEditorProvider(step, context) {
         if (!stepEditorRef.current) {
             throw new Error('Step editor is not provided');
         }
-        return Presenter.render(externalEditorClassName, editorRootRef, jsxRuntime.jsx(StepEditorWrapperContext, __assign({ step: step, context: context }, { children: stepEditorRef.current })));
+        if (React.isValidElement(stepEditorRef.current)) {
+            return Presenter.render(externalEditorClassName, editorRootRef, jsxRuntime.jsx(StepEditorWrapperContext, __assign({ step: step, context: context }, { children: stepEditorRef.current })));
+        }
+        return stepEditorRef.current(step, context);
     }
     function customActionHandler(action, step, sequence, context) {
         if (customActionHandlerRef.current) {
@@ -200,22 +206,22 @@ function SequentialWorkflowDesigner(props) {
             // console.log('sqd: designer destroyed');
         }
     }
-    react.useEffect(function () {
+    React.useEffect(function () {
         onDefinitionChangeRef.current = props.onDefinitionChange;
     }, [props.onDefinitionChange]);
-    react.useEffect(function () {
+    React.useEffect(function () {
         onSelectedStepIdChangedRef.current = props.onSelectedStepIdChanged;
     }, [props.onSelectedStepIdChanged]);
-    react.useEffect(function () {
+    React.useEffect(function () {
         globalEditorRef.current = props.globalEditor;
     }, [props.globalEditor]);
-    react.useEffect(function () {
+    React.useEffect(function () {
         stepEditorRef.current = props.stepEditor;
     }, [props.stepEditor]);
-    react.useEffect(function () {
+    React.useEffect(function () {
         customActionHandlerRef.current = props.customActionHandler;
     }, [props.customActionHandler]);
-    react.useEffect(function () {
+    React.useEffect(function () {
         if (!placeholder) {
             return;
         }
@@ -274,7 +280,7 @@ function SequentialWorkflowDesigner(props) {
         });
         designerRef.current = designer;
     }, [placeholder, definition, selectedStepId, isReadonly, theme, undoStackSize, toolbox, controlBar, steps, validator, extensions]);
-    react.useEffect(function () {
+    React.useEffect(function () {
         return tryDestroy;
     }, []);
     return jsxRuntime.jsx("div", { ref: setPlaceholder, "data-testid": "designer", className: "sqd-designer-react" });
@@ -328,7 +334,7 @@ var SequentialWorkflowDesignerController = /** @class */ (function () {
     return SequentialWorkflowDesignerController;
 }());
 function useSequentialWorkflowDesignerController(deps) {
-    return react.useMemo(function () { return SequentialWorkflowDesignerController.create(); }, deps || []);
+    return React.useMemo(function () { return SequentialWorkflowDesignerController.create(); }, deps || []);
 }
 
 exports.GlobalEditorWrapperContext = GlobalEditorWrapperContext;

package/lib/esm/index.js

@@ -1,6 +1,6 @@
 import ReactDOM from 'react-dom/client';
 import { jsx } from 'react/jsx-runtime';
-import { createContext, useContext, useState, useRef, useEffect, useMemo } from 'react';
+import React, { createContext, useContext, useState, useRef, useEffect, useMemo } from 'react';
 import { Designer } from 'sequential-workflow-designer';
 
 var Presenter = /** @class */ (function () {
@@ -174,13 +174,19 @@ function SequentialWorkflowDesigner(props) {
         if (!globalEditorRef.current) {
             throw new Error('Global editor is not provided');
         }
-        return Presenter.render(externalEditorClassName, editorRootRef, jsx(GlobalEditorWrapperContext, __assign({ definition: def, context: context }, { children: globalEditorRef.current })));
+        if (React.isValidElement(globalEditorRef.current)) {
+            return Presenter.render(externalEditorClassName, editorRootRef, jsx(GlobalEditorWrapperContext, __assign({ definition: def, context: context }, { children: globalEditorRef.current })));
+        }
+        return globalEditorRef.current(def, context);
     }
     function stepEditorProvider(step, context) {
         if (!stepEditorRef.current) {
             throw new Error('Step editor is not provided');
         }
-        return Presenter.render(externalEditorClassName, editorRootRef, jsx(StepEditorWrapperContext, __assign({ step: step, context: context }, { children: stepEditorRef.current })));
+        if (React.isValidElement(stepEditorRef.current)) {
+            return Presenter.render(externalEditorClassName, editorRootRef, jsx(StepEditorWrapperContext, __assign({ step: step, context: context }, { children: stepEditorRef.current })));
+        }
+        return stepEditorRef.current(step, context);
     }
     function customActionHandler(action, step, sequence, context) {
         if (customActionHandlerRef.current) {

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, ValidatorConfiguration, ToolboxConfiguration, CustomActionHandler, DesignerExtension, Step, StepEditorContext } from 'sequential-workflow-designer';
+import { Definition, GlobalEditorContext, Designer, GlobalEditorProvider, StepEditorProvider, 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;
@@ -61,8 +61,8 @@ interface SequentialWorkflowDesignerProps<TDefinition extends Definition> {
     selectedStepId?: string | null;
     onSelectedStepIdChanged?: (stepId: string | null) => void;
     isReadonly?: boolean;
-    globalEditor: false | JSX.Element;
-    stepEditor: false | JSX.Element;
+    globalEditor: false | JSX.Element | GlobalEditorProvider;
+    stepEditor: false | JSX.Element | StepEditorProvider;
     theme?: string;
     undoStackSize?: number;
     stepsConfiguration: StepsConfiguration;

package/package.json

@@ -1,7 +1,7 @@
 {
 	"name": "sequential-workflow-designer-react",
 	"description": "React wrapper for Sequential Workflow Designer component.",
-	"version": "0.13.1",
+	"version": "0.13.2",
 	"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.13.1"
+		"sequential-workflow-designer": "^0.13.2"
 	},
 	"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.13.1",
+		"sequential-workflow-designer": "^0.13.2",
 		"rollup": "^3.18.0",
 		"rollup-plugin-dts": "^5.2.0",
 		"rollup-plugin-typescript2": "^0.34.1",
@@ -80,4 +80,4 @@
 		"react",
 		"reactjs"
 	]
-}
+}