DST fixes and Slot abstraction (#733)

jquense · Mar 23, 2018 · 6bced68 · 6bced68
1 parent 79b1ee0
commit 6bced68
Show file tree

Hide file tree

Showing 31 changed files with 977 additions and 949 deletions.
diff --git a/examples/bundle.js b/examples/bundle.js
diff --git a/src/Agenda.js b/src/Agenda.js
@@ -63,7 +63,7 @@ class Agenda extends React.Component {
 
     return (
       <div className="rbc-agenda-view">
-        <table ref="header">
+        <table ref="header" className="rbc-agenda-table">
           <thead>
             <tr>
               <th className="rbc-header" ref="dateCol">
@@ -77,7 +77,7 @@ class Agenda extends React.Component {
           </thead>
         </table>
         <div className="rbc-agenda-content" ref="content">
-          <table>
+          <table className="rbc-agenda-table">
             <tbody ref="tbody">
               {range.map((day, idx) => this.renderDay(day, events, idx))}
             </tbody>
@@ -223,9 +223,9 @@ class Agenda extends React.Component {
 }
 
 Agenda.range = (start, { length = Agenda.defaultProps.length }) => {
-  let end = dates.add(start, length, 'day');
-  return { start, end };
-};
+  let end = dates.add(start, length, 'day')
+  return { start, end }
+}
 
 Agenda.navigate = (date, action, { length = Agenda.defaultProps.length }) => {
   switch (action) {

diff --git a/src/BackgroundCells.js b/src/BackgroundCells.js
@@ -4,7 +4,6 @@ import { findDOMNode } from 'react-dom'
 import cn from 'classnames'
 
 import dates from './utils/dates'
-import { segStyle } from './utils/eventLevels'
 import { notify } from './utils/helpers'
 import { elementType } from './utils/propTypes'
 import {
@@ -72,15 +71,13 @@ class BackgroundCells extends React.Component {
       <div className="rbc-row-bg">
         {range.map((date, index) => {
           let selected = selecting && index >= startIdx && index <= endIdx
-          const { className, style: dayStyles } =
+          const { className, style } =
             (dayPropGetter && dayPropGetter(date)) || {}
-          const segmStyles = segStyle(1, range.length)
-          const styles = Object.assign({}, dayStyles, segmStyles)
 
           return (
             <Wrapper key={index} value={date} range={range}>
               <div
-                style={styles}
+                style={style}
                 className={cn(
                   'rbc-day-bg',
                   className,

diff --git a/src/Calendar.js b/src/Calendar.js
@@ -9,7 +9,7 @@ import {
   dateRangeFormat,
   views as componentViews,
 } from './utils/propTypes'
-import warning from 'warning';
+import warning from 'warning'
 
 import { notify } from './utils/helpers'
 import { navigate, views } from './utils/constants'
@@ -790,9 +790,7 @@ class Calendar extends React.Component {
     return (
       <div
         {...elementProps}
-        className={cn('rbc-calendar', className, {
-          'rbc-rtl': props.rtl,
-        })}
+        className={cn(className, 'rbc-calendar', props.rtl && 'rbc-is-rtl')}
         style={style}
       >
         {toolbar && (
@@ -832,11 +830,10 @@ class Calendar extends React.Component {
 
   handleRangeChange = (date, view) => {
     let { onRangeChange } = this.props
-    if(onRangeChange) {
-      if(view.range) {
+    if (onRangeChange) {
+      if (view.range) {
         onRangeChange(view.range(date, {}))
-      }
-      else {
+      } else {
         warning(true, 'onRangeChange prop not supported for this view')
       }
     }
@@ -855,16 +852,16 @@ class Calendar extends React.Component {
 
     onNavigate(date, view, action)
     this.handleRangeChange(date, ViewComponent)
-  };
+  }
 
   handleViewChange = view => {
     if (view !== this.props.view && isValidView(view, this.props)) {
       this.props.onView(view)
     }
 
-    let views = this.getViews();
+    let views = this.getViews()
     this.handleRangeChange(this.props.date, views[view])
-  };
+  }
 
   handleSelectEvent = (...args) => {
     notify(this.props.onSelectEvent, args)

diff --git a/src/DateContentRow.js b/src/DateContentRow.js
@@ -7,12 +7,7 @@ import { findDOMNode } from 'react-dom'
 
 import dates from './utils/dates'
 import { accessor, elementType } from './utils/propTypes'
-import {
-  segStyle,
-  eventSegments,
-  endOfRange,
-  eventLevels,
-} from './utils/eventLevels'
+import { eventSegments, endOfRange, eventLevels } from './utils/eventLevels'
 import BackgroundCells from './BackgroundCells'
 import EventRow from './EventRow'
 import EventEndingRow from './EventEndingRow'
@@ -43,9 +38,9 @@ const propTypes = {
   startAccessor: accessor.isRequired,
   endAccessor: accessor.isRequired,
 
-  dateCellWrapper: elementType,
   eventComponent: elementType,
   eventWrapperComponent: elementType.isRequired,
+  dateCellWrapperComponent: elementType,
   minRows: PropTypes.number.isRequired,
   maxRows: PropTypes.number.isRequired,
 }
@@ -56,10 +51,6 @@ const defaultProps = {
 }
 
 class DateContentRow extends React.Component {
-  constructor(...args) {
-    super(...args)
-  }
-
   handleSelectSlot = slot => {
     const { range, onSelectSlot } = this.props
 
@@ -102,12 +93,11 @@ class DateContentRow extends React.Component {
   }
 
   renderHeadingCell = (date, index) => {
-    let { renderHeader, range, getNow } = this.props
+    let { renderHeader, getNow } = this.props
 
     return renderHeader({
       date,
       key: `header_${index}`,
-      style: segStyle(1, range.length),
       className: cn(
         'rbc-date-cell',
         dates.eq(date, getNow(), 'day') && 'rbc-now'
@@ -126,7 +116,7 @@ class DateContentRow extends React.Component {
             </div>
           )}
           <div className="rbc-row" ref={this.createEventRef}>
-            <div className="rbc-row-segment" style={segStyle(1, range.length)}>
+            <div className="rbc-row-segment">
               <div className="rbc-event">
                 <div className="rbc-event-content">&nbsp;</div>
               </div>
@@ -153,7 +143,7 @@ class DateContentRow extends React.Component {
       renderHeader,
       minRows,
       maxRows,
-      dateCellWrapper,
+      dateCellWrapperComponent,
       eventComponent,
       eventWrapperComponent,
       onSelectStart,
@@ -195,7 +185,7 @@ class DateContentRow extends React.Component {
           onSelectStart={onSelectStart}
           onSelectEnd={onSelectEnd}
           onSelectSlot={this.handleSelectSlot}
-          cellWrapperComponent={dateCellWrapper}
+          cellWrapperComponent={dateCellWrapperComponent}
           longPressThreshold={longPressThreshold}
         />
 

diff --git a/src/Day.js b/src/Day.js
@@ -12,25 +12,19 @@ class Day extends React.Component {
   }
 
   render() {
-    let { date, ...props } = this.props;
-    let range = Day.range(date);
-
-    return (
-      <TimeGrid
-        {...props}
-        range={range}
-        eventOffset={10}
-      />
-    );
+    let { date, ...props } = this.props
+    let range = Day.range(date)
+
+    return <TimeGrid {...props} range={range} eventOffset={10} />
   }
 }
 
-Day.range = (date) => {
+Day.range = date => {
   return [dates.startOf(date, 'day')]
 }
 
-Day.navigate = (date, action)=>{
-  switch (action){
+Day.navigate = (date, action) => {
+  switch (action) {
     case navigate.PREVIOUS:
       return dates.add(date, -1, 'day')