sequential-workflow-designer-svelte 0.16.7 → 0.16.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/README.md +3 -3
  2. package/dist/SequentialWorkflowDesigner.svelte +40 -26
  3. package/dist/SequentialWorkflowDesigner.svelte.d.ts +27 -7
  4. package/package.json +6 -5
package/README.md CHANGED
@@ -75,13 +75,13 @@ Now you can use the component:
75
75
 
76
76
  Next you may need to create editors for your definition. You need to create a new component for the root editor and the step editor. Each editor has predefined props.
77
77
 
78
- The global editor:
78
+ The root editor:
79
79
 
80
80
  ```svelte
81
81
  <script lang="ts">
82
- import type { GlobalEditorContext, Definition } from 'sequential-workflow-designer';
82
+ import type { RootEditorContext, Definition } from 'sequential-workflow-designer';
83
83
 
84
- export let context: GlobalEditorContext;
84
+ export let context: RootEditorContext;
85
85
  export let definition: Definition;
86
86
  let velocity = definition.properties.velocity;
87
87
 
package/dist/SequentialWorkflowDesigner.svelte CHANGED
@@ -11,6 +11,7 @@ export let isToolboxCollapsed = false;
11
11
  export let controlBar = true;
12
12
  export let theme = "light";
13
13
  export let contextMenu = true;
14
+ export let keyboard = void 0;
14
15
  export let undoStackSize = void 0;
15
16
  export let undoStack = void 0;
16
17
  export let validator = void 0;
@@ -19,7 +20,9 @@ export let definitionWalker = void 0;
19
20
  export let extensions = void 0;
20
21
  export let customActionHandler = void 0;
21
22
  export let stepEditor = null;
23
+ export let nativeStepEditor = null;
22
24
  export let rootEditor = null;
25
+ export let nativeRootEditor = null;
23
26
  export let isEditorCollapsed = false;
24
27
  export let isReadonly = false;
25
28
  export let selectedStepId = null;
@@ -27,29 +30,35 @@ let isFirstChange = true;
27
30
  let designer = null;
28
31
  let placeholder;
29
32
  function init() {
30
- const editors = stepEditor && rootEditor ? {
33
+ const editors = (stepEditor || nativeStepEditor) && (rootEditor || nativeRootEditor) ? {
31
34
  isCollapsed: isEditorCollapsed,
32
35
  stepEditorProvider: (step, context, def) => {
33
- if (!stepEditor) {
34
- throw new Error("No step editor provided");
36
+ if (stepEditor) {
37
+ const root = document.createElement("div");
38
+ new stepEditor({
39
+ target: root,
40
+ props: { step, context, definition: def }
41
+ });
42
+ return root;
35
43
  }
36
- const root = document.createElement("div");
37
- new stepEditor({
38
- target: root,
39
- props: { step, context, definition: def }
40
- });
41
- return root;
44
+ if (nativeStepEditor) {
45
+ return nativeStepEditor(step, context, def);
46
+ }
47
+ throw new Error("No step editor provided");
42
48
  },
43
49
  globalEditorProvider: (def, context) => {
44
- if (!rootEditor) {
45
- throw new Error("No root editor provided");
50
+ if (rootEditor) {
51
+ const root = document.createElement("div");
52
+ new rootEditor({
53
+ target: root,
54
+ props: { definition: def, context }
55
+ });
56
+ return root;
57
+ }
58
+ if (nativeRootEditor) {
59
+ return nativeRootEditor(def, context);
46
60
  }
47
- const root = document.createElement("div");
48
- new rootEditor({
49
- target: root,
50
- props: { definition: def, context }
51
- });
52
- return root;
61
+ throw new Error("No root editor provided");
53
62
  }
54
63
  } : false;
55
64
  const _toolbox = toolbox ? {
@@ -63,6 +72,7 @@ function init() {
63
72
  editors,
64
73
  theme,
65
74
  contextMenu,
75
+ keyboard,
66
76
  undoStackSize,
67
77
  undoStack,
68
78
  validator,
@@ -72,14 +82,18 @@ function init() {
72
82
  uidGenerator,
73
83
  customActionHandler
74
84
  });
75
- d.onReady.subscribe(() => dispatch("definitionChanged", {
76
- definition: d.getDefinition(),
77
- isValid: d.isValid()
78
- }));
79
- d.onDefinitionChanged.subscribe((definition2) => dispatch("definitionChanged", {
80
- definition: definition2,
81
- isValid: d.isValid()
82
- }));
85
+ d.onReady.subscribe(
86
+ () => dispatch("definitionChanged", {
87
+ definition: d.getDefinition(),
88
+ isValid: d.isValid()
89
+ })
90
+ );
91
+ d.onDefinitionChanged.subscribe(
92
+ (definition2) => dispatch("definitionChanged", {
93
+ definition: definition2,
94
+ isValid: d.isValid()
95
+ })
96
+ );
83
97
  d.onSelectedStepIdChanged.subscribe((stepId) => dispatch("selectedStepIdChanged", { stepId }));
84
98
  d.onIsToolboxCollapsedChanged.subscribe((isCollapsed) => dispatch("isToolboxCollapsedChanged", { isCollapsed }));
85
99
  d.onIsEditorCollapsedChanged.subscribe((isCollapsed) => dispatch("isEditorCollapsedChanged", { isCollapsed }));
@@ -126,4 +140,4 @@ onDestroy(() => {
126
140
  });
127
141
  </script>
128
142
 
129
- <div bind:this={placeholder} class="sqd-designer-svelte"></div>
143
+ <div bind:this={placeholder} class="sqd-designer-svelte" />
package/dist/SequentialWorkflowDesigner.svelte.d.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  import { SvelteComponent } from "svelte";
2
- import { DefinitionWalker, type Definition, type StepsConfiguration, type ToolboxConfiguration, type UndoStack, type ValidatorConfiguration, type UidGenerator, type DesignerExtension, type CustomActionHandler } from 'sequential-workflow-designer';
2
+ import { DefinitionWalker, type Definition, type StepsConfiguration, type ToolboxConfiguration, type UndoStack, type ValidatorConfiguration, type UidGenerator, type DesignerExtension, type CustomActionHandler, type StepEditorProvider, type RootEditorProvider, type KeyboardConfiguration } from 'sequential-workflow-designer';
3
3
  declare const __propDef: {
4
4
  props: {
5
5
  definition: Definition;
@@ -9,6 +9,7 @@ declare const __propDef: {
9
9
  controlBar?: boolean | undefined;
10
10
  theme?: string | undefined;
11
11
  contextMenu?: boolean | undefined;
12
+ keyboard?: boolean | KeyboardConfiguration | undefined;
12
13
  undoStackSize?: number | undefined;
13
14
  undoStack?: UndoStack | undefined;
14
15
  validator?: ValidatorConfiguration | undefined;
@@ -16,17 +17,36 @@ declare const __propDef: {
16
17
  definitionWalker?: DefinitionWalker | undefined;
17
18
  extensions?: DesignerExtension[] | undefined;
18
19
  customActionHandler?: CustomActionHandler | undefined;
19
- stepEditor?: ConstructorOfATypedSvelteComponent | null | undefined;
20
- rootEditor?: ConstructorOfATypedSvelteComponent | null | undefined;
20
+ /**
21
+ * @description Svelte component that will be used to render the step editor. If this property is set, the `nativeStepEditor` property will be ignored.
22
+ */ stepEditor?: ConstructorOfATypedSvelteComponent | null | undefined;
23
+ /**
24
+ * @description Function that will be used to render the step editor.
25
+ */ nativeStepEditor?: StepEditorProvider | null | undefined;
26
+ /**
27
+ * @description Svelte component that will be used to render the root editor. If this property is set, the `nativeRootEditor` property will be ignored.
28
+ */ rootEditor?: ConstructorOfATypedSvelteComponent | null | undefined;
29
+ /**
30
+ * @description Function that will be used to render the root editor.
31
+ */ nativeRootEditor?: RootEditorProvider | null | undefined;
21
32
  isEditorCollapsed?: boolean | undefined;
22
33
  isReadonly?: boolean | undefined;
23
34
  selectedStepId?: string | null | undefined;
24
35
  };
25
36
  events: {
26
- definitionChanged: CustomEvent<any>;
27
- selectedStepIdChanged: CustomEvent<any>;
28
- isToolboxCollapsedChanged: CustomEvent<any>;
29
- isEditorCollapsedChanged: CustomEvent<any>;
37
+ definitionChanged: CustomEvent<{
38
+ definition: Definition;
39
+ isValid: boolean;
40
+ }>;
41
+ selectedStepIdChanged: CustomEvent<{
42
+ stepId: string | null;
43
+ }>;
44
+ isToolboxCollapsedChanged: CustomEvent<{
45
+ isCollapsed: boolean;
46
+ }>;
47
+ isEditorCollapsedChanged: CustomEvent<{
48
+ isCollapsed: boolean;
49
+ }>;
30
50
  } & {
31
51
  [evt: string]: CustomEvent<any>;
32
52
  };
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "sequential-workflow-designer-svelte",
3
3
  "description": "Svelte wrapper for Sequential Workflow Designer component.",
4
- "version": "0.16.7",
4
+ "version": "0.16.9",
5
5
  "license": "MIT",
6
6
  "scripts": {
7
7
  "prepare": "cp ../LICENSE LICENSE",
@@ -11,8 +11,8 @@
11
11
  "check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
12
12
  "check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
13
13
  "test:single": "echo \"No tests yet\"",
14
- "prettier": "prettier --check ./src",
15
- "prettier:fix": "prettier --write ./src",
14
+ "prettier": "prettier --plugin prettier-plugin-svelte --check ./src",
15
+ "prettier:fix": "prettier --plugin prettier-plugin-svelte --write ./src",
16
16
  "eslint": "eslint ./src --ext .ts"
17
17
  },
18
18
  "exports": {
@@ -28,10 +28,10 @@
28
28
  ],
29
29
  "peerDependencies": {
30
30
  "svelte": "^4.0.0",
31
- "sequential-workflow-designer": "^0.16.7"
31
+ "sequential-workflow-designer": "^0.16.9"
32
32
  },
33
33
  "devDependencies": {
34
- "sequential-workflow-designer": "^0.16.7",
34
+ "sequential-workflow-designer": "^0.16.9",
35
35
  "@sveltejs/adapter-static": "^2.0.3",
36
36
  "@sveltejs/kit": "^1.20.4",
37
37
  "@sveltejs/package": "^2.0.0",
@@ -41,6 +41,7 @@
41
41
  "typescript": "^5.0.0",
42
42
  "vite": "^4.4.2",
43
43
  "prettier": "^2.8.2",
44
+ "prettier-plugin-svelte": "^2.8.0",
44
45
  "@typescript-eslint/eslint-plugin": "^5.47.0",
45
46
  "@typescript-eslint/parser": "^5.47.0",
46
47
  "eslint": "^8.30.0"