Saltearse al contenido

Web

Orbit para web se publica como @dragbuilder-io/orbit en npm (npm.pkg.github.com), un registro privado de GitHub Packages. Necesitás un GitHub PAT con scope read:packages para instalarlo.

Agregá el registro @dragbuilder-io a tu .npmrc (local y en CI):

@dragbuilder-io:registry=https://npm.pkg.github.com
//npm.pkg.github.com/:_authToken=${GH_PACKAGES_TOKEN}

Instalá el paquete — design-tokens viene como dependencia transitiva, no hace falta instalarlo aparte:

Ventana de terminal
npm install @dragbuilder-io/orbit

Registrá el custom element con un <script> de cliente. Los estilos y la tipografía de design-tokens se inyectan solos (requiere un bundler tipo Vite, que ya usan Astro/Storybook) — no hay que linkear ningún CSS a mano:

<orbit-button href="/download" size="md">Descargar</orbit-button>
<script type="module">
import "@dragbuilder-io/orbit/orbit-button.js";
</script>

Íconos van por atributo (leading-icon/trailing-icon), no por slot — un nombre del catálogo cerrado de Orbit (sparkles, arrow-right, download), no una clase de Font Awesome ni markup SVG libre:

<orbit-button href="/download" size="md" leading-icon="download">
Descargar
</orbit-button>

<orbit-button> es un custom element real con Shadow DOM — no un <a>/<button> con clase. Ver Componentes › OrbitButton para todas las variantes.