woocommerce/plugins/woocommerce-admin/packages/components/src/animation-slider
Sam Seay edc8a1bdc5 Publish storybook docs, remove react docgen based docs (https://github.com/woocommerce/woocommerce-admin/pull/7055) 2021-06-02 15:54:00 +12:00
..
stories Publish storybook docs, remove react docgen based docs (https://github.com/woocommerce/woocommerce-admin/pull/7055) 2021-06-02 15:54:00 +12:00
test Align WooCommerce javascript code standards/linting/styles with WordPress core. (https://github.com/woocommerce/woocommerce-admin/pull/3674) 2020-02-14 15:23:21 +13:00
README.md Fetch component usage documentation from local README.md. 2019-09-06 11:52:18 -07:00
index.js Align WooCommerce javascript code standards/linting/styles with WordPress core. (https://github.com/woocommerce/woocommerce-admin/pull/3674) 2020-02-14 15:23:21 +13:00
style.scss Align WooCommerce javascript code standards/linting/styles with WordPress core. (https://github.com/woocommerce/woocommerce-admin/pull/3674) 2020-02-14 15:23:21 +13:00

README.md

AnimationSlider

This component creates slideable content controlled by an animate prop to direct the contents to slide left or right. All other props are passed to CSSTransition. More info at http://reactcommunity.org/react-transition-group/css-transition

Usage

<AnimationSlider animationKey="1" animate="right">
	{ ( status ) => (
		<span>One (1)</span>
	) }
</AnimationSlider>

Props

Name Type Default Description
children function null (required) A function returning rendered content with argument status, reflecting CSSTransition status
animationKey any null (required) A unique identifier for each slideable page
animate string null null, 'left', 'right', to designate which direction to slide on a change
onExited function null A function to be executed after a transition is complete, passing the containing ref as the argument