Skip to content

Provides `Truncate`, `MiddleTruncate` and `ShowMore` React components for truncating multi-line spans and adding an ellipsis.

License

Notifications You must be signed in to change notification settings

artashes-sanoyan/react-truncate

 
 

Repository files navigation

@re-dev/react-truncate

@re-dev/react-truncate

GitHub stars



English | 简体中文

Provides Truncate, MiddleTruncate and ShowMore React components for truncating multi-line spans and adding an ellipsis.

Installation

With npm(or yarn, or pnpm):

npm install @re-dev/react-truncate

Documentation

A basic component for cropping text. Usually there is no need to use it directly. <ShowMore /> and <MiddleTruncate /> provided by this package are both extended based on this component.

A "Show More" component, when the content exceeds the set number of display lines, an expand button will appear to view more content.

A "middle ellipsis" component, when the content exceeds the limit of the parent's width, an ellipsis symbol will appear (similar to CSS's text-overflow: ellipsis effect), but its omission position can be specified in the middle of the text instead of the end.

Release Notes

Please refer to CHANGELOG for details.

License

MIT License © 2023-PRESENT chengpeiquan

About

Provides `Truncate`, `MiddleTruncate` and `ShowMore` React components for truncating multi-line spans and adding an ellipsis.

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Languages

  • TypeScript 53.3%
  • JavaScript 46.2%
  • Shell 0.5%