@king-design/intact 3.5.2 → 3.6.0

package/es/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/es/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/es/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/es/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/es/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 };

package/es/components/datepicker/index.d.ts

@@ -1,12 +1,12 @@
 import { TypeDefs } from 'intact';
 import dayjs from './dayjs';
-import { State } from '../../hooks/useState';
 import { Shortcut } from './shortcuts';
-import { BasePicker, BasePickerProps, BasePickerEvents, BasePickerBlocks, Value } from './basepicker';
+import { BasePicker, BasePickerProps, BasePickerEvents, BasePickerBlocks } from './basepicker';
+import { Value } from './useValueBase';
 export * as shortcuts from './shortcuts';
 export { dayjs };
 export interface DatepickerProps<V extends Value = Value, M extends boolean = boolean, R extends boolean = boolean> extends BasePickerProps<V extends string ? V : V | string, M, R> {
-    type?: 'date' | 'datetime' | 'year' | 'month';
+    type?: 'date' | 'datetime' | 'year' | 'month' | 'week' | 'quarter';
     shortcuts?: Shortcut[];
 }
 export interface DatepickerEvents extends BasePickerEvents {
@@ -26,39 +26,46 @@ export declare class Datepicker<V extends Value = Value, M extends boolean = fal
         getValueString: (value: dayjs.Dayjs) => string;
     };
     disabled: {
-        isDisabled: (value: dayjs.Dayjs, type?: dayjs.OpUnitType) => boolean;
-        isDisabledTime: (value: dayjs.Dayjs, flag: import("./usePanel").PanelFlags) => boolean;
+        isDisabled: (value: dayjs.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;
+        isDisabledTime: (value: dayjs.Dayjs) => boolean;
         isDisabledConfirm: () => boolean;
-        maxDate: State<dayjs.Dayjs | null>;
-        minDate: State<dayjs.Dayjs | null>;
+        isDisabledValue: (value: import("./useValueBase").StateValueItem) => boolean;
+        maxDate: import("../../hooks/useState").State<dayjs.Dayjs | null>;
+        minDate: import("../../hooks/useState").State<dayjs.Dayjs | null>;
     };
     panel: {
-        startPanel: State<import("./usePanel").PanelTypes>;
-        endPanel: State<import("./usePanel").PanelTypes>;
-        changePanel: (type: import("./usePanel").PanelTypes, flag?: import("./usePanel").PanelFlags) => void;
-        getPanel: (flag: import("./usePanel").PanelFlags) => State<import("./usePanel").PanelTypes>;
-        reset: () => void;
         startRef: import("intact").RefObject<import("./calendar").DatepickerCalendar>;
         endRef: import("intact").RefObject<import("./calendar").DatepickerCalendar>;
     };
     focusDate: {
-        focusDate: State<dayjs.Dayjs | null>;
+        focusDate: import("../../hooks/useState").State<dayjs.Dayjs | null>;
         reset: () => void;
     };
     value: {
         format: () => string | string[];
-        onConfirm: () => void;
+        formatSingleValue: (value: import("./useValueBase").StateValueItem) => string;
         onChangeTime: (date: dayjs.Dayjs, flag: import("./usePanel").PanelFlags) => void;
         getTimeValue: (flag: import("./usePanel").PanelFlags) => dayjs.Dayjs | null | undefined;
-        convertToDayjs: (v: Value | [Value, Value] | Value[] | [Value, Value][] | null | undefined) => import("./basepicker").DayjsValue;
-        getDayjsValue: () => import("./basepicker").DayjsValue;
-        value: State<import("./basepicker").StateValue>;
-        setValue: (v: import("./basepicker").StateValueItem, fromInput: boolean) => void;
+        convertToDayjs: (v: Value | [Value, Value] | Value[] | [Value, Value][] | null | undefined) => import("./useValueBase").DayjsValue;
+        unique: () => void;
+        setMoment: () => void;
+        updateValue: () => void;
+        value: import("../../hooks/useState").State<import("./useValueBase").StateValue>;
+        setValue: (v: import("./useValueBase").StateValueItem, fromInput: boolean) => void;
         onChangeDate: (v: dayjs.Dayjs, flag: import("./usePanel").PanelFlags) => void;
+        getDayjsValue: () => import("./useValueBase").DayjsValue;
+        allValuesUpdatedInMultipleMode: () => boolean | undefined;
+    };
+    highlight: {
+        position: import("../../hooks/useState").State<import("./useHighlight").Position>;
+        handleInputClick: () => void;
+        togglePosition: () => void;
+        highlightWidth: import("../../hooks/useState").State<number>;
+        highlightLeft: import("../../hooks/useState").State<number>;
     };
+    private confirm;
     init(): void;
     protected getPlaceholder(): string | number | boolean | import("misstime/dist/utils/types").VNode<any> | import("intact").Children[];
     protected getLabel(): string | string[];
-    protected clear(e: MouseEvent): void;
     private setByShortcut;
 }

