Dashboard Components

The dashboard module is a self-contained analytics engine built on Recharts. It provides a plug-and-play dashboard with lazy loading, drag-and-drop layout, tabbed navigation, and a flexible chart configuration API.

Exports

Export	Type	Description
GenericDashboard	Component	Full dashboard shell with tabs, lazy charts, and parameter forms
DashboardTabs	Component	Tab navigation bar
ReportChart	Component	Single chart card with parameter form
GenericChart	Component	Raw chart renderer (bar, line, pie, area)
GroupedChart	Component	Grouped/stacked bar or line chart
KpiCardsGrid	Component	Responsive grid of KPI metric cards
TableChart	Component	Tabular data chart
parseReportToChartConfig	Utility fn	Converts API report response to chart config
formatValue	Utility fn	Human-readable number/currency formatting
formatAxisValue	Utility fn	Abbreviated axis label (1K, 1M, etc.)
parseNumericValue	Utility fn	Safe numeric parsing
rotateArray	Utility fn	Rotate chart color array
CHART_COLORS	Constant	Default chart palette (16 colours)
DEFAULT_SERIES_COLORS	Constant	Series colour assignment map
BLUE_PALETTE	Constant	Blue tint palette array
DUMMY_TABS	Constant	Sample tab definitions for development
DUMMY_CHART_DEFINITIONS	Constant	Sample chart definitions for development
DUMMY_CHART_DATA	Constant	Sample chart data for development

Import

import { GenericDashboard, KpiCardsGrid, GenericChart, CHART_COLORS } from "@xocialive/ui-components";

Quick start

See GenericDashboard for a full working example.