diff --git a/CHANGELOG.md b/CHANGELOG.md index 6baf912..af68d3b 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,3 +1,7 @@ +# 0.24.3 + +Fixed the placement of the context menu in the `documentBody` element if specified in the configuration. + # 0.24.2 This version reverts the changes introduced in version 0.24.1. To modify the DOM attachment check, you should now pass the `documentBody` property in the configuration, which should reference the document's body element. diff --git a/README.md b/README.md index 9c610c2..0746790 100644 --- a/README.md +++ b/README.md @@ -103,10 +103,10 @@ Add the below code to your head section in HTML document. ```html ... - - - - + + + + ``` Call the designer by: diff --git a/angular/designer/package.json b/angular/designer/package.json index bef54da..c168f3c 100644 --- a/angular/designer/package.json +++ b/angular/designer/package.json @@ -1,7 +1,7 @@ { "name": "sequential-workflow-designer-angular", "description": "Angular wrapper for Sequential Workflow Designer component.", - "version": "0.24.2", + "version": "0.24.3", "author": { "name": "NoCode JS", "url": "https://nocode-js.com/" @@ -15,7 +15,7 @@ "peerDependencies": { "@angular/common": "12 - 18", "@angular/core": "12 - 18", - "sequential-workflow-designer": "^0.24.2" + "sequential-workflow-designer": "^0.24.3" }, "dependencies": { "tslib": "^2.3.0" diff --git a/demos/angular-app/package.json b/demos/angular-app/package.json index 54265a7..e2f5009 100644 --- a/demos/angular-app/package.json +++ b/demos/angular-app/package.json @@ -26,8 +26,8 @@ "@angular/platform-browser-dynamic": "^17.3.9", "@angular/router": "^17.3.9", "rxjs": "~7.8.0", - "sequential-workflow-designer": "^0.24.2", - "sequential-workflow-designer-angular": "^0.24.2", + "sequential-workflow-designer": "^0.24.3", + "sequential-workflow-designer-angular": "^0.24.3", "tslib": "^2.3.0", "zone.js": "~0.14.6" }, diff --git a/demos/angular-app/yarn.lock b/demos/angular-app/yarn.lock index c08b560..80f0c53 100644 --- a/demos/angular-app/yarn.lock +++ b/demos/angular-app/yarn.lock @@ -6744,17 +6744,17 @@ send@0.18.0: range-parser "~1.2.1" statuses "2.0.1" -sequential-workflow-designer-angular@^0.24.2: - version "0.24.2" - resolved "https://registry.yarnpkg.com/sequential-workflow-designer-angular/-/sequential-workflow-designer-angular-0.24.2.tgz#def1c1ed8bf58942653be1dd4a5e8d5eb8e77cb5" - integrity sha512-o3oi6ogatAm53Drn44IoupcQHxgi2e3/8tf22J2AyOrFrIvzGbxVyZMKF2t99zYBDjmJkQ7p2jp58kwk0e363Q== +sequential-workflow-designer-angular@^0.24.3: + version "0.24.3" + resolved "https://registry.yarnpkg.com/sequential-workflow-designer-angular/-/sequential-workflow-designer-angular-0.24.3.tgz#9f130a321189a95a6ae735793bb906bce958d7fb" + integrity sha512-YRfm+cSrWAqHKvNRvuVOJxRtcmEKyX9alUGn+e6q8mW9czVKVZ5t+1jMZFPmkIYrUa/XwbzrR3zXgDXNO5l2oQ== dependencies: tslib "^2.3.0" -sequential-workflow-designer@^0.24.2: - version "0.24.2" - resolved "https://registry.yarnpkg.com/sequential-workflow-designer/-/sequential-workflow-designer-0.24.2.tgz#628b3d1e317c0a40b9b4c7c3b1b2703e17b3b741" - integrity sha512-dfnf23keTXvXlAq0XBNbOi2pyrJXKB4j41IPIV0UpFEbKZ54QkxPq4UYubA/TWGjSgIOG+jnrZuNrEzs61UVRw== +sequential-workflow-designer@^0.24.3: + version "0.24.3" + resolved "https://registry.yarnpkg.com/sequential-workflow-designer/-/sequential-workflow-designer-0.24.3.tgz#0e72b89003eb69f3172396ac29a729924e5ffbae" + integrity sha512-Y11VuUpa+Uo9tNFWoBdKg9w53Q0UhWfKeFCrHfuWrEDogCcY5hp52SiRsdCBW8qOHEBIG58KvMwfr9vxBtmjJQ== dependencies: sequential-workflow-model "^0.2.0" diff --git a/demos/react-app/package.json b/demos/react-app/package.json index 45c7728..ca548cb 100644 --- a/demos/react-app/package.json +++ b/demos/react-app/package.json @@ -6,8 +6,8 @@ "dependencies": { "react": "^18.2.0", "react-dom": "^18.2.0", - "sequential-workflow-designer": "^0.24.2", - "sequential-workflow-designer-react": "^0.24.2" + "sequential-workflow-designer": "^0.24.3", + "sequential-workflow-designer-react": "^0.24.3" }, "devDependencies": { "@types/jest": "^29.2.5", diff --git a/demos/svelte-app/package.json b/demos/svelte-app/package.json index 0b85655..a273fc5 100644 --- a/demos/svelte-app/package.json +++ b/demos/svelte-app/package.json @@ -16,8 +16,8 @@ "eslint": "eslint ./src --ext .ts" }, "dependencies": { - "sequential-workflow-designer": "^0.24.2", - "sequential-workflow-designer-svelte": "^0.24.2" + "sequential-workflow-designer": "^0.24.3", + "sequential-workflow-designer-svelte": "^0.24.3" }, "devDependencies": { "@sveltejs/adapter-static": "^2.0.3", diff --git a/designer/package.json b/designer/package.json index cb2c5d5..5b221a8 100644 --- a/designer/package.json +++ b/designer/package.json @@ -1,7 +1,7 @@ { "name": "sequential-workflow-designer", "description": "Customizable no-code component for building flow-based programming applications.", - "version": "0.24.2", + "version": "0.24.3", "type": "module", "main": "./lib/esm/index.js", "types": "./lib/index.d.ts", diff --git a/designer/src/designer-context.ts b/designer/src/designer-context.ts index 2bab960..1594753 100644 --- a/designer/src/designer-context.ts +++ b/designer/src/designer-context.ts @@ -16,11 +16,11 @@ import { PlaceholderController } from './designer-extension'; export class DesignerContext { public static create( + documentBody: Node, parent: HTMLElement, startDefinition: Definition, configuration: DesignerConfiguration, - services: Services, - documentBody: Node + services: Services ): DesignerContext { const definition = ObjectCloner.deepClone(startDefinition); @@ -60,6 +60,7 @@ export class DesignerContext { ); return new DesignerContext( + documentBody, theme, state, configuration, @@ -78,6 +79,7 @@ export class DesignerContext { } public constructor( + public readonly documentBody: Node, public readonly theme: string, public readonly state: DesignerState, public readonly configuration: DesignerConfiguration, diff --git a/designer/src/designer.ts b/designer/src/designer.ts index e4f71f8..943093a 100644 --- a/designer/src/designer.ts +++ b/designer/src/designer.ts @@ -42,7 +42,7 @@ export class Designer { } const services = ServicesResolver.resolve(configuration.extensions, config); - const designerContext = DesignerContext.create(placeholder, startDefinition, config, services, documentBody); + const designerContext = DesignerContext.create(documentBody, placeholder, startDefinition, config, services); const designerApi = DesignerApi.create(designerContext); const view = DesignerView.create(placeholder, designerContext, designerApi); diff --git a/designer/src/test-tools/stubs.ts b/designer/src/test-tools/stubs.ts index 63dd279..a35b264 100644 --- a/designer/src/test-tools/stubs.ts +++ b/designer/src/test-tools/stubs.ts @@ -49,7 +49,7 @@ export function createDesignerContextStub(): DesignerContext { const configuration = createDesignerConfigurationStub(); const services = ServicesResolver.resolve([], configuration); const documentBody = document.body; - return DesignerContext.create(parent, createDefinitionStub(), createDesignerConfigurationStub(), services, documentBody); + return DesignerContext.create(documentBody, parent, createDefinitionStub(), createDesignerConfigurationStub(), services); } export function createComponentContextStub(): ComponentContext { diff --git a/designer/src/workspace/context-menu/context-menu-controller.ts b/designer/src/workspace/context-menu/context-menu-controller.ts index 315660e..2729597 100644 --- a/designer/src/workspace/context-menu/context-menu-controller.ts +++ b/designer/src/workspace/context-menu/context-menu-controller.ts @@ -8,6 +8,7 @@ export class ContextMenuController { private current?: ContextMenu; public constructor( + private readonly documentBody: Node, private readonly theme: string, private readonly configuration: DesignerConfiguration, private readonly itemsBuilder: ContextMenuItemsBuilder @@ -24,7 +25,7 @@ export class ContextMenuController { } const items = this.itemsBuilder.build(commandOrNull); - this.current = ContextMenu.create(position, this.theme, items); + this.current = ContextMenu.create(this.documentBody, position, this.theme, items); } public destroy() { diff --git a/designer/src/workspace/context-menu/context-menu.ts b/designer/src/workspace/context-menu/context-menu.ts index 0807401..269ce07 100644 --- a/designer/src/workspace/context-menu/context-menu.ts +++ b/designer/src/workspace/context-menu/context-menu.ts @@ -2,7 +2,7 @@ import { Vector } from '../../core'; import { ContextMenuItem } from '../../designer-extension'; export class ContextMenu { - public static create(position: Vector, theme: string, items: ContextMenuItem[]) { + public static create(documentBody: Node, position: Vector, theme: string, items: ContextMenuItem[]) { const menu = document.createElement('div'); menu.style.left = `${position.x}px`; menu.style.top = `${position.y}px`; @@ -25,18 +25,19 @@ export class ContextMenu { menu.appendChild(element); } - const instance = new ContextMenu(menu, elements, items, Date.now()); + const instance = new ContextMenu(documentBody, menu, elements, items, Date.now()); document.addEventListener('mousedown', instance.mouseDown, false); document.addEventListener('mouseup', instance.mouseUp, false); document.addEventListener('touchstart', instance.mouseDown, false); document.addEventListener('touchend', instance.mouseUp, false); - document.body.appendChild(menu); + documentBody.appendChild(menu); return instance; } private isAttached = true; private constructor( + private readonly documentBody: Node, private readonly menu: HTMLElement, private readonly elements: HTMLElement[], private readonly items: ContextMenuItem[], @@ -85,7 +86,7 @@ export class ContextMenu { public tryDestroy() { if (this.isAttached) { - document.body.removeChild(this.menu); + this.documentBody.removeChild(this.menu); document.removeEventListener('mousedown', this.mouseDown, false); document.removeEventListener('mouseup', this.mouseUp, false); document.removeEventListener('touchstart', this.mouseDown, false); diff --git a/designer/src/workspace/workspace.ts b/designer/src/workspace/workspace.ts index d6260a8..6fe4cf0 100644 --- a/designer/src/workspace/workspace.ts +++ b/designer/src/workspace/workspace.ts @@ -37,6 +37,7 @@ export class Workspace implements WorkspaceController { : undefined ); const contextMenuController = new ContextMenuController( + designerContext.documentBody, designerContext.theme, designerContext.configuration, contextMenuItemsBuilder diff --git a/examples/assets/lib.js b/examples/assets/lib.js index 8e0d2aa..df17c2d 100644 --- a/examples/assets/lib.js +++ b/examples/assets/lib.js @@ -13,7 +13,7 @@ function embedStylesheet(url) { document.write(``); } -const baseUrl = isTestEnv() ? '../designer' : '//cdn.jsdelivr.net/npm/sequential-workflow-designer@0.24.2'; +const baseUrl = isTestEnv() ? '../designer' : '//cdn.jsdelivr.net/npm/sequential-workflow-designer@0.24.3'; embedScript(`${baseUrl}/dist/index.umd.js`); embedStylesheet(`${baseUrl}/css/designer.css`); diff --git a/react/package.json b/react/package.json index 4986863..ee381f9 100644 --- a/react/package.json +++ b/react/package.json @@ -1,7 +1,7 @@ { "name": "sequential-workflow-designer-react", "description": "React wrapper for Sequential Workflow Designer component.", - "version": "0.24.2", + "version": "0.24.3", "type": "module", "main": "./lib/esm/index.js", "types": "./lib/index.d.ts", @@ -47,7 +47,7 @@ "peerDependencies": { "react": "^18.2.0", "react-dom": "^18.2.0", - "sequential-workflow-designer": "^0.24.2" + "sequential-workflow-designer": "^0.24.3" }, "devDependencies": { "@rollup/plugin-node-resolve": "^15.0.1", @@ -63,7 +63,7 @@ "prettier": "^3.2.5", "react": "^18.2.0", "react-dom": "^18.2.0", - "sequential-workflow-designer": "^0.24.2", + "sequential-workflow-designer": "^0.24.3", "rollup": "^3.18.0", "rollup-plugin-dts": "^5.2.0", "rollup-plugin-typescript2": "^0.34.1", diff --git a/svelte/package.json b/svelte/package.json index 13ddd82..4c4ed20 100644 --- a/svelte/package.json +++ b/svelte/package.json @@ -1,7 +1,7 @@ { "name": "sequential-workflow-designer-svelte", "description": "Svelte wrapper for Sequential Workflow Designer component.", - "version": "0.24.2", + "version": "0.24.3", "license": "MIT", "scripts": { "prepare": "cp ../LICENSE LICENSE", @@ -28,10 +28,10 @@ ], "peerDependencies": { "svelte": "^4.0.0", - "sequential-workflow-designer": "^0.24.2" + "sequential-workflow-designer": "^0.24.3" }, "devDependencies": { - "sequential-workflow-designer": "^0.24.2", + "sequential-workflow-designer": "^0.24.3", "@sveltejs/adapter-static": "^2.0.3", "@sveltejs/kit": "^1.20.4", "@sveltejs/package": "^2.0.0",