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

ActiveCollab Components

import _extends from "@babel/runtime/helpers/esm/extends";
import React, { cloneElement, useMemo } from "react";
import { Transition } from "react-transition-group";
export const ResizeTransition = _ref => {
  let {
    in: inProp = false,
    onEnter,
    onExited,
    children,
    style,
    timeout = 200
  } = _ref;
  const defaultStyle = useMemo(() => {
    return {
      transitionProperty: "width, height",
      transitionDuration: timeout + "ms",
      transitionTimingFunction: "ease"
    };
  }, [timeout]);
  return /*#__PURE__*/React.createElement(Transition, {
    appear: true,
    in: inProp,
    timeout: timeout,
    onEnter: onEnter,
    onExited: onExited
  }, state => {
    return /*#__PURE__*/cloneElement(children, {
      style: _extends({
        visibility: state === "exited" && !inProp ? "hidden" : undefined
      }, defaultStyle, style, children.props.style)
    });
  });
};
ResizeTransition.displayName = "ResizeTransition";
//# sourceMappingURL=ResizeTransition.js.map