Skip to content

zhiyuc123/react-truncate-inside

Repository files navigation

React Truncate Inside

React component for adding an ellipsis to the middle of a line of text.

Inspired by pablosichert / react-truncate

CPT2308101505-376x87

Online Demo


Install

npm install react-truncate-inside

Usage

import React from 'react';
import Truncate from 'react-truncate-inside';

export default function Demo() {
    return <Truncate text="An-Extremely-Long-Filename.pdf" width="100" />
}

Props

Name Type Desc Default
text string
width number Width of the element parentNode.width
offset number Position(from the end) of the ellipsis that shows in text 8
ellipsis string Ellipsis that is added into the text in case it is truncated '...'

License

MIT License