@supermousejs/icon 2.2.0 → 2.3.1
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 +17 -11
- package/dist/index.d.ts +2 -2
- package/package.json +8 -4
- package/CHANGELOG.md +0 -87
- package/meta.json +0 -45
- package/src/index.ts +0 -63
- package/tsconfig.json +0 -4
- package/vite.config.ts +0 -23
package/README.md
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
# @supermousejs/icon
|
|
2
2
|
|
|
3
|
-
Renders a static SVG icon at the cursor position.
|
|
3
|
+
Renders a static SVG icon at the cursor position.
|
|
4
4
|
|
|
5
5
|
## Installation
|
|
6
6
|
|
|
@@ -8,23 +8,29 @@ Renders a static SVG icon at the cursor position. Useful for custom pointers.
|
|
|
8
8
|
pnpm add @supermousejs/icon
|
|
9
9
|
```
|
|
10
10
|
|
|
11
|
-
##
|
|
11
|
+
## Icon
|
|
12
|
+
|
|
13
|
+
Renders a static SVG icon at the cursor position.
|
|
14
|
+
|
|
15
|
+
### Usage
|
|
12
16
|
|
|
13
17
|
```ts
|
|
14
18
|
import { Supermouse } from "@supermousejs/core";
|
|
15
19
|
import { Icon } from "@supermousejs/icon";
|
|
16
|
-
|
|
17
20
|
const app = new Supermouse();
|
|
18
|
-
|
|
19
|
-
app.use(
|
|
20
|
-
Icon({
|
|
21
|
-
svg: "<svg>...</svg>", // Your SVG string
|
|
22
|
-
size: 24,
|
|
23
|
-
color: "black"
|
|
24
|
-
})
|
|
25
|
-
);
|
|
21
|
+
app.use(Icon({ svg: '<svg>...</svg>', size: 24 }));
|
|
26
22
|
```
|
|
27
23
|
|
|
24
|
+
### Options
|
|
25
|
+
|
|
26
|
+
| Name | Type | Default | Description |
|
|
27
|
+
| --- | --- | --- | --- |
|
|
28
|
+
| svg | string | undefined | SVG content string. (Required) |
|
|
29
|
+
| size | number | 24 | Size of the icon container. |
|
|
30
|
+
| color | string | 'black' | CSS color (currentColor). |
|
|
31
|
+
| opacity | number | 1 | Opacity level (0-1). |
|
|
32
|
+
| offset | [number, number] | [0, 0] | Fixed [x, y] offset from cursor center. |
|
|
33
|
+
|
|
28
34
|
## Documentation
|
|
29
35
|
|
|
30
36
|
Full documentation and interactive playground available at [supermouse](https://supermouse.js.org) or [check out the repo](https://github.com/Whitestar14/supermouse-js).
|
package/dist/index.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { SupermousePlugin } from '
|
|
2
|
-
import { ValueOrGetter } from '
|
|
1
|
+
import { SupermousePlugin } from '../packages/core/src';
|
|
2
|
+
import { ValueOrGetter } from '../packages/core/src';
|
|
3
3
|
|
|
4
4
|
export declare const Icon: (options: IconOptions) => SupermousePlugin;
|
|
5
5
|
|
package/package.json
CHANGED
|
@@ -1,20 +1,24 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@supermousejs/icon",
|
|
3
|
-
"version": "2.
|
|
3
|
+
"version": "2.3.1",
|
|
4
4
|
"main": "dist/index.umd.js",
|
|
5
5
|
"module": "dist/index.mjs",
|
|
6
6
|
"types": "dist/index.d.ts",
|
|
7
|
+
"files": [
|
|
8
|
+
"dist",
|
|
9
|
+
"README.md"
|
|
10
|
+
],
|
|
7
11
|
"author": "O.S David",
|
|
8
12
|
"url": "https://github.com/Whitestar14/supermouse-js",
|
|
9
13
|
"license": "MIT",
|
|
10
14
|
"dependencies": {
|
|
11
|
-
"@supermousejs/utils": "2.
|
|
15
|
+
"@supermousejs/utils": "2.3.1"
|
|
12
16
|
},
|
|
13
17
|
"devDependencies": {
|
|
14
|
-
"@supermousejs/core": "2.
|
|
18
|
+
"@supermousejs/core": "2.3.0"
|
|
15
19
|
},
|
|
16
20
|
"peerDependencies": {
|
|
17
|
-
"@supermousejs/core": "2.
|
|
21
|
+
"@supermousejs/core": "2.3.0"
|
|
18
22
|
},
|
|
19
23
|
"repository": {
|
|
20
24
|
"type": "git",
|
package/CHANGELOG.md
DELETED
|
@@ -1,87 +0,0 @@
|
|
|
1
|
-
# @supermousejs/icon
|
|
2
|
-
|
|
3
|
-
## 2.2.0
|
|
4
|
-
|
|
5
|
-
### Minor Changes
|
|
6
|
-
|
|
7
|
-
- 9fe1a7b: - Implemented idiomatic approach to using supermouse/utils
|
|
8
|
-
- Rewrote `applyStyles`, `setTransform` and `setStyles` to share a global cache registry
|
|
9
|
-
|
|
10
|
-
### Patch Changes
|
|
11
|
-
|
|
12
|
-
- 6d70c18: remove legacy package and update supermouse domain in readme
|
|
13
|
-
- 14fb5b6: Updated tsconfig to be reference-compliant with core, utils and zoetrope when required
|
|
14
|
-
- Updated dependencies [6d70c18]
|
|
15
|
-
- Updated dependencies [2590af3]
|
|
16
|
-
- Updated dependencies [14fb5b6]
|
|
17
|
-
- Updated dependencies [9fe1a7b]
|
|
18
|
-
- Updated dependencies [9fa6ece]
|
|
19
|
-
- @supermousejs/core@2.1.0
|
|
20
|
-
- @supermousejs/utils@2.2.0
|
|
21
|
-
|
|
22
|
-
## 2.1.1
|
|
23
|
-
|
|
24
|
-
### Patch Changes
|
|
25
|
-
|
|
26
|
-
- 67f771b: Add relevant npm metadata to package.json file
|
|
27
|
-
- Updated dependencies [67f771b]
|
|
28
|
-
- @supermousejs/utils@2.1.1
|
|
29
|
-
- @supermousejs/core@2.0.5
|
|
30
|
-
|
|
31
|
-
## 2.1.0
|
|
32
|
-
|
|
33
|
-
### Minor Changes
|
|
34
|
-
|
|
35
|
-
- 0a1652d: fixed build architecture and updated plugin metadata
|
|
36
|
-
|
|
37
|
-
### Patch Changes
|
|
38
|
-
|
|
39
|
-
- Updated dependencies [0a1652d]
|
|
40
|
-
- @supermousejs/utils@2.1.0
|
|
41
|
-
|
|
42
|
-
## 2.0.4
|
|
43
|
-
|
|
44
|
-
### Patch Changes
|
|
45
|
-
|
|
46
|
-
- 993dc67: Updated supemousejs packages with proper author, license and url descriptors to repo
|
|
47
|
-
- Updated dependencies [993dc67]
|
|
48
|
-
- @supermousejs/utils@2.0.4
|
|
49
|
-
- @supermousejs/core@2.0.4
|
|
50
|
-
|
|
51
|
-
## 2.0.3
|
|
52
|
-
|
|
53
|
-
### Patch Changes
|
|
54
|
-
|
|
55
|
-
- Updated dependencies
|
|
56
|
-
- @supermousejs/core@2.0.3
|
|
57
|
-
- @supermousejs/utils@2.0.3
|
|
58
|
-
|
|
59
|
-
## 2.0.2
|
|
60
|
-
|
|
61
|
-
### Patch Changes
|
|
62
|
-
|
|
63
|
-
- ae219a0: Update READMEs with correct link to documentation
|
|
64
|
-
- Updated dependencies [ae219a0]
|
|
65
|
-
- @supermousejs/utils@2.0.2
|
|
66
|
-
- @supermousejs/core@2.0.2
|
|
67
|
-
|
|
68
|
-
## 2.0.1
|
|
69
|
-
|
|
70
|
-
### Patch Changes
|
|
71
|
-
|
|
72
|
-
- Add minimal README.md files to packages
|
|
73
|
-
- Updated dependencies
|
|
74
|
-
- @supermousejs/utils@2.0.1
|
|
75
|
-
- @supermousejs/core@2.0.1
|
|
76
|
-
|
|
77
|
-
## 2.0.0
|
|
78
|
-
|
|
79
|
-
### Major Changes
|
|
80
|
-
|
|
81
|
-
- Initial v2.0.0 release
|
|
82
|
-
|
|
83
|
-
### Patch Changes
|
|
84
|
-
|
|
85
|
-
- Updated dependencies
|
|
86
|
-
- @supermousejs/utils@2.0.0
|
|
87
|
-
- @supermousejs/core@2.0.0
|
package/meta.json
DELETED
|
@@ -1,45 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"id": "icon",
|
|
3
|
-
"name": "Icon",
|
|
4
|
-
"package": "@supermousejs/icon",
|
|
5
|
-
"description": "Renders a static SVG icon at the cursor position.",
|
|
6
|
-
"code": "app.use(Icon({ svg: '<svg>...</svg>', size: 24 }));",
|
|
7
|
-
"icon": "context",
|
|
8
|
-
"options": [
|
|
9
|
-
{
|
|
10
|
-
"name": "svg",
|
|
11
|
-
"type": "string",
|
|
12
|
-
"default": "undefined",
|
|
13
|
-
"description": "SVG content string. (Required)",
|
|
14
|
-
"reactive": false
|
|
15
|
-
},
|
|
16
|
-
{
|
|
17
|
-
"name": "size",
|
|
18
|
-
"type": "number",
|
|
19
|
-
"default": "24",
|
|
20
|
-
"description": "Size of the icon container.",
|
|
21
|
-
"reactive": true
|
|
22
|
-
},
|
|
23
|
-
{
|
|
24
|
-
"name": "color",
|
|
25
|
-
"type": "string",
|
|
26
|
-
"default": "'black'",
|
|
27
|
-
"description": "CSS color (currentColor).",
|
|
28
|
-
"reactive": true
|
|
29
|
-
},
|
|
30
|
-
{
|
|
31
|
-
"name": "opacity",
|
|
32
|
-
"type": "number",
|
|
33
|
-
"default": "1",
|
|
34
|
-
"description": "Opacity level (0-1).",
|
|
35
|
-
"reactive": true
|
|
36
|
-
},
|
|
37
|
-
{
|
|
38
|
-
"name": "offset",
|
|
39
|
-
"type": "[number, number]",
|
|
40
|
-
"default": "[0, 0]",
|
|
41
|
-
"description": "Fixed [x, y] offset from cursor center.",
|
|
42
|
-
"reactive": false
|
|
43
|
-
}
|
|
44
|
-
]
|
|
45
|
-
}
|
package/src/index.ts
DELETED
|
@@ -1,63 +0,0 @@
|
|
|
1
|
-
import type { ValueOrGetter, Supermouse } from "@supermousejs/core";
|
|
2
|
-
import { definePlugin, normalize, dom, Layers } from "@supermousejs/utils";
|
|
3
|
-
|
|
4
|
-
export interface IconOptions {
|
|
5
|
-
name?: string;
|
|
6
|
-
isEnabled?: boolean;
|
|
7
|
-
/** SVG Content String */
|
|
8
|
-
svg: string;
|
|
9
|
-
/** Size in pixels (default 24) */
|
|
10
|
-
size?: ValueOrGetter<number>;
|
|
11
|
-
/** CSS Color (default black) */
|
|
12
|
-
color?: ValueOrGetter<string>;
|
|
13
|
-
opacity?: ValueOrGetter<number>;
|
|
14
|
-
/** Offset [x, y] from cursor center */
|
|
15
|
-
offset?: [number, number];
|
|
16
|
-
}
|
|
17
|
-
|
|
18
|
-
export const Icon = (options: IconOptions) => {
|
|
19
|
-
const getSize = normalize(options.size, 24);
|
|
20
|
-
const getOpacity = normalize(options.opacity, 1);
|
|
21
|
-
const getColor = normalize(options.color, "black");
|
|
22
|
-
const [offX, offY] = options.offset || [0, 0];
|
|
23
|
-
|
|
24
|
-
return definePlugin<HTMLDivElement, IconOptions>(
|
|
25
|
-
{
|
|
26
|
-
name: options.name || "icon",
|
|
27
|
-
|
|
28
|
-
create: () => {
|
|
29
|
-
const el = dom.createActor("div") as HTMLDivElement;
|
|
30
|
-
|
|
31
|
-
dom.applyStyles(el, {
|
|
32
|
-
zIndex: String(Layers.CURSOR),
|
|
33
|
-
display: "flex",
|
|
34
|
-
alignItems: "center",
|
|
35
|
-
justifyContent: "center"
|
|
36
|
-
});
|
|
37
|
-
|
|
38
|
-
el.innerHTML = options.svg;
|
|
39
|
-
return el;
|
|
40
|
-
},
|
|
41
|
-
|
|
42
|
-
styles: {
|
|
43
|
-
color: "color"
|
|
44
|
-
},
|
|
45
|
-
|
|
46
|
-
update: (app: Supermouse, el: HTMLDivElement) => {
|
|
47
|
-
const state = app.state;
|
|
48
|
-
const size = getSize(state);
|
|
49
|
-
|
|
50
|
-
dom.applyStyles(el, {
|
|
51
|
-
width: `${size}px`,
|
|
52
|
-
height: `${size}px`,
|
|
53
|
-
opacity: String(getOpacity(state)),
|
|
54
|
-
color: getColor(state)
|
|
55
|
-
});
|
|
56
|
-
|
|
57
|
-
const { x, y } = state.smooth;
|
|
58
|
-
dom.setTransform(el, x + offX, y + offY, 0);
|
|
59
|
-
}
|
|
60
|
-
},
|
|
61
|
-
options
|
|
62
|
-
);
|
|
63
|
-
};
|
package/tsconfig.json
DELETED
package/vite.config.ts
DELETED
|
@@ -1,23 +0,0 @@
|
|
|
1
|
-
import { defineConfig } from "vite";
|
|
2
|
-
import dts from "vite-plugin-dts";
|
|
3
|
-
import path from "path";
|
|
4
|
-
|
|
5
|
-
export default defineConfig({
|
|
6
|
-
build: {
|
|
7
|
-
lib: {
|
|
8
|
-
entry: path.resolve(__dirname, "src/index.ts"),
|
|
9
|
-
name: "SupermouseIcon",
|
|
10
|
-
fileName: (format) => (format === "es" ? "index.mjs" : "index.umd.js")
|
|
11
|
-
},
|
|
12
|
-
rollupOptions: {
|
|
13
|
-
external: ["@supermousejs/core", "@supermousejs/utils"],
|
|
14
|
-
output: {
|
|
15
|
-
globals: {
|
|
16
|
-
"@supermousejs/core": "SupermouseCore",
|
|
17
|
-
"@supermousejs/utils": "SupermouseUtils"
|
|
18
|
-
}
|
|
19
|
-
}
|
|
20
|
-
}
|
|
21
|
-
},
|
|
22
|
-
plugins: [dts({ rollupTypes: true })]
|
|
23
|
-
});
|