Text component with max number of shown lines, similar to


The List Collection component has an option to control the maximum number of visible lines, and if the text exceeds what can be shown, it will cut the text off and write "...".

Is there a way to do this for the Text component (the one that is not an input), and basically anywhere is where text is shown?

At the momemt I am stuck to using the List Collection instead of the Custom Collection, which is much nicer in terms of customization options, because my data is containing multiple rows.

Hi @Matthias,

Retool pre-load lodash, so you could use the _.truncate() functions to achieve this. Not quite as simple as an option on the table/data, and it isn't exactly the same as "number of lines", you'd have to use number of characters. You could change the value of the cell/text component to something like {{ _.truncate( item, { length: 50 }) }} which would replace anything after 50 chars with .... You can read the documentation here.

Hi @MikeCB.

Thank you for the respons.

It is a really good solution you are proposing. It doesn't handle number of visible lines specifically, but at least I can somewhat handle the size of the text fields.

I tried it out quickly after you had answered, and it seems to work as expected.