How to use the @react-spring/web.useTransition function in @react-spring/web
To help you get started, we’ve selected a few @react-spring/web examples, based on popular ways it is used in public projects.
Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
tim-soft / react-spring-lightbox / src / components / PageContainer / index.js View on Github 
const PageContainer = ({
children,
isOpen,
className,
style,
pageTransitionConfig
}) => {
const defaultTransition = {
from: { transform: 'scale(0.75)', opacity: 0 },
enter: { transform: 'scale(1)', opacity: 1 },
leave: { transform: 'scale(0.75)', opacity: 0 },
config: { ...config.default, mass: 1, tension: 320, friction: 32 }
};
const transitions = useTransition(
isOpen,
null,
merge(defaultTransition, pageTransitionConfig)
);
return transitions.map(
({ item, key, props }) =>
item && (const ArrowButton = ({ position, onClick, disabled }) => {
const transitions = useTransition(!disabled, null, {
from: { opacity: 0 },
enter: { opacity: 1 },
leave: { opacity: 0 }
});
return transitions.map(
({ item, key, props }) =>
item && (
<button type="button"></button>
