@progress/kendo-vue-editor/dialogs/viewHtml.mjs

TODO

/**
 * @license
 *-------------------------------------------------------------------------------------------
 * Copyright © 2025 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the package root for more information
 *-------------------------------------------------------------------------------------------
 */
import { defineComponent as h, createVNode as i, isVNode as g } from "vue";
import { Window as f, DialogActionsBar as x } from "@progress/kendo-vue-dialogs";
import { Button as c } from "@progress/kendo-vue-buttons";
import { indentHtml as A, getHtml as k, trimWhitespace as w, setHtml as v } from "@progress/kendo-editor-common";
import { provideLocalizationService as C } from "@progress/kendo-vue-intl";
import { messages as r } from "../messages/main.mjs";
import { editorPropsKey as y } from "../utils/props-key.mjs";
import { guid as b, getRef as H, setRef as S } from "@progress/kendo-vue-common";
function l(t) {
  return typeof t == "function" || Object.prototype.toString.call(t) === "[object Object]" && !g(t);
}
const I = /* @__PURE__ */ h({
  name: "KendoViewHtmlDialog",
  emits: {
    close: null
  },
  props: {
    view: Object,
    settings: Object,
    dir: String
  },
  created() {
    this.textAreaId = b();
  },
  inject: {
    kendoLocalizationService: {
      default: null
    }
  },
  data() {
    const {
      view: t
    } = this.$props;
    return {
      textAreaValue: A(k(t.state))
    };
  },
  mounted() {
    this.htmlArea = H(this, "htmlArea"), this.htmlArea && this.htmlArea.focus();
  },
  render() {
    let t, o;
    const {
      settings: n,
      dir: e
    } = this.$props, a = C(this), {
      viewHtmlDialogTitle: m,
      viewHtmlCancel: d,
      viewHtmlUpdate: u
    } = n.messages, p = i("span", {
      class: "k-input k-textarea k-input-md k-input-solid k-rounded-md k-editor-textarea"
    }, [i("textarea", {
      ref: S(this, "htmlArea"),
      onInput: this.textAreaChange,
      value: this.textAreaValue,
      id: this.textAreaId,
      role: "textbox",
      class: "k-input-inner !k-overflow-auto",
      tabindex: "0",
      "aria-multiline": "true",
      style: "resize: none;"
    }, null)]), s = [i(c, {
      type: "button",
      onClick: this.onClose,
      dir: e,
      key: "cancel"
    }, l(t = a.toLanguageString(d, r[d])) ? t : {
      default: () => [t]
    }), i(c, {
      type: "button",
      onClick: this.onUpdate,
      themeColor: "primary",
      dir: e,
      key: "update"
    }, l(o = a.toLanguageString(u, r[u])) ? o : {
      default: () => [o]
    })];
    return i(f, {
      initialHeight: 400,
      initialWidth: 500,
      windowClass: "k-editor-window",
      title: a.toLanguageString(m, r[m]),
      onClose: this.onClose,
      key: "dialog",
      dir: e,
      style: e === "rtl" ? {
        textAlign: "right"
      } : void 0,
      modal: !0,
      minimizeButton: () => null,
      maximizeButton: () => null,
      resizable: !1
    }, {
      default: () => [p, i(x, null, l(s) ? s : {
        default: () => [s]
      })]
    });
  },
  methods: {
    textAreaChange(t) {
      this.textAreaValue = t.target.value;
    },
    onUpdate() {
      const {
        view: t,
        settings: o
      } = this.$props, n = w(this.htmlArea ? this.textAreaValue : ""), {
        preserveWhitespace: e
      } = y.getState(t.state);
      v(n, o.commandName, {
        preserveWhitespace: e
      })(t.state, t.dispatch), this.onClose();
    },
    onClose() {
      this.$props.view.focus(), this.$emit("close");
    }
  }
});
export {
  I as ViewHtmlDialog
};