fixup! Add showAllEvents Calendar Prop

src/DateContentRow.js

@@ -9,6 +9,8 @@ import * as dates from './utils/dates'
 import BackgroundCells from './BackgroundCells'
 import EventRow from './EventRow'
 import EventEndingRow from './EventEndingRow'
+import NoopWrapper from './NoopWrapper'
+import ScrollableWeekWrapper from './ScrollableWeekWrapper'
 import * as DateSlotMetrics from './utils/DateSlotMetrics'
 
 class DateContentRow extends React.Component {
@@ -131,6 +133,9 @@ class DateContentRow extends React.Component {
     let metrics = this.slotMetrics(this.props)
     let { levels, extra } = metrics
 
+    let ScrollableWeekComponent = showAllEvents
+      ? ScrollableWeekWrapper
+      : NoopWrapper
     let WeekWrapper = components.weekWrapper
 
     const eventRowProps = {
@@ -176,11 +181,7 @@ class DateContentRow extends React.Component {
               {range.map(this.renderHeadingCell)}
             </div>
           )}
-          <div
-            className={clsx(
-              showAllEvents && 'rbc-row-content-scroll-container'
-            )}
-          >
+          <ScrollableWeekComponent>
             <WeekWrapper isAllDay={isAllDay} {...eventRowProps}>
               {levels.map((segs, idx) => (
                 <EventRow key={idx} segments={segs} {...eventRowProps} />
@@ -193,7 +194,7 @@ class DateContentRow extends React.Component {
                 />
               )}
             </WeekWrapper>
-          </div>
+          </ScrollableWeekComponent>
         </div>
       </div>
     )

src/ScrollableWeekWrapper.js

@@ -0,0 +1,7 @@
+import React from 'react'
+
+const ScrollableWeekWrapper = ({ children }) => {
+  return <div className="rbc-row-content-scroll-container">{children}</div>
+}
+
+export default ScrollableWeekWrapper

src/less/styles.less

@@ -87,7 +87,16 @@
   height: 100%;
 
   .rbc-row-content-scroll-container {
+    height: 100%;
     overflow-y: scroll;
+
+    /* Hide scrollbar for Chrome, Safari and Opera */
+    &::-webkit-scrollbar {
+      display: none;
+    }
+
+    -ms-overflow-style: none;  /* IE and Edge */
+    scrollbar-width: none;  /* Firefox */
   }
 }
 

src/sass/styles.scss

@@ -86,7 +86,16 @@
   height: 100%;
 
   .rbc-row-content-scroll-container {
+    height: 100%;
     overflow-y: scroll;
+
+    /* Hide scrollbar for Chrome, Safari and Opera */
+    &::-webkit-scrollbar {
+      display: none;
+    }
+
+    -ms-overflow-style: none;  /* IE and Edge */
+    scrollbar-width: none;  /* Firefox */
   }
 }
 
@@ -98,4 +107,4 @@
 @import './event';
 @import './month';
 @import './agenda';
-@import './time-grid';
+@import './time-grid';