adobe/react-spectrum

Button does not recognize the pending state of `useFormStatus`

Open

#7,543 opened on Dec 21, 2024

View on GitHub
 (3 comments) (2 reactions) (0 assignees)TypeScript (1,500 forks)auto 404
Buttonhelp wantedneeds investigation

Repository metrics

Stars
 (15,634 stars)
PR merge metrics
 (PR metrics pending)

Description

Provide a general summary of the issue here

The Button using useButton and RAC Button doesn't reflect the pending state from useFormStatus.

🤔 Expected Behavior?

The button should reflect the pending state when interacting with it using Enter, Space, or click.

😯 Current Behavior

The Button created with useButton does not reflect the pending state when pressing the Enter key. In React Aria Components, interactions via Enter, Space, or click do not trigger the pending state.

💁 Possible Solution

No response

🔦 Context

No response

🖥️ Steps to Reproduce

  1. Try interacting with the button using Enter, Space, and click.
  2. Observe that the pending state is not reflected as expected.

You can use the following sandbox to reproduce the issue: CodeSandbox: infallible-meadow-yycwxf

https://github.com/user-attachments/assets/780dd597-0874-424c-9c86-01b55624cff8

Version

react-aria: 3.36.0, react-aria-components: 1.5.0

What browsers are you seeing the problem on?

Chrome

If other, please specify.

No response

What operating system are you using?

macOS 14.6.1

🧢 Your Company/Team

NextUI

🕷 Tracking Issue

[BUG] Button not recognizing pending state of useFormStatus hook · Issue #4397 · nextui-org/nextui

Contributor guide

Research direction
Investigate the interaction handlers in useButton and RAC Button to ensure they trigger the pending state from useFormStatus on Enter, Space, and click events.
Tech stack
javascripttypescriptreact
Domain
frontend
Issue type
Bug
DifficultyEstimated implementation difficulty for a new contributor, from 1 for very small changes to 5 for expert-level work.
2
Estimated timeA rough time range for an experienced contributor to investigate, implement, test, and prepare a pull request.
Under 1 hour
Activity statusHow available the issue appears right now: fresh, active, stale, blocked, or waiting on maintainer input.
Active
ClarityHow clearly the issue explains the expected change, acceptance criteria, and next step.
Clear
Prerequisites
ReactuseFormStatus
Newbie friendlinessA 1-100 score estimating how approachable this issue is for first-time contributors.
60