@grafana/ui
Important: This documentation is about an older version. It's relevant only to the release noted, many of the features and functions have been updated or replaced. Please view the current version.
@grafana/ui package
A library containing the different design components of the Grafana ecosystem.
Classes
Class | Description |
---|---|
BarGauge | |
BigValue | |
Cascader | |
ClickOutsideWrapper | |
ErrorBoundary | |
ErrorBoundaryAlert | |
Gauge | |
Graph | This is a react wrapper for the angular, flot based graph visualization. Rather than using this component, you should use the `<PanelRender …/> with timeseries panel configs. |
GraphNG | “Time as X” core component, expects ascending x |
GraphSeriesToggler | |
JsonExplorer | JsonExplorerJsonExplorer allows you to render JSON objects in HTML with a **collapsible** navigation. |
JSONFormatter | |
List | |
ModalsProvider | |
Popover | |
PopoverController | |
RefreshPicker | |
SelectValueEditor | |
SetInterval | |
StatsPicker | |
StringArrayEditor | |
UnitPicker | |
UPlotConfigBuilder | |
VizRepeater |
Enumerations
Enumeration | Description |
---|---|
BarGaugeDisplayMode | |
BigValueColorMode | |
BigValueGraphMode | |
BigValueJustifyMode | |
BigValueTextMode | Options for how the value & title are to be displayed |
CompletionItemKind | |
EventsWithValidation | |
LegacyInputStatus | |
NodeGraphDataFrameFieldNames | |
SeriesVisibilityChangeBehavior |
Functions
Interfaces
Namespaces
Namespace | Description |
---|---|
commonOptionsBuilder | |
DOMUtil | |
Modal | |
RadioButtonGroup | |
ReactUtils | |
styleMixins | |
VizLegend |
Variables
Type Aliases
Was this page helpful?
Related documentation
Related resources from Grafana Labs
Additional helpful documentation, links, and articles:
5 Mar
![Getting started with managing your metrics, logs, and traces using Grafana](/static/assets/featured/getting-started-with-grafana-lgtm-stack-amer_featured.png?w=200 200w, /static/assets/featured/getting-started-with-grafana-lgtm-stack-amer_featured.png?w=400 400w)
Getting started with managing your metrics, logs, and traces using Grafana
In this webinar, we’ll demo how to get started using the LGTM Stack: Loki for logs, Grafana for visualization, Tempo for traces, and Mimir for metrics.
60 min
![Getting started with Grafana dashboard design](/static/assets/featured/getting-started-with-grafana-dashboard-design_featured.png?w=200 200w, /static/assets/featured/getting-started-with-grafana-dashboard-design_featured.png?w=400 400w)
Getting started with Grafana dashboard design
In this webinar, you'll learn how to design stylish and easily accessible Grafana dashboards that tell a story.
60 min
![Building advanced Grafana dashboards](/media/webinar/AMER_buildadv_notxt.png?w=200 200w, /media/webinar/AMER_buildadv_notxt.png?w=400 400w)
Building advanced Grafana dashboards
In this webinar, we’ll demo how to build and format Grafana dashboards.