diff --git a/.gitignore b/.gitignore
index 82fe8e7e..00e1d7a7 100644
--- a/.gitignore
+++ b/.gitignore
@@ -11,13 +11,5 @@ dist
 
 notivue-*.tgz
 
-cypress/downloads
-cypress/screenshots
-
-*.sublime-workspace
-*.sublime-project
-
 .nuxt
 pnpm-lock.yaml
-
-astro-dev
diff --git a/.husky/pre-commit b/.husky/pre-commit
index 17236687..2312dc58 100755
--- a/.husky/pre-commit
+++ b/.husky/pre-commit
@@ -1,6 +1 @@
-#!/usr/bin/env sh
-. "$(dirname -- "$0")/_/husky.sh"
-
 npx lint-staged
-
-#
diff --git a/.prettierrc b/.prettierrc
index f9ee1cb0..192e0d23 100644
--- a/.prettierrc
+++ b/.prettierrc
@@ -5,6 +5,7 @@
    "tabWidth": 3,
    "trailingComma": "es5",
    "useTabs": false,
+   "plugins": ["prettier-plugin-astro"],
    "overrides": [
       {
          "files": "README.md",
@@ -13,6 +14,11 @@
             "trailingComma": "none",
             "printWidth": 90
          }
+      },      {
+         "files": "*.astro",
+         "options": {
+            "parser": "astro"
+         }
       }
    ]
 }
