chore: init commit

.cursorrules

@@ -0,0 +1,37 @@
+你是一位专门从事Vue 3动画库开发的专家工程师,并且是Framer Motion的忠实用户和专家。请基于以下专业知识为我提供建议：
+
+技术专长:
+- Vue 3 Transition API和TransitionGroup API的深度实现
+- Web Animations API
+- CSS animations/transitions
+- GSAP
+- Framer Motion概念和设计模式
+- JavaScript动画性能优化
+- RequestAnimationFrame
+- Transform和opacity动画优化
+- 动画编排(orchestration)
+- 基于组合式API的动画hooks设计
+- TypeScript类型系统在动画库中的应用
+
+关注重点:
+- 流畅的API设计
+- 动画性能优化 
+- 类型安全
+- 动画复用性
+- Bundle size优化
+- 动画手势交互
+- Spring physics动画
+- 动画编排
+- 路由转场动画
+- 列表动画
+- SVG动画
+- 3D变换
+
+开发规范:
+- 使用TypeScript
+- 基于组合式API设计
+- 遵循Vue 3生态最佳实践
+- 提供完整类型定义
+- 支持Tree-shaking
+- 提供ESM和UMD构建
+- 动画配置参数标准化

.gitignore

@@ -0,0 +1,52 @@
+# Node.js dependencies
+node_modules
+
+# Build outputs
+dist
+build
+
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+
+# Dependency directories
+jspm_packages/
+
+# TypeScript cache
+*.tsbuildinfo
+
+# Optional npm cache directory
+.npm
+
+# Optional eslint cache
+.eslintcache
+
+# Optional REPL history
+.node_repl_history
+
+# Output of 'npm pack'
+*.tgz
+
+# Yarn Integrity file
+.yarn-integrity
+
+# dotenv environment variables file
+.env
+.env.test
+
+# Mac system files
+.DS_Store
+
+# Editor directories and files
+.idea/
+.vscode/
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
+docs/.vitepress/cache/**/*

LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2024 Rick Huang
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

README.md

@@ -0,0 +1 @@
+# vue-motion

commitlint.config.js

@@ -0,0 +1 @@
+module.exports = { extends: ['@commitlint/config-conventional'] };

docs/.vitepress/config.mts

