QiuYe UI
精心设计的自定义UI组件,让您的应用更加出色
Responsive Tabs
响应式标签页组件:小屏横向滚动、可选左右滚动按钮与渐变遮罩;大屏可切换为网格布局;支持图标、徽标、禁用与自定义样式。
Scrollable Dialog
可滚动对话框组件:头部和底部固定,内容区域可滚动,支持自定义高度,适用于需要展示大量内容的场景。
Dot Glass
点阵开孔毛玻璃组件:一种「反直觉」的玻璃效果,只在点阵孔洞里露出背后内容的模糊(blur),其余区域是纯色盖板遮挡,适用于 Header、Navbar 等需要特殊视觉效果的场景。
Image Viewer
带灯箱预览的图片查看器,支持点击放大、滚轮/触控缩放与拖拽平移,内置骨架屏加载过渡与悬浮放大动效。
Dual State Toggle
双状态切换按钮:基于 shadcn/ui Button,内置点击缩放 + 图标切换动画(opacity + blur),支持 5 种过渡效果预设与自定义过渡配置。
Code Block
通用代码块显示组件:基于 prism-react-renderer 的语法高亮,7 套内置配色主题(浅/深色变体)+ 自定义主题支持,支持折叠、滚动、自适应高度三种显示模式,Diff 高亮模式(绿色/红色行背景 + 左侧指示条),行高亮标记(淡蓝色背景标记指定行),行号 sticky 固定,自带完整样式。含 CodeBlockPanel 外层容器面板(仿 Tailwind CSS 官网风格),支持文件名标签与复制按钮。
Typewriter
平滑打字机效果组件:弹簧宽度跟随(useSpring)实现无顿挫的容器缩放,全文渲染 + overflow 裁剪避免字符闪现,支持多文案轮播、单次打字、自定义光标与弹簧参数。
Markdown Renderer
通用 Markdown 渲染器:内置 Blog / Chat 两套预设,支持 GFM、标题锚点、代码块高亮、Mermaid 图表、图片预览、安全链接策略与可扩展 Widget 运行时。
Color Picker
通用取色器组件:基于 HSV 色彩模型的饱和度/亮度面板与色相条拖拽选色,支持可选透明度(Alpha)选择、触屏操作、十六进制输入、40 色预设色卡、最近使用颜色记录,提供 Popover 弹出与 Inline 内嵌两种布局模式。
Tour
产品引导组件:基于目标 selector 高亮页面元素并展示步骤 Popover,内置遮罩聚焦、Motion layoutId 迁移动画、进度显示、上一步/下一步/跳过与自动滚动定位。