@tsparticles/palette-pastel-mint 4.0.0-beta.0 → 4.0.0-beta.15

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.
Files changed (21) hide show
  1. package/LICENSE +0 -1
  2. package/README.md +191 -21
  3. package/browser/browser.js +5 -0
  4. package/browser/index.js +2 -2
  5. package/browser/index.lazy.js +7 -0
  6. package/cjs/browser.js +5 -0
  7. package/cjs/index.js +2 -2
  8. package/cjs/index.lazy.js +7 -0
  9. package/esm/browser.js +5 -0
  10. package/esm/index.js +2 -2
  11. package/esm/index.lazy.js +7 -0
  12. package/package.json +18 -9
  13. package/report.html +4949 -94
  14. package/tsparticles.palette.palette-mint.js +43 -0
  15. package/tsparticles.palette.palette-mint.min.js +1 -0
  16. package/types/browser.d.ts +1 -0
  17. package/types/index.lazy.d.ts +2 -0
  18. package/428.min.js +0 -1
  19. package/dist_browser_options_js.js +0 -30
  20. package/tsparticles.palette.palette-pastel-mint.js +0 -307
  21. package/tsparticles.palette.palette-pastel-mint.min.js +0 -2
package/LICENSE CHANGED
@@ -19,4 +19,3 @@ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19
19
  LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20
20
  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21
21
  SOFTWARE.
