emoji-replacement.css excluded from main CSS (rc.4)

GetStream · Nov 7, 2023 · 8a84e8d · 8a84e8d
1 parent 5e9ff57
commit 8a84e8d
Show file tree

Hide file tree

Showing 4 changed files with 27 additions and 9 deletions.
diff --git a/docusaurus/docs/React/components/core-components/chat.mdx b/docusaurus/docs/React/components/core-components/chat.mdx
@@ -93,8 +93,8 @@ const i18nInstance = new Streami18n({
 });
 
 <Chat client={client} i18nInstance={i18nInstance}>
-  {// children of Chat component}
-</Chat>
+  {/* children of Chat component */}
+</Chat>;
 ```
 
 | Type   |
@@ -123,6 +123,10 @@ Windows 10 does not support country flag emojis out of the box. It chooses to re
 Stream Chat can override this behavior by loading a custom web font that will render images instead (PNGs or SVGs depending
 on the platform). Set this prop to true if you want to use these custom emojis for Windows users.
 
+:::caution
+If you're moving from older versions to `11.0.0` then make sure to import related stylesheet from `stream-chat-react/css/v2/emoji-replacement.css` as it has been removed from our main stylesheet to reduce final bundle size for integrators who do not wish to use this feature.
+:::
+
 | Type    | Default |
 | ------- | ------- |
 | boolean | false   |
diff --git a/package.json b/package.json
@@ -24,9 +24,20 @@
       "require": "./dist/components/Emojis/index.cjs.js",
       "import": "./dist/components/Emojis/index.js",
       "default": "./dist/components/Emojis/index.js"
+    },
+    "./dist/css/*": {
+      "default": "./dist/css/*"
+    },
+    "./dist/scss/*": {
+      "default": "./dist/scss/*"
+    },
+    "./css/*": {
+      "default": "./dist/css/*"
+    },
+    "./scss/*": {
+      "default": "./dist/scss/*"
     }
   },
-  "style": "dist/css/v2/index.css",
   "sideEffects": [
     "*.css"
   ],
@@ -42,7 +53,7 @@
   "dependencies": {
     "@braintree/sanitize-url": "^6.0.4",
     "@popperjs/core": "^2.11.5",
-    "@stream-io/stream-chat-css": "^4.0.0-rc.1",
+    "@stream-io/stream-chat-css": "^4.0.0-rc.4",
     "clsx": "^2.0.0",
     "dayjs": "^1.10.4",
     "emoji-regex": "^9.2.0",

diff --git a/src/components/Chat/Chat.tsx b/src/components/Chat/Chat.tsx
@@ -53,9 +53,12 @@ export type ChatProps<
   initialNavOpen?: boolean;
   /** Used for injecting className/s to the Channel and ChannelList components */
   theme?: string;
-  /** Windows 10 does not support country flag emojis out of the box. It chooses to render these emojis as characters instead. Stream
+  /**
+   * Windows 10 does not support country flag emojis out of the box. It chooses to render these emojis as characters instead. Stream
    * Chat can override this behavior by loading a custom web font that will render images instead (PNGs or SVGs depending on the platform).
    * Set this prop to true if you want to use these custom emojis for Windows users.
+   *
+   * Note: requires importing `stream-chat-react/css/v2/emoji-replacement.css` style sheet
    */
   useImageFlagEmojisOnWindows?: boolean;
 };

diff --git a/yarn.lock b/yarn.lock
@@ -2266,10 +2266,10 @@
     crypto-browserify "^3.11.0"
     process-es6 "^0.11.2"
 
-"@stream-io/stream-chat-css@^4.0.0-rc.1":
-  version "4.0.0-rc.1"
-  resolved "https://registry.yarnpkg.com/@stream-io/stream-chat-css/-/stream-chat-css-4.0.0-rc.1.tgz#43075125dba79cafe70b45bd26806a62b1ab9d31"
-  integrity sha512-rDbHMWW7kIkiTfKJHgC886Giz3x/K8lvbJp0vVzZHmOdiug+TzJL1ztdnQEohY0R7BZsdd4lLS2Xm9LjfBCmmw==
+"@stream-io/stream-chat-css@^4.0.0-rc.4":
+  version "4.0.0-rc.4"
+  resolved "https://registry.yarnpkg.com/@stream-io/stream-chat-css/-/stream-chat-css-4.0.0-rc.4.tgz#672f7af5930dd622feb102b03130f3486342339b"
+  integrity sha512-pw2A1R8oUml3X3cznsVWNU7CrUbTlf9R6KZCB4XwCjpigi5u0jXK3Y0fqrXnCK0FwXVCmM5oj+y7w01wmZ8NZQ==
 
 "@stream-io/transliterate@^1.5.5":
   version "1.5.5"