Detect URLs for Links

[nathanclevenger]

In many of our use cases, the code would have many embedded URLs and we really need the URLs to be clickable like you can with any JSON viewer plugin in your browser:

{
  "🕵️ Inspect Vehicle": "https://inspect.vin/1C4HJXEN5MW592818",
  "🚛 Transport Vehicle": "https://transport.vin/1C4HJXEN5MW592818",
  "☁️ Connect Your Vehicle": "https://auth.vin/1C4HJXEN5MW592818",
  "🏦 Get Pre-Approved": "https://pre.approved.vin/1C4HJXEN5MW592818",
  "🕶️ Insure Vehicle": "https://ins.vin/1C4HJXEN5MW592818",
  "💸 Finance & Insurance": "https://fi.vin/1C4HJXEN5MW592818",
  "💸 Buy Vehicle": "https://buy.vin/1C4HJXEN5MW592818",
  "💸 Get Vehicle Service Contract": "https://vsc.vin/1C4HJXEN5MW592818"
}

Is this something that can be supported? Is there any workaround in the meantime? We can currently do this with Prism's Autolinker (https://prismjs.com/plugins/autolinker/), but we much prefer to use CodeHike if at all possible

[pomber]

The workaround is to use the link annotation: https://codehike.org/docs/annotations#link-annotation.

But we could add an autolink option.

[nathanclevenger]

@pomber we just upped our sponsorship and added a 1 time payment for additional support.

An autolink option would be amazing, and if you are able to add that soon we can use CodeHike as the basis for the documentation for our several hundred APIs that are all hypermedia link driven ... adding support for this feature would be greatly appreciated.

[pomber]

I added a global autoLink option (false by default):

mdxOptions = {
  remarkPlugins: [
    [
      remarkCodeHike,
      {
        theme: someTheme,
        autoLink: true,
      },
    ],
  ],
}

Demo

[nathanclevenger]

Amazing @pomber! Thank you so much!! 🙏

[github-actions]

🚀 Issue was released in v0.8.3 🚀