feat(Breakpoint): add component

index.d.ts

@@ -1,4 +1,10 @@
 // Addons
+export {
+  default as Breakpoint,
+  BreakpointPoints,
+  BreakpointProps,
+  BreakpointOnUpdateData
+} from './dist/commonjs/addons/Breakpoint';
 export { default as Confirm, ConfirmProps } from './dist/commonjs/addons/Confirm';
 export { default as Portal, PortalProps } from './dist/commonjs/addons/Portal';
 export { default as Radio, RadioProps } from './dist/commonjs/addons/Radio';

package.json

@@ -130,7 +130,7 @@
     "satisfied": "^1.1.0",
     "semantic-ui-css": "^2.2.11",
     "simulant": "^0.2.2",
-    "sinon": "^2.1.0",
+    "sinon": "^2.3.8",
     "sinon-chai": "^2.11.0",
     "ta-scripts": "^2.5.2",
     "through2": "^2.0.2",

src/addons/Breakpoint/Breakpoint.js

@@ -114,7 +114,7 @@ export default class Breakpoint extends Component {
   // ----------------------------------------
 
   visible = () => {
-    const { only } = this.props
+    const { only = '' } = this.props
     const points = only.replace('large screen', 'largeScreen').split(' ')
 
     return _.some(points, point => _.invoke(this, point))
@@ -147,5 +147,3 @@ export default class Breakpoint extends Component {
     return null
   }
 }
-
-

src/addons/Breakpoint/index.d.ts

@@ -1 +1 @@
-export { default, BreakpointPoints, BreakpointProps } from './Breakpoint';
+export { default, BreakpointPoints, BreakpointProps, BreakpointOnUpdateData } from './Breakpoint';

src/lib/customPropTypes.js

@@ -241,7 +241,7 @@ export const demand = (requiredProps) => {
  * @param {string[]} possible An array of possible values to prop.
  */
 export const onlyProp = possible => {
-  return (props, propName, componentName) => {
+  const typeChecker = (required, props, propName, componentName) => {
     if (!Array.isArray(possible)) {
       throw new Error([
         'Invalid argument supplied to some, expected an instance of array.',
@@ -252,7 +252,10 @@ export const onlyProp = possible => {
     const propValue = props[propName]
 
     // skip if prop is undefined
-    if (_.isNil(propValue) || propValue === false) return
+    if (_.isNil(propValue) || propValue === false) {
+      if (required) throw new Error(`Required \`${propName}\` prop was not specified in \`${componentName}\`.`)
+      return
+    }
 
     const values = propValue
       .replace('large screen', 'large-screen')
@@ -265,6 +268,11 @@ export const onlyProp = possible => {
       return new Error(`\`${propName}\` prop in \`${componentName}\` has invalid values: \`${invalid.join('`, `')}\`.`)
     }
   }
+
+  const chainedCheckType = typeChecker.bind(null, false)
+  chainedCheckType.isRequired = typeChecker.bind(null, true)
+
+  return chainedCheckType
 }
 
 /**

test/specs/addons/Breakpoint/Breakpoint-test.js

@@ -8,11 +8,11 @@ import { domEvent, sandbox } from 'test/utils'
 const { points } = Breakpoint.defaultProps
 const requiredProps = { only: 'mobile' }
 
-beforeEach(() => {
-  sandbox.stub(window, 'innerWidth').value(points.mobile)
-})
-
 describe('Breakpoint', () => {
+  beforeEach(() => {
+    sandbox.stub(window, 'innerWidth').value(points.mobile)
+  })
+
   common.isConformant(Breakpoint, { requiredProps })
   common.rendersChildren(Breakpoint, { requiredProps })