How to use the @react-md/transition.useRelativePositioningStyle function in @react-md/transition
To help you get started, we’ve selected a few @react-md/transition 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.
mlaursen / react-md / packages / examples / src / SheetDemo.tsx View on Github 
let verticalPosition: VerticalPosition | undefined;
switch (position) {
case "left":
horizontalPosition = "inner left";
break;
case "right":
horizontalPosition = "inner right";
break;
case "top":
verticalPosition = "above";
break;
case "bottom":
verticalPosition = "below";
break;
}
const styleProps = useRelativePositioningStyle({
fixedTo: ref.current,
horizontalPosition,
verticalPosition,
});
const show = (position: SheetPosition, first: boolean = true) => (
event:
| React.KeyboardEvent
| React.MouseEvent
) => {
ref.current = event.currentTarget;
setPosition(position);
setVisible(true);
setFocusfirst(first);
};@react-md/transition
A package for working with react-md to use some simple transitions.
