ngx-editor
Version:
Rich Text Editor for angular using ProseMirror
43 lines • 6.04 kB
JavaScript
import { Plugin, PluginKey } from 'prosemirror-state';
import { DecorationSet, Decoration } from 'prosemirror-view';
const PLACEHOLDER_CLASSNAME = 'NgxEditor__Placeholder';
const placeholderPlugin = (text) => {
return new Plugin({
key: new PluginKey('placeholder'),
state: {
init() {
return text ?? '';
},
apply(tr, previousVal) {
const placeholder = tr.getMeta('UPDATE_PLACEHOLDER') ?? previousVal;
return placeholder;
}
},
props: {
decorations(state) {
const { doc } = state;
const { textContent, childCount } = doc;
const placeholder = this.getState(state);
if (!placeholder || childCount > 1) {
return DecorationSet.empty;
}
const decorations = [];
const decorate = (node, pos) => {
if (node.type.isBlock && node.childCount === 0 && textContent.length === 0) {
const placeholderNode = Decoration.node(pos, (pos + node.nodeSize), {
class: PLACEHOLDER_CLASSNAME,
'data-placeholder': placeholder,
'data-align': node.attrs['align'] ?? null
});
decorations.push(placeholderNode);
}
return false;
};
doc.descendants(decorate);
return DecorationSet.create(doc, decorations);
}
}
});
};
export default placeholderPlugin;
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicGxhY2Vob2xkZXIuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9uZ3gtZWRpdG9yL3NyYy9saWIvcGx1Z2lucy9wbGFjZWhvbGRlci50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsTUFBTSxFQUFlLFNBQVMsRUFBZSxNQUFNLG1CQUFtQixDQUFDO0FBQ2hGLE9BQU8sRUFBRSxhQUFhLEVBQUUsVUFBVSxFQUFFLE1BQU0sa0JBQWtCLENBQUM7QUFHN0QsTUFBTSxxQkFBcUIsR0FBRyx3QkFBd0IsQ0FBQztBQUV2RCxNQUFNLGlCQUFpQixHQUFHLENBQUMsSUFBYSxFQUFVLEVBQUU7SUFDbEQsT0FBTyxJQUFJLE1BQU0sQ0FBQztRQUNoQixHQUFHLEVBQUUsSUFBSSxTQUFTLENBQUMsYUFBYSxDQUFDO1FBQ2pDLEtBQUssRUFBRTtZQUNMLElBQUk7Z0JBQ0YsT0FBTyxJQUFJLElBQUksRUFBRSxDQUFDO1lBQ3BCLENBQUM7WUFDRCxLQUFLLENBQUMsRUFBZSxFQUFFLFdBQW1CO2dCQUN4QyxNQUFNLFdBQVcsR0FBRyxFQUFFLENBQUMsT0FBTyxDQUFDLG9CQUFvQixDQUFDLElBQUksV0FBVyxDQUFDO2dCQUNwRSxPQUFPLFdBQVcsQ0FBQztZQUNyQixDQUFDO1NBQ0Y7UUFDRCxLQUFLLEVBQUU7WUFDTCxXQUFXLENBQUMsS0FBa0I7Z0JBQzVCLE1BQU0sRUFBRSxHQUFHLEVBQUUsR0FBRyxLQUFLLENBQUM7Z0JBQ3RCLE1BQU0sRUFBRSxXQUFXLEVBQUUsVUFBVSxFQUFFLEdBQUcsR0FBRyxDQUFDO2dCQUV4QyxNQUFNLFdBQVcsR0FBRyxJQUFJLENBQUMsUUFBUSxDQUFDLEtBQUssQ0FBQyxDQUFDO2dCQUV6QyxJQUFJLENBQUMsV0FBVyxJQUFJLFVBQVUsR0FBRyxDQUFDLEVBQUU7b0JBQ2xDLE9BQU8sYUFBYSxDQUFDLEtBQUssQ0FBQztpQkFDNUI7Z0JBRUQsTUFBTSxXQUFXLEdBQWlCLEVBQUUsQ0FBQztnQkFFckMsTUFBTSxRQUFRLEdBQUcsQ0FBQyxJQUFxQixFQUFFLEdBQVcsRUFBRSxFQUFFO29CQUN0RCxJQUFJLElBQUksQ0FBQyxJQUFJLENBQUMsT0FBTyxJQUFJLElBQUksQ0FBQyxVQUFVLEtBQUssQ0FBQyxJQUFJLFdBQVcsQ0FBQyxNQUFNLEtBQUssQ0FBQyxFQUFFO3dCQUMxRSxNQUFNLGVBQWUsR0FBRyxVQUFVLENBQUMsSUFBSSxDQUFDLEdBQUcsRUFBRSxDQUFDLEdBQUcsR0FBRyxJQUFJLENBQUMsUUFBUSxDQUFDLEVBQUU7NEJBQ2xFLEtBQUssRUFBRSxxQkFBcUI7NEJBQzVCLGtCQUFrQixFQUFFLFdBQVc7NEJBQy9CLFlBQVksRUFBRSxJQUFJLENBQUMsS0FBSyxDQUFDLE9BQU8sQ0FBQyxJQUFJLElBQUk7eUJBQzFDLENBQUMsQ0FBQzt3QkFFSCxXQUFXLENBQUMsSUFBSSxDQUFDLGVBQWUsQ0FBQyxDQUFDO3FCQUNuQztvQkFFRCxPQUFPLEtBQUssQ0FBQztnQkFDZixDQUFDLENBQUM7Z0JBRUYsR0FBRyxDQUFDLFdBQVcsQ0FBQyxRQUFRLENBQUMsQ0FBQztnQkFDMUIsT0FBTyxhQUFhLENBQUMsTUFBTSxDQUFDLEdBQUcsRUFBRSxXQUFXLENBQUMsQ0FBQztZQUNoRCxDQUFDO1NBQ0Y7S0FDRixDQUFDLENBQUM7QUFDTCxDQUFDLENBQUM7QUFFRixlQUFlLGlCQUFpQixDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgUGx1Z2luLCBFZGl0b3JTdGF0ZSwgUGx1Z2luS2V5LCBUcmFuc2FjdGlvbiB9IGZyb20gJ3Byb3NlbWlycm9yLXN0YXRlJztcbmltcG9ydCB7IERlY29yYXRpb25TZXQsIERlY29yYXRpb24gfSBmcm9tICdwcm9zZW1pcnJvci12aWV3JztcbmltcG9ydCB7IE5vZGUgYXMgUHJvc2VNaXJyb3JOb2RlIH0gZnJvbSAncHJvc2VtaXJyb3ItbW9kZWwnO1xuXG5jb25zdCBQTEFDRUhPTERFUl9DTEFTU05BTUUgPSAnTmd4RWRpdG9yX19QbGFjZWhvbGRlcic7XG5cbmNvbnN0IHBsYWNlaG9sZGVyUGx1Z2luID0gKHRleHQ/OiBzdHJpbmcpOiBQbHVnaW4gPT4ge1xuICByZXR1cm4gbmV3IFBsdWdpbih7XG4gICAga2V5OiBuZXcgUGx1Z2luS2V5KCdwbGFjZWhvbGRlcicpLFxuICAgIHN0YXRlOiB7XG4gICAgICBpbml0KCk6IHN0cmluZyB7XG4gICAgICAgIHJldHVybiB0ZXh0ID8/ICcnO1xuICAgICAgfSxcbiAgICAgIGFwcGx5KHRyOiBUcmFuc2FjdGlvbiwgcHJldmlvdXNWYWw6IHN0cmluZyk6IHN0cmluZyB7XG4gICAgICAgIGNvbnN0IHBsYWNlaG9sZGVyID0gdHIuZ2V0TWV0YSgnVVBEQVRFX1BMQUNFSE9MREVSJykgPz8gcHJldmlvdXNWYWw7XG4gICAgICAgIHJldHVybiBwbGFjZWhvbGRlcjtcbiAgICAgIH1cbiAgICB9LFxuICAgIHByb3BzOiB7XG4gICAgICBkZWNvcmF0aW9ucyhzdGF0ZTogRWRpdG9yU3RhdGUpOiBEZWNvcmF0aW9uU2V0IHtcbiAgICAgICAgY29uc3QgeyBkb2MgfSA9IHN0YXRlO1xuICAgICAgICBjb25zdCB7IHRleHRDb250ZW50LCBjaGlsZENvdW50IH0gPSBkb2M7XG5cbiAgICAgICAgY29uc3QgcGxhY2Vob2xkZXIgPSB0aGlzLmdldFN0YXRlKHN0YXRlKTtcblxuICAgICAgICBpZiAoIXBsYWNlaG9sZGVyIHx8IGNoaWxkQ291bnQgPiAxKSB7XG4gICAgICAgICAgcmV0dXJuIERlY29yYXRpb25TZXQuZW1wdHk7XG4gICAgICAgIH1cblxuICAgICAgICBjb25zdCBkZWNvcmF0aW9uczogRGVjb3JhdGlvbltdID0gW107XG5cbiAgICAgICAgY29uc3QgZGVjb3JhdGUgPSAobm9kZTogUHJvc2VNaXJyb3JOb2RlLCBwb3M6IG51bWJlcikgPT4ge1xuICAgICAgICAgIGlmIChub2RlLnR5cGUuaXNCbG9jayAmJiBub2RlLmNoaWxkQ291bnQgPT09IDAgJiYgdGV4dENvbnRlbnQubGVuZ3RoID09PSAwKSB7XG4gICAgICAgICAgICBjb25zdCBwbGFjZWhvbGRlck5vZGUgPSBEZWNvcmF0aW9uLm5vZGUocG9zLCAocG9zICsgbm9kZS5ub2RlU2l6ZSksIHtcbiAgICAgICAgICAgICAgY2xhc3M6IFBMQUNFSE9MREVSX0NMQVNTTkFNRSxcbiAgICAgICAgICAgICAgJ2RhdGEtcGxhY2Vob2xkZXInOiBwbGFjZWhvbGRlcixcbiAgICAgICAgICAgICAgJ2RhdGEtYWxpZ24nOiBub2RlLmF0dHJzWydhbGlnbiddID8/IG51bGxcbiAgICAgICAgICAgIH0pO1xuXG4gICAgICAgICAgICBkZWNvcmF0aW9ucy5wdXNoKHBsYWNlaG9sZGVyTm9kZSk7XG4gICAgICAgICAgfVxuXG4gICAgICAgICAgcmV0dXJuIGZhbHNlO1xuICAgICAgICB9O1xuXG4gICAgICAgIGRvYy5kZXNjZW5kYW50cyhkZWNvcmF0ZSk7XG4gICAgICAgIHJldHVybiBEZWNvcmF0aW9uU2V0LmNyZWF0ZShkb2MsIGRlY29yYXRpb25zKTtcbiAgICAgIH1cbiAgICB9XG4gIH0pO1xufTtcblxuZXhwb3J0IGRlZmF1bHQgcGxhY2Vob2xkZXJQbHVnaW47XG4iXX0=