mirror of
https://github.com/home-assistant/frontend.git
synced 2025-08-02 14:07:55 +00:00
Allow data passed from editor to preview
This commit is contained in:
parent
0183e32267
commit
5bc2fd059c
@ -12,6 +12,8 @@ export class HuiCardPreview extends ReactiveElement {
|
|||||||
|
|
||||||
@property() public config?: LovelaceCardConfig;
|
@property() public config?: LovelaceCardConfig;
|
||||||
|
|
||||||
|
@property() public editMode = true;
|
||||||
|
|
||||||
private _element?: LovelaceCard;
|
private _element?: LovelaceCard;
|
||||||
|
|
||||||
private get _error() {
|
private get _error() {
|
||||||
@ -81,6 +83,9 @@ export class HuiCardPreview extends ReactiveElement {
|
|||||||
this._element.hass = this.hass;
|
this._element.hass = this.hass;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
if (changedProperties.has("editMode")) {
|
||||||
|
this._element!.editMode = this.editMode;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
private _createCard(configValue: LovelaceCardConfig): void {
|
private _createCard(configValue: LovelaceCardConfig): void {
|
||||||
@ -90,6 +95,7 @@ export class HuiCardPreview extends ReactiveElement {
|
|||||||
if (this.hass) {
|
if (this.hass) {
|
||||||
this._element!.hass = this.hass;
|
this._element!.hass = this.hass;
|
||||||
}
|
}
|
||||||
|
this._element!.editMode = this.editMode;
|
||||||
|
|
||||||
this.appendChild(this._element!);
|
this.appendChild(this._element!);
|
||||||
}
|
}
|
||||||
|
@ -43,6 +43,13 @@ declare global {
|
|||||||
interface HTMLElementEventMap {
|
interface HTMLElementEventMap {
|
||||||
"reload-lovelace": HASSDomEvent<undefined>;
|
"reload-lovelace": HASSDomEvent<undefined>;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
interface HASSDomEvents {
|
||||||
|
"edit-mode-changed": any;
|
||||||
|
}
|
||||||
|
interface HTMLElementEventMap {
|
||||||
|
"edit-mode-changed": HASSDomEvent<any>;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@customElement("hui-dialog-edit-card")
|
@customElement("hui-dialog-edit-card")
|
||||||
@ -77,10 +84,13 @@ export class HuiDialogEditCard
|
|||||||
|
|
||||||
@state() private _isEscapeEnabled = true;
|
@state() private _isEscapeEnabled = true;
|
||||||
|
|
||||||
|
@state() private _editMode = true;
|
||||||
|
|
||||||
public async showDialog(params: EditCardDialogParams): Promise<void> {
|
public async showDialog(params: EditCardDialogParams): Promise<void> {
|
||||||
this._params = params;
|
this._params = params;
|
||||||
this._GUImode = true;
|
this._GUImode = true;
|
||||||
this._guiModeAvailable = true;
|
this._guiModeAvailable = true;
|
||||||
|
this._editMode = true;
|
||||||
const [view, card] = params.path;
|
const [view, card] = params.path;
|
||||||
this._viewConfig = params.lovelaceConfig.views[view];
|
this._viewConfig = params.lovelaceConfig.views[view];
|
||||||
this._cardConfig =
|
this._cardConfig =
|
||||||
@ -205,6 +215,7 @@ export class HuiDialogEditCard
|
|||||||
.lovelace=${this._params.lovelaceConfig}
|
.lovelace=${this._params.lovelaceConfig}
|
||||||
.value=${this._cardConfig}
|
.value=${this._cardConfig}
|
||||||
@config-changed=${this._handleConfigChanged}
|
@config-changed=${this._handleConfigChanged}
|
||||||
|
@edit-mode-changed=${this._handleEditModeChanged}
|
||||||
@GUImode-changed=${this._handleGUIModeChanged}
|
@GUImode-changed=${this._handleGUIModeChanged}
|
||||||
@editor-save=${this._save}
|
@editor-save=${this._save}
|
||||||
dialogInitialFocus
|
dialogInitialFocus
|
||||||
@ -214,6 +225,7 @@ export class HuiDialogEditCard
|
|||||||
<hui-card-preview
|
<hui-card-preview
|
||||||
.hass=${this.hass}
|
.hass=${this.hass}
|
||||||
.config=${this._cardConfig}
|
.config=${this._cardConfig}
|
||||||
|
.editMode=${this._editMode}
|
||||||
class=${this._error ? "blur" : ""}
|
class=${this._error ? "blur" : ""}
|
||||||
></hui-card-preview>
|
></hui-card-preview>
|
||||||
${this._error
|
${this._error
|
||||||
@ -284,6 +296,10 @@ export class HuiDialogEditCard
|
|||||||
this._dirty = true;
|
this._dirty = true;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
private _handleEditModeChanged(ev: HASSDomEvent<any>) {
|
||||||
|
this._editMode = ev.detail ?? true;
|
||||||
|
}
|
||||||
|
|
||||||
private _handleGUIModeChanged(ev: HASSDomEvent<GUIModeChangedEvent>): void {
|
private _handleGUIModeChanged(ev: HASSDomEvent<GUIModeChangedEvent>): void {
|
||||||
ev.stopPropagation();
|
ev.stopPropagation();
|
||||||
this._GUImode = ev.detail.guiMode;
|
this._GUImode = ev.detail.guiMode;
|
||||||
|
@ -38,7 +38,7 @@ export interface LovelaceBadge extends HTMLElement {
|
|||||||
export interface LovelaceCard extends HTMLElement {
|
export interface LovelaceCard extends HTMLElement {
|
||||||
hass?: HomeAssistant;
|
hass?: HomeAssistant;
|
||||||
isPanel?: boolean;
|
isPanel?: boolean;
|
||||||
editMode?: boolean;
|
editMode?: any;
|
||||||
getCardSize(): number | Promise<number>;
|
getCardSize(): number | Promise<number>;
|
||||||
setConfig(config: LovelaceCardConfig): void;
|
setConfig(config: LovelaceCardConfig): void;
|
||||||
}
|
}
|
||||||
|
Loading…
x
Reference in New Issue
Block a user