@king-design/vue 3.5.2 → 3.6.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (119) hide show
  1. package/__tests__/__snapshots__/Vue Next Demos.md +111 -47
  2. package/__tests__/components/misc.spec.ts +93 -0
  3. package/components/cascader/index.spec.js +18 -19
  4. package/components/datepicker/basepicker.d.ts +6 -25
  5. package/components/datepicker/basepicker.js +22 -234
  6. package/components/datepicker/calendar.d.ts +36 -6
  7. package/components/datepicker/calendar.js +4 -0
  8. package/components/datepicker/calendar.vdt.js +21 -5
  9. package/components/datepicker/dayjs.d.ts +2 -2
  10. package/components/datepicker/dayjs.js +6 -0
  11. package/components/datepicker/helpers.d.ts +8 -7
  12. package/components/datepicker/helpers.js +2 -3
  13. package/components/datepicker/index.d.ts +26 -19
  14. package/components/datepicker/index.js +21 -13
  15. package/components/datepicker/index.spec.js +1389 -633
  16. package/components/datepicker/index.vdt.js +43 -46
  17. package/components/datepicker/shortcuts.d.ts +1 -1
  18. package/components/datepicker/styles.d.ts +22 -0
  19. package/components/datepicker/styles.js +26 -4
  20. package/components/datepicker/useConfirm.d.ts +6 -0
  21. package/components/datepicker/useConfirm.js +65 -0
  22. package/components/datepicker/useDisabled.d.ts +7 -5
  23. package/components/datepicker/useDisabled.js +22 -27
  24. package/components/datepicker/useFormats.d.ts +2 -2
  25. package/components/datepicker/useFormats.js +9 -3
  26. package/components/datepicker/useHighlight.d.ts +14 -0
  27. package/components/datepicker/useHighlight.js +60 -0
  28. package/components/datepicker/useKeyboards.js +2 -1
  29. package/components/datepicker/useMergeRange.d.ts +5 -0
  30. package/components/datepicker/useMergeRange.js +45 -0
  31. package/components/datepicker/useMonths.js +5 -3
  32. package/components/datepicker/usePanel.d.ts +1 -10
  33. package/components/datepicker/usePanel.js +19 -32
  34. package/components/datepicker/useQuarters.d.ts +15 -0
  35. package/components/datepicker/useQuarters.js +36 -0
  36. package/components/datepicker/useShowDate.js +10 -2
  37. package/components/datepicker/useStatus.d.ts +1 -1
  38. package/components/datepicker/useStatus.js +33 -16
  39. package/components/datepicker/useValue.d.ts +12 -6
  40. package/components/datepicker/useValue.js +49 -45
  41. package/components/datepicker/useValueBase.d.ts +28 -0
  42. package/components/datepicker/useValueBase.js +277 -0
  43. package/components/datepicker/useWeeks.d.ts +19 -0
  44. package/components/datepicker/useWeeks.js +48 -0
  45. package/components/datepicker/useYears.js +6 -3
  46. package/components/dialog/useFixBody.js +6 -58
  47. package/components/dropdown/dropdown.d.ts +1 -0
  48. package/components/dropdown/dropdown.js +7 -4
  49. package/components/ellipsis/styles.js +1 -1
  50. package/components/form/styles.js +1 -1
  51. package/components/input/index.d.ts +2 -0
  52. package/components/input/index.js +6 -0
  53. package/components/input/index.spec.js +45 -0
  54. package/components/input/index.vdt.js +4 -3
  55. package/components/input/useAutoWidth.d.ts +2 -0
  56. package/components/input/useAutoWidth.js +19 -1
  57. package/components/scrollSelect/index.spec.js +4 -6
  58. package/components/scrollSelect/useMouseEvents.js +22 -9
  59. package/components/select/base.d.ts +1 -1
  60. package/components/select/base.js +3 -2
  61. package/components/select/base.vdt.js +5 -2
  62. package/components/select/index.spec.js +329 -82
  63. package/components/select/option.d.ts +1 -0
  64. package/components/select/option.js +10 -2
  65. package/components/select/select.d.ts +1 -0
  66. package/components/select/select.js +4 -2
  67. package/components/select/styles.d.ts +79 -0
  68. package/components/select/styles.js +1 -0
  69. package/components/select/useFilterable.js +2 -1
  70. package/components/select/useInput.d.ts +1 -1
  71. package/components/select/useInput.js +7 -4
  72. package/components/select/useSearchable.js +1 -0
  73. package/components/table/index.spec.js +84 -6
  74. package/components/table/useStickyHeader.js +1 -1
  75. package/components/timepicker/index.spec.js +298 -128
  76. package/components/timepicker/panelPicker.d.ts +23 -17
  77. package/components/timepicker/panelPicker.js +7 -4
  78. package/components/timepicker/panelPicker.vdt.js +8 -4
  79. package/components/timepicker/selectPicker.d.ts +5 -4
  80. package/components/timepicker/useConfirm.d.ts +6 -0
  81. package/components/timepicker/useConfirm.js +19 -0
  82. package/components/timepicker/useDefaultValue.d.ts +4 -0
  83. package/components/timepicker/useDefaultValue.js +27 -0
  84. package/components/timepicker/useDisabled.d.ts +7 -4
  85. package/components/timepicker/useDisabled.js +13 -4
  86. package/components/timepicker/useFormats.d.ts +1 -1
  87. package/components/timepicker/useValue.d.ts +14 -8
  88. package/components/timepicker/useValue.js +14 -15
  89. package/components/tour/index.d.ts +2 -0
  90. package/components/tour/index.js +2 -0
  91. package/components/tour/index.spec.d.ts +1 -0
  92. package/components/tour/index.spec.js +356 -0
  93. package/components/tour/step.d.ts +23 -0
  94. package/components/tour/step.js +46 -0
  95. package/components/tour/step.vdt.js +74 -0
  96. package/components/tour/styles.d.ts +7 -0
  97. package/components/tour/styles.js +84 -0
  98. package/components/tour/tour.d.ts +73 -0
  99. package/components/tour/tour.js +70 -0
  100. package/components/tour/tour.vdt.js +66 -0
  101. package/components/tour/useArrow.d.ts +4 -0
  102. package/components/tour/useArrow.js +40 -0
  103. package/components/tour/useFixBody.d.ts +4 -0
  104. package/components/tour/useFixBody.js +17 -0
  105. package/components/tour/useHighlight.d.ts +4 -0
  106. package/components/tour/useHighlight.js +31 -0
  107. package/components/tour/useMaskClosable.d.ts +1 -0
  108. package/components/tour/useMaskClosable.js +25 -0
  109. package/components/tour/useNavigation.d.ts +5 -0
  110. package/components/tour/useNavigation.js +103 -0
  111. package/components/tour/usePosition.d.ts +6 -0
  112. package/components/tour/usePosition.js +93 -0
  113. package/components/tour/useSteps.d.ts +6 -0
  114. package/components/tour/useSteps.js +68 -0
  115. package/hooks/useFixBody.d.ts +11 -0
  116. package/hooks/useFixBody.js +72 -0
  117. package/index.d.ts +3 -2
  118. package/index.js +3 -2
  119. package/package.json +2 -2
