motion icon indicating copy to clipboard operation
motion copied to clipboard

[FEATURE] Ability to pass attributes/props to exiting element in `AnimatePresence`

Open benface opened this issue 1 year ago • 0 comments

Is your feature request related to a problem? Please describe. The documentation for AnimatePresence actually touches on the problem I'm having: "When a component is removed, there's no longer a chance to update its props". But the solution (the custom prop) doesn't apply to my use case. I want the exiting element to have the inert HTML attribute so it is not clickable nor focusable while it disappears.

Describe the solution you'd like I don't know what is technically possible, but react-transition-group has a childFactory prop that allows me to achieve exactly what I want:

<TransitionGroup
  childFactory={(child) => {
    // Make the exiting element inert (not clickable or focusable)
    if (!child.props.in) {
      return cloneElement(child, { inert: '' })
    }
    return child
  }}
>

Describe alternatives you've considered Using react-transition-group, but I would very much prefer to use Motion. 😬

Thank you!

benface avatar Feb 12 '24 22:02 benface