From 5860c95d9073b5e7ea55fcdd78fa174158440b79 Mon Sep 17 00:00:00 2001 From: Ritesh Shukla Date: Tue, 29 Jul 2025 00:46:10 +0530 Subject: [PATCH 1/5] Update index.js --- packages/react-native-web/src/exports/Platform/index.js | 3 +++ 1 file changed, 3 insertions(+) diff --git a/packages/react-native-web/src/exports/Platform/index.js b/packages/react-native-web/src/exports/Platform/index.js index 67bed3646b..6e14326ff2 100644 --- a/packages/react-native-web/src/exports/Platform/index.js +++ b/packages/react-native-web/src/exports/Platform/index.js @@ -16,6 +16,9 @@ const Platform = { return true; } return false; + }, + get Version(): string { + return "0.0.0" } }; From ae0977f9c411170af33cb04f3cd1d0c7f9a91970 Mon Sep 17 00:00:00 2001 From: staszekscp Date: Tue, 26 Aug 2025 08:57:17 +0200 Subject: [PATCH 2/5] Fix pointerEvents passed by inline styles --- .../src/exports/StyleSheet/compiler/index.js | 6 +++--- .../react-native-web/src/modules/createDOMProps/index.js | 5 ++++- 2 files changed, 7 insertions(+), 4 deletions(-) diff --git a/packages/react-native-web/src/exports/StyleSheet/compiler/index.js b/packages/react-native-web/src/exports/StyleSheet/compiler/index.js index 7649d9888c..61f9f5c35a 100644 --- a/packages/react-native-web/src/exports/StyleSheet/compiler/index.js +++ b/packages/react-native-web/src/exports/StyleSheet/compiler/index.js @@ -387,15 +387,15 @@ function createAtomicRules(identifier: string, property, value): Rules { } else if (value === 'none') { finalValue = 'none!important'; const block = createDeclarationBlock({ pointerEvents: 'none' }); - rules.push(`${selector} * ${block}`); + rules.push(`${selector}>* ${block}`); } else if (value === 'box-none') { finalValue = 'none!important'; const block = createDeclarationBlock({ pointerEvents: 'auto' }); - rules.push(`${selector} * ${block}`); + rules.push(`${selector}>* ${block}`); } else if (value === 'box-only') { finalValue = 'auto!important'; const block = createDeclarationBlock({ pointerEvents: 'none' }); - rules.push(`${selector} * ${block}`); + rules.push(`${selector}>* ${block}`); } const block = createDeclarationBlock({ pointerEvents: finalValue }); rules.push(`${selector}${block}`); diff --git a/packages/react-native-web/src/modules/createDOMProps/index.js b/packages/react-native-web/src/modules/createDOMProps/index.js index 3fbb3dffa8..2a5aea25fd 100644 --- a/packages/react-native-web/src/modules/createDOMProps/index.js +++ b/packages/react-native-web/src/modules/createDOMProps/index.js @@ -879,8 +879,11 @@ const createDOMProps = (elementType, props, options) => { `props.pointerEvents is deprecated. Use style.pointerEvents` ); } + const pointerEventsValue = + StyleSheet.flatten(style).pointerEvents || pointerEvents; + const [className, inlineStyle] = StyleSheet( - [style, pointerEvents && pointerEventsStyles[pointerEvents]], + [style, pointerEventsValue && pointerEventsStyles[pointerEventsValue]], { writingDirection: 'ltr', ...options From 1a126da8b34eedc0b8511a388128739f42396476 Mon Sep 17 00:00:00 2001 From: staszekscp Date: Tue, 26 Aug 2025 12:07:54 +0200 Subject: [PATCH 3/5] Fix tests for pointerEvents --- .../__tests__/__snapshots__/index-test.js.snap | 12 ++++++------ .../AppRegistry/__tests__/index-test.node.js | 18 +++++++++--------- .../StyleSheet/__tests__/compiler-test.js | 6 +++--- 3 files changed, 18 insertions(+), 18 deletions(-) diff --git a/packages/react-native-web/src/exports/AppRegistry/__tests__/__snapshots__/index-test.js.snap b/packages/react-native-web/src/exports/AppRegistry/__tests__/__snapshots__/index-test.js.snap index c5d22bea8e..597eebcf99 100644 --- a/packages/react-native-web/src/exports/AppRegistry/__tests__/__snapshots__/index-test.js.snap +++ b/packages/react-native-web/src/exports/AppRegistry/__tests__/__snapshots__/index-test.js.snap @@ -16,11 +16,11 @@ exports[`AppRegistry runApplication styles roots in different documents 1`] = ` ".r-bottom-1p0dtai {bottom: 0px;}", ".r-left-1d2f490 {left: 0px;}", ".r-pointerEvents-105ug2t {pointer-events: auto !important;}", - ".r-pointerEvents-12vffkv * {pointer-events: auto;}", + ".r-pointerEvents-12vffkv>* {pointer-events: auto;}", ".r-pointerEvents-12vffkv {pointer-events: none !important;}", - ".r-pointerEvents-633pao * {pointer-events: none;}", + ".r-pointerEvents-633pao>* {pointer-events: none;}", ".r-pointerEvents-633pao {pointer-events: none !important;}", - ".r-pointerEvents-ah5dr5 * {pointer-events: none;}", + ".r-pointerEvents-ah5dr5>* {pointer-events: none;}", ".r-pointerEvents-ah5dr5 {pointer-events: auto !important;}", ".r-position-u8s1d {position: absolute;}", ".r-right-zchlnj {right: 0px;}", @@ -44,11 +44,11 @@ exports[`AppRegistry runApplication styles roots in different documents 2`] = ` ".r-bottom-1p0dtai {bottom: 0px;}", ".r-left-1d2f490 {left: 0px;}", ".r-pointerEvents-105ug2t {pointer-events: auto !important;}", - ".r-pointerEvents-12vffkv * {pointer-events: auto;}", + ".r-pointerEvents-12vffkv>* {pointer-events: auto;}", ".r-pointerEvents-12vffkv {pointer-events: none !important;}", - ".r-pointerEvents-633pao * {pointer-events: none;}", + ".r-pointerEvents-633pao>* {pointer-events: none;}", ".r-pointerEvents-633pao {pointer-events: none !important;}", - ".r-pointerEvents-ah5dr5 * {pointer-events: none;}", + ".r-pointerEvents-ah5dr5>* {pointer-events: none;}", ".r-pointerEvents-ah5dr5 {pointer-events: auto !important;}", ".r-position-u8s1d {position: absolute;}", ".r-right-zchlnj {right: 0px;}", diff --git a/packages/react-native-web/src/exports/AppRegistry/__tests__/index-test.node.js b/packages/react-native-web/src/exports/AppRegistry/__tests__/index-test.node.js index 821b73b1de..082bdd1fe5 100644 --- a/packages/react-native-web/src/exports/AppRegistry/__tests__/index-test.node.js +++ b/packages/react-native-web/src/exports/AppRegistry/__tests__/index-test.node.js @@ -61,11 +61,11 @@ describe('AppRegistry', () => { .r-left-1d2f490{left:0px;} .r-maxWidth-dnmrzs{max-width:100%;} .r-pointerEvents-105ug2t{pointer-events:auto!important;} - .r-pointerEvents-12vffkv * {pointer-events:auto;} + .r-pointerEvents-12vffkv>* {pointer-events:auto;} .r-pointerEvents-12vffkv{pointer-events:none!important;} - .r-pointerEvents-633pao * {pointer-events:none;} + .r-pointerEvents-633pao>* {pointer-events:none;} .r-pointerEvents-633pao{pointer-events:none!important;} - .r-pointerEvents-ah5dr5 * {pointer-events:none;} + .r-pointerEvents-ah5dr5>* {pointer-events:none;} .r-pointerEvents-ah5dr5{pointer-events:auto!important;} .r-position-u8s1d{position:absolute;} .r-right-zchlnj{right:0px;} @@ -120,11 +120,11 @@ describe('AppRegistry', () => { .r-left-1d2f490{left:0px;} .r-maxWidth-dnmrzs{max-width:100%;} .r-pointerEvents-105ug2t{pointer-events:auto!important;} - .r-pointerEvents-12vffkv * {pointer-events:auto;} + .r-pointerEvents-12vffkv>* {pointer-events:auto;} .r-pointerEvents-12vffkv{pointer-events:none!important;} - .r-pointerEvents-633pao * {pointer-events:none;} + .r-pointerEvents-633pao>* {pointer-events:none;} .r-pointerEvents-633pao{pointer-events:none!important;} - .r-pointerEvents-ah5dr5 * {pointer-events:none;} + .r-pointerEvents-ah5dr5>* {pointer-events:none;} .r-pointerEvents-ah5dr5{pointer-events:auto!important;} .r-position-u8s1d{position:absolute;} .r-right-zchlnj{right:0px;} @@ -172,11 +172,11 @@ describe('AppRegistry', () => { .r-left-1d2f490{left:0px;} .r-maxWidth-dnmrzs{max-width:100%;} .r-pointerEvents-105ug2t{pointer-events:auto!important;} - .r-pointerEvents-12vffkv * {pointer-events:auto;} + .r-pointerEvents-12vffkv>* {pointer-events:auto;} .r-pointerEvents-12vffkv{pointer-events:none!important;} - .r-pointerEvents-633pao * {pointer-events:none;} + .r-pointerEvents-633pao>* {pointer-events:none;} .r-pointerEvents-633pao{pointer-events:none!important;} - .r-pointerEvents-ah5dr5 * {pointer-events:none;} + .r-pointerEvents-ah5dr5>* {pointer-events:none;} .r-pointerEvents-ah5dr5{pointer-events:auto!important;} .r-position-u8s1d{position:absolute;} .r-right-zchlnj{right:0px;} diff --git a/packages/react-native-web/src/exports/StyleSheet/__tests__/compiler-test.js b/packages/react-native-web/src/exports/StyleSheet/__tests__/compiler-test.js index 6709f69e19..e47121b1b3 100644 --- a/packages/react-native-web/src/exports/StyleSheet/__tests__/compiler-test.js +++ b/packages/react-native-web/src/exports/StyleSheet/__tests__/compiler-test.js @@ -142,7 +142,7 @@ describe('StyleSheet/compile', () => { ], [ [ - ".r-pointerEvents-ah5dr5 * {pointer-events:none;}", + ".r-pointerEvents-ah5dr5>* {pointer-events:none;}", ".r-pointerEvents-ah5dr5{pointer-events:auto!important;}", ], 3, @@ -191,7 +191,7 @@ describe('StyleSheet/compile', () => { [ [ [ - ".r-pointerEvents-633pao * {pointer-events:none;}", + ".r-pointerEvents-633pao>* {pointer-events:none;}", ".r-pointerEvents-633pao{pointer-events:none!important;}", ], 3, @@ -215,7 +215,7 @@ describe('StyleSheet/compile', () => { [ [ [ - ".r-pointerEvents-12vffkv * {pointer-events:auto;}", + ".r-pointerEvents-12vffkv>* {pointer-events:auto;}", ".r-pointerEvents-12vffkv{pointer-events:none!important;}", ], 3, From bb7c6d1b6a175c46e9b457e27b191ed8b9bd6d39 Mon Sep 17 00:00:00 2001 From: staszekscp Date: Fri, 29 Aug 2025 08:05:05 +0200 Subject: [PATCH 4/5] Remove code to fix pointerEvents inline styling --- packages/react-native-web/src/modules/createDOMProps/index.js | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/packages/react-native-web/src/modules/createDOMProps/index.js b/packages/react-native-web/src/modules/createDOMProps/index.js index 2a5aea25fd..4144dbc6f6 100644 --- a/packages/react-native-web/src/modules/createDOMProps/index.js +++ b/packages/react-native-web/src/modules/createDOMProps/index.js @@ -879,11 +879,9 @@ const createDOMProps = (elementType, props, options) => { `props.pointerEvents is deprecated. Use style.pointerEvents` ); } - const pointerEventsValue = - StyleSheet.flatten(style).pointerEvents || pointerEvents; const [className, inlineStyle] = StyleSheet( - [style, pointerEventsValue && pointerEventsStyles[pointerEventsValue]], + [style, pointerEvents && pointerEventsStyles[pointerEvents]], { writingDirection: 'ltr', ...options From f1a03a433a9d5a718076c03bd886d780246c1947 Mon Sep 17 00:00:00 2001 From: staszekscp Date: Fri, 29 Aug 2025 08:05:05 +0200 Subject: [PATCH 5/5] Remove code to fix pointerEvents inline styling --- .../react-native-web/src/modules/createDOMProps/index.js | 5 +---- 1 file changed, 1 insertion(+), 4 deletions(-) diff --git a/packages/react-native-web/src/modules/createDOMProps/index.js b/packages/react-native-web/src/modules/createDOMProps/index.js index 2a5aea25fd..3fbb3dffa8 100644 --- a/packages/react-native-web/src/modules/createDOMProps/index.js +++ b/packages/react-native-web/src/modules/createDOMProps/index.js @@ -879,11 +879,8 @@ const createDOMProps = (elementType, props, options) => { `props.pointerEvents is deprecated. Use style.pointerEvents` ); } - const pointerEventsValue = - StyleSheet.flatten(style).pointerEvents || pointerEvents; - const [className, inlineStyle] = StyleSheet( - [style, pointerEventsValue && pointerEventsStyles[pointerEventsValue]], + [style, pointerEvents && pointerEventsStyles[pointerEvents]], { writingDirection: 'ltr', ...options