@frybynite/image-cloud 0.9.1 → 0.9.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/image-cloud-auto-init.js +401 -423
- package/dist/image-cloud-auto-init.js.map +1 -1
- package/dist/image-cloud.js +9 -30
- package/dist/image-cloud.js.map +1 -1
- package/dist/image-cloud.umd.js +3 -3
- package/dist/image-cloud.umd.js.map +1 -1
- package/dist/index.d.ts +9 -14
- package/dist/react.d.ts +9 -14
- package/dist/react.js +8 -30
- package/dist/react.js.map +1 -1
- package/dist/vue.d.ts +9 -14
- package/dist/vue.js +8 -30
- package/dist/vue.js.map +1 -1
- package/dist/web-component.d.ts +9 -14
- package/dist/web-component.js +44 -66
- package/dist/web-component.js.map +1 -1
- package/package.json +1 -1
package/dist/vue.d.ts
CHANGED
|
@@ -11,7 +11,6 @@ export declare interface AnimationConfig {
|
|
|
11
11
|
duration: number;
|
|
12
12
|
easing: AnimationEasingConfig;
|
|
13
13
|
queue: AnimationQueueConfig;
|
|
14
|
-
performance?: AnimationPerformanceConfig;
|
|
15
14
|
entry?: EntryAnimationConfig;
|
|
16
15
|
idle?: IdleAnimationConfig;
|
|
17
16
|
}
|
|
@@ -123,11 +122,6 @@ declare interface AnimationParams {
|
|
|
123
122
|
easing: string;
|
|
124
123
|
}
|
|
125
124
|
|
|
126
|
-
declare interface AnimationPerformanceConfig {
|
|
127
|
-
useGPU?: boolean;
|
|
128
|
-
reduceMotion?: boolean;
|
|
129
|
-
}
|
|
130
|
-
|
|
131
125
|
declare interface AnimationQueueConfig {
|
|
132
126
|
enabled: boolean;
|
|
133
127
|
interval: number;
|
|
@@ -562,11 +556,6 @@ export declare const FUNCTIONAL_CSS = "\n.fbn-ic-gallery {\n position: relative
|
|
|
562
556
|
|
|
563
557
|
export declare type GalleryConfig = ImageCloudConfig;
|
|
564
558
|
|
|
565
|
-
declare interface GestureInteractionConfig {
|
|
566
|
-
pinchToZoom?: boolean;
|
|
567
|
-
doubleTapToFocus?: boolean;
|
|
568
|
-
}
|
|
569
|
-
|
|
570
559
|
export declare interface GoogleDriveFilesSource {
|
|
571
560
|
files: string[];
|
|
572
561
|
}
|
|
@@ -721,6 +710,14 @@ declare interface HoneycombAlgorithmConfig {
|
|
|
721
710
|
spacing?: number;
|
|
722
711
|
}
|
|
723
712
|
|
|
713
|
+
export declare class HoneycombPlacementLayout implements PlacementLayout {
|
|
714
|
+
private config;
|
|
715
|
+
constructor(config: LayoutConfig, _imageConfig?: ImageConfig);
|
|
716
|
+
generate(imageCount: number, containerBounds: ContainerBounds, options?: Partial<LayoutConfig> & {
|
|
717
|
+
fixedHeight?: number;
|
|
718
|
+
}): ImageLayout[];
|
|
719
|
+
}
|
|
720
|
+
|
|
724
721
|
declare interface IdleAnimationConfig {
|
|
725
722
|
type: IdleAnimationType;
|
|
726
723
|
wiggle?: IdleWiggleConfig;
|
|
@@ -1056,8 +1053,7 @@ export declare function injectFunctionalStyles(): void;
|
|
|
1056
1053
|
declare interface InteractionConfig {
|
|
1057
1054
|
focus: FocusInteractionConfig;
|
|
1058
1055
|
navigation?: NavigationInteractionConfig;
|
|
1059
|
-
|
|
1060
|
-
disableDragging?: boolean;
|
|
1056
|
+
dragging?: boolean;
|
|
1061
1057
|
}
|
|
1062
1058
|
|
|
1063
1059
|
export declare type LayoutAlgorithm = 'random' | 'radial' | 'grid' | 'spiral' | 'cluster' | 'wave' | 'honeycomb';
|
|
@@ -1153,7 +1149,6 @@ declare interface LayoutEngineConfig {
|
|
|
1153
1149
|
|
|
1154
1150
|
declare interface LayoutSpacingConfig {
|
|
1155
1151
|
padding: number;
|
|
1156
|
-
minGap: number;
|
|
1157
1152
|
}
|
|
1158
1153
|
|
|
1159
1154
|
export declare type LoaderEntry = StaticLoaderEntry | GoogleDriveLoaderEntry;
|
package/dist/vue.js
CHANGED
|
@@ -116,10 +116,8 @@ const mt = Object.freeze({
|
|
|
116
116
|
densityFactor: 1,
|
|
117
117
|
// Default density
|
|
118
118
|
spacing: Object.freeze({
|
|
119
|
-
padding: 50
|
|
119
|
+
padding: 50
|
|
120
120
|
// padding from viewport edges
|
|
121
|
-
minGap: 20
|
|
122
|
-
// minimum spacing between images
|
|
123
121
|
})
|
|
124
122
|
}),
|
|
125
123
|
// Pattern-based animation configuration
|
|
@@ -140,12 +138,6 @@ const mt = Object.freeze({
|
|
|
140
138
|
interval: 150
|
|
141
139
|
// ms between processing queue items (when enabled)
|
|
142
140
|
}),
|
|
143
|
-
performance: Object.freeze({
|
|
144
|
-
useGPU: void 0,
|
|
145
|
-
// STUB: Not implemented yet
|
|
146
|
-
reduceMotion: void 0
|
|
147
|
-
// STUB: Not implemented yet
|
|
148
|
-
}),
|
|
149
141
|
entry: Object.freeze({
|
|
150
142
|
start: Object.freeze({
|
|
151
143
|
position: "nearest-edge",
|
|
@@ -180,20 +172,12 @@ const mt = Object.freeze({
|
|
|
180
172
|
// Use default animation duration
|
|
181
173
|
}),
|
|
182
174
|
navigation: Object.freeze({
|
|
183
|
-
keyboard:
|
|
184
|
-
|
|
185
|
-
swipe: void 0,
|
|
186
|
-
// STUB: Not implemented yet
|
|
175
|
+
keyboard: !0,
|
|
176
|
+
swipe: !0,
|
|
187
177
|
mouseWheel: void 0
|
|
188
178
|
// STUB: Not implemented yet
|
|
189
179
|
}),
|
|
190
|
-
|
|
191
|
-
pinchToZoom: void 0,
|
|
192
|
-
// STUB: Not implemented yet
|
|
193
|
-
doubleTapToFocus: void 0
|
|
194
|
-
// STUB: Not implemented yet
|
|
195
|
-
}),
|
|
196
|
-
disableDragging: !1
|
|
180
|
+
dragging: !0
|
|
197
181
|
}),
|
|
198
182
|
// Pattern-based rendering configuration
|
|
199
183
|
rendering: Object.freeze({
|
|
@@ -327,9 +311,6 @@ function oe(o = {}) {
|
|
|
327
311
|
}), o.animation.queue && (s.animation.queue = {
|
|
328
312
|
...E.animation.queue,
|
|
329
313
|
...o.animation.queue
|
|
330
|
-
}), o.animation.performance && (s.animation.performance = {
|
|
331
|
-
...E.animation.performance,
|
|
332
|
-
...o.animation.performance
|
|
333
314
|
}), o.animation.entry && (s.animation.entry = {
|
|
334
315
|
...E.animation.entry,
|
|
335
316
|
...o.animation.entry,
|
|
@@ -354,9 +335,6 @@ function oe(o = {}) {
|
|
|
354
335
|
}), o.interaction.navigation && (s.interaction.navigation = {
|
|
355
336
|
...E.interaction.navigation,
|
|
356
337
|
...o.interaction.navigation
|
|
357
|
-
}), o.interaction.gestures && (s.interaction.gestures = {
|
|
358
|
-
...E.interaction.gestures,
|
|
359
|
-
...o.interaction.gestures
|
|
360
338
|
})), o.rendering && (s.rendering = {
|
|
361
339
|
...E.rendering,
|
|
362
340
|
...o.rendering
|
|
@@ -3329,14 +3307,14 @@ let si = class {
|
|
|
3329
3307
|
this.containerEl = this.containerRef;
|
|
3330
3308
|
else if (this.containerEl = document.getElementById(this.containerId), !this.containerEl)
|
|
3331
3309
|
throw new Error(`Container #${this.containerId} not found`);
|
|
3332
|
-
this.containerEl.classList.add("fbn-ic-gallery"), this.swipeEngine = new bt(this.containerEl, {
|
|
3310
|
+
this.containerEl.classList.add("fbn-ic-gallery"), this.containerEl.setAttribute("tabindex", "0"), this.fullConfig.interaction.navigation?.swipe !== !1 && (this.swipeEngine = new bt(this.containerEl, {
|
|
3333
3311
|
onNext: () => this.navigateToNextImage(),
|
|
3334
3312
|
onPrev: () => this.navigateToPreviousImage(),
|
|
3335
3313
|
onDragOffset: (t) => this.zoomEngine.setDragOffset(t),
|
|
3336
3314
|
onDragEnd: (t) => {
|
|
3337
3315
|
t ? this.zoomEngine.clearDragOffset(!1) : this.zoomEngine.clearDragOffset(!0, Ke);
|
|
3338
3316
|
}
|
|
3339
|
-
}), this.setupUI(), this.setupEventListeners(), this.logDebug("ImageCloud initialized"), await this.loadImages();
|
|
3317
|
+
})), this.setupUI(), this.setupEventListeners(), this.logDebug("ImageCloud initialized"), await this.loadImages();
|
|
3340
3318
|
} catch (t) {
|
|
3341
3319
|
console.error("Gallery initialization failed:", t), this.errorEl && t instanceof Error && this.showError("Gallery failed to initialize: " + t.message);
|
|
3342
3320
|
}
|
|
@@ -3365,7 +3343,7 @@ let si = class {
|
|
|
3365
3343
|
return t.className = "fbn-ic-counter fbn-ic-hidden", this.containerEl.appendChild(t), t;
|
|
3366
3344
|
}
|
|
3367
3345
|
setupEventListeners() {
|
|
3368
|
-
|
|
3346
|
+
this.fullConfig.interaction.navigation?.keyboard !== !1 && this.containerEl.addEventListener("keydown", (t) => {
|
|
3369
3347
|
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());
|
|
3370
3348
|
}), document.addEventListener("click", (t) => {
|
|
3371
3349
|
this.swipeEngine?.hadRecentTouch() || t.target.closest(".fbn-ic-image") || (this.zoomEngine.unfocusImage(), this.currentFocusIndex = null, this.swipeEngine?.disable(), this.hideCounter());
|
|
@@ -3539,7 +3517,7 @@ let si = class {
|
|
|
3539
3517
|
h.style.left = `${d - 6}px`, h.style.top = `${f - 6}px`, h.title = `Image ${u}: center (${Math.round(d)}, ${Math.round(f)})`, this.containerEl.appendChild(h);
|
|
3540
3518
|
})), t.forEach((l, u) => {
|
|
3541
3519
|
const h = document.createElement("img");
|
|
3542
|
-
h.referrerPolicy = "no-referrer", h.classList.add("fbn-ic-image"), this.fullConfig.interaction.
|
|
3520
|
+
h.referrerPolicy = "no-referrer", h.classList.add("fbn-ic-image"), this.fullConfig.interaction.dragging === !1 && (h.draggable = !1), h.dataset.imageId = String(u), h.dataset.createdFlag = "true";
|
|
3543
3521
|
const d = a[u];
|
|
3544
3522
|
h.style.position = "absolute", h.style.width = "auto", h.style.height = `${i}px`, h.style.left = `${d.x}px`, h.style.top = `${d.y}px`, d.zIndex && (h.style.zIndex = String(d.zIndex)), st(h, this.defaultClassName), h.addEventListener("mouseenter", () => {
|
|
3545
3523
|
if (this.hoveredImage = { element: h, layout: d }, !this.zoomEngine.isInvolved(h)) {
|