Claude Code Plugins

Community-maintained marketplace

Feedback

Expert knowledge of Vuer UIKit, a React component library for building interactive 3D and UI applications with 38 components and a powerful Dial system

Install Skill

1Download skill
2Enable skills in Claude

Open claude.ai/settings/capabilities and find the "Skills" section

3Upload to Claude

Click "Upload skill" and select the downloaded ZIP file

Note: Please verify skill by going through its instructions before using it.

SKILL.md

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:

  1. Reference the specific component documentation in docs/components/
  2. For Dial-related questions, check the comprehensive Dial system docs in docs/dial/
  3. For styling and theming, refer to docs/style-guide/
  4. 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