@vericus/slate-kit-highlight-text/lib/commands/index.js

plugin that provide a way to color/highlight a group of text on slate

import { Mark, Data } from "slate";
import tinycolor from "tinycolor2";
export default function createCommands(opt) {
    var _a;
    var defaultColor = opt.defaultColor, data = opt.data, type = opt.type, name = opt.name;
    return _a = {},
        _a["change" + name + "Color"] = function (editor, color) {
            var _a, _b;
            var value = editor.value;
            var selection = value.selection;
            if (editor.hasMark(type)) {
                if (tinycolor(color).toName() === defaultColor) {
                    if (selection.isCollapsed) {
                        editor.removeCollapsedMark(type);
                    }
                    else {
                        editor.removeExpandedMark(type);
                    }
                }
                else {
                    var newMark = new Mark({
                        type: type,
                        data: Data.create((_a = {},
                            _a[data] = color,
                            _a)),
                    });
                    if (selection.isCollapsed) {
                        editor.removeCollapsedMark(type).addMark(newMark);
                    }
                    else {
                        editor.removeExpandedMark(type).addMarkAtRange(selection, newMark);
                    }
                }
            }
            else if (tinycolor(color).toName() !== defaultColor) {
                var mark = new Mark({
                    type: type,
                    data: Data.create((_b = {},
                        _b[data] = color,
                        _b)),
                });
                if (selection.isCollapsed) {
                    editor.removeCollapsedMark(type).addMark(mark);
                }
                else {
                    editor.removeExpandedMark(type).addMarkAtRange(selection, mark);
                }
            }
            editor.focus();
        },
        _a;
}
//# sourceMappingURL=index.js.map