Merge pull request #1088 from Infineon/1087-documentation-table-update

Documentation: table update
Infineon · Apr 2, 2024 · 843229a · 843229a
2 parents 1d5841e + a34ded5
commit 843229a
Show file tree

Hide file tree

Showing 8 changed files with 11 additions and 1 deletion.
diff --git a/...ts/public-storybook/images/table-basic-version/table-content-template-items.png b/...ts/public-storybook/images/table-basic-version/table-content-template-items.png
diff --git a/...omponents/public-storybook/images/table-basic-version/table-example-compact.png b/...omponents/public-storybook/images/table-basic-version/table-example-compact.png
diff --git a/...omponents/public-storybook/images/table-basic-version/table-example-default.png b/...omponents/public-storybook/images/table-basic-version/table-example-default.png
diff --git a/...lic-storybook/images/table-basic-version/table-header-column-action-reorder.png b/...lic-storybook/images/table-basic-version/table-header-column-action-reorder.png
diff --git a/...blic-storybook/images/table-basic-version/table-header-column-action-resize.png b/...blic-storybook/images/table-basic-version/table-header-column-action-resize.png
diff --git a/...ents/public-storybook/images/table-basic-version/table-header-content-logic.png b/...ents/public-storybook/images/table-basic-version/table-header-content-logic.png
diff --git a/...nts/public-storybook/images/table-basic-version/table-header-template-items.png b/...nts/public-storybook/images/table-basic-version/table-header-template-items.png
diff --git a/packages/components/src/components/table-basic-version/Usage.mdx b/packages/components/src/components/table-basic-version/Usage.mdx
@@ -12,6 +12,8 @@ import TableBasicVersionExampleDefault from '../../../public-storybook/images/ta
 import TableBasicVersionHeaderTemplateItems from '../../../public-storybook/images/table-basic-version/table-header-template-items.png';
 import TableBasicVersionHeaderSortingItems from '../../../public-storybook/images/table-basic-version/table-header-sorting-items.png';
 import TableBasicVersionHeaderContentLogic from '../../../public-storybook/images/table-basic-version/table-header-content-logic.png';
+import TableBasicVersionHeaderColumnActionReorder from '../../../public-storybook/images/table-basic-version/table-header-column-action-reorder.png';
+import TableBasicVersionHeaderColumnActionResize from '../../../public-storybook/images/table-basic-version/table-header-column-action-resize.png';
 
 <Meta of={TableBasicVersionStories} />
 
@@ -67,10 +69,18 @@ To display a table generously with more white space, the DDS offers this default
 When it comes to show a lot of data in a table, you can end up with a very long table. In such cases, the compact table variant is the best option.
 <img src={TableBasicVersionExampleCompact} alt="Table Example Compact" />
 
-## Sorting
+## Table Actions
+### Sorting
 Our table component supports sorting columns in ascending or descending order, facilitating quick data analysis. Additionally, users can often filter data directly within the table, enhancing data manipulation capabilities.
 <img src={TableBasicVersionHeaderSortingItems} alt="Table Sorting Items" />
 
+### Reorder
+Users have different preferences and workflows. Allowing them to reorder columns lets them tailor the table layout to suit their specific needs.
+<img src={TableBasicVersionHeaderColumnActionReorder} alt="Table Column Reorder" />
+
+### Resize
+Resizing columns enables users to adjust the width of columns to fit the content they contain. This ensures that data is displayed more clearly and is easier to read, reducing the need for horizontal scrolling.
+<img src={TableBasicVersionHeaderColumnActionResize} alt="Table Column Resize" />
 
 ***
 Check out the Figma component: **[Table](https://www.figma.com/file/zPvPwPgb4EsYFXKC2nhzSG/Infineon-DDS-%7C-Main?type=design&node-id=16048-11054&mode=design&t=vxTx374xQDtV53ic-4)**