Microsoft/vscode
1
0
Fork 0
mirror of https://github.com/microsoft/vscode.git synced 2026-05-27 02:37:26 +01:00
Code Issues Packages Projects Releases Wiki Activity

Separate content and overlay.

Browse Source
This commit is contained in:
rebornix
2022-11-06 21:12:36 -08:00
parent 0c121703bb
commit f9fb40f633
22 changed files with 430 additions and 248 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/vs/workbench/contrib/notebook/browser/docs/viewport-rendering.drawio.svg
+147 -147
View File
@@ -1,22 +1,22 @@
<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;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&lt;/diagram&gt;&lt;/mxfile&gt;" style="background-color: rgb(255, 255, 255);">
<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;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&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="#ffffff" stroke="#000000" stroke-miterlimit="10" pointer-events="all"/>
<path d="M 170 110 L 170 173.63" fill="none" stroke="#000000" 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="#000000" stroke="#000000" stroke-miterlimit="10" pointer-events="all"/>
<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 style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
<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 style="box-sizing: border-box; font-size: 0; text-align: center; ">
<div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: nowrap; ">
<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="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">
<text x="170" y="104" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="12px" text-anchor="middle">
Render Viewport
</text>
</switch>
@@ -24,100 +24,100 @@
<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 style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
<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 style="box-sizing: border-box; font-size: 0; text-align: center; ">
<div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: nowrap; ">
<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="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">
<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="#000000" 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="#000000" stroke="#000000" stroke-miterlimit="10" pointer-events="all"/>
<path d="M 210 220 L 393.63 220" fill="none" stroke="#000000" 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="#000000" stroke="#000000" stroke-miterlimit="10" pointer-events="all"/>
<path d="M 170 180 L 210 220 L 170 260 L 130 220 Z" fill="#ffffff" stroke="#000000" stroke-miterlimit="10" pointer-events="all"/>
<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 style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
<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 style="box-sizing: border-box; font-size: 0; text-align: center; ">
<div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: nowrap; ">
<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="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">
<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="#000000" 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="#000000" stroke="#000000" stroke-miterlimit="10" pointer-events="all"/>
<path d="M 210 380 L 393.63 380" fill="none" stroke="#000000" 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="#000000" stroke="#000000" stroke-miterlimit="10" pointer-events="all"/>
<path d="M 170 340 L 210 380 L 170 420 L 130 380 Z" fill="#ffffff" stroke="#000000" stroke-miterlimit="10" pointer-events="all"/>
<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 style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
<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 style="box-sizing: border-box; font-size: 0; text-align: center; ">
<div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: nowrap; ">
<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="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">
<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="#ffffff" stroke="#000000" stroke-miterlimit="10" pointer-events="all"/>
<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 style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
<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 style="box-sizing: border-box; font-size: 0; text-align: center; ">
<div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: nowrap; ">
<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="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">
<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="#000000" stroke-miterlimit="10" pointer-events="stroke"/>
<path d="M 80 660 L 170 660" fill="none" stroke="#000000" stroke-miterlimit="10" pointer-events="stroke"/>
<path d="M 80 660 L 80 380" fill="none" stroke="#000000" stroke-miterlimit="10" pointer-events="stroke"/>
<path d="M 80 380 L 123.63 380" fill="none" stroke="#000000" 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="#000000" stroke="#000000" stroke-miterlimit="10" pointer-events="all"/>
<rect x="400" y="140" width="280" height="160" fill="none" stroke="#000000" stroke-dasharray="3 3" pointer-events="all"/>
<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 style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
<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 style="box-sizing: border-box; font-size: 0; text-align: center; ">
<div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; ">
<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="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">
<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>
@@ -125,10 +125,10 @@
<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 style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
<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 style="box-sizing: border-box; font-size: 0; text-align: center; ">
<div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #ffffff; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; ">
<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>
@@ -142,10 +142,10 @@
<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 style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
<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 style="box-sizing: border-box; font-size: 0; text-align: center; ">
<div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #ffffff; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; ">
<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>
@@ -159,10 +159,10 @@
<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 style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
<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 style="box-sizing: border-box; font-size: 0; text-align: center; ">
<div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #ffffff; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; ">
<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>
@@ -173,64 +173,64 @@
</text>
</switch>
</g>
<rect x="400" y="340" width="280" height="160" fill="none" stroke="#000000" stroke-dasharray="3 3" pointer-events="all"/>
<path d="M 465 390 L 465 403.63" fill="none" stroke="#000000" 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="#000000" stroke="#000000" stroke-miterlimit="10" pointer-events="all"/>
<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 style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
<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 style="box-sizing: border-box; font-size: 0; text-align: center; ">
<div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; ">
<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="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">
<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="#000000" stroke-miterlimit="10" pointer-events="all"/>
<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 style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
<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 style="box-sizing: border-box; font-size: 0; text-align: center; ">
<div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; ">
<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="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">
<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="#000000" 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="#000000" stroke="#000000" stroke-miterlimit="10" pointer-events="all"/>
<rect x="400" y="540" width="280" height="160" fill="none" stroke="#000000" stroke-dasharray="3 3" pointer-events="all"/>
<path d="M 460 600 L 460 643.63" fill="none" stroke="#000000" 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="#000000" stroke="#000000" stroke-miterlimit="10" pointer-events="all"/>
<path d="M 460 560 L 480 580 L 460 600 L 440 580 Z" fill="none" stroke="#000000" stroke-miterlimit="10" pointer-events="all"/>
<path d="M 460 650 L 480 670 L 460 690 L 440 670 Z" fill="none" stroke="#000000" stroke-miterlimit="10" pointer-events="all"/>
<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 style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
<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 style="box-sizing: border-box; font-size: 0; text-align: center; ">
<div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; ">
<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="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">
<text x="535" y="584" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="12px" text-anchor="middle">
CellPart read DOM
</text>
</switch>
@@ -238,81 +238,81 @@
<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 style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
<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 style="box-sizing: border-box; font-size: 0; text-align: center; ">
<div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; ">
<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="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">
<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="#000000" stroke-miterlimit="10" pointer-events="stroke"/>
<path d="M 240 670 L 240 586.37" fill="none" stroke="#000000" 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="#000000" stroke="#000000" stroke-miterlimit="10" pointer-events="all"/>
<rect x="490" y="440" width="110" height="30" fill="#60a917" stroke="#2d7600" pointer-events="all"/>
<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 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: 455px; margin-left: 491px;">
<div style="box-sizing: border-box; font-size: 0; text-align: center; ">
<div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #ffffff; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; ">
<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="545" y="459" fill="#ffffff" font-family="Helvetica" font-size="12px" text-anchor="middle">
<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="110" height="30" fill="#60a917" stroke="#2d7600" pointer-events="all"/>
<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 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: 465px; margin-left: 500px;">
<div style="box-sizing: border-box; font-size: 0; text-align: center; ">
<div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #ffffff; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; ">
<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="554" y="469" fill="#ffffff" font-family="Helvetica" font-size="12px" text-anchor="middle">
<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="110" height="30" fill="#60a917" stroke="#2d7600" pointer-events="all"/>
<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 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: 475px; margin-left: 509px;">
<div style="box-sizing: border-box; font-size: 0; text-align: center; ">
<div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #ffffff; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; ">
Toolbar.renderCell
<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="563" y="479" fill="#ffffff" font-family="Helvetica" font-size="12px" text-anchor="middle">
Toolbar.renderCell
<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 style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
<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 style="box-sizing: border-box; font-size: 0; text-align: center; ">
<div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #ffffff; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; ">
<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>
@@ -326,10 +326,10 @@
<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 style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
<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 style="box-sizing: border-box; font-size: 0; text-align: center; ">
<div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #ffffff; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; ">
<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>
@@ -343,10 +343,10 @@
<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 style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
<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 style="box-sizing: border-box; font-size: 0; text-align: center; ">
<div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #ffffff; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; ">
<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>
@@ -359,44 +359,44 @@
</text>
</switch>
</g>
<path d="M 0 740 L 721.43 740" fill="none" stroke="#000000" stroke-miterlimit="10" stroke-dasharray="3 3" pointer-events="stroke"/>
<rect x="400" y="790" width="280" height="210" fill="none" stroke="#000000" stroke-dasharray="3 3" pointer-events="all"/>
<path d="M 460 690 L 459.93 783.63" fill="none" stroke="#000000" 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="#000000" stroke="#000000" stroke-miterlimit="10" pointer-events="all"/>
<path d="M 460 850 L 460 883.63" fill="none" stroke="#000000" 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="#000000" stroke="#000000" stroke-miterlimit="10" pointer-events="all"/>
<path d="M 460 810 L 480 830 L 460 850 L 440 830 Z" fill="none" stroke="#000000" stroke-miterlimit="10" pointer-events="all"/>
<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 style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
<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 style="box-sizing: border-box; font-size: 0; text-align: center; ">
<div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; ">
<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="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">
<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="#000000" stroke-miterlimit="10" pointer-events="all"/>
<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 style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
<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 style="box-sizing: border-box; font-size: 0; text-align: center; ">
<div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; ">
<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="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">
<text x="580" y="914" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="12px" text-anchor="middle">
Cell Part updateInternalLayoutNow
</text>
</switch>
@@ -404,10 +404,10 @@
<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 style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
<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 style="box-sizing: border-box; font-size: 0; text-align: center; ">
<div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #ffffff; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; ">
<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>
@@ -421,10 +421,10 @@
<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 style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
<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 style="box-sizing: border-box; font-size: 0; text-align: center; ">
<div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #ffffff; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; ">
<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>
@@ -438,10 +438,10 @@
<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 style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
<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 style="box-sizing: border-box; font-size: 0; text-align: center; ">
<div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #ffffff; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; ">
<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>
@@ -457,10 +457,10 @@
<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 style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
<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 style="box-sizing: border-box; font-size: 0; text-align: center; ">
<div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #00CCCC; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; ">
<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>
@@ -474,10 +474,10 @@
<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 style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
<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 style="box-sizing: border-box; font-size: 0; text-align: center; ">
<div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #00CCCC; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; ">
<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>
@@ -493,10 +493,10 @@
<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 style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
<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 style="box-sizing: border-box; font-size: 0; text-align: center; ">
<div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #00CCCC; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; ">
<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>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 42 KiB

