Skip to content

fix(sdk): let editor popovers scroll in the create record dialog - #3682

Open
markov12 wants to merge 1 commit into
teableio:developfrom
markov12:fix/create-record-popover-scroll
Open

markov12 wants to merge 1 commit into
teableio:developfrom
markov12:fix/create-record-popover-scroll

Conversation

@markov12

Copy link
Copy Markdown

Problem

In the Add record dialog, long option lists in field editors cannot be scrolled with the mouse wheel. The user picker (user field) is the easiest way to see it: with more users than fit in the list, the wheel does nothing. Typing in the search box or dragging the scrollbar still works.

Cause

CreateRecordModal does not provide ModalContext, so editors that portal their popover into useModalRefElement() (user, select, …) fall back to document.body. The modal Dialog blocks wheel scroll outside its content (react-remove-scroll), so the popover list outside the dialog does not scroll. The expand record Modal already provides ModalContext, which is why the same editors scroll fine there.

Fix

Provide the dialog content element as ModalContext in CreateRecordModal, the same way expand-record/Modal.tsx does. Most of the diff is re-indentation from wrapping the children in the provider.

Checked

  • Before: user picker in the Add record dialog is rendered outside [role=dialog], scrollTop stays 0 after wheel scroll.
  • After: the picker is inside the dialog and scrolls with the wheel; choosing a user and a single select option and creating the record works.
  • eslint and tsc --noEmit for packages/sdk pass.

🤖 Generated with Claude Code

The create record dialog did not provide ModalContext, so user, select
and other editor popovers were portaled to document.body. The modal
dialog blocks wheel scroll outside its content, so long option lists
(e.g. the user picker) could not be scrolled with the mouse wheel.
Provide the dialog content as the portal container, as the expand
record modal already does.

Co-Authored-By: Claude Opus 5.5 <[email protected]>

This branch has not been deployed

No deployments
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant