@frybynite/image-cloud 0.5.0 → 0.6.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.
@@ -1,30 +1,30 @@
1
- const ft = Object.freeze({
1
+ const pt = Object.freeze({
2
2
  none: "none",
3
3
  sm: "0 2px 4px rgba(0,0,0,0.1)",
4
4
  md: "0 4px 16px rgba(0,0,0,0.4)",
5
5
  lg: "0 8px 32px rgba(0,0,0,0.5)",
6
6
  glow: "0 0 30px rgba(255,255,255,0.6)"
7
- }), wt = Object.freeze({
7
+ }), St = Object.freeze({
8
8
  energetic: Object.freeze({ overshoot: 0.25, bounces: 2, decayRatio: 0.5 }),
9
9
  playful: Object.freeze({ overshoot: 0.15, bounces: 1, decayRatio: 0.5 }),
10
10
  subtle: Object.freeze({ overshoot: 0.08, bounces: 1, decayRatio: 0.5 })
11
- }), xt = Object.freeze({
11
+ }), Et = Object.freeze({
12
12
  gentle: Object.freeze({ stiffness: 150, damping: 30, mass: 1, oscillations: 2 }),
13
13
  bouncy: Object.freeze({ stiffness: 300, damping: 15, mass: 1, oscillations: 4 }),
14
14
  wobbly: Object.freeze({ stiffness: 180, damping: 12, mass: 1.5, oscillations: 5 }),
15
15
  snappy: Object.freeze({ stiffness: 400, damping: 25, mass: 0.8, oscillations: 2 })
16
- }), Et = Object.freeze({
16
+ }), It = Object.freeze({
17
17
  gentle: Object.freeze({ amplitude: 30, frequency: 1.5, decay: !0, decayRate: 0.9, phase: 0 }),
18
18
  playful: Object.freeze({ amplitude: 50, frequency: 2.5, decay: !0, decayRate: 0.7, phase: 0 }),
19
19
  serpentine: Object.freeze({ amplitude: 60, frequency: 3, decay: !1, decayRate: 1, phase: 0 }),
20
20
  flutter: Object.freeze({ amplitude: 20, frequency: 4, decay: !0, decayRate: 0.5, phase: 0 })
21
- }), pt = Object.freeze({
21
+ }), yt = Object.freeze({
22
22
  type: "linear"
23
- }), bt = Object.freeze({
23
+ }), vt = Object.freeze({
24
24
  mode: "none"
25
- }), yt = Object.freeze({
25
+ }), wt = Object.freeze({
26
26
  mode: "none"
27
- }), Tt = Object.freeze({
27
+ }), Ct = Object.freeze({
28
28
  default: Object.freeze({
29
29
  border: Object.freeze({
30
30
  width: 0,
@@ -49,17 +49,17 @@ const ft = Object.freeze({
49
49
  focused: Object.freeze({
50
50
  shadow: "none"
51
51
  })
52
- }), Dt = Object.freeze({
52
+ }), $t = Object.freeze({
53
53
  rows: 1,
54
54
  amplitude: 100,
55
55
  frequency: 2,
56
56
  phaseShift: 0,
57
57
  synchronization: "offset"
58
58
  // Note: Image rotation along wave is now controlled via image.rotation.mode = 'tangent'
59
- }), Ot = Object.freeze({
59
+ }), Ut = Object.freeze({
60
60
  mobile: Object.freeze({ maxWidth: 767 }),
61
61
  tablet: Object.freeze({ maxWidth: 1199 })
62
- }), $t = Object.freeze({
62
+ }), Pt = Object.freeze({
63
63
  mode: "adaptive",
64
64
  // Default to adaptive sizing
65
65
  minSize: 50,
@@ -71,21 +71,21 @@ const ft = Object.freeze({
71
71
  // No variance by default
72
72
  max: 1
73
73
  })
74
- }), Ut = Object.freeze({
74
+ }), _t = Object.freeze({
75
75
  mode: "none",
76
76
  range: Object.freeze({
77
77
  min: -15,
78
78
  max: 15
79
79
  })
80
80
  }), Rt = Object.freeze({
81
- sizing: $t,
82
- rotation: Ut
83
- }), Ct = Object.freeze({
81
+ sizing: Pt,
82
+ rotation: _t
83
+ }), Lt = Object.freeze({
84
84
  validateUrls: !0,
85
85
  validationTimeout: 5e3,
86
86
  validationMethod: "head",
87
87
  allowedExtensions: ["jpg", "jpeg", "png", "gif", "webp", "bmp"]
88
- }), At = Object.freeze({
88
+ }), Mt = Object.freeze({
89
89
  enabled: !1,
90
90
  centers: !1,
91
91
  loaders: !1
@@ -94,8 +94,8 @@ const ft = Object.freeze({
94
94
  loaders: [],
95
95
  // Shared loader settings and debug config
96
96
  config: Object.freeze({
97
- loaders: Ct,
98
- debug: At
97
+ loaders: Lt,
98
+ debug: Mt
99
99
  }),
100
100
  // Image sizing and rotation configuration
101
101
  image: Rt,
@@ -104,7 +104,7 @@ const ft = Object.freeze({
104
104
  algorithm: "radial",
105
105
  scaleDecay: 0,
106
106
  // No decay by default (0-1 for radial/spiral)
107
- responsive: Ot,
107
+ responsive: Ut,
108
108
  targetCoverage: 0.6,
109
109
  // Target 60% of container area
110
110
  densityFactor: 1,
@@ -160,9 +160,9 @@ const ft = Object.freeze({
160
160
  }),
161
161
  easing: "cubic-bezier(0.25, 1, 0.5, 1)",
162
162
  // smooth deceleration
163
- path: pt,
164
- rotation: bt,
165
- scale: yt
163
+ path: yt,
164
+ rotation: vt,
165
+ scale: wt
166
166
  })
167
167
  }),
168
168
  // Pattern-based interaction configuration
@@ -219,50 +219,50 @@ const ft = Object.freeze({
219
219
  })
220
220
  }),
221
221
  // Image styling
222
- styling: Tt
222
+ styling: Ct
223
223
  });
224
- function Z(n, t) {
225
- if (!n) return t || {};
226
- if (!t) return { ...n };
227
- const e = { ...n };
228
- return t.border !== void 0 && (e.border = { ...n.border, ...t.border }), t.borderTop !== void 0 && (e.borderTop = { ...n.borderTop, ...t.borderTop }), t.borderRight !== void 0 && (e.borderRight = { ...n.borderRight, ...t.borderRight }), t.borderBottom !== void 0 && (e.borderBottom = { ...n.borderBottom, ...t.borderBottom }), t.borderLeft !== void 0 && (e.borderLeft = { ...n.borderLeft, ...t.borderLeft }), t.filter !== void 0 && (e.filter = { ...n.filter, ...t.filter }), t.outline !== void 0 && (e.outline = { ...n.outline, ...t.outline }), t.shadow !== void 0 && (e.shadow = t.shadow), t.opacity !== void 0 && (e.opacity = t.opacity), t.cursor !== void 0 && (e.cursor = t.cursor), t.className !== void 0 && (e.className = t.className), t.objectFit !== void 0 && (e.objectFit = t.objectFit), t.aspectRatio !== void 0 && (e.aspectRatio = t.aspectRatio), t.borderRadiusTopLeft !== void 0 && (e.borderRadiusTopLeft = t.borderRadiusTopLeft), t.borderRadiusTopRight !== void 0 && (e.borderRadiusTopRight = t.borderRadiusTopRight), t.borderRadiusBottomRight !== void 0 && (e.borderRadiusBottomRight = t.borderRadiusBottomRight), t.borderRadiusBottomLeft !== void 0 && (e.borderRadiusBottomLeft = t.borderRadiusBottomLeft), e;
224
+ function Q(o, t) {
225
+ if (!o) return t || {};
226
+ if (!t) return { ...o };
227
+ const e = { ...o };
228
+ return t.border !== void 0 && (e.border = { ...o.border, ...t.border }), t.borderTop !== void 0 && (e.borderTop = { ...o.borderTop, ...t.borderTop }), t.borderRight !== void 0 && (e.borderRight = { ...o.borderRight, ...t.borderRight }), t.borderBottom !== void 0 && (e.borderBottom = { ...o.borderBottom, ...t.borderBottom }), t.borderLeft !== void 0 && (e.borderLeft = { ...o.borderLeft, ...t.borderLeft }), t.filter !== void 0 && (e.filter = { ...o.filter, ...t.filter }), t.outline !== void 0 && (e.outline = { ...o.outline, ...t.outline }), t.shadow !== void 0 && (e.shadow = t.shadow), t.opacity !== void 0 && (e.opacity = t.opacity), t.cursor !== void 0 && (e.cursor = t.cursor), t.className !== void 0 && (e.className = t.className), t.objectFit !== void 0 && (e.objectFit = t.objectFit), t.aspectRatio !== void 0 && (e.aspectRatio = t.aspectRatio), t.borderRadiusTopLeft !== void 0 && (e.borderRadiusTopLeft = t.borderRadiusTopLeft), t.borderRadiusTopRight !== void 0 && (e.borderRadiusTopRight = t.borderRadiusTopRight), t.borderRadiusBottomRight !== void 0 && (e.borderRadiusBottomRight = t.borderRadiusBottomRight), t.borderRadiusBottomLeft !== void 0 && (e.borderRadiusBottomLeft = t.borderRadiusBottomLeft), e;
229
229
  }
230
- function Pt(n, t) {
231
- if (!t) return { ...n };
232
- const e = Z(n.default, t.default), i = Z(
233
- Z(e, n.hover),
230
+ function Ht(o, t) {
231
+ if (!t) return { ...o };
232
+ const e = Q(o.default, t.default), i = Q(
233
+ Q(e, o.hover),
234
234
  t.hover
235
- ), o = Z(
236
- Z(e, n.focused),
235
+ ), n = Q(
236
+ Q(e, o.focused),
237
237
  t.focused
238
238
  );
239
239
  return {
240
240
  default: e,
241
241
  hover: i,
242
- focused: o
242
+ focused: n
243
243
  };
244
244
  }
245
- function _t(n, t) {
246
- if (!t) return { ...n };
247
- const e = { ...n };
245
+ function Nt(o, t) {
246
+ if (!t) return { ...o };
247
+ const e = { ...o };
248
248
  if (t.sizing !== void 0 && (e.sizing = {
249
- ...n.sizing,
249
+ ...o.sizing,
250
250
  ...t.sizing
251
251
  }, t.sizing.variance)) {
252
- const i = t.sizing.variance, o = i.min !== void 0 && i.min >= 0.25 && i.min <= 1 ? i.min : n.sizing?.variance?.min ?? 1, s = i.max !== void 0 && i.max >= 1 && i.max <= 1.75 ? i.max : n.sizing?.variance?.max ?? 1;
253
- e.sizing.variance = { min: o, max: s };
252
+ const i = t.sizing.variance, n = i.min !== void 0 && i.min >= 0.25 && i.min <= 1 ? i.min : o.sizing?.variance?.min ?? 1, s = i.max !== void 0 && i.max >= 1 && i.max <= 1.75 ? i.max : o.sizing?.variance?.max ?? 1;
253
+ e.sizing.variance = { min: n, max: s };
254
254
  }
255
255
  if (t.rotation !== void 0 && (e.rotation = {
256
- ...n.rotation,
256
+ ...o.rotation,
257
257
  ...t.rotation
258
258
  }, t.rotation.range)) {
259
- const i = t.rotation.range, o = i.min !== void 0 && i.min >= -180 && i.min <= 0 ? i.min : n.rotation?.range?.min ?? -15, s = i.max !== void 0 && i.max >= 0 && i.max <= 180 ? i.max : n.rotation?.range?.max ?? 15;
260
- e.rotation.range = { min: o, max: s };
259
+ const i = t.rotation.range, n = i.min !== void 0 && i.min >= -180 && i.min <= 0 ? i.min : o.rotation?.range?.min ?? -15, s = i.max !== void 0 && i.max >= 0 && i.max <= 180 ? i.max : o.rotation?.range?.max ?? 15;
260
+ e.rotation.range = { min: n, max: s };
261
261
  }
262
262
  return e;
263
263
  }
264
- function Ht(n) {
265
- const t = n.layout?.rotation;
264
+ function jt(o) {
265
+ const t = o.layout?.rotation;
266
266
  if (t && "enabled" in t)
267
267
  return {
268
268
  rotation: {
@@ -271,8 +271,8 @@ function Ht(n) {
271
271
  }
272
272
  };
273
273
  }
274
- function Nt(n) {
275
- const t = n.layout?.sizing?.variance;
274
+ function kt(o) {
275
+ const t = o.layout?.sizing?.variance;
276
276
  if (t)
277
277
  return {
278
278
  sizing: {
@@ -282,113 +282,113 @@ function Nt(n) {
282
282
  }
283
283
  };
284
284
  }
285
- function jt(n = {}) {
286
- const t = Ht(n), e = Nt(n);
287
- let i = n.image;
285
+ function Gt(o = {}) {
286
+ const t = jt(o), e = kt(o);
287
+ let i = o.image;
288
288
  (t || e) && (i = {
289
289
  ...e || {},
290
290
  ...t || {},
291
291
  ...i
292
- }, i.rotation && t?.rotation && n.image?.rotation && (i.rotation = {
292
+ }, i.rotation && t?.rotation && o.image?.rotation && (i.rotation = {
293
293
  ...t.rotation,
294
- ...n.image.rotation
294
+ ...o.image.rotation
295
295
  }));
296
- const o = [...n.loaders ?? []];
297
- n.images && n.images.length > 0 && o.unshift({
296
+ const n = [...o.loaders ?? []];
297
+ o.images && o.images.length > 0 && n.unshift({
298
298
  static: {
299
- sources: [{ urls: n.images }]
299
+ sources: [{ urls: o.images }]
300
300
  }
301
301
  });
302
302
  const r = {
303
303
  loaders: {
304
- ...Ct,
305
- ...n.config?.loaders ?? {}
304
+ ...Lt,
305
+ ...o.config?.loaders ?? {}
306
306
  }
307
307
  }, a = {
308
- loaders: o,
308
+ loaders: n,
309
309
  config: r,
310
- image: _t(Rt, i),
310
+ image: Nt(Rt, i),
311
311
  layout: { ...y.layout },
312
312
  animation: { ...y.animation },
313
313
  interaction: { ...y.interaction },
314
314
  rendering: { ...y.rendering },
315
- styling: Pt(Tt, n.styling)
315
+ styling: Ht(Ct, o.styling)
316
316
  };
317
- return n.layout && (a.layout = {
317
+ return o.layout && (a.layout = {
318
318
  ...y.layout,
319
- ...n.layout
320
- }, n.layout.responsive && (a.layout.responsive = {
319
+ ...o.layout
320
+ }, o.layout.responsive && (a.layout.responsive = {
321
321
  ...y.layout.responsive,
322
- mobile: n.layout.responsive.mobile ? { ...y.layout.responsive.mobile, ...n.layout.responsive.mobile } : y.layout.responsive.mobile,
323
- tablet: n.layout.responsive.tablet ? { ...y.layout.responsive.tablet, ...n.layout.responsive.tablet } : y.layout.responsive.tablet
324
- }), n.layout.spacing && (a.layout.spacing = {
322
+ mobile: o.layout.responsive.mobile ? { ...y.layout.responsive.mobile, ...o.layout.responsive.mobile } : y.layout.responsive.mobile,
323
+ tablet: o.layout.responsive.tablet ? { ...y.layout.responsive.tablet, ...o.layout.responsive.tablet } : y.layout.responsive.tablet
324
+ }), o.layout.spacing && (a.layout.spacing = {
325
325
  ...y.layout.spacing,
326
- ...n.layout.spacing
327
- })), n.animation && (a.animation = {
326
+ ...o.layout.spacing
327
+ })), o.animation && (a.animation = {
328
328
  ...y.animation,
329
- ...n.animation
330
- }, n.animation.easing && (a.animation.easing = {
329
+ ...o.animation
330
+ }, o.animation.easing && (a.animation.easing = {
331
331
  ...y.animation.easing,
332
- ...n.animation.easing
333
- }), n.animation.queue && (a.animation.queue = {
332
+ ...o.animation.easing
333
+ }), o.animation.queue && (a.animation.queue = {
334
334
  ...y.animation.queue,
335
- ...n.animation.queue
336
- }), n.animation.performance && (a.animation.performance = {
335
+ ...o.animation.queue
336
+ }), o.animation.performance && (a.animation.performance = {
337
337
  ...y.animation.performance,
338
- ...n.animation.performance
339
- }), n.animation.entry && (a.animation.entry = {
338
+ ...o.animation.performance
339
+ }), o.animation.entry && (a.animation.entry = {
340
340
  ...y.animation.entry,
341
- ...n.animation.entry,
342
- start: n.animation.entry.start ? {
341
+ ...o.animation.entry,
342
+ start: o.animation.entry.start ? {
343
343
  ...y.animation.entry.start,
344
- ...n.animation.entry.start,
345
- circular: n.animation.entry.start.circular ? { ...y.animation.entry.start.circular, ...n.animation.entry.start.circular } : y.animation.entry.start.circular
344
+ ...o.animation.entry.start,
345
+ circular: o.animation.entry.start.circular ? { ...y.animation.entry.start.circular, ...o.animation.entry.start.circular } : y.animation.entry.start.circular
346
346
  } : y.animation.entry.start,
347
- timing: n.animation.entry.timing ? { ...y.animation.entry.timing, ...n.animation.entry.timing } : y.animation.entry.timing,
348
- path: n.animation.entry.path ? { ...pt, ...n.animation.entry.path } : y.animation.entry.path,
349
- rotation: n.animation.entry.rotation ? { ...bt, ...n.animation.entry.rotation } : y.animation.entry.rotation,
350
- scale: n.animation.entry.scale ? { ...yt, ...n.animation.entry.scale } : y.animation.entry.scale
351
- })), n.interaction && (a.interaction = {
347
+ timing: o.animation.entry.timing ? { ...y.animation.entry.timing, ...o.animation.entry.timing } : y.animation.entry.timing,
348
+ path: o.animation.entry.path ? { ...yt, ...o.animation.entry.path } : y.animation.entry.path,
349
+ rotation: o.animation.entry.rotation ? { ...vt, ...o.animation.entry.rotation } : y.animation.entry.rotation,
350
+ scale: o.animation.entry.scale ? { ...wt, ...o.animation.entry.scale } : y.animation.entry.scale
351
+ })), o.interaction && (a.interaction = {
352
352
  ...y.interaction,
353
- ...n.interaction
354
- }, n.interaction.focus && (a.interaction.focus = {
353
+ ...o.interaction
354
+ }, o.interaction.focus && (a.interaction.focus = {
355
355
  ...y.interaction.focus,
356
- ...n.interaction.focus
357
- }), n.interaction.navigation && (a.interaction.navigation = {
356
+ ...o.interaction.focus
357
+ }), o.interaction.navigation && (a.interaction.navigation = {
358
358
  ...y.interaction.navigation,
359
- ...n.interaction.navigation
360
- }), n.interaction.gestures && (a.interaction.gestures = {
359
+ ...o.interaction.navigation
360
+ }), o.interaction.gestures && (a.interaction.gestures = {
361
361
  ...y.interaction.gestures,
362
- ...n.interaction.gestures
363
- })), n.rendering && (a.rendering = {
362
+ ...o.interaction.gestures
363
+ })), o.rendering && (a.rendering = {
364
364
  ...y.rendering,
365
- ...n.rendering
366
- }, n.rendering.responsive && (a.rendering.responsive = {
365
+ ...o.rendering
366
+ }, o.rendering.responsive && (a.rendering.responsive = {
367
367
  ...y.rendering.responsive,
368
- ...n.rendering.responsive,
369
- breakpoints: n.rendering.responsive.breakpoints ? { ...y.rendering.responsive.breakpoints, ...n.rendering.responsive.breakpoints } : y.rendering.responsive.breakpoints,
370
- mobileDetection: n.rendering.responsive.mobileDetection ? n.rendering.responsive.mobileDetection : y.rendering.responsive.mobileDetection
371
- }), n.rendering.ui && (a.rendering.ui = {
368
+ ...o.rendering.responsive,
369
+ breakpoints: o.rendering.responsive.breakpoints ? { ...y.rendering.responsive.breakpoints, ...o.rendering.responsive.breakpoints } : y.rendering.responsive.breakpoints,
370
+ mobileDetection: o.rendering.responsive.mobileDetection ? o.rendering.responsive.mobileDetection : y.rendering.responsive.mobileDetection
371
+ }), o.rendering.ui && (a.rendering.ui = {
372
372
  ...y.rendering.ui,
373
- ...n.rendering.ui
374
- }), n.rendering.performance && (a.rendering.performance = {
373
+ ...o.rendering.ui
374
+ }), o.rendering.performance && (a.rendering.performance = {
375
375
  ...y.rendering.performance,
376
- ...n.rendering.performance
376
+ ...o.rendering.performance
377
377
  })), a.config.debug = {
378
- ...At,
379
- ...n.config?.debug ?? {}
378
+ ...Mt,
379
+ ...o.config?.debug ?? {}
380
380
  }, a;
381
381
  }
382
- function kt(n, t) {
383
- return { ...n ? wt[n] : wt.playful, ...t };
382
+ function Wt(o, t) {
383
+ return { ...o ? St[o] : St.playful, ...t };
384
384
  }
385
- function Wt(n, t) {
386
- return { ...n ? xt[n] : xt.gentle, ...t };
385
+ function qt(o, t) {
386
+ return { ...o ? Et[o] : Et.gentle, ...t };
387
387
  }
388
- function Gt(n, t) {
389
- return { ...n ? Et[n] : Et.gentle, ...t };
388
+ function Yt(o, t) {
389
+ return { ...o ? It[o] : It.gentle, ...t };
390
390
  }
391
- class qt {
391
+ class Xt {
392
392
  constructor(t) {
393
393
  this.activeAnimations = /* @__PURE__ */ new Map(), this.animationIdCounter = 0, this.config = t;
394
394
  }
@@ -399,8 +399,8 @@ class qt {
399
399
  buildTransformString(t) {
400
400
  const e = ["translate(-50%, -50%)"];
401
401
  if (t.x !== void 0 || t.y !== void 0) {
402
- const i = t.x ?? 0, o = t.y ?? 0;
403
- e.push(`translate(${i}px, ${o}px)`);
402
+ const i = t.x ?? 0, n = t.y ?? 0;
403
+ e.push(`translate(${i}px, ${n}px)`);
404
404
  }
405
405
  return t.rotation !== void 0 && e.push(`rotate(${t.rotation}deg)`), t.scale !== void 0 && e.push(`scale(${t.scale})`), e.join(" ");
406
406
  }
@@ -413,9 +413,9 @@ class qt {
413
413
  * @param easing - CSS easing function (optional)
414
414
  * @returns AnimationHandle that can be used to cancel or query the animation
415
415
  */
416
- animateTransformCancellable(t, e, i, o = null, s = null) {
416
+ animateTransformCancellable(t, e, i, n = null, s = null) {
417
417
  this.cancelAllAnimations(t);
418
- const r = o ?? this.config.duration, a = s ?? this.config.easing.default, h = this.buildTransformString(e), c = this.buildTransformString(i);
418
+ const r = n ?? this.config.duration, a = s ?? this.config.easing.default, h = this.buildTransformString(e), c = this.buildTransformString(i);
419
419
  t.style.transition = "none";
420
420
  const u = t.animate(
421
421
  [
@@ -452,13 +452,13 @@ class qt {
452
452
  cancelAnimation(t, e = !0) {
453
453
  const i = this.getCurrentTransform(t.element);
454
454
  if (t.animation.cancel(), e) {
455
- const o = this.buildTransformString({
455
+ const n = this.buildTransformString({
456
456
  x: i.x,
457
457
  y: i.y,
458
458
  rotation: i.rotation,
459
459
  scale: i.scale
460
460
  });
461
- t.element.style.transform = o;
461
+ t.element.style.transform = n;
462
462
  }
463
463
  return this.activeAnimations.delete(t.element), i;
464
464
  }
@@ -471,8 +471,8 @@ class qt {
471
471
  const e = this.activeAnimations.get(t);
472
472
  e && this.cancelAnimation(e, !1);
473
473
  const i = t.getAnimations();
474
- for (const o of i)
475
- o.cancel();
474
+ for (const n of i)
475
+ n.cancel();
476
476
  }
477
477
  /**
478
478
  * Get current transform state of an element (works mid-animation)
@@ -484,7 +484,7 @@ class qt {
484
484
  const i = getComputedStyle(t).transform;
485
485
  if (i === "none" || !i)
486
486
  return { x: 0, y: 0, rotation: 0, scale: 1 };
487
- const o = new DOMMatrix(i), s = Math.sqrt(o.a * o.a + o.b * o.b), r = Math.atan2(o.b, o.a) * (180 / Math.PI), a = o.e, h = o.f;
487
+ const n = new DOMMatrix(i), s = Math.sqrt(n.a * n.a + n.b * n.b), r = Math.atan2(n.b, n.a) * (180 / Math.PI), a = n.e, h = n.f;
488
488
  return { x: a, y: h, rotation: r, scale: s };
489
489
  }
490
490
  /**
@@ -511,9 +511,9 @@ class qt {
511
511
  * @param easing - CSS easing function (optional)
512
512
  * @returns Promise that resolves when animation completes
513
513
  */
514
- animateTransform(t, e, i = null, o = null) {
514
+ animateTransform(t, e, i = null, n = null) {
515
515
  return new Promise((s) => {
516
- const r = i ?? this.config.duration, a = o ?? this.config.easing.default;
516
+ const r = i ?? this.config.duration, a = n ?? this.config.easing.default;
517
517
  t.style.transition = `transform ${r}ms ${a}, box-shadow ${r}ms ${a}`, t.style.transform = this.buildTransformString(e), setTimeout(() => {
518
518
  s();
519
519
  }, r);
@@ -544,99 +544,99 @@ class qt {
544
544
  return new Promise((e) => setTimeout(e, t));
545
545
  }
546
546
  }
547
- function V(n, t, e) {
548
- return n + (t - n) * e;
547
+ function V(o, t, e) {
548
+ return o + (t - o) * e;
549
549
  }
550
- function Yt(n, t, e, i) {
551
- const { overshoot: o, bounces: s, decayRatio: r } = i, a = e.x - t.x, h = e.y - t.y, c = Xt(s, r);
552
- let u = 0, l = 0, d = 1, f = o, b = !1;
550
+ function Bt(o, t, e, i) {
551
+ const { overshoot: n, bounces: s, decayRatio: r } = i, a = e.x - t.x, h = e.y - t.y, c = Jt(s, r);
552
+ let u = 0, l = 0, d = 1, m = n, b = !1;
553
553
  for (let g = 0; g < c.length; g++)
554
- if (n <= c[g].time) {
555
- l = g === 0 ? 0 : c[g - 1].time, d = c[g].time, f = c[g].overshoot, b = c[g].isOvershoot;
554
+ if (o <= c[g].time) {
555
+ l = g === 0 ? 0 : c[g - 1].time, d = c[g].time, m = c[g].overshoot, b = c[g].isOvershoot;
556
556
  break;
557
557
  }
558
- const p = (n - l) / (d - l);
558
+ const p = (o - l) / (d - l);
559
559
  if (b)
560
- u = 1 + f * ot(p);
560
+ u = 1 + m * at(p);
561
561
  else if (l === 0)
562
- u = ot(p);
562
+ u = at(p);
563
563
  else {
564
- const m = 1 + (c.find(
565
- (E, v) => E.time > l && v > 0 && c[v - 1].isOvershoot
566
- )?.overshoot || f);
567
- u = V(m, 1, ot(p));
564
+ const f = 1 + (c.find(
565
+ (S, v) => S.time > l && v > 0 && c[v - 1].isOvershoot
566
+ )?.overshoot || m);
567
+ u = V(f, 1, at(p));
568
568
  }
569
569
  return {
570
570
  x: t.x + a * u,
571
571
  y: t.y + h * u
572
572
  };
573
573
  }
574
- function Xt(n, t) {
574
+ function Jt(o, t) {
575
575
  const e = [];
576
576
  let i = 0.6;
577
577
  e.push({ time: i, overshoot: 0, isOvershoot: !1 });
578
- let o = 0.15;
579
- const r = 0.4 / (n * 2);
580
- for (let a = 0; a < n; a++)
581
- i += r, e.push({ time: i, overshoot: o, isOvershoot: !0 }), i += r, e.push({ time: i, overshoot: o * t, isOvershoot: !1 }), o *= t;
578
+ let n = 0.15;
579
+ const r = 0.4 / (o * 2);
580
+ for (let a = 0; a < o; a++)
581
+ i += r, e.push({ time: i, overshoot: n, isOvershoot: !0 }), i += r, e.push({ time: i, overshoot: n * t, isOvershoot: !1 }), n *= t;
582
582
  return e.push({ time: 1, overshoot: 0, isOvershoot: !1 }), e;
583
583
  }
584
- function Bt(n, t, e, i) {
585
- const { stiffness: o, damping: s, mass: r, oscillations: a } = i, h = e.x - t.x, c = e.y - t.y, u = Math.sqrt(o / r), l = s / (2 * Math.sqrt(o * r));
584
+ function Vt(o, t, e, i) {
585
+ const { stiffness: n, damping: s, mass: r, oscillations: a } = i, h = e.x - t.x, c = e.y - t.y, u = Math.sqrt(n / r), l = s / (2 * Math.sqrt(n * r));
586
586
  let d;
587
587
  if (l < 1) {
588
- const f = u * Math.sqrt(1 - l * l), b = Math.exp(-l * u * n * 3), p = Math.cos(f * n * a * Math.PI);
588
+ const m = u * Math.sqrt(1 - l * l), b = Math.exp(-l * u * o * 3), p = Math.cos(m * o * a * Math.PI);
589
589
  d = 1 - b * p;
590
590
  } else
591
- d = 1 - Math.exp(-u * n * 3);
591
+ d = 1 - Math.exp(-u * o * 3);
592
592
  return d = Math.max(0, Math.min(d, 1.3)), {
593
593
  x: t.x + h * d,
594
594
  y: t.y + c * d
595
595
  };
596
596
  }
597
- function Jt(n, t, e, i) {
598
- const { amplitude: o, frequency: s, decay: r, decayRate: a, phase: h } = i, c = e.x - t.x, u = e.y - t.y, l = Math.sqrt(c * c + u * u), d = l > 0 ? -u / l : 0, f = l > 0 ? c / l : 1, b = s * Math.PI * 2 * n + h, p = r ? Math.pow(1 - n, a) : 1, g = o * Math.sin(b) * p, m = Vt(n);
597
+ function Kt(o, t, e, i) {
598
+ const { amplitude: n, frequency: s, decay: r, decayRate: a, phase: h } = i, c = e.x - t.x, u = e.y - t.y, l = Math.sqrt(c * c + u * u), d = l > 0 ? -u / l : 0, m = l > 0 ? c / l : 1, b = s * Math.PI * 2 * o + h, p = r ? Math.pow(1 - o, a) : 1, g = n * Math.sin(b) * p, f = Zt(o);
599
599
  return {
600
- x: V(t.x, e.x, m) + g * d,
601
- y: V(t.y, e.y, m) + g * f
600
+ x: V(t.x, e.x, f) + g * d,
601
+ y: V(t.y, e.y, f) + g * m
602
602
  };
603
603
  }
604
- function ot(n) {
605
- return 1 - (1 - n) * (1 - n);
604
+ function at(o) {
605
+ return 1 - (1 - o) * (1 - o);
606
606
  }
607
- function Vt(n) {
608
- return 1 - Math.pow(1 - n, 3);
607
+ function Zt(o) {
608
+ return 1 - Math.pow(1 - o, 3);
609
609
  }
610
- function Kt(n, t, e) {
611
- const { amplitude: i, frequency: o, decay: s } = e, r = Math.sin(n * o * Math.PI * 2), a = s ? Math.pow(1 - n, 2) : 1, h = i * r * a;
610
+ function Qt(o, t, e) {
611
+ const { amplitude: i, frequency: n, decay: s } = e, r = Math.sin(o * n * Math.PI * 2), a = s ? Math.pow(1 - o, 2) : 1, h = i * r * a;
612
612
  return t + h;
613
613
  }
614
- function Zt(n, t, e) {
615
- const { overshoot: i, bounces: o } = e, s = [];
614
+ function te(o, t, e) {
615
+ const { overshoot: i, bounces: n } = e, s = [];
616
616
  s.push({ time: 0.5, scale: i });
617
617
  let r = i;
618
- const a = 0.5, c = 0.5 / (o * 2);
618
+ const a = 0.5, c = 0.5 / (n * 2);
619
619
  let u = 0.5;
620
- for (let d = 0; d < o; d++) {
621
- const f = 1 - (r - 1) * a;
622
- u += c, s.push({ time: u, scale: f }), r = 1 + (r - 1) * a * a, u += c, d < o - 1 && s.push({ time: u, scale: r });
620
+ for (let d = 0; d < n; d++) {
621
+ const m = 1 - (r - 1) * a;
622
+ u += c, s.push({ time: u, scale: m }), r = 1 + (r - 1) * a * a, u += c, d < n - 1 && s.push({ time: u, scale: r });
623
623
  }
624
624
  s.push({ time: 1, scale: 1 });
625
625
  let l = 1;
626
626
  for (let d = 0; d < s.length; d++)
627
- if (n <= s[d].time) {
628
- const f = d === 0 ? 0 : s[d - 1].time, b = d === 0 ? 1 : s[d - 1].scale, p = (n - f) / (s[d].time - f), g = ot(p);
627
+ if (o <= s[d].time) {
628
+ const m = d === 0 ? 0 : s[d - 1].time, b = d === 0 ? 1 : s[d - 1].scale, p = (o - m) / (s[d].time - m), g = at(p);
629
629
  l = b + (s[d].scale - b) * g;
630
630
  break;
631
631
  }
632
632
  return l * t;
633
633
  }
634
- function Qt(n) {
634
+ function ee(o) {
635
635
  const {
636
636
  element: t,
637
637
  startPosition: e,
638
638
  endPosition: i,
639
- pathConfig: o,
639
+ pathConfig: n,
640
640
  duration: s,
641
641
  imageWidth: r,
642
642
  imageHeight: a,
@@ -645,60 +645,60 @@ function Qt(n) {
645
645
  onComplete: u,
646
646
  rotationConfig: l,
647
647
  startRotation: d,
648
- scaleConfig: f,
648
+ scaleConfig: m,
649
649
  startScale: b
650
- } = n, p = o.type, g = d !== void 0 && d !== h, m = l?.mode === "wobble", E = l?.wobble || { amplitude: 15, frequency: 3, decay: !0 }, v = g || m, w = b !== void 0 && b !== c, S = f?.mode === "pop", x = f?.pop || { overshoot: 1.2, bounces: 1 };
651
- if ((p === "linear" || p === "arc") && !v && !(w || S)) {
650
+ } = o, p = n.type, g = d !== void 0 && d !== h, f = l?.mode === "wobble", S = l?.wobble || { amplitude: 15, frequency: 3, decay: !0 }, v = g || f, w = b !== void 0 && b !== c, E = m?.mode === "pop", x = m?.pop || { overshoot: 1.2, bounces: 1 };
651
+ if ((p === "linear" || p === "arc") && !v && !(w || E)) {
652
652
  u && u();
653
653
  return;
654
654
  }
655
655
  const M = performance.now(), z = -r / 2, P = -a / 2;
656
656
  function _(Y) {
657
- const N = Y - M, R = Math.min(N / s, 1);
657
+ const N = Y - M, T = Math.min(N / s, 1);
658
658
  let D;
659
659
  switch (p) {
660
660
  case "bounce": {
661
- const O = kt(
662
- o.bouncePreset,
663
- o.bounce
661
+ const O = Wt(
662
+ n.bouncePreset,
663
+ n.bounce
664
664
  );
665
- D = Yt(R, e, i, O);
665
+ D = Bt(T, e, i, O);
666
666
  break;
667
667
  }
668
668
  case "elastic": {
669
- const O = Wt(
670
- o.elasticPreset,
671
- o.elastic
669
+ const O = qt(
670
+ n.elasticPreset,
671
+ n.elastic
672
672
  );
673
- D = Bt(R, e, i, O);
673
+ D = Vt(T, e, i, O);
674
674
  break;
675
675
  }
676
676
  case "wave": {
677
- const O = Gt(
678
- o.wavePreset,
679
- o.wave
677
+ const O = Yt(
678
+ n.wavePreset,
679
+ n.wave
680
680
  );
681
- D = Jt(R, e, i, O);
681
+ D = Kt(T, e, i, O);
682
682
  break;
683
683
  }
684
684
  default:
685
685
  D = {
686
- x: V(e.x, i.x, R),
687
- y: V(e.y, i.y, R)
686
+ x: V(e.x, i.x, T),
687
+ y: V(e.y, i.y, T)
688
688
  };
689
689
  }
690
690
  const k = D.x - i.x, H = D.y - i.y;
691
- let A;
692
- m ? A = Kt(R, h, E) : g ? A = V(d, h, R) : A = h;
691
+ let R;
692
+ f ? R = Qt(T, h, S) : g ? R = V(d, h, T) : R = h;
693
693
  let C;
694
- S ? C = Zt(R, c, x) : w ? C = V(b, c, R) : C = c, t.style.transform = `translate(${z}px, ${P}px) translate(${k}px, ${H}px) rotate(${A}deg) scale(${C})`, R < 1 ? requestAnimationFrame(_) : (t.style.transform = `translate(${z}px, ${P}px) rotate(${h}deg) scale(${c})`, u && u());
694
+ E ? C = te(T, c, x) : w ? C = V(b, c, T) : C = c, t.style.transform = `translate(${z}px, ${P}px) translate(${k}px, ${H}px) rotate(${R}deg) scale(${C})`, T < 1 ? requestAnimationFrame(_) : (t.style.transform = `translate(${z}px, ${P}px) rotate(${h}deg) scale(${c})`, u && u());
695
695
  }
696
696
  requestAnimationFrame(_);
697
697
  }
698
- function te(n) {
699
- return n === "bounce" || n === "elastic" || n === "wave";
698
+ function ie(o) {
699
+ return o === "bounce" || o === "elastic" || o === "wave";
700
700
  }
701
- const ee = {
701
+ const ne = {
702
702
  radial: "center",
703
703
  spiral: "center",
704
704
  grid: "top",
@@ -706,20 +706,20 @@ const ee = {
706
706
  random: "nearest-edge",
707
707
  wave: "left"
708
708
  };
709
- class ie {
709
+ class oe {
710
710
  constructor(t, e) {
711
- this.config = t, this.layoutAlgorithm = e, this.resolvedStartPosition = this.resolveStartPosition(), this.pathConfig = t.path || pt, this.rotationConfig = t.rotation || bt, this.scaleConfig = t.scale || yt;
711
+ this.config = t, this.layoutAlgorithm = e, this.resolvedStartPosition = this.resolveStartPosition(), this.pathConfig = t.path || yt, this.rotationConfig = t.rotation || vt, this.scaleConfig = t.scale || wt;
712
712
  }
713
713
  /**
714
714
  * Get the effective start position, considering layout-aware defaults
715
715
  */
716
716
  resolveStartPosition() {
717
- return this.config.start.position ? this.config.start.position : ee[this.layoutAlgorithm] || "nearest-edge";
717
+ return this.config.start.position ? this.config.start.position : ne[this.layoutAlgorithm] || "nearest-edge";
718
718
  }
719
719
  /**
720
720
  * Calculate the starting position for an image's entry animation
721
721
  */
722
- calculateStartPosition(t, e, i, o, s) {
722
+ calculateStartPosition(t, e, i, n, s) {
723
723
  const r = this.resolvedStartPosition, a = this.config.start.offset ?? 100;
724
724
  switch (r) {
725
725
  case "nearest-edge":
@@ -741,7 +741,7 @@ class ie {
741
741
  t,
742
742
  e,
743
743
  i,
744
- o,
744
+ n,
745
745
  s
746
746
  );
747
747
  default:
@@ -751,28 +751,28 @@ class ie {
751
751
  /**
752
752
  * Calculate start position from the nearest edge (current default behavior)
753
753
  */
754
- calculateNearestEdge(t, e, i, o) {
754
+ calculateNearestEdge(t, e, i, n) {
755
755
  const s = t.x, r = t.y, a = s, h = i.width - s, c = r, u = i.height - r, l = Math.min(a, h, c, u);
756
- let d = t.x, f = t.y;
757
- return l === a ? d = -(e.width + o) : l === h ? d = i.width + o : l === c ? f = -(e.height + o) : f = i.height + o, { x: d, y: f };
756
+ let d = t.x, m = t.y;
757
+ return l === a ? d = -(e.width + n) : l === h ? d = i.width + n : l === c ? m = -(e.height + n) : m = i.height + n, { x: d, y: m };
758
758
  }
759
759
  /**
760
760
  * Calculate start position from a specific edge
761
761
  */
762
- calculateEdgePosition(t, e, i, o, s) {
762
+ calculateEdgePosition(t, e, i, n, s) {
763
763
  let r = e.x, a = e.y;
764
764
  switch (t) {
765
765
  case "top":
766
766
  a = -(i.height + s);
767
767
  break;
768
768
  case "bottom":
769
- a = o.height + s;
769
+ a = n.height + s;
770
770
  break;
771
771
  case "left":
772
772
  r = -(i.width + s);
773
773
  break;
774
774
  case "right":
775
- r = o.width + s;
775
+ r = n.width + s;
776
776
  break;
777
777
  }
778
778
  return { x: r, y: a };
@@ -781,9 +781,9 @@ class ie {
781
781
  * Calculate start position from center with scale animation
782
782
  */
783
783
  calculateCenterPosition(t, e, i) {
784
- const o = t.width / 2, s = t.height / 2;
784
+ const n = t.width / 2, s = t.height / 2;
785
785
  return {
786
- x: o,
786
+ x: n,
787
787
  y: s,
788
788
  useScale: !0
789
789
  // Signal to use scale animation from 0
@@ -792,14 +792,14 @@ class ie {
792
792
  /**
793
793
  * Calculate start position from a random edge
794
794
  */
795
- calculateRandomEdge(t, e, i, o) {
795
+ calculateRandomEdge(t, e, i, n) {
796
796
  const s = ["top", "bottom", "left", "right"], r = s[Math.floor(Math.random() * s.length)];
797
- return this.calculateEdgePosition(r, t, e, i, o);
797
+ return this.calculateEdgePosition(r, t, e, i, n);
798
798
  }
799
799
  /**
800
800
  * Calculate start position on a circle around the container
801
801
  */
802
- calculateCircularPosition(t, e, i, o, s) {
802
+ calculateCircularPosition(t, e, i, n, s) {
803
803
  const r = this.config.start.circular || {}, a = r.distribution || "even";
804
804
  let h;
805
805
  const c = r.radius || "120%";
@@ -811,9 +811,9 @@ class ie {
811
811
  } else
812
812
  h = typeof c == "number" ? c : 500;
813
813
  let u;
814
- a === "even" ? u = o / s * 2 * Math.PI : u = Math.random() * 2 * Math.PI;
815
- const l = i.width / 2, d = i.height / 2, f = l + Math.cos(u) * h, b = d + Math.sin(u) * h;
816
- return { x: f, y: b };
814
+ a === "even" ? u = n / s * 2 * Math.PI : u = Math.random() * 2 * Math.PI;
815
+ const l = i.width / 2, d = i.height / 2, m = l + Math.cos(u) * h, b = d + Math.sin(u) * h;
816
+ return { x: m, y: b };
817
817
  }
818
818
  /**
819
819
  * Get animation parameters for an image
@@ -832,17 +832,17 @@ class ie {
832
832
  * Build a CSS transform string for the start position
833
833
  * Uses pixel-based centering offset for reliable cross-browser behavior
834
834
  */
835
- buildStartTransform(t, e, i, o, s, r, a, h) {
836
- const c = t.x - e.x, u = t.y - e.y, l = a !== void 0 ? a : i, d = h !== void 0 ? h : o, f = s !== void 0 ? -s / 2 : 0, b = r !== void 0 ? -r / 2 : 0, p = s !== void 0 ? `translate(${f}px, ${b}px)` : "translate(-50%, -50%)";
835
+ buildStartTransform(t, e, i, n, s, r, a, h) {
836
+ const c = t.x - e.x, u = t.y - e.y, l = a !== void 0 ? a : i, d = h !== void 0 ? h : n, m = s !== void 0 ? -s / 2 : 0, b = r !== void 0 ? -r / 2 : 0, p = s !== void 0 ? `translate(${m}px, ${b}px)` : "translate(-50%, -50%)";
837
837
  return t.useScale ? `${p} translate(${c}px, ${u}px) rotate(${l}deg) scale(0)` : `${p} translate(${c}px, ${u}px) rotate(${l}deg) scale(${d})`;
838
838
  }
839
839
  /**
840
840
  * Build the final CSS transform string
841
841
  * Uses pixel-based centering offset for reliable cross-browser behavior
842
842
  */
843
- buildFinalTransform(t, e, i, o) {
844
- if (i !== void 0 && o !== void 0) {
845
- const s = -i / 2, r = -o / 2;
843
+ buildFinalTransform(t, e, i, n) {
844
+ if (i !== void 0 && n !== void 0) {
845
+ const s = -i / 2, r = -n / 2;
846
846
  return `translate(${s}px, ${r}px) rotate(${t}deg) scale(${e})`;
847
847
  }
848
848
  return `translate(-50%, -50%) rotate(${t}deg) scale(${e})`;
@@ -859,7 +859,7 @@ class ie {
859
859
  * Check if the current path type requires JavaScript animation
860
860
  */
861
861
  requiresJSAnimation() {
862
- return te(this.pathConfig.type);
862
+ return ie(this.pathConfig.type);
863
863
  }
864
864
  /**
865
865
  * Get the path configuration
@@ -908,12 +908,12 @@ class ie {
908
908
  return t + (Math.random() - 0.5) * 60;
909
909
  if (typeof i == "number")
910
910
  return i;
911
- const o = i.max - i.min;
912
- return i.min + Math.random() * o;
911
+ const n = i.max - i.min;
912
+ return i.min + Math.random() * n;
913
913
  }
914
914
  case "spin": {
915
- const i = this.rotationConfig.spinCount ?? 1, o = this.resolveSpinDirection(t);
916
- return t + i * 360 * o;
915
+ const i = this.rotationConfig.spinCount ?? 1, n = this.resolveSpinDirection(t);
916
+ return t + i * 360 * n;
917
917
  }
918
918
  case "random":
919
919
  return t + (Math.random() - 0.5) * 60;
@@ -961,7 +961,7 @@ class ie {
961
961
  amplitude: 15,
962
962
  frequency: 3,
963
963
  decay: !0
964
- }, { amplitude: o, frequency: s, decay: r } = i, a = Math.sin(t * s * Math.PI * 2), h = r ? Math.pow(1 - t, 2) : 1, c = o * a * h;
964
+ }, { amplitude: n, frequency: s, decay: r } = i, a = Math.sin(t * s * Math.PI * 2), h = r ? Math.pow(1 - t, 2) : 1, c = n * a * h;
965
965
  return e + c;
966
966
  }
967
967
  /**
@@ -1018,7 +1018,7 @@ class ie {
1018
1018
  const i = this.scaleConfig.pop || {
1019
1019
  overshoot: 1.2,
1020
1020
  bounces: 1
1021
- }, { overshoot: o, bounces: s } = i, r = this.generateScaleBounceKeyframes(s, o);
1021
+ }, { overshoot: n, bounces: s } = i, r = this.generateScaleBounceKeyframes(s, n);
1022
1022
  let a = e;
1023
1023
  for (let h = 0; h < r.length; h++)
1024
1024
  if (t <= r[h].time) {
@@ -1034,12 +1034,12 @@ class ie {
1034
1034
  generateScaleBounceKeyframes(t, e) {
1035
1035
  const i = [];
1036
1036
  i.push({ time: 0.5, scale: e });
1037
- let o = e;
1037
+ let n = e;
1038
1038
  const s = 0.5, a = 0.5 / (t * 2);
1039
1039
  let h = 0.5;
1040
1040
  for (let c = 0; c < t; c++) {
1041
- const u = 1 - (o - 1) * s;
1042
- h += a, i.push({ time: h, scale: u }), o = 1 + (o - 1) * s * s, h += a, c < t - 1 && i.push({ time: h, scale: o });
1041
+ const u = 1 - (n - 1) * s;
1042
+ h += a, i.push({ time: h, scale: u }), n = 1 + (n - 1) * s * s, h += a, c < t - 1 && i.push({ time: h, scale: n });
1043
1043
  }
1044
1044
  return i.push({ time: 1, scale: 1 }), i;
1045
1045
  }
@@ -1050,7 +1050,7 @@ class ie {
1050
1050
  return 1 - (1 - t) * (1 - t);
1051
1051
  }
1052
1052
  }
1053
- class ne {
1053
+ class se {
1054
1054
  constructor(t, e = {}) {
1055
1055
  this.config = t, this.imageConfig = e;
1056
1056
  }
@@ -1062,19 +1062,19 @@ class ne {
1062
1062
  * @returns Array of layout objects with position, rotation, scale
1063
1063
  */
1064
1064
  generate(t, e, i = {}) {
1065
- const o = [], { width: s, height: r } = e, a = this.config.spacing.padding, h = i.fixedHeight ?? 200, c = this.imageConfig.rotation?.mode ?? "none", u = this.imageConfig.rotation?.range?.min ?? -15, l = this.imageConfig.rotation?.range?.max ?? 15, d = this.imageConfig.sizing?.variance?.min ?? 1, f = this.imageConfig.sizing?.variance?.max ?? 1, b = d !== 1 || f !== 1, g = h * 1.5 / 2, m = h / 2, E = s - a - g, v = r - a - m, w = a + g, S = a + m;
1065
+ const n = [], { width: s, height: r } = e, a = this.config.spacing.padding, h = i.fixedHeight ?? 200, c = this.imageConfig.rotation?.mode ?? "none", u = this.imageConfig.rotation?.range?.min ?? -15, l = this.imageConfig.rotation?.range?.max ?? 15, d = this.imageConfig.sizing?.variance?.min ?? 1, m = this.imageConfig.sizing?.variance?.max ?? 1, b = d !== 1 || m !== 1, g = h * 1.5 / 2, f = h / 2, S = s - a - g, v = r - a - f, w = a + g, E = a + f;
1066
1066
  for (let x = 0; x < t; x++) {
1067
- const T = this.random(w, E), M = this.random(S, v), z = c === "random" ? this.random(u, l) : 0, P = b ? this.random(d, f) : 1, _ = h * P, Y = {
1067
+ const A = this.random(w, S), M = this.random(E, v), z = c === "random" ? this.random(u, l) : 0, P = b ? this.random(d, m) : 1, _ = h * P, Y = {
1068
1068
  id: x,
1069
- x: T,
1069
+ x: A,
1070
1070
  y: M,
1071
1071
  rotation: z,
1072
1072
  scale: P,
1073
1073
  baseSize: _
1074
1074
  };
1075
- o.push(Y);
1075
+ n.push(Y);
1076
1076
  }
1077
- return o;
1077
+ return n;
1078
1078
  }
1079
1079
  /**
1080
1080
  * Utility: Generate random number between min and max
@@ -1086,7 +1086,7 @@ class ne {
1086
1086
  return Math.random() * (e - t) + t;
1087
1087
  }
1088
1088
  }
1089
- class oe {
1089
+ class ae {
1090
1090
  constructor(t, e = {}) {
1091
1091
  this.config = t, this.imageConfig = e;
1092
1092
  }
@@ -1098,16 +1098,16 @@ class oe {
1098
1098
  * @returns Array of layout objects with position, rotation, scale
1099
1099
  */
1100
1100
  generate(t, e, i = {}) {
1101
- const o = [], { width: s, height: r } = e, a = i.fixedHeight ?? 200, h = this.imageConfig.rotation?.mode ?? "none", c = this.imageConfig.rotation?.range?.min ?? -15, u = this.imageConfig.rotation?.range?.max ?? 15, l = this.imageConfig.sizing?.variance?.min ?? 1, d = this.imageConfig.sizing?.variance?.max ?? 1, f = l !== 1 || d !== 1, b = this.config.scaleDecay ?? 0, p = i.fixedHeight ?? a, g = s / 2, m = r / 2, E = Math.ceil(Math.sqrt(t));
1101
+ const n = [], { width: s, height: r } = e, a = i.fixedHeight ?? 200, h = this.imageConfig.rotation?.mode ?? "none", c = this.imageConfig.rotation?.range?.min ?? -15, u = this.imageConfig.rotation?.range?.max ?? 15, l = this.imageConfig.sizing?.variance?.min ?? 1, d = this.imageConfig.sizing?.variance?.max ?? 1, m = l !== 1 || d !== 1, b = this.config.scaleDecay ?? 0, p = i.fixedHeight ?? a, g = s / 2, f = r / 2, S = Math.ceil(Math.sqrt(t));
1102
1102
  if (t > 0) {
1103
- const S = f ? this.random(l, d) : 1, x = p * S;
1104
- o.push({
1103
+ const E = m ? this.random(l, d) : 1, x = p * E;
1104
+ n.push({
1105
1105
  id: 0,
1106
1106
  x: g,
1107
- y: m,
1107
+ y: f,
1108
1108
  rotation: h === "random" ? this.random(c * 0.33, u * 0.33) : 0,
1109
1109
  // Less rotation for center
1110
- scale: S,
1110
+ scale: E,
1111
1111
  baseSize: x,
1112
1112
  zIndex: 100
1113
1113
  // Center image is highest
@@ -1115,32 +1115,32 @@ class oe {
1115
1115
  }
1116
1116
  let v = 1, w = 1;
1117
1117
  for (; v < t; ) {
1118
- const S = w / E, x = b > 0 ? 1 - S * b * 0.5 : 1, T = w * (p * 0.8), M = T * 1.5, z = Math.PI * (3 * (M + T) - Math.sqrt((3 * M + T) * (M + 3 * T))), P = this.estimateWidth(p), _ = Math.floor(z / (P * 0.7));
1118
+ const E = w / S, x = b > 0 ? 1 - E * b * 0.5 : 1, A = w * (p * 0.8), M = A * 1.5, z = Math.PI * (3 * (M + A) - Math.sqrt((3 * M + A) * (M + 3 * A))), P = this.estimateWidth(p), _ = Math.floor(z / (P * 0.7));
1119
1119
  if (_ === 0) {
1120
1120
  w++;
1121
1121
  continue;
1122
1122
  }
1123
1123
  const Y = 2 * Math.PI / _, N = w * (20 * Math.PI / 180);
1124
- for (let R = 0; R < _ && v < t; R++) {
1125
- const D = R * Y + N, k = f ? this.random(l, d) : 1, H = x * k, A = p * H;
1126
- let C = g + Math.cos(D) * M, O = m + Math.sin(D) * T;
1127
- const $ = this.config.spacing.padding ?? 50, U = A * 1.5 / 2, L = A / 2;
1124
+ for (let T = 0; T < _ && v < t; T++) {
1125
+ const D = T * Y + N, k = m ? this.random(l, d) : 1, H = x * k, R = p * H;
1126
+ let C = g + Math.cos(D) * M, O = f + Math.sin(D) * A;
1127
+ const $ = this.config.spacing.padding ?? 50, U = R * 1.5 / 2, L = R / 2;
1128
1128
  C - U < $ ? C = $ + U : C + U > s - $ && (C = s - $ - U), O - L < $ ? O = $ + L : O + L > r - $ && (O = r - $ - L);
1129
- const W = h === "random" ? this.random(c, u) : 0;
1130
- o.push({
1129
+ const G = h === "random" ? this.random(c, u) : 0;
1130
+ n.push({
1131
1131
  id: v,
1132
1132
  x: C,
1133
1133
  y: O,
1134
- rotation: W,
1134
+ rotation: G,
1135
1135
  scale: H,
1136
- baseSize: A,
1136
+ baseSize: R,
1137
1137
  zIndex: Math.max(1, 100 - w)
1138
1138
  // Outer rings have lower z-index
1139
1139
  }), v++;
1140
1140
  }
1141
1141
  w++;
1142
1142
  }
1143
- return o;
1143
+ return n;
1144
1144
  }
1145
1145
  /**
1146
1146
  * Estimate image width based on height
@@ -1161,7 +1161,7 @@ class oe {
1161
1161
  return Math.random() * (e - t) + t;
1162
1162
  }
1163
1163
  }
1164
- const se = {
1164
+ const re = {
1165
1165
  columns: "auto",
1166
1166
  rows: "auto",
1167
1167
  stagger: "none",
@@ -1171,7 +1171,7 @@ const se = {
1171
1171
  alignment: "center",
1172
1172
  gap: 10,
1173
1173
  overflowOffset: 0.25
1174
- }, St = [
1174
+ }, At = [
1175
1175
  { x: 1, y: 1 },
1176
1176
  // bottom-right
1177
1177
  { x: -1, y: -1 },
@@ -1189,7 +1189,7 @@ const se = {
1189
1189
  { x: 0, y: 1 }
1190
1190
  // down
1191
1191
  ];
1192
- class ae {
1192
+ class ce {
1193
1193
  constructor(t, e = {}) {
1194
1194
  this.config = t, this.imageConfig = e;
1195
1195
  }
@@ -1201,73 +1201,73 @@ class ae {
1201
1201
  * @returns Array of layout objects with position, rotation, scale
1202
1202
  */
1203
1203
  generate(t, e, i = {}) {
1204
- const o = [], { width: s, height: r } = e, a = { ...se, ...this.config.grid }, h = this.config.spacing.padding, c = i.fixedHeight ?? 200, u = this.imageConfig.rotation?.mode ?? "none", l = this.imageConfig.sizing?.variance?.min ?? 1, d = this.imageConfig.sizing?.variance?.max ?? 1, f = l !== 1 || d !== 1, b = s - 2 * h, p = r - 2 * h, { columns: g, rows: m } = this.calculateGridDimensions(
1204
+ const n = [], { width: s, height: r } = e, a = { ...re, ...this.config.grid }, h = this.config.spacing.padding, c = i.fixedHeight ?? 200, u = this.imageConfig.rotation?.mode ?? "none", l = this.imageConfig.sizing?.variance?.min ?? 1, d = this.imageConfig.sizing?.variance?.max ?? 1, m = l !== 1 || d !== 1, b = s - 2 * h, p = r - 2 * h, { columns: g, rows: f } = this.calculateGridDimensions(
1205
1205
  t,
1206
1206
  b,
1207
1207
  p,
1208
1208
  c,
1209
1209
  a
1210
- ), E = a.stagger === "row", v = a.stagger === "column", w = E ? g + 0.5 : g, S = v ? m + 0.5 : m, x = (b - a.gap * (g - 1)) / w, T = (p - a.gap * (m - 1)) / S, M = E ? x / 2 : 0, z = v ? T / 2 : 0, P = 1 + a.overlap, _ = Math.min(x, T) * P, Y = i.fixedHeight ? Math.min(i.fixedHeight, _) : _, N = g * x + (g - 1) * a.gap + M, R = m * T + (m - 1) * a.gap + z, D = h + (b - N) / 2, k = h + (p - R) / 2, H = g * m, A = a.columns !== "auto" && a.rows !== "auto", C = A && t > H;
1210
+ ), S = a.stagger === "row", v = a.stagger === "column", w = S ? g + 0.5 : g, E = v ? f + 0.5 : f, x = (b - a.gap * (g - 1)) / w, A = (p - a.gap * (f - 1)) / E, M = S ? x / 2 : 0, z = v ? A / 2 : 0, P = 1 + a.overlap, _ = Math.min(x, A) * P, Y = i.fixedHeight ? Math.min(i.fixedHeight, _) : _, N = g * x + (g - 1) * a.gap + M, T = f * A + (f - 1) * a.gap + z, D = h + (b - N) / 2, k = h + (p - T) / 2, H = g * f, R = a.columns !== "auto" && a.rows !== "auto", C = R && t > H;
1211
1211
  typeof window < "u" && (window.__gridOverflowDebug = {
1212
1212
  gridConfigColumns: a.columns,
1213
1213
  gridConfigRows: a.rows,
1214
1214
  columns: g,
1215
- rows: m,
1215
+ rows: f,
1216
1216
  cellCount: H,
1217
- hasFixedGrid: A,
1217
+ hasFixedGrid: R,
1218
1218
  imageCount: t,
1219
1219
  isOverflowMode: C
1220
1220
  });
1221
- const O = C ? new Array(H).fill(0) : [], $ = Math.min(x, T) * a.overflowOffset;
1221
+ const O = C ? new Array(H).fill(0) : [], $ = Math.min(x, A) * a.overflowOffset;
1222
1222
  for (let F = 0; F < t; F++) {
1223
- let U, L, W = 0;
1223
+ let U, L, G = 0;
1224
1224
  if (C && F >= H) {
1225
1225
  const q = F - H, j = q % H;
1226
- W = Math.floor(q / H) + 1, O[j]++, a.fillDirection === "row" ? (U = j % g, L = Math.floor(j / g)) : (L = j % m, U = Math.floor(j / m));
1226
+ G = Math.floor(q / H) + 1, O[j]++, a.fillDirection === "row" ? (U = j % g, L = Math.floor(j / g)) : (L = j % f, U = Math.floor(j / f));
1227
1227
  } else
1228
- a.fillDirection === "row" ? (U = F % g, L = Math.floor(F / g)) : (L = F % m, U = Math.floor(F / m));
1229
- let G = D + U * (x + a.gap) + x / 2, X = k + L * (T + a.gap) + T / 2;
1230
- if (a.stagger === "row" && L % 2 === 1 ? G += x / 2 : a.stagger === "column" && U % 2 === 1 && (X += T / 2), W > 0) {
1231
- const q = (W - 1) % St.length, j = St[q];
1232
- G += j.x * $, X += j.y * $;
1228
+ a.fillDirection === "row" ? (U = F % g, L = Math.floor(F / g)) : (L = F % f, U = Math.floor(F / f));
1229
+ let W = D + U * (x + a.gap) + x / 2, X = k + L * (A + a.gap) + A / 2;
1230
+ if (a.stagger === "row" && L % 2 === 1 ? W += x / 2 : a.stagger === "column" && U % 2 === 1 && (X += A / 2), G > 0) {
1231
+ const q = (G - 1) % At.length, j = At[q];
1232
+ W += j.x * $, X += j.y * $;
1233
1233
  }
1234
1234
  if (a.jitter > 0) {
1235
- const q = x / 2 * a.jitter, j = T / 2 * a.jitter;
1236
- G += this.random(-q, q), X += this.random(-j, j);
1235
+ const q = x / 2 * a.jitter, j = A / 2 * a.jitter;
1236
+ W += this.random(-q, q), X += this.random(-j, j);
1237
1237
  }
1238
- let B = G, J = X;
1238
+ let B = W, J = X;
1239
1239
  if (!C && a.fillDirection === "row") {
1240
1240
  const q = t % g || g;
1241
1241
  if (L === Math.floor((t - 1) / g) && q < g) {
1242
- const vt = q * x + (q - 1) * a.gap;
1243
- let gt = 0;
1244
- a.alignment === "center" ? gt = (N - vt) / 2 : a.alignment === "end" && (gt = N - vt), B += gt;
1242
+ const xt = q * x + (q - 1) * a.gap;
1243
+ let ft = 0;
1244
+ a.alignment === "center" ? ft = (N - xt) / 2 : a.alignment === "end" && (ft = N - xt), B += ft;
1245
1245
  }
1246
1246
  }
1247
- const rt = f ? this.random(l, d) : 1, K = Y * rt, it = K * 1.5 / 2, nt = K / 2, lt = h + it, ht = s - h - it, zt = h + nt, Ft = r - h - nt;
1248
- B = Math.max(lt, Math.min(B, ht)), J = Math.max(zt, Math.min(J, Ft));
1249
- let dt = 0;
1247
+ const lt = m ? this.random(l, d) : 1, K = Y * lt, ot = K * 1.5 / 2, st = K / 2, dt = h + ot, ut = s - h - ot, Dt = h + st, Ot = r - h - st;
1248
+ B = Math.max(dt, Math.min(B, ut)), J = Math.max(Dt, Math.min(J, Ot));
1249
+ let gt = 0;
1250
1250
  if (u === "random") {
1251
1251
  const q = this.imageConfig.rotation?.range?.min ?? -15, j = this.imageConfig.rotation?.range?.max ?? 15;
1252
- a.jitter > 0 ? dt = this.random(q * a.jitter, j * a.jitter) : dt = this.random(q, j);
1252
+ a.jitter > 0 ? gt = this.random(q * a.jitter, j * a.jitter) : gt = this.random(q, j);
1253
1253
  }
1254
- let ut;
1255
- C && W > 0 ? ut = 50 - W : ut = C ? 100 + F : F + 1, o.push({
1254
+ let mt;
1255
+ C && G > 0 ? mt = 50 - G : mt = C ? 100 + F : F + 1, n.push({
1256
1256
  id: F,
1257
1257
  x: B,
1258
1258
  y: J,
1259
- rotation: dt,
1260
- scale: rt,
1259
+ rotation: gt,
1260
+ scale: lt,
1261
1261
  baseSize: K,
1262
- zIndex: ut
1262
+ zIndex: mt
1263
1263
  });
1264
1264
  }
1265
- return o;
1265
+ return n;
1266
1266
  }
1267
1267
  /**
1268
1268
  * Calculate optimal grid dimensions based on image count and container
1269
1269
  */
1270
- calculateGridDimensions(t, e, i, o, s) {
1270
+ calculateGridDimensions(t, e, i, n, s) {
1271
1271
  let r, a;
1272
1272
  if (s.columns !== "auto" && s.rows !== "auto")
1273
1273
  r = s.columns, a = s.rows;
@@ -1289,14 +1289,14 @@ class ae {
1289
1289
  return Math.random() * (e - t) + t;
1290
1290
  }
1291
1291
  }
1292
- const re = Math.PI * (3 - Math.sqrt(5)), ce = {
1292
+ const le = Math.PI * (3 - Math.sqrt(5)), he = {
1293
1293
  spiralType: "golden",
1294
1294
  direction: "counterclockwise",
1295
1295
  tightness: 1,
1296
1296
  scaleDecay: 0,
1297
1297
  startAngle: 0
1298
1298
  };
1299
- class le {
1299
+ class de {
1300
1300
  constructor(t, e = {}) {
1301
1301
  this.config = t, this.imageConfig = e;
1302
1302
  }
@@ -1308,79 +1308,79 @@ class le {
1308
1308
  * @returns Array of layout objects with position, rotation, scale
1309
1309
  */
1310
1310
  generate(t, e, i = {}) {
1311
- const o = [], { width: s, height: r } = e, a = { ...ce, ...this.config.spiral }, h = this.config.spacing.padding, c = i.fixedHeight ?? 200, u = this.imageConfig.rotation?.mode ?? "none", l = this.imageConfig.rotation?.range?.min ?? -15, d = this.imageConfig.rotation?.range?.max ?? 15, f = this.imageConfig.sizing?.variance?.min ?? 1, b = this.imageConfig.sizing?.variance?.max ?? 1, p = f !== 1 || b !== 1, g = this.config.scaleDecay ?? a.scaleDecay, m = s / 2, E = r / 2, v = Math.min(
1312
- m - h - c / 2,
1313
- E - h - c / 2
1311
+ const n = [], { width: s, height: r } = e, a = { ...he, ...this.config.spiral }, h = this.config.spacing.padding, c = i.fixedHeight ?? 200, u = this.imageConfig.rotation?.mode ?? "none", l = this.imageConfig.rotation?.range?.min ?? -15, d = this.imageConfig.rotation?.range?.max ?? 15, m = this.imageConfig.sizing?.variance?.min ?? 1, b = this.imageConfig.sizing?.variance?.max ?? 1, p = m !== 1 || b !== 1, g = this.config.scaleDecay ?? a.scaleDecay, f = s / 2, S = r / 2, v = Math.min(
1312
+ f - h - c / 2,
1313
+ S - h - c / 2
1314
1314
  ), w = a.direction === "clockwise" ? -1 : 1;
1315
- for (let S = 0; S < t; S++) {
1316
- let x, T;
1315
+ for (let E = 0; E < t; E++) {
1316
+ let x, A;
1317
1317
  if (a.spiralType === "golden")
1318
- x = S * re * w + a.startAngle, T = this.calculateGoldenRadius(S, t, v, a.tightness);
1318
+ x = E * le * w + a.startAngle, A = this.calculateGoldenRadius(E, t, v, a.tightness);
1319
1319
  else if (a.spiralType === "archimedean") {
1320
- const G = S * 0.5 * a.tightness;
1321
- x = G * w + a.startAngle, T = this.calculateArchimedeanRadius(G, t, v, a.tightness);
1320
+ const W = E * 0.5 * a.tightness;
1321
+ x = W * w + a.startAngle, A = this.calculateArchimedeanRadius(W, t, v, a.tightness);
1322
1322
  } else {
1323
- const G = S * 0.3 * a.tightness;
1324
- x = G * w + a.startAngle, T = this.calculateLogarithmicRadius(G, t, v, a.tightness);
1323
+ const W = E * 0.3 * a.tightness;
1324
+ x = W * w + a.startAngle, A = this.calculateLogarithmicRadius(W, t, v, a.tightness);
1325
1325
  }
1326
- const M = m + Math.cos(x) * T, z = E + Math.sin(x) * T, P = T / v, _ = g > 0 ? 1 - P * g * 0.5 : 1, Y = p ? this.random(f, b) : 1, N = _ * Y, R = c * N, k = R * 1.5 / 2, H = R / 2, A = h + k, C = s - h - k, O = h + H, $ = r - h - H, F = Math.max(A, Math.min(M, C)), U = Math.max(O, Math.min(z, $));
1326
+ const M = f + Math.cos(x) * A, z = S + Math.sin(x) * A, P = A / v, _ = g > 0 ? 1 - P * g * 0.5 : 1, Y = p ? this.random(m, b) : 1, N = _ * Y, T = c * N, k = T * 1.5 / 2, H = T / 2, R = h + k, C = s - h - k, O = h + H, $ = r - h - H, F = Math.max(R, Math.min(M, C)), U = Math.max(O, Math.min(z, $));
1327
1327
  let L = 0;
1328
1328
  if (u === "random") {
1329
- const G = x * 180 / Math.PI % 360, X = this.random(l, d);
1330
- L = a.spiralType === "golden" ? X : G * 0.1 + X * 0.9;
1331
- } else u === "tangent" && (L = this.calculateSpiralTangent(x, T, a));
1332
- const W = t - S;
1333
- o.push({
1334
- id: S,
1329
+ const W = x * 180 / Math.PI % 360, X = this.random(l, d);
1330
+ L = a.spiralType === "golden" ? X : W * 0.1 + X * 0.9;
1331
+ } else u === "tangent" && (L = this.calculateSpiralTangent(x, A, a));
1332
+ const G = t - E;
1333
+ n.push({
1334
+ id: E,
1335
1335
  x: F,
1336
1336
  y: U,
1337
1337
  rotation: L,
1338
1338
  scale: N,
1339
- baseSize: R,
1340
- zIndex: W
1339
+ baseSize: T,
1340
+ zIndex: G
1341
1341
  });
1342
1342
  }
1343
- return o;
1343
+ return n;
1344
1344
  }
1345
1345
  /**
1346
1346
  * Calculate tangent angle for spiral curve at given position
1347
1347
  * This aligns the image along the spiral's direction of travel
1348
1348
  */
1349
1349
  calculateSpiralTangent(t, e, i) {
1350
- let o;
1350
+ let n;
1351
1351
  if (i.spiralType === "golden")
1352
- o = t + Math.PI / 2;
1352
+ n = t + Math.PI / 2;
1353
1353
  else if (i.spiralType === "archimedean") {
1354
1354
  const r = 1 / i.tightness, a = Math.atan(e / r);
1355
- o = t + a;
1355
+ n = t + a;
1356
1356
  } else {
1357
1357
  const r = 0.15 / i.tightness, a = Math.atan(1 / r);
1358
- o = t + a;
1358
+ n = t + a;
1359
1359
  }
1360
- return o * 180 / Math.PI % 360 - 90;
1360
+ return n * 180 / Math.PI % 360 - 90;
1361
1361
  }
1362
1362
  /**
1363
1363
  * Calculate radius for golden spiral (Vogel's model)
1364
1364
  * Creates even distribution like sunflower seeds
1365
1365
  */
1366
- calculateGoldenRadius(t, e, i, o) {
1367
- const r = i / Math.sqrt(e) * Math.sqrt(t) / o;
1366
+ calculateGoldenRadius(t, e, i, n) {
1367
+ const r = i / Math.sqrt(e) * Math.sqrt(t) / n;
1368
1368
  return Math.min(r, i);
1369
1369
  }
1370
1370
  /**
1371
1371
  * Calculate radius for Archimedean spiral
1372
1372
  * r = a + b*θ (constant spacing between arms)
1373
1373
  */
1374
- calculateArchimedeanRadius(t, e, i, o) {
1375
- const s = e * 0.5 * o;
1374
+ calculateArchimedeanRadius(t, e, i, n) {
1375
+ const s = e * 0.5 * n;
1376
1376
  return t / s * i;
1377
1377
  }
1378
1378
  /**
1379
1379
  * Calculate radius for logarithmic (equiangular) spiral
1380
1380
  * r = a * e^(b*θ)
1381
1381
  */
1382
- calculateLogarithmicRadius(t, e, i, o) {
1383
- const s = i * 0.05, r = 0.15 / o, a = s * Math.exp(r * t), h = e * 0.3 * o, c = s * Math.exp(r * h);
1382
+ calculateLogarithmicRadius(t, e, i, n) {
1383
+ const s = i * 0.05, r = 0.15 / n, a = s * Math.exp(r * t), h = e * 0.3 * n, c = s * Math.exp(r * h);
1384
1384
  return a / c * i;
1385
1385
  }
1386
1386
  /**
@@ -1390,7 +1390,7 @@ class le {
1390
1390
  return Math.random() * (e - t) + t;
1391
1391
  }
1392
1392
  }
1393
- const he = {
1393
+ const ue = {
1394
1394
  clusterCount: "auto",
1395
1395
  clusterSpread: 150,
1396
1396
  clusterSpacing: 200,
@@ -1398,7 +1398,7 @@ const he = {
1398
1398
  overlap: 0.3,
1399
1399
  distribution: "gaussian"
1400
1400
  };
1401
- class de {
1401
+ class ge {
1402
1402
  constructor(t, e = {}) {
1403
1403
  this.config = t, this.imageConfig = e;
1404
1404
  }
@@ -1410,85 +1410,85 @@ class de {
1410
1410
  * @returns Array of layout objects with position, rotation, scale
1411
1411
  */
1412
1412
  generate(t, e, i = {}) {
1413
- const o = [], { width: s, height: r } = e, a = { ...he, ...this.config.cluster }, h = this.config.spacing.padding, c = i.fixedHeight ?? 200, u = this.imageConfig.rotation?.mode ?? "none", l = this.imageConfig.rotation?.range?.min ?? -15, d = this.imageConfig.rotation?.range?.max ?? 15, f = this.imageConfig.sizing?.variance?.min ?? 1, b = this.imageConfig.sizing?.variance?.max ?? 1, p = f !== 1 || b !== 1, g = this.calculateClusterCount(
1413
+ const n = [], { width: s, height: r } = e, a = { ...ue, ...this.config.cluster }, h = this.config.spacing.padding, c = i.fixedHeight ?? 200, u = this.imageConfig.rotation?.mode ?? "none", l = this.imageConfig.rotation?.range?.min ?? -15, d = this.imageConfig.rotation?.range?.max ?? 15, m = this.imageConfig.sizing?.variance?.min ?? 1, b = this.imageConfig.sizing?.variance?.max ?? 1, p = m !== 1 || b !== 1, g = this.calculateClusterCount(
1414
1414
  t,
1415
1415
  a.clusterCount,
1416
1416
  s,
1417
1417
  r,
1418
1418
  a.clusterSpacing
1419
- ), m = this.generateClusterCenters(
1419
+ ), f = this.generateClusterCenters(
1420
1420
  g,
1421
1421
  s,
1422
1422
  r,
1423
1423
  h,
1424
1424
  a
1425
- ), E = new Array(g).fill(0);
1425
+ ), S = new Array(g).fill(0);
1426
1426
  for (let w = 0; w < t; w++)
1427
- E[w % g]++;
1427
+ S[w % g]++;
1428
1428
  let v = 0;
1429
1429
  for (let w = 0; w < g; w++) {
1430
- const S = m[w], x = E[w];
1431
- for (let T = 0; T < x; T++) {
1430
+ const E = f[w], x = S[w];
1431
+ for (let A = 0; A < x; A++) {
1432
1432
  let M, z;
1433
1433
  if (a.distribution === "gaussian")
1434
- M = this.gaussianRandom() * S.spread, z = this.gaussianRandom() * S.spread;
1434
+ M = this.gaussianRandom() * E.spread, z = this.gaussianRandom() * E.spread;
1435
1435
  else {
1436
- const L = this.random(0, Math.PI * 2), W = this.random(0, S.spread);
1437
- M = Math.cos(L) * W, z = Math.sin(L) * W;
1436
+ const L = this.random(0, Math.PI * 2), G = this.random(0, E.spread);
1437
+ M = Math.cos(L) * G, z = Math.sin(L) * G;
1438
1438
  }
1439
1439
  const P = 1 + a.overlap * 0.5, _ = 1 + a.overlap * 0.3;
1440
1440
  M /= P, z /= P;
1441
- const Y = p ? this.random(f, b) : 1, N = _ * Y, R = c * N;
1442
- let D = S.x + M, k = S.y + z;
1443
- const A = R * 1.5 / 2, C = R / 2;
1444
- D = Math.max(h + A, Math.min(D, s - h - A)), k = Math.max(h + C, Math.min(k, r - h - C));
1445
- const O = u === "random" ? this.random(l, d) : 0, F = Math.sqrt(M * M + z * z) / S.spread, U = Math.round((1 - F) * 50) + 1;
1446
- o.push({
1441
+ const Y = p ? this.random(m, b) : 1, N = _ * Y, T = c * N;
1442
+ let D = E.x + M, k = E.y + z;
1443
+ const R = T * 1.5 / 2, C = T / 2;
1444
+ D = Math.max(h + R, Math.min(D, s - h - R)), k = Math.max(h + C, Math.min(k, r - h - C));
1445
+ const O = u === "random" ? this.random(l, d) : 0, F = Math.sqrt(M * M + z * z) / E.spread, U = Math.round((1 - F) * 50) + 1;
1446
+ n.push({
1447
1447
  id: v,
1448
1448
  x: D,
1449
1449
  y: k,
1450
1450
  rotation: O,
1451
1451
  scale: N,
1452
- baseSize: R,
1452
+ baseSize: T,
1453
1453
  zIndex: U
1454
1454
  }), v++;
1455
1455
  }
1456
1456
  }
1457
- return o;
1457
+ return n;
1458
1458
  }
1459
1459
  /**
1460
1460
  * Calculate optimal number of clusters based on image count and container
1461
1461
  */
1462
- calculateClusterCount(t, e, i, o, s) {
1462
+ calculateClusterCount(t, e, i, n, s) {
1463
1463
  if (e !== "auto")
1464
1464
  return Math.max(1, Math.min(e, t));
1465
1465
  const a = Math.max(1, Math.ceil(t / 8)), h = Math.floor(
1466
- i / s * (o / s) * 0.6
1466
+ i / s * (n / s) * 0.6
1467
1467
  );
1468
1468
  return Math.max(1, Math.min(a, h, 10));
1469
1469
  }
1470
1470
  /**
1471
1471
  * Generate cluster center positions with spacing constraints
1472
1472
  */
1473
- generateClusterCenters(t, e, i, o, s) {
1474
- const r = [], h = o + s.clusterSpread, c = e - o - s.clusterSpread, u = o + s.clusterSpread, l = i - o - s.clusterSpread;
1473
+ generateClusterCenters(t, e, i, n, s) {
1474
+ const r = [], h = n + s.clusterSpread, c = e - n - s.clusterSpread, u = n + s.clusterSpread, l = i - n - s.clusterSpread;
1475
1475
  for (let d = 0; d < t; d++) {
1476
- let f = null, b = -1;
1476
+ let m = null, b = -1;
1477
1477
  for (let p = 0; p < 100; p++) {
1478
1478
  const g = {
1479
1479
  x: this.random(h, c),
1480
1480
  y: this.random(u, l),
1481
1481
  spread: this.calculateClusterSpread(s)
1482
1482
  };
1483
- let m = 1 / 0;
1484
- for (const E of r) {
1485
- const v = g.x - E.x, w = g.y - E.y, S = Math.sqrt(v * v + w * w);
1486
- m = Math.min(m, S);
1483
+ let f = 1 / 0;
1484
+ for (const S of r) {
1485
+ const v = g.x - S.x, w = g.y - S.y, E = Math.sqrt(v * v + w * w);
1486
+ f = Math.min(f, E);
1487
1487
  }
1488
- if ((r.length === 0 || m > b) && (f = g, b = m), m >= s.clusterSpacing)
1488
+ if ((r.length === 0 || f > b) && (m = g, b = f), f >= s.clusterSpacing)
1489
1489
  break;
1490
1490
  }
1491
- f && r.push(f);
1491
+ m && r.push(m);
1492
1492
  }
1493
1493
  return r;
1494
1494
  }
@@ -1516,7 +1516,7 @@ class de {
1516
1516
  return Math.random() * (e - t) + t;
1517
1517
  }
1518
1518
  }
1519
- class ue {
1519
+ class me {
1520
1520
  constructor(t, e = {}) {
1521
1521
  this.config = t, this.imageConfig = e;
1522
1522
  }
@@ -1528,32 +1528,32 @@ class ue {
1528
1528
  * @returns Array of layout objects with position, rotation, scale
1529
1529
  */
1530
1530
  generate(t, e, i = {}) {
1531
- const o = [], { width: s, height: r } = e, a = i.fixedHeight ?? 200, h = this.config.spacing.padding ?? 50, c = this.imageConfig.rotation?.mode ?? "none", u = this.imageConfig.rotation?.range?.min ?? -15, l = this.imageConfig.rotation?.range?.max ?? 15, d = this.imageConfig.sizing?.variance?.min ?? 1, f = this.imageConfig.sizing?.variance?.max ?? 1, b = d !== 1 || f !== 1, p = i.fixedHeight ?? a, g = {
1532
- ...Dt,
1531
+ const n = [], { width: s, height: r } = e, a = i.fixedHeight ?? 200, h = this.config.spacing.padding ?? 50, c = this.imageConfig.rotation?.mode ?? "none", u = this.imageConfig.rotation?.range?.min ?? -15, l = this.imageConfig.rotation?.range?.max ?? 15, d = this.imageConfig.sizing?.variance?.min ?? 1, m = this.imageConfig.sizing?.variance?.max ?? 1, b = d !== 1 || m !== 1, p = i.fixedHeight ?? a, g = {
1532
+ ...$t,
1533
1533
  ...this.config.wave
1534
- }, { rows: m, amplitude: E, frequency: v, phaseShift: w, synchronization: S } = g, x = Math.ceil(t / m), z = p * 1.5 / 2, P = h + z, _ = s - h - z, Y = _ - P, N = x > 1 ? Y / (x - 1) : 0, R = h + E + p / 2, D = r - h - E - p / 2, k = D - R, H = m > 1 ? k / (m - 1) : 0;
1535
- let A = 0;
1536
- for (let C = 0; C < m && A < t; C++) {
1537
- const O = m === 1 ? (R + D) / 2 : R + C * H;
1534
+ }, { rows: f, amplitude: S, frequency: v, phaseShift: w, synchronization: E } = g, x = Math.ceil(t / f), z = p * 1.5 / 2, P = h + z, _ = s - h - z, Y = _ - P, N = x > 1 ? Y / (x - 1) : 0, T = h + S + p / 2, D = r - h - S - p / 2, k = D - T, H = f > 1 ? k / (f - 1) : 0;
1535
+ let R = 0;
1536
+ for (let C = 0; C < f && R < t; C++) {
1537
+ const O = f === 1 ? (T + D) / 2 : T + C * H;
1538
1538
  let $ = 0;
1539
- S === "offset" ? $ = C * w : S === "alternating" && ($ = C * Math.PI);
1540
- for (let F = 0; F < x && A < t; F++) {
1541
- const U = x === 1 ? (P + _) / 2 : P + F * N, L = this.calculateWaveY(U, s, E, v, $), W = U, G = O + L, X = b ? this.random(d, f) : 1, B = p * X;
1539
+ E === "offset" ? $ = C * w : E === "alternating" && ($ = C * Math.PI);
1540
+ for (let F = 0; F < x && R < t; F++) {
1541
+ const U = x === 1 ? (P + _) / 2 : P + F * N, L = this.calculateWaveY(U, s, S, v, $), G = U, W = O + L, X = b ? this.random(d, m) : 1, B = p * X;
1542
1542
  let J = 0;
1543
- c === "tangent" ? J = this.calculateRotation(U, s, E, v, $) : c === "random" && (J = this.random(u, l));
1544
- const K = B * 1.5 / 2, ct = B / 2, it = h + K, nt = s - h - K, lt = h + ct, ht = r - h - ct;
1545
- o.push({
1546
- id: A,
1547
- x: Math.max(it, Math.min(W, nt)),
1548
- y: Math.max(lt, Math.min(G, ht)),
1543
+ c === "tangent" ? J = this.calculateRotation(U, s, S, v, $) : c === "random" && (J = this.random(u, l));
1544
+ const K = B * 1.5 / 2, ht = B / 2, ot = h + K, st = s - h - K, dt = h + ht, ut = r - h - ht;
1545
+ n.push({
1546
+ id: R,
1547
+ x: Math.max(ot, Math.min(G, st)),
1548
+ y: Math.max(dt, Math.min(W, ut)),
1549
1549
  rotation: J,
1550
1550
  scale: X,
1551
1551
  baseSize: B,
1552
- zIndex: A + 1
1553
- }), A++;
1552
+ zIndex: R + 1
1553
+ }), R++;
1554
1554
  }
1555
1555
  }
1556
- return o;
1556
+ return n;
1557
1557
  }
1558
1558
  /**
1559
1559
  * Calculate Y position displacement on wave curve
@@ -1564,9 +1564,9 @@ class ue {
1564
1564
  * @param phase - Phase offset
1565
1565
  * @returns Y displacement from baseline
1566
1566
  */
1567
- calculateWaveY(t, e, i, o, s) {
1567
+ calculateWaveY(t, e, i, n, s) {
1568
1568
  const r = t / e;
1569
- return i * Math.sin(o * r * 2 * Math.PI + s);
1569
+ return i * Math.sin(n * r * 2 * Math.PI + s);
1570
1570
  }
1571
1571
  /**
1572
1572
  * Calculate rotation based on wave tangent
@@ -1577,8 +1577,8 @@ class ue {
1577
1577
  * @param phase - Phase offset
1578
1578
  * @returns Rotation angle in degrees
1579
1579
  */
1580
- calculateRotation(t, e, i, o, s) {
1581
- const r = t / e, a = i * o * 2 * Math.PI * Math.cos(o * r * 2 * Math.PI + s) / e;
1580
+ calculateRotation(t, e, i, n, s) {
1581
+ const r = t / e, a = i * n * 2 * Math.PI * Math.cos(n * r * 2 * Math.PI + s) / e;
1582
1582
  return Math.atan(a) * (180 / Math.PI);
1583
1583
  }
1584
1584
  /**
@@ -1593,7 +1593,7 @@ class ue {
1593
1593
  return Math.random() * (e - t) + t;
1594
1594
  }
1595
1595
  }
1596
- class ge {
1596
+ class fe {
1597
1597
  constructor(t) {
1598
1598
  this.config = t.layout, this.imageConfig = t.image, this.layouts = /* @__PURE__ */ new Map(), this.placementLayout = this.initLayout();
1599
1599
  }
@@ -1604,17 +1604,17 @@ class ge {
1604
1604
  initLayout() {
1605
1605
  switch (this.config.algorithm) {
1606
1606
  case "radial":
1607
- return new oe(this.config, this.imageConfig);
1608
- case "grid":
1609
1607
  return new ae(this.config, this.imageConfig);
1608
+ case "grid":
1609
+ return new ce(this.config, this.imageConfig);
1610
1610
  case "spiral":
1611
- return new le(this.config, this.imageConfig);
1612
- case "cluster":
1613
1611
  return new de(this.config, this.imageConfig);
1612
+ case "cluster":
1613
+ return new ge(this.config, this.imageConfig);
1614
1614
  case "wave":
1615
- return new ue(this.config, this.imageConfig);
1615
+ return new me(this.config, this.imageConfig);
1616
1616
  default:
1617
- return new ne(this.config, this.imageConfig);
1617
+ return new se(this.config, this.imageConfig);
1618
1618
  }
1619
1619
  }
1620
1620
  /**
@@ -1625,10 +1625,10 @@ class ge {
1625
1625
  * @returns Array of layout objects with position, rotation, scale
1626
1626
  */
1627
1627
  generateLayout(t, e, i = {}) {
1628
- const o = this.placementLayout.generate(t, e, i);
1629
- return o.forEach((s) => {
1628
+ const n = this.placementLayout.generate(t, e, i);
1629
+ return n.forEach((s) => {
1630
1630
  this.layouts.set(s.id, s);
1631
- }), o;
1631
+ }), n;
1632
1632
  }
1633
1633
  /**
1634
1634
  * Get the original layout state for an image
@@ -1681,8 +1681,8 @@ class ge {
1681
1681
  return;
1682
1682
  if (typeof i == "number")
1683
1683
  return i;
1684
- const o = i, s = this.resolveBreakpoint(t);
1685
- return s === "mobile" ? o.mobile ?? o.tablet ?? o.screen : s === "tablet" ? o.tablet ?? o.screen ?? o.mobile : o.screen ?? o.tablet ?? o.mobile;
1684
+ const n = i, s = this.resolveBreakpoint(t);
1685
+ return s === "mobile" ? n.mobile ?? n.tablet ?? n.screen : s === "tablet" ? n.tablet ?? n.screen ?? n.mobile : n.screen ?? n.tablet ?? n.mobile;
1686
1686
  }
1687
1687
  /**
1688
1688
  * Calculate adaptive image size based on container dimensions and image count
@@ -1692,19 +1692,19 @@ class ge {
1692
1692
  * @param viewportWidth - Current viewport width for baseHeight resolution
1693
1693
  * @returns Calculated sizing result with height
1694
1694
  */
1695
- calculateAdaptiveSize(t, e, i, o) {
1696
- const s = this.imageConfig.sizing, r = this.resolveBaseHeight(o);
1695
+ calculateAdaptiveSize(t, e, i, n) {
1696
+ const s = this.imageConfig.sizing, r = this.resolveBaseHeight(n);
1697
1697
  if (r !== void 0)
1698
1698
  return { height: r };
1699
1699
  const a = s?.minSize ?? 50, h = s?.maxSize ?? 400, c = this.config.targetCoverage ?? 0.6, u = this.config.densityFactor ?? 1, { width: l, height: d } = t, p = l * d * c / e;
1700
- let m = Math.sqrt(p / 1.4);
1701
- m *= u, m = Math.min(m, i);
1702
- let E = this.clamp(m, a, h);
1703
- if (E === a && m < a) {
1700
+ let f = Math.sqrt(p / 1.4);
1701
+ f *= u, f = Math.min(f, i);
1702
+ let S = this.clamp(f, a, h);
1703
+ if (S === a && f < a) {
1704
1704
  const v = Math.max(a * 0.05, 20);
1705
- E = Math.max(v, m);
1705
+ S = Math.max(v, f);
1706
1706
  }
1707
- return { height: E };
1707
+ return { height: S };
1708
1708
  }
1709
1709
  /**
1710
1710
  * Utility: Clamp a value between min and max
@@ -1713,75 +1713,109 @@ class ge {
1713
1713
  return Math.max(e, Math.min(i, t));
1714
1714
  }
1715
1715
  }
1716
- var I = /* @__PURE__ */ ((n) => (n.IDLE = "idle", n.FOCUSING = "focusing", n.FOCUSED = "focused", n.UNFOCUSING = "unfocusing", n.CROSS_ANIMATING = "cross_animating", n))(I || {});
1717
- function fe(n) {
1718
- return n in ft;
1716
+ const Z = class Z {
1717
+ /**
1718
+ * Register a loader implementation with the registry
1719
+ * @param name - Loader identifier (e.g., 'static', 'google-drive', 'composite')
1720
+ * @param Loader - Loader class constructor to register
1721
+ */
1722
+ static registerLoader(t, e) {
1723
+ Z.registry.set(t, e);
1724
+ }
1725
+ /**
1726
+ * Get a registered loader implementation
1727
+ * @param name - Loader identifier
1728
+ * @returns Loader class constructor
1729
+ * @throws Error if loader is not registered
1730
+ */
1731
+ static getLoader(t) {
1732
+ const e = Z.registry.get(t);
1733
+ if (!e)
1734
+ throw new Error(
1735
+ `Loader "${t}" is not registered. Import "@frybynite/image-cloud/loaders/${t}" or "@frybynite/image-cloud/loaders/all".`
1736
+ );
1737
+ return e;
1738
+ }
1739
+ /**
1740
+ * Check if a loader is registered
1741
+ * @param name - Loader identifier
1742
+ * @returns True if the loader is registered, false otherwise
1743
+ */
1744
+ static isRegistered(t) {
1745
+ return Z.registry.has(t);
1746
+ }
1747
+ };
1748
+ Z.registry = /* @__PURE__ */ new Map();
1749
+ let et = Z;
1750
+ var I = /* @__PURE__ */ ((o) => (o.IDLE = "idle", o.FOCUSING = "focusing", o.FOCUSED = "focused", o.UNFOCUSING = "unfocusing", o.CROSS_ANIMATING = "cross_animating", o))(I || {});
1751
+ function pe(o) {
1752
+ return o in pt;
1719
1753
  }
1720
- function me(n) {
1721
- return n ? fe(n) ? ft[n] : n : ft.md;
1754
+ function be(o) {
1755
+ return o ? pe(o) ? pt[o] : o : pt.md;
1722
1756
  }
1723
- function pe(n) {
1724
- if (!n) return "";
1757
+ function ye(o) {
1758
+ if (!o) return "";
1725
1759
  const t = [];
1726
- if (n.grayscale !== void 0 && t.push(`grayscale(${n.grayscale})`), n.blur !== void 0 && t.push(`blur(${n.blur}px)`), n.brightness !== void 0 && t.push(`brightness(${n.brightness})`), n.contrast !== void 0 && t.push(`contrast(${n.contrast})`), n.saturate !== void 0 && t.push(`saturate(${n.saturate})`), n.opacity !== void 0 && t.push(`opacity(${n.opacity})`), n.sepia !== void 0 && t.push(`sepia(${n.sepia})`), n.hueRotate !== void 0 && t.push(`hue-rotate(${n.hueRotate}deg)`), n.invert !== void 0 && t.push(`invert(${n.invert})`), n.dropShadow !== void 0)
1727
- if (typeof n.dropShadow == "string")
1728
- t.push(`drop-shadow(${n.dropShadow})`);
1760
+ if (o.grayscale !== void 0 && t.push(`grayscale(${o.grayscale})`), o.blur !== void 0 && t.push(`blur(${o.blur}px)`), o.brightness !== void 0 && t.push(`brightness(${o.brightness})`), o.contrast !== void 0 && t.push(`contrast(${o.contrast})`), o.saturate !== void 0 && t.push(`saturate(${o.saturate})`), o.opacity !== void 0 && t.push(`opacity(${o.opacity})`), o.sepia !== void 0 && t.push(`sepia(${o.sepia})`), o.hueRotate !== void 0 && t.push(`hue-rotate(${o.hueRotate}deg)`), o.invert !== void 0 && t.push(`invert(${o.invert})`), o.dropShadow !== void 0)
1761
+ if (typeof o.dropShadow == "string")
1762
+ t.push(`drop-shadow(${o.dropShadow})`);
1729
1763
  else {
1730
- const e = n.dropShadow;
1764
+ const e = o.dropShadow;
1731
1765
  t.push(`drop-shadow(${e.x}px ${e.y}px ${e.blur}px ${e.color})`);
1732
1766
  }
1733
1767
  return t.join(" ");
1734
1768
  }
1735
- function Q(n) {
1736
- if (!n || n.style === "none" || n.width === 0)
1769
+ function tt(o) {
1770
+ if (!o || o.style === "none" || o.width === 0)
1737
1771
  return "none";
1738
- const t = n.width ?? 0, e = n.style ?? "solid", i = n.color ?? "#000000";
1772
+ const t = o.width ?? 0, e = o.style ?? "solid", i = o.color ?? "#000000";
1739
1773
  return `${t}px ${e} ${i}`;
1740
1774
  }
1741
- function st(n) {
1742
- if (!n) return {};
1775
+ function rt(o) {
1776
+ if (!o) return {};
1743
1777
  const t = {};
1744
- if (n.borderRadiusTopLeft !== void 0 || n.borderRadiusTopRight !== void 0 || n.borderRadiusBottomRight !== void 0 || n.borderRadiusBottomLeft !== void 0) {
1745
- const s = n.border?.radius ?? 0;
1746
- n.borderRadiusTopLeft !== void 0 ? t.borderTopLeftRadius = `${n.borderRadiusTopLeft}px` : s && (t.borderTopLeftRadius = `${s}px`), n.borderRadiusTopRight !== void 0 ? t.borderTopRightRadius = `${n.borderRadiusTopRight}px` : s && (t.borderTopRightRadius = `${s}px`), n.borderRadiusBottomRight !== void 0 ? t.borderBottomRightRadius = `${n.borderRadiusBottomRight}px` : s && (t.borderBottomRightRadius = `${s}px`), n.borderRadiusBottomLeft !== void 0 ? t.borderBottomLeftRadius = `${n.borderRadiusBottomLeft}px` : s && (t.borderBottomLeftRadius = `${s}px`);
1747
- } else n.border?.radius !== void 0 && (t.borderRadius = `${n.border.radius}px`);
1748
- if (n.borderTop || n.borderRight || n.borderBottom || n.borderLeft) {
1749
- const s = n.border || {}, r = { ...s, ...n.borderTop }, a = { ...s, ...n.borderRight }, h = { ...s, ...n.borderBottom }, c = { ...s, ...n.borderLeft };
1750
- t.borderTop = Q(r), t.borderRight = Q(a), t.borderBottom = Q(h), t.borderLeft = Q(c);
1751
- } else n.border && (t.border = Q(n.border));
1752
- n.shadow !== void 0 && (t.boxShadow = me(n.shadow));
1753
- const o = pe(n.filter);
1754
- if (t.filter = o || "none", n.opacity !== void 0 && (t.opacity = String(n.opacity)), n.cursor !== void 0 && (t.cursor = n.cursor), n.outline && n.outline.style !== "none" && (n.outline.width ?? 0) > 0) {
1755
- const s = n.outline.width ?? 0, r = n.outline.style ?? "solid", a = n.outline.color ?? "#000000";
1756
- t.outline = `${s}px ${r} ${a}`, n.outline.offset !== void 0 && (t.outlineOffset = `${n.outline.offset}px`);
1757
- }
1758
- return n.objectFit !== void 0 && (t.objectFit = n.objectFit), n.aspectRatio !== void 0 && (t.aspectRatio = n.aspectRatio), t;
1778
+ if (o.borderRadiusTopLeft !== void 0 || o.borderRadiusTopRight !== void 0 || o.borderRadiusBottomRight !== void 0 || o.borderRadiusBottomLeft !== void 0) {
1779
+ const s = o.border?.radius ?? 0;
1780
+ o.borderRadiusTopLeft !== void 0 ? t.borderTopLeftRadius = `${o.borderRadiusTopLeft}px` : s && (t.borderTopLeftRadius = `${s}px`), o.borderRadiusTopRight !== void 0 ? t.borderTopRightRadius = `${o.borderRadiusTopRight}px` : s && (t.borderTopRightRadius = `${s}px`), o.borderRadiusBottomRight !== void 0 ? t.borderBottomRightRadius = `${o.borderRadiusBottomRight}px` : s && (t.borderBottomRightRadius = `${s}px`), o.borderRadiusBottomLeft !== void 0 ? t.borderBottomLeftRadius = `${o.borderRadiusBottomLeft}px` : s && (t.borderBottomLeftRadius = `${s}px`);
1781
+ } else o.border?.radius !== void 0 && (t.borderRadius = `${o.border.radius}px`);
1782
+ if (o.borderTop || o.borderRight || o.borderBottom || o.borderLeft) {
1783
+ const s = o.border || {}, r = { ...s, ...o.borderTop }, a = { ...s, ...o.borderRight }, h = { ...s, ...o.borderBottom }, c = { ...s, ...o.borderLeft };
1784
+ t.borderTop = tt(r), t.borderRight = tt(a), t.borderBottom = tt(h), t.borderLeft = tt(c);
1785
+ } else o.border && (t.border = tt(o.border));
1786
+ o.shadow !== void 0 && (t.boxShadow = be(o.shadow));
1787
+ const n = ye(o.filter);
1788
+ if (t.filter = n || "none", o.opacity !== void 0 && (t.opacity = String(o.opacity)), o.cursor !== void 0 && (t.cursor = o.cursor), o.outline && o.outline.style !== "none" && (o.outline.width ?? 0) > 0) {
1789
+ const s = o.outline.width ?? 0, r = o.outline.style ?? "solid", a = o.outline.color ?? "#000000";
1790
+ t.outline = `${s}px ${r} ${a}`, o.outline.offset !== void 0 && (t.outlineOffset = `${o.outline.offset}px`);
1791
+ }
1792
+ return o.objectFit !== void 0 && (t.objectFit = o.objectFit), o.aspectRatio !== void 0 && (t.aspectRatio = o.aspectRatio), t;
1759
1793
  }
1760
- function tt(n, t) {
1761
- t.borderRadius !== void 0 && (n.style.borderRadius = t.borderRadius), t.borderTopLeftRadius !== void 0 && (n.style.borderTopLeftRadius = t.borderTopLeftRadius), t.borderTopRightRadius !== void 0 && (n.style.borderTopRightRadius = t.borderTopRightRadius), t.borderBottomRightRadius !== void 0 && (n.style.borderBottomRightRadius = t.borderBottomRightRadius), t.borderBottomLeftRadius !== void 0 && (n.style.borderBottomLeftRadius = t.borderBottomLeftRadius), t.border !== void 0 && (n.style.border = t.border), t.borderTop !== void 0 && (n.style.borderTop = t.borderTop), t.borderRight !== void 0 && (n.style.borderRight = t.borderRight), t.borderBottom !== void 0 && (n.style.borderBottom = t.borderBottom), t.borderLeft !== void 0 && (n.style.borderLeft = t.borderLeft), t.boxShadow !== void 0 && (n.style.boxShadow = t.boxShadow), t.filter !== void 0 && (n.style.filter = t.filter), t.opacity !== void 0 && (n.style.opacity = t.opacity), t.cursor !== void 0 && (n.style.cursor = t.cursor), t.outline !== void 0 && (n.style.outline = t.outline), t.outlineOffset !== void 0 && (n.style.outlineOffset = t.outlineOffset), t.objectFit !== void 0 && (n.style.objectFit = t.objectFit), t.aspectRatio !== void 0 && (n.style.aspectRatio = t.aspectRatio);
1794
+ function it(o, t) {
1795
+ t.borderRadius !== void 0 && (o.style.borderRadius = t.borderRadius), t.borderTopLeftRadius !== void 0 && (o.style.borderTopLeftRadius = t.borderTopLeftRadius), t.borderTopRightRadius !== void 0 && (o.style.borderTopRightRadius = t.borderTopRightRadius), t.borderBottomRightRadius !== void 0 && (o.style.borderBottomRightRadius = t.borderBottomRightRadius), t.borderBottomLeftRadius !== void 0 && (o.style.borderBottomLeftRadius = t.borderBottomLeftRadius), t.border !== void 0 && (o.style.border = t.border), t.borderTop !== void 0 && (o.style.borderTop = t.borderTop), t.borderRight !== void 0 && (o.style.borderRight = t.borderRight), t.borderBottom !== void 0 && (o.style.borderBottom = t.borderBottom), t.borderLeft !== void 0 && (o.style.borderLeft = t.borderLeft), t.boxShadow !== void 0 && (o.style.boxShadow = t.boxShadow), t.filter !== void 0 && (o.style.filter = t.filter), t.opacity !== void 0 && (o.style.opacity = t.opacity), t.cursor !== void 0 && (o.style.cursor = t.cursor), t.outline !== void 0 && (o.style.outline = t.outline), t.outlineOffset !== void 0 && (o.style.outlineOffset = t.outlineOffset), t.objectFit !== void 0 && (o.style.objectFit = t.objectFit), t.aspectRatio !== void 0 && (o.style.aspectRatio = t.aspectRatio);
1762
1796
  }
1763
- function Lt(n) {
1764
- return n ? Array.isArray(n) ? n.join(" ") : n : "";
1797
+ function zt(o) {
1798
+ return o ? Array.isArray(o) ? o.join(" ") : o : "";
1765
1799
  }
1766
- function et(n, t) {
1767
- const e = Lt(t);
1800
+ function nt(o, t) {
1801
+ const e = zt(t);
1768
1802
  e && e.split(" ").forEach((i) => {
1769
- i.trim() && n.classList.add(i.trim());
1803
+ i.trim() && o.classList.add(i.trim());
1770
1804
  });
1771
1805
  }
1772
- function Mt(n, t) {
1773
- const e = Lt(t);
1806
+ function Ft(o, t) {
1807
+ const e = zt(t);
1774
1808
  e && e.split(" ").forEach((i) => {
1775
- i.trim() && n.classList.remove(i.trim());
1809
+ i.trim() && o.classList.remove(i.trim());
1776
1810
  });
1777
1811
  }
1778
- const It = {
1812
+ const Tt = {
1779
1813
  UNFOCUSING: 999,
1780
1814
  FOCUSING: 1e3
1781
1815
  };
1782
- class be {
1816
+ class ve {
1783
1817
  constructor(t, e, i) {
1784
- this.state = I.IDLE, this.currentFocus = null, this.focusData = null, this.outgoing = null, this.incoming = null, this.focusGeneration = 0, this.config = t, this.animationEngine = e, this.defaultStyles = st(i?.default), this.focusedStyles = st(i?.focused), this.defaultClassName = i?.default?.className, this.focusedClassName = i?.focused?.className;
1818
+ this.state = I.IDLE, this.currentFocus = null, this.focusData = null, this.outgoing = null, this.incoming = null, this.focusGeneration = 0, this.config = t, this.animationEngine = e, this.defaultStyles = rt(i?.default), this.focusedStyles = rt(i?.focused), this.defaultClassName = i?.default?.className, this.focusedClassName = i?.focused?.className;
1785
1819
  }
1786
1820
  /**
1787
1821
  * Get current state machine state
@@ -1806,9 +1840,9 @@ class be {
1806
1840
  * Returns actual pixel dimensions instead of scale factor for sharper rendering
1807
1841
  */
1808
1842
  calculateFocusDimensions(t, e, i) {
1809
- const o = this.normalizeScalePercent(this.config.scalePercent), s = i.height * o, r = t / e;
1843
+ const n = this.normalizeScalePercent(this.config.scalePercent), s = i.height * n, r = t / e;
1810
1844
  let a = s, h = a * r;
1811
- const c = i.width * o;
1845
+ const c = i.width * n;
1812
1846
  return h > c && (h = c, a = h / r), { width: h, height: a };
1813
1847
  }
1814
1848
  /**
@@ -1816,7 +1850,7 @@ class be {
1816
1850
  * Scale is handled by animating actual dimensions for sharper rendering
1817
1851
  */
1818
1852
  calculateFocusTransform(t, e) {
1819
- const i = t.width / 2, o = t.height / 2, s = i - e.x, r = o - e.y;
1853
+ const i = t.width / 2, n = t.height / 2, s = i - e.x, r = n - e.y;
1820
1854
  return {
1821
1855
  x: s,
1822
1856
  y: r,
@@ -1831,8 +1865,8 @@ class be {
1831
1865
  buildDimensionZoomTransform(t) {
1832
1866
  const e = ["translate(-50%, -50%)"];
1833
1867
  if (t.x !== void 0 || t.y !== void 0) {
1834
- const i = t.x ?? 0, o = t.y ?? 0;
1835
- e.push(`translate(${i}px, ${o}px)`);
1868
+ const i = t.x ?? 0, n = t.y ?? 0;
1869
+ e.push(`translate(${i}px, ${n}px)`);
1836
1870
  }
1837
1871
  return t.rotation !== void 0 && e.push(`rotate(${t.rotation}deg)`), e.join(" ");
1838
1872
  }
@@ -1840,13 +1874,13 @@ class be {
1840
1874
  * Create a Web Animation that animates both transform (position) and dimensions
1841
1875
  * This provides sharper zoom by re-rendering at target size instead of scaling pixels
1842
1876
  */
1843
- animateWithDimensions(t, e, i, o, s, r, a, h) {
1877
+ animateWithDimensions(t, e, i, n, s, r, a, h) {
1844
1878
  const c = this.buildDimensionZoomTransform(e), u = this.buildDimensionZoomTransform(i);
1845
1879
  return t.style.transition = "none", t.animate(
1846
1880
  [
1847
1881
  {
1848
1882
  transform: c,
1849
- width: `${o}px`,
1883
+ width: `${n}px`,
1850
1884
  height: `${s}px`
1851
1885
  },
1852
1886
  {
@@ -1866,13 +1900,13 @@ class be {
1866
1900
  * Apply focused styling to an element
1867
1901
  */
1868
1902
  applyFocusedStyling(t, e) {
1869
- t.style.zIndex = String(e), t.classList.add("fbn-ic-focused"), tt(t, this.focusedStyles), et(t, this.focusedClassName);
1903
+ t.style.zIndex = String(e), t.classList.add("fbn-ic-focused"), it(t, this.focusedStyles), nt(t, this.focusedClassName);
1870
1904
  }
1871
1905
  /**
1872
1906
  * Remove focused styling from an element
1873
1907
  */
1874
1908
  removeFocusedStyling(t, e) {
1875
- t.style.zIndex = e, t.classList.remove("fbn-ic-focused"), Mt(t, this.focusedClassName), tt(t, this.defaultStyles), et(t, this.defaultClassName);
1909
+ t.style.zIndex = e, t.classList.remove("fbn-ic-focused"), Ft(t, this.focusedClassName), it(t, this.defaultStyles), nt(t, this.defaultClassName);
1876
1910
  }
1877
1911
  /**
1878
1912
  * Start focus animation for an image using dimension-based zoom
@@ -1880,21 +1914,21 @@ class be {
1880
1914
  * @param fromTransform - Optional starting transform (for mid-animation reversals)
1881
1915
  * @param fromDimensions - Optional starting dimensions (for mid-animation reversals)
1882
1916
  */
1883
- startFocusAnimation(t, e, i, o, s) {
1917
+ startFocusAnimation(t, e, i, n, s) {
1884
1918
  const r = t.style.zIndex || "", a = t.offsetWidth, h = t.offsetHeight, c = this.calculateFocusDimensions(a, h, e), u = this.calculateFocusTransform(e, i);
1885
- this.applyFocusedStyling(t, It.FOCUSING), this.animationEngine.cancelAllAnimations(t);
1886
- const l = o ?? {
1919
+ this.applyFocusedStyling(t, Tt.FOCUSING), this.animationEngine.cancelAllAnimations(t);
1920
+ const l = n ?? {
1887
1921
  x: 0,
1888
1922
  y: 0,
1889
1923
  rotation: i.rotation,
1890
1924
  scale: 1
1891
1925
  // No scale - using dimensions
1892
- }, d = s?.width ?? a, f = s?.height ?? h, b = this.config.animationDuration ?? 600, p = this.animateWithDimensions(
1926
+ }, d = s?.width ?? a, m = s?.height ?? h, b = this.config.animationDuration ?? 600, p = this.animateWithDimensions(
1893
1927
  t,
1894
1928
  l,
1895
1929
  u,
1896
1930
  d,
1897
- f,
1931
+ m,
1898
1932
  c.width,
1899
1933
  c.height,
1900
1934
  b
@@ -1930,9 +1964,9 @@ class be {
1930
1964
  * Animates back to original dimensions for consistent behavior
1931
1965
  * @param fromDimensions - Optional starting dimensions (for mid-animation reversals)
1932
1966
  */
1933
- startUnfocusAnimation(t, e, i, o) {
1934
- t.style.zIndex = String(It.UNFOCUSING), this.animationEngine.cancelAllAnimations(t);
1935
- const s = i ?? this.focusData?.focusTransform ?? { x: 0, y: 0, rotation: 0, scale: 1 }, r = o?.width ?? this.focusData?.focusWidth ?? t.offsetWidth, a = o?.height ?? this.focusData?.focusHeight ?? t.offsetHeight, h = {
1967
+ startUnfocusAnimation(t, e, i, n) {
1968
+ t.style.zIndex = String(Tt.UNFOCUSING), this.animationEngine.cancelAllAnimations(t);
1969
+ const s = i ?? this.focusData?.focusTransform ?? { x: 0, y: 0, rotation: 0, scale: 1 }, r = n?.width ?? this.focusData?.focusWidth ?? t.offsetWidth, a = n?.height ?? this.focusData?.focusHeight ?? t.offsetHeight, h = {
1936
1970
  x: 0,
1937
1971
  y: 0,
1938
1972
  rotation: e.rotation,
@@ -1947,7 +1981,7 @@ class be {
1947
1981
  c,
1948
1982
  u,
1949
1983
  l
1950
- ), f = {
1984
+ ), m = {
1951
1985
  id: `unfocus-${Date.now()}`,
1952
1986
  element: t,
1953
1987
  animation: d,
@@ -1959,12 +1993,33 @@ class be {
1959
1993
  return {
1960
1994
  element: t,
1961
1995
  originalState: e,
1962
- animationHandle: f,
1996
+ animationHandle: m,
1963
1997
  direction: "out",
1964
1998
  originalWidth: c,
1965
1999
  originalHeight: u
1966
2000
  };
1967
2001
  }
2002
+ /**
2003
+ * Capture the current visual state of an element mid-animation, BEFORE cancelling.
2004
+ *
2005
+ * The computed matrix.e/f include the -50%/-50% centering offset resolved to pixels.
2006
+ * buildDimensionZoomTransform prepends its own translate(-50%,-50%), so passing raw
2007
+ * matrix.e/f doubles the centering and produces the wrong starting position.
2008
+ *
2009
+ * This method extracts the PURE positional offset (pureX = matrix.e + 0.5*midWidth)
2010
+ * and commits width/height/transform to inline styles before the animation is cancelled,
2011
+ * preventing any visual snap.
2012
+ *
2013
+ * Must be called while the animation is still running (offsetWidth reflects animated size).
2014
+ * Caller is responsible for calling animationEngine.cancelAllAnimations() afterwards.
2015
+ */
2016
+ captureMidAnimationState(t) {
2017
+ const e = getComputedStyle(t), i = new DOMMatrix(e.transform), n = t.offsetWidth, s = t.offsetHeight, r = i.e + n * 0.5, a = i.f + s * 0.5, h = Math.atan2(i.b, i.a) * (180 / Math.PI);
2018
+ return t.style.width = `${n}px`, t.style.height = `${s}px`, t.style.transform = `translate(-50%, -50%) translate(${r}px, ${a}px) rotate(${h}deg)`, t.style.transition = "none", {
2019
+ transform: { x: r, y: a, rotation: h, scale: 1 },
2020
+ dimensions: { width: n, height: s }
2021
+ };
2022
+ }
1968
2023
  /**
1969
2024
  * Handle animation completion
1970
2025
  */
@@ -1977,10 +2032,10 @@ class be {
1977
2032
  /**
1978
2033
  * Reset an element instantly to its original position and dimensions (no animation)
1979
2034
  */
1980
- resetElementInstantly(t, e, i, o, s) {
2035
+ resetElementInstantly(t, e, i, n, s) {
1981
2036
  this.animationEngine.cancelAllAnimations(t);
1982
2037
  const r = ["translate(-50%, -50%)"];
1983
- r.push("translate(0px, 0px)"), r.push(`rotate(${e.rotation}deg)`), t.style.transition = "none", t.style.transform = r.join(" "), o !== void 0 && s !== void 0 && (t.style.width = `${o}px`, t.style.height = `${s}px`), this.removeFocusedStyling(t, i);
2038
+ r.push("translate(0px, 0px)"), r.push(`rotate(${e.rotation}deg)`), t.style.transition = "none", t.style.transform = r.join(" "), n !== void 0 && s !== void 0 && (t.style.width = `${n}px`, t.style.height = `${s}px`), this.removeFocusedStyling(t, i);
1984
2039
  }
1985
2040
  /**
1986
2041
  * Focus (zoom) an image to center of container
@@ -1990,28 +2045,19 @@ class be {
1990
2045
  if (this.currentFocus === t && this.state === I.FOCUSED)
1991
2046
  return this.unfocusImage();
1992
2047
  if (this.incoming?.element === t && this.state === I.FOCUSING) {
1993
- const s = this.animationEngine.cancelAnimation(this.incoming.animationHandle, !0), r = {
1994
- x: s.x,
1995
- y: s.y,
1996
- rotation: s.rotation,
1997
- scale: 1
1998
- // No scale transform - using dimensions
1999
- }, a = {
2000
- width: t.offsetWidth,
2001
- height: t.offsetHeight
2002
- };
2003
- this.outgoing = this.startUnfocusAnimation(
2048
+ const { transform: s, dimensions: r } = this.captureMidAnimationState(t);
2049
+ this.animationEngine.cancelAllAnimations(t), this.outgoing = this.startUnfocusAnimation(
2004
2050
  t,
2005
2051
  this.incoming.originalState,
2006
- r,
2007
- a
2052
+ s,
2053
+ r
2008
2054
  ), this.incoming = null, this.state = I.UNFOCUSING, await this.waitForAnimation(this.outgoing.animationHandle), this.removeFocusedStyling(this.outgoing.element, this.focusData?.originalZIndex || ""), this.outgoing = null, this.currentFocus = null, this.focusData = null, this.state = I.IDLE;
2009
2055
  return;
2010
2056
  }
2011
- const o = ++this.focusGeneration;
2057
+ const n = ++this.focusGeneration;
2012
2058
  switch (this.state) {
2013
2059
  case I.IDLE:
2014
- if (this.state = I.FOCUSING, this.incoming = this.startFocusAnimation(t, e, i), await this.waitForAnimation(this.incoming.animationHandle), this.focusGeneration !== o) return;
2060
+ if (this.state = I.FOCUSING, this.incoming = this.startFocusAnimation(t, e, i), await this.waitForAnimation(this.incoming.animationHandle), this.focusGeneration !== n) return;
2015
2061
  this.currentFocus = t, this.incoming = null, this.state = I.FOCUSED;
2016
2062
  break;
2017
2063
  case I.FOCUSED:
@@ -2021,7 +2067,7 @@ class be {
2021
2067
  )), this.incoming = this.startFocusAnimation(t, e, i), await Promise.all([
2022
2068
  this.outgoing ? this.waitForAnimation(this.outgoing.animationHandle) : Promise.resolve(),
2023
2069
  this.waitForAnimation(this.incoming.animationHandle)
2024
- ]), this.focusGeneration !== o)
2070
+ ]), this.focusGeneration !== n)
2025
2071
  return;
2026
2072
  this.outgoing && (this.removeFocusedStyling(this.outgoing.element, this.outgoing.originalState.zIndex?.toString() || ""), this.outgoing = null), this.currentFocus = t, this.incoming = null, this.state = I.FOCUSED;
2027
2073
  break;
@@ -2032,53 +2078,35 @@ class be {
2032
2078
  this.focusData?.originalZIndex || "",
2033
2079
  this.focusData?.originalWidth,
2034
2080
  this.focusData?.originalHeight
2035
- ), this.incoming = null), this.incoming = this.startFocusAnimation(t, e, i), await this.waitForAnimation(this.incoming.animationHandle), this.focusGeneration !== o) return;
2081
+ ), this.incoming = null), this.incoming = this.startFocusAnimation(t, e, i), await this.waitForAnimation(this.incoming.animationHandle), this.focusGeneration !== n) return;
2036
2082
  this.currentFocus = t, this.incoming = null, this.state = I.FOCUSED;
2037
2083
  break;
2038
2084
  case I.UNFOCUSING:
2039
2085
  if (this.state = I.CROSS_ANIMATING, this.incoming = this.startFocusAnimation(t, e, i), await Promise.all([
2040
2086
  this.outgoing ? this.waitForAnimation(this.outgoing.animationHandle) : Promise.resolve(),
2041
2087
  this.waitForAnimation(this.incoming.animationHandle)
2042
- ]), this.focusGeneration !== o) return;
2088
+ ]), this.focusGeneration !== n) return;
2043
2089
  this.outgoing && (this.removeFocusedStyling(this.outgoing.element, this.outgoing.originalState.zIndex?.toString() || ""), this.outgoing = null), this.currentFocus = t, this.incoming = null, this.state = I.FOCUSED;
2044
2090
  break;
2045
2091
  case I.CROSS_ANIMATING:
2046
2092
  if (this.incoming?.element === t)
2047
2093
  return;
2048
2094
  if (this.outgoing?.element === t) {
2049
- const s = this.animationEngine.cancelAnimation(this.outgoing.animationHandle, !0), r = {
2050
- x: s.x,
2051
- y: s.y,
2052
- rotation: s.rotation,
2053
- scale: 1
2054
- // No scale - using dimensions
2055
- }, a = {
2056
- width: t.offsetWidth,
2057
- height: t.offsetHeight
2058
- };
2059
- if (this.incoming) {
2060
- const h = this.animationEngine.cancelAnimation(this.incoming.animationHandle, !0), c = {
2061
- x: h.x,
2062
- y: h.y,
2063
- rotation: h.rotation,
2064
- scale: 1
2065
- // No scale - using dimensions
2066
- }, u = {
2067
- width: this.incoming.element.offsetWidth,
2068
- height: this.incoming.element.offsetHeight
2069
- };
2070
- this.outgoing = this.startUnfocusAnimation(
2095
+ const { transform: s, dimensions: r } = this.captureMidAnimationState(t);
2096
+ if (this.animationEngine.cancelAllAnimations(t), this.incoming) {
2097
+ const { transform: a, dimensions: h } = this.captureMidAnimationState(this.incoming.element);
2098
+ this.animationEngine.cancelAllAnimations(this.incoming.element), this.outgoing = this.startUnfocusAnimation(
2071
2099
  this.incoming.element,
2072
2100
  this.incoming.originalState,
2073
- c,
2074
- u
2101
+ a,
2102
+ h
2075
2103
  );
2076
2104
  } else
2077
2105
  this.outgoing = null;
2078
- if (this.incoming = this.startFocusAnimation(t, e, i, r, a), await Promise.all([
2106
+ if (this.incoming = this.startFocusAnimation(t, e, i, s, r), await Promise.all([
2079
2107
  this.outgoing ? this.waitForAnimation(this.outgoing.animationHandle) : Promise.resolve(),
2080
2108
  this.waitForAnimation(this.incoming.animationHandle)
2081
- ]), this.focusGeneration !== o) return;
2109
+ ]), this.focusGeneration !== n) return;
2082
2110
  this.outgoing && (this.removeFocusedStyling(this.outgoing.element, this.outgoing.originalState.zIndex?.toString() || ""), this.outgoing = null), this.currentFocus = t, this.incoming = null, this.state = I.FOCUSED;
2083
2111
  return;
2084
2112
  }
@@ -2089,27 +2117,18 @@ class be {
2089
2117
  this.outgoing.originalWidth,
2090
2118
  this.outgoing.originalHeight
2091
2119
  ), this.outgoing = null), this.incoming) {
2092
- const s = this.animationEngine.cancelAnimation(this.incoming.animationHandle, !0), r = {
2093
- x: s.x,
2094
- y: s.y,
2095
- rotation: s.rotation,
2096
- scale: 1
2097
- // No scale - using dimensions
2098
- }, a = {
2099
- width: this.incoming.element.offsetWidth,
2100
- height: this.incoming.element.offsetHeight
2101
- };
2102
- this.outgoing = this.startUnfocusAnimation(
2120
+ const { transform: s, dimensions: r } = this.captureMidAnimationState(this.incoming.element);
2121
+ this.animationEngine.cancelAllAnimations(this.incoming.element), this.outgoing = this.startUnfocusAnimation(
2103
2122
  this.incoming.element,
2104
2123
  this.incoming.originalState,
2105
- r,
2106
- a
2124
+ s,
2125
+ r
2107
2126
  );
2108
2127
  }
2109
2128
  if (this.incoming = this.startFocusAnimation(t, e, i), await Promise.all([
2110
2129
  this.outgoing ? this.waitForAnimation(this.outgoing.animationHandle) : Promise.resolve(),
2111
2130
  this.waitForAnimation(this.incoming.animationHandle)
2112
- ]), this.focusGeneration !== o) return;
2131
+ ]), this.focusGeneration !== n) return;
2113
2132
  this.outgoing && (this.removeFocusedStyling(this.outgoing.element, this.outgoing.originalState.zIndex?.toString() || ""), this.outgoing = null), this.currentFocus = t, this.incoming = null, this.state = I.FOCUSED;
2114
2133
  break;
2115
2134
  }
@@ -2118,55 +2137,41 @@ class be {
2118
2137
  * Unfocus current image, returning it to original position
2119
2138
  */
2120
2139
  async unfocusImage() {
2140
+ if (this.state === I.UNFOCUSING)
2141
+ return;
2121
2142
  const t = ++this.focusGeneration;
2122
2143
  if (!this.currentFocus || !this.focusData) {
2123
2144
  if (this.incoming && this.state === I.FOCUSING) {
2124
- const s = this.animationEngine.cancelAnimation(this.incoming.animationHandle, !0), r = {
2125
- x: s.x,
2126
- y: s.y,
2127
- rotation: s.rotation,
2128
- scale: 1
2129
- // No scale - using dimensions
2130
- }, a = {
2131
- width: this.incoming.element.offsetWidth,
2132
- height: this.incoming.element.offsetHeight
2133
- };
2134
- if (this.outgoing = this.startUnfocusAnimation(
2145
+ const { transform: s, dimensions: r } = this.captureMidAnimationState(this.incoming.element);
2146
+ if (this.animationEngine.cancelAllAnimations(this.incoming.element), this.outgoing = this.startUnfocusAnimation(
2135
2147
  this.incoming.element,
2136
2148
  this.incoming.originalState,
2137
- r,
2138
- a
2149
+ s,
2150
+ r
2139
2151
  ), this.incoming = null, this.state = I.UNFOCUSING, await this.waitForAnimation(this.outgoing.animationHandle), this.focusGeneration !== t) return;
2140
2152
  this.removeFocusedStyling(this.outgoing.element, this.focusData?.originalZIndex || ""), this.outgoing = null, this.focusData = null, this.state = I.IDLE;
2141
2153
  }
2142
2154
  return;
2143
2155
  }
2144
2156
  if (this.state === I.CROSS_ANIMATING && this.incoming) {
2145
- const s = this.animationEngine.cancelAnimation(this.incoming.animationHandle, !0), r = {
2146
- x: s.x,
2147
- y: s.y,
2148
- rotation: s.rotation,
2149
- scale: 1
2150
- // No scale - using dimensions
2151
- }, a = {
2152
- width: this.incoming.element.offsetWidth,
2153
- height: this.incoming.element.offsetHeight
2154
- }, h = this.startUnfocusAnimation(
2157
+ const { transform: s, dimensions: r } = this.captureMidAnimationState(this.incoming.element);
2158
+ this.animationEngine.cancelAllAnimations(this.incoming.element);
2159
+ const a = this.startUnfocusAnimation(
2155
2160
  this.incoming.element,
2156
2161
  this.incoming.originalState,
2157
- r,
2158
- a
2162
+ s,
2163
+ r
2159
2164
  );
2160
2165
  if (await Promise.all([
2161
2166
  this.outgoing ? this.waitForAnimation(this.outgoing.animationHandle) : Promise.resolve(),
2162
- this.waitForAnimation(h.animationHandle)
2167
+ this.waitForAnimation(a.animationHandle)
2163
2168
  ]), this.focusGeneration !== t) return;
2164
- this.outgoing && this.removeFocusedStyling(this.outgoing.element, this.outgoing.originalState.zIndex?.toString() || ""), this.removeFocusedStyling(h.element, this.incoming.originalState.zIndex?.toString() || ""), this.outgoing = null, this.incoming = null, this.currentFocus = null, this.focusData = null, this.state = I.IDLE;
2169
+ this.outgoing && this.removeFocusedStyling(this.outgoing.element, this.outgoing.originalState.zIndex?.toString() || ""), this.removeFocusedStyling(a.element, this.incoming.originalState.zIndex?.toString() || ""), this.outgoing = null, this.incoming = null, this.currentFocus = null, this.focusData = null, this.state = I.IDLE;
2165
2170
  return;
2166
2171
  }
2167
2172
  this.state = I.UNFOCUSING;
2168
- const e = this.currentFocus, i = this.focusData.originalState, o = this.focusData.originalZIndex;
2169
- this.outgoing = this.startUnfocusAnimation(e, i), await this.waitForAnimation(this.outgoing.animationHandle), this.focusGeneration === t && (this.removeFocusedStyling(e, o), this.outgoing = null, this.currentFocus = null, this.focusData = null, this.state = I.IDLE);
2173
+ const e = this.currentFocus, i = this.focusData.originalState, n = this.focusData.originalZIndex;
2174
+ this.outgoing = this.startUnfocusAnimation(e, i), await this.waitForAnimation(this.outgoing.animationHandle), this.focusGeneration === t && (this.removeFocusedStyling(e, n), this.outgoing = null, this.currentFocus = null, this.focusData = null, this.state = I.IDLE);
2170
2175
  }
2171
2176
  /**
2172
2177
  * Swap focus from current image to a new one (alias for focusImage with cross-animation)
@@ -2206,8 +2211,8 @@ class be {
2206
2211
  */
2207
2212
  setDragOffset(t) {
2208
2213
  if (!this.currentFocus || !this.focusData || this.state !== I.FOCUSED) return;
2209
- const e = this.currentFocus, i = this.focusData.focusTransform, o = ["translate(-50%, -50%)"], s = (i.x ?? 0) + t, r = i.y ?? 0;
2210
- o.push(`translate(${s}px, ${r}px)`), i.rotation !== void 0 && o.push(`rotate(${i.rotation}deg)`), e.style.transition = "none", e.style.transform = o.join(" ");
2214
+ const e = this.currentFocus, i = this.focusData.focusTransform, n = ["translate(-50%, -50%)"], s = (i.x ?? 0) + t, r = i.y ?? 0;
2215
+ n.push(`translate(${s}px, ${r}px)`), i.rotation !== void 0 && n.push(`rotate(${i.rotation}deg)`), e.style.transition = "none", e.style.transform = n.join(" ");
2211
2216
  }
2212
2217
  /**
2213
2218
  * Clear the drag offset, optionally animating back to center
@@ -2216,8 +2221,8 @@ class be {
2216
2221
  */
2217
2222
  clearDragOffset(t, e = 150) {
2218
2223
  if (!this.currentFocus || !this.focusData || this.state !== I.FOCUSED) return;
2219
- const i = this.currentFocus, o = this.focusData.focusTransform, s = ["translate(-50%, -50%)"], r = o.x ?? 0, a = o.y ?? 0;
2220
- s.push(`translate(${r}px, ${a}px)`), o.rotation !== void 0 && s.push(`rotate(${o.rotation}deg)`);
2224
+ const i = this.currentFocus, n = this.focusData.focusTransform, s = ["translate(-50%, -50%)"], r = n.x ?? 0, a = n.y ?? 0;
2225
+ s.push(`translate(${r}px, ${a}px)`), n.rotation !== void 0 && s.push(`rotate(${n.rotation}deg)`);
2221
2226
  const h = s.join(" ");
2222
2227
  t ? (i.style.transition = `transform ${e}ms ease-out`, i.style.transform = h, setTimeout(() => {
2223
2228
  this.currentFocus === i && (i.style.transition = "none");
@@ -2248,7 +2253,7 @@ class be {
2248
2253
  ), this.state = I.IDLE, this.currentFocus = null, this.focusData = null, this.outgoing = null, this.incoming = null;
2249
2254
  }
2250
2255
  }
2251
- const ye = 50, ve = 0.5, we = 20, xe = 0.3, Ee = 150, Se = 30, at = class at {
2256
+ const we = 50, xe = 0.5, Se = 20, Ee = 0.3, Ie = 150, Ae = 30, ct = class ct {
2252
2257
  constructor(t, e) {
2253
2258
  this.enabled = !1, this.touchState = null, this.recentTouchTimestamp = 0, this.container = t, this.callbacks = e, this.boundTouchStart = this.handleTouchStart.bind(this), this.boundTouchMove = this.handleTouchMove.bind(this), this.boundTouchEnd = this.handleTouchEnd.bind(this), this.boundTouchCancel = this.handleTouchCancel.bind(this);
2254
2259
  }
@@ -2275,7 +2280,7 @@ const ye = 50, ve = 0.5, we = 20, xe = 0.3, Ee = 150, Se = 30, at = class at {
2275
2280
  * Used to prevent click-outside from unfocusing immediately after touch
2276
2281
  */
2277
2282
  hadRecentTouch() {
2278
- return Date.now() - this.recentTouchTimestamp < at.TOUCH_CLICK_DELAY;
2283
+ return Date.now() - this.recentTouchTimestamp < ct.TOUCH_CLICK_DELAY;
2279
2284
  }
2280
2285
  handleTouchStart(t) {
2281
2286
  if (t.touches.length !== 1) return;
@@ -2292,472 +2297,532 @@ const ye = 50, ve = 0.5, we = 20, xe = 0.3, Ee = 150, Se = 30, at = class at {
2292
2297
  }
2293
2298
  handleTouchMove(t) {
2294
2299
  if (!this.touchState || t.touches.length !== 1) return;
2295
- const e = t.touches[0], i = e.clientX - this.touchState.startX, o = e.clientY - this.touchState.startY;
2296
- if (this.touchState.isHorizontalSwipe === null && Math.sqrt(i * i + o * o) > 10) {
2297
- const a = Math.atan2(Math.abs(o), Math.abs(i)) * (180 / Math.PI);
2298
- this.touchState.isHorizontalSwipe = a <= Se;
2300
+ const e = t.touches[0], i = e.clientX - this.touchState.startX, n = e.clientY - this.touchState.startY;
2301
+ if (this.touchState.isHorizontalSwipe === null && Math.sqrt(i * i + n * n) > 10) {
2302
+ const a = Math.atan2(Math.abs(n), Math.abs(i)) * (180 / Math.PI);
2303
+ this.touchState.isHorizontalSwipe = a <= Ae;
2299
2304
  }
2300
2305
  if (this.touchState.isHorizontalSwipe !== !1 && this.touchState.isHorizontalSwipe === !0) {
2301
2306
  t.preventDefault(), this.touchState.isDragging = !0, this.touchState.currentX = e.clientX;
2302
- const s = i * xe;
2307
+ const s = i * Ee;
2303
2308
  this.callbacks.onDragOffset(s);
2304
2309
  }
2305
2310
  }
2306
2311
  handleTouchEnd(t) {
2307
2312
  if (!this.touchState) return;
2308
2313
  this.recentTouchTimestamp = Date.now();
2309
- const e = this.touchState.currentX - this.touchState.startX, i = performance.now() - this.touchState.startTime, o = Math.abs(e) / i, s = Math.abs(e);
2314
+ const e = this.touchState.currentX - this.touchState.startX, i = performance.now() - this.touchState.startTime, n = Math.abs(e) / i, s = Math.abs(e);
2310
2315
  let r = !1;
2311
- this.touchState.isHorizontalSwipe === !0 && this.touchState.isDragging && (s >= ye || o >= ve && s >= we) && (r = !0, e < 0 ? this.callbacks.onNext() : this.callbacks.onPrev()), this.touchState.isDragging && this.callbacks.onDragEnd(r), this.touchState = null;
2316
+ this.touchState.isHorizontalSwipe === !0 && this.touchState.isDragging && (s >= we || n >= xe && s >= Se) && (r = !0, e < 0 ? this.callbacks.onNext() : this.callbacks.onPrev()), this.touchState.isDragging && this.callbacks.onDragEnd(r), this.touchState = null;
2312
2317
  }
2313
2318
  handleTouchCancel(t) {
2314
2319
  this.touchState?.isDragging && this.callbacks.onDragEnd(!1), this.touchState = null;
2315
2320
  }
2316
2321
  };
2317
- at.TOUCH_CLICK_DELAY = 300;
2318
- let mt = at;
2319
- class Ie {
2320
- constructor(t) {
2321
- if (this._prepared = !1, this._discoveredUrls = [], this.apiKey = t.apiKey ?? "", this.apiEndpoint = t.apiEndpoint ?? "https://www.googleapis.com/drive/v3/files", this.debugLogging = t.debugLogging ?? !1, this.sources = t.sources ?? [], !this.sources || this.sources.length === 0)
2322
- throw new Error("GoogleDriveLoader requires at least one source to be configured");
2323
- }
2322
+ ct.TOUCH_CLICK_DELAY = 300;
2323
+ let bt = ct;
2324
+ class Te {
2324
2325
  /**
2325
- * Prepare the loader by discovering all images from configured sources
2326
- * @param filter - Filter to apply to discovered images
2326
+ * Create a new ImageFilter
2327
+ * @param extensions - Array of allowed file extensions (without dots)
2328
+ * Defaults to common image formats if not provided
2327
2329
  */
2328
- async prepare(t) {
2329
- this._discoveredUrls = [];
2330
- for (const e of this.sources)
2331
- if ("folders" in e)
2332
- for (const i of e.folders) {
2333
- const o = e.recursive !== void 0 ? e.recursive : !0, s = await this.loadFromFolder(i, t, o);
2334
- this._discoveredUrls.push(...s);
2335
- }
2336
- else if ("files" in e) {
2337
- const i = await this.loadFiles(e.files, t);
2338
- this._discoveredUrls.push(...i);
2339
- }
2340
- this._prepared = !0;
2330
+ constructor(t) {
2331
+ this.allowedExtensions = t || [
2332
+ "jpg",
2333
+ "jpeg",
2334
+ "png",
2335
+ "gif",
2336
+ "webp",
2337
+ "bmp"
2338
+ ];
2341
2339
  }
2342
2340
  /**
2343
- * Get the number of discovered images
2344
- * @throws Error if called before prepare()
2341
+ * Check if a filename has an allowed extension
2342
+ * @param filename - The filename to check (can include path or query string)
2343
+ * @returns True if the file extension is allowed
2345
2344
  */
2346
- imagesLength() {
2347
- if (!this._prepared)
2348
- throw new Error("GoogleDriveLoader.imagesLength() called before prepare()");
2349
- return this._discoveredUrls.length;
2345
+ isAllowed(t) {
2346
+ const i = t.split("?")[0].split(".").pop()?.toLowerCase();
2347
+ return i ? this.allowedExtensions.includes(i) : !1;
2350
2348
  }
2351
2349
  /**
2352
- * Get the ordered list of image URLs
2353
- * @throws Error if called before prepare()
2350
+ * Get the list of allowed extensions
2351
+ * @returns Array of allowed extensions
2354
2352
  */
2355
- imageURLs() {
2356
- if (!this._prepared)
2357
- throw new Error("GoogleDriveLoader.imageURLs() called before prepare()");
2358
- return [...this._discoveredUrls];
2353
+ getAllowedExtensions() {
2354
+ return [...this.allowedExtensions];
2359
2355
  }
2360
- /**
2361
- * Check if the loader has been prepared
2362
- */
2363
- isPrepared() {
2364
- return this._prepared;
2356
+ // Future expansion methods:
2357
+ // isAllowedSize(sizeBytes: number): boolean
2358
+ // isAllowedDate(date: Date): boolean
2359
+ // isAllowedDimensions(width: number, height: number): boolean
2360
+ }
2361
+ const Ce = `
2362
+ .fbn-ic-gallery {
2363
+ position: relative;
2364
+ width: 100%;
2365
+ height: 100%;
2366
+ overflow: hidden;
2367
+ perspective: 1000px;
2368
+ }
2369
+
2370
+ .fbn-ic-image {
2371
+ position: absolute;
2372
+ cursor: pointer;
2373
+ transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1),
2374
+ box-shadow 0.6s cubic-bezier(0.4, 0, 0.2, 1),
2375
+ filter 0.3s cubic-bezier(0.4, 0, 0.2, 1),
2376
+ opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1),
2377
+ border 0.3s cubic-bezier(0.4, 0, 0.2, 1),
2378
+ outline 0.3s cubic-bezier(0.4, 0, 0.2, 1),
2379
+ z-index 0s 0.6s;
2380
+ will-change: transform;
2381
+ user-select: none;
2382
+ backface-visibility: hidden;
2383
+ -webkit-backface-visibility: hidden;
2384
+ }
2385
+
2386
+ .fbn-ic-image.fbn-ic-focused {
2387
+ z-index: 1000;
2388
+ transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1),
2389
+ box-shadow 0.6s cubic-bezier(0.4, 0, 0.2, 1),
2390
+ filter 0.3s cubic-bezier(0.4, 0, 0.2, 1),
2391
+ opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1),
2392
+ border 0.3s cubic-bezier(0.4, 0, 0.2, 1),
2393
+ outline 0.3s cubic-bezier(0.4, 0, 0.2, 1),
2394
+ z-index 0s 0s;
2395
+ will-change: auto;
2396
+ }
2397
+
2398
+ .fbn-ic-counter {
2399
+ position: fixed;
2400
+ bottom: 24px;
2401
+ left: 50%;
2402
+ transform: translateX(-50%);
2403
+ z-index: 10001;
2404
+ pointer-events: none;
2405
+ }
2406
+
2407
+ .fbn-ic-hidden {
2408
+ display: none !important;
2409
+ }
2410
+ `;
2411
+ function Re() {
2412
+ if (typeof document > "u") return;
2413
+ const o = "fbn-ic-functional-styles";
2414
+ if (document.getElementById(o)) return;
2415
+ const t = document.createElement("style");
2416
+ t.id = o, t.textContent = Ce, document.head.appendChild(t);
2417
+ }
2418
+ class Le {
2419
+ constructor(t = {}) {
2420
+ this.fullConfig = Gt(t), t.container instanceof HTMLElement ? (this.containerRef = t.container, this.containerId = null) : (this.containerRef = null, this.containerId = t.container || "imageCloud"), this.imagesLoaded = !1, this.imageElements = [], this.imageLayouts = [], this.currentImageHeight = 225, this.currentFocusIndex = null, this.hoveredImage = null, this.resizeTimeout = null, this.displayQueue = [], this.queueInterval = null, this.loadGeneration = 0, this.loadingElAutoCreated = !1, this.errorElAutoCreated = !1, this.counterEl = null, this.counterElAutoCreated = !1, this.animationEngine = new Xt(this.fullConfig.animation), this.layoutEngine = new fe({
2421
+ layout: this.fullConfig.layout,
2422
+ image: this.fullConfig.image
2423
+ }), this.zoomEngine = new ve(this.fullConfig.interaction.focus, this.animationEngine, this.fullConfig.styling), this.defaultStyles = rt(this.fullConfig.styling?.default), this.hoverStyles = rt(this.fullConfig.styling?.hover), this.defaultClassName = this.fullConfig.styling?.default?.className, this.hoverClassName = this.fullConfig.styling?.hover?.className;
2424
+ const e = this.fullConfig.animation.entry || y.animation.entry;
2425
+ this.entryAnimationEngine = new oe(
2426
+ e,
2427
+ this.fullConfig.layout.algorithm
2428
+ ), this.swipeEngine = null, this.imageFilter = this.createImageFilter(), this.containerEl = null, this.loadingEl = null, this.errorEl = null;
2365
2429
  }
2366
2430
  /**
2367
- * Extract folder ID from various Google Drive URL formats
2368
- * @param folderUrl - Google Drive folder URL
2369
- * @returns Folder ID or null if invalid
2431
+ * Create image filter based on shared loader config
2370
2432
  */
2371
- extractFolderId(t) {
2372
- const e = [
2373
- /\/folders\/([a-zA-Z0-9_-]+)/,
2374
- // Standard format
2375
- /id=([a-zA-Z0-9_-]+)/
2376
- // Alternative format
2377
- ];
2378
- for (const i of e) {
2379
- const o = t.match(i);
2380
- if (o && o[1])
2381
- return o[1];
2382
- }
2383
- return null;
2433
+ createImageFilter() {
2434
+ const t = this.fullConfig.config.loaders?.allowedExtensions;
2435
+ return new Te(t);
2384
2436
  }
2385
2437
  /**
2386
- * Load images from a Google Drive folder
2387
- * @param folderUrl - Google Drive folder URL
2388
- * @param filter - Filter to apply to discovered images
2389
- * @param recursive - Whether to include images from subfolders
2390
- * @returns Promise resolving to array of image URLs
2438
+ * Create appropriate image loader based on config
2439
+ * Processes loaders array, merges shared config, wraps in CompositeLoader if needed
2440
+ * Uses dynamic imports to trigger loader registration and enable tree-shaking
2391
2441
  */
2392
- async loadFromFolder(t, e, i = !0) {
2393
- const o = this.extractFolderId(t);
2394
- if (!o)
2395
- throw new Error("Invalid Google Drive folder URL. Please check the URL format.");
2396
- if (!this.apiKey || this.apiKey === "YOUR_API_KEY_HERE")
2397
- return this.loadImagesDirectly(o, e);
2398
- try {
2399
- return i ? await this.loadImagesRecursively(o, e) : await this.loadImagesFromSingleFolder(o, e);
2400
- } catch (s) {
2401
- return console.error("Error loading from Google Drive API:", s), this.loadImagesDirectly(o, e);
2402
- }
2442
+ async createLoader() {
2443
+ const t = this.fullConfig.loaders, e = this.fullConfig.config.loaders ?? {};
2444
+ if (!t || t.length === 0)
2445
+ throw new Error("No loaders configured. Provide `images`, `loaders`, or both.");
2446
+ const i = await Promise.all(
2447
+ t.map((s) => this.createLoaderFromEntry(s, e))
2448
+ );
2449
+ if (i.length === 1)
2450
+ return i[0];
2451
+ await import("@frybynite/image-cloud/loaders/composite");
2452
+ const n = et.getLoader("composite");
2453
+ return new n({
2454
+ loaders: i,
2455
+ debugLogging: this.fullConfig.config.debug?.loaders
2456
+ });
2403
2457
  }
2404
2458
  /**
2405
- * Load images from a single folder (non-recursive)
2406
- * @param folderId - Google Drive folder ID
2407
- * @param filter - Filter to apply to discovered images
2408
- * @returns Promise resolving to array of image URLs
2459
+ * Create a single loader from a LoaderEntry, merging shared config
2460
+ * Uses dynamic imports to trigger loader registration and enable tree-shaking
2409
2461
  */
2410
- async loadImagesFromSingleFolder(t, e) {
2411
- const i = [], o = `'${t}' in parents and trashed=false`, r = `${this.apiEndpoint}?q=${encodeURIComponent(o)}&fields=files(id,name,mimeType,thumbnailLink)&key=${this.apiKey}`, a = await fetch(r);
2412
- if (!a.ok)
2413
- throw new Error(`API request failed: ${a.status} ${a.statusText}`);
2414
- const c = (await a.json()).files.filter(
2415
- (u) => u.mimeType.startsWith("image/") && e.isAllowed(u.name)
2416
- );
2417
- return this.log(`Found ${c.length} images in folder ${t} (non-recursive)`), c.forEach((u) => {
2418
- i.push(`https://lh3.googleusercontent.com/d/${u.id}=s1600`), this.log(`Added file: ${u.name}`);
2419
- }), i;
2462
+ async createLoaderFromEntry(t, e) {
2463
+ if ("static" in t) {
2464
+ await import("@frybynite/image-cloud/loaders/static");
2465
+ const i = et.getLoader("static"), n = t.static, s = {
2466
+ ...n,
2467
+ validateUrls: n.validateUrls ?? e.validateUrls,
2468
+ validationTimeout: n.validationTimeout ?? e.validationTimeout,
2469
+ validationMethod: n.validationMethod ?? e.validationMethod,
2470
+ allowedExtensions: n.allowedExtensions ?? e.allowedExtensions,
2471
+ debugLogging: n.debugLogging ?? this.fullConfig.config.debug?.loaders
2472
+ };
2473
+ return new i(s);
2474
+ } else if ("googleDrive" in t) {
2475
+ await import("@frybynite/image-cloud/loaders/google-drive");
2476
+ const i = et.getLoader("google-drive"), n = t.googleDrive, s = {
2477
+ ...n,
2478
+ allowedExtensions: n.allowedExtensions ?? e.allowedExtensions,
2479
+ debugLogging: n.debugLogging ?? this.fullConfig.config.debug?.loaders
2480
+ };
2481
+ return new i(s);
2482
+ } else
2483
+ throw new Error(`Unknown loader entry: ${JSON.stringify(t)}`);
2420
2484
  }
2421
2485
  /**
2422
- * Load specific files by their URLs or IDs
2423
- * @param fileUrls - Array of Google Drive file URLs or IDs
2424
- * @param filter - Filter to apply to discovered images
2425
- * @returns Promise resolving to array of image URLs
2486
+ * Initialize the gallery
2426
2487
  */
2427
- async loadFiles(t, e) {
2428
- const i = [];
2429
- for (const o of t) {
2430
- const s = this.extractFileId(o);
2431
- if (!s) {
2432
- this.log(`Skipping invalid file URL: ${o}`);
2433
- continue;
2434
- }
2435
- if (this.apiKey && this.apiKey !== "YOUR_API_KEY_HERE")
2436
- try {
2437
- const r = `${this.apiEndpoint}/${s}?fields=name,mimeType&key=${this.apiKey}`, a = await fetch(r);
2438
- if (a.ok) {
2439
- const h = await a.json();
2440
- h.mimeType.startsWith("image/") && e.isAllowed(h.name) ? (i.push(`https://lh3.googleusercontent.com/d/${s}=s1600`), this.log(`Added file: ${h.name}`)) : this.log(`Skipping non-image file: ${h.name} (${h.mimeType})`);
2441
- } else
2442
- this.log(`Failed to fetch metadata for file ${s}: ${a.status}`);
2443
- } catch (r) {
2444
- this.log(`Error fetching metadata for file ${s}:`, r);
2488
+ async init() {
2489
+ try {
2490
+ if (Re(), this.containerRef)
2491
+ this.containerEl = this.containerRef;
2492
+ else if (this.containerEl = document.getElementById(this.containerId), !this.containerEl)
2493
+ throw new Error(`Container #${this.containerId} not found`);
2494
+ this.containerEl.classList.add("fbn-ic-gallery"), this.swipeEngine = new bt(this.containerEl, {
2495
+ onNext: () => this.navigateToNextImage(),
2496
+ onPrev: () => this.navigateToPreviousImage(),
2497
+ onDragOffset: (t) => this.zoomEngine.setDragOffset(t),
2498
+ onDragEnd: (t) => {
2499
+ t ? this.zoomEngine.clearDragOffset(!1) : this.zoomEngine.clearDragOffset(!0, Ie);
2445
2500
  }
2446
- else
2447
- i.push(`https://lh3.googleusercontent.com/d/${s}=s1600`);
2501
+ }), this.setupUI(), this.setupEventListeners(), this.imageLoader = await this.createLoader(), this.logDebug("ImageCloud initialized"), await this.loadImages();
2502
+ } catch (t) {
2503
+ console.error("Gallery initialization failed:", t), this.errorEl && t instanceof Error && this.showError("Gallery failed to initialize: " + t.message);
2448
2504
  }
2449
- return i;
2450
2505
  }
2451
- /**
2452
- * Extract file ID from Google Drive file URL
2453
- * @param fileUrl - Google Drive file URL or file ID
2454
- * @returns File ID or null if invalid
2455
- */
2456
- extractFileId(t) {
2457
- if (!/[/:.]/.test(t))
2458
- return t;
2459
- const e = [
2460
- /\/file\/d\/([a-zA-Z0-9_-]+)/,
2461
- // Standard file format
2462
- /\/open\?id=([a-zA-Z0-9_-]+)/,
2463
- // Alternative format
2464
- /id=([a-zA-Z0-9_-]+)/
2465
- // Generic id parameter
2466
- ];
2467
- for (const i of e) {
2468
- const o = t.match(i);
2469
- if (o && o[1])
2470
- return o[1];
2471
- }
2472
- return null;
2473
- }
2474
- /**
2475
- * Recursively load images from a folder and all its subfolders
2476
- * @param folderId - Google Drive folder ID
2477
- * @param filter - Filter to apply to discovered images
2478
- * @returns Promise resolving to array of image URLs
2479
- */
2480
- async loadImagesRecursively(t, e) {
2481
- const i = [], o = `'${t}' in parents and trashed=false`, r = `${this.apiEndpoint}?q=${encodeURIComponent(o)}&fields=files(id,name,mimeType,thumbnailLink)&key=${this.apiKey}`, a = await fetch(r);
2482
- if (!a.ok)
2483
- throw new Error(`API request failed: ${a.status} ${a.statusText}`);
2484
- const h = await a.json(), c = h.files.filter(
2485
- (l) => l.mimeType.startsWith("image/") && e.isAllowed(l.name)
2486
- ), u = h.files.filter(
2487
- (l) => l.mimeType === "application/vnd.google-apps.folder"
2488
- );
2489
- this.log(`Found ${h.files.length} total items in folder ${t}`), h.files.forEach((l) => this.log(` - File: ${l.name} (${l.mimeType})`)), this.log(`- ${c.length} valid files (images only)`), this.log(`- ${u.length} subfolders`), c.forEach((l) => {
2490
- i.push(`https://lh3.googleusercontent.com/d/${l.id}=s1600`), this.log(`Added file: ${l.name}`);
2491
- });
2492
- for (const l of u) {
2493
- this.log(`Loading images from subfolder: ${l.name}`);
2494
- const d = await this.loadImagesRecursively(l.id, e);
2495
- i.push(...d);
2496
- }
2497
- return i;
2506
+ setupUI() {
2507
+ const t = this.fullConfig.rendering.ui;
2508
+ t.showLoadingSpinner && (t.loadingElement ? (this.loadingEl = this.resolveElement(t.loadingElement), this.loadingElAutoCreated = !1) : (this.loadingEl = this.createDefaultLoadingElement(), this.loadingElAutoCreated = !0)), t.errorElement ? (this.errorEl = this.resolveElement(t.errorElement), this.errorElAutoCreated = !1) : (this.errorEl = this.createDefaultErrorElement(), this.errorElAutoCreated = !0), t.showImageCounter && (t.counterElement ? (this.counterEl = this.resolveElement(t.counterElement), this.counterElAutoCreated = !1) : (this.counterEl = this.createDefaultCounterElement(), this.counterElAutoCreated = !0));
2498
2509
  }
2499
- /**
2500
- * Direct loading method (no API key required, but less reliable)
2501
- * Uses embedded folder view to scrape image IDs
2502
- * @param folderId - Google Drive folder ID
2503
- * @param filter - Filter to apply (not used in fallback mode)
2504
- * @returns Promise resolving to array of image URLs
2505
- */
2506
- async loadImagesDirectly(t, e) {
2507
- try {
2508
- const i = `https://drive.google.com/embeddedfolderview?id=${t}`, o = await fetch(i, { mode: "cors" });
2509
- if (!o.ok)
2510
- throw new Error("Cannot access folder directly (CORS or permissions issue)");
2511
- const s = await o.text(), r = /\/file\/d\/([a-zA-Z0-9_-]+)/g, a = [...s.matchAll(r)];
2512
- return [...new Set(a.map((u) => u[1]))].map(
2513
- (u) => `https://drive.google.com/uc?export=view&id=${u}`
2514
- );
2515
- } catch (i) {
2516
- throw console.error("Direct loading failed:", i), new Error(
2517
- `Unable to load images. Please ensure:
2518
- 1. The folder is shared publicly (Anyone with the link can view)
2519
- 2. The folder contains image files
2520
- 3. Consider adding a Google Drive API key in config.js for better reliability`
2521
- );
2522
- }
2510
+ resolveElement(t) {
2511
+ return t instanceof HTMLElement ? t : document.getElementById(t);
2523
2512
  }
2524
- /**
2525
- * Manually add image URLs (for testing or when auto-loading fails)
2526
- * @param imageIds - Array of Google Drive file IDs
2527
- * @returns Array of direct image URLs
2528
- */
2529
- manualImageUrls(t) {
2530
- return t.map((e) => `https://drive.google.com/uc?export=view&id=${e}`);
2513
+ createDefaultLoadingElement() {
2514
+ const t = document.createElement("div");
2515
+ t.className = "fbn-ic-loading fbn-ic-hidden";
2516
+ const e = document.createElement("div");
2517
+ e.className = "fbn-ic-spinner", t.appendChild(e);
2518
+ const i = document.createElement("p");
2519
+ return i.textContent = "Loading images...", t.appendChild(i), this.containerEl.appendChild(t), t;
2531
2520
  }
2532
- /**
2533
- * Debug logging helper
2534
- * @param args - Arguments to log
2535
- */
2536
- log(...t) {
2537
- this.debugLogging && typeof console < "u" && console.log(...t);
2521
+ createDefaultErrorElement() {
2522
+ const t = document.createElement("div");
2523
+ return t.className = "fbn-ic-error fbn-ic-hidden", this.containerEl.appendChild(t), t;
2538
2524
  }
2539
- }
2540
- class Te {
2541
- constructor(t) {
2542
- if (this._prepared = !1, this._discoveredUrls = [], this.validateUrls = t.validateUrls !== !1, this.validationTimeout = t.validationTimeout ?? 5e3, this.validationMethod = t.validationMethod ?? "head", this.debugLogging = t.debugLogging ?? !1, this.sources = t.sources ?? [], !this.sources || this.sources.length === 0)
2543
- throw new Error("StaticImageLoader requires at least one source to be configured");
2544
- this.log("StaticImageLoader initialized with config:", t);
2525
+ createDefaultCounterElement() {
2526
+ const t = document.createElement("div");
2527
+ return t.className = "fbn-ic-counter fbn-ic-hidden", this.containerEl.appendChild(t), t;
2545
2528
  }
2546
- /**
2547
- * Prepare the loader by discovering all images from configured sources
2548
- * @param filter - Filter to apply to discovered images
2549
- */
2550
- async prepare(t) {
2551
- this._discoveredUrls = [], this.log(`Processing ${this.sources.length} source(s)`);
2552
- for (const e of this.sources)
2553
- try {
2554
- const i = await this.processSource(e, t);
2555
- this._discoveredUrls.push(...i);
2556
- } catch (i) {
2557
- console.warn("Failed to process source:", e, i);
2558
- }
2559
- this._prepared = !0, this.log(`Successfully loaded ${this._discoveredUrls.length} image(s)`);
2529
+ setupEventListeners() {
2530
+ document.addEventListener("keydown", (t) => {
2531
+ t.key === "Escape" ? (this.zoomEngine.unfocusImage(), this.currentFocusIndex = null, this.swipeEngine?.disable(), this.hideCounter()) : t.key === "ArrowRight" ? this.navigateToNextImage() : t.key === "ArrowLeft" ? this.navigateToPreviousImage() : (t.key === "Enter" || t.key === " ") && this.hoveredImage && (this.handleImageClick(this.hoveredImage.element, this.hoveredImage.layout), t.preventDefault());
2532
+ }), document.addEventListener("click", (t) => {
2533
+ this.swipeEngine?.hadRecentTouch() || t.target.closest(".fbn-ic-image") || (this.zoomEngine.unfocusImage(), this.currentFocusIndex = null, this.swipeEngine?.disable(), this.hideCounter());
2534
+ }), window.addEventListener("resize", () => this.handleResize());
2560
2535
  }
2561
2536
  /**
2562
- * Get the number of discovered images
2563
- * @throws Error if called before prepare()
2537
+ * Navigate to the next image (Right arrow)
2564
2538
  */
2565
- imagesLength() {
2566
- if (!this._prepared)
2567
- throw new Error("StaticImageLoader.imagesLength() called before prepare()");
2568
- return this._discoveredUrls.length;
2539
+ navigateToNextImage() {
2540
+ if (this.currentFocusIndex === null || this.imageElements.length === 0) return;
2541
+ const t = (this.currentFocusIndex + 1) % this.imageLayouts.length, e = this.imageElements.find(
2542
+ (n) => n.dataset.imageId === String(t)
2543
+ );
2544
+ if (!e) return;
2545
+ const i = this.imageLayouts[t];
2546
+ i && (this.currentFocusIndex = t, this.handleImageClick(e, i), this.updateCounter(t));
2569
2547
  }
2570
2548
  /**
2571
- * Get the ordered list of image URLs
2572
- * @throws Error if called before prepare()
2549
+ * Navigate to the previous image (Left arrow)
2573
2550
  */
2574
- imageURLs() {
2575
- if (!this._prepared)
2576
- throw new Error("StaticImageLoader.imageURLs() called before prepare()");
2577
- return [...this._discoveredUrls];
2551
+ navigateToPreviousImage() {
2552
+ if (this.currentFocusIndex === null || this.imageElements.length === 0) return;
2553
+ const t = (this.currentFocusIndex - 1 + this.imageLayouts.length) % this.imageLayouts.length, e = this.imageElements.find(
2554
+ (n) => n.dataset.imageId === String(t)
2555
+ );
2556
+ if (!e) return;
2557
+ const i = this.imageLayouts[t];
2558
+ i && (this.currentFocusIndex = t, this.handleImageClick(e, i), this.updateCounter(t));
2578
2559
  }
2579
2560
  /**
2580
- * Check if the loader has been prepared
2561
+ * Navigate to a specific image by index
2581
2562
  */
2582
- isPrepared() {
2583
- return this._prepared;
2563
+ handleResize() {
2564
+ this.imagesLoaded && (this.resizeTimeout !== null && clearTimeout(this.resizeTimeout), this.resizeTimeout = window.setTimeout(() => {
2565
+ const t = this.getImageHeight();
2566
+ t !== this.currentImageHeight ? (this.logDebug(`Window resized to new breakpoint (height: ${t}px). Reloading images...`), this.loadImages()) : this.logDebug("Window resized (no breakpoint change)");
2567
+ }, 500));
2584
2568
  }
2585
- /**
2586
- * Process a single source object using shape-based detection
2587
- * @param source - Source configuration detected by key presence
2588
- * @param filter - Filter to apply to discovered images
2589
- * @returns Promise resolving to array of valid URLs from this source
2590
- */
2591
- async processSource(t, e) {
2592
- return t ? "urls" in t ? await this.processUrls(t.urls, e) : "path" in t ? await this.processPath(t.path, t.files, e) : "json" in t ? await this.processJson(t.json, e) : (console.warn("Unknown source shape:", t), []) : (console.warn("Invalid source object:", t), []);
2569
+ getImageHeight() {
2570
+ const t = window.innerWidth, e = this.fullConfig.layout.responsive, n = this.fullConfig.image.sizing?.maxSize ?? 400;
2571
+ return e ? t <= e.mobile.maxWidth ? Math.min(100, n) : t <= e.tablet.maxWidth ? Math.min(180, n) : Math.min(225, n) : t <= 767 ? Math.min(100, n) : t <= 1199 ? Math.min(180, n) : Math.min(225, n);
2593
2572
  }
2594
2573
  /**
2595
- * Process a list of direct URLs
2596
- * @param urls - Array of image URLs
2597
- * @param filter - Filter to apply to discovered images
2598
- * @returns Promise resolving to array of validated URLs
2574
+ * Get container bounds for layout calculations
2599
2575
  */
2600
- async processUrls(t, e) {
2601
- if (!Array.isArray(t))
2602
- return console.warn("URLs must be an array:", t), [];
2603
- const i = [];
2604
- for (const o of t) {
2605
- const s = o.split("/").pop() || o;
2606
- if (!e.isAllowed(s)) {
2607
- this.log(`Skipping filtered URL: ${o}`);
2608
- continue;
2609
- }
2610
- this.validateUrls ? await this.validateUrl(o) ? i.push(o) : console.warn(`Skipping invalid/missing URL: ${o}`) : i.push(o);
2611
- }
2612
- return i;
2576
+ getContainerBounds() {
2577
+ return this.containerEl ? {
2578
+ width: this.containerEl.offsetWidth,
2579
+ height: this.containerEl.offsetHeight || window.innerHeight * 0.7
2580
+ } : { width: window.innerWidth, height: window.innerHeight * 0.7 };
2613
2581
  }
2614
2582
  /**
2615
- * Process a path-based source
2616
- * @param basePath - Base path (relative or absolute)
2617
- * @param files - Array of filenames
2618
- * @param filter - Filter to apply to discovered images
2619
- * @returns Promise resolving to array of validated URLs
2583
+ * Load images using the unified loader interface
2620
2584
  */
2621
- async processPath(t, e, i) {
2622
- if (!Array.isArray(e))
2623
- return console.warn("files must be an array:", e), [];
2624
- const o = [];
2625
- for (const s of e) {
2626
- if (!i.isAllowed(s)) {
2627
- this.log(`Skipping filtered file: ${s}`);
2628
- continue;
2585
+ async loadImages() {
2586
+ try {
2587
+ this.showLoading(!0), this.hideError(), this.clearImageCloud(), await this.imageLoader.prepare(this.imageFilter);
2588
+ const t = this.imageLoader.imagesLength();
2589
+ let e = this.imageLoader.imageURLs();
2590
+ if (t === 0) {
2591
+ this.showError("No images found."), this.showLoading(!1);
2592
+ return;
2629
2593
  }
2630
- const r = this.constructUrl(t, s);
2631
- this.validateUrls ? await this.validateUrl(r) ? o.push(r) : console.warn(`Skipping invalid/missing file: ${r}`) : o.push(r);
2594
+ const i = this.getContainerBounds(), n = this.getImageHeight(), s = window.innerWidth;
2595
+ this.logDebug(`Adaptive sizing input: container=${i.width}x${i.height}px, images=${t}, responsiveMax=${n}px`);
2596
+ const r = this.layoutEngine.calculateAdaptiveSize(
2597
+ i,
2598
+ t,
2599
+ n,
2600
+ s
2601
+ );
2602
+ this.logDebug(`Adaptive sizing result: height=${r.height}px`), await this.createImageCloud(e, r.height), this.showLoading(!1), this.imagesLoaded = !0;
2603
+ } catch (t) {
2604
+ console.error("Error loading images:", t), t instanceof Error && this.showError(t.message || "Failed to load images."), this.showLoading(!1);
2632
2605
  }
2633
- return o;
2634
2606
  }
2635
2607
  /**
2636
- * Process a JSON endpoint source
2637
- * Fetches a JSON endpoint that returns { images: string[] }
2638
- * @param url - JSON endpoint URL
2639
- * @param filter - Filter to apply to discovered images
2640
- * @returns Promise resolving to array of validated URLs
2608
+ * Helper for debug logging
2641
2609
  */
2642
- async processJson(t, e) {
2643
- this.log(`Fetching JSON endpoint: ${t}`);
2644
- const i = new AbortController(), o = setTimeout(() => i.abort(), 1e4);
2645
- try {
2646
- const s = await fetch(t, { signal: i.signal });
2647
- if (clearTimeout(o), !s.ok)
2648
- throw new Error(`HTTP ${s.status} fetching ${t}`);
2649
- const r = await s.json();
2650
- if (!r || !Array.isArray(r.images))
2651
- throw new Error('JSON source must return JSON with shape { "images": ["url1", "url2", ...] }');
2652
- return this.log(`JSON endpoint returned ${r.images.length} image(s)`), await this.processUrls(r.images, e);
2653
- } catch (s) {
2654
- throw clearTimeout(o), s instanceof Error && s.name === "AbortError" ? new Error(`Timeout fetching JSON endpoint: ${t}`) : s;
2655
- }
2610
+ logDebug(...t) {
2611
+ this.fullConfig.config.debug?.enabled && typeof console < "u" && console.log(...t);
2656
2612
  }
2657
- /**
2658
- * Validate a single URL using HEAD request
2659
- * @param url - URL to validate
2660
- * @returns Promise resolving to true if valid and accessible
2661
- */
2662
- async validateUrl(t) {
2663
- if (this.validationMethod === "none")
2664
- return !0;
2665
- if (this.validationMethod === "simple")
2666
- try {
2667
- return typeof window < "u" ? new URL(t, window.location.origin) : new URL(t), !0;
2668
- } catch {
2669
- return !1;
2670
- }
2671
- if (typeof window > "u")
2672
- return !0;
2673
- if (!(t.startsWith(window.location.origin) || t.startsWith("/")))
2674
- return this.log(`Skipping validation for cross-origin URL: ${t}`), !0;
2675
- try {
2676
- const i = new AbortController(), o = setTimeout(() => i.abort(), this.validationTimeout), s = await fetch(t, {
2677
- method: "HEAD",
2678
- signal: i.signal
2679
- });
2680
- return clearTimeout(o), s.ok ? !0 : (this.log(`Validation failed for ${t}: HTTP ${s.status}`), !1);
2681
- } catch (i) {
2682
- return i instanceof Error && (i.name === "AbortError" ? this.log(`Validation timeout for ${t}`) : this.log(`Validation failed for ${t}:`, i.message)), !1;
2613
+ async createImageCloud(t, e) {
2614
+ if (!this.containerEl) return;
2615
+ const i = this.getContainerBounds();
2616
+ this.currentImageHeight = e;
2617
+ const n = this.loadGeneration, s = this.layoutEngine.generateLayout(t.length, i, { fixedHeight: e });
2618
+ this.imageLayouts = s, this.displayQueue = [];
2619
+ let r = 0;
2620
+ const a = (c) => {
2621
+ this.containerEl && (this.containerEl.appendChild(c), this.imageElements.push(c), requestAnimationFrame(() => {
2622
+ if (c.offsetWidth, c.style.opacity = this.defaultStyles.opacity ?? "1", c.dataset.startX && (this.entryAnimationEngine.requiresJSAnimation() || this.entryAnimationEngine.requiresJSRotation() || this.entryAnimationEngine.requiresJSScale() || c.dataset.startRotation !== c.dataset.rotation || c.dataset.startScale !== c.dataset.scale)) {
2623
+ const d = {
2624
+ x: parseFloat(c.dataset.startX),
2625
+ y: parseFloat(c.dataset.startY)
2626
+ }, m = {
2627
+ x: parseFloat(c.dataset.endX),
2628
+ y: parseFloat(c.dataset.endY)
2629
+ }, b = parseFloat(c.dataset.imageWidth), p = parseFloat(c.dataset.imageHeight), g = parseFloat(c.dataset.rotation), f = parseFloat(c.dataset.scale), S = c.dataset.startRotation ? parseFloat(c.dataset.startRotation) : g, v = c.dataset.startScale ? parseFloat(c.dataset.startScale) : f, w = this.entryAnimationEngine.getTiming();
2630
+ ee({
2631
+ element: c,
2632
+ startPosition: d,
2633
+ endPosition: m,
2634
+ pathConfig: this.entryAnimationEngine.getPathConfig(),
2635
+ duration: w.duration,
2636
+ imageWidth: b,
2637
+ imageHeight: p,
2638
+ rotation: g,
2639
+ scale: f,
2640
+ rotationConfig: this.entryAnimationEngine.getRotationConfig(),
2641
+ startRotation: S,
2642
+ scaleConfig: this.entryAnimationEngine.getScaleConfig(),
2643
+ startScale: v
2644
+ });
2645
+ } else {
2646
+ const d = c.dataset.finalTransform || "";
2647
+ c.style.transform = d;
2648
+ }
2649
+ const l = parseInt(c.dataset.imageId || "0");
2650
+ if (this.fullConfig.config.debug?.enabled && l < 3) {
2651
+ const d = c.dataset.finalTransform || "";
2652
+ console.log(`Image ${l} final state:`, {
2653
+ left: c.style.left,
2654
+ top: c.style.top,
2655
+ width: c.style.width,
2656
+ height: c.style.height,
2657
+ computedWidth: c.offsetWidth,
2658
+ computedHeight: c.offsetHeight,
2659
+ transform: d,
2660
+ pathType: this.entryAnimationEngine.getPathType()
2661
+ });
2662
+ }
2663
+ }), r++);
2664
+ }, h = () => {
2665
+ if (this.logDebug("Starting queue processing, enabled:", this.fullConfig.animation.queue.enabled), !this.fullConfig.animation.queue.enabled) {
2666
+ for (; this.displayQueue.length > 0; ) {
2667
+ const c = this.displayQueue.shift();
2668
+ c && a(c);
2669
+ }
2670
+ return;
2671
+ }
2672
+ this.queueInterval !== null && clearInterval(this.queueInterval), this.queueInterval = window.setInterval(() => {
2673
+ if (n !== this.loadGeneration) {
2674
+ this.queueInterval !== null && (clearInterval(this.queueInterval), this.queueInterval = null);
2675
+ return;
2676
+ }
2677
+ if (this.displayQueue.length > 0) {
2678
+ const c = this.displayQueue.shift();
2679
+ c && a(c);
2680
+ }
2681
+ r >= t.length && this.displayQueue.length === 0 && this.queueInterval !== null && (clearInterval(this.queueInterval), this.queueInterval = null);
2682
+ }, this.fullConfig.animation.queue.interval);
2683
+ };
2684
+ if ("IntersectionObserver" in window && this.containerEl) {
2685
+ const c = new IntersectionObserver((u) => {
2686
+ u.forEach((l) => {
2687
+ l.isIntersecting && (h(), c.disconnect());
2688
+ });
2689
+ }, { threshold: 0.1, rootMargin: "50px" });
2690
+ c.observe(this.containerEl);
2691
+ } else
2692
+ h();
2693
+ this.fullConfig.config.debug?.centers && this.containerEl && (this.containerEl.querySelectorAll(".fbn-ic-debug-center").forEach((c) => c.remove()), s.forEach((c, u) => {
2694
+ const l = document.createElement("div");
2695
+ l.className = "fbn-ic-debug-center", l.style.position = "absolute", l.style.width = "12px", l.style.height = "12px", l.style.borderRadius = "50%", l.style.backgroundColor = "red", l.style.border = "2px solid yellow", l.style.zIndex = "9999", l.style.pointerEvents = "none";
2696
+ const d = c.x, m = c.y;
2697
+ l.style.left = `${d - 6}px`, l.style.top = `${m - 6}px`, l.title = `Image ${u}: center (${Math.round(d)}, ${Math.round(m)})`, this.containerEl.appendChild(l);
2698
+ })), t.forEach((c, u) => {
2699
+ const l = document.createElement("img");
2700
+ l.referrerPolicy = "no-referrer", l.classList.add("fbn-ic-image"), l.dataset.imageId = String(u);
2701
+ const d = s[u];
2702
+ l.style.position = "absolute", l.style.width = "auto", l.style.height = `${e}px`, l.style.left = `${d.x}px`, l.style.top = `${d.y}px`, d.zIndex && (l.style.zIndex = String(d.zIndex)), it(l, this.defaultStyles), nt(l, this.defaultClassName), l.addEventListener("mouseenter", () => {
2703
+ this.hoveredImage = { element: l, layout: d }, this.zoomEngine.isInvolved(l) || (it(l, this.hoverStyles), nt(l, this.hoverClassName));
2704
+ }), l.addEventListener("mouseleave", () => {
2705
+ this.hoveredImage = null, this.zoomEngine.isInvolved(l) || (it(l, this.defaultStyles), Ft(l, this.hoverClassName), nt(l, this.defaultClassName));
2706
+ }), l.addEventListener("click", (m) => {
2707
+ m.stopPropagation(), this.handleImageClick(l, d);
2708
+ }), l.style.opacity = "0", l.style.transition = this.entryAnimationEngine.getTransitionCSS(), l.onload = () => {
2709
+ if (n !== this.loadGeneration)
2710
+ return;
2711
+ const m = l.naturalWidth / l.naturalHeight, b = e * m;
2712
+ l.style.width = `${b}px`;
2713
+ const p = { x: d.x, y: d.y }, g = { width: b, height: e }, f = this.entryAnimationEngine.calculateStartPosition(
2714
+ p,
2715
+ g,
2716
+ i,
2717
+ u,
2718
+ t.length
2719
+ ), S = this.entryAnimationEngine.calculateStartRotation(d.rotation), v = this.entryAnimationEngine.calculateStartScale(d.scale), w = this.entryAnimationEngine.buildFinalTransform(
2720
+ d.rotation,
2721
+ d.scale,
2722
+ b,
2723
+ e
2724
+ ), E = this.entryAnimationEngine.buildStartTransform(
2725
+ f,
2726
+ p,
2727
+ d.rotation,
2728
+ d.scale,
2729
+ b,
2730
+ e,
2731
+ S,
2732
+ v
2733
+ );
2734
+ this.fullConfig.config.debug?.enabled && u < 3 && console.log(`Image ${u}:`, {
2735
+ finalPosition: p,
2736
+ imageSize: g,
2737
+ left: d.x,
2738
+ top: d.y,
2739
+ finalTransform: w,
2740
+ renderedWidth: b,
2741
+ renderedHeight: e
2742
+ }), l.style.transform = E, l.dataset.finalTransform = w, (this.entryAnimationEngine.requiresJSAnimation() || this.entryAnimationEngine.requiresJSRotation() || this.entryAnimationEngine.requiresJSScale() || S !== d.rotation || v !== d.scale) && (l.dataset.startX = String(f.x), l.dataset.startY = String(f.y), l.dataset.endX = String(p.x), l.dataset.endY = String(p.y), l.dataset.imageWidth = String(b), l.dataset.imageHeight = String(e), l.dataset.rotation = String(d.rotation), l.dataset.scale = String(d.scale), l.dataset.startRotation = String(S), l.dataset.startScale = String(v)), this.displayQueue.push(l);
2743
+ }, l.onerror = () => r++, l.src = c;
2744
+ });
2745
+ }
2746
+ async handleImageClick(t, e) {
2747
+ if (!this.containerEl) return;
2748
+ const i = this.zoomEngine.isFocused(t), n = {
2749
+ width: this.containerEl.offsetWidth,
2750
+ height: this.containerEl.offsetHeight
2751
+ };
2752
+ if (i)
2753
+ await this.zoomEngine.unfocusImage(), this.currentFocusIndex = null, this.swipeEngine?.disable(), this.hideCounter();
2754
+ else {
2755
+ const s = t.dataset.imageId;
2756
+ this.currentFocusIndex = s !== void 0 ? parseInt(s, 10) : null, this.swipeEngine?.enable(), await this.zoomEngine.focusImage(t, n, e), this.currentFocusIndex !== null && this.updateCounter(this.currentFocusIndex);
2683
2757
  }
2684
2758
  }
2685
2759
  /**
2686
- * Construct full URL from basePath and filename
2687
- * @param basePath - Base path (relative or absolute)
2688
- * @param filename - Filename to append
2689
- * @returns Complete URL
2760
+ * Clear the image cloud and reset state
2690
2761
  */
2691
- constructUrl(t, e) {
2692
- const i = t.replace(/\/$/, "");
2693
- if (this.isAbsoluteUrl(t))
2694
- return `${i}/${e}`;
2695
- if (typeof window > "u")
2696
- return `${i}/${e}`;
2697
- const o = window.location.origin, r = (t.startsWith("/") ? t : "/" + t).replace(/\/$/, "");
2698
- return `${o}${r}/${e}`;
2762
+ clearImageCloud() {
2763
+ this.queueInterval !== null && (clearInterval(this.queueInterval), this.queueInterval = null), this.loadGeneration++, this.displayQueue = [], this.containerEl && this.containerEl.querySelectorAll(".fbn-ic-image, .fbn-ic-debug-center").forEach((t) => t.remove()), this.imageElements = [], this.imageLayouts = [], this.currentFocusIndex = null, this.hoveredImage = null, this.layoutEngine.reset(), this.zoomEngine.reset(), this.imagesLoaded = !1;
2699
2764
  }
2700
- /**
2701
- * Check if URL is absolute (contains protocol)
2702
- * @param url - URL to check
2703
- * @returns True if absolute URL
2704
- */
2705
- isAbsoluteUrl(t) {
2706
- try {
2707
- return new URL(t), !0;
2708
- } catch {
2709
- return !1;
2710
- }
2765
+ showLoading(t) {
2766
+ !this.fullConfig.rendering.ui.showLoadingSpinner || !this.loadingEl || (t ? this.loadingEl.classList.remove("fbn-ic-hidden") : this.loadingEl.classList.add("fbn-ic-hidden"));
2767
+ }
2768
+ showError(t) {
2769
+ this.errorEl && (this.errorEl.textContent = t, this.errorEl.classList.remove("fbn-ic-hidden"));
2770
+ }
2771
+ hideError() {
2772
+ this.errorEl && this.errorEl.classList.add("fbn-ic-hidden");
2773
+ }
2774
+ updateCounter(t) {
2775
+ !this.fullConfig.rendering.ui.showImageCounter || !this.counterEl || (this.counterEl.textContent = `${t + 1} of ${this.imageElements.length}`, this.counterEl.classList.remove("fbn-ic-hidden"));
2776
+ }
2777
+ hideCounter() {
2778
+ this.counterEl && this.counterEl.classList.add("fbn-ic-hidden");
2711
2779
  }
2712
2780
  /**
2713
- * Debug logging helper
2714
- * @param args - Arguments to log
2781
+ * Destroy the gallery and clean up resources
2715
2782
  */
2716
- log(...t) {
2717
- this.debugLogging && typeof console < "u" && console.log(...t);
2783
+ destroy() {
2784
+ this.clearImageCloud(), this.loadingElAutoCreated && this.loadingEl && (this.loadingEl.remove(), this.loadingEl = null), this.errorElAutoCreated && this.errorEl && (this.errorEl.remove(), this.errorEl = null), this.counterElAutoCreated && this.counterEl && (this.counterEl.remove(), this.counterEl = null), this.resizeTimeout !== null && clearTimeout(this.resizeTimeout), this.swipeEngine?.destroy();
2718
2785
  }
2719
2786
  }
2720
- class Re {
2787
+ class Me {
2721
2788
  constructor(t) {
2722
- if (this._prepared = !1, this._discoveredUrls = [], this.loaders = t.loaders, this.debugLogging = t.debugLogging ?? !1, !this.loaders || this.loaders.length === 0)
2723
- throw new Error("CompositeLoader requires at least one loader to be configured");
2724
- this.log(`CompositeLoader initialized with ${this.loaders.length} loader(s)`);
2789
+ if (this._prepared = !1, this._discoveredUrls = [], this.apiKey = t.apiKey ?? "", this.apiEndpoint = t.apiEndpoint ?? "https://www.googleapis.com/drive/v3/files", this.debugLogging = t.debugLogging ?? !1, this.sources = t.sources ?? [], !this.sources || this.sources.length === 0)
2790
+ throw new Error("GoogleDriveLoader requires at least one source to be configured");
2725
2791
  }
2726
2792
  /**
2727
- * Prepare all loaders in parallel and combine their results
2793
+ * Prepare the loader by discovering all images from configured sources
2728
2794
  * @param filter - Filter to apply to discovered images
2729
2795
  */
2730
2796
  async prepare(t) {
2731
- this._discoveredUrls = [], this.log(`Preparing ${this.loaders.length} loader(s) in parallel`);
2732
- const e = this.loaders.map((i, o) => i.prepare(t).then(() => {
2733
- this.log(`Loader ${o} prepared with ${i.imagesLength()} images`);
2734
- }).catch((s) => {
2735
- console.warn(`Loader ${o} failed to prepare:`, s);
2736
- }));
2737
- await Promise.all(e);
2738
- for (const i of this.loaders)
2739
- if (i.isPrepared()) {
2740
- const o = i.imageURLs();
2741
- this._discoveredUrls.push(...o);
2797
+ this._discoveredUrls = [];
2798
+ for (const e of this.sources)
2799
+ if ("folders" in e)
2800
+ for (const i of e.folders) {
2801
+ const n = e.recursive !== void 0 ? e.recursive : !0, s = await this.loadFromFolder(i, t, n);
2802
+ this._discoveredUrls.push(...s);
2803
+ }
2804
+ else if ("files" in e) {
2805
+ const i = await this.loadFiles(e.files, t);
2806
+ this._discoveredUrls.push(...i);
2742
2807
  }
2743
- this._prepared = !0, this.log(`CompositeLoader prepared with ${this._discoveredUrls.length} total images`);
2808
+ this._prepared = !0;
2744
2809
  }
2745
2810
  /**
2746
- * Get the combined number of discovered images
2811
+ * Get the number of discovered images
2747
2812
  * @throws Error if called before prepare()
2748
2813
  */
2749
2814
  imagesLength() {
2750
2815
  if (!this._prepared)
2751
- throw new Error("CompositeLoader.imagesLength() called before prepare()");
2816
+ throw new Error("GoogleDriveLoader.imagesLength() called before prepare()");
2752
2817
  return this._discoveredUrls.length;
2753
2818
  }
2754
2819
  /**
2755
- * Get the combined ordered list of image URLs
2820
+ * Get the ordered list of image URLs
2756
2821
  * @throws Error if called before prepare()
2757
2822
  */
2758
2823
  imageURLs() {
2759
2824
  if (!this._prepared)
2760
- throw new Error("CompositeLoader.imageURLs() called before prepare()");
2825
+ throw new Error("GoogleDriveLoader.imageURLs() called before prepare()");
2761
2826
  return [...this._discoveredUrls];
2762
2827
  }
2763
2828
  /**
@@ -2767,491 +2832,441 @@ class Re {
2767
2832
  return this._prepared;
2768
2833
  }
2769
2834
  /**
2770
- * Debug logging helper
2771
- * @param args - Arguments to log
2772
- */
2773
- log(...t) {
2774
- this.debugLogging && typeof console < "u" && console.log("[CompositeLoader]", ...t);
2775
- }
2776
- }
2777
- class Ce {
2778
- /**
2779
- * Create a new ImageFilter
2780
- * @param extensions - Array of allowed file extensions (without dots)
2781
- * Defaults to common image formats if not provided
2835
+ * Extract folder ID from various Google Drive URL formats
2836
+ * @param folderUrl - Google Drive folder URL
2837
+ * @returns Folder ID or null if invalid
2782
2838
  */
2783
- constructor(t) {
2784
- this.allowedExtensions = t || [
2785
- "jpg",
2786
- "jpeg",
2787
- "png",
2788
- "gif",
2789
- "webp",
2790
- "bmp"
2839
+ extractFolderId(t) {
2840
+ const e = [
2841
+ /\/folders\/([a-zA-Z0-9_-]+)/,
2842
+ // Standard format
2843
+ /id=([a-zA-Z0-9_-]+)/
2844
+ // Alternative format
2791
2845
  ];
2846
+ for (const i of e) {
2847
+ const n = t.match(i);
2848
+ if (n && n[1])
2849
+ return n[1];
2850
+ }
2851
+ return null;
2792
2852
  }
2793
2853
  /**
2794
- * Check if a filename has an allowed extension
2795
- * @param filename - The filename to check (can include path or query string)
2796
- * @returns True if the file extension is allowed
2854
+ * Load images from a Google Drive folder
2855
+ * @param folderUrl - Google Drive folder URL
2856
+ * @param filter - Filter to apply to discovered images
2857
+ * @param recursive - Whether to include images from subfolders
2858
+ * @returns Promise resolving to array of image URLs
2797
2859
  */
2798
- isAllowed(t) {
2799
- const i = t.split("?")[0].split(".").pop()?.toLowerCase();
2800
- return i ? this.allowedExtensions.includes(i) : !1;
2860
+ async loadFromFolder(t, e, i = !0) {
2861
+ const n = this.extractFolderId(t);
2862
+ if (!n)
2863
+ throw new Error("Invalid Google Drive folder URL. Please check the URL format.");
2864
+ if (!this.apiKey || this.apiKey === "YOUR_API_KEY_HERE")
2865
+ return this.loadImagesDirectly(n, e);
2866
+ try {
2867
+ return i ? await this.loadImagesRecursively(n, e) : await this.loadImagesFromSingleFolder(n, e);
2868
+ } catch (s) {
2869
+ return console.error("Error loading from Google Drive API:", s), this.loadImagesDirectly(n, e);
2870
+ }
2801
2871
  }
2802
2872
  /**
2803
- * Get the list of allowed extensions
2804
- * @returns Array of allowed extensions
2873
+ * Load images from a single folder (non-recursive)
2874
+ * @param folderId - Google Drive folder ID
2875
+ * @param filter - Filter to apply to discovered images
2876
+ * @returns Promise resolving to array of image URLs
2805
2877
  */
2806
- getAllowedExtensions() {
2807
- return [...this.allowedExtensions];
2808
- }
2809
- // Future expansion methods:
2810
- // isAllowedSize(sizeBytes: number): boolean
2811
- // isAllowedDate(date: Date): boolean
2812
- // isAllowedDimensions(width: number, height: number): boolean
2813
- }
2814
- const Ae = `
2815
- .fbn-ic-gallery {
2816
- position: relative;
2817
- width: 100%;
2818
- height: 100%;
2819
- overflow: hidden;
2820
- perspective: 1000px;
2821
- }
2822
-
2823
- .fbn-ic-image {
2824
- position: absolute;
2825
- cursor: pointer;
2826
- transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1),
2827
- box-shadow 0.6s cubic-bezier(0.4, 0, 0.2, 1),
2828
- filter 0.3s cubic-bezier(0.4, 0, 0.2, 1),
2829
- opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1),
2830
- border 0.3s cubic-bezier(0.4, 0, 0.2, 1),
2831
- outline 0.3s cubic-bezier(0.4, 0, 0.2, 1),
2832
- z-index 0s 0.6s;
2833
- will-change: transform;
2834
- user-select: none;
2835
- backface-visibility: hidden;
2836
- -webkit-backface-visibility: hidden;
2837
- }
2838
-
2839
- .fbn-ic-image.fbn-ic-focused {
2840
- z-index: 1000;
2841
- transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1),
2842
- box-shadow 0.6s cubic-bezier(0.4, 0, 0.2, 1),
2843
- filter 0.3s cubic-bezier(0.4, 0, 0.2, 1),
2844
- opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1),
2845
- border 0.3s cubic-bezier(0.4, 0, 0.2, 1),
2846
- outline 0.3s cubic-bezier(0.4, 0, 0.2, 1),
2847
- z-index 0s 0s;
2848
- will-change: auto;
2849
- }
2850
-
2851
- .fbn-ic-counter {
2852
- position: fixed;
2853
- bottom: 24px;
2854
- left: 50%;
2855
- transform: translateX(-50%);
2856
- z-index: 10001;
2857
- pointer-events: none;
2858
- }
2859
-
2860
- .fbn-ic-hidden {
2861
- display: none !important;
2862
- }
2863
- `;
2864
- function Le() {
2865
- if (typeof document > "u") return;
2866
- const n = "fbn-ic-functional-styles";
2867
- if (document.getElementById(n)) return;
2868
- const t = document.createElement("style");
2869
- t.id = n, t.textContent = Ae, document.head.appendChild(t);
2870
- }
2871
- class Me {
2872
- constructor(t = {}) {
2873
- this.fullConfig = jt(t), t.container instanceof HTMLElement ? (this.containerRef = t.container, this.containerId = null) : (this.containerRef = null, this.containerId = t.container || "imageCloud"), this.imagesLoaded = !1, this.imageElements = [], this.imageLayouts = [], this.currentImageHeight = 225, this.currentFocusIndex = null, this.hoveredImage = null, this.resizeTimeout = null, this.displayQueue = [], this.queueInterval = null, this.loadGeneration = 0, this.loadingElAutoCreated = !1, this.errorElAutoCreated = !1, this.counterEl = null, this.counterElAutoCreated = !1, this.animationEngine = new qt(this.fullConfig.animation), this.layoutEngine = new ge({
2874
- layout: this.fullConfig.layout,
2875
- image: this.fullConfig.image
2876
- }), this.zoomEngine = new be(this.fullConfig.interaction.focus, this.animationEngine, this.fullConfig.styling), this.defaultStyles = st(this.fullConfig.styling?.default), this.hoverStyles = st(this.fullConfig.styling?.hover), this.defaultClassName = this.fullConfig.styling?.default?.className, this.hoverClassName = this.fullConfig.styling?.hover?.className;
2877
- const e = this.fullConfig.animation.entry || y.animation.entry;
2878
- this.entryAnimationEngine = new ie(
2879
- e,
2880
- this.fullConfig.layout.algorithm
2881
- ), this.swipeEngine = null, this.imageFilter = this.createImageFilter(), this.imageLoader = this.createLoader(), this.containerEl = null, this.loadingEl = null, this.errorEl = null;
2878
+ async loadImagesFromSingleFolder(t, e) {
2879
+ const i = [], n = `'${t}' in parents and trashed=false`, r = `${this.apiEndpoint}?q=${encodeURIComponent(n)}&fields=files(id,name,mimeType,thumbnailLink)&key=${this.apiKey}`, a = await fetch(r);
2880
+ if (!a.ok)
2881
+ throw new Error(`API request failed: ${a.status} ${a.statusText}`);
2882
+ const c = (await a.json()).files.filter(
2883
+ (u) => u.mimeType.startsWith("image/") && e.isAllowed(u.name)
2884
+ );
2885
+ return this.log(`Found ${c.length} images in folder ${t} (non-recursive)`), c.forEach((u) => {
2886
+ i.push(`https://lh3.googleusercontent.com/d/${u.id}=s1600`), this.log(`Added file: ${u.name}`);
2887
+ }), i;
2882
2888
  }
2883
2889
  /**
2884
- * Create image filter based on shared loader config
2890
+ * Load specific files by their URLs or IDs
2891
+ * @param fileUrls - Array of Google Drive file URLs or IDs
2892
+ * @param filter - Filter to apply to discovered images
2893
+ * @returns Promise resolving to array of image URLs
2885
2894
  */
2886
- createImageFilter() {
2887
- const t = this.fullConfig.config.loaders?.allowedExtensions;
2888
- return new Ce(t);
2895
+ async loadFiles(t, e) {
2896
+ const i = [];
2897
+ for (const n of t) {
2898
+ const s = this.extractFileId(n);
2899
+ if (!s) {
2900
+ this.log(`Skipping invalid file URL: ${n}`);
2901
+ continue;
2902
+ }
2903
+ if (this.apiKey && this.apiKey !== "YOUR_API_KEY_HERE")
2904
+ try {
2905
+ const r = `${this.apiEndpoint}/${s}?fields=name,mimeType&key=${this.apiKey}`, a = await fetch(r);
2906
+ if (a.ok) {
2907
+ const h = await a.json();
2908
+ h.mimeType.startsWith("image/") && e.isAllowed(h.name) ? (i.push(`https://lh3.googleusercontent.com/d/${s}=s1600`), this.log(`Added file: ${h.name}`)) : this.log(`Skipping non-image file: ${h.name} (${h.mimeType})`);
2909
+ } else
2910
+ this.log(`Failed to fetch metadata for file ${s}: ${a.status}`);
2911
+ } catch (r) {
2912
+ this.log(`Error fetching metadata for file ${s}:`, r);
2913
+ }
2914
+ else
2915
+ i.push(`https://lh3.googleusercontent.com/d/${s}=s1600`);
2916
+ }
2917
+ return i;
2889
2918
  }
2890
2919
  /**
2891
- * Create appropriate image loader based on config
2892
- * Processes loaders array, merges shared config, wraps in CompositeLoader if needed
2920
+ * Extract file ID from Google Drive file URL
2921
+ * @param fileUrl - Google Drive file URL or file ID
2922
+ * @returns File ID or null if invalid
2893
2923
  */
2894
- createLoader() {
2895
- const t = this.fullConfig.loaders, e = this.fullConfig.config.loaders ?? {};
2896
- if (!t || t.length === 0)
2897
- throw new Error("No loaders configured. Provide `images`, `loaders`, or both.");
2898
- const i = t.map((o) => this.createLoaderFromEntry(o, e));
2899
- return i.length === 1 ? i[0] : new Re({
2900
- loaders: i,
2901
- debugLogging: this.fullConfig.config.debug?.loaders
2902
- });
2924
+ extractFileId(t) {
2925
+ if (!/[/:.]/.test(t))
2926
+ return t;
2927
+ const e = [
2928
+ /\/file\/d\/([a-zA-Z0-9_-]+)/,
2929
+ // Standard file format
2930
+ /\/open\?id=([a-zA-Z0-9_-]+)/,
2931
+ // Alternative format
2932
+ /id=([a-zA-Z0-9_-]+)/
2933
+ // Generic id parameter
2934
+ ];
2935
+ for (const i of e) {
2936
+ const n = t.match(i);
2937
+ if (n && n[1])
2938
+ return n[1];
2939
+ }
2940
+ return null;
2903
2941
  }
2904
2942
  /**
2905
- * Create a single loader from a LoaderEntry, merging shared config
2943
+ * Recursively load images from a folder and all its subfolders
2944
+ * @param folderId - Google Drive folder ID
2945
+ * @param filter - Filter to apply to discovered images
2946
+ * @returns Promise resolving to array of image URLs
2906
2947
  */
2907
- createLoaderFromEntry(t, e) {
2908
- if ("static" in t) {
2909
- const i = t.static, o = {
2910
- ...i,
2911
- validateUrls: i.validateUrls ?? e.validateUrls,
2912
- validationTimeout: i.validationTimeout ?? e.validationTimeout,
2913
- validationMethod: i.validationMethod ?? e.validationMethod,
2914
- allowedExtensions: i.allowedExtensions ?? e.allowedExtensions,
2915
- debugLogging: i.debugLogging ?? this.fullConfig.config.debug?.loaders
2916
- };
2917
- return new Te(o);
2918
- } else if ("googleDrive" in t) {
2919
- const i = t.googleDrive, o = {
2920
- ...i,
2921
- allowedExtensions: i.allowedExtensions ?? e.allowedExtensions,
2922
- debugLogging: i.debugLogging ?? this.fullConfig.config.debug?.loaders
2923
- };
2924
- return new Ie(o);
2925
- } else
2926
- throw new Error(`Unknown loader entry: ${JSON.stringify(t)}`);
2948
+ async loadImagesRecursively(t, e) {
2949
+ const i = [], n = `'${t}' in parents and trashed=false`, r = `${this.apiEndpoint}?q=${encodeURIComponent(n)}&fields=files(id,name,mimeType,thumbnailLink)&key=${this.apiKey}`, a = await fetch(r);
2950
+ if (!a.ok)
2951
+ throw new Error(`API request failed: ${a.status} ${a.statusText}`);
2952
+ const h = await a.json(), c = h.files.filter(
2953
+ (l) => l.mimeType.startsWith("image/") && e.isAllowed(l.name)
2954
+ ), u = h.files.filter(
2955
+ (l) => l.mimeType === "application/vnd.google-apps.folder"
2956
+ );
2957
+ this.log(`Found ${h.files.length} total items in folder ${t}`), h.files.forEach((l) => this.log(` - File: ${l.name} (${l.mimeType})`)), this.log(`- ${c.length} valid files (images only)`), this.log(`- ${u.length} subfolders`), c.forEach((l) => {
2958
+ i.push(`https://lh3.googleusercontent.com/d/${l.id}=s1600`), this.log(`Added file: ${l.name}`);
2959
+ });
2960
+ for (const l of u) {
2961
+ this.log(`Loading images from subfolder: ${l.name}`);
2962
+ const d = await this.loadImagesRecursively(l.id, e);
2963
+ i.push(...d);
2964
+ }
2965
+ return i;
2927
2966
  }
2928
2967
  /**
2929
- * Initialize the gallery
2968
+ * Direct loading method (no API key required, but less reliable)
2969
+ * Uses embedded folder view to scrape image IDs
2970
+ * @param folderId - Google Drive folder ID
2971
+ * @param filter - Filter to apply (not used in fallback mode)
2972
+ * @returns Promise resolving to array of image URLs
2930
2973
  */
2931
- async init() {
2974
+ async loadImagesDirectly(t, e) {
2932
2975
  try {
2933
- if (Le(), this.containerRef)
2934
- this.containerEl = this.containerRef;
2935
- else if (this.containerEl = document.getElementById(this.containerId), !this.containerEl)
2936
- throw new Error(`Container #${this.containerId} not found`);
2937
- this.containerEl.classList.add("fbn-ic-gallery"), this.swipeEngine = new mt(this.containerEl, {
2938
- onNext: () => this.navigateToNextImage(),
2939
- onPrev: () => this.navigateToPreviousImage(),
2940
- onDragOffset: (t) => this.zoomEngine.setDragOffset(t),
2941
- onDragEnd: (t) => {
2942
- t ? this.zoomEngine.clearDragOffset(!1) : this.zoomEngine.clearDragOffset(!0, Ee);
2943
- }
2944
- }), this.setupUI(), this.setupEventListeners(), this.logDebug("ImageCloud initialized"), await this.loadImages();
2945
- } catch (t) {
2946
- console.error("Gallery initialization failed:", t), this.errorEl && t instanceof Error && this.showError("Gallery failed to initialize: " + t.message);
2976
+ const i = `https://drive.google.com/embeddedfolderview?id=${t}`, n = await fetch(i, { mode: "cors" });
2977
+ if (!n.ok)
2978
+ throw new Error("Cannot access folder directly (CORS or permissions issue)");
2979
+ const s = await n.text(), r = /\/file\/d\/([a-zA-Z0-9_-]+)/g, a = [...s.matchAll(r)];
2980
+ return [...new Set(a.map((u) => u[1]))].map(
2981
+ (u) => `https://drive.google.com/uc?export=view&id=${u}`
2982
+ );
2983
+ } catch (i) {
2984
+ throw console.error("Direct loading failed:", i), new Error(
2985
+ `Unable to load images. Please ensure:
2986
+ 1. The folder is shared publicly (Anyone with the link can view)
2987
+ 2. The folder contains image files
2988
+ 3. Consider adding a Google Drive API key in config.js for better reliability`
2989
+ );
2947
2990
  }
2948
2991
  }
2949
- setupUI() {
2950
- const t = this.fullConfig.rendering.ui;
2951
- t.showLoadingSpinner && (t.loadingElement ? (this.loadingEl = this.resolveElement(t.loadingElement), this.loadingElAutoCreated = !1) : (this.loadingEl = this.createDefaultLoadingElement(), this.loadingElAutoCreated = !0)), t.errorElement ? (this.errorEl = this.resolveElement(t.errorElement), this.errorElAutoCreated = !1) : (this.errorEl = this.createDefaultErrorElement(), this.errorElAutoCreated = !0), t.showImageCounter && (t.counterElement ? (this.counterEl = this.resolveElement(t.counterElement), this.counterElAutoCreated = !1) : (this.counterEl = this.createDefaultCounterElement(), this.counterElAutoCreated = !0));
2992
+ /**
2993
+ * Manually add image URLs (for testing or when auto-loading fails)
2994
+ * @param imageIds - Array of Google Drive file IDs
2995
+ * @returns Array of direct image URLs
2996
+ */
2997
+ manualImageUrls(t) {
2998
+ return t.map((e) => `https://drive.google.com/uc?export=view&id=${e}`);
2952
2999
  }
2953
- resolveElement(t) {
2954
- return t instanceof HTMLElement ? t : document.getElementById(t);
3000
+ /**
3001
+ * Debug logging helper
3002
+ * @param args - Arguments to log
3003
+ */
3004
+ log(...t) {
3005
+ this.debugLogging && typeof console < "u" && console.log(...t);
2955
3006
  }
2956
- createDefaultLoadingElement() {
2957
- const t = document.createElement("div");
2958
- t.className = "fbn-ic-loading fbn-ic-hidden";
2959
- const e = document.createElement("div");
2960
- e.className = "fbn-ic-spinner", t.appendChild(e);
2961
- const i = document.createElement("p");
2962
- return i.textContent = "Loading images...", t.appendChild(i), this.containerEl.appendChild(t), t;
3007
+ }
3008
+ class ze {
3009
+ constructor(t) {
3010
+ if (this._prepared = !1, this._discoveredUrls = [], this.validateUrls = t.validateUrls !== !1, this.validationTimeout = t.validationTimeout ?? 5e3, this.validationMethod = t.validationMethod ?? "head", this.debugLogging = t.debugLogging ?? !1, this.sources = t.sources ?? [], !this.sources || this.sources.length === 0)
3011
+ throw new Error("StaticImageLoader requires at least one source to be configured");
3012
+ this.log("StaticImageLoader initialized with config:", t);
2963
3013
  }
2964
- createDefaultErrorElement() {
2965
- const t = document.createElement("div");
2966
- return t.className = "fbn-ic-error fbn-ic-hidden", this.containerEl.appendChild(t), t;
3014
+ /**
3015
+ * Prepare the loader by discovering all images from configured sources
3016
+ * @param filter - Filter to apply to discovered images
3017
+ */
3018
+ async prepare(t) {
3019
+ this._discoveredUrls = [], this.log(`Processing ${this.sources.length} source(s)`);
3020
+ for (const e of this.sources)
3021
+ try {
3022
+ const i = await this.processSource(e, t);
3023
+ this._discoveredUrls.push(...i);
3024
+ } catch (i) {
3025
+ console.warn("Failed to process source:", e, i);
3026
+ }
3027
+ this._prepared = !0, this.log(`Successfully loaded ${this._discoveredUrls.length} image(s)`);
2967
3028
  }
2968
- createDefaultCounterElement() {
2969
- const t = document.createElement("div");
2970
- return t.className = "fbn-ic-counter fbn-ic-hidden", this.containerEl.appendChild(t), t;
3029
+ /**
3030
+ * Get the number of discovered images
3031
+ * @throws Error if called before prepare()
3032
+ */
3033
+ imagesLength() {
3034
+ if (!this._prepared)
3035
+ throw new Error("StaticImageLoader.imagesLength() called before prepare()");
3036
+ return this._discoveredUrls.length;
2971
3037
  }
2972
- setupEventListeners() {
2973
- document.addEventListener("keydown", (t) => {
2974
- t.key === "Escape" ? (this.zoomEngine.unfocusImage(), this.currentFocusIndex = null, this.swipeEngine?.disable(), this.hideCounter()) : t.key === "ArrowRight" ? this.navigateToNextImage() : t.key === "ArrowLeft" ? this.navigateToPreviousImage() : (t.key === "Enter" || t.key === " ") && this.hoveredImage && (this.handleImageClick(this.hoveredImage.element, this.hoveredImage.layout), t.preventDefault());
2975
- }), document.addEventListener("click", (t) => {
2976
- this.swipeEngine?.hadRecentTouch() || t.target.closest(".fbn-ic-image") || (this.zoomEngine.unfocusImage(), this.currentFocusIndex = null, this.swipeEngine?.disable(), this.hideCounter());
2977
- }), window.addEventListener("resize", () => this.handleResize());
3038
+ /**
3039
+ * Get the ordered list of image URLs
3040
+ * @throws Error if called before prepare()
3041
+ */
3042
+ imageURLs() {
3043
+ if (!this._prepared)
3044
+ throw new Error("StaticImageLoader.imageURLs() called before prepare()");
3045
+ return [...this._discoveredUrls];
3046
+ }
3047
+ /**
3048
+ * Check if the loader has been prepared
3049
+ */
3050
+ isPrepared() {
3051
+ return this._prepared;
3052
+ }
3053
+ /**
3054
+ * Process a single source object using shape-based detection
3055
+ * @param source - Source configuration detected by key presence
3056
+ * @param filter - Filter to apply to discovered images
3057
+ * @returns Promise resolving to array of valid URLs from this source
3058
+ */
3059
+ async processSource(t, e) {
3060
+ return t ? "urls" in t ? await this.processUrls(t.urls, e) : "path" in t ? await this.processPath(t.path, t.files, e) : "json" in t ? await this.processJson(t.json, e) : (console.warn("Unknown source shape:", t), []) : (console.warn("Invalid source object:", t), []);
3061
+ }
3062
+ /**
3063
+ * Process a list of direct URLs
3064
+ * @param urls - Array of image URLs
3065
+ * @param filter - Filter to apply to discovered images
3066
+ * @returns Promise resolving to array of validated URLs
3067
+ */
3068
+ async processUrls(t, e) {
3069
+ if (!Array.isArray(t))
3070
+ return console.warn("URLs must be an array:", t), [];
3071
+ const i = [];
3072
+ for (const n of t) {
3073
+ const s = n.split("/").pop() || n;
3074
+ if (!e.isAllowed(s)) {
3075
+ this.log(`Skipping filtered URL: ${n}`);
3076
+ continue;
3077
+ }
3078
+ this.validateUrls ? await this.validateUrl(n) ? i.push(n) : console.warn(`Skipping invalid/missing URL: ${n}`) : i.push(n);
3079
+ }
3080
+ return i;
3081
+ }
3082
+ /**
3083
+ * Process a path-based source
3084
+ * @param basePath - Base path (relative or absolute)
3085
+ * @param files - Array of filenames
3086
+ * @param filter - Filter to apply to discovered images
3087
+ * @returns Promise resolving to array of validated URLs
3088
+ */
3089
+ async processPath(t, e, i) {
3090
+ if (!Array.isArray(e))
3091
+ return console.warn("files must be an array:", e), [];
3092
+ const n = [];
3093
+ for (const s of e) {
3094
+ if (!i.isAllowed(s)) {
3095
+ this.log(`Skipping filtered file: ${s}`);
3096
+ continue;
3097
+ }
3098
+ const r = this.constructUrl(t, s);
3099
+ this.validateUrls ? await this.validateUrl(r) ? n.push(r) : console.warn(`Skipping invalid/missing file: ${r}`) : n.push(r);
3100
+ }
3101
+ return n;
3102
+ }
3103
+ /**
3104
+ * Process a JSON endpoint source
3105
+ * Fetches a JSON endpoint that returns { images: string[] }
3106
+ * @param url - JSON endpoint URL
3107
+ * @param filter - Filter to apply to discovered images
3108
+ * @returns Promise resolving to array of validated URLs
3109
+ */
3110
+ async processJson(t, e) {
3111
+ this.log(`Fetching JSON endpoint: ${t}`);
3112
+ const i = new AbortController(), n = setTimeout(() => i.abort(), 1e4);
3113
+ try {
3114
+ const s = await fetch(t, { signal: i.signal });
3115
+ if (clearTimeout(n), !s.ok)
3116
+ throw new Error(`HTTP ${s.status} fetching ${t}`);
3117
+ const r = await s.json();
3118
+ if (!r || !Array.isArray(r.images))
3119
+ throw new Error('JSON source must return JSON with shape { "images": ["url1", "url2", ...] }');
3120
+ return this.log(`JSON endpoint returned ${r.images.length} image(s)`), await this.processUrls(r.images, e);
3121
+ } catch (s) {
3122
+ throw clearTimeout(n), s instanceof Error && s.name === "AbortError" ? new Error(`Timeout fetching JSON endpoint: ${t}`) : s;
3123
+ }
3124
+ }
3125
+ /**
3126
+ * Validate a single URL using HEAD request
3127
+ * @param url - URL to validate
3128
+ * @returns Promise resolving to true if valid and accessible
3129
+ */
3130
+ async validateUrl(t) {
3131
+ if (this.validationMethod === "none")
3132
+ return !0;
3133
+ if (this.validationMethod === "simple")
3134
+ try {
3135
+ return typeof window < "u" ? new URL(t, window.location.origin) : new URL(t), !0;
3136
+ } catch {
3137
+ return !1;
3138
+ }
3139
+ if (typeof window > "u")
3140
+ return !0;
3141
+ if (!(t.startsWith(window.location.origin) || t.startsWith("/")))
3142
+ return this.log(`Skipping validation for cross-origin URL: ${t}`), !0;
3143
+ try {
3144
+ const i = new AbortController(), n = setTimeout(() => i.abort(), this.validationTimeout), s = await fetch(t, {
3145
+ method: "HEAD",
3146
+ signal: i.signal
3147
+ });
3148
+ return clearTimeout(n), s.ok ? !0 : (this.log(`Validation failed for ${t}: HTTP ${s.status}`), !1);
3149
+ } catch (i) {
3150
+ return i instanceof Error && (i.name === "AbortError" ? this.log(`Validation timeout for ${t}`) : this.log(`Validation failed for ${t}:`, i.message)), !1;
3151
+ }
2978
3152
  }
2979
3153
  /**
2980
- * Navigate to the next image (Right arrow)
3154
+ * Construct full URL from basePath and filename
3155
+ * @param basePath - Base path (relative or absolute)
3156
+ * @param filename - Filename to append
3157
+ * @returns Complete URL
2981
3158
  */
2982
- navigateToNextImage() {
2983
- if (this.currentFocusIndex === null || this.imageElements.length === 0) return;
2984
- const t = (this.currentFocusIndex + 1) % this.imageLayouts.length, e = this.imageElements.find(
2985
- (o) => o.dataset.imageId === String(t)
2986
- );
2987
- if (!e) return;
2988
- const i = this.imageLayouts[t];
2989
- i && (this.currentFocusIndex = t, this.handleImageClick(e, i), this.updateCounter(t));
3159
+ constructUrl(t, e) {
3160
+ const i = t.replace(/\/$/, "");
3161
+ if (this.isAbsoluteUrl(t))
3162
+ return `${i}/${e}`;
3163
+ if (typeof window > "u")
3164
+ return `${i}/${e}`;
3165
+ const n = window.location.origin, r = (t.startsWith("/") ? t : "/" + t).replace(/\/$/, "");
3166
+ return `${n}${r}/${e}`;
2990
3167
  }
2991
3168
  /**
2992
- * Navigate to the previous image (Left arrow)
3169
+ * Check if URL is absolute (contains protocol)
3170
+ * @param url - URL to check
3171
+ * @returns True if absolute URL
2993
3172
  */
2994
- navigateToPreviousImage() {
2995
- if (this.currentFocusIndex === null || this.imageElements.length === 0) return;
2996
- const t = (this.currentFocusIndex - 1 + this.imageLayouts.length) % this.imageLayouts.length, e = this.imageElements.find(
2997
- (o) => o.dataset.imageId === String(t)
2998
- );
2999
- if (!e) return;
3000
- const i = this.imageLayouts[t];
3001
- i && (this.currentFocusIndex = t, this.handleImageClick(e, i), this.updateCounter(t));
3173
+ isAbsoluteUrl(t) {
3174
+ try {
3175
+ return new URL(t), !0;
3176
+ } catch {
3177
+ return !1;
3178
+ }
3002
3179
  }
3003
3180
  /**
3004
- * Navigate to a specific image by index
3181
+ * Debug logging helper
3182
+ * @param args - Arguments to log
3005
3183
  */
3006
- handleResize() {
3007
- this.imagesLoaded && (this.resizeTimeout !== null && clearTimeout(this.resizeTimeout), this.resizeTimeout = window.setTimeout(() => {
3008
- const t = this.getImageHeight();
3009
- t !== this.currentImageHeight ? (this.logDebug(`Window resized to new breakpoint (height: ${t}px). Reloading images...`), this.loadImages()) : this.logDebug("Window resized (no breakpoint change)");
3010
- }, 500));
3184
+ log(...t) {
3185
+ this.debugLogging && typeof console < "u" && console.log(...t);
3011
3186
  }
3012
- getImageHeight() {
3013
- const t = window.innerWidth, e = this.fullConfig.layout.responsive, o = this.fullConfig.image.sizing?.maxSize ?? 400;
3014
- return e ? t <= e.mobile.maxWidth ? Math.min(100, o) : t <= e.tablet.maxWidth ? Math.min(180, o) : Math.min(225, o) : t <= 767 ? Math.min(100, o) : t <= 1199 ? Math.min(180, o) : Math.min(225, o);
3187
+ }
3188
+ class Fe {
3189
+ constructor(t) {
3190
+ if (this._prepared = !1, this._discoveredUrls = [], this.loaders = t.loaders, this.debugLogging = t.debugLogging ?? !1, !this.loaders || this.loaders.length === 0)
3191
+ throw new Error("CompositeLoader requires at least one loader to be configured");
3192
+ this.log(`CompositeLoader initialized with ${this.loaders.length} loader(s)`);
3015
3193
  }
3016
3194
  /**
3017
- * Get container bounds for layout calculations
3195
+ * Prepare all loaders in parallel and combine their results
3196
+ * @param filter - Filter to apply to discovered images
3018
3197
  */
3019
- getContainerBounds() {
3020
- return this.containerEl ? {
3021
- width: this.containerEl.offsetWidth,
3022
- height: this.containerEl.offsetHeight || window.innerHeight * 0.7
3023
- } : { width: window.innerWidth, height: window.innerHeight * 0.7 };
3198
+ async prepare(t) {
3199
+ this._discoveredUrls = [], this.log(`Preparing ${this.loaders.length} loader(s) in parallel`);
3200
+ const e = this.loaders.map((i, n) => i.prepare(t).then(() => {
3201
+ this.log(`Loader ${n} prepared with ${i.imagesLength()} images`);
3202
+ }).catch((s) => {
3203
+ console.warn(`Loader ${n} failed to prepare:`, s);
3204
+ }));
3205
+ await Promise.all(e);
3206
+ for (const i of this.loaders)
3207
+ if (i.isPrepared()) {
3208
+ const n = i.imageURLs();
3209
+ this._discoveredUrls.push(...n);
3210
+ }
3211
+ this._prepared = !0, this.log(`CompositeLoader prepared with ${this._discoveredUrls.length} total images`);
3024
3212
  }
3025
3213
  /**
3026
- * Load images using the unified loader interface
3214
+ * Get the combined number of discovered images
3215
+ * @throws Error if called before prepare()
3027
3216
  */
3028
- async loadImages() {
3029
- try {
3030
- this.showLoading(!0), this.hideError(), this.clearImageCloud(), await this.imageLoader.prepare(this.imageFilter);
3031
- const t = this.imageLoader.imagesLength();
3032
- let e = this.imageLoader.imageURLs();
3033
- if (t === 0) {
3034
- this.showError("No images found."), this.showLoading(!1);
3035
- return;
3036
- }
3037
- const i = this.getContainerBounds(), o = this.getImageHeight(), s = window.innerWidth;
3038
- this.logDebug(`Adaptive sizing input: container=${i.width}x${i.height}px, images=${t}, responsiveMax=${o}px`);
3039
- const r = this.layoutEngine.calculateAdaptiveSize(
3040
- i,
3041
- t,
3042
- o,
3043
- s
3044
- );
3045
- this.logDebug(`Adaptive sizing result: height=${r.height}px`), await this.createImageCloud(e, r.height), this.showLoading(!1), this.imagesLoaded = !0;
3046
- } catch (t) {
3047
- console.error("Error loading images:", t), t instanceof Error && this.showError(t.message || "Failed to load images."), this.showLoading(!1);
3048
- }
3217
+ imagesLength() {
3218
+ if (!this._prepared)
3219
+ throw new Error("CompositeLoader.imagesLength() called before prepare()");
3220
+ return this._discoveredUrls.length;
3049
3221
  }
3050
3222
  /**
3051
- * Helper for debug logging
3223
+ * Get the combined ordered list of image URLs
3224
+ * @throws Error if called before prepare()
3052
3225
  */
3053
- logDebug(...t) {
3054
- this.fullConfig.config.debug?.enabled && typeof console < "u" && console.log(...t);
3055
- }
3056
- async createImageCloud(t, e) {
3057
- if (!this.containerEl) return;
3058
- const i = this.getContainerBounds();
3059
- this.currentImageHeight = e;
3060
- const o = this.loadGeneration, s = this.layoutEngine.generateLayout(t.length, i, { fixedHeight: e });
3061
- this.imageLayouts = s, this.displayQueue = [];
3062
- let r = 0;
3063
- const a = (c) => {
3064
- this.containerEl && (this.containerEl.appendChild(c), this.imageElements.push(c), requestAnimationFrame(() => {
3065
- if (c.offsetWidth, c.style.opacity = this.defaultStyles.opacity ?? "1", c.dataset.startX && (this.entryAnimationEngine.requiresJSAnimation() || this.entryAnimationEngine.requiresJSRotation() || this.entryAnimationEngine.requiresJSScale() || c.dataset.startRotation !== c.dataset.rotation || c.dataset.startScale !== c.dataset.scale)) {
3066
- const d = {
3067
- x: parseFloat(c.dataset.startX),
3068
- y: parseFloat(c.dataset.startY)
3069
- }, f = {
3070
- x: parseFloat(c.dataset.endX),
3071
- y: parseFloat(c.dataset.endY)
3072
- }, b = parseFloat(c.dataset.imageWidth), p = parseFloat(c.dataset.imageHeight), g = parseFloat(c.dataset.rotation), m = parseFloat(c.dataset.scale), E = c.dataset.startRotation ? parseFloat(c.dataset.startRotation) : g, v = c.dataset.startScale ? parseFloat(c.dataset.startScale) : m, w = this.entryAnimationEngine.getTiming();
3073
- Qt({
3074
- element: c,
3075
- startPosition: d,
3076
- endPosition: f,
3077
- pathConfig: this.entryAnimationEngine.getPathConfig(),
3078
- duration: w.duration,
3079
- imageWidth: b,
3080
- imageHeight: p,
3081
- rotation: g,
3082
- scale: m,
3083
- rotationConfig: this.entryAnimationEngine.getRotationConfig(),
3084
- startRotation: E,
3085
- scaleConfig: this.entryAnimationEngine.getScaleConfig(),
3086
- startScale: v
3087
- });
3088
- } else {
3089
- const d = c.dataset.finalTransform || "";
3090
- c.style.transform = d;
3091
- }
3092
- const l = parseInt(c.dataset.imageId || "0");
3093
- if (this.fullConfig.config.debug?.enabled && l < 3) {
3094
- const d = c.dataset.finalTransform || "";
3095
- console.log(`Image ${l} final state:`, {
3096
- left: c.style.left,
3097
- top: c.style.top,
3098
- width: c.style.width,
3099
- height: c.style.height,
3100
- computedWidth: c.offsetWidth,
3101
- computedHeight: c.offsetHeight,
3102
- transform: d,
3103
- pathType: this.entryAnimationEngine.getPathType()
3104
- });
3105
- }
3106
- }), r++);
3107
- }, h = () => {
3108
- if (this.logDebug("Starting queue processing, enabled:", this.fullConfig.animation.queue.enabled), !this.fullConfig.animation.queue.enabled) {
3109
- for (; this.displayQueue.length > 0; ) {
3110
- const c = this.displayQueue.shift();
3111
- c && a(c);
3112
- }
3113
- return;
3114
- }
3115
- this.queueInterval !== null && clearInterval(this.queueInterval), this.queueInterval = window.setInterval(() => {
3116
- if (o !== this.loadGeneration) {
3117
- this.queueInterval !== null && (clearInterval(this.queueInterval), this.queueInterval = null);
3118
- return;
3119
- }
3120
- if (this.displayQueue.length > 0) {
3121
- const c = this.displayQueue.shift();
3122
- c && a(c);
3123
- }
3124
- r >= t.length && this.displayQueue.length === 0 && this.queueInterval !== null && (clearInterval(this.queueInterval), this.queueInterval = null);
3125
- }, this.fullConfig.animation.queue.interval);
3126
- };
3127
- if ("IntersectionObserver" in window && this.containerEl) {
3128
- const c = new IntersectionObserver((u) => {
3129
- u.forEach((l) => {
3130
- l.isIntersecting && (h(), c.disconnect());
3131
- });
3132
- }, { threshold: 0.1, rootMargin: "50px" });
3133
- c.observe(this.containerEl);
3134
- } else
3135
- h();
3136
- this.fullConfig.config.debug?.centers && this.containerEl && (this.containerEl.querySelectorAll(".fbn-ic-debug-center").forEach((c) => c.remove()), s.forEach((c, u) => {
3137
- const l = document.createElement("div");
3138
- l.className = "fbn-ic-debug-center", l.style.position = "absolute", l.style.width = "12px", l.style.height = "12px", l.style.borderRadius = "50%", l.style.backgroundColor = "red", l.style.border = "2px solid yellow", l.style.zIndex = "9999", l.style.pointerEvents = "none";
3139
- const d = c.x, f = c.y;
3140
- l.style.left = `${d - 6}px`, l.style.top = `${f - 6}px`, l.title = `Image ${u}: center (${Math.round(d)}, ${Math.round(f)})`, this.containerEl.appendChild(l);
3141
- })), t.forEach((c, u) => {
3142
- const l = document.createElement("img");
3143
- l.referrerPolicy = "no-referrer", l.classList.add("fbn-ic-image"), l.dataset.imageId = String(u);
3144
- const d = s[u];
3145
- l.style.position = "absolute", l.style.width = "auto", l.style.height = `${e}px`, l.style.left = `${d.x}px`, l.style.top = `${d.y}px`, d.zIndex && (l.style.zIndex = String(d.zIndex)), tt(l, this.defaultStyles), et(l, this.defaultClassName), l.addEventListener("mouseenter", () => {
3146
- this.hoveredImage = { element: l, layout: d }, this.zoomEngine.isInvolved(l) || (tt(l, this.hoverStyles), et(l, this.hoverClassName));
3147
- }), l.addEventListener("mouseleave", () => {
3148
- this.hoveredImage = null, this.zoomEngine.isInvolved(l) || (tt(l, this.defaultStyles), Mt(l, this.hoverClassName), et(l, this.defaultClassName));
3149
- }), l.addEventListener("click", (f) => {
3150
- f.stopPropagation(), this.handleImageClick(l, d);
3151
- }), l.style.opacity = "0", l.style.transition = this.entryAnimationEngine.getTransitionCSS(), l.onload = () => {
3152
- if (o !== this.loadGeneration)
3153
- return;
3154
- const f = l.naturalWidth / l.naturalHeight, b = e * f;
3155
- l.style.width = `${b}px`;
3156
- const p = { x: d.x, y: d.y }, g = { width: b, height: e }, m = this.entryAnimationEngine.calculateStartPosition(
3157
- p,
3158
- g,
3159
- i,
3160
- u,
3161
- t.length
3162
- ), E = this.entryAnimationEngine.calculateStartRotation(d.rotation), v = this.entryAnimationEngine.calculateStartScale(d.scale), w = this.entryAnimationEngine.buildFinalTransform(
3163
- d.rotation,
3164
- d.scale,
3165
- b,
3166
- e
3167
- ), S = this.entryAnimationEngine.buildStartTransform(
3168
- m,
3169
- p,
3170
- d.rotation,
3171
- d.scale,
3172
- b,
3173
- e,
3174
- E,
3175
- v
3176
- );
3177
- this.fullConfig.config.debug?.enabled && u < 3 && console.log(`Image ${u}:`, {
3178
- finalPosition: p,
3179
- imageSize: g,
3180
- left: d.x,
3181
- top: d.y,
3182
- finalTransform: w,
3183
- renderedWidth: b,
3184
- renderedHeight: e
3185
- }), l.style.transform = S, l.dataset.finalTransform = w, (this.entryAnimationEngine.requiresJSAnimation() || this.entryAnimationEngine.requiresJSRotation() || this.entryAnimationEngine.requiresJSScale() || E !== d.rotation || v !== d.scale) && (l.dataset.startX = String(m.x), l.dataset.startY = String(m.y), l.dataset.endX = String(p.x), l.dataset.endY = String(p.y), l.dataset.imageWidth = String(b), l.dataset.imageHeight = String(e), l.dataset.rotation = String(d.rotation), l.dataset.scale = String(d.scale), l.dataset.startRotation = String(E), l.dataset.startScale = String(v)), this.displayQueue.push(l);
3186
- }, l.onerror = () => r++, l.src = c;
3187
- });
3188
- }
3189
- async handleImageClick(t, e) {
3190
- if (!this.containerEl) return;
3191
- const i = this.zoomEngine.isFocused(t), o = {
3192
- width: this.containerEl.offsetWidth,
3193
- height: this.containerEl.offsetHeight
3194
- };
3195
- if (i)
3196
- await this.zoomEngine.unfocusImage(), this.currentFocusIndex = null, this.swipeEngine?.disable(), this.hideCounter();
3197
- else {
3198
- const s = t.dataset.imageId;
3199
- this.currentFocusIndex = s !== void 0 ? parseInt(s, 10) : null, this.swipeEngine?.enable(), await this.zoomEngine.focusImage(t, o, e), this.currentFocusIndex !== null && this.updateCounter(this.currentFocusIndex);
3200
- }
3226
+ imageURLs() {
3227
+ if (!this._prepared)
3228
+ throw new Error("CompositeLoader.imageURLs() called before prepare()");
3229
+ return [...this._discoveredUrls];
3201
3230
  }
3202
3231
  /**
3203
- * Clear the image cloud and reset state
3232
+ * Check if the loader has been prepared
3204
3233
  */
3205
- clearImageCloud() {
3206
- this.queueInterval !== null && (clearInterval(this.queueInterval), this.queueInterval = null), this.loadGeneration++, this.displayQueue = [], this.containerEl && this.containerEl.querySelectorAll(".fbn-ic-image, .fbn-ic-debug-center").forEach((t) => t.remove()), this.imageElements = [], this.imageLayouts = [], this.currentFocusIndex = null, this.hoveredImage = null, this.layoutEngine.reset(), this.zoomEngine.reset(), this.imagesLoaded = !1;
3207
- }
3208
- showLoading(t) {
3209
- !this.fullConfig.rendering.ui.showLoadingSpinner || !this.loadingEl || (t ? this.loadingEl.classList.remove("fbn-ic-hidden") : this.loadingEl.classList.add("fbn-ic-hidden"));
3210
- }
3211
- showError(t) {
3212
- this.errorEl && (this.errorEl.textContent = t, this.errorEl.classList.remove("fbn-ic-hidden"));
3213
- }
3214
- hideError() {
3215
- this.errorEl && this.errorEl.classList.add("fbn-ic-hidden");
3216
- }
3217
- updateCounter(t) {
3218
- !this.fullConfig.rendering.ui.showImageCounter || !this.counterEl || (this.counterEl.textContent = `${t + 1} of ${this.imageElements.length}`, this.counterEl.classList.remove("fbn-ic-hidden"));
3219
- }
3220
- hideCounter() {
3221
- this.counterEl && this.counterEl.classList.add("fbn-ic-hidden");
3234
+ isPrepared() {
3235
+ return this._prepared;
3222
3236
  }
3223
3237
  /**
3224
- * Destroy the gallery and clean up resources
3238
+ * Debug logging helper
3239
+ * @param args - Arguments to log
3225
3240
  */
3226
- destroy() {
3227
- this.clearImageCloud(), this.loadingElAutoCreated && this.loadingEl && (this.loadingEl.remove(), this.loadingEl = null), this.errorElAutoCreated && this.errorEl && (this.errorEl.remove(), this.errorEl = null), this.counterElAutoCreated && this.counterEl && (this.counterEl.remove(), this.counterEl = null), this.resizeTimeout !== null && clearTimeout(this.resizeTimeout), this.swipeEngine?.destroy();
3241
+ log(...t) {
3242
+ this.debugLogging && typeof console < "u" && console.log("[CompositeLoader]", ...t);
3228
3243
  }
3229
3244
  }
3230
3245
  export {
3231
- qt as AnimationEngine,
3232
- wt as BOUNCE_PRESETS,
3233
- de as ClusterPlacementLayout,
3234
- Re as CompositeLoader,
3246
+ Xt as AnimationEngine,
3247
+ St as BOUNCE_PRESETS,
3248
+ ge as ClusterPlacementLayout,
3249
+ Fe as CompositeLoader,
3235
3250
  y as DEFAULT_CONFIG,
3236
- Ct as DEFAULT_SHARED_LOADER_CONFIG,
3237
- xt as ELASTIC_PRESETS,
3238
- ie as EntryAnimationEngine,
3239
- Ae as FUNCTIONAL_CSS,
3240
- Ie as GoogleDriveLoader,
3241
- ae as GridPlacementLayout,
3242
- Me as ImageCloud,
3243
- Ce as ImageFilter,
3244
- Me as ImageGallery,
3245
- ge as LayoutEngine,
3246
- oe as RadialPlacementLayout,
3247
- ne as RandomPlacementLayout,
3248
- le as SpiralPlacementLayout,
3249
- Te as StaticImageLoader,
3250
- Et as WAVE_PATH_PRESETS,
3251
- ue as WavePlacementLayout,
3252
- be as ZoomEngine,
3253
- Qt as animatePath,
3254
- Le as injectFunctionalStyles,
3255
- te as requiresJSAnimation
3251
+ Lt as DEFAULT_SHARED_LOADER_CONFIG,
3252
+ Et as ELASTIC_PRESETS,
3253
+ oe as EntryAnimationEngine,
3254
+ Ce as FUNCTIONAL_CSS,
3255
+ Me as GoogleDriveLoader,
3256
+ ce as GridPlacementLayout,
3257
+ Le as ImageCloud,
3258
+ Te as ImageFilter,
3259
+ Le as ImageGallery,
3260
+ fe as LayoutEngine,
3261
+ ae as RadialPlacementLayout,
3262
+ se as RandomPlacementLayout,
3263
+ de as SpiralPlacementLayout,
3264
+ ze as StaticImageLoader,
3265
+ It as WAVE_PATH_PRESETS,
3266
+ me as WavePlacementLayout,
3267
+ ve as ZoomEngine,
3268
+ ee as animatePath,
3269
+ Re as injectFunctionalStyles,
3270
+ ie as requiresJSAnimation
3256
3271
  };
3257
3272
  //# sourceMappingURL=image-cloud.js.map