From e6b39732be64d5e8a40174b99c0ed0bdad6e7f33 Mon Sep 17 00:00:00 2001 From: s-alves10 Date: Tue, 4 Jul 2023 13:57:58 -0500 Subject: [PATCH 1/5] fix: disable the default callout in ios safari --- src/styles/styles.js | 1 + 1 file changed, 1 insertion(+) diff --git a/src/styles/styles.js b/src/styles/styles.js index 1d0770d5ceb8..2bbf266a98c1 100644 --- a/src/styles/styles.js +++ b/src/styles/styles.js @@ -133,6 +133,7 @@ const webViewStyles = { borderColor: themeColors.border, borderRadius: variables.componentBorderRadiusNormal, borderWidth: 1, + '-webkit-touch-callout': 'none', }, p: { From bcce9eb213c268d9c4610aa6c3fc983d09e4d7d9 Mon Sep 17 00:00:00 2001 From: s-alves10 Date: Tue, 4 Jul 2023 14:31:39 -0500 Subject: [PATCH 2/5] fix: remove ios native warning --- src/styles/styles.js | 3 ++- src/styles/utilities/callout/index.js | 5 +++++ src/styles/utilities/callout/index.native.js | 3 +++ 3 files changed, 10 insertions(+), 1 deletion(-) create mode 100644 src/styles/utilities/callout/index.js create mode 100644 src/styles/utilities/callout/index.native.js diff --git a/src/styles/styles.js b/src/styles/styles.js index 2bbf266a98c1..42ab56122ab7 100644 --- a/src/styles/styles.js +++ b/src/styles/styles.js @@ -22,6 +22,7 @@ import getPopOverVerticalOffset from './getPopOverVerticalOffset'; import overflowXHidden from './overflowXHidden'; import CONST from '../CONST'; import cursor from './utilities/cursor'; +import callout from './utilities/callout'; import userSelect from './utilities/userSelect'; import textUnderline from './utilities/textUnderline'; @@ -133,7 +134,7 @@ const webViewStyles = { borderColor: themeColors.border, borderRadius: variables.componentBorderRadiusNormal, borderWidth: 1, - '-webkit-touch-callout': 'none', + ...callout.calloutNone, }, p: { diff --git a/src/styles/utilities/callout/index.js b/src/styles/utilities/callout/index.js new file mode 100644 index 000000000000..55d75e16ebf4 --- /dev/null +++ b/src/styles/utilities/callout/index.js @@ -0,0 +1,5 @@ +export default { + calloutNone: { + '-webkit-touch-callout': 'none', + }, +}; diff --git a/src/styles/utilities/callout/index.native.js b/src/styles/utilities/callout/index.native.js new file mode 100644 index 000000000000..ca4cc90ba0d2 --- /dev/null +++ b/src/styles/utilities/callout/index.native.js @@ -0,0 +1,3 @@ +export default { + calloutNone: {}, +}; From a746529bbaadd511a293721a4898e0d622f439d1 Mon Sep 17 00:00:00 2001 From: s-alves10 Date: Thu, 6 Jul 2023 11:38:25 -0500 Subject: [PATCH 3/5] fix: remove web warnings --- src/styles/styles.js | 6 ++++-- src/styles/utilities/callout/index.js | 5 ----- src/styles/utilities/callout/index.native.js | 3 --- 3 files changed, 4 insertions(+), 10 deletions(-) delete mode 100644 src/styles/utilities/callout/index.js delete mode 100644 src/styles/utilities/callout/index.native.js diff --git a/src/styles/styles.js b/src/styles/styles.js index 7274bfda1de9..18a9f3360e63 100644 --- a/src/styles/styles.js +++ b/src/styles/styles.js @@ -21,8 +21,8 @@ import pointerEventsAuto from './pointerEventsAuto'; import getPopOverVerticalOffset from './getPopOverVerticalOffset'; import overflowXHidden from './overflowXHidden'; import CONST from '../CONST'; +import * as Browser from '../libs/Browser'; import cursor from './utilities/cursor'; -import callout from './utilities/callout'; import userSelect from './utilities/userSelect'; import textUnderline from './utilities/textUnderline'; @@ -30,6 +30,8 @@ function getTransparentColor(color, transparency = '') { return `${color}${transparency}`; } +const touchCalloutNone = Browser.getBrowser() === CONST.BROWSER.SAFARI && Browser.isMobile() ? {WebkitTouchCallout: 'none'} : {}; + const picker = { backgroundColor: themeColors.transparent, color: themeColors.text, @@ -134,7 +136,7 @@ const webViewStyles = { borderColor: themeColors.border, borderRadius: variables.componentBorderRadiusNormal, borderWidth: 1, - ...callout.calloutNone, + ...touchCalloutNone, }, p: { diff --git a/src/styles/utilities/callout/index.js b/src/styles/utilities/callout/index.js deleted file mode 100644 index 55d75e16ebf4..000000000000 --- a/src/styles/utilities/callout/index.js +++ /dev/null @@ -1,5 +0,0 @@ -export default { - calloutNone: { - '-webkit-touch-callout': 'none', - }, -}; diff --git a/src/styles/utilities/callout/index.native.js b/src/styles/utilities/callout/index.native.js deleted file mode 100644 index ca4cc90ba0d2..000000000000 --- a/src/styles/utilities/callout/index.native.js +++ /dev/null @@ -1,3 +0,0 @@ -export default { - calloutNone: {}, -}; From bc10582a220fc0f1124e8b1c634be71ebd021136 Mon Sep 17 00:00:00 2001 From: s-alves10 Date: Fri, 7 Jul 2023 22:31:29 -0500 Subject: [PATCH 4/5] fix: refine code --- src/styles/styles.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/styles/styles.js b/src/styles/styles.js index 18a9f3360e63..1e70ba782c9e 100644 --- a/src/styles/styles.js +++ b/src/styles/styles.js @@ -30,7 +30,7 @@ function getTransparentColor(color, transparency = '') { return `${color}${transparency}`; } -const touchCalloutNone = Browser.getBrowser() === CONST.BROWSER.SAFARI && Browser.isMobile() ? {WebkitTouchCallout: 'none'} : {}; +const touchCalloutNone = Browser.isMobileSafari() ? {WebkitTouchCallout: 'none'} : {}; const picker = { backgroundColor: themeColors.transparent, From 27dc7f479a694b2463402be00c0195ae3e557efe Mon Sep 17 00:00:00 2001 From: s-alves10 Date: Thu, 20 Jul 2023 03:43:48 -0500 Subject: [PATCH 5/5] fix: add comments for touch callout --- src/styles/styles.js | 1 + 1 file changed, 1 insertion(+) diff --git a/src/styles/styles.js b/src/styles/styles.js index 495e375a475f..716e6aef08b5 100644 --- a/src/styles/styles.js +++ b/src/styles/styles.js @@ -26,6 +26,7 @@ import cursor from './utilities/cursor'; import userSelect from './utilities/userSelect'; import textUnderline from './utilities/textUnderline'; +// touchCallout is an iOS safari only property that controls the display of the callout information when you touch and hold a target const touchCalloutNone = Browser.isMobileSafari() ? {WebkitTouchCallout: 'none'} : {}; const picker = {