介绍
PropShow Kit 是一个专门为 Shadcn Vue 打造的扩展组件集合。它提供了一系列 Shadcn Vue 官方库中尚未包含,但在实际业务开发中非常实用的 UI 组件。
设计理念
PropShow Kit 遵循与 Shadcn Vue 相同的设计哲学:
- 非组件库: 它不是一个通过 npm 安装的依赖包。
- 复制即用: 你拥有代码的完全控制权。直接将组件源码复制到你的项目中即可使用。
- 高度可定制: 基于 Tailwind CSS 构建,你可以根据需求随意修改样式和逻辑。
- 风格统一: 默认样式与 Shadcn Vue 保持一致,无缝融入你的现有项目。
为什么需要它?
在使用 Shadcn Vue 开发项目时,我们经常会遇到一些通用但官方库未提供的组件需求,例如:
- Status Badge: 带有状态指示点的徽章。
- Inline Tip: 用于文档或提示的行内警告框。
- Copy Button: 带有复制反馈的按钮。
PropShow Kit 旨在填补这些空白,让你无需从零开始编写这些组件,从而节省开发时间。
主要特性
- 🎨 Shadcn 风格: 保持与 Shadcn Vue 一致的视觉风格和 API 设计。
- 📋 TypeScript: 完全使用 TypeScript 编写,提供良好的类型提示。
- 🌙 暗色模式: 完美支持亮色和暗色模式切换。
- 🧩 独立性: 组件之间尽量解耦,你可以只选择你需要的组件。