react-text-clamp

React text component which allows you to ellipsis your multiline text. It uses ResizeSensor.js library by Marc J. Schmidt's and event emitter approach instead of CSS. Because of that it supports all browsers even IE.

Install

npm i react-text-clamp --save

Look

Usage

import TextClamp from 'react-text-clamp'
 
class Example extends Component {
  render () {
    return (
      <TextClamp fontSize={14} maxLines={3} rgbBgColor={'rgb(255,255,255)'}>
        Your text here
      </TextClamp>
    )
  }
}

props:

• fontSize : font size number (required)
• maxLines : determine max height of text component (required)
• rgbBgColor : background color used for gradient transition (required)
• textAlign : text align, (default justify)
• shouldntClamp : boolean used for toggle between clamped and expanded state (true for expand)

License

MIT ©