From 3f9e8626a1c9e158eb25910e78729d95b719a5a9 Mon Sep 17 00:00:00 2001
From: Pablo Garcia <pablo.garcianunez@telefonica.com>
Date: Fri, 28 Jul 2023 15:06:43 +0200
Subject: [PATCH 1/2] ANDROID-13593 Unify ids button

---
 UPGRADING.md                                  |  16 +
 .../components/BadgesCatalogFragment.kt       |   4 +-
 .../components/ButtonsCatalogFragment.kt      |  14 +-
 .../components/CalloutsCatalogFragment.kt     |   4 +-
 .../ui/classic/components/DataCardFragment.kt |   2 +-
 .../EmptyStateCardCatalogFragment.kt          |   2 +-
 .../EmptyStateScreenCatalogFragment.kt        |   2 +-
 .../components/HeadersCatalogFragment.kt      |   4 +-
 .../HighlightedCardsCatalogFragment.kt        |   4 +-
 .../components/InputsCatalogFragment.kt       |   4 +-
 .../classic/components/MediaCardsFragment.kt  |   2 +-
 .../components/PopOverCatalogFragment.kt      |   4 +-
 .../ScrollContentIndicatorCatalogFragment.kt  |   4 +-
 .../components/SnackBarCatalogFragment.kt     |   4 +-
 .../components/SteppersCatalogFragment.kt     |   2 +-
 .../res/layout/data_card_fragment_catalog.xml |   4 +-
 .../empty_state_card_fragment_catalog.xml     |   2 +-
 .../empty_state_screen_fragment_catalog.xml   |   2 +-
 .../res/layout/headers_fragment_catalog.xml   |   4 +-
 .../highlighted_cards_fragment_catalog.xml    |   4 +-
 .../layout/media_card_fragment_catalog.xml    |   4 +-
 .../main/res/layout/screen_badges_catalog.xml |  14 +-
 .../res/layout/screen_buttons_catalog.xml     | 825 ++++++++++--------
 .../res/layout/screen_callouts_catalog.xml    |   4 +-
 .../layout/screen_fragment_sheet_catalog.xml  |   2 +-
 .../main/res/layout/screen_inputs_catalog.xml |  14 +-
 .../res/layout/screen_popovers_catalog.xml    |   6 +-
 ...creen_scroll_content_indicator_catalog.xml |   4 +-
 .../res/layout/screen_snackbar_catalog.xml    |   4 +-
 .../res/layout/screen_steppers_catalog.xml    |  12 +-
 .../main/res/layout/screen_tabs_catalog.xml   |   4 +-
 .../com/telefonica/mistica/button/Button.kt   |  96 +-
 .../mistica/button/ProgressButton.kt          | 335 -------
 .../com/telefonica/mistica/button/README.md   |  47 +-
 .../com/telefonica/mistica/card/CardView.kt   |   1 +
 .../mistica/compose/button/Button.kt          |  23 +-
 .../emptystate/card/EmptyStateCardView.kt     |  11 +-
 .../emptystate/screen/EmptyStateScreenView.kt |  11 +-
 .../feedback/error/LoadErrorFeedbackView.kt   |  10 +-
 .../screen/view/FeedbackScreenView.kt         |  21 +-
 .../telefonica/mistica/header/HeaderView.kt   |   2 +-
 .../highlightedcard/HighlightedCardView.kt    |   4 +-
 .../com/telefonica/mistica/util/ViewUtils.kt  |  12 +-
 library/src/main/res/layout/callout_view.xml  |   8 +-
 .../src/main/res/layout/card_actions_view.xml |  48 +-
 .../main/res/layout/empty_state_card_view.xml |   9 +-
 .../res/layout/empty_state_screen_view.xml    |   7 +-
 library/src/main/res/layout/header_view.xml   |  40 +-
 .../main/res/layout/highlighted_card_view.xml |  26 +-
 .../main/res/layout/load_error_feedback.xml   |  10 +-
 .../res/layout/screen_feedback_buttons.xml    |  41 +-
 .../screen_feedback_buttons_inverse.xml       |  18 +-
 .../src/main/res/values/attrs_components.xml  |  20 +-
 library/src/main/res/values/attrs_ids.xml     |   8 +
 54 files changed, 839 insertions(+), 950 deletions(-)
 delete mode 100644 library/src/main/java/com/telefonica/mistica/button/ProgressButton.kt
 create mode 100644 library/src/main/res/values/attrs_ids.xml

diff --git a/UPGRADING.md b/UPGRADING.md
index c5c323170..5b51deff6 100644
--- a/UPGRADING.md
+++ b/UPGRADING.md
@@ -63,3 +63,19 @@ Other colors have been removed because UX team has decided to remove them from t
 ### Changes in FeedbackScreenView
 - `TYPE_CUSTOM` has been removed. Use `TYPE_INFO` instead, it allows custom icon or animation.
 - `shouldAnimateOnAttachedToWindow` is now private. Use method `setShouldAnimateOnAttached()` or xml attribute `app:shouldAnimateOnAttached` instead.
+
+## Upgrade to version 9.3.0
+9.3.0 version change the xml button implementation.
+
+Please replace set functions by property access syntax
+
+- `button.setText("some text")` -> `button.text = "some text"`
+- `button.setLoadingText("some text")` -> `button.loadingText = "some text"`
+- `button.setIsLoading(true)` -> `button.isLoading = true`
+- `button.setIsLoading(false)` -> `button.isLoading = false`
+- `button.showLoading` -> `button.isLoading = true`
+- `button.hideLoading` -> `button.isLoading = false`
+
+Please replace android xml attributes by Mistica attributes
+- `android:text="some text"` -> `app:text="some text"`
+- `android:enabled="false"` -> `app:enabled="false"`
diff --git a/catalog/src/main/java/com/telefonica/mistica/catalog/ui/classic/components/BadgesCatalogFragment.kt b/catalog/src/main/java/com/telefonica/mistica/catalog/ui/classic/components/BadgesCatalogFragment.kt
index 253128f74..40b6170af 100644
--- a/catalog/src/main/java/com/telefonica/mistica/catalog/ui/classic/components/BadgesCatalogFragment.kt
+++ b/catalog/src/main/java/com/telefonica/mistica/catalog/ui/classic/components/BadgesCatalogFragment.kt
@@ -4,11 +4,11 @@ import android.os.Bundle
 import android.view.LayoutInflater
 import android.view.View
 import android.view.ViewGroup
-import android.widget.Button
 import android.widget.FrameLayout
 import android.widget.ImageView
 import androidx.fragment.app.Fragment
 import com.telefonica.mistica.badge.Badge
+import com.telefonica.mistica.button.Button
 import com.telefonica.mistica.catalog.R
 import kotlin.random.Random
 
@@ -57,4 +57,4 @@ class BadgesCatalogFragment : Fragment() {
             }
         }
     }
-}
\ No newline at end of file
+}
diff --git a/catalog/src/main/java/com/telefonica/mistica/catalog/ui/classic/components/ButtonsCatalogFragment.kt b/catalog/src/main/java/com/telefonica/mistica/catalog/ui/classic/components/ButtonsCatalogFragment.kt
index 10ad11ea3..33c5306b5 100644
--- a/catalog/src/main/java/com/telefonica/mistica/catalog/ui/classic/components/ButtonsCatalogFragment.kt
+++ b/catalog/src/main/java/com/telefonica/mistica/catalog/ui/classic/components/ButtonsCatalogFragment.kt
@@ -5,7 +5,7 @@ import android.view.LayoutInflater
 import android.view.View
 import android.view.ViewGroup
 import androidx.fragment.app.Fragment
-import com.telefonica.mistica.button.ProgressButton
+import com.telefonica.mistica.button.Button
 import com.telefonica.mistica.catalog.R
 
 class ButtonsCatalogFragment : Fragment() {
@@ -13,7 +13,7 @@ class ButtonsCatalogFragment : Fragment() {
     override fun onCreateView(
         inflater: LayoutInflater,
         container: ViewGroup?,
-        savedInstanceState: Bundle?
+        savedInstanceState: Bundle?,
     ): View? {
         super.onCreateView(inflater, container, savedInstanceState)
         return layoutInflater.inflate(R.layout.screen_buttons_catalog, container, false)
@@ -35,12 +35,12 @@ class ButtonsCatalogFragment : Fragment() {
             R.id.secondary_small_inverse_progress,
             R.id.link_inverse_progress
         )
-            .map { view.findViewById<ProgressButton>(it) }
+            .map { view.findViewById<Button>(it) }
             .forEach { button ->
-                button.setLoadingText("Loading")
+                button.loadingText = "Loading"
                 button.setOnClickListener {
-                    button.showLoading()
-                    button.postDelayed({ button.hideLoading() }, LOADING_TIME)
+                    button.isLoading = true
+                    button.postDelayed({ button.isLoading = false }, LOADING_TIME)
                 }
             }
     }
@@ -48,4 +48,4 @@ class ButtonsCatalogFragment : Fragment() {
     private companion object {
         const val LOADING_TIME = 2000L
     }
-}
\ No newline at end of file
+}
diff --git a/catalog/src/main/java/com/telefonica/mistica/catalog/ui/classic/components/CalloutsCatalogFragment.kt b/catalog/src/main/java/com/telefonica/mistica/catalog/ui/classic/components/CalloutsCatalogFragment.kt
index 9f49c5395..73376c9cb 100644
--- a/catalog/src/main/java/com/telefonica/mistica/catalog/ui/classic/components/CalloutsCatalogFragment.kt
+++ b/catalog/src/main/java/com/telefonica/mistica/catalog/ui/classic/components/CalloutsCatalogFragment.kt
@@ -7,9 +7,9 @@ import android.view.View
 import android.view.View.GONE
 import android.view.View.VISIBLE
 import android.view.ViewGroup
-import android.widget.Button
 import android.widget.Toast
 import androidx.fragment.app.Fragment
+import com.telefonica.mistica.button.Button
 import com.telefonica.mistica.callout.CalloutView
 import com.telefonica.mistica.catalog.R
 import com.telefonica.mistica.input.CheckBoxInput
@@ -95,4 +95,4 @@ class CalloutsCatalogFragment : Fragment() {
         BUTTONS_CONFIG_SECONDARY_LINK(CalloutView.BUTTONS_CONFIG_SECONDARY_LINK),
         BUTTONS_CONFIG_LINK(CalloutView.BUTTONS_CONFIG_LINK),
     }
-}
\ No newline at end of file
+}
diff --git a/catalog/src/main/java/com/telefonica/mistica/catalog/ui/classic/components/DataCardFragment.kt b/catalog/src/main/java/com/telefonica/mistica/catalog/ui/classic/components/DataCardFragment.kt
index 42475d864..057e7c54a 100644
--- a/catalog/src/main/java/com/telefonica/mistica/catalog/ui/classic/components/DataCardFragment.kt
+++ b/catalog/src/main/java/com/telefonica/mistica/catalog/ui/classic/components/DataCardFragment.kt
@@ -4,10 +4,10 @@ import android.os.Bundle
 import android.view.LayoutInflater
 import android.view.View
 import android.view.ViewGroup
-import android.widget.Button
 import android.widget.Toast
 import androidx.annotation.AttrRes
 import androidx.fragment.app.Fragment
+import com.telefonica.mistica.button.Button
 import com.telefonica.mistica.card.datacard.DataCardView
 import com.telefonica.mistica.card.datacard.DataCardView.IconType.Companion.TYPE_CIRCULAR_ICON
 import com.telefonica.mistica.card.datacard.DataCardView.IconType.Companion.TYPE_CIRCULAR_IMAGE
diff --git a/catalog/src/main/java/com/telefonica/mistica/catalog/ui/classic/components/EmptyStateCardCatalogFragment.kt b/catalog/src/main/java/com/telefonica/mistica/catalog/ui/classic/components/EmptyStateCardCatalogFragment.kt
index 1d85bbd74..16d296fd3 100644
--- a/catalog/src/main/java/com/telefonica/mistica/catalog/ui/classic/components/EmptyStateCardCatalogFragment.kt
+++ b/catalog/src/main/java/com/telefonica/mistica/catalog/ui/classic/components/EmptyStateCardCatalogFragment.kt
@@ -5,9 +5,9 @@ import android.os.Bundle
 import android.view.LayoutInflater
 import android.view.View
 import android.view.ViewGroup
-import android.widget.Button
 import android.widget.Toast
 import androidx.fragment.app.Fragment
+import com.telefonica.mistica.button.Button
 import com.telefonica.mistica.catalog.R
 import com.telefonica.mistica.emptystate.card.EmptyStateCardView
 import com.telefonica.mistica.emptystate.card.EmptyStateCardView.ButtonsConfig
diff --git a/catalog/src/main/java/com/telefonica/mistica/catalog/ui/classic/components/EmptyStateScreenCatalogFragment.kt b/catalog/src/main/java/com/telefonica/mistica/catalog/ui/classic/components/EmptyStateScreenCatalogFragment.kt
index bcf2058c4..0136c8e75 100644
--- a/catalog/src/main/java/com/telefonica/mistica/catalog/ui/classic/components/EmptyStateScreenCatalogFragment.kt
+++ b/catalog/src/main/java/com/telefonica/mistica/catalog/ui/classic/components/EmptyStateScreenCatalogFragment.kt
@@ -5,9 +5,9 @@ import android.os.Bundle
 import android.view.LayoutInflater
 import android.view.View
 import android.view.ViewGroup
-import android.widget.Button
 import androidx.annotation.StyleRes
 import androidx.fragment.app.Fragment
+import com.telefonica.mistica.button.Button
 import com.telefonica.mistica.catalog.R
 import com.telefonica.mistica.catalog.ui.classic.activity.EmptyStateScreenCatalogActivity
 import com.telefonica.mistica.emptystate.screen.EmptyStateScreenView
diff --git a/catalog/src/main/java/com/telefonica/mistica/catalog/ui/classic/components/HeadersCatalogFragment.kt b/catalog/src/main/java/com/telefonica/mistica/catalog/ui/classic/components/HeadersCatalogFragment.kt
index a45e69cc4..06b10b059 100644
--- a/catalog/src/main/java/com/telefonica/mistica/catalog/ui/classic/components/HeadersCatalogFragment.kt
+++ b/catalog/src/main/java/com/telefonica/mistica/catalog/ui/classic/components/HeadersCatalogFragment.kt
@@ -4,9 +4,9 @@ import android.os.Bundle
 import android.view.LayoutInflater
 import android.view.View
 import android.view.ViewGroup
-import android.widget.Button
 import android.widget.Toast
 import androidx.fragment.app.Fragment
+import com.telefonica.mistica.button.Button
 import com.telefonica.mistica.catalog.R
 import com.telefonica.mistica.header.HeaderView
 import com.telefonica.mistica.input.CheckBoxInput
@@ -82,4 +82,4 @@ class HeadersCatalogFragment : Fragment() {
             headerView.setBottomLayout(HeaderView.BOTTOM_VIEW_NONE)
         }
     }
-}
\ No newline at end of file
+}
diff --git a/catalog/src/main/java/com/telefonica/mistica/catalog/ui/classic/components/HighlightedCardsCatalogFragment.kt b/catalog/src/main/java/com/telefonica/mistica/catalog/ui/classic/components/HighlightedCardsCatalogFragment.kt
index 321602a18..9771a2fc1 100644
--- a/catalog/src/main/java/com/telefonica/mistica/catalog/ui/classic/components/HighlightedCardsCatalogFragment.kt
+++ b/catalog/src/main/java/com/telefonica/mistica/catalog/ui/classic/components/HighlightedCardsCatalogFragment.kt
@@ -6,9 +6,9 @@ import android.view.View
 import android.view.ViewGroup
 import android.widget.AdapterView
 import android.widget.ArrayAdapter
-import android.widget.Button
 import android.widget.Toast
 import androidx.fragment.app.Fragment
+import com.telefonica.mistica.button.Button
 import com.telefonica.mistica.catalog.R
 import com.telefonica.mistica.highlightedcard.HighlightedCardView
 import com.telefonica.mistica.input.CheckBoxInput
@@ -128,4 +128,4 @@ class HighlightedCardsCatalogFragment : Fragment() {
             removeCloseButton()
         }
     }
-}
\ No newline at end of file
+}
diff --git a/catalog/src/main/java/com/telefonica/mistica/catalog/ui/classic/components/InputsCatalogFragment.kt b/catalog/src/main/java/com/telefonica/mistica/catalog/ui/classic/components/InputsCatalogFragment.kt
index b2662f641..a35c5bd53 100644
--- a/catalog/src/main/java/com/telefonica/mistica/catalog/ui/classic/components/InputsCatalogFragment.kt
+++ b/catalog/src/main/java/com/telefonica/mistica/catalog/ui/classic/components/InputsCatalogFragment.kt
@@ -9,10 +9,10 @@ import android.text.style.ClickableSpan
 import android.view.LayoutInflater
 import android.view.View
 import android.view.ViewGroup
