@operato/scene-bpmn 1.1.1

package/dist/bpmn-event.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"bpmn-event.js","sourceRoot":"","sources":["../src/bpmn-event.ts"],"names":[],"mappings":"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","sourcesContent":["import { Component, Properties } from '@hatiolab/things-scene'\n\nimport BPMNControlBase from './base/bpmn-control-base'\n\nenum BEHAVIOR {\n  catching,\n  throwing\n}\n\nconst NATURE = {\n  mutable: false,\n  resizable: false,\n  rotatable: false,\n  properties: [\n    {\n      type: 'select',\n      name: 'eventType',\n      label: 'event-type',\n      property: {\n        options: [\n          {\n            display: 'start',\n            value: 'start'\n          },\n          {\n            display: 'intermediate',\n            value: 'intermediate'\n          },\n          {\n            display: 'end',\n            value: 'end'\n          }\n        ]\n      }\n    },\n    {\n      type: 'select',\n      name: 'marker',\n      label: 'marker',\n      property: {\n        options: [\n          {\n            display: 'message',\n            value: 'message'\n          },\n          {\n            display: 'timer',\n            value: 'timer'\n          },\n          {\n            display: 'error',\n            value: 'error'\n          },\n          {\n            display: 'escalation',\n            value: 'escalation'\n          },\n          {\n            display: 'cancel',\n            value: 'cancel'\n          },\n          {\n            display: 'compensation',\n            value: 'compensation'\n          },\n          {\n            display: 'conditional',\n            value: 'conditional'\n          },\n          {\n            display: 'link',\n            value: 'link'\n          },\n          {\n            display: 'signal',\n            value: 'signal'\n          },\n          {\n            display: 'terminate',\n            value: 'terminate'\n          },\n          {\n            display: 'multiple',\n            value: 'multiple'\n          },\n          {\n            display: 'parallel multiple',\n            value: 'parallel-multiple'\n          }\n        ]\n      }\n    }\n  ],\n  help: '/eipatterns/bpmn-event/bpmn-event'\n}\n\nexport default class BPMNEvent extends BPMNControlBase {\n  private imageElement?: HTMLImageElement\n\n  static get nature() {\n    return NATURE\n  }\n\n  render(ctx: CanvasRenderingContext2D) {\n    const { left, top, width, height } = this.bounds\n    const { lineWidth } = this.state\n    const { eventType } = this.state\n    const cx = width / 2\n    const cy = height / 2\n\n    ctx.translate(left, top)\n    ctx.beginPath()\n\n    switch (eventType) {\n      case 'intermediate':\n        this.setState('lineWidth', 2)\n\n        ctx.ellipse(cx, cy, width / 2, height / 2, 0, 0, 2 * Math.PI)\n        ctx.moveTo(width / 2 + width / 2.5, height / 2)\n        ctx.ellipse(cx, cy, width / 2.5, height / 2.5, 0, 0, 2 * Math.PI)\n        break\n      case 'end':\n        this.setState('lineWidth', 6)\n        ctx.ellipse(cx, cy, width / 2 - 1.5, height / 2 - 1.5, 0, 0, 2 * Math.PI)\n        break\n      case 'start':\n      default:\n        this.setState('lineWidth', 2)\n        ctx.ellipse(cx, cy, width / 2, height / 2, 0, 0, 2 * Math.PI)\n        break\n    }\n\n    this.drawFill(ctx)\n    this.drawStroke(ctx)\n\n    ctx.beginPath()\n\n    this.setState('lineWidth', lineWidth)\n\n    const image = this.getImageElement()\n    if (image) {\n      this.drawImage(ctx, image, width / 6, height / 6, (width * 2) / 3, (height * 2) / 3)\n    }\n\n    ctx.translate(-left, -top)\n  }\n\n  onchange(after: Properties, before: Properties) {\n    if ('marker' in after || 'strokeStyle' in after) {\n      delete this.imageElement\n    }\n  }\n\n  getImageElement(): HTMLImageElement | undefined {\n    if (!this.imageElement) {\n      const { marker, strokeStyle } = this.state\n\n      if (!marker) {\n        return\n      }\n\n      const src = IMAGES[marker]\n      if (!src) {\n        return\n      }\n\n      this.imageElement = new Image()\n      this.imageElement.src =\n        'data:image/svg+xml;charset=UTF-8;base64,' + btoa(src.replace(/{{strokeColor}}/g, strokeStyle))\n    }\n\n    return this.imageElement\n  }\n}\n\nComponent.register('bpmn-event', BPMNEvent)\n\nconst IMAGES: { [type: string]: string } = {\n  message: `\n  <svg version=\"1.1\" id=\"Layer_3\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" x=\"0px\" y=\"0px\"\n  viewBox=\"0 0 35 35\" style=\"enable-background:new 0 0 35 35;\" xml:space=\"preserve\">\n    <style type=\"text/css\">\n      .st0{fill:{{strokeColor}};}\n   </style>\n    <path class=\"st0\" d=\"M29.5,10.3c0-1.3-1.1-2.4-2.4-2.4H7.9c-1.3,0-2.4,1.1-2.4,2.4v14.4c0,1.3,1.1,2.4,2.4,2.4h19.2c1.3,0,2.4-1.1,2.4-2.4V10.3z\n      M27.1,9.3l-9.6,7l-9.6-7H27.1z M28.1,25.7H6.9v-16l10.6,8l10.6-8V25.7z\"/>\n  </svg>\n  `,\n  'message-fill': `\n  <svg version=\"1.1\" id=\"Layer_3\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" x=\"0px\" y=\"0px\"\n  viewBox=\"0 0 35 35\" style=\"enable-background:new 0 0 35 35;\" xml:space=\"preserve\">\n    <style type=\"text/css\">\n      .st0{fill:{{strokeColor}};}\n   </style>\n   <path d=\"M27.1,7.9H7.9c-1.3,0-2.4,1.1-2.4,2.4l0,14.4c0,1.3,1.1,2.4,2.4,2.4h19.2c1.3,0,2.4-1.1,2.4-2.4V10.3\n   C29.5,9,28.4,7.9,27.1,7.9z M27.1,12.7l-9.6,6l-9.6-6v-2.4l9.6,6l9.6-6V12.7z\"/>\n  </svg>\n  `,\n  timer: `\n  <svg version=\"1.1\" id=\"Layer_3\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" x=\"0px\" y=\"0px\"\n  viewBox=\"0 0 35 35\" style=\"enable-background:new 0 0 35 35;\" xml:space=\"preserve\">\n  <style type=\"text/css\">\n    .st0{fill:{{strokeColor}};}\n  </style>\n    <g>\n      <g id=\"XMLID_807_\">\n        <path class=\"st0\" d=\"M17.5,9.6c0.3,0,0.6-0.3,0.6-0.6V7.2c0-0.3-0.3-0.6-0.6-0.6c-0.3,0-0.6,0.3-0.6,0.6V9C16.9,9.3,17.2,9.6,17.5,9.6z\"/>\n      </g>\n      <g>\n        <path class=\"st0\" d=\"M7.4,18.2h1.8c0.3,0,0.6-0.3,0.6-0.6c0-0.3-0.3-0.6-0.6-0.6H7.4c-0.3,0-0.6,0.3-0.6,0.6C6.8,18,7,18.2,7.4,18.2z\"/>\n      </g>\n      <g>\n        <path class=\"st0\" d=\"M17.5,28.5c0.3,0,0.6-0.3,0.6-0.6v-1.8c0-0.3-0.3-0.6-0.6-0.6c-0.3,0-0.6,0.3-0.6,0.6v1.8C16.9,28.2,17.2,28.5,17.5,28.5z\n          \"/>\n      </g>\n      <g>\n        <path class=\"st0\" d=\"M25.9,18.2h1.8c0.3,0,0.6-0.3,0.6-0.6c0-0.3-0.3-0.6-0.6-0.6h-1.8c-0.3,0-0.6,0.3-0.6,0.6C25.3,18,25.5,18.2,25.9,18.2z\"\n          />\n      </g>\n      <g>\n        <path class=\"st0\" d=\"M13.2,10.9c0.1,0,0.2,0,0.3-0.1c0.3-0.2,0.4-0.5,0.2-0.8l-0.9-1.5c-0.2-0.3-0.5-0.4-0.8-0.2c-0.3,0.2-0.4,0.5-0.2,0.8\n          l0.9,1.5C12.8,10.8,13,10.9,13.2,10.9z\"/>\n      </g>\n      <g>\n        <path class=\"st0\" d=\"M9,23.5c0.1,0,0.2,0,0.3-0.1l1.5-0.9c0.3-0.2,0.4-0.5,0.2-0.8c-0.2-0.3-0.5-0.4-0.8-0.2l-1.5,0.9\n          c-0.3,0.2-0.4,0.5-0.2,0.8C8.6,23.4,8.8,23.5,9,23.5z\"/>\n      </g>\n      <g>\n        <path class=\"st0\" d=\"M22.6,27.2c0.1,0,0.2,0,0.3-0.1c0.3-0.2,0.4-0.5,0.2-0.8l-0.9-1.5c-0.2-0.3-0.5-0.4-0.8-0.2c-0.3,0.2-0.4,0.5-0.2,0.8\n          l0.9,1.5C22.2,27.1,22.4,27.2,22.6,27.2z\"/>\n      </g>\n      <g>\n        <path class=\"st0\" d=\"M25.1,14.5c0.1,0,0.2,0,0.3-0.1l1.5-0.9c0.3-0.2,0.4-0.5,0.2-0.8c-0.2-0.3-0.5-0.4-0.8-0.2l-1.5,0.9\n          c-0.3,0.2-0.4,0.5-0.2,0.8C24.7,14.4,24.9,14.5,25.1,14.5z\"/>\n      </g>\n      <g>\n        <path class=\"st0\" d=\"M10,13.8c0.2,0,0.4-0.1,0.5-0.3c0.2-0.3,0.1-0.7-0.2-0.8l-1.5-0.9c-0.3-0.2-0.7-0.1-0.8,0.2c-0.2,0.3-0.1,0.7,0.2,0.8\n          l1.5,0.9C9.8,13.8,9.9,13.8,10,13.8z\"/>\n      </g>\n      <g>\n        <path class=\"st0\" d=\"M12.4,27.1c0.2,0,0.4-0.1,0.5-0.3l0.9-1.5c0.2-0.3,0.1-0.7-0.2-0.8c-0.3-0.2-0.7-0.1-0.8,0.2l-0.9,1.5\n          c-0.2,0.3-0.1,0.7,0.2,0.8C12.2,27.1,12.3,27.1,12.4,27.1z\"/>\n      </g>\n      <g>\n        <path class=\"st0\" d=\"M26,23.5c0.2,0,0.4-0.1,0.5-0.3c0.2-0.3,0.1-0.7-0.2-0.8l-1.5-0.9c-0.3-0.2-0.7-0.1-0.8,0.2c-0.2,0.3-0.1,0.7,0.2,0.8\n          l1.5,0.9C25.8,23.5,25.9,23.5,26,23.5z\"/>\n      </g>\n      <g>\n        <path class=\"st0\" d=\"M21.8,10.8c0.2,0,0.4-0.1,0.5-0.3L23.2,9c0.2-0.3,0.1-0.7-0.2-0.8c-0.3-0.2-0.7-0.1-0.8,0.2l-0.9,1.5\n          c-0.2,0.3-0.1,0.7,0.2,0.8C21.6,10.8,21.7,10.8,21.8,10.8z\"/>\n      </g>\n      <g id=\"XMLID_806_\">\n        <path class=\"st0\" d=\"M17.5,17.7c0.4,0,0.7-0.3,0.7-0.7v-5.6c0-0.4-0.3-0.7-0.7-0.7c-0.4,0-0.7,0.3-0.7,0.7V17C16.8,17.4,17.1,17.7,17.5,17.7z\"\n          />\n      </g>\n      <g id=\"XMLID_805_\">\n        <path class=\"st0\" d=\"M17.5,18.3h3.9c0.4,0,0.7-0.3,0.7-0.7c0-0.4-0.3-0.7-0.7-0.7h-3.9c-0.4,0-0.7,0.3-0.7,0.7C16.8,17.9,17.1,18.3,17.5,18.3z\n          \"/>\n      </g>\n      <g>\n        <path class=\"st0\" d=\"M17.5,7.2c5.7,0,10.2,4.6,10.2,10.2s-4.6,10.2-10.2,10.2S7.2,23.2,7.2,17.5S11.8,7.2,17.5,7.2 M17.5,6.5\n          c-6.1,0-11,4.9-11,11s4.9,11,11,11s11-4.9,11-11S23.6,6.5,17.5,6.5L17.5,6.5z\"/>\n      </g>\n    </g>\n  </svg>\n  `,\n  error: `\n  <svg version=\"1.1\" id=\"Layer_3\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" x=\"0px\" y=\"0px\"\n  viewBox=\"0 0 35 35\" style=\"enable-background:new 0 0 35 35;\" xml:space=\"preserve\">\n  <style type=\"text/css\">\n    .st0{fill:{{strokeColor}};}\n  </style>\n  <g>\n    <path class=\"st0\" d=\"M9.7,10.3l11.1,6.1c0.2,0.1,0.5,0.2,0.7,0.2c0.4,0,0.7-0.1,1-0.4l4.9-4.3l-2,12.7l-10.1-6c-0.2-0.1-0.5-0.2-0.8-0.2\n      c-0.3,0-0.7,0.1-0.9,0.3l-6,4.7L9.7,10.3 M29.5,8l-8,7.1L8.5,8l-3,19l9-7.1l12,7.1L29.5,8L29.5,8z\"/>\n  </g>\n  </svg>\n  `,\n  'error-fill': `\n  <svg version=\"1.1\" id=\"Layer_3\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" x=\"0px\" y=\"0px\"\n  viewBox=\"0 0 35 35\" style=\"enable-background:new 0 0 35 35;\" xml:space=\"preserve\">\n  <style type=\"text/css\">\n    .st0{fill:{{strokeColor}};}\n  </style>\n  <g>\n    <polygon class=\"st0\" points=\"26.5,27 29.5,8 21.5,15.1 8.5,8 5.5,27 14.5,19.9 \t\"/>\n  </g>\n  </svg>\n  `,\n  escalation: `\n  <svg version=\"1.1\" id=\"Layer_3\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" x=\"0px\" y=\"0px\"\n  viewBox=\"0 0 35 35\" style=\"enable-background:new 0 0 35 35;\" xml:space=\"preserve\">\n    <style type=\"text/css\">\n    .st0{fill:none;stroke:{{strokeColor}};stroke-miterlimit:10;}\n    </style>\n    <polygon class=\"st0\" points=\"17.5,19.9 7.5,27 17.5,8 27.5,27 \"/>\n  </svg>\n  `,\n  'escalation-fill': `\n  <svg version=\"1.1\" id=\"Layer_3\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" x=\"0px\" y=\"0px\"\n  viewBox=\"0 0 35 35\" style=\"enable-background:new 0 0 35 35;\" xml:space=\"preserve\">\n    <style type=\"text/css\">\n    .st0{fill:{{strokeColor}};}\n    </style>\n    <polygon class=\"st0\" points=\"17.5,19.9 7.5,27 17.5,8 27.5,27 \"/>\n  </svg>\n  `,\n  cancel: `\n  <svg version=\"1.1\" id=\"Layer_3\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" x=\"0px\" y=\"0px\"\n  viewBox=\"0 0 35 35\" style=\"enable-background:new 0 0 35 35;\" xml:space=\"preserve\">\n    <style type=\"text/css\">\n    .st0{fill:{{strokeColor}};}\n    </style>\n    <path class=\"st0\" d=\"M24.4,8.8l1.8,1.8l-6.9,6.9l6.9,6.9l-1.8,1.8l-6.9-6.9l-6.9,6.9l-1.8-1.8l6.9-6.9l-6.9-6.9l1.8-1.8l6.9,6.9L24.4,8.8\n\t\t M24.4,7.4l-0.7,0.7l-6.2,6.2l-6.2-6.2l-0.7-0.7L9.9,8.1L8.1,9.9l-0.7,0.7l0.7,0.7l6.2,6.2l-6.2,6.2l-0.7,0.7l0.7,0.7l1.8,1.8\n\t\tl0.7,0.7l0.7-0.7l6.2-6.2l6.2,6.2l0.7,0.7l0.7-0.7l1.8-1.8l0.7-0.7l-0.7-0.7l-6.2-6.2l6.2-6.2l0.7-0.7l-0.7-0.7l-1.8-1.8L24.4,7.4\n\t\tL24.4,7.4z\"/>\n  </svg>\n  `,\n  'cancel-fill': `\n  <svg version=\"1.1\" id=\"Layer_3\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" x=\"0px\" y=\"0px\"\n  viewBox=\"0 0 35 35\" style=\"enable-background:new 0 0 35 35;\" xml:space=\"preserve\">\n    <style type=\"text/css\">\n      .st0{fill:{{strokeColor}};}\n    </style>\n    <g>\n      <rect class=\"st0\" x=\"6.5\" y=\"16.3\" transform=\"matrix(0.7071 -0.7071 0.7071 0.7071 -7.2487 17.5)\" width=\"22\" height=\"2.5\"/>\n    </g>\n    <g>\n      <rect class=\"st0\" x=\"16.2\" y=\"6.5\" transform=\"matrix(0.7071 -0.7071 0.7071 0.7071 -7.2487 17.5)\" width=\"2.5\" height=\"22\"/>\n    </g>\n  </svg>\n  `,\n  compensation: `\n  <svg version=\"1.1\" id=\"Layer_3\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" x=\"0px\" y=\"0px\"\n  viewBox=\"0 0 35 35\" style=\"enable-background:new 0 0 35 35;\" xml:space=\"preserve\">\n    <style type=\"text/css\">\n     .st0{fill:{{strokeColor}};}\n    </style>\n    <path class=\"st0\" d=\"M17,10.4v14.2l-7.1-7.1L17,10.4 M18,8l-9.5,9.5L18,27V8L18,8z M8.5,17.5L8.5,17.5L8.5,17.5L8.5,17.5L8.5,17.5z\"/>\n    <path class=\"st0\" d=\"M25.5,10.4v14.2l-7.1-7.1L25.5,10.4 M26.5,8L17,17.5l9.5,9.5V8L26.5,8z M17,17.5L17,17.5L17,17.5L17,17.5L17,17.5z\"/>\n  </svg>\n  `,\n  'compensation-fill': `\n  <svg version=\"1.1\" id=\"Layer_3\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" x=\"0px\" y=\"0px\"\n  viewBox=\"0 0 35 35\" style=\"enable-background:new 0 0 35 35;\" xml:space=\"preserve\">\n    <style type=\"text/css\">\n     .st0{fill:{{strokeColor}};}\n    </style>\n    <polygon class=\"st0\" points=\"8.5,17.5 18,8 18,27 8.5,17.5 \t\t\"/>\n    <polygon class=\"st0\" points=\"17,17.5 26.5,8 26.5,27 17,17.5 \t\t\"/>\n  </svg>\n  `,\n  conditional: `\n  <svg version=\"1.1\" id=\"Layer_3\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" x=\"0px\" y=\"0px\"\n  viewBox=\"0 0 35 35\" style=\"enable-background:new 0 0 35 35;\" xml:space=\"preserve\">\n    <style type=\"text/css\">\n     .st0{fill:{{strokeColor}};}\n    </style>\n    <g>\n      <path class=\"st0\" d=\"M28.6,11.1v14.8H6.5V11.1h20.3 M26.8,8H8.2c-1.5,0-2.7,1-2.7,2.1v15.8c0,1.2,1.2,1.1,2.7,1.1h18.7c1.5,0,2.7,0.1,2.7-1.1\n        V10.1C29.5,8.9,28.3,8,26.8,8L26.8,8z\"/>\n    </g>\n    <path class=\"st0\" d=\"M27.5,23.5h-20v-1h20V23.5z M27.5,17.8h-20v-1h20V17.8z M27.5,14.9h-20v-1h20V14.9z M27.5,20.6h-20v-1h20V20.6z\"/>\n  </svg>\n  `,\n  link: `\n  <svg version=\"1.1\" id=\"Layer_3\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" x=\"0px\" y=\"0px\"\n  viewBox=\"0 0 35 35\" style=\"enable-background:new 0 0 35 35;\" xml:space=\"preserve\">\n    <style type=\"text/css\">\n     .st0{fill:none;stroke:{{strokeColor}};stroke-miterlimit:10;}\n    </style>\n    <path class=\"st0\" d=\"M19,13.8V8l9.5,9.5L19,27v-5.8H6.5v-7.5H19z\"/>\n  </svg>\n  `,\n  'link-fill': `\n  <svg version=\"1.1\" id=\"Layer_3\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" x=\"0px\" y=\"0px\"\n  viewBox=\"0 0 35 35\" style=\"enable-background:new 0 0 35 35;\" xml:space=\"preserve\">\n    <style type=\"text/css\">\n     .st0{fill:{{strokeColor}};}\n    </style>\n    <path class=\"st0\" d=\"M19,13.8V8l9.5,9.5L19,27v-5.8H6.5v-7.5H19z\"/>\n  </svg>\n  `,\n  signal: `\n  <svg version=\"1.1\" id=\"Layer_3\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" x=\"0px\" y=\"0px\"\n  viewBox=\"0 0 35 35\" style=\"enable-background:new 0 0 35 35;\" xml:space=\"preserve\">\n    <style type=\"text/css\">\n     .st0{fill:none;stroke:{{strokeColor}};stroke-miterlimit:10;}\n    </style>\n    <polygon class=\"st0\" points=\"17.5,26.9 7.5,27 17.5,8 27.5,27 \"/>\n  </svg>\n  `,\n  'signal-fill': `\n  <svg version=\"1.1\" id=\"Layer_3\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" x=\"0px\" y=\"0px\"\n  viewBox=\"0 0 35 35\" style=\"enable-background:new 0 0 35 35;\" xml:space=\"preserve\">\n    <style type=\"text/css\">\n     .st0{fill:{{strokeColor}};}\n    </style>\n    <polygon class=\"st0\" points=\"17.5,26.9 7.5,27 17.5,8 27.5,27 \"/>\n  </svg>\n  `,\n  terminate: `\n  <svg version=\"1.1\" id=\"Layer_3\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" x=\"0px\" y=\"0px\"\n  viewBox=\"0 0 35 35\" style=\"enable-background:new 0 0 35 35;\" xml:space=\"preserve\">\n    <style type=\"text/css\">\n     .st0{fill:{{strokeColor}};}\n    </style>\n    <circle class=\"st0\" cx=\"17.5\" cy=\"17.5\" r=\"11.5\"/>\n  </svg>\n  `,\n  multiple: `\n  <svg version=\"1.1\" id=\"Layer_3\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" x=\"0px\" y=\"0px\"\n  viewBox=\"0 0 35 35\" style=\"enable-background:new 0 0 35 35;\" xml:space=\"preserve\">\n    <style type=\"text/css\">\n     .st0{stroke:{{strokeColor}};}\n    </style>\n    <path class=\"st0\" d=\"M17.5,9.2l8.8,6.4L23,26H12L8.7,15.6L17.5,9.2 M17.5,8l-10,7.3L11.3,27h12.4l3.8-11.8L17.5,8L17.5,8z\"/>\n  </svg>\n  `,\n  'multiple-fill': `\n  <svg version=\"1.1\" id=\"Layer_3\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" x=\"0px\" y=\"0px\"\n  viewBox=\"0 0 35 35\" style=\"enable-background:new 0 0 35 35;\" xml:space=\"preserve\">\n    <style type=\"text/css\">\n     .st0{fill:{{strokeColor}};}\n    </style>\n    <polygon class=\"st0\" points=\"17.5,8 7.5,15.3 11.3,27 23.7,27 27.5,15.3 \t\"/>\n  </svg>\n  `,\n  'parallel-multiple': `\n  <svg version=\"1.1\" id=\"Layer_3\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" x=\"0px\" y=\"0px\"\n  viewBox=\"0 0 35 35\" style=\"enable-background:new 0 0 35 35;\" xml:space=\"preserve\">\n    <style type=\"text/css\">\n     .st0{fill:none;stroke:{{strokeColor}};stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}\n     .st1{fill:{{strokeColor}};}\n    </style>\n    <path class=\"st1\" d=\"M18.4,10v6.6H25l0,1.7h-6.6V25h-1.7l0-6.6H10v-1.7h6.6V10H18.4 M19.4,9h-1h-1.7h-1v1v5.6H10H9v1v1.7v1h1h5.6l0,5.6v1h1h1.7\n\t\th1v-1v-5.6H25h1l0-1l0-1.7l0-1h-1h-5.6V10V9L19.4,9z\"/>\n    <circle class=\"st0\" cx=\"17.5\" cy=\"17.5\" r=\"12\"/>\n  </svg>\n  `\n}\n"]}

