https://github.com/emiliano-bucci/react-spring-dialog
A simple, accessible and performant Dialog component powered by react-spring
https://github.com/emiliano-bucci/react-spring-dialog
dialog modal react react-modal react-spring react-spring-dialog react-spring-modal
Last synced: 8 months ago
JSON representation
A simple, accessible and performant Dialog component powered by react-spring
- Host: GitHub
- URL: https://github.com/emiliano-bucci/react-spring-dialog
- Owner: Emiliano-Bucci
- Created: 2021-04-24T09:18:03.000Z (about 5 years ago)
- Default Branch: master
- Last Pushed: 2022-04-16T14:29:56.000Z (about 4 years ago)
- Last Synced: 2025-04-30T16:44:17.713Z (about 1 year ago)
- Topics: dialog, modal, react, react-modal, react-spring, react-spring-dialog, react-spring-modal
- Language: TypeScript
- Homepage: https://react-spring-dialog.emilianobucci.com/
- Size: 4.95 MB
- Stars: 3
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: readme.md
Awesome Lists containing this project
README
# React Spring Dialog
> A simple, accessible and performant Dialog component powered by `react-spring`.
## Features
- Excelent performances thanks to `react-spring`.
- **Accessibility** ready thanks to the use of `focus-trap-react` among other things.
- Easy to style and to configure: no more headaches or hacky things trying to make the Dialog looks like we want.
## Install
```bash
npm install --save react-spring-dialog
```
or
```bash
yarn add react-spring-dialog
```
## How to use it
```tsx
import { Dialog } from 'react-spring-dialog'
export function Component() {
const [isActive, setIsActive] = useState(true)
return (
setIsActive(false)}>
Dialog content
setIsActive(false)}>CLOSE
)
}
```
## Official documentation
[Visit here](https://react-spring-dialog.emilianobucci.com)