var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
    return c > 3 && r && Object.defineProperty(target, key, r), r;
};
/*
 * Copyright 2022, OpenRemote Inc.
 *
 * See the CONTRIBUTORS.txt file in the distribution for a
 * full listing of individual contributors.
 *
 * This program is free software: you can redistribute it and/or modify
 * it under the terms of the GNU Affero General Public License as
 * published by the Free Software Foundation, either version 3 of the
 * License, or (at your option) any later version.
 *
 * This program is distributed in the hope that it will be useful,
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
 * GNU Affero General Public License for more details.
 *
 * You should have received a copy of the GNU Affero General Public License
 * along with this program. If not, see <http://www.gnu.org/licenses/>.
 */
import { html, LitElement } from "lit";
import { customElement, property } from "lit/decorators.js";
import "@openremote/or-components/or-ace-editor";
import { OrMwcDialog, showDialog } from "@openremote/or-mwc-components/or-mwc-dialog";
import { createRef, ref } from "lit/directives/ref.js";
import { InputType } from "@openremote/or-mwc-components/or-mwc-input";
let OrConfJson = class OrConfJson extends LitElement {
    constructor() {
        super(...arguments);
        this.config = {};
        this._aceEditor = createRef();
    }
    beforeSave() {
        if (!this._aceEditor.value) {
            return false;
        }
        const value = this._aceEditor.value.getValue();
        try {
            return JSON.parse(value || '{}');
        }
        catch (e) {
            return false;
        }
    }
    _showConfigDialog() {
        let dialog;
        const _saveConfig = () => {
            const config = this.beforeSave();
            if (config) {
                this.config = config;
                this.dispatchEvent(new CustomEvent('saveLocalConfig', { detail: { value: this.config } }));
                return true;
            }
            return false;
        };
        const dialogActions = [
            {
                actionName: "cancel",
                content: "cancel"
            },
            {
                actionName: "ok",
                content: "update",
                action: _saveConfig,
            }
        ];
        dialog = new OrMwcDialog()
            .setActions(dialogActions)
            .setHeading(this.heading)
            .setContent(html `
                <or-ace-editor 
                    ${ref(this._aceEditor)} 
                    .value="${this.config}"
                    @or-ace-editor-changed="${(ev) => {
            var _a;
            const okButton = (_a = dialog.actions) === null || _a === void 0 ? void 0 : _a.find(action => action.actionName === "ok");
            if (okButton) {
                okButton.disabled = !ev.detail.valid;
                dialog.requestUpdate();
            }
        }}"
                ></or-ace-editor>
            `)
            .setStyles(html `
                <style>
                    .mdc-dialog__surface {
                        width: 1024px;
                        overflow-x: visible !important;
                        overflow-y: visible !important;
                    }
                    #dialog-content {
                        border-top-width: 1px;
                        border-top-style: solid;
                        border-bottom-width: 1px;
                        border-bottom-style: solid;
                        padding: 0;
                        overflow: visible;
                        height: 60vh;
                    }
                </style>
            `)
            .setDismissAction(null);
        showDialog(dialog);
    }
    render() {
        return html `
            <or-mwc-input type="${InputType.BUTTON}" label="JSON" outlined icon="pencil" @or-mwc-input-changed="${() => { this._showConfigDialog(); }}"></or-mwc-input>
        `;
    }
};
__decorate([
    property({ attribute: false })
], OrConfJson.prototype, "config", void 0);
OrConfJson = __decorate([
    customElement("or-conf-json")
], OrConfJson);
export { OrConfJson };
//# sourceMappingURL=or-conf-json.js.map