Loading Button

[origami-z]

Add examples to achieve pepper buttons (including necessary a11y attributes) to Salt storybook

Implementation:

• Loading state should be identical to the bordered appearance for the sentiment
• Loading should be triggered by a loading prop.
• When Loading the contents of the button should be replaced with a Spinner and the button should stay the same size
• When the Button is in a loading state, it should be announced to the SR.
  • The announcement might need to be controlled via a loadingAnnouncement prop.
  • We might be able to use the announcer hook here rather than inline the live region.

[mark-tate]

Loading button color issue being worked on

[origami-z]

Waiting for a11y review

[mark-tate]

Zazu Goal: S(3)

• Jared to feedback on a11y
• Implement his suggestion

[mark-tate]

This story used to be called Loading and Arrow Button but Arrow Button was removed as it is achievable already with a Button+Icon

[mark-tate]

Goal: review required

[mark-tate]

Goal: Merged to Core before end of Cappuccino

[origami-z]

Aug 12 - blocked by button convo
Aug 16 - still blocked

[mark-tate]

will unblock in wk2 of Espresso

[origami-z]

Frappe goal: Re-design based on latest button variants, if necessary. Implement and release.

[origami-z]

Sep 23: can't find design specs around this, apart from changes in #3887 (unclear what loading prop is meant to do, with most responsibility still falls under the user's control)

[mark-tate]

catchup on wed

[mark-tate]

@bhoppers2008 to surface spec following button updates

[bhoppers2008]

Darrin, Josh, Ben agreed new scope for loading button.
Ben to create updated spec.

[mark-tate]

Galeo Goal: decide what it is ? @bhoppers2008
is it a pattern (button + spinner + announcer) ?

[mark-tate]

@bhoppers2008 ping

[mark-tate]

Latte goal: feature complete, pushed to Labs (needs a small amount of dev capacity)
Spec to be shared by end of wk1

[jake-costa]

Missing A11y Specs, @ivan-calderon Can you assist me with getting the a11y specs added. Keyboard should be the same as the button specs but also needs to include screen reader announcement.

[dplsek]

@bhoppers2008 has this spec been completed?

@ivan-calderon @jake-costa will look at providing the A11y spec when time permits.

[mark-tate]

Lungo: @bhoppers2008 to update sprint goal

[bhoppers2008]

Moved to Macchiato sprint. No capacity in Lungo @mark-tate @joshwooding

[mark-tate]

Macc Goal:
Complete by EOS, ready for Dev by EOS
Decision made by EOS on cost/value

[origami-z]

Mocha Goal: ready for Dev by EOS

[mark-tate]

Mocha Goal: ready for Dev by EOS

@bhoppers2008 for visibility

[yunjungyeh]

Wed 27 Nov - Scope notes from @bhoppers2008

• Takes the default bordered appearance (in all cases)
• displayed if action after any button click can’t happen immediately
• after what period should it time out (example(? Check), we make recommendation - recommend use of salt duration tokens-if need check with paul)
• cursor is always arrow (loading button is not clickable)
  • loading button doesn’t have states
• what happens if the loading fails? what next...
• ada spec + review with jake (its not clickable, should it receive focus? button had focus beforehand, on enter/space press what happens to focus?)
• docs - see if you can reuse any of ivans examples (probably limited examples... when you click a button what happens)
• figma - check with josh if its a) part of button or b) a separate component
  a) loading button is new component set in button (not variant)
  b) its own component

[yunjungyeh]

Wed 4 Dec - initial Characteristic/Interaction/Accessibility Specs ready for review, some ADA questions to be discussed together with @jake-costa @joshwooding @bhoppers2008

[mark-tate]

red eye: discussion moved to next week, when Josh is back

[mark-tate]

Red eye: one more token to add progress cursor, follow up with jake required on detailed a11y requirements.
Add Figma component.
Push to labs by EOS a known quantity.

[chrispcode]

Working on it: PR here - #4502

[bhoppers2008]

@joshwooding @jake-costa to review requirements following accessibility engineering feedback.

Goal: Publish to core end of this sprint.

[dplsek]

PR is still up... plan is to merge the loading functionality by end of sprint... further discussions necessary for announcements and accessibility @jake-costa @joshwooding

@yunjungyeh to look at creating corresponding figma components

[bhoppers2008]

Kris/ Yun/ Jake aligned on requirements for Loading Button.
Kris to create examples today (or tomorrow).
Sprint goal: On track for core release.
No extra support required.

[bhoppers2008]

Finalising the examples and on track for delivery this sprint.

[yunjungyeh]

Fri 17 Jan - Figma components completed

[mark-tate]

Tecno goal:
team priority to get this merged with

• API signed off by Josh
• Jake a11y
• Yun to sign off design
• docs signoff by Yun

[mark-tate]

PR up:
Call with Jake to signoff examples and then we can merge to Core in next release