fix(menu-separator): add className prop to MenuSeparator (#2949)

Co-authored-by: mergify[bot] <37929162+mergify[bot]@users.noreply.github.com>
Co-authored-by: Trevor <7311041+tjuanitas@users.noreply.github.com>

src/components/menu/MenuSeparator.tsx

@@ -1,5 +1,12 @@
 import React from 'react';
+import classNames from 'classnames';
 
-const MenuSeparator = () => <li role="separator" />;
+export interface MenuSeparatorProps {
+    className?: string;
+}
+
+const MenuSeparator = ({ className }: MenuSeparatorProps) => (
+    <li className={classNames('bdl-MenuSeparator', className)} role="separator" />
+);
 
 export default MenuSeparator;

src/components/menu/__tests__/MenuSeparator.test.tsx

@@ -9,5 +9,14 @@ describe('components/menu/MenuSeparator', () => {
 
         expect(wrapper.is('li')).toBe(true);
         expect(wrapper.prop('role')).toEqual('separator');
+        expect(wrapper.prop('className')).toEqual('bdl-MenuSeparator');
+    });
+
+    test('should correctly render a separator list element when className is provided', () => {
+        const wrapper = shallow(<MenuSeparator className="hello-world" />);
+
+        expect(wrapper.is('li')).toBe(true);
+        expect(wrapper.prop('role')).toEqual('separator');
+        expect(wrapper.prop('className')).toEqual('bdl-MenuSeparator hello-world');
     });
 });