fomantic-ui-react/es/calendar/Calendar.js

Fomantic-UI React -- A React Component Library.

/**
 * fomantic-ui-react v0.0.1-alpha.10
 * (c) 2022 FireLoong <fireloong@foxmail.com>
 * @license MIT
 */

import { _ as _toConsumableArray } from '../_chunks/dep-529aef5e.js';
import { _ as _slicedToArray } from '../_chunks/dep-dc9b74a1.js';
import { _ as _defineProperty, a as _objectWithoutProperties } from '../_chunks/dep-9f1126c1.js';
import classNames from 'classnames';
import dayjs from 'dayjs';
import React, { useState, useCallback, useMemo, createElement } from 'react';
import { createDateList } from './util.js';
import { useLocaleReceiver } from '../locale/LocalReceiver.js';
import '../configProvider/index.js';
import '../configProvider/ConfigProvider.js';
import '../configProvider/ConfigContext.js';
import '../locale/zh_CN.js';
import '../configProvider/type.js';

var _excluded = ["as", "className", "mode", "value", "format", "isShowWeekendDefault", "firstDayOfWeek", "week", "controllerConfig", "onMonthChange"];

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; }

var getDefaultControllerConfigData = function getDefaultControllerConfigData() {
  var visible = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;
  return {
    visible: visible,
    disabled: false,
    mode: {
      visible: true,
      radioGroupProps: {}
    },
    year: {
      visible: true,
      selectProps: {
        popupProps: {
          overlayStyle: {
            width: "110px"
          }
        }
      }
    },
    month: {
      visible: true,
      selectProps: {
        popupProps: {
          overlayStyle: {
            width: "90px"
          }
        }
      }
    },
    weekend: {
      visible: true,
      showWeekendButtonProps: {},
      hideWeekendButtonProps: {}
    },
    current: {
      visible: true,
      currentDayButtonProps: {},
      currentMonthButtonProps: {}
    }
  };
};

