Skip to content

Commit 286a0a3

Browse files
b4rtazb4rtaz
authored
0.19.4. (#138)
1 parent 220f1a1 commit 286a0a3

File tree

18 files changed

+61
-38
lines changed

18 files changed

+61
-38
lines changed

‎CHANGELOG.md

+4
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,7 @@
1+
## 0.19.4
2+
3+
This version adds the data-step-id attribute to the root `<g>` elements of step components on the canvas. This attribute contains the ID of the step, enabling the use of CSS selectors to style step components [#135](https://github.com/nocode-js/sequential-workflow-designer/issues/135).
4+
15
## 0.19.3
26

37
This version improves the experience of scrolling in the toolbox via the touchpad.

‎README.md

+4-4
Original file line numberDiff line numberDiff line change
@@ -100,10 +100,10 @@ Add the below code to your head section in HTML document.
100100
```html
101101
<head>
102102
...
103-
<link href="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.19.3/css/designer.css" rel="stylesheet">
104-
<link href="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.19.3/css/designer-light.css" rel="stylesheet">
105-
<link href="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.19.3/css/designer-dark.css" rel="stylesheet">
106-
<script src="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.19.3/dist/index.umd.js"></script>
103+
<link href="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.19.4/css/designer.css" rel="stylesheet">
104+
<link href="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.19.4/css/designer-light.css" rel="stylesheet">
105+
<link href="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.19.4/css/designer-dark.css" rel="stylesheet">
106+
<script src="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.19.4/dist/index.umd.js"></script>
107107
```
108108

109109
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.19.3",
4+
"version": "0.19.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.19.3"
18+
"sequential-workflow-designer": "^0.19.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.19.3",
30-
"sequential-workflow-designer-angular": "^0.19.3",
29+
"sequential-workflow-designer": "^0.19.4",
30+
"sequential-workflow-designer-angular": "^0.19.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.19.3:
5960-
version "0.19.3"
5961-
resolved "https://registry.yarnpkg.com/sequential-workflow-designer-angular/-/sequential-workflow-designer-angular-0.19.3.tgz#5b69f09f5d600034202ec04c42f473eb2be34841"
5962-
integrity sha512-H7J+Vr923SeNvnG8Uxup3Hu+lSjNodMZEILoum+uVTZP3xUZyETd4bprd5MdEE6/wlUai8cLOk69+QojQAuqUQ==
5959+
sequential-workflow-designer-angular@^0.19.4:
5960+
version "0.19.4"
5961+
resolved "https://registry.yarnpkg.com/sequential-workflow-designer-angular/-/sequential-workflow-designer-angular-0.19.4.tgz#80449ac17015cd2e58a7b8b0b5169f3148083c88"
5962+
integrity sha512-svUfsbISuYe5CEAjuu3Z3IyjoOvvWI0ADP1KrNf9UpHWD+QXCX/yvviUJfDvMGY5YtniI3ylkNfDjUBPPXnm4A==
59635963
dependencies:
59645964
tslib "^2.3.0"
59655965

5966-
sequential-workflow-designer@^0.19.3:
5967-
version "0.19.3"
5968-
resolved "https://registry.yarnpkg.com/sequential-workflow-designer/-/sequential-workflow-designer-0.19.3.tgz#967967f5772e6cbd592def584e6ba78331a837bc"
5969-
integrity sha512-lDDclYAsbg8DXfVa4ZiFnCmnvbgO1A7bey2TO2Q6DfmiVqqQ8VhsDEpMXcSxT72O3nkQxn1YDVG2XZzpJBTxyA==
5966+
sequential-workflow-designer@^0.19.4:
5967+
version "0.19.4"
5968+
resolved "https://registry.yarnpkg.com/sequential-workflow-designer/-/sequential-workflow-designer-0.19.4.tgz#1ef69541e17c3daaf1e06d3c7984771e14f9b2c0"
5969+
integrity sha512-pCv27HahJajaiyJo7UUd4qkXyH0OtauGFpPksorGWr+EzoYEtcMsR/53x+1t+e6qZ4++FboGLQ85+63+XIGBvg==
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.19.3",
10-
"sequential-workflow-designer-react": "^0.19.3"
9+
"sequential-workflow-designer": "^0.19.4",
10+
"sequential-workflow-designer-react": "^0.19.4"
1111
},
1212
"devDependencies": {
1313
"@types/jest": "^29.2.5",

‎demos/svelte-app/package.json

+2-2
Original file line numberDiff line numberDiff line change
@@ -16,8 +16,8 @@
1616
"eslint": "eslint ./src --ext .ts"
1717
},
1818
"dependencies": {
19-
"sequential-workflow-designer": "^0.19.3",
20-
"sequential-workflow-designer-svelte": "^0.19.3"
19+
"sequential-workflow-designer": "^0.19.4",
20+
"sequential-workflow-designer-svelte": "^0.19.4"
2121
},
2222
"devDependencies": {
2323
"@sveltejs/adapter-static": "^2.0.3",

‎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.19.3",
4+
"version": "0.19.4",
55
"type": "module",
66
"main": "./lib/esm/index.js",
77
"types": "./lib/index.d.ts",

‎designer/src/workspace/common-views/component-dom.spec.ts

+11
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
import { ComponentDom } from './component-dom';
2+
3+
describe('ComponentDom', () => {
4+
it('stepG() creates <g> element', () => {
5+
const view = ComponentDom.stepG('container', 'foreach', 'some-id');
6+
7+
expect(view.tagName.toLowerCase()).toBe('g');
8+
expect(view.getAttribute('class')).toBe('sqd-step-container sqd-type-foreach');
9+
expect(view.getAttribute('data-step-id')).toBe('some-id');
10+
});
11+
});

‎designer/src/workspace/common-views/component-dom.ts

+10
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
import { Dom } from '../../core';
2+
3+
export class ComponentDom {
4+
public static stepG(componentClassName: string, type: string, id: string): SVGGElement {
5+
return Dom.svg('g', {
6+
class: `sqd-step-${componentClassName} sqd-type-${type}`,
7+
'data-step-id': id
8+
});
9+
}
10+
}

‎designer/src/workspace/common-views/index.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
1+
export * from './component-dom';
12
export * from './input-view';
23
export * from './join-view';
34
export * from './label-view';
45
export * from './output-view';
56
export * from './region-view';
6-
export * from '../placeholder/rect-placeholder-view';

‎designer/src/workspace/container-step/container-step-component-view.ts

+2-3
Original file line numberDiff line numberDiff line change
@@ -8,14 +8,13 @@ import { LabelView } from '../common-views/label-view';
88
import { RegionView } from '../common-views/region-view';
99
import { StepComponentViewContext, StepComponentViewFactory, StepContext } from '../../designer-extension';
1010
import { ContainerStepComponentViewConfiguration } from './container-step-component-view-configuration';
11+
import { ComponentDom } from '../common-views/component-dom';
1112

1213
export const createContainerStepComponentViewFactory =
1314
(cfg: ContainerStepComponentViewConfiguration): StepComponentViewFactory =>
1415
(parentElement: SVGElement, stepContext: StepContext<SequentialStep>, viewContext: StepComponentViewContext): StepComponentView => {
1516
const { step } = stepContext;
16-
const g = Dom.svg('g', {
17-
class: `sqd-step-container sqd-type-${step.type}`
18-
});
17+
const g = ComponentDom.stepG('container', step.type, step.id);
1918
parentElement.appendChild(g);
2019

2120
const labelView = LabelView.create(g, cfg.paddingTop, cfg.label, step.name, 'primary');

‎designer/src/workspace/placeholder/index.ts

+1
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,3 @@
11
export * from './rect-placeholder';
2+
export * from './rect-placeholder-view';
23
export * from './rect-placeholder-configuration';

‎designer/src/workspace/switch-step/switch-step-component-view.ts

+2-3
Original file line numberDiff line numberDiff line change
@@ -8,14 +8,13 @@ import { InputView } from '../common-views/input-view';
88
import { ClickDetails, StepComponentView } from '../component';
99
import { StepComponentViewContext, StepComponentViewFactory, StepContext } from '../../designer-extension';
1010
import { SwitchStepComponentViewConfiguration } from './switch-step-component-view-configuration';
11+
import { ComponentDom } from '../common-views/component-dom';
1112

1213
export const createSwitchStepComponentViewFactory =
1314
(cfg: SwitchStepComponentViewConfiguration): StepComponentViewFactory =>
1415
(parent: SVGElement, stepContext: StepContext<BranchedStep>, viewContext: StepComponentViewContext): StepComponentView => {
1516
const { step } = stepContext;
16-
const g = Dom.svg('g', {
17-
class: `sqd-step-switch sqd-type-${step.type}`
18-
});
17+
const g = ComponentDom.stepG('switch', step.type, step.id);
1918
parent.appendChild(g);
2019

2120
const branchNames = Object.keys(step.branches);

‎designer/src/workspace/task-step/task-step-component-view.ts

+2-3
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@ import { getAbsolutePosition } from '../../core/get-absolute-position';
33
import { Vector } from '../../core/vector';
44
import { Step } from '../../definition';
55
import { StepComponentViewContext, StepComponentViewFactory, StepContext } from '../../designer-extension';
6+
import { ComponentDom } from '../common-views/component-dom';
67
import { InputView } from '../common-views/input-view';
78
import { OutputView } from '../common-views/output-view';
89
import { ClickDetails, StepComponentView } from '../component';
@@ -12,9 +13,7 @@ export const createTaskStepComponentViewFactory =
1213
(isInterrupted: boolean, cfg: TaskStepComponentViewConfiguration): StepComponentViewFactory =>
1314
(parentElement: SVGElement, stepContext: StepContext<Step>, viewContext: StepComponentViewContext): StepComponentView => {
1415
const { step } = stepContext;
15-
const g = Dom.svg('g', {
16-
class: `sqd-step-task sqd-type-${step.type}`
17-
});
16+
const g = ComponentDom.stepG('task', step.type, step.id);
1817
parentElement.appendChild(g);
1918

2019
const boxHeight = cfg.paddingY * 2 + cfg.iconSize;

‎examples/assets/lib.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@ function embedStylesheet(url) {
1919

2020
const baseUrl = isTestEnv()
2121
? '../designer'
22-
: '//cdn.jsdelivr.net/npm/sequential-workflow-designer@0.19.3';
22+
: '//cdn.jsdelivr.net/npm/sequential-workflow-designer@0.19.4';
2323

2424
embedScript(`${baseUrl}/dist/index.umd.js`);
2525
embedStylesheet(`${baseUrl}/css/designer.css`);

‎react/package.json

+3-3
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
{
22
"name": "sequential-workflow-designer-react",
33
"description": "React wrapper for Sequential Workflow Designer component.",
4-
"version": "0.19.3",
4+
"version": "0.19.4",
55
"type": "module",
66
"main": "./lib/esm/index.js",
77
"types": "./lib/index.d.ts",
@@ -47,7 +47,7 @@
4747
"peerDependencies": {
4848
"react": "^18.2.0",
4949
"react-dom": "^18.2.0",
50-
"sequential-workflow-designer": "^0.19.3"
50+
"sequential-workflow-designer": "^0.19.4"
5151
},
5252
"devDependencies": {
5353
"@rollup/plugin-node-resolve": "^15.0.1",
@@ -63,7 +63,7 @@
6363
"prettier": "^2.8.2",
6464
"react": "^18.2.0",
6565
"react-dom": "^18.2.0",
66-
"sequential-workflow-designer": "^0.19.3",
66+
"sequential-workflow-designer": "^0.19.4",
6767
"rollup": "^3.18.0",
6868
"rollup-plugin-dts": "^5.2.0",
6969
"rollup-plugin-typescript2": "^0.34.1",

‎svelte/package.json

+3-3
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
{
22
"name": "sequential-workflow-designer-svelte",
33
"description": "Svelte wrapper for Sequential Workflow Designer component.",
4-
"version": "0.19.3",
4+
"version": "0.19.4",
55
"license": "MIT",
66
"scripts": {
77
"prepare": "cp ../LICENSE LICENSE",
@@ -28,10 +28,10 @@
2828
],
2929
"peerDependencies": {
3030
"svelte": "^4.0.0",
31-
"sequential-workflow-designer": "^0.19.3"
31+
"sequential-workflow-designer": "^0.19.4"
3232
},
3333
"devDependencies": {
34-
"sequential-workflow-designer": "^0.19.3",
34+
"sequential-workflow-designer": "^0.19.4",
3535
"@sveltejs/adapter-static": "^2.0.3",
3636
"@sveltejs/kit": "^1.20.4",
3737
"@sveltejs/package": "^2.0.0",

0 commit comments

Comments
 (0)