Add: useTransition hook

[endigo9740]

Reference

https://floating-ui.com/docs/useTransition

Description

Provides the ability to apply CSS transitions to a floating element, including correct handling of “placement-aware” transitions.

Style Props

• duration
• initial
• close
• open
• common
• Scale transforms

Status

• Asymmetric transitions
• Placement-aware transitions

Status Props

• duration

[Hugos68]

I'm curious what the reason is to create this hook instead of leveraging Svelte's built in transition directive? Is it because of placement-aware transitions?

[endigo9740]

@Hugos68 I think there's two main benefits:

1. It enables custom CSS class-based animations. Svelte transitions are cool, but they are a bit more complicated to setup and use.
2. As you mention, they would not have access to placement-aware transitions. So if the popover flips position, this won't affect the Svelte transition which will likely animate the same (ex: slide down where it's supposed to slide up, etc)