From 80ac32f8640ae842641418bf3a262a38e5e5692c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Tu=C4=9F=C3=A7e=20K=C3=BC=C3=A7=C3=BCko=C4=9Flu?=
 <tugcekucukoglu.860@gmail.com>
Date: Fri, 3 Mar 2023 15:41:32 +0300
Subject: [PATCH] Fixed #3697 - SplitButton: New Styling properties

---
 api-generator/components/splitbutton.js | 36 +++++++++++++++++++++++
 components/splitbutton/SplitButton.d.ts | 28 ++++++++++++++++++
 components/splitbutton/SplitButton.vue  | 38 ++++++++++++++++++++++++-
 3 files changed, 101 insertions(+), 1 deletion(-)

diff --git a/api-generator/components/splitbutton.js b/api-generator/components/splitbutton.js
index ab16eccd3..e83b7f907 100644
--- a/api-generator/components/splitbutton.js
+++ b/api-generator/components/splitbutton.js
@@ -58,6 +58,42 @@ const SplitButtonProps = [
         type: 'string',
         default: 'null',
         description: 'Name of the menu button icon.'
+    },
+    {
+        name: 'severity',
+        type: 'string',
+        default: 'null',
+        description: 'Defines the style of the button, valid values are "secondary", "success", "info", "warning", "help", "danger".'
+    },
+    {
+        name: 'raised',
+        type: 'boolean',
+        default: 'false',
+        description: 'Add a shadow to indicate elevation.'
+    },
+    {
+        name: 'rounded',
+        type: 'boolean',
+        default: 'false',
+        description: 'Add a circular border radius to the button.'
+    },
+    {
+        name: 'text',
+        type: 'boolean',
+        default: 'false',
+        description: 'Add a textual class to the button without a background initially.'
+    },
+    {
+        name: 'outlined',
+        type: 'boolean',
+        default: 'false',
+        description: 'Add a border class without a background initially.'
+    },
+    {
+        name: 'size',
+        type: 'string',
+        default: 'null',
+        description: 'Defines the size of the button, valid values are "small" and "large".'
     }
 ];
 
diff --git a/components/splitbutton/SplitButton.d.ts b/components/splitbutton/SplitButton.d.ts
index be687ba42..866d4860a 100755
--- a/components/splitbutton/SplitButton.d.ts
+++ b/components/splitbutton/SplitButton.d.ts
@@ -68,6 +68,34 @@ export interface SplitButtonProps {
      * Name of the menu button icon.
      */
     menuButtonIcon?: string | undefined;
+    /**
+     * Defines the style of the button.
+     */
+    severity?: 'secondary' | 'success' | 'info' | 'warning' | 'help' | 'danger' | undefined;
+    /**
+     * Add a shadow to indicate elevation.
+     * @defaultValue false
+     */
+    raised?: boolean | undefined;
+    /**
+     * Add a circular border radius to the button.
+     * @defaultValue false
+     */
+    rounded?: boolean | undefined;
+    /**
+     * Add a textual class to the button without a background initially.
+     * @defaultValue false
+     */
+    text?: boolean | undefined;
+    /**
+     * Add a border class without a background initially.
+     * @defaultValue false
+     */
+    outlined?: boolean | undefined;
+    /**
+     * Defines the size of the button.
+     */
+    size?: 'small' | 'large' | undefined;
 }
 
 /**
diff --git a/components/splitbutton/SplitButton.vue b/components/splitbutton/SplitButton.vue
index 0ff9a2052..023a7f55a 100755
--- a/components/splitbutton/SplitButton.vue
+++ b/components/splitbutton/SplitButton.vue
@@ -76,6 +76,30 @@ export default {
         menuButtonIcon: {
             type: String,
             default: 'pi pi-chevron-down'
+        },
+        severity: {
+            type: String,
+            default: null
+        },
+        raised: {
+            type: Boolean,
+            default: false
+        },
+        rounded: {
+            type: Boolean,
+            default: false
+        },
+        text: {
+            type: Boolean,
+            default: false
+        },
+        outlined: {
+            type: Boolean,
+            default: false
+        },
+        size: {
+            type: String,
+            default: null
         }
     },
     data() {
@@ -105,7 +129,19 @@ export default {
             return UniqueComponentId();
         },
         containerClass() {
-            return ['p-splitbutton p-component', this.class];
+            return [
+                'p-splitbutton p-component',
+                this.class,
+                {
+                    [`p-button-${this.severity}`]: this.severity,
+                    'p-button-raised': this.raised,
+                    'p-button-rounded': this.rounded,
+                    'p-button-text': this.text,
+                    'p-button-outlined': this.outlined,
+                    'p-button-sm': this.size === 'small',
+                    'p-button-lg': this.size === 'large'
+                }
+            ];
         }
     },
     components: {