@king-design/react 3.5.2 → 3.6.0

package/components/cascader/index.spec.js

@@ -160,7 +160,7 @@ describe('Cascader', function () {
     }, _callee5);
   })));
   it('filter', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee6() {
-    var _mount5, instance, element, input, dropdown, dropdown1, _getElements2, _dropdown1, _dropdown2, _dropdown3;
+    var _mount5, instance, element, input, dropdown1, _getElements2, _dropdown1, _dropdown2, _dropdown3;
     return _regeneratorRuntime.wrap(function _callee6$(_context6) {
       while (1) switch (_context6.prev = _context6.next) {
         case 0:
@@ -170,53 +170,52 @@ describe('Cascader', function () {
           _context6.next = 5;
           return wait();
         case 5:
+          // FIXME: maybe we should show no-data layer
           // should show layer when input empty string
-          input.value = ' ';
+          // input.value = ' ';
+          // dispatchEvent(input, 'input');
+          // await wait();
+          // const dropdown = getElement('.k-cascader-menu')!;
+          // expect(dropdown.innerHTML).to.matchSnapshot();
+          // expect(dropdown.innerText).to.eql('北京\n湖南');
+          input.value = '长沙';
           dispatchEvent(input, 'input');
           _context6.next = 9;
           return wait();
         case 9:
-          dropdown = getElement('.k-cascader-menu');
-          expect(dropdown.innerHTML).to.matchSnapshot();
-          expect(dropdown.innerText).to.eql('北京\n湖南');
-          input.value = '长沙';
-          dispatchEvent(input, 'input');
-          _context6.next = 16;
-          return wait();
-        case 16:
           dropdown1 = getElement('.k-cascader-filter');
           expect(dropdown1.innerHTML).to.matchSnapshot();
           expect(dropdown1.innerText).to.eql('湖南 / 长沙市 / 岳麓区');
           // should show no-data layer
           input.value = 'xxx';
           dispatchEvent(input, 'input');
-          _context6.next = 23;
+          _context6.next = 16;
           return wait();
-        case 23:
+        case 16:
           expect(dropdown1.innerHTML).to.matchSnapshot();
           expect(dropdown1.innerText).to.eql('无匹配数据');
           input.value = '岳阳';
           dispatchEvent(input, 'input');
-          _context6.next = 29;
+          _context6.next = 22;
           return wait();
-        case 29:
+        case 22:
           expect(dropdown1.innerHTML).to.matchSnapshot();
           expect(dropdown1.childElementCount).to.eql(2);
           dropdown1.querySelector('.k-dropdown-item').click();
-          _context6.next = 34;
+          _context6.next = 27;
           return wait();
-        case 34:
+        case 27:
           expect(instance.get('value')).to.eql(['hunan', 'yueyang', 'yueyanglou']);
           // show again to test the position
           input.click();
-          _context6.next = 38;
+          _context6.next = 31;
           return wait();
-        case 38:
+        case 31:
           _getElements2 = getElements('.k-cascader-menu'), _dropdown1 = _getElements2[0], _dropdown2 = _getElements2[1], _dropdown3 = _getElements2[2];
           expect(_dropdown1.style.top).not.eql('0px');
           expect(_dropdown2.style.top).not.eql('0px');
           expect(_dropdown3.style.top).not.eql('0px');
-        case 42:
+        case 35:
         case "end":
           return _context6.stop();
       }

package/components/datepicker/basepicker.d.ts

@@ -2,20 +2,12 @@
  * The base hook for handling value of Datepicker and Timepicker
  */
 import { TypeDefs } from 'intact-react';
-import { State } from '../../hooks/useState';
-import { Dayjs, OpUnitType } from './dayjs';
+import { Dayjs } from './dayjs';
 import type { useFormats } from './useFormats';
-import type { useDisabled } from './useDisabled';
-import { PanelFlags, usePanel } from './usePanel';
+import { usePanel } from './usePanel';
 import { BaseSelect, BaseSelectProps, BaseSelectEvents, BaseSelectBlocks } from '../select/base';
 import type { Events } from '../types';
-export type StateValueRange = [Dayjs, Dayjs?];
-export type StateValueItem = Dayjs | StateValueRange;
-export type StateValue = StateValueItem[];
-export type StringValue = string | string[] | [string, string] | [string, string][];
-export type DayjsValueRange = [Dayjs, Dayjs];
-export type DayjsValueItem = Dayjs | DayjsValueRange;
-export type DayjsValue = DayjsValueItem[];
+import type { useValueBase, StateValueRange, Value } from './useValueBase';
 export interface BasePickerProps<V extends Value = Value, Multipe extends boolean = boolean, Range extends boolean = boolean> extends BaseSelectProps<V | [V, V], Multipe> {
     value?: Multipe extends true ? Range extends true ? [
         V,
@@ -33,27 +25,16 @@ export interface BasePickerProps<V extends Value = Value, Multipe extends boolea
     disabledDate?: (v: Dayjs) => boolean;
 }
 export interface BasePickerEvents extends BaseSelectEvents {
-    selecting: [StateValueRange];
+    selecting: [StateValueRange, boolean];
 }
 export interface BasePickerBlocks<V extends Value = Value, R extends boolean = boolean> extends BaseSelectBlocks<R extends true ? [Value, Value] : Value> {
 }
-export type Value = string | Date | number | Dayjs;
 export declare abstract class BasePicker<T extends BasePickerProps = BasePickerProps, E extends BasePickerEvents = BasePickerEvents, B extends BasePickerBlocks<any> = BasePickerBlocks<any>> extends BaseSelect<T, E, B> {
     static typeDefs: Required<TypeDefs<BasePickerProps<Value, boolean, boolean>>>;
     static defaults: () => Partial<BasePickerProps<any, boolean, boolean>>;
     static events: Events<BasePickerEvents>;
-    abstract value: ReturnType<typeof useValue>;
+    abstract value: ReturnType<typeof useValueBase>;
     abstract formats: ReturnType<typeof useFormats>;
     abstract panel: ReturnType<typeof usePanel>;
-    resetKeywords(keywords: State<string>): void;
+    resetKeywords(silent?: boolean): void;
 }
-export declare function useValue({ createDateByValueFormat, createDateByShowFormat, getShowString, getValueString, }: ReturnType<typeof useFormats>, { isDisabled, minDate }: ReturnType<typeof useDisabled>, panel: ReturnType<typeof usePanel>, shouldUpdateValue: (v: StateValueItem) => boolean, updateValueOnInput: (v: DayjsValueItem) => void, getEqualType: () => OpUnitType, updateStateValue: (v: DayjsValue, value: State<StateValue>) => void): {
-    value: State<StateValue>;
-    format: () => string | string[];
-    onConfirm: () => void;
-    onChangeTime: (date: Dayjs, flag: PanelFlags) => void;
-    getTimeValue: (flag: PanelFlags) => Dayjs | null | undefined;
-    setValue: (v: StateValueItem, fromInput: boolean) => void;
-    convertToDayjs: (v: BasePickerProps<Value>['value']) => DayjsValue;
-    getDayjsValue: () => DayjsValue;
-};

package/components/datepicker/basepicker.js

@@ -1,18 +1,8 @@
 import _inheritsLoose from "@babel/runtime-corejs3/helpers/inheritsLoose";
 import _extends from "@babel/runtime-corejs3/helpers/extends";
-import _mapInstanceProperty from "@babel/runtime-corejs3/core-js/instance/map";
-import _trimInstanceProperty from "@babel/runtime-corejs3/core-js/instance/trim";
-import _sliceInstanceProperty from "@babel/runtime-corejs3/core-js/instance/slice";
-import _spliceInstanceProperty from "@babel/runtime-corejs3/core-js/instance/splice";
 import { __decorate } from "tslib";
-/**
- * The base hook for handling value of Datepicker and Timepicker
- */
-import { useInstance } from 'intact-react';
-import { useState, watchState } from '../../hooks/useState';
 import dayjs from './dayjs';
-import { findValueIndex } from './helpers';
-import { isEqualArray, last, bind } from '../utils';
+import { last, bind } from '../utils';
 import { BaseSelect } from '../select/base';
 var typeDefs = _extends({}, BaseSelect.typeDefs, {
   value: [String, Array, Date, Number, dayjs],
@@ -38,232 +28,30 @@ export var BasePicker = /*#__PURE__*/function (_BaseSelect) {
     return _BaseSelect.apply(this, arguments) || this;
   }
   var _proto = BasePicker.prototype;
-  _proto.resetKeywords = function resetKeywords(keywords) {
-    var _this$get = this.get(),
-      multiple = _this$get.multiple,
-      range = _this$get.range;
-    var dayjsValue = this.value.getDayjsValue();
-    var getShowString = this.formats.getShowString;
-    var value = last(dayjsValue);
-    keywords.set(multiple ? '' : !range ? value ? getShowString(value) : '' : value ? [getShowString(value[0]), getShowString(value[1])].join(' ~ ') : '');
+  _proto.resetKeywords = function resetKeywords(silent) {
+    if (silent === void 0) {
+      silent = false;
+    }
+    // const {multiple} = this.get();
+    // const dayjsValue = this.value.getDayjsValue();
+    var value = last(this.value.value.value);
+    var keywords = this.input.keywords;
+    var _keywords = '';
+    if (value && !this.value.allValuesUpdatedInMultipleMode()) {
+      _keywords = this.value.formatSingleValue(value);
+    }
+    if (!silent) {
+      keywords.set(_keywords);
+    } else {
+      // update keywords will update value, because it is been watched in useValueBase
+      // silent in this case to update keywords to show it in input
+      keywords.value = _keywords;
+      this.forceUpdate();
+    }
   };
   return BasePicker;
 }(BaseSelect);
 BasePicker.typeDefs = typeDefs;
 BasePicker.defaults = defaults;
 BasePicker.events = events;
-__decorate([bind], BasePicker.prototype, "resetKeywords", null);
-export function useValue(_ref, _ref2, panel, shouldUpdateValue, updateValueOnInput, getEqualType, updateStateValue) {
-  var createDateByValueFormat = _ref.createDateByValueFormat,
-    createDateByShowFormat = _ref.createDateByShowFormat,
-    getShowString = _ref.getShowString,
-    getValueString = _ref.getValueString;
-  var isDisabled = _ref2.isDisabled,
-    minDate = _ref2.minDate;
-  // Normalize the value to multipe values, no matter it's multipe or not
-  var value = useState([]);
-  var instance = useInstance();
-  var dayjsValue = [];
-  instance.watch('value', function (newValue, oldValue) {
-    if (isEqualArray(newValue, oldValue)) return;
-    dayjsValue = convertToDayjs(newValue);
-    updateStateValue(dayjsValue, value);
-    // should update keywords
-    instance.resetKeywords(instance.input.keywords);
-  });
-  watchState(instance.input.keywords, function (v) {
-    var _instance$get = instance.get(),
-      range = _instance$get.range,
-      multiple = _instance$get.multiple;
-    if (!multiple && v === '') return instance.set('value', null);
-    if (range) {
-      var _context;
-      var _v$split$map = _mapInstanceProperty(_context = v.split(/\s*~\s*/)).call(_context, function (s) {
-          return _trimInstanceProperty(s).call(s);
-        }),
-        start = _v$split$map[0],
-        end = _v$split$map[1];
-      if (start && end) {
-        var startDate = createDateByShowFormat(start);
-        if (!isValidDate(startDate)) {
-          return;
-        }
-        var endDate = createDateByShowFormat(end);
-        if (!isValidDate(endDate)) {
-          return;
-        }
-        if (endDate.isAfter(startDate)) {
-          updateValueOnInput([startDate, endDate]);
-        }
-      }
-    } else {
-      var date = createDateByShowFormat(v);
-      if (isValidDate(date)) {
-        updateValueOnInput(date);
-      }
-    }
-  });
-  function convertToDayjs(v) {
-    if (!v || Array.isArray(v) && !v.length) return [];
-    var _instance$get2 = instance.get(),
-      multiple = _instance$get2.multiple;
-    if (!multiple) {
-      v = [v];
-    }
-    return _mapInstanceProperty(v).call(v, function (value) {
-      if (Array.isArray(value)) {
-        // range
-        return _mapInstanceProperty(value).call(value, createDateByValueFormat);
-      }
-      return createDateByValueFormat(value);
-    });
-  }
-  function convertToValueString(v) {
-    var results = _mapInstanceProperty(v).call(v, function (value) {
-      if (Array.isArray(value)) {
-        return _mapInstanceProperty(value).call(value, getValueString);
-      }
-      return getValueString(value);
-    });
-    if (!instance.get('multiple')) {
-      return results[0] || null;
-    }
-    return results;
-  }
-  function format() {
-    var results = _mapInstanceProperty(dayjsValue).call(dayjsValue, function (value) {
-      if (Array.isArray(value)) {
-        return _mapInstanceProperty(value).call(value, getShowString).join(' ~ ');
-      }
-      return getShowString(value);
-    });
-    if (!instance.get('multiple')) {
-      return results[0];
-    }
-    return results;
-  }
-  function setSingleDate(v, fromInput) {
-    var _instance$get3 = instance.get(),
-      range = _instance$get3.range;
-    value.set([v]);
-    if (fromInput || shouldUpdateValue(v)) {
-      updateValue();
-    }
-  }
-  function addMultipeDate(v, fromInput) {
-    var _instance$get4 = instance.get(),
-      range = _instance$get4.range;
-    var _value = value.value;
-    _value = !_value ? [] : _sliceInstanceProperty(_value).call(_value);
-    if (range && v.length === 2) {
-      // pop the last value firstly, if it only has the start date 
-      var lastValue = last(_value);
-      if (lastValue && lastValue.length < 2) {
-        _value.pop();
-      }
-    }
-    var _shouldUpdateValue = true;
-    if (fromInput || shouldUpdateValue(v)) {
-      // if select the date/year/month, then toggle the value.
-      // if from input, treat the value as the final value
-      var index = findValueIndex(_value, v, getEqualType());
-      if (index > -1) {
-        _spliceInstanceProperty(_value).call(_value, index, 1);
-      } else {
-        _value.push(v);
-      }
-    } else {
-      // select the datetime, only push the value,
-      // and unique the array on click confrim button
-      _value.push(v);
-      _shouldUpdateValue = false;
-    }
-    value.set(_value);
-    if (_shouldUpdateValue) {
-      updateValue();
-    }
-  }
-  function setValue(v, fromInput) {
-    var multiple = instance.get('multiple');
-    if (multiple) {
-      addMultipeDate(v, fromInput);
-    } else {
-      setSingleDate(v, fromInput);
-    }
-  }
-  function updateValue() {
-    var _value = value.value;
-    var valueStr = convertToValueString(_value);
-    instance.set('value', valueStr);
-    instance.resetKeywords(instance.input.keywords);
-  }
-  function onConfirm() {
-    // unique
-    if (!instance.get('multiple')) {
-      instance.hide();
-    } else {
-      unique();
-      panel.reset();
-    }
-    updateValue();
-  }
-  function unique() {
-    var _value = value.value;
-    var map = {};
-    var results = [];
-    _value.forEach(function (value) {
-      var key;
-      if (Array.isArray(value)) {
-        key = _mapInstanceProperty(value).call(value, getValueString).join(' ~ ');
-      } else {
-        key = getValueString(value);
-      }
-      if (!map[key]) {
-        map[key] = true;
-        results.push(value);
-      }
-    });
-    value.set(results);
-  }
-  function isValidDate(date) {
-    return date.isValid() && !isDisabled(date, getEqualType());
-  }
-  function onChangeTime(date, flag) {
-    var _context2;
-    var _instance$get5 = instance.get(),
-      range = _instance$get5.range;
-    var values = _sliceInstanceProperty(_context2 = value.value).call(_context2);
-    var lastIndex = values.length - 1;
-    var _value = date;
-    if (range) {
-      var _context3;
-      _value = _sliceInstanceProperty(_context3 = values[lastIndex]).call(_context3);
-      _value[flag] = date;
-      instance.trigger('selecting', _value);
-    }
-    values[lastIndex] = _value;
-    value.set(values);
-  }
-  function getTimeValue(flag) {
-    var _value = value.value;
-    if (!_value.length) return null;
-    var _instance$get6 = instance.get(),
-      range = _instance$get6.range,
-      min = _instance$get6.min;
-    var lastValue = last(_value);
-    return range ? lastValue[flag] : lastValue;
-  }
-  function getDayjsValue() {
-    return dayjsValue;
-  }
-  return {
-    value: value,
-    format: format,
-    onConfirm: onConfirm,
-    onChangeTime: onChangeTime,
-    getTimeValue: getTimeValue,
-    setValue: setValue,
-    convertToDayjs: convertToDayjs,
-    getDayjsValue: getDayjsValue
-  };
-}
+__decorate([bind], BasePicker.prototype, "resetKeywords", null);

package/components/datepicker/calendar.d.ts

@@ -1,12 +1,14 @@
 import { Component } from 'intact-react';
 import { Dayjs } from 'dayjs';
 import type { Datepicker } from './index';
-import { StateValue } from './basepicker';
+import type { StateValue } from './useValueBase';
 import { PanelFlags } from './usePanel';
+import { Position } from './useHighlight';
 export interface DatepickerCalendarProps {
     value: StateValue;
-    type?: 'date' | 'year' | 'month';
+    type?: 'date' | 'year' | 'month' | 'week' | 'quarter';
     flag: PanelFlags;
+    highlightPosition: Position;
 }
 export interface DatepickerCalendarEvents {
     change: [Dayjs, PanelFlags];
@@ -14,7 +16,7 @@ export interface DatepickerCalendarEvents {
 export declare class DatepickerCalendar extends Component<DatepickerCalendarProps, DatepickerCalendarEvents> {
     static template: string | import('intact-react').Template<any>;
     static defaults: () => Partial<DatepickerCalendarProps>;
-    type: import("../../hooks/useState").State<Required<"date" | "month" | "year" | undefined>>;
+    type: import("../../hooks/useState").State<Required<"date" | "month" | "week" | "year" | "quarter" | undefined>>;
     datepicker: Datepicker;
     showDate: {
         date: import("../../hooks/useState").State<Dayjs>;
@@ -30,9 +32,9 @@ export declare class DatepickerCalendar extends Component<DatepickerCalendarProp
         prevTenYears: () => void;
     };
     status: {
-        isActive: (date: Dayjs, type: "date" | "month" | "year" | undefined) => boolean;
-        isInRange: (date: Dayjs, type: "date" | "month" | "year" | undefined) => boolean;
-        isDisabled: (value: Dayjs, type?: import("dayjs").OpUnitType) => boolean;
+        isActive: (date: Dayjs, type: "date" | "month" | "week" | "year" | "quarter" | undefined) => boolean;
+        isInRange: (date: Dayjs, type: "date" | "month" | "week" | "year" | "quarter" | undefined) => boolean;
+        isDisabled: (value: Dayjs, type?: "h" | "s" | "y" | "date" | "month" | "week" | "millisecond" | "second" | "minute" | "hour" | "day" | "year" | "milliseconds" | "seconds" | "minutes" | "hours" | "days" | "months" | "years" | "dates" | "d" | "D" | "M" | "m" | "ms" | "weeks" | "w" | "quarter" | "quarters" | "Q") => boolean;
     };
     days: {
         getDays: (now: Dayjs) => {
@@ -74,6 +76,34 @@ export declare class DatepickerCalendar extends Component<DatepickerCalendarProp
         }[];
         onClick: (date: Dayjs) => void;
     };
+    weeks: {
+        getWeeks: (now: Dayjs) => {
+            week: number;
+            days: {
+                isExceed: boolean;
+                label: number;
+                value: Dayjs;
+                isActive: boolean;
+                isToday: boolean;
+                isDisabled: boolean;
+                isHover: boolean;
+                isInRange: boolean;
+            }[];
+        }[];
+        onClick: (day: Dayjs) => void;
+    };
+    quarters: {
+        getQuarters: (now: Dayjs) => {
+            isActive: boolean;
+            isToday: boolean;
+            isDisabled: boolean;
+            isHover: boolean;
+            isInRange: boolean;
+            label: string;
+            value: Dayjs;
+        }[];
+        onClick: (date: Dayjs) => void;
+    };
     private config;
     triggerChange(value: Dayjs): void;
 }

package/components/datepicker/calendar.js

@@ -11,6 +11,8 @@ import { useShowDate } from './useShowDate';
 import { bind } from '../utils';
 import { useYears } from './useYears';
 import { useMonths } from './useMonths';
+import { useWeeks } from './useWeeks';
+import { useQuarters } from './useQuarters';
 import { useStatus } from './useStatus';
 import { useConfigContext } from '../config';
 var defaults = function defaults() {
@@ -34,6 +36,8 @@ export var DatepickerCalendar = /*#__PURE__*/function (_Component) {
     _this.days = useDays(_this.showDate.date, _this.status, _this.datepicker.focusDate.focusDate);
     _this.years = useYears(_this.showDate.date, _this.status, _this.datepicker.focusDate.focusDate);
     _this.months = useMonths(_this.showDate.date, _this.status, _this.datepicker.focusDate.focusDate);
+    _this.weeks = useWeeks(_this.showDate.date, _this.status, _this.datepicker.focusDate.focusDate);
+    _this.quarters = useQuarters(_this.showDate.date, _this.status, _this.datepicker.focusDate.focusDate);
     _this.config = useConfigContext();
     return _this;
   }

package/components/datepicker/calendar.vdt.js

@@ -12,7 +12,12 @@ export default function ($props, $blocks, $__proto__) {
   var $this = this;
   var type = this.type.value;
   var isYear = type === 'year';
+  var isWeek = type === 'week';
+  var isQuarter = type === 'quarter';
   var isYearOrMonth = isYear || type === 'month';
+  var isDateOrDateTime = type === 'date' || type === 'datetime';
+  // isDateOrDateTime & isWeek合并
+  var showDateWeeks = isDateOrDateTime || isWeek;
   var k = this.config.k;
   var classNameObj = (_classNameObj = {}, _classNameObj[k + "-datepicker-calendar"] = true, _classNameObj[makeCalendarStyles(k)] = true, _classNameObj);
   var now = getNowDate();
@@ -58,7 +63,7 @@ export default function ($props, $blocks, $__proto__) {
       'className': _$cn(k + "-icon-left"),
       'size': 'small'
     })]
-  }), !isYearOrMonth ? _$cc(Button, {
+  }), showDateWeeks ? _$cc(Button, {
     'icon': true,
     'type': 'none',
     'size': 'small',
@@ -73,7 +78,7 @@ export default function ($props, $blocks, $__proto__) {
     return _$ce(2, 'span', $value.value, 0, _$cn(k + "-month-value"), {
       'ev-click': $value.onClick
     });
-  }, $this) : _$ce(2, 'span', this.years.getYearLabel(), 0, _$cn(k + "-month-value")), 0, _$cn(k + "-month-values")), _$ce(2, 'div', [!isYearOrMonth ? _$cc(Button, {
+  }, $this) : _$ce(2, 'span', this.years.getYearLabel(), 0, _$cn(k + "-month-value")), 0, _$cn(k + "-month-values")), _$ce(2, 'div', [showDateWeeks ? _$cc(Button, {
     'icon': true,
     'type': 'none',
     'size': 'small',
@@ -98,11 +103,22 @@ export default function ($props, $blocks, $__proto__) {
       'className': _$cn(k + "-icon-right"),
       'size': 'small'
     })]
-  })], 0, _$cn(k + "-right-btns"))], 4, _$cn(k + "-datepicker-month")), !isYearOrMonth ? [_$ce(2, 'div', _$ma([_$('日'), _$('一'), _$('二'), _$('三'), _$('四'), _$('五'), _$('六')], function ($value, $key) {
+  })], 0, _$cn(k + "-right-btns"))], 4, _$cn(k + "-datepicker-month")), showDateWeeks ? [_$ce(2, 'div', _$ma([_$('日'), _$('一'), _$('二'), _$('三'), _$('四'), _$('五'), _$('六')], function ($value, $key) {
     return _$ce(2, 'div', $value, 0, _$cn(k + "-weekday"));
-  }, $this), 4, _$cn(k + "-weekdays")), _$ce(2, 'div', getItems(getDays(now), onClickDay), 0, _$cn(k + "-days"), {
+  }, $this), 4, _$cn(k + "-weekdays")), isWeek ? _$ce(2, 'div', _$ma(this.weeks.getWeeks(now), function ($value, $key) {
+    return _$ce(2, 'div', [_$ce(2, 'div', $value.week, 0, _$cn(k + "-week-number"), {
+      'ev-click': function evClick(e) {
+        onClickDay($value.days[0].value);
+      },
+      'ev-mouseenter': function evMouseenter() {
+        return focusDate.set($value.days[0].value);
+      }
+    }), getItems($value.days, onClickDay)], 0, 'week-row');
+  }, $this), 4, _$cn(k + "-weeks"), {
     'ev-mouseleave': resetFocusDate
-  })] : _$ce(2, 'div', isYear ? getItems(this.years.getYears(now), this.years.onClick) : getItems(this.months.getMonths(now), this.months.onClick), 0, _$cn(k + "-years"), {
+  }) : _$ce(2, 'div', getItems(getDays(now), onClickDay), 0, _$cn(k + "-days"), {
+    'ev-mouseleave': resetFocusDate
+  })] : _$ce(2, 'div', isYear ? getItems(this.years.getYears(now), this.years.onClick) : isQuarter ? getItems(this.quarters.getQuarters(now), this.quarters.onClick) : getItems(this.months.getMonths(now), this.months.onClick), 0, _$cn(k + "-years"), {
     'ev-mouseleave': resetFocusDate
   })], 0, _$cn(classNameObj));
 }