package/dist/bpmn-flow.d.ts

@@ -0,0 +1,19 @@
+import { OrthoLine } from '@hatiolab/things-scene';
+export default class BPMNFlow extends OrthoLine {
+    get nature(): {
+        mutable: boolean;
+        resizable: boolean;
+        rotatable: boolean;
+        properties: {
+            type: string;
+            label: string;
+            name: string;
+            property: {
+                min: number;
+                max: number;
+                step: number;
+            };
+        }[];
+        help: string;
+    };
+}

package/dist/bpmn-flow.js

@@ -0,0 +1,26 @@
+import { Component, OrthoLine } from '@hatiolab/things-scene';
+const NATURE = {
+    mutable: false,
+    resizable: false,
+    rotatable: false,
+    properties: [
+        {
+            type: 'number',
+            label: 'round',
+            name: 'round',
+            property: {
+                min: 0,
+                max: 100,
+                step: 1
+            }
+        }
+    ],
+    help: 'scene/component/bpmn-flow'
+};
+export default class BPMNFlow extends OrthoLine {
+    get nature() {
+        return NATURE;
+    }
+}
+Component.register('bpmn-flow', BPMNFlow);
+//# sourceMappingURL=bpmn-flow.js.map

package/dist/bpmn-flow.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"bpmn-flow.js","sourceRoot":"","sources":["../src/bpmn-flow.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAA;AAE7D,MAAM,MAAM,GAAG;IACb,OAAO,EAAE,KAAK;IACd,SAAS,EAAE,KAAK;IAChB,SAAS,EAAE,KAAK;IAChB,UAAU,EAAE;QACV;YACE,IAAI,EAAE,QAAQ;YACd,KAAK,EAAE,OAAO;YACd,IAAI,EAAE,OAAO;YACb,QAAQ,EAAE;gBACR,GAAG,EAAE,CAAC;gBACN,GAAG,EAAE,GAAG;gBACR,IAAI,EAAE,CAAC;aACR;SACF;KACF;IACD,IAAI,EAAE,2BAA2B;CAClC,CAAA;AAED,MAAM,CAAC,OAAO,OAAO,QAAS,SAAQ,SAAS;IAC7C,IAAI,MAAM;QACR,OAAO,MAAM,CAAA;IACf,CAAC;CACF;AAED,SAAS,CAAC,QAAQ,CAAC,WAAW,EAAE,QAAQ,CAAC,CAAA","sourcesContent":["import { Component, OrthoLine } from '@hatiolab/things-scene'\n\nconst NATURE = {\n  mutable: false,\n  resizable: false,\n  rotatable: false,\n  properties: [\n    {\n      type: 'number',\n      label: 'round',\n      name: 'round',\n      property: {\n        min: 0,\n        max: 100,\n        step: 1\n      }\n    }\n  ],\n  help: 'scene/component/bpmn-flow'\n}\n\nexport default class BPMNFlow extends OrthoLine {\n  get nature() {\n    return NATURE\n  }\n}\n\nComponent.register('bpmn-flow', BPMNFlow)\n"]}

