convert Heading to new API

packages/bbui/src/Typography/Body.svelte

@@ -1,11 +1,13 @@
 <script>
-    import "@spectrum-css/typography/dist/index-vars.css"
+  import "@spectrum-css/typography/dist/index-vars.css"
-    
+
-    export let size = "M";
+  export let size = "M"
-    export let serif = false;
+  export let serif = false
 </script>
 
-<p class="spectrum-Body class:spectrum-Body--size{size}"
+<p
-    class:spectrum-Body--serif={serif}
+  class="spectrum-Body class:spectrum-Body--size{size}"
-    <slot />
+  class:spectrum-Body--serif={serif}
-</p>
+>
+  <slot />
+</p>

packages/bbui/src/Typography/Heading.svelte

@@ -2,27 +2,9 @@
   import "@spectrum-css/typography/dist/index-vars.css"
 
   // Sizes
-  export let xxxl = false
+  export let size = "M"
-  export let xxl = false
-  export let xl = false
-  export let l = false
-  export let m = false
-  export let s = false
-  export let xs = false
-  export let xxs = false
-
-  $: useDefault = ![xxxl, xxl, xl, l, m, s, xs, xxs].includes(true)
 </script>
 
-<h1
+<h1 class="spectrum-Heading spectrum-Heading--size{size}">
-  class="spectrum-Heading"
-  class:spectrum-Heading--sizeXXXL={xxxl}
-  class:spectrum-Heading--sizeXXL={xxl}
-  class:spectrum-Heading--sizeXL={xl}
-  class:spectrum-Heading--sizeL={l}
-  class:spectrum-Heading--sizeM={m || useDefault}
-  class:spectrum-Heading--sizeS={s}
-  class:spectrum-Heading--sizeXS={xs}
-  class:spectrum-Heading--sizeXXS={xxs}>
   <slot />
 </h1>