feat: bump deps; syntaxes now optional; katex now peer dep

components/Footer.tsx

@@ -39,6 +39,7 @@ export const FooterImpl: React.FC = () => {
             href='#'
             role='button'
             onClick={onToggleDarkMode}
+            title='Toggle dark mode'
           >
             {darkMode.value ? <IoMoonSharp /> : <IoSunnyOutline />}
           </a>

components/NotionPage.tsx

@@ -41,8 +41,45 @@ import styles from './styles.module.css'
 // -----------------------------------------------------------------------------
 
 const Code = dynamic(() =>
-  import('react-notion-x/build/third-party/code').then((m) => m.Code)
+  import('react-notion-x/build/third-party/code').then(async (m) => {
+    // add / remove any prism syntaxes here
+    await Promise.all([
+      import('prismjs/components/prism-markup-templating.js'),
+      import('prismjs/components/prism-markup.js'),
+      import('prismjs/components/prism-bash.js'),
+      import('prismjs/components/prism-c.js'),
+      import('prismjs/components/prism-cpp.js'),
+      import('prismjs/components/prism-csharp.js'),
+      import('prismjs/components/prism-docker.js'),
+      import('prismjs/components/prism-java.js'),
+      import('prismjs/components/prism-js-templates.js'),
+      import('prismjs/components/prism-coffeescript.js'),
+      import('prismjs/components/prism-diff.js'),
+      import('prismjs/components/prism-git.js'),
+      import('prismjs/components/prism-go.js'),
+      import('prismjs/components/prism-graphql.js'),
+      import('prismjs/components/prism-handlebars.js'),
+      import('prismjs/components/prism-less.js'),
+      import('prismjs/components/prism-makefile.js'),
+      import('prismjs/components/prism-markdown.js'),
+      import('prismjs/components/prism-objectivec.js'),
+      import('prismjs/components/prism-ocaml.js'),
+      import('prismjs/components/prism-python.js'),
+      import('prismjs/components/prism-reason.js'),
+      import('prismjs/components/prism-rust.js'),
+      import('prismjs/components/prism-sass.js'),
+      import('prismjs/components/prism-scss.js'),
+      import('prismjs/components/prism-solidity.js'),
+      import('prismjs/components/prism-sql.js'),
+      import('prismjs/components/prism-stylus.js'),
+      import('prismjs/components/prism-swift.js'),
+      import('prismjs/components/prism-wasm.js'),
+      import('prismjs/components/prism-yaml.js')
+    ])
+    return m.Code
+  })
 )
+
 const Collection = dynamic(() =>
   import('react-notion-x/build/third-party/collection').then(
     (m) => m.Collection

components/NotionPageHeader.tsx

@@ -65,6 +65,7 @@ export const NotionPageHeader: React.FC<{
           <div
             className={cs('breadcrumb', 'button')}
             role='button'
+            aria-command-name='Toggle dark mode'
             onClick={darkMode.toggle}
           >
             {hasMounted && darkMode.value ? (

package.json

@@ -35,20 +35,21 @@
     "fathom-client": "^3.4.1",
     "got": "^12.0.3",
     "isomorphic-unfetch": "^3.1.0",
+    "katex": "^0.15.3",
     "lqip-modern": "^1.2.0",
     "next": "^12.1.1",
     "next-api-og-image": "^2.2.1",
     "node-fetch": "^2.6.1",
-    "notion-client": "^6.9.2",
+    "notion-client": "^6.9.3-6.10.0-alpha.0.0",
     "notion-types": "^6.7.0",
-    "notion-utils": "^6.9.2",
+    "notion-utils": "^6.9.3-6.10.0-alpha.0.0",
     "p-map": "^5.3.0",
     "p-memoize": "^6.0.1",
     "posthog-js": "^1.20.2",
     "react": "^17.0.2",
     "react-body-classname": "^1.3.1",
     "react-dom": "^17.0.2",
-    "react-notion-x": "^6.9.2",
+    "react-notion-x": "^6.9.3-6.10.0-alpha.0.0",
     "react-static-tweets": "^0.7.2",
     "react-use": "^17.3.2",
     "static-tweets": "^0.7.2"

yarn.lock

@@ -2520,10 +2520,10 @@ jsonfile@^5.0.0:
     array-includes "^3.1.3"
     object.assign "^4.1.2"
 
-katex@^0.13.18:
-  version "0.13.24"
-  resolved "https://registry.npmjs.org/katex/-/katex-0.13.24.tgz"
-  integrity sha512-jZxYuKCma3VS5UuxOx/rFV1QyGSl3Uy/i0kTJF3HgQ5xMinCQVF8Zd4bMY/9aI9b9A2pjIBOsjSSm68ykTAr8w==
+katex@^0.15.3:
+  version "0.15.3"
+  resolved "https://registry.yarnpkg.com/katex/-/katex-0.15.3.tgz#08781a7ed26800b20380d959d1ffcd62bca0ec14"
+  integrity sha512-Al6V7RJsmjklT9QItyHWGaQCt+NYTle1bZwB1e9MR/tLoIT1MXaHy9UpfGSB7eaqDgjjqqRxQOaQGrALCrEyBQ==
   dependencies:
     commander "^8.0.0"
 
@@ -2928,14 +2928,14 @@ normalize-url@^7.0.3:
   resolved "https://registry.npmjs.org/normalize-url/-/normalize-url-7.0.3.tgz"
   integrity sha512-RiCOdwdPnzvwcBFJE4iI1ss3dMVRIrEzFpn8ftje6iBfzBInqlnRrNhxcLwBEKjPPXQKzm1Ptlxtaiv9wdcj5w==
 
-notion-client@^6.9.2:
-  version "6.9.2"
-  resolved "https://registry.yarnpkg.com/notion-client/-/notion-client-6.9.2.tgz#789b3e5ba5be3a75dc7013212db9b9abe53fc3e6"
-  integrity sha512-VMuaXbd/du83r+4gKRdIgeePduWZMSYfISr8FM9gePdRFt2HoSsWQC1cxqX+V/S3N7xkUFSWbHJcJkWcDpSx+g==
+notion-client@^6.9.3-6.10.0-alpha.0.0:
+  version "6.9.3-6.10.0-alpha.0.0"
+  resolved "https://registry.yarnpkg.com/notion-client/-/notion-client-6.9.3-6.10.0-alpha.0.0.tgz#b82b95733ae4bc543d25e4341d98a5b57f795fba"
+  integrity sha512-Zq+7TxavVYuZ4+zUqlqeIEENkfM64b1u0MBNQSgKuHW9typCqQBckxnYwm2gydOHgBdrEp1nFWOugE8kXU+Nrg==
   dependencies:
     got "^11.8.1"
     notion-types "^6.7.0"
-    notion-utils "^6.9.2"
+    notion-utils "^6.9.3-6.10.0-alpha.0.0"
     p-map "^5.3.0"
 
 notion-types@^6.7.0:
@@ -2943,10 +2943,10 @@ notion-types@^6.7.0:
   resolved "https://registry.yarnpkg.com/notion-types/-/notion-types-6.7.0.tgz#f5ccb8ef701389b2bf52e5561bd31bc60c49ccdf"
   integrity sha512-j7O6juQDOPgAinELMMpvVn0c8Vgr+Dhqm7UTTnhILnBhbOtQKaIYPCNKA4AJw/OPzzy1iEJ6KrthTEkPbQYEeg==
 
-notion-utils@^6.9.2:
-  version "6.9.2"
-  resolved "https://registry.yarnpkg.com/notion-utils/-/notion-utils-6.9.2.tgz#d295a10fcef28a1b75bd8e8dd4bb319554eb0719"
-  integrity sha512-bk2lbxARjZawqLjnmjH4uICHQAKFOTuu1j842ZC5XYq1DKZtatwZamTc4wwWQ9yQHyDAsY03cV9EQisUOnZLvQ==
+notion-utils@^6.9.3-6.10.0-alpha.0.0:
+  version "6.9.3-6.10.0-alpha.0.0"
+  resolved "https://registry.yarnpkg.com/notion-utils/-/notion-utils-6.9.3-6.10.0-alpha.0.0.tgz#d8515de8fae473a7163e7feb85a33355f18c7933"
+  integrity sha512-uBJYy2JzMVWLy1UvnaEsmZPlM32B8zxWx9rAmMTmcszblYrTCU9CZJCA0h/gyYiI7hmYfDEXDEgpFo/4kkpEtQ==
   dependencies:
     is-url-superb "^6.1.0"
     mem "^9.0.2"
@@ -3511,17 +3511,16 @@ react-modal@^3.14.3:
     react-lifecycles-compat "^3.0.0"
     warning "^4.0.3"
 
-react-notion-x@^6.9.2:
-  version "6.9.2"
-  resolved "https://registry.yarnpkg.com/react-notion-x/-/react-notion-x-6.9.2.tgz#463a07d701cbbbf27d7b0cb245af861b546d5a07"
-  integrity sha512-2AqaGCYIw6wZa4KLg+HkPC00n99L+cJjcts6f51QuWTS0gsAd6m2Va3qHzpkkFIRBL+e82TK1fXAnvcI1/jvfA==
+react-notion-x@^6.9.3-6.10.0-alpha.0.0:
+  version "6.9.3-6.10.0-alpha.0.0"
+  resolved "https://registry.yarnpkg.com/react-notion-x/-/react-notion-x-6.9.3-6.10.0-alpha.0.0.tgz#d83f3618a220db712bb8bed4af03bf7d10d95f5e"
+  integrity sha512-JI/KfqIX4+1Q644HEU13CUix5u+LeOWTPbr2q8x/PeoULhise89A68QSN/j34kQvBw+zVZThc8/As1BN5Wgj6A==
   dependencies:
     "@matejmazur/react-katex" "^3.1.3"
     "@radix-ui/react-dropdown-menu" "^0.1.6"
-    katex "^0.13.18"
     medium-zoom "^1.0.6"
     notion-types "^6.7.0"
-    notion-utils "^6.9.2"
+    notion-utils "^6.9.3-6.10.0-alpha.0.0"
     prismjs "^1.27.0"
     react-fast-compare "^3.2.0"
     react-hotkeys-hook "^3.0.3"