Text range styling functions

[svallory]

Original issue: react-figma#18

Are there any plans to add getRange... setRange... methods like getRangeFontName, setRangeFontName etc?

How it should work?

The functions mentioned in the issue are used to modify the styling of a part of a text. The "range" refers to the part of the text the styling will be applied to. I believe it will not be a simple implementation of returning certain results as Figma docs suggests right at the beginning that there may be several edge cases.

From Figma's documentation on Working with text
When working with text nodes, there are a lot of things to consider:

• Mixed styles
• Loading fonts
• Missing fonts

To Do

Preparation

• Read the documentation for:
  • "Working with text" documentation
  • TextNode
  • TextSublayer
• make notes of cases we need to cover
  If needed, new items will be added to this list
• See if there are cases, like missing fonts, that may be shared between multiple cases, e.g., setRangeFontName(), and setRangeTextStyleId()
• Propose an implementation architecture before proceeding
  We should try to reduce rewriting boilerplate code. I have the feeling these function implementations will be very similar, but it may not be obvious how to generalize to one or two generic solutions

Implementation

NOTE: Each function needs to be added to both TextNode and TextSublayer

• setRangeFontSize()
• setRangeFontName()
• setRangeTextCase()
• setRangeTextDecoration()
• setRangeLetterSpacing()
• setRangeLineHeight()
• setRangeTextStyleId()