@codecademy/gamut

Index: package/dist/Popover/styles/beak.js
===================================================================
--- package/dist/Popover/styles/beak.js
+++ package/dist/Popover/styles/beak.js
@@ -1,6 +1,8 @@
-import { beakBottomStyles, beakLeftCenterStyles, beakRightCenterStyles, beakStylesBase, beakTopStyles, getBeakBgAndRotation, tooltipBgColor } from '../../Tip/shared/styles/styles';
+import { beakBottomStyles, beakLeftCenterStyles, beakRightCenterStyles, beakStylesBase, beakTopStyles, getBeakBgAndRotation, horizontalCenterBeakRtlPopover, tooltipBgColor } from '../../Tip/shared/styles/styles';
 import { popoverPrimaryBgColor } from './base';
+const rtlBeakBoxRight = horizontalCenterBeakRtlPopover('right');
+const rtlBeakBoxLeft = horizontalCenterBeakRtlPopover('left');
 const positionAbove = {
   top: 'calc(100% - 10px)',
   ...beakStylesBase,
   ...getBeakBgAndRotation({
@@ -51,28 +53,32 @@
   top: 'calc(50% - 8px)'
 };
 const beakRightCenterStylesSml = {
   ...beakRightCenterStyles,
+  ...rtlBeakBoxRight,
   left: -8
 };
 export const beakRightCenterStylesLrg = {
   ...beakStylesBase,
   ...getBeakBgAndRotation({
     alignment: 'right',
     color: popoverPrimaryBgColor
   }),
+  ...rtlBeakBoxRight,
   left: -10
 };
 const beakLeftCenterStylesSml = {
   ...beakLeftCenterStyles,
+  ...rtlBeakBoxLeft,
   right: -8
 };
 const beakLeftCenterStylesLrg = {
   ...beakStylesBase,
   ...getBeakBgAndRotation({
     alignment: 'left',
     color: popoverPrimaryBgColor
   }),
+  ...rtlBeakBoxLeft,
   right: -10
 };
 export const beakBoxX = {
   alignItems: 'flex-end',