refactor(components): [avatar] use type-based definitions#23457
Conversation
📝 WalkthroughWalkthroughThis PR converts Avatar props to an explicit TypeScript surface: adds a public AvatarProps interface, replaces runtime prop objects with type-based defineProps/withDefaults in the component, and replaces avatar-group's dependency on avatarProps with explicit, validated prop descriptors for size and shape. Changes
Sequence Diagram(s)(Skipped — change is a props/type refactor without new multi-component control flow.) Estimated code review effort🎯 3 (Moderate) | ⏱️ ~20 minutes Possibly related PRs
Suggested reviewers
Poem
🚥 Pre-merge checks | ✅ 3✅ Passed checks (3 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing touches
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. Comment |
commit: |
|
🧪 Playground Preview: https://element-plus.run/?pr=23457 |
There was a problem hiding this comment.
Actionable comments posted: 2
🤖 Fix all issues with AI agents
In `@packages/components/avatar/src/avatar-group-props.ts`:
- Around line 14-18: The size prop type in avatar-group-props.ts inherits an
incomplete type from AvatarProps['size'] (currently ComponentSize only) so
update the AvatarProps interface to include number (e.g., change
AvatarProps.size to ComponentSize | number) so AvatarProps['size'] matches the
runtime ([Number, String]) and the definePropType<AvatarProps['size']> is
accurate; also ensure any related validators or type guards (the validator in
avatar-group-props.ts that uses isNumber) reflect the widened type (accept
ComponentSize | number) where applicable.
In `@packages/components/avatar/src/avatar.ts`:
- Around line 12-41: The AvatarProps interface's size property must allow
numeric values to match the runtime avatarProps validator; update
AvatarProps.size from size?: ComponentSize to include number (e.g., size?:
ComponentSize | number) so TypeScript consumers can pass numeric sizes and
remain consistent with the runtime validator used in avatarProps.
|
@E66Crisp Thanks for your contribution! ❤️ |

Please make sure these boxes are checked before submitting your PR, thank you!
devbranch.ref #23399
Summary by CodeRabbit
✏️ Tip: You can customize this high-level summary in your review settings.