diff --git a/apps/web/src/components/AppSidebarLayout.tsx b/apps/web/src/components/AppSidebarLayout.tsx index 918d28845068a..ecf9866356967 100644 --- a/apps/web/src/components/AppSidebarLayout.tsx +++ b/apps/web/src/components/AppSidebarLayout.tsx @@ -102,13 +102,20 @@ function SidebarControl() { ) { return; } + const richComposer = + event.target instanceof HTMLElement + ? event.target.closest('[data-composer-rich-text="true"]') + : null; + const selection = window.getSelection(); if ( isRichTextBoldShortcut(event) && - event.target instanceof HTMLElement && - event.target.closest('[data-composer-rich-text="true"]') + richComposer && + selection?.isCollapsed === false && + richComposer.contains(selection.anchorNode) && + richComposer.contains(selection.focusNode) ) { - // The rich-text composer claims Mod+B for bold; the toggle stays - // available everywhere else, including the plain-text composer. + // The rich-text composer claims Mod+B to bold its selected text. Without a + // selection the toggle wins, since the composer holds focus most of the time. return; } if ( diff --git a/apps/web/src/keybindings.ts b/apps/web/src/keybindings.ts index 24a4676050340..49f23b0f4a5ab 100644 --- a/apps/web/src/keybindings.ts +++ b/apps/web/src/keybindings.ts @@ -422,7 +422,7 @@ export function isOpenFavoriteEditorShortcut( /** * Whether the keypress is the rich-text bold chord (Mod+B without extra * modifiers). Tiptap binds the same chord, so app shortcuts captured ahead - * of the editor must yield when the rich-text composer is focused. + * of the editor must yield when the rich-text composer has text selected. */ export function isRichTextBoldShortcut(event: ShortcutEventLike): boolean { if (event.type !== undefined && event.type !== "keydown") {