ListItem.js.snap

// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`ListItem component should apply values from theme 1`] = `
<View
  replaceTheme={[Function]}
  updateTheme={[Function]}
>
  <View
    style={
      Object {
        "alignItems": "center",
        "backgroundColor": "white",
        "borderColor": "#bcbbc1",
        "flexDirection": "row",
        "padding": 14,
      }
    }
  >
    <View
      style={
        Object {
          "flex": 1,
          "justifyContent": "center",
        }
      }
    >
      <Text
        replaceTheme={[Function]}
        style={
          Object {
            "backgroundColor": "transparent",
            "fontSize": 17,
          }
        }
        testID="listItemTitle"
        theme={
          Object {
            "ListItem": Object {
              "title": "List Title",
            },
            "colors": Object {
              "disabled": "hsl(208, 8%, 90%)",
              "divider": "#bcbbc1",
              "error": "#ff190c",
              "grey0": "#393e42",
              "grey1": "#43484d",
              "grey2": "#5e6977",
              "grey3": "#86939e",
              "grey4": "#bdc6cf",
              "grey5": "#e1e8ee",
              "greyOutline": "#bbb",
              "platform": Object {
                "android": Object {
                  "error": "#f44336",
                  "primary": "#2196f3",
                  "secondary": "#9C27B0",
                  "success": "#4caf50",
                  "warning": "#ffeb3b",
                },
                "ios": Object {
                  "error": "#ff3b30",
                  "primary": "#007aff",
                  "secondary": "#5856d6",
                  "success": "#4cd964",
                  "warning": "#ffcc00",
                },
              },
              "primary": "#2089dc",
              "searchBg": "#303337",
              "secondary": "#8F0CE8",
              "success": "#52c41a",
              "warning": "#faad14",
            },
          }
        }
        updateTheme={[Function]}
      >
        List Title
      </Text>
    </View>
  </View>
</View>
`;

exports[`ListItem component should render with avatar 1`] = `
<View
  avatar={
    Object {
      "source": "avatar_uri",
    }
  }
>
  <PadView
    Component={[Function]}
    pad={16}
    style={
      Object {
        "alignItems": "center",
        "backgroundColor": "peru",
        "borderColor": "#bcbbc1",
        "flexDirection": "row",
        "padding": 14,
      }
    }
  >
    <View
      style={
        Object {
          "flex": 1,
          "justifyContent": "center",
        }
      }
    >
      <Themed.Text
        style={
          Object {
            "backgroundColor": "transparent",
            "fontSize": 17,
          }
        }
        testID="listItemTitle"
      />
    </View>
  </PadView>
</View>
`;

exports[`ListItem component should render with input 1`] = `
<View>
  <PadView
    Component={[Function]}
    pad={16}
    style={
      Object {
        "alignItems": "center",
        "backgroundColor": "white",
        "borderColor": "#bcbbc1",
        "flexDirection": "row",
        "padding": 14,
      }
    }
  >
    <View
      style={
        Object {
          "flex": 1,
          "justifyContent": "center",
        }
      }
    >
      <Themed.Text
        style={
          Object {
            "backgroundColor": "transparent",
            "fontSize": 17,
          }
        }
        testID="listItemTitle"
      />
    </View>
    <ForwardRef(Themed.Input)
      containerStyle={
        Object {
          "flex": 1,
          "paddingRight": 0,
        }
      }
      inputContainerStyle={
        Object {
          "borderBottomWidth": 0,
          "flex": 1,
          "height": null,
          "width": null,
        }
      }
      inputStyle={
        Object {
          "flex": 1,
          "height": null,
          "textAlign": "right",
          "width": null,
        }
      }
      placeholder="Enter Text"
    />
  </PadView>
</View>
`;

exports[`ListItem component should render with left icon 1`] = `
<View>
  <PadView
    Component={[Function]}
    pad={16}
    style={
      Object {
        "alignItems": "center",
        "backgroundColor": "white",
        "borderColor": "#bcbbc1",
        "flexDirection": "row",
        "padding": 14,
      }
    }
  >
    <Themed.Icon
      color="red"
      name="wifi"
      size={20}
      type="font-awesome"
    />
    <View
      style={
        Object {
          "flex": 1,
          "justifyContent": "center",
        }
      }
    >
      <Themed.Text
        style={
          Object {
            "backgroundColor": "transparent",
            "fontSize": 17,
          }
        }
        testID="listItemTitle"
      />
    </View>
  </PadView>
