From 922de5b32d5e6b80f41336a3d5e0bacc58fb124e Mon Sep 17 00:00:00 2001 From: SoonIter Date: Thu, 29 Aug 2024 16:46:18 +0800 Subject: [PATCH 1/4] feat: use @rstack-dev/doc-ui --- .../BaseBenchmark/ProgressBar.module.scss | 65 ----- .../Benchmark/BaseBenchmark/ProgressBar.tsx | 53 ---- .../Benchmark/BaseBenchmark/index.module.scss | 71 ------ .../Benchmark/BaseBenchmark/index.tsx | 56 ----- .../Landingpage/Benchmark/index.tsx | 26 +- .../BuiltWithRspack/index.module.scss | 90 ------- .../Landingpage/BuiltWithRspack/index.tsx | 47 ++-- .../FullyFeatured/index.module.scss | 103 -------- .../Landingpage/FullyFeatured/index.tsx | 46 ++-- .../Landingpage/Hero/BackgroundStar.tsx | 84 ------- .../Landingpage/Hero/index.module.scss | 189 -------------- .../components/Landingpage/Hero/index.tsx | 115 +-------- .../components/Landingpage/Hero/ovalBg.svg | 13 - .../Landingpage/ToolStack/index.module.scss | 93 ------- .../Landingpage/ToolStack/index.tsx | 82 ++---- .../Landingpage/WhyRspack/index.module.scss | 237 ------------------ .../Landingpage/WhyRspack/index.tsx | 200 +-------------- .../WhyRspack/useCardAnimation.tsx | 89 ------- .../WhyRspack/useLottieAnimation.tsx | 44 ---- 19 files changed, 83 insertions(+), 1620 deletions(-) delete mode 100644 website/theme/components/Landingpage/Benchmark/BaseBenchmark/ProgressBar.module.scss delete mode 100644 website/theme/components/Landingpage/Benchmark/BaseBenchmark/ProgressBar.tsx delete mode 100644 website/theme/components/Landingpage/Benchmark/BaseBenchmark/index.module.scss delete mode 100644 website/theme/components/Landingpage/Benchmark/BaseBenchmark/index.tsx delete mode 100644 website/theme/components/Landingpage/BuiltWithRspack/index.module.scss delete mode 100644 website/theme/components/Landingpage/FullyFeatured/index.module.scss delete mode 100644 website/theme/components/Landingpage/Hero/BackgroundStar.tsx delete mode 100644 website/theme/components/Landingpage/Hero/index.module.scss delete mode 100644 website/theme/components/Landingpage/Hero/ovalBg.svg delete mode 100644 website/theme/components/Landingpage/ToolStack/index.module.scss delete mode 100644 website/theme/components/Landingpage/WhyRspack/index.module.scss delete mode 100644 website/theme/components/Landingpage/WhyRspack/useCardAnimation.tsx delete mode 100644 website/theme/components/Landingpage/WhyRspack/useLottieAnimation.tsx diff --git a/website/theme/components/Landingpage/Benchmark/BaseBenchmark/ProgressBar.module.scss b/website/theme/components/Landingpage/Benchmark/BaseBenchmark/ProgressBar.module.scss deleted file mode 100644 index 5981f7679bc3..000000000000 --- a/website/theme/components/Landingpage/Benchmark/BaseBenchmark/ProgressBar.module.scss +++ /dev/null @@ -1,65 +0,0 @@ -.container { - width: 100%; - display: flex; - align-items: center; - justify-content: space-between; - // width: 50vw; - height: 18px; - // max-width: 800px; - border-radius: 10px; - box-sizing: content-box; - align-self: stretch; -} - -@media screen and (max-width: 1060px) { - .container { - width: 85vw; - } -} - -.innerContainer { - display: flex; - justify-content: space-between; - width: 100%; - height: 8px; - background: var(--rp-c-gray-light-5); - border-radius: 5px; -} - -:global(.dark) { - .innerContainer { - background: var(--rp-c-bg-soft); - } -} - -.bar { - height: 100%; - border-radius: 5px; - background: var( - --orange-gradient, - linear-gradient(279deg, #ff8b00 35.21%, #f93920 63.34%) - ); -} - -.desc { - min-width: 84px; - color: var(--rp-c-text-2); - font-size: 12px; - margin-left: 16px; - width: 100px; - font-family: - Menlo, - Monaco, - Lucida Console, - Liberation Mono, - DejaVu Sans Mono, - Bitstream Vera Sans Mono, - Courier New, - monospace; -} - -.time { - display: inline-block; - width: 38px; - text-align: left; -} diff --git a/website/theme/components/Landingpage/Benchmark/BaseBenchmark/ProgressBar.tsx b/website/theme/components/Landingpage/Benchmark/BaseBenchmark/ProgressBar.tsx deleted file mode 100644 index c3beb9aeb576..000000000000 --- a/website/theme/components/Landingpage/Benchmark/BaseBenchmark/ProgressBar.tsx +++ /dev/null @@ -1,53 +0,0 @@ -import { motion } from 'framer-motion'; -import { useState } from 'react'; -import styles from './ProgressBar.module.scss'; - -export function formatTime(time: number, totalTime: number) { - if (totalTime < 1000) { - return `${time.toFixed(0)}ms`; - } - return `${(time / 1000).toFixed(2)}s`; -} - -export function ProgressBar({ - value, - max, - desc, - inView, -}: { - value: number; - max: number; - desc: string; - inView: boolean; -}) { - const [elapsedTime, setElapsedTime] = useState(0); - const TOTAL_TIME = value * 1000; - const variants = { - initial: { width: 0 }, - animate: { width: `${(value / max) * 100}%` }, - }; - - const formattedTime = formatTime(elapsedTime, TOTAL_TIME); - return ( -
-
- {inView ? ( - { - const width = Number.parseFloat(latest.width); - setElapsedTime(width * max * 10); - }} - transition={{ duration: value, ease: 'linear' }} - /> - ) : null} -
-
- {formattedTime} {desc} -
-
- ); -} diff --git a/website/theme/components/Landingpage/Benchmark/BaseBenchmark/index.module.scss b/website/theme/components/Landingpage/Benchmark/BaseBenchmark/index.module.scss deleted file mode 100644 index 534c0554948c..000000000000 --- a/website/theme/components/Landingpage/Benchmark/BaseBenchmark/index.module.scss +++ /dev/null @@ -1,71 +0,0 @@ -.root { - display: flex; - flex-direction: column; - align-items: center; - justify-content: center; - align-self: stretch; - - margin-top: 1rem; - margin-bottom: 1rem; -} - -.title { - color: var(--rp-c-text-1); -} - -.desc { - color: var(--rp-c-text-2); -} - -.bottomLink { - display: block; - margin-top: 16px; - font-size: 16px; - color: var(--rp-c-text-2); - - &:hover { - color: var(--rp-c-link); - } -} - -.progressName { - color: var(--rp-c-text-1); - font-size: 17px; - font-weight: 600; - min-width: 170px; -} - -.item { - width: 100%; - display: flex; - align-items: center; - justify-content: center; - align-self: stretch; - margin: 1.25rem; -} - -.metricItem { - display: flex; - flex: 1 0; - flex-direction: column; - justify-content: center; - align-items: center; -} - -@media screen and (min-width: 1060px) { - .item { - flex-direction: row; - } -} - -@media screen and (max-width: 1060px) { - .item { - flex-direction: column; - align-items: flex-start; - } - - .progressName { - width: 180px; - margin-bottom: 8px; - } -} diff --git a/website/theme/components/Landingpage/Benchmark/BaseBenchmark/index.tsx b/website/theme/components/Landingpage/Benchmark/BaseBenchmark/index.tsx deleted file mode 100644 index 806aa0a9d5f1..000000000000 --- a/website/theme/components/Landingpage/Benchmark/BaseBenchmark/index.tsx +++ /dev/null @@ -1,56 +0,0 @@ -import { useInView } from 'react-intersection-observer'; -import { ProgressBar } from './ProgressBar'; -import styles from './index.module.scss'; - -export type BenchmarkData = Record< - string, - { - label: string; - metrics: Array<{ time: number; desc: string }>; - } ->; - -export interface BenchmarkProps { - data: BenchmarkData; -} - -const findMaxTime = (data: BenchmarkData) => { - let max = 0; - - for (const item of Object.values(data)) { - for (const metric of item.metrics) { - if (metric.time > max) { - max = metric.time; - } - } - } - - return max; -}; - -export function Benchmark({ data }: BenchmarkProps) { - const maxTime = findMaxTime(data); - const { ref, inView } = useInView({ - triggerOnce: true, - }); - return ( -
- {Object.values(data).map(item => ( -
-

{item.label}

-
- {item.metrics.map(metric => ( - - ))} -
-
- ))} -
- ); -} diff --git a/website/theme/components/Landingpage/Benchmark/index.tsx b/website/theme/components/Landingpage/Benchmark/index.tsx index 4d8b0bc3ad47..054b6b10c6e7 100644 --- a/website/theme/components/Landingpage/Benchmark/index.tsx +++ b/website/theme/components/Landingpage/Benchmark/index.tsx @@ -1,16 +1,16 @@ import { Benchmark as BaseBenchmark, type BenchmarkData, -} from './BaseBenchmark'; - +} from '@rstack-dev/doc-ui/benchmark'; +import { + containerStyle, + descStyle, + innerContainerStyle, + titleAndDescStyle, + titleStyle, +} from '@rstack-dev/doc-ui/section-style'; import { memo } from 'react'; -// TODO: extract to @rstack-dev/doc-ui/benchmark -// import { -// Benchmark as BaseBenchmark, -// type BenchmarkData, -// } from '@rstack-dev/doc-ui/benchmark'; import { useI18n } from '../../../i18n'; -import sharedStyles from '../shared.module.scss'; import styles from './index.module.scss'; // Benchmark data for different cases @@ -90,11 +90,11 @@ const BENCHMARK_DATA: BenchmarkData = { export const Benchmark = memo(() => { const t = useI18n(); return ( -
-
-
-

