sequential-workflow-designer 0.38.2 → 0.39.0

package/lib/esm/index.js

@@ -200,15 +200,17 @@ function race(timeout, a, b, c, d) {
 }
 
 class ControlBarApi {
-    static create(state, historyController, stateModifier) {
-        const api = new ControlBarApi(state, historyController, stateModifier);
+    static create(state, historyController, customActionController, stateModifier, configuration) {
+        const api = new ControlBarApi(state, historyController, customActionController, stateModifier, configuration);
         race(0, state.onIsReadonlyChanged, state.onSelectedStepIdChanged, state.onIsDragDisabledChanged, api.isUndoRedoSupported() ? state.onDefinitionChanged : undefined).subscribe(api.onStateChanged.emit);
         return api;
     }
-    constructor(state, historyController, stateModifier) {
+    constructor(state, historyController, customActionController, stateModifier, configuration) {
         this.state = state;
         this.historyController = historyController;
+        this.customActionController = customActionController;
         this.stateModifier = stateModifier;
+        this.configuration = configuration;
         this.onStateChanged = new SimpleEvent();
     }
     isDragDisabled() {
@@ -255,6 +257,16 @@ class ControlBarApi {
             !this.state.isDragging &&
             this.stateModifier.isDeletableById(this.state.selectedStepId));
     }
+    getButtons() {
+        return typeof this.configuration === 'boolean' ? null : this.configuration.buttons || null;
+    }
+    triggerButtonClick(id) {
+        const action = {
+            type: 'controlBarButtonClicked',
+            id
+        };
+        this.customActionController.trigger(action, null, this.state.definition.sequence);
+    }
 }
 
 var KeyboardAction;
@@ -825,7 +837,7 @@ class DesignerApi {
         const workspace = new WorkspaceApi(context.state, context.definitionWalker, context.workspaceController);
         const viewportController = context.services.viewportController.create(workspace);
         const toolboxDataProvider = new ToolboxDataProvider(context.i18n, context.componentContext.iconProvider, context.configuration.toolbox);
-        return new DesignerApi(context.configuration.shadowRoot, ControlBarApi.create(context.state, context.historyController, context.stateModifier), new ToolboxApi(context.state, context, context.behaviorController, toolboxDataProvider, context.uidGenerator), new EditorApi(context.state, context.definitionWalker, context.stateModifier), workspace, new ViewportApi(context.state, context.workspaceController, viewportController), new PathBarApi(context.state, context.definitionWalker), context.definitionWalker, context.i18n);
+        return new DesignerApi(context.configuration.shadowRoot, ControlBarApi.create(context.state, context.historyController, context.customActionController, context.stateModifier, context.configuration.controlBar), new ToolboxApi(context.state, context, context.behaviorController, toolboxDataProvider, context.uidGenerator), new EditorApi(context.state, context.definitionWalker, context.stateModifier), workspace, new ViewportApi(context.state, context.workspaceController, viewportController), new PathBarApi(context.state, context.definitionWalker), context.definitionWalker, context.i18n);
     }
     constructor(shadowRoot, controlBar, toolbox, editor, workspace, viewport, pathBar, definitionWalker, i18n) {
         this.shadowRoot = shadowRoot;
@@ -3787,6 +3799,7 @@ class ContextMenuController {
         this.itemsBuilder = itemsBuilder;
     }
     tryOpen(position, commandOrNull) {
+        var _a, _b;
         if (this.configuration.contextMenu === false) {
             // Context menu is disabled.
             return;
@@ -3794,8 +3807,11 @@ class ContextMenuController {
         if (this.current) {
             this.current.tryDestroy();
         }
-        const items = this.itemsBuilder.build(commandOrNull);
-        this.current = ContextMenu.create(this.configuration.shadowRoot, position, this.theme, items);
+        const isResetViewDisabled = this.configuration.contextMenu === true ? false : (_b = (_a = this.configuration.contextMenu) === null || _a === void 0 ? void 0 : _a.isResetViewDisabled) !== null && _b !== void 0 ? _b : false;
+        const items = this.itemsBuilder.build(commandOrNull, isResetViewDisabled);
+        if (items.length > 0) {
+            this.current = ContextMenu.create(this.configuration.shadowRoot, position, this.theme, items);
+        }
     }
     destroy() {
         if (this.current) {
@@ -3813,7 +3829,7 @@ class ContextMenuItemsBuilder {
         this.state = state;
         this.customMenuItemsProvider = customMenuItemsProvider;
     }
-    build(commandOrNull) {
+    build(commandOrNull, isResetViewDisabled) {
         const items = [];
         if (commandOrNull && commandOrNull.type === ClickCommandType.selectStep) {
             const ssc = commandOrNull;
@@ -3870,13 +3886,15 @@ class ContextMenuItemsBuilder {
             const rootSequence = this.workspaceApi.getRootSequence();
             this.tryAppendCustomItems(items, null, rootSequence.sequence);
         }
-        items.push({
-            label: this.i18n('contextMenu.resetView', 'Reset view'),
-            order: 50,
-            callback: () => {
-                this.viewportApi.resetViewport();
-            }
-        });
+        if (!isResetViewDisabled) {
+            items.push({
+                label: this.i18n('contextMenu.resetView', 'Reset view'),
+                order: 50,
+                callback: () => {
+                    this.viewportApi.resetViewport();
+                }
+            });
+        }
         items.sort((a, b) => a.order - b.order);
         return items;
     }
@@ -4235,7 +4253,7 @@ class DefaultDraggedComponentExtension {
 }
 
 class ControlBarView {
-    static create(parent, isUndoRedoSupported, i18n) {
+    static create(parent, isUndoRedoSupported, buttons, i18n) {
         const root = Dom.element('div', {
             class: 'sqd-control-bar'
         });
@@ -4260,10 +4278,19 @@ class ControlBarView {
         deleteButton.classList.add('sqd-delete');
         deleteButton.classList.add('sqd-hidden');
         root.appendChild(deleteButton);
+        const customButtons = [];
+        if (buttons) {
+            for (const customButton of buttons) {
+                const button = createButton(customButton.iconD, customButton.label);
+                button.setAttribute('data-id', customButton.id);
+                root.appendChild(button);
+                customButtons.push(button);
+            }
+        }
         parent.appendChild(root);
-        return new ControlBarView(resetButton, zoomInButton, zoomOutButton, undoButton, redoButton, disableDragButton, deleteButton);
+        return new ControlBarView(resetButton, zoomInButton, zoomOutButton, undoButton, redoButton, disableDragButton, deleteButton, customButtons);
     }
-    constructor(resetButton, zoomInButton, zoomOutButton, undoButton, redoButton, disableDragButton, deleteButton) {
+    constructor(resetButton, zoomInButton, zoomOutButton, undoButton, redoButton, disableDragButton, deleteButton, customButtons) {
         this.resetButton = resetButton;
         this.zoomInButton = zoomInButton;
         this.zoomOutButton = zoomOutButton;
@@ -4271,6 +4298,7 @@ class ControlBarView {
         this.redoButton = redoButton;
         this.disableDragButton = disableDragButton;
         this.deleteButton = deleteButton;
+        this.customButtons = customButtons;
     }
     bindResetButtonClick(handler) {
         bindClick(this.resetButton, handler);
@@ -4299,6 +4327,14 @@ class ControlBarView {
     bindDeleteButtonClick(handler) {
         bindClick(this.deleteButton, handler);
     }
+    bindCustomButtonClick(handler) {
+        for (const customButton of this.customButtons) {
+            const id = customButton.getAttribute('data-id');
+            if (id) {
+                bindClick(customButton, () => handler(id));
+            }
+        }
+    }
     setIsDeleteButtonHidden(isHidden) {
         Dom.toggleClass(this.deleteButton, isHidden, 'sqd-hidden');
     }
@@ -4337,17 +4373,21 @@ function createButton(d, title) {
 class ControlBar {
     static create(parent, api) {
         const isUndoRedoSupported = api.controlBar.isUndoRedoSupported();
-        const view = ControlBarView.create(parent, isUndoRedoSupported, api.i18n);
+        const customButtons = api.controlBar.getButtons();
+        const view = ControlBarView.create(parent, isUndoRedoSupported, customButtons, api.i18n);
         const bar = new ControlBar(view, api.controlBar, api.viewport, isUndoRedoSupported);
-        view.bindResetButtonClick(() => bar.onResetButtonClicked());
-        view.bindZoomInButtonClick(() => bar.onZoomInButtonClicked());
-        view.bindZoomOutButtonClick(() => bar.onZoomOutButtonClicked());
-        view.bindDisableDragButtonClick(() => bar.onMoveButtonClicked());
-        view.bindDeleteButtonClick(() => bar.onDeleteButtonClicked());
-        api.controlBar.onStateChanged.subscribe(() => bar.refreshButtons());
+        view.bindResetButtonClick(bar.onResetButtonClicked);
+        view.bindZoomInButtonClick(bar.onZoomInButtonClicked);
+        view.bindZoomOutButtonClick(bar.onZoomOutButtonClicked);
+        view.bindDisableDragButtonClick(bar.onMoveButtonClicked);
+        view.bindDeleteButtonClick(bar.onDeleteButtonClicked);
+        api.controlBar.onStateChanged.subscribe(bar.refreshButtons);
         if (isUndoRedoSupported) {
-            view.bindUndoButtonClick(() => bar.onUndoButtonClicked());
-            view.bindRedoButtonClick(() => bar.onRedoButtonClicked());
+            view.bindUndoButtonClick(bar.onUndoButtonClicked);
+            view.bindRedoButtonClick(bar.onRedoButtonClicked);
+        }
+        if (customButtons) {
+            view.bindCustomButtonClick(bar.onCustomButtonClicked);
         }
         bar.refreshButtons();
         return bar;
@@ -4357,6 +4397,37 @@ class ControlBar {
         this.controlBarApi = controlBarApi;
         this.viewportApi = viewportApi;
         this.isUndoRedoSupported = isUndoRedoSupported;
+        this.onResetButtonClicked = () => {
+            this.viewportApi.resetViewport();
+        };
+        this.onZoomInButtonClicked = () => {
+            this.viewportApi.zoom(true);
+        };
+        this.onZoomOutButtonClicked = () => {
+            this.viewportApi.zoom(false);
+        };
+        this.onMoveButtonClicked = () => {
+            this.controlBarApi.toggleIsDragDisabled();
+        };
+        this.onUndoButtonClicked = () => {
+            this.controlBarApi.tryUndo();
+        };
+        this.onRedoButtonClicked = () => {
+            this.controlBarApi.tryRedo();
+        };
+        this.onDeleteButtonClicked = () => {
+            this.controlBarApi.tryDelete();
+        };
+        this.refreshButtons = () => {
+            this.refreshDeleteButtonVisibility();
+            this.refreshIsDragDisabled();
+            if (this.isUndoRedoSupported) {
+                this.refreshUndoRedoAvailability();
+            }
+        };
+        this.onCustomButtonClicked = (id) => {
+            this.controlBarApi.triggerButtonClick(id);
+        };
     }
     updateLayout() {
         //
@@ -4364,34 +4435,6 @@ class ControlBar {
     destroy() {
         //
     }
-    onResetButtonClicked() {
-        this.viewportApi.resetViewport();
-    }
-    onZoomInButtonClicked() {
-        this.viewportApi.zoom(true);
-    }
-    onZoomOutButtonClicked() {
-        this.viewportApi.zoom(false);
-    }
-    onMoveButtonClicked() {
-        this.controlBarApi.toggleIsDragDisabled();
-    }
-    onUndoButtonClicked() {
-        this.controlBarApi.tryUndo();
-    }
-    onRedoButtonClicked() {
-        this.controlBarApi.tryRedo();
-    }
-    onDeleteButtonClicked() {
-        this.controlBarApi.tryDelete();
-    }
-    refreshButtons() {
-        this.refreshDeleteButtonVisibility();
-        this.refreshIsDragDisabled();
-        if (this.isUndoRedoSupported) {
-            this.refreshUndoRedoAvailability();
-        }
-    }
     //
     refreshIsDragDisabled() {
         const isDragDisabled = this.controlBarApi.isDragDisabled();
@@ -5066,8 +5109,8 @@ class Designer {
     /**
      * Creates a designer.
      * @param placeholder Placeholder where the designer will be attached.
-     * @param startDefinition Start definition of a flow.
-     * @param configuration Designer's configuration.
+     * @param startDefinition Initial definition of the workflow.
+     * @param configuration The designer configuration.
      * @returns An instance of the designer.
      */
     static create(placeholder, startDefinition, configuration) {
@@ -5154,37 +5197,37 @@ class Designer {
         this.onPreferencesChanged = new SimpleEvent();
     }
     /**
-     * @returns the current definition of the workflow.
+     * @returns The current definition of the workflow.
      */
     getDefinition() {
         return this.state.definition;
     }
     /**
-     * @returns the validation result of the current definition.
+     * @returns The validation result of the current definition.
      */
     isValid() {
         return this.view.workspace.isValid;
     }
     /**
-     * @returns the readonly flag.
+     * @returns The read-only flag.
      */
     isReadonly() {
         return this.state.isReadonly;
     }
     /**
-     * @description Changes the readonly flag.
+     * @description Changes the read-only flag.
      */
     setIsReadonly(isReadonly) {
         this.state.setIsReadonly(isReadonly);
     }
     /**
-     * @returns current selected step id or `null` if nothing is selected.
+     * @returns The currently selected step id, or `null` if nothing is selected.
      */
     getSelectedStepId() {
         return this.state.selectedStepId;
     }
     /**
-     * @description Selects a step by the id.
+     * @description Selects a step by id.
      */
     selectStepById(stepId) {
         this.state.setSelectedStepId(stepId);
@@ -5196,7 +5239,7 @@ class Designer {
         this.state.setSelectedStepId(null);
     }
     /**
-     * @returns the current viewport.
+     * @returns The current viewport.
      */
     getViewport() {
         return this.state.viewport;
@@ -5215,13 +5258,13 @@ class Designer {
         this.api.viewport.resetViewport();
     }
     /**
-     * @description Moves the viewport to the step with the animation.
+     * @description Moves the viewport to the step with animation.
      */
     moveViewportToStep(stepId) {
         this.api.viewport.moveViewportToStep(stepId);
     }
     /**
-     * @description Rerender the root component and all its children.
+     * @description Rerenders the root component and all its children.
      */
     updateRootComponent() {
         this.api.workspace.updateRootComponent();
@@ -5240,37 +5283,37 @@ class Designer {
         this.api.workspace.updateBadges();
     }
     /**
-     * @returns a flag that indicates whether the toolbox is collapsed.
+     * @returns A flag that indicates whether the toolbox is collapsed.
      */
     isToolboxCollapsed() {
         return this.state.isToolboxCollapsed;
     }
     /**
-     * @description Sets a flag that indicates whether the toolbox is collapsed.
+     * @description Sets the flag that indicates whether the toolbox is collapsed.
      */
     setIsToolboxCollapsed(isCollapsed) {
         this.state.setIsToolboxCollapsed(isCollapsed);
     }
     /**
-     * @returns a flag that indicates whether the editor is collapsed.
+     * @returns A flag that indicates whether the editor is collapsed.
      */
     isEditorCollapsed() {
         return this.state.isEditorCollapsed;
     }
     /**
-     * @returns a flag that indicates whether the step is being dragged.
+     * @returns A flag that indicates whether a step is being dragged.
      */
     isDragging() {
         return this.state.isDragging;
     }
     /**
-     * @description Sets a flag that indicates whether the editor is collapsed.
+     * @description Sets the flag that indicates whether the editor is collapsed.
      */
     setIsEditorCollapsed(isCollapsed) {
         this.state.setIsEditorCollapsed(isCollapsed);
     }
     /**
-     * @description Dump the undo stack.
+     * @description Dumps the undo stack.
      */
     dumpUndoStack() {
         return this.getHistoryController().dump();
@@ -5290,13 +5333,13 @@ class Designer {
     }
     /**
      * @param needle A step, a sequence or a step id.
-     * @returns parent steps and branch names.
+     * @returns Parent steps and branch names.
      */
     getStepParents(needle) {
         return this.walker.getParents(this.state.definition, needle);
     }
     /**
-     * @returns the definition walker.
+     * @returns The definition walker.
      */
     getWalker() {
         return this.walker;

package/lib/index.d.ts

@@ -1029,11 +1029,11 @@ interface DesignerConfiguration<TDefinition extends Definition = Definition> {
      */
     theme?: string;
     /**
-     * @description The readonly mode of the designer.
+     * @description The read-only mode of the designer.
      */
     isReadonly?: boolean;
     /**
-     * @description The depth of the undo stack. If not set, undo/redo feature will be disabled.
+     * @description The depth of the undo stack. If not set, the undo/redo feature will be disabled.
      */
     undoStackSize?: number;
     /**
@@ -1041,7 +1041,7 @@ interface DesignerConfiguration<TDefinition extends Definition = Definition> {
      */
     undoStack?: UndoStack;
     /**
-     * @description The common configuration of the steps.
+     * @description The common configuration for steps.
      */
     steps: StepsConfiguration;
     /**
@@ -1057,15 +1057,15 @@ interface DesignerConfiguration<TDefinition extends Definition = Definition> {
      */
     editors: false | EditorsConfiguration<TDefinition>;
     /**
-     * @description If true, the control bar will be displayed. In the next version, this property will be required.
+     * @description If set to `true` or a configuration object, the control bar will be displayed.
      */
-    controlBar: boolean;
+    controlBar: boolean | ControlBarConfiguration;
     /**
-     * @description If false, the context menu will be disabled. By default, the context menu is enabled.
+     * @description If set to `false`, the context menu will be disabled. By default, the context menu is enabled.
      */
-    contextMenu?: boolean;
+    contextMenu?: boolean | ContextMenuConfiguration;
     /**
-     * @description The configuration of validators.
+     * @description The configuration of the validators.
      */
     validator?: ValidatorConfiguration;
     /**
@@ -1085,11 +1085,11 @@ interface DesignerConfiguration<TDefinition extends Definition = Definition> {
      */
     definitionWalker?: DefinitionWalker;
     /**
-     * @description Custom preference storage. By default, all preferences are stored in the memory.
+     * @description Custom preference storage. By default, all preferences are stored in memory.
      */
     preferenceStorage?: PreferenceStorage;
     /**
-     * @description Custom generator of unique identifiers.
+     * @description Custom unique identifier generator.
      */
     uidGenerator?: UidGenerator;
     /**
@@ -1097,11 +1097,11 @@ interface DesignerConfiguration<TDefinition extends Definition = Definition> {
      */
     i18n?: I18n;
     /**
-     * @description Custom text width measurer. By default, the designer uses `getBBox()` method to measure the width of the text.
+     * @description Custom text width measurer. By default, the designer uses the `getBBox()` method to measure the width of the text.
      */
     textWidthMeasurer?: TextWidthMeasurer;
     /**
-     * @description Pass the shadow root of the shadow root to the designer if the designer is placed inside the shadow DOM.
+     * @description Pass the shadow root to the designer if the designer is placed inside the shadow DOM.
      */
     shadowRoot?: ShadowRoot;
 }
@@ -1111,6 +1111,10 @@ type CustomActionHandler = (action: CustomAction, step: Step | null, sequence: S
 interface CustomAction {
     type: string;
 }
+interface ControlBarButtonClickedCustomAction extends CustomAction {
+    type: 'controlBarButtonClicked';
+    id: string;
+}
 interface CustomActionHandlerContext {
     /**
      * @description Notifies the designer that the name of the step has changed.
@@ -1166,7 +1170,7 @@ interface StepsConfiguration {
     canMoveStep?: (sourceSequence: Sequence, step: Step, targetSequence: Sequence, targetIndex: number) => boolean;
     canDeleteStep?: (step: Step, parentSequence: Sequence) => boolean;
     /**
-     * @description The designer automatically selects the step after it is dropped. If true, the step will not be selected.
+     * @description The designer automatically selects the step after it is dropped. If `true`, the step will not be selected.
      */
     isAutoSelectDisabled?: boolean;
     iconUrlProvider?: StepIconUrlProvider;
@@ -1182,6 +1186,32 @@ interface ValidatorConfiguration {
 }
 type StepValidator = (step: Step, parentSequence: Sequence, definition: Definition) => boolean;
 type RootValidator = (definition: Definition) => boolean;
+interface ControlBarConfiguration {
+    /**
+     * @description Custom buttons displayed in the control bar.
+     */
+    buttons?: ControlBarButton[];
+}
+interface ControlBarButton {
+    /**
+     * @description The unique identifier of the custom button.
+     */
+    id: string;
+    /**
+     * @description The SVG path data used as the button icon.
+     */
+    iconD: string;
+    /**
+     * @description The button label, used as the button title.
+     */
+    label: string;
+}
+interface ContextMenuConfiguration {
+    /**
+     * @description If set to `true`, the default "Reset view" item will be hidden.
+     */
+    isResetViewDisabled?: boolean;
+}
 interface KeyboardConfiguration {
     canHandleKey?: (action: KeyboardAction, event: KeyboardEvent) => boolean;
 }
@@ -1276,8 +1306,10 @@ declare class StateModifier {
 declare class ControlBarApi {
     private readonly state;
     private readonly historyController;
+    private readonly customActionController;
     private readonly stateModifier;
-    static create(state: DesignerState, historyController: HistoryController | undefined, stateModifier: StateModifier): ControlBarApi;
+    private readonly configuration;
+    static create(state: DesignerState, historyController: HistoryController | undefined, customActionController: CustomActionController, stateModifier: StateModifier, configuration: ControlBarConfiguration | boolean): ControlBarApi;
     private constructor();
     readonly onStateChanged: SimpleEvent<unknown>;
     isDragDisabled(): boolean;
@@ -1290,6 +1322,8 @@ declare class ControlBarApi {
     canRedo(): boolean;
     tryDelete(): boolean;
     canDelete(): boolean;
+    getButtons(): ControlBarButton[] | null;
+    triggerButtonClick(id: string): void;
 }
 
 declare class DefaultViewportControllerDesignerExtension implements DesignerExtension {
@@ -1360,8 +1394,8 @@ declare class Designer<TDefinition extends Definition = Definition> {
     /**
      * Creates a designer.
      * @param placeholder Placeholder where the designer will be attached.
-     * @param startDefinition Start definition of a flow.
-     * @param configuration Designer's configuration.
+     * @param startDefinition Initial definition of the workflow.
+     * @param configuration The designer configuration.
      * @returns An instance of the designer.
      */
     static create<TDef extends Definition>(placeholder: HTMLElement, startDefinition: TDef, configuration: DesignerConfiguration<TDef>): Designer<TDef>;
@@ -1407,27 +1441,27 @@ declare class Designer<TDefinition extends Definition = Definition> {
      */
     readonly onPreferencesChanged: SimpleEvent<PreferencesChangedEvent>;
     /**
-     * @returns the current definition of the workflow.
+     * @returns The current definition of the workflow.
      */
     getDefinition(): TDefinition;
     /**
-     * @returns the validation result of the current definition.
+     * @returns The validation result of the current definition.
      */
     isValid(): boolean;
     /**
-     * @returns the readonly flag.
+     * @returns The read-only flag.
      */
     isReadonly(): boolean;
     /**
-     * @description Changes the readonly flag.
+     * @description Changes the read-only flag.
      */
     setIsReadonly(isReadonly: boolean): void;
     /**
-     * @returns current selected step id or `null` if nothing is selected.
+     * @returns The currently selected step id, or `null` if nothing is selected.
      */
     getSelectedStepId(): string | null;
     /**
-     * @description Selects a step by the id.
+     * @description Selects a step by id.
      */
     selectStepById(stepId: string): void;
     /**
@@ -1435,7 +1469,7 @@ declare class Designer<TDefinition extends Definition = Definition> {
      */
     clearSelectedStep(): void;
     /**
-     * @returns the current viewport.
+     * @returns The current viewport.
      */
     getViewport(): Viewport;
     /**
@@ -1448,11 +1482,11 @@ declare class Designer<TDefinition extends Definition = Definition> {
      */
     resetViewport(): void;
     /**
-     * @description Moves the viewport to the step with the animation.
+     * @description Moves the viewport to the step with animation.
      */
     moveViewportToStep(stepId: string): void;
     /**
-     * @description Rerender the root component and all its children.
+     * @description Rerenders the root component and all its children.
      */
     updateRootComponent(): void;
     /**
@@ -1464,27 +1498,27 @@ declare class Designer<TDefinition extends Definition = Definition> {
      */
     updateBadges(): void;
     /**
-     * @returns a flag that indicates whether the toolbox is collapsed.
+     * @returns A flag that indicates whether the toolbox is collapsed.
      */
     isToolboxCollapsed(): boolean;
     /**
-     * @description Sets a flag that indicates whether the toolbox is collapsed.
+     * @description Sets the flag that indicates whether the toolbox is collapsed.
      */
     setIsToolboxCollapsed(isCollapsed: boolean): void;
     /**
-     * @returns a flag that indicates whether the editor is collapsed.
+     * @returns A flag that indicates whether the editor is collapsed.
      */
     isEditorCollapsed(): boolean;
     /**
-     * @returns a flag that indicates whether the step is being dragged.
+     * @returns A flag that indicates whether a step is being dragged.
      */
     isDragging(): boolean;
     /**
-     * @description Sets a flag that indicates whether the editor is collapsed.
+     * @description Sets the flag that indicates whether the editor is collapsed.
      */
     setIsEditorCollapsed(isCollapsed: boolean): void;
     /**
-     * @description Dump the undo stack.
+     * @description Dumps the undo stack.
      */
     dumpUndoStack(): UndoStack;
     /**
@@ -1494,11 +1528,11 @@ declare class Designer<TDefinition extends Definition = Definition> {
     replaceDefinition(definition: TDefinition): Promise<void>;
     /**
      * @param needle A step, a sequence or a step id.
-     * @returns parent steps and branch names.
+     * @returns Parent steps and branch names.
      */
     getStepParents(needle: Sequence | Step | string): StepOrName[];
     /**
-     * @returns the definition walker.
+     * @returns The definition walker.
      */
     getWalker(): DefinitionWalker;
     /**
@@ -1509,4 +1543,4 @@ declare class Designer<TDefinition extends Definition = Definition> {
 }
 
 export { Badges, CenteredViewportCalculator, ClassicWheelControllerExtension, ClickCommandType, ComponentContext, ComponentDom, ControlBarApi, CustomActionController, DefaultRegionComponentViewExtension, DefaultRegionView, DefaultSequenceComponent, DefaultSequenceComponentView, DefaultViewportController, DefaultViewportControllerDesignerExtension, DefaultViewportControllerExtension, DefinitionChangeType, Designer, DesignerApi, DesignerContext, DesignerState, Dom, Editor, EditorApi, Icons, InputView, JoinView, KeyboardAction, LabelView, LineGridDesignerExtension, ObjectCloner, OutputView, PathBarApi, PlaceholderController, PlaceholderDirection, PlaceholderGapOrientation, RectPlaceholder, RectPlaceholderDesignerExtension, RectPlaceholderView, SelectStepBehaviorEndToken, ServicesResolver, SimpleEvent, StartStopRootComponentDesignerExtension, StartStopRootComponentExtension, StepComponent, StepExtensionResolver, StepsDesignerExtension, TYPE, ToolboxApi, Uid, ValidationErrorBadgeExtension, Vector, ViewportApi, WorkspaceApi, createContainerStepComponentViewFactory, createLaunchPadStepComponentViewFactory, createSwitchStepComponentViewFactory, createTaskStepComponentViewFactory, getAbsolutePosition, race };
-export type { Attributes, Badge, BadgeExtension, BadgeView, BadgesDecorator, BadgesResult, BaseClickCommand, Behavior, BehaviorEndToken, BranchNameLabelResolver, BranchNamesResolver, ClickBehaviorWrapper, ClickBehaviorWrapperExtension, ClickCommand, ClickDetails, Component, ComponentView, ContainerStepComponentViewConfiguration, ContainerStepExtensionConfiguration, ContextMenuExtension, ContextMenuItem, ContextMenuItemsProvider, CustomAction, CustomActionHandler, CustomActionHandlerContext, Daemon, DaemonExtension, DefaultViewportControllerConfiguration, DefaultViewportControllerExtensionConfiguration, DefinitionChangedEvent, DefinitionChangedEventDetails, DesignerConfiguration, DesignerExtension, DraggedComponent, DraggedComponentExtension, DuplicatedStepId, EditorsConfiguration, FoundPlaceholders, Grid, GridExtension, I18n, KeyboardConfiguration, LaunchPadStepComponentViewConfiguration, LaunchPadStepExtensionConfiguration, LineGridConfiguration, NextScale, OpenFolderClickCommand, Placeholder, PlaceholderConfiguration, PlaceholderExtension, PlaceholderView, PreferenceChange, PreferenceStorage, PreferencesChangedEvent, RectPlaceholderConfiguration, RegionComponentViewContentFactory, RegionComponentViewExtension, RegionView, RegionViewFactory, RootComponentExtension, RootEditorContext, RootEditorProvider, RootValidator, SelectStepClickCommand, SelectedStepIdProvider, SequenceComponent, SequenceComponentExtension, SequenceContext, SequencePlaceIndicator, Services, SetPreferencesClickCommand, SimpleEventListener, StartStopRootComponentExtensionConfiguration, StartStopRootComponentViewConfiguration, StateModifierDependency, StepBadgesDecoratorExtension, StepComponentView, StepComponentViewContext, StepComponentViewFactory, StepComponentViewWrapperExtension, StepContext, StepDefinition, StepDescriptionProvider, StepEditorContext, StepEditorProvider, StepExtension, StepIconUrlProvider, StepLabelProvider, StepValidator, StepsConfiguration, StepsDesignerExtensionConfiguration, SwitchStepComponentViewConfiguration, SwitchStepExtensionConfiguration, TaskStepComponentViewConfiguration, TaskStepExtensionConfiguration, TextWidthMeasurer, ToolboxConfiguration, ToolboxGroupConfiguration, TriggerCustomActionClickCommand, UiComponent, UiComponentExtension, UidGenerator, UndoStack, UndoStackItem, ValidationErrorBadgeExtensionConfiguration, ValidationErrorBadgeViewConfiguration, ValidatorConfiguration, Viewport, ViewportController, ViewportControllerExtension, WheelController, WheelControllerExtension, WorkspaceRootSequence };
+export type { Attributes, Badge, BadgeExtension, BadgeView, BadgesDecorator, BadgesResult, BaseClickCommand, Behavior, BehaviorEndToken, BranchNameLabelResolver, BranchNamesResolver, ClickBehaviorWrapper, ClickBehaviorWrapperExtension, ClickCommand, ClickDetails, Component, ComponentView, ContainerStepComponentViewConfiguration, ContainerStepExtensionConfiguration, ContextMenuConfiguration, ContextMenuExtension, ContextMenuItem, ContextMenuItemsProvider, ControlBarButton, ControlBarButtonClickedCustomAction, ControlBarConfiguration, CustomAction, CustomActionHandler, CustomActionHandlerContext, Daemon, DaemonExtension, DefaultViewportControllerConfiguration, DefaultViewportControllerExtensionConfiguration, DefinitionChangedEvent, DefinitionChangedEventDetails, DesignerConfiguration, DesignerExtension, DraggedComponent, DraggedComponentExtension, DuplicatedStepId, EditorsConfiguration, FoundPlaceholders, Grid, GridExtension, I18n, KeyboardConfiguration, LaunchPadStepComponentViewConfiguration, LaunchPadStepExtensionConfiguration, LineGridConfiguration, NextScale, OpenFolderClickCommand, Placeholder, PlaceholderConfiguration, PlaceholderExtension, PlaceholderView, PreferenceChange, PreferenceStorage, PreferencesChangedEvent, RectPlaceholderConfiguration, RegionComponentViewContentFactory, RegionComponentViewExtension, RegionView, RegionViewFactory, RootComponentExtension, RootEditorContext, RootEditorProvider, RootValidator, SelectStepClickCommand, SelectedStepIdProvider, SequenceComponent, SequenceComponentExtension, SequenceContext, SequencePlaceIndicator, Services, SetPreferencesClickCommand, SimpleEventListener, StartStopRootComponentExtensionConfiguration, StartStopRootComponentViewConfiguration, StateModifierDependency, StepBadgesDecoratorExtension, StepComponentView, StepComponentViewContext, StepComponentViewFactory, StepComponentViewWrapperExtension, StepContext, StepDefinition, StepDescriptionProvider, StepEditorContext, StepEditorProvider, StepExtension, StepIconUrlProvider, StepLabelProvider, StepValidator, StepsConfiguration, StepsDesignerExtensionConfiguration, SwitchStepComponentViewConfiguration, SwitchStepExtensionConfiguration, TaskStepComponentViewConfiguration, TaskStepExtensionConfiguration, TextWidthMeasurer, ToolboxConfiguration, ToolboxGroupConfiguration, TriggerCustomActionClickCommand, UiComponent, UiComponentExtension, UidGenerator, UndoStack, UndoStackItem, ValidationErrorBadgeExtensionConfiguration, ValidationErrorBadgeViewConfiguration, ValidatorConfiguration, Viewport, ViewportController, ViewportControllerExtension, WheelController, WheelControllerExtension, WorkspaceRootSequence };