npm

Check out our latest tech talk, "JavaScript Supply Chain Security" presented by VP of Security, Adam Baldwin.Watch it here »

react-text-collapse

0.5.2 • Public • Published

React text collapse

NPM Version Coverage Status Build Status Downloads Dependency Status License

React text collapse

Philosophy

Keep things simple! You don't need jQuery...

Installation

Join the chat at https://gitter.im/cht8687/react-text-collapse

npm

$ npm install --save react-text-collapse

Demo

Demo

Example code

Code Example

Usage

<ReactTextCollapse options={TEXT_COLLAPSE_OPTIONS}>
  <p>
    React text collapse is awesome. React text collapse is awesome.<br />
    React text collapse is awesome. React text collapse is awesome.<br />
    React text collapse is awesome. React text collapse is awesome.<br />
    React text collapse is awesome. React text collapse is awesome.<br />
  </p>
</ReactTextCollapse>

Options

options: PropTypes.object.isRequired

const TEXT_COLLAPSE_OPTIONS = {
  collapse: false, // default state when component rendered
  collapseText: '... show more', // text to show when collapsed
  expandText: 'show less', // text to show when expanded
  minHeight: 100, // component height when closed
  maxHeight: 250 // expanded to
  textStyle: { // pass the css for the collapseText and expandText here
    color: "blue",
    fontSize: "20px"
  }
}

Development

$ git clone git@github.com:cht8687/react-text-collapse.git
$ cd react-text-collapse
$ npm install
$ webpack-dev-server

Then

open http://localhost:8080/webpack-dev-server/

License

MIT

js-standard-style

install

npm i react-text-collapse

Downloadsweekly downloads

523

version

0.5.2

license

MIT

homepage

github.com

repository

Gitgithub

last publish

collaborators

  • avatar
Report a vulnerability