floating-ui/react-popper

🍿⚛Official React library to use Popper, the positioning library

JavaScript

2,484

250 commits

updated May 8, 2024

See the code

README

React Popper

Unit Tests npm version npm downloads Dependency Status code style: prettier Get support or discuss

React wrapper around Popper.


⚠️ This library is in maintenance mode!

This library wraps @popperjs/core, not @floating-ui/dom.

To use the new Floating UI package with React, instead visit https://floating-ui.com/docs/react-dom.


Install

Via package managers:

# With npm
npm i react-popper @popperjs/core

# With Yarn
yarn add react-popper @popperjs/core

Note: @popperjs/core must be installed in your project in order for react-popper to work.

Via script tag (UMD library exposed as ReactPopper):

<script src="https://unpkg.com/react-popper/dist/index.umd.js"></script>

Documentation

The full documentation can be found on the official Popper website:

http://popper.js.org/react-popper

Running Locally

clone repo

git clone git@github.com:popperjs/react-popper.git

move into folder

cd ~/react-popper

install dependencies

npm install or yarn

run dev mode

npm run demo:dev or yarn demo:dev

open your browser and visit:

http://localhost:1234/

placement
popover
popper
react
tooltip
tooltips

floating-ui/react-popper

🍿⚛Official React library to use Popper, the positioning library

JavaScript

2,484

250 commits

updated May 8, 2024

See the code

README

React Popper

Unit Tests npm version npm downloads Dependency Status code style: prettier Get support or discuss

React wrapper around Popper.


⚠️ This library is in maintenance mode!

This library wraps @popperjs/core, not @floating-ui/dom.

To use the new Floating UI package with React, instead visit https://floating-ui.com/docs/react-dom.


Install

Via package managers:

# With npm
npm i react-popper @popperjs/core

# With Yarn
yarn add react-popper @popperjs/core

Note: @popperjs/core must be installed in your project in order for react-popper to work.

Via script tag (UMD library exposed as ReactPopper):

<script src="https://unpkg.com/react-popper/dist/index.umd.js"></script>

Documentation

The full documentation can be found on the official Popper website:

http://popper.js.org/react-popper

Running Locally

clone repo

git clone git@github.com:popperjs/react-popper.git

move into folder

cd ~/react-popper

install dependencies

npm install or yarn

run dev mode

npm run demo:dev or yarn demo:dev

open your browser and visit:

http://localhost:1234/

placement
popover
popper
react
tooltip
tooltips

Significant stargazers

Evan Purkhiser

366 followers · starred Dec 2018

Kyle Tsang

91 followers · starred Dec 2020

Brandon Romano

123 followers · starred Apr 2020

Jasper De Moor

444 followers · starred Jun 2019