</View>
`;

exports[`ListItem component should render with left icon component 1`] = `
<View>
  <PadView
    Component={[Function]}
    pad={16}
    style={
      Object {
        "alignItems": "center",
        "backgroundColor": "white",
        "borderColor": "#bcbbc1",
        "flexDirection": "row",
        "padding": 14,
      }
    }
  >
    <Text>
      I'm left icon
    </Text>
    <View
      style={
        Object {
          "flex": 1,
          "justifyContent": "center",
        }
      }
    >
      <Themed.Text
        style={
          Object {
            "backgroundColor": "transparent",
            "fontSize": 17,
          }
        }
        testID="listItemTitle"
      />
    </View>
  </PadView>
</View>
`;

exports[`ListItem component should render with right icon component 1`] = `
<View>
  <PadView
    Component={[Function]}
    pad={16}
    style={
      Object {
        "alignItems": "center",
        "backgroundColor": "white",
        "borderColor": "#bcbbc1",
        "flexDirection": "row",
        "padding": 14,
      }
    }
  >
    <View
      style={
        Object {
          "flex": 1,
          "justifyContent": "center",
        }
      }
    >
      <Themed.Text
        style={
          Object {
            "backgroundColor": "transparent",
            "fontSize": 17,
          }
        }
        testID="listItemTitle"
      />
    </View>
    <Text>
      I'm right icon
    </Text>
  </PadView>
</View>
`;

exports[`ListItem component should render with switch 1`] = `
<View>
  <PadView
    Component={[Function]}
    pad={16}
    style={
      Object {
        "alignItems": "center",
        "backgroundColor": "white",
        "borderBottomWidth": 0.5,
        "borderColor": "#bcbbc1",
        "flexDirection": "row",
        "padding": 14,
        "paddingVertical": 8,
      }
    }
  >
    <View
      style={
        Object {
          "flex": 1,
          "justifyContent": "center",
        }
      }
    >
      <Themed.Text
        style={
          Object {
            "backgroundColor": "transparent",
            "fontSize": 17,
          }
        }
        testID="listItemTitle"
      />
    </View>
    <Switch
      value={true}
    />
    <Themed.Icon
      color="#D1D1D6"
      name="ios-arrow-forward"
      size={16}
      type="ionicon"
    />
  </PadView>
</View>
`;

exports[`ListItem component should render with title and subtitle 1`] = `
<View>
  <PadView
    Component={[Function]}
    pad={16}
    style={
      Object {
        "alignItems": "center",
        "backgroundColor": "white",
        "borderColor": "#bcbbc1",
        "flexDirection": "row",
        "padding": 14,
      }
    }
  >
    <View
      style={
        Object {
          "flex": 1,
          "justifyContent": "center",
        }
      }
    >
      <Themed.Text
        numberOfLines={5}
        style={
          Object {
            "backgroundColor": "peru",
            "fontSize": 17,
          }
        }
        testID="listItemTitle"
      >
        title test
      </Themed.Text>
      <Themed.Text
        style={
          Object {
            "backgroundColor": "peru",
            "fontSize": 15,
          }
        }
      >
        title test
      </Themed.Text>
    </View>
    <View
      style={
        Object {
          "alignItems": "flex-end",
          "flex": 0.5,
          "justifyContent": "center",
        }
      }
    >
      <Themed.Text
        style={
          Object {
            "backgroundColor": "transparent",
            "color": "rgba(0, 0, 0, 0.54)",
            "fontSize": 17,
          }
        }
      >
        title
      </Themed.Text>
    </View>
  </PadView>
</View>
`;

exports[`ListItem component should render without issues 1`] = `
<View>
  <PadView
    Component={[Function]}
    pad={16}
    style={
      Object {
        "alignItems": "center",
        "backgroundColor": "white",
        "borderColor": "#bcbbc1",
        "flexDirection": "row",
        "padding": 14,
      }
    }
  >
    <View
      style={
        Object {
          "flex": 1,
          "justifyContent": "center",
        }
      }
    >
      <Themed.Text
        style={
          Object {
            "backgroundColor": "transparent",
            "fontSize": 17,
          }
        }
        testID="listItemTitle"
      />
    </View>
  </PadView>
</View>
`;