8000 GitHub - apprennet/tooltip: React Tooltip
[go: up one dir, main page]
More Web Proxy on the site http://driver.im/
Skip to content
This repository was archived by the owner on Jul 13, 2024. It is now read-only.

apprennet/tooltip

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

67 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

rc-tooltip


tooltip ui component for react 0.14+

NPM version build status Test coverage gemnasium deps node version npm download Sauce Test Status

Sauce Test Status

Screenshots

Feature

  • support ie8,ie8+,chrome,firefox,safari

install

rc-tooltip

Usage

var Tooltip = require('rc-tooltip');
var React = require('react');
var ReactDOM = require('react-dom')
ReactDOM.render(<Tooltip placement="left" trigger={['click']} overlay={<span>tooltip</span>}><a href='#'>hover</a></Tooltip>, container);

Example

http://localhost:8007/examples/index.md

online example: http://react-component.github.io/tooltip/examples/

API

props

name type default description
overlayClassName string additional className added to popup overlay
trigger string[] ['hover'] which actions cause tooltip shown. enum of 'hover','click','focus'
mouseEnterDelay number 0 delay time to show when mouse enter.unit: s.
mouseLeaveDelay number 0.1 delay time to hide when mouse leave.unit: s.
overlayStyle Object additional style of overlay node
wrapStyle Object additional style of wrap node
prefixCls String rc-tooltip prefix class name
transitionName String same as https://github.com/react-component/css-transition-group
onVisibleChange Function call when visible is changed
visible boolean whether tooltip is visible
defaultVisible boolean whether tooltip is visible initially
placement String|Object one of ['left','right','top','bottom', 'topLeft', 'topRight', 'bottomLeft', 'bottomRight'] or alignConfig of [dom-align](https://github.com/yiminghe/dom-align)
align Object: alignConfig of [dom-align](https://github.com/yiminghe/dom-align) only valid when placement's type is String. value will be merged into placement's align config. note: can only accept offset and targetOffset
overlay React.Element popup content
getTooltipContainer function function returning html node which will act as tooltip contaier

Development

npm install
npm start

Test Case

http://localhost:8007/tests/runner.html?coverage

Coverage

http://localhost:8007/node_modules/rc-server/node_modules/node-jscover/lib/front-end/jscoverage.html?w=http://localhost:8007/tests/runner.html?coverage

License

rc-tooltip is released under the MIT license.

About

React Tooltip

Resources

Stars

Watchers

Forks

Packages

No packages published

Languages

  • JavaScript 96.9%
  • CSS 3.1%
0