@ntragas/pouncejstest
Version:
A collection of UI components from Panther labs
58 lines (57 loc) • 1.74 kB
JavaScript
import _extends from "@babel/runtime/helpers/extends";
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
import React from 'react';
import { useTransition, animated } from 'react-spring';
import Box from '../../Box';
var AnimatedBox = animated(Box);
var Menu = /*#__PURE__*/React.forwardRef(function Menu(_ref, ref) {
var children = _ref.children,
isOpen = _ref.isOpen,
maxHeight = _ref.maxHeight,
rest = _objectWithoutPropertiesLoose(_ref, ["children", "isOpen", "maxHeight"]);
var transitions = useTransition(isOpen, null, {
from: {
transform: 'scale(0.9,0.9)',
opacity: 0
},
enter: {
transform: 'scale(1, 1)',
opacity: 1
},
leave: {
transform: 'scale(0.9, 0.9)',
opacity: 0
},
config: {
duration: 150
}
});
return /*#__PURE__*/React.createElement(React.Fragment, null, transitions.map(function (_ref2) {
var item = _ref2.item,
key = _ref2.key,
styles = _ref2.props;
return item ? /*#__PURE__*/React.createElement(AnimatedBox, _extends({
ref: ref,
key: key,
style: styles,
mt: "-3px",
border: "1px solid",
borderLeftColor: "blue-400",
borderRightColor: "blue-400",
borderBottomColor: "blue-400",
borderTopColor: "navyblue-400",
borderBottomLeftRadius: "medium",
borderBottomRightRadius: "medium",
backgroundColor: "navyblue-300",
zIndex: 10,
position: "absolute",
width: 1,
maxHeight: maxHeight,
overflow: "auto"
}, rest), children) : /*#__PURE__*/React.createElement(Box, _extends({
key: key,
ref: ref
}, rest));
}));
});
export default Menu;