From d4b27f7bc4d66642e47a7d95ef81f7149d3684a2 Mon Sep 17 00:00:00 2001
From: kevmodrome <kevin@kevmodro.me>
Date: Tue, 19 Jan 2021 15:11:21 +0100
Subject: [PATCH] adds an empty state if there is no datasource selected.

---
 packages/standard-components/src/List.svelte | 25 ++++++++++++++++----
 1 file changed, 20 insertions(+), 5 deletions(-)

diff --git a/packages/standard-components/src/List.svelte b/packages/standard-components/src/List.svelte
index 1a5638404a..f02b5e73c8 100644
--- a/packages/standard-components/src/List.svelte
+++ b/packages/standard-components/src/List.svelte
@@ -4,6 +4,7 @@
 
   const { API, styleable, DataProvider } = getContext("sdk")
   const component = getContext("component")
+  console.log($component)
   const dataContext = getContext("data")
 
   export let datasource = []
@@ -24,9 +25,23 @@
 </script>
 
 <div use:styleable={$component.styles}>
-  {#each rows as row}
-    <DataProvider {row}>
-      <slot />
-    </DataProvider>
-  {/each}
+  {#if rows.length > 0}
+    {#each rows as row}
+      <DataProvider {row}>
+        <slot />
+      </DataProvider>
+    {/each}
+  {:else}
+    <p>Feed me some data</p>
+  {/if}
 </div>
+
+<style>
+  p {
+    display: grid;
+    place-items: center;
+    background: #f5f5f5;
+    border: #ccc 1px solid;
+    padding: var(--spacing-m);
+  }
+</style>
\ No newline at end of file