@kdcloudjs/kdesign 1.6.20 → 1.6.21
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/dist/kdesign-complete.less +11 -13
- package/dist/kdesign.css +19 -2
- package/dist/kdesign.css.map +1 -1
- package/dist/kdesign.js +107 -86
- package/dist/kdesign.js.map +1 -1
- package/dist/kdesign.min.css +2 -2
- package/dist/kdesign.min.js +5 -5
- package/dist/kdesign.min.js.map +1 -1
- package/es/checkbox/checkbox.js +1 -1
- package/es/checkbox/group.d.ts +1 -1
- package/es/checkbox/group.js +4 -4
- package/es/menu/style/index.css +18 -1
- package/es/menu/style/index.less +2 -13
- package/es/menu/style/mixin.less +9 -0
- package/es/radio/group.js +5 -6
- package/es/radio/interface.d.ts +2 -2
- package/es/radio/radio.js +24 -22
- package/lib/checkbox/checkbox.js +1 -1
- package/lib/checkbox/group.d.ts +1 -1
- package/lib/checkbox/group.js +4 -4
- package/lib/menu/style/index.css +18 -1
- package/lib/menu/style/index.less +2 -13
- package/lib/menu/style/mixin.less +9 -0
- package/lib/radio/group.js +5 -6
- package/lib/radio/interface.d.ts +2 -2
- package/lib/radio/radio.js +28 -23
- package/package.json +7 -2
package/es/checkbox/checkbox.js
CHANGED
|
@@ -87,7 +87,7 @@ var InternalCheckbox = function InternalCheckbox(props, ref) {
|
|
|
87
87
|
var innerIconClassName = classNames(_defineProperty({}, _concatInstanceProperty(_context18 = "".concat(checkboxPrefixCls, "-")).call(_context18, mergedCheckboxType, "-inner"), true));
|
|
88
88
|
var handleChange = useCallback(function (e) {
|
|
89
89
|
onChange && onChange(e);
|
|
90
|
-
(checkboxGroup === null || checkboxGroup === void 0 ? void 0 : checkboxGroup.onCheckboxGroupChange) && (checkboxGroup === null || checkboxGroup === void 0 ? void 0 : checkboxGroup.onCheckboxGroupChange(value, e.target.checked));
|
|
90
|
+
(checkboxGroup === null || checkboxGroup === void 0 ? void 0 : checkboxGroup.onCheckboxGroupChange) && (checkboxGroup === null || checkboxGroup === void 0 ? void 0 : checkboxGroup.onCheckboxGroupChange(value, e.target.checked, e));
|
|
91
91
|
|
|
92
92
|
if (!(checkboxGroup === null || checkboxGroup === void 0 ? void 0 : checkboxGroup.isControlled)) {
|
|
93
93
|
setSelected(e.target.checked);
|
package/es/checkbox/group.d.ts
CHANGED
|
@@ -10,7 +10,7 @@ export interface CheckboxGroupContext {
|
|
|
10
10
|
groupValue?: Array<CheckboxValueType>;
|
|
11
11
|
checkboxType?: CheckboxType;
|
|
12
12
|
disabled?: boolean;
|
|
13
|
-
onCheckboxGroupChange?: (checkedValue: CheckboxValueType, isChecked: boolean) => void;
|
|
13
|
+
onCheckboxGroupChange?: (checkedValue: CheckboxValueType, isChecked: boolean, e: React.ChangeEvent<HTMLInputElement>) => void;
|
|
14
14
|
}
|
|
15
15
|
export declare const GroupContext: React.Context<CheckboxGroupContext | null>;
|
|
16
16
|
export interface CheckboxGroupProps {
|
package/es/checkbox/group.js
CHANGED
|
@@ -66,7 +66,7 @@ var CheckboxGroup = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
66
66
|
return innerValue.current.indexOf(targetValue) > -1 ? innerValue.current : _concatInstanceProperty(_context2 = innerValue.current).call(_context2, targetValue);
|
|
67
67
|
};
|
|
68
68
|
|
|
69
|
-
var onCheckboxChange = function onCheckboxChange(checkedValue, isChecked) {
|
|
69
|
+
var onCheckboxChange = function onCheckboxChange(checkedValue, isChecked, e) {
|
|
70
70
|
var newVal = [];
|
|
71
71
|
|
|
72
72
|
if (isChecked) {
|
|
@@ -79,7 +79,7 @@ var CheckboxGroup = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
79
79
|
innerValue.current = newVal;
|
|
80
80
|
}
|
|
81
81
|
|
|
82
|
-
onChange && onChange(newVal);
|
|
82
|
+
onChange && onChange(e, newVal);
|
|
83
83
|
};
|
|
84
84
|
|
|
85
85
|
var context = {
|
|
@@ -88,8 +88,8 @@ var CheckboxGroup = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
88
88
|
name: name,
|
|
89
89
|
isControlled: isControlled,
|
|
90
90
|
checkboxType: checkboxType,
|
|
91
|
-
onCheckboxGroupChange: function onCheckboxGroupChange(checkedValue, isChecked) {
|
|
92
|
-
onCheckboxChange(checkedValue, isChecked);
|
|
91
|
+
onCheckboxGroupChange: function onCheckboxGroupChange(checkedValue, isChecked, e) {
|
|
92
|
+
onCheckboxChange(checkedValue, isChecked, e);
|
|
93
93
|
}
|
|
94
94
|
};
|
|
95
95
|
|
package/es/menu/style/index.css
CHANGED
|
@@ -104,6 +104,20 @@
|
|
|
104
104
|
/* 多行显示省略号 */
|
|
105
105
|
/* 单行显示省略号 */
|
|
106
106
|
/** 浮层箭头样式 **/
|
|
107
|
+
.menu-hidden {
|
|
108
|
+
opacity: 0;
|
|
109
|
+
visibility: hidden;
|
|
110
|
+
-webkit-animation: kdZoomTopLeftOut calc(var(--kd-c-menu-motion-duration, var(--kd-g-duration, 0.3s)) - 0.1s) cubic-bezier(0, 0.4, 0.4, 1) forwards;
|
|
111
|
+
animation: kdZoomTopLeftOut calc(var(--kd-c-menu-motion-duration, var(--kd-g-duration, 0.3s)) - 0.1s) cubic-bezier(0, 0.4, 0.4, 1) forwards;
|
|
112
|
+
-webkit-animation-delay: 0.1s;
|
|
113
|
+
animation-delay: 0.1s;
|
|
114
|
+
-webkit-transition: opacity, visibility;
|
|
115
|
+
transition: opacity, visibility;
|
|
116
|
+
-webkit-transition-duration: calc(var(--kd-c-menu-motion-duration, var(--kd-g-duration, 0.3s)) - 0.1s);
|
|
117
|
+
transition-duration: calc(var(--kd-c-menu-motion-duration, var(--kd-g-duration, 0.3s)) - 0.1s);
|
|
118
|
+
-webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.6, 1);
|
|
119
|
+
transition-timing-function: cubic-bezier(0.4, 0, 0.6, 1);
|
|
120
|
+
}
|
|
107
121
|
.menu-dark-hover {
|
|
108
122
|
background-color: var(--kd-c-menu-sub-color-background, #121319);
|
|
109
123
|
color: var(--kd-c-menu-sub-color-text-hover, var(--kd-g-color-white, #fff));
|
|
@@ -520,9 +534,10 @@
|
|
|
520
534
|
.kd-menu-popper.hidden {
|
|
521
535
|
opacity: 0;
|
|
522
536
|
visibility: hidden;
|
|
523
|
-
display: none;
|
|
524
537
|
-webkit-animation: kdZoomTopLeftOut calc(var(--kd-c-menu-motion-duration, var(--kd-g-duration, 0.3s)) - 0.1s) cubic-bezier(0, 0.4, 0.4, 1) forwards;
|
|
525
538
|
animation: kdZoomTopLeftOut calc(var(--kd-c-menu-motion-duration, var(--kd-g-duration, 0.3s)) - 0.1s) cubic-bezier(0, 0.4, 0.4, 1) forwards;
|
|
539
|
+
-webkit-animation-delay: 0.1s;
|
|
540
|
+
animation-delay: 0.1s;
|
|
526
541
|
-webkit-transition: opacity, visibility;
|
|
527
542
|
transition: opacity, visibility;
|
|
528
543
|
-webkit-transition-duration: calc(var(--kd-c-menu-motion-duration, var(--kd-g-duration, 0.3s)) - 0.1s);
|
|
@@ -562,6 +577,8 @@
|
|
|
562
577
|
visibility: hidden;
|
|
563
578
|
-webkit-animation: kdZoomTopLeftOut calc(var(--kd-c-menu-motion-duration, var(--kd-g-duration, 0.3s)) - 0.1s) cubic-bezier(0, 0.4, 0.4, 1) forwards;
|
|
564
579
|
animation: kdZoomTopLeftOut calc(var(--kd-c-menu-motion-duration, var(--kd-g-duration, 0.3s)) - 0.1s) cubic-bezier(0, 0.4, 0.4, 1) forwards;
|
|
580
|
+
-webkit-animation-delay: 0.1s;
|
|
581
|
+
animation-delay: 0.1s;
|
|
565
582
|
-webkit-transition: opacity, visibility;
|
|
566
583
|
transition: opacity, visibility;
|
|
567
584
|
-webkit-transition-duration: calc(var(--kd-c-menu-motion-duration, var(--kd-g-duration, 0.3s)) - 0.1s);
|
package/es/menu/style/index.less
CHANGED
|
@@ -187,13 +187,7 @@
|
|
|
187
187
|
}
|
|
188
188
|
|
|
189
189
|
&.hidden {
|
|
190
|
-
|
|
191
|
-
visibility: hidden;
|
|
192
|
-
display: none;
|
|
193
|
-
animation: kdZoomTopLeftOut calc(@menu-motion-duration - 0.1s) cubic-bezier(0, .4, .4, 1) forwards;
|
|
194
|
-
transition: opacity, visibility;
|
|
195
|
-
transition-duration: calc(@menu-motion-duration - 0.1s);
|
|
196
|
-
transition-timing-function: cubic-bezier(0.4, 0, 0.6, 1);
|
|
190
|
+
.menu-hidden()
|
|
197
191
|
}
|
|
198
192
|
|
|
199
193
|
.@{submenu-prefix-cls} {
|
|
@@ -223,12 +217,7 @@
|
|
|
223
217
|
}
|
|
224
218
|
|
|
225
219
|
&-hide {
|
|
226
|
-
|
|
227
|
-
visibility: hidden;
|
|
228
|
-
animation: kdZoomTopLeftOut calc(@menu-motion-duration - 0.1s) cubic-bezier(0, .4, .4, 1) forwards;
|
|
229
|
-
transition: opacity, visibility;
|
|
230
|
-
transition-duration: calc(@menu-motion-duration - 0.1s);
|
|
231
|
-
transition-timing-function: cubic-bezier(0.4, 0, 0.6, 1);
|
|
220
|
+
.menu-hidden()
|
|
232
221
|
}
|
|
233
222
|
}
|
|
234
223
|
}
|
package/es/menu/style/mixin.less
CHANGED
|
@@ -78,6 +78,15 @@
|
|
|
78
78
|
}
|
|
79
79
|
}
|
|
80
80
|
|
|
81
|
+
.menu-hidden {
|
|
82
|
+
opacity: 0;
|
|
83
|
+
visibility: hidden;
|
|
84
|
+
animation: kdZoomTopLeftOut calc(@menu-motion-duration - 0.1s) cubic-bezier(0, .4, .4, 1) forwards;
|
|
85
|
+
animation-delay: 0.1s;
|
|
86
|
+
transition: opacity, visibility;
|
|
87
|
+
transition-duration: calc(@menu-motion-duration - 0.1s);
|
|
88
|
+
transition-timing-function: cubic-bezier(0.4, 0, 0.6, 1);
|
|
89
|
+
}
|
|
81
90
|
|
|
82
91
|
.menu-dark-hover {
|
|
83
92
|
background-color: @menu-sub-color-background;
|
package/es/radio/group.js
CHANGED
|
@@ -22,23 +22,22 @@ var RadioGroup = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
22
22
|
|
|
23
23
|
|
|
24
24
|
React.useEffect(function () {
|
|
25
|
-
if (props.value) {
|
|
25
|
+
if (props.value !== undefined) {
|
|
26
26
|
setValue(props.value);
|
|
27
27
|
}
|
|
28
28
|
}, [props.value]);
|
|
29
29
|
|
|
30
|
-
var onRadioChange = function onRadioChange(ev) {
|
|
30
|
+
var onRadioChange = function onRadioChange(ev, checkedValue) {
|
|
31
31
|
var lastValue = value;
|
|
32
|
-
var val = ev.target.value;
|
|
33
32
|
|
|
34
33
|
if (!('value' in props)) {
|
|
35
|
-
setValue(
|
|
34
|
+
setValue(checkedValue);
|
|
36
35
|
}
|
|
37
36
|
|
|
38
37
|
var onChange = props.onChange;
|
|
39
38
|
|
|
40
|
-
if (onChange &&
|
|
41
|
-
onChange(ev);
|
|
39
|
+
if (onChange && checkedValue !== lastValue) {
|
|
40
|
+
onChange(ev, checkedValue);
|
|
42
41
|
}
|
|
43
42
|
};
|
|
44
43
|
|
package/es/radio/interface.d.ts
CHANGED
|
@@ -30,7 +30,7 @@ export interface IRadioGroupProps {
|
|
|
30
30
|
value?: any;
|
|
31
31
|
className?: string;
|
|
32
32
|
style?: React.CSSProperties;
|
|
33
|
-
onChange?: (e: React.ChangeEvent<HTMLInputElement
|
|
33
|
+
onChange?: (e: React.ChangeEvent<HTMLInputElement>, value: RadioValueType) => void;
|
|
34
34
|
size?: SizeType;
|
|
35
35
|
name?: string;
|
|
36
36
|
children?: React.ReactNode;
|
|
@@ -40,7 +40,7 @@ export interface IRadioGroupProps {
|
|
|
40
40
|
optionType?: RadioGroupOptionType;
|
|
41
41
|
}
|
|
42
42
|
export interface IRadioGroupContextProps {
|
|
43
|
-
onChange: (e: React.ChangeEvent<HTMLInputElement
|
|
43
|
+
onChange: (e: React.ChangeEvent<HTMLInputElement>, value: RadioValueType) => void;
|
|
44
44
|
value: any;
|
|
45
45
|
disabled?: boolean;
|
|
46
46
|
name?: string;
|
package/es/radio/radio.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import _defineProperty from "@babel/runtime-corejs3/helpers/defineProperty";
|
|
2
1
|
import _extends from "@babel/runtime-corejs3/helpers/extends";
|
|
2
|
+
import _defineProperty from "@babel/runtime-corejs3/helpers/defineProperty";
|
|
3
3
|
import _slicedToArray from "@babel/runtime-corejs3/helpers/slicedToArray";
|
|
4
4
|
import _Object$getOwnPropertySymbols from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols";
|
|
5
5
|
|
|
@@ -19,9 +19,12 @@ var __rest = this && this.__rest || function (s, e) {
|
|
|
19
19
|
import React, { useEffect } from 'react';
|
|
20
20
|
import classNames from 'classnames';
|
|
21
21
|
import isBoolean from 'lodash/isBoolean';
|
|
22
|
+
import isNumber from 'lodash/isNumber';
|
|
23
|
+
import isString from 'lodash/isString';
|
|
22
24
|
import ConfigContext from '../config-provider/ConfigContext';
|
|
23
25
|
import { getCompProps } from '../_utils';
|
|
24
26
|
import RadioGroupContext from './context';
|
|
27
|
+
import devWarning from '../_utils/devwarning';
|
|
25
28
|
|
|
26
29
|
var InternalRadio = function InternalRadio(props, ref) {
|
|
27
30
|
var _classNames;
|
|
@@ -42,14 +45,17 @@ var InternalRadio = function InternalRadio(props, ref) {
|
|
|
42
45
|
children = _a.children,
|
|
43
46
|
className = _a.className,
|
|
44
47
|
radioType = _a.radioType,
|
|
48
|
+
value = _a.value,
|
|
49
|
+
disabled = _a.disabled,
|
|
45
50
|
defaultChecked = _a.defaultChecked,
|
|
46
51
|
customPrefixcls = _a.prefixCls,
|
|
47
|
-
restProps = __rest(_a, ["style", "checked", "children", "className", "radioType", "defaultChecked", "prefixCls"]); // 属性需要合并一遍用户定义的默认属性
|
|
52
|
+
restProps = __rest(_a, ["style", "checked", "children", "className", "radioType", "value", "disabled", "defaultChecked", "prefixCls"]); // 属性需要合并一遍用户定义的默认属性
|
|
48
53
|
|
|
49
54
|
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
55
|
+
devWarning(!(isNumber(value) || isString(value)) && value !== '', 'radio', 'radio `value` type must string or number ');
|
|
56
|
+
devWarning(value === '', 'radio', 'radio value type is not empty string ');
|
|
57
|
+
var mergedDisabled = (context === null || context === void 0 ? void 0 : context.disabled) || restProps.disabled;
|
|
58
|
+
var initValue = context ? value === context.value : isBoolean(checked) ? checked : defaultChecked;
|
|
53
59
|
|
|
54
60
|
var getPrefix = function getPrefix(radioType) {
|
|
55
61
|
return "radio".concat(radioType === 'square' ? "-".concat(radioType) : '');
|
|
@@ -57,16 +63,15 @@ var InternalRadio = function InternalRadio(props, ref) {
|
|
|
57
63
|
|
|
58
64
|
var radioPrefixCls = getPrefixCls === null || getPrefixCls === void 0 ? void 0 : getPrefixCls(prefixCls, getPrefix(radioType), customPrefixcls); // 样式前缀
|
|
59
65
|
|
|
60
|
-
var _React$useState = React.useState(
|
|
66
|
+
var _React$useState = React.useState(initValue),
|
|
61
67
|
_React$useState2 = _slicedToArray(_React$useState, 2),
|
|
62
68
|
isChecked = _React$useState2[0],
|
|
63
69
|
setIsChecked = _React$useState2[1];
|
|
64
70
|
|
|
65
71
|
React.useEffect(function () {
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
var radioProps = _extends({}, restProps);
|
|
72
|
+
var checkedValue = context ? value === context.value : isBoolean(checked) ? checked : defaultChecked;
|
|
73
|
+
setIsChecked(checkedValue);
|
|
74
|
+
}, [checked, defaultChecked, context === null || context === void 0 ? void 0 : context.value]);
|
|
70
75
|
|
|
71
76
|
var onChange = function onChange(e) {
|
|
72
77
|
setIsChecked(e.target.checked);
|
|
@@ -76,19 +81,11 @@ var InternalRadio = function InternalRadio(props, ref) {
|
|
|
76
81
|
}
|
|
77
82
|
|
|
78
83
|
if (context === null || context === void 0 ? void 0 : context.onChange) {
|
|
79
|
-
context.onChange(e);
|
|
84
|
+
context.onChange(e, value);
|
|
80
85
|
}
|
|
81
86
|
};
|
|
82
87
|
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
if (context) {
|
|
86
|
-
radioProps.name = context.name;
|
|
87
|
-
radioProps.checked = String(props.value) === String(context.value);
|
|
88
|
-
radioProps.disabled = props.disabled || context.disabled;
|
|
89
|
-
}
|
|
90
|
-
|
|
91
|
-
var classString = classNames((_classNames = {}, _defineProperty(_classNames, "".concat(radioPrefixCls), true), _defineProperty(_classNames, "".concat(radioPrefixCls, "-disabled"), radioProps.disabled), _defineProperty(_classNames, "".concat(radioPrefixCls, "-checked"), context ? radioProps.checked : isChecked), _classNames), className); // 单选包裹元素class名称
|
|
88
|
+
var classString = classNames((_classNames = {}, _defineProperty(_classNames, "".concat(radioPrefixCls), true), _defineProperty(_classNames, "".concat(radioPrefixCls, "-disabled"), disabled), _defineProperty(_classNames, "".concat(radioPrefixCls, "-checked"), isChecked), _classNames), className); // 单选包裹元素class名称
|
|
92
89
|
|
|
93
90
|
useEffect(function () {
|
|
94
91
|
var _a;
|
|
@@ -119,8 +116,13 @@ var InternalRadio = function InternalRadio(props, ref) {
|
|
|
119
116
|
ref: mergedRef
|
|
120
117
|
}, /*#__PURE__*/React.createElement("input", _extends({
|
|
121
118
|
type: "radio",
|
|
122
|
-
className: "".concat(radioPrefixCls, "-input")
|
|
123
|
-
|
|
119
|
+
className: "".concat(radioPrefixCls, "-input"),
|
|
120
|
+
checked: isChecked,
|
|
121
|
+
onChange: onChange,
|
|
122
|
+
value: value,
|
|
123
|
+
name: context === null || context === void 0 ? void 0 : context.name,
|
|
124
|
+
disabled: mergedDisabled
|
|
125
|
+
}, restProps)), children !== undefined ? /*#__PURE__*/React.createElement("span", {
|
|
124
126
|
className: "".concat(radioPrefixCls, "-text")
|
|
125
127
|
}, children) : null)
|
|
126
128
|
);
|
package/lib/checkbox/checkbox.js
CHANGED
|
@@ -120,7 +120,7 @@ var InternalCheckbox = function InternalCheckbox(props, ref) {
|
|
|
120
120
|
var innerIconClassName = (0, _classnames.default)((0, _defineProperty2.default)({}, (0, _concat.default)(_context18 = "".concat(checkboxPrefixCls, "-")).call(_context18, mergedCheckboxType, "-inner"), true));
|
|
121
121
|
var handleChange = (0, _react.useCallback)(function (e) {
|
|
122
122
|
onChange && onChange(e);
|
|
123
|
-
(checkboxGroup === null || checkboxGroup === void 0 ? void 0 : checkboxGroup.onCheckboxGroupChange) && (checkboxGroup === null || checkboxGroup === void 0 ? void 0 : checkboxGroup.onCheckboxGroupChange(value, e.target.checked));
|
|
123
|
+
(checkboxGroup === null || checkboxGroup === void 0 ? void 0 : checkboxGroup.onCheckboxGroupChange) && (checkboxGroup === null || checkboxGroup === void 0 ? void 0 : checkboxGroup.onCheckboxGroupChange(value, e.target.checked, e));
|
|
124
124
|
|
|
125
125
|
if (!(checkboxGroup === null || checkboxGroup === void 0 ? void 0 : checkboxGroup.isControlled)) {
|
|
126
126
|
setSelected(e.target.checked);
|
package/lib/checkbox/group.d.ts
CHANGED
|
@@ -10,7 +10,7 @@ export interface CheckboxGroupContext {
|
|
|
10
10
|
groupValue?: Array<CheckboxValueType>;
|
|
11
11
|
checkboxType?: CheckboxType;
|
|
12
12
|
disabled?: boolean;
|
|
13
|
-
onCheckboxGroupChange?: (checkedValue: CheckboxValueType, isChecked: boolean) => void;
|
|
13
|
+
onCheckboxGroupChange?: (checkedValue: CheckboxValueType, isChecked: boolean, e: React.ChangeEvent<HTMLInputElement>) => void;
|
|
14
14
|
}
|
|
15
15
|
export declare const GroupContext: React.Context<CheckboxGroupContext | null>;
|
|
16
16
|
export interface CheckboxGroupProps {
|
package/lib/checkbox/group.js
CHANGED
|
@@ -105,7 +105,7 @@ var CheckboxGroup = /*#__PURE__*/_react.default.forwardRef(function (props, ref)
|
|
|
105
105
|
return innerValue.current.indexOf(targetValue) > -1 ? innerValue.current : (0, _concat.default)(_context2 = innerValue.current).call(_context2, targetValue);
|
|
106
106
|
};
|
|
107
107
|
|
|
108
|
-
var onCheckboxChange = function onCheckboxChange(checkedValue, isChecked) {
|
|
108
|
+
var onCheckboxChange = function onCheckboxChange(checkedValue, isChecked, e) {
|
|
109
109
|
var newVal = [];
|
|
110
110
|
|
|
111
111
|
if (isChecked) {
|
|
@@ -118,7 +118,7 @@ var CheckboxGroup = /*#__PURE__*/_react.default.forwardRef(function (props, ref)
|
|
|
118
118
|
innerValue.current = newVal;
|
|
119
119
|
}
|
|
120
120
|
|
|
121
|
-
onChange && onChange(newVal);
|
|
121
|
+
onChange && onChange(e, newVal);
|
|
122
122
|
};
|
|
123
123
|
|
|
124
124
|
var context = {
|
|
@@ -127,8 +127,8 @@ var CheckboxGroup = /*#__PURE__*/_react.default.forwardRef(function (props, ref)
|
|
|
127
127
|
name: name,
|
|
128
128
|
isControlled: isControlled,
|
|
129
129
|
checkboxType: checkboxType,
|
|
130
|
-
onCheckboxGroupChange: function onCheckboxGroupChange(checkedValue, isChecked) {
|
|
131
|
-
onCheckboxChange(checkedValue, isChecked);
|
|
130
|
+
onCheckboxGroupChange: function onCheckboxGroupChange(checkedValue, isChecked, e) {
|
|
131
|
+
onCheckboxChange(checkedValue, isChecked, e);
|
|
132
132
|
}
|
|
133
133
|
};
|
|
134
134
|
|
package/lib/menu/style/index.css
CHANGED
|
@@ -104,6 +104,20 @@
|
|
|
104
104
|
/* 多行显示省略号 */
|
|
105
105
|
/* 单行显示省略号 */
|
|
106
106
|
/** 浮层箭头样式 **/
|
|
107
|
+
.menu-hidden {
|
|
108
|
+
opacity: 0;
|
|
109
|
+
visibility: hidden;
|
|
110
|
+
-webkit-animation: kdZoomTopLeftOut calc(var(--kd-c-menu-motion-duration, var(--kd-g-duration, 0.3s)) - 0.1s) cubic-bezier(0, 0.4, 0.4, 1) forwards;
|
|
111
|
+
animation: kdZoomTopLeftOut calc(var(--kd-c-menu-motion-duration, var(--kd-g-duration, 0.3s)) - 0.1s) cubic-bezier(0, 0.4, 0.4, 1) forwards;
|
|
112
|
+
-webkit-animation-delay: 0.1s;
|
|
113
|
+
animation-delay: 0.1s;
|
|
114
|
+
-webkit-transition: opacity, visibility;
|
|
115
|
+
transition: opacity, visibility;
|
|
116
|
+
-webkit-transition-duration: calc(var(--kd-c-menu-motion-duration, var(--kd-g-duration, 0.3s)) - 0.1s);
|
|
117
|
+
transition-duration: calc(var(--kd-c-menu-motion-duration, var(--kd-g-duration, 0.3s)) - 0.1s);
|
|
118
|
+
-webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.6, 1);
|
|
119
|
+
transition-timing-function: cubic-bezier(0.4, 0, 0.6, 1);
|
|
120
|
+
}
|
|
107
121
|
.menu-dark-hover {
|
|
108
122
|
background-color: var(--kd-c-menu-sub-color-background, #121319);
|
|
109
123
|
color: var(--kd-c-menu-sub-color-text-hover, var(--kd-g-color-white, #fff));
|
|
@@ -520,9 +534,10 @@
|
|
|
520
534
|
.kd-menu-popper.hidden {
|
|
521
535
|
opacity: 0;
|
|
522
536
|
visibility: hidden;
|
|
523
|
-
display: none;
|
|
524
537
|
-webkit-animation: kdZoomTopLeftOut calc(var(--kd-c-menu-motion-duration, var(--kd-g-duration, 0.3s)) - 0.1s) cubic-bezier(0, 0.4, 0.4, 1) forwards;
|
|
525
538
|
animation: kdZoomTopLeftOut calc(var(--kd-c-menu-motion-duration, var(--kd-g-duration, 0.3s)) - 0.1s) cubic-bezier(0, 0.4, 0.4, 1) forwards;
|
|
539
|
+
-webkit-animation-delay: 0.1s;
|
|
540
|
+
animation-delay: 0.1s;
|
|
526
541
|
-webkit-transition: opacity, visibility;
|
|
527
542
|
transition: opacity, visibility;
|
|
528
543
|
-webkit-transition-duration: calc(var(--kd-c-menu-motion-duration, var(--kd-g-duration, 0.3s)) - 0.1s);
|
|
@@ -562,6 +577,8 @@
|
|
|
562
577
|
visibility: hidden;
|
|
563
578
|
-webkit-animation: kdZoomTopLeftOut calc(var(--kd-c-menu-motion-duration, var(--kd-g-duration, 0.3s)) - 0.1s) cubic-bezier(0, 0.4, 0.4, 1) forwards;
|
|
564
579
|
animation: kdZoomTopLeftOut calc(var(--kd-c-menu-motion-duration, var(--kd-g-duration, 0.3s)) - 0.1s) cubic-bezier(0, 0.4, 0.4, 1) forwards;
|
|
580
|
+
-webkit-animation-delay: 0.1s;
|
|
581
|
+
animation-delay: 0.1s;
|
|
565
582
|
-webkit-transition: opacity, visibility;
|
|
566
583
|
transition: opacity, visibility;
|
|
567
584
|
-webkit-transition-duration: calc(var(--kd-c-menu-motion-duration, var(--kd-g-duration, 0.3s)) - 0.1s);
|
|
@@ -187,13 +187,7 @@
|
|
|
187
187
|
}
|
|
188
188
|
|
|
189
189
|
&.hidden {
|
|
190
|
-
|
|
191
|
-
visibility: hidden;
|
|
192
|
-
display: none;
|
|
193
|
-
animation: kdZoomTopLeftOut calc(@menu-motion-duration - 0.1s) cubic-bezier(0, .4, .4, 1) forwards;
|
|
194
|
-
transition: opacity, visibility;
|
|
195
|
-
transition-duration: calc(@menu-motion-duration - 0.1s);
|
|
196
|
-
transition-timing-function: cubic-bezier(0.4, 0, 0.6, 1);
|
|
190
|
+
.menu-hidden()
|
|
197
191
|
}
|
|
198
192
|
|
|
199
193
|
.@{submenu-prefix-cls} {
|
|
@@ -223,12 +217,7 @@
|
|
|
223
217
|
}
|
|
224
218
|
|
|
225
219
|
&-hide {
|
|
226
|
-
|
|
227
|
-
visibility: hidden;
|
|
228
|
-
animation: kdZoomTopLeftOut calc(@menu-motion-duration - 0.1s) cubic-bezier(0, .4, .4, 1) forwards;
|
|
229
|
-
transition: opacity, visibility;
|
|
230
|
-
transition-duration: calc(@menu-motion-duration - 0.1s);
|
|
231
|
-
transition-timing-function: cubic-bezier(0.4, 0, 0.6, 1);
|
|
220
|
+
.menu-hidden()
|
|
232
221
|
}
|
|
233
222
|
}
|
|
234
223
|
}
|
|
@@ -78,6 +78,15 @@
|
|
|
78
78
|
}
|
|
79
79
|
}
|
|
80
80
|
|
|
81
|
+
.menu-hidden {
|
|
82
|
+
opacity: 0;
|
|
83
|
+
visibility: hidden;
|
|
84
|
+
animation: kdZoomTopLeftOut calc(@menu-motion-duration - 0.1s) cubic-bezier(0, .4, .4, 1) forwards;
|
|
85
|
+
animation-delay: 0.1s;
|
|
86
|
+
transition: opacity, visibility;
|
|
87
|
+
transition-duration: calc(@menu-motion-duration - 0.1s);
|
|
88
|
+
transition-timing-function: cubic-bezier(0.4, 0, 0.6, 1);
|
|
89
|
+
}
|
|
81
90
|
|
|
82
91
|
.menu-dark-hover {
|
|
83
92
|
background-color: @menu-sub-color-background;
|
package/lib/radio/group.js
CHANGED
|
@@ -50,23 +50,22 @@ var RadioGroup = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
50
50
|
|
|
51
51
|
|
|
52
52
|
React.useEffect(function () {
|
|
53
|
-
if (props.value) {
|
|
53
|
+
if (props.value !== undefined) {
|
|
54
54
|
setValue(props.value);
|
|
55
55
|
}
|
|
56
56
|
}, [props.value]);
|
|
57
57
|
|
|
58
|
-
var onRadioChange = function onRadioChange(ev) {
|
|
58
|
+
var onRadioChange = function onRadioChange(ev, checkedValue) {
|
|
59
59
|
var lastValue = value;
|
|
60
|
-
var val = ev.target.value;
|
|
61
60
|
|
|
62
61
|
if (!('value' in props)) {
|
|
63
|
-
setValue(
|
|
62
|
+
setValue(checkedValue);
|
|
64
63
|
}
|
|
65
64
|
|
|
66
65
|
var onChange = props.onChange;
|
|
67
66
|
|
|
68
|
-
if (onChange &&
|
|
69
|
-
onChange(ev);
|
|
67
|
+
if (onChange && checkedValue !== lastValue) {
|
|
68
|
+
onChange(ev, checkedValue);
|
|
70
69
|
}
|
|
71
70
|
};
|
|
72
71
|
|
package/lib/radio/interface.d.ts
CHANGED
|
@@ -30,7 +30,7 @@ export interface IRadioGroupProps {
|
|
|
30
30
|
value?: any;
|
|
31
31
|
className?: string;
|
|
32
32
|
style?: React.CSSProperties;
|
|
33
|
-
onChange?: (e: React.ChangeEvent<HTMLInputElement
|
|
33
|
+
onChange?: (e: React.ChangeEvent<HTMLInputElement>, value: RadioValueType) => void;
|
|
34
34
|
size?: SizeType;
|
|
35
35
|
name?: string;
|
|
36
36
|
children?: React.ReactNode;
|
|
@@ -40,7 +40,7 @@ export interface IRadioGroupProps {
|
|
|
40
40
|
optionType?: RadioGroupOptionType;
|
|
41
41
|
}
|
|
42
42
|
export interface IRadioGroupContextProps {
|
|
43
|
-
onChange: (e: React.ChangeEvent<HTMLInputElement
|
|
43
|
+
onChange: (e: React.ChangeEvent<HTMLInputElement>, value: RadioValueType) => void;
|
|
44
44
|
value: any;
|
|
45
45
|
disabled?: boolean;
|
|
46
46
|
name?: string;
|
package/lib/radio/radio.js
CHANGED
|
@@ -13,10 +13,10 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
13
13
|
});
|
|
14
14
|
exports.default = void 0;
|
|
15
15
|
|
|
16
|
-
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/defineProperty"));
|
|
17
|
-
|
|
18
16
|
var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
|
|
19
17
|
|
|
18
|
+
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/defineProperty"));
|
|
19
|
+
|
|
20
20
|
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/slicedToArray"));
|
|
21
21
|
|
|
22
22
|
var _getOwnPropertySymbols = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols"));
|
|
@@ -27,12 +27,18 @@ var _classnames = _interopRequireDefault(require("classnames"));
|
|
|
27
27
|
|
|
28
28
|
var _isBoolean = _interopRequireDefault(require("lodash/isBoolean"));
|
|
29
29
|
|
|
30
|
+
var _isNumber = _interopRequireDefault(require("lodash/isNumber"));
|
|
31
|
+
|
|
32
|
+
var _isString = _interopRequireDefault(require("lodash/isString"));
|
|
33
|
+
|
|
30
34
|
var _ConfigContext = _interopRequireDefault(require("../config-provider/ConfigContext"));
|
|
31
35
|
|
|
32
36
|
var _utils = require("../_utils");
|
|
33
37
|
|
|
34
38
|
var _context = _interopRequireDefault(require("./context"));
|
|
35
39
|
|
|
40
|
+
var _devwarning = _interopRequireDefault(require("../_utils/devwarning"));
|
|
41
|
+
|
|
36
42
|
function _getRequireWildcardCache(nodeInterop) { if (typeof _WeakMap !== "function") return null; var cacheBabelInterop = new _WeakMap(); var cacheNodeInterop = new _WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
37
43
|
|
|
38
44
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && _Object$getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? _Object$getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
@@ -70,14 +76,17 @@ var InternalRadio = function InternalRadio(props, ref) {
|
|
|
70
76
|
children = _a.children,
|
|
71
77
|
className = _a.className,
|
|
72
78
|
radioType = _a.radioType,
|
|
79
|
+
value = _a.value,
|
|
80
|
+
disabled = _a.disabled,
|
|
73
81
|
defaultChecked = _a.defaultChecked,
|
|
74
82
|
customPrefixcls = _a.prefixCls,
|
|
75
|
-
restProps = __rest(_a, ["style", "checked", "children", "className", "radioType", "defaultChecked", "prefixCls"]); // 属性需要合并一遍用户定义的默认属性
|
|
83
|
+
restProps = __rest(_a, ["style", "checked", "children", "className", "radioType", "value", "disabled", "defaultChecked", "prefixCls"]); // 属性需要合并一遍用户定义的默认属性
|
|
76
84
|
|
|
77
85
|
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
86
|
+
(0, _devwarning.default)(!((0, _isNumber.default)(value) || (0, _isString.default)(value)) && value !== '', 'radio', 'radio `value` type must string or number ');
|
|
87
|
+
(0, _devwarning.default)(value === '', 'radio', 'radio value type is not empty string ');
|
|
88
|
+
var mergedDisabled = (context === null || context === void 0 ? void 0 : context.disabled) || restProps.disabled;
|
|
89
|
+
var initValue = context ? value === context.value : (0, _isBoolean.default)(checked) ? checked : defaultChecked;
|
|
81
90
|
|
|
82
91
|
var getPrefix = function getPrefix(radioType) {
|
|
83
92
|
return "radio".concat(radioType === 'square' ? "-".concat(radioType) : '');
|
|
@@ -85,16 +94,15 @@ var InternalRadio = function InternalRadio(props, ref) {
|
|
|
85
94
|
|
|
86
95
|
var radioPrefixCls = getPrefixCls === null || getPrefixCls === void 0 ? void 0 : getPrefixCls(prefixCls, getPrefix(radioType), customPrefixcls); // 样式前缀
|
|
87
96
|
|
|
88
|
-
var _React$useState = _react.default.useState(
|
|
97
|
+
var _React$useState = _react.default.useState(initValue),
|
|
89
98
|
_React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
|
|
90
99
|
isChecked = _React$useState2[0],
|
|
91
100
|
setIsChecked = _React$useState2[1];
|
|
92
101
|
|
|
93
102
|
_react.default.useEffect(function () {
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
var radioProps = (0, _extends2.default)({}, restProps);
|
|
103
|
+
var checkedValue = context ? value === context.value : (0, _isBoolean.default)(checked) ? checked : defaultChecked;
|
|
104
|
+
setIsChecked(checkedValue);
|
|
105
|
+
}, [checked, defaultChecked, context === null || context === void 0 ? void 0 : context.value]);
|
|
98
106
|
|
|
99
107
|
var onChange = function onChange(e) {
|
|
100
108
|
setIsChecked(e.target.checked);
|
|
@@ -104,19 +112,11 @@ var InternalRadio = function InternalRadio(props, ref) {
|
|
|
104
112
|
}
|
|
105
113
|
|
|
106
114
|
if (context === null || context === void 0 ? void 0 : context.onChange) {
|
|
107
|
-
context.onChange(e);
|
|
115
|
+
context.onChange(e, value);
|
|
108
116
|
}
|
|
109
117
|
};
|
|
110
118
|
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
if (context) {
|
|
114
|
-
radioProps.name = context.name;
|
|
115
|
-
radioProps.checked = String(props.value) === String(context.value);
|
|
116
|
-
radioProps.disabled = props.disabled || context.disabled;
|
|
117
|
-
}
|
|
118
|
-
|
|
119
|
-
var classString = (0, _classnames.default)((_classNames = {}, (0, _defineProperty2.default)(_classNames, "".concat(radioPrefixCls), true), (0, _defineProperty2.default)(_classNames, "".concat(radioPrefixCls, "-disabled"), radioProps.disabled), (0, _defineProperty2.default)(_classNames, "".concat(radioPrefixCls, "-checked"), context ? radioProps.checked : isChecked), _classNames), className); // 单选包裹元素class名称
|
|
119
|
+
var classString = (0, _classnames.default)((_classNames = {}, (0, _defineProperty2.default)(_classNames, "".concat(radioPrefixCls), true), (0, _defineProperty2.default)(_classNames, "".concat(radioPrefixCls, "-disabled"), disabled), (0, _defineProperty2.default)(_classNames, "".concat(radioPrefixCls, "-checked"), isChecked), _classNames), className); // 单选包裹元素class名称
|
|
120
120
|
|
|
121
121
|
(0, _react.useEffect)(function () {
|
|
122
122
|
var _a;
|
|
@@ -147,8 +147,13 @@ var InternalRadio = function InternalRadio(props, ref) {
|
|
|
147
147
|
ref: mergedRef
|
|
148
148
|
}, /*#__PURE__*/_react.default.createElement("input", (0, _extends2.default)({
|
|
149
149
|
type: "radio",
|
|
150
|
-
className: "".concat(radioPrefixCls, "-input")
|
|
151
|
-
|
|
150
|
+
className: "".concat(radioPrefixCls, "-input"),
|
|
151
|
+
checked: isChecked,
|
|
152
|
+
onChange: onChange,
|
|
153
|
+
value: value,
|
|
154
|
+
name: context === null || context === void 0 ? void 0 : context.name,
|
|
155
|
+
disabled: mergedDisabled
|
|
156
|
+
}, restProps)), children !== undefined ? /*#__PURE__*/_react.default.createElement("span", {
|
|
152
157
|
className: "".concat(radioPrefixCls, "-text")
|
|
153
158
|
}, children) : null)
|
|
154
159
|
);
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@kdcloudjs/kdesign",
|
|
3
|
-
"version": "1.6.
|
|
3
|
+
"version": "1.6.21",
|
|
4
4
|
"description": "KDesign 金蝶前端react 组件库",
|
|
5
5
|
"title": "kdesign",
|
|
6
6
|
"keywords": [
|
|
@@ -63,7 +63,8 @@
|
|
|
63
63
|
"pub:beta": "npm run test:all && npm run build && cross-env PUB_ENV=pub np --no-cleanup --anyBranch --no-tests --tag=beta",
|
|
64
64
|
"prepublishOnly": "node scripts/guard.js",
|
|
65
65
|
"new": "node scripts/create-component.js",
|
|
66
|
-
"token": "node scripts/generate-token.js"
|
|
66
|
+
"token": "node scripts/generate-token.js",
|
|
67
|
+
"preinstall": "npx force-resolutions"
|
|
67
68
|
},
|
|
68
69
|
"browserslist": [
|
|
69
70
|
"last 2 versions",
|
|
@@ -102,6 +103,7 @@
|
|
|
102
103
|
"@babel/preset-react": "^7.10.4",
|
|
103
104
|
"@babel/preset-typescript": "^7.10.4",
|
|
104
105
|
"@commitlint/config-conventional": "^9.1.2",
|
|
106
|
+
"@types/babel__traverse": "7.17.1",
|
|
105
107
|
"@types/big.js": "^6.0.0",
|
|
106
108
|
"@types/classnames": "^2.2.10",
|
|
107
109
|
"@types/enzyme": "^3.10.7",
|
|
@@ -237,5 +239,8 @@
|
|
|
237
239
|
"path": "./node_modules/cz-customizable"
|
|
238
240
|
}
|
|
239
241
|
},
|
|
242
|
+
"resolutions": {
|
|
243
|
+
"@types/babel__traverse": "7.17.1"
|
|
244
|
+
},
|
|
240
245
|
"license": "Apache-2.0"
|
|
241
246
|
}
|