blob: 1fb99ffbb77fd6729578c1c25565860c6cd66577 [file] [log] [blame]
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xl="http://www.w3.org/1999/xlink" viewBox="141 151 698 275" width="698" height="275">
<defs>
<font-face font-family="Helvetica Neue" font-size="14" panose-1="2 0 5 3 0 0 0 2 0 4" units-per-em="1000" underline-position="-100" underline-thickness="50" slope="0" x-height="517" cap-height="714" ascent="951.9958" descent="-212.99744" font-weight="400">
<font-face-src>
<font-face-name name="HelveticaNeue"/>
</font-face-src>
</font-face>
<marker orient="auto" overflow="visible" markerUnits="strokeWidth" id="FilledArrow_Marker" stroke-linejoin="miter" stroke-miterlimit="10" viewBox="-1 -4 10 8" markerWidth="10" markerHeight="8" color="black">
<g>
<path d="M 8 0 L 0 -3 L 0 3 Z" fill="currentColor" stroke="currentColor" stroke-width="1"/>
</g>
</marker>
<marker orient="auto" overflow="visible" markerUnits="strokeWidth" id="FilledArrow_Marker_2" stroke-linejoin="miter" stroke-miterlimit="10" viewBox="-9 -4 10 8" markerWidth="10" markerHeight="8" color="black">
<g>
<path d="M -8 0 L 0 3 L 0 -3 Z" fill="currentColor" stroke="currentColor" stroke-width="1"/>
</g>
</marker>
<font-face font-family="Helvetica Neue" font-size="12" panose-1="2 0 5 3 0 0 0 2 0 4" units-per-em="1000" underline-position="-100" underline-thickness="50" slope="0" x-height="517" cap-height="714" ascent="951.9958" descent="-212.99744" font-weight="400">
<font-face-src>
<font-face-name name="HelveticaNeue"/>
</font-face-src>
</font-face>
</defs>
<metadata> Produced by OmniGraffle 7.10.2
<dc:date>2019-04-03 12:15:14 +0000</dc:date>
</metadata>
<g id="Canvas_1" stroke-dasharray="none" stroke-opacity="1" fill="none" fill-opacity="1" stroke="none">
<title>Canvas 1</title>
<rect fill="white" x="141" y="151" width="698" height="275"/>
<g id="Canvas_1: Layer 1">
<title>Layer 1</title>
<g id="Graphic_2">
<path d="M 682.525 261 L 810.975 261 C 826.1688 261 838.5 273.768 838.5 289.5 C 838.5 305.232 826.1688 318 810.975 318 L 682.525 318 C 667.3312 318 655 305.232 655 289.5 C 655 273.768 667.3312 261 682.525 261 Z" fill="#c0c0ff"/>
<path d="M 682.525 261 L 810.975 261 C 826.1688 261 838.5 273.768 838.5 289.5 C 838.5 305.232 826.1688 318 810.975 318 L 682.525 318 C 667.3312 318 655 305.232 655 289.5 C 655 273.768 667.3312 261 682.525 261 Z" stroke="black" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
<text transform="translate(678.35 281)" fill="black">
<tspan font-family="Helvetica Neue" font-size="14" font-weight="400" fill="black" x="11.217" y="13">React Component</tspan>
</text>
</g>
<g id="Graphic_3">
<path d="M 436.9981 368 L 565.4481 368 C 580.6419 368 592.9731 380.768 592.9731 396.5 C 592.9731 412.232 580.6419 425 565.4481 425 L 436.9981 425 C 421.8043 425 409.4731 412.232 409.4731 396.5 C 409.4731 380.768 421.8043 368 436.9981 368 Z" fill="white"/>
<path d="M 436.9981 368 L 565.4481 368 C 580.6419 368 592.9731 380.768 592.9731 396.5 C 592.9731 412.232 580.6419 425 565.4481 425 L 436.9981 425 C 421.8043 425 409.4731 412.232 409.4731 396.5 C 409.4731 380.768 421.8043 368 436.9981 368 Z" stroke="black" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
<text transform="translate(432.8231 388)" fill="black">
<tspan font-family="Helvetica Neue" font-size="14" font-weight="400" fill="black" x="25.749" y="13">Create Action</tspan>
</text>
</g>
<g id="Graphic_4">
<path d="M 169.025 261 L 297.475 261 C 312.6688 261 325 273.768 325 289.5 C 325 305.232 312.6688 318 297.475 318 L 169.025 318 C 153.8312 318 141.5 305.232 141.5 289.5 C 141.5 273.768 153.8312 261 169.025 261 Z" fill="#ffc0c0"/>
<path d="M 169.025 261 L 297.475 261 C 312.6688 261 325 273.768 325 289.5 C 325 305.232 312.6688 318 297.475 318 L 169.025 318 C 153.8312 318 141.5 305.232 141.5 289.5 C 141.5 273.768 153.8312 261 169.025 261 Z" stroke="black" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
<text transform="translate(164.85 281)" fill="black">
<tspan font-family="Helvetica Neue" font-size="14" font-weight="400" fill="black" x="29.508" y="13">Redux Store</tspan>
</text>
</g>
<g id="Graphic_5">
<path d="M 436.9981 151.5 L 565.4481 151.5 C 580.6419 151.5 592.9731 164.268 592.9731 180 C 592.9731 195.732 580.6419 208.5 565.4481 208.5 L 436.9981 208.5 C 421.8043 208.5 409.4731 195.732 409.4731 180 C 409.4731 164.268 421.8043 151.5 436.9981 151.5 Z" fill="white"/>
<path d="M 436.9981 151.5 L 565.4481 151.5 C 580.6419 151.5 592.9731 164.268 592.9731 180 C 592.9731 195.732 580.6419 208.5 565.4481 208.5 L 436.9981 208.5 C 421.8043 208.5 409.4731 195.732 409.4731 180 C 409.4731 164.268 421.8043 151.5 436.9981 151.5 Z" stroke="black" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
<text transform="translate(432.8231 171.5)" fill="black">
<tspan font-family="Helvetica Neue" font-size="14" font-weight="400" fill="black" x="41.954" y="13">Reducer</tspan>
</text>
</g>
<g id="Line_6">
<path d="M 746.75 318 L 746.75 376.64943 C 746.75 387.69513 737.7957 396.64943 726.75 396.64943 C 726.7399 396.64943 726.72985 396.64943 726.7198 396.6494 L 627.8882 396.5 C 627.87816 396.5 627.8681 396.5 627.858 396.5 L 602.8731 396.5" marker-end="url(#FilledArrow_Marker)" stroke="black" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
</g>
<g id="Line_7">
<path d="M 409.4731 396.5 L 253.03307 396.5 C 241.98737 396.5 233.03307 387.5457 233.03307 376.5 C 233.03307 376.4385 233.03335 376.37696 233.03392 376.31545 L 233.24915 352.99227 C 233.24972 352.93076 233.25 352.86924 233.25 352.80772 L 233.25 327.9" marker-end="url(#FilledArrow_Marker)" stroke="black" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
</g>
<g id="Line_8">
<path d="M 233.25 261 L 233.25 200.49313 C 233.25 189.44743 242.2043 180.49313 253.25 180.49313 L 296.27823 180.49313 C 296.32025 180.49313 296.36227 180.493 296.4043 180.49273 L 374.5101 180.0004 C 374.5521 180.00013 374.59413 180 374.63615 180 L 399.5731 180" marker-end="url(#FilledArrow_Marker)" stroke="black" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
</g>
<g id="Line_11">
<path d="M 746.75 251.1 L 746.75 199.74273 C 746.75 188.69704 737.7957 179.74273 726.75 179.74273 L 679.256 179.74273 C 679.228 179.74273 679.2 179.7428 679.172 179.7429 L 618.0151 179.99982 C 617.9871 179.99994 617.9591 180 617.9311 180 L 592.9731 180" marker-start="url(#FilledArrow_Marker_2)" stroke="black" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
</g>
<g id="Graphic_12">
<text transform="translate(613 363)" fill="black">
<tspan font-family="Helvetica Neue" font-size="12" font-weight="400" fill="black" x="3.718" y="11">User interaction, e.g. </tspan>
<tspan font-family="Helvetica Neue" font-size="12" font-weight="400" fill="black" x="33.94" y="25.336">click, edit</tspan>
</text>
</g>
<g id="Graphic_14">
<text transform="translate(266 373)" fill="black">
<tspan font-family="Helvetica Neue" font-size="12" font-weight="400" fill="black" x="16.828" y="11">dispatch(action)</tspan>
</text>
</g>
<g id="Graphic_15">
<text transform="translate(252 188.5)" fill="black">
<tspan font-family="Helvetica Neue" font-size="12" font-weight="400" fill="black" x="2.714" y="11">reduce(action, oldState)</tspan>
</text>
</g>
<g id="Graphic_16">
<text transform="translate(606 188.5)" fill="black">
<tspan font-family="Helvetica Neue" font-size="12" font-weight="400" fill="black" x="20.948" y="11">render(newState)</tspan>
</text>
</g>
</g>
</g>
</svg>