Rename ha-list-new into ha-md-list (#22015)

ha-list-new => ha-md-list
This commit is contained in:
Simon Lamon 2024-09-18 10:28:05 +02:00 committed by GitHub
parent dcf763438b
commit c0043af4c9
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
13 changed files with 76 additions and 76 deletions

View File

@ -25,8 +25,8 @@ import type { HomeAssistant } from "../../../../src/types";
import { HassioRepositoryDialogParams } from "./show-dialog-repositories";
import type { HaTextField } from "../../../../src/components/ha-textfield";
import "../../../../src/components/ha-textfield";
import "../../../../src/components/ha-list-new";
import "../../../../src/components/ha-list-item-new";
import "../../../../src/components/ha-md-list";
import "../../../../src/components/ha-md-list-item";
@customElement("dialog-hassio-repositories")
class HassioRepositoriesDialog extends LitElement {
@ -107,11 +107,11 @@ class HassioRepositoriesDialog extends LitElement {
? html`<ha-alert alert-type="error">${this._error}</ha-alert>`
: ""}
<div class="form">
<ha-list-new>
<ha-md-list>
${repositories.length
? repositories.map(
(repo) => html`
<ha-list-item-new class="option">
<ha-md-list-item class="option">
${repo.name}
<div slot="supporting-text">
<div>${repo.maintainer}</div>
@ -142,11 +142,11 @@ class HassioRepositoriesDialog extends LitElement {
)}
</simple-tooltip>
</div>
</ha-list-item-new>
</ha-md-list-item>
`
)
: html`<ha-list-item-new> No repositories </ha-list-item-new>`}
</ha-list-new>
: html`<ha-md-list-item> No repositories </ha-md-list-item>`}
</ha-md-list>
<div class="layout horizontal bottom">
<ha-textfield
class="flex-auto"
@ -209,7 +209,7 @@ class HassioRepositoriesDialog extends LitElement {
div.delete ha-icon-button {
color: var(--error-color);
}
ha-list-item-new {
ha-md-list-item {
position: relative;
}
`,

View File

@ -2,8 +2,8 @@ import { MdListItem } from "@material/web/list/list-item";
import { css } from "lit";
import { customElement } from "lit/decorators";
@customElement("ha-list-item-new")
export class HaListItemNew extends MdListItem {
@customElement("ha-md-list-item")
export class HaMdListItem extends MdListItem {
static override styles = [
...super.styles,
css`
@ -21,6 +21,6 @@ export class HaListItemNew extends MdListItem {
declare global {
interface HTMLElementTagNameMap {
"ha-list-item-new": HaListItemNew;
"ha-md-list-item": HaMdListItem;
}
}

View File

@ -2,8 +2,8 @@ import { MdList } from "@material/web/list/list";
import { css } from "lit";
import { customElement } from "lit/decorators";
@customElement("ha-list-new")
export class HaListNew extends MdList {
@customElement("ha-md-list")
export class HaMdList extends MdList {
static override styles = [
...super.styles,
css`
@ -16,6 +16,6 @@ export class HaListNew extends MdList {
declare global {
interface HTMLElementTagNameMap {
"ha-list-new": HaListNew;
"ha-md-list": HaMdList;
}
}

View File

@ -28,8 +28,8 @@ import "../../../components/ha-domain-icon";
import "../../../components/ha-icon-button";
import "../../../components/ha-icon-button-prev";
import "../../../components/ha-icon-next";
import "../../../components/ha-list-item-new";
import "../../../components/ha-list-new";
import "../../../components/ha-md-list-item";
import "../../../components/ha-md-list";
import "../../../components/ha-service-icon";
import "../../../components/search-input";
import {
@ -434,7 +434,7 @@ class DialogAddAutomationElement extends LitElement implements HassDialog {
protected _opened(): void {
// Store the width and height so that when we search, box doesn't jump
const boundingRect =
this.shadowRoot!.querySelector("ha-list-new")?.getBoundingClientRect();
this.shadowRoot!.querySelector("ha-md-list")?.getBoundingClientRect();
this._width = boundingRect?.width;
this._height = boundingRect?.height;
}
@ -526,7 +526,7 @@ class DialogAddAutomationElement extends LitElement implements HassDialog {
)}
></search-input>
</div>
<ha-list-new
<ha-md-list
dialogInitialFocus=${ifDefined(this._fullScreen ? "" : undefined)}
style=${styleMap({
width: this._width ? `${this._width}px` : "auto",
@ -537,7 +537,7 @@ class DialogAddAutomationElement extends LitElement implements HassDialog {
!this._filter &&
(!this._group ||
items.find((item) => item.key === this._params!.clipboardItem))
? html`<ha-list-item-new
? html`<ha-md-list-item
interactive
type="button"
class="paste"
@ -558,14 +558,14 @@ class DialogAddAutomationElement extends LitElement implements HassDialog {
.path=${mdiContentPaste}
></ha-svg-icon
><ha-svg-icon slot="end" .path=${mdiPlus}></ha-svg-icon>
</ha-list-item-new>
</ha-md-list-item>
<md-divider role="separator" tabindex="-1"></md-divider>`
: ""}
${repeat(
items,
(item) => item.key,
(item) => html`
<ha-list-item-new
<ha-md-list-item
interactive
type="button"
.value=${item.key}
@ -588,10 +588,10 @@ class DialogAddAutomationElement extends LitElement implements HassDialog {
slot="end"
.path=${mdiPlus}
></ha-svg-icon>`}
</ha-list-item-new>
</ha-md-list-item>
`
)}
</ha-list-new>
</ha-md-list>
</ha-dialog>
`;
}
@ -643,13 +643,13 @@ class DialogAddAutomationElement extends LitElement implements HassDialog {
ha-icon-next {
width: 24px;
}
ha-list-new {
ha-md-list {
max-height: 468px;
max-width: 100vw;
--md-list-item-leading-space: 24px;
--md-list-item-trailing-space: 24px;
}
ha-list-item-new img {
ha-md-list-item img {
width: 24px;
}
search-input {

View File

@ -6,8 +6,8 @@ import { customElement, property, state } from "lit/decorators";
import { fireEvent } from "../../../../common/dom/fire_event";
import "../../../../components/ha-dialog-header";
import "../../../../components/ha-icon-button";
import "../../../../components/ha-list-item-new";
import "../../../../components/ha-list-new";
import "../../../../components/ha-md-list-item";
import "../../../../components/ha-md-list";
import "../../../../components/ha-radio";
import "../../../../components/ha-textfield";
@ -90,7 +90,7 @@ class DialogAutomationMode extends LitElement implements HassDialog {
></ha-icon-button>
</a>
</ha-dialog-header>
<ha-list-new
<ha-md-list
role="listbox"
tabindex="0"
aria-activedescendant="option-${this._newMode}"
@ -103,7 +103,7 @@ class DialogAutomationMode extends LitElement implements HassDialog {
`ui.panel.config.automation.editor.modes.${mode}`
);
return html`
<ha-list-item-new
<ha-md-list-item
class="option"
type="button"
@click=${this._modeChanged}
@ -132,10 +132,10 @@ class DialogAutomationMode extends LitElement implements HassDialog {
`ui.panel.config.automation.editor.modes.${mode}_description`
)}
</div>
</ha-list-item-new>
</ha-md-list-item>
`;
})}
</ha-list-new>
</ha-md-list>
${isMaxMode(this._newMode)
? html`

View File

@ -48,8 +48,8 @@ import "../../../components/ha-button";
import "../../../components/ha-button-menu-new";
import "../../../components/ha-card";
import "../../../components/ha-list-item";
import "../../../components/ha-list-item-new";
import "../../../components/ha-list-new";
import "../../../components/ha-md-list-item";
import "../../../components/ha-md-list";
import "../../../components/ha-menu-item";
import {
deleteApplicationCredential,
@ -474,10 +474,10 @@ class HaConfigIntegrationPage extends SubscribeMixin(LitElement) {
"ui.panel.config.integrations.discovered"
)}
</h1>
<ha-list-new>
<ha-md-list>
${discoveryFlows.map(
(flow) =>
html`<ha-list-item-new class="discovered">
html`<ha-md-list-item class="discovered">
${flow.localized_title}
<ha-button
slot="end"
@ -488,9 +488,9 @@ class HaConfigIntegrationPage extends SubscribeMixin(LitElement) {
"ui.panel.config.integrations.configure"
)}
></ha-button>
</ha-list-item-new>`
</ha-md-list-item>`
)}
</ha-list-new>
</ha-md-list>
</ha-card>`
: ""}
${attentionFlows.length || attentionEntries.length
@ -500,12 +500,12 @@ class HaConfigIntegrationPage extends SubscribeMixin(LitElement) {
`ui.panel.config.integrations.integration_page.attention_entries`
)}
</h1>
<ha-list-new>
<ha-md-list>
${attentionFlows.map((flow) => {
const attention = ATTENTION_SOURCES.includes(
flow.context.source
);
return html` <ha-list-item-new
return html` <ha-md-list-item
class="config_entry ${attention ? "attention" : ""}"
>
${flow.localized_title}
@ -527,7 +527,7 @@ class HaConfigIntegrationPage extends SubscribeMixin(LitElement) {
}`
)}
></ha-button>
</ha-list-item-new>`;
</ha-md-list-item>`;
})}
${attentionEntries.map(
(item, index) =>
@ -539,7 +539,7 @@ class HaConfigIntegrationPage extends SubscribeMixin(LitElement) {
></md-divider>`
: ""} `
)}
</ha-list-new>
</ha-md-list>
</ha-card>`
: ""}
@ -568,7 +568,7 @@ class HaConfigIntegrationPage extends SubscribeMixin(LitElement) {
)}
</div>`
: nothing}
<ha-list-new>
<ha-md-list>
${normalEntries.map(
(item, index) =>
html`${this._renderConfigEntry(item)}
@ -579,7 +579,7 @@ class HaConfigIntegrationPage extends SubscribeMixin(LitElement) {
></md-divider>`
: ""} `
)}
</ha-list-new>
</ha-md-list>
<div class="card-actions">
<ha-button @click=${this._addIntegration}>
${this._manifest?.integration_type
@ -743,7 +743,7 @@ class HaConfigIntegrationPage extends SubscribeMixin(LitElement) {
const configPanel = this._configPanel(item.domain, this.hass.panels);
return html`<ha-list-item-new
return html`<ha-md-list-item
class=${classMap({
config_entry: true,
"state-not-loaded": item!.state === "not_loaded",
@ -958,7 +958,7 @@ class HaConfigIntegrationPage extends SubscribeMixin(LitElement) {
`
: nothing}
</ha-button-menu-new>
</ha-list-item-new>`;
</ha-md-list-item>`;
}
private async _highlightEntry() {
@ -1485,13 +1485,13 @@ class HaConfigIntegrationPage extends SubscribeMixin(LitElement) {
ha-alert:first-of-type {
margin-top: 16px;
}
ha-list-item-new {
ha-md-list-item {
position: relative;
}
ha-list-item-new.discovered {
ha-md-list-item.discovered {
height: 72px;
}
ha-list-item-new.config_entry::after {
ha-md-list-item.config_entry::after {
position: absolute;
top: 0;
right: 0;
@ -1561,7 +1561,7 @@ class HaConfigIntegrationPage extends SubscribeMixin(LitElement) {
.state-disabled [slot="supporting-text"] {
opacity: var(--md-list-item-disabled-opacity, 0.3);
}
ha-list-new {
ha-md-list {
margin-top: 8px;
margin-bottom: 8px;
}

View File

@ -2,8 +2,8 @@ import { LitElement, html } from "lit";
import { customElement, property, state } from "lit/decorators";
import { fireEvent } from "../../../../../../common/dom/fire_event";
import "../../../../../../components/ha-icon-next";
import "../../../../../../components/ha-list-item-new";
import "../../../../../../components/ha-list-new";
import "../../../../../../components/ha-md-list-item";
import "../../../../../../components/ha-md-list";
import { HomeAssistant } from "../../../../../../types";
import { sharedStyles } from "./matter-add-device-shared-styles";

View File

@ -3,8 +3,8 @@ import { LitElement, css, html } from "lit";
import { customElement, property } from "lit/decorators";
import { fireEvent } from "../../../../../../common/dom/fire_event";
import "../../../../../../components/ha-icon-next";
import "../../../../../../components/ha-list-item-new";
import "../../../../../../components/ha-list-new";
import "../../../../../../components/ha-md-list-item";
import "../../../../../../components/ha-md-list";
import { HomeAssistant } from "../../../../../../types";
import { MatterAddDeviceStep } from "../dialog-matter-add-device";
import { sharedStyles } from "./matter-add-device-shared-styles";
@ -23,8 +23,8 @@ class MatterAddDeviceExisting extends LitElement {
</p>
</div>
<ha-list-new>
<ha-list-item-new
<ha-md-list>
<ha-md-list-item
interactive
type="button"
.step=${"google_home"}
@ -43,8 +43,8 @@ class MatterAddDeviceExisting extends LitElement {
)}
</span>
<ha-icon-next slot="end"></ha-icon-next>
</ha-list-item-new>
<ha-list-item-new
</ha-md-list-item>
<ha-md-list-item
interactive
type="button"
.step=${"apple_home"}
@ -63,8 +63,8 @@ class MatterAddDeviceExisting extends LitElement {
)}
</span>
<ha-icon-next slot="end"></ha-icon-next>
</ha-list-item-new>
<ha-list-item-new
</ha-md-list-item>
<ha-md-list-item
interactive
type="button"
.step=${"generic"}
@ -80,8 +80,8 @@ class MatterAddDeviceExisting extends LitElement {
)}
</span>
<ha-icon-next slot="end"></ha-icon-next>
</ha-list-item-new>
</ha-list-new>
</ha-md-list-item>
</ha-md-list>
`;
}

View File

@ -2,8 +2,8 @@ import { LitElement, html } from "lit";
import { customElement, property, state } from "lit/decorators";
import { fireEvent } from "../../../../../../common/dom/fire_event";
import "../../../../../../components/ha-icon-next";
import "../../../../../../components/ha-list-item-new";
import "../../../../../../components/ha-list-new";
import "../../../../../../components/ha-md-list-item";
import "../../../../../../components/ha-md-list";
import { HomeAssistant } from "../../../../../../types";
import { sharedStyles } from "./matter-add-device-shared-styles";

View File

@ -2,8 +2,8 @@ import { LitElement, html } from "lit";
import { customElement, property, state } from "lit/decorators";
import { fireEvent } from "../../../../../../common/dom/fire_event";
import "../../../../../../components/ha-icon-next";
import "../../../../../../components/ha-list-item-new";
import "../../../../../../components/ha-list-new";
import "../../../../../../components/ha-md-list-item";
import "../../../../../../components/ha-md-list";
import { HomeAssistant } from "../../../../../../types";
import { sharedStyles } from "./matter-add-device-shared-styles";

View File

@ -2,8 +2,8 @@ import { LitElement, html } from "lit";
import { customElement, property } from "lit/decorators";
import { fireEvent } from "../../../../../../common/dom/fire_event";
import "../../../../../../components/ha-icon-next";
import "../../../../../../components/ha-list-item-new";
import "../../../../../../components/ha-list-new";
import "../../../../../../components/ha-md-list-item";
import "../../../../../../components/ha-md-list";
import { HomeAssistant } from "../../../../../../types";
import { sharedStyles } from "./matter-add-device-shared-styles";

View File

@ -2,8 +2,8 @@ import { LitElement, html } from "lit";
import { customElement, property } from "lit/decorators";
import { fireEvent } from "../../../../../../common/dom/fire_event";
import "../../../../../../components/ha-icon-next";
import "../../../../../../components/ha-list-item-new";
import "../../../../../../components/ha-list-new";
import "../../../../../../components/ha-md-list-item";
import "../../../../../../components/ha-md-list";
import { HomeAssistant } from "../../../../../../types";
import { sharedStyles } from "./matter-add-device-shared-styles";
@ -18,8 +18,8 @@ class MatterAddDeviceMain extends LitElement {
${this.hass.localize(`ui.dialogs.matter-add-device.main.question`)}
</p>
</div>
<ha-list-new>
<ha-list-item-new
<ha-md-list>
<ha-md-list-item
interactive
type="button"
.step=${"new"}
@ -37,8 +37,8 @@ class MatterAddDeviceMain extends LitElement {
)}
</span>
<ha-icon-next slot="end"></ha-icon-next>
</ha-list-item-new>
<ha-list-item-new
</ha-md-list-item>
<ha-md-list-item
interactive
type="button"
.step=${"existing"}
@ -56,8 +56,8 @@ class MatterAddDeviceMain extends LitElement {
)}
</span>
<ha-icon-next slot="end"></ha-icon-next>
</ha-list-item-new>
</ha-list-new>
</ha-md-list-item>
</ha-md-list>
`;
}

View File

@ -23,7 +23,7 @@ export const sharedStyles = css`
cursor: pointer;
text-decoration: underline;
}
ha-list-new {
ha-md-list {
padding: 0;
--md-list-item-leading-space: var(--horizontal-padding, 16px);
--md-list-item-trailing-space: var(--horizontal-padding, 16px);