chore: docs build

.github/workflows/build.yaml

@@ -44,7 +44,7 @@ jobs:
             ${{ runner.os }}-pnpm-store-
 
       - name: Install dependencies
-        run: pnpm i --frozen-lockfile
+        run: pnpm i
 
       - name: Build
         run: pnpm --filter motion-vue build

.github/workflows/publish.yaml

@@ -0,0 +1,67 @@
+name: Publish Docs
+
+on:
+  push:
+    paths:
+      - 'docs/**'
+  pull_request:
+    paths:
+      - 'docs/**'
+
+jobs:
+  publish:
+    runs-on: ubuntu-latest
+    permissions:
+      contents: read
+      deployments: write
+    name: Publish to Cloudflare Pages
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+
+      # Run a build step here
+      - name: Setup Node.js environment
+        uses: actions/setup-node@v4
+        with:
+          node-version: 18
+
+      - uses: pnpm/action-setup@v2
+        name: Install pnpm
+        with:
+          version: 9
+          run_install: false
+
+      - name: Get pnpm store directory
+        shell: bash
+        run: |
+          echo "STORE_PATH=$(pnpm store path --silent)" >> $GITHUB_ENV
+
+      - uses: actions/cache@v4
+        name: Setup pnpm cache
+        with:
+          path: ${{ env.STORE_PATH }}
+          key: ${{ runner.os }}-pnpm-store-${{ hashFiles('**/pnpm-lock.yaml') }}
+          restore-keys: |
+            ${{ runner.os }}-pnpm-store-
+
+      - name: Install dependencies
+        run: pnpm i
+
+      - name: Build Docs
+        run: pnpm docs:build
+
+      # Run a action to publish docs
+      - name: Publish to Cloudflare Pages
+        uses: cloudflare/wrangler-action@v3
+        with:
+          apiToken: ${{ secrets.CLOUDFLARE_API_TOKEN }}
+          accountId: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }}
+          projectName: motion-vue
+          directory: .vitepress/dist
+          # Optional: Enable this if you want to have GitHub Deployments triggered
+          gitHubToken: ${{ secrets.GITHUB_TOKEN }}
+          # Optional: Switch what branch you are publishing to.
+          # By default this will be the branch which triggered this workflow
+          # branch: main
+          # Optional: Change the working directory
+          workingDirectory: docs

docs/.vitepress/config.mts

