@kdcloudjs/kdesign 1.6.24 → 1.6.26
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.
- package/CHANGELOG.md +31 -0
- package/dist/kdesign-complete.less +12 -0
- package/dist/kdesign.css +11 -1
- package/dist/kdesign.css.map +1 -1
- package/dist/kdesign.js +270 -141
- package/dist/kdesign.js.map +1 -1
- package/dist/kdesign.min.css +3 -3
- package/dist/kdesign.min.js +7 -7
- package/dist/kdesign.min.js.map +1 -1
- package/es/checkbox/group.js +1 -1
- package/es/date-picker/context.d.ts +5 -1
- package/es/date-picker/date-panel.js +37 -9
- package/es/date-picker/date-picker.d.ts +2 -0
- package/es/date-picker/date-picker.js +24 -11
- package/es/date-picker/panel/month/month.js +13 -4
- package/es/date-picker/panel/year/year.d.ts +2 -1
- package/es/date-picker/panel/year/year.js +23 -5
- package/es/date-picker/range-picker.d.ts +2 -0
- package/es/date-picker/range-picker.js +20 -8
- package/es/date-picker/style/index.css +9 -0
- package/es/date-picker/style/index.less +11 -0
- package/es/date-picker/utils/date-fns.d.ts +1 -0
- package/es/date-picker/utils/date-fns.js +24 -1
- package/es/input-number/style/index.css +1 -0
- package/es/input-number/style/index.less +1 -0
- package/es/select/select.js +28 -2
- package/es/tree/tree.js +0 -2
- package/lib/checkbox/group.js +1 -1
- package/lib/date-picker/context.d.ts +5 -1
- package/lib/date-picker/date-panel.js +37 -9
- package/lib/date-picker/date-picker.d.ts +2 -0
- package/lib/date-picker/date-picker.js +23 -10
- package/lib/date-picker/panel/month/month.js +12 -3
- package/lib/date-picker/panel/year/year.d.ts +2 -1
- package/lib/date-picker/panel/year/year.js +23 -4
- package/lib/date-picker/range-picker.d.ts +2 -0
- package/lib/date-picker/range-picker.js +19 -7
- package/lib/date-picker/style/index.css +9 -0
- package/lib/date-picker/style/index.less +11 -0
- package/lib/date-picker/utils/date-fns.d.ts +1 -0
- package/lib/date-picker/utils/date-fns.js +29 -1
- package/lib/input-number/style/index.css +1 -0
- package/lib/input-number/style/index.less +1 -0
- package/lib/select/select.js +28 -2
- package/lib/tree/tree.js +0 -2
- package/package.json +1 -1
package/es/checkbox/group.js
CHANGED
|
@@ -1,9 +1,11 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { DateType, InnerLocale, RangeValue, TimeUnit } from './interface';
|
|
3
|
+
import { IInnerPicker } from './date-picker';
|
|
3
4
|
export declare type ContextOperationRefProps = {
|
|
4
5
|
onKeyDown?: (e: React.KeyboardEvent<HTMLElement>) => boolean;
|
|
5
6
|
onClose?: () => void;
|
|
6
7
|
};
|
|
8
|
+
export declare type ISelectType = 'key' | 'mouse' | 'submit' | 'inner';
|
|
7
9
|
export interface SingleContextProps {
|
|
8
10
|
prefixCls: string;
|
|
9
11
|
viewDate: DateType;
|
|
@@ -21,9 +23,11 @@ export interface SingleContextProps {
|
|
|
21
23
|
seconds?: TimeUnit[];
|
|
22
24
|
disabledTimePanel?: boolean;
|
|
23
25
|
setViewDate: (date: DateType, index?: 0 | 1) => void;
|
|
24
|
-
onSelect: (date: DateType, type:
|
|
26
|
+
onSelect: (date: DateType, type: ISelectType) => void;
|
|
25
27
|
onDateMouseEnter: (date: DateType) => void;
|
|
26
28
|
onDateMouseLeave: (arg?: boolean) => void;
|
|
29
|
+
innerPicker: IInnerPicker;
|
|
30
|
+
setInnerPicker: (p: IInnerPicker) => void;
|
|
27
31
|
}
|
|
28
32
|
declare const Context: React.Context<SingleContextProps>;
|
|
29
33
|
export default Context;
|
|
@@ -14,13 +14,15 @@ import isBoolean from 'lodash/isBoolean';
|
|
|
14
14
|
import DateTime from './panel/date-time/date-time';
|
|
15
15
|
|
|
16
16
|
function Panel(props) {
|
|
17
|
-
// console.log('props', props)
|
|
18
17
|
var context = useContext(Context);
|
|
19
18
|
var prefixCls = context.prefixCls,
|
|
20
19
|
viewDate = context.viewDate,
|
|
21
20
|
setViewDate = context.setViewDate,
|
|
22
21
|
panelPosition = context.panelPosition,
|
|
23
|
-
locale = context.locale
|
|
22
|
+
locale = context.locale,
|
|
23
|
+
innerPicker = context.innerPicker,
|
|
24
|
+
setInnerPicker = context.setInnerPicker;
|
|
25
|
+
var isInInnerPicker = innerPicker !== undefined;
|
|
24
26
|
var _props$picker = props.picker,
|
|
25
27
|
picker = _props$picker === void 0 ? 'date' : _props$picker,
|
|
26
28
|
format = props.format,
|
|
@@ -54,6 +56,14 @@ function Panel(props) {
|
|
|
54
56
|
};
|
|
55
57
|
|
|
56
58
|
var renderDatePanel = function renderDatePanel() {
|
|
59
|
+
if (isInInnerPicker) {
|
|
60
|
+
if (innerPicker === 'year') {
|
|
61
|
+
return renderYearPanel();
|
|
62
|
+
} else {
|
|
63
|
+
return renderMonthPanel();
|
|
64
|
+
}
|
|
65
|
+
}
|
|
66
|
+
|
|
57
67
|
if (!showTime) {
|
|
58
68
|
var dateProps = {
|
|
59
69
|
picker: picker,
|
|
@@ -123,12 +133,30 @@ function Panel(props) {
|
|
|
123
133
|
};
|
|
124
134
|
};
|
|
125
135
|
|
|
136
|
+
var onHeaderYearClick = function onHeaderYearClick() {
|
|
137
|
+
if (picker === 'date') {
|
|
138
|
+
setInnerPicker('year');
|
|
139
|
+
}
|
|
140
|
+
};
|
|
141
|
+
|
|
142
|
+
var onHeaderMonthClick = function onHeaderMonthClick() {
|
|
143
|
+
if (picker === 'date') {
|
|
144
|
+
setInnerPicker('month');
|
|
145
|
+
}
|
|
146
|
+
};
|
|
147
|
+
|
|
126
148
|
var renderDateHeader = function renderDateHeader() {
|
|
127
149
|
var year = getYear(viewDate);
|
|
128
150
|
var month = getMonth(viewDate) + 1;
|
|
129
151
|
var headerCls = classnames("".concat(prefixCls, "-header"), "".concat(prefixCls, "-header-date"));
|
|
130
152
|
return {
|
|
131
|
-
children: /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("span",
|
|
153
|
+
children: /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("span", {
|
|
154
|
+
className: "".concat(prefixCls, "-header-text-inner"),
|
|
155
|
+
onClick: onHeaderYearClick
|
|
156
|
+
}, year + locale.year), /*#__PURE__*/React.createElement("span", {
|
|
157
|
+
className: "".concat(prefixCls, "-header-text-inner"),
|
|
158
|
+
onClick: onHeaderMonthClick
|
|
159
|
+
}, month + locale.month)),
|
|
132
160
|
className: headerCls
|
|
133
161
|
};
|
|
134
162
|
};
|
|
@@ -136,7 +164,7 @@ function Panel(props) {
|
|
|
136
164
|
var onSuperPrev = function onSuperPrev() {
|
|
137
165
|
var date;
|
|
138
166
|
|
|
139
|
-
if (picker === 'year') {
|
|
167
|
+
if (picker === 'year' || innerPicker === 'year') {
|
|
140
168
|
var _props$yearItemNumber3 = props.yearItemNumber,
|
|
141
169
|
yearItemNumber = _props$yearItemNumber3 === void 0 ? DEFAULT_YEAR_ITEM_NUMBER : _props$yearItemNumber3;
|
|
142
170
|
date = addYears(viewDate, 0 - yearItemNumber);
|
|
@@ -150,7 +178,7 @@ function Panel(props) {
|
|
|
150
178
|
var onSuperNext = function onSuperNext() {
|
|
151
179
|
var date;
|
|
152
180
|
|
|
153
|
-
if (picker === 'year') {
|
|
181
|
+
if (picker === 'year' || innerPicker === 'year') {
|
|
154
182
|
var _props$yearItemNumber4 = props.yearItemNumber,
|
|
155
183
|
yearItemNumber = _props$yearItemNumber4 === void 0 ? DEFAULT_YEAR_ITEM_NUMBER : _props$yearItemNumber4;
|
|
156
184
|
var _viewDate = viewDate;
|
|
@@ -229,10 +257,10 @@ function Panel(props) {
|
|
|
229
257
|
{
|
|
230
258
|
headerObj = renderDateHeader();
|
|
231
259
|
headerProps = {
|
|
232
|
-
onPrev: panelPosition === 'right' ? undefined : onPrev,
|
|
233
|
-
onNext: panelPosition === 'left' ? undefined : onNext,
|
|
234
|
-
onSuperPrev: panelPosition === 'right' ? undefined : onSuperPrev,
|
|
235
|
-
onSuperNext: panelPosition === 'left' ? undefined : onSuperNext
|
|
260
|
+
onPrev: panelPosition === 'right' || isInInnerPicker ? undefined : onPrev,
|
|
261
|
+
onNext: panelPosition === 'left' || isInInnerPicker ? undefined : onNext,
|
|
262
|
+
onSuperPrev: panelPosition === 'right' || innerPicker === 'month' ? undefined : onSuperPrev,
|
|
263
|
+
onSuperNext: panelPosition === 'left' || innerPicker === 'month' ? undefined : onSuperNext
|
|
236
264
|
};
|
|
237
265
|
panel = renderDatePanel();
|
|
238
266
|
break;
|
|
@@ -5,6 +5,7 @@ import { BorderType, InputSiteType } from '../input/input';
|
|
|
5
5
|
export interface PickerSharedProps extends React.AriaAttributes {
|
|
6
6
|
dropdownClassName?: string;
|
|
7
7
|
popupStyle?: React.CSSProperties;
|
|
8
|
+
popupRef?: React.Ref<any>;
|
|
8
9
|
transitionName?: string;
|
|
9
10
|
placeholder?: string;
|
|
10
11
|
allowClear?: boolean;
|
|
@@ -47,5 +48,6 @@ export interface PickerTimeProps extends PickerSharedProps, Omit<OmitPanelProps<
|
|
|
47
48
|
defaultOpenValue?: DateType;
|
|
48
49
|
}
|
|
49
50
|
export declare type PickerProps = PickerBaseProps | PickerDateProps | PickerTimeProps;
|
|
51
|
+
export declare type IInnerPicker = undefined | 'year' | 'month';
|
|
50
52
|
declare const DatePicker: React.ForwardRefExoticComponent<(Partial<PickerBaseProps> & React.RefAttributes<unknown>) | (Partial<PickerDateProps> & React.RefAttributes<unknown>) | (Partial<PickerTimeProps> & React.RefAttributes<unknown>)>;
|
|
51
53
|
export default DatePicker;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import _slicedToArray from "@babel/runtime-corejs3/helpers/slicedToArray";
|
|
2
2
|
import _extends from "@babel/runtime-corejs3/helpers/extends";
|
|
3
3
|
import _findInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/find";
|
|
4
|
-
import React, { useContext, useEffect } from 'react';
|
|
4
|
+
import React, { useContext, useEffect, useState } from 'react';
|
|
5
5
|
import classnames from 'classnames';
|
|
6
6
|
import ConfigContext from '../config-provider/ConfigContext';
|
|
7
7
|
import { useMergedState, useOnClickOutside } from '../_utils/hooks';
|
|
@@ -34,6 +34,7 @@ var InternalDatePicker = function InternalDatePicker(props, ref) {
|
|
|
34
34
|
className = datePickerProps.className,
|
|
35
35
|
dropdownClassName = datePickerProps.dropdownClassName,
|
|
36
36
|
popupStyle = datePickerProps.popupStyle,
|
|
37
|
+
popupRef = datePickerProps.popupRef,
|
|
37
38
|
locale = datePickerProps.locale,
|
|
38
39
|
inputReadOnly = datePickerProps.inputReadOnly,
|
|
39
40
|
allowClear = datePickerProps.allowClear,
|
|
@@ -86,7 +87,7 @@ var InternalDatePicker = function InternalDatePicker(props, ref) {
|
|
|
86
87
|
|
|
87
88
|
var panelDivRef = React.useRef(null);
|
|
88
89
|
var inputDivRef = ref || /*#__PURE__*/React.createRef();
|
|
89
|
-
var popperRef = React.
|
|
90
|
+
var popperRef = popupRef || /*#__PURE__*/React.createRef();
|
|
90
91
|
var inputRef = React.useRef(null);
|
|
91
92
|
var isHourStepValid = 24 % hourStep === 0;
|
|
92
93
|
var isMinuteStepValid = 60 % minuteStep === 0;
|
|
@@ -98,8 +99,7 @@ var InternalDatePicker = function InternalDatePicker(props, ref) {
|
|
|
98
99
|
|
|
99
100
|
var datePickerLang = _extends({}, globalLocale.getCompLangMsg({
|
|
100
101
|
componentName: 'DatePicker'
|
|
101
|
-
}), locale || {}); //
|
|
102
|
-
// 原始数据
|
|
102
|
+
}), locale || {}); // 原始数据
|
|
103
103
|
|
|
104
104
|
|
|
105
105
|
var _useMergedState = useMergedState(null, {
|
|
@@ -229,6 +229,11 @@ var InternalDatePicker = function InternalDatePicker(props, ref) {
|
|
|
229
229
|
mergedMode = _useMergedState8[0],
|
|
230
230
|
setInnerMode = _useMergedState8[1];
|
|
231
231
|
|
|
232
|
+
var _useState = useState(undefined),
|
|
233
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
234
|
+
innerPicker = _useState2[0],
|
|
235
|
+
setInnerPicker = _useState2[1];
|
|
236
|
+
|
|
232
237
|
useEffect(function () {
|
|
233
238
|
setInnerMode(picker);
|
|
234
239
|
}, [picker]);
|
|
@@ -280,13 +285,19 @@ var InternalDatePicker = function InternalDatePicker(props, ref) {
|
|
|
280
285
|
};
|
|
281
286
|
|
|
282
287
|
var onContextSelect = function onContextSelect(date, type) {
|
|
283
|
-
if (type === '
|
|
288
|
+
if (type === 'inner') {
|
|
284
289
|
setViewDate(date);
|
|
285
|
-
|
|
286
|
-
|
|
290
|
+
setSelectedValue(date);
|
|
291
|
+
setDateValue(date);
|
|
287
292
|
} else {
|
|
288
|
-
|
|
289
|
-
|
|
293
|
+
if (type === 'submit' || type !== 'key' && !needConfirmButton) {
|
|
294
|
+
setViewDate(date);
|
|
295
|
+
triggerChange(date);
|
|
296
|
+
triggerOpen(false);
|
|
297
|
+
} else {
|
|
298
|
+
setViewDate(date);
|
|
299
|
+
triggerChange(date);
|
|
300
|
+
}
|
|
290
301
|
}
|
|
291
302
|
};
|
|
292
303
|
|
|
@@ -374,9 +385,11 @@ var InternalDatePicker = function InternalDatePicker(props, ref) {
|
|
|
374
385
|
onSelect: onContextSelect,
|
|
375
386
|
setViewDate: setViewDate,
|
|
376
387
|
onDateMouseEnter: onEnter,
|
|
377
|
-
onDateMouseLeave: onLeave
|
|
388
|
+
onDateMouseLeave: onLeave,
|
|
389
|
+
innerPicker: innerPicker,
|
|
390
|
+
setInnerPicker: setInnerPicker
|
|
378
391
|
}
|
|
379
|
-
}, panelNode, extraFooter || rangesNode || todayNode ? /*#__PURE__*/React.createElement("div", {
|
|
392
|
+
}, panelNode, (extraFooter || rangesNode || todayNode) && innerPicker === undefined ? /*#__PURE__*/React.createElement("div", {
|
|
380
393
|
className: "".concat(datePickerPrefixCls, "-footer")
|
|
381
394
|
}, extraFooter, rangesNode, todayNode) : null);
|
|
382
395
|
}
|
|
@@ -4,7 +4,7 @@ import _concatInstanceProperty from "@babel/runtime-corejs3/core-js-stable/insta
|
|
|
4
4
|
import _mapInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/map";
|
|
5
5
|
import React, { useContext } from 'react';
|
|
6
6
|
import classnames from 'classnames';
|
|
7
|
-
import { getMonth, newDate, getYear, setMonth, isAfter, isBefore, isSameMonth, getStartOfMonth } from '../../utils/date-fns';
|
|
7
|
+
import { getMonth, newDate, getYear, setMonth, isAfter, isBefore, isSameMonth, getStartOfMonth, setYearOrMonthOfDate } from '../../utils/date-fns';
|
|
8
8
|
import Context from '../../context';
|
|
9
9
|
import useRangeCls from '../../hooks/use-range-cls';
|
|
10
10
|
var monthsThreeColumns = [[0, 1, 2], [3, 4, 5], [6, 7, 8], [9, 10, 11]];
|
|
@@ -20,7 +20,9 @@ function Month(props) {
|
|
|
20
20
|
rangeValue = context.rangeValue,
|
|
21
21
|
panelPosition = context.panelPosition,
|
|
22
22
|
hoverRangedValue = context.hoverRangedValue,
|
|
23
|
-
locale = context.locale
|
|
23
|
+
locale = context.locale,
|
|
24
|
+
innerPicker = context.innerPicker,
|
|
25
|
+
setInnerPicker = context.setInnerPicker;
|
|
24
26
|
var disabledDate = props.disabledDate;
|
|
25
27
|
|
|
26
28
|
var _dateValue;
|
|
@@ -89,8 +91,15 @@ function Month(props) {
|
|
|
89
91
|
});
|
|
90
92
|
|
|
91
93
|
var handleClick = function handleClick(date) {
|
|
92
|
-
if (
|
|
93
|
-
|
|
94
|
+
if (innerPicker === undefined) {
|
|
95
|
+
if (!(disabledDate && disabledDate(date))) {
|
|
96
|
+
onSelect(date, 'mouse');
|
|
97
|
+
}
|
|
98
|
+
} else {
|
|
99
|
+
//
|
|
100
|
+
var _viewDate = viewDate;
|
|
101
|
+
onSelect(setYearOrMonthOfDate(_viewDate, date, 'month'), 'inner');
|
|
102
|
+
setInnerPicker(undefined);
|
|
94
103
|
}
|
|
95
104
|
};
|
|
96
105
|
|
|
@@ -1,10 +1,11 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
import { DateType } from '../../interface';
|
|
2
|
+
import { DateType, PickerMode } from '../../interface';
|
|
3
3
|
export interface YearProps {
|
|
4
4
|
yearItemNumber: number;
|
|
5
5
|
minDate?: DateType;
|
|
6
6
|
maxDate?: DateType;
|
|
7
7
|
disabledDate?: (date: DateType) => boolean;
|
|
8
|
+
picker?: PickerMode;
|
|
8
9
|
}
|
|
9
10
|
declare function Year(props: YearProps): JSX.Element;
|
|
10
11
|
export default Year;
|
|
@@ -3,8 +3,9 @@ import _defineProperty from "@babel/runtime-corejs3/helpers/defineProperty";
|
|
|
3
3
|
import React, { useContext } from 'react';
|
|
4
4
|
import classnames from 'classnames';
|
|
5
5
|
import Context from '../../context';
|
|
6
|
-
import { getYearsPeriod, getYear, newDate, setYear, isAfter, getStartOfYear, isSameYear, isBefore } from '../../utils/date-fns';
|
|
6
|
+
import { getYearsPeriod, getYear, newDate, setYear, isAfter, getStartOfYear, isSameYear, isBefore, setYearOrMonthOfDate } from '../../utils/date-fns';
|
|
7
7
|
import useRangeCls from '../../hooks/use-range-cls';
|
|
8
|
+
import { getClosingViewDate } from '../../utils';
|
|
8
9
|
|
|
9
10
|
function Year(props) {
|
|
10
11
|
var context = useContext(Context);
|
|
@@ -16,9 +17,13 @@ function Year(props) {
|
|
|
16
17
|
onSelect = context.onSelect,
|
|
17
18
|
rangeValue = context.rangeValue,
|
|
18
19
|
panelPosition = context.panelPosition,
|
|
19
|
-
hoverRangedValue = context.hoverRangedValue
|
|
20
|
+
hoverRangedValue = context.hoverRangedValue,
|
|
21
|
+
innerPicker = context.innerPicker,
|
|
22
|
+
setInnerPicker = context.setInnerPicker;
|
|
20
23
|
var yearItemNumber = props.yearItemNumber,
|
|
21
|
-
disabledDate = props.disabledDate
|
|
24
|
+
disabledDate = props.disabledDate,
|
|
25
|
+
_props$picker = props.picker,
|
|
26
|
+
picker = _props$picker === void 0 ? 'date' : _props$picker;
|
|
22
27
|
|
|
23
28
|
var _dateValue;
|
|
24
29
|
|
|
@@ -86,8 +91,21 @@ function Year(props) {
|
|
|
86
91
|
});
|
|
87
92
|
|
|
88
93
|
var handleClick = function handleClick(date) {
|
|
89
|
-
if (
|
|
90
|
-
|
|
94
|
+
if (innerPicker === undefined) {
|
|
95
|
+
if (!(disabledDate && disabledDate(date))) {
|
|
96
|
+
onSelect(date, 'mouse');
|
|
97
|
+
}
|
|
98
|
+
} else {
|
|
99
|
+
//
|
|
100
|
+
var _viewDate = viewDate;
|
|
101
|
+
|
|
102
|
+
if (panelPosition) {
|
|
103
|
+
_viewDate = getClosingViewDate(viewDate, picker, -1);
|
|
104
|
+
} // date = addYears(_viewDate, 1)
|
|
105
|
+
|
|
106
|
+
|
|
107
|
+
onSelect(setYearOrMonthOfDate(_viewDate, date), 'inner');
|
|
108
|
+
setInnerPicker(undefined);
|
|
91
109
|
}
|
|
92
110
|
};
|
|
93
111
|
|
|
@@ -29,6 +29,8 @@ export interface RangePickerSharedProps {
|
|
|
29
29
|
dateRender?: RangeDateRender;
|
|
30
30
|
panelRender?: (originPanel: React.ReactNode) => React.ReactNode;
|
|
31
31
|
getPopupContainer?: (node: HTMLElement) => HTMLElement;
|
|
32
|
+
popupRef?: React.Ref<any>;
|
|
33
|
+
popupStyle?: React.CSSProperties;
|
|
32
34
|
}
|
|
33
35
|
declare type OmitPickerProps<Props> = Omit<Props, 'value' | 'defaultValue' | 'defaultPickerValue' | 'placeholder' | 'disabled' | 'disabledTimePanel' | 'showToday' | 'showTime' | 'mode' | 'onChange' | 'onSelect' | 'onPanelChange' | 'pickerValue' | 'onPickerValueChange' | 'onOk' | 'dateRender'>;
|
|
34
36
|
export declare type RangeShowTimeObject = Omit<SharedTimeProps, 'defaultValue'> & {
|
|
@@ -4,7 +4,7 @@ import _extends from "@babel/runtime-corejs3/helpers/extends";
|
|
|
4
4
|
import _findInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/find";
|
|
5
5
|
import _Object$keys from "@babel/runtime-corejs3/core-js-stable/object/keys";
|
|
6
6
|
import _mapInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/map";
|
|
7
|
-
import React, { useContext, useEffect } from 'react';
|
|
7
|
+
import React, { useContext, useEffect, useState } from 'react';
|
|
8
8
|
import isSameWeek from 'date-fns/isSameWeek';
|
|
9
9
|
import ConfigContext from '../config-provider/ConfigContext';
|
|
10
10
|
import { useMergedState, useOnClickOutside } from '../_utils/hooks';
|
|
@@ -85,6 +85,8 @@ var InternalRangePicker = function InternalRangePicker(props, ref) {
|
|
|
85
85
|
allowEmpty = datePickerProps.allowEmpty,
|
|
86
86
|
className = datePickerProps.className,
|
|
87
87
|
style = datePickerProps.style,
|
|
88
|
+
popupStyle = datePickerProps.popupStyle,
|
|
89
|
+
popupRef = datePickerProps.popupRef,
|
|
88
90
|
borderType = datePickerProps.borderType,
|
|
89
91
|
separator = datePickerProps.separator,
|
|
90
92
|
ranges = datePickerProps.ranges,
|
|
@@ -130,7 +132,7 @@ var InternalRangePicker = function InternalRangePicker(props, ref) {
|
|
|
130
132
|
var separatorRef = React.useRef(null);
|
|
131
133
|
var startInputRef = React.useRef(null);
|
|
132
134
|
var endInputRef = React.useRef(null);
|
|
133
|
-
var popperRef = React.
|
|
135
|
+
var popperRef = popupRef || /*#__PURE__*/React.createRef();
|
|
134
136
|
var openRecordsRef = React.useRef({});
|
|
135
137
|
var mergedDisabled = React.useMemo(function () {
|
|
136
138
|
if (Array.isArray(disabled)) {
|
|
@@ -346,6 +348,11 @@ var InternalRangePicker = function InternalRangePicker(props, ref) {
|
|
|
346
348
|
mergedModes = _useMergedState10[0],
|
|
347
349
|
setInnerModes = _useMergedState10[1];
|
|
348
350
|
|
|
351
|
+
var _useState = useState(undefined),
|
|
352
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
353
|
+
innerPicker = _useState2[0],
|
|
354
|
+
setInnerPicker = _useState2[1];
|
|
355
|
+
|
|
349
356
|
useEffect(function () {
|
|
350
357
|
setInnerModes([picker, picker]);
|
|
351
358
|
}, [picker]); // const triggerModesChange = (modes: [PanelMode, PanelMode], values: RangeValue) => {
|
|
@@ -474,8 +481,7 @@ var InternalRangePicker = function InternalRangePicker(props, ref) {
|
|
|
474
481
|
var values = updateValues(selectedValue, date, mergedActivePickerIndex);
|
|
475
482
|
|
|
476
483
|
if (type === 'submit' || type !== 'key' && !needConfirmButton) {
|
|
477
|
-
|
|
478
|
-
triggerChange(values, mergedActivePickerIndex); // clear hover value style
|
|
484
|
+
triggerChange(values, mergedActivePickerIndex);
|
|
479
485
|
|
|
480
486
|
if (mergedActivePickerIndex === 0) {
|
|
481
487
|
onStartLeave();
|
|
@@ -581,7 +587,9 @@ var InternalRangePicker = function InternalRangePicker(props, ref) {
|
|
|
581
587
|
onSelect: onSelect,
|
|
582
588
|
setViewDate: setViewDate,
|
|
583
589
|
onDateMouseEnter: onDateMouseEnter,
|
|
584
|
-
onDateMouseLeave: onDateMouseLeave
|
|
590
|
+
onDateMouseLeave: onDateMouseLeave,
|
|
591
|
+
innerPicker: innerPicker,
|
|
592
|
+
setInnerPicker: setInnerPicker
|
|
585
593
|
}
|
|
586
594
|
}, renderPanel());
|
|
587
595
|
var rightPanel = /*#__PURE__*/React.createElement(Context.Provider, {
|
|
@@ -596,7 +604,9 @@ var InternalRangePicker = function InternalRangePicker(props, ref) {
|
|
|
596
604
|
onSelect: onSelect,
|
|
597
605
|
setViewDate: setViewDate,
|
|
598
606
|
onDateMouseEnter: onDateMouseEnter,
|
|
599
|
-
onDateMouseLeave: onDateMouseLeave
|
|
607
|
+
onDateMouseLeave: onDateMouseLeave,
|
|
608
|
+
innerPicker: innerPicker,
|
|
609
|
+
setInnerPicker: setInnerPicker
|
|
600
610
|
}
|
|
601
611
|
}, renderPanel());
|
|
602
612
|
panels = /*#__PURE__*/React.createElement("div", {
|
|
@@ -621,7 +631,9 @@ var InternalRangePicker = function InternalRangePicker(props, ref) {
|
|
|
621
631
|
onSelect: onSelect,
|
|
622
632
|
setViewDate: setViewDate,
|
|
623
633
|
onDateMouseEnter: onDateMouseEnter,
|
|
624
|
-
onDateMouseLeave: onDateMouseLeave
|
|
634
|
+
onDateMouseLeave: onDateMouseLeave,
|
|
635
|
+
innerPicker: innerPicker,
|
|
636
|
+
setInnerPicker: setInnerPicker
|
|
625
637
|
}
|
|
626
638
|
}, /*#__PURE__*/React.createElement(Panel, _extends({}, datePickerProps, {
|
|
627
639
|
disabledDate: mergedActivePickerIndex === 0 ? disabledStartDate : disabledEndDate
|
|
@@ -763,7 +775,7 @@ var InternalRangePicker = function InternalRangePicker(props, ref) {
|
|
|
763
775
|
trigger: 'click',
|
|
764
776
|
prefixCls: "".concat(datePickerPrefixCls, "-panel"),
|
|
765
777
|
arrow: false,
|
|
766
|
-
popperStyle:
|
|
778
|
+
popperStyle: popupStyle,
|
|
767
779
|
visible: mergedOpen,
|
|
768
780
|
placement: 'bottomLeft',
|
|
769
781
|
getPopupContainer: getPopupContainer
|
|
@@ -745,6 +745,15 @@
|
|
|
745
745
|
-ms-flex: 1;
|
|
746
746
|
flex: 1;
|
|
747
747
|
}
|
|
748
|
+
.kd-date-picker-panel .kd-date-picker-header-text-inner {
|
|
749
|
+
cursor: pointer;
|
|
750
|
+
}
|
|
751
|
+
.kd-date-picker-panel .kd-date-picker-header-text-inner:hover {
|
|
752
|
+
color: var(--kd-c-date-picker-color-background-checked, var(--kd-g-color-theme, #5582f3));
|
|
753
|
+
}
|
|
754
|
+
.kd-date-picker-panel .kd-date-picker-header-text-inner:nth-child(2) {
|
|
755
|
+
margin-left: 13px;
|
|
756
|
+
}
|
|
748
757
|
.kd-date-picker-panel .kd-date-picker-time-header,
|
|
749
758
|
.kd-date-picker-panel .kd-date-picker-header {
|
|
750
759
|
height: var(--kd-c-date-picker-panel-header-sizing-height, 36px);
|
|
@@ -84,3 +84,4 @@ export declare function getYearsPeriod(date: DateType, yearItemNumber: number):
|
|
|
84
84
|
endPeriod: number;
|
|
85
85
|
};
|
|
86
86
|
export declare function getLowerBoundTime(hour: number, minute: number, second: number, hourStep: number, minuteStep: number, secondStep: number): [number, number, number];
|
|
87
|
+
export declare const setYearOrMonthOfDate: (date1: DateType, date2: DateType, type?: string) => Date;
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import _includesInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/includes";
|
|
2
2
|
import _sliceInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/slice";
|
|
3
|
+
import _concatInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/concat";
|
|
3
4
|
import isDate from 'date-fns/isDate';
|
|
4
5
|
import isValidDate from 'date-fns/isValid';
|
|
5
6
|
import format from 'date-fns/format';
|
|
@@ -294,4 +295,26 @@ export function getLowerBoundTime(hour, minute, second, hourStep, minuteStep, se
|
|
|
294
295
|
|
|
295
296
|
var lowerBoundSecond = Math.floor(second / secondStep) * secondStep;
|
|
296
297
|
return [lowerBoundHour, lowerBoundMinute, lowerBoundSecond];
|
|
297
|
-
}
|
|
298
|
+
}
|
|
299
|
+
export var setYearOrMonthOfDate = function setYearOrMonthOfDate(date1, date2) {
|
|
300
|
+
var _context, _context2, _context3, _context4, _context5;
|
|
301
|
+
|
|
302
|
+
var type = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'year';
|
|
303
|
+
var y = new Date(date1).getFullYear();
|
|
304
|
+
|
|
305
|
+
if (type === 'year') {
|
|
306
|
+
y = new Date(date2).getFullYear();
|
|
307
|
+
}
|
|
308
|
+
|
|
309
|
+
var m = new Date(date1 || date2).getMonth() + 1;
|
|
310
|
+
|
|
311
|
+
if (type === 'month') {
|
|
312
|
+
m = new Date(date2).getMonth() + 1;
|
|
313
|
+
}
|
|
314
|
+
|
|
315
|
+
var d = new Date(date1 || date2).getDate();
|
|
316
|
+
var h = new Date(date1 || date2).getHours();
|
|
317
|
+
var mi = new Date(date1 || date2).getMinutes();
|
|
318
|
+
var s = new Date(date1 || date2).getSeconds();
|
|
319
|
+
return new Date(_concatInstanceProperty(_context = _concatInstanceProperty(_context2 = _concatInstanceProperty(_context3 = _concatInstanceProperty(_context4 = _concatInstanceProperty(_context5 = "".concat(y, "-")).call(_context5, m, "-")).call(_context4, d, " ")).call(_context3, h, ":")).call(_context2, mi, ":")).call(_context, s));
|
|
320
|
+
};
|
|
@@ -212,6 +212,7 @@
|
|
|
212
212
|
.kd-inputNumber-embedStep span .kd-inputNumber-icon {
|
|
213
213
|
-webkit-transition: color var(--kd-g-duration, 0.3s);
|
|
214
214
|
transition: color var(--kd-g-duration, 0.3s);
|
|
215
|
+
line-height: 1;
|
|
215
216
|
}
|
|
216
217
|
.kd-inputNumber-embedStep span:hover .kd-inputNumber-icon {
|
|
217
218
|
color: var(--kd-c-input-number-color-theme-5, var(--kd-g-color-theme-5, #87adff));
|
package/es/select/select.js
CHANGED
|
@@ -493,6 +493,9 @@ var InternalSelect = function InternalSelect(props, ref) {
|
|
|
493
493
|
var clearIconCls = classNames(_defineProperty({}, "".concat(selectPrefixCls, "-icon-clear"), true));
|
|
494
494
|
return /*#__PURE__*/React.createElement(React.Fragment, null, iconShow && /*#__PURE__*/React.createElement("span", {
|
|
495
495
|
onClick: handleReset,
|
|
496
|
+
onMouseDown: function onMouseDown(e) {
|
|
497
|
+
return e.preventDefault();
|
|
498
|
+
},
|
|
496
499
|
className: clearIconCls
|
|
497
500
|
}, /*#__PURE__*/React.createElement(Icon, {
|
|
498
501
|
type: "close-solid"
|
|
@@ -611,12 +614,32 @@ var InternalSelect = function InternalSelect(props, ref) {
|
|
|
611
614
|
}, [mulOptions]);
|
|
612
615
|
|
|
613
616
|
var renderSingle = function renderSingle() {
|
|
617
|
+
var _a, _b, _c;
|
|
618
|
+
|
|
619
|
+
var obj = (realChildren === null || realChildren === void 0 ? void 0 : _findInstanceProperty(realChildren).call(realChildren, function (child) {
|
|
620
|
+
var _a;
|
|
621
|
+
|
|
622
|
+
if (child && child.props) {
|
|
623
|
+
return ((_a = child.props) === null || _a === void 0 ? void 0 : _a.value) === initValue;
|
|
624
|
+
} else {
|
|
625
|
+
return (child === null || child === void 0 ? void 0 : child.value) === initValue;
|
|
626
|
+
}
|
|
627
|
+
})) || {};
|
|
628
|
+
var title = '';
|
|
629
|
+
|
|
630
|
+
if (obj.props) {
|
|
631
|
+
title = ((_a = obj === null || obj === void 0 ? void 0 : obj.props) === null || _a === void 0 ? void 0 : _a.title) || ((_b = obj === null || obj === void 0 ? void 0 : obj.props) === null || _b === void 0 ? void 0 : _b.label) || ((_c = obj === null || obj === void 0 ? void 0 : obj.props) === null || _c === void 0 ? void 0 : _c.children);
|
|
632
|
+
} else {
|
|
633
|
+
title = (obj === null || obj === void 0 ? void 0 : obj.title) || (obj === null || obj === void 0 ? void 0 : obj.label) || (obj === null || obj === void 0 ? void 0 : obj.children);
|
|
634
|
+
}
|
|
635
|
+
|
|
614
636
|
var hiddenStyle = isShowSearch && !!searchValue || singleVal ? {
|
|
615
637
|
visibility: 'hidden'
|
|
616
638
|
} : undefined;
|
|
617
639
|
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
|
|
618
640
|
className: singleCls,
|
|
619
|
-
ref: selectionRef
|
|
641
|
+
ref: selectionRef,
|
|
642
|
+
title: title
|
|
620
643
|
}, /*#__PURE__*/React.createElement("span", {
|
|
621
644
|
className: "".concat(selectPrefixCls, "-selection-search")
|
|
622
645
|
}, /*#__PURE__*/React.createElement("input", {
|
|
@@ -657,7 +680,10 @@ var InternalSelect = function InternalSelect(props, ref) {
|
|
|
657
680
|
value = item.value;
|
|
658
681
|
return (!maxTagCount || index <= maxTagCount - 1) && /*#__PURE__*/React.createElement("span", {
|
|
659
682
|
key: value,
|
|
660
|
-
className: classNames("".concat(selectPrefixCls, "-selection-tag"))
|
|
683
|
+
className: classNames("".concat(selectPrefixCls, "-selection-tag")),
|
|
684
|
+
onMouseDown: function onMouseDown(e) {
|
|
685
|
+
return e.preventDefault();
|
|
686
|
+
}
|
|
661
687
|
}, /*#__PURE__*/React.createElement(Tag, {
|
|
662
688
|
type: "edit",
|
|
663
689
|
style: TagStyle,
|
package/es/tree/tree.js
CHANGED
|
@@ -257,8 +257,6 @@ var InternalTree = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
257
257
|
if (!('checkedKeys' in TreeProps)) {
|
|
258
258
|
setCheckedKeys(checkState.checkedKeys);
|
|
259
259
|
setHalfCheckedKeys(checkState.halfCheckedKeys);
|
|
260
|
-
} else {
|
|
261
|
-
setHalfCheckedKeys(checkState.halfCheckedKeys);
|
|
262
260
|
}
|
|
263
261
|
|
|
264
262
|
onCheck && onCheck(checkState.checkedKeys, {
|
package/lib/checkbox/group.js
CHANGED
|
@@ -1,9 +1,11 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { DateType, InnerLocale, RangeValue, TimeUnit } from './interface';
|
|
3
|
+
import { IInnerPicker } from './date-picker';
|
|
3
4
|
export declare type ContextOperationRefProps = {
|
|
4
5
|
onKeyDown?: (e: React.KeyboardEvent<HTMLElement>) => boolean;
|
|
5
6
|
onClose?: () => void;
|
|
6
7
|
};
|
|
8
|
+
export declare type ISelectType = 'key' | 'mouse' | 'submit' | 'inner';
|
|
7
9
|
export interface SingleContextProps {
|
|
8
10
|
prefixCls: string;
|
|
9
11
|
viewDate: DateType;
|
|
@@ -21,9 +23,11 @@ export interface SingleContextProps {
|
|
|
21
23
|
seconds?: TimeUnit[];
|
|
22
24
|
disabledTimePanel?: boolean;
|
|
23
25
|
setViewDate: (date: DateType, index?: 0 | 1) => void;
|
|
24
|
-
onSelect: (date: DateType, type:
|
|
26
|
+
onSelect: (date: DateType, type: ISelectType) => void;
|
|
25
27
|
onDateMouseEnter: (date: DateType) => void;
|
|
26
28
|
onDateMouseLeave: (arg?: boolean) => void;
|
|
29
|
+
innerPicker: IInnerPicker;
|
|
30
|
+
setInnerPicker: (p: IInnerPicker) => void;
|
|
27
31
|
}
|
|
28
32
|
declare const Context: React.Context<SingleContextProps>;
|
|
29
33
|
export default Context;
|