feat: Add customize icon by wanpan11 · Pull Request #52216 · ant-design/ant-design

wanpan11 · 2025-01-03T02:25:09Z

🤔 This is a ...

🔗 Related Issues

ref feat:🔥New Component: Splitter #50038 (comment)

💡 Background and Solution

自定义操作图标

📝 Change Log

Language	Changelog
🇺🇸 English	Add customize handle elements and style
🇨🇳 Chinese	新增自定义交互图标

…o splitter

bolt-new-by-stackblitz · 2025-01-03T02:25:12Z

Run & review this pull request in StackBlitz Codeflow.

github-actions · 2025-01-03T02:25:20Z

github-actions · 2025-01-03T02:25:21Z

👁 Visual Regression Report for PR #52216 Failed ❌

🎯 Target branch: next (1f50049)
📖 View Full Report ↗︎
📊 Summary: 🔄 1 changed, 🆕 6 added

Expected (Branch next)	Actual (Current PR)	Diff
input-group.compact.png	input-group.compact.css-var.png
	splitter-customize.compact.css-var.png	🆕🆕🆕 Added 🆕🆕🆕
	splitter-customize.compact.png	🆕🆕🆕 Added 🆕🆕🆕
	splitter-customize.dark.css-var.png	🆕🆕🆕 Added 🆕🆕🆕
	splitter-customize.dark.png	🆕🆕🆕 Added 🆕🆕🆕
	splitter-customize.default.css-var.png	🆕🆕🆕 Added 🆕🆕🆕
	splitter-customize.default.png	🆕🆕🆕 Added 🆕🆕🆕

Important

There are 7 diffs found in this PR: 🔄 1 changed, 🆕 6 added.
Please check all items:

Visual diff is acceptable

petercat-assistant · 2025-01-03T02:25:24Z

Walkthrough

This pull request introduces a new feature that allows for the customization of icons within the splitter component. It adds support for custom dragger and collapsible icons, enhancing the flexibility and visual customization of the component.

Changes

Files	Summary
components/splitter/SplitBar.tsx, components/splitter/Splitter.tsx, components/splitter/interface.ts	Added support for custom dragger and collapsible icons in the splitter component.
components/splitter/tests/index.test.tsx	Added tests for the new customization feature.
components/splitter/demo/customize.md, components/splitter/demo/customize.tsx	Added a demo showcasing the customization of icons.
components/splitter/index.en-US.md, components/splitter/index.zh-CN.md	Updated documentation to include the new customization options.
components/splitter/style/index.ts	Updated styles to support the new customizable icons.

components/splitter/SplitBar.tsx

pkg-pr-new · 2025-01-03T02:28:38Z

Open in Stackblitz

More templates

npm i https://pkg.pr.new/ant-design/ant-design/antd@52216

commit: 84208a2

codecov · 2025-01-03T02:39:30Z

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 100.00%. Comparing base (1f50049) to head (84208a2).
Report is 2 commits behind head on next.

Additional details and impacted files

@@            Coverage Diff            @@
##              next    #52216   +/-   ##
=========================================
  Coverage   100.00%   100.00%           
=========================================
  Files          760       760           
  Lines        13681     13693   +12     
  Branches      3576      3582    +6     
=========================================
+ Hits         13681     13693   +12

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

codecov · 2025-01-03T03:45:37Z

Bundle Report

Changes will increase total bundle size by 5.88kB (0.17%) ⬆️. This is within the configured threshold ✅

Detailed changes

Bundle name	Size	Change
antd.min-array-push	3.39MB	5.88kB (0.17%) ⬆️

yoyo837 · 2025-01-03T03:58:19Z

Bundle Report

Changes will increase total bundle size by 1.7kB (0.05%) ⬆️. This is within the configured threshold ✅

Detailed changes
Bundle name Size Change
antd.min-array-push 3.37MB 1.7kB (0.05%) ⬆️

1.7K ？不少哦

wanpan11 · 2025-01-03T04:08:01Z

1.7K ？不少哦

感觉没加几行代码呀 😂

yoyo837 · 2025-01-03T04:09:57Z

我的意思也是没几行，怎么多1K多，会不会哪里弄错了。

components/splitter/SplitBar.tsx

Co-authored-by: lijianan <[email protected]> Signed-off-by: Wanpan <[email protected]>

components/splitter/interface.ts

li-jia-nan · 2025-01-03T15:21:20Z

这个挪到 next 分支吧

Co-authored-by: lijianan <[email protected]> Signed-off-by: Wanpan <[email protected]>

components/splitter/SplitBar.tsx

wanpan11 · 2025-01-05T00:56:57Z

@li-jia-nan 佬这个 pr 定制不了分割线样式我改了引用，
@zombieJ 还有个问题 splitter 的分割线是用 ::before 做的弄不了语义化 class/style，只能用 token 处理。
下个 pr 我再处理分割线

li-jia-nan · 2025-01-05T08:05:03Z

@li-jia-nan 佬这个 pr 定制不了分割线样式我改了引用， @zombieJ 还有个问题 splitter 的分割线是用 ::before 做的弄不了语义化 class/style，只能用 token 处理。下个 pr 我再处理分割线

啊，那是我弄错了

components/splitter/SplitBar.tsx

components/splitter/__tests__/index.test.tsx

wanpan11 added 12 commits December 31, 2024 17:49

feat: custom icon

707973f

feat: add style

95e57c6

feat: add collapsibleIcon

308f881

feat: custom icon

47bd689

