Lib: Fix LazyImage in Dropdown component

src/lib/components/LazyDropdown.svelte

@@ -151,11 +151,12 @@
                 alt=""
                 imgwidth={option.icon_width ?? 1}
                 imgheight={option.icon_height ?? 1}
-                class="mr-2 rounded"
-                style="height: 24px; max-width: 64px;"
+                class="rounded"
+                imgstyle="height: 24px;"
+                containerstyle="height: 24px;"
               />
             {/if}
-            {option.label}
+            <span class="ml-2">{option.label}</span>
           </div>
         </ListBoxItem>
       {/each}

src/lib/components/LazyImage.svelte

@@ -12,9 +12,22 @@
 
     /** The aspect ratio height used to reserve image space (while its loading) */
     imgheight: number;
+
+    /** Optional extra style for the <img> element  */
+    imgstyle?: string;
+
+    /** Optional extra style for the lazy <div> container */
+    containerstyle?: string;
   }
 
-  let { src, imgwidth, imgheight, ...restProps }: LazyImageProps = $props();
+  let {
+    src,
+    imgwidth,
+    imgheight,
+    imgstyle = undefined,
+    containerstyle = undefined,
+    ...restProps
+  }: LazyImageProps = $props();
 
   // Once the image is visible, this will be set to true, triggering the loading
   let load: boolean = $state(false);
@@ -32,7 +45,7 @@
 <div
   use:lazyload
   onLazyVisible={lazy_visible_handler}
-  style="width: 100%; aspect-ratio: {imgwidth} / {imgheight};"
+  style="aspect-ratio: {imgwidth} / {imgheight}; {containerstyle ?? ''}"
 >
   {#if load}
     {#await fetch_image_base64(src) then data}
@@ -40,7 +53,7 @@
         src={data}
         use:img_opacity_handler
         class="bg-surface-100 transition-opacity"
-        style="width: 100%; opacity: 0; transition-duration: 500ms;"
+        style="opacity: 0; transition-duration: 300ms; {imgstyle ?? ''}"
         {...restProps}
       />
     {/await}