react-native-screens 3.7.2 → 3.10.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.
Files changed (83) hide show
  1. package/README.md +69 -3
  2. package/android/build.gradle +8 -7
  3. package/android/src/main/java/com/swmansion/rnscreens/CustomSearchView.kt +71 -0
  4. package/android/src/main/java/com/swmansion/rnscreens/CustomToolbar.kt +7 -0
  5. package/android/src/main/java/com/swmansion/rnscreens/FragmentBackPressOverrider.kt +29 -0
  6. package/android/src/main/java/com/swmansion/rnscreens/RNScreensPackage.kt +2 -1
  7. package/android/src/main/java/com/swmansion/rnscreens/Screen.kt +7 -41
  8. package/android/src/main/java/com/swmansion/rnscreens/ScreenContainer.kt +55 -40
  9. package/android/src/main/java/com/swmansion/rnscreens/ScreenFragment.kt +19 -1
  10. package/android/src/main/java/com/swmansion/rnscreens/ScreenStack.kt +30 -101
  11. package/android/src/main/java/com/swmansion/rnscreens/ScreenStackFragment.kt +76 -14
  12. package/android/src/main/java/com/swmansion/rnscreens/ScreenStackHeaderConfig.kt +13 -4
  13. package/android/src/main/java/com/swmansion/rnscreens/ScreenStackHeaderConfigViewManager.kt +8 -0
  14. package/android/src/main/java/com/swmansion/rnscreens/ScreenStackHeaderSubview.kt +7 -1
  15. package/android/src/main/java/com/swmansion/rnscreens/ScreenStackHeaderSubviewManager.kt +1 -0
  16. package/android/src/main/java/com/swmansion/rnscreens/SearchBarManager.kt +90 -0
  17. package/android/src/main/java/com/swmansion/rnscreens/SearchBarView.kt +150 -0
  18. package/android/src/main/java/com/swmansion/rnscreens/SearchViewFormatter.kt +40 -0
  19. package/ios/RNSScreen.h +1 -0
  20. package/ios/RNSScreen.m +35 -0
  21. package/ios/RNSScreenContainer.h +2 -0
  22. package/ios/RNSScreenStack.m +24 -6
  23. package/ios/RNSScreenStackHeaderConfig.m +45 -2
  24. package/ios/RNSScreenWindowTraits.h +5 -0
  25. package/ios/RNSScreenWindowTraits.m +29 -0
  26. package/lib/commonjs/index.js +24 -1
  27. package/lib/commonjs/index.js.map +1 -1
  28. package/lib/commonjs/index.native.js +103 -17
  29. package/lib/commonjs/index.native.js.map +1 -1
  30. package/lib/commonjs/native-stack/utils/useBackPressSubscription.js +67 -0
  31. package/lib/commonjs/native-stack/utils/useBackPressSubscription.js.map +1 -0
  32. package/lib/commonjs/native-stack/views/HeaderConfig.js +46 -4
  33. package/lib/commonjs/native-stack/views/HeaderConfig.js.map +1 -1
  34. package/lib/commonjs/reanimated/ReanimatedNativeStackScreen.js +60 -0
  35. package/lib/commonjs/reanimated/ReanimatedNativeStackScreen.js.map +1 -0
  36. package/lib/commonjs/reanimated/ReanimatedScreen.js +7 -79
  37. package/lib/commonjs/reanimated/ReanimatedScreen.js.map +1 -1
  38. package/lib/commonjs/reanimated/ReanimatedScreenProvider.js +61 -0
  39. package/lib/commonjs/reanimated/ReanimatedScreenProvider.js.map +1 -0
  40. package/lib/commonjs/reanimated/index.js +2 -2
  41. package/lib/commonjs/reanimated/index.js.map +1 -1
  42. package/lib/commonjs/utils.js +20 -0
  43. package/lib/commonjs/utils.js.map +1 -0
  44. package/lib/module/index.js +5 -0
  45. package/lib/module/index.js.map +1 -1
  46. package/lib/module/index.native.js +99 -19
  47. package/lib/module/index.native.js.map +1 -1
  48. package/lib/module/native-stack/utils/useBackPressSubscription.js +50 -0
  49. package/lib/module/native-stack/utils/useBackPressSubscription.js.map +1 -0
  50. package/lib/module/native-stack/views/HeaderConfig.js +46 -5
  51. package/lib/module/native-stack/views/HeaderConfig.js.map +1 -1
  52. package/lib/module/reanimated/ReanimatedNativeStackScreen.js +40 -0
  53. package/lib/module/reanimated/ReanimatedNativeStackScreen.js.map +1 -0
  54. package/lib/module/reanimated/ReanimatedScreen.js +6 -73
  55. package/lib/module/reanimated/ReanimatedScreen.js.map +1 -1
  56. package/lib/module/reanimated/ReanimatedScreenProvider.js +49 -0
  57. package/lib/module/reanimated/ReanimatedScreenProvider.js.map +1 -0
  58. package/lib/module/reanimated/index.js +1 -1
  59. package/lib/module/reanimated/index.js.map +1 -1
  60. package/lib/module/utils.js +8 -0
  61. package/lib/module/utils.js.map +1 -0
  62. package/lib/typescript/index.d.ts +2 -0
  63. package/lib/typescript/native-stack/types.d.ts +0 -2
  64. package/lib/typescript/native-stack/utils/useBackPressSubscription.d.ts +16 -0
  65. package/lib/typescript/reanimated/ReanimatedNativeStackScreen.d.ts +5 -0
  66. package/lib/typescript/reanimated/ReanimatedScreen.d.ts +5 -2
  67. package/lib/typescript/reanimated/ReanimatedScreenProvider.d.ts +2 -0
  68. package/lib/typescript/reanimated/index.d.ts +1 -1
  69. package/lib/typescript/types.d.ts +46 -1
  70. package/lib/typescript/utils.d.ts +2 -0
  71. package/native-stack/README.md +35 -7
  72. package/package.json +5 -2
  73. package/src/index.native.tsx +138 -43
  74. package/src/index.tsx +10 -0
  75. package/src/native-stack/types.tsx +0 -2
  76. package/src/native-stack/utils/useBackPressSubscription.tsx +66 -0
  77. package/src/native-stack/views/HeaderConfig.tsx +46 -3
  78. package/src/reanimated/ReanimatedNativeStackScreen.tsx +61 -0
  79. package/src/reanimated/ReanimatedScreen.tsx +6 -84
  80. package/src/reanimated/ReanimatedScreenProvider.tsx +42 -0
  81. package/src/reanimated/index.tsx +1 -1
  82. package/src/types.tsx +46 -1
  83. package/src/utils.ts +12 -0
