feat(nuxt): add neoconfetti package and configuration

oku-ui · Jan 17, 2024 · 60df021 · 60df021
1 parent 4b46216
commit 60df021
Show file tree

Hide file tree

Showing 8 changed files with 37 additions and 4 deletions.
diff --git a/packages/box/package.json b/packages/box/package.json
@@ -26,6 +26,7 @@
     "@faker-js/faker": "^8.3.1",
     "@iconify-json/carbon": "^1.1.27",
     "@iconify-json/ph": "^1.1.9",
+    "@neoconfetti/vue": "^2.2.1",
     "@nuxtjs/color-mode": "^3.3.2",
     "@nuxtjs/i18n": "^8.0.0",
     "@nuxtjs/tailwindcss": "^6.10.3",

diff --git a/packages/nuxt/playground/app.vue b/packages/nuxt/playground/app.vue
@@ -17,6 +17,8 @@ const isDark = computed({
 </script>
 
 <template>
+  <div v-confetti="{ particleCount: 200, force: 0.3 }" />
+
   <Body class="h-full" />
   <Html class="h-full" />
   <Notivue

diff --git a/packages/nuxt/playground/nuxt.config.ts b/packages/nuxt/playground/nuxt.config.ts
@@ -60,6 +60,11 @@ export default defineNuxtConfig({
         },
         lucia: true,
         drizzle: true,
+        box: {
+          packages: {
+            neoconfetti: true,
+          },
+        },
       },
       test2: {
         S3: true,

diff --git a/packages/nuxt/playground/pergel/README.json b/packages/nuxt/playground/pergel/README.json
@@ -1,10 +1,10 @@
 {
   "pergel": {
     "comment-block-1": "This file is generated by pergel. Do not edit it manually.",
-    "comment-block-2": "Version: 0.6.1"
+    "comment-block-2": "Version: 0.7.1"
   },
   "test": {
-    "ui": {
+    "box": {
       "comment-block": "If pergel cli is installed, you can run `pergel install` automatically to install",
       "themes": {
         "authDefault": "pergel download -t=templates -j=official-auth-1 -p=test"

diff --git a/packages/nuxt/src/runtime/modules/box/index.ts b/packages/nuxt/src/runtime/modules/box/index.ts
@@ -1,5 +1,5 @@
 import { join } from 'node:path'
-import { addComponent, addImports, createResolver, installModule } from '@nuxt/kit'
+import { addComponent, addImports, addPlugin, createResolver, installModule } from '@nuxt/kit'
 import { isPackageExists } from 'local-pkg'
 
 import type { IconsPluginOptions } from '@egoist/tailwindcss-icons'
@@ -38,6 +38,7 @@ export default definePergelModule<BoxOptions, ResolvedBoxOptions>({
       i18n: false,
       pinia: false,
       vueUse: false,
+      neoconfetti: false,
     },
   },
   async setup({ nuxt, options }) {
@@ -309,6 +310,9 @@ export default definePergelModule<BoxOptions, ResolvedBoxOptions>({
     if (options.packages.vueUse)
       await installModule('@vueuse/nuxt')
 
+    if (options.packages.neoconfetti)
+      addPlugin(resolver.resolve('plugins/neoconfetti.ts'))
+
     addDownloadTemplate({
       nuxt,
       data: {

diff --git a/packages/nuxt/src/runtime/modules/box/plugins/neoconfetti.ts b/packages/nuxt/src/runtime/modules/box/plugins/neoconfetti.ts
@@ -0,0 +1,7 @@
+import { vConfetti } from '@neoconfetti/vue'
+import { defineNuxtPlugin } from '#imports'
+
+export default defineNuxtPlugin((app) => {
+  // Register the directive
+  app.vueApp.directive('v-confetti', vConfetti)
+})
diff --git a/packages/nuxt/src/runtime/modules/box/types.ts b/packages/nuxt/src/runtime/modules/box/types.ts
@@ -69,6 +69,12 @@ export interface BoxOptions extends PergelModuleOptions {
      * @see https://vueuse.org
      */
     vueUse?: boolean
+
+    /**
+     * @default true
+     * @see https://github.com/PuruVJ/neoconfetti/tree/main/packages/vue
+     */
+    neoconfetti: boolean
   }
 
 }
@@ -86,5 +92,6 @@ export interface ResolvedBoxOptions extends ResolvedPergelModuleOptions {
     i18n?: boolean
     pinia?: boolean
     vueUse?: boolean
+    neoconfetti: boolean
   }
 }
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml