@activecollab/components/dist/esm/components/Transitions/Reveal/Reveal.js

ActiveCollab Components

import _extends from "@babel/runtime/helpers/esm/extends";
import React, { cloneElement } from "react";
import { Transition } from "react-transition-group";
const defaultStyle = duration => ({
  transition: "all " + duration + "ms ease-in",
  transform: "scaleX(0)",
  opacity: 0,
  transformOrigin: "left"
});
const transitionStyles = {
  entering: {
    transform: "scaleX(1)",
    opacity: 1
  },
  entered: {
    transform: "scaleX(1)",
    opacity: 1
  },
  exiting: {
    transform: "scaleX(0)",
    opacity: 0
  },
  exited: {
    transform: "scaleX(0)",
    opacity: 0
  }
};
export const Reveal = _ref => {
  let {
    in: inProp = false,
    children,
    style,
    timeout = 200,
    ...rest
  } = _ref;
  return /*#__PURE__*/React.createElement(Transition, _extends({
    appear: true,
    in: inProp,
    timeout: timeout
  }, rest), state => {
    return /*#__PURE__*/cloneElement(children, {
      style: {
        ...defaultStyle(inProp ? timeout : 0),
        ...transitionStyles[state],
        ...style,
        ...children.props.style
      }
    });
  });
};
Reveal.displayName = "Reveal";
//# sourceMappingURL=Reveal.js.map