@pixui-dev/pixui-richtext-helper 0.2.6 → 0.2.7

package/dist/richtext/RichTextCore.d.ts

@@ -24,10 +24,14 @@ export declare class RichTextCore {
      * 富文本转换为 PixUI innerHTML 兼容格式
      * @param str 原始富文本 HTML
      * @param config 可选配置
+     * @param config.lineHeightScale 行高缩放比例
+     * @param config.convertPxToEm 是否转换px为em
+     * @param config.addCosUrlImageMogr2_w 添加cos url图片的mogr2_w参数,如果是cos的图片，可以使用这个配置设置图片宽度最大值。组件会增加参数为 xxx.jpg?imageMogr2/thumbnail/<width>x的参数。参数值取min(img节点样式宽度,addCosUrlImageMogr2_w)
      */
     static convertRichTextToPixuiStyle(str: string, config?: {
         lineHeightScale?: number;
         convertPxToEm?: boolean;
+        addCosUrlImageMogr2_w?: number;
     }): string;
     /**
      * 绑定链接点击事件
@@ -53,6 +57,8 @@ export declare class RichTextCore {
     private static convertAllPxToEm;
     private static preprocess;
     private static fixImgSizeUnit;
+    /** 给 COS 图片自动追加 imageMogr2/thumbnail 参数 */
+    private static handleCosImageMogr2;
     /** 列表处理（将 ol/ul/li 替换为 div 结构） */
     private static handleLists;
     /** 将连续 <br> 替换为透明占位文字，确保 PixUI 换行 */

package/dist/richtext/RichTextCore.js

@@ -143,6 +143,9 @@ var RichTextCore = /** @class */ (function () {
      * 富文本转换为 PixUI innerHTML 兼容格式
      * @param str 原始富文本 HTML
      * @param config 可选配置
+     * @param config.lineHeightScale 行高缩放比例
+     * @param config.convertPxToEm 是否转换px为em
+     * @param config.addCosUrlImageMogr2_w 添加cos url图片的mogr2_w参数,如果是cos的图片，可以使用这个配置设置图片宽度最大值。组件会增加参数为 xxx.jpg?imageMogr2/thumbnail/<width>x的参数。参数值取min(img节点样式宽度,addCosUrlImageMogr2_w)
      */
     RichTextCore.convertRichTextToPixuiStyle = function (str, config) {
         // 重置全局状态
@@ -321,6 +324,7 @@ var RichTextCore = /** @class */ (function () {
         // 按旧实现顺序进行处理，但重构为独立函数划分
         this.preprocess($);
         this.fixImgSizeUnit($);
+        this.handleCosImageMogr2($, config);
         this.handleLists($, (config === null || config === void 0 ? void 0 : config.lineHeightScale) || 1);
         this.replaceBrWithPlaceholder($);
         this.handleAnchorTag($);
@@ -446,6 +450,64 @@ var RichTextCore = /** @class */ (function () {
             }
         });
     };
+    /** 给 COS 图片自动追加 imageMogr2/thumbnail 参数 */
+    RichTextCore.handleCosImageMogr2 = function ($, config) {
+        var maxW = config === null || config === void 0 ? void 0 : config.addCosUrlImageMogr2_w;
+        if (!maxW)
+            return;
+        var extractNumber = function (str) {
+            if (!str)
+                return undefined;
+            var m = str.match(/(\d+(?:\.\d+)?)/);
+            if (m) {
+                var num = parseInt(m[1]);
+                if (!isNaN(num))
+                    return num;
+            }
+            return undefined;
+        };
+        $("img").each(function () {
+            var src = $(this).attr("src") || "";
+            if (!src)
+                return;
+            // 已有 thumbnail 宽度
+            var thumbMatch = src.match(/imageMogr2\/thumbnail\/(\d+)x/i);
+            var existingThumbW = thumbMatch ? parseInt(thumbMatch[1]) : undefined;
+            // width 属性
+            var widthAttrW = extractNumber($(this).attr("width"));
+            // style width
+            var styleObj = parseStyleString($(this).attr("style") || "");
+            var styleWidthW = extractNumber(styleObj["width"]);
+            // 计算最小宽度
+            var candidates = [existingThumbW, widthAttrW, styleWidthW, maxW].filter(function (v) { return v !== undefined && v > 0; });
+            if (candidates.length === 0)
+                return; // 无可用宽度
+            var finalW = Math.min.apply(Math, candidates);
+            // 如果已存在 thumbnail 参数且宽度一致，无需处理
+            if (existingThumbW !== undefined) {
+                if (existingThumbW === finalW)
+                    return;
+                // 替换为更小的宽度
+                src = src.replace(/imageMogr2\/thumbnail\/(\d+)x/i, "imageMogr2/thumbnail/".concat(finalW, "x"));
+            }
+            else {
+                // 未存在 thumbnail 参数，需要追加
+                var appendedParam = "imageMogr2/thumbnail/".concat(finalW, "x");
+                if (src.includes("?")) {
+                    // 已有查询部分，使用 | 追加
+                    if (!src.endsWith("|") && !src.endsWith("&") && !src.endsWith("?")) {
+                        src += "|";
+                    }
+                    src += appendedParam;
+                }
+                else {
+                    // 无查询部分，直接添加
+                    src += "?".concat(appendedParam);
+                }
+            }
+            $(this).attr("src", src);
+        });
+    };
     /** 列表处理（将 ol/ul/li 替换为 div 结构） */
     RichTextCore.handleLists = function ($, lineHeightScale) {
         if (lineHeightScale === void 0) { lineHeightScale = 1; }

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@pixui-dev/pixui-richtext-helper",
-    "version": "0.2.6",
+    "version": "0.2.7",
     "description": "pixui richtext helper",
     "main": "dist/index.js",
     "types": "dist/index.d.ts",

package/readme.md

@@ -95,4 +95,12 @@ componentDidMount() { // 在节点渲染后绑定点击事件
 2. 修复在嵌套节点中加br不会被拆成不同段落的问题
 
 0.2.5
-1. 修复img节点丢失的问题
+1. 修复img节点丢失的问题
+
+0.2.6
+1. 修复在超链接中添加转义符导致跳转信息不完整的问题
+2. 修复带超链接的img节点中出现一些多余的属性
+3. 增加将富文本中的px单位的属性统一替换为em单位的选项
+
+0.2.7
+1. 增加addCosUrlImageMogr2_w参数