{"_id":"3d-model-gallery","_rev":"5-7e1b1b3072dbe64f5d3a9cef73684fc3","name":"3d-model-gallery","dist-tags":{"latest":"0.1.4"},"versions":{"0.1.0":{"name":"3d-model-gallery","version":"0.1.0","keywords":["3d","3d-model","model","gallery","carousel","three","threejs","model-viewer","react","nextjs","vue","angular","react-three-fiber","drei","webgl","gltf","glb"],"author":"","license":"MIT","_id":"3d-model-gallery@0.1.0","maintainers":[{"name":"ashikjs","email":"mostofabilla@gmail.com"}],"homepage":"https://github.com/ashikjs/3d-model-gallery#readme","bugs":{"url":"https://github.com/ashikjs/3d-model-gallery/issues"},"dist":{"shasum":"de7ad9b064edcc5e8c36f83d572f35a026408041","tarball":"https://registry.npmjs.org/3d-model-gallery/-/3d-model-gallery-0.1.0.tgz","fileCount":9,"integrity":"sha512-+d5NrwILtk1YyiQ72V5hRwhRe+CFW4abNrhS59BPj01bYgB5kO+hbf3jo6czD9dqSnzm4uz1feKXG8KuJlI6nA==","signatures":[{"sig":"MEUCIAC7iIad/U/3H5/q/C9ZMiI10SpiIGxSrcSEJiIjMhecAiEAu20F8D8LYE+UodxbFXGXLxvs/doRPVaAUYliPJwB7DU=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":81062},"main":"dist/index.js","types":"dist/index.d.ts","module":"dist/index.mjs","gitHead":"e021b84da948c3cc6fe3d9a7913d5ae815afed1d","scripts":{"dev":"tsup --watch","lint":"eslint src","build":"tsup && node scripts/add-use-client.mjs","prepublishOnly":"npm run build"},"_npmUser":{"name":"ashikjs","email":"mostofabilla@gmail.com"},"repository":{"url":"git+https://github.com/ashikjs/3d-model-gallery.git","type":"git"},"_npmVersion":"10.9.2","description":"Interactive 3D model gallery with Three.js - Display and navigate 3D models with smooth carousel navigation. Works with React, Next.js, and other frameworks.","directories":{},"_nodeVersion":"23.11.1","_hasShrinkwrap":false,"devDependencies":{"tsup":"^8.0.0","react":"^18.3.1","three":"^0.181.2","react-dom":"^18.3.1","typescript":"^5.0.0","@types/react":"^18.0.0","@types/three":"^0.160.0","@types/react-dom":"^18.0.0","@react-three/drei":"^10.7.7","@react-three/fiber":"^9.4.0"},"peerDependencies":{"react":">=18","three":">=0.160.0","react-dom":">=18","@react-three/drei":">=10.0.0","@react-three/fiber":">=9.0.0"},"_npmOperationalInternal":{"tmp":"tmp/3d-model-gallery_0.1.0_1764335039006_0.728764208486747","host":"s3://npm-registry-packages-npm-production"}},"0.1.1":{"name":"3d-model-gallery","version":"0.1.1","keywords":["3d","3d-model","model","gallery","carousel","three","threejs","model-viewer","react","nextjs","vue","angular","react-three-fiber","drei","webgl","gltf","glb"],"author":"","license":"MIT","_id":"3d-model-gallery@0.1.1","maintainers":[{"name":"ashikjs","email":"mostofabilla@gmail.com"}],"homepage":"https://3d-carousel.mdashikjs.com/","bugs":{"url":"https://github.com/ashikjs/3d-model-gallery/issues"},"dist":{"shasum":"f91b4c3a940ace3bece9d8d9931cf01dbde3d171","tarball":"https://registry.npmjs.org/3d-model-gallery/-/3d-model-gallery-0.1.1.tgz","fileCount":9,"integrity":"sha512-69c7VYnktRMeyhqGu+0uaASa6GTBUYgaJeVaU8dXtke9+sh4INscaB95k2Vhi8bjKrKr3ZsOAYiaG8RckpudDQ==","signatures":[{"sig":"MEUCIQCsozs6gn8W2UD2m4XAs85tiSpxSlWy3k0G7UFKD+ePigIgQGyw3wU5mnDN8tIW5z9A/JJyz4cLxSY+IBYSXNxZu6o=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":81082},"main":"dist/index.js","types":"dist/index.d.ts","module":"dist/index.mjs","gitHead":"e3d127cb197970e94bb95c2a68a1ae4496de9dc6","scripts":{"dev":"tsup --watch","lint":"eslint src","build":"tsup","prepublishOnly":"npm run build"},"_npmUser":{"name":"ashikjs","email":"mostofabilla@gmail.com"},"repository":{"url":"git+https://github.com/ashikjs/3d-model-gallery.git","type":"git"},"_npmVersion":"10.8.1","description":"Interactive 3D model gallery with Three.js - Display and navigate 3D models with smooth carousel navigation. Works with React, Next.js, and other frameworks.","directories":{},"_nodeVersion":"20.16.0","_hasShrinkwrap":false,"devDependencies":{"tsup":"^8.0.0","react":"^18.3.1","three":"^0.181.2","react-dom":"^18.3.1","typescript":"^5.0.0","@types/react":"^18.0.0","@types/three":"^0.160.0","@types/react-dom":"^18.0.0","@react-three/drei":"^10.7.7","@react-three/fiber":"^9.4.0"},"peerDependencies":{"react":">=18","three":">=0.160.0","react-dom":">=18","@react-three/drei":">=10.0.0","@react-three/fiber":">=9.0.0"},"_npmOperationalInternal":{"tmp":"tmp/3d-model-gallery_0.1.1_1764514055136_0.4060382772772113","host":"s3://npm-registry-packages-npm-production"}},"0.1.2":{"name":"3d-model-gallery","version":"0.1.2","keywords":["3d-model-gallery","react-3d-carousel","3d","3d-model","3d-gallery","3d-viewer","model","gallery","carousel","three","threejs","three.js","model-viewer","model-gallery","product-viewer","3d-product","react","react-component","nextjs","next.js","vue","angular","react-three-fiber","r3f","drei","webgl","gltf","glb","obj","fbx","3d-carousel","interactive-3d","3d-showcase"],"author":"","license":"MIT","_id":"3d-model-gallery@0.1.2","maintainers":[{"name":"ashikjs","email":"mostofabilla@gmail.com"}],"homepage":"https://3d-carousel.mdashikjs.com/","bugs":{"url":"https://github.com/ashikjs/3d-model-gallery/issues"},"dist":{"shasum":"d3cc1cdaf5ddab2335211b7335b8b20ac72de173","tarball":"https://registry.npmjs.org/3d-model-gallery/-/3d-model-gallery-0.1.2.tgz","fileCount":9,"integrity":"sha512-jpjZeZf9PdBqiA4aknN/I7NelmLHiwHNNaQwACasrskEUTAgkn00MEWrbllfqgfdWNHF+e7qPmTTbaQ1Rfvc9w==","signatures":[{"sig":"MEYCIQDAYmxE8+duwStcUAzxv0/eE6aSShKpY5FBzUW1EMKbEAIhAMPLCqIl+EXofl7/0Qcq3MpJSTG4q5lHZzAQx+ZgKyjq","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":81510},"main":"dist/index.js","types":"dist/index.d.ts","module":"dist/index.mjs","gitHead":"e3d127cb197970e94bb95c2a68a1ae4496de9dc6","scripts":{"dev":"tsup --watch","lint":"eslint src","build":"tsup","publish:npm":"npm run build && npm publish","prepublishOnly":"npm run build"},"_npmUser":{"name":"ashikjs","email":"mostofabilla@gmail.com"},"repository":{"url":"git+https://github.com/ashikjs/3d-model-gallery.git","type":"git"},"_npmVersion":"10.8.1","description":"Interactive 3D model gallery with Three.js - Display and navigate 3D models with smooth carousel navigation. Works with React, Next.js, and other frameworks.","directories":{},"_nodeVersion":"20.16.0","_hasShrinkwrap":false,"devDependencies":{"tsup":"^8.0.0","react":"^18.3.1","three":"^0.181.2","react-dom":"^18.3.1","typescript":"^5.0.0","@types/react":"^18.0.0","@types/three":"^0.160.0","@types/react-dom":"^18.0.0","@react-three/drei":"^10.7.7","@react-three/fiber":"^9.4.0"},"peerDependencies":{"react":">=18","three":">=0.160.0","react-dom":">=18","@react-three/drei":">=10.0.0","@react-three/fiber":">=9.0.0"},"_npmOperationalInternal":{"tmp":"tmp/3d-model-gallery_0.1.2_1764514295373_0.41301223320304103","host":"s3://npm-registry-packages-npm-production"}},"0.1.3":{"name":"3d-model-gallery","version":"0.1.3","keywords":["3d-model-gallery","react-3d-carousel","3d","3d-model","3d-gallery","3d-viewer","model","gallery","carousel","three","threejs","three.js","model-viewer","model-gallery","product-viewer","3d-product","react","react-component","nextjs","next.js","vue","angular","react-three-fiber","r3f","drei","webgl","gltf","glb","obj","fbx","3d-carousel","interactive-3d","3d-showcase"],"author":"","license":"MIT","_id":"3d-model-gallery@0.1.3","maintainers":[{"name":"ashikjs","email":"mostofabilla@gmail.com"}],"homepage":"https://3d-carousel.mdashikjs.com/","bugs":{"url":"https://github.com/ashikjs/3d-model-gallery/issues"},"dist":{"shasum":"303931a173136ef865b7baf6bcc3016802017219","tarball":"https://registry.npmjs.org/3d-model-gallery/-/3d-model-gallery-0.1.3.tgz","fileCount":9,"integrity":"sha512-RiY69RQ0I7mWTAmX4osUIp/fODmE3f6/yES5BQBNEulmDFPKKu8QJ2WDV+J4ltvwnqDV7ywg16DQI/VWaK6FrQ==","signatures":[{"sig":"MEQCIFBH6Y+XxeyeAmm5XPfmVYTVvklaL/pG+SAH8q9bt4vgAiBQEt2ji7zorSr+51pt6QQ9MSxo4KD33GGmz89xkXHKWQ==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":81512},"main":"dist/index.js","types":"dist/index.d.ts","module":"dist/index.mjs","gitHead":"71415802c43dcfd0c6782bd0c28c38ead9e712cd","scripts":{"dev":"tsup --watch","lint":"eslint src","build":"tsup","publish:npm":"npm run build && npm publish","prepublishOnly":"npm run build"},"_npmUser":{"name":"ashikjs","email":"mostofabilla@gmail.com"},"repository":{"url":"git+https://github.com/ashikjs/3d-model-gallery.git","type":"git"},"_npmVersion":"10.8.1","description":"Interactive 3D model gallery with Three.js - Display and navigate 3D models with smooth carousel navigation. Works with React, Next.js, and other frameworks.","directories":{},"_nodeVersion":"20.16.0","_hasShrinkwrap":false,"devDependencies":{"tsup":"^8.0.0","react":"^18.3.1","three":"^0.181.2","react-dom":"^18.3.1","typescript":"^5.0.0","@types/react":"^18.0.0","@types/three":"^0.160.0","@types/react-dom":"^18.0.0","@react-three/drei":"^10.7.7","@react-three/fiber":"^9.4.0"},"peerDependencies":{"react":">=18","three":">=0.160.0","react-dom":">=18","@react-three/drei":">=10.0.0","@react-three/fiber":">=9.0.0"},"_npmOperationalInternal":{"tmp":"tmp/3d-model-gallery_0.1.3_1764514525562_0.8950310246096673","host":"s3://npm-registry-packages-npm-production"}},"0.1.4":{"name":"3d-model-gallery","version":"0.1.4","description":"Interactive 3D model gallery with Three.js - Display and navigate 3D models with smooth carousel navigation. Works with React, Next.js, and other frameworks.","homepage":"https://3d-carousel.mdashikjs.com/","main":"dist/index.js","module":"dist/index.mjs","types":"dist/index.d.ts","scripts":{"build":"tsup","dev":"tsup --watch","lint":"eslint src","prepublishOnly":"npm run build","publish:npm":"npm run build && npm publish"},"keywords":["3d-model-gallery","react-3d-carousel","3d","3d-model","3d-gallery","3d-viewer","model","gallery","carousel","three","threejs","three.js","model-viewer","model-gallery","product-viewer","3d-product","react","react-component","nextjs","next.js","vue","angular","react-three-fiber","r3f","drei","webgl","gltf","glb","obj","fbx","3d-carousel","interactive-3d","3d-showcase"],"author":"","license":"MIT","repository":{"type":"git","url":"git+https://github.com/ashikjs/3d-model-gallery.git"},"peerDependencies":{"react":">=18","react-dom":">=18","three":">=0.160.0","@react-three/fiber":">=9.0.0","@react-three/drei":">=10.0.0"},"devDependencies":{"tsup":"^8.0.0","typescript":"^5.0.0","@types/react":"^18.0.0","@types/react-dom":"^18.0.0","@types/three":"^0.160.0","react":"^18.3.1","react-dom":"^18.3.1","three":"^0.181.2","@react-three/fiber":"^9.4.0","@react-three/drei":"^10.7.7"},"_id":"3d-model-gallery@0.1.4","gitHead":"ae118bfe986f9477ebe8c1ba28114a044a317ec2","bugs":{"url":"https://github.com/ashikjs/3d-model-gallery/issues"},"_nodeVersion":"20.16.0","_npmVersion":"10.8.1","dist":{"integrity":"sha512-+MY8idzODKwk3VdbejQ9o4BPHyiIFDzu6tfMgYuFNRrDI2bLI6PNZlTGcp5TE8+LHuEddGr2cL3KDfNVXCbHUg==","shasum":"e85535e8fc01b29122666757ec853d75b01c1578","tarball":"https://registry.npmjs.org/3d-model-gallery/-/3d-model-gallery-0.1.4.tgz","fileCount":9,"unpackedSize":81553,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEQCIGgl+g0cKiB8XPiQHykfKmuc4JNx7q64e8gy0I++EwqJAiA2cWe/x7RXEqYMWRXuLW5WCyaVLvXhppH6LoON/xdUOA=="}]},"_npmUser":{"name":"ashikjs","email":"mostofabilla@gmail.com"},"directories":{},"maintainers":[{"name":"ashikjs","email":"mostofabilla@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/3d-model-gallery_0.1.4_1764515334668_0.05444579741647848"},"_hasShrinkwrap":false}},"time":{"created":"2025-11-28T13:03:59.004Z","modified":"2025-11-30T15:08:55.081Z","0.1.0":"2025-11-28T13:03:59.203Z","0.1.1":"2025-11-30T14:47:35.331Z","0.1.2":"2025-11-30T14:51:35.581Z","0.1.3":"2025-11-30T14:55:25.748Z","0.1.4":"2025-11-30T15:08:54.869Z"},"bugs":{"url":"https://github.com/ashikjs/3d-model-gallery/issues"},"license":"MIT","homepage":"https://3d-carousel.mdashikjs.com/","keywords":["3d-model-gallery","react-3d-carousel","3d","3d-model","3d-gallery","3d-viewer","model","gallery","carousel","three","threejs","three.js","model-viewer","model-gallery","product-viewer","3d-product","react","react-component","nextjs","next.js","vue","angular","react-three-fiber","r3f","drei","webgl","gltf","glb","obj","fbx","3d-carousel","interactive-3d","3d-showcase"],"repository":{"type":"git","url":"git+https://github.com/ashikjs/3d-model-gallery.git"},"description":"Interactive 3D model gallery with Three.js - Display and navigate 3D models with smooth carousel navigation. Works with React, Next.js, and other frameworks.","maintainers":[{"name":"ashikjs","email":"mostofabilla@gmail.com"}],"readme":"# 3D Model Gallery\r\n\r\n[![npm version](https://img.shields.io/npm/v/3d-model-gallery.svg)](https://www.npmjs.com/package/3d-model-gallery)\r\n[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)\r\n\r\nInteractive 3D model gallery for React with Three.js. Display and navigate 3D models with smooth carousel navigation.\r\n\r\n## ✨ Features\r\n\r\n- 🎨 Interactive 3D model viewing\r\n- 🔄 Smooth carousel navigation\r\n- ⌨️ Keyboard navigation support\r\n- 📱 Responsive design\r\n- 🎯 Configurable height and scroll speed\r\n- 🖼️ Support for GLB, GLTF formats\r\n- ⚡ Built with React Three Fiber\r\n\r\n## 📦 Installation\r\n\r\n```bash\r\nnpm install 3d-model-gallery\r\n```\r\n\r\n**Peer Dependencies:**\r\n```bash\r\nnpm install react react-dom three @react-three/fiber @react-three/drei\r\n```\r\n\r\n## 🚀 Usage\r\n\r\n```tsx\r\nimport { GalleryCarousel, ModelData } from '3d-model-gallery';\r\n\r\nconst models: ModelData[] = [\r\n  {\r\n    id: 1,\r\n    name: 'My 3D Model',\r\n    description: 'An awesome 3D model',\r\n    instruction: 'Scroll to rotate',\r\n    modelUrl: 'https://models.readyplayer.me/64bfa15f0e72c63d7c3934a6.glb',\r\n    height: '80vh'\r\n  }\r\n];\r\n\r\nfunction App() {\r\n  return (\r\n    <GalleryCarousel \r\n      models={models} \r\n      showNavigation={true}\r\n      showArrows={true}\r\n      showDots={true}\r\n      height=\"80vh\"\r\n      scrollMultiplier={4}\r\n    />\r\n  );\r\n}\r\n```\r\n\r\n## 📖 Props\r\n\r\n| Prop | Type | Default | Description |\r\n|------|------|---------|-------------|\r\n| `models` | `ModelData[]` | required | Array of 3D models to display |\r\n| `showNavigation` | `boolean` | `false` | Enable navigation controls |\r\n| `showArrows` | `boolean` | `false` | Show left/right arrows |\r\n| `showDots` | `boolean` | `false` | Show dot indicators |\r\n| `height` | `string` | `'80vh'` | Carousel height |\r\n| `scrollMultiplier` | `number` | `4` | Rotation speed |\r\n| `isLoading` | `boolean` | `false` | Show loading state |\r\n| `error` | `string \\| null` | `null` | Error message |\r\n\r\n## 🤝 Contributing\r\n\r\nWe welcome contributions! See [CONTRIBUTING.md](./CONTRIBUTING.md) for guidelines.\r\n\r\n## 📄 License\r\n\r\nMIT © [Contributors](./LICENSE)\r\n\r\n## 🌟 Show Your Support\r\n\r\nGive a ⭐️ if this project helped you!\r\n","readmeFilename":"README.md"}