Orbit UI

Instalación

Orbit UI funciona en cualquier proyecto con React 19 y Tailwind CSS v4. Son dos comandos: init una sola vez por proyecto, y add cada vez que quieras un componente.

Preparar el proyecto

Instala las dependencias, escribe los tokens, configura el alias @/ y deja un components.json. Detecta solo el framework y el gestor de paquetes.

npx orbitui-cli init

Agregar componentes

Las dependencias internas y los paquetes npm se resuelven solos, y todo se instala en una sola pasada.

npx orbitui-cli add card button segmented-control

Usarlos

El código quedó en tu repositorio. Editalo como cualquier otro archivo tuyo.

import { Card, CardBody, CardHeader, CardHeading, CardTitle } from "@/components/orbit/ui/card";
import { DeltaChip } from "@/components/orbit/ui/chip";

export function RevenueCard() {
  return (
    <Card>
      <CardHeader>
        <CardHeading>
          <CardTitle>Ingresos</CardTitle>
        </CardHeading>
        <DeltaChip value={16.2} />
      </CardHeader>
      <CardBody>
        <p className="text-display-sm" data-orbit-numeric="">$152.313,92</p>
      </CardBody>
    </Card>
  );
}

Componentes Pro

Activá la licencia una vez por máquina. El token queda en ~/.orbit-ui/auth.json y sirve para todos tus proyectos.

npx orbitui-cli login <TU_LICENSE_KEY>

Sin licencia, add de un componente Pro devuelve un error claro en vez de fallar a medias. Las previews de esta documentación funcionan igual: lo que la licencia habilita es el código fuente.

Todos los comandos

orbit-ui initPrepara el proyecto. Una vez por repositorio.
orbit-ui add <...>Copia componentes y sus dependencias.
orbit-ui listCatálogo con estado free/pro.
orbit-ui diffQué cambió upstream y qué modificaste vos.
orbit-ui login <key>Activa la licencia Pro.
orbit-ui whoamiMuestra la licencia activa.

Si volvés a correr add

El CLI guarda el hash de cada archivo que escribió. Si no lo tocaste, lo actualiza en silencio. Si lo modificaste, te pregunta antes de pisarlo — tus cambios no se pierden por accidente.