search

datalayer / jupyter-ui

⚛️ React.js components 💯% compatible with 🪐 Jupyter - Storybook on https://jupyter-ui-storybook.datalayer.tech
https://jupyter-ui.datalayer.tech
Other
321 stars 46 forks source link

Right click on the JupyterLabApp component makes the layout to shift up and open bottom panel #194

Open lneves12 opened 7 months ago

lneves12 commented 7 months ago

Description

Right click on the JupyterLabApp component makes the layout to shift up and open bottom panel

Reproduce

81b0c760-405b-4727-bfac-98461d2d2d83.webm

Expected behavior

Context

Browser Output 
Paste the output from your browser Javascript console here.
echarles commented 7 months ago

Thx @lneves12 for reporting. DOM event are indeed surprising with JupyterLab. We need to tackle that in a better way. Maybe wrapping the component in a div with "some" css can help mitigate that sideeffect.

lneves12 commented 7 months ago

Do you know what’s the difference to the normal jupyter lab ui that can be causing this? I will investigate and see if I can help fixing this one

echarles commented 7 months ago

Do you know what’s the difference to the normal jupyter lab ui that can be causing this?

No idea, but mixing jupyterlab and react.js has proven to regularly such side effect. The good news is that it is fixable.

btw I have been discussing such side effects recently with @fcollonval (related to focus event ifrc)

chenjpu commented 6 months ago

Try to define such a style, you can solve it

<style>
    body .lm-Menu {
        top: 1px
    }

  </style>