camunda-bpmn-js 0.13.0-alpha.5 → 0.13.0-alpha.6

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

@@ -61543,31 +61543,130 @@
 	}());
 	});
 
+	function C$1(n,t){for(var e in t)n[e]=t[e];return n}function S$1(n,t){for(var e in n)if("__source"!==e&&!(e in t))return !0;for(var r in t)if("__source"!==r&&n[r]!==t[r])return !0;return !1}function E(n){this.props=n;}function g$2(n,t){function e(n){var e=this.props.ref,r=e==n.ref;return !r&&e&&(e.call?e(null):e.current=null),t?!t(this.props,n)||!r:S$1(this.props,n)}function r(t){return this.shouldComponentUpdate=e,a(n,t)}return r.displayName="Memo("+(n.displayName||n.name)+")",r.prototype.isReactComponent=!0,r.__f=!0,r}(E.prototype=new p).isPureReactComponent=!0,E.prototype.shouldComponentUpdate=function(n,t){return S$1(this.props,n)||S$1(this.state,t)};var w$2=n.__b;n.__b=function(n){n.type&&n.type.__f&&n.ref&&(n.props.ref=n.ref,n.ref=null),w$2&&w$2(n);};var R="undefined"!=typeof Symbol&&Symbol.for&&Symbol.for("react.forward_ref")||3911;function x$2(n){function t(t,e){var r=C$1({},t);return delete r.ref,n(r,(e=t.ref||e)&&("object"!=typeof e||"current"in e)?e:null)}return t.$$typeof=R,t.render=t,t.prototype.isReactComponent=t.__f=!0,t.displayName="ForwardRef("+(n.displayName||n.name)+")",t}var N$1=function(n,t){return null==n?null:w(w(n).map(t))},k$2={map:N$1,forEach:N$1,count:function(n){return n?w(n).length:0},only:function(n){var t=w(n);if(1!==t.length)throw "Children.only";return t[0]},toArray:w},A$2=n.__e;n.__e=function(n,t,e){if(n.then)for(var r,u=t;u=u.__;)if((r=u.__c)&&r.__c)return null==t.__e&&(t.__e=e.__e,t.__k=e.__k),r.__c(n,t);A$2(n,t,e);};var O$1=n.unmount;function L$1(){this.__u=0,this.t=null,this.__b=null;}function U(n){var t=n.__.__c;return t&&t.__e&&t.__e(n)}function D(n){var t,e,r;function u(u){if(t||(t=n()).then(function(n){e=n.default||n;},function(n){r=n;}),r)throw r;if(!e)throw t;return a(e,u)}return u.displayName="Lazy",u.__f=!0,u}function F$1(){this.u=null,this.o=null;}n.unmount=function(n){var t=n.__c;t&&t.__R&&t.__R(),t&&!0===n.__h&&(n.type=null),O$1&&O$1(n);},(L$1.prototype=new p).__c=function(n,t){var e=t.__c,r=this;null==r.t&&(r.t=[]),r.t.push(e);var u=U(r.__v),o=!1,i=function(){o||(o=!0,e.__R=null,u?u(l):l());};e.__R=i;var l=function(){if(!--r.__u){if(r.state.__e){var n=r.state.__e;r.__v.__k[0]=function n(t,e,r){return t&&(t.__v=null,t.__k=t.__k&&t.__k.map(function(t){return n(t,e,r)}),t.__c&&t.__c.__P===e&&(t.__e&&r.insertBefore(t.__e,t.__d),t.__c.__e=!0,t.__c.__P=r)),t}(n,n.__c.__P,n.__c.__O);}var t;for(r.setState({__e:r.__b=null});t=r.t.pop();)t.forceUpdate();}},f=!0===t.__h;r.__u++||f||r.setState({__e:r.__b=r.__v.__k[0]}),n.then(i,i);},L$1.prototype.componentWillUnmount=function(){this.t=[];},L$1.prototype.render=function(n,t){if(this.__b){if(this.__v.__k){var e=document.createElement("div"),r=this.__v.__k[0].__c;this.__v.__k[0]=function n(t,e,r){return t&&(t.__c&&t.__c.__H&&(t.__c.__H.__.forEach(function(n){"function"==typeof n.__c&&n.__c();}),t.__c.__H=null),null!=(t=C$1({},t)).__c&&(t.__c.__P===r&&(t.__c.__P=e),t.__c=null),t.__k=t.__k&&t.__k.map(function(t){return n(t,e,r)})),t}(this.__b,e,r.__O=r.__P);}this.__b=null;}var u=t.__e&&a(y,null,n.fallback);return u&&(u.__h=null),[a(y,null,t.__e?null:n.children),u]};var M$1=function(n,t,e){if(++e[1]===e[0]&&n.o.delete(t),n.props.revealOrder&&("t"!==n.props.revealOrder[0]||!n.o.size))for(e=n.u;e;){for(;e.length>3;)e.pop()();if(e[1]<e[0])break;n.u=e=e[2];}};function T$2(n){return this.getChildContext=function(){return n.context},n.children}function j$2(n){var t=this,e=n.i;t.componentWillUnmount=function(){N(null,t.l),t.l=null,t.i=null;},t.i&&t.i!==e&&t.componentWillUnmount(),n.__v?(t.l||(t.i=e,t.l={nodeType:1,parentNode:e,childNodes:[],appendChild:function(n){this.childNodes.push(n),t.i.appendChild(n);},insertBefore:function(n,e){this.childNodes.push(n),t.i.appendChild(n);},removeChild:function(n){this.childNodes.splice(this.childNodes.indexOf(n)>>>1,1),t.i.removeChild(n);}}),N(a(T$2,{context:t.context},n.__v),t.l)):t.l&&t.componentWillUnmount();}function I$1(n,t){return a(j$2,{__v:n,i:t})}(F$1.prototype=new p).__e=function(n){var t=this,e=U(t.__v),r=t.o.get(n);return r[0]++,function(u){var o=function(){t.props.revealOrder?(r.push(u),M$1(t,n,r)):u();};e?e(o):o();}},F$1.prototype.render=function(n){this.u=null,this.o=new Map;var t=w(n.children);n.revealOrder&&"b"===n.revealOrder[0]&&t.reverse();for(var e=t.length;e--;)this.o.set(t[e],this.u=[1,0,this.u]);return n.children},F$1.prototype.componentDidUpdate=F$1.prototype.componentDidMount=function(){var n=this;this.o.forEach(function(t,e){M$1(n,e,t);});};var W="undefined"!=typeof Symbol&&Symbol.for&&Symbol.for("react.element")||60103,P$1=/^(?:accent|alignment|arabic|baseline|cap|clip(?!PathU)|color|fill|flood|font|glyph(?!R)|horiz|marker(?!H|W|U)|overline|paint|stop|strikethrough|stroke|text(?!L)|underline|unicode|units|v|vector|vert|word|writing|x(?!C))[A-Z]/,V=function(n){return ("undefined"!=typeof Symbol&&"symbol"==typeof Symbol()?/fil|che|rad/i:/fil|che|ra/i).test(n)};function z$1(n,t,e){return null==t.__k&&(t.textContent=""),N(n,t),"function"==typeof e&&e(),n?n.__c:null}function B(n,t,e){return O(n,t),"function"==typeof e&&e(),n?n.__c:null}p.prototype.isReactComponent={},["componentWillMount","componentWillReceiveProps","componentWillUpdate"].forEach(function(n){Object.defineProperty(p.prototype,n,{configurable:!0,get:function(){return this["UNSAFE_"+n]},set:function(t){Object.defineProperty(this,n,{configurable:!0,writable:!0,value:t});}});});var H$1=n.event;function Z(){}function Y(){return this.cancelBubble}function $$1(){return this.defaultPrevented}n.event=function(n){return H$1&&(n=H$1(n)),n.persist=Z,n.isPropagationStopped=Y,n.isDefaultPrevented=$$1,n.nativeEvent=n};var q$1,G={configurable:!0,get:function(){return this.class}},J=n.vnode;n.vnode=function(n){var t=n.type,e=n.props,r=e;if("string"==typeof t){for(var u in r={},e){var o=e[u];"value"===u&&"defaultValue"in e&&null==o||("defaultValue"===u&&"value"in e&&null==e.value?u="value":"download"===u&&!0===o?o="":/ondoubleclick/i.test(u)?u="ondblclick":/^onchange(textarea|input)/i.test(u+t)&&!V(e.type)?u="oninput":/^on(Ani|Tra|Tou|BeforeInp)/.test(u)?u=u.toLowerCase():P$1.test(u)?u=u.replace(/[A-Z0-9]/,"-$&").toLowerCase():null===o&&(o=void 0),r[u]=o);}"select"==t&&r.multiple&&Array.isArray(r.value)&&(r.value=w(e.children).forEach(function(n){n.props.selected=-1!=r.value.indexOf(n.props.value);})),"select"==t&&null!=r.defaultValue&&(r.value=w(e.children).forEach(function(n){n.props.selected=r.multiple?-1!=r.defaultValue.indexOf(n.props.value):r.defaultValue==n.props.value;})),n.props=r;}t&&e.class!=e.className&&(G.enumerable="className"in e,null!=e.className&&(r.class=e.className),Object.defineProperty(r,"className",G)),n.$$typeof=W,J&&J(n);};var K=n.__r;n.__r=function(n){K&&K(n),q$1=n.__c;};var Q={ReactCurrentDispatcher:{current:{readContext:function(n){return q$1.__n[n.__c].props.value}}}};"object"==typeof performance&&"function"==typeof performance.now?performance.now.bind(performance):function(){return Date.now()};function fn(n){return a.bind(null,n)}function cn(n){return !!n&&n.$$typeof===W}function an(n){return cn(n)?S.apply(null,arguments):n}function sn(n){return !!n.__k&&(N(null,n),!0)}function hn(n){return n&&(n.base||1===n.nodeType&&n)||null}var pn=function(n,t){return n(t)};var React = {useState:l,useReducer:p$1,useEffect:y$1,useLayoutEffect:h$1,useRef:s$1,useImperativeHandle:_$1,useMemo:d$1,useCallback:A$1,useContext:F,useDebugValue:T$1,version:"16.8.0",Children:k$2,render:z$1,hydrate:B,unmountComponentAtNode:sn,createPortal:I$1,createElement:a,createContext:q,createFactory:fn,cloneElement:an,createRef:h,Fragment:y,isValidElement:cn,findDOMNode:hn,Component:p,PureComponent:E,memo:g$2,forwardRef:x$2,unstable_batchedUpdates:pn,StrictMode:y,Suspense:L$1,SuspenseList:F$1,lazy:D,__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED:Q};
+
 	function o$2(_,o,e,n$1,t){var f={};for(var l in o)"ref"!=l&&(f[l]=o[l]);var s,u,a={type:_,props:f,key:e,ref:o&&o.ref,__k:null,__:null,__b:0,__e:null,__d:void 0,__c:null,__h:null,constructor:void 0,__v:++n.__v,__source:n$1,__self:t};if("function"==typeof _&&(s=_.defaultProps))for(u in s)void 0===f[u]&&(f[u]=s[u]);return n.vnode&&n.vnode(a),a}
 
