Improve quo2 text component

[Parveshdhull]

1. letter-spacing

Letter spacing currently used by the component doesn't match with letter spacing for Figma design.
And looks like small changes in letter spacing are not affecting the text component.
Formula used by Figma for letter spacing: formula (ref)
Heading-1/Regular

2. Line Height:

The line height currently used by the component doesn't match with line height from the Figma design
Paragraph-2/Regular

[Original image]

[yqrashawn]

2. Line Height:

H @Parveshdhull I compared Paragraph-2/Regular and can't find line height difference.

[Parveshdhull]

hi @yqrashawn,
Thank you very much for looking into this.
Please can you try with 5-10 lines? Small line heights difference might not be visible, but they add up to a big difference with multiple lines.

[yqrashawn]

There's indeed mismatch. I'll check.

Line 1

Line 10

[cammellos]

Closing for now due to inactivity

[Parveshdhull]

reopening issue (#16981 (review))

[Parveshdhull]

related PR #13960, and related discussion #13960 (comment)

[yqrashawn]

add more info here
we use inter font, and it has this thing called Dynamic Metrics http://rsms.me/inter/dynmetrics/
it's a formula that calculates letter spacing based on font size

merged PR #13960 fixed the formula in our code

yet, quo2 text component is different from figma design

A is figma design
B is screen shot from http://rsms.me/inter/dynmetrics/
C is quo2 text component screenshot on ios, not tested on android

you can see B and C are identical, which means quo2 text implementation is the same as the Inter font recommended dynamic metrics implementation
the calculated letter spacing value always looks like 0.31585560420509633% and figma round it to 0.32%, which might be the reason A is not the same as B/C

[yqrashawn]

this might help https://www.figma.com/community/plugin/795733302011238428/Inter-Letter-Spacing
Inter Letter Spacing figma plugin