@linhey/rhine-design 0.11.0 → 0.11.2

package/scripts/check-single-search.js

@@ -0,0 +1,43 @@
+// Production preview, isolated playwright-cli session; synthetic data only.
+async page => {
+  page.setDefaultTimeout(8000);
+  const origin = new URL(page.url()).origin;
+  const failures = [], errors = [], samples = [];
+  page.on('pageerror', error => errors.push(String(error)));
+  const check = (ok, context) => { if (!ok) failures.push(context); };
+  for (const theme of ['rhine', 'arknights', 'neo-brutalism']) for (const width of [400, 520, 880]) for (const zoom of [1, 2]) {
+    await page.setViewportSize({ width: 1100, height: 1000 });
+    await page.goto(`${origin}/?theme=${theme}#single-search`);
+    await page.getByRole('searchbox', { name: '搜索合成条目' }).waitFor();
+    await page.getByLabel('搜索容器宽度').selectOption(String(width));
+    await page.evaluate(value => { document.documentElement.style.zoom = String(value); }, zoom);
+    const input = page.getByRole('searchbox', { name: '搜索合成条目', exact: true });
+    const context = { theme, width, zoom };
+    check(await page.locator('[data-search-example] button').count() === 0, { ...context, kind: 'input-only' });
+    const typography = await input.evaluate(el => { const s = getComputedStyle(el), p = getComputedStyle(el, '::placeholder'); return { size: s.fontSize, line: s.lineHeight, weight: s.fontWeight, placeholder: p.fontSize, height: el.offsetHeight, fits: el.parentElement.scrollWidth <= el.parentElement.clientWidth + 1 }; });
+    check(typography.size === '14px' && typography.line === '22px' && typography.weight === '400' && typography.placeholder === '14px' && typography.height >= 44 && typography.fits, { ...context, kind: 'body-type-and-bounds', typography });
+    await page.getByLabel('搜索场景').selectOption('long');
+    await input.fill('跨区域联合研究项目中的长中文合成查询'.repeat(5));
+    await page.getByRole('status').filter({ hasText: '找到' }).waitFor();
+    check(await input.evaluate(el => el.getBoundingClientRect().right <= el.parentElement.getBoundingClientRect().right + 1), { ...context, kind: 'long-query' });
+    await input.press('Escape'); check(await input.inputValue() === '' && await input.evaluate(el => document.activeElement === el), { ...context, kind: 'clear-focus' });
+    for (const [state, message] of [['loading', '正在搜索'], ['empty', '没有匹配结果'], ['error', '搜索失败']]) {
+      await page.getByLabel('搜索场景').selectOption(state); await input.fill('合成查询');
+      await page.getByRole('status').filter({ hasText: message }).waitFor();
+      check(!!await input.getAttribute('aria-describedby'), { ...context, kind: `description-${state}` });
+    }
+    await page.getByLabel('搜索场景').selectOption('disabled'); check(await input.isDisabled(), { ...context, kind: 'disabled' });
+    if (width === 400 && zoom === 2) await page.screenshot({ path: `output/playwright/search-${theme}.png` });
+    samples.push({ ...context, typography });
+  }
+  for (const reduced of [false, true]) {
+    await page.emulateMedia({ reducedMotion: reduced ? 'reduce' : 'no-preference' });
+    await page.goto(`${origin}/#single-search`);
+    await page.getByRole('searchbox').fill('动效偏好');
+    await page.getByRole('status').filter({ hasText: '找到' }).waitFor();
+  }
+  await page.getByRole('radio', { name: '减少动态', exact: true }).check();
+  await page.getByRole('searchbox').press('Escape');
+  check(await page.getByRole('searchbox').inputValue() === '', { kind: 'manual-reduced-clear' });
+  return { pass: !failures.length && !errors.length, failures, errors, samples, scope: 'Production Chromium, 3 themes × 400/520/880 container × CSS zoom 1/2. OS IME and native zoom recorded separately.' };
+}

package/scripts/check-tray-usage.js

