Conversation
Fixes #9240 Note1: Spreadsheet tabs initial alignment is wrong if the first tab is not the selected one when Spreadsheet is placed on Dialog. This is not regression from this PR, but a different bug that needs to be addressed separately. Note2: When Spreadsheet is in Dialog, inserting comment does not work. This is not regression from this PR, as inserting comment after this PR still works, when Spreadsheet is not in Dialog. This is different bug that needs to be address separately. - Actually these bugs happen also with Vaadin 24.10, so they are not regressions from Dialog's native popover refactor.
|
Contributor
|
There's one issue I found and it relates with the modal dialogs. Perhaps, with the usage of native popover, there's no need to have the Modal Dialog (doesn't work)ss-dialog-popover.mp4Modaless Dialog (works)ss-modeless-dialog-popover.mp4There are also a lot of errors logged in the client console when the It seems to be unrelated to these changes, though, as I verified it in |
Contributor
Author
@DiegoCardoso Exactly. Thus I would prefer to do separate PR about that, which could be more clearly backported to Vaadin 24 as well. The native popover implementation is Vaadin 25 specific. |
Contributor
|
I've created PR #9303 based on this (still in draft). The main change is to render the overlays as children of the Spreadsheet instances instead of appending them to , which fixes the issue with modal dialogs. This also resolves the issue mentioned above regarding adding comments to cells when a Spreadsheet is inside a dialog. |
Contributor
|
Closing in favor of #9303 |
This was referenced Jun 11, 2026
DiegoCardoso
added a commit
that referenced
this pull request
Jun 11, 2026
…CP: 25.2) (#9495) This PR cherry-picks changes from the original PR #9303 to branch 25.2. --- #### Original PR description > The spreadsheet attaches a `<div id="spreadsheet-overlays">` to host its overlay widgets (context menu, tooltips, comment overlays, popup buttons). It has historically lived in `<body>` to escape clipping by ancestor `overflow`/`transform` rules and as a singleton shared by all spreadsheet instances on the page. Switching the overlays to native popover changes the picture: every overlay enters the top layer regardless of DOM position, so neither the body-attachment nor the singleton are load-bearing anymore. > > This PR includes the native popover changes proposed in #9270 and adds the structural changes that the popover approach enables: > > - the container moves into the `<vaadin-spreadsheet>` light DOM, projected into the shadow root via a new `overlays` slot, with one container per instance; > - the reference is threaded from JS into the GWT widget chain instead of being looked up by id; > - `SpreadsheetConnector` — not `ApplicationConnection` — now owns the `SpreadsheetContextMenu`. > > Tooltips and the cell-comment overlay are created in `SheetWidget`'s constructor (before the host is known), so the container is wired in via a setter rather than a constructor argument. > > A side benefit: spreadsheet overlays inside a modal `Dialog` are interactive again. The modal sets `body { pointer-events: none }` to disable everything outside the dialog overlay; with the container now inside the dialog's slotted content, the overlays inherit `pointer-events: auto` from the dialog's overlay part instead of `pointer-events: none` from `<body>`. > > Intended to replace #9270. > > Related to #9270 > > --- > > 🤖 Generated with Claude Code Co-authored-by: Diego Cardoso <diego@vaadin.com> Co-authored-by: Tatu Lund <tatu@vaadin.com> Co-authored-by: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
DiegoCardoso
added a commit
that referenced
this pull request
Jun 12, 2026
…CP: 25.1) (#9496) This PR cherry-picks changes from the original PR #9303 to branch 25.1. --- #### Original PR description > The spreadsheet attaches a `<div id="spreadsheet-overlays">` to host its overlay widgets (context menu, tooltips, comment overlays, popup buttons). It has historically lived in `<body>` to escape clipping by ancestor `overflow`/`transform` rules and as a singleton shared by all spreadsheet instances on the page. Switching the overlays to native popover changes the picture: every overlay enters the top layer regardless of DOM position, so neither the body-attachment nor the singleton are load-bearing anymore. > > This PR includes the native popover changes proposed in #9270 and adds the structural changes that the popover approach enables: > > - the container moves into the `<vaadin-spreadsheet>` light DOM, projected into the shadow root via a new `overlays` slot, with one container per instance; > - the reference is threaded from JS into the GWT widget chain instead of being looked up by id; > - `SpreadsheetConnector` — not `ApplicationConnection` — now owns the `SpreadsheetContextMenu`. > > Tooltips and the cell-comment overlay are created in `SheetWidget`'s constructor (before the host is known), so the container is wired in via a setter rather than a constructor argument. > > A side benefit: spreadsheet overlays inside a modal `Dialog` are interactive again. The modal sets `body { pointer-events: none }` to disable everything outside the dialog overlay; with the container now inside the dialog's slotted content, the overlays inherit `pointer-events: auto` from the dialog's overlay part instead of `pointer-events: none` from `<body>`. > > Intended to replace #9270. > > Related to #9270 > > --- > > 🤖 Generated with Claude Code Co-authored-by: Diego Cardoso <diego@vaadin.com> Co-authored-by: Tatu Lund <tatu@vaadin.com> Co-authored-by: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
DiegoCardoso
added a commit
that referenced
this pull request
Jun 12, 2026
…CP: 25.0) (#9497) This PR cherry-picks changes from the original PR #9303 to branch 25.0. --- #### Original PR description > The spreadsheet attaches a `<div id="spreadsheet-overlays">` to host its overlay widgets (context menu, tooltips, comment overlays, popup buttons). It has historically lived in `<body>` to escape clipping by ancestor `overflow`/`transform` rules and as a singleton shared by all spreadsheet instances on the page. Switching the overlays to native popover changes the picture: every overlay enters the top layer regardless of DOM position, so neither the body-attachment nor the singleton are load-bearing anymore. > > This PR includes the native popover changes proposed in #9270 and adds the structural changes that the popover approach enables: > > - the container moves into the `<vaadin-spreadsheet>` light DOM, projected into the shadow root via a new `overlays` slot, with one container per instance; > - the reference is threaded from JS into the GWT widget chain instead of being looked up by id; > - `SpreadsheetConnector` — not `ApplicationConnection` — now owns the `SpreadsheetContextMenu`. > > Tooltips and the cell-comment overlay are created in `SheetWidget`'s constructor (before the host is known), so the container is wired in via a setter rather than a constructor argument. > > A side benefit: spreadsheet overlays inside a modal `Dialog` are interactive again. The modal sets `body { pointer-events: none }` to disable everything outside the dialog overlay; with the container now inside the dialog's slotted content, the overlays inherit `pointer-events: auto` from the dialog's overlay part instead of `pointer-events: none` from `<body>`. > > Intended to replace #9270. > > Related to #9270 > > --- > > 🤖 Generated with Claude Code Co-authored-by: Diego Cardoso <diego@vaadin.com> Co-authored-by: Tatu Lund <tatu@vaadin.com> Co-authored-by: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
3 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Fixes #9240
Note1: Spreadsheet tabs initial alignment is wrong if the first tab is not the selected one when Spreadsheet is placed on Dialog. This is not regression from this PR, but a different bug that needs to be addressed separately.
Note2: When Spreadsheet is in Dialog, inserting comment does not work. This is not regression from this PR, as inserting comment after this PR still works, when Spreadsheet is not in Dialog. This is different bug that needs to be address separately.