-import android.widget.Button
 import android.widget.Toast
 import androidx.annotation.CallSuper
 import androidx.fragment.app.Fragment
+import com.telefonica.mistica.button.Button
 import com.telefonica.mistica.catalog.R
 import com.telefonica.mistica.input.CheckBoxInput
 import com.telefonica.mistica.input.DropDownInput
@@ -143,4 +143,4 @@ class InputsCatalogFragment : Fragment() {
                 TextInputValidationResult.Invalid("Message should be \"Mistica Rules\"")
             }
     }
-}
\ No newline at end of file
+}
diff --git a/catalog/src/main/java/com/telefonica/mistica/catalog/ui/classic/components/MediaCardsFragment.kt b/catalog/src/main/java/com/telefonica/mistica/catalog/ui/classic/components/MediaCardsFragment.kt
index 6fc7caff1..321fc4741 100644
--- a/catalog/src/main/java/com/telefonica/mistica/catalog/ui/classic/components/MediaCardsFragment.kt
+++ b/catalog/src/main/java/com/telefonica/mistica/catalog/ui/classic/components/MediaCardsFragment.kt
@@ -4,11 +4,11 @@ import android.os.Bundle
 import android.view.LayoutInflater
 import android.view.View
 import android.view.ViewGroup
-import android.widget.Button
 import android.widget.Toast
 import androidx.fragment.app.Fragment
 import androidx.recyclerview.widget.LinearLayoutManager
 import androidx.recyclerview.widget.RecyclerView
+import com.telefonica.mistica.button.Button
 import com.telefonica.mistica.card.mediacard.MediaCardView
 import com.telefonica.mistica.catalog.R
 import com.telefonica.mistica.catalog.ui.classic.components.MediaCardAdapter.Companion.MEDIA_CARDS_CAROUSEL_SIZE
diff --git a/catalog/src/main/java/com/telefonica/mistica/catalog/ui/classic/components/PopOverCatalogFragment.kt b/catalog/src/main/java/com/telefonica/mistica/catalog/ui/classic/components/PopOverCatalogFragment.kt
index 1abd86ccf..056b00bc6 100644
--- a/catalog/src/main/java/com/telefonica/mistica/catalog/ui/classic/components/PopOverCatalogFragment.kt
+++ b/catalog/src/main/java/com/telefonica/mistica/catalog/ui/classic/components/PopOverCatalogFragment.kt
@@ -6,8 +6,8 @@ import android.view.LayoutInflater
 import android.view.View
 import android.view.ViewGroup
 import android.view.inputmethod.InputMethodManager
-import android.widget.Button
 import androidx.fragment.app.Fragment
+import com.telefonica.mistica.button.Button
 import com.telefonica.mistica.catalog.R
 import com.telefonica.mistica.feedback.popover.PopOver
 import com.telefonica.mistica.feedback.popover.PopOverView
@@ -100,4 +100,4 @@ class PopOverCatalogFragment : Fragment() {
             context.getSystemService(Context.INPUT_METHOD_SERVICE) as InputMethodManager
         inputMethodManager.hideSoftInputFromWindow(windowToken, 0)
     }
-}
\ No newline at end of file
+}
diff --git a/catalog/src/main/java/com/telefonica/mistica/catalog/ui/classic/components/ScrollContentIndicatorCatalogFragment.kt b/catalog/src/main/java/com/telefonica/mistica/catalog/ui/classic/components/ScrollContentIndicatorCatalogFragment.kt
index fcc4e675f..5ee6e9835 100644
--- a/catalog/src/main/java/com/telefonica/mistica/catalog/ui/classic/components/ScrollContentIndicatorCatalogFragment.kt
+++ b/catalog/src/main/java/com/telefonica/mistica/catalog/ui/classic/components/ScrollContentIndicatorCatalogFragment.kt
@@ -5,8 +5,8 @@ import android.os.Bundle
 import android.view.LayoutInflater
 import android.view.View
 import android.view.ViewGroup
-import android.widget.Button
 import androidx.fragment.app.Fragment
+import com.telefonica.mistica.button.Button
 import com.telefonica.mistica.catalog.R
 import com.telefonica.mistica.contentindicator.ScrollContentIndicator
 
@@ -40,4 +40,4 @@ class ScrollContentIndicatorCatalogFragment : Fragment() {
             }
         }
     }
-}
\ No newline at end of file
+}
diff --git a/catalog/src/main/java/com/telefonica/mistica/catalog/ui/classic/components/SnackBarCatalogFragment.kt b/catalog/src/main/java/com/telefonica/mistica/catalog/ui/classic/components/SnackBarCatalogFragment.kt
index 71e9d784d..1d765f861 100644
--- a/catalog/src/main/java/com/telefonica/mistica/catalog/ui/classic/components/SnackBarCatalogFragment.kt
+++ b/catalog/src/main/java/com/telefonica/mistica/catalog/ui/classic/components/SnackBarCatalogFragment.kt
@@ -6,9 +6,9 @@ import android.view.LayoutInflater
 import android.view.View
 import android.view.ViewGroup
 import android.view.inputmethod.InputMethodManager
-import android.widget.Button
 import android.widget.RadioButton
 import androidx.fragment.app.Fragment
+import com.telefonica.mistica.button.Button
 import com.telefonica.mistica.catalog.R
 import com.telefonica.mistica.feedback.SnackbarBuilder
 import com.telefonica.mistica.feedback.SnackbarLength
@@ -76,4 +76,4 @@ class SnackBarCatalogFragment : Fragment() {
         INFORMATIVE,
         CRITICAL
     }
-}
\ No newline at end of file
+}
diff --git a/catalog/src/main/java/com/telefonica/mistica/catalog/ui/classic/components/SteppersCatalogFragment.kt b/catalog/src/main/java/com/telefonica/mistica/catalog/ui/classic/components/SteppersCatalogFragment.kt
index 8453ce225..58ff8078c 100644
--- a/catalog/src/main/java/com/telefonica/mistica/catalog/ui/classic/components/SteppersCatalogFragment.kt
+++ b/catalog/src/main/java/com/telefonica/mistica/catalog/ui/classic/components/SteppersCatalogFragment.kt
@@ -4,8 +4,8 @@ import android.os.Bundle
 import android.view.LayoutInflater
 import android.view.View
 import android.view.ViewGroup
-import android.widget.Button
 import androidx.fragment.app.Fragment
+import com.telefonica.mistica.button.Button
 import com.telefonica.mistica.catalog.R
 import com.telefonica.mistica.input.DropDownInput
 import com.telefonica.mistica.stepper.DeterminateStepperView
diff --git a/catalog/src/main/res/layout/data_card_fragment_catalog.xml b/catalog/src/main/res/layout/data_card_fragment_catalog.xml
index fb0f05043..ad9c4c782 100644
--- a/catalog/src/main/res/layout/data_card_fragment_catalog.xml
+++ b/catalog/src/main/res/layout/data_card_fragment_catalog.xml
@@ -121,7 +121,7 @@
             android:layout_height="wrap_content"
             android:layout_marginTop="16dp"
             android:layout_marginBottom="16dp"
-            android:text="Update" />
+            app:text="Update" />
 
     </LinearLayout>
-</ScrollView>
\ No newline at end of file
+</ScrollView>
diff --git a/catalog/src/main/res/layout/empty_state_card_fragment_catalog.xml b/catalog/src/main/res/layout/empty_state_card_fragment_catalog.xml
index 1929d091a..effdd6f4f 100644
--- a/catalog/src/main/res/layout/empty_state_card_fragment_catalog.xml
+++ b/catalog/src/main/res/layout/empty_state_card_fragment_catalog.xml
@@ -115,7 +115,7 @@
 				android:layout_height="wrap_content"
 				android:layout_marginTop="16dp"
 				android:layout_marginBottom="16dp"
-				android:text="Update"
+				app:text="Update"
 				/>
 
 	</LinearLayout>
diff --git a/catalog/src/main/res/layout/empty_state_screen_fragment_catalog.xml b/catalog/src/main/res/layout/empty_state_screen_fragment_catalog.xml
index 9717dbbca..6603f5c62 100644
--- a/catalog/src/main/res/layout/empty_state_screen_fragment_catalog.xml
+++ b/catalog/src/main/res/layout/empty_state_screen_fragment_catalog.xml
@@ -104,7 +104,7 @@
 				android:layout_height="wrap_content"
 				android:layout_marginTop="16dp"
 				android:layout_marginBottom="16dp"
-				android:text="Show"
+				app:text="Show"
 				/>
 
 	</LinearLayout>
diff --git a/catalog/src/main/res/layout/headers_fragment_catalog.xml b/catalog/src/main/res/layout/headers_fragment_catalog.xml
index fa7c9b68b..e476275d0 100644
--- a/catalog/src/main/res/layout/headers_fragment_catalog.xml
+++ b/catalog/src/main/res/layout/headers_fragment_catalog.xml
@@ -228,7 +228,7 @@
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
             android:layout_margin="8dp"
-            android:text="Update" />
+            app:text="Update" />
 
     </LinearLayout>
-</ScrollView>
\ No newline at end of file
+</ScrollView>
diff --git a/catalog/src/main/res/layout/highlighted_cards_fragment_catalog.xml b/catalog/src/main/res/layout/highlighted_cards_fragment_catalog.xml
index 5bb81c8df..8d60737d0 100644
--- a/catalog/src/main/res/layout/highlighted_cards_fragment_catalog.xml
+++ b/catalog/src/main/res/layout/highlighted_cards_fragment_catalog.xml
@@ -96,8 +96,8 @@
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
             android:layout_margin="8dp"
-            android:text="Update" />
+            app:text="Update" />
 
     </LinearLayout>
 
-</ScrollView>
\ No newline at end of file
+</ScrollView>
diff --git a/catalog/src/main/res/layout/media_card_fragment_catalog.xml b/catalog/src/main/res/layout/media_card_fragment_catalog.xml
index beb3819d8..15e16fe4a 100644
--- a/catalog/src/main/res/layout/media_card_fragment_catalog.xml
+++ b/catalog/src/main/res/layout/media_card_fragment_catalog.xml
@@ -100,7 +100,7 @@
             android:layout_height="wrap_content"
             android:layout_marginTop="16dp"
             android:layout_marginBottom="16dp"
-            android:text="Update" />
+            app:text="Update" />
 
     </LinearLayout>
-</ScrollView>
\ No newline at end of file
+</ScrollView>
diff --git a/catalog/src/main/res/layout/screen_badges_catalog.xml b/catalog/src/main/res/layout/screen_badges_catalog.xml
index f5fa34e0f..7f9c422df 100644
--- a/catalog/src/main/res/layout/screen_badges_catalog.xml
+++ b/catalog/src/main/res/layout/screen_badges_catalog.xml
@@ -30,25 +30,25 @@
             android:contentDescription="image" />
     </FrameLayout>
 
-    <Button
+    <com.telefonica.mistica.button.Button
         android:id="@+id/button_add_non_numeric_badge"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_marginTop="12dp"
-        android:text="Toggle" />
+        app:text="Toggle" />
 
-    <Button
+    <com.telefonica.mistica.button.Button
         android:id="@+id/button_add_numeric_badge"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_marginTop="8dp"
-        android:text="Toggle With Number > 0" />
+        app:text="Toggle With Number > 0" />
 
-    <Button
+    <com.telefonica.mistica.button.Button
         android:id="@+id/button_remove_badge_if_numeric_with_count_zero"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_marginTop="8dp"
-        android:text="Remove when number = 0" />
+        app:text="Remove when number = 0" />
 
-</LinearLayout>
\ No newline at end of file
+</LinearLayout>
diff --git a/catalog/src/main/res/layout/screen_buttons_catalog.xml b/catalog/src/main/res/layout/screen_buttons_catalog.xml
index 4502b73fb..fb1e905ff 100644
--- a/catalog/src/main/res/layout/screen_buttons_catalog.xml
+++ b/catalog/src/main/res/layout/screen_buttons_catalog.xml
@@ -1,429 +1,480 @@
 <?xml version="1.0" encoding="utf-8"?>
 <ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
-    xmlns:app="http://schemas.android.com/apk/res-auto"
-    xmlns:tools="http://schemas.android.com/tools"
-    tools:viewBindingIgnore="true"
-    android:layout_width="match_parent"
-    android:layout_height="match_parent"
-    android:orientation="vertical">
-
-    <LinearLayout
+        xmlns:app="http://schemas.android.com/apk/res-auto"
+        xmlns:tools="http://schemas.android.com/tools"
+        tools:viewBindingIgnore="true"
         android:layout_width="match_parent"
-        android:layout_height="wrap_content"
-        android:gravity="center_horizontal"
+        android:layout_height="match_parent"
         android:orientation="vertical"
-        android:padding="16dp">
+        >
 
-        <com.telefonica.mistica.title.TitleView
-            android:layout_width="wrap_content"
-            android:layout_height="wrap_content"
-            android:layout_gravity="start"
-            app:title="Buttons" />
-
-        <LinearLayout
+    <LinearLayout
             android:layout_width="match_parent"
             android:layout_height="wrap_content"
-            android:layout_marginTop="8dp"
             android:gravity="center_horizontal"
-            android:orientation="vertical">
-
-            <com.telefonica.mistica.button.Button
-                style="@style/AppTheme.Button.DefaultButton"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:text="Primary" />
-
-            <com.telefonica.mistica.button.Button
-                style="@style/AppTheme.Button.DefaultButton"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginTop="8dp"
-                android:text="Primary Icon"
-                app:icon="@drawable/icn_creditcard" />
-
-            <com.telefonica.mistica.button.ProgressButton
-                android:id="@+id/primary_progress"
-                style="@style/AppTheme.Button.DefaultButton"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginTop="8dp"
-                android:text="Primary Progress" />
-
-            <com.telefonica.mistica.button.Button
-                style="@style/AppTheme.Button.DefaultButton"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginTop="8dp"
-                android:enabled="false"
-                android:text="Primary Disabled" />
+            android:orientation="vertical"
+            android:padding="16dp"
+            >
 
-            <com.telefonica.mistica.button.Button
-                style="@style/AppTheme.Button.DefaultButton.Small"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginTop="8dp"
-                android:text="Primary Small" />
-
-            <com.telefonica.mistica.button.Button
-                style="@style/AppTheme.Button.DefaultButton.Small"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginTop="8dp"
-                android:text="Primary Small Icon"
-                app:icon="@drawable/icn_creditcard" />
-
-            <com.telefonica.mistica.button.ProgressButton
-                android:id="@+id/primary_small_progress"
-                style="@style/AppTheme.Button.DefaultButton.Small"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginTop="8dp"
-                android:text="Primary Small Progress" />
-
-            <com.telefonica.mistica.button.Button
-                style="@style/AppTheme.Button.DefaultButton.Small"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginTop="8dp"
-                android:enabled="false"
-                android:text="Primary Small Disabled" />
-
-            <com.telefonica.mistica.button.Button
-                style="@style/AppTheme.Button.SecondaryButton"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginTop="8dp"
-                android:text="Secondary" />
-
-            <com.telefonica.mistica.button.Button
-                style="@style/AppTheme.Button.SecondaryButton"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginTop="8dp"
-                android:text="Secondary Icon"
-                app:icon="@drawable/icn_creditcard" />
-
-            <com.telefonica.mistica.button.ProgressButton
-                android:id="@+id/secondary_progress"
-                style="@style/AppTheme.Button.SecondaryButton"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginTop="8dp"
-                android:text="Secondary Progress" />
-
-            <com.telefonica.mistica.button.Button
-                style="@style/AppTheme.Button.SecondaryButton"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginTop="8dp"
-                android:enabled="false"
-                android:text="Secondary Disabled" />
-
-            <com.telefonica.mistica.button.Button
-                style="@style/AppTheme.Button.SecondaryButton.Small"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginTop="8dp"
-                android:text="Secondary Small" />
-
-            <com.telefonica.mistica.button.Button
-                style="@style/AppTheme.Button.SecondaryButton.Small"
+        <com.telefonica.mistica.title.TitleView
                 android:layout_width="wrap_content"
                 android:layout_height="wrap_content"
-                android:layout_marginTop="8dp"
-                android:text="Secondary Small Icon"
-                app:icon="@drawable/icn_creditcard" />
+                android:layout_gravity="start"
+                app:title="Buttons"
+                />
 
-            <com.telefonica.mistica.button.ProgressButton
-                android:id="@+id/secondary_small_progress"
-                style="@style/AppTheme.Button.SecondaryButton.Small"
-                android:layout_width="wrap_content"
+        <LinearLayout
+                android:layout_width="match_parent"
                 android:layout_height="wrap_content"
                 android:layout_marginTop="8dp"
