@gambito-corp/mbs-library
Version:
Librería de componentes React reutilizables - Sistema de diseño modular y escalable
202 lines • 4.88 kB
JavaScript
export const TEXT_VARIANTS = {
default: {
label: 'Por defecto',
description: 'Texto estándar'
},
bold: {
label: 'Negrita',
description: 'Texto en negrita'
},
bolder: {
label: 'Extra negrita',
description: 'Texto muy grueso y prominente'
},
tiny: {
label: 'Diminuto',
description: 'Texto muy pequeño para detalles'
},
light: {
label: 'Ligero',
description: 'Texto con peso ligero'
},
cursiva: {
label: 'Cursiva',
description: 'Texto en estilo itálico'
},
subrayado: {
label: 'Subrayado',
description: 'Texto con línea inferior'
},
muted: {
label: 'Silenciado',
description: 'Texto discreto y suave'
},
gradient: {
label: 'Degradado',
description: 'Texto con degradado de 2 colores estático'
},
'gradient-animated': {
label: 'Degradado animado',
description: 'Texto con degradado de 2 colores animado'
},
neon: {
label: 'Neón',
description: 'Texto con efecto neón brillante pulsante'
},
typewriter: {
label: 'Máquina de escribir',
description: 'Texto que se escribe letra por letra'
}
};
export const TEXT_SIZES = {
xs: {
label: 'Extra pequeño',
description: 'Texto muy pequeño (12px)'
},
small: {
label: 'Pequeño',
description: 'Texto pequeño (14px)'
},
medium: {
label: 'Mediano',
description: 'Texto estándar (16px)'
},
large: {
label: 'Grande',
description: 'Texto grande (18px)'
},
xlarge: {
label: 'Extra grande',
description: 'Texto muy grande (20px)'
},
'2xl': {
label: '2X Grande',
description: 'Texto masivo (24px)'
}
};
export const TEXT_COLORS = {
default: {
label: 'Por defecto',
description: 'Color estándar del texto'
},
primary: {
label: 'Primario',
description: 'Color azul primario'
},
secondary: {
label: 'Secundario',
description: 'Color gris secundario'
},
success: {
label: 'Éxito',
description: 'Color verde de éxito'
},
warning: {
label: 'Advertencia',
description: 'Color amarillo de advertencia'
},
error: {
label: 'Error',
description: 'Color rojo de error'
},
info: {
label: 'Información',
description: 'Color azul de información'
},
white: {
label: 'Blanco',
description: 'Texto blanco'
},
black: {
label: 'Negro',
description: 'Texto negro'
}
};
export const TEXT_GRADIENTS = {
'blue-purple': {
label: 'Azul a Púrpura',
from: '#3b82f6',
to: '#8b5cf6'
},
'red-orange': {
label: 'Rojo a Naranja',
from: '#ef4444',
to: '#f97316'
},
'green-blue': {
label: 'Verde a Azul',
from: '#10b981',
to: '#06b6d4'
},
'purple-pink': {
label: 'Púrpura a Rosa',
from: '#8b5cf6',
to: '#ec4899'
},
'yellow-red': {
label: 'Amarillo a Rojo',
from: '#f59e0b',
to: '#ef4444'
},
'cyan-purple': {
label: 'Cian a Púrpura',
from: '#06b6d4',
to: '#8b5cf6'
}
};
export const TEXT_NEON_COLORS = {
cyan: {
label: 'Cian neón',
color: '#00ffff',
description: 'Neón azul cian clásico'
},
pink: {
label: 'Rosa neón',
color: '#ff00ff',
description: 'Neón rosa vibrante'
},
green: {
label: 'Verde neón',
color: '#00ff00',
description: 'Neón verde brillante'
},
orange: {
label: 'Naranja neón',
color: '#ff6600',
description: 'Neón naranja intenso'
},
purple: {
label: 'Púrpura neón',
color: '#9900ff',
description: 'Neón púrpura eléctrico'
},
yellow: {
label: 'Amarillo neón',
color: '#ffff00',
description: 'Neón amarillo brillante'
},
red: {
label: 'Rojo neón',
color: '#ff0040',
description: 'Neón rojo intenso'
},
blue: {
label: 'Azul neón',
color: '#0080ff',
description: 'Neón azul eléctrico'
}
};
export const TYPEWRITER_CONFIG = {
speeds: {
slow: 150,
normal: 80,
fast: 40,
veryFast: 20
},
cursors: {
classic: '|',
block: '█',
underscore: '_',
none: ''
}
};