[lexical-playground] Bug Fix: Keep cell background color modal open on first click#8806
Merged
etrepum merged 1 commit intoJul 8, 2026
Merged
Conversation
…n first click (facebook#8804) The cell 'Background color' modal is rendered inside the tableCellNode != null branch of TableCellActionMenuContainer. Clicking anywhere inside the modal moves the selection out of the editor, so $moveMenu() calls disable() and resets tableCellNode to null, unmounting the modal on the first interaction. Render {colorPickerModal} outside that conditional. The Modal is a portal to document.body, so its JSX position has no layout effect, and it no longer unmounts when the selection leaves the editor. Closes facebook#8804
sahiee-dev
requested review from
acywatson,
etrepum,
fantactuka,
ivailop7,
potatowagon and
zurfyx
as code owners
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
meta-cla
Bot
added
the
CLA Signed
etrepum
approved these changes
Jul 7, 2026
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
2 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.
Description
Current behavior: In
TableCellActionMenuContainer, the modal returned byuseModal()is rendered inside thetableCellNode != nullconditional. On the first click anywhere inside the "Cell background color" modal (the panel chrome,hex input, swatches, saturation area, or hue slider), focus/selection leaves the editor,SELECTION_CHANGE_COMMANDfires and$moveMenu()runs.Since the selection is no longer a range/table selection inside the editor root,
disable()is called ->setTableMenuCellNode(null)-> the conditional unmounts{colorPickerModal}and the modal disappears on that first interaction. Clicking the cell again re-mounts it (theuseModalstate lives in the still-mounted container), which is why it "comes back" and then behaves normally.Changes in this PR: Move
{colorPickerModal}outside thetableCellNode != nullconditional. TheModalis already a portal todocument.body, so its JSX position has no layout effect, and it no longer unmounts when the selection leaves the editor. The modal now stays open on the first click and only closes via the close button, the overlay, or Escape.Closes #8804
Test plan
Before
The modal immediately disappears on that first click.
Screen.Recording.2026-07-07.at.5.05.28.PM.mov
After
Same steps: the modal stays open on the first click, the cell background updates
live as a color is picked, and the modal only closes via the close button, the
overlay, or Escape.
Screen.Recording.2026-07-07.at.5.06.24.PM.mov