@depup/react-aria-components 1.16.0-depup.0

package/dist/Calendar.mjs

@@ -0,0 +1,345 @@
+import {ButtonContext as $d2b4bc8c273e7be6$export$24d547caef80ccd1} from "./Button.mjs";
+import {dom as $64fa3d84918910a7$export$df3a06d6289f983e, Provider as $64fa3d84918910a7$export$2881499e37b75b9a, useContextProps as $64fa3d84918910a7$export$29f1550f4b0d4415, useRenderProps as $64fa3d84918910a7$export$4d86445c2cf5e3, useSlottedContext as $64fa3d84918910a7$export$fabf2dc03a41866e} from "./utils.mjs";
+import {HeadingContext as $4e85f108e88277b8$export$d688439359537581} from "./RSPContexts.mjs";
+import {TextContext as $514c0188e459b4c0$export$9afb8bc826b033ea} from "./Text.mjs";
+import {useLocale as $dCiKx$useLocale, useCalendar as $dCiKx$useCalendar, mergeProps as $dCiKx$mergeProps, VisuallyHidden as $dCiKx$VisuallyHidden, useRangeCalendar as $dCiKx$useRangeCalendar, useCalendarGrid as $dCiKx$useCalendarGrid, useCalendarCell as $dCiKx$useCalendarCell, useHover as $dCiKx$useHover, useFocusRing as $dCiKx$useFocusRing} from "react-aria";
+import {createCalendar as $dCiKx$createCalendar, endOfMonth as $dCiKx$endOfMonth, isSameMonth as $dCiKx$isSameMonth, isToday as $dCiKx$isToday, isSameDay as $dCiKx$isSameDay} from "@internationalized/date";
+import {useCalendarState as $dCiKx$useCalendarState, useRangeCalendarState as $dCiKx$useRangeCalendarState} from "react-stately";
+import {filterDOMProps as $dCiKx$filterDOMProps} from "@react-aria/utils";
+import $dCiKx$react, {createContext as $dCiKx$createContext, forwardRef as $dCiKx$forwardRef, useContext as $dCiKx$useContext, useRef as $dCiKx$useRef} from "react";
+
+/*
+ * Copyright 2022 Adobe. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */ 
+
+
+
+
+
+
+
+
+const $dfd62f934fc76fed$export$3b805cea1f178355 = /*#__PURE__*/ (0, $dCiKx$createContext)(null);
+const $dfd62f934fc76fed$export$233dd9682e1ad64b = /*#__PURE__*/ (0, $dCiKx$createContext)(null);
+const $dfd62f934fc76fed$export$9e31dcedda1dadc7 = /*#__PURE__*/ (0, $dCiKx$createContext)(null);
+const $dfd62f934fc76fed$export$5e0fc348c00f87a0 = /*#__PURE__*/ (0, $dCiKx$createContext)(null);
+const $dfd62f934fc76fed$export$e1aef45b828286de = /*#__PURE__*/ (0, $dCiKx$forwardRef)(function Calendar(props, ref) {
+    [props, ref] = (0, $64fa3d84918910a7$export$29f1550f4b0d4415)(props, ref, $dfd62f934fc76fed$export$3b805cea1f178355);
+    let { locale: locale } = (0, $dCiKx$useLocale)();
+    let state = (0, $dCiKx$useCalendarState)({
+        ...props,
+        locale: locale,
+        createCalendar: props.createCalendar || (0, $dCiKx$createCalendar)
+    });
+    let { calendarProps: calendarProps, prevButtonProps: prevButtonProps, nextButtonProps: nextButtonProps, errorMessageProps: errorMessageProps, title: title } = (0, $dCiKx$useCalendar)(props, state);
+    let renderProps = (0, $64fa3d84918910a7$export$4d86445c2cf5e3)({
+        ...props,
+        values: {
+            state: state,
+            isDisabled: props.isDisabled || false,
+            isInvalid: state.isValueInvalid
+        },
+        defaultClassName: 'react-aria-Calendar'
+    });
+    let DOMProps = (0, $dCiKx$filterDOMProps)(props, {
+        global: true
+    });
+    return /*#__PURE__*/ (0, $dCiKx$react).createElement((0, $64fa3d84918910a7$export$df3a06d6289f983e).div, {
+        ...(0, $dCiKx$mergeProps)(DOMProps, renderProps, calendarProps),
+        ref: ref,
+        slot: props.slot || undefined,
+        "data-disabled": props.isDisabled || undefined,
+        "data-invalid": state.isValueInvalid || undefined
+    }, /*#__PURE__*/ (0, $dCiKx$react).createElement((0, $64fa3d84918910a7$export$2881499e37b75b9a), {
+        values: [
+            [
+                (0, $d2b4bc8c273e7be6$export$24d547caef80ccd1),
+                {
+                    slots: {
+                        previous: prevButtonProps,
+                        next: nextButtonProps
+                    }
+                }
+            ],
+            [
+                (0, $4e85f108e88277b8$export$d688439359537581),
+                {
+                    'aria-hidden': true,
+                    level: 2,
+                    children: title
+                }
+            ],
+            [
+                $dfd62f934fc76fed$export$9e31dcedda1dadc7,
+                state
+            ],
+            [
+                $dfd62f934fc76fed$export$3b805cea1f178355,
+                props
+            ],
+            [
+                (0, $514c0188e459b4c0$export$9afb8bc826b033ea),
+                {
+                    slots: {
+                        errorMessage: errorMessageProps
+                    }
+                }
+            ]
+        ]
+    }, /*#__PURE__*/ (0, $dCiKx$react).createElement((0, $dCiKx$VisuallyHidden), null, /*#__PURE__*/ (0, $dCiKx$react).createElement("h2", null, calendarProps['aria-label'])), renderProps.children, /*#__PURE__*/ (0, $dCiKx$react).createElement((0, $dCiKx$VisuallyHidden), null, /*#__PURE__*/ (0, $dCiKx$react).createElement("button", {
+        "aria-label": nextButtonProps['aria-label'],
+        disabled: nextButtonProps.isDisabled,
+        onClick: ()=>state.focusNextPage(),
+        tabIndex: -1
+    }))));
+});
+const $dfd62f934fc76fed$export$a4f5c8b89d277a8d = /*#__PURE__*/ (0, $dCiKx$forwardRef)(function RangeCalendar(props, ref) {
+    [props, ref] = (0, $64fa3d84918910a7$export$29f1550f4b0d4415)(props, ref, $dfd62f934fc76fed$export$233dd9682e1ad64b);
+    let { locale: locale } = (0, $dCiKx$useLocale)();
+    let state = (0, $dCiKx$useRangeCalendarState)({
+        ...props,
+        locale: locale,
+        createCalendar: props.createCalendar || (0, $dCiKx$createCalendar)
+    });
+    let { calendarProps: calendarProps, prevButtonProps: prevButtonProps, nextButtonProps: nextButtonProps, errorMessageProps: errorMessageProps, title: title } = (0, $dCiKx$useRangeCalendar)(props, state, ref);
+    let renderProps = (0, $64fa3d84918910a7$export$4d86445c2cf5e3)({
+        ...props,
+        values: {
+            state: state,
+            isDisabled: props.isDisabled || false,
+            isInvalid: state.isValueInvalid
+        },
+        defaultClassName: 'react-aria-RangeCalendar'
+    });
+    let DOMProps = (0, $dCiKx$filterDOMProps)(props, {
+        global: true
+    });
+    return /*#__PURE__*/ (0, $dCiKx$react).createElement((0, $64fa3d84918910a7$export$df3a06d6289f983e).div, {
+        ...(0, $dCiKx$mergeProps)(renderProps, DOMProps, calendarProps),
+        ref: ref,
+        slot: props.slot || undefined,
+        "data-disabled": props.isDisabled || undefined,
+        "data-invalid": state.isValueInvalid || undefined
+    }, /*#__PURE__*/ (0, $dCiKx$react).createElement((0, $64fa3d84918910a7$export$2881499e37b75b9a), {
+        values: [
+            [
+                (0, $d2b4bc8c273e7be6$export$24d547caef80ccd1),
+                {
+                    slots: {
+                        previous: prevButtonProps,
+                        next: nextButtonProps
+                    }
+                }
+            ],
+            [
+                (0, $4e85f108e88277b8$export$d688439359537581),
+                {
+                    'aria-hidden': true,
+                    level: 2,
+                    children: title
+                }
+            ],
+            [
+                $dfd62f934fc76fed$export$5e0fc348c00f87a0,
+                state
+            ],
+            [
+                $dfd62f934fc76fed$export$233dd9682e1ad64b,
+                props
+            ],
+            [
+                (0, $514c0188e459b4c0$export$9afb8bc826b033ea),
+                {
+                    slots: {
+                        errorMessage: errorMessageProps
+                    }
+                }
+            ]
+        ]
+    }, /*#__PURE__*/ (0, $dCiKx$react).createElement((0, $dCiKx$VisuallyHidden), null, /*#__PURE__*/ (0, $dCiKx$react).createElement("h2", null, calendarProps['aria-label'])), renderProps.children, /*#__PURE__*/ (0, $dCiKx$react).createElement((0, $dCiKx$VisuallyHidden), null, /*#__PURE__*/ (0, $dCiKx$react).createElement("button", {
+        "aria-label": nextButtonProps['aria-label'],
+        disabled: nextButtonProps.isDisabled,
+        onClick: ()=>state.focusNextPage(),
+        tabIndex: -1
+    }))));
+});
+const $dfd62f934fc76fed$var$InternalCalendarGridContext = /*#__PURE__*/ (0, $dCiKx$createContext)(null);
+const $dfd62f934fc76fed$export$5bd780d491cfc46c = /*#__PURE__*/ (0, $dCiKx$forwardRef)(function CalendarGrid(props, ref) {
+    let calendarState = (0, $dCiKx$useContext)($dfd62f934fc76fed$export$9e31dcedda1dadc7);
+    let rangeCalendarState = (0, $dCiKx$useContext)($dfd62f934fc76fed$export$5e0fc348c00f87a0);
+    let calenderProps = (0, $64fa3d84918910a7$export$fabf2dc03a41866e)($dfd62f934fc76fed$export$3b805cea1f178355);
+    let rangeCalenderProps = (0, $64fa3d84918910a7$export$fabf2dc03a41866e)($dfd62f934fc76fed$export$233dd9682e1ad64b);
+    let state = calendarState !== null && calendarState !== void 0 ? calendarState : rangeCalendarState;
+    let startDate = state.visibleRange.start;
+    if (props.offset) startDate = startDate.add(props.offset);
+    var _calenderProps_firstDayOfWeek;
+    let firstDayOfWeek = (_calenderProps_firstDayOfWeek = calenderProps === null || calenderProps === void 0 ? void 0 : calenderProps.firstDayOfWeek) !== null && _calenderProps_firstDayOfWeek !== void 0 ? _calenderProps_firstDayOfWeek : rangeCalenderProps === null || rangeCalenderProps === void 0 ? void 0 : rangeCalenderProps.firstDayOfWeek;
+    let { gridProps: gridProps, headerProps: headerProps, weekDays: weekDays, weeksInMonth: weeksInMonth } = (0, $dCiKx$useCalendarGrid)({
+        startDate: startDate,
+        endDate: (0, $dCiKx$endOfMonth)(startDate),
+        weekdayStyle: props.weekdayStyle,
+        firstDayOfWeek: firstDayOfWeek
+    }, state);
+    let DOMProps = (0, $dCiKx$filterDOMProps)(props, {
+        global: true
+    });
+    var _props_className;
+    return /*#__PURE__*/ (0, $dCiKx$react).createElement($dfd62f934fc76fed$var$InternalCalendarGridContext.Provider, {
+        value: {
+            headerProps: headerProps,
+            weekDays: weekDays,
+            startDate: startDate,
+            weeksInMonth: weeksInMonth
+        }
+    }, /*#__PURE__*/ (0, $dCiKx$react).createElement((0, $64fa3d84918910a7$export$df3a06d6289f983e).table, {
+        render: props.render,
+        ...(0, $dCiKx$mergeProps)(DOMProps, gridProps),
+        ref: ref,
+        style: props.style,
+        cellPadding: 0,
+        className: (_props_className = props.className) !== null && _props_className !== void 0 ? _props_className : 'react-aria-CalendarGrid'
+    }, typeof props.children !== 'function' ? props.children : /*#__PURE__*/ (0, $dCiKx$react).createElement((0, $dCiKx$react).Fragment, null, /*#__PURE__*/ (0, $dCiKx$react).createElement($dfd62f934fc76fed$export$22e2d15eaa4d2377, null, (day)=>/*#__PURE__*/ (0, $dCiKx$react).createElement($dfd62f934fc76fed$export$ad2135cac3a11b3d, null, day)), /*#__PURE__*/ (0, $dCiKx$react).createElement($dfd62f934fc76fed$export$e11f8ba65d857bff, null, props.children))));
+});
+function $dfd62f934fc76fed$var$CalendarGridHeader(props, ref) {
+    let { children: children, style: style, className: className } = props;
+    let { headerProps: headerProps, weekDays: weekDays } = (0, $dCiKx$useContext)($dfd62f934fc76fed$var$InternalCalendarGridContext);
+    let DOMProps = (0, $dCiKx$filterDOMProps)(props, {
+        global: true
+    });
+    return /*#__PURE__*/ (0, $dCiKx$react).createElement((0, $64fa3d84918910a7$export$df3a06d6289f983e).thead, {
+        render: props.render,
+        ...(0, $dCiKx$mergeProps)(DOMProps, headerProps),
+        ref: ref,
+        style: style,
+        className: className !== null && className !== void 0 ? className : 'react-aria-CalendarGridHeader'
+    }, /*#__PURE__*/ (0, $dCiKx$react).createElement("tr", null, weekDays.map((day, key)=>/*#__PURE__*/ (0, $dCiKx$react).cloneElement(children(day), {
+            key: key
+        }))));
+}
+/**
+ * A calendar grid header displays a row of week day names at the top of a month.
+ */ const $dfd62f934fc76fed$export$22e2d15eaa4d2377 = /*#__PURE__*/ (0, $dCiKx$forwardRef)($dfd62f934fc76fed$var$CalendarGridHeader);
+function $dfd62f934fc76fed$var$CalendarHeaderCell(props, ref) {
+    let { children: children, style: style, className: className } = props;
+    let DOMProps = (0, $dCiKx$filterDOMProps)(props, {
+        global: true
+    });
+    return /*#__PURE__*/ (0, $dCiKx$react).createElement((0, $64fa3d84918910a7$export$df3a06d6289f983e).th, {
+        render: props.render,
+        ...DOMProps,
+        ref: ref,
+        style: style,
+        className: className || 'react-aria-CalendarHeaderCell'
+    }, children);
+}
+/**
+ * A calendar header cell displays a week day name at the top of a column within a calendar.
+ */ const $dfd62f934fc76fed$export$ad2135cac3a11b3d = /*#__PURE__*/ (0, $dCiKx$forwardRef)($dfd62f934fc76fed$var$CalendarHeaderCell);
+function $dfd62f934fc76fed$var$CalendarGridBody(props, ref) {
+    let { children: children, style: style, className: className } = props;
+    let calendarState = (0, $dCiKx$useContext)($dfd62f934fc76fed$export$9e31dcedda1dadc7);
+    let rangeCalendarState = (0, $dCiKx$useContext)($dfd62f934fc76fed$export$5e0fc348c00f87a0);
+    let state = calendarState !== null && calendarState !== void 0 ? calendarState : rangeCalendarState;
+    let { startDate: startDate, weeksInMonth: weeksInMonth } = (0, $dCiKx$useContext)($dfd62f934fc76fed$var$InternalCalendarGridContext);
+    let DOMProps = (0, $dCiKx$filterDOMProps)(props, {
+        global: true
+    });
+    return /*#__PURE__*/ (0, $dCiKx$react).createElement((0, $64fa3d84918910a7$export$df3a06d6289f983e).tbody, {
+        render: props.render,
+        ...DOMProps,
+        ref: ref,
+        style: style,
+        className: className !== null && className !== void 0 ? className : 'react-aria-CalendarGridBody'
+    }, [
+        ...new Array(weeksInMonth).keys()
+    ].map((weekIndex)=>/*#__PURE__*/ (0, $dCiKx$react).createElement("tr", {
+            key: weekIndex
+        }, state.getDatesInWeek(weekIndex, startDate).map((date, i)=>date ? /*#__PURE__*/ (0, $dCiKx$react).cloneElement(children(date), {
+                key: i
+            }) : /*#__PURE__*/ (0, $dCiKx$react).createElement("td", {
+                key: i
+            })))));
+}
+/**
+ * A calendar grid body displays a grid of calendar cells within a month.
+ */ const $dfd62f934fc76fed$export$e11f8ba65d857bff = /*#__PURE__*/ (0, $dCiKx$forwardRef)($dfd62f934fc76fed$var$CalendarGridBody);
+const $dfd62f934fc76fed$export$5d847498420df57b = /*#__PURE__*/ (0, $dCiKx$forwardRef)(function CalendarCell({ date: date, ...otherProps }, ref) {
+    let calendarState = (0, $dCiKx$useContext)($dfd62f934fc76fed$export$9e31dcedda1dadc7);
+    let rangeCalendarState = (0, $dCiKx$useContext)($dfd62f934fc76fed$export$5e0fc348c00f87a0);
+    let state = calendarState !== null && calendarState !== void 0 ? calendarState : rangeCalendarState;
+    var _useContext;
+    let { startDate: currentMonth } = (_useContext = (0, $dCiKx$useContext)($dfd62f934fc76fed$var$InternalCalendarGridContext)) !== null && _useContext !== void 0 ? _useContext : {
+        startDate: state.visibleRange.start
+    };
+    let isOutsideMonth = !(0, $dCiKx$isSameMonth)(currentMonth, date);
+    let istoday = (0, $dCiKx$isToday)(date, state.timeZone);
+    let buttonRef = (0, $dCiKx$useRef)(null);
+    let { cellProps: cellProps, buttonProps: buttonProps, ...states } = (0, $dCiKx$useCalendarCell)({
+        date: date,
+        isOutsideMonth: isOutsideMonth
+    }, state, buttonRef);
+    let { hoverProps: hoverProps, isHovered: isHovered } = (0, $dCiKx$useHover)({
+        ...otherProps,
+        isDisabled: states.isDisabled
+    });
+    let { focusProps: focusProps, isFocusVisible: isFocusVisible } = (0, $dCiKx$useFocusRing)();
+    isFocusVisible && (isFocusVisible = states.isFocused);
+    let isSelectionStart = false;
+    let isSelectionEnd = false;
+    if ('highlightedRange' in state && state.highlightedRange) {
+        isSelectionStart = (0, $dCiKx$isSameDay)(date, state.highlightedRange.start);
+        isSelectionEnd = (0, $dCiKx$isSameDay)(date, state.highlightedRange.end);
+    }
+    let renderProps = (0, $64fa3d84918910a7$export$4d86445c2cf5e3)({
+        ...otherProps,
+        defaultChildren: states.formattedDate,
+        defaultClassName: 'react-aria-CalendarCell',
+        values: {
+            date: date,
+            isHovered: isHovered,
+            isOutsideMonth: isOutsideMonth,
+            isFocusVisible: isFocusVisible,
+            isSelectionStart: isSelectionStart,
+            isSelectionEnd: isSelectionEnd,
+            isToday: istoday,
+            ...states
+        }
+    });
+    let dataAttrs = {
+        'data-focused': states.isFocused || undefined,
+        'data-hovered': isHovered || undefined,
+        'data-pressed': states.isPressed || undefined,
+        'data-unavailable': states.isUnavailable || undefined,
+        'data-disabled': states.isDisabled || undefined,
+        'data-focus-visible': isFocusVisible || undefined,
+        'data-outside-visible-range': states.isOutsideVisibleRange || undefined,
+        'data-outside-month': isOutsideMonth || undefined,
+        'data-selected': states.isSelected || undefined,
+        'data-selection-start': isSelectionStart || undefined,
+        'data-selection-end': isSelectionEnd || undefined,
+        'data-invalid': states.isInvalid || undefined,
+        'data-today': istoday || undefined
+    };
+    let DOMProps = (0, $dCiKx$filterDOMProps)(otherProps, {
+        global: true
+    });
+    return /*#__PURE__*/ (0, $dCiKx$react).createElement("td", {
+        ...cellProps,
+        ref: ref
+    }, /*#__PURE__*/ (0, $dCiKx$react).createElement((0, $64fa3d84918910a7$export$df3a06d6289f983e).div, {
+        ...(0, $dCiKx$mergeProps)(DOMProps, buttonProps, focusProps, hoverProps, dataAttrs, renderProps),
+        ref: buttonRef
+    }));
+});
+
+
+export {$dfd62f934fc76fed$export$3b805cea1f178355 as CalendarContext, $dfd62f934fc76fed$export$233dd9682e1ad64b as RangeCalendarContext, $dfd62f934fc76fed$export$9e31dcedda1dadc7 as CalendarStateContext, $dfd62f934fc76fed$export$5e0fc348c00f87a0 as RangeCalendarStateContext, $dfd62f934fc76fed$export$e1aef45b828286de as Calendar, $dfd62f934fc76fed$export$a4f5c8b89d277a8d as RangeCalendar, $dfd62f934fc76fed$export$5bd780d491cfc46c as CalendarGrid, $dfd62f934fc76fed$export$22e2d15eaa4d2377 as CalendarGridHeader, $dfd62f934fc76fed$export$ad2135cac3a11b3d as CalendarHeaderCell, $dfd62f934fc76fed$export$e11f8ba65d857bff as CalendarGridBody, $dfd62f934fc76fed$export$5d847498420df57b as CalendarCell};
+//# sourceMappingURL=Calendar.module.js.map