sparkfx 1.0.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/LICENSE +21 -0
- package/README.md +76 -0
- package/dist/chunk-5QFFUSHL.js +326 -0
- package/dist/chunk-5QFFUSHL.js.map +1 -0
- package/dist/chunk-AMLWVX5A.cjs +326 -0
- package/dist/chunk-AMLWVX5A.cjs.map +1 -0
- package/dist/index.cjs +2 -0
- package/dist/index.cjs.map +1 -0
- package/dist/index.js +2 -0
- package/dist/index.js.map +1 -0
- package/dist/next.cjs +3 -0
- package/dist/next.cjs.map +1 -0
- package/dist/next.js +3 -0
- package/dist/next.js.map +1 -0
- package/dist/react.cjs +3 -0
- package/dist/react.cjs.map +1 -0
- package/dist/react.js +3 -0
- package/dist/react.js.map +1 -0
- package/dist/svelte.cjs +3 -0
- package/dist/svelte.cjs.map +1 -0
- package/dist/svelte.js +3 -0
- package/dist/svelte.js.map +1 -0
- package/dist/vue.cjs +3 -0
- package/dist/vue.cjs.map +1 -0
- package/dist/vue.js +3 -0
- package/dist/vue.js.map +1 -0
- package/package.json +93 -0
package/LICENSE
ADDED
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
MIT License
|
|
2
|
+
|
|
3
|
+
Copyright (c) 2026 Lynch
|
|
4
|
+
|
|
5
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
|
+
of this software and associated documentation files (the "Software"), to deal
|
|
7
|
+
in the Software without restriction, including without limitation the rights
|
|
8
|
+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
9
|
+
copies of the Software, and to permit persons to whom the Software is
|
|
10
|
+
furnished to do so, subject to the following conditions:
|
|
11
|
+
|
|
12
|
+
The above copyright notice and this permission notice shall be included in all
|
|
13
|
+
copies or substantial portions of the Software.
|
|
14
|
+
|
|
15
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
16
|
+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
17
|
+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
18
|
+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
19
|
+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
20
|
+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
21
|
+
SOFTWARE.
|
package/README.md
ADDED
|
@@ -0,0 +1,76 @@
|
|
|
1
|
+
# lynch-spark
|
|
2
|
+
|
|
3
|
+
Micro-interactions for modern web apps.
|
|
4
|
+
|
|
5
|
+
```bash
|
|
6
|
+
npm install lynch-spark
|
|
7
|
+
```
|
|
8
|
+
|
|
9
|
+
## Usage
|
|
10
|
+
|
|
11
|
+
```js
|
|
12
|
+
import { spark } from 'lynch-spark'
|
|
13
|
+
|
|
14
|
+
// Get effect props
|
|
15
|
+
const effect = spark.bounce()
|
|
16
|
+
|
|
17
|
+
// Apply to element
|
|
18
|
+
element.className = effect.className
|
|
19
|
+
element.addEventListener('mouseenter', effect.onMouseEnter)
|
|
20
|
+
```
|
|
21
|
+
|
|
22
|
+
### React
|
|
23
|
+
|
|
24
|
+
```jsx
|
|
25
|
+
import { useRef, useEffect } from 'react'
|
|
26
|
+
import { spark } from 'lynch-spark'
|
|
27
|
+
|
|
28
|
+
function Button() {
|
|
29
|
+
const ref = useRef(null)
|
|
30
|
+
|
|
31
|
+
useEffect(() => {
|
|
32
|
+
const el = ref.current
|
|
33
|
+
const fx = spark.bounce()
|
|
34
|
+
el.classList.add(...fx.className.split(' '))
|
|
35
|
+
el.addEventListener('mouseenter', fx.onMouseEnter)
|
|
36
|
+
el.addEventListener('mouseleave', fx.onMouseLeave)
|
|
37
|
+
}, [])
|
|
38
|
+
|
|
39
|
+
return <button ref={ref}>Click</button>
|
|
40
|
+
}
|
|
41
|
+
```
|
|
42
|
+
|
|
43
|
+
## Effects
|
|
44
|
+
|
|
45
|
+
**Basic:** bounce, pulse, lift, scale, shake, fade, slide, rotate
|
|
46
|
+
|
|
47
|
+
**Premium:** glow, ripple, magnetic, tilt, elastic, jelly, rubber, morph
|
|
48
|
+
|
|
49
|
+
**Visual:** glitch, blur, neon, glass, shimmer, gradient, spotlight, hologram
|
|
50
|
+
|
|
51
|
+
**Celebration:** confetti, sparkle, firework, celebrate
|
|
52
|
+
|
|
53
|
+
**Text:** typewriter, scramble, wave, highlight
|
|
54
|
+
|
|
55
|
+
## Options
|
|
56
|
+
|
|
57
|
+
```js
|
|
58
|
+
spark.bounce({
|
|
59
|
+
duration: 300,
|
|
60
|
+
intensity: 1.2
|
|
61
|
+
})
|
|
62
|
+
|
|
63
|
+
spark.glow({
|
|
64
|
+
color: '#00ffcc',
|
|
65
|
+
spread: 20
|
|
66
|
+
})
|
|
67
|
+
|
|
68
|
+
spark.tilt({
|
|
69
|
+
angle: 15,
|
|
70
|
+
glare: true
|
|
71
|
+
})
|
|
72
|
+
```
|
|
73
|
+
|
|
74
|
+
## License
|
|
75
|
+
|
|
76
|
+
MIT
|
|
@@ -0,0 +1,326 @@
|
|
|
1
|
+
// @lynch/spark - Premium Micro-Interactions
|
|
2
|
+
var lt="lynch-spark-styles",pt=false,ct=new Set,gt=`
|
|
3
|
+
/* @lynch/spark base styles */
|
|
4
|
+
.spark-effect {
|
|
5
|
+
transition-property: transform, box-shadow, filter, opacity;
|
|
6
|
+
transition-timing-function: var(--spark-easing, ease-out);
|
|
7
|
+
transition-duration: var(--spark-duration, 300ms);
|
|
8
|
+
will-change: transform;
|
|
9
|
+
}
|
|
10
|
+
|
|
11
|
+
.spark-reduced-motion {
|
|
12
|
+
transition: none !important;
|
|
13
|
+
animation: none !important;
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
/* Ripple container */
|
|
17
|
+
.spark-ripple-container {
|
|
18
|
+
position: relative;
|
|
19
|
+
overflow: hidden;
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
.spark-ripple {
|
|
23
|
+
position: absolute;
|
|
24
|
+
border-radius: 50%;
|
|
25
|
+
transform: scale(0);
|
|
26
|
+
animation: spark-ripple-animation 0.6s linear;
|
|
27
|
+
pointer-events: none;
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
@keyframes spark-ripple-animation {
|
|
31
|
+
to {
|
|
32
|
+
transform: scale(4);
|
|
33
|
+
opacity: 0;
|
|
34
|
+
}
|
|
35
|
+
}
|
|
36
|
+
|
|
37
|
+
/* Confetti */
|
|
38
|
+
.spark-confetti-container {
|
|
39
|
+
position: fixed;
|
|
40
|
+
top: 0;
|
|
41
|
+
left: 0;
|
|
42
|
+
width: 100%;
|
|
43
|
+
height: 100%;
|
|
44
|
+
pointer-events: none;
|
|
45
|
+
z-index: 9999;
|
|
46
|
+
overflow: hidden;
|
|
47
|
+
}
|
|
48
|
+
|
|
49
|
+
.spark-confetti-particle {
|
|
50
|
+
position: absolute;
|
|
51
|
+
width: 10px;
|
|
52
|
+
height: 10px;
|
|
53
|
+
animation: spark-confetti-fall var(--spark-duration, 3s) ease-out forwards;
|
|
54
|
+
}
|
|
55
|
+
|
|
56
|
+
@keyframes spark-confetti-fall {
|
|
57
|
+
0% {
|
|
58
|
+
transform: translateY(0) rotate(0deg);
|
|
59
|
+
opacity: 1;
|
|
60
|
+
}
|
|
61
|
+
100% {
|
|
62
|
+
transform: translateY(100vh) rotate(720deg);
|
|
63
|
+
opacity: 0;
|
|
64
|
+
}
|
|
65
|
+
}
|
|
66
|
+
|
|
67
|
+
/* Shimmer */
|
|
68
|
+
.spark-shimmer {
|
|
69
|
+
position: relative;
|
|
70
|
+
overflow: hidden;
|
|
71
|
+
}
|
|
72
|
+
|
|
73
|
+
.spark-shimmer::after {
|
|
74
|
+
content: '';
|
|
75
|
+
position: absolute;
|
|
76
|
+
top: 0;
|
|
77
|
+
left: -100%;
|
|
78
|
+
width: 100%;
|
|
79
|
+
height: 100%;
|
|
80
|
+
background: linear-gradient(
|
|
81
|
+
90deg,
|
|
82
|
+
transparent,
|
|
83
|
+
rgba(255, 255, 255, 0.3),
|
|
84
|
+
transparent
|
|
85
|
+
);
|
|
86
|
+
animation: spark-shimmer-move var(--spark-duration, 1.5s) infinite;
|
|
87
|
+
}
|
|
88
|
+
|
|
89
|
+
@keyframes spark-shimmer-move {
|
|
90
|
+
to {
|
|
91
|
+
left: 100%;
|
|
92
|
+
}
|
|
93
|
+
}
|
|
94
|
+
|
|
95
|
+
/* Glitch */
|
|
96
|
+
.spark-glitch {
|
|
97
|
+
position: relative;
|
|
98
|
+
}
|
|
99
|
+
|
|
100
|
+
.spark-glitch::before,
|
|
101
|
+
.spark-glitch::after {
|
|
102
|
+
content: attr(data-text);
|
|
103
|
+
position: absolute;
|
|
104
|
+
top: 0;
|
|
105
|
+
left: 0;
|
|
106
|
+
width: 100%;
|
|
107
|
+
height: 100%;
|
|
108
|
+
opacity: 0;
|
|
109
|
+
}
|
|
110
|
+
|
|
111
|
+
.spark-glitch:hover::before,
|
|
112
|
+
.spark-glitch:hover::after {
|
|
113
|
+
opacity: 0.8;
|
|
114
|
+
}
|
|
115
|
+
|
|
116
|
+
.spark-glitch:hover::before {
|
|
117
|
+
color: var(--spark-glitch-color1, #ff0000);
|
|
118
|
+
animation: spark-glitch-1 0.3s infinite;
|
|
119
|
+
}
|
|
120
|
+
|
|
121
|
+
.spark-glitch:hover::after {
|
|
122
|
+
color: var(--spark-glitch-color2, #00ffff);
|
|
123
|
+
animation: spark-glitch-2 0.3s infinite;
|
|
124
|
+
}
|
|
125
|
+
|
|
126
|
+
@keyframes spark-glitch-1 {
|
|
127
|
+
0%, 100% { clip-path: inset(0 0 90% 0); transform: translateX(-2px); }
|
|
128
|
+
25% { clip-path: inset(10% 0 60% 0); transform: translateX(2px); }
|
|
129
|
+
50% { clip-path: inset(40% 0 30% 0); transform: translateX(-2px); }
|
|
130
|
+
75% { clip-path: inset(70% 0 10% 0); transform: translateX(2px); }
|
|
131
|
+
}
|
|
132
|
+
|
|
133
|
+
@keyframes spark-glitch-2 {
|
|
134
|
+
0%, 100% { clip-path: inset(80% 0 0 0); transform: translateX(2px); }
|
|
135
|
+
25% { clip-path: inset(50% 0 20% 0); transform: translateX(-2px); }
|
|
136
|
+
50% { clip-path: inset(20% 0 50% 0); transform: translateX(2px); }
|
|
137
|
+
75% { clip-path: inset(0 0 70% 0); transform: translateX(-2px); }
|
|
138
|
+
}
|
|
139
|
+
|
|
140
|
+
/* Neon glow */
|
|
141
|
+
.spark-neon {
|
|
142
|
+
text-shadow:
|
|
143
|
+
0 0 5px var(--spark-neon-color, #fff),
|
|
144
|
+
0 0 10px var(--spark-neon-color, #fff),
|
|
145
|
+
0 0 20px var(--spark-neon-color, #fff),
|
|
146
|
+
0 0 40px var(--spark-neon-color, #0ff),
|
|
147
|
+
0 0 80px var(--spark-neon-color, #0ff);
|
|
148
|
+
}
|
|
149
|
+
|
|
150
|
+
/* Hologram */
|
|
151
|
+
.spark-hologram {
|
|
152
|
+
background: linear-gradient(
|
|
153
|
+
45deg,
|
|
154
|
+
rgba(255, 0, 128, 0.3),
|
|
155
|
+
rgba(0, 255, 255, 0.3),
|
|
156
|
+
rgba(255, 255, 0, 0.3)
|
|
157
|
+
);
|
|
158
|
+
background-size: 400% 400%;
|
|
159
|
+
animation: spark-hologram-shift 3s ease infinite;
|
|
160
|
+
-webkit-background-clip: text;
|
|
161
|
+
background-clip: text;
|
|
162
|
+
}
|
|
163
|
+
|
|
164
|
+
@keyframes spark-hologram-shift {
|
|
165
|
+
0% { background-position: 0% 50%; }
|
|
166
|
+
50% { background-position: 100% 50%; }
|
|
167
|
+
100% { background-position: 0% 50%; }
|
|
168
|
+
}
|
|
169
|
+
|
|
170
|
+
/* Glass */
|
|
171
|
+
.spark-glass {
|
|
172
|
+
backdrop-filter: blur(10px);
|
|
173
|
+
background: rgba(255, 255, 255, 0.1);
|
|
174
|
+
border: 1px solid rgba(255, 255, 255, 0.2);
|
|
175
|
+
}
|
|
176
|
+
|
|
177
|
+
/* Typewriter cursor */
|
|
178
|
+
.spark-typewriter-cursor {
|
|
179
|
+
animation: spark-cursor-blink 0.7s infinite;
|
|
180
|
+
}
|
|
181
|
+
|
|
182
|
+
@keyframes spark-cursor-blink {
|
|
183
|
+
0%, 100% { opacity: 1; }
|
|
184
|
+
50% { opacity: 0; }
|
|
185
|
+
}
|
|
186
|
+
`;function i(){if(typeof document>"u"||pt)return;let s=document.createElement("style");s.id=lt,s.textContent=gt,document.head.appendChild(s),pt=true;}function S(s,t){if(typeof document>"u"||ct.has(s))return;i();let e=document.getElementById(lt);e&&(e.textContent+=`
|
|
187
|
+
@keyframes ${s} { ${t} }`,ct.add(s));}function p(s){let t={};return s.duration!==void 0&&(t["--spark-duration"]=`${s.duration}ms`),s.easing!==void 0&&(t["--spark-easing"]=St(s.easing)),s.intensity!==void 0&&(t["--spark-intensity"]=String(s.intensity)),t}function St(s){return {linear:"linear",ease:"ease","ease-in":"ease-in","ease-out":"ease-out","ease-in-out":"ease-in-out",spring:"cubic-bezier(0.175, 0.885, 0.32, 1.275)",bounce:"cubic-bezier(0.68, -0.55, 0.265, 1.55)",elastic:"cubic-bezier(0.68, -0.6, 0.32, 1.6)"}[s]??s}function V(){return typeof window>"u"?false:window.matchMedia("(prefers-reduced-motion: reduce)").matches}var yt={duration:300,intensity:1,trigger:"hover",easing:"ease-out",delay:0,reduceMotion:true};function c(s,t){return {...yt,...t,...s}}function l(s){return !(s.reduceMotion!==false&&V())}function k(s,t){return s*t}function b(s,t){let e=t.getBoundingClientRect(),n=s.clientX-e.left,o=s.clientY-e.top,r=(n/e.width-.5)*2,a=(o/e.height-.5)*2;return {x:n,y:o,percentX:r,percentY:a}}function y(s,t){return Math.random()*(t-s)+s}function w(s){return s[Math.floor(Math.random()*s.length)]}function M(s,t){let e=false;return((...n)=>{e||(s(...n),e=true,setTimeout(()=>e=false,t));})}var ht={duration:400,bounces:1,trigger:"hover"};function C(s){let t=c(s,ht);i();let e=k(20,t.intensity),n=`spark-bounce-${t.bounces}`,o="0% { transform: translateY(0); }",r=100/(t.bounces*2);for(let f=0;f<t.bounces;f++){let g=r*(f*2+1),h=r*(f*2+2),O=e*Math.pow(.6,f);o+=` ${g}% { transform: translateY(-${O}px); }`,o+=` ${h}% { transform: translateY(0); }`;}if(o+=" 100% { transform: translateY(0); }",S(n,o),!l(t))return {className:"spark-effect spark-reduced-motion"};let a=p({duration:t.duration,easing:t.easing}),u=()=>{},d=()=>{};return {className:"spark-effect spark-bounce",style:{...a,"--spark-bounce-animation":`${n} ${t.duration}ms ${t.easing}`},onMouseEnter:t.trigger==="hover"?u:void 0,onMouseLeave:t.trigger==="hover"?d:void 0,onClick:t.trigger==="click"?u:void 0}}var xt={duration:1e3,count:-1,scale:1.05,trigger:"always"};function N(s){let t=c(s,xt);i();let e=1+(t.scale-1)*t.intensity,n="spark-pulse";if(S(n,`
|
|
188
|
+
0%, 100% { transform: scale(1); opacity: 1; }
|
|
189
|
+
50% { transform: scale(${e}); opacity: 0.8; }
|
|
190
|
+
`),!l(t))return {className:"spark-effect spark-reduced-motion"};let o=p({duration:t.duration,easing:t.easing}),r=t.count===-1?"infinite":t.count;return {className:"spark-effect spark-pulse",style:{...o,animation:`${n} ${t.duration}ms ${t.easing} ${r}`}}}var Ot={duration:200,distance:8,shadow:true,trigger:"hover"};function L(s){let t=c(s,Ot);if(i(),!l(t))return {className:"spark-effect spark-reduced-motion"};let e=k(t.distance,t.intensity),n=p({duration:t.duration,easing:t.easing}),o=t.shadow?`0 ${e*2}px ${e*3}px rgba(0, 0, 0, 0.15)`:"none";return {className:"spark-effect spark-lift",style:{...n,"--spark-lift-distance":`-${e}px`,"--spark-lift-shadow":o,transition:"transform var(--spark-duration) var(--spark-easing), box-shadow var(--spark-duration) var(--spark-easing)"},onMouseEnter:r=>{let a=r.currentTarget;a.style.transform=`translateY(-${e}px)`,t.shadow&&(a.style.boxShadow=o);},onMouseLeave:r=>{let a=r.currentTarget;a.style.transform="translateY(0)",a.style.boxShadow="none";}}}var vt={duration:200,scale:1.1,trigger:"hover"};function j(s){let t=c(s,vt);if(i(),!l(t))return {className:"spark-effect spark-reduced-motion"};let e=1+(t.scale-1)*t.intensity;return {className:"spark-effect spark-scale",style:{...p({duration:t.duration,easing:t.easing}),transition:"transform var(--spark-duration) var(--spark-easing)"},onMouseEnter:o=>{let r=o.currentTarget;r.style.transform=`scale(${e})`;},onMouseLeave:o=>{let r=o.currentTarget;r.style.transform="scale(1)";}}}var bt={duration:500,distance:5,count:3,trigger:"click"};function H(s){let t=c(s,bt);i();let e=k(t.distance,t.intensity),n="spark-shake";return S(n,`
|
|
191
|
+
0%, 100% { transform: translateX(0); }
|
|
192
|
+
10%, 30%, 50%, 70%, 90% { transform: translateX(-${e}px); }
|
|
193
|
+
20%, 40%, 60%, 80% { transform: translateX(${e}px); }
|
|
194
|
+
`),l(t)?{className:"spark-effect spark-shake",style:p({duration:t.duration,easing:t.easing}),onClick:r=>{let a=r.currentTarget;a.style.animation=`${n} ${t.duration}ms ${t.easing}`,setTimeout(()=>{a.style.animation="";},t.duration);}}:{className:"spark-effect spark-reduced-motion"}}var Mt={duration:200,opacity:.6,trigger:"hover"};function A(s){let t=c(s,Mt);if(i(),!l(t))return {className:"spark-effect spark-reduced-motion"};let e=t.opacity??.6;return {className:"spark-effect spark-fade",style:{...p({duration:t.duration,easing:t.easing}),transition:"opacity var(--spark-duration) var(--spark-easing)"},onMouseEnter:o=>{let r=o.currentTarget;r.style.opacity=String(e);},onMouseLeave:o=>{let r=o.currentTarget;r.style.opacity="1";}}}var Tt={duration:200,direction:"up",distance:10,trigger:"hover"};function P(s){let t=c(s,Tt);if(i(),!l(t))return {className:"spark-effect spark-reduced-motion"};let e=k(t.distance,t.intensity),n=p({duration:t.duration,easing:t.easing}),o=()=>{switch(t.direction){case "up":return `translateY(-${e}px)`;case "down":return `translateY(${e}px)`;case "left":return `translateX(-${e}px)`;case "right":return `translateX(${e}px)`;default:return `translateY(-${e}px)`}};return {className:"spark-effect spark-slide",style:{...n,transition:"transform var(--spark-duration) var(--spark-easing)"},onMouseEnter:r=>{let a=r.currentTarget;a.style.transform=o();},onMouseLeave:r=>{let a=r.currentTarget;a.style.transform="translate(0)";}}}var $t={duration:200,angle:5,direction:"clockwise",trigger:"hover"};function I(s){let t=c(s,$t);if(i(),!l(t))return {className:"spark-effect spark-reduced-motion"};let e=k(t.angle??5,t.intensity),n=t.direction==="counterclockwise"?-1:1;return {className:"spark-effect spark-rotate",style:{...p({duration:t.duration,easing:t.easing}),transition:"transform var(--spark-duration) var(--spark-easing)"},onMouseEnter:r=>{let a=r.currentTarget;a.style.transform=`rotate(${e*n}deg)`;},onMouseLeave:r=>{let a=r.currentTarget;a.style.transform="rotate(0)";}}}var Et={duration:300,color:"currentColor",spread:20,trigger:"hover"};function X(s){let t=c(s,Et);if(i(),!l(t))return {className:"spark-effect spark-reduced-motion"};let e=k(t.spread,t.intensity),n=p({duration:t.duration,easing:t.easing}),o=`
|
|
195
|
+
0 0 ${e/2}px ${t.color},
|
|
196
|
+
0 0 ${e}px ${t.color},
|
|
197
|
+
0 0 ${e*1.5}px ${t.color}
|
|
198
|
+
`;return {className:"spark-effect spark-glow",style:{...n,transition:"box-shadow var(--spark-duration) var(--spark-easing), filter var(--spark-duration) var(--spark-easing)"},onMouseEnter:r=>{let a=r.currentTarget;a.style.boxShadow=o,a.style.filter="brightness(1.1)";},onMouseLeave:r=>{let a=r.currentTarget;a.style.boxShadow="none",a.style.filter="brightness(1)";}}}var wt={duration:600,color:"rgba(255, 255, 255, 0.3)",trigger:"click"};function Y(s){let t=c(s,wt);return i(),l(t)?{className:"spark-effect spark-ripple-container",style:p({duration:t.duration}),onClick:o=>{let r=o.currentTarget,a=r.getBoundingClientRect(),m=Math.max(a.width,a.height)*2,u=document.createElement("span");u.className="spark-ripple",u.style.cssText=`
|
|
199
|
+
width: ${m}px;
|
|
200
|
+
height: ${m}px;
|
|
201
|
+
left: ${o.clientX-a.left-m/2}px;
|
|
202
|
+
top: ${o.clientY-a.top-m/2}px;
|
|
203
|
+
background: ${t.color};
|
|
204
|
+
`,getComputedStyle(r).position==="static"&&(r.style.position="relative"),r.style.overflow="hidden",r.appendChild(u),setTimeout(()=>{u.remove();},t.duration);}}:{className:"spark-effect spark-reduced-motion"}}var Rt={duration:200,distance:20,strength:.5,trigger:"hover"};function z(s){let t=c(s,Rt);if(i(),!l(t))return {className:"spark-effect spark-reduced-motion"};let e=t.distance*t.intensity,n=p({duration:t.duration,easing:"ease-out"}),o=M(a=>{let m=a.currentTarget,{percentX:u,percentY:d}=b(a,m),f=u*e*t.strength,g=d*e*t.strength;m.style.transform=`translate(${f}px, ${g}px)`;},16),r=a=>{let m=a.currentTarget;m.style.transform="translate(0, 0)";};return {className:"spark-effect spark-magnetic",style:{...n,transition:"transform var(--spark-duration) var(--spark-easing)"},onMouseMove:o,onMouseLeave:r}}var Bt={duration:200,angle:15,perspective:true,glare:false,trigger:"hover"};function F(s){let t=c(s,Bt);if(i(),!l(t))return {className:"spark-effect spark-reduced-motion"};let e=t.angle*t.intensity,n=p({duration:t.duration,easing:"ease-out"}),o=null,r=M(u=>{let d=u.currentTarget,{percentX:f,percentY:g}=b(u,d),h=f*e,O=-g*e;if(d.style.transform=`
|
|
205
|
+
perspective(${t.perspective?"1000px":"none"})
|
|
206
|
+
rotateX(${O}deg)
|
|
207
|
+
rotateY(${h}deg)
|
|
208
|
+
scale3d(1.02, 1.02, 1.02)
|
|
209
|
+
`,t.glare&&o){let v=50+f*50,x=50+g*50;o.style.background=`
|
|
210
|
+
radial-gradient(
|
|
211
|
+
circle at ${v}% ${x}%,
|
|
212
|
+
rgba(255,255,255,0.3) 0%,
|
|
213
|
+
transparent 60%
|
|
214
|
+
)
|
|
215
|
+
`;}},16),a=u=>{let d=u.currentTarget;t.glare&&(o=document.createElement("div"),o.style.cssText=`
|
|
216
|
+
position: absolute;
|
|
217
|
+
inset: 0;
|
|
218
|
+
pointer-events: none;
|
|
219
|
+
border-radius: inherit;
|
|
220
|
+
`,d.style.position="relative",d.appendChild(o));},m=u=>{let d=u.currentTarget;d.style.transform="perspective(1000px) rotateX(0) rotateY(0) scale3d(1, 1, 1)",o&&(o.remove(),o=null);};return {className:"spark-effect spark-tilt",style:{...n,transformStyle:"preserve-3d",transition:"transform var(--spark-duration) var(--spark-easing)"},onMouseEnter:a,onMouseMove:r,onMouseLeave:m}}var Vt={duration:600,stretch:1.2,trigger:"click"};function G(s){let t=c(s,Vt);if(i(),!l(t))return {className:"spark-effect spark-reduced-motion"};let e=1+((t.stretch??1.2)-1)*t.intensity,n="spark-elastic";return S(n,`
|
|
221
|
+
0% { transform: scale(1, 1); }
|
|
222
|
+
20% { transform: scale(${e}, ${2-e}); }
|
|
223
|
+
40% { transform: scale(${2-e}, ${e}); }
|
|
224
|
+
60% { transform: scale(${1+(e-1)*.3}, ${1-(e-1)*.3}); }
|
|
225
|
+
80% { transform: scale(${1-(e-1)*.1}, ${1+(e-1)*.1}); }
|
|
226
|
+
100% { transform: scale(1, 1); }
|
|
227
|
+
`),{className:"spark-effect spark-elastic",style:p({duration:t.duration,easing:"ease-out"}),onClick:r=>{let a=r.currentTarget;a.style.animation=`${n} ${t.duration}ms cubic-bezier(0.68, -0.6, 0.32, 1.6)`,setTimeout(()=>{a.style.animation="";},t.duration);}}}var Ct={duration:700,intensity:1,trigger:"hover"};function W(s){let t=c(s,Ct);if(i(),!l(t))return {className:"spark-effect spark-reduced-motion"};let e=k(.1,t.intensity),n="spark-jelly";return S(n,`
|
|
228
|
+
0%, 100% { transform: scale(1, 1); }
|
|
229
|
+
25% { transform: scale(${1-e}, ${1+e}); }
|
|
230
|
+
50% { transform: scale(${1+e}, ${1-e}); }
|
|
231
|
+
75% { transform: scale(${1-e*.5}, ${1+e*.5}); }
|
|
232
|
+
`),{className:"spark-effect spark-jelly",style:p({duration:t.duration,easing:t.easing}),onMouseEnter:r=>{let a=r.currentTarget;a.style.animation=`${n} ${t.duration}ms ease-in-out`;},onMouseLeave:r=>{let a=r.currentTarget;setTimeout(()=>{a.style.animation="";},t.duration);}}}var Nt={duration:800,intensity:1,trigger:"click"};function D(s){let t=c(s,Nt);if(i(),!l(t))return {className:"spark-effect spark-reduced-motion"};let e=k(.25,t.intensity),n="spark-rubber";return S(n,`
|
|
233
|
+
0% { transform: scale(1, 1); }
|
|
234
|
+
30% { transform: scale(${1+e}, ${1-e*.5}); }
|
|
235
|
+
40% { transform: scale(${1-e*.5}, ${1+e*.25}); }
|
|
236
|
+
50% { transform: scale(${1+e*.3}, ${1-e*.15}); }
|
|
237
|
+
65% { transform: scale(${1-e*.1}, ${1+e*.05}); }
|
|
238
|
+
75% { transform: scale(${1+e*.05}, 1); }
|
|
239
|
+
100% { transform: scale(1, 1); }
|
|
240
|
+
`),{className:"spark-effect spark-rubber",style:p({duration:t.duration,easing:t.easing}),onClick:r=>{let a=r.currentTarget;a.style.animation=`${n} ${t.duration}ms ease-in-out`,setTimeout(()=>{a.style.animation="";},t.duration);}}}var Lt={duration:400,radius:50,trigger:"hover"};function q(s){let t=c(s,Lt);if(i(),!l(t))return {className:"spark-effect spark-reduced-motion"};let e=k(t.radius??50,t.intensity);return {className:"spark-effect spark-morph",style:{...p({duration:t.duration,easing:t.easing}),transition:"border-radius var(--spark-duration) var(--spark-easing), transform var(--spark-duration) var(--spark-easing)"},onMouseEnter:o=>{let r=o.currentTarget;r.style.borderRadius=`${e}%`,r.style.transform="rotate(3deg) scale(1.02)";},onMouseLeave:o=>{let r=o.currentTarget;r.style.borderRadius="",r.style.transform="rotate(0) scale(1)";}}}var jt={duration:300,color1:"#ff0000",color2:"#00ffff",trigger:"hover"};function K(s){let t=c(s,jt);return i(),l(t)?{className:"spark-effect spark-glitch",style:{...p({duration:t.duration,easing:t.easing}),"--spark-glitch-color1":t.color1,"--spark-glitch-color2":t.color2,position:"relative"}}:{className:"spark-effect spark-reduced-motion"}}var Ht={duration:300,amount:5,trigger:"hover"};function _(s){let t=c(s,Ht);if(i(),!l(t))return {className:"spark-effect spark-reduced-motion"};let e=k(t.amount??5,t.intensity);return {className:"spark-effect spark-blur",style:{...p({duration:t.duration,easing:t.easing}),transition:"filter var(--spark-duration) var(--spark-easing)"},onMouseEnter:o=>{let r=o.currentTarget;r.style.filter=`blur(${e}px)`;},onMouseLeave:o=>{let r=o.currentTarget;r.style.filter="blur(0)";}}}var At={duration:300,color:"#00ffff",flicker:false,trigger:"hover"};function J(s){let t=c(s,At);if(i(),!l(t))return {className:"spark-effect spark-reduced-motion"};let e=t.color??"#00ffff",n=p({duration:t.duration,easing:t.easing}),o=`
|
|
241
|
+
0 0 5px #fff,
|
|
242
|
+
0 0 10px #fff,
|
|
243
|
+
0 0 20px ${e},
|
|
244
|
+
0 0 40px ${e},
|
|
245
|
+
0 0 80px ${e}
|
|
246
|
+
`,r=`
|
|
247
|
+
0 0 5px ${e},
|
|
248
|
+
0 0 20px ${e},
|
|
249
|
+
inset 0 0 10px ${e}
|
|
250
|
+
`;return {className:"spark-effect spark-neon",style:{...n,"--spark-neon-color":e,transition:"text-shadow var(--spark-duration) var(--spark-easing), box-shadow var(--spark-duration) var(--spark-easing)"},onMouseEnter:a=>{let m=a.currentTarget;m.style.textShadow=o,m.style.boxShadow=r;},onMouseLeave:a=>{let m=a.currentTarget;m.style.textShadow="none",m.style.boxShadow="none";}}}var Pt={duration:300,blur:10,opacity:.2,borderOpacity:.3,trigger:"always"};function Q(s){let t=c(s,Pt);if(i(),!l(t))return {className:"spark-effect spark-reduced-motion"};let e=k(t.blur??10,t.intensity),n=t.opacity??.2,o=t.borderOpacity??.3;return {className:"spark-effect spark-glass",style:{...p({duration:t.duration,easing:t.easing}),backdropFilter:`blur(${e}px)`,WebkitBackdropFilter:`blur(${e}px)`,background:`rgba(255, 255, 255, ${n})`,border:`1px solid rgba(255, 255, 255, ${o})`,boxShadow:"0 8px 32px 0 rgba(31, 38, 135, 0.37)"}}}var It={duration:1500,trigger:"always"};function U(s){let t=c(s,It);return i(),l(t)?{className:"spark-effect spark-shimmer",style:{...p({duration:t.duration,easing:t.easing})}}:{className:"spark-effect spark-reduced-motion"}}var ut={duration:5e3,colors:["#ee7752","#e73c7e","#23a6d5","#23d5ab"],direction:"diagonal",trigger:"always"};function Z(s){let t=c(s,ut);if(i(),!l(t))return {className:"spark-effect spark-reduced-motion"};let e=t.colors??ut.colors,n="spark-gradient";S(n,`
|
|
251
|
+
0% { background-position: 0% 50%; }
|
|
252
|
+
50% { background-position: 100% 50%; }
|
|
253
|
+
100% { background-position: 0% 50%; }
|
|
254
|
+
`);let o=p({duration:t.duration,easing:"ease"}),r=t.direction==="horizontal"?"90deg":t.direction==="vertical"?"180deg":"45deg";return {className:"spark-effect spark-gradient",style:{...o,background:`linear-gradient(${r}, ${e.join(", ")})`,backgroundSize:"400% 400%",animation:`${n} ${t.duration}ms ease infinite`}}}var Xt={duration:0,size:200,color:"rgba(255,255,255,0.15)",trigger:"hover"};function tt(s){let t=c(s,Xt);if(i(),!l(t))return {className:"spark-effect spark-reduced-motion"};let e=t.size??200,n=t.color??"rgba(255,255,255,0.15)",o=p({duration:t.duration,easing:t.easing}),r=null,a=M(d=>{if(!r)return;let f=d.currentTarget,{x:g,y:h}=b(d,f);r.style.background=`
|
|
255
|
+
radial-gradient(
|
|
256
|
+
circle ${e}px at ${g}px ${h}px,
|
|
257
|
+
${n} 0%,
|
|
258
|
+
transparent 100%
|
|
259
|
+
)
|
|
260
|
+
`;},16),m=d=>{let f=d.currentTarget;r=document.createElement("div"),r.style.cssText=`
|
|
261
|
+
position: absolute;
|
|
262
|
+
inset: 0;
|
|
263
|
+
pointer-events: none;
|
|
264
|
+
border-radius: inherit;
|
|
265
|
+
`,f.style.position="relative",f.appendChild(r);},u=()=>{r&&(r.remove(),r=null);};return {className:"spark-effect spark-spotlight",style:{...o,position:"relative",overflow:"hidden"},onMouseEnter:m,onMouseMove:a,onMouseLeave:u}}var Yt={duration:3e3,trigger:"always"};function et(s){let t=c(s,Yt);return i(),l(t)?{className:"spark-effect spark-hologram",style:p({duration:t.duration,easing:t.easing})}:{className:"spark-effect spark-reduced-motion"}}var mt={duration:3e3,count:30,colors:["#ff0000","#00ff00","#0000ff","#ffff00","#ff00ff","#00ffff"],spread:60,trigger:"click"};function T(s){let t=c(s,mt);return i(),l(t)?{className:"spark-effect spark-confetti-trigger",style:p({duration:t.duration}),onClick:o=>{let r=o.currentTarget.getBoundingClientRect(),a=r.left+r.width/2,m=r.top+r.height/2,u=document.createElement("div");u.className="spark-confetti-container",document.body.appendChild(u);for(let d=0;d<t.count;d++){let f=document.createElement("div");f.className="spark-confetti-particle";let g=y(-t.spread,t.spread)*(Math.PI/180),h=y(200,400),O=y(5,10),v=w(t.colors??mt.colors),x=a+y(-20,20),E=m,R=x+Math.sin(g)*h,B=y(2e3,4e3);f.style.cssText=`
|
|
266
|
+
left: ${x}px;
|
|
267
|
+
top: ${E}px;
|
|
268
|
+
width: ${O}px;
|
|
269
|
+
height: ${O}px;
|
|
270
|
+
background: ${v};
|
|
271
|
+
--spark-duration: ${B}ms;
|
|
272
|
+
transform: translateX(${R-x}px);
|
|
273
|
+
border-radius: ${y(0,50)}%;
|
|
274
|
+
`,u.appendChild(f);}setTimeout(()=>{u.remove();},t.duration+1e3);}}:{className:"spark-effect spark-reduced-motion"}}var zt={duration:1500,count:10,color:"#FFD700",trigger:"hover"};function $(s){let t=c(s,zt);if(i(),!l(t))return {className:"spark-effect spark-reduced-motion"};let e="spark-sparkle";S(e,`
|
|
275
|
+
0%, 100% { opacity: 0; transform: scale(0) rotate(0deg); }
|
|
276
|
+
50% { opacity: 1; transform: scale(1) rotate(180deg); }
|
|
277
|
+
`);let n=p({duration:t.duration,easing:t.easing}),o=null,r=null,a=d=>{let f=document.createElement("span");f.innerHTML="\u2726",f.style.cssText=`
|
|
278
|
+
position: absolute;
|
|
279
|
+
left: ${y(0,100)}%;
|
|
280
|
+
top: ${y(0,100)}%;
|
|
281
|
+
color: ${t.color};
|
|
282
|
+
font-size: ${y(8,16)}px;
|
|
283
|
+
pointer-events: none;
|
|
284
|
+
animation: ${e} ${t.duration}ms ease-in-out;
|
|
285
|
+
`,d.appendChild(f),setTimeout(()=>{f.remove();},t.duration);};return {className:"spark-effect spark-sparkle",style:n,onMouseEnter:d=>{let f=d.currentTarget;f.style.position="relative",r=document.createElement("div"),r.style.cssText=`
|
|
286
|
+
position: absolute;
|
|
287
|
+
inset: 0;
|
|
288
|
+
pointer-events: none;
|
|
289
|
+
overflow: visible;
|
|
290
|
+
`,f.appendChild(r);for(let g=0;g<(t.count??10)/2;g++)setTimeout(()=>{r&&a(r);},y(0,300));o=setInterval(()=>{r&&a(r);},t.duration/(t.count??10));},onMouseLeave:()=>{o&&(clearInterval(o),o=null),r&&setTimeout(()=>{r?.remove(),r=null;},t.duration);}}}var ft={duration:1500,count:30,colors:["#ff0","#f0f","#0ff","#ff0000","#00ff00"],trigger:"click"};function rt(s){let t=c(s,ft);return i(),l(t)?{className:"spark-effect spark-firework-trigger",style:p({duration:t.duration}),onClick:o=>{o.currentTarget.getBoundingClientRect();let a=o.clientX,m=o.clientY,u=document.createElement("div");u.style.cssText=`
|
|
291
|
+
position: fixed;
|
|
292
|
+
top: 0;
|
|
293
|
+
left: 0;
|
|
294
|
+
width: 100%;
|
|
295
|
+
height: 100%;
|
|
296
|
+
pointer-events: none;
|
|
297
|
+
z-index: 9999;
|
|
298
|
+
`,document.body.appendChild(u);let d=t.colors??ft.colors,f=t.count??30;for(let g=0;g<f;g++){let h=document.createElement("div"),O=g/f*Math.PI*2,v=y(50,150),x=y(3,6),E=w(d),R=Math.cos(O)*v,B=Math.sin(O)*v;h.style.cssText=`
|
|
299
|
+
position: absolute;
|
|
300
|
+
left: ${a}px;
|
|
301
|
+
top: ${m}px;
|
|
302
|
+
width: ${x}px;
|
|
303
|
+
height: ${x}px;
|
|
304
|
+
background: ${E};
|
|
305
|
+
border-radius: 50%;
|
|
306
|
+
box-shadow: 0 0 ${x*2}px ${E};
|
|
307
|
+
animation: spark-firework-particle ${t.duration}ms ease-out forwards;
|
|
308
|
+
--end-x: ${R}px;
|
|
309
|
+
--end-y: ${B}px;
|
|
310
|
+
`,u.appendChild(h);}S("spark-firework-particle",`
|
|
311
|
+
0% {
|
|
312
|
+
transform: translate(0, 0) scale(1);
|
|
313
|
+
opacity: 1;
|
|
314
|
+
}
|
|
315
|
+
100% {
|
|
316
|
+
transform: translate(var(--end-x), calc(var(--end-y) + 30px)) scale(0);
|
|
317
|
+
opacity: 0;
|
|
318
|
+
}
|
|
319
|
+
`),setTimeout(()=>{u.remove();},t.duration+100);}}:{className:"spark-effect spark-reduced-motion"}}var Ft={duration:3e3,trigger:"click"};function st(s){let t=c(s,Ft);if(i(),!l(t))return {className:"spark-effect spark-reduced-motion"};let e=p({duration:t.duration}),n=T({...t,trigger:"click"}),o=$({...t,trigger:"hover"});return {className:"spark-effect spark-celebrate",style:e,onClick:r=>{n.onClick?.(r);},onMouseEnter:r=>{o.onMouseEnter?.(r);},onMouseLeave:r=>{o.onMouseLeave?.(r);}}}var dt={duration:2e3,speed:50,cursor:"|",loop:false,trigger:"appear"};function ot(s){let t=c(s,dt);return i(),l(t)?{className:"spark-effect spark-typewriter",style:p({duration:t.duration,easing:t.easing})}:{className:"spark-effect spark-reduced-motion"}}function Gt(s,t){let e={...dt,...t},n=s.textContent||"",o=0,r=null,a=()=>{o<=n.length?(s.textContent=n.slice(0,o)+(e.cursor??"|"),o++):e.loop?o=0:r&&(clearInterval(r),s.textContent=n);};return s.textContent=e.cursor??"|",r=setInterval(a,e.speed),()=>{r&&clearInterval(r),s.textContent=n;}}var kt={duration:800,characters:"ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789!@#$%^&*",iterations:10,trigger:"hover"};function at(s){let t=c(s,kt);if(i(),!l(t))return {className:"spark-effect spark-reduced-motion"};let e=p({duration:t.duration,easing:t.easing}),n=false,o="";return {className:"spark-effect spark-scramble",style:e,onMouseEnter:a=>{if(n)return;let m=a.currentTarget;o=m.textContent||"",n=true;let u=t.characters??kt.characters,d=t.iterations??10,f=t.duration/d,g=0,h=setInterval(()=>{if(g>=d){m.textContent=o,n=false,clearInterval(h);return}let O=g/d,v="";for(let x=0;x<o.length;x++)o[x]===" "?v+=" ":Math.random()>O?v+=u[Math.floor(y(0,u.length))]:v+=o[x];m.textContent=v,g++;},f);}}}var Wt={duration:1e3,height:10,trigger:"hover"};function nt(s){let t=c(s,Wt);if(i(),!l(t))return {className:"spark-effect spark-reduced-motion"};let e=k(t.height??10,t.intensity),n="spark-wave";S(n,`
|
|
320
|
+
0%, 100% { transform: translateY(0); }
|
|
321
|
+
50% { transform: translateY(-${e}px); }
|
|
322
|
+
`);let o=p({duration:t.duration,easing:"ease-in-out"}),r=m=>{let u=m.currentTarget,d=u.textContent||"";u.innerHTML=d.split("").map((f,g)=>{if(f===" ")return " ";let h=g*50;return `<span style="display:inline-block;animation:${n} ${t.duration}ms ease-in-out ${h}ms">${f}</span>`}).join("");},a=m=>{let u=m.currentTarget,d=u.textContent||"";u.textContent=d;};return {className:"spark-effect spark-wave",style:{...o,display:"inline-block"},onMouseEnter:r,onMouseLeave:a}}var Dt={duration:600,color:"rgba(255, 255, 0, 0.4)",trigger:"hover"};function it(s){let t=c(s,Dt);if(i(),!l(t))return {className:"spark-effect spark-reduced-motion"};let e=t.color??"rgba(255, 255, 0, 0.4)",n="spark-highlight-sweep";return S(n,`
|
|
323
|
+
0% { background-position: -100% 0; }
|
|
324
|
+
100% { background-position: 200% 0; }
|
|
325
|
+
`),{className:"spark-effect spark-highlight",style:{...p({duration:t.duration,easing:t.easing}),backgroundImage:`linear-gradient(90deg, transparent 0%, ${e} 50%, transparent 100%)`,backgroundSize:"200% 100%",backgroundPosition:"-100% 0",transition:"none"},onMouseEnter:r=>{let a=r.currentTarget;a.style.animation=`${n} ${t.duration}ms ease-out`;},onMouseLeave:r=>{let a=r.currentTarget;a.style.animation="";}}}var qt={bounce:C,pulse:N,lift:L,scale:j,shake:H,fade:A,slide:P,rotate:I,glow:X,ripple:Y,magnetic:z,tilt:F,elastic:G,jelly:W,rubber:D,morph:q,glitch:K,blur:_,neon:J,glass:Q,shimmer:U,gradient:Z,spotlight:tt,hologram:et,confetti:T,sparkle:$,firework:rt,celebrate:st,typewriter:ot,scramble:at,wave:nt,highlight:it},Os=qt;export{T as A,$ as B,rt as C,st as D,ot as E,Gt as F,at as G,nt as H,it as I,qt as J,Os as K,i as a,V as b,C as c,N as d,L as e,j as f,H as g,A as h,P as i,I as j,X as k,Y as l,z as m,F as n,G as o,W as p,D as q,q as r,K as s,_ as t,J as u,Q as v,U as w,Z as x,tt as y,et as z};//# sourceMappingURL=chunk-5QFFUSHL.js.map
|
|
326
|
+
//# sourceMappingURL=chunk-5QFFUSHL.js.map
|