@xfe-repo/web-components 1.8.4 → 1.8.5

package/dist/index.d.mts

@@ -692,7 +692,6 @@ declare const PreviewGroup: typeof Image.PreviewGroup;
 interface OSSImageProps extends ImageProps {
     resizeWidth?: number;
     clearDefault?: boolean;
-    showOriginPreview?: boolean;
 }
 declare const OSSImage: MemoExoticComponent<FunctionComponent<OSSImageProps>> & {
     PreviewGroup: typeof PreviewGroup;

package/dist/index.d.ts

@@ -692,7 +692,6 @@ declare const PreviewGroup: typeof Image.PreviewGroup;
 interface OSSImageProps extends ImageProps {
     resizeWidth?: number;
     clearDefault?: boolean;
-    showOriginPreview?: boolean;
 }
 declare const OSSImage: MemoExoticComponent<FunctionComponent<OSSImageProps>> & {
     PreviewGroup: typeof PreviewGroup;

package/dist/index.js

@@ -3072,22 +3072,32 @@ var import_jsx_runtime20 = require("react/jsx-runtime");
 var PreviewGroup = import_antd16.Image.PreviewGroup;
 var fallback = "https://imgs.eshetang.com/product/default-product-1608019533274.png";
 var _OSSImage = (0, import_react24.memo)(function(props) {
-    var _props_src = props.src, src = _props_src === void 0 ? "" : _props_src, _props_resizeWidth = props.resizeWidth, resizeWidth = _props_resizeWidth === void 0 ? 750 : _props_resizeWidth, preview = props.preview, clearDefault = props.clearDefault, showOriginPreview = props.showOriginPreview, params = _object_without_properties(props, [
+    var _props_src = props.src, src = _props_src === void 0 ? "" : _props_src, _props_resizeWidth = props.resizeWidth, resizeWidth = _props_resizeWidth === void 0 ? 750 : _props_resizeWidth, preview = props.preview, clearDefault = props.clearDefault, params = _object_without_properties(props, [
         "src",
         "resizeWidth",
         "preview",
-        "clearDefault",
-        "showOriginPreview"
-    ]);
-    var previewSource = showOriginPreview ? src : preview && (typeof preview === "undefined" ? "undefined" : _type_of(preview)) === "object" ? preview.src || src : src;
-    var resizePreview = (typeof preview === "undefined" ? "undefined" : _type_of(preview)) === "object" ? _object_spread_props(_object_spread({}, preview), {
-        src: (0, import_tools2.resizeAliYun)(previewSource, 1200)
-    }) : showOriginPreview ? {
-        src: (0, import_tools2.resizeAliYun)(src, 1200)
-    } : preview;
+        "clearDefault"
+    ]);
+    var resizePreview = function resizePreview() {
+        if (typeof preview === "boolean") return preview;
+        if ((typeof preview === "undefined" ? "undefined" : _type_of(preview)) === "object") {
+            return _object_spread_props(_object_spread({}, preview), {
+                src: (0, import_tools2.resizeAliYun)(preview.src || src, {
+                    customStyle: "xfe2"
+                })
+            });
+        }
+        return {
+            src: (0, import_tools2.resizeAliYun)(src, {
+                customStyle: "xfe2"
+            })
+        };
+    };
     return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_antd16.Image, _object_spread_props(_object_spread({}, params), {
-        src: (0, import_tools2.resizeAliYun)(src, resizeWidth),
-        preview: resizePreview,
+        src: (0, import_tools2.resizeAliYun)(src, {
+            width: resizeWidth
+        }),
+        preview: resizePreview(),
         fallback: clearDefault ? void 0 : fallback,
         style: {
             objectFit: "cover"
@@ -3653,7 +3663,9 @@ var transformSimpleFile2UploadFile = function transformSimpleFile2UploadFile() {
     var files = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : [];
     return files.map(function(param) {
         var originUrl = param.url, id = param.id, name = param.name, fileName = param.fileName;
-        var url = (0, import_tools3.resizeAliYun)(originUrl, 1600);
+        var url = (0, import_tools3.resizeAliYun)(originUrl, {
+            width: 168
+        });
         return {
             url: url,
             name: name || url,
@@ -4059,7 +4071,7 @@ var FileUpload = function FileUpload(props) {
                 } else if (file.originFileObj) {
                     preview = (0, import_tools4.getObjectURL)(file.originFileObj);
                 }
-                isImageUrl = /\.(jpeg|jpg|gif|png)(\?.+)?$/i.test(preview) || /^image\//.test(file.type || "");
+                isImageUrl = /\.(jpeg|jpg|gif|png|heic)(\?.+)?$/i.test(preview) || /^image\//.test(file.type || "");
                 if (isImageUrl) {
                     previewIndex = fileList.findIndex(function(curFile) {
                         return curFile.uid === file.uid;
@@ -4088,6 +4100,7 @@ var FileUpload = function FileUpload(props) {
         var previewGroupProps = {
             current: previewImageIndex,
             visible: previewImageIndex >= 0,
+            onChange: setPreviewImageIndex,
             onVisibleChange: function onVisibleChange(visible) {
                 if (!visible) setPreviewImageIndex(-1);
             }
@@ -4103,9 +4116,15 @@ var FileUpload = function FileUpload(props) {
             },
             children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(OSSImage.PreviewGroup, {
                 preview: previewGroupProps,
+                items: fileList.map(function(file) {
+                    return (0, import_tools4.resizeAliYun)(file.url, {
+                        customStyle: "xfe2"
+                    });
+                }),
                 children: fileList === null || fileList === void 0 ? void 0 : fileList.map(function(file) {
                     return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(OSSImage, {
-                        src: file2Src(file)
+                        src: file2Src(file),
+                        resizeWidth: 168
                     }, file.uid || file.url);
                 })
             })

package/dist/index.mjs

@@ -2790,22 +2790,32 @@ import { jsx as jsx20 } from "react/jsx-runtime";
 var PreviewGroup = Image2.PreviewGroup;
 var fallback = "https://imgs.eshetang.com/product/default-product-1608019533274.png";
 var _OSSImage = memo16(function(props) {
-    var _props_src = props.src, src = _props_src === void 0 ? "" : _props_src, _props_resizeWidth = props.resizeWidth, resizeWidth = _props_resizeWidth === void 0 ? 750 : _props_resizeWidth, preview = props.preview, clearDefault = props.clearDefault, showOriginPreview = props.showOriginPreview, params = _object_without_properties(props, [
+    var _props_src = props.src, src = _props_src === void 0 ? "" : _props_src, _props_resizeWidth = props.resizeWidth, resizeWidth = _props_resizeWidth === void 0 ? 750 : _props_resizeWidth, preview = props.preview, clearDefault = props.clearDefault, params = _object_without_properties(props, [
         "src",
         "resizeWidth",
         "preview",
-        "clearDefault",
-        "showOriginPreview"
-    ]);
-    var previewSource = showOriginPreview ? src : preview && (typeof preview === "undefined" ? "undefined" : _type_of(preview)) === "object" ? preview.src || src : src;
-    var resizePreview = (typeof preview === "undefined" ? "undefined" : _type_of(preview)) === "object" ? _object_spread_props(_object_spread({}, preview), {
-        src: resizeAliYun(previewSource, 1200)
-    }) : showOriginPreview ? {
-        src: resizeAliYun(src, 1200)
-    } : preview;
+        "clearDefault"
+    ]);
+    var resizePreview = function resizePreview() {
+        if (typeof preview === "boolean") return preview;
+        if ((typeof preview === "undefined" ? "undefined" : _type_of(preview)) === "object") {
+            return _object_spread_props(_object_spread({}, preview), {
+                src: resizeAliYun(preview.src || src, {
+                    customStyle: "xfe2"
+                })
+            });
+        }
+        return {
+            src: resizeAliYun(src, {
+                customStyle: "xfe2"
+            })
+        };
+    };
     return /* @__PURE__ */ jsx20(Image2, _object_spread_props(_object_spread({}, params), {
-        src: resizeAliYun(src, resizeWidth),
-        preview: resizePreview,
+        src: resizeAliYun(src, {
+            width: resizeWidth
+        }),
+        preview: resizePreview(),
         fallback: clearDefault ? void 0 : fallback,
         style: {
             objectFit: "cover"
@@ -3057,7 +3067,7 @@ var SearchList = memo17(function(props) {
 // src/FileUpload/index.tsx
 import { useState as useState14, useCallback as useCallback14 } from "react";
 import { useUpdateEffect as useUpdateEffect5 } from "react-use";
-import { getObjectURL } from "@xfe-repo/web-utils/tools";
+import { getObjectURL, resizeAliYun as resizeAliYun3 } from "@xfe-repo/web-utils/tools";
 // src/FileUpload/index.module.less
 var index_module_default6 = {
     upload_btn: "index_module_upload_btn",
@@ -3371,7 +3381,9 @@ var transformSimpleFile2UploadFile = function transformSimpleFile2UploadFile() {
     var files = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : [];
     return files.map(function(param) {
         var originUrl = param.url, id = param.id, name = param.name, fileName = param.fileName;
-        var url = resizeAliYun2(originUrl, 1600);
+        var url = resizeAliYun2(originUrl, {
+            width: 168
+        });
         return {
             url: url,
             name: name || url,
@@ -3777,7 +3789,7 @@ var FileUpload = function FileUpload(props) {
                 } else if (file.originFileObj) {
                     preview = getObjectURL(file.originFileObj);
                 }
-                isImageUrl = /\.(jpeg|jpg|gif|png)(\?.+)?$/i.test(preview) || /^image\//.test(file.type || "");
+                isImageUrl = /\.(jpeg|jpg|gif|png|heic)(\?.+)?$/i.test(preview) || /^image\//.test(file.type || "");
                 if (isImageUrl) {
                     previewIndex = fileList.findIndex(function(curFile) {
                         return curFile.uid === file.uid;
@@ -3806,6 +3818,7 @@ var FileUpload = function FileUpload(props) {
         var previewGroupProps = {
             current: previewImageIndex,
             visible: previewImageIndex >= 0,
+            onChange: setPreviewImageIndex,
             onVisibleChange: function onVisibleChange(visible) {
                 if (!visible) setPreviewImageIndex(-1);
             }
@@ -3821,9 +3834,15 @@ var FileUpload = function FileUpload(props) {
             },
             children: /* @__PURE__ */ jsx30(OSSImage.PreviewGroup, {
                 preview: previewGroupProps,
+                items: fileList.map(function(file) {
+                    return resizeAliYun3(file.url, {
+                        customStyle: "xfe2"
+                    });
+                }),
                 children: fileList === null || fileList === void 0 ? void 0 : fileList.map(function(file) {
                     return /* @__PURE__ */ jsx30(OSSImage, {
-                        src: file2Src(file)
+                        src: file2Src(file),
+                        resizeWidth: 168
                     }, file.uid || file.url);
                 })
             })

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@xfe-repo/web-components",
-  "version": "1.8.4",
+  "version": "1.8.5",
   "module": "dist/index.js",
   "types": "dist/index.d.ts",
   "sideEffects": [
@@ -63,10 +63,10 @@
     "react-dom": "18.2.0",
     "react-use": "^17.5.1",
     "swr": "^2.2.5",
-    "@xfe-repo/web-router": "1.6.1",
+    "@xfe-repo/web-micro": "1.7.0",
     "@xfe-repo/web-service": "1.6.0",
-    "@xfe-repo/web-utils": "1.6.0",
-    "@xfe-repo/web-micro": "1.7.0"
+    "@xfe-repo/web-router": "1.6.1",
+    "@xfe-repo/web-utils": "1.6.1"
   },
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"

package/skills/xfe-web-components/references/OSSImage.md

@@ -71,14 +71,6 @@ const renderImages = (urls: string[]) => (
 />
 ```
 
-### 预览原图
-
-默认预览图也会被裁剪到 1200px，设置 `showOriginPreview` 可预览原始尺寸。
-
-```tsx
-<OSSImage src="https://imgs.eshetang.com/product/example.jpg" showOriginPreview />
-```
-
 ### 清除默认 fallback
 
 默认在图片加载失败时显示占位图，设置 `clearDefault` 可禁用。
@@ -175,16 +167,14 @@ const renderImages = (urlStr: string) => {
 export interface OSSImageProps extends ImageProps {
   resizeWidth?: number
   clearDefault?: boolean
-  showOriginPreview?: boolean
 }
 ```
 
-| 属性              | 类型         | 必填 | 默认值  | 说明                                      |
-| ----------------- | ------------ | ---- | ------- | ----------------------------------------- |
-| resizeWidth       | `number`     | 否   | `750`   | 缩略图裁剪宽度（通过阿里云 OSS 图片处理） |
-| clearDefault      | `boolean`    | 否   | `false` | 是否清除默认 fallback 占位图              |
-| showOriginPreview | `boolean`    | 否   | `false` | 预览时是否使用原始图片（裁剪到 1200px）   |
-| ...imageProps     | `ImageProps` | 否   | -       | 所有 antd Image 属性                      |
+| 属性          | 类型         | 必填 | 默认值  | 说明                                      |
+| ------------- | ------------ | ---- | ------- | ----------------------------------------- |
+| resizeWidth   | `number`     | 否   | `750`   | 缩略图裁剪宽度（通过阿里云 OSS 图片处理） |
+| clearDefault  | `boolean`    | 否   | `false` | 是否清除默认 fallback 占位图              |
+| ...imageProps | `ImageProps` | 否   | -       | 所有 antd Image 属性                      |
 
 ### OSSImageGroupProps（ModalGroup）