@ssgoi/vue 2.0.0

package/README.md

@@ -0,0 +1,351 @@
+# @ssgoi/vue
+
+Vue bindings for SSGOI - Native app-like page transitions for Vue applications.
+
+try this: [ssgoi.dev](https://ssgoi.dev)
+
+![https://ssgoi.dev](https://ssgoi.dev/ssgoi.gif)
+
+## What is SSGOI?
+
+SSGOI brings native app-like page transitions to the web. Transform your static page navigations into smooth, delightful experiences that users love.
+
+### ✨ Key Features
+
+- **🌍 Works Everywhere** - Unlike the browser's View Transition API, SSGOI works in all modern browsers (Chrome, Firefox, Safari)
+- **🚀 SSR Ready** - Perfect compatibility with Nuxt. No hydration issues, SEO-friendly
+- **🎯 Use Your Router** - Keep your existing routing. Vue Router, Nuxt - all work seamlessly
+- **💾 State Persistence** - Remembers animation state during navigation, even with browser back/forward
+- **🖖 Vue Optimized** - Built specifically for Vue 3 with Composition API and custom directives
+
+## Installation
+
+```bash
+npm install @ssgoi/vue
+# or
+yarn add @ssgoi/vue
+# or
+pnpm add @ssgoi/vue
+```
+
+## Quick Start
+
+### 1. Wrap your app
+
+```vue
+<template>
+  <Ssgoi :config="config">
+    <div style="position: relative">
+      <!-- Your app -->
+      <RouterView />
+    </div>
+  </Ssgoi>
+</template>
+
+<script setup>
+import { Ssgoi } from '@ssgoi/vue';
+import { fade } from '@ssgoi/vue/view-transitions';
+
+const config = {
+  defaultTransition: fade()
+};
+</script>
+```
+
+### 2. Wrap your pages
+
+```vue
+<template>
+  <SsgoiTransition id="/">
+    <h1>Welcome</h1>
+    <!-- Page content -->
+  </SsgoiTransition>
+</template>
+
+<script setup>
+import { SsgoiTransition } from '@ssgoi/vue';
+</script>
+```
+
+**That's it!** Your pages now transition smoothly with a fade effect.
+
+## Advanced Transitions
+
+### Route-based Transitions
+
+Define different transitions for different routes:
+
+```javascript
+const config = {
+  transitions: [
+    // Slide between tabs
+    { from: '/home', to: '/about', transition: slide({ direction: 'left' }) },
+    { from: '/about', to: '/home', transition: slide({ direction: 'right' }) },
+    
+    // Scale up when entering details
+    { from: '/products', to: '/products/*', transition: scale() },
+    
+    // Pinterest-style image transitions
+    { from: '/gallery', to: '/photo/*', transition: pinterest() }
+  ],
+  defaultTransition: fade()
+};
+```
+
+### Symmetric Transitions
+
+Automatically create bidirectional transitions:
+
+```javascript
+{
+  from: '/home',
+  to: '/about', 
+  transition: slide({ direction: 'left' }),
+  symmetric: true  // Automatically creates reverse transition
+}
+```
+
+### Individual Element Animations
+
+Animate specific elements during mount/unmount:
+
+#### Method 1: Using Vue Directive (Recommended)
+
+```vue
+<template>
+  <div v-transition="{
+    key: 'card',
+    in: fadeIn(),
+    out: slideUp()
+  }">
+    <h2>Animated Card</h2>
+  </div>
+</template>
+
+<script setup>
+import { vTransition as vTransitionDirective } from '@ssgoi/vue';
+import { fadeIn, slideUp } from '@ssgoi/vue/transitions';
+
+// Local directive registration
+const vTransition = vTransitionDirective;
+</script>
+```
+
+**Global Registration (in your main.ts/app.ts):**
+```javascript
+import { createApp } from 'vue';
+import { vTransition } from '@ssgoi/vue';
+import App from './App.vue';
+
+const app = createApp(App);
+
+// Register the directive globally
+app.directive('transition', vTransition);
+
+app.mount('#app');
+```
+
+#### Method 2: Using Composition API
+
+```vue
+<template>
+  <div ref="cardRef">
+    <h2>Animated Card</h2>
+  </div>
+</template>
+
+<script setup>
+import { ref, onMounted, onUnmounted } from 'vue';
+import { transition } from '@ssgoi/vue';
+import { fadeIn, slideUp } from '@ssgoi/vue/transitions';
+
+const cardRef = ref();
+let cleanup;
+
+onMounted(() => {
+  cleanup = transition({
+    key: 'card',
+    in: fadeIn(),
+    out: slideUp()
+  })(cardRef.value);
+});
+
+onUnmounted(() => {
+  cleanup?.();
+});
+</script>
+```
+
+## Nuxt 3 Example
+
+```vue
+<!-- app.vue -->
+<template>
+  <Ssgoi :config="config">
+    <div style="position: relative; min-height: 100vh">
+      <NuxtPage />
+    </div>
+  </Ssgoi>
+</template>
+
+<script setup>
+import { Ssgoi } from '@ssgoi/vue';
+import { slide } from '@ssgoi/vue/view-transitions';
+
+const config = {
+  defaultTransition: slide({ direction: 'left' })
+};
+</script>
+
+<!-- pages/index.vue -->
+<template>
+  <SsgoiTransition id="/">
+    <!-- Your page content -->
+  </SsgoiTransition>
+</template>
+
+<script setup>
+import { SsgoiTransition } from '@ssgoi/vue';
+</script>
+```
+
+## API Reference
+
+### Components
+
+#### `<Ssgoi>`
+The provider component that manages transition context.
+
+```vue
+<Ssgoi :config="ssgoiConfig">
+  <!-- children -->
+</Ssgoi>
+```
+
+Props:
+- `config` - Transition configuration object
+
+#### `<SsgoiTransition>`
+Wrapper component for pages that should transition.
+
+```vue
+<SsgoiTransition id="/page-id">
+  <!-- children -->
+</SsgoiTransition>
+```
+
+Props:
+- `id` - Unique identifier for the page (required)
+
+### Composables
+
+#### `useSsgoi()`
+Access transition context and state.
+
+```javascript
+import { useSsgoi } from '@ssgoi/vue';
+
+const ssgoi = useSsgoi();
+```
+
+### Directives
+
+#### `v-transition`
+Apply transitions to individual elements.
+
+```vue
+<div v-transition="{
+  key: 'unique-key',
+  in: fadeIn(),
+  out: fadeOut()
+}">
+  Content
+</div>
+```
+
+### Functions
+
+#### `transition()`
+Apply transitions programmatically.
+
+```javascript
+const cleanup = transition({
+  key: 'unique-key',
+  in: fadeIn(),
+  out: fadeOut()
+})(element);
+```
+
+## Built-in Transitions
+
+### Page Transitions (`@ssgoi/vue/view-transitions`)
+- `fade()` - Smooth opacity transition
+- `slide()` - Directional sliding (left/right/up/down)
+- `scale()` - Zoom in/out effect
+- `hero()` - Shared element transitions
+- `pinterest()` - Pinterest-style expand effect
+- `ripple()` - Material Design ripple effect
+
+### Element Transitions (`@ssgoi/vue/transitions`)
+- `fadeIn()` / `fadeOut()`
+- `slideUp()` / `slideDown()` / `slideLeft()` / `slideRight()`
+- `scaleIn()` / `scaleOut()`
+- `bounce()`
+- `blur()`
+- `rotate()`
+
+## Spring Physics Configuration
+
+All transitions use spring physics for natural motion:
+
+```javascript
+slide({
+  direction: 'left',
+  spring: {
+    stiffness: 300,  // 1-1000, higher = faster
+    damping: 30      // 0-100, higher = less oscillation
+  }
+})
+```
+
+## TypeScript Support
+
+SSGOI is written in TypeScript and provides full type definitions:
+
+```typescript
+import type { SsgoiConfig, TransitionConfig } from '@ssgoi/vue';
+
+const config: SsgoiConfig = {
+  // Full type safety
+};
+```
+
+## Browser Support
+
+- Chrome/Edge 88+
+- Firefox 78+
+- Safari 14+
+- All modern mobile browsers
+
+## Performance
+
+- Minimal bundle size (~8kb gzipped)
+- Hardware-accelerated animations
+- Automatic cleanup and memory management
+- Smart preloading for instant transitions
+
+## Documentation
+
+Visit [https://ssgoi.dev](https://ssgoi.dev) for:
+- Complete API reference
+- Interactive examples
+- Advanced patterns
+- Migration guides
+
+## Contributing
+
+We welcome contributions! Please see our [contributing guide](https://github.com/meursyphus/ssgoi/blob/main/CONTRIBUTING.md) for details.
+
+## License
+
+MIT © [MeurSyphus](https://github.com/meursyphus)

package/dist/context.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),t=Symbol("ssgoi-context"),s=o=>{e.provide(t,o)},i=()=>{const o=e.inject(t);if(!o)throw new Error("useSsgoi must be used within Ssgoi component");return o};exports.provideSsgoi=s;exports.useSsgoi=i;

package/dist/context.d.ts

@@ -0,0 +1,3 @@
+import { SsgoiContext } from './types';
+export declare const provideSsgoi: (context: SsgoiContext) => void;
+export declare const useSsgoi: () => SsgoiContext;

package/dist/context.js

@@ -0,0 +1,13 @@
+import { provide as e, inject as s } from "vue";
+const t = Symbol("ssgoi-context"), n = (o) => {
+  e(t, o);
+}, r = () => {
+  const o = s(t);
+  if (!o)
+    throw new Error("useSsgoi must be used within Ssgoi component");
+  return o;
+};
+export {
+  n as provideSsgoi,
+  r as useSsgoi
+};

package/dist/index.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("./transition.cjs"),i=require("./ssgoi.vue.cjs"),e=require("./ssgoi-transition.vue.cjs");exports.transition=t.transition;exports.vTransition=t.vTransition;exports.Ssgoi=i.default;exports.SsgoiTransition=e.default;

package/dist/index.d.ts

@@ -0,0 +1,4 @@
+export { transition, vTransition } from './transition';
+export * from './types';
+export { default as Ssgoi } from './ssgoi.vue';
+export { default as SsgoiTransition } from './ssgoi-transition.vue';

package/dist/index.js

@@ -0,0 +1,9 @@
+import { transition as t, vTransition as i } from "./transition.js";
+import { default as s } from "./ssgoi.vue.js";
+import { default as e } from "./ssgoi-transition.vue.js";
+export {
+  s as Ssgoi,
+  e as SsgoiTransition,
+  t as transition,
+  i as vTransition
+};

package/dist/presets/index.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("@ssgoi/core/presets");Object.keys(t).forEach(e=>{e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:()=>t[e]})});

package/dist/presets/index.d.ts

@@ -0,0 +1 @@
+export * from '@ssgoi/core/presets';

package/dist/presets/index.js

@@ -0,0 +1 @@
+export * from "@ssgoi/core/presets";

package/dist/ssgoi-transition.vue.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("vue"),r=require("./transition.cjs"),a=require("./context.cjs"),u=["data-ssgoi-transition"],c=t.defineComponent({__name:"ssgoi-transition",props:{id:{}},setup(i){const n=i,o=a.useSsgoi(),s=t.computed(()=>({...o(n.id),key:n.id}));return(e,d)=>t.withDirectives((t.openBlock(),t.createElementBlock("div",{"data-ssgoi-transition":e.id},[t.renderSlot(e.$slots,"default")],8,u)),[[t.unref(r.vTransition),s.value]])}});exports.default=c;

package/dist/ssgoi-transition.vue.d.ts

@@ -0,0 +1,20 @@
+interface Props {
+    id: string;
+}
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {};
+    rootEl: HTMLDivElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/ssgoi-transition.vue.js

@@ -0,0 +1,23 @@
+import { defineComponent as e, computed as r, withDirectives as a, createElementBlock as c, openBlock as d, renderSlot as p, unref as m } from "vue";
+import { vTransition as u } from "./transition.js";
+import { useSsgoi as f } from "./context.js";
+const l = ["data-ssgoi-transition"], k = /* @__PURE__ */ e({
+  __name: "ssgoi-transition",
+  props: {
+    id: {}
+  },
+  setup(i) {
+    const o = i, n = f(), s = r(() => ({
+      ...n(o.id),
+      key: o.id
+    }));
+    return (t, g) => a((d(), c("div", { "data-ssgoi-transition": t.id }, [
+      p(t.$slots, "default")
+    ], 8, l)), [
+      [m(u), s.value]
+    ]);
+  }
+});
+export {
+  k as default
+};

package/dist/ssgoi-transition.vue2.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./ssgoi-transition.vue.cjs");exports.default=e.default;

package/dist/ssgoi-transition.vue2.js

@@ -0,0 +1,4 @@
+import f from "./ssgoi-transition.vue.js";
+export {
+  f as default
+};

package/dist/ssgoi.vue.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),c=require("./context.cjs"),s=require("@ssgoi/core"),u=e.defineComponent({__name:"ssgoi",props:{config:{}},setup(t){const o=t,n=e.computed(()=>s.createSggoiTransitionContext(o.config));return e.watchEffect(()=>{c.provideSsgoi(n.value)}),(r,i)=>(e.openBlock(),e.createElementBlock("div",null,[e.renderSlot(r.$slots,"default")]))}});exports.default=u;

package/dist/ssgoi.vue.d.ts

@@ -0,0 +1,21 @@
+import { SsgoiConfig } from './types';
+interface Props {
+    config: SsgoiConfig;
+}
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {};
+    rootEl: HTMLDivElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/ssgoi.vue.js

@@ -0,0 +1,20 @@
+import { defineComponent as r, computed as c, watchEffect as i, createElementBlock as s, openBlock as p, renderSlot as a } from "vue";
+import { provideSsgoi as f } from "./context.js";
+import { createSggoiTransitionContext as l } from "@ssgoi/core";
+const _ = /* @__PURE__ */ r({
+  __name: "ssgoi",
+  props: {
+    config: {}
+  },
+  setup(o) {
+    const e = o, t = c(() => l(e.config));
+    return i(() => {
+      f(t.value);
+    }), (n, m) => (p(), s("div", null, [
+      a(n.$slots, "default")
+    ]));
+  }
+});
+export {
+  _ as default
+};

package/dist/ssgoi.vue2.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./ssgoi.vue.cjs");exports.default=e.default;

package/dist/ssgoi.vue2.js

@@ -0,0 +1,4 @@
+import f from "./ssgoi.vue.js";
+export {
+  f as default
+};

package/dist/transition.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("@ssgoi/core"),o=s.transition,r={mounted(n,t){if(!t.value){console.warn("[SSGOI] v-transition directive requires a configuration object");return}const e=t.value;setTimeout(()=>{const i=o(e)(n);n._ssgoiCleanup=i},0)},unmounted(n){const t=n._ssgoiCleanup;t&&(t(),delete n._ssgoiCleanup)}};exports.transition=o;exports.vTransition=r;

package/dist/transition.d.ts

@@ -0,0 +1,6 @@
+import { transition as _transition, Transition, TransitionKey } from '@ssgoi/core';
+import { Directive } from 'vue';
+export declare const transition: typeof _transition;
+export declare const vTransition: Directive<HTMLElement, Transition & {
+    key: TransitionKey;
+}>;

package/dist/transition.js

@@ -0,0 +1,24 @@
+import { transition as s } from "@ssgoi/core";
+const e = s, r = {
+  mounted(n, t) {
+    if (!t.value) {
+      console.warn(
+        "[SSGOI] v-transition directive requires a configuration object"
+      );
+      return;
+    }
+    const o = t.value;
+    setTimeout(() => {
+      const i = e(o)(n);
+      n._ssgoiCleanup = i;
+    }, 0);
+  },
+  unmounted(n) {
+    const t = n._ssgoiCleanup;
+    t && (t(), delete n._ssgoiCleanup);
+  }
+};
+export {
+  e as transition,
+  r as vTransition
+};

package/dist/transitions/index.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("@ssgoi/core/transitions");Object.keys(t).forEach(e=>{e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:()=>t[e]})});

