diff --git a/packages/app/src/composer/editor/quote-comment.tsx b/packages/app/src/composer/editor/quote-comment.tsx index 3ebaf952cce..e08e55c9711 100644 --- a/packages/app/src/composer/editor/quote-comment.tsx +++ b/packages/app/src/composer/editor/quote-comment.tsx @@ -143,6 +143,7 @@ export function QuoteCommentEditor(props: { }) }} data-component="composer-quote-comment" + data-floating data-prevent-autofocus class="fixed z-50" style={{ diff --git a/packages/app/src/runtime/plugin/embeds.tsx b/packages/app/src/runtime/plugin/embeds.tsx index 69a48e5dbd8..e0b864ee92b 100644 --- a/packages/app/src/runtime/plugin/embeds.tsx +++ b/packages/app/src/runtime/plugin/embeds.tsx @@ -187,9 +187,13 @@ function EmbedView(props: EmbedProps & { input: Input; bridge: Bridge }) { } // The native embed always paints above the DOM, so hide it while a floating - // menu, select, or popover overlaps it. Tooltips are excluded. + // menu, select, or popover overlaps it. Tooltips are excluded. Floating content + // positioned without Kobalte, such as the quote toolbar and comment editor, marks + // itself with data-floating. const covered = (rect: DOMRect) => - Array.from(document.querySelectorAll('[data-popper-positioner]:not(:has([role="tooltip"]))')).some((el) => { + Array.from( + document.querySelectorAll('[data-popper-positioner]:not(:has([role="tooltip"])), [data-floating]'), + ).some((el) => { const r = el.getBoundingClientRect() return r.width > 0 && r.left < rect.right && r.right > rect.left && r.top < rect.bottom && r.bottom > rect.top diff --git a/packages/app/src/session/timeline/quote.tsx b/packages/app/src/session/timeline/quote.tsx index 84accd639d1..c5c57793002 100644 --- a/packages/app/src/session/timeline/quote.tsx +++ b/packages/app/src/session/timeline/quote.tsx @@ -348,6 +348,7 @@ export function TimelineQuote(props: { controller: TimelineQuoteController }) { onCleanup(() => quote.setElement(undefined)) }} data-component="timeline-quote" + data-floating data-prevent-autofocus role="toolbar" aria-label={language.t("session.quote.actions")} diff --git a/packages/gui-plugins/src/terminal/quote.tsx b/packages/gui-plugins/src/terminal/quote.tsx index a25ce3eb76f..eee41d6c04f 100644 --- a/packages/gui-plugins/src/terminal/quote.tsx +++ b/packages/gui-plugins/src/terminal/quote.tsx @@ -232,6 +232,7 @@ export function TerminalQuote(props: { }) }} data-component="terminal-quote" + data-floating data-prevent-autofocus role="toolbar" aria-label={plugin.t("quote.actions")}