diff --git a/COMPONENT_INDEX.md b/COMPONENT_INDEX.md
index 92cd5ed9..e2fd91f0 100644
--- a/COMPONENT_INDEX.md
+++ b/COMPONENT_INDEX.md
@@ -3461,6 +3461,8 @@ None.
| :-------- | :--------------- | :------- | :------------------- | ------------------ | ---------------------------------------------- |
| selected | let
| Yes | string
| -- | Specify the selected structured list row value |
| border | let
| No | boolean
| false
| Set to `true` to use the bordered variant |
+| condensed | let
| No | boolean
| false
| Set to `true` to use the condensed variant |
+| flush | let
| No | boolean
| false
| Set to `true` to flush the list |
| selection | let
| No | boolean
| false
| Set to `true` to use the selection variant |
### Slots
diff --git a/docs/src/COMPONENT_API.json b/docs/src/COMPONENT_API.json
index dd36608f..117368d0 100644
--- a/docs/src/COMPONENT_API.json
+++ b/docs/src/COMPONENT_API.json
@@ -9022,6 +9022,26 @@
"constant": false,
"reactive": false
},
+ {
+ "name": "condensed",
+ "kind": "let",
+ "description": "Set to `true` to use the condensed variant",
+ "type": "boolean",
+ "value": "false",
+ "isFunction": false,
+ "constant": false,
+ "reactive": false
+ },
+ {
+ "name": "flush",
+ "kind": "let",
+ "description": "Set to `true` to flush the list",
+ "type": "boolean",
+ "value": "false",
+ "isFunction": false,
+ "constant": false,
+ "reactive": false
+ },
{
"name": "selection",
"kind": "let",
diff --git a/docs/src/pages/components/StructuredList.svx b/docs/src/pages/components/StructuredList.svx
index 3c856535..56a8c2df 100644
--- a/docs/src/pages/components/StructuredList.svx
+++ b/docs/src/pages/components/StructuredList.svx
@@ -52,6 +52,94 @@ components: ["StructuredList", "StructuredListSkeleton", "StructuredListBody", "
+### Condensed variant
+
+
+
+
+ Column A
+ Column B
+ Column C
+
+
+
+
+ Row 1
+ Row 1
+
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc dui
+ magna, finibus id tortor sed, aliquet bibendum augue. Aenean posuere
+ sem vel euismod dignissim. Nulla ut cursus dolor. Pellentesque
+ vulputate nisl a porttitor interdum.
+
+
+
+ Row 2
+ Row 2
+
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc dui
+ magna, finibus id tortor sed, aliquet bibendum augue. Aenean posuere
+ sem vel euismod dignissim. Nulla ut cursus dolor. Pellentesque
+ vulputate nisl a porttitor interdum.
+
+
+
+ Row 3
+ Row 3
+
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc dui
+ magna, finibus id tortor sed, aliquet bibendum augue. Aenean posuere
+ sem vel euismod dignissim. Nulla ut cursus dolor. Pellentesque
+ vulputate nisl a porttitor interdum.
+
+
+
+
+
+### Flush
+
+
+
+
+ Column A
+ Column B
+ Column C
+
+
+
+
+ Row 1
+ Row 1
+
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc dui
+ magna, finibus id tortor sed, aliquet bibendum augue. Aenean posuere
+ sem vel euismod dignissim. Nulla ut cursus dolor. Pellentesque
+ vulputate nisl a porttitor interdum.
+
+
+
+ Row 2
+ Row 2
+
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc dui
+ magna, finibus id tortor sed, aliquet bibendum augue. Aenean posuere
+ sem vel euismod dignissim. Nulla ut cursus dolor. Pellentesque
+ vulputate nisl a porttitor interdum.
+
+
+
+ Row 3
+ Row 3
+
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc dui
+ magna, finibus id tortor sed, aliquet bibendum augue. Aenean posuere
+ sem vel euismod dignissim. Nulla ut cursus dolor. Pellentesque
+ vulputate nisl a porttitor interdum.
+
+
+
+
+
### Selectable rows
diff --git a/src/StructuredList/StructuredList.svelte b/src/StructuredList/StructuredList.svelte
index 919b9fbd..a075205b 100644
--- a/src/StructuredList/StructuredList.svelte
+++ b/src/StructuredList/StructuredList.svelte
@@ -8,6 +8,12 @@
/** Set to `true` to use the bordered variant */
export let border = false;
+ /** Set to `true` to use the condensed variant */
+ export let condensed = false;
+
+ /** Set to `true` to flush the list */
+ export let flush = false;
+
/** Set to `true` to use the selection variant */
export let selection = false;
@@ -33,6 +39,8 @@
class:bx--structured-list="{true}"
class:bx--structured-list--border="{border}"
class:bx--structured-list--selection="{selection}"
+ class:bx--structured-list--condensed="{condensed}"
+ class:bx--structured-list--flush="{flush}"
{...$$restProps}
on:click
on:mouseover
diff --git a/types/StructuredList/StructuredList.d.ts b/types/StructuredList/StructuredList.d.ts
index e405578f..e18d31bb 100644
--- a/types/StructuredList/StructuredList.d.ts
+++ b/types/StructuredList/StructuredList.d.ts
@@ -14,6 +14,18 @@ export interface StructuredListProps
*/
border?: boolean;
+ /**
+ * Set to `true` to use the condensed variant
+ * @default false
+ */
+ condensed?: boolean;
+
+ /**
+ * Set to `true` to flush the list
+ * @default false
+ */
+ flush?: boolean;
+
/**
* Set to `true` to use the selection variant
* @default false