straw-ui-vue 0.1.8 → 0.1.10

package/README.md

@@ -1,205 +1,42 @@
-# Straw UI
+# straw-ui-vue
 
-一个基于 Vue 3 + TypeScript + UnoCSS 的现代组件库。
+This template should help get you started developing with Vue 3 in Vite.
 
-## 特性
+## Recommended IDE Setup
 
-- 🚀 **Vue 3 + TypeScript** - 完整的类型支持
-- 🎨 **UnoCSS** - 原子化 CSS，按需生成
-- 📦 **零运行时依赖** - 仅对等依赖 Vue 3
-- 🔧 **按需导入** - 支持 tree-shaking
-- 🌙 **暗色主题** - 内置暗色模式支持
+[VS Code](https://code.visualstudio.com/) + [Vue (Official)](https://marketplace.visualstudio.com/items?itemName=Vue.volar) (and disable Vetur).
 
-## 安装
+## Recommended Browser Setup
 
-```bash
-npm install straw-ui-vue
-```
-
-## 快速开始
-
-### 完整引入
-
-```ts
-import { createApp } from 'vue';
-import StrawUI from 'straw-ui-vue';
-import 'straw-ui-vue/style.css';
-
-const app = createApp(App);
-app.use(StrawUI);
-```
-
-### 按需导入
-
-```vue
-<script setup lang="ts">
-import { StButton, StInput } from 'straw-ui-vue';
-import 'straw-ui-vue/style.css';
-</script>
-
-<template>
-  <StButton>Click me</StButton>
-  <StInput v-model="value" placeholder="Type something" />
-</template>
-```
-
-## UnoCSS 集成
-
-Straw UI 基于 UnoCSS 构建，提供三种集成方案：
-
-### 方案一：使用预设（推荐）
-
-```ts
-// uno.config.ts
-import { defineConfig, presetWind4, presetIcons } from 'unocss';
-import { presetStrawUI } from 'straw-ui-vue/unocss';
-
-export default defineConfig({
-  presets: [
-    presetWind4(),
-    presetIcons(),
-    presetStrawUI(), // Straw UI 预设
-  ],
-});
-```
-
-### 方案二：使用 safelist
-
-```ts
-// uno.config.ts
-import { defineConfig } from 'unocss';
-import { getStrawUISafelist } from 'straw-ui-vue/unocss';
-
-export default defineConfig({
-  safelist: [...getStrawUISafelist()],
-});
-```
-
-### 方案三：仅引入样式
-
-不使用 UnoCSS 时，直接引入预编译的样式：
-
-```ts
-import 'straw-ui-vue/style.css';
-```
-
-详细配置请参阅 [UnoCSS 集成文档](./docs/unocss.md)。
-
-## TypeScript 支持
-
-Straw UI 提供完整的 TypeScript 类型支持。
+- Chromium-based browsers (Chrome, Edge, Brave, etc.):
+  - [Vue.js devtools](https://chromewebstore.google.com/detail/vuejs-devtools/nhdogjmejiglipccpnnnanhbledajbpd)
+  - [Turn on Custom Object Formatter in Chrome DevTools](http://bit.ly/object-formatters)
+- Firefox:
+  - [Vue.js devtools](https://addons.mozilla.org/en-US/firefox/addon/vue-js-devtools/)
+  - [Turn on Custom Object Formatter in Firefox DevTools](https://fxdx.dev/firefox-devtools-custom-object-formatters/)
 
-### 全局组件类型
+## Type Support for `.vue` Imports in TS
 
-```json
-// tsconfig.json
-{
-  "compilerOptions": {
-    "types": ["straw-ui-vue/global-components"]
-  }
-}
-```
-
-详细配置请参阅 [TypeScript 配置指南](./docs/typescript.md)。
-
-## 组件列表
-
-| 组件 | 说明 |
-|------|------|
-| `StButton` | 按钮组件 |
-| `StInput` | 输入框组件 |
-| `StCheckbox` | 复选框组件 |
-| `StCheckboxGroup` | 复选框组组件 |
-| `StRadio` | 单选框组件 |
-| `StRadioGroup` | 单选框组组件 |
-| `StSelect` | 选择器组件 |
-| `StDialog` | 对话框组件 |
-| `StPopover` | 弹出框组件 |
-| `StTooltip` | 提示框组件 |
-| `StMenu` | 菜单组件 |
-| `StSidebar` | 侧边栏组件 |
-| `StSidebarItem` | 侧边栏项组件 |
-| `StSplitter` | 分割器组件 |
-| `StSplitterPanel` | 分割面板组件 |
-| `StTree` | 树形组件 |
-| `StToggle` | 开关组件 |
-
-## 自定义指令
-
-| 指令 | 说明 |
-|------|------|
-| `v-intersection` | 元素可视区域监听 |
-| `v-interval` | 定时器指令 |
-| `v-move` | 元素拖拽移动 |
-| `v-resize` | 元素尺寸变化监听 |
-
-## 主题定制
+TypeScript cannot handle type information for `.vue` imports by default, so we replace the `tsc` CLI with `vue-tsc` for type checking. In editors, we need [Volar](https://marketplace.visualstudio.com/items?itemName=Vue.volar) to make the TypeScript language service aware of `.vue` types.
 
-Straw UI 使用 CSS 变量定义主题，你可以通过覆盖变量来自定义主题：
+## Customize configuration
 
-```css
-:root {
-  --primary: #3b82f6;
-  --primary-foreground: #ffffff;
-  --radius: 0.5rem;
-  /* 更多变量... */
-}
+See [Vite Configuration Reference](https://vite.dev/config/).
 
-[data-theme='dark'] {
-  --primary: #3b82f6;
-  /* 暗色主题变量... */
-}
-```
-
-完整变量列表请参阅 [UnoCSS 集成文档](./docs/unocss.md#主题变量)。
-
-## 开发
-
-### 环境要求
-
-- Node.js: `^20.19.0 || >=22.12.0`
-
-### 安装依赖
+## Project Setup
 
 ```sh
-npm install
+bun install
 ```
 
-### 开发模式
+### Compile and Hot-Reload for Development
 
 ```sh
-npm run dev
+bun dev
 ```
 
-### 构建库
+### Type-Check, Compile and Minify for Production
 
 ```sh
-npm run build:lib
+bun run build
 ```
-
-### 类型检查
-
-```sh
-npm run type-check
-```
-
-### 文档开发
-
-```sh
-npm run docs:dev
-```
-
-## 文档
-
-- [UnoCSS 集成](./docs/unocss.md)
-- [TypeScript 配置](./docs/typescript.md)
-
-## 推荐 IDE 设置
-
-- [VS Code](https://code.visualstudio.com/)
-- [Vue - Official (Volar)](https://marketplace.visualstudio.com/items?itemName=Vue.volar)（禁用 Vetur）
-- [UnoCSS](https://marketplace.visualstudio.com/items?itemName=antfu.unocss)
-
-## License
-
-MIT