{t('benchmarkTitle')}

-

{t('benchmarkDesc')}

+
+
+
+

{t('benchmarkTitle')}

+

{t('benchmarkDesc')}

diff --git a/website/theme/components/Landingpage/BuiltWithRspack/index.module.scss b/website/theme/components/Landingpage/BuiltWithRspack/index.module.scss deleted file mode 100644 index a1abd9d8ccc8..000000000000 --- a/website/theme/components/Landingpage/BuiltWithRspack/index.module.scss +++ /dev/null @@ -1,90 +0,0 @@ -// M -@media screen and (min-width: 601px) and (max-width: 834px) { - .title { - font-size: 32px !important; - line-height: 48px !important; - } - .innerContainer { - background: url('https://assets.rspack.dev/rspack/assets/landingpage-built-with-rspack-bg-m.png') - no-repeat !important; - background-size: 100% 100% !important; - } - .logo { - min-width: 200px !important; - } -} - -// S -@media screen and (max-width: 600px) { - .title { - font-size: 32px !important; - line-height: 48px !important; - } - .innerContainer { - background: url('https://assets.rspack.dev/rspack/assets/landingpage-built-with-rspack-bg-m.png') - no-repeat !important; - background-size: 100% 100% !important; - } - .logo { - min-width: 160px !important; - } -} - -.innerContainer { - width: 100%; - display: flex; - padding: 32px 0px; - flex-direction: column; - justify-content: center; - align-items: center; - gap: 24px; - background: url('https://assets.rspack.dev/rspack/assets/landingpage-built-with-rspack-bg.png') - no-repeat; - background-size: 100% 100%; - background-position: center center; -} - -.title { - text-align: center; - - /* Style 10 */ - - font-size: 48px; - font-style: normal; - font-weight: 700; - line-height: normal; /* 100% */ - - background: linear-gradient(279deg, #ff8b00 27.12%, #f93920 72.56%); - background-clip: text; - -webkit-background-clip: text; - -webkit-text-fill-color: transparent; -} - -.logos { - display: flex; - align-items: flex-start; - align-self: stretch; - flex-wrap: wrap; - filter: var(--landingpage-invert-filter); - gap: 16px; - - .logo { - display: flex; - justify-content: center; - align-items: center; - gap: 8px; - min-height: 140px; - flex: 1 0; - align-self: stretch; - } - - .logoText { - color: #0b0c0e; - text-align: center; - - font-size: 24px; - font-style: normal; - font-weight: 700; - line-height: 28px; /* 116.667% */ - } -} diff --git a/website/theme/components/Landingpage/BuiltWithRspack/index.tsx b/website/theme/components/Landingpage/BuiltWithRspack/index.tsx index 91f4cb5220fc..01a1d927993d 100644 --- a/website/theme/components/Landingpage/BuiltWithRspack/index.tsx +++ b/website/theme/components/Landingpage/BuiltWithRspack/index.tsx @@ -1,14 +1,17 @@ +import { BuiltWithRspack as BaseBuiltWithRspack } from '@rstack-dev/doc-ui/built-with-rspack'; +import { + containerStyle, + innerContainerStyle, +} from '@rstack-dev/doc-ui/section-style'; import { memo } from 'react'; import { Link } from 'rspress/theme'; import { useI18n } from '../../../i18n'; -import sharedStyles from '../shared.module.scss'; import amazonLogo from './assets/amazon.svg'; import bitDevLogo from './assets/bit.svg'; import bytedanceLogo from './assets/bytedance.svg'; import discordLogo from './assets/discord.svg'; import intuitLogo from './assets/intuit.svg'; import microsoftLogo from './assets/microsoft.svg'; -import styles from './index.module.scss'; type Company = { name: string; @@ -58,41 +61,19 @@ const companyList: Company[] = [ }, ]; -const CompanyItem = ({ item }: { item: Company }) => { - const { logo, name, url, text, width } = item; - return ( - - {name} - {text !== undefined ? ( - {text} - ) : ( - <> - )} - - ); -}; - -const BuiltWithRsPack: React.FC = memo(() => { +const BuiltWithRspack: React.FC = memo(() => { const t = useI18n(); return ( -
-
- -

