refactor: keep v2 in CSS import paths

GetStream · May 24, 2024 · c7caaa2 · c7caaa2
1 parent 2ef2fd3
commit c7caaa2
Show file tree

Hide file tree

Showing 7 changed files with 12 additions and 14 deletions.
diff --git a/docusaurus/docs/React/basics/getting-started.mdx b/docusaurus/docs/React/basics/getting-started.mdx
@@ -26,7 +26,7 @@ import {
   Thread,
   useCreateChatClient,
 } from 'stream-chat-react';
-import 'stream-chat-react/dist/css/index.css';
+import 'stream-chat-react/dist/css/v2/index.css';
 
 const apiKey = 'your-api-key';
 const userId = 'user-id';

diff --git a/docusaurus/docs/React/release-guides/upgrade-to-v12.mdx b/docusaurus/docs/React/release-guides/upgrade-to-v12.mdx
@@ -60,23 +60,19 @@ Replace the render functions in your custom components with container components
 
 Until now, it was possible to import two stylesheets as follows:
 
-```
-import 'stream-chat-react/css/index.css';
-```
-
 ```
 import 'stream-chat-react/dist/css/v2/index.css';
 ```
 
 The legacy stylesheet has been removed from the SDK bundle, and therefore it is only possible to import one stylesheet from now on:
 
 ```
-import 'stream-chat-react/css/index.css';
+import 'stream-chat-react/dist/css/v2/index.css';
 ```
 
 :::important
 **Action required**<br/>
-Make sure you are importing the default styles correctly as `import 'stream-chat-react/css/index.css';`
+Make sure you are importing the default styles correctly as `import 'stream-chat-react/dist/css/v2/index.css';`
 :::
 
 ## Removal of legacy styles

diff --git a/examples/typescript/src/App.tsx b/examples/typescript/src/App.tsx
@@ -26,6 +26,8 @@ type LocalChannelType = Record<string, unknown>;
 type LocalCommandType = string;
 type LocalEventType = Record<string, unknown>;
 type LocalMessageType = Record<string, unknown>;
+type LocalPollOptionType = Record<string, unknown>;
+type LocalPollType = Record<string, unknown>;
 type LocalReactionType = Record<string, unknown>;
 type LocalUserType = Record<string, unknown>;
 
@@ -35,10 +37,10 @@ type StreamChatGenerics = {
   commandType: LocalCommandType;
   eventType: LocalEventType;
   messageType: LocalMessageType;
+  pollOptionType: LocalPollOptionType;
+  pollType: LocalPollType;
   reactionType: LocalReactionType;
   userType: LocalUserType;
-  pollType: UR;
-  pollOptionType: UR;
 };
 
 const chatClient = StreamChat.getInstance<StreamChatGenerics>(apiKey);

diff --git a/examples/typescript/src/index.scss b/examples/typescript/src/index.scss
@@ -25,7 +25,7 @@ code {
     }
   }
 
-  .str-chat-channel {
+  .str-chat__channel {
     width: 100%;
   }
 

diff --git a/examples/typescript/src/index.tsx b/examples/typescript/src/index.tsx
@@ -1,6 +1,6 @@
 import React from 'react';
 import { createRoot } from 'react-dom/client';
-import 'stream-chat-react/dist/css/index.css';
+import 'stream-chat-react/dist/css/v2/index.css';
 import './index.scss';
 import App from './App';
 import * as serviceWorker from './serviceWorker';

diff --git a/examples/vite/src/App.tsx b/examples/vite/src/App.tsx
@@ -10,7 +10,7 @@ import {
   Window,
   useCreateChatClient,
 } from 'stream-chat-react';
-import 'stream-chat-react/css/index.css';
+import 'stream-chat-react/css/v2/index.css';
 
 const params = (new Proxy(new URLSearchParams(window.location.search), {
   get: (searchParams, property) => searchParams.get(property as string),

diff --git a/rollup.config.js b/rollup.config.js
@@ -83,8 +83,8 @@ const basePlugins = ({ useBrowserResolve = false }) => [
   copy({
     targets: [
       { dest: 'dist/assets', src: './node_modules/@stream-io/stream-chat-css/dist/assets/*' },
-      { dest: 'dist/css', src: './node_modules/@stream-io/stream-chat-css/dist/v2/css/*.css' },
-      { dest: 'dist/scss', src: './node_modules/@stream-io/stream-chat-css/dist/v2/scss/*' },
+      { dest: 'dist/css/v2', src: './node_modules/@stream-io/stream-chat-css/dist/v2/css/*.css' },
+      { dest: 'dist/scss/v2', src: './node_modules/@stream-io/stream-chat-css/dist/v2/scss/*' },
     ],
     verbose: process.env.VERBOSE,
     watch: process.env.ROLLUP_WATCH,