@atlaskit/editor-plugin-status
Version:
Status plugin for @atlaskit/editor-core
82 lines (80 loc) • 3 kB
JavaScript
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 class StatusNodeView {
/**
*
* @param node
* @param intl
* @example
*/
constructor(node, intl) {
_defineProperty(this, "box", null);
_defineProperty(this, "textContainer", null);
this.node = node;
this.intl = intl;
const spec = statusToDOM(node);
const {
dom
} = DOMSerializer.renderSpec(document, spec);
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();
}
}
setPlaceholder() {
if (this.textContainer && this.domElement) {
this.textContainer.textContent = this.intl.formatMessage(messages.placeholder);
this.domElement.style.setProperty('opacity', '0.83');
}
}
/**
*
* @param node
* @example
*/
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 ? 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 ? 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 ? 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;
}
}