@atlaskit/editor-plugin-status
Version:
Status plugin for @atlaskit/editor-core
89 lines (87 loc) • 3.45 kB
JavaScript
import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
import _createClass from "@babel/runtime/helpers/createClass";
import _defineProperty from "@babel/runtime/helpers/defineProperty";
import { statusMessages as messages } from '@atlaskit/editor-common/messages';
import { DOMSerializer } from '@atlaskit/editor-prosemirror/model';
import { fg } from '@atlaskit/platform-feature-flags';
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
import { statusToDOM } from './statusNodeSpec';
/**
*
*/
export var StatusNodeView = /*#__PURE__*/function () {
/**
*
* @param node
* @param intl
* @example
*/
function StatusNodeView(node, intl) {
_classCallCheck(this, StatusNodeView);
_defineProperty(this, "box", null);
_defineProperty(this, "textContainer", null);
this.node = node;
this.intl = intl;
var spec = statusToDOM(node);
var _DOMSerializer$render = DOMSerializer.renderSpec(document, spec),
dom = _DOMSerializer$render.dom;
this.dom = dom;
this.domElement = dom instanceof HTMLElement ? dom : undefined;
if (this.domElement) {
this.box = this.domElement.querySelector('.status-lozenge-span');
this.textContainer = this.domElement.querySelector('.lozenge-text');
}
if (!node.attrs.text) {
this.setPlaceholder();
}
}
return _createClass(StatusNodeView, [{
key: "setPlaceholder",
value: function setPlaceholder() {
if (this.textContainer && this.domElement) {
this.textContainer.textContent = this.intl.formatMessage(messages.placeholder);
this.domElement.style.setProperty('opacity', '0.83');
}
}
/**
*
* @param node
* @example
*/
}, {
key: "update",
value: function update(node) {
if (node.type !== this.node.type) {
return false;
}
if (this.textContainer && node.attrs.text !== this.node.attrs.text) {
this.textContainer.textContent = node.attrs.text;
// Also update data-text on outer wrapper for parseDOM extraction when copying
if (expValEquals('platform_editor_copy_paste_issue_fix', 'isEnabled', true)) {
var _this$domElement;
(_this$domElement = this.domElement) === null || _this$domElement === void 0 || _this$domElement.setAttribute('data-text', node.attrs.text);
}
}
if (this.textContainer && node.attrs.style !== this.node.attrs.style && fg('platform-dst-lozenge-tag-badge-visual-uplifts')) {
this.textContainer.style.textTransform = node.attrs.style !== 'mixedCase' ? 'uppercase' : '';
}
if (node.attrs.color !== this.node.attrs.color) {
var _this$box;
(_this$box = this.box) === null || _this$box === void 0 || _this$box.setAttribute('data-color', node.attrs.color);
// Also update data-color on outer wrapper for parseDOM extraction when copying
if (expValEquals('platform_editor_copy_paste_issue_fix', 'isEnabled', true)) {
var _this$domElement2;
(_this$domElement2 = this.domElement) === null || _this$domElement2 === void 0 || _this$domElement2.setAttribute('data-color', node.attrs.color);
}
}
if (!node.attrs.text) {
this.setPlaceholder();
}
if (node.attrs.text && this.domElement) {
this.domElement.style.setProperty('opacity', '1');
}
this.node = node;
return true;
}
}]);
}();