petrogad/react-native-materialui-textfield

View on GitHub
src/components/field/__snapshots__/test.js.snap

Summary

Maintainability
Test Coverage
// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`renders 1`] = `
<View
  onResponderRelease={[Function]}
  onStartShouldSetResponder={[Function]}
  pointerEvents="auto"
  style={undefined}
>
  <View
    collapsable={undefined}
    style={
      Object {
        "backgroundColor": "transparent",
        "borderBottomColor": "rgba(0, 0, 0, 0.38)",
        "borderBottomWidth": 0.5,
        "height": 64,
        "paddingBottom": 8,
        "paddingTop": 32,
      }
    }
  >
    <View
      collapsable={undefined}
      style={
        Object {
          "position": "absolute",
          "top": 36,
        }
      }
    >
      <Text
        accessible={true}
        allowFontScaling={true}
        collapsable={undefined}
        ellipsizeMode="tail"
        numberOfLines={1}
        style={
          Object {
            "color": "rgba(0, 0, 0, 0.38)",
            "fontSize": 16,
          }
        }
      >
        test
      </Text>
    </View>
    <View
      style={
        Object {
          "flexDirection": "row",
        }
      }
    >
      <TextInput
        allowFontScaling={true}
        autoCapitalize="sentences"
        disableFullscreenUI={true}
        editable={true}
        onBlur={[Function]}
        onChange={[Function]}
        onChangeText={[Function]}
        onContentSizeChange={[Function]}
        onFocus={[Function]}
        selectionColor="rgb(0, 145, 234)"
        style={
          Array [
            Object {
              "flex": 1,
              "margin": 0,
              "padding": 0,
              "top": 2,
            },
            Object {
              "color": "rgba(0, 0, 0, .87)",
              "fontSize": 16,
              "height": 24,
              "textAlign": "left",
            },
            undefined,
          ]
        }
        underlineColorAndroid="transparent"
        value=""
      />
    </View>
  </View>
  <View
    collapsable={undefined}
    style={
      Object {
        "flexDirection": "row",
        "height": 8,
      }
    }
  >
    <View
      style={
        Object {
          "flex": 1,
        }
      }
    >
      <View
        style={
          Object {
            "alignItems": "flex-start",
            "bottom": 0,
            "left": 0,
            "paddingVertical": 4,
            "position": "absolute",
            "right": 0,
            "top": 0,
          }
        }
      >
        <Text
          accessible={true}
          allowFontScaling={true}
          collapsable={undefined}
          ellipsizeMode="tail"
          style={
            Object {
              "backgroundColor": "transparent",
              "color": "rgb(213, 0, 0)",
              "fontSize": 0,
              "opacity": 0,
              "width": "100%",
            }
          }
        />
      </View>
      <View
        style={
          Object {
            "alignItems": "flex-start",
            "bottom": 0,
            "left": 0,
            "paddingVertical": 4,
            "position": "absolute",
            "right": 0,
            "top": 0,
          }
        }
      >
        <Text
          accessible={true}
          allowFontScaling={true}
          collapsable={undefined}
          ellipsizeMode="tail"
          style={
            Object {
              "backgroundColor": "transparent",
              "color": "rgba(0, 0, 0, .38)",
              "fontSize": 12,
              "opacity": 1,
              "width": "100%",
            }
          }
        />
      </View>
    </View>
  </View>
</View>
`;

exports[`renders accessory 1`] = `
<View
  onResponderRelease={[Function]}
  onStartShouldSetResponder={[Function]}
  pointerEvents="auto"
  style={undefined}
>
  <View
    collapsable={undefined}
    style={
      Object {
        "backgroundColor": "transparent",
        "borderBottomColor": "rgba(0, 0, 0, 0.38)",
        "borderBottomWidth": 0.5,
        "height": 64,
        "paddingBottom": 8,
        "paddingTop": 32,
      }
    }
  >
    <View
      collapsable={undefined}
      style={
        Object {
          "position": "absolute",
          "top": 36,
        }
      }
    >
      <Text
        accessible={true}
        allowFontScaling={true}
        collapsable={undefined}
        ellipsizeMode="tail"
        numberOfLines={1}
        style={
          Object {
            "color": "rgba(0, 0, 0, 0.38)",
            "fontSize": 16,
          }
        }
      >
        test
      </Text>
    </View>
    <View
      style={
        Object {
          "flexDirection": "row",
        }
      }
    >
      <TextInput
        allowFontScaling={true}
        autoCapitalize="sentences"
        disableFullscreenUI={true}
        editable={true}
        onBlur={[Function]}
        onChange={[Function]}
        onChangeText={[Function]}
        onContentSizeChange={[Function]}
        onFocus={[Function]}
        renderAccessory={[Function]}
        selectionColor="rgb(0, 145, 234)"
        style={
          Array [
            Object {
              "flex": 1,
              "margin": 0,
              "padding": 0,
              "top": 2,
            },
            Object {
              "color": "rgba(0, 0, 0, .87)",
              "fontSize": 16,
              "height": 24,
              "textAlign": "left",
            },
            undefined,
          ]
        }
        underlineColorAndroid="transparent"
        value=""
      />
      <View
        style={
          Object {
            "alignSelf": "flex-start",
            "justifyContent": "center",
            "top": 2,
          }
        }
      >
        <Image />
      </View>
    </View>
  </View>
  <View
    collapsable={undefined}
    style={
      Object {
        "flexDirection": "row",
        "height": 8,
      }
    }
  >
    <View
      style={
        Object {
          "flex": 1,
        }
      }
    >
      <View
        style={
          Object {
            "alignItems": "flex-start",
            "bottom": 0,
            "left": 0,
            "paddingVertical": 4,
            "position": "absolute",
            "right": 0,
            "top": 0,
          }
        }
      >
        <Text
          accessible={true}
          allowFontScaling={true}
          collapsable={undefined}
          ellipsizeMode="tail"
          style={
            Object {
              "backgroundColor": "transparent",
              "color": "rgb(213, 0, 0)",
              "fontSize": 0,
              "opacity": 0,
              "width": "100%",
            }
          }
        />
      </View>
      <View
        style={
          Object {
            "alignItems": "flex-start",
            "bottom": 0,
            "left": 0,
            "paddingVertical": 4,
            "position": "absolute",
            "right": 0,
            "top": 0,
          }
        }
      >
        <Text
          accessible={true}
          allowFontScaling={true}
          collapsable={undefined}
          ellipsizeMode="tail"
          style={
            Object {
              "backgroundColor": "transparent",
              "color": "rgba(0, 0, 0, .38)",
              "fontSize": 12,
              "opacity": 1,
              "width": "100%",
            }
          }
        />
      </View>
    </View>
  </View>
