react-images-viewer - npm Package Compare versions

Comparing version 1.6.3 to 1.6.4

package.json

 {
   "name": "react-images-viewer",
-  "version": "1.6.3",
+  "version": "1.6.4",
   "description": "Create an react-images-viewer component.",
@@ -5,0 +5,0 @@ "main": "lib/ImgsViewer.js",

README_CN.md

 # react-images-viewer
 
 [![Build Status](https://travis-ci.org/guonanci/react-images-viewer.svg?branch=master)](https://travis-ci.org/guonanci/react-images-viewer)
+
 <!-- [![Coverage Status](https://coveralls.io/repos/github/guonanci/react-images-viewer/badge.svg?branch=master)](https://coveralls.io/github/guonanci/react-images-viewer?branch=master) -->
+
 [![jest](https://jestjs.io/img/jest-badge.svg)](https://github.com/facebook/jest)
@@ -25,4 +27,4 @@
 ```jsx
-import React from 'react'
-import ImgsViewer from 'react-images-viewer'
+import React from "react";
+import ImgsViewer from "react-images-viewer";
 
@@ -33,3 +35,6 @@ export default class Demo extends React.Component {
       <ImgsViewer
-        imgs={[{ src: 'http://example.com/img1.jpg' }, { src: 'http://example.com/img2.png' }]}
+        imgs={[
+          { src: "http://example.com/img1.jpg" },
+          { src: "http://example.com/img2.png" },
+        ]}
         currImg={this.state.currImg}
@@ -41,3 +46,3 @@ isOpen={this.state.viewerIsOpen}
       />
-    )
+    );
   }
@@ -59,3 +64,3 @@ }
 
-### srcSet使用
+### srcSet 使用
 
@@ -74,18 +79,19 @@ 例子:
   {
-    src: 'http://example.com/img1.svg',
-    caption: 'A forest',
+    src: "http://example.com/img1.svg",
+    caption: "A forest",
     // As an array
     srcSet: [
-      'http://example.com/img1_1024.jpg 1024w',
-      'http://example.com/img1_800.jpg 800w',
-      'http://example.com/img1_500.jpg 500w',
-      'http://example.com/img1_320.jpg 320w'
-    ]
+      "http://example.com/img1_1024.jpg 1024w",
+      "http://example.com/img1_800.jpg 800w",
+      "http://example.com/img1_500.jpg 500w",
+      "http://example.com/img1_320.jpg 320w",
+    ],
   },
   {
-    src: 'http://example.com/img2.svg',
+    src: "http://example.com/img2.svg",
     // As a string
-    srcSet: 'http://example.com/img2_1024.jpg 1024w, http://example.com/img2_800.jpg 800w, http://example.com/img2_500.jpg 500w, http://example.com/img2_320.jpg 320w',
-  }
-]
+    srcSet:
+      "http://example.com/img2_1024.jpg 1024w, http://example.com/img2_800.jpg 800w, http://example.com/img2_500.jpg 500w, http://example.com/img2_320.jpg 320w",
+  },
+];
 ```
@@ -95,35 +101,36 @@
 
-Property      | Type      | Default     | Description
-:-----------|:------------|:-------------|:-------------
-backdropCloseable | 布尔值 | false | 是否通过点击半透明幕布来退出浏览
-closeBtnTitle | 字符串 | '关闭（空格键）' | 关闭按钮的 title
-enableKeyboardInput | 布尔值 | true | 支持键盘输入 - <code>空格键，esc</code>, <code>左箭头，上箭头</code>，和<code>右箭头，下箭头</code>
-currImg | 数值类型 | 0 | 必须项（如果需要导航的话），初始化图像的索引
-customCtrls | 数组 | undefined | 图片查看器顶部的控件元素数组
-imgs | 数组 | undefined | 必须项. 图片元素数组，图像选项见下表。
-imgsSeparator | 字符串 | ' / ' | 图片计数分隔符
-isOpen | 布尔值 | false | 必须项（如果需要导航的话），图片是否显示
-leftArrowTitle | 字符串 | '上一张（左箭头）' | 左箭头的 title
-onClickPrev | 函数 | undefined | 必须项（如果需要导航的话），请求上一张时触发
-onClickNext | 函数 | undefined | 必须项（如果需要导航的话），请求下一张时触发
-onClose | 函数 | undefined | 关闭查看器的回调
-onClickImg | 函数 | undefined | 点起当前图片的回调
-onClickThumbnail | 函数 | undefined | 缩略点击的回调
-preloadNextImg | 布尔值 | true | 是否预加载下一张图片
-rightArrowTitle | 字符串 | '下一张（右箭头）' | 右箭头的 title
-showCloseBtn | 布尔值 | true | 右上角是否显示 X 按钮
-showImgCount | 布尔值 | true | 是否显示图片索引
-width | 数值类型 | 1024| 轮播器的最大的宽度，默认值1024px
-spinner | 函数 | DefaultSpinner | 加载器组件
-spinnerColor | 字符串 | '#fff' | 加载器颜色
-spinnnerSize | 数值类型 | 50 | 加载器尺寸
-preventAutoScroll | 布尔值 | true | 是否阻止自动滚动
+| Property            | Type     | Default            | Description                                                                                         |
+| :------------------ | :------- | :----------------- | :-------------------------------------------------------------------------------------------------- |
+| backdropCloseable   | 布尔值   | false              | 是否通过点击半透明幕布来退出浏览                                                                    |
+| closeBtnTitle       | 字符串   | '关闭（空格键）'   | 关闭按钮的 title                                                                                    |
+| enableKeyboardInput | 布尔值   | true               | 支持键盘输入 - <code>空格键，esc</code>, <code>左箭头，上箭头</code>，和<code>右箭头，下箭头</code> |
+| currImg             | 数值类型 | 0                  | 必须项（如果需要导航的话），初始化图像的索引                                                        |
+| customCtrls         | 数组     | undefined          | 图片查看器顶部的控件元素数组                                                                        |
+| imgs                | 数组     | undefined          | 必须项. 图片元素数组，图像选项见下表。                                                              |
+| imgsSeparator       | 字符串   | ' / '              | 图片计数分隔符                                                                                      |
+| isOpen              | 布尔值   | false              | 必须项（如果需要导航的话），图片是否显示                                                            |
+| leftArrowTitle      | 字符串   | '上一张（左箭头）' | 左箭头的 title                                                                                      |
+| onClickPrev         | 函数     | undefined          | 必须项（如果需要导航的话），请求上一张时触发                                                        |
+| onClickNext         | 函数     | undefined          | 必须项（如果需要导航的话），请求下一张时触发                                                        |
+| onClose             | 函数     | undefined          | 关闭查看器的回调                                                                                    |
+| onClickImg          | 函数     | undefined          | 点起当前图片的回调                                                                                  |
+| onClickThumbnail    | 函数     | undefined          | 缩略点击的回调                                                                                      |
+| preloadNextImg      | 布尔值   | true               | 是否预加载下一张图片                                                                                |
+| rightArrowTitle     | 字符串   | '下一张（右箭头）' | 右箭头的 title                                                                                      |
+| showCloseBtn        | 布尔值   | true               | 右上角是否显示 X 按钮                                                                               |
+| showImgCount        | 布尔值   | true               | 是否显示图片索引                                                                                    |
+| width               | 数值类型 | 1024               | 轮播器的最大的宽度，默认值 1024px                                                                   |
+| spinnerDisabled     | bool     | false              | 禁用加载器                                                                                          |
+| spinner             | 函数     | DefaultSpinner     | 加载器组件                                                                                          |
+| spinnerColor        | 字符串   | '#fff'             | 加载器颜色                                                                                          |
+| spinnnerSize        | 数值类型 | 50                 | 加载器尺寸                                                                                          |
+| preventAutoScroll   | 布尔值   | true               | 是否阻止自动滚动                                                                                    |
 
 ## Imgs Object
 
-Property      | Type     | Default      | Description
-:----------|:----------|:----------|:----------
-src     | 字符串     | undefined     | 必须项
-srcSet      | 字符串数组或者字符串     | undefined     | 可选项
-caption     | 字符串     | undefined     | 可选项
-alt     | 字符串     | undefined     | 可选项
+| Property | Type                 | Default   | Description |
+| :------- | :------------------- | :-------- | :---------- |
+| src      | 字符串               | undefined | 必须项      |
+| srcSet   | 字符串数组或者字符串 | undefined | 可选项      |
+| caption  | 字符串               | undefined | 可选项      |
+| alt      | 字符串               | undefined | 可选项      |

README.md

 # react-images-viewer
 
 [![Build Status](https://travis-ci.org/guonanci/react-images-viewer.svg?branch=master)](https://travis-ci.org/guonanci/react-images-viewer)
+
 <!-- [![Coverage Status](https://coveralls.io/repos/github/guonanci/react-images-viewer/badge.svg?branch=master)](https://coveralls.io/github/guonanci/react-images-viewer?branch=master) -->
+
 [![jest](https://jestjs.io/img/jest-badge.svg)](https://github.com/facebook/jest)
@@ -25,4 +27,4 @@
 ```jsx
-import React from 'react'
-import ImgsViewer from 'react-images-viewer'
+import React from "react";
+import ImgsViewer from "react-images-viewer";
 
@@ -33,3 +35,6 @@ export default class Demo extends React.Component {
       <ImgsViewer
-        imgs={[{ src: 'http://example.com/img1.jpg' }, { src: 'http://example.com/img2.png' }]}
+        imgs={[
+          { src: "http://example.com/img1.jpg" },
+          { src: "http://example.com/img2.png" },
+        ]}
         currImg={this.state.currImg}
@@ -41,3 +46,3 @@ isOpen={this.state.viewerIsOpen}
       />
-    )
+    );
   }
@@ -73,18 +78,19 @@ }
   {
-    src: 'http://example.com/img1.svg',
-    caption: 'A forest',
+    src: "http://example.com/img1.svg",
+    caption: "A forest",
     // As an array
     srcSet: [
-      'http://example.com/img1_1024.jpg 1024w',
-      'http://example.com/img1_800.jpg 800w',
-      'http://example.com/img1_500.jpg 500w',
-      'http://example.com/img1_320.jpg 320w'
-    ]
+      "http://example.com/img1_1024.jpg 1024w",
+      "http://example.com/img1_800.jpg 800w",
+      "http://example.com/img1_500.jpg 500w",
+      "http://example.com/img1_320.jpg 320w",
+    ],
   },
   {
-    src: 'http://example.com/img2.svg',
+    src: "http://example.com/img2.svg",
     // As a string
-    srcSet: 'http://example.com/img2_1024.jpg 1024w, http://example.com/img2_800.jpg 800w, http://example.com/img2_500.jpg 500w, http://example.com/img2_320.jpg 320w',
-  }
-]
+    srcSet:
+      "http://example.com/img2_1024.jpg 1024w, http://example.com/img2_800.jpg 800w, http://example.com/img2_500.jpg 500w, http://example.com/img2_320.jpg 320w",
+  },
+];
 ```
@@ -94,35 +100,36 @@
 
-Property      | Type      | Default     | Description
-:-----------|:------------|:-------------|:-------------
-backdropCloseable | bool | false | Allow users to exit the viewer by clicking the backdrop
-closeBtnTitle | str | '关闭（空格键）' | Customize close esc title
-enableKeyboardInput | bool | true | Supports keyboard input - <code>space, esc</code>, <code> arrow left, arrow up</code>, and <code>arrow right, arrow down</code>
-currImg | num | 0 | Required if you want to navigate the imgsViewer, The index of the image to display initially
-customControls | arr | undefined | An array of elements to display as custom controls on the top of viewer
-imgs | arr | undefined | Required. Array of image objects, See img opts table below
-imgCountSeparator | str | ' / ' | Customize separator in the image count
-isOpen | bool | false | Required if you want to navigate the imgsViewer, Whether or not the viewer is displayed
-leftArrowTitle | str | '上一张（左箭头）' | Customize of left arrow title
-onClickPrev | func | undefined | Required if you want to navigate the imgsViewer, and fired on request of the previous image
-onClickNext | func | undefined | Required if you want to navigate the imgsViewer, and fired on request of the next image
-onClose | func | undefined | Required if you want to close the imgsViewer, and handle closing of the viewer
-onClickImg | func | undefined | Handle click on current image
-onClickThumbnail | func | undefined | Handle click on thumbnail
-preloadNextImg | bool | true | Whether to preload the next available image
-rightArrowTitle | str | '下一张（右箭头）' | Customize right arrow title
-showCloseBtn | bool | true | Optionally display a close 'X' button in top right corner
-showImgCount | bool | true | Optionally display image index, e.g., "2 of 20"
-width | number | 1024 | Maximum width of the carousel; defaults to 1024px
-spinner | func | DefaultSpinner | Spinner component class
-spinnerColor | str | '#fff' | Color of spinner
-spinnnerSize | num | 50 | Size of spinner
-preventAutoScroll | bool | true | Determines whether auto-scrolling is prevented
+| Property            | Type   | Default            | Description                                                                                                                     |
+| :------------------ | :----- | :----------------- | :------------------------------------------------------------------------------------------------------------------------------ |
+| backdropCloseable   | bool   | false              | Allow users to exit the viewer by clicking the backdrop                                                                         |
+| closeBtnTitle       | str    | '关闭（空格键）'   | Customize close esc title                                                                                                       |
+| enableKeyboardInput | bool   | true               | Supports keyboard input - <code>space, esc</code>, <code> arrow left, arrow up</code>, and <code>arrow right, arrow down</code> |
+| currImg             | num    | 0                  | Required if you want to navigate the imgsViewer, The index of the image to display initially                                    |
+| customControls      | arr    | undefined          | An array of elements to display as custom controls on the top of viewer                                                         |
+| imgs                | arr    | undefined          | Required. Array of image objects, See img opts table below                                                                      |
+| imgCountSeparator   | str    | ' / '              | Customize separator in the image count                                                                                          |
+| isOpen              | bool   | false              | Required if you want to navigate the imgsViewer, Whether or not the viewer is displayed                                         |
+| leftArrowTitle      | str    | '上一张（左箭头）' | Customize of left arrow title                                                                                                   |
+| onClickPrev         | func   | undefined          | Required if you want to navigate the imgsViewer, and fired on request of the previous image                                     |
+| onClickNext         | func   | undefined          | Required if you want to navigate the imgsViewer, and fired on request of the next image                                         |
+| onClose             | func   | undefined          | Required if you want to close the imgsViewer, and handle closing of the viewer                                                  |
+| onClickImg          | func   | undefined          | Handle click on current image                                                                                                   |
+| onClickThumbnail    | func   | undefined          | Handle click on thumbnail                                                                                                       |
+| preloadNextImg      | bool   | true               | Whether to preload the next available image                                                                                     |
+| rightArrowTitle     | str    | '下一张（右箭头）' | Customize right arrow title                                                                                                     |
+| showCloseBtn        | bool   | true               | Optionally display a close 'X' button in top right corner                                                                       |
+| showImgCount        | bool   | true               | Optionally display image index, e.g., "2 of 20"                                                                                 |
+| width               | number | 1024               | Maximum width of the carousel; defaults to 1024px                                                                               |
+| spinnerDisabled     | bool   | false              | Disable Spinner                                                                                                                 |
+| spinner             | func   | DefaultSpinner     | Spinner component class                                                                                                         |
+| spinnerColor        | str    | '#fff'             | Color of spinner                                                                                                                |
+| spinnnerSize        | num    | 50                 | Size of spinner                                                                                                                 |
+| preventAutoScroll   | bool   | true               | Determines whether auto-scrolling is prevented                                                                                  |
 
 ## Imgs Object
 
-Property      | Type     | Default      | Description
-:----------|:----------|:----------|:----------
-src     | str     | undefined     | Required
-srcSet      | arr of str or str     | undefined     | Optional
-caption     | str     | undefined     | Optional
-alt     | str     | undefined     | Optional
+| Property | Type              | Default   | Description |
+| :------- | :---------------- | :-------- | :---------- |
+| src      | str               | undefined | Required    |
+| srcSet   | arr of str or str | undefined | Optional    |
+| caption  | str               | undefined | Optional    |
+| alt      | str               | undefined | Optional    |

No alert changes

Improved metrics

Total package byte prevSize

211178

increased by2.67%

Number of lines in readme file

131

increased by5.65%

No dependency changes