astro-mermaid 2.0.2 → 2.0.4

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2025 Jose Sebastian
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -131,17 +131,34 @@ mermaid({
 
 ## Icon Packs
 
-You can register icon packs to use custom icons in your diagrams. Icon packs are loaded from Iconify JSON sources:
+You can register icon packs to use custom icons in your diagrams. There are three ways to provide a pack:
 
 ```js
 iconPacks: [
+  // 1. url — preferred: a JSON endpoint, fetched safely at runtime
   {
     name: 'logos',
-    loader: () => fetch('https://unpkg.com/@iconify-json/logos@1/icons.json').then(res => res.json())
+    url: 'https://unpkg.com/@iconify-json/logos@1/icons.json'
+  },
+
+  // 2. icons — pass icon data directly (e.g. an imported JSON file).
+  //    No serialization concerns, so this works with imports and shared data.
+  {
+    name: 'my-icons',
+    icons: myIcons // import myIcons from './my-icons.json'
+  },
+
+  // 3. loader — legacy. The function source is inspected for a fetch('...')
+  //    URL. Prefer `url` or `icons` instead.
+  {
+    name: 'iconoir',
+    loader: () => fetch('https://unpkg.com/@iconify-json/iconoir@1/icons.json').then(res => res.json())
   }
 ]
 ```
 
+> The integration never serializes arbitrary function bodies to the client. A `loader` is only used to extract its `fetch(...)` URL; if no URL can be found, the pack is skipped with a warning. Use `url` or `icons` for reliable results.
+
 Then use icons in your diagrams:
 
 ````markdown

package/astro-mermaid-integration.d.ts

@@ -12,10 +12,22 @@ export interface IconPack {
    */
   url?: string;
 
+  /**
+   * Inline icon data passed directly (e.g. imported from a JSON file).
+   * Avoids any serialization concerns since it is plain data.
+   * @example
+   * ```js
+   * import myIcons from './my-icons.json';
+   * // ...
+   * { name: 'my-icons', icons: myIcons }
+   * ```
+   */
+  icons?: Record<string, any>;
+
   /**
    * Legacy: loader function whose source is inspected for a fetch() URL.
-   * Prefer using the `url` property instead for safer serialization.
-   * @deprecated Use `url` instead.
+   * Prefer using the `url` or `icons` property instead for safer serialization.
+   * @deprecated Use `url` or `icons` instead.
    */
   loader?: () => Promise<any>;
 }

package/astro-mermaid-integration.js

@@ -255,34 +255,79 @@ export default function astroMermaid(options = {}) {
           viteOptimizeDepsInclude.push('@mermaid-js/layout-elk');
         }
 
-        // Update markdown config to use both remark and rehype plugins
-        updateConfig({
-          markdown: {
-            remarkPlugins: [
-              ...(config.markdown?.remarkPlugins || []),
-              [remarkMermaidPlugin, { logger }]
-            ],
-            rehypePlugins: [
-              ...(config.markdown?.rehypePlugins || []),
-              [rehypeMermaidPlugin, { logger }]
-            ]
-          },
-          vite: {
-            optimizeDeps: {
-              include: viteOptimizeDepsInclude
+        const remarkEntry = [remarkMermaidPlugin, { logger }];
+        const rehypeEntry = [rehypeMermaidPlugin, { logger }];
+        const viteConfig = { optimizeDeps: { include: viteOptimizeDepsInclude } };
+
+        // Astro 6.4+ deprecated `markdown.remarkPlugins` / `markdown.rehypePlugins`
+        // in favor of passing plugins to `unified({...})` via `markdown.processor`.
+        // On 6.4+ Astro always supplies a default unified processor, so its
+        // presence is our signal to use the new API and avoid the deprecation
+        // warning. Older Astro versions have no processor — fall back to the
+        // (still-supported there) plugin arrays. Fixes #62.
+        const existingProcessor = config.markdown?.processor;
+        let usedProcessor = false;
+
+        if (existingProcessor) {
+          try {
+            const { unified, isUnifiedProcessor } = await import('@astrojs/markdown-remark');
+            if (isUnifiedProcessor(existingProcessor)) {
+              const existingOptions = existingProcessor.options || {};
+              updateConfig({
+                markdown: {
+                  processor: unified({
+                    ...existingOptions,
+                    remarkPlugins: [...(existingOptions.remarkPlugins || []), remarkEntry],
+                    rehypePlugins: [...(existingOptions.rehypePlugins || []), rehypeEntry]
+                  })
+                },
+                vite: viteConfig
+              });
+              usedProcessor = true;
             }
+          } catch (error) {
+            // Dynamic import failed, the unified processor helpers are not
+            // exported, or updateConfig rejected the processor — fall through
+            // to the legacy plugin arrays below.
+            logger.warn(
+              `Could not configure the unified markdown processor, falling back ` +
+              `to remark/rehype plugin arrays: ${error.message}`
+            );
           }
-        });
+        }
+
+        if (!usedProcessor) {
+          // Update markdown config to use both remark and rehype plugins
+          updateConfig({
+            markdown: {
+              remarkPlugins: [
+                ...(config.markdown?.remarkPlugins || []),
+                remarkEntry
+              ],
+              rehypePlugins: [
+                ...(config.markdown?.rehypePlugins || []),
+                rehypeEntry
+              ]
+            },
+            vite: viteConfig
+          });
+        }
 
         // Validate and serialize icon packs for client-side use.
-        // Only the pack name and a JSON URL string are forwarded to the
-        // client — we never serialize arbitrary function bodies.
+        // Only the pack name and either inline icon data or a JSON URL string
+        // are forwarded to the client — we never serialize arbitrary function
+        // bodies.
         const iconPacksConfig = iconPacks.map(pack => {
           if (typeof pack.name !== 'string' || !pack.name) {
             throw new Error('astro-mermaid: each iconPack must have a non-empty "name" string');
           }
+          if (pack.icons) {
+            // Preferred: inline icon data passed directly (e.g. imported JSON).
+            // Plain data, so there are no serialization concerns. Fixes #18.
+            return { name: pack.name, icons: pack.icons };
+          }
           if (typeof pack.url === 'string') {
-            // Preferred: explicit URL
+            // Explicit URL
             return { name: pack.name, url: pack.url };
           }
           if (typeof pack.loader === 'function') {
@@ -296,13 +341,13 @@ export default function astroMermaid(options = {}) {
             logger.warn(
               `astro-mermaid: iconPack "${pack.name}" uses a loader function ` +
               `that could not be safely serialized. Please provide a "url" ` +
-              `property instead. This pack will be skipped.`
+              `or "icons" property instead. This pack will be skipped.`
             );
             return null;
           }
           throw new Error(
-            `astro-mermaid: iconPack "${pack.name}" must have a "url" string ` +
-            `or a "loader" function`
+            `astro-mermaid: iconPack "${pack.name}" must have a "url" string, ` +
+            `an "icons" object, or a "loader" function`
           );
         }).filter(Boolean);
 
@@ -331,10 +376,16 @@ async function loadMermaid() {
     const iconPacks = ${sanitizeJsonForScript(JSON.stringify(iconPacksConfig))};
     if (iconPacks && iconPacks.length > 0) {
       log('Registering', iconPacks.length, 'icon packs');
-      const packs = iconPacks.map(pack => ({
-        name: pack.name,
-        loader: () => fetch(pack.url).then(res => res.json())
-      }));
+      const packs = iconPacks.map(pack => {
+        if (pack.icons) {
+          // Inline icon data — register directly, no fetch needed
+          return { name: pack.name, icons: pack.icons };
+        }
+        return {
+          name: pack.name,
+          loader: () => fetch(pack.url).then(res => res.json())
+        };
+      });
       await mermaid.registerIconPacks(packs);
     }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "astro-mermaid",
-  "version": "2.0.2",
+  "version": "2.0.4",
   "description": "An Astro integration for rendering Mermaid diagrams with automatic theme switching and client-side rendering",
   "type": "module",
   "main": "./astro-mermaid-integration.js",
@@ -43,6 +43,14 @@
     "mdast-util-to-string": "^4.0.0",
     "unist-util-visit": "^5.0.0"
   },
+  "overrides": {
+    "vite": "^7.3.5",
+    "esbuild": "^0.28.1",
+    "ip-address": "^10.1.1",
+    "js-yaml": "^4.2.0",
+    "picomatch": "^4.0.4",
+    "tar": "^7.5.16"
+  },
   "scripts": {
     "test": "vitest",
     "test:ui": "vitest --ui",
@@ -52,7 +60,7 @@
   "devDependencies": {
     "@types/hast": "^3.0.4",
     "@vitest/ui": "^4.1.8",
-    "astro": "^6.0.0",
+    "astro": "^6.4.6",
     "hast-util-from-html": "^2.0.3",
     "mermaid": "^11.0.0",
     "rehype-parse": "^9.0.1",