-	function C$1(n,t){for(var e in t)n[e]=t[e];return n}function S$1(n,t){for(var e in n)if("__source"!==e&&!(e in t))return !0;for(var r in t)if("__source"!==r&&n[r]!==t[r])return !0;return !1}function E(n){this.props=n;}function g$2(n,t){function e(n){var e=this.props.ref,r=e==n.ref;return !r&&e&&(e.call?e(null):e.current=null),t?!t(this.props,n)||!r:S$1(this.props,n)}function r(t){return this.shouldComponentUpdate=e,a(n,t)}return r.displayName="Memo("+(n.displayName||n.name)+")",r.prototype.isReactComponent=!0,r.__f=!0,r}(E.prototype=new p).isPureReactComponent=!0,E.prototype.shouldComponentUpdate=function(n,t){return S$1(this.props,n)||S$1(this.state,t)};var w$2=n.__b;n.__b=function(n){n.type&&n.type.__f&&n.ref&&(n.props.ref=n.ref,n.ref=null),w$2&&w$2(n);};var R="undefined"!=typeof Symbol&&Symbol.for&&Symbol.for("react.forward_ref")||3911;function x$2(n){function t(t,e){var r=C$1({},t);return delete r.ref,n(r,(e=t.ref||e)&&("object"!=typeof e||"current"in e)?e:null)}return t.$$typeof=R,t.render=t,t.prototype.isReactComponent=t.__f=!0,t.displayName="ForwardRef("+(n.displayName||n.name)+")",t}var N$1=function(n,t){return null==n?null:w(w(n).map(t))},k$2={map:N$1,forEach:N$1,count:function(n){return n?w(n).length:0},only:function(n){var t=w(n);if(1!==t.length)throw "Children.only";return t[0]},toArray:w},A$2=n.__e;n.__e=function(n,t,e){if(n.then)for(var r,u=t;u=u.__;)if((r=u.__c)&&r.__c)return null==t.__e&&(t.__e=e.__e,t.__k=e.__k),r.__c(n,t);A$2(n,t,e);};var O$1=n.unmount;function L$1(){this.__u=0,this.t=null,this.__b=null;}function U(n){var t=n.__.__c;return t&&t.__e&&t.__e(n)}function D(n){var t,e,r;function u(u){if(t||(t=n()).then(function(n){e=n.default||n;},function(n){r=n;}),r)throw r;if(!e)throw t;return a(e,u)}return u.displayName="Lazy",u.__f=!0,u}function F$1(){this.u=null,this.o=null;}n.unmount=function(n){var t=n.__c;t&&t.__R&&t.__R(),t&&!0===n.__h&&(n.type=null),O$1&&O$1(n);},(L$1.prototype=new p).__c=function(n,t){var e=t.__c,r=this;null==r.t&&(r.t=[]),r.t.push(e);var u=U(r.__v),o=!1,i=function(){o||(o=!0,e.__R=null,u?u(l):l());};e.__R=i;var l=function(){if(!--r.__u){if(r.state.__e){var n=r.state.__e;r.__v.__k[0]=function n(t,e,r){return t&&(t.__v=null,t.__k=t.__k&&t.__k.map(function(t){return n(t,e,r)}),t.__c&&t.__c.__P===e&&(t.__e&&r.insertBefore(t.__e,t.__d),t.__c.__e=!0,t.__c.__P=r)),t}(n,n.__c.__P,n.__c.__O);}var t;for(r.setState({__e:r.__b=null});t=r.t.pop();)t.forceUpdate();}},f=!0===t.__h;r.__u++||f||r.setState({__e:r.__b=r.__v.__k[0]}),n.then(i,i);},L$1.prototype.componentWillUnmount=function(){this.t=[];},L$1.prototype.render=function(n,t){if(this.__b){if(this.__v.__k){var e=document.createElement("div"),r=this.__v.__k[0].__c;this.__v.__k[0]=function n(t,e,r){return t&&(t.__c&&t.__c.__H&&(t.__c.__H.__.forEach(function(n){"function"==typeof n.__c&&n.__c();}),t.__c.__H=null),null!=(t=C$1({},t)).__c&&(t.__c.__P===r&&(t.__c.__P=e),t.__c=null),t.__k=t.__k&&t.__k.map(function(t){return n(t,e,r)})),t}(this.__b,e,r.__O=r.__P);}this.__b=null;}var u=t.__e&&a(y,null,n.fallback);return u&&(u.__h=null),[a(y,null,t.__e?null:n.children),u]};var M$1=function(n,t,e){if(++e[1]===e[0]&&n.o.delete(t),n.props.revealOrder&&("t"!==n.props.revealOrder[0]||!n.o.size))for(e=n.u;e;){for(;e.length>3;)e.pop()();if(e[1]<e[0])break;n.u=e=e[2];}};function T$2(n){return this.getChildContext=function(){return n.context},n.children}function j$2(n){var t=this,e=n.i;t.componentWillUnmount=function(){N(null,t.l),t.l=null,t.i=null;},t.i&&t.i!==e&&t.componentWillUnmount(),n.__v?(t.l||(t.i=e,t.l={nodeType:1,parentNode:e,childNodes:[],appendChild:function(n){this.childNodes.push(n),t.i.appendChild(n);},insertBefore:function(n,e){this.childNodes.push(n),t.i.appendChild(n);},removeChild:function(n){this.childNodes.splice(this.childNodes.indexOf(n)>>>1,1),t.i.removeChild(n);}}),N(a(T$2,{context:t.context},n.__v),t.l)):t.l&&t.componentWillUnmount();}function I$1(n,t){return a(j$2,{__v:n,i:t})}(F$1.prototype=new p).__e=function(n){var t=this,e=U(t.__v),r=t.o.get(n);return r[0]++,function(u){var o=function(){t.props.revealOrder?(r.push(u),M$1(t,n,r)):u();};e?e(o):o();}},F$1.prototype.render=function(n){this.u=null,this.o=new Map;var t=w(n.children);n.revealOrder&&"b"===n.revealOrder[0]&&t.reverse();for(var e=t.length;e--;)this.o.set(t[e],this.u=[1,0,this.u]);return n.children},F$1.prototype.componentDidUpdate=F$1.prototype.componentDidMount=function(){var n=this;this.o.forEach(function(t,e){M$1(n,e,t);});};var W="undefined"!=typeof Symbol&&Symbol.for&&Symbol.for("react.element")||60103,P$1=/^(?:accent|alignment|arabic|baseline|cap|clip(?!PathU)|color|fill|flood|font|glyph(?!R)|horiz|marker(?!H|W|U)|overline|paint|stop|strikethrough|stroke|text(?!L)|underline|unicode|units|v|vector|vert|word|writing|x(?!C))[A-Z]/,V=function(n){return ("undefined"!=typeof Symbol&&"symbol"==typeof Symbol()?/fil|che|rad/i:/fil|che|ra/i).test(n)};function z$1(n,t,e){return null==t.__k&&(t.textContent=""),N(n,t),"function"==typeof e&&e(),n?n.__c:null}function B(n,t,e){return O(n,t),"function"==typeof e&&e(),n?n.__c:null}p.prototype.isReactComponent={},["componentWillMount","componentWillReceiveProps","componentWillUpdate"].forEach(function(n){Object.defineProperty(p.prototype,n,{configurable:!0,get:function(){return this["UNSAFE_"+n]},set:function(t){Object.defineProperty(this,n,{configurable:!0,writable:!0,value:t});}});});var H$1=n.event;function Z(){}function Y(){return this.cancelBubble}function $$1(){return this.defaultPrevented}n.event=function(n){return H$1&&(n=H$1(n)),n.persist=Z,n.isPropagationStopped=Y,n.isDefaultPrevented=$$1,n.nativeEvent=n};var q$1,G={configurable:!0,get:function(){return this.class}},J=n.vnode;n.vnode=function(n){var t=n.type,e=n.props,r=e;if("string"==typeof t){for(var u in r={},e){var o=e[u];"value"===u&&"defaultValue"in e&&null==o||("defaultValue"===u&&"value"in e&&null==e.value?u="value":"download"===u&&!0===o?o="":/ondoubleclick/i.test(u)?u="ondblclick":/^onchange(textarea|input)/i.test(u+t)&&!V(e.type)?u="oninput":/^on(Ani|Tra|Tou|BeforeInp)/.test(u)?u=u.toLowerCase():P$1.test(u)?u=u.replace(/[A-Z0-9]/,"-$&").toLowerCase():null===o&&(o=void 0),r[u]=o);}"select"==t&&r.multiple&&Array.isArray(r.value)&&(r.value=w(e.children).forEach(function(n){n.props.selected=-1!=r.value.indexOf(n.props.value);})),"select"==t&&null!=r.defaultValue&&(r.value=w(e.children).forEach(function(n){n.props.selected=r.multiple?-1!=r.defaultValue.indexOf(n.props.value):r.defaultValue==n.props.value;})),n.props=r;}t&&e.class!=e.className&&(G.enumerable="className"in e,null!=e.className&&(r.class=e.className),Object.defineProperty(r,"className",G)),n.$$typeof=W,J&&J(n);};var K=n.__r;n.__r=function(n){K&&K(n),q$1=n.__c;};var Q={ReactCurrentDispatcher:{current:{readContext:function(n){return q$1.__n[n.__c].props.value}}}};"object"==typeof performance&&"function"==typeof performance.now?performance.now.bind(performance):function(){return Date.now()};function fn(n){return a.bind(null,n)}function cn(n){return !!n&&n.$$typeof===W}function an(n){return cn(n)?S.apply(null,arguments):n}function sn(n){return !!n.__k&&(N(null,n),!0)}function hn(n){return n&&(n.base||1===n.nodeType&&n)||null}var pn=function(n,t){return n(t)};var React = {useState:l,useReducer:p$1,useEffect:y$1,useLayoutEffect:h$1,useRef:s$1,useImperativeHandle:_$1,useMemo:d$1,useCallback:A$1,useContext:F,useDebugValue:T$1,version:"16.8.0",Children:k$2,render:z$1,hydrate:B,unmountComponentAtNode:sn,createPortal:I$1,createElement:a,createContext:q,createFactory:fn,cloneElement:an,createRef:h,Fragment:y,isValidElement:cn,findDOMNode:hn,Component:p,PureComponent:E,memo:g$2,forwardRef:x$2,unstable_batchedUpdates:pn,StrictMode:y,Suspense:L$1,SuspenseList:F$1,lazy:D,__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED:Q};
+	var ArrowIcon = function ArrowIcon(props) {
+	  return o$2("svg", { ...props,
+	    children: o$2("path", {
+	      fillRule: "evenodd",
+	      d: "m11.657 8-4.95 4.95a1 1 0 0 1-1.414-1.414L8.828 8 5.293 4.464A1 1 0 1 1 6.707 3.05L11.657 8z"
+	    })
+	  });
+	};
 