{t('builtWithRspack')}

-
- {companyList.map(i => { - return ; - })} -
+
+
+
); }); -export default BuiltWithRsPack; +export default BuiltWithRspack; diff --git a/website/theme/components/Landingpage/FullyFeatured/index.module.scss b/website/theme/components/Landingpage/FullyFeatured/index.module.scss deleted file mode 100644 index 641e7b4ca88a..000000000000 --- a/website/theme/components/Landingpage/FullyFeatured/index.module.scss +++ /dev/null @@ -1,103 +0,0 @@ -// M -@media screen and (min-width: 601px) and (max-width: 1000px) { - .features { - flex-wrap: wrap !important; - gap: 32px 16px !important; - } - .featureCard { - max-width: 50% !important; - flex: 1 0 45% !important; - } - .main { - gap: 32px !important; - } -} - -// S -@media screen and (max-width: 600px) { - .features { - flex-wrap: wrap; - } - .featureCard { - max-width: 50% !important; - flex: 1 0 40% !important; - flex-direction: column !important; - justify-content: center !important; - align-items: center !important; - - .featureTitle { - text-align: center !important; - } - .featureDescription { - display: none !important; - } - } - - .main { - gap: 16px !important; - } -} - -.main { - display: flex; - flex-direction: column; - align-items: center; - gap: 32px; -} - -.features { - width: 100%; - display: flex; - justify-content: center; - align-items: flex-start; - gap: 16px; - - .featureCard { - display: flex; - flex: 1 1 25%; - align-items: flex-start; - gap: 16px; - min-height: 110px; - - &:hover { - transition: all 0.2s; - transform: scale(1.04, 1.04); - opacity: 0.8; - } - - .icon { - filter: var(--landingpage-invert-filter); - display: flex; - width: 32px; - height: 32px; - justify-content: center; - align-items: center; - } - - .featureContent { - display: flex; - flex-direction: column; - align-items: flex-start; - text-align: left; - gap: 8px; - - .featureTitle { - color: var(--landingpage-title-color); - - font-size: 18px; - font-style: normal; - font-weight: 700; - line-height: 150%; /* 27px */ - } - - .featureDescription { - color: var(--landingpage-desc-color); - - font-size: 15px; - font-style: normal; - font-weight: 400; - line-height: 23.8px; /* 158.667% */ - } - } - } -} diff --git a/website/theme/components/Landingpage/FullyFeatured/index.tsx b/website/theme/components/Landingpage/FullyFeatured/index.tsx index 6bd2a82b234a..a7ac4cb0d6c9 100644 --- a/website/theme/components/Landingpage/FullyFeatured/index.tsx +++ b/website/theme/components/Landingpage/FullyFeatured/index.tsx @@ -1,7 +1,14 @@ +import { FullyFeatured as BaseFullyFeatured } from '@rstack-dev/doc-ui/fully-featured'; +import { + containerStyle, + descStyle, + innerContainerStyle, + titleAndDescStyle, + titleStyle, +} from '@rstack-dev/doc-ui/section-style'; import { memo } from 'react'; import { Link } from 'rspress/theme'; import { useI18n, useI18nUrl } from '../../../i18n'; -import sharedStyles from '../shared.module.scss'; import arrow from './assets/arrow.svg'; import javascriptApi from './assets/javascriptApi.svg'; import layer from './assets/layer.svg'; @@ -14,7 +21,6 @@ import server from './assets/server.svg'; import setting from './assets/setting.svg'; import swc from './assets/swc.svg'; import tree from './assets/tree.svg'; -import styles from './index.module.scss'; type Feature = { icon: string; @@ -109,34 +115,16 @@ const FullyFeatured = memo(() => { ]; return ( -
-
-
-

{t('fullyFeaturedTitle')}

-

{t('fullyFeaturedDesc')}

-
-
- {[FeatureRow1, FeatureRow2, FeatureRow3].map((row, index) => { - return ( -
- {row.map(({ icon, description, link, title }, index) => ( - - {index.toString()} -
-

{title}

-

{description}

-
- - ))} -
- ); - })} +
+
+
+

{t('fullyFeaturedTitle')}

+

{t('fullyFeaturedDesc')}

