From 3d838a4c48d6f72f8e20143d7019115d11f34898 Mon Sep 17 00:00:00 2001
From: Andrew Kingston <aptkingston@ssl-mail.com>
Date: Thu, 6 May 2021 15:33:16 +0100
Subject: [PATCH] Update label component to use spectrum

---
 packages/bbui/src/Label/Label.svelte | 60 ++++------------------------
 1 file changed, 7 insertions(+), 53 deletions(-)

diff --git a/packages/bbui/src/Label/Label.svelte b/packages/bbui/src/Label/Label.svelte
index 23494a8455..63394f95ac 100644
--- a/packages/bbui/src/Label/Label.svelte
+++ b/packages/bbui/src/Label/Label.svelte
@@ -1,62 +1,16 @@
 <script>
-  export let forAttr = "",
-    extraSmall = false,
-    small = false,
-    medium = false,
-    large = false,
-    extraLarge = false,
-    white = false,
-    grey = false,
-    black = false
+  import "@spectrum-css/fieldlabel/dist/index-vars.css"
+
+  export let size = "M"
 </script>
 
-<label
-  class="bb-label"
-  class:extraSmall
-  class:small
-  class:medium
-  class:large
-  class:extraLarge
-  class:white
-  class:grey
-  class:black
-  for={forAttr}
->
+<label class={`spectrum-FieldLabel spectrum-FieldLabel--size${size}`}>
   <slot />
 </label>
 
 <style>
-  .bb-label {
-    font-family: var(--font-sans);
-    font-weight: 500;
-    text-rendering: var(--text-render);
-    color: var(--ink);
-    font-size: var(--font-size-s);
-    margin-bottom: var(--spacing-s);
-    display: block;
-  }
-  .extraSmall {
-    font-size: var(--font-size-xs);
-  }
-  .small {
-    font-size: var(--font-size-s);
-  }
-  .medium {
-    font-size: var(--font-size-m);
-  }
-  .large {
-    font-size: var(--font-size-l);
-  }
-  .extraLarge {
-    font-size: var(--font-size-xl);
-  }
-  .white {
-    color: white;
-  }
-  .grey {
-    color: var(--grey-6);
-  }
-  .black {
-    color: var(--ink);
+  label {
+    padding: 0;
+    white-space: nowrap;
   }
 </style>