fix(list): show pointer cursor for button list items

Fixes #5045 PiperOrigin-RevId: 570501994
material-components · Oct 3, 2023 · 16480d0 · 16480d0
1 parent d6f7220
commit 16480d0
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 1 deletion.
diff --git a/list/internal/listitem/_list-item.scss b/list/internal/listitem/_list-item.scss
@@ -48,6 +48,10 @@
     );
   }
 
+  :host(:is([type='button']:not([disabled]), [type='link'])) {
+    cursor: pointer;
+  }
+
   md-focus-ring {
     z-index: 1;
 
@@ -64,6 +68,7 @@
     // Resets. These can be removed once we're no longer use these tags
     background: none;
     border: none;
+    cursor: inherit;
     padding: 0;
     margin: 0;
     text-align: unset;

diff --git a/list/internal/listitem/list-item.ts b/list/internal/listitem/list-item.ts
@@ -45,7 +45,7 @@ export class ListItemEl extends LitElement implements ListItem {
    * Sets the behavior of the list item, defaults to "text". Change to "link" or
    * "button" for interactive items.
    */
-  @property() type: ListItemType = 'text';
+  @property({reflect: true}) type: ListItemType = 'text';
 
   /**
    * READONLY. Sets the `md-list-item` attribute on the element.