+
); diff --git a/website/theme/components/Landingpage/Hero/BackgroundStar.tsx b/website/theme/components/Landingpage/Hero/BackgroundStar.tsx deleted file mode 100644 index 7ff873ee6ece..000000000000 --- a/website/theme/components/Landingpage/Hero/BackgroundStar.tsx +++ /dev/null @@ -1,84 +0,0 @@ -import { useEffect, useRef, useState } from 'react'; -import styles from './index.module.scss'; - -const BackgroundStar = ({ - top, - left, - pageX, - pageY, - size, -}: { - top: number | string; - left: number | string; - pageX: number | null; - pageY: number | null; - size: number; -}) => { - const ref = useRef(); - const [transformX, setTransformX] = useState(0); - const [transformY, setTransformY] = useState(0); - useEffect(() => { - if (ref.current) { - const { x, y } = ref.current.getBoundingClientRect(); - - if (pageX && pageY) { - const distanceX = pageX - x; - const distanceY = pageY - y; - if (Math.abs(distanceX) < 100 && Math.abs(distanceY) < 100) { - setTransformX(distanceX); - setTransformY(distanceY); - } else { - setTransformX(0); - setTransformY(0); - } - } - } - }, [pageX, pageY]); - - return ( -
- - - - - - - - - - - - -
- ); -}; - -export default BackgroundStar; diff --git a/website/theme/components/Landingpage/Hero/index.module.scss b/website/theme/components/Landingpage/Hero/index.module.scss deleted file mode 100644 index 22dba7e83ae0..000000000000 --- a/website/theme/components/Landingpage/Hero/index.module.scss +++ /dev/null @@ -1,189 +0,0 @@ -// S -@media screen and (max-width: 600px) { - .logo { - width: 120px !important; - height: 100px !important; - } - .ovalBg { - width: 168px !important; - height: 140px !important; - } - .buttonGroup { - display: flex; - padding-top: 16px; - flex-direction: column; - align-items: center; - gap: 16px; - align-self: stretch; - } - .button { - width: 100% !important; - } - .innerHero { - height: auto !important; - padding: 24px !important; - } - .title { - font-size: 32px !important; - line-height: normal !important; - } - .subtitle { - font-size: 20px !important; - line-height: normal !important; - } - .description { - font-size: 16px !important; - line-height: 20px; - } - - .backgroundStarContainer { - pointer-events: none; - transform: scale(0.6); - } -} - -.hero { - display: flex; - justify-content: center; - align-items: center; - background-size: cover; - position: relative; -} - -.innerHero { - display: flex; - width: 100%; - height: 646px; - padding: 64px 0px; - flex-direction: column; - justify-content: center; - align-items: center; - gap: 16px; -} - -.logo { - width: 216px; - height: 180px; - position: relative; - user-select: none; - - .ovalBg { - width: 303px; // 216.225px * 1.4 - height: 252px; // 180px * 1.4 - z-index: -1; - position: absolute; - // our logo center is on the right and down - top: calc(50% + 5px); - left: calc(50% + 5px); - transform: translate(-50%, -50%); - background-image: url('./ovalBg.svg'); - background-repeat: no-repeat; - background-size: 100% 100%; - background-position: center; - } -} - -.title { - text-align: center; - - font-size: 72px; - font-style: normal; - font-weight: 700; - line-height: 93.6px; /* 130% */ - - // background - background: var( - --orange-gradient, - linear-gradient(279deg, #ff8b00 35.21%, #f93920 63.34%) - ); - background-clip: text; - -webkit-background-clip: text; - -webkit-text-fill-color: transparent; -} - -.subtitle { - color: var(--landingpage-title-color, #0b0c0e); - text-align: center; - - font-size: 50px; - font-style: normal; - font-weight: 700; - line-height: 72px; /* 144% */ -} - -.description { - color: var(--landingpage-desc-color, #6b7075); - text-align: center; - /* Style 5 */ - - font-size: 24px; - font-style: normal; - font-weight: 400; -} - -.buttonGroup { - display: flex; - justify-content: center; - gap: 10px; - margin-top: 20px; -} - -.button { - display: flex; - justify-content: center; - align-items: center; - padding: 12px 24px 12px 24px; - border-radius: 25px; - text-align: center; - - font-size: 16px; - font-style: normal; - font-weight: 700; - line-height: 150%; /* 24px */ - text-transform: capitalize; - - &:hover { - transition: all 0.2s; - opacity: 0.8; - } - - &:active { - opacity: 0.6; - } -} - -.buttonPrimary { - // style - background: var( - --orange-gradient, - linear-gradient(279deg, #ff8b00 35.21%, #f93920 63.34%) - ); - - // text - color: #fff; -} - -.buttonSecondary { - // style - border: 1.5px solid var(--orange-gradient, #ff8b00); - // text - color: var(--landingpage-title-color, #0b0c0e); -} - -.backgroundStarContainer { - position: absolute; - top: 0; - left: 0; - z-index: -1; - - user-select: none; - pointer-events: none; - - .backgroundStar { - transition: all 0.2s; - filter: blur(2px); - - user-select: none; - pointer-events: none; - } -} diff --git a/website/theme/components/Landingpage/Hero/index.tsx b/website/theme/components/Landingpage/Hero/index.tsx index 09f800cea14f..31b2272f88ce 100644 --- a/website/theme/components/Landingpage/Hero/index.tsx +++ b/website/theme/components/Landingpage/Hero/index.tsx @@ -1,64 +1,7 @@ -import { memo, useCallback, useRef, useState } from 'react'; +import { Hero as BaseHero } from '@rstack-dev/doc-ui/hero'; +import { memo, useCallback } from 'react'; import { useNavigate } from 'rspress/runtime'; import { useI18n, useI18nUrl } from '../../../i18n'; -import BackgroundStar from './BackgroundStar'; -import styles from './index.module.scss'; - -const positions = [ - [91.4, 22.9], - [36, 67.6], - [94.1, 47.7], - [33.8, 32.5], - [43.1, 77.6], - [9.8, 73.4], - [16.1, 17.1], - [1, 10], - [88.3, 44.9], - [19.3, 79], - [28.5, 11.8], - [94.6, 44.9], - [53.8, 3.4], - [41.7, 20], - [56.9, 80.6], - [16.4, 83.4], - [39.4, 66.8], - [19, 18.4], - [25.1, 28.1], - [18.9, 35.6], - [32.9, 12.3], - [21.2, 72.8], - [83.3, 79.8], - [71.4, 36.8], - [62.2, 50.4], - [45.4, 13.7], - [61.1, 28.5], - [18.2, 64.1], - [40.7, 34.7], - [87.6, 20.7], - [78.3, 30.8], - [84.4, 58.2], - [74.2, 74.5], - [12.4, 66.4], - [68.2, 41.6], -]; - -const useMouseMove = () => { - const ref = useRef(); - const [pageX, setPageX] = useState(null); - const [pageY, setPageY] = useState(null); - - const handleMove = ({ pageX, pageY }: { pageX: number; pageY: number }) => { - setPageX(pageX); - setPageY(pageY); - }; - - return { - ref, - pageX, - pageY, - onMouseMove: handleMove, - }; -}; const Hero = memo(() => { const tUrl = useI18nUrl(); @@ -73,51 +16,17 @@ const Hero = memo(() => { navigate(tUrl('/guide/start/introduction')); }, [tUrl, navigate]); - const { pageX, pageY, ref, onMouseMove } = useMouseMove(); - return ( -
- {positions.map(([top, left], i) => { - return ( - - ); - })} -
-
- rspack-logo -
-
-

Rspack

-

{t('heroSlogan')}

-

{t('heroSubSlogan')}

