one-design-next 0.0.107 → 0.0.109

package/dist/chat-group/index.d.ts

@@ -29,7 +29,10 @@ export interface ChatGroupProps extends Omit<HTMLAttributes<HTMLDivElement>, 'ti
      * 不是用户文件夹组。
      */
     section?: boolean;
-    /** 标题右侧扩展区（组级 … / + 等）；默认仅 hover / 菜单打开时显示 */
+    /**
+     * 标题右侧扩展区（组级 … / + 等）；默认仅 hover / 菜单打开时显示。
+     * 正在修改分组名称时不渲染。
+     */
     extra?: ReactNode;
     /** 强制显示 extra（如菜单打开时） */
     extraVisible?: boolean;

package/dist/chat-group/index.js

@@ -91,6 +91,7 @@ export function ChatGroup(_ref2) {
     setDraft = _useState4[1];
   var inputRef = useRef(null);
   var canRename = Boolean(onRename) && typeof title === 'string';
+  var editingTitle = renaming && canRename;
   useEffect(function () {
     if (!renaming) setDraft(titleText);
   }, [titleText, renaming]);
@@ -173,7 +174,7 @@ export function ChatGroup(_ref2) {
   }, expandHint)) : expandHint : null);
   var header = /*#__PURE__*/React.createElement("div", {
     "data-odn-chat-group-header": true
-  }, renaming && canRename ? /*#__PURE__*/React.createElement("div", {
+  }, editingTitle ? /*#__PURE__*/React.createElement("div", {
     "data-odn-chat-group-rename": true
   }, folderIcon ? /*#__PURE__*/React.createElement(Icon, {
     name: "folder",
@@ -225,7 +226,7 @@ export function ChatGroup(_ref2) {
     "data-odn-chat-group-folder-icon": true
   }) : null, /*#__PURE__*/React.createElement("span", {
     "data-odn-chat-group-title": true
-  }, title)), extra ? /*#__PURE__*/React.createElement("div", {
+  }, title)), extra && !editingTitle ? /*#__PURE__*/React.createElement("div", {
     "data-odn-chat-group-extra": true
   }, extra) : null);
   return /*#__PURE__*/React.createElement("div", _extends({
@@ -234,7 +235,7 @@ export function ChatGroup(_ref2) {
     "data-odn-chat-group-renaming": renaming || undefined,
     "data-odn-chat-group-folder": folderIcon || undefined,
     "data-odn-chat-group-section": section || undefined,
-    "data-odn-chat-group-extra-visible": extraVisible || undefined,
+    "data-odn-chat-group-extra-visible": extraVisible && !editingTitle || undefined,
     className: clsx(className)
   }, rest), section ? header : /*#__PURE__*/React.createElement(HoverFill, {
     "data-odn-chat-group-header-fill": true,

package/dist/chat-group/style/index.css

@@ -9,6 +9,7 @@
 [data-odn-chat-group-header-fill] {
   min-width: 0;
   width: 100%;
+  cursor: pointer;
 }
 
 .odn-chat-group-header-bg {
@@ -355,7 +356,7 @@
 }
 
 [data-odn-chat-group-hint-kind=empty] {
-  pointer-events: none;
+  cursor: default;
   user-select: none;
 }
 

package/dist/chat-item/index.d.ts

@@ -20,7 +20,7 @@ export interface ChatItemProps {
     pinned?: boolean;
     /**
      * 对话时间。展示为相对时间（刚刚 / N分钟前 / …），在行右侧；
-     * 与「…」同槽：hover 隐身但占位；选中常显「…」/ 菜单打开时才让出布局。
+     * 与「…」同槽：hover / 选中 / 菜单打开时时间退出布局，标题补到「…」前。
      */
     time?: number | string | Date;
     /** 当前所属分组。从「移动到」子菜单中排除，不作为可选项。 */

package/dist/chat-item/index.js

@@ -3,7 +3,6 @@ import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import React, { memo, useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState } from 'react';
 import { scheduleLayoutBatch } from "../_util/layoutBatch";
 import { observeResize } from "../_util/sharedResizeObserver";
-import { fitToWidth, measureFit, resolveFont } from "../_util/textFit";
 import Dialog from "../dialog";
 import Dropdown from "../dropdown";
 import HoverFill from "../hover-fill";
@@ -16,154 +15,30 @@ var STATUS_ARIA_LABEL = {
   unread: '未读更新',
   error: '生成出错'
 };
-var ELLIPSIS = '…';
 
 /**
- * 标记「JS 已把标题裁到可用宽度内」，由 useFittedTitle 在写入时同步，
- * 不由 React 渲染：它表达的是某一帧的测量结果，而非「是否启用拟合」。
+ * 标题保持原文，由 CSS 在贴住 trailing 的位置省略。
+ * 溢出时补原生 title。不把标题改写成「前缀…」。
  */
-var TITLE_FITTED_ATTR = 'data-odn-chat-item-title-fitted';
-
-/** 可用宽度变化小于该值时跳过重算（与二分容差同量级） */
-var FIT_WIDTH_EPS = 0.5;
-/**
- * 可用宽度低于该阈值时视为测量不可靠（布局未完成 / 被瞬时压扁）。
- * 此时保留上一帧可读结果或原文，避免把标题裁成单独的「…」。
- */
-var FIT_MIN_RELIABLE_WIDTH = 24;
-
-/**
- * 有 trailing（客服 icon / status / 时间）时，把标题裁到可用宽度。
- * 解决 CSS text-overflow 按字符边界截断后，省略号右侧留白把 trailing 顶开的问题。
- *
- * 测量走 textFit 的 Canvas 预算：挂载时一次算完所有截断位置的宽度，
- * 之后每次宽度变化只做二分，不再「填字 - 排版 - 量宽」地反复试探。
- *
- * 裁切结果直接写进 titleEl，不走 state：长列表拖宽时零 re-render。
- * 标题本身由 React 渲染，title 变化时 React 会把完整标题写回 DOM，
- * 随后本 effect 重跑重新裁切，顺序天然正确。
- *
- * 性能：RO 只监听整行；回调经 rAF 合并；缓存 maxWidth / trailingWidth / 裁切结果。
- * trailing 宽度变化（时间文案 / 状态 / 让位）由调用方经 layoutKey 触发重测。
- */
-function useFittedTitle(title, enabled, labelRef, titleRef, /** 右对齐区（状态 / 时间），量宽预留 */
-trailingRef, /** 紧跟标题的类型 icon，量宽预留 */
-typeIconRef, /** trailing 宽度 / 字重变化，需强制重测 */
-layoutKey, /** 搜索高亮时标题由 React 子节点渲染，禁止 textContent 覆写 */
-skipDomWrite) {
+function useChatItemTitleLayout(title, labelRef, titleRef, /** 选中 / 菜单 / 时间变化会改可用宽度，需重测溢出 */
+layoutKey, /** 搜索高亮时标题含 mark，不用原生 title 盖住高亮 */
+skipTooltip) {
   useLayoutEffect(function () {
-    var _measure, _document$fonts, _label$closest;
+    var _measure, _label$closest;
     var titleEl = titleRef.current;
-    if (!titleEl) return;
-
-    // 高亮态保留 mark 子节点，截断交给 CSS
-    if (skipDomWrite) {
-      titleEl.removeAttribute(TITLE_FITTED_ATTR);
-      titleEl.removeAttribute('title');
-      return;
-    }
-
-    // React 渲染的是完整标题；未启用拟合时保持原样，交给 CSS text-overflow
-    if (!enabled) {
-      titleEl.textContent = title;
-      titleEl.removeAttribute(TITLE_FITTED_ATTR);
-      titleEl.removeAttribute('title');
-      return;
-    }
     var label = labelRef.current;
-    if (!label) return;
-
-    // 先回到原文，避免沿用上一会话裁成的「…」，也保证按完整标题取字体
-    titleEl.textContent = title;
-    var titleCs = getComputedStyle(titleEl);
-    var metrics = measureFit(title, ELLIPSIS, {
-      font: resolveFont(titleCs),
-      letterSpacing: Number.parseFloat(titleCs.letterSpacing) || 0
-    });
+    if (!titleEl || !label) return;
     var cancelled = false;
     var scheduled = false;
-    var lastMaxWidth = Number.NaN;
-    var lastTrailingWidth = Number.NaN;
-    var lastFitted = title;
-    var lastFitAccurate = false;
-
-    /**
-     * accurate 表示「当前文本确实在可用宽度内」，此时才挂 fitted 标记让
-     * CSS 停止截断（否则省略号右侧会留出字符边界的空白，把 trailing 顶开）。
-     * 放弃裁切时必须摘掉标记，把截断交回 CSS，否则标题直接溢出行外。
-     */
-    var applyFit = function applyFit(text, accurate) {
-      titleEl.textContent = text;
-      if (accurate) titleEl.setAttribute(TITLE_FITTED_ATTR, '');else titleEl.removeAttribute(TITLE_FITTED_ATTR);
-      if (accurate && text !== title) titleEl.setAttribute('title', title);else titleEl.removeAttribute('title');
-    };
-
-    /**
-     * gap 与 trailing / typeIcon 的宽度在同一个 effect 周期内是常量：
-     * 所有会改变它们的条件（选中、菜单开合、时间文案、状态、类型 icon）
-     * 都在 layoutKey 里，变化时 effect 会整体重跑。
-     * 拖拽时因此只需读行内标题区的宽度，省掉每帧每项的 getComputedStyle。
-     */
-    var gap = Number.NaN;
-    var trailingWidth = 0;
-    var typeWidth = 0;
-    var readStatics = function readStatics() {
-      var _trailing$getBounding, _typeIconRef$current$, _typeIconRef$current;
-      var cs = getComputedStyle(label);
-      gap = Number.parseFloat(cs.columnGap || cs.gap) || 0;
-      var trailing = trailingRef.current;
-      trailingWidth = (_trailing$getBounding = trailing === null || trailing === void 0 ? void 0 : trailing.getBoundingClientRect().width) !== null && _trailing$getBounding !== void 0 ? _trailing$getBounding : 0;
-      typeWidth = (_typeIconRef$current$ = (_typeIconRef$current = typeIconRef.current) === null || _typeIconRef$current === void 0 ? void 0 : _typeIconRef$current.getBoundingClientRect().width) !== null && _typeIconRef$current$ !== void 0 ? _typeIconRef$current$ : 0;
-      var timeEl = trailing === null || trailing === void 0 ? void 0 : trailing.querySelector('[data-odn-chat-item-time]');
-      if (trailing instanceof HTMLElement && timeEl instanceof HTMLElement) {
-        var timeW = timeEl.getBoundingClientRect().width;
-        // 选中让位时时间为 0，保留上次正值，避免 hover 位移用错
-        if (timeW > 0) {
-          trailing.style.setProperty('--odn-chat-item-time-w', "".concat(timeW, "px"));
-        }
-      }
-    };
-
-    /**
-     * 只读布局，返回写入回调交由批处理统一执行。
-     * 这里不能直接改 DOM：同帧内还有其他实例要读，写入会让它们的读重新排版。
-     */
     var measure = function measure() {
       if (cancelled) return;
-      if (!Number.isFinite(gap)) readStatics();
-      // 标题两侧可能各有一段 gap：title↔type、type/title↔trailing
-      var gapCount = (typeWidth > 0 ? 1 : 0) + (trailingWidth > 0 ? 1 : 0);
-      var maxWidth = Math.max(0, label.getBoundingClientRect().width - trailingWidth - typeWidth - gap * gapCount);
-      if (Number.isFinite(lastMaxWidth) && Math.abs(maxWidth - lastMaxWidth) < FIT_WIDTH_EPS && Math.abs(trailingWidth - lastTrailingWidth) < FIT_WIDTH_EPS) {
-        return;
-      }
-
-      // 布局未就绪时不要写成单独的「…」，否则行宽不变时 RO 不触发会永久卡住
-      if (maxWidth < FIT_MIN_RELIABLE_WIDTH) {
-        lastMaxWidth = Number.NaN;
-        lastTrailingWidth = Number.NaN;
-        // 此刻 trailing / typeIcon 多半也没量准，下次重读
-        gap = Number.NaN;
-        if (lastFitted === title && !lastFitAccurate) return;
-        lastFitted = title;
-        lastFitAccurate = false;
-        return function () {
-          return applyFit(title, false);
-        };
-      }
-      lastMaxWidth = maxWidth;
-      lastTrailingWidth = trailingWidth;
-      var _fitToWidth = fitToWidth(metrics, maxWidth + FIT_WIDTH_EPS, title, ELLIPSIS),
-        next = _fitToWidth.text,
-        accurate = _fitToWidth.accurate;
-      if (next === lastFitted && accurate === lastFitAccurate) return;
-      lastFitted = next;
-      lastFitAccurate = accurate;
+      var overflow = titleEl.scrollWidth - titleEl.clientWidth > 1;
       return function () {
-        return applyFit(next, accurate);
+        if (cancelled) return;
+        if (skipTooltip || !overflow) titleEl.removeAttribute('title');else titleEl.setAttribute('title', title);
       };
     };
-    var scheduleFit = function scheduleFit() {
+    var schedule = function schedule() {
       if (cancelled || scheduled) return;
       scheduled = true;
       scheduleLayoutBatch(function () {
@@ -171,29 +46,14 @@ skipDomWrite) {
         return measure();
       });
     };
-
-    // 首屏同步裁切，避免首帧闪全标题；后续宽度变化走批处理合并
     (_measure = measure()) === null || _measure === void 0 || _measure();
-    void ((_document$fonts = document.fonts) === null || _document$fonts === void 0 ? void 0 : _document$fonts.ready.then(function () {
-      if (cancelled) return;
-      // 字体就绪后字形宽度可能变，需重新预算并绕过 maxWidth 缓存
-      var readyCs = getComputedStyle(titleEl);
-      metrics = measureFit(title, ELLIPSIS, {
-        font: resolveFont(readyCs),
-        letterSpacing: Number.parseFloat(readyCs.letterSpacing) || 0
-      });
-      lastMaxWidth = Number.NaN;
-      gap = Number.NaN;
-      scheduleFit();
-    }));
     var row = (_label$closest = label.closest('[data-odn-chat-item-btn]')) !== null && _label$closest !== void 0 ? _label$closest : label;
-    var stopObserving = observeResize(row, scheduleFit);
+    var stopObserving = observeResize(row, schedule);
     return function () {
-      // 批处理队列里可能仍排着本实例的读回调，靠 cancelled 短路即可
       cancelled = true;
       stopObserving();
     };
-  }, [title, enabled, layoutKey, skipDomWrite, labelRef, titleRef, trailingRef, typeIconRef]);
+  }, [title, layoutKey, skipTooltip, labelRef, titleRef]);
 }
 function ChatItemStatus(_ref) {
   var status = _ref.status;
@@ -340,7 +200,6 @@ function ChatItemInner(_ref2) {
   var labelRef = useRef(null);
   var titleRef = useRef(null);
   var typeIconRef = useRef(null);
-  var trailingRef = useRef(null);
   // active 时隐藏 unread/error；generating / waiting 仍展示（当前会话仍在进行）
   var showStatus = Boolean(status && (!active || status === 'generating' || status === 'waiting'));
   var showTypeIcon = type === 'human';
@@ -349,10 +208,7 @@ function ChatItemInner(_ref2) {
   }, [time, now]);
   var showTime = Boolean(timeLabel);
   var showTrailing = showStatus || showTime;
-  var fitTitle = showTypeIcon || showTrailing;
-  useFittedTitle(title, fitTitle, labelRef, titleRef, trailingRef, typeIconRef, // trailing / 字重的全部变化来源。这些都会改标题可用宽度而行宽不变，
-  // 提前声明即可，无需为此额外监听 label / trailing / typeIcon 的尺寸。
-  "".concat(active ? 1 : 0, ":").concat(menuOpen ? 1 : 0, ":").concat(timeLabel, ":").concat(status !== null && status !== void 0 ? status : '', ":").concat(showTypeIcon ? 1 : 0), Boolean(highlightQuery === null || highlightQuery === void 0 ? void 0 : highlightQuery.trim()));
+  useChatItemTitleLayout(title, labelRef, titleRef, "".concat(active ? 1 : 0, ":").concat(menuOpen ? 1 : 0, ":").concat(timeLabel, ":").concat(status !== null && status !== void 0 ? status : '', ":").concat(showTypeIcon ? 1 : 0), Boolean(highlightQuery === null || highlightQuery === void 0 ? void 0 : highlightQuery.trim()));
   useEffect(function () {
     if (!renaming) setDraft(title);
   }, [title, renaming]);
@@ -473,8 +329,7 @@ function ChatItemInner(_ref2) {
     name: "support-bold",
     size: 12
   })) : null, showTrailing ? /*#__PURE__*/React.createElement("span", {
-    "data-odn-chat-item-trailing": true,
-    ref: trailingRef
+    "data-odn-chat-item-trailing": true
   }, showStatus && status ? /*#__PURE__*/React.createElement(ChatItemStatus, {
     status: status
   }) : null, showTime ? /*#__PURE__*/React.createElement("time", {

package/dist/chat-item/style/index.css

@@ -9,31 +9,37 @@
   display: block;
   width: 100%;
   min-width: 0;
+  /* 根节点与内层按钮光标必须一致。根是 auto 时，时间收宽会让命中点在手指和箭头之间来回跳 */
+  cursor: pointer;
 }
 [data-odn-chat-item]:hover [data-odn-chat-item-menu-trigger], [data-odn-chat-item]:has(:focus-visible) [data-odn-chat-item-menu-trigger] {
   opacity: 1;
   pointer-events: auto;
 }
 [data-odn-chat-item] {
-  /* 无时间才加 36；有时间则占位已在，避免标题变宽、离开时时间从行外闪回 */
+  /* hover / 聚焦腾出 36 给 …，标题补进让出的时间位 */
 }
-[data-odn-chat-item]:hover [data-odn-chat-item-btn]:not(:has([data-odn-chat-item-time])), [data-odn-chat-item]:has(:focus-visible) [data-odn-chat-item-btn]:not(:has([data-odn-chat-item-time])), [data-odn-chat-item]:has([data-odn-chat-item-menu-trigger-open]) [data-odn-chat-item-btn] {
+[data-odn-chat-item]:hover [data-odn-chat-item-btn], [data-odn-chat-item]:has(:focus-visible) [data-odn-chat-item-btn], [data-odn-chat-item]:has([data-odn-chat-item-menu-trigger-open]) [data-odn-chat-item-btn] {
   padding-right: 36px;
 }
 [data-odn-chat-item] {
-  /* hover：只隐身，宽度留下。收宽度会让移出时时间从行外闪回 */
+  /*
+   * 同槽让位：时间瞬时退出布局，标题补到 … 前。
+   * 无 status 时收掉 trailing 左间距，避免标题与 … 之间空档。
+   */
 }
 [data-odn-chat-item]:hover [data-odn-chat-item-time], [data-odn-chat-item]:has(:focus-visible) [data-odn-chat-item-time] {
   opacity: 0;
+  width: 0;
+  min-width: 0;
+  max-width: 0;
+  flex: 0 0 0;
+  margin: 0;
+  overflow: hidden;
   pointer-events: none;
 }
-[data-odn-chat-item] {
-  /* hover + 状态 + 时间：同一颗状态 relative 右移，占位不收，移出不飞 */
-}
-[data-odn-chat-item]:hover:has([data-odn-chat-item-time]):not([data-odn-chat-item-time-yield]) [data-odn-chat-item-status], [data-odn-chat-item]:has(:focus-visible):has([data-odn-chat-item-time]):not([data-odn-chat-item-time-yield]) [data-odn-chat-item-status] {
-  position: relative;
-  z-index: 1;
-  left: max(0px, 6px + var(--odn-chat-item-time-w, 0px) - 24px);
+[data-odn-chat-item]:hover [data-odn-chat-item-trailing]:not(:has([data-odn-chat-item-status])), [data-odn-chat-item]:has(:focus-visible) [data-odn-chat-item-trailing]:not(:has([data-odn-chat-item-status])) {
+  padding-left: 0;
 }
 [data-odn-chat-item] {
   /* 选中 / 菜单开：时间退出布局，右侧 36 给 …。
@@ -79,6 +85,7 @@
 
 /* 无痕输入框：完全继承父按钮的排版，保证尺寸/位置 1:1 对齐 title 文本 */
 [data-odn-chat-item-rename-input] {
+  cursor: text;
   flex: 1 1 auto;
   min-width: 0;
   width: 100%;
@@ -137,7 +144,7 @@
 }
 
 [data-odn-chat-item-title] {
-  /* 0 1 auto：短标题不撑开，类型 icon 紧跟；长标题可收缩省略 */
+  /* 0 1 auto：短标题不撑开，类型 icon 紧跟；长标题收缩到 trailing 前再省略 */
   flex: 0 1 auto;
   min-width: 0;
   font-size: 14px;
@@ -153,13 +160,6 @@
   font: inherit;
 }
 
-/* JS 已裁到可用宽度：按内容收缩，省略号后无字符边界留白；量准时整组仍铺满行 */
-[data-odn-chat-item-title-fitted] {
-  flex: 0 0 auto;
-  overflow: visible;
-  text-overflow: clip;
-}
-
 [data-odn-chat-item-title-bold] {
   font-weight: 500;
 }

package/dist/chat-list/style/index.css

@@ -137,6 +137,8 @@
   min-width: 0;
   min-height: 0;
   overflow-anchor: none;
+  /* 行与右侧滚动槽、行间缝都用手指。槽是 default 时，悬停收时间会让光标在缝上来回跳 */
+  cursor: pointer;
 }
 
 [data-odn-chat-list-fade] {
@@ -190,7 +192,7 @@
   font-weight: 400;
   line-height: 18px;
   user-select: none;
-  pointer-events: none;
+  cursor: default;
 }
 
 [data-odn-chat-list-pinned-body],
@@ -381,6 +383,7 @@
   align-items: center;
   gap: 4px;
   min-width: 0;
+  cursor: default;
   /* 左缘与标题栏 / ChatItem / 置顶分区头同为 12px */
   padding: 4px 4px 2px 12px;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "one-design-next",
-  "version": "0.0.107",
+  "version": "0.0.109",
   "description": "One Design Next from TAD@tencent.com",
   "license": "MIT",
   "type": "module",