-                android:text="Secondary Small Progress" />
+                android:gravity="center_horizontal"
+                android:orientation="vertical"
+                >
 
             <com.telefonica.mistica.button.Button
-                style="@style/AppTheme.Button.SecondaryButton.Small"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginTop="8dp"
-                android:enabled="false"
-                android:text="Secondary Small Disabled" />
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    app:text="Primary"
+                    />
 
             <com.telefonica.mistica.button.Button
-                style="@style/AppTheme.Button.DangerButton"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginTop="8dp"
-                android:text="Danger" />
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_marginTop="8dp"
+                    app:text="Primary Icon"
+                    app:icon="@drawable/icn_creditcard"
+                    />
 
             <com.telefonica.mistica.button.Button
-                style="@style/AppTheme.Button.DangerButton"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginTop="8dp"
-                android:text="Danger Icon"
-                app:icon="@drawable/icn_creditcard" />
-
-            <com.telefonica.mistica.button.ProgressButton
-                android:id="@+id/danger_progress"
-                style="@style/AppTheme.Button.DangerButton"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginTop="8dp"
-                android:text="Danger Progress" />
+                    android:id="@+id/primary_progress"
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_marginTop="8dp"
+                    app:text="Primary Progress"
+                    />
 
             <com.telefonica.mistica.button.Button
-                style="@style/AppTheme.Button.DangerButton"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginTop="8dp"
-                android:enabled="false"
-                android:text="Danger Disabled" />
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_marginTop="8dp"
+                    app:enabled="false"
+                    app:text="Primary Disabled"
+                    />
 
             <com.telefonica.mistica.button.Button
-                style="@style/AppTheme.Button.DangerButton.Small"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginTop="8dp"
-                android:text="Danger Small" />
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_marginTop="8dp"
+                    app:text="Primary Small"
+                    app:style="PRIMARY_SMALL"
+                    />
 
             <com.telefonica.mistica.button.Button
-                style="@style/AppTheme.Button.DangerButton.Small"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginTop="8dp"
-                android:text="Danger Small Icon"
-                app:icon="@drawable/icn_creditcard" />
-
-            <com.telefonica.mistica.button.ProgressButton
-                android:id="@+id/danger_small_progress"
-                style="@style/AppTheme.Button.DangerButton.Small"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginTop="8dp"
-                android:text="Danger Small Progress" />
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_marginTop="8dp"
+                    app:text="Primary Small Icon"
+                    app:icon="@drawable/icn_creditcard"
+                    app:style="PRIMARY_SMALL"
+                    />
 
             <com.telefonica.mistica.button.Button
-                style="@style/AppTheme.Button.DangerButton.Small"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginTop="8dp"
-                android:enabled="false"
-                android:text="Danger Small Disabled" />
+                    android:id="@+id/primary_small_progress"
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_marginTop="8dp"
+                    app:text="Primary Small Progress"
+                    app:style="PRIMARY_SMALL"
+                    />
 
-            <com.telefonica.mistica.button.Button
-                style="@style/AppTheme.Button.LinkButton"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginTop="8dp"
-                android:text="Link" />
-
-            <com.telefonica.mistica.button.Button
-                style="@style/AppTheme.Button.LinkButton"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginTop="8dp"
-                android:text="Link Icon"
-                app:icon="@drawable/icn_creditcard"
-                app:iconTint="@color/text_button_link_selector" />
-
-            <com.telefonica.mistica.button.ProgressButton
-                android:id="@+id/link_progress"
-                style="@style/AppTheme.Button.LinkButton"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginTop="8dp"
-                android:text="Link Progress" />
-
-            <com.telefonica.mistica.button.Button
-                style="@style/AppTheme.Button.LinkButton"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginTop="8dp"
-                android:enabled="false"
-                android:text="Link Disabled" />
+            <com.telefonica.mistica.button.Button
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_marginTop="8dp"
+                    app:enabled="false"
+                    app:text="Primary Small Disabled"
+                    app:style="PRIMARY_SMALL"
+                    />
+
+            <com.telefonica.mistica.button.Button
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_marginTop="8dp"
+                    app:text="Secondary"
+                    app:style="SECONDARY"
+                    />
+
+            <com.telefonica.mistica.button.Button
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_marginTop="8dp"
+                    app:text="Secondary Icon"
+                    app:style="SECONDARY"
+                    app:icon="@drawable/icn_creditcard"
+                    />
+
+            <com.telefonica.mistica.button.Button
+                    android:id="@+id/secondary_progress"
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_marginTop="8dp"
+                    app:text="Secondary Progress"
+                    app:style="SECONDARY"
+                    />
+
+            <com.telefonica.mistica.button.Button
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_marginTop="8dp"
+                    app:enabled="false"
+                    app:text="Secondary Disabled"
+                    app:style="SECONDARY"
+                    />
+
+            <com.telefonica.mistica.button.Button
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_marginTop="8dp"
+                    app:text="Secondary Small"
+                    app:style="PRIMARY_SMALL"
+                    />
+
+            <com.telefonica.mistica.button.Button
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_marginTop="8dp"
+                    app:text="Secondary Small Icon"
+                    app:style="PRIMARY_SMALL"
+                    app:icon="@drawable/icn_creditcard"
+                    />
+
+            <com.telefonica.mistica.button.Button
+                    android:id="@+id/secondary_small_progress"
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_marginTop="8dp"
+                    app:text="Secondary Small Progress"
+                    app:style="PRIMARY_SMALL"
+                    />
+
+            <com.telefonica.mistica.button.Button
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_marginTop="8dp"
+                    app:enabled="false"
+                    app:text="Secondary Small Disabled"
+                    app:style="PRIMARY_SMALL"
+                    />
+
+            <com.telefonica.mistica.button.Button
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_marginTop="8dp"
+                    app:text="Danger"
+                    app:style="DANGER"
+                    />
+
+            <com.telefonica.mistica.button.Button
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_marginTop="8dp"
+                    app:text="Danger Icon"
+                    app:icon="@drawable/icn_creditcard"
+                    app:style="DANGER"
+                    />
+
+            <com.telefonica.mistica.button.Button
+                    android:id="@+id/danger_progress"
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_marginTop="8dp"
+                    app:text="Danger Progress"
+                    app:style="DANGER"
+                    />
+
+            <com.telefonica.mistica.button.Button
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_marginTop="8dp"
+                    app:enabled="false"
+                    app:text="Danger Disabled"
+                    app:style="DANGER"
+                    />
+
+            <com.telefonica.mistica.button.Button
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_marginTop="8dp"
+                    app:text="Danger Small"
+                    app:style="DANGER_SMALL"
+                    />
+
+            <com.telefonica.mistica.button.Button
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_marginTop="8dp"
+                    app:text="Danger Small Icon"
+                    app:icon="@drawable/icn_creditcard"
+                    app:style="DANGER_SMALL"
+                    />
+
+            <com.telefonica.mistica.button.Button
+                    android:id="@+id/danger_small_progress"
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_marginTop="8dp"
+                    app:text="Danger Small Progress"
+                    app:style="DANGER_SMALL"
+                    />
+
+            <com.telefonica.mistica.button.Button
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_marginTop="8dp"
+                    app:enabled="false"
+                    app:text="Danger Small Disabled"
+                    app:style="DANGER_SMALL"
+                    />
+
+            <com.telefonica.mistica.button.Button
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_marginTop="8dp"
+                    app:text="Link"
+                    app:style="LINK"
+                    />
+
+            <com.telefonica.mistica.button.Button
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_marginTop="8dp"
+                    app:text="Link Icon"
+                    app:icon="@drawable/icn_creditcard"
+                    app:iconTint="@color/text_button_link_selector"
+                    app:style="LINK"
+                    />
+
+            <com.telefonica.mistica.button.Button
+                    android:id="@+id/link_progress"
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_marginTop="8dp"
+                    app:text="Link Progress"
+                    app:style="LINK"
+                    />
+
+            <com.telefonica.mistica.button.Button
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_marginTop="8dp"
+                    app:enabled="false"
+                    app:text="Link Disabled"
+                    app:style="LINK"
+                    />
 
         </LinearLayout>
 
         <com.telefonica.mistica.title.TitleView
-            android:layout_width="wrap_content"
-            android:layout_height="wrap_content"
-            android:layout_gravity="start"
-            android:layout_marginTop="8dp"
-            app:title="Inverse Buttons" />
-
-        <LinearLayout
-            android:layout_width="match_parent"
-            android:layout_height="wrap_content"
-            android:layout_marginTop="8dp"
-            android:background="?attr/colorBackgroundBrand"
-            android:gravity="center_horizontal"
-            android:orientation="vertical">
-
-            <com.telefonica.mistica.button.Button
-                style="@style/AppTheme.Button.PrimaryButtonInverse"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginTop="16dp"
-                android:text="Primary" />
-
-            <com.telefonica.mistica.button.Button
-                style="@style/AppTheme.Button.PrimaryButtonInverse"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginTop="8dp"
-                android:text="Primary Icon"
-                app:icon="@drawable/icn_creditcard"
-                app:iconTint="@color/text_button_primary_inverse_selector" />
-
-            <com.telefonica.mistica.button.ProgressButton
-                android:id="@+id/primary_inverse_progress"
-                style="@style/AppTheme.Button.PrimaryButtonInverse"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginTop="8dp"
-                android:text="Primary Progress" />
-
-            <com.telefonica.mistica.button.Button
-                style="@style/AppTheme.Button.PrimaryButtonInverse"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginTop="8dp"
-                android:enabled="false"
-                android:text="Primary Disabled" />
-
-            <com.telefonica.mistica.button.Button
-                style="@style/AppTheme.Button.PrimaryButtonInverse.Small"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginTop="8dp"
-                android:text="Primary Small" />
-
-            <com.telefonica.mistica.button.Button
-                style="@style/AppTheme.Button.PrimaryButtonInverse.Small"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginTop="8dp"
-                android:text="Primary Small Icon"
-                app:icon="@drawable/icn_creditcard"
-                app:iconTint="@color/text_button_primary_inverse_selector" />
-
-            <com.telefonica.mistica.button.ProgressButton
-                android:id="@+id/primary_small_inverse_progress"
-                style="@style/AppTheme.Button.PrimaryButtonInverse.Small"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginTop="8dp"
-                android:text="Primary Small Progress" />
-
-            <com.telefonica.mistica.button.Button
-                style="@style/AppTheme.Button.PrimaryButtonInverse.Small"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginTop="8dp"
-                android:enabled="false"
-                android:text="Primary Small Disabled" />
-
-            <com.telefonica.mistica.button.Button
-                style="@style/AppTheme.Button.SecondaryButtonInverse"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginTop="8dp"
-                android:text="Secondary" />
-
-            <com.telefonica.mistica.button.Button
-                style="@style/AppTheme.Button.SecondaryButtonInverse"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginTop="8dp"
-                android:text="Secondary Icon"
-                app:icon="@drawable/icn_creditcard"
-                app:iconTint="@color/text_button_secondary_inverse_selector" />
-
-            <com.telefonica.mistica.button.ProgressButton
-                android:id="@+id/secondary_inverse_progress"
-                style="@style/AppTheme.Button.SecondaryButtonInverse"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginTop="8dp"
-                android:text="Secondary Progress" />
-
-            <com.telefonica.mistica.button.Button
-                style="@style/AppTheme.Button.SecondaryButtonInverse"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginTop="8dp"
-                android:enabled="false"
-                android:text="Secondary Disabled" />
-
-            <com.telefonica.mistica.button.Button
-                style="@style/AppTheme.Button.SecondaryButtonInverse.Small"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginTop="8dp"
-                android:text="Secondary Small" />
-
-            <com.telefonica.mistica.button.Button
-                style="@style/AppTheme.Button.SecondaryButtonInverse.Small"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginTop="8dp"
-                android:text="Secondary Small Icon"
-                app:icon="@drawable/icn_creditcard"
-                app:iconTint="@color/text_button_secondary_inverse_selector" />
-
-            <com.telefonica.mistica.button.ProgressButton
-                android:id="@+id/secondary_small_inverse_progress"
-                style="@style/AppTheme.Button.SecondaryButtonInverse.Small"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginTop="8dp"
-                android:text="Secondary Small Progress" />
-
-            <com.telefonica.mistica.button.Button
-                style="@style/AppTheme.Button.SecondaryButtonInverse.Small"
                 android:layout_width="wrap_content"
                 android:layout_height="wrap_content"
+                android:layout_gravity="start"
                 android:layout_marginTop="8dp"
-                android:enabled="false"
-                android:text="Secondary Small Disabled" />
+                app:title="Inverse Buttons" />
 
-            <com.telefonica.mistica.button.Button
-                style="@style/AppTheme.Button.LinkButtonInverse"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginTop="8dp"
-                android:text="Link" />
-
-            <com.telefonica.mistica.button.Button
-                style="@style/AppTheme.Button.LinkButtonInverse"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginTop="8dp"
-                android:text="Link Icon"
-                app:icon="@drawable/icn_creditcard"
-                app:iconTint="@color/text_button_link_inverse_selector" />
-
-            <com.telefonica.mistica.button.ProgressButton
-                android:id="@+id/link_inverse_progress"
-                style="@style/AppTheme.Button.LinkButtonInverse"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginTop="8dp"
-                android:text="Link Progress" />
-
-            <com.telefonica.mistica.button.Button
-                style="@style/AppTheme.Button.LinkButtonInverse"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginTop="8dp"
-                android:layout_marginBottom="8dp"
-                android:enabled="false"
-                android:text="Link Disabled" />
+        <LinearLayout
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:layout_marginTop="8dp"
+                android:background="?attr/colorBackgroundBrand"
+                android:gravity="center_horizontal"
+                android:orientation="vertical"
+                >
+
+            <com.telefonica.mistica.button.Button
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_marginTop="16dp"
+                    app:text="Primary"
+                    app:style="PRIMARY_INVERSE"
+                    />
+
+            <com.telefonica.mistica.button.Button
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_marginTop="8dp"
+                    app:text="Primary Icon"
+                    app:icon="@drawable/icn_creditcard"
+                    app:iconTint="@color/text_button_primary_inverse_selector"
+                    app:style="PRIMARY_INVERSE"
+                    />
+
+            <com.telefonica.mistica.button.Button
+                    android:id="@+id/primary_inverse_progress"
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_marginTop="8dp"
+                    app:text="Primary Progress"
+                    app:style="PRIMARY_INVERSE"
+                    />
+
+            <com.telefonica.mistica.button.Button
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_marginTop="8dp"
+                    app:enabled="false"
+                    app:text="Primary Disabled"
+                    app:style="PRIMARY_INVERSE"
+                    />
+
+            <com.telefonica.mistica.button.Button
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_marginTop="8dp"
+                    app:text="Primary Small"
+                    app:style="PRIMARY_SMALL_INVERSE"
+                    />
+
+            <com.telefonica.mistica.button.Button
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_marginTop="8dp"
+                    app:text="Primary Small Icon"
+                    app:icon="@drawable/icn_creditcard"
+                    app:iconTint="@color/text_button_primary_inverse_selector"
+                    app:style="PRIMARY_SMALL_INVERSE"
+                    />
+
+            <com.telefonica.mistica.button.Button
+                    android:id="@+id/primary_small_inverse_progress"
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_marginTop="8dp"
+                    app:text="Primary Small Progress"
+                    app:style="PRIMARY_SMALL_INVERSE"
+                    />
+
+            <com.telefonica.mistica.button.Button
+                    style="@style/AppTheme.Button.PrimaryButtonInverse.Small"
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_marginTop="8dp"
+                    app:enabled="false"
+                    app:text="Primary Small Disabled"
+                    app:style="PRIMARY_SMALL_INVERSE"
+                    />
+
+            <com.telefonica.mistica.button.Button
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_marginTop="8dp"
+                    app:text="Secondary"
+                    app:style="SECONDARY_INVERSE"
+                    />
+
+            <com.telefonica.mistica.button.Button
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_marginTop="8dp"
+                    app:text="Secondary Icon"
+                    app:icon="@drawable/icn_creditcard"
+                    app:iconTint="@color/text_button_secondary_inverse_selector"
+                    app:style="SECONDARY_INVERSE"
+                    />
+
+            <com.telefonica.mistica.button.Button
+                    android:id="@+id/secondary_inverse_progress"
+                    style="@style/AppTheme.Button.SecondaryButtonInverse"
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_marginTop="8dp"
+                    app:text="Secondary Progress"
+                    app:style="SECONDARY_INVERSE"
+                    />
+
+            <com.telefonica.mistica.button.Button
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_marginTop="8dp"
+                    app:enabled="false"
+                    app:text="Secondary Disabled"
+                    app:style="SECONDARY_INVERSE"
+                    />
+
+            <com.telefonica.mistica.button.Button
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_marginTop="8dp"
+                    app:text="Secondary Small"
+                    app:style="SECONDARY_SMALL_INVERSE"
+                    />
+
+            <com.telefonica.mistica.button.Button
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_marginTop="8dp"
+                    app:text="Secondary Small Icon"
+                    app:icon="@drawable/icn_creditcard"
+                    app:iconTint="@color/text_button_secondary_inverse_selector"
+                    app:style="SECONDARY_SMALL_INVERSE"
+                    />
+
+            <com.telefonica.mistica.button.Button
+                    android:id="@+id/secondary_small_inverse_progress"
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_marginTop="8dp"
+                    app:text="Secondary Small Progress"
+                    app:style="SECONDARY_SMALL_INVERSE"
+                    />
+
+            <com.telefonica.mistica.button.Button
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_marginTop="8dp"
+                    app:enabled="false"
+                    app:text="Secondary Small Disabled"
+                    app:style="SECONDARY_SMALL_INVERSE"
+                    />
+
+            <com.telefonica.mistica.button.Button
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_marginTop="8dp"
+                    app:text="Link"
+                    app:style="LINK_INVERSE"
+                    />
+
+            <com.telefonica.mistica.button.Button
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_marginTop="8dp"
+                    app:text="Link Icon"
+                    app:icon="@drawable/icn_creditcard"
+                    app:iconTint="@color/text_button_link_inverse_selector"
+                    app:style="LINK_INVERSE"
+                    />
+
+            <com.telefonica.mistica.button.Button
+                    android:id="@+id/link_inverse_progress"
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_marginTop="8dp"
+                    app:text="Link Progress"
+                    app:style="LINK_INVERSE"
+                    />
+
+            <com.telefonica.mistica.button.Button
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_marginTop="8dp"
+                    android:layout_marginBottom="8dp"
+                    app:style="LINK_INVERSE"
+                    app:enabled="false"
+                    app:text="Link Disabled"
+                    />
 
         </LinearLayout>
 
     </LinearLayout>
 
