one-design-next 0.0.115 → 0.0.116

package/dist/composer/editor.js

@@ -29,7 +29,7 @@ import { useChipManager } from "./hooks/useChipManager";
 import { useChipSelectionMarker } from "./hooks/useChipSelectionMarker";
 import { chipHasEditableParams, ComposerInlineRef } from "./inline-ref";
 import { resolveHintTarget } from "./segments";
-import { COMPOSER_HINT_ATTR, createLineRoot, createLineRootWithText, ensureCaretAnchorAfter, ensureLineRoots, getPlainText, isEditorEmpty, isLineRoot, LINE_ATTR_NAME, normalizeEditorDom, probeTrigger, stripInvisibleChars, ZWSP } from "./utils";
+import { COMPOSER_HINT_ACCEPT_ATTR, COMPOSER_HINT_ACCEPT_SELECTOR, COMPOSER_HINT_ATTR, createLineRoot, createLineRootWithText, ensureCaretAnchorAfter, ensureLineRoots, getPlainText, isEditorEmpty, isLineRoot, LINE_ATTR_NAME, normalizeEditorDom, probeTrigger, stripInvisibleChars, ZWSP } from "./utils";
 
 /** Composer editor 触发态对外信号——告诉父组件该弹浮层选 skill 了。 */
 
@@ -98,6 +98,34 @@ var findDirectHint = function findDirectHint(line) {
   return null;
 };
 
