@sciol/xyzen 0.3.12 → 0.3.13
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +18 -3
- package/dist/style.css +1 -0
- package/dist/xyzen.es.js +6012 -6012
- package/dist/xyzen.umd.js +106 -106
- package/package.json +1 -4
- package/dist/xyzen.css +0 -1
package/README.md
CHANGED
|
@@ -66,7 +66,7 @@ The Xyzen component requires a running backend service to handle chat logic and
|
|
|
66
66
|
```tsx
|
|
67
67
|
// src/App.tsx
|
|
68
68
|
import { Xyzen, useXyzen } from "@sciol/xyzen";
|
|
69
|
-
import "@sciol/xyzen/
|
|
69
|
+
import "@sciol/xyzen/style.css"; // 重要:导入样式文件
|
|
70
70
|
|
|
71
71
|
function App() {
|
|
72
72
|
const { openXyzen } = useXyzen();
|
|
@@ -86,9 +86,24 @@ The Xyzen component requires a running backend service to handle chat logic and
|
|
|
86
86
|
export default App;
|
|
87
87
|
```
|
|
88
88
|
|
|
89
|
-
|
|
89
|
+
**重要提示:**
|
|
90
|
+
- 必须导入 `@sciol/xyzen/style.css` 样式文件,它包含所有必需的 CSS 变量、主题配置和 Markdown 样式
|
|
91
|
+
- `backendUrl` 应指向您部署的 Xyzen 后端基础 URL,组件会自动处理 `/xyzen/api`、`/xyzen/ws` 和 `/xyzen/mcp` 等端点
|
|
90
92
|
|
|
91
|
-
3.
|
|
93
|
+
3. (可选)如果您使用 Tailwind CSS v4,可以在您的项目中创建一个自定义主题配置来覆盖默认样式:
|
|
94
|
+
|
|
95
|
+
```css
|
|
96
|
+
/* your-app.css */
|
|
97
|
+
@import "@sciol/xyzen/style.css";
|
|
98
|
+
|
|
99
|
+
/* 自定义主题变量 */
|
|
100
|
+
:root {
|
|
101
|
+
--primary: oklch(0.5 0.2 250); /* 自定义主色 */
|
|
102
|
+
--radius: 0.5rem; /* 自定义圆角 */
|
|
103
|
+
}
|
|
104
|
+
```
|
|
105
|
+
|
|
106
|
+
4. Control the Xyzen panel from any component:
|
|
92
107
|
|
|
93
108
|
Use the `useXyzen` hook to control the sidebar's visibility:
|
|
94
109
|
|