* Standardize tags and chips through the app * Add missing texts * Fix tests and snapshots * Address feedback * Fix snapshots * Address UX feedback * Apply text styles to outer text component --------- Co-authored-by: Mattermost Build <build@mattermost.com>
462 lines
12 KiB
Text
462 lines
12 KiB
Text
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
|
|
|
exports[`Section notice match snapshot 1`] = `
|
|
<View
|
|
style={
|
|
[
|
|
{
|
|
"borderStyle": "solid",
|
|
"borderWidth": 1,
|
|
},
|
|
{
|
|
"backgroundColor": "rgba(93,137,234,0.08)",
|
|
"borderColor": "rgba(93,137,234,0.16)",
|
|
},
|
|
{
|
|
"borderRadius": 4,
|
|
},
|
|
]
|
|
}
|
|
testID="sectionNoticeContainer"
|
|
>
|
|
<View
|
|
style={
|
|
{
|
|
"alignItems": "flex-start",
|
|
"flexDirection": "row",
|
|
"gap": 12,
|
|
"padding": 16,
|
|
}
|
|
}
|
|
>
|
|
<Icon
|
|
name="information-outline"
|
|
size={20}
|
|
style={
|
|
{
|
|
"color": "#5d89ea",
|
|
}
|
|
}
|
|
testID="sectionNoticeHeaderIcon"
|
|
/>
|
|
<View
|
|
style={
|
|
{
|
|
"flex": 1,
|
|
"flexDirection": "column",
|
|
"gap": 8,
|
|
}
|
|
}
|
|
>
|
|
<Text
|
|
style={
|
|
{
|
|
"color": "#3f4350",
|
|
"fontFamily": "OpenSans-SemiBold",
|
|
"fontSize": 14,
|
|
"fontWeight": "600",
|
|
"lineHeight": 20,
|
|
"margin": 0,
|
|
}
|
|
}
|
|
>
|
|
Some title
|
|
</Text>
|
|
<View
|
|
style={
|
|
[
|
|
{
|
|
"alignItems": "flex-start",
|
|
"flexDirection": "row",
|
|
"flexWrap": "wrap",
|
|
},
|
|
]
|
|
}
|
|
testID="markdown_paragraph"
|
|
>
|
|
<Text>
|
|
<Text
|
|
selectable={false}
|
|
style={
|
|
{
|
|
"color": "#3f4350",
|
|
"fontFamily": "OpenSans",
|
|
"fontSize": 14,
|
|
"fontWeight": "400",
|
|
"lineHeight": 20,
|
|
}
|
|
}
|
|
testID="markdown_text"
|
|
>
|
|
Some text
|
|
</Text>
|
|
</Text>
|
|
</View>
|
|
<View
|
|
style={
|
|
{
|
|
"gap": 8,
|
|
"marginTop": 8,
|
|
}
|
|
}
|
|
>
|
|
<View
|
|
style={
|
|
[
|
|
{
|
|
"overflow": "hidden",
|
|
},
|
|
{
|
|
"borderRadius": 2,
|
|
},
|
|
undefined,
|
|
false,
|
|
]
|
|
}
|
|
testID="RNE_BUTTON_WRAPPER"
|
|
>
|
|
<View
|
|
accessibilityRole="button"
|
|
accessibilityState={
|
|
{
|
|
"busy": false,
|
|
"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={
|
|
{
|
|
"opacity": 1,
|
|
}
|
|
}
|
|
>
|
|
<View
|
|
style={
|
|
{
|
|
"alignItems": "center",
|
|
"backgroundColor": "#1c58d9",
|
|
"borderColor": "#2089dc",
|
|
"borderRadius": 4,
|
|
"borderWidth": 0,
|
|
"flexDirection": "row",
|
|
"justifyContent": "center",
|
|
"padding": 8,
|
|
"paddingHorizontal": 20,
|
|
"paddingVertical": 10,
|
|
}
|
|
}
|
|
>
|
|
<View
|
|
style={
|
|
{
|
|
"alignItems": "center",
|
|
"flexDirection": "row",
|
|
"gap": 7,
|
|
}
|
|
}
|
|
testID="undefined-text-container"
|
|
>
|
|
<View>
|
|
<Icon
|
|
color="#ffffff"
|
|
name="chevron-right"
|
|
size={18}
|
|
testID="undefined-icon"
|
|
/>
|
|
</View>
|
|
<Text
|
|
numberOfLines={1}
|
|
style={
|
|
{
|
|
"color": "#ffffff",
|
|
"fontFamily": "OpenSans-SemiBold",
|
|
"fontSize": 14,
|
|
"fontWeight": "600",
|
|
"lineHeight": 20,
|
|
}
|
|
}
|
|
>
|
|
primary button
|
|
</Text>
|
|
</View>
|
|
</View>
|
|
</View>
|
|
</View>
|
|
<View
|
|
style={
|
|
[
|
|
{
|
|
"overflow": "hidden",
|
|
},
|
|
{
|
|
"borderRadius": 2,
|
|
},
|
|
undefined,
|
|
false,
|
|
]
|
|
}
|
|
testID="RNE_BUTTON_WRAPPER"
|
|
>
|
|
<View
|
|
accessibilityRole="button"
|
|
accessibilityState={
|
|
{
|
|
"busy": false,
|
|
"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={
|
|
{
|
|
"opacity": 1,
|
|
}
|
|
}
|
|
>
|
|
<View
|
|
style={
|
|
{
|
|
"alignItems": "center",
|
|
"backgroundColor": "rgba(28,88,217,0.08)",
|
|
"borderColor": "#2089dc",
|
|
"borderRadius": 4,
|
|
"borderWidth": 0,
|
|
"flexDirection": "row",
|
|
"justifyContent": "center",
|
|
"padding": 8,
|
|
"paddingHorizontal": 20,
|
|
"paddingVertical": 10,
|
|
}
|
|
}
|
|
>
|
|
<View
|
|
style={
|
|
{
|
|
"alignItems": "center",
|
|
"flexDirection": "row",
|
|
"gap": 7,
|
|
}
|
|
}
|
|
testID="undefined-text-container"
|
|
>
|
|
<View>
|
|
<Icon
|
|
color="#1c58d9"
|
|
name="chevron-right"
|
|
size={18}
|
|
testID="undefined-icon"
|
|
/>
|
|
</View>
|
|
<Text
|
|
numberOfLines={1}
|
|
style={
|
|
{
|
|
"color": "#1c58d9",
|
|
"fontFamily": "OpenSans-SemiBold",
|
|
"fontSize": 14,
|
|
"fontWeight": "600",
|
|
"lineHeight": 20,
|
|
}
|
|
}
|
|
>
|
|
secondary button
|
|
</Text>
|
|
</View>
|
|
</View>
|
|
</View>
|
|
</View>
|
|
<View
|
|
style={
|
|
[
|
|
{
|
|
"overflow": "hidden",
|
|
},
|
|
{
|
|
"borderRadius": 2,
|
|
},
|
|
undefined,
|
|
false,
|
|
]
|
|
}
|
|
testID="RNE_BUTTON_WRAPPER"
|
|
>
|
|
<View
|
|
accessibilityRole="button"
|
|
accessibilityState={
|
|
{
|
|
"busy": false,
|
|
"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={
|
|
{
|
|
"opacity": 1,
|
|
}
|
|
}
|
|
>
|
|
<View
|
|
style={
|
|
{
|
|
"alignItems": "center",
|
|
"backgroundColor": "transparent",
|
|
"borderColor": "#2089dc",
|
|
"borderRadius": 4,
|
|
"borderWidth": 0,
|
|
"flexDirection": "row",
|
|
"justifyContent": "center",
|
|
"padding": 8,
|
|
"paddingHorizontal": 20,
|
|
"paddingVertical": 10,
|
|
}
|
|
}
|
|
>
|
|
<View
|
|
style={
|
|
{
|
|
"alignItems": "center",
|
|
"flexDirection": "row",
|
|
"gap": 7,
|
|
}
|
|
}
|
|
testID="undefined-text-container"
|
|
>
|
|
<View>
|
|
<Icon
|
|
color="#1c58d9"
|
|
name="chevron-right"
|
|
size={18}
|
|
testID="undefined-icon"
|
|
/>
|
|
</View>
|
|
<Text
|
|
numberOfLines={1}
|
|
style={
|
|
{
|
|
"color": "#1c58d9",
|
|
"fontFamily": "OpenSans-SemiBold",
|
|
"fontSize": 14,
|
|
"fontWeight": "600",
|
|
"lineHeight": 20,
|
|
}
|
|
}
|
|
>
|
|
link button
|
|
</Text>
|
|
</View>
|
|
</View>
|
|
</View>
|
|
</View>
|
|
</View>
|
|
</View>
|
|
</View>
|
|
<View
|
|
accessibilityState={
|
|
{
|
|
"busy": undefined,
|
|
"checked": undefined,
|
|
"disabled": undefined,
|
|
"expanded": undefined,
|
|
"selected": undefined,
|
|
}
|
|
}
|
|
accessibilityValue={
|
|
{
|
|
"max": undefined,
|
|
"min": undefined,
|
|
"now": undefined,
|
|
"text": undefined,
|
|
}
|
|
}
|
|
accessible={true}
|
|
collapsable={false}
|
|
focusable={true}
|
|
onBlur={[Function]}
|
|
onClick={[Function]}
|
|
onFocus={[Function]}
|
|
onResponderGrant={[Function]}
|
|
onResponderMove={[Function]}
|
|
onResponderRelease={[Function]}
|
|
onResponderTerminate={[Function]}
|
|
onResponderTerminationRequest={[Function]}
|
|
onStartShouldSetResponder={[Function]}
|
|
role="button"
|
|
style={
|
|
{
|
|
"alignItems": "center",
|
|
"height": 32,
|
|
"justifyContent": "center",
|
|
"position": "absolute",
|
|
"right": 10,
|
|
"top": 10,
|
|
"width": 32,
|
|
}
|
|
}
|
|
testID="sectionNoticeDismissButton"
|
|
>
|
|
<Icon
|
|
name="close"
|
|
size={18}
|
|
/>
|
|
</View>
|
|
</View>
|
|
`;
|