Skip to content

RC #384#385

Merged
jason-capsule42 merged 7 commits into
mainfrom
rc/384
Jan 13, 2026
Merged

RC #384#385
jason-capsule42 merged 7 commits into
mainfrom
rc/384

Conversation

@rmenner

@rmenner rmenner commented Jan 13, 2026

Copy link
Copy Markdown
Contributor

Alaska Airlines Pull Request

Review Checklist:

  • My update follows the CONTRIBUTING guidelines of this project
  • I have performed a self-review of my own update
RC Checklist

Testing Checklist:

Browsers

Browsers Support Guide

Dev demo link

Android

  • Chrome
  • Firefox

iOS

  • Chrome
  • Firefox
  • Safari

Desktop

  • Chrome
  • Firefox
  • Safari
  • Edge

Scenarios

  • Validated linked issues with issue reporting team
  • Test coverage report review

Framework playground

  • Next React
  • SvelteKit

**By submitting this Pull Request, I confirm that my contribution is made under the terms of the Apache 2.0 license.**

Pull Requests will be evaluated by their quality of update and whether it is consistent with the goals and values of this project. Any submission is to be considered a conversation between the submitter and the maintainers of this project and may require changes to your submission.

Thank you for your submission!

-- Auro Design System Team

Summary by Sourcery

Update auro-button documentation, accessibility behavior, tooling, and repository configuration.

New Features:

  • Document and provide examples for custom component registration to support multiple versions of auro-button on a page.

Bug Fixes:

  • Improve loading state behavior so button content is hidden via a dedicated loading class while the loader is centered within the button.

Enhancements:

  • Refresh README structure with clarified use cases, installation guidance, basic examples, and updated build status badge.
  • Simplify and clarify API reference for auro-button properties, attributes, and methods.
  • Update issue and pull request templates with clearer checklists, component-specific questions, and additional design handoff workflow.
  • Add repository settings configuration file to standardize metadata, branching, and team permissions.

Build:

  • Broaden Node engine support declaration and bump lit and Auro design system-related dependencies, including loader version, plus enable npm publish provenance metadata and add a test coverage script.

CI:

  • Tidy add-project workflow configuration for new issues.

Deployment:

  • No deployment-specific changes were introduced in this pull request.

Documentation:

  • Add documentation for custom registration and re-organize README sections for usage and examples.

Tests:

  • Adjust aria-label slot test formatting without changing coverage behavior.

Chores:

  • Add .nvmrc for local Node version management and remove unused development documentation sections from README.

@rmenner
rmenner requested a review from a team as a code owner January 13, 2026 20:36
@sourcery-ai

sourcery-ai Bot commented Jan 13, 2026

Copy link
Copy Markdown
Contributor

Reviewer's Guide

Refactors auro-button documentation and project config while adding guidance for custom element version management, expanding issue/PR templates, updating tooling/dependencies, and improving loading/ARIA behavior and loader layout.

Sequence diagram for custom element registration and version management

sequenceDiagram
  actor Developer
  participant AppModule
  participant CustomElementsRegistry
  participant Document

  Developer->>AppModule: import AuroButtonClass
  Developer->>AppModule: AuroButtonClass.register(custom_button)
  AppModule->>CustomElementsRegistry: define(custom_button, AuroButtonClass)
  Developer->>Document: Add <custom-button> elements in HTML
  CustomElementsRegistry-->>Document: Upgrade custom-button to AuroButton instances
Loading

Class diagram for AuroElement and AuroButton loading/version-related structure

classDiagram
  class AuroElement {
    +boolean onDark
    +string appearance
    +AuroElement()
  }

  class AuroButton {
    +boolean loading
    +boolean disabled
    +boolean static
    +boolean fluid
    +boolean formAssociated
    +string variant
    +string size
    +string shape
    +string type
    +string value
    +string title
    +string tabindex
    +string tIndex
    +string loadingText
    +string currentAriaLabel
    +string currentAriaLabelledBy
    +string generateAriaLabel()
    +void register(name)
  }

  AuroButton --|> AuroElement
Loading

File-Level Changes

Change Details Files
Refresh README content structure and examples, including use cases and custom registration guidance.
  • Replace the browser support section with an inline Use Cases section sourced from docs/partials/useCases.md.
  • Update the install badge to reference the release.yml GitHub Actions workflow instead of testPublish.yml.
  • Retitle and reword dependency/import sections for clearer project-level usage and CDN guidance.
  • Consolidate and rename the basic API example section to Basic Example while keeping the same underlying code snippet.
  • Add a new Custom Component Registration for Version Management section with content and examples wired to new docs/partials/customRegistration.md and apiExamples/custom.html.
