add single Statistic example and tests

Author: levithomason

docs/app/Examples/views/Statistic/StatisticExamples.js

@@ -0,0 +1,12 @@
+import React, {Component} from 'react';
+import StatisticTypesExamples from './Types/StatisticTypesExamples';
+
+export default class StatisticExamples extends Component {
+  render() {
+    return (
+      <div>
+        <StatisticTypesExamples />
+      </div>
+    );
+  }
+}

docs/app/Examples/views/Statistic/Types/StatisticStatisticExample.js

@@ -0,0 +1,13 @@
+import React, {Component} from 'react';
+import {Statistic} from 'stardust';
+import _ from 'lodash';
+
+export default class StatisticStatisticExample extends Component {
+  render() {
+    const value = _.random(0, 12000).toLocaleString();
+
+    return (
+      <Statistic value={value} label='Value'/>
+    );
+  }
+}

docs/app/Examples/views/Statistic/Types/StatisticTypesExamples.js

@@ -0,0 +1,17 @@
+import React, {Component} from 'react';
+import ComponentExample from 'docs/app/Components/ComponentDoc/ComponentExample';
+import ExampleSection from 'docs/app/Components/ComponentDoc/ExampleSection';
+
+export default class StatisticTypesExamples extends Component {
+  render() {
+    return (
+      <ExampleSection title='Types'>
+        <ComponentExample
+          title='Statistic'
+          description='A statistic can display a value with a label above or below it.'
+          examplePath='views/Statistic/Types/StatisticStatisticExample'
+        />
+      </ExampleSection>
+    );
+  }
+}

src/index.js

@@ -38,6 +38,8 @@ import Dropdown from 'src/modules/Dropdown/Dropdown';
 // Views
 import Item from 'src/views/Items/Item';
 import Items from 'src/views/Items/Items';
+import Statistic from 'src/views/Statistic/Statistic';
+import Statistics from 'src/views/Statistic/Statistics';
 
 export default {
   // Addons
@@ -80,4 +82,6 @@ export default {
   // Views
   Item,
   Items,
+  Statistic,
+  Statistics,
 };

src/views/Statistic/Statistic.js

@@ -6,18 +6,19 @@ import META from 'src/utils/Meta';
 export default class Statistic extends Component {
   static propTypes = {
     className: PropTypes.string,
-    label: PropTypes.node,
-    value: PropTypes.node,
+    label: PropTypes.node.isRequired,
+    value: PropTypes.node.isRequired,
   };
 
   static _meta = {
     library: META.library.semanticUI,
-    name: 'Statistics',
+    name: 'Statistic',
     type: META.type.view,
   };
 
   render() {
     const classes = classNames(
+      'sd-statistic',
       'ui',
       this.props.className,
       'statistic',

src/views/Statistic/Statistics.js

@@ -17,7 +17,7 @@ export default class Statistics extends Component {
 
   render() {
     const classes = classNames(
-      'sd-statistic',
+      'sd-statistics',
       'ui',
       this.props.className,
       'statistic'

test/specs/views/Items/Statistic-test.js

@@ -0,0 +1,15 @@
+import _ from 'lodash';
+import React from 'react';
+import {Statistic} from 'stardust';
+import faker from 'faker';
+
+describe('Statistic', () => {
+  it('renders value', () => {
+    const value = faker.hacker.phrase();
+    render(<Statistic value={value} />).assertText(value);
+  });
+  it('renders data', () => {
+    const data = _.random(0, 10000000);
+    render(<Statistic data={data} />).assertText(data);
+  });
+});