@nutui/nutui-react 2.0.0-alpha.14 → 2.0.0-alpha.16
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 +28 -0
- package/dist/esm/Card/style/style.css +1 -1
- package/dist/esm/Card.js +35 -22
- package/dist/esm/ConfigProvider.js +1 -1
- package/dist/esm/DatePicker.js +54 -58
- package/dist/esm/Dialog/style/index.js +1 -0
- package/dist/esm/Dialog/style/style.css +1 -1
- package/dist/esm/InfiniteLoading/style/style.css +1 -0
- package/dist/esm/{Infiniteloading.js → InfiniteLoading.js} +25 -37
- package/dist/esm/Menu/style/style.css +1 -1
- package/dist/esm/Menu.js +5 -3
- package/dist/esm/MenuItem/style/style.css +1 -1
- package/dist/esm/MenuItem.js +31 -44
- package/dist/esm/NoticeBar.js +2 -2
- package/dist/esm/Picker.js +1 -1
- package/dist/esm/Popover.js +3 -40
- package/dist/esm/Popup.js +1 -1
- package/dist/esm/Signature/style/index.js +1 -1
- package/dist/esm/Signature/style/style.css +1 -1
- package/dist/esm/Signature.js +27 -35
- package/dist/esm/Tag/style/style.css +1 -1
- package/dist/esm/Tag.js +26 -30
- package/dist/esm/TimeDetail/style/style.css +1 -1
- package/dist/esm/TimeDetail.js +39 -41
- package/dist/esm/TimeSelect/style/index.js +0 -1
- package/dist/esm/TimeSelect/style/style.css +1 -1
- package/dist/esm/TimeSelect.js +91 -114
- package/dist/esm/Toast.js +16 -7
- package/dist/esm/Uploader.js +1 -1
- package/dist/esm/index.js +2 -2
- package/dist/esm/nutui-react.es.js +8 -10
- package/dist/esm/types/src/locales/base.d.ts +1 -1
- package/dist/esm/types/src/packages/card/card.d.ts +8 -9
- package/dist/esm/types/src/packages/card/card.taro.d.ts +8 -9
- package/dist/esm/types/src/packages/card/index.d.ts +1 -0
- package/dist/esm/types/src/packages/card/index.taro.d.ts +1 -0
- package/dist/esm/types/src/packages/configprovider/types.d.ts +1 -1
- package/dist/esm/types/src/packages/datepicker/datepicker.d.ts +11 -17
- package/dist/esm/types/src/packages/datepicker/datepicker.taro.d.ts +11 -17
- package/dist/esm/types/src/packages/datepicker/index.d.ts +1 -0
- package/dist/esm/types/src/packages/datepicker/index.taro.d.ts +1 -0
- package/dist/esm/types/src/packages/imagepreview/imagepreview.taro.d.ts +1 -0
- package/dist/esm/types/src/packages/infiniteloading/demo.taro.d.ts +2 -2
- package/dist/esm/types/src/packages/infiniteloading/index.d.ts +3 -2
- package/dist/esm/types/src/packages/infiniteloading/index.taro.d.ts +3 -2
- package/dist/esm/types/src/packages/infiniteloading/infiniteloading.d.ts +9 -14
- package/dist/esm/types/src/packages/infiniteloading/infiniteloading.taro.d.ts +8 -12
- package/dist/esm/types/src/packages/nutui.react.build.d.ts +2 -3
- package/dist/esm/types/src/packages/nutui.react.d.ts +2 -4
- package/dist/esm/types/src/packages/nutui.react.scss.d.ts +0 -1
- package/dist/esm/types/src/packages/nutui.react.taro.d.ts +2 -4
- package/dist/esm/types/src/packages/nutui.react.taro.scss.d.ts +0 -1
- package/dist/esm/types/src/packages/nutui.taro.react.build.d.ts +2 -3
- package/dist/esm/types/src/packages/signature/index.d.ts +1 -0
- package/dist/esm/types/src/packages/signature/index.taro.d.ts +1 -0
- package/dist/esm/types/src/packages/signature/signature.d.ts +10 -8
- package/dist/esm/types/src/packages/signature/signature.taro.d.ts +7 -12
- package/dist/esm/types/src/packages/tag/index.d.ts +1 -0
- package/dist/esm/types/src/packages/tag/index.taro.d.ts +1 -0
- package/dist/esm/types/src/packages/tag/tag.d.ts +4 -6
- package/dist/esm/types/src/packages/tag/tag.taro.d.ts +4 -6
- package/dist/esm/types/src/packages/timedetail/index.d.ts +1 -2
- package/dist/esm/types/src/packages/timedetail/timedetail.d.ts +9 -11
- package/dist/esm/types/src/packages/timedetail/timedetail.taro.d.ts +9 -11
- package/dist/esm/types/src/packages/timeselect/demo.taro.d.ts +0 -4
- package/dist/esm/types/src/packages/timeselect/index.d.ts +1 -0
- package/dist/esm/types/src/packages/timeselect/index.taro.d.ts +1 -0
- package/dist/esm/types/src/packages/timeselect/timeselect.d.ts +25 -20
- package/dist/esm/types/src/packages/timeselect/timeselect.taro.d.ts +25 -20
- package/dist/esm/types/src/packages/toast/Notification.d.ts +4 -1
- package/dist/esm/use-click-away.js +43 -0
- package/dist/locales/base.d.ts +1 -1
- package/dist/locales/base.js +1 -1
- package/dist/locales/en-US.js +2 -2
- package/dist/locales/id-ID.js +2 -2
- package/dist/locales/tr-TR.js +2 -2
- package/dist/locales/zh-CN.js +2 -2
- package/dist/locales/zh-TW.js +2 -2
- package/dist/locales/zh-UG.js +2 -2
- package/dist/nutui.react.es.js +765 -828
- package/dist/nutui.react.umd.js +765 -828
- package/dist/packages/card/card.scss +8 -14
- package/dist/packages/infiniteloading/infiniteloading.scss +2 -25
- package/dist/packages/menuitem/menuitem.scss +1 -1
- package/dist/packages/noticebar/noticebar.scss +0 -3
- package/dist/packages/signature/signature.scss +1 -18
- package/dist/packages/tag/tag.scss +10 -17
- package/dist/packages/timedetail/timedetail.scss +12 -37
- package/dist/packages/timeselect/timeselect.scss +15 -44
- package/dist/style.css +1 -1
- package/dist/style.mjs +1 -1
- package/dist/styles/themes/default.scss +0 -1
- package/dist/styles/variables-jmapp.scss +50 -97
- package/dist/styles/variables.scss +51 -98
- package/dist/types/index.d.ts +2 -3
- package/dist/types/locales/base.d.ts +1 -1
- package/dist/types/packages/card/card.d.ts +57 -14
- package/dist/types/packages/card/index.d.ts +1 -0
- package/dist/types/packages/configprovider/types.d.ts +1 -1
- package/dist/types/packages/datepicker/datepicker.d.ts +79 -25
- package/dist/types/packages/datepicker/index.d.ts +1 -0
- package/dist/types/packages/infiniteloading/index.d.ts +3 -2
- package/dist/types/packages/infiniteloading/infiniteloading.d.ts +57 -18
- package/dist/types/packages/signature/index.d.ts +1 -0
- package/dist/types/packages/signature/signature.d.ts +38 -12
- package/dist/types/packages/tag/index.d.ts +1 -0
- package/dist/types/packages/tag/tag.d.ts +52 -14
- package/dist/types/packages/timedetail/index.d.ts +1 -2
- package/dist/types/packages/timedetail/timedetail.d.ts +9 -11
- package/dist/types/packages/timeselect/index.d.ts +1 -0
- package/dist/types/packages/timeselect/timeselect.d.ts +62 -21
- package/dist/types/packages/toast/Notification.d.ts +4 -1
- package/package.json +1 -1
- package/dist/esm/Infiniteloading/style/style.css +0 -1
- package/dist/esm/TimePannel/style/css.js +0 -1
- package/dist/esm/TimePannel/style/index.js +0 -2
- package/dist/esm/TimePannel/style/style.css +0 -1
- package/dist/esm/TimePannel.js +0 -47
- package/dist/esm/types/src/packages/timedetail/demo.d.ts +0 -3
- package/dist/esm/types/src/packages/timedetail/demo.taro.d.ts +0 -3
- package/dist/esm/types/src/packages/timepannel/demo.d.ts +0 -3
- package/dist/esm/types/src/packages/timepannel/demo.taro.d.ts +0 -3
- package/dist/esm/types/src/packages/timepannel/index.d.ts +0 -2
- package/dist/esm/types/src/packages/timepannel/index.taro.d.ts +0 -2
- package/dist/esm/types/src/packages/timepannel/timepannel.d.ts +0 -8
- package/dist/esm/types/src/packages/timepannel/timepannel.taro.d.ts +0 -8
- package/dist/packages/timepannel/timepannel.scss +0 -17
- package/dist/types/packages/timepannel/index.d.ts +0 -2
- package/dist/types/packages/timepannel/timepannel.d.ts +0 -8
- /package/dist/esm/{Infiniteloading → InfiniteLoading}/style/css.js +0 -0
- /package/dist/esm/{Infiniteloading → InfiniteLoading}/style/index.js +0 -0
package/CHANGELOG.md
CHANGED
|
@@ -1,3 +1,31 @@
|
|
|
1
|
+
# v2.0.0-alpha.16
|
|
2
|
+
`2023-06-09`
|
|
3
|
+
|
|
4
|
+
* :bug: fix(toast): 修复连续调用 show 方法时无法销毁的问题 (#1102) @Eiinu
|
|
5
|
+
* :bug: fix: dialog 需要增加 overlay 的样式,否则按需加载样式出现异常 (#1103) @oasis-cloud
|
|
6
|
+
* :bug: fix: menu 组件被使用 transform 的组件嵌套后,遮罩层发生偏移 (#1093) @oasis-cloud
|
|
7
|
+
* :bug: fix: noticebar 修复小程序多行展示问题 (#1107) @xiaoyatong
|
|
8
|
+
* :bug: fix: pikcer 在关闭动画未结束时修改 visible,导致状态更新异常 (#1097) @oasis-cloud
|
|
9
|
+
* 🛠 refactor: datepicker (#1091) @xiaoyatong
|
|
10
|
+
* 🔨 chore: 修复 Taro Demo 的字号 (#1105) @oasis-cloud
|
|
11
|
+
* 🔨 chore(script): 生成 Props 功能增强 (#1096) @Eiinu
|
|
12
|
+
* 📖 docs: 文档修订 (#1106) @xiaoyatong
|
|
13
|
+
|
|
14
|
+
|
|
15
|
+
# v2.0.0-alpha.15
|
|
16
|
+
`2023-06-07`
|
|
17
|
+
|
|
18
|
+
* :sparkles: feat(ci): add codecov (#1092) @Eiinu
|
|
19
|
+
* :sparkles: feat(ci): add lint action (#1098) @Eiinu
|
|
20
|
+
* :sparkles: feat: imagepreview 组件在小程序中支持长按图片保存 (#1090) @oasis-cloud
|
|
21
|
+
* :bug: fix: 单元测试问题修复 (#1095) @Eiinu
|
|
22
|
+
* 🛠 refactor: card (#1069) @拧巴的猫
|
|
23
|
+
* 🛠 refactor: infiniteloading (#1085) @junjun666
|
|
24
|
+
* 🛠 refactor: signature (#1080) @拧巴的猫
|
|
25
|
+
* 🛠 refactor: tag (#1089) @xiaoyatong
|
|
26
|
+
* 🛠 refactor: TimeSelect (#1088) @Eiinu
|
|
27
|
+
|
|
28
|
+
|
|
1
29
|
# v2.0.0-alpha.14
|
|
2
30
|
`2023-06-02`
|
|
3
31
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.nut-price{font-size:var(--nutui-font-size-3, 16px);display:inline;color:var(--nutui-brand-color, #fa2c19)}.nut-price--line div{text-decoration:line-through;font-size:var(--nutui-price-line-font-size, 12px)!important;color:var(--nutui-price-line-color, var(--nutui-gray-2, #757575))!important}.nut-price__symbol,.nut-price__integer,.nut-price__decimal{display:inline-block}.nut-price__symbol{font-size:var(--nutui-price-symbol-medium-size, 14px);padding-right:var(--nutui-price-symbol-padding-right, 1px)}.nut-price__symbol-large{font-size:var(--nutui-price-symbol-big-size, 18px)}.nut-price__symbol-small{font-size:var(--nutui-price-symbol-small-size, 10px)}.nut-price__integer{font-size:var(--nutui-price-integer-medium-size, 16px)}.nut-price__integer-large{font-size:var(--nutui-price-integer-big-size, 24px)}.nut-price__integer-small{font-size:var(--nutui-price-integer-small-size, 12px)}.nut-price__decimal{font-size:var(--nutui-price-decimal-medium-size, 14px)}.nut-price__decimal-large{font-size:var(--nutui-price-decimal-big-size, 18px)}.nut-price__decimal-small{font-size:var(--nutui-price-decimal-small-size, 10px)}.nut-tag{padding:var(--nutui-tag-padding, 0 4px);display:inline-flex;justify-content:center;align-items:center;font-size:var(--nutui-tag-font-size, 12px);border-radius:var(--nutui-tag-
|
|
1
|
+
.nut-price{font-size:var(--nutui-font-size-3, 16px);display:inline;color:var(--nutui-brand-color, #fa2c19)}.nut-price--line div{text-decoration:line-through;font-size:var(--nutui-price-line-font-size, 12px)!important;color:var(--nutui-price-line-color, var(--nutui-gray-2, #757575))!important}.nut-price__symbol,.nut-price__integer,.nut-price__decimal{display:inline-block}.nut-price__symbol{font-size:var(--nutui-price-symbol-medium-size, 14px);padding-right:var(--nutui-price-symbol-padding-right, 1px)}.nut-price__symbol-large{font-size:var(--nutui-price-symbol-big-size, 18px)}.nut-price__symbol-small{font-size:var(--nutui-price-symbol-small-size, 10px)}.nut-price__integer{font-size:var(--nutui-price-integer-medium-size, 16px)}.nut-price__integer-large{font-size:var(--nutui-price-integer-big-size, 24px)}.nut-price__integer-small{font-size:var(--nutui-price-integer-small-size, 12px)}.nut-price__decimal{font-size:var(--nutui-price-decimal-medium-size, 14px)}.nut-price__decimal-large{font-size:var(--nutui-price-decimal-big-size, 18px)}.nut-price__decimal-small{font-size:var(--nutui-price-decimal-small-size, 10px)}.nut-tag{padding:var(--nutui-tag-padding, 0 4px);display:inline-flex;justify-content:center;align-items:center;font-size:var(--nutui-tag-font-size, 12px);border-radius:var(--nutui-tag-border-radius, 4px);height:var(--nutui-tag-height, auto);color:var(--nutui-tag-color, #ffffff);border:var(--nutui-tag-border-width, 1px) solid transparent}.nut-tag .nut-icon{vertical-align:middle;margin-left:4px}.nut-tag--default{background:var(--nutui-tag-background-color, #000000)}.nut-tag--default.nut-tag--plain{color:var(--nutui-tag-background-color, #000000);background-color:#fff;border:var(--nutui-tag-border-width, 1px) solid var(--nutui-tag-background-color, #000000)}.nut-tag--primary{background:var(--nutui-tag-primary-background-color, var(--nutui-brand-color, #fa2c19))}.nut-tag--primary.nut-tag--plain{color:var(--nutui-tag-background-color, #000000);background-color:#fff;border:var(--nutui-tag-border-width, 1px) solid var(--nutui-tag-background-color, #000000)}.nut-tag--success{background:var(--nutui-tag-success-background-color, #4fc08d)}.nut-tag--success.nut-tag--plain{color:var(--nutui-tag-background-color, #000000);background-color:#fff;border:var(--nutui-tag-border-width, 1px) solid var(--nutui-tag-background-color, #000000)}.nut-tag--danger{background:linear-gradient(135deg,rgb(242,20,12) 0%,rgb(232,34,14) 69.8395009973%,rgb(242,77,12) 100%)}.nut-tag--danger.nut-tag--plain{color:var(--nutui-tag-background-color, #000000);background-color:#fff;border:var(--nutui-tag-border-width, 1px) solid var(--nutui-tag-background-color, #000000)}.nut-tag--warning{background:var(--nutui-tag-warning-background-color, #f3812e)}.nut-tag--warning.nut-tag--plain{color:var(--nutui-tag-background-color, #000000);background-color:#fff;border:var(--nutui-tag-border-width, 1px) solid var(--nutui-tag-background-color, #000000)}.nut-tag--round{border-radius:var(--nutui-tag-round-border-radius, 8px)}.nut-tag--mark{border-radius:var(--nutui-tag-mark-border-radius, 0 12px 12px 0)}.nut-tag--close{cursor:pointer}.nut-tag-custom-icon{display:inline-flex;align-items:center;justify-content:center}.nut-card{width:100%;display:flex}.nut-card .nut-card__left{width:120px;height:120px;flex-shrink:0;background-color:var(--nutui-card-left-background-color, inherit);border-radius:var(--nutui-card-left-border-radius, 0)}.nut-card .nut-card__left>img{display:block;width:100%;height:100%}.nut-card .nut-card__right{flex:1;padding:0 10px 8px}.nut-card .nut-card__right .nut-card__right-title{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;word-break:break-all;line-height:1.5;font-size:14px}.nut-card .nut-card__right .nut-cardright-price{display:flex;align-items:center;height:18px;line-height:18px;margin-top:9px}.nut-card .nut-card__right .nut-cardright-price .nut-price .nut-price__big{font-size:18px}.nut-card .nut-card__right .nut-cardright-price .nut-price .nut-price__symbol,.nut-card .nut-card__right .nut-cardright-price .nut-price .nut-price__point,.nut-card .nut-card__right .nut-cardright-price .nut-price .nut-price__small{font-size:12px}.nut-card .nut-card__right .nut-cardright-price .nut-cardright-price-origin.nut-price{margin-left:2px;color:#d2a448}.nut-card .nut-card__right .nut-cardright-price .nut-cardright-price-origin.nut-price .nut-price__big,.nut-card .nut-card__right .nut-cardright-price .nut-cardright-price-origin.nut-price .nut-price__symbol,.nut-card .nut-card__right .nut-cardright-price .nut-cardright-price-origin.nut-price .nut-price__point,.nut-card .nut-card__right .nut-cardright-price .nut-cardright-price-origin.nut-price .nut-price__small{font-size:12px}.nut-card .nut-card__right .nut-cardright-other{display:flex;align-items:center;padding:5px 0 2px}.nut-card .nut-card__right .nut-cardright-other .nut-tag{padding:0 2px;margin-right:5px;font-size:var(--nutui-font-size-0, 10px)}.nut-card .nut-card__right .nut-cardright-shop{display:flex;justify-content:space-between;align-items:center}.nut-card .nut-card__right .nut-cardright-shop .nut-cardright-shop-name{line-height:1.5;color:#999;font-size:12px;padding-top:4px}
|
package/dist/esm/Card.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
2
1
|
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
|
|
3
|
-
|
|
2
|
+
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
3
|
+
var _excluded = ["className", "style", "src", "title", "price", "vipPrice", "shopDescription", "delivery", "shopName", "tag", "priceTag", "description", "extra"];
|
|
4
4
|
function ownKeys(object, enumerableOnly) {
|
|
5
5
|
var keys = Object.keys(object);
|
|
6
6
|
if (Object.getOwnPropertySymbols) {
|
|
@@ -26,42 +26,55 @@ import React__default from "react";
|
|
|
26
26
|
import classNames from "classnames";
|
|
27
27
|
import Price from "./Price.js";
|
|
28
28
|
import Tag from "./Tag.js";
|
|
29
|
-
import {
|
|
30
|
-
|
|
31
|
-
|
|
29
|
+
import { C as ComponentDefaults } from "./typings.js";
|
|
30
|
+
var defaultProps = _objectSpread(_objectSpread({}, ComponentDefaults), {}, {
|
|
31
|
+
src: "",
|
|
32
|
+
title: "",
|
|
33
|
+
price: "",
|
|
34
|
+
vipPrice: "",
|
|
35
|
+
shopDescription: "",
|
|
36
|
+
delivery: "",
|
|
37
|
+
shopName: "",
|
|
38
|
+
description: "",
|
|
39
|
+
tag: "",
|
|
40
|
+
priceTag: "",
|
|
41
|
+
extra: ""
|
|
42
|
+
});
|
|
32
43
|
var Card = function Card2(props) {
|
|
33
|
-
var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props), className = _defaultProps$props.className, style = _defaultProps$props.style,
|
|
34
|
-
var
|
|
44
|
+
var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props), className = _defaultProps$props.className, style = _defaultProps$props.style, src = _defaultProps$props.src, title = _defaultProps$props.title, price = _defaultProps$props.price, vipPrice = _defaultProps$props.vipPrice, shopDescription = _defaultProps$props.shopDescription, delivery = _defaultProps$props.delivery, shopName = _defaultProps$props.shopName, tag = _defaultProps$props.tag, priceTag = _defaultProps$props.priceTag, description = _defaultProps$props.description, extra = _defaultProps$props.extra, rest = _objectWithoutProperties(_defaultProps$props, _excluded);
|
|
45
|
+
var classPrefix = "nut-card";
|
|
35
46
|
return React__default.createElement("div", _objectSpread({
|
|
36
|
-
className: classNames(
|
|
47
|
+
className: classNames(classPrefix, className),
|
|
37
48
|
style
|
|
38
49
|
}, rest), React__default.createElement("div", {
|
|
39
|
-
className:
|
|
50
|
+
className: "".concat(classPrefix, "__left")
|
|
40
51
|
}, React__default.createElement("img", {
|
|
41
|
-
src
|
|
52
|
+
src,
|
|
42
53
|
alt: ""
|
|
43
54
|
})), React__default.createElement("div", {
|
|
44
|
-
className:
|
|
55
|
+
className: "".concat(classPrefix, "__right")
|
|
45
56
|
}, React__default.createElement("div", {
|
|
46
|
-
className:
|
|
47
|
-
}, title),
|
|
48
|
-
className:
|
|
57
|
+
className: "".concat(classPrefix, "__right-title")
|
|
58
|
+
}, title), description, React__default.createElement("div", {
|
|
59
|
+
className: "".concat(classPrefix, "right-price")
|
|
49
60
|
}, React__default.createElement(Price, {
|
|
61
|
+
size: "normal",
|
|
50
62
|
price
|
|
51
|
-
}),
|
|
52
|
-
|
|
63
|
+
}), priceTag || React__default.createElement(Price, {
|
|
64
|
+
size: "normal",
|
|
65
|
+
className: "".concat(classPrefix, "right-price-origin"),
|
|
53
66
|
price: vipPrice
|
|
54
67
|
})), React__default.createElement("div", {
|
|
55
|
-
className:
|
|
56
|
-
},
|
|
68
|
+
className: "".concat(classPrefix, "right-other")
|
|
69
|
+
}, tag || React__default.createElement(React__default.Fragment, null, React__default.createElement(Tag, {
|
|
57
70
|
type: "danger"
|
|
58
|
-
},
|
|
71
|
+
}, shopDescription), React__default.createElement(Tag, {
|
|
59
72
|
plain: true
|
|
60
73
|
}, delivery))), React__default.createElement("div", {
|
|
61
|
-
className:
|
|
74
|
+
className: "".concat(classPrefix, "right-shop")
|
|
62
75
|
}, React__default.createElement("div", {
|
|
63
|
-
className:
|
|
64
|
-
}, shopName),
|
|
76
|
+
className: "".concat(classPrefix, "right-shop-name")
|
|
77
|
+
}, shopName), extra)));
|
|
65
78
|
};
|
|
66
79
|
Card.defaultProps = defaultProps;
|
|
67
80
|
Card.displayName = "NutCard";
|
package/dist/esm/DatePicker.js
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
|
|
2
2
|
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
|
|
3
|
-
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
4
3
|
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
|
|
5
|
-
|
|
4
|
+
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
5
|
+
var _excluded = ["startDate", "endDate", "type", "showChinese", "minuteStep", "visible", "title", "defaultValue", "formatter", "onClose", "onConfirm", "filter", "onChange", "threeDimensional", "className", "style"];
|
|
6
6
|
function ownKeys(object, enumerableOnly) {
|
|
7
7
|
var keys = Object.keys(object);
|
|
8
8
|
if (Object.getOwnPropertySymbols) {
|
|
@@ -24,32 +24,25 @@ function _objectSpread(target) {
|
|
|
24
24
|
}
|
|
25
25
|
return target;
|
|
26
26
|
}
|
|
27
|
-
import React__default, { useState,
|
|
27
|
+
import React__default, { useState, useEffect } from "react";
|
|
28
28
|
import Picker from "./Picker.js";
|
|
29
29
|
import { useConfig } from "./ConfigProvider.js";
|
|
30
|
+
import { u as usePropsValue } from "./use-props-value.js";
|
|
31
|
+
import { C as ComponentDefaults } from "./typings.js";
|
|
30
32
|
var currentYear = /* @__PURE__ */ (/* @__PURE__ */ new Date()).getFullYear();
|
|
31
|
-
var defaultProps = {
|
|
32
|
-
modelValue: null,
|
|
33
|
+
var defaultProps = _objectSpread(_objectSpread({}, ComponentDefaults), {}, {
|
|
33
34
|
visible: false,
|
|
34
35
|
title: "",
|
|
35
36
|
type: "date",
|
|
36
|
-
|
|
37
|
+
showChinese: false,
|
|
37
38
|
threeDimensional: true,
|
|
38
39
|
minuteStep: 1,
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
};
|
|
40
|
+
startDate: new Date(currentYear - 10, 0, 1),
|
|
41
|
+
endDate: new Date(currentYear + 10, 11, 31)
|
|
42
|
+
});
|
|
42
43
|
var DatePicker = function DatePicker2(props) {
|
|
43
|
-
var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props),
|
|
44
|
+
var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props), startDate = _defaultProps$props.startDate, endDate = _defaultProps$props.endDate, type = _defaultProps$props.type, showChinese = _defaultProps$props.showChinese, minuteStep = _defaultProps$props.minuteStep, visible = _defaultProps$props.visible, title = _defaultProps$props.title, defaultValue = _defaultProps$props.defaultValue, formatter = _defaultProps$props.formatter, onClose = _defaultProps$props.onClose, _onConfirm = _defaultProps$props.onConfirm, filter = _defaultProps$props.filter, onChange = _defaultProps$props.onChange, threeDimensional = _defaultProps$props.threeDimensional, className = _defaultProps$props.className, style = _defaultProps$props.style, rest = _objectWithoutProperties(_defaultProps$props, _excluded);
|
|
44
45
|
var _useConfig = useConfig(), locale = _useConfig.locale;
|
|
45
|
-
var _useState = useState(false), _useState2 = _slicedToArray(_useState, 2), show = _useState2[0], setShow = _useState2[1];
|
|
46
|
-
var _useState3 = useState(modelValue), _useState4 = _slicedToArray(_useState3, 2), currentDate = _useState4[0], setCurrentDate = _useState4[1];
|
|
47
|
-
var _useState5 = useState([]), _useState6 = _slicedToArray(_useState5, 2), defaultValue = _useState6[0], setDefaultValue = _useState6[1];
|
|
48
|
-
var _useState7 = useState([]), _useState8 = _slicedToArray(_useState7, 2), options = _useState8[0], setListData = _useState8[1];
|
|
49
|
-
var pickerRef = useRef(null);
|
|
50
|
-
var isDate = function isDate2(val) {
|
|
51
|
-
return Object.prototype.toString.call(val) === "[object Date]" && !Number.isNaN(val.getTime());
|
|
52
|
-
};
|
|
53
46
|
var datepickerLang = locale.datepicker;
|
|
54
47
|
var zhCNType = {
|
|
55
48
|
day: datepickerLang.day,
|
|
@@ -59,21 +52,33 @@ var DatePicker = function DatePicker2(props) {
|
|
|
59
52
|
minute: datepickerLang.min,
|
|
60
53
|
seconds: datepickerLang.seconds
|
|
61
54
|
};
|
|
55
|
+
var _useState = useState([]), _useState2 = _slicedToArray(_useState, 2), defaultValueOfPicker = _useState2[0], setDefaultValueOfPicker = _useState2[1];
|
|
56
|
+
var _useState3 = useState([]), _useState4 = _slicedToArray(_useState3, 2), options = _useState4[0], setOptions = _useState4[1];
|
|
57
|
+
var isDate = function isDate2(val) {
|
|
58
|
+
return Object.prototype.toString.call(val) === "[object Date]" && !Number.isNaN(val.getTime());
|
|
59
|
+
};
|
|
62
60
|
var formatValue = function formatValue2(value) {
|
|
63
61
|
var cvalue = value;
|
|
64
62
|
if (!cvalue || cvalue && !isDate(cvalue)) {
|
|
65
|
-
cvalue =
|
|
63
|
+
cvalue = startDate;
|
|
66
64
|
}
|
|
67
|
-
var timestmp = Math.max(cvalue.getTime(),
|
|
68
|
-
timestmp = Math.min(timestmp,
|
|
65
|
+
var timestmp = Math.max(cvalue.getTime(), startDate.getTime());
|
|
66
|
+
timestmp = Math.min(timestmp, endDate.getTime());
|
|
69
67
|
return new Date(timestmp);
|
|
70
68
|
};
|
|
69
|
+
var _usePropsValue = usePropsValue({
|
|
70
|
+
value: props.value && formatValue(props.value),
|
|
71
|
+
defaultValue: formatValue(props.defaultValue || null),
|
|
72
|
+
finalValue: null,
|
|
73
|
+
onChange: function onChange2(val) {
|
|
74
|
+
}
|
|
75
|
+
}), _usePropsValue2 = _slicedToArray(_usePropsValue, 2), currentDate = _usePropsValue2[0], setCurrentDate = _usePropsValue2[1];
|
|
71
76
|
function getMonthEndDay(year, month) {
|
|
72
77
|
return new Date(year, month, 0).getDate();
|
|
73
78
|
}
|
|
74
79
|
var getBoundary = function getBoundary2(type2, value) {
|
|
75
80
|
var _ref;
|
|
76
|
-
var boundary = type2 === "min" ?
|
|
81
|
+
var boundary = type2 === "min" ? startDate : endDate;
|
|
77
82
|
var year = boundary.getFullYear();
|
|
78
83
|
var month = 1;
|
|
79
84
|
var date = 1;
|
|
@@ -100,12 +105,12 @@ var DatePicker = function DatePicker2(props) {
|
|
|
100
105
|
}
|
|
101
106
|
return _ref = {}, _defineProperty(_ref, "".concat(type2, "Year"), year), _defineProperty(_ref, "".concat(type2, "Month"), month), _defineProperty(_ref, "".concat(type2, "Date"), date), _defineProperty(_ref, "".concat(type2, "Hour"), hour), _defineProperty(_ref, "".concat(type2, "Minute"), minute), _defineProperty(_ref, "".concat(type2, "Seconds"), seconds), _ref;
|
|
102
107
|
};
|
|
103
|
-
var ranges = function ranges2(
|
|
104
|
-
var curDate =
|
|
108
|
+
var ranges = function ranges2() {
|
|
109
|
+
var curDate = currentDate;
|
|
105
110
|
if (!curDate)
|
|
106
111
|
return [];
|
|
107
|
-
var _getBoundary = getBoundary("max", curDate), maxYear = _getBoundary.maxYear,
|
|
108
|
-
var _getBoundary2 = getBoundary("min", curDate), minYear = _getBoundary2.minYear,
|
|
112
|
+
var _getBoundary = getBoundary("max", curDate), maxYear = _getBoundary.maxYear, maxDate = _getBoundary.maxDate, maxMonth = _getBoundary.maxMonth, maxHour = _getBoundary.maxHour, maxMinute = _getBoundary.maxMinute, maxSeconds = _getBoundary.maxSeconds;
|
|
113
|
+
var _getBoundary2 = getBoundary("min", curDate), minYear = _getBoundary2.minYear, minDate = _getBoundary2.minDate, minMonth = _getBoundary2.minMonth, minHour = _getBoundary2.minHour, minMinute = _getBoundary2.minMinute, minSeconds = _getBoundary2.minSeconds;
|
|
109
114
|
var result = [{
|
|
110
115
|
type: "year",
|
|
111
116
|
range: [minYear, maxYear]
|
|
@@ -114,7 +119,7 @@ var DatePicker = function DatePicker2(props) {
|
|
|
114
119
|
range: [minMonth, maxMonth]
|
|
115
120
|
}, {
|
|
116
121
|
type: "day",
|
|
117
|
-
range: [
|
|
122
|
+
range: [minDate, maxDate]
|
|
118
123
|
}, {
|
|
119
124
|
type: "hour",
|
|
120
125
|
range: [minHour, maxHour]
|
|
@@ -150,7 +155,7 @@ var DatePicker = function DatePicker2(props) {
|
|
|
150
155
|
}
|
|
151
156
|
return result;
|
|
152
157
|
};
|
|
153
|
-
var updateChooseValueCustmer = function updateChooseValueCustmer2(
|
|
158
|
+
var updateChooseValueCustmer = function updateChooseValueCustmer2(selectedOptions, selectedValue, index) {
|
|
154
159
|
if (["date", "datetime", "datehour", "month-day", "year-month"].includes(type.toLocaleLowerCase())) {
|
|
155
160
|
var _date;
|
|
156
161
|
var formatDate = [];
|
|
@@ -158,10 +163,10 @@ var DatePicker = function DatePicker2(props) {
|
|
|
158
163
|
formatDate.push(item);
|
|
159
164
|
});
|
|
160
165
|
if (type.toLocaleLowerCase() === "month-day" && formatDate.length < 3) {
|
|
161
|
-
formatDate.unshift(new Date(
|
|
166
|
+
formatDate.unshift(new Date(defaultValue || startDate || endDate).getFullYear());
|
|
162
167
|
}
|
|
163
168
|
if (type.toLocaleLowerCase() === "year-month" && formatDate.length < 3) {
|
|
164
|
-
formatDate.push(new Date(
|
|
169
|
+
formatDate.push(new Date(defaultValue || startDate || endDate).getDate());
|
|
165
170
|
}
|
|
166
171
|
var year = Number(formatDate[0]);
|
|
167
172
|
var month = Number(formatDate[1]) - 1;
|
|
@@ -177,7 +182,7 @@ var DatePicker = function DatePicker2(props) {
|
|
|
177
182
|
var isEqual = (currentDate === null || currentDate === void 0 ? void 0 : currentDate.getTime()) === ((_date = date) === null || _date === void 0 ? void 0 : _date.getTime());
|
|
178
183
|
date && isDate(date) && !isEqual && setCurrentDate(formatValue(date));
|
|
179
184
|
}
|
|
180
|
-
props.onChange && props.onChange(
|
|
185
|
+
props.onChange && props.onChange(selectedOptions, selectedValue, index);
|
|
181
186
|
};
|
|
182
187
|
var padZero = function padZero2(num) {
|
|
183
188
|
var targetLength = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : 2;
|
|
@@ -196,7 +201,7 @@ var DatePicker = function DatePicker2(props) {
|
|
|
196
201
|
});
|
|
197
202
|
} else {
|
|
198
203
|
var padMin = padZero(value, 2);
|
|
199
|
-
var fatter =
|
|
204
|
+
var fatter = showChinese ? zhCNType[type2] : "";
|
|
200
205
|
fOption = {
|
|
201
206
|
text: padMin + fatter,
|
|
202
207
|
value: padMin
|
|
@@ -205,6 +210,7 @@ var DatePicker = function DatePicker2(props) {
|
|
|
205
210
|
return fOption;
|
|
206
211
|
};
|
|
207
212
|
var generateValue = function generateValue2(min, max, val, type2, columnIndex) {
|
|
213
|
+
var _arr$index;
|
|
208
214
|
var cmin = min;
|
|
209
215
|
var arr = [];
|
|
210
216
|
var index = 0;
|
|
@@ -219,8 +225,8 @@ var DatePicker = function DatePicker2(props) {
|
|
|
219
225
|
index++;
|
|
220
226
|
}
|
|
221
227
|
}
|
|
222
|
-
|
|
223
|
-
|
|
228
|
+
defaultValueOfPicker[columnIndex] = (_arr$index = arr[index]) === null || _arr$index === void 0 ? void 0 : _arr$index.value;
|
|
229
|
+
setDefaultValueOfPicker(_toConsumableArray(defaultValueOfPicker));
|
|
224
230
|
if (props.filter && props.filter(type2, arr)) {
|
|
225
231
|
return props.filter(type2, arr);
|
|
226
232
|
}
|
|
@@ -245,43 +251,33 @@ var DatePicker = function DatePicker2(props) {
|
|
|
245
251
|
}
|
|
246
252
|
return d;
|
|
247
253
|
};
|
|
248
|
-
var columns = function columns2(
|
|
249
|
-
var val = ranges(
|
|
254
|
+
var columns = function columns2() {
|
|
255
|
+
var val = ranges().map(function(res, columnIndex) {
|
|
250
256
|
return generateValue(res.range[0], res.range[1], getDateIndex(res.type), res.type, columnIndex);
|
|
251
257
|
});
|
|
252
258
|
return val || [];
|
|
253
259
|
};
|
|
254
|
-
useEffect(function() {
|
|
255
|
-
setCurrentDate(formatValue(modelValue));
|
|
256
|
-
}, []);
|
|
257
|
-
useEffect(function() {
|
|
258
|
-
setCurrentDate(formatValue(modelValue));
|
|
259
|
-
}, [modelValue]);
|
|
260
|
-
useEffect(function() {
|
|
261
|
-
setShow(visible);
|
|
262
|
-
}, [visible]);
|
|
263
260
|
useEffect(function() {
|
|
264
261
|
if (currentDate) {
|
|
265
|
-
|
|
262
|
+
setOptions(columns());
|
|
266
263
|
}
|
|
267
|
-
}, [
|
|
264
|
+
}, []);
|
|
268
265
|
return React__default.createElement("div", _objectSpread({
|
|
269
|
-
className: "nut-datepicker ".concat(className
|
|
266
|
+
className: "nut-datepicker ".concat(className),
|
|
270
267
|
style
|
|
271
|
-
}, rest), options.length
|
|
268
|
+
}, rest), options.length && React__default.createElement(Picker, {
|
|
272
269
|
title,
|
|
273
|
-
visible
|
|
270
|
+
visible,
|
|
274
271
|
options,
|
|
275
|
-
onClose
|
|
276
|
-
defaultValue,
|
|
277
|
-
onConfirm: function onConfirm(options2,
|
|
278
|
-
return
|
|
272
|
+
onClose,
|
|
273
|
+
defaultValue: defaultValueOfPicker,
|
|
274
|
+
onConfirm: function onConfirm(options2, value) {
|
|
275
|
+
return _onConfirm && _onConfirm(options2, value);
|
|
279
276
|
},
|
|
280
|
-
onChange: function onChange2(
|
|
281
|
-
return updateChooseValueCustmer(
|
|
277
|
+
onChange: function onChange2(options2, value, index) {
|
|
278
|
+
return updateChooseValueCustmer(options2, value, index);
|
|
282
279
|
},
|
|
283
|
-
threeDimensional
|
|
284
|
-
ref: pickerRef
|
|
280
|
+
threeDimensional
|
|
285
281
|
}));
|
|
286
282
|
};
|
|
287
283
|
DatePicker.defaultProps = defaultProps;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.nut-button{position:relative;display:inline-block;flex-shrink:0;height:var(--nutui-button-default-height, 38px);box-sizing:border-box;margin:0;padding:0;line-height:var(--nutui-button-default-line-height, 36px);font-size:var(--nutui-button-default-font-size, var(--nutui-font-size-2, 14px));text-align:center;cursor:pointer;transition:opacity .2s;-webkit-appearance:none;user-select:none;touch-action:manipulation;color:var(--nutui-button-default-color, var(--nutui-gray-1, #1a1a1a));background:var(--nutui-button-default-bg-color, var(--nutui-gray-6, #ffffff));border:var(--nutui-button-border-width, 1px) solid var(--nutui-button-default-border-color, rgb(204, 204, 204))}.nut-button .nut-button-text{margin-left:var(--nutui-button-text-icon-margin-left, 5px)}.nut-button:before{position:absolute;top:50%;left:50%;width:100%;height:100%;background-color:var(--nutui-gray-0, #000000);border:inherit;border-color:var(--nutui-gray-0, #000000);border-radius:inherit;transform:translate(-50%,-50%);opacity:0;content:" "}.nut-button:after{border:none}.nut-button:active:before{opacity:.1}.nut-button__warp{height:100%;width:100%;display:flex;align-items:center;justify-content:center;background:initial}.nut-button--loading:before,.nut-button--disabled:before{display:none}.nut-button--solid{color:var(--nutui-button-primary-color, var(--nutui-brand-text-color, #ffffff));background:linear-gradient(135deg,var(--nutui-brand-color, #fa2c19) 0%,var(--nutui-brand-color-end, #fa2c19) 100%);border:var(--nutui-button-border-width, 1px) solid transparent}.nut-button.nut-button--outline{color:var(--nutui-button-primary-border-color, var(--nutui-brand-color, #fa2c19));border-color:var(--nutui-button-primary-border-color, var(--nutui-brand-color, #fa2c19));background:transparent}.nut-button.nut-button--none{color:var(--nutui-button-primary-border-color, var(--nutui-brand-color, #fa2c19));background:transparent;border-color:transparent}.nut-button--primary{color:var(--nutui-button-primary-color, var(--nutui-brand-text-color, #ffffff));background:linear-gradient(135deg,var(--nutui-brand-color, #fa2c19) 0%,var(--nutui-brand-color-end, #fa2c19) 100%);border:var(--nutui-button-border-width, 1px) solid transparent}.nut-button--primary.nut-button--outline{color:var(--nutui-button-primary-border-color, var(--nutui-brand-color, #fa2c19));border-color:var(--nutui-button-primary-border-color, var(--nutui-brand-color, #fa2c19));background:transparent}.nut-button--primary.nut-button--none{color:var(--nutui-button-primary-border-color, var(--nutui-brand-color, #fa2c19));background:transparent;border-color:transparent}.nut-button--info{color:var(--nutui-button-info-color, var(--nutui-brand-text-color, #ffffff));background:linear-gradient(315deg,rgb(73,143,242) 0%,rgb(73,101,242) 100%);border:var(--nutui-button-border-width, 1px) solid transparent}.nut-button--info.nut-button--outline{color:var(--nutui-button-info-border-color, #496af2);border-color:var(--nutui-button-info-border-color, #496af2);background:transparent}.nut-button--info.nut-button--none{color:var(--nutui-button-info-border-color, #496af2);background:transparent;border-color:transparent}.nut-button--success{color:var(--nutui-button-success-color, var(--nutui-brand-text-color, #ffffff));background:linear-gradient(135deg,rgb(38,191,38) 0%,rgb(39,197,48) 45%,rgb(40,207,63) 83%,rgb(41,212,70) 100%);border:var(--nutui-button-border-width, 1px) solid transparent}.nut-button--success.nut-button--outline{color:var(--nutui-button-success-border-color, rgb(38, 191, 38));border-color:var(--nutui-button-success-border-color, rgb(38, 191, 38));background:transparent}.nut-button--success.nut-button--none{color:var(--nutui-button-success-border-color, rgb(38, 191, 38));background:transparent;border-color:transparent}.nut-button--danger{color:var(--nutui-button-danger-color, var(--nutui-brand-text-color, #ffffff));background:var(--nutui-button-danger-background-color, rgb(250, 44, 25));border:var(--nutui-button-border-width, 1px) solid transparent}.nut-button--danger.nut-button--outline{color:var(--nutui-button-danger-border-color, rgb(250, 44, 25));border-color:var(--nutui-button-danger-border-color, rgb(250, 44, 25));background:transparent}.nut-button--danger.nut-button--none{color:var(--nutui-button-danger-border-color, rgb(250, 44, 25));background:transparent;border-color:transparent}.nut-button--warning{color:var(--nutui-button-warning-color, var(--nutui-brand-text-color, #ffffff));background:linear-gradient(135deg,rgb(255,158,13) 0%,rgb(255,167,13) 45%,rgb(255,182,13) 83%,rgb(255,190,13) 100%);border:var(--nutui-button-border-width, 1px) solid transparent}.nut-button--warning.nut-button--outline{color:var(--nutui-button-warning-border-color, rgb(255, 158, 13));border-color:var(--nutui-button-warning-border-color, rgb(255, 158, 13));background:transparent}.nut-button--warning.nut-button--none{color:var(--nutui-button-warning-border-color, rgb(255, 158, 13));background:transparent;border-color:transparent}.nut-button--large{width:100%;height:var(--nutui-button-large-height, 48px);line-height:var(--nutui-button-large-line-height, 46px)}.nut-button--large .text{margin-left:var(--nutui-button-text-icon-large-margin-left, 10px)}.nut-button--normal{padding:var(--nutui-button-default-padding, 0 18px);font-size:var(--nutui-button-default-font-size, var(--nutui-font-size-2, 14px))}.nut-button--small{height:var(--nutui-button-small-height, 28px);line-height:var(--nutui-button-small-line-height, 26px);padding:var(--nutui-button-small-padding, 0 12px);font-size:var(--nutui-button-small-font-size, var(--nutui-font-size-1, 12px))}.nut-button--small .text{margin-left:var(--nutui-button-text-icon-small-margin-left, 2px)}.nut-button--mini{height:var(--nutui-button-mini-height, 24px);line-height:var(--nutui-button-mini-line-height, 1.2);padding:var(--nutui-button-mini-padding, 0 12px);font-size:var(--nutui-button-mini-font-size, var(--nutui-font-size-1, 12px))}.nut-button--mini .text{margin-left:var(--nutui-button-text-icon-mini-margin-left, 1px)}.nut-button--block{display:block;width:100%}.nut-button--disabled{cursor:not-allowed;opacity:var(--nutui-button-disabled-opacity, .68)}.nut-button--loading{cursor:default;opacity:.9}.nut-button--round{border-radius:var(--nutui-button-border-radius, 25px)}.nut-button--square{border-radius:0}.nut-dialog{display:flex;flex-direction:column;align-items:center;width:var(--nutui-dialog-width, 296px);min-height:var(--nutui-dialog-min-height, 156px);padding:var(--nutui-dialog-padding, 28px 24px 16px 24px);box-sizing:border-box}.nut-dialog__outer{position:fixed;max-height:100%;overflow-y:auto;background-color:var(--nutui-gray-6, #ffffff);transition:transform .2s,-webkit-transform .2s;-webkit-overflow-scrolling:touch;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);border-radius:var(--nutui-dialog-outer-bordder-radius, 20px);z-index:var(--nutui-dialog-outer-z-index, 1200);animation-duration:.3s}.nut-dialog__header{display:block;text-align:center;font-size:var(--nutui-font-size-3, 16px);color:var(--nutui-gray-1, #1a1a1a);width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.nut-dialog__content{width:100%;overflow:auto;flex:1;margin:var(--nutui-dialog-content-margin, 20px 0);max-height:var(--nutui-dialog-content-max-height, 268px);line-height:var(--nutui-dialog-content-line-height, 16px);font-size:var(--nutui-font-size-1, 12px);color:var(--nutui-gray-2, #757575);word-wrap:break-word;word-break:break-all;white-space:pre-wrap;text-align:var(--nutui-dialog-content-text-align, center)}.nut-dialog__footer{display:flex;align-items:center;width:100%;justify-content:space-around}.nut-dialog__footer.vertical{flex-direction:column}.nut-dialog__footer.vertical .nut-button{min-width:100%;margin:0}.nut-dialog__footer.vertical .nut-button.nut-dialog__footer-cancel{border:0}.nut-dialog__footer.vertical .nut-button.nut-dialog__footer-ok{margin-top:var(--nutui-dialog-vertical-footer-ok-margin-top, 10px)}.nut-dialog__footer .nut-button{min-width:var(--nutui-dialog-footer-button-min-width, 100px)}.nut-dialog__footer-cancel.nut-dialog__footer-cancel{margin-right:var(--nutui-dialog-footer-cancel-margin-right, 20px)}.nut-dialog__footer-ok{max-width:var(--nutui-dialog-footer-ok-max-width, 128px)}
|
|
1
|
+
.nut-button{position:relative;display:inline-block;flex-shrink:0;height:var(--nutui-button-default-height, 38px);box-sizing:border-box;margin:0;padding:0;line-height:var(--nutui-button-default-line-height, 36px);font-size:var(--nutui-button-default-font-size, var(--nutui-font-size-2, 14px));text-align:center;cursor:pointer;transition:opacity .2s;-webkit-appearance:none;user-select:none;touch-action:manipulation;color:var(--nutui-button-default-color, var(--nutui-gray-1, #1a1a1a));background:var(--nutui-button-default-bg-color, var(--nutui-gray-6, #ffffff));border:var(--nutui-button-border-width, 1px) solid var(--nutui-button-default-border-color, rgb(204, 204, 204))}.nut-button .nut-button-text{margin-left:var(--nutui-button-text-icon-margin-left, 5px)}.nut-button:before{position:absolute;top:50%;left:50%;width:100%;height:100%;background-color:var(--nutui-gray-0, #000000);border:inherit;border-color:var(--nutui-gray-0, #000000);border-radius:inherit;transform:translate(-50%,-50%);opacity:0;content:" "}.nut-button:after{border:none}.nut-button:active:before{opacity:.1}.nut-button__warp{height:100%;width:100%;display:flex;align-items:center;justify-content:center;background:initial}.nut-button--loading:before,.nut-button--disabled:before{display:none}.nut-button--solid{color:var(--nutui-button-primary-color, var(--nutui-brand-text-color, #ffffff));background:linear-gradient(135deg,var(--nutui-brand-color, #fa2c19) 0%,var(--nutui-brand-color-end, #fa2c19) 100%);border:var(--nutui-button-border-width, 1px) solid transparent}.nut-button.nut-button--outline{color:var(--nutui-button-primary-border-color, var(--nutui-brand-color, #fa2c19));border-color:var(--nutui-button-primary-border-color, var(--nutui-brand-color, #fa2c19));background:transparent}.nut-button.nut-button--none{color:var(--nutui-button-primary-border-color, var(--nutui-brand-color, #fa2c19));background:transparent;border-color:transparent}.nut-button--primary{color:var(--nutui-button-primary-color, var(--nutui-brand-text-color, #ffffff));background:linear-gradient(135deg,var(--nutui-brand-color, #fa2c19) 0%,var(--nutui-brand-color-end, #fa2c19) 100%);border:var(--nutui-button-border-width, 1px) solid transparent}.nut-button--primary.nut-button--outline{color:var(--nutui-button-primary-border-color, var(--nutui-brand-color, #fa2c19));border-color:var(--nutui-button-primary-border-color, var(--nutui-brand-color, #fa2c19));background:transparent}.nut-button--primary.nut-button--none{color:var(--nutui-button-primary-border-color, var(--nutui-brand-color, #fa2c19));background:transparent;border-color:transparent}.nut-button--info{color:var(--nutui-button-info-color, var(--nutui-brand-text-color, #ffffff));background:linear-gradient(315deg,rgb(73,143,242) 0%,rgb(73,101,242) 100%);border:var(--nutui-button-border-width, 1px) solid transparent}.nut-button--info.nut-button--outline{color:var(--nutui-button-info-border-color, #496af2);border-color:var(--nutui-button-info-border-color, #496af2);background:transparent}.nut-button--info.nut-button--none{color:var(--nutui-button-info-border-color, #496af2);background:transparent;border-color:transparent}.nut-button--success{color:var(--nutui-button-success-color, var(--nutui-brand-text-color, #ffffff));background:linear-gradient(135deg,rgb(38,191,38) 0%,rgb(39,197,48) 45%,rgb(40,207,63) 83%,rgb(41,212,70) 100%);border:var(--nutui-button-border-width, 1px) solid transparent}.nut-button--success.nut-button--outline{color:var(--nutui-button-success-border-color, rgb(38, 191, 38));border-color:var(--nutui-button-success-border-color, rgb(38, 191, 38));background:transparent}.nut-button--success.nut-button--none{color:var(--nutui-button-success-border-color, rgb(38, 191, 38));background:transparent;border-color:transparent}.nut-button--danger{color:var(--nutui-button-danger-color, var(--nutui-brand-text-color, #ffffff));background:var(--nutui-button-danger-background-color, rgb(250, 44, 25));border:var(--nutui-button-border-width, 1px) solid transparent}.nut-button--danger.nut-button--outline{color:var(--nutui-button-danger-border-color, rgb(250, 44, 25));border-color:var(--nutui-button-danger-border-color, rgb(250, 44, 25));background:transparent}.nut-button--danger.nut-button--none{color:var(--nutui-button-danger-border-color, rgb(250, 44, 25));background:transparent;border-color:transparent}.nut-button--warning{color:var(--nutui-button-warning-color, var(--nutui-brand-text-color, #ffffff));background:linear-gradient(135deg,rgb(255,158,13) 0%,rgb(255,167,13) 45%,rgb(255,182,13) 83%,rgb(255,190,13) 100%);border:var(--nutui-button-border-width, 1px) solid transparent}.nut-button--warning.nut-button--outline{color:var(--nutui-button-warning-border-color, rgb(255, 158, 13));border-color:var(--nutui-button-warning-border-color, rgb(255, 158, 13));background:transparent}.nut-button--warning.nut-button--none{color:var(--nutui-button-warning-border-color, rgb(255, 158, 13));background:transparent;border-color:transparent}.nut-button--large{width:100%;height:var(--nutui-button-large-height, 48px);line-height:var(--nutui-button-large-line-height, 46px)}.nut-button--large .text{margin-left:var(--nutui-button-text-icon-large-margin-left, 10px)}.nut-button--normal{padding:var(--nutui-button-default-padding, 0 18px);font-size:var(--nutui-button-default-font-size, var(--nutui-font-size-2, 14px))}.nut-button--small{height:var(--nutui-button-small-height, 28px);line-height:var(--nutui-button-small-line-height, 26px);padding:var(--nutui-button-small-padding, 0 12px);font-size:var(--nutui-button-small-font-size, var(--nutui-font-size-1, 12px))}.nut-button--small .text{margin-left:var(--nutui-button-text-icon-small-margin-left, 2px)}.nut-button--mini{height:var(--nutui-button-mini-height, 24px);line-height:var(--nutui-button-mini-line-height, 1.2);padding:var(--nutui-button-mini-padding, 0 12px);font-size:var(--nutui-button-mini-font-size, var(--nutui-font-size-1, 12px))}.nut-button--mini .text{margin-left:var(--nutui-button-text-icon-mini-margin-left, 1px)}.nut-button--block{display:block;width:100%}.nut-button--disabled{cursor:not-allowed;opacity:var(--nutui-button-disabled-opacity, .68)}.nut-button--loading{cursor:default;opacity:.9}.nut-button--round{border-radius:var(--nutui-button-border-radius, 25px)}.nut-button--square{border-radius:0}.nut-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:var(--nutui-overlay-bg-color, var(--nutui-gray-7, rgba(0, 0, 0, .7)))}.nut-overflow-hidden{overflow:hidden!important}.nut-overlay-fade-enter-active{animation:nut-fade-in}.nut-overlay-fade-enter-active .wrapper .content{background-color:var(--nutui-overlay-content-bg-color, var(--nutui-gray-6, #ffffff));color:var(--nutui-overlay-content-color, var(--nutui-gray-1, #1a1a1a))}.nut-overlay-fade-leave-active{animation:nut-fade-out}.nut-overlay-first-render,.nut-overlay-hidden-render{display:none}@keyframes nut-fade-in{0%{opacity:0}1%{opacity:0}to{opacity:1}}@keyframes nut-fade-out{0%{opacity:1}1%{opacity:1}to{opacity:0}}.nut-dialog{display:flex;flex-direction:column;align-items:center;width:var(--nutui-dialog-width, 296px);min-height:var(--nutui-dialog-min-height, 156px);padding:var(--nutui-dialog-padding, 28px 24px 16px 24px);box-sizing:border-box}.nut-dialog__outer{position:fixed;max-height:100%;overflow-y:auto;background-color:var(--nutui-gray-6, #ffffff);transition:transform .2s,-webkit-transform .2s;-webkit-overflow-scrolling:touch;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);border-radius:var(--nutui-dialog-outer-bordder-radius, 20px);z-index:var(--nutui-dialog-outer-z-index, 1200);animation-duration:.3s}.nut-dialog__header{display:block;text-align:center;font-size:var(--nutui-font-size-3, 16px);color:var(--nutui-gray-1, #1a1a1a);width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.nut-dialog__content{width:100%;overflow:auto;flex:1;margin:var(--nutui-dialog-content-margin, 20px 0);max-height:var(--nutui-dialog-content-max-height, 268px);line-height:var(--nutui-dialog-content-line-height, 16px);font-size:var(--nutui-font-size-1, 12px);color:var(--nutui-gray-2, #757575);word-wrap:break-word;word-break:break-all;white-space:pre-wrap;text-align:var(--nutui-dialog-content-text-align, center)}.nut-dialog__footer{display:flex;align-items:center;width:100%;justify-content:space-around}.nut-dialog__footer.vertical{flex-direction:column}.nut-dialog__footer.vertical .nut-button{min-width:100%;margin:0}.nut-dialog__footer.vertical .nut-button.nut-dialog__footer-cancel{border:0}.nut-dialog__footer.vertical .nut-button.nut-dialog__footer-ok{margin-top:var(--nutui-dialog-vertical-footer-ok-margin-top, 10px)}.nut-dialog__footer .nut-button{min-width:var(--nutui-dialog-footer-button-min-width, 100px)}.nut-dialog__footer-cancel.nut-dialog__footer-cancel{margin-right:var(--nutui-dialog-footer-cancel-margin-right, 20px)}.nut-dialog__footer-ok{max-width:var(--nutui-dialog-footer-ok-max-width, 128px)}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.nut-infiniteloading{display:block;width:100%}.nut-infiniteloading .nut-infinite-top{display:flex;align-items:center;justify-content:center;width:100%;overflow:hidden}.nut-infiniteloading .nut-infinite-top .top-box{width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--nutui-gray-2, #757575)}.nut-infiniteloading .nut-infinite-container .infiniteLi{color:var(--nutui-gray-1, #1a1a1a)}.nut-infiniteloading .nut-infinite-bottom{display:flex;align-items:center;justify-content:center;width:100%;padding-top:6px;font-size:var(--nutui-font-size-1, 12px);color:var(--nutui-infiniteloading-bottom-color, #c8c8c8);text-align:center}.nut-infiniteloading .nut-infinite-bottom .bottom-box{color:var(--nutui-gray-2, #757575)}
|
|
@@ -1,7 +1,7 @@
|
|
|
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 = ["children", "hasMore", "threshold", "
|
|
4
|
+
var _excluded = ["children", "hasMore", "threshold", "target", "capture", "pullRefresh", "pullingText", "loadingText", "loadMoreText", "className", "onRefresh", "onLoadMore", "onScroll"];
|
|
5
5
|
function ownKeys(object, enumerableOnly) {
|
|
6
6
|
var keys = Object.keys(object);
|
|
7
7
|
if (Object.getOwnPropertySymbols) {
|
|
@@ -25,26 +25,19 @@ function _objectSpread(target) {
|
|
|
25
25
|
}
|
|
26
26
|
import React__default, { useState, useRef, useEffect } from "react";
|
|
27
27
|
import classNames from "classnames";
|
|
28
|
-
import { c as cn } from "./bem.js";
|
|
29
28
|
import { useConfig } from "./ConfigProvider.js";
|
|
30
29
|
import { C as ComponentDefaults } from "./typings.js";
|
|
31
|
-
import "@bem-react/classname";
|
|
32
30
|
var defaultProps = _objectSpread(_objectSpread({}, ComponentDefaults), {}, {
|
|
33
31
|
hasMore: true,
|
|
34
32
|
threshold: 200,
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
isOpenRefresh: false,
|
|
39
|
-
pullIcon: null,
|
|
40
|
-
pullText: "松开刷新",
|
|
41
|
-
loadIcon: null,
|
|
42
|
-
loadingText: "加载中···",
|
|
43
|
-
loadMoreText: "哎呀,这里是底部了啦"
|
|
33
|
+
target: "",
|
|
34
|
+
capture: false,
|
|
35
|
+
pullRefresh: false
|
|
44
36
|
});
|
|
45
|
-
var
|
|
37
|
+
var classPrefix = "nut-infiniteloading";
|
|
38
|
+
var InfiniteLoading = function InfiniteLoading2(props) {
|
|
46
39
|
var _useConfig = useConfig(), locale = _useConfig.locale;
|
|
47
|
-
var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props), children = _defaultProps$props.children, hasMore = _defaultProps$props.hasMore, threshold = _defaultProps$props.threshold,
|
|
40
|
+
var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props), children = _defaultProps$props.children, hasMore = _defaultProps$props.hasMore, threshold = _defaultProps$props.threshold, target = _defaultProps$props.target, capture = _defaultProps$props.capture, pullRefresh = _defaultProps$props.pullRefresh, pullingText = _defaultProps$props.pullingText, loadingText = _defaultProps$props.loadingText, loadMoreText = _defaultProps$props.loadMoreText, className = _defaultProps$props.className, onRefresh = _defaultProps$props.onRefresh, onLoadMore = _defaultProps$props.onLoadMore, onScroll = _defaultProps$props.onScroll, restProps = _objectWithoutProperties(_defaultProps$props, _excluded);
|
|
48
41
|
var _useState = useState(false), _useState2 = _slicedToArray(_useState, 2), isInfiniting = _useState2[0], setIsInfiniting = _useState2[1];
|
|
49
42
|
var scroller = useRef(null);
|
|
50
43
|
var refreshTop = useRef(null);
|
|
@@ -54,14 +47,16 @@ var Infiniteloading = function Infiniteloading2(props) {
|
|
|
54
47
|
var refreshMaxH = useRef(0);
|
|
55
48
|
var y = useRef(0);
|
|
56
49
|
var distance = useRef(0);
|
|
57
|
-
var
|
|
58
|
-
var classes = classNames(className, b());
|
|
50
|
+
var classes = classNames(className, classPrefix);
|
|
59
51
|
useEffect(function() {
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
52
|
+
if (target && document.getElementById(target)) {
|
|
53
|
+
scrollEl.current = document.getElementById(target);
|
|
54
|
+
} else {
|
|
55
|
+
scrollEl.current = window;
|
|
56
|
+
}
|
|
57
|
+
scrollEl.current.addEventListener("scroll", handleScroll, capture);
|
|
63
58
|
return function() {
|
|
64
|
-
scrollEl.current.removeEventListener("scroll", handleScroll,
|
|
59
|
+
scrollEl.current.removeEventListener("scroll", handleScroll, capture);
|
|
65
60
|
};
|
|
66
61
|
}, [hasMore, isInfiniting]);
|
|
67
62
|
useEffect(function() {
|
|
@@ -81,9 +76,6 @@ var Infiniteloading = function Infiniteloading2(props) {
|
|
|
81
76
|
transition: isTouching.current ? "height 0s cubic-bezier(0.25,0.1,0.25,1)" : "height 0.2s cubic-bezier(0.25,0.1,0.25,1)"
|
|
82
77
|
};
|
|
83
78
|
};
|
|
84
|
-
var getParentElement = function getParentElement2(el) {
|
|
85
|
-
return containerId ? document.querySelector("#".concat(containerId)) : el && el.parentNode;
|
|
86
|
-
};
|
|
87
79
|
var handleScroll = function handleScroll2() {
|
|
88
80
|
requestAniFrame()(function() {
|
|
89
81
|
if (!isScrollAtBottom() || !hasMore || isInfiniting) {
|
|
@@ -103,7 +95,7 @@ var Infiniteloading = function Infiniteloading2(props) {
|
|
|
103
95
|
isTouching.current = false;
|
|
104
96
|
};
|
|
105
97
|
var touchStart = function touchStart2(event) {
|
|
106
|
-
if (beforeScrollTop.current === 0 && !isTouching.current &&
|
|
98
|
+
if (beforeScrollTop.current === 0 && !isTouching.current && pullRefresh) {
|
|
107
99
|
y.current = event.touches[0].pageY;
|
|
108
100
|
isTouching.current = true;
|
|
109
101
|
var childHeight = refreshTop.current.firstElementChild.offsetHeight;
|
|
@@ -135,12 +127,12 @@ var Infiniteloading = function Infiniteloading2(props) {
|
|
|
135
127
|
}
|
|
136
128
|
};
|
|
137
129
|
var requestAniFrame = function requestAniFrame2() {
|
|
138
|
-
return window.requestAnimationFrame || window.webkitRequestAnimationFrame || function fn(callback) {
|
|
130
|
+
return window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || function fn(callback) {
|
|
139
131
|
window.setTimeout(callback, 1e3 / 60);
|
|
140
132
|
};
|
|
141
133
|
};
|
|
142
134
|
var getWindowScrollTop = function getWindowScrollTop2() {
|
|
143
|
-
return window.
|
|
135
|
+
return window.scrollY !== void 0 ? window.scrollY : (document.documentElement || document.body.parentNode || document.body).scrollTop;
|
|
144
136
|
};
|
|
145
137
|
var calculateTopPosition = function calculateTopPosition2(el) {
|
|
146
138
|
return !el ? 0 : el.offsetTop + calculateTopPosition2(el.offsetParent);
|
|
@@ -150,7 +142,7 @@ var Infiniteloading = function Infiniteloading2(props) {
|
|
|
150
142
|
var resScrollTop = 0;
|
|
151
143
|
var direction = "down";
|
|
152
144
|
var windowScrollTop = getWindowScrollTop();
|
|
153
|
-
if (
|
|
145
|
+
if (!target || !document.getElementById(target)) {
|
|
154
146
|
if (scroller.current) {
|
|
155
147
|
offsetDistance = calculateTopPosition(scroller.current) + scroller.current.offsetHeight - windowScrollTop - window.innerHeight;
|
|
156
148
|
}
|
|
@@ -166,7 +158,7 @@ var Infiniteloading = function Infiniteloading2(props) {
|
|
|
166
158
|
direction = "down";
|
|
167
159
|
}
|
|
168
160
|
beforeScrollTop.current = resScrollTop;
|
|
169
|
-
|
|
161
|
+
onScroll && onScroll(resScrollTop);
|
|
170
162
|
return offsetDistance <= threshold && direction === "down";
|
|
171
163
|
};
|
|
172
164
|
return React__default.createElement("div", _objectSpread({
|
|
@@ -180,22 +172,18 @@ var Infiniteloading = function Infiniteloading2(props) {
|
|
|
180
172
|
style: getStyle()
|
|
181
173
|
}, React__default.createElement("div", {
|
|
182
174
|
className: "top-box"
|
|
183
|
-
},
|
|
184
|
-
className: "top-text"
|
|
185
|
-
}, pullText || locale.infiniteloading.pullRefreshText))), React__default.createElement("div", {
|
|
175
|
+
}, pullingText || locale.infiniteloading.pullRefreshText)), React__default.createElement("div", {
|
|
186
176
|
className: "nut-infinite-container"
|
|
187
177
|
}, children), React__default.createElement("div", {
|
|
188
178
|
className: "nut-infinite-bottom"
|
|
189
179
|
}, isInfiniting ? React__default.createElement("div", {
|
|
190
180
|
className: "bottom-box"
|
|
191
|
-
},
|
|
192
|
-
className: "bottom-text"
|
|
193
|
-
}, loadingText || locale.infiniteloading.loadText)) : !hasMore && React__default.createElement("div", {
|
|
181
|
+
}, loadingText || locale.infiniteloading.loadText) : !hasMore && React__default.createElement("div", {
|
|
194
182
|
className: "tips"
|
|
195
183
|
}, loadMoreText || locale.infiniteloading.loadMoreText)));
|
|
196
184
|
};
|
|
197
|
-
|
|
198
|
-
|
|
185
|
+
InfiniteLoading.defaultProps = defaultProps;
|
|
186
|
+
InfiniteLoading.displayName = "NutInfiniteLoading";
|
|
199
187
|
export {
|
|
200
|
-
|
|
188
|
+
InfiniteLoading as default
|
|
201
189
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.nut-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:var(--nutui-overlay-bg-color, var(--nutui-gray-7, rgba(0, 0, 0, .7)))}.nut-overflow-hidden{overflow:hidden!important}.nut-overlay-fade-enter-active{animation:nut-fade-in}.nut-overlay-fade-enter-active .wrapper .content{background-color:var(--nutui-overlay-content-bg-color, var(--nutui-gray-6, #ffffff));color:var(--nutui-overlay-content-color, var(--nutui-gray-1, #1a1a1a))}.nut-overlay-fade-leave-active{animation:nut-fade-out}.nut-overlay-first-render,.nut-overlay-hidden-render{display:none}@keyframes nut-fade-in{0%{opacity:0}1%{opacity:0}to{opacity:1}}@keyframes nut-fade-out{0%{opacity:1}1%{opacity:1}to{opacity:0}}.nut-menu-item__content{padding:var(--nutui-menu-item-content-padding, 12px 24px);max-height:var(--nutui-menu-item-content-max-height, 214px);overflow-y:auto;display:flex;flex-wrap:wrap;background:var(--nutui-menu-item-content-bg-color, var(--nutui-gray-6, #ffffff))}.nut-menu-item__content_fixed{width:100%;opacity:0;position:fixed}.nut-menu-item__option{color:var(--nutui-gray-1, #1a1a1a);font-size:var(--nutui-font-size-2, 14px);padding-top:var(--nutui-menu-item-option-padding-top, 12px);padding-bottom:var(--nutui-menu-item-option-padding-bottom, 12px);display:flex;align-items:center}.nut-menu-item__option.active{font-weight:500;color:var(--nutui-menu-item-active-text-color, var(--nutui-brand-color, #fa2c19))}.nut-menu-item__option i{margin-right:var(--nutui-menu-item-option-i-margin-right, 6px);display:inline-flex;align-items:center}.nut-menu-item__wrap,.nut-menu-item__wrap-up{position:absolute;width:100%;z-index:2052;overflow:hidden}.nut-menu-item__wrap-up{bottom:var(--nutui-menu-bar-line-height, 48px)}.overlay-fade-enter-active.nut-menu__overlay{top:auto;z-index:2052}.nut-menu__pop.nut-popup{transition:all 0s ease 0s;transform:none}.placeholder-element{position:
|
|
1
|
+
.nut-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:var(--nutui-overlay-bg-color, var(--nutui-gray-7, rgba(0, 0, 0, .7)))}.nut-overflow-hidden{overflow:hidden!important}.nut-overlay-fade-enter-active{animation:nut-fade-in}.nut-overlay-fade-enter-active .wrapper .content{background-color:var(--nutui-overlay-content-bg-color, var(--nutui-gray-6, #ffffff));color:var(--nutui-overlay-content-color, var(--nutui-gray-1, #1a1a1a))}.nut-overlay-fade-leave-active{animation:nut-fade-out}.nut-overlay-first-render,.nut-overlay-hidden-render{display:none}@keyframes nut-fade-in{0%{opacity:0}1%{opacity:0}to{opacity:1}}@keyframes nut-fade-out{0%{opacity:1}1%{opacity:1}to{opacity:0}}.nut-menu-item__content{padding:var(--nutui-menu-item-content-padding, 12px 24px);max-height:var(--nutui-menu-item-content-max-height, 214px);overflow-y:auto;display:flex;flex-wrap:wrap;background:var(--nutui-menu-item-content-bg-color, var(--nutui-gray-6, #ffffff))}.nut-menu-item__content_fixed{width:100%;opacity:0;position:fixed}.nut-menu-item__option{color:var(--nutui-gray-1, #1a1a1a);font-size:var(--nutui-font-size-2, 14px);padding-top:var(--nutui-menu-item-option-padding-top, 12px);padding-bottom:var(--nutui-menu-item-option-padding-bottom, 12px);display:flex;align-items:center}.nut-menu-item__option.active{font-weight:500;color:var(--nutui-menu-item-active-text-color, var(--nutui-brand-color, #fa2c19))}.nut-menu-item__option i{margin-right:var(--nutui-menu-item-option-i-margin-right, 6px);display:inline-flex;align-items:center}.nut-menu-item__wrap,.nut-menu-item__wrap-up{position:absolute;width:100%;z-index:2052;overflow:hidden}.nut-menu-item__wrap-up{bottom:var(--nutui-menu-bar-line-height, 48px)}.overlay-fade-enter-active.nut-menu__overlay{top:auto;z-index:2052}.nut-menu__pop.nut-popup{transition:all 0s ease 0s;transform:none}.placeholder-element{position:absolute;top:-var(--nutui-menu-bar-line-height,48px);left:0;right:0;z-index:var(--nutui-menu-bar-opened-z-index, 2001);background-color:transparent}.placeholder-element.up{bottom:-var(--nutui-menu-bar-line-height,48px)}.menu-item-enter{opacity:0;transform:translateY(-30px)}.menu-item-enter-done{opacity:1;transform:translate(0);transition:all .1s}.menu-item-exit{opacity:1;transition:all .1s}.menu-item-exit-done{opacity:0;transition:all .1s}.menu-item-up-enter{opacity:0;transform:translateY(30px)}.menu-item-up-enter-done{opacity:1;transform:translate(0);transition:all .1s}.menu-item-up-exit{opacity:1;transition:all .1s}.menu-item-up-exit-done{opacity:0;transition:all .1s}.nut-menu.scroll-fixed{position:fixed;top:var(--nutui-menu-scroll-fixed-top, 0);z-index:var(--nutui-menu-scroll-fixed-z-index, 1000);width:100%}.nut-menu-relative{position:relative}.nut-menu__bar{position:relative;display:flex;line-height:var(--nutui-menu-bar-line-height, 48px);background-color:var(--nutui-gray-6, #ffffff);box-shadow:var(--nutui-menu-bar-box-shadow, 0 2px 12px rgba(89, 89, 89, .12))}.nut-menu__bar.opened{z-index:var(--nutui-menu-bar-opened-z-index, 2001)}.nut-menu__item{flex:1;text-align:center;font-size:var(--nutui-menu-item-font-size, var(--nutui-font-size-2, 14px));color:var(--nutui-menu-item-text-color, var(--nutui-gray-1, #1a1a1a));min-width:0}.nut-menu__item.active{color:var(--nutui-menu-item-active-text-color, var(--nutui-brand-color, #fa2c19))}.nut-menu__item.disabled{color:var(--nutui-menu-item-disabled-color, #969799)}.nut-menu__title-icon{transition:all .2s linear}.nut-menu__title{display:flex;align-items:center;justify-content:center;max-width:100%}.nut-menu__title.active .nut-menu__title-icon{transform:rotate(180deg)}.nut-menu__title-text{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block;padding-left:var(--nutui-menu-title-text-padding-left, 8px);padding-right:var(--nutui-menu-title-text-padding-right, 8px)}
|