-
- - -
-
-
+ ); }); diff --git a/website/theme/components/Landingpage/Hero/ovalBg.svg b/website/theme/components/Landingpage/Hero/ovalBg.svg deleted file mode 100644 index b99e25cadf78..000000000000 --- a/website/theme/components/Landingpage/Hero/ovalBg.svg +++ /dev/null @@ -1,13 +0,0 @@ - - - - - - - - - - \ No newline at end of file diff --git a/website/theme/components/Landingpage/ToolStack/index.module.scss b/website/theme/components/Landingpage/ToolStack/index.module.scss deleted file mode 100644 index 435105749d4c..000000000000 --- a/website/theme/components/Landingpage/ToolStack/index.module.scss +++ /dev/null @@ -1,93 +0,0 @@ -@media screen and (min-width: 601px) and (max-width: 1024px) { - .tools { - & > :nth-child(1), - & > :nth-child(2) { - min-width: 40% !important; - max-width: 60% !important; - width: 50%; - } - & > .tool { - max-width: 33%; - min-width: 30%; - flex: 1 0 0; - } - } -} - -// S -@media screen and (max-width: 600px) { - .tools { - flex-direction: column; - } -} - -:global { - html:not(.dark) { - --tool-stack-shadow-color: #f9f9f9; - } - html.dark { - --tool-stack-shadow-color: #23272f; - } -} - -.container { - display: flex; - padding: 64px 144px; - flex-direction: column; - align-items: center; - align-self: stretch; -} - -.tools { - display: flex; - align-items: center; - justify-content: center; - flex-wrap: wrap; - gap: 16px; -} - -.tool { - display: flex; - flex: 1 0 0; - padding: 24px 16px; - flex-direction: column; - align-items: center; - gap: 16px; - align-self: stretch; - - // style - border-radius: 10px; - border: 1px solid var(--why-rspack-card-stroke); - background: var(--why-rspack-card-gradient); - box-shadow: 0px -2px 10px 0px var(--tool-stack-shadow-color); - transition: all 0.2s; - - &:hover { - transform: scale3d(1.04, 1.04, 1.04); - } -} - -.logo { - height: 90px; - flex-shrink: 0; -} - -.toolTitle { - color: var(--landingpage-title-color); - text-align: center; - - font-size: 22px; - font-style: normal; - font-weight: 600; - line-height: 32px; /* 145.455% */ -} - -.toolDescription { - color: var(--landingpage-desc-color); - text-align: center; - - font-size: 14px; - font-style: normal; - font-weight: 400; - line-height: 24px; -} diff --git a/website/theme/components/Landingpage/ToolStack/index.tsx b/website/theme/components/Landingpage/ToolStack/index.tsx index 26936d6b6786..c49e28f8ed8e 100644 --- a/website/theme/components/Landingpage/ToolStack/index.tsx +++ b/website/theme/components/Landingpage/ToolStack/index.tsx @@ -1,82 +1,28 @@ +import { + containerStyle, + descStyle, + innerContainerStyle, + titleAndDescStyle, + titleStyle, +} from '@rstack-dev/doc-ui/section-style'; +import { ToolStack as BaseToolStack } from '@rstack-dev/doc-ui/tool-stack'; import type React from 'react'; import { memo } from 'react'; import { useLang } from 'rspress/runtime'; -import { Link } from 'rspress/theme'; import { useI18n } from '../../../i18n'; -import sharedStyles from '../shared.module.scss'; -import styles from './index.module.scss'; const ToolStack: React.FC = memo(() => { const lang = useLang(); const t = useI18n(); - const isEn = lang === 'en'; - const tools = [ - { - name: 'Rspack', - desc: isEn - ? 'A high performance JavaScript bundler written in Rust, with a webpack-compatible API.' - : '基于 Rust 编写的高性能 JavaScript 打包工具，具备与 webpack 兼容的 API。', - logo: 'https://assets.rspack.dev/rspack/rspack-logo.svg', - url: 'https://rspack.dev', - }, - { - name: 'Rsbuild', - desc: isEn - ? 'An Rspack-based build tool that provides out-of-the-box setup for enjoyable development experience.' - : '基于 Rspack 的构建工具，包含开箱即用的预设配置，带来愉悦的开发体验。', - logo: 'https://assets.rspack.dev/rsbuild/rsbuild-logo.svg', - url: 'https://rsbuild.dev', - }, - { - name: 'Rspress', - desc: isEn - ? 'A static site generator based on Rsbuild and MDX for creating elegant documentation sites.' - : '基于 Rsbuild 和 MDX 的静态站点生成器，用于创建优雅的文档站点。', - logo: 'https://assets.rspack.dev/rspress/rspress-logo-480x480.png', - url: 'https://rspress.dev', - }, - { - name: 'Rsdoctor', - desc: isEn - ? 'A powerful one-stop build analyzer for visualizing the build process and build artifacts.' - : '强大的一站式构建分析工具，用于可视化构建过程和构建产物。', - logo: 'https://assets.rspack.dev/rsdoctor/rsdoctor-logo-480x480.png', - url: 'https://rsdoctor.dev', - }, - - { - name: 'Rslib', - desc: isEn - ? 'A library build tool powered by Rsbuild for developing libraries or UI components.' - : '基于 Rsbuild 的库构建工具，用于开发工具库或 UI 组件库。', - logo: 'https://assets.rspack.dev/rslib/rslib-logo.svg', - url: 'https://github.com/web-infra-dev/rslib', - }, - ]; return ( -
-
-
-

{t('toolStackTitle')}

-

{t('toolStackDesc')}

-
-
- {tools.map(({ name, desc, logo, url }) => { - return ( - - {name} -

{name}

-

{desc}

- - ); - })} +
+
+
+

{t('toolStackTitle')}

+

{t('toolStackDesc')}

