@limetech/lime-elements 34.1.0-next.25 → 34.1.0-next.26

package/dist/collection/components/list/list-renderer.js

@@ -55,6 +55,7 @@ export class ListRenderer {
         'mdc-deprecated-list-item': true,
         'mdc-deprecated-list-item--disabled': item.disabled,
         'mdc-deprecated-list-item--selected': item.selected,
+        'has-primary-component': this.hasPrimaryComponent(item),
       };
       const attributes = {};
       if (index === this.applyTabIndexToItemAtIndex) {
@@ -62,10 +63,15 @@ export class ListRenderer {
       }
       return (h("li", Object.assign({ class: classNames, "aria-disabled": item.disabled ? 'true' : 'false', "aria-selected": item.selected ? 'true' : 'false', "data-index": index }, attributes),
         item.icon ? this.renderIcon(this.config, item) : null,
+        this.getPrimaryComponent(item),
         this.renderText(item),
         this.twoLines && this.avatarList ? this.renderDivider() : null,
         this.renderActionMenu(item.actions)));
     };
+    this.hasPrimaryComponent = (item) => {
+      var _a;
+      return !!((_a = item === null || item === void 0 ? void 0 : item.primaryComponent) === null || _a === void 0 ? void 0 : _a.name);
+    };
     /**
      * Render the text of the list item
      *
@@ -135,6 +141,7 @@ export class ListRenderer {
         'mdc-deprecated-list-item': true,
         'mdc-deprecated-list-item--disabled': item.disabled,
         'mdc-deprecated-list-item__text': !item.secondaryText,
+        'has-primary-component': this.hasPrimaryComponent(item),
       };
       const attributes = {};
       if (index === this.applyTabIndexToItemAtIndex) {
@@ -146,12 +153,14 @@ export class ListRenderer {
       if (this.hasIcons) {
         return [
           item.icon ? this.renderIcon(config, item) : null,
+          this.getPrimaryComponent(item),
           this.renderText(item),
           h("div", { class: "mdc-deprecated-list-item__meta" }, itemTemplate),
         ];
       }
       return [
         h("div", { class: "mdc-deprecated-list-item__graphic" }, itemTemplate),
+        this.getPrimaryComponent(item),
         this.renderText(item),
       ];
     };
@@ -191,4 +200,12 @@ export class ListRenderer {
     };
     return (h("ul", { class: classNames, role: role, "aria-orientation": "vertical" }, items.map(this.renderListItem)));
   }
+  getPrimaryComponent(item) {
+    if (!this.hasPrimaryComponent(item)) {
+      return;
+    }
+    const PrimaryComponent = item.primaryComponent.name;
+    const props = item.primaryComponent.props;
+    return h(PrimaryComponent, Object.assign({}, props));
+  }
 }

package/dist/collection/components/list/list.css

@@ -3146,6 +3146,9 @@ a.mdc-list-item {
   align-self: center;
   width: 100%;
 }
+.mdc-deprecated-list .has-primary-component .mdc-deprecated-list-item__text {
+  margin-left: 0.5rem;
+}
 .mdc-deprecated-list .mdc-deprecated-list-item__primary-command-text {
   display: flex;
   flex-direction: row;

package/dist/collection/components/list/list.js

@@ -18,6 +18,7 @@ const { ACTION_EVENT } = listStrings;
  * @exampleComponent limel-example-list-striped
  * @exampleComponent limel-example-list-badge-icons-with-multiple-lines
  * @exampleComponent limel-example-list-grid
+ * @exampleComponent limel-example-list-primary-component
  */
 export class List {
   constructor() {

package/dist/collection/components/menu-list/menu-list.css

@@ -3152,6 +3152,9 @@ a.mdc-list-item {
   align-self: center;
   width: 100%;
 }
+.mdc-deprecated-list .has-primary-component .mdc-deprecated-list-item__text {
+  margin-left: 0.5rem;
+}
 .mdc-deprecated-list .mdc-deprecated-list-item__primary-command-text {
   display: flex;
   flex-direction: row;