+/**
+ * hint 末尾的「TAB 采纳」小块：点它 = 按 Tab 采纳这段模板文案。
+ *
+ * 与 hint 文本是同级节点（见 `COMPOSER_HINT_ACCEPT_ATTR` 的说明），由
+ * `syncHintNode` 一起插入 / 移除，不进 value / 剪贴板 / segments。
+ * 视觉在 `style/index.scss`（`[data-odn-composer-hint-accept]`）。
+ */
+var createHintAcceptNode = function createHintAcceptNode() {
+  var accept = document.createElement('span');
+  accept.setAttribute(COMPOSER_HINT_ACCEPT_ATTR, '');
+  accept.contentEditable = 'false';
+  /* 刻意不加 role="button" / aria-label / title：
+   * - 它不可聚焦、也没有 Enter/Space 激活逻辑，挂 button 语义等于给读屏用户
+   *   一个按不动的控件（无障碍反而变成障碍）。真正的键盘路径就是它写着的
+   *   Tab 键本身，可见文案已经说清动作。
+   * - aria-label 会盖掉可见文案，反而违反「可见标签即无障碍名」。
+   * - title 是浏览器原生 tooltip：延迟出现、样式不可控、会盖住灰字。 */
+
+  var key = document.createElement('span');
+  key.setAttribute('data-odn-composer-hint-accept-key', '');
+  key.textContent = 'TAB';
+  var label = document.createElement('span');
+  label.setAttribute('data-odn-composer-hint-accept-label', '');
+  label.textContent = '采纳';
+  accept.append(key, label);
+  return accept;
+};
+
 /**
  * insertContent 的插入点：最后一个行容器的内容末尾。
  *
@@ -359,12 +387,18 @@ export var ComposerEditor = /*#__PURE__*/forwardRef(function ComposerEditor(_ref
    * 就不存在了，caret 只能落在整个 host 之后（= 提示文本末尾）。
    *
    * 它不归 React 管（editor 的 children 由 contenteditable 自治），由 fireChange
-   * 按结构谓词增删/挪位；`getPlainText` 会整棵子树跳过，所以不进 value / 剪贴板。 */
+   * 按结构谓词增删/挪位；`getPlainText` 会整棵子树跳过，所以不进 value / 剪贴板。
+   *
+   * 末尾的「TAB 采纳」小块是 hint 文本的**兄弟节点**（不是子节点）：hint 的
+   * textContent 必须保持纯提示文案（采纳时直接落成正文，调试面板也按它读）。 */
   var hintNodeRef = useRef(null);
+  var hintAcceptNodeRef = useRef(null);
   var removeHintNode = useCallback(function () {
-    var _hintNodeRef$current;
+    var _hintNodeRef$current, _hintAcceptNodeRef$cu;
     (_hintNodeRef$current = hintNodeRef.current) === null || _hintNodeRef$current === void 0 || _hintNodeRef$current.remove();
     hintNodeRef.current = null;
+    (_hintAcceptNodeRef$cu = hintAcceptNodeRef.current) === null || _hintAcceptNodeRef$cu === void 0 || _hintAcceptNodeRef$cu.remove();
+    hintAcceptNodeRef.current = null;
   }, []);
   var syncHintNode = useCallback(function (target) {
     var _Array$from$find, _blankTail;
@@ -384,6 +418,11 @@ export var ComposerEditor = /*#__PURE__*/forwardRef(function ComposerEditor(_ref
       hintNodeRef.current = node;
     }
     if (node.textContent !== target.text) node.textContent = target.text;
+    var accept = hintAcceptNodeRef.current;
+    if (!accept || !accept.isConnected) {
+      accept = createHintAcceptNode();
+      hintAcceptNodeRef.current = accept;
+    }
 
     /* 落位：命中 chip 之后、**紧随其后的不可见锚点文本（ZWSP）之后**。
      *
@@ -398,8 +437,9 @@ export var ComposerEditor = /*#__PURE__*/forwardRef(function ComposerEditor(_ref
     var cur = host.nextSibling;
     while (cur) {
       var _cur$textContent;
-      // 跳过 hint 自身：上一轮若把它排到了锚点前面，这里顺手挪回末尾
-      if (cur === node) {
+      // 跳过 hint 自身与它的「TAB 采纳」小块：上一轮若排到了锚点前面，
+      // 这里顺手挪回末尾
+      if (cur === node || cur === accept) {
         cur = cur.nextSibling;
         continue;
       }
@@ -426,6 +466,12 @@ export var ComposerEditor = /*#__PURE__*/forwardRef(function ComposerEditor(_ref
     if (node.parentNode !== parent || node.previousSibling !== anchor) {
       parent.insertBefore(node, anchor.nextSibling);
     }
+    /* 「TAB 采纳」小块紧跟 hint 文案之后（同一套行内流），顺序必须是
+     * hint → 小块：caret 的合法落点只到 hint 之前，块本身
+     * contentEditable=false，不会成为落点。 */
+    if (accept.parentNode !== parent || accept.previousSibling !== node) {
+      parent.insertBefore(accept, node.nextSibling);
+    }
   }, [removeHintNode]);
 
   /** 把 caret 直接落到 hint 之前（= chip 右侧）；没有 hint 时不动。 */
@@ -530,26 +576,45 @@ export var ComposerEditor = /*#__PURE__*/forwardRef(function ComposerEditor(_ref
   recomputeTriggerRef.current = recomputeTrigger;
 
   /* ─────────────────────────────────────
-   * Tab 采纳 hint
+   * 采纳 hint（Tab / 点击「TAB 采纳」小块）
    *
    * hint 只是结构投影（不进 value）；caret 恰好停在 chip 与 hint 之间
    * （= 内容末尾）时按 Tab，表示用户接受这段模板，于是把提示文案落成正文：
    * chip 之后出现内容 → 结构谓词不再命中 → 灰字自动移除，onChange 抛出的
    * value 里带上这段文案，与用户自己敲进去的效果一致。
+   *
+   * 鼠标点末尾的「TAB 采纳」小块走**同一条链路**，只是带 `force`：
+   * 不要求点击前 caret 就停在 hint 之前，先把 caret 归位到 chip 右侧再落。
    * ───────────────────────────────────── */
-  var acceptHintAsText = useCallback(function () {
+  var acceptHintAsText = useCallback(function (options) {
     var _hint$textContent;
     var el = editorRef.current;
     var hint = hintNodeRef.current;
     var sel = window.getSelection();
-    if (!el || !hint || !hint.isConnected || !sel || sel.rangeCount === 0) {
-      return false;
+    if (!el || !hint || !hint.isConnected || !sel) return false;
+    var range;
+    if (options !== null && options !== void 0 && options.force) {
+      /* 点击路径：mousedown 已被 preventDefault，焦点 / caret 都还没进来，
+       * 先聚焦再把 caret 落到 hint 之前（= 内容末尾），避免原生落点乱跳。 */
+      el.focus({
+        preventScroll: true
+      });
+      var target = caretBeforeHintIn(el);
+      if (!target) return false;
+      range = document.createRange();
+      range.setStart(target.node, target.offset);
+      range.collapse(true);
+      sel.removeAllRanges();
+      sel.addRange(range);
+      lastEditorRangeRef.current = range.cloneRange();
+    } else {
+      if (sel.rangeCount === 0) return false;
+      range = sel.getRangeAt(0);
+      if (!range.collapsed || !el.contains(range.startContainer)) return false;
+      /* 只认「chip 之后、hint 之前」这一个落点；caret 在别处时 Tab 仍归浏览器，
+       * 避免在任意位置误吞焦点切换。 */
+      if (!isCaretBeforeHint(range, el)) return false;
     }
-    var range = sel.getRangeAt(0);
-    if (!range.collapsed || !el.contains(range.startContainer)) return false;
-    /* 只认「chip 之后、hint 之前」这一个落点；caret 在别处时 Tab 仍归浏览器，
-     * 避免在任意位置误吞焦点切换。 */
-    if (!isCaretBeforeHint(range, el)) return false;
     var text = (_hint$textContent = hint.textContent) !== null && _hint$textContent !== void 0 ? _hint$textContent : '';
     if (!text) return false;
 
@@ -566,6 +631,7 @@ export var ComposerEditor = /*#__PURE__*/forwardRef(function ComposerEditor(_ref
       caret.collapse(true);
       sel.removeAllRanges();
       sel.addRange(caret);
+      lastEditorRangeRef.current = caret.cloneRange();
     }
     fireChange();
     recomputeTrigger();
@@ -1061,6 +1127,17 @@ export var ComposerEditor = /*#__PURE__*/forwardRef(function ComposerEditor(_ref
     if (e.button !== 0 || disabled) return;
     // shift+click 是扩选，不劫持
     if (e.shiftKey) return;
+
+    /* 「TAB 采纳」小块：点它等价于按 Tab（同一条采纳链路），且不要求点击前
+     * caret 就停在 hint 之前。在 mousedown 阶段接管 + preventDefault，
+     * 原生 caret 一帧都不会落到 hint 之后。 */
+    if (e.target instanceof Element && e.target.closest(COMPOSER_HINT_ACCEPT_SELECTOR)) {
+      e.preventDefault();
+      acceptHintAsText({
+        force: true
+      });
+      return;
+    }
     var el = editorRef.current;
     var hint = hintNodeRef.current;
     if (!el || !hint || !hint.isConnected) return;
@@ -1091,7 +1168,7 @@ export var ComposerEditor = /*#__PURE__*/forwardRef(function ComposerEditor(_ref
     });
     placeCaretBeforeHint();
     requestScrollCaretIntoView();
-  }, [disabled, handlePointerInput, placeCaretBeforeHint, requestScrollCaretIntoView]);
+  }, [acceptHintAsText, disabled, handlePointerInput, placeCaretBeforeHint, requestScrollCaretIntoView]);
   var writeClipboardPayload = useCallback(function (e, payload) {
     if (!payload) return false;
     e.clipboardData.setData(COMPOSER_CLIPBOARD_MIME, JSON.stringify(payload));

package/dist/composer/style/index.css

@@ -309,6 +309,74 @@
   white-space: pre-wrap;
 }
 
+/* ------------------------------------------------------------------
+ * hint 末尾的「TAB 采纳」小块（点击 = 按 Tab 采纳，见 editor.tsx）
+ *
+ * 与 hint 文本是同级节点，一起增删。它不是正文：contentEditable=false、
+ * getPlainText 整棵跳过，点它走 force 版 acceptHintAsText。
+ * 尺寸对齐 Figma 9857:75425（62 × 22 / 圆角 6 / 内层键帽 28 × 16）：
+ *   - 编辑器固定 font-size 14 / line-height 24，块高 22 + top 1 → 视觉居中
+ *     且不撑高行盒（改编辑器行高时要同步调这个 1px）
+ *   - 底色 black-2(5%)、键帽 bg-elevated + black-5(12%) 1px 描边
+ * ----------------------------------------------------------------- */
+[data-odn-composer] [data-odn-composer-hint-accept] {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  gap: 3px;
+  box-sizing: border-box;
+  height: 22px;
+  margin: 1px 0 0 4px;
+  padding: 0 4px 0 3px;
+  border-radius: 6px;
+  background: var(--odn-color-black-2);
+  color: var(--odn-color-solid-black-9);
+  font-size: 12px;
+  line-height: 20px;
+  white-space: nowrap;
+  vertical-align: top;
+  cursor: pointer;
+  user-select: none;
+  pointer-events: auto;
+  transition: background 0.15s ease-out, color 0.15s ease-out;
+  /* 底部 5% 太淡，hover 抬到 12%（约 2.4 倍）并加深文字，让「可点」更明确；
+   * active 再深一档。 */
+}
+[data-odn-composer] [data-odn-composer-hint-accept]:hover {
+  background: var(--odn-color-black-5);
+  color: var(--odn-color-solid-black-10);
+}
+[data-odn-composer] [data-odn-composer-hint-accept]:active {
+  background: var(--odn-color-black-6);
+}
+
+[data-odn-composer] [data-odn-composer-hint-accept-key] {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  box-sizing: border-box;
+  height: 16px;
+  padding: 0 4px;
+  border: 1px solid var(--odn-color-black-5);
+  border-radius: 4px;
+  /* 与 composer box 同为「浮在底层之上的面」，跟随主题变量而不是写死白色 */
+  background: var(--odn-color-bg-elevated);
+  font-size: 10px;
+  line-height: 10px;
+  letter-spacing: 0;
+}
+
+[data-odn-composer] [data-odn-composer-hint-accept-label] {
+  font-size: 12px;
+  line-height: 20px;
+}
+
+/* 禁用态：hint 仍按内容结构展示，但小块不可点（与 editor 冻结一致） */
+[data-odn-composer] [data-odn-composer-editor][data-odn-composer-editor-disabled] [data-odn-composer-hint-accept] {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
 /* ------------------------------------------------------------------
  * Block 行模型（caret-rewrite step 1/5）
  *   editor 直接子节点都是 [data-composer-line] div，每行渲染为独立 block。

package/dist/composer/utils.d.ts

@@ -22,6 +22,15 @@ export declare const LINE_ATTR_NAME = "data-composer-line";
  */
 export declare const COMPOSER_HINT_ATTR = "data-odn-composer-skill-hint";
 export declare const COMPOSER_HINT_SELECTOR = "[data-odn-composer-skill-hint]";
+/**
+ * 派生 hint 末尾的「TAB 采纳」小块（可点击采纳）。
+ *
+ * 与 hint 文本是**兄弟节点**（不是子节点）：hint 自身的 `textContent` 必须
+ * 保持纯提示文案——采纳时直接把这段文字落成正文，且 `getPlainText` /
+ * 调试面板都按 textContent 读它。小块同样不是正文，遍历时整棵跳过。
+ */
+export declare const COMPOSER_HINT_ACCEPT_ATTR = "data-odn-composer-hint-accept";
+export declare const COMPOSER_HINT_ACCEPT_SELECTOR = "[data-odn-composer-hint-accept]";
 /** 是否是行容器。 */
 export declare function isLineRoot(node: Node | null | undefined): node is HTMLDivElement;
 /** 创建一个新的空行容器。 */

package/dist/composer/utils.js

@@ -39,6 +39,16 @@ export var LINE_ATTR_NAME = 'data-composer-line';
 export var COMPOSER_HINT_ATTR = 'data-odn-composer-skill-hint';
 export var COMPOSER_HINT_SELECTOR = "[".concat(COMPOSER_HINT_ATTR, "]");
 
+/**
+ * 派生 hint 末尾的「TAB 采纳」小块（可点击采纳）。
+ *
+ * 与 hint 文本是**兄弟节点**（不是子节点）：hint 自身的 `textContent` 必须
+ * 保持纯提示文案——采纳时直接把这段文字落成正文，且 `getPlainText` /
+ * 调试面板都按 textContent 读它。小块同样不是正文，遍历时整棵跳过。
+ */
+export var COMPOSER_HINT_ACCEPT_ATTR = 'data-odn-composer-hint-accept';
+export var COMPOSER_HINT_ACCEPT_SELECTOR = "[".concat(COMPOSER_HINT_ACCEPT_ATTR, "]");
+
 /** 是否是行容器。 */
 export function isLineRoot(node) {
   var _hasAttribute, _ref;
@@ -292,8 +302,8 @@ export function getPlainText(editor) {
   var out = '';
   var visit = function visit(node) {
     if (node instanceof HTMLElement) {
-      // 派生 hint 整棵子树都不是正文，直接跳过（含其内部文本节点）
-      if (node.hasAttribute(COMPOSER_HINT_ATTR)) return;
+      // 派生 hint（含末尾的「TAB 采纳」小块）整棵子树都不是正文，直接跳过
+      if (node.hasAttribute(COMPOSER_HINT_ATTR) || node.hasAttribute(COMPOSER_HINT_ACCEPT_ATTR)) return;
       var id = node.dataset[chipIdAttr];
       if (id) {
         out += createMarker(id);

package/dist/skill-slot/index.js

@@ -7,6 +7,7 @@ import Icon from "../icon";
 import Input from "../input";
 import Popover from "../popover";
 import { highlightQueryText } from "../stream-text/highlight-query-text";
+import Tooltip from "../tooltip";
 import "./style";
 function skillMatchesQuery(skill, query) {
   var _skill$description;
@@ -367,8 +368,15 @@ export var SkillSlot = /*#__PURE__*/forwardRef(function SkillSlot(_ref2, ref) {
   };
   var renderBarItem = function renderBarItem(skill) {
     var disabled = !!skill.disabled;
-    var barButton = /*#__PURE__*/React.createElement("button", {
+
+    /* bar 无行内描述：整条 bar 由外层 Tooltip.Group 共用一层浮层（暗色，见 style）。
+     * 这里只把「本项的描述」交给 Group，hover 绑定由 Group 自己挂到 button 上。 */
+    return /*#__PURE__*/React.createElement(Tooltip, {
       key: skill.id,
+      popup: skill.description ? /*#__PURE__*/React.createElement("span", {
+        "data-odn-skill-slot-desc-full": true
+      }, skill.description) : null
+    }, /*#__PURE__*/React.createElement("button", {
       type: "button",
       "data-odn-skill-slot-item": true,
       "data-odn-skill-slot-item-disabled": disabled || undefined,
@@ -379,21 +387,8 @@ export var SkillSlot = /*#__PURE__*/forwardRef(function SkillSlot(_ref2, ref) {
       }
     }, /*#__PURE__*/React.createElement(Icon, {
       name: skill.icon,
-      size: 14
-    }), skill.label);
-
-    /* bar 无行内描述：整颗 chip hover 0.5s 后向上 Popover 出全文 */
-    if (skill.description) {
-      return /*#__PURE__*/React.createElement(Popover, {
-        key: skill.id,
-        placement: "top",
-        mouseEnterDelay: 0.5,
-        popup: /*#__PURE__*/React.createElement("span", {
-          "data-odn-skill-slot-desc-full": true
-        }, skill.description)
-      }, barButton);
-    }
-    return barButton;
+      size: 16
+    }), skill.label));
   };
   var listBody = skills.map(function (skill, index) {
     if (variant === 'card') return renderCardItem(skill);
@@ -461,10 +456,27 @@ export var SkillSlot = /*#__PURE__*/forwardRef(function SkillSlot(_ref2, ref) {
   } : {}), variant !== 'menu' && itemWidth !== undefined && itemWidth !== null ? {
     '--odn-skill-slot-item-width': "".concat(itemWidth, "px")
   } : {}), style);
-  if (variant !== 'menu') {
+
+  /* bar：整条 bar 是一组 Tooltip（与 preview-panel 右上角按钮同款手感）——
+   * 共用一层浮层，已展开时在块之间横移是 0 延迟换文案 + 浮层跟着滑，
+   * 移出整组 200ms 后才收起，不会一块一块地闪断。
+   * 容器本身就是 Tooltip.Group 的 Tag，data-* / className / style 一并落上去。 */
+  if (variant === 'bar') {
+    return /*#__PURE__*/React.createElement(Tooltip.Group, {
+      as: "div",
+      "data-odn-skill-slot": true,
+      "data-odn-skill-slot-variant": "bar",
+      className: className,
+      style: rootStyle,
+      placement: "top",
+      mouseEnterDelay: 0.1,
+      popupClassName: "odn-skill-slot-bar-popup"
+    }, listBody);
+  }
+  if (variant === 'card') {
     return /*#__PURE__*/React.createElement("div", {
       "data-odn-skill-slot": true,
-      "data-odn-skill-slot-variant": variant,
+      "data-odn-skill-slot-variant": "card",
       className: className,
       style: rootStyle
     }, listBody);

package/dist/skill-slot/style/index.css

@@ -237,39 +237,71 @@
   margin: 0;
 }
 
-/* ---- variant: bar ---- */
+/* ---- variant: bar ----
+ * 白底胶囊 chip：999 圆角，14/22 文案 + 16 icon，块间距 12。
+ * 设计稿：默认态**无描边**（描边在稿里是隐藏的），hover 才浮出黑-3 细描边，
+ * 底色/文字不变——所以预置 1px 透明描边占位，避免 hover 时宽度跳 2px。 */
 [data-odn-skill-slot][data-odn-skill-slot-variant=bar] {
   display: flex;
   flex-wrap: wrap;
-  gap: 8px;
+  gap: 12px;
 }
 
 [data-odn-skill-slot][data-odn-skill-slot-variant=bar] [data-odn-skill-slot-item] {
   display: inline-flex;
   align-items: center;
-  gap: 6px;
-  height: 32px;
+  gap: 4px;
+  height: 36px;
   padding: 0 12px;
-  border-radius: var(--odn-border-radius);
-  border: 1px solid var(--odn-color-black-6);
-  background: var(--odn-color-bg-elevated);
-  font-size: 13px;
-  color: var(--odn-color-black-10);
+  border-radius: 999px;
+  border: 1px solid transparent;
+  background: var(--odn-color-white);
+  box-sizing: border-box;
+  /* 不参与压缩：容器放不下就整块换行。否则窄容器里 flex 会把块挤到
+   * 比文案还窄，14/22 的文案折成两行、溢出固定 36px 的胶囊。 */
+  flex: 0 0 auto;
+  white-space: nowrap;
+  font-size: 14px;
+  font-weight: 400;
+  line-height: 22px;
+  color: var(--odn-color-black-12);
   transition: border-color 0.15s, background 0.15s, color 0.15s;
 }
 [data-odn-skill-slot][data-odn-skill-slot-variant=bar] [data-odn-skill-slot-item]:not([data-odn-skill-slot-item-disabled]):hover {
-  border-color: var(--odn-color-black-7);
-  background: var(--odn-color-black-3);
-  color: var(--odn-color-black-12);
+  border-color: var(--odn-color-black-3);
 }
 [data-odn-skill-slot][data-odn-skill-slot-variant=bar] [data-odn-skill-slot-item]:not([data-odn-skill-slot-item-disabled]):active {
-  background: var(--odn-color-black-4);
+  border-color: var(--odn-color-black-4);
 }
 [data-odn-skill-slot][data-odn-skill-slot-variant=bar] [data-odn-skill-slot-item]:not([data-odn-skill-slot-item-disabled]):focus-visible {
   outline: none;
   border-color: var(--odn-color-brand-6);
-  background: var(--odn-color-black-3);
-  color: var(--odn-color-black-12);
+}
+
+/* bar chip hover 的全文提示：暗色浮层（设计稿「文字提示」：向上、多行）。
+ * 整条 bar 走 Tooltip.Group，浮层是 tooltip；popupClassName 落在
+ * [data-odn-popup-content] 上，用 [data-type] 兜住 pop-base 的
+ * popover 白底 / tooltip #404040 两套默认值。 */
+[data-odn-popup][data-type] [data-odn-popup-content].odn-skill-slot-bar-popup {
+  max-width: 400px;
+  padding: 4px 8px;
+  border-radius: 4px;
+  background-color: var(--odn-color-solid-black-11);
+  color: var(--odn-color-white);
+  font-size: 14px;
+  font-weight: 400;
+  line-height: 22px;
+}
+
+[data-odn-popup][data-type] [data-odn-popup-content].odn-skill-slot-bar-popup [data-odn-popup-arrow-fill] {
+  fill: var(--odn-color-solid-black-11);
+}
+
+/* 浮层纯视觉遮挡，不接收鼠标：pointer-events 可继承，给外层一次即可。
+ * 多行 bar 里浮层会压在上一行的块上，若吃掉事件，块↔块之间就换不过去，
+ * 也会挡住下层页面/输入框。 */
+[data-odn-popup]:has(> [data-odn-popup-content].odn-skill-slot-bar-popup) {
+  pointer-events: none;
 }
 
 /* ---- variant: card ---- */
@@ -366,4 +398,12 @@
   color: var(--odn-color-black-9);
   word-break: break-word;
   white-space: pre-wrap;
+}
+
+/* bar 的全文浮层里换成暗底白字 14/22（宽度由 .odn-skill-slot-bar-popup 的 400 兜住） */
+.odn-skill-slot-bar-popup [data-odn-skill-slot-desc-full] {
+  max-width: 100%;
+  font-size: 14px;
+  line-height: 22px;
+  color: var(--odn-color-white);
 }

package/package.json

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