DropdownMenuV2: invert animation direction (WordPress#63443)

* DropdownMenuV2: invert animation direction * CHANGELOG * fix CHANGELOG --- Co-authored-by: ciampo <[email protected]> Co-authored-by: tyxla <[email protected]>
carstingaxion · Jul 18, 2024 · ccbbd1f · ccbbd1f
1 parent fc822e5
commit ccbbd1f
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 3 deletions.
diff --git a/packages/components/CHANGELOG.md b/packages/components/CHANGELOG.md
@@ -11,6 +11,7 @@
 -   `CustomSelectControl`: switch to ariakit-based implementation ([#63258](https://github.com/WordPress/gutenberg/pull/63258)).
 -   `CustomSelectControlV2`: animate select popover appearance. ([#63343](https://github.com/WordPress/gutenberg/pull/63343))
 -   `CustomSelectControlV2`: do not flip popover if legacy adapter. ([#63357](https://github.com/WordPress/gutenberg/pull/63357)).
+-   `DropdownMenuV2`: invert animation direction. ([#63443](https://github.com/WordPress/gutenberg/pull/63443)).
 
 ### Enhancements
 

diff --git a/packages/components/src/dropdown-menu-v2/styles.ts b/packages/components/src/dropdown-menu-v2/styles.ts
@@ -107,13 +107,13 @@ export const DropdownMenu = styled( Ariakit.Menu )<
 	/* Default animation.*/
 	animation-name: ${ slideDownAndFade };
 
-	&[data-side='right'] {
+	&[data-side='left'] {
 		animation-name: ${ slideLeftAndFade };
 	}
-	&[data-side='bottom'] {
+	&[data-side='up'] {
 		animation-name: ${ slideUpAndFade };
 	}
-	&[data-side='left'] {
+	&[data-side='right'] {
 		animation-name: ${ slideRightAndFade };
 	}
 	@media ( prefers-reduced-motion ) {