[PickerInput, TextArea]: incorrect count of characters when using emoji
- Dominant language
- TypeScript
- Stars
- 247
- Forks
- 78
- Avg merge
- 14h 27m
- Merged PRs (30d)
- 15
Description
## Description
Since emoji encode multiple characters, `string.length` won't match the amount of visible symbols, which leads to hitting count limits or triggering data loading prematurely. **I only mentioned two components, but it is necessary to check others too if they have character-counting functionality**.
## Steps to Reproduce
1. Open ["With length limit" example](https://uui.epam.com/documents?id=textArea&mode=doc&category=components#textArea-MaxLengthCounter) for `TextArea` component in the documentation
2. Type in any emoji (for example, 😊)
3. Check the count of characters under the component
For `PickerInput`, check that data loading is triggered when `minCharsToSearch` is set to 2+.
## Actual result
😊 counts as 2 characters/symbols.
## Expected result
😊 counts as 1 character/symbol.
## Additional information
There are two popular ways to fix this:
* Destructuring into an array using spread syntax:
```ts
console.log([..."😊"].length); // 1
```
* Using [`Intl.Segmenter`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/Segmenter):
```ts
const segmenter = new Intl.Segmenter();
const segmentedString = segmenter.segment("😊");
const segments = Array.from(segmentedString);
console.log(segments.length); // 1
```
Contributor guide
Assessment
This issue has not been assessed yet.