@@ -1,83 +1,16 @@
1
1
  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); }
2
2
 
3
- function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
4
-
5
3
  import React from 'react';
6
- import { Platform } from 'react-native';
7
- import { Screen, ScreenContext } from 'react-native-screens'; // @ts-ignore file to be used only if `react-native-reanimated` available in the project
4
+ import { Screen } from 'react-native-screens'; // @ts-ignore file to be used only if `react-native-reanimated` available in the project
8
5
 
9
- import Animated, { useEvent, useSharedValue } from 'react-native-reanimated';
10
- import ReanimatedTransitionProgressContext from './ReanimatedTransitionProgressContext';
6
+ import Animated from 'react-native-reanimated';
11
7
  const AnimatedScreen = Animated.createAnimatedComponent(Screen);
12
-
13
- class ReanimatedScreenWrapper extends React.Component {
14
- constructor(...args) {
15
- super(...args);
16
-
17
- _defineProperty(this, "ref", null);
18
-
19
- _defineProperty(this, "setRef", ref => {
20
- var _this$props$onCompone, _this$props;
21
-
22
- this.ref = ref;
23
- (_this$props$onCompone = (_this$props = this.props).onComponentRef) === null || _this$props$onCompone === void 0 ? void 0 : _this$props$onCompone.call(_this$props, ref);
24
- });
25
- }
26
-
27
- setNativeProps(props) {
28
- var _this$ref;
29
-
30
- (_this$ref = this.ref) === null || _this$ref === void 0 ? void 0 : _this$ref.setNativeProps(props);
31
- }
32
-
33
- render() {
34
- return /*#__PURE__*/React.createElement(ReanimatedScreen, _extends({}, this.props, {
35
- // @ts-ignore some problems with ref
36
- ref: this.setRef
37
- }));
38
- }
39
-
40
- }
41
-
42
8
  const ReanimatedScreen = /*#__PURE__*/React.forwardRef((props, ref) => {
43
- const {
44
- children,
45
- ...rest
46
- } = props;
47
- const progress = useSharedValue(0);
48
- const closing = useSharedValue(0);
49
- const goingForward = useSharedValue(0);
50
9
  return /*#__PURE__*/React.createElement(AnimatedScreen // @ts-ignore some problems with ref and onTransitionProgressReanimated being "fake" prop for parsing of `useEvent` return value
51
10
  , _extends({
52
- ref: ref // ReanimatedScreen.tsx should only be used by Screens of native-stack, but it always better to check
53
- ,
54
- onTransitionProgressReanimated: !props.isNativeStack ? undefined : useEvent(event => {
55
- 'worklet';
56
-
57
- progress.value = event.progress;
58
- closing.value = event.closing;
59
- goingForward.value = event.goingForward;
60
- }, [// This should not be necessary, but is not properly managed by `react-native-reanimated`
61
- // @ts-ignore wrong type
62
- Platform.OS === 'android' ? 'onTransitionProgress' : 'topTransitionProgress'])
63
- }, rest), !props.isNativeStack ? // see comment of this prop in types.tsx for information why it is needed
64
- children : /*#__PURE__*/React.createElement(ReanimatedTransitionProgressContext.Provider, {
65
- value: {
66
- progress: progress,
67
- closing: closing,
68
- goingForward: goingForward
69
- }
70
- }, children));
71
- }); // used to silence error "Component definition is missing display name"
72
-
11
+ ref: ref
12
+ }, props));
13
+ });
73
14
  ReanimatedScreen.displayName = 'ReanimatedScreen';
