@tactics/toddle-styleguide 5.2.2 → 5.3.3

package/src/components/organisms/loading-indicator/__snapshots__/loading-indicator.test.js.snap

@@ -1,474 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`loading indicator test should render a default loading indicator 1`] = `
-<View
-  collapsable={false}
-  style={
-    {
-      "alignItems": "center",
-      "display": "flex",
-      "flexDirection": "row",
-      "justifyContent": "center",
-    }
-  }
->
-  <View
-    style={
-      {
-        "alignItems": "center",
-        "display": "flex",
-        "flexDirection": "row",
-        "height": 10,
-        "justifyContent": "center",
-        "margin": 2,
-        "width": 10,
-      }
-    }
-  >
-    <View
-      collapsable={false}
-      style={
-        {
-          "backgroundColor": "black",
-          "borderRadius": 9999,
-          "height": 0,
-          "position": "absolute",
-          "width": 0,
-        }
-      }
-    />
-  </View>
-  <View
-    style={
-      {
-        "alignItems": "center",
-        "display": "flex",
-        "flexDirection": "row",
-        "height": 10,
-        "justifyContent": "center",
-        "margin": 2,
-        "width": 10,
-      }
-    }
-  >
-    <View
-      collapsable={false}
-      style={
-        {
-          "backgroundColor": "black",
-          "borderRadius": 9999,
-          "height": 0,
-          "position": "absolute",
-          "width": 0,
-        }
-      }
-    />
-  </View>
-  <View
-    style={
-      {
-        "alignItems": "center",
-        "display": "flex",
-        "flexDirection": "row",
-        "height": 10,
-        "justifyContent": "center",
-        "margin": 2,
-        "width": 10,
-      }
-    }
-  >
-    <View
-      collapsable={false}
-      style={
-        {
-          "backgroundColor": "black",
-          "borderRadius": 9999,
-          "height": 0,
-          "position": "absolute",
-          "width": 0,
-        }
-      }
-    />
-  </View>
-</View>
-`;
-
-exports[`loading indicator test should render a flashing loading indicator with a dot size of 12px 1`] = `
-<View
-  collapsable={false}
-  style={
-    {
-      "alignItems": "center",
-      "display": "flex",
-      "flexDirection": "row",
-      "justifyContent": "center",
-    }
-  }
->
-  <View
-    style={
-      {
-        "alignItems": "center",
-        "display": "flex",
-        "flexDirection": "row",
-        "height": 12,
-        "justifyContent": "center",
-        "margin": 2,
-        "width": 12,
-      }
-    }
-  >
-    <View
-      collapsable={false}
-      style={
-        {
-          "backgroundColor": "black",
-          "borderRadius": 9999,
-          "height": 12,
-          "opacity": 12,
-          "position": "absolute",
-          "width": 12,
-        }
-      }
-    />
-  </View>
-  <View
-    style={
-      {
-        "alignItems": "center",
-        "display": "flex",
-        "flexDirection": "row",
-        "height": 12,
-        "justifyContent": "center",
-        "margin": 2,
-        "width": 12,
-      }
-    }
-  >
-    <View
-      collapsable={false}
-      style={
-        {
-          "backgroundColor": "black",
-          "borderRadius": 9999,
-          "height": 12,
-          "opacity": 12,
-          "position": "absolute",
-          "width": 12,
-        }
-      }
-    />
-  </View>
-  <View
-    style={
-      {
-        "alignItems": "center",
-        "display": "flex",
-        "flexDirection": "row",
-        "height": 12,
-        "justifyContent": "center",
-        "margin": 2,
-        "width": 12,
-      }
-    }
-  >
-    <View
-      collapsable={false}
-      style={
-        {
-          "backgroundColor": "black",
-          "borderRadius": 9999,
-          "height": 12,
-          "opacity": 12,
-          "position": "absolute",
-          "width": 12,
-        }
-      }
-    />
-  </View>
-</View>
-`;
-
-exports[`loading indicator test should render a ping loading indicator with a size of 14px and a spacing of 4px 1`] = `
-<View
-  collapsable={false}
-  style={
-    {
-      "alignItems": "center",
-      "display": "flex",
-      "flexDirection": "row",
-      "justifyContent": "center",
-    }
-  }
->
-  <View
-    style={
-      {
-        "alignItems": "center",
-        "display": "flex",
-        "flexDirection": "row",
-        "height": 14,
-        "justifyContent": "center",
-        "margin": 4,
-        "width": 14,
-      }
-    }
-  >
-    <View
-      collapsable={false}
-      style={
-        {
-          "backgroundColor": "black",
-          "borderRadius": 9999,
-          "height": 14,
-          "opacity": 1,
-          "position": "absolute",
-          "transform": [
-            {
-              "scale": 0,
-            },
-          ],
-          "width": 14,
-        }
-      }
-    />
-  </View>
-  <View
-    style={
-      {
-        "alignItems": "center",
-        "display": "flex",
-        "flexDirection": "row",
-        "height": 14,
-        "justifyContent": "center",
-        "margin": 4,
-        "width": 14,
-      }
-    }
-  >
-    <View
-      collapsable={false}
-      style={
-        {
-          "backgroundColor": "black",
-          "borderRadius": 9999,
-          "height": 14,
-          "opacity": 1,
-          "position": "absolute",
-          "transform": [
-            {
-              "scale": 0,
-            },
-          ],
-          "width": 14,
-        }
-      }
-    />
-  </View>
-  <View
-    style={
-      {
-        "alignItems": "center",
-        "display": "flex",
-        "flexDirection": "row",
-        "height": 14,
-        "justifyContent": "center",
-        "margin": 4,
-        "width": 14,
-      }
-    }
-  >
-    <View
-      collapsable={false}
-      style={
-        {
-          "backgroundColor": "black",
-          "borderRadius": 9999,
-          "height": 14,
-          "opacity": 1,
-          "position": "absolute",
-          "transform": [
-            {
-              "scale": 0,
-            },
-          ],
-          "width": 14,
-        }
-      }
-    />
-  </View>
-</View>
-`;
-
-exports[`loading indicator test should render a typing loading indicator with a red color and a delay of 200 1`] = `
-<View
-  collapsable={false}
-  style={
-    {
-      "alignItems": "center",
-      "display": "flex",
-      "flexDirection": "row",
-      "justifyContent": "center",
-    }
-  }
->
-  <View
-    style={
-      {
-        "alignItems": "center",
-        "display": "flex",
-        "flexDirection": "row",
-        "height": 10,
-        "justifyContent": "center",
-        "margin": 2,
-        "width": 10,
-      }
-    }
-  >
-    <View
-      collapsable={false}
-      style={
-        {
-          "backgroundColor": "red",
-          "borderRadius": 9999,
-          "height": 10,
-          "position": "absolute",
-          "top": 0,
-          "width": 10,
-        }
-      }
-    />
-  </View>
-  <View
-    style={
-      {
-        "alignItems": "center",
-        "display": "flex",
-        "flexDirection": "row",
-        "height": 10,
-        "justifyContent": "center",
-        "margin": 2,
-        "width": 10,
-      }
-    }
-  >
-    <View
-      collapsable={false}
-      style={
-        {
-          "backgroundColor": "red",
-          "borderRadius": 9999,
-          "height": 10,
-          "position": "absolute",
-          "top": 0,
-          "width": 10,
-        }
-      }
-    />
-  </View>
-  <View
-    style={
-      {
-        "alignItems": "center",
-        "display": "flex",
-        "flexDirection": "row",
-        "height": 10,
-        "justifyContent": "center",
-        "margin": 2,
-        "width": 10,
-      }
-    }
-  >
-    <View
-      collapsable={false}
-      style={
-        {
-          "backgroundColor": "red",
-          "borderRadius": 9999,
-          "height": 10,
-          "position": "absolute",
-          "top": 0,
-          "width": 10,
-        }
-      }
-    />
-  </View>
-</View>
-`;
-
-exports[`loading indicator test should render an elastic loading indicator with 2 dots 1`] = `
-<View
-  collapsable={false}
-  style={
-    {
-      "alignItems": "center",
-      "display": "flex",
-      "flexDirection": "row",
-      "justifyContent": "center",
-    }
-  }
->
-  <View
-    style={
-      {
-        "alignItems": "center",
-        "display": "flex",
-        "flexDirection": "row",
-        "height": 10,
-        "justifyContent": "center",
-        "margin": 2,
-        "width": 10,
-      }
-    }
-  >
-    <View
-      collapsable={false}
-      style={
-        {
-          "backgroundColor": "black",
-          "borderRadius": 9999,
-          "height": 10,
-          "position": "absolute",
-          "transform": [
-            {
-              "scaleY": 1,
-            },
-          ],
-          "width": 10,
-        }
-      }
-    />
-  </View>
-  <View
-    style={
-      {
-        "alignItems": "center",
-        "display": "flex",
-        "flexDirection": "row",
-        "height": 10,
-        "justifyContent": "center",
-        "margin": 2,
-        "width": 10,
-      }
-    }
-  >
-    <View
-      collapsable={false}
-      style={
-        {
-          "backgroundColor": "black",
-          "borderRadius": 9999,
-          "height": 10,
-          "position": "absolute",
-          "transform": [
-            {
-              "scaleY": 1,
-            },
-          ],
-          "width": 10,
-        }
-      }
-    />
-  </View>
-</View>
-`;

