Skip to content
Closed
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
12 changes: 12 additions & 0 deletions skills/nuxt-ui/SKILL.md
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,18 @@ description: Build UIs with @nuxt/ui v4 — 125+ accessible Vue components with

Vue component library built on [Reka UI](https://reka-ui.com/) + [Tailwind CSS](https://tailwindcss.com/) + [Tailwind Variants](https://www.tailwind-variants.org/). Works with Nuxt, Vue (Vite), Laravel (Inertia), and AdonisJS (Inertia).

## Table of contents

- [Installation](#installation)
- [Icons](#icons)
- [Theming & Branding](#theming--branding)
- [Composables](#composables)
- [Form validation](#form-validation)
- [Overlays](#overlays)
- [Layouts](#layouts)
- [Templates](#templates)
- [Additional references](#additional-references)

## Installation

### Nuxt
Expand Down
15 changes: 15 additions & 0 deletions skills/nuxt-ui/references/components.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,21 @@

125+ Vue components powered by Tailwind CSS and Reka UI. For any component's theme slots, read the generated theme file (Nuxt: `.nuxt/ui/<component>.ts`, Vue: `node_modules/.nuxt-ui/ui/<component>.ts`).

## Table of contents

- [Layout](#layout)
- [Element](#element)
- [Form](#form)
- [Data](#data)
- [Navigation](#navigation)
- [Overlay](#overlay)
- [Page](#page)
- [Dashboard](#dashboard)
- [Chat](#chat)
- [Editor](#editor)
- [Content](#content)
- [Color Mode](#color-mode)

## Layout

Core structural components for organizing your application's layout.
Expand Down
9 changes: 9 additions & 0 deletions skills/nuxt-ui/references/composables.md
Original file line number Diff line number Diff line change
@@ -1,5 +1,14 @@
# Composables

## Table of contents

- [useToast](#usetoast)
- [useOverlay](#useoverlay)
- [defineShortcuts](#defineshortcuts)
- [defineLocale / extendLocale](#definelocale--extendlocale)
- [extractShortcuts](#extractshortcuts)
- [Quick reference](#quick-reference)

## useToast

Show notifications. Requires `<UApp>` wrapper.
Expand Down
10 changes: 10 additions & 0 deletions skills/nuxt-ui/references/layouts/chat.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,16 @@

Build AI chat interfaces with message streams, reasoning, tool calling, and Vercel AI SDK integration.

## Table of contents

- [Component tree](#component-tree)
- [Setup](#setup)
- [Full page chat](#full-page-chat)
- [Key components](#key-components)
- [Chat in a modal](#chat-in-a-modal)
- [With model selector](#with-model-selector)
- [Conversation sidebar](#conversation-sidebar)

## Component tree

```
Expand Down
11 changes: 11 additions & 0 deletions skills/nuxt-ui/references/layouts/dashboard.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,17 @@

Build admin interfaces with resizable sidebars, multi-panel layouts, and toolbars.

## Table of contents

- [Component tree](#component-tree)
- [Layout](#layout)
- [Page](#page)
- [Key components](#key-components)
- [Multi-panel (list-detail)](#multi-panel-list-detail)
- [With toolbar](#with-toolbar)
- [With search](#with-search)
- [Right sidebar](#right-sidebar)

## Component tree

```
Expand Down
8 changes: 8 additions & 0 deletions skills/nuxt-ui/references/layouts/docs.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,14 @@ Build documentation sites with sidebar navigation, table of contents, and surrou

> Requires `@nuxt/content` module for navigation, search, and TOC.

## Table of contents

- [Component tree](#component-tree)
- [App shell](#app-shell)
- [Layout](#layout)
- [Page](#page)
- [Key components](#key-components)

## Component tree

```
Expand Down
9 changes: 9 additions & 0 deletions skills/nuxt-ui/references/layouts/editor.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,15 @@

Build a rich text editor with toolbars, slash commands, mentions, and drag-and-drop.

## Table of contents

- [Component tree](#component-tree)
- [Page](#page)
- [Key components](#key-components)
- [Toolbar modes](#toolbar-modes)
- [Content types](#content-types)
- [With document sidebar](#with-document-sidebar)

## Component tree

```
Expand Down
10 changes: 10 additions & 0 deletions skills/nuxt-ui/references/layouts/page.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,16 @@

Build public-facing pages — landing, blog, changelog, pricing — using the Header + Main + Footer shell with Page components.

## Table of contents

- [App shell](#app-shell)
- [Landing page](#landing-page)
- [Blog listing](#blog-listing)
- [Blog article](#blog-article)
- [Changelog](#changelog)
- [Key components](#key-components)
- [Variations](#variations)

## App shell

```vue [app.vue]
Expand Down
11 changes: 11 additions & 0 deletions skills/nuxt-ui/references/theming.md
Original file line number Diff line number Diff line change
@@ -1,5 +1,16 @@
# Theming

## Table of contents

- [Semantic colors](#semantic-colors)
- [Configuring colors](#configuring-colors)
- [Adding custom colors](#adding-custom-colors)
- [CSS utilities](#css-utilities)
- [Component theme customization](#component-theme-customization)
- [Dark mode](#dark-mode)
- [Fonts](#fonts)
- [Brand customization playbook](#brand-customization-playbook)

## Semantic colors

| Color | Default | Purpose |
Expand Down
Loading