@stoker-platform/web-app 0.5.115 → 0.5.116

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @stoker-platform/web-app
 
+## 0.5.116
+
+### Patch Changes
+
+- fix: prevent file thumbnail layout shift
+
 ## 0.5.115
 
 ### Patch Changes

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@stoker-platform/web-app",
-    "version": "0.5.115",
+    "version": "0.5.116",
     "type": "module",
     "license": "SEE LICENSE IN LICENSE.md",
     "scripts": {

package/src/Files.tsx

@@ -138,14 +138,16 @@ const FileImageThumbnail = ({ storage, fullPath, fileName, pathPrefix }: FileIma
         return <File className="h-5 w-5 shrink-0 text-gray-500" aria-hidden />
     }
     return (
-        <img
-            src={url}
-            alt={`Thumbnail for ${fileName}`}
-            className="max-h-12 w-12 shrink-0 rounded-md object-contain"
-            loading="lazy"
-            decoding="async"
-            onError={() => setPhase("fallback")}
-        />
+        <div className="h-12 w-12 shrink-0 rounded-md flex items-center justify-center">
+            <img
+                src={url}
+                alt={`Thumbnail for ${fileName}`}
+                className="rounded-md max-h-12 max-w-12 object-contain"
+                loading="lazy"
+                decoding="async"
+                onError={() => setPhase("fallback")}
+            />
+        </div>
     )
 }