Description

• Add types to Animate component.
• Simplify Animate component API.

useAnimate accepts an options object which is a string type + some options based on the type.
Animate component accepted type property (the same) an options object (the other options) and a children render function property.

The options prop doesn't correspond to useAnimate options (it doesn't include the type) and there seems to be no benefit to wrapping the options in an object. Animate can pass its props (excluding children) to useAnimate.

// Before
<Animate type="appear" options={ { origin: "top" } }>{ () => <div /> }</Animate>
// After
<Animate type="appear" origin="top">{ () => <div /> }</Animate>

Options are still accepted although deprecated and scheduled for removal in 9.6.

Supersedes #26176

I've replaced the usage in Gutenberg that I found (just one case).
I've also updated the Animate storybook. It now uses knobs to adjust the options on the fly.

How has this been tested?

Types pass.
Storybook examples work as expected.

Screenshots

When using options prop, you'll see this deprecation warning (it says 9.4 but I've changed it to 9.6):

Types of changes

New feature: Add types to the Animate component.

This change deprecates the Animate options prop and schedules it to be removed in two releases: 9.6. It will be a breaking change when this is removed.

Checklist:

• My code is tested.
• My code follows the WordPress code style.
• My code follows the accessibility standards.
• My code has proper inline documentation.
• I've included developer documentation if appropriate.
• I've updated all React Native files affected by any refactorings/renamings in this PR.