824 lines
15 KiB
Plaintext
824 lines
15 KiB
Plaintext
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
|
|
|
exports[`[Component] Button Color variations renders with different colors 1`] = `
|
|
<View
|
|
accessibilityState={
|
|
{
|
|
"busy": undefined,
|
|
"checked": undefined,
|
|
"disabled": false,
|
|
"expanded": undefined,
|
|
"selected": undefined,
|
|
}
|
|
}
|
|
accessibilityValue={
|
|
{
|
|
"max": undefined,
|
|
"min": undefined,
|
|
"now": undefined,
|
|
"text": undefined,
|
|
}
|
|
}
|
|
accessible={true}
|
|
collapsable={false}
|
|
focusable={true}
|
|
onClick={[Function]}
|
|
onResponderGrant={[Function]}
|
|
onResponderMove={[Function]}
|
|
onResponderRelease={[Function]}
|
|
onResponderTerminate={[Function]}
|
|
onResponderTerminationRequest={[Function]}
|
|
onStartShouldSetResponder={[Function]}
|
|
style={
|
|
{
|
|
"alignItems": "center",
|
|
"backgroundColor": "#3AC26E",
|
|
"borderColor": "#3AC26E",
|
|
"borderRadius": 6,
|
|
"borderWidth": 0,
|
|
"flexDirection": "row",
|
|
"height": 48,
|
|
"justifyContent": "center",
|
|
"opacity": 1,
|
|
"paddingHorizontal": 16,
|
|
}
|
|
}
|
|
>
|
|
<Text
|
|
color="white"
|
|
style={
|
|
[
|
|
{
|
|
"color": "#000000",
|
|
},
|
|
[
|
|
{
|
|
"color": "#FFFFFF",
|
|
"fontSize": 16,
|
|
"fontWeight": "semibold",
|
|
},
|
|
undefined,
|
|
],
|
|
]
|
|
}
|
|
>
|
|
Press me
|
|
</Text>
|
|
</View>
|
|
`;
|
|
|
|
exports[`[Component] Button Color variations renders with different colors 2`] = `
|
|
<View
|
|
accessibilityState={
|
|
{
|
|
"busy": undefined,
|
|
"checked": undefined,
|
|
"disabled": false,
|
|
"expanded": undefined,
|
|
"selected": undefined,
|
|
}
|
|
}
|
|
accessibilityValue={
|
|
{
|
|
"max": undefined,
|
|
"min": undefined,
|
|
"now": undefined,
|
|
"text": undefined,
|
|
}
|
|
}
|
|
accessible={true}
|
|
collapsable={false}
|
|
focusable={true}
|
|
onClick={[Function]}
|
|
onResponderGrant={[Function]}
|
|
onResponderMove={[Function]}
|
|
onResponderRelease={[Function]}
|
|
onResponderTerminate={[Function]}
|
|
onResponderTerminationRequest={[Function]}
|
|
onStartShouldSetResponder={[Function]}
|
|
style={
|
|
{
|
|
"alignItems": "center",
|
|
"backgroundColor": "#FF4141",
|
|
"borderColor": "#FF4141",
|
|
"borderRadius": 6,
|
|
"borderWidth": 0,
|
|
"flexDirection": "row",
|
|
"height": 48,
|
|
"justifyContent": "center",
|
|
"opacity": 1,
|
|
"paddingHorizontal": 16,
|
|
}
|
|
}
|
|
>
|
|
<Text
|
|
color="white"
|
|
style={
|
|
[
|
|
{
|
|
"color": "#000000",
|
|
},
|
|
[
|
|
{
|
|
"color": "#FFFFFF",
|
|
"fontSize": 16,
|
|
"fontWeight": "semibold",
|
|
},
|
|
undefined,
|
|
],
|
|
]
|
|
}
|
|
>
|
|
Press me
|
|
</Text>
|
|
</View>
|
|
`;
|
|
|
|
exports[`[Component] Button Color variations renders with different colors 3`] = `
|
|
<View
|
|
accessibilityState={
|
|
{
|
|
"busy": undefined,
|
|
"checked": undefined,
|
|
"disabled": false,
|
|
"expanded": undefined,
|
|
"selected": undefined,
|
|
}
|
|
}
|
|
accessibilityValue={
|
|
{
|
|
"max": undefined,
|
|
"min": undefined,
|
|
"now": undefined,
|
|
"text": undefined,
|
|
}
|
|
}
|
|
accessible={true}
|
|
collapsable={false}
|
|
focusable={true}
|
|
onClick={[Function]}
|
|
onResponderGrant={[Function]}
|
|
onResponderMove={[Function]}
|
|
onResponderRelease={[Function]}
|
|
onResponderTerminate={[Function]}
|
|
onResponderTerminationRequest={[Function]}
|
|
onStartShouldSetResponder={[Function]}
|
|
style={
|
|
{
|
|
"alignItems": "center",
|
|
"backgroundColor": "#F9F9F9",
|
|
"borderColor": "#F9F9F9",
|
|
"borderRadius": 6,
|
|
"borderWidth": 0,
|
|
"flexDirection": "row",
|
|
"height": 48,
|
|
"justifyContent": "center",
|
|
"opacity": 1,
|
|
"paddingHorizontal": 16,
|
|
}
|
|
}
|
|
>
|
|
<Text
|
|
color="black"
|
|
style={
|
|
[
|
|
{
|
|
"color": "#000000",
|
|
},
|
|
[
|
|
{
|
|
"color": "#000000",
|
|
"fontSize": 16,
|
|
"fontWeight": "semibold",
|
|
},
|
|
undefined,
|
|
],
|
|
]
|
|
}
|
|
>
|
|
Press me
|
|
</Text>
|
|
</View>
|
|
`;
|
|
|
|
exports[`[Component] Button Disabled state renders correctly 1`] = `
|
|
<View
|
|
accessibilityState={
|
|
{
|
|
"busy": undefined,
|
|
"checked": undefined,
|
|
"disabled": true,
|
|
"expanded": undefined,
|
|
"selected": undefined,
|
|
}
|
|
}
|
|
accessibilityValue={
|
|
{
|
|
"max": undefined,
|
|
"min": undefined,
|
|
"now": undefined,
|
|
"text": undefined,
|
|
}
|
|
}
|
|
accessible={true}
|
|
collapsable={false}
|
|
focusable={true}
|
|
onClick={[Function]}
|
|
onResponderGrant={[Function]}
|
|
onResponderMove={[Function]}
|
|
onResponderRelease={[Function]}
|
|
onResponderTerminate={[Function]}
|
|
onResponderTerminationRequest={[Function]}
|
|
onStartShouldSetResponder={[Function]}
|
|
style={
|
|
{
|
|
"alignItems": "center",
|
|
"backgroundColor": "#FFFFFF",
|
|
"borderColor": "#FFFFFF",
|
|
"borderRadius": 6,
|
|
"borderWidth": 0,
|
|
"flexDirection": "row",
|
|
"height": 48,
|
|
"justifyContent": "center",
|
|
"opacity": 1,
|
|
"paddingHorizontal": 16,
|
|
}
|
|
}
|
|
>
|
|
<Text
|
|
color="black"
|
|
style={
|
|
[
|
|
{
|
|
"color": "#000000",
|
|
},
|
|
[
|
|
{
|
|
"color": "#000000",
|
|
"fontSize": 16,
|
|
"fontWeight": "semibold",
|
|
},
|
|
undefined,
|
|
],
|
|
]
|
|
}
|
|
>
|
|
Press me
|
|
</Text>
|
|
</View>
|
|
`;
|
|
|
|
exports[`[Component] Button Icon rendering renders icon only without label 1`] = `
|
|
<View
|
|
accessibilityState={
|
|
{
|
|
"busy": undefined,
|
|
"checked": undefined,
|
|
"disabled": false,
|
|
"expanded": undefined,
|
|
"selected": undefined,
|
|
}
|
|
}
|
|
accessibilityValue={
|
|
{
|
|
"max": undefined,
|
|
"min": undefined,
|
|
"now": undefined,
|
|
"text": undefined,
|
|
}
|
|
}
|
|
accessible={true}
|
|
collapsable={false}
|
|
focusable={true}
|
|
onClick={[Function]}
|
|
onResponderGrant={[Function]}
|
|
onResponderMove={[Function]}
|
|
onResponderRelease={[Function]}
|
|
onResponderTerminate={[Function]}
|
|
onResponderTerminationRequest={[Function]}
|
|
onStartShouldSetResponder={[Function]}
|
|
style={
|
|
{
|
|
"alignItems": "center",
|
|
"backgroundColor": "#FFFFFF",
|
|
"borderColor": "#FFFFFF",
|
|
"borderRadius": 6,
|
|
"borderWidth": 0,
|
|
"flexDirection": "row",
|
|
"height": 48,
|
|
"justifyContent": "center",
|
|
"opacity": 1,
|
|
"paddingHorizontal": 16,
|
|
}
|
|
}
|
|
>
|
|
<Text
|
|
color="black"
|
|
style={
|
|
[
|
|
{
|
|
"color": "#000000",
|
|
},
|
|
[
|
|
{
|
|
"color": "#000000",
|
|
"fontSize": 16,
|
|
"fontWeight": "semibold",
|
|
},
|
|
undefined,
|
|
],
|
|
]
|
|
}
|
|
>
|
|
Press me
|
|
</Text>
|
|
<View
|
|
pointerEvents="none"
|
|
style={
|
|
[
|
|
{
|
|
"width": 8,
|
|
},
|
|
undefined,
|
|
]
|
|
}
|
|
widthUnits={2}
|
|
/>
|
|
<View
|
|
style={
|
|
[
|
|
{
|
|
"alignItems": "center",
|
|
"aspectRatio": 1,
|
|
"height": 24,
|
|
"justifyContent": "center",
|
|
},
|
|
undefined,
|
|
]
|
|
}
|
|
>
|
|
<div
|
|
data-testid="mock-icon"
|
|
/>
|
|
</View>
|
|
</View>
|
|
`;
|
|
|
|
exports[`[Component] Button Icon rendering renders with icon on the left 1`] = `
|
|
<View
|
|
accessibilityState={
|
|
{
|
|
"busy": undefined,
|
|
"checked": undefined,
|
|
"disabled": false,
|
|
"expanded": undefined,
|
|
"selected": undefined,
|
|
}
|
|
}
|
|
accessibilityValue={
|
|
{
|
|
"max": undefined,
|
|
"min": undefined,
|
|
"now": undefined,
|
|
"text": undefined,
|
|
}
|
|
}
|
|
accessible={true}
|
|
collapsable={false}
|
|
focusable={true}
|
|
onClick={[Function]}
|
|
onResponderGrant={[Function]}
|
|
onResponderMove={[Function]}
|
|
onResponderRelease={[Function]}
|
|
onResponderTerminate={[Function]}
|
|
onResponderTerminationRequest={[Function]}
|
|
onStartShouldSetResponder={[Function]}
|
|
style={
|
|
{
|
|
"alignItems": "center",
|
|
"backgroundColor": "#FFFFFF",
|
|
"borderColor": "#FFFFFF",
|
|
"borderRadius": 6,
|
|
"borderWidth": 0,
|
|
"flexDirection": "row",
|
|
"height": 48,
|
|
"justifyContent": "center",
|
|
"opacity": 1,
|
|
"paddingHorizontal": 16,
|
|
}
|
|
}
|
|
>
|
|
<View
|
|
style={
|
|
[
|
|
{
|
|
"alignItems": "center",
|
|
"aspectRatio": 1,
|
|
"height": 24,
|
|
"justifyContent": "center",
|
|
},
|
|
undefined,
|
|
]
|
|
}
|
|
>
|
|
<div
|
|
data-testid="mock-icon"
|
|
/>
|
|
</View>
|
|
<View
|
|
pointerEvents="none"
|
|
style={
|
|
[
|
|
{
|
|
"width": 8,
|
|
},
|
|
undefined,
|
|
]
|
|
}
|
|
widthUnits={2}
|
|
/>
|
|
<Text
|
|
color="black"
|
|
style={
|
|
[
|
|
{
|
|
"color": "#000000",
|
|
},
|
|
[
|
|
{
|
|
"color": "#000000",
|
|
"fontSize": 16,
|
|
"fontWeight": "semibold",
|
|
},
|
|
undefined,
|
|
],
|
|
]
|
|
}
|
|
>
|
|
Press me
|
|
</Text>
|
|
</View>
|
|
`;
|
|
|
|
exports[`[Component] Button Icon rendering renders with icon on the right 1`] = `
|
|
<View
|
|
accessibilityState={
|
|
{
|
|
"busy": undefined,
|
|
"checked": undefined,
|
|
"disabled": false,
|
|
"expanded": undefined,
|
|
"selected": undefined,
|
|
}
|
|
}
|
|
accessibilityValue={
|
|
{
|
|
"max": undefined,
|
|
"min": undefined,
|
|
"now": undefined,
|
|
"text": undefined,
|
|
}
|
|
}
|
|
accessible={true}
|
|
collapsable={false}
|
|
focusable={true}
|
|
onClick={[Function]}
|
|
onResponderGrant={[Function]}
|
|
onResponderMove={[Function]}
|
|
onResponderRelease={[Function]}
|
|
onResponderTerminate={[Function]}
|
|
onResponderTerminationRequest={[Function]}
|
|
onStartShouldSetResponder={[Function]}
|
|
style={
|
|
{
|
|
"alignItems": "center",
|
|
"backgroundColor": "#FFFFFF",
|
|
"borderColor": "#FFFFFF",
|
|
"borderRadius": 6,
|
|
"borderWidth": 0,
|
|
"flexDirection": "row",
|
|
"height": 48,
|
|
"justifyContent": "center",
|
|
"opacity": 1,
|
|
"paddingHorizontal": 16,
|
|
}
|
|
}
|
|
>
|
|
<Text
|
|
color="black"
|
|
style={
|
|
[
|
|
{
|
|
"color": "#000000",
|
|
},
|
|
[
|
|
{
|
|
"color": "#000000",
|
|
"fontSize": 16,
|
|
"fontWeight": "semibold",
|
|
},
|
|
undefined,
|
|
],
|
|
]
|
|
}
|
|
>
|
|
Press me
|
|
</Text>
|
|
<View
|
|
pointerEvents="none"
|
|
style={
|
|
[
|
|
{
|
|
"width": 8,
|
|
},
|
|
undefined,
|
|
]
|
|
}
|
|
widthUnits={2}
|
|
/>
|
|
<View
|
|
style={
|
|
[
|
|
{
|
|
"alignItems": "center",
|
|
"aspectRatio": 1,
|
|
"height": 24,
|
|
"justifyContent": "center",
|
|
},
|
|
undefined,
|
|
]
|
|
}
|
|
>
|
|
<div
|
|
data-testid="mock-icon"
|
|
/>
|
|
</View>
|
|
</View>
|
|
`;
|
|
|
|
exports[`[Component] Button Loading state renders correctly 1`] = `
|
|
<View
|
|
accessibilityState={
|
|
{
|
|
"busy": undefined,
|
|
"checked": undefined,
|
|
"disabled": true,
|
|
"expanded": undefined,
|
|
"selected": undefined,
|
|
}
|
|
}
|
|
accessibilityValue={
|
|
{
|
|
"max": undefined,
|
|
"min": undefined,
|
|
"now": undefined,
|
|
"text": undefined,
|
|
}
|
|
}
|
|
accessible={true}
|
|
collapsable={false}
|
|
focusable={true}
|
|
onClick={[Function]}
|
|
onResponderGrant={[Function]}
|
|
onResponderMove={[Function]}
|
|
onResponderRelease={[Function]}
|
|
onResponderTerminate={[Function]}
|
|
onResponderTerminationRequest={[Function]}
|
|
onStartShouldSetResponder={[Function]}
|
|
style={
|
|
{
|
|
"alignItems": "center",
|
|
"backgroundColor": "#FFFFFF",
|
|
"borderColor": "#FFFFFF",
|
|
"borderRadius": 6,
|
|
"borderWidth": 0,
|
|
"flexDirection": "row",
|
|
"height": 48,
|
|
"justifyContent": "center",
|
|
"opacity": 1,
|
|
"paddingHorizontal": 16,
|
|
}
|
|
}
|
|
>
|
|
<Text
|
|
color="black"
|
|
style={
|
|
[
|
|
{
|
|
"color": "#000000",
|
|
},
|
|
[
|
|
{
|
|
"color": "#000000",
|
|
"fontSize": 16,
|
|
"fontWeight": "semibold",
|
|
},
|
|
undefined,
|
|
],
|
|
]
|
|
}
|
|
>
|
|
Press me
|
|
</Text>
|
|
</View>
|
|
`;
|
|
|
|
exports[`[Component] Button Ready state renders correctly 1`] = `
|
|
<View
|
|
accessibilityState={
|
|
{
|
|
"busy": undefined,
|
|
"checked": undefined,
|
|
"disabled": false,
|
|
"expanded": undefined,
|
|
"selected": undefined,
|
|
}
|
|
}
|
|
accessibilityValue={
|
|
{
|
|
"max": undefined,
|
|
"min": undefined,
|
|
"now": undefined,
|
|
"text": undefined,
|
|
}
|
|
}
|
|
accessible={true}
|
|
collapsable={false}
|
|
focusable={true}
|
|
onClick={[Function]}
|
|
onResponderGrant={[Function]}
|
|
onResponderMove={[Function]}
|
|
onResponderRelease={[Function]}
|
|
onResponderTerminate={[Function]}
|
|
onResponderTerminationRequest={[Function]}
|
|
onStartShouldSetResponder={[Function]}
|
|
style={
|
|
{
|
|
"alignItems": "center",
|
|
"backgroundColor": "#FFFFFF",
|
|
"borderColor": "#FFFFFF",
|
|
"borderRadius": 6,
|
|
"borderWidth": 0,
|
|
"flexDirection": "row",
|
|
"height": 48,
|
|
"justifyContent": "center",
|
|
"opacity": 1,
|
|
"paddingHorizontal": 16,
|
|
}
|
|
}
|
|
>
|
|
<Text
|
|
color="black"
|
|
style={
|
|
[
|
|
{
|
|
"color": "#000000",
|
|
},
|
|
[
|
|
{
|
|
"color": "#000000",
|
|
"fontSize": 16,
|
|
"fontWeight": "semibold",
|
|
},
|
|
undefined,
|
|
],
|
|
]
|
|
}
|
|
>
|
|
Press me
|
|
</Text>
|
|
</View>
|
|
`;
|
|
|
|
exports[`[Component] Button Secondary button renders correctly 1`] = `
|
|
<View
|
|
accessibilityState={
|
|
{
|
|
"busy": undefined,
|
|
"checked": undefined,
|
|
"disabled": false,
|
|
"expanded": undefined,
|
|
"selected": undefined,
|
|
}
|
|
}
|
|
accessibilityValue={
|
|
{
|
|
"max": undefined,
|
|
"min": undefined,
|
|
"now": undefined,
|
|
"text": undefined,
|
|
}
|
|
}
|
|
accessible={true}
|
|
collapsable={false}
|
|
focusable={true}
|
|
onClick={[Function]}
|
|
onResponderGrant={[Function]}
|
|
onResponderMove={[Function]}
|
|
onResponderRelease={[Function]}
|
|
onResponderTerminate={[Function]}
|
|
onResponderTerminationRequest={[Function]}
|
|
onStartShouldSetResponder={[Function]}
|
|
style={
|
|
{
|
|
"alignItems": "center",
|
|
"backgroundColor": "#FFFFFF",
|
|
"borderColor": "#FFFFFF",
|
|
"borderRadius": 6,
|
|
"borderWidth": 1,
|
|
"flexDirection": "row",
|
|
"height": 48,
|
|
"justifyContent": "center",
|
|
"opacity": 1,
|
|
"paddingHorizontal": 16,
|
|
}
|
|
}
|
|
>
|
|
<Text
|
|
bgColor="white"
|
|
style={
|
|
[
|
|
{
|
|
"color": "#000000",
|
|
},
|
|
[
|
|
{
|
|
"color": "#FFFFFF",
|
|
"fontWeight": "semibold",
|
|
},
|
|
undefined,
|
|
],
|
|
]
|
|
}
|
|
>
|
|
Press me
|
|
</Text>
|
|
</View>
|
|
`;
|
|
|
|
exports[`[Component] Button Secondary button with different colors 1`] = `
|
|
<View
|
|
accessibilityState={
|
|
{
|
|
"busy": undefined,
|
|
"checked": undefined,
|
|
"disabled": false,
|
|
"expanded": undefined,
|
|
"selected": undefined,
|
|
}
|
|
}
|
|
accessibilityValue={
|
|
{
|
|
"max": undefined,
|
|
"min": undefined,
|
|
"now": undefined,
|
|
"text": undefined,
|
|
}
|
|
}
|
|
accessible={true}
|
|
collapsable={false}
|
|
focusable={true}
|
|
onClick={[Function]}
|
|
onResponderGrant={[Function]}
|
|
onResponderMove={[Function]}
|
|
onResponderRelease={[Function]}
|
|
onResponderTerminate={[Function]}
|
|
onResponderTerminationRequest={[Function]}
|
|
onStartShouldSetResponder={[Function]}
|
|
style={
|
|
{
|
|
"alignItems": "center",
|
|
"backgroundColor": "#3AC26E",
|
|
"borderColor": "#3AC26E",
|
|
"borderRadius": 6,
|
|
"borderWidth": 1,
|
|
"flexDirection": "row",
|
|
"height": 48,
|
|
"justifyContent": "center",
|
|
"opacity": 1,
|
|
"paddingHorizontal": 16,
|
|
}
|
|
}
|
|
>
|
|
<Text
|
|
bgColor="green"
|
|
style={
|
|
[
|
|
{
|
|
"color": "#000000",
|
|
},
|
|
[
|
|
{
|
|
"color": "#3AC26E",
|
|
"fontWeight": "semibold",
|
|
},
|
|
undefined,
|
|
],
|
|
]
|
|
}
|
|
>
|
|
Press me
|
|
</Text>
|
|
</View>
|
|
`;
|