Skip to content

Commit c6d9c2b

Browse files
committed
0.5.19
1 parent 86cfcd9 commit c6d9c2b

25 files changed

Lines changed: 585 additions & 286 deletions

.github/HISTORY.md

Lines changed: 3 additions & 0 deletions
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

Lines changed: 1 addition & 1 deletion
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

Lines changed: 1 addition & 1 deletion
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

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

examples/src/standalone.html

Lines changed: 1 addition & 1 deletion
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

Lines changed: 124 additions & 76 deletions
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;

0 commit comments

Comments
 (0)