+
); diff --git a/website/theme/components/Landingpage/WhyRspack/index.module.scss b/website/theme/components/Landingpage/WhyRspack/index.module.scss deleted file mode 100644 index 2859c43d1708..000000000000 --- a/website/theme/components/Landingpage/WhyRspack/index.module.scss +++ /dev/null @@ -1,237 +0,0 @@ -// ---------- responsive layout -// XXL -@media screen and (min-width: 1441px) { - .featureCard { - flex: 1 0 30% !important; - } -} - -// XL -@media screen and (min-width: 1281px) and (max-width: 1440px) { - .featureCard { - flex: 1 0 30% !important; - } -} - -// L -@media screen and (min-width: 835px) and (max-width: 1280px) { - .featureCard { - min-width: 40% !important; - max-width: 50% !important; - } -} - -// M -@media screen and (min-width: 601px) and (max-width: 834px) { - .whyRspack { - padding: 16px !important; - .whyRspackTitle { - font-size: 32px !important; - font-weight: 700 !important; - line-height: normal !important; - letter-spacing: -1.28px !important; - } - .whyRspackDescription { - font-size: 20px !important; - font-style: normal !important; - font-weight: 400 !important; - line-height: normal !important; - } - } - .featureCard { - min-width: 45% !important; - max-width: 50% !important; - .featureCardInner { - padding: 16px !important; - } - .featureDescription { - font-size: 14px !important; - } - } -} - -// S -@media screen and (max-width: 600px) { - .whyRspack { - min-width: 100% !important; - padding: 16px !important; - .whyRspackTitle { - font-size: 24px !important; - font-style: normal !important; - font-weight: 700 !important; - line-height: normal !important; - letter-spacing: -0.96px !important; - } - .whyRspackDescription { - font-size: 16px !important; - font-style: normal !important; - font-weight: 400 !important; - line-height: normal !important; - } - } - .featureCard { - min-width: 100% !important; - .featureCardInner { - padding: 16px !important; - } - .featureDescription { - font-size: 14px !important; - } - } - - // extra - .whyRspackBg { - max-width: 50% !important; - max-height: 50% !important; - } -} - -.whyRspackCard { - flex: 2 0 60% !important; - align-self: stretch; - - .whyRspack { - width: 100%; - height: 100%; - position: relative; - display: flex; - padding: 32px; - flex-direction: column; - align-items: center; - gap: 16px; - - // style - border-radius: 20px; - border: 1px solid var(--why-rspack-card-stroke); - background: var(--why-rspack-card-gradient); - - .whyRspackBg { - width: 250px; - height: 75%; - position: absolute; - bottom: 32px; - right: 32px; - z-index: 0; - user-select: none; - } - - .whyRspackContent { - display: flex; - padding: 16px; - flex-direction: column; - justify-content: center; - align-items: flex-start; - gap: 16px; - - .whyRspackTitle { - font-size: 42px; - font-style: normal; - font-weight: 700; - line-height: normal; - letter-spacing: -2px; - // style - background: var( - --Linear-Text, - linear-gradient(278deg, #ff8b00 52.48%, #f93920 98.12%) - ); - background-clip: text; - -webkit-background-clip: text; - -webkit-text-fill-color: transparent; - } - - .whyRspackDescription { - // text - font-size: 20px; - font-style: normal; - font-weight: 400; - line-height: 40px; /* 166.667% */ - margin-top: 4px; - - // style - background: var(--why-rspack-description-bg); - background-clip: text; - -webkit-background-clip: text; - -webkit-text-fill-color: transparent; - } - } - } -} - -.features { - width: 100%; - display: flex; - justify-content: flex-start; - flex-wrap: wrap; - align-items: center; - gap: 16px; - padding: 0px; - - .featureCard { - display: flex; - flex: 1 0 30%; - align-self: stretch; - - .featureCardInner { - width: 100%; - height: 100%; - - display: flex; - flex-direction: column; - align-items: center; - gap: 16px; - - // style - border-radius: 20px; - border: 1px solid var(--why-rspack-card-stroke); - background: var(--why-rspack-card-gradient); - padding: 32px; - - .featureIcon { - background: url('https://assets.rspack.dev/rspack/assets/landingpage-why-rspack-card-bg.png') - no-repeat; - background-size: 100% 100%; - - display: flex; - justify-content: center; - align-items: center; - height: 100%; - width: 100%; - height: 150px; - - user-select: none; - - .featureIconImg { - width: 150px; - height: 120px; - } - } - - .featureContent { - width: 100%; - display: flex; - flex-direction: column; - justify-content: center; - align-items: flex-start; - gap: 8px; - - .featureTitle { - color: var(--landingpage-title-color); - - font-size: 20px; - font-style: normal; - font-weight: 700; - line-height: 1.5; - } - - .featureDescription { - color: var(--landingpage-desc-color); - - font-size: 15px; - font-style: normal; - font-weight: 400; - line-height: 24px; /* 150% */ - } - } - } - } -} diff --git a/website/theme/components/Landingpage/WhyRspack/index.tsx b/website/theme/components/Landingpage/WhyRspack/index.tsx index 03f528310f7b..ca916b404906 100644 --- a/website/theme/components/Landingpage/WhyRspack/index.tsx +++ b/website/theme/components/Landingpage/WhyRspack/index.tsx @@ -1,7 +1,11 @@ +import { + containerStyle, + innerContainerStyle, +} from '@rstack-dev/doc-ui/section-style'; +import { WhyRspack as BaseWhyRspack } from '@rstack-dev/doc-ui/why-rspack'; import { memo, useMemo } from 'react'; import { Link } from 'rspress/theme'; import { useI18n, useI18nUrl } from '../../../i18n'; -import sharedStyles from '../shared.module.scss'; import CompatibleJson from './assets/Compatible.json'; import Compatible from './assets/Compatible.svg'; import FrameCheckJson from './assets/FrameCheck.json'; @@ -10,9 +14,6 @@ import LightningJson from './assets/Lightning.json'; import Lightning from './assets/Lightning.svg'; import SpeedometerJson from './assets/Speedometer.json'; import Speedometer from './assets/Speedometer.svg'; -import styles from './index.module.scss'; -import { useCardAnimation } from './useCardAnimation'; -import { useLottieAnimation } from './useLottieAnimation'; type Feature = { img: string; @@ -22,180 +23,6 @@ type Feature = { lottieJsonData: any; }; -const WhyRspackCard = () => { - const t = useI18n(); - const { - container, - onMouseEnter, - onMouseLeave, - onMouseMove, - onTouchEnd, - onTouchMove, - onTouchStart, - outerContainer, - ref, - shine, - shineBg, - } = useCardAnimation(); - - return ( -
-
-
-
-

{t('whyRspack')}

-

{t('whyRspackDesc')}

