mat-contenteditable
Version:
Angular contenteditable directive for Angular forms and Material Design
72 lines • 8.18 kB
JavaScript
import { __decorate, __extends, __metadata } from "tslib";
import { Directive, Input } from '@angular/core';
import { MatFormFieldControl } from '@angular/material/form-field';
import { MatCkeditorDirective } from './mat-ckeditor.directive';
var MatCkeditorBalloonDirective = /** @class */ (function (_super) {
__extends(MatCkeditorBalloonDirective, _super);
function MatCkeditorBalloonDirective() {
return _super !== null && _super.apply(this, arguments) || this;
}
MatCkeditorBalloonDirective_1 = MatCkeditorBalloonDirective;
Object.defineProperty(MatCkeditorBalloonDirective.prototype, "toolbar", {
set: function (show) {
if (this.editor && show !== this.toolbarOpen) {
var balloon = this.editor.editorInstance.plugins.get('BalloonToolbar');
if (show) {
this.showToolbar(balloon);
}
else {
balloon.hide();
this.toolbarOpen = false;
}
}
},
enumerable: true,
configurable: true
});
MatCkeditorBalloonDirective.prototype.ngOnInit = function () {
var _this = this;
_super.prototype.ngOnInit.call(this);
this.editor.ready.subscribe(function (editor) {
var balloon = editor.plugins.get('BalloonToolbar');
balloon.stopListening(editor.model.document.selection, 'change:range');
balloon.stopListening(balloon, '_selectionChangeDebounced');
});
this.editor.focus.subscribe(function () {
if (_this.toolbarOpen) {
var balloon = _this.editor.editorInstance.plugins.get('BalloonToolbar');
_this.showToolbar(balloon);
}
});
};
MatCkeditorBalloonDirective.prototype.showToolbar = function (balloon) {
if (!balloon._balloon.hasView(balloon.toolbarView)) {
balloon.listenTo(this.editor.editorInstance.ui, 'update', function () {
balloon._balloon.updatePosition(balloon._getBalloonPositionData());
});
balloon._balloon.add({
view: balloon.toolbarView,
position: balloon._getBalloonPositionData(),
balloonClassName: 'ck-toolbar-container'
});
this.toolbarOpen = true;
}
};
var MatCkeditorBalloonDirective_1;
__decorate([
Input(),
__metadata("design:type", Boolean),
__metadata("design:paramtypes", [Boolean])
], MatCkeditorBalloonDirective.prototype, "toolbar", null);
MatCkeditorBalloonDirective = MatCkeditorBalloonDirective_1 = __decorate([
Directive({
selector: '[matCkeditorBalloon]',
providers: [
{ provide: MatFormFieldControl, useExisting: MatCkeditorBalloonDirective_1 },
]
})
], MatCkeditorBalloonDirective);
return MatCkeditorBalloonDirective;
}(MatCkeditorDirective));
export { MatCkeditorBalloonDirective };
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibWF0LWNrZWRpdG9yLWJhbGxvb24uZGlyZWN0aXZlLmpzIiwic291cmNlUm9vdCI6Im5nOi8vbWF0LWNvbnRlbnRlZGl0YWJsZS8iLCJzb3VyY2VzIjpbImxpYi9tYXQtY2tlZGl0b3ItYmFsbG9vbi5kaXJlY3RpdmUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IjtBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQ2pELE9BQU8sRUFBRSxtQkFBbUIsRUFBRSxNQUFNLDhCQUE4QixDQUFDO0FBRW5FLE9BQU8sRUFBRSxvQkFBb0IsRUFBRSxNQUFNLDBCQUEwQixDQUFDO0FBUWhFO0lBQWlELCtDQUFvQjtJQUFyRTs7SUE2Q0EsQ0FBQztvQ0E3Q1ksMkJBQTJCO0lBR3RDLHNCQUFJLGdEQUFPO2FBQVgsVUFBWSxJQUFhO1lBQ3ZCLElBQUksSUFBSSxDQUFDLE1BQU0sSUFBSSxJQUFJLEtBQUssSUFBSSxDQUFDLFdBQVcsRUFBRTtnQkFDNUMsSUFBTSxPQUFPLEdBQUcsSUFBSSxDQUFDLE1BQU0sQ0FBQyxjQUFjLENBQUMsT0FBTyxDQUFDLEdBQUcsQ0FBQyxnQkFBZ0IsQ0FBQyxDQUFDO2dCQUN6RSxJQUFJLElBQUksRUFBRTtvQkFDUixJQUFJLENBQUMsV0FBVyxDQUFDLE9BQU8sQ0FBQyxDQUFDO2lCQUMzQjtxQkFBTTtvQkFDTCxPQUFPLENBQUMsSUFBSSxFQUFFLENBQUM7b0JBQ2YsSUFBSSxDQUFDLFdBQVcsR0FBRyxLQUFLLENBQUM7aUJBQzFCO2FBQ0Y7UUFDSCxDQUFDOzs7T0FBQTtJQUdELDhDQUFRLEdBQVI7UUFBQSxpQkFhQztRQVpDLGlCQUFNLFFBQVEsV0FBRSxDQUFDO1FBQ2pCLElBQUksQ0FBQyxNQUFNLENBQUMsS0FBSyxDQUFDLFNBQVMsQ0FBQyxVQUFBLE1BQU07WUFDaEMsSUFBTSxPQUFPLEdBQUcsTUFBTSxDQUFDLE9BQU8sQ0FBQyxHQUFHLENBQUMsZ0JBQWdCLENBQUMsQ0FBQztZQUNyRCxPQUFPLENBQUMsYUFBYSxDQUFDLE1BQU0sQ0FBQyxLQUFLLENBQUMsUUFBUSxDQUFDLFNBQVMsRUFBRSxjQUFjLENBQUMsQ0FBQztZQUN2RSxPQUFPLENBQUMsYUFBYSxDQUFDLE9BQU8sRUFBRSwyQkFBMkIsQ0FBQyxDQUFDO1FBQzlELENBQUMsQ0FBQyxDQUFDO1FBQ0gsSUFBSSxDQUFDLE1BQU0sQ0FBQyxLQUFLLENBQUMsU0FBUyxDQUFDO1lBQzFCLElBQUksS0FBSSxDQUFDLFdBQVcsRUFBRTtnQkFDcEIsSUFBTSxPQUFPLEdBQUcsS0FBSSxDQUFDLE1BQU0sQ0FBQyxjQUFjLENBQUMsT0FBTyxDQUFDLEdBQUcsQ0FBQyxnQkFBZ0IsQ0FBQyxDQUFDO2dCQUN6RSxLQUFJLENBQUMsV0FBVyxDQUFDLE9BQU8sQ0FBQyxDQUFDO2FBQzNCO1FBQ0gsQ0FBQyxDQUFDLENBQUM7SUFDTCxDQUFDO0lBRU8saURBQVcsR0FBbkIsVUFBb0IsT0FBTztRQUN6QixJQUFJLENBQUMsT0FBTyxDQUFDLFFBQVEsQ0FBQyxPQUFPLENBQUMsT0FBTyxDQUFDLFdBQVcsQ0FBQyxFQUFFO1lBQ2xELE9BQU8sQ0FBQyxRQUFRLENBQUMsSUFBSSxDQUFDLE1BQU0sQ0FBQyxjQUFjLENBQUMsRUFBRSxFQUFFLFFBQVEsRUFBRTtnQkFDeEQsT0FBTyxDQUFDLFFBQVEsQ0FBQyxjQUFjLENBQUMsT0FBTyxDQUFDLHVCQUF1QixFQUFFLENBQUMsQ0FBQztZQUNyRSxDQUFDLENBQUMsQ0FBQztZQUNILE9BQU8sQ0FBQyxRQUFRLENBQUMsR0FBRyxDQUFDO2dCQUNuQixJQUFJLEVBQUUsT0FBTyxDQUFDLFdBQVc7Z0JBQ3pCLFFBQVEsRUFBRSxPQUFPLENBQUMsdUJBQXVCLEVBQUU7Z0JBQzNDLGdCQUFnQixFQUFFLHNCQUFzQjthQUN6QyxDQUFDLENBQUM7WUFDSCxJQUFJLENBQUMsV0FBVyxHQUFHLElBQUksQ0FBQztTQUN6QjtJQUNILENBQUM7O0lBeENEO1FBREMsS0FBSyxFQUFFOzs7OERBV1A7SUFiVSwyQkFBMkI7UUFOdkMsU0FBUyxDQUFDO1lBQ1QsUUFBUSxFQUFFLHNCQUFzQjtZQUNoQyxTQUFTLEVBQUU7Z0JBQ1QsRUFBRSxPQUFPLEVBQUUsbUJBQW1CLEVBQUUsV0FBVyxFQUFFLDZCQUEyQixFQUFFO2FBQzNFO1NBQ0YsQ0FBQztPQUNXLDJCQUEyQixDQTZDdkM7SUFBRCxrQ0FBQztDQUFBLEFBN0NELENBQWlELG9CQUFvQixHQTZDcEU7U0E3Q1ksMkJBQTJCIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgRGlyZWN0aXZlLCBJbnB1dCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgTWF0Rm9ybUZpZWxkQ29udHJvbCB9IGZyb20gJ0Bhbmd1bGFyL21hdGVyaWFsL2Zvcm0tZmllbGQnO1xuXG5pbXBvcnQgeyBNYXRDa2VkaXRvckRpcmVjdGl2ZSB9IGZyb20gJy4vbWF0LWNrZWRpdG9yLmRpcmVjdGl2ZSc7XG5cbkBEaXJlY3RpdmUoe1xuICBzZWxlY3RvcjogJ1ttYXRDa2VkaXRvckJhbGxvb25dJyxcbiAgcHJvdmlkZXJzOiBbXG4gICAgeyBwcm92aWRlOiBNYXRGb3JtRmllbGRDb250cm9sLCB1c2VFeGlzdGluZzogTWF0Q2tlZGl0b3JCYWxsb29uRGlyZWN0aXZlIH0sXG4gIF1cbn0pXG5leHBvcnQgY2xhc3MgTWF0Q2tlZGl0b3JCYWxsb29uRGlyZWN0aXZlIGV4dGVuZHMgTWF0Q2tlZGl0b3JEaXJlY3RpdmUge1xuXG4gIEBJbnB1dCgpXG4gIHNldCB0b29sYmFyKHNob3c6IGJvb2xlYW4pIHtcbiAgICBpZiAodGhpcy5lZGl0b3IgJiYgc2hvdyAhPT0gdGhpcy50b29sYmFyT3Blbikge1xuICAgICAgY29uc3QgYmFsbG9vbiA9IHRoaXMuZWRpdG9yLmVkaXRvckluc3RhbmNlLnBsdWdpbnMuZ2V0KCdCYWxsb29uVG9vbGJhcicpO1xuICAgICAgaWYgKHNob3cpIHtcbiAgICAgICAgdGhpcy5zaG93VG9vbGJhcihiYWxsb29uKTtcbiAgICAgIH0gZWxzZSB7XG4gICAgICAgIGJhbGxvb24uaGlkZSgpO1xuICAgICAgICB0aGlzLnRvb2xiYXJPcGVuID0gZmFsc2U7XG4gICAgICB9XG4gICAgfVxuICB9XG4gIHByaXZhdGUgdG9vbGJhck9wZW46IGJvb2xlYW47XG5cbiAgbmdPbkluaXQoKSB7XG4gICAgc3VwZXIubmdPbkluaXQoKTtcbiAgICB0aGlzLmVkaXRvci5yZWFkeS5zdWJzY3JpYmUoZWRpdG9yID0+IHtcbiAgICAgIGNvbnN0IGJhbGxvb24gPSBlZGl0b3IucGx1Z2lucy5nZXQoJ0JhbGxvb25Ub29sYmFyJyk7XG4gICAgICBiYWxsb29uLnN0b3BMaXN0ZW5pbmcoZWRpdG9yLm1vZGVsLmRvY3VtZW50LnNlbGVjdGlvbiwgJ2NoYW5nZTpyYW5nZScpO1xuICAgICAgYmFsbG9vbi5zdG9wTGlzdGVuaW5nKGJhbGxvb24sICdfc2VsZWN0aW9uQ2hhbmdlRGVib3VuY2VkJyk7XG4gICAgfSk7XG4gICAgdGhpcy5lZGl0b3IuZm9jdXMuc3Vic2NyaWJlKCgpID0+IHtcbiAgICAgIGlmICh0aGlzLnRvb2xiYXJPcGVuKSB7XG4gICAgICAgIGNvbnN0IGJhbGxvb24gPSB0aGlzLmVkaXRvci5lZGl0b3JJbnN0YW5jZS5wbHVnaW5zLmdldCgnQmFsbG9vblRvb2xiYXInKTtcbiAgICAgICAgdGhpcy5zaG93VG9vbGJhcihiYWxsb29uKTtcbiAgICAgIH1cbiAgICB9KTtcbiAgfVxuXG4gIHByaXZhdGUgc2hvd1Rvb2xiYXIoYmFsbG9vbikge1xuICAgIGlmICghYmFsbG9vbi5fYmFsbG9vbi5oYXNWaWV3KGJhbGxvb24udG9vbGJhclZpZXcpKSB7XG4gICAgICBiYWxsb29uLmxpc3RlblRvKHRoaXMuZWRpdG9yLmVkaXRvckluc3RhbmNlLnVpLCAndXBkYXRlJywgKCkgPT4ge1xuICAgICAgICBiYWxsb29uLl9iYWxsb29uLnVwZGF0ZVBvc2l0aW9uKGJhbGxvb24uX2dldEJhbGxvb25Qb3NpdGlvbkRhdGEoKSk7XG4gICAgICB9KTtcbiAgICAgIGJhbGxvb24uX2JhbGxvb24uYWRkKHtcbiAgICAgICAgdmlldzogYmFsbG9vbi50b29sYmFyVmlldyxcbiAgICAgICAgcG9zaXRpb246IGJhbGxvb24uX2dldEJhbGxvb25Qb3NpdGlvbkRhdGEoKSxcbiAgICAgICAgYmFsbG9vbkNsYXNzTmFtZTogJ2NrLXRvb2xiYXItY29udGFpbmVyJ1xuICAgICAgfSk7XG4gICAgICB0aGlzLnRvb2xiYXJPcGVuID0gdHJ1ZTtcbiAgICB9XG4gIH1cblxufVxuIl19