@supermousejs/states 2.0.1 → 2.0.2
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/CHANGELOG.md +9 -0
- package/README.md +4 -0
- package/package.json +3 -3
- package/src/index.ts +96 -96
- package/tsconfig.json +17 -17
- package/vite.config.ts +21 -21
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,14 @@
|
|
|
1
1
|
# @supermousejs/states
|
|
2
2
|
|
|
3
|
+
## 2.0.2
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- ae219a0: Update READMEs with correct link to documentation
|
|
8
|
+
- Updated dependencies [ae219a0]
|
|
9
|
+
- @supermousejs/utils@2.0.2
|
|
10
|
+
- @supermousejs/core@2.0.2
|
|
11
|
+
|
|
3
12
|
## 2.0.1
|
|
4
13
|
|
|
5
14
|
### Patch Changes
|
package/README.md
CHANGED
|
@@ -38,3 +38,7 @@ app.use(States({
|
|
|
38
38
|
<div data-supermouse-state="hover">Hover me</div>
|
|
39
39
|
<div data-supermouse-state="info" data-supermouse-text="Hello">Info</div>
|
|
40
40
|
```
|
|
41
|
+
|
|
42
|
+
## Documentation
|
|
43
|
+
|
|
44
|
+
Full documentation and interactive playground available at [supermouse](https://supermouse.vercel.app) or [check out the repo](https://github.com/Whitestar14/supermouse-js).
|
package/package.json
CHANGED
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@supermousejs/states",
|
|
3
|
-
"version": "2.0.
|
|
3
|
+
"version": "2.0.2",
|
|
4
4
|
"main": "dist/index.umd.js",
|
|
5
5
|
"module": "dist/index.mjs",
|
|
6
6
|
"types": "dist/index.d.ts",
|
|
7
7
|
"dependencies": {
|
|
8
|
-
"@supermousejs/core": "2.0.
|
|
9
|
-
"@supermousejs/utils": "2.0.
|
|
8
|
+
"@supermousejs/core": "2.0.2",
|
|
9
|
+
"@supermousejs/utils": "2.0.2"
|
|
10
10
|
},
|
|
11
11
|
"devDependencies": {},
|
|
12
12
|
"peerDependencies": {},
|
package/src/index.ts
CHANGED
|
@@ -1,97 +1,97 @@
|
|
|
1
|
-
import { definePlugin } from '@supermousejs/utils';
|
|
2
|
-
|
|
3
|
-
export interface StatesOptions {
|
|
4
|
-
name?: string;
|
|
5
|
-
isEnabled?: boolean;
|
|
6
|
-
/** The default state (active when nothing else is hovered). */
|
|
7
|
-
default: string[];
|
|
8
|
-
/** Map of state names to lists of plugin names to enable. */
|
|
9
|
-
states: Record<string, string[]>;
|
|
10
|
-
/** CSS selector attribute to trigger state change. Default 'data-supermouse-state'. */
|
|
11
|
-
attribute?: string;
|
|
12
|
-
}
|
|
13
|
-
|
|
14
|
-
export const States = (options: StatesOptions) => {
|
|
15
|
-
const attr = options.attribute || 'data-supermouse-state';
|
|
16
|
-
|
|
17
|
-
// Cache the relationships for fast lookups
|
|
18
|
-
const allManagedPlugins = new Set<string>(); // All plugins mentioned in 'states'
|
|
19
|
-
const defaultPlugins = new Set(options.default);
|
|
20
|
-
|
|
21
|
-
// Populate the set of managed plugins (excluding defaults for now)
|
|
22
|
-
Object.values(options.states).forEach(list => {
|
|
23
|
-
list.forEach(p => allManagedPlugins.add(p));
|
|
24
|
-
});
|
|
25
|
-
|
|
26
|
-
let currentState = 'default';
|
|
27
|
-
let hasInitialized = false;
|
|
28
|
-
|
|
29
|
-
return definePlugin({
|
|
30
|
-
name: 'states',
|
|
31
|
-
// High priority: Run BEFORE visual plugins so they know if they are enabled/disabled this frame
|
|
32
|
-
priority: -999,
|
|
33
|
-
|
|
34
|
-
install(app) {
|
|
35
|
-
// Register the trigger attribute
|
|
36
|
-
app.registerHoverTarget(`[${attr}]`);
|
|
37
|
-
},
|
|
38
|
-
|
|
39
|
-
update(app) {
|
|
40
|
-
// --- INITIALIZATION STEP ---
|
|
41
|
-
// We do this in the first update tick to ensure all other plugins
|
|
42
|
-
// have been registered via .use(), regardless of order.
|
|
43
|
-
if (!hasInitialized) {
|
|
44
|
-
// 1. Disable all "Special State" plugins initially
|
|
45
|
-
allManagedPlugins.forEach(name => {
|
|
46
|
-
if (!defaultPlugins.has(name)) {
|
|
47
|
-
app.disablePlugin(name);
|
|
48
|
-
}
|
|
49
|
-
});
|
|
50
|
-
|
|
51
|
-
// 2. Ensure default plugins are enabled
|
|
52
|
-
defaultPlugins.forEach(name => {
|
|
53
|
-
app.enablePlugin(name);
|
|
54
|
-
});
|
|
55
|
-
|
|
56
|
-
hasInitialized = true;
|
|
57
|
-
}
|
|
58
|
-
|
|
59
|
-
// --- STANDARD LOGIC ---
|
|
60
|
-
const target = app.state.hoverTarget;
|
|
61
|
-
let nextState = 'default';
|
|
62
|
-
|
|
63
|
-
// 1. Determine Desired State
|
|
64
|
-
if (target && target.hasAttribute(attr)) {
|
|
65
|
-
const val = target.getAttribute(attr);
|
|
66
|
-
if (val && options.states[val]) {
|
|
67
|
-
nextState = val;
|
|
68
|
-
}
|
|
69
|
-
}
|
|
70
|
-
|
|
71
|
-
// 2. Switch State (Only if changed)
|
|
72
|
-
if (nextState !== currentState) {
|
|
73
|
-
|
|
74
|
-
// A. Determine which plugins should be active
|
|
75
|
-
const activePlugins = nextState === 'default'
|
|
76
|
-
? options.default
|
|
77
|
-
: options.states[nextState];
|
|
78
|
-
|
|
79
|
-
// B. Apply changes
|
|
80
|
-
// Note: We combine default + managed to ensure we cover everyone involved
|
|
81
|
-
const involved = new Set([...defaultPlugins, ...allManagedPlugins]);
|
|
82
|
-
|
|
83
|
-
involved.forEach(pluginName => {
|
|
84
|
-
const shouldBeActive = activePlugins.includes(pluginName);
|
|
85
|
-
|
|
86
|
-
if (shouldBeActive) {
|
|
87
|
-
app.enablePlugin(pluginName);
|
|
88
|
-
} else {
|
|
89
|
-
app.disablePlugin(pluginName);
|
|
90
|
-
}
|
|
91
|
-
});
|
|
92
|
-
|
|
93
|
-
currentState = nextState;
|
|
94
|
-
}
|
|
95
|
-
}
|
|
96
|
-
}, options);
|
|
1
|
+
import { definePlugin } from '@supermousejs/utils';
|
|
2
|
+
|
|
3
|
+
export interface StatesOptions {
|
|
4
|
+
name?: string;
|
|
5
|
+
isEnabled?: boolean;
|
|
6
|
+
/** The default state (active when nothing else is hovered). */
|
|
7
|
+
default: string[];
|
|
8
|
+
/** Map of state names to lists of plugin names to enable. */
|
|
9
|
+
states: Record<string, string[]>;
|
|
10
|
+
/** CSS selector attribute to trigger state change. Default 'data-supermouse-state'. */
|
|
11
|
+
attribute?: string;
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
export const States = (options: StatesOptions) => {
|
|
15
|
+
const attr = options.attribute || 'data-supermouse-state';
|
|
16
|
+
|
|
17
|
+
// Cache the relationships for fast lookups
|
|
18
|
+
const allManagedPlugins = new Set<string>(); // All plugins mentioned in 'states'
|
|
19
|
+
const defaultPlugins = new Set(options.default);
|
|
20
|
+
|
|
21
|
+
// Populate the set of managed plugins (excluding defaults for now)
|
|
22
|
+
Object.values(options.states).forEach(list => {
|
|
23
|
+
list.forEach(p => allManagedPlugins.add(p));
|
|
24
|
+
});
|
|
25
|
+
|
|
26
|
+
let currentState = 'default';
|
|
27
|
+
let hasInitialized = false;
|
|
28
|
+
|
|
29
|
+
return definePlugin({
|
|
30
|
+
name: 'states',
|
|
31
|
+
// High priority: Run BEFORE visual plugins so they know if they are enabled/disabled this frame
|
|
32
|
+
priority: -999,
|
|
33
|
+
|
|
34
|
+
install(app) {
|
|
35
|
+
// Register the trigger attribute
|
|
36
|
+
app.registerHoverTarget(`[${attr}]`);
|
|
37
|
+
},
|
|
38
|
+
|
|
39
|
+
update(app) {
|
|
40
|
+
// --- INITIALIZATION STEP ---
|
|
41
|
+
// We do this in the first update tick to ensure all other plugins
|
|
42
|
+
// have been registered via .use(), regardless of order.
|
|
43
|
+
if (!hasInitialized) {
|
|
44
|
+
// 1. Disable all "Special State" plugins initially
|
|
45
|
+
allManagedPlugins.forEach(name => {
|
|
46
|
+
if (!defaultPlugins.has(name)) {
|
|
47
|
+
app.disablePlugin(name);
|
|
48
|
+
}
|
|
49
|
+
});
|
|
50
|
+
|
|
51
|
+
// 2. Ensure default plugins are enabled
|
|
52
|
+
defaultPlugins.forEach(name => {
|
|
53
|
+
app.enablePlugin(name);
|
|
54
|
+
});
|
|
55
|
+
|
|
56
|
+
hasInitialized = true;
|
|
57
|
+
}
|
|
58
|
+
|
|
59
|
+
// --- STANDARD LOGIC ---
|
|
60
|
+
const target = app.state.hoverTarget;
|
|
61
|
+
let nextState = 'default';
|
|
62
|
+
|
|
63
|
+
// 1. Determine Desired State
|
|
64
|
+
if (target && target.hasAttribute(attr)) {
|
|
65
|
+
const val = target.getAttribute(attr);
|
|
66
|
+
if (val && options.states[val]) {
|
|
67
|
+
nextState = val;
|
|
68
|
+
}
|
|
69
|
+
}
|
|
70
|
+
|
|
71
|
+
// 2. Switch State (Only if changed)
|
|
72
|
+
if (nextState !== currentState) {
|
|
73
|
+
|
|
74
|
+
// A. Determine which plugins should be active
|
|
75
|
+
const activePlugins = nextState === 'default'
|
|
76
|
+
? options.default
|
|
77
|
+
: options.states[nextState];
|
|
78
|
+
|
|
79
|
+
// B. Apply changes
|
|
80
|
+
// Note: We combine default + managed to ensure we cover everyone involved
|
|
81
|
+
const involved = new Set([...defaultPlugins, ...allManagedPlugins]);
|
|
82
|
+
|
|
83
|
+
involved.forEach(pluginName => {
|
|
84
|
+
const shouldBeActive = activePlugins.includes(pluginName);
|
|
85
|
+
|
|
86
|
+
if (shouldBeActive) {
|
|
87
|
+
app.enablePlugin(pluginName);
|
|
88
|
+
} else {
|
|
89
|
+
app.disablePlugin(pluginName);
|
|
90
|
+
}
|
|
91
|
+
});
|
|
92
|
+
|
|
93
|
+
currentState = nextState;
|
|
94
|
+
}
|
|
95
|
+
}
|
|
96
|
+
}, options);
|
|
97
97
|
};
|
package/tsconfig.json
CHANGED
|
@@ -1,18 +1,18 @@
|
|
|
1
|
-
{
|
|
2
|
-
"extends": "../../tsconfig.base.json",
|
|
3
|
-
"include": [
|
|
4
|
-
"src"
|
|
5
|
-
],
|
|
6
|
-
"compilerOptions": {
|
|
7
|
-
"outDir": "dist",
|
|
8
|
-
"baseUrl": ".",
|
|
9
|
-
"paths": {
|
|
10
|
-
"@supermousejs/core": [
|
|
11
|
-
"../core/src/index.ts"
|
|
12
|
-
],
|
|
13
|
-
"@supermousejs/utils": [
|
|
14
|
-
"../utils/src/index.ts"
|
|
15
|
-
]
|
|
16
|
-
}
|
|
17
|
-
}
|
|
1
|
+
{
|
|
2
|
+
"extends": "../../tsconfig.base.json",
|
|
3
|
+
"include": [
|
|
4
|
+
"src"
|
|
5
|
+
],
|
|
6
|
+
"compilerOptions": {
|
|
7
|
+
"outDir": "dist",
|
|
8
|
+
"baseUrl": ".",
|
|
9
|
+
"paths": {
|
|
10
|
+
"@supermousejs/core": [
|
|
11
|
+
"../core/src/index.ts"
|
|
12
|
+
],
|
|
13
|
+
"@supermousejs/utils": [
|
|
14
|
+
"../utils/src/index.ts"
|
|
15
|
+
]
|
|
16
|
+
}
|
|
17
|
+
}
|
|
18
18
|
}
|
package/vite.config.ts
CHANGED
|
@@ -1,22 +1,22 @@
|
|
|
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: 'SupermouseStates',
|
|
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
|
-
plugins: [dts({ rollupTypes: true })]
|
|
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: 'SupermouseStates',
|
|
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
|
+
plugins: [dts({ rollupTypes: true })]
|
|
22
22
|
});
|