-	/**
-	 * @typedef { { getElementLabel: Function, getTypeLabel: Function, getElementIcon: Function } } HeaderProvider
-	 */
+	ArrowIcon.defaultProps = {
+	  xmlns: "http://www.w3.org/2000/svg",
+	  width: "16",
+	  height: "16"
+	};
+
+	var CreateIcon = function CreateIcon(props) {
+	  return o$2("svg", { ...props,
+	    children: o$2("path", {
+	      fillRule: "evenodd",
+	      d: "M9 13V9h4a1 1 0 0 0 0-2H9V3a1 1 0 1 0-2 0v4H3a1 1 0 1 0 0 2h4v4a1 1 0 0 0 2 0z"
+	    })
+	  });
+	};
+
+	CreateIcon.defaultProps = {
+	  xmlns: "http://www.w3.org/2000/svg",
+	  width: "16",
+	  height: "16"
+	};
+
+	var DeleteIcon = function DeleteIcon(props) {
+	  return o$2("svg", { ...props,
+	    children: o$2("path", {
+	      fillRule: "evenodd",
+	      d: "M12 6v7c0 1.1-.4 1.55-1.5 1.55h-5C4.4 14.55 4 14.1 4 13V6h8zm-1.5 1.5h-5v4.3c0 .66.5 1.2 1.111 1.2H9.39c.611 0 1.111-.54 1.111-1.2V7.5zM13 3h-2l-1-1H6L5 3H3v1.5h10V3z"
+	    })
+	  });
+	};
+
+	DeleteIcon.defaultProps = {
+	  xmlns: "http://www.w3.org/2000/svg",
+	  width: "16",
+	  height: "16"
+	};
+
+	var ExternalLinkIcon = function ExternalLinkIcon(props) {
+	  return o$2("svg", { ...props,
+	    children: o$2("path", {
+	      fillRule: "evenodd",
+	      clipRule: "evenodd",
+	      d: "M12.637 12.637v-4.72h1.362v4.721c0 .36-.137.676-.411.95-.275.275-.591.412-.95.412H3.362c-.38 0-.703-.132-.967-.396A1.315 1.315 0 0 1 2 12.638V3.362c0-.38.132-.703.396-.967S2.982 2 3.363 2h4.553v1.363H3.363v9.274h9.274zM14 2H9.28l-.001 1.362h2.408L5.065 9.984l.95.95 6.622-6.622v2.409H14V2z",
+	      fill: "#818798"
+	    })
+	  });
+	};
+
+	ExternalLinkIcon.defaultProps = {
+	  width: "16",
+	  height: "16",
+	  fill: "none",
+	  xmlns: "http://www.w3.org/2000/svg"
+	};
+
+	var FeelRequiredIcon = function FeelRequiredIcon(props) {
+	  return o$2("svg", { ...props,
+	    children: [o$2("path", {
+	      d: "M5.8 7.06V5.95h4.307v1.11H5.8zm0 3.071v-1.11h4.307v1.11H5.8z",
+	      fill: "#505562"
+	    }), o$2("path", {
+	      fillRule: "evenodd",
+	      clipRule: "evenodd",
+	      d: "M8 3.268A4.732 4.732 0 1 0 12.732 8H14a6 6 0 1 1-6-6v1.268z",
+	      fill: "#505562"
+	    }), o$2("path", {
+	      d: "m11.28 6.072-.832-.56 1.016-1.224L10 3.848l.312-.912 1.392.584L11.632 2h1.032l-.072 1.52 1.392-.584.312.912-1.464.44 1.008 1.224-.832.552-.864-1.296-.864 1.304z",
+	      fill: "#505562"
+	    })]
+	  });
+	};
+
+	FeelRequiredIcon.defaultProps = {
+	  viewBox: "0 0 16 16",
+	  fill: "none",
+	  xmlns: "http://www.w3.org/2000/svg"
+	};
+
+	var FeelOptionalIcon = function FeelOptionalIcon(props) {
+	  return o$2("svg", { ...props,
+	    children: [o$2("path", {
+	      d: "M5.845 7.04V5.93h4.307v1.11H5.845zm0 3.07V9h4.307v1.11H5.845z",
+	      fill: "#505562"
+	    }), o$2("path", {
+	      fillRule: "evenodd",
+	      clipRule: "evenodd",
+	      d: "M3.286 8a4.714 4.714 0 1 0 9.428 0 4.714 4.714 0 0 0-9.428 0zM8 2a6 6 0 1 0 0 12A6 6 0 0 0 8 2z",
+	      fill: "#505562"
+	    })]
+	  });
+	};
+
+	FeelOptionalIcon.defaultProps = {
+	  viewBox: "0 0 16 16",
+	  fill: "none",
+	  xmlns: "http://www.w3.org/2000/svg"
+	};
 
-	/**
-	 * @param {Object} props
-	 * @param {Object} props.element,
-	 * @param {HeaderProvider} props.headerProvider
-	 */
 	function Header(props) {
 	  const {
 	    element,
 	    headerProvider
 	  } = props;
 	  const {
+	    getElementIcon,
+	    getDocumentationRef,
 	    getElementLabel,
-	    getTypeLabel,
-	    getElementIcon
+	    getTypeLabel
 	  } = headerProvider;
 	  const label = getElementLabel(element);
 	  const type = getTypeLabel(element);
+	  const documentationRef = getDocumentationRef && getDocumentationRef(element);
 	  const ElementIcon = getElementIcon(element);
 	  return o$2("div", {
 	    class: "bio-properties-panel-header",
@@ -61584,28 +61683,154 @@
 	        title: type,
 	        class: "bio-properties-panel-header-type",
 	        children: type
-	      }), getElementLabel(element) ? o$2("div", {
+	      }), label ? o$2("div", {
 	        title: label,
 	        class: "bio-properties-panel-header-label",
 	        children: label
 	      }) : null]
+	    }), o$2("div", {
+	      class: "bio-properties-panel-header-actions",
+	      children: documentationRef ? o$2("a", {
+	        rel: "noopener",
+	        class: "bio-properties-panel-header-link",
+	        href: documentationRef,
+	        title: "Open documentation",
+	        target: "_blank",
+	        children: o$2(ExternalLinkIcon, {})
+	      }) : null
 	    })]
 	  });
 	}
 
+	const DescriptionContext = q({
+	  description: {},
+	  getDescriptionForId: () => {}
+	});
+
+	/**
+	 * @typedef {Function} <propertiesPanel.showEntry> callback
+	 *
+	 * @example
+	 *
+	 * useEvent('propertiesPanel.showEntry', ({ focus = false, ...rest }) => {
+	 *   // ...
+	 * });
+	 *
+	 * @param {Object} context
+	 * @param {boolean} [context.focus]
+	 *
+	 * @returns void
+	 */
+	const EventContext = q({
+	  eventBus: null
+	});
+
+	const LayoutContext = q({
+	  layout: {},
+	  setLayout: () => {},
+	  getLayoutForKey: () => {},
+	  setLayoutForKey: () => {}
+	});
+
+	/**
+	 * Accesses the global DescriptionContext and returns a description for a given id and element.
+	 *
+	 * @example
+	 * ```jsx
+	 * function TextField(props) {
+	 *   const description = useDescriptionContext('input1', element);
+	 * }
+	 * ```
+	 *
+	 * @param {string} id
+	 * @param {djs.model.Base} element
+	 *
+	 * @returns {string}
+	 */
+
+	function useDescriptionContext(id, element) {
+	  const {
+	    getDescriptionForId
+	  } = F(DescriptionContext);
+	  return getDescriptionForId(id, element);
+	}
+
+	const DEFAULT_PRIORITY$6 = 1000;
 	/**
-	 * @pinussilvestrus: we need to introduce our own hook to persist the previous
-	 * state on updates.
+	 * Subscribe to an event.
 	 *
-	 * cf. https://reactjs.org/docs/hooks-faq.html#how-to-get-the-previous-props-or-state
+	 * @param {string} event
+	 * @param {Function} callback
+	 * @param {number} [priority]
+	 *
+	 * @returns {import('preact').Ref}
 	 */
 
-	function usePrevious(value) {
-	  const ref = s$1();
+	function useEvent(event, callback, priority = DEFAULT_PRIORITY$6) {
+	  const {
+	    eventBus
+	  } = F(EventContext);
 	  y$1(() => {
-	    ref.current = value;
+	    if (!eventBus) {
+	      return;
+	    }
+
+	    eventBus.on(event, priority, callback);
+	    return () => eventBus.off(event, callback);
+	  }, [callback, event, eventBus, priority]);
+	}
+
+	const HIGH_PRIORITY$l = 10000;
+	/**
+	 * Buffer events and re-fire during passive effect phase.
+	 *
+	 * @param {string[]} bufferedEvents
+	 * @param {Object} [eventBus]
+	 */
+
+	function useEventBuffer(bufferedEvents, eventBus) {
+	  const buffer = s$1([]),
+	        buffering = s$1(true);
+
+	  const createCallback = event => data => {
+	    if (buffering.current === true) {
+	      buffer.current.unshift([event, data]);
+	    }
+	  }; // (1) buffer events
+
+
+	  y$1(() => {
+	    if (!eventBus) {
+	      return;
+	    }
+
+	    const listeners = bufferedEvents.map(event => {
+	      return [event, createCallback(event)];
+	    });
+	    listeners.forEach(([event, callback]) => {
+	      eventBus.on(event, HIGH_PRIORITY$l, callback);
+	    });
+	    return () => {
+	      listeners.forEach(([event, callback]) => {
+	        eventBus.off(event, callback);
+	      });
+	    };
+	  }, [bufferedEvents, eventBus]); // (2) re-fire events
+
+	  y$1(() => {
+	    if (!eventBus) {
+	      return;
+	    }
+
+	    buffering.current = false;
+
+	    while (buffer.current.length) {
+	      const [event, data] = buffer.current.pop();
+	      eventBus.fire(event, data);
+	    }
+
+	    buffering.current = true;
 	  });
-	  return ref.current;
 	}
 
 	const KEY_LENGTH = 6;
@@ -61646,18 +61871,6 @@
 	  return getKey;
 	}
 