-</ScrollView>
\ No newline at end of file
+</ScrollView>
diff --git a/catalog/src/main/res/layout/screen_callouts_catalog.xml b/catalog/src/main/res/layout/screen_callouts_catalog.xml
index 91568b9a3..e73a90c42 100644
--- a/catalog/src/main/res/layout/screen_callouts_catalog.xml
+++ b/catalog/src/main/res/layout/screen_callouts_catalog.xml
@@ -128,8 +128,8 @@
 				android:layout_width="match_parent"
 				android:layout_height="wrap_content"
 				android:layout_margin="16dp"
-				android:text="Update"
+				app:text="Update"
 				/>
 
 	</LinearLayout>
-</ScrollView>
\ No newline at end of file
+</ScrollView>
diff --git a/catalog/src/main/res/layout/screen_fragment_sheet_catalog.xml b/catalog/src/main/res/layout/screen_fragment_sheet_catalog.xml
index a8b98179f..7a01f65a5 100644
--- a/catalog/src/main/res/layout/screen_fragment_sheet_catalog.xml
+++ b/catalog/src/main/res/layout/screen_fragment_sheet_catalog.xml
@@ -150,7 +150,7 @@
 				android:layout_width="wrap_content"
 				android:layout_height="wrap_content"
 				android:layout_marginTop="12dp"
-				android:text="Show Feedback"
+				app:text="Show Feedback"
 				android:visibility="gone"
 				/>
 
diff --git a/catalog/src/main/res/layout/screen_inputs_catalog.xml b/catalog/src/main/res/layout/screen_inputs_catalog.xml
index 43f095f2a..3abe323b6 100644
--- a/catalog/src/main/res/layout/screen_inputs_catalog.xml
+++ b/catalog/src/main/res/layout/screen_inputs_catalog.xml
@@ -170,11 +170,11 @@
 
             <com.telefonica.mistica.button.Button
                 android:id="@+id/button_text_input_email"
-                style="@style/AppTheme.Button.DefaultButton.Small"
                 android:layout_width="wrap_content"
                 android:layout_height="wrap_content"
                 android:layout_marginTop="8dp"
-                android:text="Validate email" />
+                app:text="Validate email"
+                app:style="PRIMARY_SMALL"/>
 
             <com.telefonica.mistica.title.TitleView
                 android:layout_width="wrap_content"
@@ -193,11 +193,11 @@
 
             <com.telefonica.mistica.button.Button
                 android:id="@+id/button_text_input_phone"
-                style="@style/AppTheme.Button.DefaultButton.Small"
                 android:layout_width="wrap_content"
                 android:layout_height="wrap_content"
                 android:layout_marginTop="8dp"
-                android:text="Validate phone" />
+                app:text="Validate phone"
+                app:style="PRIMARY_SMALL"/>
 
             <com.telefonica.mistica.title.TitleView
                 android:layout_width="wrap_content"
@@ -215,11 +215,11 @@
 
             <com.telefonica.mistica.button.Button
                 android:id="@+id/button_text_input_custom"
-                style="@style/AppTheme.Button.DefaultButton.Small"
                 android:layout_width="wrap_content"
                 android:layout_height="wrap_content"
                 android:layout_marginTop="8dp"
-                android:text="Validate" />
+                app:text="Validate"
+                app:style="PRIMARY_SMALL"/>
 
             <com.telefonica.mistica.title.TitleView
                 android:layout_width="wrap_content"
@@ -351,4 +351,4 @@
 
     </LinearLayout>
 
-</ScrollView>
\ No newline at end of file
+</ScrollView>
diff --git a/catalog/src/main/res/layout/screen_popovers_catalog.xml b/catalog/src/main/res/layout/screen_popovers_catalog.xml
index de7054a1a..f478313b2 100644
--- a/catalog/src/main/res/layout/screen_popovers_catalog.xml
+++ b/catalog/src/main/res/layout/screen_popovers_catalog.xml
@@ -46,21 +46,21 @@
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_marginTop="12dp"
-        android:text="Test" />
+        app:text="Test" />
 
     <com.telefonica.mistica.button.Button
         android:id="@+id/button_hide_no_animation"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_marginTop="8dp"
-        android:text="Hide no animation" />
+        app:text="Hide no animation" />
 
     <com.telefonica.mistica.button.Button
         android:id="@+id/button_create_popover_on_top"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_marginTop="8dp"
-        android:text="Test on top" />
+        app:text="Test on top" />
 
     <com.telefonica.mistica.input.DropDownInput
             android:id="@+id/popover_position"
diff --git a/catalog/src/main/res/layout/screen_scroll_content_indicator_catalog.xml b/catalog/src/main/res/layout/screen_scroll_content_indicator_catalog.xml
index 2bf599d75..03b66d913 100644
--- a/catalog/src/main/res/layout/screen_scroll_content_indicator_catalog.xml
+++ b/catalog/src/main/res/layout/screen_scroll_content_indicator_catalog.xml
@@ -30,8 +30,8 @@
         android:id="@+id/showHide"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
-        android:text="Show"
+        app:text="Show"
         app:layout_constraintBottom_toBottomOf="parent"
         app:layout_constraintEnd_toEndOf="parent"
         app:layout_constraintStart_toStartOf="parent" />
-</androidx.constraintlayout.widget.ConstraintLayout>
\ No newline at end of file
+</androidx.constraintlayout.widget.ConstraintLayout>
diff --git a/catalog/src/main/res/layout/screen_snackbar_catalog.xml b/catalog/src/main/res/layout/screen_snackbar_catalog.xml
index ece7ced60..68fb9da63 100644
--- a/catalog/src/main/res/layout/screen_snackbar_catalog.xml
+++ b/catalog/src/main/res/layout/screen_snackbar_catalog.xml
@@ -72,6 +72,6 @@
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_marginTop="12dp"
-        android:text="Test!" />
+        app:text="Test!" />
 
-</LinearLayout>
\ No newline at end of file
+</LinearLayout>
diff --git a/catalog/src/main/res/layout/screen_steppers_catalog.xml b/catalog/src/main/res/layout/screen_steppers_catalog.xml
index 69e04fe2d..981ccf34f 100644
--- a/catalog/src/main/res/layout/screen_steppers_catalog.xml
+++ b/catalog/src/main/res/layout/screen_steppers_catalog.xml
@@ -77,20 +77,18 @@
             android:layout_marginEnd="16dp"
             android:orientation="horizontal"
             android:gravity="center_horizontal">
-            <Button
+            <com.telefonica.mistica.button.Button
                 android:id="@+id/previous_step"
-                style="@style/AppTheme.Button"
                 android:layout_width="wrap_content"
                 android:layout_height="wrap_content"
                 android:layout_marginEnd="16dp"
-                android:text="Previous" />
-            <Button
+                app:text="Previous" />
+            <com.telefonica.mistica.button.Button
                 android:id="@+id/next_step"
-                style="@style/AppTheme.Button"
                 android:layout_width="wrap_content"
                 android:layout_height="wrap_content"
-                android:text="Next" />
+                app:text="Next" />
         </LinearLayout>
 
     </LinearLayout>
-</ScrollView>
\ No newline at end of file
+</ScrollView>
diff --git a/catalog/src/main/res/layout/screen_tabs_catalog.xml b/catalog/src/main/res/layout/screen_tabs_catalog.xml
index 7b4637ad5..b300f91fc 100644
--- a/catalog/src/main/res/layout/screen_tabs_catalog.xml
+++ b/catalog/src/main/res/layout/screen_tabs_catalog.xml
@@ -46,7 +46,7 @@
         android:layout_marginEnd="8dp"
         android:layout_marginStart="8dp"
         android:layout_marginTop="8dp"
-        android:text="Add Tab" />
+        app:text="Add Tab" />
 
     <com.telefonica.mistica.button.Button
         android:id="@+id/remove_tab_button"
@@ -55,6 +55,6 @@
         android:layout_marginEnd="8dp"
         android:layout_marginStart="8dp"
         android:layout_marginTop="12dp"
-        android:text="Remove Tab" />
+        app:text="Remove Tab" />
 
 </LinearLayout>
diff --git a/library/src/main/java/com/telefonica/mistica/button/Button.kt b/library/src/main/java/com/telefonica/mistica/button/Button.kt
index eadfe3dc7..b4d8d1e75 100644
--- a/library/src/main/java/com/telefonica/mistica/button/Button.kt
+++ b/library/src/main/java/com/telefonica/mistica/button/Button.kt
@@ -2,23 +2,103 @@ package com.telefonica.mistica.button
 
 import android.content.Context
 import android.util.AttributeSet
-import com.google.android.material.button.MaterialButton
-import com.telefonica.mistica.util.setAlpha
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.setValue
+import com.telefonica.mistica.R
+import com.telefonica.mistica.compose.button.Button
+import com.telefonica.mistica.compose.button.ButtonStyle
+import com.telefonica.mistica.compose.composeview.AbstractMisticaComposeView
 
