react-image-gallery 1.2.12 → 1.4.0

package/src/Item.js

@@ -1,79 +0,0 @@
-import React from 'react';
-import { bool, func, string } from 'prop-types';
-
-const defaultProps = {
-  description: '',
-  fullscreen: '',
-  isFullscreen: false,
-  originalAlt: '',
-  originalHeight: '',
-  originalWidth: '',
-  originalTitle: '',
-  sizes: '',
-  srcSet: '',
-  loading: 'eager',
-};
-
-const Item = React.memo((props) => {
-  const {
-    description,
-    fullscreen, // fullscreen version of img
-    handleImageLoaded,
-    isFullscreen,
-    onImageError,
-    original,
-    originalAlt,
-    originalHeight,
-    originalWidth,
-    originalTitle,
-    sizes,
-    srcSet,
-    loading,
-  } = {...defaultProps, ...props};
-  const itemSrc = isFullscreen ? (fullscreen || original) : original;
-
-  return (
-    <React.Fragment>
-      <img
-        className="image-gallery-image"
-        src={itemSrc}
-        alt={originalAlt}
-        srcSet={srcSet}
-        height={originalHeight}
-        width={originalWidth}
-        sizes={sizes}
-        title={originalTitle}
-        onLoad={event => handleImageLoaded(event, original)}
-        onError={onImageError}
-        loading={loading}
-      />
-      {
-        description && (
-          <span className="image-gallery-description">
-            {description}
-          </span>
-        )
-      }
-    </React.Fragment>
-  );
-});
-
-Item.displayName = 'Item';
-
-Item.propTypes = {
-  description: string,
-  fullscreen: string, // fullscreen version of img
-  handleImageLoaded: func.isRequired,
-  isFullscreen: bool,
-  onImageError: func.isRequired,
-  original: string.isRequired,
-  originalAlt: string,
-  originalHeight: string,
-  originalWidth: string,
-  originalTitle: string,
-  sizes: string,
-  srcSet: string,
-  loading: string,
-};
-
-export default Item;

package/src/SVG.js

@@ -1,65 +0,0 @@
-import React from 'react';
-import { number, oneOf, string } from 'prop-types';
-
-const left = <polyline points="15 18 9 12 15 6" />;
-const right = <polyline points="9 18 15 12 9 6" />;
-const maximize = <path d="M8 3H5a2 2 0 0 0-2 2v3m18 0V5a2 2 0 0 0-2-2h-3m0 18h3a2 2 0 0 0 2-2v-3M3 16v3a2 2 0 0 0 2 2h3" />;
-const minimize = <path d="M8 3v3a2 2 0 0 1-2 2H3m18 0h-3a2 2 0 0 1-2-2V3m0 18v-3a2 2 0 0 1 2-2h3M3 16h3a2 2 0 0 1 2 2v3" />;
-const play = <polygon points="5 3 19 12 5 21 5 3" />;
-const pause = (
-  <React.Fragment>
-    <rect x="6" y="4" width="4" height="16" />
-    <rect x="14" y="4" width="4" height="16" />
-  </React.Fragment>
-);
-
-const iconMapper = {
-  left,
-  right,
-  maximize,
-  minimize,
-  play,
-  pause,
-};
-
-const defaultProps = {
-  strokeWidth: 1,
-  viewBox: '0 0 24 24',
-};
-
-const SVG = (props) => {
-  const {
-    strokeWidth,
-    viewBox,
-    icon,
-  } = {...defaultProps, ...props};
-  return (
-    <svg
-      className="image-gallery-svg"
-      xmlns="http://www.w3.org/2000/svg"
-      viewBox={viewBox}
-      fill="none"
-      stroke="currentColor"
-      strokeWidth={strokeWidth}
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    >
-      {iconMapper[icon]}
-    </svg>
-  );
-};
-
-SVG.propTypes = {
-  strokeWidth: number,
-  viewBox: string,
-  icon: oneOf([
-    'left',
-    'right',
-    'maximize',
-    'minimize',
-    'play',
-    'pause',
-  ]).isRequired,
-};
-
-export default SVG;

package/src/SwipeWrapper.js

@@ -1,45 +0,0 @@
-import React from 'react';
-import {
-  string,
-  node,
-  number,
-  func,
-} from 'prop-types';
-import { useSwipeable } from 'react-swipeable';
-
-const defaultProps = {
-  className: '',
-  delta: 0,
-  onSwiping: () => {},
-  onSwiped: () => {},
-};
-
-const SwipeWrapper = (props) => {
-  const {
-    children,
-    className,
-    delta,
-    onSwiping,
-    onSwiped,
-  } = {...defaultProps, ...props};
-  const swipeHandlers = useSwipeable({
-    delta,
-    onSwiping,
-    onSwiped,
-  });
-  return (
-    <div {...swipeHandlers} className={className}>
-      {children}
-    </div>
-  );
-};
-
-SwipeWrapper.propTypes = {
-  children: node.isRequired,
-  className: string,
-  delta: number,
-  onSwiped: func,
-  onSwiping: func,
-};
-
-export default SwipeWrapper;

