@lobehub/chat 1.11.8 → 1.12.0

package/locales/zh-CN/knowledgeBase.json

@@ -0,0 +1,31 @@
+{
+  "addToKnowledgeBase": {
+    "addSuccess": "文件添加成功，<1>立即查看</1>",
+    "confirm": "添加",
+    "id": {
+      "placeholder": "请选择要添加的知识库",
+      "required": "请选择知识库",
+      "title": "目标知识库"
+    },
+    "title": "添加到知识库",
+    "totalFiles": "已选择 {{count}} 个文件"
+  },
+  "createNew": {
+    "confirm": "新建",
+    "description": {
+      "placeholder": "知识库简介（选填）"
+    },
+    "formTitle": "基本信息",
+    "name": {
+      "placeholder": "知识库名称",
+      "required": "请填写知识库名称"
+    },
+    "title": "新建知识库"
+  },
+  "tab": {
+    "files": "文档",
+    "settings": "设置",
+    "testing": "召回测试"
+  },
+  "title": "知识库"
+}

package/locales/zh-CN/portal.json

@@ -6,5 +6,6 @@
     "summaryTooltip": "总结当前内容"
   },
   "emptyArtifactList": "当前 Artifacts 列表为空，请在会话中按需使用插件后再查看",
+  "files": "文件",
   "title": "工作区"
 }

package/locales/zh-TW/chat.json

@@ -36,6 +36,24 @@
     "stop": "停止",
     "warp": "換行"
   },
+  "knowledgeBase": {
+    "all": "所有內容",
+    "allFiles": "所有檔案",
+    "allKnowledgeBases": "所有知識庫",
+    "disabled": "當前部署模式不支持知識庫對話，如需使用，請切換到伺服器端資料庫部署或使用 LobeChat Cloud 服務",
+    "library": {
+      "action": {
+        "add": "添加",
+        "detail": "詳情",
+        "remove": "移除"
+      },
+      "title": "檔案/知識庫"
+    },
+    "relativeFilesOrKnowledgeBases": "關聯檔案/知識庫",
+    "title": "知識庫",
+    "uploadGuide": "上傳過的檔案可以在「知識庫」中查看哦",
+    "viewMore": "查看更多"
+  },
   "messageAction": {
     "delAndRegenerate": "刪除並重新生成",
     "regenerate": "重新生成"
@@ -43,6 +61,15 @@
   "newAgent": "新建助手",
   "pin": "置頂",
   "pinOff": "取消置頂",
+  "rag": {
+    "referenceChunks": "引用來源",
+    "userQuery": {
+      "actions": {
+        "delete": "刪除 Query 重寫",
+        "regenerate": "重新生成 Query"
+      }
+    }
+  },
   "regenerate": "重新生成",
   "roleAndArchive": "角色與記錄",
   "searchAgentPlaceholder": "搜索助手和對話...",
@@ -129,8 +156,24 @@
   },
   "updateAgent": "更新助理信息",
   "upload": {
-    "actionFiletip": "上傳文件",
-    "actionTooltip": "上傳圖片",
-    "disabled": "當前模型不支援視覺識別，請切換模型後使用"
+    "action": {
+      "fileUpload": "上傳檔案",
+      "folderUpload": "上傳資料夾",
+      "imageDisabled": "當前模型不支援視覺識別，請切換模型後使用",
+      "imageUpload": "上傳圖片",
+      "tooltip": "上傳"
+    },
+    "clientMode": {
+      "actionFiletip": "上傳檔案",
+      "actionTooltip": "上傳",
+      "disabled": "當前模型不支援視覺識別和檔案分析，請切換模型後使用"
+    },
+    "preview": {
+      "prepareTasks": "準備分塊...",
+      "status": {
+        "pending": "準備上傳...",
+        "processing": "檔案處理中..."
+      }
+    }
   }
 }

package/locales/zh-TW/common.json

@@ -13,6 +13,7 @@
   "autoGenerate": "自動生成",
   "autoGenerateTooltip": "基於提示詞自動生成助手描述",
   "autoGenerateTooltipDisabled": "請填寫提示詞後使用自動補全功能",
+  "back": "返回",
   "batchDelete": "批次刪除",
   "blog": "產品部落格",
   "cancel": "取消",

package/locales/zh-TW/components.json

