Is this skill compatible with Nuxt?

Yes, it includes specific patterns for Nuxt integration, including module configuration and auto-import resolvers for optimized development.

How does the 'asChild' pattern work in this skill?

The asChild pattern allows the skill to guide Claude in merging Reka UI behaviors and props directly onto your own custom components, avoiding unnecessary DOM wrapper elements.

Does this skill help with component styling?

Since Reka UI is headless, it handles logic and accessibility; this skill helps you implement that logic and provides patterns for integrating it with styling tools like Tailwind CSS.

Reka UI (formerly Radix Vue) is a library of unstyled, accessible UI primitives for Vue 3 designed to help developers build high-quality design systems without reinventing accessibility logic.

Reka UI Primitives

Name: Reka UI Primitives
Author: onmax

byonmax

•

设计工具

Builds accessible, unstyled Vue 3 component primitives using WAI-ARIA compliant patterns and headless architecture.

This skill empowers Claude to efficiently implement Reka UI (formerly Radix Vue), a comprehensive set of headless component primitives for Vue 3. It provides deep technical guidance on component APIs, accessibility patterns, and composition strategies like the 'asChild' pattern. Whether you are building a custom design system from scratch or utilizing popular libraries like Nuxt UI or shadcn-vue, this skill ensures your components are functionally robust, accessible by default, and seamlessly integrated with modern Vue development workflows.

主要功能

01Advanced composition using the asChild prop pattern

02Optimization of DOM structures for animation libraries using forceMount

03Standardized integration with Nuxt UI and shadcn-vue ecosystems

0412 GitHub stars

05Management of controlled and uncontrolled component states

06Implementation of WAI-ARIA compliant headless components

使用场景

01Refactoring existing UI components to improve accessibility and keyboard navigation

02Building a custom, accessible design system for a Vue 3 or Nuxt application

03Creating complex UI elements like modals, popovers, and comboboxes with pre-built state logic

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add onmax/nuxt-skills reka-ui

For use in Claude.ai and ChatGPT

Download Skill