74
- export default function ReanimatedScreenProvider(props) {
75
- return (
76
- /*#__PURE__*/
77
- // eslint-disable-next-line @typescript-eslint/no-explicit-any
78
- React.createElement(ScreenContext.Provider, {
79
- value: ReanimatedScreenWrapper
80
- }, props.children)
81
- );
82
- }
15
+ export default ReanimatedScreen;
83
16
  //# sourceMappingURL=ReanimatedScreen.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["ReanimatedScreen.tsx"],"names":["React","Platform","Screen","ScreenContext","Animated","useEvent","useSharedValue","ReanimatedTransitionProgressContext","AnimatedScreen","createAnimatedComponent","ReanimatedScreenWrapper","Component","ref","props","onComponentRef","setNativeProps","render","setRef","ReanimatedScreen","forwardRef","children","rest","progress","closing","goingForward","isNativeStack","undefined","event","value","OS","displayName","ReanimatedScreenProvider"],"mappings":";;;;AAAA,OAAOA,KAAP,MAAyC,OAAzC;AACA,SAASC,QAAT,QAA+B,cAA/B;AACA,SACEC,MADF,EAGEC,aAHF,QAKO,sBALP,C,CAOA;;AACA,OAAOC,QAAP,IAAmBC,QAAnB,EAA6BC,cAA7B,QAAmD,yBAAnD;AACA,OAAOC,mCAAP,MAAgD,uCAAhD;AAEA,MAAMC,cAAc,GAAGJ,QAAQ,CAACK,uBAAT,CACpBP,MADoB,CAAvB;;AAIA,MAAMQ,uBAAN,SAAsCV,KAAK,CAACW,SAA5C,CAAmE;AAAA;AAAA;;AAAA,iCACb,IADa;;AAAA,oCAOvDC,GAAD,IAAqD;AAAA;;AAC5D,WAAKA,GAAL,GAAWA,GAAX;AACA,mDAAKC,KAAL,EAAWC,cAAX,kGAA4BF,GAA5B;AACD,KAVgE;AAAA;;AAGjEG,EAAAA,cAAc,CAACF,KAAD,EAA2B;AAAA;;AACvC,sBAAKD,GAAL,wDAAUG,cAAV,CAAyBF,KAAzB;AACD;;AAODG,EAAAA,MAAM,GAAG;AACP,wBACE,oBAAC,gBAAD,eACM,KAAKH,KADX;AAEE;AACA,MAAA,GAAG,EAAE,KAAKI;AAHZ,OADF;AAOD;;AApBgE;;AAuBnE,MAAMC,gBAAgB,gBAAGlB,KAAK,CAACmB,UAAN,CACvB,CAACN,KAAD,EAAQD,GAAR,KAAgB;AACd,QAAM;AAAEQ,IAAAA,QAAF;AAAY,OAAGC;AAAf,MAAwBR,KAA9B;AAEA,QAAMS,QAAQ,GAAGhB,cAAc,CAAC,CAAD,CAA/B;AACA,QAAMiB,OAAO,GAAGjB,cAAc,CAAC,CAAD,CAA9B;AACA,QAAMkB,YAAY,GAAGlB,cAAc,CAAC,CAAD,CAAnC;AAEA,sBACE,oBAAC,cAAD,CACE;AADF;AAEE,IAAA,GAAG,EAAEM,GAFP,CAGE;AAHF;AAIE,IAAA,8BAA8B,EAC5B,CAACC,KAAK,CAACY,aAAP,GACIC,SADJ,GAEIrB,QAAQ,CACLsB,KAAD,IAAwC;AACtC;;AACAL,MAAAA,QAAQ,CAACM,KAAT,GAAiBD,KAAK,CAACL,QAAvB;AACAC,MAAAA,OAAO,CAACK,KAAR,GAAgBD,KAAK,CAACJ,OAAtB;AACAC,MAAAA,YAAY,CAACI,KAAb,GAAqBD,KAAK,CAACH,YAA3B;AACD,KANK,EAON,CACE;AACA;AACAvB,IAAAA,QAAQ,CAAC4B,EAAT,KAAgB,SAAhB,GACI,sBADJ,GAEI,uBALN,CAPM;AAPhB,KAuBMR,IAvBN,GAwBG,CAACR,KAAK,CAACY,aAAP,GAAyB;AACxBL,EAAAA,QADD,gBAGC,oBAAC,mCAAD,CAAqC,QAArC;AACE,IAAA,KAAK,EAAE;AACLE,MAAAA,QAAQ,EAAEA,QADL;AAELC,MAAAA,OAAO,EAAEA,OAFJ;AAGLC,MAAAA,YAAY,EAAEA;AAHT;AADT,KAMGJ,QANH,CA3BJ,CADF;AAuCD,CA/CsB,CAAzB,C,CAkDA;;AACAF,gBAAgB,CAACY,WAAjB,GAA+B,kBAA/B;AAEA,eAAe,SAASC,wBAAT,CACblB,KADa,EAEb;AACA;AAAA;AACE;AACA,wBAAC,aAAD,CAAe,QAAf;AAAwB,MAAA,KAAK,EAAEH;AAA/B,OACGG,KAAK,CAACO,QADT;AAFF;AAMD","sourcesContent":["import React, { PropsWithChildren } from 'react';\nimport { Platform, View } from 'react-native';\nimport {\n Screen,\n ScreenProps,\n ScreenContext,\n TransitionProgressEventType,\n} from 'react-native-screens';\n\n// @ts-ignore file to be used only if `react-native-reanimated` available in the project\nimport Animated, { useEvent, useSharedValue } from 'react-native-reanimated';\nimport ReanimatedTransitionProgressContext from './ReanimatedTransitionProgressContext';\n\nconst AnimatedScreen = Animated.createAnimatedComponent(\n (Screen as unknown) as React.ComponentClass\n);\n\nclass ReanimatedScreenWrapper extends React.Component<ScreenProps> {\n private ref: React.ElementRef<typeof View> | null = null;\n\n setNativeProps(props: ScreenProps): void {\n this.ref?.setNativeProps(props);\n }\n\n setRef = (ref: React.ElementRef<typeof View> | null): void => {\n this.ref = ref;\n this.props.onComponentRef?.(ref);\n };\n\n render() {\n return (\n <ReanimatedScreen\n {...this.props}\n // @ts-ignore some problems with ref\n ref={this.setRef}\n />\n );\n }\n}\n\nconst ReanimatedScreen = React.forwardRef<typeof AnimatedScreen, ScreenProps>(\n (props, ref) => {\n const { children, ...rest } = props;\n\n const progress = useSharedValue(0);\n const closing = useSharedValue(0);\n const goingForward = useSharedValue(0);\n\n return (\n <AnimatedScreen\n // @ts-ignore some problems with ref and onTransitionProgressReanimated being \"fake\" prop for parsing of `useEvent` return value\n ref={ref}\n // ReanimatedScreen.tsx should only be used by Screens of native-stack, but it always better to check\n onTransitionProgressReanimated={\n !props.isNativeStack\n ? undefined\n : useEvent(\n (event: TransitionProgressEventType) => {\n 'worklet';\n progress.value = event.progress;\n closing.value = event.closing;\n goingForward.value = event.goingForward;\n },\n [\n // This should not be necessary, but is not properly managed by `react-native-reanimated`\n // @ts-ignore wrong type\n Platform.OS === 'android'\n ? 'onTransitionProgress'\n : 'topTransitionProgress',\n ]\n )\n }\n {...rest}>\n {!props.isNativeStack ? ( // see comment of this prop in types.tsx for information why it is needed\n children\n ) : (\n <ReanimatedTransitionProgressContext.Provider\n value={{\n progress: progress,\n closing: closing,\n goingForward: goingForward,\n }}>\n {children}\n </ReanimatedTransitionProgressContext.Provider>\n )}\n </AnimatedScreen>\n );\n }\n);\n\n// used to silence error \"Component definition is missing display name\"\nReanimatedScreen.displayName = 'ReanimatedScreen';\n\nexport default function ReanimatedScreenProvider(\n props: PropsWithChildren<unknown>\n) {\n return (\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n <ScreenContext.Provider value={ReanimatedScreenWrapper as any}>\n {props.children}\n </ScreenContext.Provider>\n );\n}\n"]}
