Elegant and fluid UI components for React applications.
npm install @martineho/ui
A responsive image gallery component that supports grid and list views.
To use the Image Gallery component, first import it into your React component:
import { ImageGallery } from "@martineho/ui";
Then, you can use the ImageGallery
component in your JSX:
function App() {
const images = [
{ src: "image1.jpg", alt: "Image 1", caption: "Image 1" },
{ src: "image2.jpg", alt: "Image 2", caption: "Image 2" },
// Add more images as needed, captions are optional
];
return (
<div>
<h1>My Image Gallery</h1>
<ImageGallery images={images} view="grid" />
</div>
);
}
export default App;
images
: An array of image objects, each containingsrc
andalt
properties.view
: A string that determines the layout of the gallery. Options are"grid"
or"list"
.