diff --git a/CHANGELOG.md b/CHANGELOG.md index 37701c3..1dc335a 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,3 +1,7 @@ +## 0.2.1 + +Fixed bug with removing a message about an empty list. + ## 0.2.0 **Breaking changes:** diff --git a/demos/webpack-app/package.json b/demos/webpack-app/package.json index 4e83f8a..735f521 100644 --- a/demos/webpack-app/package.json +++ b/demos/webpack-app/package.json @@ -18,8 +18,8 @@ "sequential-workflow-model": "^0.1.3", "sequential-workflow-designer": "^0.13.0", "sequential-workflow-machine": "^0.2.0", - "sequential-workflow-editor-model": "^0.2.0", - "sequential-workflow-editor": "^0.2.0" + "sequential-workflow-editor-model": "^0.2.1", + "sequential-workflow-editor": "^0.2.1" }, "devDependencies": { "ts-loader": "^9.4.2", diff --git a/editor/package.json b/editor/package.json index c7983cc..f9b0733 100644 --- a/editor/package.json +++ b/editor/package.json @@ -1,6 +1,6 @@ { "name": "sequential-workflow-editor", - "version": "0.2.0", + "version": "0.2.1", "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.0", + "sequential-workflow-editor-model": "^0.2.1", "sequential-workflow-model": "^0.1.3" }, "peerDependencies": { - "sequential-workflow-editor-model": "^0.2.0", + "sequential-workflow-editor-model": "^0.2.1", "sequential-workflow-model": "^0.1.3" }, "devDependencies": { diff --git a/editor/src/components/dynamic-list-component.spec.ts b/editor/src/components/dynamic-list-component.spec.ts index 0601846..5ce376b 100644 --- a/editor/src/components/dynamic-list-component.spec.ts +++ b/editor/src/components/dynamic-list-component.spec.ts @@ -27,4 +27,23 @@ describe('DynamicListComponent', () => { expect(component.view.children.length).toBe(0); }); + + it('shows empty message, when items appear, then message disappears', () => { + const component = dynamicListComponent({ + emptyMessage: 'List is empty' + }); + + expect(component.view.children.length).toBe(0); + + component.set([]); + + expect(component.view.children.length).toBe(1); + expect(component.view.children[0].textContent).toBe('List is empty'); + + const item = Html.element('div'); + component.set([{ view: item }]); + + expect(component.view.children.length).toBe(1); + expect(component.view.children[0]).toBe(item); + }); }); diff --git a/editor/src/components/dynamic-list-component.ts b/editor/src/components/dynamic-list-component.ts index ee73166..252a3e1 100644 --- a/editor/src/components/dynamic-list-component.ts +++ b/editor/src/components/dynamic-list-component.ts @@ -14,6 +14,10 @@ export function dynamicListComponent( configuration?: DynamicListComponentConfiguration ): DynamicListComponent { function set(set: TComponent[]) { + if (emptyRow) { + view.removeChild(emptyRow); + emptyRow = null; + } components.forEach(component => view.removeChild(component.view)); components.length = 0; @@ -23,14 +27,15 @@ export function dynamicListComponent( view.appendChild(component.view); }); } else if (configuration?.emptyMessage) { - const message = Html.element('div', { + emptyRow = Html.element('div', { class: 'swe-dynamic-list-empty-row' }); - message.innerText = configuration.emptyMessage; - view.appendChild(message); + emptyRow.innerText = configuration.emptyMessage; + view.appendChild(emptyRow); } } + let emptyRow: HTMLElement | null = null; const components: TComponent[] = []; const view = Html.element('div', { class: 'swe-dynamic-list' diff --git a/model/package.json b/model/package.json index f3ebedb..ced7391 100644 --- a/model/package.json +++ b/model/package.json @@ -1,6 +1,6 @@ { "name": "sequential-workflow-editor-model", - "version": "0.2.0", + "version": "0.2.1", "homepage": "https://nocode-js.com/", "author": { "name": "NoCode JS",