package/dist/bpmn-gateway.d.ts

@@ -0,0 +1,25 @@
+import { Properties } from '@hatiolab/things-scene';
+import BPMNControlBase from './base/bpmn-control-base';
+export default class BPMNGateway extends BPMNControlBase {
+    private imageElement?;
+    static get nature(): {
+        mutable: boolean;
+        resizable: boolean;
+        rotatable: boolean;
+        properties: {
+            type: string;
+            label: string;
+            name: string;
+            property: {
+                options: {
+                    display: string;
+                    value: string;
+                }[];
+            };
+        }[];
+        help: string;
+    };
+    render(ctx: CanvasRenderingContext2D): void;
+    onchange(after: Properties, before: Properties): void;
+    getImageElement(): HTMLImageElement | undefined;
+}

package/dist/bpmn-gateway.js

@@ -0,0 +1,146 @@
+import { Component } from '@hatiolab/things-scene';
+import BPMNControlBase from './base/bpmn-control-base';
+const NATURE = {
+    mutable: false,
+    resizable: false,
+    rotatable: false,
+    properties: [
+        {
+            type: 'select',
+            label: 'gateway-type',
+            name: 'gatewayType',
+            property: {
+                options: [
+                    {
+                        display: '',
+                        value: ''
+                    },
+                    {
+                        display: 'exclusive',
+                        value: 'exclusive'
+                    },
+                    {
+                        display: 'inclusive',
+                        value: 'inclusive'
+                    },
+                    {
+                        display: 'complex',
+                        value: 'complex'
+                    },
+                    {
+                        display: 'event based',
+                        value: 'event-based'
+                    },
+                    {
+                        display: 'parallel',
+                        value: 'parallel'
+                    }
+                ]
+            }
+        }
+    ],
+    help: '/eipatterns/bpmn-gateway/bpmn-gateway'
+};
+export default class BPMNGateway extends BPMNControlBase {
+    static get nature() {
+        return NATURE;
+    }
+    render(ctx) {
+        var { left, top, width, height } = this.bounds;
+        ctx.translate(left, top);
+        ctx.beginPath();
+        ctx.moveTo(width / 2, 0);
+        ctx.lineTo(width, height / 2);
+        ctx.lineTo(width / 2, height);
+        ctx.lineTo(0, height / 2);
+        ctx.lineTo(width / 2, 0);
+        this.drawFill(ctx);
+        this.drawStroke(ctx);
+        ctx.beginPath();
+        const image = this.getImageElement();
+        if (image) {
+            this.drawImage(ctx, image, width / 6, height / 6, (width * 2) / 3, (height * 2) / 3);
+        }
+        ctx.translate(-left, -top);
+    }
+    onchange(after, before) {
+        if ('gatewayType' in after || 'strokeStyle' in after) {
+            delete this.imageElement;
+        }
+    }
+    getImageElement() {
+        if (!this.imageElement) {
+            const { gatewayType, strokeStyle } = this.state;
+            if (!gatewayType) {
+                return;
+            }
+            const src = IMAGES[gatewayType];
+            if (!src) {
+                return;
+            }
+            this.imageElement = new Image();
+            this.imageElement.src =
+                'data:image/svg+xml;charset=UTF-8;base64,' + btoa(src.replace(/{{strokeColor}}/g, strokeStyle));
+        }
+        return this.imageElement;
+    }
+}
+Component.register('bpmn-gateway', BPMNGateway);
+const IMAGES = {
+    inclusive: `
+  <svg version="1.1" id="Layer_3" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+  viewBox="0 0 35 35" style="enable-background:new 0 0 35 35;" xml:space="preserve">
+    <style type="text/css">
+     .st0{fill:{{strokeColor}};}
+    </style>
+    <path class="st0" d="M17.5,8.5c5,0,9,4,9,9s-4,9-9,9s-9-4-9-9S12.5,8.5,17.5,8.5 M17.5,6C11.1,6,6,11.1,6,17.5S11.1,29,17.5,29S29,23.9,29,17.5
+		S23.9,6,17.5,6L17.5,6z"/>
+  </svg>
+  `,
+    exclusive: `
+  <svg version="1.1" id="Layer_3" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+  viewBox="0 0 35 35" style="enable-background:new 0 0 35 35;" xml:space="preserve">
+    <style type="text/css">
+     .st0{fill:{{strokeColor}};}
+    </style>
+    <rect class="st0" x="6.5" y="15.8" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -7.2487 17.5)" width="22" height="3.5"/>
+    <rect class="st0" x="15.8" y="6.5" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -7.2487 17.5)" width="3.5" height="22"/>
+  </svg>
+  `,
+    parallel: `
+  <svg version="1.1" id="Layer_3" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+  viewBox="0 0 35 35" style="enable-background:new 0 0 35 35;" xml:space="preserve">
+    <style type="text/css">
+     .st0{fill:{{strokeColor}};}
+    </style>
+    <rect class="st0" x="16.3" y="6.5" width="3.5" height="22"/>
+    <rect class="st0" x="6.5" y="16.2" width="22" height="3.5"/>
+  </svg>
+  `,
+    complex: `
+  <svg version="1.1" id="Layer_3" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+  viewBox="0 0 35 35" style="enable-background:new 0 0 35 35;" xml:space="preserve">
+    <style type="text/css">
+     .st0{fill:{{strokeColor}};}
+    </style>
+    <rect class="st0" x="16.2" y="6.5" width="3.5" height="22"/>
+    <rect class="st0" x="6.5" y="16.2" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -7.2487 17.5)" width="22" height="3.5"/>
+    <rect class="st0" x="16.2" y="6.5" transform="matrix(0.7072 -0.707 0.707 0.7072 -7.2487 17.4966)" width="3.5" height="22"/>
+    <rect class="st0" x="6.5" y="16.2" width="22" height="3.5"/>
+  </svg>
+  `,
+    'event-based': `
+  <svg version="1.1" id="Layer_3" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+  viewBox="0 0 35 35" style="enable-background:new 0 0 35 35;" xml:space="preserve">
+    <style type="text/css">
+     .st0{fill:{{strokeColor}};}
+    </style>
+    <path class="st0" d="M17.5,6.2c6.2,0,11.2,5,11.2,11.2s-5,11.2-11.2,11.2s-11.2-5-11.2-11.2S11.3,6.2,17.5,6.2 M17.5,5.5c-6.6,0-12,5.4-12,12
+    s5.4,12,12,12s12-5.4,12-12S24.1,5.5,17.5,5.5L17.5,5.5z"/>
+    <path class="st0" d="M17.5,8.2c5.1,0,9.2,4.1,9.2,9.2s-4.1,9.2-9.2,9.2s-9.2-4.1-9.2-9.2S12.4,8.2,17.5,8.2 M17.5,7.5c-5.5,0-10,4.5-10,10
+    s4.5,10,10,10s10-4.5,10-10S23,7.5,17.5,7.5L17.5,7.5z"/>
+    <path class="st0" d="M17.5,11.7l5.7,4.1L21,22.5h-7l-2.2-6.7L17.5,11.7 M17.5,10l-7.3,5.3l2.8,8.6h9l2.8-8.6L17.5,10L17.5,10z"/>
+  </svg>
+  `
+};
+//# sourceMappingURL=bpmn-gateway.js.map

