Socket
Socket
Sign inDemoInstall

@react-aria/calendar

Package Overview
Dependencies
Maintainers
2
Versions
559
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@react-aria/calendar - npm Package Compare versions

Comparing version 3.5.7 to 3.5.8

26

dist/useCalendarBase.main.js

@@ -35,3 +35,3 @@ var $df1d8e967e73ec8e$exports = require("./utils.main.js");

function $02ef492a56b91cb2$export$d652b3ea2d672d5b(props, state) {
let stringFormatter = (0, $dPWPO$reactariai18n.useLocalizedStringFormatter)((0, ($parcel$interopDefault($bd6dc95a3c5ee5cd$exports))), "@react-aria/calendar");
let stringFormatter = (0, $dPWPO$reactariai18n.useLocalizedStringFormatter)((0, ($parcel$interopDefault($bd6dc95a3c5ee5cd$exports))), '@react-aria/calendar');
let domProps = (0, $dPWPO$reactariautils.filterDOMProps)(props);

@@ -50,3 +50,3 @@ let title = (0, $df1d8e967e73ec8e$exports.useVisibleRangeDescription)(state.visibleRange.start, state.visibleRange.end, state.timeZone, false);

(0, $dPWPO$reactariautils.useUpdateEffect)(()=>{
if (selectedDateDescription) (0, $dPWPO$reactarialiveannouncer.announce)(selectedDateDescription, "polite", 4000);
if (selectedDateDescription) (0, $dPWPO$reactarialiveannouncer.announce)(selectedDateDescription, 'polite', 4000);
// handle an update to the caption that describes the currently selected range, to announce the new value

@@ -63,4 +63,4 @@ }, [

(0, $df1d8e967e73ec8e$exports.hookData).set(state, {
ariaLabel: props["aria-label"],
ariaLabelledBy: props["aria-labelledby"],
ariaLabel: props['aria-label'],
ariaLabelledBy: props['aria-labelledby'],
errorMessageId: errorMessageId,

@@ -83,17 +83,17 @@ selectedDateDescription: selectedDateDescription

let labelProps = (0, $dPWPO$reactariautils.useLabels)({
id: props["id"],
"aria-label": [
props["aria-label"],
id: props['id'],
'aria-label': [
props['aria-label'],
visibleRangeDescription
].filter(Boolean).join(", "),
"aria-labelledby": props["aria-labelledby"]
].filter(Boolean).join(', '),
'aria-labelledby': props['aria-labelledby']
});
return {
calendarProps: (0, $dPWPO$reactariautils.mergeProps)(domProps, labelProps, {
role: "application",
"aria-describedby": props["aria-describedby"] || undefined
role: 'application',
'aria-describedby': props['aria-describedby'] || undefined
}),
nextButtonProps: {
onPress: ()=>state.focusNextPage(),
"aria-label": stringFormatter.format("next"),
'aria-label': stringFormatter.format('next'),
isDisabled: nextDisabled,

@@ -104,3 +104,3 @@ onFocusChange: setNextFocused

onPress: ()=>state.focusPreviousPage(),
"aria-label": stringFormatter.format("previous"),
'aria-label': stringFormatter.format('previous'),
isDisabled: previousDisabled,

@@ -107,0 +107,0 @@ onFocusChange: setPreviousFocused

@@ -29,3 +29,3 @@ import {hookData as $a074e1e2d0f0a665$export$653eddfc964b0f8a, useSelectedDateDescription as $a074e1e2d0f0a665$export$b6df97c887c38e1a, useVisibleRangeDescription as $a074e1e2d0f0a665$export$31afe65d91ef6e8} from "./utils.module.js";

function $c4acc1de3ab169cf$export$d652b3ea2d672d5b(props, state) {
let stringFormatter = (0, $g2t6q$useLocalizedStringFormatter)((0, ($parcel$interopDefault($g2t6q$intlStringsmodulejs))), "@react-aria/calendar");
let stringFormatter = (0, $g2t6q$useLocalizedStringFormatter)((0, ($parcel$interopDefault($g2t6q$intlStringsmodulejs))), '@react-aria/calendar');
let domProps = (0, $g2t6q$filterDOMProps)(props);

@@ -44,3 +44,3 @@ let title = (0, $a074e1e2d0f0a665$export$31afe65d91ef6e8)(state.visibleRange.start, state.visibleRange.end, state.timeZone, false);

(0, $g2t6q$useUpdateEffect)(()=>{
if (selectedDateDescription) (0, $g2t6q$announce)(selectedDateDescription, "polite", 4000);
if (selectedDateDescription) (0, $g2t6q$announce)(selectedDateDescription, 'polite', 4000);
// handle an update to the caption that describes the currently selected range, to announce the new value

@@ -57,4 +57,4 @@ }, [

(0, $a074e1e2d0f0a665$export$653eddfc964b0f8a).set(state, {
ariaLabel: props["aria-label"],
ariaLabelledBy: props["aria-labelledby"],
ariaLabel: props['aria-label'],
ariaLabelledBy: props['aria-labelledby'],
errorMessageId: errorMessageId,

@@ -77,17 +77,17 @@ selectedDateDescription: selectedDateDescription

let labelProps = (0, $g2t6q$useLabels)({
id: props["id"],
"aria-label": [
props["aria-label"],
id: props['id'],
'aria-label': [
props['aria-label'],
visibleRangeDescription
].filter(Boolean).join(", "),
"aria-labelledby": props["aria-labelledby"]
].filter(Boolean).join(', '),
'aria-labelledby': props['aria-labelledby']
});
return {
calendarProps: (0, $g2t6q$mergeProps)(domProps, labelProps, {
role: "application",
"aria-describedby": props["aria-describedby"] || undefined
role: 'application',
'aria-describedby': props['aria-describedby'] || undefined
}),
nextButtonProps: {
onPress: ()=>state.focusNextPage(),
"aria-label": stringFormatter.format("next"),
'aria-label': stringFormatter.format('next'),
isDisabled: nextDisabled,

@@ -98,3 +98,3 @@ onFocusChange: setNextFocused

onPress: ()=>state.focusPreviousPage(),
"aria-label": stringFormatter.format("previous"),
'aria-label': stringFormatter.format('previous'),
isDisabled: previousDisabled,

@@ -101,0 +101,0 @@ onFocusChange: setPreviousFocused

@@ -39,8 +39,8 @@ var $df1d8e967e73ec8e$exports = require("./utils.main.js");

let { errorMessageId: errorMessageId, selectedDateDescription: selectedDateDescription } = (0, $df1d8e967e73ec8e$exports.hookData).get(state);
let stringFormatter = (0, $cuS6T$reactariai18n.useLocalizedStringFormatter)((0, ($parcel$interopDefault($bd6dc95a3c5ee5cd$exports))), "@react-aria/calendar");
let stringFormatter = (0, $cuS6T$reactariai18n.useLocalizedStringFormatter)((0, ($parcel$interopDefault($bd6dc95a3c5ee5cd$exports))), '@react-aria/calendar');
let dateFormatter = (0, $cuS6T$reactariai18n.useDateFormatter)({
weekday: "long",
day: "numeric",
month: "long",
year: "numeric",
weekday: 'long',
day: 'numeric',
month: 'long',
year: 'numeric',
era: (0, $df1d8e967e73ec8e$exports.getEraFormat)(date),

@@ -54,3 +54,3 @@ timeZone: state.timeZone

let isSelectable = !isDisabled && !isUnavailable;
let isInvalid = state.isValueInvalid && ("highlightedRange" in state ? !state.anchorDate && state.highlightedRange && date.compare(state.highlightedRange.start) >= 0 && date.compare(state.highlightedRange.end) <= 0 : state.value && (0, $cuS6T$internationalizeddate.isSameDay)(state.value, date));
let isInvalid = state.isValueInvalid && ('highlightedRange' in state ? !state.anchorDate && state.highlightedRange && date.compare(state.highlightedRange.start) >= 0 && date.compare(state.highlightedRange.end) <= 0 : state.value && (0, $cuS6T$internationalizeddate.isSameDay)(state.value, date));
if (isInvalid) isSelected = true;

@@ -67,17 +67,17 @@ // For performance, reuse the same date object as before if the new date prop is the same.

let label = (0, $cuS6T$react.useMemo)(()=>{
let label = "";
let label = '';
// If this is a range calendar, add a description of the full selected range
// to the first and last selected date.
if ("highlightedRange" in state && state.value && !state.anchorDate && ((0, $cuS6T$internationalizeddate.isSameDay)(date, state.value.start) || (0, $cuS6T$internationalizeddate.isSameDay)(date, state.value.end))) label = selectedDateDescription + ", ";
if ('highlightedRange' in state && state.value && !state.anchorDate && ((0, $cuS6T$internationalizeddate.isSameDay)(date, state.value.start) || (0, $cuS6T$internationalizeddate.isSameDay)(date, state.value.end))) label = selectedDateDescription + ', ';
label += dateFormatter.format(nativeDate);
if (isDateToday) // If date is today, set appropriate string depending on selected state:
label = stringFormatter.format(isSelected ? "todayDateSelected" : "todayDate", {
label = stringFormatter.format(isSelected ? 'todayDateSelected' : 'todayDate', {
date: label
});
else if (isSelected) // If date is selected but not today:
label = stringFormatter.format("dateSelected", {
label = stringFormatter.format('dateSelected', {
date: label
});
if (state.minValue && (0, $cuS6T$internationalizeddate.isSameDay)(date, state.minValue)) label += ", " + stringFormatter.format("minimumDate");
else if (state.maxValue && (0, $cuS6T$internationalizeddate.isSameDay)(date, state.maxValue)) label += ", " + stringFormatter.format("maximumDate");
if (state.minValue && (0, $cuS6T$internationalizeddate.isSameDay)(date, state.minValue)) label += ', ' + stringFormatter.format('minimumDate');
else if (state.maxValue && (0, $cuS6T$internationalizeddate.isSameDay)(date, state.maxValue)) label += ', ' + stringFormatter.format('maximumDate');
return label;

@@ -96,7 +96,7 @@ }, [

// screenreader users know that they are in a range selection mode.
let rangeSelectionPrompt = "";
if ("anchorDate" in state && isFocused && !state.isReadOnly && isSelectable) {
let rangeSelectionPrompt = '';
if ('anchorDate' in state && isFocused && !state.isReadOnly && isSelectable) {
// If selection has started add "click to finish selecting range"
if (state.anchorDate) rangeSelectionPrompt = stringFormatter.format("finishRangeSelectionPrompt");
else rangeSelectionPrompt = stringFormatter.format("startRangeSelectionPrompt");
if (state.anchorDate) rangeSelectionPrompt = stringFormatter.format('finishRangeSelectionPrompt');
else rangeSelectionPrompt = stringFormatter.format('startRangeSelectionPrompt');
}

@@ -110,3 +110,3 @@ let descriptionProps = (0, $cuS6T$reactariautils.useDescription)(rangeSelectionPrompt);

// again to trigger onPressStart. Cancel presses immediately when the pointer exits.
shouldCancelOnPointerExit: "anchorDate" in state && !!state.anchorDate,
shouldCancelOnPointerExit: 'anchorDate' in state && !!state.anchorDate,
preventFocusOnPress: true,

@@ -119,3 +119,3 @@ isDisabled: !isSelectable || state.isReadOnly,

}
if ("highlightedRange" in state && !state.anchorDate && (e.pointerType === "mouse" || e.pointerType === "touch")) {
if ('highlightedRange' in state && !state.anchorDate && (e.pointerType === 'mouse' || e.pointerType === 'touch')) {
// Allow dragging the start or end date of a range to modify it

@@ -149,3 +149,3 @@ // rather than starting a new selection.

// On touch, delay dragging to determine if the user really meant to scroll.
if (e.pointerType === "touch") touchDragTimerRef.current = setTimeout(startDragging, 200);
if (e.pointerType === 'touch') touchDragTimerRef.current = setTimeout(startDragging, 200);
else startDragging();

@@ -162,3 +162,3 @@ }

// For non-range selection, always select on press up.
if (!("anchorDate" in state) && !state.isReadOnly) {
if (!('anchorDate' in state) && !state.isReadOnly) {
state.selectDate(date);

@@ -173,7 +173,7 @@ state.setFocusedDate(date);

// Timer is cleared in onPressEnd.
if ("anchorDate" in state && touchDragTimerRef.current) {
if ('anchorDate' in state && touchDragTimerRef.current) {
state.selectDate(date);
state.setFocusedDate(date);
}
if ("anchorDate" in state) {
if ('anchorDate' in state) {
if (isRangeBoundaryPressed.current) // When clicking on the start or end date of an already selected range,

@@ -187,3 +187,3 @@ // start a new selection on press up to also allow dragging the date to

state.setFocusedDate(date);
} else if (e.pointerType === "keyboard" && !state.anchorDate) {
} else if (e.pointerType === 'keyboard' && !state.anchorDate) {
// For range selection, auto-advance the focused date by one if using keyboard.

@@ -201,3 +201,3 @@ // This gives an indication that you're selecting a range rather than a single date.

if (!state.isInvalid(nextDay)) state.setFocusedDate(nextDay);
} else if (e.pointerType === "virtual") {
} else if (e.pointerType === 'virtual') {
// For screen readers, just select the date on click.

@@ -223,3 +223,3 @@ state.selectDate(date);

// an inert container and we don't want to scroll then.
if ((0, $cuS6T$reactariainteractions.getInteractionModality)() !== "pointer" && document.activeElement === ref.current) (0, $cuS6T$reactariautils.scrollIntoViewport)(ref.current, {
if ((0, $cuS6T$reactariainteractions.getInteractionModality)() !== 'pointer' && document.activeElement === ref.current) (0, $cuS6T$reactariautils.scrollIntoViewport)(ref.current, {
containingElement: (0, $cuS6T$reactariautils.getScrollParent)(ref.current)

@@ -233,7 +233,7 @@ });

let cellDateFormatter = (0, $cuS6T$reactariai18n.useDateFormatter)({
day: "numeric",
day: 'numeric',
timeZone: state.timeZone,
calendar: date.calendar.identifier
});
let formattedDate = (0, $cuS6T$react.useMemo)(()=>cellDateFormatter.formatToParts(nativeDate).find((part)=>part.type === "day").value, [
let formattedDate = (0, $cuS6T$react.useMemo)(()=>cellDateFormatter.formatToParts(nativeDate).find((part)=>part.type === 'day').value, [
cellDateFormatter,

@@ -244,6 +244,6 @@ nativeDate

cellProps: {
role: "gridcell",
"aria-disabled": !isSelectable || null,
"aria-selected": isSelected || null,
"aria-invalid": isInvalid || null
role: 'gridcell',
'aria-disabled': !isSelectable || null,
'aria-selected': isSelected || null,
'aria-invalid': isInvalid || null
},

@@ -255,13 +255,13 @@ buttonProps: (0, $cuS6T$reactariautils.mergeProps)(pressProps, {

tabIndex: tabIndex,
role: "button",
"aria-disabled": !isSelectable || null,
"aria-label": label,
"aria-invalid": isInvalid || null,
"aria-describedby": [
role: 'button',
'aria-disabled': !isSelectable || null,
'aria-label': label,
'aria-invalid': isInvalid || null,
'aria-describedby': [
isInvalid ? errorMessageId : null,
descriptionProps["aria-describedby"]
].filter(Boolean).join(" ") || undefined,
descriptionProps['aria-describedby']
].filter(Boolean).join(' ') || undefined,
onPointerEnter (e) {
// Highlight the date on hover or drag over a date when selecting a range.
if ("highlightDate" in state && (e.pointerType !== "touch" || state.isDragging) && isSelectable) state.highlightDate(date);
if ('highlightDate' in state && (e.pointerType !== 'touch' || state.isDragging) && isSelectable) state.highlightDate(date);
},

@@ -272,3 +272,3 @@ onPointerDown (e) {

// (JSDOM does not support this)
if ("releasePointerCapture" in e.target) e.target.releasePointerCapture(e.pointerId);
if ('releasePointerCapture' in e.target) e.target.releasePointerCapture(e.pointerId);
},

@@ -275,0 +275,0 @@ onContextMenu (e) {

@@ -33,8 +33,8 @@ import {getEraFormat as $a074e1e2d0f0a665$export$134cbb7fb09a9522, hookData as $a074e1e2d0f0a665$export$653eddfc964b0f8a} from "./utils.module.js";

let { errorMessageId: errorMessageId, selectedDateDescription: selectedDateDescription } = (0, $a074e1e2d0f0a665$export$653eddfc964b0f8a).get(state);
let stringFormatter = (0, $dm6hl$useLocalizedStringFormatter)((0, ($parcel$interopDefault($dm6hl$intlStringsmodulejs))), "@react-aria/calendar");
let stringFormatter = (0, $dm6hl$useLocalizedStringFormatter)((0, ($parcel$interopDefault($dm6hl$intlStringsmodulejs))), '@react-aria/calendar');
let dateFormatter = (0, $dm6hl$useDateFormatter)({
weekday: "long",
day: "numeric",
month: "long",
year: "numeric",
weekday: 'long',
day: 'numeric',
month: 'long',
year: 'numeric',
era: (0, $a074e1e2d0f0a665$export$134cbb7fb09a9522)(date),

@@ -48,3 +48,3 @@ timeZone: state.timeZone

let isSelectable = !isDisabled && !isUnavailable;
let isInvalid = state.isValueInvalid && ("highlightedRange" in state ? !state.anchorDate && state.highlightedRange && date.compare(state.highlightedRange.start) >= 0 && date.compare(state.highlightedRange.end) <= 0 : state.value && (0, $dm6hl$isSameDay)(state.value, date));
let isInvalid = state.isValueInvalid && ('highlightedRange' in state ? !state.anchorDate && state.highlightedRange && date.compare(state.highlightedRange.start) >= 0 && date.compare(state.highlightedRange.end) <= 0 : state.value && (0, $dm6hl$isSameDay)(state.value, date));
if (isInvalid) isSelected = true;

@@ -61,17 +61,17 @@ // For performance, reuse the same date object as before if the new date prop is the same.

let label = (0, $dm6hl$useMemo)(()=>{
let label = "";
let label = '';
// If this is a range calendar, add a description of the full selected range
// to the first and last selected date.
if ("highlightedRange" in state && state.value && !state.anchorDate && ((0, $dm6hl$isSameDay)(date, state.value.start) || (0, $dm6hl$isSameDay)(date, state.value.end))) label = selectedDateDescription + ", ";
if ('highlightedRange' in state && state.value && !state.anchorDate && ((0, $dm6hl$isSameDay)(date, state.value.start) || (0, $dm6hl$isSameDay)(date, state.value.end))) label = selectedDateDescription + ', ';
label += dateFormatter.format(nativeDate);
if (isDateToday) // If date is today, set appropriate string depending on selected state:
label = stringFormatter.format(isSelected ? "todayDateSelected" : "todayDate", {
label = stringFormatter.format(isSelected ? 'todayDateSelected' : 'todayDate', {
date: label
});
else if (isSelected) // If date is selected but not today:
label = stringFormatter.format("dateSelected", {
label = stringFormatter.format('dateSelected', {
date: label
});
if (state.minValue && (0, $dm6hl$isSameDay)(date, state.minValue)) label += ", " + stringFormatter.format("minimumDate");
else if (state.maxValue && (0, $dm6hl$isSameDay)(date, state.maxValue)) label += ", " + stringFormatter.format("maximumDate");
if (state.minValue && (0, $dm6hl$isSameDay)(date, state.minValue)) label += ', ' + stringFormatter.format('minimumDate');
else if (state.maxValue && (0, $dm6hl$isSameDay)(date, state.maxValue)) label += ', ' + stringFormatter.format('maximumDate');
return label;

@@ -90,7 +90,7 @@ }, [

// screenreader users know that they are in a range selection mode.
let rangeSelectionPrompt = "";
if ("anchorDate" in state && isFocused && !state.isReadOnly && isSelectable) {
let rangeSelectionPrompt = '';
if ('anchorDate' in state && isFocused && !state.isReadOnly && isSelectable) {
// If selection has started add "click to finish selecting range"
if (state.anchorDate) rangeSelectionPrompt = stringFormatter.format("finishRangeSelectionPrompt");
else rangeSelectionPrompt = stringFormatter.format("startRangeSelectionPrompt");
if (state.anchorDate) rangeSelectionPrompt = stringFormatter.format('finishRangeSelectionPrompt');
else rangeSelectionPrompt = stringFormatter.format('startRangeSelectionPrompt');
}

@@ -104,3 +104,3 @@ let descriptionProps = (0, $dm6hl$useDescription)(rangeSelectionPrompt);

// again to trigger onPressStart. Cancel presses immediately when the pointer exits.
shouldCancelOnPointerExit: "anchorDate" in state && !!state.anchorDate,
shouldCancelOnPointerExit: 'anchorDate' in state && !!state.anchorDate,
preventFocusOnPress: true,

@@ -113,3 +113,3 @@ isDisabled: !isSelectable || state.isReadOnly,

}
if ("highlightedRange" in state && !state.anchorDate && (e.pointerType === "mouse" || e.pointerType === "touch")) {
if ('highlightedRange' in state && !state.anchorDate && (e.pointerType === 'mouse' || e.pointerType === 'touch')) {
// Allow dragging the start or end date of a range to modify it

@@ -143,3 +143,3 @@ // rather than starting a new selection.

// On touch, delay dragging to determine if the user really meant to scroll.
if (e.pointerType === "touch") touchDragTimerRef.current = setTimeout(startDragging, 200);
if (e.pointerType === 'touch') touchDragTimerRef.current = setTimeout(startDragging, 200);
else startDragging();

@@ -156,3 +156,3 @@ }

// For non-range selection, always select on press up.
if (!("anchorDate" in state) && !state.isReadOnly) {
if (!('anchorDate' in state) && !state.isReadOnly) {
state.selectDate(date);

@@ -167,7 +167,7 @@ state.setFocusedDate(date);

// Timer is cleared in onPressEnd.
if ("anchorDate" in state && touchDragTimerRef.current) {
if ('anchorDate' in state && touchDragTimerRef.current) {
state.selectDate(date);
state.setFocusedDate(date);
}
if ("anchorDate" in state) {
if ('anchorDate' in state) {
if (isRangeBoundaryPressed.current) // When clicking on the start or end date of an already selected range,

@@ -181,3 +181,3 @@ // start a new selection on press up to also allow dragging the date to

state.setFocusedDate(date);
} else if (e.pointerType === "keyboard" && !state.anchorDate) {
} else if (e.pointerType === 'keyboard' && !state.anchorDate) {
// For range selection, auto-advance the focused date by one if using keyboard.

@@ -195,3 +195,3 @@ // This gives an indication that you're selecting a range rather than a single date.

if (!state.isInvalid(nextDay)) state.setFocusedDate(nextDay);
} else if (e.pointerType === "virtual") {
} else if (e.pointerType === 'virtual') {
// For screen readers, just select the date on click.

@@ -217,3 +217,3 @@ state.selectDate(date);

// an inert container and we don't want to scroll then.
if ((0, $dm6hl$getInteractionModality)() !== "pointer" && document.activeElement === ref.current) (0, $dm6hl$scrollIntoViewport)(ref.current, {
if ((0, $dm6hl$getInteractionModality)() !== 'pointer' && document.activeElement === ref.current) (0, $dm6hl$scrollIntoViewport)(ref.current, {
containingElement: (0, $dm6hl$getScrollParent)(ref.current)

@@ -227,7 +227,7 @@ });

let cellDateFormatter = (0, $dm6hl$useDateFormatter)({
day: "numeric",
day: 'numeric',
timeZone: state.timeZone,
calendar: date.calendar.identifier
});
let formattedDate = (0, $dm6hl$useMemo)(()=>cellDateFormatter.formatToParts(nativeDate).find((part)=>part.type === "day").value, [
let formattedDate = (0, $dm6hl$useMemo)(()=>cellDateFormatter.formatToParts(nativeDate).find((part)=>part.type === 'day').value, [
cellDateFormatter,

@@ -238,6 +238,6 @@ nativeDate

cellProps: {
role: "gridcell",
"aria-disabled": !isSelectable || null,
"aria-selected": isSelected || null,
"aria-invalid": isInvalid || null
role: 'gridcell',
'aria-disabled': !isSelectable || null,
'aria-selected': isSelected || null,
'aria-invalid': isInvalid || null
},

@@ -249,13 +249,13 @@ buttonProps: (0, $dm6hl$mergeProps)(pressProps, {

tabIndex: tabIndex,
role: "button",
"aria-disabled": !isSelectable || null,
"aria-label": label,
"aria-invalid": isInvalid || null,
"aria-describedby": [
role: 'button',
'aria-disabled': !isSelectable || null,
'aria-label': label,
'aria-invalid': isInvalid || null,
'aria-describedby': [
isInvalid ? errorMessageId : null,
descriptionProps["aria-describedby"]
].filter(Boolean).join(" ") || undefined,
descriptionProps['aria-describedby']
].filter(Boolean).join(' ') || undefined,
onPointerEnter (e) {
// Highlight the date on hover or drag over a date when selecting a range.
if ("highlightDate" in state && (e.pointerType !== "touch" || state.isDragging) && isSelectable) state.highlightDate(date);
if ('highlightDate' in state && (e.pointerType !== 'touch' || state.isDragging) && isSelectable) state.highlightDate(date);
},

@@ -266,3 +266,3 @@ onPointerDown (e) {

// (JSDOM does not support this)
if ("releasePointerCapture" in e.target) e.target.releasePointerCapture(e.pointerId);
if ('releasePointerCapture' in e.target) e.target.releasePointerCapture(e.pointerId);
},

@@ -269,0 +269,0 @@ onContextMenu (e) {

@@ -33,8 +33,8 @@ var $df1d8e967e73ec8e$exports = require("./utils.main.js");

switch(e.key){
case "Enter":
case " ":
case 'Enter':
case ' ':
e.preventDefault();
state.selectFocusedDate();
break;
case "PageUp":
case 'PageUp':
e.preventDefault();

@@ -44,3 +44,3 @@ e.stopPropagation();

break;
case "PageDown":
case 'PageDown':
e.preventDefault();

@@ -50,3 +50,3 @@ e.stopPropagation();

break;
case "End":
case 'End':
e.preventDefault();

@@ -56,3 +56,3 @@ e.stopPropagation();

break;
case "Home":
case 'Home':
e.preventDefault();

@@ -62,9 +62,9 @@ e.stopPropagation();

break;
case "ArrowLeft":
case 'ArrowLeft':
e.preventDefault();
e.stopPropagation();
if (direction === "rtl") state.focusNextDay();
if (direction === 'rtl') state.focusNextDay();
else state.focusPreviousDay();
break;
case "ArrowUp":
case 'ArrowUp':
e.preventDefault();

@@ -74,9 +74,9 @@ e.stopPropagation();

break;
case "ArrowRight":
case 'ArrowRight':
e.preventDefault();
e.stopPropagation();
if (direction === "rtl") state.focusPreviousDay();
if (direction === 'rtl') state.focusPreviousDay();
else state.focusNextDay();
break;
case "ArrowDown":
case 'ArrowDown':
e.preventDefault();

@@ -86,5 +86,5 @@ e.stopPropagation();

break;
case "Escape":
case 'Escape':
// Cancel the selection.
if ("setAnchorDate" in state) {
if ('setAnchorDate' in state) {
e.preventDefault();

@@ -99,10 +99,10 @@ state.setAnchorDate(null);

let labelProps = (0, $iASLq$reactariautils.useLabels)({
"aria-label": [
'aria-label': [
ariaLabel,
visibleRangeDescription
].filter(Boolean).join(", "),
"aria-labelledby": ariaLabelledBy
].filter(Boolean).join(', '),
'aria-labelledby': ariaLabelledBy
});
let dayFormatter = (0, $iASLq$reactariai18n.useDateFormatter)({
weekday: props.weekdayStyle || "narrow",
weekday: props.weekdayStyle || 'narrow',
timeZone: state.timeZone

@@ -129,6 +129,6 @@ });

gridProps: (0, $iASLq$reactariautils.mergeProps)(labelProps, {
role: "grid",
"aria-readonly": state.isReadOnly || null,
"aria-disabled": state.isDisabled || null,
"aria-multiselectable": "highlightedRange" in state || undefined,
role: 'grid',
'aria-readonly': state.isReadOnly || null,
'aria-disabled': state.isDisabled || null,
'aria-multiselectable': 'highlightedRange' in state || undefined,
onKeyDown: onKeyDown,

@@ -141,3 +141,3 @@ onFocus: ()=>state.setFocused(true),

// The day names are already included in the label of each cell, so there's no need to announce them twice.
"aria-hidden": true
'aria-hidden': true
},

@@ -144,0 +144,0 @@ weekDays: weekDays

@@ -27,8 +27,8 @@ import {hookData as $a074e1e2d0f0a665$export$653eddfc964b0f8a, useVisibleRangeDescription as $a074e1e2d0f0a665$export$31afe65d91ef6e8} from "./utils.module.js";

switch(e.key){
case "Enter":
case " ":
case 'Enter':
case ' ':
e.preventDefault();
state.selectFocusedDate();
break;
case "PageUp":
case 'PageUp':
e.preventDefault();

@@ -38,3 +38,3 @@ e.stopPropagation();

break;
case "PageDown":
case 'PageDown':
e.preventDefault();

@@ -44,3 +44,3 @@ e.stopPropagation();

break;
case "End":
case 'End':
e.preventDefault();

@@ -50,3 +50,3 @@ e.stopPropagation();

break;
case "Home":
case 'Home':
e.preventDefault();

@@ -56,9 +56,9 @@ e.stopPropagation();

break;
case "ArrowLeft":
case 'ArrowLeft':
e.preventDefault();
e.stopPropagation();
if (direction === "rtl") state.focusNextDay();
if (direction === 'rtl') state.focusNextDay();
else state.focusPreviousDay();
break;
case "ArrowUp":
case 'ArrowUp':
e.preventDefault();

@@ -68,9 +68,9 @@ e.stopPropagation();

break;
case "ArrowRight":
case 'ArrowRight':
e.preventDefault();
e.stopPropagation();
if (direction === "rtl") state.focusPreviousDay();
if (direction === 'rtl') state.focusPreviousDay();
else state.focusNextDay();
break;
case "ArrowDown":
case 'ArrowDown':
e.preventDefault();

@@ -80,5 +80,5 @@ e.stopPropagation();

break;
case "Escape":
case 'Escape':
// Cancel the selection.
if ("setAnchorDate" in state) {
if ('setAnchorDate' in state) {
e.preventDefault();

@@ -93,10 +93,10 @@ state.setAnchorDate(null);

let labelProps = (0, $NQfxu$useLabels)({
"aria-label": [
'aria-label': [
ariaLabel,
visibleRangeDescription
].filter(Boolean).join(", "),
"aria-labelledby": ariaLabelledBy
].filter(Boolean).join(', '),
'aria-labelledby': ariaLabelledBy
});
let dayFormatter = (0, $NQfxu$useDateFormatter)({
weekday: props.weekdayStyle || "narrow",
weekday: props.weekdayStyle || 'narrow',
timeZone: state.timeZone

@@ -123,6 +123,6 @@ });

gridProps: (0, $NQfxu$mergeProps)(labelProps, {
role: "grid",
"aria-readonly": state.isReadOnly || null,
"aria-disabled": state.isDisabled || null,
"aria-multiselectable": "highlightedRange" in state || undefined,
role: 'grid',
'aria-readonly': state.isReadOnly || null,
'aria-disabled': state.isDisabled || null,
'aria-multiselectable': 'highlightedRange' in state || undefined,
onKeyDown: onKeyDown,

@@ -135,3 +135,3 @@ onFocus: ()=>state.setFocused(true),

// The day names are already included in the label of each cell, so there's no need to announce them twice.
"aria-hidden": true
'aria-hidden': true
},

@@ -138,0 +138,0 @@ weekDays: weekDays

@@ -33,4 +33,4 @@ var $02ef492a56b91cb2$exports = require("./useCalendarBase.main.js");

let isVirtualClick = (0, $3kfPe$react.useRef)(false);
let windowRef = (0, $3kfPe$react.useRef)(typeof window !== "undefined" ? window : null);
(0, $3kfPe$reactariautils.useEvent)(windowRef, "pointerdown", (e)=>{
let windowRef = (0, $3kfPe$react.useRef)(typeof window !== 'undefined' ? window : null);
(0, $3kfPe$reactariautils.useEvent)(windowRef, 'pointerdown', (e)=>{
isVirtualClick.current = e.width === 0 && e.height === 0;

@@ -50,3 +50,3 @@ });

};
(0, $3kfPe$reactariautils.useEvent)(windowRef, "pointerup", endDragging);
(0, $3kfPe$reactariautils.useEvent)(windowRef, 'pointerup', endDragging);
// Also stop range selection on blur, e.g. tabbing away from the calendar.

@@ -58,3 +58,3 @@ res.calendarProps.onBlur = (e)=>{

// Prevent touch scrolling while dragging
(0, $3kfPe$reactariautils.useEvent)(ref, "touchmove", (e)=>{
(0, $3kfPe$reactariautils.useEvent)(ref, 'touchmove', (e)=>{
if (state.isDragging) e.preventDefault();

@@ -61,0 +61,0 @@ }, {

@@ -27,4 +27,4 @@ import {useCalendarBase as $c4acc1de3ab169cf$export$d652b3ea2d672d5b} from "./useCalendarBase.module.js";

let isVirtualClick = (0, $juhpn$useRef)(false);
let windowRef = (0, $juhpn$useRef)(typeof window !== "undefined" ? window : null);
(0, $juhpn$useEvent)(windowRef, "pointerdown", (e)=>{
let windowRef = (0, $juhpn$useRef)(typeof window !== 'undefined' ? window : null);
(0, $juhpn$useEvent)(windowRef, 'pointerdown', (e)=>{
isVirtualClick.current = e.width === 0 && e.height === 0;

@@ -44,3 +44,3 @@ });

};
(0, $juhpn$useEvent)(windowRef, "pointerup", endDragging);
(0, $juhpn$useEvent)(windowRef, 'pointerup', endDragging);
// Also stop range selection on blur, e.g. tabbing away from the calendar.

@@ -52,3 +52,3 @@ res.calendarProps.onBlur = (e)=>{

// Prevent touch scrolling while dragging
(0, $juhpn$useEvent)(ref, "touchmove", (e)=>{
(0, $juhpn$useEvent)(ref, 'touchmove', (e)=>{
if (state.isDragging) e.preventDefault();

@@ -55,0 +55,0 @@ }, {

@@ -35,18 +35,18 @@ var $bd6dc95a3c5ee5cd$exports = require("./intlStrings.main.js");

function $df1d8e967e73ec8e$export$134cbb7fb09a9522(date) {
return (date === null || date === void 0 ? void 0 : date.calendar.identifier) === "gregory" && date.era === "BC" ? "short" : undefined;
return (date === null || date === void 0 ? void 0 : date.calendar.identifier) === 'gregory' && date.era === 'BC' ? 'short' : undefined;
}
function $df1d8e967e73ec8e$export$b6df97c887c38e1a(state) {
let stringFormatter = (0, $idq92$reactariai18n.useLocalizedStringFormatter)((0, ($parcel$interopDefault($bd6dc95a3c5ee5cd$exports))), "@react-aria/calendar");
let stringFormatter = (0, $idq92$reactariai18n.useLocalizedStringFormatter)((0, ($parcel$interopDefault($bd6dc95a3c5ee5cd$exports))), '@react-aria/calendar');
let start, end;
if ("highlightedRange" in state) ({ start: start, end: end } = state.highlightedRange || {});
if ('highlightedRange' in state) ({ start: start, end: end } = state.highlightedRange || {});
else start = end = state.value;
let dateFormatter = (0, $idq92$reactariai18n.useDateFormatter)({
weekday: "long",
month: "long",
year: "numeric",
day: "numeric",
weekday: 'long',
month: 'long',
year: 'numeric',
day: 'numeric',
era: $df1d8e967e73ec8e$export$134cbb7fb09a9522(start) || $df1d8e967e73ec8e$export$134cbb7fb09a9522(end),
timeZone: state.timeZone
});
let anchorDate = "anchorDate" in state ? state.anchorDate : null;
let anchorDate = 'anchorDate' in state ? state.anchorDate : null;
return (0, $idq92$react.useMemo)(()=>{

@@ -59,3 +59,3 @@ // No message if currently selecting a range, or there is nothing highlighted.

let date = dateFormatter.format(start.toDate(state.timeZone));
return stringFormatter.format("selectedDateDescription", {
return stringFormatter.format('selectedDateDescription', {
date: date

@@ -65,3 +65,3 @@ });

let dateRange = $df1d8e967e73ec8e$var$formatRange(dateFormatter, stringFormatter, start, end, state.timeZone);
return stringFormatter.format("selectedRangeDescription", {
return stringFormatter.format('selectedRangeDescription', {
dateRange: dateRange

@@ -71,3 +71,3 @@ });

}
return "";
return '';
}, [

@@ -83,7 +83,7 @@ start,

function $df1d8e967e73ec8e$export$31afe65d91ef6e8(startDate, endDate, timeZone, isAria) {
let stringFormatter = (0, $idq92$reactariai18n.useLocalizedStringFormatter)((0, ($parcel$interopDefault($bd6dc95a3c5ee5cd$exports))), "@react-aria/calendar");
let stringFormatter = (0, $idq92$reactariai18n.useLocalizedStringFormatter)((0, ($parcel$interopDefault($bd6dc95a3c5ee5cd$exports))), '@react-aria/calendar');
let era = $df1d8e967e73ec8e$export$134cbb7fb09a9522(startDate) || $df1d8e967e73ec8e$export$134cbb7fb09a9522(endDate);
let monthFormatter = (0, $idq92$reactariai18n.useDateFormatter)({
month: "long",
year: "numeric",
month: 'long',
year: 'numeric',
era: era,

@@ -94,5 +94,5 @@ calendar: startDate.calendar.identifier,

let dateFormatter = (0, $idq92$reactariai18n.useDateFormatter)({
month: "long",
year: "numeric",
day: "numeric",
month: 'long',
year: 'numeric',
day: 'numeric',
era: era,

@@ -127,8 +127,8 @@ calendar: startDate.calendar.identifier,

let part = parts[i];
if (part.source === "shared" && part.type === "literal") separatorIndex = i;
else if (part.source === "endRange") break;
if (part.source === 'shared' && part.type === 'literal') separatorIndex = i;
else if (part.source === 'endRange') break;
}
// Now we can combine the parts into start and end strings.
let startValue = "";
let endValue = "";
let startValue = '';
let endValue = '';
for(let i = 0; i < parts.length; i++){

@@ -138,3 +138,3 @@ if (i < separatorIndex) startValue += parts[i].value;

}
return stringFormatter.format("dateRange", {
return stringFormatter.format('dateRange', {
startDate: startValue,

@@ -141,0 +141,0 @@ endDate: endValue

@@ -26,18 +26,18 @@ import $3HATx$intlStringsmodulejs from "./intlStrings.module.js";

function $a074e1e2d0f0a665$export$134cbb7fb09a9522(date) {
return (date === null || date === void 0 ? void 0 : date.calendar.identifier) === "gregory" && date.era === "BC" ? "short" : undefined;
return (date === null || date === void 0 ? void 0 : date.calendar.identifier) === 'gregory' && date.era === 'BC' ? 'short' : undefined;
}
function $a074e1e2d0f0a665$export$b6df97c887c38e1a(state) {
let stringFormatter = (0, $3HATx$useLocalizedStringFormatter)((0, ($parcel$interopDefault($3HATx$intlStringsmodulejs))), "@react-aria/calendar");
let stringFormatter = (0, $3HATx$useLocalizedStringFormatter)((0, ($parcel$interopDefault($3HATx$intlStringsmodulejs))), '@react-aria/calendar');
let start, end;
if ("highlightedRange" in state) ({ start: start, end: end } = state.highlightedRange || {});
if ('highlightedRange' in state) ({ start: start, end: end } = state.highlightedRange || {});
else start = end = state.value;
let dateFormatter = (0, $3HATx$useDateFormatter)({
weekday: "long",
month: "long",
year: "numeric",
day: "numeric",
weekday: 'long',
month: 'long',
year: 'numeric',
day: 'numeric',
era: $a074e1e2d0f0a665$export$134cbb7fb09a9522(start) || $a074e1e2d0f0a665$export$134cbb7fb09a9522(end),
timeZone: state.timeZone
});
let anchorDate = "anchorDate" in state ? state.anchorDate : null;
let anchorDate = 'anchorDate' in state ? state.anchorDate : null;
return (0, $3HATx$useMemo)(()=>{

@@ -50,3 +50,3 @@ // No message if currently selecting a range, or there is nothing highlighted.

let date = dateFormatter.format(start.toDate(state.timeZone));
return stringFormatter.format("selectedDateDescription", {
return stringFormatter.format('selectedDateDescription', {
date: date

@@ -56,3 +56,3 @@ });

let dateRange = $a074e1e2d0f0a665$var$formatRange(dateFormatter, stringFormatter, start, end, state.timeZone);
return stringFormatter.format("selectedRangeDescription", {
return stringFormatter.format('selectedRangeDescription', {
dateRange: dateRange

@@ -62,3 +62,3 @@ });

}
return "";
return '';
}, [

@@ -74,7 +74,7 @@ start,

function $a074e1e2d0f0a665$export$31afe65d91ef6e8(startDate, endDate, timeZone, isAria) {
let stringFormatter = (0, $3HATx$useLocalizedStringFormatter)((0, ($parcel$interopDefault($3HATx$intlStringsmodulejs))), "@react-aria/calendar");
let stringFormatter = (0, $3HATx$useLocalizedStringFormatter)((0, ($parcel$interopDefault($3HATx$intlStringsmodulejs))), '@react-aria/calendar');
let era = $a074e1e2d0f0a665$export$134cbb7fb09a9522(startDate) || $a074e1e2d0f0a665$export$134cbb7fb09a9522(endDate);
let monthFormatter = (0, $3HATx$useDateFormatter)({
month: "long",
year: "numeric",
month: 'long',
year: 'numeric',
era: era,

@@ -85,5 +85,5 @@ calendar: startDate.calendar.identifier,

let dateFormatter = (0, $3HATx$useDateFormatter)({
month: "long",
year: "numeric",
day: "numeric",
month: 'long',
year: 'numeric',
day: 'numeric',
era: era,

@@ -118,8 +118,8 @@ calendar: startDate.calendar.identifier,

let part = parts[i];
if (part.source === "shared" && part.type === "literal") separatorIndex = i;
else if (part.source === "endRange") break;
if (part.source === 'shared' && part.type === 'literal') separatorIndex = i;
else if (part.source === 'endRange') break;
}
// Now we can combine the parts into start and end strings.
let startValue = "";
let endValue = "";
let startValue = '';
let endValue = '';
for(let i = 0; i < parts.length; i++){

@@ -129,3 +129,3 @@ if (i < separatorIndex) startValue += parts[i].value;

}
return stringFormatter.format("dateRange", {
return stringFormatter.format('dateRange', {
startDate: startValue,

@@ -132,0 +132,0 @@ endDate: endValue

{
"name": "@react-aria/calendar",
"version": "3.5.7",
"version": "3.5.8",
"description": "Spectrum UI components in React",

@@ -25,11 +25,11 @@ "license": "Apache-2.0",

"dependencies": {
"@internationalized/date": "^3.5.3",
"@react-aria/i18n": "^3.11.0",
"@react-aria/interactions": "^3.21.2",
"@react-aria/live-announcer": "^3.3.3",
"@react-aria/utils": "^3.24.0",
"@react-stately/calendar": "^3.5.0",
"@react-types/button": "^3.9.3",
"@react-types/calendar": "^3.4.5",
"@react-types/shared": "^3.23.0",
"@internationalized/date": "^3.5.4",
"@react-aria/i18n": "^3.11.1",
"@react-aria/interactions": "^3.21.3",
"@react-aria/live-announcer": "^3.3.4",
"@react-aria/utils": "^3.24.1",
"@react-stately/calendar": "^3.5.1",
"@react-types/button": "^3.9.4",
"@react-types/calendar": "^3.4.6",
"@react-types/shared": "^3.23.1",
"@swc/helpers": "^0.5.0"

@@ -44,3 +44,3 @@ },

},
"gitHead": "f645f29edc1322153fd60af4640cbcab1d992dbd"
"gitHead": "b77d7d594dff4dcfb5359bffbcfd18142b146433"
}

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc