@kolkov/angular-editor
Version:
A simple native WYSIWYG editor for Angular 13+. Rich Text editor component for Angular.
21 lines • 6.11 kB
JavaScript
import { Component, Input } from '@angular/core';
import * as i0 from "@angular/core";
import * as i1 from "@angular/common";
export class AeButtonComponent {
constructor() {
this.iconName = '';
}
}
AeButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: AeButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
AeButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: AeButtonComponent, selector: "ae-button, button[aeButton]", inputs: { iconName: "iconName" }, host: { properties: { "tabIndex": "-1", "type": "\"button\"" }, classAttribute: "angular-editor-button" }, ngImport: i0, template: "<ng-container *ngIf=\"iconName; else contentTemplate\">\n <svg>\n <use [attr.href]=\"'assets/ae-icons/icons.svg#' + iconName\" [attr.xlink:href]=\"'assets/ae-icons/icons.svg#' + iconName\"></use>\n </svg>\n</ng-container>\n<ng-template #contentTemplate>\n <ng-content></ng-content>\n</ng-template>\n", styles: ["a{cursor:pointer}:host.angular-editor-button{background-color:var(--ae-button-bg-color, white);vertical-align:middle;border:var(--ae-button-border, 1px solid #ddd);border-radius:var(--ae-button-radius, 4px);padding:.4rem;float:left;width:2rem;height:2rem}:host.angular-editor-button svg{width:100%;height:100%}:host.angular-editor-button:hover{cursor:pointer;background-color:var(--ae-button-hover-bg-color, #f1f1f1);transition:.2s ease}:host.angular-editor-button:focus,:host.angular-editor-button.focus{outline:0}:host.angular-editor-button:disabled{background-color:var(--ae-button-disabled-bg-color, #f5f5f5);pointer-events:none;cursor:not-allowed}:host.angular-editor-button:disabled>.color-label{pointer-events:none;cursor:not-allowed}:host.angular-editor-button:disabled>.color-label.foreground :after{background:#555555}:host.angular-editor-button:disabled>.color-label.background{background:#555555}:host.angular-editor-button.active{background:var(--ae-button-active-bg-color, #fffbd3)}:host.angular-editor-button.active:hover{background-color:var(--ae-button-active-hover-bg-color, #fffaad)}\n"], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: AeButtonComponent, decorators: [{
type: Component,
args: [{ selector: 'ae-button, button[aeButton]', host: {
'class': 'angular-editor-button',
'[tabIndex]': '-1',
'[type]': '"button"',
}, template: "<ng-container *ngIf=\"iconName; else contentTemplate\">\n <svg>\n <use [attr.href]=\"'assets/ae-icons/icons.svg#' + iconName\" [attr.xlink:href]=\"'assets/ae-icons/icons.svg#' + iconName\"></use>\n </svg>\n</ng-container>\n<ng-template #contentTemplate>\n <ng-content></ng-content>\n</ng-template>\n", styles: ["a{cursor:pointer}:host.angular-editor-button{background-color:var(--ae-button-bg-color, white);vertical-align:middle;border:var(--ae-button-border, 1px solid #ddd);border-radius:var(--ae-button-radius, 4px);padding:.4rem;float:left;width:2rem;height:2rem}:host.angular-editor-button svg{width:100%;height:100%}:host.angular-editor-button:hover{cursor:pointer;background-color:var(--ae-button-hover-bg-color, #f1f1f1);transition:.2s ease}:host.angular-editor-button:focus,:host.angular-editor-button.focus{outline:0}:host.angular-editor-button:disabled{background-color:var(--ae-button-disabled-bg-color, #f5f5f5);pointer-events:none;cursor:not-allowed}:host.angular-editor-button:disabled>.color-label{pointer-events:none;cursor:not-allowed}:host.angular-editor-button:disabled>.color-label.foreground :after{background:#555555}:host.angular-editor-button:disabled>.color-label.background{background:#555555}:host.angular-editor-button.active{background:var(--ae-button-active-bg-color, #fffbd3)}:host.angular-editor-button.active:hover{background-color:var(--ae-button-active-hover-bg-color, #fffaad)}\n"] }]
}], ctorParameters: function () { return []; }, propDecorators: { iconName: [{
type: Input
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYWUtYnV0dG9uLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2FuZ3VsYXItZWRpdG9yL3NyYy9saWIvYWUtYnV0dG9uL2FlLWJ1dHRvbi5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9hbmd1bGFyLWVkaXRvci9zcmMvbGliL2FlLWJ1dHRvbi9hZS1idXR0b24uY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFDLFNBQVMsRUFBRSxLQUFLLEVBQW9CLE1BQU0sZUFBZSxDQUFDOzs7QUFhbEUsTUFBTSxPQUFPLGlCQUFpQjtJQUk1QjtRQUZTLGFBQVEsR0FBRyxFQUFFLENBQUM7SUFHdkIsQ0FBQzs7OEdBTFUsaUJBQWlCO2tHQUFqQixpQkFBaUIsZ05DYjlCLG1UQVFBOzJGREthLGlCQUFpQjtrQkFYN0IsU0FBUzsrQkFDRSw2QkFBNkIsUUFJakM7d0JBQ0osT0FBTyxFQUFFLHVCQUF1Qjt3QkFDaEMsWUFBWSxFQUFFLElBQUk7d0JBQ2xCLFFBQVEsRUFBRSxVQUFVO3FCQUNyQjswRUFJUSxRQUFRO3NCQUFoQixLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtDb21wb25lbnQsIElucHV0LCBWaWV3RW5jYXBzdWxhdGlvbn0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ2FlLWJ1dHRvbiwgYnV0dG9uW2FlQnV0dG9uXScsXG4gIHRlbXBsYXRlVXJsOiAnLi9hZS1idXR0b24uY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybHM6IFsnLi9hZS1idXR0b24uY29tcG9uZW50LnNjc3MnXSxcbiAgLy9lbmNhcHN1bGF0aW9uOiBWaWV3RW5jYXBzdWxhdGlvbi5Ob25lLFxuICBob3N0OiB7XG4gICAgJ2NsYXNzJzogJ2FuZ3VsYXItZWRpdG9yLWJ1dHRvbicsXG4gICAgJ1t0YWJJbmRleF0nOiAnLTEnLFxuICAgICdbdHlwZV0nOiAnXCJidXR0b25cIicsXG4gIH1cbn0pXG5leHBvcnQgY2xhc3MgQWVCdXR0b25Db21wb25lbnQge1xuXG4gIEBJbnB1dCgpIGljb25OYW1lID0gJyc7XG5cbiAgY29uc3RydWN0b3IoKSB7XG4gIH1cblxufVxuIiwiPG5nLWNvbnRhaW5lciAqbmdJZj1cImljb25OYW1lOyBlbHNlIGNvbnRlbnRUZW1wbGF0ZVwiPlxuICA8c3ZnPlxuICAgIDx1c2UgW2F0dHIuaHJlZl09XCInYXNzZXRzL2FlLWljb25zL2ljb25zLnN2ZyMnICsgaWNvbk5hbWVcIiBbYXR0ci54bGluazpocmVmXT1cIidhc3NldHMvYWUtaWNvbnMvaWNvbnMuc3ZnIycgKyBpY29uTmFtZVwiPjwvdXNlPlxuICA8L3N2Zz5cbjwvbmctY29udGFpbmVyPlxuPG5nLXRlbXBsYXRlICNjb250ZW50VGVtcGxhdGU+XG4gIDxuZy1jb250ZW50PjwvbmctY29udGVudD5cbjwvbmctdGVtcGxhdGU+XG4iXX0=