1
+ {"version":3,"sources":["ReanimatedScreen.tsx"],"names":["React","Screen","Animated","AnimatedScreen","createAnimatedComponent","ReanimatedScreen","forwardRef","props","ref","displayName"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,MAAT,QAAoC,sBAApC,C,CAEA;;AACA,OAAOC,QAAP,MAAqB,yBAArB;AAEA,MAAMC,cAAc,GAAGD,QAAQ,CAACE,uBAAT,CACpBH,MADoB,CAAvB;AAIA,MAAMI,gBAAgB,gBAAGL,KAAK,CAACM,UAAN,CACvB,CAACC,KAAD,EAAQC,GAAR,KAAgB;AACd,sBACE,oBAAC,cAAD,CACE;AADF;AAEE,IAAA,GAAG,EAAEA;AAFP,KAGMD,KAHN,EADF;AAOD,CATsB,CAAzB;AAYAF,gBAAgB,CAACI,WAAjB,GAA+B,kBAA/B;AAEA,eAAeJ,gBAAf","sourcesContent":["import React from 'react';\nimport { Screen, ScreenProps } from 'react-native-screens';\n\n// @ts-ignore file to be used only if `react-native-reanimated` available in the project\nimport Animated from 'react-native-reanimated';\n\nconst AnimatedScreen = Animated.createAnimatedComponent(\n (Screen as unknown) as React.ComponentClass\n);\n\nconst ReanimatedScreen = React.forwardRef<typeof AnimatedScreen, ScreenProps>(\n (props, ref) => {\n return (\n <AnimatedScreen\n // @ts-ignore some problems with ref and onTransitionProgressReanimated being \"fake\" prop for parsing of `useEvent` return value\n ref={ref}\n {...props}\n />\n );\n }\n);\n\nReanimatedScreen.displayName = 'ReanimatedScreen';\n\nexport default ReanimatedScreen;\n"]}
@@ -0,0 +1,49 @@
1
+ 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); }
2
+
3
+ function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
4
+
5
+ import React from 'react';
6
+ import { ScreenContext } from 'react-native-screens';
7
+ import ReanimatedNativeStackScreen from './ReanimatedNativeStackScreen';
8
+ import AnimatedScreen from './ReanimatedScreen';
9
+
10
+ class ReanimatedScreenWrapper extends React.Component {
11
+ constructor(...args) {
12
+ super(...args);
13
+
14
+ _defineProperty(this, "ref", null);
15
+
16
+ _defineProperty(this, "setRef", ref => {
17
+ var _this$props$onCompone, _this$props;
18
+
19
+ this.ref = ref;
20
+ (_this$props$onCompone = (_this$props = this.props).onComponentRef) === null || _this$props$onCompone === void 0 ? void 0 : _this$props$onCompone.call(_this$props, ref);
21
+ });
22
+ }
23
+
24
+ setNativeProps(props) {
25
+ var _this$ref;
26
+
27
+ (_this$ref = this.ref) === null || _this$ref === void 0 ? void 0 : _this$ref.setNativeProps(props);
28
+ }
29
+
30
+ render() {
31
+ const ReanimatedScreen = this.props.isNativeStack ? ReanimatedNativeStackScreen : AnimatedScreen;
32
+ return /*#__PURE__*/React.createElement(ReanimatedScreen, _extends({}, this.props, {
33
+ // @ts-ignore some problems with ref
34
+ ref: this.setRef
35
+ }));
36
+ }
37
+
38
+ }
39
+
40
+ export default function ReanimatedScreenProvider(props) {
41
+ return (
42
+ /*#__PURE__*/
43
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
44
+ React.createElement(ScreenContext.Provider, {
45
+ value: ReanimatedScreenWrapper
46
+ }, props.children)
47
+ );
48
+ }
49
+ //# sourceMappingURL=ReanimatedScreenProvider.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["ReanimatedScreenProvider.tsx"],"names":["React","ScreenContext","ReanimatedNativeStackScreen","AnimatedScreen","ReanimatedScreenWrapper","Component","ref","props","onComponentRef","setNativeProps","render","ReanimatedScreen","isNativeStack","setRef","ReanimatedScreenProvider","children"],"mappings":";;;;AAAA,OAAOA,KAAP,MAAyC,OAAzC;AAEA,SAAsBC,aAAtB,QAA2C,sBAA3C;AACA,OAAOC,2BAAP,MAAwC,+BAAxC;AACA,OAAOC,cAAP,MAA2B,oBAA3B;;AAEA,MAAMC,uBAAN,SAAsCJ,KAAK,CAACK,SAA5C,CAAmE;AAAA;AAAA;;AAAA,iCACb,IADa;;AAAA,oCAOvDC,GAAD,IAAqD;AAAA;;AAC5D,WAAKA,GAAL,GAAWA,GAAX;AACA,mDAAKC,KAAL,EAAWC,cAAX,kGAA4BF,GAA5B;AACD,KAVgE;AAAA;;AAGjEG,EAAAA,cAAc,CAACF,KAAD,EAA2B;AAAA;;AACvC,sBAAKD,GAAL,wDAAUG,cAAV,CAAyBF,KAAzB;AACD;;AAODG,EAAAA,MAAM,GAAG;AACP,UAAMC,gBAAgB,GAAG,KAAKJ,KAAL,CAAWK,aAAX,GACrBV,2BADqB,GAErBC,cAFJ;AAGA,wBACE,oBAAC,gBAAD,eACM,KAAKI,KADX;AAEE;AACA,MAAA,GAAG,EAAE,KAAKM;AAHZ,OADF;AAOD;;AAvBgE;;AA0BnE,eAAe,SAASC,wBAAT,CACbP,KADa,EAEb;AACA;AAAA;AACE;AACA,wBAAC,aAAD,CAAe,QAAf;AAAwB,MAAA,KAAK,EAAEH;AAA/B,OACGG,KAAK,CAACQ,QADT;AAFF;AAMD","sourcesContent":["import React, { PropsWithChildren } from 'react';\nimport { View } from 'react-native';\nimport { ScreenProps, ScreenContext } from 'react-native-screens';\nimport ReanimatedNativeStackScreen from './ReanimatedNativeStackScreen';\nimport AnimatedScreen from './ReanimatedScreen';\n\nclass ReanimatedScreenWrapper extends React.Component<ScreenProps> {\n private ref: React.ElementRef<typeof View> | null = null;\n\n setNativeProps(props: ScreenProps): void {\n this.ref?.setNativeProps(props);\n }\n\n setRef = (ref: React.ElementRef<typeof View> | null): void => {\n this.ref = ref;\n this.props.onComponentRef?.(ref);\n };\n\n render() {\n const ReanimatedScreen = this.props.isNativeStack\n ? ReanimatedNativeStackScreen\n : AnimatedScreen;\n return (\n <ReanimatedScreen\n {...this.props}\n // @ts-ignore some problems with ref\n ref={this.setRef}\n />\n );\n }\n}\n\nexport default function ReanimatedScreenProvider(\n props: PropsWithChildren<unknown>\n) {\n return (\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n <ScreenContext.Provider value={ReanimatedScreenWrapper as any}>\n {props.children}\n </ScreenContext.Provider>\n );\n}\n"]}
@@ -1,3 +1,3 @@
1
- export { default as ReanimatedScreenProvider } from './ReanimatedScreen';
1
+ export { default as ReanimatedScreenProvider } from './ReanimatedScreenProvider';
2
2
  export { default as useReanimatedTransitionProgress } from './useReanimatedTransitionProgress';
