material-components/material-web
1
1
Fork 0
mirror of https://github.com/material-components/material-web.git synced 2024-11-13 10:25:18 +03:00
Code Issues Projects Releases Wiki Activity

feat: Update the leading/trailing slot API to use properties.

Browse Source 
PiperOrigin-RevId: 421333095
This commit is contained in:
Brandon Diamond 2022-01-12 10:21:40 -08:00 committed by Copybara-Service
parent 9c3b7103fe
commit abcf5b9f1b
1 changed files with 7 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
components/list/lib/list-item.ts
View File

@ -8,20 +8,17 @@ import {html, LitElement, PropertyValues, TemplateResult} from 'lit';
import {property, queryAssignedNodes, state} from 'lit/decorators';
import {ClassInfo, classMap} from 'lit/directives/class-map';
import {ListItemIcon} from './list-item-icon';
/** @soyCompatible */
export class ListItem extends LitElement {
@property({type: String}) supportingText = '';
@property({type: String}) trailingSupportingText = '';
@queryAssignedNodes('start', true)
protected startElement!: HTMLElement[];
@queryAssignedNodes('start', true) protected startElement!: HTMLElement[];
@queryAssignedNodes('end', true) protected endElement!: HTMLElement[];
@state() protected hasLeadingIcon = false;
@state() protected hasTrailingIcon = false;
@property() hasLeadingIcon = false;
@property() hasTrailingIcon = false;
@state() protected hasLeadingAvatar = false;
@state() protected hasLeadingThumbnail = false;
@state() protected hasLeadingImage = false;
@ -106,10 +103,10 @@ export class ListItem extends LitElement {
}
private updateItemContext() {
this.hasLeadingIcon =
this.startElement.some((el) => el instanceof ListItemIcon);
this.hasTrailingIcon =
this.endElement.some((el) => el instanceof ListItemIcon);
this.hasLeadingIcon = this.startElement.some(
(el) => el.classList.contains('md3-list-item__icon'));
this.hasTrailingIcon = this.endElement.some(
(el) => el.classList.contains('md3-list-item__icon'));
this.hasLeadingAvatar = this.startElement.some(
(el) => el.classList.contains('md3-list-item__avatar'));
this.hasLeadingThumbnail = this.startElement.some(