feat: remove propTypes in production (#1180)

This saves ~7kB

.babelrc

@@ -1,5 +1,8 @@
 {
   "presets": ["jason"],
+  plugins: [
+    ['transform-react-remove-prop-types', { mode: 'wrap' }],
+  ],
   "env": {
     "esm": {
       "presets": [

.size-snapshot.json

@@ -1,12 +1,12 @@
 {
   "./dist/react-big-calendar.js": {
-    "bundled": 470107,
-    "minified": 152579,
-    "gzipped": 42233
+    "bundled": 469894,
+    "minified": 152522,
+    "gzipped": 42174
   },
   "./dist/react-big-calendar.min.js": {
-    "bundled": 439313,
-    "minified": 142681,
-    "gzipped": 39554
+    "bundled": 412865,
+    "minified": 135555,
+    "gzipped": 38300
   }
 }

package.json

@@ -72,6 +72,7 @@
     "babel-core": "^7.0.0-bridge.0",
     "babel-eslint": "^10.0.1",
     "babel-jest": "^23.6.0",
+    "babel-plugin-transform-react-remove-prop-types": "^0.4.22",
     "babel-preset-jason": "^6.0.1",
     "bootstrap": "^3.3.5",
     "component-metadata-loader": "^4.0.0",

src/Agenda.js

@@ -10,23 +10,6 @@ import { inRange } from './utils/eventLevels'
 import { isSelected } from './utils/selection'
 
 class Agenda extends React.Component {
-  static propTypes = {
-    events: PropTypes.array,
-    date: PropTypes.instanceOf(Date),
-    length: PropTypes.number.isRequired,
-
-    selected: PropTypes.object,
-
-    accessors: PropTypes.object.isRequired,
-    components: PropTypes.object.isRequired,
-    getters: PropTypes.object.isRequired,
-    localizer: PropTypes.object.isRequired,
-  }
-
-  static defaultProps = {
-    length: 30,
-  }
-
   componentDidMount() {
     this._adjustHeader()
   }
@@ -200,6 +183,23 @@ class Agenda extends React.Component {
   }
 }
 
+Agenda.propTypes = {
+  events: PropTypes.array,
+  date: PropTypes.instanceOf(Date),
+  length: PropTypes.number.isRequired,
+
+  selected: PropTypes.object,
+
+  accessors: PropTypes.object.isRequired,
+  components: PropTypes.object.isRequired,
+  getters: PropTypes.object.isRequired,
+  localizer: PropTypes.object.isRequired,
+}
+
+Agenda.defaultProps = {
+  length: 30,
+}
+
 Agenda.range = (start, { length = Agenda.defaultProps.length }) => {
   let end = dates.add(start, length, 'day')
   return { start, end }

src/BackgroundCells.js

@@ -9,27 +9,6 @@ import { dateCellSelection, getSlotAtX, pointInBox } from './utils/selection'
 import Selection, { getBoundsForNode, isEvent } from './Selection'
 
 class BackgroundCells extends React.Component {
-  static propTypes = {
-    date: PropTypes.instanceOf(Date),
-    getNow: PropTypes.func.isRequired,
-
-    getters: PropTypes.object.isRequired,
-    components: PropTypes.object.isRequired,
-
-    container: PropTypes.func,
-    dayPropGetter: PropTypes.func,
-    selectable: PropTypes.oneOf([true, false, 'ignoreEvents']),
-    longPressThreshold: PropTypes.number,
-
-    onSelectSlot: PropTypes.func.isRequired,
-    onSelectEnd: PropTypes.func,
-    onSelectStart: PropTypes.func,
-
-    range: PropTypes.arrayOf(PropTypes.instanceOf(Date)),
-    rtl: PropTypes.bool,
-    type: PropTypes.string,
-  }
-
   constructor(props, context) {
     super(props, context)
 
@@ -185,4 +164,25 @@ class BackgroundCells extends React.Component {
   }
 }
 
+BackgroundCells.propTypes = {
+  date: PropTypes.instanceOf(Date),
+  getNow: PropTypes.func.isRequired,
+
+  getters: PropTypes.object.isRequired,
+  components: PropTypes.object.isRequired,
+
+  container: PropTypes.func,
+  dayPropGetter: PropTypes.func,
+  selectable: PropTypes.oneOf([true, false, 'ignoreEvents']),
+  longPressThreshold: PropTypes.number,
+
+  onSelectSlot: PropTypes.func.isRequired,
+  onSelectEnd: PropTypes.func,
+  onSelectStart: PropTypes.func,
+
+  range: PropTypes.arrayOf(PropTypes.instanceOf(Date)),
+  rtl: PropTypes.bool,
+  type: PropTypes.string,
+}
+
 export default BackgroundCells

src/Calendar.js

@@ -952,7 +952,11 @@ class Calendar extends React.Component {
     }
 
     let views = this.getViews()
-    this.handleRangeChange(this.props.date || this.props.getNow(), views[view], view)
+    this.handleRangeChange(
+      this.props.date || this.props.getNow(),
+      views[view],
+      view
+    )
   }
 
   handleSelectEvent = (...args) => {

src/DateContentRow.js

@@ -11,46 +11,6 @@ import EventRow from './EventRow'
 import EventEndingRow from './EventEndingRow'
 import * as DateSlotMetrics from './utils/DateSlotMetrics'
 
-const propTypes = {
-  date: PropTypes.instanceOf(Date),
-  events: PropTypes.array.isRequired,
-  range: PropTypes.array.isRequired,
-
-  rtl: PropTypes.bool,
-  resourceId: PropTypes.any,
-  renderForMeasure: PropTypes.bool,
-  renderHeader: PropTypes.func,
-
-  container: PropTypes.func,
-  selected: PropTypes.object,
-  selectable: PropTypes.oneOf([true, false, 'ignoreEvents']),
-  longPressThreshold: PropTypes.number,
-
-  onShowMore: PropTypes.func,
-  onSelectSlot: PropTypes.func,
-  onSelect: PropTypes.func,
-  onSelectEnd: PropTypes.func,
-  onSelectStart: PropTypes.func,
-  onDoubleClick: PropTypes.func,
-  dayPropGetter: PropTypes.func,
-
-  getNow: PropTypes.func.isRequired,
-  isAllDay: PropTypes.bool,
-
-  accessors: PropTypes.object.isRequired,
-  components: PropTypes.object.isRequired,
-  getters: PropTypes.object.isRequired,
-  localizer: PropTypes.object.isRequired,
-
-  minRows: PropTypes.number.isRequired,
-  maxRows: PropTypes.number.isRequired,
-}
-
-const defaultProps = {
-  minRows: 0,
-  maxRows: Infinity,
-}
-
 class DateContentRow extends React.Component {
   constructor(...args) {
     super(...args)
@@ -218,7 +178,44 @@ class DateContentRow extends React.Component {
   }
 }
 
-DateContentRow.propTypes = propTypes
-DateContentRow.defaultProps = defaultProps
+DateContentRow.propTypes = {
+  date: PropTypes.instanceOf(Date),
+  events: PropTypes.array.isRequired,
+  range: PropTypes.array.isRequired,
+
+  rtl: PropTypes.bool,
+  resourceId: PropTypes.any,
+  renderForMeasure: PropTypes.bool,
+  renderHeader: PropTypes.func,
+
+  container: PropTypes.func,
+  selected: PropTypes.object,
+  selectable: PropTypes.oneOf([true, false, 'ignoreEvents']),
+  longPressThreshold: PropTypes.number,
+
+  onShowMore: PropTypes.func,
+  onSelectSlot: PropTypes.func,
+  onSelect: PropTypes.func,
+  onSelectEnd: PropTypes.func,
+  onSelectStart: PropTypes.func,
+  onDoubleClick: PropTypes.func,
+  dayPropGetter: PropTypes.func,
+
+  getNow: PropTypes.func.isRequired,
+  isAllDay: PropTypes.bool,
+
+  accessors: PropTypes.object.isRequired,
+  components: PropTypes.object.isRequired,
+  getters: PropTypes.object.isRequired,
+  localizer: PropTypes.object.isRequired,
+
+  minRows: PropTypes.number.isRequired,
+  maxRows: PropTypes.number.isRequired,
+}
+
+DateContentRow.defaultProps = {
+  minRows: 0,
+  maxRows: Infinity,
+}
 
 export default DateContentRow

src/Day.js

@@ -6,10 +6,6 @@ import { navigate } from './utils/constants'
 import TimeGrid from './TimeGrid'
 
 class Day extends React.Component {
-  static propTypes = {
-    date: PropTypes.instanceOf(Date).isRequired,
-  }
-
   render() {
     let { date, ...props } = this.props
     let range = Day.range(date)
@@ -18,6 +14,10 @@ class Day extends React.Component {
   }
 }
 
+Day.propTypes = {
+  date: PropTypes.instanceOf(Date).isRequired,
+}
+
 Day.range = date => {
   return [dates.startOf(date, 'day')]
 }

src/DayColumn.js

@@ -14,46 +14,6 @@ import TimeSlotGroup from './TimeSlotGroup'
 import TimeGridEvent from './TimeGridEvent'
 
 class DayColumn extends React.Component {
-  static propTypes = {
-    events: PropTypes.array.isRequired,
-    step: PropTypes.number.isRequired,
-    date: PropTypes.instanceOf(Date).isRequired,
-    min: PropTypes.instanceOf(Date).isRequired,
-    max: PropTypes.instanceOf(Date).isRequired,
-    getNow: PropTypes.func.isRequired,
-    isNow: PropTypes.bool,
-
-    rtl: PropTypes.bool,
-
-    accessors: PropTypes.object.isRequired,
-    components: PropTypes.object.isRequired,
-    getters: PropTypes.object.isRequired,
-    localizer: PropTypes.object.isRequired,
-
-    showMultiDayTimes: PropTypes.bool,
-    culture: PropTypes.string,
-    timeslots: PropTypes.number,
-
-    selected: PropTypes.object,
-    selectable: PropTypes.oneOf([true, false, 'ignoreEvents']),
-    eventOffset: PropTypes.number,
-    longPressThreshold: PropTypes.number,
-
-    onSelecting: PropTypes.func,
-    onSelectSlot: PropTypes.func.isRequired,
-    onSelectEvent: PropTypes.func.isRequired,
-    onDoubleClickEvent: PropTypes.func.isRequired,
-
-    className: PropTypes.string,
-    dragThroughEvents: PropTypes.bool,
-    resource: PropTypes.any,
-  }
-
-  static defaultProps = {
-    dragThroughEvents: true,
-    timeslots: 2,
-  }
-
   state = { selecting: false, timeIndicatorPosition: null }
 
   constructor(...args) {
@@ -390,4 +350,44 @@ class DayColumn extends React.Component {
   }
 }
 
+DayColumn.propTypes = {
+  events: PropTypes.array.isRequired,
+  step: PropTypes.number.isRequired,
+  date: PropTypes.instanceOf(Date).isRequired,
+  min: PropTypes.instanceOf(Date).isRequired,
+  max: PropTypes.instanceOf(Date).isRequired,
+  getNow: PropTypes.func.isRequired,
+  isNow: PropTypes.bool,
+
+  rtl: PropTypes.bool,
+
+  accessors: PropTypes.object.isRequired,
+  components: PropTypes.object.isRequired,
+  getters: PropTypes.object.isRequired,
+  localizer: PropTypes.object.isRequired,
+
+  showMultiDayTimes: PropTypes.bool,
+  culture: PropTypes.string,
+  timeslots: PropTypes.number,
+
+  selected: PropTypes.object,
+  selectable: PropTypes.oneOf([true, false, 'ignoreEvents']),
+  eventOffset: PropTypes.number,
+  longPressThreshold: PropTypes.number,
+
+  onSelecting: PropTypes.func,
+  onSelectSlot: PropTypes.func.isRequired,
+  onSelectEvent: PropTypes.func.isRequired,
+  onDoubleClickEvent: PropTypes.func.isRequired,
+
+  className: PropTypes.string,
+  dragThroughEvents: PropTypes.bool,
+  resource: PropTypes.any,
+}
+
+DayColumn.defaultProps = {
+  dragThroughEvents: true,
+  timeslots: 2,
+}
+
 export default DayColumn