feat(web): whole-page image drop, projected intake limits, and thumbnail tiling

Second alignment step for #2248: document-level drag intake behind the new
DropOverlay atom, lightbox close icon and shared dialog mask, DeepSeek Chat
thumbnail rules (single 240px long edge with ratio clamp, 64px tiles, merged
consecutive assistant images), image limits raised to 20/10MiB/100MiB and
published to clients as the imageLimits projection, whole-batch intake
pre-check with product-copy banners, and attachment-error reasons mapped to
localized copy.

packages/client/ui-conversation/tests/image-labels.client.spec.tsx

@@ -9,6 +9,7 @@ import { AttachmentId } from '@deepseek-ai/dsh-attachment'
 import { makeTranslate } from '@deepseek-ai/dsh-client-test-runtime'
 import { zh as commonZh } from '@deepseek-ai/dsh-client-locale/src/locales/zh.ts'
 import { AssistantMarkdown } from '../src/client/chat/AssistantMarkdown.tsx'
+import { attachmentErrorText, imageSizeText } from '../src/client/image-labels.ts'
 import { en, zh } from '../src/client/locales.ts'
 
 afterEach(cleanup)
@@ -25,6 +26,38 @@ const attachment = {
   name: 'history.png',
 }
 
+describe('attachment rejection copy', () => {
+  const limits = {
+    maxImageBytes: 10 * 1024 * 1024,
+    maxImagesPerMessage: 20,
+    maxMessageImageBytes: 100 * 1024 * 1024,
+    maxImagePixels: 40_000_000,
+    mediaTypes: ['image/png'] as const,
+  }
+
+  it('renders megabytes without a trailing fraction unless one exists', () => {
+    expect(imageSizeText(10 * 1024 * 1024)).toBe('10MB')
+    expect(imageSizeText(2.5 * 1024 * 1024)).toBe('2.5MB')
+  })
+
+  it('maps user-solvable reasons to limit-naming copy', () => {
+    expect(attachmentErrorText(t, 'MODEL_DOES_NOT_SUPPORT_IMAGES')).toBe('当前模型不支持图片，请切换支持图片的模型')
+    expect(attachmentErrorText(t, 'SUBAGENT_IMAGE_UNSUPPORTED')).toBe('子智能体会话暂不支持图片')
+    expect(attachmentErrorText(t, 'IMAGE_TOO_MANY_PIXELS')).toBe('图片分辨率过大，请压缩后重试')
+    expect(attachmentErrorText(t, 'TOO_MANY_IMAGES', limits)).toBe('一条消息最多添加 20 张图片')
+    expect(attachmentErrorText(t, 'IMAGE_TOO_LARGE', limits)).toBe('单张图片不能超过 10MB')
+    expect(attachmentErrorText(t, 'IMAGES_TOO_LARGE', limits)).toBe('图片总大小超过 100MB，请移除部分图片')
+    expect(attachmentErrorText(enT, 'TOO_MANY_IMAGES', limits)).toBe('A message can include up to 20 images')
+  })
+
+  it('folds unknown reasons and limit reasons without projected limits into the send-failed line', () => {
+    expect(attachmentErrorText(t, 'INVALID_IMAGE_BASE64')).toBe('图片发送失败（INVALID_IMAGE_BASE64），请重新添加图片后再试')
+    expect(attachmentErrorText(t, 'TOO_MANY_IMAGES')).toBe('图片发送失败（TOO_MANY_IMAGES），请重新添加图片后再试')
+    expect(attachmentErrorText(t, 'IMAGE_TOO_LARGE')).toBe('图片发送失败（IMAGE_TOO_LARGE），请重新添加图片后再试')
+    expect(attachmentErrorText(t, 'IMAGES_TOO_LARGE')).toBe('图片发送失败（IMAGES_TOO_LARGE），请重新添加图片后再试')
+  })
+})
+
 describe('assistant images through the label bridge', () => {
   it('resolves zh dictionary strings and opens the lightbox on a single click', async () => {
     const view = render(
@@ -60,6 +93,27 @@ describe('assistant images through the label bridge', () => {
     expect(view.getByRole('button', { name: 'Close original image preview' })).toBeTruthy()
   })
 
+  it('merges consecutive image blocks into one tiled gallery, split by text', async () => {
+    const view = render(
+      <AssistantMarkdown
+        t={t}
+        blocks={[
+          { kind: 'image', attachment },
+          { kind: 'image', attachment },
+          { kind: 'text', text: 'between' },
+          { kind: 'image', attachment },
+        ]}
+        streaming={false}
+        loadImage={() => Promise.resolve('blob:grouped')}
+      />,
+    )
+    await view.findAllByAltText('history.png')
+    const galleries = view.container.querySelectorAll('[data-align="start"]')
+    expect(galleries).toHaveLength(2)
+    expect(galleries[0]?.querySelectorAll('[data-variant="tile"]')).toHaveLength(2)
+    expect(galleries[1]?.querySelectorAll('[data-variant="single"]')).toHaveLength(1)
+  })
+
   it('keeps assistant images at their original position between text blocks', async () => {
     const view = render(
       <AssistantMarkdown