48 lines
1.8 KiB
JavaScript
48 lines
1.8 KiB
JavaScript
import { useState } from "react";
|
|
import { calculateFocusTarget } from "./helpers/calculateFocusTarget.js";
|
|
import { getNextFocus } from "./helpers/getNextFocus.js";
|
|
/**
|
|
* Manages focus behavior for the DayPicker component, including setting,
|
|
* moving, and blurring focus on calendar days.
|
|
*
|
|
* @template T - The type of DayPicker props.
|
|
* @param props - The DayPicker props.
|
|
* @param calendar - The calendar object containing the displayed days and
|
|
* months.
|
|
* @param getModifiers - A function to retrieve modifiers for a given day.
|
|
* @param isSelected - A function to check if a date is selected.
|
|
* @param dateLib - The date utility library instance.
|
|
* @returns An object containing focus-related methods and the currently focused
|
|
* day.
|
|
*/
|
|
export function useFocus(props, calendar, getModifiers, isSelected, dateLib) {
|
|
const { autoFocus } = props;
|
|
const [lastFocused, setLastFocused] = useState();
|
|
const focusTarget = calculateFocusTarget(calendar.days, getModifiers, isSelected || (() => false), lastFocused);
|
|
const [focusedDay, setFocused] = useState(autoFocus ? focusTarget : undefined);
|
|
const blur = () => {
|
|
setLastFocused(focusedDay);
|
|
setFocused(undefined);
|
|
};
|
|
const moveFocus = (moveBy, moveDir) => {
|
|
if (!focusedDay)
|
|
return;
|
|
const nextFocus = getNextFocus(moveBy, moveDir, focusedDay, calendar.navStart, calendar.navEnd, props, dateLib);
|
|
if (!nextFocus)
|
|
return;
|
|
calendar.goToDay(nextFocus);
|
|
setFocused(nextFocus);
|
|
};
|
|
const isFocusTarget = (day) => {
|
|
return Boolean(focusTarget?.isEqualTo(day));
|
|
};
|
|
const useFocus = {
|
|
isFocusTarget,
|
|
setFocused,
|
|
focused: focusedDay,
|
|
blur,
|
|
moveFocus
|
|
};
|
|
return useFocus;
|
|
}
|
|
//# sourceMappingURL=useFocus.js.map
|