After

Width:  |  Height:  |  Size: 44 KiB

src/vs/workbench/contrib/notebook/browser/notebookEditorWidget.ts
+8 -1
View File
@@ -89,7 +89,14 @@ const $ = DOM.$;
export function getDefaultNotebookCreationOptions(): INotebookEditorCreationOptions {
// We inlined the id to avoid loading comment contrib in tests
const skipContributions = ['editor.contrib.review', FloatingClickMenu.ID];
const skipContributions = [
'editor.contrib.review',
FloatingClickMenu.ID,
'editor.contrib.dirtydiff',
'editor.contrib.testingOutputPeek',
'editor.contrib.testingDecorations',
'store.contrib.stickyScrollController'
];
const contributions = EditorExtensionsRegistry.getEditorContributions().filter(c => skipContributions.indexOf(c.id) === -1);
return {
src/vs/workbench/contrib/notebook/browser/view/cellPart.ts
+122 -15
View File
@@ -3,12 +3,13 @@
* Licensed under the MIT License. See License.txt in the project root for license information.
*--------------------------------------------------------------------------------------------*/
import { Disposable, DisposableStore } from 'vs/base/common/lifecycle';
import * as DOM from 'vs/base/browser/dom';
import { Disposable, DisposableStore, IDisposable } from 'vs/base/common/lifecycle';
import { ICellViewModel } from 'vs/workbench/contrib/notebook/browser/notebookBrowser';
import { CellViewModelStateChangeEvent } from 'vs/workbench/contrib/notebook/browser/notebookViewEvents';
import { ICellExecutionStateChangedEvent } from 'vs/workbench/contrib/notebook/common/notebookExecutionStateService';
export abstract class CellPart extends Disposable {
export abstract class CellContentPart extends Disposable {
protected currentCell: ICellViewModel | undefined;
protected cellDisposables = new DisposableStore();
@@ -16,6 +17,12 @@ export abstract class CellPart extends Disposable {
super();
}
/**
* Prepare model for cell part rendering
* No DOM operations recommended within this operation
*/
prepareRenderCell(element: ICellViewModel): void { }
/**
* Update the DOM for the cell `element`
*/
@@ -57,49 +64,149 @@ export abstract class CellPart extends Disposable {
updateForExecutionState(element: ICellViewModel, e: ICellExecutionStateChangedEvent): void { }
}
export class CellPartsCollection {
export abstract class CellOverlayPart extends Disposable {
protected currentCell: ICellViewModel | undefined;
protected cellDisposables = new DisposableStore();
constructor(
private readonly parts: readonly CellPart[],
) { }
concat(other: readonly CellPart[]): CellPartsCollection {
return new CellPartsCollection(this.parts.concat(other));
constructor() {
super();
}
/**
* Prepare model for cell part rendering
* No DOM operations recommended within this operation
*/
prepareRenderCell(element: ICellViewModel): void { }
/**
* Update the DOM for the cell `element`
*/
renderCell(element: ICellViewModel): void {
for (const part of this.parts) {
this.currentCell = element;
this.didRenderCell(element);
}
protected didRenderCell(element: ICellViewModel): void { }
/**
* Dispose any disposables generated from `didRenderCell`
*/
unrenderCell(element: ICellViewModel): void {
this.currentCell = undefined;
this.cellDisposables.clear();
}
/**
* Update internal DOM (top positions) per cell layout info change
* Note that a cell part doesn't need to call `DOM.scheduleNextFrame`,
* the list view will ensure that layout call is invoked in the right frame
*/
updateInternalLayoutNow(element: ICellViewModel): void { }
/**
* Update per cell state change
*/
updateState(element: ICellViewModel, e: CellViewModelStateChangeEvent): void { }
/**
* Update per execution state change.
*/
updateForExecutionState(element: ICellViewModel, e: ICellExecutionStateChangedEvent): void { }
}
export class CellPartsCollection {
private _scheduledOverlayRendering: IDisposable | undefined;
private _scheduledOverlayUpdateState: IDisposable | undefined;
private _scheduledOverlayUpdateExecutionState: IDisposable | undefined;
constructor(
private readonly contentParts: readonly CellContentPart[],
private readonly overlayParts: readonly CellOverlayPart[]
) { }
concatContentPart(other: readonly CellContentPart[]): CellPartsCollection {
return new CellPartsCollection(this.contentParts.concat(other), this.overlayParts);
}
concatOverlayPart(other: readonly CellOverlayPart[]): CellPartsCollection {
return new CellPartsCollection(this.contentParts, this.overlayParts.concat(other));
}
scheduleRenderCell(element: ICellViewModel): void {
// prepare model
for (const part of this.contentParts) {
part.prepareRenderCell(element);
}
for (const part of this.overlayParts) {
part.prepareRenderCell(element);
}
// render content parts
for (const part of this.contentParts) {
part.renderCell(element);
}
// schedule overlay parts rendering
this._scheduledOverlayRendering?.dispose();
this._scheduledOverlayRendering = DOM.modify(() => {
for (const part of this.overlayParts) {
part.renderCell(element);
}
});
}
unrenderCell(element: ICellViewModel): void {
for (const part of this.parts) {
for (const part of this.contentParts) {
part.unrenderCell(element);
}
this._scheduledOverlayRendering?.dispose();
this._scheduledOverlayUpdateState?.dispose();
this._scheduledOverlayUpdateExecutionState?.dispose();
for (const part of this.overlayParts) {
part.unrenderCell(element);
}
}
updateInternalLayoutNow(viewCell: ICellViewModel) {
for (const part of this.parts) {
for (const part of this.contentParts) {
part.updateInternalLayoutNow(viewCell);
}
}
prepareLayout() {
for (const part of this.parts) {
for (const part of this.contentParts) {
part.prepareLayout();
}
}
updateState(viewCell: ICellViewModel, e: CellViewModelStateChangeEvent) {
for (const part of this.parts) {
for (const part of this.contentParts) {
part.updateState(viewCell, e);
}
this._scheduledOverlayUpdateState?.dispose();
this._scheduledOverlayUpdateState = DOM.modify(() => {
for (const part of this.overlayParts) {
part.updateState(viewCell, e);
}
});
}
updateForExecutionState(viewCell: ICellViewModel, e: ICellExecutionStateChangedEvent) {
for (const part of this.parts) {
for (const part of this.contentParts) {
part.updateForExecutionState(viewCell, e);
}
this._scheduledOverlayUpdateExecutionState?.dispose();
this._scheduledOverlayUpdateExecutionState = DOM.modify(() => {
for (const part of this.overlayParts) {
part.updateForExecutionState(viewCell, e);
}
});
}
}
src/vs/workbench/contrib/notebook/browser/view/cellParts/cellComments.ts
+2 -2
View File
@@ -14,12 +14,12 @@ import { IThemeService } from 'vs/platform/theme/common/themeService';
import { ICommentService } from 'vs/workbench/contrib/comments/browser/commentService';
import { CommentThreadWidget } from 'vs/workbench/contrib/comments/browser/commentThreadWidget';
import { ICellViewModel, INotebookEditorDelegate } from 'vs/workbench/contrib/notebook/browser/notebookBrowser';
import { CellPart } from 'vs/workbench/contrib/notebook/browser/view/cellPart';
import { CellContentPart } from 'vs/workbench/contrib/notebook/browser/view/cellPart';
import { CodeCellViewModel } from 'vs/workbench/contrib/notebook/browser/viewModel/codeCellViewModel';
import { CellKind } from 'vs/workbench/contrib/notebook/common/notebookCommon';
import { ICellRange } from 'vs/workbench/contrib/notebook/common/notebookRange';
export class CellComments extends CellPart {
export class CellComments extends CellContentPart {
private _initialized: boolean = false;
private _commentThreadWidget: CommentThreadWidget<ICellRange> | null = null;
private currentElement: CodeCellViewModel | undefined;
src/vs/workbench/contrib/notebook/browser/view/cellParts/cellContextKeys.ts
+2 -2
View File
@@ -8,14 +8,14 @@ import { IContextKey, IContextKeyService } from 'vs/platform/contextkey/common/c
import { IInstantiationService } from 'vs/platform/instantiation/common/instantiation';
import { CellEditState, CellFocusMode, ICellViewModel, INotebookEditorDelegate } from 'vs/workbench/contrib/notebook/browser/notebookBrowser';
import { CellViewModelStateChangeEvent } from 'vs/workbench/contrib/notebook/browser/notebookViewEvents';
import { CellPart } from 'vs/workbench/contrib/notebook/browser/view/cellPart';
import { CellContentPart } from 'vs/workbench/contrib/notebook/browser/view/cellPart';
import { CodeCellViewModel } from 'vs/workbench/contrib/notebook/browser/viewModel/codeCellViewModel';
import { MarkupCellViewModel } from 'vs/workbench/contrib/notebook/browser/viewModel/markupCellViewModel';
import { NotebookCellExecutionState } from 'vs/workbench/contrib/notebook/common/notebookCommon';
import { NotebookCellExecutionStateContext, NOTEBOOK_CELL_EDITABLE, NOTEBOOK_CELL_EDITOR_FOCUSED, NOTEBOOK_CELL_EXECUTING, NOTEBOOK_CELL_EXECUTION_STATE, NOTEBOOK_CELL_FOCUSED, NOTEBOOK_CELL_HAS_OUTPUTS, NOTEBOOK_CELL_INPUT_COLLAPSED, NOTEBOOK_CELL_LINE_NUMBERS, NOTEBOOK_CELL_MARKDOWN_EDIT_MODE, NOTEBOOK_CELL_OUTPUT_COLLAPSED, NOTEBOOK_CELL_RESOURCE, NOTEBOOK_CELL_TYPE } from 'vs/workbench/contrib/notebook/common/notebookContextKeys';
import { INotebookExecutionStateService } from 'vs/workbench/contrib/notebook/common/notebookExecutionStateService';
export class CellContextKeyPart extends CellPart {
export class CellContextKeyPart extends CellContentPart {
private cellContextKeyManager: CellContextKeyManager;
constructor(
src/vs/workbench/contrib/notebook/browser/view/cellParts/cellDecorations.ts
+2 -2
View File
@@ -5,9 +5,9 @@
import * as DOM from 'vs/base/browser/dom';
import { ICellViewModel } from 'vs/workbench/contrib/notebook/browser/notebookBrowser';
import { CellPart } from 'vs/workbench/contrib/notebook/browser/view/cellPart';
import { CellContentPart } from 'vs/workbench/contrib/notebook/browser/view/cellPart';
export class CellDecorations extends CellPart {
export class CellDecorations extends CellContentPart {
constructor(
readonly rootContainer: HTMLElement,
readonly decorationContainer: HTMLElement,
src/vs/workbench/contrib/notebook/browser/view/cellParts/cellDnd.ts
+2 -2
View File
@@ -9,7 +9,7 @@ import { Disposable, MutableDisposable } from 'vs/base/common/lifecycle';
import * as platform from 'vs/base/common/platform';
import { expandCellRangesWithHiddenCells, ICellViewModel, INotebookEditorDelegate } from 'vs/workbench/contrib/notebook/browser/notebookBrowser';
import { CellViewModelStateChangeEvent } from 'vs/workbench/contrib/notebook/browser/notebookViewEvents';
import { CellPart } from 'vs/workbench/contrib/notebook/browser/view/cellPart';
import { CellContentPart } from 'vs/workbench/contrib/notebook/browser/view/cellPart';
import { BaseCellRenderTemplate, INotebookCellList } from 'vs/workbench/contrib/notebook/browser/view/notebookRenderingCommon';
import { cloneNotebookCellTextModel } from 'vs/workbench/contrib/notebook/common/model/notebookCellTextModel';
import { CellEditType, ICellMoveEdit, SelectionStateType } from 'vs/workbench/contrib/notebook/common/notebookCommon';
@@ -30,7 +30,7 @@ interface CellDragEvent {
dragPosRatio: number;
}
export class CellDragAndDropPart extends CellPart {
export class CellDragAndDropPart extends CellContentPart {
constructor(
private readonly container: HTMLElement
) {
src/vs/workbench/contrib/notebook/browser/view/cellParts/cellEditorOptions.ts
+2 -2
View File
@@ -17,12 +17,12 @@ import { ActiveEditorContext } from 'vs/workbench/common/contextkeys';
import { INotebookCellToolbarActionContext, INotebookCommandContext, NotebookMultiCellAction, NOTEBOOK_ACTIONS_CATEGORY } from 'vs/workbench/contrib/notebook/browser/controller/coreActions';
import { IBaseCellEditorOptions, ICellViewModel } from 'vs/workbench/contrib/notebook/browser/notebookBrowser';
import { NOTEBOOK_CELL_LINE_NUMBERS, NOTEBOOK_EDITOR_FOCUSED } from 'vs/workbench/contrib/notebook/common/notebookContextKeys';
import { CellPart } from 'vs/workbench/contrib/notebook/browser/view/cellPart';
import { CellContentPart } from 'vs/workbench/contrib/notebook/browser/view/cellPart';
import { NotebookCellInternalMetadata, NOTEBOOK_EDITOR_ID } from 'vs/workbench/contrib/notebook/common/notebookCommon';
import { NotebookOptions } from 'vs/workbench/contrib/notebook/common/notebookOptions';
import { CellViewModelStateChangeEvent } from 'vs/workbench/contrib/notebook/browser/notebookViewEvents';
export class CellEditorOptions extends CellPart {
export class CellEditorOptions extends CellContentPart {
private _lineNumbers: 'on' | 'off' | 'inherit' = 'inherit';
private readonly _onDidChange = this._register(new Emitter<void>());
readonly onDidChange: Event<void> = this._onDidChange.event;
src/vs/workbench/contrib/notebook/browser/view/cellParts/cellExecution.ts
+2 -2
View File
@@ -8,13 +8,13 @@ import { disposableTimeout } from 'vs/base/common/async';
import { DisposableStore } from 'vs/base/common/lifecycle';
import { ICellViewModel, INotebookEditorDelegate } from 'vs/workbench/contrib/notebook/browser/notebookBrowser';
import { CellViewModelStateChangeEvent } from 'vs/workbench/contrib/notebook/browser/notebookViewEvents';
import { CellPart } from 'vs/workbench/contrib/notebook/browser/view/cellPart';
import { CellContentPart } from 'vs/workbench/contrib/notebook/browser/view/cellPart';
import { NotebookCellInternalMetadata } from 'vs/workbench/contrib/notebook/common/notebookCommon';
import { INotebookExecutionStateService } from 'vs/workbench/contrib/notebook/common/notebookExecutionStateService';
const UPDATE_EXECUTION_ORDER_GRACE_PERIOD = 200;
export class CellExecutionPart extends CellPart {
export class CellExecutionPart extends CellContentPart {
private kernelDisposables = this._register(new DisposableStore());
constructor(
src/vs/workbench/contrib/notebook/browser/view/cellParts/cellFocus.ts
+2 -2
View File
@@ -5,10 +5,10 @@
import * as DOM from 'vs/base/browser/dom';
import { INotebookEditor } from 'vs/workbench/contrib/notebook/browser/notebookBrowser';
import { CellPart } from 'vs/workbench/contrib/notebook/browser/view/cellPart';
import { CellContentPart } from 'vs/workbench/contrib/notebook/browser/view/cellPart';
import { CodeCellViewModel } from 'vs/workbench/contrib/notebook/browser/viewModel/codeCellViewModel';
export class CellFocusPart extends CellPart {
export class CellFocusPart extends CellContentPart {
constructor(
containerElement: HTMLElement,
focusSinkElement: HTMLElement | undefined,
src/vs/workbench/contrib/notebook/browser/view/cellParts/cellFocusIndicator.ts
+2 -2
View File
@@ -6,13 +6,13 @@
import * as DOM from 'vs/base/browser/dom';
import { FastDomNode } from 'vs/base/browser/fastDomNode';
import { CodeCellLayoutInfo, ICellViewModel, INotebookEditorDelegate } from 'vs/workbench/contrib/notebook/browser/notebookBrowser';
import { CellPart } from 'vs/workbench/contrib/notebook/browser/view/cellPart';
import { CellContentPart } from 'vs/workbench/contrib/notebook/browser/view/cellPart';
import { CellTitleToolbarPart } from 'vs/workbench/contrib/notebook/browser/view/cellParts/cellToolbars';
import { CodeCellViewModel } from 'vs/workbench/contrib/notebook/browser/viewModel/codeCellViewModel';
import { MarkupCellViewModel } from 'vs/workbench/contrib/notebook/browser/viewModel/markupCellViewModel';
import { CellKind } from 'vs/workbench/contrib/notebook/common/notebookCommon';
export class CellFocusIndicator extends CellPart {
export class CellFocusIndicator extends CellContentPart {
public codeFocusIndicator: FastDomNode<HTMLElement>;
public outputFocusIndicator: FastDomNode<HTMLElement>;
src/vs/workbench/contrib/notebook/browser/view/cellParts/cellOutput.ts
+2 -2
View File
@@ -24,7 +24,7 @@ import { IExtensionsViewPaneContainer, VIEWLET_ID as EXTENSION_VIEWLET_ID } from
import { INotebookCellActionContext } from 'vs/workbench/contrib/notebook/browser/controller/coreActions';
import { ICellOutputViewModel, ICellViewModel, IInsetRenderOutput, INotebookEditorDelegate, JUPYTER_EXTENSION_ID, RenderOutputType } from 'vs/workbench/contrib/notebook/browser/notebookBrowser';
import { mimetypeIcon } from 'vs/workbench/contrib/notebook/browser/notebookIcons';
import { CellPart } from 'vs/workbench/contrib/notebook/browser/view/cellPart';
import { CellContentPart } from 'vs/workbench/contrib/notebook/browser/view/cellPart';
import { CodeCellRenderTemplate } from 'vs/workbench/contrib/notebook/browser/view/notebookRenderingCommon';
import { CodeCellViewModel } from 'vs/workbench/contrib/notebook/browser/viewModel/codeCellViewModel';
import { NotebookTextModel } from 'vs/workbench/contrib/notebook/common/model/notebookTextModel';
@@ -427,7 +427,7 @@ class OutputEntryViewHandler {
}
}
export class CellOutputContainer extends CellPart {
export class CellOutputContainer extends CellContentPart {
private _outputEntries: OutputEntryViewHandler[] = [];
get renderedOutputEntries() {
src/vs/workbench/contrib/notebook/browser/view/cellParts/cellProgressBar.ts
+2 -2
View File
@@ -7,11 +7,11 @@ import { ProgressBar } from 'vs/base/browser/ui/progressbar/progressbar';
import { getProgressBarStyles } from 'vs/platform/theme/browser/defaultStyles';
import { ICellViewModel } from 'vs/workbench/contrib/notebook/browser/notebookBrowser';
import { CellViewModelStateChangeEvent } from 'vs/workbench/contrib/notebook/browser/notebookViewEvents';
import { CellPart } from 'vs/workbench/contrib/notebook/browser/view/cellPart';
import { CellContentPart } from 'vs/workbench/contrib/notebook/browser/view/cellPart';
import { NotebookCellExecutionState } from 'vs/workbench/contrib/notebook/common/notebookCommon';
import { ICellExecutionStateChangedEvent, INotebookExecutionStateService } from 'vs/workbench/contrib/notebook/common/notebookExecutionStateService';
export class CellProgressBar extends CellPart {
export class CellProgressBar extends CellContentPart {
private readonly _progressBar: ProgressBar;
private readonly _collapsedProgressBar: ProgressBar;
src/vs/workbench/contrib/notebook/browser/view/cellParts/cellStatusPart.ts
+2 -2
View File
@@ -22,7 +22,7 @@ import { ITelemetryService } from 'vs/platform/telemetry/common/telemetry';
import { IThemeService, ThemeColor } from 'vs/platform/theme/common/themeService';
import { INotebookCellActionContext } from 'vs/workbench/contrib/notebook/browser/controller/coreActions';
import { CellFocusMode, ICellViewModel, INotebookEditorDelegate } from 'vs/workbench/contrib/notebook/browser/notebookBrowser';
import { CellPart } from 'vs/workbench/contrib/notebook/browser/view/cellPart';
import { CellContentPart } from 'vs/workbench/contrib/notebook/browser/view/cellPart';
import { ClickTargetType, IClickTarget } from 'vs/workbench/contrib/notebook/browser/view/cellParts/cellWidgets';
import { CodeCellViewModel } from 'vs/workbench/contrib/notebook/browser/viewModel/codeCellViewModel';
import { CellStatusbarAlignment, INotebookCellStatusBarItem } from 'vs/workbench/contrib/notebook/common/notebookCommon';
@@ -30,7 +30,7 @@ import { CellStatusbarAlignment, INotebookCellStatusBarItem } from 'vs/workbench
const $ = DOM.$;
export class CellEditorStatusBar extends CellPart {
export class CellEditorStatusBar extends CellContentPart {
readonly statusBarContainer: HTMLElement;
private readonly leftItemsContainer: HTMLElement;
src/vs/workbench/contrib/notebook/browser/view/cellParts/cellToolbars.ts
+106 -42
View File
@@ -19,31 +19,37 @@ import { IKeybindingService } from 'vs/platform/keybinding/common/keybinding';
import { INotebookCellActionContext } from 'vs/workbench/contrib/notebook/browser/controller/coreActions';
import { ICellViewModel, INotebookEditorDelegate } from 'vs/workbench/contrib/notebook/browser/notebookBrowser';
import { CodiconActionViewItem } from 'vs/workbench/contrib/notebook/browser/view/cellParts/cellActionView';
import { CellPart } from 'vs/workbench/contrib/notebook/browser/view/cellPart';
import { CellOverlayPart } from 'vs/workbench/contrib/notebook/browser/view/cellPart';
import { registerStickyScroll } from 'vs/workbench/contrib/notebook/browser/view/cellParts/stickyScroll';
import { WorkbenchToolBar } from 'vs/platform/actions/browser/toolbar';
export class BetweenCellToolbar extends CellPart {
private _betweenCellToolbar!: ToolBar;
export class BetweenCellToolbar extends CellOverlayPart {
private _betweenCellToolbar: ToolBar | undefined;
constructor(
private readonly _notebookEditor: INotebookEditorDelegate,
_titleToolbarContainer: HTMLElement,
private readonly _bottomCellToolbarContainer: HTMLElement,
@IInstantiationService instantiationService: IInstantiationService,
@IContextMenuService contextMenuService: IContextMenuService,
@IContextKeyService contextKeyService: IContextKeyService,
@IMenuService menuService: IMenuService
@IInstantiationService private readonly instantiationService: IInstantiationService,
@IContextMenuService private readonly contextMenuService: IContextMenuService,
@IContextKeyService private readonly contextKeyService: IContextKeyService,
@IMenuService private readonly menuService: IMenuService
) {
super();
}
this._betweenCellToolbar = this._register(new ToolBar(this._bottomCellToolbarContainer, contextMenuService, {
private _initialize(): ToolBar {
if (this._betweenCellToolbar) {
return this._betweenCellToolbar;
}
const betweenCellToolbar = this._register(new ToolBar(this._bottomCellToolbarContainer, this.contextMenuService, {
actionViewItemProvider: action => {
if (action instanceof MenuItemAction) {
if (this._notebookEditor.notebookOptions.getLayoutConfiguration().insertToolbarAlignment === 'center') {
return instantiationService.createInstance(CodiconActionViewItem, action, undefined);
return this.instantiationService.createInstance(CodiconActionViewItem, action, undefined);
} else {
return instantiationService.createInstance(MenuEntryActionViewItem, action, undefined);
return this.instantiationService.createInstance(MenuEntryActionViewItem, action, undefined);
}
}
@@ -51,10 +57,11 @@ export class BetweenCellToolbar extends CellPart {
}
}));
const menu = this._register(menuService.createMenu(this._notebookEditor.creationOptions.menuIds.cellInsertToolbar, contextKeyService));
this._betweenCellToolbar = betweenCellToolbar;
const menu = this._register(this.menuService.createMenu(this._notebookEditor.creationOptions.menuIds.cellInsertToolbar, this.contextKeyService));
const updateActions = () => {
const actions = getCellToolbarActions(menu);
this._betweenCellToolbar.setActions(actions.primary, actions.secondary);
betweenCellToolbar.setActions(actions.primary, actions.secondary);
};
this._register(menu.onDidChange(() => updateActions()));
@@ -63,15 +70,15 @@ export class BetweenCellToolbar extends CellPart {
updateActions();
}
}));
updateActions();
}
updateContext(context: INotebookCellActionContext) {
this._betweenCellToolbar.context = context;
updateActions();
return betweenCellToolbar;
}
override didRenderCell(element: ICellViewModel): void {
this._betweenCellToolbar.context = <INotebookCellActionContext>{
const betweenCellToolbar = this._initialize();
betweenCellToolbar.context = <INotebookCellActionContext>{
ui: true,
cell: element,
notebookEditor: this._notebookEditor,
@@ -90,53 +97,110 @@ export interface ICssClassDelegate {
toggle: (className: string, force?: boolean) => void;
}
export class CellTitleToolbarPart extends CellPart {
private _toolbar: ToolBar;
private _titleMenu: IMenu;
private _deleteToolbar: ToolBar;
private _deleteMenu: IMenu;
interface CellTitleToolbarModel {
titleMenu: IMenu;
actions: { primary: IAction[]; secondary: IAction[] };
deleteMenu: IMenu;
deleteActions: { primary: IAction[]; secondary: IAction[] };
}
interface CellTitleToolbarView {
toolbar: ToolBar;
deleteToolbar: ToolBar;
}
export class CellTitleToolbarPart extends CellOverlayPart {
private _model: CellTitleToolbarModel | undefined;
private _view: CellTitleToolbarView | undefined;
private readonly _onDidUpdateActions: Emitter<void> = this._register(new Emitter<void>());
readonly onDidUpdateActions: Event<void> = this._onDidUpdateActions.event;
get hasActions(): boolean {
return this._toolbar.getItemsLength() + this._deleteToolbar.getItemsLength() > 0;
if (!this._model) {
return false;
}
return this._model.actions.primary.length
+ this._model.actions.secondary.length
+ this._model.deleteActions.primary.length
+ this._model.deleteActions.secondary.length
> 0;
}
constructor(
private readonly toolbarContainer: HTMLElement,
private readonly _rootClassDelegate: ICssClassDelegate,
toolbarId: MenuId,
deleteToolbarId: MenuId,
private readonly toolbarId: MenuId,
private readonly deleteToolbarId: MenuId,
private readonly _notebookEditor: INotebookEditorDelegate,
@IContextKeyService contextKeyService: IContextKeyService,
@IMenuService menuService: IMenuService,
@IInstantiationService instantiationService: IInstantiationService,
@IContextKeyService private readonly contextKeyService: IContextKeyService,
@IMenuService private readonly menuService: IMenuService,
@IInstantiationService private readonly instantiationService: IInstantiationService,
) {
super();
}
this._toolbar = instantiationService.createInstance(WorkbenchToolBar, toolbarContainer, {
private _initializeModel(): CellTitleToolbarModel {
if (this._model) {
return this._model;
}
const titleMenu = this._register(this.menuService.createMenu(this.toolbarId, this.contextKeyService));
const deleteMenu = this._register(this.menuService.createMenu(this.deleteToolbarId, this.contextKeyService));
const actions = getCellToolbarActions(titleMenu);
const deleteActions = !this._notebookEditor.creationOptions.isReadOnly ? getCellToolbarActions(deleteMenu) : {
primary: [],
secondary: []
};
this._model = {
titleMenu,
actions,
deleteMenu,
deleteActions
};
return this._model;
}
private _initialize(model: CellTitleToolbarModel): CellTitleToolbarView {
if (this._view) {
return this._view;
}
const toolbar = this.instantiationService.createInstance(WorkbenchToolBar, this.toolbarContainer, {
actionViewItemProvider: action => {
return createActionViewItem(instantiationService, action);
return createActionViewItem(this.instantiationService, action);
},
renderDropdownAsChildElement: true
});
this._titleMenu = this._register(menuService.createMenu(toolbarId, contextKeyService));
this._deleteToolbar = this._register(instantiationService.invokeFunction(accessor => createDeleteToolbar(accessor, toolbarContainer, 'cell-delete-toolbar')));
this._deleteMenu = this._register(menuService.createMenu(deleteToolbarId, contextKeyService));
if (!this._notebookEditor.creationOptions.isReadOnly) {
const deleteActions = getCellToolbarActions(this._deleteMenu);
this._deleteToolbar.setActions(deleteActions.primary, deleteActions.secondary);
const deleteToolbar = this._register(this.instantiationService.invokeFunction(accessor => createDeleteToolbar(accessor, this.toolbarContainer, 'cell-delete-toolbar')));
if (model.deleteActions.primary.length !== 0 || model.deleteActions.secondary.length !== 0) {
deleteToolbar.setActions(model.deleteActions.primary, model.deleteActions.secondary);
}
this.setupChangeListeners(this._toolbar, this._titleMenu);
this.setupChangeListeners(this._deleteToolbar, this._deleteMenu);
this.setupChangeListeners(toolbar, model.titleMenu);
this.setupChangeListeners(deleteToolbar, model.deleteMenu);
this._view = {
toolbar,
deleteToolbar
};
return this._view;
}
override prepareRenderCell(element: ICellViewModel): void {
this._initializeModel();
}
override didRenderCell(element: ICellViewModel): void {
const model = this._initializeModel();
const view = this._initialize(model);
this.cellDisposables.add(registerStickyScroll(this._notebookEditor, element, this.toolbarContainer, { extraOffset: 4, min: -14 }));
this.updateContext(<INotebookCellActionContext>{
this.updateContext(view, <INotebookCellActionContext>{
ui: true,
cell: element,
notebookEditor: this._notebookEditor,
@@ -144,9 +208,9 @@ export class CellTitleToolbarPart extends CellPart {
});
}
private updateContext(toolbarContext: INotebookCellActionContext) {
this._toolbar.context = toolbarContext;
this._deleteToolbar.context = toolbarContext;
private updateContext(view: CellTitleToolbarView, toolbarContext: INotebookCellActionContext) {
view.toolbar.context = toolbarContext;
view.deleteToolbar.context = toolbarContext;
}
private setupChangeListeners(toolbar: ToolBar, menu: IMenu): void {
src/vs/workbench/contrib/notebook/browser/view/cellParts/codeCell.ts
+10 -8
View File
@@ -55,7 +55,7 @@ export class CodeCell extends Disposable {
const cellEditorOptions = this._register(new CellEditorOptions(this.notebookEditor.getBaseCellEditorOptions(viewCell.language), this.notebookEditor.notebookOptions, this.configurationService));
this._outputContainerRenderer = this.instantiationService.createInstance(CellOutputContainer, notebookEditor, viewCell, templateData, { limit: 500 });
this.cellParts = templateData.cellParts.concat([cellEditorOptions, this._outputContainerRenderer]);
this.cellParts = templateData.cellParts.concatContentPart([cellEditorOptions, this._outputContainerRenderer]);
const editorHeight = this.calculateInitEditorHeight();
this.initializeEditor(editorHeight);
@@ -100,7 +100,7 @@ export class CodeCell extends Disposable {
}
}));
this.cellParts.renderCell(this.viewCell);
this.cellParts.scheduleRenderCell(this.viewCell);
this._register(toDisposable(() => {
this.cellParts.unrenderCell(this.viewCell);
@@ -468,12 +468,14 @@ export class CodeCell extends Disposable {
const viewLayout = this.templateData.editor.getLayoutInfo();
this.viewCell.editorHeight = newHeight;
this.relayoutCell();
this.layoutEditor(
{
width: viewLayout.width,
height: newHeight
}
);
DOM.scheduleAtNextAnimationFrame(() => {
this.layoutEditor(
{
width: viewLayout.width,
height: newHeight
}
);
});
}
relayoutCell() {
src/vs/workbench/contrib/notebook/browser/view/cellParts/codeCellRunToolbar.ts
+2 -2
View File
@@ -19,11 +19,11 @@ import { IInstantiationService } from 'vs/platform/instantiation/common/instanti
import { IKeybindingService } from 'vs/platform/keybinding/common/keybinding';
import { INotebookCellActionContext } from 'vs/workbench/contrib/notebook/browser/controller/coreActions';
import { ICellViewModel, INotebookEditorDelegate } from 'vs/workbench/contrib/notebook/browser/notebookBrowser';
import { CellPart } from 'vs/workbench/contrib/notebook/browser/view/cellPart';
import { CellContentPart } from 'vs/workbench/contrib/notebook/browser/view/cellPart';
import { registerStickyScroll } from 'vs/workbench/contrib/notebook/browser/view/cellParts/stickyScroll';
import { NOTEBOOK_CELL_EXECUTION_STATE, NOTEBOOK_CELL_LIST_FOCUSED, NOTEBOOK_CELL_TYPE, NOTEBOOK_EDITOR_FOCUSED } from 'vs/workbench/contrib/notebook/common/notebookContextKeys';
export class RunToolbar extends CellPart {
export class RunToolbar extends CellContentPart {
private toolbar!: ToolBar;
private primaryMenu: IMenu;
src/vs/workbench/contrib/notebook/browser/view/cellParts/collapsedCellInput.ts
+2 -2
View File
@@ -5,9 +5,9 @@
import * as DOM from 'vs/base/browser/dom';
import { INotebookEditor } from 'vs/workbench/contrib/notebook/browser/notebookBrowser';
import { CellPart } from 'vs/workbench/contrib/notebook/browser/view/cellPart';
import { CellContentPart } from 'vs/workbench/contrib/notebook/browser/view/cellPart';
export class CollapsedCellInput extends CellPart {
export class CollapsedCellInput extends CellContentPart {
constructor(
private readonly notebookEditor: INotebookEditor,
cellInputCollapsedContainer: HTMLElement,
src/vs/workbench/contrib/notebook/browser/view/cellParts/collapsedCellOutput.ts
+2 -2
View File
@@ -8,11 +8,11 @@ import { Codicon, CSSIcon } from 'vs/base/common/codicons';
import { localize } from 'vs/nls';
import { IKeybindingService } from 'vs/platform/keybinding/common/keybinding';
import { EXPAND_CELL_OUTPUT_COMMAND_ID, INotebookEditor } from 'vs/workbench/contrib/notebook/browser/notebookBrowser';
import { CellPart } from 'vs/workbench/contrib/notebook/browser/view/cellPart';
import { CellContentPart } from 'vs/workbench/contrib/notebook/browser/view/cellPart';
const $ = DOM.$;
export class CollapsedCellOutput extends CellPart {
export class CollapsedCellOutput extends CellContentPart {
constructor(
private readonly notebookEditor: INotebookEditor,
cellOutputCollapseContainer: HTMLElement,
src/vs/workbench/contrib/notebook/browser/view/cellParts/foldedCellHint.ts
+2 -2
View File
@@ -8,10 +8,10 @@ import { Codicon, CSSIcon } from 'vs/base/common/codicons';
import { localize } from 'vs/nls';
import { FoldingController } from 'vs/workbench/contrib/notebook/browser/controller/foldingController';
import { CellEditState, CellFoldingState, INotebookEditor } from 'vs/workbench/contrib/notebook/browser/notebookBrowser';
import { CellPart } from 'vs/workbench/contrib/notebook/browser/view/cellPart';
import { CellContentPart } from 'vs/workbench/contrib/notebook/browser/view/cellPart';
import { MarkupCellViewModel } from 'vs/workbench/contrib/notebook/browser/viewModel/markupCellViewModel';
export class FoldedCellHint extends CellPart {
export class FoldedCellHint extends CellContentPart {
constructor(
private readonly _notebookEditor: INotebookEditor,
src/vs/workbench/contrib/notebook/browser/view/cellParts/markupCell.ts
+1 -1
View File
@@ -69,7 +69,7 @@ export class MarkupCell extends Disposable {
this.registerListeners();
// update for init state
this.templateData.cellParts.renderCell(this.viewCell);
this.templateData.cellParts.scheduleRenderCell(this.viewCell);
this._register(toDisposable(() => {
this.templateData.cellParts.unrenderCell(this.viewCell);
src/vs/workbench/contrib/notebook/browser/view/renderers/cellRenderer.ts
+6 -4
View File
@@ -166,8 +166,6 @@ export class MarkupCellRenderer extends AbstractCellRenderer implements IListRen
const focusIndicatorBottom = new FastDomNode(DOM.append(container, $('.cell-focus-indicator.cell-focus-indicator-bottom')));
const cellParts = new CellPartsCollection([
titleToolbar,
templateDisposables.add(scopedInstaService.createInstance(BetweenCellToolbar, this.notebookEditor, titleToolbarContainer, bottomCellContainer)),
templateDisposables.add(scopedInstaService.createInstance(CellEditorStatusBar, this.notebookEditor, container, editorPart, undefined)),
templateDisposables.add(new CellFocusIndicator(this.notebookEditor, titleToolbar, focusIndicatorTop, focusIndicatorLeft, focusIndicatorRight, focusIndicatorBottom)),
templateDisposables.add(new FoldedCellHint(this.notebookEditor, DOM.append(container, $('.notebook-folded-hint')))),
@@ -177,6 +175,9 @@ export class MarkupCellRenderer extends AbstractCellRenderer implements IListRen
templateDisposables.add(new CellFocusPart(container, undefined, this.notebookEditor)),
templateDisposables.add(new CellDragAndDropPart(container)),
templateDisposables.add(scopedInstaService.createInstance(CellContextKeyPart, this.notebookEditor)),
], [
titleToolbar,
templateDisposables.add(scopedInstaService.createInstance(BetweenCellToolbar, this.notebookEditor, titleToolbarContainer, bottomCellContainer))
]);
const templateData: MarkdownCellRenderTemplate = {
@@ -307,8 +308,6 @@ export class CodeCellRenderer extends AbstractCellRenderer implements IListRende
const focusIndicatorPart = templateDisposables.add(new CellFocusIndicator(this.notebookEditor, titleToolbar, focusIndicatorTop, focusIndicatorLeft, focusIndicatorRight, focusIndicatorBottom));
const cellParts = new CellPartsCollection([
focusIndicatorPart,
titleToolbar,
templateDisposables.add(scopedInstaService.createInstance(BetweenCellToolbar, this.notebookEditor, titleToolbarContainer, bottomCellToolbarContainer)),
templateDisposables.add(scopedInstaService.createInstance(CellEditorStatusBar, this.notebookEditor, container, editorPart, editor)),
templateDisposables.add(scopedInstaService.createInstance(CellProgressBar, editorPart, cellInputCollapsedContainer)),
templateDisposables.add(scopedInstaService.createInstance(RunToolbar, this.notebookEditor, contextKeyService, container, runButtonContainer)),
@@ -320,6 +319,9 @@ export class CodeCellRenderer extends AbstractCellRenderer implements IListRende
templateDisposables.add(new CellFocusPart(container, focusSinkElement, this.notebookEditor)),
templateDisposables.add(new CellDragAndDropPart(container)),
templateDisposables.add(scopedInstaService.createInstance(CellContextKeyPart, this.notebookEditor)),
], [
titleToolbar,
templateDisposables.add(scopedInstaService.createInstance(BetweenCellToolbar, this.notebookEditor, titleToolbarContainer, bottomCellToolbarContainer))
]);
const templateData: CodeCellRenderTemplate = {