docs/system.drawio.svg

<svg host="65bd71144e" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="521px" height="211px" viewBox="-0.5 -0.5 521 211" content="&lt;mxfile&gt;&lt;diagram id=&quot;2TEW6nLOXHxg-xgUVqU3&quot; name=&quot;Page-1&quot;&gt;zVhNU9swEP01PtLxl5JwJAmUA0xpk5mWo2ILW4NspbJCkv76rrBkW5VDMxDAF8b7LK21b9/uinjRrNh9FXid3/KUMC/0050Xzb0wRGMEfxWw10AU10AmaFpDQQss6B+iQV+jG5qSylooOWeSrm0w4WVJEmlhWAi+tZc9cGZ/dY0z4gCLBDMX/UlTmdfoJBy3+DWhWW6+HIzO6zcFNot1JFWOU77tQNGlF80E57J+KnYzwhR3hpd639WBt83BBCnlURv0wZ4w2+jg9MHk3kS7zakkizVOlL2FhHrRNJcFAyuAR+2ACEl2B08RNLGBJggviBR7WGI2IE2H1sNEm9uWXGQYyzvENoLAOqFZ47qNGR502P0UhA4Dt9+XS0Cmgj8S4dABKVurx2TPaJkSEQEH/6FoxTewMr1ZNQBOHjOh0G8bCW6Ixqta6gFqeHVI7KH6IK/RJLZ4DWKX2FEPr5MT0Bq4QiIpVJE2S66C7pIEYYr9LzB8Y9wr4wsy5nzXfTnfd607IigcEdJVg5XEQl6oUleZYriqaGLgK8rab6buIgA7Sw6moeIbkejINM3gPSPSkpWK+cVUCcKwpE92Z3kT8eiAoHuycYNX0JmtNGBGs1LxAfEqOqdKbhR634V+UdA0VT6mgoBc8erZn+J8zWkpnw+Oph6a93Nnqs1tF7pZa4dWP+zT9pn/xUdjW99n2vvRnGrvd+rknSX84aGCPP5LenOI4/IQv7oAWs3fW5LvLwBL69ptV+j++wodfZrQJ47Qr5fLO0B+XC6Govf4hHofkrpjh3sGIzDhRVj8ltIhX9QTUDN31I3iTZMvmNg3isBHzuQL+q4Uo1OMvug0o++Fukdh2yNenH3v3A/QkAbfeMiDLzplI/Djc1veA+oM7vXjpu4MAM5m88G1huafiI9oDePXdobA+7BL8VGFPxpS4Y8GXPimKb2+7s3ldkhF7jJ+DdsBuQBRgaDKz78CILPF9Ej0fnUOZvubTU1n+8NXdPkX&lt;/diagram&gt;&lt;/mxfile&gt;">
    <defs/>
    <g>
        <rect x="0" y="0" width="520" height="210" fill="rgb(255, 255, 255)" stroke="rgb(0, 0, 0)" pointer-events="all"/>
        <path d="M 234 75 C 234 66.72 247.43 60 264 60 C 271.96 60 279.59 61.58 285.21 64.39 C 290.84 67.21 294 71.02 294 75 L 294 125 C 294 133.28 280.57 140 264 140 C 247.43 140 234 133.28 234 125 Z" fill="rgb(255, 255, 255)" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="all"/>
        <path d="M 294 75 C 294 83.28 280.57 90 264 90 C 247.43 90 234 83.28 234 75" fill="none" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="all"/>
        <g transform="translate(-0.5 -0.5)">
            <switch>
                <foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;">
                    <div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 58px; height: 1px; padding-top: 113px; margin-left: 235px;">
                        <div data-drawio-colors="color: rgb(0, 0, 0); " style="box-sizing: border-box; font-size: 0px; text-align: center;">
                            <div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">
                                MQTT Broker
                            </div>
                        </div>
                    </div>
                </foreignObject>
                <text x="264" y="116" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="12px" text-anchor="middle">
                    MQTT Broker
                </text>
            </switch>
        </g>
        <path d="M 156.08 75.65 L 227.92 98.1" fill="none" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="stroke"/>
        <path d="M 151.07 74.08 L 158.79 72.83 L 156.08 75.65 L 156.7 79.51 Z" fill="rgb(0, 0, 0)" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="all"/>
        <path d="M 232.93 99.67 L 225.21 100.92 L 227.92 98.1 L 227.3 94.24 Z" fill="rgb(0, 0, 0)" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="all"/>
        <g transform="translate(-0.5 -0.5)">
            <switch>
                <foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;">
                    <div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 1px; height: 1px; padding-top: 88px; margin-left: 189px;">
                        <div data-drawio-colors="color: rgb(0, 0, 0); background-color: rgb(255, 255, 255); " style="box-sizing: border-box; font-size: 0px; text-align: center;">
                            <div style="display: inline-block; font-size: 11px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: all; background-color: rgb(255, 255, 255); white-space: nowrap;">
                                MQTT
                            </div>
                        </div>
                    </div>
                </foreignObject>
                <text x="189" y="92" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="11px" text-anchor="middle">
                    MQTT
                </text>
            </switch>
        </g>
        <path d="M 90 85 L 90 123.63" fill="none" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="stroke"/>
        <path d="M 90 128.88 L 86.5 121.88 L 90 123.63 L 93.5 121.88 Z" fill="rgb(0, 0, 0)" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="all"/>
        <g transform="translate(-0.5 -0.5)">
            <switch>
                <foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;">
                    <div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 1px; height: 1px; padding-top: 104px; margin-left: 91px;">
                        <div data-drawio-colors="color: rgb(0, 0, 0); background-color: rgb(255, 255, 255); " style="box-sizing: border-box; font-size: 0px; text-align: center;">
                            <div style="display: inline-block; font-size: 11px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: all; background-color: rgb(255, 255, 255); white-space: nowrap;">
                                HTTP REST
                            </div>
                        </div>
                    </div>
                </foreignObject>
                <text x="91" y="107" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="11px" text-anchor="middle">
                    HTTP REST
                </text>
            </switch>
        </g>
        <rect x="30" y="25" width="120" height="60" fill="rgb(255, 255, 255)" stroke="rgb(0, 0, 0)" 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: 118px; height: 1px; padding-top: 55px; margin-left: 31px;">
                        <div data-drawio-colors="color: rgb(0, 0, 0); " style="box-sizing: border-box; font-size: 0px; text-align: center;">
                            <div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">
                                litecom2mqtt
                            </div>
                        </div>
                    </div>
                </foreignObject>
                <text x="90" y="59" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="12px" text-anchor="middle">
                    litecom2mqtt
                </text>
            </switch>
        </g>
        <path d="M 150 140.21 L 227.95 114.49" fill="none" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="stroke"/>
        <path d="M 232.94 112.85 L 227.39 118.37 L 227.95 114.49 L 225.19 111.72 Z" fill="rgb(0, 0, 0)" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="all"/>
        <g transform="translate(-0.5 -0.5)">
            <switch>
                <foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;">
                    <div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 1px; height: 1px; padding-top: 129px; margin-left: 183px;">
                        <div data-drawio-colors="color: rgb(0, 0, 0); background-color: rgb(255, 255, 255); " style="box-sizing: border-box; font-size: 0px; text-align: center;">
                            <div style="display: inline-block; font-size: 11px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: all; background-color: rgb(255, 255, 255); white-space: nowrap;">
                                MQTT
                            </div>
                        </div>
                    </div>
                </foreignObject>
                <text x="183" y="132" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="11px" text-anchor="middle">
                    MQTT
                </text>
            </switch>
        </g>
        <rect x="30" y="130" width="120" height="60" fill="rgb(255, 255, 255)" stroke="rgb(0, 0, 0)" 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: 118px; height: 1px; padding-top: 160px; margin-left: 31px;">
                        <div data-drawio-colors="color: rgb(0, 0, 0); " style="box-sizing: border-box; font-size: 0px; text-align: center;">
                            <div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">
                                Litecom CCD
                            </div>
                        </div>
                    </div>
                </foreignObject>
                <text x="90" y="164" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="12px" text-anchor="middle">
                    Litecom CCD
                </text>
            </switch>
        </g>
        <path d="M 364.63 100 L 300.37 100" fill="none" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="stroke"/>
        <path d="M 369.88 100 L 362.88 103.5 L 364.63 100 L 362.88 96.5 Z" fill="rgb(0, 0, 0)" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="all"/>
        <path d="M 295.12 100 L 302.12 96.5 L 300.37 100 L 302.12 103.5 Z" fill="rgb(0, 0, 0)" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="all"/>
        <g transform="translate(-0.5 -0.5)">
            <switch>
                <foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;">
                    <div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 1px; height: 1px; padding-top: 100px; margin-left: 333px;">
                        <div data-drawio-colors="color: rgb(0, 0, 0); background-color: rgb(255, 255, 255); " style="box-sizing: border-box; font-size: 0px; text-align: center;">
                            <div style="display: inline-block; font-size: 11px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: all; background-color: rgb(255, 255, 255); white-space: nowrap;">
                                MQTT
                            </div>
                        </div>
                    </div>
                </foreignObject>
                <text x="333" y="103" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="11px" text-anchor="middle">
                    MQTT
                </text>
            </switch>
        </g>
        <rect x="371" y="70" width="120" height="60" fill="rgb(255, 255, 255)" stroke="rgb(0, 0, 0)" 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: 118px; height: 1px; padding-top: 100px; margin-left: 372px;">
                        <div data-drawio-colors="color: rgb(0, 0, 0); " style="box-sizing: border-box; font-size: 0px; text-align: center;">
                            <div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">
                                Home Assistant
                            </div>
                        </div>
                    </div>
                </foreignObject>
                <text x="431" y="104" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="12px" text-anchor="middle">
                    Home Assistant
                </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>