package/dist/bpmn-gateway.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"bpmn-gateway.js","sourceRoot":"","sources":["../src/bpmn-gateway.ts"],"names":[],"mappings":"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","sourcesContent":["import { Component, Properties } from '@hatiolab/things-scene'\n\nimport BPMNControlBase from './base/bpmn-control-base'\n\nconst NATURE = {\n  mutable: false,\n  resizable: false,\n  rotatable: false,\n  properties: [\n    {\n      type: 'select',\n      label: 'gateway-type',\n      name: 'gatewayType',\n      property: {\n        options: [\n          {\n            display: '',\n            value: ''\n          },\n          {\n            display: 'exclusive',\n            value: 'exclusive'\n          },\n          {\n            display: 'inclusive',\n            value: 'inclusive'\n          },\n          {\n            display: 'complex',\n            value: 'complex'\n          },\n          {\n            display: 'event based',\n            value: 'event-based'\n          },\n          {\n            display: 'parallel',\n            value: 'parallel'\n          }\n        ]\n      }\n    }\n  ],\n  help: '/eipatterns/bpmn-gateway/bpmn-gateway'\n}\n\nexport default class BPMNGateway extends BPMNControlBase {\n  private imageElement?: HTMLImageElement\n\n  static get nature() {\n    return NATURE\n  }\n\n  render(ctx: CanvasRenderingContext2D) {\n    var { left, top, width, height } = this.bounds\n\n    ctx.translate(left, top)\n    ctx.beginPath()\n\n    ctx.moveTo(width / 2, 0)\n    ctx.lineTo(width, height / 2)\n    ctx.lineTo(width / 2, height)\n    ctx.lineTo(0, height / 2)\n    ctx.lineTo(width / 2, 0)\n\n    this.drawFill(ctx)\n    this.drawStroke(ctx)\n\n    ctx.beginPath()\n\n    const image = this.getImageElement()\n    if (image) {\n      this.drawImage(ctx, image, width / 6, height / 6, (width * 2) / 3, (height * 2) / 3)\n    }\n\n    ctx.translate(-left, -top)\n  }\n\n  onchange(after: Properties, before: Properties) {\n    if ('gatewayType' in after || 'strokeStyle' in after) {\n      delete this.imageElement\n    }\n  }\n\n  getImageElement(): HTMLImageElement | undefined {\n    if (!this.imageElement) {\n      const { gatewayType, strokeStyle } = this.state\n\n      if (!gatewayType) {\n        return\n      }\n\n      const src = IMAGES[gatewayType]\n      if (!src) {\n        return\n      }\n\n      this.imageElement = new Image()\n      this.imageElement.src =\n        'data:image/svg+xml;charset=UTF-8;base64,' + btoa(src.replace(/{{strokeColor}}/g, strokeStyle))\n    }\n\n    return this.imageElement\n  }\n}\n\nComponent.register('bpmn-gateway', BPMNGateway)\n\nconst IMAGES: { [type: string]: string } = {\n  inclusive: `\n  <svg version=\"1.1\" id=\"Layer_3\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" x=\"0px\" y=\"0px\"\n  viewBox=\"0 0 35 35\" style=\"enable-background:new 0 0 35 35;\" xml:space=\"preserve\">\n    <style type=\"text/css\">\n     .st0{fill:{{strokeColor}};}\n    </style>\n    <path class=\"st0\" d=\"M17.5,8.5c5,0,9,4,9,9s-4,9-9,9s-9-4-9-9S12.5,8.5,17.5,8.5 M17.5,6C11.1,6,6,11.1,6,17.5S11.1,29,17.5,29S29,23.9,29,17.5\n\t\tS23.9,6,17.5,6L17.5,6z\"/>\n  </svg>\n  `,\n  exclusive: `\n  <svg version=\"1.1\" id=\"Layer_3\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" x=\"0px\" y=\"0px\"\n  viewBox=\"0 0 35 35\" style=\"enable-background:new 0 0 35 35;\" xml:space=\"preserve\">\n    <style type=\"text/css\">\n     .st0{fill:{{strokeColor}};}\n    </style>\n    <rect class=\"st0\" x=\"6.5\" y=\"15.8\" transform=\"matrix(0.7071 -0.7071 0.7071 0.7071 -7.2487 17.5)\" width=\"22\" height=\"3.5\"/>\n    <rect class=\"st0\" x=\"15.8\" y=\"6.5\" transform=\"matrix(0.7071 -0.7071 0.7071 0.7071 -7.2487 17.5)\" width=\"3.5\" height=\"22\"/>\n  </svg>\n  `,\n  parallel: `\n  <svg version=\"1.1\" id=\"Layer_3\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" x=\"0px\" y=\"0px\"\n  viewBox=\"0 0 35 35\" style=\"enable-background:new 0 0 35 35;\" xml:space=\"preserve\">\n    <style type=\"text/css\">\n     .st0{fill:{{strokeColor}};}\n    </style>\n    <rect class=\"st0\" x=\"16.3\" y=\"6.5\" width=\"3.5\" height=\"22\"/>\n    <rect class=\"st0\" x=\"6.5\" y=\"16.2\" width=\"22\" height=\"3.5\"/>\n  </svg>\n  `,\n  complex: `\n  <svg version=\"1.1\" id=\"Layer_3\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" x=\"0px\" y=\"0px\"\n  viewBox=\"0 0 35 35\" style=\"enable-background:new 0 0 35 35;\" xml:space=\"preserve\">\n    <style type=\"text/css\">\n     .st0{fill:{{strokeColor}};}\n    </style>\n    <rect class=\"st0\" x=\"16.2\" y=\"6.5\" width=\"3.5\" height=\"22\"/>\n    <rect class=\"st0\" x=\"6.5\" y=\"16.2\" transform=\"matrix(0.7071 -0.7071 0.7071 0.7071 -7.2487 17.5)\" width=\"22\" height=\"3.5\"/>\n    <rect class=\"st0\" x=\"16.2\" y=\"6.5\" transform=\"matrix(0.7072 -0.707 0.707 0.7072 -7.2487 17.4966)\" width=\"3.5\" height=\"22\"/>\n    <rect class=\"st0\" x=\"6.5\" y=\"16.2\" width=\"22\" height=\"3.5\"/>\n  </svg>\n  `,\n  'event-based': `\n  <svg version=\"1.1\" id=\"Layer_3\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" x=\"0px\" y=\"0px\"\n  viewBox=\"0 0 35 35\" style=\"enable-background:new 0 0 35 35;\" xml:space=\"preserve\">\n    <style type=\"text/css\">\n     .st0{fill:{{strokeColor}};}\n    </style>\n    <path class=\"st0\" d=\"M17.5,6.2c6.2,0,11.2,5,11.2,11.2s-5,11.2-11.2,11.2s-11.2-5-11.2-11.2S11.3,6.2,17.5,6.2 M17.5,5.5c-6.6,0-12,5.4-12,12\n    s5.4,12,12,12s12-5.4,12-12S24.1,5.5,17.5,5.5L17.5,5.5z\"/>\n    <path class=\"st0\" d=\"M17.5,8.2c5.1,0,9.2,4.1,9.2,9.2s-4.1,9.2-9.2,9.2s-9.2-4.1-9.2-9.2S12.4,8.2,17.5,8.2 M17.5,7.5c-5.5,0-10,4.5-10,10\n    s4.5,10,10,10s10-4.5,10-10S23,7.5,17.5,7.5L17.5,7.5z\"/>\n    <path class=\"st0\" d=\"M17.5,11.7l5.7,4.1L21,22.5h-7l-2.2-6.7L17.5,11.7 M17.5,10l-7.3,5.3l2.8,8.6h9l2.8-8.6L17.5,10L17.5,10z\"/>\n  </svg>\n  `\n}\n"]}