README.md
docs/partials/customRegistration.md
demo/api.html
demo/button-sheet.html
demo/form.html
demo/icon-sheet.html
demo/index.html
Update API documentation to reflect the current auro-button public API in a clearer tabular format.
  • Rewrite the properties table to include modifiers, explicit types, defaults, and normalized attribute names such as ondark and layout.
  • Remove undocumented/private/internal properties from the public API list.
  • Replace the methods table content (previously just register) with an empty header row, preparing for future documented methods.
docs/api.md
Enhance accessibility and visual behavior for loading state and aria-label handling.
  • Change generateAriaLabel to use double-quoted slot names and maintain behavior for loading and non-loading aria-label sources.
  • Switch the content wrapper CSS class from util_displayHiddenVisually to loading when the button is in a loading state, relying on dedicated loader positioning styles.
  • Add CSS to center the auro-loader absolutely within the button when present.
  • Fix indentation in a loading-related aria-label test and ensure slot-based aria-label behavior is covered.
src/auro-button.js
src/styles/style.scss
test/auro-button.test.js
Align core layout element defaults with appearance API and code style.
  • Ensure appearance property in AuroElement is declared with a trailing comma in its descriptor for consistency.
  • Set the default appearance in the AuroElement constructor using double quotes and explicitly initialize onDark to false.
src/layoutElement/auroElement.js
Improve repository metadata, templates, and automation for issues and pull requests.
  • Expand the pull request template with a Review Checklist that includes a detailed RC Checklist covering browsers, scenarios, and framework playground verification.
  • Fix a label in the bug report template to ask for the installed auro-button version instead of auro-templates.
  • Introduce a design handoff issue template to standardize UX-to-engineering handoffs including Figma links, blocking issues, and review points.
  • Add repository settings configuration via .github/settings.yml specifying homepage, topics, default branch, merge strategies, and team access.
  • Minorly reformat the add-project workflow YAML without changing behavior and add a new .nvmrc file for Node version management.
.github/PULL_REQUEST_TEMPLATE.md
.github/ISSUE_TEMPLATE/bug_report.yaml
.github/ISSUE_TEMPLATE/design_handoff.yaml
.github/workflows/add-project.yml
.github/settings.yml
.nvmrc
Update Node engine constraints, dependencies, publish metadata, and npm scripts to match current tooling and supply coverage reporting.
  • Relax the Node engines field from a specific set of majors to node >=20.
  • Bump lit and several @AuroDesignSystem devDependencies to newer patch/minor versions.
  • Enable npm publish provenance by adding provenance: true to publishConfig.
  • Add a test:coverage script that runs auro test with coverage reporting and opens the report.
  • Update the internal loaderVersion export to 6.0.0 (matching the installed auro-loader version) and regenerate package-lock.json accordingly.
package.json
src/loaderVersion.js
package-lock.json

Tips and commands

Interacting with Sourcery

  • Trigger a new review: Comment @sourcery-ai review on the pull request.
  • Continue discussions: Reply directly to Sourcery's review comments.
  • Generate a GitHub issue from a review comment: Ask Sourcery to create an
    issue from a review comment by replying to it. You can also reply to a
    review comment with @sourcery-ai issue to create an issue from it.
  • Generate a pull request title: Write @sourcery-ai anywhere in the pull
    request title to generate a title at any time. You can also comment
    @sourcery-ai title on the pull request to (re-)generate the title at any time.
  • Generate a pull request summary: Write @sourcery-ai summary anywhere in
    the pull request body to generate a PR summary at any time exactly where you
    want it. You can also comment @sourcery-ai summary on the pull request to
    (re-)generate the summary at any time.
  • Generate reviewer's guide: Comment @sourcery-ai guide on the pull
    request to (re-)generate the reviewer's guide at any time.
  • Resolve all Sourcery comments: Comment @sourcery-ai resolve on the
    pull request to resolve all Sourcery comments. Useful if you've already
    addressed all the comments and don't want to see them anymore.
  • Dismiss all Sourcery reviews: Comment @sourcery-ai dismiss on the pull
    request to dismiss all existing Sourcery reviews. Especially useful if you
    want to start fresh with a new review - don't forget to comment
    @sourcery-ai review to trigger a new review!

