webclient: animate <details> cards in every browser, not just Chromium
Open/close of the tool cards jumped in Firefox and Safari: the previous
attempt leaned on interpolate-size/::details-content, and interpolate-size
shipped in Chromium alone, so the @supports block degraded to a hard
attribute flip everywhere else.

Drive the element's own height from JS instead. Nothing there is
engine-specific: open animates to scrollHeight, close to the summary
height, overflow is clipped for the duration and the inline styles come
off on transitionend with a timer as a backstop. The element keeps its
native semantics — keyboard, screen readers, find-in-page — because the
open attribute is still what changes; the toggle event still fires, so
ContentCard's :open/@toggle pairing is untouched. prefers-reduced-motion
settles in a single frame.

A newly inserted card grows its grid row from 0fr to 1fr, which
interpolates everywhere and resolves to whatever the card measures, so
the card below slides instead of being displaced.

Measured in Chromium 153 and Firefox 155 against the real component
markup and the built bundle: 33 -> 586px over 18 distinct heights in
both, and the same for insertion, the nested Arguments block and the
plan card. The scroll behaviour of MessageList was left alone.
1 parent b60411a commit 232304460766efefd1831c730cbea5981636e7bf
@Eugene Sukhodolskiy Eugene Sukhodolskiy authored 12 hours ago
Showing 16 changed files
View
webclient/dist/assets/index-BhdS4ahi.js 100644 → 0
Not supported
View
webclient/dist/assets/index-Bi7fgQRO.js 0 → 100644
Not supported
View
webclient/dist/assets/index-ChzYhghb.css 0 → 100644
View
webclient/dist/assets/index-by9RvXL9.css 100644 → 0
View
webclient/dist/index.html
View
webclient/dist/sw.js
View
webclient/src/components/messages/AssistantMessage.vue
View
webclient/src/components/messages/CompressionNotice.vue
View
webclient/src/components/messages/ContentCard.vue
View
webclient/src/components/messages/SubagentStep.vue
View
webclient/src/components/messages/SummaryCard.vue
View
webclient/src/components/messages/ThinkingCard.vue
View
webclient/src/components/messages/ToolCard.vue
View
webclient/src/styles/app.scss
View
webclient/src/utils/detailsAnimation.js 0 → 100644
View
webclient/tests/unit/utils/detailsAnimation.test.js 0 → 100644