camunda-bpmn-js 4.3.1 → 4.3.3

package/dist/camunda-cloud-modeler.development.js

@@ -107323,6 +107323,7 @@
   function FeelEditor({
     extensions: editorExtensions = [],
     container,
+    contentAttributes = {},
     tooltipContainer,
     onChange = () => {},
     onKeyDown = () => {},
@@ -107374,6 +107375,7 @@
       bracketMatching(),
       changeHandler,
       closeBrackets(),
+      EditorView.contentAttributes.of(contentAttributes),
       indentOnInput(),
       keyHandler,
       keymap.of([
@@ -109864,6 +109866,7 @@
   };
   const CodeEditor = N((props, ref) => {
     const {
+      contentAttributes,
       enableGutters,
       value,
       onInput,
@@ -109909,7 +109912,8 @@
         tooltipContainer: tooltipContainer,
         value: localValue,
         variables: variables,
-        extensions: [...(enableGutters ? [lineNumbers()] : []), EditorView.lineWrapping]
+        extensions: [...(enableGutters ? [lineNumbers()] : []), EditorView.lineWrapping],
+        contentAttributes
       });
       setEditor(editor);
       return () => {
@@ -110999,9 +111003,12 @@
           disabled: feel !== 'optional' || disabled,
           onClick: handleFeelToggle
         }), feelActive ? u(CodeEditor, {
-          id: prefixId$5(id),
           name: id,
           onInput: handleLocalInput,
+          contentAttributes: {
+            'id': prefixId$5(id),
+            'aria-label': label
+          },
           disabled: disabled,
           popupOpen: popuOpen,
           onFeelToggle: () => {
@@ -135250,9 +135257,9 @@
       target[property] = [];
     }
 
-    const originToAdd = source[property].filter(o => !target.origin.includes(o));
+    const propertiesToAdd = source[property].filter(o => !target[property].includes(o));
 
-    target[property].push(...originToAdd);
+    target[property].push(...propertiesToAdd);
   }
 
   function mergeEntries(target, source, visited = []) {
@@ -157448,99 +157455,102 @@
     return true;
   };
 
-  const appendIcon = `<svg width="22" height="22" viewBox="0 0 5.82 5.82" xmlns="http://www.w3.org/2000/svg" fill="currentColor">
-  <path d="M1.3 3.4c.3 0 .5-.2.5-.5s-.2-.4-.5-.4c-.2 0-.4.1-.4.4 0 .3.2.5.4.5zM3 3.4c.2 0 .4-.2.4-.5s-.2-.4-.4-.4c-.3 0-.5.1-.5.4 0 .3.2.5.5.5zM4.6 3.4c.2 0 .4-.2.4-.5s-.2-.4-.4-.4c-.3 0-.5.1-.5.4 0 .3.2.5.5.5z"/>
-</svg>`;
-  const createIcon = `<svg width="46" height="46" viewBox="-2 -2 9.82 9.82" xmlns="http://www.w3.org/2000/svg" fill="currentColor">
-  <path d="M1.3 3.4c.3 0 .5-.2.5-.5s-.2-.4-.5-.4c-.2 0-.4.1-.4.4 0 .3.2.5.4.5zM3 3.4c.2 0 .4-.2.4-.5s-.2-.4-.4-.4c-.3 0-.5.1-.5.4 0 .3.2.5.5.5zM4.6 3.4c.2 0 .4-.2.4-.5s-.2-.4-.4-.4c-.3 0-.5.1-.5.4 0 .3.2.5.5.5z"/>
+  const appendIcon = `<svg width="22" height="22" viewBox="0 0 5.82 5.82" xmlns="http://www.w3.org/2000/svg" fill="currentColor">
+  <path d="M1.3 3.4c.3 0 .5-.2.5-.5s-.2-.4-.5-.4c-.2 0-.4.1-.4.4 0 .3.2.5.4.5zM3 3.4c.2 0 .4-.2.4-.5s-.2-.4-.4-.4c-.3 0-.5.1-.5.4 0 .3.2.5.5.5zM4.6 3.4c.2 0 .4-.2.4-.5s-.2-.4-.4-.4c-.3 0-.5.1-.5.4 0 .3.2.5.5.5z"/>
+</svg>`;
+  const createIcon = `<svg width="46" height="46" viewBox="-2 -2 9.82 9.82" xmlns="http://www.w3.org/2000/svg" fill="currentColor">
+  <path d="M1.3 3.4c.3 0 .5-.2.5-.5s-.2-.4-.5-.4c-.2 0-.4.1-.4.4 0 .3.2.5.4.5zM3 3.4c.2 0 .4-.2.4-.5s-.2-.4-.4-.4c-.3 0-.5.1-.5.4 0 .3.2.5.5.5zM4.6 3.4c.2 0 .4-.2.4-.5s-.2-.4-.4-.4c-.3 0-.5.1-.5.4 0 .3.2.5.5.5z"/>
 </svg>`;
 
-  /**
-   * A provider for append context pad button
-   */
-  function AppendContextPadProvider(contextPad, popupMenu, translate, canvas) {
-
-    this._contextPad = contextPad;
-    this._popupMenu = popupMenu;
-    this._translate = translate;
-    this._canvas = canvas;
-
-    this.register();
-  }
-
-  AppendContextPadProvider.$inject = [
-    'contextPad',
-    'popupMenu',
-    'translate',
-    'canvas'
-  ];
-
-  /**
-   * Register append button provider in the context pad
-   */
-  AppendContextPadProvider.prototype.register = function() {
-    this._contextPad.registerProvider(this);
-  };
-
-  /**
-   * Gets the append context pad entry
-   *
-   * @param {djs.model.Base} element
-   * @returns {Object} entries
-   */
-  AppendContextPadProvider.prototype.getContextPadEntries = function(element) {
-    const popupMenu = this._popupMenu;
-    const translate = this._translate;
-    const getAppendMenuPosition = this._getAppendMenuPosition.bind(this);
-
-    if (!popupMenu.isEmpty(element, 'bpmn-append')) {
-
-      // append menu entry
-      return {
-        'append': {
-          group: 'model',
-          html: `<div class="entry">${appendIcon}</div>`,
-          title: translate('Append element'),
-          action: {
-            click: function(event, element) {
-
-              const position = assign(getAppendMenuPosition(element), {
-                cursor: { x: event.x, y: event.y }
-              });
-
-              popupMenu.open(element, 'bpmn-append', position, {
-                title: translate('Append element'),
-                width: 300,
-                search: true
-              });
-            }
-          }
-        }
-      };
-    }
-  };
-
-  /**
-   * Calculates the position for the append menu relatively to the element
-   *
-   * @param {djs.model.Base} element
-   * @returns {Object}
-   */
-  AppendContextPadProvider.prototype._getAppendMenuPosition = function(element) {
-    const contextPad = this._contextPad;
-
-    const X_OFFSET = 5;
-
-    const pad = contextPad.getPad(element).html;
-
-    const padRect = pad.getBoundingClientRect();
-
-    const pos = {
-      x: padRect.right + X_OFFSET,
-      y: padRect.top
-    };
-
-    return pos;
+  /**
+   * A provider for append context pad button
+   */
+  function AppendContextPadProvider(contextPad, popupMenu, translate, canvas, rules) {
+
+    this._contextPad = contextPad;
+    this._popupMenu = popupMenu;
+    this._translate = translate;
+    this._canvas = canvas;
+    this._rules = rules;
+
+    this.register();
+  }
+
+  AppendContextPadProvider.$inject = [
+    'contextPad',
+    'popupMenu',
+    'translate',
+    'canvas',
+    'rules'
+  ];
+
+  /**
+   * Register append button provider in the context pad
+   */
+  AppendContextPadProvider.prototype.register = function() {
+    this._contextPad.registerProvider(this);
+  };
+
+  /**
+   * Gets the append context pad entry
+   *
+   * @param {djs.model.Base} element
+   * @returns {Object} entries
+   */
+  AppendContextPadProvider.prototype.getContextPadEntries = function(element) {
+    const popupMenu = this._popupMenu;
+    const translate = this._translate;
+    const rules = this._rules;
+    const getAppendMenuPosition = this._getAppendMenuPosition.bind(this);
+
+    if (rules.allowed('shape.append', { element })) {
+
+      // append menu entry
+      return {
+        'append': {
+          group: 'model',
+          html: `<div class="entry">${appendIcon}</div>`,
+          title: translate('Append element'),
+          action: {
+            click: function(event, element) {
+
+              const position = assign(getAppendMenuPosition(element), {
+                cursor: { x: event.x, y: event.y }
+              });
+
+              popupMenu.open(element, 'bpmn-append', position, {
+                title: translate('Append element'),
+                width: 300,
+                search: true
+              });
+            }
+          }
+        }
+      };
+    }
+  };
+
+  /**
+   * Calculates the position for the append menu relatively to the element
+   *
+   * @param {djs.model.Base} element
+   * @returns {Object}
+   */
+  AppendContextPadProvider.prototype._getAppendMenuPosition = function(element) {
+    const contextPad = this._contextPad;
+
+    const X_OFFSET = 5;
+
+    const pad = contextPad.getPad(element).html;
+
+    const padRect = pad.getBoundingClientRect();
+
+    const pos = {
+      x: padRect.right + X_OFFSET,
+      y: padRect.top
+    };
+
+    return pos;
   };
 
   function e(e,t){t&&(e.super_=t,e.prototype=Object.create(t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}));}
@@ -158153,87 +158163,87 @@
     return el.querySelector(selector);
   }
 
-  const LOWER_PRIORITY = 900;
-
-  /**
-   * A palette provider for the create elements menu.
-   */
-  function CreatePaletteProvider(palette, translate, popupMenu, canvas, mouse) {
-
-    this._palette = palette;
-    this._translate = translate;
-    this._popupMenu = popupMenu;
-    this._canvas = canvas;
-    this._mouse = mouse;
-
-    this.register();
-  }
-
-  CreatePaletteProvider.$inject = [
-    'palette',
-    'translate',
-    'popupMenu',
-    'canvas',
-    'mouse'
-  ];
-
-  /**
-   * Register create button provider in the palette
-   */
-  CreatePaletteProvider.prototype.register = function() {
-    this._palette.registerProvider(LOWER_PRIORITY, this);
-  };
-
-  /**
-   * Gets the palette create entry
-   *
-   * @param {djs.model.Base} element
-   * @returns {Object}
-   */
-  CreatePaletteProvider.prototype.getPaletteEntries = function(element) {
-    const translate = this._translate,
-          popupMenu = this._popupMenu,
-          canvas = this._canvas,
-          mouse = this._mouse;
-
-    const getPosition = (event) => {
-      const X_OFFSET = 35;
-      const Y_OFFSET = 10;
-
-      if (event instanceof KeyboardEvent) {
-        event = mouse.getLastMoveEvent();
-        return { x: event.x, y: event.y };
-      }
-
-      const target = event && event.target || query('.djs-palette [data-action="create"]');
-      const targetPosition = target.getBoundingClientRect();
-
-      return target && {
-        x: targetPosition.left + targetPosition.width / 2 + X_OFFSET,
-        y: targetPosition.top + targetPosition.height / 2 + Y_OFFSET
-      };
-    };
-
-    return {
-      'create': {
-        group: 'create',
-        html: `<div class="entry"> ${createIcon}</div>`,
-        title: translate('Create element'),
-        action: {
-          click: function(event) {
-            const position = getPosition(event);
-
-            const element = canvas.getRootElement();
-
-            popupMenu.open(element, 'bpmn-create', position, {
-              title: translate('Create element'),
-              width: 300,
-              search: true
-            });
-          }
-        }
-      }
-    };
+  const LOWER_PRIORITY = 900;
+
+  /**
+   * A palette provider for the create elements menu.
+   */
+  function CreatePaletteProvider(palette, translate, popupMenu, canvas, mouse) {
+
+    this._palette = palette;
+    this._translate = translate;
+    this._popupMenu = popupMenu;
+    this._canvas = canvas;
+    this._mouse = mouse;
+
+    this.register();
+  }
+
+  CreatePaletteProvider.$inject = [
+    'palette',
+    'translate',
+    'popupMenu',
+    'canvas',
+    'mouse'
+  ];
+
+  /**
+   * Register create button provider in the palette
+   */
+  CreatePaletteProvider.prototype.register = function() {
+    this._palette.registerProvider(LOWER_PRIORITY, this);
+  };
+
+  /**
+   * Gets the palette create entry
+   *
+   * @param {djs.model.Base} element
+   * @returns {Object}
+   */
+  CreatePaletteProvider.prototype.getPaletteEntries = function(element) {
+    const translate = this._translate,
+          popupMenu = this._popupMenu,
+          canvas = this._canvas,
+          mouse = this._mouse;
+
+    const getPosition = (event) => {
+      const X_OFFSET = 35;
+      const Y_OFFSET = 10;
+
+      if (event instanceof KeyboardEvent) {
+        event = mouse.getLastMoveEvent();
+        return { x: event.x, y: event.y };
+      }
+
+      const target = event && event.target || query('.djs-palette [data-action="create"]');
+      const targetPosition = target.getBoundingClientRect();
+
+      return target && {
+        x: targetPosition.left + targetPosition.width / 2 + X_OFFSET,
+        y: targetPosition.top + targetPosition.height / 2 + Y_OFFSET
+      };
+    };
+
+    return {
+      'create': {
+        group: 'create',
+        html: `<div class="entry"> ${createIcon}</div>`,
+        title: translate('Create element'),
+        action: {
+          click: function(event) {
+            const position = getPosition(event);
+
+            const element = canvas.getRootElement();
+
+            popupMenu.open(element, 'bpmn-create', position, {
+              title: translate('Create element'),
+              width: 300,
+              search: true
+            });
+          }
+        }
+      }
+    };
   };
 
   var CreateMenuModule = {
@@ -160079,194 +160089,194 @@
     return ALL_OPTIONS;
   }
 
-  /**
-   * A replace menu provider that allows to replace elements with
-   * templates applied with the correspondent plain element.
-   */
-  function RemoveTemplateReplaceProvider(popupMenu, translate, elementTemplates) {
-
-    this._popupMenu = popupMenu;
-    this._translate = translate;
-    this._elementTemplates = elementTemplates;
-
-    this.register();
-  }
-
-  RemoveTemplateReplaceProvider.$inject = [
-    'popupMenu',
-    'translate',
-    'elementTemplates'
-  ];
-
-  /**
-   * Register replace menu provider in the popup menu
-   */
-  RemoveTemplateReplaceProvider.prototype.register = function() {
-    this._popupMenu.registerProvider('bpmn-replace', this);
-  };
-
-  /**
-   * Adds the element templates to the replace menu.
-   * @param {djs.model.Base} element
-   *
-   * @returns {Object}
-   */
-  RemoveTemplateReplaceProvider.prototype.getPopupMenuEntries = function(element) {
-
-    return (entries) => {
-
-      // convert our entries into something sortable
-      let entrySet = Object.entries(entries);
-
-      if (this._elementTemplates && this._elementTemplates.get(element)) {
-
-        // add remove template option
-        this.addPlainElementEntry(element, entrySet, this._translate, this._elementTemplates);
-      }
-
-      // convert back to object
-      return entrySet.reduce((entries, [ key, value ]) => {
-        entries[key] = value;
-
-        return entries;
-      }, {});
-    };
-  };
-
-
-  /**
-   * Adds the option to replace with plain element (remove template).
-   *
-   * @param {djs.model.Base} element
-   * @param {Array<Object>} entries
-   */
-  RemoveTemplateReplaceProvider.prototype.addPlainElementEntry = function(element, entries, translate, elementTemplates) {
-
-    const replaceOption = this.getPlainEntry(element, entries, translate, elementTemplates);
-
-    if (!replaceOption) {
-      return;
-    }
-
-    const [
-      insertIndex,
-      entry
-    ] = replaceOption;
-
-    // insert remove entry
-    entries.splice(insertIndex, 0, [ entry.id, entry ]);
-  };
-
-  /**
-   * Returns the option to replace with plain element and the index where it should be inserted.
-   *
-   * @param {djs.model.Base} element
-   * @param {Array<Object>} entries
-   *
-   * @returns {Array<Object, number>}
-   */
-  RemoveTemplateReplaceProvider.prototype.getPlainEntry = function(element, entries, translate, elementTemplates) {
-
-    const {
-      options,
-      option,
-      optionIndex
-    } = findReplaceOptions(element) || { };
-
-    if (!options) {
-      return null;
-    }
-
-    const entry = {
-      id: 'replace-remove-element-template',
-      action: () => {
-        elementTemplates.removeTemplate(element);
-      },
-      label: translate(option.label),
-      className: option.className
-    };
-
-    // insert after previous option, if it exists
-    const previousIndex = getOptionIndex(options, optionIndex - 1, entries);
-
-    if (previousIndex) {
-      return [
-        previousIndex + 1,
-        entry
-      ];
-    }
-
-    // insert before next option, if it exists
-    const nextIndex = getOptionIndex(options, optionIndex + 1, entries);
-
-    if (nextIndex) {
-      return [
-        nextIndex,
-        entry
-      ];
-    }
-
-    // fallback to insert at start
-    return [
-      0,
-      entry
-    ];
-  };
-
-
-  /**
-   * @param {ModdleElement} element
-   *
-   * @return { { options: Array<any>, option: any, optionIndex: number } | null }
-   */
-  function findReplaceOptions(element) {
-
-    const isSameType = (element, option) => option.target && !isDifferentType(element)(option);
-
-    return getReplaceOptionGroups().reduce((result, options) => {
-
-      if (result) {
-        return result;
-      }
-
-      const optionIndex = options.findIndex(option => isSameType(element, option));
-
-      if (optionIndex === -1) {
-        return;
-      }
-
-      return {
-        options,
-        option: options[optionIndex],
-        optionIndex
-      };
-    }, null);
-  }
-
-  function getOptionIndex(options, index, entries) {
-    const option = options[index];
-
-    if (!option) {
-      return false;
-    }
-
-    return entries.findIndex(
-      ([ key ]) => key === option.actionName
-    );
+  /**
+   * A replace menu provider that allows to replace elements with
+   * templates applied with the correspondent plain element.
+   */
+  function RemoveTemplateReplaceProvider(popupMenu, translate, elementTemplates) {
+
+    this._popupMenu = popupMenu;
+    this._translate = translate;
+    this._elementTemplates = elementTemplates;
+
+    this.register();
+  }
+
+  RemoveTemplateReplaceProvider.$inject = [
+    'popupMenu',
+    'translate',
+    'elementTemplates'
+  ];
+
+  /**
+   * Register replace menu provider in the popup menu
+   */
+  RemoveTemplateReplaceProvider.prototype.register = function() {
+    this._popupMenu.registerProvider('bpmn-replace', this);
+  };
+
+  /**
+   * Adds the element templates to the replace menu.
+   * @param {djs.model.Base} element
+   *
+   * @returns {Object}
+   */
+  RemoveTemplateReplaceProvider.prototype.getPopupMenuEntries = function(element) {
+
+    return (entries) => {
+
+      // convert our entries into something sortable
+      let entrySet = Object.entries(entries);
+
+      if (this._elementTemplates && this._elementTemplates.get(element)) {
+
+        // add remove template option
+        this.addPlainElementEntry(element, entrySet, this._translate, this._elementTemplates);
+      }
+
+      // convert back to object
+      return entrySet.reduce((entries, [ key, value ]) => {
+        entries[key] = value;
+
+        return entries;
+      }, {});
+    };
+  };
+
+
+  /**
+   * Adds the option to replace with plain element (remove template).
+   *
+   * @param {djs.model.Base} element
+   * @param {Array<Object>} entries
+   */
+  RemoveTemplateReplaceProvider.prototype.addPlainElementEntry = function(element, entries, translate, elementTemplates) {
+
+    const replaceOption = this.getPlainEntry(element, entries, translate, elementTemplates);
+
+    if (!replaceOption) {
+      return;
+    }
+
+    const [
+      insertIndex,
+      entry
+    ] = replaceOption;
+
+    // insert remove entry
+    entries.splice(insertIndex, 0, [ entry.id, entry ]);
+  };
+
+  /**
+   * Returns the option to replace with plain element and the index where it should be inserted.
+   *
+   * @param {djs.model.Base} element
+   * @param {Array<Object>} entries
+   *
+   * @returns {Array<Object, number>}
+   */
+  RemoveTemplateReplaceProvider.prototype.getPlainEntry = function(element, entries, translate, elementTemplates) {
+
+    const {
+      options,
+      option,
+      optionIndex
+    } = findReplaceOptions(element) || { };
+
+    if (!options) {
+      return null;
+    }
+
+    const entry = {
+      id: 'replace-remove-element-template',
+      action: () => {
+        elementTemplates.removeTemplate(element);
+      },
+      label: translate(option.label),
+      className: option.className
+    };
+
+    // insert after previous option, if it exists
+    const previousIndex = getOptionIndex(options, optionIndex - 1, entries);
+
+    if (previousIndex) {
+      return [
+        previousIndex + 1,
+        entry
+      ];
+    }
+
+    // insert before next option, if it exists
+    const nextIndex = getOptionIndex(options, optionIndex + 1, entries);
+
+    if (nextIndex) {
+      return [
+        nextIndex,
+        entry
+      ];
+    }
+
+    // fallback to insert at start
+    return [
+      0,
+      entry
+    ];
+  };
+
+
+  /**
+   * @param {ModdleElement} element
+   *
+   * @return { { options: Array<any>, option: any, optionIndex: number } | null }
+   */
+  function findReplaceOptions(element) {
+
+    const isSameType = (element, option) => option.target && !isDifferentType(element)(option);
+
+    return getReplaceOptionGroups().reduce((result, options) => {
+
+      if (result) {
+        return result;
+      }
+
+      const optionIndex = options.findIndex(option => isSameType(element, option));
+
+      if (optionIndex === -1) {
+        return;
+      }
+
+      return {
+        options,
+        option: options[optionIndex],
+        optionIndex
+      };
+    }, null);
+  }
+
+  function getOptionIndex(options, index, entries) {
+    const option = options[index];
+
+    if (!option) {
+      return false;
+    }
+
+    return entries.findIndex(
+      ([ key ]) => key === option.actionName
+    );
   }
 
-  var RemoveTemplatesModule = {
-    __init__: [ 'removeTemplateReplaceProvider' ],
-    removeTemplateReplaceProvider: [ 'type', RemoveTemplateReplaceProvider ]
+  var RemoveTemplatesModule = {
+    __init__: [ 'removeTemplateReplaceProvider' ],
+    removeTemplateReplaceProvider: [ 'type', RemoveTemplateReplaceProvider ]
   };
 
-  var index = {
-    __depends__: [
-      AppendElementTemplatesModule,
-      CreateElementTemplatesModule,
-      ReplaceElementTemplatesModule,
-      RemoveTemplatesModule
-    ]
+  var index = {
+    __depends__: [
+      AppendElementTemplatesModule,
+      CreateElementTemplatesModule,
+      ReplaceElementTemplatesModule,
+      RemoveTemplatesModule
+    ]
   };
 
   /**