fn_registry/frontend/functions/ui/sparkline.md

name, kind, lang, domain, version, purity, signature, description, tags, uses_functions, uses_types, returns, returns_optional, error_type, imports, output, tested, tests, test_file_path, file_path, props, emits, has_state, framework, variant, source_repo, source_license, source_file

name	kind	lang	domain	version	purity	signature	description	tags	uses_functions	uses_types	returns	returns_optional	error_type	imports	output	tested	tests	test_file_path	file_path	props	emits	has_state	framework	variant	source_repo	source_license	source_file
sparkline	component	ts	ui	1.0.0	impure	Sparkline(props: SparklineProps): JSX.Element	Mini gráfico inline SVG puro (sin Recharts) con variantes line, area y bar. Para KPI cards y tablas.	sparkline chart inline svg component ui visualization pendiente-usar				false		react	Componente Sparkline que renderiza mini gráfico SVG inline con variantes line, area y bar	false			frontend/functions/ui/sparkline.tsx	name type required description data number[] true Array de valores numéricos name type required description variant 'line' | 'area' | 'bar' false Tipo de visualización name type required description color string false Color del gráfico name type required description colors string[] false Colores por barra para variant 'bar'. Cicla si es más corto que data. name type required description width number false Ancho en px (default 80) name type required description height number false Alto en px (default 24)		false	react	line area bar	https://gitea-dgg044oo04woo4ggcsws4gk0.organic-machine.com/Bl4cksmith/Frontend_Library	MIT	frontend/src/components/ui/sparkline.tsx

Ejemplo

<Sparkline data={[10, 25, 15, 40, 30, 55]} variant="area" color="#22c55e" />
<Sparkline data={[5, 3, 8, 1, 9]} variant="bar" width={60} height={20} />

Notas

SVG puro — sin dependencia de Recharts. Ideal para inline en tablas y cards.