@nutui/nutui-react 2.0.9 → 2.0.11-beta.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +24 -0
- package/dist/esm/Calendar/style/style.css +1 -1
- package/dist/esm/Calendar.js +2 -1
- package/dist/esm/CalendarItem.js +2 -2
- package/dist/esm/Elevator.js +1 -1
- package/dist/esm/Input.js +3 -1
- package/dist/esm/Loading/style/css.js +1 -0
- package/dist/esm/Loading/style/index.js +2 -0
- package/dist/esm/Loading/style/style.css +1 -0
- package/dist/esm/Loading.js +57 -0
- package/dist/esm/NumberKeyboard.js +1 -1
- package/dist/esm/Popover.js +36 -3
- package/dist/esm/Switch.js +5 -3
- package/dist/esm/Tour/style/css.js +1 -0
- package/dist/esm/Tour/style/index.js +2 -0
- package/dist/esm/Tour/style/style.css +1 -0
- package/dist/esm/Tour.js +183 -0
- package/dist/esm/Uploader/style/style.css +1 -1
- package/dist/esm/Uploader.js +1 -1
- package/dist/esm/configprovider2.js +5 -0
- package/dist/esm/nutui-react.es.js +78 -74
- package/dist/esm/tabbaritem2.js +5 -3
- package/dist/esm/types/src/locales/base.d.ts +5 -0
- package/dist/esm/types/src/packages/configprovider/types.d.ts +1 -1
- package/dist/esm/types/src/packages/loading/__test__/loading.spec.d.ts +1 -0
- package/dist/esm/types/src/packages/loading/demo.d.ts +3 -0
- package/dist/esm/types/src/packages/loading/demo.taro.d.ts +3 -0
- package/dist/esm/types/src/packages/loading/index.d.ts +3 -0
- package/dist/esm/types/src/packages/loading/index.taro.d.ts +3 -0
- package/dist/esm/types/src/packages/loading/loading.d.ts +10 -0
- package/dist/esm/types/src/packages/loading/loading.taro.d.ts +10 -0
- package/dist/esm/types/src/packages/nutui.react.build.d.ts +3 -1
- package/dist/esm/types/src/packages/nutui.react.d.ts +5 -1
- package/dist/esm/types/src/packages/nutui.react.scss.d.ts +2 -0
- package/dist/esm/types/src/packages/nutui.react.taro.d.ts +3 -1
- package/dist/esm/types/src/packages/nutui.react.taro.scss.d.ts +1 -0
- package/dist/esm/types/src/packages/nutui.taro.react.build.d.ts +2 -1
- package/dist/esm/types/src/packages/popover/popover.d.ts +1 -0
- package/dist/esm/types/src/packages/popover/popover.taro.d.ts +1 -0
- package/dist/esm/types/src/packages/tour/__test__/tour.spec.d.ts +1 -0
- package/dist/esm/types/src/packages/tour/demo.d.ts +4 -0
- package/dist/esm/types/src/packages/tour/demo.taro.d.ts +4 -0
- package/dist/esm/types/src/packages/tour/index.d.ts +3 -0
- package/dist/esm/types/src/packages/tour/index.taro.d.ts +3 -0
- package/dist/esm/types/src/packages/tour/tour.d.ts +31 -0
- package/dist/esm/types/src/packages/tour/tour.taro.d.ts +31 -0
- package/dist/esm/types/src/utils/typings.d.ts +1 -0
- package/dist/esm/types/src/utils/use-taro-rect.d.ts +1 -0
- package/dist/locales/base.d.ts +5 -0
- package/dist/locales/base.js +1 -1
- package/dist/locales/en-US.js +6 -1
- package/dist/locales/id-ID.js +6 -1
- package/dist/locales/tr-TR.js +6 -1
- package/dist/locales/zh-CN.js +6 -1
- package/dist/locales/zh-TW.js +6 -1
- package/dist/locales/zh-UG.js +6 -1
- package/dist/nutui.react.es.js +704 -409
- package/dist/nutui.react.umd.js +704 -409
- package/dist/packages/calendar/calendar.scss +1 -6
- package/dist/packages/loading/loading.scss +34 -0
- package/dist/packages/tour/tour.scss +78 -0
- package/dist/packages/uploader/uploader.scss +1 -0
- package/dist/style.css +1 -1
- package/dist/style.mjs +1 -1
- package/dist/styles/themes/default.scss +2 -0
- package/dist/styles/variables.scss +39 -0
- package/dist/types/index.d.ts +5 -1
- package/dist/types/locales/base.d.ts +5 -0
- package/dist/types/packages/configprovider/types.d.ts +1 -1
- package/dist/types/packages/loading/index.d.ts +3 -0
- package/dist/types/packages/loading/loading.d.ts +10 -0
- package/dist/types/packages/popover/popover.d.ts +5 -0
- package/dist/types/packages/tour/index.d.ts +3 -0
- package/dist/types/packages/tour/tour.d.ts +95 -0
- package/dist/types/utils/typings.d.ts +1 -0
- package/package.json +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,3 +1,27 @@
|
|
|
1
|
+
# v2.0.11
|
|
2
|
+
`2023-08-09`
|
|
3
|
+
|
|
4
|
+
* :sparkles: feat: 新增 tour 引导组件 (#1279) @junjun666
|
|
5
|
+
* :bug: fix: h5下多选上传时 uid 重复的问题 (#1269) @Liuqh233
|
|
6
|
+
* :bug: fix: input 组件点击清除图标无法清空内容 (#1292) @oasis-cloud
|
|
7
|
+
* :bug: fix: numberkeyboard 设置标题后,完成按钮应该触发 onConfirm 事件 (#1285) @oasis-cloud
|
|
8
|
+
* :bug: fix: uploader h5/taro 增加校验 (#1297) @junjun666
|
|
9
|
+
* :bug: fix: uploader taro-h5 上传状态样式错乱 (#1293) @junjun666
|
|
10
|
+
* 📖 docs: divider 组件的 styles 属性示例改为 style (#1290) @oasis-cloud
|
|
11
|
+
* 📖 docs: numberkeyboard 的 type 属性类型更新 (#1284) @oasis-cloud
|
|
12
|
+
* 📖 docs: step 组件的 description 属性示例改为节点的实现方式 (#1289) @oasis-cloud
|
|
13
|
+
* 📖 docs: 调整 image tao 文档中引入包名 (#1295) @oasis-cloud
|
|
14
|
+
|
|
15
|
+
|
|
16
|
+
# v2.0.10
|
|
17
|
+
`2023-08-04`
|
|
18
|
+
|
|
19
|
+
* :sparkles: feat: loading 组件 (#1204) @mike8625
|
|
20
|
+
* :sparkles: feat: 日历支持footer的children定义,增加日历+datepicker的demo (#1277) @xiaoyatong
|
|
21
|
+
* :bug: fix: elevator 计算索引出现 -1,导致组件运行报错 (#1276) @oasis-cloud
|
|
22
|
+
* :bug: fix: loading 组件导出 props 类型 (#1278) @oasis-cloud
|
|
23
|
+
|
|
24
|
+
|
|
1
25
|
# v2.0.9
|
|
2
26
|
`2023-08-02`
|
|
3
27
|
|
|
@@ -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-overlay .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))}@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-overlay-slide-enter-active,.nut-overlay-slide-appear-active{animation-fill-mode:both;animation-name:nut-fade-in;animation-duration:var(--nutui-overlay-animation-duration, .3s)}.nut-overlay-slide-exit-active{animation-fill-mode:both;animation-name:nut-fade-out;animation-duration:var(--nutui-overlay-animation-duration, .3s)}.nut-popup{position:fixed;max-height:100%;overflow-y:auto;background-color:var(--nutui-gray-6, #ffffff);color:var(--nutui-gray-1, #1a1a1a);-webkit-overflow-scrolling:touch}.nut-popup-title{display:flex;align-items:center;justify-content:center;background-color:var(--nutui-gray-6, #ffffff);color:var(--nutui-gray-1, #1a1a1a);padding:var(--nutui-popup-title-padding, 15px);font-weight:var(--nutui-font-weight-bold, 400);line-height:var(--nutui-popup-title-line-height, 18px);font-size:var(--nutui-popup-title-font-size, 18px);border-bottom:var(--nutui-popup-title-border-bottom, 0)}.nut-popup-left-icon{position:absolute;top:var(--nutui-popup-close-icon-margin, 16px);left:var(--nutui-popup-close-icon-margin, 16px)}.nut-popup__close-icon{position:absolute!important;z-index:1;color:var(--nutui-popup-close-icon-color, #969799);cursor:pointer;width:30px;height:30px;display:flex;justify-content:center;align-items:center}.nut-popup__close-icon:active{opacity:.7}.nut-popup__close-icon--top-left{top:var(--nutui-popup-close-icon-margin, 16px);left:var(--nutui-popup-close-icon-margin, 16px)}.nut-popup__close-icon--top-right{top:var(--nutui-popup-close-icon-margin, 16px);right:var(--nutui-popup-close-icon-margin, 16px)}.nut-popup__close-icon--bottom-left{bottom:var(--nutui-popup-close-icon-margin, 16px);left:var(--nutui-popup-close-icon-margin, 16px)}.nut-popup__close-icon--bottom-right{right:var(--nutui-popup-close-icon-margin, 16px);bottom:var(--nutui-popup-close-icon-margin, 16px)}.nut-popup-center{top:50%;left:50%;transform:translate(-50%,-50%)}.nut-popup-center.round{border-radius:var(--nutui-popup-border-radius, 24px)}.nut-popup-bottom{bottom:0;left:0;width:100%}.nut-popup-bottom.round{border-radius:var(--nutui-popup-border-radius, 24px) var(--nutui-popup-border-radius, 24px) 0 0}.nut-popup-right{top:0;right:0}.nut-popup-right.round{border-radius:var(--nutui-popup-border-radius, 24px) 0 0 var(--nutui-popup-border-radius, 24px)}.nut-popup-left{top:0;left:0}.nut-popup-left.round{border-radius:0 var(--nutui-popup-border-radius, 24px) var(--nutui-popup-border-radius, 24px) 0}.nut-popup-top{top:0;left:0;width:100%}.nut-popup-top.round{border-radius:0 0 var(--nutui-popup-border-radius, 24px) var(--nutui-popup-border-radius, 24px)}@keyframes popup-scale-fade-in{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}@keyframes popup-scale-fade-out{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.8)}}.nut-popup-slide-default-enter-active{animation-fill-mode:both;animation-name:popup-scale-fade-in;animation-duration:var(--nutui-popup-animation-duration, .3s)}.nut-popup-slide-default-exit-active{animation-fill-mode:both;animation-name:popup-scale-fade-out;animation-duration:var(--nutui-popup-animation-duration, .3s)}@keyframes popup-fade-in{0%{opacity:0}to{opacity:1}}@keyframes popup-fade-out{0%{opacity:1}to{opacity:0}}.nut-popup-slide-center-enter-active{animation-fill-mode:both;animation-name:popup-fade-in;animation-duration:var(--nutui-popup-animation-duration, .3s)}.nut-popup-slide-center-exit-active{animation-fill-mode:both;animation-name:popup-fade-out;animation-duration:var(--nutui-popup-animation-duration, .3s)}@keyframes popup-slide-top-enter{0%{transform:translate3d(0,-100%,0)}}@keyframes popup-slide-top-exit{to{transform:translate3d(0,-100%,0)}}.nut-popup-slide-top-enter-active,.nut-popup-slide-top-appear-active{transform:translateZ(0);animation-fill-mode:both;animation-name:popup-slide-top-enter;animation-duration:var(--nutui-popup-animation-duration, .3s)}.nut-popup-slide-top-exit-active{animation-fill-mode:both;animation-name:popup-slide-top-exit;animation-duration:var(--nutui-popup-animation-duration, .3s)}@keyframes popup-slide-right-enter{0%{transform:translate3d(100%,0,0)}}@keyframes popup-slide-right-exit{to{transform:translate3d(100%,0,0)}}.nut-popup-slide-right-enter-active,.nut-popup-slide-right-appear-active{transform:translateZ(0);animation-fill-mode:both;animation-name:popup-slide-right-enter;animation-duration:var(--nutui-popup-animation-duration, .3s)}.nut-popup-slide-right-exit{animation-fill-mode:both;animation-name:popup-slide-right-exit;animation-duration:var(--nutui-popup-animation-duration, .3s)}@keyframes popup-slide-bottom-enter{0%{transform:translate3d(0,100%,0)}}@keyframes slide-bottom-exit{to{transform:translate3d(0,100%,0)}}.nut-popup-slide-bottom-enter-active,.nut-popup-slide-bottom-appear-active{transform:translate(0);animation-fill-mode:both;animation-name:popup-slide-bottom-enter;animation-duration:var(--nutui-popup-animation-duration, .3s)}.nut-popup-slide-bottom-exit{animation-fill-mode:both;animation-name:slide-bottom-exit;animation-duration:var(--nutui-popup-animation-duration, .3s)}@keyframes popup-slide-left-enter{0%{transform:translate3d(-100%,0,0)}}@keyframes popup-slide-left-exit{to{transform:translate3d(-100%,0,0)}}.nut-popup-slide-left-enter-active,.nut-popup-slide-left-appear-active{transform:translate(0);animation-fill-mode:both;animation-name:popup-slide-left-enter;animation-duration:var(--nutui-popup-animation-duration, .3s)}.nut-popup-slide-left-exit-active,.nut-popup-slide-left-exit-done{animation-fill-mode:both;animation-name:popup-slide-left-exit;animation-duration:var(--nutui-popup-animation-duration, .3s)}.nut-overflow-hidden{overflow:hidden!important}.nut-calendar{position:relative;display:flex;flex-direction:column;flex:1;font-size:var(--nutui-calendar-base-font-size, var(--nutui-font-size-3, 16px));background-color:var(--nutui-gray-6, #ffffff);color:var(--nutui-gray-1, #1a1a1a);overflow:hidden;height:100%}.nut-calendar.nut-calendar-title .nut-calendar-header .calendar-title{font-size:var(--nutui-calendar-base-font-size, var(--nutui-font-size-3, 16px))}.nut-calendar .nut-calendar-taro{height:60vh}.nut-calendar .popup-box{height:100%}.nut-calendar ::-webkit-scrollbar{display:none}.nut-calendar-header{display:flex;flex-direction:column;text-align:center}.nut-calendar-title{font-size:var(--nutui-calendar-title-font-size, var(--nutui-font-size-4, 18px));font-weight:var(--nutui-calendar-title-font-weight, 500);line-height:44px}.nut-calendar-sub-title{padding:7px 0;line-height:22px;font-size:var(--nutui-calendar-sub-title-font-size, var(--nutui-font-size-2, 14px))}.nut-calendar-header-buttons{height:var(--nutui-calendar-header-height, 24px)}.nut-calendar-weeks{display:flex;align-items:center;justify-content:space-around;height:36px;border-radius:0 0 12px 12px;box-shadow:0 4px 10px #0000000f}.nut-calendar-week-item:first-of-type,.nut-calendar-week-item:last-of-type{color:var(--nutui-calendar-day67-color, var(--nutui-brand-color, #fa2c19))}.nut-calendar-content{flex:1;width:100%;display:block;overflow-y:auto}.nut-calendar-pannel{position:relative;width:100%;height:auto;display:block;box-sizing:border-box}.nut-calendar-pannel .calendar-loading-tip{height:50px;line-height:50px;text-align:center;position:absolute;top:-50px;left:0;right:0;font-size:var(--nutui-font-size-1, 12px);color:var(--nutui-gray-2, #757575)}.nut-calendar-month{display:flex;flex-direction:column;text-align:center}.nut-calendar-month-title{height:23px;line-height:23px;margin:8px 0}.nut-calendar-days{overflow:hidden}.nut-calendar-day{display:flex;align-items:center;justify-content:center;flex-direction:column;position:relative;float:left;width:var(--nutui-calendar-day-width, 14.28%);height:var(--nutui-calendar-day-height, 60px);font-weight:var(--nutui-calendar-day-font-weight, 500);margin-bottom:4px}.nut-calendar-day:nth-child(7n+0),.nut-calendar-day:nth-child(7n+1){color:var(--nutui-calendar-day67-color, var(--nutui-brand-color, #fa2c19))}.nut-calendar-day-info-curr,.nut-calendar-day-info{position:absolute;bottom:5px;width:100%;font-size:12px;line-height:14px}.nut-calendar-day-info-top{position:absolute;width:100%;top:5px}.nut-calendar-day-info-bottom{position:absolute;width:100%;bottom:5px}.nut-calendar-day-active{background-color:var(--nutui-calendar-active-background-color, var(--nutui-brand-color, #fa2c19));color:var(--nutui-brand-text-color, #ffffff)!important;border-radius:var(--nutui-calendar-day-active-border-radius, 4px)}.nut-calendar-day-active.active-start{border-radius:0;border-top-left-radius:var(--nutui-calendar-day-active-border-radius, 4px);border-bottom-left-radius:var(--nutui-calendar-day-active-border-radius, 4px)}.nut-calendar-day-active.active-end{border-radius:0;border-top-right-radius:var(--nutui-calendar-day-active-border-radius, 4px);border-bottom-right-radius:var(--nutui-calendar-day-active-border-radius, 4px)}.nut-calendar-day-active .nut-calendar-day-info{color:var(--nutui-brand-text-color, #ffffff)}.nut-calendar-day-disabled{color:var(--nutui-calendar-disable-color, var(--nutui-gray-3, #bfbfbf))!important}.nut-calendar-day-disabled .nut-calendar-day-info-curr{display:none}.nut-calendar-day-choose-disabled{background-color:var(--nutui-calendar-choose-disable-background-color, rgba(191, 191, 191, .09));color:var(--nutui-calendar-disable-color, var(--nutui-gray-3, #bfbfbf))!important}.nut-calendar-day-choose-disabled .nut-calendar-day-info-curr{display:none}.nut-calendar-day-choose{background-color:var(--nutui-calendar-choose-background-color, rgba(250, 44, 25, .09));color:var(--nutui-calendar-choose-color, var(--nutui-brand-color, #fa2c19))}.nut-calendar-footer{display:flex;height:62px;width:100%;background-color:var(--nutui-gray-6, #ffffff)}.nut-calendar-footer .calendar-confirm-btn{height:44px;width:100%;margin:10px 18px;border-radius:22px;background:linear-gradient(135deg,var(--nutui-brand-color, #fa2c19) 0%,var(--nutui-brand-color-end, #fa2c19) 100%);color:var(--nutui-brand-text-color, #ffffff);text-align:center;line-height:44px}.nut-popup__close-icon{top:7px!important}
|
|
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-overlay .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))}@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-overlay-slide-enter-active,.nut-overlay-slide-appear-active{animation-fill-mode:both;animation-name:nut-fade-in;animation-duration:var(--nutui-overlay-animation-duration, .3s)}.nut-overlay-slide-exit-active{animation-fill-mode:both;animation-name:nut-fade-out;animation-duration:var(--nutui-overlay-animation-duration, .3s)}.nut-popup{position:fixed;max-height:100%;overflow-y:auto;background-color:var(--nutui-gray-6, #ffffff);color:var(--nutui-gray-1, #1a1a1a);-webkit-overflow-scrolling:touch}.nut-popup-title{display:flex;align-items:center;justify-content:center;background-color:var(--nutui-gray-6, #ffffff);color:var(--nutui-gray-1, #1a1a1a);padding:var(--nutui-popup-title-padding, 15px);font-weight:var(--nutui-font-weight-bold, 400);line-height:var(--nutui-popup-title-line-height, 18px);font-size:var(--nutui-popup-title-font-size, 18px);border-bottom:var(--nutui-popup-title-border-bottom, 0)}.nut-popup-left-icon{position:absolute;top:var(--nutui-popup-close-icon-margin, 16px);left:var(--nutui-popup-close-icon-margin, 16px)}.nut-popup__close-icon{position:absolute!important;z-index:1;color:var(--nutui-popup-close-icon-color, #969799);cursor:pointer;width:30px;height:30px;display:flex;justify-content:center;align-items:center}.nut-popup__close-icon:active{opacity:.7}.nut-popup__close-icon--top-left{top:var(--nutui-popup-close-icon-margin, 16px);left:var(--nutui-popup-close-icon-margin, 16px)}.nut-popup__close-icon--top-right{top:var(--nutui-popup-close-icon-margin, 16px);right:var(--nutui-popup-close-icon-margin, 16px)}.nut-popup__close-icon--bottom-left{bottom:var(--nutui-popup-close-icon-margin, 16px);left:var(--nutui-popup-close-icon-margin, 16px)}.nut-popup__close-icon--bottom-right{right:var(--nutui-popup-close-icon-margin, 16px);bottom:var(--nutui-popup-close-icon-margin, 16px)}.nut-popup-center{top:50%;left:50%;transform:translate(-50%,-50%)}.nut-popup-center.round{border-radius:var(--nutui-popup-border-radius, 24px)}.nut-popup-bottom{bottom:0;left:0;width:100%}.nut-popup-bottom.round{border-radius:var(--nutui-popup-border-radius, 24px) var(--nutui-popup-border-radius, 24px) 0 0}.nut-popup-right{top:0;right:0}.nut-popup-right.round{border-radius:var(--nutui-popup-border-radius, 24px) 0 0 var(--nutui-popup-border-radius, 24px)}.nut-popup-left{top:0;left:0}.nut-popup-left.round{border-radius:0 var(--nutui-popup-border-radius, 24px) var(--nutui-popup-border-radius, 24px) 0}.nut-popup-top{top:0;left:0;width:100%}.nut-popup-top.round{border-radius:0 0 var(--nutui-popup-border-radius, 24px) var(--nutui-popup-border-radius, 24px)}@keyframes popup-scale-fade-in{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}@keyframes popup-scale-fade-out{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.8)}}.nut-popup-slide-default-enter-active{animation-fill-mode:both;animation-name:popup-scale-fade-in;animation-duration:var(--nutui-popup-animation-duration, .3s)}.nut-popup-slide-default-exit-active{animation-fill-mode:both;animation-name:popup-scale-fade-out;animation-duration:var(--nutui-popup-animation-duration, .3s)}@keyframes popup-fade-in{0%{opacity:0}to{opacity:1}}@keyframes popup-fade-out{0%{opacity:1}to{opacity:0}}.nut-popup-slide-center-enter-active{animation-fill-mode:both;animation-name:popup-fade-in;animation-duration:var(--nutui-popup-animation-duration, .3s)}.nut-popup-slide-center-exit-active{animation-fill-mode:both;animation-name:popup-fade-out;animation-duration:var(--nutui-popup-animation-duration, .3s)}@keyframes popup-slide-top-enter{0%{transform:translate3d(0,-100%,0)}}@keyframes popup-slide-top-exit{to{transform:translate3d(0,-100%,0)}}.nut-popup-slide-top-enter-active,.nut-popup-slide-top-appear-active{transform:translateZ(0);animation-fill-mode:both;animation-name:popup-slide-top-enter;animation-duration:var(--nutui-popup-animation-duration, .3s)}.nut-popup-slide-top-exit-active{animation-fill-mode:both;animation-name:popup-slide-top-exit;animation-duration:var(--nutui-popup-animation-duration, .3s)}@keyframes popup-slide-right-enter{0%{transform:translate3d(100%,0,0)}}@keyframes popup-slide-right-exit{to{transform:translate3d(100%,0,0)}}.nut-popup-slide-right-enter-active,.nut-popup-slide-right-appear-active{transform:translateZ(0);animation-fill-mode:both;animation-name:popup-slide-right-enter;animation-duration:var(--nutui-popup-animation-duration, .3s)}.nut-popup-slide-right-exit{animation-fill-mode:both;animation-name:popup-slide-right-exit;animation-duration:var(--nutui-popup-animation-duration, .3s)}@keyframes popup-slide-bottom-enter{0%{transform:translate3d(0,100%,0)}}@keyframes slide-bottom-exit{to{transform:translate3d(0,100%,0)}}.nut-popup-slide-bottom-enter-active,.nut-popup-slide-bottom-appear-active{transform:translate(0);animation-fill-mode:both;animation-name:popup-slide-bottom-enter;animation-duration:var(--nutui-popup-animation-duration, .3s)}.nut-popup-slide-bottom-exit{animation-fill-mode:both;animation-name:slide-bottom-exit;animation-duration:var(--nutui-popup-animation-duration, .3s)}@keyframes popup-slide-left-enter{0%{transform:translate3d(-100%,0,0)}}@keyframes popup-slide-left-exit{to{transform:translate3d(-100%,0,0)}}.nut-popup-slide-left-enter-active,.nut-popup-slide-left-appear-active{transform:translate(0);animation-fill-mode:both;animation-name:popup-slide-left-enter;animation-duration:var(--nutui-popup-animation-duration, .3s)}.nut-popup-slide-left-exit-active,.nut-popup-slide-left-exit-done{animation-fill-mode:both;animation-name:popup-slide-left-exit;animation-duration:var(--nutui-popup-animation-duration, .3s)}.nut-overflow-hidden{overflow:hidden!important}.nut-calendar{position:relative;display:flex;flex-direction:column;flex:1;font-size:var(--nutui-calendar-base-font-size, var(--nutui-font-size-3, 16px));background-color:var(--nutui-gray-6, #ffffff);color:var(--nutui-gray-1, #1a1a1a);overflow:hidden;height:100%}.nut-calendar.nut-calendar-title .nut-calendar-header .calendar-title{font-size:var(--nutui-calendar-base-font-size, var(--nutui-font-size-3, 16px))}.nut-calendar .nut-calendar-taro{height:60vh}.nut-calendar .popup-box{height:100%}.nut-calendar ::-webkit-scrollbar{display:none}.nut-calendar-header{display:flex;flex-direction:column;text-align:center}.nut-calendar-title{font-size:var(--nutui-calendar-title-font-size, var(--nutui-font-size-4, 18px));font-weight:var(--nutui-calendar-title-font-weight, 500);line-height:44px}.nut-calendar-sub-title{padding:7px 0;line-height:22px;font-size:var(--nutui-calendar-sub-title-font-size, var(--nutui-font-size-2, 14px))}.nut-calendar-header-buttons{height:var(--nutui-calendar-header-height, 24px)}.nut-calendar-weeks{display:flex;align-items:center;justify-content:space-around;height:36px;border-radius:0 0 12px 12px;box-shadow:0 4px 10px #0000000f}.nut-calendar-week-item:first-of-type,.nut-calendar-week-item:last-of-type{color:var(--nutui-calendar-day67-color, var(--nutui-brand-color, #fa2c19))}.nut-calendar-content{flex:1;width:100%;display:block;overflow-y:auto}.nut-calendar-pannel{position:relative;width:100%;height:auto;display:block;box-sizing:border-box}.nut-calendar-pannel .calendar-loading-tip{height:50px;line-height:50px;text-align:center;position:absolute;top:-50px;left:0;right:0;font-size:var(--nutui-font-size-1, 12px);color:var(--nutui-gray-2, #757575)}.nut-calendar-month{display:flex;flex-direction:column;text-align:center}.nut-calendar-month-title{height:23px;line-height:23px;margin:8px 0}.nut-calendar-days{overflow:hidden}.nut-calendar-day{display:flex;align-items:center;justify-content:center;flex-direction:column;position:relative;float:left;width:var(--nutui-calendar-day-width, 14.28%);height:var(--nutui-calendar-day-height, 60px);font-weight:var(--nutui-calendar-day-font-weight, 500);margin-bottom:4px}.nut-calendar-day:nth-child(7n+0),.nut-calendar-day:nth-child(7n+1){color:var(--nutui-calendar-day67-color, var(--nutui-brand-color, #fa2c19))}.nut-calendar-day-info-curr,.nut-calendar-day-info{position:absolute;bottom:5px;width:100%;font-size:12px;line-height:14px}.nut-calendar-day-info-top{position:absolute;width:100%;top:5px}.nut-calendar-day-info-bottom{position:absolute;width:100%;bottom:5px}.nut-calendar-day-active{background-color:var(--nutui-calendar-active-background-color, var(--nutui-brand-color, #fa2c19));color:var(--nutui-brand-text-color, #ffffff)!important;border-radius:var(--nutui-calendar-day-active-border-radius, 4px)}.nut-calendar-day-active.active-start{border-radius:0;border-top-left-radius:var(--nutui-calendar-day-active-border-radius, 4px);border-bottom-left-radius:var(--nutui-calendar-day-active-border-radius, 4px)}.nut-calendar-day-active.active-end{border-radius:0;border-top-right-radius:var(--nutui-calendar-day-active-border-radius, 4px);border-bottom-right-radius:var(--nutui-calendar-day-active-border-radius, 4px)}.nut-calendar-day-active .nut-calendar-day-info{color:var(--nutui-brand-text-color, #ffffff)}.nut-calendar-day-disabled{color:var(--nutui-calendar-disable-color, var(--nutui-gray-3, #bfbfbf))!important}.nut-calendar-day-disabled .nut-calendar-day-info-curr{display:none}.nut-calendar-day-choose-disabled{background-color:var(--nutui-calendar-choose-disable-background-color, rgba(191, 191, 191, .09));color:var(--nutui-calendar-disable-color, var(--nutui-gray-3, #bfbfbf))!important}.nut-calendar-day-choose-disabled .nut-calendar-day-info-curr{display:none}.nut-calendar-day-choose{background-color:var(--nutui-calendar-choose-background-color, rgba(250, 44, 25, .09));color:var(--nutui-calendar-choose-color, var(--nutui-brand-color, #fa2c19))}.nut-calendar-footer{display:flex;width:100%;flex-direction:column;background-color:var(--nutui-gray-6, #ffffff)}.nut-calendar-footer .calendar-confirm-btn{height:44px;margin:10px 18px;border-radius:22px;background:linear-gradient(135deg,var(--nutui-brand-color, #fa2c19) 0%,var(--nutui-brand-color-end, #fa2c19) 100%);color:var(--nutui-brand-text-color, #ffffff);text-align:center;line-height:44px}.nut-popup__close-icon{top:7px!important}
|
package/dist/esm/Calendar.js
CHANGED
|
@@ -61,7 +61,7 @@ var defaultProps = _objectSpread(_objectSpread({}, ComponentDefaults), {}, {
|
|
|
61
61
|
});
|
|
62
62
|
var Calendar = React__default.forwardRef(function(props, ref) {
|
|
63
63
|
var _useConfig = useConfig(), locale = _useConfig.locale;
|
|
64
|
-
var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props), style = _defaultProps$props.style, className = _defaultProps$props.className, popup = _defaultProps$props.popup, visible = _defaultProps$props.visible, type = _defaultProps$props.type, autoBackfill = _defaultProps$props.autoBackfill, title = _defaultProps$props.title, defaultValue = _defaultProps$props.defaultValue, startDate = _defaultProps$props.startDate, endDate = _defaultProps$props.endDate, showToday = _defaultProps$props.showToday, startText = _defaultProps$props.startText, endText = _defaultProps$props.endText, confirmText = _defaultProps$props.confirmText, showTitle = _defaultProps$props.showTitle, showSubTitle = _defaultProps$props.showSubTitle, scrollAnimation = _defaultProps$props.scrollAnimation, firstDayOfWeek = _defaultProps$props.firstDayOfWeek, disableDate2 = _defaultProps$props.disableDate, renderHeaderButtons = _defaultProps$props.renderHeaderButtons, renderDay = _defaultProps$props.renderDay, renderDayTop = _defaultProps$props.renderDayTop, renderDayBottom = _defaultProps$props.renderDayBottom, onClose2 = _defaultProps$props.onClose, onConfirm2 = _defaultProps$props.onConfirm, onDayClick2 = _defaultProps$props.onDayClick, onPageChange2 = _defaultProps$props.onPageChange;
|
|
64
|
+
var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props), style = _defaultProps$props.style, className = _defaultProps$props.className, children = _defaultProps$props.children, popup = _defaultProps$props.popup, visible = _defaultProps$props.visible, type = _defaultProps$props.type, autoBackfill = _defaultProps$props.autoBackfill, title = _defaultProps$props.title, defaultValue = _defaultProps$props.defaultValue, startDate = _defaultProps$props.startDate, endDate = _defaultProps$props.endDate, showToday = _defaultProps$props.showToday, startText = _defaultProps$props.startText, endText = _defaultProps$props.endText, confirmText = _defaultProps$props.confirmText, showTitle = _defaultProps$props.showTitle, showSubTitle = _defaultProps$props.showSubTitle, scrollAnimation = _defaultProps$props.scrollAnimation, firstDayOfWeek = _defaultProps$props.firstDayOfWeek, disableDate2 = _defaultProps$props.disableDate, renderHeaderButtons = _defaultProps$props.renderHeaderButtons, renderDay = _defaultProps$props.renderDay, renderDayTop = _defaultProps$props.renderDayTop, renderDayBottom = _defaultProps$props.renderDayBottom, onClose2 = _defaultProps$props.onClose, onConfirm2 = _defaultProps$props.onConfirm, onDayClick2 = _defaultProps$props.onDayClick, onPageChange2 = _defaultProps$props.onPageChange;
|
|
65
65
|
var calendarRef = useRef(null);
|
|
66
66
|
var close = function close2() {
|
|
67
67
|
onClose2 && onClose2();
|
|
@@ -93,6 +93,7 @@ var Calendar = React__default.forwardRef(function(props, ref) {
|
|
|
93
93
|
ref: calendarRef,
|
|
94
94
|
style,
|
|
95
95
|
className,
|
|
96
|
+
children,
|
|
96
97
|
type,
|
|
97
98
|
autoBackfill,
|
|
98
99
|
popup,
|
package/dist/esm/CalendarItem.js
CHANGED
|
@@ -91,7 +91,7 @@ var defaultProps = _objectSpread(_objectSpread({}, ComponentDefaults), {}, {
|
|
|
91
91
|
var CalendarItem = React__default.forwardRef(function(props, ref) {
|
|
92
92
|
var _classNames, _classNames2;
|
|
93
93
|
var _useConfig = useConfig(), locale = _useConfig.locale;
|
|
94
|
-
var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props), style = _defaultProps$props.style, className = _defaultProps$props.className, popup = _defaultProps$props.popup, type = _defaultProps$props.type, autoBackfill = _defaultProps$props.autoBackfill, title = _defaultProps$props.title, defaultValue = _defaultProps$props.defaultValue, startDate = _defaultProps$props.startDate, endDate = _defaultProps$props.endDate, showToday = _defaultProps$props.showToday, startText = _defaultProps$props.startText, endText = _defaultProps$props.endText, confirmText = _defaultProps$props.confirmText, showTitle = _defaultProps$props.showTitle, showSubTitle = _defaultProps$props.showSubTitle, scrollAnimation = _defaultProps$props.scrollAnimation, firstDayOfWeek = _defaultProps$props.firstDayOfWeek, disableDate2 = _defaultProps$props.disableDate, renderHeaderButtons = _defaultProps$props.renderHeaderButtons, renderDay = _defaultProps$props.renderDay, renderDayTop = _defaultProps$props.renderDayTop, renderDayBottom = _defaultProps$props.renderDayBottom, onConfirm2 = _defaultProps$props.onConfirm, onUpdate2 = _defaultProps$props.onUpdate, onDayClick2 = _defaultProps$props.onDayClick, onPageChange2 = _defaultProps$props.onPageChange;
|
|
94
|
+
var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props), style = _defaultProps$props.style, className = _defaultProps$props.className, children = _defaultProps$props.children, popup = _defaultProps$props.popup, type = _defaultProps$props.type, autoBackfill = _defaultProps$props.autoBackfill, title = _defaultProps$props.title, defaultValue = _defaultProps$props.defaultValue, startDate = _defaultProps$props.startDate, endDate = _defaultProps$props.endDate, showToday = _defaultProps$props.showToday, startText = _defaultProps$props.startText, endText = _defaultProps$props.endText, confirmText = _defaultProps$props.confirmText, showTitle = _defaultProps$props.showTitle, showSubTitle = _defaultProps$props.showSubTitle, scrollAnimation = _defaultProps$props.scrollAnimation, firstDayOfWeek = _defaultProps$props.firstDayOfWeek, disableDate2 = _defaultProps$props.disableDate, renderHeaderButtons = _defaultProps$props.renderHeaderButtons, renderDay = _defaultProps$props.renderDay, renderDayTop = _defaultProps$props.renderDayTop, renderDayBottom = _defaultProps$props.renderDayBottom, onConfirm2 = _defaultProps$props.onConfirm, onUpdate2 = _defaultProps$props.onUpdate, onDayClick2 = _defaultProps$props.onDayClick, onPageChange2 = _defaultProps$props.onPageChange;
|
|
95
95
|
var weekdays = locale.calendaritem.weekdays;
|
|
96
96
|
var weeks = [].concat(_toConsumableArray(weekdays.slice(firstDayOfWeek, 7)), _toConsumableArray(weekdays.slice(0, firstDayOfWeek)));
|
|
97
97
|
var monthTitle = locale.calendaritem.monthTitle;
|
|
@@ -602,7 +602,7 @@ var CalendarItem = React__default.forwardRef(function(props, ref) {
|
|
|
602
602
|
var renderFooter = function renderFooter2() {
|
|
603
603
|
return React__default.createElement("div", {
|
|
604
604
|
className: "nut-calendar-footer"
|
|
605
|
-
}, React__default.createElement("div", {
|
|
605
|
+
}, children, React__default.createElement("div", {
|
|
606
606
|
className: "calendar-confirm-btn",
|
|
607
607
|
onClick: confirm
|
|
608
608
|
}, confirmText || locale.confirm));
|
package/dist/esm/Elevator.js
CHANGED
|
@@ -88,7 +88,7 @@ var Elevator = function Elevator2(props) {
|
|
|
88
88
|
cacheIndex = 0;
|
|
89
89
|
}
|
|
90
90
|
if (index > state.current.listHeight.length - 2) {
|
|
91
|
-
cacheIndex = state.current.listHeight.length - 2;
|
|
91
|
+
cacheIndex = Math.max(0, state.current.listHeight.length - 2);
|
|
92
92
|
}
|
|
93
93
|
setCodeIndex(cacheIndex);
|
|
94
94
|
if (listview.current) {
|
package/dist/esm/Input.js
CHANGED
|
@@ -132,7 +132,9 @@ var Input = forwardRef(function(props, ref) {
|
|
|
132
132
|
var handleBlur = function handleBlur2(event) {
|
|
133
133
|
var val = event.target.value;
|
|
134
134
|
updateValue(val, "onBlur");
|
|
135
|
-
|
|
135
|
+
setTimeout(function() {
|
|
136
|
+
setActive(false);
|
|
137
|
+
}, 200);
|
|
136
138
|
};
|
|
137
139
|
var inputType = function inputType2(type2) {
|
|
138
140
|
if (type2 === "digit") {
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import './style.css'
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.nut-loading{display:inline-flex;flex-direction:row;align-items:center;justify-content:center}.nut-loading.nut-loading-vertical{flex-direction:column}.nut-loading .nut-loading-icon-box{display:inline-block;font-size:0;line-height:0;animation:nut-loading-rotation 1s infinite linear}.nut-loading .nut-loading-icon-box .nut-loading-icon{color:var(--nutui-loading-icon-color, #9ea9af);width:var(--nutui-loading-icon-size, 32px);height:var(--nutui-loading-icon-size, 32px);font-size:var(--nutui-loading-icon-size, 32px)}.nut-loading .nut-loading-text{padding:4px;color:var(--nutui-loading-text-color, #9ea9af);font-size:var(--nutui-loading-text-size, 14px)}@keyframes nut-loading-rotation{0%{-webkit-transform:rotate(0deg)}to{-webkit-transform:rotate(360deg)}}
|
|
@@ -0,0 +1,57 @@
|
|
|
1
|
+
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
|
|
2
|
+
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
3
|
+
var _excluded = ["className", "style", "children", "direction", "icon"];
|
|
4
|
+
function ownKeys(object, enumerableOnly) {
|
|
5
|
+
var keys = Object.keys(object);
|
|
6
|
+
if (Object.getOwnPropertySymbols) {
|
|
7
|
+
var symbols = Object.getOwnPropertySymbols(object);
|
|
8
|
+
enumerableOnly && (symbols = symbols.filter(function(sym) {
|
|
9
|
+
return Object.getOwnPropertyDescriptor(object, sym).enumerable;
|
|
10
|
+
})), keys.push.apply(keys, symbols);
|
|
11
|
+
}
|
|
12
|
+
return keys;
|
|
13
|
+
}
|
|
14
|
+
function _objectSpread(target) {
|
|
15
|
+
for (var i = 1; i < arguments.length; i++) {
|
|
16
|
+
var source = null != arguments[i] ? arguments[i] : {};
|
|
17
|
+
i % 2 ? ownKeys(Object(source), true).forEach(function(key) {
|
|
18
|
+
_defineProperty(target, key, source[key]);
|
|
19
|
+
}) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function(key) {
|
|
20
|
+
Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
|
|
21
|
+
});
|
|
22
|
+
}
|
|
23
|
+
return target;
|
|
24
|
+
}
|
|
25
|
+
import React__default from "react";
|
|
26
|
+
import classNames from "classnames";
|
|
27
|
+
import { Loading1, Loading as Loading$1 } from "@nutui/icons-react";
|
|
28
|
+
import { C as ComponentDefaults } from "./typings.js";
|
|
29
|
+
var loadingMap = {
|
|
30
|
+
circular: Loading1,
|
|
31
|
+
spinner: Loading$1
|
|
32
|
+
};
|
|
33
|
+
var defaultProps = _objectSpread(_objectSpread({}, ComponentDefaults), {}, {
|
|
34
|
+
// 对比一下,个人感觉还是Loading1比较好看一些,所以用它作为了默认的loading图标
|
|
35
|
+
type: "circular",
|
|
36
|
+
direction: "horizontal"
|
|
37
|
+
});
|
|
38
|
+
var Loading = function Loading2(props) {
|
|
39
|
+
var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props), className = _defaultProps$props.className, style = _defaultProps$props.style, children = _defaultProps$props.children, direction = _defaultProps$props.direction, icon = _defaultProps$props.icon, rest = _objectWithoutProperties(_defaultProps$props, _excluded);
|
|
40
|
+
var classPrefix = "nut-loading";
|
|
41
|
+
var CurLoadingIcon = loadingMap[rest.type] || Loading1;
|
|
42
|
+
return React__default.createElement("div", {
|
|
43
|
+
className: classNames(classPrefix, className, direction === "vertical" ? "".concat(classPrefix, "-vertical") : ""),
|
|
44
|
+
style
|
|
45
|
+
}, React__default.createElement("div", {
|
|
46
|
+
className: "".concat(classPrefix, "-icon-box")
|
|
47
|
+
}, icon || React__default.createElement(CurLoadingIcon, {
|
|
48
|
+
className: "".concat(classPrefix, "-icon")
|
|
49
|
+
})), children ? React__default.createElement("div", {
|
|
50
|
+
className: "".concat(classPrefix, "-text")
|
|
51
|
+
}, children) : "");
|
|
52
|
+
};
|
|
53
|
+
Loading.defaultProps = defaultProps;
|
|
54
|
+
Loading.displayName = "NutLoading";
|
|
55
|
+
export {
|
|
56
|
+
Loading as default
|
|
57
|
+
};
|
|
@@ -159,7 +159,7 @@ var NumberKeyboard = function NumberKeyboard2(props) {
|
|
|
159
159
|
className: "".concat(classPrefix, "__header__title")
|
|
160
160
|
}, title), type === "default" && React__default.createElement("span", {
|
|
161
161
|
className: "".concat(classPrefix, "__header__close"),
|
|
162
|
-
onClick:
|
|
162
|
+
onClick: onConfirm
|
|
163
163
|
}, locale.done)), React__default.createElement("div", {
|
|
164
164
|
className: "".concat(classPrefix, "__body")
|
|
165
165
|
}, React__default.createElement("div", {
|
package/dist/esm/Popover.js
CHANGED
|
@@ -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", "list", "location", "visible", "offset", "targetId", "overlay", "closeOnOutsideClick", "closeOnActionClick", "className", "showArrow", "style", "onClick", "onOpen", "onClose", "onSelect"];
|
|
4
|
+
var _excluded = ["children", "list", "location", "visible", "offset", "arrowOffset", "targetId", "overlay", "closeOnOutsideClick", "closeOnActionClick", "className", "showArrow", "style", "onClick", "onOpen", "onClose", "onSelect"];
|
|
5
5
|
function ownKeys(object, enumerableOnly) {
|
|
6
6
|
var keys = Object.keys(object);
|
|
7
7
|
if (Object.getOwnPropertySymbols) {
|
|
@@ -35,6 +35,7 @@ var defaultProps = _objectSpread(_objectSpread({}, ComponentDefaults), {}, {
|
|
|
35
35
|
location: "bottom",
|
|
36
36
|
visible: false,
|
|
37
37
|
offset: [0, 12],
|
|
38
|
+
arrowOffset: 0,
|
|
38
39
|
targetId: "",
|
|
39
40
|
showArrow: true,
|
|
40
41
|
closeOnOutsideClick: true,
|
|
@@ -49,7 +50,7 @@ var defaultProps = _objectSpread(_objectSpread({}, ComponentDefaults), {}, {
|
|
|
49
50
|
});
|
|
50
51
|
var classPrefix = "nut-popover";
|
|
51
52
|
var Popover = function Popover2(props) {
|
|
52
|
-
var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props), children = _defaultProps$props.children, list = _defaultProps$props.list, location = _defaultProps$props.location, visible = _defaultProps$props.visible, offset = _defaultProps$props.offset, targetId = _defaultProps$props.targetId, overlay = _defaultProps$props.overlay, closeOnOutsideClick = _defaultProps$props.closeOnOutsideClick, closeOnActionClick = _defaultProps$props.closeOnActionClick, className = _defaultProps$props.className, showArrow = _defaultProps$props.showArrow, style = _defaultProps$props.style, onClick2 = _defaultProps$props.onClick, onOpen2 = _defaultProps$props.onOpen, onClose2 = _defaultProps$props.onClose, onSelect = _defaultProps$props.onSelect, rest = _objectWithoutProperties(_defaultProps$props, _excluded);
|
|
53
|
+
var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props), children = _defaultProps$props.children, list = _defaultProps$props.list, location = _defaultProps$props.location, visible = _defaultProps$props.visible, offset = _defaultProps$props.offset, arrowOffset = _defaultProps$props.arrowOffset, targetId = _defaultProps$props.targetId, overlay = _defaultProps$props.overlay, closeOnOutsideClick = _defaultProps$props.closeOnOutsideClick, closeOnActionClick = _defaultProps$props.closeOnActionClick, className = _defaultProps$props.className, showArrow = _defaultProps$props.showArrow, style = _defaultProps$props.style, onClick2 = _defaultProps$props.onClick, onOpen2 = _defaultProps$props.onOpen, onClose2 = _defaultProps$props.onClose, onSelect = _defaultProps$props.onSelect, rest = _objectWithoutProperties(_defaultProps$props, _excluded);
|
|
53
54
|
var popoverRef = useRef(null);
|
|
54
55
|
var popoverContentRef = useRef(null);
|
|
55
56
|
var _useState = useState(false), _useState2 = _slicedToArray(_useState, 2), showPopup = _useState2[0], setShowPopup = _useState2[1];
|
|
@@ -153,6 +154,37 @@ var Popover = function Popover2(props) {
|
|
|
153
154
|
}
|
|
154
155
|
return styles;
|
|
155
156
|
};
|
|
157
|
+
var popoverArrowStyle = function popoverArrowStyle2() {
|
|
158
|
+
var styles = {};
|
|
159
|
+
var direction = location.split("-")[0];
|
|
160
|
+
var skew = location.split("-")[1];
|
|
161
|
+
var base = 16;
|
|
162
|
+
if (props.arrowOffset !== 0) {
|
|
163
|
+
if (["bottom", "top"].includes(direction)) {
|
|
164
|
+
if (!skew) {
|
|
165
|
+
styles.left = "calc(50% + ".concat(arrowOffset, "px)");
|
|
166
|
+
}
|
|
167
|
+
if (skew === "start") {
|
|
168
|
+
styles.left = "".concat(base + arrowOffset, "px");
|
|
169
|
+
}
|
|
170
|
+
if (skew === "end") {
|
|
171
|
+
styles.right = "".concat(base - arrowOffset, "px");
|
|
172
|
+
}
|
|
173
|
+
}
|
|
174
|
+
if (["left", "right"].includes(direction)) {
|
|
175
|
+
if (!skew) {
|
|
176
|
+
styles.top = "calc(50% - ".concat(arrowOffset, "px)");
|
|
177
|
+
}
|
|
178
|
+
if (skew === "start") {
|
|
179
|
+
styles.top = "".concat(base - arrowOffset, "px");
|
|
180
|
+
}
|
|
181
|
+
if (skew === "end") {
|
|
182
|
+
styles.bottom = "".concat(base + arrowOffset, "px");
|
|
183
|
+
}
|
|
184
|
+
}
|
|
185
|
+
}
|
|
186
|
+
return styles;
|
|
187
|
+
};
|
|
156
188
|
var handleSelect = function handleSelect2(item, index) {
|
|
157
189
|
if (!item.disabled) {
|
|
158
190
|
onSelect && onSelect(item, index);
|
|
@@ -186,7 +218,8 @@ var Popover = function Popover2(props) {
|
|
|
186
218
|
className: "nut-popover-content-group",
|
|
187
219
|
ref: popoverContentRef
|
|
188
220
|
}, showArrow && React__default.createElement("div", {
|
|
189
|
-
className: popoverArrow()
|
|
221
|
+
className: popoverArrow(),
|
|
222
|
+
style: popoverArrowStyle()
|
|
190
223
|
}), Array.isArray(children) ? children[1] : "", list.map(function(item, index) {
|
|
191
224
|
return React__default.createElement("div", {
|
|
192
225
|
className: classNames({
|
package/dist/esm/Switch.js
CHANGED
|
@@ -1,5 +1,7 @@
|
|
|
1
1
|
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
|
|
2
|
+
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
|
|
2
3
|
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
4
|
+
var _excluded = ["checked", "defaultChecked", "disabled", "activeText", "inactiveText", "className", "style", "onChange"];
|
|
3
5
|
function ownKeys(object, enumerableOnly) {
|
|
4
6
|
var keys = Object.keys(object);
|
|
5
7
|
if (Object.getOwnPropertySymbols) {
|
|
@@ -30,7 +32,7 @@ var defaultProps = _objectSpread(_objectSpread({}, ComponentDefaults), {}, {
|
|
|
30
32
|
inactiveText: ""
|
|
31
33
|
});
|
|
32
34
|
var Switch = function Switch2(props) {
|
|
33
|
-
var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props), checked = _defaultProps$props.checked, defaultChecked = _defaultProps$props.defaultChecked, disabled = _defaultProps$props.disabled, activeText = _defaultProps$props.activeText, inactiveText = _defaultProps$props.inactiveText, className = _defaultProps$props.className, style = _defaultProps$props.style, onChange = _defaultProps$props.onChange;
|
|
35
|
+
var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props), checked = _defaultProps$props.checked, defaultChecked = _defaultProps$props.defaultChecked, disabled = _defaultProps$props.disabled, activeText = _defaultProps$props.activeText, inactiveText = _defaultProps$props.inactiveText, className = _defaultProps$props.className, style = _defaultProps$props.style, onChange = _defaultProps$props.onChange, rest = _objectWithoutProperties(_defaultProps$props, _excluded);
|
|
34
36
|
var classPrefix = "nut-switch";
|
|
35
37
|
var _usePropsValue = usePropsValue({
|
|
36
38
|
value: checked,
|
|
@@ -45,13 +47,13 @@ var Switch = function Switch2(props) {
|
|
|
45
47
|
onChange && onChange(!value, event);
|
|
46
48
|
setValue(!value);
|
|
47
49
|
};
|
|
48
|
-
return React__default.createElement("div", {
|
|
50
|
+
return React__default.createElement("div", _objectSpread({
|
|
49
51
|
className: classes(),
|
|
50
52
|
onClick: function onClick(e) {
|
|
51
53
|
return _onClick(e);
|
|
52
54
|
},
|
|
53
55
|
style
|
|
54
|
-
}, React__default.createElement("div", {
|
|
56
|
+
}, rest), React__default.createElement("div", {
|
|
55
57
|
className: "switch-button"
|
|
56
58
|
}, !value && React__default.createElement("div", {
|
|
57
59
|
className: "close-line"
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import './style.css'
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.nut-tour-mask{position:fixed;box-shadow:0 0 0 150vh #00000080;border-radius:var(--nutui-tour-mask-border-radius, 10px);z-index:999}.nut-tour-mask-none{box-shadow:none}.nut-tour-mask-hidden{opacity:0}.nut-tour-content{display:block;padding:var(--nutui-tour-content-padding, 10px 12px);min-width:var(--nutui-tour-content-min-width, 200px);box-sizing:content-box}.nut-tour-content-top{display:block;text-align:right}.nut-tour-content-top-close{--nut-icon-width: 10px;--nut-icon-height: 10px}.nut-tour-content-inner{margin:var(--nutui-tour-content-inner-margin, 10px 0px);font-size:var(--nutui-tour-content-inner-font-size, 14px);white-space:nowrap}.nut-tour-content-bottom{margin-top:var(--nutui-tour-content-bottom-margin-top, 10px);display:flex;justify-content:space-between}.nut-tour-content-bottom-operate{display:flex;justify-content:flex-end}.nut-tour-content-bottom-operate-btn{display:inline-block;border:1px solid var(--nutui-gray-3, #bfbfbf);margin-left:var(--nutui-tour-content-bottom-btn-margin-left, 4px);padding:var(--nutui-tour-content-bottom-btn-padding, 2px 4px);font-size:var(--nutui-tour-content-bottom-btn-font-size, 12px);border-radius:var(--nutui-tour-content-bottom-btn-border-radius, 4px);color:var(--nutui-gray-2, #757575)}.nut-tour-content-bottom-operate-btn.active{color:#fff;border:0;background:var(--nutui-brand-color, #fa2c19)}.nut-tour-content-tile .nut-tour-content-inner{margin:0}.nut-tour-masked{position:fixed;width:100vh;height:100vh;z-index:1000;top:0;left:0;background:transparent}
|
package/dist/esm/Tour.js
ADDED
|
@@ -0,0 +1,183 @@
|
|
|
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 = ["children", "className", "title", "closeOnOverlayClick", "showPrev", "list", "type", "location", "visible", "mask", "maskWidth", "maskHeight", "offset", "next", "prev", "complete", "onClose", "onChange"];
|
|
5
|
+
function ownKeys(object, enumerableOnly) {
|
|
6
|
+
var keys = Object.keys(object);
|
|
7
|
+
if (Object.getOwnPropertySymbols) {
|
|
8
|
+
var symbols = Object.getOwnPropertySymbols(object);
|
|
9
|
+
enumerableOnly && (symbols = symbols.filter(function(sym) {
|
|
10
|
+
return Object.getOwnPropertyDescriptor(object, sym).enumerable;
|
|
11
|
+
})), keys.push.apply(keys, symbols);
|
|
12
|
+
}
|
|
13
|
+
return keys;
|
|
14
|
+
}
|
|
15
|
+
function _objectSpread(target) {
|
|
16
|
+
for (var i = 1; i < arguments.length; i++) {
|
|
17
|
+
var source = null != arguments[i] ? arguments[i] : {};
|
|
18
|
+
i % 2 ? ownKeys(Object(source), true).forEach(function(key) {
|
|
19
|
+
_defineProperty(target, key, source[key]);
|
|
20
|
+
}) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function(key) {
|
|
21
|
+
Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
|
|
22
|
+
});
|
|
23
|
+
}
|
|
24
|
+
return target;
|
|
25
|
+
}
|
|
26
|
+
import React__default, { useState, useEffect } from "react";
|
|
27
|
+
import { Close } from "@nutui/icons-react";
|
|
28
|
+
import classNames from "classnames";
|
|
29
|
+
import Popover from "./Popover.js";
|
|
30
|
+
import { g as getRect } from "./use-client-rect.js";
|
|
31
|
+
import { C as ComponentDefaults } from "./typings.js";
|
|
32
|
+
import { useConfig } from "./ConfigProvider.js";
|
|
33
|
+
var defaultProps = _objectSpread(_objectSpread({}, ComponentDefaults), {}, {
|
|
34
|
+
visible: false,
|
|
35
|
+
type: "step",
|
|
36
|
+
location: "bottom",
|
|
37
|
+
mask: true,
|
|
38
|
+
maskWidth: "",
|
|
39
|
+
maskHeight: "",
|
|
40
|
+
offset: [8, 10],
|
|
41
|
+
title: "",
|
|
42
|
+
next: "",
|
|
43
|
+
prev: "",
|
|
44
|
+
complete: "",
|
|
45
|
+
showPrev: true,
|
|
46
|
+
closeOnOverlayClick: true
|
|
47
|
+
});
|
|
48
|
+
var classPrefix = "nut-tour";
|
|
49
|
+
var Tour = function Tour2(props) {
|
|
50
|
+
var _useConfig = useConfig(), locale = _useConfig.locale;
|
|
51
|
+
var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props), children = _defaultProps$props.children, className = _defaultProps$props.className, title = _defaultProps$props.title, closeOnOverlayClick = _defaultProps$props.closeOnOverlayClick, showPrev = _defaultProps$props.showPrev, list = _defaultProps$props.list, type = _defaultProps$props.type, location = _defaultProps$props.location, visible = _defaultProps$props.visible, mask = _defaultProps$props.mask, maskWidth = _defaultProps$props.maskWidth, maskHeight = _defaultProps$props.maskHeight, offset = _defaultProps$props.offset, next = _defaultProps$props.next, prev = _defaultProps$props.prev, complete = _defaultProps$props.complete, onClose = _defaultProps$props.onClose, onChange = _defaultProps$props.onChange, rest = _objectWithoutProperties(_defaultProps$props, _excluded);
|
|
52
|
+
var _useState = useState(false), _useState2 = _slicedToArray(_useState, 2), showTour = _useState2[0], setShowTour = _useState2[1];
|
|
53
|
+
var _useState3 = useState(false), _useState4 = _slicedToArray(_useState3, 2), showPopup = _useState4[0], setShowPopup = _useState4[1];
|
|
54
|
+
var _useState5 = useState(0), _useState6 = _slicedToArray(_useState5, 2), active = _useState6[0], setActive = _useState6[1];
|
|
55
|
+
var _useState7 = useState({
|
|
56
|
+
top: 0,
|
|
57
|
+
left: 0,
|
|
58
|
+
right: 0,
|
|
59
|
+
bottom: 0,
|
|
60
|
+
width: 0,
|
|
61
|
+
height: 0
|
|
62
|
+
}), _useState8 = _slicedToArray(_useState7, 2), maskRect = _useState8[0], setMaskRect = _useState8[1];
|
|
63
|
+
var classes = classNames(className, classPrefix);
|
|
64
|
+
useEffect(function() {
|
|
65
|
+
if (visible) {
|
|
66
|
+
getRootPosition();
|
|
67
|
+
}
|
|
68
|
+
setActive(0);
|
|
69
|
+
setShowTour(visible);
|
|
70
|
+
setShowPopup(visible);
|
|
71
|
+
}, [visible]);
|
|
72
|
+
useEffect(function() {
|
|
73
|
+
if (visible) {
|
|
74
|
+
setShowPopup(true);
|
|
75
|
+
getRootPosition();
|
|
76
|
+
}
|
|
77
|
+
}, [active]);
|
|
78
|
+
var getRootPosition = function getRootPosition2() {
|
|
79
|
+
var el = document.querySelector("#".concat(list[active].target));
|
|
80
|
+
var rect = getRect(el);
|
|
81
|
+
setMaskRect(rect);
|
|
82
|
+
};
|
|
83
|
+
var maskStyle = function maskStyle2() {
|
|
84
|
+
var width = maskRect.width, height = maskRect.height, left = maskRect.left, top = maskRect.top;
|
|
85
|
+
var center = [left + width / 2, top + height / 2];
|
|
86
|
+
var w = Number(maskWidth || width);
|
|
87
|
+
var h = Number(maskHeight || height);
|
|
88
|
+
var styles = {
|
|
89
|
+
width: "".concat(w + +offset[1] * 2, "px"),
|
|
90
|
+
height: "".concat(h + +offset[0] * 2, "px"),
|
|
91
|
+
top: "".concat(center[1] - h / 2 - +offset[0], "px"),
|
|
92
|
+
left: "".concat(center[0] - w / 2 - +offset[1], "px")
|
|
93
|
+
};
|
|
94
|
+
return styles;
|
|
95
|
+
};
|
|
96
|
+
var maskClose = function maskClose2(e) {
|
|
97
|
+
setShowTour(false);
|
|
98
|
+
setShowPopup(false);
|
|
99
|
+
onClose && onClose(e);
|
|
100
|
+
};
|
|
101
|
+
var handleClickMask = function handleClickMask2(e) {
|
|
102
|
+
closeOnOverlayClick && maskClose(e);
|
|
103
|
+
};
|
|
104
|
+
var changeStep = function changeStep2(type2) {
|
|
105
|
+
if (type2 === "next") {
|
|
106
|
+
setActive(active + 1);
|
|
107
|
+
onChange && onChange(active + 1);
|
|
108
|
+
} else {
|
|
109
|
+
setActive(active - 1);
|
|
110
|
+
onChange && onChange(active - 1);
|
|
111
|
+
}
|
|
112
|
+
setShowPopup(false);
|
|
113
|
+
};
|
|
114
|
+
return React__default.createElement("div", _objectSpread({
|
|
115
|
+
className: classes
|
|
116
|
+
}, rest), React__default.createElement("div", {
|
|
117
|
+
className: "nut-tour-masked",
|
|
118
|
+
style: {
|
|
119
|
+
display: showTour ? "block" : "none"
|
|
120
|
+
},
|
|
121
|
+
onClick: handleClickMask
|
|
122
|
+
}), list.map(function(item, index) {
|
|
123
|
+
return React__default.createElement("div", {
|
|
124
|
+
key: index,
|
|
125
|
+
style: {
|
|
126
|
+
height: 0
|
|
127
|
+
}
|
|
128
|
+
}, index === active && React__default.createElement(React__default.Fragment, null, showTour && React__default.createElement("div", {
|
|
129
|
+
className: "".concat(mask ? "nut-tour-mask" : "nut-tour-mask nut-tour-mask-none"),
|
|
130
|
+
id: "nut-tour-popid",
|
|
131
|
+
style: maskStyle()
|
|
132
|
+
}), React__default.createElement(Popover, {
|
|
133
|
+
visible: showPopup,
|
|
134
|
+
location: item.location || location,
|
|
135
|
+
targetId: "nut-tour-popid",
|
|
136
|
+
closeOnOutsideClick: false,
|
|
137
|
+
offset: item.popoverOffset || [0, 12],
|
|
138
|
+
arrowOffset: item.arrowOffset || 0
|
|
139
|
+
}, React__default.createElement(React__default.Fragment, null), React__default.createElement(React__default.Fragment, null, children || React__default.createElement(React__default.Fragment, null, type === "step" && React__default.createElement("div", {
|
|
140
|
+
className: "nut-tour-content"
|
|
141
|
+
}, title && React__default.createElement("div", {
|
|
142
|
+
className: "nut-tour-content-top"
|
|
143
|
+
}, React__default.createElement("div", {
|
|
144
|
+
onClick: function onClick(e) {
|
|
145
|
+
return maskClose(e);
|
|
146
|
+
}
|
|
147
|
+
}, React__default.createElement(Close, {
|
|
148
|
+
className: "nut-tour-content-top-close"
|
|
149
|
+
}))), React__default.createElement("div", {
|
|
150
|
+
className: "nut-tour-content-inner"
|
|
151
|
+
}, item.content), React__default.createElement("div", {
|
|
152
|
+
className: "nut-tour-content-bottom"
|
|
153
|
+
}, React__default.createElement("div", {
|
|
154
|
+
className: "nut-tour-content-bottom-init"
|
|
155
|
+
}, active + 1, "/", list.length), React__default.createElement("div", {
|
|
156
|
+
className: "nut-tour-content-bottom-operate"
|
|
157
|
+
}, active !== 0 && showPrev && React__default.createElement("div", {
|
|
158
|
+
className: "nut-tour-content-bottom-operate-btn",
|
|
159
|
+
onClick: function onClick() {
|
|
160
|
+
return changeStep("prev");
|
|
161
|
+
}
|
|
162
|
+
}, prev || locale.tour.prevStepText), list.length - 1 === active && React__default.createElement("div", {
|
|
163
|
+
className: "nut-tour-content-bottom-operate-btn active",
|
|
164
|
+
onClick: function onClick(e) {
|
|
165
|
+
return maskClose(e);
|
|
166
|
+
}
|
|
167
|
+
}, complete || locale.tour.completeText), list.length - 1 !== active && React__default.createElement("div", {
|
|
168
|
+
className: "nut-tour-content-bottom-operate-btn active",
|
|
169
|
+
onClick: function onClick() {
|
|
170
|
+
return changeStep("next");
|
|
171
|
+
}
|
|
172
|
+
}, next || locale.tour.nextStepText)))), type === "tile" && React__default.createElement("div", {
|
|
173
|
+
className: "nut-tour-content nut-tour-content-tile"
|
|
174
|
+
}, React__default.createElement("div", {
|
|
175
|
+
className: "nut-tour-content-inner"
|
|
176
|
+
}, item.content)))))));
|
|
177
|
+
}));
|
|
178
|
+
};
|
|
179
|
+
Tour.defaultProps = defaultProps;
|
|
180
|
+
Tour.displayName = "NutTour";
|
|
181
|
+
export {
|
|
182
|
+
Tour as default
|
|
183
|
+
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.nut-progress{display:flex;align-items:center;position:relative;width:100%}.nut-progress-outer{flex:auto;border-radius:var(--nutui-progress-border-radius, 12px);height:var(--nutui-progress-height, 10px);background:var(--nutui-progress-background, #f3f3f3)}.nut-progress-outer .nut-progress-active:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;border-radius:var(--nutui-progress-border-radius, 12px);animation:progressActive 2s ease-in-out infinite}.nut-progress-inner{height:100%;display:flex;flex-direction:column;justify-content:center;transition:all .4s;border-radius:var(--nutui-progress-border-radius, 12px);background:var(--nutui-progress-color, linear-gradient(135deg, #fa2c19 0%, #fa6419 100%))}.nut-progress-text{display:flex;align-items:center;position:absolute;top:var(--nutui-progress-text-position-top, -4px);bottom:var(--nutui-progress-text-position-bottom, -4px);transition:all .4s;transform:translate(-50%)}.nut-progress-text__inner{display:flex;align-items:center;height:100%;width:100%;color:var(--nutui-progress-text-color, var(--nutui-brand-text-color, #ffffff));padding:var(--nutui-progress-text-padding, 0 5px);border-radius:var(--nutui-progress-text-border-radius, 5px);font-size:var(--nutui-progress-text-font-size, 9px);line-height:1;background:var(--nutui-progress-text-background, var(--nutui-progress-color, linear-gradient(135deg, #fa2c19 0%, #fa6419 100%)))}@keyframes progressActive{0%{background:rgba(255,255,255,.1);width:0}20%{background:rgba(255,255,255,.5);width:0}to{background:rgba(255,255,255,0);width:100%}}.nut-uploader{position:relative;display:flex;flex-wrap:wrap}.nut-uploader__slot{position:relative}.nut-uploader__upload{position:relative;display:flex;align-items:center;justify-content:center;background:var(--nutui-uploader-background, var(--nutui-gray-4, #f4f4f4));width:var(--nutui-uploader-picture-width, 100px);height:var(--nutui-uploader-picture-height, 100px);border:var(--nutui-uploader-picture-border, 0px);border-radius:var(--nutui-uploader-picture-border-radius, 2px)}.nut-uploader__icon{display:flex;flex-direction:column;justify-content:center;align-items:center}.nut-uploader__icon i{opacity:var(--nutui-uploader-picture-icon-opacity, .7);margin-bottom:var(--nutui-uploader-picture-icon-margin-bottom, 6px)}.nut-uploader__icon-tip{font-size:var(--nutui-uploader-picture-icon-tip-font-size, 12px);color:var(--nutui-uploader-picture-icon-tip-color, #bfbfbf)}.nut-uploader__input{position:absolute!important;top:0;left:0;width:100%!important;height:100%!important;overflow:hidden;cursor:pointer!important;opacity:0}.nut-uploader__input:disabled{cursor:not-allowed}.nut-uploader__upload-disabled{background:var(--nutui-uploader-background-disabled, var(--nutui-gray-4, #f4f4f4))}.nut-uploader__upload-disabled .nut-uploader__icon i{opacity:var(--nutui-uploader-picture-icon-opacity-disabled, .3);margin-bottom:var(--nutui-uploader-picture-icon-margin-bottom, 6px)}.nut-uploader__preview{position:relative;margin-right:var(--nutui-uploader-preview-margin-right, 10px);margin-bottom:var(--nutui-uploader-preview-margin-bottom, 10px);box-shadow:0 2px 10px #0000001a}.nut-uploader__preview__progress{position:absolute;left:0;top:0;display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:100%;background:var(--nutui-uploader-preview-progress-background, rgba(0, 0, 0, .65));border-radius:var(--nutui-uploader-picture-border-radius, 2px)}.nut-uploader__preview__progress i{margin-bottom:var(--nutui-uploader-picture-icon-margin-bottom, 6px)}.nut-uploader__preview__progress__msg{color:#fff;font-size:12px}.nut-uploader__preview.list{width:100%;margin-right:0;margin-bottom:0;margin-top:10px}.nut-uploader__preview-list{width:100%;height:32px;display:flex;flex-direction:column;position:relative;background-color:var(--nutui-gray-5, #f8f8f8)}.nut-uploader__preview-list .nut-uploader__preview-img__file__name{-webkit-line-clamp:1;padding:2px;height:24px}.nut-uploader__preview-list .nut-uploader__preview-img__file__del{position:absolute;right:4px;top:6px}.nut-uploader__preview-list .nut-progress{position:absolute;left:0;right:0;bottom:0}.nut-uploader__preview-list .nut-progress .nut-progress-outer{height:2px!important}.nut-uploader__preview .close{position:absolute;right:var(--nutui-uploader-preview-close-right, 0px);top:var(--nutui-uploader-preview-close-top, 0px);transform:translate(50%,-50%)}.nut-uploader__preview-img{position:relative;width:var(--nutui-uploader-picture-width, 100px);height:var(--nutui-uploader-picture-height, 100px);border-radius:var(--nutui-uploader-picture-border-radius, 2px)}.nut-uploader__preview-img i{color:var(--nutui-gray-1, #1a1a1a)}.nut-uploader__preview-img .tips{position:absolute;bottom:0;left:0;font-size:12px;color:var(--nutui-gray-6, #ffffff);text-align:center;box-sizing:border-box;height:var(--nutui-uploader-preview-tips-height, 24px);line-height:var(--nutui-uploader-preview-tips-height, 24px);border-radius:var(--nutui-uploader-picture-border-radius, 2px);border-top-left-radius:0;border-top-right-radius:0;padding:var(--nutui-uploader-preview-tips-padding, 0 5px);background:var(--nutui-uploader-preview-tips-background, rgba(0, 0, 0, .45));width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.nut-uploader__preview-img__c{width:100%;height:100%;border-radius:6px}.nut-uploader__preview-img__file{height:100%;width:100%;display:flex;align-items:center;justify-content:center;transition:all .3s}.nut-uploader__preview-img__file__name{display:flex;width:100%;font-size:12px;color:var(--nutui-gray-2, #757575);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;word-break:break-all}.nut-uploader__preview-img__file__name.error{color:red!important}.nut-uploader__preview-img__file__name.success{color:#1890ff!important}.nut-uploader__preview-img__file__name .nut-icon-link:before{margin-left:-25%;margin-top:-25%;transform:none}
|
|
1
|
+
.nut-progress{display:flex;align-items:center;position:relative;width:100%}.nut-progress-outer{flex:auto;border-radius:var(--nutui-progress-border-radius, 12px);height:var(--nutui-progress-height, 10px);background:var(--nutui-progress-background, #f3f3f3)}.nut-progress-outer .nut-progress-active:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;border-radius:var(--nutui-progress-border-radius, 12px);animation:progressActive 2s ease-in-out infinite}.nut-progress-inner{height:100%;display:flex;flex-direction:column;justify-content:center;transition:all .4s;border-radius:var(--nutui-progress-border-radius, 12px);background:var(--nutui-progress-color, linear-gradient(135deg, #fa2c19 0%, #fa6419 100%))}.nut-progress-text{display:flex;align-items:center;position:absolute;top:var(--nutui-progress-text-position-top, -4px);bottom:var(--nutui-progress-text-position-bottom, -4px);transition:all .4s;transform:translate(-50%)}.nut-progress-text__inner{display:flex;align-items:center;height:100%;width:100%;color:var(--nutui-progress-text-color, var(--nutui-brand-text-color, #ffffff));padding:var(--nutui-progress-text-padding, 0 5px);border-radius:var(--nutui-progress-text-border-radius, 5px);font-size:var(--nutui-progress-text-font-size, 9px);line-height:1;background:var(--nutui-progress-text-background, var(--nutui-progress-color, linear-gradient(135deg, #fa2c19 0%, #fa6419 100%)))}@keyframes progressActive{0%{background:rgba(255,255,255,.1);width:0}20%{background:rgba(255,255,255,.5);width:0}to{background:rgba(255,255,255,0);width:100%}}.nut-uploader{position:relative;display:flex;flex-wrap:wrap}.nut-uploader__slot{position:relative}.nut-uploader__upload{position:relative;display:flex;align-items:center;justify-content:center;background:var(--nutui-uploader-background, var(--nutui-gray-4, #f4f4f4));width:var(--nutui-uploader-picture-width, 100px);height:var(--nutui-uploader-picture-height, 100px);border:var(--nutui-uploader-picture-border, 0px);border-radius:var(--nutui-uploader-picture-border-radius, 2px)}.nut-uploader__icon{display:flex;flex-direction:column;justify-content:center;align-items:center}.nut-uploader__icon i{opacity:var(--nutui-uploader-picture-icon-opacity, .7);margin-bottom:var(--nutui-uploader-picture-icon-margin-bottom, 6px)}.nut-uploader__icon-tip{font-size:var(--nutui-uploader-picture-icon-tip-font-size, 12px);color:var(--nutui-uploader-picture-icon-tip-color, #bfbfbf)}.nut-uploader__input{position:absolute!important;top:0;left:0;width:100%!important;height:100%!important;overflow:hidden;cursor:pointer!important;opacity:0}.nut-uploader__input:disabled{cursor:not-allowed}.nut-uploader__upload-disabled{background:var(--nutui-uploader-background-disabled, var(--nutui-gray-4, #f4f4f4))}.nut-uploader__upload-disabled .nut-uploader__icon i{opacity:var(--nutui-uploader-picture-icon-opacity-disabled, .3);margin-bottom:var(--nutui-uploader-picture-icon-margin-bottom, 6px)}.nut-uploader__preview{position:relative;margin-right:var(--nutui-uploader-preview-margin-right, 10px);margin-bottom:var(--nutui-uploader-preview-margin-bottom, 10px);box-shadow:0 2px 10px #0000001a}.nut-uploader__preview__progress{position:absolute;left:0;top:0;display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:100%;background:var(--nutui-uploader-preview-progress-background, rgba(0, 0, 0, .65));border-radius:var(--nutui-uploader-picture-border-radius, 2px)}.nut-uploader__preview__progress i{margin-bottom:var(--nutui-uploader-picture-icon-margin-bottom, 6px)}.nut-uploader__preview__progress__msg{color:#fff;font-size:12px}.nut-uploader__preview.list{width:100%;margin-right:0;margin-bottom:0;margin-top:10px}.nut-uploader__preview-list{width:100%;height:32px;display:flex;flex-direction:column;position:relative;background-color:var(--nutui-gray-5, #f8f8f8)}.nut-uploader__preview-list .nut-uploader__preview-img__file__name{-webkit-line-clamp:1;padding:2px;height:24px}.nut-uploader__preview-list .nut-uploader__preview-img__file__del{position:absolute;right:4px;top:6px}.nut-uploader__preview-list .nut-progress{position:absolute;left:0;right:0;bottom:0}.nut-uploader__preview-list .nut-progress .nut-progress-outer{height:2px!important}.nut-uploader__preview .close{position:absolute;right:var(--nutui-uploader-preview-close-right, 0px);top:var(--nutui-uploader-preview-close-top, 0px);transform:translate(50%,-50%)}.nut-uploader__preview-img{position:relative;width:var(--nutui-uploader-picture-width, 100px);height:var(--nutui-uploader-picture-height, 100px);border-radius:var(--nutui-uploader-picture-border-radius, 2px)}.nut-uploader__preview-img i{color:var(--nutui-gray-1, #1a1a1a)}.nut-uploader__preview-img .tips{position:absolute;bottom:0;left:0;font-size:12px;color:var(--nutui-gray-6, #ffffff);text-align:center;box-sizing:border-box;height:var(--nutui-uploader-preview-tips-height, 24px);line-height:var(--nutui-uploader-preview-tips-height, 24px);border-radius:var(--nutui-uploader-picture-border-radius, 2px);border-top-left-radius:0;border-top-right-radius:0;padding:var(--nutui-uploader-preview-tips-padding, 0 5px);background:var(--nutui-uploader-preview-tips-background, rgba(0, 0, 0, .45));width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.nut-uploader__preview-img__c{width:100%;height:100%;position:initial;border-radius:6px}.nut-uploader__preview-img__file{height:100%;width:100%;display:flex;align-items:center;justify-content:center;transition:all .3s}.nut-uploader__preview-img__file__name{display:flex;width:100%;font-size:12px;color:var(--nutui-gray-2, #757575);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;word-break:break-all}.nut-uploader__preview-img__file__name.error{color:red!important}.nut-uploader__preview-img__file__name.success{color:#1890ff!important}.nut-uploader__preview-img__file__name .nut-icon-link:before{margin-left:-25%;margin-top:-25%;transform:none}
|
package/dist/esm/Uploader.js
CHANGED
|
@@ -410,7 +410,7 @@ var InternalUploader = function InternalUploader2(props, ref) {
|
|
|
410
410
|
disabled,
|
|
411
411
|
multiple,
|
|
412
412
|
onChange: fileChange
|
|
413
|
-
})))), fileList.length !== 0 && fileList.map(function(item, index) {
|
|
413
|
+
})))), fileList.length !== 0 && Array.isArray(fileList) && fileList.map(function(item, index) {
|
|
414
414
|
return React__default.createElement("div", {
|
|
415
415
|
className: "nut-uploader__preview ".concat(previewType),
|
|
416
416
|
key: item.uid
|
|
@@ -1099,6 +1099,11 @@ var zhCN = {
|
|
|
1099
1099
|
refreshingText: "加载中...",
|
|
1100
1100
|
completeText: "刷新成功"
|
|
1101
1101
|
},
|
|
1102
|
+
tour: {
|
|
1103
|
+
prevStepText: "上一步",
|
|
1104
|
+
completeText: "完成",
|
|
1105
|
+
nextStepText: "下一步"
|
|
1106
|
+
},
|
|
1102
1107
|
watermark: {
|
|
1103
1108
|
errorCanvasTips: "当前环境不支持Canvas"
|
|
1104
1109
|
}
|