package/src/components/organisms/loading-indicator/loading-indicator.test.js

@@ -1,41 +0,0 @@
-import React from 'react';
-import renderer from 'react-test-renderer';
-import {LoadingIndicator} from './loading-indicator.component';
-jest.useFakeTimers();
-
-describe('loading indicator test', function () {
-  it('should render a default loading indicator', function () {
-    const tree = renderer.create(<LoadingIndicator />).toJSON();
-
-    expect(tree).toMatchSnapshot();
-  });
-  it('should render an elastic loading indicator with 2 dots', function () {
-    const tree = renderer
-      .create(<LoadingIndicator animation={'elastic'} dots={2} />)
-      .toJSON();
-    expect(tree).toMatchSnapshot();
-  });
-  it('should render a flashing loading indicator with a dot size of 12px', function () {
-    const tree = renderer
-      .create(<LoadingIndicator animation={'flashing'} size={12} />)
-      .toJSON();
-
-    expect(tree).toMatchSnapshot();
-  });
-  it('should render a typing loading indicator with a red color and a delay of 200', function () {
-    const tree = renderer
-      .create(
-        <LoadingIndicator animation={'typing'} color={'red'} delay={200} />
-      )
-      .toJSON();
-
-    expect(tree).toMatchSnapshot();
-  });
-  it('should render a ping loading indicator with a size of 14px and a spacing of 4px', function () {
-    const tree = renderer
-      .create(<LoadingIndicator animation={'ping'} size={14} spacing={4} />)
-      .toJSON();
-
-    expect(tree).toMatchSnapshot();
-  });
-});