package/dist/bpmn-group.d.ts

@@ -0,0 +1,11 @@
+import BPMNControlBase, { NODE } from './base/bpmn-control-base';
+export default class BPMNGroup extends BPMNControlBase {
+    static get nature(): {
+        mutable: boolean;
+        resizable: boolean;
+        rotatable: boolean;
+        properties: never[];
+        help: string;
+    };
+    get nodes(): NODE[];
+}

package/dist/bpmn-group.js

@@ -0,0 +1,35 @@
+import { Component } from '@hatiolab/things-scene';
+import BPMNControlBase, { DIRECTION, INOUT, FLOW } from './base/bpmn-control-base';
+const NATURE = {
+    mutable: false,
+    resizable: true,
+    rotatable: false,
+    properties: [],
+    help: '/eipatterns/bpmn-group/bpmn-group'
+};
+export default class BPMNGroup extends BPMNControlBase {
+    static get nature() {
+        return NATURE;
+    }
+    get nodes() {
+        return [
+            {
+                name: 'In',
+                description: 'Message inlet',
+                inout: INOUT.IN,
+                type: FLOW.MESSAGE,
+                direction: DIRECTION.WEST,
+                multiplicity: 1
+            },
+            {
+                name: 'Out',
+                description: 'Message outlet',
+                inout: INOUT.OUT,
+                type: FLOW.MESSAGE,
+                direction: DIRECTION.EAST
+            }
+        ];
+    }
+}
+Component.register('bpmn-group', BPMNGroup);
+//# sourceMappingURL=bpmn-group.js.map

package/dist/bpmn-group.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"bpmn-group.js","sourceRoot":"","sources":["../src/bpmn-group.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAA;AAElD,OAAO,eAAe,EAAE,EAAE,SAAS,EAAE,KAAK,EAAQ,IAAI,EAAE,MAAM,0BAA0B,CAAA;AAExF,MAAM,MAAM,GAAG;IACb,OAAO,EAAE,KAAK;IACd,SAAS,EAAE,IAAI;IACf,SAAS,EAAE,KAAK;IAChB,UAAU,EAAE,EAAE;IACd,IAAI,EAAE,mCAAmC;CAC1C,CAAA;AAED,MAAM,CAAC,OAAO,OAAO,SAAU,SAAQ,eAAe;IACpD,MAAM,KAAK,MAAM;QACf,OAAO,MAAM,CAAA;IACf,CAAC;IAED,IAAI,KAAK;QACP,OAAO;YACL;gBACE,IAAI,EAAE,IAAI;gBACV,WAAW,EAAE,eAAe;gBAC5B,KAAK,EAAE,KAAK,CAAC,EAAE;gBACf,IAAI,EAAE,IAAI,CAAC,OAAO;gBAClB,SAAS,EAAE,SAAS,CAAC,IAAI;gBACzB,YAAY,EAAE,CAAC;aAChB;YACD;gBACE,IAAI,EAAE,KAAK;gBACX,WAAW,EAAE,gBAAgB;gBAC7B,KAAK,EAAE,KAAK,CAAC,GAAG;gBAChB,IAAI,EAAE,IAAI,CAAC,OAAO;gBAClB,SAAS,EAAE,SAAS,CAAC,IAAI;aAC1B;SACF,CAAA;IACH,CAAC;CACF;AAED,SAAS,CAAC,QAAQ,CAAC,YAAY,EAAE,SAAS,CAAC,CAAA","sourcesContent":["import { Component } from '@hatiolab/things-scene'\n\nimport BPMNControlBase, { DIRECTION, INOUT, NODE, FLOW } from './base/bpmn-control-base'\n\nconst NATURE = {\n  mutable: false,\n  resizable: true,\n  rotatable: false,\n  properties: [],\n  help: '/eipatterns/bpmn-group/bpmn-group'\n}\n\nexport default class BPMNGroup extends BPMNControlBase {\n  static get nature() {\n    return NATURE\n  }\n\n  get nodes(): NODE[] {\n    return [\n      {\n        name: 'In',\n        description: 'Message inlet',\n        inout: INOUT.IN,\n        type: FLOW.MESSAGE,\n        direction: DIRECTION.WEST,\n        multiplicity: 1\n      },\n      {\n        name: 'Out',\n        description: 'Message outlet',\n        inout: INOUT.OUT,\n        type: FLOW.MESSAGE,\n        direction: DIRECTION.EAST\n      }\n    ]\n  }\n}\n\nComponent.register('bpmn-group', BPMNGroup)\n"]}

package/dist/bpmn-lane.d.ts

@@ -0,0 +1,15 @@
+import BPMNContainerBase from './base/bpmn-container-base';
+export default class BPMNLane extends BPMNContainerBase {
+    get nature(): {
+        mutable: boolean;
+        resizable: boolean;
+        rotatable: boolean;
+        properties: {
+            type: string;
+            name: string;
+            label: string;
+        }[];
+        help: string;
+    };
+    get hasTextProperty(): boolean;
+}

package/dist/bpmn-lane.js

@@ -0,0 +1,25 @@
+import { Component } from '@hatiolab/things-scene';
+import BPMNContainerBase from './base/bpmn-container-base';
+const NATURE = {
+    mutable: false,
+    resizable: true,
+    rotatable: false,
+    properties: [
+        {
+            type: 'string',
+            name: 'participant',
+            label: 'participant'
+        }
+    ],
+    help: '/eipatterns/bpmn-lane/bpmn-lane'
+};
+export default class BPMNLane extends BPMNContainerBase {
+    get nature() {
+        return NATURE;
+    }
+    get hasTextProperty() {
+        return true;
+    }
+}
+Component.register('bpmn-lane', BPMNLane);
+//# sourceMappingURL=bpmn-lane.js.map

package/dist/bpmn-lane.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"bpmn-lane.js","sourceRoot":"","sources":["../src/bpmn-lane.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAA;AAElD,OAAO,iBAAmD,MAAM,4BAA4B,CAAA;AAE5F,MAAM,MAAM,GAAG;IACb,OAAO,EAAE,KAAK;IACd,SAAS,EAAE,IAAI;IACf,SAAS,EAAE,KAAK;IAChB,UAAU,EAAE;QACV;YACE,IAAI,EAAE,QAAQ;YACd,IAAI,EAAE,aAAa;YACnB,KAAK,EAAE,aAAa;SACrB;KACF;IACD,IAAI,EAAE,iCAAiC;CACxC,CAAA;AAED,MAAM,CAAC,OAAO,OAAO,QAAS,SAAQ,iBAAiB;IACrD,IAAI,MAAM;QACR,OAAO,MAAM,CAAA;IACf,CAAC;IAED,IAAI,eAAe;QACjB,OAAO,IAAI,CAAA;IACb,CAAC;CAkBF;AAED,SAAS,CAAC,QAAQ,CAAC,WAAW,EAAE,QAAQ,CAAC,CAAA","sourcesContent":["import { Component } from '@hatiolab/things-scene'\n\nimport BPMNContainerBase, { DIRECTION, INOUT, NODE, FLOW } from './base/bpmn-container-base'\n\nconst NATURE = {\n  mutable: false,\n  resizable: true,\n  rotatable: false,\n  properties: [\n    {\n      type: 'string',\n      name: 'participant',\n      label: 'participant'\n    }\n  ],\n  help: '/eipatterns/bpmn-lane/bpmn-lane'\n}\n\nexport default class BPMNLane extends BPMNContainerBase {\n  get nature() {\n    return NATURE\n  }\n\n  get hasTextProperty() {\n    return true\n  }\n\n  // get text() {\n  //   return this.state.name\n  // }\n\n  // get textBounds() {\n  //   var { paddingTop = 0, paddingLeft = 0, paddingRight = 0, paddingBottom = 0 } = this.state\n\n  //   var { left, top, width, height } = this.bounds\n\n  //   return {\n  //     left: left + paddingLeft,\n  //     top: top + paddingTop,\n  //     width: Math.max(width - paddingLeft - paddingRight, 0),\n  //     height: Math.max(height - paddingTop - paddingBottom, 0)\n  //   }\n  // }\n}\n\nComponent.register('bpmn-lane', BPMNLane)\n"]}

package/dist/bpmn-pool.d.ts

@@ -0,0 +1,14 @@
+import BPMNContainerBase from './base/bpmn-container-base';
+export default class BPMNPool extends BPMNContainerBase {
+    get nature(): {
+        mutable: boolean;
+        resizable: boolean;
+        rotatable: boolean;
+        properties: {
+            type: string;
+            name: string;
+            label: string;
+        }[];
+        help: string;
+    };
+}

package/dist/bpmn-pool.js

@@ -0,0 +1,22 @@
+import { Component } from '@hatiolab/things-scene';
+import BPMNContainerBase from './base/bpmn-container-base';
+const NATURE = {
+    mutable: false,
+    resizable: true,
+    rotatable: false,
+    properties: [
+        {
+            type: 'string',
+            name: 'name',
+            label: 'name'
+        }
+    ],
+    help: '/eipatterns/bpmn-pool/bpmn-pool'
+};
+export default class BPMNPool extends BPMNContainerBase {
+    get nature() {
+        return NATURE;
+    }
+}
+Component.register('bpmn-pool', BPMNPool);
+//# sourceMappingURL=bpmn-pool.js.map

package/dist/bpmn-pool.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"bpmn-pool.js","sourceRoot":"","sources":["../src/bpmn-pool.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAA;AAElD,OAAO,iBAAmD,MAAM,4BAA4B,CAAA;AAE5F,MAAM,MAAM,GAAG;IACb,OAAO,EAAE,KAAK;IACd,SAAS,EAAE,IAAI;IACf,SAAS,EAAE,KAAK;IAChB,UAAU,EAAE;QACV;YACE,IAAI,EAAE,QAAQ;YACd,IAAI,EAAE,MAAM;YACZ,KAAK,EAAE,MAAM;SACd;KACF;IACD,IAAI,EAAE,iCAAiC;CACxC,CAAA;AAED,MAAM,CAAC,OAAO,OAAO,QAAS,SAAQ,iBAAiB;IACrD,IAAI,MAAM;QACR,OAAO,MAAM,CAAA;IACf,CAAC;CACF;AAED,SAAS,CAAC,QAAQ,CAAC,WAAW,EAAE,QAAQ,CAAC,CAAA","sourcesContent":["import { Component } from '@hatiolab/things-scene'\n\nimport BPMNContainerBase, { DIRECTION, INOUT, NODE, FLOW } from './base/bpmn-container-base'\n\nconst NATURE = {\n  mutable: false,\n  resizable: true,\n  rotatable: false,\n  properties: [\n    {\n      type: 'string',\n      name: 'name',\n      label: 'name'\n    }\n  ],\n  help: '/eipatterns/bpmn-pool/bpmn-pool'\n}\n\nexport default class BPMNPool extends BPMNContainerBase {\n  get nature() {\n    return NATURE\n  }\n}\n\nComponent.register('bpmn-pool', BPMNPool)\n"]}

