ngx-editor
Version:
Rich Text Editor for angular using ProseMirror
55 lines • 8.38 kB
JavaScript
import { Component, Input } from '@angular/core';
import Icon from '../../../icons';
import { ToggleCommands } from '../MenuCommands';
import * as i0 from "@angular/core";
import * as i1 from "../../../editor.service";
import * as i2 from "../menu.service";
import * as i3 from "../../../pipes/sanitize/sanitize-html.pipe";
export class ToggleCommandComponent {
constructor(ngxeService, menuService) {
this.ngxeService = ngxeService;
this.menuService = menuService;
this.isActive = false;
this.disabled = false;
this.update = (view) => {
const { state } = view;
const command = ToggleCommands[this.name];
this.isActive = command.isActive(state);
this.disabled = !command.canExecute(state);
};
}
get name() {
return this.toolbarItem;
}
toggle(e) {
e.preventDefault();
if (e.button !== 0) {
return;
}
const { state, dispatch } = this.editorView;
const command = ToggleCommands[this.name];
command.toggle()(state, dispatch);
}
getTitle(name) {
return this.ngxeService.locals.get(name);
}
ngOnInit() {
this.html = Icon.get(this.name);
this.editorView = this.menuService.editor.view;
this.updateSubscription = this.menuService.editor.update.subscribe((view) => {
this.update(view);
});
}
ngOnDestroy() {
this.updateSubscription.unsubscribe();
}
}
ToggleCommandComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: ToggleCommandComponent, deps: [{ token: i1.NgxEditorService }, { token: i2.MenuService }], target: i0.ɵɵFactoryTarget.Component });
ToggleCommandComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.7", type: ToggleCommandComponent, selector: "ngx-toggle-command", inputs: { toolbarItem: "toolbarItem" }, ngImport: i0, template: "<div class=\"NgxEditor__MenuItem--IconContainer\" [class.NgxEditor__MenuItem--Active]=\"isActive\"\n [class.NgxEditor--Disabled]=\"disabled\" [innerHTML]=\"html | sanitizeHtml\" (mousedown)=\"toggle($event)\"\n [title]=\"getTitle(name)\">\n</div>\n", styles: [""], pipes: { "sanitizeHtml": i3.SanitizeHtmlPipe } });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: ToggleCommandComponent, decorators: [{
type: Component,
args: [{ selector: 'ngx-toggle-command', template: "<div class=\"NgxEditor__MenuItem--IconContainer\" [class.NgxEditor__MenuItem--Active]=\"isActive\"\n [class.NgxEditor--Disabled]=\"disabled\" [innerHTML]=\"html | sanitizeHtml\" (mousedown)=\"toggle($event)\"\n [title]=\"getTitle(name)\">\n</div>\n", styles: [""] }]
}], ctorParameters: function () { return [{ type: i1.NgxEditorService }, { type: i2.MenuService }]; }, propDecorators: { toolbarItem: [{
type: Input
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidG9nZ2xlLWNvbW1hbmQuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbmd4LWVkaXRvci9zcmMvbGliL21vZHVsZXMvbWVudS90b2dnbGUtY29tbWFuZC90b2dnbGUtY29tbWFuZC5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9uZ3gtZWRpdG9yL3NyYy9saWIvbW9kdWxlcy9tZW51L3RvZ2dsZS1jb21tYW5kL3RvZ2dsZS1jb21tYW5kLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFxQixNQUFNLGVBQWUsQ0FBQztBQUlwRSxPQUFPLElBQUksTUFBTSxnQkFBZ0IsQ0FBQztBQUNsQyxPQUFPLEVBQUUsY0FBYyxFQUFFLE1BQU0saUJBQWlCLENBQUM7Ozs7O0FBV2pELE1BQU0sT0FBTyxzQkFBc0I7SUFhakMsWUFDVSxXQUE2QixFQUM3QixXQUF3QjtRQUR4QixnQkFBVyxHQUFYLFdBQVcsQ0FBa0I7UUFDN0IsZ0JBQVcsR0FBWCxXQUFXLENBQWE7UUFObEMsYUFBUSxHQUFHLEtBQUssQ0FBQztRQUNqQixhQUFRLEdBQUcsS0FBSyxDQUFDO1FBb0JqQixXQUFNLEdBQUcsQ0FBQyxJQUFnQixFQUFRLEVBQUU7WUFDbEMsTUFBTSxFQUFFLEtBQUssRUFBRSxHQUFHLElBQUksQ0FBQztZQUN2QixNQUFNLE9BQU8sR0FBRyxjQUFjLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxDQUFDO1lBQzFDLElBQUksQ0FBQyxRQUFRLEdBQUcsT0FBTyxDQUFDLFFBQVEsQ0FBQyxLQUFLLENBQUMsQ0FBQztZQUN4QyxJQUFJLENBQUMsUUFBUSxHQUFHLENBQUMsT0FBTyxDQUFDLFVBQVUsQ0FBQyxLQUFLLENBQUMsQ0FBQztRQUM3QyxDQUFDLENBQUM7SUFuQkUsQ0FBQztJQWJMLElBQUksSUFBSTtRQUNOLE9BQU8sSUFBSSxDQUFDLFdBQXNCLENBQUM7SUFDckMsQ0FBQztJQWFELE1BQU0sQ0FBQyxDQUFhO1FBQ2xCLENBQUMsQ0FBQyxjQUFjLEVBQUUsQ0FBQztRQUVuQixJQUFJLENBQUMsQ0FBQyxNQUFNLEtBQUssQ0FBQyxFQUFFO1lBQ2xCLE9BQU87U0FDUjtRQUVELE1BQU0sRUFBRSxLQUFLLEVBQUUsUUFBUSxFQUFFLEdBQUcsSUFBSSxDQUFDLFVBQVUsQ0FBQztRQUM1QyxNQUFNLE9BQU8sR0FBRyxjQUFjLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxDQUFDO1FBQzFDLE9BQU8sQ0FBQyxNQUFNLEVBQUUsQ0FBQyxLQUFLLEVBQUUsUUFBUSxDQUFDLENBQUM7SUFDcEMsQ0FBQztJQVNELFFBQVEsQ0FBQyxJQUFZO1FBQ25CLE9BQU8sSUFBSSxDQUFDLFdBQVcsQ0FBQyxNQUFNLENBQUMsR0FBRyxDQUFDLElBQUksQ0FBQyxDQUFDO0lBQzNDLENBQUM7SUFFRCxRQUFRO1FBQ04sSUFBSSxDQUFDLElBQUksR0FBRyxJQUFJLENBQUMsR0FBRyxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsQ0FBQztRQUVoQyxJQUFJLENBQUMsVUFBVSxHQUFHLElBQUksQ0FBQyxXQUFXLENBQUMsTUFBTSxDQUFDLElBQUksQ0FBQztRQUUvQyxJQUFJLENBQUMsa0JBQWtCLEdBQUcsSUFBSSxDQUFDLFdBQVcsQ0FBQyxNQUFNLENBQUMsTUFBTSxDQUFDLFNBQVMsQ0FBQyxDQUFDLElBQWdCLEVBQUUsRUFBRTtZQUN0RixJQUFJLENBQUMsTUFBTSxDQUFDLElBQUksQ0FBQyxDQUFDO1FBQ3BCLENBQUMsQ0FBQyxDQUFDO0lBQ0wsQ0FBQztJQUVELFdBQVc7UUFDVCxJQUFJLENBQUMsa0JBQWtCLENBQUMsV0FBVyxFQUFFLENBQUM7SUFDeEMsQ0FBQzs7bUhBckRVLHNCQUFzQjt1R0FBdEIsc0JBQXNCLGtHQ2hCbkMsNFBBSUE7MkZEWWEsc0JBQXNCO2tCQU5sQyxTQUFTOytCQUNFLG9CQUFvQjtpSUFNckIsV0FBVztzQkFBbkIsS0FBSyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgSW5wdXQsIE9uRGVzdHJveSwgT25Jbml0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBFZGl0b3JWaWV3IH0gZnJvbSAncHJvc2VtaXJyb3Itdmlldyc7XG5pbXBvcnQgeyBTdWJzY3JpcHRpb24gfSBmcm9tICdyeGpzJztcblxuaW1wb3J0IEljb24gZnJvbSAnLi4vLi4vLi4vaWNvbnMnO1xuaW1wb3J0IHsgVG9nZ2xlQ29tbWFuZHMgfSBmcm9tICcuLi9NZW51Q29tbWFuZHMnO1xuaW1wb3J0IHsgTmd4RWRpdG9yU2VydmljZSB9IGZyb20gJy4uLy4uLy4uL2VkaXRvci5zZXJ2aWNlJztcbmltcG9ydCB7IE1lbnVTZXJ2aWNlIH0gZnJvbSAnLi4vbWVudS5zZXJ2aWNlJztcbmltcG9ydCB7IFRCSXRlbXMsIFRvb2xiYXJJdGVtIH0gZnJvbSAnLi4vLi4vLi4vdHlwZXMnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICduZ3gtdG9nZ2xlLWNvbW1hbmQnLFxuICB0ZW1wbGF0ZVVybDogJy4vdG9nZ2xlLWNvbW1hbmQuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybHM6IFsnLi90b2dnbGUtY29tbWFuZC5jb21wb25lbnQuc2NzcyddLFxufSlcblxuZXhwb3J0IGNsYXNzIFRvZ2dsZUNvbW1hbmRDb21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQsIE9uRGVzdHJveSB7XG4gIEBJbnB1dCgpIHRvb2xiYXJJdGVtOiBUb29sYmFySXRlbTtcblxuICBnZXQgbmFtZSgpOiBUQkl0ZW1zIHtcbiAgICByZXR1cm4gdGhpcy50b29sYmFySXRlbSBhcyBUQkl0ZW1zO1xuICB9XG5cbiAgaHRtbDogc3RyaW5nO1xuICBlZGl0b3JWaWV3OiBFZGl0b3JWaWV3O1xuICBpc0FjdGl2ZSA9IGZhbHNlO1xuICBkaXNhYmxlZCA9IGZhbHNlO1xuICBwcml2YXRlIHVwZGF0ZVN1YnNjcmlwdGlvbjogU3Vic2NyaXB0aW9uO1xuXG4gIGNvbnN0cnVjdG9yKFxuICAgIHByaXZhdGUgbmd4ZVNlcnZpY2U6IE5neEVkaXRvclNlcnZpY2UsXG4gICAgcHJpdmF0ZSBtZW51U2VydmljZTogTWVudVNlcnZpY2UsXG4gICkgeyB9XG5cbiAgdG9nZ2xlKGU6IE1vdXNlRXZlbnQpOiB2b2lkIHtcbiAgICBlLnByZXZlbnREZWZhdWx0KCk7XG5cbiAgICBpZiAoZS5idXR0b24gIT09IDApIHtcbiAgICAgIHJldHVybjtcbiAgICB9XG5cbiAgICBjb25zdCB7IHN0YXRlLCBkaXNwYXRjaCB9ID0gdGhpcy5lZGl0b3JWaWV3O1xuICAgIGNvbnN0IGNvbW1hbmQgPSBUb2dnbGVDb21tYW5kc1t0aGlzLm5hbWVdO1xuICAgIGNvbW1hbmQudG9nZ2xlKCkoc3RhdGUsIGRpc3BhdGNoKTtcbiAgfVxuXG4gIHVwZGF0ZSA9ICh2aWV3OiBFZGl0b3JWaWV3KTogdm9pZCA9PiB7XG4gICAgY29uc3QgeyBzdGF0ZSB9ID0gdmlldztcbiAgICBjb25zdCBjb21tYW5kID0gVG9nZ2xlQ29tbWFuZHNbdGhpcy5uYW1lXTtcbiAgICB0aGlzLmlzQWN0aXZlID0gY29tbWFuZC5pc0FjdGl2ZShzdGF0ZSk7XG4gICAgdGhpcy5kaXNhYmxlZCA9ICFjb21tYW5kLmNhbkV4ZWN1dGUoc3RhdGUpO1xuICB9O1xuXG4gIGdldFRpdGxlKG5hbWU6IHN0cmluZyk6IHN0cmluZyB7XG4gICAgcmV0dXJuIHRoaXMubmd4ZVNlcnZpY2UubG9jYWxzLmdldChuYW1lKTtcbiAgfVxuXG4gIG5nT25Jbml0KCk6IHZvaWQge1xuICAgIHRoaXMuaHRtbCA9IEljb24uZ2V0KHRoaXMubmFtZSk7XG5cbiAgICB0aGlzLmVkaXRvclZpZXcgPSB0aGlzLm1lbnVTZXJ2aWNlLmVkaXRvci52aWV3O1xuXG4gICAgdGhpcy51cGRhdGVTdWJzY3JpcHRpb24gPSB0aGlzLm1lbnVTZXJ2aWNlLmVkaXRvci51cGRhdGUuc3Vic2NyaWJlKCh2aWV3OiBFZGl0b3JWaWV3KSA9PiB7XG4gICAgICB0aGlzLnVwZGF0ZSh2aWV3KTtcbiAgICB9KTtcbiAgfVxuXG4gIG5nT25EZXN0cm95KCk6IHZvaWQge1xuICAgIHRoaXMudXBkYXRlU3Vic2NyaXB0aW9uLnVuc3Vic2NyaWJlKCk7XG4gIH1cbn1cbiIsIjxkaXYgY2xhc3M9XCJOZ3hFZGl0b3JfX01lbnVJdGVtLS1JY29uQ29udGFpbmVyXCIgW2NsYXNzLk5neEVkaXRvcl9fTWVudUl0ZW0tLUFjdGl2ZV09XCJpc0FjdGl2ZVwiXG4gIFtjbGFzcy5OZ3hFZGl0b3ItLURpc2FibGVkXT1cImRpc2FibGVkXCIgW2lubmVySFRNTF09XCJodG1sIHwgc2FuaXRpemVIdG1sXCIgKG1vdXNlZG93bik9XCJ0b2dnbGUoJGV2ZW50KVwiXG4gIFt0aXRsZV09XCJnZXRUaXRsZShuYW1lKVwiPlxuPC9kaXY+XG4iXX0=