fn_registry/frontend/functions/ui/pie_chart.md

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

name	kind	lang	domain	version	purity	signature	description	tags	uses_functions	uses_types	returns	returns_optional	error_type	imports	tested	tests	test_file_path	file_path	props	emits	has_state	framework	variant
pie_chart	component	ts	ui	1.0.0	impure	PieChart(props: PieChartProps): JSX.Element	Gráfico de torta/dona Recharts con Cell por segmento, colores automáticos, labels con porcentaje, Legend y Tooltip temático. Soporte donut con innerRadius configurable.	chart pie donut visualization recharts component ui dashboard	cn_ts_core			false		recharts	false			frontend/functions/ui/pie_chart.tsx	name type required description data Record<string, unknown>[] true Array de datos. Los valores de valueKey se convierten a number automáticamente. name type required description nameKey string true Key del campo que contiene el nombre/etiqueta de cada segmento name type required description valueKey string true Key del campo numérico que determina el tamaño de cada segmento name type required description colors string[] false Paleta de colores hex. Default: 8 colores accesibles. Se repite cíclicamente. name type required description donut boolean false Modo dona. innerRadius pasa a 50 por defecto cuando donut=true. name type required description innerRadius number false Radio interno en px. Sobreescribe el default calculado por donut. name type required description outerRadius number false Radio externo en px. Default 100. name type required description showLegend boolean false Mostrar leyenda. Default true. name type required description showLabels boolean false Mostrar labels nombre+% en cada segmento. Default true. name type required description height number | string false Altura del contenedor. Default 300. name type required description valueFormatter (value: number) => string false Formateador de valores para el tooltip. Default toLocaleString.		false	react	pie donut

Ejemplo

// Pie simple
<PieChart
  data={[{ lang: 'Go', count: 42 }, { lang: 'Python', count: 28 }, { lang: 'Bash', count: 15 }]}
  nameKey="lang"
  valueKey="count"
/>

// Dona sin labels
<PieChart
  data={distributions}
  nameKey="domain"
  valueKey="functions"
  donut
  showLabels={false}
  valueFormatter={(v) => `${v} fns`}
/>

Notas

Extraido y generalizado desde apps/rapid_dashboards/frontend/src/components/widgets/PieChartWidget.tsx. Los valores de valueKey se convierten a Number() para garantizar que Recharts los interprete correctamente (útil cuando los datos vienen de SQLite como strings). El ResponsiveContainer ocupa el 100% del ancho del padre.