{"_id":"@akande/image-carousel","_rev":"1-99d2a429e3ce9830f3e96fa73c0b1f31","name":"@akande/image-carousel","dist-tags":{"latest":"0.0.2"},"versions":{"0.0.1":{"name":"@akande/image-carousel","version":"0.0.1","description":"A customizable image carousel module for web applications","main":"dist/main.js","scripts":{"test":"echo \"Error: no test specified\" && exit 1","build":"webpack --mode=production --node-env=production","build:dev":"webpack --mode=development","build:prod":"webpack --mode=production --node-env=production","watch":"webpack --watch","serve":"webpack serve"},"keywords":["image","carousel","slider","slideshow","gallery","JavaScript","web","frontend","UI","component","customizable","web development","image viewer","image navigation","image presentation"],"author":{"name":"Elliot Akande"},"license":"MIT","devDependencies":{"@webpack-cli/generators":"^3.0.7","css-loader":"^6.8.1","eslint":"^8.49.0","eslint-config-airbnb-base":"^15.0.0","eslint-config-prettier":"^9.0.0","eslint-plugin-import":"^2.28.1","prettier":"^3.0.3","style-loader":"^3.3.3","svg-inline-loader":"^0.8.2","webpack":"^5.88.2","webpack-cli":"^5.1.4","webpack-dev-server":"^4.15.1"},"dependencies":{"just-modulo":"^2.2.0","svg":"^0.1.0"},"repository":{"type":"git","url":"git+https://github.com/Elliot-Akande/image-carousel.git"},"bugs":{"url":"https://github.com/Elliot-Akande/image-carousel/issues"},"homepage":"https://github.com/Elliot-Akande/image-carousel#readme","gitHead":"c6292aa9f1c342eb34c037b3ea2844c3a56353f1","_id":"@akande/image-carousel@0.0.1","_nodeVersion":"18.16.1","_npmVersion":"9.5.1","dist":{"integrity":"sha512-c3xhHGUkdvFqCxQCC87axK7mO3O4UNmezx/fJWt32sLznyblA5ja3H+KXGK9TtoFKhmg7wH0YT0rO+pcVbVrgw==","shasum":"4d0579b32d0bf37b83ef70ef9a243a94fed9626c","tarball":"https://registry.npmjs.org/@akande/image-carousel/-/image-carousel-0.0.1.tgz","fileCount":11,"unpackedSize":21819,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDvyQR1A8QrZfOD3TP/IXIhohrTYjN5WmoGtGi0Ejci8gIhAL0BoJw11XDvLrDaqtzxuqZbANM7wov7mHEY8rsBDWbw"}]},"_npmUser":{"name":"akande","email":"elbo.lynch@gmail.com"},"directories":{},"maintainers":[{"name":"akande","email":"elbo.lynch@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/image-carousel_0.0.1_1694965548969_0.6169501056108659"},"_hasShrinkwrap":false},"0.0.2":{"name":"@akande/image-carousel","version":"0.0.2","description":"A customizable image carousel module for web applications","main":"dist/main.js","scripts":{"test":"echo \"Error: no test specified\" && exit 1","build":"webpack --mode=production --node-env=production","build:dev":"webpack --mode=development","build:prod":"webpack --mode=production --node-env=production","watch":"webpack --watch","serve":"webpack serve"},"keywords":["image","carousel","slider","slideshow","gallery","JavaScript","web","frontend","UI","component","customizable","web development","image viewer","image navigation","image presentation"],"author":{"name":"Elliot Akande"},"license":"MIT","devDependencies":{"@webpack-cli/generators":"^3.0.7","css-loader":"^6.8.1","eslint":"^8.49.0","eslint-config-airbnb-base":"^15.0.0","eslint-config-prettier":"^9.0.0","eslint-plugin-import":"^2.28.1","prettier":"^3.0.3","style-loader":"^3.3.3","svg-inline-loader":"^0.8.2","webpack":"^5.88.2","webpack-cli":"^5.1.4","webpack-dev-server":"^4.15.1"},"dependencies":{"just-modulo":"^2.2.0","svg":"^0.1.0"},"repository":{"type":"git","url":"git+https://github.com/Elliot-Akande/image-carousel.git"},"bugs":{"url":"https://github.com/Elliot-Akande/image-carousel/issues"},"homepage":"https://github.com/Elliot-Akande/image-carousel#readme","gitHead":"0a219ae5e9815ee94de5319ca347abbc70eae8a8","_id":"@akande/image-carousel@0.0.2","_nodeVersion":"18.16.1","_npmVersion":"9.5.1","dist":{"integrity":"sha512-xjr/yjQdqYoHHSyJKuBbNCDCr8oDZtIVBMsn3JCGq+aOLc9v5ngVwo9Ecsd8w/TUoZl7tWm+kTHXo31F1PDyZA==","shasum":"597f1a4fe45fb386ad11b7964e1ae9dcc23e2658","tarball":"https://registry.npmjs.org/@akande/image-carousel/-/image-carousel-0.0.2.tgz","fileCount":11,"unpackedSize":21988,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCA1KnkjSlq2Y6wDEyNKCqnr2qgYrEJsF56wTQJlJTzewIgH3jdlCnk0fsUv3ZYcEiLhVjEyvPYZJhGEpkRZ6JdniQ="}]},"_npmUser":{"name":"akande","email":"elbo.lynch@gmail.com"},"directories":{},"maintainers":[{"name":"akande","email":"elbo.lynch@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/image-carousel_0.0.2_1694969853644_0.061285055690940116"},"_hasShrinkwrap":false}},"time":{"created":"2023-09-17T15:45:48.830Z","0.0.1":"2023-09-17T15:45:49.141Z","modified":"2023-09-17T16:57:34.031Z","0.0.2":"2023-09-17T16:57:33.844Z"},"maintainers":[{"name":"akande","email":"elbo.lynch@gmail.com"}],"description":"A customizable image carousel module for web applications","homepage":"https://github.com/Elliot-Akande/image-carousel#readme","keywords":["image","carousel","slider","slideshow","gallery","JavaScript","web","frontend","UI","component","customizable","web development","image viewer","image navigation","image presentation"],"repository":{"type":"git","url":"git+https://github.com/Elliot-Akande/image-carousel.git"},"author":{"name":"Elliot Akande"},"bugs":{"url":"https://github.com/Elliot-Akande/image-carousel/issues"},"license":"MIT","readme":"# @akande/image-carousel\n\n`@akande/image-carousel` is a lightweight JavaScript module that allows you to easily create customizable image carousels. It provides a lightweight and flexible solution for showcasing images in a visually appealing and interactive way.\n\nTo see the module in action, [click here](https://elliot-akande.github.io/image-carousel-example/) [[GitHub](https://github.com/Elliot-Akande/image-carousel-example)].\n\n## Features\n\n- **Customizable Images:** Create image carousels with your own set of images.\n- **Automatic Slideshow:** The carousel automatically transitions between images at regular intervals.\n- **Navigation Controls:** Users can navigate through images using previous and next buttons.\n- **Indicator Dots:** Optional indicator dots allow users to jump to specific images.\n- **Custom Styling:** Minimal default styling is provided, allowing you to customize the carousel's appearance to match your project's design.\n\n## Installation\n\nYou can install the `@akande/image-carousel` module via npm or yarn:\n\n```bash\nnpm install @akande/image-carousel\n# OR\nyarn add @akande/image-carousel\n```\n\n## Usage\n\nHere's an example of how to use the `@akande/image-carousel` module in your JavaScript code:\n\n```javascript\nimport ImageCarousel from \"@akande/image-carousel\";\n\n// Create an array of image URLs/File Paths\nconst images = [\n  \"image1.jpg\",\n  \"image2.jpg\",\n  \"image3.jpg\",\n  // Add more image URLs as needed\n];\n\nconst customClass = \"my-carousel\"; // Optional custom CSS class\n\n// Create an instance of the ImageCarousel component\nconst carousel = ImageCarousel(images, customClass);\n\n// Append the carousel to a DOM element\ndocument.querySelector(\"#carousel-container\").appendChild(carousel);\n```\n\n## API Reference\n\n### `ImageCarousel(images, customClass)`\n\nCreates an instance of the ImageCarousel component.\n\n- `images` (Array of Strings): An array of image URLs to display in the carousel.\n- `customClass` (String, optional): An optional custom CSS class to apply to the carousel container.\n\n**Returns:** A DOM element representing the image carousel.\n\n## License\n\nThis project is licensed under the MIT License. See the [LICENSE](https://github.com/Elliot-Akande/image-carousel/blob/main/LICENSE) file for details.\n\n## Issues\n\nIf you encounter any issues or have questions about this module, please [open an issue](https://github.com/Elliot-Akande/image-carousel/issues) on GitHub.\n\n## Author\n\n- Elliot Akande\n- Email: [elbo.lynch@gmail.com](elbo.lynch@gmail.com)\n- GitHub: [https://github.com/Elliot-Akande](https://github.com/Elliot-Akande)\n\n## Keywords\n\n- image\n- carousel\n- slider\n- slideshow\n- gallery\n- JavaScript\n- web\n- frontend\n- UI\n- component\n- responsive\n- touch-friendly\n- customization\n- web development\n- image viewer\n- image navigation\n- image presentation\n","readmeFilename":"README.md"}