@atlaskit/motion/dist/esm/entering/slide-in.js

A set of utilities to apply motion in your application.

import React from 'react';
import KeyframesMotion from './keyframes-motion';
/**
 * __SlideIn__
 *
 * Will slide an element into position, generally used for things that appear from outside of the viewport into view.
 *
 * See [examples](https://atlaskit.atlassian.com/packages/design-system/motion/docs/entering-motions).
 */
var SlideIn = function SlideIn(_ref) {
  var children = _ref.children,
    enterFrom = _ref.enterFrom,
    exitTo = _ref.exitTo,
    _ref$fade = _ref.fade,
    fade = _ref$fade === void 0 ? 'none' : _ref$fade,
    _ref$duration = _ref.duration,
    duration = _ref$duration === void 0 ? 'medium' : _ref$duration,
    isPaused = _ref.isPaused,
    onFinish = _ref.onFinish,
    _ref$animationTimingF = _ref.animationTimingFunction,
    animationTimingFunction = _ref$animationTimingF === void 0 ? 'ease-out' : _ref$animationTimingF,
    _ref$animationTimingF2 = _ref.animationTimingFunctionExiting,
    animationTimingFunctionExiting = _ref$animationTimingF2 === void 0 ? 'ease-in' : _ref$animationTimingF2;
  return /*#__PURE__*/React.createElement(KeyframesMotion, {
    duration: duration,
    enteringAnimation: "slide-in-from-".concat(enterFrom),
    exitingAnimation: "slide-out-from-".concat(exitTo || enterFrom),
    animationTimingFunction: animationTimingFunction,
    animationTimingFunctionExiting: animationTimingFunctionExiting,
    isPaused: isPaused,
    onFinish: onFinish
  }, children);
};
export default SlideIn;