mirror of
https://github.com/home-assistant/frontend.git
synced 2025-07-28 11:46:42 +00:00
Remove hui-yaml-editor
This commit is contained in:
parent
9f4ae5d932
commit
644af4d009
@ -15,7 +15,7 @@ declare global {
|
||||
}
|
||||
|
||||
export class HuiCodeEditor extends HTMLElement {
|
||||
public cm;
|
||||
public codemirror;
|
||||
private _value;
|
||||
|
||||
constructor() {
|
||||
@ -35,35 +35,34 @@ export class HuiCodeEditor extends HTMLElement {
|
||||
}
|
||||
|
||||
set value(value: string) {
|
||||
console.log(value);
|
||||
if (this.cm) {
|
||||
if (value !== this.cm.getValue()) {
|
||||
this.cm.setValue(value);
|
||||
if (this.codemirror) {
|
||||
if (value !== this.codemirror.getValue()) {
|
||||
this.codemirror.setValue(value);
|
||||
}
|
||||
}
|
||||
this._value = value;
|
||||
}
|
||||
|
||||
get value() {
|
||||
return this.cm.getValue();
|
||||
return this.codemirror.getValue();
|
||||
}
|
||||
|
||||
public connectedCallback() {
|
||||
if (!this.cm) {
|
||||
this.cm = CodeMirror(this.shadowRoot, {
|
||||
if (!this.codemirror) {
|
||||
this.codemirror = CodeMirror(this.shadowRoot, {
|
||||
value: this._value,
|
||||
lineNumbers: true,
|
||||
mode: "yaml",
|
||||
tabSize: 2,
|
||||
});
|
||||
this.cm.on("changes", this._onChange);
|
||||
this.codemirror.on("changes", this._onChange);
|
||||
} else {
|
||||
this.cm.refresh();
|
||||
this.codemirror.refresh();
|
||||
}
|
||||
}
|
||||
|
||||
private _onChange() {
|
||||
fireEvent(_this, "code-changed", { value: _this.cm.getValue() });
|
||||
fireEvent(_this, "code-changed", { value: _this.codemirror.getValue() });
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -23,7 +23,7 @@ import { HomeAssistant } from "../../../../types";
|
||||
import { LovelaceCardConfig } from "../../../../data/lovelace";
|
||||
import { fireEvent } from "../../../../common/dom/fire_event";
|
||||
|
||||
import "./hui-yaml-editor";
|
||||
import "../../components/hui-code-editor";
|
||||
import "./hui-card-preview";
|
||||
// This is not a duplicate import, one is for types, one is for element.
|
||||
// tslint:disable-next-line
|
||||
@ -36,9 +36,6 @@ import { addCard, replaceCard } from "../config-util";
|
||||
|
||||
declare global {
|
||||
interface HASSDomEvents {
|
||||
"yaml-changed": {
|
||||
yaml: string;
|
||||
};
|
||||
"entities-changed": {
|
||||
entities: EntityConfig[];
|
||||
};
|
||||
@ -118,11 +115,10 @@ export class HuiEditCard extends LitElement {
|
||||
${this._uiEditor
|
||||
? this._configElement
|
||||
: html`
|
||||
<hui-yaml-editor
|
||||
.hass="${this.hass}"
|
||||
.yaml="${this._configValue!.value}"
|
||||
@yaml-changed="${this._handleYamlChanged}"
|
||||
></hui-yaml-editor>
|
||||
<hui-code-editor
|
||||
.value="${this._configValue!.value}"
|
||||
@code-changed="${this._handleYamlChanged}"
|
||||
></hui-code-editor>
|
||||
`}
|
||||
</div>
|
||||
`;
|
||||
@ -238,8 +234,8 @@ export class HuiEditCard extends LitElement {
|
||||
}
|
||||
}
|
||||
|
||||
private _handleYamlChanged(ev: YamlChangedEvent): void {
|
||||
this._configValue = { format: "yaml", value: ev.detail.yaml };
|
||||
private _handleYamlChanged(ev: CustomEvent): void {
|
||||
this._configValue = { format: "yaml", value: ev.detail.value };
|
||||
try {
|
||||
const config = yaml.safeLoad(
|
||||
this._configValue.value
|
||||
|
@ -1,64 +0,0 @@
|
||||
import {
|
||||
html,
|
||||
LitElement,
|
||||
PropertyDeclarations,
|
||||
TemplateResult,
|
||||
} from "lit-element";
|
||||
import "@polymer/paper-input/paper-textarea";
|
||||
|
||||
import { HomeAssistant } from "../../../../types";
|
||||
import { fireEvent } from "../../../../common/dom/fire_event";
|
||||
|
||||
import "../../components/hui-code-editor";
|
||||
|
||||
export class HuiYAMLEditor extends LitElement {
|
||||
protected hass?: HomeAssistant;
|
||||
private _yaml?: string;
|
||||
|
||||
static get properties(): PropertyDeclarations {
|
||||
return { _yaml: {} };
|
||||
}
|
||||
|
||||
set yaml(yaml: string) {
|
||||
if (yaml === undefined) {
|
||||
return;
|
||||
} else {
|
||||
this._yaml = yaml;
|
||||
}
|
||||
}
|
||||
|
||||
protected render(): TemplateResult | void {
|
||||
return html`
|
||||
${this.renderStyle()}
|
||||
<hui-code-editor
|
||||
.value="${this._yaml}"
|
||||
@code-changed="${this._valueChanged}"
|
||||
>
|
||||
</hui-code-editor>
|
||||
`;
|
||||
}
|
||||
|
||||
private renderStyle(): TemplateResult {
|
||||
return html`
|
||||
<style>
|
||||
paper-textarea {
|
||||
--paper-input-container-shared-input-style_-_font-family: monospace;
|
||||
}
|
||||
</style>
|
||||
`;
|
||||
}
|
||||
|
||||
private _valueChanged(ev: CustomEvent): void {
|
||||
fireEvent(this, "yaml-changed", {
|
||||
yaml: ev.detail.value,
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
declare global {
|
||||
interface HTMLElementTagNameMap {
|
||||
"hui-yaml-editor": HuiYAMLEditor;
|
||||
}
|
||||
}
|
||||
|
||||
customElements.define("hui-yaml-editor", HuiYAMLEditor);
|
Loading…
x
Reference in New Issue
Block a user