Function useCalendarCell

packages/react-aria/src/calendar/useCalendarCell.ts:89–411

(
  props: AriaCalendarCellProps,
  state: CalendarState<CalendarSelectionMode> | RangeCalendarState,
  ref: RefObject<HTMLElement | null>
)

 * A calendar cell displays a date cell within a calendar grid which can be selected by the user.
 */
export function useCalendarCell(
  props: AriaCalendarCellProps,
  state: CalendarState<CalendarSelectionMode> | RangeCalendarState,
  ref: RefObject<HTMLElement | null>
): CalendarCellAria {
  let {date, isDisabled} = props;
  let {errorMessageId, selectedDateDescription} = hookData.get(state)!;
  let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-aria/calendar');
  let dateFormatter = useDateFormatter({
    weekday: 'long',
    day: 'numeric',
    month: 'long',
    year: 'numeric',
    era: getEraFormat(date),
    timeZone: state.timeZone
  });
  let isFocused = state.isCellFocused(date) && !props.isOutsideMonth;
  isDisabled = isDisabled || state.isCellDisabled(date) || !!props.isOutsideMonth;
  let isUnavailable = state.isCellUnavailable(date);
  let isSelectable = !isDisabled && !isUnavailable;
  let isSelected = state.isSelected(date) && isSelectable;
  let isInvalid = false;
  if (state.isValueInvalid) {
    if ('highlightedRange' in state) {
      isInvalid =
        !state.anchorDate &&
        state.highlightedRange != null &&
        date.compare(state.highlightedRange.start) >= 0 &&
        date.compare(state.highlightedRange.end) <= 0;
    } else if (Array.isArray(state.value)) {
      isInvalid = state.value.some(value => isSameDay(value, date));
    } else if (state.value) {
      isInvalid = isSameDay(state.value as CalendarDate, date);
    }
  }

  if (isInvalid && !isDisabled) {
    isSelected = true;
  }

  // For performance, reuse the same date object as before if the new date prop is the same.
  // This allows subsequent useMemo results to be reused.
  date = useDeepMemo<CalendarDate>(date, isEqualDay);
  let nativeDate = useMemo(() => date.toDate(state.timeZone), [date, state.timeZone]);

  // aria-label should be localize Day of week, Month, Day and Year without Time.
  let isDateToday = isToday(date, state.timeZone);
  let label = useMemo(() => {
    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 &&
      (isSameDay(date, state.value.start) || isSameDay(date, state.value.end))
    ) {