3
3
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["index.tsx"],"names":["default","ReanimatedScreenProvider","useReanimatedTransitionProgress"],"mappings":"AAAA,SAASA,OAAO,IAAIC,wBAApB,QAAoD,oBAApD;AACA,SAASD,OAAO,IAAIE,+BAApB,QAA2D,mCAA3D","sourcesContent":["export { default as ReanimatedScreenProvider } from './ReanimatedScreen';\nexport { default as useReanimatedTransitionProgress } from './useReanimatedTransitionProgress';\n"]}
1
+ {"version":3,"sources":["index.tsx"],"names":["default","ReanimatedScreenProvider","useReanimatedTransitionProgress"],"mappings":"AAAA,SAASA,OAAO,IAAIC,wBAApB,QAAoD,4BAApD;AACA,SAASD,OAAO,IAAIE,+BAApB,QAA2D,mCAA3D","sourcesContent":["export { default as ReanimatedScreenProvider } from './ReanimatedScreenProvider';\nexport { default as useReanimatedTransitionProgress } from './useReanimatedTransitionProgress';\n"]}
@@ -0,0 +1,8 @@
1
+ import { BackHandler, Platform } from 'react-native';
2
+ export const isSearchBarAvailableForCurrentPlatform = ['ios', 'android'].includes(Platform.OS);
3
+ export function executeNativeBackPress() {
4
+ // This function invokes the native back press event
5
+ BackHandler.exitApp();
6
+ return true;
7
+ }
8
+ //# sourceMappingURL=utils.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["utils.ts"],"names":["BackHandler","Platform","isSearchBarAvailableForCurrentPlatform","includes","OS","executeNativeBackPress","exitApp"],"mappings":"AAAA,SAASA,WAAT,EAAsBC,QAAtB,QAAsC,cAAtC;AAEA,OAAO,MAAMC,sCAAsC,GAAG,CACpD,KADoD,EAEpD,SAFoD,EAGpDC,QAHoD,CAG3CF,QAAQ,CAACG,EAHkC,CAA/C;AAKP,OAAO,SAASC,sBAAT,GAAkC;AACvC;AACAL,EAAAA,WAAW,CAACM,OAAZ;AACA,SAAO,IAAP;AACD","sourcesContent":["import { BackHandler, Platform } from 'react-native';\n\nexport const isSearchBarAvailableForCurrentPlatform = [\n 'ios',\n 'android',\n].includes(Platform.OS);\n\nexport function executeNativeBackPress() {\n // This function invokes the native back press event\n BackHandler.exitApp();\n return true;\n}\n"]}
@@ -3,8 +3,10 @@ import { Animated, View, ViewProps, ImageProps } from 'react-native';
3
3
  import { ScreenProps, ScreenContainerProps, ScreenStackProps, ScreenStackHeaderConfigProps, HeaderSubviewTypes, SearchBarProps } from './types';
