docs/diagrams/ast-transformation.drawio.svg

<svg host="65bd71144e" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="781px" height="541px" viewBox="-0.5 -0.5 781 541" content="&lt;mxfile host=&quot;55d1a1c0-60b6-42e6-a9c2-c257dd70fbd3&quot; modified=&quot;2021-02-16T19:44:25.776Z&quot; agent=&quot;5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Code/1.52.1 Chrome/83.0.4103.122 Electron/9.3.5 Safari/537.36&quot; etag=&quot;4UJo5hfPJhbrvvdc3rnH&quot; version=&quot;13.10.0&quot; type=&quot;embed&quot;&gt;&lt;diagram id=&quot;6hGFLwfOUW9BJ-s0fimq&quot; name=&quot;Page-1&quot;&gt;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&lt;/diagram&gt;&lt;/mxfile&gt;" style="background-color: rgb(255, 255, 255);">
    <defs/>
    <g>
        <path d="M 295 180 L 295 193.63" fill="none" stroke="#000000" stroke-miterlimit="10" pointer-events="stroke"/>
        <path d="M 295 198.88 L 291.5 191.88 L 295 193.63 L 298.5 191.88 Z" fill="#000000" stroke="#000000" stroke-miterlimit="10" pointer-events="all"/>
        <rect x="200" y="140" width="190" height="40" rx="6" ry="6" fill="#d5e8d4" stroke="#82b366" pointer-events="all"/>
        <g transform="translate(-0.5 -0.5)">
            <switch>
                <foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
                    <div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 188px; height: 1px; padding-top: 160px; margin-left: 201px;">
                        <div style="box-sizing: border-box; font-size: 0; text-align: center; ">
                            <div style="display: inline-block; font-size: 24px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; ">
                                AST
                            </div>
                        </div>
                    </div>
                </foreignObject>
                <text x="295" y="167" fill="#000000" font-family="Helvetica" font-size="24px" text-anchor="middle">
                    AST
                </text>
            </switch>
        </g>
        <rect x="550" y="470" width="140" height="70" rx="10.5" ry="10.5" fill="#e1d5e7" stroke="none" pointer-events="all"/>
        <g transform="translate(-0.5 -0.5)">
            <switch>
                <foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
                    <div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 138px; height: 1px; padding-top: 505px; margin-left: 551px;">
                        <div style="box-sizing: border-box; font-size: 0; text-align: center; ">
                            <div style="display: inline-block; font-size: 24px; font-family: Helvetica; color: #660066; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; ">
                                GraphQL
                                <br/>
                                Schema
                            </div>
                        </div>
                    </div>
                </foreignObject>
                <text x="620" y="512" fill="#660066" font-family="Helvetica" font-size="24px" text-anchor="middle">
                    GraphQL...
                </text>
            </switch>
        </g>
        <path d="M 110 81.03 L 194.67 136.51" fill="none" stroke="#000000" stroke-miterlimit="10" pointer-events="stroke"/>
        <path d="M 199.06 139.39 L 191.29 138.48 L 194.67 136.51 L 195.13 132.62 Z" fill="#000000" stroke="#000000" stroke-miterlimit="10" pointer-events="all"/>
        <g transform="translate(-0.5 -0.5)">
            <switch>
                <foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
                    <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: 110px; margin-left: 167px;">
                        <div style="box-sizing: border-box; font-size: 0; text-align: center; ">
                            <div style="display: inline-block; font-size: 20px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; font-weight: bold; background-color: #ffffff; white-space: nowrap; ">
                                directoryToAst()
                            </div>
                        </div>
                    </div>
                </foreignObject>
                <text x="167" y="116" fill="#000000" font-family="Helvetica" font-size="20px" text-anchor="middle" font-weight="bold">
                    directoryToAst()
                </text>
            </switch>
        </g>
        <path d="M 390 418 L 543.94 468.03" fill="none" stroke="#000000" stroke-miterlimit="10" pointer-events="stroke"/>
        <path d="M 548.94 469.65 L 541.2 470.82 L 543.94 468.03 L 543.36 464.16 Z" fill="#000000" stroke="#000000" stroke-miterlimit="10" pointer-events="all"/>
        <g transform="translate(-0.5 -0.5)">
            <switch>
                <foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
                    <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: 442px; margin-left: 471px;">
                        <div style="box-sizing: border-box; font-size: 0; text-align: center; ">
                            <div style="display: inline-block; font-size: 20px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; font-weight: bold; background-color: #ffffff; white-space: nowrap; ">
                                astToSchema()
                            </div>
                        </div>
                    </div>
                </foreignObject>
                <text x="471" y="448" fill="#000000" font-family="Helvetica" font-size="20px" text-anchor="middle" font-weight="bold">
                    astToSchema()
                </text>
            </switch>
        </g>
        <rect x="200" y="200" width="190" height="40" rx="6" ry="6" fill="#f8cecc" stroke="#b85450" pointer-events="all"/>
        <g transform="translate(-0.5 -0.5)">
            <switch>
                <foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
                    <div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 188px; height: 1px; padding-top: 220px; margin-left: 201px;">
                        <div style="box-sizing: border-box; font-size: 0; text-align: center; ">
                            <div style="display: inline-block; font-size: 24px; font-family: Helvetica; color: #660000; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; ">
                                transformer1
                            </div>
                        </div>
                    </div>
                </foreignObject>
                <text x="295" y="227" fill="#660000" font-family="Helvetica" font-size="24px" text-anchor="middle">
                    transformer1
                </text>
            </switch>
        </g>
        <path d="M 295 358 L 295 371.63" fill="none" stroke="#000000" stroke-miterlimit="10" pointer-events="stroke"/>
        <path d="M 295 376.88 L 291.5 369.88 L 295 371.63 L 298.5 369.88 Z" fill="#000000" stroke="#000000" stroke-miterlimit="10" pointer-events="all"/>
        <rect x="200" y="318" width="190" height="40" rx="6" ry="6" fill="#f8cecc" stroke="#b85450" pointer-events="all"/>
        <g transform="translate(-0.5 -0.5)">
            <switch>
                <foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
                    <div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 188px; height: 1px; padding-top: 338px; margin-left: 201px;">
                        <div style="box-sizing: border-box; font-size: 0; text-align: center; ">
                            <div style="display: inline-block; font-size: 24px; font-family: Helvetica; color: #660000; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; ">
                                transformerN
                            </div>
                        </div>
                    </div>
                </foreignObject>
                <text x="295" y="345" fill="#660000" font-family="Helvetica" font-size="24px" text-anchor="middle">
                    transformerN
                </text>
            </switch>
        </g>
        <rect x="200" y="378" width="190" height="40" rx="6" ry="6" fill="#d5e8d4" stroke="#82b366" pointer-events="all"/>
        <g transform="translate(-0.5 -0.5)">
            <switch>
                <foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
                    <div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 188px; height: 1px; padding-top: 398px; margin-left: 201px;">
                        <div style="box-sizing: border-box; font-size: 0; text-align: center; ">
                            <div style="display: inline-block; font-size: 24px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; ">
                                AST''
                            </div>
                        </div>
                    </div>
                </foreignObject>
                <text x="295" y="405" fill="#000000" font-family="Helvetica" font-size="24px" text-anchor="middle">
                    AST''
                </text>
            </switch>
        </g>
        <rect x="550" y="200" width="230" height="150" fill="none" stroke="none" pointer-events="all"/>
        <g transform="translate(-0.5 -0.5)">
            <switch>
                <foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
                    <div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe flex-start; width: 1px; height: 1px; padding-top: 275px; margin-left: 552px;">
                        <div style="box-sizing: border-box; font-size: 0; text-align: left; ">
                            <div style="display: inline-block; font-size: 16px; font-family: Helvetica; color: #666666; line-height: 1.2; pointer-events: all; white-space: nowrap; ">
                                Ideas for transformers:
                                <br/>
                                - logging
                                <br style="font-size: 16px"/>
                                - tracing
                                <br style="font-size: 16px"/>
                                - authorization
                                <br style="font-size: 16px"/>
                                - role-base entrypoint filtration
                                <br style="font-size: 16px"/>
                                - type modification
                                <br/>
                                - error logging
                                <br style="font-size: 16px"/>
                                - etc.
                            </div>
                        </div>
                    </div>
                </foreignObject>
                <text x="552" y="280" fill="#666666" font-family="Helvetica" font-size="16px">
                    Ideas for transformers:...
                </text>
            </switch>
        </g>
        <rect x="200" y="260" width="190" height="40" rx="6" ry="6" fill="#d5e8d4" stroke="#82b366" pointer-events="all"/>
        <g transform="translate(-0.5 -0.5)">
            <switch>
                <foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
                    <div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 188px; height: 1px; padding-top: 280px; margin-left: 201px;">
                        <div style="box-sizing: border-box; font-size: 0; text-align: center; ">
                            <div style="display: inline-block; font-size: 24px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; ">
                                AST'
                            </div>
                        </div>
                    </div>
                </foreignObject>
                <text x="295" y="287" fill="#000000" font-family="Helvetica" font-size="24px" text-anchor="middle">
                    AST'
                </text>
            </switch>
        </g>
        <path d="M 295 240 L 295 253.63" fill="none" stroke="#000000" stroke-miterlimit="10" pointer-events="stroke"/>
        <path d="M 295 258.88 L 291.5 251.88 L 295 253.63 L 298.5 251.88 Z" fill="#000000" stroke="#000000" stroke-miterlimit="10" pointer-events="all"/>
        <path d="M 295 300 L 295 311.63" fill="none" stroke="#000000" stroke-miterlimit="10" pointer-events="stroke"/>
        <path d="M 295 316.88 L 291.5 309.88 L 295 311.63 L 298.5 309.88 Z" fill="#000000" stroke="#000000" stroke-miterlimit="10" pointer-events="all"/>
        <path d="M 55 330 L 194.23 395.3" fill="none" stroke="#000000" stroke-miterlimit="10" pointer-events="stroke"/>
        <path d="M 198.99 397.53 L 191.16 397.72 L 194.23 395.3 L 194.14 391.38 Z" fill="#000000" stroke="#000000" stroke-miterlimit="10" pointer-events="all"/>
        <g transform="translate(-0.5 -0.5)">
            <switch>
                <foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
                    <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: 363px; margin-left: 109px;">
                        <div style="box-sizing: border-box; font-size: 0; text-align: center; ">
                            <div style="display: inline-block; font-size: 20px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; font-weight: bold; background-color: #ffffff; white-space: nowrap; ">
                                astMerge()
                            </div>
                        </div>
                    </div>
                </foreignObject>
                <text x="109" y="369" fill="#000000" font-family="Helvetica" font-size="20px" text-anchor="middle" font-weight="bold">
                    astMerge()
                </text>
            </switch>
        </g>
        <g transform="translate(-0.5 -0.5)">
            <switch>
                <foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
                    <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: 219px; margin-left: 452px;">
                        <div style="box-sizing: border-box; font-size: 0; text-align: center; ">
                            <div style="display: inline-block; font-size: 20px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; font-weight: bold; background-color: #ffffff; white-space: nowrap; ">
                                astVisitor()
                            </div>
                        </div>
                    </div>
                </foreignObject>
                <text x="452" y="225" fill="#000000" font-family="Helvetica" font-size="20px" text-anchor="middle" font-weight="bold">
                    astVisitor()
                </text>
            </switch>
        </g>
        <g transform="translate(-0.5 -0.5)">
            <switch>
                <foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
                    <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: 334px; margin-left: 452px;">
                        <div style="box-sizing: border-box; font-size: 0; text-align: center; ">
                            <div style="display: inline-block; font-size: 20px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; font-weight: bold; background-color: #ffffff; white-space: nowrap; ">
                                astVisitor()
                            </div>
                        </div>
                    </div>
                </foreignObject>
                <text x="452" y="340" fill="#000000" font-family="Helvetica" font-size="20px" text-anchor="middle" font-weight="bold">
                    astVisitor()
                </text>
            </switch>
        </g>
        <rect x="0" y="260" width="110" height="70" rx="10.5" ry="10.5" fill="#f5f5f5" stroke="#666666" pointer-events="all"/>
        <g transform="translate(-0.5 -0.5)">
            <switch>
                <foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
                    <div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 108px; height: 1px; padding-top: 295px; margin-left: 1px;">
                        <div style="box-sizing: border-box; font-size: 0; text-align: center; ">
                            <div style="display: inline-block; font-size: 15px; font-family: Helvetica; color: #333333; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; ">
                                ASTs
                                <br/>
                                distributed via npm packages
                            </div>
                        </div>
                    </div>
                </foreignObject>
                <text x="55" y="300" fill="#333333" font-family="Helvetica" font-size="15px" text-anchor="middle">
                    ASTs...
                </text>
            </switch>
        </g>
        <rect x="0" y="0" width="110" height="90" fill="none" stroke="none" pointer-events="all"/>
        <path d="M 58.33 11.98 L 70.96 1.46 C 72.11 0.56 73.44 0.02 75.04 0 L 103.49 0 C 106.47 0 110 2.24 110 6.06 L 110 11.98 Z M 0 90 L 0 22.34 C 0 19.02 3.29 16.5 6.44 16.5 L 110 16.5 L 110 90 Z" fill="#f5f5f5" stroke="#666666" stroke-miterlimit="10" pointer-events="all"/>
        <rect x="5" y="20" width="100" height="60" fill="none" stroke="none" pointer-events="all"/>
        <g transform="translate(-0.5 -0.5)">
            <switch>
                <foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
                    <div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe flex-start; justify-content: unsafe flex-start; width: 98px; height: 1px; padding-top: 27px; margin-left: 7px;">
                        <div style="box-sizing: border-box; font-size: 0; text-align: left; ">
                            <div style="display: inline-block; font-size: 15px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; ">
                                <div style="text-align: center">
                                    <span>
                                        <font color="#333333" face="helvetica">
                                            file based entrypoint
                                            <br/>
                                            definitions
                                        </font>
                                    </span>
                                </div>
                            </div>
                        </div>
                    </div>
                </foreignObject>
                <text x="7" y="42" fill="#000000" font-family="Helvetica" font-size="15px">
                    file based en...
                </text>
            </switch>
        </g>
    </g>
    <switch>
        <g requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"/>
        <a transform="translate(0,-5)" xlink:href="https://desk.draw.io/support/solutions/articles/16000042487" target="_blank">
            <text text-anchor="middle" font-size="10px" x="50%" y="100%">
                Viewer does not support full SVG 1.1
            </text>
        </a>
    </switch>
</svg>