diff --git a/astro-playground/.gitignore b/astro-playground/.gitignore
new file mode 100644
index 00000000..aa210b11
--- /dev/null
+++ b/astro-playground/.gitignore
@@ -0,0 +1,20 @@
+# build output
+dist/
+# generated types
+.astro/
+
+# dependencies
+node_modules/
+
+# logs
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+
+# environment variables
+.env
+.env.production
+
+# macOS-specific files
+.DS_Store
diff --git a/astro-playground/astro.config.mjs b/astro-playground/astro.config.mjs
new file mode 100644
index 00000000..c662b2b3
--- /dev/null
+++ b/astro-playground/astro.config.mjs
@@ -0,0 +1,19 @@
+import { defineConfig } from 'astro/config'
+
+import vue from '@astrojs/vue'
+import react from '@astrojs/react'
+
+export default defineConfig({
+   integrations: [
+      vue({
+         appEntrypoint: '/src/pages/_app.ts',
+         devtools: true,
+      }),
+      react(),
+   ],
+   vite: {
+      optimizeDeps: {
+         include: ['notivue'],
+      },
+   },
+})
diff --git a/astro-playground/package.json b/astro-playground/package.json
new file mode 100644
index 00000000..d6cf642c
--- /dev/null
+++ b/astro-playground/package.json
@@ -0,0 +1,25 @@
+{
+   "name": "notivue-astro-playground",
+   "type": "module",
+   "private": true,
+   "scripts": {
+      "dev": "astro dev",
+      "start": "astro dev",
+      "build": "astro build",
+      "preview": "astro preview",
+      "astro": "astro"
+   },
+   "dependencies": {
+      "@astrojs/react": "^3.6.2",
+      "@astrojs/vue": "^4.5.0",
+      "astro": "^4.15.1",
+      "notivue": "workspace:*",
+      "react": "^18.3.1",
+      "react-dom": "^18.3.1",
+      "vue": "^3.4.30"
+   },
+   "devDependencies": {
+      "@types/react": "^18.3.3",
+      "@types/react-dom": "^18.3.0"
+   }
+}
diff --git a/astro-playground/public/favicon.svg b/astro-playground/public/favicon.svg
new file mode 100644
index 00000000..f157bd1c
--- /dev/null
+++ b/astro-playground/public/favicon.svg
@@ -0,0 +1,9 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 128 128">
+    <path d="M50.4 78.5a75.1 75.1 0 0 0-28.5 6.9l24.2-65.7c.7-2 1.9-3.2 3.4-3.2h29c1.5 0 2.7 1.2 3.4 3.2l24.2 65.7s-11.6-7-28.5-7L67 45.5c-.4-1.7-1.6-2.8-2.9-2.8-1.3 0-2.5 1.1-2.9 2.7L50.4 78.5Zm-1.1 28.2Zm-4.2-20.2c-2 6.6-.6 15.8 4.2 20.2a17.5 17.5 0 0 1 .2-.7 5.5 5.5 0 0 1 5.7-4.5c2.8.1 4.3 1.5 4.7 4.7.2 1.1.2 2.3.2 3.5v.4c0 2.7.7 5.2 2.2 7.4a13 13 0 0 0 5.7 4.9v-.3l-.2-.3c-1.8-5.6-.5-9.5 4.4-12.8l1.5-1a73 73 0 0 0 3.2-2.2 16 16 0 0 0 6.8-11.4c.3-2 .1-4-.6-6l-.8.6-1.6 1a37 37 0 0 1-22.4 2.7c-5-.7-9.7-2-13.2-6.2Z" />
+    <style>
+        path { fill: #000; }
+        @media (prefers-color-scheme: dark) {
+            path { fill: #FFF; }
+        }
+    </style>
+</svg>
diff --git a/astro-playground/src/components/AstroComponent.astro b/astro-playground/src/components/AstroComponent.astro
new file mode 100644
index 00000000..7e5ac845
--- /dev/null
+++ b/astro-playground/src/components/AstroComponent.astro
@@ -0,0 +1,59 @@
+<div>
+   <h3>From a Script Tag</h3>
+
+   <button data-static>Push</button>
+   <button data-promise>Push Promise</button>
+   <button data-clear-all>Clear All</button>
+   <button data-destroy-all>Destroy All</button>
+</div>
+
+<script>
+   import { push } from 'notivue/astro'
+
+   function pushStatic() {
+      push.success({
+         title: 'Vue Notification',
+         message: 'Notification from a Script Tag!',
+      })
+   }
+
+   function pushPromise() {
+      const promise = push.promise({
+         title: 'Loading Notification...',
+         message: 'Loading notification from a Script Tag...',
+      })
+
+      setTimeout(() => {
+         promise.resolve({
+            title: 'Notification',
+            message: 'Loaded notification from a Script Tag!',
+         })
+      }, 2000)
+   }
+
+   const events = [
+      ['data-static', pushStatic],
+      ['data-promise', pushPromise],
+      ['data-clear-all', push.clearAll],
+      ['data-destroy-all', push.destroyAll],
+   ] as const
+
+   function addListeners() {
+      events.forEach(([e, fn]) => {
+         document.querySelector(`[${e}]`)?.addEventListener('click', fn)
+      })
+   }
+
+   function removeListeners() {
+      events.forEach(([e, fn]) => {
+         document.querySelector(`[${e}]`)?.removeEventListener('click', fn)
+      })
+   }
+
+   addListeners()
+
+   // Only needed if using View Transitions
+
+   document.addEventListener('astro:before-swap', removeListeners)
+   document.addEventListener('astro:after-swap', addListeners)
+</script>
diff --git a/astro-playground/src/components/Notivue.vue b/astro-playground/src/components/Notivue.vue
new file mode 100644
index 00000000..29aadea4
--- /dev/null
+++ b/astro-playground/src/components/Notivue.vue
@@ -0,0 +1,11 @@
+<script setup lang="ts">
+import { Notivue, NotivueSwipe, Notification } from 'notivue/astro'
+</script>
+
+<template>
+   <Notivue v-slot="item">
+      <NotivueSwipe :item="item">
+         <Notification :item="item" />
+      </NotivueSwipe>
+   </Notivue>
+</template>
diff --git a/astro-playground/src/components/ReactComponent.tsx b/astro-playground/src/components/ReactComponent.tsx
new file mode 100644
index 00000000..540d0852
--- /dev/null
+++ b/astro-playground/src/components/ReactComponent.tsx
@@ -0,0 +1,35 @@
+import { push } from 'notivue/astro'
+
+function pushStatic() {
+   push.info({
+      title: 'React Notification',
+      message: 'Notification from React!',
+   })
+}
+
+function pushPromise() {
+   const promise = push.promise({
+      title: 'Loading React Notification...',
+      message: 'Loading notification from React...',
+   })
+
+   setTimeout(() => {
+      promise.resolve({
+         title: 'React Notification',
+         message: 'Loaded notification from React!',
+      })
+   }, 2000)
+}
+
+export function ReactComponent() {
+   return (
+      <div>
+         <h3>From React</h3>
+
+         <button onClick={pushStatic}>Push</button>
+         <button onClick={pushPromise}>Push Promise</button>
+         <button onClick={push.clearAll}>Clear All</button>
+         <button onClick={push.destroyAll}>Destroy All</button>
+      </div>
+   )
+}
diff --git a/astro-playground/src/components/VueComponent.vue b/astro-playground/src/components/VueComponent.vue
new file mode 100644
index 00000000..1cf8ebf5
--- /dev/null
+++ b/astro-playground/src/components/VueComponent.vue
@@ -0,0 +1,35 @@
+<script setup lang="ts">
+import { push } from 'notivue/astro'
+
+function pushStatic() {
+   push.success({
+      title: 'Vue Notification',
+      message: 'Notification from Vue!',
+   })
+}
+
+function pushPromise() {
+   const promise = push.promise({
+      title: 'Loading Vue Notification...',
+      message: 'Loading notification from Vue...',
+   })
+
+   setTimeout(() => {
+      promise.resolve({
+         title: 'Vue Notification',
+         message: 'Loaded notification from Vue!',
+      })
+   }, 2000)
+}
+</script>
+
+<template>
+   <div>
+      <h3>From Vue</h3>
+
+      <button @click="pushStatic">Push</button>
+      <button @click="pushPromise">Push Promise</button>
+      <button @click="push.clearAll">Clear All</button>
+      <button @click="push.destroyAll">Destroy All</button>
+   </div>
+</template>
diff --git a/astro-playground/src/env.d.ts b/astro-playground/src/env.d.ts
new file mode 100644
index 00000000..acef35f1
--- /dev/null
+++ b/astro-playground/src/env.d.ts
@@ -0,0 +1,2 @@
+/// <reference path="../.astro/types.d.ts" />
+/// <reference types="astro/client" />
diff --git a/astro-playground/src/layouts/Layout.astro b/astro-playground/src/layouts/Layout.astro
new file mode 100644
index 00000000..7b1b79ec
--- /dev/null
+++ b/astro-playground/src/layouts/Layout.astro
@@ -0,0 +1,28 @@
+---
+import { ViewTransitions } from 'astro:transitions'
+
+import Notivue from '@/components/Notivue.vue'
+
+import 'notivue/astro/notification.css'
+import 'notivue/astro/animations.css'
+
+import '@/styles/reset.css'
+---
+
+<html lang="en">
+   <head>
+      <meta charset="utf-8" />
+      <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+      <link rel="icon" href="/favicon.svg" />
+
+      <ViewTransitions />
+   </head>
+
+   <body>
+      <slot />
+
+      <div id="notivue_teleport" transition:persist transition:persist-props>
+         <Notivue client:only="vue" />
+      </div>
+   </body>
+</html>
diff --git a/astro-playground/src/pages/_app.ts b/astro-playground/src/pages/_app.ts
new file mode 100644
index 00000000..2a74a271
--- /dev/null
+++ b/astro-playground/src/pages/_app.ts
@@ -0,0 +1,11 @@
+import { createNotivue } from 'notivue/astro'
+
+import type { App, Plugin } from 'vue'
+
+const notivue = createNotivue({
+   teleportTo: '#notivue_teleport',
+})
+
+export default (app: App) => {
+   app.use(notivue as unknown as Plugin)
+}
diff --git a/astro-playground/src/pages/about.astro b/astro-playground/src/pages/about.astro
new file mode 100644
index 00000000..4e4741c6
--- /dev/null
+++ b/astro-playground/src/pages/about.astro
@@ -0,0 +1,15 @@
+---
+import Layout from '@/layouts/Layout.astro'
+
+import VueComponent from '@/components/VueComponent.vue'
+import AstroComponent from '@/components/AstroComponent.astro'
+import { ReactComponent } from '@/components/ReactComponent'
+---
+
+<Layout>
+   <a href="/">Home</a>
+
+   <VueComponent client:load />
+   <ReactComponent client:load />
+   <AstroComponent />
+</Layout>
diff --git a/astro-playground/src/pages/index.astro b/astro-playground/src/pages/index.astro
new file mode 100644
index 00000000..18f02c9a
--- /dev/null
+++ b/astro-playground/src/pages/index.astro
@@ -0,0 +1,15 @@
+---
+import Layout from '../layouts/Layout.astro'
+
+import VueComponent from '../components/VueComponent.vue'
+import AstroComponent from '@/components/AstroComponent.astro'
+import { ReactComponent } from '../components/ReactComponent'
+---
+
+<Layout>
+   <a href="/about">About</a>
+
+   <VueComponent client:load />
+   <ReactComponent client:load />
+   <AstroComponent />
+</Layout>
diff --git a/astro-playground/src/styles/reset.css b/astro-playground/src/styles/reset.css
new file mode 100644
index 00000000..ded5d7de
--- /dev/null
+++ b/astro-playground/src/styles/reset.css
@@ -0,0 +1,96 @@
+/* https://andy-bell.co.uk/a-more-modern-css-reset/ */
+
+/* Box sizing rules */
+*,
+*::before,
+*::after {
+   box-sizing: border-box;
+}
+
+html {
+   font-family: system-ui, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji',
+      'Segoe UI Emoji';
+}
+
+/* Prevent font size inflation */
+html {
+   -moz-text-size-adjust: none;
+   -webkit-text-size-adjust: none;
+   text-size-adjust: none;
+}
+
+/* Remove default margin in favour of better control in authored CSS */
+body,
+h1,
+h2,
+h3,
+h4,
+p,
+figure,
+blockquote,
+dl,
+dd {
+   margin: 0;
+}
+
+/* Remove list styles on ul, ol elements with a list role, which suggests default styling will be removed */
+ul[role='list'],
+ol[role='list'] {
+   list-style: none;
+}
+
+/* Set core body defaults */
+body {
+   min-height: 100vh;
+   line-height: 1.5;
+}
+
+/* Set shorter line heights on headings and interactive elements */
+h1,
+h2,
+h3,
+h4,
+button,
+input,
+label {
+   line-height: 1.1;
+}
+
+/* Balance text wrapping on headings */
+h1,
+h2,
+h3,
+h4 {
+   text-wrap: balance;
+}
+
+/* A elements that don't have a class get default styles */
+a:not([class]) {
+   text-decoration-skip-ink: auto;
+   color: currentColor;
+}
+
+/* Make images easier to work with */
+img,
+picture {
+   max-width: 100%;
+   display: block;
+}
+
+/* Inherit fonts for inputs and buttons */
+input,
+button,
+textarea,
+select {
+   font: inherit;
+}
+
+/* Make sure textareas without a rows attribute are not tiny */
+textarea:not([rows]) {
+   min-height: 10em;
+}
+
+/* Anything that has been anchored to should have extra scroll margin */
+:target {
+   scroll-margin-block: 5ex;
+}
diff --git a/astro-playground/tsconfig.json b/astro-playground/tsconfig.json
new file mode 100644
index 00000000..51ddc129
--- /dev/null
+++ b/astro-playground/tsconfig.json
@@ -0,0 +1,10 @@
+{
+   "extends": "astro/tsconfigs/strict",
+   "compilerOptions": {
+      "baseUrl": ".",
+      "paths": {
+         "@/*": ["src/*"]
+      },
+      "jsx": "react-jsx"
+   }
+}
diff --git a/package.json b/package.json
index 99d1ca2c..b7c6044c 100644
--- a/package.json
+++ b/package.json
@@ -6,19 +6,21 @@
       "node": ">=20.0.0"
    },
    "scripts": {
-      "dev": "pnpm build && concurrently \"pnpm -C packages/notivue run watch\" \"pnpm -C demo install && pnpm -C demo run dev --host\"",
+      "dev": "pnpm build && concurrently \"pnpm -C packages/notivue run watch\" \"pnpm -C playground install && pnpm -C playground run dev --host\"",
+      "dev:astro": "pnpm build && concurrently \"pnpm -C packages/notivue run watch\" \"pnpm -C astro-playground install && pnpm -C astro-playground run dev --host\"",
       "build": "pnpm -C packages/notivue run build",
-      "build:demo": "pnpm build && pnpm install && pnpm -C demo run build",
+      "build:playground": "pnpm build && pnpm install && pnpm -C playground run build",
       "test": "pnpm build && pnpm install && pnpm -C tests run test",
       "test:gui": "pnpm build && concurrently \"pnpm -C packages/notivue run watch\" \"pnpm -C tests install && pnpm -C tests run test:gui\"",
       "test:unit": "pnpm -C tests run test:unit",
-      "prepare": "husky install"
+      "prepare": "husky"
    },
    "devDependencies": {
       "concurrently": "^8.2.2",
-      "husky": "^8.0.3",
-      "lint-staged": "^15.2.2",
-      "prettier": "^3.2.5"
+      "husky": "^9.1.5",
+      "lint-staged": "^15.2.9",
+      "prettier": "^3.3.3",
+      "prettier-plugin-astro": "^0.14.1"
    },
    "lint-staged": {
       "*.{js,ts,vue,json,css,md}": "prettier --write"
diff --git a/packages/notivue/Notivue/NotivueImpl.vue b/packages/notivue/Notivue/NotivueImpl.vue
index b066f092..176c9c09 100644
--- a/packages/notivue/Notivue/NotivueImpl.vue
+++ b/packages/notivue/Notivue/NotivueImpl.vue
@@ -9,7 +9,7 @@ import { getSlotItem } from '@/core/utils'
 import { useMouseEvents } from './composables/useMouseEvents'
 import { useTouchEvents } from './composables/useTouchEvents'
 import { useNotivueStyles } from './composables/useNotivueStyles'
-import { useRepositioning } from './composables/useRepositioning'
+import { useSizes } from './composables/useSizes'
 import { useWindowFocus } from './composables/useWindowFocus'
 import { useReducedMotion } from './composables/useReducedMotion'
 
@@ -36,7 +36,7 @@ const touchEvents = useTouchEvents()
 
 useReducedMotion()
 useWindowFocus()
-useRepositioning()
+useSizes()
 </script>
 
 <template>
diff --git a/packages/notivue/Notivue/composables/useRepositioning.ts b/packages/notivue/Notivue/composables/useSizes.ts
similarity index 90%
rename from packages/notivue/Notivue/composables/useRepositioning.ts
rename to packages/notivue/Notivue/composables/useSizes.ts
index 35ce2ad1..41796077 100644
--- a/packages/notivue/Notivue/composables/useRepositioning.ts
+++ b/packages/notivue/Notivue/composables/useSizes.ts
@@ -2,7 +2,7 @@ import { useWindowSize } from './useWindowSize'
 import { useResizeListObserver } from './useResizeListObserver'
 import { useStore } from '@/core/useStore'
 
-export function useRepositioning() {
+export function useSizes() {
    const { elements, animations } = useStore()
 
    useWindowSize(() => animations.updatePositions({ isImmediate: true }))
diff --git a/packages/notivue/astro/Notivue.vue b/packages/notivue/astro/Notivue.vue
index d65458d6..7b19eca2 100644
--- a/packages/notivue/astro/Notivue.vue
+++ b/packages/notivue/astro/Notivue.vue
@@ -1,18 +1,40 @@
 <script setup lang="ts">
-import { onMounted, onBeforeUnmount } from 'vue'
+import { onMounted, onBeforeUnmount, getCurrentInstance, provide } from 'vue'
+
 import { DEFAULT_PROPS } from '@/Notivue/constants'
 import { NotivueClientOnly } from '@/shared/ClientOnly'
-import { push } from '@/core/createPush'
+import { createProvides } from '@/core/createNotivue'
+import { notivueInjectionKey, notivueInstanceInjectionKey } from '@/core/symbols'
 
 import NotivueImpl from '@/Notivue/NotivueImpl.vue'
 
-import type { NotivueComponentSlot, NotivueProps } from 'notivue'
+import type { NotivueConfig, NotivueComponentSlot, NotivueProps } from 'notivue'
 import type { PushAstroEvent } from './types'
 
 const props = withDefaults(defineProps<NotivueProps>(), DEFAULT_PROPS)
 
 defineSlots<NotivueComponentSlot>()
 
+/* ====================================================================================
+ * Setup Store
+ * ==================================================================================== */
+
+const pluginConfig = getCurrentInstance()?.appContext.config.globalProperties
+   .notivuePluginConfig as NotivueConfig & {
+   startOnCreation?: boolean
+}
+
+const { startOnCreation = true, ...userConfig } = pluginConfig || {}
+
+const { store, instance, push } = createProvides(startOnCreation, userConfig)
+
+provide(notivueInstanceInjectionKey, instance)
+provide(notivueInjectionKey, store)
+
+/* ====================================================================================
+ * Listen for custom events dispatached by push
+ * ==================================================================================== */
+
 function onPush(e: CustomEvent<PushAstroEvent>) {
    // Create the notification as usual
    const notification = push[e.detail.type](e.detail)
diff --git a/packages/notivue/astro/createNotivue.ts b/packages/notivue/astro/createNotivue.ts
new file mode 100644
index 00000000..221cb9c5
--- /dev/null
+++ b/packages/notivue/astro/createNotivue.ts
@@ -0,0 +1,17 @@
+import { NotivueConfig } from 'notivue'
+
+import type { Plugin, App } from 'vue'
+
+export function createNotivue(
+   pluginConfig: NotivueConfig & {
+      startOnCreation?: boolean
+   } = {}
+): Plugin {
+   return {
+      install(app: App) {
+         Object.assign(app.config.globalProperties, {
+            notivuePluginConfig: pluginConfig,
+         })
+      },
+   }
+}
diff --git a/packages/notivue/astro/push.ts b/packages/notivue/astro/push.ts
index be0125b0..b9075139 100644
--- a/packages/notivue/astro/push.ts
+++ b/packages/notivue/astro/push.ts
@@ -1,4 +1,4 @@
-import type { PushOptions } from 'notivue'
+import type { Push, PushOptions } from 'notivue'
 import type { PushAstroEvent, MaybeAstroPushPromiseReturn } from './types'
 
 export function pushEvent<T extends Omit<PushAstroEvent, 'resultEventName'>>(
@@ -47,4 +47,4 @@ export const push = {
    destroyAll() {
       window.dispatchEvent(new CustomEvent('notivue:destroy-all'))
    },
-}
+} as Push
diff --git a/packages/notivue/core/createInstance.ts b/packages/notivue/core/createInstance.ts
new file mode 100644
index 00000000..572795d2
--- /dev/null
+++ b/packages/notivue/core/createInstance.ts
@@ -0,0 +1,53 @@
+import { readonly, ref } from 'vue'
+
+import { createPushMock, setPush } from './createPush'
+import { createStoreWatchers } from './createStoreWatchers'
+
+import type { NotivueStore, Push } from 'notivue'
+
+export let startInstance: () => void = () => {}
+export let stopInstance: () => void = () => {}
+
+export function createInstance(startOnCreation: boolean) {
+   const isRunning = ref(startOnCreation)
+   const isRunningReadonly = readonly(isRunning)
+
+   function setupInstance(store: NotivueStore, push: Push) {
+      const watchStore = () => createStoreWatchers(store)
+
+      if (startOnCreation) setPush(push)
+
+      let unwatchStore = startOnCreation ? watchStore() : [() => {}]
+
+      const instance = {
+         isRunning: isRunningReadonly,
+         startInstance() {
+            if (isRunning.value) return
+
+            setPush(push)
+            unwatchStore = watchStore()
+
+            isRunning.value = true
+         },
+         stopInstance() {
+            if (!isRunning.value) return
+
+            store.items.clear()
+            store.queue.clear()
+            store.items.clearLifecycleEvents()
+
+            setPush(createPushMock())
+            unwatchStore.forEach((unwatch) => unwatch())
+
+            isRunning.value = false
+         },
+      }
+
+      startInstance = () => instance.startInstance()
+      stopInstance = () => instance.stopInstance()
+
+      return instance
+   }
+
+   return { isRunning: isRunningReadonly, setupInstance }
+}
diff --git a/packages/notivue/core/createNotivue.ts b/packages/notivue/core/createNotivue.ts
index cd1cd549..d0e0c400 100644
--- a/packages/notivue/core/createNotivue.ts
+++ b/packages/notivue/core/createNotivue.ts
@@ -1,21 +1,27 @@
-import type { App, InjectionKey, Plugin } from 'vue'
-import type { NotivueConfig, NotivueInstance, NotivueStore, Push } from 'notivue'
+import type { App, Plugin } from 'vue'
+import type { NotivueConfig } from 'notivue'
 
-import { ref, readonly } from 'vue'
-import { setPush, createPush, createPushMock } from './createPush'
-import { createStoreWatchers } from './createStoreWatchers'
-import {
-   createConfig,
-   createQueue,
-   createItems,
-   createElements,
-   createAnimations,
-   createTimeouts,
-   createPushProxies,
-} from './createStore'
+import { createPush } from './createPush'
+import { notivueInjectionKey, notivueInstanceInjectionKey } from './symbols'
+import { createInstance } from './createInstance'
+import { createPushProxies, createStore } from './createStore'
 
-export const notivueInstanceInjectionKey = Symbol('') as InjectionKey<NotivueInstance>
-export const notivueInjectionKey = Symbol('') as InjectionKey<NotivueStore>
+export function createProvides(startOnCreation: boolean, userConfig: NotivueConfig) {
+   const { setupInstance, isRunning } = createInstance(startOnCreation)
+
+   const store = createStore(userConfig, isRunning)
+
+   const proxies = createPushProxies(store)
+   const push = Object.freeze(createPush(proxies))
+
+   const instance = setupInstance(store, push)
+
+   return {
+      store,
+      instance,
+      push,
+   }
+}
 
 export function createNotivue(
    pluginConfig: NotivueConfig & {
@@ -25,22 +31,7 @@ export function createNotivue(
    return {
       install(app: App) {
          const { startOnCreation = true, ...userConfig } = pluginConfig
-
-         const { isRunning, runInstance } = createInstance(startOnCreation)
-
-         const config = createConfig(userConfig, isRunning)
-         const queue = createQueue()
-         const items = createItems(config, queue)
-         const elements = createElements()
-         const animations = createAnimations(config, items, queue, elements)
-         const timeouts = createTimeouts(items, animations)
-
-         const store = { config, queue, items, elements, animations, timeouts }
-
-         const proxies = createPushProxies(store)
-         const push = Object.freeze(createPush(proxies))
-
-         const instance = runInstance(store, push)
+         const { store, instance, push } = createProvides(startOnCreation, userConfig)
 
          app.provide(notivueInstanceInjectionKey, instance)
          app.provide(notivueInjectionKey, store)
@@ -49,50 +40,3 @@ export function createNotivue(
       },
    }
 }
-
-export let startInstance: () => void = () => {}
-export let stopInstance: () => void = () => {}
-
-function createInstance(startOnCreation: boolean) {
-   const isRunning = ref(startOnCreation)
-   const isRunningReadonly = readonly(isRunning)
-
-   function runInstance(store: NotivueStore, push: Push) {
-      const watchStore = () => createStoreWatchers(store)
-
-      if (startOnCreation) setPush(push)
-
-      let unwatchStore = startOnCreation ? watchStore() : [() => {}]
-
-      const instance = {
-         isRunning: isRunningReadonly,
-         startInstance() {
-            if (isRunning.value) return
-
-            setPush(push)
-            unwatchStore = watchStore()
-
-            isRunning.value = true
-         },
-         stopInstance() {
-            if (!isRunning.value) return
-
-            store.items.clear()
-            store.queue.clear()
-            store.items.clearLifecycleEvents()
-
-            setPush(createPushMock())
-            unwatchStore.forEach((unwatch) => unwatch())
-
-            isRunning.value = false
-         },
-      }
-
-      startInstance = () => instance.startInstance()
-      stopInstance = () => instance.stopInstance()
-
-      return instance
-   }
-
-   return { isRunning: isRunningReadonly, runInstance }
-}
diff --git a/packages/notivue/core/createStore.ts b/packages/notivue/core/createStore.ts
index b337e118..b42c8d80 100644
--- a/packages/notivue/core/createStore.ts
+++ b/packages/notivue/core/createStore.ts
@@ -1,4 +1,4 @@
-import { ref, shallowRef, triggerRef, unref, isRef, type Ref, type CSSProperties } from 'vue'
+import { ref, shallowRef, triggerRef, unref, isRef, type Ref } from 'vue'
 
 import {
    createConfigRefs,
@@ -23,10 +23,25 @@ import type {
    TimeoutsSlice,
    AnimationsSlice,
    UpdateParam,
+   NotivueStore,
 } from 'notivue'
 
 export let updateConfig: (newConfig: UpdateParam) => void = () => {}
 
+export function createStore(
+   userConfig: NotivueConfig,
+   isRunning: Readonly<Ref<boolean>>
+): NotivueStore {
+   const config = createConfig(userConfig, isRunning)
+   const queue = createQueue()
+   const items = createItems(config, queue)
+   const elements = createElements()
+   const animations = createAnimations(config, items, queue, elements)
+   const timeouts = createTimeouts(items, animations)
+
+   return { config, queue, items, elements, animations, timeouts }
+}
+
 export function createConfig(userConfig: NotivueConfig, isRunning: Readonly<Ref<boolean>>) {
    const config = createConfigRefs(DEFAULT_CONFIG, userConfig, isRunning)
 
@@ -158,6 +173,14 @@ export function createElements() {
          return this.items.value.sort((a, b) => +b.dataset.notivueItem! - +a.dataset.notivueItem!)
       },
       containers: ref<HTMLElement[]>([]),
+   } as {
+      // Suppress TS7056
+      root: Ref<HTMLElement | null>
+      rootAttrs: Ref<Partial<AnimationAttrs>>
+      items: Ref<HTMLElement[]>
+      containers: Ref<HTMLElement[]>
+      setRootAttrs(newAttrs: Partial<AnimationAttrs>): void
+      getSortedItems(): HTMLElement[]
    }
 }
 
@@ -429,9 +452,11 @@ export function createPushProxies({
                animationAttrs: {
                   class: animations.isReducedMotion.value ? '' : config.animations.value.enter,
                   onAnimationend() {
-                     items.update(entry.id, {
-                        animationAttrs: { class: '', onAnimationend: undefined },
-                     })
+                     if (item.animationAttrs.class === config.animations.value.enter) {
+                        items.update(entry.id, {
+                           animationAttrs: { class: '', onAnimationend: () => {} },
+                        })
+                     }
                   },
                },
                timeout: shouldEnqueue ? createTimeout : createTimeout(),
diff --git a/packages/notivue/core/symbols.ts b/packages/notivue/core/symbols.ts
new file mode 100644
index 00000000..1a0d7c20
--- /dev/null
+++ b/packages/notivue/core/symbols.ts
@@ -0,0 +1,5 @@
+import type { InjectionKey } from 'vue'
+import type { NotivueInstance, NotivueStore } from 'notivue'
+
+export const notivueInstanceInjectionKey = Symbol() as InjectionKey<NotivueInstance>
+export const notivueInjectionKey = Symbol() as InjectionKey<NotivueStore>
diff --git a/packages/notivue/core/useStore.ts b/packages/notivue/core/useStore.ts
index e27db2d2..042e16e4 100644
--- a/packages/notivue/core/useStore.ts
+++ b/packages/notivue/core/useStore.ts
@@ -1,7 +1,7 @@
 import { inject, computed, toRefs, reactive, readonly, ref } from 'vue'
 
 import { isSSR, getSlotItem } from './utils'
-import { notivueInjectionKey, notivueInstanceInjectionKey } from './createNotivue'
+import { notivueInjectionKey, notivueInstanceInjectionKey } from './symbols'
 import { push } from './createPush'
 import { DEFAULT_CONFIG } from './constants'
 
diff --git a/packages/notivue/index.ts b/packages/notivue/index.ts
index 8803f365..23401181 100644
--- a/packages/notivue/index.ts
+++ b/packages/notivue/index.ts
@@ -3,8 +3,9 @@ export { push as pushAstro } from './astro/push'
 
 export { updateConfig } from '@/core/createStore'
 export { createNotivue } from '@/core/createNotivue'
+export { createNotivue as createNotivueAstro } from './astro/createNotivue'
 
-export { startInstance, stopInstance } from '@/core/createNotivue'
+export { startInstance, stopInstance } from '@/core/createInstance'
 
 export { usePush, useNotivue, useNotifications, useNotivueInstance } from '@/core/useStore'
 export { useNotivueKeyboard } from '@/NotivueKeyboard/useNotivueKeyboard'
diff --git a/packages/notivue/nuxt/module.json b/packages/notivue/nuxt/module.json
index 046de41e..9edbef26 100644
--- a/packages/notivue/nuxt/module.json
+++ b/packages/notivue/nuxt/module.json
@@ -1,5 +1,5 @@
 {
    "name": "notivue/nuxt",
    "configKey": "notivue",
-   "version": "2.4.4"
+   "version": "2.4.5"
 }
diff --git a/packages/notivue/package.json b/packages/notivue/package.json
index cc2a58b3..e0d3cb12 100644
--- a/packages/notivue/package.json
+++ b/packages/notivue/package.json
@@ -1,6 +1,6 @@
 {
    "name": "notivue",
-   "version": "2.4.4",
+   "version": "2.4.5",
    "private": false,
    "description": "Powerful toast notification system for Vue and Nuxt",
    "keywords": [
@@ -76,12 +76,12 @@
       "@vitejs/plugin-vue": "4.6.2",
       "concurrently": "^8.2.2",
       "defu": "^6.1.4",
-      "esbuild": "^0.19.12",
-      "typescript": "5.3.3",
+      "esbuild": "^0.21.5",
+      "typescript": "^5.5.2",
       "vite": "^5.0.12",
-      "vite-plugin-dts": "^3.7.2",
+      "vite-plugin-dts": "^3.9.1",
       "vue": "3.3.13",
-      "vue-tsc": "1.8.27"
+      "vue-tsc": "^2.0.22"
    },
    "peerDependencies": {
       "@nuxt/kit": ">=3.5.0",
diff --git a/packages/notivue/shared/exports.js b/packages/notivue/shared/exports.js
index 62530e30..fac899e9 100644
--- a/packages/notivue/shared/exports.js
+++ b/packages/notivue/shared/exports.js
@@ -34,7 +34,7 @@ export const exports = {
       'NotificationProgress',
       'NotificationsProgress', // Alias
    ],
-   astro: ['NotivueAstro', 'pushAstro'],
+   astro: ['NotivueAstro', 'pushAstro', 'createNotivueAstro'],
 }
 
 const getExports = (type, omit) => exports[type].filter((name) => !omit.includes(name))
diff --git a/packages/notivue/vite.config.ts b/packages/notivue/vite.config.ts
index 24cd7266..9b40ce0d 100644
--- a/packages/notivue/vite.config.ts
+++ b/packages/notivue/vite.config.ts
@@ -57,7 +57,7 @@ export default defineConfig({
          name: 'write-astro-entry',
          closeBundle() {
             const astroReExports = [
-               ...getFunctions({ omit: ['push'] }),
+               ...getFunctions({ omit: ['push', 'createNotivue'] }),
                ...getComponents({ omit: ['Notivue'] }),
                ...getObjects(),
             ]
@@ -67,6 +67,7 @@ export default defineConfig({
                [
                   'export { pushAstro as push } from "./index.js";',
                   'export { NotivueAstro as Notivue } from "./index.js";',
+                  'export { createNotivueAstro as createNotivue } from "./index.js";',
                   ...astroReExports.map((name) => `export { ${name} } from "./index.js";`),
                ].join('\n')
             )
diff --git a/demo/.gitignore b/playground/.gitignore
similarity index 100%
rename from demo/.gitignore
rename to playground/.gitignore
diff --git a/demo/.npmrc b/playground/.npmrc
similarity index 100%
rename from demo/.npmrc
rename to playground/.npmrc
diff --git a/demo/app.vue b/playground/app.vue
similarity index 100%
rename from demo/app.vue
rename to playground/app.vue
diff --git a/demo/assets/inter-v13-latin-500.woff2 b/playground/assets/inter-v13-latin-500.woff2
similarity index 100%
rename from demo/assets/inter-v13-latin-500.woff2
rename to playground/assets/inter-v13-latin-500.woff2
diff --git a/demo/assets/inter-v13-latin-700.woff2 b/playground/assets/inter-v13-latin-700.woff2
similarity index 100%
rename from demo/assets/inter-v13-latin-700.woff2
rename to playground/assets/inter-v13-latin-700.woff2
diff --git a/demo/assets/profile-picture.jpg b/playground/assets/profile-picture.jpg
similarity index 100%
rename from demo/assets/profile-picture.jpg
rename to playground/assets/profile-picture.jpg
diff --git a/demo/assets/pt-sans-narrow-v17-latin-700.woff2 b/playground/assets/pt-sans-narrow-v17-latin-700.woff2
similarity index 100%
rename from demo/assets/pt-sans-narrow-v17-latin-700.woff2
rename to playground/assets/pt-sans-narrow-v17-latin-700.woff2
diff --git a/demo/assets/pt-sans-narrow-v17-latin-regular.woff2 b/playground/assets/pt-sans-narrow-v17-latin-regular.woff2
similarity index 100%
rename from demo/assets/pt-sans-narrow-v17-latin-regular.woff2
rename to playground/assets/pt-sans-narrow-v17-latin-regular.woff2
diff --git a/demo/assets/style.css b/playground/assets/style.css
similarity index 100%
rename from demo/assets/style.css
rename to playground/assets/style.css
diff --git a/demo/components/custom-notifications/FriendRequestNotification.vue b/playground/components/custom-notifications/FriendRequestNotification.vue
similarity index 100%
rename from demo/components/custom-notifications/FriendRequestNotification.vue
rename to playground/components/custom-notifications/FriendRequestNotification.vue
diff --git a/demo/components/custom-notifications/SimpleNotification.vue b/playground/components/custom-notifications/SimpleNotification.vue
similarity index 100%
rename from demo/components/custom-notifications/SimpleNotification.vue
rename to playground/components/custom-notifications/SimpleNotification.vue
diff --git a/demo/components/custom-notifications/UploadNotification.vue b/playground/components/custom-notifications/UploadNotification.vue
similarity index 100%
rename from demo/components/custom-notifications/UploadNotification.vue
rename to playground/components/custom-notifications/UploadNotification.vue
diff --git a/demo/components/icons/ArrowIcon.vue b/playground/components/icons/ArrowIcon.vue
similarity index 100%
rename from demo/components/icons/ArrowIcon.vue
rename to playground/components/icons/ArrowIcon.vue
diff --git a/demo/components/icons/CloseIcon.vue b/playground/components/icons/CloseIcon.vue
similarity index 100%
rename from demo/components/icons/CloseIcon.vue
rename to playground/components/icons/CloseIcon.vue
diff --git a/demo/components/icons/CustomIcon.vue b/playground/components/icons/CustomIcon.vue
similarity index 100%
rename from demo/components/icons/CustomIcon.vue
rename to playground/components/icons/CustomIcon.vue
diff --git a/demo/components/icons/DestroyIcon.vue b/playground/components/icons/DestroyIcon.vue
similarity index 100%
rename from demo/components/icons/DestroyIcon.vue
rename to playground/components/icons/DestroyIcon.vue
diff --git a/demo/components/icons/DismissIcon.vue b/playground/components/icons/DismissIcon.vue
similarity index 100%
rename from demo/components/icons/DismissIcon.vue
rename to playground/components/icons/DismissIcon.vue
diff --git a/demo/components/icons/InfoIcon.vue b/playground/components/icons/InfoIcon.vue
similarity index 100%
rename from demo/components/icons/InfoIcon.vue
rename to playground/components/icons/InfoIcon.vue
diff --git a/demo/components/icons/PromiseIcon.vue b/playground/components/icons/PromiseIcon.vue
similarity index 100%
rename from demo/components/icons/PromiseIcon.vue
rename to playground/components/icons/PromiseIcon.vue
diff --git a/demo/components/icons/SuccessIcon.vue b/playground/components/icons/SuccessIcon.vue
similarity index 100%
rename from demo/components/icons/SuccessIcon.vue
rename to playground/components/icons/SuccessIcon.vue
diff --git a/demo/components/icons/VueIcon.vue b/playground/components/icons/VueIcon.vue
similarity index 100%
rename from demo/components/icons/VueIcon.vue
rename to playground/components/icons/VueIcon.vue
diff --git a/demo/components/icons/WarnIcon.vue b/playground/components/icons/WarnIcon.vue
similarity index 100%
rename from demo/components/icons/WarnIcon.vue
rename to playground/components/icons/WarnIcon.vue
diff --git a/demo/components/nav/Nav.vue b/playground/components/nav/Nav.vue
similarity index 98%
rename from demo/components/nav/Nav.vue
rename to playground/components/nav/Nav.vue
index 910d39d9..8191d9a1 100644
--- a/demo/components/nav/Nav.vue
+++ b/playground/components/nav/Nav.vue
@@ -13,7 +13,7 @@ watch(isRunning, (newVal) => {
    shouldDisplayNotice.value = true
 
    if (newVal) {
-      window.setTimeout(() => {
+      timeout = window.setTimeout(() => {
          shouldDisplayNotice.value = false
       }, 3000)
    }
diff --git a/demo/components/nav/NavActions.vue b/playground/components/nav/NavActions.vue
similarity index 100%
rename from demo/components/nav/NavActions.vue
rename to playground/components/nav/NavActions.vue
diff --git a/demo/components/nav/NavNotificationsCustomization.vue b/playground/components/nav/NavNotificationsCustomization.vue
similarity index 100%
rename from demo/components/nav/NavNotificationsCustomization.vue
rename to playground/components/nav/NavNotificationsCustomization.vue
diff --git a/demo/components/nav/NavNotificationsThemes.vue b/playground/components/nav/NavNotificationsThemes.vue
similarity index 100%
rename from demo/components/nav/NavNotificationsThemes.vue
rename to playground/components/nav/NavNotificationsThemes.vue
diff --git a/demo/components/nav/NavNotivueConfig.vue b/playground/components/nav/NavNotivueConfig.vue
similarity index 100%
rename from demo/components/nav/NavNotivueConfig.vue
rename to playground/components/nav/NavNotivueConfig.vue
diff --git a/demo/components/nav/NavNotivuePosition.vue b/playground/components/nav/NavNotivuePosition.vue
similarity index 100%
rename from demo/components/nav/NavNotivuePosition.vue
rename to playground/components/nav/NavNotivuePosition.vue
diff --git a/demo/components/nav/NavPushBuiltIn.vue b/playground/components/nav/NavPushBuiltIn.vue
similarity index 100%
rename from demo/components/nav/NavPushBuiltIn.vue
rename to playground/components/nav/NavPushBuiltIn.vue
diff --git a/demo/components/nav/NavPushHeadless.vue b/playground/components/nav/NavPushHeadless.vue
similarity index 100%
rename from demo/components/nav/NavPushHeadless.vue
rename to playground/components/nav/NavPushHeadless.vue
diff --git a/demo/components/shared/Background.server.vue b/playground/components/shared/Background.server.vue
similarity index 100%
rename from demo/components/shared/Background.server.vue
rename to playground/components/shared/Background.server.vue
diff --git a/demo/components/shared/Button.vue b/playground/components/shared/Button.vue
similarity index 100%
rename from demo/components/shared/Button.vue
rename to playground/components/shared/Button.vue
diff --git a/demo/components/shared/ButtonGroup.vue b/playground/components/shared/ButtonGroup.vue
similarity index 100%
rename from demo/components/shared/ButtonGroup.vue
rename to playground/components/shared/ButtonGroup.vue
diff --git a/demo/components/shared/QueueCount.vue b/playground/components/shared/QueueCount.vue
similarity index 100%
rename from demo/components/shared/QueueCount.vue
rename to playground/components/shared/QueueCount.vue
diff --git a/demo/middleware/push.global.ts b/playground/middleware/push.global.ts
similarity index 100%
rename from demo/middleware/push.global.ts
rename to playground/middleware/push.global.ts
diff --git a/demo/nuxt.config.ts b/playground/nuxt.config.ts
similarity index 100%
rename from demo/nuxt.config.ts
rename to playground/nuxt.config.ts
diff --git a/demo/package.json b/playground/package.json
similarity index 67%
rename from demo/package.json
rename to playground/package.json
index 090f8e03..b6f58ca5 100644
--- a/demo/package.json
+++ b/playground/package.json
@@ -1,5 +1,5 @@
 {
-   "name": "notivue-demo",
+   "name": "notivue-playground",
    "private": true,
    "scripts": {
       "build": "nuxt build",
@@ -10,13 +10,13 @@
    },
    "devDependencies": {
       "@types/luxon": "^3.4.2",
-      "@types/node": "^20.12.5",
-      "lightningcss": "^1.24.1",
-      "nuxt": "^3.11.2",
-      "vue": "^3.4.21"
+      "@types/node": "^22.5.1",
+      "lightningcss": "^1.26.0",
+      "nuxt": "^3.13.0",
+      "vue": "^3.4.38"
    },
    "dependencies": {
-      "luxon": "^3.4.4",
+      "luxon": "^3.5.0",
       "notivue": "workspace:*"
    }
 }
diff --git a/demo/plugins/store.ts b/playground/plugins/store.ts
similarity index 100%
rename from demo/plugins/store.ts
rename to playground/plugins/store.ts
diff --git a/demo/public/icon.svg b/playground/public/icon.svg
similarity index 100%
rename from demo/public/icon.svg
rename to playground/public/icon.svg
diff --git a/demo/public/og-image.jpg b/playground/public/og-image.jpg
similarity index 100%
rename from demo/public/og-image.jpg
rename to playground/public/og-image.jpg
diff --git a/demo/tsconfig.json b/playground/tsconfig.json
similarity index 100%
rename from demo/tsconfig.json
rename to playground/tsconfig.json
diff --git a/demo/utils/date.ts b/playground/utils/date.ts
similarity index 100%
rename from demo/utils/date.ts
rename to playground/utils/date.ts
diff --git a/demo/utils/head.ts b/playground/utils/head.ts
similarity index 100%
rename from demo/utils/head.ts
rename to playground/utils/head.ts
diff --git a/demo/utils/misc.ts b/playground/utils/misc.ts
similarity index 100%
rename from demo/utils/misc.ts
rename to playground/utils/misc.ts
diff --git a/demo/utils/store.ts b/playground/utils/store.ts
similarity index 100%
rename from demo/utils/store.ts
rename to playground/utils/store.ts
diff --git a/pnpm-workspace.yaml b/pnpm-workspace.yaml
index 6f912595..7487f616 100644
--- a/pnpm-workspace.yaml
+++ b/pnpm-workspace.yaml
@@ -1,4 +1,5 @@
 packages:
    - 'packages/*'
    - 'tests'
-   - 'demo'
+   - 'playground'
+   - 'astro-playground'
diff --git a/tests/Notivue/prefers-reduced-motion.cy.ts b/tests/Notivue/prefers-reduced-motion.cy.ts
index 912b3622..22696fdc 100644
--- a/tests/Notivue/prefers-reduced-motion.cy.ts
+++ b/tests/Notivue/prefers-reduced-motion.cy.ts
@@ -32,6 +32,6 @@ describe('prefers-reduced-motion', () => {
          .clickRandomStatic()
          .click()
          .getNotifications()
-         .should('have.css', 'transition', 'all 0s ease 0s')
+         .should('have.css', 'transition', 'all')
    })
 })
diff --git a/tests/package.json b/tests/package.json
index 7445a3b5..81ba3f9b 100644
--- a/tests/package.json
+++ b/tests/package.json
@@ -10,17 +10,17 @@
       "notivue": "workspace:*"
    },
    "devDependencies": {
-      "@types/node": "^20.12.7",
-      "@vitejs/plugin-vue": "^5.0.4",
-      "@vue/test-utils": "^2.4.5",
-      "axe-core": "^4.9.0",
-      "cypress": "^13.7.3",
+      "@types/node": "^22.5.1",
+      "@vitejs/plugin-vue": "^5.1.3",
+      "@vue/test-utils": "^2.4.6",
+      "axe-core": "^4.10.0",
+      "cypress": "^13.14.1",
       "cypress-axe": "^1.5.0",
-      "cypress-real-events": "^1.12.0",
-      "typescript": "^5.4.5",
-      "vite": "^5.2.8",
-      "vitest": "^1.5.0",
-      "vue": "^3.4.21",
-      "vue-tsc": "^2.0.13"
+      "cypress-real-events": "^1.13.0",
+      "typescript": "^5.5.4",
+      "vite": "^5.4.2",
+      "vitest": "^2.0.5",
+      "vue": "^3.4.38",
+      "vue-tsc": "^2.1.4"
    }
 }