package/components/datepicker/dayjs.d.ts

@@ -1,3 +1,3 @@
-import dayjs, { Dayjs, OpUnitType } from 'dayjs';
+import dayjs, { Dayjs, OpUnitType, QUnitType } from 'dayjs';
 export default dayjs;
-export type { Dayjs, OpUnitType };
+export type { Dayjs, OpUnitType, QUnitType };

package/components/datepicker/dayjs.js

@@ -1,4 +1,10 @@
 import dayjs from 'dayjs';
+import weekOfYear from 'dayjs/plugin/weekOfYear';
+import quarterOfYear from 'dayjs/plugin/quarterOfYear';
 import customParseFormat from 'dayjs/plugin/customParseFormat';
+import advancedFormat from 'dayjs/plugin/advancedFormat';
 dayjs.extend(customParseFormat);
+dayjs.extend(weekOfYear);
+dayjs.extend(quarterOfYear);
+dayjs.extend(advancedFormat);
 export default dayjs;

package/components/datepicker/helpers.d.ts

@@ -1,11 +1,12 @@
-import dayjs, { Dayjs, OpUnitType } from 'dayjs';
-import { StateValueItem } from './basepicker';
+import dayjs, { Dayjs, OpUnitType, QUnitType } from 'dayjs';
+import { last } from '../utils';
+import { StateValueItem } from './useValueBase';
 export declare function getNowDate(isEnd?: boolean): dayjs.Dayjs;
 export declare function clearTime(date: Date): void;
 export declare function endTime(date: Date): void;
