@tactics/toddle-styleguide 5.3.1 → 5.3.3

package/src/components/molecules/filter-tab/__snapshots__/filter-tab.test.js.snap

@@ -1,536 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`Filter tab test renders a filter tab with 2 tabs 1`] = `
-<View
-  style={
-    {
-      "backgroundColor": "#E5E8EB",
-      "borderRadius": 16,
-      "display": "flex",
-      "paddingBottom": 4,
-      "paddingLeft": 8,
-      "paddingRight": 8,
-      "paddingTop": 4,
-      "width": "100%",
-    }
-  }
->
-  <View
-    onLayout={[Function]}
-    style={
-      {
-        "display": "flex",
-        "width": "100%",
-      }
-    }
-  >
-    <View
-      style={
-        {
-          "alignItems": "stretch",
-          "display": "flex",
-          "flexDirection": "column",
-          "position": "relative",
-          "width": "100%",
-        }
-      }
-    >
-      <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",
-            "backgroundColor": "transparent",
-            "borderRadius": 16,
-            "paddingBottom": 8,
-            "paddingLeft": 16,
-            "paddingRight": 16,
-            "paddingTop": 8,
-            "width": 0,
-          }
-        }
-      >
-        <Text
-          style={
-            [
-              [
-                {
-                  "fontFamily": "SourceSansPro",
-                  "fontSize": 16,
-                  "lineHeight": 22.4,
-                },
-              ],
-              {
-                "color": "#FFFFFF",
-                "textAlign": "center",
-                "width": "100%",
-              },
-              {
-                "maxHeight": 32,
-                "overflow": "hidden",
-                "width": "100%",
-              },
-            ]
-          }
-        >
-          QR-Code
-        </Text>
-      </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]}
-        style={
-          {
-            "alignItems": "center",
-            "backgroundColor": "transparent",
-            "borderRadius": 16,
-            "paddingBottom": 8,
-            "paddingLeft": 16,
-            "paddingRight": 16,
-            "paddingTop": 8,
-            "width": 0,
-          }
-        }
-      >
-        <Text
-          style={
-            [
-              [
-                {
-                  "fontFamily": "SourceSansPro",
-                  "fontSize": 16,
-                  "lineHeight": 22.4,
-                },
-              ],
-              {
-                "color": "#19216C",
-                "textAlign": "center",
-                "width": "100%",
-              },
-              {
-                "maxHeight": 32,
-                "overflow": "hidden",
-                "width": "100%",
-              },
-            ]
-          }
-        >
-          NFC
-        </Text>
-      </View>
-      <View
-        collapsable={false}
-        style={
-          {
-            "alignItems": "center",
-            "backgroundColor": "#647ACB",
-            "borderRadius": 12,
-            "marginTop": 3,
-            "maxHeight": 32,
-            "paddingBottom": 8,
-            "paddingLeft": 16,
-            "paddingRight": 16,
-            "paddingTop": 8,
-            "position": "absolute",
-            "transform": [
-              {
-                "translateY": 0,
-              },
-            ],
-            "width": 0,
-            "zIndex": -1,
-          }
-        }
-      >
-        <Text
-          style={
-            [
-              [
-                {
-                  "fontFamily": "SourceSansPro",
-                  "fontSize": 16,
-                  "lineHeight": 22.4,
-                },
-              ],
-              {
-                "color": "#19216C",
-                "textAlign": undefined,
-                "width": "100%",
-              },
-              [
-                {
-                  "maxHeight": 32,
-                  "overflow": "hidden",
-                  "width": "100%",
-                },
-                {
-                  "opacity": 0,
-                },
-              ],
-            ]
-          }
-        >
-          Hidden
-        </Text>
-      </View>
-    </View>
-  </View>
-</View>
-`;
-
-exports[`Filter tab test renders a filter tab with 3 tabs 1`] = `
-<View
-  style={
-    {
-      "backgroundColor": "#E5E8EB",
-      "borderRadius": 16,
-      "display": "flex",
-      "paddingBottom": 4,
-      "paddingLeft": 8,
-      "paddingRight": 8,
-      "paddingTop": 4,
-      "width": "100%",
-    }
-  }
->
-  <View
-    onLayout={[Function]}
-    style={
-      {
-        "display": "flex",
-        "width": "100%",
-      }
-    }
-  >
-    <View
-      style={
-        {
-          "alignItems": "stretch",
-          "display": "flex",
-          "flexDirection": "column",
-          "position": "relative",
-          "width": "100%",
-        }
-      }
-    >
-      <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",
-            "backgroundColor": "transparent",
-            "borderRadius": 16,
-            "paddingBottom": 8,
-            "paddingLeft": 16,
-            "paddingRight": 16,
-            "paddingTop": 8,
-            "width": 0,
-          }
-        }
-      >
-        <Text
-          style={
-            [
-              [
-                {
-                  "fontFamily": "SourceSansPro",
-                  "fontSize": 16,
-                  "lineHeight": 22.4,
-                },
-              ],
-              {
-                "color": "#FFFFFF",
-                "textAlign": "center",
-                "width": "100%",
-              },
-              {
-                "maxHeight": 32,
-                "overflow": "hidden",
-                "width": "100%",
-              },
-            ]
-          }
-        >
-          Jongen
-        </Text>
-      </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]}
-        style={
-          {
-            "alignItems": "center",
-            "backgroundColor": "transparent",
-            "borderRadius": 16,
-            "paddingBottom": 8,
-            "paddingLeft": 16,
-            "paddingRight": 16,
-            "paddingTop": 8,
-            "width": 0,
-          }
-        }
-      >
-        <Text
-          style={
-            [
-              [
-                {
-                  "fontFamily": "SourceSansPro",
-                  "fontSize": 16,
-                  "lineHeight": 22.4,
-                },
-              ],
-              {
-                "color": "#19216C",
-                "textAlign": "center",
-                "width": "100%",
-              },
-              {
-                "maxHeight": 32,
-                "overflow": "hidden",
-                "width": "100%",
-              },
-            ]
-          }
-        >
-          Meisje
-        </Text>
-      </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]}
-        style={
-          {
-            "alignItems": "center",
-            "backgroundColor": "transparent",
-            "borderRadius": 16,
-            "paddingBottom": 8,
-            "paddingLeft": 16,
-            "paddingRight": 16,
-            "paddingTop": 8,
-            "width": 0,
-          }
-        }
-      >
-        <Text
-          style={
-            [
-              [
-                {
-                  "fontFamily": "SourceSansPro",
-                  "fontSize": 16,
-                  "lineHeight": 22.4,
-                },
-              ],
-              {
-                "color": "#19216C",
-                "textAlign": "center",
-                "width": "100%",
-              },
-              {
-                "maxHeight": 32,
-                "overflow": "hidden",
-                "width": "100%",
-              },
-            ]
-          }
-        >
-          Beide
-        </Text>
-      </View>
-      <View
-        collapsable={false}
-        style={
-          {
-            "alignItems": "center",
-            "backgroundColor": "#647ACB",
-            "borderRadius": 12,
-            "marginTop": 3,
-            "maxHeight": 32,
-            "paddingBottom": 8,
-            "paddingLeft": 16,
-            "paddingRight": 16,
-            "paddingTop": 8,
-            "position": "absolute",
-            "transform": [
-              {
-                "translateY": 0,
-              },
-            ],
-            "width": 0,
-            "zIndex": -1,
-          }
-        }
-      >
-        <Text
-          style={
-            [
-              [
-                {
-                  "fontFamily": "SourceSansPro",
-                  "fontSize": 16,
-                  "lineHeight": 22.4,
-                },
-              ],
-              {
-                "color": "#19216C",
-                "textAlign": undefined,
-                "width": "100%",
-              },
-              [
-                {
-                  "maxHeight": 32,
-                  "overflow": "hidden",
-                  "width": "100%",
-                },
-                {
-                  "opacity": 0,
-                },
-              ],
-            ]
-          }
-        >
-          Hidden
-        </Text>
-      </View>
-    </View>
-  </View>
-</View>
-`;

