Skip to content

Commit

Permalink
docs: filter & tables copy updates (#442)
Browse files Browse the repository at this point in the history
  • Loading branch information
soniakose authored Oct 9, 2024
1 parent b22d3cd commit e0ac740
Show file tree
Hide file tree
Showing 2 changed files with 29 additions and 13 deletions.
2 changes: 1 addition & 1 deletion docs/Design Templates/Table/Filters.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ Examples:
- Coming Soon
- Coming Soon

#### **Complex Filters with Apply Button**
#### **Filters with Apply Button**
Complex filters provide more advanced filtering options, allowing users to apply multiple criteria at once. These filters often include dropdowns, checkboxes, and text fields. Complex filters are particularly useful when multiple filters need to be applied simultaneously or when load times might be a concern.

#### **Date Range Filters**
Expand Down
40 changes: 28 additions & 12 deletions docs/Design Templates/Table/Table.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -2,15 +2,17 @@

#### Overview
Tables present and organize data in a structured, readable format, ranging from basic displays to complex interfaces that support queries and data manipulation.
#### Filter Bar
Filters allow users to narrow down large datasets in tables. While not required for all tables, the filter bar typically appears above the table.
#### Header
A typical table header contains column titles that describe the data in each column. It often includes functionality for sorting columns and may feature help icons with tooltips to provide additional information on each column’s purpose.
#### Pagination
Use pagination in tables to improve performance and reduce load times by fetching only the data needed for the current page.

#### Cell Types
Table cells that support different formats and are designed to display various types of data in appropriate and easily readable ways.

#### Basic Table

##### Header
A typical table header contains column titles that describe the data in each column. It includes functionality for sorting columns and may feature help icons with tooltips to provide additional information on each column’s purpose.

##### Pagination
Use pagination in tables to improve performance and reduce load times by fetching only the data needed for the current page.

##### Cell Types
Table cells support various formats and are designed to display data in clear, readable ways.
- Numbers (Coming Soon)
- Date / Time (Coming Soon)
- CTA Buttons (Coming Soon)
Expand All @@ -19,10 +21,24 @@ Table cells that support different formats and are designed to display various
- Tags (Coming Soon)
- More Actions (Coming Soon)

[View Example](#link)

#### Tables with Filters
Filters help users refine large datasets within tables. The mParticle table supports a range of filter types, including:

- [Search](#link-to-search)
- [Date Range filters](#link-to-daterange)
- [Basic Filters](#link-to-basic-filters)
- [Filters with an Apply button](#link-to-apply-button-filters)



#### Related Links
| Type | Resource |
| -------- | ------- |
| Eames | [Figma Templates](https://www.figma.com/design/yCPszaTtkCFxRHaSkkJFR9/Eames-Templates-%5BInternal%5D?node-id=2114-9632&node-type=frame&t=Aa9XxcKyme3ud4cb-0) |
| Type | Resource |
| ------ | -------- |
| Eames | [Figma Templates](https://www.figma.com/design/yCPszaTtkCFxRHaSkkJFR9/Eames-Templates-%5BInternal%5D?node-id=2114-9632&node-type=frame&t=Aa9XxcKyme3ud4cb-0) |



#### Example basic table image (To be changed)

Expand Down

0 comments on commit e0ac740

Please sign in to comment.