@atlaskit/editor-plugin-status
Version:
Status plugin for @atlaskit/editor-core
95 lines (93 loc) • 3.91 kB
JavaScript
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.StatusNodeView = void 0;
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
var _messages = require("@atlaskit/editor-common/messages");
var _model = require("@atlaskit/editor-prosemirror/model");
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
var _statusNodeSpec = require("./statusNodeSpec");
/**
*
*/
var StatusNodeView = exports.StatusNodeView = /*#__PURE__*/function () {
/**
*
* @param node
* @param intl
* @example
*/
function StatusNodeView(node, intl) {
(0, _classCallCheck2.default)(this, StatusNodeView);
(0, _defineProperty2.default)(this, "box", null);
(0, _defineProperty2.default)(this, "textContainer", null);
this.node = node;
this.intl = intl;
var spec = (0, _statusNodeSpec.statusToDOM)(node);
var _DOMSerializer$render = _model.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 (0, _createClass2.default)(StatusNodeView, [{
key: "setPlaceholder",
value: function setPlaceholder() {
if (this.textContainer && this.domElement) {
this.textContainer.textContent = this.intl.formatMessage(_messages.statusMessages.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 ((0, _expValEquals.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 && (0, _platformFeatureFlags.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 ((0, _expValEquals.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;
}
}]);
}();