# GoodData.UI Documentation

> GoodData.UI: A React SDK, Web Components, and REST API clients for building analytics into your application.

Every link below is a page as Markdown (index.md); the same URL without index.md is the HTML page. Each Markdown page starts with a link back to this file. The documentation home page: https://www.gooddata.ai/docs/gooddata-ui/latest/

## Getting started

- [Getting started](https://www.gooddata.ai/docs/gooddata-ui/latest/getting-started/index.md): GoodData.UI is the official React SDK for embedding GoodData analytics, from single charts and filters to whole dashboards and the AI assistant, directly into your application. (explanation)
- [Add GoodData.UI to an existing React app](https://www.gooddata.ai/docs/gooddata-ui/latest/getting-started/installation/index.md): Add GoodData.UI to an existing React application by installing the packages, importing the styles, connecting the analytical backend, and rendering a dashboard your users pick from a list. (howto)
- [Quick start](https://www.gooddata.ai/docs/gooddata-ui/latest/getting-started/quickstart/index.md): Scaffold a GoodData.UI React app with app-toolkit, render a dashboard and a chart you define in code, read raw data, apply a theme, and connect your own workspace. (tutorial)
- [Platform compatibility](https://www.gooddata.ai/docs/gooddata-ui/latest/getting-started/platform-compatibility/index.md): Which GoodData.UI major works with GoodData Cloud, GoodData.CN, and GoodData Legacy, the Node.js, React, and TypeScript versions it needs, and which frameworks it supports. (reference)
- [LLMs](https://www.gooddata.ai/docs/gooddata-ui/latest/getting-started/llms/index.md): The llms.txt index, the full text of the guides, and the Markdown version of every page, for LLMs and AI coding assistants. (reference)

## Visualizations

- [Visualizations](https://www.gooddata.ai/docs/gooddata-ui/latest/visualisations/index.md): Chart and table components for rendering analytics data. (reference)
- [Charts and plots](https://www.gooddata.ai/docs/gooddata-ui/latest/visualisations/charts-and-plots/index.md): Shared behavior of GoodData.UI visual components — responsive sizing, the style and data props model, and the visualization lifecycle callbacks. (explanation)
- [InsightView](https://www.gooddata.ai/docs/gooddata-ui/latest/visualisations/insightview/index.md): Render any saved GoodData visualization by reference with the InsightView component. (reference)
- [Chart configuration](https://www.gooddata.ai/docs/gooddata-ui/latest/visualisations/chart-config/index.md): Configure chart appearance, axes, legends, colors, and data labels. (reference)
- [Area chart](https://www.gooddata.ai/docs/gooddata-ui/latest/visualisations/area-chart/index.md): Display trends over time with filled areas using the AreaChart component. (reference)
- [Bar chart](https://www.gooddata.ai/docs/gooddata-ui/latest/visualisations/bar-chart/index.md): Display horizontal bar comparisons with the BarChart component. (reference)
- [Bubble chart](https://www.gooddata.ai/docs/gooddata-ui/latest/visualisations/bubble-chart/index.md): Show three-dimensional data relationships using the BubbleChart component. (reference)
- [Bullet chart](https://www.gooddata.ai/docs/gooddata-ui/latest/visualisations/bullet-chart/index.md): Compare measures against targets using the BulletChart component. (reference)
- [Column chart](https://www.gooddata.ai/docs/gooddata-ui/latest/visualisations/column-chart/index.md): Display vertical bar comparisons with the ColumnChart component. (reference)
- [Combo chart](https://www.gooddata.ai/docs/gooddata-ui/latest/visualisations/combo-chart/index.md): Combine bars and lines in a single visualization with the ComboChart component. (reference)
- [Dependency wheel chart](https://www.gooddata.ai/docs/gooddata-ui/latest/visualisations/dependency-wheel/index.md): Visualize flows and relationships between categories with the DependencyWheel component. (reference)
- [Donut chart](https://www.gooddata.ai/docs/gooddata-ui/latest/visualisations/donut-chart/index.md): Show proportions as a ring chart with the DonutChart component. (reference)
- [Funnel chart](https://www.gooddata.ai/docs/gooddata-ui/latest/visualisations/funnel-chart/index.md): Display sequential stages of a process with the FunnelChart component. (reference)
- [Geo area chart](https://www.gooddata.ai/docs/gooddata-ui/latest/visualisations/geo-area-chart/index.md): Show geographic data as colored regions on a map with the GeoAreaChart component. (reference)
- [Geo chart](https://www.gooddata.ai/docs/gooddata-ui/latest/visualisations/geo-chart/index.md): Display geographic data on an interactive map with the GeoChart component. (reference)
- [Geo pushpin chart](https://www.gooddata.ai/docs/gooddata-ui/latest/visualisations/geo-pushpin-chart/index.md): Plot data points on a map with pushpin markers using the GeoPushpinChart component. (reference)
- [Headline](https://www.gooddata.ai/docs/gooddata-ui/latest/visualisations/headline/index.md): Display a single KPI value or comparison with the Headline component. (reference)
- [Heatmap](https://www.gooddata.ai/docs/gooddata-ui/latest/visualisations/heatmap/index.md): Visualize data density across two dimensions with the Heatmap component. (reference)
- [Line chart](https://www.gooddata.ai/docs/gooddata-ui/latest/visualisations/line-chart/index.md): Display data trends as connected points with the LineChart component. (reference)
- [Mekko chart](https://www.gooddata.ai/docs/gooddata-ui/latest/visualisations/mekko-chart/index.md): Compare two measures across variable-width stacked columns with the Mekko component. (reference)
- [Pie chart](https://www.gooddata.ai/docs/gooddata-ui/latest/visualisations/pie-chart/index.md): Show proportions of a whole with the PieChart component. (reference)
- [Pivot table](https://www.gooddata.ai/docs/gooddata-ui/latest/visualisations/pivot-table/index.md): Display data in a flexible, multi-dimensional table with the PivotTableNext component. (reference)
- [Pyramid chart](https://www.gooddata.ai/docs/gooddata-ui/latest/visualisations/pyramid-chart/index.md): Show hierarchical data as stacked layers with the PyramidChart component. (reference)
- [Radar chart](https://www.gooddata.ai/docs/gooddata-ui/latest/visualisations/radar-chart/index.md): Compare measure values across categories on radial axes with the RadarChart component. (reference)
- [Repeater](https://www.gooddata.ai/docs/gooddata-ui/latest/visualisations/repeater/index.md): Render repeated inline visualizations for each data row with the Repeater component. (reference)
- [Sankey chart](https://www.gooddata.ai/docs/gooddata-ui/latest/visualisations/sankey-chart/index.md): Visualize flow quantities between nodes with the SankeyChart component. (reference)
- [Scatter plot](https://www.gooddata.ai/docs/gooddata-ui/latest/visualisations/scatter-plot/index.md): Show correlation between two measures with the ScatterPlot component. (reference)
- [Treemap](https://www.gooddata.ai/docs/gooddata-ui/latest/visualisations/treemap/index.md): Display hierarchical data as nested rectangles with the Treemap component. (reference)
- [Waterfall chart](https://www.gooddata.ai/docs/gooddata-ui/latest/visualisations/waterfall-chart/index.md): Show cumulative contributions to a total with the WaterfallChart component. (reference)

## Dashboard & plugins

- [Dashboard & plugins](https://www.gooddata.ai/docs/gooddata-ui/latest/dashboard-plugins/index.md): Find components and hooks for embedding dashboards, building plugins, dispatching commands and events, reading widget data, and managing automations. (reference)
- [Dashboard component](https://www.gooddata.ai/docs/gooddata-ui/latest/dashboard-plugins/dashboard/index.md): Embed a saved dashboard with Dashboard, read its state through selectors, dispatch commands, handle events, configure behavior, and access its store externally. (reference)
- [Dashboard plugins](https://www.gooddata.ai/docs/gooddata-ui/latest/dashboard-plugins/dashboard-plugins/index.md): Understand the dashboard plugin contract, lifecycle, bundling, runtime behavior, and maintenance requirements. (explanation)
- [Develop your first dashboard plugin](https://www.gooddata.ai/docs/gooddata-ui/latest/dashboard-plugins/develop-your-first-plugin/index.md): Scaffold a dashboard plugin, run it against a live dashboard, then build, host, register, and link it. (tutorial)
- [Dashboard plugin API](https://www.gooddata.ai/docs/gooddata-ui/latest/dashboard-plugins/dashboard-plugins-api/index.md): Implement the dashboard plugin lifecycle, customize visualizations, widgets, layouts, filters, and exports, and register dashboard event handlers. (reference)
- [Handle dashboard events](https://www.gooddata.ai/docs/gooddata-ui/latest/dashboard-plugins/dashboard-events/index.md): Register typed handlers for Dashboard component events, read state and dispatch commands from a handler, and match commands to events. (howto)
- [Embed a dashboard with plugins](https://www.gooddata.ai/docs/gooddata-ui/latest/dashboard-plugins/embed-dashboard-with-plugins/index.md): Render a dashboard in your React application with its plugins, bundled with your app, linked in the workspace, or both. (howto)
- [Customize widgets and visualizations](https://www.gooddata.ai/docs/gooddata-ui/latest/dashboard-plugins/customize-widgets/index.md): Choose which layer of a dashboard widget to replace (the widget, the visualization, or its body) and how drills flow through custom renderers. (howto)
- [Customize dashboard export](https://www.gooddata.ai/docs/gooddata-ui/latest/dashboard-plugins/customize-dashboard-export/index.md): Trigger a whole-dashboard export to PDF, PPTX, or tabular format, make custom widgets export-ready, and customize how a dashboard decomposes into export slides. (howto)
- [Customize the alert and scheduled email dialogs](https://www.gooddata.ai/docs/gooddata-ui/latest/dashboard-plugins/customize-automation-dialogs/index.md): Replace, slot, decorate, or compose the alert and scheduled email dialogs that the Dashboard component opens, and replace the management dialogs that list them. (howto)
- [Improve dashboard performance](https://www.gooddata.ai/docs/gooddata-ui/latest/dashboard-plugins/dashboard-performance/index.md): Configure backend response caching with withCaching, including execution result expiration, cache limits, and the recommended defaults. (howto)
- [Upgrade dashboard plugins](https://www.gooddata.ai/docs/gooddata-ui/latest/dashboard-plugins/dashboard-plugins-upgrade/index.md): Upgrade a dashboard plugin by rebuilding it from the latest toolkit template or updating its dependencies and configuration before testing and deployment. (howto)
- [useDashboardDispatch](https://www.gooddata.ai/docs/gooddata-ui/latest/dashboard-plugins/use-dashboard-dispatch/index.md): Get the dispatch function of the dashboard store with the alpha useDashboardDispatch hook, or use the public useDispatchDashboardCommand. (reference)
- [useDashboardEventDispatch](https://www.gooddata.ai/docs/gooddata-ui/latest/dashboard-plugins/use-dashboard-event-dispatch/index.md): Dispatch built-in or custom dashboard events from a plugin component with the alpha useDashboardEventDispatch hook. (reference)
- [useDashboardSelector](https://www.gooddata.ai/docs/gooddata-ui/latest/dashboard-plugins/use-dashboard-selector/index.md): Read Dashboard component state with useDashboardSelector and the select* selectors, from components, event handlers, and outside code. (reference)
- [useWidgetFilters](https://www.gooddata.ai/docs/gooddata-ui/latest/dashboard-plugins/use-widget-filters/index.md): Resolve the effective filters of a dashboard widget and visualization, ready to apply with insightSetFilters before execution. (reference)
- [useCustomWidgetExecutionDataView and useCustomWidgetInsightDataView](https://www.gooddata.ai/docs/gooddata-ui/latest/dashboard-plugins/use-custom-widget-data-view/index.md): Load execution or visualization data inside a custom dashboard widget with the dashboard filters applied automatically. (reference)

## Filters

- [Filters](https://www.gooddata.ai/docs/gooddata-ui/latest/filters/index.md): Filter components and hooks for building interactive analytics UIs. (explanation)
- [Customize the date filter presets](https://www.gooddata.ai/docs/gooddata-ui/latest/filters/customize-date-filter-presets/index.md): Change the granularities and presets that dashboard date filters offer by creating the dateFilterConfig organization or workspace setting. (howto)
- [Apply filters to visualizations](https://www.gooddata.ai/docs/gooddata-ui/latest/filters/filter-visual-components/index.md): Create attribute, date, measure-value, and ranking filters and apply them to charts, InsightView, or individual measures. (howto)
- [Attribute filter](https://www.gooddata.ai/docs/gooddata-ui/latest/filters/attribute-filter/index.md): Configure AttributeFilter with a filter definition or placeholder, handle selection changes, choose selection behavior, and replace its UI components. (reference)
- [Attribute filter button](https://www.gooddata.ai/docs/gooddata-ui/latest/filters/attribute-filter-button/index.md): Configure AttributeFilterButton with a filter definition or placeholder, handle selected values, choose single or multiple selection, and replace its UI components. (reference)
- [Date filter](https://www.gooddata.ai/docs/gooddata-ui/latest/filters/date-filter/index.md): Configure DateFilter with filter options, granularities, and a date format, and handle the applied selection. (reference)
- [Measure value filter](https://www.gooddata.ai/docs/gooddata-ui/latest/filters/measure-value-filter/index.md): Let users edit and apply a measure value filter, configure input formatting and null handling, or render the dropdown with a custom toggle button. (reference)
- [Ranking filter](https://www.gooddata.ai/docs/gooddata-ui/latest/filters/ranking-filter/index.md): Let users edit and apply a ranking filter to a visualization, or render the filter dropdown with a custom toggle button. (reference)
- [Inspect filter objects](https://www.gooddata.ai/docs/gooddata-ui/latest/filters/inspecting-filters/index.md): Split an IFilter array by kind, find the filter for a display form, read or replace the selected elements, and detect an empty selection without reading filter internals. (howto)
- [useAttributeFilterController](https://www.gooddata.ai/docs/gooddata-ui/latest/filters/use-attribute-filter-controller/index.md): Build fully custom attribute filter UIs with SDK-managed state, elements loading, and apply callbacks. (reference)
- [useAttributeFilterHandler](https://www.gooddata.ai/docs/gooddata-ui/latest/filters/use-attribute-filter-handler/index.md): Access the IMultiSelectAttributeFilterHandler Core API directly for low-level attribute filter control. (reference)

## AI & modules

- [AI & modules](https://www.gooddata.ai/docs/gooddata-ui/latest/ai-modules/index.md): AI features and high-level UI modules that you embed as React components. (explanation)
- [AI Assistant](https://www.gooddata.ai/docs/gooddata-ui/latest/ai-modules/ai-assistant/index.md): Components, events, slots, and actions of the AI Assistant chat in @gooddata/sdk-ui-gen-ai. (reference)
- [Combine the AI Assistant with your app](https://www.gooddata.ai/docs/gooddata-ui/latest/ai-modules/ai-assistant-layout/index.md): Switch the AI Assistant between docked and fullscreen layouts, show the conversations list next to the chat, connect the assistant to a dashboard, and hand it a Semantic Search query. (howto)
- [Customize the AI Assistant](https://www.gooddata.ai/docs/gooddata-ui/latest/ai-modules/customize-ai-assistant/index.md): Replace or wrap parts of the AI Assistant UI through slots, from the landing screen and the agent chooser to messages, follow-up questions, and feedback. (howto)
- [Control the AI Assistant from your code](https://www.gooddata.ai/docs/gooddata-ui/latest/ai-modules/control-ai-assistant/index.md): Get the AI Assistant store dispatcher, send messages, reset the thread, manage conversations, switch agents and context, and migrate from makeUserMessage to makeUserItem. (howto)
- [Semantic Search](https://www.gooddata.ai/docs/gooddata-ui/latest/ai-modules/semantic-search/index.md): Embed natural-language search for analytical objects with the SemanticSearch component or the useSemanticSearch hook, and filter results by object type or tag. (reference)
- [Analytics Catalog](https://www.gooddata.ai/docs/gooddata-ui/latest/ai-modules/analytics-catalog/index.md): Embed the AnalyticsCatalog explorer to let users browse and search the metrics, attributes, facts, datasets, visualizations, and dashboards of a workspace. (reference)
- [Notifications panel](https://www.gooddata.ai/docs/gooddata-ui/latest/ai-modules/notifications-panel/index.md): Display and manage notifications with NotificationsPanel, configure refresh and inline or overlay rendering, and customize the panel's individual UI elements. (reference)
- [Key Driver Analysis](https://www.gooddata.ai/docs/gooddata-ui/latest/ai-modules/key-driver-analysis/index.md): Where Key Driver Analysis shows up in GoodData.UI, what a dashboard visualization needs for the "Run Key Driver Analysis" action to appear, and how to observe the analysis through dashboard events. (explanation)
- [Automations](https://www.gooddata.ai/docs/gooddata-ui/latest/ai-modules/automations/index.md): Embed the internal Automations list at workspace or organization scope, configure its filters and columns, and handle individual or bulk actions. (reference)
- [Build tool integrations](https://www.gooddata.ai/docs/gooddata-ui/latest/ai-modules/integrations/index.md): Bundler and editor setup that the AI Assistant components need. (explanation)
- [Deduplicate CodeMirror 6 for the AI Assistant](https://www.gooddata.ai/docs/gooddata-ui/latest/ai-modules/integrations/codemirror-genai/index.md): Configure webpack or Vite to dedupe the CodeMirror 6 packages so the AI Assistant chat input works. (howto)

## Data layer

- [Data layer](https://www.gooddata.ai/docs/gooddata-ui/latest/data-layer/index.md): Execute analytics queries, work with the data model, and consume results programmatically. (reference)
- [Execute](https://www.gooddata.ai/docs/gooddata-ui/latest/data-layer/execute/index.md): Fetch and render backend data with the Execute component using series, slices, filters, and a render-prop child. (reference)
- [RawExecute](https://www.gooddata.ai/docs/gooddata-ui/latest/data-layer/raw-execute/index.md): Run a prepared execution and pass the resulting data view to a render-prop child. (reference)
- [ExecuteInsight](https://www.gooddata.ai/docs/gooddata-ui/latest/data-layer/execute-insight/index.md): Run a saved visualization and pass the resulting data view to a render-prop child. (reference)
- [useInsightDataView](https://www.gooddata.ai/docs/gooddata-ui/latest/data-layer/use-insight-data-view/index.md): Load a saved visualization by reference and return its execution result as a DataViewFacade with optional filters and sorting. (reference)
- [useExecutionDataView](https://www.gooddata.ai/docs/gooddata-ui/latest/data-layer/use-execution-data-view/index.md): Fetch execution data as a DataViewFacade from a prepared execution or inline seriesBy/slicesBy configuration. (reference)
- [useCancelablePromise](https://www.gooddata.ai/docs/gooddata-ui/latest/data-layer/use-cancelable-promise/index.md): Track promise status in React with automatic cancellation of stale results when dependencies change. (reference)
- [useDataExport](https://www.gooddata.ai/docs/gooddata-ui/latest/data-layer/use-data-export/index.md): Use useDataExport to run CSV, XLSX, or raw exports from a prepared execution, handle export lifecycle callbacks, and retrieve the download URI. (reference)
- [usePagedResource](https://www.gooddata.ai/docs/gooddata-ui/latest/data-layer/use-paged-resource/index.md): Fetch and accumulate items from a paginated SDK resource, with fetch and reset dependency lists. (reference)
- [Data model](https://www.gooddata.ai/docs/gooddata-ui/latest/data-layer/data-model/index.md): Build and inspect the SDK model objects that describe what to compute: references, attributes, measures, hierarchies, and placeholders. (reference)
- [Working with object references](https://www.gooddata.ai/docs/gooddata-ui/latest/data-layer/data-model/object-references/index.md): Compare, key, narrow, and print ObjRef values with areObjRefsEqual, serializeObjRef, and the type guards instead of reading identifier fields by hand. (reference)
- [Working with attributes](https://www.gooddata.ai/docs/gooddata-ui/latest/data-layer/data-model/attributes/index.md): Create and modify IAttribute objects with newAttribute, apply optional local identifiers and alias overrides. (reference)
- [Working with measures](https://www.gooddata.ai/docs/gooddata-ui/latest/data-layer/data-model/measures/index.md): Create simple measures with newMeasure, arithmetic measures from two operands with newArithmeticMeasure, and inline MAQL measures with newInlineMeasure. (reference)
- [Read attribute hierarchies](https://www.gooddata.ai/docs/gooddata-ui/latest/data-layer/data-model/attribute-hierarchies/index.md): Read attribute hierarchies from the workspace catalog, and list them from a dashboard plugin. (howto)
- [Working with visualization objects](https://www.gooddata.ai/docs/gooddata-ui/latest/data-layer/data-model/insights/index.md): Read measures, attributes, filters, and identity from IInsight with the insight* accessors, and derive copies with insightSet*. (reference)
- [Swap visualization inputs with placeholders](https://www.gooddata.ai/docs/gooddata-ui/latest/data-layer/data-model/visualization-placeholders/index.md): Create common and composed visualization definition placeholders, update and resolve their values with React hooks, and use them with TypeScript. (howto)
- [Load the workspace catalog at runtime](https://www.gooddata.ai/docs/gooddata-ui/latest/data-layer/data-model/workspace-catalog/index.md): Load measures, attributes, and date datasets while your application runs, and turn catalog items into IMeasure and IAttribute objects. (howto)
- [Generate a typed catalog](https://www.gooddata.ai/docs/gooddata-ui/latest/data-layer/data-model/export-catalog/index.md): Install and configure @gooddata/catalog-export to generate JavaScript or TypeScript constants for the Logical Data Model objects in a workspace. (howto)
- [Execution](https://www.gooddata.ai/docs/gooddata-ui/latest/data-layer/execution/index.md): Define what the backend computes and how the result is shaped: dimensions, sorting, totals, derived measures, and data sampling. (reference)
- [Execution model](https://www.gooddata.ai/docs/gooddata-ui/latest/data-layer/execution/execution-model/index.md): Create, inspect, and modify execution attributes, filters, measures, and sort items with SDK model factories, builders, and accessors. (reference)
- [Run a custom execution](https://www.gooddata.ai/docs/gooddata-ui/latest/data-layer/execution/custom-executions/index.md): Build custom executions with attributes, measures, filters, sorting, and dimensions via the Analytical Backend fluent API. (howto)
- [Result structure](https://www.gooddata.ai/docs/gooddata-ui/latest/data-layer/execution/result-structure/index.md): Define execution dimensions, totals, and sorting, then read computed data through execution results, data views, and DataViewFacade. (reference)
- [Add totals to a table](https://www.gooddata.ai/docs/gooddata-ui/latest/data-layer/execution/table-totals/index.md): Add grand totals and subtotals to Pivot Tables with newTotal, covering sum, avg, min, max, median, and rollup aggregations. (howto)
- [Compare a measure with a previous period](https://www.gooddata.ai/docs/gooddata-ui/latest/data-layer/execution/time-over-time/index.md): Create same-period-last-year and previous-period derived measures with newPopMeasure and newPreviousPeriodMeasure. (howto)
- [Sample data to speed up executions](https://www.gooddata.ai/docs/gooddata-ui/latest/data-layer/execution/data-sampling/index.md): Speed up visualizations by processing a percentage of dataset rows using the execConfig dataSamplingPercentage option. (howto)

## Integrations

- [Integrations](https://www.gooddata.ai/docs/gooddata-ui/latest/integrations/index.md): Connect GoodData.UI to your application environment: authentication, embedding, theming, and framework support. (reference)
- [Integrate into an existing application](https://www.gooddata.ai/docs/gooddata-ui/latest/integrations/backend-setup/index.md): Add GoodData.UI to an existing React application by installing packages and styles, configuring backend and workspace contexts, CORS, and authentication. (howto)
- [Authenticate to the backend](https://www.gooddata.ai/docs/gooddata-ui/latest/integrations/authentication/index.md): Pick how your GoodData.UI application authenticates against GoodData Cloud or GoodData.CN — the GoodData session cookie, a JWT from your own portal, or an API token — and set it up. (howto)
- [Renew the session without a redirect](https://www.gooddata.ai/docs/gooddata-ui/latest/integrations/renew-session-silently/index.md): Build an authentication provider that renews an expired GoodData session in a hidden iframe, so users keep their place in the app instead of being sent to the login page. (howto)
- [Resolve cross-origin errors](https://www.gooddata.ai/docs/gooddata-ui/latest/integrations/cross-origin-issues/index.md): Resolve CORS errors between your app and GoodData Cloud or GoodData.CN by proxying the API through your dev server or allowing your origin in production. (howto)
- [Embedding](https://www.gooddata.ai/docs/gooddata-ui/latest/integrations/embedding/index.md): Embed GoodData content at different levels — full dashboards, individual visualizations, or custom visualizations using your own charting library — and apply theming. (reference)
- [Embed dashboards](https://www.gooddata.ai/docs/gooddata-ui/latest/integrations/embedding/embed-dashboards/index.md): Choose among a built-in dashboard embedded through an iframe, the Dashboard component, and a custom dashboard by comparing their integration, customization, and implementation trade-offs. (explanation)
- [Embed visualizations](https://www.gooddata.ai/docs/gooddata-ui/latest/integrations/embedding/embed-visualizations/index.md): Render a visualization saved in Analyze with InsightView by getting its identifier, importing the component and styles, and setting its insight prop. (howto)
- [How custom visualizations get data](https://www.gooddata.ai/docs/gooddata-ui/latest/integrations/embedding/custom-visualizations/index.md): Understand the hooks, components, and backend API that feed custom visualizations, and how series, slices, and data points structure the result. (explanation)
- [Build a fully custom frontend](https://www.gooddata.ai/docs/gooddata-ui/latest/integrations/embedding/build-custom-frontend/index.md): Build an analytics screen with no GoodData visual components, only your own markup, by driving an execution, a headless attribute filter, a date filter, and a CSV export through GoodData.UI hooks. (tutorial)
- [Apply theming](https://www.gooddata.ai/docs/gooddata-ui/latest/integrations/embedding/apply-theming/index.md): Apply custom themes to GoodData.UI dashboards and visualizations by wrapping your app in ThemeProvider. (howto)
- [Web Components](https://www.gooddata.ai/docs/gooddata-ui/latest/integrations/web-components/index.md): Custom HTML elements that embed GoodData dashboards, visualizations, and the AI assistant in any framework or vanilla HTML, without a direct React dependency. (reference)
- [Web Components overview](https://www.gooddata.ai/docs/gooddata-ui/latest/integrations/web-components/web-components-overview/index.md): Understand what the Web Components library is, when to choose it over an iframe or the React library, how it loads, and what limits it has. (explanation)
- [Dashboard and visualization embed elements](https://www.gooddata.ai/docs/gooddata-ui/latest/integrations/web-components/embed-custom-elements/index.md): Embed a dashboard or a saved visualization with gd-dashboard-embed and gd-insight-embed, and drive them through properties, methods, and events. (reference)
- [Dashboard custom element](https://www.gooddata.ai/docs/gooddata-ui/latest/integrations/web-components/dashboard-custom-element/index.md): Embed a dashboard with gd-dashboard, configure its workspace, locale, and read-only mode, and subscribe to dashboard events. (reference)
- [Visualization custom element](https://www.gooddata.ai/docs/gooddata-ui/latest/integrations/web-components/insight-custom-element/index.md): Embed a saved visualization with the legacy gd-insight element, set its workspace, locale, title, filters, and size, and subscribe to its events. (reference)
- [AI Assistant custom element](https://www.gooddata.ai/docs/gooddata-ui/latest/integrations/web-components/ai-assistant-custom-element/index.md): Embed the AI Assistant with gd-ai-assistant, set its workspace and locale, subscribe to its chat events, and compose the chat from several elements. (reference)
- [Authenticate Web Components](https://www.gooddata.ai/docs/gooddata-ui/latest/integrations/web-components/web-components-auth/index.md): Authenticate Web Components against GoodData using the auth=sso script parameter for automatic SSO or setContext for a programmatic flow. (howto)
- [Framework guides](https://www.gooddata.ai/docs/gooddata-ui/latest/integrations/framework-integrations/index.md): Use GoodData.UI in Angular, Next.js, and Vue apps — framework-specific setup via React components or the Web Components wrapper. (reference)
- [Embed GoodData in an Angular app](https://www.gooddata.ai/docs/gooddata-ui/latest/integrations/framework-integrations/angular-integration/index.md): Embed GoodData dashboards, visualizations, and the AI Assistant in an Angular app with the Web Components library, custom element schemas, and event listeners. (howto)
- [Render GoodData.UI React components in Angular](https://www.gooddata.ai/docs/gooddata-ui/latest/integrations/framework-integrations/angular-react-integration/index.md): Wrap GoodData.UI React components in Angular components with createRoot, import their styles, and bind their props from Angular templates. (howto)
- [Add GoodData.UI to a Next.js app](https://www.gooddata.ai/docs/gooddata-ui/latest/integrations/framework-integrations/nextjs-integration/index.md): Render GoodData.UI charts in a Next.js App Router application with a client-side backend, the generated catalog, and the GoodData session cookie. (howto)
- [Embed GoodData in a Vue app](https://www.gooddata.ai/docs/gooddata-ui/latest/integrations/framework-integrations/vue-integration/index.md): Embed GoodData dashboards, visualizations, and the AI Assistant in a Vue app with the Web Components library, the Vite custom-element setting, and event listeners. (howto)
- [Interactivity](https://www.gooddata.ai/docs/gooddata-ui/latest/integrations/interactivity/index.md): Handle user interactions with visualizations, from drill events to loading and error states. (reference)
- [Make visualizations drillable](https://www.gooddata.ai/docs/gooddata-ui/latest/integrations/interactivity/drillable-items/index.md): Configure drillableItems with header predicates to make visualization measures or attributes interactive and receive drill event context. (howto)
- [Header predicates](https://www.gooddata.ai/docs/gooddata-ui/latest/integrations/interactivity/predicates/index.md): Match visualization headers for drilling with custom predicate functions or the HeaderPredicates helpers. (reference)
- [onDrill](https://www.gooddata.ai/docs/gooddata-ui/latest/integrations/interactivity/on-drill/index.md): Handle drill events with the onDrill callback when users click drillable items in InsightView and the chart components. (reference)
- [onExportReady](https://www.gooddata.ai/docs/gooddata-ui/latest/integrations/interactivity/on-export-ready/index.md): Capture the export function through onExportReady, configure CSV, XLSX, or PDF output, and call it to obtain the exported file. (reference)
- [onLegendReady](https://www.gooddata.ai/docs/gooddata-ui/latest/integrations/interactivity/on-legend-ready/index.md): Get the legend items of a chart through the onLegendReady callback so you can render a fully custom legend. (reference)
- [Handle errors](https://www.gooddata.ai/docs/gooddata-ui/latest/integrations/interactivity/handle-errors/index.md): Tell an empty result from a failure, ignore canceled requests, and react to authentication and size limits by narrowing SDK errors with the is* guards instead of matching on message text. (howto)
- [ErrorComponent](https://www.gooddata.ai/docs/gooddata-ui/latest/integrations/interactivity/error-component/index.md): Customize or disable the ErrorComponent indicator shown when a GoodData.UI visualization fails to render. (reference)
- [LoadingComponent](https://www.gooddata.ai/docs/gooddata-ui/latest/integrations/interactivity/loading-component/index.md): Customize or disable the LoadingComponent indicator shown while a GoodData.UI visualization fetches data. (reference)
- [Track user interactions](https://www.gooddata.ai/docs/gooddata-ui/latest/integrations/interactivity/track-user-interactions/index.md): Track how people use the dashboards, visualizations, and AI Assistant in your GoodData.UI application, and send the events to an external service for further analytics. (howto)
- [Hooks](https://www.gooddata.ai/docs/gooddata-ui/latest/integrations/hooks/index.md): Choose the matching React hook to read an SDK provider context or load a plugin-enhanced dashboard. (reference)
- [useBackend](https://www.gooddata.ai/docs/gooddata-ui/latest/integrations/hooks/use-backend/index.md): Retrieve the analytical backend from BackendProvider context, with an optional prop override or strict variant. (reference)
- [useWorkspace](https://www.gooddata.ai/docs/gooddata-ui/latest/integrations/hooks/use-workspace/index.md): Read the workspace identifier from WorkspaceProvider context, with an optional override and a strict variant that throws when unset. (reference)
- [useOrganization](https://www.gooddata.ai/docs/gooddata-ui/latest/integrations/hooks/use-organization/index.md): Read the organization identifier supplied to OrganizationProvider, returning the id string or undefined if unset. (reference)
- [useTheme](https://www.gooddata.ai/docs/gooddata-ui/latest/integrations/hooks/use-theme/index.md): Read the current theme from ThemeProvider context, with companion hooks for loading state and dark-mode detection. (reference)
- [useDashboardLoader](https://www.gooddata.ai/docs/gooddata-ui/latest/integrations/hooks/use-dashboard-loader/index.md): Load, bootstrap, and tear down a plugin-enhanced dashboard from React, returning status, result, and error state. (reference)
- [Platform](https://www.gooddata.ai/docs/gooddata-ui/latest/integrations/platform/index.md): Evaluate whether a GoodData.UI version and integration approach are suitable for your application and production environment. (reference)
- [Analytics as code](https://www.gooddata.ai/docs/gooddata-ui/latest/integrations/platform/analytics-as-code/index.md): What GoodData means by analytics as code, which tools manage the analytics in a GoodData workspace as files, and how that work connects to a GoodData.UI application. (explanation)
- [Architecture overview](https://www.gooddata.ai/docs/gooddata-ui/latest/integrations/platform/architecture-overview/index.md): How GoodData.UI's layered architecture and the Analytical Backend Service Provider Interface let you build backend-agnostic analytics applications. (explanation)
- [Version lifecycle and compatibility](https://www.gooddata.ai/docs/gooddata-ui/latest/integrations/platform/compatibility/index.md): Check the lifecycle phase and support dates of each GoodData.UI major version for GoodData Cloud, GoodData.CN, and GoodData Legacy. (reference)
- [ESM-only distribution](https://www.gooddata.ai/docs/gooddata-ui/latest/integrations/platform/esm-only/index.md): The entry points GoodData.UI's ESM-only packages expose, the bundler, TypeScript, Node, and test runner requirements, and fixes for the common CommonJS errors. (reference)
- [Supported frameworks](https://www.gooddata.ai/docs/gooddata-ui/latest/integrations/platform/supported-frameworks/index.md): Review officially supported frameworks (React, Web Components) plus Angular, Next.js, and Vue guides, with an external reference for SvelteKit. (reference)
- [API maturity](https://www.gooddata.ai/docs/gooddata-ui/latest/integrations/platform/api-maturity/index.md): Understand @alpha, @beta, @public, and @internal API stability annotations used across GoodData.UI packages. (reference)
- [Limitations](https://www.gooddata.ai/docs/gooddata-ui/latest/integrations/platform/limitations/index.md): Capabilities not yet supported by GoodData Cloud and GoodData.CN, and the entity-referencing rules that affect GoodData.UI components. (reference)

## API reference

- [API Reference](https://www.gooddata.ai/docs/gooddata-ui/latest/api-reference/index.md): every package of the reference, one page per exported symbol (@public and @beta). A package page lists its symbols by kind, each linked to its own Markdown page, which includes the symbol's members.
- [@gooddata/sdk-backend-spi](https://www.gooddata.ai/docs/gooddata-ui/latest/api-reference/sdk-backend-spi/index.md): This package provides definitions of the Service Provider Interface (SPI) for the Analytical Backend. (328 symbols)
- [@gooddata/sdk-backend-tiger](https://www.gooddata.ai/docs/gooddata-ui/latest/api-reference/sdk-backend-tiger/index.md): This package provides the Analytical Backend implementation for GoodData Cloud and GoodData.CN. (21 symbols)
- [@gooddata/sdk-code-convertors](https://www.gooddata.ai/docs/gooddata-ui/latest/api-reference/sdk-code-convertors/index.md): (139 symbols)
- [@gooddata/sdk-code-schemas](https://www.gooddata.ai/docs/gooddata-ui/latest/api-reference/sdk-code-schemas/index.md): GoodData AAC (Analytics as Code) JSON Schema types and compiled schemas. (655 symbols)
- [@gooddata/sdk-model](https://www.gooddata.ai/docs/gooddata-ui/latest/api-reference/sdk-model/index.md): This package provides domain models for GoodData.UI. (1715 symbols)
- [@gooddata/sdk-ui](https://www.gooddata.ai/docs/gooddata-ui/latest/api-reference/sdk-ui/index.md): This package provides base functionality useful for building React visualizations on top of GoodData. (306 symbols)
- [@gooddata/sdk-ui-catalog](https://www.gooddata.ai/docs/gooddata-ui/latest/api-reference/sdk-ui-catalog/index.md): (26 symbols)
- [@gooddata/sdk-ui-charts](https://www.gooddata.ai/docs/gooddata-ui/latest/api-reference/sdk-ui-charts/index.md): This package provides a set of React-based chart visualizations that you can use to visualize your data. (128 symbols)
- [@gooddata/sdk-ui-dashboard](https://www.gooddata.ai/docs/gooddata-ui/latest/api-reference/sdk-ui-dashboard/index.md): This package provides a Dashboard component that enables you to embed dashboards into your application as React components. (1899 symbols)
- [@gooddata/sdk-ui-ext](https://www.gooddata.ai/docs/gooddata-ui/latest/api-reference/sdk-ui-ext/index.md): This package contains various extensions on top of the stable components included in GoodData.UI. (44 symbols)
- [@gooddata/sdk-ui-filters](https://www.gooddata.ai/docs/gooddata-ui/latest/api-reference/sdk-ui-filters/index.md): This package provides several React components related to filters. (259 symbols)
- [@gooddata/sdk-ui-gen-ai](https://www.gooddata.ai/docs/gooddata-ui/latest/api-reference/sdk-ui-gen-ai/index.md): This package provides React components for GoodData's GenAI features. (152 symbols)
- [@gooddata/sdk-ui-geo](https://www.gooddata.ai/docs/gooddata-ui/latest/api-reference/sdk-ui-geo/index.md): This package provides the components that you can use to visualize location-based data. (67 symbols)
- [@gooddata/sdk-ui-loaders](https://www.gooddata.ai/docs/gooddata-ui/latest/api-reference/sdk-ui-loaders/index.md): This package provides various component loaders. (13 symbols)
- [@gooddata/sdk-ui-pivot](https://www.gooddata.ai/docs/gooddata-ui/latest/api-reference/sdk-ui-pivot/index.md): This package provides the PivotTable component that you can use to visualize your data in a table-based manner. (105 symbols)
- [@gooddata/sdk-ui-semantic-search](https://www.gooddata.ai/docs/gooddata-ui/latest/api-reference/sdk-ui-semantic-search/index.md): This package provides React hooks and components for semantic search. (21 symbols)
- [@gooddata/sdk-ui-theme-provider](https://www.gooddata.ai/docs/gooddata-ui/latest/api-reference/sdk-ui-theme-provider/index.md): This package provides tools to make your application support themes. (13 symbols)
- [@gooddata/sdk-ui-vis-commons](https://www.gooddata.ai/docs/gooddata-ui/latest/api-reference/sdk-ui-vis-commons/index.md): This package provides functions commonly used when building visualizations. (6 symbols)

## Optional

- [Full text of the guides](https://www.gooddata.ai/docs/gooddata-ui/llms-full.txt): every guide page above as Markdown in one file, for tools that load the whole documentation at once
- [All versions](https://www.gooddata.ai/docs/gooddata-ui/latest/api-reference/versions/index.md): Every published version of the GoodData.UI documentation, with changelog and API reference links.