chore: bump version to v6.4.0

Currently translated at 100.0% (2073 of 2073 strings)

Co-authored-by: Linos <linos.coding@gmail.com>
Translate-URL: https://hosted.weblate.org/projects/invokeai/web-ui/vi/
Translation: InvokeAI/Web UI

.github/workflows/build-container.yml

@@ -45,6 +45,9 @@ jobs:
     steps:
       - name: Free up more disk space on the runner
         # https://github.com/actions/runner-images/issues/2840#issuecomment-1284059930
+        # the /mnt dir has 70GBs of free space
+        # /dev/sda1        74G   28K   70G   1% /mnt
+        # According to some online posts the /mnt is not always there, so checking before setting docker to use it
         run: |
           echo "----- Free space before cleanup"
           df -h
@@ -52,6 +55,11 @@ jobs:
           sudo rm -rf "$AGENT_TOOLSDIRECTORY"
           sudo swapoff /mnt/swapfile
           sudo rm -rf /mnt/swapfile
+          if [ -d /mnt ]; then
+            sudo chmod -R 777 /mnt
+            echo '{"data-root": "/mnt/docker-root"}' | sudo tee /etc/docker/daemon.json
+            sudo systemctl restart docker
+          fi
           echo "----- Free space after cleanup"
           df -h
 

docs/contributing/MODEL_MANAGER.md

@@ -265,7 +265,7 @@ If the key is unrecognized, this call raises an
 
 #### exists(key) -> AnyModelConfig
 
-Returns True if a model with the given key exists in the databsae.
+Returns True if a model with the given key exists in the database.
 
 #### search_by_path(path) -> AnyModelConfig
 
@@ -718,7 +718,7 @@ When downloading remote models is implemented, additional
 configuration information, such as list of trigger terms, will be
 retrieved from the HuggingFace and Civitai model repositories.
 
-The probed values can be overriden by providing a dictionary in the
+The probed values can be overridden by providing a dictionary in the
 optional `config` argument passed to `import_model()`. You may provide
 overriding values for any of the model's configuration
 attributes. Here is an example of setting the
@@ -841,7 +841,7 @@ variable.
 
 #### installer.start(invoker)
 
-The `start` method is called by the API intialization routines when
+The `start` method is called by the API initialization routines when
 the API starts up. Its effect is to call `sync_to_config()` to
 synchronize the model record store database with what's currently on
 disk.

docs/contributing/contributors.md

