Skip to content

Conversation

@dancormier
Copy link
Contributor

@dancormier dancormier commented Jan 27, 2026

@ttaylor-stack this PR refactors your PR to match the specifications in SPARK-117. Most notably:

  • The component is named Loading instead of Loader
  • The animation is lifted from the icon (if you inspect it in Stacks-Icons, you can see inline styles for the icon)
  • The base component name was .s-loader--block. The --* suffixes are reserved for component child elements.
  • Sizing is fixed
  • CurrentColor is used for background color so it matches context

What's still needed to complete ticket

  • Button docs need to be accurately updated
  • Visual regression images need to be updated
  • Follow up ticket is created for the logo-based loading animation
    • Note: I anticipate this will be a different component in Stacks Classic if included there at all.

@changeset-bot
Copy link

changeset-bot bot commented Jan 27, 2026

⚠️ No Changeset found

Latest commit: 930bac1

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

--_ld-block-size: calc(var(--su-static8) - var(--su-static1));
--_ld-gap: calc(var(--su-static2) + var(--su-static1));
--_ld-start-offset: var(--su-static2);
.s-loader {
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I spoke to Caro because the Figma called it Loader but the story said Loading, she confirmed it is Loader. I forgot to update the ticket sorry! I've changed it back to loader

{@render children()}
{:else}
>{#if loading}<Loader
size="sm"
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

how would the user update the label for internationalization? should we add another prop if we're not gonna use a Snippet?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants