@covalent/flavored-markdown 4.0.0-beta.1 → 4.1.1-beta.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +4 -151
- package/covalent-flavored-markdown.d.ts +1 -1
- package/esm2020/covalent-flavored-markdown.mjs +2 -2
- package/esm2020/lib/cfm-list/cfm-list.component.mjs +60 -0
- package/esm2020/lib/flavored-markdown-loader/flavored-markdown-loader.component.mjs +104 -0
- package/esm2020/lib/flavored-markdown.component.mjs +492 -0
- package/esm2020/lib/flavored-markdown.module.mjs +69 -0
- package/esm2020/public_api.mjs +4 -4
- package/{cfm-list → lib/cfm-list}/cfm-list.component.d.ts +1 -1
- package/{flavored-markdown-loader → lib/flavored-markdown-loader}/flavored-markdown-loader.component.d.ts +5 -5
- package/{flavored-markdown.component.d.ts → lib/flavored-markdown.component.d.ts} +2 -2
- package/{flavored-markdown.module.d.ts → lib/flavored-markdown.module.d.ts} +0 -0
- package/package.json +16 -62
- package/public_api.d.ts +3 -3
- package/_flavored-markdown-theme.scss +0 -22
- package/cfm-list/cfm-list.component.scss +0 -0
- package/esm2020/cfm-list/cfm-list.component.mjs +0 -60
- package/esm2020/flavored-markdown-loader/flavored-markdown-loader.component.mjs +0 -102
- package/esm2020/flavored-markdown.component.mjs +0 -476
- package/esm2020/flavored-markdown.module.mjs +0 -69
- package/esm2020/index.mjs +0 -2
- package/fesm2015/covalent-flavored-markdown.mjs +0 -763
- package/fesm2015/covalent-flavored-markdown.mjs.map +0 -1
- package/fesm2020/covalent-flavored-markdown.mjs +0 -695
- package/fesm2020/covalent-flavored-markdown.mjs.map +0 -1
- package/flavored-markdown-loader/flavored-markdown-loader.component.scss +0 -28
- package/flavored-markdown.component.scss +0 -33
- package/index.d.ts +0 -1
package/README.md
CHANGED
|
@@ -1,154 +1,7 @@
|
|
|
1
|
-
|
|
1
|
+
# markdown-flavored
|
|
2
2
|
|
|
3
|
-
|
|
3
|
+
This library was generated with [Nx](https://nx.dev).
|
|
4
4
|
|
|
5
|
-
|
|
5
|
+
## Running unit tests
|
|
6
6
|
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
#### Inputs
|
|
10
|
-
|
|
11
|
-
+ content?: string
|
|
12
|
-
+ Markdown format content to be parsed as material/covalent markup.
|
|
13
|
-
|
|
14
|
-
+ simpleLineBreaks?: string
|
|
15
|
-
+ Sets whether newline characters inside paragraphs and spans are parsed as <br/>.
|
|
16
|
-
+ Defaults to false.
|
|
17
|
-
|
|
18
|
-
+ hostedUrl?: string
|
|
19
|
-
+ If markdown contains relative paths, this is required to generate correct urls.
|
|
20
|
-
|
|
21
|
-
+ anchor?: string
|
|
22
|
-
+ Anchor to jump to.
|
|
23
|
-
|
|
24
|
-
+ copyCodeToClipboard?: boolean
|
|
25
|
-
+ Display copy button on code snippets to copy code to clipboard.
|
|
26
|
-
+ copyCodeTooltips?: ICopyCodeTooltips
|
|
27
|
-
+ Tooltips for copy button to copy and upon copying.
|
|
28
|
-
|
|
29
|
-
For reference:
|
|
30
|
-
```
|
|
31
|
-
interface ICopyCodeTooltips {
|
|
32
|
-
copy?: string;
|
|
33
|
-
copied?: string;
|
|
34
|
-
}
|
|
35
|
-
```
|
|
36
|
-
#### Outputs
|
|
37
|
-
|
|
38
|
-
+ buttonClicked: ITdFlavoredMarkdownButtonClickEvent
|
|
39
|
-
+ Emitted when a button is clicked
|
|
40
|
-
|
|
41
|
-
#### Events
|
|
42
|
-
|
|
43
|
-
+ contentReady: undefined
|
|
44
|
-
+ Event emitted after the markdown content rendering is finished.
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
## Installation
|
|
48
|
-
|
|
49
|
-
This component can be installed as npm package.
|
|
50
|
-
|
|
51
|
-
```bash
|
|
52
|
-
npm i -save @angular/cdk
|
|
53
|
-
npm i -save @angular/material
|
|
54
|
-
npm i -save @covalent/core
|
|
55
|
-
npm i -save @covalent/markdown
|
|
56
|
-
npm i -save @covalent/highlight
|
|
57
|
-
npm i -save @covalent/flavored-markdown
|
|
58
|
-
```
|
|
59
|
-
|
|
60
|
-
## Setup
|
|
61
|
-
|
|
62
|
-
Then, import the **CovalentFlavoredMarkdownModule** in your NgModule:
|
|
63
|
-
|
|
64
|
-
```typescript
|
|
65
|
-
import { CovalentFlavoredMarkdownModule } from '@covalent/flavored-markdown';
|
|
66
|
-
@NgModule({
|
|
67
|
-
imports: [
|
|
68
|
-
CovalentFlavoredMarkdownModule,
|
|
69
|
-
...
|
|
70
|
-
],
|
|
71
|
-
...
|
|
72
|
-
})
|
|
73
|
-
export class MyModule {}
|
|
74
|
-
```
|
|
75
|
-
|
|
76
|
-
### Theming
|
|
77
|
-
|
|
78
|
-
This module comes with its own Covalent theme which uses the material theme which is used by importing our theme scss file. It also depends on all the covalent themes since the components being rendered by this module are from other packages.
|
|
79
|
-
|
|
80
|
-
```scss
|
|
81
|
-
@import '~@angular/material/theming';
|
|
82
|
-
@import '~@covalent/core/theming/all-theme';
|
|
83
|
-
@import '~@covalent/markdown/markdown-theme';
|
|
84
|
-
@import '~@covalent/highlight/highlight-theme';
|
|
85
|
-
@import '~@covalent/flavored-markdown/flavored-markdown-theme';
|
|
86
|
-
|
|
87
|
-
@include mat-core();
|
|
88
|
-
|
|
89
|
-
$primary: mat-palette($mat-orange, 800);
|
|
90
|
-
$accent: mat-palette($mat-light-blue, 600, A100, A400);
|
|
91
|
-
$warn: mat-palette($mat-red, 600);
|
|
92
|
-
|
|
93
|
-
$theme: mat-light-theme($primary, $accent, $warn);
|
|
94
|
-
|
|
95
|
-
@include mat.all-component-themes($theme);
|
|
96
|
-
@include covalent-theme($theme);
|
|
97
|
-
@include covalent-markdown-theme($theme);
|
|
98
|
-
@include covalent-highlight-theme();
|
|
99
|
-
@include covalent-flavored-markdown-theme($theme);
|
|
100
|
-
```
|
|
101
|
-
|
|
102
|
-
## Example
|
|
103
|
-
|
|
104
|
-
```html
|
|
105
|
-
<td-flavored-markdown>
|
|
106
|
-
- [x] checked action
|
|
107
|
-
- [ ] unchecked action
|
|
108
|
-
|
|
109
|
-
+ list item
|
|
110
|
-
+ list item
|
|
111
|
-
</td-flavored-markdown>
|
|
112
|
-
```
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
## TdFlavoredMarkdownLoaderComponent: td-flavored-markdown-loader
|
|
117
|
-
|
|
118
|
-
A component that fetches markdown from a GitHub url and renders it using `<td-flavored-markdown>`.
|
|
119
|
-
|
|
120
|
-
## API Summary
|
|
121
|
-
|
|
122
|
-
#### Inputs
|
|
123
|
-
|
|
124
|
-
+ url: string
|
|
125
|
-
+ The url of the markdown file.
|
|
126
|
-
|
|
127
|
-
+ httpOptions?: object
|
|
128
|
-
+ HTTP options that can be part of the request.
|
|
129
|
-
|
|
130
|
-
+ anchor?: string
|
|
131
|
-
+ Anchor to jump to.
|
|
132
|
-
|
|
133
|
-
#### Outputs
|
|
134
|
-
|
|
135
|
-
+ buttonClicked: ITdFlavoredMarkdownButtonClickEvent
|
|
136
|
-
+ Emitted when a button is clicked
|
|
137
|
-
|
|
138
|
-
#### Events
|
|
139
|
-
|
|
140
|
-
+ contentReady: void
|
|
141
|
-
+ Emitted when markdown rendering is finished.
|
|
142
|
-
|
|
143
|
-
+ loadFailed: Error
|
|
144
|
-
+ Emitted when loading of markdown file fails.
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
## Example
|
|
148
|
-
|
|
149
|
-
```html
|
|
150
|
-
<td-flavored-markdown-loader
|
|
151
|
-
[url]="'https://github.com/Teradata/covalent/blob/develop/README.md'"
|
|
152
|
-
>
|
|
153
|
-
</td-flavored-markdown-loader>
|
|
154
|
-
```
|
|
7
|
+
Run `nx test markdown-flavored` to execute the unit tests.
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Generated bundle index. Do not edit.
|
|
3
3
|
*/
|
|
4
|
-
export * from './
|
|
5
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
4
|
+
export * from './public_api';
|
|
5
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY292YWxlbnQtZmxhdm9yZWQtbWFya2Rvd24uanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9saWJzL21hcmtkb3duLWZsYXZvcmVkL3NyYy9jb3ZhbGVudC1mbGF2b3JlZC1tYXJrZG93bi50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTs7R0FFRztBQUVILGNBQWMsY0FBYyxDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBHZW5lcmF0ZWQgYnVuZGxlIGluZGV4LiBEbyBub3QgZWRpdC5cbiAqL1xuXG5leHBvcnQgKiBmcm9tICcuL3B1YmxpY19hcGknO1xuIl19
|
|
@@ -0,0 +1,60 @@
|
|
|
1
|
+
import { Component, Input } from '@angular/core';
|
|
2
|
+
import * as i0 from "@angular/core";
|
|
3
|
+
import * as i1 from "@angular/material/list";
|
|
4
|
+
import * as i2 from "@angular/common";
|
|
5
|
+
import * as i3 from "@angular/material/core";
|
|
6
|
+
import * as i4 from "@angular/material/divider";
|
|
7
|
+
function TdFlavoredListComponent_ng_template_1_p_3_Template(rf, ctx) { if (rf & 1) {
|
|
8
|
+
i0.ɵɵelementStart(0, "p", 1);
|
|
9
|
+
i0.ɵɵtext(1);
|
|
10
|
+
i0.ɵɵelementEnd();
|
|
11
|
+
} if (rf & 2) {
|
|
12
|
+
const subline_r5 = ctx.$implicit;
|
|
13
|
+
i0.ɵɵadvance(1);
|
|
14
|
+
i0.ɵɵtextInterpolate1(" ", subline_r5, " ");
|
|
15
|
+
} }
|
|
16
|
+
function TdFlavoredListComponent_ng_template_1_mat_divider_4_Template(rf, ctx) { if (rf & 1) {
|
|
17
|
+
i0.ɵɵelement(0, "mat-divider");
|
|
18
|
+
} }
|
|
19
|
+
function TdFlavoredListComponent_ng_template_1_Template(rf, ctx) { if (rf & 1) {
|
|
20
|
+
i0.ɵɵelementStart(0, "mat-list-item");
|
|
21
|
+
i0.ɵɵelementStart(1, "h4", 1);
|
|
22
|
+
i0.ɵɵtext(2);
|
|
23
|
+
i0.ɵɵelementEnd();
|
|
24
|
+
i0.ɵɵtemplate(3, TdFlavoredListComponent_ng_template_1_p_3_Template, 2, 1, "p", 2);
|
|
25
|
+
i0.ɵɵtemplate(4, TdFlavoredListComponent_ng_template_1_mat_divider_4_Template, 1, 0, "mat-divider", 3);
|
|
26
|
+
i0.ɵɵelementEnd();
|
|
27
|
+
} if (rf & 2) {
|
|
28
|
+
const line_r1 = ctx.$implicit;
|
|
29
|
+
const last_r2 = ctx.last;
|
|
30
|
+
i0.ɵɵadvance(2);
|
|
31
|
+
i0.ɵɵtextInterpolate1(" ", line_r1.line, " ");
|
|
32
|
+
i0.ɵɵadvance(1);
|
|
33
|
+
i0.ɵɵproperty("ngForOf", line_r1.sublines);
|
|
34
|
+
i0.ɵɵadvance(1);
|
|
35
|
+
i0.ɵɵproperty("ngIf", !last_r2);
|
|
36
|
+
} }
|
|
37
|
+
export class TdFlavoredListComponent {
|
|
38
|
+
constructor() {
|
|
39
|
+
this.dense = false;
|
|
40
|
+
}
|
|
41
|
+
}
|
|
42
|
+
TdFlavoredListComponent.ɵfac = function TdFlavoredListComponent_Factory(t) { return new (t || TdFlavoredListComponent)(); };
|
|
43
|
+
TdFlavoredListComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TdFlavoredListComponent, selectors: [["td-cfm-list"]], inputs: { lines: "lines", dense: "dense" }, decls: 2, vars: 2, consts: [["ngFor", "", 3, "ngForOf"], ["matLine", ""], ["matLine", "", 4, "ngFor", "ngForOf"], [4, "ngIf"]], template: function TdFlavoredListComponent_Template(rf, ctx) { if (rf & 1) {
|
|
44
|
+
i0.ɵɵelementStart(0, "mat-list");
|
|
45
|
+
i0.ɵɵtemplate(1, TdFlavoredListComponent_ng_template_1_Template, 5, 3, "ng-template", 0);
|
|
46
|
+
i0.ɵɵelementEnd();
|
|
47
|
+
} if (rf & 2) {
|
|
48
|
+
i0.ɵɵattribute("dense", ctx.dense ? true : null);
|
|
49
|
+
i0.ɵɵadvance(1);
|
|
50
|
+
i0.ɵɵproperty("ngForOf", ctx.lines);
|
|
51
|
+
} }, directives: [i1.MatList, i2.NgForOf, i1.MatListItem, i3.MatLine, i2.NgIf, i4.MatDivider], styles: [""] });
|
|
52
|
+
(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TdFlavoredListComponent, [{
|
|
53
|
+
type: Component,
|
|
54
|
+
args: [{ selector: 'td-cfm-list', template: "<mat-list [attr.dense]=\"dense ? true : null\">\n <ng-template let-line let-last=\"last\" ngFor [ngForOf]=\"lines\">\n <mat-list-item>\n <h4 matLine>\n {{ line.line }}\n </h4>\n <p *ngFor=\"let subline of line.sublines\" matLine>\n {{ subline }}\n </p>\n <mat-divider *ngIf=\"!last\"></mat-divider>\n </mat-list-item>\n </ng-template>\n</mat-list>\n", styles: [""] }]
|
|
55
|
+
}], null, { lines: [{
|
|
56
|
+
type: Input
|
|
57
|
+
}], dense: [{
|
|
58
|
+
type: Input
|
|
59
|
+
}] }); })();
|
|
60
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY2ZtLWxpc3QuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9tYXJrZG93bi1mbGF2b3JlZC9zcmMvbGliL2NmbS1saXN0L2NmbS1saXN0LmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uL2xpYnMvbWFya2Rvd24tZmxhdm9yZWQvc3JjL2xpYi9jZm0tbGlzdC9jZm0tbGlzdC5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLEtBQUssRUFBRSxNQUFNLGVBQWUsQ0FBQzs7Ozs7OztJQ00zQyw0QkFBaUQ7SUFDL0MsWUFDRjtJQUFBLGlCQUFJOzs7SUFERixlQUNGO0lBREUsMkNBQ0Y7OztJQUNBLDhCQUF5Qzs7O0lBUDNDLHFDQUFlO0lBQ2IsNkJBQVk7SUFDVixZQUNGO0lBQUEsaUJBQUs7SUFDTCxrRkFFSTtJQUNKLHNHQUF5QztJQUMzQyxpQkFBZ0I7Ozs7SUFOWixlQUNGO0lBREUsNkNBQ0Y7SUFDdUIsZUFBZ0I7SUFBaEIsMENBQWdCO0lBR3pCLGVBQVc7SUFBWCwrQkFBVzs7QURHL0IsTUFBTSxPQUFPLHVCQUF1QjtJQUxwQztRQU9XLFVBQUssR0FBRyxLQUFLLENBQUM7S0FDeEI7OzhGQUhZLHVCQUF1QjswRUFBdkIsdUJBQXVCO1FDWnBDLGdDQUE2QztRQUMzQyx3RkFVYztRQUNoQixpQkFBVzs7UUFaRCxnREFBa0M7UUFDRSxlQUFpQjtRQUFqQixtQ0FBaUI7O3VGRFdsRCx1QkFBdUI7Y0FMbkMsU0FBUzsyQkFDRSxhQUFhO2dCQUtkLEtBQUs7a0JBQWIsS0FBSztZQUNHLEtBQUs7a0JBQWIsS0FBSyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgSW5wdXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcblxuZXhwb3J0IGludGVyZmFjZSBJRmxhdm9yZWRMaXN0SXRlbSB7XG4gIGxpbmU6IHN0cmluZztcbiAgc3VibGluZXM/OiBzdHJpbmdbXTtcbn1cblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAndGQtY2ZtLWxpc3QnLFxuICBzdHlsZVVybHM6IFsnLi9jZm0tbGlzdC5jb21wb25lbnQuc2NzcyddLFxuICB0ZW1wbGF0ZVVybDogJy4vY2ZtLWxpc3QuY29tcG9uZW50Lmh0bWwnLFxufSlcbmV4cG9ydCBjbGFzcyBUZEZsYXZvcmVkTGlzdENvbXBvbmVudCB7XG4gIEBJbnB1dCgpIGxpbmVzITogSUZsYXZvcmVkTGlzdEl0ZW1bXTtcbiAgQElucHV0KCkgZGVuc2UgPSBmYWxzZTtcbn1cbiIsIjxtYXQtbGlzdCBbYXR0ci5kZW5zZV09XCJkZW5zZSA/IHRydWUgOiBudWxsXCI+XG4gIDxuZy10ZW1wbGF0ZSBsZXQtbGluZSBsZXQtbGFzdD1cImxhc3RcIiBuZ0ZvciBbbmdGb3JPZl09XCJsaW5lc1wiPlxuICAgIDxtYXQtbGlzdC1pdGVtPlxuICAgICAgPGg0IG1hdExpbmU+XG4gICAgICAgIHt7IGxpbmUubGluZSB9fVxuICAgICAgPC9oND5cbiAgICAgIDxwICpuZ0Zvcj1cImxldCBzdWJsaW5lIG9mIGxpbmUuc3VibGluZXNcIiBtYXRMaW5lPlxuICAgICAgICB7eyBzdWJsaW5lIH19XG4gICAgICA8L3A+XG4gICAgICA8bWF0LWRpdmlkZXIgKm5nSWY9XCIhbGFzdFwiPjwvbWF0LWRpdmlkZXI+XG4gICAgPC9tYXQtbGlzdC1pdGVtPlxuICA8L25nLXRlbXBsYXRlPlxuPC9tYXQtbGlzdD5cbiJdfQ==
|
|
@@ -0,0 +1,104 @@
|
|
|
1
|
+
import { Component, Input, ChangeDetectorRef, Output, EventEmitter, ChangeDetectionStrategy, } from '@angular/core';
|
|
2
|
+
import { TdMarkdownLoaderService } from '@covalent/markdown';
|
|
3
|
+
import * as i0 from "@angular/core";
|
|
4
|
+
import * as i1 from "@covalent/markdown";
|
|
5
|
+
import * as i2 from "@angular/common";
|
|
6
|
+
import * as i3 from "@angular/material/progress-bar";
|
|
7
|
+
import * as i4 from "../flavored-markdown.component";
|
|
8
|
+
function TdFlavoredMarkdownLoaderComponent_mat_progress_bar_0_Template(rf, ctx) { if (rf & 1) {
|
|
9
|
+
i0.ɵɵelement(0, "mat-progress-bar", 2);
|
|
10
|
+
} if (rf & 2) {
|
|
11
|
+
i0.ɵɵproperty("ngClass", "delay");
|
|
12
|
+
} }
|
|
13
|
+
function TdFlavoredMarkdownLoaderComponent_td_flavored_markdown_1_Template(rf, ctx) { if (rf & 1) {
|
|
14
|
+
const _r3 = i0.ɵɵgetCurrentView();
|
|
15
|
+
i0.ɵɵelementStart(0, "td-flavored-markdown", 3);
|
|
16
|
+
i0.ɵɵlistener("contentReady", function TdFlavoredMarkdownLoaderComponent_td_flavored_markdown_1_Template_td_flavored_markdown_contentReady_0_listener() { i0.ɵɵrestoreView(_r3); const ctx_r2 = i0.ɵɵnextContext(); return ctx_r2.contentReady.emit(); })("buttonClicked", function TdFlavoredMarkdownLoaderComponent_td_flavored_markdown_1_Template_td_flavored_markdown_buttonClicked_0_listener($event) { i0.ɵɵrestoreView(_r3); const ctx_r4 = i0.ɵɵnextContext(); return ctx_r4.buttonClicked.emit($event); });
|
|
17
|
+
i0.ɵɵelementEnd();
|
|
18
|
+
} if (rf & 2) {
|
|
19
|
+
const ctx_r1 = i0.ɵɵnextContext();
|
|
20
|
+
let tmp_1_0;
|
|
21
|
+
let tmp_2_0;
|
|
22
|
+
i0.ɵɵproperty("content", ctx_r1.content)("hostedUrl", (tmp_1_0 = ctx_r1.url) !== null && tmp_1_0 !== undefined ? tmp_1_0 : "")("anchor", (tmp_2_0 = ctx_r1.anchor) !== null && tmp_2_0 !== undefined ? tmp_2_0 : "")("copyCodeToClipboard", ctx_r1.copyCodeToClipboard)("copyCodeTooltips", ctx_r1.copyCodeTooltips);
|
|
23
|
+
} }
|
|
24
|
+
// TODO: make a td-markdown-loader component
|
|
25
|
+
export class TdFlavoredMarkdownLoaderComponent {
|
|
26
|
+
constructor(_changeDetectorRef, _markdownUrlLoaderService) {
|
|
27
|
+
this._changeDetectorRef = _changeDetectorRef;
|
|
28
|
+
this._markdownUrlLoaderService = _markdownUrlLoaderService;
|
|
29
|
+
/**
|
|
30
|
+
* copyCodeToClipboard?: boolean
|
|
31
|
+
*
|
|
32
|
+
* Display copy button on code snippets to copy code to clipboard.
|
|
33
|
+
*
|
|
34
|
+
*/
|
|
35
|
+
this.copyCodeToClipboard = false;
|
|
36
|
+
/**
|
|
37
|
+
* copyCodeTooltips?: ICopyCodeTooltips
|
|
38
|
+
*
|
|
39
|
+
* Tooltips for copy button to copy and upon copying.
|
|
40
|
+
*/
|
|
41
|
+
this.copyCodeTooltips = {};
|
|
42
|
+
/**
|
|
43
|
+
* contentReady: void
|
|
44
|
+
* Emitted when markdown rendering is finished.
|
|
45
|
+
*/
|
|
46
|
+
this.contentReady = new EventEmitter();
|
|
47
|
+
/**
|
|
48
|
+
* loadFailed: Error
|
|
49
|
+
* Emitted when loading of markdown file fails.
|
|
50
|
+
*/
|
|
51
|
+
this.loadFailed = new EventEmitter();
|
|
52
|
+
this.buttonClicked = new EventEmitter();
|
|
53
|
+
this.loading = true;
|
|
54
|
+
}
|
|
55
|
+
ngOnChanges(changes) {
|
|
56
|
+
if (changes['url'] || changes['httpOptions']) {
|
|
57
|
+
this.loadMarkdown();
|
|
58
|
+
}
|
|
59
|
+
}
|
|
60
|
+
async loadMarkdown() {
|
|
61
|
+
this.loading = true;
|
|
62
|
+
this._changeDetectorRef.markForCheck();
|
|
63
|
+
try {
|
|
64
|
+
this.content = await this._markdownUrlLoaderService.load(this.url ?? '', this.httpOptions);
|
|
65
|
+
}
|
|
66
|
+
catch (error) {
|
|
67
|
+
this.loadFailed.emit(error);
|
|
68
|
+
}
|
|
69
|
+
finally {
|
|
70
|
+
this.loading = false;
|
|
71
|
+
this._changeDetectorRef.markForCheck();
|
|
72
|
+
}
|
|
73
|
+
}
|
|
74
|
+
}
|
|
75
|
+
TdFlavoredMarkdownLoaderComponent.ɵfac = function TdFlavoredMarkdownLoaderComponent_Factory(t) { return new (t || TdFlavoredMarkdownLoaderComponent)(i0.ɵɵdirectiveInject(i0.ChangeDetectorRef), i0.ɵɵdirectiveInject(i1.TdMarkdownLoaderService)); };
|
|
76
|
+
TdFlavoredMarkdownLoaderComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TdFlavoredMarkdownLoaderComponent, selectors: [["td-flavored-markdown-loader"]], inputs: { url: "url", httpOptions: "httpOptions", anchor: "anchor", copyCodeToClipboard: "copyCodeToClipboard", copyCodeTooltips: "copyCodeTooltips" }, outputs: { contentReady: "contentReady", loadFailed: "loadFailed", buttonClicked: "buttonClicked" }, features: [i0.ɵɵNgOnChangesFeature], decls: 2, vars: 2, consts: [["mode", "indeterminate", "color", "accent", "class", "sticky", 3, "ngClass", 4, "ngIf"], [3, "content", "hostedUrl", "anchor", "copyCodeToClipboard", "copyCodeTooltips", "contentReady", "buttonClicked", 4, "ngIf"], ["mode", "indeterminate", "color", "accent", 1, "sticky", 3, "ngClass"], [3, "content", "hostedUrl", "anchor", "copyCodeToClipboard", "copyCodeTooltips", "contentReady", "buttonClicked"]], template: function TdFlavoredMarkdownLoaderComponent_Template(rf, ctx) { if (rf & 1) {
|
|
77
|
+
i0.ɵɵtemplate(0, TdFlavoredMarkdownLoaderComponent_mat_progress_bar_0_Template, 1, 1, "mat-progress-bar", 0);
|
|
78
|
+
i0.ɵɵtemplate(1, TdFlavoredMarkdownLoaderComponent_td_flavored_markdown_1_Template, 1, 5, "td-flavored-markdown", 1);
|
|
79
|
+
} if (rf & 2) {
|
|
80
|
+
i0.ɵɵproperty("ngIf", ctx.loading);
|
|
81
|
+
i0.ɵɵadvance(1);
|
|
82
|
+
i0.ɵɵproperty("ngIf", !ctx.loading);
|
|
83
|
+
} }, directives: [i2.NgIf, i3.MatProgressBar, i2.NgClass, i4.TdFlavoredMarkdownComponent], styles: ["[_nghost-%COMP%]{display:block}.sticky[_ngcontent-%COMP%]{position:absolute;top:0}.delay[_ngcontent-%COMP%]{animation:delay-animation;animation-duration:.6s}@keyframes delay-animation{0%{opacity:0}99%{opacity:0}to{opacity:1}}"], changeDetection: 0 });
|
|
84
|
+
(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TdFlavoredMarkdownLoaderComponent, [{
|
|
85
|
+
type: Component,
|
|
86
|
+
args: [{ selector: 'td-flavored-markdown-loader', changeDetection: ChangeDetectionStrategy.OnPush, template: "<mat-progress-bar\n [ngClass]=\"'delay'\"\n *ngIf=\"loading\"\n mode=\"indeterminate\"\n color=\"accent\"\n class=\"sticky\"\n></mat-progress-bar>\n<td-flavored-markdown\n *ngIf=\"!loading\"\n [content]=\"content\"\n [hostedUrl]=\"url ?? ''\"\n [anchor]=\"anchor ?? ''\"\n [copyCodeToClipboard]=\"copyCodeToClipboard\"\n [copyCodeTooltips]=\"copyCodeTooltips\"\n (contentReady)=\"contentReady.emit()\"\n (buttonClicked)=\"buttonClicked.emit($event)\"\n></td-flavored-markdown>\n", styles: [":host{display:block}.sticky{position:absolute;top:0}.delay{animation:delay-animation;animation-duration:.6s}@keyframes delay-animation{0%{opacity:0}99%{opacity:0}to{opacity:1}}\n"] }]
|
|
87
|
+
}], function () { return [{ type: i0.ChangeDetectorRef }, { type: i1.TdMarkdownLoaderService }]; }, { url: [{
|
|
88
|
+
type: Input
|
|
89
|
+
}], httpOptions: [{
|
|
90
|
+
type: Input
|
|
91
|
+
}], anchor: [{
|
|
92
|
+
type: Input
|
|
93
|
+
}], copyCodeToClipboard: [{
|
|
94
|
+
type: Input
|
|
95
|
+
}], copyCodeTooltips: [{
|
|
96
|
+
type: Input
|
|
97
|
+
}], contentReady: [{
|
|
98
|
+
type: Output
|
|
99
|
+
}], loadFailed: [{
|
|
100
|
+
type: Output
|
|
101
|
+
}], buttonClicked: [{
|
|
102
|
+
type: Output
|
|
103
|
+
}] }); })();
|
|
104
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZmxhdm9yZWQtbWFya2Rvd24tbG9hZGVyLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL2xpYnMvbWFya2Rvd24tZmxhdm9yZWQvc3JjL2xpYi9mbGF2b3JlZC1tYXJrZG93bi1sb2FkZXIvZmxhdm9yZWQtbWFya2Rvd24tbG9hZGVyLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uL2xpYnMvbWFya2Rvd24tZmxhdm9yZWQvc3JjL2xpYi9mbGF2b3JlZC1tYXJrZG93bi1sb2FkZXIvZmxhdm9yZWQtbWFya2Rvd24tbG9hZGVyLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFDTCxTQUFTLEVBQ1QsS0FBSyxFQUNMLGlCQUFpQixFQUdqQixNQUFNLEVBQ04sWUFBWSxFQUNaLHVCQUF1QixHQUN4QixNQUFNLGVBQWUsQ0FBQztBQUN2QixPQUFPLEVBQUUsdUJBQXVCLEVBQUUsTUFBTSxvQkFBb0IsQ0FBQzs7Ozs7OztJQ1Y3RCxzQ0FNb0I7O0lBTGxCLGlDQUFtQjs7OztJQU1yQiwrQ0FTQztJQUZDLDJOQUFnQiwwQkFBbUIsSUFBQyxzTkFDbkIsaUNBQTBCLElBRFA7SUFFckMsaUJBQXVCOzs7OztJQVB0Qix3Q0FBbUIsc0ZBQUEsc0ZBQUEsbURBQUEsNkNBQUE7O0FES3JCLDRDQUE0QztBQVE1QyxNQUFNLE9BQU8saUNBQWlDO0lBb0Q1QyxZQUNVLGtCQUFxQyxFQUNyQyx5QkFBa0Q7UUFEbEQsdUJBQWtCLEdBQWxCLGtCQUFrQixDQUFtQjtRQUNyQyw4QkFBeUIsR0FBekIseUJBQXlCLENBQXlCO1FBbkM1RDs7Ozs7V0FLRztRQUNNLHdCQUFtQixHQUFJLEtBQUssQ0FBQztRQUV0Qzs7OztXQUlHO1FBQ00scUJBQWdCLEdBQXVCLEVBQUUsQ0FBQztRQUVuRDs7O1dBR0c7UUFDTyxpQkFBWSxHQUF1QixJQUFJLFlBQVksRUFBRSxDQUFDO1FBRWhFOzs7V0FHRztRQUNPLGVBQVUsR0FBd0IsSUFBSSxZQUFZLEVBQUUsQ0FBQztRQUVyRCxrQkFBYSxHQUNyQixJQUFJLFlBQVksRUFBRSxDQUFDO1FBR3JCLFlBQU8sR0FBRyxJQUFJLENBQUM7SUFLWixDQUFDO0lBRUosV0FBVyxDQUFDLE9BQXNCO1FBQ2hDLElBQUksT0FBTyxDQUFDLEtBQUssQ0FBQyxJQUFJLE9BQU8sQ0FBQyxhQUFhLENBQUMsRUFBRTtZQUM1QyxJQUFJLENBQUMsWUFBWSxFQUFFLENBQUM7U0FDckI7SUFDSCxDQUFDO0lBRUQsS0FBSyxDQUFDLFlBQVk7UUFDaEIsSUFBSSxDQUFDLE9BQU8sR0FBRyxJQUFJLENBQUM7UUFDcEIsSUFBSSxDQUFDLGtCQUFrQixDQUFDLFlBQVksRUFBRSxDQUFDO1FBQ3ZDLElBQUk7WUFDRixJQUFJLENBQUMsT0FBTyxHQUFHLE1BQU0sSUFBSSxDQUFDLHlCQUF5QixDQUFDLElBQUksQ0FDdEQsSUFBSSxDQUFDLEdBQUcsSUFBSSxFQUFFLEVBQ2QsSUFBSSxDQUFDLFdBQVcsQ0FDakIsQ0FBQztTQUNIO1FBQUMsT0FBTyxLQUFLLEVBQUU7WUFDZCxJQUFJLENBQUMsVUFBVSxDQUFDLElBQUksQ0FBQyxLQUFjLENBQUMsQ0FBQztTQUN0QztnQkFBUztZQUNSLElBQUksQ0FBQyxPQUFPLEdBQUcsS0FBSyxDQUFDO1lBQ3JCLElBQUksQ0FBQyxrQkFBa0IsQ0FBQyxZQUFZLEVBQUUsQ0FBQztTQUN4QztJQUNILENBQUM7O2tIQTdFVSxpQ0FBaUM7b0ZBQWpDLGlDQUFpQztRQ3RCOUMsNEdBTW9CO1FBQ3BCLG9IQVN3Qjs7UUFkckIsa0NBQWE7UUFNYixlQUFjO1FBQWQsbUNBQWM7O3VGRGNKLGlDQUFpQztjQU43QyxTQUFTOzJCQUNFLDZCQUE2QixtQkFHdEIsdUJBQXVCLENBQUMsTUFBTTswR0FPdEMsR0FBRztrQkFBWCxLQUFLO1lBTUcsV0FBVztrQkFBbkIsS0FBSztZQU1HLE1BQU07a0JBQWQsS0FBSztZQVFHLG1CQUFtQjtrQkFBM0IsS0FBSztZQU9HLGdCQUFnQjtrQkFBeEIsS0FBSztZQU1JLFlBQVk7a0JBQXJCLE1BQU07WUFNRyxVQUFVO2tCQUFuQixNQUFNO1lBRUcsYUFBYTtrQkFBdEIsTUFBTSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7XG4gIENvbXBvbmVudCxcbiAgSW5wdXQsXG4gIENoYW5nZURldGVjdG9yUmVmLFxuICBTaW1wbGVDaGFuZ2VzLFxuICBPbkNoYW5nZXMsXG4gIE91dHB1dCxcbiAgRXZlbnRFbWl0dGVyLFxuICBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSxcbn0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBUZE1hcmtkb3duTG9hZGVyU2VydmljZSB9IGZyb20gJ0Bjb3ZhbGVudC9tYXJrZG93bic7XG5pbXBvcnQgeyBJVGRGbGF2b3JlZE1hcmtkb3duQnV0dG9uQ2xpY2tFdmVudCB9IGZyb20gJy4uL2ZsYXZvcmVkLW1hcmtkb3duLmNvbXBvbmVudCc7XG5pbXBvcnQgeyBJQ29weUNvZGVUb29sdGlwcyB9IGZyb20gJ0Bjb3ZhbGVudC9oaWdobGlnaHQnO1xuXG4vLyBUT0RPOiBtYWtlIGEgdGQtbWFya2Rvd24tbG9hZGVyIGNvbXBvbmVudFxuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICd0ZC1mbGF2b3JlZC1tYXJrZG93bi1sb2FkZXInLFxuICBzdHlsZVVybHM6IFsnLi9mbGF2b3JlZC1tYXJrZG93bi1sb2FkZXIuY29tcG9uZW50LnNjc3MnXSxcbiAgdGVtcGxhdGVVcmw6ICcuL2ZsYXZvcmVkLW1hcmtkb3duLWxvYWRlci5jb21wb25lbnQuaHRtbCcsXG4gIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxufSlcbmV4cG9ydCBjbGFzcyBUZEZsYXZvcmVkTWFya2Rvd25Mb2FkZXJDb21wb25lbnQgaW1wbGVtZW50cyBPbkNoYW5nZXMge1xuICAvKipcbiAgICogdXJsOiBzdHJpbmdcbiAgICogVGhlIHVybCBvZiB0aGUgbWFya2Rvd24gZmlsZS5cbiAgICovXG4gIEBJbnB1dCgpIHVybD86IHN0cmluZztcblxuICAvKipcbiAgICogaHR0cE9wdGlvbnM6IG9iamVjdFxuICAgKiBIVFRQIG9wdGlvbnMgdGhhdCBjYW4gYmUgcGFydCBvZiB0aGUgcmVxdWVzdC5cbiAgICovXG4gIEBJbnB1dCgpIGh0dHBPcHRpb25zPzogb2JqZWN0O1xuXG4gIC8qKlxuICAgKiBhbmNob3I6IHN0cmluZ1xuICAgKiBBbmNob3IgdG8ganVtcCB0by5cbiAgICovXG4gIEBJbnB1dCgpIGFuY2hvcj86IHN0cmluZztcblxuICAvKipcbiAgICogY29weUNvZGVUb0NsaXBib2FyZD86IGJvb2xlYW5cbiAgICpcbiAgICogRGlzcGxheSBjb3B5IGJ1dHRvbiBvbiBjb2RlIHNuaXBwZXRzIHRvIGNvcHkgY29kZSB0byBjbGlwYm9hcmQuXG4gICAqXG4gICAqL1xuICBASW5wdXQoKSBjb3B5Q29kZVRvQ2xpcGJvYXJkPyA9IGZhbHNlO1xuXG4gIC8qKlxuICAgKiBjb3B5Q29kZVRvb2x0aXBzPzogSUNvcHlDb2RlVG9vbHRpcHNcbiAgICpcbiAgICogVG9vbHRpcHMgZm9yIGNvcHkgYnV0dG9uIHRvIGNvcHkgYW5kIHVwb24gY29weWluZy5cbiAgICovXG4gIEBJbnB1dCgpIGNvcHlDb2RlVG9vbHRpcHM/OiBJQ29weUNvZGVUb29sdGlwcyA9IHt9O1xuXG4gIC8qKlxuICAgKiBjb250ZW50UmVhZHk6IHZvaWRcbiAgICogRW1pdHRlZCB3aGVuIG1hcmtkb3duIHJlbmRlcmluZyBpcyBmaW5pc2hlZC5cbiAgICovXG4gIEBPdXRwdXQoKSBjb250ZW50UmVhZHk6IEV2ZW50RW1pdHRlcjx2b2lkPiA9IG5ldyBFdmVudEVtaXR0ZXIoKTtcblxuICAvKipcbiAgICogbG9hZEZhaWxlZDogRXJyb3JcbiAgICogRW1pdHRlZCB3aGVuIGxvYWRpbmcgb2YgbWFya2Rvd24gZmlsZSBmYWlscy5cbiAgICovXG4gIEBPdXRwdXQoKSBsb2FkRmFpbGVkOiBFdmVudEVtaXR0ZXI8RXJyb3I+ID0gbmV3IEV2ZW50RW1pdHRlcigpO1xuXG4gIEBPdXRwdXQoKSBidXR0b25DbGlja2VkOiBFdmVudEVtaXR0ZXI8SVRkRmxhdm9yZWRNYXJrZG93bkJ1dHRvbkNsaWNrRXZlbnQ+ID1cbiAgICBuZXcgRXZlbnRFbWl0dGVyKCk7XG5cbiAgY29udGVudCE6IHN0cmluZztcbiAgbG9hZGluZyA9IHRydWU7XG5cbiAgY29uc3RydWN0b3IoXG4gICAgcHJpdmF0ZSBfY2hhbmdlRGV0ZWN0b3JSZWY6IENoYW5nZURldGVjdG9yUmVmLFxuICAgIHByaXZhdGUgX21hcmtkb3duVXJsTG9hZGVyU2VydmljZTogVGRNYXJrZG93bkxvYWRlclNlcnZpY2VcbiAgKSB7fVxuXG4gIG5nT25DaGFuZ2VzKGNoYW5nZXM6IFNpbXBsZUNoYW5nZXMpOiB2b2lkIHtcbiAgICBpZiAoY2hhbmdlc1sndXJsJ10gfHwgY2hhbmdlc1snaHR0cE9wdGlvbnMnXSkge1xuICAgICAgdGhpcy5sb2FkTWFya2Rvd24oKTtcbiAgICB9XG4gIH1cblxuICBhc3luYyBsb2FkTWFya2Rvd24oKTogUHJvbWlzZTx2b2lkPiB7XG4gICAgdGhpcy5sb2FkaW5nID0gdHJ1ZTtcbiAgICB0aGlzLl9jaGFuZ2VEZXRlY3RvclJlZi5tYXJrRm9yQ2hlY2soKTtcbiAgICB0cnkge1xuICAgICAgdGhpcy5jb250ZW50ID0gYXdhaXQgdGhpcy5fbWFya2Rvd25VcmxMb2FkZXJTZXJ2aWNlLmxvYWQoXG4gICAgICAgIHRoaXMudXJsID8/ICcnLFxuICAgICAgICB0aGlzLmh0dHBPcHRpb25zXG4gICAgICApO1xuICAgIH0gY2F0Y2ggKGVycm9yKSB7XG4gICAgICB0aGlzLmxvYWRGYWlsZWQuZW1pdChlcnJvciBhcyBFcnJvcik7XG4gICAgfSBmaW5hbGx5IHtcbiAgICAgIHRoaXMubG9hZGluZyA9IGZhbHNlO1xuICAgICAgdGhpcy5fY2hhbmdlRGV0ZWN0b3JSZWYubWFya0ZvckNoZWNrKCk7XG4gICAgfVxuICB9XG59XG4iLCI8bWF0LXByb2dyZXNzLWJhclxuICBbbmdDbGFzc109XCInZGVsYXknXCJcbiAgKm5nSWY9XCJsb2FkaW5nXCJcbiAgbW9kZT1cImluZGV0ZXJtaW5hdGVcIlxuICBjb2xvcj1cImFjY2VudFwiXG4gIGNsYXNzPVwic3RpY2t5XCJcbj48L21hdC1wcm9ncmVzcy1iYXI+XG48dGQtZmxhdm9yZWQtbWFya2Rvd25cbiAgKm5nSWY9XCIhbG9hZGluZ1wiXG4gIFtjb250ZW50XT1cImNvbnRlbnRcIlxuICBbaG9zdGVkVXJsXT1cInVybCA/PyAnJ1wiXG4gIFthbmNob3JdPVwiYW5jaG9yID8/ICcnXCJcbiAgW2NvcHlDb2RlVG9DbGlwYm9hcmRdPVwiY29weUNvZGVUb0NsaXBib2FyZFwiXG4gIFtjb3B5Q29kZVRvb2x0aXBzXT1cImNvcHlDb2RlVG9vbHRpcHNcIlxuICAoY29udGVudFJlYWR5KT1cImNvbnRlbnRSZWFkeS5lbWl0KClcIlxuICAoYnV0dG9uQ2xpY2tlZCk9XCJidXR0b25DbGlja2VkLmVtaXQoJGV2ZW50KVwiXG4+PC90ZC1mbGF2b3JlZC1tYXJrZG93bj5cbiJdfQ==
|