Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Support the class attribute for hero action link buttons #2253

Merged
merged 2 commits into from
Sep 2, 2024

Conversation

HiDeoo
Copy link
Member

@HiDeoo HiDeoo commented Aug 22, 2024

This PR fixes an issue reported on Discord where trying to use the class attribute in hero action link buttons was not working as expected.

The link button generated with the following frontmatter would not include the TEST_CLASS_WARNING_REMOVE_ME class:

title: My Docs
template: splash
hero:
  actions:
    - text: Go
      icon: right-arrow
      link: /
      attrs:
        class: TEST_CLASS_WARNING_REMOVE_ME

Copy link

changeset-bot bot commented Aug 22, 2024

🦋 Changeset detected

Latest commit: 31b8ed3

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package
Name Type
@astrojs/starlight Patch

Not sure what this means? Click here to learn what changesets are.

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

@github-actions github-actions bot added the 🌟 core Changes to Starlight’s main package label Aug 22, 2024
Copy link

netlify bot commented Aug 22, 2024

Deploy Preview for astro-starlight ready!

Name Link
🔨 Latest commit 31b8ed3
🔍 Latest deploy log https://app.netlify.com/sites/astro-starlight/deploys/66ce0bba2c7d8100077b1f46
😎 Deploy Preview https://deploy-preview-2253--astro-starlight.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.
Lighthouse
Lighthouse
1 paths audited
Performance: 100 (no change from production)
Accessibility: 100 (no change from production)
Best Practices: 100 (no change from production)
SEO: 92 (no change from production)
PWA: -
View the detailed breakdown and full score reports

To edit notification comments on pull requests, go to your Netlify site configuration.

Copy link
Member

@delucis delucis left a comment

Choose a reason for hiding this comment

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

Looks good @HiDeoo — I’m curious about one detail, but happy with the code.

))}
{actions.map(
({ attrs: { class: className, ...attrs } = {}, icon, link: href, text, variant }) => (
<LinkButton {href} {variant} icon={icon?.name} class:list={[className]} {...attrs}>
Copy link
Member

Choose a reason for hiding this comment

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

Huh, interesting! Do you know why this extra work is needed? Because Astro already sets a class and uses that instead of the one spread in from attrs? Feels like maybe something we should report to the team.

Copy link
Member Author

Choose a reason for hiding this comment

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

Good question, I always assumed this was the expected pattern to use with our scopedStyleStrategy when you want to accept a class that you would pass down to a child and the component also get a scoped class. Using class would result with one being overwritten by the other so you would have to use class:list. Thinking about it, I guess this may be handled automatically, never thought about it, could be a good question to ask 🤔

Copy link
Member

@delucis delucis Aug 27, 2024

Choose a reason for hiding this comment

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

Asked on Discord, but I think we can still make this change as a fix for now!

Copy link
Member

@delucis delucis left a comment

Choose a reason for hiding this comment

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

Thanks for the fix @HiDeoo!

@delucis delucis added the 🌟 patch Change that triggers a patch release label Aug 27, 2024
@delucis delucis merged commit 72bc76a into withastro:main Sep 2, 2024
15 checks passed
@astrobot-houston astrobot-houston mentioned this pull request Sep 2, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
🌟 core Changes to Starlight’s main package 🌟 patch Change that triggers a patch release
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants