tick-components

TICK Components

Modern, scalable React component library built with Vite, TypeScript, and CSS Modules. Designed for robust design systems.

✨ Features

• 🎨 Design tokens (colores, spacing, tipografía, sombras)
• 📦 Tree-shakeable y modular
• 🔷 100% TypeScript
• ♿ Accesibilidad y mobile-first
• 🚀 React 18/19, Vite, CSS Modules

🚀 Installation

# Desde npm (si está publicado)
npm install tick-components

# Desde GitHub (sin publicar en npm)
npm install git+https://github.com/Iber-Chambi/tick-components.git

# Usando yarn
yarn add tick-components

# Usando bun
bun add tick-components

📦 Quick Start

import { EgxPriceBoxList } from 'tick-components';
import 'tick-components/style.css';

function App() {
  const prices = [
    { id: 1, price: 99.99, label: 'Basic', currency: '$' },
    { id: 2, price: 199.99, label: 'Pro', currency: '$' },
    { id: 3, price: 299.99, label: 'Enterprise', currency: '$' },
  ];
  return (
    <EgxPriceBoxList
      items={prices}
      onPriceClick={(item) => console.log('Selected:', item)}
    />
  );
}

🧩 Components

Incluye componentes de UI para dashboards, formularios, listas, inputs, layouts y más. Ejemplo:

import { EgxPriceBoxList } from 'tick-components';
// ...
<EgxPriceBoxList items={[{ price: 29.99, label: 'Starter' }]} />

📚 Documentation

• Guía de inicio
• Documentación de componentes
• Storybook: playground interactivo (npm run storybook)

🛠️ Development

Clona el repo y usa los scripts npm para desarrollo, build, test y storybook.

📁 Estructura

Organización modular y escalable para proyectos grandes. Ver guía de componentes en la documentación.

🎨 Design System

Tokens de diseño para colores, tipografía, espaciados, sombras y más. Personaliza tu UI fácilmente.

🔧 Tech Stack

React, TypeScript, Vite, CSS Modules, Storybook.

📘 TypeScript Support

Todos los componentes tienen tipado completo y autocompletado.

🔄 Updating

Actualiza con:

npm update tick-components

🌐 Browser Support

Soporte para los principales navegadores modernos.

📝 Contributing

¡Contribuciones bienvenidas! Sigue la estructura y patrones del proyecto.

📄 License

MIT