Merge pull request #1877 from mermaid-js/sidv/updateDocsURL

chore: Make docs URL configurable during build

.env

@@ -1,4 +1,5 @@
 MERMAID_DOMAIN=''
+MERMAID_DOCS_URL='https://mermaid.js.org'
 MERMAID_ANALYTICS_URL=''
 MERMAID_RENDERER_URL='https://mermaid.ink'
 MERMAID_KROKI_RENDERER_URL='https://kroki.io'

netlify.toml

@@ -1,5 +1,6 @@
 [build.environment]
 	MERMAID_ANALYTICS_URL = 'https://p.mermaid.live'
+	MERMAID_DOCS_URL = 'https://mermaid.js.org'
 	MERMAID_DOMAIN = 'mermaid.live'
 	MERMAID_RENDERER_URL = 'https://mermaid.ink'
 	MERMAID_KROKI_RENDERER_URL = 'https://kroki.io'

src/env.d.ts

@@ -4,6 +4,7 @@ interface ImportMetaEnv {
   readonly MERMAID_RENDERER_URL?: string;
   readonly MERMAID_KROKI_RENDERER_URL?: string;
   readonly MERMAID_ANALYTICS_URL?: string;
+  readonly MERMAID_DOCS_URL?: string;
   readonly MERMAID_DOMAIN?: string;
   readonly MERMAID_IS_ENABLED_MERMAID_CHART_LINKS?: string;
   // more env variables...

src/lib/components/DesktopEditor.svelte

@@ -1,5 +1,6 @@
 <script lang="ts">
   import type { EditorProps } from '$/types';
+  import { env } from '$/util/env';
   import { stateStore } from '$/util/state';
   import { initEditor } from '$lib/util/monacoExtra';
   import { errorDebug } from '$lib/util/util';
@@ -52,7 +53,7 @@
       schemas: [
         {
           fileMatch: ['config.json'],
-          uri: 'https://mermaid.js.org/schemas/config.schema.json'
+          uri: `${env.docsUrl}/schemas/config.schema.json`
         }
       ]
     });

src/lib/components/DiagramDocumentationButton.svelte

@@ -2,11 +2,12 @@
   import { Button } from '$/components/ui/button';
   import { TID } from '$/constants';
   import type { DocumentationConfig } from '$/types';
+  import { env } from '$/util/env';
   import { standardizeDiagramType } from '$/util/mermaid';
   import { stateStore } from '$/util/state';
   import BookIcon from '~icons/material-symbols/book-2-outline-rounded';
 
-  const docURLBase = 'https://mermaid.js.org';
+  const docURLBase = env.docsUrl;
   const docMap = {
     architecture: {
       code: '/syntax/architecture.html'

src/lib/components/MainMenu.svelte

@@ -2,6 +2,7 @@
   import McWrapper from '$/components/McWrapper.svelte';
   import * as Popover from '$/components/ui/popover';
   import { Switch } from '$/components/ui/switch';
+  import { env } from '$/util/env';
   import { urlsStore } from '$/util/state';
   import { cn } from '$/utils';
   import { mode, setMode } from 'mode-watcher';
@@ -41,13 +42,13 @@
     {
       label: 'Mermaid.js',
       icon: MermaidTailIcon,
-      href: 'https://mermaid.js.org/',
+      href: env.docsUrl,
       renderer: menuItem
     },
     {
       label: 'Documentation',
       icon: BookIcon,
-      href: 'https://mermaid.js.org/intro/',
+      href: `${env.docsUrl}/intro/`,
       renderer: menuItem
     },
     {

src/lib/util/env.ts

@@ -1,5 +1,6 @@
 export const env = {
   analyticsUrl: import.meta.env.MERMAID_ANALYTICS_URL ?? '',
+  docsUrl: import.meta.env.MERMAID_DOCS_URL ?? 'https://mermaid.js.org',
   domain: import.meta.env.MERMAID_DOMAIN ?? '',
   isEnabledMermaidChartLinks: import.meta.env.MERMAID_IS_ENABLED_MERMAID_CHART_LINKS === 'true',
   krokiRendererUrl: import.meta.env.MERMAID_KROKI_RENDERER_URL ?? '',