camunda-bpmn-js 0.13.0-alpha.1 → 0.13.0-alpha.4

package/lib/camunda-platform/features/modeling/behavior/DeleteRetryTimeCycleBehavior.js

@@ -5,37 +5,45 @@ import {
 
 import CommandInterceptor from 'diagram-js/lib/command/CommandInterceptor';
 
+import {
+  getExtensionElementsList,
+  removeExtensionElements
+} from '../../../../util/ExtensionElementsUtil';
+
 const HIGH_PRIORITY = 5000;
 
 
 /**
- * Camunda BPMN specific camunda:FailedJobRetryTimeCycle behavior.
+ * Camunda BPMN specific behavior ensuring camunda:FailedJobRetryTimeCycle is
+ * removed when both camunda:asyncAfter and camunda:asyncBefore set to false.
+ * Doesn't apply if element has bpmn:TimerEventDefinition.
  */
 export default class DeleteRetryTimeCycleBehavior extends CommandInterceptor {
-  constructor(eventBus, modeling) {
+  constructor(commandStack, eventBus) {
     super(eventBus);
 
-    /**
-     * Remove camunda:FailedJobRetryTimeCycle if camunda:asyncAfter or camunda:asyncBefore is set to false.
-     */
     this.postExecute([
       'element.updateProperties',
-      'properties-panel.update-businessobject'
+      'element.updateModdleProperties'
     ], HIGH_PRIORITY, function(context) {
       const {
         element,
-        properties
+        moddleElement,
+        properties = {}
       } = context;
 
-      const businessObject = getBusinessObject(element),
-            extensionElements = businessObject.extensionElements;
+      const asyncAfter = properties[ 'camunda:asyncAfter' ],
+            asyncBefore = properties[ 'camunda:asyncBefore' ];
+
+      const businessObject = moddleElement || getBusinessObject(element);
+
+      const failedJobRetryTimeCycle = getFailedJobRetryTimeCycle(element);
 
       if (
         !is(element, 'camunda:AsyncCapable')
-        || (properties[ 'camunda:asyncBefore' ] !== false && properties[ 'camunda:asyncAfter' ] !== false)
-        || !extensionElements
-        || !extensionElements.get('values').length
-        || !extensionElements.get('values').find((value) => is(value, 'camunda:FailedJobRetryTimeCycle'))
+        || !is(businessObject, 'camunda:AsyncCapable')
+        || (asyncAfter !== false && asyncBefore !== false)
+        || !failedJobRetryTimeCycle
         || getTimerEventDefinition(element)
         || isAsyncBefore(businessObject)
         || isAsyncAfter(businessObject)
@@ -43,19 +51,15 @@ export default class DeleteRetryTimeCycleBehavior extends CommandInterceptor {
         return;
       }
 
-      const values = extensionElements.get('values').filter((element) => {
-        return !is(element, 'camunda:FailedJobRetryTimeCycle');
-      });
-
-      modeling.updateModdleProperties(element, extensionElements, { values });
+      removeExtensionElements(element, businessObject, failedJobRetryTimeCycle, commandStack);
     }, true);
 
   }
 }
 
 DeleteRetryTimeCycleBehavior.$inject = [
-  'eventBus',
-  'modeling'
+  'commandStack',
+  'eventBus'
 ];
 
 
@@ -69,6 +73,10 @@ function isAsyncAfter(businessObject) {
   return !!businessObject.get('camunda:asyncAfter');
 }
 
+function getFailedJobRetryTimeCycle(element) {
+  return getExtensionElementsList(element, 'camunda:FailedJobRetryTimeCycle')[ 0 ];
+}
+
 function getTimerEventDefinition(element) {
   return getEventDefinition(element, 'bpmn:TimerEventDefinition');
 }
@@ -76,7 +84,11 @@ function getTimerEventDefinition(element) {
 function getEventDefinition(element, type) {
   const businessObject = getBusinessObject(element);
 
-  const eventDefinitions = businessObject.get('eventDefinitions') || [];
+  const eventDefinitions = businessObject.get('eventDefinitions');
+
+  if (!eventDefinitions || !eventDefinitions.length) {
+    return;
+  }
 
   return eventDefinitions.find((eventDefinition) => {
     return is(eventDefinition, type);

package/lib/camunda-platform/features/modeling/behavior/UpdateCamundaExclusiveBehavior.js

@@ -9,32 +9,35 @@ const HIGH_PRIORITY = 5000;
 
 
 /**
- * Camunda BPMN specific camunda:exclusive behavior.
+ * Camunda BPMN specific behavior ensuring camunda:exclusive is set to true if
+ * camunda:asyncBefore or camunda:asyncAfter is set to false.
  */
 export default class UpdateCamundaExclusiveBehavior extends CommandInterceptor {
   constructor(eventBus) {
     super(eventBus);
 
-    /**
-     * Set camunda:exclusive to true on camunda:asyncBefore or camunda:asyncAfter set to false.
-     */
     this.preExecute([
       'element.updateProperties',
-      'properties-panel.update-businessobject'
+      'element.updateModdleProperties',
     ], HIGH_PRIORITY, function(context) {
       const {
         element,
-        properties
+        moddleElement,
+        properties = {}
       } = context;
 
-      const businessObject = getBusinessObject(element);
+      const businessObject = moddleElement || getBusinessObject(element);
+
+      const asyncAfter = properties[ 'camunda:asyncAfter' ],
+            asyncBefore = properties[ 'camunda:asyncBefore' ];
 
       if (!is(element, 'camunda:AsyncCapable')
-        || (properties[ 'camunda:asyncBefore' ] !== false && properties[ 'camunda:asyncAfter' ] !== false)
+        || !is(businessObject, 'camunda:AsyncCapable')
+        || (asyncAfter !== false && asyncBefore !== false)
         || isExclusive(businessObject)
-        || (isAsyncAfter(businessObject) && properties[ 'camunda:asyncAfter' ] !== false)
-        || (isAsyncBefore(businessObject) && properties[ 'camunda:asyncBefore' ] !== false)
-        || (properties[ 'camunda:asyncBefore' ] === true || properties[ 'camunda:asyncAfter' ] === true)
+        || (isAsyncAfter(businessObject) && asyncAfter !== false)
+        || (isAsyncBefore(businessObject) && asyncBefore !== false)
+        || (asyncAfter === true || asyncBefore === true)
       ) {
         return;
       }

package/lib/camunda-platform/features/modeling/behavior/UpdateInputOutputBehavior.js

@@ -1,54 +1,44 @@
-import { getBusinessObject } from 'bpmn-js/lib/util/ModelUtil';
+import {
+  getBusinessObject,
+  is
+} from 'bpmn-js/lib/util/ModelUtil';
+
+import { isInputOutputEmpty } from '../../../helper/InputOutputHelper';
 
 import {
-  getInputOutput,
-  isInputOutputEmpty
-} from '../../../helper/InputOutputHelper';
+  removeExtensionElements
+} from '../../../../util/ExtensionElementsUtil';
 
 import CommandInterceptor from 'diagram-js/lib/command/CommandInterceptor';
 
+const LOW_PRIORITY = 250;
+
+
 /**
- * Camunda BPMN specific camunda:InputOutput behavior.
+ * Camunda BPMN specific behavior ensuring empty camunda:InputOutput is removed.
  */
 export default class UpdateInputOutputBehavior extends CommandInterceptor {
-  constructor(eventBus, modeling) {
+  constructor(commandStack, eventBus) {
     super(eventBus);
 
-    /**
-     * Remove empty camunda:InputOutput on update.
-     */
-    this.postExecute([
-      'element.updateProperties',
-      'element.updateModdleProperties',
-      'properties-panel.update-businessobject-list'
-    ], function(context) {
+    this.postExecuted('element.updateModdleProperties', LOW_PRIORITY, function(context) {
       const {
         element,
-        oldProperties,
-        propertyName
+        moddleElement
       } = context;
 
-      const businessObject = getBusinessObject(element),
-            inputOutput = getInputOutput(businessObject),
-            extensionElements = businessObject.get('extensionElements');
-
-      // do not remove newly added camunda:InputOutput
-      if (!oldProperties && propertyName === 'values') {
+      if (!is(moddleElement, 'camunda:InputOutput')) {
         return;
       }
 
-      if (inputOutput && isInputOutputEmpty(inputOutput)) {
-        const values = extensionElements.get('values').filter(function(element) {
-          return element !== inputOutput;
-        });
-
-        modeling.updateModdleProperties(element, extensionElements, { values });
+      if (isInputOutputEmpty(moddleElement)) {
+        removeExtensionElements(element, getBusinessObject(element), moddleElement, commandStack);
       }
     }, true);
   }
 }
 
 UpdateInputOutputBehavior.$inject = [
-  'eventBus',
-  'modeling'
+  'commandStack',
+  'eventBus'
 ];

package/lib/camunda-platform/features/modeling/behavior/UpdateResultVariableBehavior.js

@@ -1,37 +1,42 @@
-import { is } from 'bpmn-js/lib/util/ModelUtil';
-
-import { has } from 'min-dash';
+import {
+  getBusinessObject,
+  is
+} from 'bpmn-js/lib/util/ModelUtil';
 
 import CommandInterceptor from 'diagram-js/lib/command/CommandInterceptor';
 
+import { has } from 'min-dash';
+
 const HIGH_PRIORITY = 5000;
 
 
 /**
- * Camunda BPMN specific camunda:resultVariable behavior.
+ * Camunda BPMN specific camunda:resultVariable behavior ensuring
+ * camunda:mapDecisionResult is removed when camunda:resultVariable is removed.
  */
 export default class UpdateResultVariableBehavior extends CommandInterceptor {
   constructor(eventBus) {
     super(eventBus);
 
-    /**
-     * Remove camunda:mapDecisionResult on camunda:resultVariable removed.
-     */
     this.preExecute([
       'element.updateProperties',
-      'properties-panel.update-businessobject'
+      'element.updateModdleProperties'
     ], HIGH_PRIORITY, function(context) {
       const {
         element,
+        moddleElement,
         properties
       } = context;
 
+      const businessObject = moddleElement || getBusinessObject(element);
+
       if (
         is(element, 'camunda:DmnCapable')
+        && is(businessObject, 'camunda:DmnCapable')
         && has(properties, 'camunda:resultVariable')
         && isEmpty(properties[ 'camunda:resultVariable' ])
       ) {
-        properties[ 'camunda:mapDecisionResult' ] = null;
+        properties[ 'camunda:mapDecisionResult' ] = undefined;
       }
     }, true);
 
@@ -42,10 +47,8 @@ UpdateResultVariableBehavior.$inject = [
   'eventBus'
 ];
 
-
 // helpers //////////
 
 function isEmpty(value) {
   return value == undefined || value === '';
-}
-
+}

package/lib/camunda-platform/features/modeling/behavior/UserTaskFormsBehavior.js

@@ -1,3 +1,5 @@
+import { getBusinessObject } from 'bpmn-js/lib/util/ModelUtil';
+
 import CommandInterceptor from 'diagram-js/lib/command/CommandInterceptor';
 
 import {
@@ -21,16 +23,15 @@ export default class UserTaskFormsBehavior extends CommandInterceptor {
      */
     this.preExecute([
       'element.updateProperties',
-      'element.updateModdleProperties',
-      'properties-panel.update-businessobject'
+      'element.updateModdleProperties'
     ], function(context) {
-      const { properties } = context;
+      const {
+        element,
+        moddleElement,
+        properties
+      } = context;
 
-      const businessObject = (
-        context.moddleElement ||
-        context.businessObject ||
-        context.element.businessObject
-      );
+      const businessObject = moddleElement || getBusinessObject(element);
 
       if (has(properties, 'camunda:formKey')) {
         Object.assign(properties, {

package/lib/camunda-platform/features/modeling/behavior/UserTaskGeneratedFormsBehavior.js

@@ -2,6 +2,8 @@ import CommandInterceptor from 'diagram-js/lib/command/CommandInterceptor';
 
 import { getBusinessObject, is } from 'bpmn-js/lib/util/ModelUtil';
 
+import { has } from 'min-dash';
+
 
 /**
  * Camunda BPMN specific user task generated forms behavior.
@@ -14,19 +16,17 @@ export default class UserTaskFormsBehavior extends CommandInterceptor {
   constructor(eventBus, modeling) {
     super(eventBus);
 
-    this.preExecute([
-      'element.updateModdleProperties',
-      'properties-panel.update-businessobject'
-    ], function(context) {
-      let {
-        businessObject,
+    /**
+     * Remove camunda:FormField#values if camunda:FormField#type is changed to
+     * something other than enum.
+     */
+    this.preExecute('element.updateModdleProperties', function(context) {
+      const {
         moddleElement,
         properties
       } = context;
 
-      businessObject = businessObject || moddleElement;
-
-      if (!is(businessObject, 'camunda:FormField')) {
+      if (!is(moddleElement, 'camunda:FormField')) {
         return;
       }
 
@@ -35,59 +35,58 @@ export default class UserTaskFormsBehavior extends CommandInterceptor {
       }
     }, true);
 
-    this.preExecute([
-      'element.updateModdleProperties',
-      'properties-panel.update-businessobject'
-    ], function(context) {
-      let {
-        businessObject,
+    /**
+     * Update camunda:FormData#businessKey if camunda:FormField#id is changed.
+     */
+    this.preExecute('element.updateModdleProperties', function(context) {
+      const {
         element,
         moddleElement,
         properties
       } = context;
 
-      businessObject = businessObject || moddleElement;
-
-      if (!is(businessObject, 'camunda:FormField')) {
+      if (!is(moddleElement, 'camunda:FormField') || !has(properties, 'camunda:id')) {
         return;
       }
 
       const formData = getFormData(element);
 
-      if ('camunda:id' in properties && isBusinessKey(businessObject, formData)) {
+      if (isBusinessKey(moddleElement, formData)) {
         modeling.updateModdleProperties(element, formData, {
           'camunda:businessKey': properties[ 'camunda:id' ]
         });
       }
     }, true);
 
-    this.postExecute('properties-panel.update-businessobject-list', function(context) {
+    /**
+     * Remove camunda:FormData#businessKey if camunda:FormField is removed.
+     */
+    this.postExecute('element.updateModdleProperties', function(context) {
       const {
-        currentObject: businessObject,
         element,
-        propertyName,
-        objectsToRemove = []
+        moddleElement,
+        properties
       } = context;
 
-      if (!is(businessObject, 'camunda:FormData')
-        || propertyName !== 'fields'
-        || !objectsToRemove.length) {
+      if (!is(moddleElement, 'camunda:FormData') || !has(properties, 'fields')) {
         return;
       }
 
-      const businessKey = businessObject.get('camunda:businessKey');
+      const businessKey = moddleElement.get('camunda:businessKey');
 
       if (!businessKey) {
         return;
       }
 
-      objectsToRemove.forEach((object) => {
-        if (is(object, 'camunda:FormField') && object.get('camunda:id') === businessKey) {
-          modeling.updateModdleProperties(element, businessObject, {
-            'camunda:businessKey': undefined
-          });
-        }
+      const fieldWithBusinessKey = moddleElement.get('fields').find(field => {
+        return field.get('camunda:id') === businessKey;
       });
+
+      if (!fieldWithBusinessKey) {
+        modeling.updateModdleProperties(element, moddleElement, {
+          'camunda:businessKey': undefined
+        });
+      }
     }, true);
   }
 }

package/lib/util/ExtensionElementsUtil.js

@@ -0,0 +1,59 @@
+import {
+  getBusinessObject,
+  is
+} from 'bpmn-js/lib/util/ModelUtil';
+
+import { isArray } from 'min-dash';
+
+/**
+ * Get extension elements of business object. Optionally filter by type.
+ *
+ * @param  {djs.model.Base|ModdleElement} element
+ * @param  {String} [type=undefined]
+ * @returns {Array<ModdleElement>}
+ */
+export function getExtensionElementsList(element, type = undefined) {
+  const businessObject = getBusinessObject(element),
+        extensionElements = businessObject.get('extensionElements');
+
+  if (!extensionElements) {
+    return [];
+  }
+
+  const values = extensionElements.get('values');
+
+  if (!values || !values.length) {
+    return [];
+  }
+
+  if (type) {
+    return values.filter(value => is(value, type));
+  }
+
+  return values;
+}
+
+/**
+ * Remove one or more extension elements. Remove bpmn:ExtensionElements afterwards if it's empty.
+ *
+ * @param {ModdleElement} element
+ * @param {ModdleElement} businessObject
+ * @param {ModdleElement|Array<ModdleElement>} extensionElementsToRemove
+ * @param {CommandStack} commandStack
+ */
+export function removeExtensionElements(element, businessObject, extensionElementsToRemove, commandStack) {
+  if (!isArray(extensionElementsToRemove)) {
+    extensionElementsToRemove = [ extensionElementsToRemove ];
+  }
+
+  const extensionElements = businessObject.get('extensionElements'),
+        values = extensionElements.get('values').filter(value => !extensionElementsToRemove.includes(value));
+
+  commandStack.execute('element.updateModdleProperties', {
+    element,
+    moddleElement: extensionElements,
+    properties: {
+      values
+    }
+  });
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "camunda-bpmn-js",
-  "version": "0.13.0-alpha.1",
+  "version": "0.13.0-alpha.4",
   "description": "Embeddable Camunda modeling distributions based on bpmn-js",
   "main": "lib/index.js",
   "scripts": {
@@ -13,7 +13,8 @@
     "start:base": "cross-env SINGLE_START=base-modeler npm run dev",
     "start:platform": "cross-env SINGLE_START=camunda-platform-modeler npm run dev",
     "start:cloud": "cross-env SINGLE_START=camunda-cloud-modeler npm run dev",
-    "prepublishOnly": "run-s distro test:distro"
+    "prepublishOnly": "run-s test:distro",
+    "prepare": "run-s distro"
   },
   "repository": {
     "type": "git",
@@ -40,31 +41,30 @@
   "license": "MIT",
   "dependencies": {
     "@bpmn-io/align-to-origin": "^0.7.0",
-    "@bpmn-io/properties-panel": "^0.10.2",
-    "bpmn-js": "^8.9.1",
+    "bpmn-js": "^9.0.3",
     "bpmn-js-disable-collapsed-subprocess": "^0.1.3",
     "bpmn-js-executable-fix": "^0.1.3",
-    "bpmn-js-properties-panel": "~1.0.0-alpha.1",
-    "bpmn-js-signavio-compat": "^1.2.3",
     "camunda-bpmn-moddle": "^6.1.1",
-    "diagram-js": "^7.8.2",
-    "diagram-js-minimap": "^2.0.4",
+    "diagram-js": "^8.1.1",
+    "diagram-js-minimap": "^2.1.0",
     "diagram-js-origin": "^1.3.2",
     "inherits": "^2.0.4",
-    "min-dash": "^3.7.0",
-    "zeebe-bpmn-moddle": "^0.10.0"
+    "min-dash": "^3.8.1",
+    "zeebe-bpmn-moddle": "^0.11.0"
   },
   "devDependencies": {
+    "@bpmn-io/properties-panel": "^0.11.0",
     "@rollup/plugin-commonjs": "^17.1.0",
     "@rollup/plugin-json": "^4.1.0",
     "@rollup/plugin-node-resolve": "^11.1.1",
+    "bpmn-js-properties-panel": "~1.0.0-alpha.5",
     "chai": "^4.2.0",
     "cross-env": "^7.0.3",
     "eslint": "^7.32.0",
     "eslint-plugin-bpmn-io": "^0.13.0",
     "execa": "^5.0.0",
     "istanbul-instrumenter-loader": "^3.0.1",
-    "karma": "^6.3.0",
+    "karma": "^6.3.16",
     "karma-chai": "^0.1.0",
     "karma-chrome-launcher": "^3.1.0",
     "karma-coverage": "^2.0.3",
@@ -87,5 +87,9 @@
     "sinon": "^9.2.4",
     "sinon-chai": "^3.5.0",
     "webpack": "^5.20.1"
+  },
+  "peerDependencies": {
+    "@bpmn-io/properties-panel": "0.11.x",
+    "bpmn-js-properties-panel": "1.0.0-alpha.5"
   }
 }

package/styles/base-modeler.css

@@ -1,4 +1,5 @@
 @import './diagram-js.css';
+@import './bpmn-js.css';
 @import './bpmn-font/css/bpmn-embedded.css';
 @import './diagram-js-minimap.css';
 @import './properties-panel.css';

package/styles/camunda-cloud-modeler.css

@@ -1 +1,2 @@
-@import './base-modeler.css';
+@import './base-modeler.css';
+@import './element-templates.css';

package/lib/camunda-cloud/features/modeling/behavior/CleanUpAssignmentDefinitionBehavior.js

@@ -1,78 +0,0 @@
-import {
-  is
-} from 'bpmn-js/lib/util/ModelUtil';
-
-import {
-  getBusinessObject
-} from 'bpmn-js/lib/util/ModelUtil';
-
-import CommandInterceptor from 'diagram-js/lib/command/CommandInterceptor';
-
-const HIGH_PRIORITY = 5000;
-
-
-/**
- * Zeebe BPMN behavior for ensuring that there are not empty (ie. without properties)
- * zeebe:assignmentDefinitions after modeling operations. Will also remove related
- * extensionElements, if they remain empty afterwards (could be a seperate
- * behavior in the future, if needed)
- */
-export default class CleanUpBusinessRuleTaskBehavior extends CommandInterceptor {
-  constructor(eventBus, modeling) {
-    super(eventBus);
-
-    /**
-     * Remove zeebe:assignmentDefinition when it has no defined properties left after the operation
-     */
-    this.postExecuted([
-      'properties-panel.update-businessobject',
-      'element.updateModdleProperties'
-    ] , HIGH_PRIORITY, function(context) {
-      const {
-        element,
-        businessObject,
-        moddleElement
-      } = context;
-
-      // (1) harmonize property names from commands
-      const assignmentDefintion = businessObject || moddleElement;
-
-      if (
-        is(element, 'bpmn:UserTask')
-        && assignmentDefintion
-        && is(assignmentDefintion, 'zeebe:AssignmentDefinition')
-        && assignmentDefintion.assignee === undefined
-        && assignmentDefintion.candidateGroups === undefined
-      ) {
-        const extensionElements = getBusinessObject(element).extensionElements;
-
-        // (2) remove zeebe:assignmentDefintion
-        removeFromExtensionElements(element, extensionElements, modeling,
-          (ele) => !is(ele, 'zeebe:AssignmentDefinition'));
-
-        // (3) if extensionElements are empty afterwards, remove them as well
-        if (extensionElements.values.length === 0) {
-          modeling.updateModdleProperties(element, getBusinessObject(element),
-            { extensionElements: undefined });
-        }
-      }
-    }, true);
-
-  }
-}
-
-CleanUpBusinessRuleTaskBehavior.$inject = [
-  'eventBus',
-  'modeling'
-];
-
-
-// helper ////////////////////
-
-function removeFromExtensionElements(element, extensionElements, modeling, filterFun) {
-  const values = extensionElements.get('values').filter(filterFun);
-
-  modeling.updateModdleProperties(element, extensionElements, {
-    values
-  });
-}

package/lib/camunda-cloud/helper/ExtensionElementsHelper.js

@@ -1,17 +0,0 @@
-import { is } from 'bpmn-js/lib/util/ModelUtil';
-
-export function getExtensionElements(bo, type) {
-  let elements = [];
-  const extensionElements = bo.get('extensionElements');
-
-  if (typeof extensionElements !== 'undefined') {
-    const extensionValues = extensionElements.get('values');
-    if (typeof extensionValues !== 'undefined') {
-      elements = extensionValues.filter(function(value) {
-        return is(value, type);
-      });
-    }
-  }
-
-  return elements;
-}