@@ -1,11 +1,12 @@
1
- import dayjs, { Dayjs, OpUnitType } from 'dayjs';
2
- import { StateValueItem } from './basepicker';
1
+ import dayjs, { Dayjs, OpUnitType, QUnitType } from 'dayjs';
2
+ import { last } from '../utils';
3
+ import { StateValueItem } from './useValueBase';
3
4
  export declare function getNowDate(isEnd?: boolean): dayjs.Dayjs;
4
5
  export declare function clearTime(date: Date): void;
5
6
  export declare function endTime(date: Date): void;
6
- export declare function isEqual(a: Dayjs | undefined | null, b: Dayjs | undefined | null, type?: OpUnitType): boolean;
7
- export declare function isLT(a: Dayjs | undefined | null, b: Dayjs | undefined | null, type?: OpUnitType): boolean;
8
- export declare function isGT(a: Dayjs | undefined | null, b: Dayjs | undefined | null, type?: OpUnitType): boolean;
7
+ export declare function isEqual(a: Dayjs | undefined | null, b: Dayjs | undefined | null, type?: OpUnitType | QUnitType): boolean;
8
+ export declare function isLT(a: Dayjs | undefined | null, b: Dayjs | undefined | null, type?: OpUnitType | QUnitType): boolean;
9
+ export declare function isGT(a: Dayjs | undefined | null, b: Dayjs | undefined | null, type?: OpUnitType | QUnitType): boolean;
9
10
  export declare function createDate(date: string): Date;
