Skip to content

refactor(components): [icon] use type-based definitions#23412

Merged
rzzf merged 1 commit into
element-plus:devfrom
cjn021:refactor/icon-type-based
Jan 17, 2026
Merged

refactor(components): [icon] use type-based definitions#23412
rzzf merged 1 commit into
element-plus:devfrom
cjn021:refactor/icon-type-based

Conversation

@cjn021
Copy link
Copy Markdown
Contributor

@cjn021 cjn021 commented Jan 17, 2026 •
edited by coderabbitai Bot
Loading

Please make sure these boxes are checked before submitting your PR, thank you!

  • Make sure you follow contributing guide English | (中文 | Español | Français).
  • Make sure you are merging your commits to dev branch.
  • Add some descriptions and refer to relative issues for your PR.

Summary by CodeRabbit

  • Refactor
    • Updated the icon component's type definitions to use modern TypeScript patterns for improved clarity and maintainability.
    • Added deprecation notices to prepare for future API changes and guide proper implementation patterns.

✏️ Tip: You can customize this high-level summary in your review settings.

@github-actions
Copy link
Copy Markdown
Contributor

github-actions Bot commented Jan 17, 2026 •
edited
Loading

@coderabbitai
Copy link
Copy Markdown
Contributor

coderabbitai Bot commented Jan 17, 2026 •
edited
Loading

📝 Walkthrough

Walkthrough

This PR refactors the Icon component's prop system by introducing a typed interface approach. It replaces runtime prop definitions with defineProps<IconProps>() and adds explicit defaults via withDefaults, while updating imports to use type-only syntax where appropriate.

Changes

Cohort / File(s) Change Summary
Icon Component Type Refactoring
packages/components/icon/src/icon.ts		 Added new IconProps interface with size and color properties. Removed ExtractPropTypes import while retaining ExtractPublicPropTypes. Renamed public type alias from IconProps to IconPropsPublic. Added deprecation notices above iconProps export and new alias.
Icon Component Type Refactoring
packages/components/icon/src/icon.vue		 Changed prop definition from defineProps(iconProps) to withDefaults(defineProps<IconProps>(), { size: undefined }). Updated imports to remove runtime iconProps import and add type-only IconProps import.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~12 minutes

Poem

🐰 With whiskers twitching and types in sight,
Props now dance with TypeScript's light!
No more runtime, just typed embrace,
Icons leap with type-safe grace! ✨

🚥 Pre-merge checks | ✅ 2 | ❌ 1
❌ Failed checks (1 warning)
Check name Status Explanation Resolution
Description check ⚠️ Warning The description only contains an unchecked template checklist with no actual content, rationale, or issue references provided. Add a substantive description explaining the refactoring rationale, what changed, and why. Include references to any related issues.
✅ Passed checks (2 passed)
Check name Status Explanation
Title check ✅ Passed The title clearly describes the main refactoring change: converting icon component to use type-based prop definitions instead of runtime prop objects.
Docstring Coverage ✅ Passed No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

✏️ Tip: You can configure your own custom pre-merge checks in the settings.

✨ Finishing touches
  • 📝 Generate docstrings

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 and usage tips.

@pkg-pr-new
Copy link
Copy Markdown

pkg-pr-new Bot commented Jan 17, 2026

Open in StackBlitz

pnpm add https://pkg.pr.new/element-plus/element-plus@23412

npm i https://pkg.pr.new/element-plus/element-plus@23412

yarn add https://pkg.pr.new/element-plus/[email protected]

commit: 86a6fcd

@github-actions
Copy link
Copy Markdown
Contributor

github-actions Bot commented Jan 17, 2026

🧪 Playground Preview: https://element-plus.run/?pr=23412
Please comment the example via this playground if needed.

keeplearning66
keeplearning66 approved these changes Jan 17, 2026
View reviewed changes
Copy link
Copy Markdown
Member

@keeplearning66 keeplearning66 left a comment

Choose a reason for hiding this comment

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

Thank you!

rzzf
rzzf approved these changes Jan 17, 2026
View reviewed changes
Copy link
Copy Markdown
Member

@rzzf rzzf left a comment

Choose a reason for hiding this comment

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

Nice, thank you!

@rzzf rzzf merged commit 03303ff into element-plus:dev Jan 17, 2026
21 of 22 checks passed
@github-actions
Copy link
Copy Markdown
Contributor

github-actions Bot commented Jan 17, 2026

@Lensiq Thanks for your contribution! ❤️

This was referenced Jan 17, 2026
Merged
Merged
Merged
Merged
@rzzf rzzf mentioned this pull request Jan 17, 2026
Closed
64 tasks
This was referenced Jan 17, 2026
Merged
Closed
Merged
Merged
Merged
Merged
Closed
Closed
Merged
Merged
Merged
Merged
Closed
This was referenced Jan 18, 2026
Merged
Merged
Merged
Merged
Merged
Merged
Merged
Merged
Merged
Merged
Merged
Merged
Merged
Merged
Merged
@element-bot element-bot mentioned this pull request Jan 30, 2026
Merged
3 tasks
@coderabbitai coderabbitai Bot mentioned this pull request Feb 2, 2026
Merged
3 tasks
@coderabbitai coderabbitai Bot mentioned this pull request Feb 22, 2026
Merged
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@rzzf rzzf rzzf approved these changes

@keeplearning66 keeplearning66 keeplearning66 approved these changes

Assignees

@cjn021 cjn021

Labels

Contribution::Community Needs Review

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

3 participants

@cjn021 @rzzf @keeplearning66