</View>
`;

exports[`renders counter 1`] = `
<View
  onResponderRelease={[Function]}
  onStartShouldSetResponder={[Function]}
  pointerEvents="auto"
  style={undefined}
>
  <View
    collapsable={undefined}
    style={
      Object {
        "backgroundColor": "transparent",
        "borderBottomColor": "rgba(0, 0, 0, 0.38)",
        "borderBottomWidth": 0.5,
        "height": 64,
        "paddingBottom": 8,
        "paddingTop": 32,
      }
    }
  >
    <View
      collapsable={undefined}
      style={
        Object {
          "position": "absolute",
          "top": 16,
        }
      }
    >
      <Text
        accessible={true}
        allowFontScaling={true}
        collapsable={undefined}
        ellipsizeMode="tail"
        numberOfLines={1}
        style={
          Object {
            "color": "rgba(0, 0, 0, 0.38)",
            "fontSize": 12,
          }
        }
      >
        test
      </Text>
    </View>
    <View
      style={
        Object {
          "flexDirection": "row",
        }
      }
    >
      <TextInput
        allowFontScaling={true}
        autoCapitalize="sentences"
        disableFullscreenUI={true}
        editable={true}
        onBlur={[Function]}
        onChange={[Function]}
        onChangeText={[Function]}
        onContentSizeChange={[Function]}
        onFocus={[Function]}
        selectionColor="rgb(0, 145, 234)"
        style={
          Array [
            Object {
              "flex": 1,
              "margin": 0,
              "padding": 0,
              "top": 2,
            },
            Object {
              "color": "rgba(0, 0, 0, .87)",
              "fontSize": 16,
              "height": 24,
              "textAlign": "left",
            },
            undefined,
          ]
        }
        underlineColorAndroid="transparent"
        value="text"
      />
    </View>
  </View>
  <View
    collapsable={undefined}
    style={
      Object {
        "flexDirection": "row",
        "height": 24,
      }
    }
  >
    <View
      style={
        Object {
          "flex": 1,
        }
      }
    >
      <View
        style={
          Object {
            "alignItems": "flex-start",
            "bottom": 0,
            "left": 0,
            "paddingVertical": 4,
            "position": "absolute",
            "right": 0,
            "top": 0,
          }
        }
      >
        <Text
          accessible={true}
          allowFontScaling={true}
          collapsable={undefined}
          ellipsizeMode="tail"
          style={
            Object {
              "backgroundColor": "transparent",
              "color": "rgb(213, 0, 0)",
              "fontSize": 0,
              "opacity": 0,
              "width": "100%",
            }
          }
        />
      </View>
      <View
        style={
          Object {
            "alignItems": "flex-start",
            "bottom": 0,
            "left": 0,
            "paddingVertical": 4,
            "position": "absolute",
            "right": 0,
            "top": 0,
          }
        }
      >
        <Text
          accessible={true}
          allowFontScaling={true}
          collapsable={undefined}
          ellipsizeMode="tail"
          style={
            Object {
              "backgroundColor": "transparent",
              "color": "rgba(0, 0, 0, .38)",
              "fontSize": 12,
              "opacity": 1,
              "width": "100%",
            }
          }
        />
      </View>
    </View>
    <View
      style={
        Object {
          "paddingLeft": 4,
          "paddingVertical": 4,
        }
      }
    >
      <Text
        accessible={true}
        allowFontScaling={true}
        ellipsizeMode="tail"
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "textAlign": "right",
            },
            undefined,
            Object {
              "color": "rgba(0, 0, 0, .38)",
              "fontSize": 12,
            },
          ]
        }
      >
        4
         / 
        10
      </Text>
    </View>
  </View>
</View>
`;

exports[`renders default value 1`] = `
<View
  onResponderRelease={[Function]}
  onStartShouldSetResponder={[Function]}
  pointerEvents="auto"
  style={undefined}
