Add links to tile provider authentication docs (#914)

This probably confused some people in the past, since vector tiles won't
even display an access denied image ;)

Before (no information on access keys and where to get them):

<img width="411" alt="image"
src="https://github.com/user-attachments/assets/8820fb20-bda4-460c-9cc9-8fec5daa480d">

After (add links to providers in info callout + add a field for Stadia
Maps API keys):

<img width="395" alt="image"
src="https://github.com/user-attachments/assets/91ee732c-b3f5-45f8-81a6-8d896a93f644">

---------

Co-authored-by: Harel M <harel.mazor@gmail.com>
Co-authored-by: Joscha <34318751+josxha@users.noreply.github.com>
Co-authored-by: Hugues Tavernier <hugues.tavernier@protonmail.com>
Co-authored-by: Keitaroh Kobayashi <keita@kbys.me>

src/components/Doc.tsx

@@ -18,6 +18,8 @@ type DocProps = {
     'sdk-support'?: {
       [key: string]: typeof headers
     }
+    docUrl?: string,
+    docUrlLinkText?: string
   }
 };
 
@@ -25,7 +27,7 @@ export default class Doc extends React.Component<DocProps> {
   render () {
     const {fieldSpec} = this.props;
 
-    const {doc, values} = fieldSpec;
+    const {doc, values, docUrl, docUrlLinkText} = fieldSpec;
     const sdkSupport = fieldSpec['sdk-support'];
 
     const renderValues = (
@@ -85,7 +87,12 @@ export default class Doc extends React.Component<DocProps> {
             </table>
           </div>
         }
+        {docUrl && docUrlLinkText &&
+          <div className="SpecDoc__learn-more">
+            <a href={docUrl}  target="_blank" rel="noreferrer">{docUrlLinkText}</a>
+          </div>
+        }
       </>
     );
   }
-}
+}