@tsparticles/qwik 4.1.3 → 4.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +12 -0
- package/package.json +48 -19
package/README.md
CHANGED
|
@@ -70,6 +70,17 @@ export default component$(() => {
|
|
|
70
70
|
- All `<Particles />` instances wait for init completion before loading.
|
|
71
71
|
- You can choose what to load inside init (`@tsparticles/slim`, `tsparticles`, or custom plugins).
|
|
72
72
|
|
|
73
|
+
## Reactivity
|
|
74
|
+
|
|
75
|
+
The component reacts to prop changes:
|
|
76
|
+
|
|
77
|
+
- **`id`** change → destroys old container and creates a new one with the new id
|
|
78
|
+
- **`options`** change → destroys old container and creates a new one with the updated options
|
|
79
|
+
- **`url`** change → destroys old container and loads from the new remote URL
|
|
80
|
+
- **`theme`** change → applies the theme via `loadTheme` (without full reload)
|
|
81
|
+
|
|
82
|
+
On component unmount, the particles container is destroyed to prevent orphan animations.
|
|
83
|
+
|
|
73
84
|
## Props
|
|
74
85
|
|
|
75
86
|
| Prop | Type | Definition |
|
|
@@ -79,6 +90,7 @@ export default component$(() => {
|
|
|
79
90
|
| height | string | The height of the canvas. |
|
|
80
91
|
| options | object | The options of the particles instance. |
|
|
81
92
|
| url | string | The remote options url, called using an AJAX request |
|
|
93
|
+
| theme | string | The theme name to apply. Requires `@tsparticles/plugin-themes` to be loaded. Without the plugin, this prop is a safe no-op. |
|
|
82
94
|
| style | object | The style of the canvas element. |
|
|
83
95
|
| class | string | The class name of the canvas wrapper. |
|
|
84
96
|
| canvasClassName | string | The class name of the canvas. |
|
package/package.json
CHANGED
|
@@ -1,7 +1,38 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tsparticles/qwik",
|
|
3
|
-
"version": "4.
|
|
3
|
+
"version": "4.2.0",
|
|
4
4
|
"description": "Official tsParticles Qwik Component - Easily create highly customizable particle, confetti and fireworks animations and use them as animated backgrounds for your website. Ready to use components available also for Web Components, Vue.js (2.x and 3.x), Angular, Svelte, jQuery, Preact, React, Riot.js, Solid.js, Inferno.",
|
|
5
|
+
"keywords": [
|
|
6
|
+
"front-end",
|
|
7
|
+
"frontend",
|
|
8
|
+
"tsparticles",
|
|
9
|
+
"particles.js",
|
|
10
|
+
"particlesjs",
|
|
11
|
+
"particles",
|
|
12
|
+
"particle",
|
|
13
|
+
"canvas",
|
|
14
|
+
"jsparticles",
|
|
15
|
+
"xparticles",
|
|
16
|
+
"particles-js",
|
|
17
|
+
"particles-bg",
|
|
18
|
+
"particles-ts",
|
|
19
|
+
"particles.ts",
|
|
20
|
+
"animation",
|
|
21
|
+
"web",
|
|
22
|
+
"html5",
|
|
23
|
+
"css3",
|
|
24
|
+
"animated",
|
|
25
|
+
"background",
|
|
26
|
+
"confetti",
|
|
27
|
+
"fireworks",
|
|
28
|
+
"canvas-confetti",
|
|
29
|
+
"qwik",
|
|
30
|
+
"qwik-component"
|
|
31
|
+
],
|
|
32
|
+
"bugs": {
|
|
33
|
+
"url": "https://github.com/tsparticles/tsparticles/issues"
|
|
34
|
+
},
|
|
35
|
+
"homepage": "https://particles.js.org",
|
|
5
36
|
"repository": {
|
|
6
37
|
"type": "git",
|
|
7
38
|
"url": "git+https://github.com/tsparticles/tsparticles.git",
|
|
@@ -43,24 +74,22 @@
|
|
|
43
74
|
"start": "vite --open --mode ssr",
|
|
44
75
|
"qwik": "qwik"
|
|
45
76
|
},
|
|
46
|
-
"dependencies": {
|
|
47
|
-
"@tsparticles/engine": "^4.1.3"
|
|
48
|
-
},
|
|
49
77
|
"devDependencies": {
|
|
50
|
-
"@builder.io/qwik": "1.
|
|
51
|
-
"@
|
|
52
|
-
"@types/
|
|
53
|
-
"@
|
|
54
|
-
"@typescript-eslint/
|
|
55
|
-
"eslint": "
|
|
56
|
-
"eslint
|
|
57
|
-
"
|
|
58
|
-
"
|
|
59
|
-
"
|
|
60
|
-
"
|
|
61
|
-
"
|
|
62
|
-
"
|
|
63
|
-
"vite
|
|
78
|
+
"@builder.io/qwik": "^1.20.0",
|
|
79
|
+
"@tsparticles/engine": "4.2.0",
|
|
80
|
+
"@types/eslint": "^9.6.1",
|
|
81
|
+
"@types/node": "^25.9.3",
|
|
82
|
+
"@typescript-eslint/eslint-plugin": "^8.61.1",
|
|
83
|
+
"@typescript-eslint/parser": "^8.61.1",
|
|
84
|
+
"eslint": "^10.5.0",
|
|
85
|
+
"eslint-plugin-qwik": "^1.20.0",
|
|
86
|
+
"np": "^11.2.1",
|
|
87
|
+
"prettier": "^3.8.4",
|
|
88
|
+
"tsparticles": "4.2.0",
|
|
89
|
+
"typescript": "^6.0.3",
|
|
90
|
+
"undici": "^8.5.0",
|
|
91
|
+
"vite": "^8.0.16",
|
|
92
|
+
"vite-tsconfig-paths": "^6.1.1"
|
|
64
93
|
},
|
|
65
94
|
"publishConfig": {
|
|
66
95
|
"access": "public"
|
|
@@ -68,5 +97,5 @@
|
|
|
68
97
|
"peerDependencies": {
|
|
69
98
|
"@tsparticles/engine": "workspace:*"
|
|
70
99
|
},
|
|
71
|
-
"gitHead": "
|
|
100
|
+
"gitHead": "985a346686ce8d7fa09808849bef51140f1b4897"
|
|
72
101
|
}
|