@lobehub/chat 1.96.2 → 1.96.4

package/src/features/KnowledgeBaseModal/AssignKnowledgeBase/Item/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 { Flexbox } from 'react-layout-kit';
@@ -8,8 +8,6 @@ import { KnowledgeItem } from '@/types/knowledgeBase';
 
 import Actions from './Action';
 
-const { Paragraph } = Typography;
-
 const useStyles = createStyles(({ css, token }) => ({
   desc: css`
     margin: 0 !important;
@@ -51,14 +49,14 @@ const PluginItem = memo<KnowledgeItem>(({ id, fileType, name, type, description,
         <KnowledgeIcon fileType={fileType} name={name} size={{ file: 40, repo: 40 }} type={type} />
         <Flexbox flex={1} gap={4} style={{ overflow: 'hidden', position: 'relative' }}>
           <Flexbox align={'center'} gap={8} horizontal>
-            <Paragraph className={styles.title} ellipsis={{ rows: 1 }}>
+            <Text className={styles.title} ellipsis>
               {name}
-            </Paragraph>
+            </Text>
           </Flexbox>
           {description && (
-            <Paragraph className={styles.desc} ellipsis={{ rows: 1 }}>
+            <Text className={styles.desc} ellipsis>
               {description}
-            </Paragraph>
+            </Text>
           )}
         </Flexbox>
       </Flexbox>

package/src/features/Portal/Artifacts/Header.tsx

@@ -1,5 +1,5 @@
-import { ActionIcon, Icon, Segmented } from '@lobehub/ui';
-import { ConfigProvider, Typography } from 'antd';
+import { ActionIcon, Icon, Segmented, Text } from '@lobehub/ui';
+import { ConfigProvider } from 'antd';
 import { cx } from 'antd-style';
 import { ArrowLeft, CodeIcon, EyeIcon } from 'lucide-react';
 import { useTranslation } from 'react-i18next';
@@ -34,9 +34,9 @@ const Header = () => {
     <Flexbox align={'center'} flex={1} gap={12} horizontal justify={'space-between'} width={'100%'}>
       <Flexbox align={'center'} gap={4} horizontal>
         <ActionIcon icon={ArrowLeft} onClick={() => closeArtifact()} size={'small'} />
-        <Typography.Text className={cx(oneLineEllipsis)} type={'secondary'}>
+        <Text className={cx(oneLineEllipsis)} type={'secondary'}>
           {artifactTitle}
-        </Typography.Text>
+        </Text>
       </Flexbox>
       <ConfigProvider
         theme={{

package/src/features/Portal/FilePreview/Header.tsx

@@ -1,5 +1,5 @@
-import { ActionIcon } from '@lobehub/ui';
-import { Skeleton, Typography } from 'antd';
+import { ActionIcon, Text } from '@lobehub/ui';
+import { Skeleton } from 'antd';
 import { ArrowLeft } from 'lucide-react';
 import { Flexbox } from 'react-layout-kit';
 
@@ -25,9 +25,9 @@ const Header = () => {
       {isLoading ? (
         <Skeleton.Button active style={{ height: 28 }} />
       ) : (
-        <Typography.Text className={oneLineEllipsis} style={{ fontSize: 16 }} type={'secondary'}>
+        <Text className={oneLineEllipsis} style={{ fontSize: 16 }} type={'secondary'}>
           {data?.name}
-        </Typography.Text>
+        </Text>
       )}
     </Flexbox>
   );

package/src/features/Portal/Home/Body/Files/FileList/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>(({ name, fileType, size, id }) => {
     >
       <FileIcon fileName={name} fileType={fileType} />
       <Flexbox>
-        <Typography.Text ellipsis={{ tooltip: true }}>{name}</Typography.Text>
-        <Typography.Text type={'secondary'}>{formatSize(size)}</Typography.Text>
+        <Text ellipsis={{ tooltip: true }}>{name}</Text>
+        <Text type={'secondary'}>{formatSize(size)}</Text>
       </Flexbox>
     </Flexbox>
   );

package/src/features/Portal/Home/Body/Files/FileList/index.tsx

@@ -1,5 +1,4 @@
-import { Avatar, Icon } from '@lobehub/ui';
-import { Typography } from 'antd';
+import { Avatar, Icon, Text } from '@lobehub/ui';
 import { useTheme } from 'antd-style';
 import isEqual from 'fast-deep-equal';
 import { InboxIcon } from 'lucide-react';
@@ -35,7 +34,7 @@ const FileList = () => {
         size={48}
       />
       <Balancer>
-        <Typography.Text type={'secondary'}>{t('emptyKnowledgeList')}</Typography.Text>
+        <Text type={'secondary'}>{t('emptyKnowledgeList')}</Text>
       </Balancer>
     </Center>
   ) : (

package/src/features/Portal/Home/Body/Files/index.tsx

@@ -1,4 +1,4 @@
-import { Typography } from 'antd';
+import { Text } from '@lobehub/ui';
 import { memo } from 'react';
 import { useTranslation } from 'react-i18next';
 import { Flexbox } from 'react-layout-kit';
@@ -10,9 +10,9 @@ export const Files = memo(() => {
 
   return (
     <Flexbox gap={8}>
-      <Typography.Title level={5} style={{ marginInline: 12 }}>
+      <Text as={'h5'} style={{ marginInline: 12 }}>
         {t('files')}
-      </Typography.Title>
+      </Text>
       <FileList />
     </Flexbox>
   );

package/src/features/Portal/Home/Body/Plugins/ArtifactList/Item/index.tsx

@@ -1,5 +1,4 @@
-import { Icon, Tag } from '@lobehub/ui';
-import { Typography } from 'antd';
+import { Icon, Tag, Text } from '@lobehub/ui';
 import isEqual from 'fast-deep-equal';
 import { CircuitBoard } from 'lucide-react';
 import { memo } from 'react';
@@ -53,9 +52,9 @@ const ArtifactItem = memo<ArtifactItemProps>(({ payload, messageId, identifier =
               <Tag>{payload?.apiName}</Tag>
             </Flexbox>
             <div>
-              <Typography.Text ellipsis style={{ fontSize: 12 }} type={'secondary'}>
+              <Text ellipsis style={{ fontSize: 12 }} type={'secondary'}>
                 {args}
-              </Typography.Text>
+              </Text>
             </div>
           </Flexbox>
         </Flexbox>

package/src/features/Portal/Home/Body/Plugins/ArtifactList/index.tsx

@@ -1,5 +1,5 @@
-import { Avatar, Icon } from '@lobehub/ui';
-import { Skeleton, Typography } from 'antd';
+import { Avatar, Icon, Text } from '@lobehub/ui';
+import { Skeleton } from 'antd';
 import { useTheme } from 'antd-style';
 import isEqual from 'fast-deep-equal';
 import { Origami } from 'lucide-react';
@@ -41,7 +41,7 @@ const ArtifactList = () => {
         size={48}
       />
       <Balancer>
-        <Typography.Text type={'secondary'}>{t('emptyArtifactList')}</Typography.Text>
+        <Text type={'secondary'}>{t('emptyArtifactList')}</Text>
       </Balancer>
     </Center>
   ) : (

package/src/features/Portal/Home/Body/Plugins/index.tsx

@@ -1,4 +1,4 @@
-import { Typography } from 'antd';
+import { Text } from '@lobehub/ui';
 import { memo } from 'react';
 import { useTranslation } from 'react-i18next';
 import { Flexbox } from 'react-layout-kit';
@@ -10,9 +10,9 @@ export const Artifacts = memo(() => {
 
   return (
     <Flexbox gap={8}>
-      <Typography.Title level={5} style={{ marginInline: 12 }}>
+      <Text as={'h5'} style={{ marginInline: 12 }}>
         {t('Plugins')}
-      </Typography.Title>
+      </Text>
       <ArtifactList />
     </Flexbox>
   );

package/src/features/Portal/Home/Title.tsx

@@ -1,6 +1,6 @@
 'use client';
 
-import { Typography } from 'antd';
+import { Text } from '@lobehub/ui';
 import { memo } from 'react';
 import { useTranslation } from 'react-i18next';
 
@@ -8,9 +8,9 @@ const Title = memo(() => {
   const { t } = useTranslation('portal');
 
   return (
-    <Typography.Text style={{ fontSize: 16 }} type={'secondary'}>
+    <Text style={{ fontSize: 16 }} type={'secondary'}>
       {t('title')}
-    </Typography.Text>
+    </Text>
   );
 });
 

package/src/features/Portal/MessageDetail/Header.tsx

@@ -1,4 +1,4 @@
-import { Typography } from 'antd';
+import { Text } from '@lobehub/ui';
 import { useTranslation } from 'react-i18next';
 import { Flexbox } from 'react-layout-kit';
 
@@ -9,9 +9,9 @@ const Header = () => {
 
   return (
     <Flexbox align={'center'} gap={4} horizontal>
-      <Typography.Text className={oneLineEllipsis} style={{ fontSize: 16 }} type={'secondary'}>
+      <Text className={oneLineEllipsis} style={{ fontSize: 16 }} type={'secondary'}>
         {t('messageDetail')}
-      </Typography.Text>
+      </Text>
     </Flexbox>
   );
 };

package/src/features/Portal/Plugins/Header.tsx

@@ -1,5 +1,4 @@
-import { ActionIcon, Icon } from '@lobehub/ui';
-import { Typography } from 'antd';
+import { ActionIcon, Icon, Text } from '@lobehub/ui';
 import isEqual from 'fast-deep-equal';
 import { ArrowLeft, Globe } from 'lucide-react';
 import { useTranslation } from 'react-i18next';
@@ -27,9 +26,9 @@ const Header = () => {
       <Flexbox align={'center'} gap={8} horizontal>
         <ActionIcon icon={ArrowLeft} onClick={() => closeToolUI()} size={'small'} />
         <Icon icon={Globe} size={16} />
-        <Typography.Text style={{ fontSize: 16 }} type={'secondary'}>
+        <Text style={{ fontSize: 16 }} type={'secondary'}>
           {t('search.title')}
-        </Typography.Text>
+        </Text>
       </Flexbox>
     );
   }
@@ -37,9 +36,9 @@ const Header = () => {
     <Flexbox align={'center'} gap={4} horizontal>
       <ActionIcon icon={ArrowLeft} onClick={() => closeToolUI()} size={'small'} />
       <PluginAvatar identifier={toolUIIdentifier} size={28} />
-      <Typography.Text style={{ fontSize: 16 }} type={'secondary'}>
+      <Text style={{ fontSize: 16 }} type={'secondary'}>
         {pluginTitle}
-      </Typography.Text>
+      </Text>
     </Flexbox>
   );
 };

package/src/features/Portal/Thread/Header/Active.tsx

@@ -1,5 +1,4 @@
-import { Icon } from '@lobehub/ui';
-import { Typography } from 'antd';
+import { Icon, Text } from '@lobehub/ui';
 import { useTheme } from 'antd-style';
 import isEqual from 'fast-deep-equal';
 import { ListTree } from 'lucide-react';
@@ -20,7 +19,7 @@ const Active = memo(() => {
     currentThread && (
       <Flexbox align={'center'} gap={8} horizontal style={{ marginInlineStart: 4 }}>
         <Icon color={theme.colorTextSecondary} icon={ListTree} size={18} />
-        <Typography.Text
+        <Text
           className={oneLineEllipsis}
           ellipsis={true}
           style={{ color: theme.colorTextSecondary, fontSize: 14 }}
@@ -32,7 +31,7 @@ const Active = memo(() => {
           ) : (
             currentThread?.title
           )}
-        </Typography.Text>
+        </Text>
       </Flexbox>
     )
   );

package/src/features/Portal/Thread/Header/New.tsx

@@ -1,5 +1,5 @@
-import { Icon } from '@lobehub/ui';
-import { Switch, Typography } from 'antd';
+import { Icon, Text } from '@lobehub/ui';
+import { Switch } from 'antd';
 import { GitBranch } from 'lucide-react';
 import { useTranslation } from 'react-i18next';
 import { Flexbox } from 'react-layout-kit';
@@ -17,9 +17,9 @@ const NewThreadHeader = () => {
   return (
     <Flexbox align={'center'} gap={8} horizontal style={{ marginInlineStart: 4 }}>
       <Icon icon={GitBranch} size={18} />
-      <Typography.Text className={oneLineEllipsis} ellipsis={true} style={{ fontSize: 14 }}>
+      <Text className={oneLineEllipsis} ellipsis style={{ fontSize: 14 }}>
         {t('newPortalThread.title')}
-      </Typography.Text>
+      </Text>
       <Flexbox align={'center'} gap={8} horizontal>
         <Switch
           checked={newThreadMode === ThreadType.Continuation}

package/src/features/SyncStatusInspector/EnableSync.tsx

@@ -1,5 +1,5 @@
-import { ActionIcon, Avatar, Icon, Tag } from '@lobehub/ui';
-import { Divider, Popover, Switch, Typography } from 'antd';
+import { ActionIcon, Avatar, Icon, Tag, Text } from '@lobehub/ui';
+import { Divider, Popover, Switch } from 'antd';
 import { createStyles } from 'antd-style';
 import { TooltipPlacement } from 'antd/es/tooltip';
 import isEqual from 'fast-deep-equal';
@@ -15,8 +15,6 @@ import { pathString } from '@/utils/url';
 
 import EnableTag from './EnableTag';
 
-const { Text } = Typography;
-
 const useStyles = createStyles(({ css, token, prefixCls }) => ({
   text: css`
     max-width: 100%;
@@ -67,9 +65,7 @@ const EnableSync = memo<EnableSyncProps>(({ hiddenActions, placement = 'bottomLe
               style={{ paddingInlineEnd: 12 }}
             >
               {t('sync.channel')}
-              <Text className={styles.text} copyable>
-                {channelName}
-              </Text>
+              <Text className={styles.text}>{channelName}</Text>
             </Flexbox>
           </Flexbox>
           <Divider dashed style={{ margin: 0 }} />
@@ -99,9 +95,9 @@ const EnableSync = memo<EnableSyncProps>(({ hiddenActions, placement = 'bottomLe
                       </Flexbox>
                     )}
                   </Flexbox>
-                  <Typography.Text type={'secondary'}>
+                  <Text type={'secondary'}>
                     {user.os} · {user.browser}
-                  </Typography.Text>
+                  </Text>
                 </Flexbox>
               </Flexbox>
             ))}

package/src/tools/local-system/Render/ReadLocalFile/ReadFileView.tsx

@@ -1,6 +1,5 @@
 import { LocalReadFileResult } from '@lobechat/electron-client-ipc';
-import { ActionIcon, Icon, Markdown } from '@lobehub/ui';
-import { Typography } from 'antd';
+import { ActionIcon, Icon, Markdown, Text } from '@lobehub/ui';
 import { createStyles } from 'antd-style';
 import { AlignLeft, Asterisk, ChevronDownIcon, ExternalLink, FolderOpen } from 'lucide-react';
 import React, { memo, useState } from 'react';
@@ -118,9 +117,9 @@ const ReadFileView = memo<ReadFileViewProps>(
           <Flexbox align={'center'} flex={1} gap={0} horizontal style={{ overflow: 'hidden' }}>
             <FileIcon fileName={filename} fileType={fileType} size={24} variant={'raw'} />
             <Flexbox horizontal>
-              <Typography.Text className={styles.fileName} ellipsis>
+              <Text className={styles.fileName} ellipsis>
                 {filename}
-              </Typography.Text>
+              </Text>
               {/* Actions on Hover */}
               <Flexbox className={styles.actions} gap={2} horizontal style={{ marginLeft: 8 }}>
                 <ActionIcon
@@ -174,9 +173,9 @@ const ReadFileView = memo<ReadFileViewProps>(
         </Flexbox>
 
         {/* Path */}
-        <Typography.Text className={styles.path} ellipsis type={'secondary'}>
+        <Text className={styles.path} ellipsis type={'secondary'}>
           {path}
-        </Typography.Text>
+        </Text>
 
         {isExpanded && (
           <Flexbox className={styles.previewBox} style={{ maxHeight: 240, overflow: 'auto' }}>

package/src/tools/web-browsing/Portal/PageContent/index.tsx

@@ -1,5 +1,5 @@
-import { Alert, CopyButton, Highlighter, Icon, Markdown, Segmented } from '@lobehub/ui';
-import { Descriptions, Typography } from 'antd';
+import { Alert, CopyButton, Highlighter, Icon, Markdown, Segmented, Text } from '@lobehub/ui';
+import { Descriptions } from 'antd';
 import { createStyles } from 'antd-style';
 import { ExternalLink } from 'lucide-react';
 import Link from 'next/link';
@@ -148,12 +148,9 @@ const PageContent = memo<PageContentProps>(({ result }) => {
           </Flexbox>
         </Flexbox>
         {description && (
-          <Typography.Paragraph
-            className={styles.description}
-            ellipsis={{ expandable: false, rows: 4 }}
-          >
+          <Text className={styles.description} ellipsis={{ rows: 4 }}>
             {description}
-          </Typography.Paragraph>
+          </Text>
         )}
         <Flexbox align={'center'} className={styles.url} gap={4} horizontal>
           {result.data.siteName && <div>{result.data.siteName} · </div>}

package/src/tools/web-browsing/Portal/Search/ResultList/SearchItem/TitleExtra.tsx

@@ -1,5 +1,4 @@
-import { Tag, Tooltip } from '@lobehub/ui';
-import { Typography } from 'antd';
+import { Tag, Text, Tooltip } from '@lobehub/ui';
 import { memo } from 'react';
 import { useTranslation } from 'react-i18next';
 import { Flexbox } from 'react-layout-kit';
@@ -27,12 +26,12 @@ const TitleExtra = memo<TitleExtraProps>(({ category, score, highlight, engines
             {score.toFixed(1)}
           </Tag>
         ) : (
-          <Typography.Text
+          <Text
             style={{ textAlign: 'center', width: 32, wordBreak: 'keep-all' }}
             type={'secondary'}
           >
             {score.toFixed(1)}
-          </Typography.Text>
+          </Text>
         )}
       </Tooltip>
       <CategoryAvatar category={category || 'general'} />

package/src/tools/web-browsing/Portal/Search/ResultList/SearchItem/Video.tsx

@@ -1,4 +1,5 @@
-import { Avatar as AntAvatar, Typography } from 'antd';
+import { Text } from '@lobehub/ui';
+import { Avatar as AntAvatar } from 'antd';
 import { createStyles } from 'antd-style';
 import { memo, useState } from 'react';
 import { Flexbox } from 'react-layout-kit';
@@ -122,9 +123,9 @@ const VideoItem = memo<SearchResultProps>(
                   score={score}
                 />
               </Flexbox>
-              <Typography.Text className={styles.url} type={'secondary'}>
+              <Text className={styles.url} type={'secondary'}>
                 {url}
-              </Typography.Text>
+              </Text>
               <Flexbox className={styles.desc}>{content}</Flexbox>
             </Flexbox>
           </Flexbox>

package/src/tools/web-browsing/Portal/Search/ResultList/SearchItem/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 { Flexbox } from 'react-layout-kit';
@@ -78,9 +78,9 @@ const SearchItem = memo<SearchResultProps>((props) => {
               score={score}
             />
           </Flexbox>
-          <Typography.Text className={styles.url} type={'secondary'}>
+          <Text className={styles.url} type={'secondary'}>
             {url}
-          </Typography.Text>
+          </Text>
           <Flexbox className={styles.desc}>{content}</Flexbox>
         </Flexbox>
       </Flexbox>

package/src/tools/web-browsing/Render/PageContent/Result.tsx

@@ -1,8 +1,8 @@
 'use client';
 
 import { CrawlErrorResult, CrawlSuccessResult } from '@lobechat/web-crawler';
-import { Alert, Highlighter, Icon } from '@lobehub/ui';
-import { Descriptions, Typography } from 'antd';
+import { Alert, Highlighter, Icon, Text } from '@lobehub/ui';
+import { Descriptions } from 'antd';
 import { createStyles } from 'antd-style';
 import { ExternalLink } from 'lucide-react';
 import Link from 'next/link';
@@ -13,8 +13,6 @@ import { Center, Flexbox } from 'react-layout-kit';
 import { useChatStore } from '@/store/chat';
 import { WebBrowsingManifest } from '@/tools/web-browsing';
 
-const { Paragraph } = Typography;
-
 const useStyles = createStyles(({ token, css }) => {
   return {
     cardBody: css`
@@ -146,9 +144,9 @@ const CrawlerResultCard = memo<CrawlerData>(({ result, messageId, crawler, origi
             </Center>
           </Link>
         </Flexbox>
-        <Paragraph className={styles.description} ellipsis={{ expandable: false, rows: 2 }}>
+        <Text className={styles.description} ellipsis={{ rows: 2 }}>
           {description || result.content?.slice(0, 40)}
-        </Paragraph>
+        </Text>
       </Flexbox>
       <div className={styles.footer}>
         <Descriptions

package/src/tools/web-browsing/Render/Search/SearchResult/SearchResultItem.tsx

@@ -1,4 +1,4 @@
-import { Typography } from 'antd';
+import { Text } from '@lobehub/ui';
 import { createStyles } from 'antd-style';
 import Link from 'next/link';
 import { memo } from 'react';
@@ -54,9 +54,9 @@ const SearchResultItem = memo<UniformSearchResult>(({ url, title }) => {
         <div className={styles.title}>{title}</div>
         <Flexbox align={'center'} gap={4} horizontal>
           <WebFavicon size={14} title={title} url={url} />
-          <Typography.Text className={styles.url} type={'secondary'}>
+          <Text className={styles.url} type={'secondary'}>
             {host.replace('www.', '')}
-          </Typography.Text>
+          </Text>
         </Flexbox>
       </Flexbox>
     </Link>

package/src/tools/web-browsing/components/SearchBar.tsx

@@ -1,5 +1,5 @@
-import { Button, Input, Select, Tooltip } from '@lobehub/ui';
-import { Checkbox, Radio, Space, Typography } from 'antd';
+import { Button, Input, Select, Text, Tooltip } from '@lobehub/ui';
+import { Checkbox, Radio, Space } from 'antd';
 import { SearchIcon } from 'lucide-react';
 import { ReactNode, memo, useState } from 'react';
 import { useTranslation } from 'react-i18next';
@@ -115,9 +115,9 @@ const SearchBar = memo<SearchBarProps>(
           />
         ) : (
           <Flexbox align={'flex-start'} gap={8} horizontal>
-            <Typography.Text style={{ marginTop: 2, wordBreak: 'keep-all' }} type={'secondary'}>
+            <Text style={{ marginTop: 2, wordBreak: 'keep-all' }} type={'secondary'}>
               {t('search.searchEngine.title')}
-            </Typography.Text>
+            </Text>
             <Checkbox.Group
               onChange={(checkedValue) => {
                 setEngines(checkedValue);
@@ -164,9 +164,9 @@ const SearchBar = memo<SearchBarProps>(
           />
         ) : (
           <Flexbox align="flex-start" gap={8} horizontal>
-            <Typography.Text style={{ marginTop: 2, wordBreak: 'keep-all' }} type={'secondary'}>
+            <Text style={{ marginTop: 2, wordBreak: 'keep-all' }} type={'secondary'}>
               {t('search.searchCategory.title')}
-            </Typography.Text>
+            </Text>
             <Checkbox.Group
               onChange={(checkedValue) => setCategories(checkedValue)}
               options={Object.keys(CATEGORY_ICON_MAP).map((item) => ({
@@ -184,7 +184,7 @@ const SearchBar = memo<SearchBarProps>(
         )}
 
         <Flexbox align={'center'} gap={16} horizontal wrap={'wrap'}>
-          <Typography.Text type={'secondary'}>{t('search.searchTimeRange.title')}</Typography.Text>
+          <Text type={'secondary'}>{t('search.searchTimeRange.title')}</Text>
           <Radio.Group
             onChange={(e) => setTimeRange(e.target.value)}
             optionType="button"