before & after image slider

app.py

@@ -11,6 +11,7 @@ from diffusers import FluxInpaintPipeline
 from huggingface_hub import login
 import os
 import time
+from gradio_imageslider import ImageSlider
 
 
 MARKDOWN = """
@@ -144,7 +145,7 @@ def process(
             joint_attention_kwargs={"scale": lora_scale},
         ).images[0]
     
-    return result, resized_mask
+    return [resized_image, result], resized_mask
 
 
 with gr.Blocks() as demo:
@@ -238,8 +239,8 @@ with gr.Blocks() as demo:
                         value=20,
                     )
         with gr.Column():
-            output_image_component = gr.Image(
-                type='pil', image_mode='RGB', label='Generated image', format="png")
+            output_image_component = ImageSlider(label="Generate image", type="pil", slider_color="pink")
+            
             with gr.Accordion("Debug", open=False):
                 output_mask_component = gr.Image(
                     type='pil', image_mode='RGB', label='Input mask', format="png")

requirements.txt

@@ -6,3 +6,4 @@ sentencepiece
 git+https://github.com/Gothos/diffusers.git@flux-inpaint
 huggingface_hub
 peft
+gradio_imageslider