feat(config): add transition durations for tailwind

[booc0mtaco]

• add in durations via (transitionDuration)

• add in new toast notification implementation example

• use new medium durations in example

• demo autodismiss behavior with stack of notifications

• use state to track

Test Plan:

• Wrote/updated automated tests
• CI tests / new tests are not applicable
• Manually tested my changes, and here are the details:

[booc0mtaco]

Screen.Recording.2024-08-15.at.10.19.21.mov

[github-actions]

size-limit report 📦

Path	Size
components	89.2 KB (0%)
styles	27.25 KB (0%)

[codecov]

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 97.43%. Comparing base (db6203e) to head (2e7de53).
Report is 1 commits behind head on next.

Additional details and impacted files

@@           Coverage Diff           @@
##             next    #2036   +/-   ##
=======================================
  Coverage   97.43%   97.43%           
=======================================
  Files         109      109           
  Lines        2613     2613           
  Branches      664      664           
=======================================
  Hits         2546     2546           
  Misses         65       65           
  Partials        2        2           

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

[booc0mtaco]

@ahuth Fun little puzzle you might have a nice idea for.

So in this example, what I want to do is use a list to store records for the notifications that get added.

• because we want to do the transitions, I don't .pop from the list as it will get unmounted right away and not give time for the transition to run.
• Things currently work fine, but we end up with an increasingly large array. I'd like to clean up that list
• Curious about the best approach (I think one can use useEffect, some delay or maybe debounce to trim all the hidden entries?)

Maybe i talked myself into a solution, but wanted to loop you in anyway lol

[ahuth]

Ah nice, I like the debounce idea. Only cleanup when toast stuff isn't happening?

On the other hand, if it's just for stories, maybe it's fine to let the list get super large?

[booc0mtaco]

Ah nice, I like the debounce idea. Only cleanup when toast stuff isn't happening?

On the other hand, if it's just for stories, maybe it's fine to let the list get super large?

Yah, we have control over the time period for how long it takes to transition out, so could keep them in sync. I like the idea of keeping the example simple and describing it as demo-only (e.g., "in a production implementation, make sure to prune the notification list once dismissal has occurred")