@tactics/toddle-styleguide 5.3.1 → 5.3.3

package/src/components/molecules/more-info-button/__snapshots__/more-info-button.test.js.snap

@@ -1,133 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`more info button should render a more info button in a black text color, underlined 1`] = `
-<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]}
-  style={
-    {
-      "alignItems": "center",
-      "justifyContent": "center",
-      "minHeight": 42,
-      "minWidth": 42,
-    }
-  }
->
-  <Text
-    style={
-      [
-        [
-          {
-            "fontFamily": "Montserrat",
-            "fontSize": 14,
-            "lineHeight": 22.4,
-          },
-        ],
-        {
-          "color": "#000000",
-          "textAlign": "center",
-          "width": "100%",
-        },
-        {
-          "textDecorationLine": "underline",
-        },
-      ]
-    }
-  >
-    Meer info
-  </Text>
-</View>
-`;
-
-exports[`more info button should render a more info button in a white text color, underlined 1`] = `
-<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]}
-  style={
-    {
-      "alignItems": "center",
-      "justifyContent": "center",
-      "minHeight": 42,
-      "minWidth": 42,
-    }
-  }
->
-  <Text
-    style={
-      [
-        [
-          {
-            "fontFamily": "Montserrat",
-            "fontSize": 14,
-            "lineHeight": 22.4,
-          },
-        ],
-        {
-          "color": "#FFFFFF",
-          "textAlign": "center",
-          "width": "100%",
-        },
-        {
-          "textDecorationLine": "underline",
-        },
-      ]
-    }
-  >
-    More info
-  </Text>
-</View>
-`;

package/src/components/molecules/more-info-button/more-info-button.test.js

@@ -1,29 +0,0 @@
-import React from 'react';
-import render from 'react-test-renderer';
-import {MoreInfoButton} from './more-info-button.component';
-
-describe('more info button', () => {
-  it('should render a more info button in a white text color, underlined', function () {
-    const tree = render
-      .create(
-        <MoreInfoButton
-          label="More info"
-          onPress={() => console.log('do something')}
-        />
-      )
-      .toJSON();
-    expect(tree).toMatchSnapshot();
-  });
-  it('should render a more info button in a black text color, underlined', () => {
-    const tree = render
-      .create(
-        <MoreInfoButton
-          label="Meer info"
-          onPress={() => console.log('do something')}
-          textColor={'#000000'}
-        />
-      )
-      .toJSON();
-    expect(tree).toMatchSnapshot();
-  });
-});

package/src/components/molecules/password-input/__snapshots__/password-input.test.js.snap

