homeHomecssCSS & Fontsadd_circleIconsdeveloper_guideLocal Developmenttrackpad_inputButtonscheck_boxCheckboxedit_squareForm Fieldscalendar_clockDate Pickerradio_button_checkedRadio GroupsdropdownSelect dropdownformat_list_bulletedListdialogsDialogstoastSnackbartooltipTooltipsmore_vertMenutabsTabsside_navigationNav BarflowchartTreecontent_pasteClipboardhomeSample Disabled
v0.1.83

Tableau UI For Angular 19

This is a demo site showcasing the Tableau UI for Angular component library.

About

The Tableau UI for Angular component library is a set of components designed to work with Tableau's Angular applications. The components are built using Angular and are designed to be easy to use and customize.

The git repository for the library can be found at https://github.com/serionist/tableau-ui-angular

Getting Started

  1. Open your Angular 19 project
  2. Install the package by running
  3. Follow the CSS & Fonts guide to import the styles and fonts into your application.

Using this sample site

This sample site is built using Angular and shows how to use the Tableau UI for Angular component library.
It does not include sample code on the user interface, you need to look into the source code of this app to see how the components are used.
To run the site locally, clone the repository and run: npm install and npm start.

Usage example

This example shows how to add a Tableau button to your project.
It assumes you have already imported the Tableau UI CSS and fonts into your project.

  1. Update your app.component.ts, import TableauUiButtonModule:
    Note: You can use the TableauUiAllModule to import all components.
  2. In app.component.html, add the button: