Skip to content

feat(sender): support pasteFilter prop for custom paste text cleaning - #2001

Open
Y-MuYi wants to merge 1 commit into
ant-design:mainfrom
Y-MuYi:feat/sender-paste-filter
Open

feat(sender): support pasteFilter prop for custom paste text cleaning#2001
Y-MuYi wants to merge 1 commit into
ant-design:mainfrom
Y-MuYi:feat/sender-paste-filter

Conversation

@Y-MuYi

@Y-MuYi Y-MuYi commented Jul 31, 2026

Copy link
Copy Markdown

What

Add a pasteFilter prop to Sender so users can customize how pasted text is cleaned in slot mode.

Why

In slot mode, the default getCleanedText strips all line breaks (use-cursor.ts.replace(/\n/g, '')), so pasting multi-line text (code snippets, structured text) loses its formatting. Closes #1946.

How

The new prop is wired through SenderSenderContextSlotTextArea, and the paste handler uses it to replace the default cleaning:

const cleanedText = pasteFilter ? pasteFilter(text) : getCleanedText(text);

pasteFilter receives the raw pasted text and should return the final text to insert. For example, pasteFilter={(t) => t} keeps the original line breaks that the default cleaning would strip.

Slot mode only — the non-slot (native textarea) path is unchanged.

Changes

  • interface.ts: add pasteFilter?: (text: string) => string (+ JSDoc)
  • Sender.tsx: pass pasteFilter through context (destructure, value object, dependency array)
  • SlotTextArea.tsx: apply the filter in onInternalPaste
  • demo/paste-filter.tsx + .md: new demo
  • slot.test.tsx: test that pasteFilter receives the raw text and that its return value is what gets inserted

Demo

<Sender
  slotConfig={slotConfig}
  pasteFilter={(t) => t} // keep line breaks of pasted content
/>

Summary by CodeRabbit

  • 新功能

    • 新增 pasteFilter 配置,支持自定义粘贴文本处理方式。
    • 支持在插槽模式下保留粘贴内容中的换行和原始排版。
    • 未配置过滤器时,继续使用默认的文本清理规则。
  • 文档

    • 新增中英文示例,说明如何配置粘贴过滤及保留换行。
Snipaste_2026-07-31_15-34-25

In slot mode, the default `getCleanedText` strips line breaks from pasted
text, making it impossible to preserve multi-line formatting (e.g. code
snippets). Add a `pasteFilter` prop so users can fully replace the default
cleaning:

    const cleanedText = pasteFilter ? pasteFilter(text) : getCleanedText(text);

`pasteFilter` receives the raw pasted text and should return the final text
to insert. e.g. `pasteFilter={(t) => t}` keeps line breaks intact.

Slot mode only; the non-slot (native textarea) path is unchanged.

Closes ant-design#1946

Co-Authored-By: Claude <noreply@anthropic.com>
@dosubot dosubot Bot added enhancement New feature or request javascript Pull requests that update Javascript code labels Jul 31, 2026
@gemini-code-assist

Copy link
Copy Markdown
Contributor

Caution

The consumer version of Gemini Code Assist on GitHub has been sunset. All code review activity has officially ceased.

@coderabbitai

coderabbitai Bot commented Jul 31, 2026

Copy link
Copy Markdown
Contributor

Review Change Stack

📝 Walkthrough

Walkthrough

Sender 新增可选的 pasteFilter 属性。slot 模式会优先使用该过滤器处理粘贴文本,并保留默认清理逻辑作为回退。新增测试、演示组件和使用文档。

Changes

Sender 粘贴过滤支持

Layer / File(s) Summary
过滤器契约与上下文传递
packages/x/components/sender/interface.ts, packages/x/components/sender/Sender.tsx
SenderProps 新增 pasteFilter?: (text: string) => stringSender 将配置传递到 SenderContext,并加入 useMemo 依赖。
Slot 粘贴处理与测试
packages/x/components/sender/components/SlotTextArea.tsx, packages/x/components/sender/__tests__/slot.test.tsx
slot 模式优先调用 pasteFilter。未配置时继续调用 getCleanedText。测试验证原始多行文本、过滤器返回值和 document.execCommand('insertText') 的插入内容。
演示与使用说明
packages/x/components/sender/demo/paste-filter.tsx, packages/x/components/sender/demo/paste-filter.md
新增演示组件和中英文文档,展示使用恒等函数保留粘贴文本中的换行符。

