From dac0e3d02392849d0ed5cce8a58419c9852b3f7a Mon Sep 17 00:00:00 2001 From: Adrian Yee <22947795+adrian-yee@users.noreply.github.com> Date: Fri, 20 Dec 2024 09:50:42 +1100 Subject: [PATCH] button: Add guidance about customising `loadingLabel` (#1915) Co-authored-by: Matt Stow (cherry picked from commit 2fff6d283332fe977b23b77445bba6a40a2abd0f) --- .changeset/large-eels-push.md | 5 +++++ packages/react/src/button/docs/overview.mdx | 1 + 2 files changed, 6 insertions(+) create mode 100644 .changeset/large-eels-push.md diff --git a/.changeset/large-eels-push.md b/.changeset/large-eels-push.md new file mode 100644 index 000000000000..043aec2be128 --- /dev/null +++ b/.changeset/large-eels-push.md @@ -0,0 +1,5 @@ +--- +"@ag.ds-next/react": patch +--- + +button: Add guidance about customising `loadingLabel`. diff --git a/packages/react/src/button/docs/overview.mdx b/packages/react/src/button/docs/overview.mdx index e02c468e861f..205c0688bac5 100644 --- a/packages/react/src/button/docs/overview.mdx +++ b/packages/react/src/button/docs/overview.mdx @@ -26,6 +26,7 @@ Make sure you include a [meaningful text label](/components/button/rationale#mea - create a meaningful button label with a verb and a noun that makes the action obvious to all users - e.g. ‘Register establishment’ - avoid general labels that don’t provide full context. - e.g. ‘Click here’ - use the `loading` property to let users know their action is being processed +- customise the `loadingLabel` property announcement to make it more contextual - add an icon if it helps users understand the action, and only in conjunction with a text label - use only one Primary button on a page. You can use more than one Secondary or Tertiary button.