diff --git a/README.md b/README.md index 095bbd16..1261bf68 100644 --- a/README.md +++ b/README.md @@ -93,6 +93,30 @@ export JOINTJS_NPM_TOKEN="jjs-xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx" $env:JOINTJS_NPM_TOKEN="jjs-xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx" ``` +## 🛠️ Root Scripts + +After cloning the repository, install the root dev dependencies once: + +```bash +npm install +``` + +The following scripts are then available from the repository root: + +| Script | Command | Description | +|---|---|---| +| `lint` | `npm run lint` | Lint all JS/TS files using the root ESLint config | +| `build` | `npm run build` | Build all demos into `_site/` (stops on first failure) | +| `screenshot` | `npm run screenshot` | Capture screenshots for demos that don't have one yet | + +> [!NOTE] +> `build` require Bash. On Windows, run them from Git Bash or WSL. +> +> `screenshot` require Playwright's Chromium browser. Install it once with: +> ```bash +> npx playwright install chromium +> ``` + ## 🤝 Resources - [Documentation](https://docs.jointjs.com/) diff --git a/abstract-syntax-tree/js/src/app.js b/abstract-syntax-tree/js/src/app.js index 0471c595..6772193a 100644 --- a/abstract-syntax-tree/js/src/app.js +++ b/abstract-syntax-tree/js/src/app.js @@ -48,17 +48,17 @@ export const init = () => { const cells = graphUtils.constructTree(syntax, { children: getChildren, - makeElement: function (node) { + makeElement: function(node) { return new Node({ size: { width: 120, height: 30 }, attrs: { - text: { textWrap: { text: getLabel(node) } }, + text: { textWrap: { text: getLabel(node) }}, rect: { fill: getElementColor(node) } }, node: node }); }, - makeLink: function (parentElement, childElement) { + makeLink: function(parentElement, childElement) { return new Link({ source: { id: parentElement.id, selector: 'rect' }, target: { id: childElement.id, selector: 'rect' } @@ -117,9 +117,9 @@ export const init = () => { displayTree(); }); - let subtrees = {}; + const subtrees = {}; - paper.on('cell:pointerclick', function (cellView) { + paper.on('cell:pointerclick', function(cellView) { const cell = cellView.model; if (cell.isLink()) return; @@ -133,7 +133,7 @@ export const init = () => { const successors = graph.getSuccessors(cell); if (successors.length > 0) { subtrees[cell.id] = [].concat(graph.getSubgraph(successors), graph.getConnectedLinks(cell, { outbound: true })); - successors.forEach(function (successor) { + successors.forEach(function(successor) { successor.remove(); }); } diff --git a/abstract-syntax-tree/js/src/helpers.js b/abstract-syntax-tree/js/src/helpers.js index 12f324f8..393b57fd 100644 --- a/abstract-syntax-tree/js/src/helpers.js +++ b/abstract-syntax-tree/js/src/helpers.js @@ -164,7 +164,7 @@ const markField = StateField.define({ create() { return Decoration.none; }, update(value, tr) { value = value.map(tr.changes); - for (let effect of tr.effects) { + for (const effect of tr.effects) { if (effect.is(highlightMark)) value = value.update({ add: effect.value, sort: true }); else if (effect.is(filterMarks)) diff --git a/abstract-syntax-tree/js/src/shapes.js b/abstract-syntax-tree/js/src/shapes.js index d0b6e9b4..74d30d52 100644 --- a/abstract-syntax-tree/js/src/shapes.js +++ b/abstract-syntax-tree/js/src/shapes.js @@ -31,12 +31,12 @@ export class Node extends dia.Element { } markup = [{ - tagName: 'rect', - selector: 'rect' - }, { - tagName: 'text', - selector: 'text', - }]; + tagName: 'rect', + selector: 'rect' + }, { + tagName: 'text', + selector: 'text', + }]; } export class Link extends shapes.standard.Link { diff --git a/abstract-syntax-tree/ts/src/app.ts b/abstract-syntax-tree/ts/src/app.ts index aeacaa1e..a6fffe93 100644 --- a/abstract-syntax-tree/ts/src/app.ts +++ b/abstract-syntax-tree/ts/src/app.ts @@ -75,6 +75,7 @@ export const init = () => { document.querySelector('#stats .stats-n-tokens').textContent = syntax.tokens.length.toString(); document.querySelector('#stats .stats-tokens').innerHTML = ''; + // eslint-disable-next-line @typescript-eslint/no-explicit-any syntax.tokens.forEach((token: any) => { const li = document.createElement('li'); li.setAttribute('data-range', JSON.stringify(token.range)); @@ -121,7 +122,7 @@ export const init = () => { displayTree(); }); - let subtrees: { [key: dia.Cell.ID]: dia.Cell[] } = {}; + const subtrees: { [key: dia.Cell.ID]: dia.Cell[] } = {}; paper.on('cell:pointerclick', function(cellView) { const cell = cellView.model; diff --git a/abstract-syntax-tree/ts/src/helpers.ts b/abstract-syntax-tree/ts/src/helpers.ts index 82b65dec..5c66dce1 100644 --- a/abstract-syntax-tree/ts/src/helpers.ts +++ b/abstract-syntax-tree/ts/src/helpers.ts @@ -1,13 +1,15 @@ -import type { Range } from '@codemirror/state'; import { StateEffect, StateField } from '@codemirror/state'; -import type { DecorationSet } from '@codemirror/view'; import { Decoration, keymap } from '@codemirror/view'; import { EditorView, basicSetup } from 'codemirror'; import { indentWithTab } from '@codemirror/commands'; import { javascript } from '@codemirror/lang-javascript'; import presets from './presets'; -export function getChildren(node: any) { +import type { Range } from '@codemirror/state'; +import type { DecorationSet } from '@codemirror/view'; +import type { graphUtils } from '@joint/plus'; + +export function getChildren(node: graphUtils.ConstructTreeNode) { switch (node.type) { @@ -73,7 +75,7 @@ export function getChildren(node: any) { } } -export function getLabel(node: any) { +export function getLabel(node: graphUtils.ConstructTreeNode) { switch (node.type) { @@ -94,7 +96,7 @@ export function getLabel(node: any) { case 'FunctionDeclaration': case 'FunctionExpression': { - const params = node.params.map((param: any) => param.name).join(','); + const params = node.params.map((param: graphUtils.ConstructTreeNode) => param.name).join(','); return 'function ' + (node.id && node.id.name || '') + '(' + params + ')'; } default: @@ -102,7 +104,7 @@ export function getLabel(node: any) { } } -export function getElementColor(node: any) { +export function getElementColor(node: graphUtils.ConstructTreeNode) { const color = ({ 'Program': 'black', @@ -152,7 +154,7 @@ function tokenHover(e: Event) { export function changePreset() { const preset = document.getElementById('select-program') as HTMLSelectElement; const value = preset.value; - const code = (presets as any)[value]; + const code = (presets as Record)[value]; editorView.dispatch({ changes: { from: 0, to: editorView.state.doc.length, insert: code } }); @@ -166,7 +168,7 @@ const markField = StateField.define({ create() { return Decoration.none; }, update(value: DecorationSet, tr) { value = value.map(tr.changes); - for (let effect of tr.effects) { + for (const effect of tr.effects) { if (effect.is(highlightMark)) value = value.update({ add: effect.value, sort: true }); else if (effect.is(filterMarks)) value = value.update({ filter: () => false }); } diff --git a/ai-agent-builder/js/src/controllers/KeyboardController.js b/ai-agent-builder/js/src/controllers/KeyboardController.js index 3127f93f..86867af9 100644 --- a/ai-agent-builder/js/src/controllers/KeyboardController.js +++ b/ai-agent-builder/js/src/controllers/KeyboardController.js @@ -44,7 +44,7 @@ function onEscape(app) { // Conditional wrapper to execute the callback only if no dialog is opened function ifNoDialogOpen(callback) { - return function (app, evt) { + return function(app, evt) { const { state } = app; if (state.get(State.DialogOpened)) return; diff --git a/ai-agent-builder/js/src/diagram/data/defaults.js b/ai-agent-builder/js/src/diagram/data/defaults.js index af76bb91..d85e2a3a 100644 --- a/ai-agent-builder/js/src/diagram/data/defaults.js +++ b/ai-agent-builder/js/src/diagram/data/defaults.js @@ -33,10 +33,10 @@ export function getDefaultConditionData() { type: Condition.type, [Attribute.Label]: 'Condition', to: [{ - // Add an extra branch to the existing one - [Attribute.EdgePrompt]: '', - id: util.uuid() - }] + // Add an extra branch to the existing one + [Attribute.EdgePrompt]: '', + id: util.uuid() + }] }; } @@ -45,10 +45,10 @@ export function getDefaultAgentData() { type: Agent.type, skills: {}, to: [{ - // Add an extra branch to the existing one - [Attribute.EdgePrompt]: '', - id: util.uuid() - }] + // Add an extra branch to the existing one + [Attribute.EdgePrompt]: '', + id: util.uuid() + }] }; } diff --git a/ai-agent-builder/js/src/diagram/models/Action.js b/ai-agent-builder/js/src/diagram/models/Action.js index dda6c8cb..dff14416 100644 --- a/ai-agent-builder/js/src/diagram/models/Action.js +++ b/ai-agent-builder/js/src/diagram/models/Action.js @@ -120,7 +120,7 @@ export default class Action extends LabeledNode { updateProvider(provider, action) { const { icon } = provider; - const { name = '', data = {} } = action; + const { name = '', data = {}} = action; this.attr({ icon: { diff --git a/ai-agent-builder/js/src/diagram/models/Button.js b/ai-agent-builder/js/src/diagram/models/Button.js index 2fd1b746..af6caf55 100644 --- a/ai-agent-builder/js/src/diagram/models/Button.js +++ b/ai-agent-builder/js/src/diagram/models/Button.js @@ -32,7 +32,7 @@ export default class Button extends SystemButton { }, icon: { ...buttonIconAttributes, - transform: `translate(calc(s/2), calc(s/2))`, + transform: 'translate(calc(s/2), calc(s/2))', } } }; diff --git a/ai-agent-builder/js/src/diagram/models/Edge.js b/ai-agent-builder/js/src/diagram/models/Edge.js index 65d2f2fa..3043c53a 100644 --- a/ai-agent-builder/js/src/diagram/models/Edge.js +++ b/ai-agent-builder/js/src/diagram/models/Edge.js @@ -119,12 +119,12 @@ export default class Edge extends SystemEdge { const size = measureTextSize(wrappedText, fontSize, fontFamily); this.set({ labels: [{ - attrs: { - labelText: { - text: wrappedText - } + attrs: { + labelText: { + text: wrappedText } - }], + } + }], // Directed graph uses this property to make space for the label labelSize: { width: margin + size.width, diff --git a/ai-agent-builder/js/src/diagram/models/Placeholder.js b/ai-agent-builder/js/src/diagram/models/Placeholder.js index cdef9c59..6bddfd08 100644 --- a/ai-agent-builder/js/src/diagram/models/Placeholder.js +++ b/ai-agent-builder/js/src/diagram/models/Placeholder.js @@ -42,7 +42,7 @@ export default class Placeholder extends SystemPlaceholder { }, buttonIcon: { ...buttonIconAttributes, - transform: `translate(calc(w/2), calc(h/2))`, + transform: 'translate(calc(w/2), calc(h/2))', } } }; diff --git a/ai-agent-builder/js/src/diagram/tools/InsertNodeTool.js b/ai-agent-builder/js/src/diagram/tools/InsertNodeTool.js index 93d97bbb..4622ecad 100644 --- a/ai-agent-builder/js/src/diagram/tools/InsertNodeTool.js +++ b/ai-agent-builder/js/src/diagram/tools/InsertNodeTool.js @@ -10,14 +10,14 @@ export default class InsertNodeTool extends linkTools.Button { }; /** Note: it mimics the SystemButton plus icon */ this.children = [{ - tagName: 'circle', - className: 'add-button-body', - attributes: { ...buttonBodyAttributes } - }, { - tagName: 'path', - className: 'add-button-icon', - attributes: { ...buttonIconAttributes } - }]; + tagName: 'circle', + className: 'add-button-body', + attributes: { ...buttonBodyAttributes } + }, { + tagName: 'path', + className: 'add-button-icon', + attributes: { ...buttonIconAttributes } + }]; this.options = { distance: '50%', ...options, diff --git a/ai-agent-builder/js/src/features/Navigator.js b/ai-agent-builder/js/src/features/Navigator.js index fda04824..16cf0fae 100644 --- a/ai-agent-builder/js/src/features/Navigator.js +++ b/ai-agent-builder/js/src/features/Navigator.js @@ -97,7 +97,7 @@ export default class Navigator { min: zoomOptions.min * 100, max: zoomOptions.max * 100, step: zoomOptions.step, - attrs: { input: { 'data-tooltip': 'Slide to zoom' } } + attrs: { input: { 'data-tooltip': 'Slide to zoom' }} }, { type: 'separator' }, { diff --git a/ai-agent-builder/js/src/features/file-drop.js b/ai-agent-builder/js/src/features/file-drop.js index ad938a2b..551c1362 100644 --- a/ai-agent-builder/js/src/features/file-drop.js +++ b/ai-agent-builder/js/src/features/file-drop.js @@ -5,17 +5,17 @@ */ export function enableFileDrop(paper, options = {}) { const { dropTarget: dropTargetEl = paper.el, format = 'text', } = options; - + dropTargetEl.addEventListener('drop', (evt) => { evt.preventDefault(); - + // Always remove the drop-zone class to ensure the viewport is visible after the drop event is triggered dropTargetEl.classList.remove('drop-zone'); - - const file = (evt.dataTransfer?.files).item(0); + + const file = (evt.dataTransfer.files).item(0); if (!file) return; - + const reader = new FileReader(); reader.onload = () => { let file = reader.result; @@ -30,15 +30,15 @@ export function enableFileDrop(paper, options = {}) { } paper.trigger('file:drop', file, evt); }; - + reader.readAsText(file); }); - + dropTargetEl.addEventListener('dragover', (evt) => { evt.preventDefault(); dropTargetEl.classList.add('drop-zone'); }); - + dropTargetEl.addEventListener('dragleave', (evt) => { evt.preventDefault(); dropTargetEl.classList.remove('drop-zone'); diff --git a/ai-agent-builder/js/src/system/diagram/builder/index.js b/ai-agent-builder/js/src/system/diagram/builder/index.js index 54c4f93c..81959c1e 100644 --- a/ai-agent-builder/js/src/system/diagram/builder/index.js +++ b/ai-agent-builder/js/src/system/diagram/builder/index.js @@ -19,9 +19,9 @@ const ZIndex = { export function buildDiagram(data, graph, options = {}) { const { // By default the data node is used as-is to create the model. - buildNode = (node) => node, - // By default, nodes have no growth limit. - growthLimit = () => Infinity, disableOptimalOrderHeuristic = true, } = options; + buildNode = (node) => node, + // By default, nodes have no growth limit. + growthLimit = () => Infinity, disableOptimalOrderHeuristic = true, } = options; updateGraph(graph, data, buildNode, growthLimit); layoutGraph(graph, disableOptimalOrderHeuristic); } @@ -146,15 +146,15 @@ function makeButton(nodeId) { const buttonId = `${nodeId}-button`; const buttonLineId = `${nodeId}-button-line`; return [{ - id: buttonId, - type: SystemButton.type, - z: ZIndex.Button, - }, { - id: buttonLineId, - type: SystemButtonLine.type, - source: { id: nodeId }, - target: { id: buttonId }, - z: ZIndex.ButtonLine, - }]; + id: buttonId, + type: SystemButton.type, + z: ZIndex.Button, + }, { + id: buttonLineId, + type: SystemButtonLine.type, + source: { id: nodeId }, + target: { id: buttonId }, + z: ZIndex.ButtonLine, + }]; } diff --git a/ai-agent-builder/ts/src/diagram/models/Agent.ts b/ai-agent-builder/ts/src/diagram/models/Agent.ts index 6f98183b..6917257f 100644 --- a/ai-agent-builder/ts/src/diagram/models/Agent.ts +++ b/ai-agent-builder/ts/src/diagram/models/Agent.ts @@ -1,9 +1,9 @@ -import type { dia } from '@joint/plus'; import { util } from '@joint/plus'; import LabeledNode from './LabeledNode'; import Theme, { nodeLabelAttributes, typeLabelAttributes } from '../theme'; import { Attribute } from '../const'; +import type { dia } from '@joint/plus'; import type { LabeledNodeAttributes } from './LabeledNode'; import type { InspectorConfig } from '../../types'; diff --git a/ai-agent-builder/ts/src/diagram/models/Button.ts b/ai-agent-builder/ts/src/diagram/models/Button.ts index 09f6e464..eecacfee 100644 --- a/ai-agent-builder/ts/src/diagram/models/Button.ts +++ b/ai-agent-builder/ts/src/diagram/models/Button.ts @@ -1,8 +1,9 @@ -import type { dia } from '@joint/plus'; import { util } from '@joint/plus'; import { SystemButton } from '../../system/diagram/models'; import Theme, { buttonBodyAttributes, buttonIconAttributes } from '../theme'; +import type { dia } from '@joint/plus'; + /** SVG markup for the button */ const buttonMarkup = util.svg/* xml */` @@ -37,7 +38,7 @@ export default class Button extends SystemButton { }, icon: { ...buttonIconAttributes, - transform: `translate(calc(s/2), calc(s/2))`, + transform: 'translate(calc(s/2), calc(s/2))', } } }; diff --git a/ai-agent-builder/ts/src/diagram/models/Placeholder.ts b/ai-agent-builder/ts/src/diagram/models/Placeholder.ts index 2dfb315e..bf75ab66 100644 --- a/ai-agent-builder/ts/src/diagram/models/Placeholder.ts +++ b/ai-agent-builder/ts/src/diagram/models/Placeholder.ts @@ -1,8 +1,9 @@ -import type { dia } from '@joint/plus'; import { util } from '@joint/plus'; import { SystemPlaceholder } from '../../system/diagram/models'; import Theme, { buttonBodyAttributes, buttonIconAttributes } from '../theme'; +import type { dia } from '@joint/plus'; + /** SVG markup for the placeholder */ const placeholderMarkup = util.svg/* xml*/` @@ -47,7 +48,7 @@ export default class Placeholder extends SystemPlaceholder { static type = Agent.type + 'View'; diff --git a/ai-agent-builder/ts/src/features/Navigator.ts b/ai-agent-builder/ts/src/features/Navigator.ts index e760714f..740b11e5 100644 --- a/ai-agent-builder/ts/src/features/Navigator.ts +++ b/ai-agent-builder/ts/src/features/Navigator.ts @@ -1,6 +1,7 @@ -import type { dia } from '@joint/plus'; import { ui } from '@joint/plus'; +import type { dia } from '@joint/plus'; + /** Default URL for navigator icons */ const defaultIconUrl = '.'; diff --git a/ai-agent-builder/ts/src/system/configs/paper-options.ts b/ai-agent-builder/ts/src/system/configs/paper-options.ts index 74726da2..55704c7b 100644 --- a/ai-agent-builder/ts/src/system/configs/paper-options.ts +++ b/ai-agent-builder/ts/src/system/configs/paper-options.ts @@ -1,8 +1,9 @@ -import type { g, anchors, connectionStrategies } from '@joint/plus'; import { dia, connectors } from '@joint/plus'; import { Attribute } from '../diagram/const'; import { SystemButton } from '../diagram/models'; +import type { g, anchors, connectionStrategies } from '@joint/plus'; + const LINK_SOURCE_ANCHOR_OFFSET = 25; const LINK_TARGET_ANCHOR_OFFSET = 20; const LINK_SOURCE_CONNECTOR_OFFSET = 25; diff --git a/ai-agent-builder/ts/src/system/controllers/BuildController.ts b/ai-agent-builder/ts/src/system/controllers/BuildController.ts index c34c5618..6c0beb24 100644 --- a/ai-agent-builder/ts/src/system/controllers/BuildController.ts +++ b/ai-agent-builder/ts/src/system/controllers/BuildController.ts @@ -1,7 +1,7 @@ import Controller from './Controller'; -import type { BuildDiagramOptions } from '../diagram/builder'; import { buildDiagram } from '../diagram/builder'; +import type { BuildDiagramOptions } from '../diagram/builder'; import type { dia } from '@joint/plus'; import type { SystemDiagramContext } from '../diagram/types'; diff --git a/ai-agent-builder/ts/src/system/diagram/builder/index.ts b/ai-agent-builder/ts/src/system/diagram/builder/index.ts index 09a3a779..f887ac6e 100644 --- a/ai-agent-builder/ts/src/system/diagram/builder/index.ts +++ b/ai-agent-builder/ts/src/system/diagram/builder/index.ts @@ -1,4 +1,3 @@ -import type { dia } from '@joint/plus'; import { util } from '@joint/plus'; import { layoutCells } from './layouts/dagre-layout'; import { Attribute } from '../const'; @@ -7,6 +6,7 @@ import { setCustomPosition } from '../custom-positions'; import { extractNodesIds } from '../data/utils'; import { SystemButton, SystemButtonLine, SystemEdge, SystemPlaceholder } from '../models'; +import type { dia } from '@joint/plus'; import type { BuildNode, GrowthLimit, BuildDiagramOptions } from './types'; import type { SystemDiagramJSON, SystemTypedNodeData } from '../types'; diff --git a/ai-agent-builder/ts/src/system/diagram/builder/layouts/dagre-layout.ts b/ai-agent-builder/ts/src/system/diagram/builder/layouts/dagre-layout.ts index 49317f7d..16e12eb9 100644 --- a/ai-agent-builder/ts/src/system/diagram/builder/layouts/dagre-layout.ts +++ b/ai-agent-builder/ts/src/system/diagram/builder/layouts/dagre-layout.ts @@ -1,7 +1,7 @@ -import type { dia } from '@joint/plus'; import { DirectedGraph } from '@joint/layout-directed-graph'; import { SystemButton } from '../../models'; +import type { dia } from '@joint/plus'; import type { AutoLayoutDiagramCells } from '../types'; export function layoutCells(graph: dia.Graph, cells: AutoLayoutDiagramCells, options?: DirectedGraph.LayoutOptions): void { diff --git a/ai-agent-builder/ts/src/system/diagram/custom-positions.ts b/ai-agent-builder/ts/src/system/diagram/custom-positions.ts index 839793d8..16699b9f 100644 --- a/ai-agent-builder/ts/src/system/diagram/custom-positions.ts +++ b/ai-agent-builder/ts/src/system/diagram/custom-positions.ts @@ -1,7 +1,7 @@ -import type { dia } from '@joint/core'; import { g } from '@joint/core'; import { Attribute } from './const'; +import type { dia } from '@joint/core'; import type { NodeCustomPosition } from './types'; /** diff --git a/ai-agent-builder/ts/src/system/diagram/data/DiagramData.ts b/ai-agent-builder/ts/src/system/diagram/data/DiagramData.ts index 8123abd5..f99de999 100644 --- a/ai-agent-builder/ts/src/system/diagram/data/DiagramData.ts +++ b/ai-agent-builder/ts/src/system/diagram/data/DiagramData.ts @@ -1,7 +1,7 @@ -import type { dia } from '@joint/plus'; import { util, mvc } from '@joint/plus'; import { removeEdge, removeNode, sortChildren, insertNode, appendNode, createNode, changeNode, addEdge, changeEdge } from './utils'; +import type { dia } from '@joint/plus'; import type { SystemDiagramJSON, SystemNodeData, ToEdge } from '../types'; export interface DiagramSetOptions extends mvc.ModelSetOptions { diff --git a/ai-agent-builder/ts/src/system/diagram/data/utils.ts b/ai-agent-builder/ts/src/system/diagram/data/utils.ts index 6df0a543..fb6cc81d 100644 --- a/ai-agent-builder/ts/src/system/diagram/data/utils.ts +++ b/ai-agent-builder/ts/src/system/diagram/data/utils.ts @@ -1,5 +1,6 @@ -import type { dia } from '@joint/plus'; import { util } from '@joint/plus'; + +import type { dia } from '@joint/plus'; import type { SystemNodeData, SystemDiagramJSON, SystemEdgeData } from '../types'; // Data modification diff --git a/angles/js/src/main.js b/angles/js/src/main.js index a2af6ccc..2f1d55ae 100644 --- a/angles/js/src/main.js +++ b/angles/js/src/main.js @@ -7,7 +7,7 @@ const namespace = { app: { Shape, } -} +}; const graph = new dia.Graph({}, { cellNamespace: namespace }); diff --git a/bpmn-camunda-integration/js/modeler/src/configs/font-style-sheet.js b/bpmn-camunda-integration/js/modeler/src/configs/font-style-sheet.js index c04562a9..80c61568 100644 --- a/bpmn-camunda-integration/js/modeler/src/configs/font-style-sheet.js +++ b/bpmn-camunda-integration/js/modeler/src/configs/font-style-sheet.js @@ -1,8 +1,8 @@ -var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) { - function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); } - return new (P || (P = Promise))(function (resolve, reject) { +var __awaiter = (this && this.__awaiter) || function(thisArg, _arguments, P, generator) { + function adopt(value) { return value instanceof P ? value : new P(function(resolve) { resolve(value); }); } + return new (P || (P = Promise))(function(resolve, reject) { function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } } - function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } } + function rejected(value) { try { step(generator['throw'](value)); } catch (e) { reject(e); } } function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); } step((generator = generator.apply(thisArg, _arguments || [])).next()); }); diff --git a/bpmn-camunda-integration/js/modeler/src/configs/halo-config.js b/bpmn-camunda-integration/js/modeler/src/configs/halo-config.js index 430d3b33..424ede87 100644 --- a/bpmn-camunda-integration/js/modeler/src/configs/halo-config.js +++ b/bpmn-camunda-integration/js/modeler/src/configs/halo-config.js @@ -48,7 +48,7 @@ export const groups = { }; const removeSwimlaneEvents = { - 'pointerup': function (_evt, _x, _y) { + 'pointerup': function(_evt, _x, _y) { const element = this.options.cellView.model; const pool = element.getParentCell(); pool.removeSwimlane(element); @@ -57,29 +57,29 @@ const removeSwimlaneEvents = { export const handles = { ConnectEndEvent: Object.assign(Object.assign({}, ui.Halo.getDefaultHandle('fork')), { name: 'connect-end-event', position: GroupNames.BPMNTools, content: ``, data: { - elementType: EventShapeTypes.END, - fork: true - }, hideOnDrag: true }), + elementType: EventShapeTypes.END, + fork: true + }, hideOnDrag: true }), ConnectIntermediateThrowingEvent: Object.assign(Object.assign({}, ui.Halo.getDefaultHandle('fork')), { name: 'connect-intermediate-throwing-event', position: GroupNames.BPMNTools, content: ``, data: { - elementType: EventShapeTypes.INTERMEDIATE_THROWING, - fork: true - }, hideOnDrag: true }), + elementType: EventShapeTypes.INTERMEDIATE_THROWING, + fork: true + }, hideOnDrag: true }), ConnectGateway: Object.assign(Object.assign({}, ui.Halo.getDefaultHandle('fork')), { name: 'connect-gateway', position: GroupNames.BPMNTools, content: ``, data: { - elementType: GatewayShapeTypes.EXCLUSIVE, - fork: true - }, hideOnDrag: true }), + elementType: GatewayShapeTypes.EXCLUSIVE, + fork: true + }, hideOnDrag: true }), ConnectServiceTask: Object.assign(Object.assign({}, ui.Halo.getDefaultHandle('fork')), { name: 'connect-service-task', position: GroupNames.BPMNTools, content: ``, data: { - elementType: ActivityShapeTypes.SERVICE, - fork: true - }, hideOnDrag: true }), + elementType: ActivityShapeTypes.SERVICE, + fork: true + }, hideOnDrag: true }), ConnectHttpRequest: Object.assign(Object.assign({}, ui.Halo.getDefaultHandle('fork')), { name: 'connect-http-request', position: GroupNames.BPMNTools, content: ``, data: { - elementType: ActivityShapeTypes.HTTP_CONNECTOR, - fork: true - }, hideOnDrag: true }), + elementType: ActivityShapeTypes.HTTP_CONNECTOR, + fork: true + }, hideOnDrag: true }), ConnectAnnotation: Object.assign(Object.assign({}, ui.Halo.getDefaultHandle('fork')), { name: 'connect-annotation', position: GroupNames.BPMNTools, content: ``, data: { - elementType: AnnotationShapeTypes.ANNOTATION, - fork: true - }, hideOnDrag: true }), + elementType: AnnotationShapeTypes.ANNOTATION, + fork: true + }, hideOnDrag: true }), Link: Object.assign(Object.assign({}, ui.Halo.getDefaultHandle('link')), { name: 'link-sequence', position: GroupNames.BPMNTools, content: ``, hideOnDrag: true }), RemoveHorizontalSwimlane: { name: 'remove-swimlane', diff --git a/bpmn-camunda-integration/js/modeler/src/configs/stencil-config.js b/bpmn-camunda-integration/js/modeler/src/configs/stencil-config.js index ca00857a..8177f59a 100644 --- a/bpmn-camunda-integration/js/modeler/src/configs/stencil-config.js +++ b/bpmn-camunda-integration/js/modeler/src/configs/stencil-config.js @@ -4,8 +4,8 @@ import { GatewayShapeTypes } from '../shapes/gateway/gateway-config'; import { ActivityShapeTypes } from '../shapes/activity/activity-config'; export var StencilShapeTypes; -(function (StencilShapeTypes) { - StencilShapeTypes["STENCIL_SHAPE"] = "stencil.Shape"; +(function(StencilShapeTypes) { + StencilShapeTypes['STENCIL_SHAPE'] = 'stencil.Shape'; })(StencilShapeTypes || (StencilShapeTypes = {})); const SHAPE_SIZE = 32; @@ -17,24 +17,24 @@ class StencilShape extends dia.Element { super(...arguments); this.markup = [{ - tagName: 'text', - selector: 'icon' - }]; + tagName: 'text', + selector: 'icon' + }]; } defaults() { return Object.assign(Object.assign({}, super.defaults), { type: StencilShapeTypes.STENCIL_SHAPE, size: { width: SHAPE_SIZE, height: SHAPE_SIZE }, attrs: { - icon: { - pointerEvents: 'none', - fontSize: 'calc(h)', - x: 'calc(w / 2)', - y: 'calc(h / 2 + 1.5)', - fontFamily: 'JJ BPMN Icons', - textAnchor: 'middle', - textVerticalAnchor: 'middle', - fill: '#191919' - } - } }); + icon: { + pointerEvents: 'none', + fontSize: 'calc(h)', + x: 'calc(w / 2)', + y: 'calc(h / 2 + 1.5)', + fontFamily: 'JJ BPMN Icons', + textAnchor: 'middle', + textVerticalAnchor: 'middle', + fill: '#191919' + } + }}); } static create(type) { diff --git a/bpmn-camunda-integration/js/modeler/src/controllers/stencil-controller.js b/bpmn-camunda-integration/js/modeler/src/controllers/stencil-controller.js index 2dc49905..9a537566 100644 --- a/bpmn-camunda-integration/js/modeler/src/controllers/stencil-controller.js +++ b/bpmn-camunda-integration/js/modeler/src/controllers/stencil-controller.js @@ -61,7 +61,7 @@ export default class StencilController extends Controller { }, 'element:drop': (context, elementView, evt, x, y) => { const { paper, selection } = context; - let { model } = elementView; + const { model } = elementView; let selectedModel; diff --git a/bpmn-camunda-integration/js/modeler/src/controllers/toolbar-actions-controller.js b/bpmn-camunda-integration/js/modeler/src/controllers/toolbar-actions-controller.js index 26b5d58b..5657e531 100644 --- a/bpmn-camunda-integration/js/modeler/src/controllers/toolbar-actions-controller.js +++ b/bpmn-camunda-integration/js/modeler/src/controllers/toolbar-actions-controller.js @@ -1,8 +1,8 @@ -var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) { - function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); } - return new (P || (P = Promise))(function (resolve, reject) { +var __awaiter = (this && this.__awaiter) || function(thisArg, _arguments, P, generator) { + function adopt(value) { return value instanceof P ? value : new P(function(resolve) { resolve(value); }); } + return new (P || (P = Promise))(function(resolve, reject) { function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } } - function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } } + function rejected(value) { try { step(generator['throw'](value)); } catch (e) { reject(e); } } function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); } step((generator = generator.apply(thisArg, _arguments || [])).next()); }); @@ -84,7 +84,7 @@ export default class ToolbarActionsController extends Controller { function onOpenFileDropdownClick(context) { const { toolbar } = context; - + const contextToolbar = new ui.ContextToolbar({ target: toolbar.getWidgetByName(toolbarToolNames.OPEN_FILE_DROPDOWN).el, root: toolbar.el, @@ -95,12 +95,12 @@ function onOpenFileDropdownClick(context) { anchor: 'top-left', tools: openFileDropdownTools }); - + contextToolbar.on(`action:${openFileDropdownToolNames.LOAD_XML}`, loadFromXML(context)); contextToolbar.on(`action:${openFileDropdownToolNames.DOWNLOAD_XML}`, () => onDownloadXMLClick(context)); - + contextToolbar.render(); - + return contextToolbar; } @@ -189,7 +189,7 @@ function showNotification(variant, title, message, opts = {}) { if (autoClose > 0) { setTimeout(() => { - try { dialog.close(); } catch (e) { /* already closed */ } + try { dialog.close(); } catch { /* already closed */ } }, autoClose); } @@ -504,109 +504,216 @@ function processXMLWithZeebeExtensions(paper, processName = null) { // Add zeebe:taskDefinition to all service tasks (required by Camunda 8) const serviceTasks = xml.getElementsByTagNameNS(bpmnNS, 'serviceTask'); for (let i = 0; i < serviceTasks.length; i++) { - const serviceTask = serviceTasks[i]; - const taskId = serviceTask.getAttribute('id'); - const httpConnectorData = httpConnectorConfigs.get(taskId); + const serviceTask = serviceTasks[i]; + const taskId = serviceTask.getAttribute('id'); + const httpConnectorData = httpConnectorConfigs.get(taskId); - let extensionElements = serviceTask.getElementsByTagNameNS(bpmnNS, 'extensionElements')[0]; - if (!extensionElements) { - extensionElements = xml.createElementNS(bpmnNS, 'bpmn:extensionElements'); - serviceTask.insertBefore(extensionElements, serviceTask.firstChild); + let extensionElements = serviceTask.getElementsByTagNameNS(bpmnNS, 'extensionElements')[0]; + if (!extensionElements) { + extensionElements = xml.createElementNS(bpmnNS, 'bpmn:extensionElements'); + serviceTask.insertBefore(extensionElements, serviceTask.firstChild); + } + + if (httpConnectorData) { + const httpConfig = httpConnectorData.httpConfig; + // This is an HTTP Connector task + serviceTask.setAttribute('zeebe:modelerTemplate', 'io.camunda.connectors.HttpJson.v2'); + serviceTask.setAttribute('zeebe:modelerTemplateVersion', '12'); + + // Add task definition + const taskDefinition = xml.createElementNS(zeebeNS, 'zeebe:taskDefinition'); + taskDefinition.setAttribute('type', 'io.camunda:http-json:1'); + taskDefinition.setAttribute('retries', String(httpConnectorData.retries)); + extensionElements.appendChild(taskDefinition); + + // Add IO mapping + const ioMapping = xml.createElementNS(zeebeNS, 'zeebe:ioMapping'); + + // Authentication type + const authInput = xml.createElementNS(zeebeNS, 'zeebe:input'); + authInput.setAttribute('source', '="noAuth"'); + authInput.setAttribute('target', 'authentication.type'); + ioMapping.appendChild(authInput); + + // Method + const methodInput = xml.createElementNS(zeebeNS, 'zeebe:input'); + const methodValue = httpConfig.method || 'GET'; + methodInput.setAttribute('source', `="${methodValue}"`); + methodInput.setAttribute('target', 'method'); + ioMapping.appendChild(methodInput); + + // URL + const urlInput = xml.createElementNS(zeebeNS, 'zeebe:input'); + const urlValue = httpConfig.url || ''; + urlInput.setAttribute('source', `="${urlValue}"`); + urlInput.setAttribute('target', 'url'); + ioMapping.appendChild(urlInput); + + // Headers (if provided) + if (httpConfig.headers) { + const headersInput = xml.createElementNS(zeebeNS, 'zeebe:input'); + headersInput.setAttribute('source', `=${httpConfig.headers}`); + headersInput.setAttribute('target', 'headers'); + ioMapping.appendChild(headersInput); } - if (httpConnectorData) { - const httpConfig = httpConnectorData.httpConfig; - // This is an HTTP Connector task - serviceTask.setAttribute('zeebe:modelerTemplate', 'io.camunda.connectors.HttpJson.v2'); - serviceTask.setAttribute('zeebe:modelerTemplateVersion', '12'); + // Query params (if provided) + if (httpConfig.queryParams) { + const queryInput = xml.createElementNS(zeebeNS, 'zeebe:input'); + queryInput.setAttribute('source', `=${httpConfig.queryParams}`); + queryInput.setAttribute('target', 'queryParameters'); + ioMapping.appendChild(queryInput); + } - // Add task definition - const taskDefinition = xml.createElementNS(zeebeNS, 'zeebe:taskDefinition'); - taskDefinition.setAttribute('type', 'io.camunda:http-json:1'); - taskDefinition.setAttribute('retries', String(httpConnectorData.retries)); - extensionElements.appendChild(taskDefinition); + // Body (if provided) + if (httpConfig.body) { + const bodyInput = xml.createElementNS(zeebeNS, 'zeebe:input'); + bodyInput.setAttribute('source', `=${httpConfig.body}`); + bodyInput.setAttribute('target', 'body'); + ioMapping.appendChild(bodyInput); + } - // Add IO mapping - const ioMapping = xml.createElementNS(zeebeNS, 'zeebe:ioMapping'); + // Store response + const storeResponseInput = xml.createElementNS(zeebeNS, 'zeebe:input'); + storeResponseInput.setAttribute('source', '=false'); + storeResponseInput.setAttribute('target', 'storeResponse'); + ioMapping.appendChild(storeResponseInput); + + // Timeouts (configurable, default 20 seconds; 0 = no timeout) + const connTimeout = httpConfig.connectionTimeoutInSeconds !== undefined ? httpConfig.connectionTimeoutInSeconds : 20; + const connTimeoutInput = xml.createElementNS(zeebeNS, 'zeebe:input'); + connTimeoutInput.setAttribute('source', `=${connTimeout}`); + connTimeoutInput.setAttribute('target', 'connectionTimeoutInSeconds'); + ioMapping.appendChild(connTimeoutInput); + + const readTimeout = httpConfig.readTimeoutInSeconds !== undefined ? httpConfig.readTimeoutInSeconds : 20; + const readTimeoutInput = xml.createElementNS(zeebeNS, 'zeebe:input'); + readTimeoutInput.setAttribute('source', `=${readTimeout}`); + readTimeoutInput.setAttribute('target', 'readTimeoutInSeconds'); + ioMapping.appendChild(readTimeoutInput); + + const writeTimeout = httpConfig.writeTimeoutInSeconds !== undefined ? httpConfig.writeTimeoutInSeconds : 0; + const writeTimeoutInput = xml.createElementNS(zeebeNS, 'zeebe:input'); + writeTimeoutInput.setAttribute('source', `=${writeTimeout}`); + writeTimeoutInput.setAttribute('target', 'writeTimeoutInSeconds'); + ioMapping.appendChild(writeTimeoutInput); + + // Ignore null values + const ignoreNullInput = xml.createElementNS(zeebeNS, 'zeebe:input'); + ignoreNullInput.setAttribute('source', '=false'); + ignoreNullInput.setAttribute('target', 'ignoreNullValues'); + ioMapping.appendChild(ignoreNullInput); + + // Add user-defined input mappings if present + const inputMappings = elementInputMappings.get(taskId); + if (inputMappings && inputMappings.length > 0) { + for (const mapping of inputMappings) { + if (mapping.target && mapping.source) { + const inputElement = xml.createElementNS(zeebeNS, 'zeebe:input'); + let sourceExpr = mapping.source.trim(); + if (!sourceExpr.startsWith('=')) { + sourceExpr = '=' + sourceExpr; + } + inputElement.setAttribute('source', sourceExpr); + inputElement.setAttribute('target', mapping.target); + ioMapping.appendChild(inputElement); + } + } + } - // Authentication type - const authInput = xml.createElementNS(zeebeNS, 'zeebe:input'); - authInput.setAttribute('source', '="noAuth"'); - authInput.setAttribute('target', 'authentication.type'); - ioMapping.appendChild(authInput); - - // Method - const methodInput = xml.createElementNS(zeebeNS, 'zeebe:input'); - const methodValue = httpConfig.method || 'GET'; - methodInput.setAttribute('source', `="${methodValue}"`); - methodInput.setAttribute('target', 'method'); - ioMapping.appendChild(methodInput); - - // URL - const urlInput = xml.createElementNS(zeebeNS, 'zeebe:input'); - const urlValue = httpConfig.url || ''; - urlInput.setAttribute('source', `="${urlValue}"`); - urlInput.setAttribute('target', 'url'); - ioMapping.appendChild(urlInput); - - // Headers (if provided) - if (httpConfig.headers) { - const headersInput = xml.createElementNS(zeebeNS, 'zeebe:input'); - headersInput.setAttribute('source', `=${httpConfig.headers}`); - headersInput.setAttribute('target', 'headers'); - ioMapping.appendChild(headersInput); + // Add output mappings if present + const outputMappings = elementOutputMappings.get(taskId); + if (outputMappings && outputMappings.length > 0) { + for (const mapping of outputMappings) { + if (mapping.target && mapping.source) { + const outputElement = xml.createElementNS(zeebeNS, 'zeebe:output'); + // Source is FEEL expression, ensure it starts with '=' + let sourceExpr = mapping.source.trim(); + if (!sourceExpr.startsWith('=')) { + sourceExpr = '=' + sourceExpr; + } + outputElement.setAttribute('source', sourceExpr); + outputElement.setAttribute('target', mapping.target); + ioMapping.appendChild(outputElement); + } } + } + + extensionElements.appendChild(ioMapping); + + // Add task headers + const taskHeaders = xml.createElementNS(zeebeNS, 'zeebe:taskHeaders'); + + const templateVersionHeader = xml.createElementNS(zeebeNS, 'zeebe:header'); + templateVersionHeader.setAttribute('key', 'elementTemplateVersion'); + templateVersionHeader.setAttribute('value', '12'); + taskHeaders.appendChild(templateVersionHeader); + + const templateIdHeader = xml.createElementNS(zeebeNS, 'zeebe:header'); + templateIdHeader.setAttribute('key', 'elementTemplateId'); + templateIdHeader.setAttribute('value', 'io.camunda.connectors.HttpJson.v2'); + taskHeaders.appendChild(templateIdHeader); + + const resultVarHeader = xml.createElementNS(zeebeNS, 'zeebe:header'); + resultVarHeader.setAttribute('key', 'resultVariable'); + resultVarHeader.setAttribute('value', httpConfig.resultVariable || ''); + taskHeaders.appendChild(resultVarHeader); + + const resultExprHeader = xml.createElementNS(zeebeNS, 'zeebe:header'); + resultExprHeader.setAttribute('key', 'resultExpression'); + resultExprHeader.setAttribute('value', httpConnectorData.resultExpression || ''); + taskHeaders.appendChild(resultExprHeader); + + const errorExprHeader = xml.createElementNS(zeebeNS, 'zeebe:header'); + errorExprHeader.setAttribute('key', 'errorExpression'); + errorExprHeader.setAttribute('value', httpConnectorData.errorExpression || ''); + taskHeaders.appendChild(errorExprHeader); + + const retryBackoffHeader = xml.createElementNS(zeebeNS, 'zeebe:header'); + retryBackoffHeader.setAttribute('key', 'retryBackoff'); + retryBackoffHeader.setAttribute('value', httpConnectorData.retryBackoff); + taskHeaders.appendChild(retryBackoffHeader); + + extensionElements.appendChild(taskHeaders); + } else { + // Regular service task + const taskName = serviceTask.getAttribute('name') || 'default'; + const taskDefinition = xml.createElementNS(zeebeNS, 'zeebe:taskDefinition'); + taskDefinition.setAttribute('type', taskName); + extensionElements.appendChild(taskDefinition); - // Query params (if provided) - if (httpConfig.queryParams) { - const queryInput = xml.createElementNS(zeebeNS, 'zeebe:input'); - queryInput.setAttribute('source', `=${httpConfig.queryParams}`); - queryInput.setAttribute('target', 'queryParameters'); - ioMapping.appendChild(queryInput); + // Add Zeebe task headers if result/error expressions are set + const headers = serviceTaskHeaders.get(taskId); + if (headers && (headers.resultExpression || headers.errorExpression)) { + const taskHeaders = xml.createElementNS(zeebeNS, 'zeebe:taskHeaders'); + + if (headers.resultExpression) { + const resultExprHeader = xml.createElementNS(zeebeNS, 'zeebe:header'); + resultExprHeader.setAttribute('key', 'resultExpression'); + resultExprHeader.setAttribute('value', headers.resultExpression); + taskHeaders.appendChild(resultExprHeader); } - // Body (if provided) - if (httpConfig.body) { - const bodyInput = xml.createElementNS(zeebeNS, 'zeebe:input'); - bodyInput.setAttribute('source', `=${httpConfig.body}`); - bodyInput.setAttribute('target', 'body'); - ioMapping.appendChild(bodyInput); + if (headers.errorExpression) { + const errorExprHeader = xml.createElementNS(zeebeNS, 'zeebe:header'); + errorExprHeader.setAttribute('key', 'errorExpression'); + errorExprHeader.setAttribute('value', headers.errorExpression); + taskHeaders.appendChild(errorExprHeader); } - // Store response - const storeResponseInput = xml.createElementNS(zeebeNS, 'zeebe:input'); - storeResponseInput.setAttribute('source', '=false'); - storeResponseInput.setAttribute('target', 'storeResponse'); - ioMapping.appendChild(storeResponseInput); - - // Timeouts (configurable, default 20 seconds; 0 = no timeout) - const connTimeout = httpConfig.connectionTimeoutInSeconds !== undefined ? httpConfig.connectionTimeoutInSeconds : 20; - const connTimeoutInput = xml.createElementNS(zeebeNS, 'zeebe:input'); - connTimeoutInput.setAttribute('source', `=${connTimeout}`); - connTimeoutInput.setAttribute('target', 'connectionTimeoutInSeconds'); - ioMapping.appendChild(connTimeoutInput); - - const readTimeout = httpConfig.readTimeoutInSeconds !== undefined ? httpConfig.readTimeoutInSeconds : 20; - const readTimeoutInput = xml.createElementNS(zeebeNS, 'zeebe:input'); - readTimeoutInput.setAttribute('source', `=${readTimeout}`); - readTimeoutInput.setAttribute('target', 'readTimeoutInSeconds'); - ioMapping.appendChild(readTimeoutInput); - - const writeTimeout = httpConfig.writeTimeoutInSeconds !== undefined ? httpConfig.writeTimeoutInSeconds : 0; - const writeTimeoutInput = xml.createElementNS(zeebeNS, 'zeebe:input'); - writeTimeoutInput.setAttribute('source', `=${writeTimeout}`); - writeTimeoutInput.setAttribute('target', 'writeTimeoutInSeconds'); - ioMapping.appendChild(writeTimeoutInput); - - // Ignore null values - const ignoreNullInput = xml.createElementNS(zeebeNS, 'zeebe:input'); - ignoreNullInput.setAttribute('source', '=false'); - ignoreNullInput.setAttribute('target', 'ignoreNullValues'); - ioMapping.appendChild(ignoreNullInput); - - // Add user-defined input mappings if present - const inputMappings = elementInputMappings.get(taskId); - if (inputMappings && inputMappings.length > 0) { + extensionElements.appendChild(taskHeaders); + } + + // Add I/O mappings if present + const inputMappings = elementInputMappings.get(taskId); + const outputMappings = elementOutputMappings.get(taskId); + const hasInputMappings = inputMappings && inputMappings.length > 0; + const hasOutputMappings = outputMappings && outputMappings.length > 0; + + if (hasInputMappings || hasOutputMappings) { + const ioMapping = xml.createElementNS(zeebeNS, 'zeebe:ioMapping'); + + if (hasInputMappings) { for (const mapping of inputMappings) { if (mapping.target && mapping.source) { const inputElement = xml.createElementNS(zeebeNS, 'zeebe:input'); @@ -621,13 +728,10 @@ function processXMLWithZeebeExtensions(paper, processName = null) { } } - // Add output mappings if present - const outputMappings = elementOutputMappings.get(taskId); - if (outputMappings && outputMappings.length > 0) { + if (hasOutputMappings) { for (const mapping of outputMappings) { if (mapping.target && mapping.source) { const outputElement = xml.createElementNS(zeebeNS, 'zeebe:output'); - // Source is FEEL expression, ensure it starts with '=' let sourceExpr = mapping.source.trim(); if (!sourceExpr.startsWith('=')) { sourceExpr = '=' + sourceExpr; @@ -640,111 +744,7 @@ function processXMLWithZeebeExtensions(paper, processName = null) { } extensionElements.appendChild(ioMapping); - - // Add task headers - const taskHeaders = xml.createElementNS(zeebeNS, 'zeebe:taskHeaders'); - - const templateVersionHeader = xml.createElementNS(zeebeNS, 'zeebe:header'); - templateVersionHeader.setAttribute('key', 'elementTemplateVersion'); - templateVersionHeader.setAttribute('value', '12'); - taskHeaders.appendChild(templateVersionHeader); - - const templateIdHeader = xml.createElementNS(zeebeNS, 'zeebe:header'); - templateIdHeader.setAttribute('key', 'elementTemplateId'); - templateIdHeader.setAttribute('value', 'io.camunda.connectors.HttpJson.v2'); - taskHeaders.appendChild(templateIdHeader); - - const resultVarHeader = xml.createElementNS(zeebeNS, 'zeebe:header'); - resultVarHeader.setAttribute('key', 'resultVariable'); - resultVarHeader.setAttribute('value', httpConfig.resultVariable || ''); - taskHeaders.appendChild(resultVarHeader); - - const resultExprHeader = xml.createElementNS(zeebeNS, 'zeebe:header'); - resultExprHeader.setAttribute('key', 'resultExpression'); - resultExprHeader.setAttribute('value', httpConnectorData.resultExpression || ''); - taskHeaders.appendChild(resultExprHeader); - - const errorExprHeader = xml.createElementNS(zeebeNS, 'zeebe:header'); - errorExprHeader.setAttribute('key', 'errorExpression'); - errorExprHeader.setAttribute('value', httpConnectorData.errorExpression || ''); - taskHeaders.appendChild(errorExprHeader); - - const retryBackoffHeader = xml.createElementNS(zeebeNS, 'zeebe:header'); - retryBackoffHeader.setAttribute('key', 'retryBackoff'); - retryBackoffHeader.setAttribute('value', httpConnectorData.retryBackoff); - taskHeaders.appendChild(retryBackoffHeader); - - extensionElements.appendChild(taskHeaders); - } else { - // Regular service task - const taskName = serviceTask.getAttribute('name') || 'default'; - const taskDefinition = xml.createElementNS(zeebeNS, 'zeebe:taskDefinition'); - taskDefinition.setAttribute('type', taskName); - extensionElements.appendChild(taskDefinition); - - // Add Zeebe task headers if result/error expressions are set - const headers = serviceTaskHeaders.get(taskId); - if (headers && (headers.resultExpression || headers.errorExpression)) { - const taskHeaders = xml.createElementNS(zeebeNS, 'zeebe:taskHeaders'); - - if (headers.resultExpression) { - const resultExprHeader = xml.createElementNS(zeebeNS, 'zeebe:header'); - resultExprHeader.setAttribute('key', 'resultExpression'); - resultExprHeader.setAttribute('value', headers.resultExpression); - taskHeaders.appendChild(resultExprHeader); - } - - if (headers.errorExpression) { - const errorExprHeader = xml.createElementNS(zeebeNS, 'zeebe:header'); - errorExprHeader.setAttribute('key', 'errorExpression'); - errorExprHeader.setAttribute('value', headers.errorExpression); - taskHeaders.appendChild(errorExprHeader); - } - - extensionElements.appendChild(taskHeaders); - } - - // Add I/O mappings if present - const inputMappings = elementInputMappings.get(taskId); - const outputMappings = elementOutputMappings.get(taskId); - const hasInputMappings = inputMappings && inputMappings.length > 0; - const hasOutputMappings = outputMappings && outputMappings.length > 0; - - if (hasInputMappings || hasOutputMappings) { - const ioMapping = xml.createElementNS(zeebeNS, 'zeebe:ioMapping'); - - if (hasInputMappings) { - for (const mapping of inputMappings) { - if (mapping.target && mapping.source) { - const inputElement = xml.createElementNS(zeebeNS, 'zeebe:input'); - let sourceExpr = mapping.source.trim(); - if (!sourceExpr.startsWith('=')) { - sourceExpr = '=' + sourceExpr; - } - inputElement.setAttribute('source', sourceExpr); - inputElement.setAttribute('target', mapping.target); - ioMapping.appendChild(inputElement); - } - } - } - - if (hasOutputMappings) { - for (const mapping of outputMappings) { - if (mapping.target && mapping.source) { - const outputElement = xml.createElementNS(zeebeNS, 'zeebe:output'); - let sourceExpr = mapping.source.trim(); - if (!sourceExpr.startsWith('=')) { - sourceExpr = '=' + sourceExpr; - } - outputElement.setAttribute('source', sourceExpr); - outputElement.setAttribute('target', mapping.target); - ioMapping.appendChild(outputElement); - } - } - } - - extensionElements.appendChild(ioMapping); - } + } } } @@ -920,9 +920,6 @@ function processXMLWithZeebeExtensions(paper, processName = null) { // and add zeebe:subscription if needed const messageRef = messageEventDef.getAttribute('messageRef'); if (!messageRef) { - // Create a message element and reference it - const messageId = `Message_${eventId}`; - // Check if we need to add zeebe subscription let extensionElements = catchEvent.getElementsByTagNameNS(bpmnNS, 'extensionElements')[0]; if (!extensionElements) { @@ -1299,7 +1296,7 @@ function loadDeployedProcesses(controller) { const response = yield fetch('http://localhost:3000/api/processes'); if (!response.ok) { - console.error('Failed to load deployed processes:', response.status, response.statusText); + console.warn('Failed to load deployed processes:', response.status, response.statusText); return; } @@ -1307,7 +1304,7 @@ function loadDeployedProcesses(controller) { controller.deployedProcesses = result.items || []; console.log(`Loaded ${controller.deployedProcesses.length} deployed processes:`, controller.deployedProcesses); } catch (error) { - console.error('Error loading deployed processes:', error); + console.warn('Error loading deployed processes:', error); controller.deployedProcesses = []; } }); @@ -1475,7 +1472,7 @@ function loadProcessIntoCanvas(context, process) { const displayName = process.name || process.processDefinitionId || 'Process'; console.log(`Process "${displayName}" (v${process.version}) loaded successfully!`); } catch (error) { - console.error('Error loading process:', error); + console.warn('Error loading process:', error); showNotification('error', 'Load Failed', `Failed to load process:
${error.message}`); } }); @@ -1643,7 +1640,7 @@ function extractZeebeExtensions(xmlDoc) { source = source.substring(1); // Remove quotes if present (both single and double) if ((source.startsWith('"') && source.endsWith('"')) || - (source.startsWith("'") && source.endsWith("'"))) { + (source.startsWith('\'') && source.endsWith('\''))) { source = source.substring(1, source.length - 1); } } diff --git a/bpmn-camunda-integration/js/modeler/src/effects/swimlane-preview.js b/bpmn-camunda-integration/js/modeler/src/effects/swimlane-preview.js index 2a189cdd..92c8350f 100644 --- a/bpmn-camunda-integration/js/modeler/src/effects/swimlane-preview.js +++ b/bpmn-camunda-integration/js/modeler/src/effects/swimlane-preview.js @@ -32,7 +32,7 @@ export const SwimlanePreview = dia.HighlighterView.extend({ if (horizontal) { let y = 0; - let x = poolPadding.left; + const x = poolPadding.left; if (!swimlane) { y = poolBBox.height - paddingBottom; } @@ -47,7 +47,7 @@ export const SwimlanePreview = dia.HighlighterView.extend({ } else { let x = 0; - let y = poolPadding.top; + const y = poolPadding.top; if (!swimlane) { x = poolBBox.width - paddingRight; } diff --git a/bpmn-camunda-integration/js/modeler/src/event-bus.js b/bpmn-camunda-integration/js/modeler/src/event-bus.js index df8dcd65..9e9e0940 100644 --- a/bpmn-camunda-integration/js/modeler/src/event-bus.js +++ b/bpmn-camunda-integration/js/modeler/src/event-bus.js @@ -3,6 +3,6 @@ import { mvc } from '@joint/plus'; export const eventBus = Object.assign({}, mvc.Events); export var EventBusEvents; -(function (EventBusEvents) { - EventBusEvents["GRAPH_REPLACE_CELL"] = "graph-change-cell"; +(function(EventBusEvents) { + EventBusEvents['GRAPH_REPLACE_CELL'] = 'graph-change-cell'; })(EventBusEvents || (EventBusEvents = {})); diff --git a/bpmn-camunda-integration/js/modeler/src/events/pools.js b/bpmn-camunda-integration/js/modeler/src/events/pools.js index 8863824c..a8c19d3a 100644 --- a/bpmn-camunda-integration/js/modeler/src/events/pools.js +++ b/bpmn-camunda-integration/js/modeler/src/events/pools.js @@ -37,7 +37,7 @@ export function onPoolDragStart(paper, poolView, evt, _x, _y) { const { clientX, clientY } = evt; // Local center of the pool - let { x, y } = paper.clientToLocalPoint(clientX, clientY); + const { x, y } = paper.clientToLocalPoint(clientX, clientY); node.setAttribute('transform', `translate(${x - poolDimensions.width / 2}, ${y - poolDimensions.height / 2})`); const frontLayer = paper.layers.querySelector('g.joint-back-layer'); @@ -202,7 +202,7 @@ function constructPoolPreview(pool, poolDimensions) { const poolHeaderSize = pool.getHeaderSize(); const { width, height } = poolDimensions; - let path = pool.isHorizontal() ? + const path = pool.isHorizontal() ? `M 0 0 H ${width + poolHeaderSize} V ${height} H 0 z M ${poolHeaderSize} 0 V ${height}` : `M 0 0 V ${height + poolHeaderSize} H ${width} V 0 z M 0 ${poolHeaderSize} H ${width}`; diff --git a/bpmn-camunda-integration/js/modeler/src/events/swimlanes.js b/bpmn-camunda-integration/js/modeler/src/events/swimlanes.js index f5481de0..fcd23c13 100644 --- a/bpmn-camunda-integration/js/modeler/src/events/swimlanes.js +++ b/bpmn-camunda-integration/js/modeler/src/events/swimlanes.js @@ -56,12 +56,12 @@ export function onSwimlaneDrag(paper, elementView, evt, x, y) { const viewInArea = paper .findElementViewsAtPoint({ x, y }) .sort((a, b) => { - var _a, _b; - const bZ = (_a = b.model.get('z')) !== null && _a !== void 0 ? _a : 0; - const aZ = (_b = a.model.get('z')) !== null && _b !== void 0 ? _b : 0; + var _a, _b; + const bZ = (_a = b.model.get('z')) !== null && _a !== void 0 ? _a : 0; + const aZ = (_b = a.model.get('z')) !== null && _b !== void 0 ? _b : 0; - return bZ - aZ; - }); + return bZ - aZ; + }); // Find the `poolView` that is the top-most pool under the cursor. const poolView = viewInArea.find((view) => shapes.bpmn2.CompositePool.isPool(view.model)); diff --git a/bpmn-camunda-integration/js/modeler/src/import/index.js b/bpmn-camunda-integration/js/modeler/src/import/index.js index 2eaee8aa..3fac6a4d 100644 --- a/bpmn-camunda-integration/js/modeler/src/import/index.js +++ b/bpmn-camunda-integration/js/modeler/src/import/index.js @@ -1,8 +1,8 @@ -var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) { - function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); } - return new (P || (P = Promise))(function (resolve, reject) { +var __awaiter = (this && this.__awaiter) || function(thisArg, _arguments, P, generator) { + function adopt(value) { return value instanceof P ? value : new P(function(resolve) { resolve(value); }); } + return new (P || (P = Promise))(function(resolve, reject) { function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } } - function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } } + function rejected(value) { try { step(generator['throw'](value)); } catch (e) { reject(e); } } function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); } step((generator = generator.apply(thisArg, _arguments || [])).next()); }); @@ -16,26 +16,26 @@ export class XMLFileImporter { this.paperScroller = paperScroller; this.commandManager = commandManager; } - + canHandle(file) { var _a; const extension = (_a = file.name.split('.').pop()) === null || _a === void 0 ? void 0 : _a.toLowerCase(); return extension === 'xml' || extension === 'bpmn'; } - + import(file, _graph) { return __awaiter(this, void 0, void 0, function* () { const xmlString = yield file.text(); const parser = new DOMParser(); const xml = parser.parseFromString(xmlString, 'application/xml'); - + const { cells, errors } = fromBPMN(xml, bpmnImportOptions); - + if (errors.length > 0) { - console.error(errors); + console.warn(errors); return; } - + // Use the utility function to import the graph with proper cell handling importBPMN(this.paperScroller, this.commandManager, cells); }); @@ -46,20 +46,20 @@ export class JSONFileImporter { constructor(paperScroller) { this.paperScroller = paperScroller; } - + canHandle(file) { var _a; const extension = (_a = file.name.split('.').pop()) === null || _a === void 0 ? void 0 : _a.toLowerCase(); return extension === 'json'; } - + import(file, graph) { return __awaiter(this, void 0, void 0, function* () { const jsonString = yield file.text(); - + // Import from JSON graph.fromJSON(JSON.parse(jsonString)); - + // Center content if paper scroller is available this.paperScroller.centerContent({ useModelGeometry: true }); }); @@ -67,17 +67,17 @@ export class JSONFileImporter { } class CompositeFileImporter { - + constructor(paperScroller, commandManager) { this.importers = []; this.importers.push(new XMLFileImporter(paperScroller, commandManager)); this.importers.push(new JSONFileImporter(paperScroller)); } - + canHandle(file) { return this.importers.some(importer => importer.canHandle(file)); } - + import(file, graph) { return __awaiter(this, void 0, void 0, function* () { const importer = this.importers.find(importer => importer.canHandle(file)); @@ -85,7 +85,7 @@ class CompositeFileImporter { yield importer.import(file, graph); } else { - console.error('No importer found for file:', file.name); + console.warn('No importer found for file:', file.name); } }); } @@ -97,14 +97,14 @@ export function setupFileImport(paperScroller, commandManager) { const controller = new AbortController(); const overlayEl = (_a = paperScroller.el.parentElement) === null || _a === void 0 ? void 0 : _a.querySelector('.file-import-overlay'); const { signal } = controller; - + function dropHandler(evt) { var _a, _b, _c; overlayEl.classList.remove('active'); paperScroller.unlock(); // Prevent default behavior (Prevent file from being opened) evt.preventDefault(); - + let file; if ((_a = evt.dataTransfer) === null || _a === void 0 ? void 0 : _a.items) { // Use DataTransferItemList interface to access the file(s) @@ -117,35 +117,35 @@ export function setupFileImport(paperScroller, commandManager) { // Use DataTransfer interface to access the file(s) file = evt.dataTransfer.files[0]; } - + if (!file) return; - + if (fileImporter.canHandle(file)) { fileImporter.import(file, paperScroller.options.paper.model); } else { - console.error('Unsupported file type:', file.name); + console.warn('Unsupported file type:', file.name); } } - + function dragOverHandler(evt) { overlayEl.classList.add('active'); // Prevent default behavior (Prevent file from being opened) evt.preventDefault(); paperScroller.lock(); } - + function dragLeaveHandler() { overlayEl.classList.remove('active'); paperScroller.unlock(); } - + // Add event listeners with the AbortSignal paperScroller.el.addEventListener('drop', dropHandler, { signal }); paperScroller.el.addEventListener('dragover', dragOverHandler, { signal }); paperScroller.el.addEventListener('dragleave', dragLeaveHandler, { signal }); - + // Return a cleanup function that aborts the controller return () => controller.abort(); } diff --git a/bpmn-camunda-integration/js/modeler/src/services/main-service.js b/bpmn-camunda-integration/js/modeler/src/services/main-service.js index a01b9249..2ca50c8e 100644 --- a/bpmn-camunda-integration/js/modeler/src/services/main-service.js +++ b/bpmn-camunda-integration/js/modeler/src/services/main-service.js @@ -36,7 +36,7 @@ export default class MainService { markAvailable: true, clickThreshold: 10, labelsLayer: true, - interactive: function (view) { + interactive: function(view) { const { model } = view; // Prevent swimlane move to pool/show ghost const isSwimlane = shapes.bpmn2.Swimlane.isSwimlane(model); @@ -100,7 +100,7 @@ export default class MainService { return bbox.leftMiddle(); } }, - connectionStrategy: function (end, view, _, coords) { + connectionStrategy: function(end, view, _, coords) { const { model } = view; diff --git a/bpmn-camunda-integration/js/modeler/src/services/navigator-service.js b/bpmn-camunda-integration/js/modeler/src/services/navigator-service.js index 772288cc..97d0b0d4 100644 --- a/bpmn-camunda-integration/js/modeler/src/services/navigator-service.js +++ b/bpmn-camunda-integration/js/modeler/src/services/navigator-service.js @@ -5,7 +5,7 @@ import NavigatorController from '../controllers/navigator-controller'; const baseUrl = 'assets/navigator'; const IconButton = ui.widgets.button.extend({ - render: function () { + render: function() { const size = this.options.size || 20; const imageEl = document.createElement('img'); imageEl.style.width = `${size}px`; @@ -15,10 +15,10 @@ const IconButton = ui.widgets.button.extend({ this.setTooltip(this.options.tooltip); return this; }, - setIcon: function (icon = '') { + setIcon: function(icon = '') { this.el.querySelector('img').src = icon; }, - setTooltip: function (tooltip = '') { + setTooltip: function(tooltip = '') { this.el.dataset.tooltip = tooltip; } }); @@ -44,7 +44,7 @@ const NavigatorElementView = dia.ElementView.extend({ }, // calls in an animation frame after a multiple changes // has been made to the model - confirmUpdate: function (flags) { + confirmUpdate: function(flags) { if (this.hasFlag(flags, UpdateFlags.Render)) this.render(); if (this.hasFlag(flags, UpdateFlags.Update)) @@ -53,12 +53,12 @@ const NavigatorElementView = dia.ElementView.extend({ if (this.hasFlag(flags, UpdateFlags.Transform)) this.updateTransformation(); }, - render: function () { + render: function() { const doc = util.parseDOMJSON(this.markup); this.body = doc.selectors.body; this.el.appendChild(doc.fragment); }, - update: function () { + update: function() { const { model, body } = this; // shape const { width, height } = model.size(); @@ -86,12 +86,12 @@ export default class NavigatorService { name: 'fit-to-screen', icon: `${baseUrl}/icon-zoom-to-fit.svg`, tooltip: 'Fit to screen', - attrs: { button: { 'data-tooltip-position': 'top' } } + attrs: { button: { 'data-tooltip-position': 'top' }} }, { type: 'icon-button', name: 'fullscreen', - attrs: { button: { 'data-tooltip-position': 'top' } } + attrs: { button: { 'data-tooltip-position': 'top' }} /* icon and tooltip are set in updateToolbarButtons() */ }, { @@ -99,14 +99,14 @@ export default class NavigatorService { min: ZOOM_SETTINGS.min * 100, max: ZOOM_SETTINGS.max * 100, step: 10, - attrs: { input: { 'data-tooltip': 'Slide to zoom', 'data-tooltip-position': 'top' } } + attrs: { input: { 'data-tooltip': 'Slide to zoom', 'data-tooltip-position': 'top' }} }, { type: 'separator' }, { type: 'icon-button', name: 'minimap', icon: `${baseUrl}/icon-minimap.svg`, - attrs: { button: { 'data-tooltip-position': 'top' } } + attrs: { button: { 'data-tooltip-position': 'top' }} } ], widgetNamespace: Object.assign(Object.assign({}, ui.widgets), { iconButton: IconButton }) diff --git a/bpmn-camunda-integration/js/modeler/src/services/stencil-service.js b/bpmn-camunda-integration/js/modeler/src/services/stencil-service.js index 5303b49d..15ed527c 100644 --- a/bpmn-camunda-integration/js/modeler/src/services/stencil-service.js +++ b/bpmn-camunda-integration/js/modeler/src/services/stencil-service.js @@ -42,17 +42,17 @@ export default class StencilService { .getGraph() .getElements() .forEach((el) => { - const elView = el.findView(stencil.getPaper()); - StencilHoverHighlighter.add(elView, 'root', 'stencil-highlight', { - className: 'stencil-background-highlight', - padding: 4 + const elView = el.findView(stencil.getPaper()); + StencilHoverHighlighter.add(elView, 'root', 'stencil-highlight', { + className: 'stencil-background-highlight', + padding: 4 + }); + const tooltip = el.get('tooltip'); + if (tooltip) { + elView.el.setAttribute('data-tooltip', tooltip); + elView.el.setAttribute('data-tooltip-position', 'right'); + } }); - const tooltip = el.get('tooltip'); - if (tooltip) { - elView.el.setAttribute('data-tooltip', tooltip); - elView.el.setAttribute('data-tooltip-position', 'right'); - } - }); this.stencilController = new StencilController({ stencil, paper: paperScroller.options.paper, selection }); this.stencilController.startListening(); diff --git a/bpmn-camunda-integration/js/modeler/src/shapes/activity/activity-config.js b/bpmn-camunda-integration/js/modeler/src/shapes/activity/activity-config.js index 077e8083..eda46255 100644 --- a/bpmn-camunda-integration/js/modeler/src/shapes/activity/activity-config.js +++ b/bpmn-camunda-integration/js/modeler/src/shapes/activity/activity-config.js @@ -16,19 +16,19 @@ export const ActivityLabels = { }; export var ActivityShapeTypes; -(function (ActivityShapeTypes) { - ActivityShapeTypes["TASK"] = "activity.Task"; - ActivityShapeTypes["SEND"] = "activity.Send"; - ActivityShapeTypes["SERVICE"] = "activity.Service"; - ActivityShapeTypes["MANUAL"] = "activity.Manual"; - ActivityShapeTypes["BUSINESS_RULE"] = "activity.BusinessRule"; - ActivityShapeTypes["RECEIVE"] = "activity.Receive"; - ActivityShapeTypes["USER"] = "activity.User"; - ActivityShapeTypes["SCRIPT"] = "activity.Script"; - ActivityShapeTypes["SUB_PROCESS"] = "activity.SubProcess"; - ActivityShapeTypes["CALL_ACTIVITY"] = "activity.CallActivity"; - ActivityShapeTypes["EVENT_SUB_PROCESS"] = "activity.EventSubProcess"; - ActivityShapeTypes["HTTP_CONNECTOR"] = "activity.HttpConnector"; +(function(ActivityShapeTypes) { + ActivityShapeTypes['TASK'] = 'activity.Task'; + ActivityShapeTypes['SEND'] = 'activity.Send'; + ActivityShapeTypes['SERVICE'] = 'activity.Service'; + ActivityShapeTypes['MANUAL'] = 'activity.Manual'; + ActivityShapeTypes['BUSINESS_RULE'] = 'activity.BusinessRule'; + ActivityShapeTypes['RECEIVE'] = 'activity.Receive'; + ActivityShapeTypes['USER'] = 'activity.User'; + ActivityShapeTypes['SCRIPT'] = 'activity.Script'; + ActivityShapeTypes['SUB_PROCESS'] = 'activity.SubProcess'; + ActivityShapeTypes['CALL_ACTIVITY'] = 'activity.CallActivity'; + ActivityShapeTypes['EVENT_SUB_PROCESS'] = 'activity.EventSubProcess'; + ActivityShapeTypes['HTTP_CONNECTOR'] = 'activity.HttpConnector'; })(ActivityShapeTypes || (ActivityShapeTypes = {})); export const activityIconClasses = { diff --git a/bpmn-camunda-integration/js/modeler/src/shapes/activity/activity-shapes.js b/bpmn-camunda-integration/js/modeler/src/shapes/activity/activity-shapes.js index 04fdb1ea..f4f3f765 100644 --- a/bpmn-camunda-integration/js/modeler/src/shapes/activity/activity-shapes.js +++ b/bpmn-camunda-integration/js/modeler/src/shapes/activity/activity-shapes.js @@ -29,11 +29,11 @@ export class Activity extends shapes.bpmn2.Activity { containerSelector: 'background' }, label: Object.assign(Object.assign({}, defaultAttrs.shapeLabel), { textVerticalAnchor: 'middle', text: 'Activity', textWrap: { - width: -10, - height: null, // reset the default -50 height and use maxLineCount instead - maxLineCount: 2, - ellipsis: true - } }) + width: -10, + height: null, // reset the default -50 height and use maxLineCount instead + maxLineCount: 2, + ellipsis: true + }}) } }, super.defaults); } diff --git a/bpmn-camunda-integration/js/modeler/src/shapes/annotation/annotation-config.js b/bpmn-camunda-integration/js/modeler/src/shapes/annotation/annotation-config.js index 29723185..2af2cb5e 100644 --- a/bpmn-camunda-integration/js/modeler/src/shapes/annotation/annotation-config.js +++ b/bpmn-camunda-integration/js/modeler/src/shapes/annotation/annotation-config.js @@ -6,9 +6,9 @@ export const AnnotationLabels = { }; export var AnnotationShapeTypes; -(function (AnnotationShapeTypes) { - AnnotationShapeTypes["ANNOTATION"] = "annotation.Annotation"; - AnnotationShapeTypes["LINK"] = "annotation.AnnotationLink"; +(function(AnnotationShapeTypes) { + AnnotationShapeTypes['ANNOTATION'] = 'annotation.Annotation'; + AnnotationShapeTypes['LINK'] = 'annotation.AnnotationLink'; })(AnnotationShapeTypes || (AnnotationShapeTypes = {})); export const annotationIconClasses = { diff --git a/bpmn-camunda-integration/js/modeler/src/shapes/data/data-config.js b/bpmn-camunda-integration/js/modeler/src/shapes/data/data-config.js index 9e1cea54..6a24bc69 100644 --- a/bpmn-camunda-integration/js/modeler/src/shapes/data/data-config.js +++ b/bpmn-camunda-integration/js/modeler/src/shapes/data/data-config.js @@ -9,12 +9,12 @@ export const DataLabels = { }; export var DataShapeTypes; -(function (DataShapeTypes) { - DataShapeTypes["DATA_STORE"] = "data.DataStore"; - DataShapeTypes["DATA_OBJECT"] = "data.DataObject"; - DataShapeTypes["DATA_INPUT"] = "data.DataInput"; - DataShapeTypes["DATA_OUTPUT"] = "data.DataOutput"; - DataShapeTypes["DATA_ASSOCIATION"] = "data.DataAssociation"; +(function(DataShapeTypes) { + DataShapeTypes['DATA_STORE'] = 'data.DataStore'; + DataShapeTypes['DATA_OBJECT'] = 'data.DataObject'; + DataShapeTypes['DATA_INPUT'] = 'data.DataInput'; + DataShapeTypes['DATA_OUTPUT'] = 'data.DataOutput'; + DataShapeTypes['DATA_ASSOCIATION'] = 'data.DataAssociation'; })(DataShapeTypes || (DataShapeTypes = {})); export const dataIconClasses = { diff --git a/bpmn-camunda-integration/js/modeler/src/shapes/event/event-config.js b/bpmn-camunda-integration/js/modeler/src/shapes/event/event-config.js index a95f4682..521810d0 100644 --- a/bpmn-camunda-integration/js/modeler/src/shapes/event/event-config.js +++ b/bpmn-camunda-integration/js/modeler/src/shapes/event/event-config.js @@ -49,52 +49,52 @@ export const EventLabels = { }; export var EventShapeTypes; -(function (EventShapeTypes) { +(function(EventShapeTypes) { // Start - EventShapeTypes["START"] = "event.Start"; - EventShapeTypes["MESSAGE_START"] = "event.MessageStart"; - EventShapeTypes["TIMER_START"] = "event.TimerStart"; - EventShapeTypes["CONDITIONAL_START"] = "event.ConditionalStart"; - EventShapeTypes["SIGNAL_START"] = "event.SignalStart"; + EventShapeTypes['START'] = 'event.Start'; + EventShapeTypes['MESSAGE_START'] = 'event.MessageStart'; + EventShapeTypes['TIMER_START'] = 'event.TimerStart'; + EventShapeTypes['CONDITIONAL_START'] = 'event.ConditionalStart'; + EventShapeTypes['SIGNAL_START'] = 'event.SignalStart'; // Intermediate Catching - EventShapeTypes["INTERMEDIATE_CATCHING"] = "event.IntermediateCatching"; - EventShapeTypes["MESSAGE_INTERMEDIATE_CATCHING"] = "event.MessageIntermediateCatching"; - EventShapeTypes["TIMER_INTERMEDIATE_CATCHING"] = "event.TimerIntermediateCatching"; - EventShapeTypes["CONDITIONAL_INTERMEDIATE_CATCHING"] = "event.ConditionalIntermediateCatching"; - EventShapeTypes["LINK_INTERMEDIATE_CATCHING"] = "event.LinkIntermediateCatching"; - EventShapeTypes["SIGNAL_INTERMEDIATE_CATCHING"] = "event.SignalIntermediateCatching"; + EventShapeTypes['INTERMEDIATE_CATCHING'] = 'event.IntermediateCatching'; + EventShapeTypes['MESSAGE_INTERMEDIATE_CATCHING'] = 'event.MessageIntermediateCatching'; + EventShapeTypes['TIMER_INTERMEDIATE_CATCHING'] = 'event.TimerIntermediateCatching'; + EventShapeTypes['CONDITIONAL_INTERMEDIATE_CATCHING'] = 'event.ConditionalIntermediateCatching'; + EventShapeTypes['LINK_INTERMEDIATE_CATCHING'] = 'event.LinkIntermediateCatching'; + EventShapeTypes['SIGNAL_INTERMEDIATE_CATCHING'] = 'event.SignalIntermediateCatching'; // Intermediate boundary - EventShapeTypes["INTERMEDIATE_BOUNDARY"] = "event.IntermediateBoundary"; - EventShapeTypes["MESSAGE_INTERMEDIATE_BOUNDARY"] = "event.MessageIntermediateBoundary"; - EventShapeTypes["TIMER_INTERMEDIATE_BOUNDARY"] = "event.TimerIntermediateBoundary"; - EventShapeTypes["CONDITIONAL_INTERMEDIATE_BOUNDARY"] = "event.ConditionalIntermediateBoundary"; - EventShapeTypes["SIGNAL_INTERMEDIATE_BOUNDARY"] = "event.SignalIntermediateBoundary"; - EventShapeTypes["ERROR_INTERMEDIATE_BOUNDARY"] = "event.ErrorIntermediateBoundary"; - EventShapeTypes["ESCALATION_INTERMEDIATE_BOUNDARY"] = "event.EscalationIntermediateBoundary"; - EventShapeTypes["COMPENSATION_INTERMEDIATE_BOUNDARY"] = "event.CompensationIntermediateBoundary"; - EventShapeTypes["CANCEL_INTERMEDIATE_BOUNDARY"] = "event.CancelIntermediateBoundary"; + EventShapeTypes['INTERMEDIATE_BOUNDARY'] = 'event.IntermediateBoundary'; + EventShapeTypes['MESSAGE_INTERMEDIATE_BOUNDARY'] = 'event.MessageIntermediateBoundary'; + EventShapeTypes['TIMER_INTERMEDIATE_BOUNDARY'] = 'event.TimerIntermediateBoundary'; + EventShapeTypes['CONDITIONAL_INTERMEDIATE_BOUNDARY'] = 'event.ConditionalIntermediateBoundary'; + EventShapeTypes['SIGNAL_INTERMEDIATE_BOUNDARY'] = 'event.SignalIntermediateBoundary'; + EventShapeTypes['ERROR_INTERMEDIATE_BOUNDARY'] = 'event.ErrorIntermediateBoundary'; + EventShapeTypes['ESCALATION_INTERMEDIATE_BOUNDARY'] = 'event.EscalationIntermediateBoundary'; + EventShapeTypes['COMPENSATION_INTERMEDIATE_BOUNDARY'] = 'event.CompensationIntermediateBoundary'; + EventShapeTypes['CANCEL_INTERMEDIATE_BOUNDARY'] = 'event.CancelIntermediateBoundary'; // Intermediate boundary non-interrupting - EventShapeTypes["MESSAGE_INTERMEDIATE_BOUNDARY_NON_INTERRUPTING"] = "event.MessageIntermediateBoundaryNonInterrupting"; - EventShapeTypes["TIMER_INTERMEDIATE_BOUNDARY_NON_INTERRUPTING"] = "event.TimerIntermediateBoundaryNonInterrupting"; - EventShapeTypes["CONDITIONAL_INTERMEDIATE_BOUNDARY_NON_INTERRUPTING"] = "event.ConditionalIntermediateBoundaryNonInterrupting"; - EventShapeTypes["SIGNAL_INTERMEDIATE_BOUNDARY_NON_INTERRUPTING"] = "event.SignalIntermediateBoundaryNonInterrupting"; - EventShapeTypes["ESCALATION_INTERMEDIATE_BOUNDARY_NON_INTERRUPTING"] = "event.EscalationIntermediateBoundaryNonInterrupting"; + EventShapeTypes['MESSAGE_INTERMEDIATE_BOUNDARY_NON_INTERRUPTING'] = 'event.MessageIntermediateBoundaryNonInterrupting'; + EventShapeTypes['TIMER_INTERMEDIATE_BOUNDARY_NON_INTERRUPTING'] = 'event.TimerIntermediateBoundaryNonInterrupting'; + EventShapeTypes['CONDITIONAL_INTERMEDIATE_BOUNDARY_NON_INTERRUPTING'] = 'event.ConditionalIntermediateBoundaryNonInterrupting'; + EventShapeTypes['SIGNAL_INTERMEDIATE_BOUNDARY_NON_INTERRUPTING'] = 'event.SignalIntermediateBoundaryNonInterrupting'; + EventShapeTypes['ESCALATION_INTERMEDIATE_BOUNDARY_NON_INTERRUPTING'] = 'event.EscalationIntermediateBoundaryNonInterrupting'; // Intermediate throwing - EventShapeTypes["INTERMEDIATE_THROWING"] = "event.IntermediateThrowing"; - EventShapeTypes["MESSAGE_INTERMEDIATE_THROWING"] = "event.MessageIntermediateThrowing"; - EventShapeTypes["LINK_INTERMEDIATE_THROWING"] = "event.LinkIntermediateThrowing"; - EventShapeTypes["SIGNAL_INTERMEDIATE_THROWING"] = "event.SignalIntermediateThrowing"; - EventShapeTypes["ESCALATION_INTERMEDIATE_THROWING"] = "event.EscalationIntermediateThrowing"; - EventShapeTypes["COMPENSATION_INTERMEDIATE_THROWING"] = "event.CompensationIntermediateThrowing"; + EventShapeTypes['INTERMEDIATE_THROWING'] = 'event.IntermediateThrowing'; + EventShapeTypes['MESSAGE_INTERMEDIATE_THROWING'] = 'event.MessageIntermediateThrowing'; + EventShapeTypes['LINK_INTERMEDIATE_THROWING'] = 'event.LinkIntermediateThrowing'; + EventShapeTypes['SIGNAL_INTERMEDIATE_THROWING'] = 'event.SignalIntermediateThrowing'; + EventShapeTypes['ESCALATION_INTERMEDIATE_THROWING'] = 'event.EscalationIntermediateThrowing'; + EventShapeTypes['COMPENSATION_INTERMEDIATE_THROWING'] = 'event.CompensationIntermediateThrowing'; // End - EventShapeTypes["END"] = "event.End"; - EventShapeTypes["MESSAGE_END"] = "event.MessageEnd"; - EventShapeTypes["SIGNAL_END"] = "event.SignalEnd"; - EventShapeTypes["ERROR_END"] = "event.ErrorEnd"; - EventShapeTypes["ESCALATION_END"] = "event.EscalationEnd"; - EventShapeTypes["TERMINATION_END"] = "event.TerminationEnd"; - EventShapeTypes["COMPENSATION_END"] = "event.CompensationEnd"; - EventShapeTypes["CANCEL_END"] = "event.CancelEnd"; + EventShapeTypes['END'] = 'event.End'; + EventShapeTypes['MESSAGE_END'] = 'event.MessageEnd'; + EventShapeTypes['SIGNAL_END'] = 'event.SignalEnd'; + EventShapeTypes['ERROR_END'] = 'event.ErrorEnd'; + EventShapeTypes['ESCALATION_END'] = 'event.EscalationEnd'; + EventShapeTypes['TERMINATION_END'] = 'event.TerminationEnd'; + EventShapeTypes['COMPENSATION_END'] = 'event.CompensationEnd'; + EventShapeTypes['CANCEL_END'] = 'event.CancelEnd'; })(EventShapeTypes || (EventShapeTypes = {})); export const eventIconClasses = { diff --git a/bpmn-camunda-integration/js/modeler/src/shapes/event/event-shapes.js b/bpmn-camunda-integration/js/modeler/src/shapes/event/event-shapes.js index e482b042..41d761ed 100644 --- a/bpmn-camunda-integration/js/modeler/src/shapes/event/event-shapes.js +++ b/bpmn-camunda-integration/js/modeler/src/shapes/event/event-shapes.js @@ -27,8 +27,8 @@ export class Event extends shapes.bpmn2.Event { outputMappings: [], attrs: { label: Object.assign(Object.assign({}, defaultAttrs.shapeLabel), { text: 'Event', refDy: null, refX: null, x: 'calc(w/2)', y: `calc(h+${LABEL_Y_OFFSET})`, textWrap: { - width: '200%' - } }), + width: '200%' + }}), labelBody: defaultAttrs.labelBody } }, super.defaults); diff --git a/bpmn-camunda-integration/js/modeler/src/shapes/factories.js b/bpmn-camunda-integration/js/modeler/src/shapes/factories.js index 88250e8a..e86c90ce 100644 --- a/bpmn-camunda-integration/js/modeler/src/shapes/factories.js +++ b/bpmn-camunda-integration/js/modeler/src/shapes/factories.js @@ -18,33 +18,33 @@ import { PoolShapeTypes } from './pool/pool-config'; import { HorizontalPool, HorizontalSwimlane, VerticalPool, VerticalSwimlane } from './pool/pool-shapes'; class ExportableActivity extends exportableObjects.Activity { - + isSubProcess() { return false; } } class ExportableSubProcess extends ExportableActivity { - + constructor(cellView, type, markers, label, eventTriggered = false) { super(cellView, type, markers, label); this.eventTriggered = eventTriggered; } - + isSubProcess() { return true; } - + toTaskXMLElement() { const taskXMLElement = super.toTaskXMLElement(); - + if (this.eventTriggered) { taskXMLElement.setAttribute('triggeredByEvent', 'true'); } - + return taskXMLElement; } - + toShapeXMLElement() { const shapeXMLElement = super.toShapeXMLElement(); shapeXMLElement.setAttribute('isExpanded', 'false'); @@ -325,26 +325,26 @@ function getEventType(xmlNode) { } function getActivityMarkers(xmlNode) { - + const markers = []; - + const multiInstanceLoopCharacteristics = xmlNode.querySelector('multiInstanceLoopCharacteristics'); - + if (multiInstanceLoopCharacteristics) { const isSequential = multiInstanceLoopCharacteristics.getAttribute('isSequential') === 'true'; markers.push(isSequential ? MarkerNames.SEQUENTIAL : MarkerNames.PARALLEL); } - + const loopCharacteristics = xmlNode.querySelector('standardLoopCharacteristics'); - + if (loopCharacteristics) { markers.push(MarkerNames.LOOP); } - + if (xmlNode.getAttribute('isForCompensation') === 'true') { markers.push(MarkerNames.COMPENSATION); } - + return markers; } @@ -352,13 +352,13 @@ function simplifyLinkWaypoints(xmlDoc, linkId) { const waypoints = Array.from(xmlDoc .querySelectorAll(`BPMNEdge[id$="${linkId}"] waypoint`)) .map((waypoint) => ({ x: Number(waypoint.getAttribute('x')), y: Number(waypoint.getAttribute('y')) })); - + const vertices = new g.Polyline(waypoints).simplify().points; - + // Remove first and last waypoints - they are anchors vertices.shift(); vertices.pop(); - + return vertices; } @@ -453,12 +453,12 @@ export const bpmnImportOptions = { return appElement; }, startEvent: (xmlNode, _xmlDoc, _shapeClass, defaultFactory) => { - + const defaultElement = defaultFactory(); const eventType = getEventType(xmlNode); - + let appElement; - + switch (eventType) { case 'message': appElement = new MessageStart({ id: defaultElement.id }); @@ -476,18 +476,18 @@ export const bpmnImportOptions = { appElement = new Start({ id: defaultElement.id }); break; } - + appElement.copyFrom(defaultElement); - + return appElement; }, intermediateThrowEvent: (xmlNode, _xmlDoc, _shapeClass, defaultFactory) => { - + const defaultElement = defaultFactory(); const eventType = getEventType(xmlNode); - + let appElement; - + switch (eventType) { case 'message': appElement = new MessageIntermediateThrowing({ id: defaultElement.id }); @@ -508,18 +508,18 @@ export const bpmnImportOptions = { appElement = new IntermediateThrowing({ id: defaultElement.id }); break; } - + appElement.copyFrom(defaultElement); - + return appElement; }, intermediateCatchEvent: (xmlNode, _xmlDoc, _shapeClass, defaultFactory) => { - + const defaultElement = defaultFactory(); const eventType = getEventType(xmlNode); - + let appElement; - + switch (eventType) { case 'message': appElement = new MessageIntermediateCatching({ id: defaultElement.id }); @@ -540,19 +540,19 @@ export const bpmnImportOptions = { appElement = new IntermediateThrowing({ id: defaultElement.id }); break; } - + appElement.copyFrom(defaultElement); - + return appElement; }, boundaryEvent: (xmlNode, _xmlDoc, _shapeClass, defaultFactory) => { - + const defaultElement = defaultFactory(); const eventType = getEventType(xmlNode); const isNonInterrupting = xmlNode.getAttribute('cancelActivity') === 'false'; - + let appElement; - + switch (eventType) { case 'message': appElement = isNonInterrupting ? @@ -592,18 +592,18 @@ export const bpmnImportOptions = { appElement = new IntermediateBoundary({ id: defaultElement.id }); break; } - + appElement.copyFrom(defaultElement); - + return appElement; }, endEvent: (xmlNode, _xmlDoc, _shapeClass, defaultFactory) => { - + const defaultElement = defaultFactory(); const eventType = getEventType(xmlNode); - + let appElement; - + switch (eventType) { case 'message': appElement = new MessageEnd({ id: defaultElement.id }); @@ -627,9 +627,9 @@ export const bpmnImportOptions = { appElement = new End({ id: defaultElement.id }); break; } - + appElement.copyFrom(defaultElement); - + return appElement; }, parallelGateway: (_xmlNode, _xmlDoc, _shapeClass, defaultFactory) => { @@ -663,7 +663,6 @@ export const bpmnImportOptions = { return appElement; }, sequenceFlow: (xmlNode, xmlDoc, _shapeClass, defaultFactory) => { - var _a; const defaultLink = defaultFactory(); // Find the conditionExpression element @@ -696,11 +695,11 @@ export const bpmnImportOptions = { const defaultLink = defaultFactory(); const appLink = new Message({ id: defaultLink.id }); appLink.copyFrom(defaultLink); - + if (appLink.vertices().length > 0) { appLink.vertices(simplifyLinkWaypoints(xmlDoc, appLink.id)); } - + return appLink; }, dataObject: (xmlNode, _xmlDoc, _shapeClass, defaultFactory) => { diff --git a/bpmn-camunda-integration/js/modeler/src/shapes/flow/flow-config.js b/bpmn-camunda-integration/js/modeler/src/shapes/flow/flow-config.js index 9c60b36a..93ca0ed6 100644 --- a/bpmn-camunda-integration/js/modeler/src/shapes/flow/flow-config.js +++ b/bpmn-camunda-integration/js/modeler/src/shapes/flow/flow-config.js @@ -8,11 +8,11 @@ export const FlowLabels = { }; export var FlowShapeTypes; -(function (FlowShapeTypes) { - FlowShapeTypes["SEQUENCE"] = "flow.Sequence"; - FlowShapeTypes["DEFAULT"] = "flow.Default"; - FlowShapeTypes["CONDITIONAL"] = "flow.Conditional"; - FlowShapeTypes["MESSAGE"] = "flow.Message"; +(function(FlowShapeTypes) { + FlowShapeTypes['SEQUENCE'] = 'flow.Sequence'; + FlowShapeTypes['DEFAULT'] = 'flow.Default'; + FlowShapeTypes['CONDITIONAL'] = 'flow.Conditional'; + FlowShapeTypes['MESSAGE'] = 'flow.Message'; })(FlowShapeTypes || (FlowShapeTypes = {})); export const flowIconClasses = { @@ -47,7 +47,7 @@ export const flowAppearanceConfig = { 0: { type: 'object', group: 'label', - when: { ne: { 'labels/0': null } }, + when: { ne: { 'labels/0': null }}, properties: { attrs: { body: { diff --git a/bpmn-camunda-integration/js/modeler/src/shapes/gateway/gateway-config.js b/bpmn-camunda-integration/js/modeler/src/shapes/gateway/gateway-config.js index 909183b0..ef16874e 100644 --- a/bpmn-camunda-integration/js/modeler/src/shapes/gateway/gateway-config.js +++ b/bpmn-camunda-integration/js/modeler/src/shapes/gateway/gateway-config.js @@ -9,12 +9,12 @@ export const GatewayLabels = { }; export var GatewayShapeTypes; -(function (GatewayShapeTypes) { - GatewayShapeTypes["EXCLUSIVE"] = "gateway.Exclusive"; - GatewayShapeTypes["INCLUSIVE"] = "gateway.Inclusive"; - GatewayShapeTypes["EVENT_BASED"] = "gateway.EventBased"; - GatewayShapeTypes["PARALLEL"] = "gateway.Parallel"; - GatewayShapeTypes["COMPLEX"] = "gateway.Complex"; +(function(GatewayShapeTypes) { + GatewayShapeTypes['EXCLUSIVE'] = 'gateway.Exclusive'; + GatewayShapeTypes['INCLUSIVE'] = 'gateway.Inclusive'; + GatewayShapeTypes['EVENT_BASED'] = 'gateway.EventBased'; + GatewayShapeTypes['PARALLEL'] = 'gateway.Parallel'; + GatewayShapeTypes['COMPLEX'] = 'gateway.Complex'; })(GatewayShapeTypes || (GatewayShapeTypes = {})); export const gatewayIconClasses = { diff --git a/bpmn-camunda-integration/js/modeler/src/shapes/gateway/gateway-shapes.js b/bpmn-camunda-integration/js/modeler/src/shapes/gateway/gateway-shapes.js index 1a691024..996974cc 100644 --- a/bpmn-camunda-integration/js/modeler/src/shapes/gateway/gateway-shapes.js +++ b/bpmn-camunda-integration/js/modeler/src/shapes/gateway/gateway-shapes.js @@ -24,8 +24,8 @@ class Gateway extends shapes.bpmn2.Gateway { shapeType: ShapeTypes.GATEWAY, attrs: { label: Object.assign(Object.assign({}, defaultAttrs.shapeLabel), { refDy: null, refX: null, x: 'calc(w/2)', y: `calc(h+${LABEL_Y_OFFSET})`, text: '', textWrap: { - width: '200%' - } }), + width: '200%' + }}), labelBody: defaultAttrs.labelBody }, size: { diff --git a/bpmn-camunda-integration/js/modeler/src/shapes/group/group-config.js b/bpmn-camunda-integration/js/modeler/src/shapes/group/group-config.js index cae87f39..c7119d96 100644 --- a/bpmn-camunda-integration/js/modeler/src/shapes/group/group-config.js +++ b/bpmn-camunda-integration/js/modeler/src/shapes/group/group-config.js @@ -5,8 +5,8 @@ export const GroupLabels = { }; export var GroupShapeTypes; -(function (GroupShapeTypes) { - GroupShapeTypes["GROUP"] = "group.Group"; +(function(GroupShapeTypes) { + GroupShapeTypes['GROUP'] = 'group.Group'; })(GroupShapeTypes || (GroupShapeTypes = {})); export const groupAppearanceConfig = { diff --git a/bpmn-camunda-integration/js/modeler/src/shapes/placeholder/placeholder-config.js b/bpmn-camunda-integration/js/modeler/src/shapes/placeholder/placeholder-config.js index ba29d99a..5788f38c 100644 --- a/bpmn-camunda-integration/js/modeler/src/shapes/placeholder/placeholder-config.js +++ b/bpmn-camunda-integration/js/modeler/src/shapes/placeholder/placeholder-config.js @@ -4,8 +4,8 @@ import { DataShapeTypes } from '../data/data-config'; import { MAIN_COLOR } from '../../configs/theme'; export var PlaceholderShapeTypes; -(function (PlaceholderShapeTypes) { - PlaceholderShapeTypes["LINK"] = "placeholder.Link"; +(function(PlaceholderShapeTypes) { + PlaceholderShapeTypes['LINK'] = 'placeholder.Link'; })(PlaceholderShapeTypes || (PlaceholderShapeTypes = {})); const PLACEHOLDER_STROKE = MAIN_COLOR; diff --git a/bpmn-camunda-integration/js/modeler/src/shapes/pool/pool-config.js b/bpmn-camunda-integration/js/modeler/src/shapes/pool/pool-config.js index 7eab42c8..6196a637 100644 --- a/bpmn-camunda-integration/js/modeler/src/shapes/pool/pool-config.js +++ b/bpmn-camunda-integration/js/modeler/src/shapes/pool/pool-config.js @@ -1,11 +1,11 @@ import { inspectorOptions } from '../shared-config'; export var PoolShapeTypes; -(function (PoolShapeTypes) { - PoolShapeTypes["HORIZONTAL_POOL"] = "pool.HorizontalPool"; - PoolShapeTypes["VERTICAL_POOL"] = "pool.VerticalPool"; - PoolShapeTypes["HORIZONTAL_SWIMLANE"] = "pool.HorizontalSwimlane"; - PoolShapeTypes["VERTICAL_SWIMLANE"] = "pool.VerticalSwimlane"; +(function(PoolShapeTypes) { + PoolShapeTypes['HORIZONTAL_POOL'] = 'pool.HorizontalPool'; + PoolShapeTypes['VERTICAL_POOL'] = 'pool.VerticalPool'; + PoolShapeTypes['HORIZONTAL_SWIMLANE'] = 'pool.HorizontalSwimlane'; + PoolShapeTypes['VERTICAL_SWIMLANE'] = 'pool.VerticalSwimlane'; })(PoolShapeTypes || (PoolShapeTypes = {})); export const LANE_CONTENT_MARGIN = 20; diff --git a/bpmn-camunda-integration/js/modeler/src/shapes/pool/pool-shapes.js b/bpmn-camunda-integration/js/modeler/src/shapes/pool/pool-shapes.js index 27f7b615..99be336f 100644 --- a/bpmn-camunda-integration/js/modeler/src/shapes/pool/pool-shapes.js +++ b/bpmn-camunda-integration/js/modeler/src/shapes/pool/pool-shapes.js @@ -51,15 +51,15 @@ export class HorizontalPool extends shapes.bpmn2.HeaderedHorizontalPool { defaults() { return util.defaultsDeep(Object.assign({ shapeType: ShapeTypes.POOL, type: PoolShapeTypes.HORIZONTAL_POOL, size: DEFAULT_HORIZONTAL_POOL_SIZE, attrs: { - root: { - highlighterSelector: 'body', - magnetSelector: 'body' - }, - header: { - fill: '#FFFFFF' - }, - headerText: Object.assign(Object.assign({}, defaultAttrs.shapeLabel), { text: 'Pool', fontSize: 14 }), - }, padding: HORIZONTAL_POOL_PADDING }, poolAttributes), super.defaults); + root: { + highlighterSelector: 'body', + magnetSelector: 'body' + }, + header: { + fill: '#FFFFFF' + }, + headerText: Object.assign(Object.assign({}, defaultAttrs.shapeLabel), { text: 'Pool', fontSize: 14 }), + }, padding: HORIZONTAL_POOL_PADDING }, poolAttributes), super.defaults); } // Not used @@ -133,15 +133,15 @@ export class VerticalPool extends shapes.bpmn2.HeaderedVerticalPool { defaults() { return util.defaultsDeep(Object.assign({ shapeType: ShapeTypes.POOL, type: PoolShapeTypes.VERTICAL_POOL, size: DEFAULT_VERTICAL_POOL_SIZE, attrs: { - root: { - highlighterSelector: 'body', - magnetSelector: 'body' - }, - header: { - fill: '#FFFFFF' - }, - headerText: Object.assign(Object.assign({}, defaultAttrs.shapeLabel), { text: 'Pool', fontSize: 14 }), - }, padding: VERTICAL_POOL_PADDING }, poolAttributes), super.defaults); + root: { + highlighterSelector: 'body', + magnetSelector: 'body' + }, + header: { + fill: '#FFFFFF' + }, + headerText: Object.assign(Object.assign({}, defaultAttrs.shapeLabel), { text: 'Pool', fontSize: 14 }), + }, padding: VERTICAL_POOL_PADDING }, poolAttributes), super.defaults); } // Not used @@ -216,16 +216,16 @@ export class HorizontalSwimlane extends shapes.bpmn2.HorizontalSwimlane { defaults() { return util.defaultsDeep(Object.assign({ shapeType: ShapeTypes.SWIMLANE, type: PoolShapeTypes.HORIZONTAL_SWIMLANE, size: { - width: SWIMLANE_HEADER_SIZE - }, attrs: { - root: { - highlighterSelector: 'body' - }, - header: { - fill: 'transparent' - }, - headerText: Object.assign(Object.assign({}, defaultAttrs.shapeLabel), { text: 'Lane' }) - } }, swimlaneAttributes), super.defaults); + width: SWIMLANE_HEADER_SIZE + }, attrs: { + root: { + highlighterSelector: 'body' + }, + header: { + fill: 'transparent' + }, + headerText: Object.assign(Object.assign({}, defaultAttrs.shapeLabel), { text: 'Lane' }) + }}, swimlaneAttributes), super.defaults); } // Not used @@ -286,16 +286,16 @@ export class VerticalSwimlane extends shapes.bpmn2.VerticalSwimlane { defaults() { return util.defaultsDeep(Object.assign({ shapeType: ShapeTypes.SWIMLANE, type: PoolShapeTypes.VERTICAL_SWIMLANE, size: { - height: SWIMLANE_HEADER_SIZE - }, attrs: { - root: { - highlighterSelector: 'body' - }, - header: { - fill: 'transparent' - }, - headerText: Object.assign(Object.assign({}, defaultAttrs.shapeLabel), { text: 'Lane' }) - } }, swimlaneAttributes), super.defaults); + height: SWIMLANE_HEADER_SIZE + }, attrs: { + root: { + highlighterSelector: 'body' + }, + header: { + fill: 'transparent' + }, + headerText: Object.assign(Object.assign({}, defaultAttrs.shapeLabel), { text: 'Lane' }) + }}, swimlaneAttributes), super.defaults); } // Not used diff --git a/bpmn-camunda-integration/js/modeler/src/shapes/shapes-typing.js b/bpmn-camunda-integration/js/modeler/src/shapes/shapes-typing.js index f47512d6..f193e32b 100644 --- a/bpmn-camunda-integration/js/modeler/src/shapes/shapes-typing.js +++ b/bpmn-camunda-integration/js/modeler/src/shapes/shapes-typing.js @@ -1,26 +1,26 @@ export var MarkerNames; -(function (MarkerNames) { - MarkerNames["PARALLEL"] = "parallel"; - MarkerNames["SEQUENTIAL"] = "sequential"; - MarkerNames["SUB_PROCESS"] = "sub-process"; - MarkerNames["COMPENSATION"] = "compensation"; - MarkerNames["AD_HOC"] = "ad-hoc"; - MarkerNames["LOOP"] = "loop"; - MarkerNames["COLLECTION"] = "collection"; +(function(MarkerNames) { + MarkerNames['PARALLEL'] = 'parallel'; + MarkerNames['SEQUENTIAL'] = 'sequential'; + MarkerNames['SUB_PROCESS'] = 'sub-process'; + MarkerNames['COMPENSATION'] = 'compensation'; + MarkerNames['AD_HOC'] = 'ad-hoc'; + MarkerNames['LOOP'] = 'loop'; + MarkerNames['COLLECTION'] = 'collection'; })(MarkerNames || (MarkerNames = {})); export var ShapeTypes; -(function (ShapeTypes) { - ShapeTypes["ACTIVITY"] = "activity"; - ShapeTypes["DATA_OBJECT"] = "dataObject"; - ShapeTypes["DATA_STORE"] = "dataStore"; - ShapeTypes["DATA_ASSOCIATION"] = "dataAssociation"; - ShapeTypes["EVENT"] = "event"; - ShapeTypes["GATEWAY"] = "gateway"; - ShapeTypes["FLOW"] = "flow"; - ShapeTypes["ANNOTATION"] = "annotation"; - ShapeTypes["GROUP"] = "group"; - ShapeTypes["POOL"] = "pool"; - ShapeTypes["SWIMLANE"] = "swimlane"; +(function(ShapeTypes) { + ShapeTypes['ACTIVITY'] = 'activity'; + ShapeTypes['DATA_OBJECT'] = 'dataObject'; + ShapeTypes['DATA_STORE'] = 'dataStore'; + ShapeTypes['DATA_ASSOCIATION'] = 'dataAssociation'; + ShapeTypes['EVENT'] = 'event'; + ShapeTypes['GATEWAY'] = 'gateway'; + ShapeTypes['FLOW'] = 'flow'; + ShapeTypes['ANNOTATION'] = 'annotation'; + ShapeTypes['GROUP'] = 'group'; + ShapeTypes['POOL'] = 'pool'; + ShapeTypes['SWIMLANE'] = 'swimlane'; })(ShapeTypes || (ShapeTypes = {})); diff --git a/bpmn-camunda-integration/js/server.js b/bpmn-camunda-integration/js/server.js index 893b3d8e..bb585852 100644 --- a/bpmn-camunda-integration/js/server.js +++ b/bpmn-camunda-integration/js/server.js @@ -1,6 +1,6 @@ -import express from "express"; -import multer from "multer"; -import { ZBClient } from "@camunda8/zeebe"; +import express from 'express'; +import multer from 'multer'; +import { ZBClient } from '@camunda8/zeebe'; import * as fs from 'fs'; const app = express(); @@ -8,313 +8,314 @@ app.use(express.json()); // Enable CORS for modeler running on port 8080 app.use((req, res, next) => { - res.header('Access-Control-Allow-Origin', 'http://localhost:8080'); - res.header('Access-Control-Allow-Methods', 'GET, POST, OPTIONS'); - res.header('Access-Control-Allow-Headers', 'Content-Type'); - if (req.method === 'OPTIONS') { - return res.sendStatus(200); - } - next(); + res.header('Access-Control-Allow-Origin', 'http://localhost:8080'); + res.header('Access-Control-Allow-Methods', 'GET, POST, OPTIONS'); + res.header('Access-Control-Allow-Headers', 'Content-Type'); + if (req.method === 'OPTIONS') { + return res.sendStatus(200); + } + next(); }); const upload = multer({ storage: multer.memoryStorage() }); // Zeebe connection configuration needed when running Camunda full version. const connectionConfig = { - useTLS: false, - oAuth: { - url: "http://localhost:18080/auth/realms/camunda-platform/protocol/openid-connect/token", - audience: "orchestration-api", - clientId: "orchestration", - clientSecret: "secret", - } + useTLS: false, + oAuth: { + url: 'http://localhost:18080/auth/realms/camunda-platform/protocol/openid-connect/token', + audience: 'orchestration-api', + clientId: 'orchestration', + clientSecret: 'secret', + } }; // Zeebe gRPC client (job workers, etc.) -const zb = new ZBClient("localhost:26500", connectionConfig); +const zb = new ZBClient('localhost:26500', connectionConfig); // Orchestration Cluster REST API (for query operations not available in gRPC) -const ORCH_REST_BASE = "http://localhost:8088/v2"; -const OAUTH_URL = "http://localhost:18080/auth/realms/camunda-platform/protocol/openid-connect/token"; +const ORCH_REST_BASE = 'http://localhost:8088/v2'; +const OAUTH_URL = 'http://localhost:18080/auth/realms/camunda-platform/protocol/openid-connect/token'; let cachedToken = null; let tokenExpiry = null; async function getOAuthToken() { - // Return cached token if still valid - if (cachedToken && tokenExpiry && Date.now() < tokenExpiry) { + // Return cached token if still valid + if (cachedToken && tokenExpiry && Date.now() < tokenExpiry) { + return cachedToken; + } + + const params = new URLSearchParams({ + grant_type: 'client_credentials', + client_id: connectionConfig.oAuth.clientId, + client_secret: connectionConfig.oAuth.clientSecret, + audience: connectionConfig.oAuth.audience, + }); + + const res = await fetch(OAUTH_URL, { + method: 'POST', + headers: { 'Content-Type': 'application/x-www-form-urlencoded' }, + body: params, + }); + + if (!res.ok) { + const text = await res.text(); + throw new Error(`OAuth failed: ${res.status} ${res.statusText}: ${text}`); + } + + const data = await res.json(); + cachedToken = data.access_token; + // Set expiry to 90% of actual expiry to refresh before it expires + tokenExpiry = Date.now() + (data.expires_in * 900); return cachedToken; - } - - const params = new URLSearchParams({ - grant_type: "client_credentials", - client_id: connectionConfig.oAuth.clientId, - client_secret: connectionConfig.oAuth.clientSecret, - audience: connectionConfig.oAuth.audience, - }); - - const res = await fetch(OAUTH_URL, { - method: "POST", - headers: { "Content-Type": "application/x-www-form-urlencoded" }, - body: params, - }); - - if (!res.ok) { - const text = await res.text(); - throw new Error(`OAuth failed: ${res.status} ${res.statusText}: ${text}`); - } - - const data = await res.json(); - cachedToken = data.access_token; - // Set expiry to 90% of actual expiry to refresh before it expires - tokenExpiry = Date.now() + (data.expires_in * 900); - return cachedToken; } async function orchFetch(path, options = {}) { - const token = await getOAuthToken(); - - const res = await fetch(`${ORCH_REST_BASE}${path}`, { - ...options, - headers: { - "content-type": "application/json", - "authorization": `Bearer ${token}`, - ...(options.headers || {}), - }, - }); - if (!res.ok) { - const text = await res.text(); - throw new Error(`HTTP ${res.status} ${res.statusText}: ${text}`); - } - return res.json(); + const token = await getOAuthToken(); + + const res = await fetch(`${ORCH_REST_BASE}${path}`, { + ...options, + headers: { + 'content-type': 'application/json', + 'authorization': `Bearer ${token}`, + ...(options.headers || {}), + }, + }); + if (!res.ok) { + const text = await res.text(); + throw new Error(`HTTP ${res.status} ${res.statusText}: ${text}`); + } + return res.json(); } /** * Deploy BPMN via Zeebe client */ -app.post("/api/deploy", upload.single("bpmn"), async (req, res) => { - try { - if (!req.file) throw new Error("Missing multipart file field: bpmn"); - - const result = await zb.deployResource({ - name: req.file.originalname || "process.bpmn", - process: req.file.buffer - }); - console.log("Deployment result:", result); - res.json(result); - - } catch (e) { - res.status(500).json({ error: e.message }); - } +app.post('/api/deploy', upload.single('bpmn'), async(req, res) => { + try { + if (!req.file) throw new Error('Missing multipart file field: bpmn'); + + const result = await zb.deployResource({ + name: req.file.originalname || 'process.bpmn', + process: req.file.buffer + }); + console.log('Deployment result:', result); + res.json(result); + + } catch (e) { + res.status(500).json({ error: e.message }); + } }); /** * Start an instance via Zeebe client */ -app.post("/api/start", async (req, res) => { - try { - const { - processDefinitionKey, - bpmnProcessId, - version = -1, - variables = {}, - } = req.body; - - console.log("Start request:", { processDefinitionKey, bpmnProcessId, version, variables }); - - if (!processDefinitionKey && !bpmnProcessId) { - throw new Error("Provide either processDefinitionKey OR bpmnProcessId"); - } - - let result; - if (bpmnProcessId) { - console.log("Creating instance with bpmnProcessId:", bpmnProcessId, "version:", version); - - result = await zb.createProcessInstance({ - bpmnProcessId: bpmnProcessId, - version: version, - variables: variables, - }); - } else if (processDefinitionKey) { - console.log("Creating instance with processDefinitionKey:", processDefinitionKey); - - result = await zb.createProcessInstance({ - processDefinitionKey: processDefinitionKey, - variables: variables, - }); - } else { - throw new Error("Must provide either bpmnProcessId or processDefinitionKey"); +app.post('/api/start', async(req, res) => { + try { + const { + processDefinitionKey, + bpmnProcessId, + version = -1, + variables = {}, + } = req.body; + + console.log('Start request:', { processDefinitionKey, bpmnProcessId, version, variables }); + + if (!processDefinitionKey && !bpmnProcessId) { + throw new Error('Provide either processDefinitionKey OR bpmnProcessId'); + } + + let result; + if (bpmnProcessId) { + console.log('Creating instance with bpmnProcessId:', bpmnProcessId, 'version:', version); + + result = await zb.createProcessInstance({ + bpmnProcessId: bpmnProcessId, + version: version, + variables: variables, + }); + } else if (processDefinitionKey) { + console.log('Creating instance with processDefinitionKey:', processDefinitionKey); + + result = await zb.createProcessInstance({ + processDefinitionKey: processDefinitionKey, + variables: variables, + }); + } else { + throw new Error('Must provide either bpmnProcessId or processDefinitionKey'); + } + + console.log('Process instance created:', result); + res.json(result); + } catch (e) { + console.warn('Error starting process:', e); + res.status(500).json({ error: e.message }); } - - console.log("Process instance created:", result); - res.json(result); - } catch (e) { - console.error("Error starting process:", e); - res.status(500).json({ error: e.message }); - } }); /** * List deployed processes via authenticated REST API */ -app.get("/api/processes", async (req, res) => { - try { - const result = await orchFetch("/process-definitions/search", { - method: "POST", - body: JSON.stringify({ - page: { from: 0, limit: 100 }, - sort: [{ field: "version", order: "desc" }], - }), - }); - console.log("Loaded deployed processes:", result?.items.length); - res.json(result); - } catch (e) { - res.status(500).json({ error: e.message }); - } +app.get('/api/processes', async(req, res) => { + try { + const result = await orchFetch('/process-definitions/search', { + method: 'POST', + body: JSON.stringify({ + page: { from: 0, limit: 100 }, + sort: [{ field: 'version', order: 'desc' }], + }), + }); + console.log('Loaded deployed processes:', result?.items.length); + res.json(result); + } catch (e) { + res.status(500).json({ error: e.message }); + } }); /** * Get process definition XML via authenticated REST API */ -app.get("/api/process-xml/:key", async (req, res) => { - try { - const key = req.params.key; - console.log("Fetching BPMN XML for process definition key:", key); - - const token = await getOAuthToken(); - - // Try the base endpoint first - const response = await fetch(`${ORCH_REST_BASE}/process-definitions/${key}`, { - method: "GET", - headers: { - "authorization": `Bearer ${token}`, - "accept": "application/json" - }, - }); - - console.log("Response status:", response.status); - console.log("Response content-type:", response.headers.get("content-type")); - - if (!response.ok) { - const text = await response.text(); - console.error("Error response:", text); - throw new Error(`HTTP ${response.status}: ${text}`); - } - - const result = await response.json(); - - // Check if bpmnXml is in the response - if (result.bpmnXml) { - console.log("Found bpmnXml field, length:", result.bpmnXml.length); - res.json({ bpmnXml: result.bpmnXml }); - } else { - console.log("No bpmnXml field, trying /xml endpoint"); - - // Try the /xml endpoint - const xmlResponse = await fetch(`${ORCH_REST_BASE}/process-definitions/${key}/xml`, { - method: "GET", - headers: { - "authorization": `Bearer ${token}`, - }, - }); - - if (!xmlResponse.ok) { - throw new Error(`Failed to fetch XML: ${xmlResponse.status}`); - } - - const contentType = xmlResponse.headers.get("content-type") || ""; - - if (contentType.includes("json")) { - const xmlResult = await xmlResponse.json(); - res.json({ bpmnXml: xmlResult.bpmnXml || xmlResult }); - } else { - const xmlText = await xmlResponse.text(); - res.json({ bpmnXml: xmlText }); - } +app.get('/api/process-xml/:key', async(req, res) => { + try { + const key = req.params.key; + console.log('Fetching BPMN XML for process definition key:', key); + + const token = await getOAuthToken(); + + // Try the base endpoint first + const response = await fetch(`${ORCH_REST_BASE}/process-definitions/${key}`, { + method: 'GET', + headers: { + 'authorization': `Bearer ${token}`, + 'accept': 'application/json' + }, + }); + + console.log('Response status:', response.status); + console.log('Response content-type:', response.headers.get('content-type')); + + if (!response.ok) { + const text = await response.text(); + console.warn('Error response:', text); + throw new Error(`HTTP ${response.status}: ${text}`); + } + + const result = await response.json(); + + // Check if bpmnXml is in the response + if (result.bpmnXml) { + console.log('Found bpmnXml field, length:', result.bpmnXml.length); + res.json({ bpmnXml: result.bpmnXml }); + } else { + console.log('No bpmnXml field, trying /xml endpoint'); + + // Try the /xml endpoint + const xmlResponse = await fetch(`${ORCH_REST_BASE}/process-definitions/${key}/xml`, { + method: 'GET', + headers: { + 'authorization': `Bearer ${token}`, + }, + }); + + if (!xmlResponse.ok) { + throw new Error(`Failed to fetch XML: ${xmlResponse.status}`); + } + + const contentType = xmlResponse.headers.get('content-type') || ''; + + if (contentType.includes('json')) { + const xmlResult = await xmlResponse.json(); + res.json({ bpmnXml: xmlResult.bpmnXml || xmlResult }); + } else { + const xmlText = await xmlResponse.text(); + res.json({ bpmnXml: xmlText }); + } + } + } catch (e) { + console.warn('Error fetching process XML:', e); + res.status(500).json({ error: e.message }); } - } catch (e) { - console.error("Error fetching process XML:", e); - res.status(500).json({ error: e.message }); - } }); /** * Get instance status via authenticated REST API * Query operations are not available in Zeebe gRPC client */ -app.get("/api/status/:key", async (req, res) => { - try { - const key = req.params.key; - - const instance = await orchFetch(`/process-instances/${key}`); // [oai_citation:6‡docs.camunda.io](https://docs.camunda.io/docs/apis-tools/orchestration-cluster-api-rest/specifications/get-process-instance/?utm_source=chatgpt.com) - const stats = await orchFetch( - `/process-instances/${key}/statistics/element-instances` - ); // [oai_citation:7‡docs.camunda.io](https://docs.camunda.io/docs/apis-tools/orchestration-cluster-api-rest/specifications/get-process-instance-statistics/?utm_source=chatgpt.com) - - res.json({ instance, stats }); - } catch (e) { - res.status(500).json({ error: e.message }); - } +app.get('/api/status/:key', async(req, res) => { + try { + const key = req.params.key; + + const instance = await orchFetch(`/process-instances/${key}`); // [oai_citation:6‡docs.camunda.io](https://docs.camunda.io/docs/apis-tools/orchestration-cluster-api-rest/specifications/get-process-instance/?utm_source=chatgpt.com) + const stats = await orchFetch( + `/process-instances/${key}/statistics/element-instances` + ); // [oai_citation:7‡docs.camunda.io](https://docs.camunda.io/docs/apis-tools/orchestration-cluster-api-rest/specifications/get-process-instance-statistics/?utm_source=chatgpt.com) + + res.json({ instance, stats }); + } catch (e) { + console.warn('Error fetching instance status:', e); + res.status(500).json({ error: e.message }); + } }); /** * List process instances via authenticated REST API * Query operations are not available in Zeebe gRPC client */ -app.get("/api/instances", async (req, res) => { - try { - const result = await orchFetch("/process-instances/search", { - method: "POST", - body: JSON.stringify({ - page: { from: 0, limit: 100 }, - sort: [{ field: "startDate", order: "desc" }], - }), - }); - console.log("Loaded process instances:", result?.items.length); - res.json(result); - } catch (e) { - res.status(500).json({ error: e.message }); - } +app.get('/api/instances', async(req, res) => { + try { + const result = await orchFetch('/process-instances/search', { + method: 'POST', + body: JSON.stringify({ + page: { from: 0, limit: 100 }, + sort: [{ field: 'startDate', order: 'desc' }], + }), + }); + console.log('Loaded process instances:', result?.items.length); + res.json(result); + } catch (e) { + res.status(500).json({ error: e.message }); + } }); zb.createWorker({ - taskType: "log.console", - taskHandler: async (job) => { - const input = job.variables; // variables from start/deploy - console.log("Worker log.console got job", job.key, "vars:", input); - return job.complete({ - variables: { - ...input, - handledBy: "node-worker", - handledAt: new Date().toISOString(), - }, - }); - }, + taskType: 'log.console', + taskHandler: async(job) => { + const input = job.variables; // variables from start/deploy + console.log('Worker log.console got job', job.key, 'vars:', input); + return job.complete({ + variables: { + ...input, + handledBy: 'node-worker', + handledAt: new Date().toISOString(), + }, + }); + }, }); zb.createWorker({ - taskType: "write.file", - taskHandler: async (job) => { - const input = job.variables; // variables from start/deploy - console.log("Worker write.file got job", job.key); - console.log("Writing file:", input.filename); - fs.writeFileSync(input.filename, input.content, "utf-8"); - return job.complete({ - variables: { - ...input, - handledBy: "node-worker", - handledAt: new Date().toISOString(), - }, - }); - }, + taskType: 'write.file', + taskHandler: async(job) => { + const input = job.variables; // variables from start/deploy + console.log('Worker write.file got job', job.key); + console.log('Writing file:', input.filename); + fs.writeFileSync(input.filename, input.content, 'utf-8'); + return job.complete({ + variables: { + ...input, + handledBy: 'node-worker', + handledAt: new Date().toISOString(), + }, + }); + }, }); app.listen(3000, () => { - console.log("Node middle-layer listening on http://localhost:3000"); - console.log("Deploy BPMN: POST /api/deploy (multipart field: bpmn)"); - console.log("Processes: GET /api/processes"); - console.log("Process XML: GET /api/process-xml/:processDefinitionKey"); - console.log('Start: POST /api/start {"bpmnProcessId":"jointjs_demo"}'); - console.log("Status: GET /api/status/:processInstanceKey"); - console.log("Instances: GET /api/instances"); -}); \ No newline at end of file + console.log('Node middle-layer listening on http://localhost:3000'); + console.log('Deploy BPMN: POST /api/deploy (multipart field: bpmn)'); + console.log('Processes: GET /api/processes'); + console.log('Process XML: GET /api/process-xml/:processDefinitionKey'); + console.log('Start: POST /api/start {"bpmnProcessId":"jointjs_demo"}'); + console.log('Status: GET /api/status/:processInstanceKey'); + console.log('Instances: GET /api/instances'); +}); diff --git a/bpmn-editor/js/src/configs/font-style-sheet.js b/bpmn-editor/js/src/configs/font-style-sheet.js index 4657ec8a..0aa72d3e 100644 --- a/bpmn-editor/js/src/configs/font-style-sheet.js +++ b/bpmn-editor/js/src/configs/font-style-sheet.js @@ -13,7 +13,7 @@ function base64convert(file) { }); } -export const fontsStyleSheet = async () => { +export const fontsStyleSheet = async() => { const openSans = await fetch(OPEN_SANS_URL); const openSansBase64 = await base64convert(await openSans.blob()); diff --git a/bpmn-editor/js/src/configs/halo-config.js b/bpmn-editor/js/src/configs/halo-config.js index 171f73ac..34f13240 100644 --- a/bpmn-editor/js/src/configs/halo-config.js +++ b/bpmn-editor/js/src/configs/halo-config.js @@ -48,7 +48,7 @@ export const groups = { }; const removeSwimlaneEvents = { - 'pointerup': function (_evt, _x, _y) { + 'pointerup': function(_evt, _x, _y) { const element = this.options.cellView.model; const pool = element.getParentCell(); pool.removeSwimlane(element); diff --git a/bpmn-editor/js/src/configs/stencil-config.js b/bpmn-editor/js/src/configs/stencil-config.js index 69715fca..64d0513d 100644 --- a/bpmn-editor/js/src/configs/stencil-config.js +++ b/bpmn-editor/js/src/configs/stencil-config.js @@ -7,8 +7,8 @@ import { GroupShapeTypes } from '../shapes/group/group-config'; import { PoolShapeTypes } from '../shapes/pool/pool-config'; export var StencilShapeTypes; -(function (StencilShapeTypes) { - StencilShapeTypes["STENCIL_SHAPE"] = "stencil.Shape"; +(function(StencilShapeTypes) { + StencilShapeTypes['STENCIL_SHAPE'] = 'stencil.Shape'; })(StencilShapeTypes || (StencilShapeTypes = {})); const SHAPE_SIZE = 32; @@ -38,9 +38,9 @@ class StencilShape extends dia.Element { } markup = [{ - tagName: 'text', - selector: 'icon' - }]; + tagName: 'text', + selector: 'icon' + }]; static create(type) { const config = stencilShapesConfig[type]; diff --git a/bpmn-editor/js/src/controllers/stencil-controller.js b/bpmn-editor/js/src/controllers/stencil-controller.js index 9a29b5e5..778ddbc6 100644 --- a/bpmn-editor/js/src/controllers/stencil-controller.js +++ b/bpmn-editor/js/src/controllers/stencil-controller.js @@ -62,7 +62,7 @@ export default class StencilController extends Controller { }, 'element:drop': (context, elementView, evt, x, y) => { const { paper, selection } = context; - let { model } = elementView; + const { model } = elementView; let selectedModel; diff --git a/bpmn-editor/js/src/controllers/toolbar-actions-controller.js b/bpmn-editor/js/src/controllers/toolbar-actions-controller.js index 6fbf5e72..0c163a46 100644 --- a/bpmn-editor/js/src/controllers/toolbar-actions-controller.js +++ b/bpmn-editor/js/src/controllers/toolbar-actions-controller.js @@ -127,7 +127,7 @@ function loadFromJSON(context) { input.click(); - input.onchange = async () => { + input.onchange = async() => { const file = input.files?.[0]; @@ -151,7 +151,7 @@ function loadFromXML(context) { input.click(); - input.onchange = async () => { + input.onchange = async() => { const file = input.files?.[0]; diff --git a/bpmn-editor/js/src/effects/swimlane-preview.js b/bpmn-editor/js/src/effects/swimlane-preview.js index 41b67a4e..9f403ae6 100644 --- a/bpmn-editor/js/src/effects/swimlane-preview.js +++ b/bpmn-editor/js/src/effects/swimlane-preview.js @@ -31,7 +31,7 @@ export const SwimlanePreview = dia.HighlighterView.extend({ if (horizontal) { let y = 0; - let x = poolPadding.left; + const x = poolPadding.left; if (!swimlane) { y = poolBBox.height - paddingBottom; } @@ -46,7 +46,7 @@ export const SwimlanePreview = dia.HighlighterView.extend({ } else { let x = 0; - let y = poolPadding.top; + const y = poolPadding.top; if (!swimlane) { x = poolBBox.width - paddingRight; } diff --git a/bpmn-editor/js/src/event-bus.js b/bpmn-editor/js/src/event-bus.js index df8dcd65..9e9e0940 100644 --- a/bpmn-editor/js/src/event-bus.js +++ b/bpmn-editor/js/src/event-bus.js @@ -3,6 +3,6 @@ import { mvc } from '@joint/plus'; export const eventBus = Object.assign({}, mvc.Events); export var EventBusEvents; -(function (EventBusEvents) { - EventBusEvents["GRAPH_REPLACE_CELL"] = "graph-change-cell"; +(function(EventBusEvents) { + EventBusEvents['GRAPH_REPLACE_CELL'] = 'graph-change-cell'; })(EventBusEvents || (EventBusEvents = {})); diff --git a/bpmn-editor/js/src/events/pools.js b/bpmn-editor/js/src/events/pools.js index 2493100f..90cebc20 100644 --- a/bpmn-editor/js/src/events/pools.js +++ b/bpmn-editor/js/src/events/pools.js @@ -36,7 +36,7 @@ export function onPoolDragStart(paper, poolView, evt, _x, _y) { const { clientX, clientY } = evt; // Local center of the pool - let { x, y } = paper.clientToLocalPoint(clientX, clientY); + const { x, y } = paper.clientToLocalPoint(clientX, clientY); node.setAttribute('transform', `translate(${x - poolDimensions.width / 2}, ${y - poolDimensions.height / 2})`); const frontLayer = paper.layers.querySelector('g.joint-back-layer'); @@ -201,7 +201,7 @@ function constructPoolPreview(pool, poolDimensions) { const poolHeaderSize = pool.getHeaderSize(); const { width, height } = poolDimensions; - let path = pool.isHorizontal() ? + const path = pool.isHorizontal() ? `M 0 0 H ${width + poolHeaderSize} V ${height} H 0 z M ${poolHeaderSize} 0 V ${height}` : `M 0 0 V ${height + poolHeaderSize} H ${width} V 0 z M 0 ${poolHeaderSize} H ${width}`; diff --git a/bpmn-editor/js/src/events/swimlanes.js b/bpmn-editor/js/src/events/swimlanes.js index 8e136d9d..6054d22d 100644 --- a/bpmn-editor/js/src/events/swimlanes.js +++ b/bpmn-editor/js/src/events/swimlanes.js @@ -56,11 +56,11 @@ export function onSwimlaneDrag(paper, elementView, evt, x, y) { const viewInArea = paper .findElementViewsAtPoint({ x, y }) .sort((a, b) => { - const bZ = b.model.get('z') ?? 0; - const aZ = a.model.get('z') ?? 0; + const bZ = b.model.get('z') ?? 0; + const aZ = a.model.get('z') ?? 0; - return bZ - aZ; - }); + return bZ - aZ; + }); // Find the `poolView` that is the top-most pool under the cursor. const poolView = viewInArea.find((view) => shapes.bpmn2.CompositePool.isPool(view.model)); diff --git a/bpmn-editor/js/src/import/index.js b/bpmn-editor/js/src/import/index.js index 958e2b37..4297de25 100644 --- a/bpmn-editor/js/src/import/index.js +++ b/bpmn-editor/js/src/import/index.js @@ -9,24 +9,24 @@ export class XMLFileImporter { this.paperScroller = paperScroller; this.commandManager = commandManager; } - + canHandle(file) { const extension = file.name.split('.').pop()?.toLowerCase(); return extension === 'xml' || extension === 'bpmn'; } - + async import(file, _graph) { const xmlString = await file.text(); const parser = new DOMParser(); const xml = parser.parseFromString(xmlString, 'application/xml'); - + const { cells, errors } = fromBPMN(xml, bpmnImportOptions); - + if (errors.length > 0) { - console.error(errors); + console.warn(errors); return; } - + // Use the utility function to import the graph with proper cell handling importBPMN(this.paperScroller, this.commandManager, cells); } @@ -37,18 +37,18 @@ export class JSONFileImporter { constructor(paperScroller) { this.paperScroller = paperScroller; } - + canHandle(file) { const extension = file.name.split('.').pop()?.toLowerCase(); return extension === 'json'; } - + async import(file, graph) { const jsonString = await file.text(); - + // Import from JSON graph.fromJSON(JSON.parse(jsonString)); - + // Center content if paper scroller is available this.paperScroller.centerContent({ useModelGeometry: true }); } @@ -56,23 +56,23 @@ export class JSONFileImporter { class CompositeFileImporter { importers = []; - + constructor(paperScroller, commandManager) { this.importers.push(new XMLFileImporter(paperScroller, commandManager)); this.importers.push(new JSONFileImporter(paperScroller)); } - + canHandle(file) { return this.importers.some(importer => importer.canHandle(file)); } - + async import(file, graph) { const importer = this.importers.find(importer => importer.canHandle(file)); if (importer) { await importer.import(file, graph); } else { - console.error('No importer found for file:', file.name); + console.warn('No importer found for file:', file.name); } } } @@ -82,13 +82,13 @@ export function setupFileImport(paperScroller, commandManager) { const controller = new AbortController(); const overlayEl = paperScroller.el.parentElement?.querySelector('.file-import-overlay'); const { signal } = controller; - + function dropHandler(evt) { overlayEl.classList.remove('active'); paperScroller.unlock(); // Prevent default behavior (Prevent file from being opened) evt.preventDefault(); - + let file; if (evt.dataTransfer?.items) { // Use DataTransferItemList interface to access the file(s) @@ -101,35 +101,35 @@ export function setupFileImport(paperScroller, commandManager) { // Use DataTransfer interface to access the file(s) file = evt.dataTransfer.files[0]; } - + if (!file) return; - + if (fileImporter.canHandle(file)) { fileImporter.import(file, paperScroller.options.paper.model); } else { - console.error('Unsupported file type:', file.name); + console.warn('Unsupported file type:', file.name); } } - + function dragOverHandler(evt) { overlayEl.classList.add('active'); // Prevent default behavior (Prevent file from being opened) evt.preventDefault(); paperScroller.lock(); } - + function dragLeaveHandler() { overlayEl.classList.remove('active'); paperScroller.unlock(); } - + // Add event listeners with the AbortSignal paperScroller.el.addEventListener('drop', dropHandler, { signal }); paperScroller.el.addEventListener('dragover', dragOverHandler, { signal }); paperScroller.el.addEventListener('dragleave', dragLeaveHandler, { signal }); - + // Return a cleanup function that aborts the controller return () => controller.abort(); } diff --git a/bpmn-editor/js/src/services/inspector-service.js b/bpmn-editor/js/src/services/inspector-service.js index 7399f517..58a3bfc2 100644 --- a/bpmn-editor/js/src/services/inspector-service.js +++ b/bpmn-editor/js/src/services/inspector-service.js @@ -5,9 +5,9 @@ import { eventBus, EventBusEvents } from '../event-bus'; const INSPECTOR_EMPTY = document.createElement('div'); var InspectorView; -(function (InspectorView) { - InspectorView["CONTENT"] = "CONTENT"; - InspectorView["APPEARANCE"] = "APPEARANCE"; +(function(InspectorView) { + InspectorView['CONTENT'] = 'CONTENT'; + InspectorView['APPEARANCE'] = 'APPEARANCE'; })(InspectorView || (InspectorView = {})); export default class InspectorService { diff --git a/bpmn-editor/js/src/services/main-service.js b/bpmn-editor/js/src/services/main-service.js index f391c413..046b6539 100644 --- a/bpmn-editor/js/src/services/main-service.js +++ b/bpmn-editor/js/src/services/main-service.js @@ -51,7 +51,7 @@ export default class MainService { markAvailable: true, clickThreshold: 10, labelsLayer: true, - interactive: function (view) { + interactive: function(view) { const { model } = view; // Prevent swimlane move to pool/show ghost const isSwimlane = shapes.bpmn2.Swimlane.isSwimlane(model); @@ -115,7 +115,7 @@ export default class MainService { return bbox.leftMiddle(); } }, - connectionStrategy: function (end, view, _, coords) { + connectionStrategy: function(end, view, _, coords) { const { model } = view; diff --git a/bpmn-editor/js/src/services/navigator-service.js b/bpmn-editor/js/src/services/navigator-service.js index 41778d54..5eb044cc 100644 --- a/bpmn-editor/js/src/services/navigator-service.js +++ b/bpmn-editor/js/src/services/navigator-service.js @@ -5,7 +5,7 @@ import NavigatorController from '../controllers/navigator-controller'; const baseUrl = 'assets/navigator'; const IconButton = ui.widgets.button.extend({ - render: function () { + render: function() { const size = this.options.size || 20; const imageEl = document.createElement('img'); imageEl.style.width = `${size}px`; @@ -15,10 +15,10 @@ const IconButton = ui.widgets.button.extend({ this.setTooltip(this.options.tooltip); return this; }, - setIcon: function (icon = '') { + setIcon: function(icon = '') { this.el.querySelector('img').src = icon; }, - setTooltip: function (tooltip = '') { + setTooltip: function(tooltip = '') { this.el.dataset.tooltip = tooltip; } }); @@ -44,7 +44,7 @@ const NavigatorElementView = dia.ElementView.extend({ }, // calls in an animation frame after a multiple changes // has been made to the model - confirmUpdate: function (flags) { + confirmUpdate: function(flags) { if (this.hasFlag(flags, UpdateFlags.Render)) this.render(); if (this.hasFlag(flags, UpdateFlags.Update)) @@ -53,12 +53,12 @@ const NavigatorElementView = dia.ElementView.extend({ if (this.hasFlag(flags, UpdateFlags.Transform)) this.updateTransformation(); }, - render: function () { + render: function() { const doc = util.parseDOMJSON(this.markup); this.body = doc.selectors.body; this.el.appendChild(doc.fragment); }, - update: function () { + update: function() { const { model, body } = this; // shape const { width, height } = model.size(); @@ -92,12 +92,12 @@ export default class NavigatorService { name: 'fit-to-screen', icon: `${baseUrl}/icon-zoom-to-fit.svg`, tooltip: 'Fit to screen', - attrs: { button: { 'data-tooltip-position': 'top' } } + attrs: { button: { 'data-tooltip-position': 'top' }} }, { type: 'icon-button', name: 'fullscreen', - attrs: { button: { 'data-tooltip-position': 'top' } } + attrs: { button: { 'data-tooltip-position': 'top' }} /* icon and tooltip are set in updateToolbarButtons() */ }, { @@ -105,14 +105,14 @@ export default class NavigatorService { min: ZOOM_SETTINGS.min * 100, max: ZOOM_SETTINGS.max * 100, step: 10, - attrs: { input: { 'data-tooltip': 'Slide to zoom', 'data-tooltip-position': 'top' } } + attrs: { input: { 'data-tooltip': 'Slide to zoom', 'data-tooltip-position': 'top' }} }, { type: 'separator' }, { type: 'icon-button', name: 'minimap', icon: `${baseUrl}/icon-minimap.svg`, - attrs: { button: { 'data-tooltip-position': 'top' } } + attrs: { button: { 'data-tooltip-position': 'top' }} } ], widgetNamespace: { diff --git a/bpmn-editor/js/src/services/stencil-service.js b/bpmn-editor/js/src/services/stencil-service.js index ecf8e363..ae6829cf 100644 --- a/bpmn-editor/js/src/services/stencil-service.js +++ b/bpmn-editor/js/src/services/stencil-service.js @@ -46,11 +46,11 @@ export default class StencilService { .getGraph() .getElements() .forEach((el) => { - StencilHoverHighlighter.add(el.findView(stencil.getPaper()), 'root', 'stencil-highlight', { - className: 'stencil-background-highlight', - padding: 4 + StencilHoverHighlighter.add(el.findView(stencil.getPaper()), 'root', 'stencil-highlight', { + className: 'stencil-background-highlight', + padding: 4 + }); }); - }); this.stencilController = new StencilController({ stencil, paper: paperScroller.options.paper, selection }); this.stencilController.startListening(); diff --git a/bpmn-editor/js/src/shapes/activity/activity-config.js b/bpmn-editor/js/src/shapes/activity/activity-config.js index a1ff6a06..6651898f 100644 --- a/bpmn-editor/js/src/shapes/activity/activity-config.js +++ b/bpmn-editor/js/src/shapes/activity/activity-config.js @@ -15,18 +15,18 @@ export const ActivityLabels = { }; export var ActivityShapeTypes; -(function (ActivityShapeTypes) { - ActivityShapeTypes["TASK"] = "activity.Task"; - ActivityShapeTypes["SEND"] = "activity.Send"; - ActivityShapeTypes["SERVICE"] = "activity.Service"; - ActivityShapeTypes["MANUAL"] = "activity.Manual"; - ActivityShapeTypes["BUSINESS_RULE"] = "activity.BusinessRule"; - ActivityShapeTypes["RECEIVE"] = "activity.Receive"; - ActivityShapeTypes["USER"] = "activity.User"; - ActivityShapeTypes["SCRIPT"] = "activity.Script"; - ActivityShapeTypes["SUB_PROCESS"] = "activity.SubProcess"; - ActivityShapeTypes["CALL_ACTIVITY"] = "activity.CallActivity"; - ActivityShapeTypes["EVENT_SUB_PROCESS"] = "activity.EventSubProcess"; +(function(ActivityShapeTypes) { + ActivityShapeTypes['TASK'] = 'activity.Task'; + ActivityShapeTypes['SEND'] = 'activity.Send'; + ActivityShapeTypes['SERVICE'] = 'activity.Service'; + ActivityShapeTypes['MANUAL'] = 'activity.Manual'; + ActivityShapeTypes['BUSINESS_RULE'] = 'activity.BusinessRule'; + ActivityShapeTypes['RECEIVE'] = 'activity.Receive'; + ActivityShapeTypes['USER'] = 'activity.User'; + ActivityShapeTypes['SCRIPT'] = 'activity.Script'; + ActivityShapeTypes['SUB_PROCESS'] = 'activity.SubProcess'; + ActivityShapeTypes['CALL_ACTIVITY'] = 'activity.CallActivity'; + ActivityShapeTypes['EVENT_SUB_PROCESS'] = 'activity.EventSubProcess'; })(ActivityShapeTypes || (ActivityShapeTypes = {})); export const activityIconClasses = { diff --git a/bpmn-editor/js/src/shapes/annotation/annotation-config.js b/bpmn-editor/js/src/shapes/annotation/annotation-config.js index 29723185..2af2cb5e 100644 --- a/bpmn-editor/js/src/shapes/annotation/annotation-config.js +++ b/bpmn-editor/js/src/shapes/annotation/annotation-config.js @@ -6,9 +6,9 @@ export const AnnotationLabels = { }; export var AnnotationShapeTypes; -(function (AnnotationShapeTypes) { - AnnotationShapeTypes["ANNOTATION"] = "annotation.Annotation"; - AnnotationShapeTypes["LINK"] = "annotation.AnnotationLink"; +(function(AnnotationShapeTypes) { + AnnotationShapeTypes['ANNOTATION'] = 'annotation.Annotation'; + AnnotationShapeTypes['LINK'] = 'annotation.AnnotationLink'; })(AnnotationShapeTypes || (AnnotationShapeTypes = {})); export const annotationIconClasses = { diff --git a/bpmn-editor/js/src/shapes/data/data-config.js b/bpmn-editor/js/src/shapes/data/data-config.js index 9e1cea54..6a24bc69 100644 --- a/bpmn-editor/js/src/shapes/data/data-config.js +++ b/bpmn-editor/js/src/shapes/data/data-config.js @@ -9,12 +9,12 @@ export const DataLabels = { }; export var DataShapeTypes; -(function (DataShapeTypes) { - DataShapeTypes["DATA_STORE"] = "data.DataStore"; - DataShapeTypes["DATA_OBJECT"] = "data.DataObject"; - DataShapeTypes["DATA_INPUT"] = "data.DataInput"; - DataShapeTypes["DATA_OUTPUT"] = "data.DataOutput"; - DataShapeTypes["DATA_ASSOCIATION"] = "data.DataAssociation"; +(function(DataShapeTypes) { + DataShapeTypes['DATA_STORE'] = 'data.DataStore'; + DataShapeTypes['DATA_OBJECT'] = 'data.DataObject'; + DataShapeTypes['DATA_INPUT'] = 'data.DataInput'; + DataShapeTypes['DATA_OUTPUT'] = 'data.DataOutput'; + DataShapeTypes['DATA_ASSOCIATION'] = 'data.DataAssociation'; })(DataShapeTypes || (DataShapeTypes = {})); export const dataIconClasses = { diff --git a/bpmn-editor/js/src/shapes/event/event-config.js b/bpmn-editor/js/src/shapes/event/event-config.js index a95f4682..521810d0 100644 --- a/bpmn-editor/js/src/shapes/event/event-config.js +++ b/bpmn-editor/js/src/shapes/event/event-config.js @@ -49,52 +49,52 @@ export const EventLabels = { }; export var EventShapeTypes; -(function (EventShapeTypes) { +(function(EventShapeTypes) { // Start - EventShapeTypes["START"] = "event.Start"; - EventShapeTypes["MESSAGE_START"] = "event.MessageStart"; - EventShapeTypes["TIMER_START"] = "event.TimerStart"; - EventShapeTypes["CONDITIONAL_START"] = "event.ConditionalStart"; - EventShapeTypes["SIGNAL_START"] = "event.SignalStart"; + EventShapeTypes['START'] = 'event.Start'; + EventShapeTypes['MESSAGE_START'] = 'event.MessageStart'; + EventShapeTypes['TIMER_START'] = 'event.TimerStart'; + EventShapeTypes['CONDITIONAL_START'] = 'event.ConditionalStart'; + EventShapeTypes['SIGNAL_START'] = 'event.SignalStart'; // Intermediate Catching - EventShapeTypes["INTERMEDIATE_CATCHING"] = "event.IntermediateCatching"; - EventShapeTypes["MESSAGE_INTERMEDIATE_CATCHING"] = "event.MessageIntermediateCatching"; - EventShapeTypes["TIMER_INTERMEDIATE_CATCHING"] = "event.TimerIntermediateCatching"; - EventShapeTypes["CONDITIONAL_INTERMEDIATE_CATCHING"] = "event.ConditionalIntermediateCatching"; - EventShapeTypes["LINK_INTERMEDIATE_CATCHING"] = "event.LinkIntermediateCatching"; - EventShapeTypes["SIGNAL_INTERMEDIATE_CATCHING"] = "event.SignalIntermediateCatching"; + EventShapeTypes['INTERMEDIATE_CATCHING'] = 'event.IntermediateCatching'; + EventShapeTypes['MESSAGE_INTERMEDIATE_CATCHING'] = 'event.MessageIntermediateCatching'; + EventShapeTypes['TIMER_INTERMEDIATE_CATCHING'] = 'event.TimerIntermediateCatching'; + EventShapeTypes['CONDITIONAL_INTERMEDIATE_CATCHING'] = 'event.ConditionalIntermediateCatching'; + EventShapeTypes['LINK_INTERMEDIATE_CATCHING'] = 'event.LinkIntermediateCatching'; + EventShapeTypes['SIGNAL_INTERMEDIATE_CATCHING'] = 'event.SignalIntermediateCatching'; // Intermediate boundary - EventShapeTypes["INTERMEDIATE_BOUNDARY"] = "event.IntermediateBoundary"; - EventShapeTypes["MESSAGE_INTERMEDIATE_BOUNDARY"] = "event.MessageIntermediateBoundary"; - EventShapeTypes["TIMER_INTERMEDIATE_BOUNDARY"] = "event.TimerIntermediateBoundary"; - EventShapeTypes["CONDITIONAL_INTERMEDIATE_BOUNDARY"] = "event.ConditionalIntermediateBoundary"; - EventShapeTypes["SIGNAL_INTERMEDIATE_BOUNDARY"] = "event.SignalIntermediateBoundary"; - EventShapeTypes["ERROR_INTERMEDIATE_BOUNDARY"] = "event.ErrorIntermediateBoundary"; - EventShapeTypes["ESCALATION_INTERMEDIATE_BOUNDARY"] = "event.EscalationIntermediateBoundary"; - EventShapeTypes["COMPENSATION_INTERMEDIATE_BOUNDARY"] = "event.CompensationIntermediateBoundary"; - EventShapeTypes["CANCEL_INTERMEDIATE_BOUNDARY"] = "event.CancelIntermediateBoundary"; + EventShapeTypes['INTERMEDIATE_BOUNDARY'] = 'event.IntermediateBoundary'; + EventShapeTypes['MESSAGE_INTERMEDIATE_BOUNDARY'] = 'event.MessageIntermediateBoundary'; + EventShapeTypes['TIMER_INTERMEDIATE_BOUNDARY'] = 'event.TimerIntermediateBoundary'; + EventShapeTypes['CONDITIONAL_INTERMEDIATE_BOUNDARY'] = 'event.ConditionalIntermediateBoundary'; + EventShapeTypes['SIGNAL_INTERMEDIATE_BOUNDARY'] = 'event.SignalIntermediateBoundary'; + EventShapeTypes['ERROR_INTERMEDIATE_BOUNDARY'] = 'event.ErrorIntermediateBoundary'; + EventShapeTypes['ESCALATION_INTERMEDIATE_BOUNDARY'] = 'event.EscalationIntermediateBoundary'; + EventShapeTypes['COMPENSATION_INTERMEDIATE_BOUNDARY'] = 'event.CompensationIntermediateBoundary'; + EventShapeTypes['CANCEL_INTERMEDIATE_BOUNDARY'] = 'event.CancelIntermediateBoundary'; // Intermediate boundary non-interrupting - EventShapeTypes["MESSAGE_INTERMEDIATE_BOUNDARY_NON_INTERRUPTING"] = "event.MessageIntermediateBoundaryNonInterrupting"; - EventShapeTypes["TIMER_INTERMEDIATE_BOUNDARY_NON_INTERRUPTING"] = "event.TimerIntermediateBoundaryNonInterrupting"; - EventShapeTypes["CONDITIONAL_INTERMEDIATE_BOUNDARY_NON_INTERRUPTING"] = "event.ConditionalIntermediateBoundaryNonInterrupting"; - EventShapeTypes["SIGNAL_INTERMEDIATE_BOUNDARY_NON_INTERRUPTING"] = "event.SignalIntermediateBoundaryNonInterrupting"; - EventShapeTypes["ESCALATION_INTERMEDIATE_BOUNDARY_NON_INTERRUPTING"] = "event.EscalationIntermediateBoundaryNonInterrupting"; + EventShapeTypes['MESSAGE_INTERMEDIATE_BOUNDARY_NON_INTERRUPTING'] = 'event.MessageIntermediateBoundaryNonInterrupting'; + EventShapeTypes['TIMER_INTERMEDIATE_BOUNDARY_NON_INTERRUPTING'] = 'event.TimerIntermediateBoundaryNonInterrupting'; + EventShapeTypes['CONDITIONAL_INTERMEDIATE_BOUNDARY_NON_INTERRUPTING'] = 'event.ConditionalIntermediateBoundaryNonInterrupting'; + EventShapeTypes['SIGNAL_INTERMEDIATE_BOUNDARY_NON_INTERRUPTING'] = 'event.SignalIntermediateBoundaryNonInterrupting'; + EventShapeTypes['ESCALATION_INTERMEDIATE_BOUNDARY_NON_INTERRUPTING'] = 'event.EscalationIntermediateBoundaryNonInterrupting'; // Intermediate throwing - EventShapeTypes["INTERMEDIATE_THROWING"] = "event.IntermediateThrowing"; - EventShapeTypes["MESSAGE_INTERMEDIATE_THROWING"] = "event.MessageIntermediateThrowing"; - EventShapeTypes["LINK_INTERMEDIATE_THROWING"] = "event.LinkIntermediateThrowing"; - EventShapeTypes["SIGNAL_INTERMEDIATE_THROWING"] = "event.SignalIntermediateThrowing"; - EventShapeTypes["ESCALATION_INTERMEDIATE_THROWING"] = "event.EscalationIntermediateThrowing"; - EventShapeTypes["COMPENSATION_INTERMEDIATE_THROWING"] = "event.CompensationIntermediateThrowing"; + EventShapeTypes['INTERMEDIATE_THROWING'] = 'event.IntermediateThrowing'; + EventShapeTypes['MESSAGE_INTERMEDIATE_THROWING'] = 'event.MessageIntermediateThrowing'; + EventShapeTypes['LINK_INTERMEDIATE_THROWING'] = 'event.LinkIntermediateThrowing'; + EventShapeTypes['SIGNAL_INTERMEDIATE_THROWING'] = 'event.SignalIntermediateThrowing'; + EventShapeTypes['ESCALATION_INTERMEDIATE_THROWING'] = 'event.EscalationIntermediateThrowing'; + EventShapeTypes['COMPENSATION_INTERMEDIATE_THROWING'] = 'event.CompensationIntermediateThrowing'; // End - EventShapeTypes["END"] = "event.End"; - EventShapeTypes["MESSAGE_END"] = "event.MessageEnd"; - EventShapeTypes["SIGNAL_END"] = "event.SignalEnd"; - EventShapeTypes["ERROR_END"] = "event.ErrorEnd"; - EventShapeTypes["ESCALATION_END"] = "event.EscalationEnd"; - EventShapeTypes["TERMINATION_END"] = "event.TerminationEnd"; - EventShapeTypes["COMPENSATION_END"] = "event.CompensationEnd"; - EventShapeTypes["CANCEL_END"] = "event.CancelEnd"; + EventShapeTypes['END'] = 'event.End'; + EventShapeTypes['MESSAGE_END'] = 'event.MessageEnd'; + EventShapeTypes['SIGNAL_END'] = 'event.SignalEnd'; + EventShapeTypes['ERROR_END'] = 'event.ErrorEnd'; + EventShapeTypes['ESCALATION_END'] = 'event.EscalationEnd'; + EventShapeTypes['TERMINATION_END'] = 'event.TerminationEnd'; + EventShapeTypes['COMPENSATION_END'] = 'event.CompensationEnd'; + EventShapeTypes['CANCEL_END'] = 'event.CancelEnd'; })(EventShapeTypes || (EventShapeTypes = {})); export const eventIconClasses = { diff --git a/bpmn-editor/js/src/shapes/flow/flow-config.js b/bpmn-editor/js/src/shapes/flow/flow-config.js index 9c60b36a..93ca0ed6 100644 --- a/bpmn-editor/js/src/shapes/flow/flow-config.js +++ b/bpmn-editor/js/src/shapes/flow/flow-config.js @@ -8,11 +8,11 @@ export const FlowLabels = { }; export var FlowShapeTypes; -(function (FlowShapeTypes) { - FlowShapeTypes["SEQUENCE"] = "flow.Sequence"; - FlowShapeTypes["DEFAULT"] = "flow.Default"; - FlowShapeTypes["CONDITIONAL"] = "flow.Conditional"; - FlowShapeTypes["MESSAGE"] = "flow.Message"; +(function(FlowShapeTypes) { + FlowShapeTypes['SEQUENCE'] = 'flow.Sequence'; + FlowShapeTypes['DEFAULT'] = 'flow.Default'; + FlowShapeTypes['CONDITIONAL'] = 'flow.Conditional'; + FlowShapeTypes['MESSAGE'] = 'flow.Message'; })(FlowShapeTypes || (FlowShapeTypes = {})); export const flowIconClasses = { @@ -47,7 +47,7 @@ export const flowAppearanceConfig = { 0: { type: 'object', group: 'label', - when: { ne: { 'labels/0': null } }, + when: { ne: { 'labels/0': null }}, properties: { attrs: { body: { diff --git a/bpmn-editor/js/src/shapes/gateway/gateway-config.js b/bpmn-editor/js/src/shapes/gateway/gateway-config.js index 909183b0..ef16874e 100644 --- a/bpmn-editor/js/src/shapes/gateway/gateway-config.js +++ b/bpmn-editor/js/src/shapes/gateway/gateway-config.js @@ -9,12 +9,12 @@ export const GatewayLabels = { }; export var GatewayShapeTypes; -(function (GatewayShapeTypes) { - GatewayShapeTypes["EXCLUSIVE"] = "gateway.Exclusive"; - GatewayShapeTypes["INCLUSIVE"] = "gateway.Inclusive"; - GatewayShapeTypes["EVENT_BASED"] = "gateway.EventBased"; - GatewayShapeTypes["PARALLEL"] = "gateway.Parallel"; - GatewayShapeTypes["COMPLEX"] = "gateway.Complex"; +(function(GatewayShapeTypes) { + GatewayShapeTypes['EXCLUSIVE'] = 'gateway.Exclusive'; + GatewayShapeTypes['INCLUSIVE'] = 'gateway.Inclusive'; + GatewayShapeTypes['EVENT_BASED'] = 'gateway.EventBased'; + GatewayShapeTypes['PARALLEL'] = 'gateway.Parallel'; + GatewayShapeTypes['COMPLEX'] = 'gateway.Complex'; })(GatewayShapeTypes || (GatewayShapeTypes = {})); export const gatewayIconClasses = { diff --git a/bpmn-editor/js/src/shapes/group/group-config.js b/bpmn-editor/js/src/shapes/group/group-config.js index cae87f39..c7119d96 100644 --- a/bpmn-editor/js/src/shapes/group/group-config.js +++ b/bpmn-editor/js/src/shapes/group/group-config.js @@ -5,8 +5,8 @@ export const GroupLabels = { }; export var GroupShapeTypes; -(function (GroupShapeTypes) { - GroupShapeTypes["GROUP"] = "group.Group"; +(function(GroupShapeTypes) { + GroupShapeTypes['GROUP'] = 'group.Group'; })(GroupShapeTypes || (GroupShapeTypes = {})); export const groupAppearanceConfig = { diff --git a/bpmn-editor/js/src/shapes/placeholder/placeholder-config.js b/bpmn-editor/js/src/shapes/placeholder/placeholder-config.js index ba29d99a..5788f38c 100644 --- a/bpmn-editor/js/src/shapes/placeholder/placeholder-config.js +++ b/bpmn-editor/js/src/shapes/placeholder/placeholder-config.js @@ -4,8 +4,8 @@ import { DataShapeTypes } from '../data/data-config'; import { MAIN_COLOR } from '../../configs/theme'; export var PlaceholderShapeTypes; -(function (PlaceholderShapeTypes) { - PlaceholderShapeTypes["LINK"] = "placeholder.Link"; +(function(PlaceholderShapeTypes) { + PlaceholderShapeTypes['LINK'] = 'placeholder.Link'; })(PlaceholderShapeTypes || (PlaceholderShapeTypes = {})); const PLACEHOLDER_STROKE = MAIN_COLOR; diff --git a/bpmn-editor/js/src/shapes/pool/pool-config.js b/bpmn-editor/js/src/shapes/pool/pool-config.js index 7eab42c8..6196a637 100644 --- a/bpmn-editor/js/src/shapes/pool/pool-config.js +++ b/bpmn-editor/js/src/shapes/pool/pool-config.js @@ -1,11 +1,11 @@ import { inspectorOptions } from '../shared-config'; export var PoolShapeTypes; -(function (PoolShapeTypes) { - PoolShapeTypes["HORIZONTAL_POOL"] = "pool.HorizontalPool"; - PoolShapeTypes["VERTICAL_POOL"] = "pool.VerticalPool"; - PoolShapeTypes["HORIZONTAL_SWIMLANE"] = "pool.HorizontalSwimlane"; - PoolShapeTypes["VERTICAL_SWIMLANE"] = "pool.VerticalSwimlane"; +(function(PoolShapeTypes) { + PoolShapeTypes['HORIZONTAL_POOL'] = 'pool.HorizontalPool'; + PoolShapeTypes['VERTICAL_POOL'] = 'pool.VerticalPool'; + PoolShapeTypes['HORIZONTAL_SWIMLANE'] = 'pool.HorizontalSwimlane'; + PoolShapeTypes['VERTICAL_SWIMLANE'] = 'pool.VerticalSwimlane'; })(PoolShapeTypes || (PoolShapeTypes = {})); export const LANE_CONTENT_MARGIN = 20; diff --git a/bpmn-editor/js/src/shapes/shapes-typing.js b/bpmn-editor/js/src/shapes/shapes-typing.js index f47512d6..f193e32b 100644 --- a/bpmn-editor/js/src/shapes/shapes-typing.js +++ b/bpmn-editor/js/src/shapes/shapes-typing.js @@ -1,26 +1,26 @@ export var MarkerNames; -(function (MarkerNames) { - MarkerNames["PARALLEL"] = "parallel"; - MarkerNames["SEQUENTIAL"] = "sequential"; - MarkerNames["SUB_PROCESS"] = "sub-process"; - MarkerNames["COMPENSATION"] = "compensation"; - MarkerNames["AD_HOC"] = "ad-hoc"; - MarkerNames["LOOP"] = "loop"; - MarkerNames["COLLECTION"] = "collection"; +(function(MarkerNames) { + MarkerNames['PARALLEL'] = 'parallel'; + MarkerNames['SEQUENTIAL'] = 'sequential'; + MarkerNames['SUB_PROCESS'] = 'sub-process'; + MarkerNames['COMPENSATION'] = 'compensation'; + MarkerNames['AD_HOC'] = 'ad-hoc'; + MarkerNames['LOOP'] = 'loop'; + MarkerNames['COLLECTION'] = 'collection'; })(MarkerNames || (MarkerNames = {})); export var ShapeTypes; -(function (ShapeTypes) { - ShapeTypes["ACTIVITY"] = "activity"; - ShapeTypes["DATA_OBJECT"] = "dataObject"; - ShapeTypes["DATA_STORE"] = "dataStore"; - ShapeTypes["DATA_ASSOCIATION"] = "dataAssociation"; - ShapeTypes["EVENT"] = "event"; - ShapeTypes["GATEWAY"] = "gateway"; - ShapeTypes["FLOW"] = "flow"; - ShapeTypes["ANNOTATION"] = "annotation"; - ShapeTypes["GROUP"] = "group"; - ShapeTypes["POOL"] = "pool"; - ShapeTypes["SWIMLANE"] = "swimlane"; +(function(ShapeTypes) { + ShapeTypes['ACTIVITY'] = 'activity'; + ShapeTypes['DATA_OBJECT'] = 'dataObject'; + ShapeTypes['DATA_STORE'] = 'dataStore'; + ShapeTypes['DATA_ASSOCIATION'] = 'dataAssociation'; + ShapeTypes['EVENT'] = 'event'; + ShapeTypes['GATEWAY'] = 'gateway'; + ShapeTypes['FLOW'] = 'flow'; + ShapeTypes['ANNOTATION'] = 'annotation'; + ShapeTypes['GROUP'] = 'group'; + ShapeTypes['POOL'] = 'pool'; + ShapeTypes['SWIMLANE'] = 'swimlane'; })(ShapeTypes || (ShapeTypes = {})); diff --git a/bpmn-editor/ts/index.js b/bpmn-editor/ts/index.js index 6df124cf..5bfa6c20 100644 --- a/bpmn-editor/ts/index.js +++ b/bpmn-editor/ts/index.js @@ -1,9 +1,9 @@ -"use strict"; -Object.defineProperty(exports, "__esModule", { value: true }); -require("core-js/stable"); -require("regenerator-runtime/runtime"); -require("@joint/plus/joint-plus.css"); -require("./src/shapes"); -require("./styles.scss"); -const app_1 = require("./src/app"); +'use strict'; +Object.defineProperty(exports, '__esModule', { value: true }); +require('core-js/stable'); +require('regenerator-runtime/runtime'); +require('@joint/plus/joint-plus.css'); +require('./src/shapes'); +require('./styles.scss'); +const app_1 = require('./src/app'); (0, app_1.init)(); diff --git a/bpmn-editor/ts/src/controllers/edit-controller.ts b/bpmn-editor/ts/src/controllers/edit-controller.ts index 44693b48..0010e737 100644 --- a/bpmn-editor/ts/src/controllers/edit-controller.ts +++ b/bpmn-editor/ts/src/controllers/edit-controller.ts @@ -4,12 +4,13 @@ import { labelEditorWrapperStyles } from '../shapes/shared-config'; import { prepareLinkReplacement, validateAndReplaceConnections } from '../utils'; import { type AppShape, type AppElement, type AppLink } from '../shapes/shapes-typing'; import { type dia, shapes, ui } from '@joint/plus'; +import { onSwimlaneDrag, onSwimlaneDragEnd, onSwimlaneDragStart } from '../events/swimlanes'; +import { onElementDrag, onElementDragEnd, onElementDragStart } from '../events/elements'; + import type HaloService from '../services/halo-service'; import type InspectorService from '../services/inspector-service'; import type LinkToolsService from '../services/link-tools-service'; import type FreeTransformService from '../services/free-transform-service'; -import { onSwimlaneDrag, onSwimlaneDragEnd, onSwimlaneDragStart } from '../events/swimlanes'; -import { onElementDrag, onElementDragEnd, onElementDragStart } from '../events/elements'; import type { LabelElementView } from '../shapes/shape-view'; type EditControllerArgs = { @@ -240,7 +241,7 @@ function prepareLabelEditor(context: EditControllerArgs, cellView: dia.CellView) // Apply global wrapper styles and styles from the shape for (const [key, value] of Object.entries(wrapperStyles)) { - (editableWrapper.style as any)[key] = value; + editableWrapper.style.setProperty(key, value as string); } const contentEditableDiv = document.createElement('div'); diff --git a/bpmn-editor/ts/src/controllers/keyboard-controller.ts b/bpmn-editor/ts/src/controllers/keyboard-controller.ts index 754812bd..d27ecc95 100644 --- a/bpmn-editor/ts/src/controllers/keyboard-controller.ts +++ b/bpmn-editor/ts/src/controllers/keyboard-controller.ts @@ -1,8 +1,9 @@ import Controller from '../controller'; -import type { dia, ui } from '@joint/plus'; import { shapes } from '@joint/plus'; import { ZOOM_SETTINGS } from '../configs/navigator-config'; +import type { dia, ui } from '@joint/plus'; + type KeyboardControllerArgs = { graph: dia.Graph; paper: dia.Paper; diff --git a/bpmn-editor/ts/src/controllers/stencil-controller.ts b/bpmn-editor/ts/src/controllers/stencil-controller.ts index 8a0cde13..140b4540 100644 --- a/bpmn-editor/ts/src/controllers/stencil-controller.ts +++ b/bpmn-editor/ts/src/controllers/stencil-controller.ts @@ -62,7 +62,7 @@ export default class StencilController extends Controller }, 'element:drop': (context: StencilControllerArgs, elementView: dia.ElementView, evt: dia.Event, x: number, y: number) => { const { paper, selection } = context; - let { model } = elementView; + const { model } = elementView; let selectedModel; diff --git a/bpmn-editor/ts/src/controllers/view-controller.ts b/bpmn-editor/ts/src/controllers/view-controller.ts index 9cd0ab28..e926ff60 100644 --- a/bpmn-editor/ts/src/controllers/view-controller.ts +++ b/bpmn-editor/ts/src/controllers/view-controller.ts @@ -1,15 +1,16 @@ import Controller from '../controller'; -import type { ui } from '@joint/plus'; import { dia, shapes } from '@joint/plus'; -import type InspectorService from '../services/inspector-service'; -import type { AppElement, AppLink } from '../shapes/shapes-typing'; import { ShapeTypes } from '../shapes/shapes-typing'; import { addEffect, removeEffect, EffectType } from '../effects'; -import type { BPMNLinkView } from '../shapes/placeholder/placeholder-shapes'; import { isForkEvent, getPoolParent, resolveDefaultLinkType, getSwimlaneParent } from '../utils'; import { PlaceholderShapeTypes } from '../shapes/placeholder/placeholder-config'; import { ZOOM_SETTINGS } from '../configs/navigator-config'; +import type { ui } from '@joint/plus'; +import type InspectorService from '../services/inspector-service'; +import type { AppElement, AppLink } from '../shapes/shapes-typing'; +import type { BPMNLinkView } from '../shapes/placeholder/placeholder-shapes'; + type ViewControllerArgs = { paper: dia.Paper; paperScroller: ui.PaperScroller; diff --git a/bpmn-editor/ts/src/effects/swimlane-preview.ts b/bpmn-editor/ts/src/effects/swimlane-preview.ts index ac42f2cd..6cc56895 100644 --- a/bpmn-editor/ts/src/effects/swimlane-preview.ts +++ b/bpmn-editor/ts/src/effects/swimlane-preview.ts @@ -31,7 +31,7 @@ export const SwimlanePreview = dia.HighlighterView.extend({ if (horizontal) { let y = 0; - let x = poolPadding.left; + const x = poolPadding.left; if (!swimlane) { y = poolBBox.height - paddingBottom; } else { @@ -44,7 +44,7 @@ export const SwimlanePreview = dia.HighlighterView.extend({ }); } else { let x = 0; - let y = poolPadding.top; + const y = poolPadding.top; if (!swimlane) { x = poolBBox.width - paddingRight; } else { diff --git a/bpmn-editor/ts/src/events/elements.ts b/bpmn-editor/ts/src/events/elements.ts index b95007e1..5c548cfe 100644 --- a/bpmn-editor/ts/src/events/elements.ts +++ b/bpmn-editor/ts/src/events/elements.ts @@ -1,9 +1,10 @@ -import type { shapes } from '@joint/plus'; import { type dia } from '@joint/plus'; import { addEffect, removeEffect, EffectType } from '../effects'; import { isStencilEvent, validateAndReplaceConnections, isBoundaryEvent, snapToParentPath } from '../utils'; import { ShapeTypes } from '../shapes/shapes-typing'; +import type { shapes } from '@joint/plus'; + export function onElementDragStart(_paper: dia.Paper, elementView: dia.ElementView, _evt: dia.Event, _x: number, _y: number) { addEffect(elementView, EffectType.Shadow); } diff --git a/bpmn-editor/ts/src/events/pools.ts b/bpmn-editor/ts/src/events/pools.ts index 312c1c28..e188ba82 100644 --- a/bpmn-editor/ts/src/events/pools.ts +++ b/bpmn-editor/ts/src/events/pools.ts @@ -1,11 +1,12 @@ -import type { dia } from '@joint/plus'; import { shapes, V, g } from '@joint/plus'; -import type { VerticalPool } from '../shapes/pool/pool-shapes'; import { type HorizontalPool, HorizontalSwimlane, VerticalSwimlane } from '../shapes/pool/pool-shapes'; import { DEFAULT_HORIZONTAL_POOL_SIZE, DEFAULT_VERTICAL_POOL_SIZE, SWIMLANE_HEADER_SIZE } from '../shapes/pool/pool-config'; import { ShapeTypes } from '../shapes/shapes-typing'; import { MAIN_COLOR } from '../configs/theme'; +import type { dia } from '@joint/plus'; +import type { VerticalPool } from '../shapes/pool/pool-shapes'; + type PoolPreviewEventData = { node: SVGElement; graphBBox: g.Rect | null; @@ -48,7 +49,7 @@ export function onPoolDragStart(paper: dia.Paper, poolView: dia.ElementView, evt const { clientX, clientY } = evt; // Local center of the pool - let { x, y } = paper.clientToLocalPoint(clientX!, clientY!); + const { x, y } = paper.clientToLocalPoint(clientX!, clientY!); node.setAttribute('transform', `translate(${x - poolDimensions.width / 2}, ${y - poolDimensions.height / 2})`); const frontLayer = paper.layers.querySelector('g.joint-back-layer')!; @@ -209,7 +210,7 @@ function constructPoolPreview(pool: HorizontalPool | VerticalPool, poolDimension const poolHeaderSize = pool.getHeaderSize(); const { width, height } = poolDimensions; - let path = pool.isHorizontal() ? + const path = pool.isHorizontal() ? `M 0 0 H ${width + poolHeaderSize} V ${height} H 0 z M ${poolHeaderSize} 0 V ${height}` : `M 0 0 V ${height + poolHeaderSize} H ${width} V 0 z M 0 ${poolHeaderSize} H ${width}`; diff --git a/bpmn-editor/ts/src/events/swimlanes.ts b/bpmn-editor/ts/src/events/swimlanes.ts index 429bb978..a6eb0826 100644 --- a/bpmn-editor/ts/src/events/swimlanes.ts +++ b/bpmn-editor/ts/src/events/swimlanes.ts @@ -1,10 +1,11 @@ -import type { dia } from '@joint/plus'; import { shapes } from '@joint/plus'; import { EffectType, addEffect, removeEffect } from '../effects'; import { isStencilEvent } from '../utils'; import { showGhostOnNextInteraction } from '../effects/ghost'; import { HorizontalSwimlane, VerticalSwimlane } from '../shapes/pool/pool-shapes'; +import type { dia } from '@joint/plus'; + export function onSwimlaneDragStart(paper: dia.Paper, elementView: dia.ElementView, evt: dia.Event, _x: number, _y: number) { if (!isStencilEvent(evt)) { diff --git a/bpmn-editor/ts/src/import/index.ts b/bpmn-editor/ts/src/import/index.ts index 7d793e51..d06811bb 100644 --- a/bpmn-editor/ts/src/import/index.ts +++ b/bpmn-editor/ts/src/import/index.ts @@ -1,8 +1,9 @@ -import type { dia, ui } from '@joint/plus'; import { fromBPMN } from '@joint/format-bpmn-import'; import { bpmnImportOptions } from '../shapes/factories'; import { importBPMN } from '../utils'; +import type { dia, ui } from '@joint/plus'; + interface FileImporter { canHandle(file: File): boolean; import(file: File, graph: dia.Graph): Promise; @@ -24,7 +25,7 @@ export class XMLFileImporter implements FileImporter { const { cells, errors } = fromBPMN(xml, bpmnImportOptions); if (errors.length > 0) { - console.error(errors); + console.warn(errors); return; } @@ -69,7 +70,7 @@ class CompositeFileImporter implements FileImporter { if (importer) { await importer.import(file, graph); } else { - console.error('No importer found for file:', file.name); + console.warn('No importer found for file:', file.name); } } } @@ -103,7 +104,7 @@ export function setupFileImport(paperScroller: ui.PaperScroller, commandManager: if (fileImporter.canHandle(file)) { fileImporter.import(file, paperScroller.options.paper.model); } else { - console.error('Unsupported file type:', file.name); + console.warn('Unsupported file type:', file.name); } } diff --git a/bpmn-editor/ts/src/services/free-transform-service.ts b/bpmn-editor/ts/src/services/free-transform-service.ts index 3154877d..be3c92ed 100644 --- a/bpmn-editor/ts/src/services/free-transform-service.ts +++ b/bpmn-editor/ts/src/services/free-transform-service.ts @@ -1,5 +1,6 @@ -import type { dia } from '@joint/plus'; import { shapes, ui } from '@joint/plus'; + +import type { dia } from '@joint/plus'; import type { AppElement } from '../shapes/shapes-typing'; const freeTransformAttributes = { diff --git a/bpmn-editor/ts/src/services/halo-service.ts b/bpmn-editor/ts/src/services/halo-service.ts index b803d871..a5208cb9 100644 --- a/bpmn-editor/ts/src/services/halo-service.ts +++ b/bpmn-editor/ts/src/services/halo-service.ts @@ -1,11 +1,12 @@ -import type { dia } from '@joint/plus'; import { ui } from '@joint/plus'; import { GroupNames, groups } from '../configs/halo-config'; -import type { AppElement } from '../shapes/shapes-typing'; import { getShapeConstructorByType } from '../utils'; import { Sequence } from '../shapes/flow/flow-shapes'; import { PlaceholderAttributes, PlaceholderShapeTypes } from '../shapes/placeholder/placeholder-config'; +import type { dia } from '@joint/plus'; +import type { AppElement } from '../shapes/shapes-typing'; + export default class HaloService { halo?: ui.Halo; diff --git a/bpmn-editor/ts/src/services/inspector-service.ts b/bpmn-editor/ts/src/services/inspector-service.ts index 7ca864fa..d75df7a5 100644 --- a/bpmn-editor/ts/src/services/inspector-service.ts +++ b/bpmn-editor/ts/src/services/inspector-service.ts @@ -1,8 +1,9 @@ import { ui } from '@joint/plus'; -import type { AppElement, AppLink } from '../shapes/shapes-typing'; import { constructMarkerContent, getShapeConstructorByType } from '../utils'; import { eventBus, EventBusEvents } from '../event-bus'; +import type { AppElement, AppLink } from '../shapes/shapes-typing'; + const INSPECTOR_EMPTY = document.createElement('div'); type InspectorElements = { @@ -95,7 +96,9 @@ export default class InspectorService { markersButtonGroup.once('option:select', (options, _, opt) => { if (opt.markersUpdated) return; - shape.setMarkers && shape.setMarkers(options.map((option: any) => option.value)); + if (shape.setMarkers) { + shape.setMarkers(options.map((option: { value?: string }) => option.value)); + } this.createContentView(shape); }); @@ -116,7 +119,8 @@ export default class InspectorService { if (shapes.length > 0) { const availableShapes = shapes.map((shape) => { const shapeConstructor = getShapeConstructorByType(shape); - const { label, icon } = (shapeConstructor); + // eslint-disable-next-line @typescript-eslint/no-explicit-any + const { label, icon } = shapeConstructor; const shapeWrapper = document.createElement('div'); diff --git a/bpmn-editor/ts/src/services/main-service.ts b/bpmn-editor/ts/src/services/main-service.ts index f7ae5b6d..4f29166d 100644 --- a/bpmn-editor/ts/src/services/main-service.ts +++ b/bpmn-editor/ts/src/services/main-service.ts @@ -1,9 +1,15 @@ -import type { g } from '@joint/plus'; import { dia, ui, shapes, highlighters } from '@joint/plus'; import { setupFileImport } from '../import'; import ViewController from '../controllers/view-controller'; import EditController from '../controllers/edit-controller'; import KeyboardController from '../controllers/keyboard-controller'; +import { ShapeTypes, type AppElement } from '../shapes/shapes-typing'; +import { BPMNLinkView } from '../shapes/placeholder/placeholder-shapes'; +import { LabelElementView } from '../shapes/shape-view'; +import { canElementExistOutsidePool, getBoundaryPoint } from '../utils'; +import { MAIN_COLOR } from '../configs/theme'; + +import type { g } from '@joint/plus'; import type ToolbarService from './toolbar-service'; import type StencilService from './stencil-service'; import type NavigatorService from './navigator-service'; @@ -12,11 +18,6 @@ import type InspectorService from './inspector-service'; import type LinkToolsService from './link-tools-service'; import type FreeTransformService from './free-transform-service'; import type { AppShape } from '../shapes/shapes-typing'; -import { ShapeTypes, type AppElement } from '../shapes/shapes-typing'; -import { BPMNLinkView } from '../shapes/placeholder/placeholder-shapes'; -import { LabelElementView } from '../shapes/shape-view'; -import { canElementExistOutsidePool, getBoundaryPoint } from '../utils'; -import { MAIN_COLOR } from '../configs/theme'; interface secondaryServices { toolbarService: ToolbarService; diff --git a/bpmn-editor/ts/src/services/navigator-service.ts b/bpmn-editor/ts/src/services/navigator-service.ts index 619932fd..77afcecc 100644 --- a/bpmn-editor/ts/src/services/navigator-service.ts +++ b/bpmn-editor/ts/src/services/navigator-service.ts @@ -44,7 +44,7 @@ const NavigatorElementView = dia.ElementView.extend({ }, // calls in an animation frame after a multiple changes // has been made to the model - confirmUpdate: function(flags: any) { + confirmUpdate: function(flags: number) { if (this.hasFlag(flags, UpdateFlags.Render)) this.render(); if (this.hasFlag(flags, UpdateFlags.Update)) this.update(); // using the original `updateTransformation()` method @@ -112,7 +112,7 @@ export default class NavigatorService { widgetNamespace: { ...ui.widgets, iconButton: IconButton - } as any + } as { [name: string]: typeof ui.Widget } }); this.navigatorController = new NavigatorController({ @@ -167,14 +167,14 @@ export default class NavigatorService { updateToolbarButtons() { // Minimap - const minimapButton: any = this.toolbar?.getWidgetByName('minimap'); + const minimapButton = this.toolbar?.getWidgetByName('minimap') as { setTooltip: (tooltip: string) => void } | undefined; if (this.isMinimapVisible()) { minimapButton?.setTooltip('Hide minimap'); } else { minimapButton?.setTooltip('Show minimap'); } // Full screen - const fullscreenButton: any = this.toolbar?.getWidgetByName('fullscreen'); + const fullscreenButton = this.toolbar?.getWidgetByName('fullscreen') as { setIcon: (icon: string) => void; setTooltip: (tooltip: string) => void } | undefined; if (document.fullscreenElement) { fullscreenButton?.setIcon(`${baseUrl}/icon-exit-fullscreen.svg`); fullscreenButton?.setTooltip('Exit full screen'); diff --git a/bpmn-editor/ts/src/services/stencil-service.ts b/bpmn-editor/ts/src/services/stencil-service.ts index d6dd16a5..0eb2e2a1 100644 --- a/bpmn-editor/ts/src/services/stencil-service.ts +++ b/bpmn-editor/ts/src/services/stencil-service.ts @@ -1,10 +1,11 @@ -import type { dia } from '@joint/plus'; import { ui } from '@joint/plus'; import { stencilShapes } from '../configs/stencil-config'; import { getShapeConstructorByType } from '../utils'; import StencilController from '../controllers/stencil-controller'; import { StencilHoverHighlighter } from '../configs/stencil-config'; +import type { dia } from '@joint/plus'; + export default class StencilService { stencil?: ui.Stencil; diff --git a/bpmn-editor/ts/src/services/toolbar-service.ts b/bpmn-editor/ts/src/services/toolbar-service.ts index c40936cd..7320a573 100644 --- a/bpmn-editor/ts/src/services/toolbar-service.ts +++ b/bpmn-editor/ts/src/services/toolbar-service.ts @@ -1,8 +1,9 @@ -import type { dia } from '@joint/plus'; import { ui } from '@joint/plus'; import toolbarConfig from '../configs/toolbar-config'; import ToolbarActionsController from '../controllers/toolbar-actions-controller'; +import type { dia } from '@joint/plus'; + export default class ToolbarService { toolbar?: ui.Toolbar; diff --git a/bpmn-editor/ts/src/shapes/activity/activity-shapes.ts b/bpmn-editor/ts/src/shapes/activity/activity-shapes.ts index 261a64a5..e4613ba6 100644 --- a/bpmn-editor/ts/src/shapes/activity/activity-shapes.ts +++ b/bpmn-editor/ts/src/shapes/activity/activity-shapes.ts @@ -1,7 +1,5 @@ -import type { dia } from '@joint/plus'; import { type g, shapes, util, V } from '@joint/plus'; import { activityIconClasses, ActivityLabels, ActivityShapeTypes, activityAppearanceConfig } from './activity-config'; -import type { AppElement, Marker } from '../shapes-typing'; import { MarkerNames, ShapeTypes } from '../shapes-typing'; import { DataShapeTypes } from '../data/data-config'; import { GatewayShapeTypes } from '../gateway/gateway-config'; @@ -12,6 +10,9 @@ import { AnnotationShapeTypes } from '../annotation/annotation-config'; import { handles } from '../../configs/halo-config'; import { isPoolShared, getPoolParent } from '../../utils'; +import type { dia } from '@joint/plus'; +import type { AppElement, Marker } from '../shapes-typing'; + export abstract class Activity extends shapes.bpmn2.Activity implements AppElement { public readonly isResizable = false; @@ -40,7 +41,7 @@ export abstract class Activity extends shapes.bpmn2.Activity implements AppEleme }, super.defaults); } - initialize(...args: any[]): void { + initialize(...args: Parameters): void { super.initialize(...args); this.on('change:markers', () => this.onMarkersChange()); } @@ -166,7 +167,9 @@ export abstract class Activity extends shapes.bpmn2.Activity implements AppEleme if (prevMarkers.includes(MarkerNames.SEQUENTIAL) && markers.includes(MarkerNames.PARALLEL)) { idxToRemove = markers.indexOf(MarkerNames.SEQUENTIAL); } - idxToRemove > -1 && markers.splice(idxToRemove, 1); + if (idxToRemove > -1) { + markers.splice(idxToRemove, 1); + } if (markers.includes(MarkerNames.AD_HOC) || markers.includes(MarkerNames.SUB_PROCESS)) { markers = markers.filter((marker: MarkerNames) => marker !== MarkerNames.AD_HOC && marker !== MarkerNames.SUB_PROCESS); @@ -398,7 +401,9 @@ export class CallActivity extends Activity { idxToRemove = markers.indexOf(MarkerNames.AD_HOC); } } - idxToRemove > -1 && markers.splice(idxToRemove, 1); + if (idxToRemove > -1) { + markers.splice(idxToRemove, 1); + } if (markers.includes(MarkerNames.SUB_PROCESS)) { return markers; } @@ -454,7 +459,9 @@ export class SubProcess extends Activity { idxToRemove = markers.indexOf(MarkerNames.AD_HOC); } } - idxToRemove > -1 && markers.splice(idxToRemove, 1); + if (idxToRemove > -1) { + markers.splice(idxToRemove, 1); + } if (markers.includes(MarkerNames.SUB_PROCESS)) { return markers; } @@ -512,7 +519,9 @@ export class EventSubProcess extends Activity { idxToRemove = markers.indexOf(MarkerNames.AD_HOC); } } - idxToRemove > -1 && markers.splice(idxToRemove, 1); + if (idxToRemove > -1) { + markers.splice(idxToRemove, 1); + } if (markers.includes(MarkerNames.SUB_PROCESS)) { return markers; } diff --git a/bpmn-editor/ts/src/shapes/annotation/annotation-shapes.ts b/bpmn-editor/ts/src/shapes/annotation/annotation-shapes.ts index 00c56d3a..8b16e51c 100644 --- a/bpmn-editor/ts/src/shapes/annotation/annotation-shapes.ts +++ b/bpmn-editor/ts/src/shapes/annotation/annotation-shapes.ts @@ -1,6 +1,4 @@ -import type { dia } from '@joint/plus'; import { type g, shapes, util, V } from '@joint/plus'; -import type { AppElement, AppLink } from '../shapes-typing'; import { ShapeTypes } from '../shapes-typing'; import { annotationAppearanceConfig, annotationLinkAppearanceConfig, AnnotationShapeTypes } from './annotation-config'; import { defaultAttrs, labelEditorWrapperStyles } from '../shared-config'; @@ -8,6 +6,9 @@ import { handles } from '../../configs/halo-config'; import { constructLinkTools } from '../../configs/link-tools-config'; import { getPoolParent } from '../../utils'; +import type { dia } from '@joint/plus'; +import type { AppElement, AppLink } from '../shapes-typing'; + export class Annotation extends shapes.bpmn2.Annotation implements AppElement { public readonly isResizable = true; diff --git a/bpmn-editor/ts/src/shapes/data/data-shapes.ts b/bpmn-editor/ts/src/shapes/data/data-shapes.ts index 0ceb8a52..58ff13df 100644 --- a/bpmn-editor/ts/src/shapes/data/data-shapes.ts +++ b/bpmn-editor/ts/src/shapes/data/data-shapes.ts @@ -1,6 +1,4 @@ -import type { dia } from '@joint/plus'; import { shapes, util, V, type g } from '@joint/plus'; -import type { AppElement, AppLink, Marker } from '../shapes-typing'; import { MarkerNames, ShapeTypes } from '../shapes-typing'; import { dataObjectAppearanceConfig, dataStoreAppearanceConfig, dataAssociationAppearanceConfig, dataIconClasses, DataShapeTypes, DataLabels } from './data-config'; import { ActivityShapeTypes } from '../activity/activity-config'; @@ -10,6 +8,9 @@ import { AnnotationShapeTypes } from '../annotation/annotation-config'; import { handles } from '../../configs/halo-config'; import { constructLinkTools } from '../../configs/link-tools-config'; +import type { dia } from '@joint/plus'; +import type { AppElement, AppLink, Marker } from '../shapes-typing'; + const LABEL_Y_OFFSET = 14; // DataObject @@ -42,7 +43,7 @@ abstract class Data extends shapes.bpmn2.DataObject implements AppElement { }, super.defaults); } - preinitialize(...args: any[]) { + preinitialize(...args: Parameters): void { super.preinitialize(...args); // Add `labelBody` to markup this.markup = util.svg/* xml */ ` @@ -56,7 +57,7 @@ abstract class Data extends shapes.bpmn2.DataObject implements AppElement { `; } - initialize(...args: any[]): void { + initialize(...args: Parameters): void { super.initialize(...args); this.on('change:markers', () => this.onMarkersChange()); } @@ -274,7 +275,7 @@ export class DataStore extends shapes.bpmn2.DataStore implements AppElement { }, super.defaults); } - preinitialize(...args: any[]) { + preinitialize(...args: Parameters): void { super.preinitialize(...args); // Add `labelBody` to markup this.markup = util.svg/* xml */ ` diff --git a/bpmn-editor/ts/src/shapes/event/event-shapes.ts b/bpmn-editor/ts/src/shapes/event/event-shapes.ts index 8cff7ee3..7a9fc1a9 100644 --- a/bpmn-editor/ts/src/shapes/event/event-shapes.ts +++ b/bpmn-editor/ts/src/shapes/event/event-shapes.ts @@ -1,6 +1,4 @@ -import type { dia } from '@joint/plus'; import { g, shapes, util, V } from '@joint/plus'; -import type { AppElement } from '../shapes-typing'; import { ShapeTypes } from '../shapes-typing'; import { eventAppearanceConfig, eventIconClasses, EventLabels, EventShapeTypes } from './event-config'; import { ActivityShapeTypes } from '../activity/activity-config'; @@ -12,6 +10,9 @@ import { PoolShapeTypes } from '../pool/pool-config'; import { handles } from '../../configs/halo-config'; import { getPoolParent, isPoolShared } from '../../utils'; +import type { dia } from '@joint/plus'; +import type { AppElement } from '../shapes-typing'; + const LABEL_Y_OFFSET = 14; export abstract class Event extends shapes.bpmn2.Event implements AppElement { @@ -40,7 +41,7 @@ export abstract class Event extends shapes.bpmn2.Event implements AppElement { }, super.defaults); } - preinitialize(...args: any[]) { + preinitialize(...args: Parameters): void { super.preinitialize(...args); // Add `labelBody` to markup this.markup = util.svg/* xml */ ` diff --git a/bpmn-editor/ts/src/shapes/factories.ts b/bpmn-editor/ts/src/shapes/factories.ts index a93484e8..27358f57 100644 --- a/bpmn-editor/ts/src/shapes/factories.ts +++ b/bpmn-editor/ts/src/shapes/factories.ts @@ -1,7 +1,5 @@ import { type dia, g, shapes } from '@joint/plus'; -import type { ExportOptions } from '@joint/format-bpmn-export'; import { exportableObjects } from '@joint/format-bpmn-export'; -import type { ImportOptions } from '@joint/format-bpmn-import'; import { ActivityShapeTypes } from './activity/activity-config'; import { AnnotationShapeTypes } from './annotation/annotation-config'; import { DataShapeTypes } from './data/data-config'; @@ -57,6 +55,9 @@ import { MarkerNames } from './shapes-typing'; import { PoolShapeTypes } from './pool/pool-config'; import { HorizontalPool, HorizontalSwimlane, VerticalPool, VerticalSwimlane } from './pool/pool-shapes'; +import type { ExportOptions } from '@joint/format-bpmn-export'; +import type { ImportOptions } from '@joint/format-bpmn-import'; + class ExportableActivity extends exportableObjects.Activity { isSubProcess() { @@ -68,7 +69,7 @@ class ExportableSubProcess extends ExportableActivity { eventTriggered: boolean; - constructor(cellView: any, type?: string, markers?: string[], label?: string, eventTriggered: boolean = false) { + constructor(cellView: dia.CellView, type?: string, markers?: string[], label?: string, eventTriggered: boolean = false) { super(cellView, type, markers, label); this.eventTriggered = eventTriggered; } @@ -96,8 +97,8 @@ class ExportableSubProcess extends ExportableActivity { class ExportableFlow extends exportableObjects.Flow { - constructor(cellView: any, label: string, type: string) { - super(cellView, label, type); + constructor(...args: ConstructorParameters) { + super(...args); } toFlowXMLElement() { @@ -313,7 +314,7 @@ export const bpmnExportOptions: ExportOptions = { return new exportableObjects.Flow(cellView as dia.LinkView, cellView.model.prop('labels/0/attrs/label/text')); }, [FlowShapeTypes.CONDITIONAL]: (cellView) => { - return new ExportableFlow(cellView, cellView.model.prop('labels/0/attrs/label/text'), 'conditional'); + return new ExportableFlow(cellView as dia.LinkView, cellView.model.prop('labels/0/attrs/label/text'), 'conditional'); }, [FlowShapeTypes.MESSAGE]: (cellView) => { return new exportableObjects.Flow(cellView as dia.LinkView, cellView.model.prop('labels/0/attrs/label/text'), 'message'); diff --git a/bpmn-editor/ts/src/shapes/flow/flow-shapes.ts b/bpmn-editor/ts/src/shapes/flow/flow-shapes.ts index 1be3da03..15695440 100644 --- a/bpmn-editor/ts/src/shapes/flow/flow-shapes.ts +++ b/bpmn-editor/ts/src/shapes/flow/flow-shapes.ts @@ -1,12 +1,13 @@ -import type { dia } from '@joint/plus'; import { shapes, util, V } from '@joint/plus'; -import type { AppLink } from '../shapes-typing'; import { ShapeTypes } from '../shapes-typing'; import { flowAppearanceConfig, flowIconClasses, FlowLabels, FlowShapeTypes } from './flow-config'; import { defaultAttrs } from '../shared-config'; import { AnnotationShapeTypes } from '../annotation/annotation-config'; import { constructLinkTools } from '../../configs/link-tools-config'; +import type { dia } from '@joint/plus'; +import type { AppLink } from '../shapes-typing'; + abstract class Flow extends shapes.bpmn2.Flow implements AppLink { defaultLabel = { @@ -32,7 +33,7 @@ abstract class Flow extends shapes.bpmn2.Flow implements AppLink { }, super.defaults); } - constructor(...args: any[]) { + constructor(...args: ConstructorParameters) { super(...args); this.router('rightAngle', { useVertices: true }); } @@ -92,6 +93,8 @@ abstract class Flow extends shapes.bpmn2.Flow implements AppLink { const { x: cx, y: cy } = view.getPointAtRatio(0.5); const currentLabel = this.labels()[0]?.attrs || {}; + + // eslint-disable-next-line @typescript-eslint/no-explicit-any const labelAttrs: any = util.defaultsDeep({}, currentLabel, this.defaultLabel.attrs); return { @@ -182,7 +185,7 @@ export class Message extends Flow { declare module '@joint/plus' { namespace shapes { namespace flow { - export { + export { Sequence, Default, Conditional, diff --git a/bpmn-editor/ts/src/shapes/gateway/gateway-shapes.ts b/bpmn-editor/ts/src/shapes/gateway/gateway-shapes.ts index a22654c1..70fb6108 100644 --- a/bpmn-editor/ts/src/shapes/gateway/gateway-shapes.ts +++ b/bpmn-editor/ts/src/shapes/gateway/gateway-shapes.ts @@ -1,6 +1,4 @@ -import type { dia } from '@joint/plus'; import { type g, shapes, util, V } from '@joint/plus'; -import type { AppElement } from '../shapes-typing'; import { ShapeTypes } from '../shapes-typing'; import { gatewayAppearanceConfig, gatewayIconClasses, GatewayLabels, GatewayShapeTypes } from './gateway-config'; import { ActivityShapeTypes } from '../activity/activity-config'; @@ -10,6 +8,9 @@ import { AnnotationShapeTypes } from '../annotation/annotation-config'; import { handles } from '../../configs/halo-config'; import { isPoolShared } from '../../utils'; +import type { dia } from '@joint/plus'; +import type { AppElement } from '../shapes-typing'; + const LABEL_Y_OFFSET = 14; abstract class Gateway extends shapes.bpmn2.Gateway implements AppElement { @@ -42,7 +43,7 @@ abstract class Gateway extends shapes.bpmn2.Gateway implements AppElement { }, super.defaults); } - preinitialize(...args: any[]) { + preinitialize(...args: Parameters) { super.preinitialize(...args); // Add `labelBody` to markup this.markup = util.svg/* xml */ ` diff --git a/bpmn-editor/ts/src/shapes/group/group-shapes.ts b/bpmn-editor/ts/src/shapes/group/group-shapes.ts index c314252f..521b29dd 100644 --- a/bpmn-editor/ts/src/shapes/group/group-shapes.ts +++ b/bpmn-editor/ts/src/shapes/group/group-shapes.ts @@ -1,12 +1,13 @@ -import type { dia } from '@joint/plus'; import { shapes, util, V, type g } from '@joint/plus'; -import type { AppElement } from '../shapes-typing'; import { ShapeTypes } from '../shapes-typing'; import { groupAppearanceConfig, GroupShapeTypes } from './group-config'; import { defaultAttrs, labelEditorWrapperStyles } from '../shared-config'; import { AnnotationShapeTypes } from '../annotation/annotation-config'; import { handles } from '../../configs/halo-config'; +import type { dia } from '@joint/plus'; +import type { AppElement } from '../shapes-typing'; + class Group extends shapes.bpmn2.Group implements AppElement { public readonly isResizable = true; diff --git a/bpmn-editor/ts/src/shapes/placeholder/placeholder-config.ts b/bpmn-editor/ts/src/shapes/placeholder/placeholder-config.ts index e299dcab..0f780c4e 100644 --- a/bpmn-editor/ts/src/shapes/placeholder/placeholder-config.ts +++ b/bpmn-editor/ts/src/shapes/placeholder/placeholder-config.ts @@ -1,10 +1,11 @@ -import type { dia } from '@joint/plus'; -import type { LinkType } from '../shapes-typing'; import { FlowShapeTypes } from '../flow/flow-config'; import { AnnotationShapeTypes } from '../annotation/annotation-config'; import { DataShapeTypes } from '../data/data-config'; import { MAIN_COLOR } from '../../configs/theme'; +import type { dia } from '@joint/plus'; +import type { LinkType } from '../shapes-typing'; + export enum PlaceholderShapeTypes { LINK = 'placeholder.Link' } diff --git a/bpmn-editor/ts/src/shapes/placeholder/placeholder-shapes.ts b/bpmn-editor/ts/src/shapes/placeholder/placeholder-shapes.ts index 792c0a9a..0e989c04 100644 --- a/bpmn-editor/ts/src/shapes/placeholder/placeholder-shapes.ts +++ b/bpmn-editor/ts/src/shapes/placeholder/placeholder-shapes.ts @@ -33,7 +33,8 @@ export class BPMNLinkView extends dia.LinkView { this.applyLinkProperties(util.merge(resetAttrs, attrs), router, verticesToApply); } - startArrowheadMove(end: dia.LinkEnd, options?: any): any { + // eslint-disable-next-line @typescript-eslint/no-explicit-any + startArrowheadMove(end: dia.LinkEnd, options?: dia.Cell.Options): any { this.saveCurrentLinkState(); const data = super.startArrowheadMove(end, options); @@ -60,6 +61,7 @@ export class BPMNLinkView extends dia.LinkView { super.dragArrowheadEnd(evt, x, y); } + // eslint-disable-next-line @typescript-eslint/no-explicit-any private highlightEmbeddedLanes(data: any): void { if (!this.paper?.options.markAvailable || !data.marked) return; diff --git a/bpmn-editor/ts/src/shapes/pool/pool-config.ts b/bpmn-editor/ts/src/shapes/pool/pool-config.ts index 9e5db6a0..481e3cf7 100644 --- a/bpmn-editor/ts/src/shapes/pool/pool-config.ts +++ b/bpmn-editor/ts/src/shapes/pool/pool-config.ts @@ -1,6 +1,7 @@ -import type { shapes } from '@joint/plus'; import { inspectorOptions } from '../shared-config'; +import type { shapes } from '@joint/plus'; + export enum PoolShapeTypes { HORIZONTAL_POOL = 'pool.HorizontalPool', VERTICAL_POOL = 'pool.VerticalPool', diff --git a/bpmn-editor/ts/src/shapes/pool/pool-shapes.ts b/bpmn-editor/ts/src/shapes/pool/pool-shapes.ts index a273bfef..d806dca5 100644 --- a/bpmn-editor/ts/src/shapes/pool/pool-shapes.ts +++ b/bpmn-editor/ts/src/shapes/pool/pool-shapes.ts @@ -1,6 +1,4 @@ -import type { dia, g } from '@joint/plus'; import { shapes, util, V } from '@joint/plus'; -import type { AppElement } from '../shapes-typing'; import { ShapeTypes } from '../shapes-typing'; import { PoolShapeTypes, DEFAULT_HORIZONTAL_POOL_SIZE, poolAttributes, swimlaneAttributes, poolAppearanceConfig, swimlaneAppearanceConfig, HORIZONTAL_POOL_PADDING, VERTICAL_POOL_PADDING, SWIMLANE_HEADER_SIZE, DEFAULT_VERTICAL_POOL_SIZE } from './pool-config'; import { handles } from '../../configs/halo-config'; @@ -10,6 +8,9 @@ import { AnnotationShapeTypes } from '../annotation/annotation-config'; import { getPoolParent } from '../../utils'; import { EventShapeTypes } from '../event/event-config'; +import type { dia, g } from '@joint/plus'; +import type { AppElement } from '../shapes-typing'; + type HeaderedShape = HorizontalPool | VerticalPool | HorizontalSwimlane | VerticalSwimlane; function getRotatedEditorStyles(element: HeaderedShape, paper: dia.Paper): Partial { diff --git a/bpmn-editor/ts/src/shapes/shape-view.ts b/bpmn-editor/ts/src/shapes/shape-view.ts index ae361024..d420d680 100644 --- a/bpmn-editor/ts/src/shapes/shape-view.ts +++ b/bpmn-editor/ts/src/shapes/shape-view.ts @@ -51,7 +51,7 @@ export class LabelElementView extends dia.ElementView { return this; } - update(element?: DOMElement, renderingOnlyAttrs?: { [key: string]: any; } | undefined): void { + update(element?: DOMElement, renderingOnlyAttrs?: { [key: string]: unknown; } | undefined): void { super.update(element, renderingOnlyAttrs); // If the node doesn't exist, there is no need to toggle its display diff --git a/bpmn-editor/ts/src/shapes/shapes-typing.ts b/bpmn-editor/ts/src/shapes/shapes-typing.ts index c6603594..66a29ec6 100644 --- a/bpmn-editor/ts/src/shapes/shapes-typing.ts +++ b/bpmn-editor/ts/src/shapes/shapes-typing.ts @@ -52,7 +52,7 @@ export interface AppShape extends dia.Cell { interface AppearanceConfig { groups: Record; - inputs: Record>; + inputs: Record>; } export interface AppElement extends dia.Element { diff --git a/bpmn-editor/ts/src/utils/import.ts b/bpmn-editor/ts/src/utils/import.ts index 10429224..bfbfed6e 100644 --- a/bpmn-editor/ts/src/utils/import.ts +++ b/bpmn-editor/ts/src/utils/import.ts @@ -1,10 +1,11 @@ -import type { dia, ui } from '@joint/plus'; import { shapes } from '@joint/plus'; import { SubProcess, EventSubProcess } from '../shapes/activity/activity-shapes'; import { IntermediateBoundary } from '../shapes/event/event-shapes'; -import type { HorizontalPool, VerticalPool } from '../shapes/pool/pool-shapes'; import { HorizontalSwimlane, VerticalSwimlane } from '../shapes/pool/pool-shapes'; +import type { dia, ui } from '@joint/plus'; +import type { HorizontalPool, VerticalPool } from '../shapes/pool/pool-shapes'; + export function importBPMN(paperScroller: ui.PaperScroller, commandManager: dia.CommandManager, cells: dia.Cell[]): void { const paper = paperScroller.options.paper; const graph = paper.model; diff --git a/bpmn-editor/ts/src/utils/links.ts b/bpmn-editor/ts/src/utils/links.ts index cb08b23c..0fc5517b 100644 --- a/bpmn-editor/ts/src/utils/links.ts +++ b/bpmn-editor/ts/src/utils/links.ts @@ -1,5 +1,3 @@ -import type { dia } from '@joint/plus'; -import type { AppLink, AppShape, LinkType } from '../shapes/shapes-typing'; import { ShapeTypes } from '../shapes/shapes-typing'; import { PlaceholderShapeTypes } from '../shapes/placeholder/placeholder-config'; import { DataShapeTypes } from '../shapes/data/data-config'; @@ -10,9 +8,12 @@ import { DataAssociation } from '../shapes/data/data-shapes'; import { Conditional, Default, Message, Sequence } from '../shapes/flow/flow-shapes'; import { isPoolShared } from '.'; +import type { dia, shapes } from '@joint/plus'; +import type { AppLink, AppShape, LinkType } from '../shapes/shapes-typing'; + const DEFAULT_LINK_STROKE = '#333'; -type AppLinkConstructor = new (...args: any[]) => AppLink; +type AppLinkConstructor = new (...args: ConstructorParameters) => AppLink; const LINK_CONNECTIONS: Record = { [PlaceholderShapeTypes.LINK]: Sequence, @@ -47,7 +48,7 @@ export function resolveDefaultLinkType(link: AppLink): LinkType { if (isConnectedToData) return DataShapeTypes.DATA_ASSOCIATION; const isConnectedToPool = ShapeTypes.POOL === sourceShapeType || ShapeTypes.POOL === targetShapeType; - + // The connection includes pool - return message flow by default if (isConnectedToPool || !isPoolShared(source, target)) return FlowShapeTypes.MESSAGE; diff --git a/bpmn-pools-swimlanes-milestones/js/src/actions/import.js b/bpmn-pools-swimlanes-milestones/js/src/actions/import.js index d6f4c024..95a3a819 100644 --- a/bpmn-pools-swimlanes-milestones/js/src/actions/import.js +++ b/bpmn-pools-swimlanes-milestones/js/src/actions/import.js @@ -3,7 +3,7 @@ import { fromBPMN, findExtensionElements } from '@joint/format-bpmn-import'; import { HorizontalPool, VerticalPool, HorizontalSwimlane, VerticalSwimlane, Activity, HorizontalPhase, VerticalPhase, Event, Gateway, POOL_HEADER_SIZE, PHASE_HEADER_SIZE } from '../shapes'; export function importXML(graph, xml) { - + const result = fromBPMN(xml, { bpmn2Shapes: { ...shapes.bpmn2, @@ -20,7 +20,7 @@ export function importXML(graph, xml) { const pool = defaultFactory(); const extensionElements = findExtensionElements(xmlNode); const phaseExtensionElements = extensionElements.filter(el => el.localName === 'phase'); - + if (phaseExtensionElements.length) { const phaseAttributes = phaseExtensionElements.map(extensionElement => { return { @@ -32,7 +32,7 @@ export function importXML(graph, xml) { y: Number(extensionElement.getAttribute('y')) }; }); - + pool.set('xmlPhases', phaseAttributes); // make sure that positions of swimlanes will be correct after adding phases if (pool.isHorizontal()) { @@ -42,19 +42,19 @@ export function importXML(graph, xml) { pool.set('padding', { top: 0, left: POOL_HEADER_SIZE + PHASE_HEADER_SIZE }); } } - + return pool; } }, useLegacyPool: false }); if (result.errors.length) { - console.error(result.errors); + console.warn(result.errors); } - + const cells = result.cells; graph.resetCells(cells); - + cells.filter(cell => cell instanceof shapes.bpmn2.CompositePool).forEach((cell) => { let phaseConstructor; if (cell.isHorizontal()) { @@ -65,9 +65,9 @@ export function importXML(graph, xml) { cell.set('padding', { top: 0, left: POOL_HEADER_SIZE }); phaseConstructor = HorizontalPhase; } - + const xmlPhases = cell.prop('xmlPhases') || []; - + xmlPhases.forEach((xmlPhase) => { const attributes = { id: xmlPhase.id, @@ -79,12 +79,12 @@ export function importXML(graph, xml) { } } }; - + const phase = new phaseConstructor(attributes); graph.addCell(phase); cell.embed(phase); }); - + cell.removeProp('xmlPhases'); // correctly assign z value for pool cells cell.afterPhasesEmbedded(); @@ -92,12 +92,12 @@ export function importXML(graph, xml) { } export function setupXMLImport(graph, paperContainerEl) { - + function dropHandler(evt) { paperContainerEl.classList.remove('drag-over'); // Prevent default behavior (Prevent file from being opened) evt.preventDefault(); - + let file; if (evt.dataTransfer.items) { // Use DataTransferItemList interface to access the file(s) @@ -110,7 +110,7 @@ export function setupXMLImport(graph, paperContainerEl) { // Use DataTransfer interface to access the file(s) [file] = Array.from(evt.dataTransfer.files); } - + if (!file) return; const reader = new FileReader(); @@ -121,17 +121,17 @@ export function setupXMLImport(graph, paperContainerEl) { }; reader.readAsText(file); } - + function dragOverHandler(evt) { paperContainerEl.classList.add('drag-over'); // Prevent default behavior (Prevent file from being opened) evt.preventDefault(); } - + function dragLeaveHandler() { paperContainerEl.classList.remove('drag-over'); } - + paperContainerEl.addEventListener('drop', dropHandler); paperContainerEl.addEventListener('dragover', dragOverHandler); paperContainerEl.addEventListener('dragleave', dragLeaveHandler); diff --git a/bpmn-pools-swimlanes-milestones/js/src/actions/text.js b/bpmn-pools-swimlanes-milestones/js/src/actions/text.js index 2a3ea36d..8589cf1d 100644 --- a/bpmn-pools-swimlanes-milestones/js/src/actions/text.js +++ b/bpmn-pools-swimlanes-milestones/js/src/actions/text.js @@ -41,7 +41,7 @@ export function editElementLabel(elementView) { throw new Error('The `label/textWrap/width` attribute must be a number.'); } width += 2 * textMargin; // padding - let height = element.attr(['label', 'textWrap', 'height']); + const height = element.attr(['label', 'textWrap', 'height']); if (!Number.isFinite(height)) { throw new Error('The `label/textWrap/height` attribute must be a number.'); } @@ -152,7 +152,7 @@ function editText(paper, element, bbox, basePath, options) { // Select all text textarea.setSelectionRange(0, textarea.value.length); - textarea.addEventListener('blur', function () { + textarea.addEventListener('blur', function() { const text = prefix + textarea.value; element.prop(textPath, text); textarea.remove(); diff --git a/bpmn-pools-swimlanes-milestones/js/src/app.js b/bpmn-pools-swimlanes-milestones/js/src/app.js index 7ce29ea8..d817cb70 100644 --- a/bpmn-pools-swimlanes-milestones/js/src/app.js +++ b/bpmn-pools-swimlanes-milestones/js/src/app.js @@ -116,7 +116,7 @@ export const init = () => { return false; return true; }, - validateUnembedding: function (childView) { + validateUnembedding: function(childView) { const child = childView.model; if (shapes.bpmn2.CompositePool.isPool(child)) return true; @@ -265,20 +265,20 @@ export const init = () => { commandManager: history }, tools: [{ - type: 'button', - name: 'clear', - text: '╳ Clear', - }, { - type: 'undo', - text: '↩', - }, { - type: 'redo', - text: '↪', - }, { - type: 'button', - name: 'export', - text: 'Export', - }] + type: 'button', + name: 'clear', + text: '╳ Clear', + }, { + type: 'undo', + text: '↩', + }, { + type: 'redo', + text: '↪', + }, { + type: 'button', + name: 'export', + text: 'Export', + }] }); toolbar.render(); diff --git a/bpmn-pools-swimlanes-milestones/js/src/effects/SwimlanePreview.js b/bpmn-pools-swimlanes-milestones/js/src/effects/SwimlanePreview.js index 35e5fcc6..962954e2 100644 --- a/bpmn-pools-swimlanes-milestones/js/src/effects/SwimlanePreview.js +++ b/bpmn-pools-swimlanes-milestones/js/src/effects/SwimlanePreview.js @@ -24,7 +24,7 @@ export const SwimlanePreview = dia.HighlighterView.extend({ const horizontal = pool.isHorizontal(); if (horizontal) { let y = 0; - let x = poolPadding.left; + const x = poolPadding.left; if (!swimlane) { y = poolBBox.height - poolPadding.bottom; } @@ -39,7 +39,7 @@ export const SwimlanePreview = dia.HighlighterView.extend({ } else { let x = 0; - let y = poolPadding.top; + const y = poolPadding.top; if (!swimlane) { x = poolBBox.width - poolPadding.right; } diff --git a/bpmn-pools-swimlanes-milestones/ts/src/actions/export.ts b/bpmn-pools-swimlanes-milestones/ts/src/actions/export.ts index 090e21ac..48f0d5c6 100644 --- a/bpmn-pools-swimlanes-milestones/ts/src/actions/export.ts +++ b/bpmn-pools-swimlanes-milestones/ts/src/actions/export.ts @@ -1,7 +1,8 @@ -import type { dia } from '@joint/plus'; import { util } from '@joint/plus'; import { toBPMN, exportableObjects, createExtensionElement } from '@joint/format-bpmn-export'; +import type { dia } from '@joint/plus'; + class HorizontalPoolExportableObject extends exportableObjects.HorizontalPool { override defineExtensionElements() { diff --git a/bpmn-pools-swimlanes-milestones/ts/src/actions/import.ts b/bpmn-pools-swimlanes-milestones/ts/src/actions/import.ts index 343a247c..bc3bb498 100644 --- a/bpmn-pools-swimlanes-milestones/ts/src/actions/import.ts +++ b/bpmn-pools-swimlanes-milestones/ts/src/actions/import.ts @@ -1,4 +1,3 @@ -import type { dia } from '@joint/plus'; import { shapes } from '@joint/plus'; import { fromBPMN, findExtensionElements } from '@joint/format-bpmn-import'; import { @@ -15,6 +14,8 @@ import { PHASE_HEADER_SIZE } from '../shapes'; +import type { dia } from '@joint/plus'; + export function importXML(graph: dia.Graph, xml: XMLDocument) { const result = fromBPMN(xml, { @@ -61,7 +62,7 @@ export function importXML(graph: dia.Graph, xml: XMLDocument) { useLegacyPool: false }); if (result.errors.length) { - console.error(result.errors); + console.warn(result.errors); } const cells = result.cells; @@ -77,7 +78,7 @@ export function importXML(graph: dia.Graph, xml: XMLDocument) { phaseConstructor = HorizontalPhase; } - const xmlPhases: any[] = cell.prop('xmlPhases') || []; + const xmlPhases: shapes.bpmn2.Phase.Attributes[] = cell.prop('xmlPhases') || []; xmlPhases.forEach((xmlPhase) => { const attributes = { diff --git a/bpmn-pools-swimlanes-milestones/ts/src/actions/selection.ts b/bpmn-pools-swimlanes-milestones/ts/src/actions/selection.ts index a7e35fb4..8ca504a1 100644 --- a/bpmn-pools-swimlanes-milestones/ts/src/actions/selection.ts +++ b/bpmn-pools-swimlanes-milestones/ts/src/actions/selection.ts @@ -1,8 +1,9 @@ -import type { dia } from '@joint/plus'; import { addEffect, removeEffect, EffectType } from '../effects'; import { addElementTools, removeElementTools } from '../tools'; import { removeCell } from '../utils'; +import type { dia } from '@joint/plus'; + let selection: dia.Cell[] = null; export function select(elementView: dia.ElementView) { diff --git a/bpmn-pools-swimlanes-milestones/ts/src/actions/text.ts b/bpmn-pools-swimlanes-milestones/ts/src/actions/text.ts index 0cf0c38a..4db2b8d4 100644 --- a/bpmn-pools-swimlanes-milestones/ts/src/actions/text.ts +++ b/bpmn-pools-swimlanes-milestones/ts/src/actions/text.ts @@ -41,7 +41,7 @@ export function editElementLabel(elementView: dia.ElementView) { throw new Error('The `label/textWrap/width` attribute must be a number.'); } width += 2 * textMargin; // padding - let height = element.attr(['label', 'textWrap', 'height']); + const height = element.attr(['label', 'textWrap', 'height']); if (!Number.isFinite(height)) { throw new Error('The `label/textWrap/height` attribute must be a number.'); } diff --git a/bpmn-pools-swimlanes-milestones/ts/src/effects/SwimlanePreview.ts b/bpmn-pools-swimlanes-milestones/ts/src/effects/SwimlanePreview.ts index 6352199a..1e73e797 100644 --- a/bpmn-pools-swimlanes-milestones/ts/src/effects/SwimlanePreview.ts +++ b/bpmn-pools-swimlanes-milestones/ts/src/effects/SwimlanePreview.ts @@ -24,7 +24,7 @@ export const SwimlanePreview = dia.HighlighterView.extend({ const horizontal = pool.isHorizontal(); if (horizontal) { let y = 0; - let x = poolPadding.left; + const x = poolPadding.left; if (!swimlane) { y = poolBBox.height - poolPadding.bottom; } else { @@ -37,7 +37,7 @@ export const SwimlanePreview = dia.HighlighterView.extend({ }); } else { let x = 0; - let y = poolPadding.top; + const y = poolPadding.top; if (!swimlane) { x = poolBBox.width - poolPadding.right; } else { diff --git a/bpmn-pools-swimlanes-milestones/ts/src/events/elements.ts b/bpmn-pools-swimlanes-milestones/ts/src/events/elements.ts index 744a28a7..27d82eab 100644 --- a/bpmn-pools-swimlanes-milestones/ts/src/events/elements.ts +++ b/bpmn-pools-swimlanes-milestones/ts/src/events/elements.ts @@ -1,7 +1,8 @@ -import type { dia, shapes } from '@joint/plus'; import { addEffect, removeEffect, EffectType } from '../effects'; import { isStencilEvent, findViewFromEvent } from '../utils'; +import type { dia, shapes } from '@joint/plus'; + export function onElementDragStart(_paper: dia.Paper, elementView: dia.ElementView, evt: dia.Event, _x: number, _y: number) { if (isStencilEvent(evt)) { // Add a shadow effect to the element when the drag starts diff --git a/bpmn-pools-swimlanes-milestones/ts/src/events/index.ts b/bpmn-pools-swimlanes-milestones/ts/src/events/index.ts index d808d7a3..263338b9 100644 --- a/bpmn-pools-swimlanes-milestones/ts/src/events/index.ts +++ b/bpmn-pools-swimlanes-milestones/ts/src/events/index.ts @@ -1,6 +1,7 @@ -import type { dia, ui } from '@joint/plus'; import { BPMNController } from './BPMNController'; +import type { dia, ui } from '@joint/plus'; + export function addBPMNListeners({ paper, stencil }: { paper: dia.Paper, stencil: ui.Stencil }) { const listener = new BPMNController({ stencil, paper }); listener.startListening(); diff --git a/bpmn-pools-swimlanes-milestones/ts/src/events/phases.ts b/bpmn-pools-swimlanes-milestones/ts/src/events/phases.ts index b7df24e7..814a1dc7 100644 --- a/bpmn-pools-swimlanes-milestones/ts/src/events/phases.ts +++ b/bpmn-pools-swimlanes-milestones/ts/src/events/phases.ts @@ -1,9 +1,10 @@ -import type { dia, shapes } from '@joint/plus'; import { addEffect, removeEffect, EffectType } from '../effects'; import { isStencilEvent, findViewFromEvent } from '../utils'; import { deselect } from '../actions/selection'; import { VerticalPhase, HorizontalPhase } from '../shapes'; +import type { dia, shapes } from '@joint/plus'; + export function onPhaseDragStart(paper: dia.Paper, _elementView: dia.ElementView, evt: dia.Event, _x: number, _y: number) { if (isStencilEvent(evt)) { deselect(paper); diff --git a/bpmn-pools-swimlanes-milestones/ts/src/events/pools.ts b/bpmn-pools-swimlanes-milestones/ts/src/events/pools.ts index 61eb7150..13690a54 100644 --- a/bpmn-pools-swimlanes-milestones/ts/src/events/pools.ts +++ b/bpmn-pools-swimlanes-milestones/ts/src/events/pools.ts @@ -1,7 +1,8 @@ -import type { dia, shapes } from '@joint/plus'; import { HorizontalSwimlane, VerticalSwimlane } from '../shapes'; import { swimlaneAttributes, fontAttributes, DEFAULT_POOL_WIDTH } from '../theme'; +import type { dia, shapes } from '@joint/plus'; + export function onPoolDragStart(_paper: dia.Paper, _poolView: dia.ElementView, _evt: dia.Event, _x: number, _y: number) { // no-op } diff --git a/bpmn-pools-swimlanes-milestones/ts/src/events/swimlanes.ts b/bpmn-pools-swimlanes-milestones/ts/src/events/swimlanes.ts index c5a180f7..6cb154fa 100644 --- a/bpmn-pools-swimlanes-milestones/ts/src/events/swimlanes.ts +++ b/bpmn-pools-swimlanes-milestones/ts/src/events/swimlanes.ts @@ -1,10 +1,11 @@ -import type { dia, shapes } from '@joint/plus'; import { addEffect, removeEffect, EffectType } from '../effects'; import { isStencilEvent, findViewFromEvent } from '../utils'; import { showGhostOnNextInteraction } from '../actions/ghost'; import { deselect } from '../actions/selection'; import { VerticalSwimlane, HorizontalSwimlane } from '../shapes'; +import type { dia, shapes } from '@joint/plus'; + export function onSwimlaneDragStart(paper: dia.Paper, elementView: dia.ElementView, evt: dia.Event, _x: number, _y: number) { deselect(paper); diff --git a/cables/js/src/app.js b/cables/js/src/app.js index 66c0ed1a..22355df2 100644 --- a/cables/js/src/app.js +++ b/cables/js/src/app.js @@ -37,7 +37,7 @@ export const init = () => { snapLinks: { radius: 10 }, defaultConnectionPoint: { name: 'anchor' }, - connectionStrategy: function (end, view, _magnet, coords, _link) { + connectionStrategy: function(end, view, _magnet, coords, _link) { const element = view.model; if (ScrewTerminal.isScrewTerminal(element) || Plug.isPlug(element)) { return element.connectionStrategy(end, coords); @@ -45,7 +45,7 @@ export const init = () => { return end; }, - validateConnection: function (cellViewS, magnetS, cellViewT, magnetT, end, _linkView) { + validateConnection: function(cellViewS, magnetS, cellViewT, magnetT, end, _linkView) { if (magnetS === magnetT) return false; if (cellViewS === cellViewT) @@ -255,7 +255,7 @@ export const init = () => { x: -10, y: -10, useModelGeometry: true, - action: function () { + action: function() { const ports = root.getPorts(); ports.forEach(port => disconnectCables(graph, element, port.id)); root.remove(); @@ -341,7 +341,7 @@ export const init = () => { wire1.target({ id: terminal1.id, port: 'right-1', - anchor: { name: 'modelCenter', args: { dx: 20, dy: 5 } } + anchor: { name: 'modelCenter', args: { dx: 20, dy: 5 }} }); highlightPort(terminal1.findView(paper), 'right-1'); cable1.addTools(paper); diff --git a/cables/js/src/shapes.js b/cables/js/src/shapes.js index 56a369c4..1d1a5c0b 100644 --- a/cables/js/src/shapes.js +++ b/cables/js/src/shapes.js @@ -36,12 +36,12 @@ export const RotateTool = elementTools.Control.extend({ } } ], - getPosition: function (view) { + getPosition: function(view) { const { model } = view; const { width, height } = model.size(); return new g.Point(width / 2, height + 10); }, - setPosition: function (view, coordinates) { + setPosition: function(view, coordinates) { const { model } = view; const { width, height } = model.size(); const center = new g.Point(width / 2, height / 2); @@ -203,15 +203,15 @@ export class CompositeCable extends dia.Element { z: -2, source: { id: cableSource.id, - anchor: { name: 'right', args: { rotate: true } }, + anchor: { name: 'right', args: { rotate: true }}, connectionPoint: { name: 'anchor' }, }, target: { id: cableTarget.id, - anchor: { name: 'left', args: { rotate: true } }, + anchor: { name: 'left', args: { rotate: true }}, connectionPoint: { name: 'anchor' }, }, - connector: { name: 'curve', args: { rotate: true } }, + connector: { name: 'curve', args: { rotate: true }}, attrs: { line: { stroke: '#222', @@ -246,11 +246,11 @@ export class CompositeCable extends dia.Element { const wireSource = new shapes.standard.Link({ source: { id: cableSource.id, - anchor: { name: 'left', args: { dy, rotate: true } }, + anchor: { name: 'left', args: { dy, rotate: true }}, connectionPoint: { name: 'anchor' }, }, target: { x: -50, y: -10 + index * 30 }, - connector: { name: 'curve', args: { rotate: true } }, + connector: { name: 'curve', args: { rotate: true }}, attrs: { line: { stroke: color, @@ -264,10 +264,10 @@ export class CompositeCable extends dia.Element { source: { x: 150, y: 20 + index * 30 }, target: { id: cableTarget.id, - anchor: { name: 'right', args: { dy, rotate: true } }, + anchor: { name: 'right', args: { dy, rotate: true }}, connectionPoint: { name: 'anchor' }, }, - connector: { name: 'curve', args: { rotate: true } }, + connector: { name: 'curve', args: { rotate: true }}, attrs: { line: { stroke: color, @@ -334,7 +334,7 @@ export class ScrewTerminal extends dia.Element { groups: { left: { size: { width: 20, height: 10 }, - position: { name: 'left', args: { dy: -10 } }, + position: { name: 'left', args: { dy: -10 }}, attrs: { portBody: { width: 'calc(w)', @@ -383,7 +383,7 @@ export class ScrewTerminal extends dia.Element { }, right: { size: { width: 20, height: 10 }, - position: { name: 'right', args: { dx: -20, dy: -10 } }, + position: { name: 'right', args: { dx: -20, dy: -10 }}, attrs: { portBody: { width: 'calc(w)', @@ -422,7 +422,7 @@ export class ScrewTerminal extends dia.Element { `, label: { - position: { name: 'left', args: { x: 18, y: 17 } }, + position: { name: 'left', args: { x: 18, y: 17 }}, markup: util.svg /* xml */ ` ` @@ -438,7 +438,7 @@ export class ScrewTerminal extends dia.Element { connectionStrategy(end, coords) { const center = this.getBBox().center(); const dx = (coords.x > center.x) ? 20 : 0; - end.anchor = { name: 'modelCenter', args: { dx, dy: 5 } }; + end.anchor = { name: 'modelCenter', args: { dx, dy: 5 }}; end.connectionPoint = { name: 'anchor' }; return end; } @@ -611,48 +611,48 @@ export class Plug extends dia.Element { } }, items: [{ - group: 'pins', - id: 'neutral', - args: { - x: 20, - y: 'calc(h-40)', - }, - attrs: { - portLabel: { - text: 'N' - } + group: 'pins', + id: 'neutral', + args: { + x: 20, + y: 'calc(h-40)', + }, + attrs: { + portLabel: { + text: 'N' } - }, { - group: 'pins', - id: 'live', - args: { - x: 60, - y: 25, - }, - attrs: { - portLabel: { - text: 'L' - } + } + }, { + group: 'pins', + id: 'live', + args: { + x: 60, + y: 25, + }, + attrs: { + portLabel: { + text: 'L' } - }, { - group: 'pins', - id: 'earth', - args: { - x: 40, - y: 15, - }, - attrs: { - portLabel: { - text: 'E' - } + } + }, { + group: 'pins', + id: 'earth', + args: { + x: 40, + y: 15, + }, + attrs: { + portLabel: { + text: 'E' } - }] + } + }] } }, dia.Element.prototype.defaults); } connectionStrategy(end) { - end.anchor = { name: 'modelCenter', args: { dx: 5, dy: 20 } }; + end.anchor = { name: 'modelCenter', args: { dx: 5, dy: 20 }}; end.connectionPoint = { name: 'anchor' }; return end; } diff --git a/chatbot/angular/src/app/app.component.spec.ts b/chatbot/angular/src/app/app.component.spec.ts index 3c3dd029..8631f0de 100644 --- a/chatbot/angular/src/app/app.component.spec.ts +++ b/chatbot/angular/src/app/app.component.spec.ts @@ -9,12 +9,12 @@ https://www.jointjs.com/license or from the JointJS+ archive as was distributed by client IO. See the LICENSE file. */ -import type { ComponentFixture } from '@angular/core/testing'; import { TestBed, waitForAsync } from '@angular/core/testing'; - import { AppComponent } from './app.component'; import { AppModule } from './app.module'; +import type { ComponentFixture } from '@angular/core/testing'; + describe('AppComponent', () => { let component: AppComponent; diff --git a/chatbot/angular/src/app/chatbot/chatbot.component.spec.ts b/chatbot/angular/src/app/chatbot/chatbot.component.spec.ts index 5d6b41bd..37817974 100644 --- a/chatbot/angular/src/app/chatbot/chatbot.component.spec.ts +++ b/chatbot/angular/src/app/chatbot/chatbot.component.spec.ts @@ -9,10 +9,9 @@ https://www.jointjs.com/license or from the JointJS+ archive as was distributed by client IO. See the LICENSE file. */ -import { TestBed, ComponentFixture, waitForAsync } from '@angular/core/testing'; +import { TestBed, waitForAsync } from '@angular/core/testing'; import { BrowserModule } from '@angular/platform-browser'; import { FormsModule, ReactiveFormsModule } from '@angular/forms'; - import { ChatbotComponent } from './chatbot.component'; import { JsonEditorComponent } from '../json-editor/json-editor.component'; import { InspectorComponent } from '../inspector/inspector.component'; @@ -22,6 +21,8 @@ import { LinkInspectorComponent } from '../inspector/link-inspector/link-inspect import { BatchDirective } from '../../directives/batch.directive'; import { EventBusService } from '../../services/event-bus.service'; +import type { ComponentFixture } from '@angular/core/testing'; + describe('ChatbotComponent', () => { let component: ChatbotComponent; diff --git a/chatbot/angular/src/app/chatbot/chatbot.component.ts b/chatbot/angular/src/app/chatbot/chatbot.component.ts index 1c236f08..12ae980a 100644 --- a/chatbot/angular/src/app/chatbot/chatbot.component.ts +++ b/chatbot/angular/src/app/chatbot/chatbot.component.ts @@ -8,27 +8,31 @@ distributed with this file, You can obtain one at https://www.jointjs.com/license or from the JointJS+ archive as was distributed by client IO. See the LICENSE file. */ +/* eslint-disable @typescript-eslint/consistent-type-imports */ import { - AfterViewInit, - ChangeDetectorRef, Component, - ElementRef, - OnDestroy, - OnInit, - Renderer2, ViewChild, - ViewEncapsulation + ViewEncapsulation, + ChangeDetectorRef, + Renderer2 } from '@angular/core'; import { Subscription } from 'rxjs'; - import JointPlusService from '../../services/joint-plus.service'; -import { EventBusService } from '../../services/event-bus.service'; import { STENCIL_WIDTH } from '../../theme'; import { SharedEvents } from '../../joint-plus/controller'; import { loadStencilShapes, importGraphFromJSON, zoomToFit } from '../../joint-plus/actions'; - import exampleGraphJSON from '../../joint-plus/config/example-graph.json'; +import { ElementRef } from '@angular/core'; +import { EventBusService } from '../../services/event-bus.service'; + +import type { + AfterViewInit, + OnDestroy, + OnInit +} from '@angular/core'; + +import type { dia } from '@joint/plus'; @Component({ selector: 'chatbot', @@ -59,10 +63,10 @@ export class ChatbotComponent implements AfterViewInit, OnInit, OnDestroy { public ngOnInit(): void { const { subscriptions, eventBusService } = this; subscriptions.add( - eventBusService.subscribe(SharedEvents.GRAPH_CHANGED, (json: object) => this.onJointGraphChange(json)) + eventBusService.subscribe(SharedEvents.GRAPH_CHANGED, (json: dia.Graph.JSON) => this.onJointGraphChange(json)) ); subscriptions.add( - eventBusService.subscribe(SharedEvents.JSON_EDITOR_CHANGED, (json: object) => this.onJsonEditorChange(json)) + eventBusService.subscribe(SharedEvents.JSON_EDITOR_CHANGED, (json: dia.Graph.JSON) => this.onJsonEditorChange(json)) ); } @@ -85,7 +89,7 @@ export class ChatbotComponent implements AfterViewInit, OnInit, OnDestroy { this.joint.destroy(); } - public openFile(json: object): void { + public openFile(json: dia.Graph.JSON): void { const { joint } = this; this.fileJSON = json; importGraphFromJSON(joint, json); @@ -107,12 +111,12 @@ export class ChatbotComponent implements AfterViewInit, OnInit, OnDestroy { this.openFile(exampleGraphJSON); } - private onJsonEditorChange(json: object): void { + private onJsonEditorChange(json: dia.Graph.JSON): void { const { joint } = this; if (joint) { importGraphFromJSON(joint, json); } } - private onJointGraphChange(json: object): void { + private onJointGraphChange(json: dia.Graph.JSON): void { this.fileJSON = json; } diff --git a/chatbot/angular/src/app/inspector/base-inspector/base-inspector.component.ts b/chatbot/angular/src/app/inspector/base-inspector/base-inspector.component.ts index 33f2b4ad..abc6b465 100644 --- a/chatbot/angular/src/app/inspector/base-inspector/base-inspector.component.ts +++ b/chatbot/angular/src/app/inspector/base-inspector/base-inspector.component.ts @@ -9,8 +9,9 @@ https://www.jointjs.com/license or from the JointJS+ archive as was distributed by client IO. See the LICENSE file. */ -import type { OnChanges, SimpleChanges, OnDestroy } from '@angular/core'; import { Component, Input } from '@angular/core'; + +import type { OnChanges, SimpleChanges, OnDestroy } from '@angular/core'; import type { dia } from '@joint/plus'; export interface Properties { @@ -40,7 +41,7 @@ export abstract class BaseInspectorComponent implements OnChanges, OnDestroy { this.removeCellListener(this.cell); } - public changeCellProp(path: dia.Path, value: any): void { + public changeCellProp(path: dia.Path, value: unknown): void { this.cell.prop(path, value); } diff --git a/chatbot/angular/src/app/inspector/inspector.component.ts b/chatbot/angular/src/app/inspector/inspector.component.ts index fb8c4c34..ad197eca 100644 --- a/chatbot/angular/src/app/inspector/inspector.component.ts +++ b/chatbot/angular/src/app/inspector/inspector.component.ts @@ -10,17 +10,19 @@ distributed by client IO. See the LICENSE file. */ import { - Component, - OnDestroy, - OnInit + Component } from '@angular/core'; import { Subscription } from 'rxjs'; -import { dia } from '@joint/plus'; - -import { EventBusService } from '../../services/event-bus.service'; import { ShapeTypesEnum } from '../../joint-plus/shapes/app.shapes'; import { SharedEvents } from '../../joint-plus/controller'; +import type { + OnDestroy, + OnInit +} from '@angular/core'; +import type { dia } from '@joint/plus'; +import type { EventBusService } from '../../services/event-bus.service'; + @Component({ selector: 'chatbot-inspector', diff --git a/chatbot/angular/src/app/inspector/link-inspector/link-inspector.component.ts b/chatbot/angular/src/app/inspector/link-inspector/link-inspector.component.ts index 0dbd37e6..db05a560 100644 --- a/chatbot/angular/src/app/inspector/link-inspector/link-inspector.component.ts +++ b/chatbot/angular/src/app/inspector/link-inspector/link-inspector.component.ts @@ -10,10 +10,10 @@ distributed by client IO. See the LICENSE file. */ import { Component, Input } from '@angular/core'; -import type { shapes } from '@joint/plus'; - import { BaseInspectorComponent } from '../base-inspector/base-inspector.component'; +import type { shapes } from '@joint/plus'; + @Component({ selector: 'app-link-inspector', templateUrl: './link-inspector.component.html', diff --git a/chatbot/angular/src/app/inspector/message-inspector/message-inspector.component.ts b/chatbot/angular/src/app/inspector/message-inspector/message-inspector.component.ts index f5ed9fcc..6b3bb707 100644 --- a/chatbot/angular/src/app/inspector/message-inspector/message-inspector.component.ts +++ b/chatbot/angular/src/app/inspector/message-inspector/message-inspector.component.ts @@ -10,10 +10,10 @@ distributed by client IO. See the LICENSE file. */ import { Component, Input } from '@angular/core'; -import type { shapes } from '@joint/plus'; - import { BaseInspectorComponent } from '../base-inspector/base-inspector.component'; +import type { shapes } from '@joint/plus'; + interface InspectorPort { id: string; label: string; diff --git a/chatbot/angular/src/app/json-editor/json-editor.component.ts b/chatbot/angular/src/app/json-editor/json-editor.component.ts index dc90a1cc..da81187e 100644 --- a/chatbot/angular/src/app/json-editor/json-editor.component.ts +++ b/chatbot/angular/src/app/json-editor/json-editor.component.ts @@ -9,13 +9,14 @@ https://www.jointjs.com/license or from the JointJS+ archive as was distributed by client IO. See the LICENSE file. */ -import { Component, OnInit, Input } from '@angular/core'; +import { Component, Input } from '@angular/core'; import { Subject } from 'rxjs'; import { debounceTime } from 'rxjs/operators'; - -import { EventBusService } from '../../services/event-bus.service'; import { SharedEvents } from '../../joint-plus/controller'; +import type { OnInit } from '@angular/core'; +import type { EventBusService } from '../../services/event-bus.service'; + const DEBOUNCE_TIME_MS = 500; @Component({ diff --git a/chatbot/angular/src/directives/batch.directive.ts b/chatbot/angular/src/directives/batch.directive.ts index ed5a5d44..79c597c8 100644 --- a/chatbot/angular/src/directives/batch.directive.ts +++ b/chatbot/angular/src/directives/batch.directive.ts @@ -10,10 +10,10 @@ distributed by client IO. See the LICENSE file. */ import { Directive } from '@angular/core'; - -import { EventBusService } from '../services/event-bus.service'; import { SharedEvents } from '../joint-plus/controller'; +import type { EventBusService } from '../services/event-bus.service'; + const BATCH_NAME = 'inspector-input'; @Directive({ diff --git a/chatbot/angular/src/joint-plus/actions.ts b/chatbot/angular/src/joint-plus/actions.ts index 15adaeac..f3bae410 100644 --- a/chatbot/angular/src/joint-plus/actions.ts +++ b/chatbot/angular/src/joint-plus/actions.ts @@ -9,10 +9,7 @@ https://www.jointjs.com/license or from the JointJS+ archive as was distributed by client IO. See the LICENSE file. */ -import type { dia } from '@joint/plus'; import { ui, shapes, format } from '@joint/plus'; - -import type JointPlusService from '../services/joint-plus.service'; import { SharedEvents } from './controller'; import { addCellTools } from './tools'; import { ZOOM_MAX, ZOOM_MIN, ZOOM_STEP } from '../theme'; @@ -20,6 +17,9 @@ import { stencilConfig } from './config/stencil.config'; import { ShapeTypesEnum } from './shapes/app.shapes'; import { PADDING_L } from '../theme'; +import type { dia } from '@joint/plus'; +import type JointPlusService from '../services/joint-plus.service'; + // Selection export function setSelection(service: JointPlusService, selection: dia.Cell[]): void { @@ -112,13 +112,13 @@ export function openImageDownloadDialog(service: JointPlusService, dataURL: stri lightbox.open(); } -export function importGraphFromJSON(service: JointPlusService, json: any): void { +export function importGraphFromJSON(service: JointPlusService, json: dia.Graph.JSON): void { setSelection(service, []); const { graph, history } = service; const shapeTypes = Object.values(ShapeTypesEnum); history.reset(); try { - if (json.cells.some((cell: any) => !shapeTypes.includes(cell.type))) { + if (json.cells.some(cell => !shapeTypes.includes(cell.type as ShapeTypesEnum))) { throw new Error('Invalid JSON: Unknown Cell Type'); } graph.fromJSON(json); @@ -131,7 +131,7 @@ export function importGraphFromJSON(service: JointPlusService, json: any): void export function loadStencilShapes(service: JointPlusService): void { const { stencil } = service; - // @ts-ignore + // @ts-expect-error - get class by type from shapes namespace const stencilShapes = stencilConfig.shapes.map(shape => new shapes.stencil[shape.name](shape)); stencil.load(stencilShapes); } diff --git a/chatbot/angular/src/joint-plus/controllers/joint-plus.controller.ts b/chatbot/angular/src/joint-plus/controllers/joint-plus.controller.ts index 9579453e..da760c55 100644 --- a/chatbot/angular/src/joint-plus/controllers/joint-plus.controller.ts +++ b/chatbot/angular/src/joint-plus/controllers/joint-plus.controller.ts @@ -9,14 +9,14 @@ https://www.jointjs.com/license or from the JointJS+ archive as was distributed by client IO. See the LICENSE file. */ -import type { dia, shapes } from '@joint/plus'; import { util } from '@joint/plus'; - -import type JointPlusService from '../../services/joint-plus.service'; import { Controller, SharedEvents } from '../controller'; import * as actions from '../actions'; import { ZOOM_MIN, ZOOM_MAX, ZOOM_STEP } from '../../theme'; +import type { dia, shapes } from '@joint/plus'; +import type JointPlusService from '../../services/joint-plus.service'; + const DEBOUNCE_TIME_MS = 500; export class JointPlusController extends Controller { diff --git a/chatbot/angular/src/joint-plus/controllers/keyboard.controller.ts b/chatbot/angular/src/joint-plus/controllers/keyboard.controller.ts index 6512fd7b..37cfdca8 100644 --- a/chatbot/angular/src/joint-plus/controllers/keyboard.controller.ts +++ b/chatbot/angular/src/joint-plus/controllers/keyboard.controller.ts @@ -9,12 +9,12 @@ https://www.jointjs.com/license or from the JointJS+ archive as was distributed by client IO. See the LICENSE file. */ -import type { dia } from '@joint/plus'; - -import type JointPlusService from '../../services/joint-plus.service'; import { Controller } from '../controller'; import * as actions from '../actions'; +import type { dia } from '@joint/plus'; +import type JointPlusService from '../../services/joint-plus.service'; + export class KeyboardController extends Controller { startListening() { diff --git a/chatbot/angular/src/joint-plus/plugins.ts b/chatbot/angular/src/joint-plus/plugins.ts index 7eb7e1e4..7672ae0d 100644 --- a/chatbot/angular/src/joint-plus/plugins.ts +++ b/chatbot/angular/src/joint-plus/plugins.ts @@ -109,7 +109,7 @@ export function createPlugins( }, dragStartClone: (element: dia.Element) => { const name = element.get('name'); - // @ts-ignore + // @ts-expect-error - get class by type from shapes namespace const Shape = shapes.app[name]; if (!Shape) throw new Error(`Invalid stencil shape name: ${name}`); return Shape.fromStencilShape(element); diff --git a/chatbot/angular/src/joint-plus/shapes/stencil.shapes.ts b/chatbot/angular/src/joint-plus/shapes/stencil.shapes.ts index 8e007134..06f16d9b 100644 --- a/chatbot/angular/src/joint-plus/shapes/stencil.shapes.ts +++ b/chatbot/angular/src/joint-plus/shapes/stencil.shapes.ts @@ -9,9 +9,7 @@ https://www.jointjs.com/license or from the JointJS+ archive as was distributed by client IO. See the LICENSE file. */ -import type { mvc } from '@joint/plus'; import { dia, shapes } from '@joint/plus'; - import { FONT_FAMILY, PADDING_L, @@ -20,6 +18,8 @@ import { MESSAGE_ICON, } from '../../theme'; +import type { mvc } from '@joint/plus'; + export enum ShapeTypesEnum { MESSAGE = 'stencil.Message', FLOWCHART_START = 'stencil.FlowchartStart', diff --git a/chatbot/angular/src/joint-plus/tools/index.ts b/chatbot/angular/src/joint-plus/tools/index.ts index 9f86d254..709c5c95 100644 --- a/chatbot/angular/src/joint-plus/tools/index.ts +++ b/chatbot/angular/src/joint-plus/tools/index.ts @@ -9,11 +9,11 @@ https://www.jointjs.com/license or from the JointJS+ archive as was distributed by client IO. See the LICENSE file. */ -import type { shapes } from '@joint/plus'; import { dia, elementTools, linkTools } from '@joint/plus'; - import { RemoveTool } from './remove.tool'; +import type { shapes } from '@joint/plus'; + export function addCellTools(cellView: dia.CellView): void { if (cellView.model.isLink()) { addLinkTools(cellView as dia.LinkView); diff --git a/chatbot/angular/src/joint-plus/tools/remove.tool.ts b/chatbot/angular/src/joint-plus/tools/remove.tool.ts index 4bef3737..7b716c1b 100644 --- a/chatbot/angular/src/joint-plus/tools/remove.tool.ts +++ b/chatbot/angular/src/joint-plus/tools/remove.tool.ts @@ -9,9 +9,10 @@ https://www.jointjs.com/license or from the JointJS+ archive as was distributed by client IO. See the LICENSE file. */ -import type { dia } from '@joint/plus'; import { elementTools } from '@joint/plus'; +import type { dia } from '@joint/plus'; + export const RemoveTool = elementTools.Remove.extend({ options: { useModelGeometry: true, diff --git a/chatbot/angular/src/main.ts b/chatbot/angular/src/main.ts index 8a1538e7..7c79f3bc 100644 --- a/chatbot/angular/src/main.ts +++ b/chatbot/angular/src/main.ts @@ -20,4 +20,4 @@ if (environment.production) { } platformBrowserDynamic().bootstrapModule(AppModule) - .catch(err => console.error(err)); + .catch(err => console.warn(err)); diff --git a/chatbot/angular/src/services/event-bus.service.ts b/chatbot/angular/src/services/event-bus.service.ts index 1e15c95c..b5a98150 100644 --- a/chatbot/angular/src/services/event-bus.service.ts +++ b/chatbot/angular/src/services/event-bus.service.ts @@ -10,14 +10,15 @@ distributed by client IO. See the LICENSE file. */ import { Injectable } from '@angular/core'; -import type { Observable, Subscription } from 'rxjs'; import { Subject } from 'rxjs'; import { filter, map } from 'rxjs/operators'; import { mvc } from '@joint/plus'; +import type { Observable, Subscription } from 'rxjs'; + interface SharedEvent { name: string; - value: any; + value: unknown; } @Injectable({ @@ -46,11 +47,11 @@ export class EventBusService implements mvc.Events { return this._events.asObservable(); } - emit(eventName: string, value?: any): void { + emit(eventName: string, value?: unknown): void { this._events.next({ name: eventName, value: value }); } - subscribe(eventName: string, callback: any): Subscription { + subscribe(eventName: string, callback: (value: unknown) => void): Subscription { return this._events.pipe( filter(e => e.name === eventName), map(e => e.value) diff --git a/chatbot/angular/src/services/joint-plus.service.ts b/chatbot/angular/src/services/joint-plus.service.ts index 03df9d1a..f76d2828 100644 --- a/chatbot/angular/src/services/joint-plus.service.ts +++ b/chatbot/angular/src/services/joint-plus.service.ts @@ -10,12 +10,12 @@ distributed by client IO. See the LICENSE file. */ import { Subscription } from 'rxjs'; -import type { dia, ui } from '@joint/plus'; +import { createPlugins } from '../joint-plus/plugins'; +import { JointPlusController, KeyboardController } from '../joint-plus/controllers'; +import type { dia, ui } from '@joint/plus'; import type { EventBusService } from './event-bus.service'; import type { Controller } from '../joint-plus/controller'; -import { createPlugins } from '../joint-plus/plugins'; -import { JointPlusController, KeyboardController } from '../joint-plus/controllers'; export class JointPlusService { @@ -57,7 +57,7 @@ export class JointPlusService { stencil.remove(); toolbar.remove(); tooltip.remove(); - Object.keys(controllers).forEach(name => (controllers)[name].stopListening()); + Object.keys(controllers).forEach(name => (controllers as Record)[name].stopListening()); subscriptions.unsubscribe(); } } diff --git a/chatbot/react-redux-ts/src/App.tsx b/chatbot/react-redux-ts/src/App.tsx index d4d93f56..81240ec0 100644 --- a/chatbot/react-redux-ts/src/App.tsx +++ b/chatbot/react-redux-ts/src/App.tsx @@ -1,7 +1,8 @@ -import React, { ReactElement } from 'react'; - +import React from 'react'; import Chatbot from './components/Chatbot/Chatbot'; +import type { ReactElement } from 'react'; + const App = (): ReactElement => { return ( diff --git a/chatbot/react-redux-ts/src/components/Chatbot/Chatbot.tsx b/chatbot/react-redux-ts/src/components/Chatbot/Chatbot.tsx index 9bdb1cf0..d6d91419 100644 --- a/chatbot/react-redux-ts/src/components/Chatbot/Chatbot.tsx +++ b/chatbot/react-redux-ts/src/components/Chatbot/Chatbot.tsx @@ -1,16 +1,17 @@ -import React, { ReactElement, useCallback, useEffect, useRef, useState } from 'react'; +import React, { useCallback, useEffect, useRef, useState } from 'react'; import { useDispatch, useSelector } from 'react-redux'; - import './Chatbot.scss'; import JointPlusService from '../../services/joint-plus.service'; import JsonEditor from './JsonEditor/JsonEditor'; import Inspector from './Inspector/Inspector'; import { importGraphFromJSON, loadStencilShapes, zoomToFit } from '../../joint-plus/actions'; import { STENCIL_WIDTH } from '../../theme'; -import { State } from '../../redux/reducer'; - import exampleGraphJSON from '../../joint-plus/config/example-graph.json'; +import type { ReactElement } from 'react'; +import type { State } from '../../redux/reducer'; +import type { dia } from '@joint/plus'; + const Chatbot = (): ReactElement => { const elementRef = useRef(null); @@ -33,7 +34,7 @@ const Chatbot = (): ReactElement => { setFileJSON(graphJSON); }, [graphJSON]); - const openFile = useCallback((json: Object): void => { + const openFile = useCallback((json: dia.Graph.JSON): void => { setFileJSON(json); importGraphFromJSON(joint, json); zoomToFit(joint); @@ -107,17 +108,17 @@ const Chatbot = (): ReactElement => {
+ className={'icon toggle-stencil ' + (!stencilOpened ? 'disabled-icon' : '')} + data-tooltip="Toggle Element Palette" + data-tooltip-position-selector=".toggle-bar"/>
+ className={'icon toggle-editor ' + (!jsonEditorOpened ? 'disabled-icon' : '')} + data-tooltip="Toggle JSON Editor" + data-tooltip-position-selector=".toggle-bar"/>
+ style={{ display: stencilOpened ? 'initial' : 'none' }} + className="stencil-container"/>
diff --git a/chatbot/react-redux-ts/src/components/Chatbot/Input/Input.tsx b/chatbot/react-redux-ts/src/components/Chatbot/Input/Input.tsx index 07dd1931..a465612b 100644 --- a/chatbot/react-redux-ts/src/components/Chatbot/Input/Input.tsx +++ b/chatbot/react-redux-ts/src/components/Chatbot/Input/Input.tsx @@ -1,9 +1,10 @@ -import React, { ChangeEvent, ReactElement, useEffect } from 'react'; +import React, { useEffect } from 'react'; import { useDispatch } from 'react-redux'; - import { SharedEvents } from '../../../joint-plus/controller'; import { actionCreator } from '../../../redux/helpers/actionCreator'; +import type { ChangeEvent, ReactElement } from 'react'; + interface Props { className?: string; type?: string; @@ -35,19 +36,19 @@ const Input = (props: Props): ReactElement => { useEffect(() => { return () => { onBlur(); - } + }; }, []); return ( ); }; diff --git a/chatbot/react-redux-ts/src/components/Chatbot/Inspector/Inspector.tsx b/chatbot/react-redux-ts/src/components/Chatbot/Inspector/Inspector.tsx index e65a6b90..d67b2b05 100644 --- a/chatbot/react-redux-ts/src/components/Chatbot/Inspector/Inspector.tsx +++ b/chatbot/react-redux-ts/src/components/Chatbot/Inspector/Inspector.tsx @@ -1,13 +1,14 @@ -import React, { ReactElement, useEffect, useState } from 'react'; +import React, { useEffect, useState } from 'react'; import { useSelector } from 'react-redux'; -import { dia, shapes } from '@joint/plus'; - import MessageInspector from './MessageInspector'; import './Inspector.scss'; import LinkInspector from './LinkInspector'; import LabelInspector from './LabelInspector'; import { ShapeTypesEnum } from '../../../joint-plus/shapes/app.shapes'; -import { State } from '../../../redux/reducer'; + +import type { ReactElement } from 'react'; +import type { dia, shapes } from '@joint/plus'; +import type { State } from '../../../redux/reducer'; const Inspector = (): ReactElement => { const [cell, setCell] = useState(null); diff --git a/chatbot/react-redux-ts/src/components/Chatbot/Inspector/LabelInspector.tsx b/chatbot/react-redux-ts/src/components/Chatbot/Inspector/LabelInspector.tsx index 250ace7f..8ead26f1 100644 --- a/chatbot/react-redux-ts/src/components/Chatbot/Inspector/LabelInspector.tsx +++ b/chatbot/react-redux-ts/src/components/Chatbot/Inspector/LabelInspector.tsx @@ -1,9 +1,10 @@ -import React, { ChangeEvent, ReactElement, useCallback, useState } from 'react'; -import { dia } from '@joint/plus'; - +import React, { useCallback, useState } from 'react'; import { useBaseInspector } from './useBaseInspector'; import Input from '../Input/Input'; +import type { ChangeEvent, ReactElement } from 'react'; +import type { dia } from '@joint/plus'; + interface Props { cell: dia.Cell; } @@ -30,9 +31,9 @@ const LabelInspector = (props: Props): ReactElement => { diff --git a/chatbot/react-redux-ts/src/components/Chatbot/Inspector/LinkInspector.tsx b/chatbot/react-redux-ts/src/components/Chatbot/Inspector/LinkInspector.tsx index e1083e90..be0b7a94 100644 --- a/chatbot/react-redux-ts/src/components/Chatbot/Inspector/LinkInspector.tsx +++ b/chatbot/react-redux-ts/src/components/Chatbot/Inspector/LinkInspector.tsx @@ -1,9 +1,10 @@ -import React, { ChangeEvent, ReactElement, useCallback, useState } from 'react'; -import { shapes } from '@joint/plus'; - +import React, { useCallback, useState } from 'react'; import { useBaseInspector } from './useBaseInspector'; import Input from '../Input/Input'; +import type { ChangeEvent, ReactElement } from 'react'; +import type { shapes } from '@joint/plus'; + interface Props { cell: shapes.app.Link; } @@ -30,9 +31,9 @@ const LinkInspector = (props: Props): ReactElement => { diff --git a/chatbot/react-redux-ts/src/components/Chatbot/Inspector/MessageInspector.tsx b/chatbot/react-redux-ts/src/components/Chatbot/Inspector/MessageInspector.tsx index b439f8fe..8f52b6e1 100644 --- a/chatbot/react-redux-ts/src/components/Chatbot/Inspector/MessageInspector.tsx +++ b/chatbot/react-redux-ts/src/components/Chatbot/Inspector/MessageInspector.tsx @@ -1,9 +1,10 @@ -import React, { ChangeEvent, ReactElement, useCallback, useState } from 'react'; -import { shapes } from '@joint/plus'; - +import React, { useCallback, useState } from 'react'; import { useBaseInspector } from './useBaseInspector'; import Input from '../Input/Input'; +import type { ChangeEvent, ReactElement } from 'react'; +import type { shapes } from '@joint/plus'; + interface Props { cell: shapes.app.Message; } @@ -69,28 +70,28 @@ const MessageInspector = (props: Props): ReactElement => { @@ -98,20 +99,20 @@ const MessageInspector = (props: Props): ReactElement => {
Out Ports
{ports.map(port => { return (
) => changeCellPort(port, e.target.value)} + onChange={(e: ChangeEvent) => changeCellPort(port, e.target.value)} />
); diff --git a/chatbot/react-redux-ts/src/components/Chatbot/Inspector/useBaseInspector.tsx b/chatbot/react-redux-ts/src/components/Chatbot/Inspector/useBaseInspector.tsx index 3bc745d4..9a816831 100644 --- a/chatbot/react-redux-ts/src/components/Chatbot/Inspector/useBaseInspector.tsx +++ b/chatbot/react-redux-ts/src/components/Chatbot/Inspector/useBaseInspector.tsx @@ -1,12 +1,12 @@ import { useCallback, useEffect, useState } from 'react'; -import { dia } from '@joint/plus'; +import type { dia } from '@joint/plus'; interface Props { cell: dia.Cell; - assignFormFields: Function; + assignFormFields: () => void; } -export const useBaseInspector = (props: Props): Function => { +export const useBaseInspector = (props: Props): ((path: dia.Path, value: unknown) => void) => { const { cell, assignFormFields } = props; @@ -20,7 +20,7 @@ export const useBaseInspector = (props: Props): Function => { cell.off(null, null, context); }, [cell, context]); - const changeCellProp = (path: dia.Path, value: any): void => { + const changeCellProp = (path: dia.Path, value: unknown): void => { cell.prop(path, value); }; diff --git a/chatbot/react-redux-ts/src/components/Chatbot/JsonEditor/JsonEditor.tsx b/chatbot/react-redux-ts/src/components/Chatbot/JsonEditor/JsonEditor.tsx index 7275c96f..2435f649 100644 --- a/chatbot/react-redux-ts/src/components/Chatbot/JsonEditor/JsonEditor.tsx +++ b/chatbot/react-redux-ts/src/components/Chatbot/JsonEditor/JsonEditor.tsx @@ -1,14 +1,15 @@ -import React, { ReactElement, useEffect, useState } from 'react'; +import React, { useEffect, useState } from 'react'; import { useDispatch } from 'react-redux'; import { Subject } from 'rxjs'; import { debounceTime } from 'rxjs/operators'; - import './JsonEditor.scss'; import { SharedEvents } from '../../../joint-plus/controller'; import { actionCreator } from '../../../redux/helpers/actionCreator'; +import type { ReactElement } from 'react'; + interface Props { - content: Object; + content: object; } const DEBOUNCE_TIME_MS = 500; @@ -16,13 +17,13 @@ const DEBOUNCE_TIME_MS = 500; const JsonEditor = (props: Props): ReactElement => { const [placeholder] = useState('e.g. { "cells": [{ "type": "app.Message"}] }'); - const [content, setContent] = useState(null); - const [contentSubject] = useState(new Subject()); + const [content, setContent] = useState(null); + const [contentSubject] = useState(new Subject()); const dispatch = useDispatch(); useEffect(() => { - contentSubject.pipe(debounceTime(DEBOUNCE_TIME_MS)).subscribe((json: Object) => { + contentSubject.pipe(debounceTime(DEBOUNCE_TIME_MS)).subscribe((json: object) => { dispatch( actionCreator(SharedEvents.JSON_EDITOR_CHANGED, json) ); @@ -51,7 +52,7 @@ const JsonEditor = (props: Props): ReactElement => { contentSubject.next(json); }; - const formatJSON = (json: string | Object): string => { + const formatJSON = (json: string | object): string => { if (!json) { return ''; } @@ -61,9 +62,9 @@ const JsonEditor = (props: Props): ReactElement => { return (