| 1 | {"version":3,"sources":["AppbarHeader.tsx"],"names":["React","StyleSheet","View","SafeAreaView","overlay","DEFAULT_APPBAR_HEIGHT","Appbar","shadow","withTheme","APPROX_STATUSBAR_HEIGHT","AppbarHeader","props","statusBarHeight","style","dark","rest","isDarkTheme","colors","mode","theme","height","elevation","backgroundColor","customBackground","zIndex","restStyle","flatten","surface","primary","Wrapper","marginTop","styles","appbar","displayName","create","AppbarHeaderWithTheme"],"mappings":";;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SACEC,UADF,EAGEC,IAHF,EAIEC,YAJF,QAMO,cANP;AAOA,OAAOC,OAAP,MAAoB,sBAApB;AACA,SAASC,qBAAT,EAAgCC,MAAhC,QAA8C,UAA9C;AACA,OAAOC,MAAP,MAAmB,qBAAnB;AACA,SAASC,SAAT,QAA0B,oBAA1B;AACA,SAASC,uBAAT,QAAwC,iBAAxC;;AAyBA;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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAMC,YAAY,GAAIC,KAAD,IAAkB;AACrC,QAAM;AACJ;AACAC,IAAAA,eAAe,GAAGH,uBAFd;AAGJI,IAAAA,KAHI;AAIJC,IAAAA,IAJI;AAKJ,OAAGC;AALC,MAMFJ,KANJ;AAQA,QAAM;AAAEG,IAAAA,IAAI,EAAEE,WAAR;AAAqBC,IAAAA,MAArB;AAA6BC,IAAAA;AAA7B,MAAsCH,IAAI,CAACI,KAAjD;AACA,QAAM;AACJC,IAAAA,MAAM,GAAGf,qBADL;AAEJgB,IAAAA,SAAS,GAAG,CAFR;AAGJC,IAAAA,eAAe,EAAEC,gBAHb;AAIJC,IAAAA,MAAM,GAAG,CAJL;AAKJ,OAAGC;AALC,MAMSxB,UAAU,CAACyB,OAAX,CAAmBb,KAAnB,KAA6B,EAN5C;AAOA,QAAMS,eAAe,GAAGC,gBAAgB,GACpCA,gBADoC,GAEpCP,WAAW,IAAIE,IAAI,KAAK,UAAxB,GACAd,OAAO,CAACiB,SAAD,EAAYJ,MAAM,CAACU,OAAnB,CADP,GAEAV,MAAM,CAACW,OAJX,CAjBqC,CAsBrC;;AACA,QAAMC,OAAO,GACX,OAAOlB,KAAK,CAACC,eAAb,KAAiC,QAAjC,GAA4CV,IAA5C,GAAmDC,YADrD;AAEA,sBACE,oBAAC,OAAD;AACE,IAAA,KAAK,EACH,CACE;AAAEmB,MAAAA,eAAF;AAAmBE,MAAAA,MAAnB;AAA2BH,MAAAA;AAA3B,KADF,EAEEd,MAAM,CAACc,SAAD,CAFR;AAFJ,kBAQE,oBAAC,MAAD;AACE,IAAA,KAAK,EAAE,CACL;AAAED,MAAAA,MAAF;AAAUE,MAAAA,eAAV;AAA2BQ,MAAAA,SAAS,EAAElB;AAAtC,KADK,EAELmB,MAAM,CAACC,MAFF,EAGLP,SAHK,CADT;AAME,IAAA,IAAI,EAAEX;AANR,KAOMC,IAPN,EARF,CADF;AAoBD,CA7CD;;AA+CAL,YAAY,CAACuB,WAAb,GAA2B,eAA3B;AAEA,MAAMF,MAAM,GAAG9B,UAAU,CAACiC,MAAX,CAAkB;AAC/BF,EAAAA,MAAM,EAAE;AACNX,IAAAA,SAAS,EAAE;AADL;AADuB,CAAlB,CAAf;AAMA,eAAeb,SAAS,CAACE,YAAD,CAAxB,C,CAEA;;AACA,MAAMyB,qBAAqB,GAAG3B,SAAS,CAACE,YAAD,CAAvC,C,CACA;;AACA,SAASyB,qBAAqB,IAAIzB,YAAlC","sourcesContent":["import * as React from 'react';\nimport {\n StyleSheet,\n StyleProp,\n View,\n SafeAreaView,\n ViewStyle,\n} from 'react-native';\nimport overlay from '../../styles/overlay';\nimport { DEFAULT_APPBAR_HEIGHT, Appbar } from './Appbar';\nimport shadow from '../../styles/shadow';\nimport { withTheme } from '../../core/theming';\nimport { APPROX_STATUSBAR_HEIGHT } from '../../constants';\n\ntype Props = React.ComponentProps<typeof Appbar> & {\n /**\n * Whether the background color is a dark color. A dark header will render light text and vice-versa.\n */\n dark?: boolean;\n /**\n * Extra padding to add at the top of header to account for translucent status bar.\n * This is automatically handled on iOS >= 11 including iPhone X using `SafeAreaView`.\n * If you are using Expo, we assume translucent status bar and set a height for status bar automatically.\n * Pass `0` or a custom value to disable the default behaviour, and customize the height.\n */\n statusBarHeight?: number;\n /**\n * Content of the header.\n */\n children: React.ReactNode;\n /**\n * @optional\n */\n theme: ReactNativePaper.Theme;\n style?: StyleProp<ViewStyle>;\n};\n\n/**\n * A component to use as a header at the top of the screen.\n * It can contain the screen title, controls such as navigation buttons, menu button etc.\n *\n * <div class=\"screenshots\">\n * <figure>\n * <img class=\"medium\" src=\"screenshots/appbar-header.android.png\" />\n * <figcaption>Android</figcaption>\n * </figure>\n * <figure>\n * <img class=\"medium\" src=\"screenshots/appbar-header.ios.png\" />\n * <figcaption>iOS</figcaption>\n * </figure>\n * </div>\n *\n * ## Usage\n * ```js\n * import * as React from 'react';\n * import { Appbar } from 'react-native-paper';\n *\n * const MyComponent = () => {\n * const _goBack = () => console.log('Went back');\n *\n * const _handleSearch = () => console.log('Searching');\n *\n * const _handleMore = () => console.log('Shown more');\n *\n * return (\n * <Appbar.Header>\n * <Appbar.BackAction onPress={_goBack} />\n * <Appbar.Content title=\"Title\" subtitle=\"Subtitle\" />\n * <Appbar.Action icon=\"magnify\" onPress={_handleSearch} />\n * <Appbar.Action icon=\"dots-vertical\" onPress={_handleMore} />\n * </Appbar.Header>\n * );\n * };\n *\n * export default MyComponent;\n * ```\n */\nconst AppbarHeader = (props: Props) => {\n const {\n // Don't use default props since we check it to know whether we should use SafeAreaView\n statusBarHeight = APPROX_STATUSBAR_HEIGHT,\n style,\n dark,\n ...rest\n } = props;\n\n const { dark: isDarkTheme, colors, mode } = rest.theme;\n const {\n height = DEFAULT_APPBAR_HEIGHT,\n elevation = 4,\n backgroundColor: customBackground,\n zIndex = 0,\n ...restStyle\n }: ViewStyle = StyleSheet.flatten(style) || {};\n const backgroundColor = customBackground\n ? customBackground\n : isDarkTheme && mode === 'adaptive'\n ? overlay(elevation, colors.surface)\n : colors.primary;\n // Let the user override the behaviour\n const Wrapper =\n typeof props.statusBarHeight === 'number' ? View : SafeAreaView;\n return (\n <Wrapper\n style={\n [\n { backgroundColor, zIndex, elevation },\n shadow(elevation),\n ] as StyleProp<ViewStyle>\n }\n >\n <Appbar\n style={[\n { height, backgroundColor, marginTop: statusBarHeight },\n styles.appbar,\n restStyle,\n ]}\n dark={dark}\n {...rest}\n />\n </Wrapper>\n );\n};\n\nAppbarHeader.displayName = 'Appbar.Header';\n\nconst styles = StyleSheet.create({\n appbar: {\n elevation: 0,\n },\n});\n\nexport default withTheme(AppbarHeader);\n\n// @component-docs ignore-next-line\nconst AppbarHeaderWithTheme = withTheme(AppbarHeader);\n// @component-docs ignore-next-line\nexport { AppbarHeaderWithTheme as AppbarHeader };\n"]} |