@tactics/toddle-styleguide 5.3.1 → 5.3.3

package/src/components/molecules/select-list-item/select-list-item.test.js

@@ -1,38 +0,0 @@
-import React from 'react';
-import render from 'react-test-renderer';
-import {SelectListItem} from './select-list-item.component';
-import {FilterIcon} from '../../../icons/outline/filter/filter.icon';
-import {OfficeBuildingIcon} from '../../../icons/outline/office-building/office-building.icon';
-
-describe('test button component', () => {
-  it('should render a select-list-item component with 1 line of white text (bold) and a dark icon in a light circle', () => {
-    const tree = render
-      .create(<SelectListItem title={'Vlindertjes'} icon={<FilterIcon />} />)
-      .toJSON();
-    expect(tree).toMatchSnapshot();
-  });
-  it('should render a select-list-item component with 1 line of white text (bold) and a light icon in a dark circle', () => {
-    const tree = render
-      .create(
-        <SelectListItem
-          title={'lindertjes'}
-          icon={<OfficeBuildingIcon />}
-          inverse={true}
-        />
-      )
-      .toJSON();
-    expect(tree).toMatchSnapshot();
-  });
-  it('should render a select-list-item component with 2 LINES of text and a dark icon in a light circle', () => {
-    const tree = render
-      .create(
-        <SelectListItem
-          title={'Vlindertjes'}
-          subtitle={'Leeftijd 2 tot 4 jaar'}
-          icon={<FilterIcon />}
-        />
-      )
-      .toJSON();
-    expect(tree).toMatchSnapshot();
-  });
-});

package/src/components/molecules/select-picker/__snapshots__/select-picker.test.js.snap

