All files / src/calendar Calendar.tsx

100% Statements 6/6
50% Branches 1/2
100% Functions 1/1
100% Lines 6/6

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48                                              3x   3x   3x 3x 3x       3x                            
import React, { useState } from "react";
import moment, { Moment, isMoment } from "moment";
import CalendarPart from "./CalendarPart";
import { StyledProps, Combine } from "../_type";
import { ControlledProps, useDefaultValue } from "../form/controlled";
import { CalendarTable } from "./CalendarTable";
import { RangeDateType, CalendarTableType } from "./DateProps";
import { useTranslation } from "../i18n";
 
export interface CalendarProps
  extends Combine<StyledProps, ControlledProps<Moment>> {
  /**
   * 允许选择的日期范围,可同时使用 `disabledDate` 实现更精细控制
   */
  range?: RangeDateType;
 
  /**
   * 可选的日期范围
   */
  disabledDate?: (date: Moment) => boolean;
}
 
export function Calendar(props: CalendarProps) {
  useTranslation(moment);
 
  const { className, style, ...restProps } = useDefaultValue(props);
 
  const [type, setType] = useState<CalendarTableType>("date");
  const { value } = props;
  const [curViewMoment, setCurViewMoment] = useState<Moment>(
    isMoment(value) ? value : moment()
  );
 
  return (
    <CalendarPart.Panel className={className} style={style}>
      <CalendarPart.Body>
        <CalendarTable
          {...restProps}
          curViewMoment={curViewMoment}
          onCurViewMomentChange={setCurViewMoment}
          type={type}
          onTypeChange={setType}
        />
      </CalendarPart.Body>
    </CalendarPart.Panel>
  );
}