10
- export declare function findValueIndex(values: StateValueItem[], value: StateValueItem, type: OpUnitType): number;
11
- export declare function last<T>(arr: T[]): T | undefined;
11
+ export declare function findValueIndex(values: StateValueItem[], value: StateValueItem, type: OpUnitType | QUnitType): number;
12
+ export { last };
@@ -2,6 +2,7 @@ import _construct from "@babel/runtime-corejs3/helpers/construct";
2
2
  import _mapInstanceProperty from "@babel/runtime-corejs3/core-js/instance/map";
3
3
  import _findIndexInstanceProperty from "@babel/runtime-corejs3/core-js/instance/find-index";
4
4
  import dayjs from 'dayjs';
5
+ import { last } from '../utils';
5
6
  export function getNowDate(isEnd) {
6
7
  // only date without time
7
8
  var now = new Date();
@@ -73,6 +74,4 @@ export function findValueIndex(values, value, type) {
73
74
  }
74
75
  });
75
76
  }
76
- export function last(arr) {
77
- return arr[arr.length - 1];
78
- }
77
+ export { last };
@@ -1,12 +1,12 @@
1
1
  import { TypeDefs } from 'intact-vue-next';
2
2
  import dayjs from './dayjs';
3
- import { State } from '../../hooks/useState';
4
3
  import { Shortcut } from './shortcuts';
5
- import { BasePicker, BasePickerProps, BasePickerEvents, BasePickerBlocks, Value } from './basepicker';
4
+ import { BasePicker, BasePickerProps, BasePickerEvents, BasePickerBlocks } from './basepicker';
5
+ import { Value } from './useValueBase';
6
6
  export * as shortcuts from './shortcuts';
7
7
  export { dayjs };
8
8
  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> {
9
- type?: 'date' | 'datetime' | 'year' | 'month';
9
+ type?: 'date' | 'datetime' | 'year' | 'month' | 'week' | 'quarter';
10
10
  shortcuts?: Shortcut[];
11
11
  }
12
12
  export interface DatepickerEvents extends BasePickerEvents {
@@ -26,39 +26,46 @@ export declare class Datepicker<V extends Value = Value, M extends boolean = fal
26
26
  getValueString: (value: dayjs.Dayjs) => string;
27
27
  };
28
28
  disabled: {
29
- isDisabled: (value: dayjs.Dayjs, type?: dayjs.OpUnitType) => boolean;
30
- isDisabledTime: (value: dayjs.Dayjs, flag: import("./usePanel").PanelFlags) => boolean;
29
+ 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;
30
+ isDisabledTime: (value: dayjs.Dayjs) => boolean;
31
31
  isDisabledConfirm: () => boolean;
32
- maxDate: State<dayjs.Dayjs | null>;
33
- minDate: State<dayjs.Dayjs | null>;
32
+ isDisabledValue: (value: import("./useValueBase").StateValueItem) => boolean;
33
+ maxDate: import("../../hooks/useState").State<dayjs.Dayjs | null>;
34
+ minDate: import("../../hooks/useState").State<dayjs.Dayjs | null>;
34
35
  };
