@getweini/vue

Weini UI for Vue

Build Vue and Nuxt interfaces with editable UI components, TypeScript and Tailwind CSS. This package provides the shared behavior and styles used by Weini components, including keyboard navigation, focus handling and form support.

Browse components · Getting started

Start here

Use the Weini CLI to add components to an existing Vue 3.5+ Vite or Nuxt app. It installs this package and sets up the required styles for you:

npx @getweini/cli@latest init
npx @getweini/cli@latest add button

Run these commands in your app's folder with Node.js 22+. With Bun 1.3+, replace npx with bunx --bun.

The CLI prints where it placed the component and how to import it. For example, from src/App.vue in a Vue app:

<script setup lang="ts">
import Button from './components/ui/button/Button.vue'
</script>

<template>
  <Button>Get started</Button>
</template>

Starting a new app? Follow the Vue and Vite guide or the Nuxt guide.

What goes where?

• Your app contains the component .vue files. Edit them to change layout, colors, icons and other visual details.
• @getweini/vue supplies shared interaction code, theme styles, and reusable types. For example, ButtonOptions contains framework-neutral button fields and ButtonProps adds Vue targets. Your installed components use this package automatically.
• @getweini/cli adds components and helps you check or update your setup.

Import visible components such as Button from the files in your app. Installing this package alone does not copy those component files.

Styling and updates

Setup offers a default theme or an editable token file. The Nebula font is optional; you can keep your existing font. See the theming guide.

The shared ui-pressable class adds a slight press scale to enabled controls that also use ui-motion. It stays still for disabled controls and reduced-motion preferences.

Check your installation with:

npx @getweini/cli@latest doctor

For updates, run npx @getweini/cli@latest outdated. Follow the update guide to review component changes and shared-package updates while protecting your edits.

Advanced use

If you manage setup yourself, install with npm install @getweini/vue. Vue 3.5+ is required. The setup guides explain the Tailwind CSS 4 integration and stylesheet imports; installation alone does not configure them.

Public entry points include @getweini/vue/types, @getweini/vue/date, @getweini/vue/primitive, and the documented component primitives. See core concepts before composing your own behavior.

Documentation · Component examples · MIT license