test(status-indicator): Add snapshots (#692)

modules/status-indicator/react/package.json

@@ -47,6 +47,7 @@
     "@workday/design-assets-types": "^0.2.4"
   },
   "devDependencies": {
-    "@workday/canvas-system-icons-web": "^1.0.20"
+    "@workday/canvas-system-icons-web": "^1.0.20",
+    "@workday/canvas-kit-labs-react-core": "^3.8.0"
   }
 }

modules/status-indicator/react/stories/stories_VisualTesting.tsx

@@ -0,0 +1,44 @@
+/// <reference path="../../../../typings.d.ts" />
+import * as React from 'react';
+import {StaticStates} from '@workday/canvas-kit-labs-react-core';
+import {
+  ComponentStatesTable,
+  permutateProps,
+  withSnapshotsEnabled,
+} from '../../../../utils/storybook';
+
+import {StatusIndicator} from '../';
+import {uploadCloudIcon} from '@workday/canvas-system-icons-web';
+
+export default withSnapshotsEnabled({
+  title: 'Testing|React/Indicators/Status Indicator',
+  component: StatusIndicator,
+});
+
+export const StatusIndicatorStates = () => (
+  <StaticStates>
+    <ComponentStatesTable
+      rowProps={permutateProps({
+        emphasis: [
+          {value: StatusIndicator.Emphasis.Low, label: 'Low Emphasis'},
+          {value: StatusIndicator.Emphasis.High, label: 'High Emphasis'},
+        ],
+        icon: [{value: undefined, label: ''}, {value: uploadCloudIcon, label: 'With Icon'}],
+      })}
+      columnProps={permutateProps({
+        type: [
+          {value: StatusIndicator.Type.Gray, label: 'Gray'},
+          {value: StatusIndicator.Type.Blue, label: 'Blue'},
+          {value: StatusIndicator.Type.Green, label: 'Green'},
+          {value: StatusIndicator.Type.Orange, label: 'Orange'},
+          {value: StatusIndicator.Type.Red, label: 'Red'},
+          {value: StatusIndicator.Type.Transparent, label: 'Transparent'},
+        ],
+      })}
+    >
+      {({type, emphasis, props}) => (
+        <StatusIndicator type={type} emphasis={emphasis} {...props} label="Status" />
+      )}
+    </ComponentStatesTable>
+  </StaticStates>
+);