@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
2026-09-06 01:57:13 -03:00
Assets (1)
Versions (1)
View all
npm
2
latest
8.9 KiB
uikit-0.1.0.tgz
8.9 KiB
0.1.0
2026-09-06