@codecademy/gamut

68.2.268.2.3-alpha.6d52f4.0
dist/DatePicker/Calendar/CalendarFooter.js
+dist/DatePicker/Calendar/CalendarFooter.jsNew file
+35
Index: package/dist/DatePicker/Calendar/CalendarFooter.js
===================================================================
--- package/dist/DatePicker/Calendar/CalendarFooter.js
+++ package/dist/DatePicker/Calendar/CalendarFooter.js
@@ -0,0 +1,35 @@
+import * as React from 'react';
+import { FlexBox } from '../../Box';
+import { TextButton } from '../../Button';
+import { DEFAULT_DATE_PICKER_TRANSLATIONS } from '../utils/translations';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export const CalendarFooter = ({
+  onClearDate,
+  clearText = DEFAULT_DATE_PICKER_TRANSLATIONS.clearText,
+  disabled,
+  showClearButton,
+  quickActions = []
+}) => {
+  // if there are no quick actions and the clear button is not shown, don't render anything
+  if (quickActions.length === 0 && !showClearButton) return null;
+  const actions = quickActions.slice(0, 3);
+  return /*#__PURE__*/_jsxs(FlexBox, {
+    alignItems: "center",
+    borderTop: 1,
+    justifyContent: "space-between",
+    p: 12,
+    children: [showClearButton && /*#__PURE__*/_jsx(TextButton, {
+      disabled: disabled,
+      onClick: () => onClearDate?.(),
+      children: clearText
+    }), /*#__PURE__*/_jsx(FlexBox, {
+      gap: 8,
+      children: actions.map((action, index) => /*#__PURE__*/_jsx(TextButton
+      // eslint-disable-next-line react/no-array-index-key -- displayText may duplicate
+      , {
+        onClick: action.onClick,
+        children: action.displayText
+      }, `${action.displayText}-${index}`))
+    })]
+  });
+};
\ No newline at end of file