Lines prop takes up more space than it needs in Text component

[Mikey Stengel]

First of all, I'd like to thank you for all the hard work on smooth-ui. It's one of my favorite component libraries!

🐛 Bug Report

<Text lines={10}>
  Short text fitting in one line
</Text>

Is taking up 10 lines of space. Most of which are rendered as white space.

To Reproduce

Go to the docs and increment the value of the lines prop. You'll see white space being added.

In the example from the docs, two lines look great.

When incrementing the value, more whitespace is added.

Expected behavior

I expected the line prop to only take up as much space as the text needs or cut it off.

Env

"@smooth-ui/core-sc": "^11.1.5",

## System:
 - OS: Windows 10 10.0.17763
 - CPU: (12) x64 Intel(R) Core(TM) i7-8700 CPU @ 3.20GHz
 - Memory: 18.50 GB / 31.92 GB
## Binaries:
 - Node: 12.9.1 - C:\Program Files\nodejs\node.EXE
 - Yarn: 1.22.0 - C:\Program Files\nodejs\yarn.CMD
 - npm: 6.10.2 - C:\Program Files\nodejs\npm.CMD

[Greg Bergé]

This is the expected behaviour. If you specify a number of lines it measure the number of lines. It is not possible to implement what you are asking for without JavaScript. You should probably use a library to crop text and add ....

[Mikey Stengel]

<Text> is a React component so adding some more JS shouldn't be a problem. Would you accept a PR for this or would you rather have me implement this in user land?

[Greg Bergé]

@CodingDive yeah if it is perf I am open for a PR to fix it!