Merge pull request #171 from TechnologyAdvice/feature/fix-conformance…

…-tests Fix conformance tests
Semantic-Org · Mar 16, 2016 · 954e826 · 954e826
2 parents ab28c17 + 4c174cf
commit 954e826
Show file tree

Hide file tree

Showing 25 changed files with 162 additions and 162 deletions.
diff --git a/docs/app/ComponentGuidelines.md b/docs/app/ComponentGuidelines.md
@@ -190,28 +190,28 @@ All magic is noted in the documentation examples.
 
 ```jsx
 <Form.Field className='inherit-this' />
-// => <div className='sd-field inherit-this field>...
+// => <div className='sd-form-field inherit-this field>...
 ```
 
 **Never**
 
 ```jsx
 <Form.Field className='inherit-this' />
-// => <div className='sd-field field>...
+// => <div className='sd-form-field field>...
 ```
 >className was not inherited
 
 ```jsx
 <Form.Field className='inherit-this' />
-// => <div className='inherit-this sd-field field>...
+// => <div className='inherit-this sd-form-field field>...
 ```
->className was inherited before sd-field
+>className was inherited before sd-form-field
 
 ```jsx
 <Form.Field className='inherit-this' />
-// => <div className='inherit-this sd-field field>...
+// => <div className='inherit-this sd-form-field field>...
 ```
->className was not inherited before sd-field
+>className was not inherited before sd-form-field
 
 #### Has `sd-<component>` as the first class
 

diff --git a/karma.conf.babel.js b/karma.conf.babel.js
@@ -65,7 +65,7 @@ export default (config) => {
       progress: false,
       stats: statConfig,
       debug: true,
-      noInfo: true,
+      noInfo: false,
       quiet: false,
     },
   })

