@hero-design/rn 7.6.1-alpha.0 → 7.8.0

package/src/components/List/__tests__/__snapshots__/ListItem.spec.tsx.snap

@@ -0,0 +1,760 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`ListItem renders correctly ListItem with children 1`] = `
+<View
+  accessible={true}
+  collapsable={false}
+  focusable={false}
+  nativeID="animatedComponent"
+  onClick={[Function]}
+  onResponderGrant={[Function]}
+  onResponderMove={[Function]}
+  onResponderRelease={[Function]}
+  onResponderTerminate={[Function]}
+  onResponderTerminationRequest={[Function]}
+  onStartShouldSetResponder={[Function]}
+  style={
+    Object {
+      "backgroundColor": "#ffffff",
+      "flexDirection": "row",
+      "opacity": 1,
+      "padding": 16,
+    }
+  }
+>
+  <View
+    style={
+      Array [
+        Object {
+          "flex": 1,
+          "flexDirection": "column",
+          "flexGrow": 2,
+        },
+        undefined,
+      ]
+    }
+  >
+    <View
+      style={
+        Object {
+          "alignItems": "center",
+          "flexDirection": "row",
+        }
+      }
+    >
+      <View
+        style={
+          Array [
+            Object {
+              "marginRight": 8,
+            },
+            undefined,
+          ]
+        }
+      >
+        <View
+          style={
+            Array [
+              Object {
+                "borderColor": "#7622d7",
+                "borderRadius": 16,
+                "borderWidth": 1,
+                "height": 32,
+                "overflow": "hidden",
+                "width": 32,
+              },
+              undefined,
+            ]
+          }
+          themeIntent="primary"
+          themeSize="small"
+        >
+          <View
+            style={
+              Array [
+                Object {
+                  "alignItems": "center",
+                  "display": "flex",
+                  "height": "100%",
+                  "justifyContent": "center",
+                  "width": "100%",
+                },
+                undefined,
+              ]
+            }
+          >
+            <Text
+              style={
+                Array [
+                  Object {
+                    "color": "#7622d7",
+                    "fontSize": 16,
+                    "overflow": "hidden",
+                  },
+                  undefined,
+                ]
+              }
+              themeIntent="primary"
+              themeSize="small"
+            >
+              ML
+            </Text>
+          </View>
+        </View>
+      </View>
+      <View
+        style={
+          Array [
+            Object {
+              "flex": 1,
+            },
+            undefined,
+          ]
+        }
+      >
+        <Text
+          style={
+            Array [
+              Object {
+                "color": "#292a2b",
+                "fontFamily": "BeVietnamPro-SemiBold",
+                "fontSize": 16,
+                "letterSpacing": 0.48,
+                "lineHeight": 24,
+              },
+              undefined,
+            ]
+          }
+          themeFontSize="large"
+          themeFontWeight="semi-bold"
+          themeIntent="body"
+        >
+          Menu List
+        </Text>
+        <Text
+          style={
+            Array [
+              Object {
+                "color": "#8b8d92",
+                "fontFamily": "BeVietnamPro-Regular",
+                "fontSize": 12,
+                "letterSpacing": 0.36,
+                "lineHeight": 20,
+              },
+              undefined,
+            ]
+          }
+          themeFontSize="small"
+          themeFontWeight="regular"
+          themeIntent="subdued"
+        >
+          Got a common question?
+        </Text>
+      </View>
+      <View
+        style={
+          Array [
+            Object {
+              "marginLeft": 8,
+            },
+            undefined,
+          ]
+        }
+      >
+        <HeroIcon
+          name="arrow-right"
+          style={
+            Array [
+              Object {
+                "color": "#7622d7",
+                "fontSize": 20,
+              },
+              undefined,
+            ]
+          }
+          themeIntent="primary"
+          themeSize="small"
+        />
+      </View>
+    </View>
+    <View
+      style={
+        Array [
+          Object {
+            "alignItems": "flex-start",
+            "flexDirection": "column",
+            "justifyContent": "flex-start",
+          },
+          undefined,
+        ]
+      }
+    >
+      <View
+        style={
+          Object {
+            "alignSelf": "stretch",
+            "flexDirection": "row",
+            "justifyContent": "space-between",
+          }
+        }
+      >
+        <Text
+          style={
+            Array [
+              Object {
+                "color": "#292a2b",
+                "fontFamily": "BeVietnamPro-Regular",
+                "fontSize": 14,
+                "letterSpacing": 0.42,
+                "lineHeight": 22,
+              },
+              undefined,
+            ]
+          }
+          themeFontSize="medium"
+          themeFontWeight="regular"
+          themeIntent="body"
+        >
+          Gross pay
+        </Text>
+        <Text
+          style={
+            Array [
+              Object {
+                "color": "#292a2b",
+                "fontFamily": "BeVietnamPro-Regular",
+                "fontSize": 14,
+                "letterSpacing": 0.42,
+                "lineHeight": 22,
+              },
+              undefined,
+            ]
+          }
+          themeFontSize="medium"
+          themeFontWeight="regular"
+          themeIntent="body"
+        >
+          $1052.03
+        </Text>
+      </View>
+      <View
+        style={
+          Object {
+            "alignSelf": "stretch",
+            "flexDirection": "row",
+            "justifyContent": "space-between",
+          }
+        }
+      >
+        <Text
+          style={
+            Array [
+              Object {
+                "color": "#292a2b",
+                "fontFamily": "BeVietnamPro-Regular",
+                "fontSize": 14,
+                "letterSpacing": 0.42,
+                "lineHeight": 22,
+              },
+              undefined,
+            ]
+          }
+          themeFontSize="medium"
+          themeFontWeight="regular"
+          themeIntent="body"
+        >
+          Gross pay
+        </Text>
+        <Text
+          style={
+            Array [
+              Object {
+                "color": "#292a2b",
+                "fontFamily": "BeVietnamPro-Regular",
+                "fontSize": 14,
+                "letterSpacing": 0.42,
+                "lineHeight": 22,
+              },
+              undefined,
+            ]
+          }
+          themeFontSize="medium"
+          themeFontWeight="regular"
+          themeIntent="body"
+        >
+          $1052.03
+        </Text>
+      </View>
+    </View>
+  </View>
+</View>
+`;
+
+exports[`ListItem renders correctly ListItem with icon 1`] = `
+<View
+  accessible={true}
+  collapsable={false}
+  focusable={false}
+  nativeID="animatedComponent"
+  onClick={[Function]}
+  onResponderGrant={[Function]}
+  onResponderMove={[Function]}
+  onResponderRelease={[Function]}
+  onResponderTerminate={[Function]}
+  onResponderTerminationRequest={[Function]}
+  onStartShouldSetResponder={[Function]}
+  style={
+    Object {
+      "backgroundColor": "#ffffff",
+      "flexDirection": "row",
+      "opacity": 1,
+      "padding": 16,
+    }
+  }
+  testID="list-item"
+>
+  <View
+    style={
+      Array [
+        Object {
+          "flex": 1,
+          "flexDirection": "column",
+          "flexGrow": 2,
+        },
+        undefined,
+      ]
+    }
+  >
+    <View
+      style={
+        Object {
+          "alignItems": "center",
+          "flexDirection": "row",
+        }
+      }
+    >
+      <View
+        style={
+          Array [
+            Object {
+              "flex": 1,
+            },
+            undefined,
+          ]
+        }
+      >
+        <Text
+          style={
+            Array [
+              Object {
+                "color": "#292a2b",
+                "fontFamily": "BeVietnamPro-SemiBold",
+                "fontSize": 16,
+                "letterSpacing": 0.48,
+                "lineHeight": 24,
+              },
+              undefined,
+            ]
+          }
+          themeFontSize="large"
+          themeFontWeight="semi-bold"
+          themeIntent="body"
+        >
+          List item
+        </Text>
+        <Text
+          style={
+            Array [
+              Object {
+                "color": "#8b8d92",
+                "fontFamily": "BeVietnamPro-Regular",
+                "fontSize": 12,
+                "letterSpacing": 0.36,
+                "lineHeight": 20,
+              },
+              undefined,
+            ]
+          }
+          themeFontSize="small"
+          themeFontWeight="regular"
+          themeIntent="subdued"
+        >
+          subtitle
+        </Text>
+      </View>
+      <View
+        style={
+          Array [
+            Object {
+              "marginLeft": 8,
+            },
+            undefined,
+          ]
+        }
+      >
+        <HeroIcon
+          name="checkmark"
+          style={
+            Array [
+              Object {
+                "color": "#7622d7",
+                "fontSize": 20,
+              },
+              undefined,
+            ]
+          }
+          themeIntent="primary"
+          themeSize="small"
+        />
+      </View>
+    </View>
+  </View>
+</View>
+`;
+
+exports[`ListItem renders correctly ListItem with leading status 1`] = `
+<View
+  accessible={true}
+  collapsable={false}
+  focusable={false}
+  nativeID="animatedComponent"
+  onClick={[Function]}
+  onResponderGrant={[Function]}
+  onResponderMove={[Function]}
+  onResponderRelease={[Function]}
+  onResponderTerminate={[Function]}
+  onResponderTerminationRequest={[Function]}
+  onStartShouldSetResponder={[Function]}
+  style={
+    Object {
+      "backgroundColor": "#ffffff",
+      "flexDirection": "row",
+      "opacity": 1,
+      "padding": 16,
+    }
+  }
+>
+  <View
+    style={
+      Array [
+        Object {
+          "backgroundColor": "#ccced1",
+          "borderRadius": 999,
+          "marginRight": 8,
+          "width": 8,
+        },
+        undefined,
+      ]
+    }
+    testID="leadingStatus"
+    themeLeadingStatusIntent="archived"
+  />
+  <View
+    style={
+      Array [
+        Object {
+          "flex": 1,
+          "flexDirection": "column",
+          "flexGrow": 2,
+        },
+        undefined,
+      ]
+    }
+  >
+    <View
+      style={
+        Object {
+          "alignItems": "center",
+          "flexDirection": "row",
+        }
+      }
+    >
+      <View
+        style={
+          Array [
+            Object {
+              "flex": 1,
+            },
+            undefined,
+          ]
+        }
+      >
+        <Text
+          style={
+            Array [
+              Object {
+                "color": "#292a2b",
+                "fontFamily": "BeVietnamPro-SemiBold",
+                "fontSize": 16,
+                "letterSpacing": 0.48,
+                "lineHeight": 24,
+              },
+              undefined,
+            ]
+          }
+          themeFontSize="large"
+          themeFontWeight="semi-bold"
+          themeIntent="body"
+        >
+          03:00 PM - 9:00 PM
+        </Text>
+      </View>
+      <View
+        style={
+          Array [
+            Object {
+              "marginLeft": 8,
+            },
+            undefined,
+          ]
+        }
+      >
+        <HeroIcon
+          name="arrow-right"
+          style={
+            Array [
+              Object {
+                "color": "#7622d7",
+                "fontSize": 20,
+              },
+              undefined,
+            ]
+          }
+          themeIntent="primary"
+          themeSize="small"
+        />
+      </View>
+    </View>
+  </View>
+</View>
+`;
+
+exports[`ListItem renders correctly ListItem with prefix suffix is React.Element 1`] = `
+<View
+  accessible={true}
+  collapsable={false}
+  focusable={false}
+  nativeID="animatedComponent"
+  onClick={[Function]}
+  onResponderGrant={[Function]}
+  onResponderMove={[Function]}
+  onResponderRelease={[Function]}
+  onResponderTerminate={[Function]}
+  onResponderTerminationRequest={[Function]}
+  onStartShouldSetResponder={[Function]}
+  style={
+    Object {
+      "backgroundColor": "#ffffff",
+      "flexDirection": "row",
+      "opacity": 1,
+      "padding": 16,
+    }
+  }
+  testID="list-item"
+>
+  <View
+    style={
+      Array [
+        Object {
+          "flex": 1,
+          "flexDirection": "column",
+          "flexGrow": 2,
+        },
+        undefined,
+      ]
+    }
+  >
+    <View
+      style={
+        Object {
+          "alignItems": "center",
+          "flexDirection": "row",
+        }
+      }
+    >
+      <View
+        style={
+          Array [
+            Object {
+              "marginRight": 8,
+            },
+            undefined,
+          ]
+        }
+      >
+        <View
+          style={
+            Array [
+              Object {
+                "borderColor": "#7622d7",
+                "borderRadius": 16,
+                "borderWidth": 1,
+                "height": 32,
+                "overflow": "hidden",
+                "width": 32,
+              },
+              undefined,
+            ]
+          }
+          themeIntent="primary"
+          themeSize="small"
+        >
+          <View
+            style={
+              Array [
+                Object {
+                  "alignItems": "center",
+                  "display": "flex",
+                  "height": "100%",
+                  "justifyContent": "center",
+                  "width": "100%",
+                },
+                undefined,
+              ]
+            }
+          >
+            <Text
+              style={
+                Array [
+                  Object {
+                    "color": "#7622d7",
+                    "fontSize": 16,
+                    "overflow": "hidden",
+                  },
+                  undefined,
+                ]
+              }
+              themeIntent="primary"
+              themeSize="small"
+            >
+              ML
+            </Text>
+          </View>
+        </View>
+      </View>
+      <View
+        style={
+          Array [
+            Object {
+              "flex": 1,
+            },
+            undefined,
+          ]
+        }
+      >
+        <Text
+          style={
+            Array [
+              Object {
+                "color": "#292a2b",
+                "fontFamily": "BeVietnamPro-SemiBold",
+                "fontSize": 16,
+                "letterSpacing": 0.48,
+                "lineHeight": 24,
+              },
+              undefined,
+            ]
+          }
+          themeFontSize="large"
+          themeFontWeight="semi-bold"
+          themeIntent="body"
+        >
+          List item
+        </Text>
+        <Text
+          style={
+            Array [
+              Object {
+                "color": "#8b8d92",
+                "fontFamily": "BeVietnamPro-Regular",
+                "fontSize": 12,
+                "letterSpacing": 0.36,
+                "lineHeight": 20,
+              },
+              undefined,
+            ]
+          }
+          themeFontSize="small"
+          themeFontWeight="regular"
+          themeIntent="subdued"
+        >
+          subtitle
+        </Text>
+      </View>
+      <View
+        style={
+          Array [
+            Object {
+              "marginLeft": 8,
+            },
+            undefined,
+          ]
+        }
+      >
+        <View
+          accessibilityState={
+            Object {
+              "disabled": false,
+            }
+          }
+          accessible={true}
+          focusable={false}
+          onClick={[Function]}
+          onResponderGrant={[Function]}
+          onResponderMove={[Function]}
+          onResponderRelease={[Function]}
+          onResponderTerminate={[Function]}
+          onResponderTerminationRequest={[Function]}
+          onStartShouldSetResponder={[Function]}
+          style={
+            Array [
+              Object {
+                "backgroundColor": "#7622d7",
+                "borderRadius": 999,
+                "height": 28.799999999999997,
+                "paddingHorizontal": 4,
+                "width": 56,
+              },
+              undefined,
+            ]
+          }
+          testID="switch"
+          themeChecked={true}
+          themeSize="medium"
+        >
+          <View
+            style={
+              Array [
+                Object {
+                  "borderRadius": 999,
+                  "display": "flex",
+                  "height": 28.799999999999997,
+                  "justifyContent": "center",
+                  "width": 56,
+                },
+                undefined,
+              ]
+            }
+            themeSize="medium"
+          >
+            <View
+              collapsable={false}
+              nativeID="animatedComponent"
+              style={
+                Object {
+                  "backgroundColor": "#ffffff",
+                  "borderRadius": 999,
+                  "height": 20.8,
+                  "left": 27.200000000000003,
+                  "width": 20.8,
+                }
+              }
+              themeSize="medium"
+            />
+          </View>
+        </View>
+      </View>
+    </View>
+  </View>
+</View>
+`;