@snack-uikit/truncate-string NPM | npm.io

0.6.19 • Published 15 days ago

Install

Weekly downloads

-

License

Apache-2.0

Repository

Last release

15 days ago

Truncate String

Installation

npm i @snack-uikit/truncate-string

Example

<TruncateString
  variant='end'
  placement='top'
  hideTooltip={true}
  text={'Текст'}
  maxLines={2}
/>

TruncateString

Props

name	type	default value	description
text*	`string`	-	Текст, который будет обрезаться
variant	"middle" \| "end"	end	Вариант обрезания строки: - `End` - с конца - `Middle` - по середине
className	`string`	-	CSS-класс
hideTooltip	`boolean`	-	Скрывать ли тултип с полным текстом
maxLines	`number`	-	Максимальное кол-во строк, до которого может сворачиваться текст.
placement	enum Placement: `"left"`, `"left-start"`, `"left-end"`, `"right"`, `"right-start"`, `"right-end"`, `"top"`, `"top-start"`, `"top-end"`, `"bottom"`, `"bottom-start"`, `"bottom-end"`	-	Положение тултипа относительно обрезанного текста.

Troubleshooting

Если компонент работает некорректно, проверь:

<TruncateString /> должен лежать в органиченном по ширине контейнере, иначе он не сможет правильно высчитывать обрезание.
если с ограничением по ширине тоже возникают проблемы, можно попробовать задать на компоненте-обёртке св-во display: grid

@snack-uikit/tooltip @snack-uikit/utils classnames lodash.throttle

@everything-registry/sub-chunk-847 @snack-uikit/fields @snack-uikit/link @snack-uikit/list @snack-uikit/modal @snack-uikit/notification @snack-uikit/segmented-control @snack-uikit/stepper @snack-uikit/table @snack-uikit/tree @snack-uikit/toaster @snack-uikit/card @snack-uikit/chips @snack-uikit/drawer @snack-uikit/droplist @snack-uikit/accordion @snack-uikit/alert @snack-uikit/attachment

0.6.2-preview-7eeb1bc1.0

7 months ago

0.6.10-preview-e840ab81.0

4 months ago

0.6.10-preview-d479ae3f.0

4 months ago

0.6.18-preview-790689b4.0

3 months ago

0.6.20-preview-9998cc23.0

18 days ago

0.6.19-preview-8cf89a18.0

2 months ago

0.6.2-preview-baf754b1.0

7 months ago

0.6.2-preview-379c4ff3.0

7 months ago

0.6.20-preview-e4e8fc7b.0

15 days ago

0.6.10-preview-f7ec3fa7.0

4 months ago

0.6.20-preview-050dc1ef.0

23 days ago

0.6.19-preview-cf198ddd.0

1 month ago

0.6.2-preview-20b0f520.0

7 months ago

0.6.10-preview-922d2ce6.0

4 months ago

0.6.2-preview-53bd8747.0

7 months ago

0.6.9-preview-d9538faf.0

5 months ago

0.6.10-preview-abb5f7dc.0

4 months ago

0.6.3-preview-95f36d41.0

6 months ago

5 months ago

5 months ago

5 months ago

5 months ago

0.6.15-preview-6a400eba.0

3 months ago

0.6.14-preview-27ae78ba.0

4 months ago

0.6.2-preview-4d81b82b.0

7 months ago

0.6.14-preview-04b740ca.0

3 months ago

4 months ago

4 months ago

0.6.11-preview-3566ac3d.0

4 months ago

4 months ago

0.6.14-preview-9cd1b89a.0

4 months ago

3 months ago

3 months ago

1 month ago

4 months ago

4 months ago

3 months ago

3 months ago

0.6.19-preview-ef227a87.0

2 months ago

0.6.14-preview-a0074739.0

4 months ago

0.6.19-preview-845a4e8b.0

1 month ago

0.6.13-preview-bc9ca5dd.0

4 months ago

0.6.20-preview-69fcfa33.0

18 days ago

0.6.5-preview-38cf19d9.0

5 months ago

0.6.2-preview-042f5ed6.0

7 months ago

0.6.14-preview-0d45398a.0

4 months ago

0.6.19-preview-2f8a726b.0

1 month ago

0.6.10-preview-b5e187d5.0

4 months ago

0.6.7-preview-913f1101.0

5 months ago

0.6.20-preview-2df7e7b5.0

29 days ago

0.6.5-preview-bb2cdfb8.0

5 months ago

0.6.10-preview-f228eb9d.0

4 months ago

0.6.10-preview-a2a64ca4.0

4 months ago

6 months ago

7 months ago

5 months ago

6 months ago

0.6.10-preview-74c13173.0

4 months ago

7 months ago

0.6.20-preview-aba585d4.0

21 days ago

0.4.25-preview-ba12ca94.0

8 months ago

8 months ago

0.4.25-preview-71543426.0

8 months ago

8 months ago

0.4.25-preview-e5174ad1.0

8 months ago

0.4.25-preview-efee0b7d.0

8 months ago

0.4.25-preview-3f66d646.0

8 months ago

0.4.25-preview-d96c83e8.0

8 months ago

0.4.25-preview-fc25f08d.0

8 months ago

0.4.25-preview-7adaddbe.0

8 months ago

0.4.25-preview-1f246c4a.0

8 months ago

0.4.25-preview-c9b51578.0

8 months ago

9 months ago

0.4.23-preview-e9b53c27.0

9 months ago

9 months ago

0.4.21-preview-963c3343.0

10 months ago

0.4.16-preview-0df2fefa.0

1 year ago

0.4.16-preview-c6cf83f0.0

1 year ago

0.4.18-preview-a66ce7a9.0

1 year ago

0.4.18-preview-1a5a24ad.0

1 year ago

0.4.21-preview-8898cdde.0

11 months ago

11 months ago

10 months ago

9 months ago

0.4.19-preview-d4831186.0

12 months ago

12 months ago

0.4.15-preview-d74371e8.0

1 year ago

0.4.22-preview-94780dcd.0

9 months ago

1 year ago

1 year ago

1 year ago

1 year ago

0.4.15-preview-a5a79952.0

1 year ago

0.4.18-preview-767c086a.0

1 year ago

0.4.20-preview-b09d21bf.0

11 months ago

1 year ago

0.4.14-preview-8bb3334c.0

1 year ago

1 year ago

0.4.13-preview-cb79db34.0

1 year ago

0.4.13-preview-7a18c2ee.0

1 year ago

0.4.13-preview-08779a44.0

1 year ago

0.4.13-preview-5b75040d.0

1 year ago

0.4.13-preview-80576138.0

1 year ago

0.4.13-preview-69abc1d3.0

1 year ago

0.4.13-preview-82ef7975.0

1 year ago

0.4.13-preview-2855fb42.0

1 year ago

0.4.13-preview-0a44b2fc.0

1 year ago

1 year ago

0.4.12-preview-ed4b1f94.0

1 year ago

1 year ago

0.4.11-preview-1fcf96b1.0

1 year ago

1 year ago

1 year ago

0.4.9-preview-2484f987.0

1 year ago

0.4.9-preview-778a0ef6.0

1 year ago

0.4.9-preview-84a92753.0

1 year ago

0.4.9-preview-3cdd8d31.0

1 year ago

1 year ago

0.4.8-preview-993a9cfb.0

1 year ago

1 year ago

0.4.6-preview-3f90b7f1.0

1 year ago

1 year ago

1 year ago

1 year ago

0.4.3-preview-00fa1de0.0

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

0.2.17-preview-85c5f47b.0

2 years ago

0.2.17-preview-104ad22c.0

2 years ago