>
  <View
    collapsable={undefined}
    style={
      Object {
        "backgroundColor": "transparent",
        "borderBottomColor": "rgba(0, 0, 0, 0.38)",
        "borderBottomWidth": 0.5,
        "height": 64,
        "paddingBottom": 8,
        "paddingTop": 32,
      }
    }
  >
    <View
      collapsable={undefined}
      style={
        Object {
          "position": "absolute",
          "top": 16,
        }
      }
    >
      <Text
        accessible={true}
        allowFontScaling={true}
        collapsable={undefined}
        ellipsizeMode="tail"
        numberOfLines={1}
        style={
          Object {
            "color": "rgba(0, 0, 0, 0.38)",
            "fontSize": 12,
          }
        }
      >
        test
      </Text>
    </View>
    <View
      style={
        Object {
          "flexDirection": "row",
        }
      }
    >
      <TextInput
        allowFontScaling={true}
        autoCapitalize="sentences"
        disableFullscreenUI={true}
        editable={true}
        onBlur={[Function]}
        onChange={[Function]}
        onChangeText={[Function]}
        onContentSizeChange={[Function]}
        onFocus={[Function]}
        selectionColor="rgb(0, 145, 234)"
        style={
          Array [
            Object {
              "flex": 1,
              "margin": 0,
              "padding": 0,
              "top": 2,
            },
            Object {
              "color": "rgba(0, 0, 0, .38)",
              "fontSize": 16,
              "height": 24,
              "textAlign": "left",
            },
            undefined,
          ]
        }
        underlineColorAndroid="transparent"
        value="text"
      />
    </View>
  </View>
  <View
    collapsable={undefined}
    style={
      Object {
        "flexDirection": "row",
        "height": 8,
      }
    }
  >
    <View
      style={
        Object {
          "flex": 1,
        }
      }
    >
      <View
        style={
          Object {
            "alignItems": "flex-start",
            "bottom": 0,
            "left": 0,
            "paddingVertical": 4,
            "position": "absolute",
            "right": 0,
            "top": 0,
          }
        }
      >
        <Text
          accessible={true}
          allowFontScaling={true}
          collapsable={undefined}
          ellipsizeMode="tail"
          style={
            Object {
              "backgroundColor": "transparent",
              "color": "rgb(213, 0, 0)",
              "fontSize": 0,
              "opacity": 0,
              "width": "100%",
            }
          }
        />
      </View>
      <View
        style={
          Object {
            "alignItems": "flex-start",
            "bottom": 0,
            "left": 0,
            "paddingVertical": 4,
            "position": "absolute",
            "right": 0,
            "top": 0,
          }
        }
      >
        <Text
          accessible={true}
          allowFontScaling={true}
          collapsable={undefined}
          ellipsizeMode="tail"
          style={
            Object {
              "backgroundColor": "transparent",
              "color": "rgba(0, 0, 0, .38)",
              "fontSize": 12,
              "opacity": 1,
              "width": "100%",
            }
          }
        />
      </View>
    </View>
  </View>
</View>
`;

exports[`renders disabled value 1`] = `
<View
  onResponderRelease={[Function]}
  onStartShouldSetResponder={[Function]}
  pointerEvents="none"
  style={undefined}
>
  <View
    collapsable={undefined}
    style={
      Object {
        "backgroundColor": "transparent",
        "height": 64,
        "overflow": "hidden",
        "paddingBottom": 8,
        "paddingTop": 32,
      }
    }
  >
    <View
      pointerEvents="none"
      style={
        Array [
          Object {
            "position": "absolute",
          },
          Object {
            "borderColor": "rgba(0, 0, 0, .38)",
            "borderStyle": "dotted",
            "borderWidth": 1,
            "bottom": 0,
            "left": -1.5,
            "right": -1.5,
            "top": -2,
          },
        ]
      }
    />
    <View
      collapsable={undefined}
      style={
        Object {
          "position": "absolute",
          "top": 16,
        }
      }
    >
      <Text
        accessible={true}
        allowFontScaling={true}
        collapsable={undefined}
        ellipsizeMode="tail"
        numberOfLines={1}
        style={
          Object {
            "color": "rgba(0, 0, 0, 0.38)",
            "fontSize": 12,
          }
        }
      >
        test
      </Text>
    </View>
    <View
      style={
        Object {
          "flexDirection": "row",
        }
      }
    >
      <TextInput
        allowFontScaling={true}
        autoCapitalize="sentences"
        disableFullscreenUI={true}
        editable={false}
        onBlur={[Function]}
        onChange={[Function]}
        onChangeText={[Function]}
        onContentSizeChange={[Function]}
        onFocus={[Function]}
        selectionColor="rgb(0, 145, 234)"
        style={
          Array [
            Object {
              "flex": 1,
              "margin": 0,
              "padding": 0,
              "top": 2,
            },
            Object {
              "color": "rgba(0, 0, 0, .38)",
              "fontSize": 16,
              "height": 24,
              "textAlign": "left",
            },
            undefined,
          ]
        }
        underlineColorAndroid="transparent"
        value="text"
      />
    </View>
  </View>
  <View
    collapsable={undefined}
    style={
      Object {
        "flexDirection": "row",
        "height": 8,
      }
    }
  >
    <View
      style={
        Object {
          "flex": 1,
        }
      }
    >
      <View
        style={
          Object {
            "alignItems": "flex-start",
            "bottom": 0,
            "left": 0,
            "paddingVertical": 4,
            "position": "absolute",
            "right": 0,
            "top": 0,
          }
        }
      >
        <Text
          accessible={true}
          allowFontScaling={true}
          collapsable={undefined}
          ellipsizeMode="tail"
          style={
            Object {
              "backgroundColor": "transparent",
              "color": "rgb(213, 0, 0)",
              "fontSize": 0,
              "opacity": 0,
              "width": "100%",
            }
          }
        />
      </View>
      <View
        style={
          Object {
            "alignItems": "flex-start",
            "bottom": 0,
            "left": 0,
            "paddingVertical": 4,
            "position": "absolute",
            "right": 0,
            "top": 0,
          }
        }
      >
        <Text
          accessible={true}
          allowFontScaling={true}
          collapsable={undefined}
          ellipsizeMode="tail"
          style={
            Object {
              "backgroundColor": "transparent",
              "color": "rgba(0, 0, 0, .38)",
              "fontSize": 12,
              "opacity": 1,
              "width": "100%",
            }
          }
        />
      </View>
    </View>
  </View>
