Fixed #4863 - Button: new badgeSeverity property

components/lib/button/BaseButton.vue

@@ -30,6 +30,10 @@ export default {
             type: String,
             default: null
         },
+        badgeSeverity: {
+            type: String,
+            default: null
+        },
         loading: {
             type: Boolean,
             default: false

components/lib/button/Button.d.ts

@@ -116,6 +116,10 @@ export interface ButtonProps extends ButtonHTMLAttributes {
      * Style class of the badge.
      */
     badgeClass?: string | undefined;
+    /**
+     * Severity type of the badge.
+     */
+    badgeSeverity?: 'info' | 'success' | 'warning' | 'danger' | string | null | undefined;
     /**
      * Whether the button is in loading state.
      * @defaultValue false

components/lib/button/Button.vue

@@ -9,7 +9,7 @@
                 <span v-if="icon" :class="[cx('icon'), icon, iconClass]" v-bind="ptm('icon')"></span>
             </slot>
             <span :class="cx('label')" v-bind="ptm('label')">{{ label || '&nbsp;' }}</span>
-            <Badge v-if="badge" :value="badge" :class="badgeClass" :unstyled="unstyled" v-bind="ptm('badge')"></Badge>
+            <Badge v-if="badge" :value="badge" :class="badgeClass" :severity="badgeSeverity" :unstyled="unstyled" v-bind="ptm('badge')"></Badge>
         </slot>
     </button>
 </template>