@nutui/nutui-react 1.3.9 → 1.3.10
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 +36 -0
- package/dist/esm/Button.js +3 -1
- package/dist/esm/Checkbox.js +7 -121
- package/dist/esm/CheckboxGroup.js +36 -4
- package/dist/esm/Input.js +11 -4
- package/dist/esm/Menu.js +3 -2
- package/dist/esm/MenuItem.js +1 -2
- package/dist/esm/NoticeBar.js +12 -16
- package/dist/esm/Price.js +20 -23
- package/dist/esm/Radio.js +6 -115
- package/dist/esm/RadioGroup.js +36 -6
- package/dist/esm/TabbarItem.js +6 -5
- package/dist/esm/Tag.js +6 -4
- package/dist/esm/checkbox-255983fc.js +121 -0
- package/dist/esm/radio-cf953c7a.js +118 -0
- package/dist/esm/types/src/packages/checkbox/checkbox.d.ts +6 -1
- package/dist/esm/types/src/packages/checkboxgroup/checkboxgroup.d.ts +2 -0
- package/dist/esm/types/src/packages/checkboxgroup/type.d.ts +6 -0
- package/dist/esm/types/src/packages/input/input.d.ts +1 -0
- package/dist/esm/types/src/packages/nutui.react.taro.scss.d.ts +91 -0
- package/dist/esm/types/src/packages/price/price.d.ts +2 -0
- package/dist/esm/types/src/packages/radiogroup/radiogroup.d.ts +2 -0
- package/dist/esm/types/src/packages/radiogroup/type.d.ts +7 -0
- package/dist/esm/types/src/packages/tabbaritem/tabbaritem.d.ts +1 -1
- package/dist/locales/base.js +1 -1
- package/dist/locales/en-US.js +1 -1
- package/dist/locales/id-ID.js +1 -1
- package/dist/locales/zh-CN.js +1 -1
- package/dist/locales/zh-TW.js +1 -1
- package/dist/nutui.react.es.js +162 -83
- package/dist/nutui.react.umd.js +162 -83
- package/dist/packages/badge/badge.scss +10 -10
- package/dist/packages/button/button.scss +3 -3
- package/dist/packages/cell/cell.scss +1 -4
- package/dist/packages/cellgroup/cellgroup.scss +8 -0
- package/dist/packages/countdown/countdown.scss +1 -1
- package/dist/packages/infiniteloading/infiniteloading.scss +1 -1
- package/dist/packages/inputnumber/inputnumber.scss +3 -3
- package/dist/packages/noticebar/noticebar.scss +3 -0
- package/dist/packages/price/price.scss +27 -11
- package/dist/packages/radio/radio.scss +8 -7
- package/dist/packages/shortpassword/shortpassword.scss +4 -4
- package/dist/packages/skeleton/skeleton.scss +1 -1
- package/dist/packages/swiper/swiper.scss +4 -4
- package/dist/packages/switch/switch.scss +8 -8
- package/dist/packages/timepannel/timepannel.scss +3 -3
- package/dist/packages/timeselect/timeselect.scss +4 -4
- package/dist/style.css +1 -1
- package/dist/style.es.js +1 -1
- package/dist/styles/variables.scss +573 -248
- package/dist/types/index.d.ts +19 -3
- package/package.json +1 -1
- package/dist/esm/context-aa058329.js +0 -6
package/dist/esm/RadioGroup.js
CHANGED
|
@@ -1,18 +1,23 @@
|
|
|
1
1
|
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
|
|
2
2
|
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
|
|
3
3
|
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
4
|
-
var _excluded = ["className", "value", "onChange", "textPosition", "direction"]
|
|
4
|
+
var _excluded = ["className", "value", "onChange", "textPosition", "direction", "options"],
|
|
5
|
+
_excluded2 = ["label", "value", "disabled", "onChange"];
|
|
5
6
|
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
6
7
|
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
7
|
-
import React__default, { useState, useEffect } from 'react';
|
|
8
|
-
import { R as RadioContext } from './
|
|
8
|
+
import React__default, { useState, useEffect, useCallback } from 'react';
|
|
9
|
+
import { R as Radio, a as RadioContext } from './radio-cf953c7a.js';
|
|
9
10
|
import { c as cn } from './bem-893ad28d.js';
|
|
11
|
+
import './Icon.js';
|
|
12
|
+
import './RadioGroup.js';
|
|
13
|
+
import './typings-1c5f2628.js';
|
|
10
14
|
import '@bem-react/classname';
|
|
11
15
|
var defaultProps = {
|
|
12
16
|
value: null,
|
|
13
17
|
textPosition: 'right',
|
|
14
18
|
onChange: function onChange(value) {},
|
|
15
|
-
direction: 'vertical'
|
|
19
|
+
direction: 'vertical',
|
|
20
|
+
options: []
|
|
16
21
|
};
|
|
17
22
|
var RadioGroup = React__default.forwardRef(function (props, ref) {
|
|
18
23
|
var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props),
|
|
@@ -23,6 +28,7 @@ var RadioGroup = React__default.forwardRef(function (props, ref) {
|
|
|
23
28
|
_onChange = props.onChange,
|
|
24
29
|
textPosition = props.textPosition,
|
|
25
30
|
direction = props.direction,
|
|
31
|
+
options = props.options,
|
|
26
32
|
rest = _objectWithoutProperties(props, _excluded);
|
|
27
33
|
var _useState = useState(value),
|
|
28
34
|
_useState2 = _slicedToArray(_useState, 2),
|
|
@@ -63,6 +69,10 @@ var RadioGroup = React__default.forwardRef(function (props, ref) {
|
|
|
63
69
|
if (val2State === null) return false;
|
|
64
70
|
return val2State === child.props.value;
|
|
65
71
|
}
|
|
72
|
+
function validateChecked(value) {
|
|
73
|
+
if (val2State === null) return false;
|
|
74
|
+
return val2State === value;
|
|
75
|
+
}
|
|
66
76
|
function cloneChildren() {
|
|
67
77
|
return React__default.Children.map(children, function (child, index) {
|
|
68
78
|
var childChecked = validateChildChecked(child);
|
|
@@ -77,6 +87,26 @@ var RadioGroup = React__default.forwardRef(function (props, ref) {
|
|
|
77
87
|
});
|
|
78
88
|
}
|
|
79
89
|
|
|
90
|
+
var renderOptionsChildren = useCallback(function () {
|
|
91
|
+
return options === null || options === void 0 ? void 0 : options.map(function (_ref) {
|
|
92
|
+
var label = _ref.label,
|
|
93
|
+
value = _ref.value,
|
|
94
|
+
disabled = _ref.disabled,
|
|
95
|
+
onChange = _ref.onChange,
|
|
96
|
+
rest = _objectWithoutProperties(_ref, _excluded2);
|
|
97
|
+
var childChecked = validateChecked(value);
|
|
98
|
+
return React__default.createElement(Radio, _objectSpread(_objectSpread({
|
|
99
|
+
key: value === null || value === void 0 ? void 0 : value.toString(),
|
|
100
|
+
children: label,
|
|
101
|
+
value: value,
|
|
102
|
+
disabled: disabled,
|
|
103
|
+
onChange: onChange
|
|
104
|
+
}, rest), {}, {
|
|
105
|
+
textPosition: textPosition,
|
|
106
|
+
checked: childChecked
|
|
107
|
+
}));
|
|
108
|
+
});
|
|
109
|
+
}, [val2State]);
|
|
80
110
|
return React__default.createElement(RadioContext.Provider, {
|
|
81
111
|
value: {
|
|
82
112
|
onChange: function onChange(val) {
|
|
@@ -85,8 +115,8 @@ var RadioGroup = React__default.forwardRef(function (props, ref) {
|
|
|
85
115
|
}
|
|
86
116
|
}
|
|
87
117
|
}, React__default.createElement("div", _objectSpread({
|
|
88
|
-
className: "nut-radiogroup nut-radiogroup--".concat(props.direction)
|
|
89
|
-
}, rest), cloneChildren()));
|
|
118
|
+
className: "nut-radiogroup nut-radiogroup--".concat(props.direction, " ").concat(className || '')
|
|
119
|
+
}, rest), options !== null && options !== void 0 && options.length ? renderOptionsChildren() : cloneChildren()));
|
|
90
120
|
});
|
|
91
121
|
RadioGroup.defaultProps = defaultProps;
|
|
92
122
|
RadioGroup.displayName = 'NutRadioGroup';
|
package/dist/esm/TabbarItem.js
CHANGED
|
@@ -10,7 +10,7 @@ import '@bem-react/classname';
|
|
|
10
10
|
var defaultProps = _objectSpread(_objectSpread({}, ComponentDefaults), {}, {
|
|
11
11
|
dot: false,
|
|
12
12
|
size: '',
|
|
13
|
-
|
|
13
|
+
className: '',
|
|
14
14
|
tabTitle: '',
|
|
15
15
|
icon: '',
|
|
16
16
|
href: '',
|
|
@@ -26,7 +26,8 @@ var TabbarItem = function TabbarItem(props) {
|
|
|
26
26
|
var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props),
|
|
27
27
|
dot = _defaultProps$props.dot,
|
|
28
28
|
size = _defaultProps$props.size,
|
|
29
|
-
|
|
29
|
+
className = _defaultProps$props.className,
|
|
30
|
+
style = _defaultProps$props.style,
|
|
30
31
|
tabTitle = _defaultProps$props.tabTitle,
|
|
31
32
|
icon = _defaultProps$props.icon,
|
|
32
33
|
href = _defaultProps$props.href,
|
|
@@ -54,10 +55,10 @@ var TabbarItem = function TabbarItem(props) {
|
|
|
54
55
|
return React__default.createElement("div", {
|
|
55
56
|
className: "".concat(b({
|
|
56
57
|
active: active
|
|
57
|
-
})),
|
|
58
|
-
style: {
|
|
58
|
+
}), " ").concat(className),
|
|
59
|
+
style: _objectSpread(_objectSpread({}, style), {}, {
|
|
59
60
|
color: active ? activeColor : unactiveColor
|
|
60
|
-
},
|
|
61
|
+
}),
|
|
61
62
|
onClick: function onClick() {
|
|
62
63
|
handleClick(index);
|
|
63
64
|
}
|
package/dist/esm/Tag.js
CHANGED
|
@@ -19,6 +19,8 @@ var defaultProps = _objectSpread(_objectSpread({}, ComponentDefaults), {}, {
|
|
|
19
19
|
});
|
|
20
20
|
var Tag = function Tag(props) {
|
|
21
21
|
var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props),
|
|
22
|
+
className = _defaultProps$props.className,
|
|
23
|
+
style = _defaultProps$props.style,
|
|
22
24
|
color = _defaultProps$props.color,
|
|
23
25
|
plain = _defaultProps$props.plain,
|
|
24
26
|
type = _defaultProps$props.type,
|
|
@@ -68,8 +70,8 @@ var Tag = function Tag(props) {
|
|
|
68
70
|
return style;
|
|
69
71
|
};
|
|
70
72
|
return React__default.createElement("div", null, closeable ? isTagShow && React__default.createElement("div", {
|
|
71
|
-
className: "".concat(btnName),
|
|
72
|
-
style: getStyle(),
|
|
73
|
+
className: "".concat(btnName, " ").concat(className),
|
|
74
|
+
style: _objectSpread(_objectSpread({}, style), getStyle()),
|
|
73
75
|
onClick: function onClick(e) {
|
|
74
76
|
return handleClick(e);
|
|
75
77
|
}
|
|
@@ -88,8 +90,8 @@ var Tag = function Tag(props) {
|
|
|
88
90
|
}
|
|
89
91
|
}
|
|
90
92
|
})) : React__default.createElement("div", {
|
|
91
|
-
className: "".concat(btnName),
|
|
92
|
-
style: getStyle(),
|
|
93
|
+
className: "".concat(btnName, " ").concat(className),
|
|
94
|
+
style: _objectSpread(_objectSpread({}, style), getStyle()),
|
|
93
95
|
onClick: function onClick(e) {
|
|
94
96
|
return handleClick(e);
|
|
95
97
|
}
|
|
@@ -0,0 +1,121 @@
|
|
|
1
|
+
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
|
|
2
|
+
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
|
|
3
|
+
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
4
|
+
var _excluded = ["iconName", "iconSize", "label", "className", "textPosition", "iconActiveName", "checked", "disabled", "onChange", "indeterminate", "iconClassPrefix", "iconFontClassName", "iconIndeterminateName", "getParentVals", "max"];
|
|
5
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
6
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
7
|
+
import React__default, { useState, useEffect } from 'react';
|
|
8
|
+
import Icon from './Icon.js';
|
|
9
|
+
import CheckboxGroup from './CheckboxGroup.js';
|
|
10
|
+
import { c as cn } from './bem-893ad28d.js';
|
|
11
|
+
import { C as ComponentDefaults } from './typings-1c5f2628.js';
|
|
12
|
+
var defaultProps = _objectSpread(_objectSpread({}, ComponentDefaults), {}, {
|
|
13
|
+
checked: false,
|
|
14
|
+
disabled: false,
|
|
15
|
+
textPosition: 'right',
|
|
16
|
+
iconSize: 18,
|
|
17
|
+
iconName: 'check-normal',
|
|
18
|
+
iconActiveName: 'checked',
|
|
19
|
+
iconClassPrefix: 'nut-icon',
|
|
20
|
+
iconFontClassName: 'nutui-iconfont',
|
|
21
|
+
iconIndeterminateName: 'check-disabled',
|
|
22
|
+
onChange: function onChange(state, label) {}
|
|
23
|
+
});
|
|
24
|
+
var Checkbox = function Checkbox(props) {
|
|
25
|
+
var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props),
|
|
26
|
+
children = _defaultProps$props.children;
|
|
27
|
+
var b = cn('checkbox');
|
|
28
|
+
var iconName = props.iconName,
|
|
29
|
+
iconSize = props.iconSize,
|
|
30
|
+
label = props.label,
|
|
31
|
+
className = props.className,
|
|
32
|
+
textPosition = props.textPosition,
|
|
33
|
+
iconActiveName = props.iconActiveName,
|
|
34
|
+
checked = props.checked,
|
|
35
|
+
disabled = props.disabled,
|
|
36
|
+
onChange = props.onChange,
|
|
37
|
+
indeterminate = props.indeterminate,
|
|
38
|
+
iconClassPrefix = props.iconClassPrefix,
|
|
39
|
+
iconFontClassName = props.iconFontClassName,
|
|
40
|
+
iconIndeterminateName = props.iconIndeterminateName,
|
|
41
|
+
getParentVals = props.getParentVals,
|
|
42
|
+
max = props.max,
|
|
43
|
+
rest = _objectWithoutProperties(props, _excluded);
|
|
44
|
+
var _useState = useState(checked),
|
|
45
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
46
|
+
innerChecked = _useState2[0],
|
|
47
|
+
setInnerChecked = _useState2[1];
|
|
48
|
+
var _useState3 = useState(disabled),
|
|
49
|
+
_useState4 = _slicedToArray(_useState3, 2),
|
|
50
|
+
innerDisabled = _useState4[0],
|
|
51
|
+
setDisabled = _useState4[1];
|
|
52
|
+
var _useState5 = useState(indeterminate),
|
|
53
|
+
_useState6 = _slicedToArray(_useState5, 2),
|
|
54
|
+
_indeterminate = _useState6[0],
|
|
55
|
+
setIndeterminate = _useState6[1];
|
|
56
|
+
useEffect(function () {
|
|
57
|
+
setInnerChecked(checked);
|
|
58
|
+
setDisabled(disabled);
|
|
59
|
+
}, [disabled, checked]);
|
|
60
|
+
useEffect(function () {
|
|
61
|
+
setIndeterminate(indeterminate);
|
|
62
|
+
}, [indeterminate]);
|
|
63
|
+
var getIconName = function getIconName() {
|
|
64
|
+
if (!innerChecked) {
|
|
65
|
+
return iconName;
|
|
66
|
+
}
|
|
67
|
+
if (_indeterminate) {
|
|
68
|
+
return iconIndeterminateName;
|
|
69
|
+
}
|
|
70
|
+
return iconActiveName;
|
|
71
|
+
};
|
|
72
|
+
var renderIcon = function renderIcon() {
|
|
73
|
+
return React__default.createElement(Icon, {
|
|
74
|
+
classPrefix: iconClassPrefix,
|
|
75
|
+
fontClassName: iconFontClassName,
|
|
76
|
+
name: getIconName(),
|
|
77
|
+
size: iconSize,
|
|
78
|
+
className: color()
|
|
79
|
+
});
|
|
80
|
+
};
|
|
81
|
+
var color = function color() {
|
|
82
|
+
if (innerDisabled) {
|
|
83
|
+
return 'nut-checkbox__icon--disable';
|
|
84
|
+
}
|
|
85
|
+
if (innerChecked) {
|
|
86
|
+
if (_indeterminate) {
|
|
87
|
+
return 'nut-checkbox__icon--indeterminate';
|
|
88
|
+
}
|
|
89
|
+
return 'nut-checkbox__icon';
|
|
90
|
+
}
|
|
91
|
+
return 'nut-checkbox__icon--unchecked';
|
|
92
|
+
// return !innerDisabled ? (!innerChecked ? '#d6d6d6' : '#fa2c19') : '#f5f5f5'
|
|
93
|
+
};
|
|
94
|
+
|
|
95
|
+
var renderLabel = function renderLabel() {
|
|
96
|
+
return React__default.createElement("span", {
|
|
97
|
+
className: "".concat(b('label', {
|
|
98
|
+
disabled: innerDisabled
|
|
99
|
+
}), " ")
|
|
100
|
+
}, children || label);
|
|
101
|
+
};
|
|
102
|
+
var handleClick = function handleClick() {
|
|
103
|
+
if (!disabled) {
|
|
104
|
+
var latest = !innerChecked;
|
|
105
|
+
if (max !== undefined && latest && getParentVals().length >= max) return;
|
|
106
|
+
onChange && onChange(latest, label || children);
|
|
107
|
+
setInnerChecked(latest);
|
|
108
|
+
}
|
|
109
|
+
};
|
|
110
|
+
return React__default.createElement("div", _objectSpread(_objectSpread({
|
|
111
|
+
className: "".concat(b({
|
|
112
|
+
reverse: textPosition === 'left'
|
|
113
|
+
}), " ").concat(className || '')
|
|
114
|
+
}, rest), {}, {
|
|
115
|
+
onClick: handleClick
|
|
116
|
+
}), renderIcon(), renderLabel());
|
|
117
|
+
};
|
|
118
|
+
Checkbox.defaultProps = defaultProps;
|
|
119
|
+
Checkbox.displayName = 'NutCheckBox';
|
|
120
|
+
Checkbox.Group = CheckboxGroup;
|
|
121
|
+
export { Checkbox as C };
|
|
@@ -0,0 +1,118 @@
|
|
|
1
|
+
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
|
|
2
|
+
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
|
|
3
|
+
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
4
|
+
var _excluded = ["className", "disabled", "checked", "shape", "textPosition", "value", "iconName", "iconActiveName", "iconSize", "onChange", "iconClassPrefix", "iconFontClassName"];
|
|
5
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
6
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
7
|
+
import React__default, { useState, useContext, useEffect } from 'react';
|
|
8
|
+
import Icon from './Icon.js';
|
|
9
|
+
import RadioGroup from './RadioGroup.js';
|
|
10
|
+
import { C as ComponentDefaults } from './typings-1c5f2628.js';
|
|
11
|
+
var radioContext = {
|
|
12
|
+
onChange: function onChange(val) {}
|
|
13
|
+
};
|
|
14
|
+
var RadioContext = React__default.createContext(radioContext);
|
|
15
|
+
var defaultProps = _objectSpread(_objectSpread({}, ComponentDefaults), {}, {
|
|
16
|
+
className: '',
|
|
17
|
+
style: {},
|
|
18
|
+
disabled: false,
|
|
19
|
+
checked: false,
|
|
20
|
+
shape: 'round',
|
|
21
|
+
value: '',
|
|
22
|
+
textPosition: 'right',
|
|
23
|
+
iconName: 'check-normal',
|
|
24
|
+
iconActiveName: 'check-checked',
|
|
25
|
+
iconSize: 18,
|
|
26
|
+
onChange: function onChange(e) {}
|
|
27
|
+
});
|
|
28
|
+
var Radio = function Radio(props) {
|
|
29
|
+
var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props),
|
|
30
|
+
children = _defaultProps$props.children;
|
|
31
|
+
var className = props.className,
|
|
32
|
+
disabled = props.disabled,
|
|
33
|
+
checked = props.checked,
|
|
34
|
+
shape = props.shape,
|
|
35
|
+
textPosition = props.textPosition,
|
|
36
|
+
value = props.value,
|
|
37
|
+
iconName = props.iconName,
|
|
38
|
+
iconActiveName = props.iconActiveName,
|
|
39
|
+
iconSize = props.iconSize,
|
|
40
|
+
onChange = props.onChange,
|
|
41
|
+
iconClassPrefix = props.iconClassPrefix,
|
|
42
|
+
iconFontClassName = props.iconFontClassName,
|
|
43
|
+
rest = _objectWithoutProperties(props, _excluded);
|
|
44
|
+
var componentName = 'nut-radio';
|
|
45
|
+
var _useState = useState(checked),
|
|
46
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
47
|
+
checkedStatement = _useState2[0],
|
|
48
|
+
setCheckedStatement = _useState2[1];
|
|
49
|
+
var _useState3 = useState(value),
|
|
50
|
+
_useState4 = _slicedToArray(_useState3, 2),
|
|
51
|
+
valueStatement = _useState4[0],
|
|
52
|
+
setValueStatement = _useState4[1];
|
|
53
|
+
var _useState5 = useState(disabled),
|
|
54
|
+
_useState6 = _slicedToArray(_useState5, 2),
|
|
55
|
+
disabledStatement = _useState6[0],
|
|
56
|
+
setDisabledStatement = _useState6[1];
|
|
57
|
+
var context = useContext(RadioContext);
|
|
58
|
+
useEffect(function () {
|
|
59
|
+
setDisabledStatement(disabled);
|
|
60
|
+
setValueStatement(value);
|
|
61
|
+
setCheckedStatement(checked);
|
|
62
|
+
}, [disabled, value, checked]);
|
|
63
|
+
var renderLabel = function renderLabel() {
|
|
64
|
+
return React__default.createElement("div", {
|
|
65
|
+
className: "".concat(componentName, "__label ").concat(disabledStatement ? "".concat(componentName, "__label--disabled") : '')
|
|
66
|
+
}, children);
|
|
67
|
+
};
|
|
68
|
+
var renderButton = function renderButton() {
|
|
69
|
+
return React__default.createElement("div", {
|
|
70
|
+
className: "".concat(componentName, "__button ").concat(checkedStatement && "".concat(componentName, "__button--active"), " ").concat(disabledStatement ? "".concat(componentName, "__button--disabled") : '')
|
|
71
|
+
}, children);
|
|
72
|
+
};
|
|
73
|
+
var color = function color() {
|
|
74
|
+
if (disabledStatement) {
|
|
75
|
+
return 'nut-radio__icon--disable';
|
|
76
|
+
}
|
|
77
|
+
if (checkedStatement) {
|
|
78
|
+
return 'nut-radio__icon';
|
|
79
|
+
}
|
|
80
|
+
return 'nut-radio__icon--unchecked';
|
|
81
|
+
};
|
|
82
|
+
var renderIcon = function renderIcon() {
|
|
83
|
+
var iconName = props.iconName,
|
|
84
|
+
iconSize = props.iconSize,
|
|
85
|
+
iconActiveName = props.iconActiveName;
|
|
86
|
+
return React__default.createElement(Icon, {
|
|
87
|
+
classPrefix: iconClassPrefix,
|
|
88
|
+
fontClassName: iconFontClassName,
|
|
89
|
+
name: checkedStatement ? iconActiveName : iconName,
|
|
90
|
+
size: iconSize,
|
|
91
|
+
className: color()
|
|
92
|
+
});
|
|
93
|
+
};
|
|
94
|
+
var renderRadioItem = function renderRadioItem() {
|
|
95
|
+
if (shape === 'button') {
|
|
96
|
+
return renderButton();
|
|
97
|
+
}
|
|
98
|
+
if (reverseState) {
|
|
99
|
+
return React__default.createElement(React__default.Fragment, null, renderLabel(), renderIcon());
|
|
100
|
+
}
|
|
101
|
+
return React__default.createElement(React__default.Fragment, null, renderIcon(), renderLabel());
|
|
102
|
+
};
|
|
103
|
+
var handleClick = function handleClick(e) {
|
|
104
|
+
if (disabledStatement || checkedStatement) return;
|
|
105
|
+
setCheckedStatement(!checkedStatement);
|
|
106
|
+
onChange && onChange(e);
|
|
107
|
+
context && context.onChange(valueStatement);
|
|
108
|
+
};
|
|
109
|
+
var reverseState = textPosition === 'left';
|
|
110
|
+
return React__default.createElement("div", _objectSpread({
|
|
111
|
+
className: "nut-radio ".concat(className),
|
|
112
|
+
onClick: handleClick
|
|
113
|
+
}, rest), renderRadioItem());
|
|
114
|
+
};
|
|
115
|
+
Radio.defaultProps = defaultProps;
|
|
116
|
+
Radio.displayName = 'NutRadio';
|
|
117
|
+
Radio.RadioGroup = RadioGroup;
|
|
118
|
+
export { Radio as R, RadioContext as a };
|
|
@@ -1,6 +1,10 @@
|
|
|
1
1
|
import React, { FunctionComponent } from 'react';
|
|
2
2
|
import CheckboxGroup from '@/packages/checkboxgroup';
|
|
3
3
|
import { IComponent } from '@/utils/typings';
|
|
4
|
+
interface InheritParentProps {
|
|
5
|
+
getParentVals?: () => string[] | undefined;
|
|
6
|
+
max?: number | undefined;
|
|
7
|
+
}
|
|
4
8
|
export interface CheckboxProps extends IComponent {
|
|
5
9
|
checked: boolean;
|
|
6
10
|
disabled: boolean;
|
|
@@ -15,6 +19,7 @@ export interface CheckboxProps extends IComponent {
|
|
|
15
19
|
label: string;
|
|
16
20
|
onChange: (state: boolean, label: string) => void;
|
|
17
21
|
}
|
|
18
|
-
export declare const Checkbox: FunctionComponent<Partial<CheckboxProps> & Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange'
|
|
22
|
+
export declare const Checkbox: FunctionComponent<Partial<CheckboxProps> & Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange'> & InheritParentProps> & {
|
|
19
23
|
Group: typeof CheckboxGroup;
|
|
20
24
|
};
|
|
25
|
+
export {};
|
|
@@ -1,8 +1,10 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
+
import { RadioGroupOptionType } from '@/packages/radiogroup/type';
|
|
2
3
|
export interface CheckboxGroupProps {
|
|
3
4
|
disabled: boolean;
|
|
4
5
|
checkedValue: string[];
|
|
5
6
|
max: number | undefined;
|
|
6
7
|
onChange: (value: string[]) => void;
|
|
8
|
+
options: RadioGroupOptionType[];
|
|
7
9
|
}
|
|
8
10
|
export declare const CheckboxGroup: React.ForwardRefExoticComponent<Partial<CheckboxGroupProps> & Omit<React.HTMLAttributes<HTMLDivElement>, "onChange"> & React.RefAttributes<unknown>>;
|
|
@@ -11,6 +11,7 @@ export declare type InputRule = {
|
|
|
11
11
|
export declare type ConfirmTextType = 'send' | 'search' | 'next' | 'go' | 'done';
|
|
12
12
|
export interface InputProps extends IComponent {
|
|
13
13
|
type: InputType;
|
|
14
|
+
name: string;
|
|
14
15
|
defaultValue: any;
|
|
15
16
|
placeholder: string;
|
|
16
17
|
label: string;
|
|
@@ -0,0 +1,91 @@
|
|
|
1
|
+
import '@/packages/button/button.scss';
|
|
2
|
+
import '@/packages/cell/cell.scss';
|
|
3
|
+
import '@/packages/cellgroup/cellgroup.scss';
|
|
4
|
+
import '@/packages/icon/icon.scss';
|
|
5
|
+
import '@/packages/overlay/overlay.scss';
|
|
6
|
+
import '@/packages/popup/popup.scss';
|
|
7
|
+
import '@/packages/configprovider/configprovider.scss';
|
|
8
|
+
import '@/packages/layout/layout.scss';
|
|
9
|
+
import '@/packages/col/col.scss';
|
|
10
|
+
import '@/packages/row/row.scss';
|
|
11
|
+
import '@/packages/divider/divider.scss';
|
|
12
|
+
import '@/packages/grid/grid.scss';
|
|
13
|
+
import '@/packages/griditem/griditem.scss';
|
|
14
|
+
import '@/packages/sticky/sticky.scss';
|
|
15
|
+
import '@/packages/navbar/navbar.scss';
|
|
16
|
+
import '@/packages/fixednav/fixednav.scss';
|
|
17
|
+
import '@/packages/tabbar/tabbar.scss';
|
|
18
|
+
import '@/packages/tabbaritem/tabbaritem.scss';
|
|
19
|
+
import '@/packages/elevator/elevator.scss';
|
|
20
|
+
import '@/packages/pagination/pagination.scss';
|
|
21
|
+
import '@/packages/tabs/tabs.scss';
|
|
22
|
+
import '@/packages/tabpane/tabpane.scss';
|
|
23
|
+
import '@/packages/indicator/indicator.scss';
|
|
24
|
+
import '@/packages/sidenavbar/sidenavbar.scss';
|
|
25
|
+
import '@/packages/subsidenavbar/subsidenavbar.scss';
|
|
26
|
+
import '@/packages/sidenavbaritem/sidenavbaritem.scss';
|
|
27
|
+
import '@/packages/menu/menu.scss';
|
|
28
|
+
import '@/packages/menuitem/menuitem.scss';
|
|
29
|
+
import '@/packages/range/range.scss';
|
|
30
|
+
import '@/packages/calendar/calendar.scss';
|
|
31
|
+
import '@/packages/checkbox/checkbox.scss';
|
|
32
|
+
import '@/packages/checkboxgroup/checkboxgroup.scss';
|
|
33
|
+
import '@/packages/datepicker/datepicker.scss';
|
|
34
|
+
import '@/packages/inputnumber/inputnumber.scss';
|
|
35
|
+
import '@/packages/input/input.scss';
|
|
36
|
+
import '@/packages/radio/radio.scss';
|
|
37
|
+
import '@/packages/radiogroup/radiogroup.scss';
|
|
38
|
+
import '@/packages/rate/rate.scss';
|
|
39
|
+
import '@/packages/calendaritem/calendaritem.scss';
|
|
40
|
+
import '@/packages/picker/picker.scss';
|
|
41
|
+
import '@/packages/shortpassword/shortpassword.scss';
|
|
42
|
+
import '@/packages/textarea/textarea.scss';
|
|
43
|
+
import '@/packages/uploader/uploader.scss';
|
|
44
|
+
import '@/packages/cascader/cascader.scss';
|
|
45
|
+
import '@/packages/searchbar/searchbar.scss';
|
|
46
|
+
import '@/packages/numberkeyboard/numberkeyboard.scss';
|
|
47
|
+
import '@/packages/actionsheet/actionsheet.scss';
|
|
48
|
+
import '@/packages/backtop/backtop.scss';
|
|
49
|
+
import '@/packages/drag/drag.scss';
|
|
50
|
+
import '@/packages/dialog/dialog.scss';
|
|
51
|
+
import '@/packages/infiniteloading/infiniteloading.scss';
|
|
52
|
+
import '@/packages/notify/notify.scss';
|
|
53
|
+
import '@/packages/switch/switch.scss';
|
|
54
|
+
import '@/packages/toast/toast.scss';
|
|
55
|
+
import '@/packages/swipe/swipe.scss';
|
|
56
|
+
import '@/packages/pulltorefresh/pulltorefresh.scss';
|
|
57
|
+
import '@/packages/circleprogress/circleprogress.scss';
|
|
58
|
+
import '@/packages/noticebar/noticebar.scss';
|
|
59
|
+
import '@/packages/steps/steps.scss';
|
|
60
|
+
import '@/packages/step/step.scss';
|
|
61
|
+
import '@/packages/swiper/swiper.scss';
|
|
62
|
+
import '@/packages/swiperitem/swiperitem.scss';
|
|
63
|
+
import '@/packages/avatar/avatar.scss';
|
|
64
|
+
import '@/packages/avatargroup/avatargroup.scss';
|
|
65
|
+
import '@/packages/price/price.scss';
|
|
66
|
+
import '@/packages/badge/badge.scss';
|
|
67
|
+
import '@/packages/tag/tag.scss';
|
|
68
|
+
import '@/packages/popover/popover.scss';
|
|
69
|
+
import '@/packages/skeleton/skeleton.scss';
|
|
70
|
+
import '@/packages/countdown/countdown.scss';
|
|
71
|
+
import '@/packages/collapse/collapse.scss';
|
|
72
|
+
import '@/packages/collapseitem/collapseitem.scss';
|
|
73
|
+
import '@/packages/animatingnumbers/animatingnumbers.scss';
|
|
74
|
+
import '@/packages/empty/empty.scss';
|
|
75
|
+
import '@/packages/virtuallist/virtuallist.scss';
|
|
76
|
+
import '@/packages/table/table.scss';
|
|
77
|
+
import '@/packages/video/video.scss';
|
|
78
|
+
import '@/packages/progress/progress.scss';
|
|
79
|
+
import '@/packages/audio/audio.scss';
|
|
80
|
+
import '@/packages/imagepreview/imagepreview.scss';
|
|
81
|
+
import '@/packages/address/address.scss';
|
|
82
|
+
import '@/packages/barrage/barrage.scss';
|
|
83
|
+
import '@/packages/signature/signature.scss';
|
|
84
|
+
import '@/packages/card/card.scss';
|
|
85
|
+
import '@/packages/timepannel/timepannel.scss';
|
|
86
|
+
import '@/packages/timedetail/timedetail.scss';
|
|
87
|
+
import '@/packages/timeselect/timeselect.scss';
|
|
88
|
+
declare const _default: {
|
|
89
|
+
NutUI: string;
|
|
90
|
+
};
|
|
91
|
+
export default _default;
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
+
import { RadioGroupOptionType } from './type';
|
|
2
3
|
declare type Position = 'left' | 'right';
|
|
3
4
|
declare type Direction = 'horizontal' | 'vertical';
|
|
4
5
|
export interface RadioGroupProps {
|
|
@@ -6,6 +7,7 @@ export interface RadioGroupProps {
|
|
|
6
7
|
textPosition: Position;
|
|
7
8
|
direction: Direction;
|
|
8
9
|
onChange: (value: string | number | boolean) => void;
|
|
10
|
+
options: RadioGroupOptionType[];
|
|
9
11
|
}
|
|
10
12
|
export declare const RadioGroup: React.ForwardRefExoticComponent<Partial<RadioGroupProps> & Omit<React.HTMLAttributes<HTMLDivElement>, "onChange"> & React.RefAttributes<unknown>>;
|
|
11
13
|
export {};
|
package/dist/locales/base.js
CHANGED
package/dist/locales/en-US.js
CHANGED
package/dist/locales/id-ID.js
CHANGED
package/dist/locales/zh-CN.js
CHANGED
package/dist/locales/zh-TW.js
CHANGED