@yunlefun/vue 0.0.6 → 0.0.8-beta.0

package/README.md

@@ -1,9 +1,26 @@
-# @yunlefun/vue-components
+# @yunlefun/vue
+
+Vue toolkit(components/composables) for YunLeFun.
 
 ## Usage
 
 ```bash
-pnpm add -D @yunlefun/vue-components
+pnpm add -D @yunlefun/vue
+```
+
+### Use it in Nuxt
+
+```ts
+export default defineNuxtConfig({
+  modules: [
+    // ...
+    '@vueuse/nuxt',
+    '@unocss/nuxt',
+    '@pinia/nuxt',
+    // add this line
+    '@yunlefun/vue/nuxt',
+  ],
+})
 ```
 
 ### Add auto import resolver for vue components
@@ -11,19 +28,22 @@ pnpm add -D @yunlefun/vue-components
 ```ts
 // vite.config.ts
 import { defineConfig } from 'vite'
-import { componentsDir } from '@yunlefun/vue-components'
 import Components from 'unplugin-vue-components/vite'
 
 export default defineConfig({
   plugins: [
     // https://github.com/antfu/unplugin-vue-components
     Components({
-      dirs: ['src/components', componentsDir],
       // allow auto load markdown components under `./src/components/`
       extensions: ['vue', 'md'],
       // allow auto import and register components used in markdown
       include: [/\.vue$/, /\.vue\?vue/, /\.md$/],
       dts: 'src/components.d.ts',
+      resolvers: [
+        // add @yunlefun/vue auto import resolver
+        YlfResolver(),
+      ],
+      di
     }),
   ]
 })

package/components/YlfBottomMenuItem.vue

@@ -1,5 +1,5 @@
 <script lang="ts" setup>
-import type { BottomMenuItem } from '@yunlefun/vue-components'
+import type { BottomMenuItem } from '@yunlefun/vue'
 
 defineProps<{
   active: boolean

package/components/YlfCard.vue

@@ -0,0 +1,9 @@
+<template>
+  <div
+    class="flex justify-center items-center p-2 bg-white dark:bg-gray-800"
+    rounded transition
+    shadow hover:shadow-md
+  >
+    <slot />
+  </div>
+</template>

package/components/bottom-menu/demo.vue

@@ -1,5 +1,5 @@
 <script lang="ts" setup>
-import type { BottomMenuItem } from '@yunlefun/vue-components'
+import type { BottomMenuItem } from '@yunlefun/vue'
 import { ref } from 'vue'
 
 const items: BottomMenuItem[] = [
@@ -23,8 +23,13 @@ const items: BottomMenuItem[] = [
   },
 ]
 
+// when using vue-router
+// import { useRouter } from 'vue-router'
+// const router = useRouter()
+// const active = computed(() => router.currentRoute.value.path)
 const active = ref('/')
 function onClick(item: BottomMenuItem) {
+  // router.push(item.to)
   active.value = item.to || ''
 }
 </script>

package/components/card/demo.vue

@@ -0,0 +1,5 @@
+<template>
+  <YlfCard>
+    内容
+  </YlfCard>
+</template>

package/components/card/index.md

@@ -0,0 +1,4 @@
+---
+title: Card
+title_zh: 卡片
+---

package/components/common/demo.vue

@@ -0,0 +1,3 @@
+<template>
+  <YlfLogo />
+</template>

package/components/common/index.md

@@ -0,0 +1,4 @@
+---
+title: Common
+title_zh: 常见组件
+---

package/dist/index.d.cts

@@ -0,0 +1,25 @@
+interface BottomMenuItem {
+    title: string;
+    /**
+     * @description icon class
+     */
+    icon: string;
+    /**
+     * @description active icon class
+     */
+    activeIcon?: string;
+    /**
+     * @description RouterLink to
+     */
+    to?: string;
+    /**
+     * onClick
+     * @returns
+     */
+    onClick?: () => void;
+}
+
+declare const _dirname: string;
+declare const componentsDir: string;
+
+export { type BottomMenuItem, _dirname, componentsDir };

package/dist/index.d.mts

@@ -0,0 +1,25 @@
+interface BottomMenuItem {
+    title: string;
+    /**
+     * @description icon class
+     */
+    icon: string;
+    /**
+     * @description active icon class
+     */
+    activeIcon?: string;
+    /**
+     * @description RouterLink to
+     */
+    to?: string;
+    /**
+     * onClick
+     * @returns
+     */
+    onClick?: () => void;
+}
+
+declare const _dirname: string;
+declare const componentsDir: string;
+
+export { type BottomMenuItem, _dirname, componentsDir };

package/dist/index.d.ts

@@ -22,4 +22,4 @@ interface BottomMenuItem {
 declare const _dirname: string;
 declare const componentsDir: string;
 
-export { BottomMenuItem, _dirname, componentsDir };
+export { type BottomMenuItem, _dirname, componentsDir };

package/package.json

@@ -1,15 +1,15 @@
 {
   "name": "@yunlefun/vue",
   "type": "module",
-  "version": "0.0.6",
+  "version": "0.0.8-beta.0",
   "description": "Components for YunLeFun",
   "exports": {
     "./components/*": "./components/*",
     "./nuxt": "./nuxt.js",
     ".": {
       "types": "./dist/index.d.ts",
-      "require": "./dist/index.cjs",
-      "import": "./dist/index.mjs"
+      "import": "./dist/index.mjs",
+      "require": "./dist/index.cjs"
     },
     "./*": "./*"
   },