@@ -1,504 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`Visual test for the password input field shows a password input field with no placeholder text 1`] = `
-<View
-  style={
-    {
-      "alignItems": "center",
-      "backgroundColor": "#FFFFFF",
-      "borderRadius": 8,
-      "flexDirection": "row",
-      "height": 44,
-      "width": "100%",
-    }
-  }
->
-  <TextInput
-    keyboardType="default"
-    onChangeText={[Function]}
-    placeholderTextColor="#9AA5B1"
-    secureTextEntry={true}
-    style={
-      {
-        "color": "#1F2933",
-        "flex": 1,
-        "fontFamily": "SourceSansPro",
-        "fontSize": 16,
-        "height": "100%",
-        "justifyContent": "center",
-        "lineHeight": 20,
-        "paddingLeft": 16,
-      }
-    }
-    value="text"
-  />
-  <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]}
-    style={
-      {
-        "alignItems": "center",
-        "height": "100%",
-        "justifyContent": "center",
-        "paddingBottom": 8,
-        "paddingLeft": 16,
-        "paddingRight": 16,
-        "paddingTop": 8,
-      }
-    }
-  >
-    <RNSVGSvgView
-      align="xMidYMid"
-      bbHeight="24"
-      bbWidth="24"
-      fill="none"
-      focusable={false}
-      height={24}
-      meetOrSlice={0}
-      minX={0}
-      minY={0}
-      style={
-        [
-          {
-            "backgroundColor": "transparent",
-            "borderWidth": 0,
-          },
-          {
-            "flex": 0,
-            "height": 24,
-            "width": 24,
-          },
-        ]
-      }
-      vbHeight={19}
-      vbWidth={25}
-      width={24}
-    >
-      <RNSVGGroup
-        fill={null}
-        propList={
-          [
-            "fill",
-          ]
-        }
-      >
-        <RNSVGPath
-          d="M15.875 9.5C15.875 11.364 14.3639 12.875 12.5 12.875C10.636 12.875 9.12497 11.364 9.12497 9.5C9.12497 7.63604 10.636 6.125 12.5 6.125C14.3639 6.125 15.875 7.63604 15.875 9.5Z"
-          fill={
-            {
-              "payload": 4278190080,
-              "type": 0,
-            }
-          }
-          propList={
-            [
-              "stroke",
-              "strokeWidth",
-              "strokeLinecap",
-              "strokeLinejoin",
-            ]
-          }
-          stroke={
-            {
-              "payload": 4282406312,
-              "type": 0,
-            }
-          }
-          strokeLinecap={1}
-          strokeLinejoin={1}
-          strokeWidth="2"
-        />
-        <RNSVGPath
-          d="M1.7655 9.49996C3.19906 4.93574 7.46313 1.625 12.5005 1.625C17.5378 1.625 21.8019 4.93578 23.2354 9.50004C21.8019 14.0643 17.5378 17.375 12.5005 17.375C7.46313 17.375 3.19904 14.0642 1.7655 9.49996Z"
-          fill={
-            {
-              "payload": 4278190080,
-              "type": 0,
-            }
-          }
-          propList={
-            [
-              "stroke",
-              "strokeWidth",
-              "strokeLinecap",
-              "strokeLinejoin",
-            ]
-          }
-          stroke={
-            {
-              "payload": 4282406312,
-              "type": 0,
-            }
-          }
-          strokeLinecap={1}
-          strokeLinejoin={1}
-          strokeWidth="2"
-        />
-      </RNSVGGroup>
-    </RNSVGSvgView>
-  </View>
-</View>
-`;
-
-exports[`Visual test for the password input field shows a password input field with placeholder text 1`] = `
-<View
-  style={
-    {
-      "alignItems": "center",
-      "backgroundColor": "#FFFFFF",
-      "borderRadius": 8,
-      "flexDirection": "row",
-      "height": 44,
-      "width": "100%",
-    }
-  }
->
-  <TextInput
-    keyboardType="default"
-    onChangeText={[Function]}
-    placeholder="password"
-    placeholderTextColor="#9AA5B1"
-    secureTextEntry={true}
-    style={
-      {
-        "color": "#1F2933",
-        "flex": 1,
-        "fontFamily": "SourceSansPro",
-        "fontSize": 16,
-        "height": "100%",
-        "justifyContent": "center",
-        "lineHeight": 20,
-        "paddingLeft": 16,
-      }
-    }
-    value="text"
-  />
-  <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]}
-    style={
-      {
-        "alignItems": "center",
-        "height": "100%",
-        "justifyContent": "center",
-        "paddingBottom": 8,
-        "paddingLeft": 16,
-        "paddingRight": 16,
-        "paddingTop": 8,
-      }
-    }
-  >
-    <RNSVGSvgView
-      align="xMidYMid"
-      bbHeight="24"
-      bbWidth="24"
-      fill="none"
-      focusable={false}
-      height={24}
-      meetOrSlice={0}
-      minX={0}
-      minY={0}
-      style={
-        [
-          {
-            "backgroundColor": "transparent",
-            "borderWidth": 0,
-          },
-          {
-            "flex": 0,
-            "height": 24,
-            "width": 24,
-          },
-        ]
-      }
-      vbHeight={19}
-      vbWidth={25}
-      width={24}
-    >
-      <RNSVGGroup
-        fill={null}
-        propList={
-          [
-            "fill",
-          ]
-        }
-      >
-        <RNSVGPath
-          d="M15.875 9.5C15.875 11.364 14.3639 12.875 12.5 12.875C10.636 12.875 9.12497 11.364 9.12497 9.5C9.12497 7.63604 10.636 6.125 12.5 6.125C14.3639 6.125 15.875 7.63604 15.875 9.5Z"
-          fill={
-            {
-              "payload": 4278190080,
-              "type": 0,
-            }
-          }
-          propList={
-            [
-              "stroke",
-              "strokeWidth",
-              "strokeLinecap",
-              "strokeLinejoin",
-            ]
-          }
-          stroke={
-            {
-              "payload": 4282406312,
-              "type": 0,
-            }
-          }
-          strokeLinecap={1}
-          strokeLinejoin={1}
-          strokeWidth="2"
-        />
-        <RNSVGPath
-          d="M1.7655 9.49996C3.19906 4.93574 7.46313 1.625 12.5005 1.625C17.5378 1.625 21.8019 4.93578 23.2354 9.50004C21.8019 14.0643 17.5378 17.375 12.5005 17.375C7.46313 17.375 3.19904 14.0642 1.7655 9.49996Z"
-          fill={
-            {
-              "payload": 4278190080,
-              "type": 0,
-            }
-          }
-          propList={
-            [
-              "stroke",
-              "strokeWidth",
-              "strokeLinecap",
-              "strokeLinejoin",
-            ]
-          }
-          stroke={
-            {
-              "payload": 4282406312,
-              "type": 0,
-            }
-          }
-          strokeLinecap={1}
-          strokeLinejoin={1}
-          strokeWidth="2"
-        />
-      </RNSVGGroup>
-    </RNSVGSvgView>
-  </View>
-</View>
-`;
-
-exports[`Visual test for the password input field shows a password input field with placeholder text and a number keyboard 1`] = `
-<View
-  style={
-    {
-      "alignItems": "center",
-      "backgroundColor": "#FFFFFF",
-      "borderRadius": 8,
-      "flexDirection": "row",
-      "height": 44,
-      "width": "100%",
-    }
-  }
->
-  <TextInput
-    keyboardType="number-pad"
-    onChangeText={[Function]}
-    placeholder="number password"
-    placeholderTextColor="#9AA5B1"
-    secureTextEntry={true}
-    style={
-      {
-        "color": "#1F2933",
-        "flex": 1,
-        "fontFamily": "SourceSansPro",
-        "fontSize": 16,
-        "height": "100%",
-        "justifyContent": "center",
-        "lineHeight": 20,
-        "paddingLeft": 16,
-      }
-    }
-    value="text"
-  />
-  <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]}
-    style={
-      {
-        "alignItems": "center",
-        "height": "100%",
-        "justifyContent": "center",
-        "paddingBottom": 8,
-        "paddingLeft": 16,
-        "paddingRight": 16,
-        "paddingTop": 8,
-      }
-    }
-  >
-    <RNSVGSvgView
-      align="xMidYMid"
-      bbHeight="24"
-      bbWidth="24"
-      fill="none"
-      focusable={false}
-      height={24}
-      meetOrSlice={0}
-      minX={0}
-      minY={0}
-      style={
-        [
-          {
-            "backgroundColor": "transparent",
-            "borderWidth": 0,
-          },
-          {
-            "flex": 0,
-            "height": 24,
-            "width": 24,
-          },
-        ]
-      }
-      vbHeight={19}
-      vbWidth={25}
-      width={24}
-    >
-      <RNSVGGroup
-        fill={null}
-        propList={
-          [
-            "fill",
-          ]
-        }
-      >
-        <RNSVGPath
-          d="M15.875 9.5C15.875 11.364 14.3639 12.875 12.5 12.875C10.636 12.875 9.12497 11.364 9.12497 9.5C9.12497 7.63604 10.636 6.125 12.5 6.125C14.3639 6.125 15.875 7.63604 15.875 9.5Z"
-          fill={
-            {
-              "payload": 4278190080,
-              "type": 0,
-            }
-          }
-          propList={
-            [
-              "stroke",
-              "strokeWidth",
-              "strokeLinecap",
-              "strokeLinejoin",
-            ]
-          }
-          stroke={
-            {
-              "payload": 4282406312,
-              "type": 0,
-            }
-          }
-          strokeLinecap={1}
-          strokeLinejoin={1}
-          strokeWidth="2"
-        />
-        <RNSVGPath
-          d="M1.7655 9.49996C3.19906 4.93574 7.46313 1.625 12.5005 1.625C17.5378 1.625 21.8019 4.93578 23.2354 9.50004C21.8019 14.0643 17.5378 17.375 12.5005 17.375C7.46313 17.375 3.19904 14.0642 1.7655 9.49996Z"
-          fill={
-            {
-              "payload": 4278190080,
-              "type": 0,
-            }
-          }
-          propList={
-            [
-              "stroke",
-              "strokeWidth",
-              "strokeLinecap",
-              "strokeLinejoin",
-            ]
-          }
-          stroke={
-            {
-              "payload": 4282406312,
-              "type": 0,
-            }
-          }
-          strokeLinecap={1}
-          strokeLinejoin={1}
-          strokeWidth="2"
-        />
-      </RNSVGGroup>
-    </RNSVGSvgView>
-  </View>
-</View>
-`;