22
-
package/README.md CHANGED
@@ -1,33 +1,203 @@
1
- # tsParticles Pastel Mint Palette
1
+ [![banner](https://particles.js.org/images/banner3.png)](https://particles.js.org)
2
2
 
3
- [tsParticles](https://github.com/tsparticles/tsparticles) palette for pastel mint.
3
+ # tsParticles Mint Palette
4
4
 
5
+ [![jsDelivr](https://data.jsdelivr.com/v1/package/npm/@tsparticles/palette-mint/badge)](https://www.jsdelivr.com/package/npm/@tsparticles/palette-mint) [![npmjs](https://badge.fury.io/js/%40tsparticles%2Fpalette-mint.svg)](https://www.npmjs.com/package/@tsparticles/palette-mint) [![npmjs](https://img.shields.io/npm/dt/%40tsparticles%2Fpalette-coloredSmokeAmber)](https://www.npmjs.com/package/@tsparticles/palette-mint) [![GitHub Sponsors](https://img.shields.io/github/sponsors/matteobruni)](https://github.com/sponsors/matteobruni)
6
+
7
+ [tsParticles](https://github.com/tsparticles/tsparticles) palette for colored smoke amber.
8
+
9
+ [![Discord](https://particles.js.org/images/discord.png)](https://discord.gg/hACwv45Hme) [![Telegram](https://particles.js.org/images/telegram.png)](https://t.me/tsparticles)
10
+
11
+ [![tsParticles Product Hunt](https://api.producthunt.com/widgets/embed-image/v1/featured.svg?post_id=186113&theme=light)](https://www.producthunt.com/posts/tsparticles?utm_source=badge-featured&utm_medium=badge&utm_souce=badge-tsparticles") <a href="https://www.buymeacoffee.com/matteobruni"><img src="https://img.buymeacoffee.com/button-api/?text=Buy me a beer&emoji=🍺&slug=matteobruni&button_colour=5F7FFF&font_colour=ffffff&font_family=Arial&outline_colour=000000&coffee_colour=FFDD00"></a>
12
+
13
+ ## Sample
14
+
15
+ [![demo](https://raw.githubusercontent.com/tsparticles/palettes/main/palettes/pastel/mint/images/sample.png)](https://particles.js.org/samples/palettes/mint)
16
+
17
+ ## Colors
18
+
19
+ <table>
20
+ <tbody>
21
+ <tr>
22
+ <td align="center">
23
+ <svg width="32" height="32" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="#1A1000"><rect width="32" height="32" fill="#1A1000" /></svg><br />
24
+ <code>#1A1000</code>
25
+ </td>
26
+ <td align="center">
27
+ <svg width="32" height="32" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="#3A2200"><rect width="32" height="32" fill="#3A2200" /></svg><br />
28
+ <code>#3A2200</code>
29
+ </td>
30
+ <td align="center">
31
+ <svg width="32" height="32" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="#6B3D00"><rect width="32" height="32" fill="#6B3D00" /></svg><br />
32
+ <code>#6B3D00</code>
33
+ </td>
34
+ <td align="center">
35
+ <svg width="32" height="32" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="#A65A00"><rect width="32" height="32" fill="#A65A00" /></svg><br />
36
+ <code>#A65A00</code>
37
+ </td>
38
+ <td align="center">
39
+ <svg width="32" height="32" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="#D98A1A"><rect width="32" height="32" fill="#D98A1A" /></svg><br />
40
+ <code>#D98A1A</code>
41
+ </td>
42
+ </tr>
43
+ <tr>
44
+ <td align="center">
45
+ <svg width="32" height="32" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="#FFC266"><rect width="32" height="32" fill="#FFC266" /></svg><br />
46
+ <code>#FFC266</code>
47
+ </td>
48
+ <td align="center">
49
+ <svg width="32" height="32" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="#090500"><rect width="32" height="32" fill="#090500" /></svg><br />
50
+ <code>#090500</code>
51
+ </td>
52
+ <td align="center">
53
+ <svg width="32" height="32" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="#F0FFF8"><rect width="32" height="32" fill="#F0FFF8" /></svg><br />
54
+ <code>#F0FFF8</code>
55
+ </td>
56
+ <td align="center">
57
+ <svg width="32" height="32" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="#BAFFC9"><rect width="32" height="32" fill="#BAFFC9" /></svg><br />
58
+ <code>#BAFFC9</code>
59
+ </td>
60
+ <td align="center">
61
+ <svg width="32" height="32" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="#B3F5E8"><rect width="32" height="32" fill="#B3F5E8" /></svg><br />
62
+ <code>#B3F5E8</code>
63
+ </td>
64
+ </tr>
65
+ <tr>
66
+ <td align="center">
67
+ <svg width="32" height="32" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="#BAFFFF"><rect width="32" height="32" fill="#BAFFFF" /></svg><br />
68
+ <code>#BAFFFF</code>
69
+ </td>
70
+ <td align="center">
71
+ <svg width="32" height="32" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="#D4FFEF"><rect width="32" height="32" fill="#D4FFEF" /></svg><br />
72
+ <code>#D4FFEF</code>
73
+ </td>
74
+ <td align="center">
75
+ <svg width="32" height="32" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="#C0F0DE"><rect width="32" height="32" fill="#C0F0DE" /></svg><br />
76
+ <code>#C0F0DE</code>
77
+ </td>
78
+ <td align="center">
79
+ <svg width="32" height="32" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="#CAFFCC"><rect width="32" height="32" fill="#CAFFCC" /></svg><br />
80
+ <code>#CAFFCC</code>
81
+ </td>
82
+ <td align="center">
83
+ <svg width="32" height="32" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="#FFA500"><rect width="32" height="32" fill="#FFA500" /></svg><br />
84
+ <code>#FFA500</code>
85
+ </td>
86
+ </tr>
87
+ <tr>
88
+ <td align="center">
89
+ <svg width="32" height="32" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="#FFEFD7"><rect width="32" height="32" fill="#FFEFD7" /></svg><br />
90
+ <code>#FFEFD7</code>
91
+ </td>
92
+ <td align="center">
93
+ <svg width="32" height="32" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="#000000"><rect width="32" height="32" fill="#000000" /></svg><br />
94
+ <code>#000000</code>
95
+ </td>
96
+ <td align="center">
97
+ <svg width="32" height="32" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="#FFFFFF"><rect width="32" height="32" fill="#FFFFFF" /></svg><br />
98
+ <code>#FFFFFF</code>
99
+ </td>
100
+ <td align="center">
101
+ <svg width="32" height="32" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="#F5F5F5"><rect width="32" height="32" fill="#F5F5F5" /></svg><br />
102
+ <code>#F5F5F5</code>
103
+ </td>
104
+ <td align="center">
105
+ <svg width="32" height="32" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="#1E1E1E"><rect width="32" height="32" fill="#1E1E1E" /></svg><br />
106
+ <code>#1E1E1E</code>
107
+ </td>
108
+ </tr>
109
+ <tr>
110
+ <td align="center">
111
+ <svg width="32" height="32" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="#252525"><rect width="32" height="32" fill="#252525" /></svg><br />
112
+ <code>#252525</code>
113
+ </td>
114
+ <td align="center">
115
+ <svg width="32" height="32" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="#E0E0E0"><rect width="32" height="32" fill="#E0E0E0" /></svg><br />
116
+ <code>#E0E0E0</code>
117
+ </td>
118
+ <td align="center">
119
+ <svg width="32" height="32" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="#A0A0A0"><rect width="32" height="32" fill="#A0A0A0" /></svg><br />
120
+ <code>#A0A0A0</code>
121
+ </td>
122
+ <td align="center">
123
+ <svg width="32" height="32" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="#404040"><rect width="32" height="32" fill="#404040" /></svg><br />
124
+ <code>#404040</code>
125
+ </td>
126
+ <td align="center">
127
+ <svg width="32" height="32" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="#1D3557"><rect width="32" height="32" fill="#1D3557" /></svg><br />
128
+ <code>#1D3557</code>
129
+ </td>
130
+ </tr>
131
+ <tr>
132
+ <td colspan="5" align="center">
133
+ <svg width="40" height="40" viewBox="0 0 40 40" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="#1A1000"><rect width="40" height="40" fill="#1A1000" /></svg><br />
134
+ <strong>Background</strong><br />
135
+ <code>#1A1000</code>
136
+ </td>
137
+ </tr>
138
+ <tr>
139
+ <td colspan="5" align="center">
140
+ <strong>Blend mode:</strong> <code>source-over</code> | <strong>Fill:</strong> <code>true</code>
141
+ </td>
142
+ </tr>
143
+ </tbody>
144
+ </table>
5
145
  ## Quick checklist
6
146
 
7
- 1. Install `@tsparticles/engine` and this package
8
- 2. Load the palette before calling `tsParticles.load(...)`
9
- 3. Set `palette: "pastel-mint"` in your options
147
+ 1. Install `@tsparticles/engine` (or use the CDN bundle below)
148
+ 2. Load a base package (for example `@tsparticles/basic`) and call `loadMintPalette` before `tsParticles.load(...)`
149
+ 3. Apply the palette plus a minimal particles configuration in your options
150
+
151
+ A palette defines colors, not complete behavior, so pair it with a runtime package and particle options.
10
152
 
11
- ## Install
153
+ ## How to use it
12
154
 
13
- ```bash
14
- pnpm add @tsparticles/palette-pastel-mint
155
+ ### CDN / Vanilla JS / jQuery
156
+
157
+ ```html
158
+ <script src="https://cdn.jsdelivr.net/npm/@tsparticles/basic@4/tsparticles.basic.bundle.min.js"></script>
159
+ <script src="https://cdn.jsdelivr.net/npm/@tsparticles/palette-mint@4/tsparticles.palette-coloredSmokeAmber.min.js"></script>
15
160
  ```
16
161
 
17
- ## Usage
162
+ ### Usage
163
+
164
+ Once the scripts are loaded you can set up `tsParticles` like this:
18
165
 
19
- ```ts
20
- import { loadSlim } from "@tsparticles/slim";
21
- import { tsParticles } from "@tsparticles/engine";
22
- import { loadPastelMintPalette } from "@tsparticles/palette-pastel-mint";
166
+ ```javascript
167
+ (async engine => {
168
+ await loadBasic(engine);
169
+ await loadMintPalette(engine);
23
170
 
24
- await loadSlim(tsParticles);
25
- await loadPastelMintPalette(tsParticles);
171
+ const options = {
172
+ particles: {
173
+ number: { value: 200 },
174
+ shape: { type: "circle" },
175
+ size: { value: { min: 10, max: 15 } },
176
+ move: {
177
+ enable: true,
178
+ speed: 2,
179
+ },
180
+ },
181
+ palette: "mint",
182
+ };
26
183
 
27
- await tsParticles.load({
28
- id: "tsparticles",
29
- options: {
30
- palette: "pastel-mint",
31
- },
32
- });
184
+ await engine.load({
185
+ id: "tsparticles",
186
+ options,
187
+ });
188
+ })(tsParticles);
33
189
  ```
190
+
191
+ #### Customization
192
+
193
+ **Important ⚠️**
194
+ You can override all the options defining the properties like in any standard `tsParticles` installation.
195
+
196
+ ### Frameworks with a tsParticles component library
197
+
198
+ Checkout the documentation in the component library repository and call the `loadMintPalette` function.
199
+
200
+ ## Related docs
201
+
202
+ - Presets and palettes catalog: <https://github.com/tsparticles/palettes>
203
+ - Main docs: <https://particles.js.org/docs/>
package/browser/browser.js ADDED
@@ -0,0 +1,5 @@
1
+ import { loadPastelMintPalette } from "./index.js";
2
+ const globalObject = globalThis;
3
+ globalObject.__tsParticlesInternals = globalObject.__tsParticlesInternals ?? {};
4
+ globalObject.loadPastelMintPalette = loadPastelMintPalette;
5
+ export * from "./index.js";
package/browser/index.js CHANGED
@@ -1,7 +1,7 @@
1
+ import { options } from "./options.js";
1
2
  const paletteName = "pastel-mint";
2
3
  export async function loadPastelMintPalette(engine) {
3
- await engine.pluginManager.register(async (e) => {
4
- const { options } = await import("./options.js");
4
+ await engine.pluginManager.register(e => {
5
5
  e.pluginManager.addPalette(paletteName, options);
6
6
  });
7
7
  }
package/browser/index.lazy.js ADDED
@@ -0,0 +1,7 @@
1
+ const paletteName = "pastel-mint";
2
+ export async function loadPastelMintPalette(engine) {
3
+ await engine.pluginManager.register(async (e) => {
4
+ const { options } = await import("./options.js");
5
+ e.pluginManager.addPalette(paletteName, options);
6
+ });
7
+ }
package/cjs/browser.js ADDED
@@ -0,0 +1,5 @@
1
+ import { loadPastelMintPalette } from "./index.js";
2
+ const globalObject = globalThis;
3
+ globalObject.__tsParticlesInternals = globalObject.__tsParticlesInternals ?? {};
4
+ globalObject.loadPastelMintPalette = loadPastelMintPalette;
5
+ export * from "./index.js";
package/cjs/index.js CHANGED
@@ -1,7 +1,7 @@
1
+ import { options } from "./options.js";
1
2
  const paletteName = "pastel-mint";
2
3
  export async function loadPastelMintPalette(engine) {
3
- await engine.pluginManager.register(async (e) => {
4
- const { options } = await import("./options.js");
4
+ await engine.pluginManager.register(e => {
5
5
  e.pluginManager.addPalette(paletteName, options);
6
6
  });
7
7
  }
package/cjs/index.lazy.js ADDED
@@ -0,0 +1,7 @@
1
+ const paletteName = "pastel-mint";
2
+ export async function loadPastelMintPalette(engine) {
3
+ await engine.pluginManager.register(async (e) => {
4
+ const { options } = await import("./options.js");
5
+ e.pluginManager.addPalette(paletteName, options);
6
+ });
7
+ }
package/esm/browser.js ADDED
@@ -0,0 +1,5 @@
1
+ import { loadPastelMintPalette } from "./index.js";
2
+ const globalObject = globalThis;
3
+ globalObject.__tsParticlesInternals = globalObject.__tsParticlesInternals ?? {};
4
+ globalObject.loadPastelMintPalette = loadPastelMintPalette;
5
+ export * from "./index.js";
package/esm/index.js CHANGED
@@ -1,7 +1,7 @@
1
+ import { options } from "./options.js";
1
2
  const paletteName = "pastel-mint";
2
3
  export async function loadPastelMintPalette(engine) {
3
- await engine.pluginManager.register(async (e) => {
4
- const { options } = await import("./options.js");
4
+ await engine.pluginManager.register(e => {
5
5
  e.pluginManager.addPalette(paletteName, options);
6
6
  });
7
7
  }
package/esm/index.lazy.js ADDED
@@ -0,0 +1,7 @@
1
+ const paletteName = "pastel-mint";
2
+ export async function loadPastelMintPalette(engine) {
3
+ await engine.pluginManager.register(async (e) => {
4
+ const { options } = await import("./options.js");
5
+ e.pluginManager.addPalette(paletteName, options);
6
+ });
7
+ }
package/package.json CHANGED
@@ -1,12 +1,12 @@
1
1
  {
2
2
  "name": "@tsparticles/palette-pastel-mint",
3
- "version": "4.0.0-beta.0",
3
+ "version": "4.0.0-beta.15",
4
4
  "description": "tsParticles pastel mint palette",
5
5
  "homepage": "https://particles.js.org",
6
6
  "repository": {
7
7
  "type": "git",
8
- "url": "git+https://github.com/tsparticles/palettes.git",
9
- "directory": "palettes/pastel/pastelMint"
8
+ "url": "git+https://github.com/tsparticles/tsparticles.git",
9
+ "directory": "palettes/pastel/mint"
10
10
  },
11
11
  "keywords": [
12
12
  "front-end",
@@ -81,8 +81,7 @@
81
81
  "url": "https://www.buymeacoffee.com/matteobruni"
82
82
  }
83
83
  ],
84
- "jsdelivr": "tsparticles.palette-pastel-mint.min.js",
85
- "unpkg": "tsparticles.palette-pastel-mint.min.js",
84
+ "sideEffects": false,
86
85
  "browser": "browser/index.js",
87
86
  "main": "cjs/index.js",
88
87
  "module": "esm/index.js",
@@ -96,13 +95,23 @@
96
95
  "umd": "./umd/index.js",
97
96
  "default": "./cjs/index.js"
98
97
  },
99
- "./package.json": "./package.json"
98
+ "./package.json": "./package.json",
99
+ "./lazy": {
100
+ "types": "./types/index.lazy.d.ts",
101
+ "browser": "./browser/index.lazy.js",
102
+ "import": "./esm/index.lazy.js",
103
+ "require": "./cjs/index.lazy.js",
104
+ "umd": "./umd/index.lazy.js",
105
+ "default": "./cjs/index.lazy.js"
106
+ }
100
107
  },
101
108
  "dependencies": {
102
- "@tsparticles/engine": "^4.0.0-beta.11"
109
+ "@tsparticles/engine": "4.0.0-beta.15"
103
110
  },
111
+ "type": "module",
112
+ "jsdelivr": "tsparticles.palette-colored-smoke-amber.min.js",
113
+ "unpkg": "tsparticles.palette-colored-smoke-amber.min.js",
104
114
  "publishConfig": {
105
115
  "access": "public"
106
- },
107
- "type": "module"
116
+ }
108
117
  }