Skip to content

Commit 8b12d56

Browse files
matteobrunimatteobruni
committed
feat: adding vue-particles tag
1 parent 005f447 commit 8b12d56

File tree

10 files changed

+309
-919
lines changed

10 files changed

+309
-919
lines changed

‎apps/nuxt3/app.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
<template>
22
<div>
33
<NuxtWelcome />
4-
<Particles
4+
<vue-particles
55
id="tsparticles"
66
:options="options"
77
:particles-init="particlesInit"

‎apps/vue3/package.json‎

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -15,26 +15,26 @@
1515
"tsparticles": "^2.9.3",
1616
"tsparticles-demo-configs": "^2.9.3",
1717
"tsparticles-engine": "^2.9.3",
18-
"vue": "^3.2.47",
19-
"vue-router": "^4.1.6",
18+
"vue": "^3.3.4",
19+
"vue-router": "^4.2.1",
2020
"vue3-particles": "^2.9.3"
2121
},
2222
"devDependencies": {
23-
"@rushstack/eslint-patch": "^1.2.0",
24-
"@tsconfig/node18": "^2.0.0",
25-
"@types/node": "^20.1.0",
26-
"@vitejs/plugin-vue": "^4.2.1",
23+
"@rushstack/eslint-patch": "^1.3.0",
24+
"@tsconfig/node18": "^2.0.1",
25+
"@types/node": "^20.2.3",
26+
"@vitejs/plugin-vue": "^4.2.3",
2727
"@vitejs/plugin-vue-jsx": "^3.0.1",
2828
"@vue/eslint-config-prettier": "^7.1.0",
2929
"@vue/eslint-config-typescript": "^11.0.3",
3030
"@vue/tsconfig": "^0.4.0",
31-
"eslint": "^8.40.0",
32-
"eslint-plugin-vue": "^9.11.1",
33-
"minimatch": "^9.0.0",
31+
"eslint": "^8.41.0",
32+
"eslint-plugin-vue": "^9.14.0",
33+
"minimatch": "^9.0.1",
3434
"npm-run-all": "^4.1.5",
3535
"prettier": "^2.8.8",
3636
"typescript": "^5.0.4",
37-
"vite": "^4.3.5",
38-
"vue-tsc": "^1.6.4"
37+
"vite": "^4.3.8",
38+
"vue-tsc": "^1.6.5"
3939
}
4040
}

‎apps/vue3/src/App.vue‎

Lines changed: 58 additions & 58 deletions
Original file line numberDiff line numberDiff line change
@@ -13,86 +13,86 @@ const particlesInit = async (engine: Engine) => {
1313
</script>
1414

1515
<template>
16-
<header>
17-
<img
18-
alt="Vue logo"
19-
class="logo"
20-
src="./assets/logo.svg"
21-
width="125"
22-
height="125"
23-
/>
24-
25-
<div class="wrapper">
26-
<HelloWorld msg="You did it!" />
27-
</div>
28-
</header>
29-
30-
<main>
31-
<TheWelcome />
32-
33-
<Particles id="tsparticles" :options="options" :particlesInit="particlesInit" />
34-
</main>
16+
<header>
17+
<img
18+
alt="Vue logo"
19+
class="logo"
20+
src="./assets/logo.svg"
21+
width="125"
22+
height="125"
23+
/>
24+
25+
<div class="wrapper">
26+
<HelloWorld msg="You did it!" />
27+
</div>
28+
</header>
29+
30+
<main>
31+
<TheWelcome />
32+
33+
<vue-particles id="tsparticles" :options="options" :particlesInit="particlesInit" />
34+
</main>
3535
</template>
3636

3737
<style>
3838
@import "./assets/base.css";
3939
4040
#app {
41-
max-width: 1280px;
42-
margin: 0 auto;
43-
padding: 2rem;
41+
max-width: 1280px;
42+
margin: 0 auto;
43+
padding: 2rem;
4444
45-
font-weight: normal;
45+
font-weight: normal;
4646
}
4747
4848
header {
49-
line-height: 1.5;
49+
line-height: 1.5;
5050
}
5151
5252
.logo {
53-
display: block;
54-
margin: 0 auto 2rem;
53+
display: block;
54+
margin: 0 auto 2rem;
5555
}
5656
5757
a,
5858
.green {
59-
text-decoration: none;
60-
color: hsla(160, 100%, 37%, 1);
61-
transition: 0.4s;
59+
text-decoration: none;
60+
color: hsla(160, 100%, 37%, 1);
61+
transition: 0.4s;
6262
}
6363
6464
@media (hover: hover) {
65-
a:hover {
66-
background-color: hsla(160, 100%, 37%, 0.2);
67-
}
65+
a:hover {
66+
background-color: hsla(160, 100%, 37%, 0.2);
67+
}
6868
}
6969
7070
@media (min-width: 1024px) {
71-
body {
72-
display: flex;
73-
place-items: center;
74-
}
75-
76-
#app {
77-
display: grid;
78-
grid-template-columns: 1fr 1fr;
79-
padding: 0 2rem;
80-
}
81-
82-
header {
83-
display: flex;
84-
place-items: center;
85-
padding-right: calc(var(--section-gap) / 2);
86-
}
87-
88-
header .wrapper {
89-
display: flex;
90-
place-items: flex-start;
91-
flex-wrap: wrap;
92-
}
93-
94-
.logo {
95-
margin: 0 2rem 0 0;
96-
}
71+
body {
72+
display: flex;
73+
place-items: center;
74+
}
75+
76+
#app {
77+
display: grid;
78+
grid-template-columns: 1fr 1fr;
79+
padding: 0 2rem;
80+
}
81+
82+
header {
83+
display: flex;
84+
place-items: center;
85+
padding-right: calc(var(--section-gap) / 2);
86+
}
87+
88+
header .wrapper {
89+
display: flex;
90+
place-items: flex-start;
91+
flex-wrap: wrap;
92+
}
93+
94+
.logo {
95+
margin: 0 2rem 0 0;
96+
}
9797
}
9898
</style>