var Calendar = function Calendar(_ref) {
  var _ref$as = _ref.as,
      as = _ref$as === void 0 ? "div" : _ref$as,
      className = _ref.className,
      _ref$mode = _ref.mode,
      modeFromProps = _ref$mode === void 0 ? "month" : _ref$mode,
      valueFromProps = _ref.value,
      _ref$format = _ref.format,
      format = _ref$format === void 0 ? "YYYY-MM-DD" : _ref$format,
      _ref$isShowWeekendDef = _ref.isShowWeekendDefault,
      isShowWeekendDefault = _ref$isShowWeekendDef === void 0 ? true : _ref$isShowWeekendDef,
      _ref$firstDayOfWeek = _ref.firstDayOfWeek,
      firstDayOfWeek = _ref$firstDayOfWeek === void 0 ? 1 : _ref$firstDayOfWeek,
      week = _ref.week,
      _ref$controllerConfig = _ref.controllerConfig,
      controllerConfig = _ref$controllerConfig === void 0 ? true : _ref$controllerConfig,
      _ref$onMonthChange = _ref.onMonthChange,
      onMonthChange = _ref$onMonthChange === void 0 ? function () {} : _ref$onMonthChange,
      props = _objectWithoutProperties(_ref, _excluded);

  if (!as) {
    as = "div";
  }

  var controllerConfigData = typeof controllerConfig === "boolean" ? getDefaultControllerConfigData(controllerConfig) : _objectSpread(_objectSpread({}, getDefaultControllerConfigData()), controllerConfig);
  var visible = controllerConfigData.visible,
      disabled = controllerConfigData.disabled,
      modeFromConfig = controllerConfigData.mode,
      yearFromConfig = controllerConfigData.year,
      monthFromConfig = controllerConfigData.month,
      weekend = controllerConfigData.weekend,
      current = controllerConfigData.current;
  var _modeFromConfig$visib = modeFromConfig.visible,
      visibleForMode = _modeFromConfig$visib === void 0 ? true : _modeFromConfig$visib,
      _modeFromConfig$radio = modeFromConfig.radioGroupProps,
      radioGroupPropsForMode = _modeFromConfig$radio === void 0 ? {} : _modeFromConfig$radio;
  var _yearFromConfig$visib = yearFromConfig.visible,
      visibleForYear = _yearFromConfig$visib === void 0 ? true : _yearFromConfig$visib,
      _yearFromConfig$selec = yearFromConfig.selectProps,
      selectPropsForYear = _yearFromConfig$selec === void 0 ? {} : _yearFromConfig$selec;
  var _monthFromConfig$visi = monthFromConfig.visible,
      visibleForMonth = _monthFromConfig$visi === void 0 ? true : _monthFromConfig$visi,
      _monthFromConfig$sele = monthFromConfig.selectProps,
      selectPropsForMonth = _monthFromConfig$sele === void 0 ? {} : _monthFromConfig$sele;
  var _weekend$visible = weekend.visible,
      visibleForWeekendToggle = _weekend$visible === void 0 ? true : _weekend$visible,
      _weekend$showWeekendB = weekend.showWeekendButtonProps,
      showWeekendButtonProps = _weekend$showWeekendB === void 0 ? {} : _weekend$showWeekendB,
      _weekend$hideWeekendB = weekend.hideWeekendButtonProps,
      hideWeekendButtonProps = _weekend$hideWeekendB === void 0 ? {} : _weekend$hideWeekendB;
  var _current$visible = current.visible,
      visibleForCurrent = _current$visible === void 0 ? true : _current$visible,
      _current$currentDayBu = current.currentDayButtonProps,
      currentDayButtonProps = _current$currentDayBu === void 0 ? {} : _current$currentDayBu,
      _current$currentMonth = current.currentMonthButtonProps,
      currentMonthButtonProps = _current$currentMonth === void 0 ? {} : _current$currentMonth;

  var _useState = useState("month"),
      _useState2 = _slicedToArray(_useState, 2),
      mode = _useState2[0],
      setMode = _useState2[1];

  var _useState3 = useState(dayjs(valueFromProps || dayjs().format("YYYY-MM-DD"))),
      _useState4 = _slicedToArray(_useState3, 2),
      value = _useState4[0],
      setValue = _useState4[1];

  var _useState5 = useState(value.year()),
      _useState6 = _slicedToArray(_useState5, 2),
      year = _useState6[0],
      setYearState = _useState6[1];

  var _useState7 = useState(parseInt(value.format("M"), 10)),
      _useState8 = _slicedToArray(_useState7, 2),
      month = _useState8[0],
      setMonthState = _useState8[1];

  var _useState9 = useState(isShowWeekendDefault),
      _useState10 = _slicedToArray(_useState9, 2),
      isShowWeekend = _useState10[0],
      setIsShowWeekend = _useState10[1];

  var _useLocaleReceiver = useLocaleReceiver("calendar"),
      _useLocaleReceiver2 = _slicedToArray(_useLocaleReceiver, 2),
      local = _useLocaleReceiver2[0],
      t = _useLocaleReceiver2[1];

  var setMonth = useCallback(function (newMonth) {
    setMonthState(newMonth);
    onMonthChange({
      month: String(newMonth),
      year: String(year)
    });
  }, [onMonthChange, year]);

  var setYear = function setYear(newYear) {
    setYearState(newYear);
  };

  var weekLabelList = t(local.week.split(","));
  var colHeaderList = useMemo(function () {
    if (mode === "year") return [];
    var weekTextArr = Array.isArray(week) && week.length >= 7 ? week : _toConsumableArray(weekLabelList);
    var list = [];

    for (var i = firstDayOfWeek; i <= 7; i++) {
      if (!isShowWeekend && i > 5) {
        break;
      }

      list.push({
        day: i,
        text: weekTextArr[i - 1]
      });
    }

    if (firstDayOfWeek > 1) {
      for (var _i = 1; _i < firstDayOfWeek; _i++) {
        if (!isShowWeekend && _i > 5) {
          break;
        }

        list.push({
          day: _i,
          text: weekTextArr[_i - 1]
        });
      }
    }

    return list;
  }, [mode, firstDayOfWeek, isShowWeekend, week, weekLabelList]);
  var dateList = useMemo(function () {
    return createDateList(year, month, firstDayOfWeek, value, format);
  }, [year, month, firstDayOfWeek, format, value]);
  return /*#__PURE__*/createElement(as, _objectSpread({
    className: classNames("ui", "calendar", className)
  }, props), /* @__PURE__ */React.createElement("div", {
    className: "calendar"
  }, /* @__PURE__ */React.createElement("table", {
    className: "ui celled right aligned unstackable table seven column"
  }, colHeaderList.length > 0 && /* @__PURE__ */React.createElement("thead", null, /* @__PURE__ */React.createElement("tr", {
    className: "center aligned"
  }, colHeaderList.map(function (item, itemIndex) {
    return /* @__PURE__ */React.createElement("th", {
      key: itemIndex
    }, week && typeof week === "function" ? week({
      day: item.day
    }) : item.text);
  }))), /* @__PURE__ */React.createElement("tbody", null, dateList.map(function (week2, weekIndex) {
    return /* @__PURE__ */React.createElement("tr", {
      key: weekIndex
    }, week2.map(function (day, dayIndex) {
      var _day$date;

      return /* @__PURE__ */React.createElement("td", {
        key: dayIndex,
        className: classNames("link", {
          disabled: day.belongTo !== 0,
          today: day.isCurrent
        })
      }, (_day$date = day.date) === null || _day$date === void 0 ? void 0 : _day$date.getDate());
    }));
  })))));
};

Calendar.displayName = "Calendar";

export { Calendar as default };
//# sourceMappingURL=Calendar.js.map