-	const DescriptionContext = q({
-	  description: {},
-	  getDescriptionForId: () => {}
-	});
-
-	const LayoutContext = q({
-	  layout: {},
-	  setLayout: () => {},
-	  getLayoutForKey: () => {},
-	  setLayoutForKey: () => {}
-	});
-
 	/**
 	 * Creates a state that persists in the global LayoutContext.
 	 *
@@ -61693,124 +61906,104 @@
 	}
 
 	/**
-	 * Accesses the global DescriptionContext and returns a description for a given id and element.
-	 *
-	 * @example
-	 * ```jsx
-	 * function TextField(props) {
-	 *   const description = useDescriptionContext('input1', element);
-	 * }
-	 * ```
-	 *
-	 * @param {string} id
-	 * @param {djs.model.Base} element
+	 * @pinussilvestrus: we need to introduce our own hook to persist the previous
+	 * state on updates.
 	 *
-	 * @returns {string}
+	 * cf. https://reactjs.org/docs/hooks-faq.html#how-to-get-the-previous-props-or-state
 	 */
 
-	function useDescriptionContext(id, element) {
-	  const {
-	    getDescriptionForId
-	  } = F(DescriptionContext);
-	  return getDescriptionForId(id, element);
-	}
-
-	var ArrowIcon = function ArrowIcon(props) {
-	  return o$2("svg", { ...props,
-	    children: o$2("path", {
-	      fillRule: "evenodd",
-	      d: "m11.657 8-4.95 4.95a1 1 0 0 1-1.414-1.414L8.828 8 5.293 4.464A1 1 0 1 1 6.707 3.05L11.657 8z"
-	    })
+	function usePrevious(value) {
+	  const ref = s$1();
+	  y$1(() => {
+	    ref.current = value;
 	  });
-	};
+	  return ref.current;
+	}
 
-	ArrowIcon.defaultProps = {
-	  xmlns: "http://www.w3.org/2000/svg",
-	  width: "16",
-	  height: "16"
-	};
+	/**
+	 * Subscribe to `propertiesPanel.showEntry`.
+	 *
+	 * @param {Function} show
+	 *
+	 * @returns {import('preact').Ref}
+	 */
 
-	var CreateIcon = function CreateIcon(props) {
-	  return o$2("svg", { ...props,
-	    children: o$2("path", {
-	      fillRule: "evenodd",
-	      d: "M9 13V9h4a1 1 0 0 0 0-2H9V3a1 1 0 1 0-2 0v4H3a1 1 0 1 0 0 2h4v4a1 1 0 0 0 2 0z"
-	    })
-	  });
-	};
+	function useShowEntryEvent(show) {
+	  const {
+	    onShow
+	  } = F(LayoutContext);
+	  const ref = s$1();
+	  const [focus, setFocus] = l(false);
+	  const onShowEntry = A$1(event => {
+	    if (show(event)) {
+	      if (isFunction(onShow)) {
+	        onShow();
+	      }
 
-	CreateIcon.defaultProps = {
-	  xmlns: "http://www.w3.org/2000/svg",
-	  width: "16",
-	  height: "16"
-	};
+	      if (event.focus && !focus) {
+	        setFocus(true);
+	      }
+	    }
+	  }, [show]);
+	  y$1(() => {
+	    if (focus && ref.current) {
+	      if (isFunction(ref.current.focus)) {
+	        ref.current.focus();
+	      }
 
-	var DeleteIcon = function DeleteIcon(props) {
-	  return o$2("svg", { ...props,
-	    children: o$2("path", {
-	      fillRule: "evenodd",
-	      d: "M12 6v7c0 1.1-.4 1.55-1.5 1.55h-5C4.4 14.55 4 14.1 4 13V6h8zm-1.5 1.5h-5v4.3c0 .66.5 1.2 1.111 1.2H9.39c.611 0 1.111-.54 1.111-1.2V7.5zM13 3h-2l-1-1H6L5 3H3v1.5h10V3z"
-	    })
-	  });
-	};
+	      if (isFunction(ref.current.select)) {
+	        ref.current.select();
+	      }
 
-	DeleteIcon.defaultProps = {
-	  xmlns: "http://www.w3.org/2000/svg",
-	  width: "16",
-	  height: "16"
-	};
+	      setFocus(false);
+	    }
+	  }, [focus]);
+	  useEvent('propertiesPanel.showEntry', onShowEntry);
+	  return ref;
+	}
 
-	var FeelRequiredIcon = function FeelRequiredIcon(props) {
-	  return o$2("svg", { ...props,
-	    children: [o$2("path", {
-	      d: "M5.8 7.06V5.95h4.307v1.11H5.8zm0 3.071v-1.11h4.307v1.11H5.8z",
-	      fill: "#505562"
-	    }), o$2("path", {
-	      fillRule: "evenodd",
-	      clipRule: "evenodd",
-	      d: "M8 3.268A4.732 4.732 0 1 0 12.732 8H14a6 6 0 1 1-6-6v1.268z",
-	      fill: "#505562"
-	    }), o$2("path", {
-	      d: "m11.28 6.072-.832-.56 1.016-1.224L10 3.848l.312-.912 1.392.584L11.632 2h1.032l-.072 1.52 1.392-.584.312.912-1.464.44 1.008 1.224-.832.552-.864-1.296-.864 1.304z",
-	      fill: "#505562"
-	    })]
-	  });
-	};
+	/**
+	 * Subscribe to `propertiesPanel.showError`. On `propertiesPanel.showError` set
+	 * temporary error. Fire `propertiesPanel.showEntry` for temporary error to be
+	 * visible. Unset error on `propertiesPanel.updated`.
+	 *
+	 * @param {Function} show
+	 *
+	 * @returns {import('preact').Ref}
+	 */
 
-	FeelRequiredIcon.defaultProps = {
-	  viewBox: "0 0 16 16",
-	  fill: "none",
-	  xmlns: "http://www.w3.org/2000/svg"
-	};
+	function useShowErrorEvent(show) {
+	  const {
+	    eventBus
+	  } = F(EventContext);
+	  const [temporaryError, setTemporaryError] = l(null);
+	  const onPropertiesPanelUpdated = A$1(() => setTemporaryError(null), []);
+	  useEvent('propertiesPanel.updated', onPropertiesPanelUpdated);
+	  const onShowError = A$1(event => {
+	    setTemporaryError(null);
 
-	var FeelOptionalIcon = function FeelOptionalIcon(props) {
-	  return o$2("svg", { ...props,
-	    children: [o$2("path", {
-	      d: "M5.845 7.04V5.93h4.307v1.11H5.845zm0 3.07V9h4.307v1.11H5.845z",
-	      fill: "#505562"
-	    }), o$2("path", {
-	      fillRule: "evenodd",
-	      clipRule: "evenodd",
-	      d: "M3.286 8a4.714 4.714 0 1 0 9.428 0 4.714 4.714 0 0 0-9.428 0zM8 2a6 6 0 1 0 0 12A6 6 0 0 0 8 2z",
-	      fill: "#505562"
-	    })]
-	  });
-	};
+	    if (show(event)) {
+	      if (eventBus) {
+	        eventBus.fire('propertiesPanel.showEntry', event);
+	      }
 
-	FeelOptionalIcon.defaultProps = {
-	  viewBox: "0 0 16 16",
-	  fill: "none",
-	  xmlns: "http://www.w3.org/2000/svg"
-	};
+	      setTemporaryError(event.message);
+	    }
+	  }, [show]);
+	  useEvent('propertiesPanel.showError', onShowError);
+	  return temporaryError;
+	}
 
 	function Group(props) {
 	  const {
 	    element,
 	    entries = [],
 	    id,
-	    label
+	    label,
+	    shouldOpen = false
 	  } = props;
-	  const [open, setOpen] = useLayoutState(['groups', id, 'open'], false);
+	  const [open, setOpen] = useLayoutState(['groups', id, 'open'], shouldOpen);
+	  const onShow = A$1(() => setOpen(true), [setOpen]);
 
 	  const toggleOpen = () => setOpen(!open);
 
@@ -61833,6 +62026,9 @@
 	    });
 	    setEdited(hasOneEditedEntry);
 	  }, [entries]);
+	  const propertiesPanelContext = { ...F(LayoutContext),
+	    onShow
+	  };
 	  return o$2("div", {
 	    class: "bio-properties-panel-group",
 	    "data-group-id": 'group-' + id,
@@ -61855,15 +62051,18 @@
 	      })]
 	    }), o$2("div", {
 	      class: classnames('bio-properties-panel-group-entries', open ? 'open' : ''),
-	      children: entries.map(entry => {
-	        const {
-	          component: Component,
-	          id
-	        } = entry;
-	        return a(Component, { ...entry,
-	          key: id,
-	          element: element
-	        });
+	      children: o$2(LayoutContext.Provider, {
+	        value: propertiesPanelContext,
+	        children: entries.map(entry => {
+	          const {
+	            component: Component,
+	            id
+	          } = entry;
+	          return a(Component, { ...entry,
+	            element: element,
+	            key: id
+	          });
+	        })
 	      })
 	    })]
 	  });
@@ -61880,6 +62079,7 @@
 	  open: true
 	};
 	const DEFAULT_DESCRIPTION = {};
