Enable mouse events on all demos (#626)

oliviertassinari · Feb 13, 2021 · d2a360b · d2a360b
1 parent 904d738
commit d2a360b
Show file tree

Hide file tree

Showing 14 changed files with 15 additions and 13 deletions.
diff --git a/docs/src/pages/demos/DemoAnimateHeight.js b/docs/src/pages/demos/DemoAnimateHeight.js
@@ -67,7 +67,7 @@ Slide4.contextTypes = {
 
 function DemoAnimateHeight() {
   return (
-    <SwipeableViews animateHeight>
+    <SwipeableViews animateHeight enableMouseEvents>
       <div style={Object.assign({}, styles.slide, styles.slide1)}>{list.slice(0, 10)}</div>
       <div style={Object.assign({}, styles.slide, styles.slide2)}>
         {'This slide has a max-height limit:'}

diff --git a/docs/src/pages/demos/DemoAutoPlay.js b/docs/src/pages/demos/DemoAutoPlay.js
@@ -41,7 +41,7 @@ class DemoAutoPlay extends React.Component {
 
     return (
       <div style={styles.root}>
-        <AutoPlaySwipeableViews index={index} onChangeIndex={this.handleChangeIndex}>
+        <AutoPlaySwipeableViews index={index} onChangeIndex={this.handleChangeIndex} enableMouseEvents>
           <div style={Object.assign({}, styles.slide, styles.slide1)}>slide n°1</div>
           <div style={Object.assign({}, styles.slide, styles.slide2)}>slide n°2</div>
           <div style={Object.assign({}, styles.slide, styles.slide3)}>slide n°3</div>

diff --git a/docs/src/pages/demos/DemoAxis.js b/docs/src/pages/demos/DemoAxis.js
@@ -28,7 +28,7 @@ const styles = {
 
 function DemoAxis() {
   return (
-    <SwipeableViews containerStyle={styles.slideContainer} axis="y" resistance>
+    <SwipeableViews containerStyle={styles.slideContainer} axis="y" resistance enableMouseEvents>
       <div style={Object.assign({}, styles.slide, styles.slide1)}>slide n°1</div>
       <div style={Object.assign({}, styles.slide, styles.slide2)}>slide n°2</div>
       <div style={styles.scroll}>

diff --git a/docs/src/pages/demos/DemoCircular.js b/docs/src/pages/demos/DemoCircular.js
@@ -53,7 +53,7 @@ function slideRenderer(params) {
 }
 
 function DemoSimple() {
-  return <VirtualizeSwipeableViews slideRenderer={slideRenderer} />;
+  return <VirtualizeSwipeableViews slideRenderer={slideRenderer} enableMouseEvents/>;
 }
 
 export default DemoSimple;
diff --git a/docs/src/pages/demos/DemoCoverflow.js b/docs/src/pages/demos/DemoCoverflow.js
@@ -85,6 +85,7 @@ class DemoCoverflow extends React.Component {
         style={styles.root}
         onChangeIndex={this.handleChangeIndex}
         onSwitching={this.handleSwitch}
+        enableMouseEvents
       >
         {albums.map((album, currentIndex) => {
           const inputRange = albums.map((_, i) => i);

diff --git a/docs/src/pages/demos/DemoHocs.js b/docs/src/pages/demos/DemoHocs.js
@@ -53,7 +53,7 @@ function slideRenderer(params) {
 }
 
 function DemoHocs() {
-  return <EnhancedSwipeableViews slideCount={10} slideRenderer={slideRenderer} />;
+  return <EnhancedSwipeableViews slideCount={10} slideRenderer={slideRenderer} enableMouseEvents/>;
 }
 
 export default DemoHocs;
diff --git a/docs/src/pages/demos/DemoKeyboard.js b/docs/src/pages/demos/DemoKeyboard.js
@@ -23,7 +23,7 @@ const styles = {
 
 function DemoKeyboard() {
   return (
-    <BindKeyboardSwipeableViews>
+    <BindKeyboardSwipeableViews enableMouseEvents>
       <div style={Object.assign({}, styles.slide, styles.slide1)}>slide n°1</div>
       <div style={Object.assign({}, styles.slide, styles.slide2)}>slide n°2</div>
       <div style={Object.assign({}, styles.slide, styles.slide3)}>slide n°3</div>

diff --git a/docs/src/pages/demos/DemoNested.js b/docs/src/pages/demos/DemoNested.js
@@ -48,15 +48,15 @@ function DemoNested() {
         </div>
         slide n°2
         <div style={styles.divider} />
-        <SwipeableViews>
+        <SwipeableViews enableMouseEvents>
           <div style={Object.assign({}, styles.slide, styles.slide1)}>nested slide n°2.1</div>
           <div style={Object.assign({}, styles.slide, styles.slide3)}>nested slide n°2.2</div>
         </SwipeableViews>
       </div>
       <div style={Object.assign({}, styles.slide, styles.slide3)}>
         slide n°3
         <div style={styles.divider} />
-        <SwipeableViews axis="y" containerStyle={styles.slideContainerY}>
+        <SwipeableViews axis="y" containerStyle={styles.slideContainerY} enableMouseEvents>
           <div style={Object.assign({}, styles.slide, styles.slide1)}>nested slide n°3.1</div>
           <div style={Object.assign({}, styles.slide, styles.slide2)}>nested slide n°3.2</div>
         </SwipeableViews>

diff --git a/docs/src/pages/demos/DemoResistance.js b/docs/src/pages/demos/DemoResistance.js
@@ -20,7 +20,7 @@ const styles = {
 
 function DemoResistance() {
   return (
-    <SwipeableViews resistance>
+    <SwipeableViews resistance enableMouseEvents>
       <div style={Object.assign({}, styles.slide, styles.slide1)}>slide n°1</div>
       <div style={Object.assign({}, styles.slide, styles.slide2)}>slide n°2</div>
       <div style={Object.assign({}, styles.slide, styles.slide3)}>slide n°3</div>

diff --git a/docs/src/pages/demos/DemoRtl.js b/docs/src/pages/demos/DemoRtl.js
@@ -26,7 +26,7 @@ const styles = {
 function DemoRtl() {
   return (
     <div style={styles.root}>
-      <SwipeableViews axis="x-reverse">
+      <SwipeableViews axis="x-reverse" enableMouseEvents>
         <div style={Object.assign({}, styles.slide, styles.slide1)}>slide n°1</div>
         <div style={Object.assign({}, styles.slide, styles.slide2)}>slide n°2</div>
         <div style={Object.assign({}, styles.slide, styles.slide3)}>slide n°3</div>

diff --git a/docs/src/pages/demos/DemoScroll.js b/docs/src/pages/demos/DemoScroll.js
@@ -30,7 +30,7 @@ for (let i = 0; i < 30; i += 1) {
 
 function DemoScroll() {
   return (
-    <SwipeableViews containerStyle={styles.slideContainer}>
+    <SwipeableViews containerStyle={styles.slideContainer} enableMouseEvents>
       <div style={Object.assign({}, styles.slide, styles.slide1)}>{list}</div>
       <div style={Object.assign({}, styles.slide, styles.slide2)}>slide n°2</div>
       <div style={Object.assign({}, styles.slide, styles.slide3)}>slide n°3</div>

diff --git a/docs/src/pages/demos/DemoTabs.js b/docs/src/pages/demos/DemoTabs.js
@@ -52,7 +52,7 @@ class DemoTabs extends React.Component {
           <Tab label="tab n°2" />
           <Tab label="tab n°3" />
         </Tabs>
-        <SwipeableViews index={index} onChangeIndex={this.handleChangeIndex}>
+        <SwipeableViews index={index} onChangeIndex={this.handleChangeIndex} enableMouseEvents>
           <div style={Object.assign({}, styles.slide, styles.slide1)}>slide n°1</div>
           <div style={Object.assign({}, styles.slide, styles.slide2)}>
             slide n°2

diff --git a/docs/src/pages/demos/DemoVirtualize.js b/docs/src/pages/demos/DemoVirtualize.js
@@ -77,6 +77,7 @@ class DemoVirtualize extends React.Component {
           index={this.state.index}
           onChangeIndex={this.handleChangeIndex}
           slideRenderer={slideRenderer}
+          enableMouseEvents
         />
         <br />
         <Button onClick={this.handleClick}>{'go to slide n°50'}</Button>

diff --git a/docs/src/pages/demos/DemoWidth.js b/docs/src/pages/demos/DemoWidth.js
@@ -26,7 +26,7 @@ const styles = {
 
 function DemoWidth() {
   return (
-    <SwipeableViews style={styles.root} slideStyle={styles.slideContainer}>
+    <SwipeableViews style={styles.root} slideStyle={styles.slideContainer} enableMouseEvents>
       <div style={Object.assign({}, styles.slide, styles.slide1)}>slide n°1</div>
       <div style={Object.assign({}, styles.slide, styles.slide2)}>slide n°2</div>
       <div style={Object.assign({}, styles.slide, styles.slide3)}>slide n°3</div>