Skip to content

Commit 365e409

Browse files
b4rtazb4rtaz
authored
0.16.4. (#91)
1 parent e2ca34e commit 365e409

39 files changed

+443
-121
lines changed

‎.github/workflows/examples.yml

+5
Original file line numberDiff line numberDiff line change
@@ -33,6 +33,11 @@ jobs:
3333
cp -R examples _deploy
3434
cp -R demos/angular-app/dist/angular-app _deploy/angular-app
3535
cp -R demos/react-app/build _deploy/react-app
36+
- name: Append Analytics
37+
run: |
38+
node scripts/append-ga.cjs _deploy/examples
39+
node scripts/append-ga.cjs _deploy/react-app
40+
node scripts/append-ga.cjs _deploy/angular-app
3641
- name: Upload artifact
3742
uses: actions/upload-pages-artifact@v1
3843
with:

‎.github/workflows/main.yml

+2-3
Original file line numberDiff line numberDiff line change
@@ -13,13 +13,12 @@ jobs:
1313
strategy:
1414
matrix:
1515
os: [ubuntu-latest]
16-
node: [16]
1716
steps:
1817
- name: Checkout Repo
1918
uses: actions/checkout@v2
20-
- name: Setup Node 16
19+
- name: Setup Node
2120
uses: actions/setup-node@v2
2221
with:
23-
node-version: '16'
22+
node-version: '18'
2423
- name: main.sh
2524
run: bash .github/workflows/main.sh

‎CHANGELOG.md

+29
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,32 @@
1+
## 0.16.4
2+
3+
This version introduces the `isAutoSelectDisabled` option. Now it's possible to disable the auto-select feature.
4+
5+
```js
6+
const configuration = {
7+
steps: {
8+
isAutoSelectDisabled: true,
9+
// ...
10+
}
11+
};
12+
```
13+
14+
Additionally, this version introduces possibility to initialize the designer with the undo stack from the previous session.
15+
16+
```js
17+
const configuration = {
18+
undoStackSize: 10,
19+
undoStack: myUndoStack,
20+
// ...
21+
};
22+
```
23+
24+
To read the current stack you should use the `dumpUndoStack()` method.
25+
26+
```js
27+
const myUndoStack = designer.dumpUndoStack();
28+
```
29+
130
## 0.16.3
231

332
This version adds: `isReadonly`, `selectedStepId`, `uidGenerator`, `isToolboxCollapsed` and `isEditorCollapsed` properties and `onIsToolboxCollapsedChanged` and `onIsEditorCollapsedChanged` events to the Angular package.

‎README.md

+5-5
Original file line numberDiff line numberDiff line change
@@ -27,12 +27,12 @@ Features:
2727
* [🔴 Particles](https://nocode-js.github.io/sequential-workflow-designer/examples/particles.html)
2828
* [⛅ Light Dark](https://nocode-js.github.io/sequential-workflow-designer/examples/light-dark.html)
2929
* [🤖 Code Generator](https://nocode-js.github.io/sequential-workflow-designer/examples/code-generator.html)
30-
* [📐 Simple Flow](https://nocode-js.github.io/sequential-workflow-designer/examples/simple-flow.html)
3130
* [🌻 Rendering Test](https://nocode-js.github.io/sequential-workflow-designer/examples/rendering-test.html)
3231
* [🚄 Stress Test](https://nocode-js.github.io/sequential-workflow-designer/examples/stress-test.html)
3332
* [🚪 Editing Restrictions](https://nocode-js.github.io/sequential-workflow-designer/examples/editing-restrictions.html)
3433
* [📜 Scrollable Page](https://nocode-js.github.io/sequential-workflow-designer/examples/scrollable-page.html)
3534
* [🌵 Multi-Conditional Switch](https://nocode-js.github.io/sequential-workflow-designer/examples/multi-conditional-switch.html)
35+
* [🌀 Auto-Select](https://nocode-js.github.io/sequential-workflow-designer/examples/auto-select.html)
3636
* [React Demo](https://nocode-js.github.io/sequential-workflow-designer/react-app/)
3737
* [Angular Demo](https://nocode-js.github.io/sequential-workflow-designer/angular-app/)
3838

@@ -95,10 +95,10 @@ Add the below code to your head section in HTML document.
9595
```html
9696
<head>
9797
...
98-
<link href="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.16.3/css/designer.css" rel="stylesheet">
99-
<link href="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.16.3/css/designer-light.css" rel="stylesheet">
100-
<link href="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.16.3/css/designer-dark.css" rel="stylesheet">
101-
<script src="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.16.3/dist/index.umd.js"></script>
98+
<link href="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.16.4/css/designer.css" rel="stylesheet">
99+
<link href="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.16.4/css/designer-light.css" rel="stylesheet">
100+
<link href="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.16.4/css/designer-dark.css" rel="stylesheet">
101+
<script src="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.16.4/dist/index.umd.js"></script>
102102
```
103103

104104
Call the designer by:

‎angular/designer/package.json

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
{
22
"name": "sequential-workflow-designer-angular",
33
"description": "Angular wrapper for Sequential Workflow Designer component.",
4-
"version": "0.16.3",
4+
"version": "0.16.4",
55
"author": {
66
"name": "NoCode JS",
77
"url": "https://nocode-js.com/"
@@ -15,7 +15,7 @@
1515
"peerDependencies": {
1616
"@angular/common": "12 - 16",
1717
"@angular/core": "12 - 16",
18-
"sequential-workflow-designer": "^0.16.3"
18+
"sequential-workflow-designer": "^0.16.4"
1919
},
2020
"dependencies": {
2121
"tslib": "^2.3.0"

‎demos/angular-app/package.json

+2-2
Original file line numberDiff line numberDiff line change
@@ -26,8 +26,8 @@
2626
"@angular/platform-browser-dynamic": "^15.2.9",
2727
"@angular/router": "^15.2.9",
2828
"rxjs": "~7.8.0",
29-
"sequential-workflow-designer": "^0.16.3",
30-
"sequential-workflow-designer-angular": "^0.16.3",
29+
"sequential-workflow-designer": "^0.16.4",
30+
"sequential-workflow-designer-angular": "^0.16.4",
3131
"tslib": "^2.3.0",
3232
"zone.js": "~0.13.0"
3333
},

‎demos/angular-app/yarn.lock

+8-8
Original file line numberDiff line numberDiff line change
@@ -5956,17 +5956,17 @@ send@0.18.0:
59565956
range-parser "~1.2.1"
59575957
statuses "2.0.1"
59585958

5959-
sequential-workflow-designer-angular@^0.16.3:
5960-
version "0.16.3"
5961-
resolved "https://registry.yarnpkg.com/sequential-workflow-designer-angular/-/sequential-workflow-designer-angular-0.16.3.tgz#ad10976164b7c4e85bcb73c0585fb73701761648"
5962-
integrity sha512-kTRUPodVsfYpvFZ4ljMkGqM+VWC4xCay+jyWiGD9N2ifnQ7vuKcapMk6DQ+pSSTNCqqOugwdqD5snnWwCeWOYw==
5959+
sequential-workflow-designer-angular@^0.16.4:
5960+
version "0.16.4"
5961+
resolved "https://registry.yarnpkg.com/sequential-workflow-designer-angular/-/sequential-workflow-designer-angular-0.16.4.tgz#fc4d958e4ee7ce9344faa192ba0b13c8b3ae898d"
5962+
integrity sha512-G+JntoXICmgoILYEbD5AF9+NW0XxzZRCNT6YH5FbuWvH0GgIwv831hD2gQxGwKTAGXj+vSRIfBrVSHKagY08Qw==
59635963
dependencies:
59645964
tslib "^2.3.0"
59655965

5966-
sequential-workflow-designer@^0.16.3:
5967-
version "0.16.3"
5968-
resolved "https://registry.yarnpkg.com/sequential-workflow-designer/-/sequential-workflow-designer-0.16.3.tgz#899559b3a5ea3b5f0be931a071af67169ec65cb5"
5969-
integrity sha512-4M37SXOVfQ8YzLB+1PSDCB7NRXgipOSyBu127CBx2BdAt2dc7CnA0cyOYlVHtL3WX7xGfLXeIKKG7eSfQvjlWg==
5966+
sequential-workflow-designer@^0.16.4:
5967+
version "0.16.4"
5968+
resolved "https://registry.yarnpkg.com/sequential-workflow-designer/-/sequential-workflow-designer-0.16.4.tgz#53ebf0e607f9503eb1bd99c8d8cd0cf347021a3d"
5969+
integrity sha512-BHL9zqvwkCVOGIldxdKArsAuC1tVOCq1YQdr77o3bgbntA6VDv9K8kW1Oj8MBQw+Er6IHWhLDQ7yEsVSFWyJfQ==
59705970
dependencies:
59715971
sequential-workflow-model "^0.2.0"
59725972

‎demos/react-app/package.json

+2-2
Original file line numberDiff line numberDiff line change
@@ -6,8 +6,8 @@
66
"dependencies": {
77
"react": "^18.2.0",
88
"react-dom": "^18.2.0",
9-
"sequential-workflow-designer": "^0.16.3",
10-
"sequential-workflow-designer-react": "^0.16.3"
9+
"sequential-workflow-designer": "^0.16.4",
10+
"sequential-workflow-designer-react": "^0.16.4"
1111
},
1212
"devDependencies": {
1313
"@types/jest": "^29.2.5",

‎designer/package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
{
22
"name": "sequential-workflow-designer",
33
"description": "Customizable no-code component for building flow-based programming applications.",
4-
"version": "0.16.3",
4+
"version": "0.16.4",
55
"type": "module",
66
"main": "./lib/esm/index.js",
77
"types": "./lib/index.d.ts",

‎designer/src/api/editor-api.ts

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
1-
import { DefinitionChangeType, DesignerState } from '../designer-state';
1+
import { DesignerState } from '../designer-state';
22
import { DefinitionModifier } from '../definition-modifier';
3-
import { GlobalEditorContext, StepEditorContext } from '../designer-configuration';
3+
import { DefinitionChangeType, GlobalEditorContext, StepEditorContext } from '../designer-configuration';
44
import { EditorRenderer, EditorRendererHandler } from './editor-renderer';
55
import { Definition, DefinitionWalker } from '../definition';
66
import { SimpleEventListener } from '../core';

‎designer/src/api/editor-renderer.spec.ts

+2-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
1-
import { DefinitionChangeType, DesignerState } from '../designer-state';
1+
import { DesignerState } from '../designer-state';
22
import { EditorRenderer } from './editor-renderer';
33
import { Definition, DefinitionWalker, Step } from '../definition';
4+
import { DefinitionChangeType } from '../designer-configuration';
45

56
const step: Step = {
67
componentType: 'task',

‎designer/src/api/editor-renderer.ts

+2-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import { DefinitionWalker, Step } from '../definition';
22
import { race } from '../core';
3-
import { DefinitionChangedEvent, DefinitionChangeType, DesignerState } from '../designer-state';
3+
import { DefinitionChangedEvent, DesignerState } from '../designer-state';
4+
import { DefinitionChangeType } from '../designer-configuration';
45

56
export type EditorRendererHandler = (step: Step | null) => void;
67

‎designer/src/behaviors/pressing-behaviors/trigger-custom-action-pressing-behavior-handler.ts

+1-2
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
1-
import { CustomActionHandlerContext } from '../../designer-configuration';
1+
import { CustomActionHandlerContext, DefinitionChangeType } from '../../designer-configuration';
22
import { DesignerContext } from '../../designer-context';
3-
import { DefinitionChangeType } from '../../designer-state';
43
import { TriggerCustomActionClickCommand } from '../../workspace';
54
import { PressingBehaviorHandler } from './pressing-behavior';
65

‎designer/src/core/step-duplicator.spec.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { BranchedStep, DefinitionWalker, SequentialStep, Step } from 'sequential-workflow-model';
1+
import { BranchedStep, DefinitionWalker, SequentialStep, Step } from '../definition';
22
import { StepDuplicator } from './step-duplicator';
33
import { Uid } from './uid';
44

‎designer/src/definition-modifier.ts

+10-4
Original file line numberDiff line numberDiff line change
@@ -2,8 +2,8 @@ import { Uid } from './core';
22
import { SequenceModifier } from './core/sequence-modifier';
33
import { StepDuplicator } from './core/step-duplicator';
44
import { Definition, DefinitionWalker, Sequence, Step } from './definition';
5-
import { DesignerConfiguration } from './designer-configuration';
6-
import { DefinitionChangeType, DesignerState } from './designer-state';
5+
import { DefinitionChangeType, DesignerConfiguration } from './designer-configuration';
6+
import { DesignerState } from './designer-state';
77

88
export class DefinitionModifier {
99
public constructor(
@@ -47,7 +47,10 @@ export class DefinitionModifier {
4747

4848
SequenceModifier.insertStep(step, targetSequence, targetIndex);
4949
this.state.notifyDefinitionChanged(DefinitionChangeType.stepInserted, step.id);
50-
this.state.setSelectedStepId(step.id);
50+
51+
if (!this.configuration.steps.isAutoSelectDisabled) {
52+
this.state.setSelectedStepId(step.id);
53+
}
5154
return true;
5255
}
5356

@@ -70,7 +73,10 @@ export class DefinitionModifier {
7073

7174
apply();
7275
this.state.notifyDefinitionChanged(DefinitionChangeType.stepMoved, step.id);
73-
this.state.setSelectedStepId(step.id);
76+
77+
if (!this.configuration.steps.isAutoSelectDisabled) {
78+
this.state.setSelectedStepId(step.id);
79+
}
7480
return true;
7581
}
7682

‎designer/src/designer-configuration.ts

+32
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,11 @@ export interface DesignerConfiguration<TDefinition extends Definition = Definiti
1818
*/
1919
undoStackSize?: number;
2020

21+
/**
22+
* @description The initial undo stack. If not set, the undo stack will be empty.
23+
*/
24+
undoStack?: UndoStack;
25+
2126
/**
2227
* @description The common configuration of the steps.
2328
*/
@@ -135,6 +140,11 @@ export interface StepsConfiguration {
135140
canDeleteStep?: (step: Step, parentSequence: Sequence) => boolean;
136141
isDuplicable?: (step: Step, parentSequence: Sequence) => boolean;
137142

143+
/**
144+
* @description The designer automatically selects the step after it is dropped. If true, the step will not be selected.
145+
*/
146+
isAutoSelectDisabled?: boolean;
147+
138148
iconUrlProvider?: StepIconUrlProvider;
139149
}
140150

@@ -174,3 +184,25 @@ export type GlobalEditorProvider<TDefinition extends Definition = Definition> =
174184
definition: TDefinition,
175185
context: GlobalEditorContext
176186
) => HTMLElement;
187+
188+
export interface UndoStack {
189+
index: number;
190+
items: UndoStackItem[];
191+
}
192+
193+
export interface UndoStackItem {
194+
definition: Definition;
195+
changeType: DefinitionChangeType;
196+
stepId: string | null;
197+
}
198+
199+
export enum DefinitionChangeType {
200+
stepNameChanged = 1,
201+
stepPropertyChanged,
202+
stepChildrenChanged,
203+
stepDeleted,
204+
stepMoved,
205+
stepInserted,
206+
globalPropertyChanged,
207+
rootReplaced
208+
}

‎designer/src/designer-context.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -36,7 +36,7 @@ export class DesignerContext {
3636

3737
let historyController: HistoryController | undefined = undefined;
3838
if (configuration.undoStackSize) {
39-
historyController = HistoryController.create(state, definitionModifier, configuration);
39+
historyController = HistoryController.create(configuration.undoStack, state, definitionModifier, configuration);
4040
}
4141

4242
const componentContext = ComponentContext.create(

‎designer/src/designer-state.ts

+1-11
Original file line numberDiff line numberDiff line change
@@ -1,24 +1,14 @@
11
import { SimpleEvent } from './core/simple-event';
22
import { Vector } from './core/vector';
33
import { Definition } from './definition';
4+
import { DefinitionChangeType } from './designer-configuration';
45
import { Viewport } from './designer-extension';
56

67
export interface DefinitionChangedEvent {
78
changeType: DefinitionChangeType;
89
stepId: string | null;
910
}
1011

11-
export enum DefinitionChangeType {
12-
stepNameChanged = 1,
13-
stepPropertyChanged,
14-
stepChildrenChanged,
15-
stepDeleted,
16-
stepMoved,
17-
stepInserted,
18-
globalPropertyChanged,
19-
rootReplaced
20-
}
21-
2212
export class DesignerState {
2313
public readonly onViewportChanged = new SimpleEvent<Viewport>();
2414
public readonly onSelectedStepIdChanged = new SimpleEvent<string | null>();

‎designer/src/designer.ts

+22-4
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,14 @@
11
import { SimpleEvent } from './core/simple-event';
22
import { isElementAttached } from './core/is-element-attached';
33
import { Definition, DefinitionWalker, Sequence, Step, StepOrName } from './definition';
4-
import { DesignerConfiguration } from './designer-configuration';
4+
import { DesignerConfiguration, UndoStack } from './designer-configuration';
55
import { DesignerContext } from './designer-context';
66
import { DesignerView } from './designer-view';
77
import { DesignerState } from './designer-state';
88
import { ServicesResolver } from './services';
99
import { validateConfiguration } from './core/designer-configuration-validator';
1010
import { DesignerApi } from './api';
11+
import { HistoryController } from './history-controller';
1112

1213
export class Designer<TDefinition extends Definition = Definition> {
1314
/**
@@ -43,7 +44,13 @@ export class Designer<TDefinition extends Definition = Definition> {
4344
const designerApi = DesignerApi.create(designerContext);
4445

4546
const view = DesignerView.create(placeholder, designerContext, designerApi);
46-
const designer = new Designer<TDef>(view, designerContext.state, designerContext.definitionWalker, designerApi);
47+
const designer = new Designer<TDef>(
48+
view,
49+
designerContext.state,
50+
designerContext.definitionWalker,
51+
designerContext.historyController,
52+
designerApi
53+
);
4754
view.workspace.onReady.subscribe(() => designer.onReady.forward());
4855

4956
designerContext.state.onDefinitionChanged.subscribe(() => {
@@ -52,10 +59,10 @@ export class Designer<TDefinition extends Definition = Definition> {
5259
designerContext.state.onSelectedStepIdChanged.subscribe(() =>
5360
designer.onSelectedStepIdChanged.forward(designerContext.state.selectedStepId)
5461
);
55-
designer.state.onIsToolboxCollapsedChanged.subscribe(isCollapsed => {
62+
designerContext.state.onIsToolboxCollapsedChanged.subscribe(isCollapsed => {
5663
designer.onIsToolboxCollapsedChanged.forward(isCollapsed);
5764
});
58-
designer.state.onIsEditorCollapsedChanged.subscribe(isCollapsed => {
65+
designerContext.state.onIsEditorCollapsedChanged.subscribe(isCollapsed => {
5966
designer.onIsEditorCollapsedChanged.forward(isCollapsed);
6067
});
6168
return designer;
@@ -65,6 +72,7 @@ export class Designer<TDefinition extends Definition = Definition> {
6572
private readonly view: DesignerView,
6673
private readonly state: DesignerState,
6774
private readonly walker: DefinitionWalker,
75+
private readonly historyController: HistoryController | undefined,
6876
private readonly api: DesignerApi
6977
) {}
7078

@@ -198,6 +206,16 @@ export class Designer<TDefinition extends Definition = Definition> {
198206
this.state.setIsEditorCollapsed(isCollapsed);
199207
}
200208

209+
/**
210+
* @description Dump the undo stack.
211+
*/
212+
public dumpUndoStack(): UndoStack {
213+
if (!this.historyController) {
214+
throw new Error('Undo feature is not activated');
215+
}
216+
return this.historyController.dump();
217+
}
218+
201219
/**
202220
* @param needle A step, a sequence or a step id.
203221
* @returns parent steps and branch names.

0 commit comments

Comments
 (0)