Issue with AnchorNav setting the primary action to be styled as a primary button

[stamat]

I wanted to style the primary action of the AnchorNav.Action as the primary button. It defaults to secondary styles. In order to use the primary button styles we need to have two buttons. I couldn't find anything in the docs. Maybe this is the intended behavior?

Anyway I came up with a hack for this... Is there a non hacky way to achieve this

[rezrah]

Maybe this is the intended behavior?

👋 @stamat that's correct. It's mentioned in our docs here.

I recall the reason for going with secondary there was to not overpower the adjacent links.

[stamat]

@rezrah you think we should force the outline button if there is only one CTA? I mean that's ok with me, but not what we got in the designs... I personally prefer the primary action, and then if we have another one we use the secondary outline for it... But that's just my preference...

[rezrah]

Looping in Site FR @natalie-iv

[rezrah]

@stamat It turns out that you can forward the primary variant to the action 👇

<AnchorNav>
  <AnchorNav.Action variant="primary">Sign up</AnchorNav.Action>
</AnchorNav>

We're only providing sensible defaults in the component, not enforcing them. This means you can forward all the usual Button props to that component. This should meet the requirements of your request.

FWIW we're going to make a few changes to AnchorNav following a convo with Site yesterday:

• Make buttons smaller
• Enforce primer/secondary pairing of two primaries are used

[stamat]

@rezrah ah TMYK! Thanks legend! ✨

[stamat]

@rezrah eeeeeerrrrrr.... I think I tried variant before...

[rezrah]

Thanks for trying it @stamat, you're absolutely right, sorry for not noticing that. We're missing the type definitions to make this work in TS environments. I've opened a PR here that fixes this (and other things). Should land soon 🤞