-export declare function isEqual(a: Dayjs | undefined | null, b: Dayjs | undefined | null, type?: OpUnitType): boolean;
-export declare function isLT(a: Dayjs | undefined | null, b: Dayjs | undefined | null, type?: OpUnitType): boolean;
-export declare function isGT(a: Dayjs | undefined | null, b: Dayjs | undefined | null, type?: OpUnitType): boolean;
+export declare function isEqual(a: Dayjs | undefined | null, b: Dayjs | undefined | null, type?: OpUnitType | QUnitType): boolean;
+export declare function isLT(a: Dayjs | undefined | null, b: Dayjs | undefined | null, type?: OpUnitType | QUnitType): boolean;
+export declare function isGT(a: Dayjs | undefined | null, b: Dayjs | undefined | null, type?: OpUnitType | QUnitType): boolean;
 export declare function createDate(date: string): Date;
-export declare function findValueIndex(values: StateValueItem[], value: StateValueItem, type: OpUnitType): number;
-export declare function last<T>(arr: T[]): T | undefined;
+export declare function findValueIndex(values: StateValueItem[], value: StateValueItem, type: OpUnitType | QUnitType): number;
+export { last };

package/components/datepicker/helpers.js

@@ -2,6 +2,7 @@ import _construct from "@babel/runtime-corejs3/helpers/construct";
 import _mapInstanceProperty from "@babel/runtime-corejs3/core-js/instance/map";
 import _findIndexInstanceProperty from "@babel/runtime-corejs3/core-js/instance/find-index";
 import dayjs from 'dayjs';
+import { last } from '../utils';
 export function getNowDate(isEnd) {
   // only date without time
   var now = new Date();
@@ -73,6 +74,4 @@ export function findValueIndex(values, value, type) {
     }
   });
 }
-export function last(arr) {
-  return arr[arr.length - 1];
-}
+export { last };