</View>
`;

exports[`renders error 1`] = `
<View
  onResponderRelease={[Function]}
  onStartShouldSetResponder={[Function]}
  pointerEvents="auto"
  style={undefined}
>
  <View
    collapsable={undefined}
    style={
      Object {
        "backgroundColor": "transparent",
        "borderBottomColor": "rgba(213, 0, 0, 1)",
        "borderBottomWidth": 2,
        "height": 64,
        "paddingBottom": 8,
        "paddingTop": 32,
      }
    }
  >
    <View
      collapsable={undefined}
      style={
        Object {
          "position": "absolute",
          "top": 36,
        }
      }
    >
      <Text
        accessible={true}
        allowFontScaling={true}
        collapsable={undefined}
        ellipsizeMode="tail"
        numberOfLines={1}
        style={
          Object {
            "color": "rgba(213, 0, 0, 1)",
            "fontSize": 16,
          }
        }
      >
        test
      </Text>
    </View>
    <View
      style={
        Object {
          "flexDirection": "row",
        }
      }
    >
      <TextInput
        allowFontScaling={true}
        autoCapitalize="sentences"
        disableFullscreenUI={true}
        editable={true}
        error="message"
        onBlur={[Function]}
        onChange={[Function]}
        onChangeText={[Function]}
        onContentSizeChange={[Function]}
        onFocus={[Function]}
        selectionColor="rgb(0, 145, 234)"
        style={
          Array [
            Object {
              "flex": 1,
              "margin": 0,
              "padding": 0,
              "top": 2,
            },
            Object {
              "color": "rgba(0, 0, 0, .87)",
              "fontSize": 16,
              "height": 24,
              "textAlign": "left",
            },
            undefined,
          ]
        }
        underlineColorAndroid="transparent"
        value=""
      />
    </View>
  </View>
  <View
    collapsable={undefined}
    style={
      Object {
        "flexDirection": "row",
        "height": 24,
      }
    }
  >
    <View
      style={
        Object {
          "flex": 1,
        }
      }
    >
      <View
        style={
          Object {
            "alignItems": "flex-start",
            "bottom": 0,
            "left": 0,
            "paddingVertical": 4,
            "position": "absolute",
            "right": 0,
            "top": 0,
          }
        }
      >
        <Text
          accessible={true}
          allowFontScaling={true}
          collapsable={undefined}
          ellipsizeMode="tail"
          style={
            Object {
              "backgroundColor": "transparent",
              "color": "rgb(213, 0, 0)",
              "fontSize": 12,
              "opacity": 1,
              "width": "100%",
            }
          }
        >
          message
        </Text>
      </View>
      <View
        style={
          Object {
            "alignItems": "flex-start",
            "bottom": 0,
            "left": 0,
            "paddingVertical": 4,
            "position": "absolute",
            "right": 0,
            "top": 0,
          }
        }
      >
        <Text
          accessible={true}
          allowFontScaling={true}
          collapsable={undefined}
          ellipsizeMode="tail"
          style={
            Object {
              "backgroundColor": "transparent",
              "color": "rgba(0, 0, 0, .38)",
              "fontSize": 12,
              "opacity": 0,
              "width": "100%",
            }
          }
        />
      </View>
    </View>
  </View>
</View>
`;

exports[`renders multiline value 1`] = `
<View
  onResponderRelease={[Function]}
  onStartShouldSetResponder={[Function]}
  pointerEvents="auto"
  style={undefined}
>
  <View
    collapsable={undefined}
    style={
      Object {
        "backgroundColor": "transparent",
        "borderBottomColor": "rgba(0, 0, 0, 0.38)",
        "borderBottomWidth": 0.5,
        "height": 64,
        "paddingBottom": 8,
        "paddingTop": 32,
      }
    }
  >
    <View
      collapsable={undefined}
      style={
        Object {
          "position": "absolute",
          "top": 16,
        }
      }
    >
      <Text
        accessible={true}
        allowFontScaling={true}
        collapsable={undefined}
        ellipsizeMode="tail"
        numberOfLines={1}
        style={
          Object {
            "color": "rgba(0, 0, 0, 0.38)",
            "fontSize": 12,
          }
        }
      >
        test
      </Text>
    </View>
    <View
      style={
        Object {
          "flexDirection": "row",
        }
      }
    >
      <TextInput
        allowFontScaling={true}
        autoCapitalize="sentences"
        disableFullscreenUI={true}
        editable={true}
        multiline={true}
        onBlur={[Function]}
        onChange={[Function]}
        onChangeText={[Function]}
        onContentSizeChange={[Function]}
        onFocus={[Function]}
        selectionColor="rgb(0, 145, 234)"
        style={
          Array [
            Object {
              "flex": 1,
              "margin": 0,
              "padding": 0,
              "top": 2,
            },
            Object {
              "color": "rgba(0, 0, 0, .87)",
              "fontSize": 16,
              "height": 48,
              "textAlign": "left",
              "top": -1,
            },
            undefined,
          ]
        }
        underlineColorAndroid="transparent"
        value="text"
      />
    </View>
  </View>
  <View
    collapsable={undefined}
    style={
      Object {
        "flexDirection": "row",
        "height": 8,
      }
    }
  >
    <View
      style={
        Object {
          "flex": 1,
        }
      }
    >
      <View
        style={
          Object {
            "alignItems": "flex-start",
            "bottom": 0,
            "left": 0,
            "paddingVertical": 4,
            "position": "absolute",
            "right": 0,
            "top": 0,
          }
        }
      >
        <Text
          accessible={true}
          allowFontScaling={true}
          collapsable={undefined}
          ellipsizeMode="tail"
          style={
            Object {
              "backgroundColor": "transparent",
              "color": "rgb(213, 0, 0)",
              "fontSize": 0,
              "opacity": 0,
              "width": "100%",
            }
          }
        />
      </View>
      <View
        style={
          Object {
            "alignItems": "flex-start",
            "bottom": 0,
            "left": 0,
            "paddingVertical": 4,
            "position": "absolute",
            "right": 0,
            "top": 0,
          }
        }
      >
        <Text
          accessible={true}
          allowFontScaling={true}
          collapsable={undefined}
          ellipsizeMode="tail"
          style={
            Object {
              "backgroundColor": "transparent",
              "color": "rgba(0, 0, 0, .38)",
              "fontSize": 12,
              "opacity": 1,
              "width": "100%",
            }
          }
        />
      </View>
    </View>
  </View>
