@hero-design/rn 8.52.2-rc2.0 → 8.53.0

package/src/components/Select/MultiSelect/__tests__/__snapshots__/index.spec.tsx.snap

@@ -263,37 +263,11 @@ exports[`rendering allows custom renderer 1`] = `
       </View>
     </View>
   </View>
-  <View
-    collapsable={false}
-    style={
-      {
-        "backgroundColor": "transparent",
-        "bottom": 0,
-        "left": 0,
-        "opacity": 0.4,
-        "position": "absolute",
-        "right": 0,
-        "top": 0,
-      }
-    }
-  />
-  <View
-    collapsable={false}
-    style={
-      {
-        "bottom": 0,
-        "left": 0,
-        "opacity": 1,
-        "position": "absolute",
-        "right": 0,
-        "top": 0,
-        "transform": [
-          {
-            "translateY": 0,
-          },
-        ],
-      }
-    }
+  <Modal
+    hardwareAccelerated={false}
+    onRequestClose={[Function]}
+    transparent={true}
+    visible={true}
   >
     <View
       pointerEvents="box-none"
@@ -1534,9 +1508,10 @@ exports[`rendering allows custom renderer 1`] = `
         </RCTSafeAreaView>
       </View>
     </View>
-  </View>
+  </Modal>
   <View
     pointerEvents="box-none"
+    position="bottom"
     style={
       [
         {
@@ -1820,8 +1795,15 @@ exports[`rendering renders correctly when bottom sheet is NOT visible 1`] = `
       </View>
     </View>
   </View>
+  <Modal
+    hardwareAccelerated={false}
+    onRequestClose={[Function]}
+    transparent={true}
+    visible={false}
+  />
   <View
     pointerEvents="box-none"
+    position="bottom"
     style={
       [
         {
@@ -2105,37 +2087,11 @@ exports[`rendering renders correctly when bottom sheet is visible 1`] = `
       </View>
     </View>
   </View>
-  <View
-    collapsable={false}
-    style={
-      {
-        "backgroundColor": "transparent",
-        "bottom": 0,
-        "left": 0,
-        "opacity": 0.4,
-        "position": "absolute",
-        "right": 0,
-        "top": 0,
-      }
-    }
-  />
-  <View
-    collapsable={false}
-    style={
-      {
-        "bottom": 0,
-        "left": 0,
-        "opacity": 1,
-        "position": "absolute",
-        "right": 0,
-        "top": 0,
-        "transform": [
-          {
-            "translateY": 0,
-          },
-        ],
-      }
-    }
+  <Modal
+    hardwareAccelerated={false}
+    onRequestClose={[Function]}
+    transparent={true}
+    visible={true}
   >
     <View
       pointerEvents="box-none"
@@ -3582,9 +3538,10 @@ exports[`rendering renders correctly when bottom sheet is visible 1`] = `
         </RCTSafeAreaView>
       </View>
     </View>
-  </View>
+  </Modal>
   <View
     pointerEvents="box-none"
+    position="bottom"
     style={
       [
         {
@@ -3881,8 +3838,15 @@ exports[`rendering renders correctly when input is loading 1`] = `
       </View>
     </View>
   </View>
+  <Modal
+    hardwareAccelerated={false}
+    onRequestClose={[Function]}
+    transparent={true}
+    visible={false}
+  />
   <View
     pointerEvents="box-none"
+    position="bottom"
     style={
       [
         {
@@ -4166,37 +4130,11 @@ exports[`rendering renders correctly when receives sections 1`] = `
       </View>
     </View>
   </View>
-  <View
-    collapsable={false}
-    style={
-      {
-        "backgroundColor": "transparent",
-        "bottom": 0,
-        "left": 0,
-        "opacity": 0.4,
-        "position": "absolute",
-        "right": 0,
-        "top": 0,
-      }
-    }
-  />
-  <View
-    collapsable={false}
-    style={
-      {
-        "bottom": 0,
-        "left": 0,
-        "opacity": 1,
-        "position": "absolute",
-        "right": 0,
-        "top": 0,
-        "transform": [
-          {
-            "translateY": 0,
-          },
-        ],
-      }
-    }
+  <Modal
+    hardwareAccelerated={false}
+    onRequestClose={[Function]}
+    transparent={true}
+    visible={true}
   >
     <View
       pointerEvents="box-none"
@@ -5223,9 +5161,10 @@ exports[`rendering renders correctly when receives sections 1`] = `
         </RCTSafeAreaView>
       </View>
     </View>
-  </View>
+  </Modal>
   <View
     pointerEvents="box-none"
+    position="bottom"
     style={
       [
         {
@@ -5509,37 +5448,11 @@ exports[`rendering renders correctly when receives sections 2`] = `
       </View>
     </View>
   </View>
-  <View
-    collapsable={false}
-    style={
-      {
-        "backgroundColor": "transparent",
-        "bottom": 0,
-        "left": 0,
-        "opacity": 0.4,
-        "position": "absolute",
-        "right": 0,
-        "top": 0,
-      }
-    }
-  />
-  <View
-    collapsable={false}
-    style={
-      {
-        "bottom": 0,
-        "left": 0,
-        "opacity": 1,
-        "position": "absolute",
-        "right": 0,
-        "top": 0,
-        "transform": [
-          {
-            "translateY": 0,
-          },
-        ],
-      }
-    }
+  <Modal
+    hardwareAccelerated={false}
+    onRequestClose={[Function]}
+    transparent={true}
+    visible={true}
   >
     <View
       pointerEvents="box-none"
@@ -6538,9 +6451,10 @@ exports[`rendering renders correctly when receives sections 2`] = `
         </RCTSafeAreaView>
       </View>
     </View>
-  </View>
+  </Modal>
   <View
     pointerEvents="box-none"
+    position="bottom"
     style={
       [
         {

package/src/components/Select/SingleSelect/__tests__/__snapshots__/Option.spec.tsx.snap

@@ -79,6 +79,7 @@ exports[`Option renders correctly 1`] = `
   </View>
   <View
     pointerEvents="box-none"
+    position="bottom"
     style={
       [
         {

package/src/components/Select/SingleSelect/__tests__/__snapshots__/OptionList.spec.tsx.snap

@@ -842,6 +842,7 @@ exports[`OptionList render isLoading correctly 1`] = `
   </RCTScrollView>
   <View
     pointerEvents="box-none"
+    position="bottom"
     style={
       [
         {
@@ -1539,6 +1540,7 @@ exports[`OptionList renders correctly 1`] = `
   </RCTScrollView>
   <View
     pointerEvents="box-none"
+    position="bottom"
     style={
       [
         {
@@ -2236,6 +2238,7 @@ exports[`OptionList trigger onPress correctly on select new value 1`] = `
   </RCTScrollView>
   <View
     pointerEvents="box-none"
+    position="bottom"
     style={
       [
         {
@@ -2933,6 +2936,7 @@ exports[`OptionList trigger onPress correctly on unselect current value 1`] = `
   </RCTScrollView>
   <View
     pointerEvents="box-none"
+    position="bottom"
     style={
       [
         {

package/src/components/Select/SingleSelect/__tests__/__snapshots__/index.spec.tsx.snap

@@ -262,37 +262,11 @@ exports[`rendering allows custom renderer 1`] = `
       </View>
     </View>
   </View>
-  <View
-    collapsable={false}
-    style={
-      {
-        "backgroundColor": "transparent",
-        "bottom": 0,
-        "left": 0,
-        "opacity": 0.4,
-        "position": "absolute",
-        "right": 0,
-        "top": 0,
-      }
-    }
-  />
-  <View
-    collapsable={false}
-    style={
-      {
-        "bottom": 0,
-        "left": 0,
-        "opacity": 1,
-        "position": "absolute",
-        "right": 0,
-        "top": 0,
-        "transform": [
-          {
-            "translateY": 0,
-          },
-        ],
-      }
-    }
+  <Modal
+    hardwareAccelerated={false}
+    onRequestClose={[Function]}
+    transparent={true}
+    visible={true}
   >
     <View
       pointerEvents="box-none"
@@ -1449,9 +1423,10 @@ exports[`rendering allows custom renderer 1`] = `
         </RCTSafeAreaView>
       </View>
     </View>
-  </View>
+  </Modal>
   <View
     pointerEvents="box-none"
+    position="bottom"
     style={
       [
         {
@@ -1735,8 +1710,15 @@ exports[`rendering renders correctly when bottom sheet is NOT visible 1`] = `
       </View>
     </View>
   </View>
+  <Modal
+    hardwareAccelerated={false}
+    onRequestClose={[Function]}
+    transparent={true}
+    visible={false}
+  />
   <View
     pointerEvents="box-none"
+    position="bottom"
     style={
       [
         {
@@ -2020,37 +2002,11 @@ exports[`rendering renders correctly when bottom sheet is visible 1`] = `
       </View>
     </View>
   </View>
-  <View
-    collapsable={false}
-    style={
-      {
-        "backgroundColor": "transparent",
-        "bottom": 0,
-        "left": 0,
-        "opacity": 0.4,
-        "position": "absolute",
-        "right": 0,
-        "top": 0,
-      }
-    }
-  />
-  <View
-    collapsable={false}
-    style={
-      {
-        "bottom": 0,
-        "left": 0,
-        "opacity": 1,
-        "position": "absolute",
-        "right": 0,
-        "top": 0,
-        "transform": [
-          {
-            "translateY": 0,
-          },
-        ],
-      }
-    }
+  <Modal
+    hardwareAccelerated={false}
+    onRequestClose={[Function]}
+    transparent={true}
+    visible={true}
   >
     <View
       pointerEvents="box-none"
@@ -3357,9 +3313,10 @@ exports[`rendering renders correctly when bottom sheet is visible 1`] = `
         </RCTSafeAreaView>
       </View>
     </View>
-  </View>
+  </Modal>
   <View
     pointerEvents="box-none"
+    position="bottom"
     style={
       [
         {
@@ -3656,8 +3613,15 @@ exports[`rendering renders correctly when input is loading 1`] = `
       </View>
     </View>
   </View>
+  <Modal
+    hardwareAccelerated={false}
+    onRequestClose={[Function]}
+    transparent={true}
+    visible={false}
+  />
   <View
     pointerEvents="box-none"
+    position="bottom"
     style={
       [
         {
@@ -3941,37 +3905,11 @@ exports[`rendering renders correctly when receives sections 1`] = `
       </View>
     </View>
   </View>
-  <View
-    collapsable={false}
-    style={
-      {
-        "backgroundColor": "transparent",
-        "bottom": 0,
-        "left": 0,
-        "opacity": 0.4,
-        "position": "absolute",
-        "right": 0,
-        "top": 0,
-      }
-    }
-  />
-  <View
-    collapsable={false}
-    style={
-      {
-        "bottom": 0,
-        "left": 0,
-        "opacity": 1,
-        "position": "absolute",
-        "right": 0,
-        "top": 0,
-        "transform": [
-          {
-            "translateY": 0,
-          },
-        ],
-      }
-    }
+  <Modal
+    hardwareAccelerated={false}
+    onRequestClose={[Function]}
+    transparent={true}
+    visible={true}
   >
     <View
       pointerEvents="box-none"
@@ -4858,9 +4796,10 @@ exports[`rendering renders correctly when receives sections 1`] = `
         </RCTSafeAreaView>
       </View>
     </View>
-  </View>
+  </Modal>
   <View
     pointerEvents="box-none"
+    position="bottom"
     style={
       [
         {

package/src/components/Skeleton/__tests__/__snapshots__/index.spec.tsx.snap

@@ -78,6 +78,7 @@ exports[`Skeleton renders correctly by default 1`] = `
   </View>
   <View
     pointerEvents="box-none"
+    position="bottom"
     style={
       [
         {
@@ -176,6 +177,7 @@ exports[`Skeleton renders correctly when intent is dark and variant is circular
   </View>
   <View
     pointerEvents="box-none"
+    position="bottom"
     style={
       [
         {
@@ -274,6 +276,7 @@ exports[`Skeleton renders correctly when intent is dark and variant is rectangul
   </View>
   <View
     pointerEvents="box-none"
+    position="bottom"
     style={
       [
         {
@@ -372,6 +375,7 @@ exports[`Skeleton renders correctly when intent is dark and variant is rounded 1
   </View>
   <View
     pointerEvents="box-none"
+    position="bottom"
     style={
       [
         {
@@ -470,6 +474,7 @@ exports[`Skeleton renders correctly when intent is light and variant is circular
   </View>
   <View
     pointerEvents="box-none"
+    position="bottom"
     style={
       [
         {
@@ -568,6 +573,7 @@ exports[`Skeleton renders correctly when intent is light and variant is rectangu
   </View>
   <View
     pointerEvents="box-none"
+    position="bottom"
     style={
       [
         {
@@ -666,6 +672,7 @@ exports[`Skeleton renders correctly when intent is light and variant is rounded
   </View>
   <View
     pointerEvents="box-none"
+    position="bottom"
     style={
       [
         {

package/src/components/Slider/__tests__/__snapshots__/index.spec.tsx.snap

@@ -20,6 +20,7 @@ exports[`Slider renders correctly by default 1`] = `
   />
   <View
     pointerEvents="box-none"
+    position="bottom"
     style={
       [
         {
@@ -60,6 +61,7 @@ exports[`Slider renders correctly when disabled 1`] = `
   />
   <View
     pointerEvents="box-none"
+    position="bottom"
     style={
       [
         {
@@ -103,6 +105,7 @@ exports[`Slider renders correctly with props 1`] = `
   />
   <View
     pointerEvents="box-none"
+    position="bottom"
     style={
       [
         {

package/src/components/Spinner/__tests__/__snapshots__/AnimatedSpinner.spec.tsx.snap

@@ -127,6 +127,7 @@ exports[`AnimatedSpinner renders correctly 1`] = `
   </View>
   <View
     pointerEvents="box-none"
+    position="bottom"
     style={
       [
         {