‎components/vue3-alt/README.md‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -29,14 +29,14 @@ createApp(App).use(Particles);
2929
```html
3030
<template>
3131
<div id="app">
32-
<Particles
32+
<vue-particles
3333
id="tsparticles"
3434
:particlesInit="particlesInit"
3535
:particlesLoaded="particlesLoaded"
3636
url="http://foo.bar/particles.json"
3737
/>
3838

39-
<Particles
39+
<vue-particles
4040
id="tsparticles"
4141
:particlesInit="particlesInit"
4242
:particlesLoaded="particlesLoaded"

‎components/vue3-alt/package.json‎

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -95,25 +95,25 @@
9595
"prettier": "@tsparticles/prettier-config",
9696
"dependencies": {
9797
"tsparticles-engine": "^2.9.3",
98-
"vue": "^3.2.47"
98+
"vue": "^3.3.4"
9999
},
100100
"devDependencies": {
101-
"@rushstack/eslint-patch": "^1.2.0",
102-
"@tsconfig/node18": "^2.0.0",
101+
"@rushstack/eslint-patch": "^1.3.0",
102+
"@tsconfig/node18": "^2.0.1",
103103
"@tsparticles/prettier-config": "^1.9.0",
104-
"@types/node": "^20.1.0",
105-
"@vitejs/plugin-vue": "^4.2.1",
104+
"@types/node": "^20.2.3",
105+
"@vitejs/plugin-vue": "^4.2.3",
106106
"@vitejs/plugin-vue-jsx": "^3.0.1",
107107
"@vue/eslint-config-prettier": "^7.1.0",
108108
"@vue/eslint-config-typescript": "^11.0.3",
109109
"@vue/tsconfig": "^0.4.0",
110-
"eslint": "^8.40.0",
111-
"eslint-plugin-vue": "^9.11.1",
110+
"eslint": "^8.41.0",
111+
"eslint-plugin-vue": "^9.14.0",
112112
"prettier": "^2.8.8",
113113
"typescript": "^5.0.4",
114-
"vite": "^4.3.5",
114+
"vite": "^4.3.8",
115115
"vite-plugin-dts": "^2.3.0",
116-
"vue-tsc": "^1.6.4"
116+
"vue-tsc": "^1.6.5"
117117
},
118118
"main": "dist/particles.vue3.umd.js",
119119
"module": "dist/particles.vue3.es.js",

‎components/vue3-alt/src/components/index.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@ import particles from "./Particles.vue";
33

44
const VueParticles = (app: App) => {
55
app.component("Particles", particles);
6+
app.component("vue-particles", particles);
67
};
78

89
export { particles as ParticlesComponent };

‎components/vue3/README.md‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -29,14 +29,14 @@ createApp(App).use(Particles);
2929
```html
3030
<template>
3131
<div id="app">
32-
<Particles
32+
<vue-particles
3333
id="tsparticles"
3434
:particlesInit="particlesInit"
3535
:particlesLoaded="particlesLoaded"
3636
url="http://foo.bar/particles.json"
3737
/>
3838

39-
<Particles
39+
<vue-particles
4040
id="tsparticles"
4141
:particlesInit="particlesInit"
4242
:particlesLoaded="particlesLoaded"

‎components/vue3/package.json‎

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -95,25 +95,25 @@
9595
"prettier": "@tsparticles/prettier-config",
9696
"dependencies": {
9797
"tsparticles-engine": "^2.9.3",
98-
"vue": "^3.2.47"
98+
"vue": "^3.3.4"
9999
},
100100
"devDependencies": {
101-
"@rushstack/eslint-patch": "^1.2.0",
102-
"@tsconfig/node18": "^2.0.0",
101+
"@rushstack/eslint-patch": "^1.3.0",
102+
"@tsconfig/node18": "^2.0.1",
103103
"@tsparticles/prettier-config": "^1.9.0",
104-
"@types/node": "^20.1.0",
105-
"@vitejs/plugin-vue": "^4.2.1",
104+
"@types/node": "^20.2.3",
105+
"@vitejs/plugin-vue": "^4.2.3",
106106
"@vitejs/plugin-vue-jsx": "^3.0.1",
107107
"@vue/eslint-config-prettier": "^7.1.0",
108108
"@vue/eslint-config-typescript": "^11.0.3",
109109
"@vue/tsconfig": "^0.4.0",
110-
"eslint": "^8.40.0",
111-
"eslint-plugin-vue": "^9.11.1",
110+
"eslint": "^8.41.0",
111+
"eslint-plugin-vue": "^9.14.0",
112112
"prettier": "^2.8.8",
113113
"typescript": "^5.0.4",
114-
"vite": "^4.3.5",
114+
"vite": "^4.3.8",
115115
"vite-plugin-dts": "^2.3.0",
116-
"vue-tsc": "^1.6.4"
116+
"vue-tsc": "^1.6.5"
117117
},
118118
"main": "dist/vue3-particles.umd.js",
119119
"module": "dist/vue3-particles.es.js",

‎components/vue3/src/components/index.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@ import particles from "./Particles.vue";
33

44
const VueParticles = (app: App) => {
55
app.component("Particles", particles);
6+
app.component("vue-particles", particles);
67
};
78

89
export { particles as ParticlesComponent };

0 commit comments

Comments
 (0)