drawio_dsl 0.8.6 → 0.8.7

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 (15) hide show
  1. checksums.yaml +4 -4
  2. data/.builders/generators/project-plan.rb +2 -1
  3. data/.builders/generators/sample_diagrams/30-html-shapes.rb +36 -14
  4. data/CHANGELOG.md +7 -0
  5. data/docs/project-plan/project.drawio +57 -54
  6. data/docs/project-plan/project_done.svg +1 -1
  7. data/docs/project-plan/project_in_progress.svg +1 -1
  8. data/lib/drawio_dsl/formatters/base_formatter.rb +120 -0
  9. data/lib/drawio_dsl/formatters/html_builder.rb +39 -0
  10. data/lib/drawio_dsl/formatters/interface_formatter.rb +13 -1
  11. data/lib/drawio_dsl/formatters/klass_formatter.rb +13 -1
  12. data/lib/drawio_dsl/version.rb +1 -1
  13. data/package-lock.json +2 -2
  14. data/package.json +1 -1
  15. metadata +1 -1
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: db2a5ce1b5ea291cf4b2044123d747842b63cd60bc10286d528dd1bedb721486
4
- data.tar.gz: 0eeeaebc648ff1a169ef79e09e85f5c72d38c3a2d20f7970ac72d465658efd3c
3
+ metadata.gz: e9bd123bfd12d1585315106ad7da29026c7f7fe8137d3d74ee1612386aa96aa8
4
+ data.tar.gz: a3dfad4e5749f729b8a4f6c2bbe15c73ea8f9464e90c697b790aa565b91b21d9
5
5
  SHA512:
6
- metadata.gz: 5f89d67ab45ba7bc906b47aa605f9a71dceff627af5c40f0b0f0c91f9166a74a3ff0bf36151956e3ed0a2677ede8109c0e90935b5ef9b5fad7d8e1366c0ced65
7
- data.tar.gz: bf776aae738f636103d2ba681f03532522889e1d45ccb74b3a9ea3ecfb432d83e43ed61897d59c74b8bee702793c541e3851a9070f63ed24c46920a5577f19c6
6
+ metadata.gz: ecbc43bd935618b728d11486cdefaaea4a3469657167c54dbdab1f1197c5663aa8aba35d9a7846da72b5029a2d22a1e65e08dbb737f4750be5794d647c428422
7
+ data.tar.gz: 331794e0651248ce977855ebc89f10c34c6909bec0b0c00152fbddf1b03714c349785df3c10905ac2cabd4fc80fba709871105c1a2c1b613bd4a29f772c6b489
data/.builders/generators/project-plan.rb CHANGED
@@ -11,7 +11,7 @@ KManager.action :project_plan do
11
11
 
12
12
  grid_layout(y: 90, direction: :horizontal, grid_h: 80, grid_w: 320, wrap_at: 3, grid: 0)
13
13
 
14
- todo(title: 'class html builder to support include/extend modules, class methods and regular html nodes such as p, h1.. ul, li')
14
+ todo(title: 'class html builder to support include/extend modules, class methods')
15
15
  todo(title: 'add new shapes related to line connectors')
16
16
  todo(title: 'line connector aliases gives a simple way to use predefined line configurations')
17
17
  todo(title: 'line connectors need to support autolinking using ids')
@@ -46,6 +46,7 @@ KManager.action :project_plan do
46
46
 
47
47
  grid_layout(y:90, direction: :horizontal, grid_h: 80, grid_w: 320, wrap_at: 3, grid: 0)
48
48
 
49
+ todo(title: 'class html formatter to support regular html nodes such as p, h1.. ul, li that are found on the builder')
49
50
  todo(title: 'group box, like a regular box but with a top aligned h1 style title')
50
51
  todo(title: 'build a domain (class) diagram')
51
52
  todo(title: 'build configuration for line strokes %i[dashed dotted dashdot dashdotdot dotdotdot longdash)')
data/.builders/generators/sample_diagrams/30-html-shapes.rb CHANGED
@@ -8,20 +8,6 @@ KManager.action :html_shapes do
8
8
  .page('Style-Plain', margin_left: 0, margin_top: 0, rounded: 0, background: '#FFEADB') do
9
9
  grid_layout(wrap_at: 8)
10
10
 
11
- # html = DrawioDsl::Formatters::KlassFormatter.new
12
- # .header('IPerson')
13
- # .field(:first_name, type: :string)
14
- # .field(:last_name, type: :string)
15
- # .field(:age, type: :integer)
16
- # .field(:birthday, type: :date)
17
- # .method(:full_name)
18
- # .method(:sean)
19
- # .as_html
20
-
21
- # square(title: html,
22
- # style_modifiers: 'align=left;overflow=fill;fontSize=12;fontFamily=Helvetica'
23
- # )
24
-
25
11
  interface(theme: :style_07) do
26
12
  format
27
13
  .header('IPerson')
@@ -39,6 +25,42 @@ KManager.action :html_shapes do
39
25
  .field(:birthday, type: :date)
40
26
  .method(:full_name, type: :string)
41
27
  end
28
+
29
+ klass(h: 280) do
30
+ format
31
+ .header('Custom HTML')
32
+ .p('David')
33
+ .b('Cruwys')
34
+ .hr
35
+ .h1('h1')
36
+ .h2('h2')
37
+ .h3('h3')
38
+ .h4('h4')
39
+ .h5('h5')
40
+ .h6('h6')
41
+ .ul_s
42
+ .li('li')
43
+ .li('li')
44
+ .ul_e
45
+ end
46
+
47
+ interface(theme: :style_07, h: 280) do
48
+ format
49
+ .header('ICustom HTML')
50
+ .p('David')
51
+ .b('Cruwys')
52
+ .hr
53
+ .h1('h1')
54
+ .h2('h2')
55
+ .h3('h3')
56
+ .h4('h4')
57
+ .h5('h5')
58
+ .h6('h6')
59
+ .ul_s
60
+ .li('li')
61
+ .li('li')
62
+ .ul_e
63
+ end
42
64
  end
43
65
  .cd(:spec)
44
66
  .osave('.samples/30-html-shapes.drawio')