</View>
`;

exports[`renders null value 1`] = `
<View
  onResponderRelease={[Function]}
  onStartShouldSetResponder={[Function]}
  pointerEvents="auto"
  style={undefined}
>
  <View
    collapsable={undefined}
    style={
      Object {
        "backgroundColor": "transparent",
        "borderBottomColor": "rgba(0, 0, 0, 0.38)",
        "borderBottomWidth": 0.5,
        "height": 64,
        "paddingBottom": 8,
        "paddingTop": 32,
      }
    }
  >
    <View
      collapsable={undefined}
      style={
        Object {
          "position": "absolute",
          "top": 36,
        }
      }
    >
      <Text
        accessible={true}
        allowFontScaling={true}
        collapsable={undefined}
        ellipsizeMode="tail"
        numberOfLines={1}
        style={
          Object {
            "color": "rgba(0, 0, 0, 0.38)",
            "fontSize": 16,
          }
        }
      >
        test
      </Text>
    </View>
    <View
      style={
        Object {
          "flexDirection": "row",
        }
      }
    >
      <TextInput
        allowFontScaling={true}
        autoCapitalize="sentences"
        disableFullscreenUI={true}
        editable={true}
        onBlur={[Function]}
        onChange={[Function]}
        onChangeText={[Function]}
        onContentSizeChange={[Function]}
        onFocus={[Function]}
        selectionColor="rgb(0, 145, 234)"
        style={
          Array [
            Object {
              "flex": 1,
              "margin": 0,
              "padding": 0,
              "top": 2,
            },
            Object {
              "color": "rgba(0, 0, 0, .87)",
              "fontSize": 16,
              "height": 24,
              "textAlign": "left",
            },
            undefined,
          ]
        }
        underlineColorAndroid="transparent"
        value=""
      />
    </View>
  </View>
  <View
    collapsable={undefined}
    style={
      Object {
        "flexDirection": "row",
        "height": 8,
      }
    }
  >
    <View
      style={
        Object {
          "flex": 1,
        }
      }
    >
      <View
        style={
          Object {
            "alignItems": "flex-start",
            "bottom": 0,
            "left": 0,
            "paddingVertical": 4,
            "position": "absolute",
            "right": 0,
            "top": 0,
          }
        }
      >
        <Text
          accessible={true}
          allowFontScaling={true}
          collapsable={undefined}
          ellipsizeMode="tail"
          style={
            Object {
              "backgroundColor": "transparent",
              "color": "rgb(213, 0, 0)",
              "fontSize": 0,
              "opacity": 0,
              "width": "100%",
            }
          }
        />
      </View>
      <View
        style={
          Object {
            "alignItems": "flex-start",
            "bottom": 0,
            "left": 0,
            "paddingVertical": 4,
            "position": "absolute",
            "right": 0,
            "top": 0,
          }
        }
      >
        <Text
          accessible={true}
          allowFontScaling={true}
          collapsable={undefined}
          ellipsizeMode="tail"
          style={
            Object {
              "backgroundColor": "transparent",
              "color": "rgba(0, 0, 0, .38)",
              "fontSize": 12,
              "opacity": 1,
              "width": "100%",
            }
          }
        />
      </View>
    </View>
  </View>
</View>
`;

exports[`renders prefix 1`] = `
<View
  onResponderRelease={[Function]}
  onStartShouldSetResponder={[Function]}
  pointerEvents="auto"
  style={undefined}
