Merge pull request #5 from kwooshung/develop

Develop

changelogs/.history

@@ -1,4 +1,9 @@
 1.0.2
 1.0.1
 1.0.0
+0.0.1
+2.0.0
+1.0.2
+1.0.1
+1.0.0
 0.0.1

changelogs/CHANGELOG.en.md

@@ -1,3 +1,7 @@
+## 🎉 2.0.0 `2024-02-26`
+### ✨ Feature
+- Support SSR rendering ([#9310eec](https://github.com/kwooshung/React-Themes/commit/9310eec6406aae1959e1f6bd1db92c56f6186756))
+
 ## 🎉 1.0.2 `2024-02-22`
 ### 🐛 Fix
 - Make the document clearer ([#76b479a](https://github.com/kwooshung/React-Themes/commit/76b479aea1134a476dca3aa56fbb9d2e9507e8b2))

changelogs/CHANGELOG.ja.md

@@ -1,3 +1,7 @@
+## 🎉 2.0.0 `2024-02-26`
+### ✨ Feature
+- SSRレンダリングをサポートします ([#9310eec](https://github.com/kwooshung/React-Themes/commit/9310eec6406aae1959e1f6bd1db92c56f6186756))
+
 ## 🎉 1.0.2 `2024-02-22`
 ### 🐛 Fix
 - ドキュメントをより明確にします ([#76b479a](https://github.com/kwooshung/React-Themes/commit/76b479aea1134a476dca3aa56fbb9d2e9507e8b2))

changelogs/CHANGELOG.ko.md

@@ -1,3 +1,7 @@
+## 🎉 2.0.0 `2024-02-26`
+### ✨ Feature
+- SSR 렌더링을 지원합니다 ([#9310eec](https://github.com/kwooshung/React-Themes/commit/9310eec6406aae1959e1f6bd1db92c56f6186756))
+
 ## 🎉 1.0.2 `2024-02-22`
 ### 🐛 Fix
 - 문서를 더 명확하게 만드십시오 ([#76b479a](https://github.com/kwooshung/React-Themes/commit/76b479aea1134a476dca3aa56fbb9d2e9507e8b2))

changelogs/CHANGELOG.ru.md

@@ -1,3 +1,7 @@
+## 🎉 2.0.0 `2024-02-26`
+### ✨ Feature
+- Поддержка рендеринга SSR ([#9310eec](https://github.com/kwooshung/React-Themes/commit/9310eec6406aae1959e1f6bd1db92c56f6186756))
+
 ## 🎉 1.0.2 `2024-02-22`
 ### 🐛 Fix
 - Сделайте документ более ясным ([#76b479a](https://github.com/kwooshung/React-Themes/commit/76b479aea1134a476dca3aa56fbb9d2e9507e8b2))

changelogs/CHANGELOG.zh-cn.md

@@ -1,3 +1,7 @@
+## 🎉 2.0.0 `2024-02-26`
+### ✨ Feature
+- 支持SSR渲染 ([#9310eec](https://github.com/kwooshung/React-Themes/commit/9310eec6406aae1959e1f6bd1db92c56f6186756))
+
 ## 🎉 1.0.2 `2024-02-22`
 ### 🐛 Fix
 - 使文档更清晰 ([#76b479a](https://github.com/kwooshung/React-Themes/commit/76b479aea1134a476dca3aa56fbb9d2e9507e8b2))

changelogs/CHANGELOG.zh-tw.md

@@ -1,3 +1,7 @@
+## 🎉 2.0.0 `2024-02-26`
+### ✨ Feature
+- 支持SSR渲染 ([#9310eec](https://github.com/kwooshung/React-Themes/commit/9310eec6406aae1959e1f6bd1db92c56f6186756))
+
 ## 🎉 1.0.2 `2024-02-22`
 ### 🐛 Fix
 - 使文檔更清晰 ([#76b479a](https://github.com/kwooshung/React-Themes/commit/76b479aea1134a476dca3aa56fbb9d2e9507e8b2))

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kwooshung/react-themes",
-  "version": "1.0.2",
+  "version": "2.0.0",
   "title": "react-themes",
   "description": "It is more convenient to use svg as React theme, which has strong operability and high degree of freedom.",
   "private": false,
@@ -62,6 +62,7 @@
     "eslint": "eslint . --fix --cache --quiet --report-unused-disable-directives --max-warnings 0 --ext .js,.cjs,.jsx,.ts,.cts,.tsx"
   },
   "dependencies": {
+    "@kwooshung/react-no-ssr": "^1.1.4",
     "lomind-react": "0.0.11"
   },
   "peerDependencies": {

src/themes/index.test.tsx

@@ -3,7 +3,7 @@ import ThemesContext from './themesContext';
 import Themes from '.';
 import { ReactElement, JSXElementConstructor, ReactNode, ReactPortal } from 'react';
 
-describe('Themes 组件测试', () => {
+describe('Themes', () => {
   it('正确接收并传递上下文', () => {
     // 模拟的上下文值
     const mockContextValue: any = {

src/themes/themesContext.test.ts

@@ -1,6 +1,6 @@
 import ThemesContext from './themesContext';
 
-describe('ThemesContext 测试', () => {
+describe('ThemesContext', () => {
   it('ThemesContext 被成功创建', () => {
     expect(ThemesContext).not.toBeUndefined();
   });

src/themes/themesProvider.test.tsx

@@ -2,7 +2,7 @@ import { render, screen } from '@testing-library/react';
 import ThemesProvider from './themesProvider';
 import ThemesContext from './themesContext';
 
-describe('ThemesProvider 组件测试', () => {
+describe('ThemesProvider', () => {
   beforeAll(() => {
     // 模拟 window.matchMedia
     window.matchMedia = vi.fn().mockImplementation((query) => {
@@ -36,4 +36,15 @@ describe('ThemesProvider 组件测试', () => {
 
     expect(screen.getByText(/^当前主题:/)).toHaveTextContent('当前主题: light');
   });
+
+  describe('SSR 测试', () => {
+    it('在 SSR 环境下正确渲染子元素', () => {
+      render(
+        <ThemesProvider def='light' list={['light', 'dark']}>
+          <div>测试内容</div>
+        </ThemesProvider>
+      );
+      expect(screen.getByText('测试内容')).toBeInTheDocument();
+    });
+  });
 });

src/themes/themesProvider.tsx

@@ -1,5 +1,6 @@
 import { FC, ReactNode } from 'react';
-import { useThemes } from 'lomind-react';
+import { useBool, useThemes } from 'lomind-react';
+import { useNoSSR } from '@kwooshung/react-no-ssr';
 import ThemesContext from './themesContext';
 import { IThemesProviderProps } from './interfaces';
 
@@ -12,7 +13,13 @@ import { IThemesProviderProps } from './interfaces';
 const ThemesProvider: FC<IThemesProviderProps> = ({ def, list, children }: IThemesProviderProps): ReactNode => {
   const [value, name, { setTheme, addThemes, getValueTheme, getNameTheme, getAvailableThemes }] = useThemes(def, list);
 
-  return (
+  const [isSSR, { setFalse: setSSR }] = useBool(true);
+
+  useNoSSR(setSSR);
+
+  return isSSR ? (
+    children
+  ) : (
     <ThemesContext.Provider
       value={{
         value,

vite.config.ts

@@ -62,7 +62,7 @@ export default defineConfig({
     },
     rollupOptions: {
       // 确保外部化处理那些你不想打包进库的依赖
-      external: ['react', 'react-dom', 'react/jsx-runtime', 'classnames'],
+      external: ['react', 'react-dom', 'react/jsx-runtime', 'classnames', 'lomind-react', '@kwooshung/react-no-ssr'],
       output: {
         // 为各种格式提供全局变量名
         globals: {