shineout 3.6.5-beta.1 → 3.6.5-beta.3

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.3'
 };

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.3');
 ;// 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
@@ -50002,7 +50008,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 +50081,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 +50097,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,
@@ -50729,6 +50740,8 @@ var use_form_flow_UseFormItem = function UseFormItem(props) {
 
 var FormFlow = function FormFlow(props) {
   var _props$names;
+  var _props$strict = props.strict,
+    strict = _props$strict === void 0 ? true : _props$strict;
   var datum = use_form_flow({
     names: props.names
   });
@@ -50736,13 +50749,13 @@ var FormFlow = function FormFlow(props) {
     return datum === null || datum === void 0 ? void 0 : datum.get(name);
   });
   var memoizedResult = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useMemo)(function () {
-    if (!props.strict) return null;
+    if (!strict) return null;
     if (isFunc(props.children)) {
       return props.children(datum);
     }
     return props.children;
   }, [valueOfNames === null || valueOfNames === void 0 ? void 0 : valueOfNames.toString()]);
-  if (props.strict) {
+  if (strict) {
     return memoizedResult;
   }
   if (isFunc(props.children)) {
@@ -51220,6 +51233,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 +51271,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 +51307,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 +51339,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 +52109,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 +52189,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);
   };
 
   // 默认占位图
@@ -69984,7 +70036,7 @@ var upload_interface = __webpack_require__(8821);
 
 
 /* harmony default export */ var src_0 = ({
-  version: '3.6.5-beta.1'
+  version: '3.6.5-beta.3'
 });
 }();
 /******/ 	return __webpack_exports__;