>
  <View
    collapsable={undefined}
    style={
      Object {
        "backgroundColor": "transparent",
        "borderBottomColor": "rgba(0, 0, 0, 0.38)",
        "borderBottomWidth": 0.5,
        "height": 64,
        "paddingBottom": 8,
        "paddingTop": 32,
      }
    }
  >
    <View
      collapsable={undefined}
      style={
        Object {
          "position": "absolute",
          "top": 16,
        }
      }
    >
      <Text
        accessible={true}
        allowFontScaling={true}
        collapsable={undefined}
        ellipsizeMode="tail"
        numberOfLines={1}
        style={
          Object {
            "color": "rgba(0, 0, 0, 0.38)",
            "fontSize": 12,
          }
        }
      >
        test
      </Text>
    </View>
    <View
      style={
        Object {
          "flexDirection": "row",
        }
      }
    >
      <View
        collapsable={undefined}
        style={
          Object {
            "alignSelf": "flex-start",
            "height": 24,
            "justifyContent": "center",
            "opacity": 1,
            "paddingRight": 8,
            "top": 2,
          }
        }
      >
        <Text
          accessible={true}
          allowFontScaling={true}
          collapsable={undefined}
          ellipsizeMode="tail"
          style={
            Object {
              "color": "rgba(0, 0, 0, .38)",
              "fontSize": 16,
              "textAlign": "left",
            }
          }
        >
          $
        </Text>
      </View>
      <TextInput
        allowFontScaling={true}
        autoCapitalize="sentences"
        disableFullscreenUI={true}
        editable={true}
        onBlur={[Function]}
        onChange={[Function]}
        onChangeText={[Function]}
        onContentSizeChange={[Function]}
        onFocus={[Function]}
        prefix="$"
        selectionColor="rgb(0, 145, 234)"
        style={
          Array [
            Object {
              "flex": 1,
              "margin": 0,
              "padding": 0,
              "top": 2,
            },
            Object {
              "color": "rgba(0, 0, 0, .87)",
              "fontSize": 16,
              "height": 24,
              "textAlign": "left",
            },
            undefined,
          ]
        }
        underlineColorAndroid="transparent"
        value="text"
      />
    </View>
  </View>
  <View
    collapsable={undefined}
    style={
      Object {
        "flexDirection": "row",
        "height": 8,
      }
    }
  >
    <View
      style={
        Object {
          "flex": 1,
        }
      }
    >
      <View
        style={
          Object {
            "alignItems": "flex-start",
            "bottom": 0,
            "left": 0,
            "paddingVertical": 4,
            "position": "absolute",
            "right": 0,
            "top": 0,
          }
        }
      >
        <Text
          accessible={true}
          allowFontScaling={true}
          collapsable={undefined}
          ellipsizeMode="tail"
          style={
            Object {
              "backgroundColor": "transparent",
              "color": "rgb(213, 0, 0)",
              "fontSize": 0,
              "opacity": 0,
              "width": "100%",
            }
          }
        />
      </View>
      <View
        style={
          Object {
            "alignItems": "flex-start",
            "bottom": 0,
            "left": 0,
            "paddingVertical": 4,
            "position": "absolute",
            "right": 0,
            "top": 0,
          }
        }
      >
        <Text
          accessible={true}
          allowFontScaling={true}
          collapsable={undefined}
          ellipsizeMode="tail"
          style={
            Object {
              "backgroundColor": "transparent",
              "color": "rgba(0, 0, 0, .38)",
              "fontSize": 12,
              "opacity": 1,
              "width": "100%",
            }
          }
        />
      </View>
    </View>
  </View>
</View>
`;

exports[`renders restriction 1`] = `
<View
  onResponderRelease={[Function]}
  onStartShouldSetResponder={[Function]}
  pointerEvents="auto"
  style={undefined}
>
  <View
    collapsable={undefined}
    style={
      Object {
        "backgroundColor": "transparent",
        "borderBottomColor": "rgb(213, 0, 0)",
        "borderBottomWidth": 2,
        "height": 64,
        "paddingBottom": 8,
        "paddingTop": 32,
      }
    }
  >
    <View
      collapsable={undefined}
      style={
        Object {
          "position": "absolute",
          "top": 16,
        }
      }
    >
      <Text
        accessible={true}
        allowFontScaling={true}
        collapsable={undefined}
        ellipsizeMode="tail"
        numberOfLines={1}
        style={
          Object {
            "color": "rgb(213, 0, 0)",
            "fontSize": 12,
          }
        }
      >
        test
      </Text>
    </View>
    <View
      style={
        Object {
          "flexDirection": "row",
        }
      }
    >
      <TextInput
        allowFontScaling={true}
        autoCapitalize="sentences"
        disableFullscreenUI={true}
        editable={true}
        onBlur={[Function]}
        onChange={[Function]}
        onChangeText={[Function]}
        onContentSizeChange={[Function]}
        onFocus={[Function]}
        selectionColor="rgb(0, 145, 234)"
        style={
          Array [
            Object {
              "flex": 1,
              "margin": 0,
              "padding": 0,
              "top": 2,
            },
            Object {
              "color": "rgba(0, 0, 0, .87)",
              "fontSize": 16,
              "height": 24,
              "textAlign": "left",
            },
            undefined,
          ]
        }
        underlineColorAndroid="transparent"
        value="text"
      />
    </View>
  </View>
  <View
    collapsable={undefined}
    style={
      Object {
        "flexDirection": "row",
        "height": 24,
      }
    }
  >
    <View
      style={
        Object {
          "flex": 1,
        }
      }
    >
      <View
        style={
          Object {
            "alignItems": "flex-start",
            "bottom": 0,
            "left": 0,
            "paddingVertical": 4,
            "position": "absolute",
            "right": 0,
            "top": 0,
          }
        }
      >
        <Text
          accessible={true}
          allowFontScaling={true}
          collapsable={undefined}
          ellipsizeMode="tail"
          style={
            Object {
              "backgroundColor": "transparent",
              "color": "rgb(213, 0, 0)",
              "fontSize": 0,
              "opacity": 0,
              "width": "100%",
            }
          }
        />
      </View>
      <View
        style={
          Object {
            "alignItems": "flex-start",
            "bottom": 0,
            "left": 0,
            "paddingVertical": 4,
            "position": "absolute",
            "right": 0,
            "top": 0,
          }
        }
      >
        <Text
          accessible={true}
          allowFontScaling={true}
          collapsable={undefined}
          ellipsizeMode="tail"
          style={
            Object {
              "backgroundColor": "transparent",
              "color": "rgba(0, 0, 0, .38)",
              "fontSize": 12,
              "opacity": 1,
              "width": "100%",
            }
          }
        />
      </View>
    </View>
    <View
      style={
        Object {
          "paddingLeft": 4,
          "paddingVertical": 4,
        }
      }
    >
      <Text
        accessible={true}
        allowFontScaling={true}
        ellipsizeMode="tail"
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "textAlign": "right",
            },
            undefined,
            Object {
              "color": "rgb(213, 0, 0)",
              "fontSize": 12,
            },
          ]
        }
      >
        4
         / 
        2
      </Text>
    </View>
  </View>
