feat(user-message): support grouped multi-attachment messages#6512
feat(user-message): support grouped multi-attachment messages#6512TarunAdobe wants to merge 1 commit into
Conversation
Add swc-user-message-attachment: a minimal, presentation-only tile (media/card, no dismiss, no click behavior) kept as a separate component from swc-upload-artifact so the compose-time and sent-message tiles can diverge independently. Extend swc-user-message with type="attachments": media attachments lay out in a 4-column grid, card attachments stack full-width beneath it, and overflow beyond 4 media tiles collapses behind a show all/less disclosure (same open/aria-expanded/aria-controls shape as swc-message-sources), firing swc-user-message-toggle. Grouping and slot-routing are driven by a MutationController watching the light DOM, following the same pattern as swc-response-status. Adds unit tests for grouping/overflow/toggle behavior, an ARIA snapshot test, stories, and docs. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
|
📚 Branch Preview Links🔍 Gen1 Visual Regression Test ResultsWhen a visual regression test fails (or has previously failed while working on this branch), its results can be found in the following URLs:
Deployed to Azure Blob Storage: If the changes are expected, update the |
Add swc-user-message-attachment: a minimal, presentation-only tile (media/card, no dismiss, no click behavior) kept as a separate component from swc-upload-artifact so the compose-time and sent-message tiles can diverge independently.
Extend swc-user-message with type="attachments": media attachments lay out in a 4-column grid, card attachments stack full-width beneath it, and overflow beyond 4 media tiles collapses behind a show all/less disclosure (same open/aria-expanded/aria-controls shape as swc-message-sources), firing swc-user-message-toggle. Grouping and slot-routing are driven by a MutationController watching the light DOM, following the same pattern as swc-response-status.
Adds unit tests for grouping/overflow/toggle behavior, an ARIA snapshot test, stories, and docs.
Description
Motivation and context
Related issue(s)
Screenshots (if appropriate)
Author's checklist
Reviewer's checklist
patch,minor, ormajorfeaturesManual review test cases
Descriptive Test Statement
Descriptive Test Statement
Device review
Accessibility testing checklist
Required: Complete each applicable item and document your testing steps (replace the placeholders with your component-specific instructions).
Keyboard (required — document steps below) — What to test for: Focus order is logical; Tab reaches the component and all interactive descendants; Enter/Space activate where appropriate; arrow keys work for tabs, menus, sliders, etc.; no focus traps; Escape dismisses when applicable; focus indicator is visible.
Screen reader (required — document steps below) — What to test for: Role and name are announced correctly; state changes (e.g. expanded, selected) are announced; labels and relationships are clear; no unnecessary or duplicate announcements.