@@ -16,7 +16,7 @@ We thank [all contributors](https://github.com/invoke-ai/InvokeAI/graphs/contrib
 - @psychedelicious (Spencer Mabrito) - Web Team Leader
 - @joshistoast (Josh Corbett) - Web Development
 - @cheerio (Mary Rogers) - Lead Engineer & Web App Development
-- @ebr (Eugene Brodsky) - Cloud/DevOps/Sofware engineer; your friendly neighbourhood cluster-autoscaler
+- @ebr (Eugene Brodsky) - Cloud/DevOps/Software engineer; your friendly neighbourhood cluster-autoscaler
 - @sunija - Standalone version
 - @brandon (Brandon Rising) - Platform, Infrastructure, Backend Systems
 - @ryanjdick (Ryan Dick) - Machine Learning & Training

docs/nodes/NODES.md

@@ -41,7 +41,7 @@ Nodes have a "Use Cache" option in their footer. This allows for performance imp
 
 There are several node grouping concepts that can be examined with a narrow focus. These (and other) groupings can be pieced together to make up functional graph setups, and are important to understanding how groups of nodes work together as part of a whole. Note that the screenshots below aren't examples of complete functioning node graphs (see Examples).
 
-### Noise
+### Create Latent Noise
 
 An initial noise tensor is necessary for the latent diffusion process. As a result, the Denoising node requires a noise node input.  
 

invokeai/app/api_app.py

@@ -157,6 +157,12 @@ def overridden_redoc() -> HTMLResponse:
 
 web_root_path = Path(list(web_dir.__path__)[0])
 
+if app_config.unsafe_disable_picklescan:
+    logger.warning(
+        "The unsafe_disable_picklescan option is enabled. This disables malware scanning while installing and"
+        "loading models, which may allow malicious code to be executed. Use at your own risk."
+    )
+
 try:
     app.mount("/", NoCacheStaticFiles(directory=Path(web_root_path, "dist"), html=True), name="ui")
 except RuntimeError:

invokeai/app/invocations/cogview4_image_to_latents.py

@@ -17,6 +17,7 @@ from invokeai.app.services.shared.invocation_context import InvocationContext
 from invokeai.backend.model_manager.load.load_base import LoadedModel
 from invokeai.backend.stable_diffusion.diffusers_pipeline import image_resized_to_grid_as_tensor
 from invokeai.backend.util.devices import TorchDevice
+from invokeai.backend.util.vae_working_memory import estimate_vae_working_memory_cogview4
 
 # TODO(ryand): This is effectively a copy of SD3ImageToLatentsInvocation and a subset of ImageToLatentsInvocation. We
 # should refactor to avoid this duplication.
@@ -38,7 +39,11 @@ class CogView4ImageToLatentsInvocation(BaseInvocation, WithMetadata, WithBoard):
 
     @staticmethod
     def vae_encode(vae_info: LoadedModel, image_tensor: torch.Tensor) -> torch.Tensor:
-        with vae_info as vae:
+        assert isinstance(vae_info.model, AutoencoderKL)
+        estimated_working_memory = estimate_vae_working_memory_cogview4(
+            operation="encode", image_tensor=image_tensor, vae=vae_info.model
+        )
+        with vae_info.model_on_device(working_mem_bytes=estimated_working_memory) as (_, vae):
             assert isinstance(vae, AutoencoderKL)
 
             vae.disable_tiling()
@@ -62,6 +67,8 @@ class CogView4ImageToLatentsInvocation(BaseInvocation, WithMetadata, WithBoard):
             image_tensor = einops.rearrange(image_tensor, "c h w -> 1 c h w")
 
         vae_info = context.models.load(self.vae.vae)
+        assert isinstance(vae_info.model, AutoencoderKL)
+
         latents = self.vae_encode(vae_info=vae_info, image_tensor=image_tensor)
 
         latents = latents.to("cpu")

invokeai/app/invocations/cogview4_latents_to_image.py

@@ -6,7 +6,6 @@ from einops import rearrange
 from PIL import Image
 
 from invokeai.app.invocations.baseinvocation import BaseInvocation, Classification, invocation
-from invokeai.app.invocations.constants import LATENT_SCALE_FACTOR
 from invokeai.app.invocations.fields import (
     FieldDescriptions,
     Input,
@@ -20,6 +19,7 @@ from invokeai.app.invocations.primitives import ImageOutput
 from invokeai.app.services.shared.invocation_context import InvocationContext
 from invokeai.backend.stable_diffusion.extensions.seamless import SeamlessExt
 from invokeai.backend.util.devices import TorchDevice
+from invokeai.backend.util.vae_working_memory import estimate_vae_working_memory_cogview4
 
 # TODO(ryand): This is effectively a copy of SD3LatentsToImageInvocation and a subset of LatentsToImageInvocation. We
 # should refactor to avoid this duplication.
@@ -39,22 +39,15 @@ class CogView4LatentsToImageInvocation(BaseInvocation, WithMetadata, WithBoard):
     latents: LatentsField = InputField(description=FieldDescriptions.latents, input=Input.Connection)
     vae: VAEField = InputField(description=FieldDescriptions.vae, input=Input.Connection)
 
-    def _estimate_working_memory(self, latents: torch.Tensor, vae: AutoencoderKL) -> int:
-        """Estimate the working memory required by the invocation in bytes."""
-        out_h = LATENT_SCALE_FACTOR * latents.shape[-2]
-        out_w = LATENT_SCALE_FACTOR * latents.shape[-1]
-        element_size = next(vae.parameters()).element_size()
-        scaling_constant = 2200  # Determined experimentally.
-        working_memory = out_h * out_w * element_size * scaling_constant
-        return int(working_memory)
-
     @torch.no_grad()
     def invoke(self, context: InvocationContext) -> ImageOutput:
         latents = context.tensors.load(self.latents.latents_name)
 
         vae_info = context.models.load(self.vae.vae)
         assert isinstance(vae_info.model, (AutoencoderKL))
-        estimated_working_memory = self._estimate_working_memory(latents, vae_info.model)
+        estimated_working_memory = estimate_vae_working_memory_cogview4(
+            operation="decode", image_tensor=latents, vae=vae_info.model
+        )
         with (
             SeamlessExt.static_patch_model(vae_info.model, self.vae.seamless_axes),
             vae_info.model_on_device(working_mem_bytes=estimated_working_memory) as (_, vae),

invokeai/app/invocations/flux_denoise.py

@@ -328,6 +328,21 @@ class FluxDenoiseInvocation(BaseInvocation):
             cfg_scale_end_step=self.cfg_scale_end_step,
         )
 
+        kontext_extension = None
+        if self.kontext_conditioning:
+            if not self.controlnet_vae:
+                raise ValueError("A VAE (e.g., controlnet_vae) must be provided to use Kontext conditioning.")
+
+            kontext_extension = KontextExtension(
+                context=context,
+                kontext_conditioning=self.kontext_conditioning
+                if isinstance(self.kontext_conditioning, list)
+                else [self.kontext_conditioning],
+                vae_field=self.controlnet_vae,
+                device=TorchDevice.choose_torch_device(),
+                dtype=inference_dtype,
+            )
+
         with ExitStack() as exit_stack:
             # Prepare ControlNet extensions.
             # Note: We do this before loading the transformer model to minimize peak memory (see implementation).
@@ -385,21 +400,6 @@ class FluxDenoiseInvocation(BaseInvocation):
                 dtype=inference_dtype,
             )
 
-            kontext_extension = None
-            if self.kontext_conditioning:
-                if not self.controlnet_vae:
-                    raise ValueError("A VAE (e.g., controlnet_vae) must be provided to use Kontext conditioning.")
-
-                kontext_extension = KontextExtension(
-                    context=context,
-                    kontext_conditioning=self.kontext_conditioning
-                    if isinstance(self.kontext_conditioning, list)
-                    else [self.kontext_conditioning],
-                    vae_field=self.controlnet_vae,
-                    device=TorchDevice.choose_torch_device(),
-                    dtype=inference_dtype,
-                )
-
             # Prepare Kontext conditioning if provided
             img_cond_seq = None
             img_cond_seq_ids = None

invokeai/app/invocations/flux_vae_decode.py

@@ -3,7 +3,6 @@ from einops import rearrange
 from PIL import Image
 
 from invokeai.app.invocations.baseinvocation import BaseInvocation, invocation
-from invokeai.app.invocations.constants import LATENT_SCALE_FACTOR
 from invokeai.app.invocations.fields import (
     FieldDescriptions,
     Input,
@@ -18,6 +17,7 @@ from invokeai.app.services.shared.invocation_context import InvocationContext
 from invokeai.backend.flux.modules.autoencoder import AutoEncoder
 from invokeai.backend.model_manager.load.load_base import LoadedModel
 from invokeai.backend.util.devices import TorchDevice
+from invokeai.backend.util.vae_working_memory import estimate_vae_working_memory_flux
 
 
 @invocation(
@@ -39,17 +39,11 @@ class FluxVaeDecodeInvocation(BaseInvocation, WithMetadata, WithBoard):
         input=Input.Connection,
     )
 
-    def _estimate_working_memory(self, latents: torch.Tensor, vae: AutoEncoder) -> int:
-        """Estimate the working memory required by the invocation in bytes."""
-        out_h = LATENT_SCALE_FACTOR * latents.shape[-2]
-        out_w = LATENT_SCALE_FACTOR * latents.shape[-1]
-        element_size = next(vae.parameters()).element_size()
-        scaling_constant = 2200  # Determined experimentally.
-        working_memory = out_h * out_w * element_size * scaling_constant
-        return int(working_memory)
-
     def _vae_decode(self, vae_info: LoadedModel, latents: torch.Tensor) -> Image.Image:
-        estimated_working_memory = self._estimate_working_memory(latents, vae_info.model)
+        assert isinstance(vae_info.model, AutoEncoder)
+        estimated_working_memory = estimate_vae_working_memory_flux(
+            operation="decode", image_tensor=latents, vae=vae_info.model
+        )
         with vae_info.model_on_device(working_mem_bytes=estimated_working_memory) as (_, vae):
             assert isinstance(vae, AutoEncoder)
             vae_dtype = next(iter(vae.parameters())).dtype

invokeai/app/invocations/flux_vae_encode.py

@@ -15,6 +15,7 @@ from invokeai.backend.flux.modules.autoencoder import AutoEncoder
 from invokeai.backend.model_manager import LoadedModel
 from invokeai.backend.stable_diffusion.diffusers_pipeline import image_resized_to_grid_as_tensor
 from invokeai.backend.util.devices import TorchDevice
+from invokeai.backend.util.vae_working_memory import estimate_vae_working_memory_flux
 
 
 @invocation(
@@ -41,8 +42,12 @@ class FluxVaeEncodeInvocation(BaseInvocation):
         # TODO(ryand): Write a util function for generating random tensors that is consistent across devices / dtypes.
         # There's a starting point in get_noise(...), but it needs to be extracted and generalized. This function
         # should be used for VAE encode sampling.
+        assert isinstance(vae_info.model, AutoEncoder)
+        estimated_working_memory = estimate_vae_working_memory_flux(
+            operation="encode", image_tensor=image_tensor, vae=vae_info.model
+        )
         generator = torch.Generator(device=TorchDevice.choose_torch_device()).manual_seed(0)
-        with vae_info as vae:
+        with vae_info.model_on_device(working_mem_bytes=estimated_working_memory) as (_, vae):
             assert isinstance(vae, AutoEncoder)
             vae_dtype = next(iter(vae.parameters())).dtype
             image_tensor = image_tensor.to(device=TorchDevice.choose_torch_device(), dtype=vae_dtype)

invokeai/app/invocations/image_to_latents.py

@@ -27,6 +27,7 @@ from invokeai.backend.model_manager import LoadedModel
 from invokeai.backend.stable_diffusion.diffusers_pipeline import image_resized_to_grid_as_tensor
 from invokeai.backend.stable_diffusion.vae_tiling import patch_vae_tiling_params
 from invokeai.backend.util.devices import TorchDevice
+from invokeai.backend.util.vae_working_memory import estimate_vae_working_memory_sd15_sdxl
 
 
 @invocation(
@@ -52,11 +53,24 @@ class ImageToLatentsInvocation(BaseInvocation):
     tile_size: int = InputField(default=0, multiple_of=8, description=FieldDescriptions.vae_tile_size)
     fp32: bool = InputField(default=False, description=FieldDescriptions.fp32)
 
-    @staticmethod
+    @classmethod
     def vae_encode(
-        vae_info: LoadedModel, upcast: bool, tiled: bool, image_tensor: torch.Tensor, tile_size: int = 0
+        cls,
+        vae_info: LoadedModel,
+        upcast: bool,
+        tiled: bool,
+        image_tensor: torch.Tensor,
+        tile_size: int = 0,
     ) -> torch.Tensor:
-        with vae_info as vae:
+        assert isinstance(vae_info.model, (AutoencoderKL, AutoencoderTiny))
+        estimated_working_memory = estimate_vae_working_memory_sd15_sdxl(
+            operation="encode",
+            image_tensor=image_tensor,
+            vae=vae_info.model,
+            tile_size=tile_size if tiled else None,
+            fp32=upcast,
+        )
+        with vae_info.model_on_device(working_mem_bytes=estimated_working_memory) as (_, vae):
             assert isinstance(vae, (AutoencoderKL, AutoencoderTiny))
             orig_dtype = vae.dtype
             if upcast:
@@ -113,6 +127,7 @@ class ImageToLatentsInvocation(BaseInvocation):
         image = context.images.get_pil(self.image.image_name)
 
         vae_info = context.models.load(self.vae.vae)
+        assert isinstance(vae_info.model, (AutoencoderKL, AutoencoderTiny))
 
         image_tensor = image_resized_to_grid_as_tensor(image.convert("RGB"))
         if image_tensor.dim() == 3:
@@ -120,7 +135,11 @@ class ImageToLatentsInvocation(BaseInvocation):
 
         context.util.signal_progress("Running VAE encoder")
         latents = self.vae_encode(
-            vae_info=vae_info, upcast=self.fp32, tiled=self.tiled, image_tensor=image_tensor, tile_size=self.tile_size
+            vae_info=vae_info,
+            upcast=self.fp32,
+            tiled=self.tiled or context.config.get().force_tiled_decode,
+            image_tensor=image_tensor,
+            tile_size=self.tile_size,
         )
 
         latents = latents.to("cpu")

invokeai/app/invocations/latents_to_image.py

@@ -27,6 +27,7 @@ from invokeai.app.services.shared.invocation_context import InvocationContext
 from invokeai.backend.stable_diffusion.extensions.seamless import SeamlessExt
 from invokeai.backend.stable_diffusion.vae_tiling import patch_vae_tiling_params
 from invokeai.backend.util.devices import TorchDevice
+from invokeai.backend.util.vae_working_memory import estimate_vae_working_memory_sd15_sdxl
 
 
 @invocation(
@@ -53,39 +54,6 @@ class LatentsToImageInvocation(BaseInvocation, WithMetadata, WithBoard):
     tile_size: int = InputField(default=0, multiple_of=8, description=FieldDescriptions.vae_tile_size)
     fp32: bool = InputField(default=False, description=FieldDescriptions.fp32)
 
-    def _estimate_working_memory(
-        self, latents: torch.Tensor, use_tiling: bool, vae: AutoencoderKL | AutoencoderTiny
-    ) -> int:
-        """Estimate the working memory required by the invocation in bytes."""
-        # It was found experimentally that the peak working memory scales linearly with the number of pixels and the
-        # element size (precision). This estimate is accurate for both SD1 and SDXL.
-        element_size = 4 if self.fp32 else 2
-        scaling_constant = 2200  # Determined experimentally.
-
-        if use_tiling:
-            tile_size = self.tile_size
-            if tile_size == 0:
-                tile_size = vae.tile_sample_min_size
-                assert isinstance(tile_size, int)
-            out_h = tile_size
-            out_w = tile_size
-            working_memory = out_h * out_w * element_size * scaling_constant
-
-            # We add 25% to the working memory estimate when tiling is enabled to account for factors like tile overlap
-            # and number of tiles. We could make this more precise in the future, but this should be good enough for
-            # most use cases.
-            working_memory = working_memory * 1.25
-        else:
-            out_h = LATENT_SCALE_FACTOR * latents.shape[-2]
-            out_w = LATENT_SCALE_FACTOR * latents.shape[-1]
-            working_memory = out_h * out_w * element_size * scaling_constant
-
-        if self.fp32:
-            # If we are running in FP32, then we should account for the likely increase in model size (~250MB).
-            working_memory += 250 * 2**20
-
-        return int(working_memory)
-
     @torch.no_grad()
     def invoke(self, context: InvocationContext) -> ImageOutput:
         latents = context.tensors.load(self.latents.latents_name)
@@ -94,8 +62,13 @@ class LatentsToImageInvocation(BaseInvocation, WithMetadata, WithBoard):
 
         vae_info = context.models.load(self.vae.vae)
         assert isinstance(vae_info.model, (AutoencoderKL, AutoencoderTiny))
-
-        estimated_working_memory = self._estimate_working_memory(latents, use_tiling, vae_info.model)
+        estimated_working_memory = estimate_vae_working_memory_sd15_sdxl(
+            operation="decode",
+            image_tensor=latents,
+            vae=vae_info.model,
+            tile_size=self.tile_size if use_tiling else None,
+            fp32=self.fp32,
+        )
         with (
             SeamlessExt.static_patch_model(vae_info.model, self.vae.seamless_axes),
             vae_info.model_on_device(working_mem_bytes=estimated_working_memory) as (_, vae),

invokeai/app/invocations/sd3_image_to_latents.py

@@ -17,6 +17,7 @@ from invokeai.app.services.shared.invocation_context import InvocationContext
 from invokeai.backend.model_manager.load.load_base import LoadedModel
 from invokeai.backend.stable_diffusion.diffusers_pipeline import image_resized_to_grid_as_tensor
 from invokeai.backend.util.devices import TorchDevice
+from invokeai.backend.util.vae_working_memory import estimate_vae_working_memory_sd3
 
 
 @invocation(
@@ -34,7 +35,11 @@ class SD3ImageToLatentsInvocation(BaseInvocation, WithMetadata, WithBoard):
 
     @staticmethod
     def vae_encode(vae_info: LoadedModel, image_tensor: torch.Tensor) -> torch.Tensor:
-        with vae_info as vae:
+        assert isinstance(vae_info.model, AutoencoderKL)
+        estimated_working_memory = estimate_vae_working_memory_sd3(
+            operation="encode", image_tensor=image_tensor, vae=vae_info.model
+        )
+        with vae_info.model_on_device(working_mem_bytes=estimated_working_memory) as (_, vae):
             assert isinstance(vae, AutoencoderKL)
 
             vae.disable_tiling()
@@ -58,6 +63,8 @@ class SD3ImageToLatentsInvocation(BaseInvocation, WithMetadata, WithBoard):
             image_tensor = einops.rearrange(image_tensor, "c h w -> 1 c h w")
 
         vae_info = context.models.load(self.vae.vae)
+        assert isinstance(vae_info.model, AutoencoderKL)
+
         latents = self.vae_encode(vae_info=vae_info, image_tensor=image_tensor)
 
         latents = latents.to("cpu")

invokeai/app/invocations/sd3_latents_to_image.py

@@ -6,7 +6,6 @@ from einops import rearrange
 from PIL import Image
 
 from invokeai.app.invocations.baseinvocation import BaseInvocation, invocation
-from invokeai.app.invocations.constants import LATENT_SCALE_FACTOR
 from invokeai.app.invocations.fields import (
     FieldDescriptions,
     Input,
@@ -20,6 +19,7 @@ from invokeai.app.invocations.primitives import ImageOutput
 from invokeai.app.services.shared.invocation_context import InvocationContext
 from invokeai.backend.stable_diffusion.extensions.seamless import SeamlessExt
 from invokeai.backend.util.devices import TorchDevice
+from invokeai.backend.util.vae_working_memory import estimate_vae_working_memory_sd3
 
 
 @invocation(
@@ -41,22 +41,15 @@ class SD3LatentsToImageInvocation(BaseInvocation, WithMetadata, WithBoard):
         input=Input.Connection,
     )
 
-    def _estimate_working_memory(self, latents: torch.Tensor, vae: AutoencoderKL) -> int:
-        """Estimate the working memory required by the invocation in bytes."""
-        out_h = LATENT_SCALE_FACTOR * latents.shape[-2]
-        out_w = LATENT_SCALE_FACTOR * latents.shape[-1]
-        element_size = next(vae.parameters()).element_size()
-        scaling_constant = 2200  # Determined experimentally.
-        working_memory = out_h * out_w * element_size * scaling_constant
-        return int(working_memory)
-
     @torch.no_grad()
     def invoke(self, context: InvocationContext) -> ImageOutput:
         latents = context.tensors.load(self.latents.latents_name)
 
         vae_info = context.models.load(self.vae.vae)
         assert isinstance(vae_info.model, (AutoencoderKL))
-        estimated_working_memory = self._estimate_working_memory(latents, vae_info.model)
+        estimated_working_memory = estimate_vae_working_memory_sd3(
+            operation="decode", image_tensor=latents, vae=vae_info.model
+        )
         with (
             SeamlessExt.static_patch_model(vae_info.model, self.vae.seamless_axes),
             vae_info.model_on_device(working_mem_bytes=estimated_working_memory) as (_, vae),

invokeai/app/services/config/config_default.py

@@ -107,6 +107,7 @@ class InvokeAIAppConfig(BaseSettings):
         hashing_algorithm: Model hashing algorthim for model installs. 'blake3_multi' is best for SSDs. 'blake3_single' is best for spinning disk HDDs. 'random' disables hashing, instead assigning a UUID to models. Useful when using a memory db to reduce model installation time, or if you don't care about storing stable hashes for models. Alternatively, any other hashlib algorithm is accepted, though these are not nearly as performant as blake3.<br>Valid values: `blake3_multi`, `blake3_single`, `random`, `md5`, `sha1`, `sha224`, `sha256`, `sha384`, `sha512`, `blake2b`, `blake2s`, `sha3_224`, `sha3_256`, `sha3_384`, `sha3_512`, `shake_128`, `shake_256`
         remote_api_tokens: List of regular expression and token pairs used when downloading models from URLs. The download URL is tested against the regex, and if it matches, the token is provided in as a Bearer token.
         scan_models_on_startup: Scan the models directory on startup, registering orphaned models. This is typically only used in conjunction with `use_memory_db` for testing purposes.
+        unsafe_disable_picklescan: UNSAFE. Disable the picklescan security check during model installation. Recommended only for development and testing purposes. This will allow arbitrary code execution during model installation, so should never be used in production.
     """
 
     _root: Optional[Path] = PrivateAttr(default=None)
@@ -196,6 +197,7 @@ class InvokeAIAppConfig(BaseSettings):
     hashing_algorithm: HASHING_ALGORITHMS = Field(default="blake3_single",  description="Model hashing algorthim for model installs. 'blake3_multi' is best for SSDs. 'blake3_single' is best for spinning disk HDDs. 'random' disables hashing, instead assigning a UUID to models. Useful when using a memory db to reduce model installation time, or if you don't care about storing stable hashes for models. Alternatively, any other hashlib algorithm is accepted, though these are not nearly as performant as blake3.")
     remote_api_tokens: Optional[list[URLRegexTokenPair]] = Field(default=None, description="List of regular expression and token pairs used when downloading models from URLs. The download URL is tested against the regex, and if it matches, the token is provided in as a Bearer token.")
     scan_models_on_startup:        bool = Field(default=False,              description="Scan the models directory on startup, registering orphaned models. This is typically only used in conjunction with `use_memory_db` for testing purposes.")
+    unsafe_disable_picklescan:     bool = Field(default=False,              description="UNSAFE. Disable the picklescan security check during model installation. Recommended only for development and testing purposes. This will allow arbitrary code execution during model installation, so should never be used in production.")
 
     # fmt: on
 

invokeai/app/services/model_install/model_install_default.py

@@ -186,8 +186,9 @@ class ModelInstallService(ModelInstallServiceBase):
         info: AnyModelConfig = self._probe(Path(model_path), config)  # type: ignore
 
         if preferred_name := config.name:
-            # Careful! Don't use pathlib.Path(...).with_suffix - it can will strip everything after the first dot.
-            preferred_name = f"{preferred_name}{model_path.suffix}"
+            if Path(model_path).is_file():
+                # Careful! Don't use pathlib.Path(...).with_suffix - it can will strip everything after the first dot.
+                preferred_name = f"{preferred_name}{model_path.suffix}"
 
         dest_path = (
             self.app_config.models_path / info.base.value / info.type.value / (preferred_name or model_path.name)
@@ -622,16 +623,13 @@ class ModelInstallService(ModelInstallServiceBase):
         if old_path == new_path:
             return old_path
 
+        if new_path.exists():
+            raise FileExistsError(f"Cannot move {old_path} to {new_path}: destination already exists")
+
         new_path.parent.mkdir(parents=True, exist_ok=True)
 
-        # if path already exists then we jigger the name to make it unique
-        counter: int = 1
-        while new_path.exists():
-            path = new_path.with_stem(new_path.stem + f"_{counter:02d}")
-            if not path.exists():
-                new_path = path
-            counter += 1
         move(old_path, new_path)
+
         return new_path
 
     def _probe(self, model_path: Path, config: Optional[ModelRecordChanges] = None):

invokeai/app/services/model_load/model_load_default.py

@@ -87,9 +87,21 @@ class ModelLoadService(ModelLoadServiceBase):
         def torch_load_file(checkpoint: Path) -> AnyModel:
             scan_result = scan_file_path(checkpoint)
             if scan_result.infected_files != 0:
-                raise Exception(f"The model at {checkpoint} is potentially infected by malware. Aborting load.")
+                if self._app_config.unsafe_disable_picklescan:
+                    self._logger.warning(
+                        f"Model at {checkpoint} is potentially infected by malware, but picklescan is disabled. "
+                        "Proceeding with caution."
+                    )
+                else:
+                    raise Exception(f"The model at {checkpoint} is potentially infected by malware. Aborting load.")
             if scan_result.scan_err:
-                raise Exception(f"Error scanning model at {checkpoint} for malware. Aborting load.")
+                if self._app_config.unsafe_disable_picklescan:
+                    self._logger.warning(
+                        f"Error scanning model at {checkpoint} for malware, but picklescan is disabled. "
+                        "Proceeding with caution."
+                    )
+                else:
+                    raise Exception(f"Error scanning model at {checkpoint} for malware. Aborting load.")
 
             result = torch_load(checkpoint, map_location="cpu")
             return result

invokeai/backend/flux/extensions/kontext_extension.py

@@ -106,8 +106,8 @@ class KontextExtension:
 
         # Track cumulative dimensions for spatial tiling
         # These track the running extent of the virtual canvas in latent space
-        h = 0  # Running height extent
-        w = 0  # Running width extent
+        canvas_h = 0  # Running canvas height
+        canvas_w = 0  # Running canvas width
 
         vae_info = self._context.models.load(self._vae_field.vae)
 
@@ -131,12 +131,20 @@ class KontextExtension:
 
             # Continue with VAE encoding
             # Don't sample from the distribution for reference images - use the mean (matching ComfyUI)
-            with vae_info as vae:
+            # Estimate working memory for encode operation (50% of decode memory requirements)
+            img_h = image_tensor.shape[-2]
+            img_w = image_tensor.shape[-1]
+            element_size = next(vae_info.model.parameters()).element_size()
+            scaling_constant = 1100  # 50% of decode scaling constant (2200)
+            estimated_working_memory = int(img_h * img_w * element_size * scaling_constant)
+
+            with vae_info.model_on_device(working_mem_bytes=estimated_working_memory) as (_, vae):
                 assert isinstance(vae, AutoEncoder)
                 vae_dtype = next(iter(vae.parameters())).dtype
                 image_tensor = image_tensor.to(device=TorchDevice.choose_torch_device(), dtype=vae_dtype)
                 # Use sample=False to get the distribution mean without noise
                 kontext_latents_unpacked = vae.encode(image_tensor, sample=False)
+                TorchDevice.empty_cache()
 
             # Extract tensor dimensions
             batch_size, _, latent_height, latent_width = kontext_latents_unpacked.shape
@@ -154,21 +162,33 @@ class KontextExtension:
             kontext_latents_packed = pack(kontext_latents_unpacked).to(self._device, self._dtype)
 
             # Determine spatial offsets for this reference image
-            # - Compare the potential new canvas dimensions if we add the image vertically vs horizontally
-            # - Choose the placement that results in a more square-like canvas
             h_offset = 0
             w_offset = 0
 
             if idx > 0:  # First image starts at (0, 0)
-                # Check which placement would result in better canvas dimensions
-                # If adding to height would make the canvas taller than wide, tile horizontally
-                # Otherwise, tile vertically
-                if latent_height + h > latent_width + w:
+                # Calculate potential canvas dimensions for each tiling option
+                # Option 1: Tile vertically (below existing content)
+                potential_h_vertical = canvas_h + latent_height
+
+                # Option 2: Tile horizontally (to the right of existing content)
+                potential_w_horizontal = canvas_w + latent_width
+
+                # Choose arrangement that minimizes the maximum dimension
+                # This keeps the canvas closer to square, optimizing attention computation
+                if potential_h_vertical > potential_w_horizontal:
                     # Tile horizontally (to the right of existing images)
-                    w_offset = w
+                    w_offset = canvas_w
+                    canvas_w = canvas_w + latent_width
+                    canvas_h = max(canvas_h, latent_height)
                 else:
                     # Tile vertically (below existing images)
-                    h_offset = h
+                    h_offset = canvas_h
+                    canvas_h = canvas_h + latent_height
+                    canvas_w = max(canvas_w, latent_width)
+            else:
+                # First image - just set canvas dimensions
+                canvas_h = latent_height
+                canvas_w = latent_width
 
             # Generate IDs with both index offset and spatial offsets
             kontext_ids = generate_img_ids_with_offset(
@@ -182,11 +202,6 @@ class KontextExtension:
                 w_offset=w_offset,
             )
 
-            # Update cumulative dimensions
-            # Track the maximum extent of the virtual canvas after placing this image
-            h = max(h, latent_height + h_offset)
-            w = max(w, latent_width + w_offset)
-
             all_latents.append(kontext_latents_packed)
             all_ids.append(kontext_ids)
 

invokeai/backend/model_manager/legacy_probe.py

@@ -9,6 +9,7 @@ import spandrel
 import torch
 
 import invokeai.backend.util.logging as logger
+from invokeai.app.services.config.config_default import get_config
 from invokeai.app.util.misc import uuid_string
 from invokeai.backend.flux.controlnet.state_dict_utils import (
     is_state_dict_instantx_controlnet,
@@ -493,9 +494,21 @@ class ModelProbe(object):
         # scan model
         scan_result = pscan.scan_file_path(checkpoint)
         if scan_result.infected_files != 0:
-            raise Exception(f"The model {model_name} is potentially infected by malware. Aborting import.")
+            if get_config().unsafe_disable_picklescan:
+                logger.warning(
+                    f"The model {model_name} is potentially infected by malware, but picklescan is disabled. "
+                    "Proceeding with caution."
+                )
+            else:
+                raise RuntimeError(f"The model {model_name} is potentially infected by malware. Aborting import.")
         if scan_result.scan_err:
-            raise Exception(f"Error scanning model {model_name} for malware. Aborting import.")
+            if get_config().unsafe_disable_picklescan:
+                logger.warning(
+                    f"Error scanning the model at {model_name} for malware, but picklescan is disabled. "
+                    "Proceeding with caution."
+                )
+            else:
+                raise RuntimeError(f"Error scanning the model at {model_name} for malware. Aborting import.")
 
 
 # Probing utilities

invokeai/backend/model_manager/model_on_disk.py

@@ -6,13 +6,17 @@ import torch
 from picklescan.scanner import scan_file_path
 from safetensors import safe_open
 
+from invokeai.app.services.config.config_default import get_config
 from invokeai.backend.model_hash.model_hash import HASHING_ALGORITHMS, ModelHash
 from invokeai.backend.model_manager.taxonomy import ModelRepoVariant
 from invokeai.backend.quantization.gguf.loaders import gguf_sd_loader
+from invokeai.backend.util.logging import InvokeAILogger
 from invokeai.backend.util.silence_warnings import SilenceWarnings
 
 StateDict: TypeAlias = dict[str | int, Any]  # When are the keys int?
 
+logger = InvokeAILogger.get_logger()
+
 
 class ModelOnDisk:
     """A utility class representing a model stored on disk."""
@@ -79,8 +83,24 @@ class ModelOnDisk:
         with SilenceWarnings():
             if path.suffix.endswith((".ckpt", ".pt", ".pth", ".bin")):
                 scan_result = scan_file_path(path)
-                if scan_result.infected_files != 0 or scan_result.scan_err:
-                    raise RuntimeError(f"The model {path.stem} is potentially infected by malware. Aborting import.")
+                if scan_result.infected_files != 0:
+                    if get_config().unsafe_disable_picklescan:
+                        logger.warning(
+                            f"The model {path.stem} is potentially infected by malware, but picklescan is disabled. "
+                            "Proceeding with caution."
+                        )
+                    else:
+                        raise RuntimeError(
+                            f"The model {path.stem} is potentially infected by malware. Aborting import."
+                        )
+                if scan_result.scan_err:
+                    if get_config().unsafe_disable_picklescan:
+                        logger.warning(
+                            f"Error scanning the model at {path.stem} for malware, but picklescan is disabled. "
+                            "Proceeding with caution."
+                        )
+                    else:
+                        raise RuntimeError(f"Error scanning the model at {path.stem} for malware. Aborting import.")
                 checkpoint = torch.load(path, map_location="cpu")
                 assert isinstance(checkpoint, dict)
             elif path.suffix.endswith(".gguf"):

invokeai/backend/model_manager/starter_models.py

@@ -149,13 +149,29 @@ flux_kontext = StarterModel(
     dependencies=[t5_base_encoder, flux_vae, clip_l_encoder],
 )
 flux_kontext_quantized = StarterModel(
-    name="FLUX.1 Kontext dev (Quantized)",
+    name="FLUX.1 Kontext dev (quantized)",
     base=BaseModelType.Flux,
     source="https://huggingface.co/unsloth/FLUX.1-Kontext-dev-GGUF/resolve/main/flux1-kontext-dev-Q4_K_M.gguf",
     description="FLUX.1 Kontext dev quantized (q4_k_m). Total size with dependencies: ~14GB",
     type=ModelType.Main,
     dependencies=[t5_8b_quantized_encoder, flux_vae, clip_l_encoder],
 )
+flux_krea = StarterModel(
+    name="FLUX.1 Krea dev",
+    base=BaseModelType.Flux,
+    source="https://huggingface.co/InvokeAI/FLUX.1-Krea-dev/resolve/main/flux1-krea-dev.safetensors",
+    description="FLUX.1 Krea dev. Total size with dependencies: ~33GB",
+    type=ModelType.Main,
+    dependencies=[t5_8b_quantized_encoder, flux_vae, clip_l_encoder],
+)
+flux_krea_quantized = StarterModel(
+    name="FLUX.1 Krea dev (quantized)",
+    base=BaseModelType.Flux,
+    source="https://huggingface.co/InvokeAI/FLUX.1-Krea-dev-GGUF/resolve/main/flux1-krea-dev-Q4_K_M.gguf",
+    description="FLUX.1 Krea dev quantized (q4_k_m). Total size with dependencies: ~14GB",
+    type=ModelType.Main,
+    dependencies=[t5_8b_quantized_encoder, flux_vae, clip_l_encoder],
+)
 sd35_medium = StarterModel(
     name="SD3.5 Medium",
     base=BaseModelType.StableDiffusion3,
@@ -580,13 +596,14 @@ t2i_sketch_sdxl = StarterModel(
 )
 # endregion
 # region SpandrelImageToImage
-realesrgan_anime = StarterModel(
-    name="RealESRGAN_x4plus_anime_6B",
+animesharp_v4_rcan = StarterModel(
+    name="2x-AnimeSharpV4_RCAN",
     base=BaseModelType.Any,
-    source="https://github.com/xinntao/Real-ESRGAN/releases/download/v0.2.2.4/RealESRGAN_x4plus_anime_6B.pth",
-    description="A Real-ESRGAN 4x upscaling model (optimized for anime images).",
+    source="https://github.com/Kim2091/Kim2091-Models/releases/download/2x-AnimeSharpV4/2x-AnimeSharpV4_RCAN.safetensors",
+    description="A 2x upscaling model (optimized for anime images).",
     type=ModelType.SpandrelImageToImage,
 )
+
 realesrgan_x4 = StarterModel(
     name="RealESRGAN_x4plus",
     base=BaseModelType.Any,
@@ -732,7 +749,7 @@ STARTER_MODELS: list[StarterModel] = [
     t2i_lineart_sdxl,
     t2i_sketch_sdxl,
     realesrgan_x4,
-    realesrgan_anime,
+    animesharp_v4_rcan,
     realesrgan_x2,
     swinir,
     t5_base_encoder,
@@ -743,6 +760,8 @@ STARTER_MODELS: list[StarterModel] = [
     llava_onevision,
     flux_fill,
     cogview4,
+    flux_krea,
+    flux_krea_quantized,
 ]
 
 sd1_bundle: list[StarterModel] = [
@@ -794,6 +813,7 @@ flux_bundle: list[StarterModel] = [
     flux_redux,
     flux_fill,
     flux_kontext_quantized,
+    flux_krea_quantized,
 ]
 
 STARTER_BUNDLES: dict[str, StarterModelBundle] = {

invokeai/backend/model_manager/util/model_util.py

@@ -8,8 +8,12 @@ import picklescan.scanner as pscan
 import safetensors
 import torch
 
+from invokeai.app.services.config.config_default import get_config
 from invokeai.backend.model_manager.taxonomy import ClipVariantType
 from invokeai.backend.quantization.gguf.loaders import gguf_sd_loader
+from invokeai.backend.util.logging import InvokeAILogger
+
+logger = InvokeAILogger.get_logger()
 
 
 def _fast_safetensors_reader(path: str) -> Dict[str, torch.Tensor]:
@@ -59,9 +63,21 @@ def read_checkpoint_meta(path: Union[str, Path], scan: bool = True) -> Dict[str,
         if scan:
             scan_result = pscan.scan_file_path(path)
             if scan_result.infected_files != 0:
-                raise Exception(f"The model at {path} is potentially infected by malware. Aborting import.")
+                if get_config().unsafe_disable_picklescan:
+                    logger.warning(
+                        f"The model {path} is potentially infected by malware, but picklescan is disabled. "
+                        "Proceeding with caution."
+                    )
+                else:
+                    raise RuntimeError(f"The model {path} is potentially infected by malware. Aborting import.")
             if scan_result.scan_err:
-                raise Exception(f"Error scanning model at {path} for malware. Aborting import.")
+                if get_config().unsafe_disable_picklescan:
+                    logger.warning(
+                        f"Error scanning the model at {path} for malware, but picklescan is disabled. "
+                        "Proceeding with caution."
+                    )
+                else:
+                    raise RuntimeError(f"Error scanning the model at {path} for malware. Aborting import.")
 
         checkpoint = torch.load(path, map_location=torch.device("meta"))
     return checkpoint

invokeai/backend/patches/lora_conversions/flux_diffusers_lora_conversion_utils.py

@@ -18,16 +18,25 @@ def is_state_dict_likely_in_flux_diffusers_format(state_dict: Dict[str, torch.Te
     # First, check that all keys end in "lora_A.weight" or "lora_B.weight" (i.e. are in PEFT format).
     all_keys_in_peft_format = all(k.endswith(("lora_A.weight", "lora_B.weight")) for k in state_dict.keys())
 
-    # Next, check that this is likely a FLUX model by spot-checking a few keys.
-    expected_keys = [
+    # Check if keys use transformer prefix
+    transformer_prefix_keys = [
         "transformer.single_transformer_blocks.0.attn.to_q.lora_A.weight",
         "transformer.single_transformer_blocks.0.attn.to_q.lora_B.weight",
         "transformer.transformer_blocks.0.attn.add_q_proj.lora_A.weight",
         "transformer.transformer_blocks.0.attn.add_q_proj.lora_B.weight",
     ]
-    all_expected_keys_present = all(k in state_dict for k in expected_keys)
+    transformer_keys_present = all(k in state_dict for k in transformer_prefix_keys)
 
-    return all_keys_in_peft_format and all_expected_keys_present
+    # Check if keys use base_model.model prefix
+    base_model_prefix_keys = [
+        "base_model.model.single_transformer_blocks.0.attn.to_q.lora_A.weight",
+        "base_model.model.single_transformer_blocks.0.attn.to_q.lora_B.weight",
+        "base_model.model.transformer_blocks.0.attn.add_q_proj.lora_A.weight",
+        "base_model.model.transformer_blocks.0.attn.add_q_proj.lora_B.weight",
+    ]
+    base_model_keys_present = all(k in state_dict for k in base_model_prefix_keys)
+
+    return all_keys_in_peft_format and (transformer_keys_present or base_model_keys_present)
 
 
 def lora_model_from_flux_diffusers_state_dict(
@@ -49,8 +58,16 @@ def lora_layers_from_flux_diffusers_grouped_state_dict(
     https://github.com/huggingface/diffusers/blob/55ac421f7bb12fd00ccbef727be4dc2f3f920abb/scripts/convert_flux_to_diffusers.py
     """
 
-    # Remove the "transformer." prefix from all keys.
-    grouped_state_dict = {k.replace("transformer.", ""): v for k, v in grouped_state_dict.items()}
+    # Determine which prefix is used and remove it from all keys.
+    # Check if any key starts with "base_model.model." prefix
+    has_base_model_prefix = any(k.startswith("base_model.model.") for k in grouped_state_dict.keys())
+
+    if has_base_model_prefix:
+        # Remove the "base_model.model." prefix from all keys.
+        grouped_state_dict = {k.replace("base_model.model.", ""): v for k, v in grouped_state_dict.items()}
+    else:
+        # Remove the "transformer." prefix from all keys.
+        grouped_state_dict = {k.replace("transformer.", ""): v for k, v in grouped_state_dict.items()}
 
     # Constants for FLUX.1
     num_double_layers = 19

invokeai/backend/quantization/scripts/load_flux_model_bnb_llm_int8.py

@@ -20,7 +20,7 @@ def main():
         "/data/invokeai/models/.download_cache/https__huggingface.co_black-forest-labs_flux.1-schnell_resolve_main_flux1-schnell.safetensors/flux1-schnell.safetensors"
     )
 
-    with log_time("Intialize FLUX transformer on meta device"):
+    with log_time("Initialize FLUX transformer on meta device"):
         # TODO(ryand): Determine if this is a schnell model or a dev model and load the appropriate config.
         p = params["flux-schnell"]
 

invokeai/backend/quantization/scripts/load_flux_model_bnb_nf4.py

@@ -33,7 +33,7 @@ def main():
     )
 
     # inference_dtype = torch.bfloat16
-    with log_time("Intialize FLUX transformer on meta device"):
+    with log_time("Initialize FLUX transformer on meta device"):
         # TODO(ryand): Determine if this is a schnell model or a dev model and load the appropriate config.
         p = params["flux-schnell"]
 

invokeai/backend/quantization/scripts/quantize_t5_xxl_bnb_llm_int8.py

@@ -27,7 +27,7 @@ def main():
     """
     model_path = Path("/data/misc/text_encoder_2")
 
-    with log_time("Intialize T5 on meta device"):
+    with log_time("Initialize T5 on meta device"):
         model_config = AutoConfig.from_pretrained(model_path)
         with accelerate.init_empty_weights():
             model = AutoModelForTextEncoding.from_config(model_config)

invokeai/backend/util/vae_working_memory.py

@@ -0,0 +1,117 @@
+from typing import Literal
+
+import torch
+from diffusers.models.autoencoders.autoencoder_kl import AutoencoderKL
+from diffusers.models.autoencoders.autoencoder_tiny import AutoencoderTiny
+
+from invokeai.app.invocations.constants import LATENT_SCALE_FACTOR
+from invokeai.backend.flux.modules.autoencoder import AutoEncoder
+
+
+def estimate_vae_working_memory_sd15_sdxl(
+    operation: Literal["encode", "decode"],
+    image_tensor: torch.Tensor,
+    vae: AutoencoderKL | AutoencoderTiny,
+    tile_size: int | None,
+    fp32: bool,
+) -> int:
+    """Estimate the working memory required to encode or decode the given tensor."""
+    # It was found experimentally that the peak working memory scales linearly with the number of pixels and the
+    # element size (precision). This estimate is accurate for both SD1 and SDXL.
+    element_size = 4 if fp32 else 2
+
+    # This constant is determined experimentally and takes into consideration both allocated and reserved memory. See #8414
+    # Encoding uses ~45% the working memory as decoding.
+    scaling_constant = 2200 if operation == "decode" else 1100
+
+    latent_scale_factor_for_operation = LATENT_SCALE_FACTOR if operation == "decode" else 1
+
+    if tile_size is not None:
+        if tile_size == 0:
+            tile_size = vae.tile_sample_min_size
+            assert isinstance(tile_size, int)
+        h = tile_size
+        w = tile_size
+        working_memory = h * w * element_size * scaling_constant
+
+        # We add 25% to the working memory estimate when tiling is enabled to account for factors like tile overlap
+        # and number of tiles. We could make this more precise in the future, but this should be good enough for
+        # most use cases.
+        working_memory = working_memory * 1.25
+    else:
+        h = latent_scale_factor_for_operation * image_tensor.shape[-2]
+        w = latent_scale_factor_for_operation * image_tensor.shape[-1]
+        working_memory = h * w * element_size * scaling_constant
+
+    if fp32:
+        # If we are running in FP32, then we should account for the likely increase in model size (~250MB).
+        working_memory += 250 * 2**20
+
+    print(f"estimate_vae_working_memory_sd15_sdxl: {int(working_memory)}")
+
+    return int(working_memory)
+
+
+def estimate_vae_working_memory_cogview4(
+    operation: Literal["encode", "decode"], image_tensor: torch.Tensor, vae: AutoencoderKL
+) -> int:
+    """Estimate the working memory required by the invocation in bytes."""
+    latent_scale_factor_for_operation = LATENT_SCALE_FACTOR if operation == "decode" else 1
+
+    h = latent_scale_factor_for_operation * image_tensor.shape[-2]
+    w = latent_scale_factor_for_operation * image_tensor.shape[-1]
+    element_size = next(vae.parameters()).element_size()
+
+    # This constant is determined experimentally and takes into consideration both allocated and reserved memory. See #8414
+    # Encoding uses ~45% the working memory as decoding.
+    scaling_constant = 2200 if operation == "decode" else 1100
+    working_memory = h * w * element_size * scaling_constant
+
+    print(f"estimate_vae_working_memory_cogview4: {int(working_memory)}")
+
+    return int(working_memory)
+
+
+def estimate_vae_working_memory_flux(
+    operation: Literal["encode", "decode"], image_tensor: torch.Tensor, vae: AutoEncoder
+) -> int:
+    """Estimate the working memory required by the invocation in bytes."""
+
+    latent_scale_factor_for_operation = LATENT_SCALE_FACTOR if operation == "decode" else 1
+
+    out_h = latent_scale_factor_for_operation * image_tensor.shape[-2]
+    out_w = latent_scale_factor_for_operation * image_tensor.shape[-1]
+    element_size = next(vae.parameters()).element_size()
+
+    # This constant is determined experimentally and takes into consideration both allocated and reserved memory. See #8414
+    # Encoding uses ~45% the working memory as decoding.
+    scaling_constant = 2200 if operation == "decode" else 1100
+
+    working_memory = out_h * out_w * element_size * scaling_constant
+
+    print(f"estimate_vae_working_memory_flux: {int(working_memory)}")
+
+    return int(working_memory)
+
+
+def estimate_vae_working_memory_sd3(
+    operation: Literal["encode", "decode"], image_tensor: torch.Tensor, vae: AutoencoderKL
+) -> int:
+    """Estimate the working memory required by the invocation in bytes."""
+    # Encode operations use approximately 50% of the memory required for decode operations
+
+    latent_scale_factor_for_operation = LATENT_SCALE_FACTOR if operation == "decode" else 1
+
+    h = latent_scale_factor_for_operation * image_tensor.shape[-2]
+    w = latent_scale_factor_for_operation * image_tensor.shape[-1]
+    element_size = next(vae.parameters()).element_size()
+
+    # This constant is determined experimentally and takes into consideration both allocated and reserved memory. See #8414
+    # Encoding uses ~45% the working memory as decoding.
+    scaling_constant = 2200 if operation == "decode" else 1100
+
+    working_memory = h * w * element_size * scaling_constant
+
+    print(f"estimate_vae_working_memory_sd3: {int(working_memory)}")
+
+    return int(working_memory)

invokeai/frontend/web/public/locales/de.json

@@ -1470,7 +1470,6 @@
     "ui": {
         "tabs": {
             "queue": "Warteschlange",
-            "generation": "Erzeugung",
             "gallery": "Galerie",
             "models": "Modelle",
             "upscaling": "Hochskalierung",

invokeai/frontend/web/public/locales/en.json

@@ -38,6 +38,7 @@
         "deletedImagesCannotBeRestored": "Deleted images cannot be restored.",
         "hideBoards": "Hide Boards",
         "loading": "Loading...",
+        "locateInGalery": "Locate in Gallery",
         "menuItemAutoAdd": "Auto-add to this Board",
         "move": "Move",
         "movingImagesToBoard_one": "Moving {{count}} image to board:",
@@ -114,6 +115,9 @@
         "t2iAdapter": "T2I Adapter",
         "positivePrompt": "Positive Prompt",
         "negativePrompt": "Negative Prompt",
+        "removeNegativePrompt": "Remove Negative Prompt",
+        "addNegativePrompt": "Add Negative Prompt",
+        "selectYourModel": "Select Your Model",
         "discordLabel": "Discord",
         "dontAskMeAgain": "Don't ask me again",
         "dontShowMeThese": "Don't show me these",
@@ -610,6 +614,10 @@
                 "title": "Toggle Non-Raster Layers",
                 "desc": "Show or hide all non-raster layer categories (Control Layers, Inpaint Masks, Regional Guidance)."
             },
+            "fitBboxToLayers": {
+                "title": "Fit Bbox To Layers",
+                "desc": "Automatically adjust the generation bounding box to fit visible layers"
+            },
             "fitBboxToMasks": {
                 "title": "Fit Bbox To Masks",
                 "desc": "Automatically adjust the generation bounding box to fit visible inpaint masks"
@@ -763,6 +771,7 @@
         "allPrompts": "All Prompts",
         "cfgScale": "CFG scale",
         "cfgRescaleMultiplier": "$t(parameters.cfgRescaleMultiplier)",
+        "clipSkip": "$t(parameters.clipSkip)",
         "createdBy": "Created By",
         "generationMode": "Generation Mode",
         "guidance": "Guidance",
@@ -865,6 +874,9 @@
         "install": "Install",
         "installAll": "Install All",
         "installRepo": "Install Repo",
+        "installBundle": "Install Bundle",
+        "installBundleMsg1": "Are you sure you want to install the {{bundleName}} bundle?",
+        "installBundleMsg2": "This bundle will install the following {{count}} models:",
         "ipAdapters": "IP Adapters",
         "learnMoreAboutSupportedModels": "Learn more about the models we support",
         "load": "Load",
@@ -1283,6 +1295,7 @@
         "remixImage": "Remix Image",
         "usePrompt": "Use Prompt",
         "useSeed": "Use Seed",
+        "useClipSkip": "Use CLIP Skip",
         "width": "Width",
         "gaussianBlur": "Gaussian Blur",
         "boxBlur": "Box Blur",
@@ -2176,7 +2189,8 @@
             "rgReferenceImagesNotSupported": "regional Reference Images not supported for selected base model",
             "rgAutoNegativeNotSupported": "Auto-Negative not supported for selected base model",
             "rgNoRegion": "no region drawn",
-            "fluxFillIncompatibleWithControlLoRA": "Control LoRA is not compatible with FLUX Fill"
+            "fluxFillIncompatibleWithControlLoRA": "Control LoRA is not compatible with FLUX Fill",
+            "bboxHidden": "Bounding box is hidden (shift+o to toggle)"
         },
         "errors": {
             "unableToFindImage": "Unable to find image",
@@ -2668,8 +2682,8 @@
     "whatsNew": {
         "whatsNewInInvoke": "What's New in Invoke",
         "items": [
-            "Studio state is saved to the server, allowing you to continue your work on any device.",
-            "Support for multiple reference images for FLUX Kontext (local model only)."
+            "Misc QoL: Toggle Bbox visibility, highlight nodes with errors, prevent adding node fields to Builder form multiple times, CLIP Skip metadata recallable",
+            "Reduced VRAM usage for multiple Kontext Ref images and VAE encoding"
         ],
         "readReleaseNotes": "Read Release Notes",
         "watchRecentReleaseVideos": "Watch Recent Release Videos",

invokeai/frontend/web/public/locales/es.json

@@ -399,7 +399,6 @@
     "ui": {
         "tabs": {
             "canvas": "Lienzo",
-            "generation": "Generación",
             "queue": "Cola",
             "workflows": "Flujos de trabajo",
             "models": "Modelos",

invokeai/frontend/web/public/locales/fr.json

@@ -1820,7 +1820,6 @@
             "upscaling": "Agrandissement",
             "gallery": "Galerie",
             "upscalingTab": "$t(ui.tabs.upscaling) $t(common.tab)",
-            "generation": "Génération",
             "workflows": "Workflows",
             "workflowsTab": "$t(ui.tabs.workflows) $t(common.tab)",
             "models": "Modèles",

invokeai/frontend/web/public/locales/it.json

@@ -128,7 +128,9 @@
         "search": "Cerca",
         "clear": "Cancella",
         "compactView": "Vista compatta",
-        "fullView": "Vista completa"
+        "fullView": "Vista completa",
+        "removeNegativePrompt": "Rimuovi prompt negativo",
+        "addNegativePrompt": "Aggiungi prompt negativo"
     },
     "gallery": {
         "galleryImageSize": "Dimensione dell'immagine",
@@ -410,6 +412,10 @@
             "cancelSegmentAnything": {
                 "title": "Annulla Segment Anything",
                 "desc": "Annulla l'operazione Segment Anything corrente."
+            },
+            "fitBboxToLayers": {
+                "title": "Adatta il riquadro di delimitazione ai livelli",
+                "desc": "Regola automaticamente il riquadro di delimitazione della generazione per adattarlo ai livelli visibili"
             }
         },
         "workflows": {
@@ -1173,8 +1179,8 @@
             "layeringStrategy": "Strategia livelli",
             "longestPath": "Percorso più lungo",
             "layoutDirection": "Direzione schema",
-            "layoutDirectionRight": "Orizzontale",
-            "layoutDirectionDown": "Verticale",
+            "layoutDirectionRight": "A destra",
+            "layoutDirectionDown": "In basso",
             "alignment": "Allineamento nodi",
             "alignmentUL": "In alto a sinistra",
             "alignmentDL": "In basso a sinistra",
@@ -1728,7 +1734,7 @@
         "structure": {
             "heading": "Struttura",
             "paragraphs": [
-                "La struttura determina quanto l'immagine finale rispecchierà il layout dell'originale. Un valore struttura basso permette cambiamenti significativi, mentre un valore struttura alto conserva la composizione e lo schema originali."
+                "La struttura determina quanto l'immagine finale rispecchierà lo schema dell'originale. Un valore struttura basso permette cambiamenti significativi, mentre un valore struttura alto conserva la composizione e lo schema originali."
             ]
         },
         "fluxDevLicense": {
@@ -2495,11 +2501,12 @@
             "off": "Spento"
         },
         "invertMask": "Inverti maschera",
-        "fitBboxToMasks": "Adatta il riquadro di delimitazione alle maschere"
+        "fitBboxToMasks": "Adatta il riquadro di delimitazione alle maschere",
+        "maxRefImages": "Max Immagini di rif.to",
+        "useAsReferenceImage": "Usa come immagine di riferimento"
     },
     "ui": {
         "tabs": {
-            "generation": "Generazione",
             "canvas": "Tela",
             "workflows": "Flussi di lavoro",
             "workflowsTab": "$t(ui.tabs.workflows) $t(common.tab)",
@@ -2508,7 +2515,8 @@
             "queue": "Coda",
             "upscaling": "Amplia",
             "upscalingTab": "$t(ui.tabs.upscaling) $t(common.tab)",
-            "gallery": "Galleria"
+            "gallery": "Galleria",
+            "generate": "Genera"
         },
         "launchpad": {
             "workflowsTitle": "Approfondisci i flussi di lavoro.",
@@ -2556,8 +2564,43 @@
                 "helpText": {
                     "promptAdvice": "Durante l'ampliamento, utilizza un prompt che descriva il mezzo e lo stile. Evita di descrivere dettagli specifici del contenuto dell'immagine.",
                     "styleAdvice": "L'ampliamento funziona meglio con lo stile generale dell'immagine."
+                },
+                "creativityAndStructure": {
+                    "title": "Creatività e struttura predefinite",
+                    "conservative": "Conservativo",
+                    "balanced": "Bilanciato",
+                    "creative": "Creativo",
+                    "artistic": "Artistico"
                 }
+            },
+            "createNewWorkflowFromScratch": "Crea un nuovo flusso di lavoro da zero",
+            "browseAndLoadWorkflows": "Sfoglia e carica i flussi di lavoro esistenti",
+            "addStyleRef": {
+                "title": "Aggiungi un riferimento di stile",
+                "description": "Aggiungi un'immagine per trasferirne l'aspetto."
+            },
+            "editImage": {
+                "title": "Modifica immagine",
+                "description": "Aggiungi un'immagine da perfezionare."
+            },
+            "generateFromText": {
+                "title": "Genera da testo",
+                "description": "Inserisci un prompt e genera."
+            },
+            "useALayoutImage": {
+                "description": "Aggiungi un'immagine per controllare la composizione.",
+                "title": "Usa una immagine guida"
+            },
+            "generate": {
+                "canvasCalloutTitle": "Vuoi avere più controllo, modificare e affinare le tue immagini?",
+                "canvasCalloutLink": "Per ulteriori funzionalità, vai su Tela."
             }
+        },
+        "panels": {
+            "launchpad": "Rampa di lancio",
+            "workflowEditor": "Editor del flusso di lavoro",
+            "imageViewer": "Visualizzatore immagini",
+            "canvas": "Tela"
         }
     },
     "upscaling": {
@@ -2648,10 +2691,8 @@
         "watchRecentReleaseVideos": "Guarda i video su questa versione",
         "watchUiUpdatesOverview": "Guarda le novità dell'interfaccia",
         "items": [
-            "Nuova impostazione per inviare tutte le generazioni della Tela direttamente alla Galleria.",
-            "Nuove funzionalità Inverti maschera (Maiusc+V) e Adatta il Riquadro di delimitazione alla maschera (Maiusc+B).",
-            "Supporto esteso per miniature e configurazioni dei modelli.",
-            "Vari altri aggiornamenti e correzioni per la qualità della vita"
+            "Lo stato dello studio viene salvato sul server, consentendoti di continuare a lavorare su qualsiasi dispositivo.",
+            "Supporto per più immagini di riferimento per FLUX Kontext (solo modello locale)."
         ]
     },
     "system": {

invokeai/frontend/web/public/locales/ja.json

@@ -1783,7 +1783,6 @@
             "workflows": "ワークフロー",
             "models": "モデル",
             "gallery": "ギャラリー",
-            "generation": "生成",
             "workflowsTab": "$t(ui.tabs.workflows) $t(common.tab)",
             "modelsTab": "$t(ui.tabs.models) $t(common.tab)",
             "upscaling": "アップスケーリング",

invokeai/frontend/web/public/locales/ru.json

@@ -1931,7 +1931,6 @@
     },
     "ui": {
         "tabs": {
-            "generation": "Генерация",
             "canvas": "Холст",
             "workflowsTab": "$t(ui.tabs.workflows) $t(common.tab)",
             "models": "Модели",

invokeai/frontend/web/public/locales/vi.json

@@ -252,7 +252,10 @@
         "clear": "Dọn Dẹp",
         "compactView": "Chế Độ Xem Gọn",
         "fullView": "Chế Độ Xem Đầy Đủ",
-        "options_withCount_other": "{{count}} thiết lập"
+        "options_withCount_other": "{{count}} thiết lập",
+        "removeNegativePrompt": "Xóa Lệnh Tiêu Cực",
+        "addNegativePrompt": "Thêm Lệnh Tiêu Cực",
+        "selectYourModel": "Chọn Model"
     },
     "prompt": {
         "addPromptTrigger": "Thêm Trigger Cho Lệnh",
@@ -492,6 +495,10 @@
                 "title": "Huỷ Segment Anything",
                 "desc": "Huỷ hoạt động Segment Anything hiện tại.",
                 "key": "esc"
+            },
+            "fitBboxToLayers": {
+                "title": "Xếp Vừa Hộp Giới Hạn Vào Layer",
+                "desc": "Tự động điểu chỉnh hộp giới hạn tạo sinh vừa vặn vào layer nhìn thấy được"
             }
         },
         "workflows": {
@@ -898,7 +905,8 @@
         "recallParameters": "Gợi Nhớ Tham Số",
         "scheduler": "Scheduler",
         "noMetaData": "Không tìm thấy metadata",
-        "imageDimensions": "Kích Thước Ảnh"
+        "imageDimensions": "Kích Thước Ảnh",
+        "clipSkip": "$t(parameters.clipSkip)"
     },
     "accordions": {
         "generation": {
@@ -1707,7 +1715,8 @@
         "upscaling": "Upscale",
         "tileSize": "Kích Thước Khối",
         "disabledNoRasterContent": "Đã Tắt (Không Có Nội Dung Dạng Raster)",
-        "modelDisabledForTrial": "Tạo sinh với {{modelName}} là không thể với tài khoản trial. Vào phần <LinkComponent>thiết lập tài khoản</LinkComponent> để nâng cấp."
+        "modelDisabledForTrial": "Tạo sinh với {{modelName}} là không thể với tài khoản trial. Vào phần <LinkComponent>thiết lập tài khoản</LinkComponent> để nâng cấp.",
+        "useClipSkip": "Dùng CLIP Skip"
     },
     "dynamicPrompts": {
         "seedBehaviour": {
@@ -2198,7 +2207,8 @@
             "rgReferenceImagesNotSupported": "Ảnh Mẫu Khu Vực không được hỗ trợ cho model cơ sở được chọn",
             "rgAutoNegativeNotSupported": "Tự Động Đảo Chiều không được hỗ trợ cho model cơ sở được chọn",
             "rgNoRegion": "không có khu vực được vẽ",
-            "fluxFillIncompatibleWithControlLoRA": "LoRA Điều Khiển Được không tương tích với FLUX Fill"
+            "fluxFillIncompatibleWithControlLoRA": "LoRA Điều Khiển Được không tương tích với FLUX Fill",
+            "bboxHidden": "Hộp giới hạn đang ẩn (shift+o để bật/tắt)"
         },
         "pasteTo": "Dán Vào",
         "pasteToAssets": "Tài Nguyên",
@@ -2238,7 +2248,9 @@
             "switchOnFinish": "Khi Kết Thúc"
         },
         "fitBboxToMasks": "Xếp Vừa Hộp Giới Hạn Vào Lớp Phủ",
-        "invertMask": "Đảo Ngược Lớp Phủ"
+        "invertMask": "Đảo Ngược Lớp Phủ",
+        "maxRefImages": "Ảnh Mẫu Tối Đa",
+        "useAsReferenceImage": "Dùng Làm Ảnh Mẫu"
     },
     "stylePresets": {
         "negativePrompt": "Lệnh Tiêu Cực",
@@ -2414,14 +2426,14 @@
         "tabs": {
             "gallery": "Thư Viện Ảnh",
             "models": "Models",
-            "generation": "Generation (Máy Tạo Sinh)",
             "upscaling": "Upscale (Nâng Cấp Chất Lượng Hình Ảnh)",
             "canvas": "Canvas (Vùng Ảnh)",
             "upscalingTab": "$t(common.tab) $t(ui.tabs.upscaling)",
             "modelsTab": "$t(common.tab) $t(ui.tabs.models)",
             "queue": "Queue (Hàng Đợi)",
             "workflows": "Workflow (Luồng Làm Việc)",
-            "workflowsTab": "$t(common.tab) $t(ui.tabs.workflows)"
+            "workflowsTab": "$t(common.tab) $t(ui.tabs.workflows)",
+            "generate": "Tạo Sinh"
         },
         "launchpad": {
             "workflowsTitle": "Đi sâu hơn với Workflow.",
@@ -2469,8 +2481,43 @@
                     "promptAdvice": "Khi upscale, dùng lệnh để mô tả phương thức và phong cách. Tránh mô tả các chi tiết cụ thể trong ảnh.",
                     "styleAdvice": "Upscale thích hợp nhất cho phong cách chung của ảnh."
                 },
-                "scale": "Kích Thước"
+                "scale": "Kích Thước",
+                "creativityAndStructure": {
+                    "title": "Độ Sáng Tạo & Cấu Trúc Mặc Định",
+                    "conservative": "Bảo toàn",
+                    "balanced": "Cân bằng",
+                    "creative": "Sáng tạo",
+                    "artistic": "Thẩm mỹ"
+                }
+            },
+            "createNewWorkflowFromScratch": "Tạo workflow mới từ đầu",
+            "browseAndLoadWorkflows": "Duyệt và tải workflow có sẵn",
+            "addStyleRef": {
+                "title": "Thêm Phong Cách Mẫu",
+                "description": "Thêm ảnh để chuyển đổi diện mạo của nó."
+            },
+            "editImage": {
+                "title": "Biên Tập Ảnh",
+                "description": "Thêm ảnh để chỉnh sửa."
+            },
+            "generateFromText": {
+                "title": "Tạo Sinh Từ Chữ",
+                "description": "Nhập lệnh vào và Kích Hoạt."
+            },
+            "useALayoutImage": {
+                "title": "Dùng Bố Cục Ảnh",
+                "description": "Thêm ảnh để điều khiển bố cục."
+            },
+            "generate": {
+                "canvasCalloutTitle": "Đang tìm cách để điều khiển, chỉnh sửa, và làm lại ảnh?",
+                "canvasCalloutLink": "Vào Canvas cho nhiều tính năng hơn."
             }
+        },
+        "panels": {
+            "launchpad": "Launchpad",
+            "workflowEditor": "Trình Biên Tập Workflow",
+            "imageViewer": "Trình Xem Ảnh",
+            "canvas": "Canvas"
         }
     },
     "workflows": {
@@ -2642,10 +2689,8 @@
         "watchRecentReleaseVideos": "Xem Video Phát Hành Mới Nhất",
         "watchUiUpdatesOverview": "Xem Tổng Quan Về Những Cập Nhật Cho Giao Diện Người Dùng",
         "items": [
-            "Thiết lập mới để gửi các sản phẩm tạo sinh từ Canvas trực tiếp đến Thư Viện Ảnh.",
-            "Chức năng mới Đảo Ngược Lớp Phủ (Shift+V) và khả năng Xếp Vừa Hộp Giới Hạn Vào Lớp Phủ (Shift+B).",
-            "Mở rộng hỗ trợ cho Ảnh Minh Hoạ và thiết lập model.",
-            "Nhiều bản cập nhật và sửa lỗi chất lượng"
+            "Trạng thái Studio được lưu vào server, giúp bạn tiếp tục công việc ở mọi thiết bị.",
+            "Hỗ trợ nhiều ảnh mẫu cho FLUX KONTEXT (chỉ cho model trên máy)."
         ]
     },
     "upsell": {

invokeai/frontend/web/public/locales/zh-CN.json

@@ -1772,7 +1772,6 @@
     },
     "ui": {
         "tabs": {
-            "generation": "生成",
             "queue": "队列",
             "canvas": "画布",
             "upscaling": "放大中",

invokeai/frontend/web/src/app/components/InvokeAIUI.tsx

@@ -71,7 +71,7 @@ interface Props extends PropsWithChildren {
    * If provided, overrides in-app navigation to the model manager
    */
   onClickGoToModelManager?: () => void;
-  storagePersistThrottle?: number;
+  storagePersistDebounce?: number;
 }
 
 const InvokeAIUI = ({
@@ -98,7 +98,7 @@ const InvokeAIUI = ({
   loggingOverrides,
   onClickGoToModelManager,
   whatsNew,
-  storagePersistThrottle = 2000,
+  storagePersistDebounce = 300,
 }: Props) => {
   const [store, setStore] = useState<ReturnType<typeof createStore> | undefined>(undefined);
   const [didRehydrate, setDidRehydrate] = useState(false);
@@ -318,7 +318,7 @@ const InvokeAIUI = ({
     const onRehydrated = () => {
       setDidRehydrate(true);
     };
-    const store = createStore({ persist: true, persistThrottle: storagePersistThrottle, onRehydrated });
+    const store = createStore({ persist: true, persistDebounce: storagePersistDebounce, onRehydrated });
     setStore(store);
     $store.set(store);
     if (import.meta.env.MODE === 'development') {
@@ -333,7 +333,7 @@ const InvokeAIUI = ({
         window.$store = undefined;
       }
     };
-  }, [storagePersistThrottle]);
+  }, [storagePersistDebounce]);
 
   if (!store || !didRehydrate) {
     return <Loading />;

invokeai/frontend/web/src/app/store/store.ts

@@ -184,7 +184,7 @@ const PERSISTED_KEYS = Object.values(SLICE_CONFIGS)
   .filter((sliceConfig) => !!sliceConfig.persistConfig)
   .map((sliceConfig) => sliceConfig.slice.reducerPath);
 
-export const createStore = (options?: { persist?: boolean; persistThrottle?: number; onRehydrated?: () => void }) => {
+export const createStore = (options?: { persist?: boolean; persistDebounce?: number; onRehydrated?: () => void }) => {
   const store = configureStore({
     reducer: rememberedRootReducer,
     middleware: (getDefaultMiddleware) =>
@@ -204,7 +204,7 @@ export const createStore = (options?: { persist?: boolean; persistThrottle?: num
       if (options?.persist) {
         return enhancers.prepend(
           rememberEnhancer(reduxRememberDriver, PERSISTED_KEYS, {
-            persistThrottle: options?.persistThrottle ?? 2000,
+            persistDebounce: options?.persistDebounce ?? 2000,
             serialize,
             unserialize,
             prefix: '',

invokeai/frontend/web/src/app/types/invokeai.ts

@@ -58,6 +58,7 @@ const zNumericalParameterConfig = z.object({
   fineStep: z.number().default(8),
   coarseStep: z.number().default(64),
 });
+export type NumericalParameterConfig = z.infer<typeof zNumericalParameterConfig>;
 
 /**
  * Configuration options for the InvokeAI UI.

invokeai/frontend/web/src/common/components/SessionMenuItems.tsx

@@ -1,9 +1,9 @@
 import { MenuItem } from '@invoke-ai/ui-library';
-import { useAppDispatch } from 'app/store/storeHooks';
-import { canvasReset } from 'features/controlLayers/store/actions';
-import { inpaintMaskAdded } from 'features/controlLayers/store/canvasSlice';
+import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
+import { allEntitiesDeleted, inpaintMaskAdded } from 'features/controlLayers/store/canvasSlice';
 import { $canvasManager } from 'features/controlLayers/store/ephemeral';
 import { paramsReset } from 'features/controlLayers/store/paramsSlice';
+import { selectActiveTab } from 'features/ui/store/uiSelectors';
 import { memo, useCallback } from 'react';
 import { useTranslation } from 'react-i18next';
 import { PiArrowsCounterClockwiseBold } from 'react-icons/pi';
@@ -11,9 +11,10 @@ import { PiArrowsCounterClockwiseBold } from 'react-icons/pi';
 export const SessionMenuItems = memo(() => {
   const { t } = useTranslation();
   const dispatch = useAppDispatch();
+  const tab = useAppSelector(selectActiveTab);
 
   const resetCanvasLayers = useCallback(() => {
-    dispatch(canvasReset());
+    dispatch(allEntitiesDeleted());
     dispatch(inpaintMaskAdded({ isSelected: true, isBookmarked: true }));
     $canvasManager.get()?.stage.fitBboxToStage();
   }, [dispatch]);
@@ -22,12 +23,16 @@ export const SessionMenuItems = memo(() => {
   }, [dispatch]);
   return (
     <>
-      <MenuItem icon={<PiArrowsCounterClockwiseBold />} onClick={resetCanvasLayers}>
-        {t('controlLayers.resetCanvasLayers')}
-      </MenuItem>
-      <MenuItem icon={<PiArrowsCounterClockwiseBold />} onClick={resetGenerationSettings}>
-        {t('controlLayers.resetGenerationSettings')}
-      </MenuItem>
+      {tab === 'canvas' && (
+        <MenuItem icon={<PiArrowsCounterClockwiseBold />} onClick={resetCanvasLayers}>
+          {t('controlLayers.resetCanvasLayers')}
+        </MenuItem>
+      )}
+      {(tab === 'canvas' || tab === 'generate') && (
+        <MenuItem icon={<PiArrowsCounterClockwiseBold />} onClick={resetGenerationSettings}>
+          {t('controlLayers.resetGenerationSettings')}
+        </MenuItem>
+      )}
     </>
   );
 });

invokeai/frontend/web/src/features/controlLayers/components/CanvasAlerts/CanvasAlertsBboxVisibility.tsx

@@ -0,0 +1,24 @@
+import { Alert, AlertIcon, AlertTitle } from '@invoke-ai/ui-library';
+import { useStore } from '@nanostores/react';
+import { useCanvasManager } from 'features/controlLayers/contexts/CanvasManagerProviderGate';
+import { memo } from 'react';
+import { useTranslation } from 'react-i18next';
+
+export const CanvasAlertsBboxVisibility = memo(() => {
+  const { t } = useTranslation();
+  const canvasManager = useCanvasManager();
+  const isBboxHidden = useStore(canvasManager.tool.tools.bbox.$isBboxHidden);
+
+  if (!isBboxHidden) {
+    return null;
+  }
+
+  return (
+    <Alert status="warning" borderRadius="base" fontSize="sm" shadow="md" w="fit-content">
+      <AlertIcon />
+      <AlertTitle>{t('controlLayers.warnings.bboxHidden')}</AlertTitle>
+    </Alert>
+  );
+});
+
+CanvasAlertsBboxVisibility.displayName = 'CanvasAlertsBboxVisibility';

invokeai/frontend/web/src/features/controlLayers/components/RefImage/RefImageImage.tsx

@@ -1,15 +1,20 @@
 import { Flex } from '@invoke-ai/ui-library';
 import { useStore } from '@nanostores/react';
 import { skipToken } from '@reduxjs/toolkit/query';
+import { useAppSelector, useAppStore } from 'app/store/storeHooks';
 import { UploadImageIconButton } from 'common/hooks/useImageUploadButton';
+import { bboxSizeOptimized, bboxSizeRecalled } from 'features/controlLayers/store/canvasSlice';
+import { useCanvasIsStaging } from 'features/controlLayers/store/canvasStagingAreaSlice';
+import { sizeOptimized, sizeRecalled } from 'features/controlLayers/store/paramsSlice';
 import type { ImageWithDims } from 'features/controlLayers/store/types';
 import type { setGlobalReferenceImageDndTarget, setRegionalGuidanceReferenceImageDndTarget } from 'features/dnd/dnd';
 import { DndDropTarget } from 'features/dnd/DndDropTarget';
 import { DndImage } from 'features/dnd/DndImage';
 import { DndImageIcon } from 'features/dnd/DndImageIcon';
+import { selectActiveTab } from 'features/ui/store/uiSelectors';
 import { memo, useCallback, useEffect } from 'react';
 import { useTranslation } from 'react-i18next';
-import { PiArrowCounterClockwiseBold } from 'react-icons/pi';
+import { PiArrowCounterClockwiseBold, PiRulerBold } from 'react-icons/pi';
 import { useGetImageDTOQuery } from 'services/api/endpoints/images';
 import type { ImageDTO } from 'services/api/types';
 import { $isConnected } from 'services/events/stores';
@@ -29,7 +34,10 @@ export const RefImageImage = memo(
     dndTargetData,
   }: Props<T>) => {
     const { t } = useTranslation();
+    const store = useAppStore();
     const isConnected = useStore($isConnected);
+    const tab = useAppSelector(selectActiveTab);
+    const isStaging = useCanvasIsStaging();
     const { currentData: imageDTO, isError } = useGetImageDTOQuery(image?.image_name ?? skipToken);
     const handleResetControlImage = useCallback(() => {
       onChangeImage(null);
@@ -48,6 +56,20 @@ export const RefImageImage = memo(
       [onChangeImage]
     );
 
+    const recallSizeAndOptimize = useCallback(() => {
+      if (!imageDTO || (tab === 'canvas' && isStaging)) {
+        return;
+      }
+      const { width, height } = imageDTO;
+      if (tab === 'canvas') {
+        store.dispatch(bboxSizeRecalled({ width, height }));
+        store.dispatch(bboxSizeOptimized());
+      } else if (tab === 'generate') {
+        store.dispatch(sizeRecalled({ width, height }));
+        store.dispatch(sizeOptimized());
+      }
+    }, [imageDTO, isStaging, store, tab]);
+
     return (
       <Flex position="relative" w="full" h="full" alignItems="center" data-error={!imageDTO && !image?.image_name}>
         {!imageDTO && (
@@ -69,6 +91,14 @@ export const RefImageImage = memo(
                 tooltip={t('common.reset')}
               />
             </Flex>
+            <Flex position="absolute" flexDir="column" bottom={2} insetInlineEnd={2} gap={1}>
+              <DndImageIcon
+                onClick={recallSizeAndOptimize}
+                icon={<PiRulerBold size={16} />}
+                tooltip={t('parameters.useSize')}
+                isDisabled={!imageDTO || (tab === 'canvas' && isStaging)}
+              />
+            </Flex>
           </>
         )}
         <DndDropTarget dndTarget={dndTarget} dndTargetData={dndTargetData} label={t('gallery.drop')} />

invokeai/frontend/web/src/features/controlLayers/components/Toolbar/CanvasToolbar.tsx

@@ -15,6 +15,7 @@ import { useCanvasEntityQuickSwitchHotkey } from 'features/controlLayers/hooks/u
 import { useCanvasFilterHotkey } from 'features/controlLayers/hooks/useCanvasFilterHotkey';
 import { useCanvasInvertMaskHotkey } from 'features/controlLayers/hooks/useCanvasInvertMaskHotkey';
 import { useCanvasResetLayerHotkey } from 'features/controlLayers/hooks/useCanvasResetLayerHotkey';
+import { useCanvasToggleBboxHotkey } from 'features/controlLayers/hooks/useCanvasToggleBboxHotkey';
 import { useCanvasToggleNonRasterLayersHotkey } from 'features/controlLayers/hooks/useCanvasToggleNonRasterLayersHotkey';
 import { useCanvasTransformHotkey } from 'features/controlLayers/hooks/useCanvasTransformHotkey';
 import { useCanvasUndoRedoHotkeys } from 'features/controlLayers/hooks/useCanvasUndoRedoHotkeys';
@@ -31,6 +32,7 @@ export const CanvasToolbar = memo(() => {
   useCanvasFilterHotkey();
   useCanvasInvertMaskHotkey();
   useCanvasToggleNonRasterLayersHotkey();
+  useCanvasToggleBboxHotkey();
 
   return (
     <Flex w="full" gap={2} alignItems="center" px={2}>

invokeai/frontend/web/src/features/controlLayers/components/Toolbar/CanvasToolbarFitBboxToLayersButton.tsx

@@ -1,6 +1,8 @@
 import { IconButton } from '@invoke-ai/ui-library';
+import { useIsRegionFocused } from 'common/hooks/focus';
 import { useCanvasManager } from 'features/controlLayers/contexts/CanvasManagerProviderGate';
 import { useCanvasIsBusy } from 'features/controlLayers/hooks/useCanvasIsBusy';
+import { useRegisteredHotkeys } from 'features/system/components/HotkeysModal/useHotkeyData';
 import { memo, useCallback } from 'react';
 import { useTranslation } from 'react-i18next';
 import { PiResizeBold } from 'react-icons/pi';
@@ -9,9 +11,23 @@ export const CanvasToolbarFitBboxToLayersButton = memo(() => {
   const { t } = useTranslation();
   const canvasManager = useCanvasManager();
   const isBusy = useCanvasIsBusy();
+  const isCanvasFocused = useIsRegionFocused('canvas');
+
   const onClick = useCallback(() => {
     canvasManager.tool.tools.bbox.fitToLayers();
-  }, [canvasManager.tool.tools.bbox]);
+    canvasManager.stage.fitLayersToStage();
+  }, [canvasManager.tool.tools.bbox, canvasManager.stage]);
+
+  useRegisteredHotkeys({
+    id: 'fitBboxToLayers',
+    category: 'canvas',
+    callback: () => {
+      canvasManager.tool.tools.bbox.fitToLayers();
+      canvasManager.stage.fitLayersToStage();
+    },
+    options: { enabled: isCanvasFocused && !isBusy, preventDefault: true },
+    dependencies: [isCanvasFocused, isBusy],
+  });
 
   return (
     <IconButton

invokeai/frontend/web/src/features/controlLayers/hooks/addLayerHooks.ts

@@ -1,7 +1,7 @@
 import { createSelector } from '@reduxjs/toolkit';
 import { createMemoizedSelector } from 'app/store/createMemoizedSelector';
 import type { AppGetState } from 'app/store/store';
-import { useAppDispatch, useAppStore } from 'app/store/storeHooks';
+import { useAppDispatch, useAppSelector, useAppStore } from 'app/store/storeHooks';
 import { deepClone } from 'common/util/deepClone';
 import { getPrefixedId } from 'features/controlLayers/konva/util';
 import {
@@ -16,7 +16,11 @@ import {
   rgRefImageAdded,
 } from 'features/controlLayers/store/canvasSlice';
 import { selectBase, selectMainModelConfig } from 'features/controlLayers/store/paramsSlice';
-import { selectCanvasSlice, selectEntity } from 'features/controlLayers/store/selectors';
+import {
+  selectCanvasSlice,
+  selectEntity,
+  selectSelectedEntityIdentifier,
+} from 'features/controlLayers/store/selectors';
 import type {
   CanvasEntityIdentifier,
   CanvasRegionalGuidanceState,
@@ -136,37 +140,49 @@ export const getDefaultRegionalGuidanceRefImageConfig = (getState: AppGetState):
 
 export const useAddControlLayer = () => {
   const dispatch = useAppDispatch();
+  const selectedEntityIdentifier = useAppSelector(selectSelectedEntityIdentifier);
+  const selectedControlLayer =
+    selectedEntityIdentifier?.type === 'control_layer' ? selectedEntityIdentifier.id : undefined;
   const func = useCallback(() => {
     const overrides = { controlAdapter: deepClone(initialControlNet) };
-    dispatch(controlLayerAdded({ isSelected: true, overrides }));
-  }, [dispatch]);
+    dispatch(controlLayerAdded({ isSelected: true, overrides, addAfter: selectedControlLayer }));
+  }, [dispatch, selectedControlLayer]);
 
   return func;
 };
 
 export const useAddRasterLayer = () => {
   const dispatch = useAppDispatch();
+  const selectedEntityIdentifier = useAppSelector(selectSelectedEntityIdentifier);
+  const selectedRasterLayer =
+    selectedEntityIdentifier?.type === 'raster_layer' ? selectedEntityIdentifier.id : undefined;
   const func = useCallback(() => {
-    dispatch(rasterLayerAdded({ isSelected: true }));
-  }, [dispatch]);
+    dispatch(rasterLayerAdded({ isSelected: true, addAfter: selectedRasterLayer }));
+  }, [dispatch, selectedRasterLayer]);
 
   return func;
 };
 
 export const useAddInpaintMask = () => {
   const dispatch = useAppDispatch();
+  const selectedEntityIdentifier = useAppSelector(selectSelectedEntityIdentifier);
+  const selectedInpaintMask =
+    selectedEntityIdentifier?.type === 'inpaint_mask' ? selectedEntityIdentifier.id : undefined;
   const func = useCallback(() => {
-    dispatch(inpaintMaskAdded({ isSelected: true }));
-  }, [dispatch]);
+    dispatch(inpaintMaskAdded({ isSelected: true, addAfter: selectedInpaintMask }));
+  }, [dispatch, selectedInpaintMask]);
 
   return func;
 };
 
 export const useAddRegionalGuidance = () => {
   const dispatch = useAppDispatch();
+  const selectedEntityIdentifier = useAppSelector(selectSelectedEntityIdentifier);
+  const selectedRegionalGuidance =
+    selectedEntityIdentifier?.type === 'regional_guidance' ? selectedEntityIdentifier.id : undefined;
   const func = useCallback(() => {
-    dispatch(rgAdded({ isSelected: true }));
-  }, [dispatch]);
+    dispatch(rgAdded({ isSelected: true, addAfter: selectedRegionalGuidance }));
+  }, [dispatch, selectedRegionalGuidance]);
 
   return func;
 };

invokeai/frontend/web/src/features/controlLayers/hooks/useCanvasToggleBboxHotkey.ts

@@ -0,0 +1,18 @@
+import { useCanvasManager } from 'features/controlLayers/contexts/CanvasManagerProviderGate';
+import { useRegisteredHotkeys } from 'features/system/components/HotkeysModal/useHotkeyData';
+import { useCallback } from 'react';
+
+export const useCanvasToggleBboxHotkey = () => {
+  const canvasManager = useCanvasManager();
+
+  const handleToggleBboxVisibility = useCallback(() => {
+    canvasManager.tool.tools.bbox.toggleBboxVisibility();
+  }, [canvasManager]);
+
+  useRegisteredHotkeys({
+    id: 'toggleBbox',
+    category: 'canvas',
+    callback: handleToggleBboxVisibility,
+    dependencies: [handleToggleBboxVisibility],
+  });
+};

invokeai/frontend/web/src/features/controlLayers/konva/CanvasCompositorModule.ts

@@ -372,6 +372,7 @@ export class CanvasCompositorModule extends CanvasModuleBase {
         position: { x: Math.floor(rect.x), y: Math.floor(rect.y) },
       },
       mergedEntitiesToDelete: deleteMergedEntities ? entityIdentifiers.map(mapId) : [],
+      addAfter: entityIdentifiers.map(mapId).at(-1),
     };
 
     switch (type) {

invokeai/frontend/web/src/features/controlLayers/konva/CanvasEntity/CanvasEntityTransformer.ts

@@ -482,13 +482,24 @@ export class CanvasEntityTransformer extends CanvasModuleBase {
     // "contain" means that the entity should be scaled to fit within the bbox, but it should not exceed the bbox.
     const scale = Math.min(scaleX, scaleY);
 
-    // Center the shape within the bounding box
-    const offsetX = (rect.width - width * scale) / 2;
-    const offsetY = (rect.height - height * scale) / 2;
+    // Calculate the scaled dimensions
+    const scaledWidth = width * scale;
+    const scaledHeight = height * scale;
+
+    // Calculate centered position
+    const centerX = rect.x + (rect.width - scaledWidth) / 2;
+    const centerY = rect.y + (rect.height - scaledHeight) / 2;
+
+    // Round to grid and clamp to valid bounds
+    const roundedX = gridSize > 1 ? roundToMultiple(centerX, gridSize) : centerX;
+    const roundedY = gridSize > 1 ? roundToMultiple(centerY, gridSize) : centerY;
+
+    const x = clamp(roundedX, rect.x, rect.x + rect.width - scaledWidth);
+    const y = clamp(roundedY, rect.y, rect.y + rect.height - scaledHeight);
 
     this.konva.proxyRect.setAttrs({
-      x: clamp(roundToMultiple(rect.x + offsetX, gridSize), rect.x, rect.x + rect.width),
-      y: clamp(roundToMultiple(rect.y + offsetY, gridSize), rect.y, rect.y + rect.height),
+      x,
+      y,
       scaleX: scale,
       scaleY: scale,
       rotation: 0,
@@ -513,16 +524,32 @@ export class CanvasEntityTransformer extends CanvasModuleBase {
     const scaleX = rect.width / width;
     const scaleY = rect.height / height;
 
-    // "cover" is the same as "contain", but we choose the larger scale to cover the shape
+    // "cover" means the entity should cover the entire bbox, potentially overflowing
     const scale = Math.max(scaleX, scaleY);
 
-    // Center the shape within the bounding box
-    const offsetX = (rect.width - width * scale) / 2;
-    const offsetY = (rect.height - height * scale) / 2;
+    // Calculate the scaled dimensions
+    const scaledWidth = width * scale;
+    const scaledHeight = height * scale;
+
+    // Calculate position - center only if entity exceeds bbox
+    let x = rect.x;
+    let y = rect.y;
+
+    // If scaled width exceeds bbox width, center horizontally
+    if (scaledWidth > rect.width) {
+      const centerX = rect.x + (rect.width - scaledWidth) / 2;
+      x = gridSize > 1 ? roundToMultiple(centerX, gridSize) : centerX;
+    }
+
+    // If scaled height exceeds bbox height, center vertically
+    if (scaledHeight > rect.height) {
+      const centerY = rect.y + (rect.height - scaledHeight) / 2;
+      y = gridSize > 1 ? roundToMultiple(centerY, gridSize) : centerY;
+    }
 
     this.konva.proxyRect.setAttrs({
-      x: roundToMultiple(rect.x + offsetX, gridSize),
-      y: roundToMultiple(rect.y + offsetY, gridSize),
+      x,
+      y,
       scaleX: scale,
       scaleY: scale,
       rotation: 0,

invokeai/frontend/web/src/features/controlLayers/konva/CanvasTool/CanvasBboxToolModule.ts

@@ -66,6 +66,11 @@ export class CanvasBboxToolModule extends CanvasModuleBase {
    */
   $aspectRatioBuffer = atom(1);
 
+  /**
+   * Buffer to store the visibility of the bbox.
+   */
+  $isBboxHidden = atom(false);
+
   constructor(parent: CanvasToolModule) {
     super();
     this.id = getPrefixedId(this.type);
@@ -191,6 +196,9 @@ export class CanvasBboxToolModule extends CanvasModuleBase {
 
     // Update on busy state changes
     this.subscriptions.add(this.manager.$isBusy.listen(this.render));
+
+    // Listen for stage changes to update the bbox's visibility
+    this.subscriptions.add(this.$isBboxHidden.listen(this.render));
   }
 
   // This is a noop. The cursor is changed when the cursor enters or leaves the bbox.
@@ -206,13 +214,15 @@ export class CanvasBboxToolModule extends CanvasModuleBase {
   };
 
   /**
-   * Renders the bbox. The bbox is only visible when the tool is set to 'bbox'.
+   * Renders the bbox.
    */
   render = () => {
     const tool = this.manager.tool.$tool.get();
 
     const { x, y, width, height } = this.manager.stateApi.runSelector(selectBbox).rect;
 
+    this.konva.group.visible(!this.$isBboxHidden.get());
+
     // We need to reach up to the preview layer to enable/disable listening so that the bbox can be interacted with.
     // If the mangaer is busy, we disable listening so the bbox cannot be interacted with.
     this.konva.group.listening(tool === 'bbox' && !this.manager.$isBusy.get());
@@ -478,4 +488,8 @@ export class CanvasBboxToolModule extends CanvasModuleBase {
     this.subscriptions.clear();
     this.konva.group.destroy();
   };
+
+  toggleBboxVisibility = () => {
+    this.$isBboxHidden.set(!this.$isBboxHidden.get());
+  };
 }

invokeai/frontend/web/src/features/controlLayers/store/canvasSlice.ts

@@ -111,12 +111,16 @@ const slice = createSlice({
           isSelected?: boolean;
           isBookmarked?: boolean;
           mergedEntitiesToDelete?: string[];
+          addAfter?: string;
         }>
       ) => {
-        const { id, overrides, isSelected, isBookmarked, mergedEntitiesToDelete = [] } = action.payload;
+        const { id, overrides, isSelected, isBookmarked, mergedEntitiesToDelete = [], addAfter } = action.payload;
         const entityState = getRasterLayerState(id, overrides);
 
-        state.rasterLayers.entities.push(entityState);
+        const index = addAfter
+          ? state.rasterLayers.entities.findIndex((e) => e.id === addAfter) + 1
+          : state.rasterLayers.entities.length;
+        state.rasterLayers.entities.splice(index, 0, entityState);
 
         if (mergedEntitiesToDelete.length > 0) {
           state.rasterLayers.entities = state.rasterLayers.entities.filter(
@@ -139,6 +143,7 @@ const slice = createSlice({
         isSelected?: boolean;
         isBookmarked?: boolean;
         mergedEntitiesToDelete?: string[];
+        addAfter?: string;
       }) => ({
         payload: { ...payload, id: getPrefixedId('raster_layer') },
       }),
@@ -272,13 +277,17 @@ const slice = createSlice({
           isSelected?: boolean;
           isBookmarked?: boolean;
           mergedEntitiesToDelete?: string[];
+          addAfter?: string;
         }>
       ) => {
-        const { id, overrides, isSelected, isBookmarked, mergedEntitiesToDelete = [] } = action.payload;
+        const { id, overrides, isSelected, isBookmarked, mergedEntitiesToDelete = [], addAfter } = action.payload;
 
         const entityState = getControlLayerState(id, overrides);
 
-        state.controlLayers.entities.push(entityState);
+        const index = addAfter
+          ? state.controlLayers.entities.findIndex((e) => e.id === addAfter) + 1
+          : state.controlLayers.entities.length;
+        state.controlLayers.entities.splice(index, 0, entityState);
 
         if (mergedEntitiesToDelete.length > 0) {
           state.controlLayers.entities = state.controlLayers.entities.filter(
@@ -300,6 +309,7 @@ const slice = createSlice({
         isSelected?: boolean;
         isBookmarked?: boolean;
         mergedEntitiesToDelete?: string[];
+        addAfter?: string;
       }) => ({
         payload: { ...payload, id: getPrefixedId('control_layer') },
       }),
@@ -570,13 +580,17 @@ const slice = createSlice({
           isSelected?: boolean;
           isBookmarked?: boolean;
           mergedEntitiesToDelete?: string[];
+          addAfter?: string;
         }>
       ) => {
-        const { id, overrides, isSelected, isBookmarked, mergedEntitiesToDelete = [] } = action.payload;
+        const { id, overrides, isSelected, isBookmarked, mergedEntitiesToDelete = [], addAfter } = action.payload;
 
         const entityState = getRegionalGuidanceState(id, overrides);
 
-        state.regionalGuidance.entities.push(entityState);
+        const index = addAfter
+          ? state.regionalGuidance.entities.findIndex((e) => e.id === addAfter) + 1
+          : state.regionalGuidance.entities.length;
+        state.regionalGuidance.entities.splice(index, 0, entityState);
 
         if (mergedEntitiesToDelete.length > 0) {
           state.regionalGuidance.entities = state.regionalGuidance.entities.filter(
@@ -598,6 +612,7 @@ const slice = createSlice({
         isSelected?: boolean;
         isBookmarked?: boolean;
         mergedEntitiesToDelete?: string[];
+        addAfter?: string;
       }) => ({
         payload: { ...payload, id: getPrefixedId('regional_guidance') },
       }),
@@ -874,13 +889,17 @@ const slice = createSlice({
           isSelected?: boolean;
           isBookmarked?: boolean;
           mergedEntitiesToDelete?: string[];
+          addAfter?: string;
         }>
       ) => {
-        const { id, overrides, isSelected, isBookmarked, mergedEntitiesToDelete = [] } = action.payload;
+        const { id, overrides, isSelected, isBookmarked, mergedEntitiesToDelete = [], addAfter } = action.payload;
 
         const entityState = getInpaintMaskState(id, overrides);
 
-        state.inpaintMasks.entities.push(entityState);
+        const index = addAfter
+          ? state.inpaintMasks.entities.findIndex((e) => e.id === addAfter) + 1
+          : state.inpaintMasks.entities.length;
+        state.inpaintMasks.entities.splice(index, 0, entityState);
 
         if (mergedEntitiesToDelete.length > 0) {
           state.inpaintMasks.entities = state.inpaintMasks.entities.filter(
@@ -902,6 +921,7 @@ const slice = createSlice({
         isSelected?: boolean;
         isBookmarked?: boolean;
         mergedEntitiesToDelete?: string[];
+        addAfter?: string;
       }) => ({
         payload: { ...payload, id: getPrefixedId('inpaint_mask') },
       }),
@@ -1091,6 +1111,15 @@ const slice = createSlice({
 
       syncScaledSize(state);
     },
+    bboxSizeRecalled: (state, action: PayloadAction<{ width: number; height: number }>) => {
+      const { width, height } = action.payload;
+      const gridSize = getGridSize(state.bbox.modelBase);
+      state.bbox.rect.width = Math.max(roundDownToMultiple(width, gridSize), 64);
+      state.bbox.rect.height = Math.max(roundDownToMultiple(height, gridSize), 64);
+      state.bbox.aspectRatio.value = state.bbox.rect.width / state.bbox.rect.height;
+      state.bbox.aspectRatio.id = 'Free';
+      state.bbox.aspectRatio.isLocked = true;
+    },
     bboxAspectRatioLockToggled: (state) => {
       state.bbox.aspectRatio.isLocked = !state.bbox.aspectRatio.isLocked;
       syncScaledSize(state);
@@ -1240,25 +1269,33 @@ const slice = createSlice({
         newEntity.name = `${newEntity.name} (Copy)`;
       }
       switch (newEntity.type) {
-        case 'raster_layer':
+        case 'raster_layer': {
           newEntity.id = getPrefixedId('raster_layer');
-          state.rasterLayers.entities.push(newEntity);
+          const newEntityIndex = state.rasterLayers.entities.findIndex((e) => e.id === entityIdentifier.id) + 1;
+          state.rasterLayers.entities.splice(newEntityIndex, 0, newEntity);
           break;
-        case 'control_layer':
+        }
+        case 'control_layer': {
           newEntity.id = getPrefixedId('control_layer');
-          state.controlLayers.entities.push(newEntity);
+          const newEntityIndex = state.controlLayers.entities.findIndex((e) => e.id === entityIdentifier.id) + 1;
+          state.controlLayers.entities.splice(newEntityIndex, 0, newEntity);
           break;
-        case 'regional_guidance':
+        }
+        case 'regional_guidance': {
           newEntity.id = getPrefixedId('regional_guidance');
           for (const refImage of newEntity.referenceImages) {
             refImage.id = getPrefixedId('regional_guidance_ip_adapter');
           }
-          state.regionalGuidance.entities.push(newEntity);
+          const newEntityIndex = state.regionalGuidance.entities.findIndex((e) => e.id === entityIdentifier.id) + 1;
+          state.regionalGuidance.entities.splice(newEntityIndex, 0, newEntity);
           break;
-        case 'inpaint_mask':
+        }
+        case 'inpaint_mask': {
           newEntity.id = getPrefixedId('inpaint_mask');
-          state.inpaintMasks.entities.push(newEntity);
+          const newEntityIndex = state.inpaintMasks.entities.findIndex((e) => e.id === entityIdentifier.id) + 1;
+          state.inpaintMasks.entities.splice(newEntityIndex, 0, newEntity);
           break;
+        }
       }
 
       state.selectedEntityIdentifier = getEntityIdentifier(newEntity);
@@ -1619,6 +1656,7 @@ export const {
   entityArrangedToBack,
   entityOpacityChanged,
   entitiesReordered,
+  allEntitiesDeleted,
   allEntitiesOfTypeIsHiddenToggled,
   allNonRasterLayersIsHiddenToggled,
   // bbox
@@ -1626,6 +1664,7 @@ export const {
   bboxScaledWidthChanged,
   bboxScaledHeightChanged,
   bboxScaleMethodChanged,
+  bboxSizeRecalled,
   bboxWidthChanged,
   bboxHeightChanged,
   bboxAspectRatioLockToggled,

invokeai/frontend/web/src/features/controlLayers/store/paramsSlice.ts

@@ -107,14 +107,7 @@ const slice = createSlice({
         return;
       }
 
-      // Clamp CLIP skip layer count to the bounds of the new model
-      if (model.base === 'sdxl') {
-        // We don't support user-defined CLIP skip for SDXL because it doesn't do anything useful
-        state.clipSkip = 0;
-      } else {
-        const { maxClip } = CLIP_SKIP_MAP[model.base];
-        state.clipSkip = clamp(state.clipSkip, 0, maxClip);
-      }
+      applyClipSkip(state, model, state.clipSkip);
     },
     vaeSelected: (state, action: PayloadAction<ParameterVAEModel | null>) => {
       // null is a valid VAE!
@@ -170,7 +163,7 @@ const slice = createSlice({
       state.vaePrecision = action.payload;
     },
     setClipSkip: (state, action: PayloadAction<number>) => {
-      state.clipSkip = action.payload;
+      applyClipSkip(state, state.model, action.payload);
     },
     shouldUseCpuNoiseChanged: (state, action: PayloadAction<boolean>) => {
       state.shouldUseCpuNoise = action.payload;
@@ -181,15 +174,6 @@ const slice = createSlice({
     negativePromptChanged: (state, action: PayloadAction<ParameterNegativePrompt>) => {
       state.negativePrompt = action.payload;
     },
-    positivePrompt2Changed: (state, action: PayloadAction<string>) => {
-      state.positivePrompt2 = action.payload;
-    },
-    negativePrompt2Changed: (state, action: PayloadAction<string>) => {
-      state.negativePrompt2 = action.payload;
-    },
-    shouldConcatPromptsChanged: (state, action: PayloadAction<boolean>) => {
-      state.shouldConcatPrompts = action.payload;
-    },
     refinerModelChanged: (state, action: PayloadAction<ParameterSDXLRefinerModel | null>) => {
       const result = zParamsState.shape.refinerModel.safeParse(action.payload);
       if (!result.success) {
@@ -241,6 +225,15 @@ const slice = createSlice({
     },
 
     //#region Dimensions
+    sizeRecalled: (state, action: PayloadAction<{ width: number; height: number }>) => {
+      const { width, height } = action.payload;
+      const gridSize = getGridSize(state.model?.base);
+      state.dimensions.rect.width = Math.max(roundDownToMultiple(width, gridSize), 64);
+      state.dimensions.rect.height = Math.max(roundDownToMultiple(height, gridSize), 64);
+      state.dimensions.aspectRatio.value = state.dimensions.rect.width / state.dimensions.rect.height;
+      state.dimensions.aspectRatio.id = 'Free';
+      state.dimensions.aspectRatio.isLocked = true;
+    },
     widthChanged: (state, action: PayloadAction<{ width: number; updateAspectRatio?: boolean; clamp?: boolean }>) => {
       const { width, updateAspectRatio, clamp } = action.payload;
       const gridSize = getGridSize(state.model?.base);
@@ -366,17 +359,46 @@ const slice = createSlice({
   },
 });
 
+const applyClipSkip = (state: { clipSkip: number }, model: ParameterModel | null, clipSkip: number) => {
+  if (model === null) {
+    return;
+  }
+
+  const maxClip = getModelMaxClipSkip(model);
+
+  state.clipSkip = clamp(clipSkip, 0, maxClip);
+};
+
+const hasModelClipSkip = (model: ParameterModel | null) => {
+  if (model === null) {
+    return false;
+  }
+
+  return getModelMaxClipSkip(model) > 0;
+};
+
+const getModelMaxClipSkip = (model: ParameterModel) => {
+  if (model.base === 'sdxl') {
+    // We don't support user-defined CLIP skip for SDXL because it doesn't do anything useful
+    return 0;
+  }
+
+  return CLIP_SKIP_MAP[model.base].maxClip;
+};
+
 const resetState = (state: ParamsState): ParamsState => {
   // When a new session is requested, we need to keep the current model selections, plus dependent state
   // like VAE precision. Everything else gets reset to default.
+  const oldState = deepClone(state);
   const newState = getInitialParamsState();
-  newState.model = state.model;
-  newState.vae = state.vae;
-  newState.fluxVAE = state.fluxVAE;
-  newState.vaePrecision = state.vaePrecision;
-  newState.t5EncoderModel = state.t5EncoderModel;
-  newState.clipEmbedModel = state.clipEmbedModel;
-  newState.refinerModel = state.refinerModel;
+  newState.dimensions = oldState.dimensions;
+  newState.model = oldState.model;
+  newState.vae = oldState.vae;
+  newState.fluxVAE = oldState.fluxVAE;
+  newState.vaePrecision = oldState.vaePrecision;
+  newState.t5EncoderModel = oldState.t5EncoderModel;
+  newState.clipEmbedModel = oldState.clipEmbedModel;
+  newState.refinerModel = oldState.refinerModel;
   return newState;
 };
 
@@ -414,9 +436,6 @@ export const {
   shouldUseCpuNoiseChanged,
   positivePromptChanged,
   negativePromptChanged,
-  positivePrompt2Changed,
-  negativePrompt2Changed,
-  shouldConcatPromptsChanged,
   refinerModelChanged,
   setRefinerSteps,
   setRefinerCFGScale,
@@ -427,6 +446,7 @@ export const {
   modelChanged,
 
   // Dimensions
+  sizeRecalled,
   widthChanged,
   heightChanged,
   aspectRatioLockToggled,
@@ -448,8 +468,7 @@ export const paramsSliceConfig: SliceConfig<typeof slice> = {
 };
 
 export const selectParamsSlice = (state: RootState) => state.params;
-export const createParamsSelector = <T>(selector: Selector<ParamsState, T>) =>
-  createSelector(selectParamsSlice, selector);
+const createParamsSelector = <T>(selector: Selector<ParamsState, T>) => createSelector(selectParamsSlice, selector);
 
 export const selectBase = createParamsSelector((params) => params.model?.base);
 export const selectIsSDXL = createParamsSelector((params) => params.model?.base === 'sdxl');
@@ -485,7 +504,8 @@ export const selectCFGScale = createParamsSelector((params) => params.cfgScale);
 export const selectGuidance = createParamsSelector((params) => params.guidance);
 export const selectSteps = createParamsSelector((params) => params.steps);
 export const selectCFGRescaleMultiplier = createParamsSelector((params) => params.cfgRescaleMultiplier);
-export const selectCLIPSKip = createParamsSelector((params) => params.clipSkip);
+export const selectCLIPSkip = createParamsSelector((params) => params.clipSkip);
+export const selectHasModelCLIPSkip = createParamsSelector((params) => hasModelClipSkip(params.model));
 export const selectCanvasCoherenceEdgeSize = createParamsSelector((params) => params.canvasCoherenceEdgeSize);
 export const selectCanvasCoherenceMinDenoise = createParamsSelector((params) => params.canvasCoherenceMinDenoise);
 export const selectCanvasCoherenceMode = createParamsSelector((params) => params.canvasCoherenceMode);
@@ -506,9 +526,6 @@ export const selectModelSupportsNegativePrompt = createSelector(
   [selectIsFLUX, selectIsChatGPT4o, selectIsFluxKontext],
   (isFLUX, isChatGPT4o, isFluxKontext) => !isFLUX && !isChatGPT4o && !isFluxKontext
 );
-export const selectPositivePrompt2 = createParamsSelector((params) => params.positivePrompt2);
-export const selectNegativePrompt2 = createParamsSelector((params) => params.negativePrompt2);
-export const selectShouldConcatPrompts = createParamsSelector((params) => params.shouldConcatPrompts);
 export const selectScheduler = createParamsSelector((params) => params.scheduler);
 export const selectSeamlessXAxis = createParamsSelector((params) => params.seamlessXAxis);
 export const selectSeamlessYAxis = createParamsSelector((params) => params.seamlessYAxis);

invokeai/frontend/web/src/features/controlLayers/store/types.ts

@@ -14,9 +14,7 @@ import {
   zParameterMaskBlurMethod,
   zParameterModel,
   zParameterNegativePrompt,
-  zParameterNegativeStylePromptSDXL,
   zParameterPositivePrompt,
-  zParameterPositiveStylePromptSDXL,
   zParameterPrecision,
   zParameterScheduler,
   zParameterSDXLRefinerModel,
@@ -534,9 +532,6 @@ export const zParamsState = z.object({
   shouldUseCpuNoise: z.boolean(),
   positivePrompt: zParameterPositivePrompt,
   negativePrompt: zParameterNegativePrompt,
-  positivePrompt2: zParameterPositiveStylePromptSDXL,
-  negativePrompt2: zParameterNegativeStylePromptSDXL,
-  shouldConcatPrompts: z.boolean(),
   refinerModel: zParameterSDXLRefinerModel.nullable(),
   refinerSteps: z.number(),
   refinerCFGScale: z.number(),
@@ -584,9 +579,6 @@ export const getInitialParamsState = (): ParamsState => ({
   shouldUseCpuNoise: true,
   positivePrompt: '',
   negativePrompt: null,
-  positivePrompt2: '',
-  negativePrompt2: '',
-  shouldConcatPrompts: true,
   refinerModel: null,
   refinerSteps: 20,
   refinerCFGScale: 7.5,

invokeai/frontend/web/src/features/dnd/DndImageIcon.tsx

@@ -27,6 +27,7 @@ export const DndImageIcon = memo((props: Props) => {
   return (
     <IconButton
       onClick={onClick}
+      tooltip={tooltip}
       aria-label={tooltip}
       icon={icon}
       variant="link"

invokeai/frontend/web/src/features/gallery/components/Boards/BoardsList/BoardEditableTitle.tsx

@@ -53,6 +53,7 @@ export const BoardEditableTitle = memo(({ board, isSelected }: Props) => {
           color={isSelected ? 'base.100' : 'base.300'}
           onDoubleClick={editable.startEditing}
           cursor="text"
+          noOfLines={1}
         >
           {editable.value}
         </Text>

invokeai/frontend/web/src/features/gallery/components/Boards/BoardsList/BoardTooltip.tsx

@@ -37,6 +37,7 @@ export const BoardTooltip = ({ board }: Props) => {
         />
       )}
       <Flex flexDir="column" alignItems="center">
+        {board && <Text fontWeight="semibold">{board.board_name}</Text>}
         <Text noOfLines={1}>
           {t('boards.imagesWithCount', { count: imagesTotal })}, {t('boards.assetsWithCount', { count: assetsTotal })}
         </Text>

invokeai/frontend/web/src/features/gallery/components/Gallery.tsx

@@ -7,13 +7,7 @@ import { useGallerySearchTerm } from 'features/gallery/components/ImageGrid/useG
 import { selectSelectedBoardId } from 'features/gallery/store/gallerySelectors';
 import { galleryViewChanged, selectGallerySlice } from 'features/gallery/store/gallerySlice';
 import { useAutoLayoutContext } from 'features/ui/layouts/auto-layout-context';
-import {
-  GALLERY_PANEL_DEFAULT_HEIGHT_PX,
-  GALLERY_PANEL_ID,
-  GALLERY_PANEL_MIN_EXPANDED_HEIGHT_PX,
-  GALLERY_PANEL_MIN_HEIGHT_PX,
-} from 'features/ui/layouts/shared';
-import { useCollapsibleGridviewPanel } from 'features/ui/layouts/use-collapsible-gridview-panel';
+import { useGalleryPanel } from 'features/ui/layouts/use-gallery-panel';
 import type { CSSProperties } from 'react';
 import { memo, useCallback } from 'react';
 import { useTranslation } from 'react-i18next';
@@ -34,16 +28,8 @@ export const GalleryPanel = memo(() => {
   const { t } = useTranslation();
   const dispatch = useAppDispatch();
   const { tab } = useAutoLayoutContext();
-  const collapsibleApi = useCollapsibleGridviewPanel(
-    tab,
-    GALLERY_PANEL_ID,
-    'vertical',
-    GALLERY_PANEL_DEFAULT_HEIGHT_PX,
-    GALLERY_PANEL_MIN_HEIGHT_PX,
-    GALLERY_PANEL_MIN_EXPANDED_HEIGHT_PX
-  );
-  const isCollapsed = useStore(collapsibleApi.$isCollapsed);
-
+  const galleryPanel = useGalleryPanel(tab);
+  const isCollapsed = useStore(galleryPanel.$isCollapsed);
   const galleryView = useAppSelector(selectGalleryView);
   const initialSearchTerm = useAppSelector(selectSearchTerm);
   const searchDisclosure = useDisclosure(!!initialSearchTerm);
@@ -58,11 +44,11 @@ export const GalleryPanel = memo(() => {
 
   const handleClickSearch = useCallback(() => {
     onResetSearchTerm();
-    if (!searchDisclosure.isOpen && collapsibleApi.$isCollapsed.get()) {
-      collapsibleApi.expand();
+    if (!searchDisclosure.isOpen && galleryPanel.$isCollapsed.get()) {
+      galleryPanel.expand();
     }
     searchDisclosure.toggle();
-  }, [collapsibleApi, onResetSearchTerm, searchDisclosure]);
+  }, [galleryPanel, onResetSearchTerm, searchDisclosure]);
 
   const selectedBoardId = useAppSelector(selectSelectedBoardId);
   const boardName = useBoardName(selectedBoardId);
@@ -73,8 +59,9 @@ export const GalleryPanel = memo(() => {
         <Button
           size="sm"
           variant="ghost"
-          onClick={collapsibleApi.toggle}
+          onClick={galleryPanel.toggle}
           leftIcon={isCollapsed ? <PiCaretDownBold /> : <PiCaretUpBold />}
+          noOfLines={1}
         >
           {boardName}
         </Button>

invokeai/frontend/web/src/features/gallery/components/GallerySettingsPopover/GallerySettingsPopover.tsx

@@ -40,7 +40,7 @@ export const GallerySettingsPopover = memo(() => {
           <PopoverBody>
             <Flex direction="column" gap={2}>
               <Text fontWeight="semibold" color="base.300">
-                Gallery Settings
+                {t('gallery.gallerySettings')}
               </Text>
 
               <Divider />

invokeai/frontend/web/src/features/gallery/components/ImageContextMenu/ImageMenuItemLocateInGalery.tsx

@@ -0,0 +1,39 @@
+import { MenuItem } from '@invoke-ai/ui-library';
+import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
+import { useImageDTOContext } from 'features/gallery/contexts/ImageDTOContext';
+import { boardIdSelected } from 'features/gallery/store/gallerySlice';
+import { navigationApi } from 'features/ui/layouts/navigation-api';
+import { useGalleryPanel } from 'features/ui/layouts/use-gallery-panel';
+import { selectActiveTab } from 'features/ui/store/uiSelectors';
+import { memo, useCallback, useMemo } from 'react';
+import { flushSync } from 'react-dom';
+import { useTranslation } from 'react-i18next';
+import { PiCrosshairBold } from 'react-icons/pi';
+
+export const ImageMenuItemLocateInGalery = memo(() => {
+  const { t } = useTranslation();
+  const dispatch = useAppDispatch();
+  const imageDTO = useImageDTOContext();
+  const activeTab = useAppSelector(selectActiveTab);
+  const galleryPanel = useGalleryPanel(activeTab);
+
+  const isGalleryImage = useMemo(() => {
+    return !imageDTO.is_intermediate;
+  }, [imageDTO]);
+
+  const onClick = useCallback(() => {
+    navigationApi.expandRightPanel();
+    galleryPanel.expand();
+    flushSync(() => {
+      dispatch(boardIdSelected({ boardId: imageDTO.board_id ?? 'none', selectedImageName: imageDTO.image_name }));
+    });
+  }, [dispatch, galleryPanel, imageDTO]);
+
+  return (
+    <MenuItem icon={<PiCrosshairBold />} onClickCapture={onClick} isDisabled={!isGalleryImage}>
+      {t('boards.locateInGalery')}
+    </MenuItem>
+  );
+});
+
+ImageMenuItemLocateInGalery.displayName = 'ImageMenuItemLocateInGalery';

invokeai/frontend/web/src/features/gallery/components/ImageContextMenu/ImageMenuItemMetadataRecallActionsCanvasGenerateTabs.tsx

@@ -2,6 +2,7 @@ import { Menu, MenuButton, MenuItem, MenuList } from '@invoke-ai/ui-library';
 import { SubMenuButtonContent, useSubMenu } from 'common/hooks/useSubMenu';
 import { useImageDTOContext } from 'features/gallery/contexts/ImageDTOContext';
 import { useRecallAll } from 'features/gallery/hooks/useRecallAll';
+import { useRecallCLIPSkip } from 'features/gallery/hooks/useRecallCLIPSkip';
 import { useRecallDimensions } from 'features/gallery/hooks/useRecallDimensions';
 import { useRecallPrompts } from 'features/gallery/hooks/useRecallPrompts';
 import { useRecallRemix } from 'features/gallery/hooks/useRecallRemix';
@@ -17,7 +18,7 @@ import {
   PiRulerBold,
 } from 'react-icons/pi';
 
-export const ImageMenuItemMetadataRecallActions = memo(() => {
+export const ImageMenuItemMetadataRecallActionsCanvasGenerateTabs = memo(() => {
   const { t } = useTranslation();
   const subMenu = useSubMenu();
 
@@ -28,6 +29,7 @@ export const ImageMenuItemMetadataRecallActions = memo(() => {
   const recallPrompts = useRecallPrompts(imageDTO);
   const recallSeed = useRecallSeed(imageDTO);
   const recallDimensions = useRecallDimensions(imageDTO);
+  const recallCLIPSkip = useRecallCLIPSkip(imageDTO);
 
   return (
     <MenuItem {...subMenu.parentMenuItemProps} icon={<PiArrowBendUpLeftBold />}>
@@ -55,10 +57,14 @@ export const ImageMenuItemMetadataRecallActions = memo(() => {
           <MenuItem icon={<PiRulerBold />} onClick={recallDimensions.recall} isDisabled={!recallDimensions.isEnabled}>
             {t('parameters.useSize')}
           </MenuItem>
+          <MenuItem icon={<PiRulerBold />} onClick={recallCLIPSkip.recall} isDisabled={!recallCLIPSkip.isEnabled}>
+            {t('parameters.useClipSkip')}
+          </MenuItem>
         </MenuList>
       </Menu>
     </MenuItem>
   );
 });
 
-ImageMenuItemMetadataRecallActions.displayName = 'ImageMenuItemMetadataRecallActions';
+ImageMenuItemMetadataRecallActionsCanvasGenerateTabs.displayName =
+  'ImageMenuItemMetadataRecallActionsCanvasGenerateTabs';

invokeai/frontend/web/src/features/gallery/components/ImageContextMenu/ImageMenuItemMetadataRecallActionsUpscaleTab.tsx

@@ -0,0 +1,38 @@
+import { Menu, MenuButton, MenuItem, MenuList } from '@invoke-ai/ui-library';
+import { SubMenuButtonContent, useSubMenu } from 'common/hooks/useSubMenu';
+import { useImageDTOContext } from 'features/gallery/contexts/ImageDTOContext';
+import { useRecallPrompts } from 'features/gallery/hooks/useRecallPrompts';
+import { useRecallSeed } from 'features/gallery/hooks/useRecallSeed';
+import { memo } from 'react';
+import { useTranslation } from 'react-i18next';
+import { PiArrowBendUpLeftBold, PiPlantBold, PiQuotesBold } from 'react-icons/pi';
+
+export const ImageMenuItemMetadataRecallActionsUpscaleTab = memo(() => {
+  const { t } = useTranslation();
+  const subMenu = useSubMenu();
+
+  const imageDTO = useImageDTOContext();
+
+  const recallPrompts = useRecallPrompts(imageDTO);
+  const recallSeed = useRecallSeed(imageDTO);
+
+  return (
+    <MenuItem {...subMenu.parentMenuItemProps} icon={<PiArrowBendUpLeftBold />}>
+      <Menu {...subMenu.menuProps}>
+        <MenuButton {...subMenu.menuButtonProps}>
+          <SubMenuButtonContent label={t('parameters.recallMetadata')} />
+        </MenuButton>
+        <MenuList {...subMenu.menuListProps}>
+          <MenuItem icon={<PiQuotesBold />} onClick={recallPrompts.recall} isDisabled={!recallPrompts.isEnabled}>
+            {t('parameters.usePrompt')}
+          </MenuItem>
+          <MenuItem icon={<PiPlantBold />} onClick={recallSeed.recall} isDisabled={!recallSeed.isEnabled}>
+            {t('parameters.useSeed')}
+          </MenuItem>
+        </MenuList>
+      </Menu>
+    </MenuItem>
+  );
+});
+
+ImageMenuItemMetadataRecallActionsUpscaleTab.displayName = 'ImageMenuItemMetadataRecallActionsUpscaleTab';

invokeai/frontend/web/src/features/gallery/components/ImageContextMenu/ImageMenuItemNewCanvasFromImageSubMenu.tsx

@@ -2,6 +2,7 @@ import { Menu, MenuButton, MenuItem, MenuList } from '@invoke-ai/ui-library';
 import { useAppStore } from 'app/store/storeHooks';
 import { SubMenuButtonContent, useSubMenu } from 'common/hooks/useSubMenu';
 import { useCanvasIsBusySafe } from 'features/controlLayers/hooks/useCanvasIsBusy';
+import { useCanvasIsStaging } from 'features/controlLayers/store/canvasStagingAreaSlice';
 import { useImageDTOContext } from 'features/gallery/contexts/ImageDTOContext';
 import { newCanvasFromImage } from 'features/imageActions/actions';
 import { toast } from 'features/toast/toast';
@@ -17,6 +18,7 @@ export const ImageMenuItemNewCanvasFromImageSubMenu = memo(() => {
   const store = useAppStore();
   const imageDTO = useImageDTOContext();
   const isBusy = useCanvasIsBusySafe();
+  const isStaging = useCanvasIsStaging();
 
   const onClickNewCanvasWithRasterLayerFromImage = useCallback(async () => {
     const { dispatch, getState } = store;
@@ -97,27 +99,31 @@ export const ImageMenuItemNewCanvasFromImageSubMenu = memo(() => {
           <SubMenuButtonContent label={t('controlLayers.newCanvasFromImage')} />
         </MenuButton>
         <MenuList {...subMenu.menuListProps}>
-          <MenuItem icon={<PiFileBold />} onClickCapture={onClickNewCanvasWithRasterLayerFromImage} isDisabled={isBusy}>
+          <MenuItem
+            icon={<PiFileBold />}
+            onClickCapture={onClickNewCanvasWithRasterLayerFromImage}
+            isDisabled={isStaging || isBusy}
+          >
             {t('controlLayers.asRasterLayer')}
           </MenuItem>
           <MenuItem
             icon={<PiFileBold />}
             onClickCapture={onClickNewCanvasWithRasterLayerFromImageWithResize}
-            isDisabled={isBusy}
+            isDisabled={isStaging || isBusy}
           >
             {t('controlLayers.asRasterLayerResize')}
           </MenuItem>
           <MenuItem
             icon={<PiFileBold />}
             onClickCapture={onClickNewCanvasWithControlLayerFromImage}
-            isDisabled={isBusy}
+            isDisabled={isStaging || isBusy}
           >
             {t('controlLayers.asControlLayer')}
           </MenuItem>
           <MenuItem
             icon={<PiFileBold />}
             onClickCapture={onClickNewCanvasWithControlLayerFromImageWithResize}
-            isDisabled={isBusy}
+            isDisabled={isStaging || isBusy}
           >
             {t('controlLayers.asControlLayerResize')}
           </MenuItem>

invokeai/frontend/web/src/features/gallery/components/ImageContextMenu/SingleSelectionMenuItems.tsx

@@ -6,7 +6,8 @@ import { ImageMenuItemCopy } from 'features/gallery/components/ImageContextMenu/
 import { ImageMenuItemDelete } from 'features/gallery/components/ImageContextMenu/ImageMenuItemDelete';
 import { ImageMenuItemDownload } from 'features/gallery/components/ImageContextMenu/ImageMenuItemDownload';
 import { ImageMenuItemLoadWorkflow } from 'features/gallery/components/ImageContextMenu/ImageMenuItemLoadWorkflow';
-import { ImageMenuItemMetadataRecallActions } from 'features/gallery/components/ImageContextMenu/ImageMenuItemMetadataRecallActions';
+import { ImageMenuItemLocateInGalery } from 'features/gallery/components/ImageContextMenu/ImageMenuItemLocateInGalery';
+import { ImageMenuItemMetadataRecallActionsCanvasGenerateTabs } from 'features/gallery/components/ImageContextMenu/ImageMenuItemMetadataRecallActionsCanvasGenerateTabs';
 import { ImageMenuItemNewCanvasFromImageSubMenu } from 'features/gallery/components/ImageContextMenu/ImageMenuItemNewCanvasFromImageSubMenu';
 import { ImageMenuItemNewLayerFromImageSubMenu } from 'features/gallery/components/ImageContextMenu/ImageMenuItemNewLayerFromImageSubMenu';
 import { ImageMenuItemOpenInNewTab } from 'features/gallery/components/ImageContextMenu/ImageMenuItemOpenInNewTab';
@@ -21,6 +22,7 @@ import { selectActiveTab } from 'features/ui/store/uiSelectors';
 import { memo } from 'react';
 import type { ImageDTO } from 'services/api/types';
 
+import { ImageMenuItemMetadataRecallActionsUpscaleTab } from './ImageMenuItemMetadataRecallActionsUpscaleTab';
 import { ImageMenuItemUseAsPromptTemplate } from './ImageMenuItemUseAsPromptTemplate';
 
 type SingleSelectionMenuItemsProps = {
@@ -42,7 +44,8 @@ const SingleSelectionMenuItems = ({ imageDTO }: SingleSelectionMenuItemsProps) =
       </IconMenuItemGroup>
       <MenuDivider />
       <ImageMenuItemLoadWorkflow />
-      {(tab === 'canvas' || tab === 'generate') && <ImageMenuItemMetadataRecallActions />}
+      {(tab === 'canvas' || tab === 'generate') && <ImageMenuItemMetadataRecallActionsCanvasGenerateTabs />}
+      {tab === 'upscaling' && <ImageMenuItemMetadataRecallActionsUpscaleTab />}
       <MenuDivider />
       <ImageMenuItemSendToUpscale />
       <ImageMenuItemUseForPromptGeneration />
@@ -53,6 +56,11 @@ const SingleSelectionMenuItems = ({ imageDTO }: SingleSelectionMenuItemsProps) =
       <MenuDivider />
       <ImageMenuItemChangeBoard />
       <ImageMenuItemStarUnstar />
+      {(tab === 'canvas' || tab === 'generate' || tab === 'workflows' || tab === 'upscaling') &&
+        !imageDTO.is_intermediate && (
+          // Only render this button on tabs with a gallery.
+          <ImageMenuItemLocateInGalery />
+        )}
     </ImageDTOContextProvider>
   );
 };

invokeai/frontend/web/src/features/gallery/components/ImageMetadataViewer/ImageMetadataActions.tsx

@@ -33,8 +33,6 @@ const ImageMetadataActions = (props: Props) => {
       <UnrecallableMetadataDatum metadata={metadata} handler={MetadataHandlers.GenerationMode} />
       <SingleMetadataDatum metadata={metadata} handler={MetadataHandlers.PositivePrompt} />
       <SingleMetadataDatum metadata={metadata} handler={MetadataHandlers.NegativePrompt} />
-      <SingleMetadataDatum metadata={metadata} handler={MetadataHandlers.PositiveStylePrompt} />
-      <SingleMetadataDatum metadata={metadata} handler={MetadataHandlers.NegativeStylePrompt} />
       <SingleMetadataDatum metadata={metadata} handler={MetadataHandlers.MainModel} />
       <SingleMetadataDatum metadata={metadata} handler={MetadataHandlers.VAEModel} />
       <SingleMetadataDatum metadata={metadata} handler={MetadataHandlers.Width} />
@@ -42,6 +40,7 @@ const ImageMetadataActions = (props: Props) => {
       <SingleMetadataDatum metadata={metadata} handler={MetadataHandlers.Seed} />
       <SingleMetadataDatum metadata={metadata} handler={MetadataHandlers.Steps} />
       <SingleMetadataDatum metadata={metadata} handler={MetadataHandlers.Scheduler} />
+      <SingleMetadataDatum metadata={metadata} handler={MetadataHandlers.CLIPSkip} />
       <SingleMetadataDatum metadata={metadata} handler={MetadataHandlers.CFGScale} />
       <SingleMetadataDatum metadata={metadata} handler={MetadataHandlers.CFGRescaleMultiplier} />
       <SingleMetadataDatum metadata={metadata} handler={MetadataHandlers.Guidance} />

invokeai/frontend/web/src/features/gallery/components/ImageViewer/CurrentImageButtons.tsx

@@ -1,5 +1,5 @@
 import { Button, Divider, IconButton, Menu, MenuButton, MenuList } from '@invoke-ai/ui-library';
-import { useAppSelector } from 'app/store/storeHooks';
+import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
 import { DeleteImageButton } from 'features/deleteImageModal/components/DeleteImageButton';
 import SingleSelectionMenuItems from 'features/gallery/components/ImageContextMenu/SingleSelectionMenuItems';
 import { useDeleteImage } from 'features/gallery/hooks/useDeleteImage';
@@ -10,14 +10,19 @@ import { useRecallDimensions } from 'features/gallery/hooks/useRecallDimensions'
 import { useRecallPrompts } from 'features/gallery/hooks/useRecallPrompts';
 import { useRecallRemix } from 'features/gallery/hooks/useRecallRemix';
 import { useRecallSeed } from 'features/gallery/hooks/useRecallSeed';
+import { boardIdSelected } from 'features/gallery/store/gallerySlice';
 import { PostProcessingPopover } from 'features/parameters/components/PostProcessing/PostProcessingPopover';
 import { useFeatureStatus } from 'features/system/hooks/useFeatureStatus';
+import { navigationApi } from 'features/ui/layouts/navigation-api';
+import { useGalleryPanel } from 'features/ui/layouts/use-gallery-panel';
 import { selectActiveTab } from 'features/ui/store/uiSelectors';
-import { memo } from 'react';
+import { memo, useCallback, useMemo } from 'react';
+import { flushSync } from 'react-dom';
 import { useTranslation } from 'react-i18next';
 import {
   PiArrowsCounterClockwiseBold,
   PiAsteriskBold,
+  PiCrosshairBold,
   PiDotsThreeOutlineFill,
   PiFlowArrowBold,
   PiPencilBold,
@@ -30,7 +35,25 @@ import type { ImageDTO } from 'services/api/types';
 export const CurrentImageButtons = memo(({ imageDTO }: { imageDTO: ImageDTO }) => {
   const { t } = useTranslation();
   const tab = useAppSelector(selectActiveTab);
+  const dispatch = useAppDispatch();
+  const activeTab = useAppSelector(selectActiveTab);
+  const galleryPanel = useGalleryPanel(activeTab);
+
+  const isGalleryImage = useMemo(() => {
+    return !imageDTO.is_intermediate;
+  }, [imageDTO]);
+
+  const locateInGallery = useCallback(() => {
+    navigationApi.expandRightPanel();
+    galleryPanel.expand();
+    flushSync(() => {
+      dispatch(boardIdSelected({ boardId: imageDTO.board_id ?? 'none', selectedImageName: imageDTO.image_name }));
+    });
+  }, [dispatch, galleryPanel, imageDTO]);
+
   const isCanvasOrGenerateTab = tab === 'canvas' || tab === 'generate';
+  const isCanvasOrGenerateOrUpscalingTab = tab === 'canvas' || tab === 'generate' || tab === 'upscaling';
+  const doesTabHaveGallery = tab === 'canvas' || tab === 'generate' || tab === 'workflows' || tab === 'upscaling';
 
   const isUpscalingEnabled = useFeatureStatus('upscaling');
 
@@ -74,6 +97,17 @@ export const CurrentImageButtons = memo(({ imageDTO }: { imageDTO: ImageDTO }) =
 
       <Divider orientation="vertical" h={8} mx={2} />
 
+      {doesTabHaveGallery && isGalleryImage && (
+        <IconButton
+          icon={<PiCrosshairBold />}
+          aria-label={t('boards.locateInGalery')}
+          tooltip={t('boards.locateInGalery')}
+          onClick={locateInGallery}
+          variant="link"
+          size="sm"
+          alignSelf="stretch"
+        />
+      )}
       <IconButton
         icon={<PiFlowArrowBold />}
         tooltip={`${t('nodes.loadWorkflow')} (W)`}
@@ -94,7 +128,7 @@ export const CurrentImageButtons = memo(({ imageDTO }: { imageDTO: ImageDTO }) =
           onClick={recallRemix.recall}
         />
       )}
-      {isCanvasOrGenerateTab && (
+      {isCanvasOrGenerateOrUpscalingTab && (
         <IconButton
           icon={<PiQuotesBold />}
           tooltip={`${t('parameters.usePrompt')} (P)`}
@@ -105,7 +139,7 @@ export const CurrentImageButtons = memo(({ imageDTO }: { imageDTO: ImageDTO }) =
           onClick={recallPrompts.recall}
         />
       )}
-      {isCanvasOrGenerateTab && (
+      {isCanvasOrGenerateOrUpscalingTab && (
         <IconButton
           icon={<PiPlantBold />}
           tooltip={`${t('parameters.useSeed')} (S)`}

invokeai/frontend/web/src/features/gallery/components/NewGallery.tsx

@@ -9,6 +9,7 @@ import {
   selectGalleryImageMinimumWidth,
   selectImageToCompare,
   selectLastSelectedImage,
+  selectSelection,
   selectSelectionCount,
 } from 'features/gallery/store/gallerySelectors';
 import { imageToCompareChanged, selectionChanged } from 'features/gallery/store/gallerySlice';
@@ -138,6 +139,7 @@ const scrollIntoView = (
 ) => {
   if (range.endIndex === 0) {
     // No range is rendered; no need to scroll to anything.
+    log.trace('Not scrolling into view: Range endIdex is 0');
     return;
   }
 
@@ -145,6 +147,7 @@ const scrollIntoView = (
 
   if (targetIndex === -1) {
     // The image isn't in the currently rendered list.
+    log.trace('Not scrolling into view: targetIndex is -1');
     return;
   }
 
@@ -154,12 +157,28 @@ const scrollIntoView = (
 
   if (!targetItem) {
     if (targetIndex > range.endIndex) {
+      log.trace(
+        {
+          index: targetIndex,
+          behavior: 'auto',
+          align: 'start',
+        },
+        'Scrolling into view: not in DOM'
+      );
       virtuosoGridHandle.scrollToIndex({
         index: targetIndex,
         behavior: 'auto',
         align: 'start',
       });
     } else if (targetIndex < range.startIndex) {
+      log.trace(
+        {
+          index: targetIndex,
+          behavior: 'auto',
+          align: 'end',
+        },
+        'Scrolling into view: not in DOM'
+      );
       virtuosoGridHandle.scrollToIndex({
         index: targetIndex,
         behavior: 'auto',
@@ -180,12 +199,28 @@ const scrollIntoView = (
   const rootRect = rootEl.getBoundingClientRect();
 
   if (itemRect.top < rootRect.top) {
+    log.trace(
+      {
+        index: targetIndex,
+        behavior: 'auto',
+        align: 'start',
+      },
+      'Scrolling into view: in overscan'
+    );
     virtuosoGridHandle.scrollToIndex({
       index: targetIndex,
       behavior: 'auto',
       align: 'start',
     });
   } else if (itemRect.bottom > rootRect.bottom) {
+    log.trace(
+      {
+        index: targetIndex,
+        behavior: 'auto',
+        align: 'end',
+      },
+      'Scrolling into view: in overscan'
+    );
     virtuosoGridHandle.scrollToIndex({
       index: targetIndex,
       behavior: 'auto',
@@ -193,6 +228,7 @@ const scrollIntoView = (
     });
   } else {
     // Image is already in view
+    log.debug('Not scrolling into view: Image is already in view');
   }
 
   return;
@@ -392,9 +428,10 @@ const useKeepSelectedImageInView = (
   rootRef: React.RefObject<HTMLDivElement>,
   rangeRef: MutableRefObject<ListRange>
 ) => {
-  const targetImageName = useAppSelector(selectLastSelectedImage);
+  const selection = useAppSelector(selectSelection);
 
   useEffect(() => {
+    const targetImageName = selection.at(-1);
     const virtuosoGridHandle = virtuosoRef.current;
     const rootEl = rootRef.current;
     const range = rangeRef.current;
@@ -402,8 +439,11 @@ const useKeepSelectedImageInView = (
     if (!virtuosoGridHandle || !rootEl || !targetImageName || !imageNames || imageNames.length === 0) {
       return;
     }
-    scrollIntoView(targetImageName, imageNames, rootEl, virtuosoGridHandle, range);
-  }, [targetImageName, imageNames, rangeRef, rootRef, virtuosoRef]);
+
+    setTimeout(() => {
+      scrollIntoView(targetImageName, imageNames, rootEl, virtuosoGridHandle, range);
+    }, 0);
+  }, [imageNames, rangeRef, rootRef, virtuosoRef, selection]);
 };
 
 /**

invokeai/frontend/web/src/features/gallery/hooks/useEditImage.ts

@@ -1,5 +1,6 @@
 import { useAppStore } from 'app/store/storeHooks';
 import { useCanvasManagerSafe } from 'features/controlLayers/contexts/CanvasManagerProviderGate';
+import { useCanvasIsStaging } from 'features/controlLayers/store/canvasStagingAreaSlice';
 import { newCanvasFromImage } from 'features/imageActions/actions';
 import { toast } from 'features/toast/toast';
 import { navigationApi } from 'features/ui/layouts/navigation-api';
@@ -13,13 +14,17 @@ export const useEditImage = (imageDTO?: ImageDTO | null) => {
 
   const { getState, dispatch } = useAppStore();
   const canvasManager = useCanvasManagerSafe();
+  const isStaging = useCanvasIsStaging();
 
   const isEnabled = useMemo(() => {
     if (!imageDTO) {
       return false;
     }
+    if (isStaging) {
+      return false;
+    }
     return true;
-  }, [imageDTO]);
+  }, [imageDTO, isStaging]);
 
   const edit = useCallback(async () => {
     if (!imageDTO) {

invokeai/frontend/web/src/features/gallery/hooks/useRecallCLIPSkip.ts

@@ -0,0 +1,72 @@
+import { useAppSelector, useAppStore } from 'app/store/storeHooks';
+import { selectHasModelCLIPSkip } from 'features/controlLayers/store/paramsSlice';
+import { MetadataHandlers, MetadataUtils } from 'features/metadata/parsing';
+import { selectActiveTab } from 'features/ui/store/uiSelectors';
+import type { TabName } from 'features/ui/store/uiTypes';
+import { useCallback, useEffect, useMemo, useState } from 'react';
+import { useDebouncedMetadata } from 'services/api/hooks/useDebouncedMetadata';
+import type { ImageDTO } from 'services/api/types';
+
+const ALLOWED_TABS: TabName[] = ['canvas', 'generate', 'upscaling'];
+
+export const useRecallCLIPSkip = (imageDTO: ImageDTO) => {
+  const store = useAppStore();
+  const hasModelCLIPSkip = useAppSelector(selectHasModelCLIPSkip);
+  const tab = useAppSelector(selectActiveTab);
+  const [hasCLIPSkip, setHasCLIPSkip] = useState(false);
+
+  const { metadata, isLoading } = useDebouncedMetadata(imageDTO.image_name);
+
+  useEffect(() => {
+    const parse = async () => {
+      try {
+        await MetadataHandlers.CLIPSkip.parse(metadata, store);
+        setHasCLIPSkip(true);
+      } catch {
+        setHasCLIPSkip(false);
+      }
+    };
+
+    if (!hasModelCLIPSkip) {
+      setHasCLIPSkip(false);
+      return;
+    }
+
+    parse();
+  }, [metadata, store, hasModelCLIPSkip]);
+
+  const isEnabled = useMemo(() => {
+    if (isLoading) {
+      return false;
+    }
+
+    if (!ALLOWED_TABS.includes(tab)) {
+      return false;
+    }
+
+    if (!metadata) {
+      return false;
+    }
+
+    if (!hasCLIPSkip) {
+      return false;
+    }
+
+    return true;
+  }, [hasCLIPSkip, isLoading, metadata, tab]);
+
+  const recall = useCallback(() => {
+    if (!metadata) {
+      return;
+    }
+    if (!isEnabled) {
+      return;
+    }
+    MetadataUtils.recallByHandler({ metadata, handler: MetadataHandlers.CLIPSkip, store });
+  }, [metadata, isEnabled, store]);
+
+  return {
+    recall,
+    isEnabled,
+  };
+};

invokeai/frontend/web/src/features/gallery/hooks/useRecallPrompts.ts

@@ -1,12 +1,15 @@
 import { useAppSelector, useAppStore } from 'app/store/storeHooks';
 import { MetadataHandlers, MetadataUtils } from 'features/metadata/parsing';
 import { selectActiveTab } from 'features/ui/store/uiSelectors';
+import type { TabName } from 'features/ui/store/uiTypes';
 import { useCallback, useEffect, useMemo, useState } from 'react';
 import { useDebouncedMetadata } from 'services/api/hooks/useDebouncedMetadata';
 import type { ImageDTO } from 'services/api/types';
 
 import { useClearStylePresetWithToast } from './useClearStylePresetWithToast';
 
+const ALLOWED_TABS: TabName[] = ['canvas', 'generate', 'upscaling'];
+
 export const useRecallPrompts = (imageDTO: ImageDTO) => {
   const store = useAppStore();
   const tab = useAppSelector(selectActiveTab);
@@ -19,12 +22,7 @@ export const useRecallPrompts = (imageDTO: ImageDTO) => {
     const parse = async () => {
       try {
         const result = await MetadataUtils.hasMetadataByHandlers({
-          handlers: [
-            MetadataHandlers.PositivePrompt,
-            MetadataHandlers.NegativePrompt,
-            MetadataHandlers.PositiveStylePrompt,
-            MetadataHandlers.NegativeStylePrompt,
-          ],
+          handlers: [MetadataHandlers.PositivePrompt, MetadataHandlers.NegativePrompt],
           metadata,
           store,
           require: 'some',
@@ -43,7 +41,7 @@ export const useRecallPrompts = (imageDTO: ImageDTO) => {
       return false;
     }
 
-    if (tab !== 'canvas' && tab !== 'generate') {
+    if (!ALLOWED_TABS.includes(tab)) {
       return false;
     }
 

invokeai/frontend/web/src/features/gallery/hooks/useRecallSeed.ts

@@ -1,10 +1,13 @@
 import { useAppSelector, useAppStore } from 'app/store/storeHooks';
 import { MetadataHandlers, MetadataUtils } from 'features/metadata/parsing';
 import { selectActiveTab } from 'features/ui/store/uiSelectors';
+import type { TabName } from 'features/ui/store/uiTypes';
 import { useCallback, useEffect, useMemo, useState } from 'react';
 import { useDebouncedMetadata } from 'services/api/hooks/useDebouncedMetadata';
 import type { ImageDTO } from 'services/api/types';
 
+const ALLOWED_TABS: TabName[] = ['canvas', 'generate', 'upscaling'];
+
 export const useRecallSeed = (imageDTO: ImageDTO) => {
   const store = useAppStore();
   const tab = useAppSelector(selectActiveTab);
@@ -30,7 +33,7 @@ export const useRecallSeed = (imageDTO: ImageDTO) => {
       return false;
     }
 
-    if (tab !== 'canvas' && tab !== 'generate') {
+    if (!ALLOWED_TABS.includes(tab)) {
       return false;
     }
 

invokeai/frontend/web/src/features/gallery/store/gallerySlice.ts

@@ -1,4 +1,3 @@
-import { objectEquals } from '@observ33r/object-equals';
 import type { PayloadAction } from '@reduxjs/toolkit';
 import { createSlice } from '@reduxjs/toolkit';
 import type { RootState } from 'app/store/store';
@@ -43,54 +42,16 @@ const slice = createSlice({
   initialState: getInitialState(),
   reducers: {
     imageSelected: (state, action: PayloadAction<string | null>) => {
-      // Let's be efficient here and not update the selection unless it has actually changed. This helps to prevent
-      // unnecessary re-renders of the gallery.
-
       const selectedImageName = action.payload;
 
-      // If we got `null`, clear the selection
       if (!selectedImageName) {
-        // But only if we have images selected
-        if (state.selection.length > 0) {
-          state.selection = [];
-        }
-        return;
-      }
-
-      // If we have multiple images selected, clear the selection and select the new image
-      if (state.selection.length !== 1) {
+        state.selection = [];
+      } else {
         state.selection = [selectedImageName];
-        return;
       }
-
-      // If the selected image is different from the current selection, clear the selection and select the new image
-      if (state.selection[0] !== selectedImageName) {
-        state.selection = [selectedImageName];
-        return;
-      }
-
-      // Else we have the same image selected, do nothing
     },
     selectionChanged: (state, action: PayloadAction<string[]>) => {
-      // Let's be efficient here and not update the selection unless it has actually changed. This helps to prevent
-      // unnecessary re-renders of the gallery.
-
-      // Remove duplicates from the selection
-      const newSelection = uniq(action.payload);
-
-      // If the new selection has a different length, update the selection
-      if (newSelection.length !== state.selection.length) {
-        state.selection = newSelection;
-        return;
-      }
-
-      // If the new selection is different, update the selection
-      if (!objectEquals(newSelection, state.selection)) {
-        state.selection = newSelection;
-        return;
-      }
-
-      // Else we have the same selection, do nothing
+      state.selection = uniq(action.payload);
     },
     imageToCompareChanged: (state, action: PayloadAction<string | null>) => {
       state.imageToCompare = action.payload;

invokeai/frontend/web/src/features/metadata/parsing.tsx

@@ -9,14 +9,13 @@ import { bboxHeightChanged, bboxWidthChanged, canvasMetadataRecalled } from 'fea
 import { loraAllDeleted, loraRecalled } from 'features/controlLayers/store/lorasSlice';
 import {
   heightChanged,
-  negativePrompt2Changed,
   negativePromptChanged,
-  positivePrompt2Changed,
   positivePromptChanged,
   refinerModelChanged,
   selectBase,
   setCfgRescaleMultiplier,
   setCfgScale,
+  setClipSkip,
   setGuidance,
   setImg2imgStrength,
   setRefinerCFGScale,
@@ -30,7 +29,6 @@ import {
   setSeamlessYAxis,
   setSeed,
   setSteps,
-  shouldConcatPromptsChanged,
   vaeSelected,
   widthChanged,
 } from 'features/controlLayers/store/paramsSlice';
@@ -44,12 +42,12 @@ import { modelSelected } from 'features/parameters/store/actions';
 import type {
   ParameterCFGRescaleMultiplier,
   ParameterCFGScale,
+  ParameterCLIPSkip,
   ParameterGuidance,
   ParameterHeight,
   ParameterModel,
   ParameterNegativePrompt,
   ParameterPositivePrompt,
-  ParameterPositiveStylePromptSDXL,
   ParameterScheduler,
   ParameterSDXLRefinerModel,
   ParameterSDXLRefinerNegativeAestheticScore,
@@ -67,12 +65,11 @@ import {
   zLoRAWeight,
   zParameterCFGRescaleMultiplier,
   zParameterCFGScale,
+  zParameterCLIPSkip,
   zParameterGuidance,
   zParameterImageDimension,
   zParameterNegativePrompt,
-  zParameterNegativeStylePromptSDXL,
   zParameterPositivePrompt,
-  zParameterPositiveStylePromptSDXL,
   zParameterScheduler,
   zParameterSDXLRefinerNegativeAestheticScore,
   zParameterSDXLRefinerPositiveAestheticScore,
@@ -289,46 +286,6 @@ const NegativePrompt: SingleMetadataHandler<ParameterNegativePrompt> = {
 };
 //#endregion Negative Prompt
 
-//#region SDXL Positive Style Prompt
-const PositiveStylePrompt: SingleMetadataHandler<ParameterPositiveStylePromptSDXL> = {
-  [SingleMetadataKey]: true,
-  type: 'PositiveStylePrompt',
-  parse: (metadata, _store) => {
-    const raw = getProperty(metadata, 'positive_style_prompt');
-    const parsed = zParameterPositiveStylePromptSDXL.parse(raw);
-    return Promise.resolve(parsed);
-  },
-  recall: (value, store) => {
-    store.dispatch(positivePrompt2Changed(value));
-  },
-  i18nKey: 'sdxl.posStylePrompt',
-  LabelComponent: MetadataLabel,
-  ValueComponent: ({ value }: SingleMetadataValueProps<ParameterPositiveStylePromptSDXL>) => (
-    <MetadataPrimitiveValue value={value} />
-  ),
-};
-//#endregion SDXL Positive Style Prompt
-
-//#region SDXL Negative Style Prompt
-const NegativeStylePrompt: SingleMetadataHandler<ParameterPositiveStylePromptSDXL> = {
-  [SingleMetadataKey]: true,
-  type: 'NegativeStylePrompt',
-  parse: (metadata, _store) => {
-    const raw = getProperty(metadata, 'negative_style_prompt');
-    const parsed = zParameterNegativeStylePromptSDXL.parse(raw);
-    return Promise.resolve(parsed);
-  },
-  recall: (value, store) => {
-    store.dispatch(negativePrompt2Changed(value));
-  },
-  i18nKey: 'sdxl.negStylePrompt',
-  LabelComponent: MetadataLabel,
-  ValueComponent: ({ value }: SingleMetadataValueProps<ParameterPositiveStylePromptSDXL>) => (
-    <MetadataPrimitiveValue value={value} />
-  ),
-};
-//#endregion SDXL Negative Style Prompt
-
 //#region CFG Scale
 const CFGScale: SingleMetadataHandler<ParameterCFGScale> = {
   [SingleMetadataKey]: true,
@@ -367,6 +324,24 @@ const CFGRescaleMultiplier: SingleMetadataHandler<ParameterCFGRescaleMultiplier>
 };
 //#endregion CFG Rescale Multiplier
 
+//#region CLIP Skip
+const CLIPSkip: SingleMetadataHandler<ParameterCLIPSkip> = {
+  [SingleMetadataKey]: true,
+  type: 'CLIPSkip',
+  parse: (metadata, _store) => {
+    const raw = getProperty(metadata, 'clip_skip');
+    const parsed = zParameterCLIPSkip.parse(raw);
+    return Promise.resolve(parsed);
+  },
+  recall: (value, store) => {
+    store.dispatch(setClipSkip(value));
+  },
+  i18nKey: 'metadata.clipSkip',
+  LabelComponent: MetadataLabel,
+  ValueComponent: ({ value }: SingleMetadataValueProps<ParameterCLIPSkip>) => <MetadataPrimitiveValue value={value} />,
+};
+//#endregion CLIP Skip
+
 //#region Guidance
 const Guidance: SingleMetadataHandler<ParameterGuidance> = {
   [SingleMetadataKey]: true,
@@ -927,10 +902,9 @@ export const MetadataHandlers = {
   GenerationMode,
   PositivePrompt,
   NegativePrompt,
-  PositiveStylePrompt,
-  NegativeStylePrompt,
   CFGScale,
   CFGRescaleMultiplier,
+  CLIPSkip,
   Guidance,
   Scheduler,
   Width,
@@ -1052,26 +1026,6 @@ const recallByHandlers = async (arg: {
     }
   }
 
-  // We may need to update the prompt concat flag based on the recalled prompts
-  const positivePrompt = recalled.get(MetadataHandlers.PositivePrompt);
-  const negativePrompt = recalled.get(MetadataHandlers.NegativePrompt);
-  const positiveStylePrompt = recalled.get(MetadataHandlers.PositiveStylePrompt);
-  const negativeStylePrompt = recalled.get(MetadataHandlers.NegativeStylePrompt);
-
-  // The values will be undefined if the handler was not recalled
-  if (
-    positivePrompt !== undefined ||
-    negativePrompt !== undefined ||
-    positiveStylePrompt !== undefined ||
-    negativeStylePrompt !== undefined
-  ) {
-    const concat =
-      (Boolean(positiveStylePrompt) && positiveStylePrompt === positivePrompt) ||
-      (Boolean(negativeStylePrompt) && negativeStylePrompt === negativePrompt);
-
-    store.dispatch(shouldConcatPromptsChanged(concat));
-  }
-
   if (!silent) {
     if (recalled.size > 0) {
       toast({
@@ -1094,12 +1048,7 @@ const recallByHandlers = async (arg: {
 const recallPrompts = async (metadata: unknown, store: AppStore) => {
   const recalled = await recallByHandlers({
     metadata,
-    handlers: [
-      MetadataHandlers.PositivePrompt,
-      MetadataHandlers.NegativePrompt,
-      MetadataHandlers.PositiveStylePrompt,
-      MetadataHandlers.NegativeStylePrompt,
-    ],
+    handlers: [MetadataHandlers.PositivePrompt, MetadataHandlers.NegativePrompt],
     store,
     silent: true,
   });

invokeai/frontend/web/src/features/modelManagerV2/subpanels/AddModelPanel/LaunchpadForm/LaunchpadForm.tsx

@@ -2,7 +2,7 @@ import { Button, Flex, Grid, Heading, Text } from '@invoke-ai/ui-library';
 import ScrollableContent from 'common/components/OverlayScrollbars/ScrollableContent';
 import { map } from 'es-toolkit/compat';
 import { setInstallModelsTabByName } from 'features/modelManagerV2/store/installModelsStore';
-import { StarterBundleButton } from 'features/modelManagerV2/subpanels/AddModelPanel/StarterModels/StarterBundle';
+import { StarterBundleButton } from 'features/modelManagerV2/subpanels/AddModelPanel/StarterModels/StarterBundleButton';
 import { StarterBundleTooltipContentCompact } from 'features/modelManagerV2/subpanels/AddModelPanel/StarterModels/StarterBundleTooltipContentCompact';
 import { memo, useCallback } from 'react';
 import { useTranslation } from 'react-i18next';

invokeai/frontend/web/src/features/modelManagerV2/subpanels/AddModelPanel/StarterModels/StarterBundle.tsx

@@ -1,21 +0,0 @@
-import type { ButtonProps } from '@invoke-ai/ui-library';
-import { Button } from '@invoke-ai/ui-library';
-import { useStarterBundleInstall } from 'features/modelManagerV2/hooks/useStarterBundleInstall';
-import { useStarterBundleInstallStatus } from 'features/modelManagerV2/hooks/useStarterBundleInstallStatus';
-import { useCallback } from 'react';
-import type { S } from 'services/api/types';
-
-export const StarterBundleButton = ({ bundle, ...rest }: { bundle: S['StarterModelBundle'] } & ButtonProps) => {
-  const { installBundle } = useStarterBundleInstall();
-  const { install } = useStarterBundleInstallStatus(bundle);
-
-  const handleClickBundle = useCallback(() => {
-    installBundle(bundle);
-  }, [installBundle, bundle]);
-
-  return (
-    <Button onClick={handleClickBundle} isDisabled={install.length === 0} {...rest}>
-      {bundle.name}
-    </Button>
-  );
-};

invokeai/frontend/web/src/features/modelManagerV2/subpanels/AddModelPanel/StarterModels/StarterBundleButton.tsx

@@ -0,0 +1,61 @@
+import type { ButtonProps } from '@invoke-ai/ui-library';
+import {
+  Button,
+  ConfirmationAlertDialog,
+  Flex,
+  ListItem,
+  Text,
+  UnorderedList,
+  useDisclosure,
+} from '@invoke-ai/ui-library';
+import { useStarterBundleInstall } from 'features/modelManagerV2/hooks/useStarterBundleInstall';
+import { useStarterBundleInstallStatus } from 'features/modelManagerV2/hooks/useStarterBundleInstallStatus';
+import { t } from 'i18next';
+import type { MouseEvent } from 'react';
+import { useCallback } from 'react';
+import type { S } from 'services/api/types';
+
+export const StarterBundleButton = ({ bundle, ...rest }: { bundle: S['StarterModelBundle'] } & ButtonProps) => {
+  const { installBundle } = useStarterBundleInstall();
+  const { install } = useStarterBundleInstallStatus(bundle);
+  const { isOpen, onOpen, onClose } = useDisclosure();
+
+  const onClickBundle = useCallback(
+    (e: MouseEvent<HTMLButtonElement>) => {
+      e.stopPropagation();
+      onOpen();
+    },
+    [onOpen]
+  );
+  const handleInstallBundle = useCallback(() => {
+    installBundle(bundle);
+  }, [installBundle, bundle]);
+
+  return (
+    <>
+      <Button onClick={onClickBundle} isDisabled={install.length === 0} {...rest}>
+        {bundle.name}
+      </Button>
+      <ConfirmationAlertDialog
+        isOpen={isOpen}
+        onClose={onClose}
+        title={t('modelManager.installBundle')}
+        acceptCallback={handleInstallBundle}
+        acceptButtonText={t('modelManager.install')}
+        useInert={false}
+      >
+        <Flex rowGap={4} flexDirection="column">
+          <Text fontWeight="bold">{t('modelManager.installBundleMsg1', { bundleName: bundle.name })}</Text>
+          <Text>{t('modelManager.installBundleMsg2', { count: install.length })}</Text>
+          <UnorderedList>
+            {install.map((model, index) => (
+              <ListItem key={index} wordBreak="break-all">
+                <Text>{model.config.name}</Text>
+              </ListItem>
+            ))}
+          </UnorderedList>
+        </Flex>
+      </ConfirmationAlertDialog>
+    </>
+  );
+};

invokeai/frontend/web/src/features/modelManagerV2/subpanels/AddModelPanel/StarterModels/StarterModelsResults.tsx

@@ -7,7 +7,7 @@ import { useTranslation } from 'react-i18next';
 import { PiInfoBold, PiXBold } from 'react-icons/pi';
 import type { GetStarterModelsResponse } from 'services/api/endpoints/models';
 
-import { StarterBundleButton } from './StarterBundle';
+import { StarterBundleButton } from './StarterBundleButton';
 import { StarterBundleTooltipContent } from './StarterBundleTooltipContent';
 import { StarterModelsResultItem } from './StarterModelsResultItem';
 

invokeai/frontend/web/src/features/nodes/components/flow/nodes/Invocation/InvocationNodeHeader.tsx

@@ -1,7 +1,7 @@
 import type { SystemStyleObject } from '@invoke-ai/ui-library';
 import { Flex } from '@invoke-ai/ui-library';
+import InvocationNodeTitle from 'features/nodes/components/flow/nodes/common/InvocationNodeTitle';
 import NodeCollapseButton from 'features/nodes/components/flow/nodes/common/NodeCollapseButton';
-import NodeTitle from 'features/nodes/components/flow/nodes/common/NodeTitle';
 import InvocationNodeClassificationIcon from 'features/nodes/components/flow/nodes/Invocation/InvocationNodeClassificationIcon';
 import { useNodeHasErrors } from 'features/nodes/hooks/useNodeIsInvalid';
 import { memo } from 'react';
@@ -35,7 +35,7 @@ const InvocationNodeHeader = ({ nodeId, isOpen }: Props) => {
     <Flex sx={sx} data-is-open={isOpen} data-is-invalid={isInvalid}>
       <NodeCollapseButton nodeId={nodeId} isOpen={isOpen} />
       <InvocationNodeClassificationIcon nodeId={nodeId} />
-      <NodeTitle nodeId={nodeId} />
+      <InvocationNodeTitle nodeId={nodeId} />
       <Flex alignItems="center">
         <InvocationNodeStatusIndicator nodeId={nodeId} />
         <InvocationNodeInfoIcon nodeId={nodeId} />

invokeai/frontend/web/src/features/nodes/components/flow/nodes/Invocation/fields/InputFieldAddToFormRoot.tsx

@@ -11,7 +11,7 @@ type Props = {
 
 export const InputFieldAddToFormRoot = memo(({ nodeId, fieldName }: Props) => {
   const { t } = useTranslation();
-  const addToRoot = useAddNodeFieldToRoot(nodeId, fieldName);
+  const { isAddedToRoot, addNodeFieldToRoot } = useAddNodeFieldToRoot(nodeId, fieldName);
 
   return (
     <IconButton
@@ -21,7 +21,8 @@ export const InputFieldAddToFormRoot = memo(({ nodeId, fieldName }: Props) => {
       icon={<PiPlusBold />}
       pointerEvents="auto"
       size="xs"
-      onClick={addToRoot}
+      onClick={addNodeFieldToRoot}
+      isDisabled={isAddedToRoot}
     />
   );
 });

invokeai/frontend/web/src/features/nodes/components/flow/nodes/Invocation/fields/InputFieldTitle.tsx

@@ -30,12 +30,12 @@ const labelSx: SystemStyleObject = {
   _hover: {
     fontWeight: 'semibold !important',
   },
-  '&[data-is-invalid="true"]': {
-    color: 'error.300',
-  },
   '&[data-is-added-to-form="true"]': {
     color: 'blue.300',
   },
+  '&[data-is-invalid="true"]': {
+    color: 'error.300',
+  },
   '&[data-is-disabled="true"]': {
     opacity: 0.5,
   },
@@ -106,7 +106,7 @@ export const InputFieldTitle = memo((props: Props) => {
           onDoubleClick={onDoubleClick}
         >
           {editable.value}
-          {isAddedToForm && <Icon as={PiLinkBold} color="blue.200" ml={1} />}
+          {isAddedToForm && <Icon as={PiLinkBold} color={isInvalid ? 'error.300' : 'blue.200'} ml={1} />}
         </Text>
       </Tooltip>
     );

invokeai/frontend/web/src/features/nodes/components/flow/nodes/common/InvocationNodeTitle.tsx

@@ -1,22 +1,32 @@
+import type { SystemStyleObject } from '@invoke-ai/ui-library';
 import { Flex, Input, Text } from '@invoke-ai/ui-library';
 import { useAppDispatch } from 'app/store/storeHooks';
 import { useEditable } from 'common/hooks/useEditable';
 import { useBatchGroupColorToken } from 'features/nodes/hooks/useBatchGroupColorToken';
 import { useBatchGroupId } from 'features/nodes/hooks/useBatchGroupId';
+import { useNodeHasErrors } from 'features/nodes/hooks/useNodeIsInvalid';
 import { useNodeTemplateTitleSafe } from 'features/nodes/hooks/useNodeTemplateTitleSafe';
 import { useNodeUserTitleSafe } from 'features/nodes/hooks/useNodeUserTitleSafe';
 import { nodeLabelChanged } from 'features/nodes/store/nodesSlice';
-import { NO_FIT_ON_DOUBLE_CLICK_CLASS } from 'features/nodes/types/constants';
+import { NO_DRAG_CLASS, NO_FIT_ON_DOUBLE_CLICK_CLASS } from 'features/nodes/types/constants';
 import { memo, useCallback, useMemo, useRef } from 'react';
 import { useTranslation } from 'react-i18next';
 
+const labelSx: SystemStyleObject = {
+  fontWeight: 'semibold',
+  '&[data-is-invalid="true"]': {
+    color: 'error.300',
+  },
+};
+
 type Props = {
   nodeId: string;
   title?: string;
 };
 
-const NodeTitle = ({ nodeId, title }: Props) => {
+const InvocationNodeTitle = ({ nodeId, title }: Props) => {
   const dispatch = useAppDispatch();
+  const isInvalid = useNodeHasErrors();
   const label = useNodeUserTitleSafe();
   const batchGroupId = useBatchGroupId(nodeId);
   const batchGroupColorToken = useBatchGroupColorToken(batchGroupId);
@@ -53,16 +63,18 @@ const NodeTitle = ({ nodeId, title }: Props) => {
       {!editable.isEditing && (
         <Text
           className={NO_FIT_ON_DOUBLE_CLICK_CLASS}
-          fontWeight="semibold"
-          color={batchGroupColorToken}
-          onDoubleClick={editable.startEditing}
+          sx={labelSx}
           noOfLines={1}
+          color={batchGroupColorToken}
+          data-is-invalid={isInvalid}
+          onDoubleClick={editable.startEditing}
         >
           {titleWithBatchGroupId}
         </Text>
       )}
       {editable.isEditing && (
         <Input
+          className={NO_DRAG_CLASS}
           ref={inputRef}
           {...editable.inputProps}
           variant="outline"
@@ -73,4 +85,4 @@ const NodeTitle = ({ nodeId, title }: Props) => {
   );
 };
 
-export default memo(NodeTitle);
+export default memo(InvocationNodeTitle);

invokeai/frontend/web/src/features/nodes/components/flow/nodes/common/NodeWrapper.tsx

@@ -5,6 +5,7 @@ import { useInvocationNodeContext } from 'features/nodes/components/flow/nodes/I
 import { useIsWorkflowEditorLocked } from 'features/nodes/hooks/useIsWorkflowEditorLocked';
 import { useMouseOverFormField, useMouseOverNode } from 'features/nodes/hooks/useMouseOverNode';
 import { useNodeExecutionState } from 'features/nodes/hooks/useNodeExecutionState';
+import { useNodeHasErrors } from 'features/nodes/hooks/useNodeIsInvalid';
 import { useZoomToNode } from 'features/nodes/hooks/useZoomToNode';
 import { selectNodeOpacity } from 'features/nodes/store/workflowSettingsSlice';
 import { DRAG_HANDLE_CLASSNAME, NO_FIT_ON_DOUBLE_CLICK_CLASS, NODE_WIDTH } from 'features/nodes/types/constants';
@@ -29,6 +30,8 @@ const NodeWrapper = (props: NodeWrapperProps) => {
   const mouseOverFormField = useMouseOverFormField(nodeId);
   const zoomToNode = useZoomToNode(nodeId);
   const isLocked = useIsWorkflowEditorLocked();
+  const isInvalid = useNodeHasErrors();
+  const hasError = isMissingTemplate || isInvalid;
 
   const executionState = useNodeExecutionState(nodeId);
   const isInProgress = executionState?.status === zNodeStatus.enum.IN_PROGRESS;
@@ -74,7 +77,7 @@ const NodeWrapper = (props: NodeWrapperProps) => {
       data-is-editor-locked={isLocked}
       data-is-selected={selected}
       data-is-mouse-over-form-field={mouseOverFormField.isMouseOverFormField}
-      data-status={isMissingTemplate ? 'error' : needsUpdate ? 'warning' : undefined}
+      data-status={hasError ? 'error' : needsUpdate ? 'warning' : undefined}
     >
       <Box sx={shadowsSx} />
       <Box sx={inProgressSx} data-is-in-progress={isInProgress} />

invokeai/frontend/web/src/features/nodes/components/flow/nodes/common/NonInvocationNodeTitle.tsx

@@ -4,7 +4,7 @@ import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
 import { useEditable } from 'common/hooks/useEditable';
 import { nodeLabelChanged } from 'features/nodes/store/nodesSlice';
 import { selectNodes } from 'features/nodes/store/selectors';
-import { NO_FIT_ON_DOUBLE_CLICK_CLASS } from 'features/nodes/types/constants';
+import { NO_DRAG_CLASS, NO_FIT_ON_DOUBLE_CLICK_CLASS } from 'features/nodes/types/constants';
 import { memo, useCallback, useMemo, useRef } from 'react';
 import { useTranslation } from 'react-i18next';
 
@@ -56,6 +56,7 @@ const NonInvocationNodeTitle = ({ nodeId, title }: Props) => {
       )}
       {editable.isEditing && (
         <Input
+          className={NO_DRAG_CLASS}
           ref={inputRef}
           {...editable.inputProps}
           variant="outline"

invokeai/frontend/web/src/features/nodes/components/sidePanel/builder/use-add-node-field-to-root.ts

@@ -2,15 +2,20 @@ import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
 import { useInputFieldInstance } from 'features/nodes/hooks/useInputFieldInstance';
 import { useInputFieldTemplateOrThrow } from 'features/nodes/hooks/useInputFieldTemplateOrThrow';
 import { formElementAdded } from 'features/nodes/store/nodesSlice';
-import { selectFormRootElementId } from 'features/nodes/store/selectors';
+import { buildSelectWorkflowFormNodeExists, selectFormRootElementId } from 'features/nodes/store/selectors';
 import { buildNodeFieldElement } from 'features/nodes/types/workflow';
-import { useCallback } from 'react';
+import { useCallback, useMemo } from 'react';
 
 export const useAddNodeFieldToRoot = (nodeId: string, fieldName: string) => {
   const dispatch = useAppDispatch();
   const rootElementId = useAppSelector(selectFormRootElementId);
   const fieldTemplate = useInputFieldTemplateOrThrow(fieldName);
   const field = useInputFieldInstance(fieldName);
+  const selectWorkflowFormNodeExists = useMemo(
+    () => buildSelectWorkflowFormNodeExists(nodeId, fieldName),
+    [nodeId, fieldName]
+  );
+  const isAddedToRoot = useAppSelector(selectWorkflowFormNodeExists);
 
   const addNodeFieldToRoot = useCallback(() => {
     const element = buildNodeFieldElement(nodeId, fieldName, fieldTemplate.type);
@@ -23,5 +28,5 @@ export const useAddNodeFieldToRoot = (nodeId: string, fieldName: string) => {
     );
   }, [nodeId, fieldName, fieldTemplate.type, dispatch, rootElementId, field.value]);
 
-  return addNodeFieldToRoot;
+  return { isAddedToRoot, addNodeFieldToRoot };
 };

invokeai/frontend/web/src/features/nodes/store/selectors.ts

@@ -103,3 +103,7 @@ export const selectWorkflowFormNodeFieldFieldIdentifiersDeduped = createSelector
 );
 
 export const buildSelectElement = (id: string) => createNodesSelector((workflow) => workflow.form?.elements[id]);
+export const buildSelectWorkflowFormNodeExists = (nodeId: string, fieldName: string) =>
+  createSelector(selectWorkflowFormNodeFieldFieldIdentifiersDeduped, (identifiers) =>
+    identifiers.some((identifier) => identifier.nodeId === nodeId && identifier.fieldName === fieldName)
+  );

invokeai/frontend/web/src/features/nodes/util/graph/buildMultidiffusionUpscaleGraph.ts

@@ -115,7 +115,7 @@ export const buildMultidiffusionUpscaleGraph = async (state: RootState): Promise
       type: 'sdxl_compel_prompt',
       id: getPrefixedId('neg_cond'),
       prompt: prompts.negative,
-      style: prompts.negativeStyle,
+      style: prompts.negative,
     });
     modelLoader = g.addNode({
       type: 'sdxl_model_loader',
@@ -130,21 +130,14 @@ export const buildMultidiffusionUpscaleGraph = async (state: RootState): Promise
     g.addEdge(modelLoader, 'unet', tiledMultidiffusion, 'unet');
 
     g.addEdge(positivePrompt, 'value', posCond, 'prompt');
+    g.addEdge(positivePrompt, 'value', posCond, 'style');
 
     addSDXLLoRAs(state, g, tiledMultidiffusion, modelLoader, null, posCond, negCond);
 
     g.upsertMetadata({
       negative_prompt: prompts.negative,
-      negative_style_prompt: prompts.negativeStyle,
     });
-
-    if (prompts.useMainPromptsForStyle) {
-      g.addEdge(positivePrompt, 'value', posCond, 'style');
-      g.addEdgeToMetadata(positivePrompt, 'value', 'positive_style_prompt');
-    } else {
-      posCond.style = prompts.positiveStyle;
-      g.upsertMetadata({ positive_style_prompt: prompts.positiveStyle });
-    }
+    g.addEdgeToMetadata(positivePrompt, 'value', 'positive_prompt');
   } else {
     const prompts = selectPresetModifiedPrompts(state);
 
@@ -179,6 +172,8 @@ export const buildMultidiffusionUpscaleGraph = async (state: RootState): Promise
     g.upsertMetadata({
       negative_prompt: prompts.negative,
     });
+
+    g.addEdgeToMetadata(positivePrompt, 'value', 'positive_prompt');
   }
 
   const modelConfig = await fetchModelConfigWithTypeGuard(model.key, isNonRefinerMainModelConfig);

invokeai/frontend/web/src/features/nodes/util/graph/generation/buildFLUXGraph.ts

@@ -156,17 +156,24 @@ export const buildFLUXGraph = async (arg: GraphBuilderArg): Promise<GraphBuilder
       .filter((entity) => getGlobalReferenceImageWarnings(entity, model).length === 0);
 
     if (validFLUXKontextConfigs.length > 0) {
-      const kontextConcatenator = g.addNode({
-        id: getPrefixedId('flux_kontext_image_prep'),
-        type: 'flux_kontext_image_prep',
-        images: validFLUXKontextConfigs.map(({ config }) => zImageField.parse(config.image)),
+      const fluxKontextCollect = g.addNode({
+        type: 'collect',
+        id: getPrefixedId('flux_kontext_collect'),
       });
-      const kontextConditioning = g.addNode({
-        type: 'flux_kontext',
-        id: getPrefixedId('flux_kontext'),
-      });
-      g.addEdge(kontextConcatenator, 'image', kontextConditioning, 'image');
-      g.addEdge(kontextConditioning, 'kontext_cond', denoise, 'kontext_conditioning');
+      for (const { config } of validFLUXKontextConfigs) {
+        const kontextImagePrep = g.addNode({
+          id: getPrefixedId('flux_kontext_image_prep'),
+          type: 'flux_kontext_image_prep',
+          images: [zImageField.parse(config.image)],
+        });
+        const kontextConditioning = g.addNode({
+          type: 'flux_kontext',
+          id: getPrefixedId('flux_kontext'),
+        });
+        g.addEdge(kontextImagePrep, 'image', kontextConditioning, 'image');
+        g.addEdge(kontextConditioning, 'kontext_cond', fluxKontextCollect, 'item');
+      }
+      g.addEdge(fluxKontextCollect, 'collection', denoise, 'kontext_conditioning');
 
       g.upsertMetadata({ ref_images: [validFLUXKontextConfigs] }, 'merge');
     }

invokeai/frontend/web/src/features/nodes/util/graph/generation/buildFluxKontextGraph.ts

@@ -4,8 +4,7 @@ import { selectMainModelConfig } from 'features/controlLayers/store/paramsSlice'
 import { selectRefImagesSlice } from 'features/controlLayers/store/refImagesSlice';
 import { isFluxKontextAspectRatioID, isFluxKontextReferenceImageConfig } from 'features/controlLayers/store/types';
 import { getGlobalReferenceImageWarnings } from 'features/controlLayers/store/validators';
-import type { ImageField } from 'features/nodes/types/common';
-import { zModelIdentifierField } from 'features/nodes/types/common';
+import { zImageField, zModelIdentifierField } from 'features/nodes/types/common';
 import { Graph } from 'features/nodes/util/graph/generation/Graph';
 import {
   getOriginalAndScaledSizesForTextToImage,
@@ -39,34 +38,63 @@ export const buildFluxKontextGraph = (arg: GraphBuilderArg): GraphBuilderReturn
   const validRefImages = refImages.entities
     .filter((entity) => entity.isEnabled)
     .filter((entity) => isFluxKontextReferenceImageConfig(entity.config))
-    .filter((entity) => getGlobalReferenceImageWarnings(entity, model).length === 0)
-    .toReversed(); // sends them in order they are displayed in the list
-
-  let input_image: ImageField | undefined = undefined;
-
-  if (validRefImages[0]) {
-    assert(validRefImages.length === 1, 'Flux Kontext can have at most one reference image');
-
-    assert(validRefImages[0].config.image, 'Image is required for reference image');
-    input_image = {
-      image_name: validRefImages[0].config.image.image_name,
-    };
-  }
+    .filter((entity) => getGlobalReferenceImageWarnings(entity, model).length === 0);
 
   const g = new Graph(getPrefixedId('flux_kontext_txt2img_graph'));
   const positivePrompt = g.addNode({
     id: getPrefixedId('positive_prompt'),
     type: 'string',
   });
-  const fluxKontextImage = g.addNode({
-    // @ts-expect-error: These nodes are not available in the OSS application
-    type: input_image ? 'flux_kontext_edit_image' : 'flux_kontext_generate_image',
-    model: zModelIdentifierField.parse(model),
-    aspect_ratio: aspectRatio.id,
-    input_image,
-    prompt_upsampling: true,
-    ...selectCanvasOutputFields(state),
-  });
+
+  let fluxKontextImage;
+
+  if (validRefImages.length > 0) {
+    if (validRefImages.length === 1) {
+      // Single reference image - use it directly
+      const firstImage = validRefImages[0]?.config.image;
+      assert(firstImage, 'First image should exist when validRefImages.length > 0');
+
+      fluxKontextImage = g.addNode({
+        // @ts-expect-error: These nodes are not available in the OSS application
+        type: 'flux_kontext_edit_image',
+        model: zModelIdentifierField.parse(model),
+        aspect_ratio: aspectRatio.id,
+        prompt_upsampling: true,
+        input_image: {
+          image_name: firstImage.image_name,
+        },
+        ...selectCanvasOutputFields(state),
+      });
+    } else {
+      // Multiple reference images - use concatenation
+      const kontextConcatenator = g.addNode({
+        id: getPrefixedId('flux_kontext_image_prep'),
+        type: 'flux_kontext_image_prep',
+        images: validRefImages.map(({ config }) => zImageField.parse(config.image)),
+      });
+
+      fluxKontextImage = g.addNode({
+        // @ts-expect-error: These nodes are not available in the OSS application
+        type: 'flux_kontext_edit_image',
+        model: zModelIdentifierField.parse(model),
+        aspect_ratio: aspectRatio.id,
+        prompt_upsampling: true,
+
+        ...selectCanvasOutputFields(state),
+      });
+      // @ts-expect-error: These nodes are not available in the OSS application
+      g.addEdge(kontextConcatenator, 'image', fluxKontextImage, 'input_image');
+    }
+  } else {
+    fluxKontextImage = g.addNode({
+      // @ts-expect-error: These nodes are not available in the OSS application
+      type: 'flux_kontext_generate_image',
+      model: zModelIdentifierField.parse(model),
+      aspect_ratio: aspectRatio.id,
+      prompt_upsampling: true,
+      ...selectCanvasOutputFields(state),
+    });
+  }
 
   g.addEdge(
     positivePrompt,
@@ -83,6 +111,10 @@ export const buildFluxKontextGraph = (arg: GraphBuilderArg): GraphBuilderReturn
     height: originalSize.height,
   });
 
+  if (validRefImages.length > 0) {
+    g.upsertMetadata({ ref_images: [validRefImages] }, 'merge');
+  }
+
   g.setMetadataReceivingNode(fluxKontextImage);
 
   return {

invokeai/frontend/web/src/features/nodes/util/graph/generation/buildSDXLGraph.ts

@@ -78,7 +78,7 @@ export const buildSDXLGraph = async (arg: GraphBuilderArg): Promise<GraphBuilder
     type: 'sdxl_compel_prompt',
     id: getPrefixedId('neg_cond'),
     prompt: prompts.negative,
-    style: prompts.useMainPromptsForStyle ? prompts.negative : prompts.negativeStyle,
+    style: prompts.negative,
   });
   const negCondCollect = g.addNode({
     type: 'collect',
@@ -123,6 +123,8 @@ export const buildSDXLGraph = async (arg: GraphBuilderArg): Promise<GraphBuilder
   g.addEdge(modelLoader, 'clip2', negCond, 'clip2');
 
   g.addEdge(positivePrompt, 'value', posCond, 'prompt');
+  g.addEdge(positivePrompt, 'value', posCond, 'style');
+
   g.addEdge(posCond, 'conditioning', posCondCollect, 'item');
   g.addEdge(posCondCollect, 'collection', denoise, 'positive_conditioning');
 
@@ -141,20 +143,11 @@ export const buildSDXLGraph = async (arg: GraphBuilderArg): Promise<GraphBuilder
     rand_device: shouldUseCpuNoise ? 'cpu' : 'cuda',
     scheduler,
     negative_prompt: prompts.negative,
-    negative_style_prompt: prompts.useMainPromptsForStyle ? prompts.negative : prompts.negativeStyle,
     vae: vae ?? undefined,
   });
   g.addEdgeToMetadata(seed, 'value', 'seed');
   g.addEdgeToMetadata(positivePrompt, 'value', 'positive_prompt');
 
-  if (prompts.useMainPromptsForStyle) {
-    g.addEdge(positivePrompt, 'value', posCond, 'style');
-    g.addEdgeToMetadata(positivePrompt, 'value', 'positive_style_prompt');
-  } else {
-    posCond.style = prompts.positiveStyle;
-    g.upsertMetadata({ positive_style_prompt: prompts.positiveStyle });
-  }
-
   const seamless = addSeamless(state, g, denoise, modelLoader, vaeLoader);
 
   addSDXLLoRAs(state, g, denoise, modelLoader, seamless, posCond, negCond);

invokeai/frontend/web/src/features/nodes/util/graph/graphBuilderUtils.ts

@@ -85,7 +85,7 @@ export const selectPresetModifiedPrompts = createSelector(
   selectListStylePresetsRequestState,
   (params, stylePresetSlice, listStylePresetsRequestState) => {
     const negativePrompt = params.negativePrompt ?? '';
-    const { positivePrompt, positivePrompt2, negativePrompt2, shouldConcatPrompts } = params;
+    const { positivePrompt } = params;
     const { activeStylePresetId } = stylePresetSlice;
 
     if (activeStylePresetId) {
@@ -107,9 +107,6 @@ export const selectPresetModifiedPrompts = createSelector(
         return {
           positive: presetModifiedPositivePrompt,
           negative: presetModifiedNegativePrompt,
-          positiveStyle: positivePrompt2,
-          negativeStyle: negativePrompt2,
-          useMainPromptsForStyle: shouldConcatPrompts,
         };
       }
     }
@@ -117,9 +114,6 @@ export const selectPresetModifiedPrompts = createSelector(
     return {
       positive: positivePrompt,
       negative: negativePrompt,
-      positiveStyle: positivePrompt2,
-      negativeStyle: negativePrompt2,
-      useMainPromptsForStyle: shouldConcatPrompts,
     };
   }
 );

invokeai/frontend/web/src/features/parameters/components/Advanced/ParamClipSkip.tsx

@@ -1,14 +1,14 @@
 import { CompositeNumberInput, CompositeSlider, FormControl, FormLabel } from '@invoke-ai/ui-library';
 import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
 import { InformationalPopover } from 'common/components/InformationalPopover/InformationalPopover';
-import { selectCLIPSKip, selectModel, setClipSkip } from 'features/controlLayers/store/paramsSlice';
+import { selectCLIPSkip, selectModel, setClipSkip } from 'features/controlLayers/store/paramsSlice';
 import { CLIP_SKIP_MAP } from 'features/parameters/types/constants';
 import { selectCLIPSkipConfig } from 'features/system/store/configSlice';
 import { memo, useCallback, useMemo } from 'react';
 import { useTranslation } from 'react-i18next';
 
 const ParamClipSkip = () => {
-  const clipSkip = useAppSelector(selectCLIPSKip);
+  const clipSkip = useAppSelector(selectCLIPSkip);
   const config = useAppSelector(selectCLIPSkipConfig);
   const model = useAppSelector(selectModel);
 

invokeai/frontend/web/src/features/parameters/components/Core/NegativePromptToggleButton.tsx

@@ -2,9 +2,11 @@ import { IconButton, Tooltip } from '@invoke-ai/ui-library';
 import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
 import { negativePromptChanged, selectHasNegativePrompt } from 'features/controlLayers/store/paramsSlice';
 import { memo, useCallback, useMemo } from 'react';
+import { useTranslation } from 'react-i18next';
 import { PiPlusMinusBold } from 'react-icons/pi';
 
 export const NegativePromptToggleButton = memo(() => {
+  const { t } = useTranslation();
   const hasNegativePrompt = useAppSelector(selectHasNegativePrompt);
 
   const dispatch = useAppDispatch();
@@ -18,8 +20,8 @@ export const NegativePromptToggleButton = memo(() => {
   }, [dispatch, hasNegativePrompt]);
 
   const label = useMemo(
-    () => (hasNegativePrompt ? 'Remove Negative Prompt' : 'Add Negative Prompt'),
-    [hasNegativePrompt]
+    () => (hasNegativePrompt ? t('common.removeNegativePrompt') : t('common.addNegativePrompt')),
+    [hasNegativePrompt, t]
   );
 
   return (

invokeai/frontend/web/src/features/parameters/components/Core/ParamPositivePrompt.tsx

@@ -4,7 +4,6 @@ import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
 import { usePersistedTextAreaSize } from 'common/hooks/usePersistedTextareaSize';
 import {
   positivePromptChanged,
-  selectBase,
   selectModelSupportsNegativePrompt,
   selectPositivePrompt,
 } from 'features/controlLayers/store/paramsSlice';
@@ -21,7 +20,6 @@ import { PromptExpansionOverlay } from 'features/prompt/PromptExpansion/PromptEx
 import { promptExpansionApi } from 'features/prompt/PromptExpansion/state';
 import { PromptPopover } from 'features/prompt/PromptPopover';
 import { usePrompt } from 'features/prompt/usePrompt';
-import { SDXLConcatButton } from 'features/sdxl/components/SDXLPrompts/SDXLConcatButton';
 import {
   selectStylePresetActivePresetId,
   selectStylePresetViewMode,
@@ -42,7 +40,6 @@ const persistOptions: Parameters<typeof usePersistedTextAreaSize>[2] = {
 export const ParamPositivePrompt = memo(() => {
   const dispatch = useAppDispatch();
   const prompt = useAppSelector(selectPositivePrompt);
-  const baseModel = useAppSelector(selectBase);
   const viewMode = useAppSelector(selectStylePresetViewMode);
   const activeStylePresetId = useAppSelector(selectStylePresetActivePresetId);
   const modelSupportsNegativePrompt = useAppSelector(selectModelSupportsNegativePrompt);
@@ -118,7 +115,6 @@ export const ParamPositivePrompt = memo(() => {
           <PromptOverlayButtonWrapper>
             <Flex flexDir="column" gap={2} justifyContent="flex-start" alignItems="center">
               <AddPromptTriggerButton isOpen={isOpen} onOpen={onOpen} />
-              {baseModel === 'sdxl' && <SDXLConcatButton />}
               <ShowDynamicPromptsPreviewButton />
               {modelSupportsNegativePrompt && <NegativePromptToggleButton />}
             </Flex>

invokeai/frontend/web/src/features/parameters/components/Prompts/Prompts.tsx

@@ -1,33 +1,18 @@
 import { Flex } from '@invoke-ai/ui-library';
 import { useAppSelector } from 'app/store/storeHooks';
 import { RefImageList } from 'features/controlLayers/components/RefImage/RefImageList';
-import {
-  createParamsSelector,
-  selectHasNegativePrompt,
-  selectModelSupportsNegativePrompt,
-} from 'features/controlLayers/store/paramsSlice';
+import { selectHasNegativePrompt, selectModelSupportsNegativePrompt } from 'features/controlLayers/store/paramsSlice';
 import { ParamNegativePrompt } from 'features/parameters/components/Core/ParamNegativePrompt';
 import { ParamPositivePrompt } from 'features/parameters/components/Core/ParamPositivePrompt';
-import { ParamSDXLNegativeStylePrompt } from 'features/sdxl/components/SDXLPrompts/ParamSDXLNegativeStylePrompt';
-import { ParamSDXLPositiveStylePrompt } from 'features/sdxl/components/SDXLPrompts/ParamSDXLPositiveStylePrompt';
 import { memo } from 'react';
 
-const selectWithStylePrompts = createParamsSelector((params) => {
-  const isSDXL = params.model?.base === 'sdxl';
-  const shouldConcatPrompts = params.shouldConcatPrompts;
-  return isSDXL && !shouldConcatPrompts;
-});
-
 export const Prompts = memo(() => {
-  const withStylePrompts = useAppSelector(selectWithStylePrompts);
   const modelSupportsNegativePrompt = useAppSelector(selectModelSupportsNegativePrompt);
   const hasNegativePrompt = useAppSelector(selectHasNegativePrompt);
   return (
     <Flex flexDir="column" gap={2}>
       <ParamPositivePrompt />
-      {withStylePrompts && <ParamSDXLPositiveStylePrompt />}
       {modelSupportsNegativePrompt && hasNegativePrompt && <ParamNegativePrompt />}
-      {withStylePrompts && <ParamSDXLNegativeStylePrompt />}
       <RefImageList />
     </Flex>
   );

invokeai/frontend/web/src/features/parameters/components/Prompts/UpscalePrompts.tsx

@@ -1,32 +1,17 @@
 import { Flex } from '@invoke-ai/ui-library';
 import { useAppSelector } from 'app/store/storeHooks';
-import {
-  createParamsSelector,
-  selectHasNegativePrompt,
-  selectModelSupportsNegativePrompt,
-} from 'features/controlLayers/store/paramsSlice';
+import { selectHasNegativePrompt, selectModelSupportsNegativePrompt } from 'features/controlLayers/store/paramsSlice';
 import { ParamNegativePrompt } from 'features/parameters/components/Core/ParamNegativePrompt';
 import { ParamPositivePrompt } from 'features/parameters/components/Core/ParamPositivePrompt';
-import { ParamSDXLNegativeStylePrompt } from 'features/sdxl/components/SDXLPrompts/ParamSDXLNegativeStylePrompt';
-import { ParamSDXLPositiveStylePrompt } from 'features/sdxl/components/SDXLPrompts/ParamSDXLPositiveStylePrompt';
 import { memo } from 'react';
 
-const selectWithStylePrompts = createParamsSelector((params) => {
-  const isSDXL = params.model?.base === 'sdxl';
-  const shouldConcatPrompts = params.shouldConcatPrompts;
-  return isSDXL && !shouldConcatPrompts;
-});
-
 export const UpscalePrompts = memo(() => {
-  const withStylePrompts = useAppSelector(selectWithStylePrompts);
   const modelSupportsNegativePrompt = useAppSelector(selectModelSupportsNegativePrompt);
   const hasNegativePrompt = useAppSelector(selectHasNegativePrompt);
   return (
     <Flex flexDir="column" gap={2}>
       <ParamPositivePrompt />
-      {withStylePrompts && <ParamSDXLPositiveStylePrompt />}
       {modelSupportsNegativePrompt && hasNegativePrompt && <ParamNegativePrompt />}
-      {withStylePrompts && <ParamSDXLNegativeStylePrompt />}
     </Flex>
   );
 });

invokeai/frontend/web/src/features/parameters/types/parameterSchemas.ts

@@ -33,16 +33,6 @@ export const [zParameterNegativePrompt, isParameterNegativePrompt] = buildParame
 export type ParameterNegativePrompt = z.infer<typeof zParameterNegativePrompt>;
 // #endregion
 
-// #region Positive style prompt (SDXL)
-export const [zParameterPositiveStylePromptSDXL, isParameterPositiveStylePromptSDXL] = buildParameter(z.string());
-export type ParameterPositiveStylePromptSDXL = z.infer<typeof zParameterPositiveStylePromptSDXL>;
-// #endregion
-
-// #region Positive style prompt (SDXL)
-export const [zParameterNegativeStylePromptSDXL, isParameterNegativeStylePromptSDXL] = buildParameter(z.string());
-export type ParameterNegativeStylePromptSDXL = z.infer<typeof zParameterNegativeStylePromptSDXL>;
-// #endregion
-
 // #region Steps
 export const [zParameterSteps, isParameterSteps] = buildParameter(z.number().int().min(1));
 export type ParameterSteps = z.infer<typeof zParameterSteps>;
@@ -203,3 +193,8 @@ export type ParameterCanvasCoherenceMode = z.infer<typeof zParameterCanvasCohere
 export const [zLoRAWeight, isParameterLoRAWeight] = buildParameter(z.number());
 export type ParameterLoRAWeight = z.infer<typeof zLoRAWeight>;
 // #endregion
+
+// #region CLIP skip
+export const [zParameterCLIPSkip, isParameterCLIPSkip] = buildParameter(z.number().int().min(0));
+export type ParameterCLIPSkip = z.infer<typeof zParameterCLIPSkip>;
+// #endregion

invokeai/frontend/web/src/features/queue/store/readiness.ts

@@ -278,12 +278,6 @@ const getReasonsWhyCannotEnqueueGenerateTab = (arg: {
   }
 
   const enabledRefImages = refImages.entities.filter(({ isEnabled }) => isEnabled);
-  const referenceImageCount = enabledRefImages.length;
-
-  // FLUX Kontext via BFL API only supports 1x Reference Image at a time.
-  if (model?.base === 'flux-kontext' && referenceImageCount > 1) {
-    reasons.push({ content: i18n.t('parameters.invoke.fluxKontextMultipleReferenceImages') });
-  }
 
   enabledRefImages.forEach((entity, i) => {
     const layerNumber = i + 1;
@@ -633,12 +627,6 @@ const getReasonsWhyCannotEnqueueCanvasTab = (arg: {
   });
 
   const enabledRefImages = refImages.entities.filter(({ isEnabled }) => isEnabled);
-  const referenceImageCount = enabledRefImages.length;
-
-  // FLUX Kontext via BFL API only supports 1x Reference Image at a time.
-  if (model?.base === 'flux-kontext' && referenceImageCount > 1) {
-    reasons.push({ content: i18n.t('parameters.invoke.fluxKontextMultipleReferenceImages') });
-  }
 
   enabledRefImages.forEach((entity, i) => {
     const layerNumber = i + 1;

invokeai/frontend/web/src/features/sdxl/components/SDXLPrompts/ParamSDXLNegativeStylePrompt.tsx

@@ -1,65 +0,0 @@
-import { Box, Textarea } from '@invoke-ai/ui-library';
-import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
-import { usePersistedTextAreaSize } from 'common/hooks/usePersistedTextareaSize';
-import { negativePrompt2Changed, selectNegativePrompt2 } from 'features/controlLayers/store/paramsSlice';
-import { PromptLabel } from 'features/parameters/components/Prompts/PromptLabel';
-import { PromptOverlayButtonWrapper } from 'features/parameters/components/Prompts/PromptOverlayButtonWrapper';
-import { AddPromptTriggerButton } from 'features/prompt/AddPromptTriggerButton';
-import { PromptPopover } from 'features/prompt/PromptPopover';
-import { usePrompt } from 'features/prompt/usePrompt';
-import { memo, useCallback, useRef } from 'react';
-import { useTranslation } from 'react-i18next';
-
-const persistOptions: Parameters<typeof usePersistedTextAreaSize>[2] = {
-  trackWidth: false,
-  trackHeight: true,
-};
-
-export const ParamSDXLNegativeStylePrompt = memo(() => {
-  const dispatch = useAppDispatch();
-  const prompt = useAppSelector(selectNegativePrompt2);
-  const textareaRef = useRef<HTMLTextAreaElement>(null);
-  usePersistedTextAreaSize('negative_style_prompt', textareaRef, persistOptions);
-
-  const { t } = useTranslation();
-  const handleChange = useCallback(
-    (v: string) => {
-      dispatch(negativePrompt2Changed(v));
-    },
-    [dispatch]
-  );
-  const { onChange, isOpen, onClose, onOpen, onSelect, onKeyDown } = usePrompt({
-    prompt,
-    textareaRef: textareaRef,
-    onChange: handleChange,
-  });
-
-  return (
-    <PromptPopover isOpen={isOpen} onClose={onClose} onSelect={onSelect} width={textareaRef.current?.clientWidth}>
-      <Box pos="relative">
-        <Textarea
-          className="negative-style-prompt-textarea"
-          name="prompt"
-          ref={textareaRef}
-          value={prompt}
-          onChange={onChange}
-          onKeyDown={onKeyDown}
-          fontSize="sm"
-          variant="darkFilled"
-          minH={24}
-          borderTopWidth={24} // This prevents the prompt from being hidden behind the header
-          paddingInlineEnd={10}
-          paddingInlineStart={3}
-          paddingTop={0}
-          paddingBottom={3}
-        />
-        <PromptOverlayButtonWrapper>
-          <AddPromptTriggerButton isOpen={isOpen} onOpen={onOpen} />
-        </PromptOverlayButtonWrapper>
-        <PromptLabel label={t('sdxl.negStylePrompt')} />
-      </Box>
-    </PromptPopover>
-  );
-});
-
-ParamSDXLNegativeStylePrompt.displayName = 'ParamSDXLNegativeStylePrompt';

invokeai/frontend/web/src/features/sdxl/components/SDXLPrompts/ParamSDXLPositiveStylePrompt.tsx

@@ -1,65 +0,0 @@
-import { Box, Textarea } from '@invoke-ai/ui-library';
-import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
-import { usePersistedTextAreaSize } from 'common/hooks/usePersistedTextareaSize';
-import { positivePrompt2Changed, selectPositivePrompt2 } from 'features/controlLayers/store/paramsSlice';
-import { PromptLabel } from 'features/parameters/components/Prompts/PromptLabel';
-import { PromptOverlayButtonWrapper } from 'features/parameters/components/Prompts/PromptOverlayButtonWrapper';
-import { AddPromptTriggerButton } from 'features/prompt/AddPromptTriggerButton';
-import { PromptPopover } from 'features/prompt/PromptPopover';
-import { usePrompt } from 'features/prompt/usePrompt';
-import { memo, useCallback, useRef } from 'react';
-import { useTranslation } from 'react-i18next';
-
-const persistOptions: Parameters<typeof usePersistedTextAreaSize>[2] = {
-  trackWidth: false,
-  trackHeight: true,
-};
-
-export const ParamSDXLPositiveStylePrompt = memo(() => {
-  const dispatch = useAppDispatch();
-  const prompt = useAppSelector(selectPositivePrompt2);
-  const textareaRef = useRef<HTMLTextAreaElement>(null);
-  usePersistedTextAreaSize('positive_style_prompt', textareaRef, persistOptions);
-
-  const { t } = useTranslation();
-  const handleChange = useCallback(
-    (v: string) => {
-      dispatch(positivePrompt2Changed(v));
-    },
-    [dispatch]
-  );
-  const { onChange, isOpen, onClose, onOpen, onSelect, onKeyDown } = usePrompt({
-    prompt,
-    textareaRef: textareaRef,
-    onChange: handleChange,
-  });
-
-  return (
-    <PromptPopover isOpen={isOpen} onClose={onClose} onSelect={onSelect} width={textareaRef.current?.clientWidth}>
-      <Box pos="relative">
-        <Textarea
-          className="positive-style-prompt-textarea"
-          name="prompt"
-          ref={textareaRef}
-          value={prompt}
-          onChange={onChange}
-          onKeyDown={onKeyDown}
-          fontSize="sm"
-          variant="darkFilled"
-          minH={24}
-          borderTopWidth={24} // This prevents the prompt from being hidden behind the header
-          paddingInlineEnd={10}
-          paddingInlineStart={3}
-          paddingTop={0}
-          paddingBottom={3}
-        />
-        <PromptOverlayButtonWrapper>
-          <AddPromptTriggerButton isOpen={isOpen} onOpen={onOpen} />
-        </PromptOverlayButtonWrapper>
-        <PromptLabel label={t('sdxl.posStylePrompt')} />
-      </Box>
-    </PromptPopover>
-  );
-});
-
-ParamSDXLPositiveStylePrompt.displayName = 'ParamSDXLPositiveStylePrompt';

invokeai/frontend/web/src/features/sdxl/components/SDXLPrompts/SDXLConcatButton.tsx

@@ -1,37 +0,0 @@
-import { IconButton, Tooltip } from '@invoke-ai/ui-library';
-import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
-import { selectShouldConcatPrompts, shouldConcatPromptsChanged } from 'features/controlLayers/store/paramsSlice';
-import { memo, useCallback, useMemo } from 'react';
-import { useTranslation } from 'react-i18next';
-import { PiLinkSimpleBold, PiLinkSimpleBreakBold } from 'react-icons/pi';
-
-export const SDXLConcatButton = memo(() => {
-  const shouldConcatPrompts = useAppSelector(selectShouldConcatPrompts);
-
-  const dispatch = useAppDispatch();
-  const { t } = useTranslation();
-
-  const handleShouldConcatPromptChange = useCallback(() => {
-    dispatch(shouldConcatPromptsChanged(!shouldConcatPrompts));
-  }, [dispatch, shouldConcatPrompts]);
-
-  const label = useMemo(
-    () => (shouldConcatPrompts ? t('sdxl.concatPromptStyle') : t('sdxl.freePromptStyle')),
-    [shouldConcatPrompts, t]
-  );
-
-  return (
-    <Tooltip label={label}>
-      <IconButton
-        aria-label={label}
-        onClick={handleShouldConcatPromptChange}
-        icon={shouldConcatPrompts ? <PiLinkSimpleBold size={14} /> : <PiLinkSimpleBreakBold size={14} />}
-        variant="promptOverlay"
-        fontSize={12}
-        px={0.5}
-      />
-    </Tooltip>
-  );
-});
-
-SDXLConcatButton.displayName = 'SDXLConcatButton';

invokeai/frontend/web/src/features/system/components/HotkeysModal/useHotkeyData.ts

@@ -103,6 +103,7 @@ export const useHotkeyData = (): HotkeysData => {
     addHotkey('canvas', 'setFillToWhite', ['d']);
     addHotkey('canvas', 'fitLayersToCanvas', ['mod+0']);
     addHotkey('canvas', 'fitBboxToCanvas', ['mod+shift+0']);
+    addHotkey('canvas', 'fitBboxToLayers', ['shift+n']);
     addHotkey('canvas', 'setZoomTo100Percent', ['mod+1']);
     addHotkey('canvas', 'setZoomTo200Percent', ['mod+2']);
     addHotkey('canvas', 'setZoomTo400Percent', ['mod+3']);
@@ -125,6 +126,7 @@ export const useHotkeyData = (): HotkeysData => {
     addHotkey('canvas', 'cancelSegmentAnything', ['esc']);
     addHotkey('canvas', 'toggleNonRasterLayers', ['shift+h']);
     addHotkey('canvas', 'fitBboxToMasks', ['shift+b']);
+    addHotkey('canvas', 'toggleBbox', ['shift+o']);
 
     // Workflows
     addHotkey('workflows', 'addNode', ['shift+a', 'space']);

invokeai/frontend/web/src/features/ui/layouts/AutoLayoutPanelContainer.tsx

@@ -3,7 +3,7 @@ import { useAppSelector } from 'app/store/storeHooks';
 import { useFocusRegion, useIsRegionFocused } from 'common/hooks/focus';
 import type { IDockviewPanelProps, IGridviewPanelProps } from 'dockview';
 import { selectSystemShouldEnableHighlightFocusedRegions } from 'features/system/store/systemSlice';
-import type { PanelParameters } from 'features/ui/layouts/auto-layout-context';
+import type { DockviewPanelParameters, GridviewPanelParameters } from 'features/ui/layouts/auto-layout-context';
 import type { PropsWithChildren } from 'react';
 import { memo, useRef } from 'react';
 
@@ -30,8 +30,8 @@ const sx: SystemStyleObject = {
 export const AutoLayoutPanelContainer = memo(
   (
     props:
-      | PropsWithChildren<IDockviewPanelProps<PanelParameters>>
-      | PropsWithChildren<IGridviewPanelProps<PanelParameters>>
+      | PropsWithChildren<IDockviewPanelProps<DockviewPanelParameters>>
+      | PropsWithChildren<IGridviewPanelProps<GridviewPanelParameters>>
   ) => {
     const ref = useRef<HTMLDivElement>(null);
     const shouldHighlightFocusedRegions = useAppSelector(selectSystemShouldEnableHighlightFocusedRegions);