Fix Cannot read properties of undefined (reading 'ReactCurrentOwner')

.examples/chesterish.stories.tsx

@@ -1,8 +1,8 @@
 import React from "react";
 
 import { IpynbRenderer } from "../src/index_katex";
-import pca1 from "./ipynb/pca1.ipynb";
-import matrix from "./ipynb/matrix-3.ipynb";
+import pca1 from "./ipynb/pca1.json";
+import matrix from "./ipynb/matrix-3.json";
 
 import "../src/styles/chesterish.less";
 

.examples/grade3.stories.tsx

@@ -1,8 +1,8 @@
 import React from "react";
 
 import { IpynbRenderer } from "../src/index";
-import pca1 from "./ipynb/pca1.ipynb";
-import matrix from "./ipynb/matrix-3.ipynb";
+import pca1 from "./ipynb/pca1.json";
+import matrix from "./ipynb/matrix-3.json";
 
 import "../src/styles/grade3.less";
 

.examples/gruvboxd.stories.tsx

@@ -1,8 +1,8 @@
 import React from "react";
 
 import { IpynbRenderer } from "../src/index";
-import pca1 from "./ipynb/pca1.ipynb";
-import matrix from "./ipynb/matrix-3.ipynb";
+import pca1 from "./ipynb/pca1.json";
+import matrix from "./ipynb/matrix-3.json";
 
 import "../src/styles/gruvboxd.less";
 

.examples/gruvboxl.stories.tsx

@@ -1,8 +1,8 @@
 import React from "react";
 
 import { IpynbRenderer } from "../src/index";
-import pca1 from "./ipynb/pca1.ipynb";
-import matrix from "./ipynb/matrix-3.ipynb";
+import pca1 from "./ipynb/pca1.json";
+import matrix from "./ipynb/matrix-3.json";
 
 import "../src/styles/gruvboxl.less";
 

.examples/monokai.stories.tsx

@@ -1,8 +1,8 @@
 import React from "react";
 
 import { IpynbRenderer } from "../src/index";
-import pca1 from "./ipynb/pca1.ipynb";
-import matrix from "./ipynb/matrix-3.ipynb";
+import pca1 from "./ipynb/pca1.json";
+import matrix from "./ipynb/matrix-3.json";
 //import "../src/styles/themes/chesterish.less";
 
 import "../src/styles/monokai.less";

.examples/oceans16.stories.tsx

@@ -1,8 +1,8 @@
 import React from "react";
 
 import { IpynbRenderer } from "../src/index";
-import pca1 from "./ipynb/pca1.ipynb";
-import matrix from "./ipynb/matrix-3.ipynb";
+import pca1 from "./ipynb/pca1.json";
+import matrix from "./ipynb/matrix-3.json";
 
 import "../src/styles/oceans16.less";
 

.examples/onedork.stories.tsx

@@ -1,8 +1,8 @@
 import React from "react";
 
 import { IpynbRenderer } from "../src/index";
-import pca1 from "./ipynb/pca1.ipynb";
-import matrix from "./ipynb/matrix-3.ipynb";
+import pca1 from "./ipynb/pca1.json";
+import matrix from "./ipynb/matrix-3.json";
 
 import "../src/styles/onedork.less";
 

.examples/solarizedd.stories.tsx

@@ -1,8 +1,8 @@
 import React from "react";
 
 import { IpynbRenderer } from "../src/index";
-import pca1 from "./ipynb/pca1.ipynb";
-import matrix from "./ipynb/matrix-3.ipynb";
+import pca1 from "./ipynb/pca1.json";
+import matrix from "./ipynb/matrix-3.json";
 
 import "../src/styles/solarizedd.less";
 

.examples/solarizedl.stories.tsx

@@ -1,11 +1,8 @@
 import React from "react";
-import "katex/dist/katex.min.css";
 
 import { IpynbRenderer } from "../src/index_katex";
