From 992ee13626e02ae21b52c9f00e9fed4dd0cdf75b Mon Sep 17 00:00:00 2001
From: Jonathan <lalilaloe@hotmail.com>
Date: Fri, 26 Feb 2021 12:29:42 +0100
Subject: [PATCH] Set cols for StructuredListSkeleton

---
 src/StructuredList/StructuredListSkeleton.svelte | 15 +++++++++------
 1 file changed, 9 insertions(+), 6 deletions(-)

diff --git a/src/StructuredList/StructuredListSkeleton.svelte b/src/StructuredList/StructuredListSkeleton.svelte
index a52ede00..cb8c7e9e 100644
--- a/src/StructuredList/StructuredListSkeleton.svelte
+++ b/src/StructuredList/StructuredListSkeleton.svelte
@@ -2,6 +2,9 @@
   /** Specify the number of rows */
   export let rows = 5;
 
+  /** Specify the number of cols */
+  export let cols = 3;
+
   /** Set to `true` to use the bordered variant */
   export let border = false;
 </script>
@@ -21,17 +24,17 @@
       class:bx--structured-list-row="{true}"
       class:bx--structured-list-row--header-row="{true}"
     >
-      <div class:bx--structured-list-th="{true}"><span></span></div>
-      <div class:bx--structured-list-th="{true}"><span></span></div>
-      <div class:bx--structured-list-th="{true}"><span></span></div>
+      {#each Array.from({ length: cols }, (_, i) => i) as row, i (row)}
+        <div class:bx--structured-list-th="{true}"><span></span></div>
+      {/each}
     </div>
   </div>
   <div class:bx--structured-list-tbody="{true}">
     {#each Array.from({ length: rows }, (_, i) => i) as row, i (row)}
       <div class:bx--structured-list-row="{true}">
-        <div class:bx--structured-list-td="{true}"></div>
-        <div class:bx--structured-list-td="{true}"></div>
-        <div class:bx--structured-list-td="{true}"></div>
+        {#each Array.from({ length: cols }, (_, i) => i) as row, i (row)}
+          <div class:bx--structured-list-td="{true}"></div>
+        {/each}
       </div>
     {/each}
   </div>