| 1 | {"version":3,"sources":["Divider.tsx"],"names":["Divider","inset","style","theme","rest","dark","isDarkTheme","styles","light","StyleSheet","create","backgroundColor","black","alpha","rgb","string","height","hairlineWidth","white","marginLeft"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;;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,MAAMA,OAAO,GAAG,CAAC;AAAEC,EAAAA,KAAF;AAASC,EAAAA,KAAT;AAAgBC,EAAAA,KAAhB;AAAuB,KAAGC;AAA1B,CAAD,KAA6C;AAC3D,QAAM;AAAEC,IAAAA,IAAI,EAAEC;AAAR,MAAwBH,KAA9B;AACA,sBACE,oBAAC,iBAAD,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,GAAGE,wBAAWC,MAAX,CAAkB;AAC/BF,EAAAA,KAAK,EAAE;AACLG,IAAAA,eAAe,EAAE,oBAAMC,aAAN,EAAaC,KAAb,CAAmB,IAAnB,EAAyBC,GAAzB,GAA+BC,MAA/B,EADZ;AAELC,IAAAA,MAAM,EAAEP,wBAAWQ;AAFd,GADwB;AAK/BZ,EAAAA,IAAI,EAAE;AACJM,IAAAA,eAAe,EAAE,oBAAMO,aAAN,EAAaL,KAAb,CAAmB,IAAnB,EAAyBC,GAAzB,GAA+BC,MAA/B,EADb;AAEJC,IAAAA,MAAM,EAAEP,wBAAWQ;AAFf,GALyB;AAS/BhB,EAAAA,KAAK,EAAE;AACLkB,IAAAA,UAAU,EAAE;AADP;AATwB,CAAlB,CAAf;;eAce,wBAAUnB,OAAV,C","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"]} |