Skip to content

Commit c6d9c2b

Browse files
neptunianneptunian
committedJul 19, 2018
0.5.19
·
v1.1.20.5.19
1 parent 86cfcd9 commit c6d9c2b

25 files changed

+585
-286
lines changed
 

‎.github/HISTORY.md

+3
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,8 @@
11
# React-Images
22

3+
### v0.5.19 / 2018-07-19
4+
- Fix babel lib output not transpiling
5+
36
### v0.5.18 / 2018-07-19
47
- LightBox srcSet support for string and array #236 thanks to [lordoffreaks](https://github.com/lordoffreaks)
58
- Upgrade react-transition-group to v2 #238 thanks to [filipecosta01](https://github.com/filipecosta01)

‎dist/react-images.es.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -278,7 +278,7 @@ var possibleConstructorReturn = function (self, call) {
278278
function deepMerge(target) {
279279
var source = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
280280

281-
var extended = _extends({}, target);
281+
var extended = Object.assign({}, target);
282282

283283
Object.keys(source).forEach(function (key) {
284284
if (_typeof(source[key]) !== 'object' || !source[key]) {

‎dist/react-images.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -280,7 +280,7 @@ var possibleConstructorReturn = function (self, call) {
280280
function deepMerge(target) {
281281
var source = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
282282

283-
var extended = _extends({}, target);
283+
var extended = Object.assign({}, target);
284284

285285
Object.keys(source).forEach(function (key) {
286286
if (_typeof(source[key]) !== 'object' || !source[key]) {

‎dist/react-images.min.js

+1-1
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎examples/src/standalone.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@
2727
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-transition-group/2.0.0/react-transition-group.js"></script>
2828
<script src="https://unpkg.com/react-photo-gallery@6.0.28/dist/react-photo-gallery.min.js"></script>
2929
<script src="https://rawgit.com/neptunian/react-scrolllock/master/dist/react-scrolllock.min.js"></script>
30-
<script src="https://unpkg.com/react-images@0.5.18/dist/react-images.min.js"></script>
30+
<script src="https://unpkg.com/react-images@0.5.19/dist/react-images.min.js"></script>
3131
<script type="text/babel">
3232
const photos = [
3333
{src: 'https://images.unsplash.com/photo-1470619549108-b85c56fe5be8?w=1024&h=1024', width:1, height:1},

‎lib/Lightbox.js

+124-76
Original file line numberDiff line numberDiff line change
@@ -1,28 +1,76 @@
1+
'use strict';
2+
3+
Object.defineProperty(exports, "__esModule", {
4+
value: true
5+
});
6+
17
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
28

3-
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
9+
var _propTypes = require('prop-types');
410

5-
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
11+
var _propTypes2 = _interopRequireDefault(_propTypes);
612

7-
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
13+
var _react = require('react');
14+
15+
var _react2 = _interopRequireDefault(_react);
16+
17+
var _aphrodite = require('aphrodite');
18+
19+
var _reactScrolllock = require('react-scrolllock');
20+
21+
var _reactScrolllock2 = _interopRequireDefault(_reactScrolllock);
22+
23+
var _theme = require('./theme');
24+
25+
var _theme2 = _interopRequireDefault(_theme);
26+
27+
var _Arrow = require('./components/Arrow');
28+
29+
var _Arrow2 = _interopRequireDefault(_Arrow);
30+
31+
var _Container = require('./components/Container');
32+
33+
var _Container2 = _interopRequireDefault(_Container);
34+
35+
var _Footer = require('./components/Footer');
36+
37+
var _Footer2 = _interopRequireDefault(_Footer);
38+
39+
var _Header = require('./components/Header');
840

9-
import PropTypes from 'prop-types';
10-
import React, { Component } from 'react';
11-
import { css, StyleSheet } from 'aphrodite';
12-
import ScrollLock from 'react-scrolllock';
41+
var _Header2 = _interopRequireDefault(_Header);
1342

14-
import defaultTheme from './theme';
15-
import Arrow from './components/Arrow';
16-
import Container from './components/Container';
17-
import Footer from './components/Footer';
18-
import Header from './components/Header';
19-
import PaginatedThumbnails from './components/PaginatedThumbnails';
20-
import Portal from './components/Portal';
21-
import DefaultSpinner from './components/Spinner';
43+
var _PaginatedThumbnails = require('./components/PaginatedThumbnails');
2244

23-
import bindFunctions from './utils/bindFunctions';
24-
import canUseDom from './utils/canUseDom';
25-
import deepMerge from './utils/deepMerge';
45+
var _PaginatedThumbnails2 = _interopRequireDefault(_PaginatedThumbnails);
46+
47+
var _Portal = require('./components/Portal');
48+
49+
var _Portal2 = _interopRequireDefault(_Portal);
50+
51+
var _Spinner = require('./components/Spinner');
52+
53+
var _Spinner2 = _interopRequireDefault(_Spinner);
54+
55+
var _bindFunctions = require('./utils/bindFunctions');
56+
57+
var _bindFunctions2 = _interopRequireDefault(_bindFunctions);
58+
59+
var _canUseDom = require('./utils/canUseDom');
60+
61+
var _canUseDom2 = _interopRequireDefault(_canUseDom);
62+
63+
var _deepMerge = require('./utils/deepMerge');
64+
65+
var _deepMerge2 = _interopRequireDefault(_deepMerge);
66+
67+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
68+
69+
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
70+
71+
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
72+
73+
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
2674

2775
// consumers sometimes provide incorrect type or casing
2876
function normalizeSourceSet(data) {
@@ -43,11 +91,11 @@ var Lightbox = function (_Component) {
4391

4492
var _this = _possibleConstructorReturn(this, (Lightbox.__proto__ || Object.getPrototypeOf(Lightbox)).call(this, props));
4593

46-
_this.theme = deepMerge(defaultTheme, props.theme);
47-
_this.classes = StyleSheet.create(deepMerge(defaultStyles, _this.theme));
94+
_this.theme = (0, _deepMerge2.default)(_theme2.default, props.theme);
95+
_this.classes = _aphrodite.StyleSheet.create((0, _deepMerge2.default)(defaultStyles, _this.theme));
4896
_this.state = { imageLoaded: false };
4997

50-
bindFunctions.call(_this, ['gotoNext', 'gotoPrev', 'closeBackdrop', 'handleKeyboardInput', 'handleImageLoaded']);
98+
_bindFunctions2.default.call(_this, ['gotoNext', 'gotoPrev', 'closeBackdrop', 'handleKeyboardInput', 'handleImageLoaded']);
5199
return _this;
52100
}
53101

@@ -73,7 +121,7 @@ var Lightbox = function (_Component) {
73121
}, {
74122
key: 'componentWillReceiveProps',
75123
value: function componentWillReceiveProps(nextProps) {
76-
if (!canUseDom) return;
124+
if (!_canUseDom2.default) return;
77125

78126
// preload images
79127
if (nextProps.preloadNextImage) {
@@ -221,7 +269,7 @@ var Lightbox = function (_Component) {
221269
value: function renderArrowPrev() {
222270
if (this.props.currentImage === 0) return null;
223271

224-
return React.createElement(Arrow, {
272+
return _react2.default.createElement(_Arrow2.default, {
225273
direction: 'left',
226274
icon: 'arrowLeft',
227275
onClick: this.gotoPrev,
@@ -234,7 +282,7 @@ var Lightbox = function (_Component) {
234282
value: function renderArrowNext() {
235283
if (this.props.currentImage === this.props.images.length - 1) return null;
236284

237-
return React.createElement(Arrow, {
285+
return _react2.default.createElement(_Arrow2.default, {
238286
direction: 'right',
239287
icon: 'arrowRight',
240288
onClick: this.gotoNext,
@@ -253,26 +301,26 @@ var Lightbox = function (_Component) {
253301
var imageLoaded = this.state.imageLoaded;
254302

255303

256-
if (!isOpen) return React.createElement('span', { key: 'closed' });
304+
if (!isOpen) return _react2.default.createElement('span', { key: 'closed' });
257305

258306
var offsetThumbnails = 0;
259307
if (showThumbnails) {
260308
offsetThumbnails = this.theme.thumbnail.size + this.theme.container.gutter.vertical;
261309
}
262310

263-
return React.createElement(
264-
Container,
311+
return _react2.default.createElement(
312+
_Container2.default,
265313
{
266314
key: 'open',
267315
onClick: backdropClosesModal && this.closeBackdrop,
268316
onTouchEnd: backdropClosesModal && this.closeBackdrop
269317
},
270-
React.createElement(
318+
_react2.default.createElement(
271319
'div',
272320
null,
273-
React.createElement(
321+
_react2.default.createElement(
274322
'div',
275-
{ className: css(this.classes.content), style: { marginBottom: offsetThumbnails, maxWidth: width } },
323+
{ className: (0, _aphrodite.css)(this.classes.content), style: { marginBottom: offsetThumbnails, maxWidth: width } },
276324
imageLoaded && this.renderHeader(),
277325
this.renderImages(),
278326
this.renderSpinner(),
@@ -281,7 +329,7 @@ var Lightbox = function (_Component) {
281329
imageLoaded && this.renderThumbnails(),
282330
imageLoaded && this.renderArrowPrev(),
283331
imageLoaded && this.renderArrowNext(),
284-
this.props.preventScroll && React.createElement(ScrollLock, null)
332+
this.props.preventScroll && _react2.default.createElement(_reactScrolllock2.default, null)
285333
)
286334
);
287335
}
@@ -305,11 +353,11 @@ var Lightbox = function (_Component) {
305353
var thumbnailsSize = showThumbnails ? this.theme.thumbnail.size : 0;
306354
var heightOffset = this.theme.header.height + this.theme.footer.height + thumbnailsSize + this.theme.container.gutter.vertical + 'px';
307355

308-
return React.createElement(
356+
return _react2.default.createElement(
309357
'figure',
310-
{ className: css(this.classes.figure) },
311-
React.createElement('img', {
312-
className: css(this.classes.image, imageLoaded && this.classes.imageLoaded),
358+
{ className: (0, _aphrodite.css)(this.classes.figure) },
359+
_react2.default.createElement('img', {
360+
className: (0, _aphrodite.css)(this.classes.image, imageLoaded && this.classes.imageLoaded),
313361
onClick: onClickImage,
314362
sizes: sizes,
315363
alt: image.alt,
@@ -335,7 +383,7 @@ var Lightbox = function (_Component) {
335383

336384
if (!showThumbnails) return;
337385

338-
return React.createElement(PaginatedThumbnails, {
386+
return _react2.default.createElement(_PaginatedThumbnails2.default, {
339387
currentImage: currentImage,
340388
images: images,
341389
offset: thumbnailOffset,
@@ -352,7 +400,7 @@ var Lightbox = function (_Component) {
352400
showCloseButton = _props5.showCloseButton;
353401

354402

355-
return React.createElement(Header, {
403+
return _react2.default.createElement(_Header2.default, {
356404
customControls: customControls,
357405
onClose: onClose,
358406
showCloseButton: showCloseButton,
@@ -371,7 +419,7 @@ var Lightbox = function (_Component) {
371419

372420
if (!images || !images.length) return null;
373421

374-
return React.createElement(Footer, {
422+
return _react2.default.createElement(_Footer2.default, {
375423
caption: images[currentImage].caption,
376424
countCurrent: currentImage + 1,
377425
countSeparator: imageCountSeparator,
@@ -390,10 +438,10 @@ var Lightbox = function (_Component) {
390438

391439
var Spinner = spinner;
392440

393-
return React.createElement(
441+
return _react2.default.createElement(
394442
'div',
395-
{ className: css(this.classes.spinner, !imageLoaded && this.classes.spinnerActive) },
396-
React.createElement(Spinner, {
443+
{ className: (0, _aphrodite.css)(this.classes.spinner, !imageLoaded && this.classes.spinnerActive) },
444+
_react2.default.createElement(Spinner, {
397445
color: spinnerColor,
398446
size: spinnerSize
399447
})
@@ -402,48 +450,48 @@ var Lightbox = function (_Component) {
402450
}, {
403451
key: 'render',
404452
value: function render() {
405-
return React.createElement(
406-
Portal,
453+
return _react2.default.createElement(
454+
_Portal2.default,
407455
null,
408456
this.renderDialog()
409457
);
410458
}
411459
}]);
412460

413461
return Lightbox;
414-
}(Component);
462+
}(_react.Component);
415463

416464
Lightbox.propTypes = {
417-
backdropClosesModal: PropTypes.bool,
418-
closeButtonTitle: PropTypes.string,
419-
currentImage: PropTypes.number,
420-
customControls: PropTypes.arrayOf(PropTypes.node),
421-
enableKeyboardInput: PropTypes.bool,
422-
imageCountSeparator: PropTypes.string,
423-
images: PropTypes.arrayOf(PropTypes.shape({
424-
src: PropTypes.string.isRequired,
425-
srcSet: PropTypes.oneOfType([PropTypes.string, PropTypes.arrayOf(PropTypes.string)]),
426-
caption: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
427-
thumbnail: PropTypes.string
465+
backdropClosesModal: _propTypes2.default.bool,
466+
closeButtonTitle: _propTypes2.default.string,
467+
currentImage: _propTypes2.default.number,
468+
customControls: _propTypes2.default.arrayOf(_propTypes2.default.node),
469+
enableKeyboardInput: _propTypes2.default.bool,
470+
imageCountSeparator: _propTypes2.default.string,
471+
images: _propTypes2.default.arrayOf(_propTypes2.default.shape({
472+
src: _propTypes2.default.string.isRequired,
473+
srcSet: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.arrayOf(_propTypes2.default.string)]),
474+
caption: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.element]),
475+
thumbnail: _propTypes2.default.string
428476
})).isRequired,
429-
isOpen: PropTypes.bool,
430-
leftArrowTitle: PropTypes.string,
431-
onClickImage: PropTypes.func,
432-
onClickNext: PropTypes.func,
433-
onClickPrev: PropTypes.func,
434-
onClose: PropTypes.func.isRequired,
435-
preloadNextImage: PropTypes.bool,
436-
preventScroll: PropTypes.bool,
437-
rightArrowTitle: PropTypes.string,
438-
showCloseButton: PropTypes.bool,
439-
showImageCount: PropTypes.bool,
440-
showThumbnails: PropTypes.bool,
441-
spinner: PropTypes.func,
442-
spinnerColor: PropTypes.string,
443-
spinnerSize: PropTypes.number,
444-
theme: PropTypes.object,
445-
thumbnailOffset: PropTypes.number,
446-
width: PropTypes.number
477+
isOpen: _propTypes2.default.bool,
478+
leftArrowTitle: _propTypes2.default.string,
479+
onClickImage: _propTypes2.default.func,
480+
onClickNext: _propTypes2.default.func,
481+
onClickPrev: _propTypes2.default.func,
482+
onClose: _propTypes2.default.func.isRequired,
483+
preloadNextImage: _propTypes2.default.bool,
484+
preventScroll: _propTypes2.default.bool,
485+
rightArrowTitle: _propTypes2.default.string,
486+
showCloseButton: _propTypes2.default.bool,
487+
showImageCount: _propTypes2.default.bool,
488+
showThumbnails: _propTypes2.default.bool,
489+
spinner: _propTypes2.default.func,
490+
spinnerColor: _propTypes2.default.string,
491+
spinnerSize: _propTypes2.default.number,
492+
theme: _propTypes2.default.object,
493+
thumbnailOffset: _propTypes2.default.number,
494+
width: _propTypes2.default.number
447495
};
448496
Lightbox.defaultProps = {
449497
closeButtonTitle: 'Close (Esc)',
@@ -457,15 +505,15 @@ Lightbox.defaultProps = {
457505
rightArrowTitle: 'Next (Right arrow key)',
458506
showCloseButton: true,
459507
showImageCount: true,
460-
spinner: DefaultSpinner,
508+
spinner: _Spinner2.default,
461509
spinnerColor: 'white',
462510
spinnerSize: 100,
463511
theme: {},
464512
thumbnailOffset: 2,
465513
width: 1024
466514
};
467515
Lightbox.childContextTypes = {
468-
theme: PropTypes.object.isRequired
516+
theme: _propTypes2.default.object.isRequired
469517
};
470518

471519
var defaultStyles = {
@@ -508,4 +556,4 @@ var defaultStyles = {
508556
}
509557
};
510558

511-
export default Lightbox;
559+
exports.default = Lightbox;

‎lib/components/Arrow.js

+45-23
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,36 @@
1+
'use strict';
2+
3+
Object.defineProperty(exports, "__esModule", {
4+
value: true
5+
});
6+
17
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
28

3-
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
9+
var _propTypes = require('prop-types');
10+
11+
var _propTypes2 = _interopRequireDefault(_propTypes);
12+
13+
var _react = require('react');
14+
15+
var _react2 = _interopRequireDefault(_react);
16+
17+
var _noImportant = require('aphrodite/no-important');
418

5-
import PropTypes from 'prop-types';
6-
import React from 'react';
7-
import { css, StyleSheet } from 'aphrodite/no-important';
19+
var _theme = require('../theme');
820

9-
import defaults from '../theme';
10-
import deepMerge from '../utils/deepMerge';
11-
import Icon from './Icon';
21+
var _theme2 = _interopRequireDefault(_theme);
22+
23+
var _deepMerge = require('../utils/deepMerge');
24+
25+
var _deepMerge2 = _interopRequireDefault(_deepMerge);
26+
27+
var _Icon = require('./Icon');
28+
29+
var _Icon2 = _interopRequireDefault(_Icon);
30+
31+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
32+
33+
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
1234

1335
function Arrow(_ref, _ref2) {
1436
var theme = _ref2.theme;
@@ -19,31 +41,31 @@ function Arrow(_ref, _ref2) {
1941
size = _ref.size,
2042
props = _objectWithoutProperties(_ref, ['direction', 'icon', 'onClick', 'size']);
2143

22-
var classes = StyleSheet.create(deepMerge(defaultStyles, theme));
44+
var classes = _noImportant.StyleSheet.create((0, _deepMerge2.default)(defaultStyles, theme));
2345

24-
return React.createElement(
46+
return _react2.default.createElement(
2547
'button',
2648
_extends({
2749
type: 'button',
28-
className: css(classes.arrow, classes['arrow__direction__' + direction], size && classes['arrow__size__' + size]),
50+
className: (0, _noImportant.css)(classes.arrow, classes['arrow__direction__' + direction], size && classes['arrow__size__' + size]),
2951
onClick: onClick,
3052
onTouchEnd: onClick
3153
}, props),
32-
React.createElement(Icon, { fill: !!theme.arrow && theme.arrow.fill || defaults.arrow.fill, type: icon })
54+
_react2.default.createElement(_Icon2.default, { fill: !!theme.arrow && theme.arrow.fill || _theme2.default.arrow.fill, type: icon })
3355
);
3456
}
3557

3658
Arrow.propTypes = {
37-
direction: PropTypes.oneOf(['left', 'right']),
38-
icon: PropTypes.string,
39-
onClick: PropTypes.func.isRequired,
40-
size: PropTypes.oneOf(['medium', 'small']).isRequired
59+
direction: _propTypes2.default.oneOf(['left', 'right']),
60+
icon: _propTypes2.default.string,
61+
onClick: _propTypes2.default.func.isRequired,
62+
size: _propTypes2.default.oneOf(['medium', 'small']).isRequired
4163
};
4264
Arrow.defaultProps = {
4365
size: 'medium'
4466
};
4567
Arrow.contextTypes = {
46-
theme: PropTypes.object.isRequired
68+
theme: _propTypes2.default.object.isRequired
4769
};
4870

4971
var defaultStyles = {
@@ -64,17 +86,17 @@ var defaultStyles = {
6486

6587
// sizes
6688
arrow__size__medium: {
67-
height: defaults.arrow.height,
68-
marginTop: defaults.arrow.height / -2,
89+
height: _theme2.default.arrow.height,
90+
marginTop: _theme2.default.arrow.height / -2,
6991
width: 40,
7092

7193
'@media (min-width: 768px)': {
7294
width: 70
7395
}
7496
},
7597
arrow__size__small: {
76-
height: defaults.thumbnail.size,
77-
marginTop: defaults.thumbnail.size / -2,
98+
height: _theme2.default.thumbnail.size,
99+
marginTop: _theme2.default.thumbnail.size / -2,
78100
width: 30,
79101

80102
'@media (min-width: 500px)': {
@@ -84,11 +106,11 @@ var defaultStyles = {
84106

85107
// direction
86108
arrow__direction__right: {
87-
right: defaults.container.gutter.horizontal
109+
right: _theme2.default.container.gutter.horizontal
88110
},
89111
arrow__direction__left: {
90-
left: defaults.container.gutter.horizontal
112+
left: _theme2.default.container.gutter.horizontal
91113
}
92114
};
93115

94-
export default Arrow;
116+
exports.default = Arrow;

‎lib/components/Container.js

+36-17
Original file line numberDiff line numberDiff line change
@@ -1,48 +1,67 @@
1+
'use strict';
2+
3+
Object.defineProperty(exports, "__esModule", {
4+
value: true
5+
});
6+
17
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
28

3-
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
9+
var _propTypes = require('prop-types');
10+
11+
var _propTypes2 = _interopRequireDefault(_propTypes);
12+
13+
var _react = require('react');
14+
15+
var _react2 = _interopRequireDefault(_react);
416

5-
import PropTypes from 'prop-types';
6-
import React from 'react';
7-
import { css, StyleSheet } from 'aphrodite/no-important';
17+
var _noImportant = require('aphrodite/no-important');
818

9-
import defaults from '../theme';
10-
import deepMerge from '../utils/deepMerge';
19+
var _theme = require('../theme');
20+
21+
var _theme2 = _interopRequireDefault(_theme);
22+
23+
var _deepMerge = require('../utils/deepMerge');
24+
25+
var _deepMerge2 = _interopRequireDefault(_deepMerge);
26+
27+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
28+
29+
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
1130

1231
function Container(_ref, _ref2) {
1332
var theme = _ref2.theme;
1433

1534
var props = _objectWithoutProperties(_ref, []);
1635

17-
var classes = StyleSheet.create(deepMerge(defaultStyles, theme));
36+
var classes = _noImportant.StyleSheet.create((0, _deepMerge2.default)(defaultStyles, theme));
1837

19-
return React.createElement('div', _extends({ id: 'lightboxBackdrop',
20-
className: css(classes.container)
38+
return _react2.default.createElement('div', _extends({ id: 'lightboxBackdrop',
39+
className: (0, _noImportant.css)(classes.container)
2140
}, props));
2241
}
2342

2443
Container.contextTypes = {
25-
theme: PropTypes.object.isRequired
44+
theme: _propTypes2.default.object.isRequired
2645
};
2746

2847
var defaultStyles = {
2948
container: {
3049
alignItems: 'center',
31-
backgroundColor: defaults.container.background,
50+
backgroundColor: _theme2.default.container.background,
3251
boxSizing: 'border-box',
3352
display: 'flex',
3453
height: '100%',
3554
justifyContent: 'center',
3655
left: 0,
37-
paddingBottom: defaults.container.gutter.vertical,
38-
paddingLeft: defaults.container.gutter.horizontal,
39-
paddingRight: defaults.container.gutter.horizontal,
40-
paddingTop: defaults.container.gutter.vertical,
56+
paddingBottom: _theme2.default.container.gutter.vertical,
57+
paddingLeft: _theme2.default.container.gutter.horizontal,
58+
paddingRight: _theme2.default.container.gutter.horizontal,
59+
paddingTop: _theme2.default.container.gutter.vertical,
4160
position: 'fixed',
4261
top: 0,
4362
width: '100%',
44-
zIndex: defaults.container.zIndex
63+
zIndex: _theme2.default.container.zIndex
4564
}
4665
};
4766

48-
export default Container;
67+
exports.default = Container;

‎lib/components/Footer.js

+49-29
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,32 @@
1+
'use strict';
2+
3+
Object.defineProperty(exports, "__esModule", {
4+
value: true
5+
});
6+
17
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
28

3-
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
9+
var _propTypes = require('prop-types');
10+
11+
var _propTypes2 = _interopRequireDefault(_propTypes);
12+
13+
var _react = require('react');
14+
15+
var _react2 = _interopRequireDefault(_react);
16+
17+
var _noImportant = require('aphrodite/no-important');
418

5-
import PropTypes from 'prop-types';
6-
import React from 'react';
7-
import { css, StyleSheet } from 'aphrodite/no-important';
8-
import defaults from '../theme';
9-
import deepMerge from '../utils/deepMerge';
19+
var _theme = require('../theme');
20+
21+
var _theme2 = _interopRequireDefault(_theme);
22+
23+
var _deepMerge = require('../utils/deepMerge');
24+
25+
var _deepMerge2 = _interopRequireDefault(_deepMerge);
26+
27+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
28+
29+
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
1030

1131
function Footer(_ref, _ref2) {
1232
var theme = _ref2.theme;
@@ -20,61 +40,61 @@ function Footer(_ref, _ref2) {
2040

2141
if (!caption && !showCount) return null;
2242

23-
var classes = StyleSheet.create(deepMerge(defaultStyles, theme));
43+
var classes = _noImportant.StyleSheet.create((0, _deepMerge2.default)(defaultStyles, theme));
2444

25-
var imageCount = showCount ? React.createElement(
45+
var imageCount = showCount ? _react2.default.createElement(
2646
'div',
27-
{ className: css(classes.footerCount) },
47+
{ className: (0, _noImportant.css)(classes.footerCount) },
2848
countCurrent,
2949
countSeparator,
3050
countTotal
31-
) : React.createElement('span', null);
51+
) : _react2.default.createElement('span', null);
3252

33-
return React.createElement(
53+
return _react2.default.createElement(
3454
'div',
35-
_extends({ className: css(classes.footer) }, props),
36-
caption ? React.createElement(
55+
_extends({ className: (0, _noImportant.css)(classes.footer) }, props),
56+
caption ? _react2.default.createElement(
3757
'figcaption',
38-
{ className: css(classes.footerCaption) },
58+
{ className: (0, _noImportant.css)(classes.footerCaption) },
3959
caption
40-
) : React.createElement('span', null),
60+
) : _react2.default.createElement('span', null),
4161
imageCount
4262
);
4363
}
4464

4565
Footer.propTypes = {
46-
caption: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
47-
countCurrent: PropTypes.number,
48-
countSeparator: PropTypes.string,
49-
countTotal: PropTypes.number,
50-
showCount: PropTypes.bool
66+
caption: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.element]),
67+
countCurrent: _propTypes2.default.number,
68+
countSeparator: _propTypes2.default.string,
69+
countTotal: _propTypes2.default.number,
70+
showCount: _propTypes2.default.bool
5171
};
5272
Footer.contextTypes = {
53-
theme: PropTypes.object.isRequired
73+
theme: _propTypes2.default.object.isRequired
5474
};
5575

5676
var defaultStyles = {
5777
footer: {
5878
boxSizing: 'border-box',
59-
color: defaults.footer.color,
79+
color: _theme2.default.footer.color,
6080
cursor: 'auto',
6181
display: 'flex',
6282
justifyContent: 'space-between',
6383
left: 0,
6484
lineHeight: 1.3,
65-
paddingBottom: defaults.footer.gutter.vertical,
66-
paddingLeft: defaults.footer.gutter.horizontal,
67-
paddingRight: defaults.footer.gutter.horizontal,
68-
paddingTop: defaults.footer.gutter.vertical
85+
paddingBottom: _theme2.default.footer.gutter.vertical,
86+
paddingLeft: _theme2.default.footer.gutter.horizontal,
87+
paddingRight: _theme2.default.footer.gutter.horizontal,
88+
paddingTop: _theme2.default.footer.gutter.vertical
6989
},
7090
footerCount: {
71-
color: defaults.footer.count.color,
72-
fontSize: defaults.footer.count.fontSize,
91+
color: _theme2.default.footer.count.color,
92+
fontSize: _theme2.default.footer.count.fontSize,
7393
paddingLeft: '1em' // add a small gutter for the caption
7494
},
7595
footerCaption: {
7696
flex: '1 1 0'
7797
}
7898
};
7999

80-
export default Footer;
100+
exports.default = Footer;

‎lib/components/Header.js

+42-20
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,36 @@
1+
'use strict';
2+
3+
Object.defineProperty(exports, "__esModule", {
4+
value: true
5+
});
6+
17
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
28

3-
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
9+
var _propTypes = require('prop-types');
10+
11+
var _propTypes2 = _interopRequireDefault(_propTypes);
12+
13+
var _react = require('react');
14+
15+
var _react2 = _interopRequireDefault(_react);
16+
17+
var _noImportant = require('aphrodite/no-important');
418

5-
import PropTypes from 'prop-types';
6-
import React from 'react';
7-
import { css, StyleSheet } from 'aphrodite/no-important';
19+
var _theme = require('../theme');
820

9-
import defaults from '../theme';
10-
import deepMerge from '../utils/deepMerge';
11-
import Icon from './Icon';
21+
var _theme2 = _interopRequireDefault(_theme);
22+
23+
var _deepMerge = require('../utils/deepMerge');
24+
25+
var _deepMerge2 = _interopRequireDefault(_deepMerge);
26+
27+
var _Icon = require('./Icon');
28+
29+
var _Icon2 = _interopRequireDefault(_Icon);
30+
31+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
32+
33+
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
1234

1335
function Header(_ref, _ref2) {
1436
var theme = _ref2.theme;
@@ -19,38 +41,38 @@ function Header(_ref, _ref2) {
1941
closeButtonTitle = _ref.closeButtonTitle,
2042
props = _objectWithoutProperties(_ref, ['customControls', 'onClose', 'showCloseButton', 'closeButtonTitle']);
2143

22-
var classes = StyleSheet.create(deepMerge(defaultStyles, theme));
44+
var classes = _noImportant.StyleSheet.create((0, _deepMerge2.default)(defaultStyles, theme));
2345

24-
return React.createElement(
46+
return _react2.default.createElement(
2547
'div',
26-
_extends({ className: css(classes.header) }, props),
27-
customControls ? customControls : React.createElement('span', null),
28-
!!showCloseButton && React.createElement(
48+
_extends({ className: (0, _noImportant.css)(classes.header) }, props),
49+
customControls ? customControls : _react2.default.createElement('span', null),
50+
!!showCloseButton && _react2.default.createElement(
2951
'button',
3052
{
3153
title: closeButtonTitle,
32-
className: css(classes.close),
54+
className: (0, _noImportant.css)(classes.close),
3355
onClick: onClose
3456
},
35-
React.createElement(Icon, { fill: !!theme.close && theme.close.fill || defaults.close.fill, type: 'close' })
57+
_react2.default.createElement(_Icon2.default, { fill: !!theme.close && theme.close.fill || _theme2.default.close.fill, type: 'close' })
3658
)
3759
);
3860
}
3961

4062
Header.propTypes = {
41-
customControls: PropTypes.array,
42-
onClose: PropTypes.func.isRequired,
43-
showCloseButton: PropTypes.bool
63+
customControls: _propTypes2.default.array,
64+
onClose: _propTypes2.default.func.isRequired,
65+
showCloseButton: _propTypes2.default.bool
4466
};
4567
Header.contextTypes = {
46-
theme: PropTypes.object.isRequired
68+
theme: _propTypes2.default.object.isRequired
4769
};
4870

4971
var defaultStyles = {
5072
header: {
5173
display: 'flex',
5274
justifyContent: 'space-between',
53-
height: defaults.header.height
75+
height: _theme2.default.header.height
5476
},
5577
close: {
5678
background: 'none',
@@ -70,4 +92,4 @@ var defaultStyles = {
7092
}
7193
};
7294

73-
export default Header;
95+
exports.default = Header;

‎lib/components/Icon.js

+33-11
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,36 @@
1+
'use strict';
2+
3+
Object.defineProperty(exports, "__esModule", {
4+
value: true
5+
});
6+
17
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
28

3-
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
9+
var _propTypes = require('prop-types');
10+
11+
var _propTypes2 = _interopRequireDefault(_propTypes);
12+
13+
var _react = require('react');
14+
15+
var _react2 = _interopRequireDefault(_react);
16+
17+
var _arrowLeft = require('../icons/arrowLeft');
418

5-
import PropTypes from 'prop-types';
6-
import React from 'react';
7-
import arrowLeft from '../icons/arrowLeft';
8-
import arrowRight from '../icons/arrowRight';
9-
import close from '../icons/close';
19+
var _arrowLeft2 = _interopRequireDefault(_arrowLeft);
20+
21+
var _arrowRight = require('../icons/arrowRight');
22+
23+
var _arrowRight2 = _interopRequireDefault(_arrowRight);
24+
25+
var _close = require('../icons/close');
26+
27+
var _close2 = _interopRequireDefault(_close);
28+
29+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
30+
31+
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
1032

11-
var icons = { arrowLeft: arrowLeft, arrowRight: arrowRight, close: close };
33+
var icons = { arrowLeft: _arrowLeft2.default, arrowRight: _arrowRight2.default, close: _close2.default };
1234

1335
var Icon = function Icon(_ref) {
1436
var fill = _ref.fill,
@@ -17,17 +39,17 @@ var Icon = function Icon(_ref) {
1739

1840
var icon = icons[type];
1941

20-
return React.createElement('span', _extends({
42+
return _react2.default.createElement('span', _extends({
2143
dangerouslySetInnerHTML: { __html: icon(fill) }
2244
}, props));
2345
};
2446

2547
Icon.propTypes = {
26-
fill: PropTypes.string,
27-
type: PropTypes.oneOf(Object.keys(icons))
48+
fill: _propTypes2.default.string,
49+
type: _propTypes2.default.oneOf(Object.keys(icons))
2850
};
2951
Icon.defaultProps = {
3052
fill: 'white'
3153
};
3254

33-
export default Icon;
55+
exports.default = Icon;

‎lib/components/PaginatedThumbnails.js

+45-23
Original file line numberDiff line numberDiff line change
@@ -1,25 +1,47 @@
1+
'use strict';
2+
3+
Object.defineProperty(exports, "__esModule", {
4+
value: true
5+
});
6+
17
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
28

39
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
410

11+
var _propTypes = require('prop-types');
12+
13+
var _propTypes2 = _interopRequireDefault(_propTypes);
14+
15+
var _react = require('react');
16+
17+
var _react2 = _interopRequireDefault(_react);
18+
19+
var _noImportant = require('aphrodite/no-important');
20+
21+
var _Thumbnail = require('./Thumbnail');
22+
23+
var _Thumbnail2 = _interopRequireDefault(_Thumbnail);
24+
25+
var _Arrow = require('./Arrow');
26+
27+
var _Arrow2 = _interopRequireDefault(_Arrow);
28+
29+
var _theme = require('../theme');
30+
31+
var _theme2 = _interopRequireDefault(_theme);
32+
33+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
34+
535
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
636

737
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
838

939
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
1040

11-
import PropTypes from 'prop-types';
12-
import React, { Component } from 'react';
13-
import { css, StyleSheet } from 'aphrodite/no-important';
14-
15-
import Thumbnail from './Thumbnail';
16-
import Arrow from './Arrow';
17-
import theme from '../theme';
18-
19-
var classes = StyleSheet.create({
41+
var classes = _noImportant.StyleSheet.create({
2042
paginatedThumbnails: {
21-
bottom: theme.container.gutter.vertical,
22-
height: theme.thumbnail.size,
43+
bottom: _theme2.default.container.gutter.vertical,
44+
height: _theme2.default.thumbnail.size,
2345
padding: '0 50px',
2446
position: 'absolute',
2547
textAlign: 'center',
@@ -30,7 +52,7 @@ var classes = StyleSheet.create({
3052
});
3153

3254
var arrowStyles = {
33-
height: theme.thumbnail.size + theme.thumbnail.gutter * 2,
55+
height: _theme2.default.thumbnail.size + _theme2.default.thumbnail.gutter * 2,
3456
width: 40
3557
};
3658

@@ -135,7 +157,7 @@ var PaginatedThumbnails = function (_Component) {
135157
value: function renderArrowPrev() {
136158
if (this.getFirst() <= 0) return null;
137159

138-
return React.createElement(Arrow, {
160+
return _react2.default.createElement(_Arrow2.default, {
139161
direction: 'left',
140162
size: 'small',
141163
icon: 'arrowLeft',
@@ -155,7 +177,7 @@ var PaginatedThumbnails = function (_Component) {
155177
var totalCount = 2 * offset + 1;
156178
if (this.getFirst() + totalCount >= images.length) return null;
157179

158-
return React.createElement(Arrow, {
180+
return _react2.default.createElement(_Arrow2.default, {
159181
direction: 'right',
160182
size: 'small',
161183
icon: 'arrowRight',
@@ -186,12 +208,12 @@ var PaginatedThumbnails = function (_Component) {
186208
thumbnails = images.slice(baseOffset, baseOffset + totalCount);
187209
}
188210

189-
return React.createElement(
211+
return _react2.default.createElement(
190212
'div',
191-
{ className: css(classes.paginatedThumbnails) },
213+
{ className: (0, _noImportant.css)(classes.paginatedThumbnails) },
192214
this.renderArrowPrev(),
193215
thumbnails.map(function (img, idx) {
194-
return React.createElement(Thumbnail, _extends({ key: baseOffset + idx
216+
return _react2.default.createElement(_Thumbnail2.default, _extends({ key: baseOffset + idx
195217
}, img, {
196218
index: baseOffset + idx,
197219
onClick: onClickThumbnail,
@@ -203,14 +225,14 @@ var PaginatedThumbnails = function (_Component) {
203225
}]);
204226

205227
return PaginatedThumbnails;
206-
}(Component);
228+
}(_react.Component);
207229

208-
export default PaginatedThumbnails;
230+
exports.default = PaginatedThumbnails;
209231

210232

211233
PaginatedThumbnails.propTypes = {
212-
currentImage: PropTypes.number,
213-
images: PropTypes.array,
214-
offset: PropTypes.number,
215-
onClickThumbnail: PropTypes.func.isRequired
234+
currentImage: _propTypes2.default.number,
235+
images: _propTypes2.default.array,
236+
offset: _propTypes2.default.number,
237+
onClickThumbnail: _propTypes2.default.func.isRequired
216238
};

‎lib/components/PassContext.js

+19-8
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,25 @@
1+
'use strict';
2+
3+
Object.defineProperty(exports, "__esModule", {
4+
value: true
5+
});
6+
17
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
28

9+
var _propTypes = require('prop-types');
10+
11+
var _propTypes2 = _interopRequireDefault(_propTypes);
12+
13+
var _react = require('react');
14+
15+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
16+
317
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
418

519
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
620

721
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
822

9-
import PropTypes from 'prop-types';
10-
import { Children, Component } from 'react';
11-
1223
// Pass the Lightbox context through to the Portal's descendents
1324
// StackOverflow discussion http://goo.gl/oclrJ9
1425

@@ -29,18 +40,18 @@ var PassContext = function (_Component) {
2940
}, {
3041
key: 'render',
3142
value: function render() {
32-
return Children.only(this.props.children);
43+
return _react.Children.only(this.props.children);
3344
}
3445
}]);
3546

3647
return PassContext;
37-
}(Component);
48+
}(_react.Component);
3849

3950
PassContext.propTypes = {
40-
context: PropTypes.object.isRequired
51+
context: _propTypes2.default.object.isRequired
4152
};
4253
PassContext.childContextTypes = {
43-
theme: PropTypes.object
54+
theme: _propTypes2.default.object
4455
};
4556

46-
export default PassContext;
57+
exports.default = PassContext;

‎lib/components/Portal.js

+36-18
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,35 @@
1+
'use strict';
2+
3+
Object.defineProperty(exports, "__esModule", {
4+
value: true
5+
});
6+
17
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
28

9+
var _propTypes = require('prop-types');
10+
11+
var _propTypes2 = _interopRequireDefault(_propTypes);
12+
13+
var _react = require('react');
14+
15+
var _react2 = _interopRequireDefault(_react);
16+
17+
var _reactTransitionGroup = require('react-transition-group');
18+
19+
var _reactDom = require('react-dom');
20+
21+
var _PassContext = require('./PassContext');
22+
23+
var _PassContext2 = _interopRequireDefault(_PassContext);
24+
25+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
26+
327
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
428

529
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
630

731
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
832

9-
import PropTypes from 'prop-types';
10-
import React, { Component } from 'react';
11-
import { CSSTransition, TransitionGroup } from 'react-transition-group';
12-
import { render, unmountComponentAtNode } from 'react-dom';
13-
import PassContext from './PassContext';
14-
1533
var Portal = function (_Component) {
1634
_inherits(Portal, _Component);
1735

@@ -39,22 +57,22 @@ var Portal = function (_Component) {
3957
var duration = 200;
4058
var styles = '\n\t\t\t\t.fade-enter { opacity: 0.01; }\n\t\t\t\t.fade-enter.fade-enter-active { opacity: 1; transition: opacity ' + duration + 'ms; }\n\t\t\t\t.fade-leave { opacity: 1; }\n\t\t\t\t.fade-leave.fade-leave-active { opacity: 0.01; transition: opacity ' + duration + 'ms; }\n\t\t';
4159

42-
render(React.createElement(
43-
PassContext,
60+
(0, _reactDom.render)(_react2.default.createElement(
61+
_PassContext2.default,
4462
{ context: this.context },
45-
React.createElement(
63+
_react2.default.createElement(
4664
'div',
4765
null,
48-
React.createElement(
66+
_react2.default.createElement(
4967
'style',
5068
null,
5169
styles
5270
),
53-
React.createElement(
54-
TransitionGroup,
71+
_react2.default.createElement(
72+
_reactTransitionGroup.TransitionGroup,
5573
this.props,
56-
React.createElement(
57-
CSSTransition,
74+
_react2.default.createElement(
75+
_reactTransitionGroup.CSSTransition,
5876
{ timeout: { enter: duration, exit: duration }, classNames: 'fade' },
5977
this.props.children
6078
)
@@ -65,7 +83,7 @@ var Portal = function (_Component) {
6583
}, {
6684
key: 'componentWillUnmount',
6785
value: function componentWillUnmount() {
68-
unmountComponentAtNode(this.portalElement);
86+
(0, _reactDom.unmountComponentAtNode)(this.portalElement);
6987
document.body.removeChild(this.portalElement);
7088
}
7189
}, {
@@ -76,11 +94,11 @@ var Portal = function (_Component) {
7694
}]);
7795

7896
return Portal;
79-
}(Component);
97+
}(_react.Component);
8098

81-
export default Portal;
99+
exports.default = Portal;
82100

83101

84102
Portal.contextTypes = {
85-
theme: PropTypes.object.isRequired
103+
theme: _propTypes2.default.object.isRequired
86104
};

‎lib/components/Spinner.js

+24-10
Original file line numberDiff line numberDiff line change
@@ -1,20 +1,34 @@
1-
import PropTypes from 'prop-types';
2-
import React from 'react';
3-
import { css, StyleSheet } from 'aphrodite/no-important';
1+
'use strict';
2+
3+
Object.defineProperty(exports, "__esModule", {
4+
value: true
5+
});
6+
7+
var _propTypes = require('prop-types');
8+
9+
var _propTypes2 = _interopRequireDefault(_propTypes);
10+
11+
var _react = require('react');
12+
13+
var _react2 = _interopRequireDefault(_react);
14+
15+
var _noImportant = require('aphrodite/no-important');
16+
17+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
418

519
var Spinner = function Spinner(props) {
6-
var classes = StyleSheet.create(styles(props));
20+
var classes = _noImportant.StyleSheet.create(styles(props));
721

8-
return React.createElement(
22+
return _react2.default.createElement(
923
'div',
10-
{ className: css(classes.spinner) },
11-
React.createElement('div', { className: css(classes.ripple) })
24+
{ className: (0, _noImportant.css)(classes.spinner) },
25+
_react2.default.createElement('div', { className: (0, _noImportant.css)(classes.ripple) })
1226
);
1327
};
1428

1529
Spinner.propTypes = {
16-
color: PropTypes.string,
17-
size: PropTypes.number
30+
color: _propTypes2.default.string,
31+
size: _propTypes2.default.number
1832
};
1933

2034
var rippleKeyframes = {
@@ -57,4 +71,4 @@ var styles = function styles(_ref) {
5771
};
5872
};
5973

60-
export default Spinner;
74+
exports.default = Spinner;

‎lib/components/Thumbnail.js

+38-19
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,28 @@
1-
import PropTypes from 'prop-types';
2-
import React from 'react';
3-
import { css, StyleSheet } from 'aphrodite/no-important';
1+
'use strict';
42

5-
import defaults from '../theme';
6-
import deepMerge from '../utils/deepMerge';
3+
Object.defineProperty(exports, "__esModule", {
4+
value: true
5+
});
6+
7+
var _propTypes = require('prop-types');
8+
9+
var _propTypes2 = _interopRequireDefault(_propTypes);
10+
11+
var _react = require('react');
12+
13+
var _react2 = _interopRequireDefault(_react);
14+
15+
var _noImportant = require('aphrodite/no-important');
16+
17+
var _theme = require('../theme');
18+
19+
var _theme2 = _interopRequireDefault(_theme);
20+
21+
var _deepMerge = require('../utils/deepMerge');
22+
23+
var _deepMerge2 = _interopRequireDefault(_deepMerge);
24+
25+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
726

827
function Thumbnail(_ref, _ref2) {
928
var index = _ref.index,
@@ -14,10 +33,10 @@ function Thumbnail(_ref, _ref2) {
1433
var theme = _ref2.theme;
1534

1635
var url = thumbnail ? thumbnail : src;
17-
var classes = StyleSheet.create(deepMerge(defaultStyles, theme));
36+
var classes = _noImportant.StyleSheet.create((0, _deepMerge2.default)(defaultStyles, theme));
1837

19-
return React.createElement('div', {
20-
className: css(classes.thumbnail, active && classes.thumbnail__active),
38+
return _react2.default.createElement('div', {
39+
className: (0, _noImportant.css)(classes.thumbnail, active && classes.thumbnail__active),
2140
onClick: function onClick(e) {
2241
e.preventDefault();
2342
e.stopPropagation();
@@ -28,15 +47,15 @@ function Thumbnail(_ref, _ref2) {
2847
}
2948

3049
Thumbnail.propTypes = {
31-
active: PropTypes.bool,
32-
index: PropTypes.number,
33-
onClick: PropTypes.func.isRequired,
34-
src: PropTypes.string,
35-
thumbnail: PropTypes.string
50+
active: _propTypes2.default.bool,
51+
index: _propTypes2.default.number,
52+
onClick: _propTypes2.default.func.isRequired,
53+
src: _propTypes2.default.string,
54+
thumbnail: _propTypes2.default.string
3655
};
3756

3857
Thumbnail.contextTypes = {
39-
theme: PropTypes.object.isRequired
58+
theme: _propTypes2.default.object.isRequired
4059
};
4160

4261
var defaultStyles = {
@@ -47,14 +66,14 @@ var defaultStyles = {
4766
boxShadow: 'inset 0 0 0 1px hsla(0,0%,100%,.2)',
4867
cursor: 'pointer',
4968
display: 'inline-block',
50-
height: defaults.thumbnail.size,
51-
margin: defaults.thumbnail.gutter,
69+
height: _theme2.default.thumbnail.size,
70+
margin: _theme2.default.thumbnail.gutter,
5271
overflow: 'hidden',
53-
width: defaults.thumbnail.size
72+
width: _theme2.default.thumbnail.size
5473
},
5574
thumbnail__active: {
56-
boxShadow: 'inset 0 0 0 2px ' + defaults.thumbnail.activeBorderColor
75+
boxShadow: 'inset 0 0 0 2px ' + _theme2.default.thumbnail.activeBorderColor
5776
}
5877
};
5978

60-
export default Thumbnail;
79+
exports.default = Thumbnail;

‎lib/components/Thumbnails.js

+36-17
Original file line numberDiff line numberDiff line change
@@ -1,22 +1,41 @@
1+
'use strict';
2+
3+
Object.defineProperty(exports, "__esModule", {
4+
value: true
5+
});
6+
17
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
28

3-
import PropTypes from 'prop-types';
4-
import React from 'react';
5-
import { css, StyleSheet } from 'aphrodite/no-important';
6-
import Thumbnail from './Thumbnail';
9+
var _propTypes = require('prop-types');
10+
11+
var _propTypes2 = _interopRequireDefault(_propTypes);
12+
13+
var _react = require('react');
14+
15+
var _react2 = _interopRequireDefault(_react);
16+
17+
var _noImportant = require('aphrodite/no-important');
18+
19+
var _Thumbnail = require('./Thumbnail');
20+
21+
var _Thumbnail2 = _interopRequireDefault(_Thumbnail);
22+
23+
var _theme = require('../theme');
24+
25+
var _theme2 = _interopRequireDefault(_theme);
726

8-
import theme from '../theme';
27+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
928

1029
function Thumbnails(_ref) {
1130
var currentImage = _ref.currentImage,
1231
images = _ref.images,
1332
onClickThumbnail = _ref.onClickThumbnail;
1433

15-
return React.createElement(
34+
return _react2.default.createElement(
1635
'div',
17-
{ className: css(classes.thumbnails) },
36+
{ className: (0, _noImportant.css)(classes.thumbnails) },
1837
images.map(function (img, idx) {
19-
return React.createElement(Thumbnail, _extends({}, img, {
38+
return _react2.default.createElement(_Thumbnail2.default, _extends({}, img, {
2039
active: idx === currentImage,
2140
index: idx,
2241
key: idx,
@@ -27,24 +46,24 @@ function Thumbnails(_ref) {
2746
}
2847

2948
Thumbnails.propTypes = {
30-
currentImage: PropTypes.number,
31-
images: PropTypes.array,
32-
onClickThumbnail: PropTypes.func.isRequired
49+
currentImage: _propTypes2.default.number,
50+
images: _propTypes2.default.array,
51+
onClickThumbnail: _propTypes2.default.func.isRequired
3352
};
3453

35-
var classes = StyleSheet.create({
54+
var classes = _noImportant.StyleSheet.create({
3655
thumbnails: {
37-
bottom: theme.container.gutter.vertical,
56+
bottom: _theme2.default.container.gutter.vertical,
3857
color: 'white',
39-
height: theme.thumbnail.size,
40-
left: theme.container.gutter.horizontal,
58+
height: _theme2.default.thumbnail.size,
59+
left: _theme2.default.container.gutter.horizontal,
4160
overflowX: 'scroll',
4261
overflowY: 'hidden',
4362
position: 'absolute',
44-
right: theme.container.gutter.horizontal,
63+
right: _theme2.default.container.gutter.horizontal,
4564
textAlign: 'center',
4665
whiteSpace: 'nowrap'
4766
}
4867
});
4968

50-
export default Thumbnails;
69+
exports.default = Thumbnails;

‎lib/icons/arrowLeft.js

+8-2
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,9 @@
1-
export default (function (fill) {
1+
"use strict";
2+
3+
Object.defineProperty(exports, "__esModule", {
4+
value: true
5+
});
6+
7+
exports.default = function (fill) {
28
return "<svg fill=\"" + fill + "\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" x=\"0px\" y=\"0px\" width=\"100%\" height=\"100%\" viewBox=\"0 0 512 512\" xml:space=\"preserve\">\n\t\t<path d=\"M213.7,256L213.7,256L213.7,256L380.9,81.9c4.2-4.3,4.1-11.4-0.2-15.8l-29.9-30.6c-4.3-4.4-11.3-4.5-15.5-0.2L131.1,247.9 c-2.2,2.2-3.2,5.2-3,8.1c-0.1,3,0.9,5.9,3,8.1l204.2,212.7c4.2,4.3,11.2,4.2,15.5-0.2l29.9-30.6c4.3-4.4,4.4-11.5,0.2-15.8 L213.7,256z\"/>\n\t</svg>";
3-
});
9+
};

‎lib/icons/arrowRight.js

+8-2
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,9 @@
1-
export default (function (fill) {
1+
"use strict";
2+
3+
Object.defineProperty(exports, "__esModule", {
4+
value: true
5+
});
6+
7+
exports.default = function (fill) {
28
return "<svg fill=\"" + fill + "\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" x=\"0px\" y=\"0px\" width=\"100%\" height=\"100%\" viewBox=\"0 0 512 512\" xml:space=\"preserve\">\n\t\t<path d=\"M298.3,256L298.3,256L298.3,256L131.1,81.9c-4.2-4.3-4.1-11.4,0.2-15.8l29.9-30.6c4.3-4.4,11.3-4.5,15.5-0.2l204.2,212.7 c2.2,2.2,3.2,5.2,3,8.1c0.1,3-0.9,5.9-3,8.1L176.7,476.8c-4.2,4.3-11.2,4.2-15.5-0.2L131.3,446c-4.3-4.4-4.4-11.5-0.2-15.8 L298.3,256z\"/>\n\t</svg>";
3-
});
9+
};

‎lib/icons/close.js

+8-2
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,9 @@
1-
export default (function (fill) {
1+
"use strict";
2+
3+
Object.defineProperty(exports, "__esModule", {
4+
value: true
5+
});
6+
7+
exports.default = function (fill) {
28
return "<svg fill=\"" + fill + "\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" x=\"0px\" y=\"0px\" width=\"100%\" height=\"100%\" viewBox=\"0 0 512 512\" style=\"enable-background:new 0 0 512 512;\" xml:space=\"preserve\">\n\t\t<path d=\"M443.6,387.1L312.4,255.4l131.5-130c5.4-5.4,5.4-14.2,0-19.6l-37.4-37.6c-2.6-2.6-6.1-4-9.8-4c-3.7,0-7.2,1.5-9.8,4 L256,197.8L124.9,68.3c-2.6-2.6-6.1-4-9.8-4c-3.7,0-7.2,1.5-9.8,4L68,105.9c-5.4,5.4-5.4,14.2,0,19.6l131.5,130L68.4,387.1 c-2.6,2.6-4.1,6.1-4.1,9.8c0,3.7,1.4,7.2,4.1,9.8l37.4,37.6c2.7,2.7,6.2,4.1,9.8,4.1c3.5,0,7.1-1.3,9.8-4.1L256,313.1l130.7,131.1 c2.7,2.7,6.2,4.1,9.8,4.1c3.5,0,7.1-1.3,9.8-4.1l37.4-37.6c2.6-2.6,4.1-6.1,4.1-9.8C447.7,393.2,446.2,389.7,443.6,387.1z\"/>\n\t</svg>";
3-
});
9+
};

‎lib/theme.js

+6-1
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,8 @@
1+
'use strict';
2+
3+
Object.defineProperty(exports, "__esModule", {
4+
value: true
5+
});
16
// ==============================
27
// THEME
38
// ==============================
@@ -50,4 +55,4 @@ theme.arrow = {
5055
height: 120
5156
};
5257

53-
export default theme;
58+
exports.default = theme;

‎lib/utils/bindFunctions.js

+7-1
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,9 @@
1+
"use strict";
2+
3+
Object.defineProperty(exports, "__esModule", {
4+
value: true
5+
});
6+
exports.default = bindFunctions;
17
/**
28
Bind multiple component methods:
39
@@ -10,7 +16,7 @@
1016
}
1117
*/
1218

13-
export default function bindFunctions(functions) {
19+
function bindFunctions(functions) {
1420
var _this = this;
1521

1622
functions.forEach(function (f) {

‎lib/utils/canUseDom.js

+6-1
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,8 @@
1+
'use strict';
2+
3+
Object.defineProperty(exports, "__esModule", {
4+
value: true
5+
});
16
// Return true if window + document
27

3-
export default !!(typeof window !== 'undefined' && window.document && window.document.createElement);
8+
exports.default = !!(typeof window !== 'undefined' && window.document && window.document.createElement);

‎lib/utils/deepMerge.js

+7-1
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,9 @@
1+
'use strict';
2+
3+
Object.defineProperty(exports, "__esModule", {
4+
value: true
5+
});
6+
17
var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };
28

39
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
@@ -22,4 +28,4 @@ function deepMerge(target) {
2228
return extended;
2329
}
2430

25-
export default deepMerge;
31+
exports.default = deepMerge;

‎package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "react-images",
3-
"version": "0.5.18",
3+
"version": "0.5.19",
44
"description": "A simple, responsive lightbox component for displaying an array of images with React.js",
55
"main": "lib/Lightbox.js",
66
"jsnext:main": "dist/react-images.es.js",

0 commit comments

Comments
 (0)
Please sign in to comment.