feat(b-dropdown): add splitClass property to dropdown component (#4394)

* feat(b-dropdown): add splitClass property to dropdown component

* Update package.json

Author: enriquecastl

src/components/dropdown/dropdown.js

@@ -60,6 +60,10 @@ export const props = {
     type: String,
     default: () => getComponentConfig(NAME, 'splitVariant')
   },
+  splitClass: {
+    type: [String, Array],
+    default: null
+  },
   splitButtonType: {
     type: String,
     default: 'button',
@@ -144,6 +148,7 @@ export const BDropdown = /*#__PURE__*/ Vue.extend({
         {
           ref: 'button',
           props: btnProps,
+          class: this.splitClass,
           attrs: {
             id: this.safeId('_BV_button_')
           },

src/components/dropdown/dropdown.spec.js

@@ -368,6 +368,21 @@ describe('dropdown', () => {
     wrapper.destroy()
   })
 
+  it('split should have class specified in split class property', () => {
+    const splitClass = 'custom-button-class'
+    const wrapper = mount(BDropdown, {
+      attachToDocument: true,
+      propsData: {
+        splitClass,
+        split: true
+      }
+    })
+    const $buttons = wrapper.findAll('button')
+    const $split = $buttons.at(0)
+
+    expect($split.classes()).toContain(splitClass)
+  })
+
   it('menu should have class dropdown-menu-right when prop right set', async () => {
     const wrapper = mount(BDropdown, {
       attachToDocument: true,

src/components/dropdown/package.json

@@ -96,6 +96,11 @@
             "prop": "splitButtonType",
             "description": "Value to place in the 'type' attribute on the split button: 'button', 'submit', 'reset'"
           },
+          {
+            "prop": "splitClass",
+            "version": "2.2.0",
+            "description": "CSS class (or classes) to add to the split button"
+          },
           {
             "prop": "boundary",
             "description": "The boundary constraint of the menu: 'scrollParent', 'window', 'viewport', or a reference to an HTMLElement"