| 1 | {"version":3,"sources":["Divider.tsx"],"names":["React","color","StyleSheet","View","withTheme","black","white","Divider","inset","style","theme","rest","dark","isDarkTheme","styles","light","create","backgroundColor","alpha","rgb","string","height","hairlineWidth","marginLeft"],"mappings":";;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,OAAOC,KAAP,MAAkB,OAAlB;AACA,SAASC,UAAT,EAAqBC,IAArB,QAAuD,cAAvD;AACA,SAASC,SAAT,QAA0B,iBAA1B;AACA,SAASC,KAAT,EAAgBC,KAAhB,QAA6B,kBAA7B;;AAeA;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,MAAMC,OAAO,GAAG,QAA6C;AAAA,MAA5C;AAAEC,IAAAA,KAAF;AAASC,IAAAA,KAAT;AAAgBC,IAAAA,KAAhB;AAAuB,OAAGC;AAA1B,GAA4C;AAC3D,QAAM;AAAEC,IAAAA,IAAI,EAAEC;AAAR,MAAwBH,KAA9B;AACA,sBACE,oBAAC,IAAD,eACMC,IADN;AAEE,IAAA,KAAK,EAAE,CACLE,WAAW,GAAGC,MAAM,CAACF,IAAV,GAAiBE,MAAM,CAACC,KAD9B,EAELP,KAAK,IAAIM,MAAM,CAACN,KAFX,EAGLC,KAHK;AAFT,KADF;AAUD,CAZD;;AAcA,MAAMK,MAAM,GAAGZ,UAAU,CAACc,MAAX,CAAkB;AAC/BD,EAAAA,KAAK,EAAE;AACLE,IAAAA,eAAe,EAAEhB,KAAK,CAACI,KAAD,CAAL,CAAaa,KAAb,CAAmB,IAAnB,EAAyBC,GAAzB,GAA+BC,MAA/B,EADZ;AAELC,IAAAA,MAAM,EAAEnB,UAAU,CAACoB;AAFd,GADwB;AAK/BV,EAAAA,IAAI,EAAE;AACJK,IAAAA,eAAe,EAAEhB,KAAK,CAACK,KAAD,CAAL,CAAaY,KAAb,CAAmB,IAAnB,EAAyBC,GAAzB,GAA+BC,MAA/B,EADb;AAEJC,IAAAA,MAAM,EAAEnB,UAAU,CAACoB;AAFf,GALyB;AAS/Bd,EAAAA,KAAK,EAAE;AACLe,IAAAA,UAAU,EAAE;AADP;AATwB,CAAlB,CAAf;AAcA,eAAenB,SAAS,CAACG,OAAD,CAAxB","sourcesContent":["import * as React from 'react';\nimport color from 'color';\nimport { StyleSheet, View, ViewStyle, StyleProp } from 'react-native';\nimport { withTheme } from '../core/theming';\nimport { black, white } from '../styles/colors';\nimport type { $RemoveChildren } from '../types';\n\ntype Props = $RemoveChildren<typeof View> & {\n /**\n * Whether divider has a left inset.\n */\n inset?: boolean;\n style?: StyleProp<ViewStyle>;\n /**\n * @optional\n */\n theme: ReactNativePaper.Theme;\n};\n\n/**\n * A divider is a thin, lightweight separator that groups content in lists and page layouts.\n *\n * <div class=\"screenshots\">\n * <figure>\n * <img class=\"medium\" src=\"screenshots/divider.png\" />\n * </figure>\n * </div>\n *\n * ## Usage\n * ```js\n * import * as React from 'react';\n * import { View } from 'react-native';\n * import { Divider, Text } from 'react-native-paper';\n *\n * const MyComponent = () => (\n * <View>\n * <Text>Lemon</Text>\n * <Divider />\n * <Text>Mango</Text>\n * <Divider />\n * </View>\n * );\n *\n * export default MyComponent;\n * ```\n */\nconst Divider = ({ inset, style, theme, ...rest }: Props) => {\n const { dark: isDarkTheme } = theme;\n return (\n <View\n {...rest}\n style={[\n isDarkTheme ? styles.dark : styles.light,\n inset && styles.inset,\n style,\n ]}\n />\n );\n};\n\nconst styles = StyleSheet.create({\n light: {\n backgroundColor: color(black).alpha(0.12).rgb().string(),\n height: StyleSheet.hairlineWidth,\n },\n dark: {\n backgroundColor: color(white).alpha(0.12).rgb().string(),\n height: StyleSheet.hairlineWidth,\n },\n inset: {\n marginLeft: 72,\n },\n});\n\nexport default withTheme(Divider);\n"]} |