@logicflow/extension
Version:
LogicFlow Extensions
136 lines (135 loc) • 6 kB
JavaScript
;
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.MediumEditor = exports.createColorPickerButtonClass = exports.defaultOptions = void 0;
var medium_editor_1 = __importDefault(require("medium-editor"));
exports.MediumEditor = medium_editor_1.default;
var vanilla_picker_1 = __importDefault(require("vanilla-picker"));
var rangy_1 = __importDefault(require("rangy"));
require("rangy/lib/rangy-classapplier");
exports.defaultOptions = {
toolbar: {
allowMultiParagraphSelection: true,
buttons: [
'bold',
'colorpicker',
'italic',
'underline',
'strikethrough',
'quote',
'justifyLeft',
'justifyCenter',
'justifyRight',
'justifyFull',
'superscript',
'subscript',
'orderedlist',
'unorderedlist',
'pre',
'removeFormat',
'outdent',
'indent',
'h2',
'h3',
],
standardizeSelectionStart: false,
updateOnEmptySelection: false,
},
placeholder: {
text: '请输入内容',
hideOnClick: true,
},
disableEditing: true,
};
function createColorPickerButtonClass(MediumEditor) {
var _a, _b;
var ButtonBase = ((_a = MediumEditor === null || MediumEditor === void 0 ? void 0 : MediumEditor.extensions) === null || _a === void 0 ? void 0 : _a.button) || ((_b = MediumEditor === null || MediumEditor === void 0 ? void 0 : MediumEditor.extensions) === null || _b === void 0 ? void 0 : _b.button);
var ExtensionBase = (MediumEditor === null || MediumEditor === void 0 ? void 0 : MediumEditor.Extension) || (MediumEditor === null || MediumEditor === void 0 ? void 0 : MediumEditor.Extension);
// 当 Button 扩展基类不可用时，回退到 Extension 基类，避免在模块加载阶段抛错
var Base = ButtonBase || ExtensionBase;
if (!Base) {
console.warn('MediumEditor button/extension base not available; using noop extension');
return /** @class */ (function () {
function class_1() {
}
return class_1;
}());
}
return Base.extend({
name: 'colorpicker',
tagNames: ['mark'],
contentDefault: '<b>Color</b>',
aria: 'Color Picker',
action: 'colorPicker',
init: function () {
var _this = this;
var _a, _b;
try {
rangy_1.default.init();
}
catch (_c) {
console.error('rangy.init failed');
}
// 初始化按钮（ButtonBase 才有 prototype.init）
try {
;
(_b = (_a = ButtonBase === null || ButtonBase === void 0 ? void 0 : ButtonBase.prototype) === null || _a === void 0 ? void 0 : _a.init) === null || _b === void 0 ? void 0 : _b.call(this);
}
catch (_d) {
console.error('ButtonBase.init failed');
}
this.colorPicker = new vanilla_picker_1.default({
parent: this.button || undefined,
color: '#000',
onDone: function (res) {
var _a, _b, _c, _d, _e;
try {
if (_this.coloredText && ((_b = (_a = _this.coloredText).isAppliedToSelection) === null || _b === void 0 ? void 0 : _b.call(_a))) {
_this.coloredText.undoToSelection();
}
_this.coloredText = rangy_1.default.createClassApplier('colored', {
elementTagName: 'span',
elementProperties: { style: { color: res.hex } },
normalize: true,
});
_this.coloredText.toggleSelection();
(_d = (_c = _this.base) === null || _c === void 0 ? void 0 : _c.checkContentChanged) === null || _d === void 0 ? void 0 : _d.call(_c);
(_e = _this.setInactive) === null || _e === void 0 ? void 0 : _e.call(_this);
}
catch (_f) {
console.error('Picker.onDone failed');
}
},
});
},
getButton: function () {
return this.button;
},
handleClick: function () {
var _a, _b, _c;
(_a = this.setActive) === null || _a === void 0 ? void 0 : _a.call(this);
(_c = (_b = this.colorPicker) === null || _b === void 0 ? void 0 : _b.show) === null || _c === void 0 ? void 0 : _c.call(_b);
},
isAlreadyApplied: function (node) {
var _a, _b;
return ((_b = (_a = node === null || node === void 0 ? void 0 : node.nodeName) === null || _a === void 0 ? void 0 : _a.toLowerCase) === null || _b === void 0 ? void 0 : _b.call(_a)) === 'mark';
},
isActive: function () {
var _a, _b;
return (_b = (_a = this.button) === null || _a === void 0 ? void 0 : _a.classList) === null || _b === void 0 ? void 0 : _b.contains('medium-editor-button-active');
},
setInactive: function () {
var _a, _b;
;
(_b = (_a = this.button) === null || _a === void 0 ? void 0 : _a.classList) === null || _b === void 0 ? void 0 : _b.remove('medium-editor-button-active');
},
setActive: function () {
var _a, _b;
;
(_b = (_a = this.button) === null || _a === void 0 ? void 0 : _a.classList) === null || _b === void 0 ? void 0 : _b.add('medium-editor-button-active');
},
});
}
exports.createColorPickerButtonClass = createColorPickerButtonClass;