@marianmeres/stuic 2.43.0 → 2.44.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.
|
@@ -75,6 +75,8 @@
|
|
|
75
75
|
) => void;
|
|
76
76
|
/** optional "do not display file name" switch flag */
|
|
77
77
|
noName?: boolean;
|
|
78
|
+
/** When true (default), panning is clamped to keep image within bounds */
|
|
79
|
+
clampPan?: boolean;
|
|
78
80
|
}
|
|
79
81
|
|
|
80
82
|
export function getAssetIcon(ext?: string) {
|
|
@@ -181,6 +183,7 @@
|
|
|
181
183
|
classControls = "",
|
|
182
184
|
onDelete,
|
|
183
185
|
noName,
|
|
186
|
+
clampPan = false,
|
|
184
187
|
}: Props = $props();
|
|
185
188
|
|
|
186
189
|
let assets: AssetPreviewNormalized[] = $derived(
|
|
@@ -256,7 +259,7 @@
|
|
|
256
259
|
}
|
|
257
260
|
|
|
258
261
|
// Clamp pan values to keep image within bounds
|
|
259
|
-
function
|
|
262
|
+
function getClampedPan(newPanX: number, newPanY: number): { x: number; y: number } {
|
|
260
263
|
if (!imgEl || !containerEl) return { x: newPanX, y: newPanY };
|
|
261
264
|
|
|
262
265
|
const imgRect = imgEl.getBoundingClientRect();
|
|
@@ -326,9 +329,14 @@
|
|
|
326
329
|
const newPanX = startPanX + (clientX - startMouseX);
|
|
327
330
|
const newPanY = startPanY + (clientY - startMouseY);
|
|
328
331
|
|
|
329
|
-
|
|
330
|
-
|
|
331
|
-
|
|
332
|
+
if (clampPan) {
|
|
333
|
+
const clamped = getClampedPan(newPanX, newPanY);
|
|
334
|
+
panX = clamped.x;
|
|
335
|
+
panY = clamped.y;
|
|
336
|
+
} else {
|
|
337
|
+
panX = newPanX;
|
|
338
|
+
panY = newPanY;
|
|
339
|
+
}
|
|
332
340
|
}
|
|
333
341
|
|
|
334
342
|
function panEnd() {
|
|
@@ -24,6 +24,8 @@ export interface Props {
|
|
|
24
24
|
}) => void;
|
|
25
25
|
/** optional "do not display file name" switch flag */
|
|
26
26
|
noName?: boolean;
|
|
27
|
+
/** When true (default), panning is clamped to keep image within bounds */
|
|
28
|
+
clampPan?: boolean;
|
|
27
29
|
}
|
|
28
30
|
export declare function getAssetIcon(ext?: string): CallableFunction;
|
|
29
31
|
declare const AssetsPreview: import("svelte").Component<Props, {
|