jeans/frontend
jeans/frontend
1
0
Fork 0
mirror of https://github.com/home-assistant/frontend.git synced 2025-07-30 04:36:36 +00:00
Code Issues Packages Projects Releases Wiki Activity

migrate buttons

Browse Source
This commit is contained in:
Wendelin 2025-07-28 08:59:24 +02:00
parent ab336c7d5d
commit 5d45f4fb6c
No known key found for this signature in database
14 changed files with 88 additions and 59 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
src/components/ha-copy-textfield.ts
View File

@ -1,14 +1,14 @@
import { customElement, property, state } from "lit/decorators";
import { css, html, LitElement, nothing } from "lit";
import { mdiContentCopy, mdiEye, mdiEyeOff } from "@mdi/js";
import { css, html, LitElement, nothing } from "lit";
import { customElement, property, state } from "lit/decorators";
import { copyToClipboard } from "../common/util/copy-clipboard";
import type { HomeAssistant } from "../types";
import { showToast } from "../util/toast";
import "./ha-button";
import "./ha-icon-button";
import "./ha-svg-icon";
import "./ha-textfield";
import type { HomeAssistant } from "../types";
import { copyToClipboard } from "../common/util/copy-clipboard";
import { showToast } from "../util/toast";
import type { HaTextField } from "./ha-textfield";
@customElement("ha-copy-textfield")
@ -48,8 +48,8 @@ export class HaCopyTextfield extends LitElement {
></ha-icon-button>`
: nothing}
</div>
<ha-button @click=${this._copy} unelevated>
<ha-svg-icon slot="icon" .path=${mdiContentCopy}></ha-svg-icon>
<ha-button @click=${this._copy} appearance="filled">
<ha-svg-icon slot="prefix" .path=${mdiContentCopy}></ha-svg-icon>
${this.label || this.hass.localize("ui.common.copy")}
</ha-button>
</div>

4
src/components/ha-selector/ha-selector-object.ts
View File

@ -137,7 +137,7 @@ export class HaObjectSelector extends LitElement {
${items.map((item, index) => this._renderItem(item, index))}
</ha-md-list>
</ha-sortable>
<ha-button outlined @click=${this._addItem}>
<ha-button appearance="filled" @click=${this._addItem}>
${this.hass.localize("ui.common.add")}
</ha-button>
</div>
@ -152,7 +152,7 @@ export class HaObjectSelector extends LitElement {
${this._renderItem(this.value, 0)}
</ha-md-list>`
: html`
<ha-button outlined @click=${this._addItem}>
<ha-button appearance="filled" @click=${this._addItem}>
${this.hass.localize("ui.common.add")}
</ha-button>
`}

40
src/components/media-player/dialog-join-media-players.ts
View File

