adobe / adobe/react-spectrum

Extend timer api with current state for useToastState

Open
#4,649 2 comments 6 reactions 0 assignees View on GitHub
enhancement Toast
Dominant language
TypeScript
Stars
15.9k
Forks
1.6k
Avg merge
3d 9m
Merged PRs (30d)
59

Description

# 🙋 Feature Request

Provide timer state (ex. isRunning) for toast.

## 🤔 Expected Behavior

A `toast.timer` provide state of current timer.

## 😯 Current Behavior

A `toast.timer` has private property `timerId` for check timer state.

## 💁 Possible Solution

Add property `isRunning` for `Timer` (or `state="running | paused"`):
https://github.com/adobe/react-spectrum/blob/a30e1bf810e03f4a4457c788c1a1315423567e96/packages/%40react-stately/toast/src/useToastState.ts#L205-L209

## 🔦 Context

I create toasts with progress bar and when toast is hovered we can't stop animation because timer api doesn't have current state.

## 💻 Examples

```tsx
function Snackbar(props: ToastProps) {
const { toast } = props;

// @ts-expect-error (timerId is private API)
const timerId = toast?.timer?.timerId;

return (




);
}
```

## 🧢 Your Company/Team

Yandex

## 🎁 Tracking Ticket (optional)

N/A

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.