react-day-picker 8.0.0-beta.29 → 8.0.0-beta.32

package/build/components/Day/hooks/useDay.d.ts

@@ -0,0 +1,58 @@
+import React from 'react';
+import { DateRange, ModifierStatus, StyledComponentProps } from '../../../types';
+import { SelectMultipleContextValue } from '../../../contexts/SelectMultiple';
+import { SelectRangeContextValue } from '../../../contexts/SelectRange';
+import { SelectSingleContextValue } from '../../../contexts/SelectSingle';
+export declare type UseDay = {
+    /** Whether the date is outside the display month/ */
+    isOutside: boolean;
+    /** The modifiers for the given date. */
+    modifiers: ModifierStatus;
+    /** The days in DayPicker currently selected. */
+    selected: Date | Date[] | DateRange | undefined;
+    /**
+     * The props for rendering the day as interactive element.
+     *
+     * When `undefined`, DayPicker should render a non interactive element with non-interactive
+     * props.
+     */
+    buttonProps?: Omit<React.HTMLProps<HTMLButtonElement>, 'ref'>;
+    /**
+     * The props for rendering the day as not interactive element.
+     *
+     * When both this value and `buttonProps` are `undefined`, DayPicker should not render anything.
+     */
+    nonInteractiveProps?: StyledComponentProps;
+    single: SelectSingleContextValue;
+    multiple: SelectMultipleContextValue;
+    range: SelectRangeContextValue;
+};
+/**
+ * This hook returns details about the content to render in the day cell.
+ *
+ *
+ * When a day cell is rendered in the table, DayPicker can either:
+ *
+ * - render nothing: when the day is outside the month or has matched the
+ *   "hidden" modifier.
+ * - render a button. When a selection mode is set, DayPicker renders a button
+ *   to allow the focus and the selection. In case of `custom` selection
+ *   mode, DayPicker expects a `onDayClick` prop to render a button.
+ * - render a non-interactive element: when no selection mode is set, the day
+ *   cell shouldn’t respond to any interaction. DayPicker should render a `div`
+ *   or a `span`.
+ *
+ * ### Usage
+ *
+ * Use this hook to customize the behavior of the [[Day]] component. Create a
+ * new `Day` component using this hook and pass it to the `components` prop.
+ * The source of [[Day]] can be a good starting point.
+ *
+ * */
+export declare function useDay(
+/** The day rendered in the month. */
+date: Date, 
+/** The month where the date is displayed. DayPicker renders days outside the display month when `showOutsideDays` is true. */
+displayMonth: Date, 
+/** A ref to the button element. */
+buttonRef: React.RefObject<HTMLButtonElement>): UseDay;

package/build/components/Day/hooks/useDay.js

@@ -0,0 +1,176 @@
+import { __assign } from '../../../_virtual/_tslib.js';
+import React__default from 'react';
+import { isSameMonth } from 'date-fns';
+import { isDayPickerMultiple } from '../../../types/isDayPickerMultiple.js';
+import { isDayPickerRange } from '../../../types/isDayPickerRange.js';
+import { isDayPickerSingle } from '../../../types/isDayPickerSingle.js';
+import { useDayPicker } from '../../../contexts/DayPicker/useDayPicker.js';
+import '../../../contexts/SelectMultiple/SelectMultipleContext.js';
+import { useSelectMultiple } from '../../../contexts/SelectMultiple/useSelectMultiple.js';
+import '../../../contexts/SelectRange/SelectRangeContext.js';
+import { useSelectRange } from '../../../contexts/SelectRange/useSelectRange.js';
+import '../../../contexts/SelectSingle/SelectSingleContext.js';
+import { useSelectSingle } from '../../../contexts/SelectSingle/useSelectSingle.js';
+import 'date-fns/locale/en-US';
+import { useModifiers } from '../../../hooks/useModifiers/useModifiers.js';
+import { useDayFocus } from './useDayFocus.js';
+
+/**
+ * This hook returns details about the content to render in the day cell.
+ *
+ *
+ * When a day cell is rendered in the table, DayPicker can either:
+ *
+ * - render nothing: when the day is outside the month or has matched the
+ *   "hidden" modifier.
+ * - render a button. When a selection mode is set, DayPicker renders a button
+ *   to allow the focus and the selection. In case of `custom` selection
+ *   mode, DayPicker expects a `onDayClick` prop to render a button.
+ * - render a non-interactive element: when no selection mode is set, the day
+ *   cell shouldn’t respond to any interaction. DayPicker should render a `div`
+ *   or a `span`.
+ *
+ * ### Usage
+ *
+ * Use this hook to customize the behavior of the [[Day]] component. Create a
+ * new `Day` component using this hook and pass it to the `components` prop.
+ * The source of [[Day]] can be a good starting point.
+ *
+ * */
+function useDay(
+/** The day rendered in the month. */
+date, 
+/** The month where the date is displayed. DayPicker renders days outside the display month when `showOutsideDays` is true. */
+displayMonth, 
+/** A ref to the button element. */
+buttonRef) {
+    var context = useDayPicker();
+    var single = useSelectSingle();
+    var multiple = useSelectMultiple();
+    var range = useSelectRange();
+    var _a = useDayFocus(date, buttonRef), focus = _a.focus, blur = _a.blur, focusOnKeyDown = _a.focusOnKeyDown, isFocused = _a.isFocused;
+    var _b = useModifiers(date), modifiers = _b.modifiers, modifierClassNames = _b.modifierClassNames, modifierStyle = _b.modifierStyle;
+    var isOutside = !isSameMonth(date, displayMonth);
+    var returnValue = {
+        isOutside: isOutside,
+        modifiers: modifiers,
+        selected: isDayPickerSingle(context)
+            ? single.selected
+            : isDayPickerMultiple(context)
+                ? multiple.selected
+                : isDayPickerRange(context)
+                    ? range.selected
+                    : undefined,
+        single: single,
+        multiple: multiple,
+        range: range
+    };
+    if (isOutside && !context.showOutsideDays) {
+        return returnValue;
+    }
+    if (modifiers.hidden) {
+        return returnValue;
+    }
+    var classNames = [context.classNames.day].concat(modifierClassNames);
+    var style = __assign(__assign({}, context.styles.day), modifierStyle);
+    if (isOutside) {
+        classNames.push(context.classNames.day_outside);
+        style = __assign(__assign({}, context.styles), context.styles.day_outside);
+    }
+    var DayContent = context.components.DayContent;
+    var children = (React__default.createElement(DayContent, { date: date, displayMonth: displayMonth, modifiers: modifiers }));
+    var className = classNames.join(' ');
+    if (!context.mode && !context.onDayClick) {
+        return __assign(__assign({}, returnValue), { nonInteractiveProps: {
+                style: style,
+                className: className,
+                children: children
+            } });
+    }
+    // #region Event handlers
+    var handleClick = function (e) {
+        var _a, _b, _c, _d;
+        if (isDayPickerSingle(context)) {
+            (_a = single.handleDayClick) === null || _a === void 0 ? void 0 : _a.call(single, date, modifiers, e);
+        }
+        else if (isDayPickerMultiple(context)) {
+            (_b = multiple.handleDayClick) === null || _b === void 0 ? void 0 : _b.call(multiple, date, modifiers, e);
+        }
+        else if (isDayPickerRange(context)) {
+            (_c = range.handleDayClick) === null || _c === void 0 ? void 0 : _c.call(range, date, modifiers, e);
+        }
+        (_d = context.onDayClick) === null || _d === void 0 ? void 0 : _d.call(context, date, modifiers, e);
+    };
+    var handleFocus = function (e) {
+        var _a;
+        focus(date);
+        (_a = context.onDayFocus) === null || _a === void 0 ? void 0 : _a.call(context, date, modifiers, e);
+    };
+    var handleBlur = function (e) {
+        var _a;
+        blur();
+        (_a = context.onDayBlur) === null || _a === void 0 ? void 0 : _a.call(context, date, modifiers, e);
+    };
+    var handleKeyDown = function (e) {
+        var _a;
+        focusOnKeyDown(e);
+        (_a = context.onDayKeyDown) === null || _a === void 0 ? void 0 : _a.call(context, date, modifiers, e);
+    };
+    var handleKeyUp = function (e) {
+        var _a;
+        (_a = context.onDayKeyUp) === null || _a === void 0 ? void 0 : _a.call(context, date, modifiers, e);
+    };
+    var handleMouseEnter = function (e) {
+        var _a;
+        (_a = context.onDayMouseEnter) === null || _a === void 0 ? void 0 : _a.call(context, date, modifiers, e);
+    };
+    var handleMouseLeave = function (e) {
+        var _a;
+        (_a = context.onDayMouseLeave) === null || _a === void 0 ? void 0 : _a.call(context, date, modifiers, e);
+    };
+    var handleTouchCancel = function (e) {
+        var _a;
+        (_a = context.onDayTouchCancel) === null || _a === void 0 ? void 0 : _a.call(context, date, modifiers, e);
+    };
+    var handleTouchEnd = function (e) {
+        var _a;
+        (_a = context.onDayTouchEnd) === null || _a === void 0 ? void 0 : _a.call(context, date, modifiers, e);
+    };
+    var handleTouchMove = function (e) {
+        var _a;
+        (_a = context.onDayTouchMove) === null || _a === void 0 ? void 0 : _a.call(context, date, modifiers, e);
+    };
+    var handleTouchStart = function (e) {
+        var _a;
+        (_a = context.onDayTouchStart) === null || _a === void 0 ? void 0 : _a.call(context, date, modifiers, e);
+    };
+    if (isOutside) {
+        classNames.push(context.classNames.day_outside);
+        style = __assign(__assign({}, context.styles), context.styles.day_outside);
+    }
+    className = classNames.join(' ');
+    var selected = modifiers.selected, disabled = modifiers.disabled;
+    var tabIndex = disabled || isFocused ? -1 : 0;
+    return __assign(__assign({}, returnValue), { buttonProps: {
+            children: children,
+            'aria-pressed': selected,
+            style: style,
+            disabled: disabled,
+            className: className,
+            tabIndex: tabIndex,
+            onClick: handleClick,
+            onFocus: handleFocus,
+            onBlur: handleBlur,
+            onKeyDown: handleKeyDown,
+            onKeyUp: handleKeyUp,
+            onMouseEnter: handleMouseEnter,
+            onMouseLeave: handleMouseLeave,
+            onTouchCancel: handleTouchCancel,
+            onTouchEnd: handleTouchEnd,
+            onTouchMove: handleTouchMove,
+            onTouchStart: handleTouchStart
+        } });
+}
+
+export { useDay };
+//# sourceMappingURL=useDay.js.map

