@pixui-dev/pixui-richtext-helper 0.2.18 → 0.2.20

package/dist/RichTextCore.d.ts

@@ -86,12 +86,20 @@ export declare class RichTextCore {
     private static flattenNestedText;
     /** 将同一行的 text 节点转为 div 并外包一层 text */
     private static convertSiblingTextToDiv;
+    /**
+     * 将首尾的空格替换为透明占位 key，避免被 PixUI trim 掉。
+     */
+    private static ensureKeyEdgeSpacesPreserved;
     /** text-indent 首行缩进处理 */
     private static handleTextIndent;
     /** 处理 line-height / letter-spacing 属性 */
     private static adjustLineHeightAndLetterSpacing;
     /** 把 div 的 text-align 转移到子 text 上 */
     private static transferTextAlign;
+    /**
+     * 对设置了 direction 的 text 下 key 追加 U+061C（仅处理 rtl）
+     */
+    private static ensureArabicOrUrduMarkForDirectedTextKeys;
     /** 删除空 text 节点；并在安全场景下清理空 key 节点（不影响占位/换行） */
     private static removeEmptyText;
     /** 补默认 heading 字体大小 */

package/dist/RichTextCore.js

@@ -402,6 +402,7 @@ var RichTextCore = /** @class */ (function () {
      * 处理单个段落片段，返回转换后的片段 HTML
      */
     RichTextCore.processSegment = function (segmentHtml, config) {
+        segmentHtml = segmentHtml.replaceAll(/ /g, " ");
         var $ = cheerio.load(segmentHtml, null, false);
         // 预处理：data-list → class、class → style、margin→padding 合并
         this.preprocess($);
@@ -433,22 +434,23 @@ var RichTextCore = /** @class */ (function () {
         this.flattenNestedText($);
         // 同级文本：拆分为 <key> 片段并统一包入父 <text>
         this.convertSiblingTextToDiv($);
+        // 保留 key 节点首尾空格,转为透明占位-，避免被 PixUI trim
+        this.ensureKeyEdgeSpacesPreserved($);
         // 首行缩进：text-indent 转透明占位
         this.handleTextIndent($);
         // 行高与字间距：聚合到父 <text> 并按配置缩放 line-height
         this.adjustLineHeightAndLetterSpacing($, config);
         // 文本对齐与方向：从 div 下沉至子 <text>
         this.transferTextAlign($);
+        // 对设置了 direction: rtl 的 text 下的 key 检查是否有单独的不带阿语乌语字符的文字节点，没有的话附加一个阿语空格，绕过pixui排版问题
+        this.ensureArabicOrUrduMarkForDirectedTextKeys($);
         // 清理空 <text>
         this.removeEmptyText($);
         // this.fixHeadingFontSize($);
-        // 最后：修正 img 结束标签、nbsp
         var res = $.html();
         res = res
             .replaceAll(/<img([^>]+)>/g, "<img$1 />")
             .replaceAll(/&nbsp;/g, " ")
-            .replaceAll(/&amp;/g, "&")
-            .replaceAll(/&quot;/g, '"')
             .replaceAll("\"", "\"");
         // 统一进行px到em转换
         if (config === null || config === void 0 ? void 0 : config.convertPxToEm) {
@@ -855,8 +857,8 @@ var RichTextCore = /** @class */ (function () {
                 if (brParent.length > 0)
                     return;
                 if (this.type === "text") {
-                    var text = this.data.trim();
-                    if (text.length > 0) {
+                    var text = this.data;
+                    if (text.trim().length > 0) {
                         $(this).replaceWith("<text style=\"".concat(mergeStyles("flex-shrink: 0", "flex-direction: row", "word-break: break-word"), "\">").concat(text, "</text>"));
                     }
                 }
@@ -1064,6 +1066,47 @@ var RichTextCore = /** @class */ (function () {
             }
         });
     };
+    /**
+     * 将首尾的空格替换为透明占位 key，避免被 PixUI trim 掉。
+     */
+    RichTextCore.ensureKeyEdgeSpacesPreserved = function ($) {
+        var placeholderStyle = mergeStyles("color: transparent", "flex-shrink: 0", "font-size: 1em");
+        $("text").each(function () {
+            $(this)
+                .find("key")
+                .each(function () {
+                var $key = $(this);
+                var nodes = $key.contents().toArray();
+                var textNodes = nodes.filter(function (n) { return n && n.type === "text"; });
+                if (textNodes.length === 0)
+                    return;
+                //节点的字号1/2或者0.5em
+                var fontSize = $key.css("font-size");
+                var fontSizeRes = "0.5em";
+                if (fontSize) {
+                    fontSizeRes = "".concat(parseFloat(fontSize) / 2).concat(fontSize.replace(/(\d+)/g, ""));
+                }
+                // 处理前导空格
+                var firstTextNode = textNodes[0];
+                var firstData = (firstTextNode.data || "");
+                var leadingMatch = firstData.match(/^( +)/);
+                if (leadingMatch && leadingMatch[1].length > 0) {
+                    var n = leadingMatch[1].length;
+                    $key.before("<key style=\"".concat(mergeStyles(placeholderStyle, "font-size: ".concat(fontSizeRes)), "\">").concat("-".repeat(n), "</key>"));
+                    firstTextNode.data = firstData.slice(n);
+                }
+                // 处理后缀空格
+                var lastTextNode = textNodes[textNodes.length - 1];
+                var lastData = (lastTextNode.data || "");
+                var trailingMatch = lastData.match(/( +)$/);
+                if (trailingMatch && trailingMatch[1].length > 0) {
+                    var n = trailingMatch[1].length;
+                    $key.after("<key style=\"".concat(mergeStyles(placeholderStyle, "font-size: ".concat(fontSizeRes)), "\">").concat("-".repeat(n), "</key>"));
+                    lastTextNode.data = lastData.slice(0, lastData.length - n);
+                }
+            });
+        });
+    };
     /** text-indent 首行缩进处理 */
     RichTextCore.handleTextIndent = function ($) {
         $("*").each(function () {
@@ -1165,6 +1208,32 @@ var RichTextCore = /** @class */ (function () {
             });
         });
     };
+    /**
+     * 对设置了 direction 的 text 下 key 追加 U+061C（仅处理 rtl）
+     */
+    RichTextCore.ensureArabicOrUrduMarkForDirectedTextKeys = function ($) {
+        var ARABIC_URDU_REGEX = /[\u0600-\u06FF\u0750-\u077F\u08A0-\u08FF\uFB50-\uFDFF\uFE70-\uFEFF]/;
+        $("text").each(function () {
+            var styleObj = parseStyleString($(this).attr("style") || "");
+            var dir = (styleObj["direction"] || "").trim().toLowerCase();
+            if (dir !== "rtl")
+                return;
+            $(this)
+                .find("key")
+                .each(function () {
+                var $key = $(this);
+                var textContent = $key.text() || "";
+                if (!textContent.trim())
+                    return;
+                if (textContent.includes("\u061C"))
+                    return;
+                if (ARABIC_URDU_REGEX.test(textContent))
+                    return;
+                var html = $key.html() || "";
+                $key.html(html + "\u061C");
+            });
+        });
+    };
     /** 删除空 text 节点；并在安全场景下清理空 key 节点（不影响占位/换行） */
     RichTextCore.removeEmptyText = function ($) {
         $("text").each(function () {

package/dist/version.d.ts

@@ -1 +1 @@
-export declare const LIB_VERSION = "0.2.17";
+export declare const LIB_VERSION = "0.2.20";

package/dist/version.js

@@ -2,4 +2,4 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.LIB_VERSION = void 0;
 /* Auto-generated by scripts/generate-version.js */
-exports.LIB_VERSION = "0.2.17";
+exports.LIB_VERSION = "0.2.20";

package/package.json

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

package/readme.md

@@ -149,3 +149,11 @@ componentDidMount() { // 在节点渲染后绑定点击事件
 0.2.14(f196abf819a64d9b762137512560261e1742c4d4)
 
 1. 修复：段落缩进距离过长
+
+0.2.19
+
+1. 手动补充阿语空格，绕过pixui在阿语rtl节点下key节点内容不带阿语的时候有可能排版错误的问题
+
+0.2.20
+
+1. 直接填充透明占位符规避行内多个节点的时候空格被pixui trim的问题