react-cartgallery

About

React component with the implementation of the ability to mark photos (add-in-cart, like-mark).

Based on lightgallery.js: https://sachinchoolur.github.io/lightgallery.js

Installation

npm install react-cartgallery

Usage

import React from 'react';
import {CartgalleryProvider, CartgalleryItem} from 'cart-gallery';
import "cart-gallery/es/css/cartgallery.css";
import i01 from "./images/i01.jpg";
import i02 from "./images/i02.jpg";
import i03 from "./images/i03.jpg";
 
let cart = [
  { idx: "001", inCart: true,  price: 100, src: i01 },
  { idx: "002", inCart: false, price: 250, src: i02 },
  { idx: "003", inCart: false, price: 500, src: i03 },
]
 
export default () => (
  <div className="demo-container">
    <h1>React-cartgallery Demo</h1>
    
    <CartgalleryProvider 
      cartGallerySettings={{ currency: "&#8352;" }}
      changeCartHandler={ newCart => console.log(newCart) }
    >
      { cart.map( (item, key) => (
        <CartgalleryItem key={key} group="cart" {...item}>
          <img src={ item.src } />
        </CartgalleryItem>
      )) }
    </CartgalleryProvider>
  </div>
);