@frybynite/image-cloud 0.9.0 → 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 +402 -425
- package/dist/image-cloud-auto-init.js.map +1 -1
- package/dist/image-cloud.js +10 -32
- 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 +9 -32
- package/dist/react.js.map +1 -1
- package/dist/vue.d.ts +9 -14
- package/dist/vue.js +9 -32
- package/dist/vue.js.map +1 -1
- package/dist/web-component.d.ts +9 -14
- package/dist/web-component.js +45 -68
- 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,15 +122,9 @@ 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;
|
|
134
|
-
maxConcurrent?: number;
|
|
135
128
|
}
|
|
136
129
|
|
|
137
130
|
/**
|
|
@@ -563,11 +556,6 @@ export declare const FUNCTIONAL_CSS = "\n.fbn-ic-gallery {\n position: relative
|
|
|
563
556
|
|
|
564
557
|
export declare type GalleryConfig = ImageCloudConfig;
|
|
565
558
|
|
|
566
|
-
declare interface GestureInteractionConfig {
|
|
567
|
-
pinchToZoom?: boolean;
|
|
568
|
-
doubleTapToFocus?: boolean;
|
|
569
|
-
}
|
|
570
|
-
|
|
571
559
|
export declare interface GoogleDriveFilesSource {
|
|
572
560
|
files: string[];
|
|
573
561
|
}
|
|
@@ -722,6 +710,14 @@ declare interface HoneycombAlgorithmConfig {
|
|
|
722
710
|
spacing?: number;
|
|
723
711
|
}
|
|
724
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
|
+
|
|
725
721
|
declare interface IdleAnimationConfig {
|
|
726
722
|
type: IdleAnimationType;
|
|
727
723
|
wiggle?: IdleWiggleConfig;
|
|
@@ -1057,7 +1053,7 @@ export declare function injectFunctionalStyles(): void;
|
|
|
1057
1053
|
declare interface InteractionConfig {
|
|
1058
1054
|
focus: FocusInteractionConfig;
|
|
1059
1055
|
navigation?: NavigationInteractionConfig;
|
|
1060
|
-
|
|
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
|
|
@@ -137,16 +135,8 @@ const mt = Object.freeze({
|
|
|
137
135
|
queue: Object.freeze({
|
|
138
136
|
enabled: !0,
|
|
139
137
|
// When false, all images display simultaneously
|
|
140
|
-
interval: 150
|
|
138
|
+
interval: 150
|
|
141
139
|
// ms between processing queue items (when enabled)
|
|
142
|
-
maxConcurrent: void 0
|
|
143
|
-
// STUB: Not implemented yet
|
|
144
|
-
}),
|
|
145
|
-
performance: Object.freeze({
|
|
146
|
-
useGPU: void 0,
|
|
147
|
-
// STUB: Not implemented yet
|
|
148
|
-
reduceMotion: void 0
|
|
149
|
-
// STUB: Not implemented yet
|
|
150
140
|
}),
|
|
151
141
|
entry: Object.freeze({
|
|
152
142
|
start: Object.freeze({
|
|
@@ -182,19 +172,12 @@ const mt = Object.freeze({
|
|
|
182
172
|
// Use default animation duration
|
|
183
173
|
}),
|
|
184
174
|
navigation: Object.freeze({
|
|
185
|
-
keyboard:
|
|
186
|
-
|
|
187
|
-
swipe: void 0,
|
|
188
|
-
// STUB: Not implemented yet
|
|
175
|
+
keyboard: !0,
|
|
176
|
+
swipe: !0,
|
|
189
177
|
mouseWheel: void 0
|
|
190
178
|
// STUB: Not implemented yet
|
|
191
179
|
}),
|
|
192
|
-
|
|
193
|
-
pinchToZoom: void 0,
|
|
194
|
-
// STUB: Not implemented yet
|
|
195
|
-
doubleTapToFocus: void 0
|
|
196
|
-
// STUB: Not implemented yet
|
|
197
|
-
})
|
|
180
|
+
dragging: !0
|
|
198
181
|
}),
|
|
199
182
|
// Pattern-based rendering configuration
|
|
200
183
|
rendering: Object.freeze({
|
|
@@ -328,9 +311,6 @@ function oe(o = {}) {
|
|
|
328
311
|
}), o.animation.queue && (s.animation.queue = {
|
|
329
312
|
...E.animation.queue,
|
|
330
313
|
...o.animation.queue
|
|
331
|
-
}), o.animation.performance && (s.animation.performance = {
|
|
332
|
-
...E.animation.performance,
|
|
333
|
-
...o.animation.performance
|
|
334
314
|
}), o.animation.entry && (s.animation.entry = {
|
|
335
315
|
...E.animation.entry,
|
|
336
316
|
...o.animation.entry,
|
|
@@ -355,9 +335,6 @@ function oe(o = {}) {
|
|
|
355
335
|
}), o.interaction.navigation && (s.interaction.navigation = {
|
|
356
336
|
...E.interaction.navigation,
|
|
357
337
|
...o.interaction.navigation
|
|
358
|
-
}), o.interaction.gestures && (s.interaction.gestures = {
|
|
359
|
-
...E.interaction.gestures,
|
|
360
|
-
...o.interaction.gestures
|
|
361
338
|
})), o.rendering && (s.rendering = {
|
|
362
339
|
...E.rendering,
|
|
363
340
|
...o.rendering
|
|
@@ -3330,14 +3307,14 @@ let si = class {
|
|
|
3330
3307
|
this.containerEl = this.containerRef;
|
|
3331
3308
|
else if (this.containerEl = document.getElementById(this.containerId), !this.containerEl)
|
|
3332
3309
|
throw new Error(`Container #${this.containerId} not found`);
|
|
3333
|
-
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, {
|
|
3334
3311
|
onNext: () => this.navigateToNextImage(),
|
|
3335
3312
|
onPrev: () => this.navigateToPreviousImage(),
|
|
3336
3313
|
onDragOffset: (t) => this.zoomEngine.setDragOffset(t),
|
|
3337
3314
|
onDragEnd: (t) => {
|
|
3338
3315
|
t ? this.zoomEngine.clearDragOffset(!1) : this.zoomEngine.clearDragOffset(!0, Ke);
|
|
3339
3316
|
}
|
|
3340
|
-
}), this.setupUI(), this.setupEventListeners(), this.logDebug("ImageCloud initialized"), await this.loadImages();
|
|
3317
|
+
})), this.setupUI(), this.setupEventListeners(), this.logDebug("ImageCloud initialized"), await this.loadImages();
|
|
3341
3318
|
} catch (t) {
|
|
3342
3319
|
console.error("Gallery initialization failed:", t), this.errorEl && t instanceof Error && this.showError("Gallery failed to initialize: " + t.message);
|
|
3343
3320
|
}
|
|
@@ -3366,7 +3343,7 @@ let si = class {
|
|
|
3366
3343
|
return t.className = "fbn-ic-counter fbn-ic-hidden", this.containerEl.appendChild(t), t;
|
|
3367
3344
|
}
|
|
3368
3345
|
setupEventListeners() {
|
|
3369
|
-
|
|
3346
|
+
this.fullConfig.interaction.navigation?.keyboard !== !1 && this.containerEl.addEventListener("keydown", (t) => {
|
|
3370
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());
|
|
3371
3348
|
}), document.addEventListener("click", (t) => {
|
|
3372
3349
|
this.swipeEngine?.hadRecentTouch() || t.target.closest(".fbn-ic-image") || (this.zoomEngine.unfocusImage(), this.currentFocusIndex = null, this.swipeEngine?.disable(), this.hideCounter());
|
|
@@ -3540,7 +3517,7 @@ let si = class {
|
|
|
3540
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);
|
|
3541
3518
|
})), t.forEach((l, u) => {
|
|
3542
3519
|
const h = document.createElement("img");
|
|
3543
|
-
h.referrerPolicy = "no-referrer", h.classList.add("fbn-ic-image"), h.dataset.imageId = String(u), h.dataset.createdFlag = "true";
|
|
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";
|
|
3544
3521
|
const d = a[u];
|
|
3545
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", () => {
|
|
3546
3523
|
if (this.hoveredImage = { element: h, layout: d }, !this.zoomEngine.isInvolved(h)) {
|