- bg -
-
-
- ); -}; - -const FeatureItem = memo(({ feature }: { feature: Feature }) => { - const { description, img, title, url, lottieJsonData } = feature; - const { - container, - isHovering, - onMouseEnter, - onMouseLeave, - onMouseMove, - onTouchEnd, - onTouchMove, - onTouchStart, - outerContainer, - ref: cardAnimationContainerRef, - shine, - shineBg, - } = useCardAnimation(); - - const { ref: lottieContainerRef } = useLottieAnimation( - isHovering, - lottieJsonData, - ); - - return ( -
- -
-
- {title} -
-
-
-

{title}

-

{description}

-
- -
- ); -}); - const WhyRspack = memo(() => { const t = useI18n(); const tUrl = useI18nUrl(); @@ -235,15 +62,14 @@ const WhyRspack = memo(() => { ); return ( -
-
-
- {/* Why Rspack? */} - - {features.map(feature => { - return ; - })} -
+
+
+
); diff --git a/website/theme/components/Landingpage/WhyRspack/useCardAnimation.tsx b/website/theme/components/Landingpage/WhyRspack/useCardAnimation.tsx deleted file mode 100644 index b58a7c1d03c1..000000000000 --- a/website/theme/components/Landingpage/WhyRspack/useCardAnimation.tsx +++ /dev/null @@ -1,89 +0,0 @@ -import { useRef, useState } from 'react'; - -export const useCardAnimation = () => { - const [pageX, setPageX] = useState(null); - const [pageY, setPageY] = useState(null); - const [isHovering, setIsHovering] = useState(false); - const ref = useRef(); - - const handleMove = ({ pageX, pageY }: { pageX: number; pageY: number }) => { - setPageX(pageX); - setPageY(pageY); - }; - - const handleTouchMove = (evt: any) => { - evt.preventDefault(); - const { pageX, pageY } = evt.touches[0]; - handleMove({ pageX, pageY }); - }; - - const handleEnter = () => { - setIsHovering(true); - }; - const handleLeave = () => { - setIsHovering(false); - }; - - let shine: string; - let shineBg: string; - let container: string; - let outerContainer: string; - const ele = ref.current; - if (pageX && pageY && ele) { - const rootElemWidth = ele.clientWidth || ele.offsetWidth || ele.scrollWidth; - const rootElemHeight = - ele.clientHeight || ele.offsetHeight || ele.scrollHeight; - - const bodyScrollTop = - document.body.scrollTop || - document.getElementsByTagName('html')[0].scrollTop; - const bodyScrollLeft = document.body.scrollLeft; - - const offsets = ele.getBoundingClientRect(); - const wMultiple = 320 / rootElemWidth; - const multiple = wMultiple * 0.05; - const offsetX = - 0.52 - (pageX - offsets.left - bodyScrollLeft) / rootElemWidth; - const offsetY = - 0.52 - (pageY - offsets.top - bodyScrollTop) / rootElemHeight; - const dy = pageY - offsets.top - bodyScrollTop - rootElemHeight / 2; - const dx = pageX - offsets.left - bodyScrollLeft - rootElemWidth / 2; - const yRotate = (offsetX - dx) * multiple; - const xRotate = - (dy - offsetY) * (Math.min(offsets.width / offsets.height, 1) * multiple); - const arad = Math.atan2(dy, dx); - const rawAngle = (arad * 180) / Math.PI - 90; - const angle = rawAngle < 0 ? rawAngle + 360 : rawAngle; - - shine = `translateX(${offsetX - 0.1}px) translateY(${offsetY - 0.1}px)`; - shineBg = `linear-gradient(${angle}deg, rgba(255, 255, 255, ${ - ((pageY - offsets.top - bodyScrollTop) / rootElemHeight) * 0.2 - }) 0%, rgba(255, 255, 255, 0) 50%)`; - - container = `rotateX(${xRotate}deg) rotateY(${yRotate}deg) ${ - isHovering ? ' scale3d(1.01,1.01,1.01)' : '' - }`; - outerContainer = `perspective(${rootElemWidth * 2}px`; - } else { - shine = ''; - shineBg = ''; - container = ''; - outerContainer = ''; - } - - return { - ref, - isHovering, - shine: isHovering ? shine : '', - shineBg: isHovering ? shineBg : '', - container: isHovering ? container : '', - outerContainer: isHovering ? outerContainer : '', - - onMouseEnter: handleEnter, - onMouseLeave: handleLeave, - onMouseMove: handleMove, - onTouchMove: handleTouchMove, - onTouchStart: handleEnter, - onTouchEnd: handleLeave, - }; -}; diff --git a/website/theme/components/Landingpage/WhyRspack/useLottieAnimation.tsx b/website/theme/components/Landingpage/WhyRspack/useLottieAnimation.tsx deleted file mode 100644 index c0cbea935d9f..000000000000 --- a/website/theme/components/Landingpage/WhyRspack/useLottieAnimation.tsx +++ /dev/null @@ -1,44 +0,0 @@ -import lottie from 'lottie-web'; -import type { AnimationItem } from 'lottie-web'; -import { useEffect, useRef } from 'react'; - -export const useLottieAnimation = ( - isHovering: boolean, - lottieJsonData: string, -) => { - const ref = useRef(); - - const animationRef = useRef(); - - useEffect(() => { - if (!ref.current) { - return; - } - const animation = lottie.loadAnimation({ - container: ref.current, - animationData: lottieJsonData, - renderer: 'svg', - loop: false, - autoplay: false, - }); - - animation.setSpeed(3); - - animationRef.current = animation; - }, [lottieJsonData]); - useEffect(() => { - if (!animationRef.current || !ref.current) { - return; - } - - if (isHovering) { - animationRef.current.goToAndPlay(0, true); - } else { - animationRef.current.goToAndStop(0, true); - } - }, [isHovering]); - - return { - ref, - }; -}; From c81805c9b81052cc515b2119d9d54b484e6ed41d Mon Sep 17 00:00:00 2001 From: SoonIter Date: Thu, 29 Aug 2024 18:51:50 +0800 Subject: [PATCH 2/4] chore: update to 1.3.0 --- website/package.json | 2 +- website/pnpm-lock.yaml | 10 +++++----- 2 files changed, 6 insertions(+), 6 deletions(-) diff --git a/website/package.json b/website/package.json index dcb8bc343c43..b92f90f48048 100644 --- a/website/package.json +++ b/website/package.json @@ -19,7 +19,7 @@ "license": "MIT", "packageManager": "pnpm@9.3.0", "dependencies": { - "@rstack-dev/doc-ui": "^1.2.0", + "@rstack-dev/doc-ui": "1.3.0", "antd": "5.19.3", "axios": "^1.6.1", "date-fns": "^2.29.3", diff --git a/website/pnpm-lock.yaml b/website/pnpm-lock.yaml index 4f3ef8164727..0b4d0d2aaf2b 100644 --- a/website/pnpm-lock.yaml +++ b/website/pnpm-lock.yaml @@ -9,8 +9,8 @@ importers: .: dependencies: '@rstack-dev/doc-ui': - specifier: ^1.2.0 - version: 1.2.0(@emotion/is-prop-valid@0.8.8)(react-dom@18.2.0(react@18.2.0))(react@18.2.0) + specifier: 1.3.0 + version: 1.3.0(@emotion/is-prop-valid@0.8.8)(react-dom@18.2.0(react@18.2.0))(react@18.2.0) antd: specifier: 5.19.3 version: 5.19.3(date-fns@2.30.0)(react-dom@18.2.0(react@18.2.0))(react@18.2.0) @@ -710,8 +710,8 @@ packages: resolution: {integrity: sha512-bwZldJkS0tZfPrS04JAgrhuvGU81fOZ1BTd/wgPCRXJshuU5nBo01JHoq3D8WaTa4wtRQKo0i1yMs6pS+Xu0EA==} engines: {node: '>=14.17.6'} - '@rstack-dev/doc-ui@1.2.0': - resolution: {integrity: sha512-/slMk3IPj9EQcdDnVriZce9qGavU+LJiHeylhgThEBfJBJT2MPUig/hMTpERlDtaJ0+Y/YE4THS1R2DsVG/W0A==} + '@rstack-dev/doc-ui@1.3.0': + resolution: {integrity: sha512-JeHXwfyYULvxg7EBxPZ/tHEIWvlLY2w2f8PWiqbUMLuUid6iZL/AxZ56LKKH5yc+eJ/07g5r+5vW4XJ5rWW6Gg==} '@selderee/plugin-htmlparser2@0.11.0': resolution: {integrity: sha512-P33hHGdldxGabLFjPPpaTxVolMrzrcegejx+0GxjrIb9Zv48D8yAIA/QTDR2dFl7Uz7urX8aX6+5bCZslr+gWQ==} @@ -3953,7 +3953,7 @@ snapshots: react-transition-group: 4.4.5(react-dom@18.3.1(react@18.3.1))(react@18.3.1) rspack-plugin-virtual-module: 0.1.12 - '@rstack-dev/doc-ui@1.2.0(@emotion/is-prop-valid@0.8.8)(react-dom@18.2.0(react@18.2.0))(react@18.2.0)': + '@rstack-dev/doc-ui@1.3.0(@emotion/is-prop-valid@0.8.8)(react-dom@18.2.0(react@18.2.0))(react@18.2.0)': dependencies: framer-motion: 11.3.4(@emotion/is-prop-valid@0.8.8)(react-dom@18.2.0(react@18.2.0))(react@18.2.0) transitivePeerDependencies: From 66bfe17e1b84db6a09cbb96e9c51a1ad25e14722 Mon Sep 17 00:00:00 2001 From: SoonIter Date: Thu, 29 Aug 2024 19:08:23 +0800 Subject: [PATCH 3/4] chore: update 1.3.1 --- website/package.json | 2 +- website/pnpm-lock.yaml | 10 +++++----- 2 files changed, 6 insertions(+), 6 deletions(-) diff --git a/website/package.json b/website/package.json index b92f90f48048..23e1681e284b 100644 --- a/website/package.json +++ b/website/package.json @@ -19,7 +19,7 @@ "license": "MIT", "packageManager": "pnpm@9.3.0", "dependencies": { - "@rstack-dev/doc-ui": "1.3.0", + "@rstack-dev/doc-ui": "1.3.1", "antd": "5.19.3", "axios": "^1.6.1", "date-fns": "^2.29.3", diff --git a/website/pnpm-lock.yaml b/website/pnpm-lock.yaml index 0b4d0d2aaf2b..c634386b25c7 100644 --- a/website/pnpm-lock.yaml +++ b/website/pnpm-lock.yaml @@ -9,8 +9,8 @@ importers: .: dependencies: '@rstack-dev/doc-ui': - specifier: 1.3.0 - version: 1.3.0(@emotion/is-prop-valid@0.8.8)(react-dom@18.2.0(react@18.2.0))(react@18.2.0) + specifier: 1.3.1 + version: 1.3.1(@emotion/is-prop-valid@0.8.8)(react-dom@18.2.0(react@18.2.0))(react@18.2.0) antd: specifier: 5.19.3 version: 5.19.3(date-fns@2.30.0)(react-dom@18.2.0(react@18.2.0))(react@18.2.0) @@ -710,8 +710,8 @@ packages: resolution: {integrity: sha512-bwZldJkS0tZfPrS04JAgrhuvGU81fOZ1BTd/wgPCRXJshuU5nBo01JHoq3D8WaTa4wtRQKo0i1yMs6pS+Xu0EA==} engines: {node: '>=14.17.6'} - '@rstack-dev/doc-ui@1.3.0': - resolution: {integrity: sha512-JeHXwfyYULvxg7EBxPZ/tHEIWvlLY2w2f8PWiqbUMLuUid6iZL/AxZ56LKKH5yc+eJ/07g5r+5vW4XJ5rWW6Gg==} + '@rstack-dev/doc-ui@1.3.1': + resolution: {integrity: sha512-ihLXPOMyePtZfZg/unB+tth3lBUBJhigR7AG03RjVYXsTBSGSAGgodKyajRAOH8G4HFjocjtiEKzFlJrLCuhOw==} '@selderee/plugin-htmlparser2@0.11.0': resolution: {integrity: sha512-P33hHGdldxGabLFjPPpaTxVolMrzrcegejx+0GxjrIb9Zv48D8yAIA/QTDR2dFl7Uz7urX8aX6+5bCZslr+gWQ==} @@ -3953,7 +3953,7 @@ snapshots: react-transition-group: 4.4.5(react-dom@18.3.1(react@18.3.1))(react@18.3.1) rspack-plugin-virtual-module: 0.1.12 - '@rstack-dev/doc-ui@1.3.0(@emotion/is-prop-valid@0.8.8)(react-dom@18.2.0(react@18.2.0))(react@18.2.0)': + '@rstack-dev/doc-ui@1.3.1(@emotion/is-prop-valid@0.8.8)(react-dom@18.2.0(react@18.2.0))(react@18.2.0)': dependencies: framer-motion: 11.3.4(@emotion/is-prop-valid@0.8.8)(react-dom@18.2.0(react@18.2.0))(react@18.2.0) transitivePeerDependencies: From b7bce2d1973f60706d2e65885aa48aed3a94f351 Mon Sep 17 00:00:00 2001 From: SoonIter Date: Thu, 29 Aug 2024 19:20:59 +0800 Subject: [PATCH 4/4] chore: update 1.3.2 --- website/package.json | 2 +- website/pnpm-lock.yaml | 10 +++++----- 2 files changed, 6 insertions(+), 6 deletions(-) diff --git a/website/package.json b/website/package.json index 23e1681e284b..1f8614519993 100644 --- a/website/package.json +++ b/website/package.json @@ -19,7 +19,7 @@ "license": "MIT", "packageManager": "pnpm@9.3.0", "dependencies": { - "@rstack-dev/doc-ui": "1.3.1", + "@rstack-dev/doc-ui": "1.3.2", "antd": "5.19.3", "axios": "^1.6.1", "date-fns": "^2.29.3", diff --git a/website/pnpm-lock.yaml b/website/pnpm-lock.yaml index c634386b25c7..48122670bc59 100644 --- a/website/pnpm-lock.yaml +++ b/website/pnpm-lock.yaml @@ -9,8 +9,8 @@ importers: .: dependencies: '@rstack-dev/doc-ui': - specifier: 1.3.1 - version: 1.3.1(@emotion/is-prop-valid@0.8.8)(react-dom@18.2.0(react@18.2.0))(react@18.2.0) + specifier: 1.3.2 + version: 1.3.2(@emotion/is-prop-valid@0.8.8)(react-dom@18.2.0(react@18.2.0))(react@18.2.0) antd: specifier: 5.19.3 version: 5.19.3(date-fns@2.30.0)(react-dom@18.2.0(react@18.2.0))(react@18.2.0) @@ -710,8 +710,8 @@ packages: resolution: {integrity: sha512-bwZldJkS0tZfPrS04JAgrhuvGU81fOZ1BTd/wgPCRXJshuU5nBo01JHoq3D8WaTa4wtRQKo0i1yMs6pS+Xu0EA==} engines: {node: '>=14.17.6'} - '@rstack-dev/doc-ui@1.3.1': - resolution: {integrity: sha512-ihLXPOMyePtZfZg/unB+tth3lBUBJhigR7AG03RjVYXsTBSGSAGgodKyajRAOH8G4HFjocjtiEKzFlJrLCuhOw==} + '@rstack-dev/doc-ui@1.3.2': + resolution: {integrity: sha512-AfBn+j16IbYpJNJox1uFYin+ffmgn0P/ImYVfPGjzMi8tlYW352g6gqO0AlQo/YAFoGSCB4BGY0KIXk1IeeUEQ==} '@selderee/plugin-htmlparser2@0.11.0': resolution: {integrity: sha512-P33hHGdldxGabLFjPPpaTxVolMrzrcegejx+0GxjrIb9Zv48D8yAIA/QTDR2dFl7Uz7urX8aX6+5bCZslr+gWQ==} @@ -3953,7 +3953,7 @@ snapshots: react-transition-group: 4.4.5(react-dom@18.3.1(react@18.3.1))(react@18.3.1) rspack-plugin-virtual-module: 0.1.12 - '@rstack-dev/doc-ui@1.3.1(@emotion/is-prop-valid@0.8.8)(react-dom@18.2.0(react@18.2.0))(react@18.2.0)': + '@rstack-dev/doc-ui@1.3.2(@emotion/is-prop-valid@0.8.8)(react-dom@18.2.0(react@18.2.0))(react@18.2.0)': dependencies: framer-motion: 11.3.4(@emotion/is-prop-valid@0.8.8)(react-dom@18.2.0(react@18.2.0))(react@18.2.0) transitivePeerDependencies: