## Acceptance Criteria ### Panel Header - [ ] The dropdown panel renders a header ([Figma ↗](https://www.figma.com/design/UeQnHScevSiXoTNxjg6jaf?node-id=2166:43938)) containing: - A rocket/release status icon on the left ([Figma ↗](https://www.figma.com/design/UeQnHScevSiXoTNxjg6jaf?node-id=2166:43940)) - A **"Monthly releases"** label to the right of the icon ([Figma ↗](https://www.figma.com/design/UeQnHScevSiXoTNxjg6jaf?node-id=2166:43941)) - The header has a light surface background with a top border and rounded top corners ### Closed State - [ ] In the closed state ([Figma ↗](https://www.figma.com/design/UeQnHScevSiXoTNxjg6jaf?node-id=2166:43937)), the input field displays: - The currently selected release version (e.g. **"GitLab 18.11"**) as the primary label ([Figma ↗](https://www.figma.com/design/UeQnHScevSiXoTNxjg6jaf?node-id=2159:21730)) - The corresponding release date (e.g. **"Mar 19, 2026"**) in a secondary style to the right of the version label ([Figma ↗](https://www.figma.com/design/UeQnHScevSiXoTNxjg6jaf?node-id=2159:21731)) - A chevron-down icon on the right edge of the input field ([Figma ↗](https://www.figma.com/design/UeQnHScevSiXoTNxjg6jaf?node-id=2159:21732)) - The input field has a white background, full border, and rounded corners ### Open State - [ ] Clicking the input field opens the dropdown ([Figma ↗](https://www.figma.com/design/UeQnHScevSiXoTNxjg6jaf?node-id=2159:22029)), which: - Continues to show the selected version and date in the input field ([Figma ↗](https://www.figma.com/design/UeQnHScevSiXoTNxjg6jaf?node-id=2159:22036)) - Reveals a scrollable list of release options below the input field ([Figma ↗](https://www.figma.com/design/UeQnHScevSiXoTNxjg6jaf?node-id=2159:22041)) ### Dropdown Menu Items - [ ] Each item in the open menu ([Figma ↗](https://www.figma.com/design/UeQnHScevSiXoTNxjg6jaf?node-id=2159:22043)) displays: - The version number on the left (e.g. **"18.11"**, **"18.10"**, **"18.9"** … **"17.11"**) - The release date to the right of the version number (e.g. **"Mar 19, 2026"**) - A **"(recently released)"** annotation for the most recent release only ([Figma ↗](https://www.figma.com/design/UeQnHScevSiXoTNxjg6jaf?node-id=2159:22048)) - [ ] The list renders 13 release versions in order from most recent to oldest (18.11 down to 17.11) ([Figma ↗](https://www.figma.com/design/UeQnHScevSiXoTNxjg6jaf?node-id=2159:22044)) - [ ] Selecting an item from the list closes the dropdown, updates the input field to reflect the chosen version and date, and navigates to or renders the corresponding release content ### Behaviour & Accessibility - [ ] The chevron icon toggles between down (closed) and up (open) states to indicate dropdown state - [ ] Clicking outside the open dropdown closes it without changing the selection - [ ] The dropdown is keyboard navigable (Tab to focus, Enter/Space to open, arrow keys to navigate items, Enter to select, Escape to close) - [ ] The input field has an appropriate `aria-expanded` attribute reflecting open/closed state