Make Output Port appear under visualisation when visualisation pane open

[AdRiley]

• The below diagram just shows the general concept and should not be relied on for colors/spacing/shape
• Refer to figma or existing spacing/shape/color for actual implementation

[farmaazon]

Refinement note:

• The issue includes moving edges ends to actual output port position (updating the port rects properly). They should be updated when visualization opens.
• For first PR, do not spent too much time on making nice E2E tests, because we must confirm the design is good first.
• Make sure the interactions with "selection highlight" are good (intuitive for the user).

[kazcw]

When this is implemented, we should reapply the changes in #9848 to close #9783. Currently, when the visualization is open we are layering the output ports in between the visualization background and its toolbars. Once the ports are moved, the visualization can have its own stacking context because nothing needs to be sandwiched between its elements.

[enso-bot[bot]]

Paweł Grabarz reports a new STANDUP for the provided date (2024-05-27):

Progress: Moved port area based on visualization height, fixing issues with reported visualization sizes. It should be finished by 2024-06-10.

[enso-bot[bot]]

Paweł Grabarz reports a new STANDUP for the provided date (2024-05-28):

Progress: Fixed node width and visualization rect calculation. Implemented masking for outgoing edges to not render between output port and a node. It should be finished by 2024-06-10.