@lobehub/chat 1.107.5 → 1.108.0

package/.env.example

@@ -140,6 +140,11 @@ OPENAI_API_KEY=sk-xxxxxxxxx
 
 # INFINIAI_API_KEY=sk-xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
 
+
+### 302.AI ###
+
+# AI302_API_KEY=sk-xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
+
 ### ModelScope ###
 
 # MODELSCOPE_API_KEY=sk-xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx

package/CHANGELOG.md

@@ -2,6 +2,56 @@
 
 # Changelog
 
+## [Version 1.108.0](https://github.com/lobehub/lobe-chat/compare/v1.107.6...v1.108.0)
+
+<sup>Released on **2025-08-05**</sup>
+
+#### ✨ Features
+
+- **misc**: Support 302ai provider.
+
+<br/>
+
+<details>
+<summary><kbd>Improvements and Fixes</kbd></summary>
+
+#### What's improved
+
+- **misc**: Support 302ai provider, closes [#8362](https://github.com/lobehub/lobe-chat/issues/8362) ([e172055](https://github.com/lobehub/lobe-chat/commit/e172055))
+
+</details>
+
+<div align="right">
+
+[![](https://img.shields.io/badge/-BACK_TO_TOP-151515?style=flat-square)](#readme-top)
+
+</div>
+
+### [Version 1.107.6](https://github.com/lobehub/lobe-chat/compare/v1.107.5...v1.107.6)
+
+<sup>Released on **2025-08-05**</sup>
+
+#### 🐛 Bug Fixes
+
+- **misc**: Break line for Gemini Artifacts.
+
+<br/>
+
+<details>
+<summary><kbd>Improvements and Fixes</kbd></summary>
+
+#### What's fixed
+
+- **misc**: Break line for Gemini Artifacts, closes [#8627](https://github.com/lobehub/lobe-chat/issues/8627) ([65609dd](https://github.com/lobehub/lobe-chat/commit/65609dd))
+
+</details>
+
+<div align="right">
+
+[![](https://img.shields.io/badge/-BACK_TO_TOP-151515?style=flat-square)](#readme-top)
+
+</div>
+
 ### [Version 1.107.5](https://github.com/lobehub/lobe-chat/compare/v1.107.4...v1.107.5)
 
 <sup>Released on **2025-08-04**</sup>

package/Dockerfile

@@ -248,6 +248,8 @@ ENV \
     TENCENT_CLOUD_API_KEY="" TENCENT_CLOUD_MODEL_LIST="" \
     # Infini-AI
     INFINIAI_API_KEY="" INFINIAI_MODEL_LIST=""
+    # 302.AI
+    AI302_API_KEY="" AI302_MODEL_LIST=""
 
 USER nextjs
 

package/Dockerfile.database

@@ -289,7 +289,9 @@ ENV \
     # Tencent Cloud
     TENCENT_CLOUD_API_KEY="" TENCENT_CLOUD_MODEL_LIST="" \
     # Infini-AI
-    INFINIAI_API_KEY="" INFINIAI_MODEL_LIST=""
+    INFINIAI_API_KEY="" INFINIAI_MODEL_LIST="" \
+    # 302.AI
+    AI302_API_KEY="" AI302_MODEL_LIST=""
 
 USER nextjs
 

package/Dockerfile.pglite

@@ -245,7 +245,9 @@ ENV \
     # Tencent Cloud
     TENCENT_CLOUD_API_KEY="" TENCENT_CLOUD_MODEL_LIST="" \
     # Infini-AI
-    INFINIAI_API_KEY="" INFINIAI_MODEL_LIST=""
+    INFINIAI_API_KEY="" INFINIAI_MODEL_LIST="" \
+    # 302.AI
+    AI302_API_KEY="" AI302_MODEL_LIST=""
 
 USER nextjs
 

package/changelog/v1.json

@@ -1,4 +1,22 @@
 [
+  {
+    "children": {
+      "features": [
+        "Support 302ai provider."
+      ]
+    },
+    "date": "2025-08-05",
+    "version": "1.108.0"
+  },
+  {
+    "children": {
+      "fixes": [
+        "Break line for Gemini Artifacts."
+      ]
+    },
+    "date": "2025-08-05",
+    "version": "1.107.6"
+  },
   {
     "children": {
       "improvements": [

package/docs/usage/providers/ai302.mdx

@@ -0,0 +1,45 @@
+---
+title: Using 302.AI in LobeChat
+description: Learn how to configure and use 302.AI's API Key in LobeChat to start conversations and interactions.
+tags:
+  - LobeChat
+  - 302.AI
+  - API Key
+  - Web UI
+---
+
+# Using 302.AI in LobeChat
+
+<Image cover src={'https://file.302.ai/gpt/imgs/20250722/c7a6ee9959a8490fa00481dae0fbb339.jpg'} />
+
+[302.AI](https://www.302.ai/) is a pay-as-you-go AI application platform that provides the most comprehensive AI APIs and AI online applications on the market.
+
+This article will guide you on how to use 302.AI in LobeChat.
+
+<Steps>
+  ### Step 1: Obtain [302.AI](https://www.302.ai/) API Key
+
+  - Click `Get Started`, register and log in to [302.AI](https://www.302.ai/)
+  - Click `API Keys` on the left side
+  - Click `Add API KEY`, copy and save the generated API key
+
+  <Image alt={'Get API Key'} inStep src={'https://file.302.ai/gpt/imgs/20250722/7a3597061d9a484ca7358867930a8316.jpg'} />
+
+  ### Step 2: Configure 302.AI in LobeChat
+
+  - Access LobeChat's `Settings` interface
+  - Find the `302.AI` configuration item under `Language Models`
+
+  <Image alt={'Enter API Key'} inStep src={'https://file.302.ai/gpt/imgs/20250722/b056ca4e63374668b7e3e093726fa6f0.jpg'} />
+
+  - Enter the obtained API key
+  - Select a 302.AI model for your AI assistant to start conversations
+
+  <Image alt={'Select 302.AI model and start conversation'} inStep src={'https://file.302.ai/gpt/imgs/20250722/c7a6ee9959a8490fa00481dae0fbb339.jpg'} />
+
+  <Callout type={'warning'}>
+    During usage, you may need to pay the API service provider. Please refer to 302.AI's relevant pricing policy.
+  </Callout>
+</Steps>
+
+Now you can use 302.AI's models for conversations in LobeChat.

package/docs/usage/providers/ai302.zh-CN.mdx

@@ -0,0 +1,45 @@
+---
+title: 在 LobeChat 中使用 302.AI
+description: 学习如何在 LobeChat 中配置和使用 302.AI 的API Key，以便开始对话和交互。
+tags:
+  - LobeChat
+  - 302.AI
+  - API密钥
+  - Web UI
+---
+
+# 在 LobeChat 中使用 302.AI
+
+<Image cover src={'https://file.302.ai/gpt/imgs/20250722/d346c796faa4443eb0bd4218f84205f6.jpg'} />
+
+[302.AI](https://www.302.ai/) 是一个按需付费的 AI 应用平台，提供市面上最全的 AI API 和 AI 在线应用。
+
+本文将指导你如何在 LobeChat 中使用 302.AI。
+
+<Steps>
+  ### 步骤一：获得 [302.AI](https://www.302.ai/) 的 API Key
+
+  - 点击 `开始使用`，注册并登录 [302.AI](https://www.302.ai/)
+  - 点击左侧的 `API Keys`
+  - 点击 `添加API KEY`，复制并保存生成的 API 密钥
+
+  <Image alt={'获取 API 密钥'} inStep src={'https://file.302.ai/gpt/imgs/20250722/01abd69fd61540489781fd963e504a04.jpg'} />
+
+  ### 步骤二：在 LobeChat 中配置 302.AI
+
+  - 访问 LobeChat 的`设置`界面
+  - 在`语言模型`下找到 `302.AI` 的设置项
+
+  <Image alt={'填入 API 密钥'} inStep src={'https://file.302.ai/gpt/imgs/20250722/5247463e74c742f79bef416bbb0722bf.jpg'} />
+
+  - 填入获得的 API 密钥
+  - 为你的 AI 助手选择一个 302.AI 的模型即可开始对话
+
+  <Image alt={'选择 302.AI 模型并开始对话'} inStep src={'https://file.302.ai/gpt/imgs/20250722/d346c796faa4443eb0bd4218f84205f6.jpg'} />
+
+  <Callout type={'warning'}>
+    在使用过程中你可能需要向 API 服务提供商付费，请参考 302.AI 的相关费用政策。
+  </Callout>
+</Steps>
+
+至此你已经可以在 LobeChat 中使用 302.AI 提供的模型进行对话了。

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lobehub/chat",
-  "version": "1.107.5",
+  "version": "1.108.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",

package/packages/types/src/user/settings/keyVaults.ts

@@ -38,6 +38,7 @@ export interface SearchEngineKeyVaults {
 
 export interface UserKeyVaults extends SearchEngineKeyVaults {
   ai21?: OpenAICompatibleKeyVault;
+  ai302?: OpenAICompatibleKeyVault;
   ai360?: OpenAICompatibleKeyVault;
   aihubmix?: OpenAICompatibleKeyVault;
   anthropic?: OpenAICompatibleKeyVault;

package/src/app/[variants]/(main)/settings/llm/ProviderList/providers.tsx

@@ -2,6 +2,7 @@ import { useMemo } from 'react';
 
 import {
   Ai21ProviderCard,
+  Ai302ProviderCard,
   Ai360ProviderCard,
   AnthropicProviderCard,
   BaichuanProviderCard,
@@ -112,6 +113,7 @@ export const useProviderList = (): ProviderItem[] => {
       GiteeAIProviderCard,
       PPIOProviderCard,
       InfiniAIProviderCard,
+      Ai302ProviderCard,
     ],
     [
       AzureProvider,

package/src/config/aiModels/ai302.ts

@@ -0,0 +1,148 @@
+import { AIChatModelCard } from '@/types/aiModel';
+
+const ai302ChatModels: AIChatModelCard[] = [
+  {
+    contextWindowTokens: 32_000,
+    displayName: 'deepseek-chat',
+    enabled: true,
+    id: 'deepseek-chat',
+    type: 'chat',
+  },
+  {
+    contextWindowTokens: 128_000,
+    displayName: 'chatgpt-4o-latest',
+    enabled: true,
+    id: 'chatgpt-4o-latest',
+    type: 'chat',
+  },
+  {
+    contextWindowTokens: 128_000,
+    displayName: 'llama3.3-70b',
+    enabled: true,
+    id: 'llama3.3-70b',
+    type: 'chat',
+  },
+  {
+    contextWindowTokens: 64_000,
+    displayName: 'deepseek-reasoner',
+    enabled: true,
+    id: 'deepseek-reasoner',
+    type: 'chat',
+  },
+  {
+    contextWindowTokens: 1_000_000,
+    displayName: 'gemini-2.0-flash',
+    enabled: true,
+    id: 'gemini-2.0-flash',
+    type: 'chat',
+  },
+  {
+    contextWindowTokens: 200_000,
+    displayName: 'claude-3-7-sonnet-20250219',
+    enabled: true,
+    id: 'claude-3-7-sonnet-20250219',
+    type: 'chat',
+  },
+  {
+    contextWindowTokens: 200_000,
+    displayName: 'claude-3-7-sonnet-latest',
+    enabled: true,
+    id: 'claude-3-7-sonnet-latest',
+    type: 'chat',
+  },
+  {
+    contextWindowTokens: 131_072,
+    displayName: 'grok-3-beta',
+    enabled: true,
+    id: 'grok-3-beta',
+    type: 'chat',
+  },
+  {
+    contextWindowTokens: 131_072,
+    displayName: 'grok-3-mini-beta',
+    enabled: true,
+    id: 'grok-3-mini-beta',
+    type: 'chat',
+  },
+  {
+    contextWindowTokens: 1_000_000,
+    displayName: 'gpt-4.1',
+    enabled: true,
+    id: 'gpt-4.1',
+    type: 'chat',
+  },
+  {
+    contextWindowTokens: 200_000,
+    displayName: 'o3',
+    enabled: true,
+    id: 'o3',
+    type: 'chat',
+  },
+  {
+    contextWindowTokens: 200_000,
+    displayName: 'o4-mini',
+    enabled: true,
+    id: 'o4-mini',
+    type: 'chat',
+  },
+  {
+    contextWindowTokens: 128_000,
+    displayName: 'qwen3-235b-a22b',
+    enabled: true,
+    id: 'qwen3-235b-a22b',
+    type: 'chat',
+  },
+  {
+    contextWindowTokens: 128_000,
+    displayName: 'qwen3-32b',
+    enabled: true,
+    id: 'qwen3-32b',
+    type: 'chat',
+  },
+  {
+    contextWindowTokens: 1_000_000,
+    displayName: 'gemini-2.5-pro-preview-05-06',
+    enabled: true,
+    id: 'gemini-2.5-pro-preview-05-06',
+    type: 'chat',
+  },
+  {
+    contextWindowTokens: 128_000,
+    displayName: 'llama-4-maverick',
+    enabled: true,
+    id: 'llama-4-maverick',
+    type: 'chat',
+  },
+  {
+    contextWindowTokens: 1_000_000,
+    displayName: 'gemini-2.5-flash',
+    enabled: true,
+    id: 'gemini-2.5-flash',
+    type: 'chat',
+  },
+  {
+    contextWindowTokens: 200_000,
+    displayName: 'claude-sonnet-4-20250514',
+    enabled: true,
+    id: 'claude-sonnet-4-20250514',
+    type: 'chat',
+  },
+  {
+    contextWindowTokens: 200_000,
+    displayName: 'claude-opus-4-20250514',
+    enabled: true,
+    id: 'claude-opus-4-20250514',
+    type: 'chat',
+  },
+  {
+    contextWindowTokens: 1_000_000,
+    displayName: 'gemini-2.5-pro',
+    enabled: true,
+    id: 'gemini-2.5-pro',
+    type: 'chat',
+  },
+];
+
+export const allModels = [...ai302ChatModels];
+
+export default allModels;

package/src/config/aiModels/index.ts

@@ -1,6 +1,7 @@
 import { AiFullModelCard, LobeDefaultAiModelListItem } from '@/types/aiModel';
 
 import { default as ai21 } from './ai21';
+import { default as ai302 } from './ai302';
 import { default as ai360 } from './ai360';
 import { default as aihubmix } from './aihubmix';
 import { default as anthropic } from './anthropic';
@@ -78,6 +79,7 @@ const buildDefaultModelList = (map: ModelsMap): LobeDefaultAiModelListItem[] =>
 
 export const LOBE_DEFAULT_MODEL_LIST = buildDefaultModelList({
   ai21,
+  ai302,
   ai360,
   aihubmix,
   anthropic,
@@ -136,6 +138,7 @@ export const LOBE_DEFAULT_MODEL_LIST = buildDefaultModelList({
 });
 
 export { default as ai21 } from './ai21';
+export { default as ai302 } from './ai302';
 export { default as ai360 } from './ai360';
 export { default as aihubmix } from './aihubmix';
 export { default as anthropic } from './anthropic';

package/src/config/llm.ts

@@ -172,6 +172,10 @@ export const getLLMConfig = () => {
       ENABLED_V0: z.boolean(),
       V0_API_KEY: z.string().optional(),
 
+
+      ENABLED_AI302: z.boolean(),
+      AI302_API_KEY: z.string().optional(),
+
       ENABLED_AIHUBMIX: z.boolean(),
       AIHUBMIX_API_KEY: z.string().optional(),
     },
@@ -344,6 +348,9 @@ export const getLLMConfig = () => {
       ENABLED_V0: !!process.env.V0_API_KEY,
       V0_API_KEY: process.env.V0_API_KEY,
 
+      ENABLED_AI302: !!process.env.AI302_API_KEY,
+      AI302_API_KEY: process.env.AI302_API_KEY,
+
       ENABLED_AIHUBMIX: !!process.env.AIHUBMIX_API_KEY,
       AIHUBMIX_API_KEY: process.env.AIHUBMIX_API_KEY,
     },

package/src/config/modelProviders/ai302.ts

@@ -0,0 +1,149 @@
+import { ModelProviderCard } from '@/types/llm';
+
+// ref: https://302.ai/pricing/
+const Ai302: ModelProviderCard = {
+  chatModels: [
+    {
+      contextWindowTokens: 32_000,
+      displayName: 'deepseek-chat',
+      enabled: true,
+      id: 'deepseek-chat',
+    },
+    {
+      contextWindowTokens: 128_000,
+      displayName: 'gpt-4o',
+      enabled: true,
+      id: 'gpt-4o',
+    },
+    {
+      contextWindowTokens: 128_000,
+      displayName: 'chatgpt-4o-latest',
+      enabled: true,
+      id: 'chatgpt-4o-latest',
+    },
+    {
+      contextWindowTokens: 128_000,
+      displayName: 'llama3.3-70b',
+      enabled: true,
+      id: 'llama3.3-70b',
+    },
+    {
+      contextWindowTokens: 64_000,
+      displayName: 'deepseek-reasoner',
+      enabled: true,
+      id: 'deepseek-reasoner',
+    },
+    {
+      contextWindowTokens: 1_000_000,
+      displayName: 'gemini-2.0-flash',
+      enabled: true,
+      id: 'gemini-2.0-flash',
+    },
+    {
+      contextWindowTokens: 200_000,
+      displayName: 'claude-3-7-sonnet-20250219',
+      enabled: true,
+      id: 'claude-3-7-sonnet-20250219',
+    },
+    {
+      contextWindowTokens: 200_000,
+      displayName: 'claude-3-7-sonnet-latest',
+      enabled: true,
+      id: 'claude-3-7-sonnet-latest',
+    },
+    {
+      contextWindowTokens: 131_072,
+      displayName: 'grok-3-beta',
+      enabled: true,
+      id: 'grok-3-beta',
+    },
+    {
+      contextWindowTokens: 131_072,
+      displayName: 'grok-3-mini-beta',
+      enabled: true,
+      id: 'grok-3-mini-beta',
+    },
+    {
+      contextWindowTokens: 1_000_000,
+      displayName: 'gpt-4.1',
+      enabled: true,
+      id: 'gpt-4.1',
+    },
+    {
+      contextWindowTokens: 200_000,
+      displayName: 'o3',
+      enabled: true,
+      id: 'o3',
+    },
+    {
+      contextWindowTokens: 200_000,
+      displayName: 'o4-mini',
+      enabled: true,
+      id: 'o4-mini',
+    },
+    {
+      contextWindowTokens: 128_000,
+      displayName: 'qwen3-235b-a22b',
+      enabled: true,
+      id: 'qwen3-235b-a22b',
+    },
+    {
+      contextWindowTokens: 128_000,
+      displayName: 'qwen3-32b',
+      enabled: true,
+      id: 'qwen3-32b',
+    },
+    {
+      contextWindowTokens: 1_000_000,
+      displayName: 'gemini-2.5-pro-preview-05-06',
+      enabled: true,
+      id: 'gemini-2.5-pro-preview-05-06',
+    },
+    {
+      contextWindowTokens: 128_000,
+      displayName: 'llama-4-maverick',
+      enabled: true,
+      id: 'llama-4-maverick',
+    },
+    {
+      contextWindowTokens: 1_000_000,
+      displayName: 'gemini-2.5-flash',
+      enabled: true,
+      id: 'gemini-2.5-flash',
+    },
+    {
+      contextWindowTokens: 200_000,
+      displayName: 'claude-sonnet-4-20250514',
+      enabled: true,
+      id: 'claude-sonnet-4-20250514',
+    },
+    {
+      contextWindowTokens: 200_000,
+      displayName: 'claude-opus-4-20250514',
+      enabled: true,
+      id: 'claude-opus-4-20250514',
+    },
+    {
+      contextWindowTokens: 1_000_000,
+      displayName: 'gemini-2.5-pro',
+      enabled: true,
+      id: 'gemini-2.5-pro',
+    },
+  ],
+  checkModel: 'gpt-4o',
+  description: '302.AI 是一个按需付费的 AI 应用平台，提供市面上最全的 AI API 和 AI 在线应用',
+  id: 'ai302',
+  modelList: { showModelFetcher: true },
+  modelsUrl: 'https://302.ai/pricing/',
+  name: '302.AI',
+  settings: {
+    proxyUrl: {
+      placeholder: 'https://api.302.ai/v1',
+    },
+    sdkType: 'openai',
+    showModelFetcher: true,
+  },
+  url: 'https://302.ai',
+};
+
+export default Ai302;

package/src/config/modelProviders/index.ts

@@ -1,6 +1,7 @@
 import { ChatModelCard, ModelProviderCard } from '@/types/llm';
 
 import Ai21Provider from './ai21';
+import Ai302Provider from './ai302';
 import Ai360Provider from './ai360';
 import AiHubMixProvider from './aihubmix';
 import AnthropicProvider from './anthropic';
@@ -169,6 +170,7 @@ export const DEFAULT_MODEL_PROVIDER_LIST = [
   Search1APIProvider,
   InfiniAIProvider,
   QiniuProvider,
+  Ai302Provider,
 ];
 
 export const filterEnabledModels = (provider: ModelProviderCard) => {
@@ -181,6 +183,7 @@ export const isProviderDisableBrowserRequest = (id: string) => {
 };
 
 export { default as Ai21ProviderCard } from './ai21';
+export { default as Ai302ProviderCard } from './ai302';
 export { default as Ai360ProviderCard } from './ai360';
 export { default as AiHubMixProviderCard } from './aihubmix';
 export { default as AnthropicProviderCard } from './anthropic';

package/src/features/Conversation/Messages/Assistant/Tool/Inspector/Debug.tsx

@@ -3,7 +3,7 @@ import { Tabs } from 'antd';
 import { memo } from 'react';
 import { useTranslation } from 'react-i18next';
 
-import PluginResult from './PluginResultJSON';
+import PluginResult from './PluginResult';
 import PluginState from './PluginState';
 
 interface DebugProps {

package/src/features/Conversation/Messages/Assistant/Tool/Inspector/{PluginResultJSON.tsx → PluginResult.tsx}

@@ -12,17 +12,22 @@ export interface FunctionMessageProps {
 const PluginResult = memo<FunctionMessageProps>(({ toolCallId, variant }) => {
   const toolMessage = useChatStore(chatSelectors.getMessageByToolCallId(toolCallId));
 
-  const data = useMemo(() => {
+  const { data, language } = useMemo(() => {
     try {
-      return JSON.stringify(JSON.parse(toolMessage?.content || ''), null, 2);
+      const parsed = JSON.parse(toolMessage?.content || '');
+      // Special case: if the parsed result is a string, it means the original content was a stringified string
+      if (typeof parsed === 'string') {
+        return { data: parsed, language: 'plaintext' }; // Return the parsed string directly, do not re-serialize
+      }
+      return { data: JSON.stringify(parsed, null, 2), language: 'json' };
     } catch {
-      return toolMessage?.content || '';
+      return { data: toolMessage?.content || '', language: 'plaintext' };
     }
   }, [toolMessage?.content]);
 
   return (
     <Highlighter
-      language={'json'}
+      language={language}
       style={{ maxHeight: 200, overflow: 'scroll', width: '100%' }}
       variant={variant}
     >

package/src/features/Conversation/Messages/Assistant/Tool/Render/CustomRender.tsx

@@ -6,7 +6,7 @@ import { memo, useCallback, useEffect, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { Flexbox } from 'react-layout-kit';
 
-import PluginResult from '@/features/Conversation/Messages/Assistant/Tool/Inspector/PluginResultJSON';
+import PluginResult from '@/features/Conversation/Messages/Assistant/Tool/Inspector/PluginResult';
 import PluginRender from '@/features/PluginsUI/Render';
 import { useChatStore } from '@/store/chat';
 import { chatSelectors } from '@/store/chat/selectors';

package/src/features/Conversation/components/ChatItem/utils.test.ts

@@ -160,6 +160,20 @@ describe('processWithArtifact', () => {
 
     expect(output).toEqual(`<lobeThinking>这是一个思考过程。</lobeThinking>
 
+<lobeArtifact identifier="test" type="image/svg+xml" title="测试"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">  <rect width="100" height="100" fill="blue"/></svg></lobeArtifact>`);
+  });
+
+  it('should handle Gemini case with no line break between lobeThinking and lobeArtifact tags', () => {
+    const input = `<lobeThinking>这是一个思考过程。</lobeThinking><lobeArtifact identifier="test" type="image/svg+xml" title="测试">
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">
+  <rect width="100" height="100" fill="blue"/>
+</svg>
+</lobeArtifact>`;
+
+    const output = processWithArtifact(input);
+
+    expect(output).toEqual(`<lobeThinking>这是一个思考过程。</lobeThinking>
+
 <lobeArtifact identifier="test" type="image/svg+xml" title="测试"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">  <rect width="100" height="100" fill="blue"/></svg></lobeArtifact>`);
   });
 
@@ -431,4 +445,56 @@ This HTML document includes the temperature converter with the requested feature
 
 This HTML document includes the temperature converter with the requested features: the logic is wrapped in an IIFE, and event listeners are attached in JavaScript.`);
   });
+
+  describe('idempotency tests', () => {
+    it('should not add extra blank lines when running processWithArtifact multiple times', () => {
+      const input = `<lobeThinking>这是一个思考过程。</lobeThinking><lobeArtifact identifier="test" type="image/svg+xml" title="测试">
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">
+  <rect width="100" height="100" fill="blue"/>
+</svg>
+</lobeArtifact>`;
+
+      // First run
+      const firstRun = processWithArtifact(input);
+
+      // Second run - should produce the same result
+      const secondRun = processWithArtifact(firstRun);
+
+      // Third run - should still produce the same result
+      const thirdRun = processWithArtifact(secondRun);
+
+      // All runs should produce the same output
+      expect(firstRun).toEqual(secondRun);
+      expect(secondRun).toEqual(thirdRun);
+
+      // Verify the output has exactly two newlines between tags
+      expect(firstRun).toContain('</lobeThinking>\n\n<lobeArtifact');
+      expect(firstRun.match(/(<\/lobeThinking>)\n\n(<lobeArtifact)/)).toBeTruthy();
+    });
+
+    it('should handle already processed content with proper spacing', () => {
+      const alreadyProcessed = `<lobeThinking>这是一个思考过程。</lobeThinking>
+
+<lobeArtifact identifier="test" type="image/svg+xml" title="测试"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">  <rect width="100" height="100" fill="blue"/></svg></lobeArtifact>`;
+
+      const result = processWithArtifact(alreadyProcessed);
+
+      // Should remain unchanged
+      expect(result).toEqual(alreadyProcessed);
+    });
+
+    it('should not convert spaces between tags into extra blank lines', () => {
+      const inputWithSpaces = `<lobeThinking>这是一个思考过程。</lobeThinking> <lobeArtifact identifier="test" type="image/svg+xml" title="测试">
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">
+  <rect width="100" height="100" fill="blue"/>
+</svg>
+</lobeArtifact>`;
+
+      const output = processWithArtifact(inputWithSpaces);
+
+      // Should still have the space and not convert it to newlines
+      expect(output).toContain('</lobeThinking> <lobeArtifact');
+      expect(output).not.toContain('</lobeThinking>\n\n<lobeArtifact');
+    });
+  });
 });

package/src/features/Conversation/components/ChatItem/utils.ts

@@ -22,7 +22,8 @@ export const processWithArtifact = (input: string = '') => {
   }
 
   // Add empty line between lobeThinking and lobeArtifact if they are adjacent
-  output = output.replace(/(<\/lobeThinking>)\r?\n(<lobeArtifact)/, '$1\n\n$2');
+  // Support both cases: with line break (e.g. from other models) and without (e.g. from Gemini)
+  output = output.replace(/(<\/lobeThinking>)(?:\r?\n)?(<lobeArtifact)/, '$1\n\n$2');
 
   // Remove fenced code block between lobeArtifact and HTML content
   output = output.replace(

package/src/libs/model-runtime/ai302/index.ts

@@ -0,0 +1,46 @@
+import { AgentRuntimeErrorType } from '../error';
+import { ChatCompletionErrorPayload, ModelProvider } from '../types';
+import { processMultiProviderModelList } from '../utils/modelParse';
+import { createOpenAICompatibleRuntime } from '../utils/openaiCompatibleFactory';
+
+export interface Ai302ModelCard {
+  id: string;
+}
+
+export const Lobe302AI = createOpenAICompatibleRuntime({
+  baseURL: 'https://api.302.ai/v1',
+  chatCompletion: {
+    handleError: (error: any): Omit<ChatCompletionErrorPayload, 'provider'> | undefined => {
+      let errorResponse: Response | undefined;
+      if (error instanceof Response) {
+        errorResponse = error;
+      } else if ('status' in (error as any)) {
+        errorResponse = error as Response;
+      }
+      if (errorResponse && errorResponse.status === 401) {
+        return {
+          error: errorResponse.status,
+          errorType: AgentRuntimeErrorType.InvalidProviderAPIKey,
+        };
+      }
+
+      return {
+        error,
+      };
+    },
+  },
+  debug: {
+    chatCompletion: () => process.env.DEBUG_SILICONCLOUD_CHAT_COMPLETION === '1',
+  },
+  errorType: {
+    bizError: AgentRuntimeErrorType.ProviderBizError,
+    invalidAPIKey: AgentRuntimeErrorType.InvalidProviderAPIKey,
+  },
+  models: async ({ client }) => {
+    const modelsPage = (await client.models.list()) as any;
+    const modelList: Ai302ModelCard[] = modelsPage.data;
+
+    return processMultiProviderModelList(modelList);
+  },
+  provider: ModelProvider.Ai302,
+});

package/src/libs/model-runtime/runtimeMap.ts

@@ -1,4 +1,5 @@
 import { LobeAi21AI } from './ai21';
+import { Lobe302AI } from './ai302';
 import { LobeAi360AI } from './ai360';
 import { LobeAiHubMixAI } from './aihubmix';
 import { LobeAnthropicAI } from './anthropic';
@@ -56,6 +57,7 @@ import { LobeZhipuAI } from './zhipu';
 
 export const providerRuntimeMap = {
   ai21: LobeAi21AI,
+  ai302: Lobe302AI,
   ai360: LobeAi360AI,
   aihubmix: LobeAiHubMixAI,
   anthropic: LobeAnthropicAI,

package/src/libs/model-runtime/types/type.ts

@@ -29,6 +29,7 @@ export interface CreateChatCompletionOptions {
 
 export enum ModelProvider {
   Ai21 = 'ai21',
+  Ai302 = 'ai302',
   Ai360 = 'ai360',
   AiHubMix = 'aihubmix',
   Anthropic = 'anthropic',

package/src/store/image/slices/createImage/action.test.ts

@@ -95,6 +95,9 @@ describe('CreateImageAction', () => {
 
       // Verify refresh was called
       expect(mockRefreshGenerationBatches).toHaveBeenCalled();
+
+      // Verify prompt is cleared after successful image creation
+      expect(result.current.parameters?.prompt).toBe('');
     });
 
     it('should create new topic when no active topic exists', async () => {
@@ -134,6 +137,9 @@ describe('CreateImageAction', () => {
         imageNum: 4,
         params: { prompt: 'test prompt', width: 1024, height: 1024 },
       });
+
+      // Verify prompt is cleared after successful image creation
+      expect(result.current.parameters?.prompt).toBe('');
     });
 
     it('should throw error when parameters is not initialized', async () => {
@@ -193,6 +199,9 @@ describe('CreateImageAction', () => {
 
       // The service should have been called before the error
       expect(mockImageService.createImage).toHaveBeenCalled();
+
+      // Verify prompt is NOT cleared when error occurs
+      expect(result.current.parameters?.prompt).toBe('test prompt');
     });
 
     it('should handle service error with new topic', async () => {
@@ -223,6 +232,37 @@ describe('CreateImageAction', () => {
       // Verify topic was created before the error
       expect(mockCreateGenerationTopic).toHaveBeenCalled();
       expect(mockSwitchGenerationTopic).toHaveBeenCalled();
+
+      // Verify prompt is NOT cleared when error occurs
+      expect(result.current.parameters?.prompt).toBe('test prompt');
+    });
+
+    it('should clear prompt input after successful image creation', async () => {
+      const mockRefreshGenerationBatches = vi.fn().mockResolvedValue(undefined);
+      const { result } = renderHook(() => useImageStore());
+
+      // Set initial prompt value
+      act(() => {
+        useImageStore.setState({
+          parameters: { prompt: 'detailed landscape artwork', width: 1024, height: 1024 },
+          refreshGenerationBatches: mockRefreshGenerationBatches,
+        });
+      });
+
+      // Verify initial prompt is set
+      expect(result.current.parameters?.prompt).toBe('detailed landscape artwork');
+
+      // Create image
+      await act(async () => {
+        await result.current.createImage();
+      });
+
+      // Verify prompt is cleared
+      expect(result.current.parameters?.prompt).toBe('');
+
+      // Verify other parameters remain unchanged
+      expect(result.current.parameters?.width).toBe(1024);
+      expect(result.current.parameters?.height).toBe(1024);
     });
   });
 

package/src/store/image/slices/createImage/action.ts

@@ -85,8 +85,17 @@ export const createCreateImageSlice: StateCreator<
       if (!isNewTopic) {
         await get().refreshGenerationBatches();
       }
+
+      // 7. Clear the prompt input after successful image creation
+      set(
+        (state) => ({
+          parameters: { ...state.parameters, prompt: '' },
+        }),
+        false,
+        'createImage/clearPrompt',
+      );
     } finally {
-      // 7. Reset all creating states
+      // 8. Reset all creating states
       if (isNewTopic) {
         set(
           { isCreating: false, isCreatingWithNewTopic: false },

package/src/tools/artifacts/systemRole.ts

@@ -27,7 +27,7 @@ The assistant can create and reference artifacts during conversations. Artifacts
 <artifact_instructions>
   When collaborating with the user on creating content that falls into compatible categories, the assistant should follow these steps:
 
-  1. Immediately before invoking an artifact, think for one sentence in <lobeThinking> tags about how it evaluates against the criteria for a good and bad artifact. Consider if the content would work just fine without an artifact. If it's artifact-worthy, in another sentence determine if it's a new artifact or an update to an existing one (most common). For updates, reuse the prior identifier.
+  1. Immediately before invoking an artifact, think for one sentence in <lobeThinking> tags about how it evaluates against the criteria for a good and bad artifact. Consider if the content would work just fine without an artifact. If it's artifact-worthy, in another sentence determine if it's a new artifact or an update to an existing one (most common). For updates, reuse the prior identifier. IMPORTANT: Always ensure there is a line break between the closing </lobeThinking> tag and the opening <lobeArtifact> tag.
   2. Wrap the content in opening and closing \`<lobeArtifact>\` tags.
   3. Assign an identifier to the \`identifier\` attribute of the opening \`<lobeArtifact>\` tag. For updates, reuse the prior identifier. For new artifacts, the identifier should be descriptive and relevant to the content, using kebab-case (e.g., "example-code-snippet"). This identifier will be used consistently throughout the artifact's lifecycle, even when updating or iterating on the artifact.
   4. Include a \`title\` attribute in the \`<lobeArtifact>\` tag to provide a brief title or description of the content.