diff --git a/packages/bbui/src/Divider/Divider.svelte b/packages/bbui/src/Divider/Divider.svelte
index cc50225d2f..2b4de9cfb0 100644
--- a/packages/bbui/src/Divider/Divider.svelte
+++ b/packages/bbui/src/Divider/Divider.svelte
@@ -1,23 +1,19 @@
 <script>
   import "@spectrum-css/divider/dist/index-vars.css"
-  export let l = false
-  export let m = false
-  export let s = false
+  export let size = "M"
 
   export let vertical = false
   export let noMargin = false
   export let noGrid = false
-
-  $: useDefault = ![l, m, s].includes(true)
 </script>
 
 <hr
   class:noMargin
   class:noGrid
-  class:spectrum-Divider--sizeL={l}
-  class:spectrum-Divider--sizeM={m || useDefault}
-  class:spectrum-Divider--sizeS={s}
-  class="spectrum-Divider spectrum-Divider--{vertical ? 'vertical' : 'horizontal'} spectrum-Dialog-divider" />
+  class="spectrum-Divider spectrum-Divider--{vertical
+    ? 'vertical'
+    : 'horizontal'} spectrum-Dialog-divider spectrum-Divider--size{size}"
+/>
 
 <style>
   hr.noMargin {
diff --git a/packages/bbui/src/Modal/ModalContent.svelte b/packages/bbui/src/Modal/ModalContent.svelte
index a5b2ebb75d..fc5bd48079 100644
--- a/packages/bbui/src/Modal/ModalContent.svelte
+++ b/packages/bbui/src/Modal/ModalContent.svelte
@@ -42,7 +42,7 @@
       {title}
     </h1>
 
-    <Divider m />
+    <Divider size="M" />
     <!-- TODO: Remove content-grid class once Layout components are in bbui -->
     <section class="spectrum-Dialog-content content-grid">
       <slot />
diff --git a/packages/builder/src/components/design/PropertiesPanel/PropertyControls/DataSourceSelect.svelte b/packages/builder/src/components/design/PropertiesPanel/PropertyControls/DataSourceSelect.svelte
index ad19bf3250..88948d9e4d 100644
--- a/packages/builder/src/components/design/PropertiesPanel/PropertyControls/DataSourceSelect.svelte
+++ b/packages/builder/src/components/design/PropertiesPanel/PropertyControls/DataSourceSelect.svelte
@@ -149,7 +149,7 @@
         </li>
       {/each}
     </ul>
-    <Divider s />
+    <Divider size="S" />
     <div class="title">
       <Heading xs h3>Views</Heading>
     </div>
@@ -162,7 +162,7 @@
         </li>
       {/each}
     </ul>
-    <Divider s />
+    <Divider size="S" />
     <div class="title">
       <Heading xs h3>Relationships</Heading>
     </div>
@@ -175,7 +175,7 @@
         </li>
       {/each}
     </ul>
-    <Divider s />
+    <Divider size="S" />
     <div class="title">
       <Heading xs h3>Queries</Heading>
     </div>
@@ -190,7 +190,7 @@
     </ul>
 
     {#if otherSources?.length}
-      <Divider s />
+      <Divider size="S" />
       <div class="title">
         <Heading extraSmall>Other</Heading>
       </div>