@@ -50,6 +50,8 @@
     "chunks": {
       "embeddingStatus": {
         "empty": "文本塊尚未完全向量化，將導致語義檢索功能不可用，為提升檢索質量，請對文本塊向量化",
+        "error": "向量化失敗",
+        "errorResult": "向量化失敗，請檢查後重試。失敗原因：",
         "processing": "文本塊正在向量化，請耐心等待",
         "success": "當前文本塊均已向量化"
       },

package/locales/zh-TW/error.json

@@ -115,6 +115,7 @@
   },
   "upload": {
     "desc": "詳情: {{detail}}",
+    "fileOnlySupportInServerMode": "當前部署模式不支持上傳非圖片文件，如需上傳 {{ext}} 格式，請切換到伺服器端資料庫部署或使用 LobeChat Cloud 服務",
     "title": "檔案上傳失敗，請檢查網路連線或稍後再試"
   }
 }

package/locales/zh-TW/file.json

@@ -0,0 +1,91 @@
+{
+  "desc": "管理你的文件與知識庫",
+  "detail": {
+    "basic": {
+      "createdAt": "創建時間",
+      "filename": "檔案名稱",
+      "size": "檔案大小",
+      "title": "基本資訊",
+      "type": "格式",
+      "updatedAt": "更新時間"
+    },
+    "data": {
+      "chunkCount": "分塊數",
+      "embedding": {
+        "default": "暫未向量化",
+        "error": "失敗",
+        "pending": "待啟動",
+        "processing": "進行中",
+        "success": "已完成"
+      },
+      "embeddingStatus": "向量化"
+    }
+  },
+  "header": {
+    "actions": {
+      "newFolder": "新建資料夾",
+      "uploadFile": "上傳檔案",
+      "uploadFolder": "上傳資料夾"
+    },
+    "uploadButton": "上傳"
+  },
+  "knowledgeBase": {
+    "list": {
+      "confirmRemoveKnowledgeBase": "即將刪除該知識庫，其中的檔案不會刪除，將移入全部檔案中。知識庫刪除後將不可恢復，請謹慎操作。",
+      "empty": "點擊 <1>+</1> 開始創建知識庫"
+    },
+    "new": "新建知識庫",
+    "title": "知識庫"
+  },
+  "notSupportGuide": {
+    "desc": "當前部署實例為客戶端資料庫模式，無法使用檔案管理功能。請切換到<1>伺服器端資料庫部署模式</1>，或直接使用 <3>LobeChat Cloud</3>",
+    "features": {
+      "allKind": {
+        "desc": "支持主流檔案類型，包括 Word、PPT、Excel、PDF、TXT 等常見文檔格式，以及JS、Python 等主流程式碼檔案",
+        "title": "多種檔案類型解析"
+      },
+      "embeddings": {
+        "desc": "使用高性能向量模型，對文本分塊進行向量化，實現檔案內容的語義化檢索",
+        "title": "向量語義化"
+      },
+      "repos": {
+        "desc": "支持創建知識庫，並允許添加不同類型的檔案，構建屬於你的領域知識",
+        "title": "知識庫"
+      }
+    },
+    "title": "當前部署模式不支持檔案管理"
+  },
+  "preview": {
+    "unsupportedFile": "此檔案格式不支持在線預覽"
+  },
+  "searchFilePlaceholder": "搜索檔案",
+  "tab": {
+    "all": "全部檔案",
+    "audios": "語音",
+    "documents": "文檔",
+    "images": "圖片",
+    "videos": "視頻",
+    "websites": "網頁"
+  },
+  "title": "檔案",
+  "uploadDock": {
+    "body": {
+      "collapse": "收起",
+      "item": {
+        "done": "已上傳",
+        "error": "上傳失敗，請重試",
+        "pending": "準備上傳...",
+        "processing": "檔案處理中...",
+        "restTime": "剩餘 {{time}}"
+      }
+    },
+    "totalCount": "共 {{count}} 項",
+    "uploadStatus": {
+      "error": "上傳出錯",
+      "pending": "等待上傳",
+      "processing": "正在上傳",
+      "success": "上傳完成",
+      "uploading": "正在上傳"
+    }
+  }
+}

package/locales/zh-TW/knowledgeBase.json