package/es/components/datepicker/index.js

@@ -15,17 +15,22 @@ import { useFormats } from './useFormats';
 import { usePanel } from './usePanel';
 import { useFocusDate } from './useFocusDate';
 import { useKeyboards } from './useKeyboards';
+import { useHighlight } from './useHighlight';
+// import {useMergeRange} from './useMergeRange';
 import { BasePicker } from './basepicker';
+import { useConfirm } from './useConfirm';
 import * as _shortcuts from './shortcuts';
 export { _shortcuts as shortcuts };
 export { dayjs };
 var typeDefs = _extends({}, BasePicker.typeDefs, {
-  type: ['date', 'datetime', 'year', 'month'],
+  type: ['date', 'datetime', 'year', 'month', 'week', 'quarter'],
   shortcuts: Array
+  // isMerge: Boolean
 });
 var defaults = function defaults() {
   return _extends({}, BasePicker.defaults(), {
     type: 'date'
+    // isMerge: false
   });
 };
 export var Datepicker = /*#__PURE__*/function (_BasePicker) {
@@ -38,10 +43,17 @@ export var Datepicker = /*#__PURE__*/function (_BasePicker) {
     }
     _this = _BasePicker.call.apply(_BasePicker, _concatInstanceProperty(_context = [this]).call(_context, args)) || this;
     _this.formats = useFormats();
-    _this.disabled = useDisabled(_this.formats);
+    _this.disabled = useDisabled(_this.formats, function () {
+      return _this.highlight.position;
+    });
     _this.panel = usePanel();
     _this.focusDate = useFocusDate();
-    _this.value = useValue(_this.formats, _this.disabled, _this.panel);
+    _this.value = useValue(_this.formats, _this.disabled, _this.panel, function () {
+      return _this.highlight.position;
+    });
+    _this.highlight = useHighlight(_this.value.value, _this.formats.getShowString, _this.input.keywords);
+    // public mergeRange = useMergeRange(this.formats);
+    _this.confirm = useConfirm(_this.highlight, _this.value, _this.formats.getValueString);
     return _this;
   }
   var _proto = Datepicker.prototype;
@@ -60,9 +72,13 @@ export var Datepicker = /*#__PURE__*/function (_BasePicker) {
       case 'datetime':
         return range ? _$('开始时间 ~ 结束时间') : _$('请选择日期和时间');
       case 'year':
-        return _$('请选择年份');
+        return range ? _$('开始年份 ~ 结束年份') : _$('请选择年份');
       case 'month':
-        return _$('请选择月份');
+        return range ? _$('开始月份 ~ 结束月份') : _$('请选择月份');
+      case 'week':
+        return range ? _$('开始周 ~ 结束周') : _$('请选择周');
+      case 'quarter':
+        return range ? _$('开始季度 ~ 结束季度') : _$('请选择季度');
       default:
         return range ? _$('开始日期 ~ 结束日期') : _$('请选择日期');
     }
@@ -70,13 +86,6 @@ export var Datepicker = /*#__PURE__*/function (_BasePicker) {
   _proto.getLabel = function getLabel() {
     return this.value.format();
   };
-  _proto.clear = function clear(e) {
-    _BasePicker.prototype.clear.call(this, e);
-    if (this.get('type') === 'datetime') {
-      // reset the state to let user re-select
-      this.panel.reset();
-    }
-  };
   _proto.setByShortcut = function setByShortcut(shortcut) {
     var _this$value = this.value,
       setValue = _this$value.setValue,
@@ -93,5 +102,4 @@ export var Datepicker = /*#__PURE__*/function (_BasePicker) {
 Datepicker.template = template;
 Datepicker.typeDefs = typeDefs;
 Datepicker.defaults = defaults;
-__decorate([bind], Datepicker.prototype, "clear", null);
 __decorate([bind], Datepicker.prototype, "setByShortcut", null);