@jobber/components-native 0.71.2 → 0.72.0

package/dist/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@jobber/components-native",
-    "version": "0.71.2",
+    "version": "0.72.0",
     "license": "MIT",
     "description": "React Native implementation of Atlantis",
     "repository": {
@@ -82,5 +82,5 @@
         "react-native-safe-area-context": "^4.5.2",
         "react-native-svg": ">=12.0.0"
     },
-    "gitHead": "88ff540bdd1af6f58af44e60d20fe00921084adb"
+    "gitHead": "26cb076b2f8a8cbdaee1df6be72b211987a4e5eb"
 }

package/dist/src/Text/Text.js

@@ -16,9 +16,9 @@ export const TEXT_MAX_SCALED_FONT_SIZES = {
     text: MAX_TEXT_FONT_SIZE_SCALE,
     textSupporting: tokens["typography--fontSize-base"],
 };
-export function Text({ level = "text", variation = "base", emphasis, allowFontScaling = true, adjustsFontSizeToFit = false, maxLines = "unlimited", align, children, reverseTheme = false, strikeThrough = false, italic = false, hideFromScreenReader = false, maxFontScaleSize, selectable, }) {
+export function Text({ level = "text", variation = "base", emphasis, allowFontScaling = true, adjustsFontSizeToFit = false, maxLines = "unlimited", align, children, reverseTheme = false, strikeThrough = false, italic = false, hideFromScreenReader = false, maxFontScaleSize, underline, selectable, }) {
     const accessibilityRole = "text";
-    return (React.createElement(Typography, Object.assign({ color: variation, fontFamily: "base", fontStyle: italic ? "italic" : "regular", fontWeight: getFontWeight({ level, emphasis }), maxFontScaleSize: maxFontScaleSize || TEXT_MAX_SCALED_FONT_SIZES[level], selectable: selectable }, Object.assign(Object.assign({}, levelStyles[level]), { allowFontScaling,
+    return (React.createElement(Typography, Object.assign({ color: variation, fontFamily: "base", fontStyle: italic ? "italic" : "regular", fontWeight: getFontWeight({ level, emphasis }), maxFontScaleSize: maxFontScaleSize || TEXT_MAX_SCALED_FONT_SIZES[level], selectable: selectable, underline: underline }, Object.assign(Object.assign({}, levelStyles[level]), { allowFontScaling,
         align,
         adjustsFontSizeToFit,
         accessibilityRole,

package/dist/src/Typography/Typography.js

@@ -15,7 +15,8 @@ const maxNumberOfLines = {
     unlimited: undefined,
 };
 export const Typography = React.memo(InternalTypography);
-function InternalTypography({ fontFamily, fontStyle, fontWeight, transform, color, align, size = "default", children, maxLines = "unlimited", allowFontScaling = true, maxFontScaleSize, adjustsFontSizeToFit = false, lineHeight, letterSpacing, reverseTheme = false, hideFromScreenReader = false, accessibilityRole = "text", strikeThrough = false, selectable = true, }) {
+// eslint-disable-next-line max-statements
+function InternalTypography({ fontFamily, fontStyle, fontWeight, transform, color, align, size = "default", children, maxLines = "unlimited", allowFontScaling = true, maxFontScaleSize, adjustsFontSizeToFit = false, lineHeight, letterSpacing, reverseTheme = false, hideFromScreenReader = false, accessibilityRole = "text", strikeThrough = false, underline, selectable = true, }) {
     const sizeAndHeight = getSizeAndHeightStyle(size, lineHeight);
     const style = [
         getFontStyle(fontFamily, fontStyle, fontWeight),
@@ -30,6 +31,10 @@ function InternalTypography({ fontFamily, fontStyle, fontWeight, transform, colo
     if (fontStyle === "italic") {
         style.push(styles.italic);
     }
+    if (underline) {
+        const underlineTextStyle = { textDecorationStyle: underline };
+        style.push(underlineTextStyle, styles.underline);
+    }
     const numberOfLinesForNativeText = maxNumberOfLines[maxLines];
     const text = getTransformedText(children, transform);
     const accessibilityProps = hideFromScreenReader

package/dist/src/Typography/Typography.style.js

@@ -65,6 +65,9 @@ const fonts = Platform.select({
  */
 export const typographyTokens = Object.assign(Object.assign({}, fonts), { italic: {
         fontStyle: "italic",
+    }, underline: {
+        textDecorationColor: tokens["color-text--secondary"],
+        textDecorationLine: "underline",
     }, startAlign: {
         textAlign: "left",
     }, endAlign: {