1.6.0 • Published 3 years ago
motion-box v1.6.0
motion-box
A super simple abstraction of Chakra UI's Box
component, enhanced with Framer Motion props from the motion
API.
Install
This packages requires Chakra UI and its peer dependencies. If you haven't installed Chakra UI in your project, find the necessary pacakges here.
Using npm:
npm install motion-box
Using yarn:
yarn add motion-box
Usage
import MotionBox from 'motion-box';
function Example() {
return (
<MotionBox
height="40px"
bg="red.300"
drag="x"
dragConstraints={{ left: -100, right: 100 }}
whileHover={{ scale: 1.1 }}
whileTap={{ scale: 0.9 }}
/>
);
}
Demo
See a working demo using motion-box
here