@@ -0,0 +1,68 @@
+// Start on this revision's production preview. native=1 expects Chrome's real page zoom already set to 200%.
+async page => {
+  const origin = page.url().split('/').slice(0,3).join('/'), native = page.url().includes('native=1'), results = [], errors = [];
+  page.on('pageerror', e => errors.push(String(e)));
+  const panel = () => page.getByRole('dialog',{name:'账号与用量概览'});
+  const account = () => panel().getByRole('combobox',{name:'Agent A 当前账号'});
+  const open = async () => { if (!await panel().isVisible()) await page.getByRole('button',{name:'切换用量面板'}).click(); await panel().waitFor(); await page.waitForTimeout(200); };
+  const close = async () => { if (await panel().isVisible()) { await page.keyboard.press('Escape'); await panel().waitFor({state:'detached',timeout:3000}); } };
+  const size = () => page.getByTestId('switch-feedback').evaluate(e=>({h:e.getBoundingClientRect().height,content:e.closest('[data-testid="tray-panel"]').scrollHeight}));
+  const bounds = async () => {
+    const b = await panel().evaluate(e=>{const r=e.getBoundingClientRect();return {x:r.x,right:r.right,y:r.y,bottom:r.bottom,width:innerWidth,height:innerHeight};});
+    if (b.x < -1 || b.y < -1 || b.right > b.width+1 || b.bottom > b.height+1) throw Error(`Popover bounds ${JSON.stringify(b)}`);
+  };
+  for (const theme of ['rhine','arknights','neo-brutalism']) for (const width of [400,520,880]) for (const zoom of (native ? [1] : [1,2])) {
+    await page.setViewportSize({width,height:1000});
+    await page.goto(`${origin}/?fixture=tray-usage&theme=${theme}&zoom=${zoom}`);
+    await panel().waitFor();
+    if (await panel().locator('.rhine-dialog__head').count()) throw Error('Visible header retained');
+    await close(); await page.getByRole('checkbox',{name:'长账号名',exact:true}).check(); await open();
+    await close(); await page.getByRole('checkbox',{name:'首次切换失败',exact:true}).check(); await open();
+    const other = await page.getByTestId('other-agent').textContent(), summary = await page.getByTestId('usage-summary').textContent(), before = await size();
+    await account().selectOption('b');
+    if (await account().inputValue() !== 'a' || !await account().isDisabled()) throw Error('Unconfirmed account committed');
+    const busy = await size();
+    await panel().getByRole('alert').waitFor();
+    const failed = await size();
+    if (await account().inputValue() !== 'a') throw Error('Failure changed account');
+    if (!((await page.getByTestId('request-count').textContent()) || '').endsWith('1')) throw Error('Duplicate request');
+    await panel().getByRole('button',{name:'重试切换'}).click();
+    await page.waitForFunction(()=>document.querySelector('[data-testid="current-account"]')?.textContent?.startsWith('协作账号 B'));
+    const success = await size();
+    if ([busy,failed,success].some(s=>Math.abs(s.h-before.h)>1 || Math.abs(s.content-before.content)>1)) throw Error(`Unstable heights ${JSON.stringify({before,busy,failed,success})}`);
+    if (await page.getByTestId('other-agent').textContent() !== other || await page.getByTestId('usage-summary').textContent() !== summary) throw Error('Other data changed');
+    await bounds();
+    await account().focus(); await page.keyboard.press('Escape'); await panel().waitFor({state:'detached',timeout:3000});
+    await page.waitForFunction(()=>document.activeElement?.getAttribute('aria-label')==='切换用量面板');
+    await page.keyboard.press('Enter'); await panel().waitFor();
+    await page.getByRole('button',{name:'切换用量面板'}).click(); await panel().waitFor({state:'detached',timeout:3000});
+    await open();
+    await page.mouse.click(5,5); await panel().waitFor({state:'detached',timeout:3000});
+    await open();
+    for (const state of ['loading','low','unknown','stale','connecting','unmatched','signed-out','shared']) {
+      await close(); await page.getByRole('combobox',{name:'用量场景'}).selectOption(state); await open();
+      if (['loading','stale','connecting','unmatched'].includes(state) && !await account().isDisabled()) throw Error(`Unavailable ${state}`);
+      if (state==='unknown' && await panel().getByRole('progressbar').count()) throw Error('Unknown shown as progress');
+      if (state==='stale' && !(await panel().textContent()).includes('上次数据 · 目录已过期')) throw Error('Cache not marked');
+      if (state==='signed-out' && /研究账号|协作账号|1.28|128|61%/.test(await panel().textContent())) throw Error('Logged out data leak');
+      if (state==='shared') {
+        await panel().getByText('2026-10 周期剩余 未知',{exact:true}).scrollIntoViewIfNeeded();
+        await page.getByTestId('usage-summary').scrollIntoViewIfNeeded();
+        const scrolled = await panel().evaluate(e=>e.scrollTop>0 && e.scrollHeight>e.clientHeight);
+        if (!scrolled) throw Error('Shared members not scrollable');
+      }
+      await bounds();
+    }
+    await close(); await page.getByRole('button',{name:'重置托盘示例'}).click(); await open();
+    if (await account().inputValue()!=='a' || await page.getByRole('checkbox',{name:'长账号名',exact:true}).isChecked()) throw Error('Reset failed');
+    results.push({theme,width,zoom,native,viewport:await page.evaluate(()=>({width:innerWidth,zoom:getComputedStyle(document.documentElement).zoom,dpr:devicePixelRatio})),pass:true,heights:{before,busy,failed,success}});
+  }
+  await page.emulateMedia({reducedMotion:'reduce'});
+  await page.goto(`${origin}/?fixture=tray-usage&motion=system`); await panel().waitFor();
+  const system = await panel().evaluate(e=>getComputedStyle(e).animationDuration);
+  await page.emulateMedia({reducedMotion:'no-preference'});
+  await page.goto(`${origin}/?fixture=tray-usage&motion=reduced`); await panel().waitFor();
+  const manual = await panel().evaluate(e=>getComputedStyle(e).animationDuration);
+  if (parseFloat(system) > 0.01 || parseFloat(manual)>0.01) throw Error('Reduced motion ignored');
+  return {pass:!errors.length,results,errors,reducedMotion:{system,manual}};
+}

package/scripts/prepare-settings-consumer.mjs

