@descope/web-components-ui 2.2.0 → 2.2.2

package/dist/index.esm.js

@@ -4585,8 +4585,10 @@ const CheckboxClass = compose(
       inputOutlineOffset: { ...checkboxElement, property: 'outline-offset' },
       inputOutlineColor: { ...checkboxElement, property: 'outline-color' },
       inputOutlineStyle: { ...checkboxElement, property: 'outline-style' },
+      inputAlign: { ...checkboxElement, property: 'align-self' },
 
       inputContainerPadding: { ...component$1, property: 'padding' },
+      inputContainerBackgroundColor: { ...component$1, property: 'background-color' },
       inputContainerBorderRadius: { ...component$1, property: 'border-radius' },
       inputContainerBorderWidth: { ...component$1, property: 'border-width' },
       inputContainerBorderColor: { ...component$1, property: 'border-color' },
@@ -4636,6 +4638,10 @@ const CheckboxClass = compose(
         height: 100%;
       }
 
+      :host([full-width]) vaadin-checkbox {
+        flex-grow: 1;
+      }
+
       vaadin-checkbox::part(checkbox) {
         margin: 0;
       }
@@ -22373,11 +22379,13 @@ const componentName$c = getComponentName$1('apps-list');
 const itemRenderer$3 = ({ 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"
@@ -22449,7 +22457,7 @@ const AppsListClass = compose$1(
         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 },
       ]
     },
@@ -22477,6 +22485,14 @@ const AppsListClass = compose$1(
         overflow: hidden;
       }
 
+      descope-list-item[variant="tile"] .avatar-wrapper {
+        width: 100%;
+      }
+
+      .avatar-wrapper {
+        line-height: 0;
+      }
+
       a {
         text-decoration: none;
       }
@@ -22484,6 +22500,7 @@ const AppsListClass = compose$1(
       descope-text {
         ${TextClass.cssVarList.hostDirection}: var(${AppsListClass.cssVarList.hostDirection});
         max-width: 100%;
+        width: 100%;
       }
     `,
   })