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

package/src/components/TimePicker/__tests__/__snapshots__/TimePickerIOS.spec.tsx.snap

@@ -265,7 +265,6 @@ exports[`TimePickerIOS renders correct with hide suffix 1`] = `
   </View>
   <View
     pointerEvents="box-none"
-    position="bottom"
     style={
       [
         {
@@ -543,391 +542,371 @@ exports[`TimePickerIOS renders correctly 1`] = `
         </View>
       </View>
     </View>
-    <RCTModalHostView
-      animationType="none"
-      hardwareAccelerated={false}
-      identifier={0}
-      onDismiss={[Function]}
-      onRequestClose={[Function]}
-      onStartShouldSetResponder={[Function]}
-      presentationStyle="overFullScreen"
+  </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,
+          },
+        ],
+      }
+    }
+  >
+    <View
+      pointerEvents="box-none"
       style={
-        {
-          "position": "absolute",
-        }
+        [
+          {
+            "bottom": 0,
+            "flexDirection": "column-reverse",
+            "left": 0,
+            "position": "absolute",
+            "right": 0,
+            "top": 0,
+          },
+          undefined,
+        ]
       }
-      transparent={true}
-      visible={true}
     >
       <View
-        collapsable={false}
+        onLayout={[Function]}
         style={
           [
+            [
+              {
+                "flex": 1,
+                "flexDirection": "column-reverse",
+              },
+              undefined,
+            ],
             {
-              "flex": 1,
-              "left": 0,
-              "top": 0,
-            },
-            {
-              "backgroundColor": "transparent",
+              "paddingBottom": 0,
             },
           ]
         }
       >
         <View
-          pointerEvents="box-none"
+          accessibilityState={
+            {
+              "busy": undefined,
+              "checked": undefined,
+              "disabled": undefined,
+              "expanded": undefined,
+              "selected": undefined,
+            }
+          }
+          accessibilityValue={
+            {
+              "max": undefined,
+              "min": undefined,
+              "now": undefined,
+              "text": undefined,
+            }
+          }
+          accessible={true}
+          collapsable={false}
+          focusable={true}
+          onBlur={[Function]}
+          onClick={[Function]}
+          onFocus={[Function]}
+          onResponderGrant={[Function]}
+          onResponderMove={[Function]}
+          onResponderRelease={[Function]}
+          onResponderTerminate={[Function]}
+          onResponderTerminationRequest={[Function]}
+          onStartShouldSetResponder={[Function]}
           style={
             {
-              "flex": 1,
+              "backgroundColor": "#000000",
+              "bottom": 0,
+              "left": 0,
+              "opacity": 0.48,
+              "position": "absolute",
+              "right": 0,
+              "top": 0,
+            }
+          }
+        />
+        <RCTSafeAreaView
+          collapsable={false}
+          style={
+            {
+              "backgroundColor": "#ffffff",
+              "borderTopLeftRadius": 16,
+              "borderTopRightRadius": 16,
+              "elevation": 10,
+              "maxHeight": "94%",
+              "shadowColor": "#001f23",
+              "shadowOffset": {
+                "height": 3,
+                "width": 0,
+              },
+              "shadowOpacity": 0.4,
+              "shadowRadius": 16,
+              "transform": [
+                {
+                  "scaleY": 1,
+                },
+                {
+                  "translateY": 0,
+                },
+              ],
+              "width": "100%",
             }
           }
         >
           <View
-            collapsable={true}
-            pointerEvents="box-none"
             style={
-              {
-                "flex": 1,
-              }
+              [
+                {
+                  "flexDirection": "row",
+                  "paddingHorizontal": 16,
+                  "paddingVertical": 8,
+                },
+                undefined,
+              ]
             }
           >
             <View
-              pointerEvents="box-none"
               style={
                 [
                   {
-                    "bottom": 0,
-                    "flexDirection": "column-reverse",
-                    "left": 0,
-                    "position": "absolute",
-                    "right": 0,
-                    "top": 0,
+                    "flex": 1,
+                    "justifyContent": "center",
                   },
                   undefined,
                 ]
               }
             >
-              <View
-                onLayout={[Function]}
+              <Text
+                allowFontScaling={false}
                 style={
                   [
-                    [
-                      {
-                        "flex": 1,
-                        "flexDirection": "column-reverse",
-                      },
-                      undefined,
-                    ],
                     {
-                      "paddingBottom": 0,
+                      "color": "#001f23",
+                      "fontFamily": "BeVietnamPro-SemiBold",
+                      "fontSize": 16,
+                      "letterSpacing": 0.24,
+                      "lineHeight": 24,
                     },
+                    undefined,
                   ]
                 }
+                themeIntent="body"
+                themeTypeface="neutral"
+                themeVariant="regular-bold"
               >
-                <View
-                  accessibilityState={
-                    {
-                      "busy": undefined,
-                      "checked": undefined,
-                      "disabled": undefined,
-                      "expanded": undefined,
-                      "selected": undefined,
-                    }
+                Break time
+              </Text>
+            </View>
+            <View
+              style={
+                [
+                  {
+                    "alignItems": "center",
+                    "height": 48,
+                    "justifyContent": "center",
+                    "marginLeft": 12,
+                    "width": 48,
+                  },
+                  undefined,
+                ]
+              }
+            >
+              <View
+                accessibilityState={
+                  {
+                    "busy": undefined,
+                    "checked": undefined,
+                    "disabled": undefined,
+                    "expanded": undefined,
+                    "selected": undefined,
                   }
-                  accessibilityValue={
-                    {
-                      "max": undefined,
-                      "min": undefined,
-                      "now": undefined,
-                      "text": undefined,
-                    }
+                }
+                accessibilityValue={
+                  {
+                    "max": undefined,
+                    "min": undefined,
+                    "now": undefined,
+                    "text": undefined,
+                  }
+                }
+                accessible={true}
+                collapsable={false}
+                focusable={true}
+                onClick={[Function]}
+                onResponderGrant={[Function]}
+                onResponderMove={[Function]}
+                onResponderRelease={[Function]}
+                onResponderTerminate={[Function]}
+                onResponderTerminationRequest={[Function]}
+                onStartShouldSetResponder={[Function]}
+                style={
+                  {
+                    "opacity": 1,
                   }
-                  accessible={true}
-                  collapsable={false}
-                  focusable={true}
-                  onBlur={[Function]}
-                  onClick={[Function]}
-                  onFocus={[Function]}
-                  onResponderGrant={[Function]}
-                  onResponderMove={[Function]}
-                  onResponderRelease={[Function]}
-                  onResponderTerminate={[Function]}
-                  onResponderTerminationRequest={[Function]}
-                  onStartShouldSetResponder={[Function]}
+                }
+                testID="bottom-sheet-close-icon"
+              >
+                <HeroIcon
+                  name="cancel"
                   style={
-                    {
-                      "backgroundColor": "#000000",
-                      "bottom": 0,
-                      "left": 0,
-                      "opacity": 0.48,
-                      "position": "absolute",
-                      "right": 0,
-                      "top": 0,
-                    }
+                    [
+                      {
+                        "color": "#001f23",
+                        "fontSize": 16,
+                      },
+                      undefined,
+                    ]
                   }
+                  themeIntent="text"
+                  themeSize="xsmall"
                 />
-                <RCTSafeAreaView
-                  collapsable={false}
-                  style={
+              </View>
+            </View>
+          </View>
+          <View
+            style={
+              [
+                {
+                  "height": 176,
+                },
+                undefined,
+              ]
+            }
+          >
+            <Picker
+              display="spinner"
+              mode="time"
+              onChange={[Function]}
+              style={
+                {
+                  "flex": 1,
+                }
+              }
+              testID="timePickerIOS"
+              textColor="#001f23"
+              value={1995-12-17T03:24:00.000Z}
+            />
+          </View>
+          <View>
+            <View
+              style={
+                [
+                  {
+                    "alignItems": "center",
+                    "flexDirection": "row",
+                    "justifyContent": "flex-end",
+                    "paddingHorizontal": 12,
+                    "paddingVertical": 2,
+                  },
+                  undefined,
+                ]
+              }
+            >
+              <View
+                accessibilityState={
+                  {
+                    "disabled": false,
+                  }
+                }
+                accessibilityValue={
+                  {
+                    "max": undefined,
+                    "min": undefined,
+                    "now": undefined,
+                    "text": undefined,
+                  }
+                }
+                accessible={true}
+                focusable={true}
+                onClick={[Function]}
+                onResponderGrant={[Function]}
+                onResponderMove={[Function]}
+                onResponderRelease={[Function]}
+                onResponderTerminate={[Function]}
+                onResponderTerminationRequest={[Function]}
+                onStartShouldSetResponder={[Function]}
+                style={
+                  [
                     {
-                      "backgroundColor": "#ffffff",
-                      "borderTopLeftRadius": 16,
-                      "borderTopRightRadius": 16,
-                      "elevation": 10,
-                      "maxHeight": "94%",
-                      "shadowColor": "#001f23",
-                      "shadowOffset": {
-                        "height": 3,
-                        "width": 0,
+                      "alignItems": "center",
+                      "backgroundColor": "transparent",
+                      "borderRadius": 4,
+                      "borderWidth": 0,
+                      "flexDirection": "row",
+                      "height": 60,
+                      "justifyContent": "center",
+                      "padding": 12,
+                    },
+                    undefined,
+                  ]
+                }
+              >
+                <Text
+                  allowFontScaling={false}
+                  disabled={false}
+                  ellipsizeMode="tail"
+                  numberOfLines={1}
+                  style={
+                    [
+                      {
+                        "color": "#001f23",
+                        "fontFamily": "BeVietnamPro-SemiBold",
+                        "fontSize": 16,
+                        "letterSpacing": 0.24,
+                        "lineHeight": 24,
                       },
-                      "shadowOpacity": 0.4,
-                      "shadowRadius": 16,
-                      "transform": [
-                        {
-                          "scaleY": 1,
-                        },
+                      [
                         {
-                          "translateY": 0,
+                          "color": "#401960",
+                          "flexShrink": 1,
+                          "lineHeight": 22,
+                          "textAlign": "center",
                         },
+                        undefined,
                       ],
-                      "width": "100%",
-                    }
+                    ]
                   }
+                  themeButtonVariant="text-primary"
+                  themeIntent="body"
+                  themeTypeface="neutral"
+                  themeVariant="regular-bold"
                 >
-                  <View
-                    style={
-                      [
-                        {
-                          "flexDirection": "row",
-                          "paddingHorizontal": 16,
-                          "paddingVertical": 8,
-                        },
-                        undefined,
-                      ]
-                    }
-                  >
-                    <View
-                      style={
-                        [
-                          {
-                            "flex": 1,
-                            "justifyContent": "center",
-                          },
-                          undefined,
-                        ]
-                      }
-                    >
-                      <Text
-                        allowFontScaling={false}
-                        style={
-                          [
-                            {
-                              "color": "#001f23",
-                              "fontFamily": "BeVietnamPro-SemiBold",
-                              "fontSize": 16,
-                              "letterSpacing": 0.24,
-                              "lineHeight": 24,
-                            },
-                            undefined,
-                          ]
-                        }
-                        themeIntent="body"
-                        themeTypeface="neutral"
-                        themeVariant="regular-bold"
-                      >
-                        Break time
-                      </Text>
-                    </View>
-                    <View
-                      style={
-                        [
-                          {
-                            "alignItems": "center",
-                            "height": 48,
-                            "justifyContent": "center",
-                            "marginLeft": 12,
-                            "width": 48,
-                          },
-                          undefined,
-                        ]
-                      }
-                    >
-                      <View
-                        accessibilityState={
-                          {
-                            "busy": undefined,
-                            "checked": undefined,
-                            "disabled": undefined,
-                            "expanded": undefined,
-                            "selected": undefined,
-                          }
-                        }
-                        accessibilityValue={
-                          {
-                            "max": undefined,
-                            "min": undefined,
-                            "now": undefined,
-                            "text": undefined,
-                          }
-                        }
-                        accessible={true}
-                        collapsable={false}
-                        focusable={true}
-                        onClick={[Function]}
-                        onResponderGrant={[Function]}
-                        onResponderMove={[Function]}
-                        onResponderRelease={[Function]}
-                        onResponderTerminate={[Function]}
-                        onResponderTerminationRequest={[Function]}
-                        onStartShouldSetResponder={[Function]}
-                        style={
-                          {
-                            "opacity": 1,
-                          }
-                        }
-                        testID="bottom-sheet-close-icon"
-                      >
-                        <HeroIcon
-                          name="cancel"
-                          style={
-                            [
-                              {
-                                "color": "#001f23",
-                                "fontSize": 16,
-                              },
-                              undefined,
-                            ]
-                          }
-                          themeIntent="text"
-                          themeSize="xsmall"
-                        />
-                      </View>
-                    </View>
-                  </View>
-                  <View
-                    style={
-                      [
-                        {
-                          "height": 176,
-                        },
-                        undefined,
-                      ]
-                    }
-                  >
-                    <Picker
-                      display="spinner"
-                      mode="time"
-                      onChange={[Function]}
-                      style={
-                        {
-                          "flex": 1,
-                        }
-                      }
-                      testID="timePickerIOS"
-                      textColor="#001f23"
-                      value={1995-12-17T03:24:00.000Z}
-                    />
-                  </View>
-                  <View>
-                    <View
-                      style={
-                        [
-                          {
-                            "alignItems": "center",
-                            "flexDirection": "row",
-                            "justifyContent": "flex-end",
-                            "paddingHorizontal": 12,
-                            "paddingVertical": 2,
-                          },
-                          undefined,
-                        ]
-                      }
-                    >
-                      <View
-                        accessibilityState={
-                          {
-                            "disabled": false,
-                          }
-                        }
-                        accessibilityValue={
-                          {
-                            "max": undefined,
-                            "min": undefined,
-                            "now": undefined,
-                            "text": undefined,
-                          }
-                        }
-                        accessible={true}
-                        focusable={true}
-                        onClick={[Function]}
-                        onResponderGrant={[Function]}
-                        onResponderMove={[Function]}
-                        onResponderRelease={[Function]}
-                        onResponderTerminate={[Function]}
-                        onResponderTerminationRequest={[Function]}
-                        onStartShouldSetResponder={[Function]}
-                        style={
-                          [
-                            {
-                              "alignItems": "center",
-                              "backgroundColor": "transparent",
-                              "borderRadius": 4,
-                              "borderWidth": 0,
-                              "flexDirection": "row",
-                              "height": 60,
-                              "justifyContent": "center",
-                              "padding": 12,
-                            },
-                            undefined,
-                          ]
-                        }
-                      >
-                        <Text
-                          allowFontScaling={false}
-                          disabled={false}
-                          ellipsizeMode="tail"
-                          numberOfLines={1}
-                          style={
-                            [
-                              {
-                                "color": "#001f23",
-                                "fontFamily": "BeVietnamPro-SemiBold",
-                                "fontSize": 16,
-                                "letterSpacing": 0.24,
-                                "lineHeight": 24,
-                              },
-                              [
-                                {
-                                  "color": "#401960",
-                                  "flexShrink": 1,
-                                  "lineHeight": 22,
-                                  "textAlign": "center",
-                                },
-                                undefined,
-                              ],
-                            ]
-                          }
-                          themeButtonVariant="text-primary"
-                          themeIntent="body"
-                          themeTypeface="neutral"
-                          themeVariant="regular-bold"
-                        >
-                          Confirm
-                        </Text>
-                      </View>
-                    </View>
-                  </View>
-                </RCTSafeAreaView>
+                  Confirm
+                </Text>
               </View>
             </View>
           </View>
-        </View>
+        </RCTSafeAreaView>
       </View>
-    </RCTModalHostView>
+    </View>
   </View>
   <View
     pointerEvents="box-none"
-    position="bottom"
     style={
       [
         {