@progress/kendo-react-editor
Version:
React Editor enables users to create rich text content through a WYSIWYG interface. KendoReact Editor package
70 lines (69 loc) • 2.85 kB
JavaScript
/**
* @license
*-------------------------------------------------------------------------------------------
* Copyright © 2025 Progress Software Corporation. All rights reserved.
* Licensed under commercial license. See LICENSE.md in the package root for more information
*-------------------------------------------------------------------------------------------
*/
import * as i from "react";
import { Window as g, WindowActionsBar as d } from "@progress/kendo-react-dialogs";
import { Button as u } from "@progress/kendo-react-buttons";
import { trimWhitespace as f, setHtml as w, indentHtml as v, getHtml as C } from "@progress/kendo-editor-common";
import { registerForLocalization as A, provideLocalizationService as H } from "@progress/kendo-react-intl";
import { messages as n } from "../messages/index.mjs";
import { editorPropsKey as x } from "../utils/props-key.mjs";
import { TextArea as z } from "@progress/kendo-react-inputs";
let k = class extends i.Component {
constructor() {
super(...arguments), this.htmlArea = null, this.textAreaRef = (t) => {
this.htmlArea = t;
const e = t && t.element.current;
e && (e.style.resize = "none");
}, this.onUpdate = () => {
const { view: t, settings: e } = this.props, o = f(this.htmlArea && this.htmlArea.value || ""), { preserveWhitespace: s } = x.getState(t.state);
w(o, e.commandName, { preserveWhitespace: s })(t.state, t.dispatch), this.onClose();
}, this.onClose = () => {
this.props.view.focus(), this.props.onClose();
};
}
/**
* @hidden
*/
render() {
const { view: t, settings: e, dir: o, render: s } = this.props, r = H(this), { viewHtmlDialogTitle: a, viewHtmlCancel: l, viewHtmlUpdate: m } = e.messages, c = /* @__PURE__ */ i.createElement(
z,
{
className: "k-editor-textarea",
defaultValue: v(C(t.state)),
autoFocus: !0,
autoSize: !1,
ref: this.textAreaRef
}
), h = [
/* @__PURE__ */ i.createElement(u, { onClick: this.onClose, dir: o, key: "cancel" }, r.toLanguageString(l, n[l])),
/* @__PURE__ */ i.createElement(u, { onClick: this.onUpdate, themeColor: "primary", dir: o, key: "update" }, r.toLanguageString(m, n[m]))
], p = /* @__PURE__ */ i.createElement(
g,
{
className: "k-editor-window",
title: r.toLanguageString(a, n[a]),
onClose: this.onClose,
key: "dialog",
style: o === "rtl" ? { textAlign: "right" } : void 0,
modal: !0,
minimizeButton: () => null,
maximizeButton: () => null,
resizable: !0,
initialHeight: 400,
initialWidth: 500
},
c,
/* @__PURE__ */ i.createElement(d, null, ...h)
);
return s ? s(p, { content: c, actionButtons: h }) : p;
}
};
A(k);
export {
k as ViewHtmlDialog
};