https://github.com/trendmicro-frontend/react-popover

React Popover component
https://github.com/trendmicro-frontend/react-popover

popovers react

Last synced: 27 days ago
JSON representation

React Popover component

• Host: GitHub
• URL: https://github.com/trendmicro-frontend/react-popover
• Owner: trendmicro-frontend
• License: mit
• Created: 2017-09-14T03:53:23.000Z (about 7 years ago)
• Default Branch: master
• Last Pushed: 2023-09-22T14:05:25.000Z (about 1 year ago)
• Last Synced: 2024-11-06T10:04:50.237Z (about 1 month ago)
• Topics: popovers, react
• Language: JavaScript
• Homepage: https://trendmicro-frontend.github.io/react-popover
• Size: 1.79 MB
• Stars: 2
• Watchers: 18
• Forks: 0
• Open Issues: 3
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

• awesome - react-popover - React Popover component ([demo](https://trendmicro-frontend.github.io/react-popover/)). (Trend Micro / React Components)
• awesome_frontend_development_resources - react-popover - React Popover component ([demo](https://trendmicro-frontend.github.io/react-popover/)). (Trend Micro / React Components)
• awesome_frontend_development_resources - react-popover - React Popover component ([demo](https://trendmicro-frontend.github.io/react-popover/)). (Trend Micro / React Components)

README

        

# react-popover [![build status](https://travis-ci.org/trendmicro-frontend/react-popover.svg?branch=master)](https://travis-ci.org/trendmicro-frontend/react-popover) [![Coverage Status](https://coveralls.io/repos/github/trendmicro-frontend/react-popover/badge.svg?branch=master)](https://coveralls.io/github/trendmicro-frontend/react-popover?branch=master)

[![NPM](https://nodei.co/npm/@trendmicro/react-popover.png?downloads=true&stars=true)](https://nodei.co/npm/@trendmicro/react-popover/)

React Popover

Demo: https://trendmicro-frontend.github.io/react-popover

## Installation

1. Install the latest version of [react](https://github.com/facebook/react) and [react-popover](https://github.com/trendmicro-frontend/react-popover):

  ```

  npm install --save react @trendmicro/react-popover

  ```

2. At this point you can import `@trendmicro/react-popover` and its styles in your application as follows:

  ```js

  import Popover from '@trendmicro/react-popover';

  // Be sure to include styles at some point, probably during your bootstraping

  import '@trendmicro/react-popover/dist/react-popover.css';

  ```

## Usage

```js

// Basic

    

        Popover Top

    

// With Header

    Title

    

        Popover Top

    

// With footer

    

        Popover Top

    

    Footer

// Set prefer place

    

        Popover Top-left

    

// Set target

    

        Popover Top

    

```

## API

### Properties

    

        

            Name

            Type

            Default

            Description

        

    

    

        

            show

            Boolean

            false

            Specify whether to show the popover.

        

        

            placement

            String

            'top'

            

                One of

                


                    
'top'

                    
'top-left'

                    
'top-right'

                    
'right'

                    
'right-top'

                    
'right-bottom'

                    
'bottom'

                    
'bottom-left'

                    
'bottom-right'

                    
'left'

                    
'left-top'

                    
'left-bottom'

                

            

        

        

            target

            Object

            null

            Target element to aligned

        

  


## License

MIT