@ethlete/contentful 0.1.0-next.6 → 0.1.0-next.7
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/esm2020/lib/components/audio/contentful-audio.component.mjs +3 -3
- package/esm2020/lib/components/file/contentful-file.component.mjs +3 -3
- package/esm2020/lib/components/image/contentful-image.component.mjs +25 -13
- package/esm2020/lib/components/rich-text-renderer/rich-text-renderer.component.mjs +7 -7
- package/esm2020/lib/components/rich-text-renderer/rich-text-renderer.util.mjs +2 -16
- package/esm2020/lib/components/video/contentful-video.component.mjs +3 -3
- package/esm2020/lib/constants/contentful.constants.mjs +2 -2
- package/esm2020/lib/contentful.module.mjs +4 -4
- package/esm2020/lib/public-api.mjs +2 -2
- package/esm2020/lib/types/contentful.types.mjs +1 -1
- package/esm2020/lib/utils/contentful-config.mjs +12 -15
- package/esm2020/lib/utils/contentful.util.mjs +4 -3
- package/fesm2015/ethlete-contentful.mjs +216 -222
- package/fesm2015/ethlete-contentful.mjs.map +1 -1
- package/fesm2020/ethlete-contentful.mjs +217 -218
- package/fesm2020/ethlete-contentful.mjs.map +1 -1
- package/lib/components/audio/contentful-audio.component.d.ts +1 -1
- package/lib/components/file/contentful-file.component.d.ts +1 -1
- package/lib/components/image/contentful-image.component.d.ts +5 -1
- package/lib/components/rich-text-renderer/rich-text-renderer.component.d.ts +1 -1
- package/lib/components/rich-text-renderer/rich-text-renderer.util.d.ts +1 -16
- package/lib/components/video/contentful-video.component.d.ts +1 -1
- package/lib/constants/contentful.constants.d.ts +1 -1
- package/lib/public-api.d.ts +1 -1
- package/lib/types/contentful.types.d.ts +26 -0
- package/lib/utils/contentful-config.d.ts +2 -26
- package/lib/utils/contentful.util.d.ts +2 -2
- package/package.json +4 -4
- package/esm2020/lib/components/audio/index.mjs +0 -2
- package/esm2020/lib/components/file/index.mjs +0 -2
- package/esm2020/lib/components/image/index.mjs +0 -2
- package/esm2020/lib/components/video/index.mjs +0 -2
- package/esm2020/lib/utils/index.mjs +0 -2
- package/lib/components/audio/index.d.ts +0 -1
- package/lib/components/file/index.d.ts +0 -1
- package/lib/components/image/index.d.ts +0 -1
- package/lib/components/video/index.d.ts +0 -1
- package/lib/utils/index.d.ts +0 -1
|
@@ -1,215 +1,34 @@
|
|
|
1
|
-
import { NgIf, NgClass,
|
|
1
|
+
import { DOCUMENT, NgIf, NgClass, NgOptimizedImage } from '@angular/common';
|
|
2
2
|
import * as i0 from '@angular/core';
|
|
3
|
-
import { InjectionToken, inject,
|
|
3
|
+
import { InjectionToken, inject, Renderer2, ElementRef, ViewContainerRef, ComponentFactoryResolver, ApplicationRef, Injector, Component, ViewEncapsulation, ChangeDetectionStrategy, Input, NgModule } from '@angular/core';
|
|
4
4
|
import { DomPortalOutlet, ComponentPortal } from '@angular/cdk/portal';
|
|
5
|
+
import { coerceBooleanProperty } from '@angular/cdk/coercion';
|
|
5
6
|
import { BLOCKS, INLINES } from '@contentful/rich-text-types';
|
|
6
7
|
|
|
7
|
-
const CONTENTFUL_CONFIG = new InjectionToken('
|
|
8
|
+
const CONTENTFUL_CONFIG = new InjectionToken('ContentfulConfig');
|
|
8
9
|
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
10
|
+
const createContentfulConfig = (config = {}) => ({
|
|
11
|
+
// This default config must be inline and not saved inside a const for some weird webpack reason
|
|
12
|
+
...{
|
|
13
|
+
useTailwindClasses: false,
|
|
14
|
+
components: {
|
|
15
|
+
audio: ContentfulAudioComponent,
|
|
15
16
|
file: ContentfulFileComponent,
|
|
16
17
|
image: ContentfulImageComponent,
|
|
17
18
|
video: ContentfulVideoComponent,
|
|
18
|
-
|
|
19
|
-
}
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
this.useTailwindClasses = false;
|
|
24
|
-
}
|
|
25
|
-
}
|
|
26
|
-
|
|
27
|
-
const provideContentfulConfig = (contentfulConfig) => {
|
|
28
|
-
return { provide: CONTENTFUL_CONFIG, useValue: contentfulConfig };
|
|
29
|
-
};
|
|
19
|
+
},
|
|
20
|
+
customComponents: {},
|
|
21
|
+
},
|
|
22
|
+
...(config || {}),
|
|
23
|
+
});
|
|
30
24
|
|
|
31
25
|
const RICH_TEXT_RENDERER_COMPONENT_DATA = new InjectionToken('RICH_TEXT_RENDERER_COMPONENT_DATA');
|
|
32
26
|
|
|
33
|
-
class ContentfulFileComponent {
|
|
34
|
-
constructor() {
|
|
35
|
-
this._richTextData = inject(RICH_TEXT_RENDERER_COMPONENT_DATA, { optional: true });
|
|
36
|
-
this._data = null;
|
|
37
|
-
this.fileClass = null;
|
|
38
|
-
}
|
|
39
|
-
get data() {
|
|
40
|
-
return this._data;
|
|
41
|
-
}
|
|
42
|
-
set data(v) {
|
|
43
|
-
if (v && !v.contentType) {
|
|
44
|
-
this._data = null;
|
|
45
|
-
console.warn('The provided asset is invalid', v);
|
|
46
|
-
return;
|
|
47
|
-
}
|
|
48
|
-
this._data = v ?? null;
|
|
49
|
-
}
|
|
50
|
-
ngOnInit() {
|
|
51
|
-
if (this._richTextData && !this.data) {
|
|
52
|
-
this.data = this._richTextData;
|
|
53
|
-
}
|
|
54
|
-
}
|
|
55
|
-
}
|
|
56
|
-
ContentfulFileComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.9", ngImport: i0, type: ContentfulFileComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
57
|
-
ContentfulFileComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.9", type: ContentfulFileComponent, isStandalone: true, selector: "et-contentful-file", inputs: { data: "data", fileClass: "fileClass" }, ngImport: i0, template: `
|
|
58
|
-
<a *ngIf="data" [href]="data.url" [ngClass]="fileClass" class="underline" target="_blank">
|
|
59
|
-
{{ data.title }} ({{ data.size }} Bytes)
|
|
60
|
-
</a>
|
|
61
|
-
`, isInline: true, dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
62
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.9", ngImport: i0, type: ContentfulFileComponent, decorators: [{
|
|
63
|
-
type: Component,
|
|
64
|
-
args: [{
|
|
65
|
-
selector: 'et-contentful-file',
|
|
66
|
-
template: `
|
|
67
|
-
<a *ngIf="data" [href]="data.url" [ngClass]="fileClass" class="underline" target="_blank">
|
|
68
|
-
{{ data.title }} ({{ data.size }} Bytes)
|
|
69
|
-
</a>
|
|
70
|
-
`,
|
|
71
|
-
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
72
|
-
encapsulation: ViewEncapsulation.None,
|
|
73
|
-
standalone: true,
|
|
74
|
-
imports: [NgIf, NgClass],
|
|
75
|
-
}]
|
|
76
|
-
}], propDecorators: { data: [{
|
|
77
|
-
type: Input
|
|
78
|
-
}], fileClass: [{
|
|
79
|
-
type: Input
|
|
80
|
-
}] } });
|
|
81
|
-
|
|
82
|
-
class ContentfulImageComponent {
|
|
83
|
-
constructor() {
|
|
84
|
-
this._richTextData = inject(RICH_TEXT_RENDERER_COMPONENT_DATA, { optional: true });
|
|
85
|
-
this._data = null;
|
|
86
|
-
this.imgClass = null;
|
|
87
|
-
this.pictureClass = null;
|
|
88
|
-
}
|
|
89
|
-
get data() {
|
|
90
|
-
return this._data;
|
|
91
|
-
}
|
|
92
|
-
set data(v) {
|
|
93
|
-
if (v && !v.contentType) {
|
|
94
|
-
this._data = null;
|
|
95
|
-
console.warn('The provided asset is invalid', v);
|
|
96
|
-
return;
|
|
97
|
-
}
|
|
98
|
-
if (v && !v.contentType.startsWith('image/')) {
|
|
99
|
-
throw new Error('The provided asset is not an image');
|
|
100
|
-
}
|
|
101
|
-
this._data = v ?? null;
|
|
102
|
-
}
|
|
103
|
-
ngOnInit() {
|
|
104
|
-
if (this._richTextData && !this.data) {
|
|
105
|
-
this.data = this._richTextData;
|
|
106
|
-
}
|
|
107
|
-
}
|
|
108
|
-
}
|
|
109
|
-
ContentfulImageComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.9", ngImport: i0, type: ContentfulImageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
110
|
-
ContentfulImageComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.9", type: ContentfulImageComponent, isStandalone: true, selector: "et-contentful-image", inputs: { data: "data", imgClass: "imgClass", pictureClass: "pictureClass" }, ngImport: i0, template: `
|
|
111
|
-
<picture *ngIf="data" [ngClass]="pictureClass">
|
|
112
|
-
<source srcset="{{ data.url }}?fm=avif" type="image/avif" />
|
|
113
|
-
<source srcset="{{ data.url }}?fm=webp" type="image/webp" />
|
|
114
|
-
<source srcset="{{ data.url }}?fm=jpg" type="image/jpeg" />
|
|
115
|
-
<img
|
|
116
|
-
[attr.alt]="data.description ?? undefined"
|
|
117
|
-
[attr.width]="data.width ?? undefined"
|
|
118
|
-
[attr.height]="data.height ?? undefined"
|
|
119
|
-
[ngClass]="imgClass"
|
|
120
|
-
src="{{ data.url }}"
|
|
121
|
-
/>
|
|
122
|
-
</picture>
|
|
123
|
-
`, isInline: true, dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
124
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.9", ngImport: i0, type: ContentfulImageComponent, decorators: [{
|
|
125
|
-
type: Component,
|
|
126
|
-
args: [{
|
|
127
|
-
selector: 'et-contentful-image',
|
|
128
|
-
template: `
|
|
129
|
-
<picture *ngIf="data" [ngClass]="pictureClass">
|
|
130
|
-
<source srcset="{{ data.url }}?fm=avif" type="image/avif" />
|
|
131
|
-
<source srcset="{{ data.url }}?fm=webp" type="image/webp" />
|
|
132
|
-
<source srcset="{{ data.url }}?fm=jpg" type="image/jpeg" />
|
|
133
|
-
<img
|
|
134
|
-
[attr.alt]="data.description ?? undefined"
|
|
135
|
-
[attr.width]="data.width ?? undefined"
|
|
136
|
-
[attr.height]="data.height ?? undefined"
|
|
137
|
-
[ngClass]="imgClass"
|
|
138
|
-
src="{{ data.url }}"
|
|
139
|
-
/>
|
|
140
|
-
</picture>
|
|
141
|
-
`,
|
|
142
|
-
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
143
|
-
encapsulation: ViewEncapsulation.None,
|
|
144
|
-
standalone: true,
|
|
145
|
-
imports: [NgIf, NgClass],
|
|
146
|
-
}]
|
|
147
|
-
}], propDecorators: { data: [{
|
|
148
|
-
type: Input
|
|
149
|
-
}], imgClass: [{
|
|
150
|
-
type: Input
|
|
151
|
-
}], pictureClass: [{
|
|
152
|
-
type: Input
|
|
153
|
-
}] } });
|
|
154
|
-
|
|
155
|
-
class ContentfulVideoComponent {
|
|
156
|
-
constructor() {
|
|
157
|
-
this._richTextData = inject(RICH_TEXT_RENDERER_COMPONENT_DATA, { optional: true });
|
|
158
|
-
this._data = null;
|
|
159
|
-
this.videoClass = null;
|
|
160
|
-
}
|
|
161
|
-
get data() {
|
|
162
|
-
return this._data;
|
|
163
|
-
}
|
|
164
|
-
set data(v) {
|
|
165
|
-
if (v && !v.contentType) {
|
|
166
|
-
this._data = null;
|
|
167
|
-
console.warn('The provided asset is invalid', v);
|
|
168
|
-
return;
|
|
169
|
-
}
|
|
170
|
-
if (v && !v.contentType.startsWith('video/')) {
|
|
171
|
-
throw new Error('The provided asset is not an video');
|
|
172
|
-
}
|
|
173
|
-
this._data = v ?? null;
|
|
174
|
-
}
|
|
175
|
-
ngOnInit() {
|
|
176
|
-
if (this._richTextData && !this.data) {
|
|
177
|
-
this.data = this._richTextData;
|
|
178
|
-
}
|
|
179
|
-
}
|
|
180
|
-
}
|
|
181
|
-
ContentfulVideoComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.9", ngImport: i0, type: ContentfulVideoComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
182
|
-
ContentfulVideoComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.9", type: ContentfulVideoComponent, isStandalone: true, selector: "et-contentful-video", inputs: { data: "data", videoClass: "videoClass" }, ngImport: i0, template: `
|
|
183
|
-
<video *ngIf="data" [ngClass]="videoClass" controls>
|
|
184
|
-
<source src="{{ data.url }}" type="{{ data.contentType }}" />
|
|
185
|
-
</video>
|
|
186
|
-
`, isInline: true, dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
187
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.9", ngImport: i0, type: ContentfulVideoComponent, decorators: [{
|
|
188
|
-
type: Component,
|
|
189
|
-
args: [{
|
|
190
|
-
selector: 'et-contentful-video',
|
|
191
|
-
template: `
|
|
192
|
-
<video *ngIf="data" [ngClass]="videoClass" controls>
|
|
193
|
-
<source src="{{ data.url }}" type="{{ data.contentType }}" />
|
|
194
|
-
</video>
|
|
195
|
-
`,
|
|
196
|
-
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
197
|
-
encapsulation: ViewEncapsulation.None,
|
|
198
|
-
standalone: true,
|
|
199
|
-
imports: [NgIf, NgClass],
|
|
200
|
-
}]
|
|
201
|
-
}], propDecorators: { data: [{
|
|
202
|
-
type: Input
|
|
203
|
-
}], videoClass: [{
|
|
204
|
-
type: Input
|
|
205
|
-
}] } });
|
|
206
|
-
|
|
207
27
|
const createRenderCommandsFromContentfulRichText = (options) => {
|
|
208
28
|
const { data, config } = options;
|
|
209
29
|
const commands = [];
|
|
210
|
-
const assetComponents = getAssetComponentsFromConfig(config);
|
|
211
30
|
const resourceMap = createContentfulResourceMap(data.links);
|
|
212
|
-
createContentfulRenderCommand(data.json, { children: commands, payload: data.json.nodeType }, resourceMap, config.useTailwindClasses,
|
|
31
|
+
createContentfulRenderCommand(data.json, { children: commands, payload: data.json.nodeType }, resourceMap, config.useTailwindClasses, config.components, config.customComponents);
|
|
213
32
|
return commands;
|
|
214
33
|
};
|
|
215
34
|
const createContentfulRenderCommand = (node, parent, resourceMap, useTailwindClasses, assetComponents, customComponents) => {
|
|
@@ -296,14 +115,6 @@ const getContentfulNodeProps = (node) => {
|
|
|
296
115
|
value,
|
|
297
116
|
};
|
|
298
117
|
};
|
|
299
|
-
const getAssetComponentsFromConfig = (config) => {
|
|
300
|
-
return {
|
|
301
|
-
file: config.components?.file ?? ContentfulFileComponent,
|
|
302
|
-
image: config.components?.image ?? ContentfulImageComponent,
|
|
303
|
-
video: config.components?.video ?? ContentfulVideoComponent,
|
|
304
|
-
audio: config.components?.audio ?? ContentfulAudioComponent,
|
|
305
|
-
};
|
|
306
|
-
};
|
|
307
118
|
const transformContentfulMarks = (marks, useTailwindClasses) => {
|
|
308
119
|
return marks
|
|
309
120
|
.map((mark) => {
|
|
@@ -369,7 +180,6 @@ const translateContentfulNodeTypeToHtmlTag = (nodeType) => {
|
|
|
369
180
|
// Will be ignored by the renderer
|
|
370
181
|
case 'document':
|
|
371
182
|
return 'document';
|
|
372
|
-
// TODO(TRB): These should render components
|
|
373
183
|
case BLOCKS.EMBEDDED_ENTRY:
|
|
374
184
|
return 'div';
|
|
375
185
|
case INLINES.EMBEDDED_ENTRY:
|
|
@@ -410,7 +220,7 @@ class ContentfulRichTextRendererComponent {
|
|
|
410
220
|
this._document = inject(DOCUMENT);
|
|
411
221
|
this._appRef = inject(ApplicationRef);
|
|
412
222
|
this._injector = inject(Injector);
|
|
413
|
-
this._config = inject(CONTENTFUL_CONFIG, { optional: true }) ??
|
|
223
|
+
this._config = inject(CONTENTFUL_CONFIG, { optional: true }) ?? createContentfulConfig();
|
|
414
224
|
}
|
|
415
225
|
get richText() {
|
|
416
226
|
return this._richText;
|
|
@@ -475,9 +285,9 @@ class ContentfulRichTextRendererComponent {
|
|
|
475
285
|
}
|
|
476
286
|
}
|
|
477
287
|
}
|
|
478
|
-
ContentfulRichTextRendererComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
479
|
-
ContentfulRichTextRendererComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
480
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
288
|
+
ContentfulRichTextRendererComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.0", ngImport: i0, type: ContentfulRichTextRendererComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
289
|
+
ContentfulRichTextRendererComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.0", type: ContentfulRichTextRendererComponent, isStandalone: true, selector: "et-contentful-rich-text-renderer", inputs: { richText: "richText" }, host: { classAttribute: "et-contentful-rich-text-renderer" }, ngImport: i0, template: ``, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
290
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0", ngImport: i0, type: ContentfulRichTextRendererComponent, decorators: [{
|
|
481
291
|
type: Component,
|
|
482
292
|
args: [{
|
|
483
293
|
selector: 'et-contentful-rich-text-renderer',
|
|
@@ -521,14 +331,14 @@ class ContentfulAudioComponent {
|
|
|
521
331
|
}
|
|
522
332
|
}
|
|
523
333
|
}
|
|
524
|
-
ContentfulAudioComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
525
|
-
ContentfulAudioComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
334
|
+
ContentfulAudioComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.0", ngImport: i0, type: ContentfulAudioComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
335
|
+
ContentfulAudioComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.0", type: ContentfulAudioComponent, isStandalone: true, selector: "et-contentful-audio", inputs: { data: "data", audioClass: "audioClass", figureClass: "figureClass", figcaptionClass: "figcaptionClass" }, ngImport: i0, template: `
|
|
526
336
|
<figure *ngIf="data" [ngClass]="figureClass">
|
|
527
337
|
<figcaption [ngClass]="figcaptionClass">{{ data.title }}</figcaption>
|
|
528
338
|
<audio [ngClass]="audioClass" controls src="{{ data.url }}"></audio>
|
|
529
339
|
</figure>
|
|
530
340
|
`, isInline: true, dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
531
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
341
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0", ngImport: i0, type: ContentfulAudioComponent, decorators: [{
|
|
532
342
|
type: Component,
|
|
533
343
|
args: [{
|
|
534
344
|
selector: 'et-contentful-audio',
|
|
@@ -553,10 +363,195 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.9", ngImpor
|
|
|
553
363
|
type: Input
|
|
554
364
|
}] } });
|
|
555
365
|
|
|
366
|
+
class ContentfulFileComponent {
|
|
367
|
+
constructor() {
|
|
368
|
+
this._richTextData = inject(RICH_TEXT_RENDERER_COMPONENT_DATA, { optional: true });
|
|
369
|
+
this._data = null;
|
|
370
|
+
this.fileClass = null;
|
|
371
|
+
}
|
|
372
|
+
get data() {
|
|
373
|
+
return this._data;
|
|
374
|
+
}
|
|
375
|
+
set data(v) {
|
|
376
|
+
if (v && !v.contentType) {
|
|
377
|
+
this._data = null;
|
|
378
|
+
console.warn('The provided asset is invalid', v);
|
|
379
|
+
return;
|
|
380
|
+
}
|
|
381
|
+
this._data = v ?? null;
|
|
382
|
+
}
|
|
383
|
+
ngOnInit() {
|
|
384
|
+
if (this._richTextData && !this.data) {
|
|
385
|
+
this.data = this._richTextData;
|
|
386
|
+
}
|
|
387
|
+
}
|
|
388
|
+
}
|
|
389
|
+
ContentfulFileComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.0", ngImport: i0, type: ContentfulFileComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
390
|
+
ContentfulFileComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.0", type: ContentfulFileComponent, isStandalone: true, selector: "et-contentful-file", inputs: { data: "data", fileClass: "fileClass" }, ngImport: i0, template: `
|
|
391
|
+
<a *ngIf="data" [href]="data.url" [ngClass]="fileClass" class="underline" target="_blank">
|
|
392
|
+
{{ data.title }} ({{ data.size }} Bytes)
|
|
393
|
+
</a>
|
|
394
|
+
`, isInline: true, dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
395
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0", ngImport: i0, type: ContentfulFileComponent, decorators: [{
|
|
396
|
+
type: Component,
|
|
397
|
+
args: [{
|
|
398
|
+
selector: 'et-contentful-file',
|
|
399
|
+
template: `
|
|
400
|
+
<a *ngIf="data" [href]="data.url" [ngClass]="fileClass" class="underline" target="_blank">
|
|
401
|
+
{{ data.title }} ({{ data.size }} Bytes)
|
|
402
|
+
</a>
|
|
403
|
+
`,
|
|
404
|
+
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
405
|
+
encapsulation: ViewEncapsulation.None,
|
|
406
|
+
standalone: true,
|
|
407
|
+
imports: [NgIf, NgClass],
|
|
408
|
+
}]
|
|
409
|
+
}], propDecorators: { data: [{
|
|
410
|
+
type: Input
|
|
411
|
+
}], fileClass: [{
|
|
412
|
+
type: Input
|
|
413
|
+
}] } });
|
|
414
|
+
|
|
415
|
+
class ContentfulImageComponent {
|
|
416
|
+
constructor() {
|
|
417
|
+
this._richTextData = inject(RICH_TEXT_RENDERER_COMPONENT_DATA, { optional: true });
|
|
418
|
+
this._data = null;
|
|
419
|
+
this.imgClass = null;
|
|
420
|
+
this.pictureClass = null;
|
|
421
|
+
this._priority = false;
|
|
422
|
+
}
|
|
423
|
+
get data() {
|
|
424
|
+
return this._data;
|
|
425
|
+
}
|
|
426
|
+
set data(v) {
|
|
427
|
+
if (v && !v.contentType) {
|
|
428
|
+
this._data = null;
|
|
429
|
+
console.warn('The provided asset is invalid', v);
|
|
430
|
+
return;
|
|
431
|
+
}
|
|
432
|
+
if (v && !v.contentType.startsWith('image/')) {
|
|
433
|
+
throw new Error('The provided asset is not an image');
|
|
434
|
+
}
|
|
435
|
+
this._data = v ?? null;
|
|
436
|
+
}
|
|
437
|
+
get priority() {
|
|
438
|
+
return this._priority;
|
|
439
|
+
}
|
|
440
|
+
set priority(value) {
|
|
441
|
+
this._priority = coerceBooleanProperty(value);
|
|
442
|
+
}
|
|
443
|
+
ngOnInit() {
|
|
444
|
+
if (this._richTextData && !this.data) {
|
|
445
|
+
this.data = this._richTextData;
|
|
446
|
+
}
|
|
447
|
+
}
|
|
448
|
+
}
|
|
449
|
+
ContentfulImageComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.0", ngImport: i0, type: ContentfulImageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
450
|
+
ContentfulImageComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.0", type: ContentfulImageComponent, isStandalone: true, selector: "et-contentful-image", inputs: { data: "data", imgClass: "imgClass", pictureClass: "pictureClass", priority: "priority" }, ngImport: i0, template: `
|
|
451
|
+
<picture *ngIf="data" [ngClass]="pictureClass">
|
|
452
|
+
<source srcset="{{ data.url }}?fm=avif" type="image/avif" />
|
|
453
|
+
<source srcset="{{ data.url }}?fm=webp" type="image/webp" />
|
|
454
|
+
<source srcset="{{ data.url }}?fm=jpg" type="image/jpeg" />
|
|
455
|
+
<img
|
|
456
|
+
[attr.alt]="data.description ?? undefined"
|
|
457
|
+
[width]="data.width ?? undefined"
|
|
458
|
+
[height]="data.height ?? undefined"
|
|
459
|
+
[priority]="data.priority ?? priority"
|
|
460
|
+
[ngClass]="imgClass"
|
|
461
|
+
ngSrc="{{ data.url }}"
|
|
462
|
+
/>
|
|
463
|
+
</picture>
|
|
464
|
+
`, isInline: true, dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgOptimizedImage, selector: "img[ngSrc]", inputs: ["ngSrc", "ngSrcset", "sizes", "width", "height", "loading", "priority", "disableOptimizedSrcset", "fill", "src", "srcset"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
465
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0", ngImport: i0, type: ContentfulImageComponent, decorators: [{
|
|
466
|
+
type: Component,
|
|
467
|
+
args: [{
|
|
468
|
+
selector: 'et-contentful-image',
|
|
469
|
+
template: `
|
|
470
|
+
<picture *ngIf="data" [ngClass]="pictureClass">
|
|
471
|
+
<source srcset="{{ data.url }}?fm=avif" type="image/avif" />
|
|
472
|
+
<source srcset="{{ data.url }}?fm=webp" type="image/webp" />
|
|
473
|
+
<source srcset="{{ data.url }}?fm=jpg" type="image/jpeg" />
|
|
474
|
+
<img
|
|
475
|
+
[attr.alt]="data.description ?? undefined"
|
|
476
|
+
[width]="data.width ?? undefined"
|
|
477
|
+
[height]="data.height ?? undefined"
|
|
478
|
+
[priority]="data.priority ?? priority"
|
|
479
|
+
[ngClass]="imgClass"
|
|
480
|
+
ngSrc="{{ data.url }}"
|
|
481
|
+
/>
|
|
482
|
+
</picture>
|
|
483
|
+
`,
|
|
484
|
+
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
485
|
+
encapsulation: ViewEncapsulation.None,
|
|
486
|
+
standalone: true,
|
|
487
|
+
imports: [NgIf, NgClass, NgOptimizedImage],
|
|
488
|
+
}]
|
|
489
|
+
}], propDecorators: { data: [{
|
|
490
|
+
type: Input
|
|
491
|
+
}], imgClass: [{
|
|
492
|
+
type: Input
|
|
493
|
+
}], pictureClass: [{
|
|
494
|
+
type: Input
|
|
495
|
+
}], priority: [{
|
|
496
|
+
type: Input
|
|
497
|
+
}] } });
|
|
498
|
+
|
|
499
|
+
class ContentfulVideoComponent {
|
|
500
|
+
constructor() {
|
|
501
|
+
this._richTextData = inject(RICH_TEXT_RENDERER_COMPONENT_DATA, { optional: true });
|
|
502
|
+
this._data = null;
|
|
503
|
+
this.videoClass = null;
|
|
504
|
+
}
|
|
505
|
+
get data() {
|
|
506
|
+
return this._data;
|
|
507
|
+
}
|
|
508
|
+
set data(v) {
|
|
509
|
+
if (v && !v.contentType) {
|
|
510
|
+
this._data = null;
|
|
511
|
+
console.warn('The provided asset is invalid', v);
|
|
512
|
+
return;
|
|
513
|
+
}
|
|
514
|
+
if (v && !v.contentType.startsWith('video/')) {
|
|
515
|
+
throw new Error('The provided asset is not an video');
|
|
516
|
+
}
|
|
517
|
+
this._data = v ?? null;
|
|
518
|
+
}
|
|
519
|
+
ngOnInit() {
|
|
520
|
+
if (this._richTextData && !this.data) {
|
|
521
|
+
this.data = this._richTextData;
|
|
522
|
+
}
|
|
523
|
+
}
|
|
524
|
+
}
|
|
525
|
+
ContentfulVideoComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.0", ngImport: i0, type: ContentfulVideoComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
526
|
+
ContentfulVideoComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.0", type: ContentfulVideoComponent, isStandalone: true, selector: "et-contentful-video", inputs: { data: "data", videoClass: "videoClass" }, ngImport: i0, template: `
|
|
527
|
+
<video *ngIf="data" [ngClass]="videoClass" controls>
|
|
528
|
+
<source src="{{ data.url }}" type="{{ data.contentType }}" />
|
|
529
|
+
</video>
|
|
530
|
+
`, isInline: true, dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
531
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0", ngImport: i0, type: ContentfulVideoComponent, decorators: [{
|
|
532
|
+
type: Component,
|
|
533
|
+
args: [{
|
|
534
|
+
selector: 'et-contentful-video',
|
|
535
|
+
template: `
|
|
536
|
+
<video *ngIf="data" [ngClass]="videoClass" controls>
|
|
537
|
+
<source src="{{ data.url }}" type="{{ data.contentType }}" />
|
|
538
|
+
</video>
|
|
539
|
+
`,
|
|
540
|
+
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
541
|
+
encapsulation: ViewEncapsulation.None,
|
|
542
|
+
standalone: true,
|
|
543
|
+
imports: [NgIf, NgClass],
|
|
544
|
+
}]
|
|
545
|
+
}], propDecorators: { data: [{
|
|
546
|
+
type: Input
|
|
547
|
+
}], videoClass: [{
|
|
548
|
+
type: Input
|
|
549
|
+
}] } });
|
|
550
|
+
|
|
556
551
|
class ContentfulModule {
|
|
557
552
|
}
|
|
558
|
-
ContentfulModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
559
|
-
ContentfulModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
|
|
553
|
+
ContentfulModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.0", ngImport: i0, type: ContentfulModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
554
|
+
ContentfulModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.0.0", ngImport: i0, type: ContentfulModule, imports: [ContentfulAudioComponent,
|
|
560
555
|
ContentfulFileComponent,
|
|
561
556
|
ContentfulImageComponent,
|
|
562
557
|
ContentfulVideoComponent,
|
|
@@ -565,12 +560,12 @@ ContentfulModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", versio
|
|
|
565
560
|
ContentfulImageComponent,
|
|
566
561
|
ContentfulVideoComponent,
|
|
567
562
|
ContentfulRichTextRendererComponent] });
|
|
568
|
-
ContentfulModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
|
|
563
|
+
ContentfulModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.0.0", ngImport: i0, type: ContentfulModule, imports: [ContentfulAudioComponent,
|
|
569
564
|
ContentfulFileComponent,
|
|
570
565
|
ContentfulImageComponent,
|
|
571
566
|
ContentfulVideoComponent,
|
|
572
567
|
ContentfulRichTextRendererComponent] });
|
|
573
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
568
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0", ngImport: i0, type: ContentfulModule, decorators: [{
|
|
574
569
|
type: NgModule,
|
|
575
570
|
args: [{
|
|
576
571
|
imports: [
|
|
@@ -590,9 +585,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.9", ngImpor
|
|
|
590
585
|
}]
|
|
591
586
|
}] });
|
|
592
587
|
|
|
588
|
+
const provideContentfulConfig = (contentfulConfig = {}) => {
|
|
589
|
+
return { provide: CONTENTFUL_CONFIG, useValue: createContentfulConfig(contentfulConfig) };
|
|
590
|
+
};
|
|
591
|
+
|
|
593
592
|
/**
|
|
594
593
|
* Generated bundle index. Do not edit.
|
|
595
594
|
*/
|
|
596
595
|
|
|
597
|
-
export { CONTENTFUL_CONFIG, ContentfulAudioComponent,
|
|
596
|
+
export { CONTENTFUL_CONFIG, ContentfulAudioComponent, ContentfulFileComponent, ContentfulImageComponent, ContentfulModule, ContentfulRichTextRendererComponent, ContentfulVideoComponent, RICH_TEXT_RENDERER_COMPONENT_DATA, createContentfulConfig, createContentfulMap, createContentfulRenderCommand, createContentfulResourceMap, createRenderCommandsFromContentfulRichText, getContentfulNodeProps, provideContentfulConfig, transformContentfulMarks, translateContentfulNodeTypeToHtmlTag };
|
|
598
597
|
//# sourceMappingURL=ethlete-contentful.mjs.map
|