react-image-grid-gallery
Advanced tools
Comparing version
import React from "react"; | ||
import "./ImageGallery.css"; | ||
interface ImgArrayType { | ||
interface ImageGalleryPropsType { | ||
imgArray: Array<{ | ||
@@ -9,4 +9,6 @@ alt: string; | ||
}>; | ||
columnWidth?: number; | ||
gapSize?: number; | ||
} | ||
export default function ImageGallery({ imgArray }: ImgArrayType): React.JSX.Element; | ||
export default function ImageGallery({ imgArray, columnWidth, gapSize, }: ImageGalleryPropsType): React.JSX.Element; | ||
export {}; |
@@ -16,3 +16,5 @@ "use strict"; | ||
let { | ||
imgArray | ||
imgArray, | ||
columnWidth = 230, | ||
gapSize = 24 | ||
} = _ref; | ||
@@ -25,2 +27,5 @@ const [lightboxController, setLightboxController] = (0, _react.useState)({ | ||
className: "codesweetly-rigg-image-figure", | ||
style: { | ||
marginBottom: `${gapSize}px` | ||
}, | ||
key: (0, _uniqid.default)() | ||
@@ -39,3 +44,7 @@ }, /*#__PURE__*/_react.default.createElement("img", { | ||
return /*#__PURE__*/_react.default.createElement("div", { | ||
className: "codesweetly-rigg-imgs-container" | ||
className: "codesweetly-rigg-imgs-container", | ||
style: { | ||
columnWidth: `${columnWidth}px`, | ||
columnGap: `${gapSize}px` | ||
} | ||
}, imgElementArray, /*#__PURE__*/_react.default.createElement(_fslightboxReact.default, { | ||
@@ -42,0 +51,0 @@ toggler: lightboxController.toggler, |
{ | ||
"name": "react-image-grid-gallery", | ||
"version": "0.7.0", | ||
"version": "0.8.0", | ||
"description": "A simple image gallery component for displaying a grid of images in React apps", | ||
"main": "ImageGallery.js", | ||
"types": "ImageGallery.d.ts", | ||
"homepage": "https://codesweetly.com/react-image-grid-gallery", | ||
"homepage": "https://github.com/codesweetly/react-image-grid-gallery.git#readme", | ||
"author": "Oluwatobi Sofela <contact@codesweetly.com> (https://www.codesweetly.com)", | ||
@@ -9,0 +9,0 @@ "license": "MIT", |
Sorry, the diff of this file is not supported yet
7938
6.58%95
30.14%