+	const bufferedEvents = ['propertiesPanel.showEntry', 'propertiesPanel.showError'];
 	/**
 	 * @typedef { {
 	 *    component: import('preact').Component,
@@ -61911,7 +62111,8 @@
 	 *    component?: import('preact').Component,
 	 *    entries: Array<EntryDefinition>,
 	 *    id: String,
-	 *    label: String
+	 *    label: String,
+	 *    shouldOpen?: Boolean
 	 * } } GroupDefinition
 	 *
 	 *  @typedef { {
@@ -61938,6 +62139,7 @@
 	 * @param {Function} [props.layoutChanged]
 	 * @param {DescriptionConfig} [props.descriptionConfig]
 	 * @param {Function} [props.descriptionLoaded]
+	 * @param {Object} [props.eventBus]
 	 */
 
 	function PropertiesPanel(props) {
@@ -61948,7 +62150,8 @@
 	    layoutConfig = {},
 	    layoutChanged,
 	    descriptionConfig = {},
-	    descriptionLoaded
+	    descriptionLoaded,
+	    eventBus
 	  } = props; // set-up layout context
 
 	  const [layout, setLayout] = l(createLayout(layoutConfig));
@@ -61989,6 +62192,13 @@
 	    description,
 	    getDescriptionForId
 	  };
+	  useEventBuffer(bufferedEvents, eventBus);
+	  const eventContext = {
+	    eventBus
+	  };
+	  const propertiesPanelContext = {
+	    element
+	  };
 
 	  if (!element) {
 	    return o$2("div", {
@@ -61997,28 +62207,34 @@
 	    });
 	  }
 
-	  return o$2(DescriptionContext.Provider, {
-	    value: descriptionContext,
-	    children: o$2(LayoutContext.Provider, {
-	      value: layoutContext,
-	      children: o$2("div", {
-	        class: classnames('bio-properties-panel', layout.open ? 'open' : ''),
-	        children: [o$2(Header, {
-	          element: element,
-	          headerProvider: headerProvider
-	        }), o$2("div", {
-	          class: "bio-properties-panel-scroll-container",
-	          children: groups.map(group => {
-	            const {
-	              component: Component = Group,
-	              id
-	            } = group;
-	            return a(Component, { ...group,
-	              key: id,
-	              element: element
-	            });
+	  return o$2(LayoutContext.Provider, {
+	    value: propertiesPanelContext,
+	    children: o$2(DescriptionContext.Provider, {
+	      value: descriptionContext,
+	      children: o$2(LayoutContext.Provider, {
+	        value: layoutContext,
+	        children: o$2(EventContext.Provider, {
+	          value: eventContext,
+	          children: o$2("div", {
+	            class: classnames('bio-properties-panel', layout.open ? 'open' : ''),
+	            children: [o$2(Header, {
+	              element: element,
+	              headerProvider: headerProvider
+	            }), o$2("div", {
+	              class: "bio-properties-panel-scroll-container",
+	              children: groups.map(group => {
+	                const {
+	                  component: Component = Group,
+	                  id
+	                } = group;
+	                return a(Component, { ...group,
+	                  key: id,
+	                  element: element
+	                });
+	              })
+	            })]
 	          })
-	        })]
+	        })
 	      })
 	    })
 	  });
@@ -62158,8 +62374,20 @@
 	  } = props;
 	  const [open, setOpen] = l(shouldOpen);
 
-	  const toggleOpen = () => setOpen(!open); // todo(pinussilvestrus): translate once we have a translate mechanism for the core
+	  const toggleOpen = () => setOpen(!open);
+
+	  const {
+	    onShow
+	  } = F(LayoutContext);
+	  const propertiesPanelContext = { ...F(LayoutContext),
+	    onShow: A$1(() => {
+	      setOpen(true);
 
+	      if (isFunction(onShow)) {
+	        onShow();
+	      }
+	    }, [onShow, setOpen])
+	  }; // todo(pinussilvestrus): translate once we have a translate mechanism for the core
 
 	  const placeholderLabel = '<empty>';
 	  return o$2("div", {
@@ -62186,15 +62414,18 @@
 	      }) : null]
 	    }), o$2("div", {
 	      class: classnames('bio-properties-panel-collapsible-entry-entries', open ? 'open' : ''),
-	      children: entries.map(entry => {
-	        const {
-	          component: Component,
-	          id
-	        } = entry;
-	        return a(Component, { ...entry,
-	          key: id,
-	          element: element
-	        });
+	      children: o$2(LayoutContext.Provider, {
+	        value: propertiesPanelContext,
+	        children: entries.map(entry => {
+	          const {
+	            component: Component,
+	            id
+	          } = entry;
+	          return a(Component, { ...entry,
+	            element: element,
+	            key: id
+	          });
+	        })
 	      })
 	    })]
 	  });
@@ -62228,7 +62459,7 @@
 	  });
 	}
 
-	const noop = () => {};
+	const noop$3 = () => {};
 	/**
 	 * @param {import('../PropertiesPanel').ListGroupDefinition} props
 	 */
@@ -62245,6 +62476,7 @@
 	    shouldSort = true
 	  } = props;
 	  const [open, setOpen] = useLayoutState(['groups', id, 'open'], false);
+	  const onShow = A$1(() => setOpen(true), [setOpen]);
 	  const [ordering, setOrdering] = l([]);
 	  const [newItemAdded, setNewItemAdded] = l(false);
 	  const prevItems = usePrevious(items);
@@ -62319,12 +62551,15 @@
 	  const toggleOpen = () => setOpen(!open);
 
 	  const hasItems = !!items.length;
+	  const propertiesPanelContext = { ...F(LayoutContext),
+	    onShow
+	  };
 	  return o$2("div", {
 	    class: "bio-properties-panel-group",
 	    "data-group-id": 'group-' + id,
 	    children: [o$2("div", {
 	      class: classnames('bio-properties-panel-group-header', hasItems ? '' : 'empty', hasItems && open ? 'open' : ''),
-	      onClick: hasItems ? toggleOpen : noop,
+	      onClick: hasItems ? toggleOpen : noop$3,
 	      children: [o$2("div", {
 	        title: label,
 	        class: "bio-properties-panel-group-header-title",
@@ -62353,23 +62588,27 @@
 	      })]
 	    }), o$2("div", {
 	      class: classnames('bio-properties-panel-list', open && hasItems ? 'open' : ''),
-	      children: ordering.map((o, index) => {
-	        const item = getItem(items, o);
+	      children: o$2(LayoutContext.Provider, {
+	        value: propertiesPanelContext,
+	        children: ordering.map((o, index) => {
+	          const item = getItem(items, o);
 
-	        if (!item) {
-	          return;
-	        }
+	          if (!item) {
+	            return;
+	          }
 
-	        const {
-	          id
-	        } = item;
-	        return a(ListItem, { ...item,
-	          element: element,
-	          index: index,
-	          key: id // if item was added, open first or last item based on ordering
-	          ,
-	          autoOpen: newItemAdded && (shouldSort ? index === 0 : index === ordering.length - 1)
-	        });
+	          const {
+	            id
+	          } = item; // if item was added, open first or last item based on ordering
+
+	          const autoOpen = newItemAdded && (shouldSort ? index === 0 : index === ordering.length - 1);
+	          return a(ListItem, { ...item,
+	            autoOpen: autoOpen,
+	            element: element,
+	            index: index,
+	            key: id
+	          });
+	        })
 	      })
 	    })]
 	  });
@@ -62408,13 +62647,16 @@
 	  }
 	}
 
