react-loadly 1.1.2 → 2.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/README.md +67 -187
- package/dist/index.cjs.js +1 -1
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.d.ts +3 -19
- package/dist/index.esm.js +1 -1
- package/dist/index.esm.js.map +1 -1
- package/dist/types/@types/index.d.ts +0 -1
- package/dist/types/@types/index.d.ts.map +1 -1
- package/dist/types/@types/interfaces/ISkeletonLoaderProps.d.ts +4 -0
- package/dist/types/@types/interfaces/ISkeletonLoaderProps.d.ts.map +1 -1
- package/dist/types/@types/interfaces/index.d.ts +0 -1
- package/dist/types/@types/interfaces/index.d.ts.map +1 -1
- package/dist/types/components/organisms/SkeletonLoader.d.ts.map +1 -1
- package/dist/types/components/organisms/index.d.ts +1 -2
- package/dist/types/components/organisms/index.d.ts.map +1 -1
- package/package.json +1 -1
- package/dist/types/@types/interfaces/IShimmerLoaderProps.d.ts +0 -20
- package/dist/types/@types/interfaces/IShimmerLoaderProps.d.ts.map +0 -1
- package/dist/types/components/organisms/ShimmerLoader.d.ts +0 -4
- package/dist/types/components/organisms/ShimmerLoader.d.ts.map +0 -1
package/README.md
CHANGED
|
@@ -96,10 +96,9 @@ function App() {
|
|
|
96
96
|
|
|
97
97
|
### Modern Content Loaders
|
|
98
98
|
|
|
99
|
-
| Component | Description
|
|
100
|
-
| ---------------- |
|
|
101
|
-
| `SkeletonLoader` | Modern skeleton placeholders with shimmer effects. |
|
|
102
|
-
| `ShimmerLoader` | Sophisticated shimmer wave animations. |
|
|
99
|
+
| Component | Description |
|
|
100
|
+
| ---------------- | ---------------------------------------------------------------------------------------------- |
|
|
101
|
+
| `SkeletonLoader` | Modern skeleton placeholders with shimmer effects. with Sophisticated shimmer wave animations. |
|
|
103
102
|
|
|
104
103
|
### Organic & Text-Based Loaders
|
|
105
104
|
|
|
@@ -151,20 +150,22 @@ function App() {
|
|
|
151
150
|
|
|
152
151
|
### Skeleton Variants
|
|
153
152
|
|
|
153
|
+
The SkeletonLoader supports multiple variants to match different content types:
|
|
154
|
+
|
|
154
155
|
```jsx
|
|
155
|
-
// Line skeleton (default)
|
|
156
|
+
// Line skeleton (default) - for text content
|
|
156
157
|
<SkeletonLoader variant="line" lines={3} />
|
|
157
158
|
|
|
158
|
-
// Card skeleton
|
|
159
|
+
// Card skeleton - for image cards or content blocks
|
|
159
160
|
<SkeletonLoader variant="card" width={300} height={200} />
|
|
160
161
|
|
|
161
|
-
// Avatar skeleton
|
|
162
|
+
// Avatar skeleton - for profile images
|
|
162
163
|
<SkeletonLoader variant="avatar" size={60} />
|
|
163
164
|
|
|
164
|
-
// Text skeleton
|
|
165
|
+
// Text skeleton - for single line text
|
|
165
166
|
<SkeletonLoader variant="text" width="100%" height={16} />
|
|
166
167
|
|
|
167
|
-
// Custom skeleton
|
|
168
|
+
// Custom skeleton - for any custom shape
|
|
168
169
|
<SkeletonLoader
|
|
169
170
|
variant="custom"
|
|
170
171
|
width={200}
|
|
@@ -173,6 +174,16 @@ function App() {
|
|
|
173
174
|
/>
|
|
174
175
|
```
|
|
175
176
|
|
|
177
|
+
### Variant Details
|
|
178
|
+
|
|
179
|
+
| Variant | Use Case | Default Dimensions | Default Border Radius |
|
|
180
|
+
| -------- | ---------------------------------- | --------------------------- | --------------------- |
|
|
181
|
+
| `line` | Paragraphs, lists, general content | width: 100%, height: 16px | 4px |
|
|
182
|
+
| `card` | Images, cards, content blocks | width: 300px, height: 200px | 8px |
|
|
183
|
+
| `avatar` | Profile pictures, user icons | width: 40px, height: 40px | 50% (circular) |
|
|
184
|
+
| `text` | Single line text elements | width: 100%, height: 16px | 4px |
|
|
185
|
+
| `custom` | Any custom shape or element | width: 100%, height: 16px | 4px (customizable) |
|
|
186
|
+
|
|
176
187
|
### Customization Options
|
|
177
188
|
|
|
178
189
|
```jsx
|
|
@@ -183,163 +194,27 @@ function App() {
|
|
|
183
194
|
shimmerColor="rgba(255, 255, 255, 0.6)"
|
|
184
195
|
spacing="12px"
|
|
185
196
|
shimmer={true}
|
|
186
|
-
speed={1.5}
|
|
187
|
-
/>
|
|
188
|
-
```
|
|
189
|
-
|
|
190
|
-
---
|
|
191
|
-
|
|
192
|
-
## ✨ ShimmerLoader Component
|
|
193
|
-
|
|
194
|
-
The `ShimmerLoader` creates sophisticated wave-like animations perfect for modern UIs.
|
|
195
|
-
|
|
196
|
-
### Basic Usage
|
|
197
|
-
|
|
198
|
-
```jsx
|
|
199
|
-
import { ShimmerLoader } from "react-loadly";
|
|
200
|
-
|
|
201
|
-
function App() {
|
|
202
|
-
return (
|
|
203
|
-
<div>
|
|
204
|
-
{/* Basic shimmer */}
|
|
205
|
-
<ShimmerLoader />
|
|
206
|
-
|
|
207
|
-
{/* Multiple shimmer lines */}
|
|
208
|
-
<ShimmerLoader lines={3} />
|
|
209
|
-
|
|
210
|
-
{/* Card shimmer */}
|
|
211
|
-
<ShimmerLoader variant="card" width={300} height={200} />
|
|
212
|
-
</div>
|
|
213
|
-
);
|
|
214
|
-
}
|
|
215
|
-
```
|
|
216
|
-
|
|
217
|
-
### Shimmer Variants
|
|
218
|
-
|
|
219
|
-
```jsx
|
|
220
|
-
// Line shimmer (default)
|
|
221
|
-
<ShimmerLoader variant="line" lines={3} />
|
|
222
|
-
|
|
223
|
-
// Card shimmer
|
|
224
|
-
<ShimmerLoader variant="card" width={300} height={200} />
|
|
225
|
-
|
|
226
|
-
// Avatar shimmer
|
|
227
|
-
<ShimmerLoader variant="avatar" size={60} />
|
|
228
|
-
|
|
229
|
-
// Wave shimmer
|
|
230
|
-
<ShimmerLoader variant="wave" width="100%" height={20} />
|
|
231
|
-
|
|
232
|
-
// Text shimmer
|
|
233
|
-
<ShimmerLoader variant="text" width="100%" height={16} />
|
|
234
|
-
```
|
|
235
|
-
|
|
236
|
-
### Customization Options
|
|
237
|
-
|
|
238
|
-
```jsx
|
|
239
|
-
<ShimmerLoader
|
|
240
|
-
lines={3}
|
|
241
|
-
color="#f1f5f9"
|
|
242
|
-
highlightColor="#e2e8f0"
|
|
243
|
-
shimmerColor="rgba(255, 255, 255, 0.8)"
|
|
244
197
|
waveWidth="200px"
|
|
245
198
|
waveDirection="left-to-right"
|
|
246
|
-
speed={1.
|
|
199
|
+
speed={1.5}
|
|
247
200
|
/>
|
|
248
201
|
```
|
|
249
202
|
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
</ElementLoader>
|
|
266
|
-
);
|
|
267
|
-
}
|
|
268
|
-
```
|
|
269
|
-
|
|
270
|
-
### Animation Types
|
|
271
|
-
|
|
272
|
-
The ElementLoader supports multiple animation types:
|
|
273
|
-
|
|
274
|
-
```jsx
|
|
275
|
-
// Spin animation (default)
|
|
276
|
-
<ElementLoader animationType="spin">
|
|
277
|
-
<YourIconComponent />
|
|
278
|
-
</ElementLoader>
|
|
279
|
-
|
|
280
|
-
// Pulse animation
|
|
281
|
-
<ElementLoader animationType="pulse">
|
|
282
|
-
<YourIconComponent />
|
|
283
|
-
</ElementLoader>
|
|
284
|
-
|
|
285
|
-
// Glow animation
|
|
286
|
-
<ElementLoader animationType="glow">
|
|
287
|
-
<YourIconComponent />
|
|
288
|
-
</ElementLoader>
|
|
289
|
-
|
|
290
|
-
// Bounce animation
|
|
291
|
-
<ElementLoader animationType="bounce">
|
|
292
|
-
<YourIconComponent />
|
|
293
|
-
</ElementLoader>
|
|
294
|
-
|
|
295
|
-
// Flip animation
|
|
296
|
-
<ElementLoader animationType="flip">
|
|
297
|
-
<YourIconComponent />
|
|
298
|
-
</ElementLoader>
|
|
299
|
-
```
|
|
300
|
-
|
|
301
|
-
### Customization Options
|
|
302
|
-
|
|
303
|
-
``jsx
|
|
304
|
-
<ElementLoader size={80} color="#ff6b6b" speed={1.5} glowIntensity={0.5} showText loadingText="Loading...">
|
|
305
|
-
<YourCustomElement />
|
|
306
|
-
</ElementLoader>
|
|
307
|
-
|
|
308
|
-
```
|
|
309
|
-
|
|
310
|
-
### Fullscreen Mode
|
|
311
|
-
|
|
312
|
-
Like other loaders, ElementLoader supports fullscreen mode:
|
|
313
|
-
|
|
314
|
-
``jsx
|
|
315
|
-
<ElementLoader fullscreen loaderCenter screenBackground="rgba(0, 0, 0, 0.5)">
|
|
316
|
-
<YourIconComponent />
|
|
317
|
-
</ElementLoader>
|
|
318
|
-
```
|
|
319
|
-
|
|
320
|
-
### Props
|
|
321
|
-
|
|
322
|
-
| Prop | Type | Default | Description |
|
|
323
|
-
| ------------------ | ------------------------------------------------- | --------------------------- | ----------------------------------------------- |
|
|
324
|
-
| `children` | ReactNode | undefined | The React element to apply loading animation to |
|
|
325
|
-
| `animationType` | "spin" \| "pulse" \| "glow" \| "bounce" \| "flip" | "spin" | Type of animation to apply |
|
|
326
|
-
| `glowIntensity` | number (0-1) | 0.3 | Intensity of the glow effect |
|
|
327
|
-
| `size` | number \| string | 60 | Size of the loader |
|
|
328
|
-
| `width` | number \| string | undefined | Width of the loader (overrides size) |
|
|
329
|
-
| `height` | number \| string | undefined | Height of the loader (overrides size) |
|
|
330
|
-
| `color` | string | "var(--react-loadly-color)" | Primary color of the loader |
|
|
331
|
-
| `speed` | number | 1 | Animation speed multiplier |
|
|
332
|
-
| `loading` | boolean | true | Whether the loader is active |
|
|
333
|
-
| `className` | string | undefined | Custom CSS class name |
|
|
334
|
-
| `style` | CSSProperties | undefined | Custom inline styles |
|
|
335
|
-
| `aria-label` | string | "Loading..." | Accessibility label for screen readers |
|
|
336
|
-
| `showText` | boolean | false | Whether to show loading text |
|
|
337
|
-
| `loadingText` | string | undefined | Custom loading text |
|
|
338
|
-
| `fullscreen` | boolean | false | Enable fullscreen mode |
|
|
339
|
-
| `screenWidth` | number \| string | undefined | Screen width for fullscreen mode |
|
|
340
|
-
| `screenHeight` | number \| string | undefined | Screen height for fullscreen mode |
|
|
341
|
-
| `loaderCenter` | boolean | false | Center the loader in fullscreen mode |
|
|
342
|
-
| `screenBackground` | string | undefined | Background color for fullscreen mode |
|
|
203
|
+
### SkeletonLoader Props
|
|
204
|
+
|
|
205
|
+
| Prop | Type | Default | Description |
|
|
206
|
+
| ---------------- | ------------------------------------------------------------------------ | ----------------------- | ----------------------------------- |
|
|
207
|
+
| `lines` | number | 1 | Number of skeleton lines to display |
|
|
208
|
+
| `variant` | "line" \| "card" \| "avatar" \| "text" \| "custom" | "line" | Variant of skeleton to display |
|
|
209
|
+
| `width` | number \| string | varies by variant | Width of skeleton elements |
|
|
210
|
+
| `height` | number \| string | varies by variant | Height of skeleton elements |
|
|
211
|
+
| `borderRadius` | number \| string | varies by variant | Border radius of skeleton elements |
|
|
212
|
+
| `spacing` | number \| string | "8px" | Spacing between skeleton lines |
|
|
213
|
+
| `shimmer` | boolean | true | Whether to show shimmer animation |
|
|
214
|
+
| `shimmerColor` | string | "rgba(255,255,255,0.6)" | Shimmer effect color |
|
|
215
|
+
| `highlightColor` | string | "#f1f5f9" | Highlight color for shimmer effect |
|
|
216
|
+
| `waveWidth` | number \| string | "200px" | Shimmer wave width |
|
|
217
|
+
| `waveDirection` | "left-to-right" \| "right-to-left" \| "top-to-bottom" \| "bottom-to-top" | "left-to-right" | Direction of shimmer animation |
|
|
343
218
|
|
|
344
219
|
---
|
|
345
220
|
|
|
@@ -476,7 +351,7 @@ interface BaseLoaderProps {
|
|
|
476
351
|
|
|
477
352
|
React Loadly provides comprehensive TypeScript definitions for all components and hooks. You can import types and interfaces directly from the library:
|
|
478
353
|
|
|
479
|
-
|
|
354
|
+
``tsx
|
|
480
355
|
// ✅ Correct way to import shared interfaces
|
|
481
356
|
import type { IBaseLoaderProps, ISkeletonLoaderProps } from "react-loadly";
|
|
482
357
|
|
|
@@ -488,7 +363,8 @@ import type { IUseLoaderStateReturn } from "react-loadly/hooks";
|
|
|
488
363
|
|
|
489
364
|
// For animation types
|
|
490
365
|
import type { AnimationDirectionType } from "react-loadly";
|
|
491
|
-
|
|
366
|
+
|
|
367
|
+
````
|
|
492
368
|
|
|
493
369
|
All types are properly exported and can be used in your TypeScript projects for better type safety and autocompletion.
|
|
494
370
|
|
|
@@ -514,7 +390,7 @@ Display any loader in fullscreen mode with customizable dimensions and backgroun
|
|
|
514
390
|
loaderCenter={true}
|
|
515
391
|
screenBackground="rgba(0, 0, 0, 0.5)"
|
|
516
392
|
/>
|
|
517
|
-
|
|
393
|
+
````
|
|
518
394
|
|
|
519
395
|
---
|
|
520
396
|
|
|
@@ -523,26 +399,19 @@ Display any loader in fullscreen mode with customizable dimensions and backgroun
|
|
|
523
399
|
### Loading States for Different Content Types
|
|
524
400
|
|
|
525
401
|
``jsx
|
|
526
|
-
import { SkeletonLoader,
|
|
402
|
+
import { SkeletonLoader, SpinLoader, PulseLoader } from "react-loadly";
|
|
527
403
|
|
|
528
404
|
function ContentLoader() {
|
|
529
405
|
return (
|
|
530
406
|
|
|
531
407
|
<div>
|
|
532
|
-
{/_ Blog post loading _/}
|
|
408
|
+
{/_ Blog post loading Dashboard loading _/}
|
|
533
409
|
<div className="blog-post">
|
|
534
410
|
<SkeletonLoader variant="avatar" size={40} />
|
|
535
411
|
<SkeletonLoader lines={3} spacing="8px" />
|
|
536
412
|
<SkeletonLoader variant="card" width="100%" height={200} />
|
|
537
413
|
</div>
|
|
538
414
|
|
|
539
|
-
{/* Dashboard loading */}
|
|
540
|
-
<div className="dashboard">
|
|
541
|
-
<ShimmerLoader variant="card" width={300} height={150} />
|
|
542
|
-
<ShimmerLoader variant="card" width={300} height={150} />
|
|
543
|
-
<ShimmerLoader variant="card" width={300} height={150} />
|
|
544
|
-
</div>
|
|
545
|
-
|
|
546
415
|
{/* Button loading */}
|
|
547
416
|
<button disabled>
|
|
548
417
|
<SpinLoader size={16} />
|
|
@@ -588,17 +457,17 @@ function FormWithLoading() {
|
|
|
588
457
|
|
|
589
458
|
### Data Table Loading
|
|
590
459
|
|
|
591
|
-
|
|
460
|
+
``jsx
|
|
592
461
|
function DataTable({ data, loading }) {
|
|
593
|
-
|
|
594
|
-
|
|
595
|
-
|
|
596
|
-
|
|
597
|
-
|
|
598
|
-
|
|
599
|
-
|
|
600
|
-
|
|
601
|
-
|
|
462
|
+
if (loading) {
|
|
463
|
+
return (
|
|
464
|
+
<div className="data-table">
|
|
465
|
+
{/_ Header skeleton _/}
|
|
466
|
+
<div className="table-header">
|
|
467
|
+
{Array.from({ length: 5 }).map((\_, i) => (
|
|
468
|
+
<SkeletonLoader key={i} width={120} height={20} />
|
|
469
|
+
))}
|
|
470
|
+
</div>
|
|
602
471
|
|
|
603
472
|
{/* Row skeletons */}
|
|
604
473
|
{Array.from({ length: 10 }).map((_, i) => (
|
|
@@ -610,21 +479,32 @@ function DataTable({ data, loading }) {
|
|
|
610
479
|
))}
|
|
611
480
|
</div>
|
|
612
481
|
);
|
|
613
|
-
}
|
|
614
482
|
|
|
615
|
-
return <div className="data-table">{/* Actual table content */}</div>;
|
|
616
483
|
}
|
|
484
|
+
|
|
485
|
+
return <div className="data-table">{/_ Actual table content _/}</div>;
|
|
486
|
+
}
|
|
487
|
+
|
|
617
488
|
```
|
|
618
489
|
|
|
619
490
|
### Image Gallery Loading
|
|
620
491
|
|
|
621
|
-
|
|
492
|
+
``jsx
|
|
622
493
|
function ImageGallery({ images, loading }) {
|
|
623
494
|
if (loading) {
|
|
624
495
|
return (
|
|
625
496
|
<div className="image-gallery">
|
|
626
497
|
{Array.from({ length: 6 }).map((_, i) => (
|
|
627
|
-
<
|
|
498
|
+
<SkeletonLoader
|
|
499
|
+
key={i}
|
|
500
|
+
variant="card"
|
|
501
|
+
width={200}
|
|
502
|
+
height={200}
|
|
503
|
+
borderRadius="8px"
|
|
504
|
+
shimmer
|
|
505
|
+
shimmerColor="#f0f0f0"
|
|
506
|
+
waveDirection="left-to-right"
|
|
507
|
+
/>
|
|
628
508
|
))}
|
|
629
509
|
</div>
|
|
630
510
|
);
|
package/dist/index.cjs.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var e=require("react");function t(e,t){return{...e,...t}}function a(e,t="40px"){return void 0===e?t:"number"==typeof e?`${e}px`:e}function r(e,t=1){return`${e/Math.max(t,.1)}ms`}function i(){if("undefined"==typeof window||!window.matchMedia)return!1;try{return window.matchMedia("(prefers-reduced-motion: reduce)").matches}catch(e){return!1}}function n(e=1,t=!0){if("undefined"!=typeof process&&"test"===process.env.NODE_ENV)return{duration:"0ms",playState:"paused",iterationCount:1};const a=t&&i();return{duration:a?"0ms":r(1e3,e),playState:a?"paused":"running",iterationCount:a?1:"infinite"}}function o(e,t,a){return Math.min(Math.max(e,t),a)}function l(e){const t=/^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(e);return t?{r:parseInt(t[1],16),g:parseInt(t[2],16),b:parseInt(t[3],16)}:null}function s(e="loader"){return`${e}-${Math.random().toString(36).substr(2,9)}`}function d(e){if(null!=e)return"number"==typeof e?`${e}px`:"string"==typeof e?e.replace(/[<>'"]/g,""):void 0}function c(...e){return e.flat().filter(e=>"string"==typeof e&&e.trim()).join(" ")}const u=({size:t=8,color:r="var(--react-loadly-color)",opacity:i=1,className:n="",style:o={},animation:l,animationDuration:s,animationDelay:d,glowIntensity:c=0,"data-testid":u,...m})=>{const p=a(t),y={width:p,height:p,borderRadius:"50%",backgroundColor:r,opacity:i,animation:l?`${l} ${s||"1s"} infinite`:void 0,animationDelay:d,display:"inline-block",boxShadow:c>0?`0 0 ${10*c}px ${r}`:void 0,...o};return e.createElement("div",{className:`react-loadly-dot ${n}`.trim(),style:y,"data-testid":u,...m})},m=({width:t=30,height:r=4,color:i="var(--react-loadly-color)",opacity:n=1,borderRadius:o=2,className:l="",style:s={},animation:c,animationDuration:u,animationDelay:m,orientation:p="horizontal","data-testid":y,...g})=>{const h=a(t),f=a(r),x={width:"vertical"===p?f:h,height:"vertical"===p?h:f,backgroundColor:i,opacity:n,borderRadius:d(o),animation:c?`${c} ${u||"1s"} infinite`:void 0,animationDelay:m,display:"inline-block",...s};return e.createElement("div",{className:`react-loadly-line react-loadly-line-${p} ${l}`.trim(),style:x,"data-testid":y,...g})},p=({width:t=20,height:r=20,color:i="var(--react-loadly-color)",borderColor:n,borderWidth:o=0,borderRadius:l=0,opacity:s=1,className:c="",style:u={},animation:m,animationDuration:p,animationDelay:y,"data-testid":g,...h})=>{const f=a(t),x=a(r),v=d(o),b={width:f,height:x,backgroundColor:n?"transparent":i,border:n?`${v} solid ${n}`:void 0,borderRadius:d(l),opacity:s,animation:m?`${m} ${p||"1s"} infinite`:void 0,animationDelay:y,display:"inline-block",...u};return e.createElement("div",{className:`react-loadly-rectangle ${c}`.trim(),style:b,"data-testid":g,...h})},y=({size:t=20,color:r="var(--react-loadly-color)",borderColor:i,borderWidth:n=0,opacity:o=1,className:l="",style:s={},animation:c,animationDuration:u,animationDelay:m,"data-testid":p,...y})=>{const g=a(t),h=d(n),f={width:g,height:g,borderRadius:"50%",backgroundColor:i?"transparent":r,border:i?`${h} solid ${i}`:void 0,opacity:o,animation:c?`${c} ${u||"1s"} infinite`:void 0,animationDelay:m,display:"inline-block",...s};return e.createElement("div",{className:`react-loadly-circle ${l}`.trim(),style:f,"data-testid":p,...y})},g=({count:t=3,dotSize:i=8,color:n="var(--react-loadly-color)",secondaryColor:o,spacing:l=8,speed:s=1,arrangement:d="linear",className:c="",style:m={},animationType:p="wave","data-testid":y,...g})=>{const h=a(l),f=r(1200,s),x=e=>{if("circular"===d){const a=e/t*2*Math.PI,r=parseInt(h);return{position:"absolute",left:"50%",top:"50%",transform:`translate(-50%, -50%) translate(${Math.cos(a)*r}px, ${Math.sin(a)*r}px)`}}return{}},v=e=>.1*e/s+"s",b={...(()=>{switch(d){case"circular":return{display:"flex",alignItems:"center",justifyContent:"center",position:"relative",width:2*(parseInt(a(i))+parseInt(h))+"px",height:2*(parseInt(a(i))+parseInt(h))+"px"};case"grid":return{display:"grid",gridTemplateColumns:`repeat(${Math.ceil(Math.sqrt(t))}, 1fr)`,gap:h};default:return{display:"flex",alignItems:"center",gap:h}}})(),...m};return e.createElement("div",{className:`react-loadly-dot-cluster react-loadly-dot-cluster-${d} ${c}`.trim(),style:b,"data-testid":y,...g},Array.from({length:t},(t,a)=>e.createElement(u,{key:a,size:i,color:o&&a%2==1?o:n,animation:`react-loadly-${p}`,animationDuration:f,animationDelay:v(a),style:x(a),"data-testid":y?`${y}-dot-${a}`:void 0})))},h=({count:t=5,lineWidth:i=4,lineHeight:n=35,color:o="var(--react-loadly-color)",secondaryColor:l,spacing:s=6,speed:d=1,arrangement:c="parallel",orientation:u="vertical",className:p="",style:y={},animationType:g="wave","data-testid":h,...f})=>{const x=a(s),v=r(1e3,d),b=e=>{if("radial"===c){return{position:"absolute",left:"50%",top:"50%",transformOrigin:"center",transform:`translate(-50%, -50%) rotate(${e/t*2*Math.PI}rad)`}}if("staggered"===c){const r=.3+.7*Math.sin(e/t*Math.PI);return{height:"vertical"===u?parseInt(a(n))*r+"px":a(n)}}return{}},$=e=>.1*e/d+"s",w={...(()=>{switch(c){case"radial":return{display:"flex",alignItems:"center",justifyContent:"center",position:"relative",width:1.5*parseInt(a(n))+"px",height:1.5*parseInt(a(n))+"px"};case"staggered":return{display:"flex",alignItems:"flex-end",justifyContent:"center",gap:x};default:return{display:"flex",alignItems:"center",justifyContent:"center",gap:x}}})(),...y};return e.createElement("div",{className:`react-loadly-line-group react-loadly-line-group-${c} ${p}`.trim(),style:w,"data-testid":h,...f},Array.from({length:t},(t,a)=>e.createElement(m,{key:a,width:"horizontal"===u?i:n,height:"horizontal"===u?n:i,color:l&&a%2==1?l:o,orientation:u,animation:`react-loadly-${g}`,animationDuration:v,animationDelay:$(a),style:b(a),"data-testid":h?`${h}-line-${a}`:void 0})))},f={size:20,color:"var(--react-loadly-color)",speed:1,loading:!0,count:5,"aria-label":"Loading..."},x={size:60,color:"var(--react-loadly-color)",speed:1,loading:!0,fluidity:1,amplitude:1,"aria-label":"Loading..."},v={size:15,color:"var(--react-loadly-color)",speed:1,loading:!0,count:3,"aria-label":"Loading..."},b={size:12,color:"var(--react-loadly-color)",speed:1,loading:!0,count:3,"aria-label":"Loading..."},$={size:60,speed:1,loading:!0,animationType:"spin",glowIntensity:.3,"aria-label":"Loading..."},w=({className:t=""})=>e.createElement("svg",{className:t,fill:"currentColor",viewBox:"0 0 20 20",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true"},e.createElement("path",{clipRule:"evenodd",fillRule:"evenodd",d:"M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-8-3a1 1 0 00-.867.5 1 1 0 11-1.731-1A3 3 0 0113 8a3.001 3.001 0 01-2 2.83V11a1 1 0 11-2 0v-1a1 1 0 011-1 1 1 0 100-2zm0 8a1 1 0 100-2 1 1 0 000 2z"})),E=({className:t=""})=>e.createElement("svg",{className:t,fill:"currentColor",viewBox:"0 0 20 20",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true"},e.createElement("path",{fillRule:"evenodd",d:"M9.243 3.03a1 1 0 01.727 1.213L9.53 6h2.94l.56-2.243a1 1 0 111.94.486L14.53 6H16a1 1 0 110 2h-1.97l-1 4H15a1 1 0 110 2h-2.47l-.56 2.242a1 1 0 11-1.94-.485L10.47 14H7.53l-.56 2.242a1 1 0 11-1.94-.485L5.47 14H4a1 1 0 110-2h1.97l1-4H5a1 1 0 110-2h2.47l.56-2.243a1 1 0 011.213-.727zM9.03 8l-1 4h2.94l1-4H9.03z",clipRule:"evenodd"})),C=({className:t=""})=>e.createElement("svg",{className:t,fill:"currentColor",viewBox:"0 0 20 20",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true"},e.createElement("path",{fillRule:"evenodd",d:"M10 18a8 8 0 100-16 8 8 0 000 16zm1-12a1 1 0 10-2 0v4a1 1 0 00.293.707l2.828 2.829a1 1 0 101.415-1.415L11 9.586V6z",clipRule:"evenodd"})),k={size:60,color:"var(--react-loadly-color)",speed:1,loading:!0,fluidity:1,amplitude:1,"aria-label":"Loading..."},N={size:40,color:"var(--react-loadly-color)",speed:1,loading:!0,count:4,"aria-label":"Loading..."},I={size:60,color:"var(--react-loadly-color)",speed:1,loading:!0,fluidity:1,amplitude:1,"aria-label":"Loading..."},L={size:60,speed:1,loading:!0,animationType:"spin",glowIntensity:.3,"aria-label":"Loading...",alt:"Loading"},z={size:40,color:"var(--react-loadly-color)",speed:1,loading:!0,count:3,"aria-label":"Loading..."},M={size:60,color:"var(--react-loadly-color)",speed:1,loading:!0,borderWidth:4,"aria-label":"Loading..."},T={size:15,color:"var(--react-loadly-color)",speed:1,loading:!0,count:2,"aria-label":"Loading..."},R={size:40,speed:1,loading:!0,lines:1,variant:"card",color:"#f1f5f9",highlightColor:"#e2e8f0",shimmerColor:"rgba(255, 255, 255, 0.8)",borderRadius:"4px",spacing:"8px",waveWidth:"200px",waveDirection:"left-to-right","aria-label":"Loading content..."},D={size:40,speed:1,loading:!0,lines:1,variant:"line",shimmer:!0,color:"#e2e8f0",highlightColor:"#f1f5f9",shimmerColor:"rgba(255, 255, 255, 0.6)",borderRadius:"4px",spacing:"8px","aria-label":"Loading content..."},j={size:40,color:"var(--react-loadly-color)",speed:1,loading:!0,borderWidth:4,"aria-label":"Loading..."},S={speed:1,loading:!0,charDelay:100,"aria-label":"Loading...",loop:!0},W={size:40,color:"var(--react-loadly-color)",speed:1,loading:!0,count:5,"aria-label":"Loading..."},B=(t={})=>{const{initialLoading:a=!1,timeout:r,maxRetries:i=3,onLoadingChange:n,onError:o,onProgress:l}=t,[s,d]=e.useState({isLoading:a,progress:0,error:null,retryCount:0}),c=e.useRef(null),u=e.useRef(null);e.useEffect(()=>()=>{c.current&&clearTimeout(c.current),u.current&&clearTimeout(u.current)},[]),e.useEffect(()=>(s.isLoading&&r?c.current=setTimeout(()=>{d(e=>({...e,isLoading:!1,error:"Loading timeout exceeded"})),o?.("Loading timeout exceeded")},r):c.current&&clearTimeout(c.current),()=>{c.current&&clearTimeout(c.current)}),[s.isLoading,r,o]),e.useEffect(()=>{n?.(s.isLoading)},[s.isLoading,n]),e.useEffect(()=>{void 0!==s.progress&&l?.(s.progress)},[s.progress,l]);const m=e.useCallback(e=>{d(t=>({...t,isLoading:e,error:e?null:t.error,progress:e?0:t.progress}))},[]),p=e.useCallback(e=>{const t=Math.min(Math.max(e,0),100);d(e=>({...e,progress:t,isLoading:!(t>=100)&&e.isLoading}))},[]),y=e.useCallback(e=>{d(t=>({...t,error:e,isLoading:!1})),e&&o?.(e)},[o]),g=e.useCallback(()=>{d(e=>{const t=(e.retryCount||0)+1;return t>i?(o?.("Maximum retry attempts exceeded"),{...e,error:"Maximum retry attempts exceeded",isLoading:!1}):{...e,retryCount:t,isLoading:!0,error:null,progress:0}});const e=Math.min(1e3*Math.pow(2,s.retryCount||0),3e4);u.current=setTimeout(()=>{d(e=>({...e,isLoading:!0}))},e)},[s.retryCount,i,o]),h=e.useCallback(()=>{d({isLoading:!1,progress:0,error:null,retryCount:0}),c.current&&clearTimeout(c.current),u.current&&clearTimeout(u.current)},[]);return{state:s,setLoading:m,setProgress:p,setError:y,retry:g,reset:h}};exports.BarsLoader=r=>{const i=t(f,r),{size:o,color:l,speed:d,loading:u,className:m="",style:p={},count:y=5,showText:g,loadingText:h="Loading...","aria-label":x,"data-testid":v,fullscreen:b,screenWidth:$,screenHeight:w,loaderCenter:E,screenBackground:C,...k}=i,N=e.useMemo(()=>s("bars-loader"),[]),I=a(o),L=n(d);if(!u)return null;const z={display:"inline-flex",flexDirection:"column",alignItems:"center",...p,...b&&{position:"fixed",top:0,left:0,width:$||"100vw",height:w||"100vh",backgroundColor:C||"var(--react-loadly-background)",zIndex:9999,justifyContent:E?"center":p.justifyContent}},M={width:"4px",height:I,backgroundColor:l,borderRadius:"2px",animation:`react-loadly-bars ${L.duration} ease-in-out infinite`,animationPlayState:L.playState},T=Array.from({length:y}).map((t,a)=>{const r=.1*a+"s",i=.5+a%3*.25;return e.createElement("div",{key:a,style:{...M,animationDelay:r,height:parseFloat(I)*i+"px"},"data-testid":v?`${v}-bar-${a}`:void 0})});return e.createElement("div",{className:c("react-loadly react-loadly-bars",m),style:z,role:"status","aria-label":x,"aria-live":"polite","aria-busy":u,"data-testid":v,...k},e.createElement("div",{style:{display:"flex",justifyContent:"center",alignItems:"center",gap:"4px"}},T),g&&e.createElement("div",{className:"react-loadly-text",id:`${N}-text`,"aria-live":"polite"},h),e.createElement("span",{className:"react-loadly-sr-only"},x))},exports.BlobLoader=i=>{const n=t(x,i),{size:o,color:l,secondaryColor:d,speed:u,loading:m,fluidity:p,amplitude:y,className:g="",style:h={},showText:f,loadingText:v="Loading...","aria-label":b,"data-testid":$,...w}=n,E=e.useMemo(()=>s("blob-loader"),[]),C=a(o),k=r(2500,u);if(!m)return null;const N={display:"inline-flex",flexDirection:"column",alignItems:"center",...h},I={width:C,height:C,background:`linear-gradient(45deg, ${l}, ${d||l})`,borderRadius:"30% 70% 70% 30% / 30% 30% 70% 70%",animation:`blob-morph ${k} ease-in-out infinite`,filter:"blur(1px)",position:"relative"},L={position:"absolute",top:"20%",left:"20%",width:"60%",height:"60%",background:`radial-gradient(circle, ${d||l}, transparent)`,borderRadius:"40% 60% 60% 40% / 40% 40% 60% 60%",animation:`blob-inner ${k} ease-in-out infinite reverse`,opacity:.7};return e.createElement(e.Fragment,null,e.createElement("style",null,`\n @keyframes blob-morph {\n 0%, 100% {\n border-radius: 30% 70% 70% 30% / 30% 30% 70% 70%;\n transform: scale(1) rotate(0deg);\n }\n 25% {\n border-radius: 58% 42% 75% 25% / 76% 46% 54% 24%;\n transform: scale(${1+.1*(y??1)}) rotate(90deg);\n }\n 50% {\n border-radius: 50% 50% 33% 67% / 55% 27% 73% 45%;\n transform: scale(${1-.05*(y??1)}) rotate(180deg);\n }\n 75% {\n border-radius: 33% 67% 58% 42% / 63% 68% 32% 37%;\n transform: scale(${1+.08*(y??1)}) rotate(270deg);\n }\n }\n \n @keyframes blob-inner {\n 0%, 100% {\n border-radius: 40% 60% 60% 40% / 40% 40% 60% 60%;\n transform: scale(1) rotate(0deg);\n }\n 33% {\n border-radius: 70% 30% 50% 50% / 30% 70% 30% 70%;\n transform: scale(${1.1+.1*(p??1)}) rotate(-120deg);\n }\n 66% {\n border-radius: 30% 70% 40% 60% / 70% 30% 70% 30%;\n transform: scale(${.9+.05*(p??1)}) rotate(-240deg);\n }\n }\n `),e.createElement("div",{className:c("react-loadly react-loadly-blob",g),style:N,role:"status","aria-label":b,"aria-live":"polite","aria-busy":m,"data-testid":$,...w},e.createElement("div",{style:I,"data-testid":$?`${$}-blob`:void 0},e.createElement("div",{style:L})),f&&e.createElement("div",{className:"react-loadly-text",id:`${E}-text`,"aria-live":"polite"},v),e.createElement("span",{className:"react-loadly-sr-only"},b)))},exports.BounceLoader=r=>{const i=t(v,r),{size:o,color:l,speed:d,loading:u,className:m="",style:p={},count:y=3,showText:g,loadingText:h="Loading...","aria-label":f,"data-testid":x,fullscreen:b,screenWidth:$,screenHeight:w,loaderCenter:E,screenBackground:C,...k}=i,N=e.useMemo(()=>s("bounce-loader"),[]),I=a(o),L=n(d);if(!u)return null;const z={display:"inline-flex",flexDirection:"column",alignItems:"center",...p,...b&&{position:"fixed",top:0,left:0,width:$||"100vw",height:w||"100vh",backgroundColor:C||"var(--react-loadly-background)",zIndex:9999,justifyContent:E?"center":p.justifyContent}},M={width:I,height:I,borderRadius:"50%",backgroundColor:l,animation:`react-loadly-bounce ${L.duration} ease-in-out infinite`,animationPlayState:L.playState},T=Array.from({length:y}).map((t,a)=>{const r=.1*a+"s";return e.createElement("div",{key:a,style:{...M,animationDelay:r},"data-testid":x?`${x}-ball-${a}`:void 0})});return e.createElement("div",{className:c("react-loadly react-loadly-bounce",m),style:z,role:"status","aria-label":f,"aria-live":"polite","aria-busy":u,"data-testid":x,...k},e.createElement("div",{style:{display:"flex",justifyContent:"center",alignItems:"center",gap:"8px"}},T),g&&e.createElement("div",{className:"react-loadly-text",id:`${N}-text`,"aria-live":"polite"},h),e.createElement("span",{className:"react-loadly-sr-only"},f))},exports.Circle=y,exports.Dot=u,exports.DotCluster=g,exports.DotsLoader=r=>{const i=t(b,r),{size:o,color:l,speed:d,loading:u,className:m="",style:p={},count:y=3,showText:g,loadingText:h="Loading...","aria-label":f,"data-testid":x,fullscreen:v,screenWidth:$,screenHeight:w,loaderCenter:E,screenBackground:C,...k}=i,N=e.useMemo(()=>s("dots-loader"),[]),I=a(o),L=n(d);if(!u)return null;const z={display:"inline-flex",flexDirection:"column",alignItems:"center",...p,...v&&{position:"fixed",top:0,left:0,width:$||"100vw",height:w||"100vh",backgroundColor:C||"var(--react-loadly-background)",zIndex:9999,justifyContent:E?"center":p.justifyContent}},M={width:I,height:I,borderRadius:"50%",backgroundColor:l,animation:`react-loadly-dots ${L.duration} ease-in-out infinite`,animationPlayState:L.playState},T=Array.from({length:y}).map((t,a)=>{const r=.2*a+"s";return e.createElement("div",{key:a,style:{...M,animationDelay:r},"data-testid":x?`${x}-dot-${a}`:void 0})});return e.createElement("div",{className:c("`react-loadly react-loadly-dots",m),style:z,role:"status","aria-label":f,"aria-live":"polite","aria-busy":u,"data-testid":x,...k},e.createElement("div",{style:{display:"flex",justifyContent:"center",alignItems:"center",gap:"6px"}},T),g&&e.createElement("div",{className:"react-loadly-text",id:`${N}-text`,"aria-live":"polite"},h),e.createElement("span",{className:"react-loadly-sr-only"},f))},exports.ElementLoader=a=>{const i=t($,a),{size:n,width:o,height:l,speed:s=1,loading:d,animationType:u,glowIntensity:m,className:p="",style:y={},color:g="var(--react-loadly-color)","aria-label":h,loadingText:f,showText:x,"data-testid":v,fullscreen:b,screenWidth:w,screenHeight:E,loaderCenter:C,screenBackground:k,children:N,...I}=i;if(!d)return null;const L={display:"inline-flex",flexDirection:"column",alignItems:"center",...y,...b&&{position:"fixed",top:0,left:0,width:w||"100vw",height:E||"100vh",backgroundColor:k||"var(--react-loadly-background)",zIndex:9999,justifyContent:C?"center":y.justifyContent}},z=o||n,M=l||n,T={width:"number"==typeof z?`${z}px`:z,height:"number"==typeof M?`${M}px`:M,animation:(()=>{switch(u){case"pulse":return`react-loadly-pulse ${r(2e3,s)} infinite`;case"glow":return`react-loadly-glow ${r(2e3,s)} infinite`;case"bounce":return`react-loadly-bounce ${r(2e3,s)} infinite`;case"flip":return`react-loadly-flip ${r(2e3,s)} infinite`;default:return`react-loadly-spin ${r(2e3,s)} infinite`}})(),filter:(m??0)>0?`drop-shadow(0 0 ${20*(m??0)}px ${g})`:void 0,transformStyle:"preserve-3d",willChange:"transform",display:"flex",alignItems:"center",justifyContent:"center"},R={position:"absolute",top:"50%",left:"50%",width:"60%",height:"60%",borderRadius:"50%",backgroundColor:g,opacity:.3,transform:"translate(-50%, -50%)",animation:`react-loadly-pulse ${r(1500,1.5*s)} infinite`,zIndex:-1},D={position:"absolute",top:"50%",left:"50%",width:"120%",height:"120%",borderRadius:"50%",border:`2px solid ${g}`,opacity:.2,transform:"translate(-50%, -50%)",animation:`react-loadly-spin ${r(3e3,.8*s)} infinite reverse`,zIndex:-2};return e.createElement("div",{className:c("`react-loadly react-loadly-element-loader",p),style:L,role:"status","aria-label":h,"aria-live":"polite","aria-busy":d,"data-testid":v,...I},e.createElement("div",{style:{position:"relative",display:"flex",alignItems:"center",justifyContent:"center"}},e.createElement("div",{style:D}),e.createElement("div",{style:R}),e.createElement("div",{style:T,className:"react-loadly-element","data-testid":v?`${v}-element`:void 0},N)),x&&e.createElement("div",{className:"react-loadly-text","aria-live":"polite"},f||h),e.createElement("span",{className:"react-loadly-sr-only"},h))},exports.FallbackLoader=({error:t="Something went wrong",onRetry:a,showRetry:r=!0,children:i,type:n="error",className:o="",style:l={},fullscreen:s,screenWidth:d,screenHeight:c,loaderCenter:u,screenBackground:m,...p})=>{const y={...l,...s&&{position:"fixed",top:0,left:0,width:d||"100vw",height:c||"100vh",backgroundColor:m||"var(--react-loadly-error-background)",zIndex:9999,display:"flex",flexDirection:"column",alignItems:"center",justifyContent:u?"center":l.justifyContent}};return i?e.createElement("div",{className:`react-loadly-fallback ${o}`.trim(),style:y,...p},i):e.createElement("div",{className:`react-loadly-error ${o}`.trim(),style:y,role:"alert","aria-live":"polite",...p},(()=>{switch(n){case"network":return e.createElement(E,{className:"react-loadly-error-icon"});case"timeout":return e.createElement(C,{className:"react-loadly-error-icon"});default:return e.createElement(w,{className:"react-loadly-error-icon"})}})(),e.createElement("p",{className:"react-loadly-error-message"},(()=>{switch(n){case"network":return t||"Network connection failed. Please check your internet connection.";case"timeout":return t||"Loading timeout. The operation took too long to complete.";default:return t||"Something went wrong. Please try again."}})()),r&&a&&e.createElement("button",{className:"react-loadly-retry-button",onClick:a,type:"button","aria-label":"Retry loading"},"Try Again"))},exports.FlowLoader=i=>{const n=t(k,i),{size:o,color:l,secondaryColor:d,speed:u,loading:m,amplitude:p,className:y="",style:g={},showText:h,loadingText:f="Loading...","aria-label":x,"data-testid":v,fullscreen:b,screenWidth:$,screenHeight:w,loaderCenter:E,screenBackground:C,...N}=n,I=e.useMemo(()=>s("flow-loader"),[]),L=a(o),z=parseInt(L),M=Math.max(.4*z,10),T=r(1500,u);if(!m)return null;const R={display:"inline-flex",flexDirection:"column",alignItems:"center",...g,...b&&{position:"fixed",top:0,left:0,width:$||"100vw",height:w||"100vh",backgroundColor:C||"var(--react-loadly-background)",zIndex:9999,justifyContent:E?"center":g.justifyContent}},D={width:L,height:`${M}px`,position:"relative",overflow:"hidden",borderRadius:`${Math.max(.2*z,4)}px`,backgroundColor:"rgba(0, 0, 0, 0.1)"},j=Math.max(Math.floor(z/15),3);return e.createElement(e.Fragment,null,e.createElement("style",null,`\n @keyframes flow-particle-${I} {\n 0% {\n transform: translateX(0) translateY(0) scale(0);\n opacity: 0;\n }\n 10% {\n transform: translateX(${Math.min(.1*z,10)}px) translateY(${Math.sin(.1)*(p??Math.min(5,M/4))}px) scale(1);\n opacity: 0.8;\n }\n 50% {\n transform: translateX(${Math.min(.5*z,.7*z)}px) translateY(${Math.sin(.5)*(p??Math.min(5,M/4))}px) scale(1);\n opacity: 0.8;\n }\n 90% {\n transform: translateX(${Math.min(.9*z,z-10)}px) translateY(${Math.sin(.9)*(p??Math.min(5,M/4))}px) scale(1);\n opacity: 0.8;\n }\n 100% {\n transform: translateX(${z}px) translateY(${Math.sin(1)*(p??Math.min(5,M/4))}px) scale(0);\n opacity: 0;\n }\n }\n `),e.createElement("div",{className:c("react-loadly react-loadly-flow",y),style:R,role:"status","aria-label":x,"aria-live":"polite","aria-busy":m,"data-testid":v,...N},e.createElement("div",{style:D,"data-testid":v?`${v}-container`:void 0},Array.from({length:j},(t,a)=>(t=>{const a=.2*t/(u??1),r=parseFloat(T)+100*t,i=Math.max(z/10,4),n=i+t%3*(i/2);return e.createElement("div",{key:t,style:{position:"absolute",width:`${n}px`,height:`${n}px`,borderRadius:"50%",background:t%2==0?l:d||l,animation:`flow-particle-${I} ${r}ms ease-in-out infinite`,animationDelay:`${a}s`,opacity:.8-.1*t,left:"0px",top:(M-n)/2+t%3*(M/(j+1))+"px"},"data-testid":v?`${v}-particle-${t}`:void 0})})(a))),h&&e.createElement("div",{className:"react-loadly-text",id:`${I}-text`,"aria-live":"polite"},f),e.createElement("span",{className:"react-loadly-sr-only"},x)))},exports.GridLoader=r=>{const i=t(N,r),{size:n,color:o,secondaryColor:l,speed:d=1,loading:u,count:m,className:p="",style:y={},showText:g,loadingText:h="Loading...","aria-label":f,"data-testid":x,fullscreen:v,screenWidth:b,screenHeight:$,loaderCenter:w,screenBackground:E,...C}=i,k=e.useMemo(()=>s("grid-loader"),[]),I=e.useMemo(()=>{const e="number"==typeof n?n:parseInt(a(n)),t=Math.ceil(Math.sqrt(m||4));return Math.max(e/(1.5*t),8)},[n,m]);if(!u)return null;const L={display:"inline-flex",flexDirection:"column",alignItems:"center",...y,...v&&{position:"fixed",top:0,left:0,width:b||"100vw",height:$||"100vh",backgroundColor:E||"var(--react-loadly-background)",zIndex:9999,justifyContent:w?"center":y.justifyContent}};return e.createElement("div",{className:c("react-loadly react-loadly-grid",p),style:L,role:"status","aria-label":f,"aria-live":"polite","aria-busy":u,"data-testid":x,...C},e.createElement("div",{className:"react-loadly-grid-container",style:{display:"grid",gridTemplateColumns:`repeat(${Math.ceil(Math.sqrt(m||4))}, 1fr)`,gap:I/3+"px"},"data-testid":x?`${x}-grid`:void 0},Array.from({length:m||4}).map((t,a)=>e.createElement("div",{key:a,className:"react-loadly-grid-item",style:{width:`${I}px`,height:`${I}px`,backgroundColor:a%2==0?o:l||o,borderRadius:"20%",animation:`react-loadly-scale ${1.2/(d||1)}s ease-in-out infinite`,animationDelay:.1*a/(d||1)+"s"}}))),g&&e.createElement("div",{className:"react-loadly-text",id:`${k}-text`,"aria-live":"polite"},h),e.createElement("span",{className:"react-loadly-sr-only"},f))},exports.Line=m,exports.LineGroup=h,exports.LiquidLoader=i=>{const n=t(I,i),{size:o,color:l,secondaryColor:d,speed:u,loading:m,amplitude:p,className:y="",style:g={},showText:h,loadingText:f="Loading...","aria-label":x,"data-testid":v,fullscreen:b,screenWidth:$,screenHeight:w,loaderCenter:E,screenBackground:C,...k}=n,N=e.useMemo(()=>s("liquid-loader"),[]),L=a(o),z=r(2e3,u);if(!m)return null;const M={display:"inline-flex",flexDirection:"column",alignItems:"center",...g,...b&&{position:"fixed",top:0,left:0,width:$||"100vw",height:w||"100vh",backgroundColor:C||"var(--react-loadly-background)",zIndex:9999,justifyContent:E?"center":g.justifyContent}},T={width:L,height:L,position:"relative",overflow:"hidden",borderRadius:"50%",backgroundColor:"rgba(0, 0, 0, 0.1)"},R=50-10*(p??1),D={position:"absolute",bottom:0,left:0,width:"200%",height:"200%",background:`linear-gradient(180deg, ${l} 0%, ${d||l} 100%)`,borderRadius:"40%",animation:`react-loadly-liquid-wave ${z} ease-in-out infinite`,transform:"translate(-25%, 50%) rotate(0deg)",animationTimingFunction:"cubic-bezier(0.36, 0.45, 0.63, 0.53)"},j={...D,background:`linear-gradient(180deg, ${d||l} 0%, ${l} 100%)`,animation:`react-loadly-liquid-wave ${z} ease-in-out infinite reverse`,animationDelay:-.5/(u??1)+"s",opacity:.8};return e.createElement(e.Fragment,null,e.createElement("style",null,`\n @keyframes react-loadly-liquid-wave {\n 0%, 100% {\n transform: translate(-25%, 50%) rotate(0deg);\n }\n 50% {\n transform: translate(-25%, ${R}%) rotate(180deg);\n }\n }\n `),e.createElement("div",{className:c("react-loadly react-loadly-liquid",y),style:M,role:"status","aria-label":x,"aria-live":"polite","aria-busy":m,"data-testid":v,...k},e.createElement("div",{style:T,"data-testid":v?`${v}-container`:void 0},e.createElement("div",{style:D}),e.createElement("div",{style:j})),h&&e.createElement("div",{className:"react-loadly-text",id:`${N}-text`,"aria-live":"polite"},f),e.createElement("span",{className:"react-loadly-sr-only"},x)))},exports.LogoSpinLoader=a=>{const i=t(L,a),{src:n,alt:o,size:l,speed:s,loading:d,animationType:u,glowIntensity:m,className:p="",style:y={},color:g="var(--react-loadly-color)","aria-label":h,loadingText:f,showText:x,"data-testid":v,fullscreen:b,screenWidth:$,screenHeight:w,loaderCenter:E,screenBackground:C,...k}=i;if(!d)return null;const N={display:"inline-flex",flexDirection:"column",alignItems:"center",...y,...b&&{position:"fixed",top:0,left:0,width:$||"100vw",height:w||"100vh",backgroundColor:C||"var(--react-loadly-background)",zIndex:9999,justifyContent:E?"center":y.justifyContent}},I={width:"number"==typeof l?`${l}px`:l,height:"number"==typeof l?`${l}px`:l,animation:`react-loadly-${u} ${r(2e3,s)} infinite`,filter:(m??0)>0?`drop-shadow(0 0 ${20*(m??0)}px ${g})`:void 0};return e.createElement("div",{className:c("`react-loadly react-loadly-logo-spin",p),style:N,role:"status","aria-label":h,"aria-live":"polite","aria-busy":d,"data-testid":v,...k},e.createElement("img",{src:n,alt:o,style:I,className:"react-loadly-logo","data-testid":v?`${v}-logo`:void 0}),x&&e.createElement("div",{className:"react-loadly-text","aria-live":"polite"},f||h),e.createElement("span",{className:"react-loadly-sr-only"},h))},exports.PulseLoader=r=>{const i=t(z,r),{size:n,color:o,secondaryColor:l,speed:d,loading:u,count:m,className:p="",style:y={},showText:h,loadingText:f="Loading...","aria-label":x,"data-testid":v,fullscreen:b,screenWidth:$,screenHeight:w,loaderCenter:E,screenBackground:C,...k}=i,N=e.useMemo(()=>s("pulse-loader"),[]),I=e.useMemo(()=>{const e="number"==typeof n?n:parseInt(a(n));return Math.max(e/5,6)},[n]);if(!u)return null;const L={display:"inline-flex",flexDirection:"column",alignItems:"center",...y,...b&&{position:"fixed",top:0,left:0,width:$||"100vw",height:w||"100vh",backgroundColor:C||"var(--react-loadly-background)",zIndex:9999,justifyContent:E?"center":y.justifyContent}};return e.createElement("div",{className:c("react-loadly react-loadly-pulse",p),style:L,role:"status","aria-label":x,"aria-live":"polite","aria-busy":u,"data-testid":v,...k},e.createElement(g,{count:m,dotSize:I,color:o,secondaryColor:l,speed:d,arrangement:"linear",animationType:"pulse",spacing:I/2,"data-testid":v?`${v}-dots`:void 0}),h&&e.createElement("div",{className:"react-loadly-text",id:`${N}-text`,"aria-live":"polite"},f),e.createElement("span",{className:"react-loadly-sr-only"},x))},exports.Rectangle=p,exports.RingLoader=r=>{const i=t(M,r),{size:o,color:l,speed:d,loading:u,className:m="",style:p={},borderWidth:y,showText:g,loadingText:h="Loading...","aria-label":f,"data-testid":x,fullscreen:v,screenWidth:b,screenHeight:$,loaderCenter:w,screenBackground:E,...C}=i,k=e.useRef(s("ring-loader")),N=a(o),I=n(d);if(!u)return null;const L={display:"inline-flex",flexDirection:"column",alignItems:"center",...p,...v&&{position:"fixed",top:0,left:0,width:b||"100vw",height:$||"100vh",backgroundColor:E||"var(--react-loadly-background)",zIndex:9999,justifyContent:w?"center":p.justifyContent}},z={position:"relative",width:N,height:N},T={boxSizing:"border-box",display:"block",position:"absolute",width:N,height:N,border:`${y}px solid transparent`,borderTop:`${y}px solid ${l}`,borderBottom:`${y}px solid ${l}`,borderRadius:"50%",animation:`react-loadly-ring ${I.duration} cubic-bezier(0.5, 0, 0.5, 1) infinite`,animationPlayState:I.playState},R=Array.from({length:4}).map((t,a)=>{const r=90*a+"deg",i=-.15*a+"s";return e.createElement("div",{key:a,style:{...T,transform:`rotate(${r})`,animationDelay:i},"data-testid":x?`${x}-segment-${a}`:void 0})});return e.createElement("div",{className:c("react-loadly react-loadly-ring",m),style:L,role:"status","aria-label":f,"aria-live":"polite","aria-busy":u,"data-testid":x,...C},e.createElement("div",{style:z},R),g&&e.createElement("div",{className:"react-loadly-text",id:`${k.current}-text`,"aria-live":"polite"},h),e.createElement("span",{className:"react-loadly-sr-only"},f))},exports.RotateLoader=r=>{const i=t(T,r),{size:o,color:l,speed:d,loading:u,className:m="",style:p={},count:y=2,showText:g,loadingText:h="Loading...","aria-label":f,"data-testid":x,fullscreen:v,screenWidth:b,screenHeight:$,loaderCenter:w,screenBackground:E,...C}=i,k=e.useMemo(()=>s("rotate-loader"),[]),N=a(o),I=n(d);if(!u)return null;const L={display:"inline-flex",flexDirection:"column",alignItems:"center",...p,...v&&{position:"fixed",top:0,left:0,width:b||"100vw",height:$||"100vh",backgroundColor:E||"var(--react-loadly-background)",zIndex:9999,justifyContent:w?"center":p.justifyContent}},z={position:"relative",width:N,height:N},M={position:"absolute",width:N,height:N,border:"2px solid transparent",borderTopColor:l,borderBottomColor:l,borderRadius:"50%",animation:`react-loadly-ring ${I.duration} cubic-bezier(0.5, 0, 0.5, 1) infinite`,animationPlayState:I.playState,transform:"rotate(0deg)"},R=Array.from({length:y}).map((t,a)=>{const r=1-.2*a,i=2+a,n=-.15*a+"s";return e.createElement("div",{key:a,style:{...M,width:parseFloat(N)*r+"px",height:parseFloat(N)*r+"px",borderWidth:`${i}px`,animationDuration:parseFloat(I.duration)*(1+.5*a)+"ms",animationDelay:n},"data-testid":x?`${x}-element-${a}`:void 0})});return e.createElement("div",{className:c("react-loadly react-loadly-rotate",m),style:L,role:"status","aria-label":f,"aria-live":"polite","aria-busy":u,"data-testid":x,...C},e.createElement("div",{style:z},R),g&&e.createElement("div",{className:"react-loadly-text",id:`${k}-text`,"aria-live":"polite"},h),e.createElement("span",{className:"react-loadly-sr-only"},f))},exports.ShapeGroup=({count:t=4,shapeSize:i=16,color:n="var(--react-loadly-color)",secondaryColor:o,spacing:l=8,speed:s=1,arrangement:d="linear",shapeTypes:c=["circle","rectangle"],className:u="",style:m={},animationType:g="pulse",borderWidth:h=0,"data-testid":f,...x})=>{const v=a(l),b=r(800,s),$=e=>{if("circular"===d){const a=e/t*2*Math.PI,r=2*parseInt(v);return{position:"absolute",left:"50%",top:"50%",transform:`translate(-50%, -50%) translate(${Math.cos(a)*r}px, ${Math.sin(a)*r}px)`}}if("spiral"===d){const a=e/t*4*Math.PI,r=(e+1)*parseInt(v)/2;return{position:"absolute",left:"50%",top:"50%",transform:`translate(-50%, -50%) translate(${Math.cos(a)*r}px, ${Math.sin(a)*r}px)`}}return{}},w=e=>.15*e/s+"s",E={...(()=>{switch(d){case"circular":return{display:"flex",alignItems:"center",justifyContent:"center",position:"relative",width:2.5*(parseInt(a(i))+parseInt(v))+"px",height:2.5*(parseInt(a(i))+parseInt(v))+"px"};case"spiral":return{display:"flex",alignItems:"center",justifyContent:"center",position:"relative",width:3*(parseInt(a(i))+parseInt(v))+"px",height:3*(parseInt(a(i))+parseInt(v))+"px"};default:return{display:"flex",alignItems:"center",gap:v}}})(),...m},C=t=>{const a=(e=>c[e%c.length])(t),r=o&&t%2==1?o:n,l={key:t,color:h>0?void 0:r,borderColor:h>0?r:void 0,borderWidth:h>0?h:void 0,animation:`react-loadly-${g}`,animationDuration:b,animationDelay:w(t),style:$(t),"data-testid":f?`${f}-shape-${t}`:void 0};return"circle"===a?e.createElement(y,{...l,size:i}):e.createElement(p,{...l,width:i,height:i})};return e.createElement("div",{className:`react-loadly-shape-group react-loadly-shape-group-${d} ${u}`.trim(),style:E,"data-testid":f,...x},Array.from({length:t},(e,t)=>C(t)))},exports.ShimmerLoader=r=>{const i=t(R,r),{size:n,width:o,height:l,speed:s,loading:d,className:u="",style:m={},lines:p=1,variant:y,borderRadius:g,spacing:h,waveWidth:f,color:x,highlightColor:v,shimmerColor:b,waveDirection:$,showText:w,loadingText:E="Loading content...","aria-label":C,"data-testid":k,fullscreen:N,screenWidth:I,screenHeight:L,loaderCenter:z,screenBackground:M,...T}=i;if(!d)return null;const D={display:"inline-flex",flexDirection:"column",alignItems:"center",...m,...N&&{position:"fixed",top:0,left:0,width:I||"100vw",height:L||"100vh",backgroundColor:M||"var(--react-loadly-background)",zIndex:9999,justifyContent:z?"center":m.justifyContent}},j=(()=>{switch(y){case"avatar":return{width:o||n||"40px",height:l||n||"40px",borderRadius:g||"50%"};case"card":return{width:o||"300px",height:l||"200px",borderRadius:g||"8px"};case"text":return{width:o||"100%",height:l||"16px",borderRadius:g||"4px"};case"wave":return{width:o||"100%",height:l||"20px",borderRadius:g||"10px"};default:return{width:o||n||"100%",height:l||"16px",borderRadius:g||"4px"}}})(),S=a(h,"8px"),W=a(f,"200px"),B={width:a(j.width),height:a(j.height),background:`linear-gradient(${"left-to-right"===$?"90deg":"right-to-left"===$?"270deg":"top-to-bottom"===$?"180deg":"0deg"}, ${x} 0%, ${v} 50%, ${x} 100%)`,backgroundSize:`${W} 100%`,borderRadius:a(j.borderRadius),position:"relative",overflow:"hidden",animation:`react-loadly-shimmer-wave ${2/(s||1)}s ease-in-out infinite`};return e.createElement("div",{className:c("react-loadly react-loadly-shimmer",u),style:D,role:"status","aria-label":C,"aria-live":"polite","aria-busy":d,"data-testid":k,...T},e.createElement("div",{style:{display:"flex",flexDirection:"column",width:"100%"}},"card"===y?e.createElement("div",{style:B,"data-testid":k?`${k}-shimmer`:void 0},e.createElement("div",{style:{position:"absolute",top:0,left:0,right:0,bottom:0,background:`linear-gradient(90deg, transparent, ${b}, transparent)`,animation:`react-loadly-shimmer-overlay ${2/(s||1)}s ease-in-out infinite`}})):"avatar"===y?e.createElement("div",{style:B,"data-testid":k?`${k}-shimmer`:void 0},e.createElement("div",{style:{position:"absolute",top:0,left:0,right:0,bottom:0,borderRadius:"50%",background:`linear-gradient(90deg, transparent, ${b}, transparent)`,animation:`react-loadly-shimmer-overlay ${2/(s||1)}s ease-in-out infinite`}})):"wave"===y?e.createElement("div",{style:B,"data-testid":k?`${k}-shimmer`:void 0},e.createElement("div",{style:{position:"absolute",top:0,left:0,right:0,bottom:0,background:`linear-gradient(90deg, transparent, ${b}, transparent)`,animation:`react-loadly-shimmer-wave-overlay ${2/(s||1)}s ease-in-out infinite`}})):Array.from({length:p},(t,a)=>{const r=a===p-1&&p>1?"60%":"100%";return e.createElement("div",{key:a,style:{...B,width:r,marginBottom:a<p-1?S:0},"data-testid":k?`${k}-shimmer-${a}`:void 0},e.createElement("div",{style:{position:"absolute",top:0,left:0,right:0,bottom:0,background:`linear-gradient(90deg, transparent, ${b}, transparent)`,animation:`react-loadly-shimmer-overlay ${2/(s||1)}s ease-in-out infinite`,animationDelay:.1*a+"s"}}))})),w&&e.createElement("div",{className:"react-loadly-text","aria-live":"polite"},E),e.createElement("span",{className:"react-loadly-sr-only"},C))},exports.SkeletonLoader=r=>{const i=t(D,r),{size:n,width:o,height:l,speed:s,loading:d,className:u="",style:m={},lines:p=1,variant:y,borderRadius:g,spacing:h,shimmer:f,color:x,highlightColor:v,shimmerColor:b,showText:$,loadingText:w="Loading content...","aria-label":E,"data-testid":C,fullscreen:k,screenWidth:N,screenHeight:I,loaderCenter:L,screenBackground:z,...M}=i;if(!d)return null;const T={display:"inline-flex",flexDirection:"column",alignItems:"center",...m,...k&&{position:"fixed",top:0,left:0,width:N||"100vw",height:I||"100vh",backgroundColor:z||"var(--react-loadly-background)",zIndex:9999,justifyContent:L?"center":m.justifyContent}},R=(()=>{switch(y){case"avatar":return{width:o||n||"40px",height:l||n||"40px",borderRadius:g||"50%"};case"card":return{width:o||"300px",height:l||"200px",borderRadius:g||"8px"};case"text":return{width:o||"100%",height:l||"16px",borderRadius:g||"4px"};default:return{width:o||n||"100%",height:l||"16px",borderRadius:g||"4px"}}})(),j=a(h,"8px"),S={width:a(R.width),height:a(R.height),backgroundColor:x,borderRadius:a(R.borderRadius),position:"relative",overflow:"hidden",...f&&{background:`linear-gradient(90deg, ${x} 25%, ${v} 50%, ${x} 75%)`,backgroundSize:"200% 100%",animation:`react-loadly-shimmer ${1.5/(s||1)}s ease-in-out infinite`}};return e.createElement("div",{className:c("react-loadly react-loadly-skeleton",u),style:T,role:"status","aria-label":E,"aria-live":"polite","aria-busy":d,"data-testid":C,...M},e.createElement("div",{style:{display:"flex",flexDirection:"column",width:"100%"}},"card"===y?e.createElement("div",{style:S,"data-testid":C?`${C}-skeleton`:void 0},f&&e.createElement("div",{style:{position:"absolute",top:0,left:0,right:0,bottom:0,background:`linear-gradient(90deg, transparent, ${b}, transparent)`,animation:`react-loadly-shimmer-overlay ${1.5/(s||1)}s ease-in-out infinite`}})):"avatar"===y?e.createElement("div",{style:S,"data-testid":C?`${C}-skeleton`:void 0},f&&e.createElement("div",{style:{position:"absolute",top:0,left:0,right:0,bottom:0,borderRadius:"50%",background:`linear-gradient(90deg, transparent, ${b}, transparent)`,animation:`react-loadly-shimmer-overlay ${1.5/(s||1)}s ease-in-out infinite`}})):Array.from({length:p},(t,a)=>{const r=a===p-1&&p>1?"60%":"100%";return e.createElement("div",{key:a,style:{...S,width:r,marginBottom:a<p-1?j:0},"data-testid":C?`${C}-skeleton-${a}`:void 0},f&&e.createElement("div",{style:{position:"absolute",top:0,left:0,right:0,bottom:0,background:`linear-gradient(90deg, transparent, ${b}, transparent)`,animation:`react-loadly-shimmer-overlay ${1.5/(s||1)}s ease-in-out infinite`,animationDelay:.1*a+"s"}}))})),$&&e.createElement("div",{className:"react-loadly-text","aria-live":"polite"},w),e.createElement("span",{className:"react-loadly-sr-only"},E))},exports.SpinLoader=r=>{const i=t(j,r),{size:o,color:l,speed:d,loading:u,className:m="",style:p={},borderWidth:y,showText:g,loadingText:h="Loading...","aria-label":f,"data-testid":x,fullscreen:v,screenWidth:b,screenHeight:$,loaderCenter:w,screenBackground:E,...C}=i,k=e.useRef(s("spin-loader")),N=a(o),I=n(d);if(!u)return null;const L={display:"inline-flex",flexDirection:"column",alignItems:"center",...p,...v&&{position:"fixed",top:0,left:0,width:b||"100vw",height:$||"100vh",backgroundColor:E||"var(--react-loadly-background)",zIndex:9999,justifyContent:w?"center":p.justifyContent}},z={width:N,height:N,border:`${y}px solid transparent`,borderTop:`${y}px solid ${l}`,borderRadius:"50%",animation:`react-loadly-spin ${I.duration} linear infinite`,animationPlayState:I.playState};return e.createElement("div",{className:c("react-loadly react-loadly-spin",m),style:L,role:"status","aria-label":f,"aria-live":"polite","aria-busy":u,"data-testid":x,...C},e.createElement("div",{style:z,"data-testid":x?`${x}-spinner`:void 0}),g&&e.createElement("div",{className:"react-loadly-text",id:`${k.current}-text`,"aria-live":"polite"},h),e.createElement("span",{className:"react-loadly-sr-only"},f))},exports.TypingLoader=a=>{const r=t(S,a),{loadingText:i,speed:n=1,loading:o,charDelay:l=100,loop:s,className:d="",style:u={},color:m="var(--react-loadly-text-color)",fontFamily:p,fontWeight:y=500,"aria-label":g,"data-testid":h,showText:f,fullscreen:x,screenWidth:v,screenHeight:b,loaderCenter:$,screenBackground:w,size:E=18,...C}=r,[k,N]=e.useState(""),[I,L]=e.useState(!1),z=e.useRef(null);if(e.useEffect(()=>{if(z.current&&(clearTimeout(z.current),z.current=null),!o||!i)return void N("");L(!0),N("");const e=(t=0)=>{t<i.length?(N(i.substring(0,t+1)),z.current=setTimeout(()=>e(t+1),l/n)):s?z.current=setTimeout(()=>{N(""),e(0)},2*l):L(!1)};return e(0),()=>{z.current&&clearTimeout(z.current)}},[o,i,l,n,s]),!o)return null;const M={display:"inline-flex",flexDirection:"column",alignItems:"center",...u,...x&&{position:"fixed",top:0,left:0,width:v||"100vw",height:b||"100vh",backgroundColor:w||"var(--react-loadly-background)",zIndex:9999,justifyContent:$?"center":u.justifyContent}},T={color:m,fontFamily:p,fontWeight:y,fontSize:E,whiteSpace:"pre"};return e.createElement("div",{className:c("react-loadly react-loadly-typing",d),style:M,role:"status","aria-label":g,"aria-live":"polite","aria-busy":o,"data-testid":h,...C},e.createElement("div",{style:T,"data-testid":h?`${h}-text`:void 0},k,e.createElement("span",{className:"react-loadly-typing-cursor",style:{display:I?"inline-block":"none",animation:`react-loadly-blink ${1/n}s step-end infinite`,marginLeft:"2px",verticalAlign:"baseline"}},"|")),f&&e.createElement("div",{className:"react-loadly-text","aria-live":"polite"},i),e.createElement("span",{className:"react-loadly-sr-only"},g))},exports.WaveLoader=r=>{const i=t(W,r),{size:n,color:o,secondaryColor:l,speed:d,loading:u,count:m,className:p="",style:y={},showText:g,loadingText:f="Loading...","aria-label":x,"data-testid":v,fullscreen:b,screenWidth:$,screenHeight:w,loaderCenter:E,screenBackground:C,...k}=i,N=e.useMemo(()=>s("wave-loader"),[]),I=e.useMemo(()=>{const e="number"==typeof n?n:parseInt(a(n));return{width:Math.max(e/10,3),height:e,spacing:Math.max(e/8,4)}},[n]);if(!u)return null;const L={display:"inline-flex",flexDirection:"column",alignItems:"center",...y,...b&&{position:"fixed",top:0,left:0,width:$||"100vw",height:w||"100vh",backgroundColor:C||"var(--react-loadly-background)",zIndex:9999,justifyContent:E?"center":y.justifyContent}};return e.createElement("div",{className:c("react-loadly react-loadly-wave",p),style:L,role:"status","aria-label":x,"aria-live":"polite","aria-busy":u,"data-testid":v,...k},e.createElement(h,{count:m,lineWidth:I.width,lineHeight:I.height,color:o,secondaryColor:l,speed:d,arrangement:"staggered",orientation:"vertical",animationType:"wave",spacing:I.spacing,"data-testid":v?`${v}-lines`:void 0}),g&&e.createElement("div",{className:"react-loadly-text",id:`${N}-text`,"aria-live":"polite"},f),e.createElement("span",{className:"react-loadly-sr-only"},x))},exports.clamp=o,exports.classNameGen=c,exports.createAnimationName=function(e){return`react-loadly-${e}`},exports.createAnimationString=function(e,t,a="ease",r="normal",i="infinite"){return`${e} ${t} ${a} ${r} ${i}`},exports.generateCSSVariables=function(e){const t={};return Object.entries(e).forEach(([e,a])=>{void 0!==a&&(t[e]=a)}),t},exports.generateId=s,exports.getAnimationDirection=function(e="normal"){return e},exports.getAnimationDuration=r,exports.getAnimationEasing=function(e="ease"){return e},exports.getOptimizedAnimationSettings=n,exports.getSizeValue=a,exports.hexToRgb=l,exports.mergeProps=t,exports.prefersReducedMotion=i,exports.rgba=function(e,t){const a=l(e);return a?`rgba(${a.r}, ${a.g}, ${a.b}, ${o(t,0,1)})`:e},exports.sanitizeCSSValue=d,exports.useAsyncLoader=(t,a=[],r={})=>{const i=B(r),[n,o]=e.useState(null),l=e.useCallback(async()=>{try{i.setLoading(!0),i.setError(null);const e=await t();return o(e),i.setProgress(100),e}catch(e){const t=e instanceof Error?e.message:"Unknown error occurred";return i.setError(t),null}},[t,i]);return e.useEffect(()=>{l()},a),{...i,data:n,execute:l}},exports.useLoaderState=B,exports.useMultipleLoaderStates=(e,t={})=>e.reduce((e,a)=>(e[a]=B(t),e),{});
|
|
1
|
+
"use strict";var e=require("react");function t(e,t){return{...e,...t}}function a(e,t="40px"){return void 0===e?t:"number"==typeof e?`${e}px`:e}function r(e,t=1){return`${e/Math.max(t,.1)}ms`}function n(){if("undefined"==typeof window||!window.matchMedia)return!1;try{return window.matchMedia("(prefers-reduced-motion: reduce)").matches}catch(e){return!1}}function i(e=1,t=!0){if("undefined"!=typeof process&&"test"===process.env.NODE_ENV)return{duration:"0ms",playState:"paused",iterationCount:1};const a=t&&n();return{duration:a?"0ms":r(1e3,e),playState:a?"paused":"running",iterationCount:a?1:"infinite"}}function l(e,t,a){return Math.min(Math.max(e,t),a)}function o(e){const t=/^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(e);return t?{r:parseInt(t[1],16),g:parseInt(t[2],16),b:parseInt(t[3],16)}:null}function s(e="loader"){return`${e}-${Math.random().toString(36).substr(2,9)}`}function d(e){if(null!=e)return"number"==typeof e?`${e}px`:"string"==typeof e?e.replace(/[<>'"]/g,""):void 0}function c(...e){return e.flat().filter(e=>"string"==typeof e&&e.trim()).join(" ")}const u=({size:t=8,color:r="var(--react-loadly-color)",opacity:n=1,className:i="",style:l={},animation:o,animationDuration:s,animationDelay:d,glowIntensity:c=0,"data-testid":u,...m})=>{const p=a(t),y={width:p,height:p,borderRadius:"50%",backgroundColor:r,opacity:n,animation:o?`${o} ${s||"1s"} infinite`:void 0,animationDelay:d,display:"inline-block",boxShadow:c>0?`0 0 ${10*c}px ${r}`:void 0,...l};return e.createElement("div",{className:`react-loadly-dot ${i}`.trim(),style:y,"data-testid":u,...m})},m=({width:t=30,height:r=4,color:n="var(--react-loadly-color)",opacity:i=1,borderRadius:l=2,className:o="",style:s={},animation:c,animationDuration:u,animationDelay:m,orientation:p="horizontal","data-testid":y,...g})=>{const h=a(t),f=a(r),x={width:"vertical"===p?f:h,height:"vertical"===p?h:f,backgroundColor:n,opacity:i,borderRadius:d(l),animation:c?`${c} ${u||"1s"} infinite`:void 0,animationDelay:m,display:"inline-block",...s};return e.createElement("div",{className:`react-loadly-line react-loadly-line-${p} ${o}`.trim(),style:x,"data-testid":y,...g})},p=({width:t=20,height:r=20,color:n="var(--react-loadly-color)",borderColor:i,borderWidth:l=0,borderRadius:o=0,opacity:s=1,className:c="",style:u={},animation:m,animationDuration:p,animationDelay:y,"data-testid":g,...h})=>{const f=a(t),x=a(r),v=d(l),b={width:f,height:x,backgroundColor:i?"transparent":n,border:i?`${v} solid ${i}`:void 0,borderRadius:d(o),opacity:s,animation:m?`${m} ${p||"1s"} infinite`:void 0,animationDelay:y,display:"inline-block",...u};return e.createElement("div",{className:`react-loadly-rectangle ${c}`.trim(),style:b,"data-testid":g,...h})},y=({size:t=20,color:r="var(--react-loadly-color)",borderColor:n,borderWidth:i=0,opacity:l=1,className:o="",style:s={},animation:c,animationDuration:u,animationDelay:m,"data-testid":p,...y})=>{const g=a(t),h=d(i),f={width:g,height:g,borderRadius:"50%",backgroundColor:n?"transparent":r,border:n?`${h} solid ${n}`:void 0,opacity:l,animation:c?`${c} ${u||"1s"} infinite`:void 0,animationDelay:m,display:"inline-block",...s};return e.createElement("div",{className:`react-loadly-circle ${o}`.trim(),style:f,"data-testid":p,...y})},g=({count:t=3,dotSize:n=8,color:i="var(--react-loadly-color)",secondaryColor:l,spacing:o=8,speed:s=1,arrangement:d="linear",className:c="",style:m={},animationType:p="wave","data-testid":y,...g})=>{const h=a(o),f=r(1200,s),x=e=>{if("circular"===d){const a=e/t*2*Math.PI,r=parseInt(h);return{position:"absolute",left:"50%",top:"50%",transform:`translate(-50%, -50%) translate(${Math.cos(a)*r}px, ${Math.sin(a)*r}px)`}}return{}},v=e=>.1*e/s+"s",b={...(()=>{switch(d){case"circular":return{display:"flex",alignItems:"center",justifyContent:"center",position:"relative",width:2*(parseInt(a(n))+parseInt(h))+"px",height:2*(parseInt(a(n))+parseInt(h))+"px"};case"grid":return{display:"grid",gridTemplateColumns:`repeat(${Math.ceil(Math.sqrt(t))}, 1fr)`,gap:h};default:return{display:"flex",alignItems:"center",gap:h}}})(),...m};return e.createElement("div",{className:`react-loadly-dot-cluster react-loadly-dot-cluster-${d} ${c}`.trim(),style:b,"data-testid":y,...g},Array.from({length:t},(t,a)=>e.createElement(u,{key:a,size:n,color:l&&a%2==1?l:i,animation:`react-loadly-${p}`,animationDuration:f,animationDelay:v(a),style:x(a),"data-testid":y?`${y}-dot-${a}`:void 0})))},h=({count:t=5,lineWidth:n=4,lineHeight:i=35,color:l="var(--react-loadly-color)",secondaryColor:o,spacing:s=6,speed:d=1,arrangement:c="parallel",orientation:u="vertical",className:p="",style:y={},animationType:g="wave","data-testid":h,...f})=>{const x=a(s),v=r(1e3,d),b=e=>{if("radial"===c){return{position:"absolute",left:"50%",top:"50%",transformOrigin:"center",transform:`translate(-50%, -50%) rotate(${e/t*2*Math.PI}rad)`}}if("staggered"===c){const r=.3+.7*Math.sin(e/t*Math.PI);return{height:"vertical"===u?parseInt(a(i))*r+"px":a(i)}}return{}},$=e=>.1*e/d+"s",w={...(()=>{switch(c){case"radial":return{display:"flex",alignItems:"center",justifyContent:"center",position:"relative",width:1.5*parseInt(a(i))+"px",height:1.5*parseInt(a(i))+"px"};case"staggered":return{display:"flex",alignItems:"flex-end",justifyContent:"center",gap:x};default:return{display:"flex",alignItems:"center",justifyContent:"center",gap:x}}})(),...y};return e.createElement("div",{className:`react-loadly-line-group react-loadly-line-group-${c} ${p}`.trim(),style:w,"data-testid":h,...f},Array.from({length:t},(t,a)=>e.createElement(m,{key:a,width:"horizontal"===u?n:i,height:"horizontal"===u?i:n,color:o&&a%2==1?o:l,orientation:u,animation:`react-loadly-${g}`,animationDuration:v,animationDelay:$(a),style:b(a),"data-testid":h?`${h}-line-${a}`:void 0})))},f={size:20,color:"var(--react-loadly-color)",speed:1,loading:!0,count:5,"aria-label":"Loading..."},x={size:60,color:"var(--react-loadly-color)",speed:1,loading:!0,fluidity:1,amplitude:1,"aria-label":"Loading..."},v={size:15,color:"var(--react-loadly-color)",speed:1,loading:!0,count:3,"aria-label":"Loading..."},b={size:12,color:"var(--react-loadly-color)",speed:1,loading:!0,count:3,"aria-label":"Loading..."},$={size:60,speed:1,loading:!0,animationType:"spin",glowIntensity:.3,"aria-label":"Loading..."},w=({className:t=""})=>e.createElement("svg",{className:t,fill:"currentColor",viewBox:"0 0 20 20",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true"},e.createElement("path",{clipRule:"evenodd",fillRule:"evenodd",d:"M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-8-3a1 1 0 00-.867.5 1 1 0 11-1.731-1A3 3 0 0113 8a3.001 3.001 0 01-2 2.83V11a1 1 0 11-2 0v-1a1 1 0 011-1 1 1 0 100-2zm0 8a1 1 0 100-2 1 1 0 000 2z"})),C=({className:t=""})=>e.createElement("svg",{className:t,fill:"currentColor",viewBox:"0 0 20 20",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true"},e.createElement("path",{fillRule:"evenodd",d:"M9.243 3.03a1 1 0 01.727 1.213L9.53 6h2.94l.56-2.243a1 1 0 111.94.486L14.53 6H16a1 1 0 110 2h-1.97l-1 4H15a1 1 0 110 2h-2.47l-.56 2.242a1 1 0 11-1.94-.485L10.47 14H7.53l-.56 2.242a1 1 0 11-1.94-.485L5.47 14H4a1 1 0 110-2h1.97l1-4H5a1 1 0 110-2h2.47l.56-2.243a1 1 0 011.213-.727zM9.03 8l-1 4h2.94l1-4H9.03z",clipRule:"evenodd"})),E=({className:t=""})=>e.createElement("svg",{className:t,fill:"currentColor",viewBox:"0 0 20 20",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true"},e.createElement("path",{fillRule:"evenodd",d:"M10 18a8 8 0 100-16 8 8 0 000 16zm1-12a1 1 0 10-2 0v4a1 1 0 00.293.707l2.828 2.829a1 1 0 101.415-1.415L11 9.586V6z",clipRule:"evenodd"})),k={size:60,color:"var(--react-loadly-color)",speed:1,loading:!0,fluidity:1,amplitude:1,"aria-label":"Loading..."},N={size:40,color:"var(--react-loadly-color)",speed:1,loading:!0,count:4,"aria-label":"Loading..."},I={size:60,color:"var(--react-loadly-color)",speed:1,loading:!0,fluidity:1,amplitude:1,"aria-label":"Loading..."},L={size:60,speed:1,loading:!0,animationType:"spin",glowIntensity:.3,"aria-label":"Loading...",alt:"Loading"},z={size:40,color:"var(--react-loadly-color)",speed:1,loading:!0,count:3,"aria-label":"Loading..."},M={size:60,color:"var(--react-loadly-color)",speed:1,loading:!0,borderWidth:4,"aria-label":"Loading..."},T={size:15,color:"var(--react-loadly-color)",speed:1,loading:!0,count:2,"aria-label":"Loading..."},D={size:40,speed:1,loading:!0,lines:1,variant:"line",shimmer:!0,color:"#e2e8f0",highlightColor:"#f1f5f9",shimmerColor:"rgba(255, 255, 255, 0.6)",borderRadius:"4px",spacing:"8px",waveWidth:"200px",waveDirection:"left-to-right","aria-label":"Loading content..."},R={size:40,color:"var(--react-loadly-color)",speed:1,loading:!0,borderWidth:4,"aria-label":"Loading..."},j={speed:1,loading:!0,charDelay:100,"aria-label":"Loading...",loop:!0},S={size:40,color:"var(--react-loadly-color)",speed:1,loading:!0,count:5,"aria-label":"Loading..."},W=(t={})=>{const{initialLoading:a=!1,timeout:r,maxRetries:n=3,onLoadingChange:i,onError:l,onProgress:o}=t,[s,d]=e.useState({isLoading:a,progress:0,error:null,retryCount:0}),c=e.useRef(null),u=e.useRef(null);e.useEffect(()=>()=>{c.current&&clearTimeout(c.current),u.current&&clearTimeout(u.current)},[]),e.useEffect(()=>(s.isLoading&&r?c.current=setTimeout(()=>{d(e=>({...e,isLoading:!1,error:"Loading timeout exceeded"})),l?.("Loading timeout exceeded")},r):c.current&&clearTimeout(c.current),()=>{c.current&&clearTimeout(c.current)}),[s.isLoading,r,l]),e.useEffect(()=>{i?.(s.isLoading)},[s.isLoading,i]),e.useEffect(()=>{void 0!==s.progress&&o?.(s.progress)},[s.progress,o]);const m=e.useCallback(e=>{d(t=>({...t,isLoading:e,error:e?null:t.error,progress:e?0:t.progress}))},[]),p=e.useCallback(e=>{const t=Math.min(Math.max(e,0),100);d(e=>({...e,progress:t,isLoading:!(t>=100)&&e.isLoading}))},[]),y=e.useCallback(e=>{d(t=>({...t,error:e,isLoading:!1})),e&&l?.(e)},[l]),g=e.useCallback(()=>{d(e=>{const t=(e.retryCount||0)+1;return t>n?(l?.("Maximum retry attempts exceeded"),{...e,error:"Maximum retry attempts exceeded",isLoading:!1}):{...e,retryCount:t,isLoading:!0,error:null,progress:0}});const e=Math.min(1e3*Math.pow(2,s.retryCount||0),3e4);u.current=setTimeout(()=>{d(e=>({...e,isLoading:!0}))},e)},[s.retryCount,n,l]),h=e.useCallback(()=>{d({isLoading:!1,progress:0,error:null,retryCount:0}),c.current&&clearTimeout(c.current),u.current&&clearTimeout(u.current)},[]);return{state:s,setLoading:m,setProgress:p,setError:y,retry:g,reset:h}};exports.BarsLoader=r=>{const n=t(f,r),{size:l,color:o,speed:d,loading:u,className:m="",style:p={},count:y=5,showText:g,loadingText:h="Loading...","aria-label":x,"data-testid":v,fullscreen:b,screenWidth:$,screenHeight:w,loaderCenter:C,screenBackground:E,...k}=n,N=e.useMemo(()=>s("bars-loader"),[]),I=a(l),L=i(d);if(!u)return null;const z={display:"inline-flex",flexDirection:"column",alignItems:"center",...p,...b&&{position:"fixed",top:0,left:0,width:$||"100vw",height:w||"100vh",backgroundColor:E||"var(--react-loadly-background)",zIndex:9999,justifyContent:C?"center":p.justifyContent}},M={width:"4px",height:I,backgroundColor:o,borderRadius:"2px",animation:`react-loadly-bars ${L.duration} ease-in-out infinite`,animationPlayState:L.playState},T=Array.from({length:y}).map((t,a)=>{const r=.1*a+"s",n=.5+a%3*.25;return e.createElement("div",{key:a,style:{...M,animationDelay:r,height:parseFloat(I)*n+"px"},"data-testid":v?`${v}-bar-${a}`:void 0})});return e.createElement("div",{className:c("react-loadly react-loadly-bars",m),style:z,role:"status","aria-label":x,"aria-live":"polite","aria-busy":u,"data-testid":v,...k},e.createElement("div",{style:{display:"flex",justifyContent:"center",alignItems:"center",gap:"4px"}},T),g&&e.createElement("div",{className:"react-loadly-text",id:`${N}-text`,"aria-live":"polite"},h),e.createElement("span",{className:"react-loadly-sr-only"},x))},exports.BlobLoader=n=>{const i=t(x,n),{size:l,color:o,secondaryColor:d,speed:u,loading:m,fluidity:p,amplitude:y,className:g="",style:h={},showText:f,loadingText:v="Loading...","aria-label":b,"data-testid":$,...w}=i,C=e.useMemo(()=>s("blob-loader"),[]),E=a(l),k=r(2500,u);if(!m)return null;const N={display:"inline-flex",flexDirection:"column",alignItems:"center",...h},I={width:E,height:E,background:`linear-gradient(45deg, ${o}, ${d||o})`,borderRadius:"30% 70% 70% 30% / 30% 30% 70% 70%",animation:`blob-morph ${k} ease-in-out infinite`,filter:"blur(1px)",position:"relative"},L={position:"absolute",top:"20%",left:"20%",width:"60%",height:"60%",background:`radial-gradient(circle, ${d||o}, transparent)`,borderRadius:"40% 60% 60% 40% / 40% 40% 60% 60%",animation:`blob-inner ${k} ease-in-out infinite reverse`,opacity:.7};return e.createElement(e.Fragment,null,e.createElement("style",null,`\n @keyframes blob-morph {\n 0%, 100% {\n border-radius: 30% 70% 70% 30% / 30% 30% 70% 70%;\n transform: scale(1) rotate(0deg);\n }\n 25% {\n border-radius: 58% 42% 75% 25% / 76% 46% 54% 24%;\n transform: scale(${1+.1*(y??1)}) rotate(90deg);\n }\n 50% {\n border-radius: 50% 50% 33% 67% / 55% 27% 73% 45%;\n transform: scale(${1-.05*(y??1)}) rotate(180deg);\n }\n 75% {\n border-radius: 33% 67% 58% 42% / 63% 68% 32% 37%;\n transform: scale(${1+.08*(y??1)}) rotate(270deg);\n }\n }\n \n @keyframes blob-inner {\n 0%, 100% {\n border-radius: 40% 60% 60% 40% / 40% 40% 60% 60%;\n transform: scale(1) rotate(0deg);\n }\n 33% {\n border-radius: 70% 30% 50% 50% / 30% 70% 30% 70%;\n transform: scale(${1.1+.1*(p??1)}) rotate(-120deg);\n }\n 66% {\n border-radius: 30% 70% 40% 60% / 70% 30% 70% 30%;\n transform: scale(${.9+.05*(p??1)}) rotate(-240deg);\n }\n }\n `),e.createElement("div",{className:c("react-loadly react-loadly-blob",g),style:N,role:"status","aria-label":b,"aria-live":"polite","aria-busy":m,"data-testid":$,...w},e.createElement("div",{style:I,"data-testid":$?`${$}-blob`:void 0},e.createElement("div",{style:L})),f&&e.createElement("div",{className:"react-loadly-text",id:`${C}-text`,"aria-live":"polite"},v),e.createElement("span",{className:"react-loadly-sr-only"},b)))},exports.BounceLoader=r=>{const n=t(v,r),{size:l,color:o,speed:d,loading:u,className:m="",style:p={},count:y=3,showText:g,loadingText:h="Loading...","aria-label":f,"data-testid":x,fullscreen:b,screenWidth:$,screenHeight:w,loaderCenter:C,screenBackground:E,...k}=n,N=e.useMemo(()=>s("bounce-loader"),[]),I=a(l),L=i(d);if(!u)return null;const z={display:"inline-flex",flexDirection:"column",alignItems:"center",...p,...b&&{position:"fixed",top:0,left:0,width:$||"100vw",height:w||"100vh",backgroundColor:E||"var(--react-loadly-background)",zIndex:9999,justifyContent:C?"center":p.justifyContent}},M={width:I,height:I,borderRadius:"50%",backgroundColor:o,animation:`react-loadly-bounce ${L.duration} ease-in-out infinite`,animationPlayState:L.playState},T=Array.from({length:y}).map((t,a)=>{const r=.1*a+"s";return e.createElement("div",{key:a,style:{...M,animationDelay:r},"data-testid":x?`${x}-ball-${a}`:void 0})});return e.createElement("div",{className:c("react-loadly react-loadly-bounce",m),style:z,role:"status","aria-label":f,"aria-live":"polite","aria-busy":u,"data-testid":x,...k},e.createElement("div",{style:{display:"flex",justifyContent:"center",alignItems:"center",gap:"8px"}},T),g&&e.createElement("div",{className:"react-loadly-text",id:`${N}-text`,"aria-live":"polite"},h),e.createElement("span",{className:"react-loadly-sr-only"},f))},exports.Circle=y,exports.Dot=u,exports.DotCluster=g,exports.DotsLoader=r=>{const n=t(b,r),{size:l,color:o,speed:d,loading:u,className:m="",style:p={},count:y=3,showText:g,loadingText:h="Loading...","aria-label":f,"data-testid":x,fullscreen:v,screenWidth:$,screenHeight:w,loaderCenter:C,screenBackground:E,...k}=n,N=e.useMemo(()=>s("dots-loader"),[]),I=a(l),L=i(d);if(!u)return null;const z={display:"inline-flex",flexDirection:"column",alignItems:"center",...p,...v&&{position:"fixed",top:0,left:0,width:$||"100vw",height:w||"100vh",backgroundColor:E||"var(--react-loadly-background)",zIndex:9999,justifyContent:C?"center":p.justifyContent}},M={width:I,height:I,borderRadius:"50%",backgroundColor:o,animation:`react-loadly-dots ${L.duration} ease-in-out infinite`,animationPlayState:L.playState},T=Array.from({length:y}).map((t,a)=>{const r=.2*a+"s";return e.createElement("div",{key:a,style:{...M,animationDelay:r},"data-testid":x?`${x}-dot-${a}`:void 0})});return e.createElement("div",{className:c("`react-loadly react-loadly-dots",m),style:z,role:"status","aria-label":f,"aria-live":"polite","aria-busy":u,"data-testid":x,...k},e.createElement("div",{style:{display:"flex",justifyContent:"center",alignItems:"center",gap:"6px"}},T),g&&e.createElement("div",{className:"react-loadly-text",id:`${N}-text`,"aria-live":"polite"},h),e.createElement("span",{className:"react-loadly-sr-only"},f))},exports.ElementLoader=a=>{const n=t($,a),{size:i,width:l,height:o,speed:s=1,loading:d,animationType:u,glowIntensity:m,className:p="",style:y={},color:g="var(--react-loadly-color)","aria-label":h,loadingText:f,showText:x,"data-testid":v,fullscreen:b,screenWidth:w,screenHeight:C,loaderCenter:E,screenBackground:k,children:N,...I}=n;if(!d)return null;const L={display:"inline-flex",flexDirection:"column",alignItems:"center",...y,...b&&{position:"fixed",top:0,left:0,width:w||"100vw",height:C||"100vh",backgroundColor:k||"var(--react-loadly-background)",zIndex:9999,justifyContent:E?"center":y.justifyContent}},z=l||i,M=o||i,T={width:"number"==typeof z?`${z}px`:z,height:"number"==typeof M?`${M}px`:M,animation:(()=>{switch(u){case"pulse":return`react-loadly-pulse ${r(2e3,s)} infinite`;case"glow":return`react-loadly-glow ${r(2e3,s)} infinite`;case"bounce":return`react-loadly-bounce ${r(2e3,s)} infinite`;case"flip":return`react-loadly-flip ${r(2e3,s)} infinite`;default:return`react-loadly-spin ${r(2e3,s)} infinite`}})(),filter:(m??0)>0?`drop-shadow(0 0 ${20*(m??0)}px ${g})`:void 0,transformStyle:"preserve-3d",willChange:"transform",display:"flex",alignItems:"center",justifyContent:"center"},D={position:"absolute",top:"50%",left:"50%",width:"60%",height:"60%",borderRadius:"50%",backgroundColor:g,opacity:.3,transform:"translate(-50%, -50%)",animation:`react-loadly-pulse ${r(1500,1.5*s)} infinite`,zIndex:-1},R={position:"absolute",top:"50%",left:"50%",width:"120%",height:"120%",borderRadius:"50%",border:`2px solid ${g}`,opacity:.2,transform:"translate(-50%, -50%)",animation:`react-loadly-spin ${r(3e3,.8*s)} infinite reverse`,zIndex:-2};return e.createElement("div",{className:c("`react-loadly react-loadly-element-loader",p),style:L,role:"status","aria-label":h,"aria-live":"polite","aria-busy":d,"data-testid":v,...I},e.createElement("div",{style:{position:"relative",display:"flex",alignItems:"center",justifyContent:"center"}},e.createElement("div",{style:R}),e.createElement("div",{style:D}),e.createElement("div",{style:T,className:"react-loadly-element","data-testid":v?`${v}-element`:void 0},N)),x&&e.createElement("div",{className:"react-loadly-text","aria-live":"polite"},f||h),e.createElement("span",{className:"react-loadly-sr-only"},h))},exports.FallbackLoader=({error:t="Something went wrong",onRetry:a,showRetry:r=!0,children:n,type:i="error",className:l="",style:o={},fullscreen:s,screenWidth:d,screenHeight:c,loaderCenter:u,screenBackground:m,...p})=>{const y={...o,...s&&{position:"fixed",top:0,left:0,width:d||"100vw",height:c||"100vh",backgroundColor:m||"var(--react-loadly-error-background)",zIndex:9999,display:"flex",flexDirection:"column",alignItems:"center",justifyContent:u?"center":o.justifyContent}};return n?e.createElement("div",{className:`react-loadly-fallback ${l}`.trim(),style:y,...p},n):e.createElement("div",{className:`react-loadly-error ${l}`.trim(),style:y,role:"alert","aria-live":"polite",...p},(()=>{switch(i){case"network":return e.createElement(C,{className:"react-loadly-error-icon"});case"timeout":return e.createElement(E,{className:"react-loadly-error-icon"});default:return e.createElement(w,{className:"react-loadly-error-icon"})}})(),e.createElement("p",{className:"react-loadly-error-message"},(()=>{switch(i){case"network":return t||"Network connection failed. Please check your internet connection.";case"timeout":return t||"Loading timeout. The operation took too long to complete.";default:return t||"Something went wrong. Please try again."}})()),r&&a&&e.createElement("button",{className:"react-loadly-retry-button",onClick:a,type:"button","aria-label":"Retry loading"},"Try Again"))},exports.FlowLoader=n=>{const i=t(k,n),{size:l,color:o,secondaryColor:d,speed:u,loading:m,amplitude:p,className:y="",style:g={},showText:h,loadingText:f="Loading...","aria-label":x,"data-testid":v,fullscreen:b,screenWidth:$,screenHeight:w,loaderCenter:C,screenBackground:E,...N}=i,I=e.useMemo(()=>s("flow-loader"),[]),L=a(l),z=parseInt(L),M=Math.max(.4*z,10),T=r(1500,u);if(!m)return null;const D={display:"inline-flex",flexDirection:"column",alignItems:"center",...g,...b&&{position:"fixed",top:0,left:0,width:$||"100vw",height:w||"100vh",backgroundColor:E||"var(--react-loadly-background)",zIndex:9999,justifyContent:C?"center":g.justifyContent}},R={width:L,height:`${M}px`,position:"relative",overflow:"hidden",borderRadius:`${Math.max(.2*z,4)}px`,backgroundColor:"rgba(0, 0, 0, 0.1)"},j=Math.max(Math.floor(z/15),3);return e.createElement(e.Fragment,null,e.createElement("style",null,`\n @keyframes flow-particle-${I} {\n 0% {\n transform: translateX(0) translateY(0) scale(0);\n opacity: 0;\n }\n 10% {\n transform: translateX(${Math.min(.1*z,10)}px) translateY(${Math.sin(.1)*(p??Math.min(5,M/4))}px) scale(1);\n opacity: 0.8;\n }\n 50% {\n transform: translateX(${Math.min(.5*z,.7*z)}px) translateY(${Math.sin(.5)*(p??Math.min(5,M/4))}px) scale(1);\n opacity: 0.8;\n }\n 90% {\n transform: translateX(${Math.min(.9*z,z-10)}px) translateY(${Math.sin(.9)*(p??Math.min(5,M/4))}px) scale(1);\n opacity: 0.8;\n }\n 100% {\n transform: translateX(${z}px) translateY(${Math.sin(1)*(p??Math.min(5,M/4))}px) scale(0);\n opacity: 0;\n }\n }\n `),e.createElement("div",{className:c("react-loadly react-loadly-flow",y),style:D,role:"status","aria-label":x,"aria-live":"polite","aria-busy":m,"data-testid":v,...N},e.createElement("div",{style:R,"data-testid":v?`${v}-container`:void 0},Array.from({length:j},(t,a)=>(t=>{const a=.2*t/(u??1),r=parseFloat(T)+100*t,n=Math.max(z/10,4),i=n+t%3*(n/2);return e.createElement("div",{key:t,style:{position:"absolute",width:`${i}px`,height:`${i}px`,borderRadius:"50%",background:t%2==0?o:d||o,animation:`flow-particle-${I} ${r}ms ease-in-out infinite`,animationDelay:`${a}s`,opacity:.8-.1*t,left:"0px",top:(M-i)/2+t%3*(M/(j+1))+"px"},"data-testid":v?`${v}-particle-${t}`:void 0})})(a))),h&&e.createElement("div",{className:"react-loadly-text",id:`${I}-text`,"aria-live":"polite"},f),e.createElement("span",{className:"react-loadly-sr-only"},x)))},exports.GridLoader=r=>{const n=t(N,r),{size:i,color:l,secondaryColor:o,speed:d=1,loading:u,count:m,className:p="",style:y={},showText:g,loadingText:h="Loading...","aria-label":f,"data-testid":x,fullscreen:v,screenWidth:b,screenHeight:$,loaderCenter:w,screenBackground:C,...E}=n,k=e.useMemo(()=>s("grid-loader"),[]),I=e.useMemo(()=>{const e="number"==typeof i?i:parseInt(a(i)),t=Math.ceil(Math.sqrt(m||4));return Math.max(e/(1.5*t),8)},[i,m]);if(!u)return null;const L={display:"inline-flex",flexDirection:"column",alignItems:"center",...y,...v&&{position:"fixed",top:0,left:0,width:b||"100vw",height:$||"100vh",backgroundColor:C||"var(--react-loadly-background)",zIndex:9999,justifyContent:w?"center":y.justifyContent}};return e.createElement("div",{className:c("react-loadly react-loadly-grid",p),style:L,role:"status","aria-label":f,"aria-live":"polite","aria-busy":u,"data-testid":x,...E},e.createElement("div",{className:"react-loadly-grid-container",style:{display:"grid",gridTemplateColumns:`repeat(${Math.ceil(Math.sqrt(m||4))}, 1fr)`,gap:I/3+"px"},"data-testid":x?`${x}-grid`:void 0},Array.from({length:m||4}).map((t,a)=>e.createElement("div",{key:a,className:"react-loadly-grid-item",style:{width:`${I}px`,height:`${I}px`,backgroundColor:a%2==0?l:o||l,borderRadius:"20%",animation:`react-loadly-scale ${1.2/(d||1)}s ease-in-out infinite`,animationDelay:.1*a/(d||1)+"s"}}))),g&&e.createElement("div",{className:"react-loadly-text",id:`${k}-text`,"aria-live":"polite"},h),e.createElement("span",{className:"react-loadly-sr-only"},f))},exports.Line=m,exports.LineGroup=h,exports.LiquidLoader=n=>{const i=t(I,n),{size:l,color:o,secondaryColor:d,speed:u,loading:m,amplitude:p,className:y="",style:g={},showText:h,loadingText:f="Loading...","aria-label":x,"data-testid":v,fullscreen:b,screenWidth:$,screenHeight:w,loaderCenter:C,screenBackground:E,...k}=i,N=e.useMemo(()=>s("liquid-loader"),[]),L=a(l),z=r(2e3,u);if(!m)return null;const M={display:"inline-flex",flexDirection:"column",alignItems:"center",...g,...b&&{position:"fixed",top:0,left:0,width:$||"100vw",height:w||"100vh",backgroundColor:E||"var(--react-loadly-background)",zIndex:9999,justifyContent:C?"center":g.justifyContent}},T={width:L,height:L,position:"relative",overflow:"hidden",borderRadius:"50%",backgroundColor:"rgba(0, 0, 0, 0.1)"},D=50-10*(p??1),R={position:"absolute",bottom:0,left:0,width:"200%",height:"200%",background:`linear-gradient(180deg, ${o} 0%, ${d||o} 100%)`,borderRadius:"40%",animation:`react-loadly-liquid-wave ${z} ease-in-out infinite`,transform:"translate(-25%, 50%) rotate(0deg)",animationTimingFunction:"cubic-bezier(0.36, 0.45, 0.63, 0.53)"},j={...R,background:`linear-gradient(180deg, ${d||o} 0%, ${o} 100%)`,animation:`react-loadly-liquid-wave ${z} ease-in-out infinite reverse`,animationDelay:-.5/(u??1)+"s",opacity:.8};return e.createElement(e.Fragment,null,e.createElement("style",null,`\n @keyframes react-loadly-liquid-wave {\n 0%, 100% {\n transform: translate(-25%, 50%) rotate(0deg);\n }\n 50% {\n transform: translate(-25%, ${D}%) rotate(180deg);\n }\n }\n `),e.createElement("div",{className:c("react-loadly react-loadly-liquid",y),style:M,role:"status","aria-label":x,"aria-live":"polite","aria-busy":m,"data-testid":v,...k},e.createElement("div",{style:T,"data-testid":v?`${v}-container`:void 0},e.createElement("div",{style:R}),e.createElement("div",{style:j})),h&&e.createElement("div",{className:"react-loadly-text",id:`${N}-text`,"aria-live":"polite"},f),e.createElement("span",{className:"react-loadly-sr-only"},x)))},exports.LogoSpinLoader=a=>{const n=t(L,a),{src:i,alt:l,size:o,speed:s,loading:d,animationType:u,glowIntensity:m,className:p="",style:y={},color:g="var(--react-loadly-color)","aria-label":h,loadingText:f,showText:x,"data-testid":v,fullscreen:b,screenWidth:$,screenHeight:w,loaderCenter:C,screenBackground:E,...k}=n;if(!d)return null;const N={display:"inline-flex",flexDirection:"column",alignItems:"center",...y,...b&&{position:"fixed",top:0,left:0,width:$||"100vw",height:w||"100vh",backgroundColor:E||"var(--react-loadly-background)",zIndex:9999,justifyContent:C?"center":y.justifyContent}},I={width:"number"==typeof o?`${o}px`:o,height:"number"==typeof o?`${o}px`:o,animation:`react-loadly-${u} ${r(2e3,s)} infinite`,filter:(m??0)>0?`drop-shadow(0 0 ${20*(m??0)}px ${g})`:void 0};return e.createElement("div",{className:c("`react-loadly react-loadly-logo-spin",p),style:N,role:"status","aria-label":h,"aria-live":"polite","aria-busy":d,"data-testid":v,...k},e.createElement("img",{src:i,alt:l,style:I,className:"react-loadly-logo","data-testid":v?`${v}-logo`:void 0}),x&&e.createElement("div",{className:"react-loadly-text","aria-live":"polite"},f||h),e.createElement("span",{className:"react-loadly-sr-only"},h))},exports.PulseLoader=r=>{const n=t(z,r),{size:i,color:l,secondaryColor:o,speed:d,loading:u,count:m,className:p="",style:y={},showText:h,loadingText:f="Loading...","aria-label":x,"data-testid":v,fullscreen:b,screenWidth:$,screenHeight:w,loaderCenter:C,screenBackground:E,...k}=n,N=e.useMemo(()=>s("pulse-loader"),[]),I=e.useMemo(()=>{const e="number"==typeof i?i:parseInt(a(i));return Math.max(e/5,6)},[i]);if(!u)return null;const L={display:"inline-flex",flexDirection:"column",alignItems:"center",...y,...b&&{position:"fixed",top:0,left:0,width:$||"100vw",height:w||"100vh",backgroundColor:E||"var(--react-loadly-background)",zIndex:9999,justifyContent:C?"center":y.justifyContent}};return e.createElement("div",{className:c("react-loadly react-loadly-pulse",p),style:L,role:"status","aria-label":x,"aria-live":"polite","aria-busy":u,"data-testid":v,...k},e.createElement(g,{count:m,dotSize:I,color:l,secondaryColor:o,speed:d,arrangement:"linear",animationType:"pulse",spacing:I/2,"data-testid":v?`${v}-dots`:void 0}),h&&e.createElement("div",{className:"react-loadly-text",id:`${N}-text`,"aria-live":"polite"},f),e.createElement("span",{className:"react-loadly-sr-only"},x))},exports.Rectangle=p,exports.RingLoader=r=>{const n=t(M,r),{size:l,color:o,speed:d,loading:u,className:m="",style:p={},borderWidth:y,showText:g,loadingText:h="Loading...","aria-label":f,"data-testid":x,fullscreen:v,screenWidth:b,screenHeight:$,loaderCenter:w,screenBackground:C,...E}=n,k=e.useRef(s("ring-loader")),N=a(l),I=i(d);if(!u)return null;const L={display:"inline-flex",flexDirection:"column",alignItems:"center",...p,...v&&{position:"fixed",top:0,left:0,width:b||"100vw",height:$||"100vh",backgroundColor:C||"var(--react-loadly-background)",zIndex:9999,justifyContent:w?"center":p.justifyContent}},z={position:"relative",width:N,height:N},T={boxSizing:"border-box",display:"block",position:"absolute",width:N,height:N,border:`${y}px solid transparent`,borderTop:`${y}px solid ${o}`,borderBottom:`${y}px solid ${o}`,borderRadius:"50%",animation:`react-loadly-ring ${I.duration} cubic-bezier(0.5, 0, 0.5, 1) infinite`,animationPlayState:I.playState},D=Array.from({length:4}).map((t,a)=>{const r=90*a+"deg",n=-.15*a+"s";return e.createElement("div",{key:a,style:{...T,transform:`rotate(${r})`,animationDelay:n},"data-testid":x?`${x}-segment-${a}`:void 0})});return e.createElement("div",{className:c("react-loadly react-loadly-ring",m),style:L,role:"status","aria-label":f,"aria-live":"polite","aria-busy":u,"data-testid":x,...E},e.createElement("div",{style:z},D),g&&e.createElement("div",{className:"react-loadly-text",id:`${k.current}-text`,"aria-live":"polite"},h),e.createElement("span",{className:"react-loadly-sr-only"},f))},exports.RotateLoader=r=>{const n=t(T,r),{size:l,color:o,speed:d,loading:u,className:m="",style:p={},count:y=2,showText:g,loadingText:h="Loading...","aria-label":f,"data-testid":x,fullscreen:v,screenWidth:b,screenHeight:$,loaderCenter:w,screenBackground:C,...E}=n,k=e.useMemo(()=>s("rotate-loader"),[]),N=a(l),I=i(d);if(!u)return null;const L={display:"inline-flex",flexDirection:"column",alignItems:"center",...p,...v&&{position:"fixed",top:0,left:0,width:b||"100vw",height:$||"100vh",backgroundColor:C||"var(--react-loadly-background)",zIndex:9999,justifyContent:w?"center":p.justifyContent}},z={position:"relative",width:N,height:N},M={position:"absolute",width:N,height:N,border:"2px solid transparent",borderTopColor:o,borderBottomColor:o,borderRadius:"50%",animation:`react-loadly-ring ${I.duration} cubic-bezier(0.5, 0, 0.5, 1) infinite`,animationPlayState:I.playState,transform:"rotate(0deg)"},D=Array.from({length:y}).map((t,a)=>{const r=1-.2*a,n=2+a,i=-.15*a+"s";return e.createElement("div",{key:a,style:{...M,width:parseFloat(N)*r+"px",height:parseFloat(N)*r+"px",borderWidth:`${n}px`,animationDuration:parseFloat(I.duration)*(1+.5*a)+"ms",animationDelay:i},"data-testid":x?`${x}-element-${a}`:void 0})});return e.createElement("div",{className:c("react-loadly react-loadly-rotate",m),style:L,role:"status","aria-label":f,"aria-live":"polite","aria-busy":u,"data-testid":x,...E},e.createElement("div",{style:z},D),g&&e.createElement("div",{className:"react-loadly-text",id:`${k}-text`,"aria-live":"polite"},h),e.createElement("span",{className:"react-loadly-sr-only"},f))},exports.ShapeGroup=({count:t=4,shapeSize:n=16,color:i="var(--react-loadly-color)",secondaryColor:l,spacing:o=8,speed:s=1,arrangement:d="linear",shapeTypes:c=["circle","rectangle"],className:u="",style:m={},animationType:g="pulse",borderWidth:h=0,"data-testid":f,...x})=>{const v=a(o),b=r(800,s),$=e=>{if("circular"===d){const a=e/t*2*Math.PI,r=2*parseInt(v);return{position:"absolute",left:"50%",top:"50%",transform:`translate(-50%, -50%) translate(${Math.cos(a)*r}px, ${Math.sin(a)*r}px)`}}if("spiral"===d){const a=e/t*4*Math.PI,r=(e+1)*parseInt(v)/2;return{position:"absolute",left:"50%",top:"50%",transform:`translate(-50%, -50%) translate(${Math.cos(a)*r}px, ${Math.sin(a)*r}px)`}}return{}},w=e=>.15*e/s+"s",C={...(()=>{switch(d){case"circular":return{display:"flex",alignItems:"center",justifyContent:"center",position:"relative",width:2.5*(parseInt(a(n))+parseInt(v))+"px",height:2.5*(parseInt(a(n))+parseInt(v))+"px"};case"spiral":return{display:"flex",alignItems:"center",justifyContent:"center",position:"relative",width:3*(parseInt(a(n))+parseInt(v))+"px",height:3*(parseInt(a(n))+parseInt(v))+"px"};default:return{display:"flex",alignItems:"center",gap:v}}})(),...m},E=t=>{const a=(e=>c[e%c.length])(t),r=l&&t%2==1?l:i,o={key:t,color:h>0?void 0:r,borderColor:h>0?r:void 0,borderWidth:h>0?h:void 0,animation:`react-loadly-${g}`,animationDuration:b,animationDelay:w(t),style:$(t),"data-testid":f?`${f}-shape-${t}`:void 0};return"circle"===a?e.createElement(y,{...o,size:n}):e.createElement(p,{...o,width:n,height:n})};return e.createElement("div",{className:`react-loadly-shape-group react-loadly-shape-group-${d} ${u}`.trim(),style:C,"data-testid":f,...x},Array.from({length:t},(e,t)=>E(t)))},exports.SkeletonLoader=r=>{const n=t(D,r),{size:i,width:l,height:o,speed:s,loading:d,className:u="",style:m={},lines:p=1,variant:y,borderRadius:g,spacing:h,shimmer:f,color:x,highlightColor:v,shimmerColor:b,waveWidth:$,waveDirection:w,showText:C,loadingText:E="Loading content...","aria-label":k,"data-testid":N,fullscreen:I,screenWidth:L,screenHeight:z,loaderCenter:M,screenBackground:T,...R}=n;if(!d)return null;const j={display:"inline-flex",flexDirection:"column",alignItems:"center",...m,...I&&{position:"fixed",top:0,left:0,width:L||"100vw",height:z||"100vh",backgroundColor:T||"var(--react-loadly-background)",zIndex:9999,justifyContent:M?"center":m.justifyContent}},S=(()=>{switch(y){case"avatar":return{width:l||i||"40px",height:o||i||"40px",borderRadius:g||"50%"};case"card":return{width:l||"300px",height:o||"200px",borderRadius:g||"8px"};case"text":return{width:l||"100%",height:o||"16px",borderRadius:g||"4px"};default:return{width:l||i||"100%",height:o||"16px",borderRadius:g||"4px"}}})(),W=a(h,"8px"),B=a($,"200px"),H={width:a(S.width),height:a(S.height),backgroundColor:x,borderRadius:a(S.borderRadius),position:"relative",overflow:"hidden",...f&&{background:`linear-gradient(${"left-to-right"===w?"90deg":"right-to-left"===w?"270deg":"top-to-bottom"===w?"180deg":"0deg"}, ${x} 0%, ${v} 50%, ${x} 100%)`,backgroundSize:`${B} 100%`,animation:`react-loadly-shimmer ${1.5/(s||1)}s ease-in-out infinite`}};return e.createElement("div",{className:c("react-loadly react-loadly-skeleton",u),style:j,role:"status","aria-label":k,"aria-live":"polite","aria-busy":d,"data-testid":N,...R},e.createElement("div",{style:{display:"flex",flexDirection:"column",width:"100%"}},Array.from({length:p},(t,a)=>{const r=a===p-1&&p>1?"60%":"100%";return e.createElement("div",{key:a,style:{...H,width:r,marginBottom:a<p-1?W:0},"data-testid":N?`${N}-skeleton-${a}`:void 0},f&&e.createElement("div",{style:{position:"absolute",top:0,left:0,right:0,bottom:0,background:`linear-gradient(90deg, transparent, ${b}, transparent)`,animation:`react-loadly-shimmer-overlay ${1.5/(s||1)}s ease-in-out infinite`,animationDelay:.1*a+"s"}}))})),C&&e.createElement("div",{className:"react-loadly-text","aria-live":"polite"},E),e.createElement("span",{className:"react-loadly-sr-only"},k))},exports.SpinLoader=r=>{const n=t(R,r),{size:l,color:o,speed:d,loading:u,className:m="",style:p={},borderWidth:y,showText:g,loadingText:h="Loading...","aria-label":f,"data-testid":x,fullscreen:v,screenWidth:b,screenHeight:$,loaderCenter:w,screenBackground:C,...E}=n,k=e.useRef(s("spin-loader")),N=a(l),I=i(d);if(!u)return null;const L={display:"inline-flex",flexDirection:"column",alignItems:"center",...p,...v&&{position:"fixed",top:0,left:0,width:b||"100vw",height:$||"100vh",backgroundColor:C||"var(--react-loadly-background)",zIndex:9999,justifyContent:w?"center":p.justifyContent}},z={width:N,height:N,border:`${y}px solid transparent`,borderTop:`${y}px solid ${o}`,borderRadius:"50%",animation:`react-loadly-spin ${I.duration} linear infinite`,animationPlayState:I.playState};return e.createElement("div",{className:c("react-loadly react-loadly-spin",m),style:L,role:"status","aria-label":f,"aria-live":"polite","aria-busy":u,"data-testid":x,...E},e.createElement("div",{style:z,"data-testid":x?`${x}-spinner`:void 0}),g&&e.createElement("div",{className:"react-loadly-text",id:`${k.current}-text`,"aria-live":"polite"},h),e.createElement("span",{className:"react-loadly-sr-only"},f))},exports.TypingLoader=a=>{const r=t(j,a),{loadingText:n,speed:i=1,loading:l,charDelay:o=100,loop:s,className:d="",style:u={},color:m="var(--react-loadly-text-color)",fontFamily:p,fontWeight:y=500,"aria-label":g,"data-testid":h,showText:f,fullscreen:x,screenWidth:v,screenHeight:b,loaderCenter:$,screenBackground:w,size:C=18,...E}=r,[k,N]=e.useState(""),[I,L]=e.useState(!1),z=e.useRef(null);if(e.useEffect(()=>{if(z.current&&(clearTimeout(z.current),z.current=null),!l||!n)return void N("");L(!0),N("");const e=(t=0)=>{t<n.length?(N(n.substring(0,t+1)),z.current=setTimeout(()=>e(t+1),o/i)):s?z.current=setTimeout(()=>{N(""),e(0)},2*o):L(!1)};return e(0),()=>{z.current&&clearTimeout(z.current)}},[l,n,o,i,s]),!l)return null;const M={display:"inline-flex",flexDirection:"column",alignItems:"center",...u,...x&&{position:"fixed",top:0,left:0,width:v||"100vw",height:b||"100vh",backgroundColor:w||"var(--react-loadly-background)",zIndex:9999,justifyContent:$?"center":u.justifyContent}},T={color:m,fontFamily:p,fontWeight:y,fontSize:C,whiteSpace:"pre"};return e.createElement("div",{className:c("react-loadly react-loadly-typing",d),style:M,role:"status","aria-label":g,"aria-live":"polite","aria-busy":l,"data-testid":h,...E},e.createElement("div",{style:T,"data-testid":h?`${h}-text`:void 0},k,e.createElement("span",{className:"react-loadly-typing-cursor",style:{display:I?"inline-block":"none",animation:`react-loadly-blink ${1/i}s step-end infinite`,marginLeft:"2px",verticalAlign:"baseline"}},"|")),f&&e.createElement("div",{className:"react-loadly-text","aria-live":"polite"},n),e.createElement("span",{className:"react-loadly-sr-only"},g))},exports.WaveLoader=r=>{const n=t(S,r),{size:i,color:l,secondaryColor:o,speed:d,loading:u,count:m,className:p="",style:y={},showText:g,loadingText:f="Loading...","aria-label":x,"data-testid":v,fullscreen:b,screenWidth:$,screenHeight:w,loaderCenter:C,screenBackground:E,...k}=n,N=e.useMemo(()=>s("wave-loader"),[]),I=e.useMemo(()=>{const e="number"==typeof i?i:parseInt(a(i));return{width:Math.max(e/10,3),height:e,spacing:Math.max(e/8,4)}},[i]);if(!u)return null;const L={display:"inline-flex",flexDirection:"column",alignItems:"center",...y,...b&&{position:"fixed",top:0,left:0,width:$||"100vw",height:w||"100vh",backgroundColor:E||"var(--react-loadly-background)",zIndex:9999,justifyContent:C?"center":y.justifyContent}};return e.createElement("div",{className:c("react-loadly react-loadly-wave",p),style:L,role:"status","aria-label":x,"aria-live":"polite","aria-busy":u,"data-testid":v,...k},e.createElement(h,{count:m,lineWidth:I.width,lineHeight:I.height,color:l,secondaryColor:o,speed:d,arrangement:"staggered",orientation:"vertical",animationType:"wave",spacing:I.spacing,"data-testid":v?`${v}-lines`:void 0}),g&&e.createElement("div",{className:"react-loadly-text",id:`${N}-text`,"aria-live":"polite"},f),e.createElement("span",{className:"react-loadly-sr-only"},x))},exports.clamp=l,exports.classNameGen=c,exports.createAnimationName=function(e){return`react-loadly-${e}`},exports.createAnimationString=function(e,t,a="ease",r="normal",n="infinite"){return`${e} ${t} ${a} ${r} ${n}`},exports.generateCSSVariables=function(e){const t={};return Object.entries(e).forEach(([e,a])=>{void 0!==a&&(t[e]=a)}),t},exports.generateId=s,exports.getAnimationDirection=function(e="normal"){return e},exports.getAnimationDuration=r,exports.getAnimationEasing=function(e="ease"){return e},exports.getOptimizedAnimationSettings=i,exports.getSizeValue=a,exports.hexToRgb=o,exports.mergeProps=t,exports.prefersReducedMotion=n,exports.rgba=function(e,t){const a=o(e);return a?`rgba(${a.r}, ${a.g}, ${a.b}, ${l(t,0,1)})`:e},exports.sanitizeCSSValue=d,exports.useAsyncLoader=(t,a=[],r={})=>{const n=W(r),[i,l]=e.useState(null),o=e.useCallback(async()=>{try{n.setLoading(!0),n.setError(null);const e=await t();return l(e),n.setProgress(100),e}catch(e){const t=e instanceof Error?e.message:"Unknown error occurred";return n.setError(t),null}},[t,n]);return e.useEffect(()=>{o()},a),{...n,data:i,execute:o}},exports.useLoaderState=W,exports.useMultipleLoaderStates=(e,t={})=>e.reduce((e,a)=>(e[a]=W(t),e),{});
|
|
2
2
|
//# sourceMappingURL=index.cjs.js.map
|