[FEAT] Prevent canvas from resizing when hiding layers

src/components/SpriteCanvas.vue

@@ -319,12 +319,14 @@
   const gridMetrics = computed(() => calculateMaxDimensions());
 
   const totalCells = computed(() => {
-    const maxLen = Math.max(1, ...props.layers.map(l => (l.visible ? l.sprites.length : 1)));
+    // Use all layers regardless of visibility to keep canvas size stable
+    const maxLen = Math.max(1, ...props.layers.map(l => l.sprites.length));
     return Math.max(1, Math.ceil(maxLen / props.columns)) * props.columns;
   });
 
   const gridDimensions = computed(() => {
-    const maxLen = Math.max(1, ...props.layers.map(l => (l.visible ? l.sprites.length : 1)));
+    // Use all layers regardless of visibility to keep canvas size stable
+    const maxLen = Math.max(1, ...props.layers.map(l => l.sprites.length));
     const rows = Math.max(1, Math.ceil(maxLen / props.columns));
     return {
       width: gridMetrics.value.maxWidth * props.columns,

src/components/SpritePreview.vue

@@ -428,7 +428,8 @@
 
   // Computed cell dimensions
   const cellDimensions = computed(() => {
-    const visibleLayers = getVisibleLayers();
+    // Use ALL layers (regardless of visibility) to keep preview size stable
+    const allLayers = props.layers;
     // If manual cell size is enabled, use manual values
     if (settingsStore.manualCellSizeEnabled) {
       return {
@@ -438,9 +439,9 @@
       };
     }
 
-    // Otherwise, calculate from sprite dimensions
+    // Otherwise, calculate from sprite dimensions across ALL layers
-    const { maxWidth, maxHeight } = getMaxDimensionsAcrossLayers(visibleLayers);
+    const { maxWidth, maxHeight } = getMaxDimensionsAcrossLayers(allLayers);
-    const allSprites = visibleLayers.flatMap(l => l.sprites);
+    const allSprites = allLayers.flatMap(l => l.sprites);
     const negativeSpacing = calculateNegativeSpacing(allSprites, settingsStore.negativeSpacingEnabled);
     return {
       cellWidth: maxWidth + negativeSpacing,

src/composables/useDragSprite.ts

@@ -89,9 +89,9 @@ export function useDragSprite(options: DragSpriteOptions) {
     }
 
     // Get all sprites to calculate dimensions from
-    // If layers are provided, use all visible layers; otherwise use current sprites
+    // If layers are provided, use ALL layers (regardless of visibility) to keep canvas size stable
     const layers = getLayers();
-    const spritesToMeasure = layers ? layers.filter(l => l.visible).flatMap(l => l.sprites) : getSprites();
+    const spritesToMeasure = layers ? layers.flatMap(l => l.sprites) : getSprites();
 
     // Otherwise, calculate based on sprite dimensions across all visible layers
     const base = getMaxDimensions(spritesToMeasure);

src/composables/useLayers.ts

@@ -357,6 +357,7 @@ export const useLayers = () => {
 };
 
 export const getMaxDimensionsAcrossLayers = (layers: Layer[]) => {
-  const sprites = layers.flatMap(l => (l.visible ? l.sprites : []));
+  // Consider ALL layers regardless of visibility to keep canvas size stable
+  const sprites = layers.flatMap(l => l.sprites);
   return getMaxDimensionsSingle(sprites);
 };