Skip to content

fix(PinInput): remove default generic type #4346

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

Open
wants to merge 2 commits into
base: v3
Choose a base branch
from

Conversation

KIM-DONGJU
Copy link

@KIM-DONGJU KIM-DONGJU commented Jun 16, 2025

πŸ”— Linked issue

❓ Type of change

  • 🐞 Bug fix (a non-breaking change that fixes an issue)

πŸ“š Description

This PR updates the PinInput component to support 'number' as a valid value for the type prop.

Previously, the component only accepted 'text', which limited use cases where numeric input was desired (e.g., PIN codes, OTPs). While the documentation suggested that both 'text' and 'number' were supported, the actual type definition restricted the type prop to string onlyβ€”resulting in a TypeScript error when attempting to use type="number".

This fix corrects the type definition to explicitly allow both 'text' and 'number', aligning the implementation with the documented behavior and ensuring type safety without affecting existing functionality.

Changes include:

  • Updated defineProps to explicitly support both 'text' and 'number' types

πŸ“ Checklist

  • I have linked an issue or discussion.
  • I have updated the documentation accordingly.

Copy link

pkg-pr-new bot commented Jun 16, 2025

npm i https://pkg.pr.new/@nuxt/ui@4346

commit: 02b1b45

@@ -46,7 +46,7 @@ export type PinInputEmits<T extends PinInputType = 'text'> = PinInputRootEmits<T

</script>

<script setup lang="ts" generic="T extends PinInputType = 'text'">
<script setup lang="ts" generic="T extends PinInputType">
Copy link
Member

Choose a reason for hiding this comment

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

Indeed, this change is necessary there should be no default here. However, the playground should work with just string[] since the default type is text πŸ€”

Copy link
Member

Choose a reason for hiding this comment

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

That's what I was looking into but not there are no string[] | number[] definition. The Reka UI component defines it like this: type PinInputValue<Type extends PinInputType = 'text'> = Type extends 'number' ? number[] : string[]. This should work, I'm confused πŸ˜…

Copy link
Author

@KIM-DONGJU KIM-DONGJU Jun 16, 2025

Choose a reason for hiding this comment

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

I've looked into this as well, and it does correctly infer the type of the complete event when type="text" is explicitly specified, like in <UPinInput type="text" @ complete="onComplete" />.
However, I'm also unsure why TypeScript fails to infer the correct type when relying on the default type value.

Copy link
Author

Choose a reason for hiding this comment

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

@benjamincanac
Additionally, could you let me know the estimated release schedule for the version that includes reka-ui 2.3.1 (e.g., 3.1.4)?
Currently, it seems there's an issue where, in the current version, when the PinInput type is set to number, trying to clear the value results in it changing to 0 instead of being cleared.

@benjamincanac benjamincanac changed the title fix: support 'number' type for PinInput component fix(PinInput): remove generic default type Jun 16, 2025
@benjamincanac benjamincanac changed the title fix(PinInput): remove generic default type fix(PinInput): remove default generic type Jun 16, 2025
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.

2 participants