diff --git a/package-lock.json b/package-lock.json index da838fe616fc8..b730246f2facc 100644 --- a/package-lock.json +++ b/package-lock.json @@ -12,7 +12,7 @@ "dependencies": { "@dotlottie/react-player": "^1.6.3", "@expensify/react-native-background-task": "file:./modules/background-task", - "@expensify/react-native-live-markdown": "0.1.233", + "@expensify/react-native-live-markdown": "0.1.234", "@expo/metro-runtime": "^4.0.0", "@firebase/app": "^0.10.10", "@firebase/performance": "^0.6.8", @@ -3644,9 +3644,9 @@ "link": true }, "node_modules/@expensify/react-native-live-markdown": { - "version": "0.1.233", - "resolved": "https://registry.npmjs.org/@expensify/react-native-live-markdown/-/react-native-live-markdown-0.1.233.tgz", - "integrity": "sha512-U0hz4YE67SLi5O2YXzGahsqEq700saQIH7Spg/5rHNfJmJeTaJTs5loOcIWHlkcU9NAVG/5sSFSVv1UxldywJg==", + "version": "0.1.234", + "resolved": "https://registry.npmjs.org/@expensify/react-native-live-markdown/-/react-native-live-markdown-0.1.234.tgz", + "integrity": "sha512-PoNYVX+CbZdjIQ4JqlY6aTk5KAeIxeyQ9THhdfCJKFzRnSJDWYKvnNlL4DgOHsSfGjV+DszWJK/cyrxuK5tPBQ==", "license": "MIT", "workspaces": [ "./example", diff --git a/package.json b/package.json index 4e88f1bde7373..9108e196807d0 100644 --- a/package.json +++ b/package.json @@ -79,7 +79,7 @@ "dependencies": { "@dotlottie/react-player": "^1.6.3", "@expensify/react-native-background-task": "file:./modules/background-task", - "@expensify/react-native-live-markdown": "0.1.233", + "@expensify/react-native-live-markdown": "0.1.234", "@expo/metro-runtime": "^4.0.0", "@firebase/app": "^0.10.10", "@firebase/performance": "^0.6.8", diff --git a/src/components/Search/SearchRouter/SearchRouterModal.tsx b/src/components/Search/SearchRouter/SearchRouterModal.tsx index 340b46cbf1731..fa8165fec596d 100644 --- a/src/components/Search/SearchRouter/SearchRouterModal.tsx +++ b/src/components/Search/SearchRouter/SearchRouterModal.tsx @@ -2,19 +2,23 @@ import React, {useState} from 'react'; import FocusTrapForModal from '@components/FocusTrap/FocusTrapForModal'; import Modal from '@components/Modal'; import useResponsiveLayout from '@hooks/useResponsiveLayout'; -import * as Browser from '@libs/Browser'; +import useSafeAreaInsets from '@hooks/useSafeAreaInsets'; +import useViewportOffsetTop from '@hooks/useViewportOffsetTop'; +import {isMobileChrome, isMobileSafari} from '@libs/Browser'; import CONST from '@src/CONST'; import SearchRouter from './SearchRouter'; import {useSearchRouterContext} from './SearchRouterContext'; -const isMobileSafari = Browser.isMobileSafari(); +const isMobileWebSafari = isMobileSafari(); function SearchRouterModal() { const {shouldUseNarrowLayout} = useResponsiveLayout(); const {isSearchRouterDisplayed, closeSearchRouter} = useSearchRouterContext(); + const viewportOffsetTop = useViewportOffsetTop(); + const safeAreaInsets = useSafeAreaInsets(); // On mWeb Safari, the input caret stuck for a moment while the modal is animating. So, we hide the caret until the animation is done. - const [shouldHideInputCaret, setShouldHideInputCaret] = useState(isMobileSafari); + const [shouldHideInputCaret, setShouldHideInputCaret] = useState(isMobileWebSafari); const modalType = shouldUseNarrowLayout ? CONST.MODAL.MODAL_TYPE.CENTERED_SWIPABLE_TO_RIGHT : CONST.MODAL.MODAL_TYPE.POPOVER; @@ -22,12 +26,13 @@ function SearchRouterModal() { setShouldHideInputCaret(isMobileSafari)} + onModalHide={() => setShouldHideInputCaret(isMobileWebSafari)} onModalShow={() => setShouldHideInputCaret(false)} > {isSearchRouterDisplayed && (