drawio_dsl 0.11.0 → 0.11.3

Sign up to get free protection for your applications and to get access to all the features.
Files changed (49) hide show
  1. checksums.yaml +4 -4
  2. data/CHANGELOG.md +21 -0
  3. data/config/configuration.json +564 -370
  4. data/docs/domain_model.drawio +89 -89
  5. data/docs/domain_model.json +267 -267
  6. data/docs/printspeak-architecture-controllers-custom.drawio +9 -9
  7. data/docs/printspeak-architecture-controllers.drawio +47 -47
  8. data/docs/printspeak-architecture-generator-custom.drawio +16 -10
  9. data/docs/printspeak-architecture-generator.drawio +268 -0
  10. data/docs/project-plan/project.drawio +89 -89
  11. data/docs/project-plan/project_done.svg +1 -1
  12. data/docs/project-plan/project_in_progress.svg +1 -1
  13. data/docs/project-plan/project_todo.svg +1 -1
  14. data/docs/samples/styles-glass.svg +1 -1
  15. data/docs/samples/styles-plain.svg +1 -1
  16. data/docs/samples/styles-rounded.svg +1 -1
  17. data/docs/samples/styles-shadow.svg +1 -1
  18. data/docs/samples/styles-sketch.svg +1 -1
  19. data/docs/samples/themes-random.svg +1 -1
  20. data/docs/tailwind_domain_model-custom.drawio +104 -0
  21. data/docs/tailwind_domain_model.json +288 -0
  22. data/docs/tailwind_domain_model.svg +3 -0
  23. data/lib/drawio_dsl/configuration.rb +96 -84
  24. data/lib/drawio_dsl/dom_builder.rb +2 -2
  25. data/lib/drawio_dsl/dom_builder_shapes.rb +60 -0
  26. data/lib/drawio_dsl/drawio_shapes.rb +103 -43
  27. data/lib/drawio_dsl/schema/_.rb +10 -0
  28. data/lib/drawio_dsl/schema/diagram.rb +1 -1
  29. data/lib/drawio_dsl/schema/element.rb +4 -0
  30. data/lib/drawio_dsl/schema/layouts/flex_layout.rb +1 -1
  31. data/lib/drawio_dsl/schema/layouts/grid_layout.rb +1 -1
  32. data/lib/drawio_dsl/schema/line.rb +24 -3
  33. data/lib/drawio_dsl/schema/lines/dash_dot.rb +9 -0
  34. data/lib/drawio_dsl/schema/lines/dash_dot_dot.rb +9 -0
  35. data/lib/drawio_dsl/schema/lines/dash_long_dash.rb +9 -0
  36. data/lib/drawio_dsl/schema/lines/dashed.rb +9 -0
  37. data/lib/drawio_dsl/schema/lines/dashed24.rb +9 -0
  38. data/lib/drawio_dsl/schema/lines/dashed32.rb +9 -0
  39. data/lib/drawio_dsl/schema/lines/dashed44.rb +9 -0
  40. data/lib/drawio_dsl/schema/lines/dot_dot_dot.rb +9 -0
  41. data/lib/drawio_dsl/schema/lines/dotted.rb +9 -0
  42. data/lib/drawio_dsl/schema/lines/long_dash.rb +9 -0
  43. data/lib/drawio_dsl/schema/node.rb +5 -5
  44. data/lib/drawio_dsl/schema/shape.rb +14 -9
  45. data/lib/drawio_dsl/schema/text.rb +4 -0
  46. data/lib/drawio_dsl/version.rb +1 -1
  47. data/package-lock.json +2 -2
  48. data/package.json +1 -1
  49. metadata +16 -2
