react-modal-image
Advanced tools
+5
-3
@@ -12,3 +12,5 @@ import React from "react"; | ||
| toggleZoom = _ref.toggleZoom, | ||
| onClose = _ref.onClose; | ||
| onClose = _ref.onClose, | ||
| enableDownload = _ref.enableDownload, | ||
| enableZoom = _ref.enableZoom; | ||
| return React.createElement( | ||
@@ -20,3 +22,3 @@ "div", | ||
| { style: iconMenu }, | ||
| React.createElement( | ||
| enableDownload && React.createElement( | ||
| "a", | ||
@@ -31,3 +33,3 @@ { | ||
| ), | ||
| React.createElement( | ||
| enableZoom && React.createElement( | ||
| "a", | ||
@@ -34,0 +36,0 @@ { |
+6
-2
@@ -42,3 +42,5 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } | ||
| large = _props.large, | ||
| alt = _props.alt; | ||
| alt = _props.alt, | ||
| hideDownload = _props.hideDownload, | ||
| hideZoom = _props.hideZoom; | ||
| var modalOpen = this.state.modalOpen; | ||
@@ -62,3 +64,5 @@ | ||
| alt: alt, | ||
| onClose: this.toggleModal | ||
| onClose: this.toggleModal, | ||
| hideDownload: hideDownload, | ||
| hideZoom: hideZoom | ||
| }) | ||
@@ -65,0 +69,0 @@ ); |
+6
-2
@@ -137,3 +137,5 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } | ||
| alt = _props.alt, | ||
| onClose = _props.onClose; | ||
| onClose = _props.onClose, | ||
| hideDownload = _props.hideDownload, | ||
| hideZoom = _props.hideZoom; | ||
| var _state = this.state, | ||
@@ -180,3 +182,5 @@ move = _state.move, | ||
| toggleZoom: this.toggleZoom, | ||
| onClose: onClose | ||
| onClose: onClose, | ||
| enableDownload: !hideDownload, | ||
| enableZoom: !hideZoom | ||
| }) | ||
@@ -183,0 +187,0 @@ ); |
+5
-3
@@ -20,3 +20,5 @@ "use strict"; | ||
| toggleZoom = _ref.toggleZoom, | ||
| onClose = _ref.onClose; | ||
| onClose = _ref.onClose, | ||
| enableDownload = _ref.enableDownload, | ||
| enableZoom = _ref.enableZoom; | ||
| return _react2.default.createElement( | ||
@@ -28,3 +30,3 @@ "div", | ||
| { style: _styles.iconMenu }, | ||
| _react2.default.createElement( | ||
| enableDownload && _react2.default.createElement( | ||
| "a", | ||
@@ -39,3 +41,3 @@ { | ||
| ), | ||
| _react2.default.createElement( | ||
| enableZoom && _react2.default.createElement( | ||
| "a", | ||
@@ -42,0 +44,0 @@ { |
+6
-2
@@ -59,3 +59,5 @@ "use strict"; | ||
| large = _props.large, | ||
| alt = _props.alt; | ||
| alt = _props.alt, | ||
| hideDownload = _props.hideDownload, | ||
| hideZoom = _props.hideZoom; | ||
| var modalOpen = this.state.modalOpen; | ||
@@ -79,3 +81,5 @@ | ||
| alt: alt, | ||
| onClose: this.toggleModal | ||
| onClose: this.toggleModal, | ||
| hideDownload: hideDownload, | ||
| hideZoom: hideZoom | ||
| }) | ||
@@ -82,0 +86,0 @@ ); |
+6
-2
@@ -155,3 +155,5 @@ "use strict"; | ||
| alt = _props.alt, | ||
| onClose = _props.onClose; | ||
| onClose = _props.onClose, | ||
| hideDownload = _props.hideDownload, | ||
| hideZoom = _props.hideZoom; | ||
| var _state = this.state, | ||
@@ -198,3 +200,5 @@ move = _state.move, | ||
| toggleZoom: this.toggleZoom, | ||
| onClose: onClose | ||
| onClose: onClose, | ||
| enableDownload: !hideDownload, | ||
| enableZoom: !hideZoom | ||
| }) | ||
@@ -201,0 +205,0 @@ ); |
+6
-6
| { | ||
| "name": "react-modal-image", | ||
| "version": "2.1.4", | ||
| "version": "2.2.0", | ||
| "description": "Lightweight Lightbox React Component", | ||
@@ -15,3 +15,3 @@ "main": "lib/index.js", | ||
| "clean": "nwb clean-module && nwb clean-demo", | ||
| "start": "nwb serve-react-demo -p 8888", | ||
| "start": "nwb serve-react-demo --port 8888", | ||
| "start:static": "http-server demo/dist/ -s -p 8888", | ||
@@ -26,9 +26,9 @@ "cypress:open": "cypress open", | ||
| "devDependencies": { | ||
| "cypress": "^1.4.1", | ||
| "gh-pages": "^1.1.0", | ||
| "cypress": "^3.1.0", | ||
| "gh-pages": "^1.2.0", | ||
| "http-server": "^0.11.1", | ||
| "nwb": "0.21.x", | ||
| "nwb": "^0.23.0", | ||
| "react": "^16.2.0", | ||
| "react-dom": "^16.2.0", | ||
| "start-server-and-test": "^1.0.0" | ||
| "start-server-and-test": "^1.7.1" | ||
| }, | ||
@@ -35,0 +35,0 @@ "repository": { |
+12
-8
@@ -18,2 +18,3 @@ # react-modal-image | ||
| * User can zoom & move the image or download the highest quality one | ||
| * Download and Zoom -buttons can be hidden. | ||
| * Image alt shown as title of lightbox | ||
@@ -35,11 +36,14 @@ | ||
| | Prop | Type | Description | | ||
| | ------------- | -------- | ----------------------------------------------------------------------------------- | | ||
| | `className` | `String` | Optional. `class` for the small preview image. | | ||
| | `alt` | `String` | Optional. `alt` for the small image and the heading text in Lightbox. | | ||
| | `small` | `URL` | `src` for the small preview image. | | ||
| | `smallSrcSet` | `String` | Optional. `srcSet` for the small preview image. | | ||
| | `medium` | `URL` | Optional if `large` is defined. Image shown when zoomed out in Lightbox. | | ||
| | `large` | `URL` | Optional if `medium` is defined. Image shown when zoomed in Lightbox. Downloadable. | | ||
| | Prop | Type | Description | | ||
| | -------------- | --------- | ----------------------------------------------------------------------------------- | | ||
| | `className` | `String` | Optional. `class` for the small preview image. | | ||
| | `alt` | `String` | Optional. `alt` for the small image and the heading text in Lightbox. | | ||
| | `small` | `URL` | `src` for the small preview image. | | ||
| | `smallSrcSet` | `String` | Optional. `srcSet` for the small preview image. | | ||
| | `medium` | `URL` | Optional if `large` is defined. Image shown when zoomed out in Lightbox. | | ||
| | `large` | `URL` | Optional if `medium` is defined. Image shown when zoomed in Lightbox. Downloadable. | | ||
| | `hideDownload` | `boolean` | Optional. Set to `true` to hide download-button from the Lightbox. | | ||
| | `hideZoom` | `boolean` | Optional. Set to `true` to hide zoom-button from the Lightbox. | | ||
| ## Lightbox-only API | ||
@@ -46,0 +50,0 @@ |
39846
2.87%964
2.12%84
5%