Clamp the string when there are no spaces

[JoaoRPF]

This issue is mentioned here: https://github.com/xiaody/react-lines-ellipsis/issues/39

This is a solution specific to when the component is using letters based mode.

[JoaoRPF]

@xiaody please review and reach to me if there is any doubt 😄

[xiaody]

Thanks @JoaoRPF I have just commented the issue. I think it's unnecessary for this component to clamp the width. If you still have trouble with the latest version, feel free to comment more.

[JoaoRPF]

I tried your solution (in #39), by adding a overflow-wrap: "break-word" to the style but it did not solve my problem (as shown in the attached image).

[JoaoRPF]

I solved it by adding

overflow-wrap: "break-word",
word-break: "break-word",
word-wrap: "break-word"

I think different browsers use different properties. I'm still having the problem of getting to the next line (if only one word, i want to do the ellipsis in the first line, not in the second). But at least, is doing the ellipsis in the second 😃

Check here for more details: https://css-tricks.com/snippets/css/prevent-long-urls-from-breaking-out-of-container/