From 01494e60ba057c5cd6aea2bccf89673758c5f30b Mon Sep 17 00:00:00 2001
From: albert <albertmasa2@gmail.com>
Date: Sun, 4 Oct 2020 18:27:01 +0200
Subject: [PATCH] feat(button): add iconPosition

---
 src/Button/Button.svelte | 26 ++++++++++++++++++++++++--
 types/index.d.ts         |  5 +++++
 2 files changed, 29 insertions(+), 2 deletions(-)

diff --git a/src/Button/Button.svelte b/src/Button/Button.svelte
index 74f7389d..91ff1ad7 100644
--- a/src/Button/Button.svelte
+++ b/src/Button/Button.svelte
@@ -23,6 +23,12 @@
    */
   export let icon = undefined;
 
+  /**
+   * Specify the position of the icon
+   * @type {"left" | "right"} [iconPosition="right"]
+   */
+  export let iconPosition = undefined;
+
   /**
    * Specify the ARIA label for the button icon
    * @type {string} [iconDescription]
@@ -144,11 +150,19 @@
       on:mouseenter
       on:mouseleave
     >
+      {#if icon && iconPosition === "left"}
+        <svelte:component
+          this="{icon}"
+          aria-hidden="true"
+          class="bx--btn__icon"
+          aria-label="{iconDescription}"
+        />
+      {/if}
       {#if hasIconOnly}
         <span class:bx--assistive-text="{true}">{iconDescription}</span>
       {/if}
       <slot />
-      {#if icon}
+      {#if icon && iconPosition === "right"}
         <svelte:component
           this="{icon}"
           aria-hidden="true"
@@ -166,11 +180,19 @@
       on:mouseenter
       on:mouseleave
     >
+      {#if icon && iconPosition=== "left"}
+        <svelte:component
+          this="{icon}"
+          aria-hidden="true"
+          class="bx--btn__icon"
+          aria-label="{iconDescription}"
+        />
+      {/if}
       {#if hasIconOnly}
         <span class:bx--assistive-text="{true}">{iconDescription}</span>
       {/if}
       <slot />
-      {#if icon}
+      {#if icon && iconPosition=== "right"}
         <svelte:component
           this="{icon}"
           aria-hidden="true"
diff --git a/types/index.d.ts b/types/index.d.ts
index 4ecb72ad..c7662764 100644
--- a/types/index.d.ts
+++ b/types/index.d.ts
@@ -145,6 +145,11 @@ export class Button extends CarbonSvelteComponent {
      */
     icon?: typeof import("carbon-icons-svelte/lib/Add16").default;
 
+    /**
+     * Specify the position of the icon
+     */
+    iconPosition?: "left" | "right";
+
     /**
      * Specify the ARIA label for the button icon
      */