mirror of
https://github.com/home-assistant/frontend.git
synced 2025-07-25 18:26:35 +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 {}
|
// export class HaPaperDialog extends paperDialogClass {}
|
||||||
// @ts-ignore
|
// @ts-ignore
|
||||||
export class HaPaperDialog
|
export class HaPaperDialog
|
||||||
|
@ -1,10 +1,9 @@
|
|||||||
import "@polymer/paper-dialog-scrollable/paper-dialog-scrollable";
|
import "@polymer/paper-dialog-scrollable/paper-dialog-scrollable";
|
||||||
import deepFreeze from "deep-freeze";
|
import deepFreeze from "deep-freeze";
|
||||||
import { css, CSSResultGroup, html, LitElement, TemplateResult } from "lit";
|
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 { fireEvent } from "../../../../common/dom/fire_event";
|
||||||
import "../../../../components/dialog/ha-paper-dialog";
|
import "../../../../components/dialog/ha-paper-dialog";
|
||||||
import type { HaPaperDialog } from "../../../../components/dialog/ha-paper-dialog";
|
|
||||||
import type { LovelaceCardConfig } from "../../../../data/lovelace";
|
import type { LovelaceCardConfig } from "../../../../data/lovelace";
|
||||||
import { haStyleDialog } from "../../../../resources/styles";
|
import { haStyleDialog } from "../../../../resources/styles";
|
||||||
import type { HomeAssistant } from "../../../../types";
|
import type { HomeAssistant } from "../../../../types";
|
||||||
@ -19,16 +18,18 @@ export class HuiDialogDeleteCard extends LitElement {
|
|||||||
|
|
||||||
@state() private _cardConfig?: LovelaceCardConfig;
|
@state() private _cardConfig?: LovelaceCardConfig;
|
||||||
|
|
||||||
@query("ha-paper-dialog", true) private _dialog!: HaPaperDialog;
|
|
||||||
|
|
||||||
public async showDialog(params: DeleteCardDialogParams): Promise<void> {
|
public async showDialog(params: DeleteCardDialogParams): Promise<void> {
|
||||||
this._params = params;
|
this._params = params;
|
||||||
this._cardConfig = params.cardConfig;
|
this._cardConfig = params.cardConfig;
|
||||||
if (!Object.isFrozen(this._cardConfig)) {
|
if (!Object.isFrozen(this._cardConfig)) {
|
||||||
this._cardConfig = deepFreeze(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 {
|
protected render(): TemplateResult {
|
||||||
@ -37,9 +38,12 @@ export class HuiDialogDeleteCard extends LitElement {
|
|||||||
}
|
}
|
||||||
|
|
||||||
return html`
|
return html`
|
||||||
<ha-paper-dialog with-backdrop opened modal>
|
<ha-dialog
|
||||||
<h2>${this.hass.localize("ui.panel.lovelace.cards.confirm_delete")}</h2>
|
open
|
||||||
<paper-dialog-scrollable>
|
@closed=${this.closeDialog}
|
||||||
|
.heading=${this.hass.localize("ui.panel.lovelace.cards.confirm_delete")}
|
||||||
|
>
|
||||||
|
<div>
|
||||||
${this._cardConfig
|
${this._cardConfig
|
||||||
? html`
|
? html`
|
||||||
<div class="element-preview">
|
<div class="element-preview">
|
||||||
@ -50,16 +54,18 @@ export class HuiDialogDeleteCard extends LitElement {
|
|||||||
</div>
|
</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>
|
</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 {
|
private _delete(): void {
|
||||||
if (!this._params?.deleteCard) {
|
if (!this._params?.deleteCard) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
this._params.deleteCard();
|
this._params.deleteCard();
|
||||||
this._close();
|
this.closeDialog();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Loading…
x
Reference in New Issue
Block a user