@nutui/nutui-react-taro 3.0.0-beta.8 → 3.0.0

package/dist/es/packages/tour/tour.d.ts

@@ -23,10 +23,10 @@ export interface TourProps extends BasicComponent {
     */
     type: TourType
     /**
-    * 弹出层位置,同 Popopver 的[location 属性](https://nutui.jd.com/h5/react/2x/#/zh-CN/component/popover)
+    * 弹出层位置,同 Popopver 的[location 属性](#/zh-CN/component/popover)
     * @default bottom
     */
-    location: PopoverLocation | string
+    location: PopoverLocation
     /**
     * 是否显示镂空遮罩
     * @default true
@@ -78,7 +78,7 @@ export interface TourProps extends BasicComponent {
     */
     showPrev: boolean
     /**
-    * 是否在点击镂空遮罩层后关闭,同 Popopver 的[closeOnClickOverlay 属性](https://nutui.jd.com/h5/react/2x/#/zh-CN/component/popover)
+    * 是否在点击镂空遮罩层后关闭,同 Popopver 的[closeOnClickOverlay 属性](#/zh-CN/component/popover)
     * @default true
     */
     closeOnOverlayClick: boolean

package/dist/es/packages/tour/tour.js

@@ -6,9 +6,9 @@ import { Close } from "@nutui/icons-react-taro";
 import classNames from "classnames";
 import { View } from "@tarojs/components";
 import Popover from "../popover/index";
-import { getTaroRectById } from "../../utils/use-taro-rect";
+import { getTaroRectById } from "../../hooks/use-taro-rect";
 import { ComponentDefaults } from "../../utils/typings";
-import { useConfig } from "../configprovider";
+import { useConfig } from "../configprovider/index";
 var defaultProps = _object_spread_props(_object_spread({}, ComponentDefaults), {
     visible: false,
     type: 'step',

package/dist/es/packages/trendarrow/style/style.harmony.css

@@ -0,0 +1,42 @@
+/* #ifdef harmony */
+/* #endif */
+/* #ifndef harmony */
+/* #endif */
+.nut-trendarrow {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  color: #1a1a1a;
+  font-size: 14px;
+}
+.nut-trendarrow-icon-before {
+  margin-right: 4px;
+}
+.nut-trendarrow-icon-after {
+  margin-left: 4px;
+}
+.nut-trendarrow-rate {
+  vertical-align: middle;
+  display: inline;
+}
+.nut-trendarrow .nut-icon {
+  vertical-align: middle;
+}
+
+[dir=rtl] .nut-trendarrow-icon-before {
+  margin-right: 0;
+  margin-left: 4px;
+}
+
+.nut-rtl .nut-trendarrow-icon-before {
+  margin-right: 0;
+  margin-left: 4px;
+}
+[dir=rtl] .nut-trendarrow-icon-after {
+  margin-left: 0;
+  margin-right: 4px;
+}
+.nut-rtl .nut-trendarrow-icon-after {
+  margin-left: 0;
+  margin-right: 4px;
+}

package/dist/es/packages/uploader/index.d.ts

@@ -1,4 +1,4 @@
 import { Uploader } from "./uploader";
 export type { UploaderProps } from "./uploader";
-export type { FileType, FileItem, FileItemStatus } from "./file-item";
+export type { FileType, FileItem, FileItemStatus } from './types';
 export default Uploader;

package/dist/es/packages/uploader/preview.js

@@ -1,12 +1,12 @@
 import React from "react";
 import { Del, Failure, Link as LinkIcon, Loading } from "@nutui/icons-react-taro";
-import { Image, View } from "@tarojs/components";
-import Progress from "../progress/index";
-import { ERROR } from "./utils";
+import { View } from "@tarojs/components";
+import { Image } from "../image/image";
+import { Progress } from "../progress/progress";
 export var Preview = function(param) {
     var fileList = param.fileList, previewType = param.previewType, deletable = param.deletable, onDeleteItem = param.onDeleteItem, handleItemClick = param.handleItemClick, previewUrl = param.previewUrl, deleteIcon = param.deleteIcon, children = param.children;
     var renderIcon = function(item) {
-        if (item.status === ERROR) {
+        if (item.status === 'error') {
             return item.failIcon || /*#__PURE__*/ React.createElement(Failure, {
                 color: "#fff"
             });
@@ -17,38 +17,37 @@ export var Preview = function(param) {
         });
     };
     return /*#__PURE__*/ React.createElement(React.Fragment, null, fileList.length !== 0 && fileList.map(function(item, index) {
-        var _item_type;
+        var _item_status = item.status, status = _item_status === void 0 ? 'success' : _item_status, _item_uid = item.uid, uid = _item_uid === void 0 ? index : _item_uid, url = item.url, _item_message = item.message, message = _item_message === void 0 ? '' : _item_message, _item_name = item.name, name = _item_name === void 0 ? '' : _item_name, _item_type = item.type, type = _item_type === void 0 ? 'image' : _item_type;
         return /*#__PURE__*/ React.createElement(View, {
             className: "nut-uploader-preview ".concat(previewType),
-            key: item.uid
+            key: uid
         }, previewType === 'picture' && !children && deletable && /*#__PURE__*/ React.createElement(View, {
-            className: "close",
             onClick: function() {
                 return onDeleteItem(item, index);
-            }
+            },
+            className: "close"
         }, deleteIcon), previewType === 'picture' && !children && /*#__PURE__*/ React.createElement(View, {
             className: "nut-uploader-preview-img"
-        }, item.status === 'ready' ? /*#__PURE__*/ React.createElement(View, {
+        }, status === 'ready' ? /*#__PURE__*/ React.createElement(View, {
             className: "nut-uploader-preview-progress"
         }, /*#__PURE__*/ React.createElement(View, {
             className: "nut-uploader-preview-progress-msg"
-        }, item.message)) : item.status !== 'success' && /*#__PURE__*/ React.createElement(View, {
-            className: "nut-uploader-preview-progress"
+        }, message)) : status !== 'success' && /*#__PURE__*/ React.createElement(View, {
+            className: "nut-uploader-preview-progress",
+            style: {
+                zIndex: 10
+            }
         }, renderIcon(item), /*#__PURE__*/ React.createElement(View, {
             className: "nut-uploader-preview-progress-msg"
-        }, item.message)), ((_item_type = item.type) === null || _item_type === void 0 ? void 0 : _item_type.includes('image')) ? /*#__PURE__*/ React.createElement(React.Fragment, null, item.url && /*#__PURE__*/ React.createElement(Image, {
+        }, message)), type.includes('image') ? /*#__PURE__*/ React.createElement(React.Fragment, null, url && /*#__PURE__*/ React.createElement(Image, {
             className: "nut-uploader-preview-img-c",
-            style: {
-                objectFit: 'fill'
-            },
-            mode: "aspectFit",
-            src: item.url,
+            src: url,
+            mode: "aspectFill",
             onClick: function() {
                 return handleItemClick(item, index);
             }
         })) : /*#__PURE__*/ React.createElement(React.Fragment, null, previewUrl ? /*#__PURE__*/ React.createElement(Image, {
             className: "nut-uploader-preview-img-c",
-            mode: "aspectFit",
             src: previewUrl,
             onClick: function() {
                 return handleItemClick(item, index);
@@ -62,22 +61,24 @@ export var Preview = function(param) {
             className: "nut-uploader-preview-img-file-name"
         }, /*#__PURE__*/ React.createElement(LinkIcon, {
             color: "#808080"
-        }), /*#__PURE__*/ React.createElement("span", null, "\xa0", item.name)))), item.status === 'success' ? /*#__PURE__*/ React.createElement(View, {
+        }), /*#__PURE__*/ React.createElement("span", null, "\xa0", name)))), status === 'success' && name ? /*#__PURE__*/ React.createElement(View, {
             className: "tips"
-        }, item.name) : null), previewType === 'list' && /*#__PURE__*/ React.createElement(View, {
+        }, name) : null), previewType === 'list' && /*#__PURE__*/ React.createElement(View, {
             className: "nut-uploader-preview-list"
         }, /*#__PURE__*/ React.createElement(View, {
-            className: "nut-uploader-preview-img-file-name ".concat(item.status),
+            className: "nut-uploader-preview-img-file-name ".concat(status),
             onClick: function() {
                 return handleItemClick(item, index);
             }
-        }, /*#__PURE__*/ React.createElement(LinkIcon, null), /*#__PURE__*/ React.createElement("span", null, "\xa0", item.name)), deletable && /*#__PURE__*/ React.createElement(Del, {
+        }, /*#__PURE__*/ React.createElement(LinkIcon, null), /*#__PURE__*/ React.createElement("span", {
+            className: "nut-uploader-preview-img-file-name ".concat(status)
+        }, "\xa0", name)), deletable && /*#__PURE__*/ React.createElement(Del, {
             color: "#808080",
             className: "nut-uploader-preview-img-file-del",
             onClick: function() {
                 return onDeleteItem(item, index);
             }
-        }), item.status === 'uploading' && /*#__PURE__*/ React.createElement(Progress, {
+        }), item.status === 'uploading' && item.percentage && /*#__PURE__*/ React.createElement(Progress, {
             percent: item.percentage,
             color: "linear-gradient(270deg, rgba(18,126,255,1) 0%,rgba(32,147,255,1) 32.815625%,rgba(13,242,204,1) 100%)",
             showText: false

package/dist/es/packages/uploader/style/style.css

@@ -12,7 +12,7 @@
   flex: auto;
   border-radius: var(--nutui-progress-border-radius, 12px);
   height: var(--nutui-progress-height, 10px);
-  background: var(--nutui-progress-background, var(--nutui-color-background, #f5f6fa));
+  background: var(--nutui-progress-background, var(--nutui-color-background, #f2f3f5));
 }
 .nut-progress-outer .nut-progress-active:before {
   content: "";
@@ -49,7 +49,7 @@
   align-items: center;
   height: 100%;
   width: 100%;
-  color: var(--nutui-progress-text-color, var(--nutui-color-primary-text, #ffffff));
+  color: var(--nutui-progress-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);
@@ -89,7 +89,7 @@
   display: flex;
   align-items: center;
   justify-content: center;
-  background: var(--nutui-uploader-background, var(--nutui-color-background, #f5f6fa));
+  background: var(--nutui-uploader-background, var(--nutui-color-background, #f2f3f5));
   width: var(--nutui-uploader-image-width, 100px);
   height: var(--nutui-uploader-image-height, 100px);
   border: var(--nutui-uploader-image-border, 0px);
@@ -124,7 +124,7 @@
   cursor: not-allowed;
 }
 .nut-uploader-upload-disabled {
-  background: var(--nutui-uploader-background-disabled, var(--nutui-color-background, #f5f6fa));
+  background: var(--nutui-uploader-background-disabled, var(--nutui-color-background, #f2f3f5));
   color: var(--nutui-uploader-image-disabled, var(--nutui-color-text-disabled, #c2c4cc));
 }
 .nut-uploader-upload-disabled .nut-uploader-icon i,

package/dist/es/packages/uploader/style/style.harmony.css

@@ -0,0 +1,241 @@
+/* #ifdef harmony */
+/* #endif */
+/* #ifndef harmony */
+/* #endif */
+.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: #f2f3f5;
+  width: 100px;
+  height: 100px;
+  border: 0px;
+  border-radius: 4px;
+}
+.nut-uploader-icon {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  color: #888b94;
+}
+.nut-uploader-icon i {
+  color: #888b94;
+  margin-bottom: 6px;
+}
+.nut-uploader-icon .nut-icon {
+  color: #888b94;
+  margin-bottom: 6px;
+}
+.nut-uploader-icon-tip {
+  font-size: 12px;
+}
+.nut-uploader-input {
+  position: absolute !important;
+  top: 0;
+  left: 0;
+  width: 100% !important;
+  height: 100% !important;
+  overflow: hidden;
+  cursor: pointer;
+  opacity: 0;
+}
+.nut-uploader-input:disabled {
+  cursor: not-allowed;
+}
+.nut-uploader-upload-disabled {
+  background: #f2f3f5;
+  color: #c2c4cc;
+}
+.nut-uploader-upload-disabled .nut-uploader-icon i {
+  color: #c2c4cc;
+  margin-bottom: 6px;
+}
+.nut-uploader-upload-disabled .nut-uploader-icon .nut-icon {
+  color: #c2c4cc;
+  margin-bottom: 6px;
+}
+.nut-uploader-preview {
+  position: relative;
+  margin-right: 10px;
+  margin-bottom: 10px;
+  border-radius: 4px;
+  box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.1);
+}
+.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: rgba(0, 0, 0, 0.7);
+  border-radius: 4px;
+}
+.nut-uploader-preview-progress i {
+  margin-bottom: 6px;
+}
+.nut-uploader-preview-progress-msg {
+  color: #888b94;
+  font-size: 12px;
+}
+.nut-uploader-preview.list {
+  width: 100%;
+  margin-right: 0px;
+  margin-bottom: 0px;
+  margin-top: 10px;
+  box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.01);
+}
+.nut-uploader-preview-list {
+  width: 100%;
+  height: 32px;
+  box-sizing: border-box;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 0 10px;
+  background-color: #f7f8fc;
+}
+.nut-uploader-preview-list .nut-uploader-preview-img-file-name {
+  display: flex;
+  align-items: center;
+  -webkit-line-clamp: 1;
+  padding: 2px;
+  height: 24px;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+.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: 0px;
+  top: 0px;
+  transform: translate(50%, -50%);
+  z-index: 1;
+}
+.nut-uploader-preview-img {
+  position: relative;
+  width: 100px;
+  height: 100px;
+  border-radius: 4px;
+  overflow: hidden;
+}
+.nut-uploader-preview-img i {
+  color: #1a1a1a;
+}
+.nut-uploader-preview-img .tips {
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  font-size: 12px;
+  color: #ffffff;
+  text-align: center;
+  box-sizing: border-box;
+  height: 24px;
+  line-height: 24px;
+  border-radius: 4px;
+  border-top-left-radius: 0;
+  border-top-right-radius: 0;
+  padding: 0 5px;
+  background: rgba(0, 0, 0, 0.4);
+  width: 100%;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.nut-uploader-preview-img-c {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  height: 100%;
+  position: initial;
+  border-radius: 4px;
+}
+.nut-uploader-preview-img-file {
+  height: 100%;
+  width: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  transition: all 0.3s;
+}
+.nut-uploader-preview-img-file-name {
+  display: flex;
+  width: 90%;
+  font-size: 12px;
+  color: #505259;
+  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 {
+  flex-shrink: 0;
+}
+
+[dir=rtl] .nut-uploader-input,
+.nut-rtl .nut-uploader-input {
+  left: auto;
+  right: 0;
+}
+[dir=rtl] .nut-uploader-preview {
+  margin-right: 0;
+  margin-left: 10px;
+}
+.nut-rtl .nut-uploader-preview {
+  margin-right: 0;
+  margin-left: 10px;
+}
+[dir=rtl] .nut-uploader-preview-progress,
+.nut-rtl .nut-uploader-preview-progress {
+  left: auto;
+  right: 0;
+}
+[dir=rtl] .nut-uploader-preview.list,
+.nut-rtl .nut-uploader-preview.list {
+  margin-right: 0;
+  margin-left: 0px;
+}
+[dir=rtl] .nut-uploader-preview .close {
+  right: auto;
+  left: 0px;
+  transform: translate(-50%, -50%);
+}
+.nut-rtl .nut-uploader-preview .close {
+  right: auto;
+  left: 0px;
+  transform: translate(-50%, -50%);
+}
+[dir=rtl] .nut-uploader-preview-img .tips,
+.nut-rtl .nut-uploader-preview-img .tips {
+  left: auto;
+  right: 0;
+}

package/dist/es/packages/uploader/types.d.ts

@@ -0,0 +1,18 @@
+import { FixAutoComplete } from "../../types/fix-string-literal-union";
+export type FileItem = {
+    status?: FileItemStatus;
+    message?: string;
+    uid?: string | number;
+    name?: string;
+    url?: string;
+    type?: FixAutoComplete<'image' | 'list'>;
+    path?: string;
+    loadingIcon?: React.ReactNode;
+    failIcon?: React.ReactNode;
+    file?: File;
+    percentage?: number;
+};
+export type FileItemStatus = 'ready' | 'uploading' | 'success' | 'error';
+export type FileType<T> = {
+    [key: string]: T;
+};

package/dist/es/packages/uploader/types.js

@@ -0,0 +1 @@
+export { };