@@ -39,7 +39,7 @@ export default defineConfig({
   ],
 
   sitemap: {
-    hostname: 'https://www.shadcn-vue.com',
+    hostname: 'https://www.motion-vue.com',
     transformItems(items) {
       return items.filter(item => !item.url.includes('migration'))
     },
@@ -51,8 +51,7 @@ export default defineConfig({
       provider: 'local',
     },
     editLink: {
-      pattern: '',
-      // pattern: 'https://github.com/radix-vue/shadcn-vue/tree/dev/apps/www/src/:path',
+      pattern: 'https://github.com/rick-hup/motion-vue/tree/master/docs/src/:path',
       text: 'Edit this page on GitHub',
     },
   },

docs/.vitepress/theme/components/LandingPage.vue

@@ -40,7 +40,7 @@ import HomeDemo from './demos/HomeDemo.vue'
         Get Started
       </a>
       <a
-        href="https://github.com/radix-vue/shadcn-vue"
+        href="https://github.com/rick-hup/motion-vue"
         target="_blank"
         :class="cn(
           buttonVariants({ variant: 'outline' }),

docs/.vitepress/theme/config/docs.ts

@@ -26,11 +26,6 @@ export const docsConfig: DocsConfig = {
       title: 'Documentation',
       href: '/docs/introduction',
     },
-    // {
-    //   title: 'GitHub',
-    //   href: 'https://github.com/radix-vue/shadcn-vue',
-    //   external: true,
-    // },
   ],
   sidebarNav: [
     {

docs/.vitepress/theme/config/site.ts

@@ -1,16 +1,11 @@
 export const siteConfig = {
-  name: 'shadcn-vue',
-  url: 'https://shadcn-vue.com',
-  ogImage: 'https://shadcn-vue.com/og.png',
+  name: 'motion-vue',
+  url: 'https://motion-vue.com',
+  ogImage: 'https://motion-vue.com/og.png',
   description:
-		'Beautifully designed components built with Radix Vue and Tailwind CSS.',
-  links: {
-    twitter: 'https://twitter.com/huntabyte',
-    github: 'https://github.com/huntabyte/shadcn-vue',
-    shadTwitter: 'https://twitter.com/shadcn',
-    shadGithub: 'https://github.com/shadcn/ui',
-  },
-  keywords: 'shadcn,Vue,Nuxt,Vue Components,TailwindCSS,Radix Vue',
+    'Beautifully designed components built with Motion and Tailwind CSS.',
+  links: {},
+  keywords: 'Motion,Vue,Nuxt,Vue Components,Framer Motion',
 }
 
 export const announcementConfig = {

docs/.vitepress/theme/layout/DocsLayout.vue

@@ -12,7 +12,7 @@ import ChevronRightIcon from '~icons/lucide/chevron-right'
 const $route = useRoute()
 const { frontmatter } = useData()
 
-const sourceLink = 'https://github.com/radix-vue/shadcn-vue/tree/dev/'
+const sourceLink = 'https://github.com/rick-hup/motion-vue/tree/master/'
 </script>
 
 <template>

docs/.vitepress/theme/utils/codeeditor.ts

@@ -1,6 +1,5 @@
 import { getParameters } from 'codesandbox/lib/api/define'
 import sdk from '@stackblitz/sdk'
-import { dependencies as deps } from '../../../package.json'
 import tailwindConfigRaw from '../../../tailwind.config?raw'
 import type { Style } from '@/lib/registry/styles'
 
@@ -76,17 +75,13 @@ function constructFiles(componentName: string, style: Style, sources: Record<str
     },
   }
 
-  const iconPackage = style === 'default' ? 'lucide-vue-next' : '@radix-icons/vue'
   const dependencies = {
     'vue': 'latest',
-    'radix-vue': deps['radix-vue'],
-    '@radix-ui/colors': 'latest',
     'clsx': 'latest',
     'class-variance-authority': 'latest',
     'tailwind-merge': 'latest',
     'tailwindcss-animate': 'latest',
-    [iconPackage]: 'latest',
-    'shadcn-vue': 'latest',
+    'motion-vue': 'latest',
     'typescript': 'latest',
   }
 
@@ -115,15 +110,23 @@ function constructFiles(componentName: string, style: Style, sources: Record<str
     }
   })
 
-  // @ts-expect-error componentName migth not exist in Index
-  const demoIndex: any = {}
-  const registryDependencies = demoIndex[style]?.[componentName as any]?.registryDependencies?.filter(i => i !== 'utils')
+  interface DemoIndexEntry {
+    registryDependencies?: string[]
+  }
+
+  interface DemoIndex {
+    [style: string]: {
+      [component: string]: DemoIndexEntry
+    }
+  }
+
+  const demoIndex: DemoIndex = {}
 
   const files = {
     'package.json': {
       content: {
-        name: `shadcn-vue-${componentName.toLowerCase().replace(/ /g, '-')}`,
-        scripts: { start: `shadcn-vue add ${registryDependencies?.join(' ')} -y && vite` },
+        name: `motion-vue-${componentName.toLowerCase().replace(/ /g, '-')}`,
+        scripts: { start: `vite` },
         dependencies,
         devDependencies,
       },

docs/src/content/docs/components/animate-presence.md

@@ -1,7 +1,7 @@
 ---
 title: AnimatePresence
 description: Animate components when they're removed from the Vue tree.
-source: packages/vue/src/components/Motion.vue
+source: packages/motion/src/components/Motion.vue
 ---
 
 ## import

docs/src/content/docs/components/motion.md

@@ -1,7 +1,7 @@
 ---
 title: Motion
 description: Motion components are foundational DOM primitives that provide declarative animation capabilities.
-source: packages/vue/src/components/Motion.vue
+source: packages/motion/src/components/Motion.vue
 ---
 
 ## Import

package.json

@@ -11,12 +11,14 @@
     "dev:play": "pnpm --filter './playground/nuxt' dev",
     "dev": "pnpm --filter './packages/vue' dev",
     "build": "pnpm --filter './packages/**' build",
+    "test": "pnpm --filter './packages/motion' test",
     "prepare": "husky install",
     "docs:install": "pnpm --filter docs install",
     "docs:dev": "pnpm --filter docs dev",
-    "docs:build": "pnpm --filter docs docs:build",
+    "docs:build": "pnpm --filter docs build",
     "docs:gen": "pnpm --filter docs docs:gen",
-    "docs:contributors": "pnpm --filter docs docs:contributors"
+    "docs:contributors": "pnpm --filter docs docs:contributors",
+    "lint-staged": "lint-staged"
   },
   "dependencies": {
     "@vueuse/core": "^11.1.0",
@@ -36,6 +38,12 @@
     "typescript": "^5.5.4"
   },
   "lint-staged": {
-    "*.js": "eslint --fix"
+    "*.{js,ts,vue}": [
+      "eslint --fix",
+      "prettier --write"
+    ],
+    "*.{json,md}": [
+      "prettier --write"
+    ]
   }
 }

packages/motion/src/components/Primitive.ts

@@ -39,9 +39,9 @@ export const Primitive = defineComponent({
       return () => h(asTag, attrs)
 
     if (asTag !== 'template') {
-      return () => h(props.as, attrs, slots.default)
+      return () => h(props.as, attrs, { default: slots.default })
     }
 
-    return () => h(Slot, attrs, slots.default)
+    return () => h(Slot, attrs, { default: slots.default })
   },
 })