fix(view-context): a corner mark on the bubble, not a row under it
Nightly Build / build (push) Successful in 9s
Nightly Build / build (push) Successful in 9s
The sent-message proof was a collapsed <details> under the user bubble: a row of height in every bubble that carried view context, for something that is evidence about the message rather than part of it. It also rendered a blank line, since the bubble is white-space: pre-wrap and the template left a newline before the element. Now a faint eye in the bubble's bottom-right corner, revealing the pairs on hover (on focus for keyboard and touch). Deliberately not expandable, so scrolling back through a conversation cannot grow a second layout, and the popover opens downwards rather than over the message it belongs to. The i18n key stays alive as the mark's aria-label; docs and changelog wording updated to match.
This commit is contained in:
@@ -591,18 +591,22 @@ export function renderViewContextPill(host) {
|
||||
* The proof, in the sent bubble: what this message actually carried. Rendered
|
||||
* from the server's echo (and, after a reload, from the REST history), so it
|
||||
* shows the sanitized pairs the model was given — never the browser's intent.
|
||||
*
|
||||
* A mark in the bubble's corner, not a row under the message: this is evidence
|
||||
* about a message, not part of it, and a collapsed row still cost a line of
|
||||
* height in every bubble that carried one. Deliberately **not** expandable —
|
||||
* the pairs show on hover (on focus for keyboard and touch) and there is no
|
||||
* state to leave open, so a conversation scrolled back through never grows a
|
||||
* second layout.
|
||||
*
|
||||
* Written on one line on purpose: the bubble renders `white-space: pre-wrap`, so
|
||||
* the newline and indent a formatted template would leave before the element are
|
||||
* a text node the bubble actually shows — a blank line under the message.
|
||||
*/
|
||||
function renderViewContextChip(host, msg) {
|
||||
function renderViewContextMark(host, msg) {
|
||||
const items = msg.view_context;
|
||||
if (!items?.length) return nothing;
|
||||
return html`
|
||||
<details class="view-ctx-chip">
|
||||
<summary>
|
||||
<i class="bi bi-eye"></i>
|
||||
<span>${t('chat.view_context.chip', { n: items.length })}</span>
|
||||
</summary>
|
||||
${renderViewContextItems(items)}
|
||||
</details>`;
|
||||
return html`<div class="view-ctx-mark" tabindex="0" aria-label=${t('chat.view_context.chip', { n: items.length })}><i class="bi bi-eye"></i><div class="view-ctx-pop">${renderViewContextItems(items)}</div></div>`;
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -625,7 +629,7 @@ export function renderMsg(host, msg) {
|
||||
try {
|
||||
switch (msg.kind) {
|
||||
case 'user':
|
||||
return html`<div class="copilot-msg user ${msg.failed ? 'copilot-msg--failed' : ''}" style="white-space:pre-wrap">${msg.failed ? failedBadge() : nothing}${msg.content}${renderAttachmentChips(host, msg.attachments)}${renderViewContextChip(host, msg)}</div>`;
|
||||
return html`<div class="copilot-msg user ${msg.view_context?.length ? 'copilot-msg--view-ctx' : ''} ${msg.failed ? 'copilot-msg--failed' : ''}" style="white-space:pre-wrap">${msg.failed ? failedBadge() : nothing}${msg.content}${renderAttachmentChips(host, msg.attachments)}${renderViewContextMark(host, msg)}</div>`;
|
||||
case 'thinking':
|
||||
return html`
|
||||
<div class="copilot-msg assistant copilot-markdown ${msg.failed ? 'copilot-msg--failed' : ''}">
|
||||
|
||||
Reference in New Issue
Block a user