-class Button : MaterialButton {
+class Button : AbstractMisticaComposeView {
 
-    constructor(context: Context) : super(context)
+    var text: String by mutableStateOf("")
+    var loadingText: String by mutableStateOf("")
+    var isLoading: Boolean by mutableStateOf(false)
+    var style: ButtonStyle by mutableStateOf(ButtonStyle.PRIMARY)
+    var icon: Int? by mutableStateOf(null)
 
-    constructor(context: Context, attrs: AttributeSet?) : super(context, attrs)
+    private var onClick: () -> Unit by mutableStateOf({})
+    private var isEnable: Boolean by mutableStateOf(true)
+
+    constructor(context: Context) : super(context) {
+        init()
+    }
+
+    constructor(context: Context, attrs: AttributeSet?) : super(context, attrs) {
+        init(attrs = attrs)
+    }
 
     constructor(context: Context, attrs: AttributeSet?, defStyleAttr: Int) : super(
         context,
         attrs,
         defStyleAttr
-    )
+    ) {
+        init(attrs = attrs)
+    }
+
+    fun init(
+        attrs: AttributeSet? = null,
+        defStyleAttr: Int = 0,
+    ) {
+        attrs?.let {
+            val styledAttrs = context.theme.obtainStyledAttributes(
+                attrs,
+                R.styleable.Button,
+                defStyleAttr,
+                0
+            )
+            try {
+                text = styledAttrs.getString(R.styleable.Button_text) ?: ""
+                loadingText = styledAttrs.getString(R.styleable.Button_loadingText) ?: ""
+                style = styledAttrs.getInt(R.styleable.Button_style, 0).toButtonStyle()
+                isLoading = styledAttrs.getBoolean(R.styleable.Button_isLoading, false)
+                isEnable = styledAttrs.getBoolean(R.styleable.Button_enabled, true)
+                icon = styledAttrs.getResourceId(R.styleable.Button_icon, 0).takeIf { it != 0 }
+            } finally {
+                styledAttrs.recycle()
+            }
+        }
+    }
 
     override fun setEnabled(enabled: Boolean) {
         super.setEnabled(enabled)
-        setAlpha(enabled)
+        isEnable = enabled
+    }
+
+    override fun setOnClickListener(listener: OnClickListener?) {
+        onClick = { listener?.onClick(this) }
     }
-}
\ No newline at end of file
+
+    @Composable
+    override fun Content() {
+        Theme {
+            Button(
+                text = text,
+                loadingText = loadingText,
+                buttonStyle = style,
+                isLoading = isLoading,
+                enabled = isEnable,
+                icon = icon,
+                onClickListener = onClick
+            )
+        }
+    }
+}
+
+private fun Int?.toButtonStyle(): ButtonStyle = when (this) {
+    0 -> ButtonStyle.PRIMARY
+    1 -> ButtonStyle.PRIMARY_SMALL
+    2 -> ButtonStyle.SECONDARY
+    3 -> ButtonStyle.SECONDARY_SMALL
+    4 -> ButtonStyle.DANGER
+    5 -> ButtonStyle.DANGER_SMALL
+    6 -> ButtonStyle.LINK
+    7 -> ButtonStyle.PRIMARY_INVERSE
+    8 -> ButtonStyle.PRIMARY_SMALL_INVERSE
+    9 -> ButtonStyle.SECONDARY_INVERSE
+    10 -> ButtonStyle.SECONDARY_SMALL_INVERSE
+    11 -> ButtonStyle.LINK_INVERSE
+    else -> ButtonStyle.PRIMARY
+}
diff --git a/library/src/main/java/com/telefonica/mistica/button/ProgressButton.kt b/library/src/main/java/com/telefonica/mistica/button/ProgressButton.kt
deleted file mode 100644
index beb001047..000000000
--- a/library/src/main/java/com/telefonica/mistica/button/ProgressButton.kt
+++ /dev/null
@@ -1,335 +0,0 @@
-package com.telefonica.mistica.button
-
-import android.animation.Animator
-import android.animation.AnimatorSet
-import android.animation.ArgbEvaluator
-import android.animation.ObjectAnimator
-import android.annotation.SuppressLint
-import android.content.Context
-import android.content.res.ColorStateList
-import android.graphics.Color
-import android.graphics.PorterDuff
-import android.graphics.Rect
-import android.util.AttributeSet
-import android.view.Gravity
-import android.view.MotionEvent
-import android.view.View
-import android.view.ViewGroup
-import android.view.animation.PathInterpolator
-import android.widget.FrameLayout
-import android.widget.ProgressBar
-import android.widget.TextView
-import androidx.annotation.ColorInt
-import androidx.annotation.StringRes
-import androidx.appcompat.content.res.AppCompatResources
-import androidx.core.graphics.ColorUtils
-import com.google.android.material.button.MaterialButton
-import com.telefonica.mistica.R
-import com.telefonica.mistica.util.setAlpha
-
-class ProgressButton : FrameLayout {
-
-    private val progressBar: ProgressBar = ProgressBar(context)
-    private val buttonNormal: MaterialButton
-    private val buttonLoading: MaterialButton
-    private val buttonBackground: MaterialButton
-
-    private lateinit var originalTextColors: ColorStateList
-
-    var isLoading: Boolean = false
-        private set
-    private var currentAnimation: AnimatorSet? = null
-
-    constructor(context: Context) : super(context) {
-        buttonNormal = MaterialButton(context)
-        buttonLoading = MaterialButton(context)
-        buttonBackground = MaterialButton(context)
-        init()
-    }
-
-    constructor(context: Context, attrs: AttributeSet?) : super(context, attrs) {
-        buttonNormal = MaterialButton(context, attrs)
-        buttonLoading = MaterialButton(context, attrs)
-        buttonBackground = MaterialButton(context, attrs)
-        init(attrs)
-    }
-
-    constructor(context: Context, attrs: AttributeSet?, defStyleAttr: Int) : super(
-        context,
-        attrs,
-        defStyleAttr
-    ) {
-        buttonNormal = MaterialButton(context, attrs, defStyleAttr)
-        buttonLoading = MaterialButton(context, attrs, defStyleAttr)
-        buttonBackground = MaterialButton(context, attrs, defStyleAttr)
-        init(attrs, defStyleAttr)
-    }
-
-    @SuppressLint("ClickableViewAccessibility")
-    private fun init(attrs: AttributeSet? = null, defStyleAttr: Int = 0) {
-        if (attrs != null) {
-            val theme = context.theme
-            val styledAttrs =
-                theme.obtainStyledAttributes(attrs, R.styleable.ProgressButton, defStyleAttr, 0)
-            try {
-                isLoading = styledAttrs.getBoolean(R.styleable.ProgressButton_isLoading, false)
-            } finally {
-                styledAttrs.recycle()
-            }
-        }
-
-        isClickable = false
-        setPadding(0, 0, 0, 0)
-        setBackgroundColor(Color.TRANSPARENT)
-        originalTextColors = buttonNormal.textColors
-
-        buttonNormal.apply {
-            id = NO_ID
-            layoutParams = LayoutParams(
-                ViewGroup.LayoutParams.MATCH_PARENT,
-                ViewGroup.LayoutParams.MATCH_PARENT
-            )
-            showTextOnly()
-        }
-
-        buttonLoading.apply {
-            id = NO_ID
-            layoutParams = LayoutParams(
-                ViewGroup.LayoutParams.MATCH_PARENT,
-                ViewGroup.LayoutParams.MATCH_PARENT
-            )
-            showTextOnly()
-            icon = AppCompatResources.getDrawable(context, R.drawable.empty_material_button_icon)
-            text = ""
-        }
-
-        progressBar.apply {
-            layoutParams = LayoutParams(buttonLoading.iconSize, buttonLoading.iconSize)
-                .apply {
-                    gravity = Gravity.CENTER
-                }
-            isIndeterminate = true
-            indeterminateTintMode = PorterDuff.Mode.SRC_IN
-            visibility = View.INVISIBLE
-        }
-
-        buttonBackground.apply {
-            id = NO_ID
-            layoutParams = LayoutParams(
-                ViewGroup.LayoutParams.MATCH_PARENT,
-                ViewGroup.LayoutParams.MATCH_PARENT
-            )
-            icon = null
-            setTextColor(Color.TRANSPARENT)
-            visibility = View.VISIBLE
-            setOnTouchListener { view, event ->
-                when (event.action) {
-                    MotionEvent.ACTION_DOWN -> {
-                        buttonNormal.isPressed = true
-                        buttonLoading.isPressed = true
-                    }
-                    MotionEvent.ACTION_MOVE -> {
-                        val outsideBounds =
-                            event.x < 0 || event.y < 0 || event.x > view.measuredWidth || event.y > view.measuredHeight
-                        buttonNormal.isPressed = !outsideBounds
-                        buttonLoading.isPressed = !outsideBounds
-                    }
-                    MotionEvent.ACTION_UP, MotionEvent.ACTION_CANCEL -> {
-                        buttonNormal.isPressed = false
-                        buttonLoading.isPressed = false
-                    }
-                }
-                false
-            }
-        }
-
-        addView(buttonBackground)
-        addView(buttonNormal)
-        addView(buttonLoading)
-        addView(progressBar)
-
-        setVisibilityAndColors()
-    }
-
-    fun getText(): CharSequence =
-        buttonBackground.text
-
-    fun setText(text: CharSequence) {
-        buttonNormal.text = text
-        if (!isLoading) {
-            buttonBackground.text = text
-        }
-    }
-
-    fun setText(@StringRes textId: Int) {
-        setText(context.getString(textId))
-    }
-
-    fun setLoadingText(text: CharSequence) {
-        buttonLoading.text = text
-        if (isLoading) {
-            buttonBackground.text = text
-        }
-    }
-
-    override fun setOnClickListener(l: OnClickListener?) {
-        buttonBackground.setOnClickListener(l)
-    }
-
-    override fun setEnabled(enabled: Boolean) {
-        super.setEnabled(enabled)
-        setAlpha(enabled)
-        buttonBackground.isEnabled = enabled
-        buttonNormal.isEnabled = enabled
-        buttonLoading.isEnabled = enabled
-        progressBar.isEnabled = enabled
-    }
-
-    fun setIsLoading(loading: Boolean) {
-        if (loading) {
-            showLoading()
-        } else {
-            hideLoading()
-        }
-    }
-
-    fun showLoading() {
-        if (!isLoading) {
-            switchState()
-        }
-    }
-
-    fun hideLoading() {
-        if (isLoading) {
-            switchState()
-        }
-    }
-
-    private fun switchState() {
-        currentAnimation?.cancel()
-
-        val maxTranslation: Float =
-            resources.getDimensionPixelSize(R.dimen.button_max_animation_translation).toFloat()
-
-        currentAnimation = AnimatorSet().apply {
-            playTogether(
-                getCurrentTextColorFadeAnim(buttonNormal, !isLoading),
-                getTranslationYAnim(
-                    buttonNormal,
-                    floatArrayOf(0F, -maxTranslation).reverseIfLoading()
-                ),
-                getCurrentTextColorFadeAnim(buttonLoading, isLoading).apply {
-                    addUpdateListener {
-                        progressBar.indeterminateTintList = buttonLoading.textColors
-                    }
-                },
-                getTranslationYAnim(
-                    buttonLoading,
-                    floatArrayOf(maxTranslation, 0F).reverseIfLoading()
-                ).apply {
-                    addUpdateListener { progressBar.translationY = buttonLoading.translationY }
-                }
-            )
-            interpolator = getCubicBezierInterpolator()
-            duration = ANIMATION_DURATION
-            addListener(object : Animator.AnimatorListener {
-                override fun onAnimationRepeat(animator: Animator) {}
-
-                override fun onAnimationEnd(animator: Animator) {
-                    setVisibilityAndColors()
-                    if (!isLoading) {
-                        buttonBackground.isClickable = true
-                    }
-                }
-
-                override fun onAnimationCancel(animator: Animator) {
-                    animator.end()
-                }
-
-                override fun onAnimationStart(animator: Animator) {
-                    if (!buttonLoading.text.isNullOrBlank()) {
-                        setProgressBarHorizontalPosition()
-                    }
-                    isLoading = !isLoading
-                    buttonNormal.visibility = View.VISIBLE
-                    buttonLoading.visibility = View.VISIBLE
-                    progressBar.visibility = View.VISIBLE
-                    if (isLoading) {
-                        buttonBackground.isClickable = false
-                    }
-                }
-            })
-        }
-        currentAnimation?.start()
-    }
-
-    private fun setVisibilityAndColors() {
-        buttonNormal.visibility = if (isLoading) View.INVISIBLE else View.VISIBLE
-        buttonLoading.visibility = if (isLoading) View.VISIBLE else View.INVISIBLE
-        progressBar.visibility = if (isLoading) View.VISIBLE else View.INVISIBLE
-        buttonBackground.text = if (isLoading) buttonLoading.text else buttonNormal.text
-
-        buttonNormal.setTextColor(originalTextColors)
-        buttonLoading.setTextColor(originalTextColors)
-        progressBar.translationY = 0F
-        progressBar.indeterminateTintList = originalTextColors
-    }
-
-    private fun MaterialButton.showTextOnly() {
-        background = null
-        isClickable = false
-        isFocusable = false
-        strokeWidth = 0
-        rippleColor = ColorStateList.valueOf(Color.TRANSPARENT)
-        importantForAccessibility = View.IMPORTANT_FOR_ACCESSIBILITY_NO
-    }
-
-    private fun setProgressBarHorizontalPosition() {
-        val bounds = Rect()
-        buttonLoading.paint.getTextBounds(
-            buttonLoading.text.toString(),
-            0,
-            buttonLoading.text.length,
-            bounds
-        )
-        val textWidth: Float =
-            bounds.width().toFloat() + buttonLoading.iconSize + buttonLoading.iconPadding
-        progressBar.x = (buttonLoading.width - textWidth) / 2
-    }
-
-    private fun getCurrentTextColorFadeAnim(view: TextView, out: Boolean): ObjectAnimator {
-        val color = getCurrentTextColor()
-        val transparentColor = ColorUtils.setAlphaComponent(color, 0)
-
-        val fromColor = if (out) color else transparentColor
-        val toColor = if (out) transparentColor else color
-
-        return ObjectAnimator.ofInt(view, "textColor", fromColor, toColor)
-            .apply {
-                setEvaluator(ArgbEvaluator())
-            }
-    }
-
-    @Suppress("SpreadOperator")
-    private fun getTranslationYAnim(view: View, positions: FloatArray): ObjectAnimator =
-        ObjectAnimator.ofFloat(view, "translationY", *positions)
-
-    private fun getCubicBezierInterpolator(): PathInterpolator =
-        PathInterpolator(0.77F, 0F, 0.175F, 1F)
-
-    @ColorInt
-    private fun getCurrentTextColor(): Int =
-        if (isLoading) {
-            buttonLoading.currentTextColor
-        } else {
-            buttonNormal.currentTextColor
-        }
-
-    private fun FloatArray.reverseIfLoading(): FloatArray =
-        if (isLoading) reversedArray() else this
-
-    private companion object {
-        private const val ANIMATION_DURATION = 300L
-        private const val NO_ID = -1
-    }
-}
diff --git a/library/src/main/java/com/telefonica/mistica/button/README.md b/library/src/main/java/com/telefonica/mistica/button/README.md
index 049592090..658815d88 100644
--- a/library/src/main/java/com/telefonica/mistica/button/README.md
+++ b/library/src/main/java/com/telefonica/mistica/button/README.md
@@ -1,19 +1,32 @@
-# Buttons
+# com.telefonica.mistica.Button
+Button which is composed of the following elements
+- Text
+- Loading Text
+- Icon
+- Progress bar
 
-Following classes should be used to place buttons in the app:
-* `com.telefonica.mistica.Button` --> Simple button with primary style applied by default
-* `com.telefonica.mistica.ProgressButton` --> In case of the need of a loading state (a button with progress), this one can be used to show an spinner (with an optional loading text) with an animation. `app:isLoading` attribute can be used in order to set it as loading on xml layouts, also with databinding.
-
-Buttons are based on material components, so all material functionalities are applicable on them.
-
-In order to change appearance of them, just set the required style (styles for all kind of buttons are available on [styles_buttons.xml](../../../../../../../../library/src/main/res/values/styles_buttons.xml)).
-
-<p align="center">
-    <img src="../../../../../../../../doc/images/buttons/buttons_tuenti.gif">
-    <img src="../../../../../../../../doc/images/buttons/buttons_movistar.gif">
-</p>
-<p align="center">
-    <img src="../../../../../../../../doc/images/buttons/buttons_o2.gif">
-    <img src="../../../../../../../../doc/images/buttons/buttons_vivo.gif">
-</p>
+## Xml Attributes
+- `text` [String] : Text to show in normal state
+- `loadingText` [String] - Text to show in loading state
+- `isLoading` [Boolean] - Flag to show/hide loading state
+- `style` [Enum] - Value to set the button style PRIMARY
+    - PRIMARY
+    - PRIMARY_SMALL
+    - SECONDARY
+    - SECONDARY_SMALL
+    - DANGER
+    - DANGER_SMALL
+    - LINK
+    - PRIMARY_INVERSE
+    - PRIMARY_SMALL_INVERSE
+    - SECONDARY_INVERSE
+    - SECONDARY_SMALL_INVERSE
+    - LINK_INVERSE
+- `enabled` [Boolean] - Flag to enabled/disabled view
+- `icon` [Int] - Icon drawable resource
 
+## Functions
+We can modify all element attributes by code
+In addition we have next functions
+- setOnClickListener
+- setEnabled
diff --git a/library/src/main/java/com/telefonica/mistica/card/CardView.kt b/library/src/main/java/com/telefonica/mistica/card/CardView.kt
index 4a363a38a..b1ed22643 100644
--- a/library/src/main/java/com/telefonica/mistica/card/CardView.kt
+++ b/library/src/main/java/com/telefonica/mistica/card/CardView.kt
@@ -17,6 +17,7 @@ import com.telefonica.mistica.R
 import com.telefonica.mistica.tag.TagStyle
 import com.telefonica.mistica.tag.TagView
 import com.telefonica.mistica.util.getDimension
