Skip to main content
Elastic UI
Elastic UI
Getting startedComponentsPatternsContentData visualization
EUI ChangelogGitHubFigma
  • Overview
  • Layout
  • Containers
  • Navigation
  • Display
  • Forms
  • Tabular content
    • Data grid
    • Tables
      • Basic tables
      • In-memory tables
      • Custom tables
  • Templates
  • Editors and syntax
  • EUI
  • Tabular content
  • Tables

Tables

Tables can get complicated very fast. EUI provides both opinionated and non-opinionated ways to build tables.

  • Opinionated high-level components:
    • These high-level components remove the need to worry about constructing individual building blocks together. You simply arrange your data in the format it asks for.
    • EuiBasicTable handles mobile row selection, row actions, row expansion, and mobile UX out of the box with relatively simple-to-use APIs. It is best used with asynchronous data, or static datasets that do not need pagination/sorting.
    • EuiInMemoryTable has all the features that EuiBasicTable has, and additionally handles pagination, sorting, and searching the passed data out-of-the-box with relatively minimal APIs. It is best used with smaller synchronous datasets.
  • Non-opinionated building blocks:
    • If your table requires completely custom behavior, you can use individual building block components like EuiTable, EuiTableRow, EuiTableRowCell, and more to do what you need.
    • Please note that if you go this route, you must han`dle your own data management as well as table accessibility and mobile UX.
Edit this page

Previous
Data grid in-memory
Next
Basic tables
EUI is dual-licensed under Elastic License 2.0 and Server Side Public License, v 1 | Crafted with ❤ by Elastic