@hero-design/rn 7.2.2 → 7.3.2

package/src/components/Tabs/__tests__/__snapshots__/ScrollableTabs.spec.tsx.snap

@@ -0,0 +1,591 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Tabs.Scroll renders correctly 1`] = `
+<RNCSafeAreaProvider
+  onInsetsChange={[Function]}
+  style={
+    Array [
+      Object {
+        "flex": 1,
+      },
+      undefined,
+    ]
+  }
+>
+  <View
+    style={
+      Array [
+        Object {
+          "flex": 1,
+          "overflow": "hidden",
+        },
+        undefined,
+      ]
+    }
+  >
+    <View
+      style={
+        Array [
+          Object {
+            "borderBottomColor": "#dadbde",
+            "borderBottomWidth": 1,
+            "paddingHorizontal": 0,
+          },
+          undefined,
+        ]
+      }
+      themeInsets={
+        Object {
+          "bottom": 0,
+          "left": 0,
+          "right": 0,
+          "top": 0,
+        }
+      }
+    >
+      <RCTScrollView
+        contentContainerStyle={
+          Object {
+            "paddingHorizontal": 8,
+          }
+        }
+        data={
+          Array [
+            Object {
+              "activeItem": "Work",
+              "component": <Text>
+                Work Screen
+              </Text>,
+              "key": "work",
+            },
+            Object {
+              "activeItem": "speaker",
+              "component": <Text>
+                Personal Screen
+              </Text>,
+              "inactiveItem": "speaker-outlined",
+              "key": "personal",
+            },
+            Object {
+              "activeItem": "home",
+              "component": <Text>
+                Home Screen
+              </Text>,
+              "inactiveItem": "home-outlined",
+              "key": "home",
+              "showBadge": true,
+            },
+          ]
+        }
+        getItem={[Function]}
+        getItemCount={[Function]}
+        horizontal={true}
+        keyExtractor={[Function]}
+        onContentSizeChange={[Function]}
+        onLayout={[Function]}
+        onMomentumScrollBegin={[Function]}
+        onMomentumScrollEnd={[Function]}
+        onScroll={[Function]}
+        onScrollBeginDrag={[Function]}
+        onScrollEndDrag={[Function]}
+        onScrollToIndexFailed={[Function]}
+        removeClippedSubviews={false}
+        renderItem={[Function]}
+        scrollEventThrottle={50}
+        showsHorizontalScrollIndicator={false}
+        stickyHeaderIndices={Array []}
+        viewabilityConfigCallbackPairs={Array []}
+      >
+        <View>
+          <View
+            onLayout={[Function]}
+            style={
+              Array [
+                Object {
+                  "flexDirection": "row",
+                },
+                null,
+              ]
+            }
+          >
+            <View
+              accessible={true}
+              collapsable={false}
+              focusable={true}
+              nativeID="animatedComponent"
+              onClick={[Function]}
+              onResponderGrant={[Function]}
+              onResponderMove={[Function]}
+              onResponderRelease={[Function]}
+              onResponderTerminate={[Function]}
+              onResponderTerminationRequest={[Function]}
+              onStartShouldSetResponder={[Function]}
+              style={
+                Object {
+                  "paddingHorizontal": 8,
+                  "paddingVertical": 8,
+                }
+              }
+            >
+              <View
+                style={
+                  Array [
+                    Object {
+                      "bottom": 0,
+                      "left": 0,
+                      "paddingHorizontal": 8,
+                      "paddingVertical": 8,
+                      "position": "absolute",
+                      "right": 0,
+                      "top": 0,
+                    },
+                    undefined,
+                  ]
+                }
+              >
+                <View
+                  collapsable={false}
+                  nativeID="animatedComponent"
+                  style={
+                    Object {
+                      "backgroundColor": "#f1e9fb",
+                      "borderRadius": 8,
+                      "flex": 1,
+                      "transform": Array [
+                        Object {
+                          "scaleX": 1,
+                        },
+                      ],
+                    }
+                  }
+                  themeActive={true}
+                />
+              </View>
+              <View
+                style={
+                  Array [
+                    Object {
+                      "paddingHorizontal": 8,
+                      "paddingVertical": 4,
+                    },
+                    undefined,
+                  ]
+                }
+              >
+                <View>
+                  <Text
+                    numberOfLines={1}
+                    style={
+                      Array [
+                        Object {
+                          "color": "#292a2b",
+                          "fontFamily": "BeVietnamPro-SemiBold",
+                          "fontSize": 14,
+                          "letterSpacing": 0.42,
+                          "lineHeight": 22,
+                        },
+                        Object {
+                          "color": "#7622d7",
+                        },
+                      ]
+                    }
+                    themeFontSize="medium"
+                    themeFontWeight="semi-bold"
+                    themeIntent="body"
+                  >
+                    Work
+                  </Text>
+                  <View
+                    collapsable={false}
+                    nativeID="animatedComponent"
+                    style={
+                      Object {
+                        "backgroundColor": "#de350b",
+                        "borderRadius": 999,
+                        "height": 8,
+                        "opacity": 0,
+                        "position": "absolute",
+                        "right": -2,
+                        "top": -2,
+                        "transform": Array [
+                          Object {
+                            "scale": 0.5,
+                          },
+                        ],
+                        "width": 8,
+                      }
+                    }
+                    themeIntent="danger"
+                  />
+                </View>
+              </View>
+            </View>
+          </View>
+          <View
+            onLayout={[Function]}
+            style={
+              Array [
+                Object {
+                  "flexDirection": "row",
+                },
+                null,
+              ]
+            }
+          >
+            <View
+              accessible={true}
+              collapsable={false}
+              focusable={true}
+              nativeID="animatedComponent"
+              onClick={[Function]}
+              onResponderGrant={[Function]}
+              onResponderMove={[Function]}
+              onResponderRelease={[Function]}
+              onResponderTerminate={[Function]}
+              onResponderTerminationRequest={[Function]}
+              onStartShouldSetResponder={[Function]}
+              style={
+                Object {
+                  "paddingHorizontal": 8,
+                  "paddingVertical": 8,
+                }
+              }
+            >
+              <View
+                style={
+                  Array [
+                    Object {
+                      "bottom": 0,
+                      "left": 0,
+                      "paddingHorizontal": 8,
+                      "paddingVertical": 8,
+                      "position": "absolute",
+                      "right": 0,
+                      "top": 0,
+                    },
+                    undefined,
+                  ]
+                }
+              >
+                <View
+                  collapsable={false}
+                  nativeID="animatedComponent"
+                  style={
+                    Object {
+                      "backgroundColor": undefined,
+                      "borderRadius": 8,
+                      "flex": 1,
+                      "transform": Array [
+                        Object {
+                          "scaleX": 0,
+                        },
+                      ],
+                    }
+                  }
+                  themeActive={false}
+                />
+              </View>
+              <View
+                style={
+                  Array [
+                    Object {
+                      "paddingHorizontal": 8,
+                      "paddingVertical": 4,
+                    },
+                    undefined,
+                  ]
+                }
+              >
+                <View>
+                  <HeroIcon
+                    name="speaker-outlined"
+                    style={
+                      Array [
+                        Object {
+                          "color": "#292a2b",
+                          "fontSize": 20,
+                        },
+                        undefined,
+                      ]
+                    }
+                    testID="hero-icon-speaker-outlined"
+                    themeIntent="text"
+                    themeSize="small"
+                  />
+                  <View
+                    collapsable={false}
+                    nativeID="animatedComponent"
+                    style={
+                      Object {
+                        "backgroundColor": "#de350b",
+                        "borderRadius": 999,
+                        "height": 8,
+                        "opacity": 0,
+                        "position": "absolute",
+                        "right": -2,
+                        "top": -2,
+                        "transform": Array [
+                          Object {
+                            "scale": 0.5,
+                          },
+                        ],
+                        "width": 8,
+                      }
+                    }
+                    themeIntent="danger"
+                  />
+                </View>
+              </View>
+            </View>
+          </View>
+          <View
+            onLayout={[Function]}
+            style={
+              Array [
+                Object {
+                  "flexDirection": "row",
+                },
+                null,
+              ]
+            }
+          >
+            <View
+              accessible={true}
+              collapsable={false}
+              focusable={true}
+              nativeID="animatedComponent"
+              onClick={[Function]}
+              onResponderGrant={[Function]}
+              onResponderMove={[Function]}
+              onResponderRelease={[Function]}
+              onResponderTerminate={[Function]}
+              onResponderTerminationRequest={[Function]}
+              onStartShouldSetResponder={[Function]}
+              style={
+                Object {
+                  "paddingHorizontal": 8,
+                  "paddingVertical": 8,
+                }
+              }
+            >
+              <View
+                style={
+                  Array [
+                    Object {
+                      "bottom": 0,
+                      "left": 0,
+                      "paddingHorizontal": 8,
+                      "paddingVertical": 8,
+                      "position": "absolute",
+                      "right": 0,
+                      "top": 0,
+                    },
+                    undefined,
+                  ]
+                }
+              >
+                <View
+                  collapsable={false}
+                  nativeID="animatedComponent"
+                  style={
+                    Object {
+                      "backgroundColor": undefined,
+                      "borderRadius": 8,
+                      "flex": 1,
+                      "transform": Array [
+                        Object {
+                          "scaleX": 0,
+                        },
+                      ],
+                    }
+                  }
+                  themeActive={false}
+                />
+              </View>
+              <View
+                style={
+                  Array [
+                    Object {
+                      "paddingHorizontal": 8,
+                      "paddingVertical": 4,
+                    },
+                    undefined,
+                  ]
+                }
+              >
+                <View>
+                  <HeroIcon
+                    name="home-outlined"
+                    style={
+                      Array [
+                        Object {
+                          "color": "#292a2b",
+                          "fontSize": 20,
+                        },
+                        undefined,
+                      ]
+                    }
+                    testID="hero-icon-home-outlined"
+                    themeIntent="text"
+                    themeSize="small"
+                  />
+                  <View
+                    collapsable={false}
+                    nativeID="animatedComponent"
+                    style={
+                      Object {
+                        "backgroundColor": "#de350b",
+                        "borderRadius": 999,
+                        "height": 8,
+                        "opacity": 1,
+                        "position": "absolute",
+                        "right": -2,
+                        "top": -2,
+                        "transform": Array [
+                          Object {
+                            "scale": 1,
+                          },
+                        ],
+                        "width": 8,
+                      }
+                    }
+                    themeIntent="danger"
+                  />
+                </View>
+              </View>
+            </View>
+          </View>
+        </View>
+      </RCTScrollView>
+    </View>
+    <RNCViewPager
+      layoutDirection="ltr"
+      onMoveShouldSetResponderCapture={[Function]}
+      onPageScroll={[Function]}
+      onPageScrollStateChanged={[Function]}
+      onPageSelected={[Function]}
+    >
+      <View
+        collapsable={false}
+        style={
+          Object {
+            "bottom": 0,
+            "left": 0,
+            "position": "absolute",
+            "right": 0,
+            "top": 0,
+          }
+        }
+      >
+        <View
+          accessibilityElementsHidden={false}
+          collapsable={false}
+          importantForAccessibility="auto"
+          pointerEvents="auto"
+          style={
+            Array [
+              Object {
+                "flex": 1,
+              },
+              Array [
+                undefined,
+                Object {
+                  "bottom": 0,
+                  "left": 0,
+                  "position": "absolute",
+                  "right": 0,
+                  "top": 0,
+                },
+              ],
+            ]
+          }
+        >
+          <Text>
+            Work Screen
+          </Text>
+        </View>
+      </View>
+      <View
+        collapsable={false}
+        style={
+          Object {
+            "bottom": 0,
+            "left": 0,
+            "position": "absolute",
+            "right": 0,
+            "top": 0,
+          }
+        }
+      >
+        <View
+          accessibilityElementsHidden={true}
+          collapsable={false}
+          importantForAccessibility="no-hide-descendants"
+          pointerEvents="none"
+          style={
+            Array [
+              Object {
+                "flex": 1,
+              },
+              Array [
+                undefined,
+                Object {
+                  "bottom": 0,
+                  "left": 0,
+                  "position": "absolute",
+                  "right": 0,
+                  "top": 0,
+                },
+              ],
+            ]
+          }
+        >
+          <Text>
+            Personal Screen
+          </Text>
+        </View>
+      </View>
+      <View
+        collapsable={false}
+        style={
+          Object {
+            "bottom": 0,
+            "left": 0,
+            "position": "absolute",
+            "right": 0,
+            "top": 0,
+          }
+        }
+      >
+        <View
+          accessibilityElementsHidden={true}
+          collapsable={false}
+          importantForAccessibility="no-hide-descendants"
+          pointerEvents="none"
+          style={
+            Array [
+              Object {
+                "flex": 1,
+              },
+              Array [
+                undefined,
+                Object {
+                  "bottom": 0,
+                  "left": 0,
+                  "position": "absolute",
+                  "right": 0,
+                  "top": 0,
+                },
+              ],
+            ]
+          }
+        >
+          <Text>
+            Home Screen
+          </Text>
+        </View>
+      </View>
+    </RNCViewPager>
+  </View>
+</RNCSafeAreaProvider>
+`;