diff --git a/src/components/DataTable/DataTableTitle.tsx b/src/components/DataTable/DataTableTitle.tsx index 7c0dee2598..54ae387123 100644 --- a/src/components/DataTable/DataTableTitle.tsx +++ b/src/components/DataTable/DataTableTitle.tsx @@ -128,6 +128,16 @@ const DataTableTitle = ({ 1 + ? numeric + ? I18nManager.isRTL + ? styles.leftText + : styles.rightText + : styles.centerText + : {}, sortDirection ? styles.sorted : { color: textColor }, textStyle, ]} @@ -150,12 +160,23 @@ const styles = StyleSheet.create({ paddingVertical: 12, }, + rightText: { + textAlign: 'right', + }, + + leftText: { + textAlign: 'left', + }, + + centerText: { + textAlign: 'center', + }, + right: { justifyContent: 'flex-end', }, cell: { - height: 24, lineHeight: 24, fontSize: 12, fontWeight: '500', diff --git a/src/components/__tests__/__snapshots__/DataTable.test.js.snap b/src/components/__tests__/__snapshots__/DataTable.test.js.snap index 9029cc84fe..4e77fe0c73 100644 --- a/src/components/__tests__/__snapshots__/DataTable.test.js.snap +++ b/src/components/__tests__/__snapshots__/DataTable.test.js.snap @@ -104,9 +104,12 @@ exports[`renders data table header 1`] = ` "alignItems": "center", "fontSize": 12, "fontWeight": "500", - "height": 24, "lineHeight": 24, }, + Object { + "maxHeight": 24, + }, + Object {}, Object { "color": "rgba(0, 0, 0, 0.6)", }, @@ -158,9 +161,12 @@ exports[`renders data table header 1`] = ` "alignItems": "center", "fontSize": 12, "fontWeight": "500", - "height": 24, "lineHeight": 24, }, + Object { + "maxHeight": 24, + }, + Object {}, Object { "color": "rgba(0, 0, 0, 0.6)", }, @@ -1472,9 +1478,12 @@ exports[`renders data table title with press handler 1`] = ` "alignItems": "center", "fontSize": 12, "fontWeight": "500", - "height": 24, "lineHeight": 24, }, + Object { + "maxHeight": 24, + }, + Object {}, Object { "marginLeft": 8, }, @@ -1562,9 +1571,12 @@ exports[`renders data table title with sort icon 1`] = ` "alignItems": "center", "fontSize": 12, "fontWeight": "500", - "height": 24, "lineHeight": 24, }, + Object { + "maxHeight": 24, + }, + Object {}, Object { "marginLeft": 8, }, @@ -1670,9 +1682,12 @@ exports[`renders right aligned data table title 1`] = ` "alignItems": "center", "fontSize": 12, "fontWeight": "500", - "height": 24, "lineHeight": 24, }, + Object { + "maxHeight": 24, + }, + Object {}, Object { "color": "rgba(0, 0, 0, 0.6)", },