@lobehub/chat 1.96.2 → 1.96.4

package/src/app/[variants]/oauth/handoff/Client.tsx

@@ -1,14 +1,13 @@
 'use client';
 
-import { Spin, Typography } from 'antd';
+import { Text } from '@lobehub/ui';
+import { Spin } from 'antd';
 import { createStyles } from 'antd-style';
 import { useSearchParams } from 'next/navigation';
 import React, { useEffect, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { Center, Flexbox } from 'react-layout-kit';
 
-const { Title, Paragraph } = Typography;
-
 const useStyles = createStyles(({ css, token }) => ({
   container: css`
     width: 100%;
@@ -30,6 +29,7 @@ const useStyles = createStyles(({ css, token }) => ({
   `,
   title: css`
     margin-block-end: ${token.marginLG}px;
+    font-size: 24px;
   `,
 }));
 
@@ -86,10 +86,10 @@ const AuthHandoffPage = () => {
     <Center className={styles.container} gap={12}>
       {!isError && <Spin size="large" />}
       <Flexbox align="center" className={styles.content} gap={16}>
-        <Title className={styles.title} level={3}>
+        <Text as={'h3'} className={styles.title}>
           {status.title}
-        </Title>
-        <Paragraph className={styles.message}>{status.desc}</Paragraph>
+        </Text>
+        <Text className={styles.message}>{status.desc}</Text>
       </Flexbox>
     </Center>
   );

package/src/components/InitProgress/index.tsx

@@ -1,5 +1,5 @@
-import { Icon } from '@lobehub/ui';
-import { Progress, Typography } from 'antd';
+import { Icon, Text } from '@lobehub/ui';
+import { Progress } from 'antd';
 import { useTheme } from 'antd-style';
 import { Loader2 } from 'lucide-react';
 import { ReactNode, memo } from 'react';
@@ -33,7 +33,7 @@ const InitProgress = memo<InitingProps>(({ activeStage, stages }) => {
       />
       <Flexbox align={'center'} gap={4} horizontal>
         {stage?.icon ? stage?.icon : <Icon icon={Loader2} spin />}
-        <Typography.Text type={'secondary'}>{stage?.text}</Typography.Text>
+        <Text type={'secondary'}>{stage?.text}</Text>
       </Flexbox>
     </Center>
   );

package/src/components/Loading/CircleLoading/index.tsx

@@ -1,7 +1,6 @@
 'use client';
 
-import { Icon } from '@lobehub/ui';
-import { Typography } from 'antd';
+import { Icon, Text } from '@lobehub/ui';
 import { LoaderCircle } from 'lucide-react';
 import { useTranslation } from 'react-i18next';
 import { Center, Flexbox } from 'react-layout-kit';
@@ -14,9 +13,9 @@ export default () => {
         <div>
           <Icon icon={LoaderCircle} size={'large'} spin />
         </div>
-        <Typography.Text style={{ letterSpacing: '0.1em' }} type={'secondary'}>
+        <Text style={{ letterSpacing: '0.1em' }} type={'secondary'}>
           {t('loading')}
-        </Typography.Text>
+        </Text>
       </Flexbox>
     </Center>
   );

package/src/components/ModelSelect/index.tsx

@@ -1,6 +1,5 @@
 import { IconAvatarProps, ModelIcon, ProviderIcon } from '@lobehub/icons';
-import { Avatar, Icon, Tag, Tooltip } from '@lobehub/ui';
-import { Typography } from 'antd';
+import { Avatar, Icon, Tag, Text, Tooltip } from '@lobehub/ui';
 import { createStyles, useResponsive } from 'antd-style';
 import {
   Infinity,
@@ -188,11 +187,9 @@ export const ModelItemRender = memo<ModelItemRenderProps>(({ showInfoTag = true,
         style={{ flexShrink: 1, minWidth: 0, overflow: 'hidden' }}
       >
         <ModelIcon model={model.id} size={20} />
-        <Typography.Text
-          style={mobile ? { maxWidth: '60vw', overflowX: 'auto', whiteSpace: 'nowrap' } : {}}
-        >
+        <Text style={mobile ? { maxWidth: '60vw', overflowX: 'auto', whiteSpace: 'nowrap' } : {}}>
           {model.displayName || model.id}
-        </Typography.Text>
+        </Text>
       </Flexbox>
       {showInfoTag && <ModelInfoTags {...model} />}
     </Flexbox>

package/src/components/StatisticCard/TitleWithPercentage.tsx

@@ -1,13 +1,10 @@
-import { Tag } from '@lobehub/ui';
-import { Typography } from 'antd';
+import { Tag, Text } from '@lobehub/ui';
 import { useTheme } from 'antd-style';
 import { CSSProperties, memo } from 'react';
 import { Flexbox } from 'react-layout-kit';
 
 import { calcGrowthPercentage } from './growthPercentage';
 
-const { Title } = Typography;
-
 interface TitleWithPercentageProps {
   count?: number;
   inverseColor?: boolean;
@@ -43,9 +40,9 @@ const TitleWithPercentage = memo<TitleWithPercentageProps>(
           position: 'inherit',
         }}
       >
-        <Title
+        <Text
+          as={'h2'}
           ellipsis={{ rows: 1, tooltip: title }}
-          level={2}
           style={{
             fontSize: 'inherit',
             fontWeight: 'inherit',
@@ -55,7 +52,7 @@ const TitleWithPercentage = memo<TitleWithPercentageProps>(
           }}
         >
           {title}
-        </Title>
+        </Text>
         {count && prvCount && percentage && percentage !== 0 ? (
           <Tag
             style={{

package/src/components/StatisticCard/index.tsx

@@ -2,13 +2,12 @@ import {
   StatisticCard as AntdStatisticCard,
   StatisticCardProps as AntdStatisticCardProps,
 } from '@ant-design/pro-components';
-import { Spin, Typography } from 'antd';
+import { Text } from '@lobehub/ui';
+import { Spin } from 'antd';
 import { createStyles, useResponsive } from 'antd-style';
 import { adjustHue } from 'polished';
 import { memo } from 'react';
 
-const { Title } = Typography;
-
 const useStyles = createStyles(
   ({ isDarkMode, css, token, prefixCls, responsive }, highlight: string = '#000') => ({
     card: css`
@@ -182,9 +181,9 @@ const StatisticCard = memo<StatisticCardProps>(
         extra={loading ? <Spin percent={'auto'} size={'small'} /> : extra}
         title={
           typeof title === 'string' ? (
-            <Title
-              ellipsis={{ rows: 1, tooltip: title }}
-              level={2}
+            <Text
+              as={'h2'}
+              ellipsis={{ rows: 1, tooltip: true }}
               style={{
                 fontSize: 'inherit',
                 fontWeight: 'inherit',
@@ -194,7 +193,7 @@ const StatisticCard = memo<StatisticCardProps>(
               }}
             >
               {title}
-            </Title>
+            </Text>
           ) : (
             title
           )

package/src/config/modelProviders/index.ts

@@ -121,7 +121,6 @@ export const DEFAULT_MODEL_PROVIDER_LIST = [
   GoogleProvider,
   VertexAIProvider,
   DeepSeekProvider,
-  PPIOProvider,
   HuggingFaceProvider,
   OpenRouterProvider,
   CloudflareProvider,

package/src/features/AgentSetting/AgentPlugin/index.tsx

@@ -1,9 +1,10 @@
 'use client';
 
 import { Avatar, Button, Form, type FormGroupItemType, Tag, Tooltip } from '@lobehub/ui';
-import { Empty, Space, Switch, Typography } from 'antd';
+import { Empty, Space, Switch } from 'antd';
 import isEqual from 'fast-deep-equal';
 import { LucideTrash2, Store } from 'lucide-react';
+import Link from 'next/link';
 import { memo, useState } from 'react';
 import { Trans, useTranslation } from 'react-i18next';
 import { Center, Flexbox } from 'react-layout-kit';
@@ -130,7 +131,7 @@ const AgentPlugin = memo(() => {
         description={
           <Trans i18nKey={'plugin.empty'} ns={'setting'}>
             暂无安装插件，
-            <Typography.Link
+            <Link
               href={'/'}
               onClick={(e) => {
                 e.preventDefault();
@@ -138,7 +139,7 @@ const AgentPlugin = memo(() => {
               }}
             >
               前往插件市场
-            </Typography.Link>
+            </Link>
             安装
           </Trans>
         }

package/src/features/ChatInput/Desktop/FilePreview/FileItem/index.tsx

@@ -1,5 +1,4 @@
-import { ActionIcon } from '@lobehub/ui';
-import { Typography } from 'antd';
+import { ActionIcon, Text } from '@lobehub/ui';
 import { createStyles } from 'antd-style';
 import { Trash2Icon } from 'lucide-react';
 import { memo } from 'react';
@@ -64,9 +63,9 @@ const FileItem = memo<FileItemProps>((props) => {
         <Content {...props} />
       </Center>
       <Flexbox flex={1} gap={4} style={{ paddingBottom: 4, paddingInline: 4 }}>
-        <Typography.Text ellipsis={{ tooltip: true }} style={{ fontSize: 12, maxWidth: 100 }}>
+        <Text ellipsis={{ tooltip: true }} style={{ fontSize: 12, maxWidth: 100 }}>
           {file.name}
-        </Typography.Text>
+        </Text>
 
         <UploadDetail size={file.size} status={status} tasks={tasks} uploadState={uploadState} />
       </Flexbox>

package/src/features/ChatInput/components/UploadDetail/UploadStatus.tsx

@@ -1,6 +1,6 @@
 import { CheckCircleFilled } from '@ant-design/icons';
-import { Icon } from '@lobehub/ui';
-import { Progress, Typography } from 'antd';
+import { Icon, Text } from '@lobehub/ui';
+import { Progress } from 'antd';
 import { useTheme } from 'antd-style';
 import { Loader2Icon } from 'lucide-react';
 import { memo } from 'react';
@@ -26,9 +26,9 @@ const UploadStatus = memo<UploadStateProps>(({ status, size, uploadState }) => {
       return (
         <Flexbox align={'center'} gap={4} horizontal>
           <Icon icon={Loader2Icon} size={12} spin />
-          <Typography.Text style={{ fontSize: 12 }} type={'secondary'}>
+          <Text style={{ fontSize: 12 }} type={'secondary'}>
             {t('upload.preview.status.pending')}
-          </Typography.Text>
+          </Text>
         </Flexbox>
       );
     }
@@ -37,9 +37,9 @@ const UploadStatus = memo<UploadStateProps>(({ status, size, uploadState }) => {
       return (
         <Flexbox align={'center'} gap={4} horizontal>
           <Progress percent={uploadState?.progress} size={14} type="circle" />
-          <Typography.Text style={{ fontSize: 12 }} type={'secondary'}>
+          <Text style={{ fontSize: 12 }} type={'secondary'}>
             {formatSize(size * ((uploadState?.progress || 0) / 100), 0)} / {formatSize(size)}
-          </Typography.Text>
+          </Text>
         </Flexbox>
       );
     }
@@ -48,9 +48,9 @@ const UploadStatus = memo<UploadStateProps>(({ status, size, uploadState }) => {
       return (
         <Flexbox align={'center'} gap={4} horizontal>
           <Progress percent={uploadState?.progress} size={14} type="circle" />
-          <Typography.Text style={{ fontSize: 12 }} type={'secondary'}>
+          <Text style={{ fontSize: 12 }} type={'secondary'}>
             {formatSize(size)}
-          </Typography.Text>
+          </Text>
         </Flexbox>
       );
     }
@@ -59,9 +59,9 @@ const UploadStatus = memo<UploadStateProps>(({ status, size, uploadState }) => {
       return (
         <Flexbox align={'center'} gap={4} horizontal>
           <CheckCircleFilled style={{ color: theme.colorSuccess, fontSize: 12 }} />
-          <Typography.Text style={{ fontSize: 12 }} type={'secondary'}>
+          <Text style={{ fontSize: 12 }} type={'secondary'}>
             {formatSize(size)}
-          </Typography.Text>
+          </Text>
         </Flexbox>
       );
     }

package/src/features/ChatInput/components/UploadDetail/index.tsx

@@ -1,4 +1,4 @@
-import { Typography } from 'antd';
+import { Text } from '@lobehub/ui';
 import { createStyles } from 'antd-style';
 import { memo } from 'react';
 import { useTranslation } from 'react-i18next';
@@ -34,9 +34,9 @@ const UploadDetail = memo<UploadDetailProps>(({ uploadState, status, size, tasks
     <Flexbox align={'center'} gap={8} height={22} horizontal>
       <UploadStatus size={size} status={status} uploadState={uploadState} />
       {!!tasks && Object.keys(tasks).length === 0 ? (
-        <Typography.Text style={{ fontSize: 12 }} type={'secondary'}>
+        <Text style={{ fontSize: 12 }} type={'secondary'}>
           {t('upload.preview.prepareTasks')}
-        </Typography.Text>
+        </Text>
       ) : (
         <div>
           <FileParsingStatus {...tasks} className={styles.status} hideEmbeddingButton />

package/src/features/Conversation/Messages/Assistant/FileChunks/Item/index.tsx

@@ -1,5 +1,4 @@
-import { Tooltip } from '@lobehub/ui';
-import { Typography } from 'antd';
+import { Text, Tooltip } from '@lobehub/ui';
 import { memo } from 'react';
 import { Center, Flexbox } from 'react-layout-kit';
 
@@ -33,7 +32,7 @@ const ChunkItem = memo<ChunkItemProps>(({ id, fileId, similarity, text, filename
     >
       <FileIcon fileName={filename} fileType={fileType} size={20} variant={'raw'} />
       <Flexbox gap={12} horizontal justify={'space-between'} style={{ maxWidth: 200 }}>
-        <Typography.Text ellipsis={{ tooltip: false }}>{filename}</Typography.Text>
+        <Text ellipsis>{filename}</Text>
         {/*<Typography.Text*/}
         {/*  ellipsis={{ suffix: '...' }}*/}
         {/*  style={{ fontSize: 12, lineHeight: 1 }}*/}

package/src/features/Conversation/Messages/User/BelowMessage.tsx

@@ -1,5 +1,4 @@
-import { ActionIcon } from '@lobehub/ui';
-import { Typography } from 'antd';
+import { ActionIcon, Text } from '@lobehub/ui';
 import { createStyles } from 'antd-style';
 import isEqual from 'fast-deep-equal';
 import { RotateCwIcon, Trash2 } from 'lucide-react';
@@ -50,9 +49,9 @@ export const UserBelowMessage = memo<ChatMessage>(({ ragQuery, content, id }) =>
     !isEqual(ragQuery, content) && (
       <Flexbox className={styles.container}>
         <Flexbox align={'center'} className={styles.content} gap={4} horizontal>
-          <Typography.Text style={{ fontSize: 12 }} type={'secondary'}>
+          <Text style={{ fontSize: 12 }} type={'secondary'}>
             {ragQuery}
-          </Typography.Text>
+          </Text>
         </Flexbox>
         <Flexbox className={styles.action} horizontal>
           <ActionIcon

package/src/features/Conversation/Messages/User/FileListViewer/Item.tsx

@@ -1,4 +1,4 @@
-import { Typography } from 'antd';
+import { Text } from '@lobehub/ui';
 import { createStyles } from 'antd-style';
 import { memo } from 'react';
 import { Flexbox } from 'react-layout-kit';
@@ -43,8 +43,8 @@ const FileItem = memo<ChatFileItem>(({ id, fileType, size, name }) => {
     >
       <FileIcon fileName={name} fileType={fileType} />
       <Flexbox style={{ overflow: 'hidden' }}>
-        <Typography.Text ellipsis>{name}</Typography.Text>
-        <Typography.Text type={'secondary'}>{formatSize(size)}</Typography.Text>
+        <Text ellipsis>{name}</Text>
+        <Text type={'secondary'}>{formatSize(size)}</Text>
       </Flexbox>
     </Flexbox>
   );

package/src/features/Conversation/components/History/index.tsx

@@ -1,6 +1,5 @@
 import { ModelTag } from '@lobehub/icons';
-import { Icon, Markdown } from '@lobehub/ui';
-import { Typography } from 'antd';
+import { Icon, Markdown, Text } from '@lobehub/ui';
 import { createStyles } from 'antd-style';
 import { ScrollText } from 'lucide-react';
 import { memo } from 'react';
@@ -50,7 +49,7 @@ const History = memo(() => {
             <Center height={20} width={20}>
               <Icon icon={ScrollText} size={16} style={{ color: theme.colorTextDescription }} />
             </Center>
-            <Typography.Text type={'secondary'}>{t('historySummary')}</Typography.Text>
+            <Text type={'secondary'}>{t('historySummary')}</Text>
             {model && (
               <div>
                 <ModelTag model={model} />

package/src/features/DataImporter/ImportDetail.tsx

@@ -1,7 +1,7 @@
 'use client';
 
-import { Button, Modal } from '@lobehub/ui';
-import { Table, Typography } from 'antd';
+import { Button, Modal, Text } from '@lobehub/ui';
+import { Table } from 'antd';
 import { createStyles } from 'antd-style';
 import { Info } from 'lucide-react';
 import { useState } from 'react';
@@ -10,8 +10,6 @@ import { Flexbox } from 'react-layout-kit';
 
 import { ImportPgDataStructure } from '@/types/export';
 
-const { Text } = Typography;
-
 const getNonEmptyTables = (data: ImportPgDataStructure) => {
   const result = [];
 

package/src/features/ElectronTitlebar/Connection/Waiting.tsx

@@ -1,8 +1,7 @@
 'use client';
 
 import { useWatchBroadcast } from '@lobechat/electron-client-ipc';
-import { Button, Icon } from '@lobehub/ui';
-import { Typography } from 'antd';
+import { Button, Icon, Text } from '@lobehub/ui';
 import { createStyles, cx, keyframes } from 'antd-style';
 import { WifiIcon } from 'lucide-react';
 import { memo } from 'react';
@@ -10,8 +9,6 @@ import { useTranslation } from 'react-i18next';
 
 import { useElectronStore } from '@/store/electron';
 
-const { Text, Title } = Typography;
-
 const airdropPulse = keyframes`
     0% {
       transform: translate(-50%, -50%) scale(0.8);
@@ -189,9 +186,9 @@ const WaitingOAuth = memo<WaitingOAuthProps>(({ setWaiting, setIsOpen }) => {
 
           <Icon className={styles.radarIcon} icon={WifiIcon} size={40} />
         </div>
-        <Title className={styles.title} level={4}>
+        <Text as={'h4'} className={styles.title}>
           {t('waitingOAuth.title')}
-        </Title>
+        </Text>
         <Text className={styles.description}>{t('waitingOAuth.description')}</Text>
         <Button onClick={handleCancel}>{t('waitingOAuth.cancel')}</Button>{' '}
         <Text className={styles.helpText}>{t('waitingOAuth.helpText')}</Text>

package/src/features/FileManager/FileList/EmptyStatus.tsx

@@ -1,5 +1,5 @@
-import { FileTypeIcon, Icon } from '@lobehub/ui';
-import { Typography, Upload } from 'antd';
+import { FileTypeIcon, Icon, Text } from '@lobehub/ui';
+import { Upload } from 'antd';
 import { createStyles, useTheme } from 'antd-style';
 import { ArrowUpIcon, PlusIcon } from 'lucide-react';
 import { useTranslation } from 'react-i18next';
@@ -76,8 +76,8 @@ const EmptyStatus = ({ showKnowledgeBase, knowledgeBaseId }: EmptyStatusProps) =
   return (
     <Center gap={24} height={'100%'} style={{ paddingBottom: 100 }} width={'100%'}>
       <Flexbox justify={'center'} style={{ textAlign: 'center' }}>
-        <Typography.Title level={4}>{t('FileManager.emptyStatus.title')}</Typography.Title>
-        <Typography.Text type={'secondary'}>{t('FileManager.emptyStatus.or')}</Typography.Text>
+        <Text as={'h4'}>{t('FileManager.emptyStatus.title')}</Text>
+        <Text type={'secondary'}>{t('FileManager.emptyStatus.or')}</Text>
       </Flexbox>
       <Flexbox gap={12} horizontal>
         {showKnowledgeBase && (

package/src/features/FileManager/FileList/index.tsx

@@ -1,6 +1,6 @@
 'use client';
 
-import { Typography } from 'antd';
+import { Text } from '@lobehub/ui';
 import { createStyles } from 'antd-style';
 import { useQueryState } from 'nuqs';
 import { rgba } from 'polished';
@@ -109,9 +109,9 @@ const FileList = memo<FileListProps>(({ knowledgeBaseId, category }) => {
           components={{
             Footer: () => (
               <Center style={{ height: 64 }}>
-                <Typography.Text style={{ fontSize: 12 }} type={'secondary'}>
+                <Text style={{ fontSize: 12 }} type={'secondary'}>
                   {t('FileManager.bottom')}
-                </Typography.Text>
+                </Text>
               </Center>
             ),
           }}

package/src/features/FileManager/UploadDock/Item.tsx

@@ -1,4 +1,4 @@
-import { Typography } from 'antd';
+import { Text } from '@lobehub/ui';
 import { createStyles } from 'antd-style';
 import { ReactNode, memo, useMemo } from 'react';
 import { useTranslation } from 'react-i18next';
@@ -52,41 +52,41 @@ const UploadItem = memo<UploadItemProps>(({ file, status, uploadState }) => {
         ].filter(Boolean);
 
         return (
-          <Typography.Text style={{ fontSize: 12 }} type={'secondary'}>
+          <Text style={{ fontSize: 12 }} type={'secondary'}>
             {uploadState?.progress ? formatSize(size * (uploadState.progress / 100)) : '-'}/
             {formatSize(size)}
             {textArray.length === 0 ? '' : ' · ' + textArray.join(' · ')}
-          </Typography.Text>
+          </Text>
         );
       }
       case 'pending': {
         return (
-          <Typography.Text style={{ fontSize: 12 }} type={'secondary'}>
+          <Text style={{ fontSize: 12 }} type={'secondary'}>
             {formatSize(size)} · {t('uploadDock.body.item.pending')}
-          </Typography.Text>
+          </Text>
         );
       }
 
       case 'processing': {
         return (
-          <Typography.Text style={{ fontSize: 12 }} type={'secondary'}>
+          <Text style={{ fontSize: 12 }} type={'secondary'}>
             {formatSize(size)} · {t('uploadDock.body.item.processing')}
-          </Typography.Text>
+          </Text>
         );
       }
 
       case 'success': {
         return (
-          <Typography.Text style={{ fontSize: 12 }} type={'secondary'}>
+          <Text style={{ fontSize: 12 }} type={'secondary'}>
             {formatSize(size)} · {t('uploadDock.body.item.done')}
-          </Typography.Text>
+          </Text>
         );
       }
       case 'error': {
         return (
-          <Typography.Text style={{ fontSize: 12 }} type={'danger'}>
+          <Text style={{ fontSize: 12 }} type={'danger'}>
             {formatSize(size)} · {t('uploadDock.body.item.error')}
-          </Typography.Text>
+          </Text>
         );
       }
       default: {

package/src/features/FileManager/UploadDock/index.tsx

@@ -1,6 +1,5 @@
 import { CheckCircleFilled, CloseCircleFilled } from '@ant-design/icons';
-import { ActionIcon, Icon } from '@lobehub/ui';
-import { Typography } from 'antd';
+import { ActionIcon, Icon, Text } from '@lobehub/ui';
 import { createStyles } from 'antd-style';
 import isEqual from 'fast-deep-equal';
 import { UploadIcon, XIcon } from 'lucide-react';
@@ -149,7 +148,7 @@ const UploadDock = memo(() => {
             ))}
           </Flexbox>
           <Center style={{ height: 40, minHeight: 40 }}>
-            <Typography.Text
+            <Text
               onClick={() => {
                 setExpand(false);
               }}
@@ -157,7 +156,7 @@ const UploadDock = memo(() => {
               type={'secondary'}
             >
               {t('uploadDock.body.collapse')}
-            </Typography.Text>
+            </Text>
           </Center>
         </Flexbox>
       ) : (

package/src/features/FileManager/index.tsx

@@ -1,6 +1,6 @@
 'use client';
 
-import { Typography } from 'antd';
+import { Text } from '@lobehub/ui';
 import dynamic from 'next/dynamic';
 import { memo } from 'react';
 import { Flexbox } from 'react-layout-kit';
@@ -21,11 +21,9 @@ const FileManager = memo<FileManagerProps>(({ title, knowledgeBaseId, category }
     <>
       <Header knowledgeBaseId={knowledgeBaseId} />
       <Flexbox gap={12} height={'100%'}>
-        <Typography.Text
-          style={{ fontSize: 16, fontWeight: 'bold', marginBlock: 16, marginInline: 24 }}
-        >
+        <Text strong style={{ fontSize: 16, marginBlock: 16, marginInline: 24 }}>
           {title}
-        </Typography.Text>
+        </Text>
         <FileList category={category} knowledgeBaseId={knowledgeBaseId} />
       </Flexbox>
       <UploadDock />

package/src/features/InitClientDB/features/DatabaseRepair/Backup.tsx

@@ -1,5 +1,5 @@
-import { Alert, Button } from '@lobehub/ui';
-import { App, Card, Typography } from 'antd';
+import { Alert, Button, Text } from '@lobehub/ui';
+import { App, Card } from 'antd';
 import { createStyles } from 'antd-style';
 import { AlertCircle } from 'lucide-react';
 import { useTranslation } from 'react-i18next';
@@ -7,8 +7,6 @@ import { Flexbox } from 'react-layout-kit';
 
 import { resetClientDatabase } from '@/database/client/db';
 
-const { Text, Paragraph } = Typography;
-
 const useStyles = createStyles(({ css, token }) => ({
   card: css`
     border-radius: ${token.borderRadiusLG}px;
@@ -27,7 +25,7 @@ const Backup = () => {
         extra={<Text type="secondary">{t('clientDB.solve.backup.desc')}</Text>}
         title={t('clientDB.solve.backup.title')}
       >
-        <Paragraph>{t('clientDB.solve.backup.exportDesc')}</Paragraph>
+        <Text as={'p'}>{t('clientDB.solve.backup.exportDesc')}</Text>
         <Button block type={'primary'}>
           {t('clientDB.solve.backup.export')}
         </Button>

package/src/features/InitClientDB/features/DatabaseRepair/Repair.tsx

@@ -1,7 +1,7 @@
 'use client';
 
-import { Alert, Button, CodeEditor, Icon } from '@lobehub/ui';
-import { Card, List, Typography } from 'antd';
+import { Alert, Button, CodeEditor, Icon, Text } from '@lobehub/ui';
+import { Card, List } from 'antd';
 import { createStyles } from 'antd-style';
 import dayjs from 'dayjs';
 import isEqual from 'fast-deep-equal';
@@ -14,8 +14,6 @@ import { clientDB, updateMigrationRecord } from '@/database/client/db';
 import { useGlobalStore } from '@/store/global';
 import { clientDBSelectors } from '@/store/global/selectors';
 
-const { Text } = Typography;
-
 // 使用 antd-style 创建样式
 const useStyles = createStyles(({ css, token }) => ({
   actionBar: css`