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

package/src/components/Toast/__tests__/__snapshots__/Toast.spec.tsx.snap

@@ -0,0 +1,655 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Toast Icon render custom icon correctly 1`] = `
+<View
+  collapsable={false}
+  nativeID="animatedComponent"
+  style={
+    Object {
+      "backgroundColor": "#1dbeee",
+      "borderRadius": 0,
+      "flexDirection": "row",
+      "minHeight": 48,
+      "opacity": 0,
+      "transform": Array [
+        Object {
+          "translateY": 20,
+        },
+      ],
+    }
+  }
+  themeIntent="info"
+  themeVariant="default"
+>
+  <View
+    showDivider={false}
+    style={
+      Array [
+        Object {
+          "borderColor": "#fafbfb",
+          "borderRightWidth": 0,
+          "flex": 1,
+          "flexDirection": "row",
+          "paddingVertical": 16,
+        },
+        undefined,
+      ]
+    }
+  >
+    <View
+      style={
+        Array [
+          Object {
+            "alignItems": "center",
+            "paddingLeft": 16,
+          },
+          undefined,
+        ]
+      }
+      testID="toast-left-icon"
+    >
+      <HeroIcon
+        name="home"
+        style={
+          Array [
+            Object {
+              "color": "#292a2b",
+              "fontSize": 20,
+            },
+            undefined,
+          ]
+        }
+        themeIntent="text"
+        themeSize="small"
+      />
+    </View>
+    <View
+      style={
+        Array [
+          Object {
+            "flex": 1,
+            "paddingHorizontal": 16,
+          },
+          undefined,
+        ]
+      }
+    >
+      <Text
+        style={
+          Array [
+            Object {
+              "color": "#292a2b",
+              "fontFamily": "BeVietnamPro-Regular",
+              "fontSize": 14,
+              "letterSpacing": 0.42,
+              "lineHeight": 22,
+            },
+            undefined,
+          ]
+        }
+        themeFontSize="medium"
+        themeFontWeight="regular"
+        themeIntent="body"
+      >
+        Content
+      </Text>
+    </View>
+  </View>
+</View>
+`;
+
+exports[`Toast renders correctly when intent is error 1`] = `
+<View
+  collapsable={false}
+  nativeID="animatedComponent"
+  style={
+    Object {
+      "backgroundColor": "#de350b",
+      "borderRadius": 0,
+      "flexDirection": "row",
+      "minHeight": 48,
+      "opacity": 0,
+      "transform": Array [
+        Object {
+          "translateY": 20,
+        },
+      ],
+    }
+  }
+  themeIntent="error"
+  themeVariant="default"
+>
+  <View
+    showDivider={true}
+    style={
+      Array [
+        Object {
+          "borderColor": "#fafbfb",
+          "borderRightWidth": 1,
+          "flex": 1,
+          "flexDirection": "row",
+          "paddingVertical": 16,
+        },
+        undefined,
+      ]
+    }
+  >
+    <View
+      style={
+        Array [
+          Object {
+            "alignItems": "center",
+            "paddingLeft": 16,
+          },
+          undefined,
+        ]
+      }
+      testID="toast-left-icon"
+    >
+      <HeroIcon
+        name="circle-warning"
+        style={
+          Array [
+            Object {
+              "color": "#292a2b",
+              "fontSize": 20,
+            },
+            undefined,
+          ]
+        }
+        themeIntent="text"
+        themeSize="small"
+      />
+    </View>
+    <View
+      style={
+        Array [
+          Object {
+            "flex": 1,
+            "paddingHorizontal": 16,
+          },
+          undefined,
+        ]
+      }
+    >
+      <Text
+        style={
+          Array [
+            Object {
+              "color": "#292a2b",
+              "fontFamily": "BeVietnamPro-Regular",
+              "fontSize": 14,
+              "letterSpacing": 0.42,
+              "lineHeight": 22,
+            },
+            undefined,
+          ]
+        }
+        themeFontSize="medium"
+        themeFontWeight="regular"
+        themeIntent="body"
+      >
+        Toast Content
+      </Text>
+    </View>
+  </View>
+  <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 {
+        "justifyContent": "center",
+        "opacity": 1,
+        "paddingHorizontal": 16,
+      }
+    }
+    testID="toast-action-button"
+  >
+    <Text
+      style={
+        Array [
+          Object {
+            "color": "#292a2b",
+            "fontFamily": "BeVietnamPro-SemiBold",
+            "fontSize": 14,
+            "letterSpacing": 0.42,
+            "lineHeight": 22,
+          },
+          undefined,
+        ]
+      }
+      themeFontSize="medium"
+      themeFontWeight="semi-bold"
+      themeIntent="body"
+    >
+      Action
+    </Text>
+  </View>
+</View>
+`;
+
+exports[`Toast renders correctly when intent is info 1`] = `
+<View
+  collapsable={false}
+  nativeID="animatedComponent"
+  style={
+    Object {
+      "backgroundColor": "#1dbeee",
+      "borderRadius": 0,
+      "flexDirection": "row",
+      "minHeight": 48,
+      "opacity": 0,
+      "transform": Array [
+        Object {
+          "translateY": 20,
+        },
+      ],
+    }
+  }
+  themeIntent="info"
+  themeVariant="default"
+>
+  <View
+    showDivider={true}
+    style={
+      Array [
+        Object {
+          "borderColor": "#fafbfb",
+          "borderRightWidth": 1,
+          "flex": 1,
+          "flexDirection": "row",
+          "paddingVertical": 16,
+        },
+        undefined,
+      ]
+    }
+  >
+    <View
+      style={
+        Array [
+          Object {
+            "alignItems": "center",
+            "paddingLeft": 16,
+          },
+          undefined,
+        ]
+      }
+      testID="toast-left-icon"
+    >
+      <HeroIcon
+        name="circle-info"
+        style={
+          Array [
+            Object {
+              "color": "#292a2b",
+              "fontSize": 20,
+            },
+            undefined,
+          ]
+        }
+        themeIntent="text"
+        themeSize="small"
+      />
+    </View>
+    <View
+      style={
+        Array [
+          Object {
+            "flex": 1,
+            "paddingHorizontal": 16,
+          },
+          undefined,
+        ]
+      }
+    >
+      <Text
+        style={
+          Array [
+            Object {
+              "color": "#292a2b",
+              "fontFamily": "BeVietnamPro-Regular",
+              "fontSize": 14,
+              "letterSpacing": 0.42,
+              "lineHeight": 22,
+            },
+            undefined,
+          ]
+        }
+        themeFontSize="medium"
+        themeFontWeight="regular"
+        themeIntent="body"
+      >
+        Toast Content
+      </Text>
+    </View>
+  </View>
+  <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 {
+        "justifyContent": "center",
+        "opacity": 1,
+        "paddingHorizontal": 16,
+      }
+    }
+    testID="toast-action-button"
+  >
+    <Text
+      style={
+        Array [
+          Object {
+            "color": "#292a2b",
+            "fontFamily": "BeVietnamPro-SemiBold",
+            "fontSize": 14,
+            "letterSpacing": 0.42,
+            "lineHeight": 22,
+          },
+          undefined,
+        ]
+      }
+      themeFontSize="medium"
+      themeFontWeight="semi-bold"
+      themeIntent="body"
+    >
+      Action
+    </Text>
+  </View>
+</View>
+`;
+
+exports[`Toast renders correctly when intent is success 1`] = `
+<View
+  collapsable={false}
+  nativeID="animatedComponent"
+  style={
+    Object {
+      "backgroundColor": "#01b39c",
+      "borderRadius": 0,
+      "flexDirection": "row",
+      "minHeight": 48,
+      "opacity": 0,
+      "transform": Array [
+        Object {
+          "translateY": 20,
+        },
+      ],
+    }
+  }
+  themeIntent="success"
+  themeVariant="default"
+>
+  <View
+    showDivider={true}
+    style={
+      Array [
+        Object {
+          "borderColor": "#fafbfb",
+          "borderRightWidth": 1,
+          "flex": 1,
+          "flexDirection": "row",
+          "paddingVertical": 16,
+        },
+        undefined,
+      ]
+    }
+  >
+    <View
+      style={
+        Array [
+          Object {
+            "alignItems": "center",
+            "paddingLeft": 16,
+          },
+          undefined,
+        ]
+      }
+      testID="toast-left-icon"
+    >
+      <HeroIcon
+        name="circle-ok"
+        style={
+          Array [
+            Object {
+              "color": "#292a2b",
+              "fontSize": 20,
+            },
+            undefined,
+          ]
+        }
+        themeIntent="text"
+        themeSize="small"
+      />
+    </View>
+    <View
+      style={
+        Array [
+          Object {
+            "flex": 1,
+            "paddingHorizontal": 16,
+          },
+          undefined,
+        ]
+      }
+    >
+      <Text
+        style={
+          Array [
+            Object {
+              "color": "#292a2b",
+              "fontFamily": "BeVietnamPro-Regular",
+              "fontSize": 14,
+              "letterSpacing": 0.42,
+              "lineHeight": 22,
+            },
+            undefined,
+          ]
+        }
+        themeFontSize="medium"
+        themeFontWeight="regular"
+        themeIntent="body"
+      >
+        Toast Content
+      </Text>
+    </View>
+  </View>
+  <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 {
+        "justifyContent": "center",
+        "opacity": 1,
+        "paddingHorizontal": 16,
+      }
+    }
+    testID="toast-action-button"
+  >
+    <Text
+      style={
+        Array [
+          Object {
+            "color": "#292a2b",
+            "fontFamily": "BeVietnamPro-SemiBold",
+            "fontSize": 14,
+            "letterSpacing": 0.42,
+            "lineHeight": 22,
+          },
+          undefined,
+        ]
+      }
+      themeFontSize="medium"
+      themeFontWeight="semi-bold"
+      themeIntent="body"
+    >
+      Action
+    </Text>
+  </View>
+</View>
+`;
+
+exports[`Toast renders correctly when intent is warning 1`] = `
+<View
+  collapsable={false}
+  nativeID="animatedComponent"
+  style={
+    Object {
+      "backgroundColor": "#ffa234",
+      "borderRadius": 0,
+      "flexDirection": "row",
+      "minHeight": 48,
+      "opacity": 0,
+      "transform": Array [
+        Object {
+          "translateY": 20,
+        },
+      ],
+    }
+  }
+  themeIntent="warning"
+  themeVariant="default"
+>
+  <View
+    showDivider={true}
+    style={
+      Array [
+        Object {
+          "borderColor": "#fafbfb",
+          "borderRightWidth": 1,
+          "flex": 1,
+          "flexDirection": "row",
+          "paddingVertical": 16,
+        },
+        undefined,
+      ]
+    }
+  >
+    <View
+      style={
+        Array [
+          Object {
+            "alignItems": "center",
+            "paddingLeft": 16,
+          },
+          undefined,
+        ]
+      }
+      testID="toast-left-icon"
+    >
+      <HeroIcon
+        name="warning"
+        style={
+          Array [
+            Object {
+              "color": "#292a2b",
+              "fontSize": 20,
+            },
+            undefined,
+          ]
+        }
+        themeIntent="text"
+        themeSize="small"
+      />
+    </View>
+    <View
+      style={
+        Array [
+          Object {
+            "flex": 1,
+            "paddingHorizontal": 16,
+          },
+          undefined,
+        ]
+      }
+    >
+      <Text
+        style={
+          Array [
+            Object {
+              "color": "#292a2b",
+              "fontFamily": "BeVietnamPro-Regular",
+              "fontSize": 14,
+              "letterSpacing": 0.42,
+              "lineHeight": 22,
+            },
+            undefined,
+          ]
+        }
+        themeFontSize="medium"
+        themeFontWeight="regular"
+        themeIntent="body"
+      >
+        Toast Content
+      </Text>
+    </View>
+  </View>
+  <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 {
+        "justifyContent": "center",
+        "opacity": 1,
+        "paddingHorizontal": 16,
+      }
+    }
+    testID="toast-action-button"
+  >
+    <Text
+      style={
+        Array [
+          Object {
+            "color": "#292a2b",
+            "fontFamily": "BeVietnamPro-SemiBold",
+            "fontSize": 14,
+            "letterSpacing": 0.42,
+            "lineHeight": 22,
+          },
+          undefined,
+        ]
+      }
+      themeFontSize="medium"
+      themeFontWeight="semi-bold"
+      themeIntent="body"
+    >
+      Action
+    </Text>
+  </View>
+</View>
+`;