ngx-tiptap-editor
Version:
[](https://github.com/HuiiBuh/ngx-tiptap-editor/actions/workflows/publish.yml) [![Deploy to Github Pages](https://github.com/HuiiBuh/ngx-tiptap-edito
100 lines • 13.3 kB
JavaScript
import { ChangeDetectionStrategy, Component, forwardRef, Input } from '@angular/core';
import { BaseControl, SelectBaseControl } from './base-control';
import * as i0 from "@angular/core";
import * as i1 from "../../services/tiptap-event.service";
import * as i2 from "../select/select.component";
import * as i3 from "@angular/common";
export class ControlTextAlignComponent extends SelectBaseControl {
constructor(eventService) {
super();
this.eventService = eventService;
this.disableSanitation = false;
this.canStyleParams = ['left', 'right', 'center', 'justify'];
}
setAlign(alignment) {
this.editor && this.editor.chain().focus().setTextAlign(alignment).run();
}
canStyle(alignment) {
if (!this.editor)
return false;
return this.editor.can().setTextAlign(alignment);
}
currentActive() {
if (this.editor) {
if (this.editor.isActive({ textAlign: 'left' }))
return 'left';
if (this.editor.isActive({ textAlign: 'right' }))
return 'right';
if (this.editor.isActive({ textAlign: 'center' }))
return 'center';
if (this.editor.isActive({ textAlign: 'justify' }))
return 'justify';
}
return null;
}
}
ControlTextAlignComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: ControlTextAlignComponent, deps: [{ token: i1.TiptapEventService }], target: i0.ɵɵFactoryTarget.Component });
ControlTextAlignComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.1", type: ControlTextAlignComponent, selector: "tip-control-text-align", inputs: { disableSanitation: "disableSanitation" }, providers: [{ provide: BaseControl, useExisting: forwardRef(() => ControlTextAlignComponent) }], usesInheritance: true, ngImport: i0, template: `
<tip-select defaultValue="left" width="auto" [showIcon]="false"
(change)="setAlign($event)" [disablePreviewSanitation]="disableSanitation">
<tip-option value="left" [useHtml]="true" [enforceHeight]="true">
<div class="content-wrapper" #left>
<ng-content select="[data-left]"></ng-content>
</div>
<i *ngIf="left.childNodes.length === 0" class="material-icons">format_align_left</i>
</tip-option>
<tip-option value="right" [useHtml]="true" [enforceHeight]="true">
<div class="content-wrapper" #right>
<ng-content select="[data-right]"></ng-content>
</div>
<i *ngIf="right.childNodes.length === 0" class="material-icons">format_align_right</i>
</tip-option>
<tip-option value="center" [useHtml]="true" [enforceHeight]="true">
<div class="content-wrapper" #center>
<ng-content select="[data-center]"></ng-content>
</div>
<i *ngIf="center.childNodes.length === 0" class="material-icons">format_align_center</i>
</tip-option>
<tip-option value="justify" [useHtml]="true" [enforceHeight]="true">
<div class="content-wrapper" #justify>
<ng-content select="[data-justify]"></ng-content>
</div>
<i *ngIf="justify.childNodes.length === 0" class="material-icons">format_align_justify</i>
</tip-option>
</tip-select>
`, isInline: true, styles: [":host-context{display:contents}.tip-control-button{display:inline-flex;align-items:center;justify-content:center;padding:1px calc(var(--tip-header-padding) / 2);cursor:pointer;color:var(--tip-text-color);border:none;background-color:transparent;-webkit-tap-highlight-color:transparent}@media (pointer: fine){.tip-control-button:hover,.tip-control-button:focus{color:var(--tip-active-color)}}.tip-control-button[disabled]{cursor:default;color:var(--tip-disabled-color)}.content-wrapper{display:contents}.tip-active{color:var(--tip-active-color)}\n"], components: [{ type: i2.SelectComponent, selector: "tip-select", inputs: ["width", "placeholder", "defaultValue", "showIcon", "disablePreviewSanitation", "value"], outputs: ["change"] }, { type: i2.OptionComponent, selector: "tip-option[value]", inputs: ["value", "enforceHeight", "useHtml", "disabled"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: ControlTextAlignComponent, decorators: [{
type: Component,
args: [{ selector: 'tip-control-text-align', template: `
<tip-select defaultValue="left" width="auto" [showIcon]="false"
(change)="setAlign($event)" [disablePreviewSanitation]="disableSanitation">
<tip-option value="left" [useHtml]="true" [enforceHeight]="true">
<div class="content-wrapper" #left>
<ng-content select="[data-left]"></ng-content>
</div>
<i *ngIf="left.childNodes.length === 0" class="material-icons">format_align_left</i>
</tip-option>
<tip-option value="right" [useHtml]="true" [enforceHeight]="true">
<div class="content-wrapper" #right>
<ng-content select="[data-right]"></ng-content>
</div>
<i *ngIf="right.childNodes.length === 0" class="material-icons">format_align_right</i>
</tip-option>
<tip-option value="center" [useHtml]="true" [enforceHeight]="true">
<div class="content-wrapper" #center>
<ng-content select="[data-center]"></ng-content>
</div>
<i *ngIf="center.childNodes.length === 0" class="material-icons">format_align_center</i>
</tip-option>
<tip-option value="justify" [useHtml]="true" [enforceHeight]="true">
<div class="content-wrapper" #justify>
<ng-content select="[data-justify]"></ng-content>
</div>
<i *ngIf="justify.childNodes.length === 0" class="material-icons">format_align_justify</i>
</tip-option>
</tip-select>
`, changeDetection: ChangeDetectionStrategy.OnPush, providers: [{ provide: BaseControl, useExisting: forwardRef(() => ControlTextAlignComponent) }], styles: [":host-context{display:contents}.tip-control-button{display:inline-flex;align-items:center;justify-content:center;padding:1px calc(var(--tip-header-padding) / 2);cursor:pointer;color:var(--tip-text-color);border:none;background-color:transparent;-webkit-tap-highlight-color:transparent}@media (pointer: fine){.tip-control-button:hover,.tip-control-button:focus{color:var(--tip-active-color)}}.tip-control-button[disabled]{cursor:default;color:var(--tip-disabled-color)}.content-wrapper{display:contents}.tip-active{color:var(--tip-active-color)}\n"] }]
}], ctorParameters: function () { return [{ type: i1.TiptapEventService }]; }, propDecorators: { disableSanitation: [{
type: Input
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY29udHJvbC10ZXh0LWFsaWduLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL25neC10aXB0YXAtZWRpdG9yL3NyYy9saWIvY29tcG9uZW50cy9jb250cm9scy9jb250cm9sLXRleHQtYWxpZ24uY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSx1QkFBdUIsRUFBRSxTQUFTLEVBQUUsVUFBVSxFQUFFLEtBQUssRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUV0RixPQUFPLEVBQUUsV0FBVyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sZ0JBQWdCLENBQUM7Ozs7O0FBcUNoRSxNQUFNLE9BQU8seUJBQTBCLFNBQVEsaUJBQWlCO0lBSzlELFlBQ1ksWUFBZ0M7UUFFMUMsS0FBSyxFQUFFLENBQUM7UUFGRSxpQkFBWSxHQUFaLFlBQVksQ0FBb0I7UUFMNUIsc0JBQWlCLEdBQUcsS0FBSyxDQUFDO1FBRWhDLG1CQUFjLEdBQUcsQ0FBQyxNQUFNLEVBQUUsT0FBTyxFQUFFLFFBQVEsRUFBRSxTQUFTLENBQUMsQ0FBQztJQU1sRSxDQUFDO0lBRU0sUUFBUSxDQUFDLFNBQWtEO1FBQ2hFLElBQUksQ0FBQyxNQUFNLElBQUksSUFBSSxDQUFDLE1BQU0sQ0FBQyxLQUFLLEVBQUUsQ0FBQyxLQUFLLEVBQUUsQ0FBQyxZQUFZLENBQUMsU0FBUyxDQUFDLENBQUMsR0FBRyxFQUFFLENBQUM7SUFDM0UsQ0FBQztJQUVTLFFBQVEsQ0FBQyxTQUFrRDtRQUNuRSxJQUFJLENBQUMsSUFBSSxDQUFDLE1BQU07WUFBRSxPQUFPLEtBQUssQ0FBQztRQUMvQixPQUFPLElBQUksQ0FBQyxNQUFNLENBQUMsR0FBRyxFQUFFLENBQUMsWUFBWSxDQUFDLFNBQVMsQ0FBQyxDQUFDO0lBQ25ELENBQUM7SUFFUyxhQUFhO1FBQ3JCLElBQUksSUFBSSxDQUFDLE1BQU0sRUFBRTtZQUNmLElBQUksSUFBSSxDQUFDLE1BQU0sQ0FBQyxRQUFRLENBQUMsRUFBQyxTQUFTLEVBQUUsTUFBTSxFQUFDLENBQUM7Z0JBQUUsT0FBTyxNQUFNLENBQUM7WUFDN0QsSUFBSSxJQUFJLENBQUMsTUFBTSxDQUFDLFFBQVEsQ0FBQyxFQUFDLFNBQVMsRUFBRSxPQUFPLEVBQUMsQ0FBQztnQkFBRSxPQUFPLE9BQU8sQ0FBQztZQUMvRCxJQUFJLElBQUksQ0FBQyxNQUFNLENBQUMsUUFBUSxDQUFDLEVBQUMsU0FBUyxFQUFFLFFBQVEsRUFBQyxDQUFDO2dCQUFFLE9BQU8sUUFBUSxDQUFDO1lBQ2pFLElBQUksSUFBSSxDQUFDLE1BQU0sQ0FBQyxRQUFRLENBQUMsRUFBQyxTQUFTLEVBQUUsU0FBUyxFQUFDLENBQUM7Z0JBQUUsT0FBTyxTQUFTLENBQUM7U0FDcEU7UUFDRCxPQUFPLElBQUksQ0FBQztJQUNkLENBQUM7O3NIQTVCVSx5QkFBeUI7MEdBQXpCLHlCQUF5QixxR0FGekIsQ0FBQyxFQUFDLE9BQU8sRUFBRSxXQUFXLEVBQUUsV0FBVyxFQUFFLFVBQVUsQ0FBQyxHQUFHLEVBQUUsQ0FBQyx5QkFBeUIsQ0FBQyxFQUFDLENBQUMsaURBOUJuRjs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7OztHQTRCVDsyRkFJVSx5QkFBeUI7a0JBbkNyQyxTQUFTOytCQUNFLHdCQUF3QixZQUV4Qjs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7OztHQTRCVCxtQkFDZ0IsdUJBQXVCLENBQUMsTUFBTSxhQUNwQyxDQUFDLEVBQUMsT0FBTyxFQUFFLFdBQVcsRUFBRSxXQUFXLEVBQUUsVUFBVSxDQUFDLEdBQUcsRUFBRSwwQkFBMEIsQ0FBQyxFQUFDLENBQUM7eUdBRzdFLGlCQUFpQjtzQkFBaEMsS0FBSyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENoYW5nZURldGVjdGlvblN0cmF0ZWd5LCBDb21wb25lbnQsIGZvcndhcmRSZWYsIElucHV0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBUaXB0YXBFdmVudFNlcnZpY2UgfSBmcm9tICcuLi8uLi9zZXJ2aWNlcy90aXB0YXAtZXZlbnQuc2VydmljZSc7XG5pbXBvcnQgeyBCYXNlQ29udHJvbCwgU2VsZWN0QmFzZUNvbnRyb2wgfSBmcm9tICcuL2Jhc2UtY29udHJvbCc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ3RpcC1jb250cm9sLXRleHQtYWxpZ24nLFxuICBzdHlsZVVybHM6IFsnLi4vLi4vLi4vLi4vX2NvbnRyb2xzLnNjc3MnXSxcbiAgdGVtcGxhdGU6IGBcbiAgICA8dGlwLXNlbGVjdCBkZWZhdWx0VmFsdWU9XCJsZWZ0XCIgd2lkdGg9XCJhdXRvXCIgW3Nob3dJY29uXT1cImZhbHNlXCJcbiAgICAgICAgICAgICAgICAoY2hhbmdlKT1cInNldEFsaWduKCRldmVudClcIiBbZGlzYWJsZVByZXZpZXdTYW5pdGF0aW9uXT1cImRpc2FibGVTYW5pdGF0aW9uXCI+XG4gICAgICA8dGlwLW9wdGlvbiB2YWx1ZT1cImxlZnRcIiBbdXNlSHRtbF09XCJ0cnVlXCIgW2VuZm9yY2VIZWlnaHRdPVwidHJ1ZVwiPlxuICAgICAgICA8ZGl2IGNsYXNzPVwiY29udGVudC13cmFwcGVyXCIgI2xlZnQ+XG4gICAgICAgICAgPG5nLWNvbnRlbnQgc2VsZWN0PVwiW2RhdGEtbGVmdF1cIj48L25nLWNvbnRlbnQ+XG4gICAgICAgIDwvZGl2PlxuICAgICAgICA8aSAqbmdJZj1cImxlZnQuY2hpbGROb2Rlcy5sZW5ndGggPT09IDBcIiBjbGFzcz1cIm1hdGVyaWFsLWljb25zXCI+Zm9ybWF0X2FsaWduX2xlZnQ8L2k+XG4gICAgICA8L3RpcC1vcHRpb24+XG4gICAgICA8dGlwLW9wdGlvbiB2YWx1ZT1cInJpZ2h0XCIgW3VzZUh0bWxdPVwidHJ1ZVwiIFtlbmZvcmNlSGVpZ2h0XT1cInRydWVcIj5cbiAgICAgICAgPGRpdiBjbGFzcz1cImNvbnRlbnQtd3JhcHBlclwiICNyaWdodD5cbiAgICAgICAgICA8bmctY29udGVudCBzZWxlY3Q9XCJbZGF0YS1yaWdodF1cIj48L25nLWNvbnRlbnQ+XG4gICAgICAgIDwvZGl2PlxuICAgICAgICA8aSAqbmdJZj1cInJpZ2h0LmNoaWxkTm9kZXMubGVuZ3RoID09PSAwXCIgY2xhc3M9XCJtYXRlcmlhbC1pY29uc1wiPmZvcm1hdF9hbGlnbl9yaWdodDwvaT5cbiAgICAgIDwvdGlwLW9wdGlvbj5cbiAgICAgIDx0aXAtb3B0aW9uIHZhbHVlPVwiY2VudGVyXCIgW3VzZUh0bWxdPVwidHJ1ZVwiIFtlbmZvcmNlSGVpZ2h0XT1cInRydWVcIj5cbiAgICAgICAgPGRpdiBjbGFzcz1cImNvbnRlbnQtd3JhcHBlclwiICNjZW50ZXI+XG4gICAgICAgICAgPG5nLWNvbnRlbnQgc2VsZWN0PVwiW2RhdGEtY2VudGVyXVwiPjwvbmctY29udGVudD5cbiAgICAgICAgPC9kaXY+XG4gICAgICAgIDxpICpuZ0lmPVwiY2VudGVyLmNoaWxkTm9kZXMubGVuZ3RoID09PSAwXCIgY2xhc3M9XCJtYXRlcmlhbC1pY29uc1wiPmZvcm1hdF9hbGlnbl9jZW50ZXI8L2k+XG4gICAgICA8L3RpcC1vcHRpb24+XG4gICAgICA8dGlwLW9wdGlvbiB2YWx1ZT1cImp1c3RpZnlcIiBbdXNlSHRtbF09XCJ0cnVlXCIgW2VuZm9yY2VIZWlnaHRdPVwidHJ1ZVwiPlxuICAgICAgICA8ZGl2IGNsYXNzPVwiY29udGVudC13cmFwcGVyXCIgI2p1c3RpZnk+XG4gICAgICAgICAgPG5nLWNvbnRlbnQgc2VsZWN0PVwiW2RhdGEtanVzdGlmeV1cIj48L25nLWNvbnRlbnQ+XG4gICAgICAgIDwvZGl2PlxuICAgICAgICA8aSAqbmdJZj1cImp1c3RpZnkuY2hpbGROb2Rlcy5sZW5ndGggPT09IDBcIiBjbGFzcz1cIm1hdGVyaWFsLWljb25zXCI+Zm9ybWF0X2FsaWduX2p1c3RpZnk8L2k+XG4gICAgICA8L3RpcC1vcHRpb24+XG4gICAgPC90aXAtc2VsZWN0PlxuICBgLFxuICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaCxcbiAgcHJvdmlkZXJzOiBbe3Byb3ZpZGU6IEJhc2VDb250cm9sLCB1c2VFeGlzdGluZzogZm9yd2FyZFJlZigoKSA9PiBDb250cm9sVGV4dEFsaWduQ29tcG9uZW50KX1dLFxufSlcbmV4cG9ydCBjbGFzcyBDb250cm9sVGV4dEFsaWduQ29tcG9uZW50IGV4dGVuZHMgU2VsZWN0QmFzZUNvbnRyb2wge1xuICBASW5wdXQoKSBwdWJsaWMgZGlzYWJsZVNhbml0YXRpb24gPSBmYWxzZTtcblxuICBwcm90ZWN0ZWQgY2FuU3R5bGVQYXJhbXMgPSBbJ2xlZnQnLCAncmlnaHQnLCAnY2VudGVyJywgJ2p1c3RpZnknXTtcblxuICBjb25zdHJ1Y3RvcihcbiAgICBwcm90ZWN0ZWQgZXZlbnRTZXJ2aWNlOiBUaXB0YXBFdmVudFNlcnZpY2VcbiAgKSB7XG4gICAgc3VwZXIoKTtcbiAgfVxuXG4gIHB1YmxpYyBzZXRBbGlnbihhbGlnbm1lbnQ6ICdqdXN0aWZ5JyB8ICdsZWZ0JyB8ICdjZW50ZXInIHwgJ3JpZ2h0Jyk6IHZvaWQge1xuICAgIHRoaXMuZWRpdG9yICYmIHRoaXMuZWRpdG9yLmNoYWluKCkuZm9jdXMoKS5zZXRUZXh0QWxpZ24oYWxpZ25tZW50KS5ydW4oKTtcbiAgfVxuXG4gIHByb3RlY3RlZCBjYW5TdHlsZShhbGlnbm1lbnQ6ICdqdXN0aWZ5JyB8ICdsZWZ0JyB8ICdjZW50ZXInIHwgJ3JpZ2h0Jyk6IGJvb2xlYW4ge1xuICAgIGlmICghdGhpcy5lZGl0b3IpIHJldHVybiBmYWxzZTtcbiAgICByZXR1cm4gdGhpcy5lZGl0b3IuY2FuKCkuc2V0VGV4dEFsaWduKGFsaWdubWVudCk7XG4gIH1cblxuICBwcm90ZWN0ZWQgY3VycmVudEFjdGl2ZSgpOiAnbGVmdCcgfCAncmlnaHQnIHwgJ2NlbnRlcicgfCAnanVzdGlmeScgfCBudWxsIHtcbiAgICBpZiAodGhpcy5lZGl0b3IpIHtcbiAgICAgIGlmICh0aGlzLmVkaXRvci5pc0FjdGl2ZSh7dGV4dEFsaWduOiAnbGVmdCd9KSkgcmV0dXJuICdsZWZ0JztcbiAgICAgIGlmICh0aGlzLmVkaXRvci5pc0FjdGl2ZSh7dGV4dEFsaWduOiAncmlnaHQnfSkpIHJldHVybiAncmlnaHQnO1xuICAgICAgaWYgKHRoaXMuZWRpdG9yLmlzQWN0aXZlKHt0ZXh0QWxpZ246ICdjZW50ZXInfSkpIHJldHVybiAnY2VudGVyJztcbiAgICAgIGlmICh0aGlzLmVkaXRvci5pc0FjdGl2ZSh7dGV4dEFsaWduOiAnanVzdGlmeSd9KSkgcmV0dXJuICdqdXN0aWZ5JztcbiAgICB9XG4gICAgcmV0dXJuIG51bGw7XG4gIH1cbn1cbiJdfQ==