Skip to content

Commit 23b963b

Browse files
satya164satya164
committed
fix: rename right to numeric for tables
1 parent 3a8ca88 commit 23b963b

File tree

6 files changed

+64
-64
lines changed

6 files changed

+64
-64
lines changed

‎example/src/DataTableExample.js‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -103,17 +103,17 @@ class DataTableExample extends React.Component<Props, State> {
103103
>
104104
Dessert
105105
</DataTable.Title>
106-
<DataTable.Title right>Calories</DataTable.Title>
107-
<DataTable.Title right>Fat (g)</DataTable.Title>
106+
<DataTable.Title numeric>Calories</DataTable.Title>
107+
<DataTable.Title numeric>Fat (g)</DataTable.Title>
108108
</DataTable.Header>
109109

110110
{items.slice(from, to).map(item => (
111111
<DataTable.Row key={item.key}>
112112
<DataTable.Cell style={styles.first}>
113113
{item.name}
114114
</DataTable.Cell>
115-
<DataTable.Cell right>{item.calories}</DataTable.Cell>
116-
<DataTable.Cell right>{item.fat}</DataTable.Cell>
115+
<DataTable.Cell numeric>{item.calories}</DataTable.Cell>
116+
<DataTable.Cell numeric>{item.fat}</DataTable.Cell>
117117
</DataTable.Row>
118118
))}
119119

‎src/components/DataTable/DataTable.js‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -37,20 +37,20 @@ type Props = React.ElementConfig<typeof View> & {
3737
* <DataTable>
3838
* <DataTable.Header>
3939
* <DataTable.Title>Dessert</DataTable.Title>
40-
* <DataTable.Title right>Calories</DataTable.Title>
41-
* <DataTable.Title right>Fat</DataTable.Title>
40+
* <DataTable.Title numeric>Calories</DataTable.Title>
41+
* <DataTable.Title numeric>Fat</DataTable.Title>
4242
* </DataTable.Header>
4343
*
4444
* <DataTable.Row>
4545
* <DataTable.Cell>Frozen yogurt</DataTable.Cell>
46-
* <DataTable.Cell right>159</DataTable.Cell>
47-
* <DataTable.Cell right>6.0</DataTable.Cell>
46+
* <DataTable.Cell numeric>159</DataTable.Cell>
47+
* <DataTable.Cell numeric>6.0</DataTable.Cell>
4848
* </DataTable.Row>
4949
*
5050
* <DataTable.Row>
5151
* <DataTable.Cell>Ice cream sandwich</DataTable.Cell>
52-
* <DataTable.Cell right>237</DataTable.Cell>
53-
* <DataTable.Cell right>8.0</DataTable.Cell>
52+
* <DataTable.Cell numeric>237</DataTable.Cell>
53+
* <DataTable.Cell numeric>8.0</DataTable.Cell>
5454
* </DataTable.Row>
5555
*
5656
* <DataTable.Pagination

‎src/components/DataTable/DataTableCell.js‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -12,9 +12,9 @@ type Props = $RemoveChildren<typeof TouchableRipple> & {|
1212
*/
1313
children: React.Node,
1414
/**
15-
* Align the text to the right.
15+
* Align the text to the right. Generally monetary or number fields are aligned to right.
1616
*/
17-
right?: boolean,
17+
numeric?: boolean,
1818
/**
1919
* Function to execute on press.
2020
*/
@@ -26,12 +26,12 @@ class DataTableCell extends React.Component<Props> {
2626
static displayName = 'DataTable.Cell';
2727

2828
render() {
29-
const { children, style, right, ...rest } = this.props;
29+
const { children, style, numeric, ...rest } = this.props;
3030

3131
return (
3232
<TouchableRipple
3333
{...rest}
34-
style={[styles.container, right && styles.right, style]}
34+
style={[styles.container, numeric && styles.right, style]}
3535
>
3636
<Text numberOfLines={1}>{children}</Text>
3737
</TouchableRipple>

‎src/components/DataTable/DataTableTitle.js‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -19,9 +19,9 @@ type Props = React.ElementConfig<typeof TouchableWithoutFeedback> & {|
1919
*/
2020
children: React.Node,
2121
/**
22-
* Align the text to the right.
22+
* Align the text to the right. Generally monetary or number fields are aligned to right.
2323
*/
24-
right?: boolean,
24+
numeric?: boolean,
2525
/**
2626
* Direction of sorting. An arrow indicating the direction is displayed when this is given.
2727
*/
@@ -64,7 +64,7 @@ class DataTableTitle extends React.Component<Props, State> {
6464

6565
render() {
6666
const {
67-
right,
67+
numeric,
6868
children,
6969
onPress,
7070
sortDirection,
@@ -91,7 +91,7 @@ class DataTableTitle extends React.Component<Props, State> {
9191

9292
return (
9393
<TouchableWithoutFeedback onPress={onPress} {...rest}>
94-
<View style={[styles.container, right && styles.right, style]}>
94+
<View style={[styles.container, numeric && styles.right, style]}>
9595
{icon}
9696

9797
<Text

‎src/components/__tests__/DataTable.test.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@ it('renders data table title with sort icon', () => {
2929

3030
it('renders right aligned data table title', () => {
3131
const tree = renderer
32-
.create(<DataTable.Title right>Calories</DataTable.Title>)
32+
.create(<DataTable.Title numeric>Calories</DataTable.Title>)
3333
.toJSON();
3434

3535
expect(tree).toMatchSnapshot();
@@ -57,7 +57,7 @@ it('renders data table cell', () => {
5757

5858
it('renders right aligned data table cell', () => {
5959
const tree = renderer
60-
.create(<DataTable.Cell right>356</DataTable.Cell>)
60+
.create(<DataTable.Cell numeric>356</DataTable.Cell>)
6161
.toJSON();
6262

6363
expect(tree).toMatchSnapshot();

‎typings/components/DataTable.d.ts‎

Lines changed: 44 additions & 44 deletions
Original file line numberDiff line numberDiff line change
@@ -1,44 +1,44 @@
1-
import * as React from 'react';
2-
import { StyleProp, ViewStyle, ViewProps } from 'react-native';
3-
import { IconSource, ThemeShape } from '../types';
4-
import { TouchableRippleProps } from './TouchableRipple';
5-
6-
export interface DataTableHeaderProps extends ViewProps {
7-
children: React.ReactNode;
8-
theme?: ThemeShape;
9-
}
10-
11-
export interface DataTableTitleProps extends TouchableRippleProps {
12-
right?: boolean;
13-
sortDirection?: 'ascending' | 'descending';
14-
theme?: ThemeShape;
15-
}
16-
17-
export interface DataTableRowProps extends TouchableRippleProps {
18-
theme?: ThemeShape;
19-
}
20-
21-
export interface DataTableCellProps extends TouchableRippleProps {
22-
right?: boolean;
23-
style?: StyleProp<ViewStyle>;
24-
}
25-
26-
export interface DataTablePaginationProps {
27-
page:number;
28-
numberOfPages:number;
29-
label?: React.ReactNode;
30-
onPageChange: (value: number) => any;
31-
theme?: ThemeShape;
32-
}
33-
34-
export interface DataTableProps extends ViewProps {
35-
children: React.ReactNode;
36-
}
37-
38-
export declare class DataTable extends React.Component<DataTableProps> {
39-
static Header: React.ComponentClass<DataTableHeaderProps>;
40-
static Title: React.ComponentClass<DataTableTitleProps>;
41-
static Row: React.ComponentClass<DataTableRowProps>;
42-
static Cell: React.ComponentClass<DataTableCellProps>;
43-
static Pagination: React.ComponentClass<DataTablePaginationProps>;
44-
}
1+
import * as React from 'react';
2+
import { StyleProp, ViewStyle, ViewProps } from 'react-native';
3+
import { IconSource, ThemeShape } from '../types';
4+
import { TouchableRippleProps } from './TouchableRipple';
5+
6+
export interface DataTableHeaderProps extends ViewProps {
7+
children: React.ReactNode;
8+
theme?: ThemeShape;
9+
}
10+
11+
export interface DataTableTitleProps extends TouchableRippleProps {
12+
numeric?: boolean;
13+
sortDirection?: 'ascending' | 'descending';
14+
theme?: ThemeShape;
15+
}
16+
17+
export interface DataTableRowProps extends TouchableRippleProps {
18+
theme?: ThemeShape;
19+
}
20+
21+
export interface DataTableCellProps extends TouchableRippleProps {
22+
numeric?: boolean;
23+
style?: StyleProp<ViewStyle>;
24+
}
25+
26+
export interface DataTablePaginationProps {
27+
page:number;
28+
numberOfPages:number;
29+
label?: React.ReactNode;
30+
onPageChange: (value: number) => any;
31+
theme?: ThemeShape;
32+
}
33+
34+
export interface DataTableProps extends ViewProps {
35+
children: React.ReactNode;
36+
}
37+
38+
export declare class DataTable extends React.Component<DataTableProps> {
39+
static Header: React.ComponentClass<DataTableHeaderProps>;
40+
static Title: React.ComponentClass<DataTableTitleProps>;
41+
static Row: React.ComponentClass<DataTableRowProps>;
42+
static Cell: React.ComponentClass<DataTableCellProps>;
43+
static Pagination: React.ComponentClass<DataTablePaginationProps>;
44+
}

0 commit comments

Comments
 (0)