| 1 | {"version":3,"sources":["DataTableTitle.tsx"],"names":["React","Animated","StyleSheet","TouchableWithoutFeedback","View","I18nManager","color","MaterialCommunityIcon","Text","withTheme","DataTableTitle","numeric","children","onPress","sortDirection","theme","textStyle","style","numberOfLines","rest","current","spinAnim","useRef","Value","useEffect","timing","toValue","duration","useNativeDriver","start","textColor","colors","text","alpha","rgb","string","spin","interpolate","inputRange","outputRange","icon","styles","transform","rotate","isRTL","container","right","cell","maxHeight","leftText","rightText","centerText","sorted","displayName","create","flex","flexDirection","alignContent","paddingVertical","textAlign","justifyContent","lineHeight","fontSize","fontWeight","alignItems","marginLeft","height"],"mappings":";;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SACEC,QADF,EAGEC,UAHF,EAIEC,wBAJF,EAKEC,IALF,EAOEC,WAPF,QASO,cATP;AAUA,OAAOC,KAAP,MAAkB,OAAlB;AACA,OAAOC,qBAAP,MAAkC,0BAAlC;AACA,OAAOC,IAAP,MAAiB,oBAAjB;AACA,SAASC,SAAT,QAA0B,oBAA1B;;AAkCA;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;AACA;AACA;AAEA,MAAMC,cAAc,GAAG,QAUV;AAAA,MAVW;AACtBC,IAAAA,OADsB;AAEtBC,IAAAA,QAFsB;AAGtBC,IAAAA,OAHsB;AAItBC,IAAAA,aAJsB;AAKtBC,IAAAA,KALsB;AAMtBC,IAAAA,SANsB;AAOtBC,IAAAA,KAPsB;AAQtBC,IAAAA,aAAa,GAAG,CARM;AAStB,OAAGC;AATmB,GAUX;AACX,QAAM;AAAEC,IAAAA,OAAO,EAAEC;AAAX,MAAwBrB,KAAK,CAACsB,MAAN,CAC5B,IAAIrB,QAAQ,CAACsB,KAAb,CAAmBT,aAAa,KAAK,WAAlB,GAAgC,CAAhC,GAAoC,CAAvD,CAD4B,CAA9B;AAIAd,EAAAA,KAAK,CAACwB,SAAN,CAAgB,MAAM;AACpBvB,IAAAA,QAAQ,CAACwB,MAAT,CAAgBJ,QAAhB,EAA0B;AACxBK,MAAAA,OAAO,EAAEZ,aAAa,KAAK,WAAlB,GAAgC,CAAhC,GAAoC,CADrB;AAExBa,MAAAA,QAAQ,EAAE,GAFc;AAGxBC,MAAAA,eAAe,EAAE;AAHO,KAA1B,EAIGC,KAJH;AAKD,GAND,EAMG,CAACf,aAAD,EAAgBO,QAAhB,CANH;AAQA,QAAMS,SAAS,GAAGxB,KAAK,CAACS,KAAK,CAACgB,MAAN,CAAaC,IAAd,CAAL,CAAyBC,KAAzB,CAA+B,GAA/B,EAAoCC,GAApC,GAA0CC,MAA1C,EAAlB;AAEA,QAAMC,IAAI,GAAGf,QAAQ,CAACgB,WAAT,CAAqB;AAChCC,IAAAA,UAAU,EAAE,CAAC,CAAD,EAAI,CAAJ,CADoB;AAEhCC,IAAAA,WAAW,EAAE,CAAC,MAAD,EAAS,QAAT;AAFmB,GAArB,CAAb;AAKA,QAAMC,IAAI,GAAG1B,aAAa,gBACxB,oBAAC,QAAD,CAAU,IAAV;AAAe,IAAA,KAAK,EAAE,CAAC2B,MAAM,CAACD,IAAR,EAAc;AAAEE,MAAAA,SAAS,EAAE,CAAC;AAAEC,QAAAA,MAAM,EAAEP;AAAV,OAAD;AAAb,KAAd;AAAtB,kBACE,oBAAC,qBAAD;AACE,IAAA,IAAI,EAAC,UADP;AAEE,IAAA,IAAI,EAAE,EAFR;AAGE,IAAA,KAAK,EAAErB,KAAK,CAACgB,MAAN,CAAaC,IAHtB;AAIE,IAAA,SAAS,EAAE3B,WAAW,CAACuC,KAAZ,GAAoB,KAApB,GAA4B;AAJzC,IADF,CADwB,GAStB,IATJ;AAWA,sBACE,oBAAC,wBAAD;AAA0B,IAAA,QAAQ,EAAE,CAAC/B,OAArC;AAA8C,IAAA,OAAO,EAAEA;AAAvD,KAAoEM,IAApE,gBACE,oBAAC,IAAD;AAAM,IAAA,KAAK,EAAE,CAACsB,MAAM,CAACI,SAAR,EAAmBlC,OAAO,IAAI8B,MAAM,CAACK,KAArC,EAA4C7B,KAA5C;AAAb,KACGuB,IADH,eAGE,oBAAC,IAAD;AACE,IAAA,KAAK,EAAE,CACLC,MAAM,CAACM,IADF,EAEL;AACA;AAAEC,MAAAA,SAAS,EAAE,KAAK9B;AAAlB,KAHK,EAIL;AACAA,IAAAA,aAAa,GAAG,CAAhB,GACIP,OAAO,GACLN,WAAW,CAACuC,KAAZ,GACEH,MAAM,CAACQ,QADT,GAEER,MAAM,CAACS,SAHJ,GAILT,MAAM,CAACU,UALb,GAMI,EAXC,EAYLrC,aAAa,GAAG2B,MAAM,CAACW,MAAV,GAAmB;AAAE9C,MAAAA,KAAK,EAAEwB;AAAT,KAZ3B,EAaLd,SAbK,CADT;AAgBE,IAAA,aAAa,EAAEE;AAhBjB,KAkBGN,QAlBH,CAHF,CADF,CADF;AA4BD,CArED;;AAuEAF,cAAc,CAAC2C,WAAf,GAA6B,iBAA7B;AAEA,MAAMZ,MAAM,GAAGvC,UAAU,CAACoD,MAAX,CAAkB;AAC/BT,EAAAA,SAAS,EAAE;AACTU,IAAAA,IAAI,EAAE,CADG;AAETC,IAAAA,aAAa,EAAE,KAFN;AAGTC,IAAAA,YAAY,EAAE,QAHL;AAITC,IAAAA,eAAe,EAAE;AAJR,GADoB;AAQ/BR,EAAAA,SAAS,EAAE;AACTS,IAAAA,SAAS,EAAE;AADF,GARoB;AAY/BV,EAAAA,QAAQ,EAAE;AACRU,IAAAA,SAAS,EAAE;AADH,GAZqB;AAgB/BR,EAAAA,UAAU,EAAE;AACVQ,IAAAA,SAAS,EAAE;AADD,GAhBmB;AAoB/Bb,EAAAA,KAAK,EAAE;AACLc,IAAAA,cAAc,EAAE;AADX,GApBwB;AAwB/Bb,EAAAA,IAAI,EAAE;AACJc,IAAAA,UAAU,EAAE,EADR;AAEJC,IAAAA,QAAQ,EAAE,EAFN;AAGJC,IAAAA,UAAU,EAAE,KAHR;AAIJC,IAAAA,UAAU,EAAE;AAJR,GAxByB;AA+B/BZ,EAAAA,MAAM,EAAE;AACNa,IAAAA,UAAU,EAAE;AADN,GA/BuB;AAmC/BzB,EAAAA,IAAI,EAAE;AACJ0B,IAAAA,MAAM,EAAE,EADJ;AAEJN,IAAAA,cAAc,EAAE;AAFZ;AAnCyB,CAAlB,CAAf;AAyCA,eAAenD,SAAS,CAACC,cAAD,CAAxB,C,CAEA;;AACA,SAASA,cAAT","sourcesContent":["import * as React from 'react';\nimport {\n Animated,\n StyleProp,\n StyleSheet,\n TouchableWithoutFeedback,\n View,\n ViewStyle,\n I18nManager,\n TextStyle,\n} from 'react-native';\nimport color from 'color';\nimport MaterialCommunityIcon from '../MaterialCommunityIcon';\nimport Text from '../Typography/Text';\nimport { withTheme } from '../../core/theming';\n\ntype Props = React.ComponentPropsWithRef<typeof TouchableWithoutFeedback> & {\n /**\n * Text content of the `DataTableTitle`.\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 * Direction of sorting. An arrow indicating the direction is displayed when this is given.\n */\n sortDirection?: 'ascending' | 'descending';\n /**\n * The number of lines to show.\n */\n numberOfLines?: number;\n /**\n * Function to execute on press.\n */\n onPress?: () => void;\n style?: StyleProp<ViewStyle>;\n /**\n * Text content style of the `DataTableTitle`.\n */\n textStyle?: StyleProp<TextStyle>;\n /**\n * @optional\n */\n theme: ReactNativePaper.Theme;\n};\n\n/**\n * A component to display title in table header.\n *\n * <div class=\"screenshots\">\n * <figure>\n * <img class=\"medium\" src=\"screenshots/data-table-header.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>\n * <DataTable.Header>\n * <DataTable.Title\n * sortDirection='descending'\n * >\n * Dessert\n * </DataTable.Title>\n * <DataTable.Title numeric>Calories</DataTable.Title>\n * <DataTable.Title numeric>Fat (g)</DataTable.Title>\n * </DataTable.Header>\n * </DataTable>\n * );\n *\n * export default MyComponent;\n * ```\n */\n\nconst DataTableTitle = ({\n numeric,\n children,\n onPress,\n sortDirection,\n theme,\n textStyle,\n style,\n numberOfLines = 1,\n ...rest\n}: Props) => {\n const { current: spinAnim } = React.useRef<Animated.Value>(\n new Animated.Value(sortDirection === 'ascending' ? 0 : 1)\n );\n\n React.useEffect(() => {\n Animated.timing(spinAnim, {\n toValue: sortDirection === 'ascending' ? 0 : 1,\n duration: 150,\n useNativeDriver: true,\n }).start();\n }, [sortDirection, spinAnim]);\n\n const textColor = color(theme.colors.text).alpha(0.6).rgb().string();\n\n const spin = spinAnim.interpolate({\n inputRange: [0, 1],\n outputRange: ['0deg', '180deg'],\n });\n\n const icon = sortDirection ? (\n <Animated.View style={[styles.icon, { transform: [{ rotate: spin }] }]}>\n <MaterialCommunityIcon\n name=\"arrow-up\"\n size={16}\n color={theme.colors.text}\n direction={I18nManager.isRTL ? 'rtl' : 'ltr'}\n />\n </Animated.View>\n ) : null;\n\n return (\n <TouchableWithoutFeedback disabled={!onPress} onPress={onPress} {...rest}>\n <View style={[styles.container, numeric && styles.right, style]}>\n {icon}\n\n <Text\n style={[\n styles.cell,\n // height must scale with numberOfLines\n { maxHeight: 24 * numberOfLines },\n // if numberOfLines causes wrap, center is lost. Align directly, sensitive to numeric and RTL\n numberOfLines > 1\n ? numeric\n ? I18nManager.isRTL\n ? styles.leftText\n : styles.rightText\n : styles.centerText\n : {},\n sortDirection ? styles.sorted : { color: textColor },\n textStyle,\n ]}\n numberOfLines={numberOfLines}\n >\n {children}\n </Text>\n </View>\n </TouchableWithoutFeedback>\n );\n};\n\nDataTableTitle.displayName = 'DataTable.Title';\n\nconst styles = StyleSheet.create({\n container: {\n flex: 1,\n flexDirection: 'row',\n alignContent: 'center',\n paddingVertical: 12,\n },\n\n rightText: {\n textAlign: 'right',\n },\n\n leftText: {\n textAlign: 'left',\n },\n\n centerText: {\n textAlign: 'center',\n },\n\n right: {\n justifyContent: 'flex-end',\n },\n\n cell: {\n lineHeight: 24,\n fontSize: 12,\n fontWeight: '500',\n alignItems: 'center',\n },\n\n sorted: {\n marginLeft: 8,\n },\n\n icon: {\n height: 24,\n justifyContent: 'center',\n },\n});\n\nexport default withTheme(DataTableTitle);\n\n// @component-docs ignore-next-line\nexport { DataTableTitle };\n"]} |