feat(list,menu): support styling gap on items

PiperOrigin-RevId: 878769823

Author: material-web-copybara

list/internal/listitem/_list-item.scss

@@ -34,6 +34,7 @@
   :host {
     border-radius: map.get($tokens, 'container-shape');
     display: flex;
+    gap: 16px;
     -webkit-tap-highlight-color: transparent;
 
     @include ripple.theme(
@@ -77,6 +78,7 @@
     border-radius: inherit;
     display: flex;
     flex: 1;
+    gap: inherit;
     max-width: inherit;
     min-width: inherit;
     outline: none;
@@ -116,6 +118,7 @@
     padding-bottom: map.get($tokens, 'bottom-space');
     padding-inline-start: map.get($tokens, 'leading-space');
     padding-inline-end: map.get($tokens, 'trailing-space');
+    gap: inherit;
   }
 
   md-item[multiline] {

menu/internal/menuitem/_menu-item.scss

@@ -36,6 +36,7 @@
   :host {
     border-radius: map.get($tokens, 'container-shape');
     display: flex;
+    gap: 16px;
 
     @include ripple.theme(
       (
@@ -78,6 +79,7 @@
     border-radius: inherit;
     display: flex;
     flex: 1;
+    gap: inherit;
     max-width: inherit;
     min-width: inherit;
     outline: none;
@@ -110,6 +112,7 @@
     padding-bottom: map.get($tokens, 'bottom-space');
     padding-inline-start: map.get($tokens, 'leading-space');
     padding-inline-end: map.get($tokens, 'trailing-space');
+    gap: inherit;
   }
 
   md-item[multiline] {