1.0.7 • Published 5 years ago

react-positioner v1.0.7

Weekly downloads
242
License
MIT
Repository
github
Last release
5 years ago

react-positioner

A small utility component that positions a container relative to a root.

Example Usage:

import Positioner from "react-positioner";

function Tooltip({ position, content, children, ...rest }) {
    return (
        <Positione {...rest}
            content={
                <span className={`tooltip tooltip--${position}`}>
                    {content}
                </span>
            }
            isShown={visible}
            position={position}>
            {children}
        </Positioner>
    )
}

Props

PropTypeRequiredDefault ValueDescription
position"top" | "left" | "right" | "top-left" | "top-right" | "bottom" | "bottom-left" | "bottom-right"YesThe position of the container relative to the target element
targetOffsetnumberNoThe distance from the target element in pixels.
bodyOffsetnumberNoDistance from the edge of the screen.
isShownbooleanYesTell the positioner if the element is shown or not. Great when you want to use with a tooltip or some other, popup container.
childrenReact.NodeYesThe target element of the positioned container
contentReact.NodeYesThe content inside the positioned container
1.0.7

5 years ago

1.0.6

5 years ago

1.0.5

5 years ago

1.0.4

5 years ago

1.0.3

5 years ago

1.0.2

5 years ago

1.0.0

5 years ago