Implement font-variant-ligatures.

https://developer.mozilla.org/en/docs/Web/CSS/font-variant-ligatures
https://www.w3.org/TR/css-fonts-3/#font-variant-ligatures-prop

android/src/main/java/com/horcrux/svg/FontData.java

@@ -19,12 +19,14 @@ class FontData {
     private static final String WORD_SPACING = "wordSpacing";
     private static final String LETTER_SPACING = "letterSpacing";
     private static final String TEXT_DECORATION = "textDecoration";
+    private static final String FONT_VARIANT_LIGATURES = "fontVariantLigatures";
 
     final double fontSize;
 
     final String fontFamily;
     final FontStyle fontStyle;
     final FontWeight fontWeight;
+    final FontVariantLigatures fontVariantLigatures;
 
     final TextAnchor textAnchor;
     final TextDecoration textDecoration;
@@ -41,6 +43,7 @@ class FontData {
         fontFamily = "";
         fontStyle = FontStyle.normal;
         fontWeight = FontWeight.Normal;
+        fontVariantLigatures = FontVariantLigatures.normal;
 
         textAnchor = TextAnchor.start;
         textDecoration = TextDecoration.None;
@@ -81,6 +84,7 @@ class FontData {
         fontFamily = font.hasKey(FONT_FAMILY) ? font.getString(FONT_FAMILY) : parent.fontFamily;
         fontStyle = font.hasKey(FONT_STYLE) ? FontStyle.valueOf(font.getString(FONT_STYLE)) : parent.fontStyle;
         fontWeight = font.hasKey(FONT_WEIGHT) ? FontWeight.getEnum(font.getString(FONT_WEIGHT)) : parent.fontWeight;
+        fontVariantLigatures = font.hasKey(FONT_VARIANT_LIGATURES) ? FontVariantLigatures.valueOf(font.getString(FONT_VARIANT_LIGATURES)) : parent.fontVariantLigatures;
 
         textAnchor = font.hasKey(TEXT_ANCHOR) ? TextAnchor.valueOf(font.getString(TEXT_ANCHOR)) : parent.textAnchor;
         textDecoration = font.hasKey(TEXT_DECORATION) ? TextDecoration.getEnum(font.getString(TEXT_DECORATION)) : parent.textDecoration;

android/src/main/java/com/horcrux/svg/TSpanShadowNode.java

@@ -289,6 +289,63 @@ class TSpanShadowNode extends TextShadowNode {
         double letterSpacing = font.letterSpacing;
         final boolean autoKerning = !font.manualKerning;
 
+        /*
+        11.1.2. Fonts and glyphs
+
+        A font consists of a collection of glyphs together with other information (collectively,
+        the font tables) necessary to use those glyphs to present characters on some visual medium.
+
+        The combination of the collection of glyphs and the font tables is called the font data.
+
+        A font may supply substitution and positioning tables that can be used by a formatter
+        (text shaper) to re-order, combine and position a sequence of glyphs to form one or more
+        composite glyphs.
+
+        The combining may be as simple as a ligature, or as complex as an indic syllable which
+        combines, usually with some re-ordering, multiple consonants and vowel glyphs.
+
+        The tables may be language dependent, allowing the use of language appropriate letter forms.
+
+        When a glyph, simple or composite, represents an indivisible unit for typesetting purposes,
+        it is know as a typographic character.
+
+        Ligatures are an important feature of advance text layout. Some ligatures are discretionary
+        (TODO) while others (e.g. in Arabic) are required.
+
+        The following explicit rules apply to ligature formation:
+
+        Ligature formation should not be enabled when characters are in different DOM text nodes;
+        thus, characters separated by markup should not use ligatures.
+
+        Ligature formation should not be enabled when characters are in different text chunks.
+
+        Discretionary ligatures should not be used when the spacing between two characters is not
+        the same as the default space (e.g. when letter-spacing has a non-default value,
+        or text-align has a value of justify and text-justify has a value of distribute).
+        (See CSS Text Module Level 3, ([css-text-3]).
+
+        SVG attributes such as ‘dx’, ‘textLength’, and ‘spacing’ (in ‘textPath’) that may reposition
+        typographic characters do not break discretionary ligatures.
+
+        If discretionary ligatures are not desired
+        they can be turned off by using the font-variant-ligatures property.
+
+        /*
+            When the effective letter-spacing between two characters is not zero
+            (due to either justification or non-zero computed ‘letter-spacing’),
+            user agents should not apply optional ligatures.
+            https://www.w3.org/TR/css-text-3/#letter-spacing-property
+        */
+        final boolean allowOptionalLigatures = letterSpacing == 0 &&
+            font.fontVariantLigatures == FontVariantLigatures.normal;
+
+        /*
+            For OpenType fonts, discretionary ligatures include those enabled by
+            the liga, clig, dlig, hlig, and cala features;
+            TODO required ligatures are found in the rlig feature.
+            https://svgwg.org/svg2-draft/text.html#FontsGlyphs
+        */
+
         /*
             Name	Value	Initial value	Animatable
             textLength	<length> | <percentage> | <number>	See below	yes
@@ -480,14 +537,6 @@ class TSpanShadowNode extends TextShadowNode {
         String previous = "";
         double previousCharWidth = 0;
 
-        /*
-            When the effective letter-spacing between two characters is not zero
-            (due to either justification or non-zero computed ‘letter-spacing’),
-            user agents should not apply optional ligatures.
-            https://www.w3.org/TR/css-text-3/#letter-spacing-property
-        */
-        final boolean allowOptionalLigatures = letterSpacing == 0;
-
         for (int index = 0; index < length; index++) {
             char currentChar = chars[index];
             String current = String.valueOf(currentChar);

lib/attributes.js

@@ -30,7 +30,8 @@ function fontDiffer(a, b) {
         a.textDecoration !== b.textDecoration ||
         a.letterSpacing !== b.letterSpacing ||
         a.wordSpacing !== b.wordSpacing ||
-        a.kerning !== b.kerning
+        a.kerning !== b.kerning ||
+        a.fontVariantLigatures !== b.fontVariantLigatures
     );
 }
 

lib/extract/extractText.js

@@ -54,6 +54,7 @@ export function extractFont(props) {
         letterSpacing,
         wordSpacing,
         kerning,
+        fontVariantLigatures,
     } = props;
     let {
         fontSize,
@@ -76,6 +77,7 @@ export function extractFont(props) {
         letterSpacing,
         wordSpacing,
         kerning,
+        fontVariantLigatures,
     }, prop => !_.isNil(prop));
 
     if (typeof font === 'string') {

lib/props.js

@@ -142,6 +142,29 @@ const wordSpacing = PropTypes.string;
 // https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/kerning
 const kerning = PropTypes.string;
 
+/*
+Name:	font-variant-ligatures
+Value:	normal | none | [ <common-lig-values> || <discretionary-lig-values> || <historical-lig-values> || <contextual-alt-values> ]
+    Initial:	normal
+    Applies to:	all elements
+    Inherited:	yes
+    Percentages:	N/A
+    Media:	visual
+    Computed value:	as specified
+    Animatable:	no
+
+ Ligatures and contextual forms are ways of combining glyphs to produce more harmonized forms.
+
+ <common-lig-values>        = [ common-ligatures | no-common-ligatures ]
+ <discretionary-lig-values> = [ discretionary-ligatures | no-discretionary-ligatures ]
+ <historical-lig-values>    = [ historical-ligatures | no-historical-ligatures ]
+ <contextual-alt-values>    = [ contextual | no-contextual ]
+
+ https://developer.mozilla.org/en/docs/Web/CSS/font-variant-ligatures
+ https://www.w3.org/TR/css-fonts-3/#font-variant-ligatures-prop
+*/
+const fontVariantLigatures = PropTypes.oneOf(['normal', 'none']);
+
 const fontProps = {
     fontStyle,
     fontVariant,
@@ -154,6 +177,7 @@ const fontProps = {
     letterSpacing,
     wordSpacing,
     kerning,
+    fontVariantLigatures,
     font
 };