@descope/web-components-ui 2.2.0 → 2.2.1

package/dist/cjs/index.cjs.js

@@ -18400,11 +18400,13 @@ const componentName$l = getComponentName('apps-list');
 const itemRenderer$4 = ({ name, icon, url }, _, ref) => `
   <a ${url ? `href="${url}" title="${url}"` : ''} target="_blank">
     <descope-list-item>
-    <descope-avatar
-      ${icon ? `img="${icon}"` : ''}
-      ${name ? `display-name="${name}" abbr=${limitAbbreviation(name)}` : ''}
-      size="${ref.logoSize || ref.size}"
-    ></descope-avatar>
+    <div class="avatar-wrapper">
+      <descope-avatar
+        ${icon ? `img="${icon}"` : ''}
+        ${name ? `display-name="${name}" abbr=${limitAbbreviation(name)}` : ''}
+        size="${ref.logoSize || ref.size}"
+      ></descope-avatar>
+    </div>
     <descope-text
       variant="${ref.itemTextVariant}"
       mode="primary"
@@ -18476,7 +18478,7 @@ const AppsListClass = compose(
         property: ListItemClass.cssVarList.horizontalPaddingOverride,
       },
       itemAlignment: [
-        { selector: ListItemClass.componentName, property: ListItemClass.cssVarList.alignItemsOverride },
+        { selector: () => '.avatar-wrapper', property: 'text-align' },
         { selector: TextClass.componentName, property: TextClass.cssVarList.textAlign },
       ]
     },
@@ -18504,6 +18506,14 @@ const AppsListClass = compose(
         overflow: hidden;
       }
 
+      descope-list-item[variant="tile"] .avatar-wrapper {
+        width: 100%;
+      }
+
+      .avatar-wrapper {
+        line-height: 0;
+      }
+
       a {
         text-decoration: none;
       }
@@ -18511,6 +18521,7 @@ const AppsListClass = compose(
       descope-text {
         ${TextClass.cssVarList.hostDirection}: var(${AppsListClass.cssVarList.hostDirection});
         max-width: 100%;
+        width: 100%;
       }
     `,
   })