react-slideshow-image 2.0.1 → 3.0.2
Sign up to get free protection for your applications and to get access to all the features.
- package/README.md +22 -200
- package/dist/react-slideshow-image.min.js +1 -1
- package/dist/react-slideshow-image.min.js.map +1 -1
- package/dist/styles.css +1 -1
- package/lib/css/styles.css +43 -18
- package/lib/fade.js +35 -85
- package/lib/helpers.js +101 -3
- package/lib/slide.js +44 -91
- package/lib/zoom.js +41 -91
- package/package.json +11 -5
package/README.md
CHANGED
|
@@ -3,11 +3,11 @@
|
|
|
3
3
|
[](https://circleci.com/gh/femioladeji/react-slideshow)
|
|
4
4
|
[](https://codecov.io/gh/femioladeji/react-slideshow)
|
|
5
5
|
[](http://packagequality.com/#?package=react-slideshow-image)
|
|
6
|
-
[](https://www.npmjs.com/package/react-slideshow-image)
|
|
7
7
|
|
|
8
|
-
A simple slideshow component built with react that supports slide, fade and zoom effects
|
|
8
|
+
A simple slideshow component built with react that supports slide, fade and zoom effects. For full documentation click [here](https://react-slideshow.herokuapp.com)
|
|
9
9
|
|
|
10
|
-
Installation
|
|
10
|
+
## Installation
|
|
11
11
|
```
|
|
12
12
|
npm install react-slideshow-image -S
|
|
13
13
|
```
|
|
@@ -16,24 +16,25 @@ npm install react-slideshow-image -S
|
|
|
16
16
|
yarn add react-slideshow-image
|
|
17
17
|
```
|
|
18
18
|
|
|
19
|
-
You need to import the css style, you can do that by adding to
|
|
20
|
-
```css
|
|
21
|
-
@import "react-slideshow-image/dist/styles.css";
|
|
22
|
-
|
|
23
|
-
```
|
|
24
|
-
or import it in your js file
|
|
19
|
+
You need to import the css style, you can do that by adding to the js file
|
|
25
20
|
```js
|
|
26
21
|
import 'react-slideshow-image/dist/styles.css'
|
|
27
22
|
|
|
28
23
|
```
|
|
24
|
+
or to your css file
|
|
25
|
+
```css
|
|
26
|
+
@import "react-slideshow-image/dist/styles.css";
|
|
29
27
|
|
|
28
|
+
```
|
|
30
29
|
|
|
31
|
-
You can use three different effects of the slideshow. Check
|
|
30
|
+
You can use three different effects of the slideshow. Check [examples](https://react-slideshow.herokuapp.com)
|
|
32
31
|
|
|
33
32
|
## Slide Effect
|
|
33
|
+
You can use this [playground](https://codesandbox.io/s/serene-lalande-yjmol) to tweak some values
|
|
34
34
|
```js
|
|
35
35
|
import React from 'react';
|
|
36
36
|
import { Slide } from 'react-slideshow-image';
|
|
37
|
+
import 'react-slideshow-image/dist/styles.css'
|
|
37
38
|
|
|
38
39
|
const slideImages = [
|
|
39
40
|
'images/slide_2.jpg',
|
|
@@ -41,22 +42,10 @@ const slideImages = [
|
|
|
41
42
|
'images/slide_4.jpg'
|
|
42
43
|
];
|
|
43
44
|
|
|
44
|
-
const properties = {
|
|
45
|
-
duration: 5000,
|
|
46
|
-
transitionDuration: 500,
|
|
47
|
-
infinite: true,
|
|
48
|
-
indicators: true,
|
|
49
|
-
arrows: true,
|
|
50
|
-
pauseOnHover: true,
|
|
51
|
-
onChange: (oldIndex, newIndex) => {
|
|
52
|
-
console.log(`slide transition from ${oldIndex} to ${newIndex}`);
|
|
53
|
-
}
|
|
54
|
-
}
|
|
55
|
-
|
|
56
45
|
const Slideshow = () => {
|
|
57
46
|
return (
|
|
58
47
|
<div className="slide-container">
|
|
59
|
-
<Slide
|
|
48
|
+
<Slide>
|
|
60
49
|
<div className="each-slide">
|
|
61
50
|
<div style={{'backgroundImage': `url(${slideImages[0]})`}}>
|
|
62
51
|
<span>Slide 1</span>
|
|
@@ -77,12 +66,13 @@ const Slideshow = () => {
|
|
|
77
66
|
)
|
|
78
67
|
}
|
|
79
68
|
```
|
|
80
|
-
The default value for duration and transitionDuration is 5000 and 1000 milliseconds respectively
|
|
81
69
|
|
|
82
70
|
## Fade Effect
|
|
71
|
+
You can use this [playground](https://codesandbox.io/s/admiring-wave-17e0j) to tweak some values
|
|
83
72
|
```js
|
|
84
73
|
import React from 'react';
|
|
85
74
|
import { Fade } from 'react-slideshow-image';
|
|
75
|
+
import 'react-slideshow-image/dist/styles.css'
|
|
86
76
|
|
|
87
77
|
const fadeImages = [
|
|
88
78
|
'images/slide_5.jpg',
|
|
@@ -90,20 +80,10 @@ const fadeImages = [
|
|
|
90
80
|
'images/slide_7.jpg'
|
|
91
81
|
];
|
|
92
82
|
|
|
93
|
-
const fadeProperties = {
|
|
94
|
-
duration: 5000,
|
|
95
|
-
transitionDuration: 500,
|
|
96
|
-
infinite: false,
|
|
97
|
-
indicators: true,
|
|
98
|
-
onChange: (oldIndex, newIndex) => {
|
|
99
|
-
console.log(`fade transition from ${oldIndex} to ${newIndex}`);
|
|
100
|
-
}
|
|
101
|
-
}
|
|
102
|
-
|
|
103
83
|
const Slideshow = () => {
|
|
104
84
|
return (
|
|
105
85
|
<div className="slide-container">
|
|
106
|
-
<Fade
|
|
86
|
+
<Fade>
|
|
107
87
|
<div className="each-fade">
|
|
108
88
|
<div className="image-container">
|
|
109
89
|
<img src={fadeImages[0]} />
|
|
@@ -127,12 +107,13 @@ const Slideshow = () => {
|
|
|
127
107
|
)
|
|
128
108
|
}
|
|
129
109
|
```
|
|
130
|
-
The default value for duration and transitionDuration is 5000 and 1000 milliseconds respectively
|
|
131
110
|
|
|
132
111
|
## Zoom Effect
|
|
112
|
+
You can use this [playground](https://codesandbox.io/s/priceless-bohr-ggirf) to tweak some values
|
|
133
113
|
```js
|
|
134
114
|
import React from 'react';
|
|
135
115
|
import { Zoom } from 'react-slideshow-image';
|
|
116
|
+
import 'react-slideshow-image/dist/styles.css'
|
|
136
117
|
|
|
137
118
|
const images = [
|
|
138
119
|
'images/slide_2.jpg',
|
|
@@ -143,19 +124,10 @@ const images = [
|
|
|
143
124
|
'images/slide_7.jpg'
|
|
144
125
|
];
|
|
145
126
|
|
|
146
|
-
const zoomOutProperties = {
|
|
147
|
-
duration: 5000,
|
|
148
|
-
transitionDuration: 500,
|
|
149
|
-
infinite: true,
|
|
150
|
-
indicators: true,
|
|
151
|
-
scale: 0.4,
|
|
152
|
-
arrows: true
|
|
153
|
-
}
|
|
154
|
-
|
|
155
127
|
const Slideshow = () => {
|
|
156
128
|
return (
|
|
157
129
|
<div className="slide-container">
|
|
158
|
-
<Zoom {
|
|
130
|
+
<Zoom scale={0.4}>
|
|
159
131
|
{
|
|
160
132
|
images.map((each, index) => <img key={index} style={{width: "100%"}} src={each} />)
|
|
161
133
|
}
|
|
@@ -165,162 +137,12 @@ const Slideshow = () => {
|
|
|
165
137
|
}
|
|
166
138
|
```
|
|
167
139
|
|
|
168
|
-
## Customizing Indciators
|
|
169
|
-
The indicator can be customizes to what you want. To customize it, set the indicators prop to a function that returns the element you want. The function accepts an index parameter.
|
|
170
|
-
```js
|
|
171
|
-
{
|
|
172
|
-
indicators: i => (
|
|
173
|
-
<div
|
|
174
|
-
style={{
|
|
175
|
-
width: '30px',
|
|
176
|
-
color: 'blue',
|
|
177
|
-
textAlign: 'center',
|
|
178
|
-
cursor: 'pointer',
|
|
179
|
-
border: '1px blue solid'
|
|
180
|
-
}}
|
|
181
|
-
>
|
|
182
|
-
{i + 1}
|
|
183
|
-
</div>
|
|
184
|
-
)
|
|
185
|
-
),
|
|
186
|
-
```
|
|
187
|
-
|
|
188
|
-
## CSS
|
|
189
|
-
|
|
190
|
-
This is what my css looks like. You can customize this to your own taste
|
|
191
|
-
```css
|
|
192
|
-
.slide-container {
|
|
193
|
-
width: 70%;
|
|
194
|
-
margin: auto; }
|
|
195
|
-
|
|
196
|
-
h3 {
|
|
197
|
-
text-align: center; }
|
|
198
|
-
|
|
199
|
-
.each-slide > div {
|
|
200
|
-
display: flex;
|
|
201
|
-
align-items: center;
|
|
202
|
-
justify-content: center;
|
|
203
|
-
background-size: cover;
|
|
204
|
-
height: 300px;
|
|
205
|
-
}
|
|
206
|
-
|
|
207
|
-
.each-slide span {
|
|
208
|
-
padding: 20px;
|
|
209
|
-
font-size: 20px;
|
|
210
|
-
background: #efefef;
|
|
211
|
-
text-align: center;
|
|
212
|
-
}
|
|
213
|
-
|
|
214
|
-
.each-fade {
|
|
215
|
-
display: flex;
|
|
216
|
-
}
|
|
217
|
-
|
|
218
|
-
.each-fade .image-container {
|
|
219
|
-
width: 75%;
|
|
220
|
-
overflow: hidden;
|
|
221
|
-
}
|
|
222
|
-
|
|
223
|
-
.each-fade .image-container img {
|
|
224
|
-
width: 100%;
|
|
225
|
-
}
|
|
226
|
-
|
|
227
|
-
.each-fade h2 {
|
|
228
|
-
width: 25%;
|
|
229
|
-
display: flex;
|
|
230
|
-
justify-content: center;
|
|
231
|
-
align-items: center;
|
|
232
|
-
margin: 0;
|
|
233
|
-
background: #adceed;
|
|
234
|
-
}
|
|
235
|
-
```
|
|
236
|
-
## Next
|
|
237
|
-
⚠️ For those using `Next.js` . You need the import the package dynamically and set ssr property to false. The snippet below imports the Fade effect
|
|
238
|
-
|
|
239
|
-
```js
|
|
240
|
-
import dynamic from 'next/dynamic';
|
|
241
|
-
const Fade = dynamic(() =>
|
|
242
|
-
import('react-slideshow-image').then((slideshow) => slideshow.Fade),
|
|
243
|
-
{ ssr: false }
|
|
244
|
-
)
|
|
245
|
-
|
|
246
|
-
```
|
|
247
|
-
|
|
248
|
-
HTML properties like className, data-* attributes and others will be applied to the parent div
|
|
249
|
-
|
|
250
140
|
## Properties
|
|
251
|
-
|
|
252
|
-
| ------------------- |:-----------:| ------------- | ------------------------------------------------------------------------------------------ |
|
|
253
|
-
| duration | integer | 5000 | Time it takes (milliseconds) before next transition starts |
|
|
254
|
-
| transitionDuration | integer | 1000 | Determines how long the transition takes |
|
|
255
|
-
| defaultIndex | integer | 0 | Specifies the first slide to display |
|
|
256
|
-
| infinite | boolean | true | Specifies if the transition should loop throughout |
|
|
257
|
-
| indicators | boolean or function | false | For specifying if there should be dots below the slideshow. If function, it will render the returned element |
|
|
258
|
-
| scale | number | | *Required* when using zoom to specify the scale the current slide should be zoomed to |
|
|
259
|
-
| arrows | boolean | true | Determines if there should be a navigational arrow for going to the next or previous slide |
|
|
260
|
-
| prevArrow | object or function | null | A custom element to serve as previous arrow |
|
|
261
|
-
| nextArrow | object or function | null | A custom element to serve as next arrow |
|
|
262
|
-
| autoplay | boolean | true | Responsible for determining if the slideshow should start automatically |
|
|
263
|
-
| pauseOnHover | boolean | false | Determines whether the transition effect applies when the mouse hovers the slider |
|
|
264
|
-
| onChange | function | | Callback that gets triggered at the end of every transition. The oldIndex and newIndex are passed as arguments |
|
|
265
|
-
|
|
266
|
-
## Methods
|
|
267
|
-
1. goNext()
|
|
268
|
-
It is used to programmatically transition the slide to the next one.
|
|
141
|
+
Click [here](https://react-slideshow.herokuapp.com/api) for all the properties you can use to customize the behavior of the slideshow.
|
|
269
142
|
|
|
270
|
-
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
3. goTo(index)
|
|
274
|
-
It can be used to transition the slide to a particular index. N.B Index starts from 0
|
|
275
|
-
|
|
276
|
-
To call the method you can use the slide's ref attribute and then call the method.
|
|
277
|
-
`this.slideRef.goNext()` or `this.slideRef.current.goNext()`
|
|
143
|
+
## methods
|
|
144
|
+
Click [here](https://react-slideshow.herokuapp.com/api#methods) for all the methods you can call on the slideshow
|
|
278
145
|
|
|
279
146
|
|
|
280
147
|
## Typescript
|
|
281
|
-
|
|
282
|
-
1. In your tsconfig.json file add this to the compiler options
|
|
283
|
-
```json
|
|
284
|
-
"typeRoots": [
|
|
285
|
-
"./types",
|
|
286
|
-
"./node_modules/@types"
|
|
287
|
-
]
|
|
288
|
-
```
|
|
289
|
-
2. Create a file in this directory `types/react-slideshow-image/index.d.ts`
|
|
290
|
-
3. Copy and paste this into it
|
|
291
|
-
```ts
|
|
292
|
-
declare module 'react-slideshow-image' {
|
|
293
|
-
export class Zoom extends React.Component<ZoomProps & any, any> {
|
|
294
|
-
goBack(): void;
|
|
295
|
-
goNext(): void;
|
|
296
|
-
goTo(index: number): void;
|
|
297
|
-
}
|
|
298
|
-
export class Fade extends React.Component<SlideshowProps & any, any> {
|
|
299
|
-
goBack(): void;
|
|
300
|
-
goNext(): void;
|
|
301
|
-
goTo(index: number): void;
|
|
302
|
-
}
|
|
303
|
-
export class Slide extends React.Component<SlideshowProps & any, any> {
|
|
304
|
-
goBack(): void;
|
|
305
|
-
goNext(): void;
|
|
306
|
-
goTo(index: number): void;
|
|
307
|
-
}
|
|
308
|
-
export interface SlideshowProps {
|
|
309
|
-
duration?: number,
|
|
310
|
-
transitionDuration?: number,
|
|
311
|
-
defaultIndex?: number,
|
|
312
|
-
indicators?: boolean | function,
|
|
313
|
-
prevArrow?: object | function,
|
|
314
|
-
nextArrow?: object | function,
|
|
315
|
-
arrows?: boolean,
|
|
316
|
-
autoplay?: boolean,
|
|
317
|
-
infinite?: boolean,
|
|
318
|
-
onChange?(oldIndex: number, newIndex: number): void,
|
|
319
|
-
pauseOnHover?: boolean
|
|
320
|
-
}
|
|
321
|
-
export interface ZoomProps extends SlideshowProps {
|
|
322
|
-
scale: number
|
|
323
|
-
}
|
|
324
|
-
}
|
|
325
|
-
|
|
326
|
-
```
|
|
148
|
+
The type bindings have not been added yet to the types registry yet. It's a WIP. You can follow [this instruction](https://react-slideshow.herokuapp.com/typescript)
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e(require("react")):"function"==typeof define&&define.amd?define(["react"],e):"object"==typeof exports?exports["react-slideshow-image"]=e(require("react")):t["react-slideshow-image"]=e(t.React)}(this,(function(t){return function(t){var e={};function n(i){if(e[i])return e[i].exports;var r=e[i]={i:i,l:!1,exports:{}};return t[i].call(r.exports,r,r.exports,n),r.l=!0,r.exports}return n.m=t,n.c=e,n.d=function(t,e,i){n.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:i})},n.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},n.t=function(t,e){if(1&e&&(t=n(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var i=Object.create(null);if(n.r(i),Object.defineProperty(i,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var r in t)n.d(i,r,function(e){return t[e]}.bind(null,r));return i},n.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return n.d(e,"a",e),e},n.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},n.p="",n(n.s=8)}([function(t,e,n){t.exports=n(6)()},function(e,n){e.exports=t},function(t,e,n){"use strict";(function(t){var n=function(){this._tweens={},this._tweensAddedDuringUpdate={}};n.prototype={getAll:function(){return Object.keys(this._tweens).map(function(t){return this._tweens[t]}.bind(this))},removeAll:function(){this._tweens={}},add:function(t){this._tweens[t.getId()]=t,this._tweensAddedDuringUpdate[t.getId()]=t},remove:function(t){delete this._tweens[t.getId()],delete this._tweensAddedDuringUpdate[t.getId()]},update:function(t,e){var n=Object.keys(this._tweens);if(0===n.length)return!1;for(t=void 0!==t?t:r.now();n.length>0;){this._tweensAddedDuringUpdate={};for(var i=0;i<n.length;i++){var o=this._tweens[n[i]];o&&!1===o.update(t)&&(o._isPlaying=!1,e||delete this._tweens[n[i]])}n=Object.keys(this._tweensAddedDuringUpdate)}return!0}};var i,r=new n;r.Group=n,r._nextId=0,r.nextId=function(){return r._nextId++},"undefined"==typeof self&&void 0!==t&&t.hrtime?r.now=function(){var e=t.hrtime();return 1e3*e[0]+e[1]/1e6}:"undefined"!=typeof self&&void 0!==self.performance&&void 0!==self.performance.now?r.now=self.performance.now.bind(self.performance):void 0!==Date.now?r.now=Date.now:r.now=function(){return(new Date).getTime()},r.Tween=function(t,e){this._object=t,this._valuesStart={},this._valuesEnd={},this._valuesStartRepeat={},this._duration=1e3,this._repeat=0,this._repeatDelayTime=void 0,this._yoyo=!1,this._isPlaying=!1,this._reversed=!1,this._delayTime=0,this._startTime=null,this._easingFunction=r.Easing.Linear.None,this._interpolationFunction=r.Interpolation.Linear,this._chainedTweens=[],this._onStartCallback=null,this._onStartCallbackFired=!1,this._onUpdateCallback=null,this._onRepeatCallback=null,this._onCompleteCallback=null,this._onStopCallback=null,this._group=e||r,this._id=r.nextId()},r.Tween.prototype={getId:function(){return this._id},isPlaying:function(){return this._isPlaying},to:function(t,e){return this._valuesEnd=Object.create(t),void 0!==e&&(this._duration=e),this},duration:function(t){return this._duration=t,this},start:function(t){for(var e in this._group.add(this),this._isPlaying=!0,this._onStartCallbackFired=!1,this._startTime=void 0!==t?"string"==typeof t?r.now()+parseFloat(t):t:r.now(),this._startTime+=this._delayTime,this._valuesEnd){if(this._valuesEnd[e]instanceof Array){if(0===this._valuesEnd[e].length)continue;this._valuesEnd[e]=[this._object[e]].concat(this._valuesEnd[e])}void 0!==this._object[e]&&(this._valuesStart[e]=this._object[e],this._valuesStart[e]instanceof Array==!1&&(this._valuesStart[e]*=1),this._valuesStartRepeat[e]=this._valuesStart[e]||0)}return this},stop:function(){return this._isPlaying?(this._group.remove(this),this._isPlaying=!1,null!==this._onStopCallback&&this._onStopCallback(this._object),this.stopChainedTweens(),this):this},end:function(){return this.update(1/0),this},stopChainedTweens:function(){for(var t=0,e=this._chainedTweens.length;t<e;t++)this._chainedTweens[t].stop()},group:function(t){return this._group=t,this},delay:function(t){return this._delayTime=t,this},repeat:function(t){return this._repeat=t,this},repeatDelay:function(t){return this._repeatDelayTime=t,this},yoyo:function(t){return this._yoyo=t,this},easing:function(t){return this._easingFunction=t,this},interpolation:function(t){return this._interpolationFunction=t,this},chain:function(){return this._chainedTweens=arguments,this},onStart:function(t){return this._onStartCallback=t,this},onUpdate:function(t){return this._onUpdateCallback=t,this},onRepeat:function(t){return this._onRepeatCallback=t,this},onComplete:function(t){return this._onCompleteCallback=t,this},onStop:function(t){return this._onStopCallback=t,this},update:function(t){var e,n,i;if(t<this._startTime)return!0;for(e in!1===this._onStartCallbackFired&&(null!==this._onStartCallback&&this._onStartCallback(this._object),this._onStartCallbackFired=!0),n=(t-this._startTime)/this._duration,n=0===this._duration||n>1?1:n,i=this._easingFunction(n),this._valuesEnd)if(void 0!==this._valuesStart[e]){var r=this._valuesStart[e]||0,o=this._valuesEnd[e];o instanceof Array?this._object[e]=this._interpolationFunction(o,i):("string"==typeof o&&(o="+"===o.charAt(0)||"-"===o.charAt(0)?r+parseFloat(o):parseFloat(o)),"number"==typeof o&&(this._object[e]=r+(o-r)*i))}if(null!==this._onUpdateCallback&&this._onUpdateCallback(this._object,n),1===n){if(this._repeat>0){for(e in isFinite(this._repeat)&&this._repeat--,this._valuesStartRepeat){if("string"==typeof this._valuesEnd[e]&&(this._valuesStartRepeat[e]=this._valuesStartRepeat[e]+parseFloat(this._valuesEnd[e])),this._yoyo){var a=this._valuesStartRepeat[e];this._valuesStartRepeat[e]=this._valuesEnd[e],this._valuesEnd[e]=a}this._valuesStart[e]=this._valuesStartRepeat[e]}return this._yoyo&&(this._reversed=!this._reversed),void 0!==this._repeatDelayTime?this._startTime=t+this._repeatDelayTime:this._startTime=t+this._delayTime,null!==this._onRepeatCallback&&this._onRepeatCallback(this._object),!0}null!==this._onCompleteCallback&&this._onCompleteCallback(this._object);for(var s=0,u=this._chainedTweens.length;s<u;s++)this._chainedTweens[s].start(this._startTime+this._duration);return!1}return!0}},r.Easing={Linear:{None:function(t){return t}},Quadratic:{In:function(t){return t*t},Out:function(t){return t*(2-t)},InOut:function(t){return(t*=2)<1?.5*t*t:-.5*(--t*(t-2)-1)}},Cubic:{In:function(t){return t*t*t},Out:function(t){return--t*t*t+1},InOut:function(t){return(t*=2)<1?.5*t*t*t:.5*((t-=2)*t*t+2)}},Quartic:{In:function(t){return t*t*t*t},Out:function(t){return 1- --t*t*t*t},InOut:function(t){return(t*=2)<1?.5*t*t*t*t:-.5*((t-=2)*t*t*t-2)}},Quintic:{In:function(t){return t*t*t*t*t},Out:function(t){return--t*t*t*t*t+1},InOut:function(t){return(t*=2)<1?.5*t*t*t*t*t:.5*((t-=2)*t*t*t*t+2)}},Sinusoidal:{In:function(t){return 1-Math.cos(t*Math.PI/2)},Out:function(t){return Math.sin(t*Math.PI/2)},InOut:function(t){return.5*(1-Math.cos(Math.PI*t))}},Exponential:{In:function(t){return 0===t?0:Math.pow(1024,t-1)},Out:function(t){return 1===t?1:1-Math.pow(2,-10*t)},InOut:function(t){return 0===t?0:1===t?1:(t*=2)<1?.5*Math.pow(1024,t-1):.5*(2-Math.pow(2,-10*(t-1)))}},Circular:{In:function(t){return 1-Math.sqrt(1-t*t)},Out:function(t){return Math.sqrt(1- --t*t)},InOut:function(t){return(t*=2)<1?-.5*(Math.sqrt(1-t*t)-1):.5*(Math.sqrt(1-(t-=2)*t)+1)}},Elastic:{In:function(t){return 0===t?0:1===t?1:-Math.pow(2,10*(t-1))*Math.sin(5*(t-1.1)*Math.PI)},Out:function(t){return 0===t?0:1===t?1:Math.pow(2,-10*t)*Math.sin(5*(t-.1)*Math.PI)+1},InOut:function(t){return 0===t?0:1===t?1:(t*=2)<1?-.5*Math.pow(2,10*(t-1))*Math.sin(5*(t-1.1)*Math.PI):.5*Math.pow(2,-10*(t-1))*Math.sin(5*(t-1.1)*Math.PI)+1}},Back:{In:function(t){var e=1.70158;return t*t*((e+1)*t-e)},Out:function(t){var e=1.70158;return--t*t*((e+1)*t+e)+1},InOut:function(t){var e=2.5949095;return(t*=2)<1?t*t*((e+1)*t-e)*.5:.5*((t-=2)*t*((e+1)*t+e)+2)}},Bounce:{In:function(t){return 1-r.Easing.Bounce.Out(1-t)},Out:function(t){return t<1/2.75?7.5625*t*t:t<2/2.75?7.5625*(t-=1.5/2.75)*t+.75:t<2.5/2.75?7.5625*(t-=2.25/2.75)*t+.9375:7.5625*(t-=2.625/2.75)*t+.984375},InOut:function(t){return t<.5?.5*r.Easing.Bounce.In(2*t):.5*r.Easing.Bounce.Out(2*t-1)+.5}}},r.Interpolation={Linear:function(t,e){var n=t.length-1,i=n*e,o=Math.floor(i),a=r.Interpolation.Utils.Linear;return e<0?a(t[0],t[1],i):e>1?a(t[n],t[n-1],n-i):a(t[o],t[o+1>n?n:o+1],i-o)},Bezier:function(t,e){for(var n=0,i=t.length-1,o=Math.pow,a=r.Interpolation.Utils.Bernstein,s=0;s<=i;s++)n+=o(1-e,i-s)*o(e,s)*t[s]*a(i,s);return n},CatmullRom:function(t,e){var n=t.length-1,i=n*e,o=Math.floor(i),a=r.Interpolation.Utils.CatmullRom;return t[0]===t[n]?(e<0&&(o=Math.floor(i=n*(1+e))),a(t[(o-1+n)%n],t[o],t[(o+1)%n],t[(o+2)%n],i-o)):e<0?t[0]-(a(t[0],t[0],t[1],t[1],-i)-t[0]):e>1?t[n]-(a(t[n],t[n],t[n-1],t[n-1],i-n)-t[n]):a(t[o?o-1:0],t[o],t[n<o+1?n:o+1],t[n<o+2?n:o+2],i-o)},Utils:{Linear:function(t,e,n){return(e-t)*n+t},Bernstein:function(t,e){var n=r.Interpolation.Utils.Factorial;return n(t)/n(e)/n(t-e)},Factorial:(i=[1],function(t){var e=1;if(i[t])return i[t];for(var n=t;n>1;n--)e*=n;return i[t]=e,e}),CatmullRom:function(t,e,n,i,r){var o=.5*(n-t),a=.5*(i-e),s=r*r;return(2*e-2*n+o+a)*(r*s)+(-3*e+3*n-2*o-a)*s+o*r+e}}},e.a=r}).call(this,n(4))},function(t,e,n){"use strict";(function(t){var n=function(){if("undefined"!=typeof Map)return Map;function t(t,e){var n=-1;return t.some((function(t,i){return t[0]===e&&(n=i,!0)})),n}return function(){function e(){this.__entries__=[]}return Object.defineProperty(e.prototype,"size",{get:function(){return this.__entries__.length},enumerable:!0,configurable:!0}),e.prototype.get=function(e){var n=t(this.__entries__,e),i=this.__entries__[n];return i&&i[1]},e.prototype.set=function(e,n){var i=t(this.__entries__,e);~i?this.__entries__[i][1]=n:this.__entries__.push([e,n])},e.prototype.delete=function(e){var n=this.__entries__,i=t(n,e);~i&&n.splice(i,1)},e.prototype.has=function(e){return!!~t(this.__entries__,e)},e.prototype.clear=function(){this.__entries__.splice(0)},e.prototype.forEach=function(t,e){void 0===e&&(e=null);for(var n=0,i=this.__entries__;n<i.length;n++){var r=i[n];t.call(e,r[1],r[0])}},e}()}(),i="undefined"!=typeof window&&"undefined"!=typeof document&&window.document===document,r=void 0!==t&&t.Math===Math?t:"undefined"!=typeof self&&self.Math===Math?self:"undefined"!=typeof window&&window.Math===Math?window:Function("return this")(),o="function"==typeof requestAnimationFrame?requestAnimationFrame.bind(r):function(t){return setTimeout((function(){return t(Date.now())}),1e3/60)};var a=["top","right","bottom","left","width","height","size","weight"],s="undefined"!=typeof MutationObserver,u=function(){function t(){this.connected_=!1,this.mutationEventsAdded_=!1,this.mutationsObserver_=null,this.observers_=[],this.onTransitionEnd_=this.onTransitionEnd_.bind(this),this.refresh=function(t,e){var n=!1,i=!1,r=0;function a(){n&&(n=!1,t()),i&&u()}function s(){o(a)}function u(){var t=Date.now();if(n){if(t-r<2)return;i=!0}else n=!0,i=!1,setTimeout(s,e);r=t}return u}(this.refresh.bind(this),20)}return t.prototype.addObserver=function(t){~this.observers_.indexOf(t)||this.observers_.push(t),this.connected_||this.connect_()},t.prototype.removeObserver=function(t){var e=this.observers_,n=e.indexOf(t);~n&&e.splice(n,1),!e.length&&this.connected_&&this.disconnect_()},t.prototype.refresh=function(){this.updateObservers_()&&this.refresh()},t.prototype.updateObservers_=function(){var t=this.observers_.filter((function(t){return t.gatherActive(),t.hasActive()}));return t.forEach((function(t){return t.broadcastActive()})),t.length>0},t.prototype.connect_=function(){i&&!this.connected_&&(document.addEventListener("transitionend",this.onTransitionEnd_),window.addEventListener("resize",this.refresh),s?(this.mutationsObserver_=new MutationObserver(this.refresh),this.mutationsObserver_.observe(document,{attributes:!0,childList:!0,characterData:!0,subtree:!0})):(document.addEventListener("DOMSubtreeModified",this.refresh),this.mutationEventsAdded_=!0),this.connected_=!0)},t.prototype.disconnect_=function(){i&&this.connected_&&(document.removeEventListener("transitionend",this.onTransitionEnd_),window.removeEventListener("resize",this.refresh),this.mutationsObserver_&&this.mutationsObserver_.disconnect(),this.mutationEventsAdded_&&document.removeEventListener("DOMSubtreeModified",this.refresh),this.mutationsObserver_=null,this.mutationEventsAdded_=!1,this.connected_=!1)},t.prototype.onTransitionEnd_=function(t){var e=t.propertyName,n=void 0===e?"":e;a.some((function(t){return!!~n.indexOf(t)}))&&this.refresh()},t.getInstance=function(){return this.instance_||(this.instance_=new t),this.instance_},t.instance_=null,t}(),c=function(t,e){for(var n=0,i=Object.keys(e);n<i.length;n++){var r=i[n];Object.defineProperty(t,r,{value:e[r],enumerable:!1,writable:!1,configurable:!0})}return t},l=function(t){return t&&t.ownerDocument&&t.ownerDocument.defaultView||r},h=m(0,0,0,0);function p(t){return parseFloat(t)||0}function d(t){for(var e=[],n=1;n<arguments.length;n++)e[n-1]=arguments[n];return e.reduce((function(e,n){return e+p(t["border-"+n+"-width"])}),0)}function f(t){var e=t.clientWidth,n=t.clientHeight;if(!e&&!n)return h;var i=l(t).getComputedStyle(t),r=function(t){for(var e={},n=0,i=["top","right","bottom","left"];n<i.length;n++){var r=i[n],o=t["padding-"+r];e[r]=p(o)}return e}(i),o=r.left+r.right,a=r.top+r.bottom,s=p(i.width),u=p(i.height);if("border-box"===i.boxSizing&&(Math.round(s+o)!==e&&(s-=d(i,"left","right")+o),Math.round(u+a)!==n&&(u-=d(i,"top","bottom")+a)),!function(t){return t===l(t).document.documentElement}(t)){var c=Math.round(s+o)-e,f=Math.round(u+a)-n;1!==Math.abs(c)&&(s-=c),1!==Math.abs(f)&&(u-=f)}return m(r.left,r.top,s,u)}var v="undefined"!=typeof SVGGraphicsElement?function(t){return t instanceof l(t).SVGGraphicsElement}:function(t){return t instanceof l(t).SVGElement&&"function"==typeof t.getBBox};function y(t){return i?v(t)?function(t){var e=t.getBBox();return m(0,0,e.width,e.height)}(t):f(t):h}function m(t,e,n,i){return{x:t,y:e,width:n,height:i}}var b=function(){function t(t){this.broadcastWidth=0,this.broadcastHeight=0,this.contentRect_=m(0,0,0,0),this.target=t}return t.prototype.isActive=function(){var t=y(this.target);return this.contentRect_=t,t.width!==this.broadcastWidth||t.height!==this.broadcastHeight},t.prototype.broadcastRect=function(){var t=this.contentRect_;return this.broadcastWidth=t.width,this.broadcastHeight=t.height,t},t}(),w=function(t,e){var n,i,r,o,a,s,u,l=(i=(n=e).x,r=n.y,o=n.width,a=n.height,s="undefined"!=typeof DOMRectReadOnly?DOMRectReadOnly:Object,u=Object.create(s.prototype),c(u,{x:i,y:r,width:o,height:a,top:r,right:i+o,bottom:a+r,left:i}),u);c(this,{target:t,contentRect:l})},_=function(){function t(t,e,i){if(this.activeObservations_=[],this.observations_=new n,"function"!=typeof t)throw new TypeError("The callback provided as parameter 1 is not a function.");this.callback_=t,this.controller_=e,this.callbackCtx_=i}return t.prototype.observe=function(t){if(!arguments.length)throw new TypeError("1 argument required, but only 0 present.");if("undefined"!=typeof Element&&Element instanceof Object){if(!(t instanceof l(t).Element))throw new TypeError('parameter 1 is not of type "Element".');var e=this.observations_;e.has(t)||(e.set(t,new b(t)),this.controller_.addObserver(this),this.controller_.refresh())}},t.prototype.unobserve=function(t){if(!arguments.length)throw new TypeError("1 argument required, but only 0 present.");if("undefined"!=typeof Element&&Element instanceof Object){if(!(t instanceof l(t).Element))throw new TypeError('parameter 1 is not of type "Element".');var e=this.observations_;e.has(t)&&(e.delete(t),e.size||this.controller_.removeObserver(this))}},t.prototype.disconnect=function(){this.clearActive(),this.observations_.clear(),this.controller_.removeObserver(this)},t.prototype.gatherActive=function(){var t=this;this.clearActive(),this.observations_.forEach((function(e){e.isActive()&&t.activeObservations_.push(e)}))},t.prototype.broadcastActive=function(){if(this.hasActive()){var t=this.callbackCtx_,e=this.activeObservations_.map((function(t){return new w(t.target,t.broadcastRect())}));this.callback_.call(t,e,t),this.clearActive()}},t.prototype.clearActive=function(){this.activeObservations_.splice(0)},t.prototype.hasActive=function(){return this.activeObservations_.length>0},t}(),g="undefined"!=typeof WeakMap?new WeakMap:new n,O=function t(e){if(!(this instanceof t))throw new TypeError("Cannot call a class as a function.");if(!arguments.length)throw new TypeError("1 argument required, but only 0 present.");var n=u.getInstance(),i=new _(e,n,this);g.set(this,i)};["observe","unobserve","disconnect"].forEach((function(t){O.prototype[t]=function(){var e;return(e=g.get(this))[t].apply(e,arguments)}}));var T=void 0!==r.ResizeObserver?r.ResizeObserver:O;e.a=T}).call(this,n(5))},function(t,e){var n,i,r=t.exports={};function o(){throw new Error("setTimeout has not been defined")}function a(){throw new Error("clearTimeout has not been defined")}function s(t){if(n===setTimeout)return setTimeout(t,0);if((n===o||!n)&&setTimeout)return n=setTimeout,setTimeout(t,0);try{return n(t,0)}catch(e){try{return n.call(null,t,0)}catch(e){return n.call(this,t,0)}}}!function(){try{n="function"==typeof setTimeout?setTimeout:o}catch(t){n=o}try{i="function"==typeof clearTimeout?clearTimeout:a}catch(t){i=a}}();var u,c=[],l=!1,h=-1;function p(){l&&u&&(l=!1,u.length?c=u.concat(c):h=-1,c.length&&d())}function d(){if(!l){var t=s(p);l=!0;for(var e=c.length;e;){for(u=c,c=[];++h<e;)u&&u[h].run();h=-1,e=c.length}u=null,l=!1,function(t){if(i===clearTimeout)return clearTimeout(t);if((i===a||!i)&&clearTimeout)return i=clearTimeout,clearTimeout(t);try{i(t)}catch(e){try{return i.call(null,t)}catch(e){return i.call(this,t)}}}(t)}}function f(t,e){this.fun=t,this.array=e}function v(){}r.nextTick=function(t){var e=new Array(arguments.length-1);if(arguments.length>1)for(var n=1;n<arguments.length;n++)e[n-1]=arguments[n];c.push(new f(t,e)),1!==c.length||l||s(d)},f.prototype.run=function(){this.fun.apply(null,this.array)},r.title="browser",r.browser=!0,r.env={},r.argv=[],r.version="",r.versions={},r.on=v,r.addListener=v,r.once=v,r.off=v,r.removeListener=v,r.removeAllListeners=v,r.emit=v,r.prependListener=v,r.prependOnceListener=v,r.listeners=function(t){return[]},r.binding=function(t){throw new Error("process.binding is not supported")},r.cwd=function(){return"/"},r.chdir=function(t){throw new Error("process.chdir is not supported")},r.umask=function(){return 0}},function(t,e){var n;n=function(){return this}();try{n=n||new Function("return this")()}catch(t){"object"==typeof window&&(n=window)}t.exports=n},function(t,e,n){"use strict";var i=n(7);function r(){}function o(){}o.resetWarningCache=r,t.exports=function(){function t(t,e,n,r,o,a){if(a!==i){var s=new Error("Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types");throw s.name="Invariant Violation",s}}function e(){return t}t.isRequired=t;var n={array:t,bool:t,func:t,number:t,object:t,string:t,symbol:t,any:t,arrayOf:e,element:t,elementType:t,instanceOf:e,node:t,objectOf:e,oneOf:e,oneOfType:e,shape:e,exact:e,checkPropTypes:o,resetWarningCache:r};return n.PropTypes=n,n}},function(t,e,n){"use strict";t.exports="SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED"},function(t,e,n){"use strict";n.r(e),n.d(e,"Slide",(function(){return y})),n.d(e,"Fade",(function(){return T})),n.d(e,"Zoom",(function(){return R}));var i=n(1),r=n.n(i),o=n(2),a=n(3),s=n(0),u=n.n(s);function c(t,e){var n=Object.keys(t);return Object.keys(e).reduce((function(t,i){return-1===n.indexOf(i)&&(t[i]=e[i]),t}),{})}function l(t){return(l="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t})(t)}function h(t,e){for(var n=0;n<e.length;n++){var i=e[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}function p(t){return(p=Object.setPrototypeOf?Object.getPrototypeOf:function(t){return t.__proto__||Object.getPrototypeOf(t)})(t)}function d(t){if(void 0===t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return t}function f(t,e){return(f=Object.setPrototypeOf||function(t,e){return t.__proto__=e,t})(t,e)}var v=function(t){function e(t){var n;return function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,e),(n=function(t,e){return!e||"object"!==l(e)&&"function"!=typeof e?d(t):e}(this,p(e).call(this,t))).state={index:t.defaultIndex&&t.defaultIndex<t.children.length?t.defaultIndex:0},n.width=0,n.imageContainer=null,n.wrapper=null,n.timeout=null,n.moveSlides=n.moveSlides.bind(d(n)),n.pauseSlides=n.pauseSlides.bind(d(n)),n.startSlides=n.startSlides.bind(d(n)),n.handleResize=n.handleResize.bind(d(n)),n.initResizeObserver=n.initResizeObserver.bind(d(n)),n.reactSlideshowWrapper=Object(i.createRef)(),n.goToSlide=n.goToSlide.bind(d(n)),n.tweenGroup=new o.a.Group,n}var n,s,u;return function(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function");t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,writable:!0,configurable:!0}}),e&&f(t,e)}(e,t),n=e,(s=[{key:"componentDidMount",value:function(){var t=this;this.setWidth(),this.initResizeObserver();var e=this.props,n=e.autoplay,i=e.duration;n&&(this.timeout=setTimeout((function(){return t.goNext()}),i))}},{key:"initResizeObserver",value:function(){var t=this;this.resizeObserver=new a.a((function(e){e&&t.handleResize()})),this.resizeObserver.observe(this.reactSlideshowWrapper.current)}},{key:"componentWillUnmount",value:function(){this.willUnmount=!0,clearTimeout(this.timeout),this.removeResizeObserver()}},{key:"removeResizeObserver",value:function(){this.resizeObserver&&this.reactSlideshowWrapper&&this.reactSlideshowWrapper.current&&this.resizeObserver.unobserve(this.reactSlideshowWrapper.current)}},{key:"setWidth",value:function(){this.allImages=Array.prototype.slice.call(this.wrapper.querySelectorAll(".images-wrap > div"),0),this.width=this.wrapper.clientWidth;var t=this.width*(this.props.children.length+2);this.imageContainer.style.width="".concat(t,"px"),this.imageContainer.style.transform="translate(-".concat(this.width*(this.state.index+1),"px)"),this.applySlideStyle()}},{key:"componentDidUpdate",value:function(t){var e=this;this.props.autoplay!==t.autoplay&&(this.props.autoplay?this.timeout=setTimeout((function(){return e.goNext()}),this.props.duration):clearTimeout(this.timeout)),this.props.children.length!=t.children.length&&this.setWidth()}},{key:"handleResize",value:function(){this.setWidth()}},{key:"applySlideStyle",value:function(){var t=this;this.allImages.forEach((function(e,n){e.style.width="".concat(t.width,"px")}))}},{key:"pauseSlides",value:function(){this.props.pauseOnHover&&clearTimeout(this.timeout)}},{key:"startSlides",value:function(){var t=this,e=this.props,n=e.pauseOnHover,i=e.autoplay;n&&i&&(this.timeout=setTimeout((function(){return t.goNext()}),this.props.duration))}},{key:"moveSlides",value:function(t){"next"===t.currentTarget.dataset.type?this.goNext():this.goBack()}},{key:"goToSlide",value:function(t){var e=t.currentTarget;this.goTo(parseInt(e.dataset.key))}},{key:"goTo",value:function(t){this.slideImages(t)}},{key:"goNext",value:function(){var t=this.state.index,e=this.props,n=e.children;(e.infinite||t!==n.length-1)&&this.slideImages(t+1)}},{key:"goBack",value:function(){var t=this.state.index;(this.props.infinite||0!==t)&&this.slideImages(t-1)}},{key:"showIndicators",value:function(){var t=this,e="boolean"!=typeof this.props.indicators,n=!e&&"each-slideshow-indicator";return r.a.createElement("div",{className:"indicators"},this.props.children.map((function(i,o){return r.a.createElement("div",{key:o,"data-key":o,className:"".concat(n," ").concat(t.state.index===o&&"active"),onClick:t.goToSlide},e&&t.props.indicators(o))})))}},{key:"showPreviousArrow",value:function(){var t=this.props,e=t.arrows,n=t.prevArrow,i=t.infinite,o="";return n||(o="nav ".concat(this.state.index<=0&&!i&&"disabled")),e&&r.a.createElement("div",{className:o,"data-type":"prev",onClick:this.moveSlides},n||r.a.createElement("span",null))}},{key:"showNextArrow",value:function(){var t=this.props,e=t.arrows,n=t.nextArrow,i=t.infinite,o=t.children,a="";return n||(a="nav ".concat(this.state.index===o.length-1&&!i&&"disabled")),e&&r.a.createElement("div",{className:a,"data-type":"next",onClick:this.moveSlides},n||r.a.createElement("span",null))}},{key:"render",value:function(){var t=this,n=this.props,i=n.children,o=(n.infinite,n.indicators),a=(n.arrows,c(e.propTypes,this.props)),s=this.state.index,u={transform:"translate(-".concat((s+1)*this.width,"px)")};return r.a.createElement("div",a,r.a.createElement("div",{className:"react-slideshow-container",onMouseEnter:this.pauseSlides,onMouseLeave:this.startSlides,ref:this.reactSlideshowWrapper},this.showPreviousArrow(),r.a.createElement("div",{className:"react-slideshow-wrapper slide",ref:function(e){return t.wrapper=e}},r.a.createElement("div",{className:"images-wrap",style:u,ref:function(e){return t.imageContainer=e}},r.a.createElement("div",{"data-index":"-1"},i[i.length-1]),i.map((function(t,e){return r.a.createElement("div",{"data-index":e,key:e,className:e===s?"active":""},t)})),r.a.createElement("div",{"data-index":"-1"},i[0]))),this.showNextArrow()),o&&this.showIndicators())}},{key:"slideImages",value:function(t){var e=this,n=this.props,i=n.children,r=n.transitionDuration,a=n.autoplay,s=n.infinite,u=n.duration,c=n.onChange;if(!this.tweenGroup.getAll().length){clearTimeout(this.timeout);var l={margin:-this.width*(this.state.index+1)},h=new o.a.Tween(l,this.tweenGroup).to({margin:-this.width*(t+1)},r).onUpdate((function(t){e.imageContainer.style.transform="translate(".concat(t.margin,"px)")})).start();!function t(){e.willUnmount?e.tweenGroup.removeAll():(requestAnimationFrame(t),e.tweenGroup.update())}(),h.onComplete((function(){var n=t<0?i.length-1:t>=i.length?0:t;e.willUnmount||("function"==typeof c&&c(e.state.index,n),e.setState({index:n},(function(){a&&(s||e.state.index<i.length)&&(e.timeout=setTimeout((function(){return e.goNext()}),u))})))}))}}}])&&h(n.prototype,s),u&&h(n,u),e}(i.Component);v.defaultProps={duration:5e3,transitionDuration:1e3,defaultIndex:0,infinite:!0,autoplay:!0,indicators:!1,arrows:!0,pauseOnHover:!1},v.propTypes={duration:u.a.number,transitionDuration:u.a.number,defaultIndex:u.a.number,infinite:u.a.bool,indicators:u.a.oneOfType([u.a.bool,u.a.func]),autoplay:u.a.bool,arrows:u.a.bool,onChange:u.a.func,pauseOnHover:u.a.bool,prevArrow:u.a.oneOfType([u.a.object,u.a.func]),nextArrow:u.a.oneOfType([u.a.object,u.a.func])};var y=v;function m(t){return(m="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t})(t)}function b(t,e){for(var n=0;n<e.length;n++){var i=e[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}function w(t){return(w=Object.setPrototypeOf?Object.getPrototypeOf:function(t){return t.__proto__||Object.getPrototypeOf(t)})(t)}function _(t){if(void 0===t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return t}function g(t,e){return(g=Object.setPrototypeOf||function(t,e){return t.__proto__=e,t})(t,e)}var O=function(t){function e(t){var n;return function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,e),(n=function(t,e){return!e||"object"!==m(e)&&"function"!=typeof e?_(t):e}(this,w(e).call(this,t))).state={index:t.defaultIndex&&t.defaultIndex<t.children.length?t.defaultIndex:0},n.width=0,n.timeout=null,n.divsContainer=null,n.wrapper=null,n.setWidth=n.setWidth.bind(_(n)),n.handleResize=n.handleResize.bind(_(n)),n.navigate=n.navigate.bind(_(n)),n.preFade=n.preFade.bind(_(n)),n.pauseSlides=n.pauseSlides.bind(_(n)),n.startSlides=n.startSlides.bind(_(n)),n.initResizeObserver=n.initResizeObserver.bind(_(n)),n.tweenGroup=new o.a.Group,n.reactSlideshowWrapper=Object(i.createRef)(),n.wrapper=Object(i.createRef)(),n}var n,s,u;return function(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function");t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,writable:!0,configurable:!0}}),e&&g(t,e)}(e,t),n=e,(s=[{key:"componentDidMount",value:function(){this.setWidth(),this.play(),this.initResizeObserver()}},{key:"initResizeObserver",value:function(){var t=this;this.resizeObserver=new a.a((function(e){e&&t.handleResize()})),this.resizeObserver.observe(this.reactSlideshowWrapper.current)}},{key:"play",value:function(){var t=this,e=this.props,n=e.autoplay,i=e.children,r=this.state.index;n&&i.length>1&&(clearTimeout(this.timeout),this.timeout=setTimeout((function(){return t.fadeImages(r+1)}),this.props.duration))}},{key:"componentDidUpdate",value:function(t){this.props.autoplay!==t.autoplay&&(this.props.autoplay?this.play():clearTimeout(this.timeout)),this.props.children.length!=t.children.length&&(this.applyStyle(),this.play())}},{key:"componentWillUnmount",value:function(){this.willUnmount=!0,clearTimeout(this.timeout),this.removeResizeObserver()}},{key:"removeResizeObserver",value:function(){this.resizeObserver&&this.reactSlideshowWrapper&&this.reactSlideshowWrapper.current&&this.resizeObserver.unobserve(this.reactSlideshowWrapper.current)}},{key:"setWidth",value:function(){this.width=this.wrapper.current.clientWidth,this.applyStyle()}},{key:"handleResize",value:function(){this.setWidth()}},{key:"applyStyle",value:function(){var t=this.width*this.props.children.length;this.divsContainer.style.width="".concat(t,"px");for(var e=0;e<this.divsContainer.children.length;e++){var n=this.divsContainer.children[e];n&&(n.style.width="".concat(this.width,"px"),n.style.left="".concat(e*-this.width,"px"))}}},{key:"pauseSlides",value:function(){this.props.pauseOnHover&&clearTimeout(this.timeout)}},{key:"startSlides",value:function(){var t=this,e=this.props,n=e.pauseOnHover,i=e.autoplay;n&&i&&(this.timeout=setTimeout((function(){return t.goNext()}),this.props.duration))}},{key:"goNext",value:function(){var t=this.state.index,e=this.props,n=e.children;(e.infinite||t!==n.length-1)&&this.fadeImages((t+1)%n.length)}},{key:"goBack",value:function(){var t=this.state.index,e=this.props,n=e.children;(e.infinite||0!==t)&&this.fadeImages(0===t?n.length-1:t-1)}},{key:"navigate",value:function(t){var e=t.currentTarget.dataset;e.key!=this.state.index&&this.goTo(parseInt(e.key))}},{key:"goTo",value:function(t){this.fadeImages(t)}},{key:"preFade",value:function(t){"prev"===t.currentTarget.dataset.type?this.goBack():this.goNext()}},{key:"showIndicators",value:function(){var t=this,e="boolean"!=typeof this.props.indicators,n=!e&&"each-slideshow-indicator";return r.a.createElement("div",{className:"indicators"},this.props.children.map((function(i,o){return r.a.createElement("div",{key:o,"data-key":o,className:"".concat(n," ").concat(t.state.index===o&&"active"),onClick:t.navigate},e&&t.props.indicators(o))})))}},{key:"showPreviousArrow",value:function(){var t=this.props,e=t.arrows,n=t.prevArrow,i=t.infinite,o="";return n||(o="nav ".concat(this.state.index<=0&&!i&&"disabled")),e&&r.a.createElement("div",{className:o,"data-type":"prev",onClick:this.preFade},n||r.a.createElement("span",null))}},{key:"showNextArrow",value:function(){var t=this.props,e=t.arrows,n=t.nextArrow,i=t.infinite,o=t.children,a="";return n||(a="nav ".concat(this.state.index===o.length-1&&!i&&"disabled")),e&&r.a.createElement("div",{className:a,"data-type":"next",onClick:this.preFade},n||r.a.createElement("span",null))}},{key:"render",value:function(){var t=this,n=this.props,i=n.indicators,o=n.children,a=this.state.index,s=c(e.propTypes,this.props);return r.a.createElement("div",s,r.a.createElement("div",{className:"react-slideshow-container",onMouseEnter:this.pauseSlides,onMouseLeave:this.startSlides,ref:this.reactSlideshowWrapper},this.showPreviousArrow(),r.a.createElement("div",{className:"react-slideshow-fade-wrapper",ref:this.wrapper},r.a.createElement("div",{className:"react-slideshow-fade-images-wrap",ref:function(e){return t.divsContainer=e}},o.map((function(t,e){return r.a.createElement("div",{style:{opacity:e===a?"1":"0",zIndex:e===a?"1":"0"},"data-index":e,key:e},t)})))),this.showNextArrow()),i&&this.showIndicators())}},{key:"fadeImages",value:function(t){var e=this,n=this.state.index,i=this.props,r=i.autoplay,a=i.children,s=i.infinite,u=i.duration,c=i.transitionDuration,l=i.onChange;this.tweenGroup.getAll().length||(this.divsContainer.children[t]||(t=0),clearTimeout(this.timeout),function t(){e.willUnmount?e.tweenGroup.removeAll():(requestAnimationFrame(t),e.tweenGroup.update())}(),new o.a.Tween({opacity:0},this.tweenGroup).to({opacity:1},c).onUpdate((function(i){e.divsContainer.children[t].style.opacity=i.opacity,e.divsContainer.children[n].style.opacity=1-i.opacity})).start().onComplete((function(){e.willUnmount||(e.setState({index:t}),"function"==typeof l&&l(n,t),r&&(s||t<a.length-1)&&(clearTimeout(e.timeout),e.timeout=setTimeout((function(){e.fadeImages((t+1)%a.length)}),u)))})))}}])&&b(n.prototype,s),u&&b(n,u),e}(i.Component);O.defaultProps={duration:5e3,transitionDuration:1e3,defaultIndex:0,indicators:!1,arrows:!0,autoplay:!0,infinite:!0,pauseOnHover:!1},O.propTypes={duration:u.a.number,transitionDuration:u.a.number,defaultIndex:u.a.number,indicators:u.a.oneOfType([u.a.bool,u.a.func]),arrows:u.a.bool,autoplay:u.a.bool,infinite:u.a.bool,onChange:u.a.func,pauseOnHover:u.a.bool,prevArrow:u.a.oneOfType([u.a.object,u.a.func]),nextArrow:u.a.oneOfType([u.a.object,u.a.func])};var T=O;function k(t){return(k="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t})(t)}function x(t,e){for(var n=0;n<e.length;n++){var i=e[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}function S(t){return(S=Object.setPrototypeOf?Object.getPrototypeOf:function(t){return t.__proto__||Object.getPrototypeOf(t)})(t)}function E(t){if(void 0===t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return t}function C(t,e){return(C=Object.setPrototypeOf||function(t,e){return t.__proto__=e,t})(t,e)}var I=function(t){function e(t){var n;return function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,e),(n=function(t,e){return!e||"object"!==k(e)&&"function"!=typeof e?E(t):e}(this,S(e).call(this,t))).state={index:t.defaultIndex&&t.defaultIndex<t.children.length?t.defaultIndex:0},n.width=0,n.timeout=null,n.divsContainer=null,n.wrapper=null,n.setWidth=n.setWidth.bind(E(n)),n.handleResize=n.handleResize.bind(E(n)),n.navigate=n.navigate.bind(E(n)),n.preZoom=n.preZoom.bind(E(n)),n.pauseSlides=n.pauseSlides.bind(E(n)),n.startSlides=n.startSlides.bind(E(n)),n.tweenGroup=new o.a.Group,n.initResizeObserver=n.initResizeObserver.bind(E(n)),n.reactSlideshowWrapper=Object(i.createRef)(),n}var n,a,s;return function(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function");t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,writable:!0,configurable:!0}}),e&&C(t,e)}(e,t),n=e,(a=[{key:"componentDidMount",value:function(){this.setWidth(),this.play(),this.initResizeObserver()}},{key:"initResizeObserver",value:function(){var t=this;this.resizeObserver=new ResizeObserver((function(e){e&&t.handleResize()})),this.resizeObserver.observe(this.reactSlideshowWrapper.current)}},{key:"play",value:function(){var t=this,e=this.props,n=e.autoplay,i=e.children,r=this.state.index;n&&i.length>1&&(clearTimeout(this.timeout),this.timeout=setTimeout((function(){return t.zoomTo(r+1)}),this.props.duration))}},{key:"componentWillUnmount",value:function(){this.willUnmount=!0,clearTimeout(this.timeout),this.removeResizeObserver()}},{key:"removeResizeObserver",value:function(){this.resizeObserver&&this.reactSlideshowWrapper&&this.reactSlideshowWrapper.current&&this.resizeObserver.unobserve(this.reactSlideshowWrapper.current)}},{key:"componentDidUpdate",value:function(t){this.props.autoplay!==t.autoplay&&(this.props.autoplay?this.play():clearTimeout(this.timeout)),this.props.children.length!=t.children.length&&(this.applyStyle(),this.play())}},{key:"setWidth",value:function(){this.width=this.wrapper.clientWidth,this.applyStyle()}},{key:"handleResize",value:function(){this.setWidth()}},{key:"applyStyle",value:function(){var t=this.width*this.props.children.length;this.divsContainer.style.width="".concat(t,"px");for(var e=0;e<this.divsContainer.children.length;e++){var n=this.divsContainer.children[e];n&&(n.style.width="".concat(this.width,"px"),n.style.left="".concat(e*-this.width,"px"))}}},{key:"pauseSlides",value:function(){this.props.pauseOnHover&&clearTimeout(this.timeout)}},{key:"startSlides",value:function(){var t=this,e=this.props,n=e.pauseOnHover,i=e.autoplay;n&&i&&(this.timeout=setTimeout((function(){return t.goNext()}),this.props.duration))}},{key:"goNext",value:function(){var t=this.state.index,e=this.props,n=e.children;(e.infinite||t!==n.length-1)&&this.zoomTo((t+1)%n.length)}},{key:"goBack",value:function(){var t=this.state.index,e=this.props,n=e.children;(e.infinite||0!==t)&&this.zoomTo(0===t?n.length-1:t-1)}},{key:"goTo",value:function(t){this.zoomTo(t)}},{key:"navigate",value:function(t){var e=t.currentTarget.dataset;e.key!=this.state.index&&this.goTo(parseInt(e.key))}},{key:"preZoom",value:function(t){"prev"===t.currentTarget.dataset.type?this.goBack():this.goNext()}},{key:"showIndicators",value:function(){var t=this,e="boolean"!=typeof this.props.indicators,n=!e&&"each-slideshow-indicator";return r.a.createElement("div",{className:"indicators"},this.props.children.map((function(i,o){return r.a.createElement("div",{key:o,"data-key":o,className:"".concat(n," ").concat(t.state.index===o&&"active"),onClick:t.navigate},e&&t.props.indicators(o))})))}},{key:"showPreviousArrow",value:function(){var t=this.props,e=t.arrows,n=t.prevArrow,i=t.infinite,o="";return n||(o="nav ".concat(this.state.index<=0&&!i&&"disabled")),e&&r.a.createElement("div",{className:o,"data-type":"prev",onClick:this.preZoom},n||r.a.createElement("span",null))}},{key:"showNextArrow",value:function(){var t=this.props,e=t.arrows,n=t.nextArrow,i=t.infinite,o=t.children,a="";return n||(a="nav ".concat(this.state.index===o.length-1&&!i&&"disabled")),e&&r.a.createElement("div",{className:a,"data-type":"next",onClick:this.preZoom},n||r.a.createElement("span",null))}},{key:"render",value:function(){var t=this,n=this.props,i=n.indicators,o=(n.arrows,n.infinite,n.children),a=this.state.index,s=c(e.propTypes,this.props);return r.a.createElement("div",s,r.a.createElement("div",{className:"react-slideshow-container",onMouseEnter:this.pauseSlides,onMouseLeave:this.startSlides,ref:this.reactSlideshowWrapper},this.showPreviousArrow(),r.a.createElement("div",{className:"react-slideshow-zoom-wrapper",ref:function(e){return t.wrapper=e}},r.a.createElement("div",{className:"zoom-wrapper",ref:function(e){return t.divsContainer=e}},o.map((function(t,e){return r.a.createElement("div",{style:{opacity:e===a?"1":"0",zIndex:e===a?"1":"0"},"data-index":e,key:e},t)})))),this.showNextArrow()),i&&this.showIndicators())}},{key:"zoomTo",value:function(t){var e=this,n=this.state.index,i=this.props,r=i.children,a=i.scale,s=i.autoplay,u=i.infinite,c=i.transitionDuration,l=i.duration,h=i.onChange;this.tweenGroup.getAll().length||(this.divsContainer.children[t]||(t=0),clearTimeout(this.timeout),function t(){e.willUnmount?e.tweenGroup.removeAll():(requestAnimationFrame(t),e.tweenGroup.update())}(),new o.a.Tween({opacity:0,scale:1},this.tweenGroup).to({opacity:1,scale:a},c).onUpdate((function(i){e.divsContainer.children[t].style.opacity=i.opacity,e.divsContainer.children[n].style.opacity=1-i.opacity,e.divsContainer.children[n].style.transform="scale(".concat(i.scale,")")})).start().onComplete((function(){e.willUnmount||("function"==typeof h&&h(n,t),e.setState({index:t},(function(){e.divsContainer.children[n].style.transform="scale(1)"})),s&&(u||t<r.length-1)&&(clearTimeout(e.timeout),e.timeout=setTimeout((function(){e.zoomTo((t+1)%r.length)}),l)))})))}}])&&x(n.prototype,a),s&&x(n,s),e}(i.Component);I.defaultProps={duration:5e3,transitionDuration:1e3,defaultIndex:0,indicators:!1,arrows:!0,autoplay:!0,infinite:!0,pauseOnHover:!1},I.propTypes={duration:u.a.number,transitionDuration:u.a.number,defaultIndex:u.a.number,indicators:u.a.oneOfType([u.a.bool,u.a.func]),scale:u.a.number.isRequired,arrows:u.a.bool,autoplay:u.a.bool,infinite:u.a.bool,onChange:u.a.func,pauseOnHover:u.a.bool,prevArrow:u.a.oneOfType([u.a.object,u.a.func]),nextArrow:u.a.oneOfType([u.a.object,u.a.func])};var R=I}])}));
|
|
1
|
+
!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e(require("react")):"function"==typeof define&&define.amd?define(["react"],e):"object"==typeof exports?exports["react-slideshow-image"]=e(require("react")):t["react-slideshow-image"]=e(t.React)}(this,(function(t){return function(t){var e={};function n(i){if(e[i])return e[i].exports;var r=e[i]={i:i,l:!1,exports:{}};return t[i].call(r.exports,r,r.exports,n),r.l=!0,r.exports}return n.m=t,n.c=e,n.d=function(t,e,i){n.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:i})},n.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},n.t=function(t,e){if(1&e&&(t=n(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var i=Object.create(null);if(n.r(i),Object.defineProperty(i,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var r in t)n.d(i,r,function(e){return t[e]}.bind(null,r));return i},n.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return n.d(e,"a",e),e},n.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},n.p="",n(n.s=8)}([function(t,e,n){t.exports=n(6)()},function(e,n){e.exports=t},function(t,e,n){"use strict";(function(t){var n=function(){this._tweens={},this._tweensAddedDuringUpdate={}};n.prototype={getAll:function(){return Object.keys(this._tweens).map(function(t){return this._tweens[t]}.bind(this))},removeAll:function(){this._tweens={}},add:function(t){this._tweens[t.getId()]=t,this._tweensAddedDuringUpdate[t.getId()]=t},remove:function(t){delete this._tweens[t.getId()],delete this._tweensAddedDuringUpdate[t.getId()]},update:function(t,e){var n=Object.keys(this._tweens);if(0===n.length)return!1;for(t=void 0!==t?t:r.now();n.length>0;){this._tweensAddedDuringUpdate={};for(var i=0;i<n.length;i++){var o=this._tweens[n[i]];o&&!1===o.update(t)&&(o._isPlaying=!1,e||delete this._tweens[n[i]])}n=Object.keys(this._tweensAddedDuringUpdate)}return!0}};var i,r=new n;r.Group=n,r._nextId=0,r.nextId=function(){return r._nextId++},"undefined"==typeof self&&void 0!==t&&t.hrtime?r.now=function(){var e=t.hrtime();return 1e3*e[0]+e[1]/1e6}:"undefined"!=typeof self&&void 0!==self.performance&&void 0!==self.performance.now?r.now=self.performance.now.bind(self.performance):void 0!==Date.now?r.now=Date.now:r.now=function(){return(new Date).getTime()},r.Tween=function(t,e){this._object=t,this._valuesStart={},this._valuesEnd={},this._valuesStartRepeat={},this._duration=1e3,this._repeat=0,this._repeatDelayTime=void 0,this._yoyo=!1,this._isPlaying=!1,this._reversed=!1,this._delayTime=0,this._startTime=null,this._easingFunction=r.Easing.Linear.None,this._interpolationFunction=r.Interpolation.Linear,this._chainedTweens=[],this._onStartCallback=null,this._onStartCallbackFired=!1,this._onUpdateCallback=null,this._onRepeatCallback=null,this._onCompleteCallback=null,this._onStopCallback=null,this._group=e||r,this._id=r.nextId()},r.Tween.prototype={getId:function(){return this._id},isPlaying:function(){return this._isPlaying},to:function(t,e){return this._valuesEnd=Object.create(t),void 0!==e&&(this._duration=e),this},duration:function(t){return this._duration=t,this},start:function(t){for(var e in this._group.add(this),this._isPlaying=!0,this._onStartCallbackFired=!1,this._startTime=void 0!==t?"string"==typeof t?r.now()+parseFloat(t):t:r.now(),this._startTime+=this._delayTime,this._valuesEnd){if(this._valuesEnd[e]instanceof Array){if(0===this._valuesEnd[e].length)continue;this._valuesEnd[e]=[this._object[e]].concat(this._valuesEnd[e])}void 0!==this._object[e]&&(this._valuesStart[e]=this._object[e],this._valuesStart[e]instanceof Array==!1&&(this._valuesStart[e]*=1),this._valuesStartRepeat[e]=this._valuesStart[e]||0)}return this},stop:function(){return this._isPlaying?(this._group.remove(this),this._isPlaying=!1,null!==this._onStopCallback&&this._onStopCallback(this._object),this.stopChainedTweens(),this):this},end:function(){return this.update(1/0),this},stopChainedTweens:function(){for(var t=0,e=this._chainedTweens.length;t<e;t++)this._chainedTweens[t].stop()},group:function(t){return this._group=t,this},delay:function(t){return this._delayTime=t,this},repeat:function(t){return this._repeat=t,this},repeatDelay:function(t){return this._repeatDelayTime=t,this},yoyo:function(t){return this._yoyo=t,this},easing:function(t){return this._easingFunction=t,this},interpolation:function(t){return this._interpolationFunction=t,this},chain:function(){return this._chainedTweens=arguments,this},onStart:function(t){return this._onStartCallback=t,this},onUpdate:function(t){return this._onUpdateCallback=t,this},onRepeat:function(t){return this._onRepeatCallback=t,this},onComplete:function(t){return this._onCompleteCallback=t,this},onStop:function(t){return this._onStopCallback=t,this},update:function(t){var e,n,i;if(t<this._startTime)return!0;for(e in!1===this._onStartCallbackFired&&(null!==this._onStartCallback&&this._onStartCallback(this._object),this._onStartCallbackFired=!0),n=(t-this._startTime)/this._duration,n=0===this._duration||n>1?1:n,i=this._easingFunction(n),this._valuesEnd)if(void 0!==this._valuesStart[e]){var r=this._valuesStart[e]||0,o=this._valuesEnd[e];o instanceof Array?this._object[e]=this._interpolationFunction(o,i):("string"==typeof o&&(o="+"===o.charAt(0)||"-"===o.charAt(0)?r+parseFloat(o):parseFloat(o)),"number"==typeof o&&(this._object[e]=r+(o-r)*i))}if(null!==this._onUpdateCallback&&this._onUpdateCallback(this._object,n),1===n){if(this._repeat>0){for(e in isFinite(this._repeat)&&this._repeat--,this._valuesStartRepeat){if("string"==typeof this._valuesEnd[e]&&(this._valuesStartRepeat[e]=this._valuesStartRepeat[e]+parseFloat(this._valuesEnd[e])),this._yoyo){var a=this._valuesStartRepeat[e];this._valuesStartRepeat[e]=this._valuesEnd[e],this._valuesEnd[e]=a}this._valuesStart[e]=this._valuesStartRepeat[e]}return this._yoyo&&(this._reversed=!this._reversed),void 0!==this._repeatDelayTime?this._startTime=t+this._repeatDelayTime:this._startTime=t+this._delayTime,null!==this._onRepeatCallback&&this._onRepeatCallback(this._object),!0}null!==this._onCompleteCallback&&this._onCompleteCallback(this._object);for(var s=0,u=this._chainedTweens.length;s<u;s++)this._chainedTweens[s].start(this._startTime+this._duration);return!1}return!0}},r.Easing={Linear:{None:function(t){return t}},Quadratic:{In:function(t){return t*t},Out:function(t){return t*(2-t)},InOut:function(t){return(t*=2)<1?.5*t*t:-.5*(--t*(t-2)-1)}},Cubic:{In:function(t){return t*t*t},Out:function(t){return--t*t*t+1},InOut:function(t){return(t*=2)<1?.5*t*t*t:.5*((t-=2)*t*t+2)}},Quartic:{In:function(t){return t*t*t*t},Out:function(t){return 1- --t*t*t*t},InOut:function(t){return(t*=2)<1?.5*t*t*t*t:-.5*((t-=2)*t*t*t-2)}},Quintic:{In:function(t){return t*t*t*t*t},Out:function(t){return--t*t*t*t*t+1},InOut:function(t){return(t*=2)<1?.5*t*t*t*t*t:.5*((t-=2)*t*t*t*t+2)}},Sinusoidal:{In:function(t){return 1-Math.cos(t*Math.PI/2)},Out:function(t){return Math.sin(t*Math.PI/2)},InOut:function(t){return.5*(1-Math.cos(Math.PI*t))}},Exponential:{In:function(t){return 0===t?0:Math.pow(1024,t-1)},Out:function(t){return 1===t?1:1-Math.pow(2,-10*t)},InOut:function(t){return 0===t?0:1===t?1:(t*=2)<1?.5*Math.pow(1024,t-1):.5*(2-Math.pow(2,-10*(t-1)))}},Circular:{In:function(t){return 1-Math.sqrt(1-t*t)},Out:function(t){return Math.sqrt(1- --t*t)},InOut:function(t){return(t*=2)<1?-.5*(Math.sqrt(1-t*t)-1):.5*(Math.sqrt(1-(t-=2)*t)+1)}},Elastic:{In:function(t){return 0===t?0:1===t?1:-Math.pow(2,10*(t-1))*Math.sin(5*(t-1.1)*Math.PI)},Out:function(t){return 0===t?0:1===t?1:Math.pow(2,-10*t)*Math.sin(5*(t-.1)*Math.PI)+1},InOut:function(t){return 0===t?0:1===t?1:(t*=2)<1?-.5*Math.pow(2,10*(t-1))*Math.sin(5*(t-1.1)*Math.PI):.5*Math.pow(2,-10*(t-1))*Math.sin(5*(t-1.1)*Math.PI)+1}},Back:{In:function(t){var e=1.70158;return t*t*((e+1)*t-e)},Out:function(t){var e=1.70158;return--t*t*((e+1)*t+e)+1},InOut:function(t){var e=2.5949095;return(t*=2)<1?t*t*((e+1)*t-e)*.5:.5*((t-=2)*t*((e+1)*t+e)+2)}},Bounce:{In:function(t){return 1-r.Easing.Bounce.Out(1-t)},Out:function(t){return t<1/2.75?7.5625*t*t:t<2/2.75?7.5625*(t-=1.5/2.75)*t+.75:t<2.5/2.75?7.5625*(t-=2.25/2.75)*t+.9375:7.5625*(t-=2.625/2.75)*t+.984375},InOut:function(t){return t<.5?.5*r.Easing.Bounce.In(2*t):.5*r.Easing.Bounce.Out(2*t-1)+.5}}},r.Interpolation={Linear:function(t,e){var n=t.length-1,i=n*e,o=Math.floor(i),a=r.Interpolation.Utils.Linear;return e<0?a(t[0],t[1],i):e>1?a(t[n],t[n-1],n-i):a(t[o],t[o+1>n?n:o+1],i-o)},Bezier:function(t,e){for(var n=0,i=t.length-1,o=Math.pow,a=r.Interpolation.Utils.Bernstein,s=0;s<=i;s++)n+=o(1-e,i-s)*o(e,s)*t[s]*a(i,s);return n},CatmullRom:function(t,e){var n=t.length-1,i=n*e,o=Math.floor(i),a=r.Interpolation.Utils.CatmullRom;return t[0]===t[n]?(e<0&&(o=Math.floor(i=n*(1+e))),a(t[(o-1+n)%n],t[o],t[(o+1)%n],t[(o+2)%n],i-o)):e<0?t[0]-(a(t[0],t[0],t[1],t[1],-i)-t[0]):e>1?t[n]-(a(t[n],t[n],t[n-1],t[n-1],i-n)-t[n]):a(t[o?o-1:0],t[o],t[n<o+1?n:o+1],t[n<o+2?n:o+2],i-o)},Utils:{Linear:function(t,e,n){return(e-t)*n+t},Bernstein:function(t,e){var n=r.Interpolation.Utils.Factorial;return n(t)/n(e)/n(t-e)},Factorial:(i=[1],function(t){var e=1;if(i[t])return i[t];for(var n=t;n>1;n--)e*=n;return i[t]=e,e}),CatmullRom:function(t,e,n,i,r){var o=.5*(n-t),a=.5*(i-e),s=r*r;return(2*e-2*n+o+a)*(r*s)+(-3*e+3*n-2*o-a)*s+o*r+e}}},e.a=r}).call(this,n(4))},function(t,e,n){"use strict";(function(t){var n=function(){if("undefined"!=typeof Map)return Map;function t(t,e){var n=-1;return t.some((function(t,i){return t[0]===e&&(n=i,!0)})),n}return function(){function e(){this.__entries__=[]}return Object.defineProperty(e.prototype,"size",{get:function(){return this.__entries__.length},enumerable:!0,configurable:!0}),e.prototype.get=function(e){var n=t(this.__entries__,e),i=this.__entries__[n];return i&&i[1]},e.prototype.set=function(e,n){var i=t(this.__entries__,e);~i?this.__entries__[i][1]=n:this.__entries__.push([e,n])},e.prototype.delete=function(e){var n=this.__entries__,i=t(n,e);~i&&n.splice(i,1)},e.prototype.has=function(e){return!!~t(this.__entries__,e)},e.prototype.clear=function(){this.__entries__.splice(0)},e.prototype.forEach=function(t,e){void 0===e&&(e=null);for(var n=0,i=this.__entries__;n<i.length;n++){var r=i[n];t.call(e,r[1],r[0])}},e}()}(),i="undefined"!=typeof window&&"undefined"!=typeof document&&window.document===document,r=void 0!==t&&t.Math===Math?t:"undefined"!=typeof self&&self.Math===Math?self:"undefined"!=typeof window&&window.Math===Math?window:Function("return this")(),o="function"==typeof requestAnimationFrame?requestAnimationFrame.bind(r):function(t){return setTimeout((function(){return t(Date.now())}),1e3/60)};var a=["top","right","bottom","left","width","height","size","weight"],s="undefined"!=typeof MutationObserver,u=function(){function t(){this.connected_=!1,this.mutationEventsAdded_=!1,this.mutationsObserver_=null,this.observers_=[],this.onTransitionEnd_=this.onTransitionEnd_.bind(this),this.refresh=function(t,e){var n=!1,i=!1,r=0;function a(){n&&(n=!1,t()),i&&u()}function s(){o(a)}function u(){var t=Date.now();if(n){if(t-r<2)return;i=!0}else n=!0,i=!1,setTimeout(s,e);r=t}return u}(this.refresh.bind(this),20)}return t.prototype.addObserver=function(t){~this.observers_.indexOf(t)||this.observers_.push(t),this.connected_||this.connect_()},t.prototype.removeObserver=function(t){var e=this.observers_,n=e.indexOf(t);~n&&e.splice(n,1),!e.length&&this.connected_&&this.disconnect_()},t.prototype.refresh=function(){this.updateObservers_()&&this.refresh()},t.prototype.updateObservers_=function(){var t=this.observers_.filter((function(t){return t.gatherActive(),t.hasActive()}));return t.forEach((function(t){return t.broadcastActive()})),t.length>0},t.prototype.connect_=function(){i&&!this.connected_&&(document.addEventListener("transitionend",this.onTransitionEnd_),window.addEventListener("resize",this.refresh),s?(this.mutationsObserver_=new MutationObserver(this.refresh),this.mutationsObserver_.observe(document,{attributes:!0,childList:!0,characterData:!0,subtree:!0})):(document.addEventListener("DOMSubtreeModified",this.refresh),this.mutationEventsAdded_=!0),this.connected_=!0)},t.prototype.disconnect_=function(){i&&this.connected_&&(document.removeEventListener("transitionend",this.onTransitionEnd_),window.removeEventListener("resize",this.refresh),this.mutationsObserver_&&this.mutationsObserver_.disconnect(),this.mutationEventsAdded_&&document.removeEventListener("DOMSubtreeModified",this.refresh),this.mutationsObserver_=null,this.mutationEventsAdded_=!1,this.connected_=!1)},t.prototype.onTransitionEnd_=function(t){var e=t.propertyName,n=void 0===e?"":e;a.some((function(t){return!!~n.indexOf(t)}))&&this.refresh()},t.getInstance=function(){return this.instance_||(this.instance_=new t),this.instance_},t.instance_=null,t}(),c=function(t,e){for(var n=0,i=Object.keys(e);n<i.length;n++){var r=i[n];Object.defineProperty(t,r,{value:e[r],enumerable:!1,writable:!1,configurable:!0})}return t},l=function(t){return t&&t.ownerDocument&&t.ownerDocument.defaultView||r},h=m(0,0,0,0);function p(t){return parseFloat(t)||0}function d(t){for(var e=[],n=1;n<arguments.length;n++)e[n-1]=arguments[n];return e.reduce((function(e,n){return e+p(t["border-"+n+"-width"])}),0)}function f(t){var e=t.clientWidth,n=t.clientHeight;if(!e&&!n)return h;var i=l(t).getComputedStyle(t),r=function(t){for(var e={},n=0,i=["top","right","bottom","left"];n<i.length;n++){var r=i[n],o=t["padding-"+r];e[r]=p(o)}return e}(i),o=r.left+r.right,a=r.top+r.bottom,s=p(i.width),u=p(i.height);if("border-box"===i.boxSizing&&(Math.round(s+o)!==e&&(s-=d(i,"left","right")+o),Math.round(u+a)!==n&&(u-=d(i,"top","bottom")+a)),!function(t){return t===l(t).document.documentElement}(t)){var c=Math.round(s+o)-e,f=Math.round(u+a)-n;1!==Math.abs(c)&&(s-=c),1!==Math.abs(f)&&(u-=f)}return m(r.left,r.top,s,u)}var v="undefined"!=typeof SVGGraphicsElement?function(t){return t instanceof l(t).SVGGraphicsElement}:function(t){return t instanceof l(t).SVGElement&&"function"==typeof t.getBBox};function y(t){return i?v(t)?function(t){var e=t.getBBox();return m(0,0,e.width,e.height)}(t):f(t):h}function m(t,e,n,i){return{x:t,y:e,width:n,height:i}}var b=function(){function t(t){this.broadcastWidth=0,this.broadcastHeight=0,this.contentRect_=m(0,0,0,0),this.target=t}return t.prototype.isActive=function(){var t=y(this.target);return this.contentRect_=t,t.width!==this.broadcastWidth||t.height!==this.broadcastHeight},t.prototype.broadcastRect=function(){var t=this.contentRect_;return this.broadcastWidth=t.width,this.broadcastHeight=t.height,t},t}(),_=function(t,e){var n,i,r,o,a,s,u,l=(i=(n=e).x,r=n.y,o=n.width,a=n.height,s="undefined"!=typeof DOMRectReadOnly?DOMRectReadOnly:Object,u=Object.create(s.prototype),c(u,{x:i,y:r,width:o,height:a,top:r,right:i+o,bottom:a+r,left:i}),u);c(this,{target:t,contentRect:l})},w=function(){function t(t,e,i){if(this.activeObservations_=[],this.observations_=new n,"function"!=typeof t)throw new TypeError("The callback provided as parameter 1 is not a function.");this.callback_=t,this.controller_=e,this.callbackCtx_=i}return t.prototype.observe=function(t){if(!arguments.length)throw new TypeError("1 argument required, but only 0 present.");if("undefined"!=typeof Element&&Element instanceof Object){if(!(t instanceof l(t).Element))throw new TypeError('parameter 1 is not of type "Element".');var e=this.observations_;e.has(t)||(e.set(t,new b(t)),this.controller_.addObserver(this),this.controller_.refresh())}},t.prototype.unobserve=function(t){if(!arguments.length)throw new TypeError("1 argument required, but only 0 present.");if("undefined"!=typeof Element&&Element instanceof Object){if(!(t instanceof l(t).Element))throw new TypeError('parameter 1 is not of type "Element".');var e=this.observations_;e.has(t)&&(e.delete(t),e.size||this.controller_.removeObserver(this))}},t.prototype.disconnect=function(){this.clearActive(),this.observations_.clear(),this.controller_.removeObserver(this)},t.prototype.gatherActive=function(){var t=this;this.clearActive(),this.observations_.forEach((function(e){e.isActive()&&t.activeObservations_.push(e)}))},t.prototype.broadcastActive=function(){if(this.hasActive()){var t=this.callbackCtx_,e=this.activeObservations_.map((function(t){return new _(t.target,t.broadcastRect())}));this.callback_.call(t,e,t),this.clearActive()}},t.prototype.clearActive=function(){this.activeObservations_.splice(0)},t.prototype.hasActive=function(){return this.activeObservations_.length>0},t}(),g="undefined"!=typeof WeakMap?new WeakMap:new n,O=function t(e){if(!(this instanceof t))throw new TypeError("Cannot call a class as a function.");if(!arguments.length)throw new TypeError("1 argument required, but only 0 present.");var n=u.getInstance(),i=new w(e,n,this);g.set(this,i)};["observe","unobserve","disconnect"].forEach((function(t){O.prototype[t]=function(){var e;return(e=g.get(this))[t].apply(e,arguments)}}));var T=void 0!==r.ResizeObserver?r.ResizeObserver:O;e.a=T}).call(this,n(5))},function(t,e){var n,i,r=t.exports={};function o(){throw new Error("setTimeout has not been defined")}function a(){throw new Error("clearTimeout has not been defined")}function s(t){if(n===setTimeout)return setTimeout(t,0);if((n===o||!n)&&setTimeout)return n=setTimeout,setTimeout(t,0);try{return n(t,0)}catch(e){try{return n.call(null,t,0)}catch(e){return n.call(this,t,0)}}}!function(){try{n="function"==typeof setTimeout?setTimeout:o}catch(t){n=o}try{i="function"==typeof clearTimeout?clearTimeout:a}catch(t){i=a}}();var u,c=[],l=!1,h=-1;function p(){l&&u&&(l=!1,u.length?c=u.concat(c):h=-1,c.length&&d())}function d(){if(!l){var t=s(p);l=!0;for(var e=c.length;e;){for(u=c,c=[];++h<e;)u&&u[h].run();h=-1,e=c.length}u=null,l=!1,function(t){if(i===clearTimeout)return clearTimeout(t);if((i===a||!i)&&clearTimeout)return i=clearTimeout,clearTimeout(t);try{i(t)}catch(e){try{return i.call(null,t)}catch(e){return i.call(this,t)}}}(t)}}function f(t,e){this.fun=t,this.array=e}function v(){}r.nextTick=function(t){var e=new Array(arguments.length-1);if(arguments.length>1)for(var n=1;n<arguments.length;n++)e[n-1]=arguments[n];c.push(new f(t,e)),1!==c.length||l||s(d)},f.prototype.run=function(){this.fun.apply(null,this.array)},r.title="browser",r.browser=!0,r.env={},r.argv=[],r.version="",r.versions={},r.on=v,r.addListener=v,r.once=v,r.off=v,r.removeListener=v,r.removeAllListeners=v,r.emit=v,r.prependListener=v,r.prependOnceListener=v,r.listeners=function(t){return[]},r.binding=function(t){throw new Error("process.binding is not supported")},r.cwd=function(){return"/"},r.chdir=function(t){throw new Error("process.chdir is not supported")},r.umask=function(){return 0}},function(t,e){var n;n=function(){return this}();try{n=n||new Function("return this")()}catch(t){"object"==typeof window&&(n=window)}t.exports=n},function(t,e,n){"use strict";var i=n(7);function r(){}function o(){}o.resetWarningCache=r,t.exports=function(){function t(t,e,n,r,o,a){if(a!==i){var s=new Error("Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types");throw s.name="Invariant Violation",s}}function e(){return t}t.isRequired=t;var n={array:t,bool:t,func:t,number:t,object:t,string:t,symbol:t,any:t,arrayOf:e,element:t,elementType:t,instanceOf:e,node:t,objectOf:e,oneOf:e,oneOfType:e,shape:e,exact:e,checkPropTypes:o,resetWarningCache:r};return n.PropTypes=n,n}},function(t,e,n){"use strict";t.exports="SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED"},function(t,e,n){"use strict";n.r(e),n.d(e,"Slide",(function(){return S})),n.d(e,"Fade",(function(){return M})),n.d(e,"Zoom",(function(){return F}));var i=n(1),r=n.n(i),o=n(2),a=n(3),s=n(0),u=n.n(s);function c(){return(c=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&(t[i]=n[i])}return t}).apply(this,arguments)}function l(t,e){var n=Object.keys(t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(t);e&&(i=i.filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable}))),n.push.apply(n,i)}return n}function h(t){for(var e=1;e<arguments.length;e++){var n=null!=arguments[e]?arguments[e]:{};e%2?l(n,!0).forEach((function(e){p(t,e,n[e])})):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(n)):l(n).forEach((function(e){Object.defineProperty(t,e,Object.getOwnPropertyDescriptor(n,e))}))}return t}function p(t,e,n){return e in t?Object.defineProperty(t,e,{value:n,enumerable:!0,configurable:!0,writable:!0}):t[e]=n,t}var d=function(t,e){var n=Object.keys(t);return Object.keys(e).reduce((function(t,i){return-1===n.indexOf(i)&&(t[i]=e[i]),t}),{})},f=function(t,e,n){var i=t.prevArrow,o=t.infinite,a=e<=0&&!o,s={"data-type":"prev","aria-label":"Previous Slide",disabled:a,onClick:n};if(i)return r.a.cloneElement(i,h({className:"".concat(i.props.className," nav ").concat(a?"disabled":"")},s));var u="nav default-nav ".concat(a?"disabled":"");return r.a.createElement("button",c({className:u},s),r.a.createElement("span",null))},v=function(t,e,n){var i=t.nextArrow,o=t.infinite,a=e===t.children.length-1&&!o,s={"data-type":"next","aria-label":"Next Slide",disabled:a,onClick:n};if(i)return r.a.cloneElement(i,h({className:"".concat(i.props.className," nav ").concat(a?"disabled":"")},s));var u="nav default-nav ".concat(a?"disabled":"");return r.a.createElement("button",c({className:u},s),r.a.createElement("span",null))},y=function(t,e,n){var i=t.children,o=t.indicators,a="boolean"!=typeof o;return r.a.createElement("div",{className:"indicators"},i.map((function(t,i){var s={"data-key":i,"aria-label":"Go to slide ".concat(i+1),onClick:n};return a?function(t,e,n,i){return r.a.cloneElement(i,h({className:"".concat(i.props.className," ").concat(t===e?"active":""),key:e},n))}(e,i,s,o(i)):function(t,e,n){return r.a.createElement("li",{key:e},r.a.createElement("button",c({className:"each-slideshow-indicator ".concat(t===e?"active":"")},n)))}(e,i,s)})))};function m(t){return(m="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t})(t)}function b(){return(b=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&(t[i]=n[i])}return t}).apply(this,arguments)}function _(t,e){for(var n=0;n<e.length;n++){var i=e[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}function w(t){return(w=Object.setPrototypeOf?Object.getPrototypeOf:function(t){return t.__proto__||Object.getPrototypeOf(t)})(t)}function g(t){if(void 0===t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return t}function O(t,e){return(O=Object.setPrototypeOf||function(t,e){return t.__proto__=e,t})(t,e)}var T=function(t){function e(t){var n;return function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,e),(n=function(t,e){return!e||"object"!==m(e)&&"function"!=typeof e?g(t):e}(this,w(e).call(this,t))).state={index:t.defaultIndex&&t.defaultIndex<t.children.length?t.defaultIndex:0},n.width=0,n.imageContainer=null,n.wrapper=null,n.timeout=null,n.moveSlides=n.moveSlides.bind(g(n)),n.pauseSlides=n.pauseSlides.bind(g(n)),n.startSlides=n.startSlides.bind(g(n)),n.handleResize=n.handleResize.bind(g(n)),n.initResizeObserver=n.initResizeObserver.bind(g(n)),n.reactSlideshowWrapper=Object(i.createRef)(),n.goToSlide=n.goToSlide.bind(g(n)),n.tweenGroup=new o.a.Group,n}var n,s,u;return function(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function");t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,writable:!0,configurable:!0}}),e&&O(t,e)}(e,t),n=e,(s=[{key:"componentDidMount",value:function(){var t=this;this.setWidth(),this.initResizeObserver();var e=this.props,n=e.autoplay,i=e.duration;n&&(this.timeout=setTimeout((function(){return t.goNext()}),i))}},{key:"initResizeObserver",value:function(){var t=this;this.resizeObserver=new a.a((function(e){e&&t.handleResize()})),this.resizeObserver.observe(this.reactSlideshowWrapper.current)}},{key:"componentWillUnmount",value:function(){this.willUnmount=!0,clearTimeout(this.timeout),this.removeResizeObserver()}},{key:"removeResizeObserver",value:function(){this.resizeObserver&&this.reactSlideshowWrapper&&this.reactSlideshowWrapper.current&&this.resizeObserver.unobserve(this.reactSlideshowWrapper.current)}},{key:"setWidth",value:function(){this.allImages=Array.prototype.slice.call(this.wrapper.querySelectorAll(".images-wrap > div"),0),this.width=this.wrapper.clientWidth;var t=this.width*(this.props.children.length+2);this.imageContainer.style.width="".concat(t,"px"),this.imageContainer.style.transform="translate(-".concat(this.width*(this.state.index+1),"px)"),this.applySlideStyle()}},{key:"componentDidUpdate",value:function(t){var e=this;this.props.autoplay!==t.autoplay&&(this.props.autoplay?this.timeout=setTimeout((function(){return e.goNext()}),this.props.duration):clearTimeout(this.timeout)),this.props.children.length!=t.children.length&&this.setWidth()}},{key:"handleResize",value:function(){this.setWidth()}},{key:"applySlideStyle",value:function(){var t=this;this.allImages.forEach((function(e,n){e.style.width="".concat(t.width,"px")}))}},{key:"pauseSlides",value:function(){this.props.pauseOnHover&&clearTimeout(this.timeout)}},{key:"startSlides",value:function(){var t=this,e=this.props,n=e.pauseOnHover,i=e.autoplay;n&&i&&(this.timeout=setTimeout((function(){return t.goNext()}),this.props.duration))}},{key:"moveSlides",value:function(t){"next"===t.currentTarget.dataset.type?this.goNext():this.goBack()}},{key:"goToSlide",value:function(t){var e=t.currentTarget;this.goTo(parseInt(e.dataset.key))}},{key:"goTo",value:function(t){this.slideImages(t)}},{key:"goNext",value:function(){var t=this.state.index,e=this.props,n=e.children;(e.infinite||t!==n.length-1)&&this.slideImages(t+1)}},{key:"goBack",value:function(){var t=this.state.index;(this.props.infinite||0!==t)&&this.slideImages(t-1)}},{key:"render",value:function(){var t=this,n=this.props,i=n.children,o=(n.infinite,n.indicators),a=n.arrows,s=d(e.propTypes,this.props),u=this.state.index,c={transform:"translate(-".concat((u+1)*this.width,"px)")};return r.a.createElement("div",b({"aria-roledescription":"carousel"},s),r.a.createElement("div",{className:"react-slideshow-container",onMouseEnter:this.pauseSlides,onMouseLeave:this.startSlides,ref:this.reactSlideshowWrapper},a&&f(this.props,this.state.index,this.moveSlides),r.a.createElement("div",{className:"react-slideshow-wrapper slide",ref:function(e){return t.wrapper=e}},r.a.createElement("div",{className:"images-wrap",style:c,ref:function(e){return t.imageContainer=e}},r.a.createElement("div",{"data-index":"-1","aria-roledescription":"slide","aria-hidden":"false"},i[i.length-1]),i.map((function(t,e){return r.a.createElement("div",{"data-index":e,key:e,className:e===u?"active":"","aria-roledescription":"slide","aria-hidden":e===u?"false":"true"},t)})),r.a.createElement("div",{"data-index":"-1","aria-roledescription":"slide","aria-hidden":"false"},i[0]))),a&&v(this.props,this.state.index,this.moveSlides)),o&&y(this.props,this.state.index,this.goToSlide))}},{key:"slideImages",value:function(t){var e=this,n=this.props,i=n.children,r=n.transitionDuration,a=n.autoplay,s=n.infinite,u=n.duration,c=n.onChange;if(!this.tweenGroup.getAll().length){clearTimeout(this.timeout);var l={margin:-this.width*(this.state.index+1)},h=new o.a.Tween(l,this.tweenGroup).to({margin:-this.width*(t+1)},r).onUpdate((function(t){e.imageContainer.style.transform="translate(".concat(t.margin,"px)")})).start();!function t(){e.willUnmount?e.tweenGroup.removeAll():(requestAnimationFrame(t),e.tweenGroup.update())}(),h.onComplete((function(){var n=t<0?i.length-1:t>=i.length?0:t;e.willUnmount||("function"==typeof c&&c(e.state.index,n),e.setState({index:n},(function(){a&&(s||e.state.index<i.length)&&(e.timeout=setTimeout((function(){return e.goNext()}),u))})))}))}}}])&&_(n.prototype,s),u&&_(n,u),e}(i.Component);T.defaultProps={duration:5e3,transitionDuration:1e3,defaultIndex:0,infinite:!0,autoplay:!0,indicators:!1,arrows:!0,pauseOnHover:!0},T.propTypes={duration:u.a.number,transitionDuration:u.a.number,defaultIndex:u.a.number,infinite:u.a.bool,indicators:u.a.oneOfType([u.a.bool,u.a.func]),autoplay:u.a.bool,arrows:u.a.bool,onChange:u.a.func,pauseOnHover:u.a.bool,prevArrow:u.a.oneOfType([u.a.object,u.a.func]),nextArrow:u.a.oneOfType([u.a.object,u.a.func])};var S=T;function x(t){return(x="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t})(t)}function k(){return(k=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&(t[i]=n[i])}return t}).apply(this,arguments)}function E(t,e){for(var n=0;n<e.length;n++){var i=e[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}function j(t){return(j=Object.setPrototypeOf?Object.getPrototypeOf:function(t){return t.__proto__||Object.getPrototypeOf(t)})(t)}function C(t){if(void 0===t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return t}function I(t,e){return(I=Object.setPrototypeOf||function(t,e){return t.__proto__=e,t})(t,e)}var R=function(t){function e(t){var n;return function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,e),(n=function(t,e){return!e||"object"!==x(e)&&"function"!=typeof e?C(t):e}(this,j(e).call(this,t))).state={index:t.defaultIndex&&t.defaultIndex<t.children.length?t.defaultIndex:0},n.width=0,n.timeout=null,n.divsContainer=null,n.wrapper=null,n.setWidth=n.setWidth.bind(C(n)),n.handleResize=n.handleResize.bind(C(n)),n.navigate=n.navigate.bind(C(n)),n.preFade=n.preFade.bind(C(n)),n.pauseSlides=n.pauseSlides.bind(C(n)),n.startSlides=n.startSlides.bind(C(n)),n.initResizeObserver=n.initResizeObserver.bind(C(n)),n.tweenGroup=new o.a.Group,n.reactSlideshowWrapper=Object(i.createRef)(),n.wrapper=Object(i.createRef)(),n}var n,s,u;return function(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function");t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,writable:!0,configurable:!0}}),e&&I(t,e)}(e,t),n=e,(s=[{key:"componentDidMount",value:function(){this.setWidth(),this.play(),this.initResizeObserver()}},{key:"initResizeObserver",value:function(){var t=this;this.resizeObserver=new a.a((function(e){e&&t.handleResize()})),this.resizeObserver.observe(this.reactSlideshowWrapper.current)}},{key:"play",value:function(){var t=this,e=this.props,n=e.autoplay,i=e.children,r=this.state.index;n&&i.length>1&&(clearTimeout(this.timeout),this.timeout=setTimeout((function(){return t.fadeImages(r+1)}),this.props.duration))}},{key:"componentDidUpdate",value:function(t){this.props.autoplay!==t.autoplay&&(this.props.autoplay?this.play():clearTimeout(this.timeout)),this.props.children.length!=t.children.length&&(this.applyStyle(),this.play())}},{key:"componentWillUnmount",value:function(){this.willUnmount=!0,clearTimeout(this.timeout),this.removeResizeObserver()}},{key:"removeResizeObserver",value:function(){this.resizeObserver&&this.reactSlideshowWrapper&&this.reactSlideshowWrapper.current&&this.resizeObserver.unobserve(this.reactSlideshowWrapper.current)}},{key:"setWidth",value:function(){this.width=this.wrapper.current.clientWidth,this.applyStyle()}},{key:"handleResize",value:function(){this.setWidth()}},{key:"applyStyle",value:function(){var t=this.width*this.props.children.length;this.divsContainer.style.width="".concat(t,"px");for(var e=0;e<this.divsContainer.children.length;e++){var n=this.divsContainer.children[e];n&&(n.style.width="".concat(this.width,"px"),n.style.left="".concat(e*-this.width,"px"))}}},{key:"pauseSlides",value:function(){this.props.pauseOnHover&&clearTimeout(this.timeout)}},{key:"startSlides",value:function(){var t=this,e=this.props,n=e.pauseOnHover,i=e.autoplay;n&&i&&(this.timeout=setTimeout((function(){return t.goNext()}),this.props.duration))}},{key:"goNext",value:function(){var t=this.state.index,e=this.props,n=e.children;(e.infinite||t!==n.length-1)&&this.fadeImages((t+1)%n.length)}},{key:"goBack",value:function(){var t=this.state.index,e=this.props,n=e.children;(e.infinite||0!==t)&&this.fadeImages(0===t?n.length-1:t-1)}},{key:"navigate",value:function(t){var e=t.currentTarget.dataset;e.key!=this.state.index&&this.goTo(parseInt(e.key))}},{key:"goTo",value:function(t){this.fadeImages(t)}},{key:"preFade",value:function(t){"prev"===t.currentTarget.dataset.type?this.goBack():this.goNext()}},{key:"render",value:function(){var t=this,n=this.props,i=n.indicators,o=n.children,a=n.arrows,s=this.state.index,u=d(e.propTypes,this.props);return r.a.createElement("div",k({"aria-roledescription":"carousel"},u),r.a.createElement("div",{className:"react-slideshow-container",onMouseEnter:this.pauseSlides,onMouseLeave:this.startSlides,ref:this.reactSlideshowWrapper},a&&f(this.props,this.state.index,this.preFade),r.a.createElement("div",{className:"react-slideshow-fade-wrapper",ref:this.wrapper},r.a.createElement("div",{className:"react-slideshow-fade-images-wrap",ref:function(e){return t.divsContainer=e}},o.map((function(t,e){return r.a.createElement("div",{style:{opacity:e===s?"1":"0",zIndex:e===s?"1":"0"},"data-index":e,key:e,"aria-roledescription":"slide","aria-hidden":e===s?"false":"true"},t)})))),a&&v(this.props,this.state.index,this.preFade)),i&&y(this.props,this.state.index,this.navigate))}},{key:"fadeImages",value:function(t){var e=this,n=this.state.index,i=this.props,r=i.autoplay,a=i.children,s=i.infinite,u=i.duration,c=i.transitionDuration,l=i.onChange;this.tweenGroup.getAll().length||(this.divsContainer.children[t]||(t=0),clearTimeout(this.timeout),function t(){e.willUnmount?e.tweenGroup.removeAll():(requestAnimationFrame(t),e.tweenGroup.update())}(),new o.a.Tween({opacity:0},this.tweenGroup).to({opacity:1},c).onUpdate((function(i){e.divsContainer.children[t].style.opacity=i.opacity,e.divsContainer.children[n].style.opacity=1-i.opacity})).start().onComplete((function(){e.willUnmount||(e.setState({index:t}),"function"==typeof l&&l(n,t),r&&(s||t<a.length-1)&&(clearTimeout(e.timeout),e.timeout=setTimeout((function(){e.fadeImages((t+1)%a.length)}),u)))})))}}])&&E(n.prototype,s),u&&E(n,u),e}(i.Component);R.defaultProps={duration:5e3,transitionDuration:1e3,defaultIndex:0,indicators:!1,arrows:!0,autoplay:!0,infinite:!0,pauseOnHover:!0},R.propTypes={duration:u.a.number,transitionDuration:u.a.number,defaultIndex:u.a.number,indicators:u.a.oneOfType([u.a.bool,u.a.func]),arrows:u.a.bool,autoplay:u.a.bool,infinite:u.a.bool,onChange:u.a.func,pauseOnHover:u.a.bool,prevArrow:u.a.oneOfType([u.a.object,u.a.func]),nextArrow:u.a.oneOfType([u.a.object,u.a.func])};var M=R;function z(t){return(z="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t})(t)}function P(){return(P=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&(t[i]=n[i])}return t}).apply(this,arguments)}function A(t,e){for(var n=0;n<e.length;n++){var i=e[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}function W(t){return(W=Object.setPrototypeOf?Object.getPrototypeOf:function(t){return t.__proto__||Object.getPrototypeOf(t)})(t)}function D(t){if(void 0===t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return t}function N(t,e){return(N=Object.setPrototypeOf||function(t,e){return t.__proto__=e,t})(t,e)}var U=function(t){function e(t){var n;return function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,e),(n=function(t,e){return!e||"object"!==z(e)&&"function"!=typeof e?D(t):e}(this,W(e).call(this,t))).state={index:t.defaultIndex&&t.defaultIndex<t.children.length?t.defaultIndex:0},n.width=0,n.timeout=null,n.divsContainer=null,n.wrapper=null,n.setWidth=n.setWidth.bind(D(n)),n.handleResize=n.handleResize.bind(D(n)),n.navigate=n.navigate.bind(D(n)),n.preZoom=n.preZoom.bind(D(n)),n.pauseSlides=n.pauseSlides.bind(D(n)),n.startSlides=n.startSlides.bind(D(n)),n.tweenGroup=new o.a.Group,n.initResizeObserver=n.initResizeObserver.bind(D(n)),n.reactSlideshowWrapper=Object(i.createRef)(),n}var n,s,u;return function(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function");t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,writable:!0,configurable:!0}}),e&&N(t,e)}(e,t),n=e,(s=[{key:"componentDidMount",value:function(){this.setWidth(),this.play(),this.initResizeObserver()}},{key:"initResizeObserver",value:function(){var t=this;this.resizeObserver=new a.a((function(e){e&&t.handleResize()})),this.resizeObserver.observe(this.reactSlideshowWrapper.current)}},{key:"play",value:function(){var t=this,e=this.props,n=e.autoplay,i=e.children,r=this.state.index;n&&i.length>1&&(clearTimeout(this.timeout),this.timeout=setTimeout((function(){return t.zoomTo(r+1)}),this.props.duration))}},{key:"componentWillUnmount",value:function(){this.willUnmount=!0,clearTimeout(this.timeout),this.removeResizeObserver()}},{key:"removeResizeObserver",value:function(){this.resizeObserver&&this.reactSlideshowWrapper&&this.reactSlideshowWrapper.current&&this.resizeObserver.unobserve(this.reactSlideshowWrapper.current)}},{key:"componentDidUpdate",value:function(t){this.props.autoplay!==t.autoplay&&(this.props.autoplay?this.play():clearTimeout(this.timeout)),this.props.children.length!=t.children.length&&(this.applyStyle(),this.play())}},{key:"setWidth",value:function(){this.width=this.wrapper.clientWidth,this.applyStyle()}},{key:"handleResize",value:function(){this.setWidth()}},{key:"applyStyle",value:function(){var t=this.width*this.props.children.length;this.divsContainer.style.width="".concat(t,"px");for(var e=0;e<this.divsContainer.children.length;e++){var n=this.divsContainer.children[e];n&&(n.style.width="".concat(this.width,"px"),n.style.left="".concat(e*-this.width,"px"))}}},{key:"pauseSlides",value:function(){this.props.pauseOnHover&&clearTimeout(this.timeout)}},{key:"startSlides",value:function(){var t=this,e=this.props,n=e.pauseOnHover,i=e.autoplay;n&&i&&(this.timeout=setTimeout((function(){return t.goNext()}),this.props.duration))}},{key:"goNext",value:function(){var t=this.state.index,e=this.props,n=e.children;(e.infinite||t!==n.length-1)&&this.zoomTo((t+1)%n.length)}},{key:"goBack",value:function(){var t=this.state.index,e=this.props,n=e.children;(e.infinite||0!==t)&&this.zoomTo(0===t?n.length-1:t-1)}},{key:"goTo",value:function(t){this.zoomTo(t)}},{key:"navigate",value:function(t){var e=t.currentTarget.dataset;e.key!=this.state.index&&this.goTo(parseInt(e.key))}},{key:"preZoom",value:function(t){"prev"===t.currentTarget.dataset.type?this.goBack():this.goNext()}},{key:"render",value:function(){var t=this,n=this.props,i=n.indicators,o=n.arrows,a=n.children,s=this.state.index,u=d(e.propTypes,this.props);return r.a.createElement("div",P({"aria-roledescription":"carousel"},u),r.a.createElement("div",{className:"react-slideshow-container",onMouseEnter:this.pauseSlides,onMouseLeave:this.startSlides,ref:this.reactSlideshowWrapper},o&&f(this.props,this.state.index,this.preZoom),r.a.createElement("div",{className:"react-slideshow-zoom-wrapper",ref:function(e){return t.wrapper=e}},r.a.createElement("div",{className:"zoom-wrapper",ref:function(e){return t.divsContainer=e}},a.map((function(t,e){return r.a.createElement("div",{style:{opacity:e===s?"1":"0",zIndex:e===s?"1":"0"},"data-index":e,key:e,"aria-roledescription":"slide","aria-hidden":e===s?"false":"true"},t)})))),o&&v(this.props,this.state.index,this.preZoom)),i&&y(this.props,this.state.index,this.navigate))}},{key:"zoomTo",value:function(t){var e=this,n=this.state.index,i=this.props,r=i.children,a=i.scale,s=i.autoplay,u=i.infinite,c=i.transitionDuration,l=i.duration,h=i.onChange;this.tweenGroup.getAll().length||(this.divsContainer.children[t]||(t=0),clearTimeout(this.timeout),function t(){e.willUnmount?e.tweenGroup.removeAll():(requestAnimationFrame(t),e.tweenGroup.update())}(),new o.a.Tween({opacity:0,scale:1},this.tweenGroup).to({opacity:1,scale:a},c).onUpdate((function(i){e.divsContainer.children[t].style.opacity=i.opacity,e.divsContainer.children[n].style.opacity=1-i.opacity,e.divsContainer.children[n].style.transform="scale(".concat(i.scale,")")})).start().onComplete((function(){e.willUnmount||("function"==typeof h&&h(n,t),e.setState({index:t},(function(){e.divsContainer.children[n].style.transform="scale(1)"})),s&&(u||t<r.length-1)&&(clearTimeout(e.timeout),e.timeout=setTimeout((function(){e.zoomTo((t+1)%r.length)}),l)))})))}}])&&A(n.prototype,s),u&&A(n,u),e}(i.Component);U.defaultProps={duration:5e3,transitionDuration:1e3,defaultIndex:0,indicators:!1,arrows:!0,autoplay:!0,infinite:!0,pauseOnHover:!0},U.propTypes={duration:u.a.number,transitionDuration:u.a.number,defaultIndex:u.a.number,indicators:u.a.oneOfType([u.a.bool,u.a.func]),scale:u.a.number.isRequired,arrows:u.a.bool,autoplay:u.a.bool,infinite:u.a.bool,onChange:u.a.func,pauseOnHover:u.a.bool,prevArrow:u.a.oneOfType([u.a.object,u.a.func]),nextArrow:u.a.oneOfType([u.a.object,u.a.func])};var F=U}])}));
|
|
2
2
|
//# sourceMappingURL=react-slideshow-image.min.js.map
|