@codecademy/gamut

Index: package/dist/DatePicker/DatePickerCalendar/Calendar/CalendarNavLastMonth.js
===================================================================
--- package/dist/DatePicker/DatePickerCalendar/Calendar/CalendarNavLastMonth.js
+++ package/dist/DatePicker/DatePickerCalendar/Calendar/CalendarNavLastMonth.js
@@ -0,0 +1,45 @@
+import { MiniChevronLeftIcon } from '@codecademy/gamut-icons';
+import * as React from 'react';
+import { IconButton } from '../../../Button';
+import { useResolvedLocale } from '../../utils/locale';
+import { getRelativeMonthLabels } from './utils/format';
+import { jsx as _jsx } from "react/jsx-runtime";
+export const CalendarNavLastMonth = ({
+  displayDate,
+  onDisplayDateChange,
+  onLastMonthClick,
+  onTabIntoGrid,
+  interceptTabToGrid,
+  locale
+}) => {
+  const resolvedLocale = useResolvedLocale(locale);
+  const {
+    lastMonth
+  } = getRelativeMonthLabels(resolvedLocale);
+  const buttonRef = React.useRef(null);
+  const handleClick = e => {
+    const lastMonth = new Date(displayDate.getFullYear(), displayDate.getMonth() - 1, 1);
+    onDisplayDateChange?.(lastMonth);
+    onLastMonthClick?.();
+    if (e.detail > 0) {
+      buttonRef.current?.blur();
+    }
+  };
+  const handleKeyDown = e => {
+    if (e.key === 'Tab' && !e.shiftKey && interceptTabToGrid && onTabIntoGrid) {
+      e.preventDefault();
+      onTabIntoGrid();
+    }
+  };
+  return /*#__PURE__*/_jsx(IconButton, {
+    alignSelf: "flex-start",
+    "aria-label": lastMonth,
+    "data-calendar-month-nav": true,
+    icon: MiniChevronLeftIcon,
+    ref: buttonRef,
+    size: "small",
+    tip: lastMonth,
+    onClick: handleClick,
+    onKeyDown: handleKeyDown
+  });
+};
\ No newline at end of file