From ebe3e1dddb00324f35642ff53d5d70c2406213d0 Mon Sep 17 00:00:00 2001 From: shleewhite Date: Fri, 9 May 2025 16:41:07 -0400 Subject: [PATCH 1/2] chore: update docs site --- .../pages/components/advanced-table.scss | 8 -- .../partials/code/component-api.md | 5 +- .../partials/code/how-to-use.md | 102 +++++++++--------- 3 files changed, 53 insertions(+), 62 deletions(-) diff --git a/website/app/styles/pages/components/advanced-table.scss b/website/app/styles/pages/components/advanced-table.scss index 59341f28df9..460fa7b86a0 100644 --- a/website/app/styles/pages/components/advanced-table.scss +++ b/website/app/styles/pages/components/advanced-table.scss @@ -6,14 +6,6 @@ // COMPONENTS > TABLE > ADVANCEDTABLE #show-content-components-table-advanced-table { - .doc-advanced-table-scrollable-wrapper { - overflow-x: auto; - } - - .doc-advanced-table-vertical-scrollable-wrapper { - height: 500px; - } - .doc-advanced-table-multiselect-with-pagination-demo { .hds-advanced-table + .hds-pagination { margin-top: 16px; diff --git a/website/docs/components/table/advanced-table/partials/code/component-api.md b/website/docs/components/table/advanced-table/partials/code/component-api.md index 32c024be31a..beab977e9f1 100644 --- a/website/docs/components/table/advanced-table/partials/code/component-api.md +++ b/website/docs/components/table/advanced-table/partials/code/component-api.md @@ -92,8 +92,11 @@ The Advanced Table component itself is where most of the options will be applied Determines if even-numbered rows will have a different background color from odd-numbered rows.

**Important**: Advanced Table does **not** support setting `isStriped` to true when there are nested rows. + + Sets the maximum height of the Advanced Table. If the `@maxHeight` is set, there will automatically be a sticky header. To turn off the sticky header and still have a max height, set `@hasStickyHeader` to false. + - Determines if the Advanced Table has a sticky header. + Determines if the Advanced Table has a sticky header. If set to `true`, must be used with the `@maxHeight` argument. Determines if the Advanced Table has a sticky first column. diff --git a/website/docs/components/table/advanced-table/partials/code/how-to-use.md b/website/docs/components/table/advanced-table/partials/code/how-to-use.md index b4f1ef596d6..a2b91cc9aa0 100644 --- a/website/docs/components/table/advanced-table/partials/code/how-to-use.md +++ b/website/docs/components/table/advanced-table/partials/code/how-to-use.md @@ -382,31 +382,30 @@ We recommend using functionalities like [pagination](/components/pagination), [s #### Vertical scrolling -For situations where the default number of rows visible may be high, it can be difficult for users to track which column is which once they scroll. In this case, the `hasStickyHeader` argument can be used to make the column headers persist as the user scrolls. +For situations where the default number of rows visible may be high, it can be difficult for users to track which column is which once they scroll. In this case, the `maxHeight` argument can be used to set the maximum height of the Advanced Table which will also add a sticky header. This will make the column headers persist as the user scrolls. + +If you want to set the `maxHeight` but not have a sticky header, set `hasStickyHeader` to false. ```handlebars - -
- - <:body as |B|> - - {{B.data.id}} - {{B.data.name}} - {{B.data.email}} - {{B.data.role}} - - - -
+ + <:body as |B|> + + {{B.data.id}} + {{B.data.name}} + {{B.data.email}} + {{B.data.role}} + + + ``` #### Horizontal scrolling @@ -418,36 +417,33 @@ The component adds the sticky styles to the `[B].Th` component in each row. If t Note: Using `@hasStickyFirstColumn` with nested rows is not supported. ```handlebars - -
- - <:body as |B|> - - {{B.data.first_name}} - {{B.data.last_name}} - {{B.data.age}} - {{B.data.email}} - {{B.data.phone}} - {{B.data.bio}} - {{B.data.education}} - {{B.data.occupation}} - - - -
+ + <:body as |B|> + + {{B.data.first_name}} + {{B.data.last_name}} + {{B.data.age}} + {{B.data.email}} + {{B.data.phone}} + {{B.data.bio}} + {{B.data.education}} + {{B.data.occupation}} + + + ``` ### Multi-select Advanced Table From ebd5ffa2cbeb84a7af53f6cc8bec79186fba72bb Mon Sep 17 00:00:00 2001 From: shleewhite Date: Wed, 14 May 2025 09:51:36 -0700 Subject: [PATCH 2/2] fix: clarify wording --- .../table/advanced-table/partials/code/component-api.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/website/docs/components/table/advanced-table/partials/code/component-api.md b/website/docs/components/table/advanced-table/partials/code/component-api.md index beab977e9f1..0566201b83a 100644 --- a/website/docs/components/table/advanced-table/partials/code/component-api.md +++ b/website/docs/components/table/advanced-table/partials/code/component-api.md @@ -95,8 +95,8 @@ The Advanced Table component itself is where most of the options will be applied Sets the maximum height of the Advanced Table. If the `@maxHeight` is set, there will automatically be a sticky header. To turn off the sticky header and still have a max height, set `@hasStickyHeader` to false. - - Determines if the Advanced Table has a sticky header. If set to `true`, must be used with the `@maxHeight` argument. + + Determines if the Advanced Table has a sticky header. If set to `true`, must be used with the `@maxHeight` argument. If `@maxHeight` is set and `@hasStickyHeader` is `false`, there will not be a sticky header. Determines if the Advanced Table has a sticky first column.