+import com.telefonica.mistica.util.setTextAndVisibility
 
 @BindingMethods(
     BindingMethod(
diff --git a/library/src/main/java/com/telefonica/mistica/compose/button/Button.kt b/library/src/main/java/com/telefonica/mistica/compose/button/Button.kt
index bed5782f6..8018c4b45 100644
--- a/library/src/main/java/com/telefonica/mistica/compose/button/Button.kt
+++ b/library/src/main/java/com/telefonica/mistica/compose/button/Button.kt
@@ -18,7 +18,6 @@ import androidx.compose.foundation.layout.width
 import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.material.ButtonDefaults
 import androidx.compose.material.CircularProgressIndicator
-import androidx.compose.material.MaterialTheme
 import androidx.compose.material.Text
 import androidx.compose.material.ripple.LocalRippleTheme
 import androidx.compose.runtime.Composable
@@ -32,6 +31,7 @@ import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.ColorFilter
 import androidx.compose.ui.layout.onGloballyPositioned
 import androidx.compose.ui.platform.LocalDensity
+import androidx.compose.ui.platform.testTag
 import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.text.style.TextOverflow
 import androidx.compose.ui.tooling.preview.Preview
@@ -68,6 +68,7 @@ fun Button(
     CompositionLocalProvider(LocalRippleTheme provides style.rippleTheme) {
         androidx.compose.material.Button(
             modifier = modifier
+                .testTag(ButtonTestTag.BUTTON)
                 .defaultMinSize(size.minWidth, size.height)
                 .onGloballyPositioned {
                     if (originalWidth == null) {
@@ -94,6 +95,7 @@ fun Button(
                     Row {
                         CircularProgressIndicator(
                             modifier = Modifier
+                                .testTag(ButtonTestTag.BUTTON_PROGRESS)
                                 .size(size.progressBarSize)
                                 .align(Alignment.CenterVertically),
                             color = textColor,
@@ -102,7 +104,9 @@ fun Button(
                         loadingText.takeIf { it.isNotEmpty() }?.let {
                             Spacer(modifier = Modifier.width(iconSpacing))
                             Text(
-                                modifier = Modifier.align(Alignment.CenterVertically),
+                                modifier = Modifier
+                                    .testTag(ButtonTestTag.BUTTON_TEXT_LOADING)
+                                    .align(Alignment.CenterVertically),
                                 text = it,
                                 color = textColor,
                                 style = size.textStyle,
@@ -124,6 +128,7 @@ fun Button(
                                 painterResource(id = it),
                                 null,
                                 modifier = Modifier
+                                    .testTag(ButtonTestTag.BUTTON_ICON)
                                     .size(size.iconSize)
                                     .align(Alignment.CenterVertically),
                                 colorFilter = ColorFilter.tint(style.textColor)
@@ -131,7 +136,9 @@ fun Button(
                             Spacer(modifier = Modifier.width(iconSpacing))
                         }
                         Text(
-                            modifier = Modifier.align(Alignment.CenterVertically),
+                            modifier = Modifier
+                                .testTag(ButtonTestTag.BUTTON_TEXT)
+                                .align(Alignment.CenterVertically),
                             text = text,
                             color = textColor,
                             style = size.textStyle,
@@ -163,6 +170,14 @@ enum class ButtonStyle {
     LINK_INVERSE
 }
 
+object ButtonTestTag {
+    const val BUTTON = "button"
+    const val BUTTON_TEXT = "button_text"
+    const val BUTTON_TEXT_LOADING = "button_text_loading"
+    const val BUTTON_ICON = "button_icon"
+    const val BUTTON_PROGRESS = "button_progress"
+}
+
 @Preview
 @Composable
 fun ButtonPreview(@PreviewParameter(PreviewBooleanProvider::class) enabled: Boolean) {
@@ -195,4 +210,4 @@ fun ProgressButtonIconSmallPreview() {
 
 class PreviewBooleanProvider : PreviewParameterProvider<Boolean> {
     override val values = sequenceOf(false, true)
-}
\ No newline at end of file
+}
diff --git a/library/src/main/java/com/telefonica/mistica/emptystate/card/EmptyStateCardView.kt b/library/src/main/java/com/telefonica/mistica/emptystate/card/EmptyStateCardView.kt
index e8d32689a..01525d1a2 100644
--- a/library/src/main/java/com/telefonica/mistica/emptystate/card/EmptyStateCardView.kt
+++ b/library/src/main/java/com/telefonica/mistica/emptystate/card/EmptyStateCardView.kt
@@ -7,7 +7,6 @@ import android.util.TypedValue
 import android.view.LayoutInflater
 import android.view.View
 import android.view.ViewGroup
-import android.widget.Button
 import android.widget.ImageView
 import android.widget.LinearLayout
 import android.widget.TextView
@@ -17,7 +16,7 @@ import androidx.appcompat.content.res.AppCompatResources
 import androidx.databinding.BindingMethod
 import androidx.databinding.BindingMethods
 import com.telefonica.mistica.R
-import com.telefonica.mistica.button.ProgressButton
+import com.telefonica.mistica.button.Button
 import com.telefonica.mistica.util.convertDpToPx
 
 @BindingMethods(
@@ -111,7 +110,7 @@ class EmptyStateCardView @JvmOverloads constructor(
     private var title: TextView
     private var subtitle: TextView
     private var buttonsContainer: LinearLayout
-    private var primaryButton: ProgressButton
+    private var primaryButton: Button
     private var secondaryButton: Button
     private var linkButton: Button
 
@@ -236,11 +235,11 @@ class EmptyStateCardView @JvmOverloads constructor(
     }
 
     fun setPrimaryButtonText(text: String) {
-        primaryButton.setText(text)
+        primaryButton.text = text
     }
 
     fun setPrimaryButtonLoadingText(text: String) {
-        primaryButton.setLoadingText(text)
+        primaryButton.loadingText = text
     }
 
     fun setPrimaryButtonOnClick(clickListener: OnClickListener) {
@@ -283,7 +282,7 @@ class EmptyStateCardView @JvmOverloads constructor(
     }
 
     fun setIsLoading(isLoading: Boolean) {
-        primaryButton.setIsLoading(isLoading)
+        primaryButton.isLoading = isLoading
     }
 
     companion object {
diff --git a/library/src/main/java/com/telefonica/mistica/emptystate/screen/EmptyStateScreenView.kt b/library/src/main/java/com/telefonica/mistica/emptystate/screen/EmptyStateScreenView.kt
index 0de5b8a67..75ca5f3d2 100644
--- a/library/src/main/java/com/telefonica/mistica/emptystate/screen/EmptyStateScreenView.kt
+++ b/library/src/main/java/com/telefonica/mistica/emptystate/screen/EmptyStateScreenView.kt
@@ -7,7 +7,6 @@ import android.util.TypedValue
 import android.view.LayoutInflater
 import android.view.View
 import android.view.ViewGroup
-import android.widget.Button
 import android.widget.ImageView
 import android.widget.LinearLayout
 import android.widget.ScrollView
@@ -18,7 +17,7 @@ import androidx.appcompat.content.res.AppCompatResources
 import androidx.databinding.BindingMethod
 import androidx.databinding.BindingMethods
 import com.telefonica.mistica.R
-import com.telefonica.mistica.button.ProgressButton
+import com.telefonica.mistica.button.Button
 import com.telefonica.mistica.util.convertDpToPx
 
 @BindingMethods(
@@ -111,7 +110,7 @@ class EmptyStateScreenView @JvmOverloads constructor(
     private var title: TextView
     private var subtitle: TextView
     private var buttonsContainer: LinearLayout
-    private var primaryButton: ProgressButton
+    private var primaryButton: Button
     private var secondaryButton: Button
     private var linkButton: Button
 
@@ -215,11 +214,11 @@ class EmptyStateScreenView @JvmOverloads constructor(
     }
 
     fun setPrimaryButtonText(text: String) {
-        primaryButton.setText(text)
+        primaryButton.text = text
     }
 
     fun setPrimaryButtonLoadingText(text: String) {
-        primaryButton.setLoadingText(text)
+        primaryButton.loadingText = text
     }
 
     fun setPrimaryButtonOnClick(clickListener: OnClickListener) {
@@ -264,7 +263,7 @@ class EmptyStateScreenView @JvmOverloads constructor(
     }
 
     fun setIsLoading(isLoading: Boolean) {
-        primaryButton.setIsLoading(isLoading)
+        primaryButton.isLoading = isLoading
     }
 
     companion object {
diff --git a/library/src/main/java/com/telefonica/mistica/feedback/error/LoadErrorFeedbackView.kt b/library/src/main/java/com/telefonica/mistica/feedback/error/LoadErrorFeedbackView.kt
index c80c721ff..558de97cb 100644
--- a/library/src/main/java/com/telefonica/mistica/feedback/error/LoadErrorFeedbackView.kt
+++ b/library/src/main/java/com/telefonica/mistica/feedback/error/LoadErrorFeedbackView.kt
@@ -12,7 +12,7 @@ import androidx.annotation.StringRes
 import androidx.databinding.BindingMethod
 import androidx.databinding.BindingMethods
 import com.telefonica.mistica.R
-import com.telefonica.mistica.button.ProgressButton
+import com.telefonica.mistica.button.Button
 import com.telefonica.mistica.util.convertDpToPx
 
 @BindingMethods(
@@ -55,7 +55,7 @@ class LoadErrorFeedbackView @JvmOverloads constructor(
 
     private val titleTextView: TextView
     private val descriptionTextView: TextView
-    private val button: ProgressButton
+    private val button: Button
 
     init {
         LayoutInflater.from(context).inflate(R.layout.load_error_feedback, this, true)
@@ -110,7 +110,7 @@ class LoadErrorFeedbackView @JvmOverloads constructor(
     }
 
     fun setIsLoading(loading: Boolean) {
-        button.setIsLoading(loading)
+        button.isLoading = loading
     }
 
     fun setButtonOnClick(listener: OnClickListener?) {
@@ -118,7 +118,7 @@ class LoadErrorFeedbackView @JvmOverloads constructor(
     }
 
     fun setButtonText(text: CharSequence) {
-        button.setText(text)
+        button.text = text.toString()
     }
 
     fun setButtonText(@StringRes textId: Int) = setButtonText(context.getString(textId))
@@ -130,4 +130,4 @@ class LoadErrorFeedbackView @JvmOverloads constructor(
     fun setButtonClickListener(listener: ((View) -> Unit)?) {
         setButtonOnClick(OnClickListener { listener?.invoke(it) })
     }
-}
\ No newline at end of file
+}
diff --git a/library/src/main/java/com/telefonica/mistica/feedback/screen/view/FeedbackScreenView.kt b/library/src/main/java/com/telefonica/mistica/feedback/screen/view/FeedbackScreenView.kt
index e6c6ae446..a167c724b 100644
--- a/library/src/main/java/com/telefonica/mistica/feedback/screen/view/FeedbackScreenView.kt
+++ b/library/src/main/java/com/telefonica/mistica/feedback/screen/view/FeedbackScreenView.kt
@@ -12,7 +12,6 @@ import android.view.LayoutInflater
 import android.view.View
 import android.view.ViewTreeObserver
 import android.view.animation.PathInterpolator
-import android.widget.Button
 import android.widget.FrameLayout
 import android.widget.LinearLayout
 import android.widget.TextView
@@ -29,7 +28,7 @@ import com.airbnb.lottie.LottieAnimationView
 import com.airbnb.lottie.LottieProperty
 import com.airbnb.lottie.model.KeyPath
 import com.telefonica.mistica.R
-import com.telefonica.mistica.button.ProgressButton
+import com.telefonica.mistica.button.Button
 import com.telefonica.mistica.feedback.screen.haptics.HapticFeedbackType
 import com.telefonica.mistica.feedback.screen.haptics.performHapticFeedback
 import com.telefonica.mistica.util.background.GradientBackgroundFactory
@@ -53,7 +52,7 @@ class FeedbackScreenView : ConstraintLayout {
     private lateinit var errorReference: TextView
     private lateinit var customContentContainer: FrameLayout
     private lateinit var buttonsContainer: LinearLayout
-    private lateinit var firstButton: ProgressButton
+    private lateinit var firstButton: Button
     private lateinit var secondButton: Button
 
     private var type: Int = TYPE_INFO
@@ -74,8 +73,10 @@ class FeedbackScreenView : ConstraintLayout {
     private var firstButtonClickListener: OnClickListener? = null
     private var secondButtonClickListener: OnClickListener? = null
 
-    @RawRes private var customAnimation: Int? = null
-    @DrawableRes private var customIcon: Int? = null
+    @RawRes
+    private var customAnimation: Int? = null
+    @DrawableRes
+    private var customIcon: Int? = null
 
     constructor(context: Context) : super(context) {
         init(context)
@@ -132,18 +133,18 @@ class FeedbackScreenView : ConstraintLayout {
 
     fun setFeedbackFirstButtonText(text: CharSequence) {
         firstButtonText = text
-        firstButton.setText(text)
+        firstButton.text = text.toString()
         firstButton.visibility = if (text.isBlank()) View.GONE else View.VISIBLE
     }
 
     fun setFeedbackFirstButtonLoadingText(text: CharSequence) {
         firstButtonLoadingText = text
-        firstButton.setLoadingText(text)
+        firstButton.loadingText = text.toString()
     }
 
     fun setFeedbackSecondButtonText(text: CharSequence) {
         secondButtonText = text
-        secondButton.text = text
+        secondButton.text = text.toString()
         secondButton.visibility = if (text.isBlank()) View.GONE else View.VISIBLE
     }
 
@@ -171,7 +172,7 @@ class FeedbackScreenView : ConstraintLayout {
     fun setIsLoading(isLoading: Boolean) {
         val wasLoading = this.isLoading
         this.isLoading = isLoading
-        firstButton.setIsLoading(isLoading)
+        firstButton.isLoading = isLoading
         if (wasLoading && !isLoading) {
             icon.playAnimation()
             executeHapticFeedback()
@@ -372,7 +373,7 @@ class FeedbackScreenView : ConstraintLayout {
         setFeedbackFirstButtonText(firstButtonText)
         setFeedbackFirstButtonLoadingText(firstButtonLoadingText)
         firstButtonClickListener?.let { setFirstButtonOnClick(it) }
-        firstButton.setIsLoading(isLoading)
+        firstButton.isLoading = isLoading
 
         secondButton =
             findViewById(if (secondButtonAsLink) R.id.link_button else R.id.second_button)
diff --git a/library/src/main/java/com/telefonica/mistica/header/HeaderView.kt b/library/src/main/java/com/telefonica/mistica/header/HeaderView.kt
index ce5244450..0af7c5183 100644
--- a/library/src/main/java/com/telefonica/mistica/header/HeaderView.kt
+++ b/library/src/main/java/com/telefonica/mistica/header/HeaderView.kt
@@ -7,7 +7,6 @@ import android.view.Gravity
 import android.view.LayoutInflater
 import android.view.View
 import android.view.ViewGroup
-import android.widget.Button
 import android.widget.FrameLayout
 import android.widget.LinearLayout
 import android.widget.TextView
@@ -17,6 +16,7 @@ import androidx.annotation.StringRes
 import androidx.databinding.BindingMethod
 import androidx.databinding.BindingMethods
 import com.telefonica.mistica.R
+import com.telefonica.mistica.button.Button
 import com.telefonica.mistica.util.children
 import com.telefonica.mistica.util.convertDpToPx
 import com.telefonica.mistica.util.getThemeColor
diff --git a/library/src/main/java/com/telefonica/mistica/highlightedcard/HighlightedCardView.kt b/library/src/main/java/com/telefonica/mistica/highlightedcard/HighlightedCardView.kt
index 2089f58ee..600e55535 100644
--- a/library/src/main/java/com/telefonica/mistica/highlightedcard/HighlightedCardView.kt
+++ b/library/src/main/java/com/telefonica/mistica/highlightedcard/HighlightedCardView.kt
@@ -8,7 +8,6 @@ import android.util.AttributeSet
 import android.util.TypedValue
 import android.view.LayoutInflater
 import android.view.View
-import android.widget.Button
 import android.widget.ImageView
 import android.widget.TextView
 import androidx.annotation.ColorInt
@@ -20,6 +19,7 @@ import androidx.constraintlayout.widget.ConstraintLayout
 import androidx.databinding.BindingMethod
 import androidx.databinding.BindingMethods
 import com.telefonica.mistica.R
+import com.telefonica.mistica.button.Button
 import com.telefonica.mistica.util.getDimension
 import com.telefonica.mistica.util.getThemeColor
 import com.telefonica.mistica.util.hide
@@ -344,7 +344,7 @@ class HighlightedCardView @JvmOverloads constructor(
         }
 
         button?.setOnClickListener(buttonClickListener)
-        button?.text = buttonText
+        button?.text = buttonText ?: ""
         if (this.button != button) {
             button?.visibility = View.VISIBLE
             this.button?.visibility = View.GONE
diff --git a/library/src/main/java/com/telefonica/mistica/util/ViewUtils.kt b/library/src/main/java/com/telefonica/mistica/util/ViewUtils.kt
index 929be7805..5a42e98b1 100644
--- a/library/src/main/java/com/telefonica/mistica/util/ViewUtils.kt
+++ b/library/src/main/java/com/telefonica/mistica/util/ViewUtils.kt
@@ -6,6 +6,7 @@ import android.view.View
 import android.view.View.GONE
 import android.view.View.VISIBLE
 import android.view.ViewGroup
+import com.telefonica.mistica.button.Button
 
 fun ViewGroup.children(): Iterable<View> = (0 until childCount)
     .map { index -> getChildAt(index) }
@@ -44,5 +45,14 @@ fun View.setAlpha(enabled: Boolean) {
     }
 }
 
+fun Button.setTextAndVisibility(newText: CharSequence?) {
+    if (newText?.isNotBlank() == true) {
+        text = newText.toString()
+        visibility = VISIBLE
+    } else {
+        visibility = GONE
+    }
+}
+
 private const val ENABLED_ALPHA = 1F
-private const val DISABLED_ALPHA = 0.5F
\ No newline at end of file
+private const val DISABLED_ALPHA = 0.5F
diff --git a/library/src/main/res/layout/callout_view.xml b/library/src/main/res/layout/callout_view.xml
index eb572ffc0..7873df143 100644
--- a/library/src/main/res/layout/callout_view.xml
+++ b/library/src/main/res/layout/callout_view.xml
@@ -80,7 +80,7 @@
 				android:layout_width="wrap_content"
 				android:layout_height="wrap_content"
 				android:layout_marginEnd="16dp"
-				style="@style/AppTheme.Button.DefaultButton.Small"
+				app:style="PRIMARY_SMALL"
 				tools:text="Primary"
 				/>
 
@@ -89,7 +89,7 @@
 				android:layout_width="wrap_content"
 				android:layout_height="wrap_content"
 				android:layout_marginEnd="16dp"
-				style="@style/AppTheme.Button.SecondaryButton.Small"
+				app:style="SECONDARY_SMALL"
 				tools:text="Secondary"
 				/>
 
@@ -97,7 +97,7 @@
 				android:id="@+id/callout_link_button"
 				android:layout_width="wrap_content"
 				android:layout_height="wrap_content"
-				style="@style/AppTheme.Button.LinkButton"
+				app:style="LINK"
 				tools:text="Link"
 				tools:visibility="gone"
 				/>
@@ -113,4 +113,4 @@
 			app:barrierDirection="end"
 			/>
 
-</androidx.constraintlayout.widget.ConstraintLayout>
\ No newline at end of file
+</androidx.constraintlayout.widget.ConstraintLayout>
diff --git a/library/src/main/res/layout/card_actions_view.xml b/library/src/main/res/layout/card_actions_view.xml
index 168f3af9e..51e9d376f 100644
--- a/library/src/main/res/layout/card_actions_view.xml
+++ b/library/src/main/res/layout/card_actions_view.xml
@@ -1,29 +1,33 @@
 <?xml version="1.0" encoding="utf-8"?>
 <merge xmlns:android="http://schemas.android.com/apk/res/android"
-    xmlns:tools="http://schemas.android.com/tools"
-    android:layout_width="match_parent"
-    android:layout_height="wrap_content"
-    android:orientation="horizontal"
-    tools:parentTag="android.widget.LinearLayout">
+        xmlns:tools="http://schemas.android.com/tools"
+        xmlns:app="http://schemas.android.com/apk/res-auto"
+        android:layout_width="match_parent"
+        android:layout_height="wrap_content"
+        android:orientation="horizontal"
+        tools:parentTag="android.widget.LinearLayout"
+        >
 
     <com.telefonica.mistica.button.Button
-        android:id="@+id/card_primary_button"
-        style="@style/AppTheme.Button.DefaultButton.Small"
-        android:layout_width="wrap_content"
-        android:layout_height="wrap_content"
-        android:layout_marginEnd="24dp"
-        android:visibility="gone"
-        tools:text="Primary button"
-        tools:visibility="visible" />
+            android:id="@+id/card_primary_button"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:layout_marginEnd="24dp"
+            android:visibility="gone"
+            tools:text="Primary button"
+            tools:visibility="visible"
+            app:style="PRIMARY_SMALL"
+            />
 
     <com.telefonica.mistica.button.Button
-        android:id="@+id/card_link_button"
-        style="@style/AppTheme.Button.LinkButton"
-        android:layout_width="wrap_content"
-        android:layout_height="wrap_content"
-        android:layout_marginStart="-8dp"
-        android:visibility="gone"
-        tools:text="Link button"
-        tools:visibility="visible" />
+            android:id="@+id/card_link_button"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:layout_marginStart="-8dp"
+            android:visibility="gone"
+            tools:text="Link button"
+            tools:visibility="visible"
+            app:style="LINK"
+            />
 
-</merge>
\ No newline at end of file
+</merge>
diff --git a/library/src/main/res/layout/empty_state_card_view.xml b/library/src/main/res/layout/empty_state_card_view.xml
index c538925ea..2c88cb43c 100644
--- a/library/src/main/res/layout/empty_state_card_view.xml
+++ b/library/src/main/res/layout/empty_state_card_view.xml
@@ -1,6 +1,7 @@
 <?xml version="1.0" encoding="utf-8"?>
 <merge xmlns:android="http://schemas.android.com/apk/res/android"
 		xmlns:tools="http://schemas.android.com/tools"
+		xmlns:app="http://schemas.android.com/apk/res-auto"
 		tools:background="@drawable/empty_state_card_view_background"
 		tools:orientation="vertical"
 		tools:paddingTop="24dp"
@@ -55,12 +56,12 @@
 			android:layout_marginStart="0dp"
 			>
 
-		<com.telefonica.mistica.button.ProgressButton
+		<com.telefonica.mistica.button.Button
 				android:id="@+id/empty_state_screen_primary_button"
 				android:layout_width="wrap_content"
 				android:layout_height="wrap_content"
 				android:layout_marginStart="16dp"
-				style="@style/AppTheme.Button.DefaultButton.Small"
+				app:style="PRIMARY_SMALL"
 				tools:text="Explore Marketplace"
 				/>
 
@@ -69,7 +70,7 @@
 				android:layout_width="wrap_content"
 				android:layout_height="wrap_content"
 				android:layout_marginStart="16dp"
-				style="@style/AppTheme.Button.SecondaryButton.Small"
+				app:style="SECONDARY_SMALL"
 				tools:text="Secondary Action"
 				/>
 
@@ -78,7 +79,7 @@
 				android:layout_width="wrap_content"
 				android:layout_height="wrap_content"
 				android:layout_marginStart="24dp"
-				style="@style/AppTheme.Button.LinkButton"
+				app:style="LINK"
 				tools:text="More info"
 				/>
 
diff --git a/library/src/main/res/layout/empty_state_screen_view.xml b/library/src/main/res/layout/empty_state_screen_view.xml
index 2e01a6696..f7ed964be 100644
--- a/library/src/main/res/layout/empty_state_screen_view.xml
+++ b/library/src/main/res/layout/empty_state_screen_view.xml
@@ -1,6 +1,7 @@
 <?xml version="1.0" encoding="utf-8"?>
 <merge xmlns:android="http://schemas.android.com/apk/res/android"
 		xmlns:tools="http://schemas.android.com/tools"
+		xmlns:app="http://schemas.android.com/apk/res-auto"
 		tools:parentTag="ScrollView"
 		>
 
@@ -58,7 +59,7 @@
 				android:layout_marginStart="0dp"
 				>
 
-			<com.telefonica.mistica.button.ProgressButton
+			<com.telefonica.mistica.button.Button
 					android:id="@+id/empty_state_screen_primary_button"
 					android:layout_width="wrap_content"
 					android:layout_height="wrap_content"
@@ -71,7 +72,7 @@
 					android:layout_width="wrap_content"
 					android:layout_height="wrap_content"
 					android:layout_marginStart="24dp"
-					style="@style/AppTheme.Button.SecondaryButton"
+					app:style="SECONDARY"
 					tools:text="Secondary Action"
 					/>
 
@@ -81,7 +82,7 @@
 					android:layout_height="wrap_content"
 					android:layout_marginStart="16dp"
 					android:layout_gravity="center_vertical"
-					style="@style/AppTheme.Button.LinkButton"
+					app:style="LINK"
 					tools:text="More info"
 					/>
 
diff --git a/library/src/main/res/layout/header_view.xml b/library/src/main/res/layout/header_view.xml
index c3edd9df2..9314fbf84 100644
--- a/library/src/main/res/layout/header_view.xml
+++ b/library/src/main/res/layout/header_view.xml
@@ -1,15 +1,17 @@
 <?xml version="1.0" encoding="utf-8"?>
 <merge xmlns:android="http://schemas.android.com/apk/res/android"
-    xmlns:tools="http://schemas.android.com/tools"
-    android:layout_width="match_parent"
-    android:layout_height="wrap_content"
-    android:gravity="start"
-    android:orientation="vertical"
-    android:paddingStart="16dp"
-    android:paddingTop="32dp"
-    android:paddingEnd="32dp"
-    android:paddingBottom="24dp"
-    tools:parentTag="android.widget.LinearLayout">
+        xmlns:tools="http://schemas.android.com/tools"
+        xmlns:app="http://schemas.android.com/apk/res-auto"
+        android:layout_width="match_parent"
+        android:layout_height="wrap_content"
+        android:gravity="start"
+        android:orientation="vertical"
+        android:paddingStart="16dp"
+        android:paddingTop="32dp"
+        android:paddingEnd="32dp"
+        android:paddingBottom="24dp"
+        tools:parentTag="android.widget.LinearLayout"
+        >
 
     <TextView
         android:id="@+id/header_first_pretitle"
@@ -65,39 +67,39 @@
 
         <com.telefonica.mistica.button.Button
             android:id="@+id/header_action_button"
-            style="@style/AppTheme.Button.DefaultButton"
             android:layout_width="match_parent"
             android:layout_height="wrap_content"
             android:layout_marginBottom="16dp"
             android:visibility="gone"
             tools:text="Button"
-            tools:visibility="visible" />
+            tools:visibility="visible"
+            app:style="PRIMARY"/>
 
         <com.telefonica.mistica.button.Button
             android:id="@+id/header_secondary_action_button"
-            style="@style/AppTheme.Button.SecondaryButton"
             android:layout_width="match_parent"
             android:layout_height="wrap_content"
             android:layout_marginBottom="16dp"
             android:visibility="gone"
             tools:text="Secondary Button"
-            tools:visibility="visible" />
+            tools:visibility="visible"
+            app:style="SECONDARY"/>
 
         <com.telefonica.mistica.button.Button
             android:id="@+id/header_action_button_inverse"
-            style="@style/AppTheme.Button.PrimaryButtonInverse"
             android:layout_width="match_parent"
             android:layout_height="wrap_content"
             android:layout_marginBottom="16dp"
-            android:visibility="gone" />
+            android:visibility="gone"
+            app:style="PRIMARY_INVERSE"/>
 
         <com.telefonica.mistica.button.Button
             android:id="@+id/header_secondary_action_button_inverse"
-            style="@style/AppTheme.Button.SecondaryButtonInverse"
             android:layout_width="match_parent"
             android:layout_height="wrap_content"
             android:layout_marginBottom="16dp"
-            android:visibility="gone" />
+            android:visibility="gone"
+            app:style="SECONDARY_INVERSE"/>
     </LinearLayout>
 
     <FrameLayout
@@ -116,4 +118,4 @@
         android:visibility="gone"
         tools:text="Subtitle"
         tools:visibility="visible" />
-</merge>
\ No newline at end of file
+</merge>
diff --git a/library/src/main/res/layout/highlighted_card_view.xml b/library/src/main/res/layout/highlighted_card_view.xml
index 97fde235e..7be3bb80d 100644
--- a/library/src/main/res/layout/highlighted_card_view.xml
+++ b/library/src/main/res/layout/highlighted_card_view.xml
@@ -50,7 +50,6 @@
     <!--    Primary-->
     <com.telefonica.mistica.button.Button
         android:id="@+id/highlighted_card_button_primary"
-        style="@style/AppTheme.Button.DefaultButton.Small"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_marginTop="8dp"
@@ -60,11 +59,11 @@
         app:layout_constraintStart_toStartOf="@+id/guideline"
         app:layout_constraintTop_toBottomOf="@+id/highlighted_card_content"
         tools:text="Update"
-        tools:visibility="visible" />
+        tools:visibility="visible"
+        app:style="PRIMARY_SMALL"/>
 
     <com.telefonica.mistica.button.Button
         android:id="@+id/highlighted_card_button_primary_inverse"
-        style="@style/AppTheme.Button.PrimaryButtonInverse.Small"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_marginTop="8dp"
@@ -73,12 +72,12 @@
         app:layout_constraintBottom_toBottomOf="parent"
         app:layout_constraintStart_toStartOf="@+id/guideline"
         app:layout_constraintTop_toBottomOf="@+id/highlighted_card_content"
-        tools:text="Update" />
+        tools:text="Update"
+        app:style="PRIMARY_SMALL_INVERSE"/>
 
     <!--    Secondary-->
     <com.telefonica.mistica.button.Button
         android:id="@+id/highlighted_card_button_secondary"
-        style="@style/AppTheme.Button.SecondaryButton.Small"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_marginTop="8dp"
@@ -87,11 +86,11 @@
         app:layout_constraintBottom_toBottomOf="parent"
         app:layout_constraintStart_toStartOf="@+id/guideline"
         app:layout_constraintTop_toBottomOf="@+id/highlighted_card_content"
-        tools:text="Update" />
+        tools:text="Update"
+        app:style="SECONDARY_SMALL"/>
 
     <com.telefonica.mistica.button.Button
         android:id="@+id/highlighted_card_button_secondary_inverse"
-        style="@style/AppTheme.Button.SecondaryButtonInverse.Small"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_marginTop="8dp"
@@ -100,12 +99,12 @@
         app:layout_constraintBottom_toBottomOf="parent"
         app:layout_constraintStart_toStartOf="@+id/guideline"
         app:layout_constraintTop_toBottomOf="@+id/highlighted_card_content"
-        tools:text="Update" />
+        tools:text="Update"
+        app:style="SECONDARY_SMALL_INVERSE"/>
 
     <!--    Link-->
     <com.telefonica.mistica.button.Button
         android:id="@+id/highlighted_card_button_link"
-        style="@style/AppTheme.Button.LinkButton"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_marginTop="8dp"
@@ -116,11 +115,11 @@
         app:layout_constraintTop_toBottomOf="@+id/highlighted_card_content"
         app:layout_goneMarginBottom="24dp"
         app:layout_goneMarginTop="0dp"
-        tools:text="Update" />
+        tools:text="Update"
+        app:style="LINK"/>
 
     <com.telefonica.mistica.button.Button
         android:id="@+id/highlighted_card_button_link_inverse"
-        style="@style/AppTheme.Button.LinkButtonInverse"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_marginTop="8dp"
@@ -130,7 +129,8 @@
         app:layout_constraintStart_toStartOf="@+id/guideline"
         app:layout_constraintTop_toBottomOf="@+id/highlighted_card_content"
         tools:text="Update"
-        tools:visibility="gone" />
+        tools:visibility="gone"
+        app:style="LINK_INVERSE"/>
 
     <ImageView
         android:id="@+id/highlighted_card_image"
@@ -182,4 +182,4 @@
         app:barrierDirection="top"
         app:constraint_referenced_ids="highlighted_card_button_link_inverse, highlighted_card_button_link, highlighted_card_button_secondary_inverse, highlighted_card_button_secondary, highlighted_card_button_primary_inverse, highlighted_card_button_primary" />
 
-</androidx.constraintlayout.widget.ConstraintLayout>
\ No newline at end of file
+</androidx.constraintlayout.widget.ConstraintLayout>
diff --git a/library/src/main/res/layout/load_error_feedback.xml b/library/src/main/res/layout/load_error_feedback.xml
index 77c5e420b..63c321bd5 100644
--- a/library/src/main/res/layout/load_error_feedback.xml
+++ b/library/src/main/res/layout/load_error_feedback.xml
@@ -1,5 +1,7 @@
 <?xml version="1.0" encoding="utf-8"?>
-<merge xmlns:android="http://schemas.android.com/apk/res/android">
+<merge xmlns:android="http://schemas.android.com/apk/res/android"
+        xmlns:app="http://schemas.android.com/apk/res-auto"
+        >
 
     <TextView
         android:id="@+id/load_error_feedback_title"
@@ -20,11 +22,11 @@
         android:textAppearance="@style/AppTheme.TextAppearance.Preset2"
         android:textColor="?colorTextSecondary" />
 
-    <com.telefonica.mistica.button.ProgressButton
+    <com.telefonica.mistica.button.Button
         android:id="@+id/load_error_feedback_button"
         style="@style/AppTheme.Button.SecondaryButton"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_marginTop="24dp"
-        android:text="@string/generic_retry" />
-</merge>
\ No newline at end of file
+        app:text="@string/generic_retry" />
+</merge>
diff --git a/library/src/main/res/layout/screen_feedback_buttons.xml b/library/src/main/res/layout/screen_feedback_buttons.xml
index 2822dea39..f0dfc8374 100644
--- a/library/src/main/res/layout/screen_feedback_buttons.xml
+++ b/library/src/main/res/layout/screen_feedback_buttons.xml
@@ -1,26 +1,29 @@
 <?xml version="1.0" encoding="utf-8"?>
-<merge xmlns:android="http://schemas.android.com/apk/res/android">
-
-    <com.telefonica.mistica.button.ProgressButton
-        android:id="@+id/first_button"
-        style="@style/AppTheme.Button.DefaultButton"
-        android:layout_width="match_parent"
-        android:layout_height="wrap_content" />
+<merge xmlns:android="http://schemas.android.com/apk/res/android"
+        xmlns:app="http://schemas.android.com/apk/res-auto">
 
     <com.telefonica.mistica.button.Button
-        android:id="@+id/second_button"
-        style="@style/AppTheme.Button.SecondaryButton"
-        android:layout_width="match_parent"
-        android:layout_height="wrap_content"
-        android:layout_marginTop="16dp"
-        android:visibility="gone" />
+            android:id="@+id/first_button"
+            android:layout_width="match_parent"
+            android:layout_height="wrap_content"
+            app:style="PRIMARY"
+            />
 
     <com.telefonica.mistica.button.Button
-        android:id="@+id/link_button"
-        style="@style/AppTheme.Button.LinkButton"
-        android:layout_width="wrap_content"
-        android:layout_height="wrap_content"
-        android:layout_marginTop="16dp"
-        android:visibility="gone" />
+            android:id="@+id/second_button"
+            android:layout_width="match_parent"
+            android:layout_height="wrap_content"
+            android:layout_marginTop="16dp"
+            android:visibility="gone"
+            app:style="SECONDARY"
+            />
 
+    <com.telefonica.mistica.button.Button
+            android:id="@+id/link_button"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:layout_marginTop="16dp"
+            android:visibility="gone"
+            app:style="LINK"
+            />
 </merge>
diff --git a/library/src/main/res/layout/screen_feedback_buttons_inverse.xml b/library/src/main/res/layout/screen_feedback_buttons_inverse.xml
index 0b06eca39..ba7c52a7b 100644
--- a/library/src/main/res/layout/screen_feedback_buttons_inverse.xml
+++ b/library/src/main/res/layout/screen_feedback_buttons_inverse.xml
@@ -1,26 +1,28 @@
 <?xml version="1.0" encoding="utf-8"?>
-<merge xmlns:android="http://schemas.android.com/apk/res/android">
+<merge xmlns:android="http://schemas.android.com/apk/res/android"
+        xmlns:app="http://schemas.android.com/apk/res-auto"
+        >
 
-    <com.telefonica.mistica.button.ProgressButton
+    <com.telefonica.mistica.button.Button
         android:id="@+id/first_button"
-        style="@style/AppTheme.Button.PrimaryButtonInverse"
         android:layout_width="match_parent"
-        android:layout_height="wrap_content" />
+        android:layout_height="wrap_content"
+        app:style="PRIMARY_INVERSE"/>
 
     <com.telefonica.mistica.button.Button
         android:id="@+id/second_button"
-        style="@style/AppTheme.Button.SecondaryButtonInverse"
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
         android:layout_marginTop="16dp"
-        android:visibility="gone" />
+        android:visibility="gone"
+        app:style="SECONDARY_INVERSE"/>
 
     <com.telefonica.mistica.button.Button
         android:id="@+id/link_button"
-        style="@style/AppTheme.Button.LinkButtonInverse"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_marginTop="16dp"
-        android:visibility="gone" />
+        android:visibility="gone"
+        app:style="LINK_INVERSE"/>
 
 </merge>
diff --git a/library/src/main/res/values/attrs_components.xml b/library/src/main/res/values/attrs_components.xml
index d0824bdc5..657c4805b 100755
--- a/library/src/main/res/values/attrs_components.xml
+++ b/library/src/main/res/values/attrs_components.xml
@@ -4,8 +4,26 @@
         <attr name="cornerRadius" format="dimension" />
     </declare-styleable>
 
-    <declare-styleable name="ProgressButton">
+    <declare-styleable name="Button">
         <attr name="isLoading" format="boolean" />
+        <attr name="text" format="string" />
+        <attr name="loadingText" format="string" />
+        <attr name="style" format="enum">
+            <enum name="PRIMARY" value="0" />
+            <enum name="PRIMARY_SMALL" value="1" />
+            <enum name="SECONDARY" value="2" />
+            <enum name="SECONDARY_SMALL" value="3" />
+            <enum name="DANGER" value="4" />
+            <enum name="DANGER_SMALL" value="5" />
+            <enum name="LINK" value="6" />
+            <enum name="PRIMARY_INVERSE" value="7" />
+            <enum name="PRIMARY_SMALL_INVERSE" value="8" />
+            <enum name="SECONDARY_INVERSE" value="9" />
+            <enum name="SECONDARY_SMALL_INVERSE" value="10" />
+            <enum name="LINK_INVERSE" value="11" />
+        </attr>
+        <attr name="enabled" format="boolean" />
+        <attr name="icon" format="reference" />
     </declare-styleable>
 
 	<declare-styleable name="TagView">
diff --git a/library/src/main/res/values/attrs_ids.xml b/library/src/main/res/values/attrs_ids.xml
new file mode 100644
index 000000000..2a24c3eb2
--- /dev/null
+++ b/library/src/main/res/values/attrs_ids.xml
@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="utf-8"?>
+<resources>
+	<item name="button" type="id" />
+	<item name="button_text" type="id" />
+	<item name="button_text_loading" type="id" />
+	<item name="button_icon" type="id" />
+	<item name="button_progress" type="id" />
+</resources>

From d9b40b4d9d15e2262d712538b001d113d7220ff0 Mon Sep 17 00:00:00 2001
From: Pablo Garcia <pablo.garcianunez@telefonica.com>
Date: Mon, 31 Jul 2023 10:24:44 +0200
Subject: [PATCH 2/2] Remove unused styles

---
 UPGRADING.md                                  |   3 +
 .../res/layout/screen_buttons_catalog.xml     |   7 -
 .../main/res/layout/load_error_feedback.xml   |   4 +-
 .../src/main/res/values/dimens_buttons.xml    |  19 +--
 .../src/main/res/values/styles_buttons.xml    | 140 ------------------
 library/src/main/res/values/themes.xml        |   4 +-
 6 files changed, 7 insertions(+), 170 deletions(-)
 delete mode 100644 library/src/main/res/values/styles_buttons.xml

diff --git a/UPGRADING.md b/UPGRADING.md
index 5b51deff6..17e1348f0 100644
--- a/UPGRADING.md
+++ b/UPGRADING.md
@@ -79,3 +79,6 @@ Please replace set functions by property access syntax
 Please replace android xml attributes by Mistica attributes
 - `android:text="some text"` -> `app:text="some text"`
 - `android:enabled="false"` -> `app:enabled="false"`
+
+Styles
+- Removed all related xml button styles. Replace all by `app:style="XXXX"` attribute
diff --git a/catalog/src/main/res/layout/screen_buttons_catalog.xml b/catalog/src/main/res/layout/screen_buttons_catalog.xml
index fb1e905ff..74bec5953 100644
--- a/catalog/src/main/res/layout/screen_buttons_catalog.xml
+++ b/catalog/src/main/res/layout/screen_buttons_catalog.xml
@@ -304,7 +304,6 @@
                     android:layout_marginTop="8dp"
                     app:text="Primary Icon"
                     app:icon="@drawable/icn_creditcard"
-                    app:iconTint="@color/text_button_primary_inverse_selector"
                     app:style="PRIMARY_INVERSE"
                     />
 
@@ -340,7 +339,6 @@
                     android:layout_marginTop="8dp"
                     app:text="Primary Small Icon"
                     app:icon="@drawable/icn_creditcard"
-                    app:iconTint="@color/text_button_primary_inverse_selector"
                     app:style="PRIMARY_SMALL_INVERSE"
                     />
 
@@ -354,7 +352,6 @@
                     />
 
             <com.telefonica.mistica.button.Button
-                    style="@style/AppTheme.Button.PrimaryButtonInverse.Small"
                     android:layout_width="wrap_content"
                     android:layout_height="wrap_content"
                     android:layout_marginTop="8dp"
@@ -377,13 +374,11 @@
                     android:layout_marginTop="8dp"
                     app:text="Secondary Icon"
                     app:icon="@drawable/icn_creditcard"
-                    app:iconTint="@color/text_button_secondary_inverse_selector"
                     app:style="SECONDARY_INVERSE"
                     />
 
             <com.telefonica.mistica.button.Button
                     android:id="@+id/secondary_inverse_progress"
-                    style="@style/AppTheme.Button.SecondaryButtonInverse"
                     android:layout_width="wrap_content"
                     android:layout_height="wrap_content"
                     android:layout_marginTop="8dp"
@@ -414,7 +409,6 @@
                     android:layout_marginTop="8dp"
                     app:text="Secondary Small Icon"
                     app:icon="@drawable/icn_creditcard"
-                    app:iconTint="@color/text_button_secondary_inverse_selector"
                     app:style="SECONDARY_SMALL_INVERSE"
                     />
 
@@ -450,7 +444,6 @@
                     android:layout_marginTop="8dp"
                     app:text="Link Icon"
                     app:icon="@drawable/icn_creditcard"
-                    app:iconTint="@color/text_button_link_inverse_selector"
                     app:style="LINK_INVERSE"
                     />
 
diff --git a/library/src/main/res/layout/load_error_feedback.xml b/library/src/main/res/layout/load_error_feedback.xml
index 63c321bd5..75dbe0e36 100644
--- a/library/src/main/res/layout/load_error_feedback.xml
+++ b/library/src/main/res/layout/load_error_feedback.xml
@@ -24,9 +24,9 @@
 
     <com.telefonica.mistica.button.Button
         android:id="@+id/load_error_feedback_button"
-        style="@style/AppTheme.Button.SecondaryButton"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_marginTop="24dp"
-        app:text="@string/generic_retry" />
+        app:text="@string/generic_retry"
+            app:style="SECONDARY"/>
 </merge>
diff --git a/library/src/main/res/values/dimens_buttons.xml b/library/src/main/res/values/dimens_buttons.xml
index de9c300d3..05add4e4b 100644
--- a/library/src/main/res/values/dimens_buttons.xml
+++ b/library/src/main/res/values/dimens_buttons.xml
@@ -1,21 +1,4 @@
 <?xml version="1.0" encoding="utf-8"?>
 <resources>
-    <dimen name="button_horizontal_padding">16dp</dimen>
-    <dimen name="button_height">48dp</dimen>
-    <dimen name="button_min_width">136dp</dimen>
-    <dimen name="button_vertical_inset">0dp</dimen>
-    <dimen name="button_icon_size">24dp</dimen>
-    <dimen name="button_icon_padding">8dp</dimen>
     <dimen name="button_outline_stroke_width">1.5dp</dimen>
-    <dimen name="button_max_animation_translation">32dp</dimen>
-
-    <!-- Small variant -->
-    <dimen name="button_small_height">32dp</dimen>
-    <dimen name="button_small_min_width">104dp</dimen>
-    <dimen name="button_small_icon_size">16dp</dimen>
-
-    <!-- Link variant -->
-    <dimen name="button_link_horizontal_padding">8dp</dimen>
-    <dimen name="negative_button_link_horizontal_padding">-8dp</dimen>
-
-</resources>
\ No newline at end of file
+</resources>
diff --git a/library/src/main/res/values/styles_buttons.xml b/library/src/main/res/values/styles_buttons.xml
deleted file mode 100644
index 7bf338f05..000000000
--- a/library/src/main/res/values/styles_buttons.xml
+++ /dev/null
@@ -1,140 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-<resources>
-
-    <style name="AppTheme.Button" parent="Widget.MaterialComponents.Button.UnelevatedButton">
-        <item name="android:textAppearance">@style/AppTheme.TextAppearance.PresetButton</item>
-        <item name="android:minHeight">@dimen/button_height</item>
-        <item name="android:insetTop">@dimen/button_vertical_inset</item>
-        <item name="android:insetBottom">@dimen/button_vertical_inset</item>
-        <item name="android:paddingStart">@dimen/button_horizontal_padding</item>
-        <item name="android:paddingEnd">@dimen/button_horizontal_padding</item>
-        <item name="android:minWidth">@dimen/button_min_width</item>
-        <item name="iconSize">@dimen/button_icon_size</item>
-        <item name="cornerRadius">?buttonBorderRadius</item>
-        <item name="iconGravity">textStart</item>
-        <item name="android:maxLines">1</item>
-        <item name="android:ellipsize">end</item>
-        <item name="iconPadding">@dimen/button_icon_padding</item>
-    </style>
-
-    <style name="AppTheme.OutlinedButton" parent="Widget.MaterialComponents.Button.OutlinedButton">
-        <item name="android:textAppearance">@style/AppTheme.TextAppearance.PresetButton</item>
-        <item name="android:minHeight">@dimen/button_height</item>
-        <item name="android:insetTop">@dimen/button_vertical_inset</item>
-        <item name="android:insetBottom">@dimen/button_vertical_inset</item>
-        <item name="android:paddingStart">@dimen/button_horizontal_padding</item>
-        <item name="android:paddingEnd">@dimen/button_horizontal_padding</item>
-        <item name="android:minWidth">@dimen/button_min_width</item>
-        <item name="iconSize">@dimen/button_icon_size</item>
-        <item name="cornerRadius">?buttonBorderRadius</item>
-        <item name="iconGravity">textStart</item>
-        <item name="android:maxLines">1</item>
-        <item name="android:ellipsize">end</item>
-        <item name="iconPadding">@dimen/button_icon_padding</item>
-    </style>
-
-    <style name="AppTheme.LinkButton" parent="Widget.MaterialComponents.Button.TextButton">
-        <item name="android:textAppearance">@style/AppTheme.TextAppearance.PresetSmallButton</item>
-        <item name="android:paddingStart">@dimen/button_link_horizontal_padding</item>
-        <item name="android:paddingEnd">@dimen/button_link_horizontal_padding</item>
-        <item name="android:minWidth">0dp</item>
-        <item name="android:minHeight">@dimen/button_small_height</item>
-        <item name="android:insetTop">@dimen/button_vertical_inset</item>
-        <item name="android:insetBottom">@dimen/button_vertical_inset</item>
-        <item name="iconSize">@dimen/button_small_icon_size</item>
-        <item name="cornerRadius">?buttonBorderRadius</item>
-        <item name="iconGravity">textStart</item>
-        <item name="android:maxLines">1</item>
-        <item name="android:ellipsize">end</item>
-        <item name="iconPadding">@dimen/button_icon_padding</item>
-    </style>
-
-    <style name="AppTheme.Button.DefaultButton">
-        <item name="backgroundTint">@color/button_primary_background_selector</item>
-        <item name="android:textColor">@color/button_primary_text_selector</item>
-        <item name="iconTint">@color/button_primary_text_selector</item>
-        <item name="rippleColor">?attr/colorButtonPrimaryBackgroundSelected</item>
-    </style>
-
-    <style name="AppTheme.Button.DefaultButton.Small">
-        <item name="android:textAppearance">@style/AppTheme.TextAppearance.PresetSmallButton</item>
-        <item name="android:minWidth">@dimen/button_small_min_width</item>
-        <item name="android:minHeight">@dimen/button_small_height</item>
-        <item name="iconSize">@dimen/button_small_icon_size</item>
-    </style>
-
-    <style name="AppTheme.Button.SecondaryButton" parent="AppTheme.OutlinedButton">
-        <item name="backgroundTint">@android:color/transparent</item>
-        <item name="android:textColor">@color/text_button_secondary_selector</item>
-        <item name="iconTint">@color/text_button_secondary_selector</item>
-        <item name="strokeColor">@color/button_secondary_border_selector</item>
-        <item name="strokeWidth">@dimen/button_outline_stroke_width</item>
-        <item name="rippleColor">@android:color/transparent</item>
-    </style>
-
-    <style name="AppTheme.Button.SecondaryButton.Small">
-        <item name="android:textAppearance">@style/AppTheme.TextAppearance.PresetSmallButton</item>
-        <item name="android:minWidth">@dimen/button_small_min_width</item>
-        <item name="android:minHeight">@dimen/button_small_height</item>
-        <item name="iconSize">@dimen/button_small_icon_size</item>
-    </style>
-
-    <style name="AppTheme.Button.DangerButton">
-        <item name="backgroundTint">@color/button_danger_background_selector</item>
-        <item name="android:textColor">@color/button_primary_text_selector</item>
-        <item name="iconTint">@color/button_primary_text_selector</item>
-        <item name="rippleColor">?attr/colorButtonDangerBackgroundSelected</item>
-    </style>
-
-    <style name="AppTheme.Button.DangerButton.Small">
-        <item name="android:textAppearance">@style/AppTheme.TextAppearance.PresetSmallButton</item>
-        <item name="android:minWidth">@dimen/button_small_min_width</item>
-        <item name="android:minHeight">@dimen/button_small_height</item>
-        <item name="iconSize">@dimen/button_small_icon_size</item>
-    </style>
-
-    <style name="AppTheme.Button.LinkButton" parent="AppTheme.LinkButton">
-        <item name="backgroundTint">@android:color/transparent</item>
-        <item name="android:textColor">@color/text_button_link_selector</item>
-        <item name="iconTint">@color/text_button_link_selector</item>
-        <item name="rippleColor">?attr/colorButtonLinkBackgroundSelected</item>
-    </style>
-
-    <style name="AppTheme.Button.PrimaryButtonInverse">
-        <item name="backgroundTint">@color/button_primary_background_inverse_selector</item>
-        <item name="android:textColor">@color/text_button_primary_inverse_selector</item>
-        <item name="iconTint">@color/text_button_primary_inverse_selector</item>
-        <item name="rippleColor">?attr/colorButtonPrimaryBackgroundInverseSelected</item>
-    </style>
-
-    <style name="AppTheme.Button.PrimaryButtonInverse.Small">
-        <item name="android:textAppearance">@style/AppTheme.TextAppearance.PresetSmallButton</item>
-        <item name="android:minWidth">@dimen/button_small_min_width</item>
-        <item name="android:minHeight">@dimen/button_small_height</item>
-        <item name="iconSize">@dimen/button_small_icon_size</item>
-    </style>
-
-    <style name="AppTheme.Button.SecondaryButtonInverse" parent="AppTheme.OutlinedButton">
-        <item name="backgroundTint">@android:color/transparent</item>
-        <item name="android:textColor">@color/text_button_secondary_inverse_selector</item>
-        <item name="iconTint">@color/text_button_secondary_inverse_selector</item>
-        <item name="strokeColor">@color/button_secondary_background_inverse_selector</item>
-        <item name="strokeWidth">@dimen/button_outline_stroke_width</item>
-        <item name="rippleColor">@android:color/transparent</item>
-    </style>
-
-    <style name="AppTheme.Button.SecondaryButtonInverse.Small">
-        <item name="android:textAppearance">@style/AppTheme.TextAppearance.PresetSmallButton</item>
-        <item name="android:minWidth">@dimen/button_small_min_width</item>
-        <item name="android:minHeight">@dimen/button_small_height</item>
-        <item name="iconSize">@dimen/button_small_icon_size</item>
-    </style>
-
-    <style name="AppTheme.Button.LinkButtonInverse" parent="AppTheme.LinkButton">
-        <item name="backgroundTint">@android:color/transparent</item>
-        <item name="android:textColor">@color/text_button_link_inverse_selector</item>
-        <item name="iconTint">@color/text_button_link_inverse_selector</item>
-        <item name="rippleColor">?colorButtonLinkBackgroundSelected</item>
-    </style>
-
-</resources>
\ No newline at end of file
diff --git a/library/src/main/res/values/themes.xml b/library/src/main/res/values/themes.xml
index ffb167bbe..7bc6c8d2e 100644
--- a/library/src/main/res/values/themes.xml
+++ b/library/src/main/res/values/themes.xml
@@ -18,8 +18,6 @@
 
         <item name="android:textAppearance">@style/AppTheme.TextAppearance.Preset3</item>
 
-        <item name="materialButtonStyle">@style/AppTheme.Button.DefaultButton</item>
-
         <item name="snackbarStyle">@style/Widget.MaterialComponents.Snackbar</item>
         <item name="maxActionInlineWidth" tools:ignore="PrivateResource">
             @dimen/design_snackbar_action_inline_max_width
@@ -32,4 +30,4 @@
         <item name="font_family_medium">sans-serif-medium</item>
     </style>
 
-</resources>
\ No newline at end of file
+</resources>