fix: react issues

Author: DylanVann

packages/gatsby-plugin-perfect-dark-mode/package.json

@@ -14,9 +14,9 @@
   "license": "MIT",
   "author": "Dylan Vann <dylan@dylanvann.com> (https://dylanvann.com)",
   "sideEffects": "false",
-  "main": "dist/index.cjs.js",
-  "module": "dist/index.esm.js",
-  "types": "dist/index.d.ts",
+  "main": "src/index.cjs.js",
+  "module": "src/index.esm.js",
+  "types": "src/index.d.ts",
   "files": [
     "gatsby-ssr.js",
     "dist"

packages/gatsby-plugin-perfect-dark-mode/src/index.cjs.js

@@ -0,0 +1 @@
+module.exports = require('react-perfect-dark-mode')

…by-plugin-perfect-dark-mode/src/index.ts …-plugin-perfect-dark-mode/src/index.d.tspackages/gatsby-plugin-perfect-dark-mode/src/index.ts renamed to packages/gatsby-plugin-perfect-dark-mode/src/index.d.ts packages/gatsby-plugin-perfect-dark-mode/src/index.ts renamed to packages/gatsby-plugin-perfect-dark-mode/src/index.d.ts

@@ -0,0 +1 @@
+export * from 'react-perfect-dark-mode'

packages/gatsby-plugin-perfect-dark-mode/src/index.esm.js

@@ -0,0 +1,15 @@
+{
+  "compilerOptions": {
+    "target": "ES2020",
+    "module": "ES2020",
+    "strict": true,
+    "moduleResolution": "node",
+    "esModuleInterop": true,
+    "emitDeclarationOnly": true,
+    "declaration": true,
+    "declarationDir": "src",
+    "skipLibCheck": true,
+    "forceConsistentCasingInFileNames": true
+  },
+  "include": ["src"]
+}

packages/gatsby-plugin-perfect-dark-mode/tsconfig.json

@@ -1,8 +1,16 @@
 import { useCallback, useLayoutEffect, useState } from 'react'
-import type { ColorMode, EnhancedUpdater, Updater } from 'perfect-dark-mode'
+import type {
+  ColorMode,
+  EnhancedUpdater,
+  PerfectDarkMode,
+  Updater,
+} from 'perfect-dark-mode'
 
 export * from 'perfect-dark-mode'
-export const pdm = window.__pdm__
+
+export const pdm: PerfectDarkMode =
+  typeof window !== 'undefined' && (window.__pdm__ as any)
+
 export const usePerfectDarkMode = (): {
   mode: ColorMode | undefined
   setMode: (mode: ColorMode) => void
@@ -11,7 +19,7 @@ export const usePerfectDarkMode = (): {
   setModes: (modes: ColorMode[]) => void
   updateModes: (updater: Updater<ColorMode[]>) => void
 } => {
-  const { mode: pdmMode, modes: pdmModes } = pdm
+  const { mode: pdmMode, modes: pdmModes } = pdm || {}
   const [mode, setModeInternal] = useState<ColorMode | undefined>(undefined)
   const [modes, setModesInternal] = useState<ColorMode[]>(() => [])
   useLayoutEffect(() => pdm.mode.subscribe((v) => setModeInternal(v)), [])