From f0869edceb609f82d9a778821f1c1f3e05f6de6b Mon Sep 17 00:00:00 2001
From: Eric Liu <ericyl.us@gmail.com>
Date: Thu, 19 Dec 2019 19:34:29 -0800
Subject: [PATCH] refactor(skeleton-text): forward events

Supports #7
---
 src/components/SkeletonText/SkeletonText.svelte | 16 ++++++++++++----
 1 file changed, 12 insertions(+), 4 deletions(-)

diff --git a/src/components/SkeletonText/SkeletonText.svelte b/src/components/SkeletonText/SkeletonText.svelte
index 2af34eb0..ddf00a35 100644
--- a/src/components/SkeletonText/SkeletonText.svelte
+++ b/src/components/SkeletonText/SkeletonText.svelte
@@ -5,7 +5,7 @@
   export let lineCount = 3;
   export let width = '100%';
   export let heading = false;
-  export let props = {};
+  export let style = undefined;
 
   import { cx } from '../../lib';
 
@@ -14,6 +14,7 @@
   const widthNum = parseInt(width, 10);
   const widthPx = width.includes('px');
   const widthPercent = width.includes('%');
+
   let lines = [];
 
   $: if (paragraph) {
@@ -27,11 +28,18 @@
 </script>
 
 {#if paragraph}
-  <div>
+  <div on:click on:mouseover on:mouseenter on:mouseleave {style}>
     {#each lines as { width }}
-      <p {...props} class={_class} style={`width: ${width};`} />
+      <p class={_class} style={`width: ${width};`} />
     {/each}
   </div>
 {:else}
-  <p {...props} class={_class} style={`width: ${width};`} />
+  <p
+    on:click
+    on:mouseover
+    on:mouseenter
+    on:mouseleave
+    {style}
+    class={_class}
+    style={`width: ${width};`} />
 {/if}