@@ -0,0 +1,21 @@
+// Node 24. Creates a NEW isolated Vite consumer; never modifies an installed package.
+// node scripts/prepare-settings-consumer.mjs candidate.tgz /new/consumer [--late-css]
+import { mkdir, readFile, writeFile } from 'node:fs/promises';
+import { resolve, dirname } from 'node:path';
+import { fileURLToPath } from 'node:url';
+import { execFileSync } from 'node:child_process';
+const [tarball, destination, order] = process.argv.slice(2);
+if (!tarball || !destination) throw new Error('Provide a fixed tarball and a new consumer directory.');
+const root = resolve(dirname(fileURLToPath(import.meta.url)), '..');
+const target = resolve(destination);
+await mkdir(target); // Existing candidates are immutable; use a fresh directory.
+const sourcePackage = JSON.parse(await readFile(resolve(root, 'package.json'), 'utf8'));
+await writeFile(resolve(target, 'package.json'), JSON.stringify({name:'settings-dialog-synthetic-consumer',version:'0.0.0',private:true,type:'module',scripts:{build:'vite build',preview:'vite preview'},dependencies:{'@linhey/rhine-design':`file:${resolve(tarball)}`,react:sourcePackage.devDependencies.react,'react-dom':sourcePackage.devDependencies['react-dom']},devDependencies:{vite:sourcePackage.devDependencies.vite,'@vitejs/plugin-react':sourcePackage.devDependencies['@vitejs/plugin-react']}}, null, 2));
+await writeFile(resolve(target, 'index.html'), '<html><head><link rel="icon" href="data:,"><meta name="viewport" content="width=device-width,initial-scale=1"></head><body><div id="root"></div><script type="module" src="/main.tsx"></script></body></html>');
+await writeFile(resolve(target, 'main.tsx'), `import React from 'react';\nimport {createRoot} from 'react-dom/client';\nimport {SettingsDialogFixture} from './SettingsDialogGallery';\n${order === '--late-css' ? "import '@linhey/rhine-design/styles.css?late';" : ''}\ncreateRoot(document.getElementById('root')!).render(<SettingsDialogFixture/>);`);
+await writeFile(resolve(target, 'vite.config.ts'), "import {defineConfig} from 'vite';import react from '@vitejs/plugin-react';export default defineConfig({plugins:[react()]});");
+const fixture = (await readFile(resolve(root, 'preview/SettingsDialogGallery.tsx'), 'utf8')).replaceAll("'../components'", "'@linhey/rhine-design'").replaceAll("'../components/theme'", "'@linhey/rhine-design/theme'");
+await writeFile(resolve(target, 'SettingsDialogGallery.tsx'), fixture);
+await writeFile(resolve(target, 'settings-dialog-gallery.css'), await readFile(resolve(root, 'preview/settings-dialog-gallery.css')));
+execFileSync('npm', ['install'], {cwd:target,stdio:'inherit'});
+execFileSync('npm', ['run','build'], {cwd:target,stdio:'inherit'});

package/skills/rhine-design/SKILL.md