package/src/controls/Fullscreen.js

@@ -1,29 +0,0 @@
-import React from 'react';
-import { bool, func } from 'prop-types';
-import SVG from 'src/SVG';
-
-const Fullscreen = React.memo(({
-  isFullscreen,
-  onClick,
-}) => {
-  return (
-    <button
-      type="button"
-      className="image-gallery-icon image-gallery-fullscreen-button"
-      onClick={onClick}
-      aria-label="Open Fullscreen"
-    >
-      <SVG strokeWidth={2} icon={isFullscreen ? 'minimize' : 'maximize'} />
-    </button>
-  );
-});
-
-Fullscreen.displayName = 'Fullscreen';
-
-Fullscreen.propTypes = {
-  isFullscreen: bool.isRequired,
-  onClick: func.isRequired,
-};
-
-
-export default Fullscreen;

package/src/controls/LeftNav.js

@@ -1,30 +0,0 @@
-import React from 'react';
-import { bool, func } from 'prop-types';
-import SVG from 'src/SVG';
-
-const LeftNav = React.memo(({
-  disabled,
-  onClick,
-}) => {
-  return (
-    <button
-      type="button"
-      className="image-gallery-icon image-gallery-left-nav"
-      disabled={disabled}
-      onClick={onClick}
-      aria-label="Previous Slide"
-    >
-      <SVG icon="left" viewBox="6 0 12 24" />
-    </button>
-  );
-});
-
-LeftNav.displayName = 'LeftNav';
-
-LeftNav.propTypes = {
-  disabled: bool.isRequired,
-  onClick: func.isRequired,
-};
-
-
-export default LeftNav;

package/src/controls/PlayPause.js

@@ -1,29 +0,0 @@
-import React from 'react';
-import { bool, func } from 'prop-types';
-import SVG from 'src/SVG';
-
-const PlayPause = React.memo(({
-  isPlaying,
-  onClick,
-}) => {
-  return (
-    <button
-      type="button"
-      className="image-gallery-icon image-gallery-play-button"
-      onClick={onClick}
-      aria-label="Play or Pause Slideshow"
-    >
-      <SVG strokeWidth={2} icon={isPlaying ? 'pause' : 'play'} />
-    </button>
-  );
-});
-
-PlayPause.displayName = 'PlayPause';
-
-PlayPause.propTypes = {
-  isPlaying: bool.isRequired,
-  onClick: func.isRequired,
-};
-
-
-export default PlayPause;

package/src/controls/RightNav.js

@@ -1,30 +0,0 @@
-import React from 'react';
-import { bool, func } from 'prop-types';
-import SVG from 'src/SVG';
-
-const RightNav = React.memo(({
-  disabled,
-  onClick,
-}) => {
-  return (
-    <button
-      type="button"
-      className="image-gallery-icon image-gallery-right-nav"
-      disabled={disabled}
-      onClick={onClick}
-      aria-label="Next Slide"
-    >
-      <SVG icon="right" viewBox="6 0 12 24" />
-    </button>
-  );
-});
-
-RightNav.displayName = 'RightNav';
-
-RightNav.propTypes = {
-  disabled: bool.isRequired,
-  onClick: func.isRequired,
-};
-
-
-export default RightNav;

package/tests/ImageGallery.test.js

@@ -1,15 +0,0 @@
-import React from 'react';
-import { shallow } from 'enzyme';
-
-import ImageGallery from '../src/ImageGallery';
-
-describe('<ImageGallery />', () => {
-  const defaultProps = {
-    items: [],
-  };
-
-  it('matches snapshot', () => {
-    const component = shallow(<ImageGallery {...defaultProps} />);
-    expect(component).toMatchSnapshot();
-  });
-});

package/tests/__snapshots__/ImageGallery.test.js.snap

@@ -1,3 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`<ImageGallery /> matches snapshot 1`] = `ShallowWrapper {}`;

package/tests/setupTestFramework.js

@@ -1,4 +0,0 @@
-import Adapter from 'enzyme-adapter-react-16';
-import { configure } from 'enzyme';
-
-configure({ adapter: new Adapter() });

package/webpack.build.js

