8a6baeb7-5e65-4018-8673-9ce64c1642f2

import { Component, OnInit, Input, ChangeDetectionStrategy, OnChanges, ElementRef, ViewContainerRef, AfterViewInit } from '@angular/core';
import { Editor, Path, Node } from 'slate';
import { ViewContainerItem } from '../../view/container-item';
import { SlateLeafContext, SlateStringContext } from '../../view/context';
import { AngularEditor } from '../../plugins/angular-editor';
import { SlateDefaultStringComponent } from './default-string.component';

@Component({
    selector: 'span[slateString]',
    template: '',
    changeDetection: ChangeDetectionStrategy.OnPush
})
export class SlateStringComponent extends ViewContainerItem<SlateStringContext> implements OnInit, OnChanges, AfterViewInit {
    @Input() context: SlateLeafContext;

    constructor(private elementRef: ElementRef<any>, protected viewContainerRef: ViewContainerRef) {
        super(viewContainerRef);
    }

    ngOnInit(): void {
        this.createView();
    }

    ngOnChanges() {
        if (!this.initialized) {
            return;
        }
        this.updateView();
    }

    ngAfterViewInit() {
        this.elementRef.nativeElement.remove();
    }

    // COMPAT: If this is the last text node in an empty block, render a zero-
    // width space that will convert into a line break when copying and pasting
    // to support expected plain text.
    isLineBreakEmptyString() {
        const path = AngularEditor.findPath(this.viewContext.editor, this.context.text);
        const parentPath = Path.parent(path);
        return (
            this.context.leaf.text === '' &&
            this.context.parent.children[this.context.parent.children.length - 1] === this.context.text &&
            !this.viewContext.editor.isInline(this.context.parent) &&
            Editor.string(this.viewContext.editor, parentPath) === ''
        );
    }

    // COMPAT: If the text is empty, it's because it's on the edge of an inline
    // node, so we render a zero-width space so that the selection can be
    // inserted next to it still.
    isEmptyText() {
        return this.context.leaf.text === '';
    }

    // COMPAT: Browsers will collapse trailing new lines at the end of blocks,
    // so we need to add an extra trailing new lines to prevent that.
    isCompatibleString() {
        return this.context.isLast && this.context.leaf.text.slice(-1) === '\n';
    }

    // COMPAT: Render text inside void nodes with a zero-width space.
    // So the node can contain selection but the text is not visible.
    isVoid() {
        return this.viewContext.editor.isVoid(this.context.parent);
    }

    getViewType() {
        if (this.isVoid()) {
            return this.viewContext.templateComponent.voidStringTemplate;
        }

        if (this.isLineBreakEmptyString()) {
            return SlateDefaultStringComponent;
        }

        if (this.isEmptyText()) {
            return this.viewContext.templateComponent.emptyTextTemplate;
        }

        if (this.isCompatibleString()) {
            return this.viewContext.templateComponent.compatibleStringTemplate;
        }

        return SlateDefaultStringComponent;
    }

    getType(): SlateStringContext['type'] {
        if (this.isLineBreakEmptyString()) {
            return 'lineBreakEmptyString';
        }
        return 'string';
    }

    getContext(): SlateStringContext {
        const stringType = this.getType();
        return {
            text: this.context.leaf.text,
            elementStringLength: Node.string(this.context.parent).length,
            type: stringType
        };
    }

    memoizedContext(prev: SlateStringContext, next: SlateStringContext): boolean {
        return false;
    }
}

1	import { Component, OnInit, Input, ChangeDetectionStrategy, OnChanges, ElementRef, ViewContainerRef, AfterViewInit } from '@angular/core';
2	import { Editor, Path, Node } from 'slate';
3	import { ViewContainerItem } from '../../view/container-item';
4	import { SlateLeafContext, SlateStringContext } from '../../view/context';
5	import { AngularEditor } from '../../plugins/angular-editor';
6	import { SlateDefaultStringComponent } from './default-string.component';
7
8	@Component({
9	selector: 'span[slateString]',
10	template: '',
11	changeDetection: ChangeDetectionStrategy.OnPush
12	})
13	export class SlateStringComponent extends ViewContainerItem<SlateStringContext> implements OnInit, OnChanges, AfterViewInit {	1✔
14	@Input() context: SlateLeafContext;
15
16	constructor(private elementRef: ElementRef<any>, protected viewContainerRef: ViewContainerRef) {	143✔
17	super(viewContainerRef);	143✔
18	}
19
20	ngOnInit(): void {
21	this.createView();	143✔
22	}
23
24	ngOnChanges() {
25	if (!this.initialized) {	149✔
26	return;	143✔
27	}
28	this.updateView();	6✔
29	}
30
31	ngAfterViewInit() {
32	this.elementRef.nativeElement.remove();	143✔
33	}
34
35	// COMPAT: If this is the last text node in an empty block, render a zero-
36	// width space that will convert into a line break when copying and pasting
37	// to support expected plain text.
38	isLineBreakEmptyString() {
39	const path = AngularEditor.findPath(this.viewContext.editor, this.context.text);	297✔
40	const parentPath = Path.parent(path);	297✔
41	return (	297✔
42	this.context.leaf.text === '' &&	360✔
43	this.context.parent.children[this.context.parent.children.length - 1] === this.context.text &&
44	!this.viewContext.editor.isInline(this.context.parent) &&
45	Editor.string(this.viewContext.editor, parentPath) === ''
46	);
47	}
48
49	// COMPAT: If the text is empty, it's because it's on the edge of an inline
50	// node, so we render a zero-width space so that the selection can be
51	// inserted next to it still.
52	isEmptyText() {
53	return this.context.leaf.text === '';	138✔
54	}
55
56	// COMPAT: Browsers will collapse trailing new lines at the end of blocks,
57	// so we need to add an extra trailing new lines to prevent that.
58	isCompatibleString() {
59	return this.context.isLast && this.context.leaf.text.slice(-1) === '\n';	138✔
60	}
61
62	// COMPAT: Render text inside void nodes with a zero-width space.
63	// So the node can contain selection but the text is not visible.
64	isVoid() {
65	return this.viewContext.editor.isVoid(this.context.parent);	149✔
66	}
67
68	getViewType() {
69	if (this.isVoid()) {	149✔
70	return this.viewContext.templateComponent.voidStringTemplate;	1✔
71	}
72
73	if (this.isLineBreakEmptyString()) {	148✔
74	return SlateDefaultStringComponent;	10✔
75	}
76
77	if (this.isEmptyText()) {	138!
78	return this.viewContext.templateComponent.emptyTextTemplate;	×
79	}
80
81	if (this.isCompatibleString()) {	138!
82	return this.viewContext.templateComponent.compatibleStringTemplate;	×
83	}
84
85	return SlateDefaultStringComponent;	138✔
86	}
87
88	getType(): SlateStringContext['type'] {
89	if (this.isLineBreakEmptyString()) {	149✔
90	return 'lineBreakEmptyString';	11✔
91	}
92	return 'string';	138✔
93	}
94
95	getContext(): SlateStringContext {
96	const stringType = this.getType();	149✔
97	return {	149✔
98	text: this.context.leaf.text,
99	elementStringLength: Node.string(this.context.parent).length,
100	type: stringType
101	};
102	}
103
104	memoizedContext(prev: SlateStringContext, next: SlateStringContext): boolean {
105	return false;	6✔
106	}
107	}

worktile / slate-angular / 8a6baeb7-5e65-4018-8673-9ce64c1642f2

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous