RubyGems - drawio_dsl - Versions diffs - 0.7.0 → 0.8.0 - Mend

drawio_dsl 0.7.0 → 0.8.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (23) hide show

checksums.yaml +4 -4
data/.builders/.data/shapes.json +13 -4
data/.builders/blueprint/shapes.rb +3 -2
data/.builders/generators/project_plans/drawio_dsl.rb +30 -26
data/.builders/generators/sample_diagrams/30-html-shapes.rb +27 -47
data/CHANGELOG.md +8 -0
data/docs/project_done.svg +1 -1
data/docs/project_in_progress.svg +1 -1
data/docs/project_todo.svg +1 -1
data/docs/samples/html-shapes.svg +3 -0
data/docs/samples/samples.md +4 -0
data/docs/samples/themes-random.svg +1 -1
data/lib/drawio_dsl/configuration_shapes.rb +4 -2
data/lib/drawio_dsl/dom_builder_shapes.rb +5 -0
data/lib/drawio_dsl/drawio_shapes.rb +11 -5
data/lib/drawio_dsl/formatters/factory.rb +3 -2
data/lib/drawio_dsl/schema/_.rb +1 -0
data/lib/drawio_dsl/schema/shapes/shape.rb +11 -6
data/lib/drawio_dsl/schema/shapes/todo.rb +9 -0
data/lib/drawio_dsl/version.rb +1 -1
data/package-lock.json +2 -2
data/package.json +1 -1
metadata +4 -2

checksums.yaml CHANGED Viewed

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 0ca0ef8325e3ca9e3eeb032142a12c57bc12b5bf0f0e564fe162d2da70a06136
-  data.tar.gz: 17d39e80687f5fa5778a9e48011b4073fea363082b3ce490dff3f90d06747c94
+  metadata.gz: 1032026c1c77b8743c93aab81ebb8f78ec972cb7f0997823d9b64837e6ab4c34
+  data.tar.gz: 26b21a1aa90b3740c6b080bc650af25ee4f386ce673ca71efe04723d1288cbc4
 SHA512:
-  metadata.gz: c938d044a019af58cd694619dc5de2e78760f13a3626e06deb9470e0cb3066c2d4841066fb69bed1e921c2955a5849ae350e916e07c3eae31440779907057403
-  data.tar.gz: c37d85e61f581533d6803541fbbe3e6ed1aedc58cdafd48ef20834ac4c9361f81e96890f8514bc68c21b8bd0e58a415a5960e901774968f802f16bbe50b5965f
+  metadata.gz: 980bd6c45544bd734fb15b863d59e1e2ffb3e45c9ad3ccb5a9b93896cd2658a9009bd7572d1312698930da2193d17215f73ff823ce8dd2c138cda5655bda80ff
+  data.tar.gz: 2f4b640efce45016ac846e37078d17ffda64685c966dbd486c12f7164fdb6b5791c0bbb7c6b0ddc9d17c38f196a5eb8a35abb03b4c0dea64e70d5392c78aa06f

data/.builders/.data/shapes.json CHANGED Viewed

@@ -229,8 +229,8 @@
     "text_only": false,
     "x": 0,
     "y": 0,
-    "w": 200,
-    "h": 120,
+    "w": 160,
+    "h": 160,
     "style_modifiers": "align=left;overflow=fill;fontSize=12;fontFamily=Helvetica"
   },
   {
@@ -238,8 +238,8 @@
     "text_only": false,
     "x": 0,
     "y": 0,
-    "w": 200,
-    "h": 120,
+    "w": 160,
+    "h": 160,
     "style_modifiers": "align=left;overflow=fill;fontSize=12;fontFamily=Helvetica"
   },
   {
@@ -305,6 +305,15 @@
     "h": 50,
     "style_modifiers": "verticalLabelPosition=bottom;verticalAlign=top;shape=mxgraph.basic.tick"
   },