package/src/components/molecules/filter-tab/filter-tab.test.js

@@ -1,42 +0,0 @@
-import React from 'react';
-import render from 'react-test-renderer';
-import {FilterTab} from './filter-tab.component';
-
-describe('Filter tab test', () => {
-  it('renders a filter tab with 2 tabs', function () {
-    const tabs1 = [
-      {
-        value: 'QR',
-        label: 'QR-Code',
-      },
-      {
-        value: 'NFC',
-        label: 'NFC',
-      },
-    ];
-    const tree = render
-      .create(<FilterTab tabItem={tabs1} setFilterValue={() => 'NFC'} />)
-      .toJSON();
-    expect(tree).toMatchSnapshot();
-  });
-  it('renders a filter tab with 3 tabs', function () {
-    const tabs2 = [
-      {
-        value: 'M',
-        label: 'Jongen',
-      },
-      {
-        value: 'V',
-        label: 'Meisje',
-      },
-      {
-        value: 'MV',
-        label: 'Beide',
-      },
-    ];
-    const tree = render
-      .create(<FilterTab tabItem={tabs2} setFilterValue={() => 'M'} />)
-      .toJSON();
-    expect(tree).toMatchSnapshot();
-  });
-});

package/src/components/molecules/info/__snapshots__/info.test.js.snap

@@ -1,64 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`Test info component should render an info component with a label and description 1`] = `
-<View
-  style={
-    {
-      "alignItems": "flex-start",
-      "backgroundColor": "#F5F7FA",
-      "borderRadius": 16,
-      "justifyContent": "flex-start",
-      "paddingBottom": 16,
-      "paddingLeft": 24,
-      "paddingRight": 24,
-      "paddingTop": 16,
-      "width": "100%",
-    }
-  }
->
-  <Text
-    style={
-      [
-        [
-          {
-            "fontFamily": "SourceSansProBold",
-            "fontSize": 18,
-            "lineHeight": 22.6,
-          },
-        ],
-        {
-          "color": "#1F2933",
-          "textAlign": undefined,
-          "width": "100%",
-        },
-        {
-          "marginBottom": 4,
-        },
-      ]
-    }
-  >
-    Mijn Gezin
-  </Text>
-  <Text
-    style={
-      [
-        [
-          {
-            "fontFamily": "Montserrat",
-            "fontSize": 13,
-            "lineHeight": 20.4,
-          },
-        ],
-        {
-          "color": "#515F6C",
-          "textAlign": undefined,
-          "width": "100%",
-        },
-        undefined,
-      ]
-    }
-  >
-    Volg hier de dag van uw kinderen
-  </Text>
-</View>
-`;

package/src/components/molecules/info/info.test.js

@@ -1,18 +0,0 @@
-import React from 'react';
-import renderer from 'react-test-renderer';
-import {Info} from './info.component';
-
-describe('Test info component', () => {
-  it('should render an info component with a label and description', () => {
-    const tree = renderer
-      .create(
-        <Info
-          label={'Mijn Gezin'}
-          description={'Volg hier de dag van uw kinderen'}
-        />
-      )
-      .toJSON();
-
-    expect(tree).toMatchSnapshot();
-  });
-});