react-day-picker 8.10.1 → 9.0.0-beta.1

package/README.md

@@ -1,65 +1,53 @@
 # React DayPicker
 
-[DayPicker](http://react-day-picker.js.org) is a date picker component for [React](https://reactjs.org). Renders a monthly calendar to select days. DayPicker is customizable, works great with input fields and can be styled to match any design.
+DayPicker is a [React](https://react.dev) component to create date pickers, calendars, and date inputs for web applications.
 
-➡️ **[react-day-picker.js.org](http://react-day-picker.js.org)** for guides, examples and API reference.
+📖 See **[daypicker.dev](http://daypicker.dev)** for guides, examples and API reference.
 
-<picture>
-  <source media="(prefers-color-scheme: dark)" srcSet="https://user-images.githubusercontent.com/120693/188241991-19d0e8a1-230a-48c8-8477-3c90d4e36197.png"/>
-  <source media="(prefers-color-scheme: light)" srcSet="https://user-images.githubusercontent.com/120693/188238076-311ec6d1-503d-4c21-8ffe-d89faa60e40f.png"/>
-  <img alt="Shows a screenshot of the React DayPicker component in a browser’s window." width="900" />
-</picture>
+## Features
 
-## Main features
+- Minimal design for easy customization.
+- Extensive props for configuring the calendar.
+- Supports selection of a single day, multiple days, ranges, or custom selections.
+- Can be localized in any language.
+- Complies with WCAG 2.1 AA requirements for accessibility.
+- Includes customizable internal components for complex use cases.
 
-- ☀️ Select days, ranges or whatever
-- 🧘‍♀️ using [date-fns](http://date-fns.org) as date library
-- 🌎 Localizable into any language
-- ➡️ Keyboard navigation
-- ♿️ [WAI-ARIA](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA) support
-- 🤖 Written in TypeScript
-- 🎨 Easy to style and customize
-- 🗓 Support multiple calendars
-- 📄 Easy to integrate input fields
+DayPicker is written in TypeScript and compiled to CommonJS and ESM. It requires [date-fns](https://date-fns.org) as a peer dependency.
 
 ## Installation
 
-```shell
-npm install react-day-picker date-fns  # using npm
-pnpm install react-day-picker date-fns # using pnpm
-yarn add react-day-picker date-fns     # using yarn
+```bash
+npm install react-day-picker date-fns
 ```
 
 <a href="https://www.npmjs.com/package/react-day-picker"><img src="https://img.shields.io/npm/v/react-day-picker.svg?style=flat-square" alt="npm version"/></a> <img src="https://img.shields.io/npm/dm/react-day-picker.svg?style=flat-square" alt="npm downloads"/> <img src="https://img.shields.io/bundlephobia/minzip/react-day-picker" alt="Min gzipped size"/>
 
-## Example
+## Usage
 
 ```tsx
-import { useState } from 'react';
-import { format } from 'date-fns';
-
-import { DayPicker } from 'react-day-picker';
-import 'react-day-picker/dist/style.css';
-
-export default function Example() {
-  const [selected, setSelected] = useState<Date>();
-
-  let footer = <p>Please pick a day.</p>;
-  if (selected) {
-    footer = <p>You picked {format(selected, 'PP')}.</p>;
-  }
-  return (
-    <DayPicker
-      mode="single"
-      selected={selected}
-      onSelect={setSelected}
-      footer={footer}
-    />
-  );
+import { DayPicker } from "react-day-picker";
+import "react-day-picker/dist/style.css";
+
+function MyDatePicker() {
+  const [selected, setSelected] = useState();
+  return <DayPicker mode="single" selected={selected} onSelect={setSelected} />;
 }
 ```
 
-## Documentation
+## License
+
+DayPicker is released under the [MIT License](./license).
+
+## Community
+
+Ask for help and share your experience with DayPicker.
+
+- [Discuss the project on GitHub](https://github.com/gpbl/react-day-picker/discussions)
+- [Report an issue on GitHub](https://github.com/gpbl/react-day-picker/issues/new/choose)
+
+## Funding
+
+Consider supporting DayPicker's maintainer with a donation. Your support helps to keep the project alive and keep it updated.
 
-See **[react-day-picker.js.org](http://react-day-picker.js.org)** for guides, examples and API reference of the latest version.
-<small>Docs for version 7 are at <a href="https://react-day-picker-v7.netlify.app" target="_blank">react-day-picker-v7.netlify.app</a>.</small>
+- [Sponsor DayPicker on GitHub](https://github.com/sponsors/gpbl)

package/dist/cjs/DayPicker.d.ts

@@ -0,0 +1,12 @@
+import type { DayPickerProps, Mode } from "./types";
+/**
+ * DayPicker is a React component to create date pickers, calendars, and date
+ * inputs for web applications. Use the `components` prop to swap this component
+ * with a custom one.
+ *
+ * Use the `components` prop to swap this component with a custom one.
+ *
+ * @group Components
+ * @see http://daypicker.dev
+ */
+export declare function DayPicker<T extends Mode = "default">(props: DayPickerProps<T>): import("react/jsx-runtime").JSX.Element;

package/dist/cjs/DayPicker.js

@@ -0,0 +1,21 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DayPicker = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const Calendar_1 = require("./components/Calendar");
+const contexts_1 = require("./contexts");
+/**
+ * DayPicker is a React component to create date pickers, calendars, and date
+ * inputs for web applications. Use the `components` prop to swap this component
+ * with a custom one.
+ *
+ * Use the `components` prop to swap this component with a custom one.
+ *
+ * @group Components
+ * @see http://daypicker.dev
+ */
+function DayPicker(props) {
+    return ((0, jsx_runtime_1.jsx)(contexts_1.ContextProviders, { ...props, children: (0, jsx_runtime_1.jsx)(Calendar_1.Calendar, {}) }));
+}
+exports.DayPicker = DayPicker;
+//# sourceMappingURL=DayPicker.js.map

package/dist/cjs/DayPicker.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DayPicker.js","sourceRoot":"","sources":["../../src/DayPicker.tsx"],"names":[],"mappings":";;;;AAAA,oDAAiD;AACjD,yCAA8C;AAG9C;;;;;;;;;GASG;AACH,SAAgB,SAAS,CACvB,KAAwB;IAExB,OAAO,CACL,uBAAC,2BAAgB,OAAK,KAAK,YACzB,uBAAC,mBAAQ,KAAG,GACK,CACpB,CAAC;AACJ,CAAC;AARD,8BAQC"}

package/dist/cjs/UI.d.ts

@@ -0,0 +1,83 @@
+/**
+ * The UI elements composing DayPicker.
+ *
+ * These elements are mapped to the components directory.
+ */
+export declare enum UI {
+    /** The previous button in the navigation. */
+    ButtonPrevious = "button_previous",
+    /** The next button the navigation */
+    ButtonNext = "button_next",
+    /** The calendar element, the root of the component. */
+    Calendar = "calendar",
+    /** The gridcell with the day's date. */
+    Day = "day",
+    /** The label of a caption. */
+    CaptionLabel = "caption_label",
+    /** The Chevron SVG element used by navigation buttons and dropdowns. */
+    Chevron = "chevron",
+    /** The container of the dropdown navigation.. */
+    DropdownNav = "dropdown_nav",
+    /** The dropdown used for years and months. */
+    Dropdown = "dropdown",
+    /** The root element of the {@link Dropdown} component. */
+    DropdownRoot = "dropdown_root",
+    /** The root element of the {@link Footer} component. */
+    Footer = "footer",
+    /** The caption of a month. */
+    MonthCaption = "month_caption",
+    /** The dropdown of months. */
+    MonthsDropdown = "months_dropdown",
+    /** Wrapper of the month grid. */
+    MonthWrapper = "month_wrapper",
+    /** The month grid. */
+    Month = "month",
+    /** The group of weeks in a month. */
+    Weeks = "weeks",
+    /** Container containing the months. */
+    Months = "months",
+    /** The navigation element. */
+    Nav = "nav",
+    /** The row in a week. */
+    Week = "week",
+    /** The column's header with the weekday. */
+    Weekday = "weekday",
+    /** The row grouping the weekdays. */
+    Weekdays = "weekdays",
+    /** The row header in a week number. */
+    WeekNumber = "week_number",
+    /** The dropdown of years. */
+    YearsDropdown = "years_dropdown"
+}
+/** The modifiers for the {@link UI.Day}. */
+export declare enum DayModifier {
+    /** The day is disabled */
+    disabled = "disabled",
+    /** The day is hidden */
+    hidden = "hidden",
+    /** The day is outside the current month */
+    outside = "outside",
+    /** The day is at the end of a selected range. */
+    range_end = "range_end",
+    /** The day is at the middle of a selected range. */
+    range_middle = "range_middle",
+    /** The day is at the start of a selected range. */
+    range_start = "range_start",
+    /** The day is selected. */
+    selected = "selected",
+    /** The day is focusable. */
+    focusable = "focusable",
+    /** The day is focused. */
+    focused = "focused",
+    /** The day is today. */
+    today = "today"
+}
+/** Flags that can be applied to the {@link UI.Calendar} element. */
+export declare enum CalendarFlag {
+    /** Assigned when the week numbers are show. */
+    hasWeekNumbers = "week_numbers",
+    /** Assigned when the weekdays are hidden. */
+    noWeekdays = "no_weekdays",
+    /** Assigned when the calendar has multiple months. */
+    hasMultipleMonths = "multiple_months"
+}

package/dist/cjs/UI.js

@@ -0,0 +1,90 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CalendarFlag = exports.DayModifier = exports.UI = void 0;
+/**
+ * The UI elements composing DayPicker.
+ *
+ * These elements are mapped to the components directory.
+ */
+var UI;
+(function (UI) {
+    /** The previous button in the navigation. */
+    UI["ButtonPrevious"] = "button_previous";
+    /** The next button the navigation */
+    UI["ButtonNext"] = "button_next";
+    /** The calendar element, the root of the component. */
+    UI["Calendar"] = "calendar";
+    /** The gridcell with the day's date. */
+    UI["Day"] = "day";
+    /** The label of a caption. */
+    UI["CaptionLabel"] = "caption_label";
+    /** The Chevron SVG element used by navigation buttons and dropdowns. */
+    UI["Chevron"] = "chevron";
+    /** The container of the dropdown navigation.. */
+    UI["DropdownNav"] = "dropdown_nav";
+    /** The dropdown used for years and months. */
+    UI["Dropdown"] = "dropdown";
+    /** The root element of the {@link Dropdown} component. */
+    UI["DropdownRoot"] = "dropdown_root";
+    /** The root element of the {@link Footer} component. */
+    UI["Footer"] = "footer";
+    /** The caption of a month. */
+    UI["MonthCaption"] = "month_caption";
+    /** The dropdown of months. */
+    UI["MonthsDropdown"] = "months_dropdown";
+    /** Wrapper of the month grid. */
+    UI["MonthWrapper"] = "month_wrapper";
+    /** The month grid. */
+    UI["Month"] = "month";
+    /** The group of weeks in a month. */
+    UI["Weeks"] = "weeks";
+    /** Container containing the months. */
+    UI["Months"] = "months";
+    /** The navigation element. */
+    UI["Nav"] = "nav";
+    /** The row in a week. */
+    UI["Week"] = "week";
+    /** The column's header with the weekday. */
+    UI["Weekday"] = "weekday";
+    /** The row grouping the weekdays. */
+    UI["Weekdays"] = "weekdays";
+    /** The row header in a week number. */
+    UI["WeekNumber"] = "week_number";
+    /** The dropdown of years. */
+    UI["YearsDropdown"] = "years_dropdown";
+})(UI || (exports.UI = UI = {}));
+/** The modifiers for the {@link UI.Day}. */
+var DayModifier;
+(function (DayModifier) {
+    /** The day is disabled */
+    DayModifier["disabled"] = "disabled";
+    /** The day is hidden */
+    DayModifier["hidden"] = "hidden";
+    /** The day is outside the current month */
+    DayModifier["outside"] = "outside";
+    /** The day is at the end of a selected range. */
+    DayModifier["range_end"] = "range_end";
+    /** The day is at the middle of a selected range. */
+    DayModifier["range_middle"] = "range_middle";
+    /** The day is at the start of a selected range. */
+    DayModifier["range_start"] = "range_start";
+    /** The day is selected. */
+    DayModifier["selected"] = "selected";
+    /** The day is focusable. */
+    DayModifier["focusable"] = "focusable";
+    /** The day is focused. */
+    DayModifier["focused"] = "focused";
+    /** The day is today. */
+    DayModifier["today"] = "today";
+})(DayModifier || (exports.DayModifier = DayModifier = {}));
+/** Flags that can be applied to the {@link UI.Calendar} element. */
+var CalendarFlag;
+(function (CalendarFlag) {
+    /** Assigned when the week numbers are show. */
+    CalendarFlag["hasWeekNumbers"] = "week_numbers";
+    /** Assigned when the weekdays are hidden. */
+    CalendarFlag["noWeekdays"] = "no_weekdays";
+    /** Assigned when the calendar has multiple months. */
+    CalendarFlag["hasMultipleMonths"] = "multiple_months";
+})(CalendarFlag || (exports.CalendarFlag = CalendarFlag = {}));
+//# sourceMappingURL=UI.js.map

package/dist/cjs/UI.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"UI.js","sourceRoot":"","sources":["../../src/UI.ts"],"names":[],"mappings":";;;AAAA;;;;GAIG;AACH,IAAY,EA6CX;AA7CD,WAAY,EAAE;IACZ,6CAA6C;IAC7C,wCAAkC,CAAA;IAClC,qCAAqC;IACrC,gCAA0B,CAAA;IAC1B,uDAAuD;IACvD,2BAAqB,CAAA;IACrB,wCAAwC;IACxC,iBAAW,CAAA;IACX,8BAA8B;IAC9B,oCAA8B,CAAA;IAC9B,wEAAwE;IACxE,yBAAmB,CAAA;IACnB,iDAAiD;IACjD,kCAA4B,CAAA;IAC5B,8CAA8C;IAC9C,2BAAqB,CAAA;IACrB,0DAA0D;IAC1D,oCAA8B,CAAA;IAC9B,wDAAwD;IACxD,uBAAiB,CAAA;IACjB,8BAA8B;IAC9B,oCAA8B,CAAA;IAC9B,8BAA8B;IAC9B,wCAAkC,CAAA;IAClC,iCAAiC;IACjC,oCAA8B,CAAA;IAC9B,sBAAsB;IACtB,qBAAe,CAAA;IACf,qCAAqC;IACrC,qBAAe,CAAA;IACf,uCAAuC;IACvC,uBAAiB,CAAA;IACjB,8BAA8B;IAC9B,iBAAW,CAAA;IACX,yBAAyB;IACzB,mBAAa,CAAA;IACb,4CAA4C;IAC5C,yBAAmB,CAAA;IACnB,qCAAqC;IACrC,2BAAqB,CAAA;IACrB,uCAAuC;IACvC,gCAA0B,CAAA;IAC1B,6BAA6B;IAC7B,sCAAgC,CAAA;AAClC,CAAC,EA7CW,EAAE,kBAAF,EAAE,QA6Cb;AAED,4CAA4C;AAC5C,IAAY,WAqBX;AArBD,WAAY,WAAW;IACrB,0BAA0B;IAC1B,oCAAqB,CAAA;IACrB,wBAAwB;IACxB,gCAAiB,CAAA;IACjB,2CAA2C;IAC3C,kCAAmB,CAAA;IACnB,iDAAiD;IACjD,sCAAuB,CAAA;IACvB,oDAAoD;IACpD,4CAA6B,CAAA;IAC7B,mDAAmD;IACnD,0CAA2B,CAAA;IAC3B,2BAA2B;IAC3B,oCAAqB,CAAA;IACrB,4BAA4B;IAC5B,sCAAuB,CAAA;IACvB,0BAA0B;IAC1B,kCAAmB,CAAA;IACnB,wBAAwB;IACxB,8BAAe,CAAA;AACjB,CAAC,EArBW,WAAW,2BAAX,WAAW,QAqBtB;AAED,oEAAoE;AACpE,IAAY,YAOX;AAPD,WAAY,YAAY;IACtB,+CAA+C;IAC/C,+CAA+B,CAAA;IAC/B,6CAA6C;IAC7C,0CAA0B,CAAA;IAC1B,sDAAsD;IACtD,qDAAqC,CAAA;AACvC,CAAC,EAPW,YAAY,4BAAZ,YAAY,QAOvB"}

package/dist/cjs/classes/CalendarDay.d.ts

@@ -0,0 +1,15 @@
+/** Represent the day displayed in the Day grid cell. */
+export declare class CalendarDay {
+    constructor(date: Date, displayMonth: Date);
+    /** Whether the day is outside the display month. */
+    readonly outside: boolean;
+    /** The months where the day is displayed. */
+    readonly displayMonth: Date;
+    /** The date represented by this day. */
+    readonly date: Date;
+    /**
+     * Check if the day is the same as the given day: considering if it is in the
+     * same display month.
+     */
+    isEqualTo(day: CalendarDay): boolean;
+}

package/dist/cjs/classes/CalendarDay.js

@@ -0,0 +1,23 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CalendarDay = void 0;
+const isSameDay_1 = require("date-fns/isSameDay");
+const isSameMonth_1 = require("date-fns/isSameMonth");
+/** Represent the day displayed in the Day grid cell. */
+class CalendarDay {
+    constructor(date, displayMonth) {
+        this.date = date;
+        this.displayMonth = displayMonth;
+        this.outside = Boolean(displayMonth && !(0, isSameMonth_1.isSameMonth)(date, displayMonth));
+    }
+    /**
+     * Check if the day is the same as the given day: considering if it is in the
+     * same display month.
+     */
+    isEqualTo(day) {
+        return ((0, isSameDay_1.isSameDay)(day.date, this.date) &&
+            (0, isSameMonth_1.isSameMonth)(day.displayMonth, this.displayMonth));
+    }
+}
+exports.CalendarDay = CalendarDay;
+//# sourceMappingURL=CalendarDay.js.map

package/dist/cjs/classes/CalendarDay.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CalendarDay.js","sourceRoot":"","sources":["../../../src/classes/CalendarDay.ts"],"names":[],"mappings":";;;AAAA,kDAA+C;AAC/C,sDAAmD;AAEnD,wDAAwD;AACxD,MAAa,WAAW;IACtB,YAAY,IAAU,EAAE,YAAkB;QACxC,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;QACjB,IAAI,CAAC,YAAY,GAAG,YAAY,CAAC;QACjC,IAAI,CAAC,OAAO,GAAG,OAAO,CAAC,YAAY,IAAI,CAAC,IAAA,yBAAW,EAAC,IAAI,EAAE,YAAY,CAAC,CAAC,CAAC;IAC3E,CAAC;IAWD;;;OAGG;IACH,SAAS,CAAC,GAAgB;QACxB,OAAO,CACL,IAAA,qBAAS,EAAC,GAAG,CAAC,IAAI,EAAE,IAAI,CAAC,IAAI,CAAC;YAC9B,IAAA,yBAAW,EAAC,GAAG,CAAC,YAAY,EAAE,IAAI,CAAC,YAAY,CAAC,CACjD,CAAC;IACJ,CAAC;CACF;AA1BD,kCA0BC"}

package/dist/cjs/classes/CalendarMonth.d.ts

@@ -0,0 +1,9 @@
+import { CalendarWeek } from "./CalendarWeek";
+/** Represent a month in a calendar year. Contains the weeks within the month. */
+export declare class CalendarMonth {
+    constructor(month: Date, weeks: CalendarWeek[]);
+    /** The date of the month. */
+    date: Date;
+    /** The weeks within the month. */
+    weeks: CalendarWeek[];
+}

package/dist/cjs/classes/CalendarMonth.js

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CalendarMonth = void 0;
+/** Represent a month in a calendar year. Contains the weeks within the month. */
+class CalendarMonth {
+    constructor(month, weeks) {
+        this.date = month;
+        this.weeks = weeks;
+    }
+}
+exports.CalendarMonth = CalendarMonth;
+//# sourceMappingURL=CalendarMonth.js.map

package/dist/cjs/classes/CalendarMonth.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CalendarMonth.js","sourceRoot":"","sources":["../../../src/classes/CalendarMonth.ts"],"names":[],"mappings":";;;AAEA,iFAAiF;AACjF,MAAa,aAAa;IACxB,YAAY,KAAW,EAAE,KAAqB;QAC5C,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;QAClB,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC;IACrB,CAAC;CAOF;AAXD,sCAWC"}

package/dist/cjs/classes/CalendarWeek.d.ts

@@ -0,0 +1,9 @@
+import { CalendarDay } from "./CalendarDay";
+/** Represent a week in a calendar month. */
+export declare class CalendarWeek {
+    constructor(weekNumber: number, days: CalendarDay[]);
+    /** The number of the week within the year. */
+    weekNumber: number;
+    /** The days within the week. */
+    days: CalendarDay[];
+}

package/dist/cjs/classes/CalendarWeek.js

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CalendarWeek = void 0;
+/** Represent a week in a calendar month. */
+class CalendarWeek {
+    constructor(weekNumber, days) {
+        this.days = days;
+        this.weekNumber = weekNumber;
+    }
+}
+exports.CalendarWeek = CalendarWeek;
+//# sourceMappingURL=CalendarWeek.js.map

package/dist/cjs/classes/CalendarWeek.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CalendarWeek.js","sourceRoot":"","sources":["../../../src/classes/CalendarWeek.ts"],"names":[],"mappings":";;;AAEA,4CAA4C;AAC5C,MAAa,YAAY;IACvB,YAAY,UAAkB,EAAE,IAAmB;QACjD,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;QACjB,IAAI,CAAC,UAAU,GAAG,UAAU,CAAC;IAC/B,CAAC;CAKF;AATD,oCASC"}

package/dist/cjs/classes/index.d.ts

@@ -0,0 +1,3 @@
+export * from "./CalendarDay";
+export * from "./CalendarMonth";
+export * from "./CalendarWeek";

package/dist/cjs/classes/index.js

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./CalendarDay"), exports);
+tslib_1.__exportStar(require("./CalendarMonth"), exports);
+tslib_1.__exportStar(require("./CalendarWeek"), exports);
+//# sourceMappingURL=index.js.map

package/dist/cjs/classes/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/classes/index.ts"],"names":[],"mappings":";;;AAAA,wDAA8B;AAC9B,0DAAgC;AAChC,yDAA+B"}

package/dist/cjs/components/Button.d.ts

@@ -0,0 +1,11 @@
+import { ButtonHTMLAttributes } from "react";
+/**
+ * The component used to generate the button elements in the calendar.
+ *
+ * Use the `components` prop to swap this component with a custom one.
+ *
+ * @group Components
+ * @see https://react-day-picker.js.org/advanced-guides/custom-components
+ */
+export declare function Button(props: ButtonHTMLAttributes<HTMLButtonElement>): import("react/jsx-runtime").JSX.Element;
+export type ButtonProps = Parameters<typeof Button>[0];

package/dist/cjs/components/Button.js

@@ -0,0 +1,17 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Button = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+/**
+ * The component used to generate the button elements in the calendar.
+ *
+ * Use the `components` prop to swap this component with a custom one.
+ *
+ * @group Components
+ * @see https://react-day-picker.js.org/advanced-guides/custom-components
+ */
+function Button(props) {
+    return (0, jsx_runtime_1.jsx)("button", { ...props });
+}
+exports.Button = Button;
+//# sourceMappingURL=Button.js.map

package/dist/cjs/components/Button.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button.js","sourceRoot":"","sources":["../../../src/components/Button.tsx"],"names":[],"mappings":";;;;AAKA;;;;;;;GAOG;AACH,SAAgB,MAAM,CAAC,KAA8C;IACnE,OAAO,sCAAY,KAAK,GAAI,CAAC;AAC/B,CAAC;AAFD,wBAEC"}

package/dist/cjs/components/Calendar.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Render the DayPicker Calendar with navigation and the month grids.
+ *
+ * Use the `components` prop to swap this component with a custom one.
+ *
+ * @group Components
+ * @see https://react-day-picker.js.org/advanced-guides/custom-components
+ */
+export declare function Calendar(): import("react/jsx-runtime").JSX.Element;

package/dist/cjs/components/Calendar.js

@@ -0,0 +1,45 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Calendar = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const UI_1 = require("../UI");
+const calendar_1 = require("../contexts/calendar");
+const props_1 = require("../contexts/props");
+const Footer_1 = require("./Footer");
+const Month_1 = require("./Month");
+const Months_1 = require("./Months");
+const Nav_1 = require("./Nav");
+/**
+ * Render the DayPicker Calendar with navigation and the month grids.
+ *
+ * Use the `components` prop to swap this component with a custom one.
+ *
+ * @group Components
+ * @see https://react-day-picker.js.org/advanced-guides/custom-components
+ */
+function Calendar() {
+    var _a, _b, _c, _d;
+    const { className, classNames, components, dataAttributes, dir, footer, hideNavigation, hideWeekdayRow, id, lang, nonce, numberOfMonths, showWeekNumber, style, styles, title } = (0, props_1.useProps)();
+    const calendar = (0, calendar_1.useCalendar)();
+    // Apply classnames according to props
+    const cssClassNames = [classNames[UI_1.UI.Calendar]];
+    if (className) {
+        cssClassNames.push(className);
+    }
+    if (numberOfMonths > 1) {
+        cssClassNames.push(classNames[UI_1.CalendarFlag.hasMultipleMonths]);
+    }
+    if (showWeekNumber) {
+        cssClassNames.push(classNames[UI_1.CalendarFlag.hasWeekNumbers]);
+    }
+    if (hideWeekdayRow) {
+        cssClassNames.push(classNames[UI_1.CalendarFlag.noWeekdays]);
+    }
+    const Nav = (_a = components === null || components === void 0 ? void 0 : components.Nav) !== null && _a !== void 0 ? _a : Nav_1.Nav;
+    const Months = (_b = components === null || components === void 0 ? void 0 : components.Months) !== null && _b !== void 0 ? _b : Months_1.Months;
+    const Month = (_c = components === null || components === void 0 ? void 0 : components.Month) !== null && _c !== void 0 ? _c : Month_1.Month;
+    const Footer = (_d = components === null || components === void 0 ? void 0 : components.Footer) !== null && _d !== void 0 ? _d : Footer_1.Footer;
+    return ((0, jsx_runtime_1.jsxs)("div", { className: cssClassNames.join(" "), style: { ...styles === null || styles === void 0 ? void 0 : styles[UI_1.UI.Calendar], ...style }, dir: dir, id: id, lang: lang, nonce: nonce, title: title, ...dataAttributes, children: [(0, jsx_runtime_1.jsx)(Months, { className: classNames[UI_1.UI.Months], style: styles === null || styles === void 0 ? void 0 : styles[UI_1.UI.Months], children: calendar.months.map((month, i) => ((0, jsx_runtime_1.jsx)(Month, { "aria-labelledby": id, index: i, month: month }, i))) }), !hideNavigation && (0, jsx_runtime_1.jsx)(Nav, {}), footer && ((0, jsx_runtime_1.jsx)(Footer, { className: classNames[UI_1.UI.Footer], style: styles === null || styles === void 0 ? void 0 : styles[UI_1.UI.Footer], children: footer }))] }));
+}
+exports.Calendar = Calendar;
+//# sourceMappingURL=Calendar.js.map

package/dist/cjs/components/Calendar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Calendar.js","sourceRoot":"","sources":["../../../src/components/Calendar.tsx"],"names":[],"mappings":";;;;AAAA,8BAAyC;AACzC,mDAAmD;AACnD,6CAA6C;AAE7C,qCAAmD;AACnD,mCAAgD;AAChD,qCAAmD;AACnD,+BAA0C;AAE1C;;;;;;;GAOG;AACH,SAAgB,QAAQ;;IACtB,MAAM,EACJ,SAAS,EACT,UAAU,EACV,UAAU,EACV,cAAc,EACd,GAAG,EACH,MAAM,EACN,cAAc,EACd,cAAc,EACd,EAAE,EACF,IAAI,EACJ,KAAK,EACL,cAAc,EACd,cAAc,EACd,KAAK,EACL,MAAM,EACN,KAAK,EACN,GAAG,IAAA,gBAAQ,GAAE,CAAC;IAEf,MAAM,QAAQ,GAAG,IAAA,sBAAW,GAAE,CAAC;IAE/B,sCAAsC;IACtC,MAAM,aAAa,GAAG,CAAC,UAAU,CAAC,OAAE,CAAC,QAAQ,CAAC,CAAC,CAAC;IAChD,IAAI,SAAS,EAAE,CAAC;QACd,aAAa,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;IAChC,CAAC;IACD,IAAI,cAAc,GAAG,CAAC,EAAE,CAAC;QACvB,aAAa,CAAC,IAAI,CAAC,UAAU,CAAC,iBAAY,CAAC,iBAAiB,CAAC,CAAC,CAAC;IACjE,CAAC;IACD,IAAI,cAAc,EAAE,CAAC;QACnB,aAAa,CAAC,IAAI,CAAC,UAAU,CAAC,iBAAY,CAAC,cAAc,CAAC,CAAC,CAAC;IAC9D,CAAC;IACD,IAAI,cAAc,EAAE,CAAC;QACnB,aAAa,CAAC,IAAI,CAAC,UAAU,CAAC,iBAAY,CAAC,UAAU,CAAC,CAAC,CAAC;IAC1D,CAAC;IAED,MAAM,GAAG,GAAG,MAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,GAAG,mCAAI,SAAU,CAAC;IAC1C,MAAM,MAAM,GAAG,MAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,MAAM,mCAAI,eAAa,CAAC;IACnD,MAAM,KAAK,GAAG,MAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,KAAK,mCAAI,aAAY,CAAC;IAChD,MAAM,MAAM,GAAG,MAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,MAAM,mCAAI,eAAa,CAAC;IAEnD,OAAO,CACL,iCACE,SAAS,EAAE,aAAa,CAAC,IAAI,CAAC,GAAG,CAAC,EAClC,KAAK,EAAE,EAAE,GAAG,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAG,OAAE,CAAC,QAAQ,CAAC,EAAE,GAAG,KAAK,EAAE,EAC7C,GAAG,EAAE,GAAG,EACR,EAAE,EAAE,EAAE,EACN,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,KAAK,EACZ,KAAK,EAAE,KAAK,KACR,cAAc,aAElB,uBAAC,MAAM,IAAC,SAAS,EAAE,UAAU,CAAC,OAAE,CAAC,MAAM,CAAC,EAAE,KAAK,EAAE,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAG,OAAE,CAAC,MAAM,CAAC,YACjE,QAAQ,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,CAAC,EAAE,EAAE,CAAC,CACjC,uBAAC,KAAK,uBAAkB,EAAE,EAAU,KAAK,EAAE,CAAC,EAAE,KAAK,EAAE,KAAK,IAAzB,CAAC,CAA4B,CAC/D,CAAC,GACK,EACR,CAAC,cAAc,IAAI,uBAAC,GAAG,KAAG,EAC1B,MAAM,IAAI,CACT,uBAAC,MAAM,IAAC,SAAS,EAAE,UAAU,CAAC,OAAE,CAAC,MAAM,CAAC,EAAE,KAAK,EAAE,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAG,OAAE,CAAC,MAAM,CAAC,YACjE,MAAM,GACA,CACV,IACG,CACP,CAAC;AACJ,CAAC;AAlED,4BAkEC"}

package/dist/cjs/components/Chevron.d.ts

@@ -0,0 +1,12 @@
+/**
+ * Render the chevron icon used in the navigation buttons and dropdowns.
+ *
+ * Use the `components` prop to swap this component with a custom one.
+ *
+ * @group Components
+ * @see https://react-day-picker.js.org/advanced-guides/custom-components
+ */
+export declare function Chevron(props: {
+    size?: number;
+    orientation?: "up" | "down" | "left" | "right";
+}): import("react/jsx-runtime").JSX.Element;

package/dist/cjs/components/Chevron.js

@@ -0,0 +1,21 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Chevron = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const UI_1 = require("../UI");
+const props_1 = require("../contexts/props");
+/**
+ * Render the chevron icon used in the navigation buttons and dropdowns.
+ *
+ * Use the `components` prop to swap this component with a custom one.
+ *
+ * @group Components
+ * @see https://react-day-picker.js.org/advanced-guides/custom-components
+ */
+function Chevron(props) {
+    const { size = 24, orientation = "left" } = props;
+    const { classNames } = (0, props_1.useProps)();
+    return ((0, jsx_runtime_1.jsxs)("svg", { className: classNames[UI_1.UI.Chevron], width: size, height: size, viewBox: "0 0 24 24", children: [orientation === "up" && ((0, jsx_runtime_1.jsx)("polygon", { points: "6.77 17 12.5 11.43 18.24 17 20 15.28 12.5 8 5 15.28" })), orientation === "down" && ((0, jsx_runtime_1.jsx)("polygon", { points: "6.77 8 12.5 13.57 18.24 8 20 9.72 12.5 17 5 9.72" })), orientation === "left" && ((0, jsx_runtime_1.jsx)("polygon", { points: "15 17.23 9.43 11.5 15 5.76 13.28 4 6 11.5 13.28 19" })), orientation === "right" && ((0, jsx_runtime_1.jsx)("polygon", { points: "8 18.23 13.57 12.5 8 6.76 9.72 5 17 12.5 9.72 20" }))] }));
+}
+exports.Chevron = Chevron;
+//# sourceMappingURL=Chevron.js.map

package/dist/cjs/components/Chevron.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Chevron.js","sourceRoot":"","sources":["../../../src/components/Chevron.tsx"],"names":[],"mappings":";;;;AAAA,8BAA2B;AAC3B,6CAA6C;AAE7C;;;;;;;GAOG;AACH,SAAgB,OAAO,CAAC,KAGvB;IACC,MAAM,EAAE,IAAI,GAAG,EAAE,EAAE,WAAW,GAAG,MAAM,EAAE,GAAG,KAAK,CAAC;IAClD,MAAM,EAAE,UAAU,EAAE,GAAG,IAAA,gBAAQ,GAAE,CAAC;IAElC,OAAO,CACL,iCACE,SAAS,EAAE,UAAU,CAAC,OAAE,CAAC,OAAO,CAAC,EACjC,KAAK,EAAE,IAAI,EACX,MAAM,EAAE,IAAI,EACZ,OAAO,EAAC,WAAW,aAElB,WAAW,KAAK,IAAI,IAAI,CACvB,oCAAS,MAAM,EAAC,qDAAqD,GAAG,CACzE,EACA,WAAW,KAAK,MAAM,IAAI,CACzB,oCAAS,MAAM,EAAC,kDAAkD,GAAG,CACtE,EACA,WAAW,KAAK,MAAM,IAAI,CACzB,oCAAS,MAAM,EAAC,oDAAoD,GAAG,CACxE,EACA,WAAW,KAAK,OAAO,IAAI,CAC1B,oCAAS,MAAM,EAAC,kDAAkD,GAAG,CACtE,IACG,CACP,CAAC;AACJ,CAAC;AA5BD,0BA4BC"}

package/dist/cjs/components/Day.d.ts

@@ -0,0 +1,22 @@
+import type { HTMLAttributes } from "react";
+import type { CalendarDay } from "../classes";
+import type { DayModifiers } from "../types";
+/**
+ * Render the gridcell of a day in the calendar.
+ *
+ * Use the `components` prop to swap this component with a custom one.
+ *
+ * @group Components
+ * @see https://react-day-picker.js.org/advanced-guides/custom-components
+ */
+export declare function Day(props: {
+    /** The day to be rendered in the gridcell. */
+    day: CalendarDay;
+    /** Modifiers for the day. */
+    modifiers: DayModifiers;
+    /** HTML attributes for the gridcell. */
+    htmlAttributes: HTMLAttributes<HTMLElement>;
+    /** Children of the gridcell. */
+    children?: React.ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
+export type DayProps = Parameters<typeof Day>[0];

package/dist/cjs/components/Day.js

@@ -0,0 +1,18 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Day = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+/**
+ * Render the gridcell of a day in the calendar.
+ *
+ * Use the `components` prop to swap this component with a custom one.
+ *
+ * @group Components
+ * @see https://react-day-picker.js.org/advanced-guides/custom-components
+ */
+function Day(props) {
+    const { children, htmlAttributes } = props;
+    return (0, jsx_runtime_1.jsx)("div", { ...htmlAttributes, children: children });
+}
+exports.Day = Day;
+//# sourceMappingURL=Day.js.map

package/dist/cjs/components/Day.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Day.js","sourceRoot":"","sources":["../../../src/components/Day.tsx"],"names":[],"mappings":";;;;AAKA;;;;;;;GAOG;AACH,SAAgB,GAAG,CAAC,KASnB;IACC,MAAM,EAAE,QAAQ,EAAE,cAAc,EAAE,GAAG,KAAK,CAAC;IAC3C,OAAO,mCAAS,cAAc,YAAG,QAAQ,GAAO,CAAC;AACnD,CAAC;AAZD,kBAYC"}

package/dist/cjs/components/DayWrapper.d.ts

@@ -0,0 +1,12 @@
+import { CalendarDay } from "../classes/CalendarDay";
+/**
+ * Provides a `Day` the day state and the html attributes. Developers may use a
+ * `Day` component without the need to use hooks.
+ *
+ * @internal
+ */
+export declare function DayWrapper(props: {
+    "aria-colindex": number;
+    /** The day to be rendered in the gridcell. */
+    day: CalendarDay;
+}): import("react/jsx-runtime").JSX.Element;