@linhey/rhine-design 0.11.1 → 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/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');
+  });
+});

package/tests/SettingsDialog.test.tsx

@@ -1,10 +1,11 @@
-import { fireEvent, render, screen, waitFor } from '@testing-library/react';
-import { expect, it } from 'vitest';
+import { act, fireEvent, render, screen, waitFor, within } from '@testing-library/react';
+import { afterEach, expect, it, vi } from 'vitest';
 import { SettingsDialogGallery } from '../preview/SettingsDialogGallery';
-import { Button, Dialog, Tooltip } from '../components';
+import { ThemeProvider } from '../components/theme';
+import { Button, Dialog, Drawer, Tooltip } from '../components';
 
 it('keeps host state and URL while changing settings sections and explicitly saving', async () => {
-  render(<SettingsDialogGallery />);
+  render(<ThemeProvider><SettingsDialogGallery /></ThemeProvider>);
   const url = location.href;
   fireEvent.change(screen.getByRole('textbox', {name:'宿主查询'}), {target:{value:'已有查询'}});
   fireEvent.click(screen.getByRole('button', {name:'打开设置'}));
@@ -13,7 +14,7 @@ it('keeps host state and URL while changing settings sections and explicitly sav
   fireEvent.click(screen.getByRole('link', {name:'账号'}));
   expect(screen.getByRole('textbox', {name:'工作区名称'})).toHaveValue('修改后的名称');
   expect(location.href).toBe(url);
-  fireEvent.click(screen.getByRole('button', {name:'保存设置'}));
+  fireEvent.click(screen.getByRole('button', {name:'保存当前工作区设置'}));
   await screen.findByText('已保存演示草稿');
   expect(screen.getByRole('dialog', {name:'设置'})).toBeVisible();
   fireEvent.click(screen.getByRole('button', {name:'关闭对话框'}));
@@ -22,12 +23,12 @@ it('keeps host state and URL while changing settings sections and explicitly sav
   fireEvent.click(screen.getByRole('button', {name:'打开设置'}));
   expect(screen.getByRole('textbox', {name:'工作区名称'})).toHaveValue('修改后的名称');
   fireEvent.change(screen.getByRole('textbox', {name:'工作区名称'}), {target:{value:'丢弃'}});
-  fireEvent.click(screen.getByRole('button', {name:'取消草稿'}));
+  fireEvent.click(screen.getByRole('button', {name:'撤销全部未保存的修改'}));
   expect(screen.getByRole('textbox', {name:'工作区名称'})).toHaveValue('修改后的名称');
 });
 
 it('closes only the focused nested dialog on an immediate Escape', async () => {
-  render(<SettingsDialogGallery />);
+  render(<ThemeProvider><SettingsDialogGallery /></ThemeProvider>);
   fireEvent.click(screen.getByRole('button', {name:'打开设置'}));
   fireEvent.click(screen.getByRole('link', {name:'用户管理与权限'}));
   fireEvent.click(screen.getByRole('button', {name:'编辑成员 12'}));
@@ -52,10 +53,10 @@ it('lets the topmost tooltip consume Escape before closing its dialog', async ()
 });
 
 it.each([false, true])('reconciles pending saves on reopen without overwriting newer edits (edited=%s)', async edited => {
-  render(<SettingsDialogGallery />);
+  render(<ThemeProvider><SettingsDialogGallery /></ThemeProvider>);
   fireEvent.click(screen.getByRole('button', {name:'打开设置'}));
   fireEvent.change(screen.getByRole('textbox', {name:'工作区名称'}), {target:{value:'保存中的名称'}});
-  fireEvent.click(screen.getByRole('button', {name:'保存设置'}));
+  fireEvent.click(screen.getByRole('button', {name:'保存当前工作区设置'}));
   fireEvent.click(screen.getByRole('button', {name:'关闭对话框'}));
   await waitFor(() => expect(screen.queryByRole('dialog')).not.toBeInTheDocument());
   fireEvent.click(screen.getByRole('button', {name:'打开设置'}));
@@ -64,3 +65,95 @@ it.each([false, true])('reconciles pending saves on reopen without overwriting n
   expect(screen.getByText('已保存名称：保存中的名称')).toBeVisible();
   expect(screen.getByRole('textbox', {name:'工作区名称'})).toHaveValue(edited ? '重新打开后编辑' : '保存中的名称');
 });
+
+
+it.each([undefined, null, false, ''])('omits absent description without a dangling relationship (%s)', description => {
+  render(<Dialog trigger={<Button>Open</Button>} title="Settings" description={description} height={640} footer={<Button>Save</Button>} navigation={<a href="#a">Account</a>}><p>Form</p></Dialog>);
+  fireEvent.click(screen.getByText('Open'));
+  const dialog = screen.getByRole('dialog');
+  expect(dialog).not.toHaveAttribute('aria-describedby');
+  expect(dialog.querySelector('.rhine-dialog__main > p')).toBeNull();
+  expect(screen.getByRole('region', {name:'Settings内容'})).toHaveTextContent('Form');
+  expect(screen.getByText('Save').closest('.rhine-dialog__scroll')).toBeNull();
+});
+
+it('keeps optional descriptions associated and ordinary Dialog/Drawer natural', () => {
+  const {rerender} = render(<Dialog trigger={<Button>Open</Button>} title="Short" description="Decision context"><p>Form</p></Dialog>);
+  fireEvent.click(screen.getByText('Open'));
+  let dialog = screen.getByRole('dialog');
+  expect(document.getElementById(dialog.getAttribute('aria-describedby')!)).toHaveTextContent('Decision context');
+  expect(dialog).not.toHaveClass('rhine-dialog--bounded');
+  rerender(<Drawer trigger={<Button>Open</Button>} title="Drawer"><p>Form</p></Drawer>);
+  fireEvent.click(screen.getByText('Open'));
+  dialog = screen.getByRole('dialog');
+  expect(dialog).not.toHaveClass('rhine-dialog--bounded');
+  expect(dialog).not.toHaveAttribute('aria-describedby');
+});
+
+
+afterEach(() => { vi.useRealTimers(); vi.restoreAllMocks(); vi.unstubAllGlobals(); document.documentElement.style.zoom = ''; });
+it.each(['error', 'conflict'])('retains the host draft after %s and reconciles only explicit success', outcome => {
+  vi.useFakeTimers();
+  render(<ThemeProvider><SettingsDialogGallery /></ThemeProvider>);
+  fireEvent.change(screen.getByLabelText('保存结果'), {target:{value:outcome}});
+  fireEvent.click(screen.getByText('打开设置'));
+  const dialog = screen.getByRole('dialog');
+  const draft = within(dialog).getByLabelText('工作区名称');
+  fireEvent.change(draft, {target:{value:'未提交草稿'}});
+  const save = within(dialog).getByRole('button', {name:'保存当前工作区设置'});
+  fireEvent.click(save); fireEvent.click(save);
+  expect(save).toHaveAttribute('aria-busy', 'true');
+  expect(save).toHaveAttribute('aria-disabled', 'true');
+  act(() => vi.advanceTimersByTime(500));
+  expect(draft).toHaveValue('未提交草稿');
+  expect(screen.getByText('已保存名称：研究工作区')).toBeInTheDocument();
+  expect(within(dialog).getByRole('alert')).toHaveTextContent(outcome === 'error' ? '保存失败' : '内容已更新');
+});
+
+it('cleans pending host requests and ignores an obsolete async section', () => {
+  vi.useFakeTimers();
+  const clear = vi.spyOn(globalThis, 'clearTimeout'), timer = vi.spyOn(globalThis, 'setTimeout');
+  const {unmount} = render(<ThemeProvider><SettingsDialogGallery /></ThemeProvider>);
+  fireEvent.click(screen.getByText('打开设置'));
+  fireEvent.click(screen.getByRole('link', {name:'异步栏目'}));
+  expect(screen.getByText('正在读取栏目')).toBeInTheDocument();
+  fireEvent.click(screen.getByRole('link', {name:'账号'}));
+  act(() => vi.advanceTimersByTime(500));
+  expect(screen.queryByText('异步栏目已就绪')).not.toBeInTheDocument();
+  fireEvent.click(screen.getByRole('button', {name:'保存当前工作区设置'}));
+  const hostTimers = timer.mock.calls.flatMap((call, i) => call[1] === 500 ? [timer.mock.results[i].value] : []);
+  unmount();
+  expect(hostTimers).toHaveLength(2);
+  for (const id of hostTimers) expect(clear).toHaveBeenCalledWith(id);
+});
+
+
+it('gives only the actual bounded body a named keyboard entry', () => {
+  const props = {trigger:<Button>Open</Button>, title:'Read', height:400, open:true, onOpenChange:() => {}};
+  const {rerender} = render(<Dialog {...props}><p>Long text</p></Dialog>);
+  expect(screen.getByRole('region', {name:'Read内容'})).toHaveClass('rhine-dialog__body');
+  expect(screen.getByRole('region')).toHaveAttribute('tabindex', '0');
+  rerender(<Dialog {...props} navigation={<a href="#a">Account</a>}><p>Long text</p></Dialog>);
+  expect(screen.getAllByRole('region')).toHaveLength(1);
+  expect(screen.getByRole('region')).toHaveClass('rhine-dialog__settings-content');
+  expect(screen.getByRole('dialog').querySelector('.rhine-dialog__body')).not.toHaveAttribute('tabindex');
+});
+
+it.each([undefined, 'auto'] as const)('caps an auto-height footer (%s) against the zoomed viewport and cleans observation', async initialHeight => {
+  vi.stubGlobal('innerHeight', 800);
+  const remove = vi.spyOn(window, 'removeEventListener');
+  const fixture = (height?: number | 'auto') => <Dialog trigger={<Button>Open</Button>} title="Auto" open onOpenChange={() => {}} height={height} footer={<Button>Action</Button>}><p>Text</p></Dialog>;
+  const {rerender,unmount} = render(fixture(initialHeight));
+  const dialog = screen.getByRole('dialog');
+  const limit = () => parseFloat(dialog.style.getPropertyValue('--rhine-dialog-footer-limit'));
+  expect(limit()).toBeCloseTo(307.2);
+  document.documentElement.style.zoom = '2';
+  fireEvent(window, new Event('resize'));
+  expect(limit()).toBeCloseTo(147.2);
+  vi.stubGlobal('innerHeight', 600); fireEvent(window, new Event('resize'));
+  expect(limit()).toBeCloseTo(107.2);
+  rerender(fixture(400));
+  expect(dialog.style.getPropertyValue('--rhine-dialog-footer-limit')).toBe('');
+  expect(remove).toHaveBeenCalledWith('resize', expect.any(Function));
+  unmount();
+});

package/tests/SingleSearch.test.tsx

@@ -0,0 +1,42 @@
+import { act, fireEvent, render, screen } from '@testing-library/react';
+import { afterEach, describe, expect, it, vi } from 'vitest';
+import { TextField } from '../components';
+import { SingleSearchGallery } from '../preview/SingleSearchGallery';
+
+afterEach(() => vi.useRealTimers());
+describe('single search contract', () => {
+  it('hides only the label visually, retains native props and rejects an empty name', () => {
+    const { rerender } = render(<TextField label="搜索" labelVisibility="hidden" aria-label=" " type="search" name="q" required />);
+    const input = screen.getByRole('searchbox', { name: '搜索' });
+    expect(input).toBeRequired(); expect(input).toHaveAttribute('name', 'q');
+    expect(screen.getByText('搜索')).toHaveClass('rhine-sr-only');
+    expect(input).not.toHaveAttribute('labelVisibility');
+    rerender(<TextField label="搜索" hint="提示" error="失败" disabled />);
+    expect(screen.getByLabelText('搜索')).toHaveAccessibleDescription('提示 失败');
+    expect(screen.getByText('搜索')).not.toHaveClass('rhine-sr-only');
+    expect(() => render(<TextField label=" " labelVisibility="hidden" />)).toThrow('non-empty label');
+  });
+  it('debounces committed composition and clears without moving focus or accepting stale results', () => {
+    vi.useFakeTimers(); render(<SingleSearchGallery />);
+    const input = screen.getByRole('searchbox'); input.focus();
+    fireEvent.compositionStart(input); fireEvent.change(input, { target: { value: '中文' } });
+    act(() => vi.advanceTimersByTime(1000)); expect(screen.getByRole('status')).toBeEmptyDOMElement();
+    fireEvent.keyDown(input, { key: 'Escape', isComposing: true }); expect(input).toHaveValue('中文');
+    fireEvent.compositionEnd(input); act(() => vi.advanceTimersByTime(250)); expect(screen.getByRole('status')).toHaveTextContent('正在搜索');
+    fireEvent.keyDown(input, { key: 'Escape' }); act(() => vi.advanceTimersByTime(1000));
+    expect(input).toHaveValue(''); expect(input).toHaveFocus(); expect(screen.getByRole('status')).toBeEmptyDOMElement();
+    fireEvent.change(input, { target: { value: '旧查询' } }); act(() => vi.advanceTimersByTime(250));
+    fireEvent.change(input, { target: { value: '新查询' } }); act(() => vi.advanceTimersByTime(750));
+    expect(screen.getByRole('status')).toHaveTextContent('新查询'); expect(screen.getByRole('status')).not.toHaveTextContent('旧查询');
+  });
+  it('announces errors and cancels pending work on disabling or unmount', () => {
+    vi.useFakeTimers(); const { unmount } = render(<SingleSearchGallery />);
+    fireEvent.change(screen.getByLabelText('搜索场景'), { target: { value: 'error' } });
+    fireEvent.change(screen.getByRole('searchbox'), { target: { value: '合成' } }); act(() => vi.advanceTimersByTime(750));
+    expect(screen.getByRole('searchbox')).toHaveAccessibleDescription('搜索失败，请修改查询后重试。');
+    expect(screen.getByRole('searchbox')).toHaveAttribute('aria-invalid', 'true');
+    fireEvent.change(screen.getByLabelText('搜索场景'), { target: { value: 'disabled' } });
+    expect(screen.getByRole('searchbox')).toBeDisabled(); expect(screen.getByRole('status')).toBeEmptyDOMElement();
+    unmount(); expect(vi.getTimerCount()).toBe(0);
+  });
+});