From 431592233f0dc5679013bb623d790cab3aabc715 Mon Sep 17 00:00:00 2001
From: stereobooster <stereobooster@gmail.com>
Date: Wed, 1 May 2024 21:03:24 +0200
Subject: [PATCH] for whatever reason I can't fix Astro component

---
 packages/astro-graphviz/Graphviz.astro        | 34 +++++++++++--------
 packages/astro-graphviz/package.json          |  3 +-
 packages/cache/package.json                   |  6 ++--
 .../src/content/docs/examples/graphviz.mdx    |  4 ---
 packages/rehype-graphviz/src/index.ts         | 31 ++++++++---------
 pnpm-lock.yaml                                |  3 ++
 6 files changed, 43 insertions(+), 38 deletions(-)

diff --git a/packages/astro-graphviz/Graphviz.astro b/packages/astro-graphviz/Graphviz.astro
index 88e2155..e0f0389 100644
--- a/packages/astro-graphviz/Graphviz.astro
+++ b/packages/astro-graphviz/Graphviz.astro
@@ -1,22 +1,26 @@
 ---
-import {
-  renderGraphviz,
-  type RenderGraphvizOptions,
-} from "@beoe/rehype-graphviz";
-import { getCache } from "@beoe/cache";
-import { serialize } from "node:v8";
+// I can't use internal modules - don't know why
+// import { processGraphvizSvg } from "@beoe/rehype-graphviz";
+// import { getCache } from "@beoe/cache";
+import { Graphviz } from "@hpcc-js/wasm";
+const graphviz = await Graphviz.load();
 
-const cache = await getCache();
+// const cache = await getCache();
 
-interface Props extends RenderGraphvizOptions {}
+interface Props {
+  code: string;
+  class?: string;
+}
 
 let svg: string;
-const cacheKey = serialize(Astro.props);
-svg = cache.get(cacheKey);
-if (svg === undefined) {
-  svg = await renderGraphviz(Astro.props);
-  cache.set(cacheKey, svg);
-}
+// const cacheKey = Astro.props.code;
+// svg = cache.get(cacheKey);
+// if (svg === undefined) {
+svg = graphviz.dot(Astro.props.code);
+//   cache.set(cacheKey, svg);
+// }
 ---
 
-<Fragment set:html={svg} />
+<figure class={`beoe graphviz ${Astro.props.class || ""}`}>
+  <Fragment set:html={svg} />
+</figure>
diff --git a/packages/astro-graphviz/package.json b/packages/astro-graphviz/package.json
index 0d17eb1..dc145d8 100644
--- a/packages/astro-graphviz/package.json
+++ b/packages/astro-graphviz/package.json
@@ -32,7 +32,8 @@
   },
   "dependencies": {
     "@beoe/cache": "workspace:*",
-    "@beoe/rehype-graphviz": "workspace:*"
+    "@beoe/rehype-graphviz": "workspace:*",
+    "@hpcc-js/wasm": "^2.16.1"
   },
   "devDependencies": {
     "astro": "^4.0.0"
diff --git a/packages/cache/package.json b/packages/cache/package.json
index 835c06a..b634eaf 100644
--- a/packages/cache/package.json
+++ b/packages/cache/package.json
@@ -14,8 +14,10 @@
     "directory": "packages/sqlitecache"
   },
   "exports": {
-    "types": "./dist/index.d.js",
-    "default": "./dist/index.js"
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
+    }
   },
   "main": "./dist/index.js",
   "module": "./dist/index.js",
diff --git a/packages/demo/src/content/docs/examples/graphviz.mdx b/packages/demo/src/content/docs/examples/graphviz.mdx
index ac95c36..7eb8f2e 100644
--- a/packages/demo/src/content/docs/examples/graphviz.mdx
+++ b/packages/demo/src/content/docs/examples/graphviz.mdx
@@ -32,9 +32,6 @@ digraph finite_state_machine {
 
 ## astro-component
 
-For unkown reason this fails during build
-
-```
 import { Graphviz } from "@beoe/astro-graphviz";
 
 <Graphviz
@@ -63,4 +60,3 @@ import { Graphviz } from "@beoe/astro-graphviz";
     8 -> 5 [label = "S(a)"];
 }`}
 />
-```
diff --git a/packages/rehype-graphviz/src/index.ts b/packages/rehype-graphviz/src/index.ts
index 189da7b..94d51d4 100644
--- a/packages/rehype-graphviz/src/index.ts
+++ b/packages/rehype-graphviz/src/index.ts
@@ -3,29 +3,28 @@ import type { Root } from "hast";
 import { processGraphvizSvg } from "./graphviz.js";
 import { rehypeCodeHook, type MapLike } from "@beoe/rehype-code-hook";
 
-// import { Graphviz } from "@hpcc-js/wasm";
-// const graphviz = await Graphviz.load();
-// export const renderGraphviz = ({ code }: { code: string }) =>
-//   processGraphvizSvg(graphviz.dot(code));
-
-import { waitFor } from "@beoe/rehype-code-hook";
-
 export type RenderGraphvizOptions = { code: string; class?: string };
 
+import { Graphviz } from "@hpcc-js/wasm";
+const graphviz = await Graphviz.load();
+export const renderGraphviz = (o: RenderGraphvizOptions) =>
+  processGraphvizSvg(graphviz.dot(o.code), o.class);
+
+// import { waitFor } from "@beoe/rehype-code-hook";
 /**
  * If all graphviz diagrams are cached it would not even load module in memory.
  * If there are diagrams, it would load module and first few renders would be async,
  * but all consequent renders would be sync
  */
-export const renderGraphviz = waitFor(
-  async () => {
-    // @ts-ignore
-    const Graphviz = (await import("@hpcc-js/wasm")).Graphviz;
-    return await Graphviz.load();
-  },
-  (graphviz) => (o: RenderGraphvizOptions) =>
-    processGraphvizSvg(graphviz.dot(o.code), o.class)
-);
+// export const renderGraphviz = waitFor(
+//   async () => {
+//     // @ts-ignore
+//     const Graphviz = (await import("@hpcc-js/wasm")).Graphviz;
+//     return await Graphviz.load();
+//   },
+//   (graphviz) => (o: RenderGraphvizOptions) =>
+//     processGraphvizSvg(graphviz.dot(o.code), o.class)
+// );
 
 export { processGraphvizSvg };
 
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 6bb3b30..f179ef5 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -35,6 +35,9 @@ importers:
       '@beoe/rehype-graphviz':
         specifier: workspace:*
         version: link:../rehype-graphviz
+      '@hpcc-js/wasm':
+        specifier: ^2.16.1
+        version: 2.16.1
     devDependencies:
       astro:
         specifier: ^4.0.0