@@ -0,0 +1,31 @@
+{
+  "addToKnowledgeBase": {
+    "addSuccess": "文件添加成功，<1>立即查看</1>",
+    "confirm": "添加",
+    "id": {
+      "placeholder": "請選擇要添加的知識庫",
+      "required": "請選擇知識庫",
+      "title": "目標知識庫"
+    },
+    "title": "添加到知識庫",
+    "totalFiles": "已選擇 {{count}} 個文件"
+  },
+  "createNew": {
+    "confirm": "新建",
+    "description": {
+      "placeholder": "知識庫簡介（選填）"
+    },
+    "formTitle": "基本信息",
+    "name": {
+      "placeholder": "知識庫名稱",
+      "required": "請填寫知識庫名稱"
+    },
+    "title": "新建知識庫"
+  },
+  "tab": {
+    "files": "文檔",
+    "settings": "設置",
+    "testing": "召回測試"
+  },
+  "title": "知識庫"
+}

package/locales/zh-TW/portal.json

@@ -6,5 +6,6 @@
     "summaryTooltip": "總結目前內容"
   },
   "emptyArtifactList": "當前文物列表為空，請在會話中按需使用插件後再查看",
+  "files": "檔案",
   "title": "擴展視窗"
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lobehub/chat",
-  "version": "1.11.8",
+  "version": "1.12.0",
   "description": "Lobe Chat - an open-source, high-performance chatbot framework that supports speech synthesis, multimodal, and extensible Function Call plugin system. Supports one-click free deployment of your private ChatGPT/LLM web application.",
   "keywords": [
     "framework",
@@ -53,7 +53,8 @@
     "pull": "git pull",
     "release": "semantic-release",
     "self-hosting:docker": "docker build -t lobe-chat:local .",
-    "self-hosting:docker-cn": "docker build -t lobe-chat:local --build-arg USE_CN_MIRROR=true .",
+    "self-hosting:docker-cn": "docker build -t lobe-chat-local --build-arg USE_CN_MIRROR=true .",
+    "self-hosting:docker-cn@database": "docker build -t lobe-chat-database-local -f Dockerfile.database --build-arg USE_CN_MIRROR=true .",
     "start": "next start -p 3210",
     "stylelint": "stylelint \"src/**/*.{js,jsx,ts,tsx}\" --fix",
     "test": "npm run test-app && npm run test-server",

package/scripts/migrateServerDB/docker.cjs

@@ -2,6 +2,7 @@ const { join } = require('node:path');
 const { Pool } = require('pg');
 const { drizzle } = require('drizzle-orm/node-postgres');
 const migrator = require('drizzle-orm/node-postgres/migrator');
+const { PGVECTOR_HINT } = require('./errorHint');
 
 if (!process.env.DATABASE_URL) {
   throw new Error('DATABASE_URL is not set, please set it in your environment variables.');
@@ -29,6 +30,11 @@ runMigrations().catch((err) => {
     '❌ Database migrate failed. Please check your database is valid and DATABASE_URL is set correctly. The error detail is below:',
   );
   console.error(err);
+
+  if (err.message.includes('extension "vector" is not available')) {
+    console.info(PGVECTOR_HINT);
+  }
+
   // eslint-disable-next-line unicorn/no-process-exit
   process.exit(1);
 });

package/scripts/migrateServerDB/errorHint.js

@@ -0,0 +1,17 @@
+const PGVECTOR_HINT = `⚠️ Database migrate failed due to \`pgvector\` extension not found. Please install the \`pgvector\` extension on your postgres instance.
+
+1) if you are using docker postgres image:
+you can just use \`pgvector/pgvector:pg16\` image instead of \`postgres\`, e.g:
+
+\`\`\`
+docker run -p 5432:5432 -d --name pg -e POSTGRES_PASSWORD=mysecretpassword pgvector/pgvector:pg16
+\`\`\`
+
+2) if you are using cloud postgres instance, please contact your cloud provider for help.
+
+if you have any other question, please open issue here: https://github.com/lobehub/lobe-chat/issues
+`;
+
+module.exports = {
+  PGVECTOR_HINT,
+};

package/scripts/migrateServerDB/index.ts

@@ -3,6 +3,7 @@ import * as migrator from 'drizzle-orm/neon-serverless/migrator';
 import { join } from 'node:path';
 
 import { serverDB } from '../../src/database/server/core/db';
+import { PGVECTOR_HINT } from './errorHint';
 
 // Read the `.env` file if it exists, or a file specified by the
 // dotenv_config_path parameter that's passed to Node.js
@@ -24,6 +25,11 @@ if (connectionString) {
   // eslint-disable-next-line unicorn/prefer-top-level-await
   runMigrations().catch((err) => {
     console.error('❌ Database migrate failed:', err);
+
+    if ((err.message as string).includes('extension "vector" is not available')) {
+      console.info(PGVECTOR_HINT);
+    }
+
     // eslint-disable-next-line unicorn/no-process-exit
     process.exit(1);
   });

package/src/app/(main)/chat/(workspace)/@conversation/features/ChatInput/Desktop/FilePreview/FileItem/Content.tsx

@@ -0,0 +1,37 @@
+import { Image } from '@lobehub/ui';
+import { createStyles } from 'antd-style';
+import { memo } from 'react';
+
+import FileIcon from '@/components/FileIcon';
+import { UploadFileItem } from '@/types/files/upload';
+
+const useStyles = createStyles(({ css }) => ({
+  image: css`
+    margin-block: 0 !important;
+    box-shadow: none;
+
+    img {
+      object-fit: contain;
+    }
+  `,
+  video: css`
+    overflow: hidden;
+    border-radius: 8px;
+  `,
+}));
+
+const Content = memo<UploadFileItem>(({ file, previewUrl }) => {
+  const { styles } = useStyles();
+
+  if (file.type.startsWith('image')) {
+    return <Image alt={file.name} src={previewUrl} wrapperClassName={styles.image} />;
+  }
+
+  if (file.type.startsWith('video')) {
+    return <video className={styles.video} src={previewUrl} width={'100%'} />;
+  }
+
+  return <FileIcon fileName={file.name} fileType={file.type} size={100} />;
+});
+
+export default Content;

package/src/app/(main)/chat/(workspace)/@conversation/features/ChatInput/Desktop/FilePreview/FileItem/index.tsx

@@ -0,0 +1,87 @@
+import { ActionIcon } from '@lobehub/ui';
+import { Typography } from 'antd';
+import { createStyles } from 'antd-style';
+import { Trash2Icon } from 'lucide-react';
+import { memo } from 'react';
+import { useTranslation } from 'react-i18next';
+import { Center, Flexbox } from 'react-layout-kit';
+
+import { useFileStore } from '@/store/file';
+import { UploadFileItem } from '@/types/files/upload';
+
+import UploadDetail from '../../../components/UploadDetail';
+import Content from './Content';
+import { FILE_ITEM_SIZE } from './style';
+
+const useStyles = createStyles(({ css, token }) => ({
+  actions: css`
+    position: absolute;
+    z-index: 10;
+    inset-block-start: -4px;
+    inset-inline-end: -4px;
+
+    background: ${token.colorBgElevated};
+    border-radius: 5px;
+    box-shadow:
+      0 0 0 0.5px ${token.colorFillSecondary} inset,
+      ${token.boxShadowTertiary};
+  `,
+  container: css`
+    position: relative;
+
+    width: ${FILE_ITEM_SIZE}px;
+    min-width: ${FILE_ITEM_SIZE}px;
+    height: ${FILE_ITEM_SIZE}px;
+
+    background: ${token.colorBgContainer};
+    border-radius: 8px;
+  `,
+  image: css`
+    margin-block: 0 !important;
+  `,
+  status: css`
+    &.ant-tag {
+      padding-inline: 0;
+      background: none;
+    }
+  `,
+}));
+
+type FileItemProps = UploadFileItem;
+
+const spacing = 8;
+
+const FileItem = memo<FileItemProps>((props) => {
+  const { file, uploadState, status, id, tasks } = props;
+  const { t } = useTranslation(['chat', 'common']);
+  const { styles } = useStyles();
+  const [removeChatUploadFile] = useFileStore((s) => [s.removeChatUploadFile]);
+
+  return (
+    <Flexbox className={styles.container} distribution={'space-between'}>
+      <Center flex={1} height={FILE_ITEM_SIZE - 46} padding={spacing}>
+        <Content {...props} />
+      </Center>
+      <Flexbox gap={4} style={{ paddingBottom: 4, paddingInline: spacing }}>
+        <Typography.Text ellipsis={{ tooltip: true }} style={{ fontSize: 12 }}>
+          {file.name}
+        </Typography.Text>
+
+        <UploadDetail size={file.size} status={status} tasks={tasks} uploadState={uploadState} />
+      </Flexbox>
+      <Flexbox className={styles.actions}>
+        <ActionIcon
+          color={'red'}
+          icon={Trash2Icon}
+          onClick={() => {
+            removeChatUploadFile(id);
+          }}
+          size={'small'}
+          title={t('delete', { ns: 'common' })}
+        />
+      </Flexbox>
+    </Flexbox>
+  );
+});
+
+export default FileItem;

package/src/app/(main)/chat/(workspace)/@conversation/features/ChatInput/Desktop/FilePreview/FileItem/style.ts

@@ -0,0 +1,4 @@
+export const FILE_ITEM_SIZE = 200;
+
+// 8px on each side
+export const IMAGE_FILE_SIZE = 200 - 2 * 8;

package/src/app/(main)/chat/(workspace)/@conversation/features/ChatInput/Desktop/FilePreview/FileItem/utils.ts

@@ -0,0 +1,28 @@
+export const getHarmoniousSize = (
+  inputWidth: number,
+  inputHeight: number,
+  {
+    spacing = 24,
+    containerWidth,
+    containerHeight,
+  }: { containerHeight: number; containerWidth: number; spacing: number },
+) => {
+  let width = String(inputWidth);
+  let height = String(inputHeight);
+
+  const maxWidth = containerWidth - spacing;
+  const maxHeight = containerHeight - spacing;
+
+  if (inputHeight >= inputWidth && inputHeight >= maxHeight) {
+    height = maxHeight + 'px';
+    width = 'auto';
+  } else if (inputWidth >= inputHeight && inputWidth >= maxWidth) {
+    height = 'auto';
+    width = maxWidth + 'px';
+  } else {
+    width = width + 'px';
+    height = height + 'px';
+  }
+
+  return { height, width };
+};

package/src/app/(main)/chat/(workspace)/@conversation/features/ChatInput/Desktop/FilePreview/FileList.tsx

@@ -0,0 +1,41 @@
+import { createStyles } from 'antd-style';
+import { lighten } from 'polished';
+import { memo } from 'react';
+import { Flexbox } from 'react-layout-kit';
+
+import { fileChatSelectors, useFileStore } from '@/store/file';
+
+import FileItem from './FileItem';
+
+const useStyles = createStyles(({ css, token }) => ({
+  container: css`
+    overflow-x: scroll;
+
+    width: 100%;
+
+    background: ${lighten(0.01, token.colorBgLayout)};
+    border-start-start-radius: 8px;
+    border-start-end-radius: 8px;
+  `,
+}));
+
+const FileList = memo(() => {
+  const inputFilesList = useFileStore(fileChatSelectors.chatUploadFileList);
+  const showFileList = useFileStore(fileChatSelectors.chatUploadFileListHasItem);
+  const { styles } = useStyles();
+
+  return (
+    <Flexbox
+      className={styles.container}
+      gap={6}
+      horizontal
+      padding={showFileList ? '16px 16px 12px' : 0}
+    >
+      {inputFilesList.map((item) => (
+        <FileItem key={item.id} {...item} />
+      ))}
+    </Flexbox>
+  );
+});
+
+export default FileList;

package/src/app/(main)/chat/(workspace)/@conversation/features/ChatInput/Desktop/FilePreview/index.tsx

@@ -0,0 +1,40 @@
+import { memo } from 'react';
+
+import DragUpload from '@/components/DragUpload';
+import { useAgentStore } from '@/store/agent';
+import { agentSelectors } from '@/store/agent/slices/chat';
+import { useFileStore } from '@/store/file';
+import { useUserStore } from '@/store/user';
+import { modelProviderSelectors } from '@/store/user/selectors';
+
+import FileItemList from './FileList';
+
+const FilePreview = memo(() => {
+  const model = useAgentStore(agentSelectors.currentAgentModel);
+
+  const canUploadImage = useUserStore(modelProviderSelectors.isModelEnabledUpload(model));
+
+  const [uploadFiles] = useFileStore((s) => [s.uploadChatFiles]);
+
+  const upload = async (fileList: FileList | File[] | undefined) => {
+    if (!fileList || fileList.length === 0) return;
+
+    // Filter out files that are not images if the model does not support image uploads
+    const files = Array.from(fileList).filter((file) => {
+      if (canUploadImage) return true;
+
+      return !file.type.startsWith('image');
+    });
+
+    uploadFiles(files);
+  };
+
+  return (
+    <>
+      <DragUpload onUploadFiles={upload} />
+      <FileItemList />
+    </>
+  );
+});
+
+export default FilePreview;

package/src/app/(main)/chat/(workspace)/@conversation/features/ChatInput/Desktop/Footer/SendMore.tsx

@@ -40,7 +40,7 @@ const SendMore = memo<SendMoreProps>(({ disabled, isMac }) => {
   ]);
   const addAIMessage = useChatStore((s) => s.addAIMessage);
 
-  const sendMessage = useSendMessage();
+  const { send: sendMessage } = useSendMessage();
 
   const hotKey = [ALT_KEY, 'enter'].join('+');
   useHotkeys(

package/src/app/(main)/chat/(workspace)/@conversation/features/ChatInput/Desktop/Footer/index.tsx

@@ -11,13 +11,12 @@ import StopLoadingIcon from '@/components/StopLoading';
 import SaveTopic from '@/features/ChatInput/Topic';
 import { useSendMessage } from '@/features/ChatInput/useSend';
 import { useChatStore } from '@/store/chat';
-import { chatSelectors, topicSelectors } from '@/store/chat/selectors';
-import { filesSelectors, useFileStore } from '@/store/file';
+import { chatSelectors } from '@/store/chat/selectors';
 import { useUserStore } from '@/store/user';
 import { preferenceSelectors } from '@/store/user/selectors';
 import { isMacOS } from '@/utils/platform';
 
-import LocalFiles from '../LocalFiles';
+import LocalFiles from '../FilePreview';
 import SendMore from './SendMore';
 
 const useStyles = createStyles(({ css, prefixCls, token }) => {
@@ -57,25 +56,14 @@ const Footer = memo<FooterProps>(({ setExpand, expand }) => {
 
   const { theme, styles } = useStyles();
 
-  const [
-    isAIGenerating,
-    isHasMessageLoading,
-    isCreatingMessage,
-    isCreatingTopic,
-    stopGenerateMessage,
-  ] = useChatStore((s) => [
+  const [isAIGenerating, stopGenerateMessage] = useChatStore((s) => [
     chatSelectors.isAIGenerating(s),
-    chatSelectors.isHasMessageLoading(s),
-    chatSelectors.isCreatingMessage(s),
-    topicSelectors.isCreatingTopic(s),
     s.stopGenerateMessage,
   ]);
 
-  const isImageUploading = useFileStore(filesSelectors.isImageUploading);
-
   const [useCmdEnterToSend] = useUserStore((s) => [preferenceSelectors.useCmdEnterToSend(s)]);
 
-  const sendMessage = useSendMessage();
+  const { send: sendMessage, canSend } = useSendMessage();
 
   const [isMac, setIsMac] = useState<boolean>();
   useEffect(() => {
@@ -105,9 +93,6 @@ const Footer = memo<FooterProps>(({ setExpand, expand }) => {
 
   const wrapperShortcut = useCmdEnterToSend ? enter : cmdEnter;
 
-  const buttonDisabled =
-    isImageUploading || isHasMessageLoading || isCreatingTopic || isCreatingMessage;
-
   return (
     <Flexbox
       align={'end'}
@@ -146,8 +131,8 @@ const Footer = memo<FooterProps>(({ setExpand, expand }) => {
           ) : (
             <Space.Compact>
               <Button
-                disabled={buttonDisabled}
-                loading={buttonDisabled}
+                disabled={!canSend}
+                loading={!canSend}
                 onClick={() => {
                   sendMessage();
                   setExpand?.(false);
@@ -156,7 +141,7 @@ const Footer = memo<FooterProps>(({ setExpand, expand }) => {
               >
                 {t('input.send')}
               </Button>
-              <SendMore disabled={buttonDisabled} isMac={isMac} />
+              <SendMore disabled={!canSend} isMac={isMac} />
             </Space.Compact>
           )}
         </Flexbox>