Estimated code review effort: 2 (Simple) | ~10 minutes

Sequence Diagram(s)

sequenceDiagram
  participant Sender
  participant SenderContext
  participant SlotTextArea
  participant Browser
  Sender->>SenderContext: 传递 pasteFilter
  SenderContext->>SlotTextArea: 提供粘贴过滤配置
  SlotTextArea->>SlotTextArea: 处理原始粘贴文本
  SlotTextArea->>Browser: execCommand 插入过滤后文本
Loading

Possibly related PRs

  • ant-design/x#1967:同样修改 SlotTextArea 及其测试,但处理的是插槽删除行为。

Suggested labels: documentation

Suggested reviewers: kimteayon

Poem

兔子捧着多行字,
换行轻轻留原位。
过滤器来定规则,
插槽接住新文本。
文档测试齐欢跳,
耳朵一抖,代码成。

🚥 Pre-merge checks | ✅ 5
✅ Passed checks (5 passed)
Check name Status Explanation
Linked Issues check ✅ Passed 实现满足问题 #1946:slot 模式支持自定义 pasteFilter,默认保留 getCleanedText 行为,并通过上下文、测试和示例完成覆盖。
Out of Scope Changes check ✅ Passed 所有代码、测试、文档和示例变更均服务于问题 #1946 的 pasteFilter 目标,未发现无关修改。
Docstring Coverage ✅ Passed No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title check ✅ Passed 标题准确概括了为 Sender 增加 pasteFilter 属性并支持自定义粘贴文本清洗这一主要变更。
✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands.

@coderabbitai coderabbitai Bot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🧹 Nitpick comments (1)
packages/x/components/sender/__tests__/slot.test.tsx (1)

671-690: 🎯 Functional Correctness | 🔵 Trivial | ⚡ Quick win

补充粘贴后的最终值断言。

当前测试只检查 document.execCommand 的第三个参数。它没有确认 SlotTextArea 的最终值仍包含换行。jest.fn() 默认返回 undefined,因此测试还会进入 insert fallback。请增加 getValue().valueonChange 断言,并明确模拟 execCommand 成功或 fallback。这样可以覆盖粘贴后的实际结果。

🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@packages/x/components/sender/__tests__/slot.test.tsx` around lines 671 - 690,
增强“should apply pasteFilter that preserves line breaks”测试:明确让
document.execCommand 模拟成功,或显式覆盖并验证 insert fallback 路径;同时通过 SlotTextArea 的
getValue().value 或 onChange 断言粘贴后的最终值仍为包含换行的 “a\nb\nc”,不要只断言 execCommand 的参数。
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Nitpick comments:
In `@packages/x/components/sender/__tests__/slot.test.tsx`:
- Around line 671-690: 增强“should apply pasteFilter that preserves line
breaks”测试:明确让 document.execCommand 模拟成功,或显式覆盖并验证 insert fallback 路径;同时通过
SlotTextArea 的 getValue().value 或 onChange 断言粘贴后的最终值仍为包含换行的 “a\nb\nc”,不要只断言
execCommand 的参数。

ℹ️ Review info
⚙️ Run configuration

Configuration used: Repository UI

Review profile: CHILL

Plan: Pro Plus

Run ID: 4b2b5bce-eccc-45c0-9b17-f1caca373500

📥 Commits

Reviewing files that changed from the base of the PR and between b529d8e and cc9583b.

📒 Files selected for processing (6)
  • packages/x/components/sender/Sender.tsx
  • packages/x/components/sender/__tests__/slot.test.tsx
  • packages/x/components/sender/components/SlotTextArea.tsx
  • packages/x/components/sender/demo/paste-filter.md
  • packages/x/components/sender/demo/paste-filter.tsx
  • packages/x/components/sender/interface.ts

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

enhancement New feature or request javascript Pull requests that update Javascript code

Projects

None yet

Development

Successfully merging this pull request may close these issues.

feat(Sender): support custom paste text filter via pasteFilter prop

1 participant