Skip to content

README.es.md

Latest commit

 

History

History
96 lines (69 loc) · 5.74 KB

README.es.md

File metadata and controls

96 lines (69 loc) · 5.74 KB
Raw

ran

ran

Métodos de diseño, componentes y herramientas para crear productos web, para desarrolladores y agentes de programación.

ranui en npm ranuts en npm estado de CI licencia MIT

Documentación · Componentes · Agentes

English · 中文 · 日本語 · Español · Português · 한국어 · Deutsch · فارسی

ran tiene tres partes que se pueden usar por separado: ranui, componentes de interfaz creados como elementos personalizados nativos; ranuts, utilidades de TypeScript con tipos; y Ran Design, métodos de maquetación, interacción y revisión que personas y agentes de programación pueden aplicar en cualquier stack.

  • Funciona con cualquier framework, o sin ninguno. Cada componente es una etiqueta <r-*>, así que React, Vue, Svelte y un archivo HTML simple lo usan igual. No hay adaptador ni runtime de framework, y basta con una etiqueta script.
  • Piezas para interfaces de chat con IA. Una vista de conversación que sigue la salida en streaming, Markdown que renderiza texto a medio escribir, filas de razonamiento y de llamadas a herramientas, adjuntos y entrada por voz. ranuts/stream interpreta la respuesta en streaming.
  • Temas, renderizado en servidor y tipos incluidos. Temas claro y oscuro mediante design tokens, utilidades de SSR y declaraciones de TypeScript vienen con el paquete.
  • Instala solo lo que uses. Cada paquete y cada componente tiene su propio punto de entrada.

La página de inicio de ran.chaxus.com: el titular a la izquierda y, a la derecha, un formulario de ranui que funciona para invitar a un compañero, con campo de correo, selector de rol, casilla y botón de envío

Paquetes

Paquete Para qué sirve
ranui Formularios, diálogos, tablas, Markdown, reproductores multimedia y vistas de chat con IA como elementos personalizados, con temas y utilidades de renderizado en servidor.
ranuts Utilidades para cadenas, color, tiempo, archivos, almacenamiento y el DOM, además de análisis de SSE y estado de respuestas en streaming.
Ran Design Métodos de composición, interacción, movimiento y revisión basada en evidencias. Se distribuye como plugin para agentes y no requiere ranui.

La capa de construcción y reactividad de ranui se publica por separado como @alixex/ranview.

Inicio rápido

Sin paso de compilación, carga un componente desde un CDN y escribe la etiqueta:

<script src="https://cdn.jsdelivr.net/npm/ranui/dist/iife/button.iife.js" defer></script>
<r-button type="primary">Guardar</r-button>

Con un empaquetador, instala el paquete e importa los componentes que uses:

npm install ranui
import 'ranui/button';
import 'ranui/style';

ranui está en fase alfa y sus versiones pueden incluir cambios incompatibles, así que fija una versión exacta en producción. La documentación de componentes tiene ejemplos en vivo, eventos y estilos de cada elemento.

Uso con un agente de programación

El plugin ran añade las skills design, ranui y ranuts a Claude Code y Codex. No necesita servidor MCP ni cuenta.

claude plugin marketplace add chaxus/ran && claude plugin install ran@ran
codex plugin marketplace add chaxus/ran && codex plugin add ran@ran

En una sesión nueva, usa /ran:design, /ran:ranui o /ran:ranuts en Claude Code, o $design, $ranui o $ranuts en Codex. Para instalarlo desde una copia local, consulta la guía de agentes; las skills están en plugins/ran.

Contribuir

Usa Node 24 o superior y la versión de pnpm fijada en package.json.

pnpm install --frozen-lockfile
pnpm build
pnpm test
pnpm -F docs dev

Lee AGENTS.md antes de contribuir y la guía de publicación al preparar paquetes.

Licencia

MIT