acud 0.0.67 → 0.0.70

package/lib/upload/UploadList/ListItem.js

@@ -29,7 +29,7 @@ var _OutlinedClose = _interopRequireDefault(require("acud-icon/lib/icons/Outline
 
 var _OutlinedCloudDownload = _interopRequireDefault(require("acud-icon/lib/icons/OutlinedCloudDownload"));
 
-var _OutlinedRefresh = _interopRequireDefault(require("acud-icon/lib/icons/OutlinedRefresh"));
+var _OutlinedButtonUpload = _interopRequireDefault(require("acud-icon/lib/icons/OutlinedButtonUpload"));
 
 var _tooltip = _interopRequireDefault(require("../../tooltip"));
 
@@ -185,7 +185,7 @@ var ListItem = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     title: locale.previewFile
   }, /*#__PURE__*/React.createElement(_OutlinedEye["default"], null)) : null; // 上传icon
 
-  var uploadIcon = showUploadIcon ? actionIconRender((typeof customUploadIcon === 'function' ? customUploadIcon(file) : customUploadIcon) || /*#__PURE__*/React.createElement(_OutlinedRefresh["default"], null), function () {
+  var uploadIcon = showUploadIcon ? actionIconRender((typeof customUploadIcon === 'function' ? customUploadIcon(file) : customUploadIcon) || /*#__PURE__*/React.createElement(_OutlinedButtonUpload["default"], null), function () {
     return onUpload(file);
   }, prefixCls, locale.uploadFile) : null;
   var actions = listType === 'picture-card' && file.status !== 'uploading' && /*#__PURE__*/React.createElement("span", {

package/lib/upload/UploadList/index.js

@@ -92,7 +92,7 @@ var renderIcon = function renderIcon(fileName) {
   }
 
   return /*#__PURE__*/React.createElement(Icon, {
-    width: 14
+    width: 16
   });
 };
 

package/lib/upload/style/index.css

@@ -123,6 +123,12 @@
 .acud-upload.acud-upload-drag.acud-upload-drag-hover:not(.acud-upload-disabled) {
   border-color: #144BCC;
 }
+.acud-upload.acud-upload-drag.acud-upload-drag-click:not(.acud-upload-disabled) {
+  border-color: #144BCC;
+}
+.acud-upload.acud-upload-drag.acud-upload-drag-click:not(.acud-upload-disabled):hover {
+  border-color: #144BCC;
+}
 .acud-upload.acud-upload-drag.acud-upload-disabled {
   background: #fafafa;
   cursor: not-allowed;
@@ -192,9 +198,9 @@
 }
 .acud-upload-list-item {
   position: relative;
-  height: 24px;
-  margin-top: 8px;
   font-size: 12px;
+  transition: background-color 0.3s;
+  overflow-y: hidden;
 }
 .acud-upload-list-item-name {
   display: inline-block;
@@ -221,7 +227,7 @@
 }
 .acud-upload-list-item-card-actions {
   position: absolute;
-  right: 0;
+  right: 4px;
 }
 .acud-upload-list-item-card-actions-btn {
   opacity: 0;
@@ -257,9 +263,8 @@
   color: #B8BABF;
 }
 .acud-upload-list-item-info {
-  height: 100%;
+  height: 24px;
   padding: 0 2px;
-  transition: background-color 0.3s;
   border-radius: 2px;
 }
 .acud-upload-list-item-info > span {
@@ -307,7 +312,7 @@
 .acud-upload-list-item .acuicon-outlined-close:hover {
   color: #151B26;
 }
-.acud-upload-list-item:hover .acud-upload-list-item-info {
+.acud-upload-list-item:hover {
   background-color: #F7F7F9;
 }
 .acud-upload-list-item:hover .acuicon-outlined-close {
@@ -339,10 +344,9 @@
   color: #F33E3E;
 }
 .acud-upload-list-item-progress {
-  position: absolute;
-  bottom: -12px;
   width: 100%;
   padding-left: 4px;
+  padding-right: 4px;
   font-size: 12px;
   line-height: 0;
 }
@@ -432,13 +436,6 @@
 .acud-upload-list-picture-card .acud-upload-list-item-uploading .acud-upload-list-item-name {
   margin-bottom: 12px;
 }
-.acud-upload-list-picture .acud-upload-list-item-progress,
-.acud-upload-list-picture-card .acud-upload-list-item-progress {
-  bottom: 14px;
-  width: calc(100% - 24px);
-  margin-top: 0;
-  padding-left: 56px;
-}
 .acud-upload-list-picture .acuicon-outlined-close,
 .acud-upload-list-picture-card .acuicon-outlined-close {
   position: absolute;
@@ -491,7 +488,7 @@
   opacity: 0;
   transition: all 0.3s;
 }
-.acud-upload-list-picture-card .acud-upload-list-item-actions .acuicon-outlined-refresh,
+.acud-upload-list-picture-card .acud-upload-list-item-actions .acuicon-outlined-button-upload,
 .acud-upload-list-picture-card .acud-upload-list-item-actions .acuicon-outlined-eye,
 .acud-upload-list-picture-card .acud-upload-list-item-actions .acuicon-outlined-download,
 .acud-upload-list-picture-card .acud-upload-list-item-actions .acuicon-outlined-delete {
@@ -519,8 +516,8 @@
   display: block;
   width: 100%;
   height: 100%;
-  -o-object-fit: contain;
-     object-fit: contain;
+  -o-object-fit: cover;
+     object-fit: cover;
 }
 .acud-upload-list-picture-card .acud-upload-list-item-name {
   display: none;
@@ -547,6 +544,7 @@
   line-height: 140px;
 }
 .acud-upload-list-picture-card .acud-upload-list-item-progress {
+  position: absolute;
   top: 44px;
   padding-left: 8px;
   padding-right: 8px;
@@ -583,9 +581,15 @@
   margin: 0;
   padding: 0 8px 0 4px;
 }
-.acud-upload-list-text .acud-upload-list-item-card-actions,
-.acud-upload-list-picture .acud-upload-list-item-card-actions {
-  position: static;
+.acud-upload-list-text-container {
+  margin-bottom: 4px;
+}
+.acud-upload-list-text-container:first-child {
+  margin-top: 8px;
+}
+.acud-upload-list-text .acud-upload-list-item-progress {
+  margin-top: 4px;
+  margin-bottom: 2px;
 }
 .acud-upload-list .acud-upload-animate-inline-appear,
 .acud-upload-list .acud-upload-animate-inline-enter,

package/lib/upload/style/index.less

@@ -97,7 +97,12 @@
         &.@{upload-prefix-cls}-drag-hover:not(.@{upload-prefix-cls}-disabled) {
             border-color: @primary-7;
         }
-
+        &.@{upload-prefix-cls}-drag-click:not(.@{upload-prefix-cls}-disabled) {
+            border-color: @B7;
+            &:hover{
+                border-color: @B7;
+            }
+        }
         &.@{upload-prefix-cls}-disabled {
             background: @background-color-light;
             cursor: not-allowed;
@@ -181,10 +186,9 @@
     // ============================ Item ============================
     &-item {
         position: relative;
-        height: @P * 6;
-        margin-top: @margin-xs;
         font-size: @font-size-base;
-
+        transition: background-color .3s;
+        overflow-y: hidden;
         &-name {
             display: inline-block;
             width: 100%;
@@ -198,7 +202,7 @@
 
         &-card-actions {
             position: absolute;
-            right: 0;
+            right: @P;
 
             &-btn {
                 opacity: 0;
@@ -226,9 +230,8 @@
         }
 
         &-info {
-            height: 100%;
+            height: @P * 6;
             padding: 0 .5 * @P;
-            transition: background-color .3s;
             border-radius: @R2;
 
             > span {
@@ -264,7 +267,7 @@
             }
         }
 
-        &:hover &-info {
+        &:hover {
             // background-color: @item-hover-bg;
             background-color: ~'@{@{upload-list-p}-hover-background-color}';
         }
@@ -303,10 +306,9 @@
         }
 
         &-progress {
-            position: absolute;
-            bottom: -12px;
             width: 100%;
             padding-left: @P;
+            padding-right: @P;
             font-size: @T2;
             line-height: 0;
         }
@@ -410,13 +412,6 @@
             margin-bottom: 12px;
         }
 
-        .@{upload-item}-progress {
-            bottom: 14px;
-            width: ~'calc(100% - 24px)';
-            margin-top: 0;
-            padding-left: 56px;
-        }
-
         .@{iconfont-css-prefix}-outlined-close {
             position: absolute;
             top: 8px;
@@ -478,7 +473,7 @@
             transform: translate(-50%, -50%);
             opacity: 0;
             transition: all .3s;
-            .@{iconfont-css-prefix}-outlined-refresh,
+            .@{iconfont-css-prefix}-outlined-button-upload,
             .@{iconfont-css-prefix}-outlined-eye,
             .@{iconfont-css-prefix}-outlined-download,
             .@{iconfont-css-prefix}-outlined-delete {
@@ -510,7 +505,7 @@
             display: block;
             width: 100%;
             height: 100%;
-            object-fit: contain;
+            object-fit: cover;
         }
 
         .@{upload-item}-name {
@@ -544,6 +539,7 @@
         }
 
         .@{upload-item}-progress {
+            position: absolute;
             top: 44px;
             padding-left: 8px;
             padding-right: 8px;
@@ -589,12 +585,23 @@
         }
 
         .@{upload-item}-card-actions {
-            position: static;
+            // position: static;
         }
     }
 
     // ============================ Text ============================
-
+    &-text {
+        &-container {
+            margin-bottom: @P;
+            &:first-child {
+                margin-top: @P * 2;
+            }
+        }
+        .@{upload-item}-progress {
+            margin-top: @P;
+            margin-bottom: @P * 0.5;
+        }
+    }
     // =========================== Motion ===========================
     .@{upload-prefix-cls}-animate-inline-appear,
     .@{upload-prefix-cls}-animate-inline-enter,

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "acud",
-    "version": "0.0.67",
+    "version": "0.0.70",
     "description": "acg react 组件库",
     "main": "lib/index.js",
     "module": "es/index.js",
@@ -25,7 +25,7 @@
         "pub": "npm publish"
     },
     "dependencies": {
-        "acud-icon": "^0.0.21",
+        "acud-icon": "^0.0.22",
         "aiflow": "^2.0.4",
         "array-tree-filter": "^2.1.0",
         "classnames": "2.2.6",

package/CHANGELOG.md

@@ -1,4 +0,0 @@
-# 0.0.16
-`2021-12-24`
-1. fix input、textarea的clear不触发上层的onchange的bug
-2. fix textarea的length 在有值得情况下初始化的时候展示0的bug