shineout 3.6.5-beta.1 → 3.6.5-beta.10

package/cjs/index.js

@@ -514,5 +514,5 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 // 此文件由脚本自动生成，请勿直接修改。
 // This file was generated automatically by a script. Please do not modify it directly.
 var _default = exports.default = {
-  version: '3.6.5-beta.1'
+  version: '3.6.5-beta.10'
 };

package/dist/shineout.js

@@ -12217,7 +12217,7 @@ var handleStyle = function handleStyle(style) {
 };
 /* harmony default export */ var jss_style_handleStyle = (handleStyle);
 ;// CONCATENATED MODULE: ../shineout-style/src/version.ts
-/* harmony default export */ var version = ('3.6.5-beta.1');
+/* harmony default export */ var version = ('3.6.5-beta.10');
 ;// CONCATENATED MODULE: ../shineout-style/src/jss-style/index.tsx
 
 
@@ -19757,9 +19757,14 @@ var ImageStyle = objectSpread2_default()(objectSpread2_default()({
   },
   fill: {
     '& $inner': {
-      backgroundSize: 'cover',
-      backgroundPosition: '50% 50%',
-      backgroundRepeat: 'no-repeat'
+      '& > img': {
+        position: 'absolute',
+        top: '50%',
+        left: '50%',
+        transform: 'translate(-50%, -50%)',
+        maxWidth: 'none',
+        maxHeight: 'none'
+      }
     }
   },
   previewMask: {
@@ -49442,7 +49447,8 @@ var useForm = function useForm(props) {
     size = props.size,
     colon = props.colon,
     formName = props.name,
-    scrollParent = props.scrollParent;
+    scrollParent = props.scrollParent,
+    isControl = props.isControl;
   var deepSetOptions = {
     removeUndefined: removeUndefined,
     forceSet: true
@@ -49698,13 +49704,16 @@ var useForm = function useForm(props) {
       var values = Object.keys(vals);
       // 针对 name 为数组模式，如 datepicker 的 name={['startTime', 'endTime']} 时，前者校验可能需要依赖后者，因此需要提前将后者数据整合至 draft 用于多字段整合校验
       values.forEach(function (key) {
-        deepSet(draft, key, vals[key], deepSetOptions);
+        // upload组件返回的可能是函数: (prev) => [...prev, file]
+        var valueOfKey = typeof vals[key] === 'function' ? vals[key](getValue(key)) : vals[key];
+        deepSet(draft, key, valueOfKey, deepSetOptions);
       });
       values.forEach(function (key) {
         if (option.validate) {
           var _context$validateMap$;
           (_context$validateMap$ = context.validateMap[key]) === null || _context$validateMap$ === void 0 || _context$validateMap$.forEach(function (validate) {
-            validate(key, vals[key], current(draft));
+            var valueOfKey = typeof vals[key] === 'function' ? vals[key](getValue(key)) : vals[key];
+            validate(key, valueOfKey, current(draft));
           });
         }
       });
@@ -50002,7 +50011,10 @@ var useForm = function useForm(props) {
   external_root_React_commonjs2_react_commonjs_react_amd_react_.useEffect(function () {
     context.removeLock = false;
     // 内部 onChange 改的 value, 不需要更新
-    if (props.value === context.value) return;
+    if (props.value === context.value) {
+      if (!isControl) update();
+      return;
+    }
     if (initValidate && !context.resetTime) {
       var keys = Object.keys(context.validateMap).filter(function (key) {
         var oldValue = deepGet(preValue || emptyObj, key);
@@ -50072,11 +50084,12 @@ var Form = function Form(props) {
     rest = objectWithoutProperties_default()(props, form_excluded);
   var formClasses = jssStyle === null || jssStyle === void 0 || (_jssStyle$form = jssStyle.form) === null || _jssStyle$form === void 0 ? void 0 : _jssStyle$form.call(jssStyle);
   var modalFormContext = useFormFooter();
+  var isControl = ('value' in props);
   var inputAbleParams = {
     value: props.value,
     onChange: props.onChange,
     defaultValue: props.defaultValue,
-    control: 'value' in props,
+    control: isControl,
     beforeChange: undefined,
     reserveAble: false
   };
@@ -50087,7 +50100,8 @@ var Form = function Form(props) {
   var _useForm = use_form(objectSpread2_default()(objectSpread2_default()({}, rest), {}, {
       value: value,
       onChange: onChange,
-      formElRef: formElRef
+      formElRef: formElRef,
+      isControl: isControl
     })),
     Provider = _useForm.Provider,
     ProviderProps = _useForm.ProviderProps,
@@ -51220,6 +51234,10 @@ var useImage = function useImage() {
     _React$useState2 = slicedToArray_default()(_React$useState, 2),
     status = _React$useState2[0],
     setStatus = _React$useState2[1];
+  var _React$useState3 = external_root_React_commonjs2_react_commonjs_react_amd_react_default().useState({}),
+    _React$useState4 = slicedToArray_default()(_React$useState3, 2),
+    imgCoverStyle = _React$useState4[0],
+    setImgCoverStyle = _React$useState4[1];
   var elementRef = external_root_React_commonjs2_react_commonjs_react_amd_react_default().useRef(null);
   var getUrl = function getUrl(url) {
     var auto = 'autoSSL' in props ? autoSSL : use_image_config.autoSSL;
@@ -51254,6 +51272,35 @@ var useImage = function useImage() {
     };
     img.src = getUrl(alt);
   };
+  var handleCoverStyle = function handleCoverStyle(img) {
+    var container = elementRef === null || elementRef === void 0 ? void 0 : elementRef.current;
+    if (!container) return;
+
+    // 根据容器的宽高获取宽高比
+    var containerWidth = container.clientWidth;
+    var containerHeight = container.clientHeight;
+    var containerRatio = containerWidth / containerHeight;
+
+    // 根据图片的自然尺寸获取宽高比
+    var imageWidth = img.naturalWidth;
+    var imageHeight = img.naturalHeight;
+    var imageRatio = imageWidth / imageHeight;
+
+    // 判断宽高比，决定图片填充策略
+    if (imageRatio > containerRatio) {
+      // 图片更宽，宽度占满容器，高度自适应
+      setImgCoverStyle({
+        height: '100%',
+        width: 'auto'
+      });
+    } else {
+      // 图片更高，填满容器高度
+      setImgCoverStyle({
+        width: '100%',
+        height: 'auto'
+      });
+    }
+  };
   var markToRender = function markToRender() {
     if (!src) {
       handleAlt();
@@ -51261,7 +51308,10 @@ var useImage = function useImage() {
     }
     var img = new window.Image();
     img.onload = function () {
-      return setStatus(SRC);
+      setStatus(SRC);
+      if (props.fit === 'fill') {
+        handleCoverStyle(img);
+      }
     };
     img.onerror = function (e) {
       return handleError(SRC, e);
@@ -51290,7 +51340,9 @@ var useImage = function useImage() {
       alt: alt,
       draggable: !noImgDrag
     });
-    return objectSpread2_default()({}, mergedEventHandlers);
+    return objectSpread2_default()({
+      style: imgCoverStyle
+    }, mergedEventHandlers);
   };
   var getImageDivProps = function getImageDivProps() {
     var externalProps = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
@@ -52058,7 +52110,8 @@ var Image = function Image(props) {
       href: href,
       lazy: lazy,
       autoSSL: autoSSL,
-      noImgDrag: noImgDrag
+      noImgDrag: noImgDrag,
+      fit: fit
     }, rest)),
     status = _useImage.status,
     getRootProps = _useImage.getRootProps,
@@ -52137,7 +52190,7 @@ var Image = function Image(props) {
 
   // 渲染 img / div 类型的内部标签
   var renderInner = function renderInner(src) {
-    return fit === 'fill' || fit === 'fit' ? renderDivInnerEl(src) : renderImgeInnerEl(src);
+    return fit === 'fit' ? renderDivInnerEl(src) : renderImgeInnerEl(src);
   };
 
   // 默认占位图
@@ -66440,6 +66493,7 @@ function attrAccept(file, acceptedFiles) {
 
 
 
+
 var VALIDATORITEMS = [{
   key: 'size',
   param: function param(blob) {
@@ -66473,11 +66527,12 @@ var promised = function promised(action) {
     resolve(true);
   });
 };
+var defaultValue = [];
 var useUpload = function useUpload(props) {
   var _props$limit = props.limit,
     limit = _props$limit === void 0 ? 100 : _props$limit,
     _props$value = props.value,
-    value = _props$value === void 0 ? [] : _props$value;
+    value = _props$value === void 0 ? defaultValue : _props$value;
   var accept = props.forceAccept || props.accept;
   var forceAccept = !!props.forceAccept;
   var _useState = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useState)({}),
@@ -66597,21 +66652,22 @@ var useUpload = function useUpload(props) {
       responseType: props.responseType,
       onStart: props.onStart,
       onProgress: function onProgress(e, msg) {
-        if (throttle) return;
+        var percent = typeof e.percent === 'number' ? e.percent : e.loaded / e.total * 100;
+        if (throttle && percent !== 100) return;
         throttle = true;
         setTimeout(function () {
           throttle = false;
         }, 16);
-        var percent = typeof e.percent === 'number' ? e.percent : e.loaded / e.total * 100;
-        var filesState = latestState.filesState;
-        var newFiles = objectSpread2_default()({}, filesState);
-        if (!newFiles[id]) return;
-        newFiles[id].process = percent;
-        if (msg) newFiles[id].message = msg;
-        setFiles(newFiles);
-        if (typeof props.onProgress === 'function') {
-          props.onProgress(newFiles[id]);
-        }
+        setFiles(function (files) {
+          return utils_immer_produce(files, function (draft) {
+            if (!draft[id]) return draft;
+            draft[id].process = percent;
+            if (msg) draft[id].message = msg;
+            if (typeof props.onProgress === 'function') {
+              props.onProgress(draft[id]);
+            }
+          });
+        });
       },
       onLoad: function onLoad(xhr) {
         if (!/^2|1223/.test("".concat(xhr.status))) {
@@ -66639,11 +66695,17 @@ var useUpload = function useUpload(props) {
               delete draft[id];
             });
           });
-          // add value
-          var values = utils_immer_produce(latestState.value, function (draft) {
-            draft.push(result);
-          });
-          props.onChange(values);
+          if (props.functionalOnChange) {
+            // 回调型 setState不会丢值
+            props.onChange(function (prev) {
+              return [].concat(toConsumableArray_default()(prev || []), [result]);
+            });
+          } else {
+            var latestValue = latestState.value;
+            var newValue = toConsumableArray_default()(latestValue);
+            newValue.push(result);
+            props.onChange(newValue);
+          }
         }
       },
       onError: function onError(xhr) {
@@ -66761,48 +66823,60 @@ var useUpload = function useUpload(props) {
                     error = _context2.sent;
                   case 21:
                     if (!(error instanceof Error)) {
-                      _context2.next = 30;
+                      _context2.next = 29;
                       break;
                     }
                     if (validatorHandle(error, blob)) {
-                      _context2.next = 26;
+                      _context2.next = 25;
                       break;
                     }
-                    delete newFiles[id];
-                    setFiles(objectSpread2_default()({}, newFiles));
+                    setFiles(function (prev) {
+                      return utils_immer_produce(prev, function (draft) {
+                        delete draft[id];
+                      });
+                    });
                     return _context2.abrupt("return", 0);
-                  case 26:
+                  case 25:
                     fileRecord.message = error.message;
                     fileRecord.status = 3;
-                    setFiles(objectSpread2_default()({}, newFiles));
+                    setFiles(function (prev) {
+                      return objectSpread2_default()(objectSpread2_default()({}, prev), {}, defineProperty_default()({}, id, fileRecord));
+                    });
                     return _context2.abrupt("return", 0);
-                  case 30:
+                  case 29:
                     if (!props.beforeUpload) {
-                      _context2.next = 37;
+                      _context2.next = 36;
                       break;
                     }
                     beforeUploadResult = props.beforeUpload(blob); // @ts-ignoreq
                     if (!(beforeUploadResult && beforeUploadResult.then)) {
-                      _context2.next = 35;
+                      _context2.next = 34;
                       break;
                     }
                     props.beforeUpload(blob).then(function (args) {
                       if (args.status !== 'error') {
                         newFiles[id].xhr = uploadFile(id, blob, fileRecord.src);
-                        setFiles(objectSpread2_default()({}, newFiles));
+                        setFiles(function (prev) {
+                          return objectSpread2_default()(objectSpread2_default()({}, prev), {}, defineProperty_default()({}, id, fileRecord));
+                        });
                       }
                     }).catch(function () {
-                      delete newFiles[id];
-                      setFiles(objectSpread2_default()({}, newFiles));
+                      setFiles(function (prev) {
+                        return utils_immer_produce(prev, function (draft) {
+                          delete draft[id];
+                        });
+                      });
                     });
                     return _context2.abrupt("return", 0);
-                  case 35:
-                    _context2.next = 39;
+                  case 34:
+                    _context2.next = 38;
                     break;
-                  case 37:
+                  case 36:
                     fileRecord.xhr = uploadFile(id, blob, fileRecord.src);
-                    setFiles(objectSpread2_default()({}, newFiles));
-                  case 39:
+                    setFiles(function (prev) {
+                      return objectSpread2_default()(objectSpread2_default()({}, prev), {}, defineProperty_default()({}, id, fileRecord));
+                    });
+                  case 38:
                   case "end":
                     return _context2.stop();
                 }
@@ -67200,7 +67274,8 @@ var Upload = function Upload(props0) {
         invalidImage: getLocale(locale, 'invalidImage')
       },
       value: value,
-      onChange: onChange
+      onChange: onChange,
+      functionalOnChange: props.functionalOnChange
     })),
     func = _useUpload.func,
     files = _useUpload.files,
@@ -69984,7 +70059,7 @@ var upload_interface = __webpack_require__(8821);
 
 
 /* harmony default export */ var src_0 = ({
-  version: '3.6.5-beta.1'
+  version: '3.6.5-beta.10'
 });
 }();
 /******/ 	return __webpack_exports__;