fix: add full Node.js ESM runtime support

package.config.ts

@@ -22,4 +22,6 @@ export default defineConfig({
       }),
     ],
   },
+
+  tsconfig: 'tsconfig.build.json',
 })

package.json

@@ -29,51 +29,65 @@
       "source": "./src/index.ts",
       "import": "./dist/index.js",
       "require": "./dist/index.cjs",
+      "node": {
+        "import": "./dist/index.cjs.js",
+        "require": "./dist/index.cjs"
+      },
       "default": "./dist/index.js"
     },
     "./preview": {
       "types": "./dist/preview.d.ts",
       "source": "./src/preview/index.ts",
       "import": "./dist/preview.js",
       "require": "./dist/preview.cjs",
+      "node": {
+        "import": "./dist/preview.cjs.js",
+        "require": "./dist/preview.cjs"
+      },
       "default": "./dist/preview.js"
     },
     "./studio": {
       "types": "./dist/studio/index.d.ts",
       "source": "./src/studio/index.ts",
+      "import": "./dist/studio/index.js",
+      "require": "./dist/studio/index.cjs",
       "node": {
-        "source": "./src/studio/index.ts",
-        "import": "./dist/studio/index.mjs",
+        "import": "./dist/studio/index.cjs.js",
         "require": "./dist/studio/index.cjs"
       },
-      "import": "./dist/studio/index.js",
-      "require": "./dist/studio/index.cjs",
       "default": "./dist/studio/index.js"
     },
     "./studio/head": {
       "types": "./dist/studio/head.d.ts",
       "source": "./src/studio/head/index.ts",
       "import": "./dist/studio/head.js",
       "require": "./dist/studio/head.cjs",
+      "node": {
+        "import": "./dist/studio/head.cjs.js",
+        "require": "./dist/studio/head.cjs"
+      },
       "default": "./dist/studio/head.js"
     },
     "./studio/loading": {
       "types": "./dist/studio/loading.d.ts",
       "source": "./src/studio/loading.ts",
+      "import": "./dist/studio/loading.js",
+      "require": "./dist/studio/loading.cjs",
       "node": {
-        "source": "./src/studio/loading.ts",
-        "import": "./dist/studio/loading.mjs",
+        "import": "./dist/studio/loading.cjs.js",
         "require": "./dist/studio/loading.cjs"
       },
-      "import": "./dist/studio/loading.js",
-      "require": "./dist/studio/loading.cjs",
       "default": "./dist/studio/loading.js"
     },
     "./webhook": {
       "types": "./dist/webhook.d.ts",
       "source": "./src/webhook/index.ts",
       "import": "./dist/webhook.js",
       "require": "./dist/webhook.cjs",
+      "node": {
+        "import": "./dist/webhook.cjs.js",
+        "require": "./dist/webhook.cjs"
+      },
       "default": "./dist/webhook.js"
     },
     "./package.json": "./package.json"
@@ -108,10 +122,7 @@
   ],
   "scripts": {
     "prebuild": "npm run clean",
-    "build": "pkg build --tsconfig tsconfig.build.json --strict",
-    "postbuild": "npm run build:studio.mjs && npm run build:loading.mjs",
-    "build:loading.mjs": "cp loading.mjs dist/studio/loading.mjs",
-    "build:studio.mjs": "cp studio.mjs dist/studio/index.mjs",
+    "build": "pkg build --strict && pkg --strict",
     "clean": "rimraf dist",
     "coverage": "npm test -- --coverage",
     "dev": "next",
@@ -145,7 +156,7 @@
     "@rollup/plugin-url": "^8.0.1",
     "@sanity/eslint-config-studio": "^2.0.1",
     "@sanity/image-url": "^1.0.1",
-    "@sanity/pkg-utils": "2.1.1",
+    "@sanity/pkg-utils": "^2.1.1",
     "@sanity/semantic-release-preset": "^3.0.0",
     "@sanity/vision": "^3.1.4",
     "@testing-library/react-hooks": "^8.0.1",

src/studio/NextStudio.tsx

@@ -7,10 +7,6 @@ import {type NextStudioLoadingProps, NextStudioLoading} from './NextStudioLoadin
 
 export type {NextStudioLoadingProps}
 
-// eslint-disable-next-line no-warning-comments
-// FIXME: https://github.com/vercel/next.js/issues/43147
-// const Studio = memo(lazy(() => import('./LazyStudio')))
-
 /** @beta */
 export interface NextStudioProps extends StudioProps {
   children?: React.ReactNode

src/studio/head/NextStudioHead.tsx

@@ -1,6 +1,10 @@
-import faviconPng from './apple-touch-icon.png'
-import faviconIco from './favicon.ico'
-import faviconSvg from './favicon.svg'
+import _faviconPng from './apple-touch-icon.png'
+import _faviconIco from './favicon.ico'
+import _faviconSvg from './favicon.svg'
+
+const faviconPng = typeof _faviconPng === 'string' ? _faviconPng : _faviconPng.default
+const faviconIco = typeof _faviconIco === 'string' ? _faviconIco : _faviconIco.default
+const faviconSvg = typeof _faviconSvg === 'string' ? _faviconSvg : _faviconSvg.default
 
 /** @public */
 export interface NextStudioHeadProps {
@@ -100,24 +104,9 @@ export function NextStudioHead(props: NextStudioHeadProps) {
       {robots && <meta key="robots" name="robots" content={robots} />}
       {referrer && <meta key="referrer" name="referrer" content={referrer} />}
       {title && <title>{title}</title>}
-      {favicons && (
-        <link key="favicon.ico" rel="icon" href={faviconIco?.default || faviconIco} sizes="any" />
-      )}
-      {favicons && (
-        <link
-          key="apple-touch-icon.png"
-          rel="apple-touch-icon"
-          href={faviconPng?.default || faviconSvg}
-        />
-      )}
-      {favicons && (
-        <link
-          key="favicon.svg"
-          rel="icon"
-          href={faviconSvg?.default || faviconSvg}
-          type="image/svg+xml"
-        />
-      )}
+      {favicons && <link key="favicon.ico" rel="icon" href={faviconIco} sizes="any" />}
+      {favicons && <link key="apple-touch-icon.png" rel="apple-touch-icon" href={faviconPng} />}
+      {favicons && <link key="favicon.svg" rel="icon" href={faviconSvg} type="image/svg+xml" />}
     </>
   )
 }

tsconfig.build.json

@@ -7,6 +7,6 @@
     "emitDeclarationOnly": true,
     "declarationDir": "lib/dts"
   },
-  "include": ["src/**/*.ts", "src/**/*.tsx"],
+  "include": ["src/**/*.ts", "src/**/*.tsx", "url-imports.d.ts"],
   "exclude": ["dist", "node_modules"]
 }

tsconfig.json

@@ -9,6 +9,6 @@
       }
     ]
   },
-  "include": ["**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
+  "include": ["**/*.ts", "**/*.tsx", ".next/types/**/*.ts", "url-imports.d.ts"],
   "exclude": ["dist", "node_modules"]
 }

url-imports.d.ts

@@ -0,0 +1,16 @@
+declare module '*.png' {
+  const value: `data:image/png;base64,${string}` | {default: `data:image/png;base64,${string}`}
+  export default value
+}
+
+declare module '*.ico' {
+  const value:
+    | `data:image/vnd.microsoft.icon;base64,${string}`
+    | {default: `data:image/vnd.microsoft.icon;base64,${string}`}
+  export default value
+}
+
+declare module '*.svg' {
+  const value: `data:image/svg+xml,${string}` | {default: `data:image/svg+xml,${string}`}
+  export default value
+}