Skip to content

Commit

Permalink
refactor: add default font in text without variant
Browse files Browse the repository at this point in the history
  • Loading branch information
lukewalczak committed Sep 22, 2022
1 parent 39b91a1 commit 1cfd414
Show file tree
Hide file tree
Showing 9 changed files with 207 additions and 54 deletions.
8 changes: 6 additions & 2 deletions src/components/Typography/AnimatedText.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -77,14 +77,18 @@ function AnimatedText({ style, theme, variant, ...rest }: Props) {
/>
);
} else {
const font = !theme.isV3 ? theme.fonts.regular : theme.fonts.bodyMedium;
const textStyle = {
...font,
color: theme.isV3 ? theme.colors.onSurface : theme.colors.text,
};
return (
<Animated.Text
{...rest}
style={[
styles.text,
textStyle,
{
...(!theme.isV3 && theme.fonts.regular),
color: theme.isV3 ? theme.colors.onSurface : theme.colors.text,
writingDirection,
},
style,
Expand Down
3 changes: 1 addition & 2 deletions src/components/Typography/Text.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -132,12 +132,11 @@ const Text: React.ForwardRefRenderFunction<{}, Props> = (
...font,
color: theme.isV3 ? theme.colors?.onSurface : theme.colors.text,
};

return (
<NativeText
{...rest}
ref={root}
style={[textStyle, styles.text, style]}
style={[styles.text, textStyle, { writingDirection }, style]}
/>
);
}
Expand Down
20 changes: 16 additions & 4 deletions src/components/__tests__/__snapshots__/Avatar.test.js.snap
Original file line number Diff line number Diff line change
Expand Up @@ -133,11 +133,14 @@ exports[`renders avatar with text 1`] = `
numberOfLines={1}
style={
Array [
Object {
"textAlign": "left",
},
Object {
"color": "rgba(28, 27, 31, 1)",
},
Object {
"textAlign": "left",
"writingDirection": "ltr",
},
Array [
Object {
Expand Down Expand Up @@ -181,11 +184,14 @@ exports[`renders avatar with text and custom background color 1`] = `
numberOfLines={1}
style={
Array [
Object {
"textAlign": "left",
},
Object {
"color": "rgba(28, 27, 31, 1)",
},
Object {
"textAlign": "left",
"writingDirection": "ltr",
},
Array [
Object {
Expand Down Expand Up @@ -229,11 +235,14 @@ exports[`renders avatar with text and custom colors 1`] = `
numberOfLines={1}
style={
Array [
Object {
"textAlign": "left",
},
Object {
"color": "rgba(28, 27, 31, 1)",
},
Object {
"textAlign": "left",
"writingDirection": "ltr",
},
Array [
Object {
Expand Down Expand Up @@ -277,11 +286,14 @@ exports[`renders avatar with text and custom size 1`] = `
numberOfLines={1}
style={
Array [
Object {
"textAlign": "left",
},
Object {
"color": "rgba(28, 27, 31, 1)",
},
Object {
"textAlign": "left",
"writingDirection": "ltr",
},
Array [
Object {
Expand Down
30 changes: 24 additions & 6 deletions src/components/__tests__/__snapshots__/Banner.test.js.snap
Original file line number Diff line number Diff line change
Expand Up @@ -85,11 +85,14 @@ exports[`render visible banner, with custom theme 1`] = `
accessibilityRole="alert"
style={
Array [
Object {
"textAlign": "left",
},
Object {
"color": "rgba(28, 27, 31, 1)",
},
Object {
"textAlign": "left",
"writingDirection": "ltr",
},
Array [
Object {
Expand Down Expand Up @@ -360,11 +363,14 @@ exports[`renders hidden banner, without action buttons and without image 1`] = `
accessibilityRole="alert"
style={
Array [
Object {
"textAlign": "left",
},
Object {
"color": "rgba(28, 27, 31, 1)",
},
Object {
"textAlign": "left",
"writingDirection": "ltr",
},
Array [
Object {
Expand Down Expand Up @@ -483,11 +489,14 @@ exports[`renders visible banner, with action buttons and with image 1`] = `
accessibilityRole="alert"
style={
Array [
Object {
"textAlign": "left",
},
Object {
"color": "rgba(28, 27, 31, 1)",
},
Object {
"textAlign": "left",
"writingDirection": "ltr",
},
Array [
Object {
Expand Down Expand Up @@ -746,11 +755,14 @@ exports[`renders visible banner, with action buttons and without image 1`] = `
accessibilityRole="alert"
style={
Array [
Object {
"textAlign": "left",
},
Object {
"color": "rgba(28, 27, 31, 1)",
},
Object {
"textAlign": "left",
"writingDirection": "ltr",
},
Array [
Object {
Expand Down Expand Up @@ -1150,11 +1162,14 @@ exports[`renders visible banner, without action buttons and with image 1`] = `
accessibilityRole="alert"
style={
Array [
Object {
"textAlign": "left",
},
Object {
"color": "rgba(28, 27, 31, 1)",
},
Object {
"textAlign": "left",
"writingDirection": "ltr",
},
Array [
Object {
Expand Down Expand Up @@ -1272,11 +1287,14 @@ exports[`renders visible banner, without action buttons and without image 1`] =
accessibilityRole="alert"
style={
Array [
Object {
"textAlign": "left",
},
Object {
"color": "rgba(28, 27, 31, 1)",
},
Object {
"textAlign": "left",
"writingDirection": "ltr",
},
Array [
Object {
Expand Down
60 changes: 48 additions & 12 deletions src/components/__tests__/__snapshots__/DataTable.test.js.snap
Original file line number Diff line number Diff line change
Expand Up @@ -35,11 +35,14 @@ exports[`renders data table cell 1`] = `
numberOfLines={1}
style={
Array [
Object {
"textAlign": "left",
},
Object {
"color": "rgba(28, 27, 31, 1)",
},
Object {
"textAlign": "left",
"writingDirection": "ltr",
},
undefined,
]
Expand Down Expand Up @@ -99,11 +102,14 @@ exports[`renders data table header 1`] = `
numberOfLines={1}
style={
Array [
Object {
"textAlign": "left",
},
Object {
"color": "rgba(28, 27, 31, 1)",
},
Object {
"textAlign": "left",
"writingDirection": "ltr",
},
Array [
Object {
Expand Down Expand Up @@ -159,11 +165,14 @@ exports[`renders data table header 1`] = `
numberOfLines={1}
style={
Array [
Object {
"textAlign": "left",
},
Object {
"color": "rgba(28, 27, 31, 1)",
},
Object {
"textAlign": "left",
"writingDirection": "ltr",
},
Array [
Object {
Expand Down Expand Up @@ -211,11 +220,14 @@ exports[`renders data table pagination 1`] = `
numberOfLines={3}
style={
Array [
Object {
"textAlign": "left",
},
Object {
"color": "rgba(28, 27, 31, 1)",
},
Object {
"textAlign": "left",
"writingDirection": "ltr",
},
Array [
Object {
Expand Down Expand Up @@ -483,11 +495,14 @@ exports[`renders data table pagination with fast-forward buttons 1`] = `
numberOfLines={3}
style={
Array [
Object {
"textAlign": "left",
},
Object {
"color": "rgba(28, 27, 31, 1)",
},
Object {
"textAlign": "left",
"writingDirection": "ltr",
},
Array [
Object {
Expand Down Expand Up @@ -979,11 +994,14 @@ exports[`renders data table pagination with label 1`] = `
numberOfLines={3}
style={
Array [
Object {
"textAlign": "left",
},
Object {
"color": "rgba(28, 27, 31, 1)",
},
Object {
"textAlign": "left",
"writingDirection": "ltr",
},
Array [
Object {
Expand Down Expand Up @@ -1263,11 +1281,14 @@ exports[`renders data table pagination with options select 1`] = `
numberOfLines={3}
style={
Array [
Object {
"textAlign": "left",
},
Object {
"color": "rgba(28, 27, 31, 1)",
},
Object {
"textAlign": "left",
"writingDirection": "ltr",
},
Array [
Object {
Expand Down Expand Up @@ -1470,11 +1491,14 @@ exports[`renders data table pagination with options select 1`] = `
numberOfLines={3}
style={
Array [
Object {
"textAlign": "left",
},
Object {
"color": "rgba(28, 27, 31, 1)",
},
Object {
"textAlign": "left",
"writingDirection": "ltr",
},
Array [
Object {
Expand Down Expand Up @@ -2012,11 +2036,14 @@ exports[`renders data table title with press handler 1`] = `
numberOfLines={1}
style={
Array [
Object {
"textAlign": "left",
},
Object {
"color": "rgba(28, 27, 31, 1)",
},
Object {
"textAlign": "left",
"writingDirection": "ltr",
},
Array [
Object {
Expand Down Expand Up @@ -2109,11 +2136,14 @@ exports[`renders data table title with sort icon 1`] = `
numberOfLines={1}
style={
Array [
Object {
"textAlign": "left",
},
Object {
"color": "rgba(28, 27, 31, 1)",
},
Object {
"textAlign": "left",
"writingDirection": "ltr",
},
Array [
Object {
Expand Down Expand Up @@ -2176,11 +2206,14 @@ exports[`renders right aligned data table cell 1`] = `
numberOfLines={1}
style={
Array [
Object {
"textAlign": "left",
},
Object {
"color": "rgba(28, 27, 31, 1)",
},
Object {
"textAlign": "left",
"writingDirection": "ltr",
},
undefined,
]
Expand Down Expand Up @@ -2226,11 +2259,14 @@ exports[`renders right aligned data table title 1`] = `
numberOfLines={1}
style={
Array [
Object {
"textAlign": "left",
},
Object {
"color": "rgba(28, 27, 31, 1)",
},
Object {
"textAlign": "left",
"writingDirection": "ltr",
},
Array [
Object {
Expand Down
Loading

0 comments on commit 1cfd414

Please sign in to comment.