Widgets
Widgets are the visual building blocks of a Dashboard Hub dashboard. Each widget has a type, size, configuration, data binding, and optional refresh strategy.
Widget lifecycle
Select Type
Pick a KPI, chart, table, filter, or container
Bind Data
Choose a data source and map fields
Tune Display
Set size, style, and widget-specific options
Set Refresh
Polling, WebSocket, or manual updates
Place and Save
Add to a container and persist the dashboard
Widget categories
The service registry seeds a broad library. Common categories and examples:
Metrics and analytics
| Widget | Use it for |
|---|---|
| Single Metric / KPI Widget | Headline numbers with optional trend |
| Circular Gauge | Value within a bounded range |
| Sparkline | Compact trend beside a metric |
| Comparison | Side-by-side value comparison |
| Status Indicator | Health / state signal |
| Progress Bar | Completion toward a target |
Visualization
| Widget | Use it for |
|---|---|
| Line / Area Chart | Time-series trends |
| Bar Chart | Category comparisons |
| Pie / Donut Chart | Part-to-whole breakdowns |
| Radar / Scatter / Heat Map | Multi-dimension or density views |
| Funnel / Tree Map / Waterfall | Conversion, hierarchy, and bridge analysis |
Data display
| Widget | Use it for |
|---|---|
| Data Table | Tabular operational records |
| JSON Viewer | Raw payload inspection |
| Markdown Renderer | Narrative or runbook content on the board |
Controls
| Widget | Use it for |
|---|---|
| Form Builder | Lightweight input forms |
| Dropdown Filter / Search Input | Interactive filtering of sibling widgets |
| Calendar View | Date-oriented browsing |
Productivity and content
| Widget | Use it for |
|---|---|
| Task List | Lightweight work tracking on a dashboard |
| Image Gallery / Video Player | Media context |
| Map Viewer | Geo presentation |
| Social Feed | Feed-style content blocks |
Composition
| Widget | Use it for |
|---|---|
| Nested Container | Embed another container structure inside a widget slot |
Exact availability depends on the widget-types registry deployed with your service.
Sizing
Widgets use size presets such as small, medium, large, xlarge, and custom, with min/max grid bounds per type. Charts generally need more height than compact KPIs or filters. Auto-fit can measure content and move a widget to a custom size when enabled.
Configuration concerns
| Concern | What to decide |
|---|---|
| Title | Clear label for operators |
| Data source | Mock, API, database, BizOps, or Service Catalogue |
| Field mapping | Which payload fields drive value/series/columns |
| Style variant | Accent, prefixes/suffixes, chart options |
| Multi-view | Alternate visualizations when supported |
| Refresh | How often and by which transport the widget updates |
Create vs add
IAM distinguishes:
| Capability | Meaning |
|---|---|
| widget.create | Create new widget definitions, edit, delete, and add them to containers |
| widget.add | Add an existing widget to a container and view runtime data |
widget.create implies widget.add. Assign the narrower grant when users should reuse a library without inventing new definitions.