From d31527ba7f05a8fb850854d9705f337eb60d1ca3 Mon Sep 17 00:00:00 2001
From: Rowan Cockett <rowanc1@gmail.com>
Date: Wed, 4 Oct 2023 21:58:16 -0600
Subject: [PATCH] =?UTF-8?q?=F0=9F=90=9B=20Fix=20ESM=20packaging=20for=20co?=
 =?UTF-8?q?de-highlighting=20(#246)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .changeset/tidy-mayflies-drive.md             |  5 ++++
 .gitmodules                                   |  3 ---
 packages/myst-to-react/src/code.tsx           |  4 +--
 patches                                       |  1 -
 patches/@jupyter-widgets+controls+5.0.5.patch | 15 +++++++++++
 ...ypes+react-syntax-highlighter+15.5.7.patch | 26 +++++++++++++++++++
 6 files changed, 48 insertions(+), 6 deletions(-)
 create mode 100644 .changeset/tidy-mayflies-drive.md
 delete mode 100644 .gitmodules
 delete mode 160000 patches
 create mode 100644 patches/@jupyter-widgets+controls+5.0.5.patch
 create mode 100644 patches/@types+react-syntax-highlighter+15.5.7.patch

diff --git a/.changeset/tidy-mayflies-drive.md b/.changeset/tidy-mayflies-drive.md
new file mode 100644
index 000000000..c071d9987
--- /dev/null
+++ b/.changeset/tidy-mayflies-drive.md
@@ -0,0 +1,5 @@
+---
+'myst-to-react': patch
+---
+
+Fix ESM import of code styles
diff --git a/.gitmodules b/.gitmodules
deleted file mode 100644
index 95ca2e2c6..000000000
--- a/.gitmodules
+++ /dev/null
@@ -1,3 +0,0 @@
-[submodule "patches"]
-	path = patches
-	url = https://github.com/executablebooks/myst-theme-patches
diff --git a/packages/myst-to-react/src/code.tsx b/packages/myst-to-react/src/code.tsx
index d6383ac94..41c449aaa 100644
--- a/packages/myst-to-react/src/code.tsx
+++ b/packages/myst-to-react/src/code.tsx
@@ -2,8 +2,8 @@ import type { Code, InlineCode } from 'myst-spec';
 import type { NodeRenderer } from '@myst-theme/providers';
 import { useTheme } from '@myst-theme/providers';
 import { LightAsync as SyntaxHighlighter } from 'react-syntax-highlighter';
-import light from 'react-syntax-highlighter/dist/esm/styles/hljs/xcode';
-import dark from 'react-syntax-highlighter/dist/esm/styles/hljs/vs2015';
+import light from 'react-syntax-highlighter/dist/esm/styles/hljs/xcode.js';
+import dark from 'react-syntax-highlighter/dist/esm/styles/hljs/vs2015.js';
 import { DocumentIcon } from '@heroicons/react/24/outline';
 import classNames from 'classnames';
 import { CopyIcon } from './components/index.js';
diff --git a/patches b/patches
deleted file mode 160000
index 0bfbcc027..000000000
--- a/patches
+++ /dev/null
@@ -1 +0,0 @@
-Subproject commit 0bfbcc027e7da9b48d0a8dc14bbb3cd2387fd7bc
diff --git a/patches/@jupyter-widgets+controls+5.0.5.patch b/patches/@jupyter-widgets+controls+5.0.5.patch
new file mode 100644
index 000000000..ab4fb2eac
--- /dev/null
+++ b/patches/@jupyter-widgets+controls+5.0.5.patch
@@ -0,0 +1,15 @@
+diff --git a/node_modules/@jupyter-widgets/controls/css/widgets-base.css b/node_modules/@jupyter-widgets/controls/css/widgets-base.css
+index b5c14f8..4f481fa 100644
+--- a/node_modules/@jupyter-widgets/controls/css/widgets-base.css
++++ b/node_modules/@jupyter-widgets/controls/css/widgets-base.css
+@@ -8,8 +8,8 @@
+  * have been defined.
+  */
+ 
+-@import './lumino.css';
+-@import './nouislider.css';
++/* @import './lumino.css'; */
++/* @import './nouislider.css'; */
+ 
+ :root {
+   --jp-widgets-color: var(--jp-content-font-color1);
diff --git a/patches/@types+react-syntax-highlighter+15.5.7.patch b/patches/@types+react-syntax-highlighter+15.5.7.patch
new file mode 100644
index 000000000..974b607f3
--- /dev/null
+++ b/patches/@types+react-syntax-highlighter+15.5.7.patch
@@ -0,0 +1,26 @@
+diff --git a/node_modules/@types/react-syntax-highlighter/index.d.ts b/node_modules/@types/react-syntax-highlighter/index.d.ts
+index 413c917..4a9c465 100755
+--- a/node_modules/@types/react-syntax-highlighter/index.d.ts
++++ b/node_modules/@types/react-syntax-highlighter/index.d.ts
+@@ -696,11 +696,21 @@ declare module 'react-syntax-highlighter/dist/esm/styles/hljs/vs2015' {
+     export default style;
+ }
+ 
++declare module 'react-syntax-highlighter/dist/esm/styles/hljs/vs2015.js' {
++    const style: { [key: string]: React.CSSProperties };
++    export default style;
++}
++
+ declare module 'react-syntax-highlighter/dist/esm/styles/hljs/xcode' {
+     const style: { [key: string]: React.CSSProperties };
+     export default style;
+ }
+ 
++declare module 'react-syntax-highlighter/dist/esm/styles/hljs/xcode.js' {
++    const style: { [key: string]: React.CSSProperties };
++    export default style;
++}
++
+ declare module 'react-syntax-highlighter/dist/esm/styles/hljs/xt256' {
+     const style: { [key: string]: React.CSSProperties };
+     export default style;