feat: add CustomDropdown UX pattern component

[an0ushkah]

Summary

• Adds CustomDropdown, a new UX pattern component combining Aquarium's Dropdown, Checkbox, Button, and Divider
• Two menu variations: checkbox list only (showFooter: false) and checkbox list with Cancel/Show results footer buttons (showFooter: true)
• Trigger button uses the same dropdownOpen icon as the Select component; icon color inherits from the button so it renders correctly in the disabled state
• Exported from src/components/index.ts as CustomDropdown, ICustomDropdownProps, and ICustomDropdownOption
• Storybook stories added under UX Patterns/CustomDropdown with interaction play tests for Default and WithFooter

Testing Plan

• Was this tested locally? If not, explain why.
• Verified in Storybook locally — Default, WithFooter, and Disabled stories all render correctly
• npm run build passes cleanly
• Interaction play tests cover: opening the dropdown, selecting an option, and clicking Show results to close

[cursor]

PR Summary

Low Risk
Additive UI library component and Storybook stories with no changes to auth, data, or existing consumer behavior until adopted.

Overview
Introduces CustomDropdown, a reusable UX pattern for multi-select filtering via a click-triggered menu of checkboxes, aligned with existing patterns like MoreActionsButton and DimensionPicker.

Selection can work in two modes: immediate updates through onChange when showFooter is false, or draft-then-apply when showFooter is true—checkboxes edit local draft state until Cancel (closes without committing) or Show results (commits draft, calls onChange/onApply, and closes). The trigger reuses the same dropdownOpen icon as Select, with color="inherit" so the chevron matches the button in disabled states.

The component and its option/props types are exported from the public barrel. Storybook coverage under UX Patterns/CustomDropdown includes Default, WithFooter, and Disabled, with interaction plays for open/select and footer apply.

^{Reviewed by Cursor Bugbot for commit 46865f1. Bugbot is set up for automated code reviews on this repo. Configure here.}

[github-actions]

PR Preview Action v1.6.3
🚀 View preview at https://mParticle.github.io/aquarium/pr-preview/pr-815/
Built to branch gh-pages at 2026-06-25 20:06 UTC. Preview will be ready when the GitHub Pages deployment is complete.

[AustinFash]

LGTM

[cursor]

Cursor Bugbot has reviewed your changes using default effort and found 2 potential issues.

^{❌ Bugbot Autofix is OFF. To automatically fix reported issues with cloud agents, have a team admin enable autofix in the Cursor dashboard.}

^{Reviewed by Cursor Bugbot for commit 46865f1. Configure here.}

[cursor]

onApply sees stale value

Medium Severity

Clicking Show results calls onChange with the new draft, then invokes onApply with no arguments in the same turn. Parent handlers that read controlled value state inside onApply still see the previous selection, unlike DimensionPicker, which passes applied keys into onApply.

 

^{Reviewed by Cursor Bugbot for commit 46865f1. Configure here.}

[cursor]

committedValue ref never read

Low Severity

committedValue is written when the menu opens and when Show results is clicked, but its value is never read anywhere in the component, so it adds state with no effect on behavior.

Additional Locations (1)

• src/components/UXPatterns/CustomDropdown/CustomDropdown.tsx#L104-L105

 

^{Reviewed by Cursor Bugbot for commit 46865f1. Configure here.}