Customizing Your Experience

Access your dashboard to:

  • Enable or disable review features such as the Sourcery-generated pull request
    summary, the reviewer's guide, and others.
  • Change the review language.
  • Add, remove or edit custom review instructions.
  • Adjust other review settings.

Getting Help

@rmenner rmenner linked an issue Jan 13, 2026 that may be closed by this pull request

@sourcery-ai sourcery-ai Bot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Hey - I've found 3 issues, and left some high level feedback:

  • In auro-button the contentClasses key was changed from util_displayHiddenVisually to loading, but there’s no corresponding .loading style in style.scss, so the button label may no longer be visually hidden while loading; consider either keeping the original utility class or adding a matching .loading rule.
  • The loaderVersion.js export still reports '6.0.0' while @aurodesignsystem/auro-loader was bumped to ^6.1.0; it would be good to update this version constant to stay in sync with the actual loader dependency.
  • In docs/api.md, the Methods table header remains but no longer documents the register(name) method, even though README text still references it; consider adding back (or updating) the method row so the API docs stay aligned with the described usage.
Prompt for AI Agents
Please address the comments from this code review:

## Overall Comments
- In `auro-button` the `contentClasses` key was changed from `util_displayHiddenVisually` to `loading`, but there’s no corresponding `.loading` style in `style.scss`, so the button label may no longer be visually hidden while loading; consider either keeping the original utility class or adding a matching `.loading` rule.
- The `loaderVersion.js` export still reports `'6.0.0'` while `@aurodesignsystem/auro-loader` was bumped to `^6.1.0`; it would be good to update this version constant to stay in sync with the actual loader dependency.
- In `docs/api.md`, the Methods table header remains but no longer documents the `register(name)` method, even though README text still references it; consider adding back (or updating) the method row so the API docs stay aligned with the described usage.

## Individual Comments

### Comment 1
<location> `src/auro-button.js:471` </location>
<code_context>
     const contentClasses = {
       contentWrapper: true,
-      util_displayHiddenVisually: this.loading,
+      loading: this.loading,
     };

</code_context>

<issue_to_address>
**issue (bug_risk):** Switching from `util_displayHiddenVisually` to `loading` may break the visually-hidden behavior during loading.

`util_displayHiddenVisually` likely applied a shared visually-hidden pattern (hidden visually but exposed to screen readers). Unless `.loading` now provides equivalent styles, this change may regress accessibility or show duplicate content with the loader. Please either retain the utility or ensure `.loading` (or another class) implements the same visually-hidden behavior.
</issue_to_address>

### Comment 2
<location> `README.md:51` </location>
<code_context>

+* submit a form
+* begin a new task
+* trigger a new UI element to appear to the page
+* specify a new or next step in a process
 <!-- AURO-GENERATED-CONTENT:END -->
</code_context>

<issue_to_address>
**suggestion (typo):** Consider rephrasing this bullet to use "on the page" instead of "to the page".

For example, you could write: `* trigger a new UI element to appear on the page`.

```suggestion
* trigger a new UI element to appear on the page
```
</issue_to_address>

### Comment 3
<location> `docs/api.md:12` </location>
<code_context>
+| layout         | layout      |           | string                                              | `{'default'}` | Override layout since it isn't used in this component.                                                                                                                                                                                                                          |
</code_context>

<issue_to_address>
**question:** Double-check whether the `{'default'}` value for `layout` is the intended default formatting.

This default stands out from other string defaults in the table. If the default is the string `default`, consider formatting it as `` `default` `` for consistency. If it’s meant to be a non-string value, please clarify that in the type or description.
</issue_to_address>

Sourcery is free for open source - if you like our reviews please consider sharing them ✨
Help me be more useful! Please click 👍 or 👎 on each comment and I'll use the feedback to improve your reviews.

Comment thread README.md
Comment thread docs/api.md
@jason-capsule42
jason-capsule42 merged commit fe9ae39 into main Jan 13, 2026
22 of 26 checks passed
@jason-capsule42
jason-capsule42 deleted the rc/384 branch January 13, 2026 20:40
@github-actions

Copy link
Copy Markdown

🎉 This PR is included in version 12.3.1 🎉

The release is available on:

Your semantic-release bot 📦🚀

@github-actions github-actions Bot added the released Completed work has been released label Jan 13, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

released Completed work has been released semantic-status: fix

Projects

None yet

Development

Successfully merging this pull request may close these issues.

RC 2026-01-13

3 participants