one-design-next 0.0.90 → 0.0.92

package/dist/chat-item/index.js

@@ -1,6 +1,9 @@
 import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
-import { useEffect, useLayoutEffect, useMemo, useRef, useState } from 'react';
+import { 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";
@@ -15,6 +18,12 @@ var STATUS_ARIA_LABEL = {
 };
 var ELLIPSIS = '…';
 
+/**
+ * 标记「JS 已把标题裁到可用宽度内」，由 useFittedTitle 在写入时同步，
+ * 不由 React 渲染：它表达的是某一帧的测量结果，而非「是否启用拟合」。
+ */
+var TITLE_FITTED_ATTR = 'data-odn-chat-item-title-fitted';
+
 /** 可用宽度变化小于该值时跳过重算（与二分容差同量级） */
 var FIT_WIDTH_EPS = 0.5;
 /**
@@ -24,65 +33,85 @@ var FIT_WIDTH_EPS = 0.5;
 var FIT_MIN_RELIABLE_WIDTH = 24;
 
 /**
- * 有 trailing（客服 icon / status / 时间）时，用 DOM 实测把标题裁到可用宽度。
+ * 有 trailing（客服 icon / status / 时间）时，把标题裁到可用宽度。
  * 解决 CSS text-overflow 按字符边界截断后，省略号右侧留白把 trailing 顶开的问题。
  *
- * 性能：RO 监听行 / label / trailing（active 时时间让位不改变行宽，必须听内部）；
- * 回调经 rAF 合并；缓存 maxWidth / trailingWidth / 裁切结果。
+ * 测量走 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, /** active 时时间让位 / 字重变化，需强制重测 */
+typeIconRef, /** trailing 宽度 / 字重变化，需强制重测 */
 layoutKey) {
-  var _useState = useState(title),
-    _useState2 = _slicedToArray(_useState, 2),
-    fitted = _useState2[0],
-    setFitted = _useState2[1];
   useLayoutEffect(function () {
-    var _document$fonts, _label$closest;
+    var _measure, _document$fonts, _label$closest;
+    var titleEl = titleRef.current;
+    if (!titleEl) return;
+
+    // React 渲染的是完整标题；未启用拟合时保持原样，交给 CSS text-overflow
     if (!enabled) {
-      setFitted(title);
+      titleEl.textContent = title;
+      titleEl.removeAttribute(TITLE_FITTED_ATTR);
       return;
     }
     var label = labelRef.current;
-    var titleEl = titleRef.current;
-    if (!label || !titleEl) return;
+    if (!label) return;
 
-    // 标题变更时先回到原文，避免沿用上一会话裁成的「…」
-    setFitted(title);
+    // 先回到原文，避免沿用上一会话裁成的「…」，也保证按完整标题取字体
+    titleEl.textContent = title;
+    var titleCs = getComputedStyle(titleEl);
+    var metrics = measureFit(title, ELLIPSIS, {
+      font: resolveFont(titleCs),
+      letterSpacing: Number.parseFloat(titleCs.letterSpacing) || 0
+    });
     var cancelled = false;
-    var rafId = 0;
+    var scheduled = false;
     var lastMaxWidth = Number.NaN;
     var lastTrailingWidth = Number.NaN;
     var lastFitted = title;
-    var probe = document.createElement('span');
-    probe.setAttribute('aria-hidden', 'true');
-    probe.style.cssText = 'position:absolute;visibility:hidden;pointer-events:none;white-space:nowrap;left:-9999px;top:0;';
-    var syncProbeFont = function syncProbeFont() {
-      var cs = getComputedStyle(titleEl);
-      probe.style.fontFamily = cs.fontFamily;
-      probe.style.fontSize = cs.fontSize;
-      probe.style.fontWeight = cs.fontWeight;
-      probe.style.fontStyle = cs.fontStyle;
-      probe.style.letterSpacing = cs.letterSpacing;
-      probe.style.fontFeatureSettings = cs.fontFeatureSettings;
-      probe.style.fontVariationSettings = cs.fontVariationSettings;
+    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);
     };
-    var measure = function measure(text) {
-      probe.textContent = text;
-      return probe.getBoundingClientRect().width;
+
+    /**
+     * gap 与 trailing / typeIcon 的宽度在同一个 effect 周期内是常量：
+     * 所有会改变它们的条件（选中、菜单开合、时间文案、状态、类型 icon）
+     * 都在 layoutKey 里，变化时 effect 会整体重跑。
+     * 拖拽时因此只需读行内标题区的宽度，省掉每帧每项的 getComputedStyle。
+     */
+    var gap = Number.NaN;
+    var trailingWidth = 0;
+    var typeWidth = 0;
+    var readStatics = function readStatics() {
+      var _trailingRef$current$, _trailingRef$current, _typeIconRef$current$, _typeIconRef$current;
+      var cs = getComputedStyle(label);
+      gap = Number.parseFloat(cs.columnGap || cs.gap) || 0;
+      trailingWidth = (_trailingRef$current$ = (_trailingRef$current = trailingRef.current) === null || _trailingRef$current === void 0 ? void 0 : _trailingRef$current.getBoundingClientRect().width) !== null && _trailingRef$current$ !== void 0 ? _trailingRef$current$ : 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 fit = function fit() {
-      var _trailing$getBounding, _typeIcon$getBounding;
+
+    /**
+     * 只读布局，返回写入回调交由批处理统一执行。
+     * 这里不能直接改 DOM：同帧内还有其他实例要读，写入会让它们的读重新排版。
+     */
+    var measure = function measure() {
       if (cancelled) return;
-      syncProbeFont();
-      if (!probe.isConnected) document.body.appendChild(probe);
-      var cs = getComputedStyle(label);
-      var gap = Number.parseFloat(cs.columnGap || cs.gap) || 0;
-      var trailing = trailingRef.current;
-      var typeIcon = typeIconRef.current;
-      var trailingWidth = (_trailing$getBounding = trailing === null || trailing === void 0 ? void 0 : trailing.getBoundingClientRect().width) !== null && _trailing$getBounding !== void 0 ? _trailing$getBounding : 0;
-      var typeWidth = (_typeIcon$getBounding = typeIcon === null || typeIcon === void 0 ? void 0 : typeIcon.getBoundingClientRect().width) !== null && _typeIcon$getBounding !== void 0 ? _typeIcon$getBounding : 0;
+      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);
@@ -94,71 +123,58 @@ layoutKey) {
       if (maxWidth < FIT_MIN_RELIABLE_WIDTH) {
         lastMaxWidth = Number.NaN;
         lastTrailingWidth = Number.NaN;
-        if (lastFitted !== title) {
-          lastFitted = title;
-          setFitted(title);
-        }
-        return;
+        // 此刻 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 next = title;
-      if (measure(title) > maxWidth + FIT_WIDTH_EPS) {
-        var lo = 0;
-        var hi = title.length;
-        next = title;
-        while (lo <= hi) {
-          var mid = lo + hi >> 1;
-          var candidate = "".concat(title.slice(0, mid)).concat(ELLIPSIS);
-          if (measure(candidate) <= maxWidth + FIT_WIDTH_EPS) {
-            next = candidate;
-            lo = mid + 1;
-          } else {
-            hi = mid - 1;
-          }
-        }
-        // 极端窄宽仍放不下「字+…」时交给 CSS ellipsis，保留原文
-        if (next === ELLIPSIS || next === title && measure(title) > maxWidth + FIT_WIDTH_EPS) {
-          var withEllipsis = "".concat(title.slice(0, 1)).concat(ELLIPSIS);
-          next = measure(withEllipsis) <= maxWidth + FIT_WIDTH_EPS ? withEllipsis : title;
-        }
-      }
-      if (next === lastFitted) return;
+      var _fitToWidth = fitToWidth(metrics, maxWidth + FIT_WIDTH_EPS, title, ELLIPSIS),
+        next = _fitToWidth.text,
+        accurate = _fitToWidth.accurate;
+      if (next === lastFitted && accurate === lastFitAccurate) return;
       lastFitted = next;
-      setFitted(next);
+      lastFitAccurate = accurate;
+      return function () {
+        return applyFit(next, accurate);
+      };
     };
     var scheduleFit = function scheduleFit() {
-      if (cancelled || rafId) return;
-      rafId = window.requestAnimationFrame(function () {
-        rafId = 0;
-        fit();
+      if (cancelled || scheduled) return;
+      scheduled = true;
+      scheduleLayoutBatch(function () {
+        scheduled = false;
+        return measure();
       });
     };
 
-    // 首屏同步裁切，避免首帧闪全标题；后续宽度变化走 rAF 合并
-    fit();
+    // 首屏同步裁切，避免首帧闪全标题；后续宽度变化走批处理合并
+    (_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 缓存强制重测
+      // 字体就绪后字形宽度可能变，需重新预算并绕过 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 ro = new ResizeObserver(scheduleFit);
-    ro.observe(row);
-    ro.observe(label);
-    var trailing = trailingRef.current;
-    if (trailing) ro.observe(trailing);
-    var typeIcon = typeIconRef.current;
-    if (typeIcon) ro.observe(typeIcon);
+    var stopObserving = observeResize(row, scheduleFit);
     return function () {
+      // 批处理队列里可能仍排着本实例的读回调，靠 cancelled 短路即可
       cancelled = true;
-      if (rafId) window.cancelAnimationFrame(rafId);
-      ro.disconnect();
-      probe.remove();
+      stopObserving();
     };
   }, [title, enabled, layoutKey, labelRef, titleRef, trailingRef, typeIconRef]);
-  return enabled ? fitted : title;
 }
 function ChatItemStatus(_ref) {
   var status = _ref.status;
@@ -204,18 +220,28 @@ function ChatItemStatus(_ref) {
   }));
 }
 function useControllableState(controlled, defaultValue, onChange) {
-  var _useState3 = useState(defaultValue),
-    _useState4 = _slicedToArray(_useState3, 2),
-    internal = _useState4[0],
-    setInternal = _useState4[1];
+  var _useState = useState(defaultValue),
+    _useState2 = _slicedToArray(_useState, 2),
+    internal = _useState2[0],
+    setInternal = _useState2[1];
   var value = controlled !== null && controlled !== void 0 ? controlled : internal;
-  var setValue = function setValue(next) {
-    onChange === null || onChange === void 0 || onChange(next);
-    if (controlled === undefined) setInternal(next);
+  // 每次渲染新建 setValue 会让下游 memo 组件（Dropdown / 菜单项）全部失效
+  var latest = useRef({
+    controlled: controlled,
+    onChange: onChange
+  });
+  latest.current = {
+    controlled: controlled,
+    onChange: onChange
   };
+  var setValue = useCallback(function (next) {
+    var _latest$current$onCha, _latest$current;
+    (_latest$current$onCha = (_latest$current = latest.current).onChange) === null || _latest$current$onCha === void 0 || _latest$current$onCha.call(_latest$current, next);
+    if (latest.current.controlled === undefined) setInternal(next);
+  }, []);
   return [value, setValue];
 }
-export function ChatItem(_ref2) {
+function ChatItemInner(_ref2) {
   var id = _ref2.id,
     title = _ref2.title,
     active = _ref2.active,
@@ -246,10 +272,10 @@ export function ChatItem(_ref2) {
     _useControllableState2 = _slicedToArray(_useControllableState, 2),
     renaming = _useControllableState2[0],
     setRenaming = _useControllableState2[1];
-  var _useState5 = useState(title),
-    _useState6 = _slicedToArray(_useState5, 2),
-    draft = _useState6[0],
-    setDraft = _useState6[1];
+  var _useState3 = useState(title),
+    _useState4 = _slicedToArray(_useState3, 2),
+    draft = _useState4[0],
+    setDraft = _useState4[1];
   var _useControllableState3 = useControllableState(deleteOpenProp, defaultDeleteOpen, onDeleteOpenChange),
     _useControllableState4 = _slicedToArray(_useControllableState3, 2),
     deleteOpen = _useControllableState4[0],
@@ -258,12 +284,12 @@ export function ChatItem(_ref2) {
     _useControllableState6 = _slicedToArray(_useControllableState5, 2),
     menuOpen = _useControllableState6[0],
     setMenuOpen = _useControllableState6[1];
-  var _useState7 = useState(function () {
+  var _useState5 = useState(function () {
       return Date.now();
     }),
-    _useState8 = _slicedToArray(_useState7, 2),
-    now = _useState8[0],
-    setNow = _useState8[1];
+    _useState6 = _slicedToArray(_useState5, 2),
+    now = _useState6[0],
+    setNow = _useState6[1];
   var inputRef = useRef(null);
   var labelRef = useRef(null);
   var titleRef = useRef(null);
@@ -278,8 +304,9 @@ export function ChatItem(_ref2) {
   var showTime = Boolean(timeLabel);
   var showTrailing = showStatus || showTime;
   var fitTitle = showTypeIcon || showTrailing;
-  var displayTitle = useFittedTitle(title, fitTitle, labelRef, titleRef, trailingRef, typeIconRef, // active / 菜单开合都会改时间让位与字重，行宽可能不变
-  "".concat(active ? 1 : 0, ":").concat(menuOpen ? 1 : 0));
+  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));
   useEffect(function () {
     if (!renaming) setDraft(title);
   }, [title, renaming]);
@@ -316,19 +343,21 @@ export function ChatItem(_ref2) {
     setDraft(title);
     setRenaming(false);
   };
-  var actionMenu = [].concat(_toConsumableArray(onRename ? [{
-    value: 'rename',
-    label: '修改名称',
-    icon: 'pencil-line'
-  }] : []), _toConsumableArray(onPin ? [{
-    value: 'pin',
-    label: pinned ? '取消置顶' : '置顶',
-    icon: 'arrow-up-to-line'
-  }] : []), _toConsumableArray(onDelete ? [{
-    value: 'delete',
-    label: '删除',
-    icon: 'trash-2'
-  }] : []));
+  var actionMenu = useMemo(function () {
+    return [].concat(_toConsumableArray(onRename ? [{
+      value: 'rename',
+      label: '修改名称',
+      icon: 'pencil-line'
+    }] : []), _toConsumableArray(onPin ? [{
+      value: 'pin',
+      label: pinned ? '取消置顶' : '置顶',
+      icon: 'arrow-up-to-line'
+    }] : []), _toConsumableArray(onDelete ? [{
+      value: 'delete',
+      label: '删除',
+      icon: 'trash-2'
+    }] : []));
+  }, [onRename, onPin, onDelete, pinned]);
   return /*#__PURE__*/React.createElement(HoverFill, {
     "data-odn-chat-item": true,
     "data-odn-chat-item-id": id,
@@ -374,9 +403,8 @@ export function ChatItem(_ref2) {
     ref: titleRef,
     "data-odn-chat-item-title": true,
     "data-odn-chat-item-title-bold": active ? '' : undefined,
-    "data-odn-chat-item-title-fitted": fitTitle ? '' : undefined,
     title: title
-  }, displayTitle), showTypeIcon ? /*#__PURE__*/React.createElement("span", {
+  }, title), showTypeIcon ? /*#__PURE__*/React.createElement("span", {
     ref: typeIconRef,
     "data-odn-chat-item-type-icon": true,
     "aria-label": "\u4EBA\u5DE5\u5BA2\u670D\u4F1A\u8BDD",
@@ -446,6 +474,14 @@ export function ChatItem(_ref2) {
     }
   })));
 }
+
+/**
+ * 会话列表项。
+ *
+ * memo：列表里单项 hover / 选中会触发父级重渲染，未 memo 时其余项会一并
+ * 重跑 render 与相对时间计算。父级需传入稳定的回调引用才能生效。
+ */
+export var ChatItem = /*#__PURE__*/memo(ChatItemInner);
 ChatItem.displayName = 'ChatItem';
 export default ChatItem;
 export { formatRelativeTime } from "./relative-time";

package/dist/composer/index.d.ts

@@ -28,10 +28,10 @@ export interface ComposerToolConfig {
 }
 /**
  * Composer 向内嵌 SkillSlot 透传的配置袋。
- * 技能目录（skills / skillGroups）应由「技能管理」模块维护后注入此处；
- * Composer 只负责触发入口与选中后插入 chip，不是目录 SSOT。
+ * 技能目录（skills）应由「技能管理」模块维护后注入此处；
+ * 菜单宽高由 Composer 按输入框与视口计算，不经本袋覆盖。
  */
-export type ComposerSkillSlotProps = Pick<SkillSlotProps, 'skills' | 'skillGroups' | 'showGroupTitles' | 'menuMaxHeight' | 'menuWidth' | 'onManageSkills' | 'skillManageFooter'>;
+export type ComposerSkillSlotProps = Pick<SkillSlotProps, 'skills' | 'onManageSkills' | 'skillManageFooter'>;
 export interface ComposerRef {
     /** 聚焦输入框 */
     focus: (options?: FocusOptions) => void;
@@ -156,6 +156,7 @@ export interface ComposerProps {
     /**
      * 向内嵌 SkillSlot 透传的配置袋。
      * 技能目录由业务 / 技能管理模块维护后注入；Composer 只负责触发入口与插入 chip。
+     * 菜单宽高由 Composer 按输入框与视口计算，不经本袋覆盖。
      */
     skillSlotProps?: ComposerSkillSlotProps;
     /**

package/dist/composer/index.js

@@ -20,7 +20,7 @@ import { COMPOSER_EDITOR_MAX_ROWS_PX, ComposerEditor } from "./editor";
 import { chipHasEditableParams, isMentionChip } from "./inline-ref";
 import { rawValueToSegments, segmentsHasContent } from "./segments";
 import "./style";
-import { filterSkillsByQuery, resolveComposerSkillMenuWidth, shouldOpenSlashTriggerMenu } from "./utils";
+import { COMPOSER_SKILL_MENU_DENSITY_CAP_PX, filterSkillsByQuery, resolveComposerSkillMenuMaxHeight, resolveComposerSkillMenuWidth, shouldOpenSlashTriggerMenu } from "./utils";
 function createInvocationChipData(skill) {
   return {
     id: "skill-".concat(skill.id, "-").concat(Date.now().toString(36), "-").concat(Math.random().toString(36).slice(2, 6)),
@@ -92,12 +92,12 @@ var DEFAULT_TOOL_CONFIGS = {
 
 /**
  * Composer 向内嵌 SkillSlot 透传的配置袋。
- * 技能目录（skills / skillGroups）应由「技能管理」模块维护后注入此处；
- * Composer 只负责触发入口与选中后插入 chip，不是目录 SSOT。
+ * 技能目录（skills）应由「技能管理」模块维护后注入此处；
+ * 菜单宽高由 Composer 按输入框与视口计算，不经本袋覆盖。
  */
 
 export var Composer = /*#__PURE__*/forwardRef(function Composer(_ref, ref) {
-  var _filteredSkillGroups$, _filteredSkills$lengt, _paramEdit$chipId;
+  var _filteredSkills$lengt, _paramEdit$chipId;
   var valueProp = _ref.value,
     _ref$defaultValue = _ref.defaultValue,
     defaultValue = _ref$defaultValue === void 0 ? '' : _ref$defaultValue,
@@ -147,11 +147,8 @@ export var Composer = /*#__PURE__*/forwardRef(function Composer(_ref, ref) {
     className = _ref.className,
     style = _ref.style;
   var skills = skillSlotProps === null || skillSlotProps === void 0 ? void 0 : skillSlotProps.skills;
-  var skillGroups = skillSlotProps === null || skillSlotProps === void 0 ? void 0 : skillSlotProps.skillGroups;
   var onManageSkills = skillSlotProps === null || skillSlotProps === void 0 ? void 0 : skillSlotProps.onManageSkills;
   var skillManageFooter = skillSlotProps === null || skillSlotProps === void 0 ? void 0 : skillSlotProps.skillManageFooter;
-  var resolvedMenuMaxHeight = skillSlotProps === null || skillSlotProps === void 0 ? void 0 : skillSlotProps.menuMaxHeight;
-  var showGroupTitles = skillSlotProps === null || skillSlotProps === void 0 ? void 0 : skillSlotProps.showGroupTitles;
   var _useControlledState = useControlledState(defaultValue, valueProp),
     _useControlledState2 = _slicedToArray(_useControlledState, 2),
     text = _useControlledState2[0],
@@ -216,11 +213,15 @@ export var Composer = /*#__PURE__*/forwardRef(function Composer(_ref, ref) {
     _useState18 = _slicedToArray(_useState17, 2),
     skillMenuCrossAxis = _useState18[0],
     setSkillMenuCrossAxis = _useState18[1];
-  /** composer box 实宽；技能菜单默认比它略窄。显式 menuWidth 覆盖。 */
+  /** composer box 实宽；技能菜单比它略窄。 */
   var _useState19 = useState(0),
     _useState20 = _slicedToArray(_useState19, 2),
     boxWidth = _useState20[0],
     setBoxWidth = _useState20[1];
+  var _useState21 = useState(COMPOSER_SKILL_MENU_DENSITY_CAP_PX),
+    _useState22 = _slicedToArray(_useState21, 2),
+    skillMenuMaxHeight = _useState22[0],
+    setSkillMenuMaxHeight = _useState22[1];
   useLayoutEffect(function () {
     var el = boxRef.current;
     if (!el) return undefined;
@@ -238,7 +239,7 @@ export var Composer = /*#__PURE__*/forwardRef(function Composer(_ref, ref) {
       return ro.disconnect();
     };
   }, []);
-  var resolvedMenuWidth = resolveComposerSkillMenuWidth(skillSlotProps === null || skillSlotProps === void 0 ? void 0 : skillSlotProps.menuWidth, boxWidth);
+  var resolvedMenuWidth = resolveComposerSkillMenuWidth(boxWidth);
   var handleComposerMouseDown = useCallback(function (event) {
     var _editorRef$current;
     if (disabled || event.button !== 0) return;
@@ -254,10 +255,10 @@ export var Composer = /*#__PURE__*/forwardRef(function Composer(_ref, ref) {
       preventScroll: true
     });
   }, [disabled]);
-  var _useState21 = useState(null),
-    _useState22 = _slicedToArray(_useState21, 2),
-    paramEdit = _useState22[0],
-    setParamEdit = _useState22[1];
+  var _useState23 = useState(null),
+    _useState24 = _slicedToArray(_useState23, 2),
+    paramEdit = _useState24[0],
+    setParamEdit = _useState24[1];
   var openParamPanel = useCallback(function (chipId) {
     if (!renderParamPanel) return;
     requestAnimationFrame(function () {
@@ -598,10 +599,10 @@ export var Composer = /*#__PURE__*/forwardRef(function Composer(_ref, ref) {
      * 不夺回焦点时 Enter 会再次激活按钮而不是发送 */
     (_editorRef$current15 = editorRef.current) === null || _editorRef$current15 === void 0 || _editorRef$current15.focus();
   };
-  var _useState23 = useState(false),
-    _useState24 = _slicedToArray(_useState23, 2),
-    fileDragOver = _useState24[0],
-    setFileDragOver = _useState24[1];
+  var _useState25 = useState(false),
+    _useState26 = _slicedToArray(_useState25, 2),
+    fileDragOver = _useState26[0],
+    setFileDragOver = _useState26[1];
   var composerBoxFileDragAttrs = fileDragOver ? {
     'data-odn-composer-file-drag': ''
   } : {};
@@ -661,40 +662,22 @@ export var Composer = /*#__PURE__*/forwardRef(function Composer(_ref, ref) {
     return filterSkillsByQuery(skills, slashTriggerQuery);
   }, [skills, slashTriggerActive, slashTriggerQuery]);
 
-  /* grouped 版本的 trigger query 筛选：按组分别过滤，保留非空组。 */
-  var filteredSkillGroups = useMemo(function () {
-    if (!skillGroups) return undefined;
-    if (!slashTriggerActive) return [];
-    return skillGroups.map(function (g) {
-      return {
-        groupName: g.groupName,
-        skills: filterSkillsByQuery(g.skills, slashTriggerQuery)
-      };
-    }).filter(function (g) {
-      return g.skills.length > 0;
-    });
-  }, [skillGroups, slashTriggerActive, slashTriggerQuery]);
-
   /* trigger 浮层：`/` 触发态 + 目录非空 + 过滤后仍有命中。
    * 无匹配时菜单关闭，Enter 不再被当成「选 skill」。`@` 本轮不接。 */
-  var hasSkills = !!(skills && skills.length > 0) || !!(skillGroups && skillGroups.length > 0);
-  var triggerHitCount = skillGroups ? (_filteredSkillGroups$ = filteredSkillGroups === null || filteredSkillGroups === void 0 ? void 0 : filteredSkillGroups.reduce(function (n, g) {
-    return n + g.skills.length;
-  }, 0)) !== null && _filteredSkillGroups$ !== void 0 ? _filteredSkillGroups$ : 0 : (_filteredSkills$lengt = filteredSkills === null || filteredSkills === void 0 ? void 0 : filteredSkills.length) !== null && _filteredSkills$lengt !== void 0 ? _filteredSkills$lengt : 0;
+  var hasSkills = !!(skills && skills.length > 0);
+  var triggerHitCount = (_filteredSkills$lengt = filteredSkills === null || filteredSkills === void 0 ? void 0 : filteredSkills.length) !== null && _filteredSkills$lengt !== void 0 ? _filteredSkills$lengt : 0;
   var triggerMenuVisible = shouldOpenSlashTriggerMenu(triggerInfo === null || triggerInfo === void 0 ? void 0 : triggerInfo.trigger, hasSkills ? triggerHitCount : 0);
 
   /* query 变化或浮层关闭 → 高亮项重置到「最上方的可用项」（跳过 disabled）。
    * 用 query 而不是 triggerInfo 整体当依赖：rect 变化（光标移位）不应该 reset。 */
   useEffect(function () {
-    var _ref3, _ref4, _ref5;
-    var list = (_ref3 = (_ref4 = filteredSkills !== null && filteredSkills !== void 0 ? filteredSkills : skills) !== null && _ref4 !== void 0 ? _ref4 : (_ref5 = filteredSkillGroups !== null && filteredSkillGroups !== void 0 ? filteredSkillGroups : skillGroups) === null || _ref5 === void 0 ? void 0 : _ref5.flatMap(function (g) {
-      return g.skills;
-    })) !== null && _ref3 !== void 0 ? _ref3 : [];
+    var _ref3;
+    var list = (_ref3 = filteredSkills !== null && filteredSkills !== void 0 ? filteredSkills : skills) !== null && _ref3 !== void 0 ? _ref3 : [];
     var first = list.findIndex(function (s) {
       return !s.disabled;
     });
     setTriggerActiveIndex(first === -1 ? 0 : first);
-  }, [filteredSkills, filteredSkillGroups, skills, skillGroups, triggerInfo === null || triggerInfo === void 0 ? void 0 : triggerInfo.query, triggerInfo === null]);
+  }, [filteredSkills, skills, triggerInfo === null || triggerInfo === void 0 ? void 0 : triggerInfo.query, triggerInfo === null]);
 
   /* editor 在 trigger 激活时把 ↑↓Enter Esc Tab 丢过来。返回 true = editor 别管了。
    * - ↑↓ 改高亮 index（夹在 [0, max] 内）
@@ -718,11 +701,9 @@ export var Composer = /*#__PURE__*/forwardRef(function Composer(_ref, ref) {
       return true;
     }
     if (e.key === 'Enter' && !e.shiftKey || e.key === 'Tab') {
-      var _ref6, _triggerSkillSlotRef$3, _triggerSkillSlotRef$4;
+      var _triggerSkillSlotRef$3, _triggerSkillSlotRef$4;
       e.preventDefault();
-      var _skill = (_ref6 = (_triggerSkillSlotRef$3 = (_triggerSkillSlotRef$4 = triggerSkillSlotRef.current) === null || _triggerSkillSlotRef$4 === void 0 ? void 0 : _triggerSkillSlotRef$4.getActiveSkill()) !== null && _triggerSkillSlotRef$3 !== void 0 ? _triggerSkillSlotRef$3 : filteredSkills === null || filteredSkills === void 0 ? void 0 : filteredSkills[triggerActiveIndex]) !== null && _ref6 !== void 0 ? _ref6 : filteredSkillGroups === null || filteredSkillGroups === void 0 ? void 0 : filteredSkillGroups.flatMap(function (g) {
-        return g.skills;
-      })[triggerActiveIndex];
+      var _skill = (_triggerSkillSlotRef$3 = (_triggerSkillSlotRef$4 = triggerSkillSlotRef.current) === null || _triggerSkillSlotRef$4 === void 0 ? void 0 : _triggerSkillSlotRef$4.getActiveSkill()) !== null && _triggerSkillSlotRef$3 !== void 0 ? _triggerSkillSlotRef$3 : filteredSkills === null || filteredSkills === void 0 ? void 0 : filteredSkills[triggerActiveIndex];
       if (!_skill) return false;
       handleSelectSkill(_skill, 'trigger');
       return true;
@@ -735,7 +716,7 @@ export var Composer = /*#__PURE__*/forwardRef(function Composer(_ref, ref) {
       return true;
     }
     return false;
-  }, [filteredSkills, filteredSkillGroups, handleSelectSkill, triggerActiveIndex, triggerMenuVisible]);
+  }, [filteredSkills, handleSelectSkill, triggerActiveIndex, triggerMenuVisible]);
 
   /* ---- Derived ---- */
   var hasUploadingAttachment = attachments.some(function (a) {
@@ -757,6 +738,30 @@ export var Composer = /*#__PURE__*/forwardRef(function Composer(_ref, ref) {
     var boxRect = box.getBoundingClientRect();
     el.style.top = "".concat(triggerInfo.rect.top - boxRect.top, "px");
   }, [triggerInfo]);
+  useLayoutEffect(function () {
+    if (!toolMenuOpen && !triggerMenuVisible) return undefined;
+    var sync = function sync() {
+      var _skillTriggerRef$curr, _skillTriggerRef$curr2, _ref4, _triggerInfo$rect$top, _triggerAnchorRef$cur;
+      var triggerTop = toolMenuOpen ? (_skillTriggerRef$curr = (_skillTriggerRef$curr2 = skillTriggerRef.current) === null || _skillTriggerRef$curr2 === void 0 ? void 0 : _skillTriggerRef$curr2.getBoundingClientRect().top) !== null && _skillTriggerRef$curr !== void 0 ? _skillTriggerRef$curr : null : (_ref4 = (_triggerInfo$rect$top = triggerInfo === null || triggerInfo === void 0 ? void 0 : triggerInfo.rect.top) !== null && _triggerInfo$rect$top !== void 0 ? _triggerInfo$rect$top : (_triggerAnchorRef$cur = triggerAnchorRef.current) === null || _triggerAnchorRef$cur === void 0 ? void 0 : _triggerAnchorRef$cur.getBoundingClientRect().top) !== null && _ref4 !== void 0 ? _ref4 : null;
+      if (triggerTop === null) return;
+      var next = resolveComposerSkillMenuMaxHeight({
+        triggerTop: triggerTop,
+        viewportHeight: window.innerHeight
+      });
+      setSkillMenuMaxHeight(function (prev) {
+        return prev === next ? prev : next;
+      });
+    };
+    sync();
+    window.addEventListener('resize', sync);
+    var box = boxRef.current;
+    var ro = box && typeof ResizeObserver !== 'undefined' ? new ResizeObserver(sync) : null;
+    if (box) ro === null || ro === void 0 || ro.observe(box);
+    return function () {
+      window.removeEventListener('resize', sync);
+      ro === null || ro === void 0 || ro.disconnect();
+    };
+  }, [toolMenuOpen, triggerMenuVisible, triggerInfo === null || triggerInfo === void 0 ? void 0 : triggerInfo.rect.top]);
   useLayoutEffect(function () {
     var box = boxRef.current;
     var trigger = skillTriggerRef.current;
@@ -907,9 +912,7 @@ export var Composer = /*#__PURE__*/forwardRef(function Composer(_ref, ref) {
     }), showLabel && /*#__PURE__*/React.createElement("span", null, label))));
   };
   var renderSkillBtn = function renderSkillBtn() {
-    var hasAnySkills = skills && skills.length > 0 || skillGroups && skillGroups.some(function (g) {
-      return g.skills.length > 0;
-    });
+    var hasAnySkills = skills && skills.length > 0;
     if (!hasAnySkills) return null;
     var _resolvedToolConfigs$3 = resolvedToolConfigs.skill,
       icon = _resolvedToolConfigs$3.icon,
@@ -946,10 +949,8 @@ export var Composer = /*#__PURE__*/forwardRef(function Composer(_ref, ref) {
         key: toolMenuOpen ? 'open' : 'closed',
         variant: "menu",
         searchable: true,
-        skills: skillGroups ? undefined : skills,
-        skillGroups: skillGroups,
-        showGroupTitles: showGroupTitles,
-        menuMaxHeight: resolvedMenuMaxHeight,
+        skills: skills,
+        menuMaxHeight: skillMenuMaxHeight,
         menuWidth: resolvedMenuWidth,
         onSelect: function onSelect(s) {
           return handleSelectSkill(s, 'btn');
@@ -1164,12 +1165,10 @@ export var Composer = /*#__PURE__*/forwardRef(function Composer(_ref, ref) {
     popup: /*#__PURE__*/React.createElement(SkillSlot, {
       ref: triggerSkillSlotRef,
       variant: "menu",
-      skills: skillGroups ? undefined : filteredSkills !== null && filteredSkills !== void 0 ? filteredSkills : [],
-      skillGroups: filteredSkillGroups,
-      showGroupTitles: showGroupTitles,
+      skills: filteredSkills !== null && filteredSkills !== void 0 ? filteredSkills : [],
       activeIndex: triggerActiveIndex,
       onActiveIndexChange: setTriggerActiveIndex,
-      menuMaxHeight: resolvedMenuMaxHeight,
+      menuMaxHeight: skillMenuMaxHeight,
       menuWidth: resolvedMenuWidth,
       onSelect: function onSelect(s) {
         return handleSelectSkill(s, 'trigger');