Exporting as ESM and CJS

package.json

@@ -31,19 +31,14 @@
     "tree-view",
     "treeview"
   ],
+  "sideEffects": false,
   "types": "dist/index.d.ts",
-  "jsdelivr": "dist/browser.js",
-  "browser": {
-    "vanilla": "dist/browser.js"
-  },
-  "main": "dist/index.js",
-  "module": "dist/index.mjs",
+  "main": "dist/cjs/index.js",
+  "module": "dist/index.js",
   "exports": {
-    ".": {
-      "types": "./dist/index.d.ts",
-      "import": "./dist/index.mjs",
-      "require": "./dist/index.js"
-    }
+    "types": "./src/type.d.ts",
+    "import": "./dist/index.js",
+    "require": "./dist/index.js"
   },
   "files": [
     "dist"
@@ -56,11 +51,9 @@
     "postpack": "pinst --enable",
     "lint": "npx eslint . --ext .ts,.tsx,.js,.jsx --cache --fix",
     "lint:ci": "npx eslint . --ext .ts,.tsx,.js,.jsx --cache",
-    "build": "rollup -c rollup.config.ts --configPlugin swc3"
+    "build": "tsc && rollup -c rollup.config.ts --configPlugin swc3"
   },
   "dependencies": {
-    "@emotion/react": "^11.10.6",
-    "@emotion/styled": "^11.10.6",
     "@mui/material": "^5.11.12",
     "copy-to-clipboard": "^3.3.3",
     "zustand": "^4.3.6"
@@ -70,12 +63,16 @@
     "*.{ts,tsx,js,jsx}": "npx eslint --cache --fix"
   },
   "peerDependencies": {
+    "@emotion/react": "^11",
+    "@emotion/styled": "^11",
     "react": "^17 || ^18",
     "react-dom": "^17 || ^18"
   },
   "devDependencies": {
     "@commitlint/cli": "^17.4.4",
     "@commitlint/config-angular": "^17.4.4",
+    "@emotion/react": "^11.10.6",
+    "@emotion/styled": "^11.10.6",
     "@rollup/plugin-alias": "^4.0.3",
     "@rollup/plugin-commonjs": "^24.0.1",
     "@rollup/plugin-node-resolve": "^15.0.1",
@@ -85,7 +82,6 @@
     "@types/node": "^18.15.0",
     "@types/react": "^18.0.28",
     "@types/react-dom": "^18.0.11",
-    "@types/web": "^0.0.96",
     "@typescript-eslint/eslint-plugin": "^5.54.1",
     "@typescript-eslint/parser": "^5.54.1",
     "@vitejs/plugin-react": "^3.1.0",

rollup.config.ts

@@ -3,8 +3,7 @@ import { basename, resolve } from 'node:path'
 
 import alias from '@rollup/plugin-alias'
 import commonjs from '@rollup/plugin-commonjs'
-import { nodeResolve } from '@rollup/plugin-node-resolve'
-import replace from '@rollup/plugin-replace'
+import nodeResolve from '@rollup/plugin-node-resolve'
 import type {
   ModuleFormat,
   OutputOptions,
@@ -19,7 +18,7 @@ let cache: RollupCache
 
 const dtsOutput = new Set<[string, string]>()
 
-const outputDir = fileURLToPath(new URL('dist', import.meta.url))
+const outputDir = fileURLToPath(new URL('dist/cjs', import.meta.url))
 
 const external = [
   '@emotion/react',
@@ -63,7 +62,7 @@ const buildMatrix = (input: string, output: string, config: {
     input,
     output: outputMatrix(output, config.format),
     cache,
-    external: config.browser ? [] : external,
+    external,
     plugins: [
       alias({
         entries: config.browser
@@ -80,11 +79,6 @@ const buildMatrix = (input: string, output: string, config: {
               }
             ]
       }),
-      config.browser && replace({
-        preventAssignment: true,
-        'process.env.NODE_ENV': JSON.stringify('production'),
-        'typeof window': JSON.stringify('object')
-      }),
       commonjs(),
       nodeResolve(),
       swc(defineRollupSwcOption({
@@ -112,7 +106,7 @@ const dtsMatrix = (): RollupOptions[] => {
     cache,
     output: {
       file: resolve(outputDir, `${output}.d.ts`),
-      format: 'es'
+      format: 'umd'
     },
     plugins: [
       dts()
@@ -122,15 +116,10 @@ const dtsMatrix = (): RollupOptions[] => {
 
 const build: RollupOptions[] = [
   buildMatrix('./src/index.tsx', 'index', {
-    format: ['es', 'umd'],
+    format: ['umd'],
     browser: false,
     dts: true
   }),
-  buildMatrix('./src/browser.tsx', 'browser', {
-    format: ['es', 'umd'],
-    browser: true,
-    dts: true
-  }),
   ...dtsMatrix()
 ]
 

src/stores/JsonViewerStore.ts

@@ -105,7 +105,8 @@ export const createJsonViewerStore = <T = unknown> (props: JsonViewerProps<T>) =
   }))
 }
 
-export const JsonViewerStoreContext = createContext<StoreApi<JsonViewerState>>(undefined)
+// why as any? See https://github.com/DefinitelyTyped/DefinitelyTyped/pull/24509#issuecomment-382213106
+export const JsonViewerStoreContext = createContext<StoreApi<JsonViewerState>>(undefined as any)
 
 export const JsonViewerProvider = JsonViewerStoreContext.Provider
 

src/stores/typeRegistry.tsx

@@ -39,7 +39,8 @@ export const createTypeRegistryStore = () => {
   }))
 }
 
-export const TypeRegistryStoreContext = createContext<StoreApi<TypeRegistryState>>(undefined)
+// why as any? See https://github.com/DefinitelyTyped/DefinitelyTyped/pull/24509#issuecomment-382213106
+export const TypeRegistryStoreContext = createContext<StoreApi<TypeRegistryState>>(undefined as any)
 
 export const TypeRegistryProvider = TypeRegistryStoreContext.Provider
 

tsconfig.json

@@ -1,15 +1,19 @@
 {
   "compilerOptions": {
-    "target": "ES5",
-    "outDir": "./dist/out/",
-    "rootDir": "./src/",
+    "module": "es6",
+    "target": "es2019",
+    "outDir": "dist",
+    "lib": ["dom", "dom.iterable", "es2020"],
     "jsx": "react-jsx",
     "jsxImportSource": "@emotion/react",
-    "incremental": false,
-    "declaration": true,
     "moduleResolution": "node",
-    "allowSyntheticDefaultImports": true
+    "isolatedModules": true,
+    "esModuleInterop": true,
+    "skipLibCheck": true,
+    "declaration": true,
+    "sourceMap": true,
+    "strict": true
   },
-  "include": ["./src"],
+  "include": ["src"],
   "exclude": ["node_modules"]
 }

yarn.lock

@@ -1235,14 +1235,14 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@mui/base@npm:5.0.0-alpha.119":
-  version: 5.0.0-alpha.119
-  resolution: "@mui/base@npm:5.0.0-alpha.119"
+"@mui/base@npm:5.0.0-alpha.121":
+  version: 5.0.0-alpha.121
+  resolution: "@mui/base@npm:5.0.0-alpha.121"
   dependencies:
     "@babel/runtime": ^7.21.0
     "@emotion/is-prop-valid": ^1.2.0
     "@mui/types": ^7.2.3
-    "@mui/utils": ^5.11.11
+    "@mui/utils": ^5.11.13
     "@popperjs/core": ^2.11.6
     clsx: ^1.2.1
     prop-types: ^15.8.1
@@ -1254,27 +1254,27 @@ __metadata:
   peerDependenciesMeta:
     "@types/react":
       optional: true
-  checksum: 1ad5876a0b455cdc880abc51c331771d954bac769daa5b4c91bccceaaca8c2cf15401e2fa4030e46cdfb0ab876edd6e33818db1b365203e61bb1ec513618bba8
+  checksum: b14c9b5ed631058a0ef780a78c5e9129c67338baa4f65a4ab90e23f68410e24d133a9c19f195c136325338b5f444600e43cdd817430b546b73e5371b5d24f32f
   languageName: node
   linkType: hard
 
-"@mui/core-downloads-tracker@npm:^5.11.12":
-  version: 5.11.12
-  resolution: "@mui/core-downloads-tracker@npm:5.11.12"
-  checksum: db9f8497da36455bcd6590aceae0a364fe3107db6067d96612e3b0d8993bc3e0f0d66dbe6fd09d2d99b5a811b20d019682cb96a39d7570948cd644f4f8a32404
+"@mui/core-downloads-tracker@npm:^5.11.13":
+  version: 5.11.13
+  resolution: "@mui/core-downloads-tracker@npm:5.11.13"
+  checksum: b8a32c9fc4beac4b596afe5fd3d2aecc2449e59d9e58a7ae6fbe528249fa6eabff3abf9195233eb7a46d523d6f1dc5c4ae95e1a69c287182c81311508c07c2c6
   languageName: node
   linkType: hard
 
 "@mui/material@npm:^5.11.12":
-  version: 5.11.12
-  resolution: "@mui/material@npm:5.11.12"
+  version: 5.11.13
+  resolution: "@mui/material@npm:5.11.13"
   dependencies:
     "@babel/runtime": ^7.21.0
-    "@mui/base": 5.0.0-alpha.119
-    "@mui/core-downloads-tracker": ^5.11.12
-    "@mui/system": ^5.11.12
+    "@mui/base": 5.0.0-alpha.121
+    "@mui/core-downloads-tracker": ^5.11.13
+    "@mui/system": ^5.11.13
     "@mui/types": ^7.2.3
-    "@mui/utils": ^5.11.12
+    "@mui/utils": ^5.11.13
     "@types/react-transition-group": ^4.4.5
     clsx: ^1.2.1
     csstype: ^3.1.1
@@ -1294,24 +1294,24 @@ __metadata:
       optional: true
     "@types/react":
       optional: true
-  checksum: 0bc03f700683e0a0d234c3b2d2a9ccd875af2bef5fce1946f1409afbb3fb69043c77a96ad9c6cd8f942ef793b8a198aaefe058a31d38c0452711841e2bd51c03
+  checksum: 008e7e79bff7f193724c80308c9751151fc61dcaa76ce8f96d11473280ec6d78f61c9bdb8d23f0869e78b9359aa0bdd5164953d57a4e2f7160280f5d2a6b0b2d
   languageName: node
   linkType: hard
 
-"@mui/private-theming@npm:^5.11.12":
-  version: 5.11.12
-  resolution: "@mui/private-theming@npm:5.11.12"
+"@mui/private-theming@npm:^5.11.13":
+  version: 5.11.13
+  resolution: "@mui/private-theming@npm:5.11.13"
   dependencies:
     "@babel/runtime": ^7.21.0
-    "@mui/utils": ^5.11.12
+    "@mui/utils": ^5.11.13
     prop-types: ^15.8.1
   peerDependencies:
     "@types/react": ^17.0.0 || ^18.0.0
     react: ^17.0.0 || ^18.0.0
   peerDependenciesMeta:
     "@types/react":
       optional: true
-  checksum: 02bee3bd2ae5223e92bdc0c9464386d587adabc7ed24a3fb3aa4659dad189bf02935b482fa56ad431c51fc1ede79bed24b921e0db26f965ad593ebeed2251a26
+  checksum: 9e5e02c6482945d9fa52e920fb206fb032d1b1df4bb06ea9d032babb53ed171e3b5a7969091072a5d04b0ab52c90f01ba51b90ba27730019d3f7eccc49ca4628
   languageName: node
   linkType: hard
 
@@ -1336,15 +1336,15 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@mui/system@npm:^5.11.12":
-  version: 5.11.12
-  resolution: "@mui/system@npm:5.11.12"
+"@mui/system@npm:^5.11.13":
+  version: 5.11.13
+  resolution: "@mui/system@npm:5.11.13"
   dependencies:
     "@babel/runtime": ^7.21.0
-    "@mui/private-theming": ^5.11.12
+    "@mui/private-theming": ^5.11.13
     "@mui/styled-engine": ^5.11.11
     "@mui/types": ^7.2.3
-    "@mui/utils": ^5.11.12
+    "@mui/utils": ^5.11.13
     clsx: ^1.2.1
     csstype: ^3.1.1
     prop-types: ^15.8.1
@@ -1360,7 +1360,7 @@ __metadata:
       optional: true
     "@types/react":
       optional: true
-  checksum: a357b26b34ba3fe9aa6d2e826e94a9e8c6fe4bb4d20ac77b7a8688ff414ac7df77ff537837dd36e20aa9be8b9bb9c1ecab6ad2af057b152e1d0c9ea3234aefbf
+  checksum: e6f1852ecf3dc901645c096f650950b858f5a5e53fc72ca68a7565e844d0841681c79402c3b63100574d1863b3af88d84b832bc680e8dae3a4a2147c7c9aee0f
   languageName: node
   linkType: hard
 
@@ -1376,9 +1376,9 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@mui/utils@npm:^5.11.11, @mui/utils@npm:^5.11.12":
-  version: 5.11.12
-  resolution: "@mui/utils@npm:5.11.12"
+"@mui/utils@npm:^5.11.13":
+  version: 5.11.13
+  resolution: "@mui/utils@npm:5.11.13"
   dependencies:
     "@babel/runtime": ^7.21.0
     "@types/prop-types": ^15.7.5
@@ -1387,7 +1387,7 @@ __metadata:
     react-is: ^18.2.0
   peerDependencies:
     react: ^17.0.0 || ^18.0.0
-  checksum: aa65847c5ab3ae69f0fb156b1b79adbf6285270de4ff1fa87e098930988aa8d88ef00b5bf12c62e75c77077a9f1b84a150edae8637ca416e6c4c0edff8092d90
+  checksum: 0f403f2635fd5cd39c013b9d4defa2cf1ecc023e35b8c9866d6123792480dcafe47207e43420c10b0d030e64df31e78adfdb8248e2476da27f07d80ed0b44927
   languageName: node
   linkType: hard
 
@@ -1947,7 +1947,6 @@ __metadata:
     "@types/node": ^18.15.0
     "@types/react": ^18.0.28
     "@types/react-dom": ^18.0.11
-    "@types/web": ^0.0.96
     "@typescript-eslint/eslint-plugin": ^5.54.1
     "@typescript-eslint/parser": ^5.54.1
     "@vitejs/plugin-react": ^3.1.0
@@ -1981,6 +1980,8 @@ __metadata:
     vitest: ^0.29.2
     zustand: ^4.3.6
   peerDependencies:
+    "@emotion/react": ^11
+    "@emotion/styled": ^11
     react: ^17 || ^18
     react-dom: ^17 || ^18
   languageName: unknown
@@ -2298,13 +2299,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@types/web@npm:^0.0.96":
-  version: 0.0.96
-  resolution: "@types/web@npm:0.0.96"
-  checksum: 6c44cd2f6117c2f09994cb6a61479b3b46dd870cd2cc5bd9663b942de9dd51971b35e064c07bb644018bb87fceffe7c1ab7872160a11d25f153dcbad27a47d6b
-  languageName: node
-  linkType: hard
-
 "@typescript-eslint/eslint-plugin@npm:^5.54.1":
   version: 5.54.1
   resolution: "@typescript-eslint/eslint-plugin@npm:5.54.1"