35
36
  panel: {
36
- startPanel: State<import("./usePanel").PanelTypes>;
37
- endPanel: State<import("./usePanel").PanelTypes>;
38
- changePanel: (type: import("./usePanel").PanelTypes, flag?: import("./usePanel").PanelFlags) => void;
39
- getPanel: (flag: import("./usePanel").PanelFlags) => State<import("./usePanel").PanelTypes>;
40
- reset: () => void;
41
37
  startRef: import('intact-vue-next').RefObject<import("./calendar").DatepickerCalendar>;
42
38
  endRef: import('intact-vue-next').RefObject<import("./calendar").DatepickerCalendar>;
43
39
  };
44
40
  focusDate: {
45
- focusDate: State<dayjs.Dayjs | null>;
41
+ focusDate: import("../../hooks/useState").State<dayjs.Dayjs | null>;
46
42
  reset: () => void;
47
43
  };
48
44
  value: {
49
45
  format: () => string | string[];
50
- onConfirm: () => void;
46
+ formatSingleValue: (value: import("./useValueBase").StateValueItem) => string;
51
47
  onChangeTime: (date: dayjs.Dayjs, flag: import("./usePanel").PanelFlags) => void;
52
48
  getTimeValue: (flag: import("./usePanel").PanelFlags) => dayjs.Dayjs | null | undefined;
53
- convertToDayjs: (v: Value | [Value, Value] | Value[] | [Value, Value][] | null | undefined) => import("./basepicker").DayjsValue;
54
- getDayjsValue: () => import("./basepicker").DayjsValue;
55
- value: State<import("./basepicker").StateValue>;
56
- setValue: (v: import("./basepicker").StateValueItem, fromInput: boolean) => void;
49
+ convertToDayjs: (v: Value | [Value, Value] | Value[] | [Value, Value][] | null | undefined) => import("./useValueBase").DayjsValue;
50
+ unique: () => void;
51
+ setMoment: () => void;
52
+ updateValue: () => void;
53
+ value: import("../../hooks/useState").State<import("./useValueBase").StateValue>;
54
+ setValue: (v: import("./useValueBase").StateValueItem, fromInput: boolean) => void;
57
55
  onChangeDate: (v: dayjs.Dayjs, flag: import("./usePanel").PanelFlags) => void;
56
+ getDayjsValue: () => import("./useValueBase").DayjsValue;
57
+ allValuesUpdatedInMultipleMode: () => boolean | undefined;
58
+ };
59
+ highlight: {
60
+ position: import("../../hooks/useState").State<import("./useHighlight").Position>;
61
+ handleInputClick: () => void;
62
+ togglePosition: () => void;
63
+ highlightWidth: import("../../hooks/useState").State<number>;
64
+ highlightLeft: import("../../hooks/useState").State<number>;
58
65
  };
66
+ private confirm;
59
67
  init(): void;
60
68
  protected getPlaceholder(): string | number | boolean | import("misstime/dist/utils/types").VNode<any> | import('intact-vue-next').Children[];
61
69
  protected getLabel(): string | string[];
62
- protected clear(e: MouseEvent): void;
63
70
  private setByShortcut;
64
71
  }
@@ -15,17 +15,22 @@ import { useFormats } from './useFormats';
15
15
  import { usePanel } from './usePanel';
16
16
  import { useFocusDate } from './useFocusDate';
17
17
  import { useKeyboards } from './useKeyboards';
18
+ import { useHighlight } from './useHighlight';
19
+ // import {useMergeRange} from './useMergeRange';
18
20
  import { BasePicker } from './basepicker';
21
+ import { useConfirm } from './useConfirm';
19
22
  import * as _shortcuts from './shortcuts';
