refactor(components): [input-tag] use type-based definitions by lw56777 · Pull Request #23436 · element-plus/element-plus

lw56777 · 2026-01-18T07:45:16Z

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.

修复：#23399

Summary by CodeRabbit

Release Notes

Refactor
- Improved internal type definitions and prop declarations for the input-tag component, enhancing type safety and consistency across the component.

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

github-actions · 2026-01-18T07:45:26Z

coderabbitai · 2026-01-18T07:45:28Z

Warning

Rate limit exceeded

@rzzf has exceeded the limit for the number of commits that can be reviewed per hour. Please wait 7 minutes and 45 seconds before requesting another review.

⌛ How to resolve this issue?

After the wait time has elapsed, a review can be triggered using the @coderabbitai review command as a PR comment. Alternatively, push new commits to this PR.

We recommend that you space out your commits to avoid hitting the rate limit.

🚦 How do rate limits work?

CodeRabbit enforces hourly rate limits for each developer per organization.

Our paid plans have higher rate limits than the trial, open-source and free plans. In all cases, we re-allow further reviews after a brief timeout.

Please see our FAQ for further information.

📥 Commits

Reviewing files that changed from the base of the PR and between b2853fb and bce2f02.

📒 Files selected for processing (2)

packages/components/input-tag/src/input-tag.ts
packages/components/input-tag/src/input-tag.vue

📝 Walkthrough

Walkthrough

The PR refactors the input-tag component to use type-based prop definitions instead of runtime prop objects. It introduces an explicit InputTagProps interface, replaces ExtractPropTypes-based aliases, updates the Vue component to use defineProps<InputTagProps>() with withDefaults for default values, and adds a non-null assertion for the delimiter prop in the composable.

Changes

Cohort / File(s)	Summary
Type Definitions `packages/components/input-tag/src/input-tag.ts`	Replaced runtime `ExtractPropTypes` alias with explicit `InputTagProps` interface containing all 21 props. Deprecated old `InputTagPropsPublic` alias; added detailed prop documentation.
Component Implementation `packages/components/input-tag/src/input-tag.vue`	Switched from runtime prop object to typed `defineProps<InputTagProps>()` wrapped in `withDefaults`. Added 12 prop defaults (disabled, tagType, effect, trigger, delimiter, clearIcon, id, tabindex, autocomplete, validateEvent, saveOnBlur, maxCollapseTags). Updated imports to include `EVENT_CODE`, `markRaw`, `CircleClose`, and the new `InputTagProps` type.
Composable `packages/components/input-tag/src/composables/use-input-tag.ts`	Added non-null assertion on `props.delimiter!` in the `split` call within `getDelimitedTags`, assuming delimiter is defined at that code path.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

Possibly related PRs

refactor(components): [icon] use type-based definitions #23412: Performs the same refactor pattern—replacing runtime prop objects with type-based interfaces and switching to defineProps<...>()
refactor(components): [check-tag] use type-based definitions #23424: Replaces ExtractPropTypes aliases with explicit interfaces and updates components to use typed defineProps<T>() with withDefaults
refactor(components): [affix] use type-based definitions #23400: Introduces explicit Props interface, deprecates old ExtractPropTypes alias, and switches component to withDefaults(defineProps<...>())

Suggested labels

Contribution::Community

Suggested reviewers

keeplearning66
btea
rzzf

Poem

🐰 Props now typed, no runtime strings,
A cleaner path for Vue-y things!
Defaults set, assertions made so clear,
The input-tag evolves right here! ✨

🚥 Pre-merge checks | ✅ 1 | ❌ 2

❌ Failed checks (2 warnings)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%.	Write docstrings for the functions missing them to satisfy the coverage threshold.
Description check	⚠️ Warning	PR description lacks substantive details about the changes, relying only on the issue reference `#23399` without explaining the refactoring work performed.	Add a detailed description explaining the type-based refactoring changes, how they improve the component, and any breaking changes or migration notes for users.

✅ Passed checks (1 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title accurately describes the main change: refactoring the input-tag component to use type-based prop definitions instead of the previous extractprop-based approach.

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

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-18T07:46:52Z

Open in StackBlitz

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

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

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

commit: bce2f02

github-actions · 2026-01-18T07:55:01Z

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

keeplearning66

Thank you!

github-actions · 2026-01-18T09:02:03Z

@lw56777 Thanks for your contribution! ❤️

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

b2853fb

pull-request-triage Bot assigned lw56777 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

Merge branch 'dev' into refactor/input-tag-ComponentProps-#23399

c7bf784

rzzf mentioned this pull request Jan 18, 2026

Refactor Component Props to type-based declarations #23399

Closed

64 tasks

refactor: update

f6e3e38

rzzf approved these changes Jan 18, 2026

View reviewed changes

keeplearning66 approved these changes Jan 18, 2026

View reviewed changes

btea reviewed Jan 18, 2026

View reviewed changes

Comment thread packages/components/input-tag/src/input-tag.ts Outdated

Comment thread packages/components/input-tag/src/input-tag.vue Outdated

refactor: update

bce2f02

btea approved these changes Jan 18, 2026

View reviewed changes

btea merged commit eb01fa9 into element-plus:dev Jan 18, 2026
16 checks passed

coderabbitai Bot mentioned this pull request Jan 18, 2026

refactor(components): [message] use type-based definitions #23423

Merged

3 tasks

lw56777 deleted the refactor/input-tag-ComponentProps-#23399 branch January 18, 2026 09:46

This was referenced Jan 19, 2026

refactor(components): [timelineItem] use type-based definitions #23479

Merged

refactor(components): [form/form-item] use type-based definitions #23483

Merged

element-bot mentioned this pull request Jan 30, 2026

D2M #23568

Merged

3 tasks

coderabbitai Bot mentioned this pull request Feb 21, 2026

fix(components): [input-tag] delimiter does not support pasted line breaks #23674

Merged

3 tasks

coderabbitai Bot mentioned this pull request Mar 16, 2026

refactor(components): refs to useTemplateRef #23814

Open

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

refactor(components): [input-tag] use type-based definitions#23436

refactor(components): [input-tag] use type-based definitions#23436
btea merged 4 commits into
element-plus:devfrom
lw56777:refactor/input-tag-ComponentProps-#23399

lw56777 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

Rate limit exceeded

Walkthrough

Changes

Estimated code review effort

Possibly related PRs

Suggested labels

Suggested reviewers

Poem

Uh oh!

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

edited

Loading

Uh oh!

github-actions Bot commented Jan 18, 2026 •

edited

Loading

Uh oh!

keeplearning66 left a comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

github-actions Bot commented Jan 18, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

Uh oh!

Conversation

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

Uh oh!

Summary by CodeRabbit

Release Notes

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!

Rate limit exceeded

Walkthrough

Changes

Estimated code review effort

Possibly related PRs

Suggested labels

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!

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!

keeplearning66 left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

github-actions Bot commented Jan 18, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

lw56777 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