Packages

@vyui/kit

Opinionated styled components on top of @vyui/core.

@vyui/kit is the styled layer. 48 drop-in Vy* components built on top of @vyui/core, with a Tailwind Variants theme you can override at any point.

What you get

  • 48 styled components — VyButton, VyDrawer, VyModal, VyToast, VyIsland, VyTabs, VySlider, and more.
  • Tailwind Variants theme — per-component theme files under packages/kit/src/theme. Override slots, variants, and defaults without forking.
  • createTv + tv() — re-exported from @vyui/kit so you can compose your own variants with the same DX as Nuxt UI or shadcn.
  • Runtime app config — pass overrides to the VyUI plugin at mount time. No build step. Theme keys deep-merge into defaults.

When to use it

Use @vyui/kit if you want to ship fast with sensible defaults. Kit gives you styled Vy* components on top of core, ready to drop into a Lynx app.

Example

src/index.ts
import { createApp } from '@lynx-js/vue'
import { VyUI } from '@vyui/kit'
import '@vyui/kit/style.css'
import App from './App.vue'

createApp(App).use(VyUI).mount('#app')
App.vue
<script setup>
import { VyButton, VySlider } from '@vyui/kit'
import { ref } from 'vue'

const value = ref(50)
</script>

<template>
  <VySlider v-model="value" :max="100" />
  <VyButton variant="solid" color="primary">Save</VyButton>
</template>