diff --git a/package.json b/package.json
@@ -44,7 +44,7 @@
   },
   "devDependencies": {
     "babel-cli": "^6.5.1",
-    "babel-core": "^6.5.1",
+    "babel-core": "^6.5.2",
     "babel-eslint": "^4.1.6",
     "babel-loader": "^6.2.0",
     "babel-plugin-add-module-exports": "^0.1.2",
@@ -84,8 +84,10 @@
     "phantomjs-polyfill": "0.0.1",
     "pre-commit": "^1.1.2",
     "raw-loader": "^0.5.1",
+    "react": "^0.14.0",
     "react-addons-test-utils": "^0.14.0",
     "react-docgen": "^2.2.0",
+    "react-dom": "^0.14.0",
     "react-highlight": "0.5.1",
     "react-hot-loader": "^1.3.0",
     "require-dir": "^0.3.0",

diff --git a/src/collections/Form/FormField.js b/src/collections/Form/FormField.js
@@ -3,7 +3,7 @@ import classNames from 'classnames'
 import numberToWord from '../../utils/numberToWord'
 import META from '../../utils/Meta.js'
 
-export default class Field extends Component {
+export default class FormField extends Component {
   static propTypes = {
     children: PropTypes.node,
     className: PropTypes.string,
@@ -13,14 +13,14 @@ export default class Field extends Component {
 
   static _meta = {
     library: META.library.semanticUI,
-    name: 'Field',
+    name: 'FormField',
     parent: 'Form',
     type: META.type.collection,
   };
 
   render() {
     const classes = classNames(
-      'sd-field',
+      'sd-form-field',
       this.props.width && numberToWord(this.props.width) + ' wide',
       this.props.className,
       'field'

diff --git a/src/collections/Form/FormFields.js b/src/collections/Form/FormFields.js
@@ -5,7 +5,7 @@ import getUnhandledProps from '../../utils/getUnhandledProps'
 import numberToWord from '../../utils/numberToWord'
 import META from '../../utils/Meta.js'
 
-export default class Fields extends Component {
+export default class FormFields extends Component {
   static propTypes = {
     children: PropTypes.node,
     className: PropTypes.string,
@@ -17,22 +17,25 @@ export default class Fields extends Component {
 
   static _meta = {
     library: META.library.semanticUI,
-    name: 'Fields',
+    name: 'FormFields',
     parent: 'Form',
     type: META.type.collection,
   };
 
   render() {
     let fieldCount = 0
-    Children.forEach(this.props.children, child => {
-      if (_.get(child, 'type._meta.name') === 'Field') fieldCount += 1
-    })
-    fieldCount = numberToWord(fieldCount)
+    if (this.props.evenlyDivided) {
+      Children.forEach(this.props.children, child => {
+        if (_.get(child, 'type._meta.name') === 'FormField') {
+          fieldCount += 1
+        }
+      })
+    }
 
     const classes = classNames(
-      'sd-fields',
-      this.props.evenlyDivided && fieldCount,
+      'sd-form-fields',
       this.props.className,
+      numberToWord(fieldCount),
       'fields'
     )
     const props = getUnhandledProps(this)

diff --git a/src/collections/Grid/GridColumn.js b/src/collections/Grid/GridColumn.js
@@ -14,14 +14,14 @@ export default class GridColumn extends Component {
 
   static _meta = {
     library: META.library.semanticUI,
-    name: 'Column',
+    name: 'GridColumn',
     type: META.type.collection,
     parent: 'Grid',
   };
 
   render() {
     const classes = classNames(
-      'sd-column',
+      'sd-grid-column',
       this.props.className,
       this.props.width && numberToWord(this.props.width) + ' wide',
       'column'

diff --git a/src/collections/Grid/GridRow.js b/src/collections/Grid/GridRow.js
@@ -10,14 +10,14 @@ export default class GridRow extends Component {
 
   static _meta = {
     library: META.library.semanticUI,
-    name: 'Row',
+    name: 'GridRow',
     type: META.type.collection,
     parent: 'Grid',
   };
 
   render() {
     const classes = classNames(
-      'sd-row',
+      'sd-grid-row',
       this.props.className,
       'row'
     )

diff --git a/src/elements/Header/Header.js b/src/elements/Header/Header.js
@@ -15,16 +15,18 @@ export default class Header extends Component {
     name: 'Header',
     type: META.type.element,
   };
+
   static H1 = HeaderH1;
   static H2 = HeaderH2;
   static H3 = HeaderH3;
   static H4 = HeaderH4;
   static H5 = HeaderH5;
   static H6 = HeaderH6;
   static Subheader = HeaderSubheader;
+
   render() {
     return (
-      <_Header {...this.props} _headerElement='div'/>
+      <_Header {...this.props} />
     )
   }
 }
diff --git a/src/elements/Header/HeaderH1.js b/src/elements/Header/HeaderH1.js
@@ -5,13 +5,14 @@ import _Header from './_Header'
 export default class HeaderH1 extends Component {
   static _meta = {
     library: META.library.semanticUI,
-    name: 'H1',
+    name: 'HeaderH1',
+    parent: 'Header',
     type: META.type.element,
   };
 
   render() {
     return (
-      <_Header {...this.props} _headerElement='h1'/>
+      <_Header {...this.props} _sdClass='sd-header-h1' _headerElement='h1' />
     )
   }
 }
diff --git a/src/elements/Header/HeaderH2.js b/src/elements/Header/HeaderH2.js
@@ -3,15 +3,17 @@ import META from '../../utils/Meta'
 import _Header from './_Header'
 
 export default class HeaderH2 extends Component {
+
   static _meta = {
     library: META.library.semanticUI,
-    name: 'H2',
+    name: 'HeaderH2',
+    parent: 'Header',
     type: META.type.element,
   };
 
   render() {
     return (
-      <_Header {...this.props} _headerElement='h2'/>
+      <_Header {...this.props} _sdClass='sd-header-h2' _headerElement='h2' />
     )
   }
 }
diff --git a/src/elements/Header/HeaderH3.js b/src/elements/Header/HeaderH3.js
@@ -5,13 +5,14 @@ import _Header from './_Header'
 export default class HeaderH3 extends Component {
   static _meta = {
     library: META.library.semanticUI,
-    name: 'H3',
+    name: 'HeaderH3',
+    parent: 'Header',
     type: META.type.element,
   };
 
   render() {
     return (
-      <_Header {...this.props} _headerElement='h3'/>
+      <_Header {...this.props} _sdClass='sd-header-h3' _headerElement='h3' />
     )
   }
 }
diff --git a/src/elements/Header/HeaderH4.js b/src/elements/Header/HeaderH4.js
@@ -5,13 +5,14 @@ import _Header from './_Header'
 export default class HeaderH4 extends Component {
   static _meta = {
     library: META.library.semanticUI,
-    name: 'H4',
+    name: 'HeaderH4',
+    parent: 'Header',
     type: META.type.element,
   };
 
   render() {
     return (
-      <_Header {...this.props} _headerElement='h4'/>
+      <_Header {...this.props} _sdClass='sd-header-h4' _headerElement='h4' />
     )
   }
 }
diff --git a/src/elements/Header/HeaderH5.js b/src/elements/Header/HeaderH5.js
@@ -5,13 +5,14 @@ import _Header from './_Header'
 export default class HeaderH5 extends Component {
   static _meta = {
     library: META.library.semanticUI,
-    name: 'H5',
+    name: 'HeaderH5',
+    parent: 'Header',
     type: META.type.element,
   };
 
   render() {
     return (
-      <_Header {...this.props} _headerElement='h5'/>
+      <_Header {...this.props} _sdClass='sd-header-h5' _headerElement='h5' />
     )
   }
 }
diff --git a/src/elements/Header/HeaderH6.js b/src/elements/Header/HeaderH6.js
@@ -5,13 +5,14 @@ import _Header from './_Header'
 export default class HeaderH6 extends Component {
   static _meta = {
     library: META.library.semanticUI,
-    name: 'H6',
+    name: 'HeaderH6',
+    parent: 'Header',
     type: META.type.element,
   };
 
   render() {
     return (
-      <_Header {...this.props} _headerElement='h6'/>
+      <_Header {...this.props} _sdClass='sd-header-h6' _headerElement='h6' />
     )
   }
 }
diff --git a/src/elements/Header/HeaderSubheader.js b/src/elements/Header/HeaderSubheader.js
@@ -10,12 +10,13 @@ export default class HeaderSubheader extends Component {
   };
   static _meta = {
     library: META.library.semanticUI,
-    name: 'Subheader',
+    name: 'HeaderSubheader',
+    parent: 'Header',
     type: META.type.element,
   };
   render() {
     const classes = classNames(
-      'sd-sub',
+      'sd-header-subheader',
       'sub',
       this.props.className,
       'header',

diff --git a/src/elements/Header/_Header.js b/src/elements/Header/_Header.js
@@ -1,17 +1,22 @@
-import _ from 'lodash'
-import React, { Component, PropTypes } from 'react'
-import classNames from 'classnames'
+import cx from 'classnames'
+import React, { createElement, Component, PropTypes } from 'react'
+
 import META from '../../utils/Meta'
-import getUnhandledProps from '../../utils/getUnhandledProps'
 
 export default class _Header extends Component {
   static propTypes = {
     _headerElement: PropTypes.string,
+    _sdClass: PropTypes.string,
     children: PropTypes.node,
     className: PropTypes.string,
     icon: PropTypes.node,
     image: PropTypes.node,
-  };
+  }
+
+  static defaultProps = {
+    _headerElement: 'div',
+    _sdClass: 'sd-header',
+  }
 
   static _meta = {
     library: META.library.stardust,
@@ -20,23 +25,18 @@ export default class _Header extends Component {
   };
 
   render() {
-    const classes = classNames(
-      'sd-header',
-      'ui',
-      this.props.className,
-      'header'
-    )
-
-    const props = getUnhandledProps(this)
-    const children = this.props.image || this.props.icon
+    const content = this.props.image || this.props.icon
       ? <div className='content'>{this.props.children}</div>
       : this.props.children
 
-    return React.createElement(
-      this.props._headerElement,
-      _.assign({}, props, { className: classes }),
-      this.props.image || this.props.icon,
-      children,
-    )
+    return createElement(this.props._headerElement, {
+      ...this.props,
+      className: cx(
+        this.props._sdClass,
+        'ui',
+        this.props.className,
+        'header'
+      ),
+    }, content)
   }
 }
diff --git a/src/views/Statistic/Statistic.js b/src/views/Statistic/Statistic.js
@@ -5,7 +5,7 @@ import getUnhandledProps from '../../utils/getUnhandledProps'
 import { customPropTypes } from '../../utils/propUtils'
 import META from '../../utils/Meta'
 
-import Statistics from './Statistics'
+import StatisticStatistics from './StatisticStatistics'
 import StatisticLabel from './StatisticLabel'
 import StatisticValue from './StatisticValue'
 
@@ -21,7 +21,7 @@ export default class Statistic extends Component {
     type: META.type.view,
   };
 
-  static Statistics = Statistics;
+  static Statistics = StatisticStatistics;
   static Label = StatisticLabel;
   static Value = StatisticValue;
 

diff --git a/src/views/Statistic/StatisticLabel.js b/src/views/Statistic/StatisticLabel.js
@@ -11,7 +11,7 @@ export default class StatisticLabel extends Component {
 
   static _meta = {
     library: META.library.semanticUI,
-    name: 'Label',
+    name: 'StatisticLabel',
     type: META.type.view,
     parent: 'Statistic',
   };