@@ -1,172 +0,0 @@
-
-const path = require('path');
-const MiniCssExtractPlugin = require('mini-css-extract-plugin');
-const RemovePlugin = require('remove-files-webpack-plugin');
-
-const config = {
-  mode: 'production',
-};
-
-const jsOutput = Object.assign({}, config, {
-  entry: [ './src/ImageGallery.js', ],
-  output: {
-    path: path.resolve(__dirname, 'build'),
-    filename: 'image-gallery.js',
-    library: 'ImageGallery',
-    globalObject: 'this',
-    libraryTarget: 'umd',
-  },
-  resolve: {
-    alias: {
-      src: path.resolve(__dirname, 'src/'),
-    },
-    extensions: ['.js']
-  },
-  module: {
-    rules: [
-      {
-        test: /\.js$/,
-        exclude: /node_modules/,
-        loader: 'babel-loader',
-      }
-    ]
-  },
-  externals: {
-    // Don't bundle react or react-dom
-    react: {
-      commonjs: 'react',
-      commonjs2: 'react',
-      amd: 'react',
-      root: 'React',
-    },
-    'react-dom': {
-      commonjs: 'react-dom',
-      commonjs2: 'react-dom',
-      amd: 'react-dom',
-      root: 'ReactDOM',
-    },
-  },
-});
-
-const cssOutput = Object.assign({}, config, {
-  entry: './styles/scss/image-gallery.scss',
-  output: {
-    path: path.resolve(__dirname, 'styles/css'),
-  },
-  module: {
-    rules: [
-      {
-        test: /\.(css|scss)$/i,
-        use: [
-          MiniCssExtractPlugin.loader,
-          // Translates CSS into CommonJS
-          'css-loader',
-          // Compiles Sass to CSS
-          'sass-loader',
-        ],
-      }
-    ]
-  },
-  plugins: [
-    new MiniCssExtractPlugin({
-      filename: 'image-gallery.css',
-    }),
-    new RemovePlugin({
-      /**
-       * After compilation permanently remove empty JS files created from CSS entries.
-       */
-      after: {
-        test: [
-          {
-            folder: 'styles/css',
-            method: (absoluteItemPath) => {
-              return new RegExp(/\.js$/, 'm').test(absoluteItemPath);
-            },
-          }
-        ]
-      }
-    }),
-  ],
-});
-
-const jsDemoOutput = Object.assign({}, config, {
-  entry: [ './example/app.js', ],
-  output: {
-    path: path.resolve(__dirname, 'demo'),
-    filename: 'demo.mini.js',
-  },
-  resolve: {
-    alias: {
-      src: path.resolve(__dirname, 'src/'),
-    },
-    extensions: ['.js']
-  },
-  module: {
-    rules: [
-      {
-        test: /\.js$/,
-        loader: 'babel-loader',
-      }
-    ]
-  },
-  plugins: [
-    new RemovePlugin({
-      /**
-       * After compilation permanently remove unused LICENSE.txt file
-       */
-      after: {
-        test: [
-          {
-            folder: 'demo',
-            method: (absoluteItemPath) => {
-              return new RegExp(/\.txt$/).test(absoluteItemPath);
-            },
-          }
-        ]
-      }
-    }),
-  ],
-});
-
-const cssDemoOutput = Object.assign({}, config, {
-  entry: ['./styles/scss/image-gallery.scss', './example/app.css'],
-  output: {
-    path: path.resolve(__dirname, 'demo'),
-  },
-  module: {
-    rules: [
-      {
-        test: /\.(css|scss)$/i,
-        use: [
-          MiniCssExtractPlugin.loader,
-          // Translates CSS into CommonJS
-          'css-loader',
-          // Compiles Sass to CSS
-          'sass-loader',
-        ],
-      }
-    ]
-  },
-  plugins: [
-    new MiniCssExtractPlugin({
-      filename: 'demo.mini.css',
-    }),
-    new RemovePlugin({
-      /**
-       * After compilation permanently remove empty JS files created from CSS entries.
-       */
-      after: {
-        test: [
-          {
-            folder: 'demo',
-            method: (absoluteItemPath) => {
-              return new RegExp(/\.js$/).test(absoluteItemPath);
-            },
-          }
-        ]
-      }
-    }),
-  ],
-});
-
-module.exports = [jsOutput, cssOutput, jsDemoOutput, cssDemoOutput];

package/webpack.config.js

@@ -1,49 +0,0 @@
-
-const path = require('path');
-const MiniCssExtractPlugin = require('mini-css-extract-plugin');
-
-module.exports = {
-  entry: ['./example/app.js', './example/app.css', './styles/scss/image-gallery.scss'],
-  output: {
-    path: path.resolve(__dirname, 'example'),
-    filename: 'example.js',
-    publicPath: '/dist/'
-  },
-  resolve: {
-    extensions: ['.js'],
-    alias: {
-      src: path.resolve(__dirname, 'src/'),
-    },
-  },
-  module: {
-    rules: [
-      {
-        test: /\.(js|jsx)$/,
-        loader: 'babel-loader',
-      },
-      {
-        test: /\.(css|scss)$/i,
-        use: [
-          // Creates `style` nodes from JS strings
-          "style-loader",
-          // Translates CSS into CommonJS
-          "css-loader",
-          // Compiles Sass to CSS
-          "sass-loader",
-        ],
-      }
-    ]
-  },
-  plugins: [
-    new MiniCssExtractPlugin({
-      filename: 'image-gallery.css',
-    }),
-  ],
-  devServer: {
-    host: '0.0.0.0',
-    port: 8001,
-    historyApiFallback: {
-      rewrites: [{ from: /\//, to: '/example/index.html' }],
-    },
-  },
-};