feat: preparing v3

README.md

@@ -1,8 +1,8 @@
 [![banner](https://particles.js.org/images/banner3.png)](https://particles.js.org)
 
-# vue2-particles
+# @tsparticles/vue2
 
-[![npm](https://img.shields.io/npm/v/vue2-particles)](https://www.npmjs.com/package/vue2-particles) [![npm](https://img.shields.io/npm/dm/vue2-particles)](https://www.npmjs.com/package/vue2-particles) [![GitHub Sponsors](https://img.shields.io/github/sponsors/matteobruni)](https://github.com/sponsors/matteobruni)
+[![npm](https://img.shields.io/npm/v/@tsparticles/vue)](https://www.npmjs.com/package/@tsparticles/vue) [![npm](https://img.shields.io/npm/dm/vue2-particles)](https://www.npmjs.com/package/vue2-particles) [![GitHub Sponsors](https://img.shields.io/github/sponsors/matteobruni)](https://github.com/sponsors/matteobruni)
 
 Official [tsParticles](https://github.com/matteobruni/tsparticles) VueJS component
 
@@ -13,13 +13,13 @@ Official [tsParticles](https://github.com/matteobruni/tsparticles) VueJS compone
 ## Installation
 
 ```shell script
-yarn add vue2-particles
+yarn add @tsparticles/vue2
 ```
 
 ## Usage
 
 ```javascript
-import Particles from "vue2-particles";
+import Particles from "@tsparticles/vue2";
 
 Vue.use(Particles);
 ```
@@ -122,7 +122,7 @@ Vue.use(Particles);
 
 ```javascript
 //import { loadFull } from "tsparticles"; // if you are going to use `loadFull`, install the "tsparticles" package too.
-import { loadSlim } from "tsparticles-slim"; // if you are going to use `loadSlim`, install the "tsparticles-slim" package too.
+import { loadSlim } from "@tsparticles/slim"; // if you are going to use `loadSlim`, install the "@tsparticles/slim" package too.
 
 const particlesInit = async engine => {
     //await loadFull(engine);
@@ -140,7 +140,7 @@ If TypeScript returns error while importing/using Particles plugin try adding th
 code:
 
 ```typescript
-declare module "vue2-particles";
+declare module "@tsparticles/vue2";
 ```
 
 ## Demos

apps/nuxt2/components/Tutorial.vue

@@ -75,7 +75,7 @@
           >. Have fun!
         </p>
       </div>
-      <Particles
+      <vue-particles
         id="tsparticles"
         :options="options"
         :particles-init="particlesInit"

apps/nuxt2/nuxt.config.js

@@ -45,6 +45,6 @@ export default {
 
   // Build Configuration: https://go.nuxtjs.dev/config-build
   build: {
-    transpile: ['tsparticles', 'tsparticles-engine'],
+    transpile: ['tsparticles', '@tsparticles/engine'],
   },
 }

apps/nuxt2/package.json

@@ -16,12 +16,12 @@
   "dependencies": {
     "core-js": "^3.32.2",
     "nuxt": "^2.17.1",
-    "tsparticles": "^2.12.0",
-    "tsparticles-engine": "^2.12.0",
+    "tsparticles": "^3.0.2",
+    "@tsparticles/engine": "^3.0.2",
     "vue": "^2.7.14",
     "vue-server-renderer": "^2.7.14",
     "vue-template-compiler": "^2.7.14",
-    "vue2-particles": "^2.12.0"
+    "@tsparticles/vue2": "^2.12.0"
   },
   "devDependencies": {
     "@babel/core": "^7.22.19",

apps/nuxt2/plugins/shim-vue.d.ts

@@ -3,4 +3,4 @@ declare module '*.vue' {
   export default Vue
 }
 
-declare module 'vue2-particles'
+declare module '@tsparticles/vue2'

apps/nuxt2/plugins/vue2-particles.ts

@@ -1,4 +1,4 @@
 import Vue from 'vue'
-import Particles from 'vue2-particles'
+import Particles from '@tsparticles/vue2'
 
 Vue.use(Particles)

apps/vue2/package.json

@@ -1,5 +1,5 @@
 {
-  "name": "vue2-particles-demo",
+  "name": "@tsparticles/vue2-demo",
   "private": true,
   "version": "2.12.0",
   "description": "VueJS Demo",
@@ -21,13 +21,13 @@
     "url": "https://github.com/tsparticles/vue2/issues"
   },
   "dependencies": {
-    "tsparticles": "^2.12.0",
-    "tsparticles-demo-configs": "^2.12.0",
-    "tsparticles-engine": "^2.12.0",
+    "tsparticles": "^3.0.2",
+    "@tsparticles/configs": "^3.0.2",
+    "@tsparticles/engine": "^3.0.2",
     "vue": "^2.7.14",
     "vue-class-component": "^7.2.6",
     "vue-property-decorator": "^9.1.2",
-    "vue2-particles": "^2.12.0"
+    "@tsparticles/vue2": "^2.12.0"
   },
   "devDependencies": {
     "@babel/core": "^7.22.19",

apps/vue2/src/App.vue

@@ -7,9 +7,9 @@
 
 <script lang="ts">
 import { Vue } from "vue-property-decorator";
-import type { Engine } from "tsparticles-engine";
+import { type Engine } from "@tsparticles/engine";
 import { loadFull } from "tsparticles";
-import configs from "tsparticles-demo-configs";
+import configs from "@tsparticles/configs";
 
 export default class App extends Vue {
   options = configs.basic;

apps/vue2/src/main.ts

@@ -1,6 +1,6 @@
 import Vue from 'vue'
 import App from './App.vue'
-import Particles from "vue2-particles";
+import Particles from "@tsparticles/vue2";
 
 Vue.config.productionTip = false
 

apps/vue2/src/shims-vue.d.ts

@@ -3,4 +3,4 @@ declare module '*.vue' {
   export default Vue
 }
 
-declare module "vue2-particles";
+declare module "@tsparticles/vue2";