Microsoft/vscode
1
0
Fork 0
mirror of https://github.com/microsoft/vscode.git synced 2026-04-19 08:08:39 +01:00
Code Issues Packages Projects Releases Wiki Activity
Files
f01d41c78427b8f7b2d3651a02500a05ed3e69ae
vscode/.github/instructions/resources/notebook/viewport-rendering.drawio.svg
Peng Lyu 87912ef73b Merge pull request #287166 from microsoft/rebornix/disgusted-jaguar 
Update instructions/documentation for notebook and interactive window components
2026-01-12 13:45:33 -08:00

522 lines
44 KiB
XML
Raw Blame History

<svg host="65bd71144e" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="724px" height="1001px" viewBox="-0.5 -0.5 724 1001" content="&lt;mxfile&gt;&lt;diagram id=&quot;n5xL6N_UYSLJ1J9_o0bc&quot; name=&quot;Page-1&quot;&gt;7Vxbc9o4FP41PG7GtnyBxwbS7M603UzT3baPChbgqbFYIRLor1/ZlnyRBChBhgTCQ2Id28L6vqNzk0wPDOfrWwIXs884RmnPc+J1D4x6nhcEgP3NBZtSEPW5YEqSuBS5teA++Y240OHSVRKjZetCinFKk0VbOMZZhsa0JYOE4Kf2ZROctr91AadIEdyPYapKvycxnZXSfuDU8j9RMp2Jb3YdfuYBjn9NCV5l/Pt6HpgUn/L0HIq++PXLGYzxU0MEbnpgSDCm5dF8PURpDq2Arbzv45az1XMTlFGTG7zyhkeYrpB44uK56EZgQWZ4/rBigF4/zRKK7hdwnJ95YsQz2YzOU9Zy2aH63fxxHhGhaN0Q8We5RXiOKNmwS/jZiMPC1cYNefupQQIXzRr4CxnktE+rjuuhswM+ej0S/f1IoJgpCW9mOEOGw1/iFRnzLvg0oJBMEb8qKkV55zshIiiFNHlsa+ghIwbKiL+iLEaEyf5N0NMCE6pAwHik7WHDNJlm7HjMhs3uBdc52wmbSh/4iXkSx/nt1wQtk9/woejKYe0FTjJaPH9w3QtGeV8ripelMci7XlKCf6EhTjGpEbegZZVaCTUbqGpWzeimnnkW9CxQUP+CKXrA+BeTfkqWlMN/ntAHEvKOBnmvI+RdV4G+iykeqVNcuLXjz3GNuh1pzJ5/qjFHr8unuZJTq7zVEZzaYLuJ/4bmCwY8Ok874/n7QXfdrgyNf5RJJx6/ZWnAqWYdcI46aHsD5Lfe5apaK5AvKZDfd66cxsdrd1hywPuQQKseykx5DHA8pfmqgDmC+XLV9KSyXzcpmqPsTCNU2XzpQO8sQnXVxOBVaWB4TA1U46dblJuJ0SaD82TMjngh4Dz1MNgPfWfxumfiUbL4Q17v0ToUNm6y+ZFjeBWI5s/mudGaA1y2Nry1FbgXedoGVIEGKSE70F9VfkNU3EKJgdKJKh5K6QhIsy2QqbTn6jyThGwXwVuJeiWkVFPjUFL2smuRFNXnvpNi1JEvOxyLpBi45AYp4xQul8w5bbGGTVvYMI0HWUPTsPw0HCvUvEZrqGaNQ4KKDN3hl4qcfcn6uoOEhQSyEuyJxmK4nKGYNyZJmtoPGeTEydOEDNpwzZXn4YtihlAB8RvG6QMkClTFKk0BhrM/jG0HWD0PeCNmN/IbJzijDTlf7Wmjy+ShAwduxOTTfG7yL61Wf3bOs2dgL2krCFTsIw30wAbyatntJk4ovgjgg+CEwKsrV/cU0tXyQpQ+BKfDHhhEsM+DvAlOE7WW5Z4SGCeopoBb7+MYdF0tojuDDo6zgAE0C7PgZCsYQA33hjiuA4G9pQZtPUCjHuYlCZ3etjXbTHVtKKS0fFt5vYZCDjT6aKMmAQxK+8a1sa2IHXd+D6QQ11XhBF3ZTzVcqwq8/FJ9nPvKVd5GSAFkWgKFls5KwEBdOFSt7r58c53QH43jRrbJWnWymTf25pqtJaDXVXkD28zRc3NN2dGG3dUTxDddUtyiq113F7f4JhWbw+MWX1OL8T3D+WE9bvFNwuGDvaNGXbYolg0t6ktapNmS6GuUyLehQ97ZwxlpkrXO4NQU2NgVeYBRTAYYs3+jvz8rGF9AsCHVS0NNSN3ZdhlfTfH+WcRl4TOFG7zK6UmyCb5EYqQoMNKYn+6IMdhJ96aXgjzZGr04dNvXkcXQzWSj+p7Q/GJ4kTvqMqRWUya+8nBFipRWW7o5w3qskria7hkB3lUEDrdaQgffiRBZvCBCE2u5ooLdIiKwQ4SaDQgi4iT+ellcCLMtuND5ceBpuAgtEKHmopc6IyR3oHvxRxdN2ah1Bmr6cakstO1SpHsJqDMWdOtJYUo5Ri3ww/9WWJz4o9xt+YFd4LqLdX2SHU3z/4LLBUE5Op944lJ2zZ6q7L289iJYlixepFlW6I5ldV1BwVzNXFq1yjcULkuFzr5cLDGNlqPQvfK9fhC5/O/ubu3FzoHJK1tnVo7ua3yPthxd7a07aEJYyBrFgk69iPOzcUa/oNPYgp2/FtXceNjbve2waN0hkrCx5hUa8/UhUTZt1sQD07esjzRj5UDEeeGUlQsPVYxvf5KGx1nRCAYqe6GpvbW+ohGoWb1qmd52CX6gccxdleBDNTfnV4h4yRnOYDY1eSv17Eq9Ug1+4GkCpq7etQnVXP3s9FzjcDvTc/1SU6/czsL+rYoFjr9yjcxgWir/F2zyow/nrvauo0kHva42uoRqOnipSblMA9CYn6720YZbt+1fHA0DiQZd9TzSFW1t0KDLw2wWR7aavfcySUW4rkofeR0RrqaFX3KP4zkfCZy/uShMItZxhuxjh6dQ7FLYkb5HQUdOSpeEtKbluBp0PfPY8FnI46iTsdji4nwt9ruYzbt32ndtIuyK9khNlkxon0wcZzvt30mSb6x55/15vOteerHEO2vWv/dY1mXq39QEN/8D&lt;/diagram&gt;&lt;/mxfile&gt;" style="background-color: rgb(255, 255, 255);">
<defs/>
<g>
<path d="M 70 60 L 110 100 L 70 140 L 30 100 Z" fill="rgb(255, 255, 255)" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="all"/>
<path d="M 170 110 L 170 173.63" fill="none" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="stroke"/>
<path d="M 170 178.88 L 166.5 171.88 L 170 173.63 L 173.5 171.88 Z" fill="rgb(0, 0, 0)" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="all"/>
<rect x="120" y="90" width="100" height="20" fill="none" stroke="none" 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: 170px;">
<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: nowrap;">
Render Viewport
</div>
</div>
</div>
</foreignObject>
<text x="170" y="104" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="12px" text-anchor="middle">
Render Viewport
</text>
</switch>
</g>
<rect x="10" y="0" width="120" height="20" fill="none" stroke="none" 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: 10px; margin-left: 70px;">
<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: nowrap;">
Notebook List View
</div>
</div>
</div>
</foreignObject>
<text x="70" y="14" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="12px" text-anchor="middle">
Notebook List View
</text>
</switch>
</g>
<path d="M 170 260 L 170 333.63" fill="none" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="stroke"/>
<path d="M 170 338.88 L 166.5 331.88 L 170 333.63 L 173.5 331.88 Z" fill="rgb(0, 0, 0)" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="all"/>
<path d="M 210 220 L 393.63 220" fill="none" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="stroke"/>
<path d="M 398.88 220 L 391.88 223.5 L 393.63 220 L 391.88 216.5 Z" fill="rgb(0, 0, 0)" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="all"/>
<path d="M 170 180 L 210 220 L 170 260 L 130 220 Z" fill="rgb(255, 255, 255)" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="all"/>
<rect x="200" y="180" width="110" height="20" fill="none" stroke="none" 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: 190px; margin-left: 255px;">
<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: nowrap;">
Render Template
</div>
</div>
</div>
</foreignObject>
<text x="255" y="194" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="12px" text-anchor="middle">
Render Template
</text>
</switch>
</g>
<path d="M 170 420 L 170 533.63" fill="none" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="stroke"/>
<path d="M 170 538.88 L 166.5 531.88 L 170 533.63 L 173.5 531.88 Z" fill="rgb(0, 0, 0)" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="all"/>
<path d="M 210 380 L 393.63 380" fill="none" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="stroke"/>
<path d="M 398.88 380 L 391.88 383.5 L 393.63 380 L 391.88 376.5 Z" fill="rgb(0, 0, 0)" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="all"/>
<path d="M 170 340 L 210 380 L 170 420 L 130 380 Z" fill="rgb(255, 255, 255)" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="all"/>
<rect x="200" y="340" width="100" height="20" fill="none" stroke="none" 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: 350px; margin-left: 250px;">
<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: nowrap;">
Render Element
</div>
</div>
</div>
</foreignObject>
<text x="250" y="354" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="12px" text-anchor="middle">
Render Element
</text>
</switch>
</g>
<path d="M 170 540 L 210 580 L 170 620 L 130 580 Z" fill="rgb(255, 255, 255)" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="all"/>
<rect x="210" y="540" width="120" height="20" fill="none" stroke="none" 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: 550px; margin-left: 270px;">
<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: nowrap;">
Get Dynamic Height
</div>
</div>
</div>
</foreignObject>
<text x="270" y="554" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="12px" text-anchor="middle">
Get Dynamic Height
</text>
</switch>
</g>
<path d="M 170 660 L 170 620" fill="none" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="stroke"/>
<path d="M 80 660 L 170 660" fill="none" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="stroke"/>
<path d="M 80 660 L 80 380" fill="none" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="stroke"/>
<path d="M 80 380 L 123.63 380" fill="none" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="stroke"/>
<path d="M 128.88 380 L 121.88 383.5 L 123.63 380 L 121.88 376.5 Z" fill="rgb(0, 0, 0)" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="all"/>
<rect x="400" y="140" width="280" height="160" fill="none" stroke="rgb(0, 0, 0)" stroke-dasharray="3 3" 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: 278px; height: 1px; padding-top: 220px; margin-left: 401px;">
<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;">
Create Cell Templates/Parts
</div>
</div>
</div>
</foreignObject>
<text x="540" y="224" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="12px" text-anchor="middle">
Create Cell Templates/Parts
</text>
</switch>
</g>
<rect x="430" y="250" width="70" height="30" fill="#60a917" stroke="#2d7600" 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: 68px; height: 1px; padding-top: 265px; margin-left: 431px;">
<div data-drawio-colors="color: #ffffff; " style="box-sizing: border-box; font-size: 0px; text-align: center;">
<div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(255, 255, 255); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">
Toolbar
</div>
</div>
</div>
</foreignObject>
<text x="465" y="269" fill="#ffffff" font-family="Helvetica" font-size="12px" text-anchor="middle">
Toolbar
</text>
</switch>
</g>
<rect x="510" y="250" width="70" height="30" fill="#60a917" stroke="#2d7600" 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: 68px; height: 1px; padding-top: 265px; margin-left: 511px;">
<div data-drawio-colors="color: #ffffff; " style="box-sizing: border-box; font-size: 0px; text-align: center;">
<div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(255, 255, 255); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">
Editor
</div>
</div>
</div>
</foreignObject>
<text x="545" y="269" fill="#ffffff" font-family="Helvetica" font-size="12px" text-anchor="middle">
Editor
</text>
</switch>
</g>
<rect x="590" y="250" width="70" height="30" fill="#60a917" stroke="#2d7600" 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: 68px; height: 1px; padding-top: 265px; margin-left: 591px;">
<div data-drawio-colors="color: #ffffff; " style="box-sizing: border-box; font-size: 0px; text-align: center;">
<div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(255, 255, 255); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">
Statusbar
</div>
</div>
</div>
</foreignObject>
<text x="625" y="269" fill="#ffffff" font-family="Helvetica" font-size="12px" text-anchor="middle">
Statusbar
</text>
</switch>
</g>
<rect x="400" y="340" width="280" height="160" fill="none" stroke="rgb(0, 0, 0)" stroke-dasharray="3 3" pointer-events="all"/>
<path d="M 465 390 L 465 403.63" fill="none" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="stroke"/>
<path d="M 465 408.88 L 461.5 401.88 L 465 403.63 L 468.5 401.88 Z" fill="rgb(0, 0, 0)" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="all"/>
<rect x="420" y="370" width="90" height="20" fill="none" stroke="none" 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: 88px; height: 1px; padding-top: 380px; margin-left: 421px;">
<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;">
Code Cell
</div>
</div>
</div>
</foreignObject>
<text x="465" y="384" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="12px" text-anchor="middle">
Code Cell
</text>
</switch>
</g>
<path d="M 465 410 L 480 425 L 465 440 L 450 425 Z" fill="none" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="all"/>
<rect x="490" y="415" width="100" height="20" fill="none" stroke="none" 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: 98px; height: 1px; padding-top: 425px; margin-left: 491px;">
<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;">
Render Cell Parts
</div>
</div>
</div>
</foreignObject>
<text x="540" y="429" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="12px" text-anchor="middle">
Render Cell Parts
</text>
</switch>
</g>
<path d="M 210 580 L 393.63 580" fill="none" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="stroke"/>
<path d="M 398.88 580 L 391.88 583.5 L 393.63 580 L 391.88 576.5 Z" fill="rgb(0, 0, 0)" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="all"/>
<rect x="400" y="540" width="280" height="160" fill="none" stroke="rgb(0, 0, 0)" stroke-dasharray="3 3" pointer-events="all"/>
<path d="M 460 600 L 460 643.63" fill="none" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="stroke"/>
<path d="M 460 648.88 L 456.5 641.88 L 460 643.63 L 463.5 641.88 Z" fill="rgb(0, 0, 0)" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="all"/>
<path d="M 460 560 L 480 580 L 460 600 L 440 580 Z" fill="none" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="all"/>
<path d="M 460 650 L 480 670 L 460 690 L 440 670 Z" fill="none" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="all"/>
<rect x="480" y="570" width="110" height="20" fill="none" stroke="none" 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: 108px; height: 1px; padding-top: 580px; margin-left: 481px;">
<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;">
CellPart read DOM
</div>
</div>
</div>
</foreignObject>
<text x="535" y="584" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="12px" text-anchor="middle">
CellPart read DOM
</text>
</switch>
</g>
<rect x="490" y="660" width="110" height="20" fill="none" stroke="none" 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: 108px; height: 1px; padding-top: 670px; margin-left: 491px;">
<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;">
Update layout info
</div>
</div>
</div>
</foreignObject>
<text x="545" y="674" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="12px" text-anchor="middle">
Update layout info
</text>
</switch>
</g>
<path d="M 240 670 L 440 670" fill="none" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="stroke"/>
<path d="M 240 670 L 240 586.37" fill="none" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="stroke"/>
<path d="M 240 581.12 L 243.5 588.12 L 240 586.37 L 236.5 588.12 Z" fill="rgb(0, 0, 0)" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="all"/>
<rect x="490" y="440" width="120" height="32.73" fill="#60a917" stroke="#2d7600" 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: 456px; margin-left: 491px;">
<div data-drawio-colors="color: #ffffff; " style="box-sizing: border-box; font-size: 0px; text-align: center;">
<div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(255, 255, 255); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">
Toolbar.renderCell
</div>
</div>
</div>
</foreignObject>
<text x="550" y="460" fill="#ffffff" font-family="Helvetica" font-size="12px" text-anchor="middle">
Toolbar.renderCell
</text>
</switch>
</g>
<rect x="499" y="450" width="131" height="35.73" fill="#60a917" stroke="#2d7600" 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: 129px; height: 1px; padding-top: 468px; margin-left: 500px;">
<div data-drawio-colors="color: #ffffff; " style="box-sizing: border-box; font-size: 0px; text-align: center;">
<div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(255, 255, 255); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">
Toolbar.renderCell
</div>
</div>
</div>
</foreignObject>
<text x="565" y="471" fill="#ffffff" font-family="Helvetica" font-size="12px" text-anchor="middle">
Toolbar.renderCell
</text>
</switch>
</g>
<rect x="508" y="460" width="132" height="36" fill="#60a917" stroke="#2d7600" 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: 130px; height: 1px; padding-top: 478px; margin-left: 509px;">
<div data-drawio-colors="color: #ffffff; " style="box-sizing: border-box; font-size: 0px; text-align: center;">
<div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(255, 255, 255); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">
Toolbar.didRenderCell
</div>
</div>
</div>
</foreignObject>
<text x="574" y="482" fill="#ffffff" font-family="Helvetica" font-size="12px" text-anchor="middle">
Toolbar.didRenderCell
</text>
</switch>
</g>
<rect x="490" y="590" width="110" height="30" fill="#60a917" stroke="#2d7600" 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: 108px; height: 1px; padding-top: 605px; margin-left: 491px;">
<div data-drawio-colors="color: #ffffff; " style="box-sizing: border-box; font-size: 0px; text-align: center;">
<div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(255, 255, 255); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">
Toolbar.renderCell
</div>
</div>
</div>
</foreignObject>
<text x="545" y="609" fill="#ffffff" font-family="Helvetica" font-size="12px" text-anchor="middle">
Toolbar.renderCell
</text>
</switch>
</g>
<rect x="499" y="600" width="110" height="30" fill="#60a917" stroke="#2d7600" 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: 108px; height: 1px; padding-top: 615px; margin-left: 500px;">
<div data-drawio-colors="color: #ffffff; " style="box-sizing: border-box; font-size: 0px; text-align: center;">
<div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(255, 255, 255); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">
Toolbar.renderCell
</div>
</div>
</div>
</foreignObject>
<text x="554" y="619" fill="#ffffff" font-family="Helvetica" font-size="12px" text-anchor="middle">
Toolbar.renderCell
</text>
</switch>
</g>
<rect x="508" y="610" width="110" height="30" fill="#60a917" stroke="#2d7600" 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: 108px; height: 1px; padding-top: 625px; margin-left: 509px;">
<div data-drawio-colors="color: #ffffff; " style="box-sizing: border-box; font-size: 0px; text-align: center;">
<div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(255, 255, 255); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">
<font style="font-size: 11px">
Toolbar.prepareLayout
</font>
</div>
</div>
</div>
</foreignObject>
<text x="563" y="629" fill="#ffffff" font-family="Helvetica" font-size="12px" text-anchor="middle">
Toolbar.prepareLay...
</text>
</switch>
</g>
<path d="M 0 740 L 721.43 740" fill="none" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" stroke-dasharray="3 3" pointer-events="stroke"/>
<rect x="400" y="790" width="280" height="210" fill="none" stroke="rgb(0, 0, 0)" stroke-dasharray="3 3" pointer-events="all"/>
<path d="M 460 690 L 459.93 783.63" fill="none" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="stroke"/>
<path d="M 459.92 788.88 L 456.43 781.88 L 459.93 783.63 L 463.43 781.88 Z" fill="rgb(0, 0, 0)" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="all"/>
<path d="M 460 850 L 460 883.63" fill="none" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="stroke"/>
<path d="M 460 888.88 L 456.5 881.88 L 460 883.63 L 463.5 881.88 Z" fill="rgb(0, 0, 0)" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="all"/>
<path d="M 460 810 L 480 830 L 460 850 L 440 830 Z" fill="none" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="all"/>
<rect x="480" y="820" width="120" height="20" fill="none" stroke="none" 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: 830px; margin-left: 481px;">
<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;">
Cell Layout Change
</div>
</div>
</div>
</foreignObject>
<text x="540" y="834" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="12px" text-anchor="middle">
Cell Layout Change
</text>
</switch>
</g>
<path d="M 460 890 L 480 910 L 460 930 L 440 910 Z" fill="none" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="all"/>
<rect x="480" y="900" width="200" height="20" fill="none" stroke="none" 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: 198px; height: 1px; padding-top: 910px; margin-left: 481px;">
<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;">
Cell Part updateInternalLayoutNow
</div>
</div>
</div>
</foreignObject>
<text x="580" y="914" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="12px" text-anchor="middle">
Cell Part updateInternalLayoutNow
</text>
</switch>
</g>
<rect x="490" y="930" width="170" height="30" fill="#60a917" stroke="#2d7600" 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: 168px; height: 1px; padding-top: 945px; margin-left: 491px;">
<div data-drawio-colors="color: #ffffff; " style="box-sizing: border-box; font-size: 0px; text-align: center;">
<div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(255, 255, 255); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">
Toolbar.renderCell
</div>
</div>
</div>
</foreignObject>
<text x="575" y="949" fill="#ffffff" font-family="Helvetica" font-size="12px" text-anchor="middle">
Toolbar.renderCell
</text>
</switch>
</g>
<rect x="499" y="940" width="171" height="30" fill="#60a917" stroke="#2d7600" 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: 169px; height: 1px; padding-top: 955px; margin-left: 500px;">
<div data-drawio-colors="color: #ffffff; " style="box-sizing: border-box; font-size: 0px; text-align: center;">
<div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(255, 255, 255); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">
Toolbar.renderCell
</div>
</div>
</div>
</foreignObject>
<text x="585" y="959" fill="#ffffff" font-family="Helvetica" font-size="12px" text-anchor="middle">
Toolbar.renderCell
</text>
</switch>
</g>
<rect x="508" y="950" width="172" height="30" fill="#60a917" stroke="#2d7600" 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: 170px; height: 1px; padding-top: 965px; margin-left: 509px;">
<div data-drawio-colors="color: #ffffff; " style="box-sizing: border-box; font-size: 0px; text-align: center;">
<div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(255, 255, 255); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">
<font style="font-size: 11px">
Toolbar.updateInternalLayoutNow
</font>
</div>
</div>
</div>
</foreignObject>
<text x="594" y="969" fill="#ffffff" font-family="Helvetica" font-size="12px" text-anchor="middle">
Toolbar.updateInternalLayout...
</text>
</switch>
</g>
<rect x="605" y="790" width="75" height="20" fill="none" stroke="none" 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: 73px; height: 1px; padding-top: 800px; margin-left: 606px;">
<div data-drawio-colors="color: #00CCCC; " 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, 204, 204); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">
Next Frame
</div>
</div>
</div>
</foreignObject>
<text x="643" y="804" fill="#00CCCC" font-family="Helvetica" font-size="12px" text-anchor="middle">
Next Frame
</text>
</switch>
</g>
<rect x="605" y="540" width="75" height="20" fill="none" stroke="none" 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: 73px; height: 1px; padding-top: 550px; margin-left: 606px;">
<div data-drawio-colors="color: #00CCCC; " 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, 204, 204); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">
<font color="#009900">
DOM Read
</font>
</div>
</div>
</div>
</foreignObject>
<text x="643" y="554" fill="#00CCCC" font-family="Helvetica" font-size="12px" text-anchor="middle">
DOM Read
</text>
</switch>
</g>
<rect x="605" y="340" width="75" height="20" fill="none" stroke="none" 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: 73px; height: 1px; padding-top: 350px; margin-left: 606px;">
<div data-drawio-colors="color: #00CCCC; " 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, 204, 204); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">
<font color="#ff0000">
DOM Write
</font>
</div>
</div>
</div>
</foreignObject>
<text x="643" y="354" fill="#00CCCC" font-family="Helvetica" font-size="12px" text-anchor="middle">
DOM Write
</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%">
Viewer does not support full SVG 1.1
</text>
</a>
</switch>
</svg>
Reference in New Issue View Git Blame Copy Permalink