ngx-notion
Version:
An Notion page renderer for Angular
14 lines • 7.73 kB
JavaScript
import { Component, Input } from '@angular/core';
import * as i0 from "@angular/core";
import * as i1 from "@angular/common";
export class RichTextComponent {
}
RichTextComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: RichTextComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
RichTextComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: RichTextComponent, selector: "rich-text", inputs: { richText: "richText" }, ngImport: i0, template: "<span\n *ngFor=\"let item of richText\"\n class=\"text-color-{{ item.annotations.color }}\"\n [ngClass]=\"{\n 'text-bold': item.annotations.bold,\n 'text-italic': item.annotations.italic,\n 'text-strikethrough': item.annotations.strikethrough,\n 'text-underline': item.annotations.underline,\n 'text-code': item.annotations.code\n }\"\n>\n <ng-container *ngIf=\"item.href; else simpleText\">\n <a class=\"text-link\" [href]=\"item.href\" target=\"_blank\">{{ item.text.content }}</a>\n </ng-container>\n <ng-template #simpleText>{{ item.text.content }}</ng-template>\n</span>\n", styles: [".text-bold{font-weight:600}.text-italic{font-style:italic}.text-underline{text-decoration:underline}.text-strikethrough{text-decoration:line-through}.text-link{background-image:linear-gradient(to right,rgba(55,53,47,.16) 0%,rgba(55,53,47,.16) 100%);background-repeat:repeat-x;background-position:0 100%;background-size:100% 1px;text-decoration:none;color:#787774;fill:#787774}.text-color-red{color:#e03e3e}.text-color-red_background{background-color:#fbe4e4}.text-color-red_background_co{background-color:#fbe4e44d}.text-color-pink{color:#ad1a72}.text-color-pink_background{background-color:#f4dfeb}.text-color-pink_background_co{background-color:#f4dfeb4d}.text-color-blue{color:#0b6e99}.text-color-blue_background{background-color:#ddebf1}.text-color-blue_background_co{background-color:#ddebf14d}.text-color-purple{color:#6940a5}.text-color-purple_background{background-color:#eae4f2}.text-color-purple_background_co{background-color:#eae4f24d}.text-color-green{color:#0f7b6c}.text-color-green_background{background-color:#ddedea}.text-color-green_background_co{background-color:#ddedea4d}.text-color-yellow{color:#dfab01}.text-color-yellow_background{background-color:#fbf3db}.text-color-yellow_background_co{background-color:#fbf3db4d}.text-color-orange{color:#d9730d}.text-color-orange_background{background-color:#faebdd}.text-color-orange_background_co{background-color:#faebdd4d}.text-color-brown{color:#64473a}.text-color-brown_background{background-color:#e9e5e3}.text-color-brown_background_co{background-color:#e9e5e34d}.text-color-gray{color:#9b9a97}.text-color-gray_background{background-color:#ebeced}.text-color-gray_background_co{background-color:#ebeced4d}\n"], directives: [{ type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: RichTextComponent, decorators: [{
type: Component,
args: [{ selector: 'rich-text', template: "<span\n *ngFor=\"let item of richText\"\n class=\"text-color-{{ item.annotations.color }}\"\n [ngClass]=\"{\n 'text-bold': item.annotations.bold,\n 'text-italic': item.annotations.italic,\n 'text-strikethrough': item.annotations.strikethrough,\n 'text-underline': item.annotations.underline,\n 'text-code': item.annotations.code\n }\"\n>\n <ng-container *ngIf=\"item.href; else simpleText\">\n <a class=\"text-link\" [href]=\"item.href\" target=\"_blank\">{{ item.text.content }}</a>\n </ng-container>\n <ng-template #simpleText>{{ item.text.content }}</ng-template>\n</span>\n", styles: [".text-bold{font-weight:600}.text-italic{font-style:italic}.text-underline{text-decoration:underline}.text-strikethrough{text-decoration:line-through}.text-link{background-image:linear-gradient(to right,rgba(55,53,47,.16) 0%,rgba(55,53,47,.16) 100%);background-repeat:repeat-x;background-position:0 100%;background-size:100% 1px;text-decoration:none;color:#787774;fill:#787774}.text-color-red{color:#e03e3e}.text-color-red_background{background-color:#fbe4e4}.text-color-red_background_co{background-color:#fbe4e44d}.text-color-pink{color:#ad1a72}.text-color-pink_background{background-color:#f4dfeb}.text-color-pink_background_co{background-color:#f4dfeb4d}.text-color-blue{color:#0b6e99}.text-color-blue_background{background-color:#ddebf1}.text-color-blue_background_co{background-color:#ddebf14d}.text-color-purple{color:#6940a5}.text-color-purple_background{background-color:#eae4f2}.text-color-purple_background_co{background-color:#eae4f24d}.text-color-green{color:#0f7b6c}.text-color-green_background{background-color:#ddedea}.text-color-green_background_co{background-color:#ddedea4d}.text-color-yellow{color:#dfab01}.text-color-yellow_background{background-color:#fbf3db}.text-color-yellow_background_co{background-color:#fbf3db4d}.text-color-orange{color:#d9730d}.text-color-orange_background{background-color:#faebdd}.text-color-orange_background_co{background-color:#faebdd4d}.text-color-brown{color:#64473a}.text-color-brown_background{background-color:#e9e5e3}.text-color-brown_background_co{background-color:#e9e5e34d}.text-color-gray{color:#9b9a97}.text-color-gray_background{background-color:#ebeced}.text-color-gray_background_co{background-color:#ebeced4d}\n"] }]
}], propDecorators: { richText: [{
type: Input
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicmljaC10ZXh0LmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL25neC1ub3Rpb24vc3JjL2xpYi9jb21wb25lbnRzL2Jsb2Nrcy9yaWNoLXRleHQvcmljaC10ZXh0LmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL25neC1ub3Rpb24vc3JjL2xpYi9jb21wb25lbnRzL2Jsb2Nrcy9yaWNoLXRleHQvcmljaC10ZXh0LmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFFLE1BQU0sZUFBZSxDQUFDOzs7QUFPakQsTUFBTSxPQUFPLGlCQUFpQjs7OEdBQWpCLGlCQUFpQjtrR0FBakIsaUJBQWlCLG1GQ1A5Qixrb0JBZ0JBOzJGRFRhLGlCQUFpQjtrQkFMN0IsU0FBUzsrQkFDSSxXQUFXOzhCQU1yQixRQUFRO3NCQURQLEtBQUsiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIElucHV0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbkBDb21wb25lbnQoe1xuICAgIHNlbGVjdG9yOiAncmljaC10ZXh0JyxcbiAgICB0ZW1wbGF0ZVVybDogJy4vcmljaC10ZXh0LmNvbXBvbmVudC5odG1sJyxcbiAgICBzdHlsZVVybHM6IFsnLi9yaWNoLXRleHQuY29tcG9uZW50LnNjc3MnXSxcbn0pXG5leHBvcnQgY2xhc3MgUmljaFRleHRDb21wb25lbnQge1xuICAgIEBJbnB1dCgpXG4gICAgcmljaFRleHQ6IGFueTtcbn1cbiIsIjxzcGFuXG4gICAgKm5nRm9yPVwibGV0IGl0ZW0gb2YgcmljaFRleHRcIlxuICAgIGNsYXNzPVwidGV4dC1jb2xvci17eyBpdGVtLmFubm90YXRpb25zLmNvbG9yIH19XCJcbiAgICBbbmdDbGFzc109XCJ7XG4gICAgICAgICd0ZXh0LWJvbGQnOiBpdGVtLmFubm90YXRpb25zLmJvbGQsXG4gICAgICAgICd0ZXh0LWl0YWxpYyc6IGl0ZW0uYW5ub3RhdGlvbnMuaXRhbGljLFxuICAgICAgICAndGV4dC1zdHJpa2V0aHJvdWdoJzogaXRlbS5hbm5vdGF0aW9ucy5zdHJpa2V0aHJvdWdoLFxuICAgICAgICAndGV4dC11bmRlcmxpbmUnOiBpdGVtLmFubm90YXRpb25zLnVuZGVybGluZSxcbiAgICAgICAgJ3RleHQtY29kZSc6IGl0ZW0uYW5ub3RhdGlvbnMuY29kZVxuICAgIH1cIlxuPlxuICAgIDxuZy1jb250YWluZXIgKm5nSWY9XCJpdGVtLmhyZWY7IGVsc2Ugc2ltcGxlVGV4dFwiPlxuICAgICAgICA8YSBjbGFzcz1cInRleHQtbGlua1wiIFtocmVmXT1cIml0ZW0uaHJlZlwiIHRhcmdldD1cIl9ibGFua1wiPnt7IGl0ZW0udGV4dC5jb250ZW50IH19PC9hPlxuICAgIDwvbmctY29udGFpbmVyPlxuICAgIDxuZy10ZW1wbGF0ZSAjc2ltcGxlVGV4dD57eyBpdGVtLnRleHQuY29udGVudCB9fTwvbmctdGVtcGxhdGU+XG48L3NwYW4+XG4iXX0=