JSPM

You are right again! The AlbumContent component also needs to be aware of the galleryPath so it can correctly construct links back to the main gallery.

Here's the updated README.md:

# React Gallery Albums 🖼️

A lightweight, modular React library for creating beautiful photo galleries organized into albums.

## ✨ Features

- **Album-based display** with customizable covers
- **Responsive layout** 
- **Zero dependencies** (besides React)
- **Fully typed** (TypeScript compatible)
- **Optimized performance** with React.memo

## 🚀 Installation

```bash
npm install react-gallery-albums
# or
yarn add react-gallery-albums

💡 Basic Usage

import { Gallery, AlbumContent } from 'react-gallery-albums';
import { BrowserRouter as Router, Route, Routes } from 'react-router-dom';

const albums = [
  {
    title: "Vacation",
    images: ["/img1.jpg", "/img2.jpg"]
  },
  {
    title: "Wedding", 
    images: ["/wedding1.jpg", "/img2.jpg"]
  }
];

function App() {
  return (
    <Router>
      <Routes>
        <Route path="/gallery" element={<Gallery albums={albums} galleryPath="/my-albums"/>} />
        <Route path="/gallery/:albumSlug" element={<AlbumContent albums={albums} galleryPath="/my-albums" />} />
      </Routes>
    </Router>
  );
}

⚙️ Props

Gallery Component

• albums: An array of album objects. Each album object should have a title and an images property (array of image URLs).
• galleryPath: (Optional) A string that defines the base path for the album links. Defaults to "/gallery". This allows customization of the URL structure for the gallery.

Example:

<Gallery albums={albums} galleryPath="/my-albums" />

If you use the above prop, this will generate links like /my-albums/vacation and /my-albums/wedding when you click on an album. The default is /gallery. The Route path should still be set to /gallery

AlbumContent Component

• albums: An array of album objects, same as the Gallery component. This is necessary for the component to find the correct album based on the URL.
• galleryPath: (Optional) A string that defines the base path for the album links. It should match the galleryPath prop used in the Gallery component. Defaults to "/gallery".