{"_id":"@devstarter/imagebox","name":"@devstarter/imagebox","dist-tags":{"latest":"0.0.1"},"versions":{"0.0.1":{"name":"@devstarter/imagebox","version":"0.0.1","description":"A modern lightbox gallery with plugin architecture and lazy-loading modules.","main":"dist/imagebox.min.js","scripts":{"build:css":"node scripts/build-css.js","build:js":"node scripts/build-js.js","build:scss":"node scripts/copy-scss.js","build":"npm run build:css && npm run build:js && npm run build:scss","prepublishOnly":"npm run build"},"keywords":["lightbox","gallery","imagebox","plugin","modular","lazyload"],"author":{"name":"DevStarter"},"license":"MIT","publishConfig":{"access":"public"},"devDependencies":{"esbuild":"^0.25.2","sass":"^1.86.3"},"_id":"@devstarter/imagebox@0.0.1","gitHead":"f8fc63827f2094d8c0bce30b88f386663b5e8d6b","_nodeVersion":"18.17.1","_npmVersion":"10.2.1","dist":{"integrity":"sha512-WoXU+zmaUk8b/8mJG5ABzyk8AH5w/GsUyXMe3URyPpy6tF9bIH8tPD4fR0a6O5Mh3df/GFtnP63a1k4m+2wPjA==","shasum":"6db680b86ec7402242a1dc80ded980d80a671265","tarball":"https://registry.npmjs.org/@devstarter/imagebox/-/imagebox-0.0.1.tgz","fileCount":26,"unpackedSize":2908246,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCIQDxf/Um5Jq+TEHVISi2m6Xndo5Tsh312+xd7lyIvckrrQIgG6MZCjWu0NDJPjPvPE94jfQXSs2GXYCAh8JCwxLoU28="}]},"_npmUser":{"name":"voznenko","email":"alexey@voznenko.com"},"directories":{},"maintainers":[{"name":"voznenko","email":"alexey@voznenko.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/imagebox_0.0.1_1744907826703_0.9395295115353932"},"_hasShrinkwrap":false}},"time":{"created":"2025-04-17T16:37:06.623Z","0.0.1":"2025-04-17T16:37:06.963Z","modified":"2025-04-17T16:37:07.281Z"},"maintainers":[{"name":"voznenko","email":"alexey@voznenko.com"}],"description":"A modern lightbox gallery with plugin architecture and lazy-loading modules.","keywords":["lightbox","gallery","imagebox","plugin","modular","lazyload"],"author":{"name":"DevStarter"},"license":"MIT","readme":"# 📦 ImageBox\n\n**ImageBox** — современный, гибкий и лёгкий аналог [Lightbox2](https://lokeshdhakar.com/projects/lightbox2/), который автоматически инициализирует модальные галереи из изображений с нужными `data-*` атрибутами. Поддерживает разные типы контента, плагинную архитектуру и ленивую загрузку модулей.\n\n---\n\n## ✨ Особенности\n\n- ✅ Автоматическая генерация галерей — без ручной разметки контейнера\n- 🖼 Поддержка изображений, YouTube/Vimeo и HTML5-видео\n- 🔌 Плагинная архитектура — легко расширяется (zoom, carousel, fullscreen и др.)\n- 🛌 Ленивая загрузка модулей — по data-type\n- 📚 Несколько независимых галерей на странице\n- 🌟 Навигация клавишами и свайпами\n- 🎨 Подписи, миниатюры, fullscreen и zoom\n\n## 📦 Установка\n\nВы можете установить пакет удобным для вас способом: через npm, Bower или подключить напрямую через CDN.\n\n### 📦 Установка через NPM\n\n```bash\nnpm install @devstarter/imagebox\n```\n\n> Используйте, если вы подключаете скрипты и стили через сборщики (например, Webpack, Vite, Parcel).\n\n### 📦 Установка через Bower\n\n```bash\nbower install DevStarter-Technology/imagebox --save\n```\n\n> Подходит для проектов, где используется Bower в качестве менеджера зависимостей.\n\n### 🌐 Подключение через CDN\n\nЕсли вы не используете сборщики, просто вставьте эти строки в ваш HTML:\n\n#### jsDelivr\n\n```html\n<link rel=\"stylesheet\" href=\"https://cdn.jsdelivr.net/npm/@devstarter/imagebox@latest/dist/css/imagebox.min.css\">\n<script type=\"text/javascript\" src=\"https://cdn.jsdelivr.net/npm/@devstarter/imagebox@latest/dist/js/imagebox.min.js\"></script>\n```\n\n#### unpkg\n\n```html\n<link rel=\"stylesheet\" href=\"https://unpkg.com/@devstarter/imagebox@latest/dist/css/imagebox.min.css\">\n<script type=\"text/javascript\" src=\"https://unpkg.com/@devstarter/imagebox@latest/dist/js/imagebox.min.js\"></script>\n```\n\n## 🛠 Использование\n\n```html\n<h1>ImageBox</h1>\n\n<h2>Gallery #1</h2>\n<img class=\"imagebox-thumbnail\" src=\"img/thumb/img1.png\" data-full=\"img/fullsize/img1.png\" data-type=\"image\" data-caption=\"Image description\" data-gallery=\"gallery1\">\n<img class=\"imagebox-thumbnail\" src=\"img/thumb/img2.png\" data-full=\"img/fullsize/img2.png\" data-type=\"image\" data-caption=\"Image description 2\" data-gallery=\"gallery1\">\n<img class=\"imagebox-thumbnail\" src=\"img/thumb/img3.png\" data-full=\"img/fullsize/img3.png\" data-type=\"image\" data-caption=\"Image description 3\" data-gallery=\"gallery1\">\n\n<h2>Gallery #2</h2>\n<img class=\"imagebox-thumbnail\" src=\"img/thumb/img4.png\" data-full=\"img/fullsize/img4.png\" data-caption=\"First\" data-gallery=\"gallery2\">\n<img class=\"imagebox-thumbnail\" src=\"img/thumb/img5.png\" data-full=\"img/fullsize/img5.png\" data-caption=\"Second\" data-gallery=\"gallery2\">\n<img class=\"imagebox-thumbnail\" src=\"img/thumb/img6.png\" data-full=\"img/fullsize/img6.png\" data-caption=\"Another\" data-gallery=\"gallery2\">\n\n<link rel=\"stylesheet\" href=\"../dist/css/imagebox.min.css\">\n<script type=\"text/javascript\" src=\"../dist/js/imagebox.min.js\"></script>\n<script type=\"text/javascript\">\n  ImageBox.init({ gallery: 'gallery1' });\n  ImageBox.init({ gallery: 'gallery2' });\n</script>\n```\n\n## 🪨 data-\\* атрибуты\n-------------------\n| Атрибут | Описание |\n| ------------ | ------------ |\n| data-full | Ссылка на оригинальное изображение |\n| data-type | Тип контента: image, video, youtube, vimeo |\n| data-caption | Текст подписи |\n| data-gallery | Имя галереи (для группировки) |\n| data-thumb | Миниатюра для карусели (optional) |\n\n\n## 🧰 Плагины\n\n*   🔍 Zoom\n*   🌍 Fullscreen\n*   🔁 Carousel\n*   🎬 YouTube / Vimeo / HTML5 video\n\n## 🚩 Что дальше?\n\n*   🧴 Pinch-to-zoom для тач-устройств\n*   🎥 Анимации переходов\n*   📂 Chunk loading\n\n## 💬 Обратная связь\n\nЕсли у вас есть предложения, замечания или баг-репорты — создайте issue или pull request в [репозитории на GitHub](https://github.com/DevStarter-Technology/imagebox).\n\n## 🔐 Pro Features\n\nThis package follows an **open-core licensing model**:\n\n- Core features — [MIT License](./LICENSE)\n- Optional Pro Features — require a [commercial license](./COMMERCIAL_LICENSE.md)\n\nTo learn more about available Pro Features and licensing, [contact us](mailto:support@devstarter.technology).","readmeFilename":"README.md","_rev":"1-37ae6d284f70601b6c80cc607ba8614a"}