From 9ef69b1725057cf1edce2fae76f589cb82dda755 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Keviin=20=C3=85berg=20Kultalahti?= <kevin.aberg@gmail.com>
Date: Tue, 27 Apr 2021 16:18:52 +0200
Subject: [PATCH] convert ActionButton to new interface

---
 .../bbui/src/ActionButton/ActionButton.svelte  | 18 +++---------------
 .../bbui/src/Table/SelectEditRenderer.svelte   |  2 +-
 .../AutomationBuilder/BlockList.svelte         |  2 +-
 .../AppPreview/ComponentSelectionList.svelte   |  2 +-
 4 files changed, 6 insertions(+), 18 deletions(-)

diff --git a/packages/bbui/src/ActionButton/ActionButton.svelte b/packages/bbui/src/ActionButton/ActionButton.svelte
index 688d3bf7e4..9dd5c68f43 100644
--- a/packages/bbui/src/ActionButton/ActionButton.svelte
+++ b/packages/bbui/src/ActionButton/ActionButton.svelte
@@ -10,11 +10,7 @@
   export let disabled = false
   export let icon = ""
 
-  export let xl = false
-  export let l = false
-  export let m = false
-  export let s = false
-  $: useDefault = ![xl, l, m, s].includes(true)
+  export let size = "M"
 
   function longPress(element) {
     if (!longPressable) return
@@ -42,11 +38,7 @@
   class:spectrum-ActionButton--quiet={quiet}
   class:spectrum-ActionButton--emphasized={emphasized}
   class:is-selected={selected}
-  class:spectrum-ActionButton--sizeS={s}
-  class:spectrum-ActionButton--sizeM={m || useDefault}
-  class:spectrum-ActionButton--sizeL={l}
-  class:spectrum-ActionButton--sizeXL={xl}
-  class="spectrum-ActionButton"
+  class="spectrum-ActionButton spectrum-ActionButton--size{size}"
   {disabled}
   on:longPress
   on:click|preventDefault
@@ -62,11 +54,7 @@
   {/if}
   {#if icon}
     <svg
-      class:spectrum-Icon--sizeS={s}
-      class:spectrum-Icon--sizeM={m || useDefault}
-      class:spectrum-Icon--sizeL={l}
-      class:spectrum-Icon--sizeXL={xl}
-      class="spectrum-Icon"
+      class="spectrum-Icon spectrum-Icon--size{size}"
       focusable="false"
       aria-hidden="true"
       aria-label={icon}
diff --git a/packages/bbui/src/Table/SelectEditRenderer.svelte b/packages/bbui/src/Table/SelectEditRenderer.svelte
index 1355666489..d66ac28a32 100644
--- a/packages/bbui/src/Table/SelectEditRenderer.svelte
+++ b/packages/bbui/src/Table/SelectEditRenderer.svelte
@@ -13,5 +13,5 @@
   <Checkbox value={selected} />
 {/if}
 {#if allowEditRows}
-  <ActionButton s on:click={onEdit}>Edit</ActionButton>
+  <ActionButton size="S" on:click={onEdit}>Edit</ActionButton>
 {/if}
diff --git a/packages/builder/src/components/automation/AutomationBuilder/BlockList.svelte b/packages/builder/src/components/automation/AutomationBuilder/BlockList.svelte
index 2c37e97956..4e6a0d9c18 100644
--- a/packages/builder/src/components/automation/AutomationBuilder/BlockList.svelte
+++ b/packages/builder/src/components/automation/AutomationBuilder/BlockList.svelte
@@ -66,7 +66,7 @@
   <div bind:this={anchors[idx]}>
     <ActionButton
       quiet
-      s
+      size="S"
       icon={tab.icon}
       disabled={tab.disabled}
       on:click={tab.disabled ? null : () => onChangeTab(idx)}>
diff --git a/packages/builder/src/components/design/AppPreview/ComponentSelectionList.svelte b/packages/builder/src/components/design/AppPreview/ComponentSelectionList.svelte
index 4163e87104..49261e2f73 100644
--- a/packages/builder/src/components/design/AppPreview/ComponentSelectionList.svelte
+++ b/packages/builder/src/components/design/AppPreview/ComponentSelectionList.svelte
@@ -46,7 +46,7 @@
 <ActionGroup>
   {#each enrichedStructure as item, idx}
     <ActionMenu disabled={!item.isCategory}>
-      <ActionButton icon={item.icon} xs primary quiet slot="button" on:click={() => onItemChosen(item, idx)}>
+      <ActionButton icon={item.icon} size="XS" primary quiet slot="button" on:click={() => onItemChosen(item, idx)}>
         {item.name}
       </ActionButton>
       {#each item.children || [] as item}