fix: remove 'use client' header (#1798)

package.json

@@ -90,10 +90,10 @@
     "@commitlint/cli": "^12.0.1",
     "@commitlint/config-conventional": "^12.0.1",
     "@react-three/fiber": "^8.0.8",
-    "@rollup/plugin-babel": "^6.0.4",
-    "@rollup/plugin-commonjs": "^25.0.7",
-    "@rollup/plugin-json": "^6.1.0",
-    "@rollup/plugin-node-resolve": "^15.2.3",
+    "@rollup/plugin-babel": "^5.3.0",
+    "@rollup/plugin-commonjs": "^19.0.0",
+    "@rollup/plugin-json": "^4.1.0",
+    "@rollup/plugin-node-resolve": "^13.0.0",
     "@storybook/addon-actions": "^7.0.12",
     "@storybook/addon-controls": "^7.0.12",
     "@storybook/addon-essentials": "^7.0.12",
@@ -129,10 +129,9 @@
     "react": "^18.0.0",
     "react-dom": "^18.0.0",
     "rimraf": "^3.0.2",
-    "rollup": "^4.9.6",
-    "rollup-plugin-glslify": "^1.3.1",
-    "rollup-plugin-multi-input": "^1.4.1",
-    "rollup-plugin-preserve-directives": "^0.3.1",
+    "rollup": "^2.78.1",
+    "rollup-plugin-glslify": "^1.3.0",
+    "rollup-plugin-multi-input": "^1.3.1",
     "rollup-plugin-terser": "^7.0.2",
     "semantic-release": "^21.0.6",
     "serve": "^14.2.0",

rollup.config.js

@@ -0,0 +1,90 @@
+import path from 'path'
+import babel from '@rollup/plugin-babel'
+import resolve from '@rollup/plugin-node-resolve'
+import json from '@rollup/plugin-json'
+import glslify from 'rollup-plugin-glslify'
+import multiInput from 'rollup-plugin-multi-input'
+import { terser } from 'rollup-plugin-terser'
+
+const root = process.platform === 'win32' ? path.resolve('/') : '/'
+const external = (id) => !id.startsWith('.') && !id.startsWith(root)
+const extensions = ['.js', '.jsx', '.ts', '.tsx', '.json']
+
+const getBabelOptions = ({ useESModules }) => ({
+  babelrc: false,
+  extensions,
+  exclude: '**/node_modules/**',
+  babelHelpers: 'runtime',
+  presets: [
+    [
+      '@babel/preset-env',
+      {
+        include: [
+          '@babel/plugin-proposal-class-properties',
+          '@babel/plugin-proposal-optional-chaining',
+          '@babel/plugin-proposal-nullish-coalescing-operator',
+          '@babel/plugin-proposal-numeric-separator',
+          '@babel/plugin-proposal-logical-assignment-operators',
+        ],
+        bugfixes: true,
+        loose: true,
+        modules: false,
+        targets: '> 1%, not dead, not ie 11, not op_mini all',
+      },
+    ],
+    '@babel/preset-react',
+    '@babel/preset-typescript',
+  ],
+  plugins: [
+    '@babel/plugin-proposal-nullish-coalescing-operator',
+    ['@babel/transform-runtime', { regenerator: false, useESModules }],
+  ],
+})
+
+export default [
+  {
+    input: ['src/**/*.ts', 'src/**/*.tsx', '!src/index.ts'],
+    output: { dir: `dist`, format: 'esm' },
+    external,
+    plugins: [
+      multiInput(),
+      json(),
+      glslify(),
+      babel(getBabelOptions({ useESModules: true }, '>1%, not dead, not ie 11, not op_mini all')),
+      resolve({ extensions }),
+    ],
+  },
+  {
+    input: `./src/index.ts`,
+    output: { dir: `dist`, format: 'esm' },
+    external,
+    plugins: [
+      json(),
+      glslify(),
+      babel(getBabelOptions({ useESModules: true }, '>1%, not dead, not ie 11, not op_mini all')),
+      resolve({ extensions }),
+    ],
+    preserveModules: true,
+  },
+  {
+    input: ['src/**/*.ts', 'src/**/*.tsx', '!src/index.ts'],
+    output: { dir: `dist`, format: 'cjs' },
+    external,
+    plugins: [
+      multiInput({
+        transformOutputPath: (output) => output.replace(/\.[^/.]+$/, '.cjs.js'),
+      }),
+      json(),
+      glslify(),
+      babel(getBabelOptions({ useESModules: false })),
+      resolve({ extensions }),
+      terser(),
+    ],
+  },
+  {
+    input: `./src/index.ts`,
+    output: { file: `dist/index.cjs.js`, format: 'cjs' },
+    external,
+    plugins: [json(), glslify(), babel(getBabelOptions({ useESModules: false })), resolve({ extensions }), terser()],
+  },
+]

src/index.ts

@@ -1,3 +1 @@
-'use client'
-
 export * from './web'

src/web/View.tsx

@@ -1,5 +1,3 @@
-'use client'
-
 import * as React from 'react'
 import * as THREE from 'three'
 import { RootState, context, createPortal, useFrame, useThree } from '@react-three/fiber'