Skip to content

Conversation

mirovelk
Copy link

This should enable multiline truncating of non-typical text that does not contain spaces (eg URLs) and hopefully also resolve #82.

New property breakAll added (default: false).

When set to true, truncated text will behave as if css rule word-break: break-all was applied to the parent block.

Result looks like this:

image

@chason
Copy link

chason commented Mar 19, 2018

Not sure how maintained this library is anymore but this fix would be really awesome!

@dopeboy
Copy link

dopeboy commented Jun 13, 2018

In case it helps anyone, react-text-truncate supports this feature out of the box.

@moubi
Copy link
Contributor

moubi commented Aug 10, 2018

@mirovelk @chason yes, we still maintain the library, but trying to be very careful on what gets in since it will determine our resource allocation in future.

I would say that if setting word-break: break-all in your css does the job, go for it.

@@ -188,7 +191,8 @@ export default class Truncate extends Component {

const lines = [];
const text = innerText(elements.text);
const textLines = text.split('\n').map(line => line.split(' '));
const wordSeparator = breakAll ? '' : ' ';
const textLines = text.split('\n').map(line => line.split(wordSeparator));
Copy link
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Instead of having a breakAll property, we could introduce a separator property, that defaults to ' ' and use it here. What do you think?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

failed when the sentence dose not contain spaces
6 participants