@react-navigation/elements 1.1.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +21 -0
- package/README.md +5 -0
- package/lib/commonjs/Background.js +34 -0
- package/lib/commonjs/Background.js.map +1 -0
- package/lib/commonjs/Header/Header.js +250 -0
- package/lib/commonjs/Header/Header.js.map +1 -0
- package/lib/commonjs/Header/HeaderBackButton.js +222 -0
- package/lib/commonjs/Header/HeaderBackButton.js.map +1 -0
- package/lib/commonjs/Header/HeaderBackContext.js +15 -0
- package/lib/commonjs/Header/HeaderBackContext.js.map +1 -0
- package/lib/commonjs/Header/HeaderBackground.js +57 -0
- package/lib/commonjs/Header/HeaderBackground.js.map +1 -0
- package/lib/commonjs/Header/HeaderHeightContext.js +15 -0
- package/lib/commonjs/Header/HeaderHeightContext.js.map +1 -0
- package/lib/commonjs/Header/HeaderShownContext.js +15 -0
- package/lib/commonjs/Header/HeaderShownContext.js.map +1 -0
- package/lib/commonjs/Header/HeaderTitle.js +56 -0
- package/lib/commonjs/Header/HeaderTitle.js.map +1 -0
- package/lib/commonjs/Header/getDefaultHeaderHeight.js +40 -0
- package/lib/commonjs/Header/getDefaultHeaderHeight.js.map +1 -0
- package/lib/commonjs/Header/getHeaderTitle.js +11 -0
- package/lib/commonjs/Header/getHeaderTitle.js.map +1 -0
- package/lib/commonjs/Header/useHeaderHeight.js +27 -0
- package/lib/commonjs/Header/useHeaderHeight.js.map +1 -0
- package/lib/commonjs/MaskedView.android.js +16 -0
- package/lib/commonjs/MaskedView.android.js.map +1 -0
- package/lib/commonjs/MaskedView.ios.js +16 -0
- package/lib/commonjs/MaskedView.ios.js.map +1 -0
- package/lib/commonjs/MaskedView.js +16 -0
- package/lib/commonjs/MaskedView.js.map +1 -0
- package/lib/commonjs/MaskedViewNative.js +40 -0
- package/lib/commonjs/MaskedViewNative.js.map +1 -0
- package/lib/commonjs/MissingIcon.js +34 -0
- package/lib/commonjs/MissingIcon.js.map +1 -0
- package/lib/commonjs/PlatformPressable.js +77 -0
- package/lib/commonjs/PlatformPressable.js.map +1 -0
- package/lib/commonjs/ResourceSavingView.js +64 -0
- package/lib/commonjs/ResourceSavingView.js.map +1 -0
- package/lib/commonjs/SafeAreaProviderCompat.js +69 -0
- package/lib/commonjs/SafeAreaProviderCompat.js.map +1 -0
- package/lib/commonjs/Screen.js +89 -0
- package/lib/commonjs/Screen.js.map +1 -0
- package/lib/commonjs/assets/back-icon-mask.png +0 -0
- package/lib/commonjs/assets/back-icon.png +0 -0
- package/lib/commonjs/assets/back-icon@1.5x.android.png +0 -0
- package/lib/commonjs/assets/back-icon@1.5x.ios.png +0 -0
- package/lib/commonjs/assets/back-icon@1x.android.png +0 -0
- package/lib/commonjs/assets/back-icon@1x.ios.png +0 -0
- package/lib/commonjs/assets/back-icon@2x.android.png +0 -0
- package/lib/commonjs/assets/back-icon@2x.ios.png +0 -0
- package/lib/commonjs/assets/back-icon@3x.android.png +0 -0
- package/lib/commonjs/assets/back-icon@3x.ios.png +0 -0
- package/lib/commonjs/assets/back-icon@4x.android.png +0 -0
- package/lib/commonjs/assets/back-icon@4x.ios.png +0 -0
- package/lib/commonjs/getNamedContext.js +32 -0
- package/lib/commonjs/getNamedContext.js.map +1 -0
- package/lib/commonjs/index.js +175 -0
- package/lib/commonjs/index.js.map +1 -0
- package/lib/commonjs/types.js +6 -0
- package/lib/commonjs/types.js.map +1 -0
- package/lib/module/Background.js +20 -0
- package/lib/module/Background.js.map +1 -0
- package/lib/module/Header/Header.js +229 -0
- package/lib/module/Header/Header.js.map +1 -0
- package/lib/module/Header/HeaderBackButton.js +203 -0
- package/lib/module/Header/HeaderBackButton.js.map +1 -0
- package/lib/module/Header/HeaderBackContext.js +4 -0
- package/lib/module/Header/HeaderBackContext.js.map +1 -0
- package/lib/module/Header/HeaderBackground.js +42 -0
- package/lib/module/Header/HeaderBackground.js.map +1 -0
- package/lib/module/Header/HeaderHeightContext.js +4 -0
- package/lib/module/Header/HeaderHeightContext.js.map +1 -0
- package/lib/module/Header/HeaderShownContext.js +4 -0
- package/lib/module/Header/HeaderShownContext.js.map +1 -0
- package/lib/module/Header/HeaderTitle.js +41 -0
- package/lib/module/Header/HeaderTitle.js.map +1 -0
- package/lib/module/Header/getDefaultHeaderHeight.js +32 -0
- package/lib/module/Header/getDefaultHeaderHeight.js.map +1 -0
- package/lib/module/Header/getHeaderTitle.js +4 -0
- package/lib/module/Header/getHeaderTitle.js.map +1 -0
- package/lib/module/Header/useHeaderHeight.js +12 -0
- package/lib/module/Header/useHeaderHeight.js.map +1 -0
- package/lib/module/MaskedView.android.js +2 -0
- package/lib/module/MaskedView.android.js.map +1 -0
- package/lib/module/MaskedView.ios.js +2 -0
- package/lib/module/MaskedView.ios.js.map +1 -0
- package/lib/module/MaskedView.js +9 -0
- package/lib/module/MaskedView.js.map +1 -0
- package/lib/module/MaskedViewNative.js +26 -0
- package/lib/module/MaskedViewNative.js.map +1 -0
- package/lib/module/MissingIcon.js +20 -0
- package/lib/module/MissingIcon.js.map +1 -0
- package/lib/module/PlatformPressable.js +62 -0
- package/lib/module/PlatformPressable.js.map +1 -0
- package/lib/module/ResourceSavingView.js +50 -0
- package/lib/module/ResourceSavingView.js.map +1 -0
- package/lib/module/SafeAreaProviderCompat.js +51 -0
- package/lib/module/SafeAreaProviderCompat.js.map +1 -0
- package/lib/module/Screen.js +67 -0
- package/lib/module/Screen.js.map +1 -0
- package/lib/module/assets/back-icon-mask.png +0 -0
- package/lib/module/assets/back-icon.png +0 -0
- package/lib/module/assets/back-icon@1.5x.android.png +0 -0
- package/lib/module/assets/back-icon@1.5x.ios.png +0 -0
- package/lib/module/assets/back-icon@1x.android.png +0 -0
- package/lib/module/assets/back-icon@1x.ios.png +0 -0
- package/lib/module/assets/back-icon@2x.android.png +0 -0
- package/lib/module/assets/back-icon@2x.ios.png +0 -0
- package/lib/module/assets/back-icon@3x.android.png +0 -0
- package/lib/module/assets/back-icon@3x.ios.png +0 -0
- package/lib/module/assets/back-icon@4x.android.png +0 -0
- package/lib/module/assets/back-icon@4x.ios.png +0 -0
- package/lib/module/getNamedContext.js +19 -0
- package/lib/module/getNamedContext.js.map +1 -0
- package/lib/module/index.js +21 -0
- package/lib/module/index.js.map +1 -0
- package/lib/module/types.js +2 -0
- package/lib/module/types.js.map +1 -0
- package/lib/typescript/src/Background.d.ts +7 -0
- package/lib/typescript/src/Header/Header.d.ts +18 -0
- package/lib/typescript/src/Header/HeaderBackButton.d.ts +3 -0
- package/lib/typescript/src/Header/HeaderBackContext.d.ts +5 -0
- package/lib/typescript/src/Header/HeaderBackground.d.ts +8 -0
- package/lib/typescript/src/Header/HeaderHeightContext.d.ts +3 -0
- package/lib/typescript/src/Header/HeaderShownContext.d.ts +3 -0
- package/lib/typescript/src/Header/HeaderTitle.d.ts +9 -0
- package/lib/typescript/src/Header/getDefaultHeaderHeight.d.ts +2 -0
- package/lib/typescript/src/Header/getHeaderTitle.d.ts +5 -0
- package/lib/typescript/src/Header/useHeaderHeight.d.ts +1 -0
- package/lib/typescript/src/MaskedView.android.d.ts +1 -0
- package/lib/typescript/src/MaskedView.d.ts +10 -0
- package/lib/typescript/src/MaskedView.ios.d.ts +1 -0
- package/lib/typescript/src/MaskedViewNative.d.ts +10 -0
- package/lib/typescript/src/MissingIcon.d.ts +9 -0
- package/lib/typescript/src/PlatformPressable.d.ts +12 -0
- package/lib/typescript/src/ResourceSavingView.d.ts +9 -0
- package/lib/typescript/src/SafeAreaProviderCompat.d.ts +11 -0
- package/lib/typescript/src/Screen.d.ts +17 -0
- package/lib/typescript/src/getNamedContext.d.ts +5 -0
- package/lib/typescript/src/index.d.ts +18 -0
- package/lib/typescript/src/types.d.ts +202 -0
- package/package.json +72 -0
- package/src/Background.tsx +18 -0
- package/src/Header/Header.tsx +306 -0
- package/src/Header/HeaderBackButton.tsx +240 -0
- package/src/Header/HeaderBackContext.tsx +8 -0
- package/src/Header/HeaderBackground.tsx +56 -0
- package/src/Header/HeaderHeightContext.tsx +8 -0
- package/src/Header/HeaderShownContext.tsx +5 -0
- package/src/Header/HeaderTitle.tsx +52 -0
- package/src/Header/getDefaultHeaderHeight.tsx +39 -0
- package/src/Header/getHeaderTitle.tsx +12 -0
- package/src/Header/useHeaderHeight.tsx +15 -0
- package/src/MaskedView.android.tsx +1 -0
- package/src/MaskedView.ios.tsx +1 -0
- package/src/MaskedView.tsx +13 -0
- package/src/MaskedViewNative.tsx +33 -0
- package/src/MissingIcon.tsx +18 -0
- package/src/PlatformPressable.tsx +86 -0
- package/src/ResourceSavingView.tsx +70 -0
- package/src/SafeAreaProviderCompat.tsx +61 -0
- package/src/Screen.tsx +109 -0
- package/src/assets/back-icon-mask.png +0 -0
- package/src/assets/back-icon.png +0 -0
- package/src/assets/back-icon@1.5x.android.png +0 -0
- package/src/assets/back-icon@1.5x.ios.png +0 -0
- package/src/assets/back-icon@1x.android.png +0 -0
- package/src/assets/back-icon@1x.ios.png +0 -0
- package/src/assets/back-icon@2x.android.png +0 -0
- package/src/assets/back-icon@2x.ios.png +0 -0
- package/src/assets/back-icon@3x.android.png +0 -0
- package/src/assets/back-icon@3x.ios.png +0 -0
- package/src/assets/back-icon@4x.android.png +0 -0
- package/src/assets/back-icon@4x.ios.png +0 -0
- package/src/getNamedContext.tsx +28 -0
- package/src/index.tsx +25 -0
- package/src/types.tsx +208 -0
package/LICENSE
ADDED
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
MIT License
|
|
2
|
+
|
|
3
|
+
Copyright (c) 2017 React Navigation Contributors
|
|
4
|
+
|
|
5
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
|
+
of this software and associated documentation files (the "Software"), to deal
|
|
7
|
+
in the Software without restriction, including without limitation the rights
|
|
8
|
+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
9
|
+
copies of the Software, and to permit persons to whom the Software is
|
|
10
|
+
furnished to do so, subject to the following conditions:
|
|
11
|
+
|
|
12
|
+
The above copyright notice and this permission notice shall be included in all
|
|
13
|
+
copies or substantial portions of the Software.
|
|
14
|
+
|
|
15
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
16
|
+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
17
|
+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
18
|
+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
19
|
+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
20
|
+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
21
|
+
SOFTWARE.
|
package/README.md
ADDED
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = Background;
|
|
7
|
+
|
|
8
|
+
var _native = require("@react-navigation/native");
|
|
9
|
+
|
|
10
|
+
var React = _interopRequireWildcard(require("react"));
|
|
11
|
+
|
|
12
|
+
var _reactNative = require("react-native");
|
|
13
|
+
|
|
14
|
+
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
15
|
+
|
|
16
|
+
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
17
|
+
|
|
18
|
+
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
19
|
+
|
|
20
|
+
function Background({
|
|
21
|
+
style,
|
|
22
|
+
...rest
|
|
23
|
+
}) {
|
|
24
|
+
const {
|
|
25
|
+
colors
|
|
26
|
+
} = (0, _native.useTheme)();
|
|
27
|
+
return /*#__PURE__*/React.createElement(_reactNative.View, _extends({}, rest, {
|
|
28
|
+
style: [{
|
|
29
|
+
flex: 1,
|
|
30
|
+
backgroundColor: colors.background
|
|
31
|
+
}, style]
|
|
32
|
+
}));
|
|
33
|
+
}
|
|
34
|
+
//# sourceMappingURL=Background.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["Background.tsx"],"names":["Background","style","rest","colors","flex","backgroundColor","background"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;;;;;;;AAMe,SAASA,UAAT,CAAoB;AAAEC,EAAAA,KAAF;AAAS,KAAGC;AAAZ,CAApB,EAA+C;AAC5D,QAAM;AAAEC,IAAAA;AAAF,MAAa,uBAAnB;AAEA,sBACE,oBAAC,iBAAD,eACMD,IADN;AAEE,IAAA,KAAK,EAAE,CAAC;AAAEE,MAAAA,IAAI,EAAE,CAAR;AAAWC,MAAAA,eAAe,EAAEF,MAAM,CAACG;AAAnC,KAAD,EAAkDL,KAAlD;AAFT,KADF;AAMD","sourcesContent":["import { useTheme } from '@react-navigation/native';\nimport * as React from 'react';\nimport { View, ViewProps } from 'react-native';\n\ntype Props = ViewProps & {\n children: React.ReactNode;\n};\n\nexport default function Background({ style, ...rest }: Props) {\n const { colors } = useTheme();\n\n return (\n <View\n {...rest}\n style={[{ flex: 1, backgroundColor: colors.background }, style]}\n />\n );\n}\n"]}
|
|
@@ -0,0 +1,250 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = Header;
|
|
7
|
+
|
|
8
|
+
var React = _interopRequireWildcard(require("react"));
|
|
9
|
+
|
|
10
|
+
var _reactNative = require("react-native");
|
|
11
|
+
|
|
12
|
+
var _reactNativeSafeAreaContext = require("react-native-safe-area-context");
|
|
13
|
+
|
|
14
|
+
var _getDefaultHeaderHeight = _interopRequireDefault(require("./getDefaultHeaderHeight"));
|
|
15
|
+
|
|
16
|
+
var _HeaderBackground = _interopRequireDefault(require("./HeaderBackground"));
|
|
17
|
+
|
|
18
|
+
var _HeaderShownContext = _interopRequireDefault(require("./HeaderShownContext"));
|
|
19
|
+
|
|
20
|
+
var _HeaderTitle = _interopRequireDefault(require("./HeaderTitle"));
|
|
21
|
+
|
|
22
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
23
|
+
|
|
24
|
+
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
25
|
+
|
|
26
|
+
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
27
|
+
|
|
28
|
+
const warnIfHeaderStylesDefined = styles => {
|
|
29
|
+
Object.keys(styles).forEach(styleProp => {
|
|
30
|
+
const value = styles[styleProp];
|
|
31
|
+
|
|
32
|
+
if (styleProp === 'position' && value === 'absolute') {
|
|
33
|
+
console.warn("position: 'absolute' is not supported on headerStyle. If you would like to render content under the header, use the 'headerTransparent' option.");
|
|
34
|
+
} else if (value !== undefined) {
|
|
35
|
+
console.warn(`${styleProp} was given a value of ${value}, this has no effect on headerStyle.`);
|
|
36
|
+
}
|
|
37
|
+
});
|
|
38
|
+
};
|
|
39
|
+
|
|
40
|
+
function Header(props) {
|
|
41
|
+
const insets = (0, _reactNativeSafeAreaContext.useSafeAreaInsets)();
|
|
42
|
+
const frame = (0, _reactNativeSafeAreaContext.useSafeAreaFrame)();
|
|
43
|
+
const isParentHeaderShown = React.useContext(_HeaderShownContext.default);
|
|
44
|
+
const {
|
|
45
|
+
layout = frame,
|
|
46
|
+
modal = false,
|
|
47
|
+
title,
|
|
48
|
+
headerTitle: customTitle,
|
|
49
|
+
headerTitleAlign = _reactNative.Platform.select({
|
|
50
|
+
ios: 'center',
|
|
51
|
+
default: 'left'
|
|
52
|
+
}),
|
|
53
|
+
headerLeft,
|
|
54
|
+
headerLeftLabelVisible,
|
|
55
|
+
headerTransparent,
|
|
56
|
+
headerTintColor,
|
|
57
|
+
headerBackground,
|
|
58
|
+
headerRight,
|
|
59
|
+
headerTitleAllowFontScaling: titleAllowFontScaling,
|
|
60
|
+
headerTitleStyle: titleStyle,
|
|
61
|
+
headerLeftContainerStyle: leftContainerStyle,
|
|
62
|
+
headerRightContainerStyle: rightContainerStyle,
|
|
63
|
+
headerTitleContainerStyle: titleContainerStyle,
|
|
64
|
+
headerBackgroundContainerStyle: backgroundContainerStyle,
|
|
65
|
+
headerStyle: customHeaderStyle,
|
|
66
|
+
headerPressColor,
|
|
67
|
+
headerPressOpacity,
|
|
68
|
+
headerStatusBarHeight = isParentHeaderShown ? 0 : insets.top
|
|
69
|
+
} = props;
|
|
70
|
+
const defaultHeight = (0, _getDefaultHeaderHeight.default)(layout, modal, headerStatusBarHeight);
|
|
71
|
+
|
|
72
|
+
const {
|
|
73
|
+
height = defaultHeight,
|
|
74
|
+
minHeight,
|
|
75
|
+
maxHeight,
|
|
76
|
+
backgroundColor,
|
|
77
|
+
borderBottomColor,
|
|
78
|
+
borderBottomEndRadius,
|
|
79
|
+
borderBottomLeftRadius,
|
|
80
|
+
borderBottomRightRadius,
|
|
81
|
+
borderBottomStartRadius,
|
|
82
|
+
borderBottomWidth,
|
|
83
|
+
borderColor,
|
|
84
|
+
borderEndColor,
|
|
85
|
+
borderEndWidth,
|
|
86
|
+
borderLeftColor,
|
|
87
|
+
borderLeftWidth,
|
|
88
|
+
borderRadius,
|
|
89
|
+
borderRightColor,
|
|
90
|
+
borderRightWidth,
|
|
91
|
+
borderStartColor,
|
|
92
|
+
borderStartWidth,
|
|
93
|
+
borderStyle,
|
|
94
|
+
borderTopColor,
|
|
95
|
+
borderTopEndRadius,
|
|
96
|
+
borderTopLeftRadius,
|
|
97
|
+
borderTopRightRadius,
|
|
98
|
+
borderTopStartRadius,
|
|
99
|
+
borderTopWidth,
|
|
100
|
+
borderWidth,
|
|
101
|
+
// @ts-expect-error: web support for shadow
|
|
102
|
+
boxShadow,
|
|
103
|
+
elevation,
|
|
104
|
+
shadowColor,
|
|
105
|
+
shadowOffset,
|
|
106
|
+
shadowOpacity,
|
|
107
|
+
shadowRadius,
|
|
108
|
+
opacity,
|
|
109
|
+
transform,
|
|
110
|
+
...unsafeStyles
|
|
111
|
+
} = _reactNative.StyleSheet.flatten(customHeaderStyle || {});
|
|
112
|
+
|
|
113
|
+
if (process.env.NODE_ENV !== 'production') {
|
|
114
|
+
warnIfHeaderStylesDefined(unsafeStyles);
|
|
115
|
+
}
|
|
116
|
+
|
|
117
|
+
const safeStyles = {
|
|
118
|
+
backgroundColor,
|
|
119
|
+
borderBottomColor,
|
|
120
|
+
borderBottomEndRadius,
|
|
121
|
+
borderBottomLeftRadius,
|
|
122
|
+
borderBottomRightRadius,
|
|
123
|
+
borderBottomStartRadius,
|
|
124
|
+
borderBottomWidth,
|
|
125
|
+
borderColor,
|
|
126
|
+
borderEndColor,
|
|
127
|
+
borderEndWidth,
|
|
128
|
+
borderLeftColor,
|
|
129
|
+
borderLeftWidth,
|
|
130
|
+
borderRadius,
|
|
131
|
+
borderRightColor,
|
|
132
|
+
borderRightWidth,
|
|
133
|
+
borderStartColor,
|
|
134
|
+
borderStartWidth,
|
|
135
|
+
borderStyle,
|
|
136
|
+
borderTopColor,
|
|
137
|
+
borderTopEndRadius,
|
|
138
|
+
borderTopLeftRadius,
|
|
139
|
+
borderTopRightRadius,
|
|
140
|
+
borderTopStartRadius,
|
|
141
|
+
borderTopWidth,
|
|
142
|
+
borderWidth,
|
|
143
|
+
// @ts-expect-error: boxShadow is only for Web
|
|
144
|
+
boxShadow,
|
|
145
|
+
elevation,
|
|
146
|
+
shadowColor,
|
|
147
|
+
shadowOffset,
|
|
148
|
+
shadowOpacity,
|
|
149
|
+
shadowRadius,
|
|
150
|
+
opacity,
|
|
151
|
+
transform
|
|
152
|
+
}; // Setting a property to undefined triggers default style
|
|
153
|
+
// So we need to filter them out
|
|
154
|
+
// Users can use `null` instead
|
|
155
|
+
|
|
156
|
+
for (const styleProp in safeStyles) {
|
|
157
|
+
// @ts-expect-error: typescript wrongly complains that styleProp cannot be used to index safeStyles
|
|
158
|
+
if (safeStyles[styleProp] === undefined) {
|
|
159
|
+
// @ts-expect-error
|
|
160
|
+
// eslint-disable-next-line @typescript-eslint/no-dynamic-delete
|
|
161
|
+
delete safeStyles[styleProp];
|
|
162
|
+
}
|
|
163
|
+
}
|
|
164
|
+
|
|
165
|
+
const leftButton = headerLeft ? headerLeft({
|
|
166
|
+
tintColor: headerTintColor,
|
|
167
|
+
pressColor: headerPressColor,
|
|
168
|
+
pressOpacity: headerPressOpacity,
|
|
169
|
+
labelVisible: headerLeftLabelVisible
|
|
170
|
+
}) : null;
|
|
171
|
+
const rightButton = headerRight ? headerRight({
|
|
172
|
+
tintColor: headerTintColor,
|
|
173
|
+
pressColor: headerPressColor,
|
|
174
|
+
pressOpacity: headerPressOpacity
|
|
175
|
+
}) : null;
|
|
176
|
+
const headerTitle = typeof customTitle !== 'function' ? props => /*#__PURE__*/React.createElement(_HeaderTitle.default, props) : customTitle;
|
|
177
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(_reactNative.Animated.View, {
|
|
178
|
+
pointerEvents: "box-none",
|
|
179
|
+
style: [_reactNative.StyleSheet.absoluteFill, {
|
|
180
|
+
zIndex: 0
|
|
181
|
+
}, backgroundContainerStyle]
|
|
182
|
+
}, headerBackground ? headerBackground({
|
|
183
|
+
style: safeStyles
|
|
184
|
+
}) : headerTransparent ? null : /*#__PURE__*/React.createElement(_HeaderBackground.default, {
|
|
185
|
+
style: safeStyles
|
|
186
|
+
})), /*#__PURE__*/React.createElement(_reactNative.Animated.View, {
|
|
187
|
+
pointerEvents: "box-none",
|
|
188
|
+
style: [{
|
|
189
|
+
height,
|
|
190
|
+
minHeight,
|
|
191
|
+
maxHeight,
|
|
192
|
+
opacity,
|
|
193
|
+
transform
|
|
194
|
+
}]
|
|
195
|
+
}, /*#__PURE__*/React.createElement(_reactNative.View, {
|
|
196
|
+
pointerEvents: "none",
|
|
197
|
+
style: {
|
|
198
|
+
height: headerStatusBarHeight
|
|
199
|
+
}
|
|
200
|
+
}), /*#__PURE__*/React.createElement(_reactNative.View, {
|
|
201
|
+
pointerEvents: "box-none",
|
|
202
|
+
style: styles.content
|
|
203
|
+
}, /*#__PURE__*/React.createElement(_reactNative.Animated.View, {
|
|
204
|
+
pointerEvents: "box-none",
|
|
205
|
+
style: [styles.left, headerTitleAlign === 'center' && styles.expand, {
|
|
206
|
+
marginStart: insets.left
|
|
207
|
+
}, leftContainerStyle]
|
|
208
|
+
}, leftButton), /*#__PURE__*/React.createElement(_reactNative.Animated.View, {
|
|
209
|
+
pointerEvents: "box-none",
|
|
210
|
+
style: [styles.title, {
|
|
211
|
+
// Avoid the title from going offscreen or overlapping buttons
|
|
212
|
+
maxWidth: headerTitleAlign === 'center' ? layout.width - ((leftButton ? headerLeftLabelVisible !== false ? 80 : 32 : 16) + Math.max(insets.left, insets.right)) * 2 : layout.width - ((leftButton ? 72 : 16) + (rightButton ? 72 : 16) + insets.left - insets.right)
|
|
213
|
+
}, titleContainerStyle]
|
|
214
|
+
}, headerTitle({
|
|
215
|
+
children: title,
|
|
216
|
+
allowFontScaling: titleAllowFontScaling,
|
|
217
|
+
tintColor: headerTintColor,
|
|
218
|
+
style: titleStyle
|
|
219
|
+
})), /*#__PURE__*/React.createElement(_reactNative.Animated.View, {
|
|
220
|
+
pointerEvents: "box-none",
|
|
221
|
+
style: [styles.right, styles.expand, {
|
|
222
|
+
marginEnd: insets.right
|
|
223
|
+
}, rightContainerStyle]
|
|
224
|
+
}, rightButton))));
|
|
225
|
+
}
|
|
226
|
+
|
|
227
|
+
const styles = _reactNative.StyleSheet.create({
|
|
228
|
+
content: {
|
|
229
|
+
flex: 1,
|
|
230
|
+
flexDirection: 'row',
|
|
231
|
+
alignItems: 'stretch'
|
|
232
|
+
},
|
|
233
|
+
title: {
|
|
234
|
+
marginHorizontal: 16,
|
|
235
|
+
justifyContent: 'center'
|
|
236
|
+
},
|
|
237
|
+
left: {
|
|
238
|
+
justifyContent: 'center',
|
|
239
|
+
alignItems: 'flex-start'
|
|
240
|
+
},
|
|
241
|
+
right: {
|
|
242
|
+
justifyContent: 'center',
|
|
243
|
+
alignItems: 'flex-end'
|
|
244
|
+
},
|
|
245
|
+
expand: {
|
|
246
|
+
flexGrow: 1,
|
|
247
|
+
flexBasis: 0
|
|
248
|
+
}
|
|
249
|
+
});
|
|
250
|
+
//# sourceMappingURL=Header.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["Header.tsx"],"names":["warnIfHeaderStylesDefined","styles","Object","keys","forEach","styleProp","value","console","warn","undefined","Header","props","insets","frame","isParentHeaderShown","React","useContext","HeaderShownContext","layout","modal","title","headerTitle","customTitle","headerTitleAlign","Platform","select","ios","default","headerLeft","headerLeftLabelVisible","headerTransparent","headerTintColor","headerBackground","headerRight","headerTitleAllowFontScaling","titleAllowFontScaling","headerTitleStyle","titleStyle","headerLeftContainerStyle","leftContainerStyle","headerRightContainerStyle","rightContainerStyle","headerTitleContainerStyle","titleContainerStyle","headerBackgroundContainerStyle","backgroundContainerStyle","headerStyle","customHeaderStyle","headerPressColor","headerPressOpacity","headerStatusBarHeight","top","defaultHeight","height","minHeight","maxHeight","backgroundColor","borderBottomColor","borderBottomEndRadius","borderBottomLeftRadius","borderBottomRightRadius","borderBottomStartRadius","borderBottomWidth","borderColor","borderEndColor","borderEndWidth","borderLeftColor","borderLeftWidth","borderRadius","borderRightColor","borderRightWidth","borderStartColor","borderStartWidth","borderStyle","borderTopColor","borderTopEndRadius","borderTopLeftRadius","borderTopRightRadius","borderTopStartRadius","borderTopWidth","borderWidth","boxShadow","elevation","shadowColor","shadowOffset","shadowOpacity","shadowRadius","opacity","transform","unsafeStyles","StyleSheet","flatten","process","env","NODE_ENV","safeStyles","leftButton","tintColor","pressColor","pressOpacity","labelVisible","rightButton","absoluteFill","zIndex","style","content","left","expand","marginStart","maxWidth","width","Math","max","right","children","allowFontScaling","marginEnd","create","flex","flexDirection","alignItems","marginHorizontal","justifyContent","flexGrow","flexBasis"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { Animated, Platform, StyleSheet, View, ViewStyle } from 'react-native';\nimport {\n useSafeAreaFrame,\n useSafeAreaInsets,\n} from 'react-native-safe-area-context';\n\nimport type { HeaderOptions, Layout } from '../types';\nimport getDefaultHeaderHeight from './getDefaultHeaderHeight';\nimport HeaderBackground from './HeaderBackground';\nimport HeaderShownContext from './HeaderShownContext';\nimport HeaderTitle from './HeaderTitle';\n\ntype Props = HeaderOptions & {\n /**\n * Whether the header is in a modal\n */\n modal?: boolean;\n /**\n * Layout of the screen.\n */\n layout?: Layout;\n /**\n * Title text for the header.\n */\n title: string;\n};\n\nconst warnIfHeaderStylesDefined = (styles: Record<string, any>) => {\n Object.keys(styles).forEach((styleProp) => {\n const value = styles[styleProp];\n\n if (styleProp === 'position' && value === 'absolute') {\n console.warn(\n \"position: 'absolute' is not supported on headerStyle. If you would like to render content under the header, use the 'headerTransparent' option.\"\n );\n } else if (value !== undefined) {\n console.warn(\n `${styleProp} was given a value of ${value}, this has no effect on headerStyle.`\n );\n }\n });\n};\n\nexport default function Header(props: Props) {\n const insets = useSafeAreaInsets();\n const frame = useSafeAreaFrame();\n\n const isParentHeaderShown = React.useContext(HeaderShownContext);\n\n const {\n layout = frame,\n modal = false,\n title,\n headerTitle: customTitle,\n headerTitleAlign = Platform.select({\n ios: 'center',\n default: 'left',\n }),\n headerLeft,\n headerLeftLabelVisible,\n headerTransparent,\n headerTintColor,\n headerBackground,\n headerRight,\n headerTitleAllowFontScaling: titleAllowFontScaling,\n headerTitleStyle: titleStyle,\n headerLeftContainerStyle: leftContainerStyle,\n headerRightContainerStyle: rightContainerStyle,\n headerTitleContainerStyle: titleContainerStyle,\n headerBackgroundContainerStyle: backgroundContainerStyle,\n headerStyle: customHeaderStyle,\n headerPressColor,\n headerPressOpacity,\n headerStatusBarHeight = isParentHeaderShown ? 0 : insets.top,\n } = props;\n\n const defaultHeight = getDefaultHeaderHeight(\n layout,\n modal,\n headerStatusBarHeight\n );\n\n const {\n height = defaultHeight,\n minHeight,\n maxHeight,\n backgroundColor,\n borderBottomColor,\n borderBottomEndRadius,\n borderBottomLeftRadius,\n borderBottomRightRadius,\n borderBottomStartRadius,\n borderBottomWidth,\n borderColor,\n borderEndColor,\n borderEndWidth,\n borderLeftColor,\n borderLeftWidth,\n borderRadius,\n borderRightColor,\n borderRightWidth,\n borderStartColor,\n borderStartWidth,\n borderStyle,\n borderTopColor,\n borderTopEndRadius,\n borderTopLeftRadius,\n borderTopRightRadius,\n borderTopStartRadius,\n borderTopWidth,\n borderWidth,\n // @ts-expect-error: web support for shadow\n boxShadow,\n elevation,\n shadowColor,\n shadowOffset,\n shadowOpacity,\n shadowRadius,\n opacity,\n transform,\n ...unsafeStyles\n } = StyleSheet.flatten(customHeaderStyle || {}) as ViewStyle;\n\n if (process.env.NODE_ENV !== 'production') {\n warnIfHeaderStylesDefined(unsafeStyles);\n }\n\n const safeStyles: ViewStyle = {\n backgroundColor,\n borderBottomColor,\n borderBottomEndRadius,\n borderBottomLeftRadius,\n borderBottomRightRadius,\n borderBottomStartRadius,\n borderBottomWidth,\n borderColor,\n borderEndColor,\n borderEndWidth,\n borderLeftColor,\n borderLeftWidth,\n borderRadius,\n borderRightColor,\n borderRightWidth,\n borderStartColor,\n borderStartWidth,\n borderStyle,\n borderTopColor,\n borderTopEndRadius,\n borderTopLeftRadius,\n borderTopRightRadius,\n borderTopStartRadius,\n borderTopWidth,\n borderWidth,\n // @ts-expect-error: boxShadow is only for Web\n boxShadow,\n elevation,\n shadowColor,\n shadowOffset,\n shadowOpacity,\n shadowRadius,\n opacity,\n transform,\n };\n\n // Setting a property to undefined triggers default style\n // So we need to filter them out\n // Users can use `null` instead\n for (const styleProp in safeStyles) {\n // @ts-expect-error: typescript wrongly complains that styleProp cannot be used to index safeStyles\n if (safeStyles[styleProp] === undefined) {\n // @ts-expect-error\n // eslint-disable-next-line @typescript-eslint/no-dynamic-delete\n delete safeStyles[styleProp];\n }\n }\n\n const leftButton = headerLeft\n ? headerLeft({\n tintColor: headerTintColor,\n pressColor: headerPressColor,\n pressOpacity: headerPressOpacity,\n labelVisible: headerLeftLabelVisible,\n })\n : null;\n\n const rightButton = headerRight\n ? headerRight({\n tintColor: headerTintColor,\n pressColor: headerPressColor,\n pressOpacity: headerPressOpacity,\n })\n : null;\n\n const headerTitle =\n typeof customTitle !== 'function'\n ? (props: React.ComponentProps<typeof HeaderTitle>) => (\n <HeaderTitle {...props} />\n )\n : customTitle;\n\n return (\n <React.Fragment>\n <Animated.View\n pointerEvents=\"box-none\"\n style={[\n StyleSheet.absoluteFill,\n { zIndex: 0 },\n backgroundContainerStyle,\n ]}\n >\n {headerBackground ? (\n headerBackground({ style: safeStyles })\n ) : headerTransparent ? null : (\n <HeaderBackground style={safeStyles} />\n )}\n </Animated.View>\n <Animated.View\n pointerEvents=\"box-none\"\n style={[{ height, minHeight, maxHeight, opacity, transform }]}\n >\n <View pointerEvents=\"none\" style={{ height: headerStatusBarHeight }} />\n <View pointerEvents=\"box-none\" style={styles.content}>\n <Animated.View\n pointerEvents=\"box-none\"\n style={[\n styles.left,\n headerTitleAlign === 'center' && styles.expand,\n { marginStart: insets.left },\n leftContainerStyle,\n ]}\n >\n {leftButton}\n </Animated.View>\n <Animated.View\n pointerEvents=\"box-none\"\n style={[\n styles.title,\n {\n // Avoid the title from going offscreen or overlapping buttons\n maxWidth:\n headerTitleAlign === 'center'\n ? layout.width -\n ((leftButton\n ? headerLeftLabelVisible !== false\n ? 80\n : 32\n : 16) +\n Math.max(insets.left, insets.right)) *\n 2\n : layout.width -\n ((leftButton ? 72 : 16) +\n (rightButton ? 72 : 16) +\n insets.left -\n insets.right),\n },\n titleContainerStyle,\n ]}\n >\n {headerTitle({\n children: title,\n allowFontScaling: titleAllowFontScaling,\n tintColor: headerTintColor,\n style: titleStyle,\n })}\n </Animated.View>\n <Animated.View\n pointerEvents=\"box-none\"\n style={[\n styles.right,\n styles.expand,\n { marginEnd: insets.right },\n rightContainerStyle,\n ]}\n >\n {rightButton}\n </Animated.View>\n </View>\n </Animated.View>\n </React.Fragment>\n );\n}\n\nconst styles = StyleSheet.create({\n content: {\n flex: 1,\n flexDirection: 'row',\n alignItems: 'stretch',\n },\n title: {\n marginHorizontal: 16,\n justifyContent: 'center',\n },\n left: {\n justifyContent: 'center',\n alignItems: 'flex-start',\n },\n right: {\n justifyContent: 'center',\n alignItems: 'flex-end',\n },\n expand: {\n flexGrow: 1,\n flexBasis: 0,\n },\n});\n"]}
|
|
@@ -0,0 +1,222 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = HeaderBackButton;
|
|
7
|
+
|
|
8
|
+
var _native = require("@react-navigation/native");
|
|
9
|
+
|
|
10
|
+
var React = _interopRequireWildcard(require("react"));
|
|
11
|
+
|
|
12
|
+
var _reactNative = require("react-native");
|
|
13
|
+
|
|
14
|
+
var _MaskedView = _interopRequireDefault(require("../MaskedView"));
|
|
15
|
+
|
|
16
|
+
var _PlatformPressable = _interopRequireDefault(require("../PlatformPressable"));
|
|
17
|
+
|
|
18
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
19
|
+
|
|
20
|
+
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
21
|
+
|
|
22
|
+
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
23
|
+
|
|
24
|
+
function HeaderBackButton({
|
|
25
|
+
disabled,
|
|
26
|
+
allowFontScaling,
|
|
27
|
+
backImage,
|
|
28
|
+
label,
|
|
29
|
+
labelStyle,
|
|
30
|
+
labelVisible,
|
|
31
|
+
onLabelLayout,
|
|
32
|
+
onPress,
|
|
33
|
+
pressColor,
|
|
34
|
+
pressOpacity,
|
|
35
|
+
screenLayout,
|
|
36
|
+
tintColor: customTintColor,
|
|
37
|
+
titleLayout,
|
|
38
|
+
truncatedLabel = 'Back',
|
|
39
|
+
accessibilityLabel = label && label !== 'Back' ? `${label}, back` : 'Go back',
|
|
40
|
+
testID,
|
|
41
|
+
style
|
|
42
|
+
}) {
|
|
43
|
+
const {
|
|
44
|
+
colors
|
|
45
|
+
} = (0, _native.useTheme)();
|
|
46
|
+
const [initialLabelWidth, setInitialLabelWidth] = React.useState(undefined);
|
|
47
|
+
const tintColor = customTintColor !== undefined ? customTintColor : _reactNative.Platform.select({
|
|
48
|
+
ios: colors.primary,
|
|
49
|
+
default: colors.text
|
|
50
|
+
});
|
|
51
|
+
|
|
52
|
+
const handleLabelLayout = e => {
|
|
53
|
+
onLabelLayout === null || onLabelLayout === void 0 ? void 0 : onLabelLayout(e);
|
|
54
|
+
setInitialLabelWidth(e.nativeEvent.layout.x + e.nativeEvent.layout.width);
|
|
55
|
+
};
|
|
56
|
+
|
|
57
|
+
const shouldTruncateLabel = () => {
|
|
58
|
+
return !label || initialLabelWidth && titleLayout && screenLayout && (screenLayout.width - titleLayout.width) / 2 < initialLabelWidth + 26;
|
|
59
|
+
};
|
|
60
|
+
|
|
61
|
+
const renderBackImage = () => {
|
|
62
|
+
if (backImage) {
|
|
63
|
+
return backImage({
|
|
64
|
+
tintColor
|
|
65
|
+
});
|
|
66
|
+
} else {
|
|
67
|
+
return /*#__PURE__*/React.createElement(_reactNative.Image, {
|
|
68
|
+
style: [styles.icon, Boolean(labelVisible) && styles.iconWithLabel, Boolean(tintColor) && {
|
|
69
|
+
tintColor
|
|
70
|
+
}],
|
|
71
|
+
source: require('../assets/back-icon.png'),
|
|
72
|
+
fadeDuration: 0
|
|
73
|
+
});
|
|
74
|
+
}
|
|
75
|
+
};
|
|
76
|
+
|
|
77
|
+
const renderLabel = () => {
|
|
78
|
+
const leftLabelText = shouldTruncateLabel() ? truncatedLabel : label;
|
|
79
|
+
|
|
80
|
+
if (!labelVisible || leftLabelText === undefined) {
|
|
81
|
+
return null;
|
|
82
|
+
}
|
|
83
|
+
|
|
84
|
+
const labelElement = /*#__PURE__*/React.createElement(_reactNative.View, {
|
|
85
|
+
style: screenLayout ? // We make the button extend till the middle of the screen
|
|
86
|
+
// Otherwise it appears to cut off when translating
|
|
87
|
+
[styles.labelWrapper, {
|
|
88
|
+
minWidth: screenLayout.width / 2 - 27
|
|
89
|
+
}] : null
|
|
90
|
+
}, /*#__PURE__*/React.createElement(_reactNative.Animated.Text, {
|
|
91
|
+
accessible: false,
|
|
92
|
+
onLayout: // This measurement is used to determine if we should truncate the label when it doesn't fit
|
|
93
|
+
// Only measure it when label is not truncated because we want the measurement of full label
|
|
94
|
+
leftLabelText === label ? handleLabelLayout : undefined,
|
|
95
|
+
style: [styles.label, tintColor ? {
|
|
96
|
+
color: tintColor
|
|
97
|
+
} : null, labelStyle],
|
|
98
|
+
numberOfLines: 1,
|
|
99
|
+
allowFontScaling: !!allowFontScaling
|
|
100
|
+
}, leftLabelText));
|
|
101
|
+
|
|
102
|
+
if (backImage || _reactNative.Platform.OS !== 'ios') {
|
|
103
|
+
// When a custom backimage is specified, we can't mask the label
|
|
104
|
+
// Otherwise there might be weird effect due to our mask not being the same as the image
|
|
105
|
+
return labelElement;
|
|
106
|
+
}
|
|
107
|
+
|
|
108
|
+
return /*#__PURE__*/React.createElement(_MaskedView.default, {
|
|
109
|
+
maskElement: /*#__PURE__*/React.createElement(_reactNative.View, {
|
|
110
|
+
style: styles.iconMaskContainer
|
|
111
|
+
}, /*#__PURE__*/React.createElement(_reactNative.Image, {
|
|
112
|
+
source: require('../assets/back-icon-mask.png'),
|
|
113
|
+
style: styles.iconMask
|
|
114
|
+
}), /*#__PURE__*/React.createElement(_reactNative.View, {
|
|
115
|
+
style: styles.iconMaskFillerRect
|
|
116
|
+
}))
|
|
117
|
+
}, labelElement);
|
|
118
|
+
};
|
|
119
|
+
|
|
120
|
+
const handlePress = () => onPress && requestAnimationFrame(onPress);
|
|
121
|
+
|
|
122
|
+
return /*#__PURE__*/React.createElement(_PlatformPressable.default, {
|
|
123
|
+
disabled: disabled,
|
|
124
|
+
accessible: true,
|
|
125
|
+
accessibilityRole: "button",
|
|
126
|
+
accessibilityLabel: accessibilityLabel,
|
|
127
|
+
testID: testID,
|
|
128
|
+
onPress: disabled ? undefined : handlePress,
|
|
129
|
+
pressColor: pressColor,
|
|
130
|
+
pressOpacity: pressOpacity,
|
|
131
|
+
android_ripple: {
|
|
132
|
+
borderless: true
|
|
133
|
+
},
|
|
134
|
+
style: [styles.container, disabled && styles.disabled, style],
|
|
135
|
+
hitSlop: _reactNative.Platform.select({
|
|
136
|
+
ios: undefined,
|
|
137
|
+
default: {
|
|
138
|
+
top: 16,
|
|
139
|
+
right: 16,
|
|
140
|
+
bottom: 16,
|
|
141
|
+
left: 16
|
|
142
|
+
}
|
|
143
|
+
})
|
|
144
|
+
}, /*#__PURE__*/React.createElement(React.Fragment, null, renderBackImage(), renderLabel()));
|
|
145
|
+
}
|
|
146
|
+
|
|
147
|
+
const styles = _reactNative.StyleSheet.create({
|
|
148
|
+
container: {
|
|
149
|
+
alignItems: 'center',
|
|
150
|
+
flexDirection: 'row',
|
|
151
|
+
minWidth: _reactNative.StyleSheet.hairlineWidth,
|
|
152
|
+
// Avoid collapsing when title is long
|
|
153
|
+
..._reactNative.Platform.select({
|
|
154
|
+
ios: null,
|
|
155
|
+
default: {
|
|
156
|
+
marginVertical: 3,
|
|
157
|
+
marginHorizontal: 11
|
|
158
|
+
}
|
|
159
|
+
})
|
|
160
|
+
},
|
|
161
|
+
disabled: {
|
|
162
|
+
opacity: 0.5
|
|
163
|
+
},
|
|
164
|
+
label: {
|
|
165
|
+
fontSize: 17,
|
|
166
|
+
// Title and back label are a bit different width due to title being bold
|
|
167
|
+
// Adjusting the letterSpacing makes them coincide better
|
|
168
|
+
letterSpacing: 0.35
|
|
169
|
+
},
|
|
170
|
+
labelWrapper: {
|
|
171
|
+
// These styles will make sure that the label doesn't fill the available space
|
|
172
|
+
// Otherwise it messes with the measurement of the label
|
|
173
|
+
flexDirection: 'row',
|
|
174
|
+
alignItems: 'flex-start'
|
|
175
|
+
},
|
|
176
|
+
icon: _reactNative.Platform.select({
|
|
177
|
+
ios: {
|
|
178
|
+
height: 21,
|
|
179
|
+
width: 13,
|
|
180
|
+
marginLeft: 8,
|
|
181
|
+
marginRight: 22,
|
|
182
|
+
marginVertical: 12,
|
|
183
|
+
resizeMode: 'contain',
|
|
184
|
+
transform: [{
|
|
185
|
+
scaleX: _reactNative.I18nManager.isRTL ? -1 : 1
|
|
186
|
+
}]
|
|
187
|
+
},
|
|
188
|
+
default: {
|
|
189
|
+
height: 24,
|
|
190
|
+
width: 24,
|
|
191
|
+
margin: 3,
|
|
192
|
+
resizeMode: 'contain',
|
|
193
|
+
transform: [{
|
|
194
|
+
scaleX: _reactNative.I18nManager.isRTL ? -1 : 1
|
|
195
|
+
}]
|
|
196
|
+
}
|
|
197
|
+
}),
|
|
198
|
+
iconWithLabel: _reactNative.Platform.OS === 'ios' ? {
|
|
199
|
+
marginRight: 6
|
|
200
|
+
} : {},
|
|
201
|
+
iconMaskContainer: {
|
|
202
|
+
flex: 1,
|
|
203
|
+
flexDirection: 'row',
|
|
204
|
+
justifyContent: 'center'
|
|
205
|
+
},
|
|
206
|
+
iconMaskFillerRect: {
|
|
207
|
+
flex: 1,
|
|
208
|
+
backgroundColor: '#000'
|
|
209
|
+
},
|
|
210
|
+
iconMask: {
|
|
211
|
+
height: 21,
|
|
212
|
+
width: 13,
|
|
213
|
+
marginLeft: -14.5,
|
|
214
|
+
marginVertical: 12,
|
|
215
|
+
alignSelf: 'center',
|
|
216
|
+
resizeMode: 'contain',
|
|
217
|
+
transform: [{
|
|
218
|
+
scaleX: _reactNative.I18nManager.isRTL ? -1 : 1
|
|
219
|
+
}]
|
|
220
|
+
}
|
|
221
|
+
});
|
|
222
|
+
//# sourceMappingURL=HeaderBackButton.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["HeaderBackButton.tsx"],"names":["HeaderBackButton","disabled","allowFontScaling","backImage","label","labelStyle","labelVisible","onLabelLayout","onPress","pressColor","pressOpacity","screenLayout","tintColor","customTintColor","titleLayout","truncatedLabel","accessibilityLabel","testID","style","colors","initialLabelWidth","setInitialLabelWidth","React","useState","undefined","Platform","select","ios","primary","default","text","handleLabelLayout","e","nativeEvent","layout","x","width","shouldTruncateLabel","renderBackImage","styles","icon","Boolean","iconWithLabel","require","renderLabel","leftLabelText","labelElement","labelWrapper","minWidth","color","OS","iconMaskContainer","iconMask","iconMaskFillerRect","handlePress","requestAnimationFrame","borderless","container","top","right","bottom","left","StyleSheet","create","alignItems","flexDirection","hairlineWidth","marginVertical","marginHorizontal","opacity","fontSize","letterSpacing","height","marginLeft","marginRight","resizeMode","transform","scaleX","I18nManager","isRTL","margin","flex","justifyContent","backgroundColor","alignSelf"],"mappings":"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","sourcesContent":["import { useTheme } from '@react-navigation/native';\nimport * as React from 'react';\nimport {\n Animated,\n I18nManager,\n Image,\n LayoutChangeEvent,\n Platform,\n StyleSheet,\n View,\n} from 'react-native';\n\nimport MaskedView from '../MaskedView';\nimport PlatformPressable from '../PlatformPressable';\nimport type { HeaderBackButtonProps } from '../types';\n\nexport default function HeaderBackButton({\n disabled,\n allowFontScaling,\n backImage,\n label,\n labelStyle,\n labelVisible,\n onLabelLayout,\n onPress,\n pressColor,\n pressOpacity,\n screenLayout,\n tintColor: customTintColor,\n titleLayout,\n truncatedLabel = 'Back',\n accessibilityLabel = label && label !== 'Back' ? `${label}, back` : 'Go back',\n testID,\n style,\n}: HeaderBackButtonProps) {\n const { colors } = useTheme();\n\n const [initialLabelWidth, setInitialLabelWidth] =\n React.useState<undefined | number>(undefined);\n\n const tintColor =\n customTintColor !== undefined\n ? customTintColor\n : Platform.select({\n ios: colors.primary,\n default: colors.text,\n });\n\n const handleLabelLayout = (e: LayoutChangeEvent) => {\n onLabelLayout?.(e);\n\n setInitialLabelWidth(e.nativeEvent.layout.x + e.nativeEvent.layout.width);\n };\n\n const shouldTruncateLabel = () => {\n return (\n !label ||\n (initialLabelWidth &&\n titleLayout &&\n screenLayout &&\n (screenLayout.width - titleLayout.width) / 2 < initialLabelWidth + 26)\n );\n };\n\n const renderBackImage = () => {\n if (backImage) {\n return backImage({ tintColor });\n } else {\n return (\n <Image\n style={[\n styles.icon,\n Boolean(labelVisible) && styles.iconWithLabel,\n Boolean(tintColor) && { tintColor },\n ]}\n source={require('../assets/back-icon.png')}\n fadeDuration={0}\n />\n );\n }\n };\n\n const renderLabel = () => {\n const leftLabelText = shouldTruncateLabel() ? truncatedLabel : label;\n\n if (!labelVisible || leftLabelText === undefined) {\n return null;\n }\n\n const labelElement = (\n <View\n style={\n screenLayout\n ? // We make the button extend till the middle of the screen\n // Otherwise it appears to cut off when translating\n [styles.labelWrapper, { minWidth: screenLayout.width / 2 - 27 }]\n : null\n }\n >\n <Animated.Text\n accessible={false}\n onLayout={\n // This measurement is used to determine if we should truncate the label when it doesn't fit\n // Only measure it when label is not truncated because we want the measurement of full label\n leftLabelText === label ? handleLabelLayout : undefined\n }\n style={[\n styles.label,\n tintColor ? { color: tintColor } : null,\n labelStyle,\n ]}\n numberOfLines={1}\n allowFontScaling={!!allowFontScaling}\n >\n {leftLabelText}\n </Animated.Text>\n </View>\n );\n\n if (backImage || Platform.OS !== 'ios') {\n // When a custom backimage is specified, we can't mask the label\n // Otherwise there might be weird effect due to our mask not being the same as the image\n return labelElement;\n }\n\n return (\n <MaskedView\n maskElement={\n <View style={styles.iconMaskContainer}>\n <Image\n source={require('../assets/back-icon-mask.png')}\n style={styles.iconMask}\n />\n <View style={styles.iconMaskFillerRect} />\n </View>\n }\n >\n {labelElement}\n </MaskedView>\n );\n };\n\n const handlePress = () => onPress && requestAnimationFrame(onPress);\n\n return (\n <PlatformPressable\n disabled={disabled}\n accessible\n accessibilityRole=\"button\"\n accessibilityLabel={accessibilityLabel}\n testID={testID}\n onPress={disabled ? undefined : handlePress}\n pressColor={pressColor}\n pressOpacity={pressOpacity}\n android_ripple={{ borderless: true }}\n style={[styles.container, disabled && styles.disabled, style]}\n hitSlop={Platform.select({\n ios: undefined,\n default: { top: 16, right: 16, bottom: 16, left: 16 },\n })}\n >\n <React.Fragment>\n {renderBackImage()}\n {renderLabel()}\n </React.Fragment>\n </PlatformPressable>\n );\n}\n\nconst styles = StyleSheet.create({\n container: {\n alignItems: 'center',\n flexDirection: 'row',\n minWidth: StyleSheet.hairlineWidth, // Avoid collapsing when title is long\n ...Platform.select({\n ios: null,\n default: {\n marginVertical: 3,\n marginHorizontal: 11,\n },\n }),\n },\n disabled: {\n opacity: 0.5,\n },\n label: {\n fontSize: 17,\n // Title and back label are a bit different width due to title being bold\n // Adjusting the letterSpacing makes them coincide better\n letterSpacing: 0.35,\n },\n labelWrapper: {\n // These styles will make sure that the label doesn't fill the available space\n // Otherwise it messes with the measurement of the label\n flexDirection: 'row',\n alignItems: 'flex-start',\n },\n icon: Platform.select({\n ios: {\n height: 21,\n width: 13,\n marginLeft: 8,\n marginRight: 22,\n marginVertical: 12,\n resizeMode: 'contain',\n transform: [{ scaleX: I18nManager.isRTL ? -1 : 1 }],\n },\n default: {\n height: 24,\n width: 24,\n margin: 3,\n resizeMode: 'contain',\n transform: [{ scaleX: I18nManager.isRTL ? -1 : 1 }],\n },\n }),\n iconWithLabel:\n Platform.OS === 'ios'\n ? {\n marginRight: 6,\n }\n : {},\n iconMaskContainer: {\n flex: 1,\n flexDirection: 'row',\n justifyContent: 'center',\n },\n iconMaskFillerRect: {\n flex: 1,\n backgroundColor: '#000',\n },\n iconMask: {\n height: 21,\n width: 13,\n marginLeft: -14.5,\n marginVertical: 12,\n alignSelf: 'center',\n resizeMode: 'contain',\n transform: [{ scaleX: I18nManager.isRTL ? -1 : 1 }],\n },\n});\n"]}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
|
|
8
|
+
var _getNamedContext = _interopRequireDefault(require("../getNamedContext"));
|
|
9
|
+
|
|
10
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
11
|
+
|
|
12
|
+
const HeaderBackContext = (0, _getNamedContext.default)('HeaderBackContext', undefined);
|
|
13
|
+
var _default = HeaderBackContext;
|
|
14
|
+
exports.default = _default;
|
|
15
|
+
//# sourceMappingURL=HeaderBackContext.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["HeaderBackContext.tsx"],"names":["HeaderBackContext","undefined"],"mappings":";;;;;;;AAAA;;;;AAEA,MAAMA,iBAAiB,GAAG,8BACxB,mBADwB,EAExBC,SAFwB,CAA1B;eAKeD,iB","sourcesContent":["import getNamedContext from '../getNamedContext';\n\nconst HeaderBackContext = getNamedContext<{ title: string } | undefined>(\n 'HeaderBackContext',\n undefined\n);\n\nexport default HeaderBackContext;\n"]}
|