azeriand-library 1.16.0 → 1.16.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/dist/index.d.ts +1 -0
- package/dist/index.esm.js +469 -2
- package/dist/index.esm.js.map +1 -1
- package/dist/index.umd.js +468 -1
- package/dist/index.umd.js.map +1 -1
- package/package.json +1 -1
package/dist/index.d.ts
CHANGED
|
@@ -12,3 +12,4 @@ export { NewSlider } from './components/slider/slider';
|
|
|
12
12
|
export { Tab } from './components/tab/tab';
|
|
13
13
|
export { Timeline } from './components/timeline/timeline';
|
|
14
14
|
export { TlListItem } from './components/timeline/timeline-list-item';
|
|
15
|
+
export { GradientGlow } from './components/gradient-glow/gradient-glow';
|
package/dist/index.esm.js
CHANGED
|
@@ -3,7 +3,320 @@
|
|
|
3
3
|
try {
|
|
4
4
|
if (typeof document != "undefined") {
|
|
5
5
|
var elementStyle = document.createElement("style");
|
|
6
|
-
elementStyle.appendChild(document.createTextNode(
|
|
6
|
+
elementStyle.appendChild(document.createTextNode(`.card{
|
|
7
|
+
/* border-radius: 20px; */
|
|
8
|
+
color: var(--card-text-color, white);
|
|
9
|
+
}
|
|
10
|
+
|
|
11
|
+
.card.glass{
|
|
12
|
+
background-color: color-mix(in oklch, var(--glass-color), transparent 80%);
|
|
13
|
+
-webkit-backface-visibility: hidden;
|
|
14
|
+
-webkit-perspective: 1000;
|
|
15
|
+
-webkit-transform: translate3d(0,0,0);
|
|
16
|
+
-webkit-transform: translateZ(0);
|
|
17
|
+
backface-visibility: hidden;
|
|
18
|
+
perspective: 1000;
|
|
19
|
+
transform: translate3d(0,0,0);
|
|
20
|
+
transform: translateZ(0);
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
.card.mate{
|
|
24
|
+
background-color: var(--glass-color);
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
.card.outlined{
|
|
28
|
+
border: 2px solid color-mix(in oklch, var(--glass-color), transparent 40%);
|
|
29
|
+
}
|
|
30
|
+
|
|
31
|
+
button .card.ghost:hover, button .card.outlined:hover{
|
|
32
|
+
background: color-mix(in oklch, var(--glass-color), transparent 80%);
|
|
33
|
+
}
|
|
34
|
+
|
|
35
|
+
button .card.glass:hover{
|
|
36
|
+
box-shadow: 0 4px 10px color-mix(in oklch, var(--glass-color), transparent 85%);
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
button .card.mate:hover{
|
|
40
|
+
background-color: color-mix(in oklch, var(--glass-color), white 10%)
|
|
41
|
+
}
|
|
42
|
+
button{
|
|
43
|
+
background: none;
|
|
44
|
+
color: inherit;
|
|
45
|
+
border: none;
|
|
46
|
+
padding: 0;
|
|
47
|
+
font: inherit;
|
|
48
|
+
cursor: pointer;
|
|
49
|
+
outline: inherit;
|
|
50
|
+
font-weight: bold;
|
|
51
|
+
}
|
|
52
|
+
|
|
53
|
+
button:focus {
|
|
54
|
+
outline: revert;
|
|
55
|
+
}
|
|
56
|
+
.section-name{
|
|
57
|
+
color: hsla(0, 0%, 100%, 0.7);
|
|
58
|
+
}input:disabled{
|
|
59
|
+
color: hsla(0, 0%, 100%, 0.5);
|
|
60
|
+
font-weight: bold;
|
|
61
|
+
}
|
|
62
|
+
|
|
63
|
+
input::-moz-placeholder{
|
|
64
|
+
color: hsla(0, 0%, 100%, 0.5);
|
|
65
|
+
|
|
66
|
+
}
|
|
67
|
+
|
|
68
|
+
input::placeholder{
|
|
69
|
+
color: hsla(0, 0%, 100%, 0.5);
|
|
70
|
+
|
|
71
|
+
}
|
|
72
|
+
|
|
73
|
+
input::-webkit-outer-spin-button,
|
|
74
|
+
input::-webkit-inner-spin-button {
|
|
75
|
+
-webkit-appearance: none;
|
|
76
|
+
margin: 0;
|
|
77
|
+
}
|
|
78
|
+
|
|
79
|
+
input:focus{
|
|
80
|
+
outline: none;
|
|
81
|
+
}.MuiDateCalendar-root{
|
|
82
|
+
color: white;
|
|
83
|
+
}.dropdown-content{
|
|
84
|
+
box-shadow: rgba(149, 157, 165, 0.2)
|
|
85
|
+
0px 8px 24px;
|
|
86
|
+
max-height: 40%vh;
|
|
87
|
+
scrollbar-width: none;
|
|
88
|
+
-ms-overflow-style: none;
|
|
89
|
+
z-index: 10;
|
|
90
|
+
}
|
|
91
|
+
|
|
92
|
+
.dropdown-content::-webkit-scrollbar{
|
|
93
|
+
width: 0;
|
|
94
|
+
height: 0;
|
|
95
|
+
}
|
|
96
|
+
|
|
97
|
+
.dropdown-item:hover{
|
|
98
|
+
background-color: rgb(240, 249, 255);
|
|
99
|
+
}.button-open{
|
|
100
|
+
border: rgb(147, 197, 253) 2px solid;
|
|
101
|
+
border-radius: 7px;
|
|
102
|
+
}.vertical-line::before {
|
|
103
|
+
content: "";
|
|
104
|
+
position: absolute;
|
|
105
|
+
width: 1.5px;
|
|
106
|
+
height: 100%;
|
|
107
|
+
background-color: white;
|
|
108
|
+
left: 0;
|
|
109
|
+
top: 0;
|
|
110
|
+
transform: translateX(5.1px);
|
|
111
|
+
}.gradient-glow-wrapper {
|
|
112
|
+
position: relative;
|
|
113
|
+
display: inline-block;
|
|
114
|
+
transform-style: preserve-3d;
|
|
115
|
+
}
|
|
116
|
+
|
|
117
|
+
.gradient-glow-wrapper .glow-background {
|
|
118
|
+
content: '';
|
|
119
|
+
position: absolute;
|
|
120
|
+
inset: 0;
|
|
121
|
+
filter: blur(0px);
|
|
122
|
+
transform: translate3d(0px, 0px, -1px);
|
|
123
|
+
border-radius: var(--glow-border-radius);
|
|
124
|
+
pointer-events: none;
|
|
125
|
+
opacity: 0;
|
|
126
|
+
transition: all 0.3s ease;
|
|
127
|
+
}
|
|
128
|
+
|
|
129
|
+
.gradient-glow-wrapper .content-wrapper {
|
|
130
|
+
position: relative;
|
|
131
|
+
z-index: 1;
|
|
132
|
+
}
|
|
133
|
+
|
|
134
|
+
/* Animation States */
|
|
135
|
+
.gradient-glow-wrapper.glow-active .glow-background {
|
|
136
|
+
opacity: var(--glow-opacity);
|
|
137
|
+
}
|
|
138
|
+
|
|
139
|
+
/* Breath Animation */
|
|
140
|
+
.gradient-glow-wrapper.animation-breath.glow-active .glow-background {
|
|
141
|
+
animation: breathGlow var(--glow-duration) var(--glow-easing) var(--glow-delay);
|
|
142
|
+
}
|
|
143
|
+
|
|
144
|
+
.gradient-glow-wrapper.animation-breath.animation-continuous.glow-active .glow-background {
|
|
145
|
+
animation: breathGlow var(--glow-duration) var(--glow-easing) var(--glow-delay) infinite;
|
|
146
|
+
}
|
|
147
|
+
|
|
148
|
+
/* Rotate Animation */
|
|
149
|
+
.gradient-glow-wrapper.animation-rotate.glow-active .glow-background {
|
|
150
|
+
animation: rotateGlow var(--glow-duration) linear var(--glow-delay);
|
|
151
|
+
}
|
|
152
|
+
|
|
153
|
+
.gradient-glow-wrapper.animation-rotate.animation-continuous.glow-active .glow-background {
|
|
154
|
+
animation: rotateGlow var(--glow-duration) linear var(--glow-delay) infinite;
|
|
155
|
+
}
|
|
156
|
+
|
|
157
|
+
/* Spin Animation - Create a rotating pseudo-element for the gradient */
|
|
158
|
+
.gradient-glow-wrapper.animation-spin.glow-active .glow-background {
|
|
159
|
+
inset: calc(-1 * var(--glow-spread));
|
|
160
|
+
filter: blur(var(--glow-blur));
|
|
161
|
+
opacity: var(--glow-opacity);
|
|
162
|
+
overflow: hidden;
|
|
163
|
+
}
|
|
164
|
+
|
|
165
|
+
.gradient-glow-wrapper.animation-spin.glow-active .glow-background::before {
|
|
166
|
+
content: '';
|
|
167
|
+
position: absolute;
|
|
168
|
+
inset: -50%;
|
|
169
|
+
background: var(
|
|
170
|
+
--spinning-gradient,
|
|
171
|
+
conic-gradient(
|
|
172
|
+
from 0deg at 50% 50%,
|
|
173
|
+
#ff0000,
|
|
174
|
+
#ff8000,
|
|
175
|
+
#ffff00,
|
|
176
|
+
#80ff00,
|
|
177
|
+
#00ff00,
|
|
178
|
+
#00ff80,
|
|
179
|
+
#00ffff,
|
|
180
|
+
#0080ff,
|
|
181
|
+
#0000ff,
|
|
182
|
+
#8000ff,
|
|
183
|
+
#ff0080,
|
|
184
|
+
#ff0000
|
|
185
|
+
)
|
|
186
|
+
);
|
|
187
|
+
animation: spinGlow var(--glow-duration) linear var(--glow-delay);
|
|
188
|
+
}
|
|
189
|
+
|
|
190
|
+
.gradient-glow-wrapper.animation-spin.animation-continuous.glow-active .glow-background::before {
|
|
191
|
+
content: '';
|
|
192
|
+
position: absolute;
|
|
193
|
+
inset: -50%;
|
|
194
|
+
background: var(
|
|
195
|
+
--spinning-gradient,
|
|
196
|
+
conic-gradient(
|
|
197
|
+
from 0deg at 50% 50%,
|
|
198
|
+
#ff0000,
|
|
199
|
+
#ff8000,
|
|
200
|
+
#ffff00,
|
|
201
|
+
#80ff00,
|
|
202
|
+
#00ff00,
|
|
203
|
+
#00ff80,
|
|
204
|
+
#00ffff,
|
|
205
|
+
#0080ff,
|
|
206
|
+
#0000ff,
|
|
207
|
+
#8000ff,
|
|
208
|
+
#ff0080,
|
|
209
|
+
#ff0000
|
|
210
|
+
)
|
|
211
|
+
);
|
|
212
|
+
animation: spinGlow var(--glow-duration) linear var(--glow-delay) infinite;
|
|
213
|
+
}
|
|
214
|
+
|
|
215
|
+
/* Pulse Animation */
|
|
216
|
+
.gradient-glow-wrapper.animation-pulse.glow-active .glow-background {
|
|
217
|
+
animation: pulseGlow var(--glow-duration) var(--glow-easing) var(--glow-delay);
|
|
218
|
+
}
|
|
219
|
+
|
|
220
|
+
.gradient-glow-wrapper.animation-pulse.animation-continuous.glow-active .glow-background {
|
|
221
|
+
animation: pulseGlow var(--glow-duration) var(--glow-easing) var(--glow-delay) infinite;
|
|
222
|
+
}
|
|
223
|
+
|
|
224
|
+
/* No Animation - Static Glow */
|
|
225
|
+
.gradient-glow-wrapper.animation-none.glow-active .glow-background {
|
|
226
|
+
inset: calc(-1 * var(--glow-spread));
|
|
227
|
+
filter: blur(var(--glow-blur));
|
|
228
|
+
opacity: var(--glow-opacity);
|
|
229
|
+
}
|
|
230
|
+
|
|
231
|
+
/* Hover-specific styles */
|
|
232
|
+
.gradient-glow-wrapper.animation-hover:hover .glow-background {
|
|
233
|
+
inset: calc(-1 * var(--glow-spread));
|
|
234
|
+
filter: blur(var(--glow-blur));
|
|
235
|
+
opacity: var(--glow-opacity);
|
|
236
|
+
transition: all 0.3s var(--glow-easing);
|
|
237
|
+
}
|
|
238
|
+
|
|
239
|
+
/* Disabled state - no glow effects */
|
|
240
|
+
.gradient-glow-wrapper.glow-disabled .glow-background {
|
|
241
|
+
opacity: 0 !important;
|
|
242
|
+
animation: none !important;
|
|
243
|
+
}
|
|
244
|
+
|
|
245
|
+
/* Breathing out animation when being disabled */
|
|
246
|
+
.gradient-glow-wrapper.glow-breathing-out .glow-background {
|
|
247
|
+
opacity: var(--glow-opacity);
|
|
248
|
+
inset: calc(-1 * var(--glow-spread));
|
|
249
|
+
filter: blur(var(--glow-blur));
|
|
250
|
+
animation: breatheOut 0.6s ease-out forwards !important;
|
|
251
|
+
}
|
|
252
|
+
|
|
253
|
+
/* Keyframe Animations */
|
|
254
|
+
@keyframes breathGlow {
|
|
255
|
+
0% {
|
|
256
|
+
inset: 0;
|
|
257
|
+
filter: blur(0px);
|
|
258
|
+
opacity: 0;
|
|
259
|
+
}
|
|
260
|
+
50% {
|
|
261
|
+
inset: calc(-1 * var(--glow-spread));
|
|
262
|
+
filter: blur(var(--glow-blur));
|
|
263
|
+
opacity: var(--glow-opacity);
|
|
264
|
+
}
|
|
265
|
+
100% {
|
|
266
|
+
inset: 0;
|
|
267
|
+
filter: blur(0px);
|
|
268
|
+
opacity: 0;
|
|
269
|
+
}
|
|
270
|
+
}
|
|
271
|
+
|
|
272
|
+
@keyframes rotateGlow {
|
|
273
|
+
0% {
|
|
274
|
+
inset: calc(-1 * var(--glow-spread));
|
|
275
|
+
filter: blur(var(--glow-blur)) hue-rotate(0deg);
|
|
276
|
+
opacity: var(--glow-opacity);
|
|
277
|
+
}
|
|
278
|
+
100% {
|
|
279
|
+
inset: calc(-1 * var(--glow-spread));
|
|
280
|
+
filter: blur(var(--glow-blur)) hue-rotate(360deg);
|
|
281
|
+
opacity: var(--glow-opacity);
|
|
282
|
+
}
|
|
283
|
+
}
|
|
284
|
+
|
|
285
|
+
@keyframes spinGlow {
|
|
286
|
+
0% {
|
|
287
|
+
transform: rotate(0deg);
|
|
288
|
+
}
|
|
289
|
+
100% {
|
|
290
|
+
transform: rotate(360deg);
|
|
291
|
+
}
|
|
292
|
+
}
|
|
293
|
+
|
|
294
|
+
@keyframes pulseGlow {
|
|
295
|
+
0%,
|
|
296
|
+
100% {
|
|
297
|
+
inset: 0;
|
|
298
|
+
filter: blur(5px);
|
|
299
|
+
opacity: 0.3;
|
|
300
|
+
}
|
|
301
|
+
50% {
|
|
302
|
+
inset: calc(-1 * var(--glow-spread));
|
|
303
|
+
filter: blur(var(--glow-blur));
|
|
304
|
+
opacity: var(--glow-opacity);
|
|
305
|
+
}
|
|
306
|
+
}
|
|
307
|
+
|
|
308
|
+
@keyframes breatheOut {
|
|
309
|
+
0% {
|
|
310
|
+
inset: calc(-1 * var(--glow-spread));
|
|
311
|
+
filter: blur(var(--glow-blur));
|
|
312
|
+
opacity: var(--glow-opacity);
|
|
313
|
+
}
|
|
314
|
+
100% {
|
|
315
|
+
inset: 0;
|
|
316
|
+
filter: blur(0px);
|
|
317
|
+
opacity: 0;
|
|
318
|
+
}
|
|
319
|
+
}`));
|
|
7
320
|
document.head.appendChild(elementStyle);
|
|
8
321
|
}
|
|
9
322
|
} catch (e) {
|
|
@@ -15,7 +328,7 @@ var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { en
|
|
|
15
328
|
var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
|
|
16
329
|
import { jsx as jsx$1, jsxs, Fragment } from "react/jsx-runtime";
|
|
17
330
|
import * as React from "react";
|
|
18
|
-
import React__default, { forwardRef, useContext, isValidElement, cloneElement, Children, createContext, useState, useEffect } from "react";
|
|
331
|
+
import React__default, { forwardRef, useContext, isValidElement, cloneElement, Children, createContext, useState, useEffect, useRef, useImperativeHandle } from "react";
|
|
19
332
|
import ReactDOM from "react-dom";
|
|
20
333
|
function Avatar({ src, className = "", style: style2 }) {
|
|
21
334
|
return /* @__PURE__ */ jsx$1(
|
|
@@ -17871,6 +18184,159 @@ function TlListItem({ label, badge, ...cardProps }) {
|
|
|
17871
18184
|
badge
|
|
17872
18185
|
] }) }) });
|
|
17873
18186
|
}
|
|
18187
|
+
const predefinedGradients = {
|
|
18188
|
+
"purple-blue": "conic-gradient(from 90deg at 50% 50%, #8b5cf6, #60a5fa, #a855f7, #8b5cf6)",
|
|
18189
|
+
rainbow: "conic-gradient(from 0deg at 50% 50%, #ff0000, #ff8000, #ffff00, #80ff00, #00ff00, #00ff80, #00ffff, #0080ff, #0000ff, #8000ff, #ff0080, #ff0000)",
|
|
18190
|
+
sunset: "conic-gradient(from 0deg at 50% 50%, #ff6b6b, #ffa726, #ffcc02, #ff8a65, #ff6b6b)",
|
|
18191
|
+
ocean: "conic-gradient(from 0deg at 50% 50%, #667eea, #764ba2, #f093fb, #667eea)",
|
|
18192
|
+
forest: "conic-gradient(from 0deg at 50% 50%, #134e5e, #71b280, #a8e6cf, #134e5e)"
|
|
18193
|
+
};
|
|
18194
|
+
const GradientGlow = forwardRef(
|
|
18195
|
+
({
|
|
18196
|
+
animation = "breath",
|
|
18197
|
+
animationType = "continuous",
|
|
18198
|
+
duration: duration2 = 2,
|
|
18199
|
+
easing: easing2 = "ease-in-out",
|
|
18200
|
+
gradient,
|
|
18201
|
+
gradientTheme = "purple-blue",
|
|
18202
|
+
blurIntensity = 20,
|
|
18203
|
+
glowSpread = 10,
|
|
18204
|
+
borderRadius: borderRadius2 = "8px",
|
|
18205
|
+
opacity = 0.8,
|
|
18206
|
+
autoStart = true,
|
|
18207
|
+
delay = 0,
|
|
18208
|
+
disabled = false,
|
|
18209
|
+
children
|
|
18210
|
+
}, ref) => {
|
|
18211
|
+
const [isGlowActive, setIsGlowActive] = useState(false);
|
|
18212
|
+
const [isHovered, setIsHovered] = useState(false);
|
|
18213
|
+
const [isBreathingOut, setIsBreathingOut] = useState(false);
|
|
18214
|
+
const timeoutRef = useRef(null);
|
|
18215
|
+
const gradientBackground = gradient || predefinedGradients[gradientTheme];
|
|
18216
|
+
const dynamicStyles = {
|
|
18217
|
+
"--glow-duration": `${duration2}s`,
|
|
18218
|
+
"--glow-easing": easing2,
|
|
18219
|
+
"--glow-delay": `${delay}s`,
|
|
18220
|
+
"--glow-blur": `${blurIntensity}px`,
|
|
18221
|
+
"--glow-spread": `${glowSpread}px`,
|
|
18222
|
+
"--glow-opacity": opacity.toString(),
|
|
18223
|
+
"--glow-border-radius": borderRadius2,
|
|
18224
|
+
...animation === "spin" && { "--spinning-gradient": gradientBackground }
|
|
18225
|
+
};
|
|
18226
|
+
const glowBackgroundStyles = {
|
|
18227
|
+
background: gradientBackground
|
|
18228
|
+
};
|
|
18229
|
+
const handleMouseEnter = () => {
|
|
18230
|
+
setIsHovered(true);
|
|
18231
|
+
if (animationType === "hover" && !disabled) {
|
|
18232
|
+
setIsGlowActive(true);
|
|
18233
|
+
}
|
|
18234
|
+
};
|
|
18235
|
+
const handleMouseLeave = () => {
|
|
18236
|
+
setIsHovered(false);
|
|
18237
|
+
if (animationType === "hover" && !disabled) {
|
|
18238
|
+
setIsGlowActive(false);
|
|
18239
|
+
}
|
|
18240
|
+
};
|
|
18241
|
+
useEffect(() => {
|
|
18242
|
+
if (autoStart && animationType !== "hover" && !disabled) {
|
|
18243
|
+
if (delay > 0) {
|
|
18244
|
+
timeoutRef.current = setTimeout(() => {
|
|
18245
|
+
setIsGlowActive(true);
|
|
18246
|
+
}, delay * 1e3);
|
|
18247
|
+
} else {
|
|
18248
|
+
setIsGlowActive(true);
|
|
18249
|
+
}
|
|
18250
|
+
}
|
|
18251
|
+
return () => {
|
|
18252
|
+
if (timeoutRef.current) {
|
|
18253
|
+
clearTimeout(timeoutRef.current);
|
|
18254
|
+
}
|
|
18255
|
+
};
|
|
18256
|
+
}, [autoStart, animationType, delay, disabled]);
|
|
18257
|
+
useEffect(() => {
|
|
18258
|
+
if (disabled && isGlowActive) {
|
|
18259
|
+
setIsBreathingOut(true);
|
|
18260
|
+
timeoutRef.current = setTimeout(() => {
|
|
18261
|
+
setIsGlowActive(false);
|
|
18262
|
+
setIsBreathingOut(false);
|
|
18263
|
+
}, 600);
|
|
18264
|
+
} else if (disabled) {
|
|
18265
|
+
setIsGlowActive(false);
|
|
18266
|
+
setIsBreathingOut(false);
|
|
18267
|
+
} else {
|
|
18268
|
+
setIsBreathingOut(false);
|
|
18269
|
+
if (autoStart && animationType !== "hover") {
|
|
18270
|
+
setIsGlowActive(true);
|
|
18271
|
+
}
|
|
18272
|
+
}
|
|
18273
|
+
return () => {
|
|
18274
|
+
if (timeoutRef.current) {
|
|
18275
|
+
clearTimeout(timeoutRef.current);
|
|
18276
|
+
}
|
|
18277
|
+
};
|
|
18278
|
+
}, [disabled]);
|
|
18279
|
+
useImperativeHandle(ref, () => ({
|
|
18280
|
+
startAnimation: () => {
|
|
18281
|
+
if (!disabled) {
|
|
18282
|
+
setIsBreathingOut(false);
|
|
18283
|
+
setIsGlowActive(true);
|
|
18284
|
+
}
|
|
18285
|
+
},
|
|
18286
|
+
stopAnimation: () => {
|
|
18287
|
+
if (isGlowActive) {
|
|
18288
|
+
setIsBreathingOut(true);
|
|
18289
|
+
setIsGlowActive(false);
|
|
18290
|
+
timeoutRef.current = setTimeout(() => {
|
|
18291
|
+
setIsBreathingOut(false);
|
|
18292
|
+
}, 600);
|
|
18293
|
+
}
|
|
18294
|
+
},
|
|
18295
|
+
toggleAnimation: () => {
|
|
18296
|
+
if (!disabled) {
|
|
18297
|
+
if (isGlowActive) {
|
|
18298
|
+
setIsBreathingOut(true);
|
|
18299
|
+
setIsGlowActive(false);
|
|
18300
|
+
timeoutRef.current = setTimeout(() => {
|
|
18301
|
+
setIsBreathingOut(false);
|
|
18302
|
+
}, 600);
|
|
18303
|
+
} else {
|
|
18304
|
+
setIsBreathingOut(false);
|
|
18305
|
+
setIsGlowActive(true);
|
|
18306
|
+
}
|
|
18307
|
+
}
|
|
18308
|
+
}
|
|
18309
|
+
}));
|
|
18310
|
+
const wrapperClasses = [
|
|
18311
|
+
"gradient-glow-wrapper",
|
|
18312
|
+
isGlowActive && !disabled && !isBreathingOut && "glow-active",
|
|
18313
|
+
disabled && !isBreathingOut && "glow-disabled",
|
|
18314
|
+
isBreathingOut && "glow-breathing-out",
|
|
18315
|
+
animation === "breath" && "animation-breath",
|
|
18316
|
+
animation === "rotate" && "animation-rotate",
|
|
18317
|
+
animation === "spin" && "animation-spin",
|
|
18318
|
+
animation === "pulse" && "animation-pulse",
|
|
18319
|
+
animation === "none" && "animation-none",
|
|
18320
|
+
animationType === "once" && "animation-once",
|
|
18321
|
+
animationType === "continuous" && "animation-continuous",
|
|
18322
|
+
animationType === "hover" && "animation-hover"
|
|
18323
|
+
].filter(Boolean).join(" ");
|
|
18324
|
+
return /* @__PURE__ */ jsxs(
|
|
18325
|
+
"div",
|
|
18326
|
+
{
|
|
18327
|
+
className: wrapperClasses,
|
|
18328
|
+
style: dynamicStyles,
|
|
18329
|
+
onMouseEnter: handleMouseEnter,
|
|
18330
|
+
onMouseLeave: handleMouseLeave,
|
|
18331
|
+
children: [
|
|
18332
|
+
/* @__PURE__ */ jsx$1("div", { className: "glow-background", style: glowBackgroundStyles }),
|
|
18333
|
+
/* @__PURE__ */ jsx$1("div", { className: "content-wrapper", children })
|
|
18334
|
+
]
|
|
18335
|
+
}
|
|
18336
|
+
);
|
|
18337
|
+
}
|
|
18338
|
+
);
|
|
18339
|
+
GradientGlow.displayName = "GradientGlow";
|
|
17874
18340
|
export {
|
|
17875
18341
|
Avatar,
|
|
17876
18342
|
Badge,
|
|
@@ -17879,6 +18345,7 @@ export {
|
|
|
17879
18345
|
Card,
|
|
17880
18346
|
Checkbox,
|
|
17881
18347
|
Dropdown,
|
|
18348
|
+
GradientGlow,
|
|
17882
18349
|
Input,
|
|
17883
18350
|
NewSlider,
|
|
17884
18351
|
SectionName,
|