Instalación

Antes de empezar

Necesitas una aplicación Meeko, Node.js 24 o superior y Meeko compatible con el rango >=1.8 <2. UI pertenece al ecosistema de Meeko y se distribuye como paquete independiente.

Instala el paquete

pnpm add @meekojs/ui

Registra el módulo

Regístralo por su nombre: sus opciones van en la clave ui, tipada sin importar nada. Los componentes se registran con el prefijo UI.

import { defineMeekoConfig } from '@meekojs/meeko/framework'

export default defineMeekoConfig({
  modules: ['@meekojs/ui'],
  theme: { default: 'dark' },
})

El módulo registra su CSS y Vite lo procesa con el PostCSS de tu proyecto. No tienes que importar una hoja CSS manualmente, ni añadir otro procesador, ni copiar la fuente: el módulo sirve Inter.

Añade UIApp

Envuelve tu aplicación para alojar los modales abiertos mediante useModal(). El plugin del módulo crea el manager y UIApp representa su pila.

<!-- app/app.meeko -->
<template>
  <UIApp>
    <MeekoOutlet />
  </UIApp>
</template>

Usa un componente

<script lang="ts">
  const count = signal(0)
</script>

<template>
<UIButton on:click="() => count.value++">Guardar cambios</UIButton>
<UIButton variant="outline">Cancelar</UIButton>
<UIButton size="sm" disabled>No disponible</UIButton>
<p role="status">Cambios: {count.value}</p>
</template>

Continúa con temas y personalización o explora todos los componentes.