fix(editor): polish code block controls - #2603
Conversation
🦋 Changeset detectedLatest commit: f78bc1b The changes in this PR will be included in the next version bump. This PR includes changesets to release 16 packages
Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
Deploying with
|
| Status | Name | Latest Commit | Updated (UTC) |
|---|---|---|---|
| ✅ Deployment successful! View logs |
emdash-demo-do | 0155696 | Aug 26 2026, 02:00 PM |
Deploying with
|
| Status | Name | Latest Commit | Updated (UTC) |
|---|---|---|---|
| ✅ Deployment successful! View logs |
emdash-demo-cache | 0155696 | Aug 26 2026, 02:00 PM |
Overlapping PRsThis PR modifies files that are also changed by other open PRs:
This may cause merge conflicts or duplicated work. A maintainer will coordinate. |
@emdash-cms/admin
@emdash-cms/auth
@emdash-cms/auth-atproto
@emdash-cms/blocks
@emdash-cms/cloudflare
@emdash-cms/contentful-to-portable-text
emdash
create-emdash
@emdash-cms/gutenberg-to-portable-text
@emdash-cms/plugin-cli
@emdash-cms/plugin-types
@emdash-cms/registry-client
@emdash-cms/registry-lexicons
@emdash-cms/registry-moderation
@emdash-cms/registry-verification
@emdash-cms/sandbox-workerd
@emdash-cms/x402
@emdash-cms/plugin-ai-moderation
@emdash-cms/plugin-atproto
@emdash-cms/plugin-audit-log
@emdash-cms/plugin-color
@emdash-cms/plugin-embeds
@emdash-cms/plugin-field-kit
@emdash-cms/plugin-forms
@emdash-cms/plugin-webhook-notifier
commit: |
![emdashbot[bot]](https://avatars.githubusercontent.com/in/3255304?s=60&v=4){kind=small}
There was a problem hiding this comment.
This is a sensible polish follow-up: it unifies language + copy controls across the admin and inline visual editors, smooths the copied feedback, and adds focused regression coverage for aliases, free-form languages, cancel behavior, and the RTL/narrow-viewport layout. The implementation is mostly aligned with EmDash conventions (Lingui in admin, RTL-safe logical CSS in both surfaces, clipboard-fallback guard for the inline blur-save path).
I did not run tests or lint; this is a static read of the diff and changed files.
Two items should be addressed before merge:
-
Accessibility regression: the new CSS-only show/hide for code-block controls only uses
opacity: 0andpointer-events: none. Unlike the previous implementation, which removed hidden chips from the tab order withtabIndex={chipVisible ? 0 : -1}/tabIndex={chipPersistent ? 0 : -1}, the new toolbar buttons remain focusable while completely invisible. Keyboard users can tab into controls they cannot see. Addvisibility: hiddenin the hidden state andvisibility: visiblein the shown state (with a delayed visibility transition so the opacity fade-out finishes first). -
Changeset duplication with the stacked base: the PR description says this change is already covered by
.changeset/gentle-code-block-controls.mdin the stacked base, but the diff adds a new.changeset/quiet-code-block-actions.mdwhose prose also describes adding language/copy controls. If both land, the CHANGELOG will contain two nearly identical entries. Remove the new changeset or rewrite it to describe the specific polish/fix (compact responsive layout, copied feedback, inline language-picker semantics, RTL/narrow-viewport fixes) rather than the feature addition itself.
github-actions
Bot
added
review/awaiting-author
khoinguyenpham04
added
the
bot:review
There was a problem hiding this comment.
This is the right polish follow-up to the stacked code-block work. It unifies the language picker and copy action across the admin and inline visual editors, tightens the responsive layout, smooths the copied-feedback lifecycle, and adds focused regression coverage for aliases, free-form languages, cancel behavior, and the no-save-on-copy path. It stays aligned with EmDash conventions: admin strings go through Lingui, both surfaces use RTL-safe logical properties, and the inline clipboard fallback is guarded so it does not trigger a blur-save.
This is a re-review of #2603. My previous review raised two items:
-
Accessibility of hidden controls: I previously asked for
visibility: hiddento remove hidden toolbar buttons from the tab order. The author did not add it, and the new E2E specs instead verify that keyboard focus reveals the toolbar via:focus-within. That makes the hidden-but-focusable state an intentional “show on focus” pattern rather than a clear regression, and usingvisibility: hiddenon the container would actually prevent:focus-withinfrom matching. I am not treating this as a blocker again. -
Changeset duplication: Still unresolved — the new
.changeset/quiet-code-block-actions.mdduplicates the capability described in the stacked base changeset, which the PR description says already covers this work. See the file comment below.
I did not run tests, lint, or typecheck; this is a static read of the diff and changed files. One documentation issue remains.
github-actions
Bot
added
review/awaiting-author
github-actions
Bot
added
review/needs-rereview
Co-authored-by: emdashbot[bot] <273199577+emdashbot[bot]@users.noreply.github.com>
8e76ead to
f78bc1b
Compare
2 participants
What does this PR do?
Adds matching language selection and one-click copy actions to code blocks in the admin and inline visual editors. The controls stay compact on narrow screens and in right-to-left layouts. Copy feedback is smoother, and the inline language picker reports the selected language correctly.
This is the top pull request in native stack #2607, stacked on #2606.
Relates to #2361
Type of change
Checklist
pnpm typecheckpasses — verified for the affected admin and core packagespnpm lintpassespnpm testpasses (or targeted tests for my change)pnpm formathas been run.changeset/quiet-code-block-actions.md; the stacked base's.changeset/bright-code-blocks.mdcovers syntax highlighting onlyAI-generated code disclosure
Screenshots / test output