gp_design

Colección de widgets, temas y utilidades responsivas listas para acelerar la construcción de productos con el sistema de diseño de GP. Incluye componentes de UI, helpers de red con dio y tokens reutilizables de tipografía, espaciado y color.

Características

• 🎨 Tema consistente: GpTheme, GpColors, GpSpacing, GpTextSize y GpBorderRadius garantizan que todo el UI respete el mismo lenguaje visual.
• 🧱 Componentes reutilizables: botones, inputs, listas, diálogos, app bars, loaders, skeletons y más.
• 📐 Layout responsive: GpResponsive, GpRow y GpCol ofrecen un grid fluido de 4/8/12 columnas según el dispositivo.
• 🔒 Infraestructura HTTP: interceptores para manejo de errores y token Bearer usando dio.
• ⚙️ Extensible: cada widget expone overrides para colores, tamaños y estilos.

Instalación

Agrega la dependencia en tu pubspec.yaml:

dependencies:
  gp_design: ^0.1.0

Importa el paquete en tu código:

import 'package:gp_design/gp_design.dart';

Uso rápido

MaterialApp(
  theme: GpTheme.light(context),
  darkTheme: GpTheme.dark(context),
  home: Scaffold(
    appBar: const GpAppBar(title: 'GP Design'),
    body: Padding(
      padding: const EdgeInsets.all(16),
      child: GpRow(
        gutter: 16,
        children: const [
          GpCol(span: 4, child: GpButton(text: 'Primario', onPressed: null)),
          GpCol(span: 4, child: GpListTile(title: 'Elemento', subtitle: 'Detalle')),
          GpCol(span: 4, child: GpAlertDialog(title: 'Éxito', message: 'Todo OK')),
        ],
      ),
    ),
  ),
);

Más ejemplos se encuentran en /example.

Componentes incluidos

• Widgets: GpButton, GpIconButton, GpInput, GpCheckbox, GpListTile, GpAlertDialog, loaders, tabs, cards y más (ver exports en lib/gp_design.dart).
• Tipografía: GpText centraliza estilos y asegura accesibilidad.
• Responsive: GpRow divide el ancho disponible en columnas con gutters configurables.
• Red HTTP: ErrorInterceptor transforma los errores de Dio en GpException con mensajes pensados para UI y AuthInterceptor agrega tokens Bearer automáticamente.

Interceptores de ejemplo

final dio = Dio()
  ..interceptors.addAll([
    AuthInterceptor(() async => 'token-123'),
    ErrorInterceptor(),
  ]);

Contribuciones y soporte

1. Haz un fork y crea una rama descriptiva.
2. Ejecuta dart format, dart analyze y flutter test.
3. Abre un pull request con contexto y screenshots si aplica.

Para reportar bugs o solicitar componentes abre un issue en GitHub. Cualquier aporte es bienvenido.