package/dist/bpmn-subprocess.d.ts

@@ -0,0 +1,19 @@
+import { Properties } from '@hatiolab/things-scene';
+import BPMNControlBase from './base/bpmn-control-base';
+export default class BPMNSubprocess extends BPMNControlBase {
+    private markerImages?;
+    static get nature(): {
+        mutable: boolean;
+        resizable: boolean;
+        rotatable: boolean;
+        properties: {
+            type: string;
+            label: string;
+            name: string;
+        }[];
+        help: string;
+    };
+    render(ctx: CanvasRenderingContext2D): void;
+    onchange(after: Properties, before: Properties): void;
+    getMarkerImages(): HTMLImageElement[] | null | undefined;
+}

package/dist/bpmn-subprocess.js

@@ -0,0 +1,146 @@
+import { Component } from '@hatiolab/things-scene';
+import BPMNControlBase from './base/bpmn-control-base';
+const NATURE = {
+    mutable: false,
+    resizable: true,
+    rotatable: false,
+    properties: [
+        {
+            type: 'checkbox',
+            label: 'loop',
+            name: 'loop'
+        },
+        {
+            type: 'checkbox',
+            label: 'multi-instance',
+            name: 'multiInstance'
+        },
+        {
+            type: 'checkbox',
+            label: 'compensation',
+            name: 'compensation'
+        },
+        {
+            type: 'checkbox',
+            label: 'adhoc',
+            name: 'adhoc'
+        }
+    ],
+    help: '/eipatterns/bpmn-subprocess/bpmn-subprocess'
+};
+export default class BPMNSubprocess extends BPMNControlBase {
+    static get nature() {
+        return NATURE;
+    }
+    render(ctx) {
+        var { left, top, width, height } = this.bounds;
+        ctx.translate(left, top);
+        ctx.beginPath();
+        var radius = 9;
+        ctx.moveTo(radius, 0);
+        ctx.arcTo(width, 0, width, height, radius);
+        ctx.arcTo(width, height, 0, height, radius);
+        ctx.arcTo(0, height, 0, 0, radius);
+        ctx.arcTo(0, 0, width, 0, radius);
+        this.drawFill(ctx);
+        this.drawStroke(ctx);
+        ctx.beginPath();
+        const images = this.getMarkerImages() || [];
+        const start = (width - images.length * 24) / 2;
+        images.forEach((image, index) => {
+            this.drawImage(ctx, image, start + index * 24, height - 24, 24, 24);
+        });
+        ctx.translate(-left, -top);
+    }
+    onchange(after, before) {
+        if (['loop', 'multiInstance', 'adhoc', 'compensation', 'strokeStyle'].find(prop => prop in after)) {
+            delete this.markerImages;
+        }
+    }
+    getMarkerImages() {
+        if (!this.markerImages) {
+            const { strokeStyle } = this.state;
+            this.markerImages = Object.keys(MARKERS)
+                .filter(key => key === 'subprocess' || this.state[key])
+                .map(key => {
+                let image = new Image();
+                image.src =
+                    'data:image/svg+xml;charset=UTF-8;base64,' + btoa(MARKERS[key].replace(/{{strokeColor}}/g, strokeStyle));
+                return image;
+            });
+        }
+        return this.markerImages;
+    }
+}
+Component.register('bpmn-subprocess', BPMNSubprocess);
+const MARKERS = {
+    loop: `
+<svg version="1.1" id="Layer_3" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+  viewBox="0 0 35 35" style="enable-background:new 0 0 35 35;" xml:space="preserve">
+  <style type="text/css">
+  .st0{fill:{{strokeColor}};}
+  </style>
+  <path class="st0" d="M9.5,5.2C4.3,9.7,3.7,17.5,8.1,22.8L5,25.4l7.8,0.6l0.6-7.8L10.2,21c-3.5-4.1-3-10.1,1-13.6s10.1-3,13.6,1
+	s3,10.1-1,13.6c-1.6,1.4-3.5,2.1-5.4,2.3l-0.2,2.8c2.6-0.2,5.3-1.1,7.4-3c5.2-4.5,5.8-12.3,1.3-17.5S14.7,0.8,9.5,5.2z"/>
+</svg>
+`,
+    multiInstance: `
+  <svg version="1.1" id="Layer_3" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 35 35" style="enable-background:new 0 0 35 35;" xml:space="preserve">
+   <style type="text/css">
+    .st0{fill:{{strokeColor}};}
+  </style>
+    <g>
+      <rect x="5.5" y="1.9" class="st0" width="3.3" height="25.3"/>
+      <rect x="15.9" y="1.9" class="st0" width="3.3" height="25.3"/>
+      <rect x="26.2" y="1.9" class="st0" width="3.3" height="25.3"/>
+    </g>
+  </svg>
+  `,
+    compensation: `
+  <svg version="1.1" id="Layer_3" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 35 35" style="enable-background:new 0 0 35 35;" xml:space="preserve">
+   <style type="text/css">
+    .st0{fill:{{strokeColor}};}
+   </style>
+   <g>
+      <path class="st0" d="M16.1,6.9v15.6l-7.8-7.8L16.1,6.9 M18.1,2.1L5.5,14.7l12.6,12.6V2.1L18.1,2.1z M5.5,14.7L5.5,14.7L5.5,14.7
+        L5.5,14.7L5.5,14.7z"/>
+    </g>
+    <g>
+      <path class="st0" d="M27.5,6.9v15.6l-7.8-7.8L27.5,6.9 M29.5,2.1L16.9,14.7l12.6,12.6V2.1L29.5,2.1z M16.9,14.7L16.9,14.7
+        L16.9,14.7L16.9,14.7L16.9,14.7z"/>
+    </g>
+  </svg>
+  `,
+    subprocess: `
+  <svg version="1.1" id="Layer_3" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 35 35" style="enable-background:new 0 0 35 35;" xml:space="preserve">
+    <style type="text/css">
+      .st0{fill:none;stroke:{{strokeColor}};stroke-width:2;stroke-miterlimit:10;}
+      .st1{fill:{{strokeColor}};}  
+    </style>
+    <rect x="5.5" y="2.5" class="st0" width="24" height="24"/>
+    <g>
+      <g>
+        <rect x="16.4" y="6" class="st1" width="2.1" height="17"/>
+      </g>
+      <g>
+        <rect x="9" y="13.4" class="st1" width="17" height="2.1"/>
+      </g>
+    </g>
+  </svg>
+  `,
+    adhoc: `
+  <svg version="1.1" id="Layer_3" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 35 35" style="enable-background:new 0 0 35 35;" xml:space="preserve">
+   <style type="text/css">
+    .st0{fill:{{strokeColor}};}
+   </style>
+   <path class="st0" d="M29.2,10.3c-0.8,0.9-1.7,1.7-2.5,2.2c-0.8,0.5-1.6,0.8-2.4,0.8c-1,0-3-0.6-6.1-1.9C15,10.2,12.6,9.6,11,9.6
+		c-2.1,0-3.9,0.7-5.5,1.9v6.9c0.1,0,0.3-0.2,0.6-0.6C7.9,16,9.5,15,10.9,15c0.8,0,2.9,0.6,6.1,1.9c3.3,1.2,5.7,1.8,7.1,1.8
+		c2,0,3.8-0.6,5.3-1.8v-6.9C29.4,10.1,29.3,10.2,29.2,10.3z"/>
+  </svg>
+  `
+};
+//# sourceMappingURL=bpmn-subprocess.js.map