| name | vuer-uikit |
| description | Expert knowledge of Vuer UIKit, a React component library for building interactive 3D and UI applications with 38 components and a powerful Dial system |
Vuer UIKit Documentation Skill
Expert knowledge of Vuer UIKit, a React component library for building interactive 3D and UI applications.
What is Vuer UIKit?
Vuer UIKit is a comprehensive React component library designed for building modern user interfaces, particularly for 3D visualization and interactive applications. It provides a rich set of components including forms, layouts, data displays, and a powerful Dial system for creating control panels.
Documentation Coverage
This skill includes complete documentation for:
Getting Started
- Introduction and overview
- Installation and setup guide
Style Guide
- Color system and theming
- Typography and fonts
- Icon library
- Layout principles
Form Inputs
- Standard input components
- Number inputs with specialized controls
- Interactive playground
- Specialized input types
Dial System
The Dial system is a powerful feature for creating control panels:
- Overview and concepts
- Getting started guide
- Step-by-step tutorial
- Comprehensive input type reference
- Type inheritance patterns
- CLI tooling reference
- Testing strategies
- Controlled dial patterns
- API design notes
Menu & Tool Layouts
- Dock layout for panels
- Liquid float layout for dynamic positioning
- Toolbar components
Components (38 total)
Complete documentation for all UI components including:
- Navigation: Navbar, Navigation, Sidebar, Tabs
- Data Display: Avatar, Badge, Card, Table, Waterfall
- Overlays: Modal, Drawer, Popover, Sheet, Toast, Tooltip
- Inputs: Button, Checkbox, Radio Group, Select, Slider, Switch, Textarea, Toggle components
- Feedback: Progress, Spinner, Version Badge
- Advanced: Tree View, Collapsible, Cursor Display, Drag Selectable, Sync Scroll, Preview
Hooks
Custom React hooks for common patterns
Usage
When helping with Vuer UIKit:
- Reference the specific component documentation in
docs/components/
- For Dial-related questions, check the comprehensive Dial system docs in
docs/dial/
- For styling and theming, refer to
docs/style-guide/
- For layout patterns, see
docs/menu-tool-layouts/
Official Resources
Skills
This skill helps you:
- Build UIs with Vuer UIKit components
- Create control panels using the Dial system
- Apply consistent styling and theming
- Implement complex layouts and interactions
- Use specialized form inputs and controls
- Test Dial-annotated components
