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

[UI]: Generate <button type="button"> to use in HTML form #270

Open
IlyaSemenov opened this issue Oct 17, 2024 · 0 comments
Open

[UI]: Generate <button type="button"> to use in HTML form #270

IlyaSemenov opened this issue Oct 17, 2024 · 0 comments
Labels
enhancement New feature or request

Comments

@IlyaSemenov
Copy link

Is your feature request related to a problem?

I'm frustrated when I'm unable to use <div id="ton-connect"> to place the Wallet Connect button inside a HTML form.

If I do so, the generated <button> tag has no explicit type attribute and as such is treated as a form submit button. When user presses Enter in an input field to submit the form, the Wallet Connect UI pops up undesirably.

Reproduction:

  1. Open https://stackblitz.com/edit/vitejs-vite-7rbtag and wait for it to load.
  2. Type any number in the input field under "Deposit amount"
  3. Press Enter on the keyboard to submit the form (don't click "Submit").

Expected: only alert message shows.

Actual result: alert shows and Wallet Connect UI appears, too.

Describe the solution you'd like

Ideally, I would like <div id="ton-connect"> to generate <button type="button"> by default, and for those rare occasions when it actually needs to be a submit button, allow to override button type with <div id="ton-connect" data-button-type="submit">.

Describe alternatives you've considered

As a backwards compatible solution, just copy data-button-type attribute into <button type> if it's provided. Keep the default behavior unchanged (no explicit type).

Additional context

At first I was thinking it's a shortcoming in @townsquarelabs/ui-vue and reported it there:

TownSquareXYZ/tonconnect-ui-vue#16

but then I figured it's an upstream problem.

@IlyaSemenov IlyaSemenov added the enhancement New feature or request label Oct 17, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

No branches or pull requests

1 participant