Quick Actions Sandbox Onboarding Block for React

Each one changes a part of the drawn workspace and nothing else: a new document row replaces its dashed placeholder, Noor's initials fill the second slot of the people stack, the Slack tile reads Connected, and the reminder row reads “Reminder set for Friday”. Every part keeps its box, so nothing moves when it changes, and Undo puts it back.

From one list of what was tried. The count, the progress bar, the buttons' labels and the sentence under the drawing (“The workspace now has 3 documents, 2 people, Slack connected and a reminder for Friday”) are all worked out from it. The weekday is worked out from a fixed date, not from the clock.

All of it. Nothing is created, sent, connected or scheduled; each press says so in a polite status line (“Invited Noor to the workspace. Nothing was sent.”). In your app call your own create, invite, connect and reminder functions from press, and keep the drawing as the confirmation of what happened.

The button's label and its look change with the action's state, but it is the same button in the same place, so focus stays on it after you press. Its accessible name always says the action: “Try: Create a document”, then “Undo: Create a document”.

Edit ACTIONS (a title, a hint, and the sentences said after it is tried and taken back), the matching Glyph icons, and the parts of Workspace each one changes. Keep it to four: the point is that each one visibly does something.

The panel is one column: the list first, then the drawn workspace under it with its sentence. The Try buttons keep a fixed width, so the rows never shift when they become Undo.