feat: add style

d241d7f

feat: add collapsibleIcon

511e8d1

Merge branch 'splitter' of https://github.com/wanpan11/ant-design int…

b8e2625

…o splitter

feat: add test

14e31d0

feat: update snap

2e3c85d

feat: update doc

7b57f31

feat: update snap

2512e8c

feat: rename

a557756

petercat-assistant bot reviewed Jan 3, 2025

View reviewed changes

components/splitter/SplitBar.tsx Outdated Show resolved Hide resolved

fix: default icon

ad81a56

li-jia-nan reviewed Jan 3, 2025

View reviewed changes

components/splitter/SplitBar.tsx Outdated Show resolved Hide resolved

wanpan11 and others added 2 commits January 3, 2025 13:36

Update components/splitter/SplitBar.tsx

836f61c

Co-authored-by: lijianan <[email protected]> Signed-off-by: Wanpan <[email protected]>

Merge branch 'feature' into splitter

5633abc

li-jia-nan reviewed Jan 3, 2025

View reviewed changes

components/splitter/interface.ts Outdated Show resolved Hide resolved

wanpan11 changed the base branch from feature to next January 4, 2025 13:36

Update components/splitter/index.zh-CN.md

88311b7

Co-authored-by: lijianan <[email protected]> Signed-off-by: Wanpan <[email protected]>

li-jia-nan reviewed Jan 4, 2025

View reviewed changes

components/splitter/SplitBar.tsx Outdated Show resolved Hide resolved

li-jia-nan reviewed Jan 4, 2025

View reviewed changes

components/splitter/SplitBar.tsx Outdated Show resolved Hide resolved

li-jia-nan reviewed Jan 4, 2025

View reviewed changes

components/splitter/SplitBar.tsx Show resolved Hide resolved

feat: code optimization

ca9c489

li-jia-nan mentioned this pull request Jan 4, 2025

Ant Design v6 tasks #52115

Closed

wanpan11 added 3 commits January 8, 2025 17:25

chore: Merge branch next into splitter

7bb1d1e

Merge branch 'next' into splitter

528d38f

Merge branch 'next' into splitter

371ea27

zombieJ reviewed Jan 10, 2025

View reviewed changes

components/splitter/SplitBar.tsx Outdated Show resolved Hide resolved

zombieJ reviewed Jan 10, 2025

View reviewed changes

components/splitter/SplitBar.tsx Outdated Show resolved Hide resolved

wanpan11 added 4 commits January 11, 2025 00:10

Merge branch 'next' into splitter

4d5a140

feat: update

d4d88a6

Merge branch 'next' into splitter

d8dcbf2

Merge branch 'next' into splitter

2a40815

zombieJ reviewed Jan 14, 2025

View reviewed changes

components/splitter/__tests__/index.test.tsx Outdated Show resolved Hide resolved

zombieJ reviewed Jan 14, 2025

View reviewed changes

components/splitter/__tests__/index.test.tsx Outdated Show resolved Hide resolved

wanpan11 added 3 commits January 14, 2025 12:12

test: update

e34ec4a

feat: rename

04bef4a

test: update

5ce35c1

wanpan11 requested a review from zombieJ January 14, 2025 06:25

wanpan11 added 3 commits January 14, 2025 16:47

feat: update draggerIcon

e5df252

test: update

953b870

Merge branch 'next' into splitter

84208a2

zombieJ approved these changes Jan 15, 2025

View reviewed changes

zombieJ merged commit 0df33b2 into ant-design:next Jan 15, 2025
37 checks passed

wanpan11 deleted the splitter branch January 16, 2025 01:03

wanpan11 mentioned this pull request Apr 18, 2025

Splitter 能不能让collapse图标一直显示呢? #53540

Closed

Uh oh!

Comments

Conversation

wanpan11 commented Jan 3, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

🤔 This is a ...

🔗 Related Issues

💡 Background and Solution

📝 Change Log

Uh oh!

bolt-new-by-stackblitz bot commented Jan 3, 2025

Uh oh!

github-actions bot commented Jan 3, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

github-actions bot commented Jan 3, 2025 • edited by wanpan11 Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

👁 Visual Regression Report for PR #52216 Failed ❌

Uh oh!

petercat-assistant bot commented Jan 3, 2025

Walkthrough

Changes

Uh oh!

Uh oh!

pkg-pr-new bot commented Jan 3, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

codecov bot commented Jan 3, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Codecov Report

Uh oh!

codecov bot commented Jan 3, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Bundle Report

Uh oh!

yoyo837 commented Jan 3, 2025

Bundle Report

Uh oh!

wanpan11 commented Jan 3, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

yoyo837 commented Jan 3, 2025

Uh oh!

Uh oh!

Uh oh!

li-jia-nan commented Jan 3, 2025

Uh oh!

Uh oh!

Uh oh!

Uh oh!

wanpan11 commented Jan 5, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

li-jia-nan commented Jan 5, 2025

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

wanpan11 commented Jan 3, 2025 •

edited

Loading

github-actions bot commented Jan 3, 2025 •

edited

Loading

github-actions bot commented Jan 3, 2025 •

edited by wanpan11

Loading

pkg-pr-new bot commented Jan 3, 2025 •

edited

Loading

codecov bot commented Jan 3, 2025 •

edited

Loading

codecov bot commented Jan 3, 2025 •

edited

Loading

wanpan11 commented Jan 3, 2025 •

edited

Loading

wanpan11 commented Jan 5, 2025 •

edited

Loading