+	const noop$2 = () => {};
+
 	function Checkbox(props) {
 	  const {
 	    id,
 	    label,
 	    onChange,
 	    disabled,
-	    value = false
+	    value = false,
+	    show = noop$2
 	  } = props;
 
 	  const handleChange = ({
@@ -62423,9 +62665,11 @@
 	    onChange(target.checked);
 	  };
 
+	  const ref = useShowEntryEvent(show);
 	  return o$2("div", {
 	    class: "bio-properties-panel-checkbox",
 	    children: [o$2("input", {
+	      ref: ref,
 	      id: prefixId$6(id),
 	      name: id,
 	      type: "checkbox",
@@ -62460,18 +62704,24 @@
 	    label,
 	    getValue,
 	    setValue,
-	    disabled
+	    disabled,
+	    show = noop$2
 	  } = props;
 	  const value = getValue(element);
+	  const error = useShowErrorEvent(show);
 	  return o$2("div", {
 	    class: "bio-properties-panel-entry bio-properties-panel-checkbox-entry",
 	    "data-entry-id": id,
 	    children: [o$2(Checkbox, {
+	      disabled: disabled,
 	      id: id,
 	      label: label,
 	      onChange: setValue,
-	      value: value,
-	      disabled: disabled
+	      show: show,
+	      value: value
+	    }), error && o$2("div", {
+	      class: "bio-properties-panel-error",
+	      children: error
 	    }), o$2(Description, {
 	      forId: id,
 	      element: element,
@@ -62673,6 +62923,25 @@
 	  return previousItems ? items.filter(item => !previousItems.includes(item)) : [];
 	}
 
+	const noop$1 = () => {};
+	/**
+	 * @typedef { { value: string, label: string, disabled: boolean } } Option
+	 */
+
+	/**
+	 * Provides basic select input.
+	 *
+	 * @param {object} props
+	 * @param {string} props.id
+	 * @param {string[]} props.path
+	 * @param {string} props.label
+	 * @param {Function} props.onChange
+	 * @param {Array<Option>} [props.options]
+	 * @param {string} props.value
+	 * @param {boolean} [props.disabled]
+	 */
+
+
 	function Select(props) {
 	  const {
 	    id,
@@ -62680,8 +62949,10 @@
 	    onChange,
 	    options = [],
 	    value,
-	    disabled
+	    disabled,
+	    show = noop$1
 	  } = props;
+	  const ref = useShowEntryEvent(show);
 
 	  const handleChange = ({
 	    target
@@ -62696,6 +62967,7 @@
 	      class: "bio-properties-panel-label",
 	      children: label
 	    }), o$2("select", {
+	      ref: ref,
 	      id: prefixId$4(id),
 	      name: id,
 	      class: "bio-properties-panel-input",
@@ -62734,12 +63006,14 @@
 	    getValue,
 	    setValue,
 	    getOptions,
-	    disabled
+	    disabled,
+	    show = noop$1
 	  } = props;
 	  const value = getValue(element);
 	  const options = getOptions(element);
+	  const error = useShowErrorEvent(show);
 	  return o$2("div", {
-	    class: "bio-properties-panel-entry",
+	    class: classnames('bio-properties-panel-entry', error ? 'has-error' : ''),
 	    "data-entry-id": id,
 	    children: [o$2(Select, {
 	      id: id,
@@ -62747,7 +63021,11 @@
 	      value: value,
 	      onChange: setValue,
 	      options: options,
-	      disabled: disabled
+	      disabled: disabled,
+	      show: show
+	    }), error && o$2("div", {
+	      class: "bio-properties-panel-error",
+	      children: error
 	    }), o$2(Description, {
 	      forId: id,
 	      element: element,
@@ -62915,6 +63193,8 @@
 	  return `bio-properties-panel-${id}`;
 	}
 
+	const noop = () => {};
+
 	function Textfield(props) {
 	  const {
 	    debounce,
@@ -62923,8 +63203,10 @@
 	    label,
 	    onInput,
 	    feel = false,
-	    value = ''
+	    value = '',
+	    show = noop
 	  } = props;
+	  const ref = useShowEntryEvent(show);
 	  const handleInput = d$1(() => {
 	    return debounce(({
 	      target
@@ -62940,6 +63222,7 @@
 	        label: label
 	      })]
 	    }), o$2("input", {
+	      ref: ref,
 	      id: prefixId$1(id),
 	      type: "text",
 	      name: id,
@@ -62979,53 +63262,61 @@
 	    label,
 	    getValue,
 	    setValue,
-	    validate
+	    validate,
+	    show = noop
 	  } = props;
-	  const [error, setError] = l(null);
-	  const [invalidValueCache, setInvalidValueCache] = l(null);
+	  const [cachedInvalidValue, setCachedInvalidValue] = l(null);
+	  const [validationError, setValidationError] = l(null);
 	  let value = getValue(element);
-	  const prevValue = usePrevious(value); // validate again when value prop changed
-
+	  const previousValue = usePrevious(value);
 	  y$1(() => {
-	    const err = validate ? validate(value) : null;
-	    setError(err);
-	  }, [value]); // validate on change
+	    if (isFunction(validate)) {
+	      const newValidationError = validate(value) || null;
+	      setValidationError(newValidationError);
+	    }
+	  }, [value]);
 
-	  const handleChange = newValue => {
-	    const err = validate ? validate(newValue) : null;
+	  const onInput = newValue => {
+	    let newValidationError = null;
 
-	    if (err) {
-	      setInvalidValueCache(newValue);
+	    if (isFunction(validate)) {
+	      newValidationError = validate(newValue) || null;
+	    }
+
+	    if (newValidationError) {
+	      setCachedInvalidValue(newValue);
 	    } else {
 	      setValue(newValue);
 	    }
 
-	    setError(err);
-	  }; // keep showing invalid value on errors, although it was not set
-
+	    setValidationError(newValidationError);
+	  };
 
-	  if (prevValue === value && error) {
-	    value = invalidValueCache;
+	  if (previousValue === value && validationError) {
+	    value = cachedInvalidValue;
 	  }
 
+	  const temporaryError = useShowErrorEvent(show);
+	  const error = temporaryError || validationError;
 	  return o$2("div", {
 	    class: classnames('bio-properties-panel-entry', error ? 'has-error' : ''),
 	    "data-entry-id": id,
 	    children: [o$2(Textfield, {
-	      id: id,
-	      label: label,
-	      value: value,
-	      onInput: handleChange,
 	      debounce: debounce,
 	      disabled: disabled,
-	      feel: feel
+	      feel: feel,
+	      id: id,
+	      label: label,
+	      onInput: onInput,
+	      show: show,
+	      value: value
+	    }), error && o$2("div", {
+	      class: "bio-properties-panel-error",
+	      children: error
 	    }), o$2(Description, {
 	      forId: id,
 	      element: element,
 	      value: description
-	    }), error && o$2("div", {
-	      class: "bio-properties-panel-error",
-	      children: error
 	    })]
 	  });
 	}
@@ -63138,6 +63429,145 @@
 	  debounceInput: ['factory', debounceInput]
 	};
 
+	var require$$0 = /*@__PURE__*/getAugmentedNamespace(index_esm);
+
+	const {
+	  isNil: isNil$1,
+	  isString: isString$1,
+	  isUndefined: isUndefined$2
+	} = require$$0;
+
+	/**
+	 * Get path from model element and optional parent model element. Falls back to
+	 * returning null.
+	 *
+	 * @param {ModdleElement} moddleElement
+	 * @param {ModdleElement} [parentModdleElement]
+	 *
+	 * @returns {string[]|null}
+	 */
+	var getPath = function(moddleElement, parentModdleElement) {
+	  if (!moddleElement) {
+	    return null;
+	  }
+
+	  if (moddleElement === parentModdleElement) {
+	    return [];
+	  }
+
+	  let path = [],
+	      parent;
+
+	  do {
+	    parent = moddleElement.$parent;
+
+	    if (!parent) {
+	      if (moddleElement.$instanceOf('bpmn:Definitions')) {
+	        break;
+	      } else {
+	        return null;
+	      }
+	    }
+
+	    path = [ ...getPropertyName(moddleElement, parent), ...path ];
+
+	    moddleElement = parent;
+
+	    if (parentModdleElement && moddleElement === parentModdleElement) {
+	      break;
+	    }
+	  } while (parent);
+
+	  return path;
+	};
+
+	/**
+	 * Get property name from model element and parent model element.
+	 *
+	 * @param {ModdleElement} moddleElement
+	 * @param {ModdleElement} parentModdleElement
+	 *
+	 * @returns {string[]}
+	 */
+	function getPropertyName(moddleElement, parentModdleElement) {
+	  for (let property of Object.values(parentModdleElement.$descriptor.propertiesByName)) {
+	    if (property.isMany) {
+	      if (parentModdleElement.get(property.name).includes(moddleElement)) {
+	        return [
+	          property.name,
+	          parentModdleElement.get(property.name).indexOf(moddleElement)
+	        ];
+	      }
+	    } else {
+	      if (parentModdleElement.get(property.name) === moddleElement) {
+	        return [ property.name ];
+	      }
+	    }
+	  }
+
+	  return [];
+	}
+
+	/**
+	 * @param {(string|(number|string)[])[]} paths
+	 *
+	 * @returns {(number|string)[]}
+	 */
+	var pathConcat = function(...paths) {
+	  let concatenatedPaths = [];
+
+	  for (let path of paths) {
+	    if (isNil$1(path) || isUndefined$2(path)) {
+	      return null;
+	    }
+
+	    if (isString$1(path)) {
+	      path = [ path ];
+	    }
+
+	    concatenatedPaths = concatenatedPaths.concat(path);
+	  }
+
+	  return concatenatedPaths;
+	};
+
+	/**
+	 * @param {string|(number|string)[]} a
+	 * @param {string|(number|string)[]} b
+	 * @param {string} [separator]
+	 *
+	 * @returns {boolean}
+	 */
+	var pathEquals = function(a, b, separator = '.') {
+	  if (isNil$1(a) || isUndefined$2(a) || isNil$1(b) || isUndefined$2(b)) {
+	    return false;
+	  }
+
+	  if (!isString$1(a)) {
+	    a = pathStringify(a, separator);
+	  }
+
+	  if (!isString$1(b)) {
+	    b = pathStringify(b, separator);
+	  }
+
+	  return a === b;
+	};
+
+	/**
+	 * @param {(number|string)[]} path
+	 * @param {string} [separator]
+	 *
+	 * @returns {string}
+	 */
+	function pathStringify(path, separator = '.') {
+	  if (isNil$1(path) || isUndefined$2(path)) {
+	    return null;
+	  }
+
+	  return path.join(separator);
+	}
+
 	/**
 	 * Failsafe remove an element from a collection
 	 *
@@ -64602,22 +65032,213 @@
 	/**
 	 * Validate a single object.
 	 *
-	 * @param {Object} object
-	 * @return {Object} single object validation result
+	 * @param {Object} object
+	 * @return {Object} single object validation result
+	 */
+	function validate(object) {
+	  return _validate(object, standaloneValidator);
+	}
+
+	var DEFAULT_PRIORITY$7 = 1000;
+
+	/**
+	 * A utility that can be used to plug-in into the command execution for
+	 * extension and/or validation.
+	 *
+	 * @param {EventBus} eventBus
+	 *
+	 * @example
+	 *
+	 * import inherits from 'inherits';
+	 *
+	 * import CommandInterceptor from 'diagram-js/lib/command/CommandInterceptor';
+	 *
+	 * function CommandLogger(eventBus) {
+	 *   CommandInterceptor.call(this, eventBus);
+	 *
+	 *   this.preExecute(function(event) {
+	 *     console.log('command pre-execute', event);
+	 *   });
+	 * }
+	 *
+	 * inherits(CommandLogger, CommandInterceptor);
+	 *
+	 */
+	function CommandInterceptor$1(eventBus) {
+	  this._eventBus = eventBus;
+	}
+
+	CommandInterceptor$1.$inject = [ 'eventBus' ];
+
+	function unwrapEvent$1(fn, that) {
+	  return function(event) {
+	    return fn.call(that || null, event.context, event.command, event);
+	  };
+	}
+
+	/**
+	 * Register an interceptor for a command execution
+	 *
+	 * @param {string|Array<string>} [events] list of commands to register on
+	 * @param {string} [hook] command hook, i.e. preExecute, executed to listen on
+	 * @param {number} [priority] the priority on which to hook into the execution
+	 * @param {Function} handlerFn interceptor to be invoked with (event)
+	 * @param {boolean} unwrap if true, unwrap the event and pass (context, command, event) to the
+	 *                          listener instead
+	 * @param {Object} [that] Pass context (`this`) to the handler function
+	 */
+	CommandInterceptor$1.prototype.on = function(events, hook, priority, handlerFn, unwrap, that) {
+
+	  if (isFunction(hook) || isNumber(hook)) {
+	    that = unwrap;
+	    unwrap = handlerFn;
+	    handlerFn = priority;
+	    priority = hook;
+	    hook = null;
+	  }
+
+	  if (isFunction(priority)) {
+	    that = unwrap;
+	    unwrap = handlerFn;
+	    handlerFn = priority;
+	    priority = DEFAULT_PRIORITY$7;
+	  }
+
+	  if (isObject(unwrap)) {
+	    that = unwrap;
+	    unwrap = false;
+	  }
+
+	  if (!isFunction(handlerFn)) {
+	    throw new Error('handlerFn must be a function');
+	  }
+
+	  if (!isArray(events)) {
+	    events = [ events ];
+	  }
+
+	  var eventBus = this._eventBus;
+
+	  forEach(events, function(event) {
+
+	    // concat commandStack(.event)?(.hook)?
+	    var fullEvent = [ 'commandStack', event, hook ].filter(function(e) { return e; }).join('.');
+
+	    eventBus.on(fullEvent, priority, unwrap ? unwrapEvent$1(handlerFn, that) : handlerFn, that);
+	  });
+	};
+
+
+	var hooks$1 = [
+	  'canExecute',
+	  'preExecute',
+	  'preExecuted',
+	  'execute',
+	  'executed',
+	  'postExecute',
+	  'postExecuted',
+	  'revert',
+	  'reverted'
+	];
+
+	/*
+	 * Install hook shortcuts
+	 *
+	 * This will generate the CommandInterceptor#(preExecute|...|reverted) methods
+	 * which will in term forward to CommandInterceptor#on.
+	 */
+	forEach(hooks$1, function(hook) {
+
+	  /**
+	   * {canExecute|preExecute|preExecuted|execute|executed|postExecute|postExecuted|revert|reverted}
+	   *
+	   * A named hook for plugging into the command execution
+	   *
+	   * @param {string|Array<string>} [events] list of commands to register on
+	   * @param {number} [priority] the priority on which to hook into the execution
+	   * @param {Function} handlerFn interceptor to be invoked with (event)
+	   * @param {boolean} [unwrap=false] if true, unwrap the event and pass (context, command, event) to the
+	   *                          listener instead
+	   * @param {Object} [that] Pass context (`this`) to the handler function
+	   */
+	  CommandInterceptor$1.prototype[hook] = function(events, priority, handlerFn, unwrap, that) {
+
+	    if (isFunction(events) || isNumber(events)) {
+	      that = unwrap;
+	      unwrap = handlerFn;
+	      handlerFn = priority;
+	      priority = events;
+	      events = null;
+	    }
+
+	    this.on(events, hook, priority, handlerFn, unwrap, that);
+	  };
+	});
+
+	var CommandInterceptor$2 = /*#__PURE__*/Object.freeze({
+		__proto__: null,
+		'default': CommandInterceptor$1
+	});
+
+	const BpmnPropertiesPanelContext = q({
+	  selectedElement: null,
+	  injector: null,
+
+	  getService() {
+	    return null;
+	  }
+
+	});
+
+	function useService(type, strict) {
+	  const {
+	    getService
+	  } = F(BpmnPropertiesPanelContext);
+	  return getService(type, strict);
+	}
+
+	/**
+	 * Returns a memoized callback to be passed as `show` prop. Callback returns
+	 * true if (1) ID and path match or (2) ID matches and matcher returns true.
+	 *
+	 * @example
+	 *
+	 * // using path
+	 * const show = useShowCallback(businessObject, [ 'foo' ]);
+	 *
+	 * @example
+	 *
+	 * // using matcher
+	 * const show = useShowCallback(businessObject, (event) => event.foo === 'bar');
+	 *
+	 * @param {Object} businessObject
+	 * @param {string[]|Function} matcher
+	 *
+	 * @returns {Function}
 	 */
-	function validate(object) {
-	  return _validate(object, standaloneValidator);
-	}
 
-	const BpmnPropertiesPanelContext = q({
-	  selectedElement: null,
-	  injector: null,
+	function useShowCallback(businessObject, matcher) {
+	  return A$1(event => {
+	    const {
+	      id,
+	      path
+	    } = event;
 
-	  getService() {
-	    return null;
-	  }
+	    if (id !== businessObject.get('id')) {
+	      return false;
+	    }
 
-	});
+	    if (isArray(matcher)) {
+	      return path && pathEquals(path, matcher);
+	    }
+
+	    if (isFunction(matcher)) {
+	      return !!matcher(event);
+	    }
+
+	    return false;
+	  }, [businessObject, matcher]);
+	}
 
 	function _extends$1m() { _extends$1m = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$1m.apply(this, arguments); }
 	var AssociationIcon = (({
@@ -65838,6 +66459,14 @@
 	  return type;
 	}
 	const PanelHeaderProvider = {
+	  getDocumentationRef: element => {
+	    // eslint-disable-next-line react-hooks/rules-of-hooks
+	    const elementTemplates = useService('elementTemplates', false);
+
+	    if (elementTemplates) {
+	      return getTemplateDocumentation(element, elementTemplates);
+	    }
+	  },
 	  getElementLabel: element => {
 	    if (is$1(element, 'bpmn:Process')) {
 	      return getBusinessObject(element).name;
@@ -65850,6 +66479,17 @@
 	    return iconsByType[concreteType];
 	  },
 	  getTypeLabel: element => {
+	    // eslint-disable-next-line react-hooks/rules-of-hooks
+	    const elementTemplates = useService('elementTemplates', false);
+
+	    if (elementTemplates) {
+	      const template = getTemplate(element, elementTemplates);
+
+	      if (template && template.name) {
+	        return template.name;
+	      }
+	    }
+
 	    const concreteType = getConcreteType(element);
 	    return concreteType.replace(/(\B[A-Z])/g, ' $1').replace(/(\bNon Interrupting)/g, '($1)');
 	  }
@@ -65895,8 +66535,7 @@
 	  }
 
 	  return businessObject.conditionExpression && is$1(sourceBusinessObject, 'bpmn:Activity');
-	} // helpers //////////
-
+	}
 
 	function isPlane$1(element) {
 	  // Backwards compatibility for bpmn-js<8
@@ -65904,6 +66543,17 @@
 	  return is$1(di, 'bpmndi:BPMNPlane');
 	}
 
+	function getTemplate(element, elementTemplates) {
+	  const templateId = elementTemplates._getTemplateId(element);
+
+	  return templateId && elementTemplates.get(templateId);
+	}
+
+	function getTemplateDocumentation(element, elementTemplates) {
+	  const template = getTemplate(element, elementTemplates);
+	  return template && template.documentationRef;
+	}
+
 	function BpmnPropertiesPanel(props) {
 	  const {
 	    element,
@@ -66051,7 +66701,8 @@
 	      layoutConfig: layoutConfig,
 	      layoutChanged: onLayoutChanged,
 	      descriptionConfig: descriptionConfig,
-	      descriptionLoaded: onDescriptionLoaded
+	      descriptionLoaded: onDescriptionLoaded,
+	      eventBus: eventBus
 	    })
 	  });
 	} // helpers //////////////////////////
@@ -66069,7 +66720,7 @@
 	  return element && elementRegistry.get(element.id);
 	}
 
-	const DEFAULT_PRIORITY$6 = 1000;
+	const DEFAULT_PRIORITY$8 = 1000;
 	/**
 	 * @typedef { import('@bpmn-io/properties-panel').GroupDefinition } GroupDefinition
 	 * @typedef { import('@bpmn-io/properties-panel').ListGroupDefinition } ListGroupDefinition
@@ -66152,7 +66803,7 @@
 	  registerProvider(priority, provider) {
 	    if (!provider) {
 	      provider = priority;
-	      priority = DEFAULT_PRIORITY$6;
+	      priority = DEFAULT_PRIORITY$8;
 	    }
 
 	    if (typeof provider.getGroups !== 'function') {
@@ -66264,13 +66915,6 @@
 	  propertiesPanel: ['type', BpmnPropertiesPanelRenderer]
 	};
 
-	function useService (type, strict) {
-	  const {
-	    getService
-	  } = F(BpmnPropertiesPanelContext);
-	  return getService(type, strict);
-	}
-
 	function ReferenceSelectEntry(props) {
 	  const {
 	    autoFocusEntry,
@@ -66926,6 +67570,9 @@
 	    return options;
 	  };
 
+	  const businessObject = getBusinessObject(element),
+	        path = pathConcat(getPath(errorEventDefinition, businessObject), 'errorRef');
+	  const show = useShowCallback(businessObject, path);
 	  return ReferenceSelectEntry({
 	    element,
 	    id: 'errorRef',
@@ -66933,7 +67580,8 @@
 	    autoFocusEntry: 'errorName',
 	    getValue,
 	    setValue,
-	    getOptions
+	    getOptions,
+	    show
 	  });
 	}
 
@@ -67545,6 +68193,9 @@
 	    return options;
 	  };
 
+	  const businessObject = getBusinessObject(element),
+	        path = pathConcat(getPath(messageEventDefinition, businessObject), 'messageRef');
+	  const show = useShowCallback(businessObject, path);
 	  return ReferenceSelectEntry({
 	    element,
 	    id: 'messageRef',
@@ -67552,7 +68203,8 @@
 	    autoFocusEntry: 'messageName',
 	    getValue,
 	    setValue,
-	    getOptions
+	    getOptions,
+	    show
 	  });
 	}
 
@@ -74558,7 +75210,7 @@
 	function JavaClass(props) {
 	  const {
 	    element,
-	    businessObject = getBusinessObject(element),
+	    businessObject = getServiceTaskLikeBusinessObject(element),
 	    id = 'javaClass'
 	  } = props;
 	  const commandStack = useService('commandStack');
@@ -74591,7 +75243,7 @@
 	function Expression$1(props) {
 	  const {
 	    element,
-	    businessObject = getBusinessObject(element),
+	    businessObject = getServiceTaskLikeBusinessObject(element),
 	    id = 'expression'
 	  } = props;
 	  const commandStack = useService('commandStack');
@@ -74629,7 +75281,7 @@
 	  const commandStack = useService('commandStack');
 	  const translate = useService('translate');
 	  const debounce = useService('debounceInput');
-	  const businessObject = getBusinessObject(element);
+	  const businessObject = getServiceTaskLikeBusinessObject(element);
 
 	  const getValue = () => {
 	    return businessObject.get('camunda:resultVariable');
@@ -74658,7 +75310,7 @@
 	function DelegateExpression(props) {
 	  const {
 	    element,
-	    businessObject = getBusinessObject(element),
+	    businessObject = getServiceTaskLikeBusinessObject(element),
 	    id = 'delegateExpression'
 	  } = props;
 	  const commandStack = useService('commandStack');
@@ -74696,7 +75348,7 @@
 	  const commandStack = useService('commandStack');
 	  const translate = useService('translate');
 	  const debounce = useService('debounceInput');
-	  const businessObject = getBusinessObject(element);
+	  const businessObject = getServiceTaskLikeBusinessObject(element);
 
 	  const getValue = () => {
 	    return businessObject.get('camunda:topic');
@@ -78650,45 +79302,6 @@
 	}
 	ElementTemplatesLoader$1.$inject = ['config.elementTemplates', 'eventBus', 'elementTemplates'];
 
-	/**
-	 * This function catches the <moddleCopy.canCopyProperty> event
-	 * and only allows the copy of the modelerTemplate property
-	 * if the element's type or its parent's is in
-	 * the list of elements the template applies to.
-	 */
-
-	function ReplaceBehavior(elementTemplates, eventBus) {
-	  eventBus.on('moddleCopy.canCopyProperty', function (context) {
-	    const {
-	      parent,
-	      property,
-	      propertyName
-	    } = context;
-
-	    if (propertyName !== 'modelerTemplate') {
-	      return;
-	    }
-
-	    const elementTemplate = elementTemplates.get(property);
-
-	    if (!elementTemplate) {
-	      return false;
-	    }
-
-	    const {
-	      appliesTo
-	    } = elementTemplate;
-	    const allowed = appliesTo.reduce((allowed, type) => {
-	      return allowed || is$1(parent, type);
-	    }, false);
-
-	    if (!allowed) {
-	      return false;
-	    }
-	  });
-	}
-	ReplaceBehavior.$inject = ['elementTemplates', 'eventBus'];
-
 	function unlinkTemplate$1(element, injector) {
 	  const modeling = injector.get('modeling');
 	  modeling.updateProperties(element, {
@@ -79457,6 +80070,51 @@
 	  });
 	}
 
+	/**
+	 * This Behavior checks if the new element's type is in
+	 * the list of elements the template applies to and unlinks
+	 * it if not.
+	 */
+
+	class ReplaceBehavior extends CommandInterceptor$1 {
+	  constructor(elementTemplates, injector) {
+	    super(injector.get('eventBus'));
+	    this.postExecuted('shape.replace', function (e) {
+	      var context = e.context,
+	          oldShape = context.oldShape,
+	          oldBo = getBusinessObject(oldShape),
+	          newShape = context.newShape,
+	          newBo = getBusinessObject(newShape);
+
+	      if (!oldBo.modelerTemplate) {
+	        return;
+	      }
+
+	      const template = newBo.modelerTemplate;
+	      const version = newBo.modelerTemplateVersion;
+	      const elementTemplate = elementTemplates.get(template, version);
+
+	      if (!elementTemplate) {
+	        unlinkTemplate$1(newShape, injector);
+	        return;
+	      }
+
+	      const {
+	        appliesTo
+	      } = elementTemplate;
+	      const allowed = appliesTo.reduce((allowed, type) => {
+	        return allowed || is$1(newBo, type);
+	      }, false);
+
+	      if (!allowed) {
+	        unlinkTemplate$1(newShape, injector);
+	      }
+	    });
+	  }
+
+	}
+	ReplaceBehavior.$inject = ['elementTemplates', 'injector'];
+
 	/**
 	 * Converts legacy scopes descriptor to newer supported array structure.
 	 *
@@ -81025,7 +81683,8 @@
 	    id,
 	    label,
 	    component: Group,
-	    entries: []
+	    entries: [],
+	    shouldOpen: true
 	  };
 	  properties.forEach((property, index) => {
 	    const entry = createCustomEntry(`custom-entry-${templateId}-${index}`, element, property, scope);
@@ -82557,147 +83216,6 @@
 	  Modeler$1.prototype._extensionModules
 	);
 
-	var DEFAULT_PRIORITY$7 = 1000;
-
-	/**
-	 * A utility that can be used to plug-in into the command execution for
-	 * extension and/or validation.
-	 *
-	 * @param {EventBus} eventBus
-	 *
-	 * @example
-	 *
-	 * import inherits from 'inherits';
-	 *
-	 * import CommandInterceptor from 'diagram-js/lib/command/CommandInterceptor';
-	 *
-	 * function CommandLogger(eventBus) {
-	 *   CommandInterceptor.call(this, eventBus);
-	 *
-	 *   this.preExecute(function(event) {
-	 *     console.log('command pre-execute', event);
-	 *   });
-	 * }
-	 *
-	 * inherits(CommandLogger, CommandInterceptor);
-	 *
-	 */
-	function CommandInterceptor$1(eventBus) {
-	  this._eventBus = eventBus;
-	}
-
-	CommandInterceptor$1.$inject = [ 'eventBus' ];
-
-	function unwrapEvent$1(fn, that) {
-	  return function(event) {
-	    return fn.call(that || null, event.context, event.command, event);
-	  };
-	}
-
-	/**
-	 * Register an interceptor for a command execution
-	 *
-	 * @param {string|Array<string>} [events] list of commands to register on
-	 * @param {string} [hook] command hook, i.e. preExecute, executed to listen on
-	 * @param {number} [priority] the priority on which to hook into the execution
-	 * @param {Function} handlerFn interceptor to be invoked with (event)
-	 * @param {boolean} unwrap if true, unwrap the event and pass (context, command, event) to the
-	 *                          listener instead
-	 * @param {Object} [that] Pass context (`this`) to the handler function
-	 */
-	CommandInterceptor$1.prototype.on = function(events, hook, priority, handlerFn, unwrap, that) {
-
-	  if (isFunction(hook) || isNumber(hook)) {
-	    that = unwrap;
-	    unwrap = handlerFn;
-	    handlerFn = priority;
-	    priority = hook;
-	    hook = null;
-	  }
-
-	  if (isFunction(priority)) {
-	    that = unwrap;
-	    unwrap = handlerFn;
-	    handlerFn = priority;
-	    priority = DEFAULT_PRIORITY$7;
-	  }
-
-	  if (isObject(unwrap)) {
-	    that = unwrap;
-	    unwrap = false;
-	  }
-
-	  if (!isFunction(handlerFn)) {
-	    throw new Error('handlerFn must be a function');
-	  }
-
-	  if (!isArray(events)) {
-	    events = [ events ];
-	  }
-
-	  var eventBus = this._eventBus;
-
-	  forEach(events, function(event) {
-
-	    // concat commandStack(.event)?(.hook)?
-	    var fullEvent = [ 'commandStack', event, hook ].filter(function(e) { return e; }).join('.');
-
-	    eventBus.on(fullEvent, priority, unwrap ? unwrapEvent$1(handlerFn, that) : handlerFn, that);
-	  });
-	};
-
-
-	var hooks$1 = [
-	  'canExecute',
-	  'preExecute',
-	  'preExecuted',
-	  'execute',
-	  'executed',
-	  'postExecute',
-	  'postExecuted',
-	  'revert',
-	  'reverted'
-	];
-
-	/*
-	 * Install hook shortcuts
-	 *
-	 * This will generate the CommandInterceptor#(preExecute|...|reverted) methods
-	 * which will in term forward to CommandInterceptor#on.
-	 */
-	forEach(hooks$1, function(hook) {
-
-	  /**
-	   * {canExecute|preExecute|preExecuted|execute|executed|postExecute|postExecuted|revert|reverted}
-	   *
-	   * A named hook for plugging into the command execution
-	   *
-	   * @param {string|Array<string>} [events] list of commands to register on
-	   * @param {number} [priority] the priority on which to hook into the execution
-	   * @param {Function} handlerFn interceptor to be invoked with (event)
-	   * @param {boolean} [unwrap=false] if true, unwrap the event and pass (context, command, event) to the
-	   *                          listener instead
-	   * @param {Object} [that] Pass context (`this`) to the handler function
-	   */
-	  CommandInterceptor$1.prototype[hook] = function(events, priority, handlerFn, unwrap, that) {
-
-	    if (isFunction(events) || isNumber(events)) {
-	      that = unwrap;
-	      unwrap = handlerFn;
-	      handlerFn = priority;
-	      priority = events;
-	      events = null;
-	    }
-
-	    this.on(events, hook, priority, handlerFn, unwrap, that);
-	  };
-	});
-
-	var CommandInterceptor$2 = /*#__PURE__*/Object.freeze({
-		__proto__: null,
-		'default': CommandInterceptor$1
-	});
-
 	/**
 	 * Get extension elements of business object. Optionally filter by type.
 	 *
@@ -82751,7 +83269,7 @@
 	  });
 	}
 
-	const HIGH_PRIORITY$l = 5000;
+	const HIGH_PRIORITY$m = 5000;
 
 
 	/**
@@ -82765,7 +83283,7 @@
 	    this.postExecute([
 	      'element.updateProperties',
 	      'element.updateModdleProperties'
-	    ], HIGH_PRIORITY$l, function(context) {
+	    ], HIGH_PRIORITY$m, function(context) {
 	      const {
 	        element,
 	        moddleElement,
@@ -82794,7 +83312,7 @@
 	  'eventBus'
 	];
 
-	const HIGH_PRIORITY$m = 5000;
+	const HIGH_PRIORITY$n = 5000;
 
 
 	/**
@@ -82809,7 +83327,7 @@
 	    this.postExecute([
 	      'element.updateProperties',
 	      'element.updateModdleProperties'
-	    ], HIGH_PRIORITY$m, function(context) {
+	    ], HIGH_PRIORITY$n, function(context) {
 	      const {
 	        element,
 	        moddleElement,
@@ -82879,7 +83397,7 @@
 	  });
 	}
 
-	const HIGH_PRIORITY$n = 5000;
+	const HIGH_PRIORITY$o = 5000;
 
 
 	/**
@@ -82893,7 +83411,7 @@
 	    this.preExecute([
 	      'element.updateProperties',
 	      'element.updateModdleProperties',
-	    ], HIGH_PRIORITY$n, function(context) {
+	    ], HIGH_PRIORITY$o, function(context) {
 	      const {
 	        element,
 	        moddleElement,
@@ -82988,7 +83506,7 @@
 	  'eventBus'
 	];
 
-	const HIGH_PRIORITY$o = 5000;
+	const HIGH_PRIORITY$p = 5000;
 
 
 	/**
@@ -83002,7 +83520,7 @@
 	    this.preExecute([
 	      'element.updateProperties',
 	      'element.updateModdleProperties'
-	    ], HIGH_PRIORITY$o, function(context) {
+	    ], HIGH_PRIORITY$p, function(context) {
 	      const {
 	        element,
 	        moddleElement,
@@ -84403,8 +84921,6 @@
 		emumerations: emumerations
 	};
 
-	var require$$0 = /*@__PURE__*/getAugmentedNamespace(index_esm);
-
 	var isFunction$1 = require$$0.isFunction,
 	    isObject$1 = require$$0.isObject,
 	    some$1 = require$$0.some;