@renderlesskit/react/dist/cjs/calendar/CalendarCell.js

Collection of headless components/hooks that are accessible, composable, customizable from low level to build your own UI & Design System powered by Reakit

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.useCalendarCell = exports.CalendarCell = void 0;

var _react = require("react");

var _reakit = require("reakit");

var _utils = require("@chakra-ui/utils");

var _system = require("../system");

var _utils2 = require("../utils");

var _keys = require("./__keys");

var _excluded = ["onMouseEnter"];

function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }

function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }

function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }

function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }

function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }

var useCalendarCell = (0, _system.createHook)({
  name: "CalendarCell",
  compose: _reakit.useRole,
  keys: _keys.CALENDAR_CELL_KEYS,
  useProps: function useProps(options, _ref) {
    var htmlOnMouseEnter = _ref.onMouseEnter,
        htmlProps = _objectWithoutProperties(_ref, _excluded);

    var isDisabled = options.isDisabled,
        highlightDate = options.highlightDate,
        date = options.date;
    var onMouseEnter = (0, _react.useCallback)(function () {
      if (isDisabled) return;
      highlightDate === null || highlightDate === void 0 ? void 0 : highlightDate(date);
    }, [date, highlightDate, isDisabled]);
    return _objectSpread(_objectSpread({
      role: "gridcell",
      "data-weekend": (0, _utils2.dataAttr)((0, _utils2.isWeekend)(date)),
      onMouseEnter: options.isRangeCalendar ? (0, _utils.callAllHandlers)(htmlOnMouseEnter, onMouseEnter) : htmlOnMouseEnter
    }, getCalendarCellProps(options)), htmlProps);
  }
});
exports.useCalendarCell = useCalendarCell;
var CalendarCell = (0, _system.createComponent)({
  as: "div",
  memo: true,
  useHook: useCalendarCell
});
exports.CalendarCell = CalendarCell;

var getCalendarCellProps = function getCalendarCellProps(options) {
  var date = options.date,
      dateValue = options.dateValue,
      highlightedRange = options.highlightedRange,
      currentMonth = options.currentMonth;

  if (options.isRangeCalendar) {
    var _isSelected = highlightedRange ? date >= highlightedRange.start && date <= highlightedRange.end : false;

    var isRangeStart = _isSelected && date.getDate() === 1;

    var isRangeEnd = _isSelected && date.getDate() === (0, _utils2.getDaysInMonth)(currentMonth);

    var isSelectionStart = highlightedRange ? (0, _utils2.isSameDay)(date, highlightedRange.start) : false;
    var isSelectionEnd = highlightedRange ? (0, _utils2.isSameDay)(date, highlightedRange.end) : false;
    return {
      "aria-selected": (0, _utils2.ariaAttr)(_isSelected),
      "data-is-range-selection": (0, _utils2.dataAttr)(_isSelected),
      "data-is-range-end": (0, _utils2.dataAttr)(isRangeEnd),
      "data-is-range-start": (0, _utils2.dataAttr)(isRangeStart),
      "data-is-selection-end": (0, _utils2.dataAttr)(isSelectionEnd),
      "data-is-selection-start": (0, _utils2.dataAttr)(isSelectionStart)
    };
  }

  var isSelected = dateValue ? (0, _utils2.isSameDay)(date, dateValue) : false;
  return {
    "aria-selected": (0, _utils2.ariaAttr)(isSelected)
  };
};
//# sourceMappingURL=CalendarCell.js.map