{"_id":"@avent-ui/page-transition","_rev":"4-db4ec68cac4a9752e76c22ee06729994","name":"@avent-ui/page-transition","dist-tags":{"latest":"1.0.8"},"versions":{"1.0.5":{"name":"@avent-ui/page-transition","version":"1.0.5","keywords":["avent-ui","avent","page-transition","react-router-dom"],"author":{"name":"Aathi Eswar S"},"license":"MIT","_id":"@avent-ui/page-transition@1.0.5","maintainers":[{"name":"aathieswar","email":"aathi28082003@gmail.com"}],"homepage":"https://github.com/AathiEswar/avent-ui/blob/main/src/components/Magneto/README.md","bugs":{"url":"https://github.com/AathiEswar/avent-ui/issues"},"dist":{"shasum":"fad45781a1c7dfc4b2354a10ac9db8d65b690ac3","tarball":"https://registry.npmjs.org/@avent-ui/page-transition/-/page-transition-1.0.5.tgz","fileCount":17,"integrity":"sha512-Fw2Fv1BbMrcwsA0kaBWNxvu2XTzjFBBl0ha/K1wdzeba31wKS0MNVsxQG7h+uA3HLagsQMls5ANnhjpnFcGPTQ==","signatures":[{"sig":"MEUCIQDDUfP4ZpV7TtQ8eR0ChYOKG2JpWUBisSaCDjKv9gBqbAIgKs560rTqjRfp+ppnQPdGaU9rR/c1ZVVgC453HKgsCKk=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":2481957},"main":"dist/index.js","type":"module","types":"dist/index.d.ts","module":"dist/index.esm.js","gitHead":"09f802b833ed08a8e20a78b81fcf0735f4e2c122","scripts":{"test":"echo \"Error: no test specified\" && exit 1","build":"rollup -c","prepare":"npm run build"},"_npmUser":{"name":"aathieswar","email":"aathi28082003@gmail.com"},"repository":{"url":"git+https://github.com/AathiEswar/avent-ui.git#main","type":"git"},"_npmVersion":"9.8.1","description":"Page Transition with React Router Dom","directories":{},"_nodeVersion":"21.7.1","dependencies":{"react":"^18.3.1","react-dom":"^18.3.1"},"_hasShrinkwrap":false,"devDependencies":{"rollup":"^4.27.2","postcss":"^8.4.49","typescript":"^5.6.3","postcss-cli":"^11.0.0","tailwindcss":"^3.4.15","@types/react":"^18.3.12","autoprefixer":"^10.4.20","@types/react-dom":"^18.3.1","@rollup/plugin-babel":"^6.0.4","rollup-plugin-postcss":"^4.0.2","@rollup/plugin-commonjs":"^28.0.1","rollup-plugin-typescript2":"^0.36.0","rollup-plugin-node-resolve":"^5.2.0","@rollup/plugin-node-resolve":"^15.3.0","rollup-plugin-peer-deps-external":"^2.2.4"},"_npmOperationalInternal":{"tmp":"tmp/page-transition_1.0.5_1745320892845_0.6924927289537215","host":"s3://npm-registry-packages-npm-production"}},"1.0.6":{"name":"@avent-ui/page-transition","version":"1.0.6","keywords":["avent-ui","avent","page-transition","react-router-dom"],"author":{"name":"Aathi Eswar S"},"license":"MIT","_id":"@avent-ui/page-transition@1.0.6","maintainers":[{"name":"aathieswar","email":"aathi28082003@gmail.com"}],"homepage":"https://github.com/AathiEswar/avent-ui/blob/main/src/components/Magneto/README.md","bugs":{"url":"https://github.com/AathiEswar/avent-ui/issues"},"dist":{"shasum":"833818f48bd6aca550b091da6da6f83075fa66ce","tarball":"https://registry.npmjs.org/@avent-ui/page-transition/-/page-transition-1.0.6.tgz","fileCount":17,"integrity":"sha512-zr2K/o7f11yd6sOphEAX2tKwr/+UqomoZXmRh5TRZc23EPJnMGwzgrfIX2bVTvn5W1ry2ZAAqpf4BmY9SeRyEg==","signatures":[{"sig":"MEUCIHHalcRqrKanDmbVTXDPQECUd8oWzFrAcT7L7e+2m96pAiEA6421dG7ewwyfcbhcgv9qbMc238csdQmfphY//sWATq0=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":2481989},"main":"dist/index.js","type":"module","types":"dist/index.d.ts","module":"dist/index.esm.js","gitHead":"96e594c01046255a3b20e1d4009aa3c3cd88efd5","scripts":{"test":"echo \"Error: no test specified\" && exit 1","build":"rollup -c","prepare":"npm run build"},"_npmUser":{"name":"aathieswar","actor":{"name":"aathieswar","type":"user","email":"aathi28082003@gmail.com"},"email":"aathi28082003@gmail.com"},"repository":{"url":"git+https://github.com/AathiEswar/avent-ui.git#main","type":"git"},"_npmVersion":"9.8.1","description":"Page Transition with React Router Dom","directories":{},"_nodeVersion":"21.7.1","dependencies":{"react":"^18.3.1","react-dom":"^18.3.1"},"_hasShrinkwrap":false,"devDependencies":{"rollup":"^4.27.2","postcss":"^8.4.49","typescript":"^5.6.3","postcss-cli":"^11.0.0","tailwindcss":"^3.4.15","@types/react":"^18.3.12","autoprefixer":"^10.4.20","@types/react-dom":"^18.3.1","@rollup/plugin-babel":"^6.0.4","rollup-plugin-postcss":"^4.0.2","@rollup/plugin-commonjs":"^28.0.1","rollup-plugin-typescript2":"^0.36.0","rollup-plugin-node-resolve":"^5.2.0","@rollup/plugin-node-resolve":"^15.3.0","rollup-plugin-peer-deps-external":"^2.2.4"},"_npmOperationalInternal":{"tmp":"tmp/page-transition_1.0.6_1750855916737_0.09179406861968342","host":"s3://npm-registry-packages-npm-production"}},"1.0.7":{"name":"@avent-ui/page-transition","version":"1.0.7","keywords":["avent-ui","avent","page-transition","react-router-dom"],"author":{"name":"Aathi Eswar S"},"license":"MIT","_id":"@avent-ui/page-transition@1.0.7","maintainers":[{"name":"aathieswar","email":"aathi28082003@gmail.com"}],"homepage":"https://github.com/AathiEswar/avent-ui/blob/main/src/components/Magneto/README.md","bugs":{"url":"https://github.com/AathiEswar/avent-ui/issues"},"dist":{"shasum":"9888af1bf6c79522d1db85e2f25cbc06658fdbd3","tarball":"https://registry.npmjs.org/@avent-ui/page-transition/-/page-transition-1.0.7.tgz","fileCount":17,"integrity":"sha512-VnlYuqUAgfRZinrtWO0cWdR319ZVv/MOi1B76YuNllG3V47Pl1rjbcnUSCt9XIzVt/4tVyTc8Ovrt3lMzxqa5A==","signatures":[{"sig":"MEQCICCIMycNpdHw5MeOmIJfPIVfcRedEzob7B0pNO3E3fCeAiAkYtITTscn88xiBhJlUw1/mR359kOrZxUrTpm2MhfiuQ==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":2482032},"main":"dist/index.js","type":"module","types":"dist/index.d.ts","module":"dist/index.esm.js","gitHead":"c30a489b32a2663f46c3b9d3aaa3e46fe38b5498","scripts":{"test":"echo \"Error: no test specified\" && exit 1","build":"rollup -c","prepare":"npm run build"},"_npmUser":{"name":"aathieswar","actor":{"name":"aathieswar","type":"user","email":"aathi28082003@gmail.com"},"email":"aathi28082003@gmail.com"},"repository":{"url":"git+https://github.com/AathiEswar/avent-ui.git#main","type":"git"},"_npmVersion":"9.8.1","description":"Page Transition with React Router Dom","directories":{},"_nodeVersion":"21.7.1","dependencies":{"react":"^18.3.1","react-dom":"^18.3.1"},"_hasShrinkwrap":false,"devDependencies":{"rollup":"^4.27.2","postcss":"^8.4.49","typescript":"^5.6.3","postcss-cli":"^11.0.0","tailwindcss":"^3.4.15","@types/react":"^18.3.12","autoprefixer":"^10.4.20","@types/react-dom":"^18.3.1","@rollup/plugin-babel":"^6.0.4","rollup-plugin-postcss":"^4.0.2","@rollup/plugin-commonjs":"^28.0.1","rollup-plugin-typescript2":"^0.36.0","rollup-plugin-node-resolve":"^5.2.0","@rollup/plugin-node-resolve":"^15.3.0","rollup-plugin-peer-deps-external":"^2.2.4"},"_npmOperationalInternal":{"tmp":"tmp/page-transition_1.0.7_1750856967456_0.9030407099196576","host":"s3://npm-registry-packages-npm-production"}},"1.0.8":{"name":"@avent-ui/page-transition","version":"1.0.8","description":"Page Transition with React Router Dom","main":"./dist/index.cjs","module":"./dist/index.js","types":"./dist/index.d.ts","sideEffects":false,"exports":{".":{"import":"./dist/index.js","require":"./dist/index.cjs","types":"./dist/index.d.ts"}},"type":"module","scripts":{"test":"echo \"Error: no test specified\" && exit 1","build":"rollup -c","prepare":"npm run build"},"repository":{"type":"git","url":"git+https://github.com/AathiEswar/avent-ui.git#main"},"keywords":["avent-ui","avent","page-transition","react-router-dom"],"author":{"name":"Aathi Eswar S"},"license":"MIT","bugs":{"url":"https://github.com/AathiEswar/avent-ui/issues"},"homepage":"https://github.com/AathiEswar/avent-ui/blob/main/src/context/Page%20Transition/README.md","dependencies":{"react":"^18.3.1","react-dom":"^18.3.1"},"devDependencies":{"@rollup/plugin-babel":"^6.0.4","@rollup/plugin-commonjs":"^28.0.1","@rollup/plugin-node-resolve":"^15.3.0","@types/react":"^18.3.12","@types/react-dom":"^18.3.1","autoprefixer":"^10.4.20","postcss":"^8.4.49","postcss-cli":"^11.0.0","rollup":"^4.27.2","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-peer-deps-external":"^2.2.4","rollup-plugin-postcss":"^4.0.2","rollup-plugin-typescript2":"^0.36.0","tailwindcss":"^3.4.15","typescript":"^5.6.3"},"_id":"@avent-ui/page-transition@1.0.8","gitHead":"35f2a1f3394bf29f021de620fcfd68d7a69287cc","_nodeVersion":"21.7.1","_npmVersion":"9.8.1","dist":{"integrity":"sha512-VqJAkL5+PQhm9kOehvCaAi2zDSmej5PeDWLkDrWnsInTGavRXS1z1/54e9XRTG6uS9Dae6Nkim9wTcDChcD31g==","shasum":"80377f0dd390f21a1a45bf3d6a3deceb9c9b0501","tarball":"https://registry.npmjs.org/@avent-ui/page-transition/-/page-transition-1.0.8.tgz","fileCount":523,"unpackedSize":3802436,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEQCIA/B0gvUkeTHRb8zlJp8RrADWzCItq4J+JjMgUaWfnWdAiBLTkZzjZ8brniYdvKD6Mrer/n70jSVVZVZEKBd7m0UKw=="}]},"_npmUser":{"name":"aathieswar","email":"aathi28082003@gmail.com","actor":{"name":"aathieswar","email":"aathi28082003@gmail.com","type":"user"}},"directories":{},"maintainers":[{"name":"aathieswar","email":"aathi28082003@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/page-transition_1.0.8_1751094759860_0.9374812840274112"},"_hasShrinkwrap":false}},"time":{"created":"2025-04-22T11:21:32.760Z","modified":"2025-06-28T07:12:40.469Z","1.0.5":"2025-04-22T11:21:33.071Z","1.0.6":"2025-06-25T12:51:56.952Z","1.0.7":"2025-06-25T13:09:27.686Z","1.0.8":"2025-06-28T07:12:40.286Z"},"bugs":{"url":"https://github.com/AathiEswar/avent-ui/issues"},"author":{"name":"Aathi Eswar S"},"license":"MIT","homepage":"https://github.com/AathiEswar/avent-ui/blob/main/src/context/Page%20Transition/README.md","keywords":["avent-ui","avent","page-transition","react-router-dom"],"repository":{"type":"git","url":"git+https://github.com/AathiEswar/avent-ui.git#main"},"description":"Page Transition with React Router Dom","maintainers":[{"name":"aathieswar","email":"aathi28082003@gmail.com"}],"readme":"## AventUI - Page Transition\r\n\r\nThe **Page Transition** context allows for easier implementation of page transition with **react-router-dom**. Pass the transition animation as a composite component in the TransitionProp\r\n\r\n### Installation\r\n\r\n### 1. Install the Component via npm:\r\n\r\n```jsx\r\nnpm install @avent-ui/page-transition\r\n```\r\n\r\n### 2 . Tailwind CSS setup\r\n\r\nAventUI is built on top of Tailwind CSS, so you need to install Tailwind CSS first. You can follow the official [installation guide](https://tailwindcss.com/docs/installation) to install Tailwind CSS. Then you need to add the following code to your tailwind.config.js file:\r\n\r\n```jsx\r\n/** @type {import('tailwindcss').Config} */\r\nmodule.exports = {\r\n\tcontent: [\r\n\t\t\"./src/**/*.{js,jsx,ts,tsx}\",\r\n\t\t// make sure it's pointing to the ROOT node_module\r\n\t\t\"./node_modules/@avent-ui/page-transition/dist/**/*.{js,ts,jsx,tsx}\",\r\n\t],\r\n\ttheme: {\r\n\t\textend: {},\r\n\t},\r\n\tplugins: [],\r\n};\r\n```\r\n\r\n### 3. Import the Context\r\n\r\n```jsx\r\nimport { PageTransitionContext } from \"@avent-ui/page-transition\";\r\n```\r\n\r\n### 4. Use it to wrap your routes\r\n\r\nMake sure to add **Key** and **location** to your Routes in order to let the context understand the Componenet Tree Structure\r\n\r\n```jsx\r\nconst location = useLocation();\r\nreturn (\r\n\t<PageTransitionContext>\r\n\t\t<Routes key={location.pathname} location={location}>\r\n\t\t\t<Route path=\"/\" element={<App />} />\r\n\t\t\t<Route path=\"home\" element={<Home />} />\r\n\t\t</Routes>\r\n\t</PageTransitionContext>\r\n);\r\n```\r\n\r\n### Properties\r\n\r\n| Prop             |         Type          | Description             |          Default |\r\n| ---------------- | :-------------------: | ----------------------- | ---------------: |\r\n| `TransitionProp` | `Composite ReactNode` | Type Of Page Transition | SimpleTransition |\r\n\r\n## List Of Trasitions :\r\n\r\nPageTransitionContext<br/>\r\nCurveCover<br/>\r\nStaggerScreen<br/>\r\nSimpleScreen<br/>\r\nLeftToRightScreen<br/>\r\nStackOverLap<br/>\r\nStaggerBlock<br/>\r\n","readmeFilename":"README.md"}