-import pca1 from "./ipynb/pca1.ipynb";
-import matrix from "./ipynb/matrix-3.ipynb";
-
-import "../src/styles/solarizedl.less";
+import pca1 from "./ipynb/pca1.json";
+import matrix from "./ipynb/matrix-3.json";
 
 export default {
   title: "solarizedl",

.examples/test-katex.stories.tsx

@@ -1,16 +1,14 @@
 import React from "react";
 
 import { IpynbRenderer as IpynbRendererKatex } from "../src/index_katex";
-import testfile from "./ipynb/test.ipynb";
+import testfile from "./ipynb/test.json";
 
 import "../src/styles/onedork.less";
 
 export default {
   title: "Test",
 };
 
-import "katex/dist/katex.min.css";
-
 export const katex = () => {
   return (
     <>

.examples/test-mathjax.stories.tsx

@@ -1,7 +1,7 @@
 import React from "react";
 
 import { IpynbRenderer as IpynbRendererMathjax } from "../src/index";
-import testfile from "./ipynb/test.ipynb";
+import testfile from "./ipynb/test.json";
 
 import "../src/styles/onedork.less";
 

.github/workflows/build.yaml

@@ -13,21 +13,28 @@ jobs:
       - name: setup
         uses: actions/setup-node@v4
         with:
-          node-version: "18.18.2"
+          node-version: "24.1.0"
+
+      - name: install pnpm
+        uses: pnpm/action-setup@v4
+        with:
+          version: latest
 
       - name: cache
-        uses: actions/cache@v2.1.1
+        uses: actions/cache@v4
         with:
           path: |
             node_modules
-          key: ${{ runner.os }}-${{ hashFiles('**/yarn.lock') }}
+            ~/.pnpm-store
+          key: ${{ runner.os }}-${{ hashFiles('**/pnpm-lock.yaml') }}
 
       - name: upload
         run: |
           git submodule update --init --recursive
+          pnpm install
           make build
           echo "//registry.npmjs.org/:_authToken=${{ secrets.NPM_TOKEN }}" > .npmrc
-          npm publish || true
+          pnpm publish --no-git-checks --tag alpha || true
           unlink katex/README.md && cp README.md katex/README.md
           echo "//registry.npmjs.org/:_authToken=${{ secrets.NPM_TOKEN }}" > katex/.npmrc
-          cd katex && npm publish || true
+          cd katex && pnpm publish --no-git-checks --tag alpha || true

.github/workflows/e2e.yaml

@@ -18,29 +18,35 @@ jobs:
       - name: setup node
         uses: actions/setup-node@v4
         with:
-          node-version: "18.18.2"
+          node-version: "24.1.0"
+
+      - name: install pnpm
+        uses: pnpm/action-setup@v4
+        with:
+          version: latest
 
       - name: cache
-        uses: actions/cache@v3
+        uses: actions/cache@v4
         with:
           path: |
             node_modules
-          key: ${{ runner.os }}-${{ hashFiles('**/yarn.lock') }}
+            ~/.pnpm-store
+          key: ${{ runner.os }}-${{ hashFiles('**/pnpm-lock.yaml') }}
 
       - name: install
         run: |
-          yarn install
+          pnpm install
           npx playwright install --with-deps
 
       - name: build
-        run: yarn run storybook:build
+        run: pnpm storybook:build
 
       - name: run server
         run: |
           python -m http.server 6006 --directory "${{ github.workspace }}/storybook-static" &
 
       - name: e2e test
-        run: yarn e2e:ci
+        run: pnpm e2e:ci
 
       - uses: actions/upload-artifact@v4
         with:

.storybook/main.mjs

@@ -0,0 +1,49 @@
+import path from "path";
+
+const config = {
+  stories: ["../.examples/**/*.stories.@(js|jsx|ts|tsx)"],
+  addons: [
+    "@storybook/addon-onboarding",
+    "@storybook/addon-links",
+    "@storybook/addon-essentials",
+    "@chromatic-com/storybook",
+    "@storybook/addon-interactions",
+  ],
+  framework: {
+    name: "@storybook/react-vite",
+    options: {},
+  },
+  docs: {
+    autodocs: true,
+  },
+  typescript: {
+    check: false,
+    reactDocgen: 'react-docgen-typescript',
+    reactDocgenTypescriptOptions: {
+      shouldExtractLiteralValuesFromEnum: true,
+      propFilter: (prop) => (prop.parent ? !/node_modules/.test(prop.parent.fileName) : true),
+    },
+  },
+  viteFinal: async (config, { configType }) => {
+    // `configType` has a value of 'DEVELOPMENT' or 'PRODUCTION'
+    // You can change the configuration based on that.
+    // 'PRODUCTION' is used when building the static version of storybook.
+
+    // Make whatever fine-grained changes you need
+    config.css = {
+      preprocessorOptions: {
+        less: {
+          javascriptEnabled: true,
+        },
+      },
+    };
+
+    // Add support for .ipynb files
+    config.assetsInclude = ['**/*.ipynb'];
+
+    // Return the altered config
+    return config;
+  },
+};
+
+export default config;

.storybook/preview.ts → .storybook/preview.mjs

@@ -1,6 +1,4 @@
-import type { Preview } from "@storybook/react";
-
-const preview: Preview = {
+const preview = {
   parameters: {
     controls: {
       matchers: {

.tool-versions

@@ -1 +1 @@
-nodejs 18.18.2
+nodejs 24.1.0