package/dist/transitions/index.d.ts

@@ -0,0 +1 @@
+export * from '@ssgoi/core/transitions';

package/dist/transitions/index.js

@@ -0,0 +1 @@
+export * from "@ssgoi/core/transitions";

package/dist/types.cjs

@@ -0,0 +1 @@
+"use strict";

package/dist/types.d.ts

@@ -0,0 +1 @@
+export * from '@ssgoi/core/types';

package/dist/types.js

@@ -0,0 +1 @@
+

package/dist/view-transitions/index.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("@ssgoi/core/view-transitions");Object.keys(t).forEach(e=>{e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:()=>t[e]})});

package/dist/view-transitions/index.d.ts

@@ -0,0 +1 @@
+export * from '@ssgoi/core/view-transitions';

package/dist/view-transitions/index.js

@@ -0,0 +1 @@
+export * from "@ssgoi/core/view-transitions";

package/dist/vite.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="31.88" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 257"><defs><linearGradient id="IconifyId1813088fe1fbc01fb466" x1="-.828%" x2="57.636%" y1="7.652%" y2="78.411%"><stop offset="0%" stop-color="#41D1FF"></stop><stop offset="100%" stop-color="#BD34FE"></stop></linearGradient><linearGradient id="IconifyId1813088fe1fbc01fb467" x1="43.376%" x2="50.316%" y1="2.242%" y2="89.03%"><stop offset="0%" stop-color="#FFEA83"></stop><stop offset="8.333%" stop-color="#FFDD35"></stop><stop offset="100%" stop-color="#FFA800"></stop></linearGradient></defs><path fill="url(#IconifyId1813088fe1fbc01fb466)" d="M255.153 37.938L134.897 252.976c-2.483 4.44-8.862 4.466-11.382.048L.875 37.958c-2.746-4.814 1.371-10.646 6.827-9.67l120.385 21.517a6.537 6.537 0 0 0 2.322-.004l117.867-21.483c5.438-.991 9.574 4.796 6.877 9.62Z"></path><path fill="url(#IconifyId1813088fe1fbc01fb467)" d="M185.432.063L96.44 17.501a3.268 3.268 0 0 0-2.634 3.014l-5.474 92.456a3.268 3.268 0 0 0 3.997 3.378l24.777-5.718c2.318-.535 4.413 1.507 3.936 3.838l-7.361 36.047c-.495 2.426 1.782 4.5 4.151 3.78l15.304-4.649c2.372-.72 4.652 1.36 4.15 3.788l-11.698 56.621c-.732 3.542 3.979 5.473 5.943 2.437l1.313-2.028l72.516-144.72c1.215-2.423-.88-5.186-3.54-4.672l-25.505 4.922c-2.396.462-4.435-1.77-3.759-4.114l16.646-57.705c.677-2.35-1.37-4.583-3.769-4.113Z"></path></svg>