@@ -0,0 +1,288 @@
1
+ {
2
+ "host": "Drf",
3
+ "theme": "style_04",
4
+ "palette": {
5
+ "fill_color": "#ffe6cc",
6
+ "stroke_color": "#d79b00",
7
+ "font_color": "#333333",
8
+ "gradient": null
9
+ },
10
+ "style": {
11
+ "white_space": "wrap",
12
+ "html": 1,
13
+ "rounded": null,
14
+ "shadow": null,
15
+ "sketch": null,
16
+ "glass": null
17
+ },
18
+ "pages": [
19
+ {
20
+ "id": "Yy3",
21
+ "name": "Domain Modal",
22
+ "position_x": 0,
23
+ "position_y": 540,
24
+ "theme": "style_04",
25
+ "palette": {
26
+ "fill_color": "#ffe6cc",
27
+ "stroke_color": "#d79b00",
28
+ "font_color": "#333333",
29
+ "gradient": null
30
+ },
31
+ "style": {
32
+ "white_space": "wrap",
33
+ "html": 1,
34
+ "rounded": 0,
35
+ "shadow": null,
36
+ "sketch": null,
37
+ "glass": null
38
+ },
39
+ "settings": {
40
+ "margin_left": 0,
41
+ "margin_top": 0,
42
+ "grid": 0,
43
+ "grid_size": 10,
44
+ "guides": 1,
45
+ "tooltips": 1,
46
+ "connect": 1,
47
+ "arrows": 1,
48
+ "fold": 1,
49
+ "page_no": 1,
50
+ "page_scale": 1,
51
+ "page_width": 1169,
52
+ "page_height": 827,
53
+ "background": "#fafafa",
54
+ "page_shadow": 0,
55
+ "math": 0
56
+ },
57
+ "nodes": [
58
+ {
59
+ "id": "page_root_Yy3",
60
+ "parent_id": "Yy3",
61
+ "classification": "anchor",
62
+ "key": "page_root",
63
+ "nodes": [
64
+ {
65
+ "id": "node_root_Yy3",
66
+ "parent_id": "page_root_Yy3",
67
+ "classification": "anchor",
68
+ "key": "node_root",
69
+ "nodes": [
70
+ {
71
+ "id": "rule-2",
72
+ "parent_id": "node_root_Yy3",
73
+ "classification": "layout_rule",
74
+ "key": "grid_layout",
75
+ "anchor_x": 0,
76
+ "anchor_y": 0,
77
+ "direction": "horizontal",
78
+ "wrap_at": 6,
79
+ "grid_w": 220,
80
+ "grid_h": 180,
81
+ "cell_no": 1
82
+ },
83
+ {
84
+ "id": "Yy3-2",
85
+ "parent_id": "node_root_Yy3",
86
+ "classification": "shape",
87
+ "key": "square",
88
+ "x": 30,
89
+ "y": 10,
90
+ "w": 160,
91
+ "h": 160,
92
+ "style": "whiteSpace=wrap;html=1;rounded=0;fillColor=#f5f5f5;strokeColor=#666666;fontColor=#333333"
93
+ },
94
+ {
95
+ "id": "Yy3-3",
96
+ "parent_id": "node_root_Yy3",
97
+ "classification": "shape",
98
+ "key": "square",
99
+ "x": 250,
100
+ "y": 10,
101
+ "w": 160,
102
+ "h": 160,
103
+ "style": "whiteSpace=wrap;html=1;rounded=0;fillColor=#f5f5f5;strokeColor=#666666;fontColor=#333333"
104
+ },
105
+ {
106
+ "id": "Yy3-4",
107
+ "parent_id": "node_root_Yy3",
108
+ "classification": "shape",
109
+ "key": "klass",
110
+ "x": 450,
111
+ "y": 10,
112
+ "w": 200,
113
+ "h": 160,
114
+ "style": "whiteSpace=wrap;html=1;rounded=0;fillColor=#ffe6cc;strokeColor=#d79b00;fontColor=#333333;align=left;overflow=fill;fontSize=12;fontFamily=Helvetica"
115
+ },
116
+ {
117
+ "id": "Yy3-5",
118
+ "parent_id": "node_root_Yy3",
119
+ "classification": "shape",
120
+ "key": "klass",
121
+ "x": 670,
122
+ "y": 10,
123
+ "w": 200,
124
+ "h": 160,
125
+ "style": "whiteSpace=wrap;html=1;rounded=0;fillColor=#ffe6cc;strokeColor=#d79b00;fontColor=#333333;align=left;overflow=fill;fontSize=12;fontFamily=Helvetica"
126
+ },
127
+ {
128
+ "id": "Yy3-6",
129
+ "parent_id": "node_root_Yy3",
130
+ "classification": "shape",
131
+ "key": "klass",
132
+ "x": 890,
133
+ "y": 10,
134
+ "w": 200,
135
+ "h": 160,
136
+ "style": "whiteSpace=wrap;html=1;rounded=0;fillColor=#ffe6cc;strokeColor=#d79b00;fontColor=#333333;align=left;overflow=fill;fontSize=12;fontFamily=Helvetica"
137
+ },
138
+ {
139
+ "id": "Yy3-7",
140
+ "parent_id": "node_root_Yy3",
141
+ "classification": "shape",
142
+ "key": "klass",
143
+ "x": 1110,
144
+ "y": 10,
145
+ "w": 200,
146
+ "h": 160,
147
+ "style": "whiteSpace=wrap;html=1;rounded=0;fillColor=#ffe6cc;strokeColor=#d79b00;fontColor=#333333;align=left;overflow=fill;fontSize=12;fontFamily=Helvetica"
148
+ },
149
+ {
150
+ "id": "Yy3-8",
151
+ "parent_id": "node_root_Yy3",
152
+ "classification": "shape",
153
+ "key": "klass",
154
+ "x": 10,
155
+ "y": 190,
156
+ "w": 200,
157
+ "h": 160,
158
+ "style": "whiteSpace=wrap;html=1;rounded=0;fillColor=#ffe6cc;strokeColor=#d79b00;fontColor=#333333;align=left;overflow=fill;fontSize=12;fontFamily=Helvetica"
159
+ },
160
+ {
161
+ "id": "Yy3-9",
162
+ "parent_id": "node_root_Yy3",
163
+ "classification": "shape",
164
+ "key": "klass",
165
+ "x": 230,
166
+ "y": 190,
167
+ "w": 200,
168
+ "h": 160,
169
+ "style": "whiteSpace=wrap;html=1;rounded=0;fillColor=#ffe6cc;strokeColor=#d79b00;fontColor=#333333;align=left;overflow=fill;fontSize=12;fontFamily=Helvetica"
170
+ },
171
+ {
172
+ "id": "Yy3-10",
173
+ "parent_id": "node_root_Yy3",
174
+ "classification": "shape",
175
+ "key": "square",
176
+ "x": 470,
177
+ "y": 190,
178
+ "w": 160,
179
+ "h": 160,
180
+ "style": "whiteSpace=wrap;html=1;rounded=0;fillColor=#f5f5f5;strokeColor=#666666;fontColor=#333333"
181
+ },
182
+ {
183
+ "id": "Yy3-11",
184
+ "parent_id": "node_root_Yy3",
185
+ "classification": "shape",
186
+ "key": "klass",
187
+ "x": 670,
188
+ "y": 190,
189
+ "w": 200,
190
+ "h": 160,
191
+ "style": "whiteSpace=wrap;html=1;rounded=0;fillColor=#ffe6cc;strokeColor=#d79b00;fontColor=#333333;align=left;overflow=fill;fontSize=12;fontFamily=Helvetica"
192
+ },
193
+ {
194
+ "id": "Yy3-12",
195
+ "parent_id": "node_root_Yy3",
196
+ "classification": "shape",
197
+ "key": "klass",
198
+ "x": 890,
199
+ "y": 190,
200
+ "w": 200,
201
+ "h": 160,
202
+ "style": "whiteSpace=wrap;html=1;rounded=0;fillColor=#ffe6cc;strokeColor=#d79b00;fontColor=#333333;align=left;overflow=fill;fontSize=12;fontFamily=Helvetica"
203
+ },
204
+ {
205
+ "id": "Yy3-13",
206
+ "parent_id": "node_root_Yy3",
207
+ "classification": "shape",
208
+ "key": "klass",
209
+ "x": 1110,
210
+ "y": 190,
211
+ "w": 200,
212
+ "h": 160,
213
+ "style": "whiteSpace=wrap;html=1;rounded=0;fillColor=#ffe6cc;strokeColor=#d79b00;fontColor=#333333;align=left;overflow=fill;fontSize=12;fontFamily=Helvetica"
214
+ },
215
+ {
216
+ "id": "Yy3-14",
217
+ "parent_id": "node_root_Yy3",
218
+ "classification": "shape",
219
+ "key": "square",
220
+ "x": 30,
221
+ "y": 370,
222
+ "w": 160,
223
+ "h": 160,
224
+ "style": "whiteSpace=wrap;html=1;rounded=0;fillColor=#f5f5f5;strokeColor=#666666;fontColor=#333333"
225
+ },
226
+ {
227
+ "id": "Yy3-15",
228
+ "parent_id": "node_root_Yy3",
229
+ "classification": "shape",
230
+ "key": "square",
231
+ "x": 250,
232
+ "y": 370,
233
+ "w": 160,
234
+ "h": 160,
235
+ "style": "whiteSpace=wrap;html=1;rounded=0;fillColor=#f5f5f5;strokeColor=#666666;fontColor=#333333"
236
+ },
237
+ {
238
+ "id": "Yy3-16",
239
+ "parent_id": "node_root_Yy3",
240
+ "classification": "shape",
241
+ "key": "klass",
242
+ "x": 450,
243
+ "y": 370,
244
+ "w": 200,
245
+ "h": 160,
246
+ "style": "whiteSpace=wrap;html=1;rounded=0;fillColor=#ffe6cc;strokeColor=#d79b00;fontColor=#333333;align=left;overflow=fill;fontSize=12;fontFamily=Helvetica"
247
+ },
248
+ {
249
+ "id": "Yy3-17",
250
+ "parent_id": "node_root_Yy3",
251
+ "classification": "shape",
252
+ "key": "square",
253
+ "x": 690,
254
+ "y": 370,
255
+ "w": 160,
256
+ "h": 160,
257
+ "style": "whiteSpace=wrap;html=1;rounded=0;fillColor=#f5f5f5;strokeColor=#666666;fontColor=#333333"
258
+ },
259
+ {
260
+ "id": "Yy3-18",
261
+ "parent_id": "node_root_Yy3",
262
+ "classification": "shape",
263
+ "key": "klass",
264
+ "x": 890,
265
+ "y": 370,
266
+ "w": 200,
267
+ "h": 160,
268
+ "style": "whiteSpace=wrap;html=1;rounded=0;fillColor=#ffe6cc;strokeColor=#d79b00;fontColor=#333333;align=left;overflow=fill;fontSize=12;fontFamily=Helvetica"
269
+ },
270
+ {
271
+ "id": "Yy3-19",
272
+ "parent_id": "node_root_Yy3",
273
+ "classification": "shape",
274
+ "key": "interface",
275
+ "x": 1130,
276
+ "y": 370,
277
+ "w": 160,
278
+ "h": 160,
279
+ "style": "whiteSpace=wrap;html=1;rounded=0;fillColor=#dae8fc;strokeColor=#6c8ebf;fontColor=#333333;align=left;overflow=fill;fontSize=12;fontFamily=Helvetica"
280
+ }
281
+ ]
282
+ }
283
+ ]
284
+ }
285
+ ]
286
+ }
287
+ ]
288
+ }
@@ -0,0 +1,3 @@
1
+ <?xml version="1.0" encoding="UTF-8"?>
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="1302px" height="522px" viewBox="-0.5 -0.5 1302 522"><defs/><g><rect x="20" y="0" width="160" height="160" fill="#f5f5f5" stroke="#666666" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 80px; margin-left: 21px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">Tailwind GEM</div></div></div></foreignObject><text x="100" y="84" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">Tailwind GEM</text></switch></g><rect x="240" y="0" width="160" height="160" fill="#f5f5f5" stroke="#666666" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 80px; margin-left: 241px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">Configuration</div></div></div></foreignObject><text x="320" y="84" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">Configuration</text></switch></g><rect x="440" y="0" width="200" height="160" fill="#ffe6cc" stroke="#d79b00" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe flex-start; width: 202px; height: 160px; padding-top: 0px; margin-left: 440px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: left; width: 200px; height: 160px; overflow: hidden;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; width: 100%; height: 100%; white-space: normal; overflow-wrap: normal;"><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px ; text-align: center"><b>Configuration</b></p><hr size="1" /><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px">collections: A&lt;Collection&gt;</p><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px">themes: A&lt;Theme&gt;</p><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px">data_shapes: A&lt;DataShape&gt;</p><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px">component_groups: A&lt;ComponentGroup&gt;</p></div></div></div></foreignObject><text x="440" y="84" fill="#333333" font-family="Helvetica" font-size="12px">Configuration...</text></switch></g><rect x="660" y="0" width="200" height="160" fill="#ffe6cc" stroke="#d79b00" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe flex-start; width: 202px; height: 160px; padding-top: 0px; margin-left: 660px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: left; width: 200px; height: 160px; overflow: hidden;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; width: 100%; height: 100%; white-space: normal; overflow-wrap: normal;"><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px ; text-align: center"><b>Collection</b></p><hr size="1" /><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px">name: String</p><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px">description: String</p><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px">component_groups: A&lt;ComponentGroup&gt;</p><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px">default_themes: A&lt;Theme&gt;</p></div></div></div></foreignObject><text x="660" y="84" fill="#333333" font-family="Helvetica" font-size="12px">Collection...</text></switch></g><rect x="880" y="0" width="200" height="160" fill="#ffe6cc" stroke="#d79b00" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe flex-start; width: 202px; height: 160px; padding-top: 0px; margin-left: 880px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: left; width: 200px; height: 160px; overflow: hidden;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; width: 100%; height: 100%; white-space: normal; overflow-wrap: normal;"><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px ; text-align: center"><b>Theme</b></p><hr size="1" /><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px">key: Symbol</p><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px">name: String</p><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px">description: String</p></div></div></div></foreignObject><text x="880" y="84" fill="#333333" font-family="Helvetica" font-size="12px">Theme...</text></switch></g><rect x="1100" y="0" width="200" height="160" fill="#ffe6cc" stroke="#d79b00" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe flex-start; width: 202px; height: 160px; padding-top: 0px; margin-left: 1100px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: left; width: 200px; height: 160px; overflow: hidden;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; width: 100%; height: 100%; white-space: normal; overflow-wrap: normal;"><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px ; text-align: center"><b>ComponentGroup</b></p><hr size="1" /><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px">key: Symbol</p><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px">name: String</p><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px">description: String</p><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px">collection: Collection</p><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px">components: A&lt;Component&gt;</p></div></div></div></foreignObject><text x="1100" y="84" fill="#333333" font-family="Helvetica" font-size="12px">ComponentGroup...</text></switch></g><rect x="0" y="180" width="200" height="160" fill="#ffe6cc" stroke="#d79b00" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe flex-start; width: 202px; height: 160px; padding-top: 180px; margin-left: 0px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: left; width: 200px; height: 160px; overflow: hidden;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; width: 100%; height: 100%; white-space: normal; overflow-wrap: normal;"><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px ; text-align: center"><b>Component</b></p><hr size="1" /><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px">key: Symbol</p><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px">name: String</p><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px">description: String</p><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px">data_shape: DataShape</p></div></div></div></foreignObject><text x="0" y="264" fill="#333333" font-family="Helvetica" font-size="12px">Component...</text></switch></g><rect x="220" y="180" width="200" height="160" fill="#ffe6cc" stroke="#d79b00" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe flex-start; width: 202px; height: 160px; padding-top: 180px; margin-left: 220px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: left; width: 200px; height: 160px; overflow: hidden;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; width: 100%; height: 100%; white-space: normal; overflow-wrap: normal;"><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px ; text-align: center"><b>DataShape</b></p><hr size="1" /><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px">key: Symbol</p><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px">name: String</p><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px">description: String</p></div></div></div></foreignObject><text x="220" y="264" fill="#333333" font-family="Helvetica" font-size="12px">DataShape...</text></switch></g><rect x="460" y="180" width="160" height="160" fill="#f5f5f5" stroke="#666666" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 260px; margin-left: 461px;"><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;">Schema</div></div></div></foreignObject><text x="540" y="264" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">Schema</text></switch></g><rect x="660" y="180" width="200" height="160" fill="#ffe6cc" stroke="#d79b00" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe flex-start; width: 202px; height: 160px; padding-top: 180px; margin-left: 660px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: left; width: 200px; height: 160px; overflow: hidden;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; width: 100%; height: 100%; white-space: normal; overflow-wrap: normal;"><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px ; text-align: center"><b>WebSite</b></p><hr size="1" /><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px">key: Symbol</p><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px">name: String</p><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px">description: String</p><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px">target_folder: String</p><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px">base_collection: Collection</p><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px">theme: Theme</p><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px">root: Page</p><hr size="1" /><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px">favourite_components() : A&lt;Component&gt;</p></div></div></div></foreignObject><text x="660" y="264" fill="#333333" font-family="Helvetica" font-size="12px">WebSite...</text></switch></g><rect x="880" y="180" width="200" height="160" fill="#ffe6cc" stroke="#d79b00" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe flex-start; width: 202px; height: 160px; padding-top: 180px; margin-left: 880px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: left; width: 200px; height: 160px; overflow: hidden;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; width: 100%; height: 100%; white-space: normal; overflow-wrap: normal;"><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px ; text-align: center"><b>Page</b></p><hr size="1" /><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px">key: Symbol</p><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px">name: String</p><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px">description: String</p><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px">sub_folder: String</p><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px">level: Integer</p><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px">pages: A&lt;Page&gt;</p><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px">components: A&lt;Component&gt;</p></div></div></div></foreignObject><text x="880" y="264" fill="#333333" font-family="Helvetica" font-size="12px">Page...</text></switch></g><rect x="1100" y="180" width="200" height="160" fill="#ffe6cc" stroke="#d79b00" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe flex-start; width: 202px; height: 160px; padding-top: 180px; margin-left: 1100px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: left; width: 200px; height: 160px; overflow: hidden;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; width: 100%; height: 100%; white-space: normal; overflow-wrap: normal;"><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px ; text-align: center"><b>Component</b></p><hr size="1" /><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px">key: Symbol</p><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px">name: String</p><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px">description: String</p><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px">component_group: ComponentGroup</p><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px">data_shape: DataShape</p></div></div></div></foreignObject><text x="1100" y="264" fill="#333333" font-family="Helvetica" font-size="12px">Component...</text></switch></g><rect x="20" y="360" width="160" height="160" fill="#f5f5f5" stroke="#666666" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 440px; margin-left: 21px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">Tailwind Generator</div></div></div></foreignObject><text x="100" y="444" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">Tailwind Generator</text></switch></g><rect x="240" y="360" width="160" height="160" fill="#f5f5f5" stroke="#666666" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 440px; margin-left: 241px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">Tailwind DSL</div></div></div></foreignObject><text x="320" y="444" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">Tailwind DSL</text></switch></g><rect x="440" y="360" width="200" height="160" fill="#ffe6cc" stroke="#d79b00" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe flex-start; width: 202px; height: 160px; padding-top: 360px; margin-left: 440px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: left; width: 200px; height: 160px; overflow: hidden;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; width: 100%; height: 100%; white-space: normal; overflow-wrap: normal;"><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px ; text-align: center"><b>TailwindDsl</b></p><hr size="1" /><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px">website()</p><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px">page()</p><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px">component()</p><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px">save()</p></div></div></div></foreignObject><text x="440" y="444" fill="#333333" font-family="Helvetica" font-size="12px">TailwindDsl...</text></switch></g><rect x="680" y="360" width="160" height="160" fill="#f5f5f5" stroke="#666666" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 440px; margin-left: 681px;"><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;">DataBuilder</div></div></div></foreignObject><text x="760" y="444" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">DataBuilder</text></switch></g><rect x="880" y="360" width="200" height="160" fill="#ffe6cc" stroke="#d79b00" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe flex-start; width: 202px; height: 160px; padding-top: 360px; margin-left: 880px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: left; width: 200px; height: 160px; overflow: hidden;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; width: 100%; height: 100%; white-space: normal; overflow-wrap: normal;"><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px ; text-align: center"><b>BaseDataBuilder</b></p><hr size="1" /><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px">obj: Hash</p></div></div></div></foreignObject><text x="880" y="444" fill="#333333" font-family="Helvetica" font-size="12px">BaseDataBuilder...</text></switch></g><rect x="1120" y="360" width="160" height="160" fill="#dae8fc" stroke="#6c8ebf" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe flex-start; width: 162px; height: 160px; padding-top: 360px; margin-left: 1120px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: left; width: 160px; height: 160px; overflow: hidden;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; width: 100%; height: 100%; white-space: normal; overflow-wrap: normal;"><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px ; text-align: center"><i>&lt;&lt; MixIn &gt;&gt;</i></p><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px ; text-align: center"><b>Factory</b></p><hr size="1" /><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px">data()</p><p style="margin: 0px ; margin-left: 4px ; margin-bottom: 4px">data_instance()</p></div></div></div></foreignObject><text x="1120" y="444" fill="#333333" font-family="Helvetica" font-size="12px">&lt;&lt; MixIn &gt;&gt;...</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>