4
4
  export * from './types';
5
5
  export { default as useTransitionProgress } from './useTransitionProgress';
6
+ export { isSearchBarAvailableForCurrentPlatform, executeNativeBackPress, } from './utils';
6
7
  export declare function enableScreens(shouldEnableScreens?: boolean): void;
7
8
  export declare function screensEnabled(): boolean;
9
+ export declare function enableFreeze(shouldEnableReactFreeze?: boolean): void;
8
10
  export declare class NativeScreen extends React.Component<ScreenProps> {
9
11
  render(): JSX.Element;
10
12
  }
@@ -253,8 +253,6 @@ export declare type NativeStackNavigationOptions = {
253
253
  screenOrientation?: ScreenProps['screenOrientation'];
254
254
  /**
255
255
  * Object in which you should pass props in order to render native iOS searchBar.
256
- *
257
- * @platform ios
258
256
  */
259
257
  searchBar?: SearchBarProps;
260
258
  /**
@@ -0,0 +1,16 @@
1
+ interface Args {
2
+ onBackPress: () => boolean;
3
+ isDisabled: boolean;
4
+ }
5
+ interface UseBackPressSubscription {
6
+ handleAttached: () => void;
7
+ handleDetached: () => void;
8
+ createSubscription: () => void;
9
+ clearSubscription: () => void;
10
+ }
11
+ /**
12
+ * This hook is an abstraction for keeping back press subscription
13
+ * logic in one place.
14
+ */
15
+ export declare function useBackPressSubscription({ onBackPress, isDisabled, }: Args): UseBackPressSubscription;
16
+ export {};
@@ -0,0 +1,5 @@
1
+ import React from 'react';
2
+ import { ScreenProps } from 'react-native-screens';
3
+ import Animated from 'react-native-reanimated';
4
+ declare const ReanimatedNativeStackScreen: React.ForwardRefExoticComponent<Pick<ScreenProps, "children" | "active" | "activityState" | "customAnimationOnSwipe" | "enabled" | "isNativeStack" | "fullScreenSwipeEnabled" | "gestureEnabled" | "nativeBackButtonDismissalEnabled" | "onAppear" | "onComponentRef" | "onDisappear" | "onDismissed" | "onHeaderBackButtonClicked" | "onTransitionProgress" | "onWillAppear" | "onWillDisappear" | "replaceAnimation" | "screenOrientation" | "stackAnimation" | "stackPresentation" | "statusBarAnimation" | "statusBarColor" | "statusBarHidden" | "statusBarStyle" | "statusBarTranslucent" | "hitSlop" | "onLayout" | "pointerEvents" | "removeClippedSubviews" | "style" | "testID" | "nativeID" | "collapsable" | "needsOffscreenAlphaCompositing" | "renderToHardwareTextureAndroid" | "focusable" | "shouldRasterizeIOS" | "isTVSelectable" | "hasTVPreferredFocus" | "tvParallaxProperties" | "tvParallaxShiftDistanceX" | "tvParallaxShiftDistanceY" | "tvParallaxTiltAngle" | "tvParallaxMagnification" | "onStartShouldSetResponder" | "onMoveShouldSetResponder" | "onResponderEnd" | "onResponderGrant" | "onResponderReject" | "onResponderMove" | "onResponderRelease" | "onResponderStart" | "onResponderTerminationRequest" | "onResponderTerminate" | "onStartShouldSetResponderCapture" | "onMoveShouldSetResponderCapture" | "onTouchStart" | "onTouchMove" | "onTouchEnd" | "onTouchCancel" | "onTouchEndCapture" | "accessible" | "accessibilityActions" | "accessibilityLabel" | "accessibilityRole" | "accessibilityState" | "accessibilityHint" | "accessibilityValue" | "onAccessibilityAction" | "accessibilityComponentType" | "accessibilityLiveRegion" | "importantForAccessibility" | "accessibilityElementsHidden" | "accessibilityTraits" | "accessibilityViewIsModal" | "onAccessibilityEscape" | "onAccessibilityTap" | "onMagicTap" | "accessibilityIgnoresInvertColors"> & React.RefAttributes<React.ComponentClass<Animated.AnimateProps<{}>, any>>>;
5
+ export default ReanimatedNativeStackScreen;
@@ -1,2 +1,5 @@
1
- import { PropsWithChildren } from 'react';
2
- export default function ReanimatedScreenProvider(props: PropsWithChildren<unknown>): JSX.Element;
1
+ import React from 'react';
2
+ import { ScreenProps } from 'react-native-screens';
3
+ import Animated from 'react-native-reanimated';
4
+ declare const ReanimatedScreen: React.ForwardRefExoticComponent<Pick<ScreenProps, "children" | "active" | "activityState" | "customAnimationOnSwipe" | "enabled" | "isNativeStack" | "fullScreenSwipeEnabled" | "gestureEnabled" | "nativeBackButtonDismissalEnabled" | "onAppear" | "onComponentRef" | "onDisappear" | "onDismissed" | "onHeaderBackButtonClicked" | "onTransitionProgress" | "onWillAppear" | "onWillDisappear" | "replaceAnimation" | "screenOrientation" | "stackAnimation" | "stackPresentation" | "statusBarAnimation" | "statusBarColor" | "statusBarHidden" | "statusBarStyle" | "statusBarTranslucent" | "hitSlop" | "onLayout" | "pointerEvents" | "removeClippedSubviews" | "style" | "testID" | "nativeID" | "collapsable" | "needsOffscreenAlphaCompositing" | "renderToHardwareTextureAndroid" | "focusable" | "shouldRasterizeIOS" | "isTVSelectable" | "hasTVPreferredFocus" | "tvParallaxProperties" | "tvParallaxShiftDistanceX" | "tvParallaxShiftDistanceY" | "tvParallaxTiltAngle" | "tvParallaxMagnification" | "onStartShouldSetResponder" | "onMoveShouldSetResponder" | "onResponderEnd" | "onResponderGrant" | "onResponderReject" | "onResponderMove" | "onResponderRelease" | "onResponderStart" | "onResponderTerminationRequest" | "onResponderTerminate" | "onStartShouldSetResponderCapture" | "onMoveShouldSetResponderCapture" | "onTouchStart" | "onTouchMove" | "onTouchEnd" | "onTouchCancel" | "onTouchEndCapture" | "accessible" | "accessibilityActions" | "accessibilityLabel" | "accessibilityRole" | "accessibilityState" | "accessibilityHint" | "accessibilityValue" | "onAccessibilityAction" | "accessibilityComponentType" | "accessibilityLiveRegion" | "importantForAccessibility" | "accessibilityElementsHidden" | "accessibilityTraits" | "accessibilityViewIsModal" | "onAccessibilityEscape" | "onAccessibilityTap" | "onMagicTap" | "accessibilityIgnoresInvertColors"> & React.RefAttributes<React.ComponentClass<Animated.AnimateProps<{}>, any>>>;
5
+ export default ReanimatedScreen;
@@ -0,0 +1,2 @@
1
+ import { PropsWithChildren } from 'react';
2
+ export default function ReanimatedScreenProvider(props: PropsWithChildren<unknown>): JSX.Element;
@@ -1,2 +1,2 @@
1
- export { default as ReanimatedScreenProvider } from './ReanimatedScreen';
1
+ export { default as ReanimatedScreenProvider } from './ReanimatedScreenProvider';
2
2
  export { default as useReanimatedTransitionProgress } from './useReanimatedTransitionProgress';
@@ -1,4 +1,3 @@
1
- /// <reference types="react" />
2
1
  import { Animated, NativeSyntheticEvent, ViewProps, View, TargetedEvent, TextInputFocusEventData } from 'react-native';
3
2
  export declare type StackPresentationTypes = 'push' | 'modal' | 'transparentModal' | 'containedModal' | 'containedTransparentModal' | 'fullScreenModal' | 'formSheet';
4
3
  export declare type StackAnimationTypes = 'default' | 'fade' | 'fade_from_bottom' | 'flip' | 'none' | 'simple_push' | 'slide_from_bottom' | 'slide_from_right' | 'slide_from_left';
@@ -270,6 +269,14 @@ export interface ScreenStackHeaderConfigProps extends ViewProps {
270
269
  * Boolean that allows for disabling drop shadow under navigation header when the edge of any scrollable content reaches the matching edge of the navigation bar.
271
270
  */
272
271
  largeTitleHideShadow?: boolean;
272
+ /**
273
+ * Callback which is executed when screen header is attached
274
+ */
275
+ onAttached?: () => void;
276
+ /**
277
+ * Callback which is executed when screen header is detached
278
+ */
279
+ onDetached?: () => void;
273
280
  /**
274
281
  * String that can be displayed in the header as a fallback for `headerTitle`.
275
282
  */
@@ -309,22 +316,46 @@ export interface SearchBarProps {
309
316
  * The auto-capitalization behavior
310
317
  */
311
318
  autoCapitalize?: 'none' | 'words' | 'sentences' | 'characters';
319
+ /**
320
+ * Automatically focuses search bar on mount
321
+ *
322
+ * @platform android
323
+ */
324
+ autoFocus?: boolean;
312
325
  /**
313
326
  * The search field background color
314
327
  */
315
328
  barTintColor?: string;
316
329
  /**
317
330
  * The text to be used instead of default `Cancel` button text
331
+ *
332
+ * @platform ios
318
333
  */
319
334
  cancelButtonText?: string;
335
+ /**
336
+ * Specifies whether the back button should close search bar's text input or not.
337
+ *
338
+ * @platform android
339
+ */
340
+ disableBackButtonOverride?: boolean;
320
341
  /**
321
342
  * Indicates whether to hide the navigation bar
343
+ *
344
+ * @platform ios
322
345
  */
323
346
  hideNavigationBar?: boolean;
324
347
  /**
325
348
  * Indicates whether to hide the search bar when scrolling
349
+ *
350
+ * @platform ios
326
351
  */
327
352
  hideWhenScrolling?: boolean;
353
+ /**
354
+ * Sets type of the input. Defaults to `text`.
355
+ *
356
+ * @platform android
357
+ */
358
+ inputType?: 'text' | 'phone' | 'number' | 'email';
328
359
  /**
329
360
  * Indicates whether to to obscure the underlying content
330
361
  */
@@ -335,6 +366,8 @@ export interface SearchBarProps {
335
366
  onBlur?: (e: NativeSyntheticEvent<TargetedEvent>) => void;
336
367
  /**
337
368
  * A callback that gets called when the cancel button is pressed
369
+ *
370
+ * @platform ios
338
371
  */
339
372
  onCancelButtonPress?: (e: NativeSyntheticEvent<TargetedEvent>) => void;
340
373
  /**
@@ -344,7 +377,19 @@ export interface SearchBarProps {
344
377
  /**
345
378
  * A callback that gets called when search bar has received focus
346
379
  */
380
+ onClose?: () => void;
381
+ /**
382
+ * A callback that gets called when search bar is opened
383
+ *
384
+ * @platform android
385
+ */
347
386
  onFocus?: (e: NativeSyntheticEvent<TargetedEvent>) => void;
387
+ /**
388
+ * A callback that gets called when search bar is closed
389
+ *
390
+ * @platform android
391
+ */
392
+ onOpen?: () => void;
348
393
  /**
349
394
  * A callback that gets called when the search button is pressed. It receives the current text value of the search bar.
350
395
  */
@@ -0,0 +1,2 @@
1
+ export declare const isSearchBarAvailableForCurrentPlatform: boolean;
2
+ export declare function executeNativeBackPress(): boolean;
@@ -362,7 +362,7 @@ Search bar is only supported on iOS.
362
362
  Example:
363
363
 
364
364
  ```js
365
- React.useEffect(() => {
365
+ React.useLayoutEffect(() => {
366
366
  navigation.setOptions({
367
367
  searchBar: {
368
368
  // search bar options
@@ -371,6 +371,8 @@ React.useEffect(() => {
371
371
  }, [navigation]);
372
372
  ```
373
373
 
374
+ We advise using `useLayoutEffect` hook instead of `useEffect` when managing `searchBar` props to avoid unexpected layout issues.
375
+
374
376
  Supported properties are described below.
375
377
 
376
378
  #### `autoCapitalize`
@@ -383,7 +385,11 @@ Possible values:
383
385
  - `sentences`
384
386
  - `characters`
385
387
 
386
- Defaults to `sentences`.
388
+ Defaults to `sentences` on iOS and `'none'` on Android.
389
+
390
+ #### `autoFocus` (Android only)
391
+
392
+ When set to `true` focuses search bar automatically when screen is appearing. Default value is `false`.
387
393
 
388
394
  #### `barTintColor`
389
395
 
@@ -391,23 +397,37 @@ The search field background color.
391
397
 
392
398
  By default bar tint color is translucent.
393
399
 
394
- #### `cancelButtonText`
400
+ #### `cancelButtonText` (iOS only)
395
401
 
396
402
  The text to be used instead of default `Cancel` button text.
397
403
 
398
- #### `hideNavigationBar`
404
+ #### `disableBackButtonOverride` (Android only)
405
+
406
+ Default behavior is to prevent screen from going back when search bar is open (`disableBackButtonOverride: false`). If you don't want this to happen set `disableBackButtonOverride` to `true`
407
+
408
+ #### `hideNavigationBar` (iOS only)
399
409
 
400
410
  Boolean indicating whether to hide the navigation bar during searching.
401
411
 
402
412
  Defaults to `true`.
403
413
 
404
- #### `hideWhenScrolling`
414
+ #### `hideWhenScrolling` (iOS only)
405
415
 
406
416
  Boolean indicating whether to hide the search bar when scrolling.
407
417
 
408
418
  Defaults to `true`.
409
419
 
410
- #### `obscureBackground`
420
+ #### `inputType` (Android only)
421
+
422
+ This prop is used to change type of the input and keyboard. Default value is `'text'`.
423
+
424
+ All values:
425
+ - `'text'` - normal text input
426
+ - `'number'` - number input
427
+ - `'email'` - email input
428
+ - `'phone'` - phone input
429
+
430
+ #### `obscureBackground` (iOS only)
411
431
 
412
432
  Boolean indicating whether to obscure the underlying content with semi-transparent overlay.
413
433
 
@@ -430,7 +450,7 @@ Example:
430
450
  ```js
431
451
  const [search, setSearch] = React.useState('');
432
452
 
433
- React.useEffect(() => {
453
+ React.useLayoutEffect(() => {
434
454
  navigation.setOptions({
435
455
  searchBar: {
436
456
  onChangeText: (event) => setSearch(event.nativeEvent.text),
@@ -438,11 +458,19 @@ React.useEffect(() => {
438
458
  });
439
459
  }, [navigation]);
440
460
  ```
461
+ #### `onClose` (Android only)
462
+
463
+ A callback that gets called when search bar is closing
464
+
441
465
 
442
466
  #### `onFocus`
443
467
 
444
468
  A callback that gets called when search bar has received focus.
445
469
 
470
+ #### `onOpen` (Android only)
471
+
472
+ A callback that gets called when search bar is expanding
473
+
446
474
  #### `onSearchButtonPress`
447
475
 
448
476
  A callback that gets called when the search button is pressed. It receives the current text value of the search bar.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "react-native-screens",
3
- "version": "3.7.2",
3
+ "version": "3.10.1",
4
4
  "description": "Native navigation primitives for your React Native app.",
5
5
  "scripts": {
6
6
  "check-types": "tsc --noEmit",
@@ -35,7 +35,8 @@
35
35
  "windows/",
36
36
  "RNScreens.podspec",
37
37
  "README.md",
38
- "!**/__tests__"
38
+ "!**/__tests__",
39
+ "!android/src/main/java/com/swmansion/rnscreens/LifecycleHelper.kt"
39
40
  ],
40
41
  "repository": {
41
42
  "type": "git",
@@ -52,6 +53,7 @@
52
53
  },
53
54
  "homepage": "https://github.com/software-mansion/react-native-screens#readme",
54
55
  "dependencies": {
56
+ "react-freeze": "^1.0.0",
55
57
  "warn-once": "^0.1.0"
56
58
  },
57
59
  "peerDependencies": {
@@ -80,6 +82,7 @@
80
82
  "eslint-plugin-node": "^11.1.0",
81
83
  "eslint-plugin-promise": "^4.2.1",
82
84
  "eslint-plugin-react": "^7.20.5",
85
+ "eslint-plugin-react-hooks": "^4.2.0",
83
86
  "eslint-plugin-react-native": "^3.2.1",
84
87
  "eslint-plugin-standard": "^4.0.1",
85
88
  "husky": "^7.0.1",