@@ -0,0 +1,94 @@
+import path from 'node:path'
+import { defineConfig } from 'vitepress'
+import Icons from 'unplugin-icons/vite'
+import tailwind from 'tailwindcss'
+import autoprefixer from 'autoprefixer'
+import { createCssVariablesTheme } from 'shikiji'
+
+// import { transformerMetaWordHighlight } from 'shikiji-transformers'
+import { siteConfig } from './theme/config/site'
+import ComponentPreviewPlugin from './theme/plugins/previewer'
+
+const cssVariables = createCssVariablesTheme({
+  variablePrefix: '--shiki-',
+  variableDefaults: {},
+})
+
+// https://vitepress.dev/reference/site-config
+export default defineConfig({
+  title: siteConfig.name,
+  titleTemplate: ':title - motion-vue',
+  description: siteConfig.description,
+  head: [
+    ['link', { rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' }],
+    ['link', { rel: 'shortcut icon', href: '/favicon-16x16.png' }],
+    ['link', { rel: 'apple-touch-icon', href: '/apple-touch-icon.png' }],
+    ['link', { rel: 'manifest', href: '/site.webmanifest' }],
+
+    ['meta', { name: 'theme-color', media: '(prefers-color-scheme: light)', content: 'white' }],
+    ['meta', { name: 'theme-color', media: '(prefers-color-scheme: dark)', content: 'black' }],
+
+    ['meta', { name: 'creator', content: 'motion-vue' }],
+    ['meta', { name: 'theme-color', content: '#41b883' }],
+    ['meta', { name: 'og:type', content: 'website' }],
+    ['meta', { name: 'og:locale', content: 'en' }],
+    ['meta', { name: 'og:site_name', content: siteConfig.name }],
+    ['meta', { name: 'og:image', content: siteConfig.ogImage }],
+    ['meta', { name: 'twitter:image', content: siteConfig.ogImage }],
+
+  ],
+
+  sitemap: {
+    hostname: 'https://www.shadcn-vue.com',
+    transformItems(items) {
+      return items.filter(item => !item.url.includes('migration'))
+    },
+  },
+
+  lastUpdated: true,
+  themeConfig: {
+    search: {
+      provider: 'local',
+    },
+    editLink: {
+      pattern: '',
+      // pattern: 'https://github.com/radix-vue/shadcn-vue/tree/dev/apps/www/src/:path',
+      text: 'Edit this page on GitHub',
+    },
+  },
+
+  srcDir: path.resolve(__dirname, '../src'),
+  markdown: {
+    theme: cssVariables,
+    codeTransformers: [
+      // transformerMetaWordHighlight(),
+    ],
+    config(md) {
+      md.use(ComponentPreviewPlugin)
+    },
+  },
+  rewrites: {
+    'content/(.*)': '(.*)',
+  },
+  vite: {
+    css: {
+      postcss: {
+        plugins: [
+          tailwind(),
+          autoprefixer(),
+        ],
+      },
+    },
+    plugins: [
+      Icons({ compiler: 'vue3', autoInstall: true }),
+    ],
+    resolve: {
+      alias: {
+        '@': path.resolve(__dirname, '../src'),
+      },
+    },
+    ssr: {
+      noExternal: ['vue-sonner'],
+    },
+  },
+})

docs/.vitepress/theme/components/Callout.vue

@@ -0,0 +1,29 @@
+<script setup lang="ts">
+import {
+  Alert,
+  AlertDescription,
+  AlertTitle,
+} from '@/lib/registry/new-york/ui/alert'
+
+interface CalloutProps {
+  icon?: string
+  title?: string
+}
+
+defineProps<CalloutProps>()
+</script>
+
+<template>
+  <Alert class="not-docs">
+    <span
+      v-if="icon"
+      class="mr-4 text-2xl"
+    >{{ icon }}</span>
+    <AlertTitle v-if="title">
+      {{ title }}
+    </AlertTitle>
+    <AlertDescription>
+      <slot />
+    </AlertDescription>
+  </Alert>
+</template>

docs/.vitepress/theme/components/CodeSandbox.vue

@@ -0,0 +1,59 @@
+<script setup lang="ts">
+import { onMounted, ref } from 'vue'
+import { Icon } from '@iconify/vue'
+import { makeCodeSandboxParams } from '../utils/codeeditor'
+import Tooltip from './Tooltip.vue'
+import { Button } from '@/lib/registry/new-york/ui/button'
+import type { Style } from '@/lib/registry/styles'
+
+const props = defineProps<{
+  name: string
+  code: string
+  style?: Style
+}>()
+
+const sources = ref<Record<string, string>>({})
+
+onMounted(() => {
+  sources.value['App.vue'] = props.code
+})
+</script>
+
+<template>
+  <form
+    action="https://codesandbox.io/api/v1/sandboxes/define"
+    method="POST"
+    target="_blank"
+  >
+    <input
+      type="hidden"
+      name="query"
+      value="file=src/App.vue"
+    >
+    <input
+      type="hidden"
+      name="environment"
+      value="server"
+    >
+    <input
+      type="hidden"
+      name="hidedevtools"
+      value="1"
+    >
+    <input
+      type="hidden"
+      name="parameters"
+      :value="makeCodeSandboxParams(name, style, sources)"
+    >
+
+    <Tooltip :content="`Open ${name} in CodeSandbox`">
+      <Button
+        variant="ghost"
+        size="icon"
+        type="submit"
+      >
+        <Icon icon="ph-codesandbox-logo" />
+      </Button>
+    </Tooltip>
+  </form>
+</template>

docs/.vitepress/theme/components/ComponentLoader.vue

@@ -0,0 +1,22 @@
+<script setup lang="ts">
+import { defineAsyncComponent } from 'vue'
+import Spinner from './Spinner.vue'
+
+const props = defineProps<{
+  name: string
+  fresh: any
+}>()
+
+const Component = defineAsyncComponent({
+  loadingComponent: Spinner,
+  loader: () => import(`../../../src/lib/registry/new-york/example/${props.name}.vue`),
+  timeout: 5000,
+})
+</script>
+
+<template>
+  <Component
+    :is="Component"
+    :key="fresh"
+  />
+</template>