rmc-trigger
TypeScript icon, indicating that this package has built-in type declarations

1.0.12 • Public • Published

rmc-trigger


React Trigger Component

NPM version build status Test coverage gemnasium deps npm download

Development

npm install
npm start

Example

http://localhost:8200/examples/

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

Feature

  • supported on IE 8+, Chrome, Firefox, and Safari

install

rmc-trigger

Usage

Include the default styling and then:

import React from 'react';
import ReactDOM from 'react-dom';
import Trigger from 'rmc-trigger';
 
ReactDOM.render((
  <Trigger
    popup={<span>popup</span>}
    popupAlign={{
      points: ['tl', 'bl'],
      offset: [0, 3]
    }}
  >
    <a href='#'>hover</a>
  </Trigger>
), container);

API

props

name type default description
popupClassName string additional className added to popup
destroyPopupOnHide boolean false whether destroy popup when hide
getPopupClassNameFromAlign getPopupClassNameFromAlign(align: Object):String additional className added to popup according to align
popupStyle Object additional style of popup
prefixCls String rmc-trigger-popup prefix class name
popupTransitionName String https://github.com/react-component/animate
maskTransitionName String https://github.com/react-component/animate
onPopupVisibleChange Function call when popup visible is changed
mask boolean false whether to support mask
maskClosable boolean true whether to support click mask to hide
popupVisible boolean whether popup is visible
zIndex number popup's zIndex
defaultPopupVisible boolean whether popup is visible initially
popupAlign Object: alignConfig of [dom-align](https://github.com/yiminghe/dom-align) popup 's align config
onPopupAlign function(popupDomNode, align) callback when popup node is aligned
popup React.Element | function() => React.Element popup content
getPopupContainer getPopupContainer(): HTMLElement function returning html node which will act as popup container
getDocument getDocument(): HTMLElement function returning document node which will be attached click event to close trigger
popupPlacement string use preset popup align config from builtinPlacements, can be merged by popupAlign prop
builtinPlacements object builtin placement align map. used by placement prop

Test Case

npm test
npm run chrome-test

Coverage

npm run coverage

open coverage/ dir

License

rmc-trigger is released under the MIT license.

Package Sidebar

Install

npm i rmc-trigger

Weekly Downloads

15,756

Version

1.0.12

License

MIT

Unpacked Size

634 kB

Total Files

40

Last publish

Collaborators

  • silentcloud
  • warmhug
  • zhang740