React Images Extended

Compared to the legacy package, this fork is powered by:

• ✨ The latest version of React
• 📝 No JavaScript, all TypeScript
• 🎨 Easy styling with Tailwind CSS
• 📦 Better package management with PNPM
• 🖼️ Modern Display-PiP compatibility

📸 Demo

Core Functionality

Picture-in-Picture Behavior

🔗 Useful Links (Work in progress)

Resource	Description
📦 NPM Package	Install and view package details
🧪 Test Locally	How to test and run locally
🤝 Contributing	How to contribute
📚 Basic Usage	Understanding the demo and basic usage

🚀 Quick Start

npm install react-images-extended-2

import { Lightbox, IImage } from 'react-images-extended-2';
import 'react-images-extended-2/dist/styles.css';

const images: IImage[] = [
  { src: 'image1.jpg', caption: 'Image 1' },
  { src: 'image2.jpg', caption: 'Image 2' },
];

function App() {
  return (
    <Lightbox
      images={images}
      onClose={() => setIsOpen(false)}
      showThumbnails={true}
    />
  );
}

✨ Features

🖼️ Image Management

• Zoom, rotate, and drag functionality
• Thumbnail navigation
• Keyboard shortcuts
• Touch/gesture support

🎯 Modern Features

• Picture-in-Picture mode
• Full TypeScript support
• Tailwind CSS styling
• Responsive design

---

Made with ❤️ by Isla