</View>
`;

exports[`renders suffix 1`] = `
<View
  onResponderRelease={[Function]}
  onStartShouldSetResponder={[Function]}
  pointerEvents="auto"
  style={undefined}
>
  <View
    collapsable={undefined}
    style={
      Object {
        "backgroundColor": "transparent",
        "borderBottomColor": "rgba(0, 0, 0, 0.38)",
        "borderBottomWidth": 0.5,
        "height": 64,
        "paddingBottom": 8,
        "paddingTop": 32,
      }
    }
  >
    <View
      collapsable={undefined}
      style={
        Object {
          "position": "absolute",
          "top": 16,
        }
      }
    >
      <Text
        accessible={true}
        allowFontScaling={true}
        collapsable={undefined}
        ellipsizeMode="tail"
        numberOfLines={1}
        style={
          Object {
            "color": "rgba(0, 0, 0, 0.38)",
            "fontSize": 12,
          }
        }
      >
        test
      </Text>
    </View>
    <View
      style={
        Object {
          "flexDirection": "row",
        }
      }
    >
      <TextInput
        allowFontScaling={true}
        autoCapitalize="sentences"
        disableFullscreenUI={true}
        editable={true}
        onBlur={[Function]}
        onChange={[Function]}
        onChangeText={[Function]}
        onContentSizeChange={[Function]}
        onFocus={[Function]}
        selectionColor="rgb(0, 145, 234)"
        style={
          Array [
            Object {
              "flex": 1,
              "margin": 0,
              "padding": 0,
              "top": 2,
            },
            Object {
              "color": "rgba(0, 0, 0, .87)",
              "fontSize": 16,
              "height": 24,
              "textAlign": "left",
            },
            undefined,
          ]
        }
        suffix=".com"
        underlineColorAndroid="transparent"
        value="text"
      />
      <View
        collapsable={undefined}
        style={
          Object {
            "alignSelf": "flex-start",
            "height": 24,
            "justifyContent": "center",
            "opacity": 1,
            "paddingLeft": 8,
            "top": 2,
          }
        }
      >
        <Text
          accessible={true}
          allowFontScaling={true}
          collapsable={undefined}
          ellipsizeMode="tail"
          style={
            Object {
              "color": "rgba(0, 0, 0, .38)",
              "fontSize": 16,
              "textAlign": "right",
            }
          }
        >
          .com
        </Text>
      </View>
    </View>
  </View>
  <View
    collapsable={undefined}
    style={
      Object {
        "flexDirection": "row",
        "height": 8,
      }
    }
  >
    <View
      style={
        Object {
          "flex": 1,
        }
      }
    >
      <View
        style={
          Object {
            "alignItems": "flex-start",
            "bottom": 0,
            "left": 0,
            "paddingVertical": 4,
            "position": "absolute",
            "right": 0,
            "top": 0,
          }
        }
      >
        <Text
          accessible={true}
          allowFontScaling={true}
          collapsable={undefined}
          ellipsizeMode="tail"
          style={
            Object {
              "backgroundColor": "transparent",
              "color": "rgb(213, 0, 0)",
              "fontSize": 0,
              "opacity": 0,
              "width": "100%",
            }
          }
        />
      </View>
      <View
        style={
          Object {
            "alignItems": "flex-start",
            "bottom": 0,
            "left": 0,
            "paddingVertical": 4,
            "position": "absolute",
            "right": 0,
            "top": 0,
          }
        }
      >
        <Text
          accessible={true}
          allowFontScaling={true}
          collapsable={undefined}
          ellipsizeMode="tail"
          style={
            Object {
              "backgroundColor": "transparent",
              "color": "rgba(0, 0, 0, .38)",
              "fontSize": 12,
              "opacity": 1,
              "width": "100%",
            }
          }
        />
      </View>
    </View>
  </View>
</View>
`;

exports[`renders title 1`] = `
<View
  onResponderRelease={[Function]}
  onStartShouldSetResponder={[Function]}
  pointerEvents="auto"
  style={undefined}