package/package.json

@@ -0,0 +1,100 @@
+{
+  "name": "@ssgoi/vue",
+  "version": "2.0.0",
+  "description": "Vue bindings for SSGOI - Native app-like page transitions for Vue applications",
+  "private": false,
+  "type": "module",
+  "files": [
+    "dist",
+    "!dist/**/*.test.*",
+    "!dist/**/*.spec.*"
+  ],
+  "main": "./dist/index.cjs",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js",
+      "require": "./dist/index.cjs",
+      "default": "./dist/index.js"
+    },
+    "./transitions": {
+      "types": "./dist/transitions/index.d.ts",
+      "import": "./dist/transitions/index.js",
+      "require": "./dist/transitions/index.cjs",
+      "default": "./dist/transitions/index.js"
+    },
+    "./view-transitions": {
+      "types": "./dist/view-transitions/index.d.ts",
+      "import": "./dist/view-transitions/index.js",
+      "require": "./dist/view-transitions/index.cjs",
+      "default": "./dist/view-transitions/index.js"
+    },
+    "./types": {
+      "types": "./dist/types.d.ts",
+      "import": "./dist/types.js",
+      "require": "./dist/types.cjs",
+      "default": "./dist/types.js"
+    },
+    "./presets": {
+      "types": "./dist/presets/index.d.ts",
+      "import": "./dist/presets/index.js",
+      "require": "./dist/presets/index.cjs",
+      "default": "./dist/presets/index.js"
+    }
+  },
+  "scripts": {
+    "dev": "vite build --watch",
+    "build": "vue-tsc -b && vite build",
+    "watch": "vite build --watch",
+    "lint": "eslint .",
+    "preview": "vite preview",
+    "package": "vite build",
+    "prepare": "pnpm run build"
+  },
+  "dependencies": {
+    "@ssgoi/core": "workspace:*"
+  },
+  "peerDependencies": {
+    "vue": "^3.5.0"
+  },
+  "devDependencies": {
+    "@eslint/js": "^9.30.1",
+    "@vitejs/plugin-vue": "^6.0.0",
+    "@vue/tsconfig": "^0.7.0",
+    "eslint": "^9.30.1",
+    "eslint-plugin-vue": "^9.33.0",
+    "globals": "^16.3.0",
+    "rollup-plugin-preserve-directives": "^0.4.0",
+    "typescript": "~5.8.3",
+    "typescript-eslint": "^8.35.1",
+    "vite": "^7.0.4",
+    "vite-plugin-dts": "^4.5.4",
+    "vue-tsc": "^2.2.12"
+  },
+  "keywords": [
+    "vue",
+    "page-transition",
+    "animation",
+    "ssgoi",
+    "spring-physics"
+  ],
+  "author": "MeurSyphus <tmdeoans@snu.ac.kr>",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/meursyphus/ssgoi.git",
+    "directory": "packages/vue"
+  },
+  "homepage": "https://ssgoi.dev",
+  "bugs": {
+    "url": "https://github.com/meursyphus/ssgoi/issues"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "engines": {
+    "node": ">=18.0.0"
+  }
+}