20
23
  export { _shortcuts as shortcuts };
21
24
  export { dayjs };
22
25
  var typeDefs = _extends({}, BasePicker.typeDefs, {
23
- type: ['date', 'datetime', 'year', 'month'],
26
+ type: ['date', 'datetime', 'year', 'month', 'week', 'quarter'],
24
27
  shortcuts: Array
28
+ // isMerge: Boolean
25
29
  });
26
30
  var defaults = function defaults() {
27
31
  return _extends({}, BasePicker.defaults(), {
28
32
  type: 'date'
33
+ // isMerge: false
29
34
  });
30
35
  };
31
36
  export var Datepicker = /*#__PURE__*/function (_BasePicker) {
@@ -38,10 +43,17 @@ export var Datepicker = /*#__PURE__*/function (_BasePicker) {
38
43
  }
39
44
  _this = _BasePicker.call.apply(_BasePicker, _concatInstanceProperty(_context = [this]).call(_context, args)) || this;
40
45
  _this.formats = useFormats();
41
- _this.disabled = useDisabled(_this.formats);
46
+ _this.disabled = useDisabled(_this.formats, function () {
47
+ return _this.highlight.position;
48
+ });
42
49
  _this.panel = usePanel();
43
50
  _this.focusDate = useFocusDate();
44
- _this.value = useValue(_this.formats, _this.disabled, _this.panel);
51
+ _this.value = useValue(_this.formats, _this.disabled, _this.panel, function () {
52
+ return _this.highlight.position;
53
+ });
54
+ _this.highlight = useHighlight(_this.value.value, _this.formats.getShowString, _this.input.keywords);
55
+ // public mergeRange = useMergeRange(this.formats);
56
+ _this.confirm = useConfirm(_this.highlight, _this.value, _this.formats.getValueString);
45
57
  return _this;
46
58
  }
47
59
  var _proto = Datepicker.prototype;
@@ -60,9 +72,13 @@ export var Datepicker = /*#__PURE__*/function (_BasePicker) {
60
72
  case 'datetime':
61
73
  return range ? _$('开始时间 ~ 结束时间') : _$('请选择日期和时间');
62
74
  case 'year':
63
- return _$('请选择年份');
75
+ return range ? _$('开始年份 ~ 结束年份') : _$('请选择年份');
64
76
  case 'month':
65
- return _$('请选择月份');
77
+ return range ? _$('开始月份 ~ 结束月份') : _$('请选择月份');
78
+ case 'week':
79
+ return range ? _$('开始周 ~ 结束周') : _$('请选择周');
80
+ case 'quarter':
81
+ return range ? _$('开始季度 ~ 结束季度') : _$('请选择季度');
66
82
  default:
67
83
  return range ? _$('开始日期 ~ 结束日期') : _$('请选择日期');
68
84
  }
@@ -70,13 +86,6 @@ export var Datepicker = /*#__PURE__*/function (_BasePicker) {
70
86
  _proto.getLabel = function getLabel() {
71
87
  return this.value.format();
72
88
  };
73
- _proto.clear = function clear(e) {
74
- _BasePicker.prototype.clear.call(this, e);
75
- if (this.get('type') === 'datetime') {
76
- // reset the state to let user re-select
77
- this.panel.reset();
78
- }
79
- };
80
89
  _proto.setByShortcut = function setByShortcut(shortcut) {
81
90
  var _this$value = this.value,
82
91
  setValue = _this$value.setValue,
@@ -93,5 +102,4 @@ export var Datepicker = /*#__PURE__*/function (_BasePicker) {
93
102
  Datepicker.template = template;
94
103
  Datepicker.typeDefs = typeDefs;
95
104
  Datepicker.defaults = defaults;
96
- __decorate([bind], Datepicker.prototype, "clear", null);
97
105
  __decorate([bind], Datepicker.prototype, "setByShortcut", null);