@embee/uikit (0.1.0)

Published 2026-09-06 01:57:13 -03:00 by tomasjs

Installation

@embee:registry=
npm install @embee/uikit@0.1.0
"@embee/uikit": "0.1.0"

About this package

🎨 Embee UI Kit

Librería de componentes UI ultraliviana para Overlays de Streaming e Interfaces Interactivas construida con Preact, Atomic Design y Vanilla CSS (Design Tokens).


🚀 Características

  • Preact 10.x: Runtime ultraliviano (~3KB) diseñado para 60 FPS estables en OBS Browser Sources.
  • ⚛️ Atomic Design: Estructurado en src/lib/atom-design (Tokens, Atoms, Molecules, Organisms).
  • 🎨 Vanilla CSS Tokens: Colores, gradientes y sombras extraídos 1:1 desde Figma Embeejayz.
  • 📖 Storybook 8: Playground interactivo para desarrollo y catálogo de cartas.
  • 📦 Dual Output: Builds optimizados en ESM (.mjs) y CJS (.cjs) con declaraciones de TypeScript (.d.ts).

🛠️ Comandos

# Iniciar Storybook interactivo
npm run storybook

# Compilar la librería para producción
npm run build

📦 Consumo en Overlays

import { CardPlayer, Badge } from '@embee/uikit';
import '@embee/uikit/style.css';

export function OverlayFaker() {
  return (
    <CardPlayer
      playerName="FAKER"
      teamName="T1"
      playerNumber="03"
      role="mid"
      tier="gold"
      tierLabel="⭐ LEGENDARIO"
      animated={true}
    />
  );
}

Dependencies

Development dependencies

ID Version
@preact/preset-vite ^2.9.0
@storybook/addon-essentials ^8.5.0
@storybook/addon-interactions ^8.5.0
@storybook/addon-links ^8.5.0
@storybook/preact ^8.5.0
@storybook/preact-vite ^8.5.0
@testing-library/preact ^3.2.4
@types/node ^24.12.0
happy-dom ^20.13.2
preact ^10.26.4
storybook ^8.5.0
typescript ^5.7.0
vite ^6.2.0
vite-plugin-dts ^4.5.3
vitest ^5.0.0

Peer dependencies

ID Version
preact ^10.20.0
Details
npm
2026-09-06 01:57:13 -03:00
2
latest
8.9 KiB
Assets (1)
uikit-0.1.0.tgz 8.9 KiB
Versions (1) View all
0.1.0 2026-09-06