refactor(components): [descriptions] use type-based definitions by SevenDreamYang · Pull Request #23434 · element-plus/element-plus

SevenDreamYang · 2026-01-18T06:36:28Z

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.

ref #23399

Other Notes

descriptionitem was not refactored because of defineComponent

Summary by CodeRabbit

Refactor
- Converted runtime prop definitions to exported typed interfaces and switched components to use typed props with explicit default values for common options, improving type safety and consistency.
- Added new public interfaces for instances and row data shapes.
Deprecations
- Marked legacy prop-definition aliases as deprecated and advised migration to the new public interfaces.

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

github-actions · 2026-01-18T06:36:36Z

coderabbitai · 2026-01-18T06:36:40Z

📝 Walkthrough

Walkthrough

Replaces runtime prop objects with explicit TypeScript prop interfaces for Descriptions and DescriptionsRow, adds exported interfaces DescriptionProps and DescriptionsRowProps, introduces DescriptionPropsPublic and DescriptionInstance, and switches components to withDefaults(defineProps<...>(), ...) with default values.

Changes

Cohort / File(s)	Change Summary
Descriptions Type Definition `packages/components/descriptions/src/description.ts`	Added exported `DescriptionProps` interface (border, column, direction, size, title, extra, labelWidth) and `DescriptionPropsPublic`; removed the old `ExtractPropTypes` alias, added `DescriptionInstance` type, kept `descriptionProps` runtime object with deprecation note.
Descriptions Component `packages/components/descriptions/src/description.vue`	Replaced runtime import with `import type { DescriptionProps }`; changed `defineProps(descriptionProps)` → `withDefaults(defineProps\<DescriptionProps\>(), { column: 3, direction: 'horizontal', title: '', extra: '' })`.
Descriptions Row Type Definition `packages/components/descriptions/src/descriptions-row.ts`	Added exported `DescriptionsRowProps` interface (`row?: DescriptionItemVNode[]`) and deprecation comment; retained existing `descriptionsRowProps`.
Descriptions Row Component `packages/components/descriptions/src/descriptions-row.vue`	Replaced runtime import with `import type { DescriptionsRowProps }`; changed `defineProps(descriptionsRowProps)` → `withDefaults(defineProps\<DescriptionsRowProps\>(), { row: () => [] })`.

Sequence Diagram(s)

(omitted)

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

Possibly related PRs

refactor(components): [affix] use type-based definitions #23400 — Same refactor pattern: runtime prop objects → exported TS prop interfaces and withDefaults(defineProps<...>()).
refactor(components): [tag] use type-based definitions #23421 — Introduces exported Props interfaces and switches components to typed defineProps with defaults.
refactor(components): [link] use type-based definitions #23411 — Similar migration from ExtractPropTypes to exported interfaces and ExtractPublicPropTypes.

Suggested reviewers

btea
keeplearning66

Poem

🐇 I hopped through props both old and new,
Types stitched tidy, defaults snug too,
Deprecated whispers softly fade,
Interfaces laid and not afraid,
Tiny rabbit cheers — refactor hooray! ✨

🚥 Pre-merge checks | ✅ 3

✅ Passed checks (3 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title clearly and specifically describes the main change: refactoring the descriptions component to use type-based prop definitions instead of runtime object definitions.
Description check	✅ Passed	The PR description includes the contributor checklist template and provides context (issue reference `#23399` and an explanatory note about descriptionitem), though it lacks a detailed explanation of the changes made.
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 · 2026-01-18T06:38:17Z

Open in StackBlitz

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

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

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

commit: c9dd7dc

coderabbitai

Actionable comments posted: 1

🤖 Fix all issues with AI agents

In `@packages/components/descriptions/src/description.vue`:
- Around line 36-52: The change sets a default empty string for labelWidth in
the withDefaults call, which alters runtime behavior by turning previously
undefined labelWidth into ''—remove labelWidth from the defaults object so
defineProps<DescriptionProps>() retains undefined when not provided; update the
withDefaults/defaults block referencing props and DescriptionProps (and ensure
any consumers checking labelWidth === undefined still work).

github-actions · 2026-01-18T06:43:42Z

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

github-actions · 2026-01-18T08:25:54Z

@SevenDreamYang Thanks for your contribution! ❤️

refactor(components): [descriptions] use type-based definitions

5f9d8d3

pull-request-triage Bot assigned SevenDreamYang Jan 18, 2026

pull-request-triage Bot added the Needs Review label Jan 18, 2026

github-actions Bot added the Contribution::Community label Jan 18, 2026

coderabbitai Bot reviewed Jan 18, 2026

View reviewed changes

Comment thread packages/components/descriptions/src/description.vue

btea mentioned this pull request Jan 18, 2026

Refactor Component Props to type-based declarations #23399

Closed

64 tasks

SevenDreamYang and others added 2 commits January 18, 2026 15:01

refactor(components): [descriptions] use type-based definitions fix

243d3b7

refactor: update

c9dd7dc

rzzf approved these changes Jan 18, 2026

View reviewed changes

btea approved these changes Jan 18, 2026

View reviewed changes

btea merged commit ac28b98 into element-plus:dev Jan 18, 2026
17 checks passed

coderabbitai Bot mentioned this pull request Jan 20, 2026

refactor(components): [notification] use type-based definitions #23445

Merged

3 tasks

coderabbitai Bot mentioned this pull request Jan 29, 2026

feat(components): [drawer] supplement type for DrawerInstance #23544

Merged

3 tasks

element-bot mentioned this pull request Jan 30, 2026

D2M #23568

Merged

3 tasks

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

refactor(components): [descriptions] use type-based definitions#23434

refactor(components): [descriptions] use type-based definitions#23434
btea merged 3 commits into
element-plus:devfrom
SevenDreamYang:use-type-based-definitions-descriptions

SevenDreamYang commented Jan 18, 2026 •

edited by coderabbitai Bot

Loading

Uh oh!

github-actions Bot commented Jan 18, 2026 •

edited

Loading

Uh oh!

coderabbitai Bot commented Jan 18, 2026 •

edited

Loading

Walkthrough

Changes

Sequence Diagram(s)

Estimated code review effort

Possibly related PRs

Suggested reviewers

Poem

Uh oh!

pkg-pr-new Bot commented Jan 18, 2026 •

edited

Loading

Uh oh!

coderabbitai Bot left a comment

Uh oh!

Uh oh!

github-actions Bot commented Jan 18, 2026 •

edited

Loading

Uh oh!

Uh oh!

github-actions Bot commented Jan 18, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

Uh oh!

Conversation

SevenDreamYang commented Jan 18, 2026 • edited by coderabbitai Bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Other Notes

Summary by CodeRabbit

Uh oh!

github-actions Bot commented Jan 18, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

coderabbitai Bot commented Jan 18, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Walkthrough

Changes

Sequence Diagram(s)

Estimated code review effort

Possibly related PRs

Suggested reviewers

Poem

Uh oh!

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

Uh oh!

Uh oh!

coderabbitai Bot left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

github-actions Bot commented Jan 18, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Uh oh!

github-actions Bot commented Jan 18, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

SevenDreamYang commented Jan 18, 2026 •

edited by coderabbitai Bot

Loading

github-actions Bot commented Jan 18, 2026 •

edited

Loading

coderabbitai Bot commented Jan 18, 2026 •

edited

Loading

pkg-pr-new Bot commented Jan 18, 2026 •

edited

Loading

github-actions Bot commented Jan 18, 2026 •

edited

Loading