react-photoswipe-component

WebJar for react-photoswipe-component

License	MIT
Categories	React User Interface Web Frameworks
GroupId	org.webjars.npm
ArtifactId	react-photoswipe-component
Last Version	1.0.13
Release Date	May 17, 2018
Type	jar
Description	react-photoswipe-component WebJar for react-photoswipe-component
Project URL	http://webjars.org
Source Code Management	https://github.com/GopherLabsLtd/react-photoswipe

Download react-photoswipe-component

Filename	Size
react-photoswipe-component-1.0.13.pom
react-photoswipe-component-1.0.13.jar	63 KB
react-photoswipe-component-1.0.13-sources.jar	22 bytes
react-photoswipe-component-1.0.13-javadoc.jar	22 bytes

How to add to project

Apache Maven

<!-- https://jarcasting.com/artifacts/org.webjars.npm/react-photoswipe-component/ -->
<dependency>
    <groupId>org.webjars.npm</groupId>
    <artifactId>react-photoswipe-component</artifactId>
    <version>1.0.13</version>
</dependency>

Gradle Groovy

// https://jarcasting.com/artifacts/org.webjars.npm/react-photoswipe-component/
implementation 'org.webjars.npm:react-photoswipe-component:1.0.13'

Gradle Kotlin

// https://jarcasting.com/artifacts/org.webjars.npm/react-photoswipe-component/
implementation ("org.webjars.npm:react-photoswipe-component:1.0.13")

Apache Buildr

'org.webjars.npm:react-photoswipe-component:jar:1.0.13'

Apache Ivy

<dependency org="org.webjars.npm" name="react-photoswipe-component" rev="1.0.13">
  <artifact name="react-photoswipe-component" type="jar" />
</dependency>

Groovy Grape

@Grapes(
@Grab(group='org.webjars.npm', module='react-photoswipe-component', version='1.0.13')
)

Scala SBT

libraryDependencies += "org.webjars.npm" % "react-photoswipe-component" % "1.0.13"

Leiningen

[org.webjars.npm/react-photoswipe-component "1.0.13"]

Dependencies

compile (4)

Group / Artifact	Type	Version
org.webjars.npm : isomorphic-style-loader	jar	[4.0.0,5)
org.webjars.npm : photoswipe	jar	[4.1.2,5)
org.webjars.npm : react	jar	[16.0.0,17)
org.webjars.npm : webpack	jar	[3.8.1,4)

Project Modules

There are no modules declared in this project.

React PhotoSwipe Component

A React component for PhotoSwipe lightbox

Installation

NPM

npm install --save photoswipe react-photoswipe-component

How to Use:

JS:

import { PhotoSwipeGallery } from 'react-photoswipe-component'
import "../node_modules/photoswipe/dist/photoswipe.css"
import "../node_modules/photoswipe/dist/default-skin/default-skin.css"
import "../node_modules/react-photoswipe-component/src/style.css"

const PHOTO_ITEMS = [
    {
        src: 'http://via.placeholder.com/800x394',
        w: 800,
        h: 394,
        caption: "Test Cap"
    },
    {
        src: 'http://via.placeholder.com/1200x900',
        w: 1200,
        h: 900,
        caption: "Caption 123"
    }
];

class SwipePhotoTest extends React.Component {
  render() {    
    return (
      <div>
        <PhotoSwipeGallery items={PHOTO_ITEMS} />
        
        {/* Or you can try this */}
        
        <PhotoSwipeGallery items={PHOTO_ITEMS}>
            Open Gallery
        </PhotoSwipeGallery>
      </div>
    )
  }
}

export default SwipePhotoTest

Future Goals:

• Automatic image resizing and responsiveness
• Autoplay
• SEO (Schemas)

Gopher Labs

Scalable Web/Mobile Application Approaches

Versions

Version
1.0.13 May 17, 2018