mirror of
https://github.com/home-assistant/frontend.git
synced 2025-07-21 08:16:36 +00:00
Fix card deletion dialog buttons out of view (#9992)
Co-authored-by: Bram Kragten <mail@bramkragten.nl>
This commit is contained in:
parent
fcac3fa164
commit
49494c572b
@ -15,7 +15,7 @@ const haTabFixBehaviorImpl = {
|
||||
},
|
||||
};
|
||||
|
||||
// paper-dialog that uses the haTabFixBehaviorImpl behvaior
|
||||
// paper-dialog that uses the haTabFixBehaviorImpl behavior
|
||||
// export class HaPaperDialog extends paperDialogClass {}
|
||||
// @ts-ignore
|
||||
export class HaPaperDialog
|
||||
|
@ -1,10 +1,9 @@
|
||||
import "@polymer/paper-dialog-scrollable/paper-dialog-scrollable";
|
||||
import deepFreeze from "deep-freeze";
|
||||
import { css, CSSResultGroup, html, LitElement, TemplateResult } from "lit";
|
||||
import { customElement, property, state, query } from "lit/decorators";
|
||||
import { customElement, property, state } from "lit/decorators";
|
||||
import { fireEvent } from "../../../../common/dom/fire_event";
|
||||
import "../../../../components/dialog/ha-paper-dialog";
|
||||
import type { HaPaperDialog } from "../../../../components/dialog/ha-paper-dialog";
|
||||
import type { LovelaceCardConfig } from "../../../../data/lovelace";
|
||||
import { haStyleDialog } from "../../../../resources/styles";
|
||||
import type { HomeAssistant } from "../../../../types";
|
||||
@ -19,16 +18,18 @@ export class HuiDialogDeleteCard extends LitElement {
|
||||
|
||||
@state() private _cardConfig?: LovelaceCardConfig;
|
||||
|
||||
@query("ha-paper-dialog", true) private _dialog!: HaPaperDialog;
|
||||
|
||||
public async showDialog(params: DeleteCardDialogParams): Promise<void> {
|
||||
this._params = params;
|
||||
this._cardConfig = params.cardConfig;
|
||||
if (!Object.isFrozen(this._cardConfig)) {
|
||||
this._cardConfig = deepFreeze(this._cardConfig);
|
||||
}
|
||||
await this.updateComplete;
|
||||
fireEvent(this._dialog as HTMLElement, "iron-resize");
|
||||
}
|
||||
|
||||
public closeDialog(): void {
|
||||
this._params = undefined;
|
||||
this._cardConfig = undefined;
|
||||
fireEvent(this, "dialog-closed", { dialog: this.localName });
|
||||
}
|
||||
|
||||
protected render(): TemplateResult {
|
||||
@ -37,9 +38,12 @@ export class HuiDialogDeleteCard extends LitElement {
|
||||
}
|
||||
|
||||
return html`
|
||||
<ha-paper-dialog with-backdrop opened modal>
|
||||
<h2>${this.hass.localize("ui.panel.lovelace.cards.confirm_delete")}</h2>
|
||||
<paper-dialog-scrollable>
|
||||
<ha-dialog
|
||||
open
|
||||
@closed=${this.closeDialog}
|
||||
.heading=${this.hass.localize("ui.panel.lovelace.cards.confirm_delete")}
|
||||
>
|
||||
<div>
|
||||
${this._cardConfig
|
||||
? html`
|
||||
<div class="element-preview">
|
||||
@ -50,16 +54,18 @@ export class HuiDialogDeleteCard extends LitElement {
|
||||
</div>
|
||||
`
|
||||
: ""}
|
||||
</paper-dialog-scrollable>
|
||||
<div class="paper-dialog-buttons">
|
||||
<mwc-button @click="${this._close}">
|
||||
${this.hass!.localize("ui.common.cancel")}
|
||||
</mwc-button>
|
||||
<mwc-button class="warning" @click="${this._delete}">
|
||||
${this.hass!.localize("ui.common.delete")}
|
||||
</mwc-button>
|
||||
</div>
|
||||
</ha-paper-dialog>
|
||||
<mwc-button slot="secondaryAction" @click="${this.closeDialog}">
|
||||
${this.hass!.localize("ui.common.cancel")}
|
||||
</mwc-button>
|
||||
<mwc-button
|
||||
slot="primaryAction"
|
||||
class="warning"
|
||||
@click="${this._delete}"
|
||||
>
|
||||
${this.hass!.localize("ui.common.delete")}
|
||||
</mwc-button>
|
||||
</ha-dialog>
|
||||
`;
|
||||
}
|
||||
|
||||
@ -80,17 +86,12 @@ export class HuiDialogDeleteCard extends LitElement {
|
||||
];
|
||||
}
|
||||
|
||||
private _close(): void {
|
||||
this._params = undefined;
|
||||
this._cardConfig = undefined;
|
||||
}
|
||||
|
||||
private _delete(): void {
|
||||
if (!this._params?.deleteCard) {
|
||||
return;
|
||||
}
|
||||
this._params.deleteCard();
|
||||
this._close();
|
||||
this.closeDialog();
|
||||
}
|
||||
}
|
||||
|
||||
|
Loading…
x
Reference in New Issue
Block a user