data/CHANGELOG.md CHANGED
@@ -1,3 +1,10 @@
1
+ ## [0.8.6](https://github.com/klueless-io/drawio_dsl/compare/v0.8.5...v0.8.6) (2022-03-20)
2
+
3
+
4
+ ### Bug Fixes
5
+
6
+ * group box, like a regular box but with a top aligned h1 style title ([282c7e8](https://github.com/klueless-io/drawio_dsl/commit/282c7e8ab8c932082ba9d6914b34767163f1e5e3))
7
+
1
8
  ## [0.8.5](https://github.com/klueless-io/drawio_dsl/compare/v0.8.4...v0.8.5) (2022-03-20)
2
9
 
3
10
 
data/docs/project-plan/project.drawio CHANGED
@@ -1,157 +1,160 @@
1
- <mxfile host="0Vh">
2
- <diagram id="Ut4" name="In progress">
1
+ <mxfile host="4gY">
2
+ <diagram id="FdY" name="In progress">
3
3
  <mxGraphModel dx="0" dy="0" background="#FFFACD" grid="0" gridSize="10" guides="1" tooltips="1" connect="1" arrows="1" fold="1" page="1" pageScale="1" pageWidth="1169" pageHeight="827" math="0" shadow="0">
4
4
  <root>
5
- <mxCell id="page_root_Ut4" parent="Ut4"/>
6
- <mxCell id="node_root_Ut4" parent="page_root_Ut4"/>
7
- <mxCell id="Ut4-2" value="class html builder to support include/extend modules, class methods and regular html nodes such as p, h1.. ul, li" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#d5e8d4;strokeColor=#82b366;fontColor=#333333" vertex="1" parent="node_root_Ut4">
5
+ <mxCell id="page_root_FdY" parent="FdY"/>
6
+ <mxCell id="node_root_FdY" parent="page_root_FdY"/>
7
+ <mxCell id="FdY-2" value="class html builder to support include/extend modules, class methods" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#d5e8d4;strokeColor=#82b366;fontColor=#333333" vertex="1" parent="node_root_FdY">
8
8
  <mxGeometry x="10" y="10" width="300" height="60" as="geometry"/>
9
9
  </mxCell>
10
- <mxCell id="Ut4-3" value="add new shapes related to line connectors" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#d5e8d4;strokeColor=#82b366;fontColor=#333333" vertex="1" parent="node_root_Ut4">
10
+ <mxCell id="FdY-3" value="add new shapes related to line connectors" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#d5e8d4;strokeColor=#82b366;fontColor=#333333" vertex="1" parent="node_root_FdY">
11
11
  <mxGeometry x="330" y="10" width="300" height="60" as="geometry"/>
12
12
  </mxCell>
13
- <mxCell id="Ut4-4" value="line connector aliases gives a simple way to use predefined line configurations" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#d5e8d4;strokeColor=#82b366;fontColor=#333333" vertex="1" parent="node_root_Ut4">
13
+ <mxCell id="FdY-4" value="line connector aliases gives a simple way to use predefined line configurations" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#d5e8d4;strokeColor=#82b366;fontColor=#333333" vertex="1" parent="node_root_FdY">
14
14
  <mxGeometry x="650" y="10" width="300" height="60" as="geometry"/>
15
15
  </mxCell>
16
- <mxCell id="Ut4-5" value="line connectors need to support autolinking using ids" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#d5e8d4;strokeColor=#82b366;fontColor=#333333" vertex="1" parent="node_root_Ut4">
16
+ <mxCell id="FdY-5" value="line connectors need to support autolinking using ids" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#d5e8d4;strokeColor=#82b366;fontColor=#333333" vertex="1" parent="node_root_FdY">
17
17
  <mxGeometry x="10" y="90" width="300" height="60" as="geometry"/>
18
18
  </mxCell>
19
- <mxCell id="Ut4-6" value="line connectors should not effect the grid positioning systems" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#d5e8d4;strokeColor=#82b366;fontColor=#333333" vertex="1" parent="node_root_Ut4">
19
+ <mxCell id="FdY-6" value="line connectors should not effect the grid positioning systems" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#d5e8d4;strokeColor=#82b366;fontColor=#333333" vertex="1" parent="node_root_FdY">
20
20
  <mxGeometry x="330" y="90" width="300" height="60" as="geometry"/>
21
21
  </mxCell>
22
- <mxCell id="Ut4-7" value="export diagram json for use with a different DSL builder" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#d5e8d4;strokeColor=#82b366;fontColor=#333333" vertex="1" parent="node_root_Ut4">
22
+ <mxCell id="FdY-7" value="export diagram json for use with a different DSL builder" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#d5e8d4;strokeColor=#82b366;fontColor=#333333" vertex="1" parent="node_root_FdY">
23
23
  <mxGeometry x="650" y="90" width="300" height="60" as="geometry"/>
24
24
  </mxCell>
25
25
  </root>
26
26
  </mxGraphModel>
27
27
  </diagram>
28
- <diagram id="ALG" name="To Do">
28
+ <diagram id="tHC" name="To Do">
29
29
  <mxGraphModel dx="0" dy="0" background="#FFFACD" grid="0" gridSize="10" guides="1" tooltips="1" connect="1" arrows="1" fold="1" page="1" pageScale="1" pageWidth="1169" pageHeight="827" math="0" shadow="0">
30
30
  <root>
31
- <mxCell id="page_root_ALG" parent="ALG"/>
32
- <mxCell id="node_root_ALG" parent="page_root_ALG"/>
33
- <mxCell id="ALG-2" value="add page background to theme, use it whenever the theme is set at a diagram/page level" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#dae8fc;strokeColor=#6c8ebf;fontColor=#333333" vertex="1" parent="node_root_ALG">
31
+ <mxCell id="page_root_tHC" parent="tHC"/>
32
+ <mxCell id="node_root_tHC" parent="page_root_tHC"/>
33
+ <mxCell id="tHC-2" value="add page background to theme, use it whenever the theme is set at a diagram/page level" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#dae8fc;strokeColor=#6c8ebf;fontColor=#333333" vertex="1" parent="node_root_tHC">
34
34
  <mxGeometry x="10" y="10" width="300" height="60" as="geometry"/>
35
35
  </mxCell>
36
- <mxCell id="ALG-3" value="move DrawioDsl::Formatters::Factory::FORMATTERS to resource file" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#dae8fc;strokeColor=#6c8ebf;fontColor=#333333" vertex="1" parent="node_root_ALG">
36
+ <mxCell id="tHC-3" value="move DrawioDsl::Formatters::Factory::FORMATTERS to resource file" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#dae8fc;strokeColor=#6c8ebf;fontColor=#333333" vertex="1" parent="node_root_tHC">
37
37
  <mxGeometry x="330" y="10" width="300" height="60" as="geometry"/>
38
38
  </mxCell>
39
- <mxCell id="ALG-4" value="move DrawioDsl::Formatters::StyleBuilder::MAPPINGS to resource file" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#dae8fc;strokeColor=#6c8ebf;fontColor=#333333" vertex="1" parent="node_root_ALG">
39
+ <mxCell id="tHC-4" value="move DrawioDsl::Formatters::StyleBuilder::MAPPINGS to resource file" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#dae8fc;strokeColor=#6c8ebf;fontColor=#333333" vertex="1" parent="node_root_tHC">
40
40
  <mxGeometry x="650" y="10" width="300" height="60" as="geometry"/>
41
41
  </mxCell>
42
- <mxCell id="ALG-5" value="settings style attributes need to de-duplicate, might be best to utilize the new StyleBuilder class" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#dae8fc;strokeColor=#6c8ebf;fontColor=#333333" vertex="1" parent="node_root_ALG">
42
+ <mxCell id="tHC-5" value="settings style attributes need to de-duplicate, might be best to utilize the new StyleBuilder class" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#dae8fc;strokeColor=#6c8ebf;fontColor=#333333" vertex="1" parent="node_root_tHC">
43
43
  <mxGeometry x="10" y="90" width="300" height="60" as="geometry"/>
44
44
  </mxCell>
45
- <mxCell id="ALG-6" value="write SVG directly into other projects" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#dae8fc;strokeColor=#6c8ebf;fontColor=#333333" vertex="1" parent="node_root_ALG">
45
+ <mxCell id="tHC-6" value="write SVG directly into other projects" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#dae8fc;strokeColor=#6c8ebf;fontColor=#333333" vertex="1" parent="node_root_tHC">
46
46
  <mxGeometry x="330" y="90" width="300" height="60" as="geometry"/>
47
47
  </mxCell>
48
- <mxCell id="ALG-7" value="add :shape, :line and :text to random shape generator, note: you can see the issue in the samples/20-styled-shapes.rb where the text is not rendered" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#dae8fc;strokeColor=#6c8ebf;fontColor=#333333" vertex="1" parent="node_root_ALG">
48
+ <mxCell id="tHC-7" value="add :shape, :line and :text to random shape generator, note: you can see the issue in the samples/20-styled-shapes.rb where the text is not rendered" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#dae8fc;strokeColor=#6c8ebf;fontColor=#333333" vertex="1" parent="node_root_tHC">
49
49
  <mxGeometry x="650" y="90" width="300" height="60" as="geometry"/>
50
50
  </mxCell>
51
- <mxCell id="ALG-8" value="Nodes need to support child nodes" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#dae8fc;strokeColor=#6c8ebf;fontColor=#333333" vertex="1" parent="node_root_ALG">
51
+ <mxCell id="tHC-8" value="Nodes need to support child nodes" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#dae8fc;strokeColor=#6c8ebf;fontColor=#333333" vertex="1" parent="node_root_tHC">
52
52
  <mxGeometry x="10" y="170" width="300" height="60" as="geometry"/>
53
53
  </mxCell>
54
- <mxCell id="ALG-9" value="Grid layout does not position itself in relation to the last element" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#dae8fc;strokeColor=#6c8ebf;fontColor=#333333" vertex="1" parent="node_root_ALG">
54
+ <mxCell id="tHC-9" value="Grid layout does not position itself in relation to the last element" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#dae8fc;strokeColor=#6c8ebf;fontColor=#333333" vertex="1" parent="node_root_tHC">
55
55
  <mxGeometry x="330" y="170" width="300" height="60" as="geometry"/>
56
56
  </mxCell>
57
- <mxCell id="ALG-10" value="Dynamic sized shapes that expand to the size of their text" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#dae8fc;strokeColor=#6c8ebf;fontColor=#333333" vertex="1" parent="node_root_ALG">
57
+ <mxCell id="tHC-10" value="Dynamic sized shapes that expand to the size of their text" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#dae8fc;strokeColor=#6c8ebf;fontColor=#333333" vertex="1" parent="node_root_tHC">
58
58
  <mxGeometry x="650" y="170" width="300" height="60" as="geometry"/>
59
59
  </mxCell>
60
- <mxCell id="ALG-11" value="Control of text padding left, right, top and bottom" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#dae8fc;strokeColor=#6c8ebf;fontColor=#333333" vertex="1" parent="node_root_ALG">
60
+ <mxCell id="tHC-11" value="Control of text padding left, right, top and bottom" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#dae8fc;strokeColor=#6c8ebf;fontColor=#333333" vertex="1" parent="node_root_tHC">
61
61
  <mxGeometry x="10" y="250" width="300" height="60" as="geometry"/>
62
62
  </mxCell>
63
- <mxCell id="ALG-12" value="Improve the theme control over text-only shapes" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#dae8fc;strokeColor=#6c8ebf;fontColor=#333333" vertex="1" parent="node_root_ALG">
63
+ <mxCell id="tHC-12" value="Improve the theme control over text-only shapes" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#dae8fc;strokeColor=#6c8ebf;fontColor=#333333" vertex="1" parent="node_root_tHC">
64
64
  <mxGeometry x="330" y="250" width="300" height="60" as="geometry"/>
65
65
  </mxCell>
66
- <mxCell id="ALG-13" value="x,y settings do not work for shapes within a grid layout" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#dae8fc;strokeColor=#6c8ebf;fontColor=#333333" vertex="1" parent="node_root_ALG">
66
+ <mxCell id="tHC-13" value="x,y settings do not work for shapes within a grid layout" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#dae8fc;strokeColor=#6c8ebf;fontColor=#333333" vertex="1" parent="node_root_tHC">
67
67
  <mxGeometry x="650" y="250" width="300" height="60" as="geometry"/>
68
68
  </mxCell>
69
- <mxCell id="ALG-14" value="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" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#dae8fc;strokeColor=#6c8ebf;fontColor=#333333" vertex="1" parent="node_root_ALG">
69
+ <mxCell id="tHC-14" value="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" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#dae8fc;strokeColor=#6c8ebf;fontColor=#333333" vertex="1" parent="node_root_tHC">
70
70
  <mxGeometry x="10" y="330" width="300" height="60" as="geometry"/>
71
71
  </mxCell>
72
72
  </root>
73
73
  </mxGraphModel>
74
74
  </diagram>
75
- <diagram id="oeR" name="Done">
75
+ <diagram id="NF8" name="Done">
76
76
  <mxGraphModel dx="0" dy="0" background="#FFFACD" grid="0" gridSize="10" guides="1" tooltips="1" connect="1" arrows="1" fold="1" page="1" pageScale="1" pageWidth="1169" pageHeight="827" math="0" shadow="0">
77
77
  <root>
78
- <mxCell id="page_root_oeR" parent="oeR"/>
79
- <mxCell id="node_root_oeR" parent="page_root_oeR"/>
80
- <mxCell id="oeR-2" value="group box, like a regular box but with a top aligned h1 style title" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#f8cecc;strokeColor=#b85450;fontColor=#333333" vertex="1" parent="node_root_oeR">
78
+ <mxCell id="page_root_NF8" parent="NF8"/>
79
+ <mxCell id="node_root_NF8" parent="page_root_NF8"/>
80
+ <mxCell id="NF8-2" value="class html formatter to support regular html nodes such as p, h1.. ul, li that are found on the builder" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#f8cecc;strokeColor=#b85450;fontColor=#333333" vertex="1" parent="node_root_NF8">
81
81
  <mxGeometry x="10" y="10" width="300" height="60" as="geometry"/>
82
82
  </mxCell>
83
- <mxCell id="oeR-3" value="build a domain (class) diagram" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#f8cecc;strokeColor=#b85450;fontColor=#333333" vertex="1" parent="node_root_oeR">
83
+ <mxCell id="NF8-3" value="group box, like a regular box but with a top aligned h1 style title" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#f8cecc;strokeColor=#b85450;fontColor=#333333" vertex="1" parent="node_root_NF8">
84
84
  <mxGeometry x="330" y="10" width="300" height="60" as="geometry"/>
85
85
  </mxCell>
86
- <mxCell id="oeR-4" value="build configuration for line strokes %i[dashed dotted dashdot dashdotdot dotdotdot longdash)" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#f8cecc;strokeColor=#b85450;fontColor=#333333" vertex="1" parent="node_root_oeR">
86
+ <mxCell id="NF8-4" value="build a domain (class) diagram" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#f8cecc;strokeColor=#b85450;fontColor=#333333" vertex="1" parent="node_root_NF8">
87
87
  <mxGeometry x="650" y="10" width="300" height="60" as="geometry"/>
88
88
  </mxCell>
89
- <mxCell id="oeR-5" value="build configuration for line compass %i[n ne e se s sw w nw]" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#f8cecc;strokeColor=#b85450;fontColor=#333333" vertex="1" parent="node_root_oeR">
89
+ <mxCell id="NF8-5" value="build configuration for line strokes %i[dashed dotted dashdot dashdotdot dotdotdot longdash)" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#f8cecc;strokeColor=#b85450;fontColor=#333333" vertex="1" parent="node_root_NF8">
90
90
  <mxGeometry x="10" y="90" width="300" height="60" as="geometry"/>
91
91
  </mxCell>
92
- <mxCell id="oeR-6" value="build configuration for line shape %i[style1 style2 style3 style4]" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#f8cecc;strokeColor=#b85450;fontColor=#333333" vertex="1" parent="node_root_oeR">
92
+ <mxCell id="NF8-6" value="build configuration for line compass %i[n ne e se s sw w nw]" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#f8cecc;strokeColor=#b85450;fontColor=#333333" vertex="1" parent="node_root_NF8">
93
93
  <mxGeometry x="330" y="90" width="300" height="60" as="geometry"/>
94
94
  </mxCell>
95
- <mxCell id="oeR-7" value="build configuration for arrows %i[straight triangle diamond circle cross short default none plain skewed_dash concave er_many er_one er_one_optional er_one_mandatory er_many_optional er_many_mandatory]" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#f8cecc;strokeColor=#b85450;fontColor=#333333" vertex="1" parent="node_root_oeR">
95
+ <mxCell id="NF8-7" value="build configuration for line shape %i[style1 style2 style3 style4]" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#f8cecc;strokeColor=#b85450;fontColor=#333333" vertex="1" parent="node_root_NF8">
96
96
  <mxGeometry x="650" y="90" width="300" height="60" as="geometry"/>
97
97
  </mxCell>
98
- <mxCell id="oeR-8" value="refactor the shape-&gt;text_only (boolean) to category (symbol)" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#f8cecc;strokeColor=#b85450;fontColor=#333333" vertex="1" parent="node_root_oeR">
98
+ <mxCell id="NF8-8" value="build configuration for arrows %i[straight triangle diamond circle cross short default none plain skewed_dash concave er_many er_one er_one_optional er_one_mandatory er_many_optional er_many_mandatory]" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#f8cecc;strokeColor=#b85450;fontColor=#333333" vertex="1" parent="node_root_NF8">
99
99
  <mxGeometry x="10" y="170" width="300" height="60" as="geometry"/>
100
100
  </mxCell>
101
- <mxCell id="oeR-9" value="ensure that ids are working as expected" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#f8cecc;strokeColor=#b85450;fontColor=#333333" vertex="1" parent="node_root_oeR">
101
+ <mxCell id="NF8-9" value="refactor the shape-&gt;text_only (boolean) to category (symbol)" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#f8cecc;strokeColor=#b85450;fontColor=#333333" vertex="1" parent="node_root_NF8">
102
102
  <mxGeometry x="330" y="170" width="300" height="60" as="geometry"/>
103
103
  </mxCell>
104
- <mxCell id="oeR-10" value="alter the initial parameter of all shapes so that it can be an ID, without named attribute" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#f8cecc;strokeColor=#b85450;fontColor=#333333" vertex="1" parent="node_root_oeR">
104
+ <mxCell id="NF8-10" value="ensure that ids are working as expected" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#f8cecc;strokeColor=#b85450;fontColor=#333333" vertex="1" parent="node_root_NF8">
105
105
  <mxGeometry x="650" y="170" width="300" height="60" as="geometry"/>
106
106
  </mxCell>
107
- <mxCell id="oeR-11" value="move project-plan files" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#f8cecc;strokeColor=#b85450;fontColor=#333333" vertex="1" parent="node_root_oeR">
107
+ <mxCell id="NF8-11" value="alter the initial parameter of all shapes so that it can be an ID, without named attribute" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#f8cecc;strokeColor=#b85450;fontColor=#333333" vertex="1" parent="node_root_NF8">
108
108
  <mxGeometry x="10" y="250" width="300" height="60" as="geometry"/>
109
109
  </mxCell>
110
- <mxCell id="oeR-12" value="alter configure_shape so it sets the default shape key and use that for selecting the default HTML formatter" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#f8cecc;strokeColor=#b85450;fontColor=#333333" vertex="1" parent="node_root_oeR">
110
+ <mxCell id="NF8-12" value="move project-plan files" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#f8cecc;strokeColor=#b85450;fontColor=#333333" vertex="1" parent="node_root_NF8">
111
111
  <mxGeometry x="330" y="250" width="300" height="60" as="geometry"/>
112
112
  </mxCell>
113
- <mxCell id="oeR-13" value="add todo shape to simplify project plan drawing" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#f8cecc;strokeColor=#b85450;fontColor=#333333" vertex="1" parent="node_root_oeR">
113
+ <mxCell id="NF8-13" value="alter configure_shape so it sets the default shape key and use that for selecting the default HTML formatter" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#f8cecc;strokeColor=#b85450;fontColor=#333333" vertex="1" parent="node_root_NF8">
114
114
  <mxGeometry x="650" y="250" width="300" height="60" as="geometry"/>
115
115
  </mxCell>
116
- <mxCell id="oeR-14" value="introduce .value property to shape and let it use either formatted HTML or plain text title" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#f8cecc;strokeColor=#b85450;fontColor=#333333" vertex="1" parent="node_root_oeR">
116
+ <mxCell id="NF8-14" value="add todo shape to simplify project plan drawing" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#f8cecc;strokeColor=#b85450;fontColor=#333333" vertex="1" parent="node_root_NF8">
117
117
  <mxGeometry x="10" y="330" width="300" height="60" as="geometry"/>
118
118
  </mxCell>
119
- <mxCell id="oeR-15" value="formatter DSL that can render HTML directly into the value property" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#f8cecc;strokeColor=#b85450;fontColor=#333333" vertex="1" parent="node_root_oeR">
119
+ <mxCell id="NF8-15" value="introduce .value property to shape and let it use either formatted HTML or plain text title" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#f8cecc;strokeColor=#b85450;fontColor=#333333" vertex="1" parent="node_root_NF8">
120
120
  <mxGeometry x="330" y="330" width="300" height="60" as="geometry"/>
121
121
  </mxCell>
122
- <mxCell id="oeR-16" value="formatter DSL for class and interface generation" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#f8cecc;strokeColor=#b85450;fontColor=#333333" vertex="1" parent="node_root_oeR">
122
+ <mxCell id="NF8-16" value="formatter DSL that can render HTML directly into the value property" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#f8cecc;strokeColor=#b85450;fontColor=#333333" vertex="1" parent="node_root_NF8">
123
123
  <mxGeometry x="650" y="330" width="300" height="60" as="geometry"/>
124
124
  </mxCell>
125
- <mxCell id="oeR-17" value="generate extension based graphics based on drawio extensions.js" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#f8cecc;strokeColor=#b85450;fontColor=#333333" vertex="1" parent="node_root_oeR">
125
+ <mxCell id="NF8-17" value="formatter DSL for class and interface generation" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#f8cecc;strokeColor=#b85450;fontColor=#333333" vertex="1" parent="node_root_NF8">
126
126
  <mxGeometry x="10" y="410" width="300" height="60" as="geometry"/>
127
127
  </mxCell>
128
- <mxCell id="oeR-18" value="active? flag on page defaulting to true. set to false to exclude page from diagram." style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#f8cecc;strokeColor=#b85450;fontColor=#333333" vertex="1" parent="node_root_oeR">
128
+ <mxCell id="NF8-18" value="generate extension based graphics based on drawio extensions.js" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#f8cecc;strokeColor=#b85450;fontColor=#333333" vertex="1" parent="node_root_NF8">
129
129
  <mxGeometry x="330" y="410" width="300" height="60" as="geometry"/>
130
130
  </mxCell>
131
- <mxCell id="oeR-19" value="first level child nodes need to hang of node 1" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#f8cecc;strokeColor=#b85450;fontColor=#333333" vertex="1" parent="node_root_oeR">
131
+ <mxCell id="NF8-19" value="active? flag on page defaulting to true. set to false to exclude page from diagram." style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#f8cecc;strokeColor=#b85450;fontColor=#333333" vertex="1" parent="node_root_NF8">
132
132
  <mxGeometry x="650" y="410" width="300" height="60" as="geometry"/>
133
133
  </mxCell>
134
- <mxCell id="oeR-20" value="node has child nodes and add_node will set a nodes parent" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#f8cecc;strokeColor=#b85450;fontColor=#333333" vertex="1" parent="node_root_oeR">
134
+ <mxCell id="NF8-20" value="first level child nodes need to hang of node 1" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#f8cecc;strokeColor=#b85450;fontColor=#333333" vertex="1" parent="node_root_NF8">
135
135
  <mxGeometry x="10" y="490" width="300" height="60" as="geometry"/>
136
136
  </mxCell>
137
- <mxCell id="oeR-21" value="nodes can belong to a parent node, the top level node responds with truthy to root?" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#f8cecc;strokeColor=#b85450;fontColor=#333333" vertex="1" parent="node_root_oeR">
137
+ <mxCell id="NF8-21" value="node has child nodes and add_node will set a nodes parent" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#f8cecc;strokeColor=#b85450;fontColor=#333333" vertex="1" parent="node_root_NF8">
138
138
  <mxGeometry x="330" y="490" width="300" height="60" as="geometry"/>
139
139
  </mxCell>
140
- <mxCell id="oeR-22" value="add sample diagram for the github readme file" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#f8cecc;strokeColor=#b85450;fontColor=#333333" vertex="1" parent="node_root_oeR">
140
+ <mxCell id="NF8-22" value="nodes can belong to a parent node, the top level node responds with truthy to root?" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#f8cecc;strokeColor=#b85450;fontColor=#333333" vertex="1" parent="node_root_NF8">
141
141
  <mxGeometry x="650" y="490" width="300" height="60" as="geometry"/>
142
142
  </mxCell>
143
- <mxCell id="oeR-23" value="write samples into docs folder and display in readme" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#f8cecc;strokeColor=#b85450;fontColor=#333333" vertex="1" parent="node_root_oeR">
143
+ <mxCell id="NF8-23" value="add sample diagram for the github readme file" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#f8cecc;strokeColor=#b85450;fontColor=#333333" vertex="1" parent="node_root_NF8">
144
144
  <mxGeometry x="10" y="570" width="300" height="60" as="geometry"/>
145
145
  </mxCell>
146
- <mxCell id="oeR-24" value="add export as .PNG, needs to take a page number as the PNG will not support multiple pages" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#f8cecc;strokeColor=#b85450;fontColor=#333333" vertex="1" parent="node_root_oeR">
146
+ <mxCell id="NF8-24" value="write samples into docs folder and display in readme" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#f8cecc;strokeColor=#b85450;fontColor=#333333" vertex="1" parent="node_root_NF8">
147
147
  <mxGeometry x="330" y="570" width="300" height="60" as="geometry"/>
148
148
  </mxCell>
149
- <mxCell id="oeR-25" value="add export as .SVG, needs to take a page number as the SVG will not support multiple pages" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#f8cecc;strokeColor=#b85450;fontColor=#333333" vertex="1" parent="node_root_oeR">
149
+ <mxCell id="NF8-25" value="add export as .PNG, needs to take a page number as the PNG will not support multiple pages" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#f8cecc;strokeColor=#b85450;fontColor=#333333" vertex="1" parent="node_root_NF8">
150
150
  <mxGeometry x="650" y="570" width="300" height="60" as="geometry"/>
151
151
  </mxCell>
152
- <mxCell id="oeR-26" value="add save as .drawio" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#f8cecc;strokeColor=#b85450;fontColor=#333333" vertex="1" parent="node_root_oeR">
152
+ <mxCell id="NF8-26" value="add export as .SVG, needs to take a page number as the SVG will not support multiple pages" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#f8cecc;strokeColor=#b85450;fontColor=#333333" vertex="1" parent="node_root_NF8">
153
153
  <mxGeometry x="10" y="650" width="300" height="60" as="geometry"/>
154
154
  </mxCell>
155
+ <mxCell id="NF8-27" value="add save as .drawio" style="whiteSpace=wrap;html=1;rounded=1;glass=1;fillColor=#f8cecc;strokeColor=#b85450;fontColor=#333333" vertex="1" parent="node_root_NF8">
156
+ <mxGeometry x="330" y="650" width="300" height="60" as="geometry"/>
157
+ </mxCell>
155
158
  </root>
156
159
  </mxGraphModel>
157
160
  </diagram>
data/docs/project-plan/project_done.svg CHANGED
@@ -1,3 +1,3 @@
1
1
  <?xml version="1.0" encoding="UTF-8"?>
2
2
  <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
3
- <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="942px" height="702px" viewBox="-0.5 -0.5 942 702"><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;">group box, like a regular box but with a top aligned h1 style title</div></div></div></foreignObject><text x="150" y="34" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">group box, like a regular box but with a top align...</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;">build a domain (class) diagram</div></div></div></foreignObject><text x="470" y="34" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">build a domain (class) diagram</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;">build configuration for line strokes %i[dashed dotted dashdot dashdotdot dotdotdot longdash)</div></div></div></foreignObject><text x="790" y="34" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">build configuration for line strokes %i[dashed dot...</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;">build configuration for line compass %i[n ne e se s sw w nw]</div></div></div></foreignObject><text x="150" y="114" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">build configuration for line compass %i[n ne e se...</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;">build configuration for line shape %i[style1 style2 style3 style4]</div></div></div></foreignObject><text x="470" y="114" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">build configuration for line shape %i[style1 style...</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;">build configuration for arrows %i[straight triangle diamond circle cross short default none plain skewed_dash concave er_many er_one er_one_optional er_one_mandatory er_many_optional er_many_mandatory]</div></div></div></foreignObject><text x="790" y="114" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">build configuration for arrows %i[straight triangl...</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;">refactor the shape-&gt;text_only (boolean) to category (symbol)</div></div></div></foreignObject><text x="150" y="194" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">refactor the shape-&gt;text_only (boolean) to categor...</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;">ensure that ids are working as expected</div></div></div></foreignObject><text x="470" y="194" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">ensure that ids are working as expected</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;">alter the initial parameter of all shapes so that it can be an ID, without named attribute</div></div></div></foreignObject><text x="790" y="194" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">alter the initial parameter of all shapes so that...</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;">move project-plan files</div></div></div></foreignObject><text x="150" y="274" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">move project-plan files</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;">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="470" y="274" 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="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;">add todo shape to simplify project plan drawing</div></div></div></foreignObject><text x="790" y="274" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">add todo shape to simplify project plan drawing</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;">introduce .value property to shape and let it use either formatted HTML or plain text title</div></div></div></foreignObject><text x="150" y="354" 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="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;">formatter DSL that can render HTML directly into the value property</div></div></div></foreignObject><text x="470" y="354" 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="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;">formatter DSL for class and interface generation</div></div></div></foreignObject><text x="790" y="354" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">formatter DSL for class and interface generation</text></switch></g><rect x="0" y="400" width="300" height="60" rx="9" ry="9" fill="#f8cecc" stroke="#b85450" pointer-events="all"/><path d="M 10.15 399 Q -1 399 -1 410.15 L -1 424 Q 150 442 301 424 L 301 410.15 Q 301 399 289.85 399 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: 430px; 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="434" 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="400" width="300" height="60" rx="9" ry="9" fill="#f8cecc" stroke="#b85450" pointer-events="all"/><path d="M 330.15 399 Q 319 399 319 410.15 L 319 424 Q 470 442 621 424 L 621 410.15 Q 621 399 609.85 399 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: 430px; 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="434" 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="400" width="300" height="60" rx="9" ry="9" fill="#f8cecc" stroke="#b85450" pointer-events="all"/><path d="M 650.15 399 Q 639 399 639 410.15 L 639 424 Q 790 442 941 424 L 941 410.15 Q 941 399 929.85 399 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: 430px; 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="434" 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="480" width="300" height="60" rx="9" ry="9" fill="#f8cecc" stroke="#b85450" pointer-events="all"/><path d="M 10.15 479 Q -1 479 -1 490.15 L -1 504 Q 150 522 301 504 L 301 490.15 Q 301 479 289.85 479 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: 510px; 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="514" 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="480" width="300" height="60" rx="9" ry="9" fill="#f8cecc" stroke="#b85450" pointer-events="all"/><path d="M 330.15 479 Q 319 479 319 490.15 L 319 504 Q 470 522 621 504 L 621 490.15 Q 621 479 609.85 479 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: 510px; 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="514" 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="480" width="300" height="60" rx="9" ry="9" fill="#f8cecc" stroke="#b85450" pointer-events="all"/><path d="M 650.15 479 Q 639 479 639 490.15 L 639 504 Q 790 522 941 504 L 941 490.15 Q 941 479 929.85 479 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: 510px; 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="514" 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="560" width="300" height="60" rx="9" ry="9" fill="#f8cecc" stroke="#b85450" pointer-events="all"/><path d="M 10.15 559 Q -1 559 -1 570.15 L -1 584 Q 150 602 301 584 L 301 570.15 Q 301 559 289.85 559 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: 590px; 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="594" 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="560" width="300" height="60" rx="9" ry="9" fill="#f8cecc" stroke="#b85450" pointer-events="all"/><path d="M 330.15 559 Q 319 559 319 570.15 L 319 584 Q 470 602 621 584 L 621 570.15 Q 621 559 609.85 559 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: 590px; 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="594" 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="560" width="300" height="60" rx="9" ry="9" fill="#f8cecc" stroke="#b85450" pointer-events="all"/><path d="M 650.15 559 Q 639 559 639 570.15 L 639 584 Q 790 602 941 584 L 941 570.15 Q 941 559 929.85 559 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: 590px; 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="594" 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="640" width="300" height="60" rx="9" ry="9" fill="#f8cecc" stroke="#b85450" pointer-events="all"/><path d="M 10.15 639 Q -1 639 -1 650.15 L -1 664 Q 150 682 301 664 L 301 650.15 Q 301 639 289.85 639 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: 670px; 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="674" 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>
3
+ <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="942px" height="702px" viewBox="-0.5 -0.5 942 702"><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;">class html formatter to support regular html nodes such as p, h1.. ul, li that are found on the builder</div></div></div></foreignObject><text x="150" y="34" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">class html formatter to support regular html nodes...</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;">group box, like a regular box but with a top aligned h1 style title</div></div></div></foreignObject><text x="470" y="34" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">group box, like a regular box but with a top align...</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;">build a domain (class) diagram</div></div></div></foreignObject><text x="790" y="34" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">build a domain (class) diagram</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;">build configuration for line strokes %i[dashed dotted dashdot dashdotdot dotdotdot longdash)</div></div></div></foreignObject><text x="150" y="114" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">build configuration for line strokes %i[dashed dot...</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;">build configuration for line compass %i[n ne e se s sw w nw]</div></div></div></foreignObject><text x="470" y="114" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">build configuration for line compass %i[n ne e se...</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;">build configuration for line shape %i[style1 style2 style3 style4]</div></div></div></foreignObject><text x="790" y="114" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">build configuration for line shape %i[style1 style...</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;">build configuration for arrows %i[straight triangle diamond circle cross short default none plain skewed_dash concave er_many er_one er_one_optional er_one_mandatory er_many_optional er_many_mandatory]</div></div></div></foreignObject><text x="150" y="194" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">build configuration for arrows %i[straight triangl...</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;">refactor the shape-&gt;text_only (boolean) to category (symbol)</div></div></div></foreignObject><text x="470" y="194" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">refactor the shape-&gt;text_only (boolean) to categor...</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;">ensure that ids are working as expected</div></div></div></foreignObject><text x="790" y="194" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">ensure that ids are working as expected</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;">alter the initial parameter of all shapes so that it can be an ID, without named attribute</div></div></div></foreignObject><text x="150" y="274" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">alter the initial parameter of all shapes so that...</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;">move project-plan files</div></div></div></foreignObject><text x="470" y="274" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">move project-plan files</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;">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="790" y="274" 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="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 todo shape to simplify project plan drawing</div></div></div></foreignObject><text x="150" y="354" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">add todo shape to simplify project plan drawing</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;">introduce .value property to shape and let it use either formatted HTML or plain text title</div></div></div></foreignObject><text x="470" y="354" 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="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;">formatter DSL that can render HTML directly into the value property</div></div></div></foreignObject><text x="790" y="354" 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="0" y="400" width="300" height="60" rx="9" ry="9" fill="#f8cecc" stroke="#b85450" pointer-events="all"/><path d="M 10.15 399 Q -1 399 -1 410.15 L -1 424 Q 150 442 301 424 L 301 410.15 Q 301 399 289.85 399 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: 430px; 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 for class and interface generation</div></div></div></foreignObject><text x="150" y="434" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">formatter DSL for class and interface generation</text></switch></g><rect x="320" y="400" width="300" height="60" rx="9" ry="9" fill="#f8cecc" stroke="#b85450" pointer-events="all"/><path d="M 330.15 399 Q 319 399 319 410.15 L 319 424 Q 470 442 621 424 L 621 410.15 Q 621 399 609.85 399 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: 430px; 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;">generate extension based graphics based on drawio extensions.js</div></div></div></foreignObject><text x="470" y="434" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">generate extension based graphics based on drawio...</text></switch></g><rect x="640" y="400" width="300" height="60" rx="9" ry="9" fill="#f8cecc" stroke="#b85450" pointer-events="all"/><path d="M 650.15 399 Q 639 399 639 410.15 L 639 424 Q 790 442 941 424 L 941 410.15 Q 941 399 929.85 399 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: 430px; 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;">active? flag on page defaulting to true. set to false to exclude page from diagram.</div></div></div></foreignObject><text x="790" y="434" 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="0" y="480" width="300" height="60" rx="9" ry="9" fill="#f8cecc" stroke="#b85450" pointer-events="all"/><path d="M 10.15 479 Q -1 479 -1 490.15 L -1 504 Q 150 522 301 504 L 301 490.15 Q 301 479 289.85 479 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: 510px; 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;">first level child nodes need to hang of node 1</div></div></div></foreignObject><text x="150" y="514" 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="320" y="480" width="300" height="60" rx="9" ry="9" fill="#f8cecc" stroke="#b85450" pointer-events="all"/><path d="M 330.15 479 Q 319 479 319 490.15 L 319 504 Q 470 522 621 504 L 621 490.15 Q 621 479 609.85 479 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: 510px; 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;">node has child nodes and add_node will set a nodes parent</div></div></div></foreignObject><text x="470" y="514" 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="640" y="480" width="300" height="60" rx="9" ry="9" fill="#f8cecc" stroke="#b85450" pointer-events="all"/><path d="M 650.15 479 Q 639 479 639 490.15 L 639 504 Q 790 522 941 504 L 941 490.15 Q 941 479 929.85 479 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: 510px; 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 can belong to a parent node, the top level node responds with truthy to root?</div></div></div></foreignObject><text x="790" y="514" 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="0" y="560" width="300" height="60" rx="9" ry="9" fill="#f8cecc" stroke="#b85450" pointer-events="all"/><path d="M 10.15 559 Q -1 559 -1 570.15 L -1 584 Q 150 602 301 584 L 301 570.15 Q 301 559 289.85 559 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: 590px; 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 sample diagram for the github readme file</div></div></div></foreignObject><text x="150" y="594" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">add sample diagram for the github readme file</text></switch></g><rect x="320" y="560" width="300" height="60" rx="9" ry="9" fill="#f8cecc" stroke="#b85450" pointer-events="all"/><path d="M 330.15 559 Q 319 559 319 570.15 L 319 584 Q 470 602 621 584 L 621 570.15 Q 621 559 609.85 559 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: 590px; 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;">write samples into docs folder and display in readme</div></div></div></foreignObject><text x="470" y="594" 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="640" y="560" width="300" height="60" rx="9" ry="9" fill="#f8cecc" stroke="#b85450" pointer-events="all"/><path d="M 650.15 559 Q 639 559 639 570.15 L 639 584 Q 790 602 941 584 L 941 570.15 Q 941 559 929.85 559 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: 590px; 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 .PNG, needs to take a page number as the PNG will not support multiple pages</div></div></div></foreignObject><text x="790" y="594" 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="0" y="640" width="300" height="60" rx="9" ry="9" fill="#f8cecc" stroke="#b85450" pointer-events="all"/><path d="M 10.15 639 Q -1 639 -1 650.15 L -1 664 Q 150 682 301 664 L 301 650.15 Q 301 639 289.85 639 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: 670px; 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 .SVG, needs to take a page number as the SVG will not support multiple pages</div></div></div></foreignObject><text x="150" y="674" 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="320" y="640" width="300" height="60" rx="9" ry="9" fill="#f8cecc" stroke="#b85450" pointer-events="all"/><path d="M 330.15 639 Q 319 639 319 650.15 L 319 664 Q 470 682 621 664 L 621 650.15 Q 621 639 609.85 639 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: 670px; 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 save as .drawio</div></div></div></foreignObject><text x="470" y="674" 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-plan/project_in_progress.svg CHANGED
@@ -1,3 +1,3 @@
1
1
  <?xml version="1.0" encoding="UTF-8"?>
2
2
  <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
3
- <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="942px" height="142px" viewBox="-0.5 -0.5 942 142"><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;">class html builder to support include/extend modules, class methods and regular html nodes such as p, h1.. ul, li</div></div></div></foreignObject><text x="150" y="34" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">class html builder to support include/extend modul...</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;">add new shapes related to line connectors</div></div></div></foreignObject><text x="470" y="34" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">add new shapes related to line connectors</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;">line connector aliases gives a simple way to use predefined line configurations</div></div></div></foreignObject><text x="790" y="34" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">line connector aliases gives a simple way to use p...</text></switch></g><rect x="0" y="80" width="300" height="60" rx="9" ry="9" fill="#d5e8d4" stroke="#82b366" 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;">line connectors need to support autolinking using ids</div></div></div></foreignObject><text x="150" y="114" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">line connectors need to support autolinking using...</text></switch></g><rect x="320" y="80" width="300" height="60" rx="9" ry="9" fill="#d5e8d4" stroke="#82b366" 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;">line connectors should not effect the grid positioning systems</div></div></div></foreignObject><text x="470" y="114" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">line connectors should not effect the grid positio...</text></switch></g><rect x="640" y="80" width="300" height="60" rx="9" ry="9" fill="#d5e8d4" stroke="#82b366" 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;">export diagram json for use with a different DSL builder</div></div></div></foreignObject><text x="790" y="114" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">export diagram json for use with a different DSL b...</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>
3
+ <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="942px" height="142px" viewBox="-0.5 -0.5 942 142"><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;">class html builder to support include/extend modules, class methods</div></div></div></foreignObject><text x="150" y="34" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">class html builder to support include/extend modul...</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;">add new shapes related to line connectors</div></div></div></foreignObject><text x="470" y="34" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">add new shapes related to line connectors</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;">line connector aliases gives a simple way to use predefined line configurations</div></div></div></foreignObject><text x="790" y="34" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">line connector aliases gives a simple way to use p...</text></switch></g><rect x="0" y="80" width="300" height="60" rx="9" ry="9" fill="#d5e8d4" stroke="#82b366" 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;">line connectors need to support autolinking using ids</div></div></div></foreignObject><text x="150" y="114" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">line connectors need to support autolinking using...</text></switch></g><rect x="320" y="80" width="300" height="60" rx="9" ry="9" fill="#d5e8d4" stroke="#82b366" 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;">line connectors should not effect the grid positioning systems</div></div></div></foreignObject><text x="470" y="114" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">line connectors should not effect the grid positio...</text></switch></g><rect x="640" y="80" width="300" height="60" rx="9" ry="9" fill="#d5e8d4" stroke="#82b366" 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;">export diagram json for use with a different DSL builder</div></div></div></foreignObject><text x="790" y="114" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">export diagram json for use with a different DSL b...</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/formatters/base_formatter.rb CHANGED
@@ -12,6 +12,78 @@ module DrawioDsl
12
12
  @html = DrawioDsl::Formatters::HtmlBuilder.new(element_style_defaults)
13
13
  end
14
14
 
15
+ def hr(size: 1)
16
+ html.hr(size: size)
17
+
18
+ self
19
+ end
20
+
21
+ def b(content, **opts)
22
+ html.b(content, **opts)
23
+
24
+ self
25
+ end
26
+
27
+ def p(content, **opts)
28
+ html.p(content, **opts)
29
+
30
+ self
31
+ end
32
+
33
+ def h1(content, **opts)
34
+ html.h1(content, **opts)
35
+
36
+ self
37
+ end
38
+
39
+ def h2(content, **opts)
40
+ html.h2(content, **opts)
41
+
42
+ self
43
+ end
44
+
45
+ def h3(content, **opts)
46
+ html.h3(content, **opts)
47
+
48
+ self
49
+ end
50
+
51
+ def h4(content, **opts)
52
+ html.h4(content, **opts)
53
+
54
+ self
55
+ end
56
+
57
+ def h5(content, **opts)
58
+ html.h5(content, **opts)
59
+
60
+ self
61
+ end
62
+
63
+ def h6(content, **opts)
64
+ html.h6(content, **opts)
65
+
66
+ self
67
+ end
68
+
69
+ def ul_s(**opts)
70
+ html.ul_s(**opts)
71
+
72
+ self
73
+ end
74
+
75
+ def ul_e(**opts)
76
+ html.ul_e(**opts)
77
+
78
+ self
79
+ end
80
+
81
+ def li(content, **opts)
82
+ html.li(content, **opts)
83
+
84
+ self
85
+ end
86
+
15
87
  def empty?
16
88
  html.empty?
17
89
  end
@@ -19,6 +91,54 @@ module DrawioDsl
19
91
  def as_html(new_line: false)
20
92
  html.as_html(new_line: new_line)
21
93
  end
94
+
95
+ private
96
+
97
+ # useful defaults
98
+
99
+ def ratio
100
+ @ratio ||= 1.2
101
+ end
102
+
103
+ def base_margin_bottom
104
+ @base_margin_bottom ||= 4
105
+ end
106
+
107
+ def p_margin_bottom
108
+ @p_margin_bottom ||= base_margin_bottom
109
+ end
110
+
111
+ def b_margin_bottom
112
+ @b_margin_bottom ||= base_margin_bottom
113
+ end
114
+
115
+ def li_margin_bottom
116
+ @li_margin_bottom ||= base_margin_bottom
117
+ end
118
+
119
+ def h6_margin_bottom
120
+ @h6_margin_bottom ||= base_margin_bottom
121
+ end
122
+
123
+ def h5_margin_bottom
124
+ @h5_margin_bottom ||= h6_margin_bottom * ratio
125
+ end
126
+
127
+ def h4_margin_bottom
128
+ @h4_margin_bottom ||= h5_margin_bottom * ratio
129
+ end
130
+
131
+ def h3_margin_bottom
132
+ @h3_margin_bottom ||= h4_margin_bottom * ratio
133
+ end
134
+
135
+ def h2_margin_bottom
136
+ @h2_margin_bottom ||= h3_margin_bottom * ratio
137
+ end
138
+
139
+ def h1_margin_bottom
140
+ @h1_margin_bottom ||= h2_margin_bottom * ratio
141
+ end
22
142
  end
23
143
  end
24
144
  end
data/lib/drawio_dsl/formatters/html_builder.rb CHANGED
@@ -12,6 +12,9 @@ module DrawioDsl
12
12
  @element_style_defaults = element_style_defaults
13
13
  end
14
14
 
15
+ # Access the default styles for a HTML element
16
+ #
17
+ # Formatters can define the defaults styles for HTML elements such as <p>, <h1>, etc.
15
18
  def default_for(tag)
16
19
  element_style_defaults[tag] || {}
17
20
  end
@@ -48,6 +51,42 @@ module DrawioDsl
48
51
  add_line("<p#{style_for(:p, **opts)}>#{content}</p>")
49
52
  end
50
53
 
54
+ def h1(content, **opts)
55
+ add_line("<h1#{style_for(:h1, **opts)}>#{content}</h1>")
56
+ end
57
+
58
+ def h2(content, **opts)
59
+ add_line("<h2#{style_for(:h2, **opts)}>#{content}</h2>")
60
+ end
61
+
62
+ def h3(content, **opts)
63
+ add_line("<h3#{style_for(:h3, **opts)}>#{content}</h3>")
64
+ end
65
+
66
+ def h4(content, **opts)
67
+ add_line("<h4#{style_for(:h4, **opts)}>#{content}</h4>")
68
+ end
69
+
70
+ def h5(content, **opts)
71
+ add_line("<h5#{style_for(:h5, **opts)}>#{content}</h5>")
72
+ end
73
+
74
+ def h6(content, **opts)
75
+ add_line("<h6#{style_for(:h6, **opts)}>#{content}</h6>")
76
+ end
77
+
78
+ def li(content, **opts)
79
+ add_line("<li#{style_for(:li, **opts)}>#{content}</li>")
80
+ end
81
+
82
+ def ul_s(**opts)
83
+ add_line("<ul#{style_for(:ul, **opts)}>")
84
+ end
85
+
86
+ def ul_e(**_opts)
87
+ add_line('</ul>')
88
+ end
89
+
51
90
  def add_line(line)
52
91
  lines << line
53
92
  end
data/lib/drawio_dsl/formatters/interface_formatter.rb CHANGED
@@ -7,7 +7,19 @@ module DrawioDsl
7
7
  # Format the HTML to display an interface on a class diagram
8
8
  class InterfaceFormatter < BaseFormatter
9
9
  def initialize
10
- super({ p: { margin: '0px', margin_left: '4px', margin_top: '4px' } })
10
+ super(
11
+ {
12
+ p: { margin: '0px', margin_left: '4px', margin_bottom: "#{p_margin_bottom}px" },
13
+ b: { margin: '0px', margin_left: '4px', margin_bottom: "#{b_margin_bottom}px" },
14
+ h1: { margin: '0px', margin_left: '4px', margin_bottom: "#{h1_margin_bottom}px" },
15
+ h2: { margin: '0px', margin_left: '4px', margin_bottom: "#{h2_margin_bottom}px" },
16
+ h3: { margin: '0px', margin_left: '4px', margin_bottom: "#{h3_margin_bottom}px" },
17
+ h4: { margin: '0px', margin_left: '4px', margin_bottom: "#{h4_margin_bottom}px" },
18
+ h5: { margin: '0px', margin_left: '4px', margin_bottom: "#{h5_margin_bottom}px" },
19
+ h6: { margin: '0px', margin_left: '4px', margin_bottom: "#{h6_margin_bottom}px" },
20
+ li: { margin: '0px', margin_left: '4px', margin_bottom: "#{li_margin_bottom}px" }
21
+ }
22
+ )
11
23
  end
12
24
 
13
25
  def header(name, description: nil, interface_type: 'Interface')
data/lib/drawio_dsl/formatters/klass_formatter.rb CHANGED
@@ -7,7 +7,19 @@ module DrawioDsl
7
7
  # Format the HTML to display an class on a class diagram
8
8
  class KlassFormatter < BaseFormatter
9
9
  def initialize
10
- super({ p: { margin: '0px', margin_left: '4px', margin_top: '4px' } })
10
+ super(
11
+ {
12
+ p: { margin: '0px', margin_left: '4px', margin_bottom: "#{p_margin_bottom}px" },
13
+ b: { margin: '0px', margin_left: '4px', margin_bottom: "#{b_margin_bottom}px" },
14
+ h1: { margin: '0px', margin_left: '4px', margin_bottom: "#{h1_margin_bottom}px" },
15
+ h2: { margin: '0px', margin_left: '4px', margin_bottom: "#{h2_margin_bottom}px" },
16
+ h3: { margin: '0px', margin_left: '4px', margin_bottom: "#{h3_margin_bottom}px" },
17
+ h4: { margin: '0px', margin_left: '4px', margin_bottom: "#{h4_margin_bottom}px" },
18
+ h5: { margin: '0px', margin_left: '4px', margin_bottom: "#{h5_margin_bottom}px" },
19
+ h6: { margin: '0px', margin_left: '4px', margin_bottom: "#{h6_margin_bottom}px" },
20
+ li: { margin: '0px', margin_left: '4px', margin_bottom: "#{li_margin_bottom}px" }
21
+ }
22
+ )
11
23
  end
12
24
 
13
25
  def header(name, description: nil)
data/lib/drawio_dsl/version.rb CHANGED
@@ -1,5 +1,5 @@
1
1
  # frozen_string_literal: true
2
2
 
3
3
  module DrawioDsl
4
- VERSION = '0.8.6'
4
+ VERSION = '0.8.7'
5
5
  end
data/package-lock.json CHANGED
@@ -1,12 +1,12 @@
1
1
  {
2
2
  "name": "drawio_dsl",
3
- "version": "0.8.6",
3
+ "version": "0.8.7",
4
4
  "lockfileVersion": 2,
5
5
  "requires": true,
6
6
  "packages": {
7
7
  "": {
8
8
  "name": "drawio_dsl",
9
- "version": "0.8.6",
9
+ "version": "0.8.7",
10
10
  "devDependencies": {
11
11
  "@klueless-js/semantic-release-rubygem": "github:klueless-js/semantic-release-rubygem",
12
12
  "@semantic-release/changelog": "^6.0.1",
data/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "drawio_dsl",
3
- "version": "0.8.6",
3
+ "version": "0.8.7",
4
4
  "description": "DrawIO DSL can build DrawIO diagrams using a Domain Specific Language",
5
5
  "scripts": {
6
6
  "release": "semantic-release"
metadata CHANGED
@@ -1,7 +1,7 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: drawio_dsl
3
3
  version: !ruby/object:Gem::Version
4
- version: 0.8.6
4
+ version: 0.8.7
5
5
  platform: ruby
6
6
  authors:
7
7
  - David Cruwys