UNPKG

3.44 kBSource Map (JSON)View Raw
1{"version":3,"sources":["DataTableCell.tsx"],"names":["React","StyleSheet","Text","TouchableRipple","DataTableCell","children","textStyle","style","numeric","rest","styles","container","right","displayName","create","flex","flexDirection","alignItems","justifyContent"],"mappings":";;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAASC,UAAT,QAA4D,cAA5D;AACA,OAAOC,IAAP,MAAiB,oBAAjB;AACA,OAAOC,eAAP,MAA4B,oCAA5B;;AAuBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA,MAAMC,aAAa,GAAG;AAAA,MAAC;AACrBC,IAAAA,QADqB;AAErBC,IAAAA,SAFqB;AAGrBC,IAAAA,KAHqB;AAIrBC,IAAAA,OAJqB;AAKrB,OAAGC;AALkB,GAAD;AAAA,sBAOpB,oBAAC,eAAD,eACMA,IADN;AAEE,IAAA,KAAK,EAAE,CAACC,MAAM,CAACC,SAAR,EAAmBH,OAAO,IAAIE,MAAM,CAACE,KAArC,EAA4CL,KAA5C;AAFT,mBAIE,oBAAC,IAAD;AAAM,IAAA,KAAK,EAAED,SAAb;AAAwB,IAAA,aAAa,EAAE;AAAvC,KACGD,QADH,CAJF,CAPoB;AAAA,CAAtB;;AAiBAD,aAAa,CAACS,WAAd,GAA4B,gBAA5B;AAEA,MAAMH,MAAM,GAAGT,UAAU,CAACa,MAAX,CAAkB;AAC/BH,EAAAA,SAAS,EAAE;AACTI,IAAAA,IAAI,EAAE,CADG;AAETC,IAAAA,aAAa,EAAE,KAFN;AAGTC,IAAAA,UAAU,EAAE;AAHH,GADoB;AAO/BL,EAAAA,KAAK,EAAE;AACLM,IAAAA,cAAc,EAAE;AADX;AAPwB,CAAlB,CAAf;AAYA,eAAed,aAAf","sourcesContent":["import * as React from 'react';\nimport { StyleSheet, StyleProp, ViewStyle, TextStyle } from 'react-native';\nimport Text from '../Typography/Text';\nimport TouchableRipple from '../TouchableRipple/TouchableRipple';\nimport type { $RemoveChildren } from '../../types';\n\ntype Props = $RemoveChildren<typeof TouchableRipple> & {\n /**\n * Content of the `DataTableCell`.\n */\n children: React.ReactNode;\n /**\n * Align the text to the right. Generally monetary or number fields are aligned to right.\n */\n numeric?: boolean;\n /**\n * Function to execute on press.\n */\n onPress?: () => void;\n style?: StyleProp<ViewStyle>;\n /**\n * Text content style of the `DataTableCell`.\n */\n textStyle?: StyleProp<TextStyle>;\n};\n\n/**\n * A component to show a single cell inside of a table.\n *\n * <div class=\"screenshots\">\n * <figure>\n * <img class=\"medium\" src=\"screenshots/data-table-row-cell.png\" />\n * </figure>\n * </div>\n *\n *\n * ## Usage\n * ```js\n * import * as React from 'react';\n * import { DataTable } from 'react-native-paper';\n *\n * const MyComponent = () => (\n * <DataTable.Row>\n * <DataTable.Cell numeric>1</DataTable.Cell>\n * <DataTable.Cell numeric>2</DataTable.Cell>\n * <DataTable.Cell numeric>3</DataTable.Cell>\n * <DataTable.Cell numeric>4</DataTable.Cell>\n * </DataTable.Row>\n * );\n *\n * export default MyComponent;\n * ```\n *\n * If you want to support multiline text, please use View instead, as multiline text doesn't comply with\n * MD Guidelines (https://github.com/callstack/react-native-paper/issues/2381).\n */\n\nconst DataTableCell = ({\n children,\n textStyle,\n style,\n numeric,\n ...rest\n}: Props) => (\n <TouchableRipple\n {...rest}\n style={[styles.container, numeric && styles.right, style]}\n >\n <Text style={textStyle} numberOfLines={1}>\n {children}\n </Text>\n </TouchableRipple>\n);\n\nDataTableCell.displayName = 'DataTable.Cell';\n\nconst styles = StyleSheet.create({\n container: {\n flex: 1,\n flexDirection: 'row',\n alignItems: 'center',\n },\n\n right: {\n justifyContent: 'flex-end',\n },\n});\n\nexport default DataTableCell;\n"]}
\No newline at end of file