Repository navigation
<A> should support "mailto:" hrefs #266
Description
I'm using this component to render links in some MDX content, which is convenient since it works out of the box for any kind of links, internal or external. However, it doesn't seem to handle mailto href values appropriately, forcing me to create a custom wrapper. I think it should probably be supported out of the box, along with "tel" and other similar patterns.
Activity
[-]<A> doesn't support mailto: hrefs[/-][+]<A> doesn't support "mailto:" hrefs[/+]russelgal commentedon Apr 18, 2023
but
<a/>supports ))DaniGuardiola commentedon Apr 18, 2023
@russelgal I'm not sure what you mean. I use Solid Start's
<A>because I want to be able to link to other pages in my blog posts, and for those links to work client-side without causing a full refresh.russelgal commentedon Apr 18, 2023
<A/>for internal links<a/>forhref="tel:|mailto:"etcDaniGuardiola commentedon Apr 19, 2023
@russelgal I understand the current behavior, and that's what I'm doing as my workaround. This is a proposal to improve
<A />by adding support for that type of href value.Btw, I just realized there's a similar problem with anchor links (e.g.
#section-name) that's forced me to build a similar workaround for them. So I'd add that to the proposal.boehs commentedon Apr 21, 2023
Again,
<A/>is specifically for links that trigger CSR. I don't see what's wrong with that?DaniGuardiola commentedon Apr 22, 2023
@boehs it's not wrong. I'm just proposing that other types of href values are supported, just like external values already are.
I'm not sure if it's accidental or intentional, but right now you can use
<A />for URLs that are not internal (such as a twitter profile) and it works just fine. In fact, that makes a few situations much easier to implement, like rendering some links in a header from data that contains a mix of internal and external URLs. That's in fact what I do in my new blog: dio.la (code: https://github.com/DaniGuardiola/dio.la/blob/d7e018f3e84eff06be896bba23f9e839f840aaca/src/root.tsx#L35-L59)This property of
<A />means that I don't need to be manually checking every URL to determine if it's internal or external to conditionally render<A />or<a />, which is a great feature IMO.As I explained, this same pattern could extend to other href value types like
mailto:to gain the same benefits.It's just a proposal, so I 100% understand if there are arguments against it, but please do try to understand what I'm asking for here :P
boehs commentedon Apr 22, 2023
Thanks, this is helpful
ryansolid commentedon Aug 8, 2023
Adding more bails out on seems unnecessary. Like if you are using
mailto:you probably know. But I will move this to discussions. Because of developments around partial hydration patterns I am still very much thinking about the impact of<A>vs<a>.[-]<A> doesn't support "mailto:" hrefs[/-][+]<A> should support "mailto:" hrefs[/+]