Champion is using a service called Locally to provide "Find Local" and "Buy Online" buttons on product pages. The service provides a widget that can be embedded in the page, and it has some specific styles and behaviors that we have limited control over and need to accommodate.
The Locally widget imposes some unique markup requirements. We've included styles to retain compatibility with our Actions component. Once the widget has fully loaded, it injects up to two buttons into the page.
This example represents the initial state of the widget, before any of the Locally JavaScript executes. It should be considered, because the user will see a flash of this state before the "loading" state kicks in.
When the widget is in an indeterminate state, Locally injects unstyled text after the buttons. We use CSS to detect and communicate this state by styling the buttons as disabled and hiding this text to prevent a shift in layout.
Note: This text can read "Loading…" or "Local results not available". We are not distinguishing between these two states at the moment.