How to use @vx/bounds - 3 common examples
To help you get started, we’ve selected a few @vx/bounds examples, based on popular ways it is used in public projects.
Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
hshoff / vx / packages / vx-tooltip / src / tooltips / TooltipWithBounds.jsx View on Github 
top = Math.round(top);
return (
{children}
);
}
TooltipWithBounds.propTypes = propTypes;
TooltipWithBounds.defaultProps = defaultProps;
export default withBoundingRects(TooltipWithBounds);if (rect && parentRect) {
left = detectOverflowX && rect.right > parentRect.right ? left - rect.width : left;
top = detectOverflowY && rect.bottom > parentRect.bottom ? top - rect.height : top;
}
return (
<div width="" style="{{">
{children}
</div>
);
}
Tooltip.propTypes = propTypes;
Tooltip.defaultProps = defaultProps;
export default withBoundingRects(Tooltip);}
}
}
VXTooltip.propTypes = {
...withBoundingRectsProps,
backgroundColor: PropTypes.string,
label: PropTypes.string.isRequired,
left: PropTypes.number.isRequired,
pointDirection: PropTypes.oneOf(['down', 'left', 'right', 'up']),
pointPosition: PropTypes.oneOf(['start', 'center', 'end']),
theme: PropTypes.object,
top: PropTypes.number.isRequired
}
export default withTheme(withBoundingRects(VXTooltip))
export { VXTooltip }@vx/bounds
Utilities to make your life with bounding boxes better
