@drawbotics/gallery

Gallery

A simple gallery component that uses react-slick under the hood. It provides styling for dots and arrows that can be toggled on or off.

Installation

Install it as usual with npm:

$ npm i @drawbotics/gallery

Usage

The component takes the following props:

• images: an array of image urls
• cover (default false): a boolean to set the background position of images to fill the gallery container
• minimal (default false): a boolean to toggle the navigation

The component will take up the whole space of the parent, so you need to create a container to define its height and width.

If you need to customize the behaviour you can use the props from the react-slick doc.

Here is an example usage:

import React from 'react';
import Gallery from '@drawbotics/gallery';


class MyPage extends React.Component {
  render() {
    return (
      <div classnames="Container">
        <Gallery images={myArrayOfUrls} />
      </div>
    );
  }
}


export default MyPage;