@tsparticles/shape-line 3.0.0-alpha.0 → 3.0.0-beta.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 +16 -12
- package/browser/LineDrawer.js +2 -0
- package/browser/index.js +2 -2
- package/cjs/LineDrawer.js +2 -0
- package/cjs/index.js +2 -13
- package/esm/LineDrawer.js +2 -0
- package/esm/index.js +2 -2
- package/package.json +6 -5
- package/report.html +4 -4
- package/tsparticles.shape.line.js +6 -4
- package/tsparticles.shape.line.min.js +1 -1
- package/tsparticles.shape.line.min.js.LICENSE.txt +1 -8
- package/types/index.d.ts +1 -1
- package/umd/LineDrawer.js +2 -0
- package/umd/index.js +2 -2
package/README.md
CHANGED
|
@@ -2,9 +2,9 @@
|
|
|
2
2
|
|
|
3
3
|
# tsParticles Line Shape
|
|
4
4
|
|
|
5
|
-
[](https://www.jsdelivr.com/package/npm/@tsparticles/shape-line)
|
|
6
|
+
[](https://www.npmjs.com/package/@tsparticles/shape-line)
|
|
7
|
+
[](https://www.npmjs.com/package/@tsparticles/shape-line) [](https://github.com/sponsors/matteobruni)
|
|
8
8
|
|
|
9
9
|
[tsParticles](https://github.com/matteobruni/tsparticles) additional line shape.
|
|
10
10
|
|
|
@@ -26,7 +26,7 @@ Once the scripts are loaded you can set up `tsParticles` and the shape like this
|
|
|
26
26
|
|
|
27
27
|
```javascript
|
|
28
28
|
(async () => {
|
|
29
|
-
await loadLineShape();
|
|
29
|
+
await loadLineShape(tsParticles);
|
|
30
30
|
|
|
31
31
|
await tsParticles.load({
|
|
32
32
|
id: "tsparticles",
|
|
@@ -43,29 +43,33 @@ Once the scripts are loaded you can set up `tsParticles` and the shape like this
|
|
|
43
43
|
This package is compatible also with ES or CommonJS modules, firstly this needs to be installed, like this:
|
|
44
44
|
|
|
45
45
|
```shell
|
|
46
|
-
$ npm install tsparticles
|
|
46
|
+
$ npm install @tsparticles/shape-line
|
|
47
47
|
```
|
|
48
48
|
|
|
49
49
|
or
|
|
50
50
|
|
|
51
51
|
```shell
|
|
52
|
-
$ yarn add tsparticles
|
|
52
|
+
$ yarn add @tsparticles/shape-line
|
|
53
53
|
```
|
|
54
54
|
|
|
55
55
|
Then you need to import it in the app, like this:
|
|
56
56
|
|
|
57
57
|
```javascript
|
|
58
|
-
const { tsParticles } = require("tsparticles
|
|
59
|
-
const { loadLineShape } = require("tsparticles
|
|
58
|
+
const { tsParticles } = require("@tsparticles/engine");
|
|
59
|
+
const { loadLineShape } = require("@tsparticles/shape-line");
|
|
60
60
|
|
|
61
|
-
|
|
61
|
+
(async () => {
|
|
62
|
+
await loadLineShape(tsParticles);
|
|
63
|
+
})();
|
|
62
64
|
```
|
|
63
65
|
|
|
64
66
|
or
|
|
65
67
|
|
|
66
68
|
```javascript
|
|
67
|
-
import { tsParticles } from "tsparticles
|
|
68
|
-
import { loadLineShape } from "tsparticles
|
|
69
|
+
import { tsParticles } from "@tsparticles/engine";
|
|
70
|
+
import { loadLineShape } from "@tsparticles/shape-line";
|
|
69
71
|
|
|
70
|
-
|
|
72
|
+
(async () => {
|
|
73
|
+
await loadLineShape(tsParticles);
|
|
74
|
+
})();
|
|
71
75
|
```
|
package/browser/LineDrawer.js
CHANGED
package/browser/index.js
CHANGED
package/cjs/LineDrawer.js
CHANGED
|
@@ -3,8 +3,10 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
3
3
|
exports.LineDrawer = void 0;
|
|
4
4
|
class LineDrawer {
|
|
5
5
|
draw(context, particle, radius) {
|
|
6
|
+
const shapeData = particle.shapeData;
|
|
6
7
|
context.moveTo(-radius / 2, 0);
|
|
7
8
|
context.lineTo(radius / 2, 0);
|
|
9
|
+
context.lineCap = shapeData?.cap ?? "butt";
|
|
8
10
|
}
|
|
9
11
|
getSidesCount() {
|
|
10
12
|
return 1;
|
package/cjs/index.js
CHANGED
|
@@ -1,19 +1,8 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
|
|
3
|
-
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
|
|
4
|
-
return new (P || (P = Promise))(function (resolve, reject) {
|
|
5
|
-
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
|
|
6
|
-
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
|
|
7
|
-
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
|
|
8
|
-
step((generator = generator.apply(thisArg, _arguments || [])).next());
|
|
9
|
-
});
|
|
10
|
-
};
|
|
11
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
12
3
|
exports.loadLineShape = void 0;
|
|
13
4
|
const LineDrawer_1 = require("./LineDrawer");
|
|
14
|
-
function loadLineShape(engine) {
|
|
15
|
-
|
|
16
|
-
yield engine.addShape("line", new LineDrawer_1.LineDrawer());
|
|
17
|
-
});
|
|
5
|
+
async function loadLineShape(engine, refresh = true) {
|
|
6
|
+
await engine.addShape("line", new LineDrawer_1.LineDrawer(), refresh);
|
|
18
7
|
}
|
|
19
8
|
exports.loadLineShape = loadLineShape;
|
package/esm/LineDrawer.js
CHANGED
package/esm/index.js
CHANGED
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tsparticles/shape-line",
|
|
3
|
-
"version": "3.0.0-
|
|
3
|
+
"version": "3.0.0-beta.0",
|
|
4
4
|
"description": "tsParticles line shape",
|
|
5
5
|
"homepage": "https://particles.js.org",
|
|
6
6
|
"repository": {
|
|
@@ -45,10 +45,11 @@
|
|
|
45
45
|
"unpkg": "tsparticles.shape.line.min.js",
|
|
46
46
|
"module": "esm/index.js",
|
|
47
47
|
"types": "types/index.d.ts",
|
|
48
|
+
"sideEffects": false,
|
|
49
|
+
"dependencies": {
|
|
50
|
+
"@tsparticles/engine": "^3.0.0-beta.0"
|
|
51
|
+
},
|
|
48
52
|
"publishConfig": {
|
|
49
53
|
"access": "public"
|
|
50
|
-
},
|
|
51
|
-
"dependencies": {
|
|
52
|
-
"@tsparticles/engine": "^3.0.0-alpha.0"
|
|
53
54
|
}
|
|
54
|
-
}
|
|
55
|
+
}
|