@@ -17,6 +17,8 @@ Package: `@linhey/rhine-design`. GitHub: `linhay/rhine-design` (different accoun
 
 Find the package in the host's dependencies, normally `node_modules/@linhey/rhine-design/`, or its registered source checkout. Verify `package.json` name/version before using the paths below. Paths in references are relative to that package root, not the copied skill directory. Read installed types and source when versions differ; do not infer a new API from this skill. If the package is unavailable, use the task's supplied design sources and identify the missing implementation evidence.
 
+Relative Markdown links stay inside this portable skill folder. Package-root paths are written as code, not as links relative to the installed skill. Any online contract fallback identifies a fixed source revision; it does not follow main or replace the installed version's contract.
+
 ## Route the task
 
 - Screen design, interaction, typography, motion: start with [TASK_MAP.md](references/TASK_MAP.md), then read only the relevant contract.

package/skills/rhine-design/references/API_MAP.md

@@ -4,6 +4,7 @@ All paths are relative to the matching package root. `package.json` exports, `co
 
 | Exports | Source |
 | --- | --- |
+| ChatThread, ChatCard; ChatEntry, ChatMessage, ChatEvent, ChatMember, ChatStatus, ChatThreadProps, ChatCardProps (source candidate after 0.11.0) | `components/Chat.tsx`, `docs/AGENT_CHAT.md`; stable IDs, history anchor, explicit resume, readOnly action slots |
 | Checkbox `layout="row"`, CheckboxProps（自 0.10.0） | `components/Forms.tsx`、`docs/CHECKBOX_ROWS.md`；整行双行多选，默认 form 保持兼容；npm 0.9.1 不含此选项 |
 | TrendChart, StackedBar；StatusTimeline.detail（0.5.0） | `components/Charts.tsx`、`components/StatusTimeline.tsx`；`docs/APPLICATION_COMPONENTS.md`，未知不补零；键盘逐点查看、按ID受控高亮/详情、valueFormatter |
 | Background, AppShell（0.5.0）；AppShellToggle（0.8.0） | `components/Background.tsx`、`components/AppShell.tsx`；`docs/APPLICATION_COMPONENTS.md`；桌面open与临时drawerOpen独立，断点为容器CSS布局宽度 |
@@ -59,3 +60,13 @@ API decisions that commonly matter:
 Available since 0.8.0 (check installed exports): `ThemePicker` / `ThemePreview` in `components/ThemePicker.tsx`, contract `docs/THEME_PICKER.md`; `Dialog.navigation` in `components/Overlays.tsx`, contract `docs/SETTINGS_DIALOG.md`; shared floating CSS zoom behavior in `docs/FLOATING_OVERLAYS.md`.
 
 Product review tooling (since 0.11.0): `/review` exports `defineReview`, URL helpers and scene/session types from `review/index.ts`; `/review/vite` exports Node-only `reviewPlugin` and `reviewProductionGuard` from `review/vite.mjs`, types in `review/vite.d.mts`. Never import the Vite entry into production UI. Read `docs/REVIEW_TOOL.md`; npm 0.10.0 does not contain these entries.
+
+SideNav 行尾命令：`NavItem.actions` / `NavAction`，见 `docs/SIDE_NAV_ACTIONS.md`，真实展台 `#nav-actions`；未发布。
+
+单输入即时搜索：TextField / TextFieldProps 的 `labelVisibility="hidden"` 保留非空名称；参见 `docs/SINGLE_SEARCH.md` 与 `#single-search`，未发布。搜索/异步与IME由宿主管理。
+
+#41未发布：Button.contentAlign、Tabs.layout/TabsProps、Dialog.height/footer；先读 `docs/COMPACT_ACCOUNT_PATTERNS.md`、`docs/SETTINGS_DIALOG.md`、`docs/SUMMARY_TABS.md`，展台 `#compact-selection`。
+
+#46未发布：Button.size="standard" | "large"；动作语义先读 `docs/BUTTON_ACTIONS.md`，展台 `#button-actions`。
+
+#18 未发布：Dialog `description?`、settings CSS次序独立、`height/footer/navigation` 固定头尾与正文/长导航独立滚动；短屏右对齐动作及真实消费验证见 `docs/SETTINGS_DIALOG.md`，展台 `#settings-dialog`。

package/skills/rhine-design/references/TASK_MAP.md

@@ -4,6 +4,7 @@ Resolve the matching package root as described in SKILL.md. Open the first relev
 
 | Task | First reference (relative to package root) | Implementation / example |
 | --- | --- | --- |
+| Agent chat, member grouping, inline cards, observation and history scrolling | `docs/AGENT_CHAT.md` (source candidate after 0.11.0) | `components/Chat.tsx`, `preview/ChatGallery.tsx`; `/#agent-chat`; host owns transitions, requests and permissions |
 | Application shell, backgrounds, media, advanced inputs, controlled tables | `docs/APPLICATION_COMPONENTS.md` (0.5.0) | `preview/ExtensionsGallery.tsx`; `/#app-shell`, `/#advanced-forms`, `/#advanced-data`, `/#media` |
 | Workspace header, duplicate page titles, optional breadcrumbs | `docs/APPLICATION_COMPONENTS.md` → 平级工作区顶部操作区 (source guideline) | `preview/ExtensionsGallery.tsx`; `/#app-shell`; keep status/actions, navigation restore and accessible page identity |
 | Product design review shell, synthetic HTTP/platform scenes, static deployment | `docs/REVIEW_TOOL.md` (since 0.11.0; not npm 0.10.0) | `review/`, `examples/review/http`, `examples/review/platform`; separate `/review` and `/review/vite` exports |

package/skills/rhine-design/references/integration.md

@@ -21,7 +21,7 @@ export function Example() {
 
 ## Integration invariants
 
-Version 0.4.0 also exports `ThemeProvider`, `useTheme`, `themes`, `ThemeName` and `ThemeProviderProps` from `@linhey/rhine-design/theme` (not in npm 0.3.0). See [the theme contract](../../../docs/THEMING.md). This entry loads base and built-in theme CSS and renders the `.rhine-theme` root. Use `defaultTheme` for local state, or `theme` with `onThemeChange` for host state; storage and URL preferences remain with the host. Sibling providers are supported; nested providers throw. Do not wrap it in another themed root or key the subtree by theme. Gallery decoration is excluded from the public theme CSS.
+Version 0.4.0 also exports `ThemeProvider`, `useTheme`, `themes`, `ThemeName` and `ThemeProviderProps` from `@linhey/rhine-design/theme` (not in npm 0.3.0). Read `docs/THEMING.md` from the verified package root. For a standalone skill installation without the package, see [the theme contract snapshot](https://github.com/linhay/rhine-design/blob/cfcb400fa213d9905eae1cab5dcb8ab8f817e03f/docs/THEMING.md) at commit `cfcb400fa213d9905eae1cab5dcb8ab8f817e03f` (0.10.0 source baseline). This fixed snapshot does not track main or establish availability in another installed version; prefer that version's own contract and implementation. This entry loads base and built-in theme CSS and renders the `.rhine-theme` root. Use `defaultTheme` for local state, or `theme` with `onThemeChange` for host state; storage and URL preferences remain with the host. Sibling providers are supported; nested providers throw. Do not wrap it in another themed root or key the subtree by theme. Gallery decoration is excluded from the public theme CSS.
 
 Version 0.5.0 adds `Background` with canvas/content/sidebar/surface/overlay/media roles. `decoration="auto"` is the default: only canvas uses theme texture; content and AppShell default to plain backgrounds. Use `appearance` for local color/text/texture/size overrides and theme-root scene tokens for shared configuration. Background is paint only, not a new theme root or modal. Preview `#backgrounds` shows only the selected theme and follows the theme picker. Check installed exports before adopting this API; it is not in npm 0.4.0.
 

package/tests/Chat.test.tsx

@@ -0,0 +1,84 @@
+import { act, fireEvent, render, screen } from '@testing-library/react';
+import { afterEach, describe, expect, it, vi } from 'vitest';
+import { Button, ChatCard, ChatThread, type ChatEntry, type ChatMessage, type ChatStatus } from '../components';
+import { ChatGallery } from '../preview/ChatGallery';
+
+const msg = (id: string, minute: number, member = 'A', day = '今天'): ChatMessage => ({ id, kind: 'message', day, dateTime: `2026-10-27T10:${minute}:00+08:00`, time: `10:${minute}`, member: { id: member, name: member }, content: <p>{id}</p> });
+afterEach(() => vi.useRealTimers());
+describe('Chat composition', () => {
+  it('groups only adjacent same-member messages within five minutes and a day; events break groups', () => {
+    const { container } = render(<ChatThread label="聊天" entries={[msg('a', 10), msg('b', 11), { id: 'e', kind: 'event', day: '今天', content: '事件' }, msg('c', 12), msg('d', 13, 'B'), msg('f', 20, 'B'), msg('g', 21, 'B', '明天')]} />);
+    expect(container.querySelectorAll('[data-continuation=true]')).toHaveLength(1);
+    expect(screen.getByRole('article', { name: 'A · 10:11' })).toHaveTextContent('b');
+    expect(container.querySelectorAll('.rhine-chat-day')).toHaveLength(2);
+  });
+  it('preserves errors outside collapsed details and suppresses action slots in observation mode', () => {
+    const content = <ChatCard title="请求" status="failed" summary="来源不可用，请稍后核对" actions={<Button>接受</Button>}><p>完整依据</p></ChatCard>;
+    const entries: ChatEntry[] = [{ ...msg('a', 10), content, actions: <Button>重试</Button> }];
+    const { rerender } = render(<ChatThread label="聊天" readOnly entries={entries} />);
+    expect(screen.queryByRole('button', { name: '接受' })).not.toBeInTheDocument();
+    expect(screen.queryByRole('button', { name: '重试' })).not.toBeInTheDocument();
+    expect(screen.getByText('来源不可用，请稍后核对')).toBeVisible();
+    fireEvent.click(screen.getByText('请求 · 详情'));
+    expect(screen.getByText('完整依据')).toBeVisible();
+    rerender(<ChatThread label="聊天" entries={entries} />);
+    expect(screen.getByRole('button', { name: '接受' })).toBeInTheDocument();
+  });
+  it('does not repeat a loading history request or remove the focused control', () => {
+    const load = vi.fn();
+    const { rerender } = render(<ChatThread label="聊天" entries={[]} hasEarlier onLoadEarlier={load} />);
+    const button = screen.getByRole('button', { name: '加载更早消息' }); button.focus(); fireEvent.click(button);
+    rerender(<ChatThread label="聊天" entries={[]} hasEarlier loadingEarlier onLoadEarlier={load} />);
+    fireEvent.click(button); expect(load).toHaveBeenCalledTimes(1); expect(button).toHaveFocus();
+    rerender(<ChatThread label="聊天" entries={[]} onLoadEarlier={load} historyError="合成失败" />);
+    fireEvent.click(button); expect(load).toHaveBeenCalledTimes(1); expect(button).toHaveFocus();
+    expect(screen.getByRole('alert')).toHaveTextContent('合成失败');
+  });
+  it('pauses on a disclosure and resumes only through the persistent follow control', () => {
+    render(<ChatThread label="聊天" entries={[{ ...msg('a', 10), content: <ChatCard title="详情" status="unknown" summary="尚未确认"><p>证据</p></ChatCard> }]} />);
+    fireEvent.click(screen.getByText('详情 · 详情'));
+    const follow = screen.getByRole('button', { name: '回到最新并跟随' });
+    expect(follow).toHaveAttribute('aria-pressed', 'false'); follow.focus(); fireEvent.click(follow);
+    expect(follow).toHaveAttribute('aria-pressed', 'true'); expect(follow).toHaveFocus();
+  });
+  it('announces new messages inserted before an existing stream without announcing prepended history', () => {
+    const entries = [msg('a', 10), msg('stream', 15)];
+    const { rerender } = render(<ChatThread label="聊天" entries={entries} />);
+    fireEvent.keyDown(screen.getByRole('region', { name: '聊天' }), { key: 'PageUp' });
+    rerender(<ChatThread label="聊天" entries={[msg('history', 9), ...entries]} />);
+    expect(screen.getByRole('status')).not.toHaveTextContent('有新消息');
+    rerender(<ChatThread label="聊天" entries={[msg('history', 9), entries[0], msg('new', 12), entries[1]]} />);
+    expect(screen.getByRole('status')).toHaveTextContent('有新消息');
+    fireEvent.click(screen.getByRole('button', { name: '回到最新并跟随' }));
+    expect(screen.getByRole('status')).not.toHaveTextContent('有新消息');
+  });
+  it('keeps focus after a host action and treats unexpected runtime states as unknown', () => {
+    const { unmount } = render(<ChatGallery />);
+    const accept = screen.getByRole('button', { name: '接受请求' }); accept.focus(); fireEvent.click(accept);
+    expect(accept).toHaveFocus(); expect(accept).toHaveAttribute('aria-disabled', 'true');
+    expect(screen.getByText('已接受')).toBeVisible();
+    fireEvent.click(screen.getByRole('button', { name: '拒绝请求' }));
+    expect(screen.getByText('已接受')).toBeVisible(); unmount();
+    render(<ChatCard title="外部状态" status={'constructor' as ChatStatus} summary="未知来源" />);
+    expect(screen.getByText('状态未知')).toBeVisible();
+  });
+  it('disconnects ResizeObserver on unmount', () => {
+    const disconnect = vi.fn();
+    vi.stubGlobal('ResizeObserver', class { observe() {} disconnect = disconnect; });
+    const { unmount } = render(<ChatThread label="聊天" entries={[]} />); unmount();
+    expect(disconnect).toHaveBeenCalledOnce(); vi.unstubAllGlobals();
+  });
+  it('cancels synthetic streaming without late text or success and clears timers on unmount', () => {
+    vi.useFakeTimers();
+    const { unmount } = render(<ChatGallery />);
+    fireEvent.click(screen.getByRole('button', { name: '播放合成流式记录' }));
+    act(() => vi.advanceTimersByTime(440));
+    fireEvent.click(screen.getByRole('button', { name: '取消演示生成' }));
+    const before = screen.getByRole('region', { name: '合成聊天消息' }).textContent;
+    act(() => vi.advanceTimersByTime(6000));
+    expect(screen.getByRole('region', { name: '合成聊天消息' }).textContent).toBe(before);
+    expect(screen.getByText('生成已取消；保留部分内容，未确认成功。')).toBeVisible();
+    fireEvent.click(screen.getByRole('button', { name: '加载更早消息' }));
+    unmount(); expect(vi.getTimerCount()).toBe(0);
+  });
+});

package/tests/CompactSelection.test.tsx

@@ -0,0 +1,47 @@
+import { act, fireEvent, render, screen, within } from '@testing-library/react';
+import { afterEach, describe, expect, it, vi } from 'vitest';
+import { Button, Dialog, Tabs } from '../components';
+import { CompactSelectionGallery } from '../preview/CompactSelectionGallery';
+afterEach(()=>{vi.useRealTimers();vi.restoreAllMocks();});
+describe('compact selection contracts',()=>{
+ it('keeps button native semantics and makes tabs layout independent of status',()=>{
+  const {rerender}=render(<><Button contentAlign="between">名称<span>箭头</span></Button><Tabs label="页签" value="a" onValueChange={()=>{}} items={[{value:'a',label:'甲',status:'运行',content:'内容'}]}/></>);
+  expect(screen.getByRole('button')).toHaveClass('rhine-button--between');expect(screen.getByRole('button')).not.toHaveAttribute('contentAlign');
+  expect(screen.getByRole('tablist')).toHaveClass('rhine-tabs__list--content');
+  rerender(<Tabs label="页签" layout="fill" value="a" onValueChange={()=>{}} items={[{value:'a',label:'甲',content:'内容'}]}/>);
+  expect(screen.getByRole('tablist')).toHaveClass('rhine-tabs__list--fill');
+ });
+ it('renders footer outside content scroll with opt-in height',()=>{
+  render(<Dialog trigger={<Button>打开</Button>} title="选择" description="草稿" height={560} footer={<Button>保存</Button>}><p>内容</p></Dialog>);
+  fireEvent.click(screen.getByText('打开'));const dialog=screen.getByRole('dialog');
+  expect(dialog).toHaveClass('rhine-dialog--bounded');expect(dialog.style.getPropertyValue('--rhine-dialog-height')).toBe('560px');
+  expect(screen.getByText('保存').closest('.rhine-dialog__scroll')).toBeNull();
+ });
+ it('discards draft on close, prevents duplicate save/close while saving and retains failures',()=>{
+  vi.useFakeTimers();render(<CompactSelectionGallery/>);
+  const trigger=screen.getByRole('button',{name:'选择 合成对象 A 的授权分组'});
+  fireEvent.click(trigger);let dialog=screen.getByRole('dialog',{name:'分组选择'});
+  fireEvent.change(within(dialog).getByLabelText('候选分组'),{target:{value:'beta'}});
+  expect(within(dialog).getByText('已确认：示例组')).toBeInTheDocument();
+  fireEvent.click(within(dialog).getByRole('button',{name:'关闭对话框'}));
+  fireEvent.click(trigger);dialog=screen.getByRole('dialog',{name:'分组选择'});
+  expect(within(dialog).getByLabelText('候选分组')).toHaveValue('alpha');
+  fireEvent.change(within(dialog).getByLabelText('候选分组'),{target:{value:'beta'}});
+  const save=within(dialog).getByRole('button',{name:'保存'});fireEvent.click(save);fireEvent.click(save);
+  fireEvent.click(within(dialog).getByRole('button',{name:'关闭对话框'}));expect(dialog).toBeInTheDocument();
+  act(()=>vi.advanceTimersByTime(700));expect(within(dialog).getByText('已确认：联合研究组')).toBeInTheDocument();expect(save).toBeDisabled();
+  fireEvent.click(within(dialog).getByRole('button',{name:'关闭对话框'}));
+  fireEvent.change(screen.getByLabelText('组合场景'),{target:{value:'error'}});fireEvent.click(trigger);
+  dialog=screen.getByRole('dialog',{name:'分组选择'});fireEvent.change(within(dialog).getByLabelText('候选分组'),{target:{value:'none'}});
+  fireEvent.click(within(dialog).getByRole('button',{name:'保存'}));act(()=>vi.advanceTimersByTime(700));
+  expect(within(dialog).getByText('已确认：联合研究组')).toBeInTheDocument();expect(within(dialog).getByLabelText('候选分组')).toHaveValue('none');
+  expect(within(dialog).getByRole('status')).toHaveTextContent('保存失败');
+ });
+ it('cleans host timers on unmount',()=>{
+  vi.useFakeTimers();const timer=vi.spyOn(globalThis,'setTimeout'),clear=vi.spyOn(globalThis,'clearTimeout');const {unmount}=render(<CompactSelectionGallery/>);
+  fireEvent.click(screen.getByRole('button',{name:'选择 合成对象 A 的授权分组'}));const dialog=screen.getByRole('dialog');
+  fireEvent.change(within(dialog).getByLabelText('候选分组'),{target:{value:'beta'}});fireEvent.click(within(dialog).getByRole('button',{name:'保存'}));
+  const index=timer.mock.calls.findIndex(call=>call[1]===700);expect(index).toBeGreaterThanOrEqual(0);
+  const pendingTimer=timer.mock.results[index].value;unmount();expect(clear).toHaveBeenCalledWith(pendingTimer);
+ });
+});

package/tests/FormParity.test.tsx

@@ -1,7 +1,7 @@
 import { useState } from 'react';
 import { act, fireEvent, render, screen } from '@testing-library/react';
 import { describe, expect, it, vi } from 'vitest';
-import { Combobox, DateField, DateRangePicker, NumberField, RemoteMultiSelect, TreeSelect } from '../components';
+import { Combobox, Dialog, DateField, DateRangePicker, NumberField, RemoteMultiSelect, TreeSelect } from '../components';
 
 describe('date field parity', () => {
   it('reports controlled invalid dates and changed bounds without rewriting the value', () => {
@@ -106,6 +106,64 @@ describe('number field parity', () => {
 });
 
 describe('remote multi-select parity', () => {
+  it.each([false, true])('removes a tag without reopening candidates (initially open: %s)', initiallyOpen => {
+    const query = vi.fn(), submit = vi.fn(event => event.preventDefault());
+    function Demo() {
+      const [value, setValue] = useState([{ value: 'a', label: 'Alpha' }, { value: 'b', label: 'Beta' }]);
+      return <form onSubmit={submit}><RemoteMultiSelect label="成员" query="保留查询" onQueryChange={query} value={value} onValueChange={setValue} options={[{ value: 'a', label: 'Alpha' }, { value: 'b', label: 'Beta' }]} /></form>;
+    }
+    render(<Demo />); const input = screen.getByRole('combobox');
+    if (initiallyOpen) act(() => input.focus());
+    fireEvent.click(screen.getByRole('button', { name: '移除Beta' }));
+    expect(screen.queryByRole('button', { name: '移除Beta' })).not.toBeInTheDocument();
+    expect(screen.getByRole('button', { name: '移除Alpha' })).toBeVisible();
+    expect(input).toHaveFocus(); expect(input).toHaveAttribute('aria-expanded', 'false');
+    expect(input).toHaveValue('保留查询'); expect(query).not.toHaveBeenCalled(); expect(submit).not.toHaveBeenCalled();
+    fireEvent.click(screen.getByRole('button', { name: '移除Alpha' }));
+    expect(input).toHaveAttribute('aria-expanded', 'false');
+    expect(screen.queryByRole('button', { name: '清空选择' })).not.toBeInTheDocument();
+  });
+
+  it.each([false, true])('Backspace retains the current candidate state (open: %s)', initiallyOpen => {
+    function Demo() {
+      const [value, setValue] = useState([{ value: 'a', label: 'Alpha' }]);
+      return <RemoteMultiSelect label="成员" query="" onQueryChange={() => {}} value={value} onValueChange={setValue} options={[{ value: 'a', label: 'Alpha' }]} />;
+    }
+    render(<Demo />); const input = screen.getByRole('combobox'); act(() => input.focus());
+    if (!initiallyOpen) fireEvent.keyDown(input, { key: 'Escape' });
+    fireEvent.keyDown(input, { key: 'Backspace' });
+    expect(screen.queryByRole('button', { name: '移除Alpha' })).not.toBeInTheDocument();
+    expect(input).toHaveAttribute('aria-expanded', String(initiallyOpen)); expect(input).toHaveFocus();
+  });
+
+  it.each([false, true])('clears without opening candidates (initially open: %s) and hides empty actions', initiallyOpen => {
+    const query = vi.fn(), submit = vi.fn(event => event.preventDefault());
+    function Demo() {
+      const [value, setValue] = useState([{ value: 'a', label: 'Alpha' }]);
+      return <form onSubmit={submit}><RemoteMultiSelect label="成员" query="保留查询" onQueryChange={query} value={value} onValueChange={setValue} options={[{ value: 'a', label: 'Alpha' }]} maxVisibleTags={2} /></form>;
+    }
+    render(<Demo />); const input = screen.getByRole('combobox');
+    if (initiallyOpen) act(() => input.focus());
+    const clear = screen.getByRole('button', { name: '清空选择' });
+    fireEvent.pointerDown(clear); act(() => clear.focus());
+    if (initiallyOpen) expect(screen.getByRole('listbox', { name: '成员' })).toBeVisible();
+    else expect(screen.queryByRole('listbox')).not.toBeInTheDocument();
+    fireEvent.pointerUp(clear); fireEvent.click(clear);
+    expect(screen.getByText('已选 0 项')).toBeVisible();
+    expect(screen.queryByRole('button', { name: '清空选择' })).not.toBeInTheDocument();
+    expect(input).toHaveFocus(); expect(input).toHaveAttribute('aria-expanded', 'false');
+    expect(screen.queryByRole('listbox')).not.toBeInTheDocument();
+    expect(input).toHaveValue('保留查询'); expect(query).not.toHaveBeenCalled(); expect(submit).not.toHaveBeenCalled();
+    fireEvent.keyDown(input, { key: 'ArrowDown' }); fireEvent.keyDown(input, { key: 'Enter' });
+    expect(screen.getByRole('button', { name: '清空选择' })).toBeVisible();
+  });
+
+  it('hides clear when only locked choices remain', () => {
+    render(<RemoteMultiSelect label="成员" query="" onQueryChange={() => {}} value={[{ value: 'locked', label: '固定', disabled: true }]} onValueChange={vi.fn()} options={[]} />);
+    expect(screen.queryByRole('button', { name: '清空选择' })).not.toBeInTheDocument();
+    expect(screen.getByRole('button', { name: '移除固定' })).toBeDisabled();
+  });
+
   it('keeps the list open for consecutive selection and exposes the selected list semantics', () => {
     const query = vi.fn();
     function Demo() {
@@ -117,12 +175,41 @@ describe('remote multi-select parity', () => {
     expect(input).toHaveAttribute('aria-expanded', 'true');
     expect(screen.getByRole('listbox')).toHaveAttribute('aria-multiselectable', 'true');
     expect(screen.getByRole('option', { name: 'Alpha' })).toHaveAttribute('aria-selected', 'true');
-    fireEvent.keyDown(input, { key: 'ArrowDown' }); fireEvent.keyDown(input, { key: 'Enter' });
+    fireEvent.keyDown(input, { key: 'End' }); fireEvent.keyDown(input, { key: 'Enter' });
     expect(screen.getByRole('button', { name: '移除Beta' })).toBeVisible();
     expect(container.querySelectorAll('input[type="hidden"][name="member"]')).toHaveLength(3);
     expect(query).not.toHaveBeenCalled();
   });
 
+  it('toggles selected candidates with pointer and keyboard, then completes without submitting', () => {
+    const submit = vi.fn(event => event.preventDefault());
+    function Demo() {
+      const [value, setValue] = useState([{ value: 'a', label: 'Alpha' }, { value: 'locked', label: 'Locked', disabled: true }]);
+      return <form onSubmit={submit}><RemoteMultiSelect label="成员" query="查询" onQueryChange={() => {}} value={value} onValueChange={setValue} options={[{ value: 'a', label: 'Alpha' }, { value: 'locked', label: 'Locked' }, { value: 'off', label: 'Disabled', disabled: true }]} /></form>;
+    }
+    render(<Demo />);
+    const input = screen.getByRole('combobox'); act(() => input.focus());
+    fireEvent.click(screen.getByRole('option', { name: 'Alpha' }));
+    expect(screen.getByRole('option', { name: 'Alpha' })).toHaveAttribute('aria-selected', 'false');
+    expect(screen.queryByRole('button', { name: '移除Alpha' })).not.toBeInTheDocument();
+    fireEvent.click(screen.getByRole('option', { name: 'Locked' }));
+    fireEvent.click(screen.getByRole('option', { name: 'Disabled' }));
+    expect(screen.getByRole('button', { name: '移除Locked' })).toBeDisabled();
+    expect(screen.queryByRole('button', { name: '移除Disabled' })).not.toBeInTheDocument();
+    fireEvent.keyDown(input, { key: 'ArrowDown' }); fireEvent.keyDown(input, { key: 'Enter' });
+    expect(screen.getByRole('option', { name: 'Alpha' })).toHaveAttribute('aria-selected', 'true');
+    fireEvent.keyDown(input, { key: 'ArrowDown' }); fireEvent.keyDown(input, { key: 'Enter' });
+    expect(screen.getByRole('option', { name: 'Alpha' })).toHaveAttribute('aria-selected', 'false');
+    const done = screen.getByRole('button', { name: '完成选择' }); act(() => done.focus());
+    expect(input).toHaveAttribute('aria-expanded', 'true');
+    fireEvent.click(done);
+    expect(input).toHaveAttribute('aria-expanded', 'false'); expect(input).toHaveFocus();
+    expect(input).toHaveValue('查询'); expect(submit).not.toHaveBeenCalled();
+    fireEvent.click(input); act(() => screen.getByRole('button', { name: '完成选择' }).focus());
+    fireEvent.keyDown(screen.getByRole('button', { name: '完成选择' }), { key: 'Escape' });
+    expect(input).toHaveAttribute('aria-expanded', 'false'); expect(input).toHaveFocus();
+  });
+
   it('removes the last removable tag with Backspace while respecting IME and locked values', () => {
     const change = vi.fn(); render(<RemoteMultiSelect label="成员" query="" onQueryChange={() => {}} value={[{ value: 'a', label: 'Alpha' }, { value: 'locked', label: '固定', disabled: true }]} onValueChange={change} options={[]} />);
     const input = screen.getByRole('combobox'); fireEvent.focus(input); fireEvent.compositionStart(input);
@@ -183,3 +270,18 @@ describe('tree keyboard parity', () => {
     fireEvent.keyDown(group, { key: 'ArrowRight' }); expect(expand).toHaveBeenLastCalledWith(['root']);
   });
 });
+
+
+describe('combobox modal keyboard exit', () => {
+  it('keeps focus inside while the nested scope is resuming its parent', () => {
+    render(<><button data-testid="background-action">背景动作</button><Dialog trigger={<button>打开选择</button>} title="成员选择" description="合成测试" open><RemoteMultiSelect label="弹窗成员" query="" onQueryChange={() => {}} value={[]} onValueChange={() => {}} options={[{ value: 'a', label: 'Alpha' }]} /></Dialog></>);
+    const input = screen.getByRole('combobox', { name: '弹窗成员' });
+    act(() => input.focus());
+    fireEvent.keyDown(input, { key: 'Tab', shiftKey: true });
+    const close = screen.getByRole('button', { name: '关闭对话框' });
+    act(() => close.focus());
+    act(() => screen.getByTestId('background-action').focus());
+    expect(close).toHaveFocus();
+    expect(input).toHaveAttribute('aria-expanded', 'false');
+  });
+});

package/tests/NavActions.test.tsx

@@ -0,0 +1,29 @@
+import { fireEvent, render, screen, waitFor } from '@testing-library/react';
+import { describe, expect, it, vi } from 'vitest';
+import { SideNav } from '../components';
+import { NavActionsGallery } from '../preview/NavActionsGallery';
+describe('SideNav trailing actions', () => {
+  it('omits empty actions and keeps action triggers outside links', async () => {
+    const navigate = vi.fn(), action = vi.fn();
+    render(<SideNav currentId="a" onNavigate={navigate} groups={[{label:'项目', items:[
+      {id:'a', label:'甲', href:'#a', actions:[{id:'details',label:'详情',onSelect:action}]},
+      {id:'b', label:'乙', href:'#b', actions:[]}, {id:'c',label:'丙',href:'#c'},
+    ]}]} />);
+    const trigger = screen.getByRole('button', {name:'甲：更多操作'});
+    expect(trigger.closest('a')).toBeNull(); expect(screen.getAllByRole('button')).toHaveLength(1);
+    expect(screen.getByRole('link', {name:'乙'}).parentElement).toHaveTextContent('乙');
+    fireEvent.keyDown(trigger, {key:'Enter'});
+    fireEvent.click(await screen.findByRole('menuitem', {name:'详情'}));
+    expect(navigate).not.toHaveBeenCalled(); expect(action).toHaveBeenCalledWith(trigger);
+  });
+  it('opens a controlled dialog and returns focus to the originating more button', async () => {
+    render(<NavActionsGallery />);
+    const trigger = screen.getByRole('button', {name:'合成工作区：更多操作'});
+    trigger.focus(); fireEvent.keyDown(trigger, {key:'Enter'});
+    fireEvent.click(await screen.findByRole('menuitem', {name:'查看详情'}));
+    expect(await screen.findByRole('dialog', {name:'工作区详情'})).toBeInTheDocument();
+    fireEvent.click(screen.getByRole('button', {name:'关闭对话框'}));
+    await waitFor(() => expect(trigger).toHaveFocus());
+    expect(screen.getByRole('link', {name:'合成工作区'})).toHaveAttribute('aria-current','page');
+  });
+});