@codecademy/gamut 68.1.1-alpha.613ffe.0 → 68.1.1-alpha.9135d1.0

package/dist/ConnectedForm/utils.d.ts

@@ -122,9 +122,9 @@ export declare function useDebouncedField<T extends InputTypes>({ name, watchUpd
     value: T extends "checkbox" ? boolean : string;
     error: string | FieldError | Merge<FieldError, FieldErrorsImpl<any>> | undefined;
     ref: import("react-hook-form").UseFormRegisterReturn<string>;
-    control: import("react-hook-form").Control<import("react-hook-form").FieldValues, any, import("react-hook-form").FieldValues>;
     isDisabled: boolean;
     isLoading: boolean | undefined;
+    control: import("react-hook-form").Control<import("react-hook-form").FieldValues, any, import("react-hook-form").FieldValues>;
     isSoloField: boolean | undefined;
     validation: RegisterOptions | undefined;
     getValues: import("react-hook-form").UseFormGetValues<import("react-hook-form").FieldValues>;

package/dist/DatePicker/Calendar/Calendar.d.ts

@@ -0,0 +1,11 @@
+/// <reference types="react" />
+/**
+ * Outer wrapper for the calendar (header + body + footer).
+ * Used by DatePickerCalendar to group the calendar content.
+ */
+export declare const Calendar: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+} & {
+    theme?: import("@emotion/react").Theme | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/dist/DatePicker/Calendar/Calendar.js

@@ -0,0 +1,16 @@
+import _styled from "@emotion/styled/base";
+import { css } from '@codecademy/gamut-styles';
+/**
+ * Outer wrapper for the calendar (header + body + footer).
+ * Used by DatePickerCalendar to group the calendar content.
+ */
+export const Calendar = /*#__PURE__*/_styled("div", {
+  target: "eq0g1i20",
+  label: "Calendar"
+})(css({
+  backgroundColor: 'background',
+  borderRadius: 'lg',
+  boxShadow: '0 4px 16px rgba(0, 0, 0, 0.12)',
+  width: 'max-content',
+  p: 24
+}), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9EYXRlUGlja2VyL0NhbGVuZGFyL0NhbGVuZGFyLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFPd0IiLCJmaWxlIjoiLi4vLi4vLi4vc3JjL0RhdGVQaWNrZXIvQ2FsZW5kYXIvQ2FsZW5kYXIudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGNvZGVjYWRlbXkvZ2FtdXQtc3R5bGVzJztcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcblxuLyoqXG4gKiBPdXRlciB3cmFwcGVyIGZvciB0aGUgY2FsZW5kYXIgKGhlYWRlciArIGJvZHkgKyBmb290ZXIpLlxuICogVXNlZCBieSBEYXRlUGlja2VyQ2FsZW5kYXIgdG8gZ3JvdXAgdGhlIGNhbGVuZGFyIGNvbnRlbnQuXG4gKi9cbmV4cG9ydCBjb25zdCBDYWxlbmRhciA9IHN0eWxlZC5kaXYoXG4gIGNzcyh7XG4gICAgYmFja2dyb3VuZENvbG9yOiAnYmFja2dyb3VuZCcsXG4gICAgYm9yZGVyUmFkaXVzOiAnbGcnLFxuICAgIGJveFNoYWRvdzogJzAgNHB4IDE2cHggcmdiYSgwLCAwLCAwLCAwLjEyKScsXG4gICAgd2lkdGg6ICdtYXgtY29udGVudCcsXG4gICAgcDogMjQsXG4gIH0pXG4pO1xuIl19 */");

package/dist/DatePicker/Calendar/CalendarBody.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+import { CalendarBodyProps } from './types';
+export declare const CalendarBody: React.FC<CalendarBodyProps>;

package/dist/DatePicker/Calendar/CalendarBody.js

@@ -0,0 +1,219 @@
+import _styled from "@emotion/styled/base";
+import { states } from '@codecademy/gamut-styles';
+import { useCallback, useEffect, useMemo, useRef } from 'react';
+import * as React from 'react';
+import { TextButton } from '../../Button';
+import { clampToMonth, getMonthGrid, isDateDisabled, isDateInRange, isSameDay } from './utils/dateGrid';
+import { getWeekdayFullNames, getWeekdayLabels } from './utils/format';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+const DateButton = /*#__PURE__*/_styled(TextButton, {
+  target: "e12sl4cx0",
+  label: "DateButton"
+})(states({
+  isToday: {
+    bg: 'navy-200'
+  },
+  isSelected: {
+    color: 'background',
+    bg: 'text'
+  },
+  isInRange: {
+    bg: 'border-secondary'
+  }
+}), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9EYXRlUGlja2VyL0NhbGVuZGFyL0NhbGVuZGFyQm9keS50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBZ0JtQiIsImZpbGUiOiIuLi8uLi8uLi9zcmMvRGF0ZVBpY2tlci9DYWxlbmRhci9DYWxlbmRhckJvZHkudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgc3RhdGVzIH0gZnJvbSAnQGNvZGVjYWRlbXkvZ2FtdXQtc3R5bGVzJztcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbmltcG9ydCB7IHVzZUNhbGxiYWNrLCB1c2VFZmZlY3QsIHVzZU1lbW8sIHVzZVJlZiB9IGZyb20gJ3JlYWN0JztcbmltcG9ydCAqIGFzIFJlYWN0IGZyb20gJ3JlYWN0JztcblxuaW1wb3J0IHsgVGV4dEJ1dHRvbiB9IGZyb20gJy4uLy4uL0J1dHRvbic7XG5pbXBvcnQgeyBDYWxlbmRhckJvZHlQcm9wcyB9IGZyb20gJy4vdHlwZXMnO1xuaW1wb3J0IHtcbiAgY2xhbXBUb01vbnRoLFxuICBnZXRNb250aEdyaWQsXG4gIGlzRGF0ZURpc2FibGVkLFxuICBpc0RhdGVJblJhbmdlLFxuICBpc1NhbWVEYXksXG59IGZyb20gJy4vdXRpbHMvZGF0ZUdyaWQnO1xuaW1wb3J0IHsgZ2V0V2Vla2RheUZ1bGxOYW1lcywgZ2V0V2Vla2RheUxhYmVscyB9IGZyb20gJy4vdXRpbHMvZm9ybWF0JztcblxuY29uc3QgRGF0ZUJ1dHRvbiA9IHN0eWxlZChUZXh0QnV0dG9uKShcbiAgc3RhdGVzKHtcbiAgICBpc1RvZGF5OiB7XG4gICAgICBiZzogJ25hdnktMjAwJyxcbiAgICB9LFxuICAgIGlzU2VsZWN0ZWQ6IHtcbiAgICAgIGNvbG9yOiAnYmFja2dyb3VuZCcsXG4gICAgICBiZzogJ3RleHQnLFxuICAgIH0sXG4gICAgaXNJblJhbmdlOiB7XG4gICAgICBiZzogJ2JvcmRlci1zZWNvbmRhcnknLFxuICAgIH0sXG4gIH0pXG4pO1xuXG4vKiogRmxhdCBsaXN0IG9mIGRhdGVzIGluIGdyaWQgb3JkZXIgKHJvdy1tYWpvciwgbm9uLW51bGwgb25seSkgd2l0aCByb3cgaW5kZXggZm9yIEhvbWUvRW5kICovXG5mdW5jdGlvbiBnZXREYXRlc1dpdGhSb3coXG4gIHdlZWtzOiAoRGF0ZSB8IG51bGwpW11bXVxuKTogeyBkYXRlOiBEYXRlOyByb3dJbmRleDogbnVtYmVyIH1bXSB7XG4gIGNvbnN0IHJlc3VsdDogeyBkYXRlOiBEYXRlOyByb3dJbmRleDogbnVtYmVyIH1bXSA9IFtdO1xuICB3ZWVrcy5mb3JFYWNoKCh3ZWVrLCByb3dJbmRleCkgPT4ge1xuICAgIHdlZWsuZm9yRWFjaCgoZGF0ZSkgPT4ge1xuICAgICAgaWYgKGRhdGUgIT09IG51bGwpIHJlc3VsdC5wdXNoKHsgZGF0ZSwgcm93SW5kZXggfSk7XG4gICAgfSk7XG4gIH0pO1xuICByZXR1cm4gcmVzdWx0O1xufVxuXG5leHBvcnQgY29uc3QgQ2FsZW5kYXJCb2R5OiBSZWFjdC5GQzxDYWxlbmRhckJvZHlQcm9wcz4gPSAoe1xuICB2aXNpYmxlRGF0ZSxcbiAgc2VsZWN0ZWREYXRlLFxuICBlbmREYXRlID0gbnVsbCxcbiAgZGlzYWJsZWREYXRlcyA9IFtdLFxuICBvbkRhdGVTZWxlY3QsXG4gIGxvY2FsZSxcbiAgd2Vla1N0YXJ0c09uID0gMCxcbiAgbGFiZWxsZWRCeUlkLFxuICBmb2N1c2VkRGF0ZSxcbiAgb25Gb2N1c2VkRGF0ZUNoYW5nZSxcbiAgb25WaXNpYmxlRGF0ZUNoYW5nZSxcbiAgb25Fc2NhcGVLZXlQcmVzcyxcbn0pID0+IHtcbiAgY29uc3QgeWVhciA9IHZpc2libGVEYXRlLmdldEZ1bGxZZWFyKCk7XG4gIGNvbnN0IG1vbnRoID0gdmlzaWJsZURhdGUuZ2V0TW9udGgoKTtcbiAgY29uc3Qgd2Vla3MgPSBnZXRNb250aEdyaWQoeWVhciwgbW9udGgsIHdlZWtTdGFydHNPbik7XG4gIGNvbnN0IHdlZWtkYXlMYWJlbHMgPSBnZXRXZWVrZGF5TGFiZWxzKGxvY2FsZSwgd2Vla1N0YXJ0c09uKTtcbiAgY29uc3Qgd2Vla2RheUZ1bGxOYW1lcyA9IGdldFdlZWtkYXlGdWxsTmFtZXMobG9jYWxlLCB3ZWVrU3RhcnRzT24pO1xuICBjb25zdCBidXR0b25SZWZzID0gdXNlUmVmPE1hcDxudW1iZXIsIEhUTUxFbGVtZW50Pj4obmV3IE1hcCgpKTtcblxuICBjb25zdCBkYXRlc1dpdGhSb3cgPSB1c2VNZW1vKCgpID0+IGdldERhdGVzV2l0aFJvdyh3ZWVrcyksIFt3ZWVrc10pO1xuICBjb25zdCBmb2N1c1RhcmdldCA9IGZvY3VzZWREYXRlID8/IHNlbGVjdGVkRGF0ZTtcblxuICBjb25zdCBpc1RvZGF5ID0gdXNlQ2FsbGJhY2soXG4gICAgKGQ6IERhdGUgfCBudWxsKSA9PiBkICE9PSBudWxsICYmIGlzU2FtZURheShkLCBuZXcgRGF0ZSgpKSxcbiAgICBbXVxuICApO1xuXG4gIGNvbnN0IGZvY3VzQnV0dG9uID0gdXNlQ2FsbGJhY2soKGRhdGU6IERhdGUgfCBudWxsKSA9PiB7XG4gICAgaWYgKGRhdGUgPT09IG51bGwpIHJldHVybjtcbiAgICBjb25zdCBrZXkgPSBuZXcgRGF0ZShcbiAgICAgIGRhdGUuZ2V0RnVsbFllYXIoKSxcbiAgICAgIGRhdGUuZ2V0TW9udGgoKSxcbiAgICAgIGRhdGUuZ2V0RGF0ZSgpXG4gICAgKS5nZXRUaW1lKCk7XG4gICAgYnV0dG9uUmVmcy5jdXJyZW50LmdldChrZXkpPy5mb2N1cygpO1xuICB9LCBbXSk7XG5cbiAgdXNlRWZmZWN0KCgpID0+IHtcbiAgICBpZiAoZm9jdXNUYXJnZXQgIT09IG51bGwpIGZvY3VzQnV0dG9uKGZvY3VzVGFyZ2V0KTtcbiAgfSwgW2ZvY3VzVGFyZ2V0LCBmb2N1c0J1dHRvbl0pO1xuXG4gIGNvbnN0IGhhbmRsZUtleURvd24gPSB1c2VDYWxsYmFjayhcbiAgICAoZTogUmVhY3QuS2V5Ym9hcmRFdmVudCwgZGF0ZTogRGF0ZSkgPT4ge1xuICAgICAgaWYgKCFvbkZvY3VzZWREYXRlQ2hhbmdlKSByZXR1cm47XG4gICAgICBjb25zdCBrZXkgPSBkYXRlLmdldFRpbWUoKTtcbiAgICAgIGNvbnN0IGlkeCA9IGRhdGVzV2l0aFJvdy5maW5kSW5kZXgoKHsgZGF0ZTogZCB9KSA9PiBkLmdldFRpbWUoKSA9PT0ga2V5KTtcbiAgICAgIGlmIChpZHggPCAwKSByZXR1cm47XG5cbiAgICAgIGNvbnN0IGN1cnJlbnRSb3cgPSBkYXRlc1dpdGhSb3dbaWR4XS5yb3dJbmRleDtcbiAgICAgIGNvbnN0IGRheSA9IGRhdGUuZ2V0RGF0ZSgpO1xuXG4gICAgICBsZXQgbmV3RGF0ZTogRGF0ZSB8IG51bGwgPSBudWxsO1xuICAgICAgbGV0IG5ld1Zpc2libGVEYXRlOiBEYXRlIHwgbnVsbCA9IG51bGw7XG5cbiAgICAgIHN3aXRjaCAoZS5rZXkpIHtcbiAgICAgICAgY2FzZSAnQXJyb3dMZWZ0JzpcbiAgICAgICAgICBlLnByZXZlbnREZWZhdWx0KCk7XG4gICAgICAgICAgaWYgKGlkeCA+IDApIHtcbiAgICAgICAgICAgIG5ld0RhdGUgPSBkYXRlc1dpdGhSb3dbaWR4IC0gMV0uZGF0ZTtcbiAgICAgICAgICB9IGVsc2Uge1xuICAgICAgICAgICAgY29uc3QgbGFzdERheVByZXZNb250aCA9IG5ldyBEYXRlKHllYXIsIG1vbnRoLCAwKTtcbiAgICAgICAgICAgIG5ld0RhdGUgPSBsYXN0RGF5UHJldk1vbnRoO1xuICAgICAgICAgICAgbmV3VmlzaWJsZURhdGUgPSBuZXcgRGF0ZSh5ZWFyLCBtb250aCAtIDEsIDEpO1xuICAgICAgICAgIH1cbiAgICAgICAgICBicmVhaztcbiAgICAgICAgY2FzZSAnQXJyb3dSaWdodCc6XG4gICAgICAgICAgZS5wcmV2ZW50RGVmYXVsdCgpO1xuICAgICAgICAgIGlmIChpZHggPCBkYXRlc1dpdGhSb3cubGVuZ3RoIC0gMSkge1xuICAgICAgICAgICAgbmV3RGF0ZSA9IGRhdGVzV2l0aFJvd1tpZHggKyAxXS5kYXRlO1xuICAgICAgICAgIH0gZWxzZSB7XG4gICAgICAgICAgICBuZXdEYXRlID0gbmV3IERhdGUoeWVhciwgbW9udGggKyAxLCAxKTtcbiAgICAgICAgICAgIG5ld1Zpc2libGVEYXRlID0gbmV3IERhdGUoeWVhciwgbW9udGggKyAxLCAxKTtcbiAgICAgICAgICB9XG4gICAgICAgICAgYnJlYWs7XG4gICAgICAgIGNhc2UgJ0Fycm93VXAnOlxuICAgICAgICAgIGUucHJldmVudERlZmF1bHQoKTtcbiAgICAgICAgICBuZXdEYXRlID0gbmV3IERhdGUoZGF0ZSk7XG4gICAgICAgICAgbmV3RGF0ZS5zZXREYXRlKG5ld0RhdGUuZ2V0RGF0ZSgpIC0gNyk7XG4gICAgICAgICAgaWYgKG5ld0RhdGUuZ2V0TW9udGgoKSAhPT0gbW9udGggfHwgbmV3RGF0ZS5nZXRGdWxsWWVhcigpICE9PSB5ZWFyKSB7XG4gICAgICAgICAgICBuZXdWaXNpYmxlRGF0ZSA9IG5ldyBEYXRlKFxuICAgICAgICAgICAgICBuZXdEYXRlLmdldEZ1bGxZZWFyKCksXG4gICAgICAgICAgICAgIG5ld0RhdGUuZ2V0TW9udGgoKSxcbiAgICAgICAgICAgICAgMVxuICAgICAgICAgICAgKTtcbiAgICAgICAgICB9XG4gICAgICAgICAgYnJlYWs7XG4gICAgICAgIGNhc2UgJ0Fycm93RG93bic6XG4gICAgICAgICAgZS5wcmV2ZW50RGVmYXVsdCgpO1xuICAgICAgICAgIG5ld0RhdGUgPSBuZXcgRGF0ZShkYXRlKTtcbiAgICAgICAgICBuZXdEYXRlLnNldERhdGUobmV3RGF0ZS5nZXREYXRlKCkgKyA3KTtcbiAgICAgICAgICBpZiAobmV3RGF0ZS5nZXRNb250aCgpICE9PSBtb250aCB8fCBuZXdEYXRlLmdldEZ1bGxZZWFyKCkgIT09IHllYXIpIHtcbiAgICAgICAgICAgIG5ld1Zpc2libGVEYXRlID0gbmV3IERhdGUoXG4gICAgICAgICAgICAgIG5ld0RhdGUuZ2V0RnVsbFllYXIoKSxcbiAgICAgICAgICAgICAgbmV3RGF0ZS5nZXRNb250aCgpLFxuICAgICAgICAgICAgICAxXG4gICAgICAgICAgICApO1xuICAgICAgICAgIH1cbiAgICAgICAgICBicmVhaztcbiAgICAgICAgY2FzZSAnSG9tZSc6XG4gICAgICAgICAgZS5wcmV2ZW50RGVmYXVsdCgpO1xuICAgICAgICAgIG5ld0RhdGUgPVxuICAgICAgICAgICAgZGF0ZXNXaXRoUm93LmZpbmQoKHsgcm93SW5kZXggfSkgPT4gcm93SW5kZXggPT09IGN1cnJlbnRSb3cpXG4gICAgICAgICAgICAgID8uZGF0ZSA/PyBkYXRlO1xuICAgICAgICAgIGJyZWFrO1xuICAgICAgICBjYXNlICdFbmQnOlxuICAgICAgICAgIGUucHJldmVudERlZmF1bHQoKTtcbiAgICAgICAgICBuZXdEYXRlID1cbiAgICAgICAgICAgIFsuLi5kYXRlc1dpdGhSb3ddXG4gICAgICAgICAgICAgIC5yZXZlcnNlKClcbiAgICAgICAgICAgICAgLmZpbmQoKHsgcm93SW5kZXggfSkgPT4gcm93SW5kZXggPT09IGN1cnJlbnRSb3cpPy5kYXRlID8/IGRhdGU7XG4gICAgICAgICAgYnJlYWs7XG4gICAgICAgIGNhc2UgJ1BhZ2VEb3duJzpcbiAgICAgICAgICBlLnByZXZlbnREZWZhdWx0KCk7XG4gICAgICAgICAgaWYgKGUuc2hpZnRLZXkpIHtcbiAgICAgICAgICAgIG5ld0RhdGUgPSBjbGFtcFRvTW9udGgoeWVhciArIDEsIG1vbnRoLCBkYXkpO1xuICAgICAgICAgIH0gZWxzZSB7XG4gICAgICAgICAgICBuZXdEYXRlID0gY2xhbXBUb01vbnRoKHllYXIsIG1vbnRoICsgMSwgZGF5KTtcbiAgICAgICAgICB9XG4gICAgICAgICAgbmV3VmlzaWJsZURhdGUgPSBuZXcgRGF0ZShcbiAgICAgICAgICAgIG5ld0RhdGUuZ2V0RnVsbFllYXIoKSxcbiAgICAgICAgICAgIG5ld0RhdGUuZ2V0TW9udGgoKSxcbiAgICAgICAgICAgIDFcbiAgICAgICAgICApO1xuICAgICAgICAgIGJyZWFrO1xuICAgICAgICBjYXNlICdQYWdlVXAnOlxuICAgICAgICAgIGUucHJldmVudERlZmF1bHQoKTtcbiAgICAgICAgICBpZiAoZS5zaGlmdEtleSkge1xuICAgICAgICAgICAgbmV3RGF0ZSA9IGNsYW1wVG9Nb250aCh5ZWFyIC0gMSwgbW9udGgsIGRheSk7XG4gICAgICAgICAgfSBlbHNlIHtcbiAgICAgICAgICAgIG5ld0RhdGUgPSBjbGFtcFRvTW9udGgoeWVhciwgbW9udGggLSAxLCBkYXkpO1xuICAgICAgICAgIH1cbiAgICAgICAgICBuZXdWaXNpYmxlRGF0ZSA9IG5ldyBEYXRlKFxuICAgICAgICAgICAgbmV3RGF0ZS5nZXRGdWxsWWVhcigpLFxuICAgICAgICAgICAgbmV3RGF0ZS5nZXRNb250aCgpLFxuICAgICAgICAgICAgMVxuICAgICAgICAgICk7XG4gICAgICAgICAgYnJlYWs7XG4gICAgICAgIGNhc2UgJ0VudGVyJzpcbiAgICAgICAgY2FzZSAnICc6XG4gICAgICAgICAgZS5wcmV2ZW50RGVmYXVsdCgpO1xuICAgICAgICAgIGlmICghaXNEYXRlRGlzYWJsZWQoZGF0ZSwgZGlzYWJsZWREYXRlcykpIG9uRGF0ZVNlbGVjdChkYXRlKTtcbiAgICAgICAgICByZXR1cm47XG4gICAgICAgIGNhc2UgJ0VzY2FwZSc6XG4gICAgICAgICAgZS5wcmV2ZW50RGVmYXVsdCgpO1xuICAgICAgICAgIG9uRXNjYXBlS2V5UHJlc3M/LigpO1xuICAgICAgICAgIHJldHVybjtcbiAgICAgICAgZGVmYXVsdDpcbiAgICAgICAgICByZXR1cm47XG4gICAgICB9XG5cbiAgICAgIGlmIChuZXdEYXRlICE9PSBudWxsKSB7XG4gICAgICAgIG9uRm9jdXNlZERhdGVDaGFuZ2UobmV3RGF0ZSk7XG4gICAgICAgIGlmIChuZXdWaXNpYmxlRGF0ZSAhPT0gbnVsbCkgb25WaXNpYmxlRGF0ZUNoYW5nZT8uKG5ld1Zpc2libGVEYXRlKTtcbiAgICAgIH1cbiAgICB9LFxuICAgIFtcbiAgICAgIG9uRm9jdXNlZERhdGVDaGFuZ2UsXG4gICAgICBkYXRlc1dpdGhSb3csXG4gICAgICBtb250aCxcbiAgICAgIHllYXIsXG4gICAgICBkaXNhYmxlZERhdGVzLFxuICAgICAgb25EYXRlU2VsZWN0LFxuICAgICAgb25Fc2NhcGVLZXlQcmVzcyxcbiAgICAgIG9uVmlzaWJsZURhdGVDaGFuZ2UsXG4gICAgXVxuICApO1xuXG4gIGNvbnN0IHNldEJ1dHRvblJlZiA9IHVzZUNhbGxiYWNrKChkYXRlOiBEYXRlLCBlbDogSFRNTEVsZW1lbnQgfCBudWxsKSA9PiB7XG4gICAgY29uc3QgayA9IG5ldyBEYXRlKFxuICAgICAgZGF0ZS5nZXRGdWxsWWVhcigpLFxuICAgICAgZGF0ZS5nZXRNb250aCgpLFxuICAgICAgZGF0ZS5nZXREYXRlKClcbiAgICApLmdldFRpbWUoKTtcbiAgICBpZiAoZWwpIGJ1dHRvblJlZnMuY3VycmVudC5zZXQoaywgZWwpO1xuICAgIGVsc2UgYnV0dG9uUmVmcy5jdXJyZW50LmRlbGV0ZShrKTtcbiAgfSwgW10pO1xuXG4gIHJldHVybiAoXG4gICAgPHRhYmxlIGFyaWEtbGFiZWxsZWRieT17bGFiZWxsZWRCeUlkfSByb2xlPVwiZ3JpZFwiIHdpZHRoPVwiMTAwJVwiPlxuICAgICAgPHRoZWFkPlxuICAgICAgICA8dHI+XG4gICAgICAgICAge3dlZWtkYXlMYWJlbHMubWFwKChsYWJlbCwgaSkgPT4gKFxuICAgICAgICAgICAgPHRoIGFiYnI9e3dlZWtkYXlGdWxsTmFtZXNbaV19IGtleT17bGFiZWx9IHNjb3BlPVwiY29sXCI+XG4gICAgICAgICAgICAgIHtsYWJlbH1cbiAgICAgICAgICAgIDwvdGg+XG4gICAgICAgICAgKSl9XG4gICAgICAgIDwvdHI+XG4gICAgICA8L3RoZWFkPlxuICAgICAgPHRib2R5PlxuICAgICAgICB7d2Vla3MubWFwKCh3ZWVrLCByb3dJbmRleCkgPT4gKFxuICAgICAgICAgIDx0ciBrZXk9e3dlZWsuam9pbignLScpfT5cbiAgICAgICAgICAgIHt3ZWVrLm1hcCgoZGF0ZSwgY29sSW5kZXgpID0+IHtcbiAgICAgICAgICAgICAgaWYgKGRhdGUgPT09IG51bGwpIHtcbiAgICAgICAgICAgICAgICByZXR1cm4gKFxuICAgICAgICAgICAgICAgICAgLy8gZml4IHRoaXMgZXJyb3JcbiAgICAgICAgICAgICAgICAgIC8vIGVzbGludC1kaXNhYmxlLW5leHQtbGluZSByZWFjdC9uby1hcnJheS1pbmRleC1rZXksIGpzeC1hMTF5L2NvbnRyb2wtaGFzLWFzc29jaWF0ZWQtbGFiZWxcbiAgICAgICAgICAgICAgICAgIDx0ZCBrZXk9e2BlbXB0eS0ke3Jvd0luZGV4fS0ke2NvbEluZGV4fWB9IHJvbGU9XCJncmlkY2VsbFwiIC8+XG4gICAgICAgICAgICAgICAgKTtcbiAgICAgICAgICAgICAgfVxuICAgICAgICAgICAgICBjb25zdCBzZWxlY3RlZCA9XG4gICAgICAgICAgICAgICAgaXNTYW1lRGF5KGRhdGUsIHNlbGVjdGVkRGF0ZSkgfHwgaXNTYW1lRGF5KGRhdGUsIGVuZERhdGUpO1xuICAgICAgICAgICAgICBjb25zdCBpblJhbmdlID1cbiAgICAgICAgICAgICAgICAoc2VsZWN0ZWREYXRlICE9PSBudWxsIHx8IGVuZERhdGUgIT09IG51bGwpICYmXG4gICAgICAgICAgICAgICAgaXNEYXRlSW5SYW5nZShkYXRlLCBzZWxlY3RlZERhdGUsIGVuZERhdGUpO1xuICAgICAgICAgICAgICBjb25zdCBkaXNhYmxlZCA9IGlzRGF0ZURpc2FibGVkKGRhdGUsIGRpc2FibGVkRGF0ZXMpO1xuICAgICAgICAgICAgICBjb25zdCB0b2RheSA9IGlzVG9kYXkoZGF0ZSk7XG4gICAgICAgICAgICAgIGNvbnN0IGlzRm9jdXNlZCA9XG4gICAgICAgICAgICAgICAgZm9jdXNUYXJnZXQgIT09IG51bGwgJiYgaXNTYW1lRGF5KGRhdGUsIGZvY3VzVGFyZ2V0KTtcblxuICAgICAgICAgICAgICByZXR1cm4gKFxuICAgICAgICAgICAgICAgIDx0ZFxuICAgICAgICAgICAgICAgICAgYXJpYS1zZWxlY3RlZD17c2VsZWN0ZWR9XG4gICAgICAgICAgICAgICAgICBrZXk9e2RhdGUuZ2V0VGltZSgpfVxuICAgICAgICAgICAgICAgICAgcm9sZT1cImdyaWRjZWxsXCJcbiAgICAgICAgICAgICAgICA+XG4gICAgICAgICAgICAgICAgICA8RGF0ZUJ1dHRvblxuICAgICAgICAgICAgICAgICAgICBkaXNhYmxlZD17ZGlzYWJsZWR9XG4gICAgICAgICAgICAgICAgICAgIGlzSW5SYW5nZT17aW5SYW5nZX1cbiAgICAgICAgICAgICAgICAgICAgaXNTZWxlY3RlZD17c2VsZWN0ZWR9XG4gICAgICAgICAgICAgICAgICAgIGlzVG9kYXk9e3RvZGF5fVxuICAgICAgICAgICAgICAgICAgICByZWY9eyhlbCkgPT4gc2V0QnV0dG9uUmVmKGRhdGUsIGVsIGFzIEhUTUxFbGVtZW50IHwgbnVsbCl9XG4gICAgICAgICAgICAgICAgICAgIHRhYkluZGV4PXtpc0ZvY3VzZWQgPyAwIDogLTF9XG4gICAgICAgICAgICAgICAgICAgIHZhcmlhbnQ9XCJzZWNvbmRhcnlcIlxuICAgICAgICAgICAgICAgICAgICB3aWR0aD1cIjM2cHhcIlxuICAgICAgICAgICAgICAgICAgICBvbkNsaWNrPXsoKSA9PiBvbkRhdGVTZWxlY3QoZGF0ZSl9XG4gICAgICAgICAgICAgICAgICAgIG9uRm9jdXM9eygpID0+IG9uRm9jdXNlZERhdGVDaGFuZ2U/LihkYXRlKX1cbiAgICAgICAgICAgICAgICAgICAgb25LZXlEb3duPXsoZTogUmVhY3QuS2V5Ym9hcmRFdmVudCkgPT5cbiAgICAgICAgICAgICAgICAgICAgICBoYW5kbGVLZXlEb3duKGUsIGRhdGUpXG4gICAgICAgICAgICAgICAgICAgIH1cbiAgICAgICAgICAgICAgICAgID5cbiAgICAgICAgICAgICAgICAgICAge2RhdGUuZ2V0RGF0ZSgpfVxuICAgICAgICAgICAgICAgICAgPC9EYXRlQnV0dG9uPlxuICAgICAgICAgICAgICAgIDwvdGQ+XG4gICAgICAgICAgICAgICk7XG4gICAgICAgICAgICB9KX1cbiAgICAgICAgICA8L3RyPlxuICAgICAgICApKX1cbiAgICAgIDwvdGJvZHk+XG4gICAgPC90YWJsZT5cbiAgKTtcbn07XG4iXX0= */");
+
+/** Flat list of dates in grid order (row-major, non-null only) with row index for Home/End */
+function getDatesWithRow(weeks) {
+  const result = [];
+  weeks.forEach((week, rowIndex) => {
+    week.forEach(date => {
+      if (date !== null) result.push({
+        date,
+        rowIndex
+      });
+    });
+  });
+  return result;
+}
+export const CalendarBody = ({
+  visibleDate,
+  selectedDate,
+  endDate = null,
+  disabledDates = [],
+  onDateSelect,
+  locale,
+  weekStartsOn = 0,
+  labelledById,
+  focusedDate,
+  onFocusedDateChange,
+  onVisibleDateChange,
+  onEscapeKeyPress
+}) => {
+  const year = visibleDate.getFullYear();
+  const month = visibleDate.getMonth();
+  const weeks = getMonthGrid(year, month, weekStartsOn);
+  const weekdayLabels = getWeekdayLabels(locale, weekStartsOn);
+  const weekdayFullNames = getWeekdayFullNames(locale, weekStartsOn);
+  const buttonRefs = useRef(new Map());
+  const datesWithRow = useMemo(() => getDatesWithRow(weeks), [weeks]);
+  const focusTarget = focusedDate ?? selectedDate;
+  const isToday = useCallback(d => d !== null && isSameDay(d, new Date()), []);
+  const focusButton = useCallback(date => {
+    if (date === null) return;
+    const key = new Date(date.getFullYear(), date.getMonth(), date.getDate()).getTime();
+    buttonRefs.current.get(key)?.focus();
+  }, []);
+  useEffect(() => {
+    if (focusTarget !== null) focusButton(focusTarget);
+  }, [focusTarget, focusButton]);
+  const handleKeyDown = useCallback((e, date) => {
+    if (!onFocusedDateChange) return;
+    const key = date.getTime();
+    const idx = datesWithRow.findIndex(({
+      date: d
+    }) => d.getTime() === key);
+    if (idx < 0) return;
+    const currentRow = datesWithRow[idx].rowIndex;
+    const day = date.getDate();
+    let newDate = null;
+    let newVisibleDate = null;
+    switch (e.key) {
+      case 'ArrowLeft':
+        e.preventDefault();
+        if (idx > 0) {
+          newDate = datesWithRow[idx - 1].date;
+        } else {
+          const lastDayPrevMonth = new Date(year, month, 0);
+          newDate = lastDayPrevMonth;
+          newVisibleDate = new Date(year, month - 1, 1);
+        }
+        break;
+      case 'ArrowRight':
+        e.preventDefault();
+        if (idx < datesWithRow.length - 1) {
+          newDate = datesWithRow[idx + 1].date;
+        } else {
+          newDate = new Date(year, month + 1, 1);
+          newVisibleDate = new Date(year, month + 1, 1);
+        }
+        break;
+      case 'ArrowUp':
+        e.preventDefault();
+        newDate = new Date(date);
+        newDate.setDate(newDate.getDate() - 7);
+        if (newDate.getMonth() !== month || newDate.getFullYear() !== year) {
+          newVisibleDate = new Date(newDate.getFullYear(), newDate.getMonth(), 1);
+        }
+        break;
+      case 'ArrowDown':
+        e.preventDefault();
+        newDate = new Date(date);
+        newDate.setDate(newDate.getDate() + 7);
+        if (newDate.getMonth() !== month || newDate.getFullYear() !== year) {
+          newVisibleDate = new Date(newDate.getFullYear(), newDate.getMonth(), 1);
+        }
+        break;
+      case 'Home':
+        e.preventDefault();
+        newDate = datesWithRow.find(({
+          rowIndex
+        }) => rowIndex === currentRow)?.date ?? date;
+        break;
+      case 'End':
+        e.preventDefault();
+        newDate = [...datesWithRow].reverse().find(({
+          rowIndex
+        }) => rowIndex === currentRow)?.date ?? date;
+        break;
+      case 'PageDown':
+        e.preventDefault();
+        if (e.shiftKey) {
+          newDate = clampToMonth(year + 1, month, day);
+        } else {
+          newDate = clampToMonth(year, month + 1, day);
+        }
+        newVisibleDate = new Date(newDate.getFullYear(), newDate.getMonth(), 1);
+        break;
+      case 'PageUp':
+        e.preventDefault();
+        if (e.shiftKey) {
+          newDate = clampToMonth(year - 1, month, day);
+        } else {
+          newDate = clampToMonth(year, month - 1, day);
+        }
+        newVisibleDate = new Date(newDate.getFullYear(), newDate.getMonth(), 1);
+        break;
+      case 'Enter':
+      case ' ':
+        e.preventDefault();
+        if (!isDateDisabled(date, disabledDates)) onDateSelect(date);
+        return;
+      case 'Escape':
+        e.preventDefault();
+        onEscapeKeyPress?.();
+        return;
+      default:
+        return;
+    }
+    if (newDate !== null) {
+      onFocusedDateChange(newDate);
+      if (newVisibleDate !== null) onVisibleDateChange?.(newVisibleDate);
+    }
+  }, [onFocusedDateChange, datesWithRow, month, year, disabledDates, onDateSelect, onEscapeKeyPress, onVisibleDateChange]);
+  const setButtonRef = useCallback((date, el) => {
+    const k = new Date(date.getFullYear(), date.getMonth(), date.getDate()).getTime();
+    if (el) buttonRefs.current.set(k, el);else buttonRefs.current.delete(k);
+  }, []);
+  return /*#__PURE__*/_jsxs("table", {
+    "aria-labelledby": labelledById,
+    role: "grid",
+    width: "100%",
+    children: [/*#__PURE__*/_jsx("thead", {
+      children: /*#__PURE__*/_jsx("tr", {
+        children: weekdayLabels.map((label, i) => /*#__PURE__*/_jsx("th", {
+          abbr: weekdayFullNames[i],
+          scope: "col",
+          children: label
+        }, label))
+      })
+    }), /*#__PURE__*/_jsx("tbody", {
+      children: weeks.map((week, rowIndex) => /*#__PURE__*/_jsx("tr", {
+        children: week.map((date, colIndex) => {
+          if (date === null) {
+            return (
+              /*#__PURE__*/
+              // fix this error
+              // eslint-disable-next-line react/no-array-index-key, jsx-a11y/control-has-associated-label
+              _jsx("td", {
+                role: "gridcell"
+              }, `empty-${rowIndex}-${colIndex}`)
+            );
+          }
+          const selected = isSameDay(date, selectedDate) || isSameDay(date, endDate);
+          const inRange = (selectedDate !== null || endDate !== null) && isDateInRange(date, selectedDate, endDate);
+          const disabled = isDateDisabled(date, disabledDates);
+          const today = isToday(date);
+          const isFocused = focusTarget !== null && isSameDay(date, focusTarget);
+          return /*#__PURE__*/_jsx("td", {
+            "aria-selected": selected,
+            role: "gridcell",
+            children: /*#__PURE__*/_jsx(DateButton, {
+              disabled: disabled,
+              isInRange: inRange,
+              isSelected: selected,
+              isToday: today,
+              ref: el => setButtonRef(date, el),
+              tabIndex: isFocused ? 0 : -1,
+              variant: "secondary",
+              width: "36px",
+              onClick: () => onDateSelect(date),
+              onFocus: () => onFocusedDateChange?.(date),
+              onKeyDown: e => handleKeyDown(e, date),
+              children: date.getDate()
+            })
+          }, date.getTime());
+        })
+      }, week.join('-')))
+    })]
+  });
+};

package/dist/DatePicker/Calendar/CalendarFooter.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+import { CalendarFooterProps } from './types';
+export declare const CalendarFooter: React.FC<CalendarFooterProps>;

package/dist/DatePicker/Calendar/CalendarFooter.js

@@ -0,0 +1,60 @@
+import * as React from 'react';
+import { FlexBox } from '../../Box';
+import { TextButton } from '../../Button';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+// function formatQuickActionLabel(action: QuickAction): string {
+//   const { num, timePeriod } = action;
+//   const period =
+//     timePeriod === 'day'
+//       ? num === 1
+//         ? 'day'
+//         : 'days'
+//       : timePeriod === 'week'
+//       ? num === 1
+//         ? 'week'
+//         : 'weeks'
+//       : timePeriod === 'month'
+//       ? num === 1
+//         ? 'month'
+//         : 'months'
+//       : num === 1
+//       ? 'year'
+//       : 'years';
+//   return `${num} ${period}`;
+// }
+
+export const CalendarFooter = ({
+  onClearDate,
+  onTodayClick,
+  onSelectedDateChange,
+  onCurrentMonthYearChange
+}) => {
+  const handleClearDate = () => {
+    onSelectedDateChange(null);
+    onClearDate?.();
+  };
+  const handleTodayClick = () => {
+    const today = new Date();
+    onSelectedDateChange(today);
+    onCurrentMonthYearChange(new Date(today.getFullYear(), today.getMonth(), 1));
+    onTodayClick?.();
+  };
+  // const actions = quickActions.slice(0, 3);
+
+  return /*#__PURE__*/_jsxs(FlexBox, {
+    alignItems: "center",
+    borderTop: 1,
+    justifyContent: "space-between",
+    py: 12,
+    children: [/*#__PURE__*/_jsx(TextButton, {
+      onClick: handleClearDate,
+      children: "Clear"
+    }), /*#__PURE__*/_jsx(FlexBox, {
+      gap: 32,
+      children: /*#__PURE__*/_jsx(TextButton, {
+        onClick: handleTodayClick,
+        children: "Today"
+      })
+    })]
+  });
+};

package/dist/DatePicker/Calendar/CalendarHeader.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+import { CalendarHeaderProps } from './types';
+export declare const CalendarHeader: React.FC<CalendarHeaderProps>;

package/dist/DatePicker/Calendar/CalendarHeader.js

@@ -0,0 +1,51 @@
+import { MiniChevronLeftIcon, MiniChevronRightIcon } from '@codecademy/gamut-icons';
+import * as React from 'react';
+import { FlexBox } from '../../Box';
+import { IconButton } from '../../Button';
+import { Text } from '../../Typography';
+import { formatMonthYear } from './utils/format';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export const CalendarHeader = ({
+  currentMonthYear,
+  onCurrentMonthYearChange,
+  onPreviousMonthClick,
+  onNextMonthClick,
+  locale,
+  headingId
+}) => {
+  const monthYear = formatMonthYear(currentMonthYear, locale);
+  const handlePreviousMonth = () => {
+    const previousMonth = new Date(currentMonthYear.getFullYear(), currentMonthYear.getMonth() - 1, 1);
+    onCurrentMonthYearChange?.(previousMonth);
+    onPreviousMonthClick?.();
+  };
+  const handleNextMonth = () => {
+    const nextMonth = new Date(currentMonthYear.getFullYear(), currentMonthYear.getMonth() + 1, 1);
+    onCurrentMonthYearChange?.(nextMonth);
+    onNextMonthClick?.();
+  };
+  return /*#__PURE__*/_jsxs(FlexBox, {
+    alignItems: "center",
+    justifyContent: "space-between",
+    pb: 16,
+    children: [/*#__PURE__*/_jsx(IconButton, {
+      "aria-label": "Previous month",
+      icon: MiniChevronLeftIcon,
+      size: "small",
+      tip: "Previous month",
+      onClick: handlePreviousMonth
+    }), /*#__PURE__*/_jsx(Text, {
+      "aria-live": "polite",
+      as: "h2",
+      id: headingId,
+      variant: "title-sm",
+      children: monthYear
+    }), /*#__PURE__*/_jsx(IconButton, {
+      "aria-label": "Next month",
+      icon: MiniChevronRightIcon,
+      size: "small",
+      tip: "Next month",
+      onClick: handleNextMonth
+    })]
+  });
+};

package/dist/DatePicker/Calendar/index.d.ts

@@ -0,0 +1,6 @@
+export { Calendar } from './Calendar';
+export { CalendarHeader } from './CalendarHeader';
+export { CalendarBody } from './CalendarBody';
+export { CalendarFooter } from './CalendarFooter';
+export type { CalendarHeaderProps, CalendarBodyProps, CalendarFooterProps, QuickAction, } from './types';
+export * from './utils';

package/dist/DatePicker/Calendar/index.js

@@ -0,0 +1,5 @@
+export { Calendar } from './Calendar';
+export { CalendarHeader } from './CalendarHeader';
+export { CalendarBody } from './CalendarBody';
+export { CalendarFooter } from './CalendarFooter';
+export * from './utils';

package/dist/DatePicker/Calendar/types.d.ts

@@ -0,0 +1,57 @@
+/**
+ * Internal types for the Calendar subcomponents (used by DatePickerCalendar).
+ */
+export interface CalendarHeaderProps {
+    /** Currently displayed month and year (used for heading and prev/next range) */
+    currentMonthYear: Date;
+    /** Called when the user navigates to a different month. Pass the new date (e.g. setVisibleDate) so the calendar updates. */
+    onCurrentMonthYearChange: (newDate: Date) => void;
+    /** Optional. Called after navigating to previous month; use for click tracking. */
+    onPreviousMonthClick?: () => void;
+    /** Optional. Called after navigating to next month; use for click tracking. */
+    onNextMonthClick?: () => void;
+    /** Locale for month/year formatting (e.g. 'en-US') */
+    locale?: string;
+    /** Optional id for the heading (for grid aria-labelledby) */
+    headingId?: string;
+}
+export interface CalendarBodyProps {
+    /** The month to display (typically first day of that month) */
+    visibleDate: Date;
+    /** Selected start date (single or range start) */
+    selectedDate: Date | null;
+    /** Selected end date (range only; null for single-date mode) */
+    endDate?: Date | null;
+    /** Dates that should be disabled (unselectable) */
+    disabledDates?: Date[];
+    /** Called when a date cell is selected */
+    onDateSelect: (date: Date) => void;
+    /** Locale for weekday names and week start */
+    locale?: string;
+    /** 0 = Sunday, 1 = Monday (default from locale if not set) */
+    weekStartsOn?: 0 | 1;
+    /** Id of the month/year heading (aria-labelledby on grid) */
+    labelledById?: string;
+    /** For keyboard nav: which cell has focus (roving tabindex) */
+    focusedDate?: Date | null;
+    /** Callback when focused date changes (e.g. arrow keys) */
+    onFocusedDateChange?: (date: Date | null) => void;
+    /** Called when grid keyboard nav changes month (e.g. Page Up/Down). Pass setVisibleDate so the calendar updates. */
+    onVisibleDateChange?: (newDate: Date) => void;
+    /** Called when the escape key is pressed */
+    onEscapeKeyPress?: () => void;
+}
+export interface QuickAction {
+    num: number;
+    timePeriod: 'day' | 'week' | 'month' | 'year';
+    onClick: () => void;
+}
+export interface CalendarFooterProps {
+    onClearDate?: () => void;
+    onTodayClick?: () => void;
+    /** Called when the user navigates to a different month. Pass the new date (e.g. setVisibleDate) so the calendar updates. */
+    onSelectedDateChange: (newDate: Date | null) => void;
+    onCurrentMonthYearChange: (newDate: Date) => void;
+    /** Max 3 quick actions (e.g. "7 days", "1 month") */
+    quickActions?: QuickAction[];
+}

package/dist/DatePicker/Calendar/types.js

@@ -0,0 +1 @@
+export {};

package/dist/DatePicker/Calendar/utils/dateGrid.d.ts

@@ -0,0 +1,34 @@
+/**
+ * Builds a grid of days for a calendar month using native Date and Intl.
+ * Each row has 7 cells; leading/trailing cells may be null (padding from adjacent months).
+ */
+/**
+ * Get the weekday for a date (0 = Sunday, 6 = Saturday).
+ * Optionally use weekStartsOn to compute "offset" for display (e.g. Monday = 0).
+ */
+export declare function getDayOfWeek(date: Date, weekStartsOn?: 0 | 1): number;
+/**
+ * Returns an array of weeks for the given month. Each week is an array of 7 items:
+ * each item is either a Date (that day) or null (padding from previous/next month).
+ *
+ * @param year - Full year (e.g. 2026)
+ * @param month - Month 0-11 (0 = January)
+ * @param weekStartsOn - 0 = Sunday, 1 = Monday
+ */
+export declare function getMonthGrid(year: number, month: number, weekStartsOn?: 0 | 1): (Date | null)[][];
+/**
+ * Check if two dates are the same calendar day (ignoring time).
+ */
+export declare function isSameDay(a: Date | null, b: Date | null): boolean;
+/**
+ * Check if `date` is between `start` and `end` (inclusive), ignoring time.
+ */
+export declare function isDateInRange(date: Date, start: Date | null, end: Date | null): boolean;
+/**
+ * Check if `date` is in the `disabledDates` list (by calendar day).
+ */
+export declare function isDateDisabled(date: Date, disabledDates?: Date[]): boolean;
+/**
+ * Clamp a day to the last day of the given month (e.g. Jan 31 -> Feb 28).
+ */
+export declare function clampToMonth(year: number, month: number, day: number): Date;

package/dist/DatePicker/Calendar/utils/dateGrid.js

@@ -0,0 +1,101 @@
+/**
+ * Builds a grid of days for a calendar month using native Date and Intl.
+ * Each row has 7 cells; leading/trailing cells may be null (padding from adjacent months).
+ */
+
+const DAYS_PER_WEEK = 7;
+
+/**
+ * Normalize to start of day in local time for comparison.
+ */
+function toDateOnly(d) {
+  return new Date(d.getFullYear(), d.getMonth(), d.getDate());
+}
+
+/**
+ * Get the weekday for a date (0 = Sunday, 6 = Saturday).
+ * Optionally use weekStartsOn to compute "offset" for display (e.g. Monday = 0).
+ */
+export function getDayOfWeek(date, weekStartsOn = 0) {
+  const sundayBased = date.getDay();
+  if (weekStartsOn === 0) return sundayBased;
+  return (sundayBased + 6) % 7; // Monday = 0
+}
+
+/**
+ * Returns an array of weeks for the given month. Each week is an array of 7 items:
+ * each item is either a Date (that day) or null (padding from previous/next month).
+ *
+ * @param year - Full year (e.g. 2026)
+ * @param month - Month 0-11 (0 = January)
+ * @param weekStartsOn - 0 = Sunday, 1 = Monday
+ */
+export function getMonthGrid(year, month, weekStartsOn = 0) {
+  const first = new Date(year, month, 1);
+  const last = new Date(year, month + 1, 0);
+  const firstDayOfWeek = getDayOfWeek(first, weekStartsOn);
+  const daysInMonth = last.getDate();
+  const weeks = [];
+  let currentWeek = [];
+
+  // Pad start of first week with nulls
+  // eslint-disable-next-line no-plusplus
+  for (let i = 0; i < firstDayOfWeek; i++) {
+    currentWeek.push(null);
+  }
+
+  // fix these
+  // eslint-disable-next-line no-plusplus
+  for (let day = 1; day <= daysInMonth; day++) {
+    currentWeek.push(new Date(year, month, day));
+    if (currentWeek.length === DAYS_PER_WEEK) {
+      weeks.push(currentWeek);
+      currentWeek = [];
+    }
+  }
+
+  // Pad end of last week with nulls
+  if (currentWeek.length > 0) {
+    while (currentWeek.length < DAYS_PER_WEEK) {
+      currentWeek.push(null);
+    }
+    weeks.push(currentWeek);
+  }
+  return weeks;
+}
+
+/**
+ * Check if two dates are the same calendar day (ignoring time).
+ */
+export function isSameDay(a, b) {
+  if (a === null || b === null) return false;
+  return toDateOnly(a).getTime() === toDateOnly(b).getTime();
+}
+
+/**
+ * Check if `date` is between `start` and `end` (inclusive), ignoring time.
+ */
+export function isDateInRange(date, start, end) {
+  if (start === null) return false;
+  const d = toDateOnly(date).getTime();
+  const s = toDateOnly(start).getTime();
+  const e = end !== null ? toDateOnly(end).getTime() : s;
+  const low = Math.min(s, e);
+  const high = Math.max(s, e);
+  return d >= low && d <= high;
+}
+
+/**
+ * Check if `date` is in the `disabledDates` list (by calendar day).
+ */
+export function isDateDisabled(date, disabledDates = []) {
+  return disabledDates.some(d => isSameDay(date, d));
+}
+
+/**
+ * Clamp a day to the last day of the given month (e.g. Jan 31 -> Feb 28).
+ */
+export function clampToMonth(year, month, day) {
+  const last = new Date(year, month + 1, 0).getDate();
+  return new Date(year, month, Math.min(day, last));
+}

package/dist/DatePicker/Calendar/utils/format.d.ts

@@ -0,0 +1,39 @@
+/**
+ * Date formatting for the calendar using Intl.DateTimeFormat.
+ */
+/**
+ * Format month and year for the calendar header (e.g. "February 2026").
+ */
+export declare function formatMonthYear(date: Date, locale?: string): string;
+/**
+ * Get short weekday labels for column headers (e.g. ["Su", "Mo", ...]).
+ * Order depends on weekStartsOn: 0 = Sunday first, 1 = Monday first.
+ */
+export declare function getWeekdayLabels(locale?: string, weekStartsOn?: 0 | 1): string[];
+/**
+ * Get full weekday names for abbr attributes (e.g. "Sunday", "Monday").
+ * Same order as getWeekdayLabels.
+ */
+export declare function getWeekdayFullNames(locale?: string, weekStartsOn?: 0 | 1): string[];
+/**
+ * Format a date for display in the date picker input (e.g. "2/15/2026").
+ */
+export declare function formatDateForInput(date: Date, locale?: string): string;
+/**
+ * Parse a string from the date input into a Date, or null if invalid.
+ * Only returns a date when the input is a complete valid date (e.g. "2/15/2026").
+ * Partial input like "1" or "2/15" returns null even though Date("1") would parse.
+ */
+export declare function parseDateFromInput(value: string, locale?: string): Date | null;
+/**
+ * Format a date range for the input (e.g. "2/15/2026 – 2/20/2026").
+ */
+export declare function formatDateRangeForInput(startDate: Date | null, endDate: Date | null, locale?: string): string;
+/**
+ * Parse a range string (e.g. "2/15/2026 – 2/20/2026") into { startDate, endDate }.
+ * Returns null if invalid. Single date is allowed and yields startDate = endDate.
+ */
+export declare function parseDateRangeFromInput(value: string, locale?: string): {
+    startDate: Date;
+    endDate: Date;
+} | null;