>
  <View
    collapsable={undefined}
    style={
      Object {
        "backgroundColor": "transparent",
        "borderBottomColor": "rgba(0, 0, 0, 0.38)",
        "borderBottomWidth": 0.5,
        "height": 64,
        "paddingBottom": 8,
        "paddingTop": 32,
      }
    }
  >
    <View
      collapsable={undefined}
      style={
        Object {
          "position": "absolute",
          "top": 36,
        }
      }
    >
      <Text
        accessible={true}
        allowFontScaling={true}
        collapsable={undefined}
        ellipsizeMode="tail"
        numberOfLines={1}
        style={
          Object {
            "color": "rgba(0, 0, 0, 0.38)",
            "fontSize": 16,
          }
        }
      >
        test
      </Text>
    </View>
    <View
      style={
        Object {
          "flexDirection": "row",
        }
      }
    >
      <TextInput
        allowFontScaling={true}
        autoCapitalize="sentences"
        disableFullscreenUI={true}
        editable={true}
        onBlur={[Function]}
        onChange={[Function]}
        onChangeText={[Function]}
        onContentSizeChange={[Function]}
        onFocus={[Function]}
        selectionColor="rgb(0, 145, 234)"
        style={
          Array [
            Object {
              "flex": 1,
              "margin": 0,
              "padding": 0,
              "top": 2,
            },
            Object {
              "color": "rgba(0, 0, 0, .87)",
              "fontSize": 16,
              "height": 24,
              "textAlign": "left",
            },
            undefined,
          ]
        }
        underlineColorAndroid="transparent"
        value=""
      />
    </View>
  </View>
  <View
    collapsable={undefined}
    style={
      Object {
        "flexDirection": "row",
        "height": 24,
      }
    }
  >
    <View
      style={
        Object {
          "flex": 1,
        }
      }
    >
      <View
        style={
          Object {
            "alignItems": "flex-start",
            "bottom": 0,
            "left": 0,
            "paddingVertical": 4,
            "position": "absolute",
            "right": 0,
            "top": 0,
          }
        }
      >
        <Text
          accessible={true}
          allowFontScaling={true}
          collapsable={undefined}
          ellipsizeMode="tail"
          style={
            Object {
              "backgroundColor": "transparent",
              "color": "rgb(213, 0, 0)",
              "fontSize": 12,
              "opacity": 0,
              "width": "100%",
            }
          }
        />
      </View>
      <View
        style={
          Object {
            "alignItems": "flex-start",
            "bottom": 0,
            "left": 0,
            "paddingVertical": 4,
            "position": "absolute",
            "right": 0,
            "top": 0,
          }
        }
      >
        <Text
          accessible={true}
          allowFontScaling={true}
          collapsable={undefined}
          ellipsizeMode="tail"
          style={
            Object {
              "backgroundColor": "transparent",
              "color": "rgba(0, 0, 0, .38)",
              "fontSize": 12,
              "opacity": 1,
              "width": "100%",
            }
          }
        >
          field
        </Text>
      </View>
    </View>
  </View>
</View>
`;

exports[`renders value 1`] = `
<View
  onResponderRelease={[Function]}
  onStartShouldSetResponder={[Function]}
  pointerEvents="auto"
  style={undefined}
>
  <View
    collapsable={undefined}
    style={
      Object {
        "backgroundColor": "transparent",
        "borderBottomColor": "rgba(0, 0, 0, 0.38)",
        "borderBottomWidth": 0.5,
        "height": 64,
        "paddingBottom": 8,
        "paddingTop": 32,
      }
    }
  >
    <View
      collapsable={undefined}
      style={
        Object {
          "position": "absolute",
          "top": 16,
        }
      }
    >
      <Text
        accessible={true}
        allowFontScaling={true}
        collapsable={undefined}
        ellipsizeMode="tail"
        numberOfLines={1}
        style={
          Object {
            "color": "rgba(0, 0, 0, 0.38)",
            "fontSize": 12,
          }
        }
      >
        test
      </Text>
    </View>
    <View
      style={
        Object {
          "flexDirection": "row",
        }
      }
    >
      <TextInput
        allowFontScaling={true}
        autoCapitalize="sentences"
        disableFullscreenUI={true}
        editable={true}
        onBlur={[Function]}
        onChange={[Function]}
        onChangeText={[Function]}
        onContentSizeChange={[Function]}
        onFocus={[Function]}
        selectionColor="rgb(0, 145, 234)"
        style={
          Array [
            Object {
              "flex": 1,
              "margin": 0,
              "padding": 0,
              "top": 2,
            },
            Object {
              "color": "rgba(0, 0, 0, .87)",
              "fontSize": 16,
              "height": 24,
              "textAlign": "left",
            },
            undefined,
          ]
        }
        underlineColorAndroid="transparent"
        value="text"
      />
    </View>
  </View>
  <View
    collapsable={undefined}
    style={
      Object {
        "flexDirection": "row",
        "height": 8,
      }
    }
  >
    <View
      style={
        Object {
          "flex": 1,
        }
      }
    >
      <View
        style={
          Object {
            "alignItems": "flex-start",
            "bottom": 0,
            "left": 0,
            "paddingVertical": 4,
            "position": "absolute",
            "right": 0,
            "top": 0,
          }
        }
      >
        <Text
          accessible={true}
          allowFontScaling={true}
          collapsable={undefined}
          ellipsizeMode="tail"
          style={
            Object {
              "backgroundColor": "transparent",
              "color": "rgb(213, 0, 0)",
              "fontSize": 0,
              "opacity": 0,
              "width": "100%",
            }
          }
        />
      </View>
      <View
        style={
          Object {
            "alignItems": "flex-start",
            "bottom": 0,
            "left": 0,
            "paddingVertical": 4,
            "position": "absolute",
            "right": 0,
            "top": 0,
          }
        }
      >
        <Text
          accessible={true}
          allowFontScaling={true}
          collapsable={undefined}
          ellipsizeMode="tail"
          style={
            Object {
              "backgroundColor": "transparent",
              "color": "rgba(0, 0, 0, .38)",
              "fontSize": 12,
              "opacity": 1,
              "width": "100%",
            }
          }
        />
      </View>
    </View>
  </View>
</View>
`;