-
Notifications
You must be signed in to change notification settings - Fork 5
/
schema.drawio
127 lines (127 loc) · 10.5 KB
/
schema.drawio
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
<mxfile>
<diagram id="qsnDriftJt72G9iPDm_e" name="Page-1">
<mxGraphModel dx="1076" dy="830" grid="1" gridSize="10" guides="1" tooltips="1" connect="1" arrows="1" fold="1" page="1" pageScale="1" pageWidth="850" pageHeight="1100" math="0" shadow="0">
<root>
<mxCell id="0"/>
<mxCell id="1" parent="0"/>
<mxCell id="27" value="" style="rounded=0;whiteSpace=wrap;html=1;" vertex="1" parent="1">
<mxGeometry x="425" y="260" width="360" height="280" as="geometry"/>
</mxCell>
<mxCell id="28" value="SpecificFrameworkUILibrary" style="text;html=1;strokeColor=none;fillColor=none;align=center;verticalAlign=middle;whiteSpace=wrap;rounded=0;" vertex="1" parent="1">
<mxGeometry x="435" y="260" width="170" height="20" as="geometry"/>
</mxCell>
<mxCell id="2" value="" style="rounded=0;whiteSpace=wrap;html=1;" vertex="1" parent="1">
<mxGeometry x="60" y="60" width="720" height="180" as="geometry"/>
</mxCell>
<mxCell id="3" value="GenericUILibrary" style="text;html=1;strokeColor=none;fillColor=none;align=center;verticalAlign=middle;whiteSpace=wrap;rounded=0;" vertex="1" parent="1">
<mxGeometry x="60" y="60" width="120" height="20" as="geometry"/>
</mxCell>
<mxCell id="4" value="SimpleComponent1" style="rounded=0;whiteSpace=wrap;html=1;" vertex="1" parent="1">
<mxGeometry x="80" y="90" width="120" height="60" as="geometry"/>
</mxCell>
<mxCell id="5" value="SimpleComponent2" style="rounded=0;whiteSpace=wrap;html=1;" vertex="1" parent="1">
<mxGeometry x="80" y="160" width="120" height="60" as="geometry"/>
</mxCell>
<mxCell id="6" value="SimpleComponent3" style="rounded=0;whiteSpace=wrap;html=1;" vertex="1" parent="1">
<mxGeometry x="210" y="90" width="120" height="60" as="geometry"/>
</mxCell>
<mxCell id="7" value="SimpleComponent4" style="rounded=0;whiteSpace=wrap;html=1;" vertex="1" parent="1">
<mxGeometry x="210" y="160" width="120" height="60" as="geometry"/>
</mxCell>
<mxCell id="8" value="" style="rounded=0;whiteSpace=wrap;html=1;" vertex="1" parent="1">
<mxGeometry x="350" y="90" width="420" height="130" as="geometry"/>
</mxCell>
<mxCell id="9" value="ComplexComponent1" style="text;html=1;strokeColor=none;fillColor=none;align=center;verticalAlign=middle;whiteSpace=wrap;rounded=0;" vertex="1" parent="1">
<mxGeometry x="360" y="90" width="120" height="20" as="geometry"/>
</mxCell>
<mxCell id="10" value="SimpleComponent1" style="rounded=0;whiteSpace=wrap;html=1;" vertex="1" parent="1">
<mxGeometry x="380" y="135" width="120" height="60" as="geometry"/>
</mxCell>
<mxCell id="11" value="SimpleComponent3" style="rounded=0;whiteSpace=wrap;html=1;" vertex="1" parent="1">
<mxGeometry x="640" y="135" width="120" height="60" as="geometry"/>
</mxCell>
<mxCell id="12" value="SimpleComponent1" style="rounded=0;whiteSpace=wrap;html=1;" vertex="1" parent="1">
<mxGeometry x="510" y="135" width="120" height="60" as="geometry"/>
</mxCell>
<mxCell id="29" value="" style="group" vertex="1" connectable="0" parent="1">
<mxGeometry x="440" y="290" width="340" height="210" as="geometry"/>
</mxCell>
<mxCell id="22" value="" style="rounded=0;whiteSpace=wrap;html=1;" vertex="1" parent="29">
<mxGeometry width="340" height="210" as="geometry"/>
</mxCell>
<mxCell id="23" value="Wrapper<br>GenericUILibrary<br>SimpleComponent1" style="rounded=0;whiteSpace=wrap;html=1;" vertex="1" parent="29">
<mxGeometry x="10" y="35" width="120" height="60" as="geometry"/>
</mxCell>
<mxCell id="24" value="Wrapper<br>GenericUILibrary<br>ComplexComponent1" style="rounded=0;whiteSpace=wrap;html=1;" vertex="1" parent="29">
<mxGeometry x="150" y="40" width="180" height="130" as="geometry"/>
</mxCell>
<mxCell id="25" value="Wrapper<br>GenericUILibrary<br>SimpleComponent2" style="rounded=0;whiteSpace=wrap;html=1;" vertex="1" parent="29">
<mxGeometry x="10" y="110" width="120" height="60" as="geometry"/>
</mxCell>
<mxCell id="18" value="ReactUILibrary" style="text;html=1;strokeColor=none;fillColor=none;align=center;verticalAlign=middle;whiteSpace=wrap;rounded=0;" vertex="1" parent="29">
<mxGeometry x="5" width="110" height="20" as="geometry"/>
</mxCell>
<mxCell id="31" value="" style="group" vertex="1" connectable="0" parent="1">
<mxGeometry x="60" y="260" width="360" height="280" as="geometry"/>
</mxCell>
<mxCell id="13" value="" style="rounded=0;whiteSpace=wrap;html=1;" vertex="1" parent="31">
<mxGeometry width="360" height="280" as="geometry"/>
</mxCell>
<mxCell id="14" value="SpecificFrameworkUILibrary" style="text;html=1;strokeColor=none;fillColor=none;align=center;verticalAlign=middle;whiteSpace=wrap;rounded=0;" vertex="1" parent="31">
<mxGeometry x="10" width="170" height="20" as="geometry"/>
</mxCell>
<mxCell id="15" value="" style="rounded=0;whiteSpace=wrap;html=1;" vertex="1" parent="31">
<mxGeometry x="10" y="30" width="340" height="210" as="geometry"/>
</mxCell>
<mxCell id="17" value="AngularUILibrary" style="text;html=1;strokeColor=none;fillColor=none;align=center;verticalAlign=middle;whiteSpace=wrap;rounded=0;" vertex="1" parent="31">
<mxGeometry x="10" y="30" width="110" height="20" as="geometry"/>
</mxCell>
<mxCell id="19" value="Wrapper<br>GenericUILibrary<br>SimpleComponent1" style="rounded=0;whiteSpace=wrap;html=1;" vertex="1" parent="31">
<mxGeometry x="20" y="65" width="120" height="60" as="geometry"/>
</mxCell>
<mxCell id="20" value="Wrapper<br>GenericUILibrary<br>ComplexComponent1" style="rounded=0;whiteSpace=wrap;html=1;" vertex="1" parent="31">
<mxGeometry x="160" y="70" width="180" height="130" as="geometry"/>
</mxCell>
<mxCell id="21" value="Wrapper<br>GenericUILibrary<br>SimpleComponent2" style="rounded=0;whiteSpace=wrap;html=1;" vertex="1" parent="31">
<mxGeometry x="20" y="140" width="120" height="60" as="geometry"/>
</mxCell>
<mxCell id="32" value="" style="group" vertex="1" connectable="0" parent="1">
<mxGeometry x="65" y="560" width="720" height="280" as="geometry"/>
</mxCell>
<mxCell id="33" value="" style="rounded=0;whiteSpace=wrap;html=1;" vertex="1" parent="32">
<mxGeometry width="720" height="240" as="geometry"/>
</mxCell>
<mxCell id="34" value="Your Final APP" style="text;html=1;strokeColor=none;fillColor=none;align=center;verticalAlign=middle;whiteSpace=wrap;rounded=0;" vertex="1" parent="32">
<mxGeometry x="10" width="170" height="20" as="geometry"/>
</mxCell>
<mxCell id="37" value="Wrapper<br>SpecificFrameworkUILibrary<br>SimpleComponent1" style="rounded=0;whiteSpace=wrap;html=1;" vertex="1" parent="32">
<mxGeometry x="20" y="40" width="260" height="70" as="geometry"/>
</mxCell>
<mxCell id="38" value="Wrapper<br>SpecificFrameworkUILibrary<br>ComplexComponent1" style="rounded=0;whiteSpace=wrap;html=1;" vertex="1" parent="32">
<mxGeometry x="360" y="40" width="345" height="155" as="geometry"/>
</mxCell>
<mxCell id="39" value="Wrapper<br>SpecificFrameworkUILibrary<br>SimpleComponent2" style="rounded=0;whiteSpace=wrap;html=1;" vertex="1" parent="32">
<mxGeometry x="20" y="140" width="260" height="80" as="geometry"/>
</mxCell>
<mxCell id="40" value="Will be Dumb components.<br>Take props as property of function<br>received from parent components." style="shape=note;whiteSpace=wrap;html=1;backgroundOutline=1;darkOpacity=0.05;" vertex="1" parent="1">
<mxGeometry x="830" y="60" width="300" height="180" as="geometry"/>
</mxCell>
<mxCell id="41" value="" style="endArrow=none;dashed=1;html=1;entryX=0;entryY=0.5;entryDx=0;entryDy=0;entryPerimeter=0;exitX=1;exitY=0.5;exitDx=0;exitDy=0;" edge="1" parent="1" source="2" target="40">
<mxGeometry width="50" height="50" relative="1" as="geometry">
<mxPoint x="400" y="390" as="sourcePoint"/>
<mxPoint x="450" y="340" as="targetPoint"/>
</mxGeometry>
</mxCell>
<mxCell id="42" value="Will be Dumb components that wrap WebComponents created in GenericUILibrary.<br>Take props as property of function<br>received from parent components<br>but use specific feature from framework<br>(for example lifecycle or hooks from react)" style="shape=note;whiteSpace=wrap;html=1;backgroundOutline=1;darkOpacity=0.05;" vertex="1" parent="1">
<mxGeometry x="850" y="300" width="300" height="180" as="geometry"/>
</mxCell>
<mxCell id="43" value="" style="endArrow=none;dashed=1;html=1;entryX=0;entryY=0.5;entryDx=0;entryDy=0;entryPerimeter=0;exitX=1;exitY=0.5;exitDx=0;exitDy=0;" edge="1" parent="1" target="42" source="22">
<mxGeometry width="50" height="50" relative="1" as="geometry">
<mxPoint x="820" y="390" as="sourcePoint"/>
<mxPoint x="490" y="580" as="targetPoint"/>
</mxGeometry>
</mxCell>
</root>
</mxGraphModel>
</diagram>
</mxfile>