feat(BulkSelect): add dropdownListProps for greater control (#820)

Add a new dropdownListProps prop to the BulkSelect component to allow users to pass additional props to the DropdownList component, similar to the existing menuToggleCheckboxProps. This provides greater customization and control over the dropdown list portion of the component.

This feature was requested in issue #819 to enable more granular control over the BulkSelect component's dropdown behavior and styling.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-authored-by: Claude <noreply@anthropic.com>

Author: nicolethoen

packages/module/src/BulkSelect/BulkSelect.test.tsx

@@ -1,4 +1,5 @@
-import { render } from '@testing-library/react';
+import { render, screen } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
 import BulkSelect from './BulkSelect';
 
 describe('BulkSelect component', () => {
@@ -14,4 +15,29 @@ describe('BulkSelect component', () => {
         onSelect={() => null}
       />)).toMatchSnapshot();
   });
+
+  test('should render with dropdownListProps', async () => {
+    const user = userEvent.setup();
+    render(
+      <BulkSelect
+        canSelectAll
+        pageCount={5}
+        totalCount={10}
+        selectedCount={2}
+        pageSelected={false}
+        pagePartiallySelected={true}
+        onSelect={() => null}
+        dropdownListProps={{ className: 'custom-dropdown-list' }}
+      />
+    );
+
+    // Open the dropdown by clicking the toggle button
+    const toggleButton = screen.getByLabelText('Bulk select toggle');
+    await user.click(toggleButton);
+
+    // Now the dropdown list should be visible with the custom class
+    const dropdownList = document.querySelector('.custom-dropdown-list');
+    expect(dropdownList).toBeInTheDocument();
+    expect(dropdownList).toHaveClass('pf-v6-c-menu__list');
+  });
 });

packages/module/src/BulkSelect/BulkSelect.tsx

@@ -4,6 +4,7 @@ import {
   Dropdown,
   DropdownItem,
   DropdownList,
+  DropdownListProps,
   DropdownProps,
   MenuToggle,
   MenuToggleCheckbox,
@@ -44,6 +45,8 @@ export interface BulkSelectProps extends Omit<DropdownProps, 'toggle' | 'onSelec
   ouiaId?: string;
   /** Additional props for MenuToggleCheckbox */
   menuToggleCheckboxProps?: Omit<MenuToggleCheckboxProps, 'onChange' | 'isChecked' | 'instance' | 'ref'>;
+  /** Additional props for DropdownList */
+  dropdownListProps?: Omit<DropdownListProps, 'children'>;
 }
 
 export const BulkSelect: FC<BulkSelectProps> = ({
@@ -57,6 +60,7 @@ export const BulkSelect: FC<BulkSelectProps> = ({
   ouiaId = 'BulkSelect',
   onSelect,
   menuToggleCheckboxProps,
+  dropdownListProps,
   ...props
 }: BulkSelectProps) => {
   const [ isOpen, setOpen ] = useState(false);
@@ -129,7 +133,7 @@ export const BulkSelect: FC<BulkSelectProps> = ({
       )}
       {...props}
     >
-      <DropdownList>{splitButtonDropdownItems}</DropdownList>
+      <DropdownList {...dropdownListProps}>{splitButtonDropdownItems}</DropdownList>
     </Dropdown>)
   );
 };