Add "exports" field to the package.json, fix UMD build, add Emojis CJS

package.json

@@ -8,16 +8,28 @@
     "type": "git",
     "url": "https://github.com/GetStream/stream-chat-react.git"
   },
-  "typings": "dist/index.d.ts",
+  "types": "dist/index.d.ts",
   "main": "dist/index.cjs.js",
   "module": "dist/index.js",
-  "jsnext:main": "dist/index.js",
+  "jsdelivr": "./dist/browser.full-bundle.min.js",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "require": "./dist/index.cjs.js",
+      "import": "./dist/index.js",
+      "default": "./dist/index.js"
+    },
+    "./emojis": {
+      "types": "./dist/components/Emojis/index.d.ts",
+      "require": "./dist/components/Emojis/index.cjs.js",
+      "import": "./dist/components/Emojis/index.js",
+      "default": "./dist/components/Emojis/index.js"
+    }
+  },
   "style": "dist/css/v2/index.css",
   "sideEffects": [
     "*.css"
   ],
-  "source": "src/index.tsx",
-  "jsdelivr": "./dist/browser.full-bundle.min.js",
   "keywords": [
     "chat",
     "messaging",

rollup.config.js

@@ -1,3 +1,4 @@
+/* eslint-disable sort-keys */
 import babel from '@rollup/plugin-babel';
 import commonjs from '@rollup/plugin-commonjs';
 import image from '@rollup/plugin-image';
@@ -20,8 +21,10 @@ process.env.NODE_ENV = 'production';
 
 const baseConfig = {
   cache: false,
-  inlineDynamicImports: true,
-  input: 'src/index.ts',
+  input: {
+    index: 'src/index.ts',
+    'components/Emojis/index': 'src/components/Emojis/index.ts',
+  },
   watch: {
     chokidar: false,
   },
@@ -89,30 +92,33 @@ const basePlugins = ({ useBrowserResolve = false }) => [
     verbose: process.env.VERBOSE,
     watch: process.env.ROLLUP_WATCH,
   }),
-  // Json to ES modules conversion
+  // JSON to ES modules conversion
   json({ compact: true }),
   process.env.BUNDLE_SIZE ? visualizer() : null,
 ];
 
 const normalBundle = {
   ...baseConfig,
   external: externalDependencies,
-  output: [
-    {
-      file: pkg.main,
-      format: 'cjs',
-      sourcemap: true,
-    },
-  ],
+  output: {
+    dir: 'dist',
+    format: 'cjs',
+    entryFileNames: '[name].[format].js',
+  },
   plugins: [...basePlugins({ useBrowserResolve: false })],
 };
 
+// TODO: multiple separate bundles
 const fullBrowserBundle = ({ min } = { min: false }) => ({
   ...baseConfig,
+  inlineDynamicImports: true,
+  // includes EmojiPicker
+  input: 'src/index_UMD.ts',
   output: [
     {
       file: min ? pkg.jsdelivr : pkg.jsdelivr.replace('.min', ''),
       format: 'iife',
+      // TODO: figure out emoji-mart globals
       globals: {
         react: 'React',
         'react-dom': 'ReactDOM',

src/index_UMD.ts

@@ -0,0 +1,8 @@
+// entry file for Rollup for the UMD build \w Emojis
+export * from './components';
+export * from './context';
+export * from './i18n';
+// todo: distribute utils into separate files
+export * from './utils';
+export { getChannel } from './utils/getChannel';
+export * from './components/Emojis';