+  {
+    "type": "todo",
+    "text_only": false,
+    "x": 0,
+    "y": 0,
+    "w": 300,
+    "h": 60,
+    "style_modifiers": ""
+  },
   {
     "type": "face",
     "text_only": false,

data/.builders/blueprint/shapes.rb CHANGED Viewed

@@ -34,8 +34,8 @@ m = KManager.model :shapes, namespace: %i[domain] do
     row :document             , false, 0, 0, 160, 160, 'shape=mxgraph.basic.document'
     row :ellipse              , false, 0, 0, 200, 120, 'ellipse'
     row :hexagon              , false, 0, 0, 200, 120, 'shape=hexagon'
-    row :interface            , false, 0, 0, 200, 120, 'align=left;overflow=fill;fontSize=12;fontFamily=Helvetica'
-    row :klass                , false, 0, 0, 200, 120, 'align=left;overflow=fill;fontSize=12;fontFamily=Helvetica'
+    row :interface            , false, 0, 0, 160, 160, 'align=left;overflow=fill;fontSize=12;fontFamily=Helvetica'
+    row :klass                , false, 0, 0, 160, 160, 'align=left;overflow=fill;fontSize=12;fontFamily=Helvetica'
     row :note                 , false, 0, 0, 160, 160, 'shape=note'
     row :process              , false, 0, 0, 200, 120, 'shape=process'
     row :rectangle            , false, 0, 0, 200, 120, ''
@@ -43,6 +43,7 @@ m = KManager.model :shapes, namespace: %i[domain] do
     row :square               , false, 0, 0, 160, 160, ''
     row :step                 , false, 0, 0, 120,  80, 'shape=step;perimeter=stepPerimeter;fixedSize=1'
     row :tick                 , false, 0, 0,  50,  50, 'verticalLabelPosition=bottom;verticalAlign=top;shape=mxgraph.basic.tick'
+    row :todo                 , false, 0, 0, 300,  60, ''
     row :face                 , false, 0, 0, 100, 100, 'verticalLabelPosition=bottom;verticalAlign=top;shape=mxgraph.basic.smiley'
     row :triangle             , false, 0, 0, 100, 100, 'triangle'

data/.builders/generators/project_plans/drawio_dsl.rb CHANGED Viewed

@@ -11,9 +11,9 @@ KManager.action :todo_drawio_dsl do
         grid_layout(y:90, direction: :horizontal, grid_h: 80, grid_w: 320, wrap_at: 3, grid: 0)
-        square(w: 300, h: 60, title: 'formatter DSL that can render HTML directly into the title property')
-        square(w: 300, h: 60, title: 'formatter DSL for class and interface generation')
-        square(w: 300, h: 60, title: 'Add page background to theme, use it whenever the theme is set at a diagram/page level')
+        todo(title: 'move DrawioDsl::Formatters::Factory::FORMATTERS to resource file')
+        todo(title: 'move DrawioDsl::Formatters::StyleBuilder::MAPPINGS to resource file')
       end
       .page('To Do', theme: :style_02, margin_left: 0, margin_top: 0) do
@@ -22,19 +22,18 @@ KManager.action :todo_drawio_dsl do
         grid_layout(y:90, direction: :horizontal, grid_h: 80, grid_w: 320, wrap_at: 3, grid: 0)
-        square(w: 300, h: 60, title: 'write SVG directly into other projects')
-        square(w: 300, h: 60, title: 'add :shape and :text-only to random shape generator')
-        square(w: 300, h: 60, title: 'Nodes need to support child nodes')
-        square(w: 300, h: 60, title: 'Grid layout does not position itself in relation to the last element')
-        square(w: 300, h: 60, title: 'Dynamic sized shapes that expand to the size of their text')
-        square(w: 300, h: 60, title: 'Control of text padding left, right, top and bottom')
-        square(w: 300, h: 60, title: 'Improve the theme control over text-only shapes')
-        square(w: 300, h: 60, title: 'x,y settings do not work for shapes within a grid layout')
-        square(w: 300, h: 60, title: 'background color does not work from the diagram object')
-        square(w: 300, h: 60, title: 'settings style attributes need to de-duplicate')
-        square(w: 300, h: 60, title: 'need to setup new project plans')
-        square(w: 300, h: 60, title: 'write SVG directly into other projects')
-        square(w: 300, h: 60, title: 'page layout so that you drop elements on and they are positioned correctly, e.g centered, left, right, etc, maybe a grid layout with a wrap of 1 and a width of the page is sufficient')
+        todo(title: 'Add page background to theme, use it whenever the theme is set at a diagram/page level')
+        todo(title: 'need to setup new project plans')
+        todo(title: 'settings style attributes need to de-duplicate, might be best to utilize the new StyleBuilder class')
+        todo(title: 'write SVG directly into other projects')
+        todo(title: 'add :shape and :text-only to random shape generator')
+        todo(title: 'Nodes need to support child nodes')
+        todo(title: 'Grid layout does not position itself in relation to the last element')
+        todo(title: 'Dynamic sized shapes that expand to the size of their text')
+        todo(title: 'Control of text padding left, right, top and bottom')
+        todo(title: 'Improve the theme control over text-only shapes')
+        todo(title: 'x,y settings do not work for shapes within a grid layout')
+        todo(title: 'page layout so that you drop elements on and they are positioned correctly, e.g centered, left, right, etc, maybe a grid layout with a wrap of 1 and a width of the page is sufficient')
       end
       .page('Done', theme: :style_06, margin_left: 0, margin_top: 0) do
@@ -43,16 +42,21 @@ KManager.action :todo_drawio_dsl do
         grid_layout(y:90, direction: :horizontal, grid_h: 80, grid_w: 320, wrap_at: 3, grid: 0)
-        square(w: 300, h: 60, title: 'generate extension based graphics based on drawio extensions.js')
-        square(w: 300, h: 60, title: 'active? flag on page defaulting to true. set to false to exclude page from diagram.')
-        square(w: 300, h: 60, title: 'first level child nodes need to hang of node 1')
-        square(w: 300, h: 60, title: 'node has child nodes and add_node will set a nodes parent')
-        square(w: 300, h: 60, title: 'nodes can belong to a parent node, the top level node responds with truthy to root?')
-        square(w: 300, h: 60, title: 'add sample diagram for the github readme file')
-        square(w: 300, h: 60, title: 'write samples into docs folder and display in readme')
-        square(w: 300, h: 60, title: 'add export as .PNG, needs to take a page number as the PNG will not support multiple pages')
-        square(w: 300, h: 60, title: 'add export as .SVG, needs to take a page number as the SVG will not support multiple pages')
-        square(w: 300, h: 60, title: 'add save as .drawio')
+        todo(title: 'alter configure_shape so it sets the default shape key and use that for selecting the default HTML formatter')
+        todo(title: 'Add todo shape to simplify project plan drawing')
+        todo(title: 'introduce .value property to shape and let it use either formatted HTML or plain text title')
+        todo(title: 'formatter DSL that can render HTML directly into the value property')
+        todo(title: 'formatter DSL for class and interface generation')
+        todo(title: 'generate extension based graphics based on drawio extensions.js')
+        todo(title: 'active? flag on page defaulting to true. set to false to exclude page from diagram.')
+        todo(title: 'first level child nodes need to hang of node 1')
+        todo(title: 'node has child nodes and add_node will set a nodes parent')
+        todo(title: 'nodes can belong to a parent node, the top level node responds with truthy to root?')
+        todo(title: 'add sample diagram for the github readme file')
+        todo(title: 'write samples into docs folder and display in readme')
+        todo(title: 'add export as .PNG, needs to take a page number as the PNG will not support multiple pages')
+        todo(title: 'add export as .SVG, needs to take a page number as the SVG will not support multiple pages')
+        todo(title: 'add save as .drawio')
       end
       .cd(:spec)

data/.builders/generators/sample_diagrams/30-html-shapes.rb CHANGED Viewed

@@ -8,61 +8,41 @@ KManager.action :html_shapes do
       .page('Style-Plain', margin_left: 0, margin_top: 0, rounded: 0, background: '#FFEADB') do
         grid_layout(wrap_at: 8)
-        html = DrawioDsl::Formatters::InterfaceFormatter.new
-          .header('IPerson')
-          .field(:first_name, type: :string)
-          .field(:last_name, type: :string)
-          .field(:age, type: :integer)
-          .field(:birthday, type: :date)
-          .method(:full_name)
-          .as_html
-        square(
-          title: html,
-          style_modifiers: 'align=left;overflow=fill;fontSize=12;fontFamily=Helvetica'
-        )
-        square(title: 'xxx', style_modifiers: 'align=left;overflow=fill;fontSize=12;fontFamily=Helvetica') do
-          format(:interface)
+        # html = DrawioDsl::Formatters::InterfaceFormatter.new
+        #   .header('IPerson')
+        #   .field(:first_name, type: :string)
+        #   .field(:last_name, type: :string)
+        #   .field(:age, type: :integer)
+        #   .field(:birthday, type: :date)
+        #   .method(:full_name)
+        #   .as_html
+        # square(
+        #   title: html,
+        #   style_modifiers: 'align=left;overflow=fill;fontSize=12;fontFamily=Helvetica'
+        # )
+        interface(theme: :style_07) do
+          format
             .header('IPerson')
             .field(:field1, type: :string)
             .field(:field2, type: :string)
             .method(:full_name, type: :string)
         end
-        html = DrawioDsl::Formatters::KlassFormatter.new
-          .header('Person')
-          .field(:first_name, type: :string)
-          .field(:last_name, type: :string)
-          .field(:age, type: :integer)
-          .method(:full_name)
-          .as_html
-        square(
-          title: html,
-          style_modifiers: 'align=left;overflow=fill;fontSize=12;fontFamily=Helvetica'
-        )
-        # square do
-        #   formatter(:class)
-        #     .name('Person')
-        #     .field(:field1, type: :string)
-        #     .field(:field2, type: :string)
-        #     .method(:full_name, type: :string)
-        # end
-        # dg_interface('IContract') do
-        #   field('first_name', type: 'String')
-        #   field('last_name', type: 'String')
-        #   field('age', type: 'int')
-        #   method('full_name', type: 'String', params: 'String first_name, String last_name')
-        # end
+        klass do
+          format(:class)
+            .header('Person')
+            .field(:field1, type: :string)
+            .field(:field2, type: :string)
+            .field(:age, type: :integer)
+            .field(:birthday, type: :date)
+            .method(:full_name, type: :string)
+        end
       end
       .cd(:spec)
       .save('.samples/30-html-shapes.drawio')
-      # .cd(:docs)
-      # .export_svg('samples/themes-square', page: 1)
+      .cd(:docs)
+      .export_svg('samples/html-shapes', page: 1)
   end
 end

data/CHANGELOG.md CHANGED Viewed

@@ -1,3 +1,11 @@
+# [0.7.0](https://github.com/klueless-io/drawio_dsl/compare/v0.6.0...v0.7.0) (2022-03-14)
+### Features
+* add support for HTML formatters to shapes ([14b05e2](https://github.com/klueless-io/drawio_dsl/commit/14b05e2c55ea61ad8f275d678ca4fcff8a43b466))
+* add support for html shapes ([d2d0e72](https://github.com/klueless-io/drawio_dsl/commit/d2d0e72bef8f44c244dd209d191ab29aea0091c1))
 # [0.6.0](https://github.com/klueless-io/drawio_dsl/compare/v0.5.7...v0.6.0) (2022-03-13)

data/docs/project_done.svg CHANGED Viewed

@@ -1,3 +1,3 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="942px" height="302px" viewBox="-0.5 -0.5 942 302"><defs><linearGradient x1="0%" y1="0%" x2="0%" y2="100%" id="mx-gradient-ffffff-0.9-ffffff-0.1-s-0"><stop offset="0%" style="stop-color: rgb(255, 255, 255); stop-opacity: 0.9;"/><stop offset="100%" style="stop-color: rgb(255, 255, 255); stop-opacity: 0.1;"/></linearGradient></defs><g><rect x="0" y="0" width="300" height="60" rx="9" ry="9" fill="#f8cecc" stroke="#b85450" pointer-events="all"/><path d="M 10.15 -1 Q -1 -1 -1 10.15 L -1 24 Q 150 42 301 24 L 301 10.15 Q 301 -1 289.85 -1 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 30px; margin-left: 1px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">generate extension based graphics based on drawio extensions.js</div></div></div></foreignObject><text x="150" y="34" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">generate extension based graphics based on drawio...</text></switch></g><rect x="320" y="0" width="300" height="60" rx="9" ry="9" fill="#f8cecc" stroke="#b85450" pointer-events="all"/><path d="M 330.15 -1 Q 319 -1 319 10.15 L 319 24 Q 470 42 621 24 L 621 10.15 Q 621 -1 609.85 -1 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 30px; margin-left: 321px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">active? flag on page defaulting to true. set to false to exclude page from diagram.</div></div></div></foreignObject><text x="470" y="34" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">active? flag on page defaulting to true. set to fa...</text></switch></g><rect x="640" y="0" width="300" height="60" rx="9" ry="9" fill="#f8cecc" stroke="#b85450" pointer-events="all"/><path d="M 650.15 -1 Q 639 -1 639 10.15 L 639 24 Q 790 42 941 24 L 941 10.15 Q 941 -1 929.85 -1 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 30px; margin-left: 641px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">first level child nodes need to hang of node 1</div></div></div></foreignObject><text x="790" y="34" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">first level child nodes need to hang of node 1</text></switch></g><rect x="0" y="80" width="300" height="60" rx="9" ry="9" fill="#f8cecc" stroke="#b85450" pointer-events="all"/><path d="M 10.15 79 Q -1 79 -1 90.15 L -1 104 Q 150 122 301 104 L 301 90.15 Q 301 79 289.85 79 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 110px; margin-left: 1px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">node has child nodes and add_node will set a nodes parent</div></div></div></foreignObject><text x="150" y="114" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">node has child nodes and add_node will set a nodes...</text></switch></g><rect x="320" y="80" width="300" height="60" rx="9" ry="9" fill="#f8cecc" stroke="#b85450" pointer-events="all"/><path d="M 330.15 79 Q 319 79 319 90.15 L 319 104 Q 470 122 621 104 L 621 90.15 Q 621 79 609.85 79 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 110px; margin-left: 321px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">nodes can belong to a parent node, the top level node responds with truthy to root?</div></div></div></foreignObject><text x="470" y="114" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">nodes can belong to a parent node, the top level n...</text></switch></g><rect x="640" y="80" width="300" height="60" rx="9" ry="9" fill="#f8cecc" stroke="#b85450" pointer-events="all"/><path d="M 650.15 79 Q 639 79 639 90.15 L 639 104 Q 790 122 941 104 L 941 90.15 Q 941 79 929.85 79 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 110px; margin-left: 641px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">add sample diagram for the github readme file</div></div></div></foreignObject><text x="790" y="114" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">add sample diagram for the github readme file</text></switch></g><rect x="0" y="160" width="300" height="60" rx="9" ry="9" fill="#f8cecc" stroke="#b85450" pointer-events="all"/><path d="M 10.15 159 Q -1 159 -1 170.15 L -1 184 Q 150 202 301 184 L 301 170.15 Q 301 159 289.85 159 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 190px; margin-left: 1px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">write samples into docs folder and display in readme</div></div></div></foreignObject><text x="150" y="194" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">write samples into docs folder and display in read...</text></switch></g><rect x="320" y="160" width="300" height="60" rx="9" ry="9" fill="#f8cecc" stroke="#b85450" pointer-events="all"/><path d="M 330.15 159 Q 319 159 319 170.15 L 319 184 Q 470 202 621 184 L 621 170.15 Q 621 159 609.85 159 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 190px; margin-left: 321px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">add export as .PNG, needs to take a page number as the PNG will not support multiple pages</div></div></div></foreignObject><text x="470" y="194" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">add export as .PNG, needs to take a page number as...</text></switch></g><rect x="640" y="160" width="300" height="60" rx="9" ry="9" fill="#f8cecc" stroke="#b85450" pointer-events="all"/><path d="M 650.15 159 Q 639 159 639 170.15 L 639 184 Q 790 202 941 184 L 941 170.15 Q 941 159 929.85 159 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 190px; margin-left: 641px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">add export as .SVG, needs to take a page number as the SVG will not support multiple pages</div></div></div></foreignObject><text x="790" y="194" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">add export as .SVG, needs to take a page number as...</text></switch></g><rect x="0" y="240" width="300" height="60" rx="9" ry="9" fill="#f8cecc" stroke="#b85450" pointer-events="all"/><path d="M 10.15 239 Q -1 239 -1 250.15 L -1 264 Q 150 282 301 264 L 301 250.15 Q 301 239 289.85 239 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 270px; margin-left: 1px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">add save as .drawio</div></div></div></foreignObject><text x="150" y="274" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">add save as .drawio</text></switch></g></g><switch><g requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"/><a transform="translate(0,-5)" xlink:href="https://www.diagrams.net/doc/faq/svg-export-text-problems" target="_blank"><text text-anchor="middle" font-size="10px" x="50%" y="100%">Text is not SVG - cannot display</text></a></switch></svg>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="942px" height="382px" viewBox="-0.5 -0.5 942 382"><defs><linearGradient x1="0%" y1="0%" x2="0%" y2="100%" id="mx-gradient-ffffff-0.9-ffffff-0.1-s-0"><stop offset="0%" style="stop-color: rgb(255, 255, 255); stop-opacity: 0.9;"/><stop offset="100%" style="stop-color: rgb(255, 255, 255); stop-opacity: 0.1;"/></linearGradient></defs><g><rect x="0" y="0" width="300" height="60" rx="9" ry="9" fill="#f8cecc" stroke="#b85450" pointer-events="all"/><path d="M 10.15 -1 Q -1 -1 -1 10.15 L -1 24 Q 150 42 301 24 L 301 10.15 Q 301 -1 289.85 -1 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 30px; margin-left: 1px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">alter configure_shape so it sets the default shape key and use that for selecting the default HTML formatter</div></div></div></foreignObject><text x="150" y="34" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">alter configure_shape so it sets the default shape...</text></switch></g><rect x="320" y="0" width="300" height="60" rx="9" ry="9" fill="#f8cecc" stroke="#b85450" pointer-events="all"/><path d="M 330.15 -1 Q 319 -1 319 10.15 L 319 24 Q 470 42 621 24 L 621 10.15 Q 621 -1 609.85 -1 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 30px; margin-left: 321px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">Add todo shape to simplify project plan drawing</div></div></div></foreignObject><text x="470" y="34" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">Add todo shape to simplify project plan drawing</text></switch></g><rect x="640" y="0" width="300" height="60" rx="9" ry="9" fill="#f8cecc" stroke="#b85450" pointer-events="all"/><path d="M 650.15 -1 Q 639 -1 639 10.15 L 639 24 Q 790 42 941 24 L 941 10.15 Q 941 -1 929.85 -1 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 30px; margin-left: 641px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">introduce .value property to shape and let it use either formatted HTML or plain text title</div></div></div></foreignObject><text x="790" y="34" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">introduce .value property to shape and let it use...</text></switch></g><rect x="0" y="80" width="300" height="60" rx="9" ry="9" fill="#f8cecc" stroke="#b85450" pointer-events="all"/><path d="M 10.15 79 Q -1 79 -1 90.15 L -1 104 Q 150 122 301 104 L 301 90.15 Q 301 79 289.85 79 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 110px; margin-left: 1px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">formatter DSL that can render HTML directly into the value property</div></div></div></foreignObject><text x="150" y="114" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">formatter DSL that can render HTML directly into t...</text></switch></g><rect x="320" y="80" width="300" height="60" rx="9" ry="9" fill="#f8cecc" stroke="#b85450" pointer-events="all"/><path d="M 330.15 79 Q 319 79 319 90.15 L 319 104 Q 470 122 621 104 L 621 90.15 Q 621 79 609.85 79 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 110px; margin-left: 321px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">formatter DSL for class and interface generation</div></div></div></foreignObject><text x="470" y="114" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">formatter DSL for class and interface generation</text></switch></g><rect x="640" y="80" width="300" height="60" rx="9" ry="9" fill="#f8cecc" stroke="#b85450" pointer-events="all"/><path d="M 650.15 79 Q 639 79 639 90.15 L 639 104 Q 790 122 941 104 L 941 90.15 Q 941 79 929.85 79 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 110px; margin-left: 641px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">generate extension based graphics based on drawio extensions.js</div></div></div></foreignObject><text x="790" y="114" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">generate extension based graphics based on drawio...</text></switch></g><rect x="0" y="160" width="300" height="60" rx="9" ry="9" fill="#f8cecc" stroke="#b85450" pointer-events="all"/><path d="M 10.15 159 Q -1 159 -1 170.15 L -1 184 Q 150 202 301 184 L 301 170.15 Q 301 159 289.85 159 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 190px; margin-left: 1px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">active? flag on page defaulting to true. set to false to exclude page from diagram.</div></div></div></foreignObject><text x="150" y="194" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">active? flag on page defaulting to true. set to fa...</text></switch></g><rect x="320" y="160" width="300" height="60" rx="9" ry="9" fill="#f8cecc" stroke="#b85450" pointer-events="all"/><path d="M 330.15 159 Q 319 159 319 170.15 L 319 184 Q 470 202 621 184 L 621 170.15 Q 621 159 609.85 159 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 190px; margin-left: 321px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">first level child nodes need to hang of node 1</div></div></div></foreignObject><text x="470" y="194" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">first level child nodes need to hang of node 1</text></switch></g><rect x="640" y="160" width="300" height="60" rx="9" ry="9" fill="#f8cecc" stroke="#b85450" pointer-events="all"/><path d="M 650.15 159 Q 639 159 639 170.15 L 639 184 Q 790 202 941 184 L 941 170.15 Q 941 159 929.85 159 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 190px; margin-left: 641px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">node has child nodes and add_node will set a nodes parent</div></div></div></foreignObject><text x="790" y="194" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">node has child nodes and add_node will set a nodes...</text></switch></g><rect x="0" y="240" width="300" height="60" rx="9" ry="9" fill="#f8cecc" stroke="#b85450" pointer-events="all"/><path d="M 10.15 239 Q -1 239 -1 250.15 L -1 264 Q 150 282 301 264 L 301 250.15 Q 301 239 289.85 239 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 270px; margin-left: 1px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">nodes can belong to a parent node, the top level node responds with truthy to root?</div></div></div></foreignObject><text x="150" y="274" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">nodes can belong to a parent node, the top level n...</text></switch></g><rect x="320" y="240" width="300" height="60" rx="9" ry="9" fill="#f8cecc" stroke="#b85450" pointer-events="all"/><path d="M 330.15 239 Q 319 239 319 250.15 L 319 264 Q 470 282 621 264 L 621 250.15 Q 621 239 609.85 239 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 270px; margin-left: 321px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">add sample diagram for the github readme file</div></div></div></foreignObject><text x="470" y="274" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">add sample diagram for the github readme file</text></switch></g><rect x="640" y="240" width="300" height="60" rx="9" ry="9" fill="#f8cecc" stroke="#b85450" pointer-events="all"/><path d="M 650.15 239 Q 639 239 639 250.15 L 639 264 Q 790 282 941 264 L 941 250.15 Q 941 239 929.85 239 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 270px; margin-left: 641px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">write samples into docs folder and display in readme</div></div></div></foreignObject><text x="790" y="274" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">write samples into docs folder and display in read...</text></switch></g><rect x="0" y="320" width="300" height="60" rx="9" ry="9" fill="#f8cecc" stroke="#b85450" pointer-events="all"/><path d="M 10.15 319 Q -1 319 -1 330.15 L -1 344 Q 150 362 301 344 L 301 330.15 Q 301 319 289.85 319 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 350px; margin-left: 1px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">add export as .PNG, needs to take a page number as the PNG will not support multiple pages</div></div></div></foreignObject><text x="150" y="354" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">add export as .PNG, needs to take a page number as...</text></switch></g><rect x="320" y="320" width="300" height="60" rx="9" ry="9" fill="#f8cecc" stroke="#b85450" pointer-events="all"/><path d="M 330.15 319 Q 319 319 319 330.15 L 319 344 Q 470 362 621 344 L 621 330.15 Q 621 319 609.85 319 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 350px; margin-left: 321px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">add export as .SVG, needs to take a page number as the SVG will not support multiple pages</div></div></div></foreignObject><text x="470" y="354" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">add export as .SVG, needs to take a page number as...</text></switch></g><rect x="640" y="320" width="300" height="60" rx="9" ry="9" fill="#f8cecc" stroke="#b85450" pointer-events="all"/><path d="M 650.15 319 Q 639 319 639 330.15 L 639 344 Q 790 362 941 344 L 941 330.15 Q 941 319 929.85 319 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 350px; margin-left: 641px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">add save as .drawio</div></div></div></foreignObject><text x="790" y="354" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">add save as .drawio</text></switch></g></g><switch><g requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"/><a transform="translate(0,-5)" xlink:href="https://www.diagrams.net/doc/faq/svg-export-text-problems" target="_blank"><text text-anchor="middle" font-size="10px" x="50%" y="100%">Text is not SVG - cannot display</text></a></switch></svg>

data/docs/project_in_progress.svg CHANGED Viewed

@@ -1,3 +1,3 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="942px" height="62px" viewBox="-0.5 -0.5 942 62"><defs><linearGradient x1="0%" y1="0%" x2="0%" y2="100%" id="mx-gradient-ffffff-0.9-ffffff-0.1-s-0"><stop offset="0%" style="stop-color: rgb(255, 255, 255); stop-opacity: 0.9;"/><stop offset="100%" style="stop-color: rgb(255, 255, 255); stop-opacity: 0.1;"/></linearGradient></defs><g><rect x="0" y="0" width="300" height="60" rx="9" ry="9" fill="#d5e8d4" stroke="#82b366" pointer-events="all"/><path d="M 10.15 -1 Q -1 -1 -1 10.15 L -1 24 Q 150 42 301 24 L 301 10.15 Q 301 -1 289.85 -1 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 30px; margin-left: 1px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">formatter DSL that can render HTML directly into the title property</div></div></div></foreignObject><text x="150" y="34" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">formatter DSL that can render HTML directly into t...</text></switch></g><rect x="320" y="0" width="300" height="60" rx="9" ry="9" fill="#d5e8d4" stroke="#82b366" pointer-events="all"/><path d="M 330.15 -1 Q 319 -1 319 10.15 L 319 24 Q 470 42 621 24 L 621 10.15 Q 621 -1 609.85 -1 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 30px; margin-left: 321px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">formatter DSL for class and interface generation</div></div></div></foreignObject><text x="470" y="34" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">formatter DSL for class and interface generation</text></switch></g><rect x="640" y="0" width="300" height="60" rx="9" ry="9" fill="#d5e8d4" stroke="#82b366" pointer-events="all"/><path d="M 650.15 -1 Q 639 -1 639 10.15 L 639 24 Q 790 42 941 24 L 941 10.15 Q 941 -1 929.85 -1 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 30px; margin-left: 641px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">Add page background to theme, use it whenever the theme is set at a diagram/page level</div></div></div></foreignObject><text x="790" y="34" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">Add page background to theme, use it whenever the...</text></switch></g></g><switch><g requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"/><a transform="translate(0,-5)" xlink:href="https://www.diagrams.net/doc/faq/svg-export-text-problems" target="_blank"><text text-anchor="middle" font-size="10px" x="50%" y="100%">Text is not SVG - cannot display</text></a></switch></svg>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="622px" height="62px" viewBox="-0.5 -0.5 622 62"><defs><linearGradient x1="0%" y1="0%" x2="0%" y2="100%" id="mx-gradient-ffffff-0.9-ffffff-0.1-s-0"><stop offset="0%" style="stop-color: rgb(255, 255, 255); stop-opacity: 0.9;"/><stop offset="100%" style="stop-color: rgb(255, 255, 255); stop-opacity: 0.1;"/></linearGradient></defs><g><rect x="0" y="0" width="300" height="60" rx="9" ry="9" fill="#d5e8d4" stroke="#82b366" pointer-events="all"/><path d="M 10.15 -1 Q -1 -1 -1 10.15 L -1 24 Q 150 42 301 24 L 301 10.15 Q 301 -1 289.85 -1 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 30px; margin-left: 1px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">move DrawioDsl::Formatters::Factory::FORMATTERS to resource file</div></div></div></foreignObject><text x="150" y="34" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">move DrawioDsl::Formatters::Factory::FORMATTERS to...</text></switch></g><rect x="320" y="0" width="300" height="60" rx="9" ry="9" fill="#d5e8d4" stroke="#82b366" pointer-events="all"/><path d="M 330.15 -1 Q 319 -1 319 10.15 L 319 24 Q 470 42 621 24 L 621 10.15 Q 621 -1 609.85 -1 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 30px; margin-left: 321px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">move DrawioDsl::Formatters::StyleBuilder::MAPPINGS to resource file</div></div></div></foreignObject><text x="470" y="34" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">move DrawioDsl::Formatters::StyleBuilder::MAPPINGS...</text></switch></g></g><switch><g requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"/><a transform="translate(0,-5)" xlink:href="https://www.diagrams.net/doc/faq/svg-export-text-problems" target="_blank"><text text-anchor="middle" font-size="10px" x="50%" y="100%">Text is not SVG - cannot display</text></a></switch></svg>

data/docs/project_todo.svg CHANGED Viewed

@@ -1,3 +1,3 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="942px" height="382px" viewBox="-0.5 -0.5 942 382"><defs><linearGradient x1="0%" y1="0%" x2="0%" y2="100%" id="mx-gradient-ffffff-0.9-ffffff-0.1-s-0"><stop offset="0%" style="stop-color: rgb(255, 255, 255); stop-opacity: 0.9;"/><stop offset="100%" style="stop-color: rgb(255, 255, 255); stop-opacity: 0.1;"/></linearGradient></defs><g><rect x="0" y="0" width="300" height="60" rx="9" ry="9" fill="#dae8fc" stroke="#6c8ebf" pointer-events="all"/><path d="M 10.15 -1 Q -1 -1 -1 10.15 L -1 24 Q 150 42 301 24 L 301 10.15 Q 301 -1 289.85 -1 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 30px; margin-left: 1px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">write SVG directly into other projects</div></div></div></foreignObject><text x="150" y="34" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">write SVG directly into other projects</text></switch></g><rect x="320" y="0" width="300" height="60" rx="9" ry="9" fill="#dae8fc" stroke="#6c8ebf" pointer-events="all"/><path d="M 330.15 -1 Q 319 -1 319 10.15 L 319 24 Q 470 42 621 24 L 621 10.15 Q 621 -1 609.85 -1 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 30px; margin-left: 321px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">add :shape and :text-only to random shape generator</div></div></div></foreignObject><text x="470" y="34" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">add :shape and :text-only to random shape generator</text></switch></g><rect x="640" y="0" width="300" height="60" rx="9" ry="9" fill="#dae8fc" stroke="#6c8ebf" pointer-events="all"/><path d="M 650.15 -1 Q 639 -1 639 10.15 L 639 24 Q 790 42 941 24 L 941 10.15 Q 941 -1 929.85 -1 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 30px; margin-left: 641px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">Nodes need to support child nodes</div></div></div></foreignObject><text x="790" y="34" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">Nodes need to support child nodes</text></switch></g><rect x="0" y="80" width="300" height="60" rx="9" ry="9" fill="#dae8fc" stroke="#6c8ebf" pointer-events="all"/><path d="M 10.15 79 Q -1 79 -1 90.15 L -1 104 Q 150 122 301 104 L 301 90.15 Q 301 79 289.85 79 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 110px; margin-left: 1px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">Grid layout does not position itself in relation to the last element</div></div></div></foreignObject><text x="150" y="114" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">Grid layout does not position itself in relation t...</text></switch></g><rect x="320" y="80" width="300" height="60" rx="9" ry="9" fill="#dae8fc" stroke="#6c8ebf" pointer-events="all"/><path d="M 330.15 79 Q 319 79 319 90.15 L 319 104 Q 470 122 621 104 L 621 90.15 Q 621 79 609.85 79 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 110px; margin-left: 321px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">Dynamic sized shapes that expand to the size of their text</div></div></div></foreignObject><text x="470" y="114" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">Dynamic sized shapes that expand to the size of th...</text></switch></g><rect x="640" y="80" width="300" height="60" rx="9" ry="9" fill="#dae8fc" stroke="#6c8ebf" pointer-events="all"/><path d="M 650.15 79 Q 639 79 639 90.15 L 639 104 Q 790 122 941 104 L 941 90.15 Q 941 79 929.85 79 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 110px; margin-left: 641px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">Control of text padding left, right, top and bottom</div></div></div></foreignObject><text x="790" y="114" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">Control of text padding left, right, top and bottom</text></switch></g><rect x="0" y="160" width="300" height="60" rx="9" ry="9" fill="#dae8fc" stroke="#6c8ebf" pointer-events="all"/><path d="M 10.15 159 Q -1 159 -1 170.15 L -1 184 Q 150 202 301 184 L 301 170.15 Q 301 159 289.85 159 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 190px; margin-left: 1px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">Improve the theme control over text-only shapes</div></div></div></foreignObject><text x="150" y="194" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">Improve the theme control over text-only shapes</text></switch></g><rect x="320" y="160" width="300" height="60" rx="9" ry="9" fill="#dae8fc" stroke="#6c8ebf" pointer-events="all"/><path d="M 330.15 159 Q 319 159 319 170.15 L 319 184 Q 470 202 621 184 L 621 170.15 Q 621 159 609.85 159 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 190px; margin-left: 321px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">x,y settings do not work for shapes within a grid layout</div></div></div></foreignObject><text x="470" y="194" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">x,y settings do not work for shapes within a grid...</text></switch></g><rect x="640" y="160" width="300" height="60" rx="9" ry="9" fill="#dae8fc" stroke="#6c8ebf" pointer-events="all"/><path d="M 650.15 159 Q 639 159 639 170.15 L 639 184 Q 790 202 941 184 L 941 170.15 Q 941 159 929.85 159 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 190px; margin-left: 641px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">background color does not work from the diagram object</div></div></div></foreignObject><text x="790" y="194" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">background color does not work from the diagram ob...</text></switch></g><rect x="0" y="240" width="300" height="60" rx="9" ry="9" fill="#dae8fc" stroke="#6c8ebf" pointer-events="all"/><path d="M 10.15 239 Q -1 239 -1 250.15 L -1 264 Q 150 282 301 264 L 301 250.15 Q 301 239 289.85 239 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 270px; margin-left: 1px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">settings style attributes need to de-duplicate</div></div></div></foreignObject><text x="150" y="274" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">settings style attributes need to de-duplicate</text></switch></g><rect x="320" y="240" width="300" height="60" rx="9" ry="9" fill="#dae8fc" stroke="#6c8ebf" pointer-events="all"/><path d="M 330.15 239 Q 319 239 319 250.15 L 319 264 Q 470 282 621 264 L 621 250.15 Q 621 239 609.85 239 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 270px; margin-left: 321px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">need to setup new project plans</div></div></div></foreignObject><text x="470" y="274" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">need to setup new project plans</text></switch></g><rect x="640" y="240" width="300" height="60" rx="9" ry="9" fill="#dae8fc" stroke="#6c8ebf" pointer-events="all"/><path d="M 650.15 239 Q 639 239 639 250.15 L 639 264 Q 790 282 941 264 L 941 250.15 Q 941 239 929.85 239 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 270px; margin-left: 641px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">write SVG directly into other projects</div></div></div></foreignObject><text x="790" y="274" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">write SVG directly into other projects</text></switch></g><rect x="0" y="320" width="300" height="60" rx="9" ry="9" fill="#dae8fc" stroke="#6c8ebf" pointer-events="all"/><path d="M 10.15 319 Q -1 319 -1 330.15 L -1 344 Q 150 362 301 344 L 301 330.15 Q 301 319 289.85 319 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 350px; margin-left: 1px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">page layout so that you drop elements on and they are positioned correctly, e.g centered, left, right, etc, maybe a grid layout with a wrap of 1 and a width of the page is sufficient</div></div></div></foreignObject><text x="150" y="354" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">page layout so that you drop elements on and they...</text></switch></g></g><switch><g requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"/><a transform="translate(0,-5)" xlink:href="https://www.diagrams.net/doc/faq/svg-export-text-problems" target="_blank"><text text-anchor="middle" font-size="10px" x="50%" y="100%">Text is not SVG - cannot display</text></a></switch></svg>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="942px" height="302px" viewBox="-0.5 -0.5 942 302"><defs><linearGradient x1="0%" y1="0%" x2="0%" y2="100%" id="mx-gradient-ffffff-0.9-ffffff-0.1-s-0"><stop offset="0%" style="stop-color: rgb(255, 255, 255); stop-opacity: 0.9;"/><stop offset="100%" style="stop-color: rgb(255, 255, 255); stop-opacity: 0.1;"/></linearGradient></defs><g><rect x="0" y="0" width="300" height="60" rx="9" ry="9" fill="#dae8fc" stroke="#6c8ebf" pointer-events="all"/><path d="M 10.15 -1 Q -1 -1 -1 10.15 L -1 24 Q 150 42 301 24 L 301 10.15 Q 301 -1 289.85 -1 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 30px; margin-left: 1px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">Add page background to theme, use it whenever the theme is set at a diagram/page level</div></div></div></foreignObject><text x="150" y="34" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">Add page background to theme, use it whenever the...</text></switch></g><rect x="320" y="0" width="300" height="60" rx="9" ry="9" fill="#dae8fc" stroke="#6c8ebf" pointer-events="all"/><path d="M 330.15 -1 Q 319 -1 319 10.15 L 319 24 Q 470 42 621 24 L 621 10.15 Q 621 -1 609.85 -1 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 30px; margin-left: 321px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">need to setup new project plans</div></div></div></foreignObject><text x="470" y="34" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">need to setup new project plans</text></switch></g><rect x="640" y="0" width="300" height="60" rx="9" ry="9" fill="#dae8fc" stroke="#6c8ebf" pointer-events="all"/><path d="M 650.15 -1 Q 639 -1 639 10.15 L 639 24 Q 790 42 941 24 L 941 10.15 Q 941 -1 929.85 -1 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 30px; margin-left: 641px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">settings style attributes need to de-duplicate, might be best to utilize the new StyleBuilder class</div></div></div></foreignObject><text x="790" y="34" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">settings style attributes need to de-duplicate, mi...</text></switch></g><rect x="0" y="80" width="300" height="60" rx="9" ry="9" fill="#dae8fc" stroke="#6c8ebf" pointer-events="all"/><path d="M 10.15 79 Q -1 79 -1 90.15 L -1 104 Q 150 122 301 104 L 301 90.15 Q 301 79 289.85 79 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 110px; margin-left: 1px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">write SVG directly into other projects</div></div></div></foreignObject><text x="150" y="114" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">write SVG directly into other projects</text></switch></g><rect x="320" y="80" width="300" height="60" rx="9" ry="9" fill="#dae8fc" stroke="#6c8ebf" pointer-events="all"/><path d="M 330.15 79 Q 319 79 319 90.15 L 319 104 Q 470 122 621 104 L 621 90.15 Q 621 79 609.85 79 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 110px; margin-left: 321px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">add :shape and :text-only to random shape generator</div></div></div></foreignObject><text x="470" y="114" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">add :shape and :text-only to random shape generator</text></switch></g><rect x="640" y="80" width="300" height="60" rx="9" ry="9" fill="#dae8fc" stroke="#6c8ebf" pointer-events="all"/><path d="M 650.15 79 Q 639 79 639 90.15 L 639 104 Q 790 122 941 104 L 941 90.15 Q 941 79 929.85 79 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 110px; margin-left: 641px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">Nodes need to support child nodes</div></div></div></foreignObject><text x="790" y="114" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">Nodes need to support child nodes</text></switch></g><rect x="0" y="160" width="300" height="60" rx="9" ry="9" fill="#dae8fc" stroke="#6c8ebf" pointer-events="all"/><path d="M 10.15 159 Q -1 159 -1 170.15 L -1 184 Q 150 202 301 184 L 301 170.15 Q 301 159 289.85 159 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 190px; margin-left: 1px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">Grid layout does not position itself in relation to the last element</div></div></div></foreignObject><text x="150" y="194" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">Grid layout does not position itself in relation t...</text></switch></g><rect x="320" y="160" width="300" height="60" rx="9" ry="9" fill="#dae8fc" stroke="#6c8ebf" pointer-events="all"/><path d="M 330.15 159 Q 319 159 319 170.15 L 319 184 Q 470 202 621 184 L 621 170.15 Q 621 159 609.85 159 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 190px; margin-left: 321px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">Dynamic sized shapes that expand to the size of their text</div></div></div></foreignObject><text x="470" y="194" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">Dynamic sized shapes that expand to the size of th...</text></switch></g><rect x="640" y="160" width="300" height="60" rx="9" ry="9" fill="#dae8fc" stroke="#6c8ebf" pointer-events="all"/><path d="M 650.15 159 Q 639 159 639 170.15 L 639 184 Q 790 202 941 184 L 941 170.15 Q 941 159 929.85 159 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 190px; margin-left: 641px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">Control of text padding left, right, top and bottom</div></div></div></foreignObject><text x="790" y="194" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">Control of text padding left, right, top and bottom</text></switch></g><rect x="0" y="240" width="300" height="60" rx="9" ry="9" fill="#dae8fc" stroke="#6c8ebf" pointer-events="all"/><path d="M 10.15 239 Q -1 239 -1 250.15 L -1 264 Q 150 282 301 264 L 301 250.15 Q 301 239 289.85 239 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 270px; margin-left: 1px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">Improve the theme control over text-only shapes</div></div></div></foreignObject><text x="150" y="274" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">Improve the theme control over text-only shapes</text></switch></g><rect x="320" y="240" width="300" height="60" rx="9" ry="9" fill="#dae8fc" stroke="#6c8ebf" pointer-events="all"/><path d="M 330.15 239 Q 319 239 319 250.15 L 319 264 Q 470 282 621 264 L 621 250.15 Q 621 239 609.85 239 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 270px; margin-left: 321px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">x,y settings do not work for shapes within a grid layout</div></div></div></foreignObject><text x="470" y="274" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">x,y settings do not work for shapes within a grid...</text></switch></g><rect x="640" y="240" width="300" height="60" rx="9" ry="9" fill="#dae8fc" stroke="#6c8ebf" pointer-events="all"/><path d="M 650.15 239 Q 639 239 639 250.15 L 639 264 Q 790 282 941 264 L 941 250.15 Q 941 239 929.85 239 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 270px; margin-left: 641px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">page layout so that you drop elements on and they are positioned correctly, e.g centered, left, right, etc, maybe a grid layout with a wrap of 1 and a width of the page is sufficient</div></div></div></foreignObject><text x="790" y="274" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">page layout so that you drop elements on and they...</text></switch></g></g><switch><g requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"/><a transform="translate(0,-5)" xlink:href="https://www.diagrams.net/doc/faq/svg-export-text-problems" target="_blank"><text text-anchor="middle" font-size="10px" x="50%" y="100%">Text is not SVG - cannot display</text></a></switch></svg>

data/docs/samples/html-shapes.svg ADDED Viewed

@@ -0,0 +1,3 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="382px" height="162px" viewBox="-0.5 -0.5 382 162"><defs/><g><rect x="0" y="0" width="160" height="160" fill="#e1d5e7" stroke="#9673a6" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe flex-start; width: 162px; height: 160px; padding-top: 0px; margin-left: 0px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: left; width: 160px; height: 160px; overflow: hidden;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; width: 100%; height: 100%; white-space: normal; overflow-wrap: normal;"><p style="margin: 0px ; margin-left: 4px ; margin-top: 4px ; text-align: center"><i>Interface</i></p><p style="margin: 0px ; margin-left: 4px ; margin-top: 4px ; text-align: center"><b>IPerson</b></p><hr size="1" /><p style="margin: 0px ; margin-left: 4px ; margin-top: 4px">field1: string</p><p style="margin: 0px ; margin-left: 4px ; margin-top: 4px">field2: string</p><hr size="1" /><p style="margin: 0px ; margin-left: 4px ; margin-top: 4px">full_name() : string</p></div></div></div></foreignObject><text x="0" y="84" fill="#333333" font-family="Helvetica" font-size="12px">Interface...</text></switch></g><rect x="220" y="0" width="160" height="160" fill="#0050ef" stroke="#001dbc" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe flex-start; width: 162px; height: 160px; padding-top: 0px; margin-left: 220px;"><div data-drawio-colors="color: #ffffff; " style="box-sizing: border-box; font-size: 0px; text-align: left; width: 160px; height: 160px; overflow: hidden;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(255, 255, 255); line-height: 1.2; pointer-events: all; width: 100%; height: 100%; white-space: normal; overflow-wrap: normal;"><p style="margin: 0px ; margin-left: 4px ; margin-top: 4px ; text-align: center"><b>Person</b></p><hr size="1" /><p style="margin: 0px ; margin-left: 4px ; margin-top: 4px">field1: string</p><p style="margin: 0px ; margin-left: 4px ; margin-top: 4px">field2: string</p><p style="margin: 0px ; margin-left: 4px ; margin-top: 4px">age: integer</p><p style="margin: 0px ; margin-left: 4px ; margin-top: 4px">birthday: date</p><hr size="1" /><p style="margin: 0px ; margin-left: 4px ; margin-top: 4px">full_name() : string</p></div></div></div></foreignObject><text x="220" y="84" fill="#ffffff" font-family="Helvetica" font-size="12px">Person...</text></switch></g></g><switch><g requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"/><a transform="translate(0,-5)" xlink:href="https://www.diagrams.net/doc/faq/svg-export-text-problems" target="_blank"><text text-anchor="middle" font-size="10px" x="50%" y="100%">Text is not SVG - cannot display</text></a></switch></svg>

data/docs/samples/samples.md CHANGED Viewed

@@ -10,6 +10,10 @@
 ## Styles
+## HTML
+![](html-shapes.svg)
 ## Plain
 ![](styles-plain.svg)

data/docs/samples/themes-random.svg CHANGED Viewed

@@ -1,3 +1,3 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="1722px" height="1262px" viewBox="-0.5 -0.5 1722 1262"><defs/><g><ellipse cx="80" cy="61.25" rx="7.5" ry="6.25" fill="#f5f5f5" stroke="#666666" pointer-events="all"/><path d="M 80 67.5 L 80 88.33 M 80 71.67 L 65 71.67 M 80 71.67 L 95 71.67 M 80 88.33 L 65 105 M 80 88.33 L 95 105" fill="none" stroke="#666666" stroke-miterlimit="10" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 28px; height: 1px; padding-top: 130px; margin-left: 66px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">style_01</div></div></div></foreignObject><text x="80" y="134" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">style...</text></switch></g><path d="M 280 105 C 280 85 280 75 300 75 C 286.67 75 286.67 55 300 55 C 313.33 55 313.33 75 300 75 C 320 75 320 85 320 105 Z" fill="#dae8fc" stroke="#6c8ebf" stroke-miterlimit="10" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 38px; height: 1px; padding-top: 80px; margin-left: 281px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">style_02</div></div></div></foreignObject><text x="300" y="84" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">style_...</text></switch></g><path d="M 480 40 C 448 40 440 80 465.6 88 C 440 105.6 468.8 144 489.6 128 C 504 160 552 160 568 128 C 600 128 600 96 580 80 C 600 48 568 16 540 32 C 520 8 488 8 480 40 Z" fill="#d5e8d4" stroke="#82b366" stroke-miterlimit="10" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 80px; margin-left: 441px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">style_03</div></div></div></foreignObject><text x="520" y="84" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">style_03</text></switch></g><path d="M 681.41 82.87 C 675.53 86.08 668.91 83.21 665.15 75.81 C 661.39 68.4 661.39 58.24 665.15 50.84 C 668.91 43.44 675.53 40.56 681.41 43.78 C 681.37 30.74 686.82 19.03 695.09 14.39 C 703.36 9.75 712.72 13.15 718.58 22.93 C 722.34 9.08 731.45 -0.01 741.58 -0.01 C 751.72 -0.01 760.83 9.08 764.59 22.93 C 770.6 14.95 779.18 12.7 786.7 17.12 C 794.21 21.55 799.37 31.89 799.98 43.78 C 805.87 40.56 812.49 43.44 816.25 50.84 C 820.01 58.24 820.01 68.4 816.25 75.81 C 812.49 83.21 805.87 86.08 799.98 82.87 C 799.34 95.43 793.64 106.2 785.52 110.19 C 777.4 114.17 768.45 110.59 762.82 101.11 C 758.34 112.08 750.28 118.8 741.58 118.8 C 732.89 118.8 724.83 112.08 720.35 101.11 C 716.07 113.77 703.89 119.96 693.14 114.92 C 682.39 109.88 677.14 95.53 681.41 82.87 Z" fill="#ffe6cc" stroke="#d79b00" stroke-linejoin="round" stroke-miterlimit="10" pointer-events="all"/><rect x="660" y="0" width="0" height="0" fill="none" stroke="#d79b00" pointer-events="all"/><ellipse cx="686.72" cy="127.17" rx="10.618294436456145" ry="7.0358306188925095" fill="#ffe6cc" stroke="#d79b00" pointer-events="all"/><ellipse cx="674.33" cy="144.1" rx="6.724919809755558" ry="4.690553745928339" fill="#ffe6cc" stroke="#d79b00" pointer-events="all"/><ellipse cx="664.25" cy="156.61" rx="4.2473177745824575" ry="3.387622149837134" fill="#ffe6cc" stroke="#d79b00" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 80px; margin-left: 661px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">style_04</div></div></div></foreignObject><text x="740" y="84" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">style_04</text></switch></g><path d="M 880 65 L 880 30 Q 880 20 890 20 L 1030 20 Q 1040 20 1040 30 L 1040 100 Q 1040 110 1030 110 L 990 110 Q 980 110 974.45 118.32 L 960 140 L 960 120 Q 960 110 950 110 L 890 110 Q 880 110 880 100 Z" fill="#fff2cc" stroke="#d6b656" stroke-miterlimit="10" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 65px; margin-left: 881px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">style_05</div></div></div></foreignObject><text x="960" y="69" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">style_05</text></switch></g><path d="M 1260 23 L 1260 10.35 Q 1260 0 1249.65 0 L 1110.35 0 Q 1100 0 1100 10.35 L 1100 23" fill="#f8cecc" stroke="#b85450" stroke-miterlimit="10" pointer-events="all"/><path d="M 1100 23 L 1100 149.65 Q 1100 160 1110.35 160 L 1249.65 160 Q 1260 160 1260 149.65 L 1260 23" fill="none" stroke="#b85450" stroke-miterlimit="10" pointer-events="none"/><path d="M 1100 23 L 1260 23" fill="none" stroke="#b85450" stroke-miterlimit="10" pointer-events="none"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 12px; margin-left: 1101px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: none; font-weight: bold; white-space: normal; overflow-wrap: normal;">style_06</div></div></div></foreignObject><text x="1180" y="15" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle" font-weight="bold">style_06</text></switch></g><path d="M 1480 23 L 1480 10.35 Q 1480 0 1469.65 0 L 1330.35 0 Q 1320 0 1320 10.35 L 1320 23" fill="#e1d5e7" stroke="#9673a6" stroke-miterlimit="10" pointer-events="none"/><path d="M 1320 23 L 1320 149.65 Q 1320 160 1330.35 160 L 1469.65 160 Q 1480 160 1480 149.65 L 1480 23" fill="none" stroke="#9673a6" stroke-miterlimit="10" pointer-events="none"/><path d="M 1320 23 L 1480 23" fill="none" stroke="#9673a6" stroke-miterlimit="10" pointer-events="none"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 12px; margin-left: 1321px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: none; font-weight: bold; white-space: normal; overflow-wrap: normal;">style_07</div></div></div></foreignObject><text x="1400" y="15" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle" font-weight="bold">style_07</text></switch></g><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe flex-start; justify-content: unsafe flex-start; width: 98px; height: 1px; padding-top: 62px; margin-left: 1572px;"><div data-drawio-colors="color: #ffffff; " style="box-sizing: border-box; font-size: 0px; text-align: left;"><div style="display: inline-block; font-size: 37px; font-family: Helvetica; color: rgb(255, 255, 255); line-height: 1.2; pointer-events: none; font-weight: bold; white-space: normal; overflow-wrap: normal;">style_08</div></div></div></foreignObject><text x="1572" y="99" fill="#ffffff" font-family="Helvetica" font-size="37px" font-weight="bold">style_...</text></switch></g><path d="M 30.02 336.93 C 2.66 314.06 0 276.37 23.91 250.67 C 47.83 224.96 90.17 220.01 120.83 239.33 C 151.48 258.64 160 295.64 140.32 324.02 C 120.64 352.39 79.48 362.46 46.1 347.06 C 38.59 366.13 26.49 378.25 13.2 380 C 21.56 369.51 27.51 354.26 30.02 336.93 Z" fill="#008a00" stroke="#005700" stroke-miterlimit="15" pointer-events="none"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 300px; margin-left: 1px;"><div data-drawio-colors="color: #ffffff; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(255, 255, 255); line-height: 1.2; pointer-events: none; white-space: normal; overflow-wrap: normal;">style_09</div></div></div></foreignObject><text x="80" y="304" fill="#ffffff" font-family="Helvetica" font-size="12px" text-anchor="middle">style_09</text></switch></g><path d="M 275 275 L 289.58 275 L 300 289.8 L 310.42 275 L 325 275 L 307.29 300 L 325 325 L 310.42 325 L 300 310.2 L 289.58 325 L 275 325 L 291.67 300 Z" fill="#1ba1e2" stroke="#006eaf" stroke-miterlimit="10" pointer-events="none"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe flex-start; justify-content: unsafe center; width: 48px; height: 1px; padding-top: 332px; margin-left: 276px;"><div data-drawio-colors="color: #ffffff; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(255, 255, 255); line-height: 1.2; pointer-events: none; white-space: normal; overflow-wrap: normal;">style_10</div></div></div></foreignObject><text x="300" y="344" fill="#ffffff" font-family="Helvetica" font-size="12px" text-anchor="middle">style_10</text></switch></g><ellipse cx="520" cy="300" rx="100" ry="60" fill="#0050ef" stroke="#001dbc" pointer-events="none"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 198px; height: 1px; padding-top: 300px; margin-left: 421px;"><div data-drawio-colors="color: #ffffff; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(255, 255, 255); line-height: 1.2; pointer-events: none; white-space: normal; overflow-wrap: normal;">style_11</div></div></div></foreignObject><text x="520" y="304" fill="#ffffff" font-family="Helvetica" font-size="12px" text-anchor="middle">style_11</text></switch></g><path d="M 820 243 L 820 230.35 Q 820 220 809.65 220 L 670.35 220 Q 660 220 660 230.35 L 660 243" fill="#6a00ff" stroke="#3700cc" stroke-miterlimit="10" pointer-events="none"/><path d="M 660 243 L 660 369.65 Q 660 380 670.35 380 L 809.65 380 Q 820 380 820 369.65 L 820 243" fill="none" stroke="#3700cc" stroke-miterlimit="10" pointer-events="none"/><path d="M 660 243 L 820 243" fill="none" stroke="#3700cc" stroke-miterlimit="10" pointer-events="none"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 232px; margin-left: 661px;"><div data-drawio-colors="color: #ffffff; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(255, 255, 255); line-height: 1.2; pointer-events: none; font-weight: bold; white-space: normal; overflow-wrap: normal;">style_12</div></div></div></foreignObject><text x="740" y="235" fill="#ffffff" font-family="Helvetica" font-size="12px" text-anchor="middle" font-weight="bold">style_12</text></switch></g><ellipse cx="960" cy="281.25" rx="7.5" ry="6.25" fill="#aa00ff" stroke="#7700cc" pointer-events="none"/><path d="M 960 287.5 L 960 308.33 M 960 291.67 L 945 291.67 M 960 291.67 L 975 291.67 M 960 308.33 L 945 325 M 960 308.33 L 975 325" fill="none" stroke="#7700cc" stroke-miterlimit="10" pointer-events="none"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 28px; height: 1px; padding-top: 350px; margin-left: 946px;"><div data-drawio-colors="color: #ffffff; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(255, 255, 255); line-height: 1.2; pointer-events: none; white-space: normal; overflow-wrap: normal;">style_13</div></div></div></foreignObject><text x="960" y="354" fill="#ffffff" font-family="Helvetica" font-size="12px" text-anchor="middle">style...</text></switch></g><path d="M 1155.21 309.19 C 1155.75 307.5 1157.08 306.08 1158.89 305.3 C 1160.7 304.52 1162.81 304.44 1164.69 305.09 C 1167.43 306.24 1169.55 308.26 1170.62 310.72 C 1175.5 298.7 1182.94 287.58 1192.54 277.92 C 1195.26 275.78 1199.07 275 1202.61 275.87 C 1203.51 275.99 1204.28 276.51 1204.64 277.24 C 1205 277.96 1204.9 278.8 1204.38 279.45 C 1191.34 292.2 1181.64 307.24 1175.95 323.54 C 1172.59 325 1168.64 325 1165.28 323.54 C 1162.75 318.67 1159.35 314.17 1155.21 310.21 C 1155 309.89 1155 309.5 1155.21 309.19 Z" fill="#d80073" stroke="#a50040" stroke-miterlimit="10" pointer-events="none"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe flex-start; justify-content: unsafe center; width: 48px; height: 1px; padding-top: 332px; margin-left: 1156px;"><div data-drawio-colors="color: #ffffff; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(255, 255, 255); line-height: 1.2; pointer-events: none; white-space: normal; overflow-wrap: normal;">style_14</div></div></div></foreignObject><text x="1180" y="344" fill="#ffffff" font-family="Helvetica" font-size="12px" text-anchor="middle">style_14</text></switch></g><path d="M 1375.21 309.19 C 1375.75 307.5 1377.08 306.08 1378.89 305.3 C 1380.7 304.52 1382.81 304.44 1384.69 305.09 C 1387.43 306.24 1389.55 308.26 1390.62 310.72 C 1395.5 298.7 1402.94 287.58 1412.54 277.92 C 1415.26 275.78 1419.07 275 1422.61 275.87 C 1423.51 275.99 1424.28 276.51 1424.64 277.24 C 1425 277.96 1424.9 278.8 1424.38 279.45 C 1411.34 292.2 1401.64 307.24 1395.95 323.54 C 1392.59 325 1388.64 325 1385.28 323.54 C 1382.75 318.67 1379.35 314.17 1375.21 310.21 C 1375 309.89 1375 309.5 1375.21 309.19 Z" fill="#a20025" stroke="#6f0000" stroke-miterlimit="10" pointer-events="none"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe flex-start; justify-content: unsafe center; width: 48px; height: 1px; padding-top: 332px; margin-left: 1376px;"><div data-drawio-colors="color: #ffffff; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(255, 255, 255); line-height: 1.2; pointer-events: none; white-space: normal; overflow-wrap: normal;">style_15</div></div></div></foreignObject><text x="1400" y="344" fill="#ffffff" font-family="Helvetica" font-size="12px" text-anchor="middle">style_15</text></switch></g><path d="M 1545 270 L 1563.6 247.68 Q 1570 240 1580 240 L 1660 240 Q 1670 240 1676.4 247.68 L 1713.6 292.32 Q 1720 300 1713.6 307.68 L 1676.4 352.32 Q 1670 360 1660 360 L 1580 360 Q 1570 360 1563.6 352.32 L 1526.4 307.68 Q 1520 300 1526.4 292.32 Z" fill="#e51400" stroke="#b20000" stroke-miterlimit="10" pointer-events="none"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 198px; height: 1px; padding-top: 300px; margin-left: 1521px;"><div data-drawio-colors="color: #ffffff; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(255, 255, 255); line-height: 1.2; pointer-events: none; white-space: normal; overflow-wrap: normal;">style_16</div></div></div></foreignObject><text x="1620" y="304" fill="#ffffff" font-family="Helvetica" font-size="12px" text-anchor="middle">style_16</text></switch></g><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe flex-start; justify-content: unsafe flex-start; width: 98px; height: 1px; padding-top: 502px; margin-left: 32px;"><div data-drawio-colors="color: #000000; " style="box-sizing: border-box; font-size: 0px; text-align: left;"><div style="display: inline-block; font-size: 67px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: none; font-weight: bold; white-space: normal; overflow-wrap: normal;">style_17</div></div></div></foreignObject><text x="32" y="569" fill="#000000" font-family="Helvetica" font-size="67px" font-weight="bold">sty...</text></switch></g><path d="M 250.02 556.93 C 222.66 534.06 220 496.37 243.91 470.67 C 267.83 444.96 310.17 440.01 340.83 459.33 C 371.48 478.64 380 515.64 360.32 544.02 C 340.64 572.39 299.48 582.46 266.1 567.06 C 258.59 586.13 246.49 598.25 233.2 600 C 241.56 589.51 247.51 574.26 250.02 556.93 Z" fill="#f0a30a" stroke="#bd7000" stroke-miterlimit="15" pointer-events="none"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 520px; margin-left: 221px;"><div data-drawio-colors="color: #000000; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: none; white-space: normal; overflow-wrap: normal;">style_18</div></div></div></foreignObject><text x="300" y="524" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">style_18</text></switch></g><path d="M 463 440 L 450.35 440 Q 440 440 440 450.35 L 440 589.65 Q 440 600 450.35 600 L 463 600" fill="#e3c800" stroke="#b09500" stroke-miterlimit="10" pointer-events="none"/><path d="M 463 600 L 589.65 600 Q 600 600 600 589.65 L 600 450.35 Q 600 440 589.65 440 L 463 440" fill="none" stroke="#b09500" stroke-miterlimit="10" pointer-events="none"/><path d="M 463 440 L 463 600" fill="none" stroke="#b09500" stroke-miterlimit="10" pointer-events="none"/><g transform="translate(-0.5 -0.5)rotate(-90 451.5 520)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 520px; margin-left: 373px;"><div data-drawio-colors="color: #000000; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: none; font-weight: bold; white-space: normal; overflow-wrap: normal;">style_19</div></div></div></foreignObject><text x="452" y="524" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle" font-weight="bold">style_19</text></switch></g><ellipse cx="740" cy="501.25" rx="7.5" ry="6.25" fill="#6d8764" stroke="#3a5431" pointer-events="none"/><path d="M 740 507.5 L 740 528.33 M 740 511.67 L 725 511.67 M 740 511.67 L 755 511.67 M 740 528.33 L 725 545 M 740 528.33 L 755 545" fill="none" stroke="#3a5431" stroke-miterlimit="10" pointer-events="none"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 28px; height: 1px; padding-top: 570px; margin-left: 726px;"><div data-drawio-colors="color: #ffffff; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(255, 255, 255); line-height: 1.2; pointer-events: none; white-space: normal; overflow-wrap: normal;">style_20</div></div></div></foreignObject><text x="740" y="574" fill="#ffffff" font-family="Helvetica" font-size="12px" text-anchor="middle">style...</text></switch></g><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe flex-start; justify-content: unsafe flex-start; width: 98px; height: 1px; padding-top: 502px; margin-left: 912px;"><div data-drawio-colors="color: #ffffff; " style="box-sizing: border-box; font-size: 0px; text-align: left;"><div style="display: inline-block; font-size: 37px; font-family: Helvetica; color: rgb(255, 255, 255); line-height: 1.2; pointer-events: none; font-weight: bold; white-space: normal; overflow-wrap: normal;">style_21</div></div></div></foreignObject><text x="912" y="539" fill="#ffffff" font-family="Helvetica" font-size="37px" font-weight="bold">style_...</text></switch></g><path d="M 1130.02 556.93 C 1102.66 534.06 1100 496.37 1123.91 470.67 C 1147.83 444.96 1190.17 440.01 1220.83 459.33 C 1251.48 478.64 1260 515.64 1240.32 544.02 C 1220.64 572.39 1179.48 582.46 1146.1 567.06 C 1138.59 586.13 1126.49 598.25 1113.2 600 C 1121.56 589.51 1127.51 574.26 1130.02 556.93 Z" fill="#76608a" stroke="#432d57" stroke-miterlimit="15" pointer-events="none"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 520px; margin-left: 1101px;"><div data-drawio-colors="color: #ffffff; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(255, 255, 255); line-height: 1.2; pointer-events: none; white-space: normal; overflow-wrap: normal;">style_22</div></div></div></foreignObject><text x="1180" y="524" fill="#ffffff" font-family="Helvetica" font-size="12px" text-anchor="middle">style_22</text></switch></g><path d="M 1342.5 565 L 1325 565 C 1322.24 565 1320 562.76 1320 560 L 1320 465 C 1320 462.24 1322.24 460 1325 460 L 1475 460 C 1477.76 460 1480 462.24 1480 465 L 1480 560 C 1480 562.76 1477.76 565 1475 565 L 1357.5 565 C 1354.54 572.77 1345.79 578.6 1335 580 C 1338.89 577.15 1341.68 571.57 1342.5 565 Z" fill="#a0522d" stroke="#6d1f00" stroke-miterlimit="10" pointer-events="none"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 513px; margin-left: 1321px;"><div data-drawio-colors="color: #ffffff; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(255, 255, 255); line-height: 1.2; pointer-events: none; white-space: normal; overflow-wrap: normal;">style_23</div></div></div></foreignObject><text x="1400" y="516" fill="#ffffff" font-family="Helvetica" font-size="12px" text-anchor="middle">style_23</text></switch></g><path d="M 1700 463 L 1700 450.35 Q 1700 440 1689.65 440 L 1550.35 440 Q 1540 440 1540 450.35 L 1540 463" fill="#fad7ac" stroke="#b46504" stroke-miterlimit="10" pointer-events="none"/><path d="M 1540 463 L 1540 589.65 Q 1540 600 1550.35 600 L 1689.65 600 Q 1700 600 1700 589.65 L 1700 463" fill="none" stroke="#b46504" stroke-miterlimit="10" pointer-events="none"/><path d="M 1540 463 L 1700 463" fill="none" stroke="#b46504" stroke-miterlimit="10" pointer-events="none"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 452px; margin-left: 1541px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: none; font-weight: bold; white-space: normal; overflow-wrap: normal;">style_24</div></div></div></foreignObject><text x="1620" y="455" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle" font-weight="bold">style_24</text></switch></g><path d="M 30.02 776.93 C 2.66 754.06 0 716.37 23.91 690.67 C 47.83 664.96 90.17 660.01 120.83 679.33 C 151.48 698.64 160 735.64 140.32 764.02 C 120.64 792.39 79.48 802.46 46.1 787.06 C 38.59 806.13 26.49 818.25 13.2 820 C 21.56 809.51 27.51 794.26 30.02 776.93 Z" fill="#fad9d5" stroke="#ae4132" stroke-miterlimit="15" pointer-events="none"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 740px; margin-left: 1px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: none; white-space: normal; overflow-wrap: normal;">style_25</div></div></div></foreignObject><text x="80" y="744" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">style_25</text></switch></g><path d="M 380 683 L 380 670.35 Q 380 660 369.65 660 L 230.35 660 Q 220 660 220 670.35 L 220 683" fill="#b0e3e6" stroke="#0e8088" stroke-miterlimit="10" pointer-events="none"/><path d="M 220 683 L 220 809.65 Q 220 820 230.35 820 L 369.65 820 Q 380 820 380 809.65 L 380 683" fill="none" stroke="#0e8088" stroke-miterlimit="10" pointer-events="none"/><path d="M 220 683 L 380 683" fill="none" stroke="#0e8088" stroke-miterlimit="10" pointer-events="none"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 672px; margin-left: 221px;"><div data-drawio-colors="color: #000000; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: none; font-weight: bold; white-space: normal; overflow-wrap: normal;">style_26</div></div></div></foreignObject><text x="300" y="675" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle" font-weight="bold">style_26</text></switch></g><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe flex-start; justify-content: unsafe flex-start; width: 98px; height: 1px; padding-top: 722px; margin-left: 472px;"><div data-drawio-colors="color: #000000; " style="box-sizing: border-box; font-size: 0px; text-align: left;"><div style="display: inline-block; font-size: 21px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: none; font-weight: bold; white-space: normal; overflow-wrap: normal;">style_27</div></div></div></foreignObject><text x="472" y="743" fill="#000000" font-family="Helvetica" font-size="21px" font-weight="bold">style_27</text></switch></g><path d="M 660 725 L 660 690 Q 660 680 670 680 L 810 680 Q 820 680 820 690 L 820 760 Q 820 770 810 770 L 770 770 Q 760 770 754.45 778.32 L 740 800 L 740 780 Q 740 770 730 770 L 670 770 Q 660 770 660 760 Z" fill="#d0cee2" stroke="#56517e" stroke-miterlimit="10" pointer-events="none"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 725px; margin-left: 661px;"><div data-drawio-colors="color: #000000; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: none; white-space: normal; overflow-wrap: normal;">style_28</div></div></div></foreignObject><text x="740" y="729" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">style_28</text></switch></g><ellipse cx="960" cy="740" rx="80" ry="80" fill="#bac8d3" stroke="#23445d" pointer-events="none"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 740px; margin-left: 881px;"><div data-drawio-colors="color: #000000; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: none; white-space: normal; overflow-wrap: normal;">style_29</div></div></div></foreignObject><text x="960" y="744" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">style_29</text></switch></g><rect x="1080" y="680" width="200" height="120" rx="18" ry="18" fill="#f5f5f5" stroke="#666666" pointer-events="none"/><path d="M 1100 680 L 1100 800 M 1260 680 L 1260 800" fill="none" stroke="#666666" stroke-miterlimit="10" pointer-events="none"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 740px; margin-left: 1101px;"><div data-drawio-colors="color: #000000; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: none; white-space: normal; overflow-wrap: normal;">style_30</div></div></div></foreignObject><text x="1180" y="744" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">style_30</text></switch></g><path d="M 1480 710 L 1480 682.5 Q 1480 660 1457.5 660 L 1342.5 660 Q 1320 660 1320 682.5 L 1320 710" fill="#dae8fc" stroke="#6c8ebf" stroke-miterlimit="10" pointer-events="none"/><path d="M 1320 710 L 1320 797.5 Q 1320 820 1342.5 820 L 1457.5 820 Q 1480 820 1480 797.5 L 1480 710" fill="none" stroke="#6c8ebf" stroke-miterlimit="10" pointer-events="none"/><path d="M 1320 710 L 1480 710" fill="none" stroke="#6c8ebf" stroke-miterlimit="10" pointer-events="none"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 685px; margin-left: 1321px;"><div data-drawio-colors="color: #000000; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: none; font-weight: bold; white-space: normal; overflow-wrap: normal;">style_31</div></div></div></foreignObject><text x="1400" y="689" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle" font-weight="bold">style_31</text></switch></g><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe flex-start; justify-content: unsafe flex-start; width: 98px; height: 1px; padding-top: 722px; margin-left: 1572px;"><div data-drawio-colors="color: #000000; " style="box-sizing: border-box; font-size: 0px; text-align: left;"><div style="display: inline-block; font-size: 16px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: none; font-weight: bold; white-space: normal; overflow-wrap: normal;">style_32</div></div></div></foreignObject><text x="1572" y="738" fill="#000000" font-family="Helvetica" font-size="16px" font-weight="bold">style_32</text></switch></g><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe flex-start; justify-content: unsafe flex-start; width: 98px; height: 1px; padding-top: 942px; margin-left: 32px;"><div data-drawio-colors="color: #000000; " style="box-sizing: border-box; font-size: 0px; text-align: left;"><div style="display: inline-block; font-size: 28px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: none; font-weight: bold; white-space: normal; overflow-wrap: normal;">style_33</div></div></div></foreignObject><text x="32" y="970" fill="#000000" font-family="Helvetica" font-size="28px" font-weight="bold">style_33</text></switch></g><path d="M 380 903 L 380 890.35 Q 380 880 369.65 880 L 230.35 880 Q 220 880 220 890.35 L 220 903" fill="#fff2cc" stroke="#d6b656" stroke-miterlimit="10" pointer-events="none"/><path d="M 220 903 L 220 1029.65 Q 220 1040 230.35 1040 L 369.65 1040 Q 380 1040 380 1029.65 L 380 903" fill="none" stroke="#d6b656" stroke-miterlimit="10" pointer-events="none"/><path d="M 220 903 L 380 903" fill="none" stroke="#d6b656" stroke-miterlimit="10" pointer-events="none"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 892px; margin-left: 221px;"><div data-drawio-colors="color: #000000; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: none; font-weight: bold; white-space: normal; overflow-wrap: normal;">style_34</div></div></div></foreignObject><text x="300" y="895" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle" font-weight="bold">style_34</text></switch></g><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe flex-start; justify-content: unsafe flex-start; width: 98px; height: 1px; padding-top: 942px; margin-left: 472px;"><div data-drawio-colors="color: #000000; " style="box-sizing: border-box; font-size: 0px; text-align: left;"><div style="display: inline-block; font-size: 16px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: none; font-weight: bold; white-space: normal; overflow-wrap: normal;">style_35</div></div></div></foreignObject><text x="472" y="958" fill="#000000" font-family="Helvetica" font-size="16px" font-weight="bold">style_35</text></switch></g><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe flex-start; justify-content: unsafe flex-start; width: 98px; height: 1px; padding-top: 942px; margin-left: 692px;"><div data-drawio-colors="color: #000000; " style="box-sizing: border-box; font-size: 0px; text-align: left;"><div style="display: inline-block; font-size: 28px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: none; font-weight: bold; white-space: normal; overflow-wrap: normal;">style_36</div></div></div></foreignObject><text x="692" y="970" fill="#000000" font-family="Helvetica" font-size="28px" font-weight="bold">style_36</text></switch></g><ellipse cx="960" cy="960" rx="80" ry="80" fill="#eeeeee" stroke="#36393d" pointer-events="none"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 960px; margin-left: 881px;"><div data-drawio-colors="color: #000000; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: none; white-space: normal; overflow-wrap: normal;">style_37</div></div></div></foreignObject><text x="960" y="964" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">style_37</text></switch></g><path d="M 1155.21 969.19 C 1155.75 967.5 1157.08 966.08 1158.89 965.3 C 1160.7 964.52 1162.81 964.44 1164.69 965.09 C 1167.43 966.24 1169.55 968.26 1170.62 970.72 C 1175.5 958.7 1182.94 947.58 1192.54 937.92 C 1195.26 935.78 1199.07 935 1202.61 935.87 C 1203.51 935.99 1204.28 936.51 1204.64 937.24 C 1205 937.96 1204.9 938.8 1204.38 939.45 C 1191.34 952.2 1181.64 967.24 1175.95 983.54 C 1172.59 985 1168.64 985 1165.28 983.54 C 1162.75 978.67 1159.35 974.17 1155.21 970.21 C 1155 969.89 1155 969.5 1155.21 969.19 Z" fill="#f9f7ed" stroke="#36393d" stroke-miterlimit="10" pointer-events="none"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe flex-start; justify-content: unsafe center; width: 48px; height: 1px; padding-top: 992px; margin-left: 1156px;"><div data-drawio-colors="color: #000000; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: none; white-space: normal; overflow-wrap: normal;">style_38</div></div></div></foreignObject><text x="1180" y="1004" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">style_38</text></switch></g><rect x="1320" y="880" width="160" height="160" rx="24" ry="24" fill="#ffcc99" stroke="#36393d" pointer-events="none"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 960px; margin-left: 1321px;"><div data-drawio-colors="color: #000000; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: none; white-space: normal; overflow-wrap: normal;">style_39</div></div></div></foreignObject><text x="1400" y="964" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">style_39</text></switch></g><path d="M 1570.02 996.93 C 1542.66 974.06 1540 936.37 1563.91 910.67 C 1587.83 884.96 1630.17 880.01 1660.83 899.33 C 1691.48 918.64 1700 955.64 1680.32 984.02 C 1660.64 1012.39 1619.48 1022.46 1586.1 1007.06 C 1578.59 1026.13 1566.49 1038.25 1553.2 1040 C 1561.56 1029.51 1567.51 1014.26 1570.02 996.93 Z" fill="#cce5ff" stroke="#36393d" stroke-miterlimit="15" pointer-events="none"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 960px; margin-left: 1541px;"><div data-drawio-colors="color: #000000; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: none; white-space: normal; overflow-wrap: normal;">style_40</div></div></div></foreignObject><text x="1620" y="964" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">style_40</text></switch></g><path d="M 160 1123 L 160 1110.35 Q 160 1100 149.65 1100 L 10.35 1100 Q 0 1100 0 1110.35 L 0 1123" fill="#ffff88" stroke="#36393d" stroke-miterlimit="10" pointer-events="none"/><path d="M 0 1123 L 0 1249.65 Q 0 1260 10.35 1260 L 149.65 1260 Q 160 1260 160 1249.65 L 160 1123" fill="none" stroke="#36393d" stroke-miterlimit="10" pointer-events="none"/><path d="M 0 1123 L 160 1123" fill="none" stroke="#36393d" stroke-miterlimit="10" pointer-events="none"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 1112px; margin-left: 1px;"><div data-drawio-colors="color: #000000; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: none; font-weight: bold; white-space: normal; overflow-wrap: normal;">style_41</div></div></div></foreignObject><text x="80" y="1115" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle" font-weight="bold">style_41</text></switch></g><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe flex-start; justify-content: unsafe flex-start; width: 98px; height: 1px; padding-top: 1162px; margin-left: 252px;"><div data-drawio-colors="color: #000000; " style="box-sizing: border-box; font-size: 0px; text-align: left;"><div style="display: inline-block; font-size: 37px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: none; font-weight: bold; white-space: normal; overflow-wrap: normal;">style_42</div></div></div></foreignObject><text x="252" y="1199" fill="#000000" font-family="Helvetica" font-size="37px" font-weight="bold">style_...</text></switch></g><path d="M 463 1100 L 450.35 1100 Q 440 1100 440 1110.35 L 440 1249.65 Q 440 1260 450.35 1260 L 463 1260" fill="#ffcccc" stroke="#36393d" stroke-miterlimit="10" pointer-events="none"/><path d="M 463 1260 L 589.65 1260 Q 600 1260 600 1249.65 L 600 1110.35 Q 600 1100 589.65 1100 L 463 1100" fill="none" stroke="#36393d" stroke-miterlimit="10" pointer-events="none"/><path d="M 463 1100 L 463 1260" fill="none" stroke="#36393d" stroke-miterlimit="10" pointer-events="none"/><g transform="translate(-0.5 -0.5)rotate(-90 451.5 1180)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 1180px; margin-left: 373px;"><div data-drawio-colors="color: #000000; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: none; font-weight: bold; white-space: normal; overflow-wrap: normal;">style_43</div></div></div></foreignObject><text x="452" y="1184" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle" font-weight="bold">style_43</text></switch></g></g><switch><g requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"/><a transform="translate(0,-5)" xlink:href="https://www.diagrams.net/doc/faq/svg-export-text-problems" target="_blank"><text text-anchor="middle" font-size="10px" x="50%" y="100%">Text is not SVG - cannot display</text></a></switch></svg>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="1742px" height="1262px" viewBox="-0.5 -0.5 1742 1262"><defs/><g><rect x="20" y="0" width="160" height="160" rx="24" ry="24" fill="#f5f5f5" stroke="#666666" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 80px; margin-left: 21px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">style_01</div></div></div></foreignObject><text x="100" y="84" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">style_01</text></switch></g><rect x="240" y="0" width="160" height="160" rx="24" ry="24" fill="#dae8fc" stroke="#6c8ebf" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 80px; margin-left: 241px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">style_02</div></div></div></foreignObject><text x="320" y="84" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">style_02</text></switch></g><rect x="440" y="20" width="200" height="120" rx="18" ry="18" fill="#d5e8d4" stroke="#82b366" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 198px; height: 1px; padding-top: 80px; margin-left: 441px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">style_03</div></div></div></foreignObject><text x="540" y="84" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">style_03</text></switch></g><path d="M 735.21 89.19 C 735.75 87.5 737.08 86.08 738.89 85.3 C 740.7 84.52 742.81 84.44 744.69 85.09 C 747.43 86.24 749.55 88.26 750.62 90.72 C 755.5 78.7 762.94 67.58 772.54 57.92 C 775.26 55.78 779.07 55 782.61 55.87 C 783.51 55.99 784.28 56.51 784.64 57.24 C 785 57.96 784.9 58.8 784.38 59.45 C 771.34 72.2 761.64 87.24 755.95 103.54 C 752.59 105 748.64 105 745.28 103.54 C 742.75 98.67 739.35 94.17 735.21 90.21 C 735 89.89 735 89.5 735.21 89.19 Z" fill="#ffe6cc" stroke="#d79b00" stroke-miterlimit="10" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe flex-start; justify-content: unsafe center; width: 48px; height: 1px; padding-top: 112px; margin-left: 736px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">style_04</div></div></div></foreignObject><text x="760" y="124" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">style_04</text></switch></g><rect x="930" y="55" width="100" height="50" rx="7.5" ry="7.5" fill="none" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe flex-start; justify-content: unsafe flex-start; width: 98px; height: 1px; padding-top: 62px; margin-left: 932px;"><div data-drawio-colors="color: #ffffff; " style="box-sizing: border-box; font-size: 0px; text-align: left;"><div style="display: inline-block; font-size: 37px; font-family: Helvetica; color: rgb(255, 255, 255); line-height: 1.2; pointer-events: all; font-weight: bold; white-space: normal; overflow-wrap: normal;">style_05</div></div></div></foreignObject><text x="932" y="99" fill="#ffffff" font-family="Helvetica" font-size="37px" font-weight="bold">style_...</text></switch></g><rect x="1150" y="55" width="100" height="50" rx="7.5" ry="7.5" fill="none" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe flex-start; justify-content: unsafe flex-start; width: 98px; height: 1px; padding-top: 62px; margin-left: 1152px;"><div data-drawio-colors="color: #ffffff; " style="box-sizing: border-box; font-size: 0px; text-align: left;"><div style="display: inline-block; font-size: 50px; font-family: Helvetica; color: rgb(255, 255, 255); line-height: 1.2; pointer-events: all; font-weight: bold; white-space: normal; overflow-wrap: normal;">style_06</div></div></div></foreignObject><text x="1152" y="112" fill="#ffffff" font-family="Helvetica" font-size="50px" font-weight="bold">styl...</text></switch></g><path d="M 1380 40 C 1348 40 1340 80 1365.6 88 C 1340 105.6 1368.8 144 1389.6 128 C 1404 160 1452 160 1468 128 C 1500 128 1500 96 1480 80 C 1500 48 1468 16 1440 32 C 1420 8 1388 8 1380 40 Z" fill="#e1d5e7" stroke="#9673a6" stroke-miterlimit="10" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 80px; margin-left: 1341px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">style_07</div></div></div></foreignObject><text x="1420" y="84" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">style_07</text></switch></g><path d="M 1720 23 L 1720 10.35 Q 1720 0 1709.65 0 L 1570.35 0 Q 1560 0 1560 10.35 L 1560 23" fill="#60a917" stroke="#2d7600" stroke-miterlimit="10" pointer-events="all"/><path d="M 1560 23 L 1560 149.65 Q 1560 160 1570.35 160 L 1709.65 160 Q 1720 160 1720 149.65 L 1720 23" fill="none" stroke="#2d7600" stroke-miterlimit="10" pointer-events="none"/><path d="M 1560 23 L 1720 23" fill="none" stroke="#2d7600" stroke-miterlimit="10" pointer-events="none"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 12px; margin-left: 1561px;"><div data-drawio-colors="color: #ffffff; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(255, 255, 255); line-height: 1.2; pointer-events: none; font-weight: bold; white-space: normal; overflow-wrap: normal;">style_08</div></div></div></foreignObject><text x="1640" y="15" fill="#ffffff" font-family="Helvetica" font-size="12px" text-anchor="middle" font-weight="bold">style_08</text></switch></g><rect x="0" y="280" width="200" height="40" fill="#008a00" stroke="none" pointer-events="none"/><path d="M 0 280 M 200 280 M 200 320 L 0 320" fill="none" stroke="#005700" stroke-linecap="square" stroke-miterlimit="10" pointer-events="none"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 198px; height: 1px; padding-top: 300px; margin-left: 1px;"><div data-drawio-colors="color: #ffffff; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(255, 255, 255); line-height: 1.2; pointer-events: none; white-space: normal; overflow-wrap: normal;">style_09</div></div></div></foreignObject><text x="100" y="304" fill="#ffffff" font-family="Helvetica" font-size="12px" text-anchor="middle">style_09</text></switch></g><rect x="240" y="220" width="160" height="160" rx="24" ry="24" fill="#1ba1e2" stroke="#006eaf" pointer-events="none"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe flex-start; width: 162px; height: 160px; padding-top: 220px; margin-left: 240px;"><div data-drawio-colors="color: #ffffff; " style="box-sizing: border-box; font-size: 0px; text-align: left; width: 160px; height: 160px; overflow: hidden;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(255, 255, 255); line-height: 1.2; pointer-events: none; width: 100%; height: 100%; white-space: normal; overflow-wrap: normal;">style_10</div></div></div></foreignObject><text x="240" y="304" fill="#ffffff" font-family="Helvetica" font-size="12px">style_10</text></switch></g><ellipse cx="540" cy="300" rx="50" ry="50" fill="#0050ef" stroke="#001dbc" pointer-events="none"/><path d="M 501.22 305.1 C 501.22 320.32 518.58 332.65 540 332.65 C 561.42 332.65 578.78 320.32 578.78 305.1" fill="none" stroke="#001dbc" stroke-width="2.04" stroke-miterlimit="10" pointer-events="none"/><rect x="490" y="250" width="0" height="0" fill="none" stroke="#001dbc" pointer-events="none"/><path d="M 506.33 302.04 L 496.12 308.16" fill="#0050ef" stroke="#001dbc" stroke-miterlimit="10" pointer-events="none"/><path d="M 573.67 302.04 L 583.88 308.16" fill="#0050ef" stroke="#001dbc" stroke-miterlimit="10" pointer-events="none"/><ellipse cx="517.55" cy="285.71" rx="3.0612244897959187" ry="8.16326530612245" fill="#0050ef" stroke="#001dbc" stroke-width="6.12" pointer-events="none"/><ellipse cx="562.45" cy="285.71" rx="3.0612244897959187" ry="8.16326530612245" fill="#0050ef" stroke="#001dbc" stroke-width="6.12" pointer-events="none"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe flex-start; justify-content: unsafe center; width: 98px; height: 1px; padding-top: 357px; margin-left: 491px;"><div data-drawio-colors="color: #ffffff; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(255, 255, 255); line-height: 1.2; pointer-events: none; white-space: normal; overflow-wrap: normal;">style_11</div></div></div></foreignObject><text x="540" y="369" fill="#ffffff" font-family="Helvetica" font-size="12px" text-anchor="middle">style_11</text></switch></g><path d="M 840 243 L 840 230.35 Q 840 220 829.65 220 L 690.35 220 Q 680 220 680 230.35 L 680 243" fill="#6a00ff" stroke="#3700cc" stroke-miterlimit="10" pointer-events="none"/><path d="M 680 243 L 680 369.65 Q 680 380 690.35 380 L 829.65 380 Q 840 380 840 369.65 L 840 243" fill="none" stroke="#3700cc" stroke-miterlimit="10" pointer-events="none"/><path d="M 680 243 L 840 243" fill="none" stroke="#3700cc" stroke-miterlimit="10" pointer-events="none"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 232px; margin-left: 681px;"><div data-drawio-colors="color: #ffffff; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(255, 255, 255); line-height: 1.2; pointer-events: none; font-weight: bold; white-space: normal; overflow-wrap: normal;">style_12</div></div></div></foreignObject><text x="760" y="235" fill="#ffffff" font-family="Helvetica" font-size="12px" text-anchor="middle" font-weight="bold">style_12</text></switch></g><ellipse cx="980" cy="281.25" rx="7.5" ry="6.25" fill="#aa00ff" stroke="#7700cc" pointer-events="none"/><path d="M 980 287.5 L 980 308.33 M 980 291.67 L 965 291.67 M 980 291.67 L 995 291.67 M 980 308.33 L 965 325 M 980 308.33 L 995 325" fill="none" stroke="#7700cc" stroke-miterlimit="10" pointer-events="none"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 28px; height: 1px; padding-top: 350px; margin-left: 966px;"><div data-drawio-colors="color: #ffffff; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(255, 255, 255); line-height: 1.2; pointer-events: none; white-space: normal; overflow-wrap: normal;">style_13</div></div></div></foreignObject><text x="980" y="354" fill="#ffffff" font-family="Helvetica" font-size="12px" text-anchor="middle">style...</text></switch></g><path d="M 1141.41 302.87 C 1135.53 306.08 1128.91 303.21 1125.15 295.81 C 1121.39 288.4 1121.39 278.24 1125.15 270.84 C 1128.91 263.44 1135.53 260.56 1141.41 263.78 C 1141.37 250.74 1146.82 239.03 1155.09 234.39 C 1163.36 229.75 1172.72 233.15 1178.58 242.93 C 1182.34 229.08 1191.45 219.99 1201.58 219.99 C 1211.72 219.99 1220.83 229.08 1224.59 242.93 C 1230.6 234.95 1239.18 232.7 1246.7 237.12 C 1254.21 241.55 1259.37 251.89 1259.98 263.78 C 1265.87 260.56 1272.49 263.44 1276.25 270.84 C 1280.01 278.24 1280.01 288.4 1276.25 295.81 C 1272.49 303.21 1265.87 306.08 1259.98 302.87 C 1259.34 315.43 1253.64 326.2 1245.52 330.19 C 1237.4 334.17 1228.45 330.59 1222.82 321.11 C 1218.34 332.08 1210.28 338.8 1201.58 338.8 C 1192.89 338.8 1184.83 332.08 1180.35 321.11 C 1176.07 333.77 1163.89 339.96 1153.14 334.92 C 1142.39 329.88 1137.14 315.53 1141.41 302.87 Z" fill="#d80073" stroke="#a50040" stroke-linejoin="round" stroke-miterlimit="10" pointer-events="none"/><rect x="1120" y="220" width="0" height="0" fill="none" stroke="#a50040" pointer-events="none"/><ellipse cx="1146.72" cy="347.17" rx="10.618294436456145" ry="7.0358306188925095" fill="#d80073" stroke="#a50040" pointer-events="none"/><ellipse cx="1134.33" cy="364.1" rx="6.724919809755558" ry="4.690553745928339" fill="#d80073" stroke="#a50040" pointer-events="none"/><ellipse cx="1124.25" cy="376.61" rx="4.2473177745824575" ry="3.387622149837134" fill="#d80073" stroke="#a50040" pointer-events="none"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 300px; margin-left: 1121px;"><div data-drawio-colors="color: #ffffff; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(255, 255, 255); line-height: 1.2; pointer-events: none; white-space: normal; overflow-wrap: normal;">style_14</div></div></div></foreignObject><text x="1200" y="304" fill="#ffffff" font-family="Helvetica" font-size="12px" text-anchor="middle">style_14</text></switch></g><path d="M 1395 275 L 1409.58 275 L 1420 289.8 L 1430.42 275 L 1445 275 L 1427.29 300 L 1445 325 L 1430.42 325 L 1420 310.2 L 1409.58 325 L 1395 325 L 1411.67 300 Z" fill="#a20025" stroke="#6f0000" stroke-miterlimit="10" pointer-events="none"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe flex-start; justify-content: unsafe center; width: 48px; height: 1px; padding-top: 332px; margin-left: 1396px;"><div data-drawio-colors="color: #ffffff; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(255, 255, 255); line-height: 1.2; pointer-events: none; white-space: normal; overflow-wrap: normal;">style_15</div></div></div></foreignObject><text x="1420" y="344" fill="#ffffff" font-family="Helvetica" font-size="12px" text-anchor="middle">style_15</text></switch></g><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe flex-start; justify-content: unsafe flex-start; width: 98px; height: 1px; padding-top: 282px; margin-left: 1592px;"><div data-drawio-colors="color: #ffffff; " style="box-sizing: border-box; font-size: 0px; text-align: left;"><div style="display: inline-block; font-size: 21px; font-family: Helvetica; color: rgb(255, 255, 255); line-height: 1.2; pointer-events: none; font-weight: bold; white-space: normal; overflow-wrap: normal;">style_16</div></div></div></foreignObject><text x="1592" y="303" fill="#ffffff" font-family="Helvetica" font-size="21px" font-weight="bold">style_16</text></switch></g><path d="M 60 480 C 28 480 20 520 45.6 528 C 20 545.6 48.8 584 69.6 568 C 84 600 132 600 148 568 C 180 568 180 536 160 520 C 180 488 148 456 120 472 C 100 448 68 448 60 480 Z" fill="#fa6800" stroke="#c73500" stroke-miterlimit="10" pointer-events="none"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 520px; margin-left: 21px;"><div data-drawio-colors="color: #000000; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: none; white-space: normal; overflow-wrap: normal;">style_17</div></div></div></foreignObject><text x="100" y="524" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">style_17</text></switch></g><path d="M 263 440 L 250.35 440 Q 240 440 240 450.35 L 240 589.65 Q 240 600 250.35 600 L 263 600" fill="#f0a30a" stroke="#bd7000" stroke-miterlimit="10" pointer-events="none"/><path d="M 263 600 L 389.65 600 Q 400 600 400 589.65 L 400 450.35 Q 400 440 389.65 440 L 263 440" fill="none" stroke="#bd7000" stroke-miterlimit="10" pointer-events="none"/><path d="M 263 440 L 263 600" fill="none" stroke="#bd7000" stroke-miterlimit="10" pointer-events="none"/><g transform="translate(-0.5 -0.5)rotate(-90 251.5 520)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 520px; margin-left: 173px;"><div data-drawio-colors="color: #000000; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: none; font-weight: bold; white-space: normal; overflow-wrap: normal;">style_18</div></div></div></foreignObject><text x="252" y="524" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle" font-weight="bold">style_18</text></switch></g><path d="M 618.38 462.86 L 618.38 600 L 460 600 L 460 440 L 595.76 440 Z" fill="#e3c800" stroke="#b09500" stroke-miterlimit="10" pointer-events="none"/><path d="M 595.76 440 C 597.6 445.35 594.57 450.86 587.68 454.69 L 620 464 Z" fill="#e3c800" stroke="#b09500" stroke-miterlimit="10" pointer-events="none"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 520px; margin-left: 461px;"><div data-drawio-colors="color: #000000; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: none; white-space: normal; overflow-wrap: normal;">style_19</div></div></div></foreignObject><text x="540" y="524" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">style_19</text></switch></g><path d="M 720 480 C 688 480 680 520 705.6 528 C 680 545.6 708.8 584 729.6 568 C 744 600 792 600 808 568 C 840 568 840 536 820 520 C 840 488 808 456 780 472 C 760 448 728 448 720 480 Z" fill="#6d8764" stroke="#3a5431" stroke-miterlimit="10" pointer-events="none"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 520px; margin-left: 681px;"><div data-drawio-colors="color: #ffffff; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(255, 255, 255); line-height: 1.2; pointer-events: none; white-space: normal; overflow-wrap: normal;">style_20</div></div></div></foreignObject><text x="760" y="524" fill="#ffffff" font-family="Helvetica" font-size="12px" text-anchor="middle">style_20</text></switch></g><path d="M 1058.38 462.86 L 1058.38 600 L 900 600 L 900 440 L 1035.76 440 Z" fill="#647687" stroke="#314354" stroke-miterlimit="10" pointer-events="none"/><path d="M 1035.76 440 C 1037.6 445.35 1034.57 450.86 1027.68 454.69 L 1060 464 Z" fill="#647687" stroke="#314354" stroke-miterlimit="10" pointer-events="none"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 520px; margin-left: 901px;"><div data-drawio-colors="color: #ffffff; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(255, 255, 255); line-height: 1.2; pointer-events: none; white-space: normal; overflow-wrap: normal;">style_21</div></div></div></foreignObject><text x="980" y="524" fill="#ffffff" font-family="Helvetica" font-size="12px" text-anchor="middle">style_21</text></switch></g><rect x="1125" y="500" width="150" height="40" fill="#76608a" stroke="none" pointer-events="none"/><path d="M 1125 500 M 1275 500 M 1275 540 M 1125 540" fill="none" stroke="#432d57" stroke-linecap="square" stroke-miterlimit="10" pointer-events="none"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe flex-start; width: 142px; height: 1px; padding-top: 520px; margin-left: 1133px;"><div data-drawio-colors="color: #ffffff; " style="box-sizing: border-box; font-size: 0px; text-align: left; max-height: 36px; overflow: hidden;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(255, 255, 255); line-height: 1.2; pointer-events: none; white-space: normal; overflow-wrap: normal;">style_22</div></div></div></foreignObject><text x="1133" y="524" fill="#ffffff" font-family="Helvetica" font-size="12px">style_22</text></switch></g><path d="M 1340 470 L 1500 470 L 1500 570 L 1340 570 Z" fill="#a0522d" stroke="#6d1f00" stroke-miterlimit="10" pointer-events="none"/><path d="M 1340 470 L 1420 520 L 1500 470" fill="none" stroke="#6d1f00" stroke-miterlimit="10" pointer-events="none"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 520px; margin-left: 1341px;"><div data-drawio-colors="color: #ffffff; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(255, 255, 255); line-height: 1.2; pointer-events: none; white-space: normal; overflow-wrap: normal;">style_23</div></div></div></foreignObject><text x="1420" y="524" fill="#ffffff" font-family="Helvetica" font-size="12px" text-anchor="middle">style_23</text></switch></g><path d="M 1560 470 L 1720 470 L 1720 570 L 1560 570 Z" fill="#fad7ac" stroke="#b46504" stroke-miterlimit="10" pointer-events="none"/><path d="M 1560 470 L 1640 520 L 1720 470" fill="none" stroke="#b46504" stroke-miterlimit="10" pointer-events="none"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 520px; margin-left: 1561px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: none; white-space: normal; overflow-wrap: normal;">style_24</div></div></div></foreignObject><text x="1640" y="524" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">style_24</text></switch></g><path d="M 25 710 L 43.6 687.68 Q 50 680 60 680 L 140 680 Q 150 680 156.4 687.68 L 193.6 732.32 Q 200 740 193.6 747.68 L 156.4 792.32 Q 150 800 140 800 L 60 800 Q 50 800 43.6 792.32 L 6.4 747.68 Q 0 740 6.4 732.32 Z" fill="#fad9d5" stroke="#ae4132" stroke-miterlimit="10" pointer-events="none"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 198px; height: 1px; padding-top: 740px; margin-left: 1px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: none; white-space: normal; overflow-wrap: normal;">style_25</div></div></div></foreignObject><text x="100" y="744" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">style_25</text></switch></g><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe flex-start; justify-content: unsafe flex-start; width: 98px; height: 1px; padding-top: 722px; margin-left: 272px;"><div data-drawio-colors="color: #ffffff; " style="box-sizing: border-box; font-size: 0px; text-align: left;"><div style="display: inline-block; font-size: 28px; font-family: Helvetica; color: rgb(255, 255, 255); line-height: 1.2; pointer-events: none; font-weight: bold; white-space: normal; overflow-wrap: normal;">style_26</div></div></div></foreignObject><text x="272" y="750" fill="#ffffff" font-family="Helvetica" font-size="28px" font-weight="bold">style_26</text></switch></g><rect x="440" y="680" width="200" height="120" rx="18" ry="18" fill="#b1ddf0" stroke="#10739e" pointer-events="none"/><path d="M 460 680 L 460 800 M 620 680 L 620 800" fill="none" stroke="#10739e" stroke-miterlimit="10" pointer-events="none"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 740px; margin-left: 461px;"><div data-drawio-colors="color: #000000; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: none; white-space: normal; overflow-wrap: normal;">style_27</div></div></div></foreignObject><text x="540" y="744" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">style_27</text></switch></g><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe flex-start; justify-content: unsafe flex-start; width: 98px; height: 1px; padding-top: 722px; margin-left: 712px;"><div data-drawio-colors="color: #ffffff; " style="box-sizing: border-box; font-size: 0px; text-align: left;"><div style="display: inline-block; font-size: 16px; font-family: Helvetica; color: rgb(255, 255, 255); line-height: 1.2; pointer-events: none; font-weight: bold; white-space: normal; overflow-wrap: normal;">style_28</div></div></div></foreignObject><text x="712" y="738" fill="#ffffff" font-family="Helvetica" font-size="16px" font-weight="bold">style_28</text></switch></g><path d="M 955.21 749.19 C 955.75 747.5 957.08 746.08 958.89 745.3 C 960.7 744.52 962.81 744.44 964.69 745.09 C 967.43 746.24 969.55 748.26 970.62 750.72 C 975.5 738.7 982.94 727.58 992.54 717.92 C 995.26 715.78 999.07 715 1002.61 715.87 C 1003.51 715.99 1004.28 716.51 1004.64 717.24 C 1005 717.96 1004.9 718.8 1004.38 719.45 C 991.34 732.2 981.64 747.24 975.95 763.54 C 972.59 765 968.64 765 965.28 763.54 C 962.75 758.67 959.35 754.17 955.21 750.21 C 955 749.89 955 749.5 955.21 749.19 Z" fill="#bac8d3" stroke="#23445d" stroke-miterlimit="10" pointer-events="none"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe flex-start; justify-content: unsafe center; width: 48px; height: 1px; padding-top: 772px; margin-left: 956px;"><div data-drawio-colors="color: #000000; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: none; white-space: normal; overflow-wrap: normal;">style_29</div></div></div></foreignObject><text x="980" y="784" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">style_29</text></switch></g><path d="M 1125 710 L 1143.6 687.68 Q 1150 680 1160 680 L 1240 680 Q 1250 680 1256.4 687.68 L 1293.6 732.32 Q 1300 740 1293.6 747.68 L 1256.4 792.32 Q 1250 800 1240 800 L 1160 800 Q 1150 800 1143.6 792.32 L 1106.4 747.68 Q 1100 740 1106.4 732.32 Z" fill="#f5f5f5" stroke="#666666" stroke-miterlimit="10" pointer-events="none"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 198px; height: 1px; padding-top: 740px; margin-left: 1101px;"><div data-drawio-colors="color: #000000; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: none; white-space: normal; overflow-wrap: normal;">style_30</div></div></div></foreignObject><text x="1200" y="744" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">style_30</text></switch></g><path d="M 1345 710 L 1363.6 687.68 Q 1370 680 1380 680 L 1460 680 Q 1470 680 1476.4 687.68 L 1513.6 732.32 Q 1520 740 1513.6 747.68 L 1476.4 792.32 Q 1470 800 1460 800 L 1380 800 Q 1370 800 1363.6 792.32 L 1326.4 747.68 Q 1320 740 1326.4 732.32 Z" fill="#dae8fc" stroke="#6c8ebf" stroke-miterlimit="10" pointer-events="none"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 198px; height: 1px; padding-top: 740px; margin-left: 1321px;"><div data-drawio-colors="color: #000000; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: none; white-space: normal; overflow-wrap: normal;">style_31</div></div></div></foreignObject><text x="1420" y="744" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">style_31</text></switch></g><path d="M 1590.02 776.93 C 1562.66 754.06 1560 716.37 1583.91 690.67 C 1607.83 664.96 1650.17 660.01 1680.83 679.33 C 1711.48 698.64 1720 735.64 1700.32 764.02 C 1680.64 792.39 1639.48 802.46 1606.1 787.06 C 1598.59 806.13 1586.49 818.25 1573.2 820 C 1581.56 809.51 1587.51 794.26 1590.02 776.93 Z" fill="#d5e8d4" stroke="#82b366" stroke-miterlimit="15" pointer-events="none"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 740px; margin-left: 1561px;"><div data-drawio-colors="color: #000000; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: none; white-space: normal; overflow-wrap: normal;">style_32</div></div></div></foreignObject><text x="1640" y="744" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">style_32</text></switch></g><ellipse cx="100" cy="960" rx="80" ry="80" fill="#ffcd28" stroke="#d79b00" pointer-events="none"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 960px; margin-left: 21px;"><div data-drawio-colors="color: #000000; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: none; white-space: normal; overflow-wrap: normal;">style_33</div></div></div></foreignObject><text x="100" y="964" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">style_33</text></switch></g><path d="M 245 930 L 263.6 907.68 Q 270 900 280 900 L 360 900 Q 370 900 376.4 907.68 L 413.6 952.32 Q 420 960 413.6 967.68 L 376.4 1012.32 Q 370 1020 360 1020 L 280 1020 Q 270 1020 263.6 1012.32 L 226.4 967.68 Q 220 960 226.4 952.32 Z" fill="#fff2cc" stroke="#d6b656" stroke-miterlimit="10" pointer-events="none"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 198px; height: 1px; padding-top: 960px; margin-left: 221px;"><div data-drawio-colors="color: #000000; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: none; white-space: normal; overflow-wrap: normal;">style_34</div></div></div></foreignObject><text x="320" y="964" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">style_34</text></switch></g><path d="M 460 945 L 460 910 Q 460 900 470 900 L 610 900 Q 620 900 620 910 L 620 980 Q 620 990 610 990 L 570 990 Q 560 990 554.45 998.32 L 540 1020 L 540 1000 Q 540 990 530 990 L 470 990 Q 460 990 460 980 Z" fill="#f8cecc" stroke="#b85450" stroke-miterlimit="10" pointer-events="none"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 945px; margin-left: 461px;"><div data-drawio-colors="color: #000000; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: none; white-space: normal; overflow-wrap: normal;">style_35</div></div></div></foreignObject><text x="540" y="949" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">style_35</text></switch></g><path d="M 840 903 L 840 890.35 Q 840 880 829.65 880 L 690.35 880 Q 680 880 680 890.35 L 680 903" fill="#e6d0de" stroke="#996185" stroke-miterlimit="10" pointer-events="none"/><path d="M 680 903 L 680 1029.65 Q 680 1040 690.35 1040 L 829.65 1040 Q 840 1040 840 1029.65 L 840 903" fill="none" stroke="#996185" stroke-miterlimit="10" pointer-events="none"/><path d="M 680 903 L 840 903" fill="none" stroke="#996185" stroke-miterlimit="10" pointer-events="none"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 892px; margin-left: 681px;"><div data-drawio-colors="color: #000000; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: none; font-weight: bold; white-space: normal; overflow-wrap: normal;">style_36</div></div></div></foreignObject><text x="760" y="895" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle" font-weight="bold">style_36</text></switch></g><path d="M 922.5 1005 L 905 1005 C 902.24 1005 900 1002.76 900 1000 L 900 905 C 900 902.24 902.24 900 905 900 L 1055 900 C 1057.76 900 1060 902.24 1060 905 L 1060 1000 C 1060 1002.76 1057.76 1005 1055 1005 L 937.5 1005 C 934.54 1012.77 925.79 1018.6 915 1020 C 918.89 1017.15 921.68 1011.57 922.5 1005 Z" fill="#eeeeee" stroke="#36393d" stroke-miterlimit="10" pointer-events="none"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 953px; margin-left: 901px;"><div data-drawio-colors="color: #000000; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: none; white-space: normal; overflow-wrap: normal;">style_37</div></div></div></foreignObject><text x="980" y="956" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">style_37</text></switch></g><path d="M 1125 930 L 1143.6 907.68 Q 1150 900 1160 900 L 1240 900 Q 1250 900 1256.4 907.68 L 1293.6 952.32 Q 1300 960 1293.6 967.68 L 1256.4 1012.32 Q 1250 1020 1240 1020 L 1160 1020 Q 1150 1020 1143.6 1012.32 L 1106.4 967.68 Q 1100 960 1106.4 952.32 Z" fill="#f9f7ed" stroke="#36393d" stroke-miterlimit="10" pointer-events="none"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 198px; height: 1px; padding-top: 960px; margin-left: 1101px;"><div data-drawio-colors="color: #000000; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: none; white-space: normal; overflow-wrap: normal;">style_38</div></div></div></foreignObject><text x="1200" y="964" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">style_38</text></switch></g><path d="M 1500 903 L 1500 890.35 Q 1500 880 1489.65 880 L 1350.35 880 Q 1340 880 1340 890.35 L 1340 903" fill="#ffcc99" stroke="#36393d" stroke-miterlimit="10" pointer-events="none"/><path d="M 1340 903 L 1340 1029.65 Q 1340 1040 1350.35 1040 L 1489.65 1040 Q 1500 1040 1500 1029.65 L 1500 903" fill="none" stroke="#36393d" stroke-miterlimit="10" pointer-events="none"/><path d="M 1340 903 L 1500 903" fill="none" stroke="#36393d" stroke-miterlimit="10" pointer-events="none"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 892px; margin-left: 1341px;"><div data-drawio-colors="color: #000000; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: none; font-weight: bold; white-space: normal; overflow-wrap: normal;">style_39</div></div></div></foreignObject><text x="1420" y="895" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle" font-weight="bold">style_39</text></switch></g><rect x="1540" y="940" width="200" height="40" fill="#cce5ff" stroke="none" pointer-events="none"/><path d="M 1540 940 M 1740 940 M 1740 980 L 1540 980" fill="none" stroke="#36393d" stroke-linecap="square" stroke-miterlimit="10" pointer-events="none"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 198px; height: 1px; padding-top: 960px; margin-left: 1541px;"><div data-drawio-colors="color: #000000; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: none; white-space: normal; overflow-wrap: normal;">style_40</div></div></div></foreignObject><text x="1640" y="964" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">style_40</text></switch></g><path d="M 7.96 1120 C 3.57 1120 0 1122.6 0 1125.8 C 0 1127.55 1.1 1129.21 2.97 1130.32 C 1.09 1131.41 0 1133.08 0 1134.83 C 0 1136.59 1.1 1138.25 2.97 1139.35 C 1.09 1140.45 0 1142.11 0 1143.86 C 0 1145.62 1.1 1147.28 2.97 1148.38 C 1.09 1149.48 0 1151.14 0 1152.9 C 0 1154.65 1.1 1156.32 2.97 1157.42 C 1.09 1158.51 0 1160.18 0 1161.93 C 0 1163.69 1.1 1165.35 2.97 1166.45 C 1.09 1167.55 0 1169.21 0 1170.97 C 0 1172.72 1.1 1174.38 2.97 1175.48 C 1.09 1176.58 0 1178.24 0 1180 C 0 1181.76 1.1 1183.42 2.97 1184.51 C 1.09 1185.61 0 1187.28 0 1189.03 C 0 1190.79 1.1 1192.45 2.97 1193.55 C 1.09 1194.65 0 1196.31 0 1198.07 C 0 1199.82 1.1 1201.48 2.97 1202.58 C 1.09 1203.68 0 1205.34 0 1207.1 C 0 1208.86 1.1 1210.52 2.97 1211.61 C 1.09 1212.72 0 1214.38 0 1216.13 C 0 1217.89 1.1 1219.55 2.97 1220.65 C 1.09 1221.74 0 1223.41 0 1225.17 C 0 1226.92 1.1 1228.58 2.97 1229.68 C 1.09 1230.78 0 1232.45 0 1234.2 C 0 1237.4 3.57 1240 7.96 1240 C 10.62 1240 13.12 1239.03 14.59 1237.41 C 16.06 1239.03 18.55 1240 21.22 1240 C 23.84 1240 26.3 1239.05 27.79 1237.48 C 29.27 1239.05 31.72 1240 34.35 1240 C 36.97 1240 39.43 1239.05 40.91 1237.48 C 42.39 1239.05 44.85 1240 47.47 1240 C 50.1 1240 52.55 1239.05 54.04 1237.48 C 55.52 1239.05 57.97 1240 60.6 1240 C 63.23 1240 65.68 1239.05 67.17 1237.48 C 68.65 1239.05 71.1 1240 73.73 1240 C 76.35 1240 78.81 1239.05 80.3 1237.48 C 81.78 1239.05 84.23 1240 86.85 1240 C 89.48 1240 91.94 1239.05 93.42 1237.48 C 94.91 1239.05 97.36 1240 99.98 1240 C 102.61 1240 105.06 1239.05 106.55 1237.48 C 108.04 1239.05 110.48 1240 113.11 1240 C 115.73 1240 118.2 1239.05 119.68 1237.48 C 121.16 1239.05 123.61 1240 126.24 1240 C 128.86 1240 131.33 1239.05 132.8 1237.48 C 134.29 1239.05 136.75 1240 139.36 1240 C 142 1240 144.45 1239.05 145.93 1237.48 C 147.42 1239.05 149.87 1240 152.5 1240 C 155.12 1240 157.58 1239.05 159.06 1237.48 C 160.54 1239.05 163 1240 165.62 1240 C 168.25 1240 170.71 1239.05 172.18 1237.48 C 173.67 1239.05 176.13 1240 178.75 1240 C 181.42 1240 183.92 1239.01 185.4 1237.39 C 186.86 1239.02 189.36 1240 192.04 1240 C 196.43 1240 200 1237.4 200 1234.2 C 200 1232.45 198.91 1230.79 197.03 1229.68 C 198.91 1228.59 200 1226.92 200 1225.17 C 200 1223.41 198.91 1221.75 197.03 1220.65 C 198.91 1219.55 200 1217.89 200 1216.13 C 200 1214.38 198.91 1212.72 197.03 1211.62 C 198.91 1210.52 200 1208.86 200 1207.1 C 200 1205.35 198.91 1203.69 197.03 1202.58 C 198.91 1201.49 200 1199.82 200 1198.07 C 200 1196.31 198.91 1194.65 197.03 1193.55 C 198.91 1192.45 200 1190.79 200 1189.03 C 200 1187.28 198.91 1185.62 197.03 1184.52 C 198.91 1183.42 200 1181.76 200 1180 C 200 1178.25 198.91 1176.58 197.03 1175.49 C 198.91 1174.38 200 1172.72 200 1170.97 C 200 1169.21 198.91 1167.55 197.03 1166.45 C 198.91 1165.35 200 1163.69 200 1161.93 C 200 1160.18 198.91 1158.52 197.03 1157.42 C 198.91 1156.32 200 1154.66 200 1152.9 C 200 1151.14 198.91 1149.48 197.03 1148.39 C 198.91 1147.28 200 1145.62 200 1143.86 C 200 1142.11 198.91 1140.45 197.03 1139.35 C 198.91 1138.25 200 1136.59 200 1134.83 C 200 1133.08 198.91 1131.42 197.03 1130.32 C 198.91 1129.22 200 1127.55 200 1125.8 C 200 1122.6 196.43 1120 192.04 1120 C 189.37 1120 186.86 1120.99 185.4 1122.61 C 183.93 1120.98 181.42 1120 178.75 1120 C 176.12 1120 173.66 1120.95 172.18 1122.52 C 170.7 1120.95 168.24 1120 165.62 1120 C 162.99 1120 160.53 1120.95 159.05 1122.52 C 157.57 1120.95 155.11 1120 152.5 1120 C 149.86 1120 147.41 1120.95 145.92 1122.52 C 144.44 1120.95 141.99 1120 139.36 1120 C 136.74 1120 134.28 1120.95 132.79 1122.52 C 131.32 1120.95 128.86 1120 126.24 1120 C 123.61 1120 121.15 1120.95 119.67 1122.52 C 118.19 1120.95 115.73 1120 113.11 1120 C 110.48 1120 108.03 1120.95 106.54 1122.52 C 105.06 1120.95 102.61 1120 99.98 1120 C 97.36 1120 94.9 1120.95 93.41 1122.52 C 91.94 1120.95 89.48 1120 86.85 1120 C 84.23 1120 81.77 1120.95 80.29 1122.52 C 78.81 1120.95 76.35 1120 73.73 1120 C 71.1 1120 68.65 1120.95 67.16 1122.52 C 65.67 1120.95 63.23 1120 60.6 1120 C 57.97 1120 55.52 1120.95 54.03 1122.52 C 52.55 1120.95 50.1 1120 47.47 1120 C 44.85 1120 42.39 1120.95 40.91 1122.52 C 39.42 1120.95 36.97 1120 34.35 1120 C 31.72 1120 29.26 1120.95 27.78 1122.52 C 26.29 1120.95 23.84 1120 21.22 1120 C 18.55 1120 16.06 1120.97 14.59 1122.59 C 13.12 1120.97 10.62 1120 7.96 1120 Z" fill="#ffff88" stroke="#36393d" stroke-miterlimit="10" pointer-events="none"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 198px; height: 1px; padding-top: 1180px; margin-left: 1px;"><div data-drawio-colors="color: #000000; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: none; white-space: normal; overflow-wrap: normal;">style_41</div></div></div></foreignObject><text x="100" y="1184" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">style_41</text></switch></g><path d="M 240 1100 L 370 1100 L 400 1130 L 400 1260 L 240 1260 L 240 1100 Z" fill="#cdeb8b" stroke="#36393d" stroke-miterlimit="10" pointer-events="none"/><path d="M 370 1100 L 370 1130 L 400 1130" fill="none" stroke="#36393d" stroke-miterlimit="10" pointer-events="none"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 1180px; margin-left: 241px;"><div data-drawio-colors="color: #000000; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: none; white-space: normal; overflow-wrap: normal;">style_42</div></div></div></foreignObject><text x="320" y="1184" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">style_42</text></switch></g><path d="M 500 1140 C 468 1140 460 1180 485.6 1188 C 460 1205.6 488.8 1244 509.6 1228 C 524 1260 572 1260 588 1228 C 620 1228 620 1196 600 1180 C 620 1148 588 1116 560 1132 C 540 1108 508 1108 500 1140 Z" fill="#ffcccc" stroke="#36393d" stroke-miterlimit="10" pointer-events="none"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 1180px; margin-left: 461px;"><div data-drawio-colors="color: #000000; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: none; white-space: normal; overflow-wrap: normal;">style_43</div></div></div></foreignObject><text x="540" y="1184" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">style_43</text></switch></g></g><switch><g requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"/><a transform="translate(0,-5)" xlink:href="https://www.diagrams.net/doc/faq/svg-export-text-problems" target="_blank"><text text-anchor="middle" font-size="10px" x="50%" y="100%">Text is not SVG - cannot display</text></a></switch></svg>

data/lib/drawio_dsl/configuration_shapes.rb CHANGED Viewed

@@ -42,6 +42,7 @@ module DrawioDsl
       :square,
       :step,
       :tick,
+      :todo,
       :face,
       :triangle,
       :embed_row,
@@ -78,8 +79,8 @@ module DrawioDsl
         document: ShapeDefaults.new(type: :document, x: 0, text_only: false, y: 0, w: 160, h: 160, style_modifiers: 'shape=mxgraph.basic.document'),
         ellipse: ShapeDefaults.new(type: :ellipse, x: 0, text_only: false, y: 0, w: 200, h: 120, style_modifiers: 'ellipse'),
         hexagon: ShapeDefaults.new(type: :hexagon, x: 0, text_only: false, y: 0, w: 200, h: 120, style_modifiers: 'shape=hexagon'),
-        interface: ShapeDefaults.new(type: :interface, x: 0, text_only: false, y: 0, w: 200, h: 120, style_modifiers: 'align=left;overflow=fill;fontSize=12;fontFamily=Helvetica'),
-        klass: ShapeDefaults.new(type: :klass, x: 0, text_only: false, y: 0, w: 200, h: 120, style_modifiers: 'align=left;overflow=fill;fontSize=12;fontFamily=Helvetica'),
+        interface: ShapeDefaults.new(type: :interface, x: 0, text_only: false, y: 0, w: 160, h: 160, style_modifiers: 'align=left;overflow=fill;fontSize=12;fontFamily=Helvetica'),
+        klass: ShapeDefaults.new(type: :klass, x: 0, text_only: false, y: 0, w: 160, h: 160, style_modifiers: 'align=left;overflow=fill;fontSize=12;fontFamily=Helvetica'),
         note: ShapeDefaults.new(type: :note, x: 0, text_only: false, y: 0, w: 160, h: 160, style_modifiers: 'shape=note'),
         process: ShapeDefaults.new(type: :process, x: 0, text_only: false, y: 0, w: 200, h: 120, style_modifiers: 'shape=process'),
         rectangle: ShapeDefaults.new(type: :rectangle, x: 0, text_only: false, y: 0, w: 200, h: 120, style_modifiers: ''),
@@ -87,6 +88,7 @@ module DrawioDsl
         square: ShapeDefaults.new(type: :square, x: 0, text_only: false, y: 0, w: 160, h: 160, style_modifiers: ''),
         step: ShapeDefaults.new(type: :step, x: 0, text_only: false, y: 0, w: 120, h: 80, style_modifiers: 'shape=step;perimeter=stepPerimeter;fixedSize=1'),
         tick: ShapeDefaults.new(type: :tick, x: 0, text_only: false, y: 0, w: 50, h: 50, style_modifiers: 'verticalLabelPosition=bottom;verticalAlign=top;shape=mxgraph.basic.tick'),
+        todo: ShapeDefaults.new(type: :todo, x: 0, text_only: false, y: 0, w: 300, h: 60, style_modifiers: ''),
         face: ShapeDefaults.new(type: :face, x: 0, text_only: false, y: 0, w: 100, h: 100, style_modifiers: 'verticalLabelPosition=bottom;verticalAlign=top;shape=mxgraph.basic.smiley'),
         triangle: ShapeDefaults.new(type: :triangle, x: 0, text_only: false, y: 0, w: 100, h: 100, style_modifiers: 'triangle'),
         embed_row: ShapeDefaults.new(type: :embed_row, x: 0, text_only: false, y: 0, w: 200, h: 40, style_modifiers: 'shape=partialRectangle;collapsible=0;dropTarget=0;pointerEvents=0;top=0;left=0;bottom=1;right=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest'),

data/lib/drawio_dsl/dom_builder_shapes.rb CHANGED Viewed

@@ -174,6 +174,11 @@ module DrawioDsl
       add_shape(tick)
     end
+    def add_todo(**opts, &block)
+      todo = DrawioDsl::Schema::Todo.new(current_page, **opts, &block)
+      add_shape(todo)
+    end
     def add_face(**opts, &block)
       face = DrawioDsl::Schema::Face.new(current_page, **opts, &block)
       add_shape(face)

data/lib/drawio_dsl/drawio_shapes.rb CHANGED Viewed

@@ -5,7 +5,7 @@ module DrawioDsl
   # :nocov:
   module DrawioShapes
     def random(**opts)
-      case rand(39)
+      case rand(40)
       when 0
         h1(**opts)
       when 1
@@ -75,14 +75,16 @@ module DrawioDsl
       when 33
         tick(**opts)
       when 34
-        face(**opts)
+        todo(**opts)
       when 35
-        triangle(**opts)
+        face(**opts)
       when 36
-        embed_row(**opts)
+        triangle(**opts)
       when 37
-        embed_col50(**opts)
+        embed_row(**opts)
       when 38
+        embed_col50(**opts)
+      when 39
         embed_col200(**opts)
       end
     end
@@ -223,6 +225,10 @@ module DrawioDsl
       builder.add_tick(**opts, &block)
     end
+    def todo(**opts, &block)
+      builder.add_todo(**opts, &block)
+    end
     def face(**opts, &block)
       builder.add_face(**opts, &block)
     end

data/lib/drawio_dsl/formatters/factory.rb CHANGED Viewed

@@ -9,11 +9,12 @@ module DrawioDsl
       include KLog::Logging
       FORMATTERS = {
-        class: DrawioDsl::Formatters::KlassFormatter,
+        klass: DrawioDsl::Formatters::KlassFormatter,
+        class: DrawioDsl::Formatters::KlassFormatter, # alias for klass
         interface: DrawioDsl::Formatters::InterfaceFormatter
       }.freeze
-      def format(type)
+      def format_instance(type)
         unless FORMATTERS.key?(type)
           log.error "Unknown formatter type: #{type}"
           @formatter = nil

data/lib/drawio_dsl/schema/_.rb CHANGED Viewed

@@ -46,6 +46,7 @@ require_relative 'shapes/rectangle2'
 require_relative 'shapes/square'
 require_relative 'shapes/step'
 require_relative 'shapes/tick'
+require_relative 'shapes/todo'
 require_relative 'shapes/face'
 require_relative 'shapes/triangle'
 require_relative 'shapes/embed_row'

data/lib/drawio_dsl/schema/shapes/shape.rb CHANGED Viewed

@@ -7,17 +7,17 @@ module DrawioDsl
       include DrawioDsl::Formatters::Factory
       class << self
+        attr_reader :shape_key
         attr_reader :shape_defaults
-        def configure_shape(name)
-          unless KConfig.configuration.drawio.shapes.members.include?(name)
-            puts "Shape #{name} not found in configuration"
+        def configure_shape(key)
+          unless KConfig.configuration.drawio.shapes.members.include?(key)
+            puts "Shape #{key} not found in configuration"
             return
           end
-          config = KConfig.configuration.drawio.shapes[name]
-          @shape_defaults = config.clone
+          @shape_key = key
+          @shape_defaults = KConfig.configuration.drawio.shapes[key].clone
         end
       end
@@ -89,6 +89,11 @@ module DrawioDsl
         @font_color       = args[:font_color]       || theme_palette.font_color
       end
+      def format(type = nil)
+        type ||= self.class.shape_key
+        format_instance(type)
+      end
       def style
         key_values = []
         key_values << "whiteSpace=#{white_space}"         if white_space

data/lib/drawio_dsl/schema/shapes/todo.rb ADDED Viewed

@@ -0,0 +1,9 @@
+# frozen_string_literal: true
+module DrawioDsl
+  module Schema
+    class Todo < Shape
+      configure_shape(:todo)
+    end
+  end
+end

data/lib/drawio_dsl/version.rb CHANGED Viewed

@@ -1,5 +1,5 @@
 # frozen_string_literal: true
 module DrawioDsl
-  VERSION = '0.7.0'
+  VERSION = '0.8.0'
 end

data/package-lock.json CHANGED Viewed

@@ -1,12 +1,12 @@
 {
   "name": "drawio_dsl",
-  "version": "0.7.0",
+  "version": "0.8.0",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
     "": {
       "name": "drawio_dsl",
-      "version": "0.7.0",
+      "version": "0.8.0",
       "devDependencies": {
         "@klueless-js/semantic-release-rubygem": "github:klueless-js/semantic-release-rubygem",
         "@semantic-release/changelog": "^6.0.1",

data/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "drawio_dsl",
-  "version": "0.7.0",
+  "version": "0.8.0",
   "description": "DrawIO DSL can build DrawIO diagrams using a Domain Specific Language",
   "scripts": {
     "release": "semantic-release"

metadata CHANGED Viewed

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: drawio_dsl
 version: !ruby/object:Gem::Version
-  version: 0.7.0
+  version: 0.8.0
 platform: ruby
 authors:
 - David Cruwys
 autorequire:
 bindir: exe
 cert_chain: []
-date: 2022-03-14 00:00:00.000000000 Z
+date: 2022-03-15 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: k_config
@@ -273,6 +273,7 @@ files:
 - docs/samples/grid-alignment.svg
 - docs/samples/grid-direction-horizontal.svg
 - docs/samples/grid-direction-vertical.svg
+- docs/samples/html-shapes.svg
 - docs/samples/samples.md
 - docs/samples/samples.svg
 - docs/samples/styles-glass.svg
@@ -353,6 +354,7 @@ files:
 - lib/drawio_dsl/schema/shapes/square.rb
 - lib/drawio_dsl/schema/shapes/step.rb
 - lib/drawio_dsl/schema/shapes/tick.rb
+- lib/drawio_dsl/schema/shapes/todo.rb
 - lib/drawio_dsl/schema/shapes/triangle.rb
 - lib/drawio_dsl/schema/virtual/anchor.rb
 - lib/drawio_dsl/version.rb