0.3.0. (#6)

Author: b4rtaz

CHANGELOG.md

@@ -1,3 +1,13 @@
+## 0.3.0
+
+* Added new value model: nullable any variable (`nullableAnyVariableValueModel({ ... })`). This value model allows you to select any variable. Additionally, you can specify a variable type that can be selected by a user.
+* Added new optional property: `valueTypes` to `VariableDefinitionsValueModelConfiguration` interface. Now it's possible to force the types of variables during creation of variables by a user.
+
+**Breaking changes:**
+
+* Renamed the `variableType` property to `valueType` in the `NullableVariableValueModelConfiguration` interface.
+* Renamed the `variableType` property to `valueType` in the `NullableVariableDefinitionValueModelConfiguration` interface.
+
 ## 0.2.1
 
 Fixed bug with removing a message about an empty list.

README.md

@@ -96,7 +96,7 @@ import { EditorProvider } from 'sequential-workflow-editor';
 import { Uid } from 'sequential-workflow-designer';
 
 export const editorProvider = EditorProvider.create(definitionModel, {
-	uidGenerator: Uid.next
+  uidGenerator: Uid.next
 });
 ```
 

demos/webpack-app/package.json

@@ -16,10 +16,10 @@
 	"dependencies": {
 		"xstate": "^4.37.2",
 		"sequential-workflow-model": "^0.1.3",
-		"sequential-workflow-designer": "^0.13.0",
+		"sequential-workflow-designer": "^0.13.2",
 		"sequential-workflow-machine": "^0.2.0",
-		"sequential-workflow-editor-model": "^0.2.1",
-		"sequential-workflow-editor": "^0.2.1"
+		"sequential-workflow-editor-model": "^0.3.0",
+		"sequential-workflow-editor": "^0.3.0"
 	},
 	"devDependencies": {
 		"ts-loader": "^9.4.2",
@@ -33,4 +33,4 @@
 		"@typescript-eslint/parser": "^5.47.0",
 		"eslint": "^8.30.0"
 	}
-}
+}

demos/webpack-app/public/assets/icon-calculate.svg

@@ -28,7 +28,9 @@ export class App {
 				root: editorProvider.createRootValidator()
 			},
 			steps: {
-				iconUrlProvider: (_, type: string) => `./assets/icon-${type}.svg`
+				iconUrlProvider: (componentType: string, type: string) => {
+					return componentType === 'task' ? './assets/icon-task.svg' : `./assets/icon-${type}.svg`;
+				}
 			},
 			toolbox: {
 				groups: [

demos/webpack-app/public/assets/icon-log.svg

@@ -0,0 +1,32 @@
+import { createAtomActivity } from 'sequential-workflow-machine';
+import { GlobalState } from '../global-state';
+import { ConvertValueStep } from '../../model/convert-value-step-model';
+
+export const convertValueActivity = createAtomActivity<ConvertValueStep, GlobalState>({
+	init: () => ({}),
+	stepType: 'convertValue',
+	handler: async (step: ConvertValueStep, { $variables }: GlobalState) => {
+		if (!step.properties.source) {
+			throw new Error('Source variable is required');
+		}
+		if (!step.properties.target) {
+			throw new Error('Target variable is required');
+		}
+
+		const value = $variables.read(step.properties.source.name);
+
+		let convertedValue: unknown;
+		switch (step.properties.target.type) {
+			case 'number':
+				convertedValue = Number(value);
+				break;
+			case 'string':
+				convertedValue = String(value);
+				break;
+			default:
+				throw new Error(`Unsupported target type: ${step.properties.target.type}`);
+		}
+
+		$variables.set(step.properties.target.name, convertedValue);
+	}
+});

demos/webpack-app/public/assets/icon-setStringValue.svg

@@ -1,6 +1,6 @@
 import { createAtomActivity } from 'sequential-workflow-machine';
 import { GlobalState } from '../global-state';
-import { SetStringValueStep } from '../../model/set-string-value-model';
+import { SetStringValueStep } from '../../model/set-string-value-step-model';
 
 export const setStringValueActivity = createAtomActivity<SetStringValueStep, GlobalState>({
 	init: () => ({}),

demos/webpack-app/public/assets/icon-task.svg

@@ -4,5 +4,13 @@ import { loopActivity } from './activities/loop-activity';
 import { logActivity } from './activities/log-activity';
 import { ifActivity } from './activities/if-activity';
 import { calculateActivity } from './activities/calculate-activity';
+import { convertValueActivity } from './activities/convert-value-activity';
 
-export const activitySet = createActivitySet([calculateActivity, ifActivity, logActivity, loopActivity, setStringValueActivity]);
+export const activitySet = createActivitySet([
+	calculateActivity,
+	convertValueActivity,
+	ifActivity,
+	logActivity,
+	loopActivity,
+	setStringValueActivity
+]);

demos/webpack-app/src/playground/app.ts

@@ -27,14 +27,14 @@ export const calculateStepModel = createStepModel<CalculateStep>('calculate', 't
 			numberValueModel({}),
 			nullableVariableValueModel({
 				isRequired: true,
-				variableType: ValueKnownType.number
+				valueType: ValueKnownType.number
 			})
 		]
 	});
 
 	step.property('result').value(
 		nullableVariableValueModel({
-			variableType: ValueKnownType.number,
+			valueType: ValueKnownType.number,
 			isRequired: true
 		})
 	);

demos/webpack-app/src/playground/machine/activities/convert-value-activity.ts

@@ -0,0 +1,28 @@
+import { NullableAnyVariable, createStepModel, nullableAnyVariableValueModel } from 'sequential-workflow-editor-model';
+import { Step } from 'sequential-workflow-model';
+
+export interface ConvertValueStep extends Step {
+	type: 'convertValue';
+	componentType: 'task';
+	properties: {
+		source: NullableAnyVariable;
+		target: NullableAnyVariable;
+	};
+}
+
+export const convertValueStepModel = createStepModel<ConvertValueStep>('convertValue', 'task', step => {
+	step.property('source')
+		.value(
+			nullableAnyVariableValueModel({
+				isRequired: true
+			})
+		)
+		.label('Source variable');
+	step.property('target')
+		.value(
+			nullableAnyVariableValueModel({
+				isRequired: true
+			})
+		)
+		.label('Target variable');
+});

demos/webpack-app/src/playground/machine/activities/set-string-value-activity.ts

@@ -2,10 +2,11 @@ import { VariableDefinitions, createDefinitionModel } from 'sequential-workflow-
 import { rootModel } from './root-model';
 import { logStepModel } from './log-step-model';
 import { loopStepModel } from './loop-step-model';
-import { setStringValueModel } from './set-string-value-model';
+import { setStringValueStepModel } from './set-string-value-step-model';
 import { Definition } from 'sequential-workflow-model';
 import { ifStepModel } from './if-step-model';
 import { calculateStepModel } from './calculate-step-model';
+import { convertValueStepModel } from './convert-value-step-model';
 
 export interface MyDefinition extends Definition {
 	properties: {
@@ -17,5 +18,5 @@ export interface MyDefinition extends Definition {
 export const definitionModel = createDefinitionModel<MyDefinition>(model => {
 	model.valueTypes(['string', 'number']);
 	model.root(rootModel);
-	model.steps([calculateStepModel, ifStepModel, logStepModel, loopStepModel, setStringValueModel]);
+	model.steps([calculateStepModel, convertValueStepModel, ifStepModel, logStepModel, loopStepModel, setStringValueStepModel]);
 });

demos/webpack-app/src/playground/machine/activity-set.ts

@@ -27,7 +27,7 @@ export const ifStepModel = createBranchedStepModel<IfStep>('if', 'switch', step
 			numberValueModel({}),
 			nullableVariableValueModel({
 				isRequired: true,
-				variableType: ValueKnownType.number
+				valueType: ValueKnownType.number
 			})
 		]
 	});

demos/webpack-app/src/playground/model/calculate-step-model.ts

@@ -30,7 +30,7 @@ export const logStepModel = createStepModel<LogStep>('log', 'task', step => {
 					}),
 					nullableVariableValueModel({
 						isRequired: true,
-						variableType: ValueKnownType.string
+						valueType: ValueKnownType.string
 					})
 				]
 			})

demos/webpack-app/src/playground/model/convert-value-step-model.ts

@@ -36,7 +36,7 @@ export const loopStepModel = createSequentialStepModel('loop', 'container', step
 					numberValueModel({}),
 					nullableVariableValueModel({
 						isRequired: true,
-						variableType: ValueKnownType.number
+						valueType: ValueKnownType.number
 					})
 				]
 			})
@@ -58,7 +58,7 @@ export const loopStepModel = createSequentialStepModel('loop', 'container', step
 					numberValueModel({}),
 					nullableVariableValueModel({
 						isRequired: true,
-						variableType: ValueKnownType.number
+						valueType: ValueKnownType.number
 					})
 				]
 			})
@@ -74,7 +74,7 @@ export const loopStepModel = createSequentialStepModel('loop', 'container', step
 					}),
 					nullableVariableValueModel({
 						isRequired: true,
-						variableType: ValueKnownType.number
+						valueType: ValueKnownType.number
 					})
 				]
 			})
@@ -84,7 +84,7 @@ export const loopStepModel = createSequentialStepModel('loop', 'container', step
 		.label('Index variable')
 		.value(
 			nullableVariableDefinitionValueModel({
-				variableType: ValueKnownType.number,
+				valueType: ValueKnownType.number,
 				isRequired: true,
 				defaultValue: {
 					name: 'index',

demos/webpack-app/src/playground/model/definition-model.ts

@@ -11,11 +11,7 @@ export const rootModel = createRootModel<MyDefinition>(root => {
 				return inputs.variables.length > 0 ? null : 'At least one input is required';
 			}
 		});
-	root.property('outputs').value(
-		variableDefinitionsValueModel({
-			label: 'Outputs'
-		})
-	);
+	root.property('outputs').value(variableDefinitionsValueModel({})).label('Outputs');
 	root.sequence().value(
 		sequenceValueModel({
 			sequence: []

demos/webpack-app/src/playground/model/if-step-model.ts

@@ -18,11 +18,11 @@ export interface SetStringValueStep extends Step {
 	};
 }
 
-export const setStringValueModel = createStepModel<SetStringValueStep>('setStringValue', 'task', step => {
+export const setStringValueStepModel = createStepModel<SetStringValueStep>('setStringValue', 'task', step => {
 	step.property('variable')
 		.value(
 			nullableVariableValueModel({
-				variableType: ValueKnownType.string,
+				valueType: ValueKnownType.string,
 				isRequired: true
 			})
 		)
@@ -35,7 +35,7 @@ export const setStringValueModel = createStepModel<SetStringValueStep>('setStrin
 						minLength: 1
 					}),
 					nullableVariableValueModel({
-						variableType: ValueKnownType.string,
+						valueType: ValueKnownType.string,
 						isRequired: true
 					})
 				]

demos/webpack-app/src/playground/model/log-step-model.ts

@@ -1,6 +1,6 @@
 {
 	"name": "sequential-workflow-editor",
-	"version": "0.2.1",
+	"version": "0.3.0",
 	"type": "module",
 	"main": "./lib/esm/index.js",
 	"types": "./lib/index.d.ts",
@@ -46,11 +46,11 @@
 		"prettier:fix": "prettier --write ./src ./css"
 	},
 	"dependencies": {
-		"sequential-workflow-editor-model": "^0.2.1",
+		"sequential-workflow-editor-model": "^0.3.0",
 		"sequential-workflow-model": "^0.1.3"
 	},
 	"peerDependencies": {
-		"sequential-workflow-editor-model": "^0.2.1",
+		"sequential-workflow-editor-model": "^0.3.0",
 		"sequential-workflow-model": "^0.1.3"
 	},
 	"devDependencies": {

demos/webpack-app/src/playground/model/loop-step-model.ts

@@ -0,0 +1,21 @@
+import { filterValueTypes } from './filter-value-types';
+
+describe('filterValueTypes', () => {
+	it('filters correctly if passed array', () => {
+		const result = filterValueTypes(['number', 'string'], ['number']);
+		expect(result.length).toBe(1);
+		expect(result[0]).toBe('number');
+	});
+
+	it('filters correctly if passed empty array', () => {
+		const result = filterValueTypes(['number', 'string'], []);
+		expect(result.length).toBe(0);
+	});
+
+	it('does not filter if second argument is undefined', () => {
+		const result = filterValueTypes(['number', 'string'], undefined);
+		expect(result.length).toBe(2);
+		expect(result[0]).toBe('number');
+		expect(result[1]).toBe('string');
+	});
+});

demos/webpack-app/src/playground/model/root-model.ts

@@ -0,0 +1,14 @@
+import { ValueType } from 'sequential-workflow-editor-model';
+
+export function filterValueTypes(types: ValueType[], allowedTypes: ValueType[] | undefined): ValueType[] {
+	if (!allowedTypes) {
+		return types;
+	}
+	const result: ValueType[] = [];
+	for (const type of types) {
+		if (allowedTypes.includes(type)) {
+			result.push(type);
+		}
+	}
+	return result;
+}

demos/webpack-app/src/playground/model/set-string-value-model.ts renamed to demos/webpack-app/src/playground/model/set-string-value-step-model.ts

@@ -0,0 +1,51 @@
+import { ContextVariable, Path } from 'sequential-workflow-editor-model';
+import { filterVariablesByType } from './filter-variables-by-type';
+
+describe('filterVariablesByType', () => {
+	const variables: ContextVariable[] = [
+		{
+			name: 'blue',
+			stepId: '0x1',
+			type: 'string',
+			valueModelPath: Path.root()
+		},
+		{
+			name: 'green',
+			stepId: '0x2',
+			type: 'number',
+			valueModelPath: Path.root()
+		},
+		{
+			name: 'pink',
+			stepId: '0x3',
+			type: 'boolean',
+			valueModelPath: Path.root()
+		}
+	];
+
+	it('returns filtered list when passed string', () => {
+		const result = filterVariablesByType(variables, 'string');
+		expect(result.length).toBe(1);
+		expect(result[0].name).toBe('blue');
+	});
+
+	it('returns filtered list when passed array', () => {
+		const result = filterVariablesByType(variables, ['number', 'boolean']);
+		expect(result.length).toBe(2);
+		expect(result[0].name).toBe('green');
+		expect(result[1].name).toBe('pink');
+	});
+
+	it('returns empty array if expected types are not found', () => {
+		const result = filterVariablesByType(variables, ['date', 'time']);
+		expect(result.length).toBe(0);
+	});
+
+	it('returns source list if filter is not passed', () => {
+		const result = filterVariablesByType(variables, undefined);
+		expect(result.length).toBe(3);
+		expect(result[0].name).toBe('blue');
+		expect(result[1].name).toBe('green');
+		expect(result[2].name).toBe('pink');
+	});
+});