package/src/components/molecules/password-input/password-input.test.js

@@ -1,46 +0,0 @@
-import React from 'react';
-import render from 'react-test-renderer';
-import {PasswordInput} from './password-input.component';
-import {KeyBoardTypes} from '../../../types/keyboard-types.enum';
-
-describe('Visual test for the password input field', () => {
-  it('shows a password input field with placeholder text', () => {
-    const tree = render
-      .create(
-        <PasswordInput
-          placeholder={'password'}
-          value={'text'}
-          onChangeText={() => console.log('changed text')}
-        />
-      )
-      .toJSON();
-
-    expect(tree).toMatchSnapshot();
-  });
-  it('shows a password input field with no placeholder text', () => {
-    const tree = render
-      .create(
-        <PasswordInput
-          onChangeText={() => console.log('changed text')}
-          value={'text'}
-        />
-      )
-      .toJSON();
-
-    expect(tree).toMatchSnapshot();
-  });
-  it('shows a password input field with placeholder text and a number keyboard', () => {
-    const tree = render
-      .create(
-        <PasswordInput
-          placeholder={'number password'}
-          value={'text'}
-          onChangeText={() => console.log('changed text')}
-          keyboardType={KeyBoardTypes.NUMBER_PAD}
-        />
-      )
-      .toJSON();
-
-    expect(tree).toMatchSnapshot();
-  });
-});