feat(chat,examples-chat): catalog v1 prop additions + theme cascade fix (smoke pass)#237
Merged
Conversation
…ix (smoke pass)
Live smoke against two new "kitchen sink" welcome suggestions
("Smoke: media + layout kitchen sink", "Smoke: interactive form
kitchen sink") uncovered six real bugs covering five catalog
components + one cross-cutting theme-cascade specificity issue:
1. Image — missing v1 props `fit` (CSS object-fit equivalent) and
`usageHint` (sizing preset: icon | avatar | smallFeature |
mediumFeature | largeFeature | header). Added inputs with a usage-
hint → CSS-style mapping (max-width, aspect-ratio, border-radius
for the avatar circle).
2. Icon — missing v1 canonical `name` prop. Added as the canonical
input + kept `icon` as a back-compat alias resolved by an
`effectiveName` computed.
3. AudioPlayer — missing v1 `description` prop. Added input + a small
caption rendered above the audio control.
4. List — missing v1 `alignment` prop (start | center | end | stretch).
Added input mapped to flex `align-items` (start/end translated to
flex-start/flex-end CSS values).
5. CheckBox — missing v1 canonical `value` prop. Added as canonical
input, kept `checked` as back-compat alias resolved by an
`effectiveValue` computed. Emit-binding uses `value` when the
surface declares that path, falling back to `checked`.
6. Theme cascade specificity inversion. `:host` `--a2ui-*` defaults on
`<a2ui-surface>` won over inherited `:root[data-theme=...]`
overrides because the host is closer to the rendered children in
the inheritance chain than `:root`. Result: setting
`:root[data-theme=material-light] { --a2ui-primary: #6750A4 }` had
no effect — the surface kept the lib's `#4f8df5`. Fix: moved the
~50-token defaults block from surface.component.ts `:host` into
chat.css `:root`. Now `:root[data-theme=...]` preset overrides
land at the same selector with attribute-selector specificity
bump and win the cascade. The agent's host inline-style binding
(`[style.--a2ui-primary]="primaryColor()"`) still wins per-surface
for the v1 spec's `beginRendering.styles.primaryColor` knob.
Adds two new welcome suggestions ("Smoke: media + layout kitchen
sink", "Smoke: interactive form kitchen sink") that systematically
exercise all 18 catalog components across two prompts, intended as
the canonical smoke triggers for catalog regression testing.
Verified live: post-fix Material light theme correctly applies
(--a2ui-primary = #6750A4, surface = #FFFBFE), all 18 components
render with proper labels and styling, zero NG0303 console errors.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Systematic live-smoke pass against the A2UI catalog using two new "kitchen sink" welcome suggestions designed to elicit LLM-generated surfaces that exercise all 18 components across two prompts. Pass uncovered 6 real bugs — 5 catalog components missing canonical v1 props, plus one cross-cutting theme-cascade specificity inversion.
Bugs found + fixed
Component v1-prop gaps (5 NG0303 runtime errors → 0)
Theme cascade specificity inversion
`:host` `--a2ui-*` defaults on `` won over inherited `:root[data-theme=...]` overrides because the host element is closer to the rendered children than `:root` in the CSS custom-property inheritance chain. Setting `:root[data-theme=material-light] { --a2ui-primary: #6750A4 }` had no effect — the surface kept the lib's default `#4f8df5`.
Fix: moved the ~50-token defaults block from `surface.component.ts` `:host` into `libs/chat/src/lib/styles/chat.css` `:root`. Cascade now works:
New welcome suggestions
Together they cover all 18 catalog components when the LLM honors the prompts. Intended as the canonical smoke triggers for catalog regression testing.
Test plan
🤖 Generated with Claude Code