@hitachivantara/uikit-react-core/dist/cjs/Calendar/SingleCalendar/CalendarCell.cjs

Core React components for the NEXT Design System.

"use strict";
Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
const jsxRuntime = require("react/jsx-runtime");
const React = require("react");
const uikitReactUtils = require("@hitachivantara/uikit-react-utils");
const utils = require("../utils.cjs");
const CalendarCell_styles = require("./CalendarCell.styles.cjs");
const ButtonBase = require("../../ButtonBase/ButtonBase.cjs");
const Typography = require("../../Typography/Typography.cjs");
const HvCalendarCell = (props) => {
  const {
    classes: classesProp,
    onChange,
    calendarValue,
    firstDayOfCurrentMonth,
    value,
    isDateSelectionMode,
    today,
    locale,
    minimumDate,
    maximumDate,
    rangeMode = false,
    ...others
  } = uikitReactUtils.useDefaultProps("HvCalendarCell", props);
  const { classes, cx } = CalendarCell_styles.useClasses(classesProp);
  const buttonEl = React.useRef(null);
  const startDate = utils.isDateRangeProp(calendarValue) ? calendarValue.startDate : void 0;
  const endDate = utils.isDateRangeProp(calendarValue) ? calendarValue.endDate : void 0;
  const isCellToday = utils.isSameDay(value, today);
  const isCellSelected = utils.isSameDay(calendarValue, value);
  const inMonth = utils.isSameMonth(value, firstDayOfCurrentMonth);
  const isCellAfterStartingDate = rangeMode && value && startDate ? value >= startDate : false;
  const isCellStartingDate = rangeMode ? utils.isSameDay(value, startDate) : false;
  const isDateInSelectionRange = calendarValue && rangeMode ? utils.dateInProvidedValueRange(value, calendarValue) : false;
  const isDateDisabled = utils.checkIfDateIsDisabled(value, minimumDate, maximumDate);
  const startBookend = utils.isSameDay(startDate, value);
  const endBookend = utils.isSameDay(endDate, value);
  const isSelecting = isDateSelectionMode && isCellAfterStartingDate;
  const handleClick = (event) => {
    if (value) {
      onChange?.(event, value);
      if (buttonEl.current) setTimeout(() => buttonEl?.current?.focus());
    }
  };
  const renderDate = () => /* @__PURE__ */ jsxRuntime.jsx(
    ButtonBase.HvButtonBase,
    {
      ref: buttonEl,
      className: classes.cellContainer,
      onClick: handleClick,
      disabled: isDateDisabled || !inMonth,
      "data-in-month": inMonth,
      ...others,
      children: /* @__PURE__ */ jsxRuntime.jsx(
        Typography.HvTypography,
        {
          component: "span",
          variant: isCellToday ? "label" : "body",
          className: cx(classes.calendarDate, {
            [classes.calendarDateSelected]: inMonth && isCellSelected,
            [classes.calendarDateNotInMonth]: !inMonth,
            [classes.calendarDateInSelectionRange]: inMonth && rangeMode && isDateInSelectionRange,
            [classes.calendarDateDisabled]: isDateDisabled,
            [classes.startBookend]: inMonth && (startBookend && rangeMode || isCellStartingDate && isDateSelectionMode),
            [classes.endBookend]: inMonth && endBookend && rangeMode
          }),
          children: value?.getDate()
        }
      )
    }
  );
  return /* @__PURE__ */ jsxRuntime.jsx(
    "div",
    {
      className: cx(classes.dateWrapper, {
        [classes.cellsInRange]: inMonth && rangeMode && isSelecting,
        [classes.cellsOutsideRange]: rangeMode && !isSelecting
      }),
      "data-calendar-cell": "calendarCell",
      children: renderDate()
    }
  );
};
exports.calendarCellClasses = CalendarCell_styles.staticClasses;
exports.HvCalendarCell = HvCalendarCell;
exports.default = HvCalendarCell;