@@ -1,407 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`Select Picker test renders a picker with placeholder text 1`] = `
-<View
-  style={
-    {
-      "alignItems": "center",
-      "backgroundColor": "#FFFFFF",
-      "borderColor": "#E5E8EB",
-      "borderRadius": 8,
-      "borderStyle": "solid",
-      "borderWidth": 1,
-      "flexDirection": "row",
-      "height": 48,
-      "justifyContent": "center",
-      "paddingBottom": 8,
-      "paddingLeft": 16,
-      "paddingRight": 16,
-      "paddingTop": 8,
-      "width": "100%",
-    }
-  }
->
-  <View
-    style={
-      {
-        "height": "100%",
-        "justifyContent": "center",
-        "width": "100%",
-        "zIndex": 1,
-      }
-    }
-  >
-    <View
-      style={
-        [
-          {
-            "alignSelf": "stretch",
-          },
-          {
-            "flex": 1,
-            "justifyContent": "center",
-          },
-        ]
-      }
-    >
-      <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}
-        onClick={[Function]}
-        onResponderGrant={[Function]}
-        onResponderMove={[Function]}
-        onResponderRelease={[Function]}
-        onResponderTerminate={[Function]}
-        onResponderTerminationRequest={[Function]}
-        onStartShouldSetResponder={[Function]}
-        style={
-          {
-            "opacity": 1,
-          }
-        }
-        testID="ios_touchable_wrapper"
-      >
-        <View
-          pointerEvents="box-only"
-          style={
-            {
-              "height": "100%",
-              "justifyContent": "flex-start",
-            }
-          }
-        >
-          <TextInput
-            editable={false}
-            style={
-              [
-                {
-                  "alignItems": "center",
-                  "color": "#9AA5B1",
-                  "fontFamily": "SourceSansPro",
-                  "fontSize": 16,
-                  "justifyContent": "center",
-                  "lineHeight": 22.4,
-                },
-                {
-                  "color": "#c7c7cd",
-                },
-              ]
-            }
-            testID="text_input"
-            value="Choose..."
-          />
-        </View>
-      </View>
-      <Modal
-        hardwareAccelerated={false}
-        onOrientationChange={[Function]}
-        supportedOrientations={
-          [
-            "portrait",
-            "landscape",
-          ]
-        }
-        testID="ios_modal"
-        transparent={true}
-        visible={false}
-      />
-    </View>
-  </View>
-  <View
-    style={
-      {
-        "alignItems": "center",
-        "height": "100%",
-        "justifyContent": "center",
-        "position": "absolute",
-        "right": 16,
-        "width": "10%",
-      }
-    }
-  >
-    <RNSVGSvgView
-      align="xMidYMid"
-      bbHeight="20"
-      bbWidth="20"
-      fill="none"
-      focusable={false}
-      height={20}
-      meetOrSlice={0}
-      minX={0}
-      minY={0}
-      style={
-        [
-          {
-            "backgroundColor": "transparent",
-            "borderWidth": 0,
-          },
-          {
-            "flex": 0,
-            "height": 20,
-            "width": 20,
-          },
-        ]
-      }
-      vbHeight={19}
-      vbWidth={12}
-      width={20}
-    >
-      <RNSVGGroup
-        fill={null}
-        propList={
-          [
-            "fill",
-          ]
-        }
-      >
-        <RNSVGPath
-          d="M1.66663 6.125L5.99996 1.625L10.3333 6.125M10.3333 12.875L5.99996 17.375L1.66663 12.875"
-          fill={
-            {
-              "payload": 4278190080,
-              "type": 0,
-            }
-          }
-          propList={
-            [
-              "stroke",
-              "strokeWidth",
-              "strokeLinecap",
-              "strokeLinejoin",
-            ]
-          }
-          stroke={
-            {
-              "payload": 4280232243,
-              "type": 0,
-            }
-          }
-          strokeLinecap={1}
-          strokeLinejoin={1}
-          strokeWidth="2"
-        />
-      </RNSVGGroup>
-    </RNSVGSvgView>
-  </View>
-</View>
-`;
-
-exports[`Select Picker test renders a picker without placeholder text 1`] = `
-<View
-  style={
-    {
-      "alignItems": "center",
-      "backgroundColor": "#FFFFFF",
-      "borderColor": "#E5E8EB",
-      "borderRadius": 8,
-      "borderStyle": "solid",
-      "borderWidth": 1,
-      "flexDirection": "row",
-      "height": 48,
-      "justifyContent": "center",
-      "paddingBottom": 8,
-      "paddingLeft": 16,
-      "paddingRight": 16,
-      "paddingTop": 8,
-      "width": "100%",
-    }
-  }
->
-  <View
-    style={
-      {
-        "height": "100%",
-        "justifyContent": "center",
-        "width": "100%",
-        "zIndex": 1,
-      }
-    }
-  >
-    <View
-      style={
-        [
-          {
-            "alignSelf": "stretch",
-          },
-          {
-            "flex": 1,
-            "justifyContent": "center",
-          },
-        ]
-      }
-    >
-      <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}
-        onClick={[Function]}
-        onResponderGrant={[Function]}
-        onResponderMove={[Function]}
-        onResponderRelease={[Function]}
-        onResponderTerminate={[Function]}
-        onResponderTerminationRequest={[Function]}
-        onStartShouldSetResponder={[Function]}
-        style={
-          {
-            "opacity": 1,
-          }
-        }
-        testID="ios_touchable_wrapper"
-      >
-        <View
-          pointerEvents="box-only"
-          style={
-            {
-              "height": "100%",
-              "justifyContent": "flex-start",
-            }
-          }
-        >
-          <TextInput
-            editable={false}
-            style={
-              [
-                {
-                  "alignItems": "center",
-                  "color": "#9AA5B1",
-                  "fontFamily": "SourceSansPro",
-                  "fontSize": 16,
-                  "justifyContent": "center",
-                  "lineHeight": 22.4,
-                },
-                {},
-              ]
-            }
-            testID="text_input"
-            value="an option"
-          />
-        </View>
-      </View>
-      <Modal
-        hardwareAccelerated={false}
-        onOrientationChange={[Function]}
-        supportedOrientations={
-          [
-            "portrait",
-            "landscape",
-          ]
-        }
-        testID="ios_modal"
-        transparent={true}
-        visible={false}
-      />
-    </View>
-  </View>
-  <View
-    style={
-      {
-        "alignItems": "center",
-        "height": "100%",
-        "justifyContent": "center",
-        "position": "absolute",
-        "right": 16,
-        "width": "10%",
-      }
-    }
-  >
-    <RNSVGSvgView
-      align="xMidYMid"
-      bbHeight="20"
-      bbWidth="20"
-      fill="none"
-      focusable={false}
-      height={20}
-      meetOrSlice={0}
-      minX={0}
-      minY={0}
-      style={
-        [
-          {
-            "backgroundColor": "transparent",
-            "borderWidth": 0,
-          },
-          {
-            "flex": 0,
-            "height": 20,
-            "width": 20,
-          },
-        ]
-      }
-      vbHeight={19}
-      vbWidth={12}
-      width={20}
-    >
-      <RNSVGGroup
-        fill={null}
-        propList={
-          [
-            "fill",
-          ]
-        }
-      >
-        <RNSVGPath
-          d="M1.66663 6.125L5.99996 1.625L10.3333 6.125M10.3333 12.875L5.99996 17.375L1.66663 12.875"
-          fill={
-            {
-              "payload": 4278190080,
-              "type": 0,
-            }
-          }
-          propList={
-            [
-              "stroke",
-              "strokeWidth",
-              "strokeLinecap",
-              "strokeLinejoin",
-            ]
-          }
-          stroke={
-            {
-              "payload": 4280232243,
-              "type": 0,
-            }
-          }
-          strokeLinecap={1}
-          strokeLinejoin={1}
-          strokeWidth="2"
-        />
-      </RNSVGGroup>
-    </RNSVGSvgView>
-  </View>
-</View>
-`;

package/src/components/molecules/select-picker/select-picker.test.js

@@ -1,31 +0,0 @@
-import React from 'react';
-import render from 'react-test-renderer';
-import {SelectPicker} from './select-picker.component';
-
-describe('Select Picker test', () => {
-  it('renders a picker with placeholder text', function () {
-    const tree = render
-      .create(
-        <SelectPicker
-          data={[{value: 1, label: 'an option'}]}
-          defaultValue={'an option'}
-          onChange={() => console.log('changed')}
-          placeholder={'Choose...'}
-        />
-      )
-      .toJSON();
-    expect(tree).toMatchSnapshot();
-  });
-  it('renders a picker without placeholder text', function () {
-    const tree = render
-      .create(
-        <SelectPicker
-          data={[{value: 1, label: 'an option'}]}
-          defaultValue={'an option'}
-          onChange={() => console.log('changed')}
-        />
-      )
-      .toJSON();
-    expect(tree).toMatchSnapshot();
-  });
-});