pb-sxp-ui 1.15.23 → 1.15.24

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.cjs CHANGED
@@ -10215,30 +10215,53 @@ const ExpandableText = ({ text, maxStr = 108, style, className, onClick, foldTex
10215
10215
  const _a = style || {}, { lineClamp } = _a, textStyle = __rest(_a, ["lineClamp"]);
10216
10216
  const textLineClamp = Number(lineClamp || 2);
10217
10217
  const multiRow = React.useRef(null);
10218
- const observerRef = React.useRef();
10218
+ React.useRef();
10219
10219
  const handleClick = () => {
10220
10220
  setIsShowMore(!isShowMore);
10221
10221
  };
10222
10222
  const checkOverflow = React.useCallback(() => {
10223
- if (!multiRow.current || !isPost)
10223
+ if (!multiRow.current || !isPost || !text)
10224
10224
  return;
10225
- const lineHeight = parseInt(getComputedStyle(multiRow.current).lineHeight) || 20;
10226
- const maxHeight = lineHeight * textLineClamp;
10227
- // 添加1px容错,解决部分机型计算误差
10228
- setIsShow(multiRow.current.scrollHeight > maxHeight + 1);
10225
+ // 强制同步布局(消除浏览器优化导致的误差)
10226
+ const triggerReflow = (el) => el.offsetHeight;
10227
+ // 分三步精确测量
10228
+ requestAnimationFrame(() => {
10229
+ // 第一步:获取干净状态
10230
+ const el = multiRow.current;
10231
+ triggerReflow(el);
10232
+ // 第二步:测量无约束状态的真实高度
10233
+ const originalStyle = el.style.cssText;
10234
+ el.style.webkitLineClamp = 'unset';
10235
+ el.style.display = 'block';
10236
+ triggerReflow(el);
10237
+ const realHeight = el.getBoundingClientRect().height;
10238
+ // 第三步:恢复约束状态
10239
+ el.style.cssText = originalStyle;
10240
+ triggerReflow(el);
10241
+ const clampHeight = el.getBoundingClientRect().height;
10242
+ // 精准比较(考虑亚像素渲染)
10243
+ const isActuallyClamped = realHeight > clampHeight + 1;
10244
+ // 防抖处理
10245
+ console.log('[精确测量]', { realHeight, clampHeight, isActuallyClamped });
10246
+ setIsShow(isActuallyClamped);
10247
+ });
10229
10248
  }, [isPost, text, textLineClamp]);
10249
+ // 增强版监听(同时监听字体加载)
10230
10250
  React.useEffect(() => {
10231
- if (!multiRow.current)
10251
+ const el = multiRow.current;
10252
+ if (!el)
10232
10253
  return;
10233
- // 使用ResizeObserver监听尺寸变化
10234
- observerRef.current = new ResizeObserver(checkOverflow);
10235
- observerRef.current.observe(multiRow.current);
10236
- // 初始检查
10237
- checkOverflow();
10238
- return () => {
10239
- var _a;
10240
- (_a = observerRef.current) === null || _a === void 0 ? void 0 : _a.disconnect();
10254
+ const fontCheck = () => {
10255
+ document.fonts.ready.then(checkOverflow);
10241
10256
  };
10257
+ const observer = new ResizeObserver((entries) => {
10258
+ entries.forEach((entry) => {
10259
+ if (entry.contentBoxSize) ;
10260
+ });
10261
+ });
10262
+ fontCheck();
10263
+ observer.observe(el);
10264
+ return () => observer.disconnect();
10242
10265
  }, [checkOverflow]);
10243
10266
  return (React.createElement("div", { className: className, style: Object.assign(Object.assign({}, textStyle), { transform: 'translate3d(0px, 0px, 0px)' }), hidden: !text || text === '' },
10244
10267
  React.createElement("div", { ref: multiRow, style: Object.assign(Object.assign({}, (!isShowMore &&
@@ -10249,7 +10272,7 @@ const ExpandableText = ({ text, maxStr = 108, style, className, onClick, foldTex
10249
10272
  overflow: 'hidden',
10250
10273
  display: '-webkit-box',
10251
10274
  WebkitBoxOrient: 'vertical'
10252
- })), { wordBreak: 'break-word' }), dangerouslySetInnerHTML: { __html: setFontForText(text === null || text === void 0 ? void 0 : text.replace(/\n/g, '</br>'), textStyle) } }),
10275
+ })), { wordBreak: 'break-word', textRendering: 'geometricPrecision', fontKerning: 'none', textSizeAdjust: '100%', boxSizing: 'border-box', contain: 'content' }), dangerouslySetInnerHTML: { __html: setFontForText(text === null || text === void 0 ? void 0 : text.replace(/\n/g, '</br>'), textStyle) } }),
10253
10276
  text && isPost && isShow && (React.createElement("button", { "aria-label": isShowMore ? unfoldText || 'show less' : foldText || 'show more', style: { textDecoration: 'underline', cursor: 'pointer' }, onClick: onClick !== null && onClick !== void 0 ? onClick : handleClick, dangerouslySetInnerHTML: {
10254
10277
  __html: setFontForText(isShowMore ? unfoldText || 'show less' : foldText || 'show more', textStyle)
10255
10278
  } }))));