package/build/components/Day/hooks/useDay.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDay.js","sources":["../../../../src/components/Day/hooks/useDay.tsx"],"sourcesContent":["import React from 'react';\n\nimport { isSameMonth } from 'date-fns';\n\nimport {\n  DateRange,\n  isDayPickerMultiple,\n  isDayPickerRange,\n  isDayPickerSingle,\n  ModifierStatus,\n  StyledComponentProps\n} from '../../../types';\n\nimport { useDayPicker } from '../../../contexts/DayPicker';\nimport {\n  SelectMultipleContextValue,\n  useSelectMultiple\n} from '../../../contexts/SelectMultiple';\nimport {\n  SelectRangeContextValue,\n  useSelectRange\n} from '../../../contexts/SelectRange';\nimport {\n  SelectSingleContextValue,\n  useSelectSingle\n} from '../../../contexts/SelectSingle';\nimport { useModifiers } from '../../../hooks';\n\nimport { useDayFocus } from './useDayFocus';\n\nexport type UseDay = {\n  /** Whether the date is outside the display month/ */\n  isOutside: boolean;\n  /** The modifiers for the given date. */\n  modifiers: ModifierStatus;\n  /** The days in DayPicker currently selected. */\n  selected: Date | Date[] | DateRange | undefined;\n  /**\n   * The props for rendering the day as interactive element.\n   *\n   * When `undefined`, DayPicker should render a non interactive element with non-interactive\n   * props.\n   */\n  buttonProps?: Omit<React.HTMLProps<HTMLButtonElement>, 'ref'>;\n  /**\n   * The props for rendering the day as not interactive element.\n   *\n   * When both this value and `buttonProps` are `undefined`, DayPicker should not render anything.\n   */\n  nonInteractiveProps?: StyledComponentProps;\n  single: SelectSingleContextValue;\n  multiple: SelectMultipleContextValue;\n  range: SelectRangeContextValue;\n};\n\n/**\n * This hook returns details about the content to render in the day cell.\n *\n *\n * When a day cell is rendered in the table, DayPicker can either:\n *\n * - render nothing: when the day is outside the month or has matched the\n *   \"hidden\" modifier.\n * - render a button. When a selection mode is set, DayPicker renders a button\n *   to allow the focus and the selection. In case of `custom` selection\n *   mode, DayPicker expects a `onDayClick` prop to render a button.\n * - render a non-interactive element: when no selection mode is set, the day\n *   cell shouldn’t respond to any interaction. DayPicker should render a `div`\n *   or a `span`.\n *\n * ### Usage\n *\n * Use this hook to customize the behavior of the [[Day]] component. Create a\n * new `Day` component using this hook and pass it to the `components` prop.\n * The source of [[Day]] can be a good starting point.\n *\n * */\nexport function useDay(\n  /** The day rendered in the month. */\n  date: Date,\n  /** The month where the date is displayed. DayPicker renders days outside the display month when `showOutsideDays` is true. */\n  displayMonth: Date,\n  /** A ref to the button element. */\n  buttonRef: React.RefObject<HTMLButtonElement>\n): UseDay {\n  const context = useDayPicker();\n  const single = useSelectSingle();\n  const multiple = useSelectMultiple();\n  const range = useSelectRange();\n  const { focus, blur, focusOnKeyDown, isFocused } = useDayFocus(\n    date,\n    buttonRef\n  );\n\n  const { modifiers, modifierClassNames, modifierStyle } = useModifiers(date);\n  const isOutside = !isSameMonth(date, displayMonth);\n\n  const returnValue = {\n    isOutside,\n    modifiers,\n    selected: isDayPickerSingle(context)\n      ? single.selected\n      : isDayPickerMultiple(context)\n      ? multiple.selected\n      : isDayPickerRange(context)\n      ? range.selected\n      : undefined,\n    single,\n    multiple,\n    range\n  };\n  if (isOutside && !context.showOutsideDays) {\n    return returnValue;\n  }\n  if (modifiers.hidden) {\n    return returnValue;\n  }\n\n  const classNames = [context.classNames.day].concat(modifierClassNames);\n  let style: React.CSSProperties = { ...context.styles.day, ...modifierStyle };\n\n  if (isOutside) {\n    classNames.push(context.classNames.day_outside);\n    style = { ...context.styles, ...context.styles.day_outside };\n  }\n\n  const { DayContent } = context.components;\n  const children = (\n    <DayContent date={date} displayMonth={displayMonth} modifiers={modifiers} />\n  );\n\n  let className = classNames.join(' ');\n\n  if (!context.mode && !context.onDayClick) {\n    return {\n      ...returnValue,\n      nonInteractiveProps: {\n        style,\n        className,\n        children\n      }\n    };\n  }\n\n  // #region Event handlers\n  const handleClick: React.MouseEventHandler = (e) => {\n    if (isDayPickerSingle(context)) {\n      single.handleDayClick?.(date, modifiers, e);\n    } else if (isDayPickerMultiple(context)) {\n      multiple.handleDayClick?.(date, modifiers, e);\n    } else if (isDayPickerRange(context)) {\n      range.handleDayClick?.(date, modifiers, e);\n    }\n    context.onDayClick?.(date, modifiers, e);\n  };\n\n  const handleFocus: React.FocusEventHandler = (e) => {\n    focus(date);\n    context.onDayFocus?.(date, modifiers, e);\n  };\n\n  const handleBlur: React.FocusEventHandler = (e) => {\n    blur();\n    context.onDayBlur?.(date, modifiers, e);\n  };\n\n  const handleKeyDown: React.KeyboardEventHandler = (e) => {\n    focusOnKeyDown(e);\n    context.onDayKeyDown?.(date, modifiers, e);\n  };\n\n  const handleKeyUp: React.KeyboardEventHandler = (e) => {\n    context.onDayKeyUp?.(date, modifiers, e);\n  };\n  const handleMouseEnter: React.MouseEventHandler = (e) => {\n    context.onDayMouseEnter?.(date, modifiers, e);\n  };\n  const handleMouseLeave: React.MouseEventHandler = (e) => {\n    context.onDayMouseLeave?.(date, modifiers, e);\n  };\n  const handleTouchCancel: React.TouchEventHandler = (e) => {\n    context.onDayTouchCancel?.(date, modifiers, e);\n  };\n  const handleTouchEnd: React.TouchEventHandler = (e) => {\n    context.onDayTouchEnd?.(date, modifiers, e);\n  };\n  const handleTouchMove: React.TouchEventHandler = (e) => {\n    context.onDayTouchMove?.(date, modifiers, e);\n  };\n  const handleTouchStart: React.TouchEventHandler = (e) => {\n    context.onDayTouchStart?.(date, modifiers, e);\n  };\n\n  if (isOutside) {\n    classNames.push(context.classNames.day_outside);\n    style = { ...context.styles, ...context.styles.day_outside };\n  }\n\n  className = classNames.join(' ');\n\n  const { selected, disabled } = modifiers;\n\n  const tabIndex = disabled || isFocused ? -1 : 0;\n\n  return {\n    ...returnValue,\n    buttonProps: {\n      children,\n      'aria-pressed': selected,\n      style: style,\n      disabled: disabled,\n      className: className,\n      tabIndex: tabIndex,\n      onClick: handleClick,\n      onFocus: handleFocus,\n      onBlur: handleBlur,\n      onKeyDown: handleKeyDown,\n      onKeyUp: handleKeyUp,\n      onMouseEnter: handleMouseEnter,\n      onMouseLeave: handleMouseLeave,\n      onTouchCancel: handleTouchCancel,\n      onTouchEnd: handleTouchEnd,\n      onTouchMove: handleTouchMove,\n      onTouchStart: handleTouchStart\n    }\n  };\n}\n"],"names":["React"],"mappings":"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"}

package/build/components/Day/hooks/useDayFocus.d.ts

@@ -0,0 +1,8 @@
+import * as React from 'react';
+/** Handle the focus for the day element. */
+export declare function useDayFocus(date: Date, buttonRef: React.RefObject<HTMLButtonElement>): {
+    focus: (date: Date) => void;
+    blur: () => void;
+    focusOnKeyDown: React.KeyboardEventHandler;
+    isFocused: boolean;
+};

package/build/components/Day/hooks/useDayFocus.js

@@ -0,0 +1,56 @@
+import * as React from 'react';
+import { isSameDay } from 'date-fns';
+import 'date-fns/locale/en-US';
+import { useDayPicker } from '../../../contexts/DayPicker/useDayPicker.js';
+import '../../../contexts/Navigation/NavigationContext.js';
+import '../../Button/Button.js';
+import '../../../contexts/SelectMultiple/SelectMultipleContext.js';
+import '../../../contexts/SelectRange/SelectRangeContext.js';
+import '../../../contexts/SelectSingle/SelectSingleContext.js';
+import '../../../contexts/Focus/FocusContext.js';
+import { useFocus } from '../../../contexts/Focus/useFocus.js';
+import '../../../contexts/DayPicker/DayPickerContext.js';
+
+/** Handle the focus for the day element. */
+function useDayFocus(date, buttonRef) {
+    var _a = useFocus(), focusedDay = _a[0], _b = _a[1], focusDayAfter = _b.focusDayAfter, focusDayBefore = _b.focusDayBefore, focusWeekAfterDay = _b.focusWeekAfterDay, focusWeekBeforeDay = _b.focusWeekBeforeDay, blur = _b.blur, focus = _b.focus;
+    var dir = useDayPicker().dir;
+    // Focus the HTML element if this is the focused day.
+    React.useEffect(function () {
+        var _a;
+        if (!focusedDay)
+            return;
+        if (isSameDay(focusedDay, date)) {
+            (_a = buttonRef.current) === null || _a === void 0 ? void 0 : _a.focus();
+        }
+    }, [focusedDay, date, buttonRef]);
+    var focusOnKeyDown = function (e) {
+        switch (e.key) {
+            case 'ArrowLeft':
+                e.preventDefault();
+                e.stopPropagation();
+                dir === 'rtl' ? focusDayAfter() : focusDayBefore();
+                break;
+            case 'ArrowRight':
+                e.preventDefault();
+                e.stopPropagation();
+                dir === 'rtl' ? focusDayBefore() : focusDayAfter();
+                break;
+            case 'ArrowDown':
+                e.preventDefault();
+                e.stopPropagation();
+                focusWeekAfterDay();
+                break;
+            case 'ArrowUp':
+                e.preventDefault();
+                e.stopPropagation();
+                focusWeekBeforeDay();
+                break;
+        }
+    };
+    var isFocused = Boolean(focusedDay && !isSameDay(focusedDay, date));
+    return { focus: focus, blur: blur, focusOnKeyDown: focusOnKeyDown, isFocused: isFocused };
+}
+
+export { useDayFocus };
+//# sourceMappingURL=useDayFocus.js.map

package/build/components/Day/hooks/useDayFocus.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDayFocus.js","sources":["../../../../src/components/Day/hooks/useDayFocus.ts"],"sourcesContent":["import * as React from 'react';\n\nimport { isSameDay } from 'date-fns';\n\nimport { useDayPicker } from '../../../contexts';\nimport { useFocus } from '../../../contexts/Focus';\n\n/** Handle the focus for the day element. */\nexport function useDayFocus(\n  date: Date,\n  buttonRef: React.RefObject<HTMLButtonElement>\n): {\n  focus: (date: Date) => void;\n  blur: () => void;\n  focusOnKeyDown: React.KeyboardEventHandler;\n  isFocused: boolean;\n} {\n  const [\n    focusedDay,\n    {\n      focusDayAfter,\n      focusDayBefore,\n      focusWeekAfterDay,\n      focusWeekBeforeDay,\n      blur,\n      focus\n    }\n  ] = useFocus();\n  const { dir } = useDayPicker();\n\n  // Focus the HTML element if this is the focused day.\n  React.useEffect(() => {\n    if (!focusedDay) return;\n    if (isSameDay(focusedDay, date)) {\n      buttonRef.current?.focus();\n    }\n  }, [focusedDay, date, buttonRef]);\n\n  const focusOnKeyDown: React.KeyboardEventHandler = (e) => {\n    switch (e.key) {\n      case 'ArrowLeft':\n        e.preventDefault();\n        e.stopPropagation();\n        dir === 'rtl' ? focusDayAfter() : focusDayBefore();\n        break;\n      case 'ArrowRight':\n        e.preventDefault();\n        e.stopPropagation();\n        dir === 'rtl' ? focusDayBefore() : focusDayAfter();\n        break;\n      case 'ArrowDown':\n        e.preventDefault();\n        e.stopPropagation();\n        focusWeekAfterDay();\n        break;\n      case 'ArrowUp':\n        e.preventDefault();\n        e.stopPropagation();\n        focusWeekBeforeDay();\n        break;\n    }\n  };\n\n  const isFocused = Boolean(focusedDay && !isSameDay(focusedDay, date));\n\n  return { focus, blur, focusOnKeyDown, isFocused };\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;AAOA;SACgB,WAAW,CACzB,IAAU,EACV,SAA6C;IAOvC,IAAA,KAUF,QAAQ,EAAE,EATZ,UAAU,QAAA,EACV,UAOC,EANC,aAAa,mBAAA,EACb,cAAc,oBAAA,EACd,iBAAiB,uBAAA,EACjB,kBAAkB,wBAAA,EAClB,IAAI,UAAA,EACJ,KAAK,WAEK,CAAC;IACP,IAAA,GAAG,GAAK,YAAY,EAAE,IAAnB,CAAoB;;IAG/B,KAAK,CAAC,SAAS,CAAC;;QACd,IAAI,CAAC,UAAU;YAAE,OAAO;QACxB,IAAI,SAAS,CAAC,UAAU,EAAE,IAAI,CAAC,EAAE;YAC/B,MAAA,SAAS,CAAC,OAAO,0CAAE,KAAK,EAAE,CAAC;SAC5B;KACF,EAAE,CAAC,UAAU,EAAE,IAAI,EAAE,SAAS,CAAC,CAAC,CAAC;IAElC,IAAM,cAAc,GAA+B,UAAC,CAAC;QACnD,QAAQ,CAAC,CAAC,GAAG;YACX,KAAK,WAAW;gBACd,CAAC,CAAC,cAAc,EAAE,CAAC;gBACnB,CAAC,CAAC,eAAe,EAAE,CAAC;gBACpB,GAAG,KAAK,KAAK,GAAG,aAAa,EAAE,GAAG,cAAc,EAAE,CAAC;gBACnD,MAAM;YACR,KAAK,YAAY;gBACf,CAAC,CAAC,cAAc,EAAE,CAAC;gBACnB,CAAC,CAAC,eAAe,EAAE,CAAC;gBACpB,GAAG,KAAK,KAAK,GAAG,cAAc,EAAE,GAAG,aAAa,EAAE,CAAC;gBACnD,MAAM;YACR,KAAK,WAAW;gBACd,CAAC,CAAC,cAAc,EAAE,CAAC;gBACnB,CAAC,CAAC,eAAe,EAAE,CAAC;gBACpB,iBAAiB,EAAE,CAAC;gBACpB,MAAM;YACR,KAAK,SAAS;gBACZ,CAAC,CAAC,cAAc,EAAE,CAAC;gBACnB,CAAC,CAAC,eAAe,EAAE,CAAC;gBACpB,kBAAkB,EAAE,CAAC;gBACrB,MAAM;SACT;KACF,CAAC;IAEF,IAAM,SAAS,GAAG,OAAO,CAAC,UAAU,IAAI,CAAC,SAAS,CAAC,UAAU,EAAE,IAAI,CAAC,CAAC,CAAC;IAEtE,OAAO,EAAE,KAAK,OAAA,EAAE,IAAI,MAAA,EAAE,cAAc,gBAAA,EAAE,SAAS,WAAA,EAAE,CAAC;AACpD;;;;"}

package/build/components/Day/index.d.ts

@@ -0,0 +1,2 @@
+export * from './Day';
+export * from './hooks';

package/build/components/DayContent/DayContent.d.ts

@@ -0,0 +1,15 @@
+/// <reference types="react" />
+import { ModifierStatus } from '../../types';
+/** Represent the props for the [[DayContent]] component. */
+export interface DayContentProps {
+    /** The date representing the day. */
+    date: Date;
+    /** The month where the day is displayed. */
+    displayMonth: Date;
+    /** The modifier status for the date. */
+    modifiers: ModifierStatus;
+}
+/**
+ * Render the content of the day cell.
+ */
+export declare function DayContent(props: DayContentProps): JSX.Element;

package/build/components/DayContent/DayContent.js

@@ -0,0 +1,15 @@
+import * as React from 'react';
+import { useDayPicker } from '../../contexts/DayPicker/useDayPicker.js';
+
+/**
+ * Render the content of the day cell.
+ */
+function DayContent(props) {
+    var _a = useDayPicker(), locale = _a.locale, classNames = _a.classNames, styles = _a.styles, labelDay = _a.labels.labelDay, formatDay = _a.formatters.formatDay;
+    return (React.createElement(React.Fragment, null,
+        React.createElement("span", { "aria-hidden": "true" }, formatDay(props.date, { locale: locale })),
+        React.createElement("span", { className: classNames.vhidden, style: styles.vhidden }, labelDay(props.date, props.modifiers, { locale: locale }))));
+}
+
+export { DayContent };
+//# sourceMappingURL=DayContent.js.map

package/build/components/DayContent/DayContent.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DayContent.js","sources":["../../../src/components/DayContent/DayContent.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { useDayPicker } from '../../contexts/DayPicker';\n\nimport { ModifierStatus } from '../../types';\n\n/** Represent the props for the [[DayContent]] component. */\nexport interface DayContentProps {\n  /** The date representing the day. */\n  date: Date;\n  /** The month where the day is displayed. */\n  displayMonth: Date;\n  /** The modifier status for the date. */\n  modifiers: ModifierStatus;\n}\n\n/**\n * Render the content of the day cell.\n */\nexport function DayContent(props: DayContentProps): JSX.Element {\n  const {\n    locale,\n    classNames,\n    styles,\n    labels: { labelDay },\n    formatters: { formatDay }\n  } = useDayPicker();\n  return (\n    <>\n      <span aria-hidden=\"true\">{formatDay(props.date, { locale })}</span>\n      <span className={classNames.vhidden} style={styles.vhidden}>\n        {labelDay(props.date, props.modifiers, { locale })}\n      </span>\n    </>\n  );\n}\n"],"names":[],"mappings":";;;AAgBA;;;SAGgB,UAAU,CAAC,KAAsB;IACzC,IAAA,KAMF,YAAY,EAAE,EALhB,MAAM,YAAA,EACN,UAAU,gBAAA,EACV,MAAM,YAAA,EACI,QAAQ,qBAAA,EACJ,SAAS,0BACP,CAAC;IACnB,QACE;QACE,6CAAkB,MAAM,IAAE,SAAS,CAAC,KAAK,CAAC,IAAI,EAAE,EAAE,MAAM,QAAA,EAAE,CAAC,CAAQ;QACnE,8BAAM,SAAS,EAAE,UAAU,CAAC,OAAO,EAAE,KAAK,EAAE,MAAM,CAAC,OAAO,IACvD,QAAQ,CAAC,KAAK,CAAC,IAAI,EAAE,KAAK,CAAC,SAAS,EAAE,EAAE,MAAM,QAAA,EAAE,CAAC,CAC7C,CACN,EACH;AACJ;;;;"}

package/build/components/DayContent/index.d.ts

@@ -0,0 +1 @@
+export * from './DayContent';

package/build/components/Dropdown/Dropdown.d.ts

@@ -0,0 +1,16 @@
+import * as React from 'react';
+/** The props for the [[Dropdown]] component. */
+export interface DropdownProps {
+    caption?: React.ReactNode;
+    children?: React.SelectHTMLAttributes<HTMLSelectElement>['children'];
+    className?: string;
+    ['aria-label']?: string;
+    style?: React.CSSProperties;
+    value?: React.SelectHTMLAttributes<HTMLSelectElement>['value'];
+    onChange?: React.ChangeEventHandler<HTMLSelectElement>;
+}
+/**
+ * Render a styled select component – displaying a caption and a custom
+ * drop-down icon.
+ */
+export declare function Dropdown(props: DropdownProps): JSX.Element;

package/build/components/Dropdown/Dropdown.js

@@ -0,0 +1,20 @@
+import * as React from 'react';
+import { useDayPicker } from '../../contexts/DayPicker/useDayPicker.js';
+
+/**
+ * Render a styled select component – displaying a caption and a custom
+ * drop-down icon.
+ */
+function Dropdown(props) {
+    var onChange = props.onChange, value = props.value, children = props.children, caption = props.caption, className = props.className, style = props.style;
+    var _a = useDayPicker(), classNames = _a.classNames, styles = _a.styles, IconDropdown = _a.components.IconDropdown;
+    return (React.createElement("div", { className: className, style: style },
+        React.createElement("span", { className: classNames.vhidden }, props['aria-label']),
+        React.createElement("select", { "aria-label": props['aria-label'], className: classNames.dropdown, style: styles.dropdown, value: value, onChange: onChange }, children),
+        React.createElement("div", { className: classNames.caption_label, style: styles.caption_label, "aria-hidden": "true" },
+            caption,
+            React.createElement(IconDropdown, { className: classNames.dropdown_icon, style: styles.dropdown_icon }))));
+}
+
+export { Dropdown };
+//# sourceMappingURL=Dropdown.js.map

package/build/components/Dropdown/Dropdown.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Dropdown.js","sources":["../../../src/components/Dropdown/Dropdown.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { useDayPicker } from '../../contexts/DayPicker';\n\n/** The props for the [[Dropdown]] component. */\nexport interface DropdownProps {\n  caption?: React.ReactNode;\n  children?: React.SelectHTMLAttributes<HTMLSelectElement>['children'];\n  className?: string;\n  ['aria-label']?: string;\n  style?: React.CSSProperties;\n  value?: React.SelectHTMLAttributes<HTMLSelectElement>['value'];\n  onChange?: React.ChangeEventHandler<HTMLSelectElement>;\n}\n\n/**\n * Render a styled select component – displaying a caption and a custom\n * drop-down icon.\n */\nexport function Dropdown(props: DropdownProps): JSX.Element {\n  const { onChange, value, children, caption, className, style } = props;\n  const {\n    classNames,\n    styles,\n    components: { IconDropdown }\n  } = useDayPicker();\n  return (\n    <div className={className} style={style}>\n      <span className={classNames.vhidden}>{props['aria-label']}</span>\n      <select\n        aria-label={props['aria-label']}\n        className={classNames.dropdown}\n        style={styles.dropdown}\n        value={value}\n        onChange={onChange}\n      >\n        {children}\n      </select>\n      <div\n        className={classNames.caption_label}\n        style={styles.caption_label}\n        aria-hidden=\"true\"\n      >\n        {caption}\n        {\n          <IconDropdown\n            className={classNames.dropdown_icon}\n            style={styles.dropdown_icon}\n          />\n        }\n      </div>\n    </div>\n  );\n}\n"],"names":[],"mappings":";;;AAeA;;;;SAIgB,QAAQ,CAAC,KAAoB;IACnC,IAAA,QAAQ,GAAiD,KAAK,SAAtD,EAAE,KAAK,GAA0C,KAAK,MAA/C,EAAE,QAAQ,GAAgC,KAAK,SAArC,EAAE,OAAO,GAAuB,KAAK,QAA5B,EAAE,SAAS,GAAY,KAAK,UAAjB,EAAE,KAAK,GAAK,KAAK,MAAV,CAAW;IACjE,IAAA,KAIF,YAAY,EAAE,EAHhB,UAAU,gBAAA,EACV,MAAM,YAAA,EACQ,YAAY,6BACV,CAAC;IACnB,QACE,6BAAK,SAAS,EAAE,SAAS,EAAE,KAAK,EAAE,KAAK;QACrC,8BAAM,SAAS,EAAE,UAAU,CAAC,OAAO,IAAG,KAAK,CAAC,YAAY,CAAC,CAAQ;QACjE,8CACc,KAAK,CAAC,YAAY,CAAC,EAC/B,SAAS,EAAE,UAAU,CAAC,QAAQ,EAC9B,KAAK,EAAE,MAAM,CAAC,QAAQ,EACtB,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,QAAQ,IAEjB,QAAQ,CACF;QACT,6BACE,SAAS,EAAE,UAAU,CAAC,aAAa,EACnC,KAAK,EAAE,MAAM,CAAC,aAAa,iBACf,MAAM;YAEjB,OAAO;YAEN,oBAAC,YAAY,IACX,SAAS,EAAE,UAAU,CAAC,aAAa,EACnC,KAAK,EAAE,MAAM,CAAC,aAAa,GAC3B,CAEA,CACF,EACN;AACJ;;;;"}

package/build/components/Dropdown/index.d.ts

@@ -0,0 +1 @@
+export * from './Dropdown';

package/build/components/Footer/Footer.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+/** Render the Footer component (empty as default).*/
+export declare function Footer(): JSX.Element;

package/build/components/Footer/Footer.js

@@ -0,0 +1,15 @@
+import * as React from 'react';
+import { useDayPicker } from '../../contexts/DayPicker/useDayPicker.js';
+
+/** Render the Footer component (empty as default).*/
+function Footer() {
+    var _a = useDayPicker(), footer = _a.footer, styles = _a.styles, tfoot = _a.classNames.tfoot;
+    if (!footer)
+        return React.createElement(React.Fragment, null);
+    return (React.createElement("tfoot", { className: tfoot, style: styles.tfoot },
+        React.createElement("tr", null,
+            React.createElement("td", { colSpan: 8 }, footer))));
+}
+
+export { Footer };
+//# sourceMappingURL=Footer.js.map

package/build/components/Footer/Footer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Footer.js","sources":["../../../src/components/Footer/Footer.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { useDayPicker } from '../../contexts/DayPicker';\n\n/** Render the Footer component (empty as default).*/\nexport function Footer(): JSX.Element {\n  const {\n    footer,\n    styles,\n    classNames: { tfoot }\n  } = useDayPicker();\n  if (!footer) return <></>;\n  return (\n    <tfoot className={tfoot} style={styles.tfoot}>\n      <tr>\n        <td colSpan={8}>{footer}</td>\n      </tr>\n    </tfoot>\n  );\n}\n"],"names":[],"mappings":";;;AAIA;SACgB,MAAM;IACd,IAAA,KAIF,YAAY,EAAE,EAHhB,MAAM,YAAA,EACN,MAAM,YAAA,EACQ,KAAK,sBACH,CAAC;IACnB,IAAI,CAAC,MAAM;QAAE,OAAO,yCAAK,CAAC;IAC1B,QACE,+BAAO,SAAS,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,CAAC,KAAK;QAC1C;YACE,4BAAI,OAAO,EAAE,CAAC,IAAG,MAAM,CAAM,CAC1B,CACC,EACR;AACJ;;;;"}

package/build/components/Footer/index.d.ts

@@ -0,0 +1 @@
+export * from './Footer';

package/build/components/Head/Head.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+/**
+ * Render the Head component - i.e. the table head with the weekday names.
+ */
+export declare function Head(): JSX.Element;

package/build/components/Head/Head.js

@@ -0,0 +1,20 @@
+import * as React from 'react';
+import { useDayPicker } from '../../contexts/DayPicker/useDayPicker.js';
+import { getWeekdays } from './utils/getWeekdays.js';
+
+/**
+ * Render the Head component - i.e. the table head with the weekday names.
+ */
+function Head() {
+    var _a = useDayPicker(), classNames = _a.classNames, styles = _a.styles, showWeekNumber = _a.showWeekNumber, locale = _a.locale, formatWeekdayName = _a.formatters.formatWeekdayName, labelWeekday = _a.labels.labelWeekday;
+    var weekdays = getWeekdays(locale);
+    return (React.createElement("thead", { style: styles.head, className: classNames.head },
+        React.createElement("tr", { style: styles.head_row, className: classNames.head_row },
+            showWeekNumber && (React.createElement("th", { scope: "col", style: styles.head_cell, className: classNames.head_cell })),
+            weekdays.map(function (weekday, i) { return (React.createElement("th", { key: i, scope: "col", className: classNames.head_cell, style: styles.head_cell },
+                React.createElement("span", { className: classNames.vhidden, "aria-label": "" }, labelWeekday(weekday, { locale: locale })),
+                React.createElement("span", { "aria-hidden": true }, formatWeekdayName(weekday, { locale: locale })))); }))));
+}
+
+export { Head };
+//# sourceMappingURL=Head.js.map

package/build/components/Head/Head.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Head.js","sources":["../../../src/components/Head/Head.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { useDayPicker } from '../../contexts/DayPicker';\n\nimport { getWeekdays } from './utils';\n\n/**\n * Render the Head component - i.e. the table head with the weekday names.\n */\nexport function Head(): JSX.Element {\n  const {\n    classNames,\n    styles,\n    showWeekNumber,\n    locale,\n    formatters: { formatWeekdayName },\n    labels: { labelWeekday }\n  } = useDayPicker();\n\n  const weekdays = getWeekdays(locale);\n\n  return (\n    <thead style={styles.head} className={classNames.head}>\n      <tr style={styles.head_row} className={classNames.head_row}>\n        {showWeekNumber && (\n          <th\n            scope=\"col\"\n            style={styles.head_cell}\n            className={classNames.head_cell}\n          ></th>\n        )}\n        {weekdays.map((weekday, i) => (\n          <th\n            key={i}\n            scope=\"col\"\n            className={classNames.head_cell}\n            style={styles.head_cell}\n          >\n            <span className={classNames.vhidden} aria-label=\"\">\n              {labelWeekday(weekday, { locale })}\n            </span>\n            <span aria-hidden={true}>\n              {formatWeekdayName(weekday, { locale })}\n            </span>\n          </th>\n        ))}\n      </tr>\n    </thead>\n  );\n}\n"],"names":[],"mappings":";;;;AAMA;;;SAGgB,IAAI;IACZ,IAAA,KAOF,YAAY,EAAE,EANhB,UAAU,gBAAA,EACV,MAAM,YAAA,EACN,cAAc,oBAAA,EACd,MAAM,YAAA,EACQ,iBAAiB,kCAAA,EACrB,YAAY,yBACN,CAAC;IAEnB,IAAM,QAAQ,GAAG,WAAW,CAAC,MAAM,CAAC,CAAC;IAErC,QACE,+BAAO,KAAK,EAAE,MAAM,CAAC,IAAI,EAAE,SAAS,EAAE,UAAU,CAAC,IAAI;QACnD,4BAAI,KAAK,EAAE,MAAM,CAAC,QAAQ,EAAE,SAAS,EAAE,UAAU,CAAC,QAAQ;YACvD,cAAc,KACb,4BACE,KAAK,EAAC,KAAK,EACX,KAAK,EAAE,MAAM,CAAC,SAAS,EACvB,SAAS,EAAE,UAAU,CAAC,SAAS,GAC3B,CACP;YACA,QAAQ,CAAC,GAAG,CAAC,UAAC,OAAO,EAAE,CAAC,IAAK,QAC5B,4BACE,GAAG,EAAE,CAAC,EACN,KAAK,EAAC,KAAK,EACX,SAAS,EAAE,UAAU,CAAC,SAAS,EAC/B,KAAK,EAAE,MAAM,CAAC,SAAS;gBAEvB,8BAAM,SAAS,EAAE,UAAU,CAAC,OAAO,gBAAa,EAAE,IAC/C,YAAY,CAAC,OAAO,EAAE,EAAE,MAAM,QAAA,EAAE,CAAC,CAC7B;gBACP,6CAAmB,IAAI,IACpB,iBAAiB,CAAC,OAAO,EAAE,EAAE,MAAM,QAAA,EAAE,CAAC,CAClC,CACJ,IACN,CAAC,CACC,CACC,EACR;AACJ;;;;"}

package/build/components/Head/index.d.ts

@@ -0,0 +1 @@
+export * from './Head';

package/build/components/Head/utils/getWeekdays.d.ts

@@ -0,0 +1,6 @@
+import { Locale } from 'date-fns';
+/**
+ * Generate a series of 7 days, starting from the week, to use for formatting
+ * the weekday names (Monday, Tuesday, etc.).
+ */
+export declare function getWeekdays(locale?: Locale): Date[];

package/build/components/Head/utils/getWeekdays.js

@@ -0,0 +1,18 @@
+import { startOfWeek, addDays } from 'date-fns';
+
+/**
+ * Generate a series of 7 days, starting from the week, to use for formatting
+ * the weekday names (Monday, Tuesday, etc.).
+ */
+function getWeekdays(locale) {
+    var start = startOfWeek(new Date(), { locale: locale });
+    var days = [];
+    for (var i = 0; i < 7; i++) {
+        var day = addDays(start, i);
+        days.push(day);
+    }
+    return days;
+}
+
+export { getWeekdays };
+//# sourceMappingURL=getWeekdays.js.map

package/build/components/Head/utils/getWeekdays.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"getWeekdays.js","sources":["../../../../src/components/Head/utils/getWeekdays.ts"],"sourcesContent":["import { addDays, Locale, startOfWeek } from 'date-fns';\n\n/**\n * Generate a series of 7 days, starting from the week, to use for formatting\n * the weekday names (Monday, Tuesday, etc.).\n */\nexport function getWeekdays(locale?: Locale): Date[] {\n  const start = startOfWeek(new Date(), { locale });\n  const days = [];\n  for (let i = 0; i < 7; i++) {\n    const day = addDays(start, i);\n    days.push(day);\n  }\n  return days;\n}\n"],"names":[],"mappings":";;AAEA;;;;SAIgB,WAAW,CAAC,MAAe;IACzC,IAAM,KAAK,GAAG,WAAW,CAAC,IAAI,IAAI,EAAE,EAAE,EAAE,MAAM,QAAA,EAAE,CAAC,CAAC;IAClD,IAAM,IAAI,GAAG,EAAE,CAAC;IAChB,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE,CAAC,EAAE,EAAE;QAC1B,IAAM,GAAG,GAAG,OAAO,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC;QAC9B,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;KAChB;IACD,OAAO,IAAI,CAAC;AACd;;;;"}

package/build/components/Head/utils/index.d.ts

@@ -0,0 +1 @@
+export * from './getWeekdays';

package/build/components/IconDropdown/IconDropdown.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+import { StyledComponentProps } from '../../types';
+/**
+ * Render the icon in the styled drop-down.
+ */
+export declare function IconDropdown(props: StyledComponentProps): JSX.Element;

package/build/components/IconDropdown/IconDropdown.js

@@ -0,0 +1,13 @@
+import { __assign } from '../../_virtual/_tslib.js';
+import * as React from 'react';
+
+/**
+ * Render the icon in the styled drop-down.
+ */
+function IconDropdown(props) {
+    return (React.createElement("svg", __assign({ width: "8px", height: "8px", viewBox: "0 0 120 120", "data-testid": "iconDropdown" }, props),
+        React.createElement("path", { d: "M4.22182541,48.2218254 C8.44222828,44.0014225 15.2388494,43.9273804 19.5496459,47.9996989 L19.7781746,48.2218254 L60,88.443 L100.221825,48.2218254 C104.442228,44.0014225 111.238849,43.9273804 115.549646,47.9996989 L115.778175,48.2218254 C119.998577,52.4422283 120.07262,59.2388494 116.000301,63.5496459 L115.778175,63.7781746 L67.7781746,111.778175 C63.5577717,115.998577 56.7611506,116.07262 52.4503541,112.000301 L52.2218254,111.778175 L4.22182541,63.7781746 C-0.0739418023,59.4824074 -0.0739418023,52.5175926 4.22182541,48.2218254 Z", fill: "currentColor", fillRule: "nonzero" })));
+}
+
+export { IconDropdown };
+//# sourceMappingURL=IconDropdown.js.map

package/build/components/IconDropdown/IconDropdown.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"IconDropdown.js","sources":["../../../src/components/IconDropdown/IconDropdown.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { StyledComponentProps } from '../../types';\n\n/**\n * Render the icon in the styled drop-down.\n */\nexport function IconDropdown(props: StyledComponentProps): JSX.Element {\n  return (\n    <svg\n      width=\"8px\"\n      height=\"8px\"\n      viewBox=\"0 0 120 120\"\n      data-testid=\"iconDropdown\"\n      {...props}\n    >\n      <path\n        d=\"M4.22182541,48.2218254 C8.44222828,44.0014225 15.2388494,43.9273804 19.5496459,47.9996989 L19.7781746,48.2218254 L60,88.443 L100.221825,48.2218254 C104.442228,44.0014225 111.238849,43.9273804 115.549646,47.9996989 L115.778175,48.2218254 C119.998577,52.4422283 120.07262,59.2388494 116.000301,63.5496459 L115.778175,63.7781746 L67.7781746,111.778175 C63.5577717,115.998577 56.7611506,116.07262 52.4503541,112.000301 L52.2218254,111.778175 L4.22182541,63.7781746 C-0.0739418023,59.4824074 -0.0739418023,52.5175926 4.22182541,48.2218254 Z\"\n        fill=\"currentColor\"\n        fillRule=\"nonzero\"\n      ></path>\n    </svg>\n  );\n}\n"],"names":[],"mappings":";;;AAIA;;;SAGgB,YAAY,CAAC,KAA2B;IACtD,QACE,sCACE,KAAK,EAAC,KAAK,EACX,MAAM,EAAC,KAAK,EACZ,OAAO,EAAC,aAAa,iBACT,cAAc,IACtB,KAAK;QAET,8BACE,CAAC,EAAC,yhBAAyhB,EAC3hB,IAAI,EAAC,cAAc,EACnB,QAAQ,EAAC,SAAS,GACZ,CACJ,EACN;AACJ;;;;"}

package/build/components/IconDropdown/index.d.ts

@@ -0,0 +1 @@
+export * from './IconDropdown';

package/build/components/IconLeft/IconLeft.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+import { StyledComponentProps } from '../../types';
+/**
+ * Render the "previous month" button in the navigation.
+ */
+export declare function IconLeft(props: StyledComponentProps): JSX.Element;

package/build/components/IconLeft/IconLeft.js

@@ -0,0 +1,13 @@
+import { __assign } from '../../_virtual/_tslib.js';
+import React__default from 'react';
+
+/**
+ * Render the "previous month" button in the navigation.
+ */
+function IconLeft(props) {
+    return (React__default.createElement("svg", __assign({ width: "16px", height: "16px", viewBox: "0 0 120 120", "data-testid": "iconLeft" }, props),
+        React__default.createElement("path", { d: "M69.490332,3.34314575 C72.6145263,0.218951416 77.6798462,0.218951416 80.8040405,3.34314575 C83.8617626,6.40086786 83.9268205,11.3179931 80.9992143,14.4548388 L80.8040405,14.6568542 L35.461,60 L80.8040405,105.343146 C83.8617626,108.400868 83.9268205,113.317993 80.9992143,116.454839 L80.8040405,116.656854 C77.7463184,119.714576 72.8291931,119.779634 69.6923475,116.852028 L69.490332,116.656854 L18.490332,65.6568542 C15.4326099,62.5991321 15.367552,57.6820069 18.2951583,54.5451612 L18.490332,54.3431458 L69.490332,3.34314575 Z", fill: "currentColor", fillRule: "nonzero" })));
+}
+
+export { IconLeft };
+//# sourceMappingURL=IconLeft.js.map

package/build/components/IconLeft/IconLeft.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"IconLeft.js","sources":["../../../src/components/IconLeft/IconLeft.tsx"],"sourcesContent":["import React from 'react';\n\nimport { StyledComponentProps } from '../../types';\n\n/**\n * Render the \"previous month\" button in the navigation.\n */\nexport function IconLeft(props: StyledComponentProps): JSX.Element {\n  return (\n    <svg\n      width=\"16px\"\n      height=\"16px\"\n      viewBox=\"0 0 120 120\"\n      data-testid=\"iconLeft\"\n      {...props}\n    >\n      <path\n        d=\"M69.490332,3.34314575 C72.6145263,0.218951416 77.6798462,0.218951416 80.8040405,3.34314575 C83.8617626,6.40086786 83.9268205,11.3179931 80.9992143,14.4548388 L80.8040405,14.6568542 L35.461,60 L80.8040405,105.343146 C83.8617626,108.400868 83.9268205,113.317993 80.9992143,116.454839 L80.8040405,116.656854 C77.7463184,119.714576 72.8291931,119.779634 69.6923475,116.852028 L69.490332,116.656854 L18.490332,65.6568542 C15.4326099,62.5991321 15.367552,57.6820069 18.2951583,54.5451612 L18.490332,54.3431458 L69.490332,3.34314575 Z\"\n        fill=\"currentColor\"\n        fillRule=\"nonzero\"\n      ></path>\n    </svg>\n  );\n}\n"],"names":["React"],"mappings":";;;AAIA;;;SAGgB,QAAQ,CAAC,KAA2B;IAClD,QACEA,+CACE,KAAK,EAAC,MAAM,EACZ,MAAM,EAAC,MAAM,EACb,OAAO,EAAC,aAAa,iBACT,UAAU,IAClB,KAAK;QAETA,uCACE,CAAC,EAAC,ihBAAihB,EACnhB,IAAI,EAAC,cAAc,EACnB,QAAQ,EAAC,SAAS,GACZ,CACJ,EACN;AACJ;;;;"}

package/build/components/IconLeft/index.d.ts

@@ -0,0 +1 @@
+export * from './IconLeft';

package/build/components/IconRight/IconRight.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+import { StyledComponentProps } from '../../types';
+/**
+ * Render the "next month" button in the navigation.
+ */
+export declare function IconRight(props: StyledComponentProps): JSX.Element;

package/build/components/IconRight/IconRight.js

@@ -0,0 +1,13 @@
+import { __assign } from '../../_virtual/_tslib.js';
+import React__default from 'react';
+
+/**
+ * Render the "next month" button in the navigation.
+ */
+function IconRight(props) {
+    return (React__default.createElement("svg", __assign({ width: "16px", height: "16px", viewBox: "0 0 120 120" }, props, { "data-testid": "iconRight" }),
+        React__default.createElement("path", { d: "M49.8040405,3.34314575 C46.6798462,0.218951416 41.6145263,0.218951416 38.490332,3.34314575 C35.4326099,6.40086786 35.367552,11.3179931 38.2951583,14.4548388 L38.490332,14.6568542 L83.8333725,60 L38.490332,105.343146 C35.4326099,108.400868 35.367552,113.317993 38.2951583,116.454839 L38.490332,116.656854 C41.5480541,119.714576 46.4651794,119.779634 49.602025,116.852028 L49.8040405,116.656854 L100.804041,65.6568542 C103.861763,62.5991321 103.926821,57.6820069 100.999214,54.5451612 L100.804041,54.3431458 L49.8040405,3.34314575 Z", fill: "currentColor" })));
+}
+
+export { IconRight };
+//# sourceMappingURL=IconRight.js.map