0.10.0. (#23)

Author: b4rtaz

CHANGELOG.md

@@ -1,3 +1,7 @@
+## 0.10.0
+
+This version deletes all deprecated `*ValueModel` functions. From now, use only `create*ValueModel` functions.
+
 ## 0.9.3
 
 Added `hasVariable` and `hasVariables` methods to the `PropertyValidatorContext` class.

demos/webpack-app/package.json

@@ -18,8 +18,8 @@
 		"sequential-workflow-model": "^0.2.0",
 		"sequential-workflow-designer": "^0.16.1",
 		"sequential-workflow-machine": "^0.4.0",
-		"sequential-workflow-editor-model": "^0.9.3",
-		"sequential-workflow-editor": "^0.9.3"
+		"sequential-workflow-editor-model": "^0.10.0",
+		"sequential-workflow-editor": "^0.10.0"
 	},
 	"devDependencies": {
 		"ts-loader": "^9.4.2",

editor/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "sequential-workflow-editor",
-	"version": "0.9.3",
+	"version": "0.10.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.9.3",
+		"sequential-workflow-editor-model": "^0.10.0",
 		"sequential-workflow-model": "^0.2.0"
 	},
 	"peerDependencies": {
-		"sequential-workflow-editor-model": "^0.9.3",
+		"sequential-workflow-editor-model": "^0.10.0",
 		"sequential-workflow-model": "^0.2.0"
 	},
 	"devDependencies": {

editor/src/components/button-component.spec.ts

@@ -12,4 +12,15 @@ describe('ButtonComponent', () => {
 		expect(button.view.innerText).toBe('Some button');
 		expect(clicked).toBe(true);
 	});
+
+	it('replaces icon', () => {
+		const button = buttonComponent('Icon button', { icon: 'm200' });
+		const getD = () => button.view.children[0].children[0].getAttribute('d');
+
+		expect(getD()).toBe('m200');
+
+		button.setIcon('m100');
+
+		expect(getD()).toBe('m100');
+	});
 });

editor/src/components/button-component.ts

@@ -5,6 +5,8 @@ import { Icons } from '../core/icons';
 
 export interface ButtonComponent extends Component {
 	onClick: SimpleEvent<void>;
+	setIcon(d: string): void;
+	setLabel(label: string): void;
 }
 
 export interface ButtonComponentConfiguration {
@@ -19,6 +21,22 @@ export function buttonComponent(label: string, configuration?: ButtonComponentCo
 		onClick.forward();
 	}
 
+	function setIcon(d: string) {
+		if (icon) {
+			icon.getElementsByTagName('path')[0].setAttribute('d', d);
+		} else {
+			throw new Error('This button does not have icon');
+		}
+	}
+
+	function setLabel(label: string) {
+		if (configuration?.icon) {
+			throw new Error('Cannot change label on button with icon');
+		} else {
+			view.innerText = label;
+		}
+	}
+
 	const onClick = new SimpleEvent<void>();
 
 	let className = 'swe-button';
@@ -33,16 +51,19 @@ export function buttonComponent(label: string, configuration?: ButtonComponentCo
 		title: label,
 		'aria-label': label
 	});
+	let icon: SVGElement | undefined;
 	if (configuration?.icon) {
-		const svg = Icons.createSvg(configuration.icon, 'swe-button-icon');
-		view.appendChild(svg);
+		icon = Icons.createSvg(configuration.icon, 'swe-button-icon');
+		view.appendChild(icon);
 	} else {
 		view.innerText = label;
 	}
 	view.addEventListener('click', onClicked, false);
 
 	return {
 		view,
-		onClick
+		onClick,
+		setIcon,
+		setLabel
 	};
 }

editor/src/components/input-component.ts

@@ -6,10 +6,11 @@ export interface InputComponent extends Component {
 	onChanged: SimpleEvent<string>;
 	setValue(value: string): void;
 	getValue(): string;
+	setReadonly(readonly: boolean): void;
 }
 
 export interface InputConfiguration {
-	type?: 'text' | 'number';
+	type?: 'text' | 'number' | 'password';
 	isReadonly?: boolean;
 	placeholder?: string;
 }
@@ -25,6 +26,14 @@ export function inputComponent(startValue: string, configuration?: InputConfigur
 		return view.value;
 	}
 
+	function setReadonly(readonly: boolean) {
+		if (readonly) {
+			view.setAttribute('readonly', 'readonly');
+		} else {
+			view.removeAttribute('readonly');
+		}
+	}
+
 	const view = Html.element('input', {
 		class: 'swe-input swe-stretched',
 		type: configuration?.type ?? 'text'
@@ -33,7 +42,7 @@ export function inputComponent(startValue: string, configuration?: InputConfigur
 		view.setAttribute('placeholder', configuration.placeholder);
 	}
 	if (configuration?.isReadonly) {
-		view.setAttribute('readonly', 'readonly');
+		setReadonly(true);
 	}
 	view.value = startValue;
 	view.addEventListener('input', () => {
@@ -44,6 +53,7 @@ export function inputComponent(startValue: string, configuration?: InputConfigur
 		view,
 		onChanged,
 		setValue,
-		getValue
+		getValue,
+		setReadonly
 	};
 }

model/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "sequential-workflow-editor-model",
-	"version": "0.9.3",
+	"version": "0.10.0",
 	"homepage": "https://nocode-js.com/",
 	"author": {
 		"name": "NoCode JS",

model/src/value-models/depreciated.ts

@@ -12,4 +12,3 @@ export * from './sequence';
 export * from './string';
 export * from './string-dictionary';
 export * from './variable-definitions';
-export * from './depreciated';