Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: improve OTP Delete keydown #48866

Closed

Conversation

Wxh16144
Copy link
Member

中文版模板 / Chinese template

🤔 This is a ...

  • New feature
  • Bug fix
  • Site / documentation update
  • Demo update
  • Component style update
  • TypeScript definition update
  • Bundle size optimization
  • Performance optimization
  • Enhancement feature
  • Internationalization
  • Refactoring
  • Code style optimization
  • Test Case
  • Branch merge
  • Workflow
  • Other (about what?)

🔗 Related issue link

💡 Background and solution

按下键盘Delete 时应该删除后一项?

📝 Changelog

Language Changelog
🇺🇸 English --
🇨🇳 Chinese --

☑️ Self-Check before Merge

⚠️ Please check all items below before requesting a reviewing. ⚠️

  • Doc is updated/provided or not needed
  • Demo is updated/provided or not needed
  • TypeScript definition is updated/provided or not needed
  • Changelog is provided or not needed

Copy link

stackblitz bot commented May 10, 2024

Review PR in StackBlitz Codeflow Run & review this pull request in StackBlitz Codeflow.

Copy link
Contributor

github-actions bot commented May 10, 2024

Preview is ready

Copy link
Contributor

github-actions bot commented May 10, 2024

👁 Visual Regression Report for PR #48866 Passed ✅

🎯 Target branch: master (1f39811)
📖 View Full Report ↗︎

🎊 Congrats! No visual-regression diff found.

Copy link

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

@Wxh16144
Copy link
Member Author

Copy link

codecov bot commented May 10, 2024

Codecov Report

Attention: Patch coverage is 73.33333% with 4 lines in your changes are missing coverage. Please review.

Project coverage is 99.96%. Comparing base (32b89e6) to head (1ad921a).
Report is 2 commits behind head on master.

Files Patch % Lines
components/input/OTP/OTPInput.tsx 73.33% 4 Missing ⚠️
Additional details and impacted files
@@             Coverage Diff             @@
##            master   #48866      +/-   ##
===========================================
- Coverage   100.00%   99.96%   -0.04%     
===========================================
  Files          746      746              
  Lines        12994    13001       +7     
  Branches      3411     3413       +2     
===========================================
+ Hits         12994    12997       +3     
- Misses           0        4       +4     

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

@@ -249,6 +249,7 @@ const OTP = React.forwardRef<OTPRef, OTPProps>((props, ref) => {
onActiveChange={onInputActiveChange}
autoFocus={index === 0 && autoFocus}
{...inputSharedProps}
__internalLastIndex={length - 1}
Copy link
Member

Choose a reason for hiding this comment

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

这个 prop 命名很奇怪。

@zombieJ
Copy link
Member

zombieJ commented May 10, 2024

截屏2024-05-10 17 09 11

在哪里 del,光标还在哪里。OTP 始终是 selected 的,和输入框有点不太一样

@Wxh16144
Copy link
Member Author

有点曲解了设计,现在每个 input 其实是 autoselect 的。 后面看看有没有其他人有类似的需求吧~

@Wxh16144 Wxh16144 closed this May 10, 2024
@teamco
Copy link

teamco commented May 19, 2024

It seems like there is also a validation problem:

  1. e.g. If you fill in all the fields and then start erasing, then the validation does not work
  2. error message not working as expected: {min, message: t(intl, 'form.validation.min', { entity, min })}

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

4 participants