Documentation - Floating UI Popper solves all of these key problems in an elegant, performant manner It is a lightweight ~3 kB library that aims to provide a reliable and extensible positioning engine you can use to ensure all your popper elements are positioned in the right place
React Popper - Floating UI react-popper is the official React wrapper to let you use Popper in your React projects It exposes an API very similar to the one of the Vanilla JavaScript library, but it provides some useful addition to better integrate with React
Frequently Asked Questions (FAQ) - Floating UI My popper is bigger than the viewport, what do I do? Here are some options: Prevent the popper's width from ever exceeding the browser's width with max-width: 100vw; CSS (along with box-sizing: border-box) Set preventOverflow's rootBoundary option to document if it must be larger than the viewport
Popper. js (v1. x) - Floating UI This page covers the API reference and documentation of Popper 1 (popper js on npm) This page is here to help consumers who haven't migrated yet to the most recent version, for the latest version documentation click here
Tutorial - Floating UI In this tutorial you'll learn how to use Popper by building a basic tooltip Remember, Popper is not a tooltip library, it's the foundation to build one! Follow the tutorial below to learn how to use Popper
Constructors - Floating UI It allows you to create individual popper instances (objects) with state and methods Imports esm import { createPopper } from '@popperjs core' ; cjs const { createPopper } = require ( '@popperjs core' ) ; umd const { createPopper } = Popper ;
Flip | Popper - Floating UI The flip modifier can change the placement of a popper when it's scheduled to overflow a given boundary