slate-angular 1.7.1 → 1.7.3

package/bundles/slate-angular.umd.js

@@ -2177,6 +2177,38 @@
             }
             this.cdr.markForCheck();
         };
+        BaseLeafComponent.prototype.renderPlaceholder = function () {
+            var _a, _b, _c;
+            // issue-1: IME input was interrupted
+            // issue-2: IME input focus jumping
+            // Issue occurs when the placeholder node is removed (in leaf span)
+            // So add a placeholder span to the block element root node
+            if (this.context.leaf['placeholder']) {
+                if (!this.placeholderElement) {
+                    this.placeholderElement = document.createElement('span');
+                    this.placeholderElement.innerText = this.context.leaf['placeholder'];
+                    this.placeholderElement.contentEditable = 'false';
+                    this.placeholderElement.setAttribute('data-slate-placeholder', 'true');
+                    (_a = this.nativeElement.closest('[data-slate-node="element"]')) === null || _a === void 0 ? void 0 : _a.classList.add('element-placeholder');
+                    (_b = this.nativeElement.closest('[data-slate-node="element"]')) === null || _b === void 0 ? void 0 : _b.appendChild(this.placeholderElement);
+                }
+            }
+            else {
+                if (this.placeholderElement) {
+                    this.placeholderElement.remove();
+                    this.placeholderElement = null;
+                    (_c = this.nativeElement.closest('[data-slate-node="element"]')) === null || _c === void 0 ? void 0 : _c.classList.remove('element-placeholder');
+                }
+            }
+        };
+        BaseLeafComponent.prototype.destroyPlaceholder = function () {
+            var _a, _b;
+            if (this.placeholderElement) {
+                this.placeholderElement.remove();
+                this.placeholderElement = null;
+                (_b = (_a = this.nativeElement) === null || _a === void 0 ? void 0 : _a.closest('[data-slate-node="element"]')) === null || _b === void 0 ? void 0 : _b.classList.remove('element-placeholder');
+            }
+        };
         return BaseLeafComponent;
     }(BaseComponent));
     BaseLeafComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.7", ngImport: i0__namespace, type: BaseLeafComponent, deps: null, target: i0__namespace.ɵɵFactoryTarget.Directive });
@@ -2503,15 +2535,23 @@
         function SlateDefaultLeafComponent() {
             return _super !== null && _super.apply(this, arguments) || this;
         }
+        SlateDefaultLeafComponent.prototype.onContextChange = function () {
+            _super.prototype.onContextChange.call(this);
+            this.renderPlaceholder();
+        };
+        SlateDefaultLeafComponent.prototype.ngOnDestroy = function () {
+            // Because the placeholder span is not in the current component, it is destroyed along with the current component
+            this.destroyPlaceholder();
+        };
         return SlateDefaultLeafComponent;
     }(BaseLeafComponent));
     SlateDefaultLeafComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.7", ngImport: i0__namespace, type: SlateDefaultLeafComponent, deps: null, target: i0__namespace.ɵɵFactoryTarget.Component });
-    SlateDefaultLeafComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.7", type: SlateDefaultLeafComponent, selector: "span[slateDefaultLeaf]", host: { attributes: { "data-slate-leaf": "true" } }, usesInheritance: true, ngImport: i0__namespace, template: "\n        <ng-container *ngIf=\"context.leaf['placeholder']\">\n            <span contenteditable=\"false\" data-slate-placeholder=\"true\" slate-placeholder=\"true\">{{context.leaf['placeholder']}}</span>\n        </ng-container>\n        <span slateString [context]=\"context\" [viewContext]=\"viewContext\"><span>", isInline: true, components: [{ type: SlateStringComponent, selector: "span[slateString]", inputs: ["context"] }], directives: [{ type: i2__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
+    SlateDefaultLeafComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.7", type: SlateDefaultLeafComponent, selector: "span[slateDefaultLeaf]", host: { attributes: { "data-slate-leaf": "true" } }, usesInheritance: true, ngImport: i0__namespace, template: "<span slateString [context]=\"context\" [viewContext]=\"viewContext\"><span>", isInline: true, components: [{ type: SlateStringComponent, selector: "span[slateString]", inputs: ["context"] }], changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.7", ngImport: i0__namespace, type: SlateDefaultLeafComponent, decorators: [{
                 type: i0.Component,
                 args: [{
                         selector: 'span[slateDefaultLeaf]',
-                        template: "\n        <ng-container *ngIf=\"context.leaf['placeholder']\">\n            <span contenteditable=\"false\" data-slate-placeholder=\"true\" slate-placeholder=\"true\">{{context.leaf['placeholder']}}</span>\n        </ng-container>\n        <span slateString [context]=\"context\" [viewContext]=\"viewContext\"><span>",
+                        template: "<span slateString [context]=\"context\" [viewContext]=\"viewContext\"><span>",
                         changeDetection: i0.ChangeDetectionStrategy.OnPush,
                         host: {
                             'data-slate-leaf': 'true'