feat: support list of agent actions in ResponseStatus by catherine · Pull Request #10359 · adobe/react-spectrum

catherine · 2026-07-23T20:07:38Z

This PR introduces <ExecutionTrace> and <ExecutionTraceItem> - components that render inside a <ResponseStatus> in order to highlight the steps an agent took while crafting its response.

rspbot · 2026-07-23T20:08:32Z

Build successful! 🎉

rspbot · 2026-07-24T23:22:42Z

Build successful! 🎉

rspbot · 2026-07-24T23:55:50Z

Build successful! 🎉

rspbot · 2026-07-24T23:59:27Z

Build successful! 🎉

devongovett

looks great!

devongovett · 2026-07-25T01:16:39Z

+   * Additional detail revealed when the step is expanded, such as tool call input or output.
+   * If omitted, the row is static and cannot be expanded.
+   */
+  detail?: ReactNode;


We might want to move this into children with title/panel wrappers like the RSP Disclosure API at some point

devongovett · 2026-07-25T01:24:42Z

+
+export interface ExecutionTraceItemProps extends DOMProps, AriaLabelingProps {
+  /** Allows detail content to render but prevents the row from being collapsible. */
+  isDetailNotCollapsible?: boolean;


we can debate this name 😄 allowsExpanding could work if the default is false. disallowCollapsing? 😂

Support Left/Right arrow to expand/collapse ??

This is a list of disclosures at the moment
https://www.w3.org/WAI/ARIA/apg/patterns/disclosure/
No left/right for now

isAlwaysOpen

+1 to isAlwaysOpen, allowsExpanding makes it sound like there is a state where it could still be "closed" and just not expandable IMO

I was struggling to name this one 😅 -- I'm also a fan of isAlwaysOpen and have updated to that

note that this doesn't follow our naming guidelines (is is for states) but ok for now

ah, I see - I hadn't encountered that guidelines doc, thanks for sharing it

devongovett · 2026-07-25T01:27:12Z

might want a lil padding around this for the focus ring

also when it's expanded there's some extra space on the right

snowystinger · 2026-07-26T23:17:46Z

+const detailTriggerStyles = style({
+  display: 'block',
+  paddingY: 4,
+  marginTop: -2,


What's this for? could it be paddingTop:2 and no marginTop instead?

snowystinger · 2026-07-26T23:23:17Z

+  font: 'body',
+  display: 'flex',
+  gap: 8,
+  marginTop: {


there's a lot of margin/paddingTop: +/-2 what's driving all of these?

initially it was solving some alignment issues between the step's icon/label when there was a hover state -- I'll do a pass to review/remove any that are no longer applicable now since we decided to remove the hover state

snowystinger · 2026-07-26T23:24:50Z

+  '--divider-display': {
+    type: 'display',
+    value: {
+      default: 'flex',


intention here is display: block, there's no children inside of the line?

snowystinger · 2026-07-26T23:30:30Z

+const executionTraceItemContentStyles = style({
+  display: 'flex',
+  flexDirection: 'column',
+  paddingBottom: 12,


last one shouldn't have padding bottom, it's doubled up with the padding from the wrapper of the ol

snowystinger · 2026-07-26T23:34:44Z

+        </RACDisclosure>
+      ) : (
+        <div
+          className={mergeStyles(


we can do this at build time, if you put the shared properties into a const, you can spread it into both styles, then we can get rid of the mergeStyles and it'll be a little more declarative

✅ cleaned up 🧹

snowystinger · 2026-07-26T23:46:17Z

+
+export interface ExecutionTraceItemProps extends DOMProps, AriaLabelingProps {
+  /** Allows detail content to render but prevents the row from being collapsible. */
+  isDetailNotCollapsible?: boolean;


isAlwaysOpen

LFDanLu · 2026-07-27T17:30:49Z

+
+export interface ExecutionTraceItemProps extends DOMProps, AriaLabelingProps {
+  /** Allows detail content to render but prevents the row from being collapsible. */
+  isDetailNotCollapsible?: boolean;


+1 to isAlwaysOpen, allowsExpanding makes it sound like there is a state where it could still be "closed" and just not expandable IMO

LFDanLu · 2026-07-27T17:39:28Z

+  );
+}
+
+export interface ExecutionTraceItemProps extends DOMProps, AriaLabelingProps {


should the ExecutionTraceItems also include the ability to set expanded by default/controlled? I don't think I've see that in other chat experiences so no need to add right now until requested by other teams, but maybe something to keep in mind

most of the chat experiences I have seen, when the content is collapsible they are closed by default and it's up to the user to take the step to open -- definitely possible to add in here but one I vote to hold off on until we see a need for it

LFDanLu · 2026-07-27T17:42:00Z

for the future, would be nice to to also have the ExecutionTrace added to the "Chat" stories so we can see how it looks in a chat as a whole

good idea! [ depending on when this PR merges, I might go ahead and add it in - otherwise an easy follow up ]

rspbot · 2026-07-27T18:17:06Z

Build successful! 🎉

yihuiliao · 2026-07-27T18:26:35Z

ah sorry ignore me adding labels to this PR...i didn't mean to do that

- Set `role="presentation”` on vertical item divider - Remove dead code in Storybook example - Clean up styles around row content alignment with leading icon

catherine · 2026-07-27T18:51:04Z

+
+  return (
+    <Button
+      className={renderProps => mergeStyles(buttonStyles({...renderProps}), detailTriggerStyles)}


cc @devongovett

might want a lil padding around this for the focus ring

I've nudged the space around the focus ring:

Separately, I will follow up looking into the space that is added when the disclosure is expanded. It's happening both to the top level ResponseStatus disclosure and these new children

Addressed in: #10384

rspbot · 2026-07-27T19:50:56Z

Build successful! 🎉

…e_status_list

rspbot · 2026-07-27T20:17:28Z

Build successful! 🎉

rspbot · 2026-07-27T20:17:29Z

## API Changes

@react-spectrum/ai

/@react-spectrum/ai:ResponseStatus

 ResponseStatus {
   children: ReactNode
   defaultExpanded?: boolean
   density?: 'compact' | 'regular' | 'spacious' = 'regular'
   id?: Key
   isDisabled?: boolean
   isExpanded?: boolean
   onExpandedChange?: (boolean) => void
-  size?: 'S' | 'M' | 'L' | 'XL' = 'M'
   slot?: string | null
   status?: 'loading' | 'failed' | 'success' = 'loading'
   styles?: StyleString
 }

/@react-spectrum/ai:ResponseStatusProps

 ResponseStatusProps {
   children: ReactNode
   defaultExpanded?: boolean
   density?: 'compact' | 'regular' | 'spacious' = 'regular'
   id?: Key
   isDisabled?: boolean
   isExpanded?: boolean
   onExpandedChange?: (boolean) => void
-  size?: 'S' | 'M' | 'L' | 'XL' = 'M'
   slot?: string | null
   status?: 'loading' | 'failed' | 'success' = 'loading'
   styles?: StyleString
 }

/@react-spectrum/ai:ExecutionTrace

+ExecutionTrace {
+  aria-describedby?: string
+  aria-details?: string
+  aria-label?: string
+  aria-labelledby?: string
+  children: ReactNode
+  id?: string
+  styles?: StyleString
+}

/@react-spectrum/ai:ExecutionTraceItem

+ExecutionTraceItem {
+  aria-describedby?: string
+  aria-details?: string
+  aria-label?: string
+  aria-labelledby?: string
+  children: ReactNode
+  detail?: ReactNode
+  icon?: ReactNode
+  id?: string
+  isAlwaysOpen?: boolean
+  styles?: StyleString
+}

/@react-spectrum/ai:ExecutionTraceProps

+ExecutionTraceProps {
+  aria-describedby?: string
+  aria-details?: string
+  aria-label?: string
+  aria-labelledby?: string
+  children: ReactNode
+  id?: string
+  styles?: StyleString
+}

/@react-spectrum/ai:ExecutionTraceItemProps

+ExecutionTraceItemProps {
+  aria-describedby?: string
+  aria-details?: string
+  aria-label?: string
+  aria-labelledby?: string
+  children: ReactNode
+  detail?: ReactNode
+  icon?: ReactNode
+  id?: string
+  isAlwaysOpen?: boolean
+  styles?: StyleString
+}

rspbot · 2026-07-27T20:17:31Z

Agent Skills Changes

Modified (2)

react-aria/skills/react-aria/references/components/Separator/useSeparator.md $\color{green}{+1}$ $\color{red}{-1}$
s2/skills/react-spectrum-s2/references/react-aria/components/Separator/useSeparator.md $\color{green}{+1}$ $\color{red}{-1}$

Install

React Spectrum S2:

npx skills add https://d1pzu54gtk2aed.cloudfront.net/pr/3bfa4c5ea00db37245b7ee0ea6165de7c58e13b6/

React Aria:

npx skills add https://d5iwopk28bdhl.cloudfront.net/pr/3bfa4c5ea00db37245b7ee0ea6165de7c58e13b6/

yihuiliao added the release label Jul 24, 2026

catherine force-pushed the f/response_status_list branch from 238eccc to 19e3229 Compare July 24, 2026 23:16

catherine marked this pull request as ready for review July 24, 2026 23:24

catherine force-pushed the f/response_status_list branch from 19e3229 to 23ca611 Compare July 24, 2026 23:49

catherine requested review from LFDanLu and snowystinger July 24, 2026 23:50

catherine force-pushed the f/response_status_list branch from 23ca611 to ee22f43 Compare July 24, 2026 23:52

devongovett previously approved these changes Jul 25, 2026

View reviewed changes

snowystinger reviewed Jul 26, 2026

View reviewed changes

LFDanLu reviewed Jul 27, 2026

View reviewed changes

catherine dismissed devongovett’s stale review via dd77302 July 27, 2026 18:10

yihuiliao added SideNav and removed SideNav labels Jul 27, 2026

catherine added 8 commits July 27, 2026 11:45

feat: swap icon and chevron placement on ResponseStatus

2aeb314

style: remove hover state on ResponseStatus trigger

5b64941

feat: add ExecutionTrace and ExecutionTraceItem components

468193b

feat: expose ExecutionTrace and ExecutionTraceItem props from package

d091935

docs: add Storybook Story for ExecutionTrace

6400c76

feat: remove size prop since not yet part of design spec

a588dc8

feat: style massage and clean up

d9a3eab

- Set `role="presentation”` on vertical item divider - Remove dead code in Storybook example - Clean up styles around row content alignment with leading icon

refactor: rename prop to isAlwaysOpen

ce4d6fb

catherine commented Jul 27, 2026

View reviewed changes

feat: use new Chevron UI icon

c0e2a75

devongovett previously approved these changes Jul 27, 2026

View reviewed changes

catherine dismissed devongovett’s stale review via c0e2a75 July 27, 2026 19:44

catherine force-pushed the f/response_status_list branch from 0a9e640 to c0e2a75 Compare July 27, 2026 19:44

devongovett previously approved these changes Jul 27, 2026

View reviewed changes

LFDanLu previously approved these changes Jul 27, 2026

View reviewed changes

devongovett enabled auto-merge July 27, 2026 19:46

yihuiliao previously approved these changes Jul 27, 2026

View reviewed changes

devongovett added this pull request to the merge queue Jul 27, 2026

github-merge-queue Bot removed this pull request from the merge queue due to a conflict with the base branch Jul 27, 2026

Merge branch 'main' of github.com:adobe/react-spectrum into f/respons…

3bfa4c5

…e_status_list

LFDanLu dismissed stale reviews from yihuiliao, devongovett, and themself via 3bfa4c5 July 27, 2026 20:07

yihuiliao approved these changes Jul 27, 2026

View reviewed changes

LFDanLu approved these changes Jul 27, 2026

View reviewed changes

LFDanLu enabled auto-merge July 27, 2026 20:08

LFDanLu added this pull request to the merge queue Jul 27, 2026

Merged via the queue into main with commit ccc68e8 Jul 27, 2026
32 checks passed

LFDanLu deleted the f/response_status_list branch July 27, 2026 20:24

Uh oh!

Conversation

catherine commented Jul 23, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

rspbot commented Jul 23, 2026

Uh oh!

rspbot commented Jul 24, 2026

Uh oh!

rspbot commented Jul 24, 2026

Uh oh!

rspbot commented Jul 24, 2026

Uh oh!

devongovett left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

devongovett commented Jul 25, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

rspbot commented Jul 27, 2026

Uh oh!

yihuiliao commented Jul 27, 2026

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

rspbot commented Jul 27, 2026

Uh oh!

rspbot commented Jul 27, 2026

Uh oh!

rspbot commented Jul 27, 2026

catherine commented Jul 23, 2026 •

edited

Loading

devongovett commented Jul 25, 2026 •

edited

Loading