@activecollab/components
Version:
ActiveCollab Components
49 lines • 1.45 kB
JavaScript
import _extends from "@babel/runtime/helpers/esm/extends";
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
const _excluded = ["in", "children", "style", "timeout"];
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 _ref$in = _ref.in,
inProp = _ref$in === void 0 ? false : _ref$in,
children = _ref.children,
style = _ref.style,
_ref$timeout = _ref.timeout,
timeout = _ref$timeout === void 0 ? 200 : _ref$timeout,
rest = _objectWithoutPropertiesLoose(_ref, _excluded);
return /*#__PURE__*/React.createElement(Transition, _extends({
appear: true,
in: inProp,
timeout: timeout
}, rest), state => {
return /*#__PURE__*/cloneElement(children, {
style: _extends({}, defaultStyle(inProp ? timeout : 0), transitionStyles[state], style, children.props.style)
});
});
};
Reveal.displayName = "Reveal";
//# sourceMappingURL=Reveal.js.map