diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md
index 8c05865576..9dcf6e693f 100644
--- a/CONTRIBUTING.md
+++ b/CONTRIBUTING.md
@@ -6,7 +6,7 @@ CONTRIBUTING
 
 
 - [Getting Started](#getting-started)
-  - [Clone & Install](#clone-&-install)
+  - [Fork, Clone & Install](#fork-clone-&-install)
   - [Commit Messages](#commit-messages)
   - [Commands](#commands)
 - [Workflow](#workflow)
@@ -18,7 +18,7 @@ CONTRIBUTING
 - [API](#api)
   - [SUI HTML Classes](#sui-html-classes)
     - [API Patterns](#api-patterns)
-    - [Prop Utils](#prop-utils)
+    - [Building className](#building-classname)
     - [Testing className](#testing-classname)
   - [SUI HTML Markup](#sui-html-markup)
     - [SUI Components vs Component Parts](#sui-components-vs-component-parts)
@@ -115,9 +115,9 @@ function Button(props) {
 Stateful components should be classes:
 
 ```js
-import AutoControlledComponent from 'src/utils/AutoControlledComponent'
+import { AutoControlledComponent as Component } from '../../lib'
 
-class Dropdown extends AutoControlledComponent {
+class Dropdown extends Component {
   // ...
 }
 ```
@@ -131,7 +131,7 @@ Every component has a static property called `_meta`.  This object defines the c
 Here's an example `_meta` object:
 
 ```js
-import META from '../../utils/Meta'
+import { META } from '../../lib'
 
 const _meta = {
   name: 'MyComponent',
@@ -216,13 +216,13 @@ Each group has an API pattern and prop util for building up the `className` and
 <div class="ui small red segment"></div>
 ```
 
-#### Prop Utils
+#### Building className
 
-Use [`propUtils`][4] to extract the prop values and build up the `className`.  Grouped classes like `color` and `size` simply use the prop value as the `className`.
+Use [`classNameBuilders`][4] to extract the prop values and build up the `className`.  Grouped classes like `color` and `size` simply use the prop value as the `className`.
 
 ```js
 import cx from 'classnames'
-import { useKeyOnly, useValueAndKey, useKeyOrValueAndKey } from 'src/utils/propUtils'
+import { useKeyOnly, useValueAndKey, useKeyOrValueAndKey } from '../../lib'
 
 function Segment({ size, color, basic, floated, padded }) {
   const classes = cx(
@@ -330,8 +330,6 @@ class List {
 
 #### Component Part Props
 
->Warning, this pattern is experimental.  Feel free to consider it in your API spec if it makes sense.  We do not yet know if it is here to stay.
-
 Sometimes it is convenient to use props to generate markup.  Example, the [Label][10] markup is minimal.  One configuration includes an image and detail:
 
 ```html
@@ -350,15 +348,11 @@ We allow props to define these minimal *component parts*:
   detail='Friend'
   text='Veronica'
 />
-
-// or
-
-<Label image='veronika.jpg' detail='Friend'>
-  Veronica
-</Label>
 ```
 
-See [`propUtils`][4] for special prop renderers for handling `image` and `icon` props for this purpose.
+When props are used for component markup generation, children are not allowed in order to prevent conflicts.  See [this response][14] for more.
+
+See [`src/factories`][13] for special methods to convert props values into ReactElements for this purpose.
 
 ## Testing
 
@@ -523,7 +517,7 @@ Adding documentation for new components is a bit tedious.  The best way to do th
 [1]: https://github.com/TechnologyAdvice/stardust/blob/master/test/specs/commonTests.js
 [2]: https://facebook.github.io/react/docs/forms.html#controlled-components
 [3]: https://facebook.github.io/react/docs/forms.html#uncontrolled-components
-[4]: https://github.com/TechnologyAdvice/stardust/blob/master/src/utils/propUtils.js
+[4]: https://github.com/TechnologyAdvice/stardust/blob/master/src/lib/classNameBuilders.js
 [5]: http://semantic-ui.com/elements/header
 [6]: http://semantic-ui.com/views/item
 [7]: https://github.com/TechnologyAdvice/stardust/pull/281#issuecomment-228663527
@@ -532,3 +526,5 @@ Adding documentation for new components is a bit tedious.  The best way to do th
 [10]: http://semantic-ui.com/elements/label.html
 [11]: https://nodejs.org/
 [12]: https://github.com/TechnologyAdvice/stardust#fork-destination-box
+[13]: https://github.com/TechnologyAdvice/stardust/blob/master/src/factories
+[14]: https://github.com/TechnologyAdvice/stardust/pull/335#issuecomment-238960895
diff --git a/codecov.yml b/codecov.yml
index a599a3d7c6..59e9f52458 100644
--- a/codecov.yml
+++ b/codecov.yml
@@ -1,3 +1,4 @@
 coverage:
   ignore:
-    - src/utils/*
+    - src/factories/*
+    - src/lib/*
diff --git a/docs/app/Components/ComponentDoc/ComponentDescription.js b/docs/app/Components/ComponentDoc/ComponentDescription.js
index 557eea38e8..455d0640a2 100644
--- a/docs/app/Components/ComponentDoc/ComponentDescription.js
+++ b/docs/app/Components/ComponentDoc/ComponentDescription.js
@@ -1,7 +1,7 @@
 import _ from 'lodash'
 import React, { Component, PropTypes } from 'react'
 import * as stardust from 'stardust'
-import META from 'src/utils/Meta'
+import { META } from 'src/lib'
 import { Link } from 'react-router'
 const { Divider, Grid, Header, List } = stardust
 
diff --git a/docs/app/Components/ComponentDoc/ComponentExample.js b/docs/app/Components/ComponentDoc/ComponentExample.js
index 85d8b71679..efad5c5786 100644
--- a/docs/app/Components/ComponentDoc/ComponentExample.js
+++ b/docs/app/Components/ComponentDoc/ComponentExample.js
@@ -1,10 +1,9 @@
 import React, { Component, createElement, PropTypes } from 'react'
-import { Grid, Header, Icon } from 'stardust'
 import Highlight from 'react-highlight'
+
 import { exampleContext } from 'docs/app/utils'
-import {
-  getUnhandledProps,
-} from 'src/utils/propUtils'
+import { getUnhandledProps } from 'src/lib'
+import { Grid, Header, Icon } from 'stardust'
 
 /**
  * Renders a `component` and the raw `code` that produced it.
diff --git a/docs/app/Components/ComponentDoc/ComponentExamples.js b/docs/app/Components/ComponentDoc/ComponentExamples.js
index a5461bc674..b4af5224b8 100644
--- a/docs/app/Components/ComponentDoc/ComponentExamples.js
+++ b/docs/app/Components/ComponentDoc/ComponentExamples.js
@@ -1,7 +1,7 @@
 import React, { Component, createElement, PropTypes } from 'react'
 
 import { exampleContext } from 'docs/app/utils'
-import { Divider, Header, Message } from 'stardust'
+import { Divider, Header, Icon, Message } from 'stardust'
 
 export default class ComponentExamples extends Component {
   static propTypes = {
@@ -22,15 +22,18 @@ export default class ComponentExamples extends Component {
   renderMissingExamples = () => {
     const { name } = this.props
     return (
-      <Message icon='book' className='info'>
-        If there's no
-        <a
-          href='https://github.com/TechnologyAdvice/stardust/pulls'
-        > pull request </a>
-        open for <code>&lt;{name} /&gt;</code> examples, you should
-        <a
-          href='https://github.com/TechnologyAdvice/stardust/blob/master/CONTRIBUTING.md'
-        > contribute</a>!
+      <Message info icon>
+        <Icon name='book' />
+        <Message.Content>
+          If there's no
+          <a
+            href='https://github.com/TechnologyAdvice/stardust/pulls'
+          > pull request </a>
+          open for <code>&lt;{name} /&gt;</code> examples, you should
+          <a
+            href='https://github.com/TechnologyAdvice/stardust/blob/master/CONTRIBUTING.md'
+          > contribute</a>!
+        </Message.Content>
       </Message>
     )
   }
diff --git a/docs/app/Components/ComponentDoc/ComponentProps.js b/docs/app/Components/ComponentDoc/ComponentProps.js
index 57c0ce4765..3aedbd1052 100644
--- a/docs/app/Components/ComponentDoc/ComponentProps.js
+++ b/docs/app/Components/ComponentDoc/ComponentProps.js
@@ -1,5 +1,6 @@
 import _ from 'lodash'
 import React, { Component, PropTypes } from 'react'
+
 import { Divider, Header, Label, Table } from 'stardust'
 
 const DOCBLOCK_DESCRIPTION_DEFAULTS = {
diff --git a/docs/app/Components/ComponentDoc/ExampleSection.js b/docs/app/Components/ComponentDoc/ExampleSection.js
index fbf055b7be..2a7a34118d 100644
--- a/docs/app/Components/ComponentDoc/ExampleSection.js
+++ b/docs/app/Components/ComponentDoc/ExampleSection.js
@@ -1,4 +1,5 @@
 import React, { Component, PropTypes } from 'react'
+
 import { Header } from 'stardust'
 
 export default class ExampleSection extends Component {
diff --git a/docs/app/Components/PageNotFound/PageNotFound.js b/docs/app/Components/PageNotFound/PageNotFound.js
index 982a1ab141..2061156f07 100644
--- a/docs/app/Components/PageNotFound/PageNotFound.js
+++ b/docs/app/Components/PageNotFound/PageNotFound.js
@@ -1,5 +1,6 @@
 import _ from 'lodash'
 import React, { Component } from 'react'
+
 import { Button, Header, Loader } from 'stardust'
 
 const containerStyle = {
diff --git a/docs/app/Components/Root.js b/docs/app/Components/Root.js
index 5d70812a9a..93a2e3da22 100644
--- a/docs/app/Components/Root.js
+++ b/docs/app/Components/Root.js
@@ -5,7 +5,7 @@ import React, { Component, PropTypes } from 'react'
 
 import ComponentDoc from 'docs/app/Components/ComponentDoc/ComponentDoc'
 import PageNotFound from 'docs/app/Components/PageNotFound/PageNotFound'
-import META from 'src/utils/Meta'
+import { META } from 'src/lib'
 import * as stardust from 'stardust'
 
 export default class Root extends Component {
diff --git a/docs/app/Components/Sidebar/Sidebar.js b/docs/app/Components/Sidebar/Sidebar.js
index d2f32a06c8..1daab77732 100644
--- a/docs/app/Components/Sidebar/Sidebar.js
+++ b/docs/app/Components/Sidebar/Sidebar.js
@@ -1,9 +1,10 @@
 import _ from 'lodash/fp'
 import React, { Component, PropTypes } from 'react'
 import { Link } from 'react-router'
-import * as stardust from 'stardust'
+
 import { typeOrder } from 'docs/app/utils'
-import META from 'src/utils/Meta'
+import { META } from 'src/lib'
+import * as stardust from 'stardust'
 
 const { Menu, Icon, Input } = stardust
 
@@ -24,7 +25,7 @@ export default class Sidebar extends Component {
       ])),
       _.sortBy('_meta.name'),
       _.map(({ _meta }) => {
-        const route = `${_meta.type}s/${_.kebabCase(_meta.name)}`
+        const route = `/${_meta.type}s/${_.kebabCase(_meta.name)}`
 
         return (
           <Link to={route} className='item' activeClassName='active' key={_meta.name}>
diff --git a/docs/app/Examples/elements/Step/Groups/index.js b/docs/app/Examples/elements/Step/Groups/index.js
index e8a45c8f40..1dfd1e1e30 100644
--- a/docs/app/Examples/elements/Step/Groups/index.js
+++ b/docs/app/Examples/elements/Step/Groups/index.js
@@ -1,5 +1,5 @@
 import React from 'react'
-import { Message } from 'stardust'
+import { Icon, Message } from 'stardust'
 
 import ComponentExample from 'docs/app/Components/ComponentDoc/ComponentExample'
 import ExampleSection from 'docs/app/Components/ComponentDoc/ExampleSection'
@@ -13,9 +13,13 @@ const Groups = () => (
       description='A set of steps.'
       examplePath='elements/Step/Groups/Groups'
     >
-      <Message className='positive' icon='mobile' header='Responsive Element'>
-        Steps will automatically stack on mobile. To make steps automatically stack for tablet use the <b>tablet
-        stackable</b> variation.
+      <Message positive icon>
+        <Icon name='mobile' />
+        <Message.Content>
+          <Message.Header>Responsive Element</Message.Header>
+          Steps will automatically stack on mobile.
+          To make steps automatically stack for tablet use the <code>stackable='tablet'</code> variation.
+        </Message.Content>
       </Message>
     </ComponentExample>
 
diff --git a/docs/app/index.ejs b/docs/app/index.ejs
index 307f6513e4..1d704aef97 100644
--- a/docs/app/index.ejs
+++ b/docs/app/index.ejs
@@ -2,13 +2,12 @@
 <html lang="en">
 <head>
   <meta charset="UTF-8">
-  <% if (htmlWebpackPlugin.options.baseHref) { %>
-  <base href="<%= htmlWebpackPlugin.options.baseHref %>" />
+  <% if (__BASE__) { %>
+  <base href="<%= __BASE__ %>" />
   <% } %>
-  <link rel="shortcut icon" type="image/x-icon" href="<%= htmlWebpackPlugin.options.base %>/logo.png" />
+  <link rel="shortcut icon" type="image/x-icon" href=<%= (__BASE__ || '') + '/logo'%> />
   <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.5.0/styles/github-gist.min.css">
-  <link rel="stylesheet"
-        href="//cdnjs.cloudflare.com/ajax/libs/semantic-ui/<%= htmlWebpackPlugin.options.versions.sui %>/semantic.min.css">
+  <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/semantic-ui/<%= htmlWebpackPlugin.options.versions.sui %>/semantic.min.css">
   <script src="//cdnjs.cloudflare.com/ajax/libs/Faker/<%= htmlWebpackPlugin.options.versions.faker %>/faker.min.js"></script>
   <script src="//cdnjs.cloudflare.com/ajax/libs/anchor-js/3.2.1/anchor.min.js"></script>
   <title>Semantic UI React</title>
@@ -24,7 +23,6 @@
   </script>
 </head>
 <body>
-
   <style>
     .anchorjs-link {
       transition: margin-left .25s, color .25s, opacity 0.25s;
diff --git a/docs/app/utils.js b/docs/app/utils.js
index c3f27c2cf4..d95fb2df5d 100644
--- a/docs/app/utils.js
+++ b/docs/app/utils.js
@@ -1,29 +1,4 @@
-import {
-  webContentIcons,
-  userActionsIcons,
-  messageIcons,
-  userTypeIcons,
-  genderAndSexualityIcons,
-  layoutAdjustmentsIcons,
-  objectsIcons,
-  shapesIcons,
-  itemSelectionIcons,
-  mediaIcons,
-  pointersIcons,
-  mobileIcons,
-  computerIcons,
-  computerAndFileSystemIcons,
-  technologiesIcons,
-  ratingsIcons,
-  audioIcons,
-  mapIcons,
-  tablesIcons,
-  textEditorIcons,
-  currencyIcons,
-  paymentOptionsIcons,
-  accessibilityIcons,
-  brandsIcons,
-} from 'src/utils/semanticUtils'
+import { SUI } from 'src/lib'
 
 export const typeOrder = [
   'element',
@@ -41,97 +16,97 @@ export const exampleContext = require.context('docs/app/Examples/', true, /\.js$
 export const iconsByCategory = [{
   name: 'Web Content',
   description: 'Icons can represent types of content found on websites',
-  icons: webContentIcons,
+  icons: SUI.webContentIcons,
 }, {
   name: 'User Actions',
   description: 'Icons can represent common actions a user can take',
-  icons: userActionsIcons,
+  icons: SUI.userActionsIcons,
 }, {
   name: 'Message',
   description: 'Icons can alert users to the type of message being displayed',
-  icons: messageIcons,
+  icons: SUI.messageIcons,
 }, {
   name: 'User Types',
   description: 'Icons can represent types of people',
-  icons: userTypeIcons,
+  icons: SUI.userTypeIcons,
 }, {
   name: 'Gender & Sexuality',
   description: 'Icons can represent genders or types of sexuality',
-  icons: genderAndSexualityIcons,
+  icons: SUI.genderAndSexualityIcons,
 }, {
   name: 'Layout Adjustment',
   description: 'Icons can alert users to common ways to adjust page layouts',
-  icons: layoutAdjustmentsIcons,
+  icons: SUI.layoutAdjustmentsIcons,
 }, {
   name: 'Objects',
   description: 'Icons can be used to represent common objects',
-  icons: objectsIcons,
+  icons: SUI.objectsIcons,
 }, {
   name: 'Shapes',
   description: 'Icons can be used to create shapes',
-  icons: shapesIcons,
+  icons: SUI.shapesIcons,
 }, {
   name: 'Item Selection',
   description: 'Icons can show whether an item is included in a set',
-  icons: itemSelectionIcons,
+  icons: SUI.itemSelectionIcons,
 }, {
   name: 'Media',
   description: 'Icons can represent common media types',
-  icons: mediaIcons,
+  icons: SUI.mediaIcons,
 }, {
   name: 'Pointers',
   description: 'Icons can be used to indicate a direction',
-  icons: pointersIcons,
+  icons: SUI.pointersIcons,
 }, {
   name: 'Mobile',
   description: 'Icons can represent mobile devices, types of content found on mobile devices.',
-  icons: mobileIcons,
+  icons: SUI.mobileIcons,
 }, {
   name: 'Computer',
   description: 'Icons can represent computing devices, or types of content found on a computer.',
-  icons: computerIcons,
+  icons: SUI.computerIcons,
 }, {
   name: 'Computer and File System',
   description: 'Icons can represent elements of a computer and its file system',
-  icons: computerAndFileSystemIcons,
+  icons: SUI.computerAndFileSystemIcons,
 }, {
   name: 'Technologies',
   description: 'Icons can represent common technologies',
-  icons: technologiesIcons,
+  icons: SUI.technologiesIcons,
 }, {
   name: 'Rating',
   description: 'Icons can be used to represent users attitude towards content',
-  icons: ratingsIcons,
+  icons: SUI.ratingsIcons,
 }, {
   name: 'Audio',
   description: 'Icons can be used to represent common ways to interact with audio',
-  icons: audioIcons,
+  icons: SUI.audioIcons,
 }, {
   name: 'Map',
   description: 'Icons can be used to represent elements on a map',
-  icons: mapIcons,
+  icons: SUI.mapIcons,
 }, {
   name: 'Tables',
   description: 'Icons can be used to represent common actions inside a table',
-  icons: tablesIcons,
+  icons: SUI.tablesIcons,
 }, {
   name: 'Text Editor',
   description: 'Icons can represent common actions when editing text',
-  icons: textEditorIcons,
+  icons: SUI.textEditorIcons,
 }, {
   name: 'Currency',
   description: 'Icons can represent units of currency',
-  icons: currencyIcons,
+  icons: SUI.currencyIcons,
 }, {
   name: 'Payment Options',
   description: 'Icons can represent common forms of payment',
-  icons: paymentOptionsIcons,
+  icons: SUI.paymentOptionsIcons,
 }, {
   name: 'Accessibility',
   description: 'Icons can represent accessibility standards',
-  icons: accessibilityIcons,
+  icons: SUI.accessibilityIcons,
 }, {
   name: 'Brands',
   description: '',
-  icons: brandsIcons,
+  icons: SUI.brandsIcons,
 }]
diff --git a/gulp/tasks/docs.js b/gulp/tasks/docs.js
index eb541fd48d..120ede347c 100644
--- a/gulp/tasks/docs.js
+++ b/gulp/tasks/docs.js
@@ -19,6 +19,7 @@ task('generate-docs-json', () => {
     `${config.paths.src()}/collections/**/*.js`,
     `${config.paths.src()}/modules/**/*.js`,
     `${config.paths.src()}/views/**/*.js`,
+    '!**/index.js',
   ])
   // do not remove the function keyword
   // we need 'this' scope here
diff --git a/gulp/tasks/serve.js b/gulp/tasks/serve.js
index 8291b3dabb..aa9e69c9a1 100644
--- a/gulp/tasks/serve.js
+++ b/gulp/tasks/serve.js
@@ -17,8 +17,6 @@ const serve = (cb) => {
   const compiler = webpack(webpackConfig)
 
   app
-    .use(express.static(config.paths.docsDist()))
-
     .use(historyApiFallback({
       verbose: false,
     }))
@@ -35,6 +33,8 @@ const serve = (cb) => {
 
     .use(WebpackHotMiddleware(compiler))
 
+    .use(express.static(config.paths.docsDist()))
+
     .listen(config.server_port, config.server_host, () => {
       log(colors.yellow('Server running at http://%s:%d'), config.server_host, config.server_port)
       cb()
diff --git a/gulpfile.babel.js b/gulpfile.babel.js
index 0599220a4c..f62a42848d 100644
--- a/gulpfile.babel.js
+++ b/gulpfile.babel.js
@@ -10,4 +10,4 @@ requireDir('./gulp/tasks')
 // do not use tasks/default
 // the default task must be loaded after all other tasks
 // requireDir above loads all our tasks in alphabetical order
-gulp.task('default', gulp.series('generate-docs-json', 'serve', 'watch'))
+gulp.task('default', gulp.series('docs', 'serve', 'watch'))
diff --git a/karma.conf.js b/karma.conf.js
index d05f7278c1..86808b0d11 100644
--- a/karma.conf.js
+++ b/karma.conf.js
@@ -56,7 +56,7 @@ module.exports = (karmaConfig) => {
         // utils/jquery loads real jQuery and semantic-ui-css
         // we alias jquery and semantic-ui-css to mocks during tests
         // ignore this module so we can use the mock versions in alias below
-        new webpack.NormalModuleReplacementPlugin(/utils\/jquery/, 'empty'),
+        new webpack.NormalModuleReplacementPlugin(/lib\/jquery/, 'empty'),
       ],
       resolve: Object.assign({}, webpackConfig.resolve, {
         alias: Object.assign({}, webpackConfig.resolve.alias, {
diff --git a/package.json b/package.json
index 01408e5e9d..86a0768dc4 100644
--- a/package.json
+++ b/package.json
@@ -12,6 +12,7 @@
     "build": "npm run build:dist && npm run build:docs",
     "prebuild:dist": "rimraf dist",
     "build:dist": "babel src -d dist",
+    "prebuild:docs": "npm run build:docs-toc",
     "build:docs": "gulp docs",
     "build:docs-toc": "doctoc README.md CONTRIBUTING.md --github --maxlevel 4",
     "predeploy:docs": "cross-env NODE_ENV=production npm run build:docs",
diff --git a/src/addons/Confirm/Confirm.js b/src/addons/Confirm/Confirm.js
index 379a1392d8..dbe850c530 100644
--- a/src/addons/Confirm/Confirm.js
+++ b/src/addons/Confirm/Confirm.js
@@ -1,10 +1,8 @@
 import React, { Component, PropTypes } from 'react'
 import Promise from 'bluebird'
 
-import META from '../../utils/Meta'
-import { getUnhandledProps } from '../../utils/propUtils'
-
-import Modal from '../../modules/Modal/Modal'
+import { getUnhandledProps, META } from '../../lib'
+import { Modal } from '../../modules'
 
 export default class Confirm extends Component {
   static propTypes = {
diff --git a/src/addons/Radio/Radio.js b/src/addons/Radio/Radio.js
index 451daa3e5a..89fab5f732 100644
--- a/src/addons/Radio/Radio.js
+++ b/src/addons/Radio/Radio.js
@@ -1,6 +1,6 @@
 import React from 'react'
-import META from '../../utils/Meta'
-import Checkbox from '../../modules/Checkbox/Checkbox'
+import { META } from '../../lib'
+import { Checkbox } from '../../modules'
 
 /**
  * A <Radio /> is sugar for <Checkbox type='radio' inputType='radio' />.
@@ -8,9 +8,7 @@ import Checkbox from '../../modules/Checkbox/Checkbox'
  * @see Checkbox
  */
 function Radio(props) {
-  return (
-    <Checkbox type='radio' {...props} inputType='radio' />
-  )
+  return <Checkbox type='radio' {...props} inputType='radio' />
 }
 
 Radio._meta = {
diff --git a/src/addons/Select/Select.js b/src/addons/Select/Select.js
index fe330bf503..68b595a873 100644
--- a/src/addons/Select/Select.js
+++ b/src/addons/Select/Select.js
@@ -1,7 +1,7 @@
 import React from 'react'
 
-import META from '../../utils/Meta'
-import Dropdown from '../../modules/Dropdown/Dropdown'
+import { META } from '../../lib'
+import { Dropdown } from '../../modules'
 
 /**
  * A <Select /> is sugar for <Dropdown selection />.
diff --git a/src/addons/Textarea/Textarea.js b/src/addons/Textarea/Textarea.js
index 84ee527be6..205c2ee472 100644
--- a/src/addons/Textarea/Textarea.js
+++ b/src/addons/Textarea/Textarea.js
@@ -1,5 +1,5 @@
 import React, { Component, PropTypes } from 'react'
-import META from '../../utils/Meta'
+import { META } from '../../lib'
 
 export default class Textarea extends Component {
   static propTypes = {
diff --git a/src/addons/index.js b/src/addons/index.js
new file mode 100644
index 0000000000..e9e73b5e67
--- /dev/null
+++ b/src/addons/index.js
@@ -0,0 +1,4 @@
+export { default as Confirm } from './Confirm/Confirm'
+export { default as Radio } from './Radio/Radio'
+export { default as Select } from './Select/Select'
+export { default as Textarea } from './Textarea/Textarea'
diff --git a/src/collections/Breadcrumb/Breadcrumb.js b/src/collections/Breadcrumb/Breadcrumb.js
index 9ab5c2d261..4207656bd4 100644
--- a/src/collections/Breadcrumb/Breadcrumb.js
+++ b/src/collections/Breadcrumb/Breadcrumb.js
@@ -2,9 +2,12 @@ import _ from 'lodash'
 import cx from 'classnames'
 import React, { PropTypes } from 'react'
 
-import META from '../../utils/Meta'
-import { customPropTypes, getUnhandledProps } from '../../utils/propUtils'
-import * as sui from '../../utils/semanticUtils'
+import {
+  customPropTypes,
+  getUnhandledProps,
+  META,
+  SUI,
+} from '../../lib'
 import BreadcrumbDivider from './BreadcrumbDivider'
 import BreadcrumbSection from './BreadcrumbSection'
 
@@ -41,14 +44,14 @@ Breadcrumb._meta = {
   name: 'Breadcrumb',
   type: META.type.collection,
   props: {
-    size: _.without(sui.sizes, 'medium'),
+    size: _.without(SUI.sizes, 'medium'),
   },
 }
 
 Breadcrumb.propTypes = {
   /** Primary content of the Breadcrumb */
-  children: customPropTypes.all([
-    customPropTypes.mutuallyExclusive(['sections', 'icon', 'divider']),
+  children: customPropTypes.every([
+    customPropTypes.disallow(['sections', 'icon', 'divider']),
     PropTypes.node,
   ]),
 
@@ -56,21 +59,21 @@ Breadcrumb.propTypes = {
   className: PropTypes.string,
 
   /** For use with the sections prop. Primary content of the Breadcrumb.Divider. */
-  divider: customPropTypes.all([
-    customPropTypes.mutuallyExclusive(['icon']),
+  divider: customPropTypes.every([
+    customPropTypes.disallow(['icon']),
     PropTypes.string,
   ]),
 
   /** For use with the sections prop. Render as an `Icon` component with `divider` class instead of a `div` in
    *  Breadcrumb.Divider. */
-  icon: customPropTypes.all([
-    customPropTypes.mutuallyExclusive(['divider']),
+  icon: customPropTypes.every([
+    customPropTypes.disallow(['divider']),
     PropTypes.node,
   ]),
 
   /** Array of props for Breadcrumb.Section. */
-  sections: customPropTypes.all([
-    customPropTypes.mutuallyExclusive(['children']),
+  sections: customPropTypes.every([
+    customPropTypes.disallow(['children']),
     React.PropTypes.array,
   ]),
 
diff --git a/src/collections/Breadcrumb/BreadcrumbDivider.js b/src/collections/Breadcrumb/BreadcrumbDivider.js
index 762b600acd..b6d1db5926 100644
--- a/src/collections/Breadcrumb/BreadcrumbDivider.js
+++ b/src/collections/Breadcrumb/BreadcrumbDivider.js
@@ -1,8 +1,12 @@
 import cx from 'classnames'
 import React, { PropTypes } from 'react'
 
-import META from '../../utils/Meta'
-import { customPropTypes, iconPropRenderer, getUnhandledProps } from '../../utils/propUtils'
+import {
+  customPropTypes,
+  getUnhandledProps,
+  META,
+} from '../../lib'
+import { createIcon } from '../../factories'
 
 /**
  * A divider sub-component for Breadcrumb component.
@@ -12,7 +16,7 @@ function BreadcrumbDivider(props) {
   const rest = getUnhandledProps(BreadcrumbDivider, props)
   const classes = cx(className, 'divider')
 
-  if (icon) return iconPropRenderer(icon, { ...rest, className: classes })
+  if (icon) return createIcon(icon, { ...rest, className: classes })
 
   return <div {...rest} className={classes}>{children || '/'}</div>
 }
@@ -25,8 +29,8 @@ BreadcrumbDivider._meta = {
 
 BreadcrumbDivider.propTypes = {
   /** Primary content of the Breadcrumb.Divider. */
-  children: customPropTypes.all([
-    customPropTypes.mutuallyExclusive(['icon']),
+  children: customPropTypes.every([
+    customPropTypes.disallow(['icon']),
     PropTypes.node,
   ]),
 
@@ -34,8 +38,8 @@ BreadcrumbDivider.propTypes = {
   className: PropTypes.string,
 
   /** Render as an `Icon` component with `divider` class instead of a `div`. */
-  icon: customPropTypes.all([
-    customPropTypes.mutuallyExclusive(['children']),
+  icon: customPropTypes.every([
+    customPropTypes.disallow(['children']),
     PropTypes.node,
   ]),
 }
diff --git a/src/collections/Breadcrumb/BreadcrumbSection.js b/src/collections/Breadcrumb/BreadcrumbSection.js
index d0ed2be1db..c723c9fdca 100644
--- a/src/collections/Breadcrumb/BreadcrumbSection.js
+++ b/src/collections/Breadcrumb/BreadcrumbSection.js
@@ -1,8 +1,12 @@
 import cx from 'classnames'
 import React, { PropTypes } from 'react'
 
-import META from '../../utils/Meta'
-import { customPropTypes, getUnhandledProps, useKeyOnly } from '../../utils/propUtils'
+import {
+  customPropTypes,
+  getUnhandledProps,
+  META,
+  useKeyOnly,
+} from '../../lib'
 
 /**
  * A section sub-component for Breadcrumb component.
@@ -62,14 +66,14 @@ BreadcrumbSection.propTypes = {
   className: PropTypes.string,
 
   /** Render as an `a` tag instead of a `div`. */
-  link: customPropTypes.all([
-    customPropTypes.mutuallyExclusive(['href']),
+  link: customPropTypes.every([
+    customPropTypes.disallow(['href']),
     PropTypes.bool,
   ]),
 
   /** Render as an `a` tag instead of a `div` and adds the href attribute. */
-  href: customPropTypes.all([
-    customPropTypes.mutuallyExclusive(['link']),
+  href: customPropTypes.every([
+    customPropTypes.disallow(['link']),
     PropTypes.string,
   ]),
 
diff --git a/src/collections/Form/Form.js b/src/collections/Form/Form.js
index aa842ec597..654b3ccd86 100644
--- a/src/collections/Form/Form.js
+++ b/src/collections/Form/Form.js
@@ -1,10 +1,13 @@
-import _ from 'lodash'
+import cx from 'classnames'
 import $ from 'jquery'
+import _ from 'lodash'
 import React, { Component, PropTypes } from 'react'
-import classNames from 'classnames'
-import META from '../../utils/Meta'
-import { getUnhandledProps } from '../../utils/propUtils'
-import { deprecateProps } from '../../utils/deprecate'
+
+import {
+  deprecateProps,
+  getUnhandledProps,
+  META,
+} from '../../lib'
 import FormField from './FormField'
 import FormFields from './FormFields'
 
@@ -116,7 +119,7 @@ export default class Form extends Component {
   }
 
   render() {
-    const classes = classNames(
+    const classes = cx(
       'ui',
       this.props.className,
       'form'
diff --git a/src/collections/Form/FormField.js b/src/collections/Form/FormField.js
index 829ddfbff2..7268611ff6 100644
--- a/src/collections/Form/FormField.js
+++ b/src/collections/Form/FormField.js
@@ -1,7 +1,10 @@
 import React, { Component, PropTypes } from 'react'
 import classNames from 'classnames'
-import numberToWord from '../../utils/numberToWord'
-import META from '../../utils/Meta.js'
+
+import {
+  META,
+  numberToWord,
+} from '../../lib'
 
 export default class FormField extends Component {
   static propTypes = {
diff --git a/src/collections/Form/FormFields.js b/src/collections/Form/FormFields.js
index 155c90626b..037138bf41 100644
--- a/src/collections/Form/FormFields.js
+++ b/src/collections/Form/FormFields.js
@@ -2,9 +2,11 @@ import _ from 'lodash'
 import React, { Children, Component, PropTypes } from 'react'
 import classNames from 'classnames'
 
-import { getUnhandledProps } from '../../utils/propUtils'
-import numberToWord from '../../utils/numberToWord'
-import META from '../../utils/Meta.js'
+import {
+  getUnhandledProps,
+  META,
+  numberToWord,
+} from '../../lib'
 
 export default class FormFields extends Component {
   static propTypes = {
diff --git a/src/collections/Grid/Grid.js b/src/collections/Grid/Grid.js
index 025e8683a0..0a4310c1e0 100644
--- a/src/collections/Grid/Grid.js
+++ b/src/collections/Grid/Grid.js
@@ -1,17 +1,17 @@
 import cx from 'classnames'
 import React, { PropTypes } from 'react'
 
-import META from '../../utils/Meta'
 import {
   getUnhandledProps,
+  META,
+  SUI,
   useColumnsProp,
   useKeyOnly,
   useKeyOrValueAndKey,
   useTextAlignProp,
   useValueAndKey,
   useVerticalAlignProp,
-} from '../../utils/propUtils'
-import * as sui from '../../utils/semanticUtils'
+} from '../../lib'
 import GridColumn from './GridColumn'
 import GridRow from './GridRow'
 
@@ -50,13 +50,13 @@ Grid._meta = {
   type: META.type.collection,
   props: {
     celled: ['internally'],
-    columns: [...sui.widths, 'equal'],
+    columns: [...SUI.widths, 'equal'],
     divided: ['vertically'],
     padded: ['horizontally', 'vertically'],
     relaxed: ['very'],
     reversed: ['computer', 'computer vertically', 'mobile', 'mobile vertically', 'tablet', 'tablet vertically'],
-    textAlign: sui.textAlignments,
-    verticalAlign: sui.verticalAlignments,
+    textAlign: SUI.textAlignments,
+    verticalAlign: SUI.verticalAlignments,
   },
 }
 
diff --git a/src/collections/Grid/GridColumn.js b/src/collections/Grid/GridColumn.js
index f583cf3aa1..c49baede5a 100644
--- a/src/collections/Grid/GridColumn.js
+++ b/src/collections/Grid/GridColumn.js
@@ -1,10 +1,15 @@
 import cx from 'classnames'
 import React, { PropTypes } from 'react'
 
-import numberToWord from '../../utils/numberToWord'
-import META from '../../utils/Meta'
-import { getUnhandledProps, useTextAlignProp, useValueAndKey, useVerticalAlignProp } from '../../utils/propUtils'
-import * as sui from '../../utils/semanticUtils'
+import {
+  getUnhandledProps,
+  META,
+  numberToWord,
+  SUI,
+  useTextAlignProp,
+  useValueAndKey,
+  useVerticalAlignProp,
+} from '../../lib'
 
 function GridColumn(props) {
   const {
@@ -36,17 +41,17 @@ GridColumn._meta = {
   parent: 'Grid',
   type: META.type.collection,
   props: {
-    color: sui.colors,
-    computer: sui.widths,
-    floated: sui.floats,
-    largeScreen: sui.widths,
-    mobile: sui.widths,
+    color: SUI.colors,
+    computer: SUI.widths,
+    floated: SUI.floats,
+    largeScreen: SUI.widths,
+    mobile: SUI.widths,
     only: ['computer', 'large screen', 'mobile', 'tablet mobile', 'tablet', 'widescreen'],
-    tablet: sui.widths,
-    textAlign: sui.textAlignments,
-    verticalAlign: sui.verticalAlignments,
-    widescreen: sui.widths,
-    width: sui.widths,
+    tablet: SUI.widths,
+    textAlign: SUI.textAlignments,
+    verticalAlign: SUI.verticalAlignments,
+    widescreen: SUI.widths,
+    width: SUI.widths,
   },
 }
 
diff --git a/src/collections/Grid/GridRow.js b/src/collections/Grid/GridRow.js
index dbbffb0bd3..4e93b39636 100644
--- a/src/collections/Grid/GridRow.js
+++ b/src/collections/Grid/GridRow.js
@@ -1,16 +1,16 @@
 import cx from 'classnames'
 import React, { PropTypes } from 'react'
 
-import META from '../../utils/Meta'
 import {
   getUnhandledProps,
+  META,
+  SUI,
   useColumnsProp,
   useKeyOnly,
   useTextAlignProp,
   useValueAndKey,
   useVerticalAlignProp,
-} from '../../utils/propUtils'
-import * as sui from '../../utils/semanticUtils'
+} from '../../lib'
 
 function GridRow(props) {
   const { centered, children, className, color, columns, only, reversed, stretched, textAlign, verticalAlign } = props
@@ -36,12 +36,12 @@ GridRow._meta = {
   parent: 'Grid',
   type: META.type.collection,
   props: {
-    color: sui.colors,
-    columns: sui.widths,
+    color: SUI.colors,
+    columns: SUI.widths,
     only: ['computer', 'large screen', 'mobile', 'tablet mobile', 'tablet', 'widescreen'],
     reversed: ['computer', 'computer vertically', 'mobile', 'mobile vertically', 'tablet', 'tablet vertically'],
-    textAlign: sui.textAlignments,
-    verticalAlign: sui.verticalAlignments,
+    textAlign: SUI.textAlignments,
+    verticalAlign: SUI.verticalAlignments,
   },
 }
 
diff --git a/src/collections/Menu/Menu.js b/src/collections/Menu/Menu.js
index a526780aff..4983a26a45 100644
--- a/src/collections/Menu/Menu.js
+++ b/src/collections/Menu/Menu.js
@@ -2,8 +2,7 @@ import React, { Children, Component, cloneElement, PropTypes } from 'react'
 import cx from 'classnames'
 
 import MenuItem from './MenuItem'
-import META from '../../utils/Meta'
-import { findChildType } from '../../utils/childrenUtils'
+import { childrenUtils, META } from '../../lib'
 
 export default class Menu extends Component {
   static propTypes = {
@@ -15,7 +14,7 @@ export default class Menu extends Component {
   constructor(props, context) {
     super(props, context)
     const { activeItem, children } = this.props
-    const firstMenuItem = findChildType(children, MenuItem)
+    const firstMenuItem = childrenUtils.findByType(children, MenuItem)
 
     this.state = {
       activeItem: activeItem || firstMenuItem && firstMenuItem.props.name,
diff --git a/src/collections/Menu/MenuItem.js b/src/collections/Menu/MenuItem.js
index dc21825c2d..ca478104a2 100644
--- a/src/collections/Menu/MenuItem.js
+++ b/src/collections/Menu/MenuItem.js
@@ -1,7 +1,8 @@
 import React, { PropTypes } from 'react'
 import cx from 'classnames'
-import META from '../../utils/Meta'
-import Label from '../../elements/Label/Label'
+
+import { META } from '../../lib'
+import { Label } from '../../elements'
 
 function MenuItem({ __onClick, active, children, className, label, name, onClick, ...rest }) {
   const handleClick = (e) => {
diff --git a/src/collections/Message/Message.js b/src/collections/Message/Message.js
index fb3ed94941..69607c062b 100644
--- a/src/collections/Message/Message.js
+++ b/src/collections/Message/Message.js
@@ -2,18 +2,21 @@ import _ from 'lodash'
 import React, { PropTypes } from 'react'
 import cx from 'classnames'
 
-import Icon from '../../elements/Icon/Icon'
+import {
+  customPropTypes,
+  getUnhandledProps,
+  META,
+  SUI,
+  useKeyOnly,
+  useKeyOrValueAndKey,
+} from '../../lib'
+import { createIcon } from '../../factories'
+import { Icon } from '../../elements'
 import MessageContent from './MessageContent'
 import MessageHeader from './MessageHeader'
 import MessageList from './MessageList'
 import MessageItem from './MessageItem'
 
-import META from '../../utils/Meta'
-import {
-  customPropTypes, getUnhandledProps, iconPropRenderer, useKeyOnly, useKeyOrValueAndKey,
-} from '../../utils/propUtils'
-import * as sui from '../../utils/semanticUtils'
-
 /**
  * A message displays information that explains nearby content
  */
@@ -68,7 +71,7 @@ function Message(props) {
     return (
       <div {...rest} className={classes}>
         {dismissIcon}
-        {icon && iconPropRenderer(icon)}
+        {icon && createIcon(icon)}
         {(header || content || list) && (
           <MessageContent>
             {header && <MessageHeader>{header}</MessageHeader>}
@@ -93,19 +96,19 @@ Message._meta = {
   type: META.type.collection,
   props: {
     attached: ['bottom'],
-    color: sui.colors,
-    size: _.without(sui.sizes, 'medium'),
+    color: SUI.colors,
+    size: _.without(SUI.sizes, 'medium'),
   },
 }
 
 Message.propTypes = {
   /** Primary content of the message. */
-  children: customPropTypes.all([
+  children: customPropTypes.every([
     PropTypes.node,
-    customPropTypes.mutuallyExclusive(['header', 'content']),
+    customPropTypes.disallow(['header', 'content']),
     customPropTypes.givenProps(
       { icon: PropTypes.node.isRequired },
-      customPropTypes.mutuallyExclusive(['icon'])
+      customPropTypes.disallow(['icon'])
     ),
   ]),
 
@@ -116,8 +119,8 @@ Message.propTypes = {
   content: PropTypes.string,
 
   /** The content of the MessageHeader. Mutually exclusive with children. */
-  header: customPropTypes.all([
-    customPropTypes.mutuallyExclusive(['children']),
+  header: customPropTypes.every([
+    customPropTypes.disallow(['children']),
     PropTypes.oneOfType([
       PropTypes.string,
       PropTypes.node,
@@ -125,20 +128,20 @@ Message.propTypes = {
   ]),
 
   /** A message can contain an icon. */
-  icon: customPropTypes.all([
+  icon: customPropTypes.every([
     customPropTypes.givenProps(
       { children: PropTypes.node.isRequired },
       PropTypes.bool
     ),
     customPropTypes.givenProps(
       { icon: PropTypes.string.isRequired },
-      customPropTypes.mutuallyExclusive(['children'])
+      customPropTypes.disallow(['children'])
     ),
   ]),
 
   /** Array of string items for the MessageList. Mutually exclusive with children. */
-  list: customPropTypes.all([
-    customPropTypes.mutuallyExclusive(['children']),
+  list: customPropTypes.every([
+    customPropTypes.disallow(['children']),
     PropTypes.arrayOf(PropTypes.string),
   ]),
 
diff --git a/src/collections/Message/MessageContent.js b/src/collections/Message/MessageContent.js
index cf3f3b50f8..8d5f1fac05 100644
--- a/src/collections/Message/MessageContent.js
+++ b/src/collections/Message/MessageContent.js
@@ -1,8 +1,7 @@
 import cx from 'classnames'
 import React, { PropTypes } from 'react'
 
-import META from '../../utils/Meta'
-import { getUnhandledProps } from '../../utils/propUtils'
+import { getUnhandledProps, META } from '../../lib'
 
 function MessageContent(props) {
   const { className, children } = props
diff --git a/src/collections/Message/MessageHeader.js b/src/collections/Message/MessageHeader.js
index 17f1a91fa1..ba13f8d094 100644
--- a/src/collections/Message/MessageHeader.js
+++ b/src/collections/Message/MessageHeader.js
@@ -1,8 +1,7 @@
 import cx from 'classnames'
 import React, { PropTypes } from 'react'
 
-import META from '../../utils/Meta'
-import { getUnhandledProps } from '../../utils/propUtils'
+import { getUnhandledProps, META } from '../../lib'
 
 function MessageHeader(props) {
   const { className, children } = props
diff --git a/src/collections/Message/MessageItem.js b/src/collections/Message/MessageItem.js
index 005d854335..9725d0e6fe 100644
--- a/src/collections/Message/MessageItem.js
+++ b/src/collections/Message/MessageItem.js
@@ -1,7 +1,5 @@
 import React, { PropTypes } from 'react'
-
-import META from '../../utils/Meta'
-import { getUnhandledProps } from '../../utils/propUtils'
+import { getUnhandledProps, META } from '../../lib'
 
 function MessageItem(props) {
   const { children } = props
diff --git a/src/collections/Message/MessageList.js b/src/collections/Message/MessageList.js
index bb2c207db5..a87233a9f0 100644
--- a/src/collections/Message/MessageList.js
+++ b/src/collections/Message/MessageList.js
@@ -1,8 +1,7 @@
 import cx from 'classnames'
 import React, { PropTypes } from 'react'
 
-import META from '../../utils/Meta'
-import { getUnhandledProps } from '../../utils/propUtils'
+import { getUnhandledProps, META } from '../../lib'
 
 import MessageItem from './MessageItem'
 
diff --git a/src/collections/Table/Table.js b/src/collections/Table/Table.js
index c7943e4300..b0ffff8c93 100644
--- a/src/collections/Table/Table.js
+++ b/src/collections/Table/Table.js
@@ -1,8 +1,11 @@
 import _ from 'lodash'
 import React, { Children, Component, PropTypes } from 'react'
 import cx from 'classnames'
-import { customPropTypes, getUnhandledProps } from '../../utils/propUtils'
-import META from '../../utils/Meta'
+import {
+  customPropTypes,
+  getUnhandledProps,
+  META,
+} from '../../lib'
 import TableColumn from './TableColumn'
 
 export default class Table extends Component {
diff --git a/src/collections/Table/TableColumn.js b/src/collections/Table/TableColumn.js
index 6c5589f000..7a0c39b4c0 100644
--- a/src/collections/Table/TableColumn.js
+++ b/src/collections/Table/TableColumn.js
@@ -1,5 +1,5 @@
 import React, { PropTypes } from 'react'
-import META from '../../utils/Meta'
+import { META } from '../../lib'
 
 // This is an abstract component
 // it is only used by the user to configure a Table
diff --git a/src/collections/index.js b/src/collections/index.js
new file mode 100644
index 0000000000..1841edf08a
--- /dev/null
+++ b/src/collections/index.js
@@ -0,0 +1,6 @@
+export { default as Breadcrumb } from './Breadcrumb/Breadcrumb'
+export { default as Form } from './Form/Form'
+export { default as Grid } from './Grid/Grid'
+export { default as Menu } from './Menu/Menu'
+export { default as Message } from './Message/Message'
+export { default as Table } from './Table/Table'
diff --git a/src/elements/Button/Button.js b/src/elements/Button/Button.js
index 9cc8845a33..79211f09bc 100644
--- a/src/elements/Button/Button.js
+++ b/src/elements/Button/Button.js
@@ -1,6 +1,6 @@
 import React, { Component, PropTypes } from 'react'
 import classNames from 'classnames'
-import META from '../../utils/Meta'
+import { META } from '../../lib'
 
 export default class Button extends Component {
   static propTypes = {
diff --git a/src/elements/Button/Buttons.js b/src/elements/Button/Buttons.js
index 398e7f733b..e1bf5a9408 100644
--- a/src/elements/Button/Buttons.js
+++ b/src/elements/Button/Buttons.js
@@ -1,6 +1,6 @@
 import React, { Component, PropTypes } from 'react'
 import classNames from 'classnames'
-import META from '../../utils/Meta'
+import { META } from '../../lib'
 
 export default class Buttons extends Component {
   static propTypes = {
diff --git a/src/elements/Container/Container.js b/src/elements/Container/Container.js
index 0fc3a533b4..7fa9fee1ad 100644
--- a/src/elements/Container/Container.js
+++ b/src/elements/Container/Container.js
@@ -1,8 +1,12 @@
 import cx from 'classnames'
 import React, { PropTypes } from 'react'
-import META from '../../utils/Meta'
-import { getUnhandledProps, useTextAlignProp, useKeyOnly } from '../../utils/propUtils'
-import * as sui from '../../utils/semanticUtils'
+import {
+  META,
+  SUI,
+  getUnhandledProps,
+  useKeyOnly,
+  useTextAlignProp,
+} from '../../lib'
 
 /**
  * A container limits content to a maximum width
@@ -26,7 +30,7 @@ Container._meta = {
   name: 'Container',
   type: META.type.element,
   props: {
-    textAlign: sui.textAlignments,
+    textAlign: SUI.textAlignments,
   },
 }
 
diff --git a/src/elements/Divider/Divider.js b/src/elements/Divider/Divider.js
index 001c05cc0f..0e57edc92d 100644
--- a/src/elements/Divider/Divider.js
+++ b/src/elements/Divider/Divider.js
@@ -1,10 +1,7 @@
 import cx from 'classnames'
 import React, { PropTypes } from 'react'
-import META from '../../utils/Meta'
-import {
-  getUnhandledProps,
-  useKeyOnly,
-} from '../../utils/propUtils'
+
+import { getUnhandledProps, META, useKeyOnly } from '../../lib'
 
 /**
  * A divider visually segments content into groups
diff --git a/src/elements/Flag/Flag.js b/src/elements/Flag/Flag.js
index cb06059b99..9637077fa0 100644
--- a/src/elements/Flag/Flag.js
+++ b/src/elements/Flag/Flag.js
@@ -1,8 +1,7 @@
 import cx from 'classnames'
 import React, { PropTypes } from 'react'
 
-import META from '../../utils/Meta'
-import { getUnhandledProps } from '../../utils/propUtils'
+import { getUnhandledProps, META } from '../../lib'
 
 const names = [
   'ad', 'andorra', 'ae', 'united arab emirates', 'uae', 'af', 'afghanistan', 'ag', 'antigua', 'ai', 'anguilla', 'al',
diff --git a/src/elements/Header/Header.js b/src/elements/Header/Header.js
index 73795e835c..ddae414522 100644
--- a/src/elements/Header/Header.js
+++ b/src/elements/Header/Header.js
@@ -1,5 +1,5 @@
 import React from 'react'
-import META from '../../utils/Meta'
+import { META } from '../../lib'
 import _Header from './_Header'
 import HeaderH1 from './HeaderH1'
 import HeaderH2 from './HeaderH2'
diff --git a/src/elements/Header/HeaderH1.js b/src/elements/Header/HeaderH1.js
index fb2676ec09..3801d660ae 100644
--- a/src/elements/Header/HeaderH1.js
+++ b/src/elements/Header/HeaderH1.js
@@ -1,5 +1,5 @@
 import React from 'react'
-import META from '../../utils/Meta'
+import { META } from '../../lib'
 import _Header from './_Header'
 
 function HeaderH1(props) {
diff --git a/src/elements/Header/HeaderH2.js b/src/elements/Header/HeaderH2.js
index 9636b3e9b5..125cf74320 100644
--- a/src/elements/Header/HeaderH2.js
+++ b/src/elements/Header/HeaderH2.js
@@ -1,5 +1,5 @@
 import React from 'react'
-import META from '../../utils/Meta'
+import { META } from '../../lib'
 import _Header from './_Header'
 
 function HeaderH2(props) {
diff --git a/src/elements/Header/HeaderH3.js b/src/elements/Header/HeaderH3.js
index 367f8517bd..4950227fa4 100644
--- a/src/elements/Header/HeaderH3.js
+++ b/src/elements/Header/HeaderH3.js
@@ -1,5 +1,5 @@
 import React from 'react'
-import META from '../../utils/Meta'
+import { META } from '../../lib'
 import _Header from './_Header'
 
 function HeaderH3(props) {
diff --git a/src/elements/Header/HeaderH4.js b/src/elements/Header/HeaderH4.js
index fb4c7cf247..0177ae968d 100644
--- a/src/elements/Header/HeaderH4.js
+++ b/src/elements/Header/HeaderH4.js
@@ -1,5 +1,5 @@
 import React from 'react'
-import META from '../../utils/Meta'
+import { META } from '../../lib'
 import _Header from './_Header'
 
 function HeaderH4(props) {
diff --git a/src/elements/Header/HeaderH5.js b/src/elements/Header/HeaderH5.js
index 95585f0783..5a81d77bc0 100644
--- a/src/elements/Header/HeaderH5.js
+++ b/src/elements/Header/HeaderH5.js
@@ -1,5 +1,5 @@
 import React from 'react'
-import META from '../../utils/Meta'
+import { META } from '../../lib'
 import _Header from './_Header'
 
 function HeaderH5(props) {
diff --git a/src/elements/Header/HeaderH6.js b/src/elements/Header/HeaderH6.js
index 4d0a02097d..6089e9c8b5 100644
--- a/src/elements/Header/HeaderH6.js
+++ b/src/elements/Header/HeaderH6.js
@@ -1,5 +1,5 @@
 import React from 'react'
-import META from '../../utils/Meta'
+import { META } from '../../lib'
 import _Header from './_Header'
 
 function HeaderH6(props) {
diff --git a/src/elements/Header/HeaderSubheader.js b/src/elements/Header/HeaderSubheader.js
index 7d3ec1de37..ee9a4f23a6 100644
--- a/src/elements/Header/HeaderSubheader.js
+++ b/src/elements/Header/HeaderSubheader.js
@@ -1,9 +1,6 @@
 import React, { PropTypes } from 'react'
 import cx from 'classnames'
-import META from '../../utils/Meta'
-import {
-  getUnhandledProps,
-} from '../../utils/propUtils'
+import { getUnhandledProps, META } from '../../lib'
 
 function HeaderSubheader(props) {
   const {
diff --git a/src/elements/Header/_Header.js b/src/elements/Header/_Header.js
index 18c51d7608..fb8caf5cef 100644
--- a/src/elements/Header/_Header.js
+++ b/src/elements/Header/_Header.js
@@ -1,17 +1,16 @@
 import cx from 'classnames'
 import React, { PropTypes } from 'react'
 
-import META from '../../utils/Meta'
-import * as sui from '../../utils/semanticUtils'
 import {
   getUnhandledProps,
-  iconPropRenderer,
-  imagePropRenderer,
+  META,
+  SUI,
   useValueAndKey,
   useTextAlignProp,
   useKeyOrValueAndKey,
   useKeyOnly,
-} from '../../utils/propUtils'
+} from '../../lib'
+import { createIcon, createImage } from '../../factories'
 
 function _Header(props) {
   const {
@@ -40,8 +39,8 @@ function _Header(props) {
 
   return (
     <_HeaderComponent className={classes} {...rest}>
-      {iconPropRenderer(icon)}
-      {imagePropRenderer(image)}
+      {createIcon(icon)}
+      {createImage(image)}
       {children}
     </_HeaderComponent>
   )
@@ -52,9 +51,9 @@ _Header._meta = {
   type: META.type.element,
   props: {
     attached: ['top', 'bottom'],
-    color: sui.colors,
-    floated: sui.floats,
-    textAlign: sui.textAlignments,
+    color: SUI.colors,
+    floated: SUI.floats,
+    textAlign: SUI.textAlignments,
   },
 }
 
diff --git a/src/elements/Icon/Icon.js b/src/elements/Icon/Icon.js
index 6f6f663fa1..89bf18adfa 100644
--- a/src/elements/Icon/Icon.js
+++ b/src/elements/Icon/Icon.js
@@ -1,13 +1,13 @@
 import cx from 'classnames'
 import React, { PropTypes } from 'react'
 
-import META from '../../utils/Meta'
-import * as sui from '../../utils/semanticUtils'
 import {
+  getUnhandledProps,
+  META,
+  SUI,
   useKeyOnly,
   useValueAndKey,
-  getUnhandledProps,
-} from '../../utils/propUtils'
+} from '../../lib'
 import IconGroup from './IconGroup'
 
 /**
@@ -50,11 +50,11 @@ Icon._meta = {
   name: 'Icon',
   type: META.type.element,
   props: {
-    color: sui.colors,
+    color: SUI.colors,
     flipped: ['horizontally', 'vertically'],
-    name: sui.icons,
+    name: SUI.icons,
     rotated: ['clockwise', 'counterclockwise'],
-    size: sui.sizes,
+    size: SUI.sizes,
   },
 }
 
diff --git a/src/elements/Icon/IconGroup.js b/src/elements/Icon/IconGroup.js
index 587e83893c..3a7a146b4d 100644
--- a/src/elements/Icon/IconGroup.js
+++ b/src/elements/Icon/IconGroup.js
@@ -1,11 +1,11 @@
 import cx from 'classnames'
 import React, { PropTypes } from 'react'
 
-import META from '../../utils/Meta'
-import * as sui from '../../utils/semanticUtils'
 import {
   getUnhandledProps,
-} from '../../utils/propUtils'
+  META,
+  SUI,
+} from '../../lib'
 
 /**
  * Several icons can be used together as a group
@@ -30,13 +30,12 @@ function IconGroup(props) {
   )
 }
 
-
 IconGroup._meta = {
   name: 'IconGroup',
   parent: 'Icon',
   type: META.type.element,
   props: {
-    size: sui.sizes,
+    size: SUI.sizes,
   },
 }
 
diff --git a/src/elements/Image/Image.js b/src/elements/Image/Image.js
index d0c849dbd1..c5cbe964b8 100644
--- a/src/elements/Image/Image.js
+++ b/src/elements/Image/Image.js
@@ -1,6 +1,6 @@
 import React, { Component, PropTypes } from 'react'
 import classNames from 'classnames'
-import META from '../../utils/Meta'
+import { META } from '../../lib'
 
 export default class Image extends Component {
   static propTypes = {
diff --git a/src/elements/Input/Input.js b/src/elements/Input/Input.js
index 93ac0aa97e..e0103bfa01 100644
--- a/src/elements/Input/Input.js
+++ b/src/elements/Input/Input.js
@@ -1,9 +1,9 @@
 import _ from 'lodash'
 import classNames from 'classnames'
 import React, { Component, PropTypes, Children } from 'react'
-import META from '../../utils/Meta'
-import { getUnhandledProps } from '../../utils/propUtils'
-import Icon from '../../elements/Icon/Icon'
+
+import { getUnhandledProps, META } from '../../lib'
+import { Icon } from '../../elements'
 
 export default class Input extends Component {
   static propTypes = {
diff --git a/src/elements/Label/Label.js b/src/elements/Label/Label.js
index dc5012c4de..344edef5fa 100644
--- a/src/elements/Label/Label.js
+++ b/src/elements/Label/Label.js
@@ -1,19 +1,17 @@
 import cx from 'classnames'
 import React, { PropTypes } from 'react'
 
-import META from '../../utils/Meta'
-import * as sui from '../../utils/semanticUtils'
-import { someChildType } from '../../utils/childrenUtils'
 import {
   getUnhandledProps,
-  iconPropRenderer,
-  imagePropRenderer,
+  META,
+  SUI,
+  childrenUtils,
   useKeyOnly,
-  useValueAndKey,
   useKeyOrValueAndKey,
-} from '../../utils/propUtils'
-import Icon from '../Icon/Icon'
-import Image from '../Image/Image'
+  useValueAndKey,
+} from '../../lib'
+import { createIcon, createImage } from '../../factories'
+import { Icon, Image } from '../'
 
 /**
  * A label displays content classification
@@ -41,7 +39,7 @@ function Label(props) {
     useKeyOrValueAndKey(ribbon, 'ribbon'),
     circular && (children && 'circular' || 'empty circular'),
     // TODO how to handle image child with no image class? there are two image style labels.
-    (image || someChildType(children, Image) || someChildType(children, 'img')) && 'image',
+    (image || childrenUtils.someByType(children, Image) || childrenUtils.someByType(children, 'img')) && 'image',
     'label',
     className
   )
@@ -53,8 +51,8 @@ function Label(props) {
 
   return (
     <LabelComponent className={classes} onClick={handleClick} {...rest}>
-      {iconPropRenderer(icon)}
-      {imagePropRenderer(image)}
+      {createIcon(icon)}
+      {createImage(image)}
       {text}
       {children}
       {detail && (
@@ -72,8 +70,8 @@ Label._meta = {
   type: META.type.element,
   props: {
     attached: ['top', 'bottom', 'top right', 'top left', 'bottom left', 'bottom right'],
-    size: sui.sizes,
-    color: sui.colors,
+    size: SUI.sizes,
+    color: SUI.colors,
     pointing: ['bottom', 'left', 'right'],
     corner: ['left', 'right'],
     ribbon: ['right'],
diff --git a/src/elements/List/List.js b/src/elements/List/List.js
index e735345b68..384acc2c64 100644
--- a/src/elements/List/List.js
+++ b/src/elements/List/List.js
@@ -1,6 +1,7 @@
 import React, { Component, PropTypes } from 'react'
 import classNames from 'classnames'
-import META from '../../utils/Meta'
+
+import { META } from '../../lib'
 import ListItem from './ListItem'
 
 export default class List extends Component {
diff --git a/src/elements/List/ListItem.js b/src/elements/List/ListItem.js
index aec3b2f53c..f8d2fe95aa 100644
--- a/src/elements/List/ListItem.js
+++ b/src/elements/List/ListItem.js
@@ -1,8 +1,8 @@
 import React, { Component, PropTypes } from 'react'
 import cx from 'classnames'
 
-import META from '../../utils/Meta'
-import { iconPropRenderer, imagePropRenderer } from '../../utils/propUtils'
+import { META } from '../../lib'
+import { createIcon, createImage } from '../../factories'
 
 export default class ListItem extends Component {
   static propTypes = {
@@ -24,7 +24,7 @@ export default class ListItem extends Component {
     const { children, className, description, header, icon, image, ...rest } = this.props
     const classes = cx(className, 'item')
 
-    const media = iconPropRenderer(icon) || imagePropRenderer(image)
+    const media = createIcon(icon) || createImage(image)
     const _description = description || children
 
     let content = header ? [
diff --git a/src/elements/Loader/Loader.js b/src/elements/Loader/Loader.js
index a86023692c..384b2ce980 100644
--- a/src/elements/Loader/Loader.js
+++ b/src/elements/Loader/Loader.js
@@ -1,9 +1,14 @@
 import React, { PropTypes } from 'react'
 import cx from 'classnames'
 
-import * as sui from '../../utils/semanticUtils'
-import { customPropTypes, getUnhandledProps, useKeyOnly, useKeyOrValueAndKey } from '../../utils/propUtils'
-import META from '../../utils/Meta'
+import {
+  customPropTypes,
+  getUnhandledProps,
+  META,
+  SUI,
+  useKeyOnly,
+  useKeyOrValueAndKey,
+} from '../../lib'
 
 function Loader(props) {
   const { children, className, active, disabled, indeterminate, inline, inverted, size, text } = props
@@ -29,7 +34,7 @@ Loader._meta = {
   type: META.type.element,
   props: {
     inline: ['centered'],
-    size: sui.sizes,
+    size: SUI.sizes,
   },
 }
 
@@ -41,8 +46,8 @@ Loader.propTypes = {
   className: PropTypes.string,
 
   /** Primary content of the Loader. Mutually exclusive with the text prop. */
-  children: customPropTypes.all([
-    customPropTypes.mutuallyExclusive(['text']),
+  children: customPropTypes.every([
+    customPropTypes.disallow(['text']),
     PropTypes.node,
   ]),
 
@@ -65,8 +70,8 @@ Loader.propTypes = {
   size: PropTypes.oneOf(Loader._meta.props.size),
 
   /** Primary content of the Loader. Mutually exclusive with the children prop. */
-  text: customPropTypes.all([
-    customPropTypes.mutuallyExclusive(['children']),
+  text: customPropTypes.every([
+    customPropTypes.disallow(['children']),
     PropTypes.node,
   ]),
 }
diff --git a/src/elements/Rail/Rail.js b/src/elements/Rail/Rail.js
index 2cd480154c..b74de7c9fa 100644
--- a/src/elements/Rail/Rail.js
+++ b/src/elements/Rail/Rail.js
@@ -2,9 +2,13 @@ import _ from 'lodash'
 import React, { PropTypes } from 'react'
 import cx from 'classnames'
 
-import * as sui from '../../utils/semanticUtils'
-import { getUnhandledProps, useKeyOnly, useKeyOrValueAndKey } from '../../utils/propUtils'
-import META from '../../utils/Meta'
+import {
+  getUnhandledProps,
+  META,
+  SUI,
+  useKeyOnly,
+  useKeyOrValueAndKey,
+} from '../../lib'
 
 /**
  * A rail is used to show accompanying content outside the boundaries of the main view of a site.
@@ -31,8 +35,8 @@ Rail._meta = {
   name: 'Rail',
   props: {
     close: ['very'],
-    position: sui.floats,
-    size: _.without(sui.sizes, 'medium'),
+    position: SUI.floats,
+    size: _.without(SUI.sizes, 'medium'),
   },
   type: META.type.element,
 }
diff --git a/src/elements/Segment/Segment.js b/src/elements/Segment/Segment.js
index 9b3f5cd52c..46825d1c8a 100644
--- a/src/elements/Segment/Segment.js
+++ b/src/elements/Segment/Segment.js
@@ -1,9 +1,9 @@
 import React, { Component, PropTypes } from 'react'
 import classNames from 'classnames'
-import META from '../../utils/Meta'
+
+import { getUnhandledProps, META } from '../../lib'
+import { Header } from '../'
 import Segments from './SegmentSegments'
-import Header from '../Header/Header'
-import { getUnhandledProps } from '../../utils/propUtils'
 
 /**
  * A segment is used to create a grouping of related content.
diff --git a/src/elements/Segment/SegmentSegments.js b/src/elements/Segment/SegmentSegments.js
index e257917fee..d3da55e9b3 100644
--- a/src/elements/Segment/SegmentSegments.js
+++ b/src/elements/Segment/SegmentSegments.js
@@ -1,7 +1,6 @@
 import React, { Component, PropTypes } from 'react'
 import classNames from 'classnames'
-import META from '../../utils/Meta'
-import { getUnhandledProps } from '../../utils/propUtils'
+import { getUnhandledProps, META } from '../../lib'
 
 /**
  * A group of segments can be formatted to appear together.
diff --git a/src/elements/Step/Step.js b/src/elements/Step/Step.js
index 4510beaec0..a1dff683c4 100644
--- a/src/elements/Step/Step.js
+++ b/src/elements/Step/Step.js
@@ -1,14 +1,21 @@
 import cx from 'classnames'
 import React, { PropTypes } from 'react'
 
-import META from '../../utils/Meta'
-import { customPropTypes, iconPropRenderer, getUnhandledProps, useKeyOnly } from '../../utils/propUtils'
+import {
+  customPropTypes,
+  getUnhandledProps,
+  META,
+  useKeyOnly,
+} from '../../lib'
+import { createIcon } from '../../factories'
 import StepContent from './StepContent'
 import StepDescription from './StepDescription'
 import StepGroup from './StepGroup'
 import StepTitle from './StepTitle'
 
-/** A step shows the completion status of an activity in a series of activities. */
+/**
+ * A step shows the completion status of an activity in a series of activities.
+ */
 function Step(props) {
   const {
     active, className, children, completed, description, disabled, icon, href, link, onClick, title,
@@ -35,7 +42,7 @@ function Step(props) {
       href={href}
       onClick={handleClick}
     >
-      {!children && iconPropRenderer(icon)}
+      {!children && createIcon(icon)}
       {children || <StepContent description={description} title={title} />}
     </StepComponent>
   )
@@ -54,8 +61,8 @@ Step.propTypes = {
   className: PropTypes.string,
 
   /** Primary content of the Step. Mutually exclusive with description and title props. */
-  children: customPropTypes.all([
-    customPropTypes.mutuallyExclusive(['description', 'title']),
+  children: customPropTypes.every([
+    customPropTypes.disallow(['description', 'title']),
     PropTypes.node,
   ]),
 
@@ -63,8 +70,8 @@ Step.propTypes = {
   completed: PropTypes.bool,
 
   /** Shorthand prop for StepDescription. Mutually exclusive with children. */
-  description: customPropTypes.all([
-    customPropTypes.mutuallyExclusive(['children']),
+  description: customPropTypes.every([
+    customPropTypes.disallow(['children']),
     PropTypes.node,
   ]),
 
@@ -72,8 +79,8 @@ Step.propTypes = {
   disabled: PropTypes.bool,
 
   /** A step can contain an icon. */
-  icon: customPropTypes.all([
-    customPropTypes.mutuallyExclusive(['children']),
+  icon: customPropTypes.every([
+    customPropTypes.disallow(['children']),
     PropTypes.node,
   ]),
 
@@ -90,8 +97,8 @@ Step.propTypes = {
   ordered: PropTypes.bool,
 
   /** Shorthand prop for StepTitle. Mutually exclusive with children. */
-  title: customPropTypes.all([
-    customPropTypes.mutuallyExclusive(['children']),
+  title: customPropTypes.every([
+    customPropTypes.disallow(['children']),
     PropTypes.node,
   ]),
 }
diff --git a/src/elements/Step/StepContent.js b/src/elements/Step/StepContent.js
index 776d481ca7..98c68565dd 100644
--- a/src/elements/Step/StepContent.js
+++ b/src/elements/Step/StepContent.js
@@ -1,8 +1,11 @@
 import React, { PropTypes } from 'react'
 import cx from 'classnames'
 
-import META from '../../utils/Meta'
-import { customPropTypes, getUnhandledProps } from '../../utils/propUtils'
+import {
+  customPropTypes,
+  getUnhandledProps,
+  META,
+} from '../../lib'
 import StepDescription from './StepDescription'
 import StepTitle from './StepTitle'
 
@@ -34,20 +37,20 @@ StepContent.propTypes = {
   className: PropTypes.string,
 
   /** Primary content of StepContent. Mutually exclusive with description and title props. */
-  children: customPropTypes.all([
-    customPropTypes.mutuallyExclusive(['description', 'title']),
+  children: customPropTypes.every([
+    customPropTypes.disallow(['description', 'title']),
     PropTypes.node,
   ]),
 
   /** Primary content of the StepDescription. Mutually exclusive with children. */
-  description: customPropTypes.all([
-    customPropTypes.mutuallyExclusive(['children']),
+  description: customPropTypes.every([
+    customPropTypes.disallow(['children']),
     PropTypes.node,
   ]),
 
   /** Primary content of the StepTitle. Mutually exclusive with children. */
-  title: customPropTypes.all([
-    customPropTypes.mutuallyExclusive(['children']),
+  title: customPropTypes.every([
+    customPropTypes.disallow(['children']),
     PropTypes.node,
   ]),
 }
diff --git a/src/elements/Step/StepDescription.js b/src/elements/Step/StepDescription.js
index a8403de00b..b191d48a8b 100644
--- a/src/elements/Step/StepDescription.js
+++ b/src/elements/Step/StepDescription.js
@@ -1,8 +1,11 @@
 import cx from 'classnames'
 import React, { PropTypes } from 'react'
 
-import META from '../../utils/Meta'
-import { customPropTypes, getUnhandledProps } from '../../utils/propUtils'
+import {
+  customPropTypes,
+  getUnhandledProps,
+  META,
+} from '../../lib'
 
 function StepDescription(props) {
   const { className, children, description } = props
@@ -23,14 +26,14 @@ StepDescription.propTypes = {
   className: PropTypes.string,
 
   /** Primary content of the StepDescription. Mutually exclusive with description prop. */
-  children: customPropTypes.all([
-    customPropTypes.mutuallyExclusive(['description']),
+  children: customPropTypes.every([
+    customPropTypes.disallow(['description']),
     PropTypes.node,
   ]),
 
   /** Primary content of the StepDescription. Mutually exclusive with children. */
-  description: customPropTypes.all([
-    customPropTypes.mutuallyExclusive(['children']),
+  description: customPropTypes.every([
+    customPropTypes.disallow(['children']),
     PropTypes.node,
   ]),
 }
diff --git a/src/elements/Step/StepGroup.js b/src/elements/Step/StepGroup.js
index 431ea3990d..bbfc0ba2a7 100644
--- a/src/elements/Step/StepGroup.js
+++ b/src/elements/Step/StepGroup.js
@@ -2,9 +2,14 @@ import _ from 'lodash'
 import cx from 'classnames'
 import React, { PropTypes } from 'react'
 
-import META from '../../utils/Meta'
-import { customPropTypes, getUnhandledProps, useValueAndKey, useKeyOnly } from '../../utils/propUtils'
-import * as sui from '../../utils/semanticUtils'
+import {
+  customPropTypes,
+  getUnhandledProps,
+  META,
+  SUI,
+  useValueAndKey,
+  useKeyOnly,
+} from '../../lib'
 import Step from './Step'
 
 function StepGroup(props) {
@@ -21,11 +26,10 @@ function StepGroup(props) {
   )
   const rest = getUnhandledProps(StepGroup, props)
 
-  const content = items
-  ? items.map(item => {
+  const content = !items ? children : items.map(item => {
     const key = item.key || [item.title, item.description].join('-')
     return <Step key={key} {...item} />
-  }) : children
+  })
 
   return <div {...rest} className={classes}>{content}</div>
 }
@@ -34,7 +38,7 @@ StepGroup._meta = {
   name: 'StepGroup',
   parent: 'Step',
   props: {
-    sizes: _.without(sui.sizes, 'medium'),
+    sizes: _.without(SUI.sizes, 'medium'),
     stackable: ['tablet'],
   },
   type: META.type.element,
@@ -45,8 +49,8 @@ StepGroup.propTypes = {
   className: PropTypes.string,
 
   /** Primary content of the StepGroup. Mutually exclusive with items prop. */
-  children: customPropTypes.all([
-    customPropTypes.mutuallyExclusive(['items']),
+  children: customPropTypes.every([
+    customPropTypes.disallow(['items']),
     PropTypes.node,
   ]),
 
@@ -54,8 +58,8 @@ StepGroup.propTypes = {
   fluid: PropTypes.bool,
 
   /** Primary content of the StepGroup. Mutually exclusive with items children. */
-  items: customPropTypes.all([
-    customPropTypes.mutuallyExclusive(['description', 'title']),
+  items: customPropTypes.every([
+    customPropTypes.disallow(['description', 'title']),
     PropTypes.arrayOf(PropTypes.shape({
       description: PropTypes.node,
       icon: PropTypes.node,
diff --git a/src/elements/Step/StepTitle.js b/src/elements/Step/StepTitle.js
index aedcb45df1..a8020caeb3 100644
--- a/src/elements/Step/StepTitle.js
+++ b/src/elements/Step/StepTitle.js
@@ -1,8 +1,11 @@
 import cx from 'classnames'
 import React, { PropTypes } from 'react'
 
-import META from '../../utils/Meta'
-import { customPropTypes, getUnhandledProps } from '../../utils/propUtils'
+import {
+  customPropTypes,
+  getUnhandledProps,
+  META,
+} from '../../lib'
 
 function StepTitle(props) {
   const { className, children, title } = props
@@ -23,14 +26,14 @@ StepTitle.propTypes = {
   className: PropTypes.string,
 
   /** Primary content of the StepTitle. Mutually exclusive with title prop. */
-  children: customPropTypes.all([
-    customPropTypes.mutuallyExclusive(['title']),
+  children: customPropTypes.every([
+    customPropTypes.disallow(['title']),
     PropTypes.node,
   ]),
 
   /** Primary content of the StepTitle. Mutually exclusive with children. */
-  title: customPropTypes.all([
-    customPropTypes.mutuallyExclusive(['children']),
+  title: customPropTypes.every([
+    customPropTypes.disallow(['children']),
     PropTypes.node,
   ]),
 }
diff --git a/src/elements/index.js b/src/elements/index.js
new file mode 100644
index 0000000000..87fb2db425
--- /dev/null
+++ b/src/elements/index.js
@@ -0,0 +1,14 @@
+export { default as Button } from './Button/Button'
+export { default as Container } from './Container/Container'
+export { default as Divider } from './Divider/Divider'
+export { default as Flag } from './Flag/Flag'
+export { default as Header } from './Header/Header'
+export { default as Icon } from './Icon/Icon'
+export { default as Image } from './Image/Image'
+export { default as Input } from './Input/Input'
+export { default as Label } from './Label/Label'
+export { default as List } from './List/List'
+export { default as Loader } from './Loader/Loader'
+export { default as Rail } from './Rail/Rail'
+export { default as Segment } from './Segment/Segment'
+export { default as Step } from './Step/Step'
diff --git a/src/factories/createFactory.js b/src/factories/createFactory.js
new file mode 100644
index 0000000000..ddfcacf67a
--- /dev/null
+++ b/src/factories/createFactory.js
@@ -0,0 +1,44 @@
+import _ from 'lodash'
+import cx from 'classnames'
+import React, { isValidElement } from 'react'
+
+/**
+ * The default CreateFactory mergeExtraProps function.  Merges props and classNames.
+ * @param props
+ * @param extraProps
+ * @returns {{className: *}}
+ */
+const mergePropsAndClassName = (props, extraProps) => {
+  const className = cx(props.className, extraProps.className) // eslint-disable-line react/prop-types
+  return { ...props, ...extraProps, className }
+}
+
+/**
+ * Return a function that produces ReactElements.  Similar to React.createFactory with some extras.
+ * If the returned factory is passed a ReactElement it will be cloned.
+ * If it passed undefined it will do nothing.
+ * @param {function|string} Component A ReactClass or string
+ * @param {function} mapValueToProps A function that maps a primitive value to the Component props
+ * @param {function} [mergeExtraProps=mergePropsAndClassName]
+ * @returns {function}
+ */
+const createFactory = (Component, mapValueToProps, mergeExtraProps = mergePropsAndClassName) => {
+  return function Factory(val, extraProps = {}) {
+    // Clone ReactElements
+    if (isValidElement(val)) {
+      return React.cloneElement(val, mergeExtraProps(val.props, extraProps))
+    }
+
+    // Create ReactElements from props objects
+    if (_.isPlainObject(val)) {
+      return <Component {...mergeExtraProps(val, extraProps)} />
+    }
+
+    // Map values to props and create an ReactElement
+    if (val !== undefined) {
+      return <Component {...mergeExtraProps(mapValueToProps(val), extraProps)} />
+    }
+  }
+}
+
+export default createFactory
diff --git a/src/factories/index.js b/src/factories/index.js
new file mode 100644
index 0000000000..206f6dab7e
--- /dev/null
+++ b/src/factories/index.js
@@ -0,0 +1,22 @@
+import createFactory from './createFactory'
+
+import Image from '../elements/Image/Image'
+import Icon from '../elements/Icon/Icon'
+
+/**
+ * Returns an Image element from an image src, Image element, or props object.
+ * @type {function}
+ * @param {string|ReactElement|object} val The value to render.
+ * @param {object} [props = {}] Optional additional props.
+ * @returns {ReactElement|undefined}
+ */
+export const createImage = createFactory(Image, value => ({ src: value }))
+
+/**
+ * Returns an Icon element from an icon name, Icon element, or props object.
+ * @type {function}
+ * @param {string|ReactElement|object} val The value to render.
+ * @param {object} [props = {}] Optional additional props.
+ * @returns {ReactElement|undefined}
+ */
+export const createIcon = createFactory(Icon, value => ({ name: value }))
diff --git a/src/index.js b/src/index.js
index 3c6bfa8569..1e484a04f7 100644
--- a/src/index.js
+++ b/src/index.js
@@ -1,84 +1,51 @@
-import './utils/jquery'
-import { deprecateComponent } from './utils/deprecate'
+import './lib/jquery'
+import { deprecateComponent } from './lib'
 
-// ----------------------------------------
-// Addons
-// ----------------------------------------
-export Confirm from './addons/Confirm/Confirm'
-export Radio from './addons/Radio/Radio'
-export Select from './addons/Select/Select'
-export Textarea from './addons/Textarea/Textarea'
+export * from './addons'
+export * from './collections'
+export * from './elements'
+export * from './modules'
+export * from './views'
 
 // ----------------------------------------
-// Collections
+// Deprecated Components
 // ----------------------------------------
 
-export Breadcrumb from './collections/Breadcrumb/Breadcrumb'
-
-import _Form from './collections/Form/Form'
-export { _Form as Form }
-export const Field = deprecateComponent('Field', 'Use "Form.Field" instead.', _Form.Field)
-export const Fields = deprecateComponent('Fields', 'Use "Form.Fields" instead.', _Form.Fields)
+//
+// Collections
+//
+import Form from './collections/Form/Form'
+export const Field = deprecateComponent('Field', 'Use "Form.Field" instead.', Form.Field)
+export const Fields = deprecateComponent('Fields', 'Use "Form.Fields" instead.', Form.Fields)
 
-import _Grid from './collections/Grid/Grid'
-export { _Grid as Grid }
-export const Column = deprecateComponent('Column', 'Use "Grid.Column" instead.', _Grid.Column)
-export const Row = deprecateComponent('Row', 'Use "Grid.Row" instead.', _Grid.Row)
+import Grid from './collections/Grid/Grid'
+export const Column = deprecateComponent('Column', 'Use "Grid.Column" instead.', Grid.Column)
+export const Row = deprecateComponent('Row', 'Use "Grid.Row" instead.', Grid.Row)
 
-import _Menu from './collections/Menu/Menu'
-export { _Menu as Menu }
-export const MenuItem = deprecateComponent('MenuItem', 'Use "Menu.Item" instead.', _Menu.Item)
-export Message from './collections/Message/Message'
+import Menu from './collections/Menu/Menu'
+export const MenuItem = deprecateComponent('MenuItem', 'Use "Menu.Item" instead.', Menu.Item)
 
-import _Table from './collections/Table/Table'
-export { _Table as Table }
-export const TableColumn = deprecateComponent('TableColumn', 'Use "Table.Column" instead.', _Table.Column)
+import Table from './collections/Table/Table'
+export const TableColumn = deprecateComponent('TableColumn', 'Use "Table.Column" instead.', Table.Column)
 
-// ----------------------------------------
+//
 // Elements
-// ----------------------------------------
-export Button from './elements/Button/Button'
+//
+// TODO deprecate Buttons once updated to v1 API
 export Buttons from './elements/Button/Buttons'
-export Container from './elements/Container/Container'
-export Divider from './elements/Divider/Divider'
-export Flag from './elements/Flag/Flag'
-export Header from './elements/Header/Header'
-export Icon from './elements/Icon/Icon'
-export Image from './elements/Image/Image'
-export Input from './elements/Input/Input'
-export Label from './elements/Label/Label'
-export Loader from './elements/Loader/Loader'
-
-import _List from './elements/List/List'
-export { _List as List }
-export const ListItem = deprecateComponent('ListItem', 'Use "List.Item" instead.', _List.Item)
+import List from './elements/List/List'
+export const ListItem = deprecateComponent('ListItem', 'Use "List.Item" instead.', List.Item)
 
-export Segment from './elements/Segment/Segment'
-export Segments from './elements/Segment/SegmentSegments'
-export Step from './elements/Step/Step'
-export Rail from './elements/Rail/Rail'
-
-// ----------------------------------------
+//
 // Modules
-// ----------------------------------------
-export Accordion from './modules/Accordion/Accordion'
-export Checkbox from './modules/Checkbox/Checkbox'
-export Dropdown from './modules/Dropdown/Dropdown'
-
-import _Modal from './modules/Modal/Modal'
-export { _Modal as Modal }
-export const ModalContent = deprecateComponent('ModalContent', 'Use "Modal.Content" instead.', _Modal.Content)
-export const ModalHeader = deprecateComponent('ModalHeader', 'Use "Modal.Header" instead.', _Modal.Header)
-export const ModalFooter = deprecateComponent('ModalFooter', 'Use "Modal.Actions" instead.', _Modal.Actions)
+//
+import Modal from './modules/Modal/Modal'
+export const ModalContent = deprecateComponent('ModalContent', 'Use "Modal.Content" instead.', Modal.Content)
+export const ModalHeader = deprecateComponent('ModalHeader', 'Use "Modal.Header" instead.', Modal.Header)
+export const ModalFooter = deprecateComponent('ModalFooter', 'Use "Modal.Actions" instead.', Modal.Actions)
 
-export Progress from './modules/Progress/Progress'
-export Rating from './modules/Rating/Rating'
-
-// ----------------------------------------
+//
 // Views
-// ----------------------------------------
-
-import _Item from './views/Item/Item'
-export { _Item as Item }
-export const Items = deprecateComponent('Items', 'Use "Item.Items" instead.', _Item.Items)
-export Statistic from './views/Statistic/Statistic'
+//
+import Item from './views/Item/Item'
+export const Items = deprecateComponent('Items', 'Use "Item.Items" instead.', Item.Items)
diff --git a/src/utils/AutoControlledComponent.js b/src/lib/AutoControlledComponent.js
similarity index 97%
rename from src/utils/AutoControlledComponent.js
rename to src/lib/AutoControlledComponent.js
index a992d973da..642fe1bd4b 100644
--- a/src/utils/AutoControlledComponent.js
+++ b/src/lib/AutoControlledComponent.js
@@ -20,7 +20,7 @@
  *    components.
  *
  * 4. Instance Methods
- *    Some instances methods may be exposed to users via refs.  Again, these are lost with HOC unless
+ *    Some instance methods may be exposed to users via refs.  Again, these are lost with HOC unless
  *    hoisted and exposed by the HOC.
  */
 import _ from 'lodash'
@@ -133,8 +133,6 @@ export default class AutoControlledComponent extends Component {
    * @param {object} [state] Actual state, useful when you also need to setState.
    */
   trySetState = (maybeState, state) => {
-    // console.debug('trySetState')
-    // console.log('maybe:', maybeState, 'state:', state)
     const { autoControlledProps } = this.constructor
     if (process.env.NODE_ENV !== 'production') {
       const { name } = this.constructor
diff --git a/src/utils/Meta.js b/src/lib/META.js
similarity index 57%
rename from src/utils/Meta.js
rename to src/lib/META.js
index 688c0adbeb..55efebeee7 100644
--- a/src/utils/Meta.js
+++ b/src/lib/META.js
@@ -40,34 +40,29 @@ const getMeta = (metaArg) => {
 }
 
 const metaHasKeyValue = _.curry((key, val, metaArg) => _.flow(getMeta, _.get(key), _.eq(val))(metaArg))
-const isType = metaHasKeyValue('type')
+export const isType = metaHasKeyValue('type')
 
-/**
- * Component meta information.  Used to declaratively classify and identify components.
- * @type {{}}
- */
-const META = {
-  type: TYPES,
+// ----------------------------------------
+// Export
+// ----------------------------------------
 
-  // TODO remove once all PRs remove use of the library key
-  // this exists only to prevent foo of undefined errors
-  // there is a test that fails if a components uses this property
-  library: {},
+// TODO remove once all PRs remove use of the library key
+// this exists only to prevent foo of undefined errors
+// there is a test that fails if a components uses this property
+export const library = {}
 
-  // type
-  isType,
-  isAddon: isType(TYPES.addon),
-  isCollection: isType(TYPES.collection),
-  isElement: isType(TYPES.element),
-  isView: isType(TYPES.view),
-  isModule: isType(TYPES.module),
+// type
+export const type = TYPES
+// isType
+export const isAddon = isType(TYPES.addon)
+export const isCollection = isType(TYPES.collection)
+export const isElement = isType(TYPES.element)
+export const isView = isType(TYPES.view)
+export const isModule = isType(TYPES.module)
 
-  // parent
-  isParent: _.flow(getMeta, _.has('parent'), _.eq(false)),
-  isChild: _.flow(getMeta, _.has('parent')),
-
-  // other
-  isPrivate: _.flow(getMeta, _.get('name'), _.startsWith('_')),
-}
+// parent
+export const isParent = _.flow(getMeta, _.has('parent'), _.eq(false))
+export const isChild = _.flow(getMeta, _.has('parent'))
 
-export default META
+// other
+export const isPrivate = _.flow(getMeta, _.get('name'), _.startsWith('_'))
diff --git a/src/utils/semanticUtils.js b/src/lib/SUI.js
similarity index 100%
rename from src/utils/semanticUtils.js
rename to src/lib/SUI.js
diff --git a/src/lib/childrenUtils.js b/src/lib/childrenUtils.js
new file mode 100644
index 0000000000..16f7635039
--- /dev/null
+++ b/src/lib/childrenUtils.js
@@ -0,0 +1,18 @@
+import _ from 'lodash'
+import { Children } from 'react'
+
+/**
+ * Determine if child by type exists in children.
+ * @param {Object} children The children prop of a component.
+ * @param {string|Function} type An html tag name string or React component.
+ * @returns {Boolean}
+ */
+export const someByType = (children, type) => _.some(Children.toArray(children), { type })
+
+/**
+ * Find child by type.
+ * @param {Object} children The children prop of a component.
+ * @param {string|Function} type An html tag name string or React component.
+ * @returns {undefined|Object}
+ */
+export const findByType = (children, type) => _.find(Children.toArray(children), { type })
diff --git a/src/lib/classNameBuilders.js b/src/lib/classNameBuilders.js
new file mode 100644
index 0000000000..e66921b586
--- /dev/null
+++ b/src/lib/classNameBuilders.js
@@ -0,0 +1,95 @@
+/*
+ * There are 4 prop patterns used to build up the className for a component.
+ * Each utility here is meant for use in a classnames() argument.
+ *
+ * There is no util for valueOnly() because it would simply return val.
+ * Use the prop value inline instead.
+ *   <Label size='big' />
+ *   <div class="ui big label"></div>
+ */
+import { numberToWord } from './numberToWord'
+
+/**
+ * Props where only the prop key is used in the className.
+ * @param {*} val A props value
+ * @param {string} key A props key
+ *
+ * @example
+ * <Label tag />
+ * <div class="ui tag label"></div>
+ */
+export const useKeyOnly = (val, key) => val && key
+
+/**
+ * Props that require both a key and value to create a className.
+ * @param {*} val A props value
+ * @param {string} key A props key
+ *
+ * @example
+ * <Label corner='left' />
+ * <div class="ui left corner label"></div>
+ */
+export const useValueAndKey = (val, key) => val && val !== true && `${val} ${key}`
+
+/**
+ * Props whose key will be used in className, or value and key.
+ * @param {*} val A props value
+ * @param {string} key A props key
+ *
+ * @example Key Only
+ * <Label pointing />
+ * <div class="ui pointing label"></div>
+ *
+ * @example Key and Value
+ * <Label pointing='left' />
+ * <div class="ui left pointing label"></div>
+ */
+export const useKeyOrValueAndKey = (val, key) => val && (val === true ? key : `${val} ${key}`)
+
+//
+// Prop to className exceptions
+//
+
+/**
+ * The "columns" prop follows the useValueAndKey except when the value is "equal" and value equal is allowed.
+ * In this case, classes "equal width" are used, ignoring the "column" class.
+ * @param {*} val The value of the "columns" prop
+ * @param {boolean} canEqual Flag that indicates possibility of "equal" value
+ *
+ * @example
+ * <Grid columns='equal' />
+ * <div class="ui equal width grid"></div>
+ *
+ * @example
+ * <Grid columns={4} />
+ * <div class="ui four column grid"></div>
+ */
+export const useColumnsProp = (val, canEqual = false) => val === 'equal' && canEqual
+  ? 'equal width'
+  : useValueAndKey(numberToWord(val), 'column')
+
+/**
+ * The "textAlign" prop follows the useValueAndKey except when the value is "justified'.
+ * In this case, only the class "justified" is used, ignoring the "aligned" class.
+ * @param {*} val The value of the "textAlign" prop
+ *
+ * @example
+ * <Container textAlign='justified' />
+ * <div class="ui justified container"></div>
+ *
+ * @example
+ * <Container textAlign='left' />
+ * <div class="ui left aligned container"></div>
+ */
+export const useTextAlignProp = val => val === 'justified' ? 'justified' : useValueAndKey(val, 'aligned')
+
+/**
+ * The "verticalAlign" prop follows the useValueAndKey.
+ *
+ * @param {*} val The value of the "verticalAlign" prop
+ *
+ * @example
+ * <Grid verticalAlign='middle' />
+ * <div class="ui middle aligned grid"></div>
+ */
+export const useVerticalAlignProp = val => useValueAndKey(val, 'aligned')
diff --git a/src/lib/customPropTypes.js b/src/lib/customPropTypes.js
new file mode 100644
index 0000000000..3058dc8284
--- /dev/null
+++ b/src/lib/customPropTypes.js
@@ -0,0 +1,182 @@
+import { Children } from 'react'
+import _ from 'lodash'
+
+const type = (...args) => Object.prototype.toString.call(...args)
+
+/**
+ * Ensures children are of a set of types. Matches are made against the component _meta.name property.
+ * @param {String[]} allowedTypes Collection of allowed component types.
+ */
+export const ofComponentTypes = (allowedTypes) => {
+  return (props, propName, componentName) => {
+    if (propName !== 'children') {
+      throw new Error(`ofComponentTypes can only be used on the \`children\` prop, not ${propName}.`)
+    }
+    if (!_.isArray(allowedTypes)) {
+      throw new Error([
+        'Invalid argument supplied to ofComponentTypes, expected an instance of array.'
+          ` See ${componentName} prop \`${propName}\`.`,
+      ].join(''))
+    }
+    const disallowed = _.compact(Children.map(props.children, child => {
+      return _.includes(allowedTypes, _.get(child, 'type._meta.name')) ? null : child
+    }))
+    if (!_.isEmpty(disallowed)) {
+      return new Error(
+        `\`${componentName}\` should only have children of type \`${allowedTypes}\`.`
+      )
+    }
+  }
+}
+
+/**
+ * Verifies exclusivity of a given prop.
+ * @param {string[]} disallowedProps An array of props that cannot be used with this prop.
+ */
+export const disallow = disallowedProps => {
+  return (props, propName, componentName) => {
+    if (!_.isArray(disallowedProps)) {
+      throw new Error([
+        'Invalid argument supplied to mutuallyExclusive, expected an instance of array.'
+          ` See ${componentName} prop \`${propName}\`.`,
+      ].join(''))
+    }
+
+    // mutually exclusive
+    const disallowed = disallowedProps.reduce((acc, exclusive) => {
+      if (!_.isUndefined(props[propName]) && !_.isUndefined(props[exclusive])) {
+        return [...acc, exclusive]
+      }
+      return acc
+    }, [])
+
+    if (!_.isEmpty(disallowed)) {
+      return new Error([
+        `\`${componentName}\` prop \`${propName}\` conflicts with props: \`${disallowed.join('`, `')}\`.`,
+        'They cannot be defined together, choose one or the other.',
+      ].join(' '))
+    }
+  }
+}
+
+/**
+ * Ensure a prop adherers to multiple prop type validators.
+ * @param {function[]} validators An array of propType functions.
+ */
+export const every = (validators) => {
+  return (props, propName, componentName, ...rest) => {
+    if (!_.isArray(validators)) {
+      throw new Error([
+        'Invalid argument supplied to all, expected an instance of array.',
+        `See ${componentName} prop \`${propName}\`.`,
+      ].join(' '))
+    }
+
+    const errors = _.compact(_.map(validators, validator => {
+      if (!_.isFunction(validator)) {
+        throw new Error(
+          `all() argument "validators" should contain functions, found: ${type(validator)}.`
+        )
+      }
+      return validator(props, propName, componentName, ...rest)
+    }))
+
+    // we can only return one error at a time
+    return errors[0]
+  }
+}
+
+/**
+ * Ensure a prop adherers to at least one of the given prop type validators.
+ * @param {function[]} validators An array of propType functions.
+ */
+export const some = (validators) => {
+  return (props, propName, componentName, ...rest) => {
+    if (!_.isArray(validators)) {
+      throw new Error([
+        'Invalid argument supplied to all, expected an instance of array.',
+        `See ${componentName} prop \`${propName}\`.`,
+      ].join(' '))
+    }
+
+    const errors = _.map(validators, validator => {
+      if (!_.isFunction(validator)) {
+        throw new Error(
+          `any() argument "validators" should contain functions, found: ${type(validator)}.`
+        )
+      }
+      return validator(props, propName, componentName, ...rest)
+    })
+
+    // if no validator passed return the first error found
+    if (!_.some(errors, _.overSome(_.isNull, _.isUndefined))) {
+      return _.find(errors, error => !_.isUndefined(error))
+    }
+  }
+}
+
+/**
+ * Ensure a validator passes only when a component has a given propsShape.
+ * @param {object} propsShape An object describing the prop shape.
+ * @param {function} validator A propType function.
+ */
+export const givenProps = (propsShape, validator) => {
+  return (props, propName, componentName, ...rest) => {
+    // only validate if all propsShape validators pass
+    if (!_.every(propsShape, (val, key) => !val(props, key, componentName, ...rest))) return
+
+    if (!_.isPlainObject(propsShape)) {
+      throw new Error(
+        `Invalid argument supplied to whenShape, expected an object. See ${componentName} prop \`${propName}\`.`,
+      )
+    }
+
+    if (!_.isFunction(validator)) {
+      throw new Error(
+        `Invalid argument supplied to whenShape, expected a function. See ${componentName} prop \`${propName}\`.`,
+      )
+    }
+
+    const error = validator(props, propName, componentName, ...rest)
+
+    if (error) {
+      // poor mans shallow pretty print, prevents JSON circular reference errors
+      const prettyProps = `{ ${_.map(_.pick(props, _.keys(propsShape)), (val, key) => {
+        let value = val
+        if (_.isString(val)) value = `"${val}"`
+        else if (_.isArray(val)) value = `[${val.join(', ')}]`
+        else if (_.isObject(val)) value = '{...}'
+
+        return `${key}: ${value}`
+      }).join(', ')} }`
+
+      error.message = `Given props ${prettyProps}: ${error.message}`
+      return error
+    }
+  }
+}
+
+/**
+ * Define prop dependencies by requiring other props.
+ * @param {string[]} requiredProps An array of required prop names.
+ */
+export const demand = (requiredProps) => {
+  return (props, propName, componentName) => {
+    if (!_.isArray(requiredProps)) {
+      throw new Error([
+        'Invalid `requiredProps` argument supplied to require, expected an instance of array.'
+          ` See ${componentName} prop \`${propName}\`.`,
+      ].join(''))
+    }
+
+    // do not require requiredProps if the prop does not exist in props
+    if (!_.has(props, propName)) return
+
+    const missingRequired = requiredProps.filter(required => !_.has(props, required))
+    if (!_.isEmpty(missingRequired)) {
+      return new Error(
+        `\`${componentName}\` prop \`${propName}\` requires props: \`${missingRequired.join('`, `')}\`.`,
+      )
+    }
+  }
+}
diff --git a/src/utils/debug.js b/src/lib/debug.js
similarity index 79%
rename from src/utils/debug.js
rename to src/lib/debug.js
index c4069922a4..26cb4f6b6e 100644
--- a/src/utils/debug.js
+++ b/src/lib/debug.js
@@ -1,8 +1,8 @@
-let debug
+let _debug
 const noop = () => undefined
 
 if (process.env.NODE_ENV !== 'production' && process.env.NODE_ENV !== 'test') {
-  debug = require('debug')
+  _debug = require('debug')
   // Safari private mode throws when writing to localStorage
   // https://github.com/TechnologyAdvice/stardust/issues/332
   try {
@@ -13,27 +13,27 @@ if (process.env.NODE_ENV !== 'production' && process.env.NODE_ENV !== 'test') {
     /* eslint-enable no-console */
   }
 } else {
-  debug = () => noop
+  _debug = () => noop
 }
 
 /**
  * Create a namespaced debug function.
  * @param {String} namespace Usually a component name.
  * @example
- * import { makeDebugger } from 'src/utils/debug'
+ * import { makeDebugger } from 'src/lib'
  * const debug = makeDebugger('namespace')
  *
  * debug('Some message')
  * @returns {Function}
  */
 export const makeDebugger = (namespace) => {
-  return debug(`stardust:${namespace}`)
+  return _debug(`stardust:${namespace}`)
 }
 
 /**
  * Default debugger, simple log.
  * @example
- * import debug from 'src/utils/debug'
+ * import { debug } from 'src/lib'
  * debug('Some message')
  */
-export default makeDebugger('log')
+export const debug = makeDebugger('log')
diff --git a/src/utils/deprecate.js b/src/lib/deprecate.js
similarity index 100%
rename from src/utils/deprecate.js
rename to src/lib/deprecate.js
diff --git a/src/lib/getUnhandledProps.js b/src/lib/getUnhandledProps.js
new file mode 100644
index 0000000000..c448c6616c
--- /dev/null
+++ b/src/lib/getUnhandledProps.js
@@ -0,0 +1,19 @@
+import _ from 'lodash'
+/**
+ * Returns an object consisting of props beyond the scope of the Component.
+ * Useful for getting and spreading unknown props from the user.
+ * @param {*} Component A React.Component.
+ * @param {*} props Props from a React.Component instance.
+ * @returns {{}} A shallow copy of the prop object
+ */
+const getUnhandledProps = (Component, props) => {
+  const handledProps = _.union(
+    Component.autoControlledProps,
+    _.keys(Component.defaultProps),
+    _.keys(Component.propTypes),
+  )
+
+  return _.omit(props, handledProps)
+}
+
+export default getUnhandledProps
diff --git a/src/lib/index.js b/src/lib/index.js
new file mode 100644
index 0000000000..5f84107ee9
--- /dev/null
+++ b/src/lib/index.js
@@ -0,0 +1,31 @@
+export { default as AutoControlledComponent } from './AutoControlledComponent'
+export * as childrenUtils from './childrenUtils'
+
+export {
+  useKeyOnly,
+  useValueAndKey,
+  useKeyOrValueAndKey,
+  useColumnsProp,
+  useTextAlignProp,
+  useVerticalAlignProp,
+} from './classNameBuilders'
+
+export * as customPropTypes from './customPropTypes'
+
+export {
+  debug,
+  makeDebugger,
+} from './debug'
+
+export {
+  deprecateProps,
+  deprecateComponent,
+} from './deprecate'
+
+export { default as getUnhandledProps } from './getUnhandledProps'
+export * as META from './META'
+export * as SUI from './SUI'
+
+export { default as keyboardKey } from './keyboardKey'
+export { numberToWordMap, numberToWord } from './numberToWord'
+export { objectDiff } from './objectDiff'
diff --git a/src/utils/jquery.js b/src/lib/jquery.js
similarity index 96%
rename from src/utils/jquery.js
rename to src/lib/jquery.js
index 65c01c7b56..35105ad5cd 100644
--- a/src/utils/jquery.js
+++ b/src/lib/jquery.js
@@ -4,7 +4,7 @@
 import _ from 'lodash'
 import { makeDebugger } from './debug'
 
-// do nothing if we're not in a browser
+// only load in the browser
 if (typeof window === 'object' && window.window === window) {
   const debug = makeDebugger('jquery')
 
diff --git a/src/utils/keyboardKey.js b/src/lib/keyboardKey.js
similarity index 99%
rename from src/utils/keyboardKey.js
rename to src/lib/keyboardKey.js
index a39a1c7639..a353aeee92 100644
--- a/src/utils/keyboardKey.js
+++ b/src/lib/keyboardKey.js
@@ -5,7 +5,7 @@
  */
 import _ from 'lodash'
 
-export const codes = {
+const codes = {
   // ----------------------------------------
   // By Code
   // ----------------------------------------
@@ -88,6 +88,8 @@ _.times(26, (i) => {
 })
 
 const keyboardKey = {
+  codes,
+
   /**
    * Get the `keyCode` or `which` value from a keyboard event or `key` name.
    * @param {string|object} name A keyboard event like object or `key` name.
diff --git a/src/utils/numberToWord.js b/src/lib/numberToWord.js
similarity index 86%
rename from src/utils/numberToWord.js
rename to src/lib/numberToWord.js
index a92e204dec..c70a32d52b 100644
--- a/src/utils/numberToWord.js
+++ b/src/lib/numberToWord.js
@@ -17,6 +17,6 @@ export const numberToWordMap = {
   16: 'sixteen',
 }
 
-export default function numberToWord(number) {
+export function numberToWord(number) {
   return numberToWordMap[number] || number
 }
diff --git a/src/utils/utils.js b/src/lib/objectDiff.js
similarity index 93%
rename from src/utils/utils.js
rename to src/lib/objectDiff.js
index 59965cd357..46bc67ea0c 100644
--- a/src/utils/utils.js
+++ b/src/lib/objectDiff.js
@@ -7,7 +7,7 @@ import _ from 'lodash'
  * @param {{}} target The target object.
  * @returns {{}} A new object containing new/modified/deleted keys.
  * @example
- * import { objectDiff } from 'src/utils/utils'
+ * import { objectDiff } from 'src/lib'
  *
  * const a = { key: 'val', foo: 'bar' }
  * const b = { key: 'val', foo: 'baz' }
diff --git a/src/modules/Accordion/Accordion.js b/src/modules/Accordion/Accordion.js
index 273b62b5d3..ad2de82fe9 100644
--- a/src/modules/Accordion/Accordion.js
+++ b/src/modules/Accordion/Accordion.js
@@ -2,17 +2,20 @@ import _ from 'lodash'
 import cx from 'classnames'
 import React, { Children, cloneElement, PropTypes } from 'react'
 
+import {
+  AutoControlledComponent as Component,
+  customPropTypes,
+  META,
+  useKeyOnly,
+} from '../../lib'
+import { Icon } from '../../elements'
 import AccordionContent from '../../modules/Accordion/AccordionContent'
 import AccordionTitle from '../../modules/Accordion/AccordionTitle'
-import AutoControlledComponent from '../../utils/AutoControlledComponent'
-import Icon from '../../elements/Icon/Icon'
-import META from '../../utils/Meta'
-import { customPropTypes, useKeyOnly } from '../../utils/propUtils'
 
 /**
  * An accordion allows users to toggle the display of sections of content
  */
-export default class Accordion extends AutoControlledComponent {
+export default class Accordion extends Component {
   static autoControlledProps = [
     'activeIndex',
   ]
@@ -22,8 +25,8 @@ export default class Accordion extends AutoControlledComponent {
     activeIndex: PropTypes.number,
 
     /** Accordion.Title and Accordion.Content components.  Mutually exclusive with the panels prop. */
-    children: customPropTypes.all([
-      customPropTypes.mutuallyExclusive(['panels']),
+    children: customPropTypes.every([
+      customPropTypes.disallow(['panels']),
       PropTypes.node,
     ]),
 
@@ -47,8 +50,8 @@ export default class Accordion extends AutoControlledComponent {
      * Object can optionally define an `active` key to open/close the panel.
      * Mutually exclusive with children.
      */
-    panels: customPropTypes.all([
-      customPropTypes.mutuallyExclusive(['children']),
+    panels: customPropTypes.every([
+      customPropTypes.disallow(['children']),
       PropTypes.arrayOf(PropTypes.shape({
         active: PropTypes.bool,
         title: PropTypes.string,
diff --git a/src/modules/Accordion/AccordionContent.js b/src/modules/Accordion/AccordionContent.js
index 4f376669c8..e4e293b8a4 100644
--- a/src/modules/Accordion/AccordionContent.js
+++ b/src/modules/Accordion/AccordionContent.js
@@ -1,8 +1,7 @@
 import React, { PropTypes } from 'react'
 import cx from 'classnames'
 
-import META from '../../utils/Meta'
-import { useKeyOnly } from '../../utils/propUtils'
+import { META, useKeyOnly } from '../../lib'
 
 function AccordionContent({ active, children, className, ...rest }) {
   const classes = cx(
diff --git a/src/modules/Accordion/AccordionTitle.js b/src/modules/Accordion/AccordionTitle.js
index fafd984e74..53e6eb2b2a 100644
--- a/src/modules/Accordion/AccordionTitle.js
+++ b/src/modules/Accordion/AccordionTitle.js
@@ -1,8 +1,7 @@
 import React, { PropTypes } from 'react'
 import cx from 'classnames'
 
-import META from '../../utils/Meta'
-import { useKeyOnly } from '../../utils/propUtils'
+import { META, useKeyOnly } from '../../lib'
 
 function AccordionTitle({ active, children, className, onClick, ...rest }) {
   const classes = cx(
diff --git a/src/modules/Checkbox/Checkbox.js b/src/modules/Checkbox/Checkbox.js
index cb0ac66e90..a5c5b8b059 100644
--- a/src/modules/Checkbox/Checkbox.js
+++ b/src/modules/Checkbox/Checkbox.js
@@ -2,10 +2,12 @@ import _ from 'lodash'
 import React, { PropTypes } from 'react'
 import cx from 'classnames'
 
-import AutoControlledComponent from '../../utils/AutoControlledComponent'
-import META from '../../utils/Meta'
-import { makeDebugger } from '../../utils/debug'
-import { getUnhandledProps } from '../../utils/propUtils'
+import {
+  AutoControlledComponent as Component,
+  getUnhandledProps,
+  META,
+  makeDebugger,
+} from '../../lib'
 
 const debug = makeDebugger('checkbox')
 
@@ -38,7 +40,7 @@ const _meta = {
  * A checkbox allows a user to select a value from a small set of options, often binary
  * @see Radio
  */
-export default class Checkbox extends AutoControlledComponent {
+export default class Checkbox extends Component {
   static propTypes = {
     /** Additional classes. */
     className: PropTypes.string,
@@ -49,6 +51,9 @@ export default class Checkbox extends AutoControlledComponent {
     /** The initial value of checked. */
     defaultChecked: PropTypes.bool,
 
+    /** A checkbox can appear disabled and be unable to change states */
+    disabled: PropTypes.bool,
+
     /** Removes padding for a label. Auto applied when there is no label. */
     fitted: PropTypes.bool,
 
@@ -58,9 +63,18 @@ export default class Checkbox extends AutoControlledComponent {
     /** HTML input type, either checkbox or radio. */
     inputType: PropTypes.oneOf(_meta.props.inputType),
 
+    /** The HTML input name. */
+    name: PropTypes.string,
+
+    /** Called with (event, { name, value, checked }) when the user attempts to change the value. */
+    onChange: PropTypes.func,
+
     /** Called with (event, { name, value, checked }) when the checkbox or label is clicked. */
     onClick: PropTypes.func,
 
+    /** A checkbox can be read-only and unable to change states */
+    readOnly: PropTypes.bool,
+
     /**
      * Display as a checkbox, radio, slider, or toggle.
      * The input type is `checkbox` for both slider and toggle types.
@@ -68,14 +82,8 @@ export default class Checkbox extends AutoControlledComponent {
      */
     type: PropTypes.oneOf(_meta.props.type),
 
-    /** The HTML input name. */
-    name: PropTypes.string,
-
     /** The HTML input value. */
     value: PropTypes.string,
-
-    /** Called with (event, { name, value, checked }) when the user attempts to change the value. */
-    onChange: PropTypes.func,
   }
 
   static defaultProps = {
diff --git a/src/modules/Dropdown/Dropdown.js b/src/modules/Dropdown/Dropdown.js
index 0a462d053e..dee7f4744c 100644
--- a/src/modules/Dropdown/Dropdown.js
+++ b/src/modules/Dropdown/Dropdown.js
@@ -3,19 +3,21 @@ import cx from 'classnames'
 import React, { cloneElement, PropTypes } from 'react'
 import { findDOMNode } from 'react-dom'
 
-import META from '../../utils/Meta'
-import { customPropTypes, getUnhandledProps, useKeyOnly, useKeyOrValueAndKey } from '../../utils/propUtils'
-import keyboardKey from '../../utils/keyboardKey'
-import { makeDebugger } from '../../utils/debug'
-import { objectDiff } from '../../utils/utils'
-
-// import as Component so eslint react/prop-types recognizes Dropdown
-import { default as Component } from '../../utils/AutoControlledComponent'
+import {
+  AutoControlledComponent as Component,
+  customPropTypes,
+  getUnhandledProps,
+  keyboardKey,
+  makeDebugger,
+  META,
+  objectDiff,
+  useKeyOnly,
+  useKeyOrValueAndKey,
+} from '../../lib'
+import { Icon, Label } from '../../elements'
 import DropdownDivider from './DropdownDivider'
 import DropdownItem from './DropdownItem'
 import DropdownMenu from './DropdownMenu'
-import Icon from '../../elements/Icon/Icon'
-import Label from '../../elements/Label/Label'
 
 const debug = makeDebugger('dropdown')
 
@@ -43,9 +45,9 @@ export default class Dropdown extends Component {
     ]),
 
     /** Array of `{ text: '', value: '' }` options */
-    options: customPropTypes.all([
-      customPropTypes.mutuallyExclusive(['children']),
-      customPropTypes.require(['selection']),
+    options: customPropTypes.every([
+      customPropTypes.disallow(['children']),
+      customPropTypes.demand(['selection']),
       PropTypes.arrayOf(PropTypes.shape({
         value: PropTypes.oneOfType([
           PropTypes.string,
@@ -65,9 +67,9 @@ export default class Dropdown extends Component {
     defaultOpen: PropTypes.bool,
 
     /** A Dropdown can contain a single <Dropdown.Menu /> child. */
-    children: customPropTypes.all([
-      customPropTypes.mutuallyExclusive(['options', 'selection']),
-      customPropTypes.require(['text']),
+    children: customPropTypes.every([
+      customPropTypes.disallow(['options', 'selection']),
+      customPropTypes.demand(['text']),
       React.PropTypes.element,
       customPropTypes.ofComponentTypes(['DropdownMenu']),
     ]),
@@ -158,9 +160,9 @@ export default class Dropdown extends Component {
     // TODO 'searchInMenu' or 'search='in menu' or ???  How to handle this markup and functionality?
 
     /** Behave as an html select. */
-    selection: customPropTypes.all([
-      customPropTypes.mutuallyExclusive(['children']),
-      customPropTypes.require(['options']),
+    selection: customPropTypes.every([
+      customPropTypes.disallow(['children']),
+      customPropTypes.demand(['options']),
       PropTypes.bool,
     ]),
     simple: PropTypes.bool,
diff --git a/src/modules/Dropdown/DropdownDivider.js b/src/modules/Dropdown/DropdownDivider.js
index 01cc901afd..c6aa408832 100644
--- a/src/modules/Dropdown/DropdownDivider.js
+++ b/src/modules/Dropdown/DropdownDivider.js
@@ -1,5 +1,6 @@
 import React, { Component, PropTypes } from 'react'
-import META from '../../utils/Meta'
+
+import { META } from '../../lib'
 
 class DropdownDivider extends Component {
   static propTypes = {
diff --git a/src/modules/Dropdown/DropdownItem.js b/src/modules/Dropdown/DropdownItem.js
index 7284821c25..0071520181 100644
--- a/src/modules/Dropdown/DropdownItem.js
+++ b/src/modules/Dropdown/DropdownItem.js
@@ -1,10 +1,12 @@
 import React, { PropTypes } from 'react'
 import cx from 'classnames'
 
-import Icon from '../../elements/Icon/Icon'
-import { someChildType } from '../../utils/childrenUtils'
-import { useKeyOnly } from '../../utils/propUtils'
-import META from '../../utils/Meta'
+import {
+  childrenUtils,
+  META,
+  useKeyOnly,
+} from '../../lib'
+import { Icon } from '../../elements'
 
 function DropdownItem(props) {
   const {
@@ -31,7 +33,7 @@ function DropdownItem(props) {
     className,
   )
   // add default dropdown icon if item contains another menu
-  const iconName = icon || someChildType(children, 'DropdownMenu') && 'dropdown'
+  const iconName = icon || childrenUtils.someByType(children, 'DropdownMenu') && 'dropdown'
   const iconClasses = cx(iconName, 'icon')
 
   return (
diff --git a/src/modules/Dropdown/DropdownMenu.js b/src/modules/Dropdown/DropdownMenu.js
index c05661d6d9..f34a035087 100644
--- a/src/modules/Dropdown/DropdownMenu.js
+++ b/src/modules/Dropdown/DropdownMenu.js
@@ -1,7 +1,7 @@
 import React, { Component, PropTypes } from 'react'
 import cx from 'classnames'
 
-import META from '../../utils/Meta'
+import { META } from '../../lib'
 
 class DropdownMenu extends Component {
   static propTypes = {
diff --git a/src/modules/Modal/Modal.js b/src/modules/Modal/Modal.js
index 0b523a548e..79797a3f9a 100644
--- a/src/modules/Modal/Modal.js
+++ b/src/modules/Modal/Modal.js
@@ -1,13 +1,10 @@
 import React, { PropTypes } from 'react'
 import cx from 'classnames'
-import META from '../../utils/Meta'
+
+import { getUnhandledProps, META, useKeyOnly } from '../../lib'
 import ModalHeader from './ModalHeader'
 import ModalContent from './ModalContent'
 import ModalActions from './ModalActions'
-import {
-  getUnhandledProps,
-  useKeyOnly,
-} from '../../utils/propUtils'
 
 function Modal(props) {
   const {
diff --git a/src/modules/Modal/ModalActions.js b/src/modules/Modal/ModalActions.js
index 41f0e94634..2bf9c82da4 100644
--- a/src/modules/Modal/ModalActions.js
+++ b/src/modules/Modal/ModalActions.js
@@ -1,7 +1,7 @@
 import React, { PropTypes } from 'react'
 import classNames from 'classnames'
-import META from '../../utils/Meta'
-import { getUnhandledProps } from '../../utils/propUtils'
+
+import { getUnhandledProps, META } from '../../lib'
 
 function ModalActions(props) {
   const { children, className } = props
diff --git a/src/modules/Modal/ModalContent.js b/src/modules/Modal/ModalContent.js
index e8c6ee5489..2f6aad4a11 100644
--- a/src/modules/Modal/ModalContent.js
+++ b/src/modules/Modal/ModalContent.js
@@ -1,10 +1,7 @@
 import React, { PropTypes } from 'react'
 import classNames from 'classnames'
-import META from '../../utils/Meta'
-import {
-  getUnhandledProps,
-  useKeyOnly,
-} from '../../utils/propUtils'
+
+import { getUnhandledProps, META, useKeyOnly } from '../../lib'
 
 function ModalContent(props) {
   const { children, image, className } = props
diff --git a/src/modules/Modal/ModalHeader.js b/src/modules/Modal/ModalHeader.js
index 7a3fba4f92..14987c91c0 100644
--- a/src/modules/Modal/ModalHeader.js
+++ b/src/modules/Modal/ModalHeader.js
@@ -1,7 +1,7 @@
 import React, { PropTypes } from 'react'
 import classNames from 'classnames'
-import META from '../../utils/Meta'
-import { getUnhandledProps } from '../../utils/propUtils'
+
+import { getUnhandledProps, META } from '../../lib'
 
 function ModalHeader(props) {
   const { children, className } = props
diff --git a/src/modules/Progress/Progress.js b/src/modules/Progress/Progress.js
index 56a1605f10..68cd57da4d 100644
--- a/src/modules/Progress/Progress.js
+++ b/src/modules/Progress/Progress.js
@@ -2,9 +2,14 @@ import _ from 'lodash'
 import cx from 'classnames'
 import React, { PropTypes } from 'react'
 
-import META from '../../utils/Meta'
-import { customPropTypes, getUnhandledProps, useKeyOnly, useValueAndKey } from '../../utils/propUtils'
-import * as sui from '../../utils/semanticUtils'
+import {
+  customPropTypes,
+  getUnhandledProps,
+  META,
+  SUI,
+  useKeyOnly,
+  useValueAndKey,
+} from '../../lib'
 
 function Progress(props) {
   const {
@@ -72,9 +77,9 @@ Progress._meta = {
   type: META.type.module,
   props: {
     attached: ['top', 'bottom'],
-    color: sui.colors,
+    color: SUI.colors,
     label: ['ratio', 'percent'],
-    size: _.without(sui.sizes, 'mini', 'huge', 'massive'),
+    size: _.without(SUI.sizes, 'mini', 'huge', 'massive'),
   },
 }
 
@@ -110,10 +115,10 @@ Progress.propTypes = {
   inverted: PropTypes.bool,
 
   /** Can be set to either to display progress as percent or ratio. */
-  label: customPropTypes.all([
-    customPropTypes.any([
-      customPropTypes.require(['percent']),
-      customPropTypes.require(['total', 'value']),
+  label: customPropTypes.every([
+    customPropTypes.some([
+      customPropTypes.demand(['percent']),
+      customPropTypes.demand(['total', 'value']),
     ]),
     PropTypes.oneOfType([
       PropTypes.bool,
@@ -122,8 +127,8 @@ Progress.propTypes = {
   ]),
 
   /** Current percent complete. */
-  percent: customPropTypes.all([
-    customPropTypes.mutuallyExclusive(['total', 'value']),
+  percent: customPropTypes.every([
+    customPropTypes.disallow(['total', 'value']),
     PropTypes.oneOfType([
       PropTypes.string,
       PropTypes.number,
@@ -147,9 +152,9 @@ Progress.propTypes = {
    * Together, these will calculate the percent.
    * Mutually excludes percent.
    */
-  total: customPropTypes.all([
-    customPropTypes.require(['value']),
-    customPropTypes.mutuallyExclusive(['percent']),
+  total: customPropTypes.every([
+    customPropTypes.demand(['value']),
+    customPropTypes.disallow(['percent']),
     PropTypes.oneOfType([
       PropTypes.string,
       PropTypes.number,
@@ -157,13 +162,11 @@ Progress.propTypes = {
   ]),
 
   /**
-   * For use with total.
-   * Together, these will calculate the percent.
-   * Mutually excludes percent.
+   * For use with total. Together, these will calculate the percent. Mutually excludes percent.
    */
-  value: customPropTypes.all([
-    customPropTypes.require(['total']),
-    customPropTypes.mutuallyExclusive(['percent']),
+  value: customPropTypes.every([
+    customPropTypes.demand(['total']),
+    customPropTypes.disallow(['percent']),
     PropTypes.oneOfType([
       PropTypes.string,
       PropTypes.number,
diff --git a/src/modules/Rating/Rating.js b/src/modules/Rating/Rating.js
index e26beeee05..9e72478ed7 100644
--- a/src/modules/Rating/Rating.js
+++ b/src/modules/Rating/Rating.js
@@ -2,10 +2,12 @@ import _ from 'lodash'
 import cx from 'classnames'
 import React, { PropTypes } from 'react'
 
-import AutoControlledComponent from '../../utils/AutoControlledComponent'
-import META from '../../utils/Meta'
-import { getUnhandledProps } from '../../utils/propUtils'
-import * as sui from '../../utils/semanticUtils'
+import {
+  AutoControlledComponent as Component,
+  getUnhandledProps,
+  META,
+  SUI,
+} from '../../lib'
 
 const _meta = {
   name: 'Rating',
@@ -13,11 +15,11 @@ const _meta = {
   props: {
     clearable: ['auto'],
     icon: ['star', 'heart'],
-    size: _.without(sui.sizes, 'medium', 'big'),
+    size: _.without(SUI.sizes, 'medium', 'big'),
   },
 }
 
-class Rating extends AutoControlledComponent {
+class Rating extends Component {
   static propTypes = {
     /** Additional className. */
     className: PropTypes.string,
diff --git a/src/modules/index.js b/src/modules/index.js
new file mode 100644
index 0000000000..3fbf5d2d38
--- /dev/null
+++ b/src/modules/index.js
@@ -0,0 +1,6 @@
+export { default as Accordion } from './Accordion/Accordion'
+export { default as Checkbox } from './Checkbox/Checkbox'
+export { default as Dropdown } from './Dropdown/Dropdown'
+export { default as Modal } from './Modal/Modal'
+export { default as Progress } from './Progress/Progress'
+export { default as Rating } from './Rating/Rating'
diff --git a/src/utils/childrenUtils.js b/src/utils/childrenUtils.js
deleted file mode 100644
index 8cd85e23c2..0000000000
--- a/src/utils/childrenUtils.js
+++ /dev/null
@@ -1,65 +0,0 @@
-import _ from 'lodash'
-import { Children } from 'react'
-
-// ----------------------------------------
-// Lodash methods for children
-// ----------------------------------------
-/**
- * _.some for props.children.
- * @param {Object} children The children prop of a component.
- * @param {Array|Function|Object|string} iteratee The function invoked per iteration.
- * @returns {Boolean}
- */
-export const someChild = (children, iteratee) => _.some(Children.toArray(children), iteratee)
-
-/**
- * _.find for props.children.
- * @param {Object} children The children prop of a component.
- * @param {Array|Function|Object|string} iteratee The function invoked per iteration.
- * @returns {undefined|Object}
- */
-export const findChild = (children, iteratee) => _.find(Children.toArray(children), iteratee)
-
-/**
- * _.filter for props.children.
- * @param {Object} children The children prop of a component.
- * @param {Array|Function|Object|string} iteratee The function invoked per iteration.
- * @returns {Array}
- */
-export const filterChildren = (children, iteratee) => _.filter(Children.toArray(children), iteratee)
-
-// ----------------------------------------
-// By Type
-// ----------------------------------------
-/**
- * Determine if child by type exists in children.
- * @param {Object} children The children prop of a component.
- * @param {string|Function} type An html tag name string or React component.
- * @returns {Boolean}
- */
-export const someChildType = (children, type) => someChild(children, { type })
-
-/**
- * Find child by type.
- * @param {Object} children The children prop of a component.
- * @param {string|Function} type An html tag name string or React component.
- * @returns {undefined|Object}
- */
-export const findChildType = (children, type) => findChild(children, { type })
-
-/**
- * _.filter for props.children by child type.
- * @param {Object} children The children prop of a component.
- * @param {string|Function} type An html tag name string or React component.
- * @returns {Array}
- */
-export const filterChildType = (children, type) => filterChildren(children, { type })
-
-/**
- * _.map over children of a specific type.
- * @param {Object} children The children prop of a component.
- * @param {string|Function} type An html tag name string or React component.
- * @param {Array|Function|Object|string} iteratee The function invoked per iteration.
- * @returns {Array}
- */
-export const mapChildType = (children, type, iteratee) => _.map(filterChildren(children, { type }), iteratee)
diff --git a/src/utils/propUtils.js b/src/utils/propUtils.js
deleted file mode 100644
index 3d18ab2ca8..0000000000
--- a/src/utils/propUtils.js
+++ /dev/null
@@ -1,334 +0,0 @@
-import _ from 'lodash'
-import cx from 'classnames'
-import React, { Children } from 'react'
-
-import numberToWord from './numberToWord'
-
-import Icon from '../elements/Icon/Icon'
-import Image from '../elements/Image/Image'
-
-// ===============================================================
-// Custom PropTypes
-// ===============================================================
-const type = (...args) => Object.prototype.toString.call(...args)
-
-export const customPropTypes = {
-  /**
-   * Ensures children are of a set of types. Matches are made against the component _meta.name property.
-   * @param {String[]} allowedTypes Collection of allowed component types.
-   */
-  ofComponentTypes: (allowedTypes) => {
-    return (props, propName, componentName) => {
-      if (propName !== 'children') {
-        throw new Error(`ofComponentTypes can only be used on the \`children\` prop, not ${propName}.`)
-      }
-      if (!_.isArray(allowedTypes)) {
-        throw new Error([
-          'Invalid argument supplied to ofComponentTypes, expected an instance of array.'
-            ` See ${componentName} prop \`${propName}\`.`,
-        ].join(''))
-      }
-      const disallowed = _.compact(Children.map(props.children, child => {
-        return _.includes(allowedTypes, _.get(child, 'type._meta.name')) ? null : child
-      }))
-      if (!_.isEmpty(disallowed)) {
-        return new Error(
-          `\`${componentName}\` should only have children of type \`${allowedTypes}\`.`
-        )
-      }
-    }
-  },
-
-  /**
-   * Verifies exclusivity of a given prop.
-   * @param {string[]} exclusives An array of props that cannot be used with this prop.
-   */
-  mutuallyExclusive: exclusives => {
-    return (props, propName, componentName) => {
-      if (!_.isArray(exclusives)) {
-        throw new Error([
-          'Invalid argument supplied to mutuallyExclusive, expected an instance of array.'
-            ` See ${componentName} prop \`${propName}\`.`,
-        ].join(''))
-      }
-
-      // mutually exclusive
-      const disallowed = exclusives.reduce((acc, exclusive) => {
-        if (!_.isUndefined(props[propName]) && !_.isUndefined(props[exclusive])) {
-          return [...acc, exclusive]
-        }
-        return acc
-      }, [])
-
-      if (!_.isEmpty(disallowed)) {
-        return new Error([
-          `\`${componentName}\` prop \`${propName}\` conflicts with props: \`${disallowed.join('`, `')}\`.`,
-          'They cannot be defined together, choose one or the other.',
-        ].join(' '))
-      }
-    }
-  },
-
-  /**
-   * Ensure a prop adherers to multiple prop type validators.
-   * @param {function[]} validators An array of propType functions.
-   */
-  all: (validators) => {
-    return (props, propName, componentName, ...rest) => {
-      if (!_.isArray(validators)) {
-        throw new Error([
-          'Invalid argument supplied to all, expected an instance of array.',
-          `See ${componentName} prop \`${propName}\`.`,
-        ].join(' '))
-      }
-
-      const errors = _.compact(_.map(validators, validator => {
-        if (!_.isFunction(validator)) {
-          throw new Error(
-            `all() argument "validators" should contain functions, found: ${type(validator)}.`
-          )
-        }
-        return validator(props, propName, componentName, ...rest)
-      }))
-
-      // we can only return one error at a time
-      return errors[0]
-    }
-  },
-
-  /**
-   * Ensure a prop adherers to at least one of the given prop type validators.
-   * @param {function[]} validators An array of propType functions.
-   */
-  any: (validators) => {
-    return (props, propName, componentName, ...rest) => {
-      if (!_.isArray(validators)) {
-        throw new Error([
-          'Invalid argument supplied to all, expected an instance of array.',
-          `See ${componentName} prop \`${propName}\`.`,
-        ].join(' '))
-      }
-
-      const errors = _.map(validators, validator => {
-        if (!_.isFunction(validator)) {
-          throw new Error(
-            `any() argument "validators" should contain functions, found: ${type(validator)}.`
-          )
-        }
-        return validator(props, propName, componentName, ...rest)
-      })
-
-      // if no validator passed return the first error found
-      if (!_.some(errors, _.overSome(_.isNull, _.isUndefined))) {
-        return _.find(errors, error => !_.isUndefined(error))
-      }
-    }
-  },
-
-  /**
-   * Ensure a validator passes only when a component has a given propsShape.
-   * @param {object} propsShape An object describing the prop shape.
-   * @param {function} validator A propType function.
-   */
-  givenProps: (propsShape, validator) => {
-    return (props, propName, componentName, ...rest) => {
-      // only validate if all propsShape validators pass
-      if (!_.every(propsShape, (val, key) => !val(props, key, componentName, ...rest))) return
-
-      if (!_.isPlainObject(propsShape)) {
-        throw new Error(
-          `Invalid argument supplied to whenShape, expected an object. See ${componentName} prop \`${propName}\`.`,
-        )
-      }
-
-      if (!_.isFunction(validator)) {
-        throw new Error(
-          `Invalid argument supplied to whenShape, expected a function. See ${componentName} prop \`${propName}\`.`,
-        )
-      }
-
-      const error = validator(props, propName, componentName, ...rest)
-
-      if (error) {
-        // poor mans shallow pretty print, prevents JSON circular reference errors
-        const prettyProps = `{ ${_.map(_.pick(props, _.keys(propsShape)), (val, key) => {
-          let value = val
-          if (_.isString(val)) value = `"${val}"`
-          else if (_.isArray(val)) value = `[${val.join(', ')}]`
-          else if (_.isObject(val)) value = '{...}'
-
-          return `${key}: ${value}`
-        }).join(', ')} }`
-
-        error.message = `Given props ${prettyProps}: ${error.message}`
-        return error
-      }
-    }
-  },
-
-  /**
-   * Define prop dependencies by requiring other props.
-   * @param {string[]} requiredProps An array of required prop names.
-   */
-  require: (requiredProps) => {
-    return (props, propName, componentName) => {
-      if (!_.isArray(requiredProps)) {
-        throw new Error([
-          'Invalid `requiredProps` argument supplied to require, expected an instance of array.'
-            ` See ${componentName} prop \`${propName}\`.`,
-        ].join(''))
-      }
-
-      // do not require requiredProps if the prop does not exist in props
-      if (!_.has(props, propName)) return
-
-      const missingRequired = requiredProps.filter(required => !_.has(props, required))
-      if (!_.isEmpty(missingRequired)) {
-        return new Error(
-          `\`${componentName}\` prop \`${propName}\` requires props: \`${missingRequired.join('`, `')}\`.`,
-        )
-      }
-    }
-  },
-}
-
-// ===============================================================
-// Instance Utils
-// ===============================================================
-/**
- * Returns an object consisting of props beyond the scope of the Component.
- * Useful for getting and spreading unknown props from the user.
- * @param {*} Component A React.Component.
- * @param {*} props Props from a React.Component instance.
- * @returns {{}} A shallow copy of the prop object
- */
-export const getUnhandledProps = (Component, props) => {
-  const handledProps = _.union(
-    Component.autoControlledProps,
-    _.keys(Component.defaultProps),
-    _.keys(Component.propTypes),
-  )
-
-  return _.omit(props, handledProps)
-}
-
-// ----------------------------------------
-// Prop Renderers
-//
-// Many components share many props. Some of those props should be smart.
-// These give all our components props consistent smart capabilities.
-// ----------------------------------------
-export const iconPropRenderer = (val, props = {}) => {
-  if (_.isString(val)) return <Icon {...props} name={val} />
-
-  if (_.isObject(val)) {
-    const className = cx(val.props.className, props.className) // eslint-disable-line
-    return React.cloneElement(val, { ...val.props, ...props, className })
-  }
-}
-
-export const imagePropRenderer = (val, props = {}) => {
-  if (_.isString(val)) return <Image {...props} src={val} />
-
-  if (_.isObject(val)) {
-    const className = cx(val.props.className, props.className) // eslint-disable-line
-    return React.cloneElement(val, { ...val.props, ...props, className })
-  }
-}
-
-// ----------------------------------------
-// Prop to className
-//
-// There are 4 prop patterns used to build up the className for a component.
-// Each utility here is meant for use in a classnames() argument.
-//
-// There is no util for valueOnly() because it would simply return val.
-// Use the prop value inline instead.
-//   <Label size='big' />
-//   <div class="ui big label"></div>
-// ----------------------------------------
-
-/**
- * Props where only the prop key is used in the className.
- * @param {*} val A props value
- * @param {string} key A props key
- *
- * @example
- * <Label tag />
- * <div class="ui tag label"></div>
- */
-export const useKeyOnly = (val, key) => val && key
-
-/**
- * Props that require both a key and value to create a className.
- * @param {*} val A props value
- * @param {string} key A props key
- *
- * @example
- * <Label corner='left' />
- * <div class="ui left corner label"></div>
- */
-export const useValueAndKey = (val, key) => val && val !== true && `${val} ${key}`
-
-/**
- * Props whose key will be used in className, or value and key.
- * @param {*} val A props value
- * @param {string} key A props key
- *
- * @example Key Only
- * <Label pointing />
- * <div class="ui pointing label"></div>
- *
- * @example Key and Value
- * <Label pointing='left' />
- * <div class="ui left pointing label"></div>
- */
-export const useKeyOrValueAndKey = (val, key) => val && (val === true ? key : `${val} ${key}`)
-
-//
-// Prop to className exceptions
-//
-
-/**
- * The "columns" prop follows the useValueAndKey except when the value is "equal" and value equal is allowed.
- * In this case, classes "equal width" are used, ignoring the "column" class.
- * @param {*} val The value of the "columns" prop
- * @param {boolean} canEqual Flag that indicates possibility of "equal" value
- *
- * @example
- * <Grid columns='equal' />
- * <div class="ui equal width grid"></div>
- *
- * @example
- * <Grid columns={4} />
- * <div class="ui four column grid"></div>
- */
-export const useColumnsProp = (val, canEqual = false) => val === 'equal' && canEqual
-  ? 'equal width'
-  : useValueAndKey(numberToWord(val), 'column')
-
-/**
- * The "textAlign" prop follows the useValueAndKey except when the value is "justified'.
- * In this case, only the class "justified" is used, ignoring the "aligned" class.
- * @param {*} val The value of the "textAlign" prop
- *
- * @example
- * <Container textAlign='justified' />
- * <div class="ui justified container"></div>
- *
- * @example
- * <Container textAlign='left' />
- * <div class="ui left aligned container"></div>
- */
-export const useTextAlignProp = val => val === 'justified' ? 'justified' : useValueAndKey(val, 'aligned')
-
-/**
- * The "verticalAlign" prop follows the useValueAndKey.
- *
- * @param {*} val The value of the "verticalAlign" prop
- *
- * @example
- * <Grid verticalAlign='middle' />
- * <div class="ui middle aligned grid"></div>
- */
-export const useVerticalAlignProp = val => useValueAndKey(val, 'aligned')
diff --git a/src/views/Item/Item.js b/src/views/Item/Item.js
index b06eb3b4eb..c21c4b8c9c 100644
--- a/src/views/Item/Item.js
+++ b/src/views/Item/Item.js
@@ -1,21 +1,23 @@
 import _ from 'lodash'
 import React, { Component, PropTypes } from 'react'
 import cx from 'classnames'
-import { customPropTypes } from '../../utils/propUtils'
-import META from '../../utils/Meta'
 
+import {
+  customPropTypes,
+  META,
+} from '../../lib'
 import ItemItems from './ItemItems'
 
 export default class Item extends Component {
   static propTypes = {
-    children: customPropTypes.all([
-      customPropTypes.mutuallyExclusive(['description']),
+    children: customPropTypes.every([
+      customPropTypes.disallow(['description']),
       PropTypes.node,
     ]),
     className: PropTypes.string,
     contentClassName: PropTypes.string,
-    description: customPropTypes.all([
-      customPropTypes.mutuallyExclusive(['children']),
+    description: customPropTypes.every([
+      customPropTypes.disallow(['children']),
       PropTypes.node,
     ]),
     extra: PropTypes.node,
diff --git a/src/views/Item/ItemItems.js b/src/views/Item/ItemItems.js
index 56577e5f59..61310c8ac3 100644
--- a/src/views/Item/ItemItems.js
+++ b/src/views/Item/ItemItems.js
@@ -1,6 +1,6 @@
 import React, { PropTypes } from 'react'
 import cx from 'classnames'
-import META from '../../utils/Meta'
+import { META } from '../../lib'
 
 function ItemItems(props) {
   const { className, children, ...rest } = props
diff --git a/src/views/Statistic/Statistic.js b/src/views/Statistic/Statistic.js
index 9b15fc7c5c..8993c7adfd 100644
--- a/src/views/Statistic/Statistic.js
+++ b/src/views/Statistic/Statistic.js
@@ -2,9 +2,14 @@ import _ from 'lodash'
 import cx from 'classnames'
 import React, { PropTypes } from 'react'
 
-import { customPropTypes, getUnhandledProps, useKeyOnly, useValueAndKey } from '../../utils/propUtils'
-import * as sui from '../../utils/semanticUtils'
-import META from '../../utils/Meta'
+import {
+  customPropTypes,
+  getUnhandledProps,
+  META,
+  SUI,
+  useKeyOnly,
+  useValueAndKey,
+} from '../../lib'
 import StatisticGroup from './StatisticGroup'
 import StatisticLabel from './StatisticLabel'
 import StatisticValue from './StatisticValue'
@@ -39,16 +44,16 @@ Statistic._meta = {
   name: 'Statistic',
   type: META.type.view,
   props: {
-    color: sui.colors,
-    floated: sui.floats,
-    size: _.without(sui.sizes, 'big', 'massive', 'medium'),
+    color: SUI.colors,
+    floated: SUI.floats,
+    size: _.without(SUI.sizes, 'big', 'massive', 'medium'),
   },
 }
 
 Statistic.propTypes = {
   /** Primary content of the Statistic. */
-  children: customPropTypes.all([
-    customPropTypes.mutuallyExclusive(['label', 'value']),
+  children: customPropTypes.every([
+    customPropTypes.disallow(['label', 'value']),
     PropTypes.node,
   ]),
 
@@ -68,8 +73,8 @@ Statistic.propTypes = {
   inverted: PropTypes.bool,
 
   /** Label content of the Statistic. Mutually exclusive with the children prop. */
-  label: customPropTypes.all([
-    customPropTypes.mutuallyExclusive(['children']),
+  label: customPropTypes.every([
+    customPropTypes.disallow(['children']),
     PropTypes.node,
   ]),
 
@@ -80,8 +85,8 @@ Statistic.propTypes = {
   text: PropTypes.bool,
 
   /** Value content of the Statistic. Mutually exclusive with the children prop. */
-  value: customPropTypes.all([
-    customPropTypes.mutuallyExclusive(['children']),
+  value: customPropTypes.every([
+    customPropTypes.disallow(['children']),
     PropTypes.node,
   ]),
 }
diff --git a/src/views/Statistic/StatisticGroup.js b/src/views/Statistic/StatisticGroup.js
index 97be9b40d6..5152692cab 100644
--- a/src/views/Statistic/StatisticGroup.js
+++ b/src/views/Statistic/StatisticGroup.js
@@ -1,10 +1,14 @@
 import cx from 'classnames'
 import React, { PropTypes } from 'react'
 
-import { customPropTypes, getUnhandledProps, useKeyOnly } from '../../utils/propUtils'
-import * as sui from '../../utils/semanticUtils'
-import numberToWord from '../../utils/numberToWord'
-import META from '../../utils/Meta'
+import {
+  customPropTypes,
+  getUnhandledProps,
+  META,
+  numberToWord,
+  SUI,
+  useKeyOnly,
+} from '../../lib'
 import Statistic from './Statistic'
 
 function StatisticGroup(props) {
@@ -37,14 +41,14 @@ StatisticGroup._meta = {
   type: META.type.view,
   parent: 'Statistic',
   props: {
-    widths: sui.widths,
+    widths: SUI.widths,
   },
 }
 
 StatisticGroup.propTypes = {
   /** Primary content of the StatisticGroup. */
-  children: customPropTypes.all([
-    customPropTypes.mutuallyExclusive(['content']),
+  children: customPropTypes.every([
+    customPropTypes.disallow(['content']),
     PropTypes.node,
   ]),
 
@@ -55,8 +59,8 @@ StatisticGroup.propTypes = {
   horizontal: PropTypes.bool,
 
   /** Array of props for Statistic. */
-  items: customPropTypes.all([
-    customPropTypes.mutuallyExclusive(['children']),
+  items: customPropTypes.every([
+    customPropTypes.disallow(['children']),
     PropTypes.array,
   ]),
 
diff --git a/src/views/Statistic/StatisticLabel.js b/src/views/Statistic/StatisticLabel.js
index 7e575f400c..6c7aac31bf 100644
--- a/src/views/Statistic/StatisticLabel.js
+++ b/src/views/Statistic/StatisticLabel.js
@@ -1,8 +1,11 @@
 import cx from 'classnames'
 import React, { PropTypes } from 'react'
 
-import { customPropTypes, getUnhandledProps } from '../../utils/propUtils'
-import META from '../../utils/Meta'
+import {
+  customPropTypes,
+  getUnhandledProps,
+  META,
+} from '../../lib'
 
 // TODO: This file has disabled shorthand props
 // @see https://github.com/TechnologyAdvice/stardust/pull/334
@@ -25,8 +28,8 @@ StatisticLabel._meta = {
 
 StatisticLabel.propTypes = {
   /** Primary content of the StatisticLabel. */
-  children: customPropTypes.all([
-    customPropTypes.mutuallyExclusive(['content']),
+  children: customPropTypes.every([
+    customPropTypes.disallow(['content']),
     PropTypes.node,
   ]),
 
@@ -34,8 +37,8 @@ StatisticLabel.propTypes = {
   className: PropTypes.string,
 
   // /** Primary content of the StatisticLabel. Mutually exclusive with the children prop. */
-  // content: customPropTypes.all([
-  //   customPropTypes.mutuallyExclusive(['children']),
+  // content: customPropTypes.every([
+  //   customPropTypes.disallow(['children']),
   //   PropTypes.node,
   // ]),
 }
diff --git a/src/views/Statistic/StatisticValue.js b/src/views/Statistic/StatisticValue.js
index 768414a0bd..2af87defeb 100644
--- a/src/views/Statistic/StatisticValue.js
+++ b/src/views/Statistic/StatisticValue.js
@@ -1,8 +1,12 @@
 import cx from 'classnames'
 import React, { PropTypes } from 'react'
 
-import { customPropTypes, getUnhandledProps, useKeyOnly } from '../../utils/propUtils'
-import META from '../../utils/Meta'
+import {
+  customPropTypes,
+  getUnhandledProps,
+  META,
+  useKeyOnly,
+} from '../../lib'
 
 // TODO: This file has disabled shorthand props
 // @see https://github.com/TechnologyAdvice/stardust/pull/334
@@ -25,8 +29,8 @@ StatisticValue._meta = {
 
 StatisticValue.propTypes = {
   /** Primary content of the StatisticValue. */
-  children: customPropTypes.all([
-    customPropTypes.mutuallyExclusive(['content']),
+  children: customPropTypes.every([
+    customPropTypes.disallow(['content']),
     PropTypes.node,
   ]),
 
@@ -34,8 +38,8 @@ StatisticValue.propTypes = {
   className: PropTypes.string,
 
   // /** Primary content of the StatisticValue. Mutually exclusive with the children prop. */
-  // content: customPropTypes.all([
-  //   customPropTypes.mutuallyExclusive(['children']),
+  // content: customPropTypes.every([
+  //   customPropTypes.disallow(['children']),
   //   PropTypes.node,
   // ]),
 
diff --git a/src/views/index.js b/src/views/index.js
new file mode 100644
index 0000000000..43a1b0d17a
--- /dev/null
+++ b/src/views/index.js
@@ -0,0 +1,2 @@
+export { default as Item } from './Item/Item'
+export { default as Statistic } from './Statistic/Statistic'
diff --git a/test/mocks/SemanticjQuery-mock.js b/test/mocks/SemanticjQuery-mock.js
index 50fdbda8b7..81d3010a1d 100644
--- a/test/mocks/SemanticjQuery-mock.js
+++ b/test/mocks/SemanticjQuery-mock.js
@@ -1,4 +1,4 @@
-import sandbox from '../utils/Sandbox-util'
+import { sandbox } from 'test/utils'
 
 //
 // jQuery Plugin Mocks
diff --git a/test/mocks/jQueryLoader-mock.js b/test/mocks/jQueryLoader-mock.js
new file mode 100644
index 0000000000..b97d197242
--- /dev/null
+++ b/test/mocks/jQueryLoader-mock.js
@@ -0,0 +1,3 @@
+const root = window || self || global
+
+root.jQuery = root.$ = require('./SemanticjQuery-mock')
diff --git a/test/specs/addons/Confirm-test.js b/test/specs/addons/Confirm-test.js
index 1cdd789660..cd047b00a2 100644
--- a/test/specs/addons/Confirm-test.js
+++ b/test/specs/addons/Confirm-test.js
@@ -1,6 +1,6 @@
 import React from 'react'
 
-import { Confirm } from 'stardust'
+import Confirm from 'src/addons/Confirm/Confirm'
 import * as common from '../commonTests'
 
 describe('Confirm', () => {
diff --git a/test/specs/addons/Textarea-test.js b/test/specs/addons/Textarea-test.js
index 4a51a03eed..947f87a816 100644
--- a/test/specs/addons/Textarea-test.js
+++ b/test/specs/addons/Textarea-test.js
@@ -1,6 +1,6 @@
 import React from 'react'
 
-import { Textarea } from 'stardust'
+import Textarea from 'src/addons/Textarea/Textarea'
 import * as common from '../commonTests'
 
 describe('Textarea', () => {
diff --git a/test/specs/collections/Breadcrumb/BreadcrumbSection-test.js b/test/specs/collections/Breadcrumb/BreadcrumbSection-test.js
index ea1462cd22..d8b324d8c5 100644
--- a/test/specs/collections/Breadcrumb/BreadcrumbSection-test.js
+++ b/test/specs/collections/Breadcrumb/BreadcrumbSection-test.js
@@ -1,7 +1,7 @@
 import React from 'react'
 import BreadcrumbSection from 'src/collections/Breadcrumb/BreadcrumbSection'
 import * as common from 'test/specs/commonTests'
-import sandbox from 'test/utils/Sandbox-util'
+import { sandbox } from 'test/utils'
 
 describe('BreadcrumbSection', () => {
   common.isConformant(BreadcrumbSection)
diff --git a/test/specs/collections/Form/Field-test.js b/test/specs/collections/Form/Field-test.js
index ef3bdfeabc..787a4503d5 100644
--- a/test/specs/collections/Form/Field-test.js
+++ b/test/specs/collections/Form/Field-test.js
@@ -3,7 +3,7 @@ import React from 'react'
 
 import Form from 'src/collections/Form/Form'
 import * as common from 'test/specs/commonTests'
-import numberToWord from 'src/utils/numberToWord'
+import { numberToWord } from 'src/lib'
 
 describe('Field', () => {
   common.isConformant(Form.Field)
diff --git a/test/specs/collections/Form/Fields-test.js b/test/specs/collections/Form/Fields-test.js
index 2761f80bc6..87988a16ae 100644
--- a/test/specs/collections/Form/Fields-test.js
+++ b/test/specs/collections/Form/Fields-test.js
@@ -4,7 +4,7 @@ import React from 'react'
 import FormFields from 'src/collections/Form/FormFields'
 import FormField from 'src/collections/Form/FormField'
 import * as common from 'test/specs/commonTests'
-import numberToWord from 'src/utils/numberToWord'
+import { numberToWord } from 'src/lib'
 
 describe('Fields', () => {
   common.isConformant(FormFields)
diff --git a/test/specs/collections/Menu/MenuItem-test.js b/test/specs/collections/Menu/MenuItem-test.js
index fac7f41e2a..d9140d9f6e 100644
--- a/test/specs/collections/Menu/MenuItem-test.js
+++ b/test/specs/collections/Menu/MenuItem-test.js
@@ -3,7 +3,7 @@ import React from 'react'
 import Menu from 'src/collections/Menu/Menu'
 import MenuItem from 'src/collections/Menu/MenuItem'
 import * as common from 'test/specs/commonTests'
-import sandbox from 'test/utils/Sandbox-util.js'
+import { sandbox } from 'test/utils/sandbox'
 
 describe('MenuItem', () => {
   common.isConformant(MenuItem)
diff --git a/test/specs/collections/Message/Message-test.js b/test/specs/collections/Message/Message-test.js
index 78f7bcfa42..0c127ec112 100644
--- a/test/specs/collections/Message/Message-test.js
+++ b/test/specs/collections/Message/Message-test.js
@@ -6,7 +6,7 @@ import MessageHeader from 'src/collections/Message/MessageHeader'
 import MessageList from 'src/collections/Message/MessageList'
 
 import * as common from 'test/specs/commonTests'
-import sandbox from 'test/utils/Sandbox-util'
+import { sandbox } from 'test/utils'
 
 describe('Message', () => {
   common.isConformant(Message)
diff --git a/test/specs/collections/Message/MessageHeader.js b/test/specs/collections/Message/MessageHeader.js
deleted file mode 100644
index 0a02b5c470..0000000000
--- a/test/specs/collections/Message/MessageHeader.js
+++ /dev/null
@@ -1,19 +0,0 @@
-import React from 'react'
-
-import MessageHeader from 'src/collections/MessageHeader/MessageHeader'
-import * as common from 'test/specs/commonTests'
-
-describe('MessageHeader', () => {
-  common.isConformant(MessageHeader)
-  common.rendersChildren(MessageHeader)
-
-  it('renders an div tag', () => {
-    shallow(<MessageHeader />)
-      .should.have.tagName('div')
-  })
-
-  it('has className header', () => {
-    shallow(<MessageHeader />)
-      .should.have.className('header')
-  })
-})
diff --git a/test/specs/collections/Table/Table-test.js b/test/specs/collections/Table/Table-test.js
index f78019e821..bf7273c3cd 100644
--- a/test/specs/collections/Table/Table-test.js
+++ b/test/specs/collections/Table/Table-test.js
@@ -4,7 +4,7 @@ import React from 'react'
 
 import Table from 'src/collections/Table/Table'
 import TableColumn from 'src/collections/Table/TableColumn'
-import sandbox from 'test/utils/Sandbox-util'
+import { sandbox } from 'test/utils'
 import * as common from 'test/specs/commonTests'
 
 describe('Table', () => {
diff --git a/test/specs/commonTests.js b/test/specs/commonTests.js
index a958512e61..54b123ad24 100644
--- a/test/specs/commonTests.js
+++ b/test/specs/commonTests.js
@@ -4,18 +4,25 @@ import path from 'path'
 import React, { createElement } from 'react'
 import ReactDOMServer from 'react-dom/server'
 
-import META from 'src/utils/Meta'
+import {
+  META,
+  numberToWord,
+  SUI,
+} from 'src/lib'
 import * as stardust from 'stardust'
-import * as sui from 'src/utils/semanticUtils'
-import numberToWord from 'src/utils/numberToWord'
-import * as consoleUtil from 'test/utils/consoleUtil'
-import sandbox from 'test/utils/Sandbox-util'
-import * as syntheticEvent from 'test/utils/syntheticEvent'
+import {
+  consoleUtil,
+  sandbox,
+  syntheticEvent,
+} from 'test/utils'
 
-import Icon from 'src/elements/Icon/Icon'
-import Image from 'src/elements/Image/Image'
+import { Icon, Image } from 'src/elements'
 
-const componentCtx = require.context('../../src/', true, /(addons|collections|elements|modules|views).*\.js$/)
+const componentCtx = require.context(
+  '../../src/',
+  true,
+  /(addons|collections|elements|modules|views).(?!index).*\.js/
+)
 
 const componentInfo = componentCtx.keys().map(key => {
   const Component = componentCtx(key).default
@@ -415,7 +422,7 @@ export const implementsColumnsProp = (Component, canEqual, requiredProps = {}) =
     _noClassNameFromBoolProps(Component, 'columns', requiredProps)
 
     it('adds numberToWord value to className', () => {
-      const propVal = _.sample(sui.widths)
+      const propVal = _.sample(SUI.widths)
 
       shallow(createElement(Component, { ...requiredProps, columns: propVal }))
         .should.have.className([numberToWord(propVal), 'column'].join(' '))
@@ -505,7 +512,7 @@ export const implementsNumberToWordProp = (Component, propKey, requiredProps = {
     _noClassNameFromBoolProps(Component, propKey, requiredProps)
 
     it('adds numberToWord value to className', () => {
-      const propVal = _.sample(sui.widths)
+      const propVal = _.sample(SUI.widths)
 
       shallow(createElement(Component, { ...requiredProps, [propKey]: propVal }))
         .should.have.className(numberToWord(propVal))
diff --git a/test/specs/elements/Button/Button-test.js b/test/specs/elements/Button/Button-test.js
index 0153fb1ccc..f25dd38646 100644
--- a/test/specs/elements/Button/Button-test.js
+++ b/test/specs/elements/Button/Button-test.js
@@ -2,7 +2,7 @@ import React from 'react'
 
 import Button from 'src/elements/Button/Button'
 import * as common from 'test/specs/commonTests'
-import sandbox from 'test/utils/Sandbox-util'
+import { sandbox } from 'test/utils'
 
 describe('Button', () => {
   common.isConformant(Button)
diff --git a/test/specs/elements/Label/Label-test.js b/test/specs/elements/Label/Label-test.js
index 76295051f6..33692b8b82 100644
--- a/test/specs/elements/Label/Label-test.js
+++ b/test/specs/elements/Label/Label-test.js
@@ -1,9 +1,10 @@
 import faker from 'faker'
 import React from 'react'
 
-import { Label, Image } from 'stardust'
-import * as common from '../../commonTests.js'
-import sandbox from '../../../utils/Sandbox-util.js'
+import * as common from 'test/specs/commonTests'
+import { sandbox } from 'test/utils'
+import Label from 'src/elements/Label/Label'
+import Image from 'src/elements/Image/Image'
 
 describe('Label Component', () => {
   common.isConformant(Label)
@@ -146,7 +147,8 @@ describe('Label Component', () => {
         .should.not.have.tagName('a')
     })
     it('renders label as an "a"', () => {
-      shallow(<Label onClick={() => {}} />)
+      shallow(<Label onClick={() => {
+      }} />)
         .should.have.tagName('a')
     })
     it('is called when label is clicked', () => {
@@ -169,7 +171,8 @@ describe('Label Component', () => {
     })
 
     it('adds a delete icon as last child', () => {
-      shallow(<Label onRemove={() => {}}><br /></Label>)
+      shallow(<Label onRemove={() => {
+      }}><br /></Label>)
         .children()
         .last()
         .should.match('.delete')
@@ -191,7 +194,8 @@ describe('Label Component', () => {
 
   describe('onDetailClick', () => {
     it('renders detail as an a tag', () => {
-      shallow(<Label detail={faker.hacker.noun()} onDetailClick={() => {}} />)
+      shallow(<Label detail={faker.hacker.noun()} onDetailClick={() => {
+      }} />)
         .should.have.descendants('a.detail')
     })
 
diff --git a/test/specs/elements/Step/Step-test.js b/test/specs/elements/Step/Step-test.js
index 1eca600a32..c0742bf3fd 100644
--- a/test/specs/elements/Step/Step-test.js
+++ b/test/specs/elements/Step/Step-test.js
@@ -2,7 +2,7 @@ import faker from 'faker'
 import React from 'react'
 
 import * as common from 'test/specs/commonTests'
-import sandbox from 'test/utils/Sandbox-util'
+import { sandbox } from 'test/utils'
 import Step from 'src/elements/Step/Step'
 import StepContent from 'src/elements/Step/StepContent'
 import StepDescription from 'src/elements/Step/StepDescription'
diff --git a/test/specs/utils/AutoControlledComponent-test.js b/test/specs/lib/AutoControlledComponent-test.js
similarity index 98%
rename from test/specs/utils/AutoControlledComponent-test.js
rename to test/specs/lib/AutoControlledComponent-test.js
index 5e3db2798e..86c02a7bb1 100644
--- a/test/specs/utils/AutoControlledComponent-test.js
+++ b/test/specs/lib/AutoControlledComponent-test.js
@@ -3,8 +3,8 @@ import faker from 'faker'
 import _ from 'lodash'
 import React from 'react'
 
-import AutoControlledComponent from 'src/utils/AutoControlledComponent'
-import * as consoleUtil from 'test/utils/consoleUtil.js'
+import { AutoControlledComponent } from 'src/lib'
+import { consoleUtil } from 'test/utils'
 
 let TestClass
 
diff --git a/test/specs/utils/getUnhandledProps-test.js b/test/specs/lib/getUnhandledProps-test.js
similarity index 96%
rename from test/specs/utils/getUnhandledProps-test.js
rename to test/specs/lib/getUnhandledProps-test.js
index bc59cb965d..c01182a677 100644
--- a/test/specs/utils/getUnhandledProps-test.js
+++ b/test/specs/lib/getUnhandledProps-test.js
@@ -1,6 +1,6 @@
 import React, { PropTypes } from 'react'
 
-import { getUnhandledProps } from 'src/utils/propUtils'
+import { getUnhandledProps } from 'src/lib'
 
 // We spread the unhandled props onto the rendered result.
 // Then, we can test the props of the rendered result.
diff --git a/test/specs/utils/keyboardKey-test.js b/test/specs/lib/keyboardKey-test.js
similarity index 90%
rename from test/specs/utils/keyboardKey-test.js
rename to test/specs/lib/keyboardKey-test.js
index b1e0f79ffc..01ee31fafb 100644
--- a/test/specs/utils/keyboardKey-test.js
+++ b/test/specs/lib/keyboardKey-test.js
@@ -1,6 +1,6 @@
 import _ from 'lodash'
 
-import keyboardKey, { codes } from '../../../src/utils/keyboardKey'
+import { keyboardKey } from 'src/lib'
 
 const _wrongReturn = (method, arg, ret) =>
   `keyboardKey.${method}(${arg}) should return key name "${ret}"\n`
@@ -14,7 +14,7 @@ const missingPair = (key, val) => (
 
 describe('keyboardKey', () => {
   it('has a key/value for every value/key in codes', () => {
-    _.each(codes, (name, code) => {
+    _.each(keyboardKey.codes, (name, code) => {
       if (Array.isArray(name)) {
         String(keyboardKey[name[0]]).should.equal(code, missingPair(name[0], code))
         String(keyboardKey[name[1]]).should.equal(code, missingPair(name[1], code))
@@ -32,7 +32,7 @@ describe('keyboardKey', () => {
       keyboardKey.getCode('Enter').should.equal(13, wrongCode('Enter', 13))
     })
     it('handles all key names in codes', () => {
-      _.each(codes, (name, code) => {
+      _.each(keyboardKey.codes, (name, code) => {
         const _code = Number(code)
 
         if (Array.isArray(name)) {
@@ -44,7 +44,7 @@ describe('keyboardKey', () => {
       })
     })
     it('handles event like objects with `key` prop', () => {
-      _.each(codes, (name, code) => {
+      _.each(keyboardKey.codes, (name, code) => {
         const _code = Number(code)
 
         if (Array.isArray(name)) {
@@ -68,7 +68,7 @@ describe('keyboardKey', () => {
       keyboardKey.getName(13).should.equal('Enter', wrongName(13, 'Enter'))
     })
     it('handles all codes', () => {
-      _.each(codes, (name, code) => {
+      _.each(keyboardKey.codes, (name, code) => {
         const keyName = keyboardKey.getName(code)
         if (Array.isArray(name)) {
           expect(keyName).to.equal(name[0], wrongName(code, name[0]))
@@ -78,7 +78,7 @@ describe('keyboardKey', () => {
       })
     })
     it('handles event like object: { keyCode: code, shiftKey: false }`', () => {
-      _.each(codes, (name, code) => {
+      _.each(keyboardKey.codes, (name, code) => {
         const keyName = keyboardKey.getName({ keyCode: code, shiftKey: false })
 
         if (Array.isArray(name)) {
@@ -89,7 +89,7 @@ describe('keyboardKey', () => {
       })
     })
     it('handles event like object: { keyCode: code, shiftKey: true }`', () => {
-      _.each(codes, (name, code) => {
+      _.each(keyboardKey.codes, (name, code) => {
         const keyName = keyboardKey.getName({ keyCode: code, shiftKey: true })
 
         if (Array.isArray(name)) {
@@ -100,7 +100,7 @@ describe('keyboardKey', () => {
       })
     })
     it('handles event like object: { which: code, shiftKey: false }', () => {
-      _.each(codes, (name, code) => {
+      _.each(keyboardKey.codes, (name, code) => {
         const keyName = keyboardKey.getName({ which: code, shiftKey: false })
 
         if (Array.isArray(name)) {
@@ -111,7 +111,7 @@ describe('keyboardKey', () => {
       })
     })
     it('handles event like object: { which: code, shiftKey: true }', () => {
-      _.each(codes, (name, code) => {
+      _.each(keyboardKey.codes, (name, code) => {
         const keyName = keyboardKey.getName({ which: code, shiftKey: true })
 
         if (Array.isArray(name)) {
diff --git a/test/specs/utils/numberToWord-test.js b/test/specs/lib/numberToWord-test.js
similarity index 89%
rename from test/specs/utils/numberToWord-test.js
rename to test/specs/lib/numberToWord-test.js
index 5846606707..62a56ea023 100644
--- a/test/specs/utils/numberToWord-test.js
+++ b/test/specs/lib/numberToWord-test.js
@@ -1,5 +1,5 @@
 import _ from 'lodash'
-import numberToWord from '../../../src/utils/numberToWord'
+import { numberToWord } from 'src/lib'
 
 const words = [
   'one',
diff --git a/test/specs/utils/utils-test.js b/test/specs/lib/objectDiff-test.js
similarity index 90%
rename from test/specs/utils/utils-test.js
rename to test/specs/lib/objectDiff-test.js
index 70f839ea32..f5715b1fbb 100644
--- a/test/specs/utils/utils-test.js
+++ b/test/specs/lib/objectDiff-test.js
@@ -1,6 +1,6 @@
 import _ from 'lodash'
 
-import * as utils from '../../../src/utils/utils'
+import { objectDiff } from 'src/lib'
 
 describe('objectDiff', () => {
   let a
@@ -17,7 +17,7 @@ describe('objectDiff', () => {
     }))
   })
 
-  const assertDiff = (diff) => utils.objectDiff(a, b).should.deep.equal(diff)
+  const assertDiff = (diff) => objectDiff(a, b).should.deep.equal(diff)
 
   it('picks up undefined values', () => {
     b.nil = undefined
diff --git a/test/specs/modules/Accordion/Accordion-test.js b/test/specs/modules/Accordion/Accordion-test.js
index a166031ebc..2183aca7a8 100644
--- a/test/specs/modules/Accordion/Accordion-test.js
+++ b/test/specs/modules/Accordion/Accordion-test.js
@@ -5,7 +5,7 @@ import Accordion from 'src/modules/Accordion/Accordion'
 import AccordionContent from 'src/modules/Accordion/AccordionContent'
 import AccordionTitle from 'src/modules/Accordion/AccordionTitle'
 import * as common from 'test/specs/commonTests'
-import sandbox from 'test/utils/Sandbox-util'
+import { sandbox } from 'test/utils'
 
 describe('Accordion', () => {
   common.isConformant(Accordion)
diff --git a/test/specs/modules/Accordion/AccordionTitle-test.js b/test/specs/modules/Accordion/AccordionTitle-test.js
index 0663f25975..33c7147706 100644
--- a/test/specs/modules/Accordion/AccordionTitle-test.js
+++ b/test/specs/modules/Accordion/AccordionTitle-test.js
@@ -1,6 +1,6 @@
 import React from 'react'
 import * as common from 'test/specs/commonTests'
-import sandbox from 'test/utils/Sandbox-util'
+import { sandbox } from 'test/utils'
 
 import Accordion from 'src/modules/Accordion/Accordion'
 import AccordionTitle from 'src/modules/Accordion/AccordionTitle'
diff --git a/test/specs/modules/Checkbox/Checkbox-test.js b/test/specs/modules/Checkbox/Checkbox-test.js
index d2ceda1ed0..ffd7dccc10 100644
--- a/test/specs/modules/Checkbox/Checkbox-test.js
+++ b/test/specs/modules/Checkbox/Checkbox-test.js
@@ -3,7 +3,7 @@ import React from 'react'
 
 import Checkbox from 'src/modules/Checkbox/Checkbox'
 import * as common from 'test/specs/commonTests'
-import sandbox from 'test/utils/Sandbox-util'
+import { sandbox } from 'test/utils'
 
 describe('Checkbox', () => {
   common.isConformant(Checkbox)
diff --git a/test/specs/modules/Dropdown/Dropdown-test.js b/test/specs/modules/Dropdown/Dropdown-test.js
index e3faedc1b3..68642621f2 100644
--- a/test/specs/modules/Dropdown/Dropdown-test.js
+++ b/test/specs/modules/Dropdown/Dropdown-test.js
@@ -3,9 +3,8 @@ import _ from 'lodash'
 import React from 'react'
 
 import Dropdown from 'src/modules/Dropdown/Dropdown'
-import * as domEvent from 'test/utils/domEvent'
 import * as common from 'test/specs/commonTests'
-import sandbox from 'test/utils/Sandbox-util'
+import { domEvent, sandbox } from 'test/utils'
 
 let attachTo
 let options
diff --git a/test/specs/modules/Rating/Rating-test.js b/test/specs/modules/Rating/Rating-test.js
index d6dba68e10..9ad4b3f88b 100644
--- a/test/specs/modules/Rating/Rating-test.js
+++ b/test/specs/modules/Rating/Rating-test.js
@@ -3,7 +3,7 @@ import React from 'react'
 
 import Rating from 'src/modules/Rating/Rating'
 import * as common from 'test/specs/commonTests'
-import sandbox from 'test/utils/Sandbox-util'
+import { sandbox } from 'test/utils'
 
 describe('Rating', () => {
   common.isConformant(Rating)
diff --git a/test/tests.bundle.js b/test/tests.bundle.js
index cb9ef4d44a..f6ecb3c4b2 100644
--- a/test/tests.bundle.js
+++ b/test/tests.bundle.js
@@ -1,15 +1,4 @@
-// setup
-const setupContext = require.context('./', true, /setup\.js$/)
-setupContext.keys().forEach(setupContext)
+import './setup'
 
-// utils
-const utilsContext = require.context('./utils', true, /-util\.js/)
-utilsContext.keys().forEach(utilsContext)
-
-// tests
 const testsContext = require.context('./', true, /-test\.js$/)
 testsContext.keys().forEach(testsContext)
-
-// src
-const srcContext = require.context('../src', true, /\.js$/)
-srcContext.keys().forEach(srcContext)
diff --git a/test/utils/consoleUtil.js b/test/utils/consoleUtil.js
index 0b848bcdd7..e0a629a5ec 100644
--- a/test/utils/consoleUtil.js
+++ b/test/utils/consoleUtil.js
@@ -9,18 +9,18 @@ let isDisabledOnce
  * Enable console logging.
  * @returns {Object} console
  */
-export const enable = () => Object.assign(console, original)
+const enable = () => Object.assign(console, original)
 
 /**
  * Disable console logging.
  * @returns {Object} console
  */
-export const disable = () => Object.assign(console, disabled)
+const disable = () => Object.assign(console, disabled)
 
 /**
  * Silence the console for a single test.  It will be re-enabled after it().
  */
-export const disableOnce = () => {
+const disableOnce = () => {
   isDisabledOnce = true
   disable()
 }
@@ -31,3 +31,9 @@ afterEach(() => {
     enable()
   }
 })
+
+export default {
+  enable,
+  disable,
+  disableOnce,
+}
diff --git a/test/utils/domEvent.js b/test/utils/domEvent.js
index 171bdfa3f3..a42b69cb30 100644
--- a/test/utils/domEvent.js
+++ b/test/utils/domEvent.js
@@ -33,3 +33,9 @@ export const keyDown = (node, data) => fire(node, 'keydown', data)
  * @returns {Object} The event
  */
 export const click = (node, data) => fire(node, 'click', data)
+
+export default {
+  fire,
+  keyDown,
+  click,
+}
diff --git a/test/utils/index.js b/test/utils/index.js
new file mode 100644
index 0000000000..668ed0f5f9
--- /dev/null
+++ b/test/utils/index.js
@@ -0,0 +1,4 @@
+export { default as consoleUtil } from './consoleUtil'
+export { default as domEvent } from './domEvent'
+export { default as sandbox } from './sandbox'
+export { default as syntheticEvent } from './syntheticEvent'
diff --git a/test/utils/Sandbox-util.js b/test/utils/sandbox.js
similarity index 100%
rename from test/utils/Sandbox-util.js
rename to test/utils/sandbox.js
diff --git a/test/utils/syntheticEvent.js b/test/utils/syntheticEvent.js
index a8beae2c19..6941457c61 100644
--- a/test/utils/syntheticEvent.js
+++ b/test/utils/syntheticEvent.js
@@ -185,3 +185,8 @@ export const hasShape = (event, type) => {
   const shape = typeof type === 'string' ? types[type].shape : type
   return Object.keys(event).every(key => key in shape)
 }
+
+export default {
+  types,
+  hasShape,
+}
diff --git a/webpack.config.js b/webpack.config.js
index 6d626708e1..d5d745a9a5 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -5,7 +5,7 @@ const _ = require('lodash')
 const { argv } = require('yargs')
 
 const { paths } = config
-const { __DEV__, __TEST__, __PROD__ } = config.compiler_globals
+const { __DEV__, __TEST__ } = config.compiler_globals
 
 const webpackConfig = {
   name: 'client',
@@ -84,7 +84,6 @@ webpackConfig.plugins = [
       jquery: require('jquery/package.json').version,
       lodash: require('lodash/package.json').version,
     },
-    base: __PROD__ ? '/stardust/' : '/',
   }),
 ]