@ -1,28 +1,28 @@
import type { CSSResultGroup } from "lit";
import { mdiClose } from "@mdi/js";
import type { HassEntity } from "home-assistant-js-websocket";
import type { CSSResultGroup } from "lit";
import { LitElement, css, html, nothing } from "lit";
import { customElement, property, state } from "lit/decorators";
import type { HassEntity } from "home-assistant-js-websocket";
import { fireEvent } from "../../common/dom/fire_event";
import { haStyleDialog } from "../../resources/styles";
import type { HomeAssistant } from "../../types";
import "../ha-alert";
import "../ha-dialog";
import "../ha-button";
import "../ha-dialog-header";
import "./ha-media-player-toggle";
import type { JoinMediaPlayersDialogParams } from "./show-join-media-players-dialog";
import { computeDomain } from "../../common/entity/compute_domain";
import { computeStateName } from "../../common/entity/compute_state_name";
import { supportsFeature } from "../../common/entity/supports-feature";
import type { EntityRegistryDisplayEntry } from "../../data/entity_registry";
import { extractApiErrorMessage } from "../../data/hassio/common";
import {
type MediaPlayerEntity,
MediaPlayerEntityFeature,
mediaPlayerJoin,
mediaPlayerUnjoin,
} from "../../data/media-player";
import { extractApiErrorMessage } from "../../data/hassio/common";
import type { EntityRegistryDisplayEntry } from "../../data/entity_registry";
import { computeDomain } from "../../common/entity/compute_domain";
import { haStyleDialog } from "../../resources/styles";
import type { HomeAssistant } from "../../types";
import "../ha-alert";
import "../ha-button";
import "../ha-dialog";
import "../ha-dialog-header";
import "./ha-media-player-toggle";
import type { JoinMediaPlayersDialogParams } from "./show-join-media-players-dialog";
@customElement("dialog-join-media-players")
class DialogJoinMediaPlayers extends LitElement {
@ -90,7 +90,11 @@ class DialogJoinMediaPlayers extends LitElement {
<span slot="title"
>${this.hass.localize("ui.card.media_player.media_players")}</span
>
<ha-button slot="actionItems" @click=${this._selectAll}>
<ha-button
appearance="plain"
slot="actionItems"
@click=${this._selectAll}
>
${this.hass.localize("ui.card.media_player.select_all")}
</ha-button>
</ha-dialog-header>
@ -114,11 +118,15 @@ class DialogJoinMediaPlayers extends LitElement {
></ha-media-player-toggle>`
)}
</div>
<ha-button slot="secondaryAction" @click=${this.closeDialog}>
<ha-button
appearance="plain"
slot="secondaryAction"
@click=${this.closeDialog}
>
${this.hass.localize("ui.common.cancel")}
</ha-button>
<ha-button
.disabled=${this._submitting}
.disabled=${!!this._submitting}
slot="primaryAction"
@click=${this._submit}
>

2
src/components/media-player/dialog-media-manage.ts
View File

@ -127,7 +127,7 @@ class DialogMediaManage extends LitElement {
)}
@click=${this._handleDelete}
>
<ha-svg-icon .path=${mdiDelete} slot="icon"></ha-svg-icon>
<ha-svg-icon .path=${mdiDelete} slot="prefix"></ha-svg-icon>
</ha-button>
${this._deleting

6
src/dialogs/enter-code/dialog-enter-code.ts
View File

@ -110,7 +110,11 @@ export class DialogEnterCode
pattern=${ifDefined(this._dialogParams.codePattern)}
inputmode="text"
></ha-textfield>
<ha-button slot="secondaryAction" dialogAction="cancel">
<ha-button
appearance="plain"
slot="secondaryAction"
dialogAction="cancel"
>
${this._dialogParams.cancelText ??
this.hass.localize("ui.common.cancel")}
</ha-button>

8
src/dialogs/form/dialog-form.ts
View File

@ -4,10 +4,10 @@ import { fireEvent } from "../../common/dom/fire_event";
import "../../components/ha-button";
import { createCloseHeading } from "../../components/ha-dialog";
import "../../components/ha-form/ha-form";
import { haStyleDialog } from "../../resources/styles";
import type { HomeAssistant } from "../../types";
import type { HassDialog } from "../make-dialog-manager";
import type { FormDialogData, FormDialogParams } from "./show-form-dialog";
import { haStyleDialog } from "../../resources/styles";
@customElement("dialog-form")
export class DialogForm
@ -69,7 +69,11 @@ export class DialogForm
@value-changed=${this._valueChanged}
>
</ha-form>
<ha-button @click=${this._cancel} slot="secondaryAction">
<ha-button
appearance="plain"
@click=${this._cancel}
slot="secondaryAction"
>
${this._params.cancelText || this.hass.localize("ui.common.cancel")}
</ha-button>
<ha-button @click=${this._submit} slot="primaryAction">

13
src/dialogs/voice-assistant-setup/cloud/cloud-step-intro.ts
View File

@ -97,17 +97,16 @@ export class CloudStepIntro extends LitElement {
</div>
</div>
<div class="footer side-by-side">
<a
<ha-button
href="https://www.nabucasa.com"
target="_blank"
rel="noreferrer noopener"
appearance="plain"
>
<ha-button>
<ha-svg-icon .path=${mdiOpenInNew} slot="icon"></ha-svg-icon>
nabucasa.com
</ha-button>
</a>
<ha-button unelevated @click=${this._signUp}
<ha-svg-icon .path=${mdiOpenInNew} slot="prefix"></ha-svg-icon>
nabucasa.com
</ha-button>
<ha-button @click=${this._signUp}
>${this.hass.localize(
"ui.panel.config.cloud.register.headline"
)}</ha-button

4
src/dialogs/voice-assistant-setup/voice-assistant-setup-step-area.ts
View File

@ -1,11 +1,11 @@
import { css, html, LitElement } from "lit";
import { customElement, property } from "lit/decorators";
import { fireEvent } from "../../common/dom/fire_event";
import "../../components/ha-area-picker";
import { updateDeviceRegistryEntry } from "../../data/device_registry";
import type { HomeAssistant } from "../../types";
import { showAlertDialog } from "../generic/show-dialog-box";
import { AssistantSetupStyles } from "./styles";
import "../../components/ha-area-picker";
@customElement("ha-voice-assistant-setup-step-area")
export class HaVoiceAssistantSetupStepArea extends LitElement {
@ -37,7 +37,7 @@ export class HaVoiceAssistantSetupStepArea extends LitElement {
></ha-area-picker>
</div>
<div class="footer">
<ha-button @click=${this._setArea} unelevated
<ha-button @click=${this._setArea}
>${this.hass.localize("ui.common.next")}</ha-button
>
</div>`;

2
src/dialogs/voice-assistant-setup/voice-assistant-setup-step-success.ts
View File

@ -180,7 +180,7 @@ export class HaVoiceAssistantSetupStepSuccess extends LitElement {
</div>
</div>
<div class="footer">
<ha-button @click=${this._done} unelevated
<ha-button @click=${this._done}
>${this.hass.localize(
"ui.panel.config.voice_assistants.satellite_wizard.success.done"
)}</ha-button

2
src/onboarding/onboarding-integrations.ts
View File

@ -176,7 +176,7 @@ class OnboardingIntegrations extends SubscribeMixin(LitElement) {
: nothing}
</div>
<div class="footer">
<ha-button unelevated @click=${this._finish}>
<ha-button @click=${this._finish}>
${this.onboardingLocalize(
"ui.panel.page-onboarding.integration.finish"
)}

12
src/panels/config/cloud/dialog-cloud-already-connected/dialog-cloud-already-connected.ts
View File

@ -1,17 +1,17 @@
import { mdiEye, mdiEyeOff } from "@mdi/js";
import type { CSSResultGroup } from "lit";
import { css, html, LitElement, nothing } from "lit";
import { customElement, state } from "lit/decorators";
import { mdiEye, mdiEyeOff } from "@mdi/js";
import { formatDateTime } from "../../../../common/datetime/format_date_time";
import { fireEvent } from "../../../../common/dom/fire_event";
import "../../../../components/ha-alert";
import "../../../../components/ha-button";
import "../../../../components/ha-icon-button";
import { createCloseHeading } from "../../../../components/ha-dialog";
import "../../../../components/ha-icon-button";
import { haStyleDialog } from "../../../../resources/styles";
import type { HomeAssistant } from "../../../../types";
import type { CloudAlreadyConnectedParams as CloudAlreadyConnectedDialogParams } from "./show-dialog-cloud-already-connected";
import { obfuscateUrl } from "../../../../util/url";
import type { CloudAlreadyConnectedParams as CloudAlreadyConnectedDialogParams } from "./show-dialog-cloud-already-connected";
@customElement("dialog-cloud-already-connected")
class DialogCloudAlreadyConnected extends LitElement {
@ -131,7 +131,11 @@ class DialogCloudAlreadyConnected extends LitElement {
)}
</ha-alert>
<ha-button @click=${this.closeDialog} slot="secondaryAction">
<ha-button
appearance="plain"
@click=${this.closeDialog}
slot="secondaryAction"
>
${this.hass!.localize("ui.common.cancel")}
</ha-button>
<ha-button @click=${this._logInHere} slot="primaryAction">

17
src/panels/config/integrations/integration-panels/bluetooth/dialog-bluetooth-device-info.ts
View File

@ -2,13 +2,13 @@ import type { TemplateResult } from "lit";
import { html, LitElement, nothing } from "lit";
import { customElement, property, state } from "lit/decorators";
import { fireEvent } from "../../../../../common/dom/fire_event";
import type { HassDialog } from "../../../../../dialogs/make-dialog-manager";
import { createCloseHeading } from "../../../../../components/ha-dialog";
import type { HomeAssistant } from "../../../../../types";
import type { BluetoothDeviceInfoDialogParams } from "./show-dialog-bluetooth-device-info";
import "../../../../../components/ha-button";
import { showToast } from "../../../../../util/toast";
import { copyToClipboard } from "../../../../../common/util/copy-clipboard";
import "../../../../../components/ha-button";
import { createCloseHeading } from "../../../../../components/ha-dialog";
import type { HassDialog } from "../../../../../dialogs/make-dialog-manager";
import type { HomeAssistant } from "../../../../../types";
import { showToast } from "../../../../../util/toast";
import type { BluetoothDeviceInfoDialogParams } from "./show-dialog-bluetooth-device-info";
@customElement("dialog-bluetooth-device-info")
class DialogBluetoothDeviceInfo extends LitElement implements HassDialog {
@ -117,7 +117,10 @@ class DialogBluetoothDeviceInfo extends LitElement implements HassDialog {
</tbody>
</table>
<ha-button slot="secondaryAction" @click=${this._copyToClipboard}
<ha-button
appearance="plain"
slot="secondaryAction"
@click=${this._copyToClipboard}
>${this.hass.localize(
"ui.panel.config.bluetooth.copy_to_clipboard"
)}</ha-button

17
src/panels/config/integrations/integration-panels/zeroconf/dialog-zeroconf-discovery-info.ts
View File

@ -2,13 +2,13 @@ import type { TemplateResult } from "lit";
import { html, LitElement, nothing } from "lit";
import { customElement, property, state } from "lit/decorators";
import { fireEvent } from "../../../../../common/dom/fire_event";
import type { HassDialog } from "../../../../../dialogs/make-dialog-manager";
import { createCloseHeading } from "../../../../../components/ha-dialog";
import type { HomeAssistant } from "../../../../../types";
import type { ZeroconfDiscoveryInfoDialogParams } from "./show-dialog-zeroconf-discovery-info";
import "../../../../../components/ha-button";
import { showToast } from "../../../../../util/toast";
import { copyToClipboard } from "../../../../../common/util/copy-clipboard";
import "../../../../../components/ha-button";
import { createCloseHeading } from "../../../../../components/ha-dialog";
import type { HassDialog } from "../../../../../dialogs/make-dialog-manager";
import type { HomeAssistant } from "../../../../../types";
import { showToast } from "../../../../../util/toast";
import type { ZeroconfDiscoveryInfoDialogParams } from "./show-dialog-zeroconf-discovery-info";
@customElement("dialog-zeroconf-device-info")
class DialogZeroconfDiscoveryInfo extends LitElement implements HassDialog {
@ -95,7 +95,10 @@ class DialogZeroconfDiscoveryInfo extends LitElement implements HassDialog {
</tbody>
</table>
<ha-button slot="secondaryAction" @click=${this._copyToClipboard}
<ha-button
appearance="plain"
slot="secondaryAction"
@click=${this._copyToClipboard}
>${this.hass.localize(
"ui.panel.config.zeroconf.copy_to_clipboard"
)}</ha-button

6
src/panels/lovelace/editor/section-editor/hui-dialog-edit-section.ts
View File

@ -187,7 +187,11 @@ export class HuiDialogEditSection
: nothing}
</ha-dialog-header>
${content}
<ha-button slot="secondaryAction" @click=${this._cancel}>
<ha-button
appearance="plain"
slot="secondaryAction"
@click=${this._cancel}
>
${this.hass!.localize("ui.common.cancel")}
</ha-button>