diff --git a/src/SkeletonText/SkeletonText.svelte b/src/SkeletonText/SkeletonText.svelte
index f2c95db0..9b8d7d64 100644
--- a/src/SkeletonText/SkeletonText.svelte
+++ b/src/SkeletonText/SkeletonText.svelte
@@ -13,24 +13,21 @@
 
   const RANDOM = [0.973, 0.153, 0.567];
 
-  $: rows = [];
   $: widthNum = parseInt(width, 10);
   $: widthPx = width.includes("px");
-  $: if (paragraph) {
-    for (let i = 0; i < lines; i++) {
-      const min = widthPx ? widthNum - 75 : 0;
-      const max = widthPx ? widthNum : 75;
-      const rand = Math.floor(RANDOM[i % 3] * (max - min + 1)) + min + "px";
-      rows = [...rows, { width: widthPx ? rand : `calc(${width} - ${rand})` }];
-    }
-  }
 </script>
 
 <!-- svelte-ignore a11y-mouse-events-have-key-events -->
 {#if paragraph}
   <!-- svelte-ignore a11y-no-static-element-interactions -->
   <div {...$$restProps} on:click on:mouseover on:mouseenter on:mouseleave>
-    {#each rows as { width }}
+    {#each Array.from({ length: lines }).map((_, i) => {
+      const min = widthPx ? widthNum - 75 : 0;
+      const max = widthPx ? widthNum : 75;
+      const rand = Math.floor(RANDOM[i % 3] * (max - min + 1)) + min + "px";
+
+      return widthPx ? rand : `calc(${width} - ${rand})`;
+    }) as width}
       <p
         class:bx--skeleton__text="{true}"
         class:bx--skeleton__heading="{heading}"